@charset "utf-8";


/*////////////////////////////////////////////////////////////////

	top.css   トップページのCSS

////////////////////////////////////////////////////////////////*/

.l-header {
	display: none;
}

/*---------------------------------------------------------
	メイン画像
 ---------------------------------------------------------*/
 .l-main {
	margin: 0;
	width: 100%;
	padding: 0;
 }
.mv_contents {
	position: relative;
}
.mv_inner {
	width: 100%;
	height: 100vh;
	background: url(/images/top/bg-main.jpg) no-repeat bottom center / cover;
}
.mv_eg {
	max-width: 58px;
    width: calc(100% / 32);
    height: auto;
    position: absolute;
    top: 2%;
    left: 1.6%;
    z-index: 1;
}

.mv_ja {
	margin-bottom: 42px;
    width: calc(100% - 50%);
    text-align: end;
    position: absolute;
	bottom: 5%;
    right: 1.5%;
}
.mv_scroll {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 18px;
	color: #fff;
	text-align: center;
	position: absolute;
	bottom: 4%;
    left: 50%;
    transform: translateX(-50%);
}
.mv_scroll:after {
	content:'';
	background: url(/images/top/icon_arrow.png) no-repeat center /cover;
	position: absolute;
    display: block;
    width: 37px;
    height: 18px;
    margin-top: 5px;
    left: 50%;
    transform: translateX(-50%);
}
/*---------------------------------------------------------
	バナーコンテンツ
 ---------------------------------------------------------*/
.bnr_list {
	display: flex;
}
.bnr_item {
	position: relative;
}

.bnr_hover--img {
	display: block;
}
.bnr_hover {
	width:100%;
	height:100%;
	position:absolute;	
	top:0;
	bottom: 0;
	right: 0;
	left:0;
	opacity:0;
	background-color:rgba(0,0,0,0.4);	
	-webkit-transition:	all 0.2s ease;
	transition:	all 0.2s ease;
}
.bnr_item:hover .bnr_hover {
	opacity:1;
}
a:hover, button:hover {
	opacity: 1;
}