@charset "UTF-8";



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/



/* ++++++++++++++++++++++++++++++++++++++++++++++    PC    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* 801px ~ */
@media screen and (min-width: 801px), print {

.mainArea {
	position: relative;
}
	.mainArea .mainimg {
		min-height: 700px;
		}
	.slider li {
		width: 1400px;
		height: 700px;
		background-size: cover;
		}
		.slider li img {
			max-width: none !important;
			width: 100%;
			}
		.mainArea .maintxt {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			width: 338px;
			height: 348px;
			margin: auto;
			z-index: 1;
			}
	.readArea {
		width: 1400px;
		text-align: center;
		margin:-90px auto 80px;
		position: relative;
		background-color: #fff;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		}
		.readArea .read_tit {
			width: 360px;
			margin: 0px auto 60px;
			padding-top: 60px;
			}
		.readArea ul {
			display: inline-block;
			margin: auto;
			margin-left: -10px;
			width: calc(100% - 100px);
			}
		.readArea ul li {
			float: left;
			width: 20%;
			max-width: 223px;
			padding-left: 10px;
			box-sizing: border-box;
			}
	.read_btm {
		background-image: url("../img/read_bg.jpg");
		background-size: cover;
		background-repeat: no-repeat;
		color: #fff;
		text-align: center;
		padding:160px 0;
		}
		.read_btm dl {
			line-height: 1.4;
			font-weight: bold;
			letter-spacing: 3px;
			margin-bottom:80px;
			}
			.read_btm dl dt {
			font-size: 28px;
				}
			.read_btm dl dd {
				margin-top: 8px;
				font-size: 36px;
				}
		.read_btm p {
			font-size: 16px;
			font-weight: bold;
			line-height: 2;
			letter-spacing: 1px;
			}
		.read_btm p + p {
			margin-top: 2em;
			}
		.knowArea {
			background-color: #8CCDBE;
			padding-bottom: 55px;
			position: relative;
			}
			.knowArea .know {
				position: relative;
				}
				.knowArea .know dl {
					float: left;
					color: #fff;
					font-weight: bold;
					width: 600px;
					padding: 95px 0;
					text-align: center;
					}
					.knowArea .know dl dt {
						font-size: 38px;
						line-height: 1.4;
						margin-bottom: 20px;
						}
						.knowArea .know dl dt span {
						color: #FFD500;
							}
					.knowArea .know dl dd {
						line-height: 2.5;
						}
				.knowArea .know_img {
					width: calc(100% - 660px);
					max-width: 780px;
					position: absolute;
					right: 0;
					top: 0;
					background-image: url(../img/know_img.jpg);
					background-repeat: no-repeat;
					height: 100%;
					}
		.knowblock {
			background: #fff;
			border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			padding: 70px 60px;
			position: relative;
			z-index: 1;
			}
		.knowblock + .knowblock {
			margin-top: 30px;
			}
			.knowblock .know_tit {
				text-align: center;
				margin-bottom: 40px;
				}
				.knowblock .know_tit dt::before ,
				.knowblock .know_tit dt::after {
				content: "";
				position: absolute;
				background-color: #A9151A;
				width: 44px;
				height: 3px;
				top: 0;
				bottom: 0;
				margin: auto;
				}
				.knowblock .know_tit dt::before {
					left: -64px;
					}
				.knowblock .know_tit dt::after {
					right: -64px;
					}
				.knowblock .know_tit dt {
					font-weight: bold;
					letter-spacing: 3px;
					margin-bottom: 50px;
					font-size: 20px;
					position: relative;
					display: inline-block;
					}
					.knowblock .know_tit dt span {
						color: #A9151A;
						}
				.knowblock .know_tit dd {
					font-size: 20px;
					font-weight: bold;
					}
			.knowblock ul {
				}
				.knowblock ul li {
					float: left;
					width: calc(33.33% - 2px);
					}
				.knowblock ul li + li {
					border-left: 1px #CDE9E3 solid;
					}
					.knowblock ul li div {
						max-width: 340px;
						margin: 20px auto;
						}
					.partblock ul li div {
						max-width: 375px;
						}


	#yoko {
		background: #ffd956;
		padding: 100px 0;
	}
	#yoko h3 {
		text-align:  center;
		font-size: 36px;
		margin-bottom: 40px;
	}
	#yoko .area {
		width: 1040px;
		margin: 0 auto;
	}
	#yoko .area .staff {
		width: 510px;
		float: left;
		background: #FFF;
		
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	#yoko .area .part {
		width: 510px;
		float: right;
		background: #FFF;
		
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	
	#yoko .area dl {
		padding: 60px 0;
		text-align: center;
	}
		#yoko .area dt {
			width: 304px;
			margin: 0 auto;
		}
		#yoko .area dt img {
			width: 100%;
			height: auto;
		}
	
		#yoko .area dd {
			font-weight: bold;
		}
		#yoko .area dd h4 {
			font-size: 180%;
			margin: 15px 0;
		}
		#yoko .area dd h4 strong {
			color: #a9151a;
		}
	
		#yoko .area dd .btn {
			width: 322px;
			margin: 0 auto;
			margin-top: 20px;
		}
		#yoko .area dd .btn img {
			width: 100%;
			height: auto;
		}

	
	
	
	#faq {
		padding: 100px 0;
	}
	#faq h3 {
		text-align:  center;
		font-size: 36px;
		margin-bottom: 40px;
	}
	#faq h3 strong {
		color: #a9151a;
	}
	#faq h3 span {
		display: block;
		font-size: 14px;
	}
	#faq .area {
		width: 1120px;
		margin: 0 auto;
	}
	
	#faq .area dl {
		padding: 30px;
	}
	
	
	#faq .area .staff {
		width: 550px;
		float: left;
	}
	#faq .area .part {
		width: 550px;
		float: right;
	}
	#faq .area p.tt {
		text-align: center;
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	#faq .area p.tt strong {
		color: #a9151a;
	}
		#faq .area .faq_wrap {
			border: solid 3px #eaeaea;

			border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
		}
	
	.faq_wrap dl {
		border-bottom: solid 1px #d6d6d6;
		}
	.faq_wrap dl:last-child {
		border-bottom: none;
		}
	
	
	.faq_wrap dl dt p:nth-of-type(1){
		float:left;
		width:30px;
		box-sizing:border-box;
		margin-right: 10px;
		}
	.faq_wrap dl dt p:nth-of-type(1) img {
		width: 100%;
		height: auto;
		}
	.faq_wrap dl dt p:nth-of-type(2){
		float:left;
		width:400px;
		}
	
	
	
	
	
	.faq_wrap dl dt{
		cursor:pointer;
		position:relative;
		overflow:hidden;
		font-size: 116%;
		font-weight: bold;
		}
	/*.faq_wrap dl dt::after{
		content:"";
		background-image:url(../common/img/arrow_bottom.png);
		position:absolute;
		width:10px;
		height:6px;
		right:0;
		top:50%;
		margin-top:-17px;
		background-size: 10px 6px;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transition: 500ms;
		-webkit-transition: 500ms;
		}
	.faq_wrap dl dt.on::after{
		background-image:url(../common/img/arrow_top.png);
		transition: 500ms;
		-webkit-transition: 500ms;
		}*/
	.faq_wrap dl dd{
		display:none;
		padding:25px;
		overflow:hidden;
		}


	#interview {
		background: #8cb6cf;
		padding: 100px 0;
		color: #FFF;
	}
	#interview h3 {
		text-align:  center;
		font-size: 36px;
		margin-bottom: 30px;
	}
	#interview h3 strong{
		color: #ffd500;
	}
	#interview p {
		text-align: center;
		font-weight: bold;
		font-size: 115%;
		margin-bottom: 50px;
	}
	#interview .area {
		width: 1000px;
		margin: 0 auto;
	}
	
	#interview ul {
		text-align: center;
	}
	#interview li {
		width: 362px;
		display: inline-block;
		margin: 20px;
	}
	#interview li img {
		width: 100%;
		height: auto;
	}




}













