@charset 'utf-8';
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@500;700&display=swap&subset=japanese');
/*
・jp Zen Old Mincho 700(bold) 600(semi-bold)
font-family:'Zen Old Mincho',serif;
*/

/* reset
--------------------------------------- */
body,html,header,footer,article,section,main,figure,menu,nav,
h1,h2,h3,h4,h5,h6,table,thead,tbody,tfoot,th,tr,td,
a,b,i,p,small,big,strong,sub,sup,ruby,span,ul,ol,li,dl,dt,dd,
iframe,embed,object,form,input,textarea,label,output,img,video,audio,
div{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
header,footer,article,section,main,figure,menu,nav{display:block}
body{line-height:1}
ol,ul{list-style:none}
table{border-collapse:collapse;border-spacing:0}
/* modern */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html,body{height:100%}
body{line-height:1.5;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}
#root,#__next{isolation:isolate}
/* basic */
*:focus{outline:none;}
body{
  position:relative;
  text-align:justify;
  word-break:break-all;
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
a{color:inherit;outline:none;text-decoration:none;}
a[href^="tel:"]{color:inherit;pointer-events:none;}
sup{font-size:0.75em;vertical-align:text-top;}
sub{font-size:0.75em;vertical-align:text-bottom;}
img{max-width:100%;height:auto;vertical-align:middle;image-rendering:-webkit-optimize-contrast;}
button{padding:0;background-color:transparent;border:none;outline:none;cursor:pointer;}
@media screen and (max-width:768px){
  h1,h2,h3,h4,h5,h6,p{background:none;}
  a[href^="tel:"]{pointer-events:auto;}
  img{image-rendering:auto;}
}
.pc{display:block;}
.bk1024{display:none;}
.bk980{display:none;}
.sp{display:none;}
.pc-ln{display:inline;}
.sp-ln{display:none;}
.fl{float:left;}
.fr{float:right;}
.hdn{display:inline-block;width:0;height:0;overflow:hidden;}
.overflow-container{overflow-x:scroll;}
.ar{position:relative;width:100%;height:0;overflow:hidden;margin:auto;padding-top:56.25%;}/* ratio 16:9 */
.ar iframe,.ar object,.ar embed{position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;z-index:1;}
@media screen and (max-width:1024px){
  .bk1024{display:block;}
}
@media screen and (max-width:980px){
  .bk980{display:block;}
}
@media screen and (max-width:768px){
  .pc{display:none;}
  .bk1024{display:block;}
  .bk980{display:block;}
  .sp{display:block;}
  .pc-ln{display:none;}
  .sp-ln{display:inline;}
}
.cf:after,.cf:before{content:'';display:block;clear:both}
.cf{display:block}
@media screen and (max-width:768px){
  .sp-cf:after,.sp-cf:before{content:'';display:block;clear:both}
  .sp-cf{display:block;}
}
/* site custom */
body{
  position:relative;
  width:100%;
  font-family:'Zen Old Mincho','游明朝体','YuMincho','游明朝','Yu Mincho','ヒラギノ明朝 ProN W3','Hiragino Mincho ProN W3',HiraMinProN-W3,'ヒラギノ明朝 ProN','Hiragino Mincho ProN','ヒラギノ明朝 Pro','Hiragino Mincho Pro','HGS明朝E','ＭＳ Ｐ明朝','MS PMincho',serif;
  font-weight:500;
  font-size:18px;
  color:#4b493e;
  background-color:#fff;
}
.en{
  font-family:'Cinzel',serif !important;
  font-weight:700 !important;
}
.bold,b,.b{font-weight:700 !important}
.normal,.n{font-weight:500 !important}
#header,#footer,#splash,
#head-navi,#foot-navi,
#pc-head-navi,#sp-head-navi,
.section{
  width:100%;
  min-width:1200px;
  margin:auto;
  overflow:hidden;
}
.wrap{
  position:relative;
  width:1200px;
  margin:auto;
}
.inner{
  position:relative;
  width:1200px;
  margin:auto;
}
@media screen and (max-width:1400px){}
@media screen and (max-width:1280px){
  #header,#footer,#splash,
  #head-navi,#foot-navi,
  #pc-head-navi,#sp-head-navi,
  .section{
    width:100%;
    min-width:initial;
  }
  .wrap{width:100%;}
  .inner{width:1000px;}
}
@media screen and (max-width:1200px){}
@media screen and (max-width:1024px){
  .inner{width:100%;}
}
@media screen and (max-width:768px){
  body{font-size:30.64px;}
  #header,#footer,#splash,
  #head-navi,#foot-navi,
  #pc-head-navi,#sp-head-navi,
  .section,.wrap{
    width:768px;
    min-width:initial;
  }
  .inner{
    width:100%;
    overflow:hidden;
  }
}

/* loading
--------------------------------------- */
.loading{
  display:none;
  position:fixed;
  width:100vw;
  height:100vh;
  height:100dvh;
  top:0px;
  left:0px;
  background-color:rgba(1,173,175,1.0);
    z-index:1000;
  overflow:hidden;
}

html{-ms-overflow-style:none;scrollbar-width:none;}
html::-webkit-scrollbar{display:none;}
.contents{background-color:#fff;}

/* header
--------------------------------------- */
#header{position:relative;}
#header #overlay-button{
  position:fixed;
  right:10px;
  top:10px;
  padding:33px 17.5px;
  background-color:rgba(1,173,175,0.6);
  border-radius:50%;
    z-index:999;
  cursor:pointer;
  user-select:none;
}
#header #overlay-button span{
  height:4px;
  width:35px;
  border-radius:2px;
  background-color:#fff;
  position:relative;
  display:block;
  transition:all 200ms ease-in-out;
}
#header #overlay-button span:before{
  top:-10px;
  visibility:visible;
}
#header #overlay-button span:after{
  top:10px;
}
#header #overlay-button span:before,
#header #overlay-button span:after{
  height:4px;
  width:35px;
  border-radius:2px;
  background-color:#fff;
  position:absolute;
  content:'';
  transition:all 200ms ease-in-out;
}
#header #overlay-button:hover span,
#header #overlay-button:hover span:before,
#header #overlay-button:hover span:after{background:#fff;}
#header input[type=checkbox]{display:none;}
#header input[type=checkbox]:checked ~ #overlay{visibility:visible;}
#header input[type=checkbox]:checked ~ #overlay-button:hover span,
#header input[type=checkbox]:checked ~ #overlay-button span{background:transparent;}
#header input[type=checkbox]:checked ~ #overlay-button span:before{
  transform:rotate(45deg) translate(7px, 7px);
}
#header input[type=checkbox]:checked ~ #overlay-button span:after{
  transform:rotate(-45deg) translate(7px, -7px);
}
#header #overlay{
  position:fixed;
  top:0;
  width:100vw;
  height:100vh;
  height:100dvh;
  background-color:rgba(255,255,255,0.8);
  backdrop-filter:saturate(180%) blur(20px);
    z-index:998;
  overflow:auto;
  visibility:hidden;
}
#header #overlay.active {}
#header #overlay ul.navi{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction:column;
  text-align:center;
  height:100vh;
  height:100dvh;
  padding-left:0;
  list-style-type:none;
}
#header #overlay ul.navi li{padding:1em;}
#header #overlay ul.navi li a{
  color:#01adaf;
  text-decoration:none;
  font-size:1.2em;
  font-weight:700;
  transition:color 200ms,text-shadow 200ms;
}
#header #overlay ul.navi li a:hover{
  color:#fff;
  text-shadow:0 0 5px rgba(1,173,175.1);
}
@media screen and (max-width:768px){
  #header #overlay-button{
    right:10px;
    top:10px;
    padding:48px 32.5px;
  }
  #header #overlay{
    background-color:rgba(255,255,255,0.9);
  }
  #header #overlay ul.navi li a{font-size:1.2em;transition:none;}
  #header #overlay ul.navi li a:hover{
    color:#01adaf;
    text-shadow:0 0 0 rgba(1,173,175.0);
  }
}

