@charset "UTF-8";
/*
Version: 2.2.6
Creation Date: 2024.9.23
Last Updated: 2025.3.11
*/


/* import
------------------------------------------------------------ */
@import "https://w-shiya.com/release/css/ampersand-2024.css";
@import "https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap";


/* set
------------------------------------------------------------ */
* {
font-style: normal;
}
body {
background: #00441B;
font-family: "Zen Kaku Gothic New", sans-serif;
font-weight: 700;
}


/* Loading
------------------------------------------------------------ */
#splash {
background: #00441B;
width: 100%;
height: 100%;
position: fixed;
z-index: 9999999;
}
#splash-logo {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
overflow: hidden;
}
#splash video {
max-width: inherit;
max-height: inherit;
min-width: 100%;
min-height: 110%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -1;
opacity: .3;
}
#container {
opacity: 0;
}
body.appear #container {
animation: PageAppear 1s .2s forwards;
}
@keyframes PageAppear {
0%    {opacity: 0;}
100%  {opacity: 1;}
}

body#noLoading #splash {
display: none;
}
body#noLoading #container {
opacity: 1;
}


/* common
------------------------------------------------------------ */
/* font */
.TA { /* TA演芸筆 */
font-family: "ta-engeifude", sans-serif;
font-weight: 400;
}
.CL { /* コーポレート・ロゴ ver2 */
font-family: "corporate-logo-ver2", sans-serif;
font-weight: 500;
}
.CL.b {
font-weight: 700;
}
.EN { /* Kegger Regular */
font-family: "kegger-us", serif;
font-weight: 400;
}
.SPM { /* Sheepman Regular */
font-family: "sheepman", serif;
font-weight: 400;
}
.SPM-ilc { /* Sheepman Regular Slanted */
font-family: "sheepman", serif;
font-weight: 400;
font-style: italic;
}
.KRL { /* Korolev Condensed Medium */
font-family: korolev-condensed, sans-serif;
font-weight: 500;
}
.ZEN {
font-family: "Zen Kaku Gothic New", sans-serif;
font-weight: 700;
}
@font-face {
font-family: "RDN";
src: url(font/Raiden-Regular.otf);
}
@font-face {
font-family: "RDN-ilc";
src: url(font/Raiden-Italic.otf);
}
.RDN { /* Raiden Regular */
font-family: "RDN", "kegger-us", serif;
}
.RDN-ilc { /* Raiden Italic */
font-family: "RDN-ilc", "kegger-us", serif;
font-style: italic;
}
.f42 {font-size: 4.2rem;}
.f60 {font-size: 6rem;}

/* layout */
section {
width: 1090px;
}

/* style */
.zidx1 {
position: relative;
z-index: 1;
}
.zidx2 {
position: relative;
z-index: 2;
}
.zidx3 {
position: relative;
z-index: 3;
}
i {
margin-right: .2rem;
}
.hvr {
text-decoration: underline;
}
.hvr:hover {
text-decoration: none;
}
.more a {
background: #00441B;
color: #FFF;
font-size: 140%;
text-decoration: none;
padding: 1rem 2rem;
display: inline-block;
border-radius: 5px;
}
.more a:hover {
opacity: .7;
}
.more.zidx2 a {
font-size: 160%;
padding: 1.5rem 3rem;
}
.link a {
background: #FFF;
color: #00441B;
white-space: nowrap;
padding: .3em 1em;
display: inline-block;
border: 2px solid #FFF;
border-radius: 3px;
}
.link a:hover {
background: #00441B;
color: #FFF;
}
.special {
background: #FFF;
color: #00441B;
margin: -2em auto 3em;
border: 9px solid #BFA666;
position: relative;
}
.special + .special {
margin: 3em auto;
}
.special::before,
.special::after {
content: "";
background: #BFA666;
width: 5vw;
height: 5vw;
clip-path: polygon(0 0, 0 100%, 100% 0);
position: absolute;
top: -1px;
left: -1px;
}
.special::after {
clip-path: polygon(100% 0, 0 100%, 100% 100%);
top: auto;
left: auto;
bottom: -1px;
right: -1px;
}
.special.af-none::after {
display: none;
}
.special figure {
text-align: left;
}
.special h3 {
background: #BFA666;
font-family: "corporate-logo-ver2", sans-serif;
font-size: 3.4rem;
font-style: italic;
letter-spacing: .03em;
margin-top: -.5em;
padding: .5em 4em .5em 1em;
clip-path: polygon(0 0, 100% 0%, 80% 100%, 0% 100%);
display: inline-block;
}
.special figcaption {
padding: 2em;
}
.special figcaption dl {
display: flex;
flex-wrap: wrap;
}
.special figcaption dl dt {
font-size: 1.8rem;
flex-basis: 6em;
}
.special figcaption dl dd {
font-size: 2rem;
flex-basis: calc(100% - 6em);
padding-bottom: .5em;
}
.special figcaption a {
color: #BFA666;
margin-bottom: .5em;
display: block;
word-break: break-all;
}
.special figcaption a:hover {
text-decoration: underline;
}
.special .link {
position: absolute;
right: 4vw;
bottom: 2vw;
z-index: 1;
}
.special .link a {
background: #00441B;
color: #FFF;
border: 2px solid #00441B;
}
.special .link a:hover {
background: #FFF;
color: #00441B;
}

