/* Lato: https://fonts.google.com/specimen/Lato?selection.family=Lato */
@import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900');

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	padding: 0;
	font-family: Lato, Verdana, Arial, Helvetica, sans-serif;
	word-wrap:break-word;
	color:#000;
}

a {
	text-decoration:none;
}

	a.anchor {
		position:absolute;
		padding-top:50px;
		margin-top:-50px;
	}

sup {
	vertical-align:text-top;
}


img {
	max-height:100%;
	max-width:100%;
}

.bold {
	font-weight:bold;
}

/* Header */
header {
	position:fixed;
	top:0;
	left:0;
	right:0;
	height:50px;
	width:100%;
	margin:auto;
	background:#fff;
	box-sizing: border-box;
	min-width:320px;
	max-width:1920px;
	z-index:999;
}

div#header_wrapper {
	height:100%;
	width:100%;
}

	div#header_wrapper div.top_header_title,
	div#header_wrapper div.page_header_title {
		position:relative;
		height:50px;
		width:100%;
		margin:auto;
		background:#8198AD;
	}

	div#header_wrapper div.page_header_title {
		background:#E4EAF4;
	}

		div#header_wrapper div.top_header_title span,
		div#header_wrapper div.page_header_title span {
			display: inline-block;
			height: 100%;
			width: 100%;
			padding:0 20px;
			line-height: 50px;
			font-weight: bold;
			font-size: 21px;
			color: #fff;
			box-sizing:border-box;
			white-space: nowrap;
		}

		div#header_wrapper div.page_header_title span {
			color: #000;
			padding-right:50px;
		}

		div#header_wrapper div.page_header_title a {
			position:absolute;
			top:0;
			right:10px;
			bottom:0;
			display: block;
			height: 32px;
			width: 32px;
			margin:auto;
		}


/* Main */
main {
	display:block;
	height:100%;
	width:100%;
	margin:auto;
	padding:50px 20px 100px;
	box-sizing: border-box;
	background:#fff;
	min-width:320px;
	max-width:1920px;
}


/* Index */
.top_menu_list {
	max-width:400px;
	margin:30px auto 45px;
	border-radius:10px;
	background:#F6F7FB;
	overflow:hidden;
}

	.top_menu_child {
		width:100%;
	}

		.top_menu_child a {
			position:relative;
			display:block;
			height:100%;
			width:100%;
			-webkit-tap-highlight-color: rgba(82, 87, 103, 0.5);
			tap-highlight-color: rgba(82, 87, 103, 0.5);
		}

			.top_menu_child a span {
				position:relative;
				display:block;
				height:100%;
				width:auto;
				padding:10px 0;
				margin:0 18px;
				box-sizing:border-box;
				border-bottom:2px solid #E4EAF4;
				font-size: 18px;
				font-weight:bold;
				color:#000;
			}

				.top_menu_child:last-child a span {
					border-bottom:0;
				}

				.top_menu_child a span:after {
					content:"";
					position:absolute;
					top:0;
					right:0;
					bottom:0;
					margin:auto;
					height:32px;
					width:32px;
					background-image:url("../img/arrow.png") ;
					background-size: 100%;
					background-repeat: no-repeat;
					background-position: center;
				}

p.top_text {
	margin:1em 0;
	font-size:15px;
}

/* Page */
section.page_section {
	padding-bottom:50px;
}

h2.page_section_title {
	display:flex;
	width:100%;
	font-size: 20px;
	font-weight:bold;
	border-bottom:2px solid #E4EAF4;
	margin:0.5em 0;
	align-items: baseline;
}

	h2.page_section_title div.left {
		white-space: nowrap;
		padding-right:0.5em;
	}

	h2.page_section_title div.right {
	}

.page_step {
	margin:auto auto 20px;
}

.page_step_title {
	display:flex;
	width:100%;
	font-size: 19px;
	font-weight:bold;
	margin-bottom:0.5em;
	align-items: baseline;
}

	.page_step_title div.left {
		white-space: nowrap;
	}

	.page_step_title div.right {
	}