/* フッター
--------------------------------------- */
#footer{
  position:relative;
  background-color:#01adaf;
  z-index:1;
}
#footer .wrap{padding:20px 0;}
#footer .copyright{
  font-size:14px;
  line-height:1.5;
  color:#fff;
  text-align:center;
}
@media screen and (max-width:768px){
  #footer .copyright{font-size:21px;}
}

/* ページトップ移動ボタン
--------------------------------------- */
.pagetop-wrap{position:relative;}
#pagetop{
  display:none;
  position:fixed;
  bottom:10px;
  right:10px;
  width:60px;
  opacity:1.0;
  cursor:pointer;
    z-index:997;
}
@media screen and (max-width:768px){}

/* key visual
--------------------------------------- */
#splash{
  position:relative;
  background-color:#fff;
  background-image:linear-gradient(90deg, rgba(255, 255, 255, 1) 10%, rgba(249, 247, 245, 1) 90%);
  overflow:hidden;
    z-index:100;
}
#splash .area-kv .wrap-kv{
  position:relative;
  width:1920px;
  height:1080px;
  margin:auto;
}
#splash .area-kv .logo{
  position:absolute;
  top:358px;
  left:42px;
  width:614px;
  height:304px;
  z-index:1;
}
#splash .area-kv .bg{
  position:absolute;
  top:79px;
  left:759px;
  width:972px;
  height:972px;
  z-index:1;
}
#splash .area-kv .onpu{
  position:absolute;
  top:10px;
  left:925px;
  width:634px;
  height:390px;
  z-index:1;
}
#splash .area-kv .chara1{
  position:absolute;
  top:458px;
  left:1003px;
  width:484px;
  height:574px;
  z-index:2;
}
#splash .area-kv .chara2{
  position:absolute;
  top:415px;
  left:593px;
  width:440px;
  height:616px;
  z-index:1;
}
#splash .area-kv .chara3{
  position:absolute;
  top:353px;
  left:1430px;
  width:440px;
  height:686px;
  z-index:1;
}
#splash .area-kv .copy{
  position:absolute;
  top:1049px;
  left:1319px;
  width:580px;
  height:18px;
  z-index:1;
}
#splash .area-kv .js-anime3{opacity:0;}
@media screen and (max-width:1920px){
  #splash .area-kv .wrap-kv{
    width:100vw;
    height:56.25vw;
  }
  #splash .area-kv .logo{
    top:18.6458vw;
    left:2.1875vw;
    width:31.979vw;
    height:15.833vw;
  }
  #splash .area-kv .bg{
    top:4.114vw;
    left:39.531vw;
    width:50.625vw;
    height:50.625vw;
  }
  #splash .area-kv .onpu{
    top:0.5208vw;
    left:48.177vw;
    width:33.020vw;
    height:20.3125vw;
  }
  #splash .area-kv .chara1{
    top:23.854vw;
    left:52.2395vw;
    width:25.2083vw;
    height:29.8958vw;
  }
  #splash .area-kv .chara2{
    top:21.6145vw;
    left:30.8854vw;
    width:22.9166vw;
    height:32.0833vw;
  }
  #splash .area-kv .chara3{
    top:18.3854vw;
    left:74.4791vw;
    width:22.9166vw;
    height:35.7291vw;
  }
  #splash .area-kv .copy{
    top:54.6354vw;
    left:68.6979vw;
    width:30.2083vw;
    height:9.375vw;
  }
}
@media screen and (max-width:768px){
  #splash{
    background-image:linear-gradient(90deg, rgba(252, 250, 249, 1) 10%, rgba(248, 245, 244, 1) 90%);
  }
  #splash .area-kv .wrap-kv{
    width:100vw;
    height:100vw;
  }
  #splash .area-kv .logo{
    top:1.8229vw;
    left:2.9947vw;
    width:35.8072vw;
    height:17.8385vw;
  }
  #splash .area-kv .bg{
    top:23.828125vw;
    left:13.80208vw;
    width:72.265625vw;
    height:72.265625vw;
  }
  #splash .area-kv .onpu{
    top:18.75vw;
    left:26.1718vw;
    width:47.2656vw;
    height:29.0364vw;
  }
  #splash .area-kv .chara1{
    top:53.3854vw;
    left:34.375vw;
    width:33.7239vw;
    height:40.8854vw;
  }
  #splash .area-kv .chara2{
    top:50.78125vw;
    left:4.4270vw;
    width:31.25vw;
    height:43.8802vw;
  }
  #splash .area-kv .chara3{
    top:46.484375vw;
    left:64.1927vw;
    width:31.3802vw;
    height:48.5677vw;
  }
  #splash .area-kv .copy{
    top:97.0052vw;
    left:23.046875vw;
    width:51.8229vw;
    height:1.8229vw;
  }
}
#splash .area-kv .bg.action{
  animation:180s linear infinite rotation;
}
@keyframes rotation{
  0%{transform:rotate(0);}
  100%{transform:rotate(360deg);}
}
#splash .area-kv .chara1.action{
  animation:5s linear infinite UpDown;
}
@keyframes UpDown{
  0%{transform:translateY(0);}
  50%{transform:translateY(0);}
  55%{transform:translateY(-10px);}
  57%{transform:translateY(0);}
  61%{transform:translateY(-5px);}
  63%{transform:translateY(0);}
  100%{transform:translateY(0);}
}

