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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #fff; background:#1b1f26 url("../images/common/background.jpg") 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; pointer-events: none; }
#Background .header-bg{ background: url("../images/common/header-bg.png") no-repeat center top ; background-size: 100%; position: absolute; }

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

/* #Foreground .loading{ display: none; } */
#Foreground .loading{ min-height: inherit; height: 100vh; position: fixed; background:#1d2128; overflow: hidden; opacity: 1; }
#Foreground .loading .bg{ width: 100%; height:400vh; position: absolute; bottom:calc( 50vh - 582/3000*100vw + 2vw ); background:#FFF; transform: skewY(16deg); }
#Foreground .loading .sword{ display: block; width:calc(153/3000*100vw); height:calc(582/3000*100vw); position: absolute; top:50vh; left:0; right: 0; margin: 0 auto; }
#Foreground .loading .logo{ display: block; width:calc(697/3000*100vw); height:calc(330/3000*100vw); position: absolute; top:calc( 50vh - 20vw ); left:0; right: 0; margin: 0 auto; }
#Foreground .loading .oa{ display: block; width:calc(1106/3000*100vw); height:calc(134/3000*100vw); position: absolute; top:calc( 50vh - 7vw ); left:0; right: 0; margin: 0 auto; }
#Foreground .loading .sword img{ animation: anm-op-sword 1.5s 0s linear both infinite running; }
@keyframes anm-op-sword {
0% { transform: rotateY(0deg);}
100% { transform: rotateY(360deg);}
}
#Foreground .loading .sword{ opacity: 0; transform: translateY(-20%); }
#Foreground .loading .bg{ bottom: -15vw }
#Foreground .loading .logo{ opacity: 0; transform: translateY(-20%);}
#Foreground .loading .oa{ transform: rotateY(90deg);}

.init.fst #Foreground .loading .sword{ opacity: 1; transform: translateY(0%); transition: all 2.5s ease 0s; }
.init.vst #Foreground .loading { display: none; }

.s1.fst #Foreground .loading .bg{ bottom:calc( 50vh - 582/3000*100vw + 2vw ); transition: all .5s ease-out 0s; }
.s1.fst #Foreground .loading .sword img{ animation: paused; }
.s1.fst #Foreground .loading .logo{ opacity: 1; transform: translateY(0%); transition: all 1.5s ease .0s; }
.s1.fst #Foreground .loading .oa{ transform: rotateY(360deg); transition: all 1.0s ease 1.2s;}

.s2.fst #Foreground .loading .logo{ opacity: 0; transition: all .5s ease .0s; }
.s2.fst #Foreground .loading .oa{ opacity: 0; transition: all .5s ease .0s;}
.s2.fst #Foreground .loading .sword{ opacity: 0; transition: all .5s ease .5s; }
.s2.fst #Foreground .loading .bg{ transform: translateY(50%); transition: all .5s ease .5s; }
.s2.fst #Foreground .loading { opacity: 0; transition: all .5s ease 1.0s; }



/* header */
.part-header{ position: relative; top:0; pointer-events: none; }
.top-page .part-header{ position: absolute; top:0; }
/* .main-vis-nav .part-header{ position: absolute; } */
.cont-global-navi{ position: relative; }
.global-logo{ width: calc( 697/3000*100vw); position: relative; margin: 0 0 2em 3em; padding-top:2.3em; pointer-events: all; }
.sub-page .global-logo{  }
.global-oa{ width: calc( 665/3000*100vw); position: relative; padding: 1em 0 0 1.5em; margin-bottom: 3em;  }

