@charset "utf-8";
/* CSS Document */
html{scroll-padding-top: 150px;}
body {font-size: 16px;letter-spacing: 0.05rem;color: #012D69;}
.f1{ font-weight: bold; text-align: center; line-height: 1.8rem;}
.f2 {font-size: 1.2rem; text-align: center;line-height: 1.9rem;}
.f3{font-size: 1.4rem;}
.fb {font-weight: bold;}
section {max-width: 1200px;margin: 0 auto; width: 96%; margin-bottom: 5rem;}
h2 {padding-bottom: 2rem;margin: 0 auto;}
#gaiyo h2, #schedule h2, #tokuten h2, #attention h2{max-width: 300px;}
#onlineshop h2 {max-width: 540px;}
#media-x h2 {max-width:160px;}
#items h2 {max-width: 230px;}
.br930, .br500, .br650, .br600, .br400, .br392, .br381, .br361, .price-span{display: none;}
.content {max-width: 1008px;width: 100%;margin: 0 auto;/*padding:8rem 0;*/}
a:hover {cursor: pointer;}
a {color: inherit;text-decoration: none;}
/*bg*/

header{position: relative;z-index:3;}
h2, p, .fb, .toku-flame{position: relative;z-index:1;}
#global-nav .inner { z-index: 3; position: relative;}
.global-item:first-of-type a {color: #C2D94F;}
.global-item:nth-of-type(2) a {color: #F6E500;}
.global-item:nth-of-type(3) a {color: #EB6E8F;}
.global-item:nth-of-type(4) a {color: #A373AE;}
.global-item:nth-of-type(5) a {color: #53B1BE;}
.global-item:nth-of-type(6) a {color: #FFFFFF;}
.global-item:nth-of-type(7) a {color: #012D69; text-shadow: 1px 1px 2px #fff, -2px -2px 2px #fff,  -1px 1px 2px #fff, 1px -1px 2px #fff,  1px 0px 2px #fff, -1px -0px 2px #fff,  0px 2px 2px #fff, 0px -1px 2px #fff;}

/*gaiyo*/
#gaiyo {padding: 7rem 2rem;border-image: url("../img/green.png") 100 fill/70px round;}
#gaiyo .content div { max-width: 550px;margin: 0 auto;padding-top: 2.5rem;}
#gaiyo .f3 {text-align: center;}

/*schedule*/
#schedule p{padding-top: 2rem;font-size: 1.56rem;font-weight: bold;text-align: center;}
#schedule {padding: 7rem 2rem;border-image: url("../img/yellow.png") 100 fill/70px round;}
dl {font-weight: bold;display: flex;font-size: 1.4rem;align-items: baseline;}
dl:not(:last-child){padding-bottom: 1.5rem;}
dt {background: #012D69; color: #fff;margin-right: 2rem; height: 2.9rem;width: 140px;max-width: 25%;text-align: center;padding: 0.4rem 0;}
dd {max-width: 80%;}
dd span {font-size: 1.7rem;}

/*onlineshop*/
#onlineshop {/* padding: 5rem 0;border: 4rem solid;border-image-slice: 100 100 100 100 fill; border-image-source: url("../img/red.png");*/padding: 7rem 2rem;border-image: url("../img/red.png") 100 fill/70px round;}

/*twitter*/
.tw-left {max-width: 600px; margin: 0 auto; font-weight: bold;}
.tw-left p, .tw-left div{text-align: center; font-size: 1.375rem;}
.twi-p{padding: 2rem 0;}
.tw-left p a {color: #A675B0;font-size: 1.875rem;}
.media-x-bg {position: relative;}
#media-x {/*padding: 5rem 0;border: 4rem solid;border-image-slice: 100 100 100 100 fill; border-image-source: url("../img/darkblue.png");*/padding: 7rem 0;border-image: url("../img/purple_2.png") 200 fill/70px round;}

/*tokuten*/
#tokuten {/*padding: 7rem 0;border: 4rem solid; border-image-slice: 100 100 100 100 fill; border-image-source: url("../img/blue.png");*/padding: 7rem 0;border-image: url("../img/blue.png") 100 fill/70px round;}
#tokuten .toku-flame {max-width: 1020px;width: 100%;margin: 0 auto;}
.toku-img { z-index: 2; max-width: 900px; padding: 3rem;margin: 2rem auto;}
.toku-attention{text-align: left;padding-top: 2.5rem;}
.toku-flame .f1{font-size:1.125rem;line-height: 2.2rem;color: #012D69;}
.toku-flame .f3{text-align: center; margin-bottom: 3rem;}
.toku-attention {max-width: 680px;width: 100%;margin: 0 auto;color:#002D69;}
.pdeco {background: #012D69; color: #fff; text-align: center;padding: 0.3rem; font-size: 1.4rem;}
.deco1 {max-width: 80%;margin: 0 auto;}
.deco2 {max-width: 65%; margin: 0 auto;}
.tokuimg{margin-top: 1.5rem; margin-bottom: 3rem;}
.tokuimg2 {margin-top: 1rem; margin-bottom: 1rem;}
.deco3 {font-size: 1.7rem;}

/*items*/
#items .content {max-width: 1048px;width: 100%;margin: 0 auto;}
#items {/*border: 9.8rem solid; border-image-slice: 100 100 100 100 fill; border-image-source: url("../img/gray.png");*/padding: 7rem 0;border-image: url("../img/gray_2.png") 68 fill/70px round;}
/*#items {background: url("../img/graycopy.png");}*/
#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;}
#items li:last-child{ margin-right: 50.5%;}
.term1 {font-size: 0.9rem; padding: 0.3rem 0; margin: 0.3rem 0 0; font-weight: bold; line-height: 1.4rem;    border-bottom: #fff solid 2px;}
.animateme div{background: #002D69;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;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;}
/*attention*/
#attention {padding: 7rem 0;border-image: url("../img/darkblue.png") 125 fill/70px round;}
#attention p {color: #fff;z-index: 2;max-width: 1008px; margin: 0 auto;line-height: 1.6rem;}
.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 {z-index: 5;color: #fff; font-size: 0.8rem;}
.copyright {background:#002D69;padding: 1rem 0;}

@media screen and (max-width:1200px) {
	#attention p{width: 90%;font-size: 1rem;}
}
@media screen and (max-width:1100px) {
	#gaiyo {border-image: url(../img/green.png) 125 fill/70px round;}
	#schedule {border-image: url(../img/yellow.png) 125 fill/70px round;}
	#onlineshop {border-image: url(../img/red.png) 100 fill/55px round;}
	#media-x {border-image: url("../img/purple_2.png") 210 fill/70px round;}
	#tokuten { border-image: url(../img/blue.png) 100 fill/54px round;}
	#items{border-image: url(../img/gray_2.png) 68 fill/53px round;}
	#attention {border-image: url(../img/darkblue.png) 125 fill/70px round;}
}
@media screen and (max-width:1050px) {
	#tokuten .toku-flame{width: 96%;}
}
@media screen and (max-width:1000px) {
	body {font-size: 15px;}
	#attention p{padding-bottom: 1rem;}
	#gaiyo { padding: 5rem 2rem;}
	#schedule {padding: 5rem 2rem;}
	#onlineshop {padding: 5rem 2rem;}
	#media-x,#tokuten, #attention{padding: 5rem 2rem;}
	#items {padding: 5rem 0;}
}
@media screen and (max-width:950px) {
	#items li {width:calc(100%/2);}
	#items li:last-child {margin-right: 0;}
	#gaiyo{border-image: url(../img/green.png) 125 fill/55px round;}
	#schedule {border-image: url(../img/yellow.png) 125 fill/55px round;}
	#onlineshop {border-image: url(../img/red.png) 100 fill/50px round;}
	#media-x {border-image: url("../img/purple_2.png") 210 fill/45px round;}
	#tokuten { border-image: url(../img/blue.png) 100 fill/50px round;}
	#attention {border-image: url(../img/darkblue.png) 125 fill/60px round;}
}
@media screen and (max-width:930px) {
	.br930 {display: block;}
}
@media screen and (max-width:900px) {
	.toku-flame .p2{font-size: 1.2rem;}
	.toku-attention{width:90%;}
	.f4 { font-size: 1.6rem;}
	#gaiyo {margin-top: 5rem;}
	}
@media screen and (max-width:800px) {
	#onlineshop {border-image: url(../img/red.png) 120 fill/50px round;}
	#tokuten { border-image: url(../img/blue.png) 132 fill/50px round;}
	#attention {border-image: url(../img/darkblue.png) 125 fill/49px round;}
	#items { border-image: url(../img/gray_2.png) 68 fill/42px round;}
}
@media screen and (max-width:750px){
	.f3, dl, .pdeco { font-size: 1.2rem;}
	dd span, .deco3 {font-size: 1.4rem;}
	#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;}
}
@media screen and (max-width:690px){
	#media-x,#tokuten, #attention, #onlineshop, #schedule,#gaiyo {padding: 5rem 0rem;}
	.content {width: 96%;}
	.br690 {display: block;}
	dd {width: 80%;}
	dt {margin-right: 1rem;}
	}
@media screen and (max-width:680px){
	#gaiyo h2, #schedule h2, #tokuten h2, #attention h2{max-width: 250px;}
	#onlineshop h2 {max-width: 440px;}
	#media-x h2 {max-width:140px;}
	#items h2 {max-width: 200px;}
	.top2 a {font-size: 0.62rem!important;filter: drop-shadow(2px 1px 3px #33100C);}
}
@media screen and (max-width:650px){
	body {letter-spacing: 0;}
	.br650 {display: block;}
	.top1 {max-width: 65px;}
}
@media screen and (max-width:600px){
	.br600 {display: block;}
	.f2,#attention p{font-size: 0.9rem;}
	body {font-size: 14px;}
	.deco2 {max-width: 80%;}
	#items { border-image: url(../img/gray_2.png) 68 fill/30px round;}
}
@media screen and (max-width:520px){
	.f4 {font-size: 1.3rem; }
}
@media screen and (max-width:500px){
	.br500 {display: block;}
	#attention p {line-height: 1.5rem;}
	#onlineshop .f1{font-size: 1rem;}
	.f3, dl, .pdeco { font-size: 1rem;}
	dd span, .deco3 {font-size: 1.15rem;}
	dt {height: 2.3rem;}
	#gaiyo {border-image: url(../img/green.png) 125 fill/34px round;}
	#schedule { border-image: url(../img/yellow.png) 125 fill/31px round;}
	#onlineshop{border-image: url(../img/red.png) 100 fill/25px round;}
	#media-x { border-image: url("../img/purple_2.png") 210 fill/28px round;}
	#tokuten { border-image: url(../img/blue.png) 100 fill/25px round;}
	#attention {border-image: url(../img/darkblue.png) 125 fill/32px round;}

}
@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;}
	#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;}
}
@media screen and (max-width:410px){
	.toku-flame .f1 {font-size: 1rem;line-height: 1.5rem;}
	section {margin-bottom: 4rem;}
	#gaiyo {margin-top: 4rem;}
	.price-span{display: block;}
}
@media screen and (max-width:400px){
	#gaiyo {border-image: url(../img/green.png) 156 fill/34px round;}
	#schedule { border-image: url(../img/yellow.png) 146 fill/31px round;}
	#onlineshop{border-image: url(../img/red.png) 137 fill/25px round;}
	#media-x { border-image: url("../img/purple_2.png") 210 fill/22px round;}
	#tokuten { border-image: url(../img/blue.png) 127 fill/25px round;}
	#attention {border-image: url(../img/darkblue.png) 161 fill/32px round;}
	#items {border-image: url(../img/gray_2.png) 68 fill/22px round;}
	.br400 {display: block;}
	.item-name {letter-spacing: -0.1rem;}
	.f1 small {font-size: 0.87rem;}
	#media-x, #tokuten, #attention, #onlineshop, #schedule, #gaiyo, #items {  padding: 4rem 0rem;}
}
@media screen and (max-width:392px){
	.br392{display: block;}
}
@media screen and (max-width:381px){
	.br381{display: block;}
}
@media screen and (max-width:370px){
	.term1 {letter-spacing: -0.02rem;}
	.tw-left p {font-size: 0.87rem;}
}
@media screen and (max-width:361px){
	.br361{display: block;}
}
/*topへ戻るボタン*/
.top2 a{filter: drop-shadow(2px 2px 4px #3c3c3c);}
.top2 a::before {content: '\f062';font-family: 'Font Awesome 6 Free';font-size: 30px;font-weight: 900;color: #fff;line-height: 48px;border: 3px solid #fff;border-radius: 50%;padding: 0.6rem 0.85rem;background:#012D69;}
.top2{line-height:2.2rem;}