/*  */
#splash .split-lr,
#splash .split-tb{
  position:absolute;
  top:0;
  width:100%;
  height:100vh;
  height:100dvh;
}
#splash .split-lr{
    z-index:11;
}
#splash .split-tb{
    z-index:9;
}
#splash .split-lr .panel-l,
#splash .split-lr .panel-r,
#splash .split-tb .panel-t,
#splash .split-tb .panel-b{
  content:'';
  position:absolute;
  background-color:rgba(1,173,175,1.0);
}
/* logoA */
#splash .split-lr .panel-l,
#splash .split-lr .panel-r{
  width:50%;
  height:100vh;
  height:100dvh;
}
/* logoB */
#splash .split-lr .panel-l,
#splash .split-lr .panel-r{
  height:100vh;
  height:100dvh;
}
#splash .split-lr .panel-l{
  width:50%;
}
#splash .split-lr .panel-r{
  width:50%;
}

#splash .split-tb .panel-t,
#splash .split-tb .panel-b{
  width:100%;
  height:50vh;
  height:50dvh;
}
#splash .split-lr .panel-l{left:0;}
#splash .split-lr .panel-r{right:0;}
#splash .split-tb .panel-t{top:0;}
#splash .split-tb .panel-b{bottom:0;}
#splash .area-kv .deco{
  position:absolute;
  top:0;
  width:100%;
  height:100vh;
  height:100dvh;
  display:flex;
  justify-content:center;
  align-items:center;
}
#splash .area-kv .deco{
    z-index:10;
}
#splash .area-kv .deco .img{
  height:83.33vh;
  max-height:900px;
}
#splash .area-kv .deco .img img{width:auto;max-height:100%;}
@media screen and (max-width:768px){
  #splash .area-kv .deco .img{
    height:initial;
    max-height:initial;
  }
}

/* リード文 */
#splash .wrap{
  padding:100px 0 70px;
}
#splash .inner{
  width:100%;
}
#splash .info{
  width:96%;
  max-width:728px;
  margin:0 auto 40px;
}
#splash .about{
  color:#01adaf;
  width:96%;
  max-width:728px;
  margin:auto;
}
#splash .about p{
  padding:20px;
  font-size:20px;
  background-color:#fff;
  border:1px solid #01adaf;
  border-radius:5px;
}
@media screen and (max-width:768px){
  #splash .wrap{
    padding:12vw 0 10vw;
  }
  #splash .info{
    width:74%;
    margin-bottom:5vw;
  }
  #splash .about{
    width:84%;
  }
  #splash .about p{
    max-width:initial;
    font-size:32px;
  }
}

/* 共通
--------------------------------------- */
#main{
  position:relative;
  padding-top:0;
}
#main.about-fix{
  padding-top:110vh;
}

.h2{
  margin-bottom:40px;
  font-size:28px;
  font-weight:700;
  color:#01adaf;
  line-height:1.2;
}
.h2 span{}
@media screen and (max-width:768px){
    #main.about-fix{padding-top:0;}
  .h2{font-size:38px;}
}

table.tbl{
  width:100%;
}
table.tbl th,
table.tbl td{
  padding:20px;
  border-bottom:1px solid #d5d2c4;
}
table.tbl tr:last-of-type th,
table.tbl tr:last-of-type td{border-bottom-width:0;}
table.tbl th{
  width:calc(30% - 1px);
  min-width:300px;
  max-width:300px;
  padding-left:10%;
  border-right:1px solid #d5d2c4;
}
table.tbl td{
  width:70%;
}
table.tbl th h2{
  position:relative;
  width:100%;
  margin-left:11vw;
  margin-bottom:0;
  padding:10px 0;
  white-space:nowrap;
  text-align:center;
}
table.tbl p.attention{font-size:14px;}
table.tbl ul.attention{
  font-size:14px;
  padding-left:1.0em;
  text-indent:-1.0em;
}
@media screen and (max-width:768px){
  table.tbl{
    display:block;
    width:100%;
  }
  table.tbl th,
  table.tbl td{
    padding:20px 29px;
    padding-right:29px;
    border-bottom-color:#959284;
  }
  table.tbl th{
    display:block;
    width:768px;
    min-width:768px;
    max-width:768px;
      font-size:34px;
    font-size:32px;
    font-weight:700;
    text-align:center;
    border-right-width:0;
    border-bottom-width:0;
  }
  table.tbl td{
    display:block;
    width:768px;
    padding-top:0;
    font-size:32px;
  }
  table.tbl tr:last-of-type th,
  table.tbl tr:last-of-type td{display:none;}

  table.tbl th h2{
    width:100%;
    margin:0 0 40px;
    padding:40px 0;
  }
  table.tbl th h2:before,
  table.tbl th h2:after{
    content:'';
    position:absolute;
    left:50%;
    height:40px;
    width:1px;
    border-left:1px solid #959284;
  }
  table.tbl th h2:before{
    top:-8px;
  }
  table.tbl th h2:after{
    bottom:-8px;
  }
  table.tbl p.attention,
  table.tbl ul.attention{
    font-size:28px;
  }
}

