@charset "UTF-8";

#top{
	position:relative;
	margin-top: 10px;
}

#top .top-bg{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height: 230px;
	overflow:hidden;
	z-index:0;
}

#top .top-bg img{
	width: 100%;
	object-fit:contain;
	object-position: 50% 100%;
	display:block;
}

.top-inner h1{
	color:#fff;
	font-weight:bold;
	font-size:30px;
	position: absolute;
	top: 35px;
}

.top{
	background:#f2f2f2;
	padding:80px 0;
}

.top-inner{
	width: min(1240px,90%);
	margin:0 auto;
}

.top-box{
	background:#fff;
	border-radius:18px;
	padding: 71px 38px 90px;
	position:relative;
	overflow:hidden;
	margin: 30px 0 0;
}



#txt{
	list-style:none;
	margin:0;
	padding:0;
	display:grid;
	grid-template-columns:1fr 520px;
	gap:40px;
	align-items:start;
}

#txt li{
	margin:0;
	padding:0;
}

#txt li:first-child > div{
	font-size: 20px;
	font-weight:800;
	margin:0 0 14px;
	line-height:1.6;
}

#txt li:first-child p{
	margin:0;
	line-height:1.9;
	font-size: 16px;
}

#txt li img{
	width:100%;
	height:auto;
	display:block;
	border-radius:14px;
}

/* 下段（地図 + 店舗情報） */
#map{
	list-style:none;
	margin:40px 0 0;
	padding:0;
	display:grid;
	grid-template-columns:1fr 360px;
	gap:40px;
	align-items:start;
}

#map li{
	margin:0;
	padding:0;
}

#map iframe{
	width:100%;
	height:360px;
	display:block;
	border-radius:14px;
}

/* 右側情報 */
#map li:last-child{
	padding-top:10px;
}

#map li:last-child p{
	font-size: 16px;
}

#map li:last-child p span{
	display:inline-block;
	font-weight:800;
	margin:18px 0 6px;
	font-size: 16px;
}

#map li:last-child p:first-child span{
	margin-top:0;
}

/* ボタン */
#map li:last-child div{
	margin-top: 23px;
}

#map li:last-child div a{
	display:flex;
	justify-content:center;
	align-items:center;
	height: 60px;
	border-radius:999px;
	font-size: 16px;
	font-weight:800;
	text-decoration:none;
	letter-spacing:.03em;
}

#map li:last-child div a:hover{
	opacity:0.7;
}

#map li:last-child div a img{
	margin-right:10px;
}

#map li:last-child div:first-of-type a{
	background:#e60012;
	color:#fff;
}

#map li:last-child div:last-of-type a{
	background:#f08a00;
	color:#fff;
}





#info{
	width: 1240px;
	margin: 90px auto 60px;
	position:relative;
}
#info table{
	width: 100%;
}
#info th{
	width: 25%;
	text-align: left;
	border-bottom: 1px solid #E60117;
	padding: 20px 30px;
	vertical-align: middle;
}
#info td{
	width: 75%;
	vertical-align: middle;
	padding: 20px 50px;
	border-bottom: 1px solid #CECECE;
	line-height: 1.5;
	font-size: 16px;
}
#info td span{
	font-size: 16px;
	font-weight: bold;
}

.sub-ttl{
	display:flex;
	align-items:center;
	gap:10px;
	font-size:26px;
	font-weight:800;
	margin: 0 0 60px;
}

#info .img-mark{
	width: 60px;
	height:30px;
	background:url("/index/images/mark.png") center/contain no-repeat;
	display:inline-block;
}

.banner-list{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px;
	padding:0;
	list-style:none;
	max-width: 1160px;
	margin: 100px auto 70px;
}

.banner-list li{
	height:100%;
}

.banner-list li a{
	display:block;
	height:100%;
}
.banner-list li a:hover{opacity:0.7;}

.banner-list li img{
	width:100%;
	height: 95%;
	object-fit:cover;
	display:block;
	border-radius: 10px;
}



@media screen and (max-width:768px){

	#top .top-bg{height:160px;}
	.top-inner h1{font-size:22px;top:14px;padding:0 16px;box-sizing:border-box;}
	.top{padding:60px 0;}
	.top-inner{width:90%;}
	.top-box{padding:26px 18px 28px;margin-top:20px;}

	#txt{grid-template-columns:1fr;gap:20px;}
	#txt li:first-child > div{font-size:18px;}
	#txt li:first-child p{font-size:14px;line-height:1.8;}

	#map{grid-template-columns:1fr;gap:24px;margin-top:30px;}
	#map iframe{height:280px;}
	#map li:last-child{padding-top:0;}
	#map li:last-child p{font-size:14px;}
	#map li:last-child p span{font-size:14px;margin:14px 0 4px;}
	#map li:last-child div{margin-top:18px;}
	#map li:last-child div a{height:54px;font-size:14px;}

	#info{width:90%;margin:60px auto 40px;}
	#info table,
	#info tbody,
	#info tr{display:block;width:100%;}
	#info th,
	#info td{display:block;width:100%;padding:14px 16px;border-bottom:1px solid #e5e5e5;font-size:14px;}
	#info th{border-bottom:none;font-weight:800;padding-bottom:6px;}
	#info td{padding-top:0;margin-bottom:12px;}
	.sub-ttl{font-size:20px;margin-bottom:36px;}
	#info .img-mark {width: 40px;height: 25px;}


	.banner-list{grid-template-columns:1fr;gap:16px;margin:60px auto 40px; width:90%;}
	.banner-list li img{height:auto;}

}