/* color */
.grn {
color: #00441B;
}
.gld {
color: #BFA666;
}
p em {
color: #B81C25;
}

/* background */
.bg_grn {
background: #00441B;
color: #BFA666;
}
.bg_grn.wht {
color: #FFF;
}
.bg_gld {
background: #BFA666;
}
.beige {
background: #BBA265;
color: #FFF;
}

/* Swiper */
.swiper-nav {
position: relative;
}
.swiper-prev,
.swiper-next {
top: 50%;
}

/* Modaal */
.modaal-content-container {
max-height: calc(100svh - 160px);
overflow: auto;
}
.modaal-close:focus:after,.modaal-close:focus:before,.modaal-close:hover:after,.modaal-close:hover:before {
background: #00441B;
}


/* header
------------------------------------------------------------ */
header {
width: 100%;
height: 70px;
position: fixed;
top: 0;
left: 0;
z-index: 3;
}
header h1 {
max-width: calc(100% - 140px);
height: 100%;
display: flex;
align-items: center;
}
#menu {
background: url("images/menu.png") no-repeat;
right: 70px;
}
#menu.open {
background: url("images/menu_close.png") no-repeat;
}
#share .btn {
background: url("images/share.png") no-repeat;
right: 0;
}
#share .btn.open {
background: url("images/share_close.png") no-repeat;
}
.btn {
background-size: contain !important;
position: absolute;
top: 0;
width: 70px;
height: 70px;
text-indent: -9999px;
cursor: pointer;
}
nav {
display: none;
background: rgba(0,68,27,.95);
width: 100%;
height: calc(100svh - 150px);
position: absolute;
top: 100%;
right: 0;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
nav ul li a {
padding: .5em 0;
display: block;
}
#share ul {
display: none;
background: rgba(191,166,102,.9);
width: 70px;
position: absolute;
top: 100%;
right: 0;
}


/* main
------------------------------------------------------------ */
/* #main */
#main {
margin-top: 70px;
}

/* #day */
#day {
background: url("images/day_bg.png") no-repeat center/cover;
padding: 3rem 0 8rem;
margin-bottom: -3rem;
}
#day::before {
content: "©TOSHIBA BRAVELUPUS TOKYO";
font-size: 1.2rem;
position: absolute;
bottom: 5%;
right: 1rem;
z-index: 1;
}
#day section {
width: 1000px;
}
#day section.flex {
padding: 1rem 0;
}
#day section.flex div:nth-child(2) {
order: -1;
}
#day ul.flex {
align-items: center;
}

/* #highlight */
#highlight {
padding-bottom: 10rem;
}
#highlight section {
width: 1100px;
z-index: 1;
}
#highlight section::before,
#highlight section::after {
content: "";
background: url("images/bg_player_01.png") no-repeat top/contain;
width: 220px;
max-width: 20%;
height: 545px;
position: absolute;
top: 5%;
right: -4%;
z-index: 1;
}
#highlight section::after {
background: url("images/bg_player_02.png") no-repeat top right/contain;
width: 170px;
max-width: 15%;
height: 630px;
top: 40%;
right: auto;
left: -5%;
}
#highlight h2.zidx2 {
margin-bottom: -50px;
}

.box {
background: url("images/box_top.png") no-repeat top/100% auto,
            url("images/box_bg.png") repeat-y center/100% auto;
border: 3px solid #bfa666;
outline: 2px solid #bfa666;
outline-offset: -7.5px;
position: relative;
}
.box::before,
.box::after {
content: "";
background: #EA612C url("images/corner.png") no-repeat left/contain;
width: 18px;
height: 18px;
position: absolute;
top: -3px;
left: -3px;
}
.box::after {
left: auto;
right: -3px;
transform: rotate(90deg);
}
.box > div {
padding: 6rem 5% 4rem;
position: relative;
}
.box > div::before,
.box > div::after {
content: "";
background: url("images/corner.png") no-repeat left/contain,url("images/box_bg.png");
width: 18px;
height: 18px;
position: absolute;
bottom: -3px;
left: -3px;
transform: rotate(-90deg);
}
.box > div::after {
left: auto;
right: -3px;
transform: rotate(180deg);
}
.box > div >* {
max-width: 800px;
margin: 0 auto;
}
.box h3 {
margin-bottom: -35px;
}
.box .highlight {
max-width: 800px;
margin: 0 auto 4rem;
border: 10px solid #bba265;
position: relative;
z-index: 1;
}
.box .highlight p {
background: #00441B;
color: #FFF;
padding: .5em 1em;
position: absolute;
top: -10px;
right: -10px;
}
.box .highlight .link {
position: absolute;
right: 2vw;
bottom: 1vw;
z-index: 1;
}
.box .highlight .link a {
background: #00441B;
color: #FFF;
border: 2px solid #00441B;
}
.box .highlight .link a:hover {
background: #FFF;
color: #00441B;
}