/* 外部リンク */
a.link-external{
  font-weight:700;
  text-decoration:underline;
  transition:color 300ms;
}
a.link-external:hover{
  color:#01adaf;
}
a.link-external .icon{
  display:inline-block;
  vertical-align:middle;
  color:#01adaf;
  line-height:1;
  width:0.9em;
  height:0.9em;
  margin-top:-0.2em;
  margin-left:0.3em;
  border:0.1em solid currentColor;
  border-radius:0.1em;
  background:rgba(0,0,0,0);
  box-sizing:content-box;
  position:relative;
}
a.link-external .icon > span{
  position:absolute;
  top:-0.2em;
  right:-0.2em;
  width:45%;
  height:45%;
  border:0.1em solid currentColor;
  border-bottom:0;
  border-left:0;
  background:inherit; /*← 背景色に変更 */
  box-shadow:-0.1em 0.1em 0 0.1em inherit; /*← 背景色に変更 */
  box-sizing:border-box;
}
a.link-external .icon > span::before{
  content:'';
  position:absolute;
  top:-0.05em;
  right:-0.1em;
  width:0.1em;
  height:0.9em;
  background:currentColor;
  transform:rotate(45deg);
  transform-origin:top center;
}
@media screen and (max-width:768px){}

/* 開催概要 
--------------------------------------- */
#about{
  position:relative;
  background-color:#f2f0e7;
  min-height:110vh;
  z-index:0;
}

#about.about-fix{
  position:fixed;
  top:0;
}

#about .wrap{
  padding:60px 0 110px;
}
#about h2{background-color:#f2f0e7;}
@media screen and (max-width:768px){
  #about.about-fix{position:relative;}
  #about table.tbl tr:last-of-type td{
    display:block;
    margin-top:20px;
  }
}

/* チケット販売 
--------------------------------------- */
.ticket{
  position:relative;
  background-color:#f2f2f2;
  z-index:1;
}
.ticket .wrap{
  padding:60px 0 20px;
}
.ticket h2{background-color:#f2f2f2;}
.ticket .tokuten .backstage{
  position:relative;
  width:90%;
  margin:30px 0 0px 60px;
  padding:20px;
  border:1px solid #d5d2c4;
  border-radius:5px;
}
.ticket .tokuten .backstage .h4{
  position:absolute;
  top:-0.8em;
  font-size:21px;
  font-weight:700;
}
.ticket .tokuten .backstage .h4 span{
  padding:0 10px;
  background-color:#f2f2f2;
}
@media screen and (max-width:768px){
  .ticket .wrap{
    padding-bottom:0;
  }
  .ticket .tokuten{}
  .ticket .tokuten .wrap-tokuten{
    width:710px;
    margin:auto;
  }
  .ticket .tokuten .backstage{
    width:100%;
    margin:50px 0 40px;
    border-color:#959284;
  }
  .ticket .tokuten .backstage .h4{
    font-size:34px;
  }
  .ticket .tokuten .backstage .h4 span{}
  .ticket .tokuten .backstage ul{text-align:left;}
}
/* チケット先行抽選販売 */
#advance{}
@media screen and (max-width:768px){}

/* チケット一般発売日 */
#ticket{}
#ticket .wrap{padding-bottom:60px;}

/* サウンドトラック
--------------------------------------- */
#soundtrack{
  position:relative;
  background-image:linear-gradient(90deg,#f2f2f2,#f2f2f2 50%,#01adaf 50%);
    z-index:1;
}
#soundtrack .wrap{
  padding:70px 0 210px;
}
#soundtrack .wrapper{
  width:90%;
  margin:auto;
}
#soundtrack .h4{
  font-size:24px;
  font-weight:700;
  text-align:center;
}
#soundtrack .cdjacket{
  position:absolute;
  top:80px;
  left:0;
  right:0;
  width:320px;
  margin:auto;
  z-index:1;
}
#soundtrack .cd-info{
  margin-top:80px;
}
#soundtrack .cd-info dl{
  margin-bottom:40px;
}
#soundtrack .cd-info dl dt{
  font-size:21px;
  font-weight:700;
}
#soundtrack .cd-info dl dd{}
#soundtrack .cd-info .link{
  margin-top:20px;
}
/*  */
#soundtrack .cd-info .link .link-external > span{
  background:#f2f2f2;
  box-shadow:-0.1em 0.1em 0 0.1em #f2f2f2;
}
#soundtrack .tx-split{
  background: linear-gradient(-90deg, #f2f2f2 50%, #4b493e 50%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  text-transform:uppercase;
  white-space:nowrap;
}
@media screen and (max-width:768px){
  #soundtrack{}
  #soundtrack .wrap{
    padding:40px 0 140px;
  }
  #soundtrack .wrapper{
    width:100%;
  }
  #soundtrack .h4{
    font-size:36px;
  }
  #soundtrack .cdjacket{
    position:static;
    width:580px;
    margin:40px auto 40px;
  }
  #soundtrack .cd-info dl{
    width:580px;
    margin:0 auto 40px;
  }
  #soundtrack .cd-info dl dt{
    font-size:34px;
  }
  #soundtrack .cd-info .link{
    width:580px;
    margin:0 auto 40px;
  }
  #soundtrack .cd-info .link a{
    text-decoration:underline;
    transition:none;
  }
  #soundtrack .cd-info .link a:hover{
    color:#01adaf;
  }
}

/* ゲスト 指揮 演奏
--------------------------------------- */
#artist{
  position:relative;
  background-color:#dde5da;
    z-index:1;
}

