@charset "utf-8";
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

 ■■■  ■                    ■                   
■     ■                    ■                   
■    ■■■■ ■ ■ ■   ■   ■■■ ■■■■ ■   ■  ■ ■  ■■■ 
 ■■   ■   ■■  ■   ■  ■■ ■  ■   ■   ■  ■■  ■  ■ 
  ■■■ ■   ■   ■   ■  ■     ■   ■   ■  ■   ■   ■
    ■ ■   ■   ■   ■  ■     ■   ■   ■  ■   ■■■■■
■   ■ ■   ■   ■  ■■  ■■    ■   ■  ■■  ■   ■    
■■■■  ■■  ■    ■■ ■   ■■■  ■■   ■■ ■  ■    ■■■ 

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #fff; background:#000 url("../images/common/background.png") repeat-y center top; background-size: 100%; }

header,article,section,footer{ position: relative; width: 100%; display: block; }
.lo-part,.lo-cont{ position: relative; width: 100%; display: block; }

.part-background{ position: absolute; width: 100%; min-height:100%; overflow: hidden; }
.part-foreground{ position: absolute; width: 100%; min-height:100%; overflow: hidden; z-index: 999; pointer-events: none; }
.part-header{ position: relative; z-index: 500; }
.part-body{ position: relative; }
.part-footer{ position: relative; }

/* background */
#Background  > div{ width: 100%; min-height: 100%; position: absolute; top:0; }
/* foreground */
#Foreground  > div{ width: 100%; min-height: 100%; position: absolute; top:0; }

#Foreground .op-container{ display: none; }
#Foreground .op-bg{ display: none; }

/* #Foreground .op-bg{ width: 100%; height: 100%; min-height: 100%; background-color: #000;  }
#Foreground .op-container{ width: 100%; height: 100%; margin: 0 auto; position: fixed; top:0; left:0; right:0; }
#Foreground .op-container > div{ width: calc(1200/3000*100vw); height: calc(1200/3000*100vw); margin: 0 auto; position: fixed; top:calc(50vh - (1200/3000*100vw*0.5)); left:0; right:0; }
#Foreground .op-container > div{ position: absolute; opacity: 0; }
#Foreground .op-container .loading{ opacity: 1; }
.s1 #Foreground .op-container .loading{ display: none; }
.s1 #Foreground .op-container .c1{ animation: anm-op-fig 3.5s 0s linear both running; }
.s1 #Foreground .op-container .c2{ animation: anm-op-fig 2.5s .5s ease-in-out both running; }
.s1 #Foreground .op-container .f1{ animation: anm-op-fig1 3s 1.0s linear both running; }
.s1 #Foreground .op-container .f2{ animation: anm-op-fig2 3s 1.0s linear both running; }
.s1 #Foreground .op-container .f3{ animation: anm-op-fig3 3s 1.0s linear both running; }
.s1 #Foreground .op-container .f5{ animation: anm-op-fig5 3s 1.0s linear both running; }

.s1 #Foreground .op-container .f4{ animation: anm-op-fig4 3.5s .5s ease-in-out both running; }
.s1 #Foreground .op-container .f6{ animation: anm-op-fig6 3.5s .5s ease-in-out both running; }
.s1 #Foreground .op-container .f7{ animation: anm-op-fig7 3.5s .5s ease-in-out both running; }
.s1 #Foreground .op-container .f8{ animation: anm-op-fig8 3.5s .5s ease-in-out both running; }
.s1 #Foreground .op-container .f9{ animation: anm-op-fig9 3.5s .5s ease-in-out both running; }

.s1 #Foreground .op-container .c3{ animation: anm-op-fig 3s 3.5s ease-in-out both running; }
.s2 #Foreground .op-container{ display: none; }
.s2 #Foreground .op-bg{ opacity: 0;transition: all 1.0s ease 0s; }

@keyframes anm-op-fig1 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(35%,45%);}
90% { opacity: 1; transform: scale(.8) translate(35%,75%);}
100% { opacity: 0; transform: scale(1.0) translate(35%,75%);}
}
@keyframes anm-op-fig2 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(-35%,45%);}
90% { opacity: 1; transform: scale(.8) translate(-35%,75%);}
100% { opacity: 0; transform: scale(1.0) translate(-35%,75%);}
}
@keyframes anm-op-fig3 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(95%,30%);}
90% { opacity: 1; transform: scale(.8) translate(100%,50%);}
100% { opacity: 0; transform: scale(1.0) translate(100%,50%);}
}
@keyframes anm-op-fig5 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(-95%,30%);}
90% { opacity: 1; transform: scale(.8) translate(-100%,50%);}
100% { opacity: 0; transform: scale(1.0) translate(-100%,50%);}
}

@keyframes anm-op-fig9 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(0,-55%);}
90% { opacity: 1; transform: scale(.8) translate(0,-80%);}
100% { opacity: 0; transform: scale(1.0) translate(0,-80%);}
}
@keyframes anm-op-fig7 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(65%,-45%);}
90% { opacity: 1; transform: scale(.8) translate(65%,-75%);}
100% { opacity: 0; transform: scale(1.0) translate(65%,-75%);}
}
@keyframes anm-op-fig6 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(-55%,-45%);}
90% { opacity: 1; transform: scale(.8) translate(-55%,-75%);}
100% { opacity: 0; transform: scale(1.0) translate(-55%,-75%);}
}
@keyframes anm-op-fig4 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(-105%,-30%);}
90% { opacity: 1; transform: scale(.8) translate(-110%,-50%);}
100% { opacity: 0; transform: scale(1.0) translate(-110%,-50%);}
}
@keyframes anm-op-fig8 {
0% { opacity: 0; transform: scale(.5) translate(0,0);}
5% { opacity: 1; transform: scale(.6) translate(115%,-30%);}
90% { opacity: 1; transform: scale(.8) translate(120%,-50%);}
100% { opacity: 0; transform: scale(1.0) translate(120%,-50%);}
}

@keyframes anm-op-fig {
0% { opacity: 0; transform: scale(.8);}
20% { opacity: 1; transform: scale(1);}
80% { opacity: 1; transform: scale(1.1);}
100% { opacity: 0; transform: scale(1.3);}
}
@keyframes anm-op-copy {
0% { opacity: 0; transform: translateY(5%);}
30% { opacity: 1; transform: translateY(0);}
70% { opacity: 1; transform: translateY(0);}
100% { opacity: 0; transform: translateY(-10%);}
} */


