@charset "utf-8";

/* TOP用CSS
========================================*/

/* SPonly */
@media screen and (max-width:767px){
	body.menuShow {
		overflow:auto;
		position:static;
	}
	
	#mainArea .mainimg {
		background:url(../img/bg_mainimg_sp.jpg) no-repeat center top;
		background-size:cover;
	}
	#mainArea .mainimg .fp-tableCell {
		padding:0 !important;
	}
	#mainArea .mainimg h2 {
		margin-bottom:45px;
		padding-top:40px;
	}
	#mainArea .mainimg h2 img {
		width:100%;
	}
	#mainArea .mainimg .lead {
		color:#fff;
		line-height:250%;
		text-align:center;
	}
	
	#mainArea .sec01 {
		background:#efefef;
		margin-bottom:5px;
		padding:50px 6% 0;
	}
	#mainArea .sec01 .secInr h2 {
		font-size:150%;
		font-weight:bold;
		line-height:165%;
		margin-bottom:25px;
	}
	#mainArea .sec01 .secInr .text {
		line-height:180%;
		margin-bottom:10px;
	}
	#mainArea .sec01 .secInr .sponly {
		margin:0 -6.8%;
	}
	#mainArea .sec02 {
		padding:0 6%;
	}
	#mainArea .sec03 {
		padding:50px 6% 0;
	}
	#mainArea .sec02 .secInr .explan,
	#mainArea .sec03 .secInr .explan {
		line-height:180%;
	}
	#mainArea .sec02 .secInr .explan .subttl,
	#mainArea .sec03 .secInr .explan .subttl {
		font-size:93%;
		margin:12px 0 25px;
	}
	#mainArea .sec02 .secInr .image,
	#mainArea .sec03 .secInr .image {
		margin:30px -6.8% 0;
	}
	#mainArea .sec02 .secInr .image img,
	#mainArea .sec03 .secInr .image img {
		width:100%;
	}
	
	#mainArea .lastWrap {
		border-top:3px solid #313235;
		padding:60px 6% 70px;
	}
	#mainArea .lastWrap .secInr section.message {
		margin-bottom:50px;
	}
	#mainArea .lastWrap .secInr section.message h2 img {
		width:140px;
	}
	#mainArea .lastWrap .secInr section.recruit h2 img {
		width:115px;
	}
	#mainArea .lastWrap .secInr section h2 a {
		background:url(/common/img/arrow_menu.png) no-repeat left 5px;
		background-size:21px;
		padding-left:30px;
	}
	#mainArea .lastWrap .secInr section .subttl {
		font-size:93%;
		margin:5px 0 25px;
		padding-left:30px;
	}
	#mainArea .lastWrap .secInr section.recruit .subttl {
		margin:8px 0 25px;
	}
	#mainArea .lastWrap .secInr section .image {
		margin-bottom:12px;
	}
	#mainArea .lastWrap .secInr section .image img {
		width:100%;
	}
	
	footer .footerBtm .copy {
		margin:50px 0 80px;
	}
}

/* PConly */
@media screen and (min-width:768px){
	#mainArea {
		padding-left:200px;
		min-width:1000px;
	}
	#mainArea .mainimg {
		background:url(../img/bg_mainimg_pc.jpg) no-repeat center top;
		background-size:cover;
		text-align:center;
	}
	#mainArea .mainimg h2 {
		margin-bottom:50px;
		padding-top:180px;
	}
	#mainArea .mainimg .lead {
		color:#fff;
		font-size:113%;
		line-height:230%;
	}
	
	#mainArea .sec01 {
		background:url(../img/bg_sec01.jpg) no-repeat center bottom #efefef;
		padding:80px 0 160px;
		min-width:1000px;
	}
	#mainArea .sec01 .secInr {
		margin:0 auto;
		width:1000px;
	}
	#mainArea .sec01 .secInr h2 {
		float:left;
		font-size:170%;
		font-weight:bold;
		line-height:165%;
		padding-right:15px;
		width:350px;
	}
	#mainArea .sec01 .secInr .text {
		float:right;
		line-height:190%;
		width:635px;
	}
	#mainArea .sec02 {
		background:url(../img/bg_sec02.jpg) no-repeat center top;
		overflow:hidden;
		min-width:1000px;
	}
	#mainArea .sec02 .secInr {
		margin:0 auto;
		width:1000px;
	}
	#mainArea .sec02 .secInr .explan {
		float:right;
		line-height:180%;
		padding-top:60px;
		width:350px;
	}
	#mainArea .sec02 .secInr .explan .subttl {
		font-size:93%;
		margin:12px 0 30px;
	}
	#mainArea .sec02 .secInr .image {
		float:left;
		margin-left:-210px;
	}
	#mainArea .sec03 {
		overflow:hidden;
		min-width:1000px;
	}
	#mainArea .sec03 .secInr {
		margin:0 auto;
		width:1000px;
	}
	#mainArea .sec03 .secInr .explan {
		float:left;
		line-height:180%;
		padding-top:60px;
		width:350px;
	}
	#mainArea .sec03 .secInr .explan .subttl {
		font-size:93%;
		margin:10px 0 30px;
	}
	#mainArea .sec03 .secInr .image {
		float:right;
		margin-right:-250px;
	}
	
	#mainArea .lastWrap {
		border-top:4px solid #313235;
		padding:80px 0 100px;
	}
	#mainArea .lastWrap .secInr {
		line-height:180%;
		margin:0 auto;
		width:1000px;
	}
	#mainArea .lastWrap .secInr section.message {
		float:left;
		margin-left:50px;
		width:400px;
	}
	#mainArea .lastWrap .secInr section.recruit {
		float:right;
		margin-right:30px;
		width:400px;
	}
	#mainArea .lastWrap .secInr section h2 {
		margin-left:-35px;
	}
	#mainArea .lastWrap .secInr section h2 a {
		background:url(/common/img/arrow_menu.png) no-repeat left 7px;
		background-size:21px;
		padding-left:35px;
	}
	#mainArea .lastWrap .secInr section h2 a:hover {
		opacity:0.7;
	}
	#mainArea .lastWrap .secInr section .subttl {
		font-size:93%;
		margin:8px 0 30px;
	}
	#mainArea .lastWrap .secInr section .image {
		margin-bottom:12px;
	}
}