.fireworks >*,
.clouds >* {
position: absolute;
}
#highlight .clouds li:nth-child(1) {
width: 350px;
max-width: 31%;
bottom: -3%;
left: 0;
z-index: 1;
}
#highlight .clouds li:nth-child(2) {
width: 350px;
max-width: 31%;
bottom: -3%;
right: 0;
z-index: 1;
}
#highlight .clouds li:nth-child(3) {
width: 530px;
max-width: 45%;
top: -2%;
left: 1%;
}
#highlight .clouds li:nth-child(4) {
width: 530px;
max-width: 45%;
top: -2%;
right: 1%;
}
#highlight .clouds li:nth-child(5) {
width: 360px;
max-width: 25%;
bottom: 30%;
left: -5%;
z-index: 1;
animation: fwfw-x 10s ease-in-out infinite alternate-reverse;
}
#highlight .clouds li:nth-child(5) img {
animation: fwfw-y 10s ease-in-out infinite alternate-reverse;
}
#highlight .clouds li:nth-child(6) {
width: 360px;
max-width: 25%;
top: 40%;
right: -5%;
z-index: 1;
animation: fwfw--x 8s ease-in-out infinite alternate-reverse;
}
#highlight .clouds li:nth-child(6) img {
animation: fwfw-y 3s ease-in-out infinite alternate-reverse;
}
#highlight .clouds li:nth-child(7) {
width: 260px;
max-width: 20%;
top: 20%;
left: -4%;
z-index: 1;
animation: fwfw 10s ease-in-out infinite;
}
#highlight .clouds li:nth-child(8) {
width: 260px;
max-width: 20%;
bottom: 20%;
right: -1%;
z-index: 1;
animation: fwfw 7s ease-in-out infinite;
}
@keyframes fwfw {
0%    {transform: translateX(0);}
50%   {transform: translateX(-10%);}
100%  {transform: translateX(0);}
}
@keyframes fwfw-x {
0%    {transform: translateX(-20%);}
100%  {transform: translateX(0);}
}
@keyframes fwfw--x {
0%    {transform: translateX(20%);}
100%  {transform: translateX(0);}
}
@keyframes fwfw-y {
0%    {transform: translateY(-5%);}
100%  {transform: translateY(5%);}
}

/* #event */
#event {
padding: 6rem 0;
}
#event section {
padding: 5rem 0 1rem;
}
#event::after {
content: "";
background: url("images/bg_org.png") no-repeat top/contain, url("images/box_bg.png") repeat center/1100px;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
#event section::before,
#event section::after {
content: "";
background: url("images/emblem.png") no-repeat top/contain;
background: url("images/limey.png") no-repeat top/contain;
width: 180px;
height: 412px;
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
#event section::after {
background: url("images/riger.png") no-repeat top/contain;
width: 350px;
height: 440px;
right: auto;
left: -10%;
}
#event a:hover {
text-decoration: underline;
}
#event li.item {
flex-basis: 49%;
margin-bottom: 4rem;
z-index: 1;
}
#event li.item div {
max-width: 450px;
margin: 0 auto -80px;
}
#event .fireworks li:nth-child(1) {
width: 300px;
max-width: 27%;
top: 15%;
right: -5%;
z-index: 1;
}
#event .fireworks li:nth-child(2) {
width: 250px;
max-width: 22%;
top: 30%;
left: -5%;
z-index: 1;
}
#event .fireworks li:nth-child(3) {
width: 220px;
max-width: 20%;
top: 50%;
right: -3%;
z-index: 1;
}
#event .fireworks li:nth-child(4) {
width: 185px;
max-width: 16%;
bottom: 20%;
left: 0;
z-index: 1;
}
#event .fireworks li:nth-child(5) {
width: 265px;
max-width: 24%;
bottom: -3%;
right: -1%;
z-index: 1;
}

