@charset "utf-8";
/* CSS Document */
.mt20{margin-top: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb160{margin-bottom: 160px;}

.pc{display: block;}
.sp{display: none;}
ul {list-style: none;}
figure{line-height: 0;}
a img:hover{opacity: 0.9;}
.marker{background: linear-gradient(transparent 50%, #ddd95b 50%);}

/*----fonttype----*/
#prologue h2,#prologue p{
font-family: "kosugi", sans-serif;
font-weight: 400;
font-style: normal;}
.picup-box .item .txt h3,.picup-box .item .txt .detail,.picup-box .item .txt .price,.picup-box .product-page,
#new-item .new-item-box .item h3,#new-item .new-item-box .item .price,
#all-item .all-item-box .item h3,#all-item .all-item-box .item .price{
font-family: source-han-sans-japanese, sans-serif;
font-style: normal;}
#select ul li a,
#picup h2,
#new-item h2,
#all-item h2{
font-family: "zen-maru-gothic", sans-serif;
font-weight: 700;
font-style: normal;}
.picup-box .item .txt .catch span{
font-family: ab-kirigirisu, sans-serif;
font-style: normal;
font-weight: 400;}


h1{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;}

.mainbnr{
	text-align: center;
	background-color: #f7f7f7;
	line-height: 0;}
.mainbnr img{max-width: 70%;margin: 0 auto;}


.inner{width: 1080px;margin: 0 auto;}
.mainbnr{position: relative;}



#prologue{margin: 0 0 200px; background-color: #f6ebcd; position: relative;}
#prologue:before{
	content: "";
	background: url("../img/wave02.svg")no-repeat;
	width: 100%;
	height: 200px;
	position: absolute;
	left: 0;
	top: 115%;}
#prologue:after{
	content: "";
	background: url("../img/wave01.svg")no-repeat;
	width: 100%;
	height: 200px;
	position: absolute;
	left: 0;
	top: 100%;}
#prologue .inner{padding: 60px 0 0;}
#prologue h2{font-size: 26px; margin-bottom: 30px; color: #743b29; text-align: center; line-height: 1;}
#prologue p{width: 850px; margin: 0 auto; font-size: 15px; color: #743b29; text-align: left;}



#select{position: relative; margin-bottom: 120px;}
#select ul{display: flex; justify-content: space-between; padding: 0;}
#select ul li{width: 277px; height: 277px; border-radius: 50%;}
#select ul li a{display: block; height: 100%; font-size: 49px; text-decoration: none; text-align: center; align-content: center; line-height: 1; position: relative;}
#select ul li:first-child{border: solid 10px #f5612a;}
#select ul li:nth-child(2){border: solid 10px #fe8d00;}
#select ul li:nth-child(3){border: solid 10px #83452c;}
#select ul li:first-child a{color: #f5612a;}
#select ul li:nth-child(2) a{color: #fe8d00;}
#select ul li:nth-child(3) a{color: #83452c;}
#select ul li:first-child a:after{
	content: "";
	display: inline-block;
	width: 26px;
	height: 11px;
	background: #f5612a;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 30px;}
#select ul li:nth-child(2) a:after{
	content: "";
	display: inline-block;
	width: 26px;
	height: 11px;
	background: #fe8d00;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 30px;}
#select ul li:nth-child(3) a:after{
	content: "";
	display: inline-block;
	width: 26px;
	height: 11px;
	background: #83452c;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 30px;}



#picup{margin-bottom: 100px;}
#picup h2{font-size: 40px; text-align: center; color: #f5612a; margin-bottom: 80px; line-height: 1;}
#picup .picup-box{box-sizing: border-box; border: solid 1px #05499a; padding: 40px;}
#picup .picup-box:nth-child(n+2){margin-top: 60px;}
#picup .picup-box .item{display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 40px;}
#picup .picup-box .item .txt{width: 53%; display: grid;}
#picup .picup-box .item .txt h3{font-size: 25px; color: #f5612a;}
#picup .picup-box .item .txt h3 span{font-size: 70%; color: #f5612a;}
#picup .picup-box .item .txt .catch{font-size: 41px; order: -1; letter-spacing: -2px; line-height: 1.8;}
#picup .picup-box .item .txt .catch span{background-color: #f5612a; color: #fff; line-height: 1; padding: 10px 10px;}
#picup .picup-box .item .txt .detail{font-size: 16px; margin-bottom: 15px; width: 90%; font-weight: 500;}
#picup .picup-box .item .txt .price{font-size: 36px; color: #f5612a; font-weight: bold;}
#picup .picup-box .item figure{width: 44%; position: relative;}
#picup .picup-box.one .item figure:after{content: "";background: url("../img/P_sub_X022274.webp")no-repeat; position: absolute; bottom: -20px; left: -30px; width: 186px; height: 229px;}
#picup .picup-box.two .item figure:after{content: "";background: url("../img/P_sub_X028177.webp")no-repeat; position: absolute; bottom: -20px; left: -30px; width: 223px; height: 278px;}
#picup .picup-box.three .item figure:after{content: "";background: url("../img/P_sub_X027690.webp")no-repeat; position: absolute; bottom: -20px; left: -30px; width: 332px; height: 108px;}
#picup .picup-box .product-page{display: block; background-color: #efdca8; padding: 7px 0; color: #83452c; text-align: center; font-size: 29px; font-weight: bold; letter-spacing: 2px;}