.page_circle_title {
	padding-left:1em;
	text-indent:-1em;
	font-size: 19px;
	font-weight:bold;
	margin-bottom:0.5em;
}

	.page_circle_title:before {
		content:"\25CF";
		font-size:20px;
		display: inline-block;
		width: 1em;
		text-indent: 0;
	}

.page_square_title {
	padding-left:1em;
	text-indent:-1em;
	font-size: 16px;
	margin-bottom:0.5em;
}

	.page_square_title:before {
		content:"\25A0";
		font-size:16px;
	}

.page_text {
	margin:0.5em 0;
	font-size:16px;
}

.page_number_text {
	display:flex;
	width:100%;
	font-size: 16px;
	margin-bottom:0.5em;
	align-items: baseline;
}

	.page_number_text div.left {
		white-space: nowrap;
	}

	.page_number_text div.right {
	}

.page_img {
	width:60%;
	margin:auto;
	text-align:center;
}

	.page_img.inquiry {
		width:90%;
	}

	.page_img.pc {
		width:100%;
	}

.page_img_icon {
	height:1.4em;
	width:auto;
	max-height:32px;
	margin:0 0.3em 0.1em;
	vertical-align:middle;
}

ul {
	padding-left:1.5em;
	margin:0 0 0.5em;
	font-size:16px;
}

.align_right {
	text-align:right;
}

/*--Memo--*/
div.page_memo {
	margin:auto auto 20px;
	padding:10px;
	border-radius:10px;
	background:#F6F7FB;
}


/*--Attention--*/
.page_attention_text {
	padding-left:1em;
	text-indent:-1em;
	margin:0.5em 0;
	font-size:16px;
}

	.page_attention_text:before {
		content:"\*";
		font-size:16px;
		width: 1em;
		text-indent: 0;
		display: inline-block;
	}

	.page_attention_text.mb0 {
		margin-bottom:0;
	}

.step {
	margin-left:20px;
}
.case {
	display: inline-block;
	text-indent: 0.75em;
	position:relative;
	margin-top: 0;
}
.case::after {
	position: absolute;
	top: 0.35em;
	left: 0.2em;
	width: 0.5em;
	height: 0.5em;
	border-bottom: 1px solid #333;
	border-left: 1px solid #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	content: "";
}
.case::before {
	position: absolute;
	top: 0.35em;
	right: -0.6em;
	width: 0.5em;
	height: 0.5em;
	border-top: 1px solid #333;
	border-right: 1px solid #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	content: "";
}

/* Table */
table {
	table-layout:fixed;
	border-collapse: collapse;
	width:100%;
	margin:0.5em auto;
}

table td,th {
	border:1px solid #000;
	padding:10px;
	font-size:16px;
}

	table .table_gray {
		background:lightgray;
	}

/* Footer */
footer {
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	height:40px;
	width:100%;
	margin:auto;
	background:#fff;
	box-sizing: border-box;
	min-width:320px;
	max-width:1920px;
	z-index:999;
}

div#footer_wrapper {
	position:relative;
	display:flex;
	height:100%;
	width:100%;
}

	div#footer_wrapper div {
		position:absolute;
		top:0;
		bottom:0;
		height:100%;
		width:33%;
		margin:auto;
	}

		div#footer_wrapper div a {
			display:block;
			height:100%;
			width:100%;
			border-radius:10px;
			background:#8198AD;
		}

			div#footer_wrapper div a span {
				display:inline-block;
				height:100%;
				width:100%;
				text-align: center;
				line-height: 40px;
				font-size:18px;
				color:#fff;
				box-sizing:border-box;
			}

	div#footer_wrapper div.left {
		left:0;
	}

		div#footer_wrapper div.left a span {
			padding-left:20px;
		}

		div#footer_wrapper div.left span:after,
		div#footer_wrapper div.right span:after {
			position:absolute;
			top:0;
			left:20px;
			bottom:0;
			margin:auto;
			content:"";
			height:100%;
			width:16px;
			background-image:url("../img/arrow_footer.png");
			background-size: 100%;
			background-position: center;
			background-repeat:no-repeat;
			transform: scale(-1, 1);
		}

	div#footer_wrapper div.right {
		right:0;
	}

		div#footer_wrapper div.right a span {
			padding-right:20px;
		}

		div#footer_wrapper div.right span:after {
			left:auto;
			right:20px;
			content:"";
			transform: scale(1, 1);
		}

	div#footer_wrapper div.center {
		left:0;
		right:0;
	}