/* ++++++++++++++++++++++++++++++++++++++++++++++    sp    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* ~ 800px */
@media only screen and (max-width: 800px) {


.mainArea {
	position: relative;
}
	.mainArea .mainimg {
		min-height: 220px;
		}
	.slider li {
		height: 220px;
		background-size: cover;
		background-position: center;		}
		.slider li img {
			max-width: none !important;
			width: 100%;
			}
		.mainArea .maintxt {
			position: absolute;
			top: 0;
			bottom: 10px;
			left: 0;
			right: 0;
			width: 130px;
			height: 134px;
			margin: auto;
			z-index: 1;
			}



	.readArea {
		width: 90%;
		text-align: center;
		margin:-30px auto 40px;
		position: relative;
		background-color: #fff;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		}
	.readArea > div {
		padding: 0;
		}
		.readArea .read_tit {
			width: 80%;
			max-width: 360px;
			margin: 0px auto 40px;
			padding-top: 40px;
			}
		.readArea ul {
			width: 100%;
			margin: auto;
			}
		.readArea ul li {
			display: inline-block;
			width: calc(50% - 10px);
			padding-left: 10px;
			box-sizing: border-box;
			}
		.readArea ul li:nth-child(n+3) {
			margin-top: 10px;
			}
		.readArea ul li:nth-child(odd) {
			margin-left: -10px;
			}
	.read_btm {
		background-image: url("../img/read_bg.jpg");
		background-size: cover;
		background-repeat: no-repeat;
		color: #fff;
		padding:60px 5%;
		}
		.read_btm dl {
			line-height: 1.4;
			font-weight: bold;
			letter-spacing: 3px;
			margin-bottom:40px;
			}
			.read_btm dl dt {
			font-size: 22px;
				}
			.read_btm dl dd {
				margin-top: 8px;
				font-size: 28px;
				}
		.read_btm p {
			font-size: 15px;
			font-weight: bold;
			line-height: 2;
			letter-spacing: 1px;
			}
		.read_btm p + p {
			margin-top: 2em;
			}
		.knowArea {
			background-color: #8CCDBE;
			padding-bottom: 40px;
			position: relative;
			}
			.knowArea .know {
				position: relative;
				}
				.knowArea .know dl {
					float: left;
					color: #fff;
					font-weight: bold;
					padding: 40px 0;
					}
					.knowArea .know dl dt {
						font-size: 30px;
						line-height: 1.4;
						margin-bottom: 20px;
						}
						.knowArea .know dl dt span {
						color: #FFD500;
							}
					.knowArea .know dl dd {
						line-height: 2.5;
						}
				.knowArea .know_img {
					max-width: 780px;
					}
		.knowblock {
			width: 90%;
			box-sizing: border-box;
			margin: -25px auto 0;
			background: #fff;
			border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			padding: 35px 5% 35px;
			position: relative;
			z-index: 1;
			}
		.knowblock + .knowblock {
			margin-top: 20px;
			}
			.knowblock .know_tit {
				text-align: center;
				margin-bottom: 40px;
				}
				.knowblock .know_tit dt::before ,
				.knowblock .know_tit dt::after {
				content: "";
				position: absolute;
				background-color: #A9151A;
				width: 44px;
				height: 3px;
				top: 0;
				bottom: 0;
				margin: auto;
				}
				.knowblock .know_tit dt::before {
					left: -64px;
					}
				.knowblock .know_tit dt::after {
					right: -64px;
					}
				.knowblock .know_tit dt {
					font-weight: bold;
					letter-spacing: 3px;
					margin-bottom: 25px;
					font-size: 20px;
					position: relative;
					display: inline-block;
					}
					.knowblock .know_tit dt span {
						color: #A9151A;
						}
				.knowblock .know_tit dd {
					font-size: 18px;
					font-weight: bold;
					}
			.knowblock ul {
				}
				.knowblock ul li {
					float: left;
					}
				.knowblock ul li + li {
					padding-top: 40px;
					margin-top: 40px;
					border-top: 1px #CDE9E3 solid;
					}
					.knowblock ul li div {
						margin: 0 auto;
						}
					.partblock ul li div {
						}


	#yoko {
		background: #ffd956;
		padding: 6% 3%;
	}
	#yoko h3 {
		text-align:  center;
		font-size: 20px;
		margin-bottom: 5%;
	}
	#yoko .area {
	}
	#yoko .area .staff {
		background: #FFF;
		margin-bottom: 3%;
		
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	#yoko .area .part {
		background: #FFF;
		
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	
	#yoko .area dl {
		padding: 8%;
	}
		#yoko .area dt {
			width: 60%;
			margin: 0 auto;
		}
		#yoko .area dt img {
			width: 100%;
			height: auto;
		}
	
		#yoko .area dd {
			font-weight: bold;
		}
		#yoko .area dd h4 {
			text-align:  center;
			font-size: 180%;
			margin: 15px 0 10px;
		}
		#yoko .area dd h4 strong {
			color: #a9151a;
		}
	
		#yoko .area dd .btn {
			width: 80%;
			margin: 0 auto;
			margin-top: 20px;
		}
		#yoko .area dd .btn img {
			width: 100%;
			height: auto;
		}

	#faq {
		padding: 6% 3%;
	}
	#faq h3 {
		text-align:  center;
		font-size: 20px;
		margin-bottom: 5%;

	}
	#faq h3 strong {
		color: #a9151a;
	}
	#faq h3 span {
		display: block;
		font-size: 14px;
	}
	#faq .area {
	}
	
	
	#faq .area dl {
		padding: 30px;
	}
	
	
	#faq .area .staff {
		margin-bottom: 5%;
	}
	#faq .area .part {

	}
	#faq .area p.tt {
		text-align: center;
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	#faq .area p.tt strong {
		color: #a9151a;
	}
		#faq .area .faq_wrap {
			border: solid 3px #eaeaea;

			border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
		}
	
	.faq_wrap dl {
		border-bottom: solid 1px #d6d6d6;
		}
	.faq_wrap dl:last-child {
		border-bottom: none;
		}
	
	
	.faq_wrap dl dt p:nth-of-type(1){
		float:left;
		width:8%;
		box-sizing:border-box;
		margin-right: 10px;
		}
	.faq_wrap dl dt p:nth-of-type(1) img {
		width: 100%;
		height: auto;
		}
	.faq_wrap dl dt p:nth-of-type(2){
		float:left;
		width:calc(88% - 10px);
		}
	
	
	
	
	
	.faq_wrap dl dt{
		cursor:pointer;
		position:relative;
		overflow:hidden;
		font-size: 116%;
		font-weight: bold;
		}
	/*.faq_wrap dl dt::after{
		content:"";
		background-image:url(../common/img/arrow_bottom.png);
		position:absolute;
		width:10px;
		height:6px;
		right:0;
		top:50%;
		margin-top:-17px;
		background-size: 10px 6px;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transition: 500ms;
		-webkit-transition: 500ms;
		}
	.faq_wrap dl dt.on::after{
		background-image:url(../common/img/arrow_top.png);
		transition: 500ms;
		-webkit-transition: 500ms;
		}*/
	.faq_wrap dl dd{
		display:none;
		padding:25px;
		overflow:hidden;
		}
	
	
	#interview {
		background: #8cb6cf;
		padding: 6% 3%;
		color: #FFF;
	}
	#interview h3 {
		text-align:  center;
		font-size: 20px;
		margin-bottom: 5%;
	}
	#interview h3 strong{
		color: #ffd500;
	}
	#interview p {
		text-align: center;
		font-weight: bold;
		margin-bottom: 5%;
	}
	#interview .area {
	}
	
	#interview ul {
		text-align: center;
	}
	#interview li {
		width: 70%;
		margin: 0 auto;
		margin-bottom: 5%;

	}
	#interview li img {
		width: 100%;
		height: auto;
	}




}