#new-item{margin-bottom: 300px;}
#new-item h2{font-size: 40px; text-align: center; color: #fe8d00; margin-bottom: 80px; line-height: 1;}
#new-item .new-item-box{display: flex; flex-wrap: wrap; justify-content: space-between;}
#new-item .new-item-box .item{width: 30%; display: flex; flex-direction: column;}
#new-item .new-item-box .item:nth-child(n+4){margin-top: 5%;}
#new-item .new-item-box .item figure{border-radius: 0 30px 0 30px; box-shadow: 10px 10px 0px 0px rgba(254,141,0,1); margin-bottom: 30px;}
#new-item .new-item-box .item figure img{width: 100%;}
#new-item .new-item-box .item h3{font-size: 18px; line-height: 1.5; color: #191919; margin-bottom: 10px; flex-grow: 10;}
#new-item .new-item-box .item .price{font-size: 23px; color: #191919; font-weight: bold;}



#all-item .inner{padding-bottom: 80px;}
#all-item h2{font-size: 40px; text-align: center; color: #83452c; margin-bottom: 80px; line-height: 1;}
#all-item{background-color: #f6ebcd; position: relative;}
#all-item:after{
	content: "";
	background: url("../img/wave03.svg")no-repeat;
	width: 100%;
	height: 200px;
	position: absolute;
	left: 0;
	bottom: 100%;}
#all-item:before{
	content: "";
	background: url("../img/wave04.svg")no-repeat;
	width: 100%;
	height: 200px;
	position: absolute;
	left: 0;
	bottom: 100.5%;}
#all-item .all-item-box{display: flex; flex-wrap: wrap;}
#all-item .all-item-box .item{width: 31.5%; margin-right: 2.75%; display: flex; flex-direction: column;}
#all-item .all-item-box .item:nth-child(3n){margin-right: 0;}
#all-item .all-item-box .item:nth-child(n+4){margin-top: 30px;}
#all-item .all-item-box .item figure{margin-bottom: 10px;}
#all-item .all-item-box .item figure img{width: 100%;}
#all-item .all-item-box .item h3{font-size:18px; color: #191919; line-height: 1.5; margin-bottom: 10px; flex-grow: 10;}
#all-item .all-item-box .item .price{font-size: 22px; color: #191919; font-weight: bold;}



.spotlist_back {
	margin-top: 60px;
	text-align: center;}
.spotlist_back a {
	font-size: 20px;
	border: solid 2px;
	padding: 15px 80px;
	border-radius: 10px;}




@media only screen and (max-width: 768px) {}
@media (max-width: 1024px) {}
@media (max-width: 768px) {
	.pc{display: none;}
	.sp{display: block;}

	
	.mainbnr img{max-width: 100%;}
	.inner{width: 95% !important;}
	
	#prologue{margin: 0 0 60px 0;}
	#prologue h2{font-size: 20px; margin-bottom: 16px;}
	#prologue .inner{padding-bottom: 30px;}
	#prologue p{font-size: 14px; width: 100%;}
	#prologue:after{top: 86%; z-index: -1;}
	#prologue:before{top: 90%; z-index: -2;}
	
	
	
	#select{margin-bottom: 60px;}
	#select ul{flex-wrap: wrap;}
	#select ul li{width: 100%; height: auto; border-radius: 0;}
	#select ul li:first-child{border: solid 7px #f5612a;}
	#select ul li:nth-child(2){border: solid 7px #fe8d00;}
	#select ul li:nth-child(3){border: solid 7px #83452c;}
	#select ul li a{font-size: 32px; padding: 15px 0;}
	#select ul li:nth-child(2){margin: 20px 0;}
	#select ul li:first-child a:after,
	#select ul li:nth-child(2) a:after,
	#select ul li:nth-child(3) a:after{left: 90%;}
	
	
	
	#picup h2{font-size: 35px; margin-bottom: 60px;}
	#picup .picup-box{padding: 20px;}
	#picup .picup-box .item{flex-wrap: wrap-reverse;}
	#picup .picup-box .item .txt{width: 100%;}
	#picup .picup-box .item figure{width: 100%; margin-bottom: 30px;}
	#picup .picup-box .item figure img{width: 100%;}
	#picup .picup-box.one .item figure:after{background-size: contain; width: 120px; height: 183px; left: -5px;}
	#picup .picup-box.two .item figure:after{background-size: contain; width: 120px; height: 183px; left: -5px;}
	#picup .picup-box.three .item figure:after{background-size: contain; width: 140px; height: 169px; left: -5px;}
	#picup .picup-box.four .item figure:after{background-size: contain; width: 140px; height: 138px; left: -5px;}
	#picup .picup-box .item .txt .catch{font-size: 27px; line-height: 2.2;}
	#picup .picup-box .item .txt h3{font-size: 23px; margin-bottom: 10px;}
	#picup .picup-box .item .txt .detail{width: 100%;}
	#picup .picup-box .item .txt .price{line-height: 1;}
	#picup .picup-box .product-page{font-size: 23px;}
	
	
	
	#new-item{margin-bottom: 150px;}
	#new-item h2{font-size: 35px; margin-bottom: 60px;}
	#new-item .new-item-box .item{width: 47%;}
	#new-item .new-item-box .item:nth-child(n+3){margin-top: 40px;}
	#new-item .new-item-box .item h3{font-size: 16px;}
	
	
	
	#all-item:before{height: 83px; bottom: 100.3%;}
	#all-item:after{height: 85px;}
	#all-item h2{font-size: 35px; margin-bottom: 60px;}
	#all-item .all-item-box .item h3{font-size: 16px;}
	#all-item .all-item-box .item{width: 48%;}
	#all-item .all-item-box .item:nth-child(n+3){margin-top: 40px; margin-right: 4%;}
	#all-item .all-item-box .item:nth-child(2n){margin-right: 0;}
	#all-item .all-item-box .item .price{font-size: 23px;}
	
}