/* CSS Document */

@media (min-width:751px){

	#fv { width: 100%; height: 660px; background: url(../images/mv.jpg) center center no-repeat;
		background-size: cover; }
	
	#fv .mainWidth { position: relative; height: 100%; padding-top: 40px; }
	#fv h2 { width: 525px; height: 416px; background: url(../images/ttl.png) left center no-repeat;
		text-indent: -10000px; overflow: hidden; margin: 0 auto; }
	#fv p { width: 100%; height: 166px; background: url(../images/cc.png) center center no-repeat;
		text-indent: -10000px; overflow: hidden; margin-top: -40px; }
	#fv a { display: block; position: absolute; right: 0; bottom: 30px; transition:0.3s; }
	#fv a img { transition:0.3s; }
	#fv a:hover { opacity: 1; }
	#fv a:hover img { opacity: 0.7; }

	.sakunamih2 { background: url(../images/car30.svg) top center no-repeat; padding-top: 75px; 
		margin: 55px auto 45px; color: #00802b; font-size: 40px; font-family: 'Noto Serif JP', serif;
		text-align: center; }
	.sakunamih2 span { color: #2b1f11; font-size: 28px; }

	#maincontents #areaMenu {  margin-top: 40px; height: 30px; margin-bottom: 30px;
		justify-content:center; }
	#areaMenu li { width: 16%; width: -webkit-calc( 100% / 4 ); position: relative;
		width: calc( 100% / 4 ); border-right: #d8d8d8 1px solid; }
	#areaMenu li:first-child { border-left: #d8d8d8 1px solid; }
	#areaMenu li a { display: block; width: 100%; height: 30px; text-align: center;
		 font-size: 16px; position: relative;
		color: #16181c; }
	#areaMenu li a:after { content: ""; width: 9px; height: 6px; position: absolute; bottom: 0;
		background: url(../../images/icon_menu.svg) center bottom no-repeat;
		left: 50%; margin-left: -4px; transition:0.3s; }
	#areaMenu li a:hover:after { bottom: -5px; }

	.cb { background: url(../images/cb.jpg) repeat; }

	.areaUnit { padding: 50px 0 100px; margin-bottom: 50px; }
	.areaUnit>.flex { align-items:center; position: relative; z-index: 10; }
	.areaUnit.rightImg>.flex { flex-direction:row-reverse; }
	.areaUnit .img { position: relative; width: 57%; }
	.areaUnit .img img { width: 100%; }
	.areaUnit .txt { width: 390px; position: relative; margin-left: 60px; }
	.areaUnit.rightImg .txt { margin-right: 60px; margin-left: 0; }
	.areaUnit.txtonly .txt { width: 1100px; margin: 0 auto 45px; }
	.areaUnit p.areaNo { width: 80px; height: 60px; margin-bottom: 40px;
		font-family: 'adobe-garamond-pro', serif; text-align: left; font-size: 42px;	
		color: #00802b; background: url(../images/bg_count.svg) right bottom no-repeat; }
	.areaUnit h3 { font-size: 30px; margin-bottom: 25px; }
	.areaUnit h3 span { font-size: 24px; display: block; }
	.areaUnit.txtonly .txt h3 { margin-right: 100px; }
	.areaUnit .detail { margin: -40px auto 0;  padding: 80px 70px; position: relative; }
	#nikka.areaUnit .detail { width: 1112px; height: 351px; 
		background: url(../images/bg_detail_nikka.png) center top no-repeat; }
	#houmei.areaUnit .detail { width: 1100px; height: 261px; 
		background: url(../images/bg_detail_houmei.png) center top no-repeat; }
	#jougi.areaUnit .detail { width: 1107px; height: 298px; 
		background: url(../images/bg_detail_jougi.png) center top no-repeat; }
	#lasanta.areaUnit .detail { width: 1100px; height: 291px; padding: 50px 70px;
		background: url(../images/bg_detail_lasanta.png) center top no-repeat; }
	.areaUnit .detail .flex { flex-wrap:wrap; /*justify-content:space-between;*/ }
	.areaUnit .detail .flex li { width: 50%; margin-bottom: 30px; }
	.areaUnit .detail .flex li h4 { padding-left: 22px; font-size: 15px; 
		background: url(../images/icon_info.svg) left center no-repeat; }
	.areaUnit p { font-size: 15px; line-height: 28px; }
	.areaUnit .bt_area { display: block; width: 350px; height: 50px; line-height: 50px; 
		color: #ffffff; text-align: center; position: absolute; bottom: -25px; left: 50%; margin-left: -175px;
		background: url(../../images/icon_bt_on.svg) right 13px center no-repeat #00802b;
		background-size: 4px auto; }
	#maincontents .areaUnit .bt_area, #maincontents .areaUnit .bt_area:visited { color: #ffffff; }
	.areaUnit .bt_area:hover { background-position: right 8px center; }

	.sakunamiplan { width: 100%; height: 400px; padding-top: 100px;
		background: url(../images/bg_sakunami_foot.jpg) center center no-repeat;
		background-size: cover; }
	.sakunamiplan a { display: block; width: 600px; margin: 0 auto; transition:0.3s; }
	.sakunamiplan a img { transition:0.3s; }
	.sakunamiplan a:hover { opacity: 1; }
	.sakunamiplan a:hover img { opacity: 0.7; }

}
@media (min-width:751px) and (max-width:1145px) {
	.areaUnit .txt { width: 40%; margin-left: 20px; }
	.areaUnit.rightImg .txt { margin-right: 20px; margin-left: 0; }
	.areaUnit .detail { margin: 20px auto 0;  padding: 40px 70px 80px; position: relative; }
	#nikka.areaUnit .detail { width: 92%; height: auto; 
		background-size: 100% 100%; }
	#houmei.areaUnit .detail { width: 92%; height: auto; background-size: 100% 100%; }
	#jougi.areaUnit .detail { width: 92%; height: auto; background-size: 100% 100%; }
	#lasanta.areaUnit .detail { width: 92%; height: auto; background-size: 100% 100%; }
}
@media (max-width:750px){


	#fv { width: 100%; height: 156vw; background: url(../images/mv.jpg) center center no-repeat;
		background-size: cover; }
	
	#fv .mainWidth { position: relative; height: 100%; padding-top: 4vw; }
	#fv h2 { width: 90vw; height: 80vw; background: url(../images/ttl.png) left center no-repeat;
		text-indent: -10000px; overflow: hidden; margin-left: -2vw; background-size: contain; }
	#fv p { width: 100%; height: 40vw; background: url(../images/cc_sp.png) top center no-repeat;
		text-indent: -10000px; overflow: hidden; margin-top: -7vw; background-size: contain; }	
	#fv a { display: block; width: 60vw; margin: 0 auto; }
	#fv a img { width: 100%; }

	.sakunamih2 { background: url(../images/car30.svg) top center no-repeat; padding-top: 20vw; 
		background-size: auto 16vw;
		margin: 10vw auto 8vw; color: #00802b; font-size: 6vw; font-family: 'Noto Serif JP', serif;
		text-align: center; }
	.sakunamih2 span { color: #2b1f11; font-size: 3.7vw; }

	#maincontents #areaMenu { border-top: #d8d8d8 1px solid; margin: 10vw auto; }
	#areaMenu li { width: 100%; border-bottom: #d8d8d8 1px solid; }
	#areaMenu li a { display: block; width: 100%; height: 13vw; text-align: center;
		 font-size: 3.7vw; position: relative; line-height: 13vw;
		color: #16181c; background: url(../../images/icon_menu.svg) right 4vw center no-repeat;
		background-size: 2vw auto; }

	.cb { background: url(../images/cb.jpg) repeat; }
	
	.areaUnit { padding: 10vw 0; }
	.areaUnit .img { width: 100%; position: relative; margin-bottom: 8vw; }
	.areaUnit .img img { width: 100%; height: auto; }
	
	.areaUnit .txt { width: 88vw; margin: 0 auto; position: relative; }
	#maincontents .areaUnit p.areaNo { width: 23vw; 
		height: 13vw; background: url(../images/bg_count.svg) right bottom no-repeat;
		font-family: 'adobe-garamond-pro', serif; text-align: left; font-size: 6vw;	
		color: #003080; margin-bottom: 4vw; 
		background-size: 22vw auto; }
	.areaUnit h3 { font-size: 6vw; line-height: 8vw; margin-bottom:6vw; }
	.areaUnit h3 span { font-size: 4vw; display: block; }
	.areaUnit .detail { margin: 16vw auto 0;  padding: 2vw 6vw; position: relative; width: 88vw;
		background: url(../images/cb.jpg) repeat; }
	.areaUnit .detail:before { content: ""; width: 100%; height: 6vw; position: absolute;
		top:-6vw; left: 0; background: url(../images/bg_detail_top.png) left top no-repeat;
		background-size: 100% auto; }
	.areaUnit .detail:after { content: ""; width: 100%; height: 6vw; position: absolute;
		bottom:-6vw; left: 0; background: url(../images/bg_detail_bt.png) left top no-repeat;
		background-size: 100% auto; }
	.areaUnit.cb .detail { 
		background: url(../images/bg_detail_cb_center.png) repeat; background-size: 100% auto; }
	.areaUnit.cb .detail:before { content: ""; width: 100%; height: 6vw; position: absolute;
		top:-6vw; left: 0; background: url(../images/bg_detail_cb_top.png) left top no-repeat;
		background-size: 100% auto; }
	.areaUnit.cb .detail:after { content: ""; width: 100%; height: 6vw; position: absolute;
		bottom:-6vw; left: 0; background: url(../images/bg_detail_cb_bt.png) left top no-repeat;
		background-size: 100% auto; }
	.areaUnit .detail .flex {  }
	.areaUnit .detail .flex li { width: 100%; margin-bottom: 6vw; }
	.areaUnit .detail .flex li h4 { padding-left: 6vw; font-size: 3.8vw; 
		background: url(../images/icon_info.svg) left center no-repeat; background-size: 4vw auto; }
	#maincontents .areaUnit p { font-size: 3.8vw; line-height: 6vw; }
	.areaUnit .bt_area { display: block; width: 100%; height: 13vw; line-height: 13vw; 
		color: #ffffff; text-align: center; margin-top: 4vw; font-size: 3.7vw;
		background: url(../../images/icon_bt_on.svg) right 4vw center no-repeat #00802b;
		background-size: 2vw auto; }
	#maincontents .areaUnit .bt_area, #maincontents .areaUnit .bt_area:visited { color: #ffffff; }

	.sakunamiplan { width: 100%; height: 58vw; padding-top: 16vw;
		background: url(../images/bg_sakunami_foot.jpg) center center no-repeat;
		background-size: cover; }
	.sakunamiplan a { display: block; width: 70vw; margin: 0 auto; }
	.sakunamiplan a img { width: 100%; }

}