@charset "utf-8";

.bg { width: 100%; height: 100vh; position: fixed; left: 0 ; top: 0; background: url('../img/shop/bg.jpg') no-repeat 50% 50% / cover; z-index: 1;}
#wrapper { position: relative; z-index: 2;}

@media (max-width: 641px) {
	.bg { background: url('../img/shop/bg-sp.jpg') no-repeat 50% 50% / 100% auto;}
}

#kv-shop { background: url('../img/shop/kv.jpg') no-repeat 50% 50% / cover;}
#kv-shop .inner { width: 100%; max-width: 1280px; margin: 0 auto; padding: 120px 0 80px;}
#kv-shop h2{ margin-bottom: 60px; color: #000; font-size: 45px; font-weight: 700; letter-spacing: 0.12rem; text-align: center;}
#kv-shop p { color: #000; font-size: 14px; font-weight: 700; letter-spacing: 0.12rem; text-align: center;}
#kv-shop p.min { margin-bottom: 20px; font-size: 20px;}

#shop-list {}
#shop-list .inner { padding: 60px 0;}
#shop-list ul { width: 90%; max-width: 800px; margin: 0 auto; font-size: 0;}
#shop-list ul li { display: inline-block; width: 33.333334%; padding: 6px; font-size: 16px;}
#shop-list ul li a { display: block; width: 100%; padding: 20px 0; background: linear-gradient(-190deg,#f5bf60,#da9a2c,#f0b651); border-radius: 5px;
 color: #fff; font-weight: 700; text-align: center; text-decoration: none;
}
#shop-list ul li a:hover { opacity: 0.9;}
@media (max-width: 641px) {
	#kv-shop { background: url('../img/shop/kv-sp.jpg') no-repeat 50% 50% / cover;}
	#kv-shop .inner { padding: 80px 0 60px;}
	#kv-shop h2{ margin-bottom: 30px; font-size: 36px;}
	#kv-shop p.min { margin-bottom: 12px;}

	#shop-list ul li { width: 50%;}
}
@media (max-width: 481px) {
	#kv-shop .inner { padding: 60px 0 50px;}
	#kv-shop h2{ margin-bottom: 20px;}
	#kv-shop p { font-size: 12px; letter-spacing: 0.05rem;}

	#shop-list ul li { padding: 4px; font-size: 12.5px;}
	#shop-list ul li a { padding: 12px 0;}
}