@charset "utf-8";
/* CSS Document */
html{scroll-padding-top: 150px;}
body {font-size: 16px;letter-spacing: 0.05rem;}
.f1{ font-weight: bold; text-align: center;    line-height: 1.8rem;}
.f2 {font-size: 1.2rem; text-align: center;line-height: 1.9rem;}
.f3{text-align: center; padding-bottom: 2rem;margin-top: -1rem; line-height: 1.8rem;}
.fb {font-weight: bold;}
section {max-width: 1200px;margin: 0 auto; width: 96%;}
h2 {max-width: 300px;margin: 0 auto;padding-bottom: 2rem;}
.br395,.br370, .br410 ,.br430, .br600, .br460, .br750, .sp-map, .br520 ,.br1000{display: none;}
.brmax380{display:block;}
.bg-green {background: #84AC16;}
.content {max-width: 1008px;width: 100%;margin: 0 auto;padding:8rem 0;}

/*bg*/
.schedule-bg, .onlineshop-bg, .media-x-bg, .tokuten-bg, .bg-brown{margin: -1rem;}
.schedule-bg {background: #33100C;}
.onlineshop-bg {background:#9F6A35;}
.media-x-bg {background: #33100C;}
.tokuten-bg {background:#9F6A35;}

/*=============
.bg_pattern
==============*/

.bg_pattern {
  position: fixed;
  top: 0;
  max-width: 1800px;
  width: 100%;
  height: 100vh;
  background-color: rgba(159,106,53, 0.1);
  opacity: 0.25;
  z-index: 0;
}
.Rhombus {
 background-image:  linear-gradient(135deg, rgba(173,126,71, 1) 25%, transparent 25%), linear-gradient(225deg, rgba(173,126,71, 1) 25%, transparent 25%), linear-gradient(45deg, rgba(173,126,71, 1) 25%, transparent 25%), linear-gradient(315deg, rgba(173,126,71, 1) 25%, transparent 25%);
	
  background-position:  130px 0, 130px 0, 0 0, 0 0;
  background-size: 130px 130px;
  background-repeat: repeat;
	 -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}
header{position: relative;z-index:2;}
h2, p, .bg-green, .nami-green, .fb , .deco1, .toku-flame, .green{position: relative;z-index:1;}

.nami{display: block;}
.nami-sp{display: none;}
@media screen and (max-width:500px) {
	.nami {display: none;}
	.nami-sp {display: block;}
}


/*gaiyo*/
#gaiyo {padding-bottom: 0;}
#gaiyo .content p{font-size: 1.375rem;color: #fff;line-height: 2rem;z-index: 2;padding-top: 2rem;}



/*schedule*/
#schedule p{padding-top: 2rem;font-size: 1.56rem;font-weight: bold;text-align: center;}
#schedule p span{font-size:2.8rem;}
#schedule ul {padding-top: 2rem; }
#schedule li {border: #6B3906 solid 3px; border-radius: 20px;background: #fff; padding: 3rem 2rem 2rem;margin-bottom: 3rem;}
#schedule .content {color: #fff;}
#schedule .f1 {padding-bottom: 1rem;}


.deco1 {width:80%;margin: 0 auto 2rem auto;}
.deco1 img {margin: 2rem 0;}

/*onlineshop*/
#onlineshop h2 {max-width: 540px;}
#onlineshop .fb{border: 20px solid #000;border-image-slice: 45;border-image-source: url("../img/brown-flame.webp");max-width: 1020px;width: 100%;margin: 0 auto; border-radius: 25px;border-image-repeat: round;color: #FFF;margin-bottom: 2rem;}
#onlineshop .fb-in{background-color:#33100C;font-size: 1.125rem;padding-top: 1rem;}
#onlineshop .fb-in div{padding: 1rem 0;}
#onlineshop .fb-in p{text-align: center;}
#onlineshop .fb-in dl {display: flex; align-items: center;padding-bottom: 1rem;}
#onlineshop .fb-in dt{background-color: #fff;color:#33100C;max-width: 124px;width: 100%;text-align: center;margin-right: 1.5rem;padding-top: 0.3rem;height: 2rem;}
dt {margin-left: 2rem;}
#onlineshop .fb-in dd span{font-size: 1.6rem;}
#onlineshop .fb-in .link{text-align: center;}
#onlineshop .fb-in .f1{font-weight: normal;}
#onlineshop .fb-in .bold{font-weight: bold;font-size:1.6rem;line-height:2.5rem;}
/*#onlineshop .fb-in .bold span{font-size: 1.125rem;}*/
#onlineshop .fb-in p{font-weight: normal;padding-bottom: 0.5rem;}
#onlineshop .fb-in .p-bold{font-weight: bold;padding: 1rem 0 1.5rem 0;}
#onlineshop .fb-in p a img{max-width: 250px;width: 90%;margin: 0 auto;}
.link img{max-width: 308px;width: 100%;margin: auto;}
#onlineshop .content > p{max-width: 680px;width: 100%;margin: 0 auto;color: #fff;font-weight: normal;}
#onlineshop .banner{padding: 2rem 0;}
.jigo {max-width: 600px;width: 100%;margin: 0 auto;text-align: center;} 
.jigo .p1{font-size: 1.5rem;padding-bottom: 1rem;}
.jigo .p2{font-size: 1rem;line-height:1.6rem;}

/*twitter*/
#x {color: #fff;}
.tw-left {max-width: 600px; margin: 0 auto;}
.tw-left p{text-align: center; font-size: 1.375rem;}
.twi-p{padding: 2rem 0;}
.tw-left p a {color: #84AC16;font-size: 1.875rem;}

/*tokuten*/
#tokuten .toku-flame {border: 20px solid #000;border-image-slice: 45;border-image-source: url("../img/tokuten-flame.png");max-width: 1020px;width: 100%;margin: 0 auto;background-color:#fff;border-radius: 25px;border-image-repeat: round;}
.toku-img { z-index: 2; max-width: 900px;margin:0 auto;}
.toku-attention{text-align: left;padding-top: 1rem;}
.toku-flame{padding: 2rem 0;}
.toku-flame .f1{font-size:1.125rem;line-height: 2.2rem;}
.toku-flame .f1 span {background-color:#84AC16;padding: 0.1rem;}
.toku-flame .p2 {font-size: 1.5rem;padding-bottom: 2rem;}
.toku-attention {max-width: 680px;width: 100%;margin: 0 auto;font-weight: bold;}


/*items*/
.green {background: #84AC16;}
#items .content {max-width: 1048px;width: 100%;margin: 0 auto;padding: 4.875rem 0;}
#items {position:relative;}
#items h2{display: flex; justify-content: center; align-items: flex-end;}
#items ul {display: flex; justify-content: space-between;flex-wrap: wrap;max-width: 96%;  margin: 0 auto;}
#items li {width: calc(97%/4);text-align: center;margin-bottom: 2rem;padding: 0 0.2rem;}
.term1 {font-size: 0.9rem; padding: 0.3rem 0; margin: 0.3rem 0 0; font-weight: bold; line-height: 1.4rem;color: #fff;}
.term1 span{font-size: 0.75rem;font-weight: normal;}
.itemname1 {line-height: 1.25rem; margin-bottom: 0.5rem; font-size: 0.875rem;color: #fff;font-weight: bold;padding-top:0.5rem;}
.prices1 {font-size: 1rem;line-height: 1.1rem;color: #fff;font-weight: bold;padding-bottom: 0.3rem;}
.prices1 span{font-size: 0.7rem;font-weight: normal;}
.prices1 small{font-weight: normal;}
.animateme div{background-color: #33100C;}
.item-name {font-size: 0.8rem;}
hr {width:85%;margin: 0 auto;}


/*attention*/
.bg-brown {background: #33100C /*url("../img/squarepattern2.png")*/;}
#attention p {color: #fff;z-index: 2;max-width: 1008px; margin: 0 auto;line-height: 2rem;font-size: 1.2rem;font-weight: bold;}

.top1 {position: fixed; bottom: 10%; max-width: 90px; right: 3%; z-index:6;}
.top2 {width: 100%;max-width: 1800px;margin-right: auto;margin-left: 0px;display: block;}
.top2 a {float: right;color:#fff;}

/*footer*/
main{position: relative;}
footer {position: absolute;z-index: 5;color: #fff; font-size: 0.8rem;}
.footer-bg{margin-top: -1rem;max-width: 1800px;width: 100%;}
.copyright {background:#9F6A35;padding: 1rem 0;}

@media screen and (max-width:1200px) {
	.content {padding:6rem 0;}
	h2 {max-width: 230px;width: 80%;padding-bottom: 1.5rem;}
	#onlineshop h2 {max-width: 350px;}
	.pc-map, .sp-map{width: 95%;margin: 0 auto;}
	#onlineshop .fb {width: 90%;}
	#onlineshop .fb-in{font-size: 1rem;}
	#onlineshop .fb-in dd span{font-size: 1.5rem;}
	#onlineshop .fb-in .bold{font-size:1.2rem;}
	#attention p{width: 90%;font-size: 1rem;}
}
@media screen and (max-width:1050px) {
	#tokuten .toku-flame{width: 96%;}
}
@media screen and (max-width:1000px) {
	#gaiyo .content p{font-size: 1rem;padding-top: 1.5rem;}
	.content {padding:4rem 0;}
	#schedule p{padding-top: 1rem;font-size: 1rem;}
	#schedule p span{font-size:2rem;}
	#attention p{padding-bottom: 1rem;}
	.br1000{display: block;}
}

@media screen and (max-width:950px) {
	#items li {width:calc(97%/2);}
	#items li:last-child {margin-right: 0;}	
	.itemname1 span {display: none;}
	.span-sale{display: block!important;}
}
@media screen and (max-width:900px) {
	#onlineshop .fb-in dl{display: block;text-align: center;}
	#onlineshop .fb-in dt {margin: 0 auto;}
	#onlineshop .fb-in dd {margin: 0 auto;padding: 0.5rem 0 1rem 0;}
	.pc-map{display: none;}
	.sp-map{display:block;}
	.toku-flame .p2{font-size: 1.2rem;}
	.toku-attention{width:90%;}
}
@media screen and (max-width:750px){
	.br750 {display: block;}
	.content {padding:2.5rem 0;}
	#gaiyo .content p{padding-top: 1rem;}
	dt {margin-right: 2rem;width: 30%;}
	#gaiyo .f2 {padding-top: 5rem;}
	h2 {width: 150px;}
	#onlineshop h2 {width: 200px;}
	.f2 {font-size: 1rem;}
	.f1{font-size: 1.1rem;line-height: 1.5rem;}
	#schedule li{flex-direction: column; align-items:center;}
	.tw-left {margin-bottom: 1rem;}
	.tw-left p {font-size: 1rem;}
	.tw-left p a {font-size: 1.2rem;}
	html{scroll-padding-top: 50px;}
	dl {max-width: 85%;margin: 0 auto;}	
	#onlineshop .fb-in .bold {line-height: 2rem;}
	#onlineshop .content > p {width: 90%;}
	.toku-flame .f1 span {background: #fff;}
	.toku-flame .f1{font-size: 1.1rem;line-height: 1.8rem;}
	#gaiyo .content p{line-height: 1.5rem;}
	.jigo .p1{font-size: 1.125rem;padding-bottom: 1rem;}
	.jigo .p2{font-size: 0.9rem;line-height:1.6rem;}
	
}
@media screen and (max-width:680px){
	.top2 a {font-size: 0.62rem!important;filter: drop-shadow(2px 1px 3px #33100C);}
	.Rhombus {
		background-position:  80px 0, 80px 0, 0 0, 0 0;
	  background-size: 80px 80px;
	  background-repeat: repeat;}
}
@media screen and (max-width:650px){
	dl {max-width: 90%;margin: 0 auto;}
	dt {margin-right: 2rem;}
	.top1 {max-width: 65px;}
}
@media screen and (max-width:600px){
	.br600 {display: block;}
	.toku-img{width: 90%;}
	.f2,#attention p{font-size: 0.9rem;}
	dl {max-width: 95%;}
	body {	font-size: 14px;}
	#tokuten .toku-flame {width: 93%;}
}
@media screen and (max-width:520px){
	.br520{display: block;}
	#gaiyo .content p{width: 95%;margin: 0 auto;}
}
@media screen and (max-width:500px){	
	#attention p {line-height: 1.5rem;}
	#schedule p{padding-top: 1rem;font-size: 1rem;}
	#schedule p span{font-size:1.5rem;}
	#onlineshop .fb-in{font-size: 0.875rem;}
	#onlineshop .fb-in dd span{font-size: 1.2rem;}
	#onlineshop .fb-in .bold{font-size:1.1rem;}
	#onlineshop .f1{font-size: 1rem;}
}
@media screen and (max-width:460px){
	html{scroll-padding-top: 80px;}
	.f2 {line-height: 1.7rem;}
	footer {font-size: 0.7rem;}
	body {font-size: 13px;}
	.br460 {display: block;}
	dt {width: 30%;}
	#gaiyo {font-size: 1.05rem;}
	.deco1 {max-width: 100%}
	.itemname1, .prices1 {font-size: 0.82rem;}
	.term1 {font-size: 0.7rem;line-height: 1rem;}
	.term1 span{font-size:0.68rem;}
	.itemname1 {line-height: 1.1rem;}
	#schedule li{padding: 3rem 1rem 2rem;}
	dt {	margin-right: 1rem;}
	#onlineshop .fb-in .bold {line-height:1.7rem;}
	.jigo .p1{font-size: 0.875rem;}
	.jigo .p2{font-size: 0.8rem;}
}

@media screen and (max-width:430px){
	.br430 {display: block;}
	.link img {max-width: 250px;}
}
@media screen and (max-width:410px){
	.br410 {display: block;}
	.toku-flame .f1 {font-size: 1rem;line-height: 1.5rem;}
}
@media screen and (max-width:400px){
	.item-name {letter-spacing: -0.1rem;}
	.f1 small {font-size: 0.87rem;}
	dt { margin-right: 0.5rem;}
	
}
@media screen and (max-width:380px){
	.brmax380{display: none;}
}
@media screen and (max-width:370px){
	.term1 {letter-spacing: -0.02rem;}
	.tw-left p {font-size: 0.87rem;}
	.br370{display: block;}
}