/* header */
.part-header{ display: none; }
.cont-sp-btn{ display: none; }

.cont-global-logo{ width: calc(554/3000*100vw); padding: 2em 0; margin:0 auto; pointer-events: all; }
.cont-global-navi{ width: calc(554/3000*100vw); padding: 0;  margin:0 auto 2em auto; }
.global-navi{ width: 100%; margin: 0 auto ; position: relative; }
.global-navi > ul{ display: block; list-style-type: none; padding: 0; margin: 0; position: relative; }
.global-navi > ul > li{ display: block; padding: 0 ; margin: 0 0 .2em 0; line-height: 1; position: relative;}
.global-navi > ul > li.gn9{ display: none; }
.global-navi > ul > li a{ display: block; position: relative; transform-origin: center left; pointer-events: all; }
.global-navi > ul > li a:hover{ text-decoration: none; transform: scale(1.05,1.05); }
.global-navi > ul > li a > span{ }

.cont-season-btn{ width: calc(554/3000*100vw); padding: 0; margin: 0 auto 2em auto; position: relative; }
.cont-season-btn > ul{ display: block; list-style-type: none; padding: 0; margin: 0; position: relative; }
.cont-season-btn > ul > li{ width: calc(550/3000*100vw); display: block; padding: 0 ; margin: 0; line-height: 1; position: relative;}
.cont-season-btn > ul > li a{ display: block; position: relative; transform-origin: center left; pointer-events: all; }
.cont-season-btn > ul > li a:hover{ text-decoration: none; transform: scale(1.05,1.05); }
.cont-season-btn > ul > li a > span{ }

.cont-side-news-pc{ padding: 2em 0; margin: 0 auto ; position: relative; background: url("../images/side-news-bg-pc.png") no-repeat left top; background-size: cover; }
.cont-side-news-pc > .inner{ width: calc(554/3000*100vw); padding: 0; margin: 0 auto; position: relative; }
.side-newstitle-pc{ font-size: 1em; margin-bottom: 1em; width: calc(174/3000*100vw); }

.cont-side-banner-pc{ padding: 2em 0; margin: 0 auto ; position: relative; background: url("../images/side-banner-bg-pc.png") no-repeat left top; background-size: cover; }
.rel-banner{ width: calc(554/3000*100vw); padding: 0; margin: 0 auto; position: relative; }
.rel-banner > ul{ display: block; list-style-type: none; padding: 0; margin: 0 auto; position: relative; }
.rel-banner > ul > li{ width: calc(500/3000*100vw); display: block; padding: 0 ; margin: 0 0 1.2em 0; line-height: 1; position: relative;}
.rel-banner > ul > li:last-child{ margin-bottom: 0; }
.rel-banner > ul > li a{ display: block; position: relative; transform-origin: center left; pointer-events: all; }
.rel-banner > ul > li a:hover{ text-decoration: none; transform: scale(1.05,1.05); }
.rel-banner > ul > li a > span{ }



/* body */
.part-body{ position: relative; display: flex; flex-wrap: nowrap; align-items: flex-start; margin: 0; }
.sub-page .part-body{  }
.part-body-side{ position: sticky; width: calc(728/3000*100vw); top:0; }
.part-body-main{ position: relative; width: calc(2272/3000*100vw); }
.cont-upper{ position: relative; }
.cont-middle{ position: relative; }
.cont-bottom{ position: relative; }

.cont-top-content{  }
.cont-top-content > .inner{ padding: 0; }
.cont-sub-content > .inner{ padding: 0; }

.top-conttitle{ font-size: 1em; margin-bottom: 1em; }
.top-conttitle > div{ width: calc(666/3000*100vw); margin: 0 auto; overflow: hidden;  }

