@charset "utf-8";
main{overflow:hidden;}
#mainVisual{
	position:relative;
	text-align:center;
}
#mainVisual .mvTtl{
	position:absolute;
	bottom:0;
	left:0;
}
#mainVisual .mvTtl h1{margin:0;}
#mainVisual .mvTtl *{
	display:block;
	line-height:1.0;
}
#pager{
	width:min(96%,1100px);
	display:flex;
	align-items:center;
	margin:0 auto;
	font-weight:bold;
}
#pager li{
	display:block;
	list-style:none;
	text-align:center;
	line-height:1.0;
}
#pager li > *{
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	transition:all 0.4s;
	border:1px solid #006039;
	color:#006039;
}
#pager li a:hover{background-color:#bcceb6;}
#pager li a span{display:block;}
#pager li > span{
	background-color:#006039;
	color:#fff;
}
.lbox{
	position:fixed;
	top:0;
	right:0;
	width:100vw;
	height:100vh;
	pointer-events:none;
	opacity:0;
	transition:all 0.4s;
	z-index:1001;
}
.lbox > label{
	display:block;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.7);
	z-index:101;
}
.lbox .inner{
	position:absolute;
	top:0;
	right:0;
	height:100%;
	margin-right:-100vw;
	background-color:#fff;
	overflow-x:hidden;
	overflow-y:auto;
	scroll-behavior:smooth;
	transition:all 0.4s ease;
	z-index:102;
}
.lbox .inner > label{
	position:fixed;
	display:block;
	z-index:1;
}
.lbox .inner > label svg{
	display:block;
	width:100%;
	height:100%;
}
.lbox .inner > label svg use{fill:#006039;}
.lbox .inner > label:hover svg use{fill:#4fad87;}
.lbox .lbInner{margin:0 auto;}
@media (max-width:768.98px){
	main{padding-top:67px;}
	#mainVisual{
		width:100%;
		margin:0 auto 13.867vw;
	}
	#mainVisual .mv img{
		width:100%;
		object-fit:cover;
		object-position:center center;
		aspect-ratio:375 / 267;
	}
	#mainVisual .mvTtl{
		width:250px;/*297px*/
		margin-bottom:-31px;/*-35px > -31px*/
	}
	#pager{justify-content:center;}
	#pager li{
		width:22px;
		height:22px;
		font-size:calc(11 / 16 * 1rem);
	}
	#pager li+li{margin-left:10px;}
	.lbox .inner{width:100%;}
	.lbox .inner > label{
		width:17px;
		top:27px;
		right:25px;
	}
	.lbox .lbInner{
		width:100%;
		padding:100px 8vw 120px;
	}
}
@media (min-width:640px) and (max-width:768.98px){
	#pager{max-width:568px;}
}
@media (max-width:639.98px){
	#pager{width:90%;}
}
@media (min-width:769px){
	#mainVisual{
		width:min(96%,1280px);
		margin:0 auto;
	}
	#mainVisual .mv img{
		width:100%;
		height:590px;
		object-fit:cover;
		object-position:center center;
	}
	#mainVisual .mvTtl{width:436px;}
	#pager{justify-content:flex-end;}
	#pager li{
		width:30px;
		height:30px;
		font-size:calc(12 / 16 * 1rem);
	}
	#pager li+li{margin-left:17px;}
	.lbox .inner{width:min(800px,100%);}
	.lbox .inner > label{
		width:18px;
		top:43px;
		right:47px;
	}
	.lbox .lbInner{
		width:550px;
		padding:180px 0 148px;
	}
}
@media (min-width:769px) and (max-width:1279.98px){
	#pager{width:720px;}
}
@media (min-width:1280px){
	#pager{width:1100px;}
}