/***********************************
 
関門トンネル 60周年

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

@import "../../css/anniversary.css";

#kanmon60{
	display:block;
	overflow:hidden;
	width:min(100%,1000px);
	margin:20px auto;
}



#kv_img{
	display:block;
	width:calc(100% - 369px);
	margin-top:100px;
	float:right;
}

#kv_img > img{
	width:min(100%,631px);
	height:auto;
}



#kanmon60 > h1{
	display: inline-block;
	width:369px;
}

#kanmon60 > h1 img{
	width:100%;
	height:auto;
}

#kanmon60 a{
	overflow:hidden;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}


ul.menu{
	display:block;
	width:calc(100% - 631px);
	margin:30px 0;
}

ul.menu > li > a{
	display:block;
	width:100%;
	height: 60px;
	font-size:1.8rem;
	font-weight:800;
	line-height:60px;
	color: #525252;
	border-bottom: #B4B4B4 solid 1px;
}

ul.menu > li > a:hover {
	text-decoration: none;
	background-color: #DBDBDB;
}

.menu + p{
	text-align:center;
}

.menu + p > a{
	display:inline-block;
}

.menu + p > a:hover{
	filter:brightness(1.05);
}

.menu + p img{
	width:min(100%,134px);
	height:auto;
}



/* for Sp --------------------*/
@media screen and ( max-width:768px) {

	#kanmon60{
		margin:var(--side-mgn-v) auto;
		padding:0 var(--side-mgn-h);
	}

	#kv_img{
		width:100%;
		margin-top:0;
		float:none;
	}

	#kanmon60 > h1{
		display:none;
	}

	ul.menu{
		width:100%;
		margin:var(--side-mgn-v) 0;
		text-align:center;
	}

}

