@charset "utf-8";

body{ background: url(../img/247bg_body.png) center center no-repeat #fff fixed; background-size: cover; background-color: #68cef0; background-position: top; font-size: 2.6rem;}

/* スマホbody色変更202508 -////// */
@media screen and (max-width:750px) { body { background:#18b4ca !important; }}

ruby[data-ruby] {
  position:relative;
}
ruby[data-ruby]::before {
  content: attr(data-ruby);
  position:absolute;
  left:-5em;
  top:-0.8em;
  right:-5em;
  text-align:center;
  font-size:0.5em;
}
rt {
  display:none;
}

/* ナビゲーション色変更202508 -////// */
.nav__all { background: #18b4ca;}
.btn_nav{ background:#18b4ca;}
.btn_nav.close .icon_menu:before, .btn_nav.close .icon_menu:after{background: #18b4ca;}

/* イチオシ！ -////// */
#push p{ padding: 0 0 3rem;}
#push {background: #dfe2e5;color: #232323;}
#push .container01{padding: 4rem 0 0; margin-bottom: 4rem;border: 1px solid #00d500;background: #ffffff;border-radius: 4rem;}
#push .container01 img{padding-bottom: 5rem;}
#push .container02{margin-bottom: 5rem;text-align: center;}
#push .container02 .box{background: #00d500;padding: 10rem 5rem 0;}
#push .container02 .box img{padding-bottom: 5rem;}
#push .font_xxl{font-weight: bold;color: #e2ab14;}
#push .font_xl{font-weight: bold;}

/* 公演中＆まもなく初日 -////// */
#stage #stage01 {background: #990002;color: #fff;padding: 0 0 4rem;}
#stage #stage01 .readmore .more_btn{background: linear-gradient(180deg, rgba(153,0, 2, 0), #990002);}
#stage #stage01 .readmore .more_btn .btn__more{ color: #990002;background: #f5ce41;}
#stage #stage01 .box {padding: 3rem 3rem 0;}
#stage #stage01 .Initiatives{background: #b30002;margin-bottom: 5rem;padding: 5rem 0 0 0;}
#stage #stage01 .Initiatives .txt{padding: 3rem;}
#stage #stage01 .Initiatives .txt span{font-weight: bold;}
#stage #stage01 h5{font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; font-weight: 600;color: #f5ce41;font-size: 4rem;text-align: center;}
#stage #stage01 .font_xxl{font-weight: bold;color: #f5ce41;}
#stage #stage01  [class*="button-"]{ background: #f5ce41; color: #990002;}

#stage #stage02 {background: #000000; color: #ffffff;padding: 0 0 4rem;}
#stage #stage02 .readmore .more_btn{background: linear-gradient(180deg, rgba(0,0, 0, 0), #000000);}
#stage #stage02 .readmore .more_btn .btn__more{ color: #fff;background: #e0792a;}
#stage #stage02 .photo{background-image: url("../img/247stage02_bg.jpg");background-size:contain;background-repeat: no-repeat; background-position: center; padding: 15% 3rem;}
#stage #stage02 .font_xxl{font-weight:bold;color: #e0792a;}
#stage #stage02  [class*="button-"]{ background: #e0792a; color: #000000;}

#stage #stage03 {background: #000000; color: #fff;padding: 0 0 4rem;}
#stage #stage03 .readmore .more_btn{background: linear-gradient(180deg, rgba(0,0, 0, 0), #000000);}
#stage #stage03 .readmore .more_btn .btn__more{ color: #fff;background: #8633c6;}
#stage #stage03 .photo{background-image: url("../img/247stage03_bg.jpg");background-size:cover;background-repeat: no-repeat; background-position: top; padding: 26% 3rem 5%;margin-bottom: 4rem;}
#stage #stage03 .container01{padding: 4rem; margin-bottom: 4rem;border: 1px solid #431a63;}
#stage #stage03 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #8633c6;border-bottom: 1px solid #8633c6;margin-bottom: 2rem;}
#stage #stage03 .container01 .btn__{ color: #fff;background: #8633c6;}
#stage #stage03 .font_xxl{font-weight:bold}

#stage #stage04 {background: #f9d14c; color: #000000;padding: 0 0 4rem;}
#stage #stage04 .readmore .more_btn{background: linear-gradient(180deg, rgba(249,209, 76, 0), #f9d14c);}
#stage #stage04 .readmore .more_btn .btn__more{ color: #fff;background: #b52423;}
#stage #stage04 .photo{background-image: url("../img/247stage04_bg.png");background-repeat: repeat;background-size: 20%; padding: 8% 3rem;margin-bottom: 3rem;border-radius: 8rem;color: #ffffff;}
#stage #stage04 .container01{padding: 4rem; margin-bottom: 4rem;color: #353535;background: #f5ba00;border-radius: 3rem;position: relative;}
#stage #stage04 .container01::after{background:url(../img/247stage04_parts.png);content: "";position: absolute;  background-size: 100%; background-repeat: no-repeat; bottom: -10rem; right: 10%; width: 30%;height: 10rem;}
#stage #stage04 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #b52423;}
#stage #stage04 .container01 .btn__{ color: #fff;background: #b52423;}
#stage #stage04 .font_xxl{font-weight: bold;color: #b82220;}
#stage #stage04 .b{font-weight: bold;}
#stage #stage04  [class*="button-"]{ background: #f9d14c; color: #000000;}

#stage #stage05 {background: #040a31; color: #ffffff;padding: 0 0 4rem;}
#stage #stage05 .bg{background-image: url("../img/247stage05_bg1.jpg");background-repeat: repeat-y;background-size: 100%;}
#stage #stage05 .readmore .more_btn{background: linear-gradient(180deg, rgba(4,10, 49, 0), #040a31);}
#stage #stage05 .readmore .more_btn .btn__more{ color: #000913;background: #7aabf5;}
#stage #stage05 .photo{background-image: url("../img/247stage05_bg2.png");background-size:contain;background-repeat: no-repeat; background-position: center; padding: 15% 4rem;margin-bottom: 3rem;}
#stage #stage05 .container01{padding: 4rem;border-top: 0.5px solid #232a57;position: relative;}
#stage #stage05 .container01::before{background:url(../img/247stage05_parts.svg);content: "";position: absolute;  background-size: 100%; background-repeat: no-repeat;background-position: center; top: -8%; left: 45%; width: 10%;height: 15%;}
#stage #stage05 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #7aabf5;}
#stage #stage05 .container01 .btn__{ color: #000913;background: #7aabf5;}
#stage #stage05 .font_xxl{font-weight: bold;}
#stage #stage05  [class*="button-"]{ background: #ffffff; color: #000000;}

#stage #stage06 {background: #bde5f2; color: #0f2563;padding: 0 0 4rem;}
#stage #stage06 .readmore .more_btn{background: linear-gradient(180deg, rgba(189,229, 242, 0), #bde5f2);}
#stage #stage06 .readmore .more_btn .btn__more{ color: #ffffff;background: #0f2563;}
#stage #stage06 .container01{padding: 4rem;border: 1px solid #0f2563;background: #dedbde; margin-bottom: 4rem;box-shadow: 4px 4px #0f2563;}
#stage #stage06 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #0f2563;}
#stage #stage06 .container01 .btn__{ color: #ffffff;background: #0f2563;}
#stage #stage06 .font_xxl{font-weight: bold;}

#stage #stage07 {background: #ff7694; color: #fff;padding: 0 0 4rem;}
#stage #stage07 .readmore .more_btn{background: linear-gradient(180deg, rgba(255,118, 148, 0), #ff7694);}
#stage #stage07 .readmore .more_btn .btn__more{ color: #fff;background: #e11555;}
#stage #stage07 .game{margin-bottom: 4rem;}
#stage #stage07 .game .ttl img{border-radius: 8rem 8rem 0 0;}
#stage #stage07 .game .all{background-image: url("../img/247stage07_bg1.jpg");background-repeat: repeat-y;background-size: 100%;border-radius: 0 0 8rem 8rem;padding: 4rem;color: #1b1b1b;}
#stage #stage07 .game .all .box{margin-bottom: 4rem;}
#stage #stage07 .game .all .box .txt{margin: 3rem;text-align: center;}
#stage #stage07 .comment{background-image: url("../img/247stage07_bg2.jpg");background-repeat: repeat-y;background-size: 100%;border-radius: 8rem;padding: 8rem 4rem;color: #1b1b1b;}
#stage #stage07 .comment .box{background: #f4eeeb;padding: 4rem;}
#stage #stage07 .comment .box .txt{margin-top: 3rem;}
#stage #stage07 .comment .box .txt h5{color: #e11555;padding: 2rem 0;}
#stage #stage07 .container01{padding: 4rem; margin: 5rem 0;background: #f0466b; position: relative;color: #ffffff;border-radius: 3rem 0 3rem 0;}
#stage #stage07 .container01::before{position: absolute;inset: -6px 6px 6px -6px;border-left: 1px solid #f4b564;border-top: 1px solid #f4b564; content: '';border-radius: 3rem 0 0 0;}
#stage #stage07 .container01 h4{ font-size:3.8rem;text-align: center;padding-bottom: 2rem;color: #f4b564;}
#stage #stage07 .container01 .btn__{ color: #fff;background: #f4b564;}
#stage #stage07 .font_xxl{font-weight:bold;}
#stage #stage07 .b{font-weight: bold;}

#stage #stage08 {background: #35b4dc; color: #ffffff;padding: 0 0 4rem;}
#stage #stage08 .readmore .more_btn{background: linear-gradient(180deg, rgba(53,180, 220, 0), #35b4dc);}
#stage #stage08 .readmore .more_btn .btn__more{ color: #35b4dc;background: #ffffff;}
#stage #stage08 .comment{background: #0293c0;border-radius: 50rem;padding: 7rem 6rem 4rem;margin-bottom: 5rem;}
#stage #stage08 .ttl{margin: 4rem 0;}
#stage #stage08 .comment .box{border-bottom: 0.5px solid #35b4dc;margin-bottom: 3rem;}
#stage #stage08 .comment .box:last-child{border: none;}
#stage #stage08 .comment .box img{padding-bottom: 2rem;}
#stage #stage08 .comment .txt{margin: 1rem 0 4rem;}
#stage #stage08 .comment .box .name{text-align: center;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-weight: 600;font-size: 4rem;
;padding: 1rem 0 0;}
#stage #stage08 .container01{padding: 4rem; margin-bottom: 4rem;background: #fff;color: #0f1837;position: relative;}
#stage #stage08 .container01::before{ content: "";position:absolute; left: 0; top: 0; width: 0; height: 0; border-top: 3rem solid #0f1837;border-right: 3rem solid transparent;}
#stage #stage08 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;}
#stage #stage08 .container01 .btn__{ color: #fff;background: #0f1837;}
#stage #stage08 .btn__g{ color: #fff;background: #3ca947;}
#stage #stage08 .font_40{font-weight:bold;}

#stage #stage09 {background: #000000; color: #ffffff;padding: 0 0 4rem;}
#stage #stage09 .readmore .more_btn{background: linear-gradient(180deg, rgba(0,0, 0, 0), #000000);}
#stage #stage09 .readmore .more_btn .btn__more{ color: #000000;background: #f5fe02;}
#stage #stage09 .container02{background-image: url("../img/247stage09_bg.jpg");background-repeat: repeat-y;background-size: 100%;padding: 5rem 0;}
#stage #stage09 .container02 .box{padding: 4rem;}
#stage #stage09 .container02 .q1,#stage #stage09 .container02 .q2{margin-top: 5rem;}
#stage #stage09 .container02 .q1 .ttl,#stage #stage09 .container02 .q2 .ttl{background-color: rgba(103, 0, 0, 0.8);padding: 6rem 4rem 4rem; position: relative;font-weight: bold;}
#stage #stage09 .container02 .q1 .ttl::before{background:url(../img/247stage09_ttl1.png);content: "";position: absolute;  background-size: 100%; background-repeat: no-repeat;background-position: top; top: -15%; left: 0%; width: 100%;height: 35%;}
#stage #stage09 .container02 .q2 .ttl::before{background:url(../img/247stage09_ttl2.png);content: "";position: absolute;  background-size: 100%; background-repeat: no-repeat;background-position: top; top: -15%; left: 0%; width: 100%;height: 70%;}
#stage #stage09 .container02 .q1 .txt,#stage #stage09 .container02 .q2 .txt{padding: 4rem;}
#stage #stage09 .cast1,#stage #stage09 .cast2,#stage #stage09 .cast3{padding: 0 1rem 0.5rem;margin-right: 1rem;}
#stage #stage09 .cast1{background: #ed32b2;}
#stage #stage09 .cast2{background: #55a500;}
#stage #stage09 .cast3{background: #db1515;}
#stage #stage09 .container01{padding: 4rem; margin: 0 4rem 4rem;background-color: rgba(0, 0, 0, 0.7);}
#stage #stage09 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;}
#stage #stage09 .container01 .btn__{ color: #000;background: #f5fe02;}
#stage #stage09 .font_40{font-weight:bold;color: #f5fe02;}

#stage #stage10 {background: #ffd795; color: #000;padding: 0 0 4rem;}
#stage #stage10 .readmore .more_btn{background: linear-gradient(180deg, rgba(255,215, 149, 0), #ffd795);}
#stage #stage10 .readmore .more_btn .btn__more{ color: #eb6b00;background: #ffffff;}
#stage #stage10 .container01{padding: 4rem; margin-bottom: 4rem;background: #fff;border-radius: 3rem;}
#stage #stage10 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #eb6b00;}
#stage #stage10 .container01 .btn__{ color: #fff;background: #eb6b00;}
#stage #stage10 .btn__g{ color: #fff;background: #53c2f0;}
#stage #stage10 .font_xl,#stage #stage10 .font_32{font-weight:bold;color: #eb6b00;}

#stage #stage11{ background: #f0f0f0; color:#000; padding: 0 0 4rem;}
#stage #stage11 .readmore .more_btn{background: linear-gradient(180deg, rgba(240, 240, 240, 0), #f0f0f0);}
#stage #stage11 .readmore .more_btn .btn__more{ background: #dd82ad; color: #fff;}
#stage #stage11 .btn__{background: #fabe00; color: #fff;}
#stage #stage11 .title img{text-align: center; margin-bottom: -3rem;width: 40%;margin-top: 3rem;}
#stage #stage11 .container01{background:#fff;padding: 4rem; border-radius: 4rem;text-align: center;}
#stage #stage11 .container01 a{color: #21b8ce;text-decoration: underline;}
#stage #stage11 .container02{padding: 4rem; margin: 4rem 0;background: #fff;border-radius: 3rem;border: dotted 1px #dd82ad;}
#stage #stage11 .container02 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #dd82ad;}
#stage #stage11 .container02 .btn__{ color: #fff;background: #dd82ad;}
#stage #stage11 .link{color: #710000; text-decoration: underline;font-weight: bold;}
#stage #stage11 .pink{color: #dd82ad; font-weight: bold;}
#stage #stage11  [class*="button-"]{ background: #900e5a; color: #e3a351;}
#stage #stage11 .plr{padding: 0 8rem 4rem;}
#stage #stage11 .b{font-weight: bold;}

#stage #stage12{background: #ececec; color:#000;padding: 0 0 4rem;}
#stage #stage12 .bg{background-image: url("../img/246stage10_bg.png");background-size: 15%;background-repeat: repeat;}
#stage #stage12 .readmore .more_btn{background: linear-gradient(180deg, rgba(236, 236, 236, 0), #ececec);}
#stage #stage12 .readmore .more_btn .btn__more{ background: #fff; color: #e78886;border: 1px solid #e78886;}
#stage #stage12 .container01{padding: 4rem; margin-bottom: 5rem;border: 2px dotted #e78886;background: #ececec; border-radius: 3rem;}
#stage #stage12 .container01 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #e78886;}
#stage #stage12 .container01 .btn__{ color: #fff;background: #e78886; margin-bottom: 1rem}
#stage #stage12 .container02,#stage #stage12 .container03{padding: 4rem; margin-bottom: 5rem;background: #fff; border-radius: 3rem;margin: 5rem 0 8rem;}
#stage #stage12 .container02 .ttl,#stage #stage12 .container03 .ttl{margin-top: -8rem;}
#stage #stage12 .container02 dl{display: flex;}
#stage #stage12 .container02 dt{width: 35%; padding-right: 3rem;}
#stage #stage12 .container02 dd{margin: auto 0;}
#stage #stage12 .b{color: #e78886;font-weight: bold;}
#stage #stage12 .link{text-decoration: underline;color: #000;}

#goods #recommend  .list01 dt img{ width: 80%;}
#goods #recommend .mark{font-weight: bold;background: #fffc00;}

#media #package{ background: #fff; border-radius: 1.5rem; }
#media #package .list02{ position: relative; }
#media #package .list02 a{ color:#000; position: relative; width: 100%; display: block;}
#media #package .list02 a::before{ position: absolute; bottom: -1rem; right:1rem; content:"詳細 \f08e"; color:#00bc80; font-size:2.2rem; font-family: "fontello","Noto Sans JP","Meiryo","Hiragino Kaku Gothic Pro",sans-serif; font-weight: 500;}

#pickup .link{color:#ba41d4;text-decoration: underline;}

#plan{background-color: #baeaf0; background-image: radial-gradient(#eaf9fb 15%, transparent 15%); }
#plan h2{ background: #1bb8ce;}
#plan #archive h3{text-align: center; padding: 1rem !important; font-family: "Quicksand","Noto Sans Japanese","Meiryo","Hiragino Kaku Gothic Pro", sans-serif; letter-spacing:0; font-size: 4.5rem;}
#plan #archive{ background: #fff; border-radius: 1.5rem;padding-bottom: 1rem;}
#plan #archive .frame{ position: relative; padding:4rem; line-height: 1.6; margin: 2rem; border-radius: 1.5rem; color:#000000; background-image: linear-gradient(to right, #d3f1f5, #d1f4ed, #d9f6e1, #e9f5d4, #fef2cc);}
#plan #archive .frame::before, #plan #archive .frame::after{ position:absolute; content: ""; width: 5rem; height: 0.3rem; display: block; background: #21b8ce; transform: rotate(45deg); }
#plan #archive .frame::before{ left:-1.2rem; bottom: 1rem;}
#plan #archive .frame::after{ right:-1.2rem; top: 1rem;}
#plan #archive .container01{padding: 5rem 0 3rem;text-align: center;margin-top: 1rem;}
#plan #archive .container01 h4{font-weight: bold;color: #000000; font-size: 3.4rem;padding: 2.5rem 0;}
#plan #archive .container02{padding: 3rem; margin: 3rem;border: 2px solid #f9be00;border-radius: 3rem;}
#plan #archive .container02 h4{ font-size:4rem;text-align: center;padding-bottom: 2rem;color: #21b8ce;}
#plan #archive .container02 .btn__{ color: #fff;background: #21b8ce;margin-top: 2rem;}
#plan #archive .container02 p{padding-bottom: 2rem;}
#plan #archive .btn__{ background: #1bb8ce; color: #ffffff;}
#plan #archive .b{font-weight: bold;}
#plan #archive [class*="button-"]{ background: #21b8ce; color: #fff;}