/* #gourmet */
#gourmet {
padding: 6rem 0;
}
#gourmet::after {
content: "";
background: url("images/bg_grn.png") no-repeat top/contain;
width: 100%;
height: 100%;
position: absolute;
top: 0%;
left: 0;
z-index: -1;
}
#gourmet::before {
content: "";
background: url("images/bg_player_03.png") no-repeat top right/contain;
width: 190px;
max-width: 17%;
height: 536px;
position: absolute;
top: 5%;
right: 10%;
z-index: 1;
}
#gourmet section {
width: 1150px;
padding: 5rem 0;
z-index: 1;
}
#gourmet #gourmet_thema img {
border: 3px solid #FFF;
border-radius: 5px;
}
#gourmet h4 {
background: #BFA666;
color: #00441B;
padding: .5em 3em .5em 2em;
margin: 3em auto 1em;
clip-path: polygon(0 0, 100% 0, calc(100% - 2vw) 100%, 0 100%);
}
___#gourmet .thema::after {
content: "肉・唐揚げ・餃子祭り";
background: #00441B;
background: #000;
color: #FFF;
font-size: 1.2rem;
padding: 0 2px 1px 8px;
position: absolute;
right: 0;
top: 0;
}
#gourmet .thema::after {
content: "";
background: url("images/gourmet_thema_logo.png") no-repeat center/contain;
width: 80px;
height: 80px;
position: absolute;
right: 0;
top: 0;
}
___#gourmet ul.col-5 li::after {
content: "場外";
background: #3882EB;
color: #FFF;
font-size: 1.2rem;
padding: 0 8px 1px;
position: absolute;
right: 0;
bottom: 0;
}
___#gourmet ul.col-5 li.in::after {
content: "場内";
background: #F88B19;
}
#gourmet .clouds li:nth-child(1) {
width: 400px;
max-width: 36%;
top: -1%;
left: 1%;
animation: fwfw-x 10s ease-in-out infinite alternate-reverse;
}
#gourmet .clouds li:nth-child(1) img {
animation: fwfw-y 10s ease-in-out infinite alternate-reverse;
}
#gourmet .clouds li:nth-child(2) {
width: 400px;
max-width: 36%;
bottom: -1%;
right: -2%;
z-index: 1;
animation: fwfw--x 8s ease-in-out infinite alternate-reverse;
}
#gourmet .clouds li:nth-child(2) img {
animation: fwfw-y 3s ease-in-out infinite alternate-reverse;
}
#gourmet .clouds li:nth-child(3) {
width: 250px;
max-width: 22%;
bottom: 15%;
left: 2%;
animation: fwfw 10s ease-in-out infinite;
}
#gourmet .clouds li:nth-child(4) {
width: 250px;
max-width: 22%;
top: 2%;
right: 2%;
animation: fwfw 7s ease-in-out infinite
}

ul.col-5 {
flex-wrap: wrap;
position: relative;
z-index: 1;
}
ul.col-5 li {
background: #FFF;
flex-basis: calc(100% / 5 - 10px);
margin: 4.8px;
padding-bottom: 1rem;
border: 4px solid #BBA265;
border-radius: 5px;
position: relative;
}
ul.col-5 li h3.txt {
padding: 1rem 1rem 0;
}
ul.col-5 li .txt {
padding: 1rem;
}
ul.col-5 li dl dt {
padding: 0 5px;
display: inline-block;
border-radius: 0 2px 2px 0;
}
ul.col-5 li dl dd {
padding: 0 5px;
}
ul.col-5 li > div {
display: flex;
flex-direction: column;
height: 100%;
}
ul.col-5 li dl {
margin-top: auto;
}

#gourmet figure img {
border: 1px solid #FFF;
}
#gourmet figure > div {
margin-bottom: 2rem;
position: relative;
z-index: -1;
}
#gourmet figure > div::before,
#gourmet figure > div::after {
content: "";
background: #00441B;
width: 100px;
height: 100px;
display: block;
transform: rotate(-35deg);
position: absolute;
z-index: 1;
}
#gourmet figure > div::before {
border-bottom: 1px solid #FFF;
top: -70px;
left: -50px;
}
#gourmet figure > div::after {
border-top: 1px solid #FFF;
bottom: -70px;
right: -50px;
}
#gourmet figcaption {
padding: 2rem 3rem;
border-top: 1px solid #FFF;
border-bottom: 1px solid #FFF;
position: relative;
}
#gourmet figcaption::before,
#gourmet figcaption::after {
content: "";
background: #FFF;
width: 1px;
height: -webkit-calc(100% + 20px);
height: calc(100% + 20px);
position: absolute;
top: -10px;
}
#gourmet figcaption::before {
left: 10px;
}
#gourmet figcaption::after {
right: 10px;
}