#artist .wrap{
  padding:40px 0 110px;
}
#artist .h2{
  margin-left:40px;
  margin-bottom:10px;
}
#artist .block{
  display:flex;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:stretch;
  width:100%;
  margin:0 auto 70px;
  border-top:1px solid #d5d2c4;
  border-bottom:1px solid #d5d2c4;
}
#artist .block.no-bottomline{
  margin-bottom:0;
  border-bottom-width:0;
}
#artist .block .h3{
  margin-bottom:8px;
  font-size:21px;
  font-weight:700;
  line-height:1.2;
}
#artist .block .h3 span{
  border-bottom:1px solid #d5d2c4;
    border-bottom-color:#b5b2a4;
}
#artist .block .mi{
  font-size:14px;
}

#artist .block .box-dtl{
  padding:40px;
  border-right:1px solid #d5d2c4;
}
#artist .block .box-dtl a{text-decoration:underline;}
#artist .block .box-pho{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:40px 20px;
}
#artist .block .dtl{
  margin-top:20px;
}
#artist .block-h .box-dtl{width:calc(50vw - 1px);}
#artist .block-h .box-pho{width:50vw;}
#artist .block-v .box-dtl{width:calc(64vw - 1px);}
#artist .block-v .box-pho{width:36vw;}
#artist .block .box-pho .img{
  background-color:#d4dccf;
  border-radius:5px;
}
#artist .block .box-pho .img div{
  padding:40px;
}
#artist .block .link-external > span{
  background:#dde5da;
  box-shadow:-0.1em 0.1em 0 0.1em #dde5da;
}
@media screen and (max-width:768px){
  #artist .h2{
    margin-left:29px;
    margin-bottom:20px;
  }
  #artist .block{
    display:block;
    flex-wrap:normal;
    justify-content:normal;
    align-items:normal;
    border-top-width:0;
    border-bottom-color:#959284;
  }
  #artist .block .h3{
    font-size:36px;
  }
  #artist .block .h3 span{
    border-bottom-color:#959284;
  }
  #artist .block .mi{
    font-size:28px;
  }
  #artist .block .box-dtl{
    padding:0 29px;
    border-right-width:0;
  }
  #artist .block .box-pho{
    padding:40px 29px;
  }
  #artist .block .dtl{
    margin-top:40px;
  }
  #artist .block-h .box-dtl,
  #artist .block-h .box-pho,
  #artist .block-v .box-dtl{width:100%;}
  #artist .block-v .box-pho{width:80%;margin:auto;}
}

/* グッズ
--------------------------------------- */
#goods{
  position:relative;
  background-color:#f2f0e7;
    z-index:1;
}
#goods .wrap{
  padding:70px 0 110px;
}
#goods .wrapper{
  width:90%;
  margin:auto;
}
#goods .h4{
  margin-bottom:40px;
  font-size:24px;
  font-weight:700;
  text-align:center;
}
#goods .box-attention,
#goods .box-attention2{
  width:100%;
  margin:0 auto 60px;
  padding:0 20px;
}
#goods .box-attention ul.info{
  padding-left:1.0em;
  text-indent:-1.0em;
}
#goods .box-attention2 .mi{
  font-weight:700;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#goods .box-attention2 .link a{text-decoration:none;}
#goods .box-attention2 .link a:hover{color:#4b493e;text-decoration:underline;}

#goods .box-attention2 .link a.link-external{font-size:0.94em;}
#goods .box-attention2 .link a.link-external > span{
  background:#f2f0e7;
  box-shadow:-0.1em 0.1em 0 0.1em #f2f0e7;
}
#goods .box-attention2 ul.info{
  font-size:0.88em;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#goods .box-information,
#goods .box-information2{
  position:relative;
  width:100%;
  margin:30px auto 60px;
  padding:20px 19px;
  border:1px solid #d5d2c4;
  border-radius:5px;
}
#goods .box-information .h4inf,
#goods .box-information2 .h4inf{
  position:absolute;
  top:-0.8em;
  left:30px;
  font-size:21px;
  font-weight:700;
  background-color:#f2f0e7;
}
#goods .box-information .h4inf span,
#goods .box-information2 .h4inf span{
  padding:0 10px;
}
#goods .box-information ul.info{
  margin-bottom:1.0em;
}
#goods .box-information ul.info li.sml{
  padding-left:1.0em;
  text-indent:-1.0em;
}
#goods .box-information ul.info li.strong{
  color:#ef4123;
}
#goods .box-information2 .mi{
  margin-bottom:0.2em;
  font-weight:700;
}
#goods .box-information2 ul.info{
  margin-bottom:1.0em;
  padding-left:1.0em;
  text-indent:-1.0em;
}
#goods .box-information2 .payment{
  width:520px;
  margin:auto;
}
#goods .box-information2 .h5pay{
  margin-bottom:5px;
  padding:0.4em;
  font-size:1.07em;
  font-weight:700;
  line-height:1.2;
  color:#fff;
  text-align:center;
  background-color:#f6c011;
}
#goods .caution{
  font-weight:700;
  color:#f00;
  text-decoration:underline;
}

#goods .box-button{margin:0px 0 80px;}
#goods .box-button a{
  display:block;
  width:100%;
  margin:auto;
  padding:20px;
  font-size:21px;
  text-align:center;
  color:#01adaf;
  background-color:#f2f0e7;
  border:1px solid #01adaf;
  border-radius:5px;
  transition:background-color 300ms;
}
#goods .box-button a:before{
  content:'';
  display:inline-block;
  width:14px;
  height:16px;
  margin-right:6px;
  clip-path:polygon(0 0, 100% 50%, 0 100%);
  background-color:#01adaf;
}
#goods .box-button a:hover{
  color:#fff;
  background-color:#01adaf;
}
#goods .box-button a:hover:before{
  background-color:#fff;
}

