@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: 3rem;}
h2 img {max-width: 261px;margin: 0 auto;}
#onlineshop h2 img {max-width: 440px;margin: 0 auto;}
.br370, .br410, .br600, .br460, .br750, .br520, .br430, .br690, .br900{display: none;}
.brmax380{display:block;}
.bg-green {background: #FCEE0A;padding: 3rem 0 8rem;}
.content {max-width: 1008px;width: 100%;margin: 0 auto;/*padding:8rem 0;*/}
a:hover {cursor: pointer;}
a {color: inherit;text-decoration: none;}

/*bg*/
.schedule-bg, .media-x-bg, .tokuten-bg{margin: -1rem;}
.schedule-bg {background: url("../img/bgdot.png")repeat; background-size: contain; position: relative;}
.media-x-bg {background: #FCEE0A;}
.tokuten-bg {background:#FCEE0A;}

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

.bg_pattern { display: none!important;
  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;
}
header{position: relative;z-index:3;background: #000;}
h2, p, .fb, .toku-flame, .green{position: relative;z-index:1;}
/*#global-nav .inner {background: url("../img/Group2312.png")no-repeat;background-size: contain;}*/
#global-nav .inner {border-image: url("../img/path5276.png") 100 fill/100px/0px round;padding:1rem 5rem 1.5rem 3rem;margin-top: -1.5rem!important; z-index: 3; position: relative;}

/*gaiyo*/
#gaiyo {padding: 5rem 0;}
#gaiyo .content p{line-height: 2.8rem;padding-top: 8rem;text-shadow: 2px 2px 0px #FEFF00;}
.bl-line {position: absolute; top: -30px;}
.bg-green {position: relative;}
.ye-line1 {position: absolute;top: 200px;}
.ye-line2 {position: absolute;bottom: 41px;}
.bl-line2 {position: absolute;bottom: -79px;z-index: 1;}

/*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 { padding: 10rem 0 0;}
#schedule .content {color: #fff; width:96%;}
#schedule .f1 {padding-bottom: 1rem;}
.schedule-flex1, .schedule-flex0, .schedule-flex2 {display: flex;}
.pink2 {border-bottom: #D90057 solid 4px;padding-left: 2rem; letter-spacing: 2px;width: 100%;}
.place {width: 25%; font-size: 2.75rem;}
.detail {width: 67%;margin-left: 2rem;}
.f4 {font-size: 2rem;}
.schedule-flex0:not(:first-of-type) {padding-top: 4rem;}
.schedule-flex1 {display: flex; align-items: end;margin-bottom: 1rem;}
.pink {background: #D90057;  border-right: none; display: inline-block;margin-left: 10px; position: relative;
  transform: skewX(30deg);}
.btn-in {display: inline-block; padding: 5px 10px;transform: skewX(-30deg); width: 100px;}
.btn-in::after{background: #D90057; content: ''; height: 100%; position: absolute; top: 0; left: -10px; z-index: -1; width: 20px;}
.schedule-flex2{justify-content: /*space-between*/flex-start;}
.schedule-flex2 a{background: url(../img/green.png)no-repeat; background-size: contain; padding: 1rem; width: calc(93%/3); text-align: center; background-position-y: center;color: #000;margin-right: 1rem;}
.schedule-flex2 a:last-child{margin-right: 0;}
.zendot {font-family: "Zen Dots", sans-serif; font-weight: 400; font-size: 0.5rem;}
.triangle {font-size: 1rem; float: right; padding-right: 1rem;}
.bl-line4 {position: absolute; bottom: -35px;z-index: 1}
#schedule p.schedule-info{font-size: 1.125rem;padding-top: 3rem;}
#schedule p.schedule-info a{text-decoration-line: underline;}

/*onlineshop*/
#onlineshop h2 {max-width: 540px;padding-bottom: 4rem;}
#onlineshop .content > p{max-width: 620px;width: 100%;margin: 0 auto;color: #fff;font-weight: normal;}
#onlineshop .banner{padding: 2rem 0;}
#onlineshop .content{padding: 7rem 0; border-image: url("../img/group2815-2.png") 100 fill/60px/20px round;}
#onlineshop { padding: 5rem 0;}

/*twitter*/
.tw-left {max-width: 600px; margin: 0 auto; padding-top: 5rem;}
.tw-left p, .tw-left div{text-align: center; font-size: 1.375rem;}
.twi-p{padding: 2rem 0;}
.tw-left p a {color: #84AC16;font-size: 1.875rem;}
.down {padding-right: 1rem;}
.down img{width: 1rem;}
.down0 {display: flex; align-items: center;justify-content: center;padding: 2rem 0 1rem;}
.media-x-bg {position: relative;}
.ye-line3 {position: absolute; top: 180px;}
.ye-line4 {position: absolute; bottom: 0;}
#media-x {padding: 7rem 0 8rem 0;}
.ximg img {max-width: 380px; margin: 0 auto;}

/*tokuten*/
#tokuten {padding: 8rem 0 0;}
#tokuten .toku-flame {max-width: 1020px;width: 100%;margin: 0 auto;}
#tokuten .content {/*background-color:rgba(0,0,0,0.53);*/ background: #000000; padding: 5rem 0;}
.toku-img { z-index: 2; max-width: 900px; border: 4px solid #FCEE0A;  padding: 4rem;margin: 2rem auto;}
.toku-attention{text-align: left;padding-top: 1rem;}
.toku-flame .f1{font-size:1.125rem;line-height: 2.2rem;}
.toku-flame .f1 span {padding: 0.1rem;}
.toku-flame .p2 {font-size: 1.5rem;color: #FCEE0A;}
.toku-attention {max-width: 680px;width: 100%;margin: 0 auto;color: #fff;}
.tkimg {position: relative;}
.kado1 {position: absolute; top: -5px; left: -5px;transform: rotate(180deg);max-width: 60px;
}
.kado2 {position: absolute; max-width: 60px; bottom: -5px; right: -5px;}

/*items*/
.green {background:url("../img/bgdot.png")repeat;background-size: contain;}
#items .content {max-width: 1048px;width: 100%;margin: 0 auto;padding: 4.875rem 0;}
#items {position:relative; padding: 8rem 0 0;}
#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; background: #FCEE0A;}
.term1 span{font-size: 0.75rem;font-weight: normal;}
.itemname1 {height: 3rem; 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: #FEFF00;padding-bottom: 0.3rem;}
.prices1 span{font-size: 0.7rem;font-weight: normal;}
.prices1 small{font-weight: normal;color: #fff;}
.item-name {font-size: 0.8rem;}
hr {width:85%;margin: 0 auto;}
.ye-line5 {position: absolute; top: 0;}
.bl-line3 {position: absolute; bottom: -80px;}
.three {font-weight: bold!important; font-size: 1.2rem!important;}
/*attention*/
#attention {padding: 8rem 0 5rem;}
.bg-yellow {background: #FCEE0A;}
#attention p {color: #fff;z-index: 2;max-width: 1008px; margin: 0 auto;line-height: 1.5rem;font-size: 0.9rem;}
.top1 {position: fixed; bottom: 7%; 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;}
#attention .content {/*background:rgba(0,0,0,0.50);*/background: #000000;padding: 5rem;}
.logo {max-width: 345px; margin: 0 auto; padding-top: 2rem;}

/*footer*/
main{position: relative;}
footer {z-index: 5;color: #fff; font-size: 0.7rem;}
.copyright {background:#000000;padding: 1rem 0;}

@media screen and (max-width:1430px) {
	.bl-line2 {bottom: -56px;}
}
@media screen and (max-width:1200px) {
	h2 {max-width: 230px;width: 80%;padding-bottom: 2rem;}
	#onlineshop h2 {max-width: 350px;}
	#attention p{width: 90%;}
	.bl-line3 {bottom: -55px;}
}
@media screen and (max-width:1080px) {
	.bl-line2 {bottom: -33px;}
}
@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: 3rem;}
	#schedule p{padding-top: 1rem;font-size: 1rem;}
	#schedule p span{font-size:2rem;}
	#attention p{padding-bottom: 1rem;}
	#gaiyo { padding: 3rem 0;}
	.ye-line1 {top: 170px;}
	.ye-line2 {bottom: 60px;}
	.bl-line2 {bottom: -30px;}
	.bg-green {padding: 3rem 0 6rem;}
	#schedule {padding: 7rem 0 0;}
	#onlineshop {padding: 3rem 0;}
	#items {padding-top: 3rem;}
	#tokuten .content{width:98%;}
}
@media screen and (max-width:950px) {
	#items li {width:calc(97%/2);}
	.place {font-size: 2rem;}
	#onlineshop .content {padding: 5rem 3rem;}
}
@media screen and (max-width:900px) {
	.br900{display: block;}
	.toku-flame .p2{font-size: 1.2rem;}
	.toku-attention{width:90%;}
	.schedule-flex0 {flex-direction: column;}
	.detail{width: 100%;margin-left: 0;}
	.triangle{float: left;}
	.place {width: 70%;}
	.f4 { font-size: 1.9rem;}
	.bl-line {top: 0;}
	.bl-line3 {bottom: -23px;}
	}
@media screen and (max-width:750px){
	.br750 {display: block;}
	#gaiyo .f2 {padding-top: 5rem;}
	.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;}
	#onlineshop .content > p {width: 90%;}
	.toku-flame .f1{font-size: 1.1rem;line-height: 1.8rem;}
	#gaiyo .content p{line-height: 1.5rem;padding-top:4rem;}
	.pink2 {padding-left: 1rem;}
	h2 {max-width: 200px;}
	#onlineshop h2{max-width: 300px;}
	.bl-line2 { bottom: -10px;}
	.bl-line4 {bottom: -20px;}
}
@media screen and (max-width:690px){
	.br690 {display: block;}
	.tokuten-bg{padding-bottom: 3rem;}
	#tokuten .content {padding-bottom: 3rem;}
	}
@media screen and (max-width:680px){
	.top2 a {font-size: 0.62rem!important;filter: drop-shadow(2px 1px 3px #33100C);}
}
@media screen and (max-width:650px){
	.top1 {max-width: 65px;}
	.ximg img {max-width: 250px;}
	#tokuten .content{width: 96%;}
	#schedule p.schedule-info{font-size: 1rem;}
}
@media screen and (max-width:600px){
	.br600 {display: block;}
	.f2,#attention p{font-size: 0.9rem;}
	body {	font-size: 14px;}
	/*#tokuten .toku-flame {width: 93%;}*/
	.kado2, .kado1 {max-width: 40px;}
	.toku-img {padding: 2rem;}
	.ye-line1 {top: 180px;}
	#gaiyo {padding: 2rem 0;}
	#schedule {padding-top: 5rem;}
	#media-x {padding: 4rem 0 3rem 0;}
	#tokuten {padding-top: 4rem;}
	#tokuten .content {padding: 4rem 0;}
	#items .content {padding: 3rem 0 1rem 0;}
	#attention .content {padding: 3rem;}
	.ye-line3 {top: 160px;}
	#attention {padding: 6rem 0 4rem 0;}
}
@media screen and (max-width:520px){
	.br520{display: block;}
	#gaiyo .content p{width: 95%;margin: 0 auto;}
	.btn-in {padding: 5px 0; width: 65px;}
	.f4 {font-size: 1.3rem; }
	.pink2{ border-bottom: #D90057 solid 3px;}
	.schedule-flex2 a{width: 80%;  background-position: center;margin-bottom: 1rem;margin-right: 0;}
	.schedule-flex2{flex-direction: column; align-items: center;}
	.bl-line4 {bottom: 0px;}
	#tokuten .content{width: 92%;}
	.toku-img {border: 3px solid #FCEE0A;}
}
@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 .f1{font-size: 1rem;}
}
@media screen and (max-width:460px){
	html{scroll-padding-top: 80px;}
	.f2 {line-height: 1.7rem;}
	footer {font-size: 0.6rem;}
	body {font-size: 13px;}
	.br460 {display: block;}
	#gaiyo {font-size: 1.05rem;}
	.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;}
	.f4 {font-size: 1.1rem;}
	.pink {letter-spacing: 0;padding-left: 0.3rem;}
	.btn-in{transform: skewX(-20deg);}
	.pink{ transform: skewX(20deg);}
	#onlineshop .content{border-image: url(../img/group2815-2.png) 100 fill/55px/20px round;}
	.toku-img {padding: 2rem 1rem;}
	#attention .content {padding: 3rem 1rem;}
	#schedule .content {width: 94%;}
}
	@media screen and (max-width:430px){
		.br430 {display: block;}
		.f4 { font-size: 1.3rem;}
	}

@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;}
	.bl-line2 {bottom: 0;}
}
@media screen and (max-width:380px){
	.brmax380{display: none;}
}
@media screen and (max-width:370px){
	.br600{display: none;}
	.term1 {letter-spacing: -0.02rem;}
	.tw-left p {font-size: 0.87rem;}
	.br370{display: block;}
}

.br800{display: none;}
.online-content{color: #fff;max-width: 660px;margin: 0 auto;}
.online-bold{font-weight: bold; text-align: center; line-height: 1.8rem;padding: 2rem 0;font-size: 1.3rem;}
.online-content dl {display: flex;margin-bottom : 1rem;align-items: center;font-weight: bold;}
.online-content dl dt{background: #fff;color: #333;padding: 0.3rem 0.5rem;margin-right: 1rem;width: 84px;}
.online-content dl dd span{font-size: 1.5rem;}
@media screen and (max-width:800px){
	.br800{display: block;}
	.online-content dl dt{margin: 0 auto;}
	.online-content dl dd{margin: 0 auto;width: 300px;padding: 1rem 0;}
	.online-content dl{display: block;magin: 0 auto;}

}
@media screen and (max-width:750px){
	.online-content{width: 90%;}
}
@media screen and (max-width:600px){
	.online-content dl dt{width: 72px;}
	.online-content dl dd{width: 260px;}
	.online-content dl dd span{font-size: 1.3rem;}
	.online-bold{font-size: 1.125rem;}
}