/* #goods */
#goods {
___display: none;
margin-bottom: 6rem;
padding: 6rem 0;
}
#goods::after {
content: "";
background: url("images/bg_org.png") no-repeat top/contain, url("images/box_bg.png") repeat center/1100px;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
}
#goods::before {
content: "";
background: url("images/bg_player_04.png") no-repeat top right/contain;
width: 260px;
max-width: 23%;
height: 590px;
position: absolute;
top: -5%;
left: 10%;
z-index: 1;
}
#goods .fireworks li:nth-child(1) {
width: 200px;
max-width: 18%;
top: -5%;
left: 0;
}
#goods .fireworks li:nth-child(2) {
width: 185px;
max-width: 16%;
bottom: -3%;
right: 3%;
z-index: 1;
}
#goods .fireworks li:nth-child(3) {
width: 265px;
max-width: 24%;
top: 7%;
right: 5%;
}
#goods .swiper {
width: 1150px;
padding-top: 5rem;
padding-bottom: 3rem;
}
#goods .swiper-slide {
height: auto;
width: 350px;
padding: 40px 10px 10px;
}
#goods .swiper-slide::after {
content: "";
background: url("images/swiper_bg.png") no-repeat top/100% 100%;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
#goods .swiper-slide > div {
background: #FFF;
height: 100%;
padding-bottom: 90px;	/* 価格表示の場合 */
___padding-bottom: 20px;	/* 価格非表示の場合 */
border: 1px solid #00441b;
position: relative;
}
#goods .swiper-slide h3 {
font-weight: 700;
margin-top: 10px;
}
#goods .swiper-slide dl {
width: 100%;
padding-left: 1rem;
position: absolute;
left: 0;
bottom: 10px;
}
#goods .swiper-slide dl dt {
line-height: 25px;
text-align: center;
width: 50px;
height: 25px;
margin: 0 10px 10px 0;
float: left;
clear: both;
}
#goods .swiper-slide dl dt.long {
width: 65px;
}
#goods .swiper-slide dl dd {
margin-bottom: 10px;
}
#goods .prev,
#goods .next {
margin: 3rem .5rem;
cursor: pointer;
}

/* #players */
#players {
background: url("images/players_bg.png") no-repeat center/auto 100%;
padding-top: 3rem;
}
#players::before {
content: "";
background: url("images/ttl_bg_player.png") no-repeat top left/contain;
width: 100%;
height: 285px;
position: absolute;
top: 3rem;
left: -1%;
}
#players section {
padding: 8em 0;
}
#players .swiper {
margin: 3em 0;
}
#players .swiper-slide p {
font-size: 1.8rem;
text-align: left;
padding: 1em 0;
display: none;
}
#players .swiper-slide-active p {
display: block;
}
#players .swiper-prev {
top: 30rem;
left: 28%;
transform: translateY(0);
}
#players .swiper-next {
top: 30rem;
right: 28%;
transform: translateY(0);
}

/* #schedule */
#schedule {
background: url("images/schedule_bg.png") no-repeat center/100% auto;
background: url("images/schedule_bg.png") no-repeat center/auto 60%;
}
#schedule::after {
content: "";
background: url("images/bg_player_05.png") no-repeat center/contain;
width: 300px;
max-width: 27%;
height: 775px;
position: absolute;
top: 12%;
left: 15%;
z-index: 1;
}
#schedule::before {
content: "";
background: url("images/ttl_bg_schedule.png") no-repeat top right/contain;
width: 100%;
height: 285px;
position: absolute;
top: 0;
left: 5%;
}
#schedule section {
padding: 8em 0;
z-index: 2;
}
#schedule ol {
max-width: 560px;
___margin: 8em 0 4em;
margin: 9em 0 3em;
position: relative;
left: 50%;
}
#schedule ol li {
___padding: 1em 0;
padding: .5em 0;
}
#schedule ol li:not(:first-child) {
border-top: 1px solid #FFF;
}
#schedule ol li time {
letter-spacing: .06em;
width: 3em;
}
#schedule .swiper-wrapper {
transition-timing-function: linear !important;
}

/* #model */
#model section {
padding: 5em 0;
}
#model .swiper-wrapper {
margin: 50px auto;
}
#model .swiper-pagination-bullet {
background: #FFF;
width: 50px;
height: 5px;
border-radius: 0;
opacity: 1;
}
#model .swiper-pagination-bullet-active {
background: #BFA666;
}
#model .swiper-prev,
#model .swiper-next {
background: #BFA666;
width: 45px;
padding: 5px 0;
top: 53%;
}
#model .swiper-prev {
left: 5px;
}
#model .swiper-next {
right: 5px;
}
#model section .swiper {
padding-top: 5%;
}
#model figure {
background: #FFF;
color: #FFF;
padding: 5%;
border: 9px solid #BFA666;
border-radius: 30px;
justify-content: space-between;
}
#model figure div {
flex-basis: 58%;
margin-top: -12%;
}
#model figure div img {
border: 9px solid #FFF;
}
#model figcaption {
color: #00441B;
font-size: 1.8rem;
line-height: 1.8;
text-align: left;
flex-basis: 38%;
opacity: 0;
}
#model figure.swiper-slide-visible figcaption {
opacity: 1;
}
#model figcaption strong {
font-size: 2.3rem;
line-height: 1.3;
font-weight: 700;
margin-bottom: .5em;
display: block;
}
#model figcaption strong time {
font-size: 3.5rem;
padding-right: .3em;
}
#model figcaption strong time span {
font-size: 2rem;
}