#goods .box-photo{
  width:100%;
  margin:0 auto 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
}
#goods a.item{
  display:block;
  width:32%;
  margin-bottom:40px;
}
#goods a.item:hover{}
#goods .item .pho{
  background-color:rgba(255,255,255,0.4);
  border-radius:5px;
  padding:30px;
}
#goods a.item .pho img{
  transition:transform 200ms ease-in-out;
}
#goods a.item:hover .pho img{
  transform:scale(1.08);
}
#goods .item .pho > div{overflow:hidden;}
#goods .item .pho .copy{font-size:0.46em;text-align:right;}
#goods .item .dtl{
  padding:10px 10px 0;
  text-align:left;
  line-height:1.3;
}
#goods .item .dtl .t1{font-size:0.88em;}
#goods .item .dtl .t2{}
#goods .item .dtl .t3{margin-left:-0.46em;}
#goods .item .tax{font-size:0.88em;}
@media screen and (max-width:768px){
  #goods{}
  #goods .h4{font-size:36px;}
  #goods .box-attention,
  #goods .box-attention2{padding:0;}
  #goods .box-attention2 .link a{text-decoration:underline;}
  #goods .box-information,
  #goods .box-information2{padding-top:30px;}
  #goods .box-information .h4inf,
  #goods .box-information2 .h4inf{font-size:36px;}
  #goods .box-information2 .payment{width:650px;}

  #goods .box-button a{
    font-size:32px;
    transition:none;
  }
  #goods .box-button a:before{
    transition:none;
  }
  #goods .box-button a:hover{
    color:#01adaf;
    background-color:#f2f0e7;
  }
  #goods .box-button a:hover:before{
    background-color:#01adaf;
  }

  #goods a.item{width:48%;}
  #goods .item .pho{padding:20px;}
  #goods a.item .pho img{transition:none;}
  #goods a.item:hover .pho img{transform:scale(1);}
  #goods .item .dtl .t2{}
  #goods .item .dtl .t3{font-size:0.913em;}
}
/*  */
#goods .box-add{
  /*width:480px;*/
  margin:10px 0;
  padding:10px 20px;
  border:1px solid #d5d2c4;
  border-radius:5px;
}
#goods .box-add .tl{
  margin-bottom:5px;
  font-size:0.93em;
  font-weight:700;
}
#goods .box-add .add{
  margin-bottom:5px;
  font-size:0.88em;
}
@media screen and (max-width:768px){
  #goods .box-add{
    width:100%;
    margin:20px 0;
    padding:20px;
  }
  #goods .box-add .tl{margin-bottom:10px;}
  #goods .box-add .add{margin-bottom:10px;}
}
/* modal overwrite */
.lb-data .lb-caption{font-size:0.88em;}
@media screen and (max-width:768px){
  .lb-data .lb-caption{font-size:0.76em;}
}

/* グッズ詳細ページ
--------------------------------------- */
#item .inner{
  width:768px;
}
/*#item.contents{background-color:#f2f2f2;}*/
#item.contents{background-color:#f2f0e7;}
#item #header{position:static;}
#item #header a.close{
  float:right;
  display:block;
  width:70px;
  height:70px;
  margin:10px 10px 10px auto;
  background-color:rgba(1,173,175,0.6);
  border-radius:50%;
}

#item .title{
  padding:20px;
  background-color:#01adaf;
}
#item .title h2{
  color:#f2f2f2;
  font-size:24px;
}
#item .title h3{
  color:#f2f2f2;
  font-size:21px;
}
#item .detail{
  padding:40px 0 70px;
}
#item .detail .pho{
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  margin:0 auto 40px;
}

#item .detail .pho div{
  display:inline;
  max-width:64%;
  padding:30px;
  background-color:rgba(255,255,255,0.4);
  border-radius:5px;
}
#item .detail .pho.per50 div{
  max-width:50%;
}
#item .detail .price{
  margin-bottom:40px;
  text-align:center;
}
#item .detail .dtl{
  margin-bottom:40px;
}
#item .detail a.back{
  display:block;
  width:160px;
  margin:auto;
  padding:8px;
  font-weight:700;
  color:#f2f2f2;
  text-align:center;
  background-color:rgba(1,173,175,1);
  border-radius:5px;
  transition:color 300ms,background-color 300ms;
}
#item .detail a.back:hover{
  color:#01adaf;
  background-color:#fff;
}
@media screen and (max-width:768px){
  #item .inner{width:90%;}
  #item #header a.close{
    width:96px;
    height:96px;
  }
  #item .title h2{
    font-size:36px;
  }
  #item .title h3{
    font-size:32px;
  }
  #item .detail .pho div{
    max-width:64%;
    padding:20px;
  }
  #item .detail .pho.per50 div{
    max-width:72%;
  }
  #item .detail .dtl{
    margin-bottom:70px;
  }
  #item .detail a.back{
    width:280px;
    transition:none;
  }
  #item .detail a.back:hover{
    color:#f2f2f2;
    background-color:#01adaf;
  }
}

/* アニメ『葬送のフリーレン』とは
--------------------------------------- */
#anime{
  position:relative;
  height:initial;/*js*/
  background-color:#fff;
    z-index:1;
  overflow:visible;
}
#anime .inner{overflow:visible;}
#anime .block-img{
  position:relative;
  width:100%;
  height:300vh;
  margin-left:0;
  transform-origin:0 0;
  z-index:1;
  pointer-events:none;
}
#anime .block-img .img{
  position:-webkit-sticky;
  position:sticky;
  top:0;
}
#anime .block-img .img img{width:100%;}
#anime .block-dtl{
  position:relative;
  width:100%;
  max-width:1200px;

  height:100vh;
  min-height:680px;
  margin:-100vh auto 0;
  margin:-100dvh auto 0;
  z-index:0;
}
#anime .block-dtl .half{
  position:absolute;/*js*/
  top:0;
  width:46%;
  height:100vh;
  height:100dvh;
  margin-left:2%;
}
#anime .block-dtl .wrap-half{}
#anime .block-dtl .dtl{
  margin-bottom:14px;
}
#anime .block-dtl ul.link{
  font-size:16px;
}
#anime .block-dtl ul.link li{
  margin-bottom:0.5em;
}
#anime .block-dtl ul.link .link-external > span{
  background:#fff;
  box-shadow:-0.1em 0.1em 0 0.1em #fff;
}
@media screen and (max-width:1180px){}
@media screen and (max-width:768px){
  #anime{height:initial;}
  #anime .h2{
    text-align:center;
  }
  #anime .block-img{
    width:100%;
    height:100vh;
    height:100dvh;
  }
  #anime .block-img .img{}
  #anime .block-dtl{
    width:100%;
    height:initial;
    min-height:initial;
    max-height:initial;
    margin:0 auto;
    padding:40px 0 110px;
    background-color:#fff;
  }
  #anime .block-dtl .half{
    position:static;
    width:710px;
    height:initial;
    margin:auto;
  }
  #anime .block-dtl .dtl{
    margin-bottom:40px;
  }
  #anime .block-dtl ul.link{
    font-size:28px;
  }
}

