html{font-size: 62.5%;}
body{/*display:none;*/position:relative;font-size:2.2rem;font-family: 'Shippori Mincho B1', serif;;font-weight: 400;font-style: normal;}
body::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background: url(../img/background.jpg) center bottom/cover no-repeat;
    -webkit-background-size: cover;
}
.fade{animation: fadeIn 0.5s ease 0.5s 1 normal;}

/*setCss*/
h1{margin:0;}
h2{margin: 0;}
h3{margin: 0;}
p{margin: 0;}
figure{margin: 0;padding: 0;}
img{max-width:100%;}
p{word-break: break-all;text-align: justify;}
ul,dl,ol,dd{margin: 0;padding: 0;}
a{text-decoration:none;color:#000;word-break: break-all;text-align: justify;}
li,dd{list-style-type: none;line-height: 1.6;}
div{box-sizing:border-box;}
::marker{font-family: "ＭＳ ゴシック",sans-serif;}
.pc{display:block;}
.sp{display:none;}
.inner{width: 800px;margin: 0 auto;position:relative;height: inherit;}
.shadow{filter: drop-shadow(0 0 5px rgba(0,0,0,1));}
.shadow2{filter: drop-shadow(0 0 5px rgba(86,49,12,1));}
.txtshadow{text-shadow:0px 0px 5px rgb(255 255 255), 0px 0px 5px rgb(255 255 255), 0px 0px 5px rgb(255 255 255), 0px 0px 5px rgb(255 255 255), 0px 0px 5px rgb(255 255 255), 0px 0px 5px rgb(255 255 255);}

.toindex{position: fixed;bottom:1em;right:1em;width: 10vw;max-width:6em;z-index: 1;min-width: 10rem;cursor: pointer;}
.toindex img:hover{bottom:1.1em;transform: rotateZ( 360deg ) ;transition: .25s ;cursor: pointer;}
.return{    text-align: right; float: right;    font-size: 1.6rem; border-bottom: 1px solid #000; display: inline-block;}

dl.ats{font-size:1.6rem;}
dl.ats dt{}
dl.ats dd{display: inline-block;list-style-type: disc;    display: list-item;margin-left: 1.5em;}

dl.lst{font-size:1.8rem;}
dl.lst dt{font-weight:bold;border-bottom:1px solid #ccc;padding-bottom: 0.5em;margin-bottom: 0.5em;}
dl.lst dd{display: inline-block;list-style-type: disc;    display: list-item;margin-left: 1.5em;}

.del{text-decoration:line-through;}

/*splash*/
#splash {position: fixed;  width: 100%;  height: 100%;  z-index: 999;  background:#fff;  text-align:center;  color:#000;}
#splash_logo {  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}
#splash_logo img {  width:360px;}
.fadeUp{animation-name: fadeUpAnime;animation-duration:0.5s;animation-fill-mode:forwards;opacity: 0;}

.splash.is-active {
  opacity: 0;
  visibility: hidden;
}
.splash_logo.is-active {
  opacity: 1;
  visibility: visible;
}


@keyframes fadeUpAnime{
  from {
  opacity: 0;
  transform: translateY(-50px);
  }
  to {
  opacity: 1;
  transform: translateY(0);
  }
}


/*Sites*/
#contents{min-width:1080px;}
nav{}

section{padding:  0;}
section h2.ttl{font-size:10rem;line-height: 0.7;margin-bottom: 5rem;text-align:center;font-family: 'Tangerine', cursive;font-weight:300;color:#c1ab04;}
section h2.ttl span{font-size:15%;letter-spacing: 0.25em;font-family: "Hiragino Sans W6", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W6", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-weight:bold;color:#000;display:block;}
section h2.ttl img{width:0.5em;}

#main_visual{ display: flex;align-items: center;justify-content: center;}
#main_visual h1{width: 70vw;max-width:1600px;top: 50%;left: 50%; }

nav{width: 100%;background: #0c0159;color:#fff;top:0;position:fixed;z-index: 2;    display: flex;justify-content: center;align-items: center;}
nav a{display: block;    white-space: nowrap;}

nav h2.title{width: 150px;margin-right:1em;}
nav h2.title img{display:block;}
nav h2 a.title:hover{text-decoration:none;}

nav ol { display: flex;align-items: center;justify-content: center;}
nav ol li.guide a{font-size:1.1rem;color:#fff;padding: 1em;    white-space: nowrap;}
nav ol li.twitter{width: 1.5em;line-height: 0;}
nav ol li.twitter img{width: 100%;}
nav ol li.twitter:hover{transform: rotateZ( 360deg ) ;transition: .25s ;}

nav ul{display:flex;margin: 0 auto;justify-content: center;align-items: center;}
nav ul li{}

nav ul li a:hover{background:#c1ab04;}
nav ul li a{color:#fff;text-align:left;display:block;font-size: 1.6rem;position:relative;padding: 1.5em 0.75em;}
nav ul li a.current{position:relative;}
nav ul li a.current:before{left: 0;content:"";position:absolute;bottom:0;height: 5px;width: 100%;background:#c1ab04;animation: fadeDownAnime .1s ease .1s forwards;/*アニメーションの定義名、アニメーション１回分の時間の長さ、アニメーションの進行具合、アニメーションの開始を遅らせる、アニメーションの開始と終了時の状態を指定をまとめて設定*/
    opacity:0;}
@keyframes fadeDownAnime{
        from {
          opacity: 0;
        transform: translatex(-10px);
        }
      
        to {
          opacity: 1;
        transform: translateY(0);
        }
}

#main_visual .fixed{position:fixed;top:0;bottom:auto;z-index: 1;}

section{display:flex;justify-content:center;min-height:100vh;align-items:flex-start;}
section >div{max-width:1080px;display:block;background:rgba(255,255,255,0.8);padding:5vw;line-height:1.8;color:#000;width: 60vw;margin: 1em 0;}

#introduction p{text-align:center;}
#introduction p b{font-size:120%;font-weight:700;}

#outline div h1{text-align:center;line-height:1.4;margin-bottom: 0.5em;}
#outline div table{margin: 0 auto;}
#outline div table th{width: 5em;vertical-align:top;text-align-last: justify;padding: 0.5em;}
#outline div table td{padding: 0.5em;}
#outline div table td span{font-size:70%;display: block;}
#outline div table td .map{font-size:50%;padding: 0.1em 0.75em;background: #0c0159;color:#fff;    display: inline-block; vertical-align: middle;    top: -0.3em;position: relative;margin-left: 1em;}

#cast div table{margin: 0 auto;}
#cast div table th{width: 4em;vertical-align:top;text-align-last: justify;padding: 0.5em;}
#cast div table td{padding: 0.5em;}
#cast div table td a{position:relative;}
#cast div table td a:hover{top:-0.15em;transition: .5s ;}
#cast div table td a img{width: 1.6em;vertical-align: middle;display: inline-block;position: relative;top: -0.15em;}
#cast div #member{}
#cast div #member h5{border-bottom: 1px solid #ccc;margin-bottom: 0.5em;padding-bottom:0.5em}
#cast div #member p{font-size:75%;}

#staff div table{margin: 0 auto;}
#staff div table th{width: 4em;vertical-align:top;text-align-last: justify;padding: 0.5em;}
#staff div table td{padding: 0.5em;}

#ticket{}
#ticket div h3{background: #dcdbd2;padding: 0.25em 0.5em;font-size:2rem;}
#ticket div dl.ticket_menu{display:flex;justify-content: space-between;margin-bottom: 2em;}
#ticket div dl.ticket_menu dd{width: 48%;}
#ticket div dl.ticket_menu dd a{padding: 1em;border: 1px solid #c1ab04;border-radius:5px;display:block;text-align: center;}
#ticket div dl.ticket_menu dd a:hover{background: #c1ab04;color:#fff;}
#ticket div table{margin: 0 auto 1em;width: 100%;font-size:1.8rem;}
#ticket div table th{width: 4.5em;vertical-align:top;padding: 0.5em;text-align-last: justify;}
#ticket div table td{padding: 0.5em;}
#ticket div div.dtl {font-size:1.8rem;}
#ticket div div.dtl b{font-size:125%;font-weight:700;}
#ticket div div.dtl ol{display:flex;margin-top: 1em;}
#ticket div div.dtl ol li{padding: 0.5em;}
#ticket div table th[colspan]{border-bottom: 1px solid #ccc;text-align-last:left;text-align:left;}
#ticket div p{font-size:1.8rem;}
#ticket div small{font-size:70%;line-height: 1.4;display: block;margin-top: 1em;}
#ticket1,#ticket2{width:100%;margin: 0 auto;}
#ticket1{margin-bottom: 2em;}
#ticket2 p{margin-bottom: 1em;}
#ticket2 .tax{font-size:75%;}

#goods{}
#goods div{}
#goods .jg{margin: 2em 0;}
#goods ol{display:flex;flex-wrap:wrap;justify-content: space-between;}
#goods ol li{width: 32.33%;margin-bottom: 1em;}
#goods ol li figure figcaption{font-size:1.4rem;}
#goods ol li figure img{display:block;margin-bottom: 0.25em;width: 100%;}
#goods h3{margin-bottom: 1.5em;;display:inline-block;font-size:1.8rem;background: #0c0159;color:#fff;padding:0.5em 1em ; position: relative;}
#goods h3:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #0c0159;
  z-index: 2;
}
#goods h4{font-size:1.8rem;}
#goods p{font-size:1.8rem;margin-bottom: 1em;}

.novelty{display:flex;background: #f2f2f2;padding: 3%;align-items: center;margin: 2em 0;}
.novelty p{margin: 0!important;}
.novelty div{width: 60%;}
.novelty figure{width:40%;margin-left: 1em;}
.novelty figure img{display: block;;}
.novelty h5{margin:0 0 1em 0;background: #0c0159;color:#c1ab04;font-size:1.6rem;padding: 0.25em 1em;display:inline-block;}

#goods #goods_detail{margin-bottom: 5em;}
#goods #goods_detail figure{width: 100%;}
#goods #goods_detail figure img{width: 100%;}
#goods #goods_detail h1{font-size:2.4rem;}
#goods #goods_detail h2{font-size:1.8rem;}
#goods #goods_detail h5{font-size:1.6rem;font-weight:normal}
#goods #goods_detail small{display: block;font-size:1.3rem;margin-bottom: 2em;}
#goods #goods_detail dl{/*display:flex;width: 101%;left:;position: relative;*/margin-bottom: 2em;}
#goods #goods_detail dl dd{/*width: 19%;margin-right: 1%;*/margin:1% 0.5%}
#goods #goods_detail p{font-size:1.8rem;}
#goods #goods_detail .goods_thumbnail dd:hover{cursor: pointer;}
#goods #goods_detail .goods_thumbnail dd{opacity:0.6;}
#goods #goods_detail .goods_thumbnail dd.slick-current{opacity:1;}
.goods_thumbnail .slick-track {transform:unset!important;}
.slick-next{}
.slick-arrow{z-index: 1;}
.slick-next:before{content:url(../img/next.svg);color:#000;display:block;    width: 110%;margin: 0 0 0 -0.75em;position:relative}
.slick-prev:before{content:url(../img/prev.svg);color:#000;display:block;    width: 110%;margin: 0 0 0 0.6em;position:relative;}

#goods #other_goods:after{width: 19%;content:"";display:block;}
#goods #other_goods li{width:19% ;}
#goods #other_goods li figcaption{font-size:1.2rem;}
#goods a:hover {position:relative;;top:-1px;}



#special{}
#special dl{}
#special dl.spindex dd{display:flex;margin-bottom: 2em;}
#special dl.spindex dd div.fig{width: 30%;position:relative;}
#special dl.spindex dd div.fig1:before{content:"";display:block;background: url(../img/sp1.svg);background-size: 100% auto;width: 4em;height: 4em;position:absolute;left:-2.5em;top:-2.5em;}
#special dl.spindex dd div.fig2:before{content:"";display:block;background: url(../img/sp2.svg);background-size: 100% auto;width: 4em;height: 4em;position:absolute;left:-2.5em;top:-2.5em;}
#special dl.spindex dd div.fig3:before{content:"";display:block;background: url(../img/sp3.svg);background-size: 100% auto;width: 4em;height: 4em;position:absolute;left:-2.5em;top:-2.5em;}
#special dl.spindex dd div.fig4:before{content:"";display:block;background: url(../img/sp4.svg);background-size: 100% auto;width: 4em;height: 4em;position:absolute;left:-2.5em;top:-2.5em;}

#special dl.spindex dd div.txt{width: 70%;padding-left: 1em;}
#special dl.spindex dd div.txt h3{background: none;padding: 0;margin-bottom: 0.5em;font-size:2.4rem;}
#special dl.spindex dd div.txt p{}
#special dl.spindex dd div.txt .btn_area{width: 100%;font-size:1.6rem;}
#special dl.spindex dd div.txt .btn_area a{padding: 1em 0;}

#special div h3{background: #dcdbd2;padding: 0.25em 0.5em;font-size:2rem;}
#special div table{margin: 0 auto 1em;width: 100%;font-size:1.8rem;}
#special div table th{width: 4.5em;vertical-align:top;padding: 0.5em;text-align-last: justify;text-align: left;}
#special div table td{padding: 0.5em;}
#special div table th[colspan]{border-bottom: 1px solid #ccc;text-align-last:left;}
#special div p{font-size:1.8rem;margin-bottom: 1em;}
#special div small{display:block;}
#special div.dtl{display:flex;justify-content: space-between;}
#special div.dtl > figure{width: 35%;}
#special div.dtl > div{width: 62%;}
#special div h2.sub{margin-bottom: 1em;line-height:1.4;text-align:center;}
#special .schedule div{display:flex;justify-content:space-between;}
#special .schedule div figure{width:49%}
.lity-close{text-indent:100%;white-space:nowrap;overflow:hidden;background:url(../img/close.svg) no-repeat;-webkit-background-size: 100% auto;
background-size: 100% auto;    width: 50px; height: 50px;right:1em;top:1em;}
.lity-close:hover, .lity-close:focus, .lity-close:active, .lity-close:visited{text-indent:100%;white-space:nowrap;overflow:hidden;background:url(../img/close.svg) no-repeat;-webkit-background-size: 100% auto;
background-size: 100% auto;    width: 50px; height: 50px;right:1em;top:1em;}

#special #special_detail{margin-bottom: 5em;}
#special #special_detail ul{display:flex;margin-top: 2em;flex-wrap:wrap;}
#special #special_detail ul li{width: 25%;}
#special #special_detail ul li figure img{display:block;}
#special #special_detail ol{display:flex;margin-top: 2em;flex-wrap:wrap;}
#special #special_detail ol li{width: 14.2857142857%;}
#special #special_detail ol li figure img{display:block;}
#special #special_detail dl{margin:3em 0;}
#special #special_detail dl:last-child{margin-bottom: 3em;}
#special #special_detail dt small{margin:0;font-weight:normal;}
#special #special_detail small{margin: 3em 0;font-size:1.6rem;}
#special #special_detail .toreserve img{border-radius:1em;}
#special #special_detail a.alk{text-decoration:underline;color:#2a1f7c;}
#special #special_detail a.alk:hover{text-decoration:none;}
#special #special_detail table.ordertable{margin-top: 0.5em;}
#special #special_detail table.ordertable th{width: 50%;vertical-align: middle;text-align-last: center;}
#special #special_detail table.ordertable td{padding:0;width: 50%;vertical-align: middle;}
#special #special_detail .cos{margin: 2.5%;max-width: 300px;width: 45%;}

#special #special_detail a.btn{background: #0c0159;}
#special #special_detail a.btn{display:block;background: #0c0159;color:#fff;padding: 0.5em 2em;text-align: center;border-radius: 0.5em;margin-bottom: 0.25em;border:3px solid #fff;position:relative;}
#special #special_detail a.btn.sold:before{position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    content: "SOLD OUT";
    left: 0;
    top: 0;
    opacity: 0.9;
    COLOR: #000;
    font-weight: 800;
    display: flex;
    justify-content: center;
    align-items: center;
}
#special #special_detail a.btn.sold:hover{top:0;background: #0c0159;}
#special #special_detail a.btn:hover{background: #2a1f7c;top:-1px;}
#special #special_detail a.btn:after{content: "";
    display: block;
    width: 0.5em;
    height: 0.5em;
    position: absolute;
    right: 2em;
    top: calc(50% - 1px);
    border-top: solid 1px;
    border-right: solid 1px;
    transform: rotate(45deg) translateY(-50%);
    color: inherit;}
#special #special_detail td a.btn{text-align:left;}

#special #other_special{display:flex;flex-wrap:wrap;justify-content: space-between;}

#goods ol li figure img{display:block;margin-bottom: 0.25em;width: 100%;}
#special #other_special:after{width: 19%;content:"";display:block;}
#special #other_special:before{width: 19%;content:"";display:block;order:1;}
#special #other_special li{width:19% ;margin-bottom: 1em;}
#special #other_special li figcaption{font-size:1.2rem;}
#special a:hover {position:relative;;top:-1px;}

#special_detail + h3{margin-bottom: 1.5em;;display:inline-block;font-size:1.8rem;background: #0c0159!important;color:#fff;padding:0.5em 1em ; position: relative;}
#special_detail + h3:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #0c0159;
  z-index: 2;
}
/*sold out*/
.soldout {
  display: block;
  background: #0c0159;
  color: #fff;
  padding: 0.5em 2em;
  text-align: center;
  border-radius: 0.5em;
  margin-bottom: 0.25em;
  border: 3px solid #fff;
  position: relative;
}
.soldout:after {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #fff;
  content: "SOLD OUT";
  left: 0;
  top: 0;
  opacity: 0.9;
  COLOR: #000;
  font-weight: 800;
  display: flex;
  justify-content: center;
  align-items: center;
}
#special a.soldout:hover{top:0;}
/*sold out ここまで*/

#guide div h3{margin-bottom: 2em;}
#guide div h4{}
#guide div p{font-size:1.6rem;}
#guide div dd{font-size:1.6rem;display: inline-block;list-style-type: disc;    display: list-item;margin-left: 1.5em;}

#twitter{}
#twitter .twitter-timeline{margin: 0 auto}

.btn_area{margin: 0 auto;width: 80%;margin-bottom:1em;}
.btn_area a{display:block;background: #0c0159;color:#fff;padding: 0.5em 2em;text-align: center;border-radius: 0.5em;margin-bottom: 0.25em;border:3px solid #fff;position:relative;}
.btn_area a:hover{background: #2a1f7c;top:-1px;}
.btn_area a:after{content: "";
    display: block;
    width: 0.75em;
    height: 0.75em;
    position: absolute;
    right: 2em;
    top: calc(50% - 1px);
    border-top: solid 1px;
    border-right: solid 1px;
    transform: rotate(45deg) translateY(-50%);
    color: inherit;}
.btn_area small{text-align: center;}

/*footer*/
footer{color:;padding: 10rem 1em 5rem;font-size:1.4rem;}
footer .inner{display:flex;width: 1080px;}
footer figure{width: 250px;
filter: drop-shadow(0 0 5px #fff)drop-shadow(0 0 5px #fff)drop-shadow(0 0 5px #fff);}
footer .inner div{margin-left: auto;text-align:right;}
footer .inner div p{text-align:right;}


/*modal*/
#modal06{background: url(../img/c1.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal04{background: url(../img/c2.jpg) no-repeat left bottom; background-size: auto 100%;}
#modal05{background: url(../img/c3.jpg) no-repeat right bottom; background-size: auto 100%;}
#modal01{background: url(../img/c4.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal02{background: url(../img/c5.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal03{background: url(../img/c5.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
.modals{display:flex;justify-content: center;align-items: center;padding: 2em;}
.modals .modal-content{margin: 0 auto;text-align:center;width: 80%;}

.modals .modal-content p{text-align:center;}
.rtp{position:absolute;right:1em;top:1em;}
.cbp{margin-top: 2em;border: 1px solid #000; padding: 0.25em 2em; display: inline-block;font-size: 1.6rem;text-shadow:none;}
.cbp:hover{background: #c1ab04;color:#fff;border:#c1ab04 1px solid;}
.close:hover{cursor: pointer;}
.c_close {display: block;position: relative;width: 5vw;height: 5vw;min-width: 50px;min-height: 50px;}
.c_close::before, .c_close::after {content: ""; position: absolute;top: 50%;left: 50%;width: 1px;height: 5vw;min-height: 50px; background: #333;}
.c_close::before {will-change: transform; transform: translate(-50%,-50%) rotate(45deg);}
.c_close::after {will-change: transform;transform: translate(-50%,-50%) rotate(-45deg);}

/*******************************
 * *************************************************************************************************************/
/********************************************************************************************************************************************/
/*smp*/
/********************************************************************************************************************************************/
/********************************************************************************************************************************************/
@media screen and (max-width: 1080px){
  

  #contents{min-width:100%;}
  section >div{width: 80%;}
  footer .inner{width: 100%;}
  #main_visual h1{width: 95%;}
  .txtshadow{text-shadow:0px 0px 2px rgb(255 255 255), 0px 0px 2px rgb(255 255 255), 0px 0px 2px rgb(255 255 255), 0px 0px 2px rgb(255 255 255), 0px 0px 2px rgb(255 255 255), 0px 0px 2px rgb(255 255 255);}
  .btn_area a:after{will-change: transform;transform: rotate(45deg) translateY(-50%);}
  nav{min-width:auto;}
  nav ul{flex-wrap:wrap;}
  nav ul li{width:100%}
  nav ul li a.current:before{display:none;}

  #nav-toggle {position: fixed;top: 25px;right: 25px;height: 32px;cursor: pointer;z-index: 1}
  #nav-toggle > div {position: relative;width: 36px;}
  #nav-toggle span {will-change: transform;width: 100%;height: 1px;left: 0;display: block;background: #333;position: absolute;transition: top .5s ease, -webkit-transform .6s ease-in-out;transition: transform .6s ease-in-out, top .5s ease;transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;}
  #nav-toggle span:nth-child(1) {top: 0;}
  #nav-toggle span:nth-child(2) {top: 14px;}
  #nav-toggle span:nth-child(3) {top: 28px;}
  #nav-toggle:hover span:nth-child(1) {top: 4px;}
  #nav-toggle:hover span:nth-child(3) {top: 23px;}
  
  #gloval-nav {background: #000;color: #fff;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 990;text-align: center;display: flex;visibility: hidden;flex-direction: column;justify-content: center;align-items: center;font-size: 29px;opacity: 0;transition: opacity .6s ease, visibility .6s ease;}
  .white div span{background: #fff!important;}
  
  #gloval-nav li{opacity:0;}
  .open #gloval-nav {z-index: 11;background: #0c0159;color: #fff;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 10;text-align: center;display: flex;visibility: hidden;flex-direction: column;justify-content: center;align-items: center;opacity: 0;transition: opacity .3s ease, visibility .3s ease;}
  .open #gloval-nav a {font-size:2.5rem;height: auto;display: block;color: #fff;text-decoration: none;padding: 10px 0;transition: color .6s ease;}
  .open #gloval-nav a:hover {color: #666;}
  .open #gloval-nav ul {width: 50vw;position: relative;list-style: none;left:0;margin:auto 0 2em 0;    font-size: 2rem;right:0;top:5vw;}
  .open #gloval-nav ul li {will-change: transform;border:none;margin: 0;opacity:1;transform: translatey(-20px);transition: opacity .2s ease, -webkit-transform .6s ease;transition: transform .6s ease, opacity .2s ease;transition: transform .6s ease, opacity .2s ease, -webkit-transform .6s ease;}
  .open #gloval-nav ul li:nth-child(2) {border:none;}
  .open #gloval-nav ul li:first-child a{height: auto;margin: 0 auto;}
  .open #gloval-nav ul li:nth-child(2) {transition-delay: .05s;}
  .open #gloval-nav ul li:nth-child(3) {transition-delay: .1s;}
  .open #gloval-nav ul li:nth-child(4) {transition-delay: .15s;}
  .open #gloval-nav ul li:nth-child(5) {transition-delay: .20s;}
  .open #gloval-nav ul li:nth-child(6) {transition-delay: .25s;}
  .open #gloval-nav ul li:nth-child(7) {transition-delay: .30s;}
  .open #gloval-nav ol {will-change: transform;transform: translatey(-20px);transition: transform .6s ease, opacity .6s ease, -webkit-transform .6s ease;transition-delay: .30s;width: 50vw;    justify-content: flex-start;   }
  .open #gloval-nav ol li{}
  nav h2.title{width:  50vw;margin-right:0;}
  nav h2.title img{width: 300px;}
  nav ol li.guide a{padding: 1em 1em 1em 0;}
  .open #gloval-nav .twitter img{width: 3rem;filter: invert(1);}
  
  .open #nav-toggle{z-index:11;}
  .open #nav-toggle span {background: #fff;}
  .open #nav-toggle span:nth-child(1) {will-change: transform;top: 15px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
  .open #nav-toggle span:nth-child(2) {top: 15px;width: 0;left: 50%;}
  .open #nav-toggle span:nth-child(3) {will-change: transform;top: 15px;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
  
  /* open */
  .open {overflow: hidden;}
  .open #gloval-nav {visibility: visible;opacity: 1;margin:0;}
  .open #gloval-nav li {will-change: transform;opacity: 1;-webkit-transform: translateX(0); transform: translateX(0);transition: opacity .9s ease, -webkit-transform 0.3s ease;transition: transform 0.3s ease, opacity .9s ease;transition: transform 0.3s ease, opacity .9s ease, -webkit-transform 0.3s ease;}
  .open #gloval-nav li.guide a{font-size: 1.2rem;
  margin-right: 1em;}
  nav ul li a:hover{background: none;}


}
@media screen and (max-width: 768px){
html{font-size: 45%;}

body::before {background: url(../img/backgroundsp.jpg) center bottom/cover no-repeat;    background-size: 100% auto;}
.pc{display:none;}
.sp{display:block;}

.btn_area {width: 100%;}

section >div{width: 92.5%;}
#splash_logo {width: 70%;}
#splash_logo img {  width:100%;}

#main_visual{padding: 0;align-items: flex-start;}
#main_visual h1{margin-top:2.3em;width: 85%;}

#outline div h1{font-size:3.5rem;}

#special div.dtl{display:block;justify-content: space-between;}
#special div.dtl > figure{width: 100%;}
#special div.dtl > div{width: 100%;}

#special dl.spindex dd{display:block;}
#special dl.spindex dd div.fig{width: 100%;}
#special dl.spindex dd div.txt{width: 100%;padding-left: 0;}

.lity-close{    width: 30px; height: 30px; right: 0; top: auto;left: 0; margin: 1em auto;}

#special #other_special li{width: 32%;}

#goods ol li{width: 49%;}
.slick-next:before{content:url(../img/next.svg);color:#000;display:block;    width: 70%;margin: 0 0 0 0.15em;position:relative}
.slick-prev:before{content:url(../img/prev.svg);color:#000;display:block;    width: 70%;margin: 0 0 0 0;position:relative;}
#goods #other_goods li{width: 32%;}

.novelty{display:block;}
.novelty div{width: 100%;}
.novelty figure{width: 100%;margin: 1em 0 0 0;}

#special dl.spindex dd div.fig1::before{    left: -0.25em;top: -0.25em;    width: 5em;height: 5em;}
#special dl.spindex dd div.fig2::before{    left: -0.25em;top: -0.25em;    width: 5em;height: 5em;}
#special dl.spindex dd div.fig3::before{    left: -0.25em;top: -0.25em;    width: 5em;height: 5em;}
#special dl.spindex dd div.fig4::before{    left: -0.25em;top: -0.25em;    width: 5em;height: 5em;}
#special .schedule div{display:block;}
#special .schedule div figure{width:100%}

#special #special_detail table.ordertable td{display: block;width: 100%;}
#special #special_detail a.btn a.soldout{padding: 0.75em 2em 0.75em 1em;}

section{padding: 5rem 0;}
.inner{width: 100%;padding: 5vw;}
#access iframe{width: 100%!important;}
footer .inner{flex-wrap:wrap;}
footer .inner{width: 100%;}
footer figure{width: 50%;margin: 0 auto 1em;}
footer .inner div p{text-align:center;}
footer .inner div{text-align:center;margin-left: 0;width: 100%;}

#modal06{background: url(../img/c1.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal04{background: url(../img/c2.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal05{background: url(../img/c3.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal01{background: url(../img/c4.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal02{background: url(../img/c5.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
#modal03{background: url(../img/c5.jpg) no-repeat calc(50% ) bottom; background-size: auto 100%;}
.modals .modal-content{width: auto;}
}