/* #tickets */
#tickets::before {
content: "";
background: url("images/ttl_bg_tickets.png") no-repeat top right/contain;
width: 100%;
height: 285px;
position: absolute;
top: 0;
left: 1%;
z-index: -1;
}
#tickets section {
padding: 8em 0;
}
#tickets #seat {
max-width: 1000px;
margin: 0 auto 3em;
}
#tickets .special {
max-width: 1000px;
}
#tickets .special figure > div img {
aspect-ratio: 16 / 9;
object-fit: cover;
object-position: center top;
}
#tickets .swiper-slide p {
position: absolute;
top: 50%;
left: 42%;
}
#tickets .swiper-slide p a:hover {
text-decoration: underline;
}
#tickets .swiper-slide ul {
display: flex;
position: absolute;
left: 60%;
bottom: 3%;
}
#tickets .swiper-slide li {
margin-right: 1em;
}
#tickets .swiper-prev,
#tickets .swiper-next {
position: static;
}
#tickets .swiper-wrapper + ul.flex {
display: none;
}

.tb {
font-family: korolev-condensed, "Zen Kaku Gothic New", sans-serif;
background: #FFF;
color: #272727;
font-weight: 500;
margin: 3em auto 0;
border: 3px solid #222;
}
.tb .title th {
text-align: center;
}
.tb .title td {
font-size: 2rem;
}
.tb th {
background: #e9e9e7;
font-size: 2rem;
line-height: 1;
font-weight: 500;
text-align: left;
border-top: solid 1px #222;
padding: 0 15px;
}
.tb td {
font-size: 2.6rem;
line-height: 1;
text-align: center;
padding: 13px 0;
width: 25.5%;
border-top: solid 1px #222;
border-right: solid 1px #222;
}
.tb th.colors {
width: 20px;
padding: 0;
}
.tb th.col1 {background: #004f29;}
.tb th.col2 {background: #f3880d;}
.tb th.col3 {background: #00a1b8;}
.tb th.col4 {background: #68b268;}
.tb th.col5 {background: #86311a;}
.tb th.col6 {background: #710869;}
.tb th.col7 {background: #f7e303;}
.tb th.col8 {background: #eea8ba;}
.tb th.col9 {background: #6e6c1f;}
.tb th.col10 {background: #f28a49;}
.tb th.col11 {background: #df1922;}
.tb th.col12 {background: #003a8e;}
.tb th.col13 {background: #7db115;}
.tb th.col14 {background: #ffc303;}
.tb th.col15 {background: #de307b;}
.tb th.col16 {background: #5b9ed6;}
.tb th.col17 {background: #d19508;}
.tb .yen::after {
content: "円";
font-size: 1.8rem;
display: inline-block;
vertical-align: baseline;
margin-left: 4px;
}
.tb tr:last-child th:nth-child(2) {
padding: 10px 15px;
}
.tb .wc_th {
font-size: 1.4rem;
line-height: 1.4;
margin-top: 5px;
display: block;
}
.attention {
font-weight: 500;
margin: 1em auto 0;
}
.attention li {
text-indent: -1em;
line-height: 1.2;
padding: 0 0 .5em 1em;
}
.attention li::before {
content: '・';
}

/* #access */
#access {
background: url("images/access_bg.png") no-repeat top/100% auto;
}
#access::before {
content: "";
background: url("images/ttl_bg_access.png") no-repeat top left/contain;
width: 100%;
height: 285px;
position: absolute;
top: 0;
left: -1%;
}
#access section {
width: 980px;
padding-top: 8em;
z-index: 1;
}
#access section::before {
content: "";
background: url("images/bg_player_06.png") no-repeat bottom/contain;
width: 315px;
max-width: 30%;
height: 720px;
position: absolute;
top: -10%;
right: -5%;
z-index: -1;
}

.tab-group {
display: flex;
justify-content: center;
margin: 3em auto -8px;

display: none;
}
.tab {
background-size: contain !important;
background-position: bottom !important;
width: 222px;
max-width: 22.2%;
height: 160px;
margin: 0 .3em;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.tab:hover {
cursor: pointer;
}
.tab:nth-child(1) {
background: url("images/tab_01_off.png") no-repeat;
}
.tab:nth-child(2) {
background: url("images/tab_02_off.png") no-repeat;
}
.tab:nth-child(3) {
background: url("images/tab_03_off.png") no-repeat;
}
.tab:nth-child(1):hover,
.tab:nth-child(1).is-active {
background: url("images/tab_01_on.png") no-repeat;
}
.tab:nth-child(2):hover,
.tab:nth-child(2).is-active {
background: url("images/tab_02_on.png") no-repeat;
}
.tab:nth-child(3):hover,
.tab:nth-child(3).is-active {
background: url("images/tab_03_on.png") no-repeat;
}
.panel-group {
background: #FFF;
border: 8px solid #00441B;
border-radius: 20px;

margin-top: 3em;
}
.panel {
display: none;
}
.panel.is-show {
display: block;
}
.panel a {
text-decoration: underline;
}
.panel a:hover {
text-decoration: none;
}
.panel .link a {
background: #00441B;
color: #FFF;
text-decoration: none;
border: 2px solid #00441B;
}
.panel .link a:hover {
background: #FFF;
color: #00441B;
}
.att {
background: red;
color: #FFF;
}
.att.v2 {
background: #F8DE16;
color: red;
}


/* footer
------------------------------------------------------------ */
footer {
padding: 40px 0 100px;
overflow: hidden;
}
footer h1 {
max-width: 50%;
margin: 0 auto;
}
footer li {
margin: 0 .5em;
}
footer ul + p a:hover {
color: #BFA666;
}
footer section::after {
content: "";
background: url("images/bg_player_07.png") no-repeat bottom/contain;
width: 360px;
max-width: 25%;
height: 550px;
position: absolute;
bottom: 0;
right: -5%;
z-index: -1;
}

/* #ticket */
#ticket {
background: #005028;
width: 100%;
height: 80px;
display: flex;
justify-content: center;
align-items: center;
position: fixed;
left: 0;
bottom: 0;
z-index: 3;
}
#ticket time {
font-size: 4.8rem;
vertical-align: middle;
}





@media screen and (max-width: 1024px) {

/* main
------------------------------------------------------------ */
/* #highlight */
#highlight .clouds li:nth-child(5),
#highlight .clouds li:nth-child(6),
#highlight .clouds li:nth-child(7),
#highlight .clouds li:nth-child(8) {
display: none;
}

}


@media screen and (max-width: 834px) {

/* set
------------------------------------------------------------ */
html {
font-size: 55.56%;
}

/* common
------------------------------------------------------------ */
#highlight h2.center img,
#event h2.center img,
#gourmet h2.center img,
#goods h2.center img {
width: auto;
height: 150px;
}

/* Swiper */
.swiper-prev {
left: -3%;
}
.swiper-next {
right: -3%;
}

/* header
------------------------------------------------------------ */
nav ul {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}

/* main
------------------------------------------------------------ */
/* #day */
#day {
padding: 1rem 3rem 3rem;
margin-bottom: -1rem;
}
#day li.txt02 img {
max-width: 230px;
}

/* #highlight */
#highlight section::before {
top: 0;
}
#highlight section::after {
display: none;
}
#highlight .clouds li:nth-child(3),
#highlight .clouds li:nth-child(4) {
max-width: 40%;
}

/* #event */
#event section::before {
width: 130px;
}
#event section::after {
width: 230px;
}
#event li.item {
font-size: 90%;
}
#event .fireworks li:nth-child(1),
#event .fireworks li:nth-child(2),
#event .fireworks li:nth-child(3),
#event .fireworks li:nth-child(4){
display: none;
}
#event .fireworks li:nth-child(5) {
bottom: 3%;
}

/* #gourmet */
#gourmet::before {
top: 1%;
right: 5%;
}