.sub-pagetitle{ font-size: 1em; margin-bottom: 1em; }
.sub-pagetitle > div{ width: calc(666/3000*100vw); margin: 0 auto; overflow: hidden; border-radius: 2em; border: #FFF solid .2em; }

.sub-conttitle{ font-size: 1em; margin-bottom: 1em; }
.sub-conttitle > div{ width: calc(666/3000*100vw); margin: 0 auto; overflow: hidden;  }


/* footer */
.part-footer{ display: none; }
.cont-global-footer{ margin: 0 auto; padding: 2em 0 0 0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 120/30 * 1em ); height: calc( 120/30 * 1em ); position: fixed;  bottom:1.5em;  right:1em; z-index: 10; overflow: hidden; }
.footer-pagetop a{ display: block; position: relative; width: 100%; min-height: 100%; background:url(../images/common/pagetop.png) no-repeat center center; background-size: contain; }
.footer-pagetop{ opacity: 0;}
.footer-pagetop.start{ animation: anm-pagetop-btn .5s 0s ease-out both running;}
@-webkit-keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
@keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
.anm-pagetop-btn { -webkit-animation-name: anm-pagetop-btn; animation-name: anm-pagetop-btn;}
.cont-footer{ padding: 2em 0; }
.footer-copyrihgt p{ color: #FFF; font-size: .8em; margin-bottom: 0; }

/* content */
.inview{ animation:inview 0.4s .2s ease-out both paused; }
.inview-start{ animation:inview-start 0.4s .2s ease-out both running; }
.inview-act{ transform-origin: left top; transition: all .5s ease .1s;  }

.table-a{ border-collapse: separate; border-spacing: 2px;}
.table-a th{ padding:0.5em; background-color:rgba(255,255,255,.1); font-weight: normal; text-align: inherit; vertical-align: top; text-align: left; }
.table-a td{ padding:0.5em; background-color:rgba(255,255,255,.05); vertical-align: top; }

.sdw-1{ filter: drop-shadow(0 0 .5em rgba(0,0,0,1)); }
.sdw-2{ filter: drop-shadow(0 0 .5em #ff0058); }
.sdw-3{ text-shadow:-1px 0px 0px #000,1px 0px 0px #000; filter: drop-shadow(0 0 .5em #fb00ff); }

/* 1 */
.cont-entries{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-entry{ padding: 3em 3em; background-color: transparent; border-radius: 2em 2em 0 2em; box-sizing: border-box; margin-bottom: 3em; border: #fff solid .2em; }
.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-head{ color: #fcf95f; margin-bottom: 1.9em; padding-left: 1em; position: relative; }
.content-entry .entry-head:before{ content:""; width: .4em; min-height: 100%; background-color: #fcf95f; border-radius: .2em; position: absolute; top:0; left:0; }
.content-entry .entry-date{ font-size: 1em; line-height: 1; display: inline-block; position: relative; margin-bottom: .2em; }
.content-entry .entry-date > span{ font-weight: bold; }
.content-entry .entry-title{ font-size: 1.733em; margin-bottom: 0; }
.content-entry .entry-title > span{ font-weight: normal; line-height: 1.5; }

.content-entry .entry-body{ font-size: 1.1em; line-height: 1.5; }

.cont-singles{ padding: 2em; margin: 0 auto; }
.content-single{  }

.cont-tiles{ display: flex; flex-wrap: wrap; justify-content: center;  }

.modal-data{ display: none; }
.cont-modal{ width: 100%; max-width: 960px; margin: 0 auto; }
.frame-modal{  background-color: rgba(0,0,0,.5); filter: drop-shadow(0 0 .5vw rgba(0,0,0,1)); padding: 3em; line-height: 1.5; }

.slctcont-wrap { position: relative;}
.slctcont-btn { position: relative; cursor: pointer; }
.slctcont-container { position: relative; display: none;}
.slctcont-radio { display: none; }
/* .slctcont-radio:checked + .slctcont-btn { pointer-events: none; opacity: .5; }
.slctcont-radio:checked ~ .slctcont-container { display: block; } 個別に指定 */

/* colorbox customize */
#colorbox{}
#cboxOverlay{ background:rgba(0,0,0,.7) ; }
#cboxTitle{ visibility: hidden; }
#cboxContent{/*  margin:3.61em 2.22em 0 2.22em; */ background:rgba(255,255,255,0); position: relative;}
#cboxLoadedContent{ padding:3.61em 2.22em 0 2.22em; border:none; background:rgba(255,255,255,0); }

#cboxClose{top: 0 /* -3.61em */ ; right: 0 /* 0.27em */ ; display:block; background:url(../images/lib/colorbox/close.png) no-repeat top center; background-size: contain; width:3.34em ; height:3.34em ; }
#cboxClose:hover{ background-position: top center; }
#cboxPrevious{top:60%; left: 0.27em /* -2.22em */; display:block; background:url(../images/lib/colorbox/prev.png) no-repeat top center; background-size: contain; width:1.667em ; height: 5em ; }
#cboxPrevious:hover{ background-position: top center; }
#cboxNext{top:60%; left:inherit; right: 0.27em /* -2.22em */; display:block; background:url(../images/lib/colorbox/next.png) no-repeat top center; background-size: contain; width:1.667em ; height: 5em ; }
#cboxNext:hover{ background-position: top center; }
#cboxCurrent{ display: none !important; }
#cboxLoadingGraphic{ background-image: url(../images/lib/colorbox/loading-custom.gif); }
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

              ■                 ■                
■             ■  ■       ■      ■               ■
■             ■                 ■               ■
■  ■■■■    ■■■■  ■ ■   ■ ■   ■■■■  ■   ■  ■■■   ■
■  ■■  ■  ■■ ■■  ■  ■  ■ ■  ■■ ■■  ■   ■  ■  ■  ■
■  ■   ■  ■   ■  ■  ■ ■  ■  ■   ■  ■   ■   ■■■  ■
■  ■   ■  ■   ■  ■  ■ ■  ■  ■   ■  ■   ■ ■■  ■  ■
■  ■   ■  ■■ ■■  ■   ■■  ■  ■■ ■■  ■  ■■ ■   ■  ■
■  ■   ■   ■■■■  ■   ■   ■   ■■■■   ■■ ■  ■■■■  ■

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* Modal */
#Modal_data{ display: none; }

/* TOP-PAGE */
/* main */
.cont-top-visual{ position: relative;  }

.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ position: relative; margin: 0 auto; overflow: hidden; }
.kv-container > div{ position: absolute; top:0; }

.kv-container .grp{ position: relative; top:inherit; /*display: none;*/ }
.kv-container .grp > div{ position: absolute; top:0; }
.kv-container .grp .vis-grp{ position: relative; }
.kv-container .grp .vis-grp .bg{ position: relative; }
.kv-container .grp .vis-grp .vis{ position: absolute; top:0; }
.kv-container .grp .oa{  }
.kv-container .grp .logo{  }

.kv-container .grp1 .vis-grp{ width: 100%; top:0; left:0; right: 0; margin: 0 auto; }
.kv-container .grp1 .logo{ display: none; }

.kv-container .grp1 .vis-grp{ transform: scale(1.2); opacity: 0; }
.s1 .kv-container .grp1 .vis-grp{ transform: scale(1); opacity: 1;transition: all 1.0s ease 0s; }
/* .s2 .kv-container .grp1 .vis-grp{ transform: scale(1); opacity: 1;transition: all 1.0s ease 0s; } */


@keyframes anm-op-fig {
0% { opacity: 0; transform: scale(.8);}
20% { opacity: 1; transform: scale(1);}
80% { opacity: 1; transform: scale(1.1);}
100% { opacity: 0; transform: scale(1.3);}
}

/* top-movie */
.cont-top-movie{ }

.movie-stage{ }
.movie-navi{ display: flex; flex-wrap: wrap; justify-content: center; background-color: #000; }
.movie-navi .th{ width: 20%; padding: .4em; }
.movie-navi .th a{ display: block; position: relative; padding: 0; margin-bottom: .2em; border-radius: 0; overflow: hidden; }
.movie-navi .th a:hover img{ transform: scale(1.1,1.1); }
.movie-navi .th a img{  }
.movie-navi .th .label{ font-size: .8em; text-align: center; }

/* .top-movie-cursor{ position: absolute; width: 104%; bottom:4vw; left: -2%;  pointer-events: none; }
.top-movie-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.top-movie-cursor ul li{ display: block; width:calc(85/3000*100vw*0.5); height: calc(197/3000*100vw*0.5); position: relative; pointer-events: all; cursor: pointer; }
.top-movie-cursor ul li span{ display: block; width:100%; height: 100%; background:  url(../images/top-movie-cursorbtn.png) no-repeat center center; background-size: 100%; transform-origin: center center; }
.top-movie-cursor ul li.right span{ transform: scale(-1,1); } */

/* top-news */
.cont-top-news{ display: none; }
.cont-top-news > .inner{ margin: 0 auto; padding:0; }

.news-container{ padding: 0; pointer-events: all; }
.news-container dl{ font-size: 1.0em; margin-bottom: 1.0em; padding: 0;  }
.news-container dl:last-child{ margin: 0;}
.news-container dl dt{ display: block; margin: 0 0 .1em 0; }
.news-container dl dt:before{ content:""; width: 2px; height: .6em; background-color: #fff; display: inline-block; margin: 0 .3em 0 0; }
.news-container dl dt > span{ font-weight: normal; font-size: 0.8em; color: #fff; line-height: 1; }
.news-container dl dd{ display: block; font-size: 1.0em; line-height: 1.4; margin: 0; }
.news-container dl dd a,
.news-container dl dd a:visited{ text-decoration: none; color: inherit; }
.news-container dl dd a:hover{ text-decoration: underline; color: inherit; }

/* top-intro */
.cont-top-intro{ }
.cont-top-intro > .inner{ padding:3em; margin: 0 auto; }
.cont-top-intro .top-conttitle > div{ width: calc(666/3000*100vw);}
.intro-container{ padding: 2em ; border-radius: 2em 2em 0 2em; border:#FFF solid .2em; background-color: rgba(0,0,0,1); position: relative; overflow: hidden; }
.intro-container:before{ content:""; width: 100%; min-height: 100%; background: url("../assets/top/intro-bg.jpg") no-repeat center -5vw ; background-size: 100%; position: absolute; top:0; left:0; right:0; margin: 0 auto; opacity: .15; }
.intro-container .text{  font-size: 1.333em; letter-spacing: .1em; line-height: 2; text-align: center; margin-bottom: 0; position: relative; z-index: 2; filter: drop-shadow(0 0 .2em #000) drop-shadow(0 0 .2em #000) ; }

/* top-story */
.cont-top-story{ position: relative; }
.story-bg{ width: 100%; min-height: 100%; position: absolute; top:0vw; left:0; right:0; margin: 0 auto; }
.cont-top-story > .inner{ padding:2em 4em; margin: 0 auto; }
.cont-top-story .top-conttitle > div{ width: calc(368/3000*100vw);}
.story-container{  }
.story-container .text{  font-size: 1.333em; color: #fff; font-weight: bold; letter-spacing: .15em; line-height: 1.5em; margin-bottom: 1.5em; text-align: center; filter: drop-shadow(0 0 .2em #000) drop-shadow(0 0 .2em #000) ; position: relative;}
.story-container .text.ct span{ font-size: 1.2em; color:#fffec8; transform: rotate(2deg); display: inline-block; position: relative; }
.ep-scene{ width: 100%; min-height: 100%; position: absolute; top:0; left:0; pointer-events: none; }
.ep-scene > div{ position: absolute; width: 15vw; border-radius: 1em; overflow: hidden; filter: drop-shadow(0 0 .2em #000) drop-shadow(0 0 .2em #000) ; }
.ep-scene .cut1{ top:2vw; left:4vw; transform: rotate(-2deg) scale(1.1); }
.ep-scene .cut2{ top:14vw; left:2.5vw; transform: rotate(2deg) scale(1.2); }
.ep-scene .cut3{ top:25vw; left:2vw; transform: rotate(-1deg); }
.ep-scene .cut4{ top:3vw; right:4.5vw; transform: rotate(2deg) scale(1.2); }
.ep-scene .cut5{ top:14vw; right:4vw; transform: rotate(-2deg); }
.ep-scene .cut6{ top:25vw; right:2vw; transform: rotate(1deg) }
.ep-scene .cut7{ top:36vw; left:3vw; transform: rotate(2deg); }
.ep-scene .cut8{ top:36vw; right:4vw; transform: rotate(-1deg) scale(1.1); }
.ep-slider{ width: 100%; min-height: 100%; position: relative; overflow: hidden ; background-color: #000; }
.ep-slider-thumb{ width: 1300vw; /*max-width: calc( 1600px * 12 );*/ margin: 0 auto; display: flex; flex-wrap: nowrap; z-index: 2; }
.ep-slider-thumb > div{ width: calc(1/8*200%); padding: 0; transform-origin: center center; pointer-events: all; }
.ep-slider-thumb > div > img{ width: 100%; opacity: .3; }
.ep-slider-thumb{ animation: anm-top-episode 60s 0s infinite linear both running;}
@keyframes anm-top-episode {
0% { transform: translateX(0);}
100% { transform: translateX(-50%);}
}



/* SUB-PAGE */
.sub-page .cont-upper{ padding-top: 4em;}
.sub-page .cont-middle{ min-height: calc(100vh - 13em);}
/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{ }
#Page_News .sub-pagetitle > div{ width: calc(333/3000*100vw);}
.sub-news-container{ padding: 4em; }

/* staffcast */
.cont-sub-staffcast{  }
.cont-sub-staffcast > .inner{ }
#Page_Staffcast .sub-pagetitle > div{ width: calc(492/3000*100vw);}
#Page_Staffcast .sub-conttitle > div{ width: calc(546/3000*100vw);}
.staffcast-container{ padding: 4em; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; }

.staffcast-list{ width: 45%; margin: 0 auto; padding: 1.5em 0; display: flex; flex-wrap: wrap; justify-content: center; border-radius: 2em 2em 0 2em; box-sizing: border-box; border: #fff solid .2em; }
.staffcast-list-text{ width: 100%; font-size: 1em; line-height: 1.5; letter-spacing: .1em; margin-bottom: 1.2em; text-align: center; }
.staffcast-list-text.grp{ margin-bottom: 3em; }
.staffcast-list-text .pos{ font-size:1em; color: #ff8200; margin-bottom: .2em; }
.staffcast-list-text .name{ font-size: 1.066em; margin-bottom: 0; line-height: 2; }

/* music */
.cont-sub-music{ }
.cont-sub-music > .inner{ }
#Page_Music .sub-pagetitle > div{ width: calc(398/3000*100vw);}
.sub-music-container{ padding: 4em; }

/* bddvd */
.cont-sub-bddvd{ }
.cont-sub-bddvd > .inner{ }
#Page_Bddvd .sub-pagetitle > div{ width: calc(398/3000*100vw);}
.sub-bddvd-container{ padding: 4em; }

.bnf-list{ display: flex; flex-wrap: wrap; margin-bottom: 1em; align-items: flex-start; }
.bnf-list > div{ }
.bnf-list > .item-x1{ width: 100%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x2{ width: 50%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x3{ width: 33.33%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x3x2{ width: 66.66%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x4{ width: 25%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x5{ width: 20%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x1.x1-dbl{ width: 50%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list .item-col{ width: 100%; }
.bnf-list .item-col-x2{ width: calc((100% - (0.5em * 1)) / 2); margin-right: .5em; }
.bnf-list .item-col-x2:nth-of-type(2n){ margin-right: 0;}
.bnf-list .item-col-x2:last-child{ margin: 0; }
.bnf-list .item-col-x3{ width: calc((100% - (0.5em * 2)) / 3); margin-right: .5em; }
.bnf-list .item-col-x3:nth-of-type(3n){ margin-right: 0;}
.bnf-list .item-col-x3:last-child{ margin: 0; }
.bnf-list .item-col-x4{ width: calc((100% - (0.5em * 3)) / 4); margin-right: .5em; }
.bnf-list .item-col-x4:nth-of-type(4n){ margin-right: 0;}
.bnf-list .item-col-x4:last-child{ margin: 0; }

.bnf-list .shop{ width: 100%; min-height: 2.4em; color: #fcf95f; border-bottom: #fcf95f dotted 1px; background-color: rgba(0,0,0,.025); padding: .2em .2em; margin-bottom: .25em; font-size: 0.8em; line-height: 1.2; display: flex; align-items: center; }
.bnf-list .shop > p{ letter-spacing: 0; }
.bnf-list .thumb{ padding:.5em 3em; text-align: center; margin: .5em auto ; }
.bnf-list .thumb{ display: flex; align-items: center; justify-content: center; vertical-align: middle; }
.bnf-list .thumb .inner{ min-height: 13em; position: relative; }
.bnf-list .thumb .inner a{ display: block; height: 13em; position: relative; }
.bnf-list .thumb .inner img.vt{ max-width: auto; height: 13em; width: auto\9;}
.bnf-list .thumb.np{ pointer-events: none;  }
.bnf-list .data{ width: 100%; text-align: center; }
.bnf-list .excond{ font-size: 0.666em; color: #ccc; margin-bottom: .3em; }
.bnf-list .name{ font-size: .8em; letter-spacing: -0.05em; margin-bottom: .3em; text-align: center; }
.bnf-list .cond{ font-size: 0.777em; margin-bottom: .3em; background-color :#fcf95f; display: inline-block; padding: .1em .2em; color: #000; }
.bnf-list .start{ font-size: 0.666em; margin-bottom: .5em; color :#fcf95f; }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; text-align: center;  }

/* movie */
.cont-sub-movie{ }
.cont-sub-movie > .inner{ }
#Page_Movie .sub-pagetitle > div{ width: calc(350/3000*100vw);}
.sub-movie-container{ padding: 4em; }

.sub-movie-list{ width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 ; }
.sub-movie-list .thm{ width: calc( 1 / 2 * 100% - 2em ); margin-bottom: 2em; margin-right: 2em; }
.sub-movie-list .thm a{ display: block; position: relative;letter-spacing: .05em; pointer-events: all; border-radius: 2em 2em 0 2em; overflow: hidden; margin-bottom: .5em; }
.sub-movie-list .thm a:after{ content:""; width: 100%; min-height: 100%; position: absolute; top:0; left:0; pointer-events: none; border-radius: 2em 2em 0 2em; border:#FFF dotted .2em; }
.sub-movie-list .thm a:hover{ text-decoration: none; transform: scale(1.05,1.05); }
.sub-movie-list .thm .cap{ text-align: center; font-size: 1.2em; letter-spacing: .1em; margin-bottom: 0; }

/* novelty */
.cont-sub-novelty{ }
.cont-sub-novelty > .inner{ }
#Page_Novelty .sub-pagetitle > div{ width: calc(398/3000*100vw);}
.sub-novelty-container{ padding: 4em; }

.sub-novelty-navi{ padding: 0 2em; display: flex; }
.sub-novelty-navi > div{ width: 25%; text-align: center; padding: 1em 1em; background-color: transparent; border-radius: 2em 2em 0 0; box-sizing: border-box; margin-bottom: 0; border: #fff solid .2em; border-bottom: none; }
.sub-novelty-navi > div > span{ font-weight: bold; font-size: 1.5em; letter-spacing: .1em; }
.sub-novelty-navi > div.crt{ background-color: #FFF; color: #000; }
.sub-novelty-data{  font-size: 1.1em; line-height: 1.5; padding: 2em; background-color: transparent; border-radius: 2em 2em 0 2em; box-sizing: border-box; margin-bottom: 3em; border: #fff solid .2em; text-align: left; }

.novelty-slctbtn{ display: inline-block; width: 22%; text-align: center; padding: .7em 0em; background-color: transparent; border-radius: 1.5em 1.5em 0 0; box-sizing: border-box; margin-bottom: 0; border: #fff solid .2em; border-bottom: none; font-size: 1.5em; font-weight: bold; letter-spacing: .1em;}
.novelty-slctbtn:hover{ background-color: #FFF; color: #000; }
.slctcont-radio:checked + .novelty-slctbtn { pointer-events: none; background-color: #FFF; color: #000; }
#NoveltySlct1:checked ~ #NoveltySlctCont1 { display: block; }
#NoveltySlct2:checked ~ #NoveltySlctCont2 { display: block; }
#NoveltySlct3:checked ~ #NoveltySlctCont3 { display: block; }
#NoveltySlct4:checked ~ #NoveltySlctCont4 { display: block; }

/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■      

                     ■                                                     
 ■■    ■■            ■  ■             ■■■                     ■            
 ■■    ■■            ■               ■   ■                                 
 ■■■  ■ ■   ■■■   ■■■■  ■  ■■■      ■     ■  ■   ■   ■■■  ■ ■ ■   ■■■  ■■■ 
 ■ ■  ■ ■  ■  ■  ■■ ■■  ■  ■  ■     ■     ■  ■   ■  ■  ■  ■■  ■  ■  ■  ■   
 ■ ■  ■ ■  ■   ■ ■   ■  ■   ■■■     ■     ■  ■   ■  ■   ■ ■   ■  ■   ■ ■■  
 ■  ■■  ■  ■■■■■ ■   ■  ■ ■■  ■     ■     ■  ■   ■  ■■■■■ ■   ■  ■■■■■   ■■
 ■  ■■  ■  ■     ■■ ■■  ■ ■   ■      ■  ■■   ■  ■■  ■     ■   ■  ■        ■
 ■      ■   ■■■   ■■■■  ■  ■■■■       ■■■■■   ■■ ■   ■■■  ■   ■   ■■■  ■■■ 

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* Custom 1920 ----------------------------------------------------------------------------- */
@media (max-width: 1919px) {
}
/* Custom 1400 ----------------------------------------------------------------------------- */
@media (max-width: 1399px) {

}
/* LG ----------------------------------------------------------------------------- */
@media (max-width: 1199px) {

}
/* MD ----------------------------------------------------------------------------- */
@media (max-width: 991px) {
}
/* lt768 ----------------------------------------------------------------------------- */
@media (min-width:768px) {
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
body{ background-image: url(../images/common/background.png) ; background-size: 100%; }

/* #Foreground .op-container{ width: 90vw; height: 90vw; top:calc(50vh - (90vw*0.5));  } */

 
/* header */
.part-header{ width: 100%; position: fixed; padding: 0; top:0; right: 0; background: transparent none; display: block; pointer-events: none; }
.cont-sp-btn{ display: block; color:#fff; width: 8vw; position: absolute; top:4vw; left: 3vw; z-index: 2; pointer-events: all; }
.cont-sp-btn a{ display: block; line-height: 0; color:#fff; }
.cont-sp-btn svg{ fill: currentColor; }
.cont-sp-btn .sp-navi-open{ display: block; }
.cont-sp-btn .sp-navi-close{ display: none; }

.spmenu-on .cont-sp-btn .sp-navi-open{ display: none; }
.spmenu-on .cont-sp-btn .sp-navi-close{ display: block; }


.cont-global-logo{ width: 50%; padding: 1.5em 0 3em 0;  }
.cont-global-navi{ width: 90%; margin: 0 auto 1em auto; }
.global-navi{ }
.global-navi > ul{ display: flex; justify-content: flex-start; flex-wrap: wrap; }
.global-navi > ul > li{ width: 50%; margin: 0 0 1.2em 0; }

.cont-season-btn{ width: 40%; padding: 0; margin: 0 auto 2em auto; }
.cont-season-btn > ul > li{ width: 100%; }

.cont-side-news-pc{ display: none; }

.cont-side-banner-pc{ padding: 0; margin: 0 auto ; position: relative;  }
.rel-banner{ width: 100%; padding: 1em; }
.rel-banner > ul{ display: flex; flex-wrap: wrap; justify-content: center; }
.rel-banner > ul > li{ width: 50%; display: block; padding: 1em ; margin: 0; line-height: 1; position: relative;}
.rel-banner > ul > li:nth-child(1){ margin: 0 2em; }



/* body */
.part-body{ position: relative; display: block; flex-wrap: wrap; }
.sub-page .part-body{  }
.part-body-side{ width: 100%; min-height: 100vh; top:0; bottom:inherit; z-index: 50; background-color: rgba(0,0,0,.9); position: fixed; display: none; }
.spmenu-on .part-body-side{ display: block; }
.part-body-main{ position: relative; width: 100%; }


.cont-top-content{ }
.cont-top-content > .inner{ padding: 0; }
.cont-sub-content > .inner{ padding: 0; }

.top-conttitle{ font-size: 1em; margin-bottom: 1em; }
.top-conttitle > div{ width: calc(666/1000*100vw*0.8);  }

.sub-pagetitle{ font-size: 1em; margin-bottom: 1em; }
.sub-pagetitle > div{ width: calc(666/1000*100vw*0.8);  }

/* footer */
.footer-pagetop{ width: calc( 180/30 * 1em * 0.6 ); height: calc( 180/30 * 1em * 0.6 ); bottom:1em;  right:1em; }
.footer-copyrihgt p{ color: #FFF; font-size: .6em; margin-bottom: 0; }


/* content */
/* 1 */
.content-entry{ padding: 1.5em;  }
/* 2 */
.cont-entries2 .entry{ padding: 1.5em;}

.modal-data{ display: none; }
.frame-modal{ padding: 1.5em; }


/* TOP-PAGE */
/* main */

/* animetion init */

/* top-movie */
.cont-top-movie{ }

.movie-stage{ }
.movie-navi .th{ width: 33.33%; padding: .4em; }

/* top-news */
.cont-top-news{ display: block; padding: 2em; margin: 0 auto ; position: relative; background: url("../images/side-news-bg-pc.png") no-repeat left top; background-size: cover; }
.news-container dl dt > span{  font-size: 1em; }
.news-container dl dd{ font-size: 1.2em; }

/* top-intro */
.cont-top-intro{ padding:2em 0; }
.cont-top-intro > .inner{ padding:2em 2em; margin: 0 auto; }
.cont-top-intro .top-conttitle > div{ width: calc(666/1000*100vw*0.8);}
.intro-container .text{ font-size: 1.2em; }

/* top-story */
.cont-top-story{ padding:2em 0; }
.cont-top-story > .inner{ padding:2em 0em; margin: 0 auto; }
.cont-top-story .top-conttitle > div{ width: calc(368/1000*100vw*0.8);}
.story-container{  }
.story-container .text{  font-size: 1.333em; line-height: 2; }

.ep-scene{ width: 100%; margin: 0 auto; min-height: inherit; position: relative; top:inherit; left:inherit; pointer-events: none; display: flex; flex-wrap: wrap; justify-content: center; }
.ep-scene > div{ position: relative; width: 47%; margin: 1.5%; border-radius: 1em; overflow: hidden; }
.ep-scene .cut1{ top:inherit; left:inherit; transform: rotate(0); }
.ep-scene .cut2{ top:inherit; left:inherit; transform: rotate(0); }
.ep-scene .cut3{ top:inherit; left:inherit; transform: rotate(0); }
.ep-scene .cut4{ top:inherit; right:inherit; transform: rotate(0); }
.ep-scene .cut5{ top:inherit; right:inherit; transform: rotate(0); }
.ep-scene .cut6{ top:inherit; right:inherit; transform: rotate(0); }
.ep-scene .cut7{ top:inherit; left:inherit; transform: rotate(0); }
.ep-scene .cut8{ top:inherit; right:inherit; transform: rotate(0); }

.ep-slider-thumb{ width: 5000vw;  }
.ep-slider-thumb > div{ width: calc(1/8*200%);  }
.ep-slider-thumb{ animation: anm-top-episode 120s 0s infinite linear both running;}



/* SUB-PAGE */
.sub-page .cont-middle{ min-height: calc(100vh - 13em);}

/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{ }
#Page_News .sub-pagetitle > div{ width: calc(333/1000*100vw*0.8);}
.sub-news-container{ padding: 1em 2em; }

/* staffcast */
.cont-sub-staffcast{  }
.cont-sub-staffcast > .inner{ }
#Page_Staffcast .sub-pagetitle > div{ width: calc(492/1000*100vw*0.8);}
#Page_Staffcast .sub-conttitle > div{ width: calc(546/1000*100vw*0.8);}
.staffcast-container{ padding: 1em 2em; }

.staffcast-list{ width: 100%; margin: 0 auto; }
.staffcast-list.staff{ margin-bottom: 3em; }

/* music */
.cont-sub-music{ }
.cont-sub-music > .inner{ }
#Page_Music .sub-pagetitle > div{ width: calc(398/1000*100vw*0.8);}
.sub-music-container{ padding: 1em 2em; }

/* bddvd */
.cont-sub-bddvd{ }
.cont-sub-bddvd > .inner{ }
#Page_Bddvd .sub-pagetitle > div{ width: calc(398/1000*100vw*0.8);}
.sub-bddvd-container{ padding: 1em 2em; }

.bnf-list > .item-x1{ width: 100%; }
.bnf-list > .item-x2{ width: 100%; }
.bnf-list > .item-x3{ width: 100%; }
.bnf-list > .item-x3x2{ width: 100%; }
.bnf-list > .item-x4{ width: 100%; }
.bnf-list > .item-x1.x1-dbl{ }

.bnf-list > .item-x1 .item-col-x2,
.bnf-list > .item-x2 .item-col-x2,
.bnf-list > .item-x3 .item-col-x2,
.bnf-list > .item-x3x2 .item-col-x2,
.bnf-list > .item-x4 .item-col-x2{ width: 100%; margin-right: 0 }

.bnf-list > .item-x1 .item-col-x3,
.bnf-list > .item-x2 .item-col-x3,
.bnf-list > .item-x3 .item-col-x3,
.bnf-list > .item-x3x2 .item-col-x3,
.bnf-list > .item-x4 .item-col-x3{ width: 100%; margin-right: 0 }

.bnf-list > .item-x1 .item-col-x4,
.bnf-list > .item-x2 .item-col-x4,
.bnf-list > .item-x3 .item-col-x4,
.bnf-list > .item-x3x2 .item-col-x4,
.bnf-list > .item-x4 .item-col-x4{ width: 100%; margin-right: 0 }

.bnf-list .thumb{ padding:0 2.5em;  }
.bnf-list .thumb .inner img.vt{ height: 20em; }


/* movie */
.cont-sub-movie{ }
.cont-sub-movie > .inner{ }
#Page_Movie .sub-pagetitle > div{ width: calc(350/1000*100vw*0.8);}
.sub-movie-container{ padding: 1em 2em; }

.sub-movie-list{ width: 100%; display: flex; flex-wrap: wrap; justify-content: center; margin: 0 ; }
.sub-movie-list .thm{ width: 90%; margin-bottom: 2em; margin-right: 0; }

/* novelty */
.cont-sub-novelty{ }
.cont-sub-novelty > .inner{ }
#Page_Novelty .sub-pagetitle > div{ width: calc(398/1000*100vw*0.8);}
.sub-novelty-container{ padding: 1em 2em; }

.sub-novelty-navi{ padding: 0 2em; display: flex; }
.sub-novelty-navi > div{ width: 25%; text-align: center; padding: 1em 0; }
.sub-novelty-navi > div > span{ font-size: 1.5em; }

.sub-novelty-data{  }

}
/* SM ----------------------------------------------------------------------------- */
@media (orientation: portrait) and (max-width: 767px) {

}
/* XS ----------------------------------------------------------------------------- */
@media (max-width: 543px) {

}
/* pc - large ----------------------------------------------------------------------------- */
@media (min-width: 768px) {

}
/* pc - xlarge ----------------------------------------------------------------------------- */
@media (min-width: 1200px) {

}