@charset "utf-8";
/* ------------------------------------------------------------ common */

.btn { padding: 70px 0 0;}

#fv { background: url(../images2/company/index/fv.jpg) center center no-repeat;}
#fv h2 span { line-height: 130%;}
#fv p { padding: 10px 0 0;}

#philosophy { padding: 140px 0 100px; background: url(../images2/company/index/bg_01.jpg) center top no-repeat; background-size: cover; color: #fff; text-align: center;}
#philosophy h3 { padding: 0 0 90px;}
#philosophy p { font-family: 'Noto Sans Japanese';}
#philosophy p.btn { padding: 40px 0 0;}
#philosophy p.btn a { width: 320px; height: 50px; line-height: 50px; border: 1px solid #fff; background: url(../images2/common/arw.png) 97% center no-repeat;}

#message { background: url(../images2/company/index/bg_03.png) left center no-repeat; margin: 75px 0 100px; background-size: 1045px;}
#message .box { float: left; width: 320px; padding: 204px 780px 98px 0; text-align: left; background: url(../images2/company/index/pic_03.jpg) right center no-repeat; background-size: 710px;}
#message .box h3.h3 { text-align: left;}

#outline { background: url(../images2/company/index/bg_01.png) right center no-repeat; margin: 75px 0 100px;}
#outline .box { float: right; width: 320px; padding: 140px 0 150px 780px; text-align: left; background: url(../images2/company/index/pic_01.jpg) left center no-repeat;}
#outline .box h3.h3 { text-align: left;}

#history { background: url(../images2/company/index/bg_02.png) left center no-repeat; margin: 75px 0 5px;}
#history .box { float: left; width: 320px; padding: 140px 780px 150px 0; text-align: left; background: url(../images2/company/index/pic_02.jpg) right center no-repeat;}
#history .box h3.h3 { text-align: left;}

/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){

	.btn { padding: 30px 0 0;}
	
	#fv { background: url(../images2/company/index/fv.jpg) center top no-repeat; background-size: cover; padding: 20% 0;}
	#fv h2 span { line-height: 130%;}
	#fv p { padding: 0;}
	
	#philosophy { padding: 70px 0 50px; background: url(../images2/company/index/bg_01.jpg) center top no-repeat; background-size: cover; color: #fff; text-align: center;}
	#philosophy h3 { padding: 0 0 45px;}
	#philosophy p { font-family: 'Noto Sans Japanese'; padding: 0 3%; text-align: left;}
	#philosophy p.btn { padding: 20px 0 0; text-align: center;}
	#philosophy p.btn a { width: 94%; height: 45px; line-height: 45px; border: 1px solid #fff; background: url(../images2/common/arw.png) 97% center no-repeat;}
	
	#message { background: url(../images2/company/index/bg_03.png) center 30px no-repeat; margin: 25px 0;}
	#message .box { float: none; width: 100%; padding: 70% 0 30px; text-align: left; background: url(../images2/company/index/pic_03.jpg) center top no-repeat; background-size: contain; margin: 0 auto;}
	#message .box h3.h3 { text-align: center;}
	
	#outline { background: url(../images2/company/index/bg_01.png) center 30px no-repeat; margin: 25px 0 50px;}
	#outline .box { float: none; width: 100%; padding: 70% 0 30px; text-align: left; background: url(../images2/company/index/pic_01.jpg) center top no-repeat; background-size: contain; margin: 0 auto;}
	#outline .box h3.h3 { text-align: center;}
	
	#history { background: url(../images2/company/index/bg_02.png) center 30px no-repeat; margin: 25px 0;}
	#history .box { float: none; width: 100%; padding: 70% 0 30px; text-align: left; background: url(../images2/company/index/pic_02.jpg) center top no-repeat; background-size: contain; margin: 0 auto;}
	#history .box h3.h3 { text-align: center;}

}