ul.col-5 li {
flex-basis: calc(100% / 3 - 10px);
}

/* #players */
#players .swiper-prev {
left: 0;
}
#players .swiper-next {
right: 0;
}

/* #schedule */
#schedule {
background: url("images/schedule_bg.png") no-repeat center/auto 65%;
}
#schedule::after {
left: -3%;
}
#schedule section {
padding: 3em 0 6em;
}
#schedule ol {
margin-left: auto;
position: static;
}

/* #model */
#model section {
padding: 3em 0;
}
#model .swiper-wrapper {
margin-bottom: 20px;
}
#model .swiper-prev,
#model .swiper-next {
width: 35px;
padding: 10px 0;
}
#model .swiper-prev {
left: 3px;
}
#model .swiper-next {
right: 3px;
}
#model figure {
display: block;
border: 5px solid #BFA666;
border-radius: 20px;
}
#model figure div {
margin: -15% auto 1em;
}
#model figure div img {
border: 5px solid #FFF;
}

/* #tickets */
#tickets section {
padding: 4em 0;
}
#tickets section::after {
left: -3%;
}
#tickets .swiper-slide ul {
display: none;
}
#tickets .swiper-wrapper + ul.flex {
display: flex;
justify-content: center;
margin-top: 3em;
}
#tickets .swiper-wrapper + ul.flex li {
margin-right: 1em;
}

/* #access */
#access {
padding-bottom: 5em;
}

/* footer
------------------------------------------------------------ */
/* #ticket */
#ticket span {
display: none;
}

}


@media screen and (max-width: 430px) {

/* set
------------------------------------------------------------ */
html {
font-size: 50%;
}

/* common
------------------------------------------------------------ */
/* style */
.more a {
font-size: 100%;
padding: .5rem;
}

/* Modaal */
.modaal-content-container {
padding: 10px;
}

.special {
margin: 1em auto 3em;
border: 3px solid #BFA666;
}
.special::before,
.special::after {
width: 10vw;
height: 10vw;
}
.special figure > div img {
aspect-ratio: 5 / 3;
}
.special h3 {
font-size: 3rem;
padding: .3em 3em .3em .5em;
}
.special figcaption {
padding: 1em;
}
.special figcaption dl {
display: block;
}
.special figcaption dl dt {
margin-bottom: .3em;
padding-bottom: .3em;
border-bottom: 1px dotted #00441B;
}
.special .link {
background: #00441B;
position: static;
}
.special .link a {
display: block;
}

/* Swiper */
.swiper-prev {
left: 0;
}
.swiper-next {
right: 0;
}
.swiper-prev img,
.swiper-next img {
width: 30px;
}


/* header
------------------------------------------------------------ */
header {
height: 50px;
}
header h1 {
max-width: calc(100% - 100px);
}
#menu {
right: 50px;
}
.btn {
width: 50px;
height: 50px;
}
nav {
height: calc(100svh - 110px);
}
nav ul {
position: static;
transform: translate(0,0);
}
#share ul {
width: 50px;
}

