ZoomIn@charset "utf-8";

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; }
body {font-size:16px; line-height:160%; font-family: "Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif; overflow-x:hidden; }
ul,ol,li,dl,dt,dd{list-style: none;}
fieldset,img { border: 0; vertical-align: middle; overflow: hidden; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { *zoom:1;}
.clear { clear: both; display: block; height: 0; overflow: hidden; }
img{ max-width:100%; box-sizing: border-box;}
a { color:inherit; text-decoration:none; transition:opacity 0.4s; }
a:hover { color:#ffa800; text-decoration:underline dotted;}

.cl_blu{ color:#1a2888;}
.cl_pnk{ color:#e4007f;}
.cl_red{ color:#e8374a;}
.cl_gly{ color:#838d98;}
.cl_wht{ color:#fff;}
.cl_blk{ color:#000;}

.f14{ font-size: 14px; font-size: 0.14rem; line-height:160%;  }
.f16{ font-size: 16px; font-size: 0.16rem; line-height:170%;  }
.f18{ font-size: 18px; font-size: 0.18rem; line-height:170%;  }
.f20{ font-size: 20px; font-size: 0.2rem; line-height:170%;  }
.f24{ font-size: 24px; font-size: 0.24rem; line-height:160%;  }
.f25{ font-size: 25px; font-size: 0.25rem; line-height:180%;  }
.f28{ font-size: 28px; font-size: 0.28rem; line-height:180%;  }

.fws{ font-weight:400;}
.fwb{ font-weight:bold;}
.fsm{ font-size: 80%;}
.fwf{ font-family: 'Noto Sans JP', sans-serif;}
.ffp{ font-feature-settings:"palt";-moz-font-feature-settings:"palt";-webkit-font-feature-settings:"palt";}

.algcen{text-align: center;}

.sp_none{ display: block; }
.pc_none{ display: none; }


.inpv{ text-align: center; width: 800px; max-width: 100%;margin: 0 auto;}
.YoutubeWrapper{position:relative;padding-bottom:56.25%;overflow: hidden; display: inline-block; width: 750px; max-width: 100%;}
.YoutubeWrapper iframe {position:absolute;top:0;left:0;height:100%;width:100% ;}



/******************************index************************************************/
html{ font-size:100px;overflow-x:hidden;}
body{ position:relative;/* background: url(../images/inbg.jpg) center top repeat;  */overflow-x:hidden;}
body::after{content: ""; position: fixed; top: 0;left: 0; width: 100%; height: 100vh; z-index: -1;background-color: #1c2888; /* background-size: 300% 300%;background: linear-gradient(132deg, #ff9000, #e60012, #ff9000); animation: bodyGradient 15s ease infinite; */}

.headmob{background-color: #fff;}
/* .tpbg{ position: absolute; top: 0; left:0; height:0; width: 100%; padding-bottom: 620px; background: url(../images/bg.jpg) center top repeat-x; background-size: auto 100%; z-index:1; pointer-events:none; } */
.header{ text-align: center; width: 1000px; max-width: 100%; margin: 0 auto; position: relative; z-index:10; }
.header img{ width:192%; margin-left: -46%; max-width:1000%; }
.ban_twi{position: absolute; top:20px;top:0.2rem;left:10px;left:0.1rem; width:40px; height:40px; width:0.4rem; height:0.4rem;background:url("../images/icon_sns.png") 0 0 no-repeat; background-size: 1.21rem;}
.ban_fb{position: absolute; top:20px;top:0.2rem;left:65px;left:0.65rem;  width:40px; height:40px; width:0.4rem; height:0.4rem;background:url("../images/icon_sns.png") 50% 0 no-repeat; background-size: 1.21rem;}
.ban_line{position: absolute; top:20px;top:0.2rem;left:120px;left:1.2rem;  width:40px; height:40px; width:0.4rem; height:0.4rem;background:url("../images/icon_sns.png") 100% 0 no-repeat; background-size: 1.21rem;}
.ban_twi:hover{ background-position: 0 bottom; }
.ban_fb:hover{ background-position: center bottom; }
.ban_line:hover{ background-position: right bottom; }


.warp{ position:relative; z-index:10; min-height:100%; background: url("../images/2024/wrap_bgline.jpg") center top repeat-x; background-size: auto 0.95rem; }

.menu{ position: absolute; top: 0; width: 1000px; max-width: 100%; z-index: 50; margin-top: -6.2%; transition:all 0.5s;display: flex;justify-content: center;}
.menu_bg{ position: fixed;top: 0; left: 0; width: 100%; background: url('../images/2024/menu_bg.png') center bottom repeat-x;height: 0; background-size: auto 0.9rem; z-index: 51; pointer-events:none; transition:opacity 0.4s; opacity: 0; }
.menu a{ display:block; width: 16.5%;margin: 0 0.7%; background-size: 100% auto!important; z-index: 55; position: relative;  }
/* .menu a:hover { background: #ff0014; } */


/* .menu .menu_01{ background: url('../images/menu_01.png') 0 0 no-repeat; margin-left: 6%; }
.menu .menu_02{ background: url('../images/menu_02.png') 0 0 no-repeat; }
.menu .menu_03{ background: url('../images/menu_03.png') 0 0 no-repeat; }
.menu .menu_04{ background: url('../images/menu_04.png') 0 0 no-repeat; }
.menu .menu_05{ background: url('../images/menu_05.png') 0 0 no-repeat; } */
.menu a img{ transition: all 0.4s; width: 100%; }
.menu a:hover img{ opacity: 0; }
.menu .menu_01{ background: url("../images/2024/menu_01_on.png") 0 0 no-repeat;}
.menu .menu_02{ background: url("../images/2024/menu_02_on.png") 0 0 no-repeat; }
.menu .menu_03{ background: url("../images/2024/menu_03_on.png") 0 0 no-repeat; }
.menu .menu_04{ background: url("../images/2024/menu_04_on.png") 0 0 no-repeat; }
.menu .menu_05{ background: url("../images/2024/menu_05_on.png") 0 0 no-repeat; }

.nshow .menu{ position: fixed;margin-top:0%;z-index: 60;  }
.nshow .menu_bg{ display: block;height: 0.9rem; opacity: 1}

.ban_smenu{display: none;}




.main{width:1000px; max-width:92%; margin:0 auto; box-sizing: border-box; border:0.05rem solid #e4007f ;background:rgba(255,255,255,1); border-radius:0.2rem;  padding: 0.8rem 0 0 0; margin-bottom: 0.85rem; position: relative; }
.flym{ position: absolute; top: -130px; top: -1.3rem; }
.main .innermob{ padding:0 4%; color: #1a2888; position: relative;}
.innermob .title_h{ text-align: center; padding: 8% 0 4% 0; }
.innermob .title_h img{ max-width: 85%;}

.ban_slmob{ display: inline-block; background: #7cd0ff; line-height: 120%; padding:0.25em 0.4em; color: #fff;border: 2px solid #fff; transition:all 0.2s;  }
.ban_slmob:hover{ text-decoration:none!important; color: #7cd0ff; background: #fff; border: 2px solid #7cd0ff; }


/* news */
.news_in{ margin:0 8.5%; position: relative; border:0.1rem double #e4007f; background: #fff; padding:4% 6% 6% 6%; /* border-radius: 0.1rem; */ }
.newsinlistmob .news_in{margin:0 5%; padding:4% 6% 2.8% 6%;}

.news_in .ban_readmore{ display: block; width: 1rem; height: 1rem; position: absolute; bottom:-0.6rem; left: calc(50% - 0.5rem); background:#fff;}
.news_in .ban_readmore:hover img{ opacity: 0.7; }
.news_in .newslist li{ padding: 0 0 0.4em 1.1em; background:url('../images/ic_y.png?0805') 0 0.45em no-repeat; background-size: 0.9em;  }
.news_in .newslist li a:hover{ color: #e60021;}

.news_inners{ padding-bottom: 5%; position: relative; }
.news_inners a{color:#e60021; font-size: 16px; font-size: 0.16rem;}
.news_inners a:hover{ text-decoration: underline; }
.news_inners .news_innerti{ padding-bottom: 0.6em;color: #e60021;  }
.news_inners .news_time{ font-size: 12px; color: #ce9b5b; display: block; }

.ban_back{ text-align: center;  margin-bottom: 40px; margin-top: 1.2em; }
.ban_back a{ display: inline-block; padding: 0.5em 1.5em; font-size:0.24rem; line-height: 100%; text-decoration: none; background: #006fb7;border:2px solid #fff; border-radius:2000px; font-weight: bold; transition:all 0.1s; color: #fff }
.ban_back a:hover{ background: #fff;border:2px solid #006fb7; color: #006fb7; }

.tx_ind01{text-indent: -1em;padding-left: 1em; display: block;}



/* about */
.tit_ic{ display: inline-block; width:9em; text-align: center;margin-bottom: 0.4em; background:#f4aeab; color: #000;   border-radius: 0.4em;}
.abit{ padding-bottom: 1.2em; }
/* .abit a{ color:#e60021; font-size: 16px; font-size: 0.16rem; } */
.abit a:hover{ text-decoration: underline; }


/* artist */
.art_mob{ text-align: center; font-size: 0; display: flex; flex-wrap:wrap;justify-content: center }
.art_mob .inph{ width:23%; margin:0 1% 2.13% 1%; box-sizing:border-box;}
.art_mob .nopin{ margin:0 0% 2.1% 0;}
.art_mob .lastinf{width:19%;}



/* ticket */
.ticket_inner{  }
.ticket_in{ margin:4% 8.5%; position: relative; border:0.1rem double #e4007f; background: #fff; padding:4% 5.55% 2.8% 6%; font-size: 0.18rem; line-height:160%; }

.twittersinmob{display: flex; justify-content: center;}

.soldout{position: relative;}
.soldout::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; background: rgba(0, 0, 0, 0.3);}
.soldout::after{content: "SOLD OUT!!"; position: absolute; top:calc(50% - 0.5em); left:calc(50% - 2.6em);  z-index: 12; color: #f00; font-weight: bold; font-size: 2.4em; line-height: 100%;transform: rotate(-5deg);transform-origin: center center;}

.soldout02{position: relative;}
.soldout02::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; background: rgba(0, 0, 0, 0.3);}
.soldout02::after{content: "完売御礼"; position: absolute; top:calc(50% - 0.5em); left:calc(50% - 2.6em);  z-index: 12; color: #f00; font-weight: bold; font-size: 2.4em; line-height: 100%;transform: rotate(-5deg);transform-origin: center center;}



.foot{ padding: 4%; }
.banlogo{ display: inline-block; width: 240px; width: 2.4rem; }
.ft_ioc{ font-size: 12px; line-height: 120%; padding: 1% 0; font-weight: bold;}

.banpagetop{position: fixed; bottom: 0; left:calc(50% - 7.25vw); width:105px; max-width:15.5vw; text-align: center; display: none; z-index: 70; }


@media screen and (max-width:1000px){
body{ }
.tpbg{padding-bottom: 62.7%;  }

}

@media screen and (max-width: 750px){
body{ background-size: 0.8rem; }

.sp_none{ display: none; }
.pc_none{ display: block; }

.f25{ font-size: 20px; font-size: 0.2rem; line-height:160%;  }
.tpbg{ display: none; }
.header img{ width:100%; margin-left: 0%; max-width:1000%;}

/* menu */
.menu{ display: none; flex-wrap: wrap;justify-content: center;z-index: 63; position: fixed; top:0; left: 0; width: 100%; margin:10vw 0 0 0;opacity: 0; padding-bottom: 15vw}
.menu a{ width:22.3%;margin: 5.6vw 5.6vw 2.6vw 5.6vw; }
.menu a:hover{filter: drop-shadow(0px 0px 2px #fff);}



.ban_mclose{ position: absolute; bottom: 0; left:45vw; width:10vw;height: 10vw; cursor: pointer; }
.ban_mclose span{ display: block; width: 100%; height: 100%; position: relative; }
.ban_mclose span::before{content: ""; display: block; width: 100%; height:1.5vw; border-radius: 999px; position: absolute; top: calc(50% - 0.75vw); left: 0;background: #fff; transform: rotate(45deg);}
.ban_mclose span::after{content: ""; display: block; width: 100%; height:1.5vw; border-radius: 999px; position: absolute; top: calc(50% - 0.75vw); left: 0;background: #fff; transform: rotate(-45deg);}

.ban_smenu{ position: fixed; top: 2vw; right: 1vw; width: 16vw; z-index: 62;display: block; outline: none;}
.menu_bg{ display: block;  left:auto;right: -3.95vw;top: -7.5vw; width:23.63vw;height:23.63vw; background:#1c2888; border:0.8vw solid #fff; border-radius: 999px; opacity: 1;pointer-events: auto; transition:top 0.4s,width 0.4s,height 0.4s,border-radius 0.1s 0.3s;}
.spmenushow{overflow:hidden;}
.spmenushow .ban_smenu{z-index: 20;}
.spmenushow .menu_bg{right: -5%; top: 0; width: 110%; height:115vw; border-radius: 0 0 100vw 100vw;border:0; transition:top 0.4s,width 0.4s,height 0.4s;}
.spmenushow .menu{ display: flex; animation: showlight 0.4s ease 0.4s both;}
/* menu */

.warp{ background-size: auto 0.24rem; padding-top: 1px; }
.main { margin:-1.5% 4% 8.5% 4%; padding: 5% 0 0 0;width: 92%; /* border-radius: 0.24rem; */}


/* news */
.news_in{ margin:0 5%; }

/* ticket */
.ticket_in{ margin:4% 5%; }

}



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

/* artist */
.art_mob{ }
.art_mob .inph{ width:45%;margin:0 4.13% 4.13% 0; padding: 0;}
.art_mob .inph:nth-child(2n){ margin:0 0% 4.13% 0;}
.art_mob .nopin{ margin:0 0% 4.13% 0;}
.art_mob .lastinf{width:40%;}
/* artist */

.ft_ioc{ font-size: 10px;}

}

@media screen and (max-width: 375px){
.f16{font-size:10px; line-height:160%;  }
.f18{font-size:12px; line-height:155%;  }
.f20{font-size:14px; line-height:155%;  }
.f24{font-size:16px; line-height:155%;  } 
.ft_ioc{ font-size: 8px;}

}



@keyframes bodyGradient {
  0% {
    background-position: 0% 50%;
  } 50% {
      background-position: 100% 50%;
  } 100% {
      background-position: 0% 50%;
  }
}
@keyframes showlight {
  0% {
    display: flex;
    opacity: 0;
  } 100% {
    display: flex;
    opacity: 1;
  }
}