@charset "utf-8";

/* common
----------------------------------------------------------------------------------*/
div#contents{
	width:100%;
	height:100vh;
	margin:0 auto -232px;
	padding:0 30px;
	background:url(../img/teaser/main.webp) no-repeat center top / auto 87%,
	url(../img/teaser/f_mountain.webp) repeat-x center bottom / auto 13%;
	background-color:#fff396!important;
}
@media screen and (max-width:1220px){
	div#contents{
		height:70vw;
		background:url(../img/teaser/main.webp) no-repeat center top / calc(87% - 60*0.87px) auto,
		url(../img/teaser/f_mountain.webp) repeat-x center bottom / auto 13%;
	}
}
@media screen and (max-width:960px){
	p.pagetop{
		width:16.875vw;
		min-width:86px;
		top:-15vw;
	}
	p.pagetop a{
		display:block;
		text-align:center;
	}
	p.pagetop a span{
		width:100%;
		left:auto;
		bottom:6vw;
		display:block;
		font-size:12px;
	}
}
@media screen and (max-width:600px){
	div#contents{
		height:145vw;
		padding-top:15px;
		background:url(../img/teaser/main_sp.webp) no-repeat center top / calc(100% - 60px) auto,
		url(../img/teaser/f_mountain.webp) repeat-x center bottom / auto 13%;
	}
	p.pagetop{
		right:15px;
	}
	p.pagetop a span{
		bottom:30px;
		font-size:10px;
	}
}
@media screen and (max-width:370px){
	div#contents{
		height:155vw;
		padding:15px 15px 0;
		background:url(../img/teaser/main_sp.webp) no-repeat center top 15px / calc(100% - 30px) auto,
		url(../img/teaser/f_mountain.webp) repeat-x center bottom / auto 13%;
	}
}