/* main
------------------------------------------------------------ */
/* #main */
#main {
margin-top: 50px;
}

/* #day */
#day::before {
display: none;
}
#day section.flex {
padding: 0;
}
#day section.flex div:not(:first-child) {
width: 50%;
margin-bottom: 2rem;
display: inline-block;
float: left;
}
#day section.flex div:not(:first-child) img {
aspect-ratio: 5 / 6;
object-fit: cover;
object-position: center bottom;
}

/* #highlight */
#highlight {
padding-bottom: 0;
}
#highlight section {
max-width: 100%;
}
#highlight section::before {
display: none;
}
#highlight p.center {
font-size: 100%;
text-align: left;
}
#highlight p.wht {
color: #00441B;
font-weight: bold;
margin-top: 2rem;
}

.box {
border: none;
outline: none;
border-top: 3px solid #bfa666;
border-bottom: 3px solid #bfa666;
}
.box::before,
.box::after,
.box > div::before,
.box > div::after {
display: none;
}
.box h3 {
margin-bottom: -5px;
}
.box h3 img {
width: auto;
height: 80px;
}
.box .highlight {
border: 2px solid #bba265;
}
.box .highlight p {
font-size: 1.4rem;
padding: .2em .5em;
top: -2px;
right: -2px;
}

/* #event */
#event {
padding-top: 0;
}
#event section::before,
#event section::after {
display: none;
}
#event h2 + div {
max-width: 70%;
margin: 1em auto 0;
}
#event li.item div {
margin: 0 auto -50px;
}
#event .fireworks li:nth-child(5) {
bottom: 0;
}

/* #gourmet */
#gourmet {
padding: 0 0 3rem;
}
#gourmet::before {
display: none;
}
#gourmet .clouds li:nth-child(2),
#gourmet .clouds li:nth-child(3),
#gourmet .clouds li:nth-child(4){
display: none;
}

ul.col-5 {
justify-content: space-between;
}
ul.col-5 li {
flex-basis: 49%;
margin: 0 0 2%;
}

/* #goods */
#goods {
margin-bottom: 3rem;
padding: 3rem 0;
}
#goods::after {
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 95%);
}

/* #schedule */
#schedule {
background: url("images/schedule_bg.png") no-repeat center/auto 80%;
}
#schedule::after {
display: none;
}
#schedule section {
padding: 0 0 6em;
}
#schedule .f42 {
font-size: 3rem;
}
#schedule .f25 {
font-size: 2rem;
}

/* #model */
#model .swiper-wrapper {
margin-bottom: 30px;
}
#model .swiper-pagination-bullet {
width: 18px;
height: 3px;
}
#model .swiper-prev,
#model .swiper-next {
width: 20px;
}
#model .swiper-prev {
left: 0;
}
#model .swiper-next {
right: 0;
}
#model figure {
min-height: 380px;
border-radius: 10px;
}
#model figure div {
margin: -20% auto 1em;
}
#model figcaption {
padding: 0 1em;
}

/* #tickets */
#tickets section::after {
display: none;
}

#tickets .swiper {
margin-top: 2em;
}
#tickets .swiper-slide p {
font-size: 1.6rem;
position: absolute;
top: 40%;
left: 38%;
}

.tb {
display: table;
white-space: normal;
margin: 2em auto 0;
border: 1px solid #222;
}
.tb th {
font-size: 1.8rem;
padding: 0 5px;
}
.tb th.colors {
width: 10px;
}
.tb td {
width: 24%;
}

/* #access */
#access section {
padding-top: 4em;
}
#access section::before {
display: none;
}
#access .p20 {
padding: .5em;
}
#access .p30 {
padding: 1em;
}
#access .f20 {
font-size: 1.6rem;
}
#access .f30 {
font-size: 2rem;
}
#access .f32 {
font-size: 2rem;
}
.tab-group {
margin: 1em auto -4px;
}
.tab {
height: 60px;
}
.panel-group {
border: 4px solid #00441B;
border-radius: 10px;
}
#access .panel-group figure {
margin-bottom: 2em;
}

/* footer
------------------------------------------------------------ */
footer {
padding: 20px 0 80px;
}
footer li img {
width: 40px;
}
footer section::after {
display: none;
}

/* #ticket */
#ticket {
height: 60px;
padding: 1rem;
}
#ticket time {
display: none;
}
#ticket a img {
width: auto;
height: 40px;
}

}