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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #00007a; background:#fff 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; }

/* lazyestload */
img { transition: filter 0.3s;}
img.lazyestload { width: 100%; filter: blur(8px);}

/* 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 .opening{ }
#Foreground .wflash{ }

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

/* body */
.part-body{ position: relative; display: block; margin: 0; border-top:#00007a solid calc(50/3000*100vw); border-left:#00007a solid calc(50/3000*100vw); }
.init-border .part-body{ animation: page-border-anm 10s 0s ease-in-out both running; }
@keyframes page-border-anm {
  0% {border-color: #00007a;}
  3% {border-color: #000;}
  10% {border-color: #a51014;}
  100% {border-color: #a51014;}
}
.top-page .part-body{ border-top:none; }
.part-body-side{ position: absolute; width:calc(580/3000*100vw); top:0;  padding-top:12vw; pointer-events: none; z-index: 50; }
.top-page .part-body-side{ padding-top:12vw; }
.part-body-main{ position: relative; width: 100%; }

.cont-upper{ position: relative; }
.cont-middle{ position: relative; }
.top-page .cont-middle{ position: absolute; top:0; }
.cont-bottom{ position: relative; }

.cont-global-navi{ padding: 0;  margin:0 0 0 auto; }
.sub-page .cont-global-navi{  }
.global-logo{ display: none; }
.global-navi{ width:100%; margin: 0 auto 0 -1px ; 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 ; line-height: 1; position: relative;}
.global-navi > ul > li a{ padding: .4em 0 .4em 2.6em; display: block; font-family: 'Cormorant Infant', serif; font-size: 1.333em; font-weight: 600; line-height: 1; letter-spacing: .01em; color: #00007a; text-align: left; position: relative; transform-origin: left center; pointer-events: all; transition: all .1s ease-out 0s; }
.global-navi > ul > li a:hover{ text-decoration: none; transform: scale(1.1,1.1); }

.global-navi > ul > li.cs a{ color: #ccc; pointer-events: none;  }
.global-navi > ul > li.crt a{ color: #ef0485; pointer-events: none; background: url("../images/navi/marker.png") no-repeat left center; background-size: auto 100%; }
.init-border .global-navi > ul > li.crt a{  background-image: url("../images/navi/marker2.png"); transition: all .5s ease-out .5s;  }

.global-navi > ul > li.hdn a{ display: none;  }

.top-page .global-navi{  filter: drop-shadow(0 0 .1em #FFF) drop-shadow(0 0 .2em #FFF) ;}


.cont-season-navi{ width: 100%; position: relative;  z-index: 5; }
.season-navi{ width: 50%; padding-top: .9em; margin: 0 auto; }
.season-navi ul{ width: 100%; display: flex; justify-content: center; list-style-type: none; margin: 0; padding: 0; }
.season-navi ul li{ width: 48%; display: block; padding: 0; margin: 0 1%; }
.season-navi ul li a{ display: block; pointer-events: auto; text-align: center; color: #00007a; border:#00007a solid 1px; border-radius: .5em 0 .5em 0; }
.season-navi ul li a span{ font-family: 'Cormorant Infant', serif; font-size: 1.6em; font-weight: 600; }

.season-navi ul li a:hover{ color: #fff; background-color:#00007a; text-decoration: none; }
.season-navi ul li.crt a{ color: #fff; background-color:#00007a; border-color:#00007a; pointer-events: none; }


.cont-top-content > .inner{ padding: 0; margin: 0 auto;}
.cont-sub-content > .inner{ padding: 5em 0; margin: 0 auto;}

.top-subtitle{ font-size: 1em; margin: 0 auto 1em auto; padding: .2em .4em; text-align: left; z-index: 2; position: relative; border-left:#ef0485 solid 2px; border-bottom:#00007a solid 1px; line-height: 1; }
.top-subtitle > span{ font-size: 1.2em; font-weight: bold; }

.sub-subtitle{ font-size: 1em; width: calc(980/3000*100vw); margin: 0 auto 3em auto; text-align: center; z-index: 2; position: relative; }
.sub-subtitle > span{ display: inline-block; position: relative; font-family: 'Cormorant Infant', serif; font-size: 3.333em; font-weight: 600; line-height: 1; letter-spacing: .01em; color: #00007a; transform: scaleY(1.1); }
.sub-subtitle:after{ content:""; display: block; width: calc(63/3000*100vw); height: calc(70/3000*100vw); background: url("../images/common/subtitle-marker.png") no-repeat top center; background-size: auto 100%; margin: -0.6em auto 0 auto;}

.sub-content-container{ width: calc(2000/3000*100vw); margin: 0 auto; position: relative; }

.sub-logo{ width: calc(460/3000*100vw); position: absolute; top:1.5vw; left: 2.6vw; z-index: 51; }
.sub-oa{ width: calc(190/3000*100vw); position: absolute; top:-2px; right: 6vw; z-index: 51; opacity: 0; }
.init-border .sub-oa{ opacity: 1; transition: all .25s ease-out 1s;  }

.upper-line{ width: 100%; height: 1px; position: absolute; top:0; left:0; background-color: #ef0485; }
.upper-line:before{content:""; display: block; width: 50%; height: 1px; background-color:#dbce00;}

.bottom-line{ width: 100%; height: 1px; position: relative; top:0; left:0; background-color: #a51014; }
@keyframes page-border-anm {
  0% {border-color: #00007a;}
  3% {border-color: #000;}
  10% {border-color: #a51014;}
  100% {border-color: #a51014;}
}; }
.bottom-line:before{content:""; display: block; width: 50%; height: 1px; background-color:#dbce00;}

.bottom-image{ width: 100%; height: 30vw; position: relative; top:0; left:0; overflow: hidden; }
.bottom-image > div{ width: 100%; position: absolute; top:0; left:0;  }


/* footer */
.part-footer{ display: none; }
.cont-global-footer{ margin: 0 auto; padding: 0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 110/3000 * 100vw ); height: calc( 152/3000 * 100vw ); position: relative; z-index: 10; margin: -1px 4.5em 0 auto; }
.footer-pagetop a{ display: block; position: relative; width: 100%; min-height: 100%; background:url("../images/common/pagetop2.png") no-repeat center center; background-size: contain; transform-origin: top center; }
.footer-pagetop a:hover{ transform: scale(1.1); }
/* .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-banner{ padding: 0 ;  margin: -2em 0 0 0; }
.banner-list{ display: flex; justify-content: center; }
.banner-list > div{ margin: .5em .5em; }
.banner-list .bn1{ width: calc( 552/3000 * 100vw ); }
.banner-list .bn2{ width: calc( 552/3000 * 100vw ); }
.banner-list .bn3{ width: calc( 552/3000 * 100vw ); }
.banner-list .bn3b{ width: calc( 552/3000 * 100vw ); }

.cont-footer{ padding: 2em 0; }
.footer-logo{ width: calc( 631/3000 * 100vw );  position: relative; margin: 0 auto 1.5em auto; }
.footer-copyrihgt p{ font-size: .8em; margin-bottom: 0; color: #a51014; }

/* 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(0,0,0,.05); font-weight: normal; text-align: inherit; vertical-align: top; text-align: left; }
.table-a td{ padding:0.5em; background-color:rgba(0,0,0,.025); vertical-align: top; }

.frame-a{ background-color:rgba(255,255,255,.6);}
.frame-b{ border:rgba(255,255,255,.1) solid 1px;}
.frame-w{ background: #FFF; }

.ul-y{ display: inline-block; position: relative; line-height: 1.3; }
.ul-y > span{ z-index: 2; position: relative; padding: 0 .25em; }
.ul-y:before{ z-index: 1; content:""; display: inline-block; width: 100%; height: .5em; position: absolute; bottom:0; background-color: #fff220; }

.ds-y{ filter: drop-shadow(.1em .1em 0 #dbce00); }

.bdr-p{ border:#eb4b94 solid 1px; }


/* 1 */
.cont-entries{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-entry{ padding: 3em; margin-bottom: 3em; background-color: rgba(255,255,255,.3); border-top:#ef0485 solid 1px; border-bottom:#ef0485 solid 1px; }
.content-entry .entry-head{ margin-bottom: 0; position: relative; text-align: center; }
.content-entry .entry-date{ font-size: 1em; margin-bottom: 0; pointer-events: none;  }
.content-entry .entry-date > span{ display: inline-block; padding: .35em; font-size: 1.333em; line-height: 1; letter-spacing: .1em; margin-bottom: 0;  }
.content-entry .entry-title{ padding: 1em 0; margin-bottom: 0; position: relative; }
.content-entry .entry-title > span{ font-weight: bold; font-size: 1.733em; line-height: 1.5; }

.content-entry .entry-body{ padding: 1em 0; font-size: 1.333em; }


.cont-singles{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-single{ padding: 0 2em; color: #91b9ed;  }

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

.modal-data{ display: none; }
.cont-modal{ width: 100%; max-width: 70vw; margin: 0 auto; }

.frame-modal{ background:#fff url("../images/common/background.png") repeat-y center top; background-size: 100%; border-left:#dbce00 solid 1px; border-right:#00007a solid 1px; position: relative; }
.frame-modal .upper-line{ background-color: #00007a; }
.frame-modal .frame-body{ padding: 4em; }


.block-data{ display: none; }
.block-data.crt{ display: inherit; }

/* colorbox customize */
#colorbox{}
#cboxOverlay{ background:rgba(0,0,122,.4) ; /*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; overflow: hidden; }
.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ position: relative; margin: 0 auto; }
.kv-container > div{ position: absolute; top:0; }
.kv-container .kv-bg{ width: 100%; min-height: 100%; background: no-repeat center center; background-size: 150%; opacity: .9;}

/* .kv-container[data_vis="5"] .kv-bg{ background-image: url("../assets/top/s2t1/vis.webp"); opacity: .3; filter: blur(10px); transition: all 2s ease-out 0s; }
.kv-container[data_vis="4"] .kv-bg{ background-image: url("../assets/top/h2/vis.webp"); opacity: .3; filter: blur(10px); transition: all 2s ease-out 0s; }
.kv-container[data_vis="3"] .kv-bg{ background-image: url("../assets/top/h1/vis.webp"); opacity: .5; filter: blur(10px); transition: all 2s ease-out 0s; }
.kv-container[data_vis="2"] .kv-bg{ background-image: url("../assets/top/t2/vis.webp"); opacity: .3; filter: blur(10px); transition: all 2s ease-out 0s; }
.kv-container[data_vis="1"] .kv-bg{ background-image: url("../assets/top/t1/vis.webp"); opacity: .5; filter: blur(10px); transition: all 2s ease-out 0s; } */


.kv-container[data_vis="1"] .kv-bg{ background-image: url("../assets/top/s2t1/vis.webp"); opacity: .3; filter: blur(10px); transition: all 2s ease-out 0s; }
.kv-container[data_vis="2"] .kv-bg{ background-image: url("../assets/top/s2t2/vis.webp"); opacity: .3; filter: blur(10px); transition: all 2s ease-out 0s; }

.kv-container .grp{ position: relative; top:inherit; display: none; width: calc(2200/3000*100vw); margin: 0 0 0 auto; }
.kv-container .grp.on{ display: block; }
.kv-container .grp > div{ position: absolute; top:0; }
.kv-container .grp .vis-grp{ position: relative; width: 100%; margin: 0 auto 0 0; }
.kv-container .grp .vis-grp .bg{ position: relative; }
.kv-container .grp .vis-grp .vis{ position: absolute; top:0; }
.kv-container .catch{ width: calc(194/3000*100vw); top:3vw; right:3vw ; }
.kv-container .catch2{ width: calc(196/3000*100vw); top:5vw; left:35vw ; }
.kv-container .oa{ width: calc(560/3000*100vw); top:41vw; left: 3vw; filter: drop-shadow(0 0 .1em #FFF) drop-shadow(0 0 .2em #FFF); }
.kv-container .logo{ width: calc(560/3000*100vw); top:1.5vw; left: 3.0vw; filter: drop-shadow(0 0 .1em #FFF) drop-shadow(0 0 .3em #FFF); }

.kv-container .catch{ display: none; }

/* .kv-container .movie{ width: calc(560/3000*100vw); top:41vw; left: 3.0vw; } */
.kv-container .banner{ width: calc(620/3000*100vw); top:84vw; left: 26.0vw; }

.kv-container > .vis-switch{ margin: 0; position: absolute; top:84vw; right: 1vw; pointer-events: none; z-index: 2; }
.vis-switch{ display: flex; flex-wrap: wrap; flex-direction: row-reverse; }
.vis-switch > div{ width: 6vw; height: 6vw; margin: 0 .5vw; pointer-events: auto; }
.vis-switch > div a{ display: inline-block; width: 100%; min-height: 100%; border-left:#00007a solid 4px; }
.vis-switch > div.on a{ border-color:#fff220 ; pointer-events: none; }

#Foreground .opening{ position: fixed; overflow: hidden; }
#Foreground .opening .bg{ width: 100%; height: 100vh; position: absolute; top:0; background-color: #FFF; }
#Foreground .opening .op-cont{ width: 100%; height: 100vh; position: relative; display: flex; justify-content: center; align-items: center; }
#Foreground .opening .op-cont .anm-part{ position: relative; width: calc(1297/3000*100vw); height: calc(640/3000*100vw); line-height: 0; background-color: rgba(255,255,0,0); }
#Foreground .opening .op-cont .anm-part .part{ position: absolute; opacity: 0; }
#Foreground .opening .op-cont .anm-part .part.p1{ width: calc(947/3000*100vw); height: calc(195/3000*100vw); top:32%; left:0; }
#Foreground .opening .op-cont .anm-part .part.p2{ width: calc(847/3000*100vw); height: calc(207/3000*100vw); bottom:0; right:0; }
#Foreground .opening .op-cont .anm-part .part.p3{ width: calc(340/3000*100vw); height: calc(455/3000*100vw); top:0; right:5%; transform-origin: left bottom; }
#Foreground .opening .op-cont .anm-part .part.p4{ width: calc(422/3000*100vw); height: calc(99/3000*100vw); top:75%; left:2%; transform-origin: right top; }

/* #Foreground .wflash{ position: fixed; overflow: hidden; }
#Foreground .wflash .bg{ width: 100%; height: 100vh; position: absolute; top:0; background-color: #FFF; pointer-events: all; }
#Foreground .wflash .circle-cont{ width: 100%; height: 100vh; position: relative; display: flex; justify-content: center; align-items: center; }
#Foreground .wflash .c1{ width: 50vw; height: 50vw; display:flex; position: relative; justify-content: center; align-items: center; }

.init #Foreground .wflash .bg{ opacity: 0; }
.init #Foreground .wflash .c1{ transform: scale(0.01); opacity: 0; visibility: hidden; } */

.init #Foreground .opening .bg{ background-color: #00007a; }
.init #Foreground .opening .op-cont .anm-part .p1{ transform: translateX(-15%); }
.init #Foreground .opening .op-cont .anm-part .p2{ transform: translateX(15%); }
.init #Foreground .opening .op-cont .anm-part .p3{ transform: scale(1.2); }
.init #Foreground .opening .op-cont .anm-part .p4{ transform: scale(1.2); }

.s1 #Foreground .opening .bg{ background-color: #a51014; transition: all .5s ease-out 0s; }
.s1 #Foreground .opening .op-cont .anm-part .p1{ opacity: 1; transform: translateX(0); transition: all 1.5s ease-out 0s; }
.s1 #Foreground .opening .op-cont .anm-part .p2{ opacity: 1; transform: translateX(0); transition: all 1.5s ease-out .1s; }
.s1 #Foreground .opening .op-cont .anm-part .p3{ opacity: 1; transform: scale(1); transition: all 1.0s ease-out .4s; }
.s1 #Foreground .opening .op-cont .anm-part .p4{ opacity: 1; transform: scale(1); transition: all 1.0s ease-out .5s; }

.s2 #Foreground .opening .op-cont{ opacity: 0; transform: scale(1.1); transition: all .5s ease-out 0s; }
.s2 #Foreground .opening .bg{ opacity: 0; transition: all .5s ease-out .3s; }

.init .kv-container .grp .vis-grp{ transform: scale(1.5,1.5); }
/* .init .kv-container .catch{ transform: translateY(-20%); } */
.init .kv-container .catch2{ opacity: 0; transform: translateY(-5%); }
.init .kv-container .oa{ transform: translateY(-30%); }

.s2 .kv-container .grp .vis-grp{ transform: scale(1,1); transition: all 1.2s ease-out .1s; }
.s2 .kv-container .catch2{ opacity: 1; transform: translateY(0); transition: all .5s ease-out .4s;}
.s2 .kv-container .oa{transform: translateY(0); transition: all .5s ease-out .4s; }


/* .s2 #Foreground .wflash .c1{ transform: scale(0.1); opacity: 1; visibility: visible; transition: all .8s linear .2s; }

.s2_1 #Foreground .wflash .c1{ transform: scale(4) rotate(65deg); opacity: 0; transition: transform 3.5s ease-in 0s, opacity .5s ease-out 2.5s;}
.tate.s2_1 #Foreground .wflash .c1{ transform: scale(6) rotate(65deg); opacity: 0; transition: transform 3.5s ease-in 0s, opacity .5s ease-out 2.5s;}

.s2_2 #Foreground .wflash .bg{ opacity: 1; transition: all .5s ease-out 0s; }

.s2_5 .kv-container .catch{ display: none; }

.s3 #Foreground .wflash{ opacity: 0; transition: all 1.5s ease-out 0s; }

.s4 #Foreground .wflash{ display: none; }
.s4 .kv-container .catch2{ opacity: 1; transform: translateY(0); transition: all 1.0s ease-out 0s; } */


/* .top-page.init .banner-list .bn3{ display: none;  }
.top-page.init .banner-list .bn3b{ }
.top-page.s2_5 .banner-list .bn3{ display: block;  }
.top-page.s2_5 .banner-list .bn3b{ display: none; } */

.kv-container .grp{ transform: scale(1.1,1.1) ; transform-origin: center center; opacity: 0; }
.kv-container .grp.on{ transform: scale(1,1); opacity: 1; transition: all 1.0s ease .0s; }

/* top-movie */
.kv-container .movie2{ width: calc(660/3000*100vw); top:48.5vw; left: 1.5vw; }
.top-movie-list{  }
.top-movie-list .thm{  padding: .4em .5em; transform-origin: center center; position: relative; }
.top-movie-list .thm > a{ display: inline-block; pointer-events: auto; overflow: hidden; line-height: 1; margin-bottom: 0; }
.top-movie-list .thm > a:hover{ transform: scale(1.025); }
/*
.top-movie-list .thm{ display: none; }
.init .top-movie-list .thm.t1{ display: block; }
.s2_5 .top-movie-list .thm.t1{ display: none; }
.s2_5 .top-movie-list .thm.t2{ display: block; } */

.top-movie-dots{ text-align: center;}
.top-movie-dots ul{ display: block; list-style-type: none; padding: 0; margin: 0; }
.top-movie-dots li { display: inline-block; margin: 0 3em 0 -1em; padding: 0;}
.top-movie-dots button { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.top-movie-dots li button { position: relative; text-indent: -9999px;}
.top-movie-dots li button:before { content: "●"; color: #d9d7d5; font-size: 1em; text-indent: 0px; position: absolute; top: 0; left: 0;}
.top-movie-dots li.slick-active button:before { color: #00007a;}

/* top-news */
.cont-top-news{ position: absolute; width: calc(560/3000*100vw); top:62vw; left: 3.0vw; }
.cont-top-news > .inner{ padding: 1em 0 0 0; }

.top-news-container{ padding: 0; margin: 0 0 1em 0; }
.top-news-container dl{ font-size: 1em; margin-bottom: 1.0em; padding: 0; display: block;  }
.top-news-container dl:last-child{ margin: 0;}
.top-news-container dl dt{ display: block; padding: .1em 0; font-size: .8em; letter-spacing: .02em; margin-bottom: .25em; line-height: 1; font-weight: normal;}
.top-news-container dl dd{ display: block; width: 100%; font-size: .9em; letter-spacing: .02em; line-height: 1.4; margin: 0; pointer-events: all; border-left:#fff220 solid 1px; background-color: rgba(255,255,255,.3); padding: .5em; }
.top-news-container dl dd a,
.top-news-container dl dd a:visited{ text-decoration: none; color: #00007a; }
.top-news-container dl dd a:hover{ text-decoration: underline; color: #ef0485; }

.cont-top-news .more-btn{ width: calc(189/3000*100vw); }
.cont-top-news .more-btn a{  }

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

/* news */

.cont-sub-news{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-news > .inner{ }

/* .cont-news-cursor{ width: 70%; margin: 0 auto; position: relative; }
.news-cursor{ position: relative; }
.news-cursor ul{ display: flex; flex-wrap: nowrap; justify-content: center; margin: 0; padding: 0em 0 0em 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: .5;  }
.news-cursor ul li#NewsPls,
.news-cursor ul li#NewsHome{ display: none; } */


/* onair */
.cont-sub-onair{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-onair > .inner{ }

.sub-onair-container{ padding: 0 3.5em; text-align: center; line-height: 2; }

.onair-catch{ font-size: 2em; font-weight: bold; letter-spacing: .1em; margin-bottom: 1em; }
.onair-catch2{ font-size: 1.5em; font-weight: bold; letter-spacing: .1em; margin-bottom: 1em; }
.onair-label{ text-align: center; margin-bottom: 2em; }
.onair-label > span{ display: inline-block; padding: .75em 1em; font-size: 1.3em; border-radius: 2em; color: #fff; font-weight: 600; line-height: 1; background-color: #00007a; }

.onair-label2{ position: relative; text-align: center; }
.onair-label2 > span{ display: inline-block; color: #fff; font-weight: bold; background-color: #ffc600; border-radius: 2em; padding: .5em 2em ; position: relative; }

.onair-list-container{ max-width: 50em; margin: 0 auto; }
.onair-list{ margin: 0 auto .5em auto ; }
.onair-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: left; padding: 1.0em; background-color: rgba(255,255,255,.8); border:#00007a solid 1px; border-left:#00007a solid .333em; border-radius: 0 2em 2em 0 ; }
.onair-list.first{  }
.onair-list .col-a{ width: 25%; }
.onair-list .col-b{ width: 75%; }
.onair-list .col-c{ width: 100%; }
.onair-list .col-d{ width: 75%; margin-left: 25%; }
.onair-list .name{ font-size: 1.3em; font-weight: bold; margin-bottom: 0; letter-spacing: .05em; }
.onair-list .schd{ font-size: 1.3em; font-weight: normal; margin-bottom: 0; letter-spacing: .05em; display: inline-block; width: 6.5em; }
.onair-list .time{ font-size: 1.3em; font-weight: normal; margin-bottom: 0; letter-spacing: .05em; display: inline-block; }
.onair-list .extr{ font-size: 1em; font-weight: normal; margin: .3em 0 0.1em 0; letter-spacing: .05em; }
a.onair-list { text-decoration: none; color: #00007a; pointer-events: all; }
a.onair-list:hover{ color: #00007a; background-color: #dbce00; }

.onair-list-il-ttl{ display: flex; justify-content: center; align-items: center; margin-bottom: 1em; position: relative; }
.onair-list-il-ttl > span{ display: block; width: 18em; }
.onair-list-il-ttl:before,
.onair-list-il-ttl:after{ content:""; width: 100%; height: 1px; background-color: #00007a;  }

.onair-list-il-container{ max-width: 60em; margin: 0 auto ;  }
.onair-list-il{ margin: 0 auto 1em auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.onair-list-il > a{ width: 32%; margin: 0.5%; display: block; color: #00007a; padding: .5em .2em; background-color: #fff; border:#00007a solid 2px;  border-radius: 1em ; text-decoration: none; font-weight: bold; }
.onair-list-il > a.main{ width: 64%; margin: 0.5%; font-size: 1.2em; }
.onair-list-il > a span{ display: block;  }
.onair-list-il > a.cs{ pointer-events: none; }
.onair-list-il > a:hover{ background-color: #dbce00; color: #00007a;}


/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{ }

.sub-story-container{ padding: 0 0; text-align: center; line-height: 2; }

.cont-story-navi{ width: 100%; margin: 0 auto;}
.story-navi{ margin-bottom: 0; }
.story-navi ul{ padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; }
.story-navi ul > li { padding: 0; margin: 0 1em 1em 0; position: relative; line-height: 1; }
.story-navi ul > li.sep{ width: 100%; height: 1px; margin: 0; }
.story-navi ul > li a{ display: block; width: 2.5em; height: 2.5em; padding-top: .6em; text-align: center; color:#00007a; border-bottom: #00007a solid 1px; border-radius: 0; line-height: 1; position: relative; text-decoration: none; overflow: hidden; }
.story-navi ul > li.n0 a{ width: 11em; }
.story-navi ul > li.n13 a{ width: 8em; }

.story-navi ul > li a:before{ content:""; width: 100%; height: 100%; display: block; position: absolute; top:0; left:-1em; background-color:#00007a; width: 1px; transition: all .25s ease 0s; }
.story-navi ul > li a:hover{ color:#FFF; }
.story-navi ul > li a:hover:before{ width: 100%; background-color: #00007a; left:0; }
.story-navi ul > li a span{ font-size: 1.2em; font-weight: bold; position: relative; }
.story-navi ul > li.cs a{ color:#797979; border-color:#797979; pointer-events: none; }
.story-navi ul > li.crt{ pointer-events: none; }
.story-navi ul > li.crt a{ background-color: #00007a; color:#FFF;  }
.story-navi ul > li.spc-sp{ display: none; }

.cont-story-data{ width: 100%; margin: 0 auto; position: relative; }
.story-data{  display: none; }
.story-data{ position: relative; pointer-events:none; text-align: center;  }
.story-data .episode-container{ position: relative; padding: 2em 0 ; }
.story-data .ep-title-block{ padding: 0; margin-bottom: 1em; display: flex; flex-direction: column; align-items: center; position: relative; z-index: 2; }
.story-data .ep-cat{ width: 40%; font-size: 1em; padding: 0 0 .25em 0; margin-bottom: 2em; position: relative; display: inline-block; border-bottom: #00007a 3px double; }
.story-data .ep-cat > span{ font-size: 1.4em; color: #00007a; font-weight: normal; letter-spacing: .1em; position: relative; }
.story-data .ep-no{  position: relative; display: inline-block; }
.story-data .ep-no > span{ font-size: 1.4em; color: #00007a; font-weight: bold; letter-spacing: .1em; position: relative; }
.story-data .ep-title{ font-size: 1em; padding: .25em; margin-bottom: 0em; position: relative; display: block; line-height: 1; }
.story-data .ep-title > span{ font-size: 2.2em; color:#00007a; font-weight: normal; letter-spacing: .1em; line-height: 2; display: inline;  }
.story-data .ep-slider-sceneImage{ width: 60%; background-color: transparent; border: #00007a solid 1px; margin:0 auto 1em auto ; position: relative; z-index: 2; }
.story-data .ep-slider-sceneImage .sld{ position: relative; padding: .25em .25em; text-align: center; }
.story-data .ep-slider-sceneImage .sld img{ opacity: .25; }
.story-data .ep-slider-sceneImage .sld.slick-active img{ opacity: 1; }
.story-data .ep-slider-thumb{ width: 55%;  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: .5em .25em; transform-origin: center center; pointer-events: all; position: relative; }
.story-data .ep-slider-thumb > div .th{ display: block; line-height: 1; position: relative;}
.story-data .ep-slider-thumb > div .th img{ position: relative;  }
.story-data .ep-slider-thumb > div .th:hover{ transform: scale(1.1,1.1); cursor: pointer; }
.story-data .ep-text{ width: 60%; text-align: left; margin: 0 auto 2em auto; position: relative; z-index: 2;  }
.story-data .ep-text p{ font-size: 1.433em; letter-spacing: .05em; line-height: 2.1;  }
.story-data .ep-staff{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-staff p{ color:#7d7d7d; font-size: .8em; line-height: 1.8; letter-spacing: .1em; display: inline; }
.story-data .ep-trailer{ width: 24em; margin: 0 auto; position: relative; z-index: 2; pointer-events: all; }
.story-data .ep-trailer a{ display: block; padding: 1px; background-color:#a3003e;  position: relative; line-height: 1; }
.story-data .ep-trailer .cap{ width: 8em; display:block; text-align: center; font-size: 1em; letter-spacing: .1em; font-weight: bold; margin: 0; position: absolute; top:12.5em; left:0; right: 0; margin: 0 auto; padding: .5em; background-color:#a3003e; color: #FFF; }
.story-data .intro-container{ position: relative; padding: 2em 0 ; }
.story-data .intro-text{ font-size: 1.433em;  }


.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }



/* staffcast */
.cont-sub-staffcast{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-staffcast > .inner{ }

.staffcast-container{ padding: 0 3.5em; }
.staffcast-list{ width: 100%; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.staffcast-list > div{ width: 30%; }
.staffcast-list > div.full{ width: 100%; }
.staffcast-list > div.p60{ width: 60%; }
.staffcast-list > div.p50{ width: 50%; }
.staffcast-list > div.p40{ width: 40%; }
.staffcast-list > div.p33{ width: 30%; }
.staffcast-list > div.p30{ width: 30%; }
.staffcast-list > div.p25{ width: 25%; }
.staffcast-list > div.p20{ width: 20%; }
.staffcast-list > div.sep{ width: 100%; height: 1px; }
.staffcast-list > div.sep.pc{  }
.staffcast-list > div.sep.sp{ display: none; }
.staffcast-list > div > div{ margin-bottom: 2em; position: relative; }
.staffcast-list .pos{ display: block; font-size: 1.2em; letter-spacing: .05em;  margin-bottom: .9em; line-height: 1; }
.staffcast-list .name{ display: inline-block; font-size: 1.6em; letter-spacing: .05em; margin-bottom: 0; line-height: 1; }
.staffcast-list .ext{ display: block; font-size: .8em; letter-spacing: .1em; padding-top: .5em; margin-bottom: 0; line-height: 1; }
.staffcast-list .cmt{ display: inline-block; width: 2.0em; position: absolute; top:.5em; left:calc(50% + 4.5em); text-decoration: none; pointer-events: auto; }
.staffcast-list .cmt:hover{transform: scale(1.2); text-decoration: none; cursor: pointer; }

.cmt-header{ width: 100%; text-align: center; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; border-top:#00007a solid 1px; }
.cmt-header .sep{ display: block; width: calc(62/3000*100vw); height: calc(120/3000*100vw); background: url("../images/comment-header-marker.png") no-repeat top center; background-size: auto 100%; }
.cmt-header .pos{ display: block; font-size: 1.2em; letter-spacing: .05em; padding: 0em 2em ; margin-bottom: 0; line-height: 1; }
.cmt-header .name{ display: block; font-size: 1.6em; font-weight: bold; letter-spacing: .05em; padding: 0em 2em; margin-bottom: 0; line-height: 1; }
.cmt-header .name .en{ display: block; font-size: .5em; padding-top: .4em; font-weight: normal; }

.cmt-text{ width: 100%; text-align: left; padding: .5em 0; border-top:#00007a solid 1px; border-bottom:#00007a solid 1px; }


/* character */
.cont-sub-character{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-character > .inner{ }

.character-container{ padding: 0 3.5em; }
#CharaCont{ position: relative;  border-top:#00007a solid 4px; border-left:#00007a solid 4px; overflow: hidden; }
#CharaCont .upper-line{ z-index: 3; }
.cont-character-navi{ width: 100%; margin: 0 auto; position: relative; z-index: 5; }

.character-navi{ width: 100%; margin: 0 auto;  }
.character-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; }
.character-navi ul li{ width: 50%; height: 80vw; display: block; margin: 0; padding:0; position: relative; }
.character-navi ul li a{ display: block; width: 100%; min-height: 100%; position: relative; transform-origin: center center; pointer-events: all; cursor: pointer; overflow: hidden; background: linear-gradient(0deg, rgba(219,206,0,0) 0%, rgba(219,206,0,0) 25%, rgba(219,206,0,0) 100%); transition: all .2s ease-out 0s; }
.character-navi ul li a:after{ content:""; width: calc(66/3000*100vw); height: calc(66/3000*100vw); position: absolute; top:1vw; right:1vw;  background: url("../assets/character/marker.png") no-repeat center center; background-size: contain; pointer-events: none; }
.character-navi ul li a:hover{ background: linear-gradient(0deg, rgba(219,206,0,0) 0%, rgba(219,206,0,0) 25%, rgba(219,206,0,1) 100%); }

.character-navi ul li a .fig{ display: block; width: calc(1800/3000*100vw); height: calc(2245/3000*100vw); position: absolute; top:1vw; }
.character-navi ul li.n1{ background: linear-gradient(0deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.9) 100%); }
.character-navi ul li.n2{ background: linear-gradient(0deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.3) 100%); }
.character-navi ul li.n1 a .fig{ left:-19.5vw; }
.character-navi ul li.n2 a .fig{ left:-12vw; }

.act2 .character-navi ul li.n1 a .fig{ left:-15.5vw; }
.act2 .character-navi ul li.n2 a .fig{ left:-13vw; }

.character-navi-cursor{ display: none; }


.character-cursor{ position: relative; width: 35%; margin: 0 auto; pointer-events: none; display: none; z-index: 3; }
.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(242/3000*100vw); height: calc(242/3000*100vw); position: relative; pointer-events: all; cursor: pointer; }
.character-cursor ul li span{ display: block; width:100%; height: 100%; background: url("../assets/character/cursor.png") no-repeat center center; background-size: 58.67%; transform-origin: center center; }
.character-cursor ul li a,
.character-cursor ul li a:hover{ text-decoration: none; }
.character-cursor ul li span:hover{ transform: scale(1.1,1.1);}
.character-cursor ul li.left span{ transform: scale(-1,1); }
.character-cursor ul li.left span:hover{ transform: scale(-1.1,1.1); }
.character-cursor ul li.home span{ background-image: url("../assets/character/back.png");  background-size: 100%; }
.character-cursor ul li.off{ pointer-events: none; opacity: .5; }

.cont-character-data{ width:100%; margin: 0 auto; position: relative; z-index: 2; }
.character-data{ width:100%; padding: 0; min-height: 78vw; display: flex; flex-wrap: wrap; justify-content: center; position: relative; pointer-events:none; display: none;  }

.character-data .bg{ width:200vw; height: 60vw; background-color: rgba(255, 255, 255, 0.699); position: absolute; top:10vw; right:-8vw; transform: rotate(-45deg); z-index: 1; }
.character-data .chr-img{ position: absolute; width: calc(1800/3000*100vw); margin: 0;  top:2.75vw; right:.2vw; z-index: 2; }
#C1.character-data .chr-img{ width: calc(1800/3000*100vw*0.975); }
#C2.character-data .chr-img{ top:-1.0vw; right:-10vw; }
.character-data .chr-face{ display: none; }

.character-data .chr-prof{ position: relative; width: 100%; margin: 0; padding: 3vw 0 0 3vw; z-index: 3;  }
.character-data .prof-name{ position: relative; margin-bottom: 1.25em;}
.character-data .prof-name:before{ content:""; width:calc(70/3000*100vw); height: calc(62/3000*100vw); position: absolute; top:.25vw; left:-3vw; background: url("../images/navi/marker.png") no-repeat left center; background-size: auto 100%; }
.character-data .prof-name p{ font-size: 2.266em; letter-spacing: 0.1em; line-height: 1.1; margin-bottom: 0; }
.character-data .prof-name p [data-ruby]::before { top: -1.1em; transform: scale(0.30,0.35); width: 333%;  }
.character-data .prof-cast{ position: relative; margin-bottom: 2em; }
.character-data .prof-cast p{ font-size: 1.433em; letter-spacing: 0.1em; line-height: 1.1; margin-bottom: 0; }
.character-data .prof-cast p span{ font-size: .6em; }
.character-data .prof-text{ position: relative;  }
.character-data .prof-text .text{ font-size: 1.2em; letter-spacing: .1em; line-height: 2; margin-bottom: 0; }


.character-data.crt{ display: flex; }
.character-data.crt .chr-img{ animation: anm-character-change .25s .05s ease-out both running; }
@keyframes anm-character-change {
  0% { opacity: 0; transform: scale(1.2);}
  100% { opacity: 1; transform: scale(1);}
}

.character-data.crt .bg{ animation: anm-character-bg .25s .05s ease-out both running; }
@keyframes anm-character-bg {
  0% { opacity: 1; transform: translateY(-50%) rotate(-45deg);}
  100% { opacity: 1; transform: translateY(0) rotate(-45deg);}
}

.mode-nv .cont-character-navi{ display: block; }
.mode-nv .character-cursor{ display: none; }
.mode-ch .cont-character-navi{ display: none; }
.mode-ch .character-cursor{ display: block; }


/* music */
.cont-sub-music{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-music > .inner{ }

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

/* bddvd */
.cont-sub-bddvd{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-bddvd > .inner{ }

.bddvd-navi{ width: 100%; margin: 0 auto 4em auto; }
.bddvd-navi nav{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; }
.bddvd-navi nav > div{ padding: 0 .5em ; margin: 0; position: relative; line-height: 1; }
.bddvd-navi nav > div.sep-pc{ width: 100%; height: 1px; padding: 0; margin: 0; }
.bddvd-navi nav > div.last-pc:after{ display: none; }
.bddvd-navi nav > div.sep-sp{ display: none; }
.bddvd-navi nav > div a{ display: inline-block;padding: .5em .75em; font-size: 1.2em; color:#00007a; background-color: #FFF; border:#00007a solid 1px; border-radius: 2em; position: relative; }
.bddvd-navi nav > div a:hover{ transform: scale(1.05); text-decoration: none; }
.bddvd-navi nav > div.crt a{ pointer-events: none; background-color: #00007a; color: #FFF; }


.bd-data{  }

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

.bnf-list{ width: 88%; display: flex; flex-wrap: wrap; margin: 0 auto; 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 > .item-h{ width: 100%; margin: 0 0 1em 0 ; padding: 0;  }
.bnf-list > .item-h .item-col{ width: 100%; margin: 0 0 1em 0 ; padding: 0 0 1em 0; border-bottom: #bba194 dashed 1px; display: flex; flex-wrap: wrap; align-items: top; }

.bnf-list > .item-h .item-col:last-child{ margin: 0 0 1em 0 ; padding: 0; border: none; }

.bnf-list .shop{ padding: .3em 0 .3em .6em; margin-bottom: 1em; font-weight: bold; background: #00007a; color: #FFF; width: 100%; }
.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: 18.75em; 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: #9e2826; margin-bottom: .3em; }
.bnf-list .name{ font-size: 1em; letter-spacing: -0.05em; margin-bottom: .3em; }
.bnf-list .cond{ font-size: 0.777em; margin-bottom: .3em; background-color: #dbce00; display: inline-block; padding: .2em .3em; color: #FFF; }
.bnf-list .start{ font-size: 0.666em; margin-bottom: .3em; }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; }

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

.bnf-list > .item-h .thumb{ width: 25%; margin: 0; padding: 0; }
.bnf-list > .item-h .data{ width: 75%; margin: 0 ; padding: 0 0 0 1em; text-align: left; }





/* keyword */
.cont-sub-keyword{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-keyword > .inner{ }

.keyword-navi{ margin-bottom: 4em; }
.keyword-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; margin: 0; padding: 0; }
.keyword-navi > ul li{ padding: 0 .5em ; margin: 0; position: relative; line-height: 1; }
.keyword-navi > ul li a{ display: inline-block; padding: .5em .75em; font-size: 1.2em; color:#00007a; background-color: #FFF; border:#00007a solid 1px; border-radius: 2em; position: relative; }
.keyword-navi > ul li a:hover{ transform: scale(1.05); text-decoration: none; }
.keyword-navi > ul li.crt a{ pointer-events: none; background-color: #00007a; color: #FFF; }

.cont-keyword-data{ display: flex; flex-wrap: wrap; }
.keyword-data{ width: 31.33%; margin: 1.0%; }
.keyword-data.off{ display: none; }
.keyword-data .category{ display: none; }
.keyword-data .thumb{ padding: .25em; background-color: rgba(102, 68, 51, 0.2); }
.keyword-data .thumb img{ cursor: pointer; position: relative; }
.keyword-data .thumb img:hover{ transform: scale(1.05); }
.keyword-data .title{ text-align: center; padding:0.25em .5em 0 .5em; }
.keyword-data .title span{ display: block; color: #FFF; background: linear-gradient(90deg, rgba(102, 68, 51,0) 0%, rgba(102, 68, 51,1) 30%, rgba(102, 68, 51,1) 70%, rgba(102, 68, 51,0) 100%); }


/* map */
.cont-sub-map{ width: calc(2000/3000*100vw); margin: 0 auto; }
.cont-sub-map > .inner{ }
.sub-map-container{ position: relative; border:#373023 double 3px;}
.sub-map-container .map-bg{ position: relative; z-index: 1; }
.sub-map-container .map-marker{ width: 8vw; top:0; display: block; position: absolute; z-index: 2;  line-height: 1; text-align: center; padding: 0; cursor: pointer; }
.sub-map-container .map-marker:hover{ text-decoration: none; transform: scale(1.1); transition: all .1s ease-out 0s; }

.map-desc-container{ padding: 2em; background-color: rgba(255, 250, 237, 0.7); }
.map-data{ padding: 0 1em; color:#252119; border-left:#252119 solid 2px; margin-bottom: 2em; }
.map-data .title{ font-size: 1.6em; line-height: 1; margin-bottom: .5em; }
.map-data .data{ font-size: 1.2em; margin-bottom: .5em; }
.map-data .data > p{ margin-bottom: 0; }
.map-data .view-btn{ width: 6em; display: block; }

/* books */
.cont-sub-books{ }
.cont-sub-books > .inner{ }
.books-list{ width: calc(1300/3000*100vw); margin: 0 auto; }
.books-list.v2{ width: calc(1750/3000*100vw); }
/* .books-list a{ pointer-events: none; } */


/* special */


/* memory */
.cont-sub-memory{ width: calc(2100/3000*100vw); margin: 0 auto; }
.cont-sub-memory > .inner{ }

.memory-navi{ margin-bottom: 4em; }
.memory-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; margin: 0; padding: 0; }
.memory-navi > ul li{ padding: .35em ; margin: 0; position: relative; line-height: 1.3; letter-spacing: -0.1em; text-align: center; }
.memory-navi > ul li a{ display: inline-block; padding: .5em .75em; font-size: 1.2em; color:#00007a; background-color: #FFF; border:#00007a solid 1px; border-radius: 2em; position: relative; }
.memory-navi > ul li a:hover{ transform: scale(1.05); text-decoration: none; }
.memory-navi > ul li.crt a{ pointer-events: none; background-color: #00007a; color: #FFF; }

.cont-memory-vis-off-data{ display: flex; flex-wrap: wrap; }
.memory-vis-off-data{ width: 23%; margin: 1.0%; }
.memory-vis-off-data .thumb{ padding: .25em; background-color: rgba(102, 68, 51, 0.2); }
.memory-vis-off-data .thumb img{ cursor: pointer; position: relative; }
.memory-vis-off-data .thumb img:hover{ transform: scale(1.05); }
.memory-vis-off-data .title{ text-align: center; padding:0.25em 0 0 0; }
.memory-vis-off-data .title span{ display: block; color: #FFF; background: linear-gradient(90deg, rgba(102, 68, 51,0) 0%, rgba(102, 68, 51,1) 20%, rgba(102, 68, 51,1) 80%, rgba(102, 68, 51,0) 100%); }

.cont-memory-vis-scn-data{ display: flex; flex-wrap: wrap; }
.memory-vis-scn-data{ width: 31.33%; margin: 1.0%; }
.memory-vis-scn-data .thumb{ padding: .25em; background-color: rgba(102, 68, 51, 0.2); }
.ill-oa .memory-vis-scn-data{ width: 31.33%; margin: 1.0%; }
.ill-oa .memory-vis-scn-data .thumb{ display: flex; justify-content: center; align-items: center; width: 100%; height: 32em; background-color: #FFF; }

.memory-vis-scn-data .thumb img{ cursor: pointer; position: relative; }
.memory-vis-scn-data .thumb img:hover{ transform: scale(1.05); }
.memory-vis-scn-data .title{ text-align: center; padding:0.25em 0 0 0; }
.memory-vis-scn-data .title span{ display: block; color: #FFF; background: linear-gradient(90deg, rgba(102, 68, 51,0) 0%, rgba(102, 68, 51,1) 20%, rgba(102, 68, 51,1) 80%, rgba(102, 68, 51,0) 100%); }

.cont-memory-diary-data{ padding: 1em 0; display: flex; justify-content: center; align-items: center; flex-direction: column; }
.cont-memory-diary-data .dy{ width: 40em; max-width: 544px; padding: .25em; background-color: rgba(102, 68, 51, 0.2); margin: 0 auto 2em auto; /*border: #00007a solid 1px;*/  }


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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* 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) {
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{  }

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; }

/* 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:#000; width: 12vw; position: absolute; top:0vw; right: 2vw; 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; }

/* body */
.part-body{ position: relative; display: block; margin: 0; }
.part-body-side{ width: 100%; min-height: 100vh; top:0; bottom:inherit; z-index: 50; background: rgba(255,255,255,1); position: fixed; visibility: hidden; padding-top:6vw; }
.sub-page .part-body-side{ width: 100%; min-height: 100vh; top:0; bottom:inherit; z-index: 50; background-size:calc(32/3000*100vw*2); position: fixed; visibility: hidden; padding-top:8vw; }
.spmenu-on .part-body-side{ visibility: visible; transition: all .5s ease 0s; }
.part-body-main{ position: relative; width: 100%; }
.sub-page .part-body-main{ position: relative; width: 100%; }
.cont-upper{ position: relative; }
.sub-page .cont-upper{ padding-top:inherit; }
.cont-middle{ position: relative; }
.top-page .cont-middle{ position: relative; top:inherit; }
.cont-bottom{ position: relative; }

/* .global-navi > ul > li a{ padding: .5em 0 .5em 2.6em; } */

.cont-global-navi{ width: 100%; padding: 0; transform:translateX(-100%); margin:0 0 2em auto; }
.spmenu-on .cont-global-navi{  transform:translateX(0); transition: all .3s ease-out 0s; }
.sub-page .cont-global-navi{ width: 100%; }
.global-logo{ display: block; width: calc(460/3000*100vw * 3); margin: 0 0 2em 3em; pointer-events: all; }
.global-navi{  margin: 0 auto ; position: relative; }
.global-navi > ul > li{ margin: 0 0 .2em 0;}
.global-navi > ul > li a{  pointer-events: none; }
.spmenu-on .global-navi > ul > li a{  pointer-events: all; }


.cont-season-navi{ width: 100%; position: absolute;  z-index: 5; }
.season-navi{ width: 40%; padding-top: 1em;  }
.season-navi ul li{ width: 45%; margin: 0 2.5%; }
.season-navi ul li a{ padding: .5em 0; }
.season-navi ul li a span{ font-size: 1.2em;  }



.cont-top-content > .inner{ padding: 0; margin: 0 auto;}
.cont-sub-content > .inner{ padding: 6em 0 ; margin: 0 auto;}

.top-subtitle{ width: 80vw; }

.sub-subtitle{ width: 80vw; }
.sub-subtitle > span{ font-size: 2.2em; }
.sub-subtitle:after{ width: calc(63/3000*100vw * 2.3); height: calc(70/3000*100vw * 2.3); margin: -0.4em auto 0 auto;}

.sub-content-container{ width: 100%; margin: 0 auto; position: relative; }

.sub-logo{ width: calc(460/3000*100vw*1.5); position: absolute; top:1.5vw; left: 2.6vw; z-index: 1; }
.sub-oa{ display: none; }

.bottom-image{ width: 100%; height: 60vw; position: relative; top:0; left:0; overflow: hidden; }
.bottom-image > div{ width: 100%; position: absolute; top:0; left:0;  }

/* footer */
.footer-pagetop{ width: calc( 110/3000 * 100vw*2 ); height: calc( 152/3000 * 100vw*2 ); margin: -1px .5em 0 auto;}
/* .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-banner{ padding: 0 ;  margin: -1em 0 0 0; }
.banner-list{ display: flex; justify-content: center; flex-wrap: wrap; }
.banner-list > div{ margin: .5em; }
.banner-list .bn1{ width: calc( 552/3000 * 100vw * 2 ); }
.banner-list .bn2{ width: calc( 552/3000 * 100vw * 2 ); }
.banner-list .bn3{ width: calc( 552/3000 * 100vw * 2 ); }
.banner-list .bn3b{ width: calc( 552/3000 * 100vw * 2 ); }

.cont-footer{ padding: 1.5em 0; }


/* content */
/* 1 */
.cont-entries{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-entry{ padding: 1.5em;}
.content-entry .entry-head{  }
.content-entry .entry-date > span{ font-size: 1.1em; }
.content-entry .entry-title{ }
.content-entry .entry-title > span{ font-weight: bold; font-size: 1.333em; line-height: 1.5; }

.content-entry .entry-body{ padding: 1em 0; font-size: 1.133em; }


.cont-singles{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-single{ padding: 0 2em; color: #91b9ed;  }

.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 .frame-body{ padding: 2em; }



/* TOP-PAGE */
/* main */
.cont-top-visual{ position: relative; padding-bottom: 2.5em; }
.kv-container .kv-bg{ background-size: auto 100%; }

.kv-container .grp{ width: 100%; margin: 0; }
.kv-container .grp .vis-grp{ position: relative; width: 100%; margin: 0 auto; }
.kv-container .catch{ width: calc(194/3000*100vw * 1.6); top:13vw; right:4vw ; }
.kv-container .oa{ width: calc(686/3000*100vw * 2.5); top:120vw; left: 2vw; filter: drop-shadow(0 0 .1em #00007a) ; }
.kv-container .catch2{ width: calc(196/3000*100vw * 1.7); top:25vw; left:10vw ; }
.kv-container .logo{ width: calc(921/3000*100vw * 1.4); top:1.5vw; left: 4vw; }

/* .kv-container .movie{ width: 80vw; position: relative; top:inherit; left: 0; right: 0; margin: 1.5em auto; } */
.kv-container .banner{ width: 60vw; position: relative; top:inherit; left: 0; right: 0; margin: 0 auto; }

.kv-container > .vis-switch{ position: relative; top:inherit; right: inherit; margin: 0 auto; padding: 1em 0 2em 0;flex-direction: row-reverse; justify-content: center; background-color: rgba(0,0,0,.1); }
.vis-switch > div{ width: 12vw; height: 12vw; margin: 0 .75vw; }
.vis-switch > div a{ border-left:#00007a solid 2px; }

.kv-container .movie2{ width: 80vw; position: relative; top:inherit; left: 0; right: 0; margin: 1.5em auto; }

/* top-news */
.cont-top-news{ position: relative; width: 80vw; top:inherit; left: 0; right: 0; margin: 0 auto 2em auto; }
.cont-top-news > .inner{ padding: 1em 0 0 0; }

.top-news-container{ padding: 0; margin: 0 0 1em 0; }
.top-news-container dl{ font-size: 1em; margin-bottom: 1.5em; padding: 0; display: block;  }
.top-news-container dl:last-child{ margin: 0;}
.top-news-container dl dt{ display: block; padding: .1em 0; font-size: .8em; letter-spacing: .02em; margin-bottom: .25em; line-height: 1; font-weight: normal;}
.top-news-container dl dd{ display: block; width: 100%; font-size: 1.0em; letter-spacing: .02em; line-height: 1.4; margin: 0; pointer-events: all; border-left:#fff220 solid 1px; background-color: rgba(255,255,255,.3); padding: .5em; }
.top-news-container dl dd a,
.top-news-container dl dd a:visited{ text-decoration: none; color: #00007a; }
.top-news-container dl dd a:hover{ text-decoration: underline; color: #ef0485; }

.cont-top-news .more-btn{ width: 20vw; }
.cont-top-news .more-btn a{  }


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

/* news */
.cont-sub-news{ width: 90vw; margin: 0 auto; }
.cont-sub-news > .inner{ }

/* .cont-news-cursor{ width: 70%; margin: 0 auto; position: relative; }
.news-cursor ul{ padding: 0em 0 0em 0;  }
.news-cursor ul li a span{ width:4em; height: 4em; } */

/* onair */
.cont-sub-onair{ width: 90vw; margin: 0 auto; }
.cont-sub-onair > .inner{ }
.sub-onair-container{ padding: 0 ; line-height: 1.6;  }

.onair-catch{ font-size: 1.2em; margin-bottom: 1em; }
.onair-catch2{ font-size: 1.0em;  }

.onair-label{ margin-bottom: 2em; }
.onair-label > span{ padding: .5em .75em; font-size: 1.2em; border-radius: 2em; }

.onair-list-container{ max-width: inherit; }
.onair-list{ margin: 0 auto .5em auto; max-width: inherit; padding: 1em;  }
.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 .name{ font-size: 1.2em; margin-bottom: .25em; }
.onair-list .schd{ font-size: 1.0em; }
.onair-list .time{ font-size: 1.0em;  }
.onair-list .extr{ font-size: .9em; }

.onair-list-il-ttl > span{ display: block; width: 22em; }

.onair-list-il > a{ width: 49%; margin: 0.5%; border-width: .4vw; }
.onair-list-il > a.main{ width: 100%; margin: 0.5%; font-size: 1.2em; }






/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{ }

.sub-story-container{ padding: 0 ; text-align: center; line-height: 2; }

.cont-story-navi{ width: 90%; margin: 0 auto;}
.story-navi ul > li { margin: 0 1em 1em 0;  }
.story-navi ul > li a{  width: 2.5em; height: 2.5em; padding-top: .6em; }

.story-navi ul > li a span{ font-size: 1.2em;  }
.story-navi ul > li.spc-sp{ display: none; }

.story-data .episode-container{ position: relative; padding: 2em 0 ; }
.story-data .ep-title-block{ padding: 0; margin-bottom: 1em; }
.story-data .ep-cat{ width: 60%; }
.story-data .ep-title > span{ font-size: 1.8em;  }
.story-data .ep-slider-sceneImage{ width: 90%;  }
.story-data .ep-slider-sceneImage .sld{ position: relative; padding: .25em .25em; text-align: center; }
.story-data .ep-slider-sceneImage .sld img{ opacity: .25; }
.story-data .ep-slider-sceneImage .sld.slick-active img{ opacity: 1; }
.story-data .ep-slider-thumb{ width: 90%; }
.story-data .ep-text{ width: 90%; text-align: left; margin: 0 auto 2em auto; position: relative; z-index: 2;  }
.story-data .ep-text p{ font-size: 1.433em; letter-spacing: .05em; line-height: 2.1;  }

.story-data .intro-container{ position: relative; padding: 2em 1em ; }
.story-data .intro-text{ font-size: 1.333em;  }


/* staffcast */
.cont-sub-staffcast{ width: 80vw; margin: 0 auto; }
.cont-sub-staffcast > .inner{ }

.staffcast-container{ padding: 0 3.5em; }
.staffcast-list > div{ width: 50%; }
.staffcast-list > div.full{ width: 100%; }
.staffcast-list > div.p60{ width: 100%; }
.staffcast-list > div.p50{ width: 100%; }
.staffcast-list > div.p40{ width: 100%; }
.staffcast-list > div.p33{ width: 100%; }
.staffcast-list > div.p30{ width: 50%; }
.staffcast-list > div.p25{ width: 50%; }
.staffcast-list > div.p20{ width: 50%; }
.staffcast-list > div.sep{ width: 100%; height: 1px; }
.staffcast-list > div.sep.pc{ display: none; }
.staffcast-list > div.sep.sp{ display: block; }
.staffcast-list > div > div{ margin-bottom: 2em; position: relative; }
.staffcast-list .pos{ font-size: 1.13em; margin-bottom: .9em;  }
.staffcast-list .name{ font-size: 1.333em; }
.staffcast-list .ext{ font-size: .8em; padding-top: .5em; }
.staffcast-list .cmt{ width: 2.0em; top:.3em; left:calc(50% + 3.5em); }

.cmt-header{ width: 100%; text-align: left; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; border-top:#00007a solid 1px; padding: .5em 0; }
.cmt-header .sep{ display: none; }
.cmt-header .pos{ width: 100%; font-size: 1.2em; padding: 0em 0 ; text-align: right; }
.cmt-header .name{ width: 100%; font-size: 1.6em; letter-spacing: .05em; padding: 0em 0; margin-bottom: 0; }
.cmt-header .name .en{ display: block; font-size: .5em; padding-top: .4em; font-weight: normal; }


/* character */
.cont-sub-character{ width: 100%; margin: 0 auto; }
.cont-sub-character > .inner{ }

#CharaCont{ position: relative; border-left: none; border-width: 3px; }
.cont-character-navi{ width: 100%; }
.character-navi{ width: 100%; }
.character-navi ul{ width: 100%; }
.character-navi ul li{ height: 150vw; }
.character-navi ul li a:after{ width: calc(66/3000*100vw*2); height: calc(66/3000*100vw*2); top:2vw; right:2vw; }
.character-navi ul li a:hover{  }
.character-navi ul li a .fig{ display: block; width: calc(1800/3000*100vw*1.8); height: calc(2245/3000*100vw*1.8); position: absolute; top:5vw; }
.character-navi ul li.n1 a .fig{ left:-42vw; }
.character-navi ul li.n2 a .fig{ left:-24vw; }

.act2 .character-navi ul li.n1 a .fig{ left:-30vw; }
.act2 .character-navi ul li.n2 a .fig{ left:-28vw; }

.character-navi-cursor{ display: none; }

.character-cursor{ width: 65%; display: none; }
.character-cursor ul li{ width:calc(242/3000*100vw * 2); height: calc(242/3000*100vw * 2); }
.character-cursor ul li.home span{ background-size: 100%; }

.cont-character-data{ width:100%; }
.character-data{ min-height: 80vw; }

.character-data .bg{ width:200vw; height: 120vw; top:-50vw; right:-30vw; }

.character-data .chr-img{ position: relative;  width: 100%; top:0; left:0; right: 0; margin: 0 auto; }
.character-data .chr-img img{ transform: scale(1.1); }
#C1.character-data .chr-img{ width: inherit; top:inherit; left: inherit; }
#C2.character-data .chr-img{ top:inherit; left: inherit; }

.character-data .chr-prof{ position: relative; width: 100%; margin: 0; padding: 6vw 6vw 0 6vw; z-index: 2;  }
.character-data .prof-name{ position: relative; margin-bottom: 1.25em;}
.character-data .prof-name:before{ content:""; width:calc(70/3000*100vw*2); height: calc(62/3000*100vw*2); position: absolute; top:2.25vw; left:-6vw; background-size: auto 100%; }
.character-data .prof-name p{ font-size: 2.266em; letter-spacing: 0.1em; line-height: 1.1; margin-bottom: 0; }
.character-data .prof-name p [data-ruby]::before { top: -1.1em; transform: scale(0.30,0.35); width: 333%;  }
.character-data .prof-cast{ position: relative; margin-bottom: 2em; }
.character-data .prof-cast p{ font-size: 1.433em; letter-spacing: 0.1em; line-height: 1.1; margin-bottom: 0; }
.character-data .prof-cast p span{ font-size: .6em; }
.character-data .prof-text{ position: relative;  }
.character-data .prof-text .text{ font-size: 1.2em; letter-spacing: .1em; line-height: 2; margin-bottom: 0; }


/* bddvd */
.cont-sub-bddvd{ width: 100%; margin: 0 auto; }
.cont-sub-bddvd > .inner{ }


.bddvd-navi{ padding: .25em 0; }
.bddvd-navi nav > div{ margin: .25em; }
.bddvd-navi nav > div:after{font-size: 1.0em; padding: 0 .25em; }
.bddvd-navi nav > div.last-pc:after{ display: block; }
.bddvd-navi nav > div.last-sp:after{ display: none; }
.bddvd-navi nav > div.sep-sp{ display: block; width: 100%; height: 1px; padding: 0; margin: 0; }
.bddvd-navi nav > div a span{ font-size: 1.0em;  }
.bddvd-navi nav > div.sep-pc,
.bddvd-navi nav > div.sep-pc:after{ display: none; }


.bd-data{ }

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

.bnf-list{ width: 100%; display: flex; flex-wrap: wrap; margin: 0 auto; align-items: flex-start; }
.bnf-list > div{ }
.bnf-list > .item-x1{ width: 100%; }
.bnf-list > .item-x2{ width: 100%; }
.bnf-list > .item-x3{ width: 33.33%;  }
.bnf-list > .item-x3x2{ width: 66.66%;  }
.bnf-list > .item-x4{ width: 25%;  }
.bnf-list > .item-x4x3{ width: 75%; }
.bnf-list > .item-x5{ width: 20%;  }
.bnf-list > .item-x1.x1-dbl{ width: 50%; }
.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 > .item-h{ width: 100%; margin: 0 0 1em 0 ; padding: 0;  }


.bnf-list .shop{  }
.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.8em;  }
.bnf-list .name{ font-size: 1em;  }
.bnf-list .cond{ font-size: 0.9em; }
.bnf-list .start{ font-size: 1em;  }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; }

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

.bnf-list > .item-h .thumb{ width: 100%; margin: 0; padding: 0; }
.bnf-list > .item-h .thumb.np{ width: 100%; margin: 0; padding: 0 20%; }
.bnf-list > .item-h .data{ width: 100%; margin: 0 ; padding: 0 ; text-align: left; }


/* keyword */
.cont-sub-keyword{ width: 100%; margin: 0 auto; }
.cont-sub-keyword > .inner{ }

.keyword-navi{ margin-bottom: 4em; }
.keyword-navi > ul li{ padding: 0 .3em ; margin: 0; position: relative; line-height: 1; }
.keyword-navi > ul li a{ padding: .5em .75em; font-size: 1.1em; }

.cont-keyword-data{ display: flex; flex-wrap: wrap; padding: 0 1em; }
.keyword-data{ width: 48%; margin: 0 1.0% 4.0% 1.0%; }


/* map */
.cont-sub-map{ width: 100%; margin: 0 auto; }
.cont-sub-map > .inner{  padding-left:.25em; padding-right:.25em; }
.sub-map-container{ position: relative; }
.sub-map-container .map-bg{ position: relative; z-index: 1; }
.sub-map-container .map-marker{ transform: scale(0.5);}
.sub-map-container .map-marker:hover{ transform: scale(0.5); }

.map-desc-container{ padding: 1.5em 1em;  }
.map-data{ padding: 0 .75em; }
.map-data .title{ font-size: 1.333em; line-height: 1; margin-bottom: .75em; }
.map-data .data{ font-size: .9em; }
.map-data .view-btn{ width: 5em; display: block; }

/* books */
.cont-sub-books{ }
.cont-sub-books > .inner{ }
.books-list{ width: 80vw; margin: 0 auto; }
.books-list.v2{ width: 80vw; }
.books-list a{ pointer-events: none; }


/* memory */
.cont-sub-memory{ width: 100%; margin: 0 auto; }
.cont-sub-memory > .inner{ }

.memory-navi{ margin-bottom: 4em; }
.memory-navi > ul li{ padding: .3em ; margin: 0; position: relative; line-height: 1; }
.memory-navi > ul li a{ padding: .5em .75em; font-size: 1.1em; }

.cont-memory-vis-off-data{ display: flex; flex-wrap: wrap; padding: 0 1em; }
.memory-vis-off-data{ width: 48%; margin: 0 1.0% 4.0% 1.0%; }

.cont-memory-vis-scn-data{ display: flex; flex-wrap: wrap; padding: 0 1em; }
.memory-vis-scn-data{ width: 48%; margin: 0 1.0% 4.0% 1.0%; }

.ill-oa .memory-vis-scn-data{ width: 48%; margin: 0 1.0% 4.0% 1.0%; }
.ill-oa .memory-vis-scn-data .thumb{ height: 19em; }

.memory-vis-scn-data .title span{ font-size: .9em; }

.cont-memory-diary-data{ }
.cont-memory-diary-data .dy{ width: 90%; margin: 0 auto 2em auto; }



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

}