/*PageTop*/
#page-top {
	position:absolute;
	right:3%;
	bottom:50px;
	display:block;
	height:44px;
	width:44px;
}

.pc_only {
	display:none;
}


/*PC*/
@media screen and (min-width:768px),print {
	.pc_only {
		display:block;
	}

	a.anchor {
		padding-top:160px;
		margin-top:-160px;
	}

	/* Header */
	header {
		height:auto;
		width:90%;
	}

		div#header_wrapper div.top_header_title {
			height:60px;
		}

			div#header_wrapper div.top_header_title.pc_only {
				margin-bottom:60px;
			}

		div#header_wrapper div.page_header_title {
			height:40px;
		}

			div#header_wrapper div.top_header_title span {
				padding:0 24px;
				line-height: 60px;
				font-size: 32px;
			}

			div#header_wrapper div.page_header_title span {
				padding:0 8px;
				line-height: 40px;
				font-size: 24px;
			}

			div#header_wrapper div.page_header_title a {
				right:20px;
			}

	/* Main */
	main {
		width:90%;
		padding:160px 0;
	}

	/* Index */
	.top_menu_list {
		width:500px;
		max-width:500px;
		margin:0 auto 60px;
	}

			.top_menu_child a:hover:before {
				content:"";
				position:absolute;
				top:0;
				left:0;
				display:block;
				height:100%;
				width:100%;
				background: rgba(82, 87, 103, 0.5);
				z-index:2;
			}

				.top_menu_child a span {
					margin:0 30px;
					font-size: 25px;
				}

					.top_menu_child a span:after {
						height:42px;
						width:42px;
					}

	/* Page */
	section.page_section {
	}

	.page_step {
		display:flex;
		margin:auto auto 40px;
	}

		.page_step > div {
			width:100%;
		}

		.page_step > .page_left {
			width:60%;
			padding-right:10px;
			box-sizing:border-box;
		}

		.page_step > .page_right {
			width:40%;
			margin-top:0;
		}

	h2.page_section_title {
		font-size: 24px;
	}

	.page_img {
		max-width:400px;
	}

		.page_img.inquiry {
			max-width:500px;
			text-align:right;
		}

		.page_img.page_right {
			width:40%;
			text-align:right;
		}
		.page_img.pc{
			max-width:800px;
		}

	ul {
	}

	/*--Memo--*/
	div.page_memo {
		padding:24px;
		margin:auto auto 40px;
	}

		div.page_memo > div {
			display:flex;
		}

			div.page_memo > div > div.page_left {
				width:60%;
				padding-right:10px;
				box-sizing:border-box;
			}

			div.page_memo > div > div.page_right {
				width:40%;
			}


	/*--Attention--*/
	.page_attention_text {
	}

		.page_attention_text:before {
		}

	/* Footer */
	footer {
		height:40px;
		width:90%;
	}

			div#footer_wrapper div a span {
				line-height: 40px;
				font-size:23px;
			}

		div#footer_wrapper div.left a span {
			padding-left:22px;
		}

		div#footer_wrapper div.left span:after,
		div#footer_wrapper div.right span:after {
			left:34%;
			width:18px;
		}

		div#footer_wrapper div.right a span {
			padding-right:24px;
		}

		div#footer_wrapper div.right span:after {
			left:auto;
			right:34%;
		}

	/*PageTop*/
	#page-top {
		right:0;
		bottom:80px;
		height:50px;
		width:50px;
	}

}

@media print{
	header {
		position:relative;
	}

		div#header_wrapper div.top_header_title.pc_only {
			display:none;
		}

	main {
		padding:30px 0;
	}

	footer {
		display:none;
		position:relative;
	}
}