/* 汎用
--------------------------------------- */
.disable{display:none;}
.hidden{visibility:hidden;}
/* align */
.pc-fl{float:left}.pc-fr{float:right}
.sp-fl,.sp-fr{display:none}
.left{text-align:left !important}
.right{text-align:right !important}
.center{text-align:center !important}
.top{vertical-align:top !important}
.middle{vertical-align:middle !important}
.bottom{vertical-align:bottom !important}
.img-left{text-align:left}.img-right{text-align:right}
@media screen and (max-width:768px){
  .pc-fl,.pc-fr{display:none}
  .sp-fl{float:left}.sp-fr{float:right}
  .img-left,.img-right{text-align:center}
  .sp-center{text-align:center !important}
  .sp-fnone{float:none !important}
}
.auto{margin-left:auto;margin-right:auto}
/* margin 0-30px step:5px */
.mt0{margin-top:0px !important}.mt5{margin-top:5px !important}.mt10{margin-top:10px !important}.mt15{margin-top:15px !important}.mt20{margin-top:20px !important}.mt25{margin-top:25px !important}.mt30{margin-top:30px !important}
.mb0{margin-bottom:0px !important}.mb5{margin-bottom:5px !important}.mb10{margin-bottom:10px !important}.mb15{margin-bottom:15px !important}.mb20{margin-bottom:20px !important}.mb25{margin-bottom:25px !important}.mb30{margin-bottom:30px !important}
.ml0{margin-left:0px !important}.ml5{margin-left:5px !important}.ml10{margin-left:10px !important}.ml15{margin-left:15px !important}.ml20{margin-left:20px !important}.ml25{margin-left:25px !important}.ml30{margin-left:30px !important}
.mr0{margin-right:0px !important}.mr5{margin-right:5px !important}.mr10{margin-right:10px !important}.mr15{margin-right:15px !important}.mr20{margin-right:20px !important}.mr25{margin-right:25px !important}.mr30{margin-right:30px !important}
/* margin 1.0-2.0em step:0.5em */
.mt10em{margin-top:1.0em !important}.mt15em{margin-top:1.5em !important}.mt20em{margin-top:2.0em !important}
.mb10em{margin-bottom:1.0em !important}.mb15em{margin-bottom:1.5em !important}.mb20em{margin-bottom:2.0em !important}
.ml10em{margin-left:1.0em !important}.ml15em{margin-left:1.5em !important}.mr20em{margin-left:2.0em !important}
.mr10em{margin-right:1.0em !important}.mr15em{margin-right:1.5em !important}.mr20em{margin-right:2.0em !important}
/* padding 0-30px step:5px */
.pt0{padding-top:0px !important}.pt5{padding-top:5px !important}.pt10{padding-top:10px !important}.pt15{padding-top:15px !important}.pt20{padding-top:20px !important}.pt25{padding-top:25px !important}.pt30{padding-top:30px !important}
.pb0{padding-bottom:0px !important}.pb5{padding-bottom:5px !important}.pb10{padding-bottom:10px !important}.pb15{padding-bottom:15px !important}.pb20{padding-bottom:20px !important}.pb25{padding-bottom:25px !important}.pb30{padding-bottom:30px !important}
.pl0{padding-left:0px !important}.pl5{padding-left:5px !important}.pl10{padding-left:10px !important}.pl15{padding-left:15px !important}.pl20{padding-left:20px !important}.pl25{padding-left:25px !important}.pl30{padding-left:30px !important}
.pr0{padding-right:0px !important}.pr5{padding-right:5px !important}.pr10{padding-right:10px !important}.pr15{padding-right:15px !important}.pr20{padding-right:20px !important}.pr25{padding-right:25px !important}.pr30{padding-right:30px !important}
/* font */
.underline{text-decoration:underline}
.nowrap{white-space:nowrap}
.break{word-wrap:break-word;white-space:normal}
.sup{font-size:0.75em;vertical-align:top;position:relative;top:-0.04em}
.sub{font-size:0.75em;vertical-align:baseline;position:relative;bottom:-0.16em}
.mid{font-size:0.75em;vertical-align:top;position:relative;top:0.3em}
/* font-size */
.sml{font-size:0.88em !important}/*16/18*/
.sml2{font-size:0.83em !important}/*15/18*/
.sml3{font-size:0.77em !important}/*14/18*/
.lrg{font-size:1.16em !important}/*21/18*/
.lrg2{font-size:1.33em !important}/*24/18*/
.lrg3{font-size:1.55em !important}/*28/18*/
/* line-height 1.0-1.8 */
.lh10{line-height:1.0 !important}.lh11{line-height:1.1 !important}.lh12{line-height:1.2 !important}.lh13{line-height:1.3 !important}.lh14{line-height:1.4 !important}.lh15{line-height:1.5 !important}.lh16{line-height:1.6 !important}.lh17{line-height:1.7 !important}.lh18{line-height:1.8 !important}
/* indent */
.ind10{padding-left:1.0em;text-indent:-1.0em}
.ind20{padding-left:2.0em;text-indent:-2.0em}
.ml1ch{margin-left:0.62em}.ind1ch{padding-left:0.62em;text-indent:-0.62em}/***/
.ml3ch{margin-left:1.52em}.ind3ch{padding-left:1.52em;text-indent:-1.52em}/*(n)*/
.ml3ch2{margin-left:2.58em}.ind3ch2{padding-left:2.58em;text-indent:-2.58em}/*（n）*/
/* width */
.wTri{width:33.3%}.wQuart{width:24.9%}.wHalf{width:49.9%}.wWide{width:66.5%}.wFull{width:99.8%}
.w1{width:1%}.w2{width:2%}.w3{width:3%}.w4{width:4%}.w5{width:5%}.w6{width:6%}.w7{width:7%}.w8{width:8%}.w9{width:9%}.w10{width:10%}
.w11{width:11%}.w12{width:12%}.w13{width:13%}.w14{width:14%}.w15{width:15%}.w16{width:16%}.w17{width:17%}.w18{width:18%}.w19{width:19%}.w20{width:20%}
.w21{width:21%}.w22{width:22%}.w23{width:23%}.w24{width:24%}.w25{width:25%}.w26{width:26%}.w27{width:27%}.w28{width:28%}.w29{width:29%}.w30{width:30%}
.w31{width:31%}.w32{width:32%}.w33{width:33%}.w34{width:34%}.w35{width:35%}.w36{width:36%}.w37{width:37%}.w38{width:38%}.w39{width:39%}.w40{width:40%}
.w41{width:41%}.w42{width:42%}.w43{width:43%}.w44{width:44%}.w45{width:45%}.w46{width:46%}.w47{width:47%}.w48{width:48%}.w49{width:49%}.w50{width:50%}
.w51{width:51%}.w52{width:52%}.w53{width:53%}.w54{width:54%}.w55{width:55%}.w56{width:56%}.w57{width:57%}.w58{width:58%}.w59{width:59%}.w60{width:60%}
.w61{width:61%}.w62{width:62%}.w63{width:63%}.w64{width:64%}.w65{width:65%}.w66{width:66%}.w67{width:67%}.w68{width:68%}.w69{width:69%}.w70{width:70%}
.w71{width:71%}.w72{width:72%}.w73{width:73%}.w74{width:74%}.w75{width:75%}.w76{width:76%}.w77{width:77%}.w78{width:78%}.w79{width:79%}.w80{width:80%}
.w81{width:81%}.w82{width:82%}.w83{width:83%}.w84{width:84%}.w85{width:85%}.w86{width:86%}.w87{width:87%}.w88{width:88%}.w89{width:89%}.w90{width:90%}
.w91{width:91%}.w92{width:92%}.w93{width:93%}.w94{width:94%}.w95{width:95%}.w96{width:96%}.w97{width:97%}.w98{width:98%}.w99{width:99%}.w100{width:100%}
/* basic color */
.wt{color:#ffffff !important}.bg-wt{background-color:rgba(255,255,255,1.0)}/*white*/
.bk{color:#000000 !important}.bg-bk{background-color:rgba(000,000,000,1.0)}/*black*/
.gy{color:#efefef !important}.bg-gy{background-color:rgba(239,239,239,1.0)}/*gray*/
.rd{color:#f00000 !important}.bg-rd{background-color:rgba(240,000,000,1.0)}/*red*/
.bl{color:#0000f0 !important}.bg-bl{background-color:rgba(000,000,240,1.0)}/*blue*/
/* site color */
.black{color:#4b493e !important} /*text*/
.bg-black{background-color:#4b493e}
.green{color:#01adaf !important} /*title*/
.bg-green{background-color:#01adaf}
.gold{color:#d3c175 !important} /*accent*/
.bg-gold{background-color:#d3c175}
.gray{color:#d5d2c4  !important}/*background1*/
.bg-gray{background-color:#d5d2c4}
.sand{color:#f2f0e7 !important}/*background2*/
.bg-sand{background-color:#f2f0e7}
.red{color:#ef4123 !important} /*emphasis*/
.bg-red{background-color:#ef4123}

/* effect
--------------------------------------- */
.fadeIn2up,
.fadeIn2down,
.fadeIn2right,
.fadeIn2left{
  opacity:0;
    -webkit-transition:all 800ms;
       -moz-transition:all 800ms;
        -ms-transition:all 800ms;
         -o-transition:all 800ms;
            transition:all 800ms;
  -webkit-transition-delay:100ms;
     -moz-transition-delay:100ms;
      -ms-transition-delay:100ms;
       -o-transition-delay:100ms;
          transition-delay:100ms;
}
.fadeIn{
  opacity:0;
}
.fadeIn2up{
  -webkit-transform:translateY(50px);
      -ms-transform:translateY(50px);
          transform:translateY(50px);
}
.fadeIn2down{
  -webkit-transform:translateY(-50px);
      -ms-transform:translateY(-50px);
          transform:translateY(-50px);
}
.fadeIn2right{
  -webkit-transform:translateX(-80px);
      -ms-transform:translateX(-80px);
          transform:translateX(-80px);
}
.fadeIn2left{
  -webkit-transform:translateX(80px);
      -ms-transform:translateX(80px);
          transform:translateX(80px);
}
.fadeIn.show{opacity:1;}
.fadeIn2up.show,
.fadeIn2down.show{
  opacity:1;
  -webkit-transform:translateY(0);
      -ms-transform:translateY(0);
          transform:translateY(0);
}
.fadeIn2right.show,
.fadeIn2left.show{
  opacity:1;
  -webkit-transform:translateX(0);
      -ms-transform:translateX(0);
          transform:translateX(0);
}
.delay1{/*def.*/}
.delay2{
  -webkit-transition-delay:300ms;
     -moz-transition-delay:300ms;
      -ms-transition-delay:300ms;
       -o-transition-delay:300ms;
          transition-delay:300ms;
}
.delay3{
  -webkit-transition-delay:500ms;
     -moz-transition-delay:500ms;
      -ms-transition-delay:500ms;
       -o-transition-delay:500ms;
          transition-delay:500ms;
}