.global-navi{ margin: 0; position: absolute; top:2.3em; left: 27.5em; width: 65%; }
.global-navi > ul{ display: flex; flex-wrap: wrap; list-style-type: none; padding: 0; margin: 0; text-align: right; }
.global-navi > ul > li{ display: inline-block; padding: 0 ; margin: .5em ; line-height: 1; }
.global-navi > ul > li a{ color: #000; display: inline; position: relative; text-decoration: none; pointer-events: all;  }
.top-page .global-navi > ul > li a{ color: #FFF; filter: drop-shadow(0 0 .3em #000) drop-shadow(0 0 .3em #000);}
.global-navi > ul > li a > span{ position: relative; font-size: 1.7em; font-family: 'Lora', serif; letter-spacing: .02em; }
.global-navi > ul > li a:hover{ color: #8f104c; }
.top-page .global-navi > ul > li a:hover{ color: #ff0078; }
.global-navi > ul > li.crt a{ pointer-events: none; color: #8f104c; }
.global-navi > ul > li.cs a{ pointer-events: none; color: #CCC; }
.top-page .global-navi > ul > li.cs a{ color: #999; }
.global-navi > ul > li.off{ display: none; }

.global-season{ margin: 0; position: absolute; top:2.0em; right: 1em; width: 12em; }
.global-season > ul{ display: flex; flex-wrap: nowrap; flex-direction: column; list-style-type: none; padding: 0; margin: 0; text-align: right; }
.global-season > ul > li{ display: inline-block; padding: 0 ; margin: .25em ; line-height: 1; }
.global-season > ul > li a{ display: inline-block; position: relative; text-decoration: none; pointer-events: all;  }
.global-season > ul > li a:hover{ transform: scale(1.1); }

.cont-sp-btn{ display: none; }

/* body */
.part-body{  }
.cont-upper{ position: relative; }
.cont-middle{ position: relative; }

.sub-gnv{ pointer-events: none; position: absolute; top:5vw; }

.cont-top-content{ width: 100%; margin: 0 auto; padding-top: 4em; }
.cont-top-content > .inner{ padding: 0 3em;}
.cont-sub-content{ width: 100%; margin: 0 auto; padding-top: 4em; }
.cont-sub-content > .inner{ padding: 0 3em;}

.sub-pagetitle{ font-size: 1em; margin: 0 auto 3em 0; position: relative;}
.sub-pagetitle > span{ }

.cont-subcatnavi{ width: 67.5%; font-size: 1em; margin: 0; padding: 0 0 .6em 1em; display: block; position: absolute; top:3em; right:3em; }
.cont-subcatnavi nav{}
.cont-subcatnavi nav ul{ display: flex; list-style-type: none; padding: 0; margin: 0; }
.cont-subcatnavi nav ul li{ display: block; padding: .5em ; margin: 0; line-height: 1; font-size: 1.6em; font-weight: normal; font-family: 'Roboto', sans-serif; letter-spacing: .1em; }
.cont-subcatnavi nav ul li{ border-bottom: #00daff solid 1px;}
.cont-subcatnavi nav ul li.spc{ width: 1em; }
.cont-subcatnavi nav ul li.spc.lst{ width: 100%; }
.cont-subcatnavi nav ul li.crt{  border-top: #00daff solid 1px; border-left: #00daff solid 1px; border-right: #00daff solid 1px; border-bottom: none;}
.cont-subcatnavi nav ul li a{ color: #FFF; }
.cont-subcatnavi nav ul li.crt a{ color: #00daff; pointer-events: none; }

.sub-subcattitle{ font-size: 1em; margin: 0; padding: 0 0 .3em 1em; display: block; position: absolute; top:4em; right:3em; border-bottom: #00daff solid 1px; color: #00daff; }
.sub-subcattitle > span{ font-size: 1.6em; font-weight: normal; font-family: 'Roboto', sans-serif; letter-spacing: .1em; }

.sub-content-container{  }
.sub-cont-subtitle{ background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 38%, rgba(255,255,255,.1) 62%, rgba(255,255,255,0) 100%); padding: 3em 2em 3.5em 2em; margin: 0 auto 2em auto; position: relative; }
.sub-cont-subtitle:before{ content:""; width: calc(100% - 4em); height: 1px; background-color: #aa0050; position: absolute; bottom:3em; left:0; right: 0; margin: 0 auto; }
.sub-cont-subtitle > h4{ font-size: 1em; display: block; font-weight: bold; line-height: 1.5; padding: .2em; margin: 0; }
.sub-cont-subtitle > h4 span{ font-size: 1.333em; font-weight: bold;}

.sub-logo{ display: none; }

/* .subnavi-cursor{ position: absolute; width: 96%; bottom:.3vw; left: 2%;  pointer-events: none; }
.subnavi-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.subnavi-cursor ul li{ display: block; width:calc(224/3000*100vw); height: calc(398/3000*100vw); position: relative; pointer-events: all; cursor: pointer; }
.subnavi-cursor ul li span{ display: block; width:100%; height: 100%; background: url(../images/cursor.png) no-repeat center center; background-size: 100%; transform-origin: center center; }
.subnavi-cursor ul li span:hover{ background-image: url(../images/cursor-hv.png); }
.subnavi-cursor ul li.right span{ transform: scale(-1,1); } */

/* footer */
.part-footer{  }
.cont-global-footer{ margin: 0 auto; padding:3em 0 0 0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 140/30 * 1em ); height: calc( 140/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/navi/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: 0 0 1em 0; position: relative; }
.footer-mark{ color: #AAA; text-align: center; position: relative; padding-bottom: 1em; }
.footer-mark:before{ content:""; width: 70%; height: 1px; position: absolute; bottom:0; left: 0; right: 0; margin: 0 auto .5em auto; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.5) 60%, rgba(255,255,255,0) 100%);  }
.footer-mark p{ font-size: 1.066em; font-family: 'jaf-facitweb', sans-serif; font-style: italic; letter-spacing: .5em; margin-bottom: 0; }

.footer-banner{ width: 60vw; margin: 0 auto; padding: 3em 0 3em 0; display: flex; flex-wrap: nowrap; justify-content: center; }
.footer-banner > div{ padding: 0 1em; }

.footer-season{ width: 100%; margin: 0 auto; padding: 3em 0 3em 0; display: flex; flex-wrap: nowrap; justify-content: center; }
.footer-season:before{ content:""; width: 70%; height: 1px; position: absolute; top:0; left: 0; right: 0; margin: 0 auto .5em auto; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.5) 60%, rgba(255,255,255,0) 100%);  }
.footer-season:after{ content:""; width: 70%; height: 1px; position: absolute; bottom:0; left: 0; right: 0; margin: 0 auto .5em auto; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.5) 60%, rgba(255,255,255,0) 100%);  }
.footer-season > div{ width: 15em; padding: 0 1em; }

.footer-copyrihgt{ color: #FFF; text-align: center; position: relative; padding-top: 1em; }
.footer-copyrihgt p{ font-size: 0.9em; letter-spacing: .1em; 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; }

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

.txt-ul{ display: inline-block; padding: 0 .5em; line-height: 1; position: relative; }
.txt-ul > span{ position: relative; }
.txt-ul::before{ content:""; width: 100%; height:.4em; background:#fff100 ; position: absolute; bottom: -.2em; left: 0; }

hr.sld{ border-color: #482f21; }
hr.dot{ border-color: #482f21; }
hr.circle{border-width: 0 0 .46em; border-style: solid;border-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 1"><circle fill="#482f21" cx="1" cy="0.5" r="0.5"/></svg>') 0 0 100% repeat;width: 100%;}

.frame-a{ background-color:rgba(120,120,120,.05); }
.frame1-il{ color: #fff; font-weight: bold; display: inline-block; background-color: #ff8200; border-radius: 1.5em; padding: .5em 1em; }

.frame1-ol-il{ color: #ff8200; font-weight: bold; display: inline-block; border: #ff8200 solid .1em; border-radius: 1.5em; padding: .5em 1em; }

.sep-ic{ width: calc( 95/30*1em ); height: calc( 102/30*1em ); margin: 0 auto 1em auto; display: block; background: url(../images/common-sep-ic.png) no-repeat center center; background-size: contain; }

.blink-tip{ display: inline-block; padding: .2em; font-size: .6em; background-color:#fff; border:#ff8200 solid 1px; color: #ff8200; line-height: 1; position: absolute; top:.7em; right: 1.5em; }

.sdw-1{  filter: drop-shadow(.1em .1em 0 #fff);}
.sdw-2{  filter: drop-shadow(.3em .3em 0 #fff);}
.sdw-3{  filter: drop-shadow(.1em .1em 0 #000);}
.sdw-4{  filter: drop-shadow(.3em .3em 0 #000);}

.trs-rot-1{ transform: rotate(-3deg); position: relative; }


.cont-entries{ margin: 0 auto; padding-bottom: 3em; }
.content-entry{ box-sizing: border-box; margin-bottom: 3em; position: relative; }
.content-entry:before{ content:""; width: 2px; height: calc(100% - 3em - 1.5em); background-color:#aa0050; position: absolute; top:3em; left:-2.9em;  }
.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-head{ padding: 0 0; margin-bottom: 0; position: relative; }
.content-entry .entry-body{ color: #DDD; font-size: 1.2em; letter-spacing: .05em; line-height: 1.5; padding: 1.5em 1em; }

.content-entry .entry-date{ font-size: 1em; font-weight: bold; color:#aa0050; line-height: 1; display: inline-block; position: absolute; top:.2em; left:-4.5em; }
.content-entry .entry-date > div{ display: block; font-size: 1.0em; letter-spacing: .3em; line-height: 1.2; position: relative; }
.content-entry .entry-date > div > span{ display: block; font-size: 1.2em; letter-spacing: .02em;  }
.content-entry .entry-title{ font-size: 1em; margin-bottom: 0; padding: 1em; background-color: rgba(255,255,255,.1); }
.content-entry .entry-title > div{ }
.content-entry .entry-title span{ font-size: 1.733em; font-weight: bold; line-height: 1.5; letter-spacing: .05em; }

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

.modal-data{ display: none; }
.cont-modal{ width: 100%; max-width: 800px; margin: 0 auto; }
.cont-modal2{ width: 100%; max-width: 1280px; margin: 0 auto; }
.frame-modal{ background-color: rgba(255,255,255,1); border:#ff8200 .266em solid; border-radius: 3em; padding: 3em; }

.content-accordion .acd-check{ display: none;}
.content-accordion .acd-head{ position: relative; text-align: center; margin-block: 2em; }
.content-accordion .acd-head .acd-label{ width: 20em; background: #ff0078; padding: 1em 2em; margin: 0 auto; text-align: center; }
.content-accordion .acd-head .acd-label > span{ padding-left: .8em; display: inline-block; }
.content-accordion .acd-head .acd-label::before{ content:"＋"; display: inline-block; font-size:1.0em; padding: .1em 0 .2em 0; width: 1.5em; text-align: center; border:#FFF solid 1px; line-height: 1; font-weight: bold; color: #FFF; position: relative; pointer-events: none;}
.content-accordion .acd-body{ display: none; height: 0; overflow: hidden; transition: 0.5s all ease 0.5s; }
.content-accordion .acd-check:checked ~ .acd-body{ display: inherit; height: inherit; transition: 0.5s all ease 0s;}
.content-accordion .acd-check:checked ~ .acd-head .acd-label::before{ content:"−";}

/* colorbox customize */
#colorbox{}
#cboxOverlay{ background:rgba(0,0,0,1) ; }
#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-k.gif); }
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

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

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

/* TOP-PAGE */
/* main */
#Background .header-bg.top{ background: url("../assets/top/bg.png") no-repeat center top ; background-size: 100%; position: absolute; }
.cont-top-visual{ padding: 0; position: relative; overflow: hidden; }
.cont-top-visual .kv-container{ width: 100%; margin: 0 ; position: relative; }
.kv-container > div{ position: absolute; top:0; }
.kv-container .bg{ position: relative; }
.kv-container .vis{  }
.kv-container .oa{ width: calc( 532/3000*100vw ); top:15vw; left: 5vw;  }
.kv-container .catch{ width: calc( 311/3000*100vw ); top:12.5vw; right: 29.5vw;  }
.kv-container .logo{ display: none; }

.kv-container .vis{ opacity: 0; transform: scale(1.2); }
.kv-container .oa{ opacity: 0; transform: scale(1.2); }
.kv-container .catch{ opacity: 0; transform: scale(1.2); }

.init.vst .kv-container .vis{ opacity: 1; transform: scale(1); transition: all .5s ease 1.0s; }
.init.vst .kv-container .oa{ opacity: 1; transform: scale(1); transition: all 1.0s ease 1.5s; }
.init.vst .kv-container .catch{ opacity: 1; transform: scale(1); transition: all 1.0s ease 1.5s; }

.s2.fst .kv-container .vis{ opacity: 1; transform: scale(1); transition: all .5s ease 1.0s; }
.s2.fst .kv-container .oa{ opacity: 1; transform: scale(1); transition: all 1.0s ease 1.5s; }
.s2.fst .kv-container .catch{ opacity: 1; transform: scale(1); transition: all 1.0s ease 1.5s; }


/* news twitter */
.cont-top-news-twitter{ width: 100%; margin: 0 auto 4em auto ; position: relative; color: #000; background-color: #FFF; display: flex; flex-wrap: wrap; justify-content: space-around; padding: 2em 0; }
.cont-top-news,
.cont-top-twitter{ width: 44%; position: relative; }
.cont-top-news{  }

.top-news-twitter-title{ font-size: 1.133em; font-family: 'jaf-facitweb', sans-serif; margin-bottom: 0; line-height: 1; }
.top-news-twitter-title a{ text-decoration: none; }
.top-news-twitter-title a,.top-news-twitter-title a:visited {color: #000;}
.top-news-twitter-title a:hover,.top-news-twitter-title a:active {color: #aa0050; }

/* news */
.cont-top-news{  }
.cont-top-news .sub-pagetitle{  width: calc(439/3000*100vw); }
.news-container{ position: relative; background: url("../images/top-news-line.png") no-repeat left top; background-size: 20vw; }
.news-container dl{ font-size: 1.0em; margin: 0; padding: 1em 0 0 1em; }
.news-container dl dt{ display: inline-block; margin: 0 ; padding: 0; line-height: 1; font-size: 0.8em; font-family: 'jaf-facitweb', sans-serif; }
.news-container dl dt span:before{ content:"."; }
.news-container dl dd{ display: block; font-size: 1.0em; line-height: 1.4;  }
.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; }

/* twitter */
.cont-top-twitter{ }
.cont-top-twitter .sub-pagetitle{  width: calc(114/3000*100vw); }
.twitter-widget-container{ width: 90%; position: relative; background: url("../images/top-news-line.png") no-repeat left top; background-size: 20vw; min-height: 18vw; overflow: hidden;  }
.twitter-widget-container iframe{ min-height: 100%; }
.twitter-timeline-container{ padding: .5em; }

.x-banner{ padding: 1.5em; }

/* introduction */
.cont-top-intro{ margin-bottom: 8em; }
.cont-top-intro > .inner{ }
.cont-top-intro .sub-pagetitle{  width: calc(1588/3000*100vw); }
.top-content-container.top-intro-container{ width: 100%; margin: 0 auto; }
.intro-container{ line-height: 2; font-size: 1.6em; letter-spacing: .1em; }
.intro-container .text{ margin-bottom: 1.5em; }

/* movie */
.cont-top-movie{ margin-bottom: 8em; }
.cont-top-movie .movie-player-frame{ width: 80vw; padding: 1.0em; margin: 0 auto ; position: relative; border-image: url("../images/top-movie-frame.png") 33% fill / 1.1em repeat ; }
.cont-top-movie .movie-player-frame > div{  }

/* .cont-top-movie .movie-navi{ width: 22vw; position: absolute; top:0; right: 2vw; display: flex; flex-direction: column; }
.cont-top-movie .movie-navi .th{ padding: 0; position: relative; margin:1em;}
.cont-top-movie .movie-navi .th a{  }

.movie-navi-cursor{ position: absolute; width: 94%; bottom:-4vw; left: 3%;  pointer-events: none; display: none; }
.movie-navi-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.movie-navi-cursor ul li{ display: block; width:calc(296/3000*100vw); height: calc(296/3000*100vw); position: relative; pointer-events: all; cursor: pointer; background: url(../images/movie-cursor.png) no-repeat center center; background-size: 100%; transform-origin: center center; }
.movie-navi-cursor ul li:hover{ transform: scale(1.1); }
.movie-navi-cursor ul li.right{ transform: scale(-1,1); }
.movie-navi-cursor ul li.off{ pointer-events: none; opacity: .3; } */


/* staffcast */
.cont-top-staffcast{ margin-bottom: 8em; }
.cont-top-staffcast > .inner{  }
.cont-top-staffcast .sub-pagetitle{  width: calc(1378/3000*100vw); }
.top-content-container.top-staffcast-container{ width: 100%; margin: 0 auto; }

.staffcast-container{ padding: 3em 3em 3em 14em; background-color: rgba(255,255,255,.1); position: relative; margin-bottom: 2em; }
.staffcast-label{ position: absolute; top:1.5em; left:1.5em; }
.staffcast-label > span{ font-size: 2.666em; font-family: 'jaf-facitweb', sans-serif; }

.staffcast-list{ display: flex; flex-wrap: wrap; padding: 0; }
.staffcast-list .list-item{ width: 25%; margin-bottom: 2em; letter-spacing: .05em; position: relative; }
.staffcast-list.staff .list-item:nth-child(even){ width: 40%; }
.staffcast-list.staff .list-item:nth-child(odd){ width: 60%; }
.staffcast-list .list-item.cl2{ width: 66.66%; }
.staffcast-list .list-item.cl3{ width: 100%; }
.staffcast-list .list-item .pos{ display: block; font-size: 1.5em; margin: 0; position: relative; }
.staffcast-list .list-item .pos.tt{ }
.staffcast-list .list-item .pos.tt > span{ letter-spacing: -0.05em; font-size: .8em;}
.staffcast-list .list-item .name{ display: block; font-size: 1.7em; margin: 0;}
.staffcast-list .list-item .exname{ font-size: 1em; margin-bottom: 0; }

/* character */
.cont-top-character{ margin-bottom: 8em; }
.cont-top-character > .inner{ padding: 0; }
.cont-top-character .sub-pagetitle{  width: calc(1245/3000*100vw); margin-left: 3em; }
.top-content-container.top-character-container{ width: 100%; margin: 0 auto; }

.character-container{ }
.cont-character-navi{ width: 100%; position: relative; margin: 0; }
.character-navi{ width: 100%; position: relative; margin: 0; }
.character-navi ul{ width: 100%; /*display: flex; flex-wrap: nowrap; justify-content: center;*/ position: relative; margin: 0; padding:0 0 0 5em; list-style-type: none; }
.character-navi ul li{ display: block; margin: 0; padding: 1.5em 4.0em ; position: relative; }
.character-navi ul li.n1 a{width: calc(463/3000*100vw *.6);}
.character-navi ul li.n2 a{width: calc(696/3000*100vw *.6);}
.character-navi ul li.n3 a{width: calc(831/3000*100vw *.6);}
.character-navi ul li.n4 a{width: calc(800/3000*100vw *.6);}
.character-navi ul li a{ display: inline-block; text-decoration: none; transition: all .1s ease 0s;}
.character-navi ul li a:hover{ transform: scale(1.05,1.05); }

.character-navi-cursor{ display: block; position: absolute; width: 40%; top:99vw; left:30%; z-index: 5; display: none; }
.character-navi-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.character-navi-cursor ul li{ display: block; width:calc(163/3000*100vw); height: calc(148/3000*100vw); position: relative; cursor: pointer; }
.character-navi-cursor ul li a{ text-decoration: none; }
.character-navi-cursor ul li span{ display: block; width:100%; height: 100%; background: url("../images/common/cursor.png") no-repeat center center; background-size: 100%; transform-origin: center center; }
.character-navi-cursor ul li span:hover{ transform: scale(1.1,1.1); text-decoration: none; }
.character-navi-cursor ul li.right span{ transform: scale(-1,1); }
.character-navi-cursor ul li.right span:hover{ transform: scale(-1.1,1.1);}
.character-navi-cursor ul li.off{ pointer-events: none; opacity: .1; }

.modal-character{ position: absolute; top:0; left:0; pointer-events: auto; visibility: visible; pointer-events: none; }
.modal-character .bg{ content:""; width: 100%; min-height: 100%; background: rgba(0,0,0,.9); position: absolute; top:0; left:0; cursor: pointer; pointer-events: auto; }
.character-data-frame{ width: 100%; padding: 4em 0; position: absolute; top:0; left:0; pointer-events: auto; }
.character-data-frame::after{ content:""; width: 100%; height: 1px; position: absolute; top:32vw; left:0; background:#aa0050; }

.character-cursor{ display: block; position: absolute; width: 90%; top:22vw; left: 5%; z-index: 5; }
.character-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.character-cursor ul li{ display: block; width:calc(109/3000*100vw); height: calc(216/3000*100vw); position: relative; cursor: pointer; }
.character-cursor ul li a{ text-decoration: none; }
.character-cursor ul li span{ display: block; width:100%; height: 100%; background: url("../images/common/modal-cursor.png?v2") no-repeat center center; background-size: 100%; transform-origin: center center; }
.character-cursor ul li span:hover{ transform: scale(1.1,1.1); text-decoration: none; }
.character-cursor ul li.right span{ transform: scale(-1,1); }
.character-cursor ul li.right span:hover{ transform: scale(-1.1,1.1);}
.character-cursor ul li.off{ pointer-events: none; opacity: .1; }
.character-close{ display: block; position: absolute; top:1vw; right: 9vw;  }
.character-close a{ display: block; width:calc(217/3000*100vw); height: calc(217/3000*100vw); position: relative; text-decoration: none; }
.character-close a span{ display: block; width:100%; min-height: 100%; background: url("../images/common/modal-close.png?v2") no-repeat center center; background-size: 100%; transform-origin: center center; position: relative;}
.character-close a span:hover{ transform: scale(1.1,1.1); text-decoration: none; }

.character-data-container{ width:calc( 2400/3000*100vw); min-height: 50vw; margin: 0 auto; position: relative; }

.cont-character-data{ width:100%; display: none; }
.character-data{ position: relative; }

.character-data .chr-img{ position: relative; z-index: 2; width: calc(800/3000*100vw); margin: 0 auto 0 2.5vw; }
.character-data .chr-face{ position: absolute; top: 0; right: 6vw; z-index: 2; width: calc(1100/3000*100vw); }
.character-data .chr-prof{ position: absolute; top: 5vw; left: 25vw; z-index: 3; width: 50vw; padding: 0 1.5em; color:#FFF; text-align: left; }
.character-data .chr-prof .name-j{ font-size: 7.1em; font-weight: normal; line-height: 1; margin-bottom: -.1em; letter-spacing: 0; }
.character-data .chr-prof .name-e{ font-size: 4.3em; font-weight: normal; margin-bottom: .1em; letter-spacing: 0; }
.character-data .chr-prof .label-cv{font-size: 2em; font-weight: normal; margin-bottom: -.1em; letter-spacing: 0; }
.character-data .chr-prof .cv-j{ font-size: 2em; font-weight: normal; margin-bottom: .1em; letter-spacing: .1em; margin-bottom: 0; }
.character-data .chr-prof .cv-e{ font-size: 1.333em; font-weight: normal; margin-bottom: .1em; letter-spacing: .1em; margin-bottom: 3em; }

.character-data .chr-prof .profile{ font-size: 1.6em; letter-spacing: .05em; line-height: 2; filter: drop-shadow(0 0 .2em #000) drop-shadow(0 0 .2em #000) drop-shadow(0 0 .2em #000);}

#CharaStage .character-data .chr-img{ animation: anm-character-change .5s .05s ease-out both running; }
#CharaStage .character-data .chr-face{ animation: anm-character-change .5s .05s ease-out both running; }
#CharaStage .character-data .chr-prof{ animation: anm-character-change .5s 0s ease-out both running; }
@keyframes anm-character-change {
  0% { opacity: 0; transform: scale(1.1,1.1);}
  100% { opacity: 1; transform: scale(1,1);}
}

#Foreground > #CharaStage{ pointer-events: auto; }
#Foreground > #CharaStage.off{ visibility: hidden; pointer-events: none; }


/* radio */
.cont-top-radio{ margin-bottom: 8em; }
.cont-top-radio > .inner{  }
.cont-top-radio .sub-pagetitle{  width: calc(1236/3000*100vw); }


/* SUB-PAGE */
/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{  }
.cont-sub-news .sub-pagetitle{  width: calc(616/3000*100vw); }
.cont-sub-news .sub-subcattitle{ width: calc((3000 - 616)/3000*100vw); }
.sub-content-container.sub-news-container{  width: calc(2000/3000*100vw); margin: 0 auto; }

.cont-news-cursor{ width: 100%; margin: 0 auto; position: relative; }
.news-cursor{ position: relative; }
.news-cursor ul{ display: flex; flex-wrap: nowrap; justify-content: center; margin: 0; padding: 4em 0 4em 0; list-style-type: none; }
.news-cursor ul{justify-content: space-between; }
.news-cursor ul li{ display: block; }
.news-cursor ul li a{ display: block; }
.news-cursor ul li a span{ display: block; width: 5.666em; height: 5.666em; }
.news-cursor ul li#NewsPls a span{ background: url("../images/news/pager-pls.png") no-repeat center center; background-size: contain;}
.news-cursor ul li#NewsHome a span{ background: url("../images/news/pager-home.png") no-repeat center center; background-size: contain;}
.news-cursor ul li#NewsCsrL a span{ background: url("../images/news/pager-csr-l.png") no-repeat center center; background-size: contain;}
.news-cursor ul li#NewsCsrR a span{ background: url("../images/news/pager-csr-r.png") no-repeat center center; background-size: contain;}
.news-cursor ul li.off a{ pointer-events: none; opacity: .3; /*visibility: hidden;*/ }
.news-cursor ul li#NewsPls{ display: none; }

/* onair */
.cont-sub-onair{ }
.cont-sub-onair > .inner{  }
.cont-sub-onair .sub-pagetitle{  width: calc(742/3000*100vw); }
.sub-content-container.sub-onair-container{  width: calc(2400/3000*100vw); margin: 0 auto; }

.onair-list{ margin: 0 auto ; max-width: 55em; }
.onair-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: left; padding: 1.5em; background-color: rgba(0,0,0,.8); border-top:#ff0078 solid 1px; border-radius: 0; }
.onair-list.str{ border-color:#00daff ; }
.onair-list.first{ border-top:none;  }
.onair-list .col-a{ width: 27.5%; }
.onair-list .col-b{ width: 72.5%; }
.onair-list .col-c{ width: 100%; }
.onair-list .col-d{ width: 72.5%; margin-left: 27.5%; }
.onair-list .name{ font-size: 1.3em; font-weight: bold; margin-bottom: 0; letter-spacing: .1em; display: inline-block; color: #ff0078;}
.onair-list.str .name{ color:#00daff ; }
.onair-list .schd{ font-size: 1.3em; font-weight: bold; margin-bottom: 0; letter-spacing: .1em; }
.onair-list .time{ font-size: 1.3em; font-weight: bold; margin-bottom: 0; letter-spacing: .1em; }
.onair-list .extr{ font-size: .9em; font-weight: bold; margin: .3em 0 0.1em 0; letter-spacing: .1em;}
a.onair-list { text-decoration: none; color: #000; pointer-events: all; }
a.onair-list:hover{ color: #000; background-color: #fff100; }

.onair-list-il{ max-width: 55em; margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.onair-list-il > a{ width: 32%; margin: 0.5%; display: block; color: #ff0078; padding: .75em .25em; background-color: #000; border:none; border-radius: 0; text-decoration: none; font-weight: 600; }
.onair-list-il > a.cs{ pointer-events: none; }
.onair-list-il > a:hover{ background-color: #ff0078; color: #000;}

/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{  }
.cont-sub-story .sub-pagetitle{  width: calc(717/3000*100vw); }
.sub-content-container.sub-story-container{  width: calc(2400/3000*100vw); margin: 0 auto; }

.sub-story-container{ padding: 0 3.5em; }
.cont-story-navi{ width: 90%; margin: 0 auto 1.5em auto; }
.story-navi{ width: 100%; margin: 0 auto;  padding: .25em; border-radius: 0; }
.story-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; }
.story-navi ul li{ width: calc(1/12*100%); display: block; margin: 0; padding: .25em 0; text-align: center; }
.story-navi ul li.spc-sp{ display: none; }
.story-navi ul li a{ display: block; width: 100%; padding: 1em .25em 1em 0em; background-color: transparent; color: #FFF; transition: all .1s ease 0s; text-decoration: none; position: relative; }
.story-navi ul li a:before{ content:""; width: 100%; min-height: 100%; position: absolute; top:0; right:0; background: url("../images/story-navi-bg.png") no-repeat center center; background-size: contain; }

.story-navi ul li a > span{ font-size: 1.4em; letter-spacing: .01em; font-weight: normal; font-style: normal; position: relative; }
.story-navi ul li a:hover{ transform: scale(1.05,1.05);  }
.story-navi ul li.crt a{ pointer-events: none; color: #ff0078; }
.story-navi ul li.crt a:before{ background-image: url("../images/story-navi-bg-on.png"); }
.story-navi ul li.cs a{ pointer-events: none; color: #999; }
.story-navi ul li.cs a:before{ background-image: url("../images/story-navi-bg-cs.png"); }

.cont-story-data{ width:100%; min-height: 30vw; position: relative;  }
.story-bg{ width: 100%; height: 100%; position: absolute; top:0; z-index: 0; display: none;  }
.story-bg{ background: url("../assets/story/1/bg.png") no-repeat center top; background-size: contain; display: block; }

.story-data{ display: none; }
.story-data{ position: relative; pointer-events:none; text-align: center;  }
.story-data .episode-container{ position: relative; padding: 2em 0 2em 0; }

.story-data .ep-title-block{ margin-bottom: 1.5em; display: flex; flex-wrap: wrap; justify-content: center;flex-direction: column; align-items: center; position: relative; z-index: 2; }
.story-data .ep-no{ font-size: 1em; margin-bottom: .75em; position: relative;  }
.story-data .ep-no > span{ font-size: 1.5em; font-weight: normal; color:#ff0078; letter-spacing: .1em; }
.story-data .ep-title{ font-size: 1em; margin-bottom: 0em; position: relative; filter: drop-shadow(0 0 .3em #FFF); }
.story-data .ep-title > span{ font-size: 3.2em; font-weight: normal; color:#fff; letter-spacing: .1em; }

.story-data .ep-title [data-ruby]::before { top: -1.0em; }

.story-data .ep-slider-sceneImage{ width: 95%; max-width: 1280px; margin:0 auto ; position: relative; z-index: 2; border-image: url("../images/top-movie-frame.png") 33% fill / 1.1em repeat ; }
.story-data .ep-slider-sceneImage .sld{ position: relative; padding: 1.1em; text-align: center;  }
.story-data .ep-slider-sceneImage .sld img{ }
.story-data .ep-slider-thumb{ width: 80%; max-width: 1000px; margin: 0 auto 1.5em auto; display: flex; flex-wrap: wrap; flex-direction: row; align-content: space-between; position: relative; z-index: 2; }
.story-data .ep-slider-thumb > div{ width: calc(1/6*100%); padding: 0; transform-origin: center center; pointer-events: all; position: relative; }
.story-data .ep-slider-thumb > div .th{ padding: .25em; display: block; line-height: 1; position: relative;}
.story-data .ep-slider-thumb > div .th img{ position: relative; border: #fff solid 1px;}
.story-data .ep-slider-thumb > div .th:hover{ transform: scale(1.1,1.1); cursor: pointer; }

.story-data .ep-text{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-text p{ font-size: 1.8em; font-weight: normal; letter-spacing: .05em; line-height: 1.7; color:#fff;filter: drop-shadow(0 0 .3em #000);}
.story-data .ep-text p [data-ruby]::before { top: -1.3em; transform: scale(0.45,0.5); width: 222%;  }
.story-data .ep-staff{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-staff p{ color:#AAA; font-size: 1em; line-height: 1.8; letter-spacing: .1em; display: inline; }

.story-data .ep-trailer{ max-width: 30em; margin:0 auto; position: relative; z-index: 2; pointer-events: all; }
.story-data .ep-trailer .ttl{ text-align: center; font-size: 1.2em; letter-spacing: .1em; font-weight: bold; margin-bottom: .5em; color: #ff0078; }
.story-data .ep-trailer .th{ text-align: center; }
.story-data .ep-trailer .th a{ display: inline-block; line-height: 1; padding: 1px; background-color: #ff0078;}
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }

/* bddvd */
.cont-sub-bddvd{ }
.cont-sub-bddvd > .inner{  }
.cont-sub-bddvd .sub-pagetitle{  width: calc(1400/3000*100vw); }
.sub-content-container.sub-bddvd-container{  width: calc(2400/3000*100vw); margin: 0 auto; }

/* .bd-data{ display: none;}
.bd-data.crt{ display: block; animation: fadeIn 1.0s 0s ease-out both; }  */

.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-x4x3{ width: 75%; 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-x3x2{ width: calc((100% - (0.5em * 2)) / 3 * 2); margin-right: .5em; }
.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%; font-size: 0.9em; margin-bottom: .5em; color: #ff0078; background-color: rgba(0,0,0,.5); padding: .2em .4em; }
.bnf-list .shop::before{ content:""; }
.bnf-list .shop::after{ content:""; }
.bnf-list .thumb{ padding:0; 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;  }
.bnf-list .cond{ font-size: 0.777em; margin-bottom: .3em; border:#00daff solid 1px; display: inline-block; padding: .1em .2em; color: #00daff; }
.bnf-list .start{ font-size: 0.666em;  }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; text-align: center;  }

.bnf-list .thumb{ padding:0 1.5em;  }

/* music */
.cont-sub-music{ }
.cont-sub-music > .inner{  }
.cont-sub-music .sub-pagetitle{  width: calc(709/3000*100vw); }
.sub-content-container.sub-music-container{  width: calc(2400/3000*100vw); margin: 0 auto; }

/* movie */
.cont-sub-movie{ }
.cont-sub-movie > .inner{  }
.cont-sub-movie .sub-pagetitle{  width: calc(707/3000*100vw); }
.sub-content-container.sub-movie-container{ width: calc(2400/3000*100vw); margin: 0 auto; }
.movie-tiles{ }
.movie-tiles > div{ width: 50%; padding: 1.5em; }
.movie-tiles > div a{ display: block; filter: drop-shadow(0 0 .2em rgba(0,0,0,.9)); }

/* special */
.cont-sub-special{ }
.cont-sub-special > .inner{  }
.cont-sub-special .sub-pagetitle{  width: calc(883/3000*100vw); }
.sub-content-container.sub-special-container{ width: calc(2400/3000*100vw); margin: 0 auto; }
.special-tiles{ }
.special-tiles > div{ width: 50%; padding: 1.5em; }
.special-tiles > div a{ display: block; filter: drop-shadow(0 0 .2em rgba(0,0,0,.9)); }


/* goods */
.cont-sub-goods{ }
.cont-sub-goods > .inner{  }
.cont-sub-goods .sub-pagetitle{  width: calc(789/3000*100vw); }
.cont-sub-goods .sub-subcattitle{ width: calc((3000 - 789)/3000*100vw - 7em); }
.sub-content-container.sub-goods-container{  width: calc(2400/3000*100vw); margin: 0 auto; }

.books-list{ display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 auto 1em auto; }
.books-list > div{ width: calc( (1 / 5 * (100% + 2em)) - 2em ); margin-bottom: 2em; margin-right: 2em; }
.books-list > div:nth-of-type(5n){ margin-right: 0;}
.books-list > div p{ font-size: 1em; margin-bottom: 0; letter-spacing: .05em; text-align: left; }
.books-list > div .thm{ margin-bottom: .25em; }
.books-list > div .cap{ margin-bottom: 0; text-align: left; }


.cont-sub-comics{ }
.cont-sub-comics > .inner{  }
.sub-content-container.sub-comics-container{  }
.comics-tiles{ }
.comics-tiles > div{ width: 20%; padding: .75em; }
.comics-tiles > div{ filter: drop-shadow(.5em .5em 0 rgba(0,0,0,.1)); }
.comics-text{ text-align: center; letter-spacing: .05em; }
.comics-banner-original{ display: inline-block; width: calc(800/3000*100vw); margin: 0 0 2em 0; }


.cont-sub-goods .cont-tiles{ margin: 0 auto;  }

.goods-list{ display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; align-items: stretch;  }
.goods-list .goods-data{ width: 24%; margin: 0.5%; ; padding: .5em; background-color: rgba(255,255,255,.05); position: relative; overflow: hidden; }

.goods-list .goods-data-img{ width: 100%; height: 18vw; padding: 0 0 .5em 0; display: table-cell; text-align: center; vertical-align: middle; }
.goods-list .goods-data-name{ padding: .5em 1em; font-size: .8em; color: #000; background-color: #00daff; font-weight: bold; }

.goods-list .goods-data-detail{ padding: .5em 0 .5em 0; margin-bottom: 0; padding-bottom: 0; font-size: .8em;}
.goods-list .goods-data-data{ padding: .5em 0 .5em 0; padding-bottom: 0; font-size: .8em; /*color: #1ea728;*/ }
.goods-list .goods-data-table{ border-collapse:separate; border-spacing: 2px; }
.goods-list .goods-data-table th{ color: #999; background-color: rgba(0,0,0,0.05); font-weight: 500; font-size: .8em; padding: 0 .2em; }
.goods-list .goods-data-table td{ padding: 0 .2em; font-size: .8em; }
.goods-list .goods-data-link{ padding: 0; font-size: .8em; margin-bottom: 0; }

/* special */

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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* 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) {

/* background */
#Background .header-bg{ background-image: url("../images/common/header-bg-sp.png") ;  }

/* foreground */


/* header */
.part-header{ width: 100%; height: 100%; position: fixed; top:0; pointer-events: none; overflow: hidden; transition: all .2s ease 0s; }
.top-page .part-header{ position: fixed; top:0; }
.part-header:before{ content:""; width: 100%; height: 180vw; background-color: #FFF; position: absolute; top:-20vw; left:0; transform: skewY(-6.36deg) translateY(-120vh);transition: all .5s ease 0s; }

.cont-global-navi{ position: relative; visibility: hidden; transform: translateY(-100vh); transition: all .5s ease 0s; }
.cont-global-navi:before{ content:""; width: 100%; height: 1px; background: linear-gradient(45deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 1) 100%); position: absolute; top:107vw; right:0; transform: skewY(-6.36deg) ;t z-index: 1; }
.global-logo{ width: 70vw; position: absolute; top:119vw; left: 15vw; margin: 0; padding-top:0; }

.global-navi{ margin: 0; position: relative; top:inherit; right: inherit; left:inherit; z-index: 2; }
.global-navi > ul{ display: block; list-style-type: none; padding: 2em 0 0 2em; margin: 0; text-align: left; }
.global-navi > ul > li{ display: block; padding: 0 ; margin: 0 0 1.25em 0 ; line-height: 1; }
.global-navi > ul > li a{ color: #000; display: inline; position: relative; text-decoration: none; pointer-events: all;  }
.top-page .global-navi > ul > li a{ color: #000; filter: none;}
.global-navi > ul > li a > span{ position: relative; font-size: 2.3em;  }
.top-page .global-navi > ul > li a:hover{ color: #8f104c; }
.top-page .global-navi > ul > li.cs a{ color: #CCC; }

.global-season{ top:37em; right: .5em; width: 12em; z-index: 2; }
.global-season > ul > li{ margin: .25em ; }
.global-season > ul > li a:hover{ transform: scale(1); }

.cont-sp-btn{ width: calc( 120/1000*100vw); height: calc( 110/1000*100vw); display: block; position: absolute; top:0; right:0; pointer-events: none; }
.cont-sp-btn a{ display: block; width: 100%; min-height: 100%; position: relative; text-decoration: none; line-height: 1; }
.cont-sp-btn .sp-navi-open{ pointer-events: all; background: url("../images/navi/sp-open-w.png") no-repeat center center; background-size: contain; }
.top-page.main-vis-nav .sp-navi-open{ background-image: url("../images/navi/sp-open-w.png"); }
.main-vis-nav .sp-navi-open{ background-image: url("../images/navi/sp-open.png"); }
.cont-sp-btn .sp-navi-close{ pointer-events: all; background: url("../images/navi/sp-close.png") no-repeat center center; background-size: contain; display: none; }

.part-header.on{ pointer-events: auto; background-color: rgba(0,0,0,.5); }
.part-header.on:before{ transform: skewY(-6.36deg) translateY(0); }
.part-header.on .cont-global-navi{ visibility: visible; transform: translateY(0); }
.part-header.on .cont-sp-btn .sp-navi-open{ display: none; }
.part-header.on .cont-sp-btn .sp-navi-close{ display: block; }


/* body */
.part-body{  }
.cont-upper{ position: relative; }
.cont-middle{ position: relative; }

.cont-top-content{ width: 100%; margin: 0 auto; padding-top: 0; }
.cont-top-content > .inner{ padding: 0 1em;}
.cont-sub-content{ width: 100%; margin: 0 auto; padding-top: 0; }
.cont-sub-content > .inner{ padding: 0 1em;}

.sub-pagetitle{ font-size: 1em; margin: 0 auto 3em 0; position: relative;}
.sub-pagetitle > span{ }

.cont-subcatnavi{ width: 100%; font-size: 1em; margin: 0 0 1em 0; padding: 0 0 .6em 1em; display: block; position: relative; top:inherit; right:inherit; }
.cont-subcatnavi nav{}
.cont-subcatnavi nav ul{ display: flex; list-style-type: none; padding: 0; margin: 0; }
.cont-subcatnavi nav ul li{ padding: .5em ; font-size: 1.4em;  }

.sub-subcattitle{ font-size: 1em; margin: 0 0 2em 0; padding: 0 0 .3em 1em; display: block; position: relative; top:inherit; right:inherit; }

.sub-content-container{  }
.sub-cont-subtitle{ padding: 1em 1em 2.0em 1em; margin: 0 auto 2em auto; }
.sub-cont-subtitle:before{ width: calc(100% - 2em); bottom:1.5em; }

.sub-logo{ display: block; width: 38vw; margin: 0 0 2em .5em; padding-top:.5em; z-index: 2; position: relative; }


/* footer */
.part-footer{  }
.cont-global-footer{ margin: 0 auto; padding:calc(100/1000*100vw*.7) 0 0 0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 128/30 * 1em *.7 ); height: calc( 128/30 * 1em *.7 ); position: fixed;  bottom:1.5em;  right: 1em ; z-index: 10; overflow: hidden; }
.footer-banner{ width: 85%; margin: 0 auto; padding: 2em 0; }
.footer-banner > div{ padding: 0 .5em; }

.footer-season{ padding: 2em 0;  }
.footer-season > div{ width: 12em; }

/* content */
.content-entry:before{ content:""; width: 1px; height: calc(100% - 3em - 1.5em); background-color:#aa0050; position: absolute; top:3em; left:-2.0em;  }
.content-entry .entry-head{ padding: 0 0; margin-bottom: 0; position: relative; }
.content-entry .entry-body{ color: #DDD; font-size: 1.2em; letter-spacing: .05em; line-height: 1.5; padding: 1.5em 1em; }

.content-entry .entry-date{ top:.2em; left:-3.6em; }
.content-entry .entry-date > div > span{ font-size: 1.2em; }
.content-entry .entry-title{ padding: .7em;  }
.content-entry .entry-title span{ font-size: 1.5em; }




/* TOP-PAGE */
/* main */
/* #Background .header-bg.top{ background-image: url("../assets/top/bg-sp.png") ;  } */
.cont-top-visual{ }
.cont-top-visual .kv-container{ }

.kv-container .oa{ width: 43vw; top:1vw; left: 43vw;  }
.kv-container .catch{ width: 14vw; top:15vw; right: 29vw;  }
.kv-container .logo{ display: block; width: 38vw; margin: 0 0 2em .5em; padding-top:.5em; }

/* news twitter */
.cont-top-news-twitter{ margin: 0 auto 4em auto ; flex-wrap: wrap; justify-content: space-around; padding: 4em 0; }
.cont-top-news,
.cont-top-twitter{ width: 95%; position: relative; }
.cont-top-news{ margin-bottom: 4em; }

.top-news-twitter-title{ font-size: 1.433em; font-family: 'jaf-facitweb', sans-serif; margin-bottom: 0; line-height: 1; }

.top-news-twitter-title a,.top-news-twitter-title a:visited,.top-news-twitter-title a:active {color: #FFF;}
.top-news-twitter-title a:hover {color: #aa0050; }

/* news */
.cont-top-news{  }
.cont-top-news .sub-pagetitle{  width: calc(439/3000*100vw*1.75); margin-bottom: 1em; }
.news-container{ position: relative; background-size: 60%; min-height: inherit; }
.news-container dl{ font-size: 1.0em; margin: 0; padding: 1.5em 0 0 1.5em; }
.news-container dl dt{ display: inline-block; margin: 0 ; padding: 0; line-height: 1; font-size: 1em; font-family: 'jaf-facitweb', sans-serif; }
.news-container dl dt span:before{ content:"."; }
.news-container dl dd{ display: block; font-size: 1.2em; line-height: 1.4;  }
.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; }

/* twitter */
.cont-top-twitter{ }
.cont-top-twitter .sub-pagetitle{  width: calc(114/3000*100vw*1.75); }
.twitter-widget-container{ width: 100%; position: relative; background-size: 60%; min-height: inherit;  }
.twitter-widget-container iframe{ min-height: 100%; }
.twitter-timeline-container{ }
.x-banner{ padding: 1.0em; }

/* introduction */
.cont-top-intro{ margin-bottom: 8em; }
.cont-top-intro > .inner{ }
.cont-top-intro .sub-pagetitle{  width: calc(1588/3000*100vw*1.5); }
.top-content-container.top-intro-container{ width: 100%; margin: 0 auto; }
.intro-container{ line-height: 2; font-size: 1.466em; letter-spacing: .1em; }


/* movie */
.cont-top-movie{ margin-bottom: 8em; }
.cont-top-movie .movie-player-frame{ width: 95vw; }
.cont-top-movie .movie-player-frame > div{  }

.cont-top-movie .movie-navi{ width: 95vw; position: relative; top:inherit; right: inherit; flex-direction: row; }
.cont-top-movie .movie-navi .th{ width: 30%; margin:1em;}
.cont-top-movie .movie-navi .th a{  }

.movie-navi-cursor{ position: absolute; width: 94%; bottom:-4vw; left: 3%;  pointer-events: none; display: none; }
.movie-navi-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.movie-navi-cursor ul li{ display: block; width:calc(296/3000*100vw); height: calc(296/3000*100vw); position: relative; pointer-events: all; cursor: pointer; background: url(../images/movie-cursor.png) no-repeat center center; background-size: 100%; transform-origin: center center; }
.movie-navi-cursor ul li:hover{ transform: scale(1.1); }
.movie-navi-cursor ul li.right{ transform: scale(-1,1); }
.movie-navi-cursor ul li.off{ pointer-events: none; opacity: .3; }



/* staffcast */
.cont-top-staffcast{ margin-bottom: 8em; }
.cont-top-staffcast > .inner{  }
.cont-top-staffcast .sub-pagetitle{  width: calc(1378/3000*100vw*1.5); }
.top-content-container.top-staffcast-container{ width: 100%; margin: 0 auto; }

.staffcast-container{ padding: 7em 1.5em 1.5em 1.5em; margin-bottom: 2em; }
.staffcast-label{ position: absolute; top:1.5em; left:1.5em; }
.staffcast-label > span{ font-size: 2.666em; font-family: 'jaf-facitweb', sans-serif; }

.staffcast-list .list-item{ width: 100%; margin-bottom: 2em;  }
.staffcast-list.staff .list-item:nth-child(even){ width: 100%; }
.staffcast-list.staff .list-item:nth-child(odd){ width: 100%; }

.staffcast-list .list-item .pos{ font-size: 1.5em; }
.staffcast-list .list-item .name{ font-size: 1.7em; }


/* character */
.cont-top-character{ margin-bottom: 8em; }
.cont-top-character > .inner{ padding: 0; }
.cont-top-character .sub-pagetitle{ width: calc(1245/3000*100vw*1.5); margin-left: 1em; }
.top-content-container.top-character-container{ width: 100%; margin: 0 auto; }

.character-navi ul{ padding: 0; }
.character-navi ul li{ padding: 1.5em; }
.character-navi ul li.n1 a{width: calc(463/3000*100vw*1.5);}
.character-navi ul li.n2 a{width: calc(696/3000*100vw*1.5);}
.character-navi ul li.n3 a{width: calc(831/3000*100vw*1.5);}
.character-navi ul li.n4 a{width: calc(800/3000*100vw*1.5);}
.character-navi-cursor{ display: block; }
.character-navi-cursor ul li{ width:calc(163/3000*100vw*2); height: calc(148/3000*100vw*2);  }

.character-data-frame{ padding: 4em 0; }
.character-data-frame::after{ top:61vw; }

.character-cursor{ width: 98%; top:42vw; left:1%; }
.character-cursor ul li{ width:calc(109/3000*100vw*2); height: calc(216/3000*100vw*2); }
.character-close{ display: block; position: absolute; top:1vw; right: 1vw;  }
.character-close a{ width:calc(217/3000*100vw*2); height: calc(217/3000*100vw*2); }

.character-data-container{ width:100%; min-height: 100vw; margin: 0 auto; position: relative; }

.cont-character-data{ width:100%; display: none; }
.character-data{ position: relative; }

.character-data .chr-img{ position: relative; z-index: 2; width: calc(800/3000*100vw*2); margin: 0; }
.character-data .chr-face{ position: absolute; top: 50vw; right: 6vw; z-index: 2; width: calc(1100/3000*100vw*1.5); }
.character-data .chr-prof{ position: absolute; top: 5vw; left: 42vw; z-index: 3; width: 58vw; padding: 0 1.5em; color:#FFF; text-align: left; }
.character-data .chr-prof .name-j{ font-size: 5em; font-weight: normal; line-height: 1; margin-bottom: -.1em; letter-spacing: 0; }
.character-data .chr-prof .name-e{ font-size: 3em; font-weight: normal; margin-bottom: .1em; letter-spacing: 0; }
.character-data .chr-prof .label-cv{font-size: 1.6em; font-weight: normal; margin-bottom: -.1em; letter-spacing: 0; }
.character-data .chr-prof .cv-j{ font-size: 1.6em; font-weight: normal; margin-bottom: .1em; letter-spacing: .1em; margin-bottom: 0; }
.character-data .chr-prof .cv-e{ font-size: 1.2em; font-weight: normal; margin-bottom: .1em; letter-spacing: .1em; margin-bottom: 3em; }

.character-data .chr-prof .profile{ position: absolute; top:100vw; left:-30vw; width: 90vw; font-size: 1.433em; letter-spacing: .05em; line-height: 2;}

#CharaStage .character-data .chr-img{ animation: anm-character-change .5s .05s ease-out both running; }
#CharaStage .character-data .chr-face{ animation: anm-character-change .5s .05s ease-out both running; }
#CharaStage .character-data .chr-prof{ animation: anm-character-change .5s 0s ease-out both running; }
@keyframes anm-character-change {
  0% { opacity: 0; transform: scale(1.1,1.1);}
  100% { opacity: 1; transform: scale(1,1);}
}

#Foreground > #CharaStage{ pointer-events: auto; }
#Foreground > #CharaStage.off{ visibility: hidden; pointer-events: none; }


/* radio */
.cont-top-radio{ margin-bottom: 8em; }
.cont-top-radio > .inner{  }
.cont-top-radio .sub-pagetitle{  width: calc(1236/3000*100vw*1.5); }


/* SUB-PAGE */
/* news */
.cont-sub-news .sub-pagetitle{  width: calc(616/3000*100vw*1.5); }
.cont-sub-news .sub-subcattitle{ }
.sub-content-container.sub-news-container{  width: 90%; margin: 0 0 0 auto; }
.cont-news-cursor{ width: 100%; margin: 0 0 0 auto; position: relative; }
.news-cursor ul{ padding: 2em 0 4em 0;  }
.news-cursor ul li a span{ width:4em; height: 4em; }

/* onair */
.cont-sub-onair{ }
.cont-sub-onair > .inner{  }
.cont-sub-onair .sub-pagetitle{  width: calc(742/3000*100vw*1.5); }
.sub-content-container.sub-onair-container{  width: 95%; margin: 0 auto; }

.onair-list{ margin: 0 auto ; max-width: inherit; }
.onair-list.first{  }
.onair-list .col-a{ width: 100%; }
.onair-list .col-b{ width: 100%; }
.onair-list .col-c{ width: 100%; }
.onair-list .col-d{ width: 100%; margin-left: 0; }

.onair-list-il > a{ width: 48%; margin: 0.5%; }

/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{  }
.cont-sub-story .sub-pagetitle{  width: calc(717/3000*100vw*1.5); }
.sub-content-container.sub-story-container{  width: 95%; margin: 0 auto; }

.sub-story-container{ padding: 0 0; }
.cont-story-navi{ width: 90%; margin: 0 auto 1.5em auto; }
.story-navi ul li{ width: calc(1/6*100%); }
.story-navi ul li.spc-sp{ display: block; }
.story-navi ul li a{ display: block; width: 100%; padding: 1em .25em 1em 0em; background-color: transparent; color: #FFF; transition: all .1s ease 0s; text-decoration: none; position: relative; }
.story-navi ul li a:before{ content:""; width: 100%; min-height: 100%; position: absolute; top:0; right:0; background: url("../images/story-navi-bg.png") no-repeat center center; background-size: contain; }

.cont-story-data{ width:100%; min-height: 30vw; position: relative;  }
.story-bg{ width: 100%; height: 100%; position: absolute; top:0; z-index: 0; display: none;  }
.story-bg{ background: url("../assets/story/1/bg.png") no-repeat center 5vw; background-size: 150%; display: block; }



.story-data .ep-title-block{ margin-bottom: 1.5em; display: flex; flex-wrap: wrap; justify-content: center;flex-direction: column; align-items: center; position: relative; z-index: 2; }
.story-data .ep-no{ font-size: 1em; margin-bottom: .75em; position: relative;  }
.story-data .ep-no > span{ font-size: 1.5em; font-weight: normal; color:#ff0078; letter-spacing: .1em; }
.story-data .ep-title{ font-size: 1em; margin-bottom: 0em; position: relative; filter: drop-shadow(0 0 .3em #FFF); }
.story-data .ep-title > span{ font-size: 2.4em; font-weight: normal; color:#fff; letter-spacing: .1em; }

.story-data .ep-slider-sceneImage{ width: 100%; max-width: 1280px; margin:0 auto ; position: relative; z-index: 2; border-image: url("../images/top-movie-frame.png") 33% fill / 1.1em repeat ; }
.story-data .ep-slider-sceneImage .sld{ position: relative; padding: 1.1em; text-align: center;  }
.story-data .ep-slider-sceneImage .sld img{ }
.story-data .ep-slider-thumb{ width: 100%; max-width: 1000px; margin: 0 auto 1.5em auto; display: flex; flex-wrap: wrap; flex-direction: row; align-content: space-between; position: relative; z-index: 2; }
.story-data .ep-slider-thumb > div{ width: calc(1/6*100%); padding: 0; transform-origin: center center; pointer-events: all; position: relative; }
.story-data .ep-slider-thumb > div .th{ padding: .25em; display: block; line-height: 1; position: relative;}
.story-data .ep-slider-thumb > div .th img{ position: relative; border: #fff solid 1px;}
.story-data .ep-slider-thumb > div .th:hover{ transform: scale(1.1,1.1); cursor: pointer; }

.story-data .ep-text{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-text p{ font-size: 1.6em; font-weight: normal; letter-spacing: .05em; line-height: 1.7; color:#fff;filter: drop-shadow(0 0 .3em #000);}
.story-data .ep-staff{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-staff p{ color:#AAA; font-size: 1em; line-height: 1.8; letter-spacing: .1em; display: inline; }

.story-data .ep-trailer{ max-width: 30em; margin:0 auto; position: relative; z-index: 2; pointer-events: all; }
.story-data .ep-trailer .ttl{ text-align: center; font-size: 1.2em; letter-spacing: .1em; font-weight: bold; margin-bottom: .5em; color: #a3003e; }
.story-data .ep-trailer .th{ text-align: center; }
.story-data .ep-trailer .th a{ display: inline-block; line-height: 1; padding: 1px; background-color: #a3003e;}
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }

/* bddvd */
.cont-sub-bddvd{ }
.cont-sub-bddvd > .inner{  }
.cont-sub-bddvd .sub-pagetitle{  width: calc(1400/3000*100vw*1.5); }
.sub-content-container.sub-bddvd-container{  width: 95%; margin: 0 auto; }

.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-x4x3{ 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,
.bnf-list > .item-x4x3 .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,
.bnf-list > .item-x4x3 .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,
.bnf-list > .item-x4x3 .item-col-x4{ width: 100%; margin-right: 0 }

.bnf-list .item-col-x3x2{ width: 100%; margin-right: 0 }

.bnf-list .thumb{ padding:0 5.5em;  }


/* music */
.cont-sub-music{ }
.cont-sub-music > .inner{  }
.cont-sub-music .sub-pagetitle{  width: calc(709/3000*100vw*1.5); }
.sub-content-container.sub-music-container{  width: 95%; margin: 0 auto; }

/* movie */
.cont-sub-movie{ }
.cont-sub-movie > .inner{  }
.cont-sub-movie .sub-pagetitle{  width: calc(707/3000*100vw*1.5); }
.sub-content-container.sub-movie-container{  width: 95%; margin: 0 auto; }
.movie-tiles > div{ width: 80%; padding: .75em; }

/* special */
.cont-sub-special{ }
.cont-sub-special > .inner{  }
.cont-sub-special .sub-pagetitle{  width: calc(883/3000*100vw*1.5); }
.sub-content-container.sub-special-container{  width: 95%; margin: 0 auto; }
.special-tiles > div{ width: 80%; padding: .75em; }

/* goods */
.cont-sub-goods .sub-pagetitle{  width: calc(789/3000*100vw*1.5); }
.cont-sub-goods .sub-subcattitle{ width: inherit; }
.sub-content-container.sub-goods-container{  width: 95%; margin: 0 auto; }

.books-list > div{ width: calc( (1 / 3 * (100% + 2em)) - 2em ); margin-bottom: 2em; margin-right: 2em; }
.books-list > div:nth-of-type(5n){ margin-right: 2em;}
.books-list > div:nth-of-type(3n){ margin-right: 0;}
.books-list > div p{ font-size: 1em; margin-bottom: 0; letter-spacing: .05em; text-align: center; }
.books-list > div .thm{ margin-bottom: .25em; }

.goods-list .goods-data{ width: 100%; margin: 0.5%; ; padding: .5em; background-color: rgba(255,255,255,.05); position: relative; overflow: hidden; }
.goods-list .goods-data-img{ width: 100%; height: inherit; padding: 0 0 .5em 0; display: table-cell; text-align: center; vertical-align: middle; }
.goods-list .goods-data-name{ padding: .5em 1em; font-size: 1em; }
.goods-list .goods-data-detail{ font-size: 1em;}
.goods-list .goods-data-data{ font-size: 1em;  }


/* special */
.special-tiles > div{ width: 80%; padding: .75em; }

}
/* 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) {
}