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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #4f2d21; background:#fff;  } 
/* body.sub-page{ background:#fff url(../images/common-bg-grd.jpg) repeat-x center top ; background-size: calc(600/30*1em) auto;  } */ 

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

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

/* header */
.part-header{ position: absolute; top:0; pointer-events: none; }
/* .main-vis-nav .part-header{ position: absolute; } */
.cont-global-navi{ width: 100%; padding-bottom: 1em; border-bottom:#a78f39 solid 2px;  background: #673539 url("../images/common/tx-leather.png") repeat center center; background-size: calc( 1000/3000*100vw); }

.global-navi{ width: 100%; margin: 0 auto; position: relative; }
.global-navi > ul{ display: flex; flex-wrap: nowrap; justify-content: center; list-style-type: none; padding: 0; margin: 0; transform: scale(0.8, 1); transform-origin: top left; width: 125%; }
.global-navi > ul > li{ display: block; padding: 0 .5em ; margin: 0; line-height: 1; }
.global-navi > ul > li a{ display: block; padding-top: 1.7em; position: relative; text-decoration: none; pointer-events: all; color:#a78f39; }
.global-navi > ul > li a > span{ display: inline; font-size: 1.6em; position: relative; font-family:'Spectral', serif; letter-spacing: .03em; }
.global-navi > ul > li a:hover{ color:#fff;  }
.global-navi > ul > li a:hover::before{ content:""; display: block; width: calc( 32/3000*100vw); min-height: calc( 47/3000*100vw); position: absolute; top:0; left:0; right:0; margin: 0 auto; background: url(../images/navi/marker.png) no-repeat center top; background-size: auto 100%;  }

.global-navi > ul > li.cs a{ color: #666; pointer-events: none; }

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

/* body */
.part-body{ margin: 0 auto; padding: calc( 180/3000*100vw) 0 3em 0; min-height: calc(100vh - 3.0em); background: url("../images/common/tx-paper.png") repeat center center; background-size: calc( 1000/3000*100vw); }
.part-body::before{ content:""; width: 100%; min-height: calc( 468/3000*100vw); position: absolute; top:0; pointer-events: none; z-index:100 ; background: url("../images/common/part-body-upper.png") no-repeat center bottom; background-size: 100%; }
.cont-upper{ position: relative; }
.sub-page .cont-upper{ display: none; }
.cont-middle{ position: relative; }
.sub-page .cont-middle::before{ content:""; width: 100%; min-height: 100%; padding:0; margin: 0; position: absolute; background: url("../images/common/bg-board1.jpg") no-repeat center top; background-size: 100%; }
.sub-page .cont-middle.bd2::before{ background-image: url("../images/common/bg-board2.jpg"); }
.sub-page .cont-middle.bd3::before{ background-image: url("../images/common/bg-board3.jpg"); }
.sub-page .cont-middle.bd4::before{ background-image: url("../images/common/bg-board4.jpg"); }
.sub-page .cont-middle.bd5::before{ background-image: url("../images/common/bg-board5.jpg"); }
.cont-middle-background{ width: calc( 2530/3000*100vw); padding: 11em 0 6em 0; margin: 0 auto; position: relative; background: #673539 url("../images/common/tx-leather.png") repeat center center; background-size: calc( 1000/3000*100vw); }

.sub-page .cont-middle-background{ padding: 5em 0 6em 0; background: none;}
.sub-page .cont-middle-background::before{ content:""; width: 100%; min-height: 100%; padding:0; margin: 0; position: absolute; top:0; background: #673539 url("../images/common/tx-leather.png") repeat center center; background-size: calc( 1000/3000*100vw); mix-blend-mode: multiply; }

.cont-top-content{ width: calc( 2150/3000*100vw); margin: 0 auto; padding: 2em; background: #FFF; border:#a78f39 solid 4px; }
.cont-sub-content{ width: calc( 2150/3000*100vw); margin: 0 auto; padding: 2em; background: rgba(255,255,255,.85); border:#a78f39 solid 4px; }

.top-cont-title{ position: relative; line-height: 1; margin-bottom: 1.0em; text-align: center; }
.top-cont-title > h2{ font-size: 1em; margin: 0; padding: 0 3em; display: inline-block; position: relative; }
.top-cont-title > h2::before,
.top-cont-title > h2::after{ content:""; width: calc( 75/3000*100vw); min-height: calc( 99/3000*100vw); position: absolute; top:-0.2em; left:0; pointer-events: none; background: url("../images/common/ic-catr-brass.png") no-repeat center center; background-size: contain; }
.top-cont-title > h2::after{ left: inherit; right: 0; }
.top-cont-title > h2 > span{ font-size: 2.933em; font-family: 'Spectral', serif; font-style: italic; color: #a78f39; letter-spacing: .03em; position: relative; }

.sub-cont-title{ position: relative; line-height: 1; margin-bottom: 2.0em; text-align: center; }
.sub-cont-title > h2{ font-size: 1em; margin: 0; padding: 0 4em; display: inline-block; position: relative; filter: drop-shadow(0 0 .3em #ffa21d); }
.sub-cont-title > h2::before,
.sub-cont-title > h2::after{ content:""; width: calc( 95/3000*100vw); min-height: calc( 127/3000*100vw); position: absolute; top:-0.6em; left:0; pointer-events: none; background: url("../images/common/ic-catr-white.png") no-repeat center center; background-size: contain; }
.sub-cont-title > h2::after{ left: inherit; right: 0; }
.sub-cont-title > h2 > span{ font-size: 3.333em; font-family: 'Spectral', serif; font-style: italic; color: #fff; letter-spacing: .03em; position: relative; }

.sub-cont-subtitle{ position: relative; line-height: 1; margin-bottom: 2.0em; text-align: center; }
.sub-cont-subtitle > h3{ font-size: 1em; margin-bottom: 0; transform: scale(0.86, 1); transform-origin: top center;  }
.sub-cont-subtitle > h3 > span{ font-size: 2em; font-weight: 700; color: #a78f39; letter-spacing: .1em; position: relative; }

.frame-top-content{ padding: 2em 1em; background: #FFF; border:#a78f39 solid 2px; position: relative; }
.frame-top-content::before,
.frame-top-content::after{ content:""; width: 100%; min-height: calc( 60/3000*100vw); position: absolute; top:0; left:0; pointer-events: none; background: url("../images/common/frame-bar.png") repeat-x center center; background-size: calc( 40/3000*100vw); }
.frame-top-content::after{ top: inherit; bottom: 0; }

.frame-sub-content{ padding: 2em 1em; background: #FFF; border:#a78f39 solid 2px; position: relative; }
.frame-sub-content::before,
.frame-sub-content::after{ content:""; width: 100%; min-height: calc( 60/3000*100vw); position: absolute; top:0; left:0; pointer-events: none; background: url("../images/common/frame-bar.png") repeat-x center center; background-size: calc( 40/3000*100vw); }
.frame-sub-content::after{ top: inherit; bottom: 0; }


/* footer */
.part-footer{ background: url("../images/common/part-footer-bg.png") no-repeat center top; background-size: 100%;}
.part-footer::after{ content:""; display: block; width: 100%; min-height: calc( 68/3000*100vw); position: relative; pointer-events: none; background:#321910 url("../images/common/footer-bar.png") repeat-x center center; background-size: calc( 170/3000*100vw); filter: drop-shadow(0 0 .3em #461a03); }
.cont-global-footer{ margin: 0 auto; padding:0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 162/30 * 1em ); height: calc( 162/30 * 1em ); position: fixed;  bottom:1.5em;  right:1em; z-index: 10; overflow: hidden; }
.footer-pagetop a{ display: block; position: relative; width: 100%; min-height: 100%; background:url(../images/common/footer-pagetop.png) no-repeat center center; background-size: contain; }
.footer-pagetop{ opacity: 0;}
.footer-pagetop.start{ animation: anm-pagetop-btn .5s 0s ease-out both running;}
@-webkit-keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
@keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
.anm-pagetop-btn { -webkit-animation-name: anm-pagetop-btn; animation-name: anm-pagetop-btn;}
.cont-footer{ padding: 2em 0 0 0; }
.footer-banner{ text-align: center; position: relative; }
.footer-banner a{ display: inline-block; width: calc(640/3000*100vw); }
.footer-copyrihgt{ text-align: center; position: relative; }
.footer-copyrihgt p{ color: #FFF; font-size: 0.9em; padding: 2em 0; letter-spacing: .1em; margin-bottom: 0; position: relative;}

/* content */
.inview{ animation:inview 0.4s .2s ease-out both paused; }
.inview-start{ animation:inview-start 0.4s .2s ease-out both running; }

.frame-a{ border:#a78f39 solid 1px; background-color: #FFF;}
.frame-b{ border:#482f21 solid 2px;}

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

.bar-a{ width: 100%; min-height: calc( 60/3000*100vw); position: relative; background: url("../images/common/frame-bar.png") repeat-x center center; background-size: calc( 40/3000*100vw); }

.ol-a{display: table;margin: 0;padding: 0;}
.ol-a li{list-style-type: decimal;margin: 0;padding: 0;display: table-row;counter-increment: table-ol;}
.ol-a li:before {content: counter(table-ol) ".";display: table-cell;padding-right: 0.4em;text-align: right;}
.ol-a li:after {content: "";display: block;margin-bottom: .5em;}

.ol-b{ }

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

.cont-entries{ margin: 0 auto; padding-bottom: 3em; }
.content-entry{ box-sizing: border-box; margin-bottom: 6em; }
.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-head{ margin-bottom: 0; position: relative; padding-left: 12%; }
.content-entry .entry-body{ font-size: 1.2em; letter-spacing: .05em; line-height: 1.5; padding-left: 12%;}

.content-entry .entry-date{ position: absolute; top:.2em; left:0; line-height: 1; display: inline-block; margin: 0; }
.content-entry .entry-date > span{ font-size: 1em; color:#a78f39; letter-spacing: .1em; }
.content-entry .entry-title{ font-size: 1em; margin-bottom: 1em; padding: 0 .2em; }
.content-entry .entry-title > div{ padding: 0 0 2em 0; background: url("../images/common/news-frame-line.png") repeat-x left bottom; background-size:calc(341/3000*100vw); }
.content-entry .entry-title span{ font-size: 1.466em; color: #333; font-weight: bold; line-height: 1.2; letter-spacing: .05em; }

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

/* colorbox customize */
#colorbox{}
#cboxOverlay{ background:rgba(255,255,255,.9) ; }
#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; border-bottom:#a78f39 solid 2px; }
.cont-top-visual::after{ content:""; display: block; width: 100%; min-height: calc( 56/3000*100vw); position: relative; pointer-events: none; background: url("../images/common/frame-bar.png") repeat-x center center; background-size: calc( 56/3000*100vw); position: absolute; bottom:-1em; z-index: 5; }
.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ position: relative; margin: 0 auto; overflow: hidden; background-color: #000; }
.kv-container > div{ position: absolute; top:0; }

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

.kv-container .logo{ width: calc( 1292/3000*100% ); top:88vw; left: 0; right: 0; margin: 0 auto; position: absolute;}
.kv-container .oa{ width: calc( 2046/3000*100vw ); top: 105vw; left: 0; right: 0; margin: 0 auto; position: absolute;}

.cont-top-visual-catch{ width: calc( 1672/3000*100vw ); bottom: -9vw; left: 0; right: 0; margin: 0 auto; position: absolute; z-index: 5; }

.cont-top-visual-switch{ width: calc( 2530/3000*100vw ); top: 115vw; left: 0; right: 0; margin: 0 auto; position: absolute; }
.cont-top-visual-switch .vis-switch{ display: flex; justify-content: center; position: relative; }
.cont-top-visual-switch .vis-switch > div{ width: calc( (100% - 10em) / 6 ); margin: 0 2em 0 0; }
.cont-top-visual-switch .vis-switch > div:last-child{ margin-right: 0; }
.cont-top-visual-switch .vis-switch > div a{ display: block; padding-bottom: calc(61/3000*100vw); position: relative; background: url("../images/top-vis-switch-frame.png") no-repeat center bottom; background-size: calc(88/3000*100vw); }
.cont-top-visual-switch .vis-switch > div a img{ border:#a78f39 solid 2px; }

/* 
.kv-container[data-kv=k1] .logo{ top:4vw;}
.kv-container[data-kv=k1] .oa{ top:51vw;}
.kv-container[data-kv=k2] .logo{ top:0vw;}
.kv-container[data-kv=k2] .oa{ top:71vw;}
 */

.kv-container .oa,
.kv-container .logo{ opacity: 0; }


.init .kv-container .logo{ transform: translate(0,-430%) scale(1.3,1.3); }
.init .kv-container .oa{ transform: translate(0,-790%) scale(1.3,1.3) ; }

.s1 .kv-container .vis{ opacity: .2; transition: all 1.5s ease .0s; }
.s1 .kv-container .logo{ transform: translate(0,-430%) scale(1,1) ; opacity: 1; transition: all 2.0s ease 1.5s; } 
.s1 .kv-container .oa{ transform: translate(0,-790%) scale(1,1) ; opacity: 1; transition: all 2.0s ease 1.7s; } 

.s2 .kv-container .vis{ opacity: 1; transition: all 1.0s ease .0s; }
.s2 .kv-container .logo{ transform: translate(0,0) ; opacity: 1; transition: all 2.0s ease 0s; } 
.s2 .kv-container .oa{ transform: translate(0,0) ; opacity: 1; transition: all 2.0s ease 0s; } 

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

.kv-container .grp5{ display: block; }



/* nekoya */
.cont-top-nekoya{ width: calc( 335/3000*100vw ); position: absolute; top:-2.5em; left:0; right:0; margin: 0 auto; z-index: 5; }

/* news twitter */
.cont-top-news-twitter{ display: flex; flex-wrap: wrap; align-items:stretch; justify-content: space-between; margin: 0 auto 2em auto; padding: 6em 0 0 0; }
.cont-top-news,
.cont-top-twitter{ width: calc(50% - 1em); }
.cont-top-news-twitter .top-cont-title{ position: absolute; top:-4.5em; left:0; right:0; margin: 0 auto; }

/* news */
.cont-top-news{  }
.news-container{ position: relative; padding: 1.5em 1em 0 1em; }
.news-container dl{ display: flex; flex-wrap: wrap; align-items:stretch; justify-content: space-between; font-size: 1.0em; margin: 0 0 1.5em 0; padding:0 0 1.0em 0; border-bottom:#a78f39 solid 1px;  }
.news-container dl:last-child{ border:none; margin-bottom: 0; padding-bottom: 0; }
.news-container dl dt{ display: block; width: 20%; margin: 0 ; padding: 0; line-height: 1.4; letter-spacing: .03em; }
.news-container dl dt > span{ font-size: 1.0em; font-weight: normal; }
.news-container dl dd{ display: block; width: 80%; font-size: 1.0em; font-weight: normal; line-height: 1.4; letter-spacing: .03em;  }
.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{ }
.twitter-widget-container{ height: 100%; position: relative; }
.twitter-widget-container iframe{ min-height: 100%; }
.twitter-timeline-container{ padding: 0 .5em; }

/* movie */
.cont-top-movie{ }
.cont-top-movie .movie-player-frame{ border:#a78f39 solid 4px; margin-bottom: 1em; }
.cont-top-movie .movie-navi{ display: flex; flex-wrap: wrap; justify-content: center; }
.cont-top-movie .movie-navi .th{ width: 33.33%; padding: .5em;}
.cont-top-movie .movie-navi .th a{ border:#a78f39 solid 4px; }





/* SUB-PAGE */
/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{ padding: 2em; }
.sub-content-container.sub-news-container{  }

/* onair */
.cont-sub-onair{ }
.cont-sub-onair > .inner{ padding: 2em; }
.sub-content-container.sub-onair-container{  }
.onair-bg{ width: 100%; min-height: 100%; position: absolute; top: 0; left:0; background: url("../images/onair-bg-image.jpg") no-repeat right bottom; background-size: 60%; mix-blend-mode: multiply;  }

.onair-list{ margin: 0 auto .5em auto; max-width: 45em; }
.onair-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: left; padding: .5em; border-top:#a78f39 dashed 1px; border-bottom:#a78f39 dashed 1px; background-color: rgba(120,120,120,.03); }
.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.2em; font-weight: bold; color:#a78f39; margin-bottom: .5em; letter-spacing: .2em;}
.onair-list .schd{ font-size: 1.2em; font-weight: bold; margin-bottom: 0; letter-spacing: .2em; }
.onair-list .time{ font-size: 1.2em; margin-bottom: 0; letter-spacing: .2em; }
.onair-list .extr{ font-size: .9em; margin: .3em 0 0.1em 0; letter-spacing: .2em;}
a.onair-list { text-decoration: none; color: #4f2d21; pointer-events: all; }
a.onair-list:hover{ color: #fff; background-color: #a53e19; }

.onair-list-il-container{ max-width: 45em; margin: 0 auto; }
.onair-list-ilttl{ text-align: center; font-weight: bold; font-size: 1.2em; color: #a53e19; letter-spacing: .05em; line-height: 1.5; padding: .5em 0; margin: 0 auto .5em auto; }
.onair-list-ilttl span{ font-size: .888em; color:#4f2d21; }
.onair-list-il{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto; text-align: center; }
.onair-list-il > a{ display: block; padding: .5em; border:#a78f39 dashed 1px; background-color: rgba(120,120,120,.03); color: #a78f39; text-decoration: none; font-weight: 600; margin: .25em; }
.onair-list-il > a:hover{ background-color: #a53e19; color: #a78f39;}

/* staffcast */
.cont-sub-staffcast{ }
.cont-sub-staffcast > .inner{ padding: 2em; }
.sub-content-container.sub-staffcast-container{  }

.staffcast-bg{ width: calc(1267/3000*100vw);; min-height: calc(936/3000*100vw); position: absolute; top: 50vw; left:15vw; background: url("../images/staffcast-bg-image.jpg") no-repeat center center; background-size: 100%; mix-blend-mode: multiply;  }

.staffcast-text{ display: flex; flex-wrap: wrap; justify-content: center; line-height: 1; text-align: center; margin-bottom: 1.9em; letter-spacing: .2em; }
.staffcast-text .post{ color: #a53e19; font-size: 1.5em; font-weight: 900; width: 100%; margin-bottom: .5em; transform: scale(0.8, 1); transform-origin: top center; }
.staffcast-text .name{ font-size: 1.6em; font-weight: 900; width: 100%; margin-bottom: .2em; }
.staffcast-text .post-e{ color: #a53e19; font-size: .8em; font-weight: 700; width: 100%; margin-bottom: .5em; padding-top: .5em; transform: scale(0.8, 1); transform-origin: top center;}
.staffcast-text .name-e{ font-size: 1em; font-weight: 700; width: 100%; transform: scale(0.8, 1); transform-origin: top center;}

/* introduction */
.cont-sub-intro{ }
.cont-sub-intro > .inner{ padding: 2em; }
.sub-content-container.sub-intro-container{ }

.intro-bg{ width: 100%; min-height: 100%; position: absolute; bottom: 0; left:0; background: url("../images/intro-bg-image.jpg") no-repeat center bottom; background-size: 100%; mix-blend-mode: multiply;  }
.intro-text.ja{ font-size: 1.466em; font-weight: 900; line-height: 2; letter-spacing: .2em; text-align: center; }
.intro-text.ja .text1{ transform: scale(0.86, 1); transform-origin: top left; width: 116.279069%; }
.intro-text.ja .text2{ font-size: 1.2em; color: #a53e19; transform: scale(0.86, 1); transform-origin: top left; width: 116.279069%; }
.intro-text.en{ font-size: 1.133em; font-weight: 700; line-height: 2; letter-spacing: .1em; text-align: center; }
.intro-text.en .text1{ transform: scale(0.86, 1); transform-origin: top left; width: 116.279069%; }
.intro-text.en .text2{ color: #a53e19; transform: scale(0.86, 1); transform-origin: top left; width: 116.279069%; }
.intro-charm{ padding: 2em 0 4em 0; position: relative; text-align: center; }
.intro-charm span{ display:inline-block; width: 8em; }


/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{ padding: 2em; }
.sub-content-container.sub-story-container{ }

.story-bg{ width: 100%; min-height: 100%; position: absolute; bottom: 0; left:0; background: url("../images/intro-bg-image.jpg") no-repeat center bottom; background-size: 100%; mix-blend-mode: multiply; display: none; }

.story-data{ position: relative; display: none; pointer-events:none; text-align: center; }

.story-navi{ min-height: 50em; position: relative; padding: 0 0 0 0; }
.story-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; margin: 0; padding: 0; }
.story-navi ul li{ display: block; width: 33%; padding: 0 1.0em; }
.story-navi ul li a{ display: block; pointer-events: auto; text-decoration: none; position: relative; }
.story-navi ul li a:before{ content:""; display: block; width:calc( 126/3000*100vw); height:calc( 89/3000*100vw); background:url("../images/story-menu-ic.png") no-repeat center bottom; background-size: contain; margin: 0 auto; }
.story-navi ul li a img{ border:#a78f39 solid 2px; }
.story-navi ul li a:hover{ transform: scale(1.1,1.1); cursor: pointer; }
.story-navi ul li .epnum{ display: block; width: 6em; padding: .3em 0; background-color: #a78f39; color: #FFF; letter-spacing: .1em; line-height: 1; font-weight: 700; position: absolute; top:2.25em; left:0; right:0; margin: 0 auto; }
.story-navi ul li .epttl{color:#4f2d21; font-size: 1.0em; letter-spacing: .01em; line-height: 1; font-weight: 700; padding-top: .5em; }

.story-data .story-block{ position: relative; padding: 0 0 0 0; }
.story-data .ep-menu-btn{ padding-bottom: 2em; margin: -2em 0 0 0; position: relative; text-align: center; z-index: 2; }
.story-data .ep-menu-btn a{ display: inline-block; padding: .5em 2em; border:#a78f39 solid 1px; background-color:rgba(255,255,255,.7); color: #a78f39; pointer-events: auto; text-decoration: none;}
.story-data .ep-menu-btn a:hover{ background-color:#a78f39;color: #fff; }
.story-data .ep-menu-btn a span{ padding-left: 1.5em; font-size: 1.0em; font-weight: 700; letter-spacing: .1em; background: url("../images/ic-rb-b.png") no-repeat left .35em; background-size: auto .9em; }
.story-data .ep-menu-btn a:hover span{ background-image: url("../images/ic-rb-w.png") }
.story-data .ep-title{ position: relative; line-height: 1; margin-bottom: 2.0em; text-align: center; }
.story-data .ep-title > h2{ font-size: 1em; margin: 0 0 .5em 0; padding: 0 4em; display: inline-block; position: relative; filter: drop-shadow(0 0 .1em #ffa21d); }
.story-data .ep-title > h2::before,
.story-data .ep-title > h2::after{ content:""; width: calc( 95/3000*100vw); min-height: calc( 127/3000*100vw); position: absolute; top:-0.6em; left:0; pointer-events: none; background: url("../images/common/ic-catr-brown.png") no-repeat center center; background-size: contain; }
.story-data .ep-title > h2::after{ left: inherit; right: 0; }
.story-data .ep-title > h2 > span{ font-size: 2em; font-family: 'Noto Serif JP', serif; font-weight: 900; color: #a53e19; letter-spacing: .03em; position: relative; border-bottom:#a53e19 solid 1px; display: inline-block; padding-bottom: .3em; }
.story-data .ep-title > .en{ display: inline-block; margin: 0; padding: .3em .6em;}
.story-data .ep-title > .en > span{ font-size: 1.0em; font-weight: 700; color: #a53e19; letter-spacing: .1em; filter: drop-shadow(0 0 .07em #ffa21d); }
.story-data .ep-slider-sceneImage{ max-width: 100%;  margin:0 auto .9em auto; position: relative; z-index: 2; }
.story-data .ep-slider-sceneImage .sld{ padding: .1em; }
.story-data .ep-slider-sceneImage .sld img{ border:#a78f39 solid 4px; }
.story-data .ep-slider-thumb{ width: 100%; margin: 0 auto 2.5em auto; display: flex; justify-content: center; position: relative; z-index: 2; }
.story-data .ep-slider-thumb > div{ width: 25%; padding: 0 .5em; transform-origin: center center; pointer-events: all; }
.story-data .ep-slider-thumb > div > a{ display: block; line-height: 1; overflow: hidden; }
.story-data .ep-slider-thumb > div > a img{ border:#a78f39 solid 4px; }
.story-data .ep-slider-thumb > div:hover{ transform: scale(1.1,1.1); cursor: pointer; }
.story-data .ep-text{ padding: 0 5em; margin-bottom: 6em; position: relative; z-index: 2; }
.story-data .ep-text .subt-ja{ font-size: 1.6em; font-weight: 900; letter-spacing: .03em; margin-bottom: .3em; color: #a53e19; }
.story-data .ep-text .subt-en{ font-size: 1.2em; font-weight: 700; letter-spacing: .03em; color: #a53e19; }
.story-data .ep-text .text-ja{ font-size: 1.2em; line-height: 1.8; letter-spacing: .1em; text-align: left; font-weight: 700;  }
.story-data .ep-text .text-en{ font-size: 1.0em; line-height: 1.5; letter-spacing: .05em; text-align: left;   }
.story-data .ep-tdmenu{ position: relative; padding: 4em 2em 3em 2em; background-color: rgba(255,255,255,.8); border:#a78f39 solid 2px; z-index: 2; pointer-events: all; }
.story-data .tdmenu-title{ width: calc( 611/3000*100vw); position: absolute; top:-4em; left:0; right: 0; margin: 0 auto; }
.story-data .tdmenu-pic{ padding: 3.3em 3em; background: url("../images/story-tdmenu-bg.png") no-repeat center center; background-size: contain;  }
.story-data .tdmenu-text{font-size: 1.133em; font-weight: 700; letter-spacing: .03em; padding-top: .5em; margin-bottom: 0;  }
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }

/* character */
#Page_Character .part-foreground{ overflow: inherit; }
.cont-sub-character{ }
.cont-sub-character > .inner{  }
.sub-content-container.sub-character-container{ min-height: 55vw; }

.character-bg{ width: 100%; min-height: 100%; position: absolute; bottom: 0; left:0; background: url("../images/character-bg-image.jpg") no-repeat center bottom; background-size: 100%; mix-blend-mode: multiply;  }

.cont-character-navi{ margin: 0 auto; }
.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: calc(1/5*100%); display: block; margin: 0; padding: 1.0em; }
.character-navi ul li a{ display: block; line-height: 0; background-size: 100%; padding-bottom: 1em;  transition: all .1s ease 0s;}
.character-navi ul li a:hover{ transform: scale(1.05,1.05) rotate(5deg); }
.character-navi ul li.crt a{ pointer-events: none; }

.modal-character{ position: absolute; top:0; left:0; pointer-events: auto; }
.modal-character::before{ content:""; width: 100%; min-height: 100%; background: rgba(0,0,0,.7); position: absolute; top:0; left:0; }
.character-data-frame{ width: 100%; background: url("../images/common/tx-paper.png") repeat center center; background-size: calc( 1000/3000*100vw); border-top:#a78f39 solid 2px; border-bottom:#a78f39 solid 2px; padding: 2em 0; position: absolute; top:10em; left:0; } 
.character-data-frame::before,
.character-data-frame::after{ content:""; width: 100%; height: calc( 60/3000*100vw); position: absolute; bottom:0; left:0; background:#FFF url("../images/common/frame-bar.png") repeat-x center center; background-size: calc( 40/3000*100vw); }
.character-data-frame::after{ top: 0; bottom: inherit; }

.character-cursor{ display: block; position: absolute; width: 80%; top:40vh; left: 10%; 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(97/3000*100vw); height: calc(133/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/character-cursor.png") no-repeat center center; background-size: 100%; transform-origin: center center; }
.character-cursor ul li span:hover{ background-image: url("../images/character-cursor-hv.png"); text-decoration: none; }
.character-cursor ul li.right span{ transform: scale(-1,1); }
.character-cursor ul li.off{ pointer-events: none; opacity: .1; }

.character-close{ display: block; position: absolute; top:-6em; right: 1em;  }
.character-close a{ display: block; width:calc(146/3000*100vw); height: calc(146/3000*100vw); position: relative; text-decoration: none; }
.character-close a span{ display: block; width:100%; min-height: 100%; background: url("../images/character-close.png") no-repeat center center; background-size: 100%; transform-origin: center center; position: relative;}

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

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

.character-data .chr-img{ position: relative; z-index: 3; width: calc(900/3000*100vw); }
.character-data .chr-face{ position: absolute; top:0; left: calc(900/3000*100vw); z-index: 3; width: calc(1100/3000*100vw); }
.character-data .chr-prof{ position: absolute; top: calc(840/3000*100vw); left: calc(900/3000*100vw); z-index: 3; width: calc(1100/3000*100vw); background: #FFF; border-radius: 2em; padding: 1.5em; }
.character-data .chr-prof.noface{ top: calc(420/3000*100vw); }

.character-data .chr-ic{ position: relative; text-align: center; }
.character-data .chr-ic > span{ display: inline-block; width:6em; margin-bottom: .8em; }

.character-data .chr-prof .name-ja{ font-size: 2.666em; font-weight: 900; margin-bottom: .1em; letter-spacing: .1em; text-align: center; }
.character-data .chr-prof .cv-ja{ font-size: 1.466em; font-weight: 700; margin-bottom: .1em; letter-spacing: .1em; text-align: center;}
.character-data .chr-prof .name-cv-en{ font-size: 1.2em; color: #a53e19; font-weight: 700; margin-bottom: .8em; letter-spacing: .05em; text-align: center;}
.character-data .chr-prof .profile-j{ font-size: 1.333em; letter-spacing: .05em;}
.character-data .chr-prof .profile-e{ font-size: 1.133em; color: #a53e19; letter-spacing: .05em; margin-bottom: 0;}

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


/* music */
.cont-sub-music{ }
.cont-sub-music > .inner{ padding: 2em; padding-top: 0; }
.sub-content-container.sub-music-container{  }

.music-container{ width: 100%; margin: 0 auto; text-align: center; letter-spacing: .1em; }

.cont-music-navi{ position: relative; margin: 0 auto 2em auto; z-index: 2; }
.music-navi{ margin: 0 auto; }
.music-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; position: relative; }
.music-navi ul li{  display: block; margin: 0; padding: .1em .5em; position: relative;}
.music-navi ul li.spc-sp{ display: none; }
.music-navi ul li a{ display: block; width: 100%; padding: .5em .8em; background-color: #fff; border: .2em solid #a78f39; border-radius: .5em; color: #a78f39; text-align: center; position: relative; }
.music-navi ul li a span{ font-size: 1.333em; font-weight: bold; }
.music-navi ul li a:hover{ border-color: #4f2d21; color: #4f2d21; text-decoration: none; }
.music-navi ul li.crt a{ border-color: #4f2d21; color: #4f2d21; pointer-events: none; }
.music-navi ul li.cs a{ border-color: #fff; color: #999; pointer-events: none; }

.music-data{ display: none;}
.music-data { max-width: 60em; margin: 0 auto; color: #4f2d21; padding: 1em 0;}
.music-data > .block{ padding: 1em 0; margin-bottom: .3em; }
.music-data > .block.block-btm{ margin-bottom: 0; }
.music-data.crt{ display: block; animation: fadeIn 1.0s 0s ease-out both; }

.music-jk-sdw{ filter: drop-shadow(0 0 .3em #ffa21d); }

/* bddvd */

.bd-cat-navi{ width: 100%; display: block; position: absolute; top:0; left:0; z-index: 2; }
.bd-cat-navi ul{ width: 100%; display: flex; padding: 0; margin: 0; list-style-type: none; }
.bd-cat-navi ul li{ display: block; width: 50%; text-align: center; padding: .2em; } 
.bd-cat-navi ul li a{ display: block; padding: .5em; color: #a78f39; background-color: #FFF; border: #a78f39 solid .2em; text-decoration: none; }
.bd-cat-navi ul li a:hover{ color: #FFF; background-color: #4f2d21; border-color:#4f2d21; }
.bd-cat-navi ul li.crt a{ color: #FFF; background-color: #4f2d21; border-color:#4f2d21; pointer-events: none; }
.bd-cat-navi ul li a span{ display: block; font-size: 1.333em; font-weight: bold; }

.cont-sub-bddvd{ padding-top: 3em; }
.cont-sub-bddvd > .inner{ padding: 2em; padding-top: 0; }


.sub-content-container.sub-bddvd-container{  }

.bdbox-container{ width: 100%; margin: 0 auto; text-align: center; letter-spacing: .1em; }

.cont-bdbox-navi{ position: relative; margin: 0 auto 2em auto; z-index: 2; }
.bdbox-navi{ margin: 0 auto; }
.bdbox-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; position: relative; }
.bdbox-navi ul li{  display: block; margin: 0; padding: .5em .5em; position: relative;}
.bdbox-navi ul li.spc-sp{ display: none; }
.bdbox-navi ul li a{ display: block; width: 100%; padding: .5em .8em; background-color: #fff; border: .2em solid #a78f39; border-radius: .5em; color: #a78f39; text-align: center; position: relative; }
.bdbox-navi ul li a span{ font-size: 1.333em; font-weight: bold; }
.bdbox-navi ul li a:hover{ border-color: #4f2d21; color: #4f2d21; text-decoration: none; }
.bdbox-navi ul li.crt a{ border-color: #4f2d21; color: #4f2d21; pointer-events: none; }
.bdbox-navi ul li.cs a{ border-color: #fff; color: #999; pointer-events: none; }

.bdbox-data{ display: none;}
.bdbox-data { max-width: 60em; margin: 0 auto; color: #4f2d21; padding: 1em 0;}
.bdbox-data > .block{ padding: 1em 0; margin-bottom: .3em; }
.bdbox-data > .block.block-btm{ margin-bottom: 0; }
.bdbox-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{ border: #fff solid 2px; background-color: #fff; }
.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-x1.x1-dbl{ width: 50%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list .item-col{ width: 100%; }
.bnf-list .item-col-x2{ width: calc((100% - (0.5em * 1)) / 2); margin-right: .5em; }
.bnf-list .item-col-x2:nth-of-type(2n){ margin-right: 0;}
.bnf-list .item-col-x2:last-child{ margin: 0; }
.bnf-list .item-col-x3{ width: calc((100% - (0.5em * 2)) / 3); margin-right: .5em; }
.bnf-list .item-col-x3:nth-of-type(3n){ margin-right: 0;}
.bnf-list .item-col-x3:last-child{ margin: 0; }
.bnf-list .item-col-x4{ width: calc((100% - (0.5em * 3)) / 4); margin-right: .5em; }
.bnf-list .item-col-x4:nth-of-type(4n){ margin-right: 0;}
.bnf-list .item-col-x4:last-child{ margin: 0; }

.bnf-list .shop{ width: 100%; font-size: 0.777em; color: #a78f39; padding: 0; margin-bottom: .5em; background-color: rgba(0,0,0,.05); }
.bnf-list .shop::before{ content:"[ "; }
.bnf-list .shop::after{ content:" ]"; }
.bnf-list .thumb{ padding:1em 1em; 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: 25em; }
.bnf-list .thumb .inner a{ display: block; height: 21em; position: relative; }
.bnf-list .thumb .inner img.vt{ max-width: auto; height: 100%; width: auto\9;}
.bnf-list .thumb.np{ pointer-events: none; }
.bnf-list .data{ width: 100%; }
.bnf-list .excond{ font-size: 0.666em; color: #a78f39; margin-bottom: .3em; }
.bnf-list .name{ font-size: .8em; letter-spacing: -0.05em; margin-bottom: .3em; font-weight: 700; }
.bnf-list .cond{ font-size: 0.777em; margin-bottom: .3em; border:#a78f39 solid 1px; display: inline-block; padding: .1em .2em; color: #a78f39; }
.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;  }


/* books */
.cont-sub-books{ }
.cont-sub-books > .inner{ padding: 2em; }
.sub-content-container.sub-books-container{  }

.books-list{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto 1em auto;}
.books-list > div{width: calc(380/3000*100vw);margin: .5em 1em;}
.books-list > div p{ font-size:1.2em; margin-bottom: 0; letter-spacing: .05em; text-align: center;}


/* special */
.cont-sub-special{ }
.cont-sub-special > .inner{ padding: 2em; }
.sub-content-container.sub-special-container{  }

.movie-list{ display: flex; flex-wrap: wrap; justify-content: center; padding: 2em 0 1em 0; }
.movie-list > div{ width: calc( (100% - (1.5em * 3)) / 3 ); margin: .725em; }
.movie-list > div p{ margin-bottom: 0; }

.special-list{ display: flex; flex-wrap: wrap; justify-content: center; padding: 2em 0 1em 0; }
.special-list > div{ width: calc( (100% - (1.5em * 2)) / 2 ); margin: .725em; }
.special-list > div p{ margin-bottom: 0; }

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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* 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) {
.global-navi > ul > li.crt a{ color:#fff;  }
.global-navi > ul > li.crt a::before{ content:""; display: block; width: calc( 32/3000*100vw); min-height: calc( 47/3000*100vw); position: absolute; top:0; left:0; right:0; margin: 0 auto; background: url(../images/navi/marker.png) no-repeat center top; background-size: auto 100%;  }
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {

/* header */
.part-header{ position: fixed; top:0; min-height: 100%; background-color: rgba(0,0,0,0); transition: all .2s ease 0s; }
.part-header::before{ content:""; width: 100%; min-height: 100vh; position: absolute; top:0; background: url("../assets/top/vis-ep3/sp-nv-bg.jpg") no-repeat center top; background-size: 100%; opacity: 0; transition: all .3s ease .2s; }
.part-header::after{ content:""; width: 100%; position: absolute; top:0; padding-bottom: 1em; border-bottom:#a78f39 solid 2px; background: #673539 url("../images/common/tx-leather.png") repeat center center; background-size: calc( 1000/1000*100vw); z-index: 2; }
.cont-global-navi{ width: 45%; min-height: 100vh; margin: 0 auto; padding:5em 0 0 0; border-bottom:none; background-size: calc( 1000/1000*100vw); }
.cont-global-navi{ display: none; }

.global-navi{ }
.global-navi > ul{ display: flex; flex-wrap: wrap; padding: 0 1em; margin: 0; }
.global-navi > ul > li{ width: 100%; padding: 1.2em 0 ; margin: 0; line-height: 1; text-align: center; border:1px solid transparent; border-bottom: 1px solid #a78f39; border-image: linear-gradient(to right, #552d30 0%,#a78f39 20%,#a78f39 80%, #552d30 100%); border-image-slice: 0 0 1; }
.global-navi > ul > li a{ display: block; padding-top: 0; position: relative; text-decoration: none; pointer-events: all; color:#fff; }
.global-navi > ul > li a > span{ font-size: 1.866em; }
.global-navi > ul > li a:hover{ color:#fff;  }
.global-navi > ul > li a:hover::before{ display: none; }
.global-navi > ul > li.cs a{ color: #666; pointer-events: none; }

.cont-sp-btn{ display: block; position: absolute; top:0; pointer-events: none; z-index: 5; }
.cont-sp-btn a{ text-decoration: none; line-height: 1; }
.cont-sp-btn .sp-navi-open{ width: calc( 107/1000*100vw); margin:0 auto; pointer-events: all; }
.cont-sp-btn .sp-navi-close{ width: calc( 107/1000*100vw); margin:0 auto; pointer-events: all; display: none; }

.part-header.on{  background-color: rgba(0,0,0,1); }
.part-header.on::before{ opacity: 1; }
.part-header.on .cont-global-navi{ display: block; }
.init .part-header.on .cont-global-navi{  }
.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{ margin: 0 auto; padding: calc( 180/3000*100vw) 0 0 0; min-height: calc(100vh - 3.0em); background-size: calc( 1000/1000*100vw); }
.part-body::before{ min-height: calc( 468/3000*100vw); background-size: 100%; }
.cont-upper{ position: relative; }
.cont-middle{ position: relative; }
.sub-page .cont-middle::before{ background-image: url("../images/common/bg-board1-sp.jpg"); }
.sub-page .cont-middle.bd2::before{ background-image: url("../images/common/bg-board2-sp.jpg"); }
.sub-page .cont-middle.bd3::before{ background-image: url("../images/common/bg-board3-sp.jpg"); }
.sub-page .cont-middle.bd4::before{ background-image: url("../images/common/bg-board4-sp.jpg"); }
.sub-page .cont-middle.bd5::before{ background-image: url("../images/common/bg-board5-sp.jpg"); }

.cont-middle-background{ width: 100%; padding: 11em 0 3em 0; background-size: calc( 1000/1000*100vw); }
.sub-page .cont-middle-background{ padding: 5em 0 3em 0; background: none;}
.sub-page .cont-middle-background::before{ content:""; width: 100%; min-height: 100%; padding:0; margin: 0; position: absolute; top:0; background: #673539 url("../images/common/tx-leather.png") repeat center center; background-size: calc( 1000/3000*100vw); mix-blend-mode: multiply; }

.cont-top-content{ width: 85%; margin: 0 auto; padding: 1.5em; background: #FFF; border:#a78f39 solid 2px;  }
.cont-sub-content{ width: 85%; margin: 0 auto; padding: 1.5em; background: rgba(255,255,255,.9); border:#a78f39 solid 2px; }

.top-cont-title{ position: relative; line-height: 1; margin-bottom: 1.0em; text-align: center; }
.top-cont-title > h2{ font-size: 1em; margin: 0; padding: 0 2em; display: inline-block; position: relative; }
.top-cont-title > h2::before,
.top-cont-title > h2::after{ width: calc( 75/1000*100vw*.6); min-height: calc( 99/1000*100vw*.6); top:-0.2em; left:0; }
.top-cont-title > h2::after{ left: inherit; right: 0; }
.top-cont-title > h2 > span{ font-size: 2.0em; }

.sub-cont-title{ position: relative; line-height: 1; margin-bottom: 1.0em; text-align: center; }
.sub-cont-title > h2{ font-size: 1em; margin: 0; padding: 0 4em; display: inline-block; position: relative; filter: drop-shadow(0 0 .3em #ffa21d); }
.sub-cont-title > h2::before,
.sub-cont-title > h2::after{ width: calc( 95/1000*100vw*.6); min-height: calc( 127/1000*100vw*.6); top:-0.2em; left:0;}
.sub-cont-title > h2::after{ left: inherit; right: 0; }
.sub-cont-title > h2 > span{ font-size: 2.666em; }

.frame-top-content{ padding: 2em 1em; background: #FFF; border:#a78f39 solid 1px; position: relative; }
.frame-top-content::before,
.frame-top-content::after{ min-height: calc( 60/1000*100vw*.7); top:0; left:0; background-size: calc( 40/1000*100vw*.7); }
.frame-top-content::after{ top: inherit; bottom: 0; }

/* footer */
.part-footer{ background-size: 200%;}
.part-footer::after{ min-height: calc( 68/1000*100vw*.7); background-size: calc( 170/1000*100vw*.7);}
.cont-global-footer{ margin: 0 auto; padding:0; position: relative; text-align: center; }
.footer-pagetop{ width: calc( 162/30 * 1em * .7 ); height: calc( 162/30 * 1em * .7 ); bottom:1.5em; }
.footer-banner a{ width: calc(640/1000*100vw*0.7); }


.bar-a{ min-height: calc( 60/1000*100vw*.7); background-size: calc( 40/1000*100vw*.7); }

.cont-entries{ margin: 0 auto; padding-bottom: 3em; }
.content-entry{ box-sizing: border-box; margin-bottom: 4em; }
.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-head{ padding-left: 0; }
.content-entry .entry-body{ padding-left: 0;}

.content-entry .entry-date{ position: relative; top:inherit; left:inherit; margin-bottom: .5em; }
.content-entry .entry-date > span{ font-size: 1em; }
.content-entry .entry-title{ font-size: 1em; margin-bottom: .5em; padding: 0; }
.content-entry .entry-title > div{ padding: 0 0 1.5em 0; background-size:calc(341/1000*100vw*0.6); }






/* TOP-PAGE */
/* main */
.cont-top-visual{ position: relative; border-bottom:#a78f39 solid 1px; }
.cont-top-visual::after{ min-height: calc( 56/1000*100vw*.7); background-size: calc( 56/1000*100vw*.7); position: absolute; bottom:-.7em; }

.kv-container .logo{ width: 60%; top:88vw; left: 0; right: 0; margin: 0 auto; position: absolute;}
.kv-container .oa{ width: 80%; top: 112vw; left: 0; right: 0; margin: 0 auto; position: absolute;}

.cont-top-visual-catch{ width: 95%; bottom: -22vw; }

.cont-top-visual-switch{ width: 85%; top: 125vw; z-index: 5;}
.cont-top-visual-switch .vis-switch{ display: flex; justify-content: center; position: relative; }
.cont-top-visual-switch .vis-switch > div{ width: calc( (100% - 5em) / 6 ); margin: 0 1em 0 0; }
.cont-top-visual-switch .vis-switch > div:last-child{ margin-right: 0; }
.cont-top-visual-switch .vis-switch > div a{ padding-bottom: calc(61/1000*100vw*.7); background-size: calc(88/1000*100vw*.7); }
.cont-top-visual-switch .vis-switch > div a img{ border:#a78f39 solid 1px; }


.kv-container .oa,
.kv-container .logo{ opacity: 0; }


.init .kv-container .logo{ transform: translate(0,-230%) scale(1.3,1.3); }
.init .kv-container .oa{ transform: translate(0,-500%) scale(1.3,1.3) ; }

.s1 .kv-container .logo{ transform: translate(0,-230%) scale(1,1) ; opacity: 1; transition: all 2.0s ease 1.5s; } 
.s1 .kv-container .oa{ transform: translate(0,-500%) scale(1,1) ; opacity: 1; transition: all 2.0s ease 1.7s; } 

.s2 .kv-container .logo{ transform: translate(0,0) ; opacity: 1; transition: all 2.0s ease 0s; } 
.s2 .kv-container .oa{ transform: translate(0,0) ; opacity: 1; transition: all 2.0s ease 0s; } 

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

.kv-container .grp3{ display: block; }



/* nekoya */
.cont-top-nekoya{ width: calc( 335/1000*100vw*.5 ); position: absolute; top:-3.1em; }

/* news twitter */
.cont-top-news-twitter{ margin: 0 auto 1.5em auto; padding: 5em 0 0 0; }
.cont-top-news,
.cont-top-twitter{ width: 100%; }
.cont-top-news-twitter .top-cont-title{ top:-3em;  }

/* news */
.cont-top-news{ margin-bottom: 5em; }

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

/* movie */
.cont-top-movie{ }
.cont-top-movie .movie-player-frame{ border:#a78f39 solid 2px; margin-bottom: .5em; }
.cont-top-movie .movie-navi{ display: flex; flex-wrap: wrap; justify-content: center; }
.cont-top-movie .movie-navi .th{ width: 50%; }
.cont-top-movie .movie-navi .th a{ border:#a78f39 solid 2px; }



/* SUB-PAGE */
/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{ padding: 1em; }

/* onair */
.cont-sub-onair{ }
.cont-sub-onair > .inner{ padding: 1em; }
.onair-bg{ background-image: url("../images/onair-bg-image-sp.jpg") ; background-size: 100%; }

.onair-list{ margin: 0 auto .5em 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; }

/* staffcast */
.cont-sub-staffcast{ }
.cont-sub-staffcast > .inner{ padding: 1em; }

.staffcast-bg{ width: calc(1267/1000*100vw*.4); min-height: calc(936/1000*100vw*.4); position: absolute; top: 340vw; left:35vw; background-image: url("../images/staffcast-bg-image-sp.jpg"); }

/* introduction */
.cont-sub-intro{ }
.cont-sub-intro > .inner{ padding: 1em; }
.intro-bg{ background-image: url("../images/intro-bg-image-sp.jpg") ; background-size: 200%;   }
.intro-text.ja{ font-size: 1.333em; }

/* story */
.cont-sub-story{ }
.cont-sub-story > .inner{ padding: 0em; }
.story-bg{ background-image: url("../images/intro-bg-image-sp.jpg") ; background-size: 200%; }

.story-data{ position: relative; display: none; pointer-events:none; text-align: center; }

.story-navi ul li{ width: 100%; padding: 0 1.0em; }

.story-navi ul li a:before{ width:calc( 126/3000*100vw*2.5); height:calc( 89/3000*100vw*2.5); }
.story-navi ul li .epnum{ font-size: 1.133em; top:1.75em; }
.story-navi ul li .epttl{ font-size: 1.133em; padding-top: .5em; }

.story-data .story-block{ position: relative; padding: 2em 0 0 0; }
.story-data .ep-title{ line-height: 1.5;}
.story-data .ep-title > h2::before,
.story-data .ep-title > h2::after{ width: calc( 95/3000*100vw*2); min-height: calc( 127/3000*100vw*2); top:0.6em; }
.story-data .ep-title > h2::after{ }
.story-data .ep-title > h2 > span{ font-size: 1.5em; }
.story-data .ep-title > .en > span{ font-size: 1.0em; }
.story-data .ep-slider-sceneImage .sld img{ border:#a78f39 solid 2px; }
.story-data .ep-slider-thumb > div{ padding: 0 .2em; }
.story-data .ep-slider-thumb > div > a img{ border:#a78f39 solid 2px; }

.story-data .ep-text{ padding: 0 1em; margin-bottom: 5em; }
.story-data .ep-text .subt-ja{ font-size: 1.6em; }
.story-data .ep-text .subt-en{ font-size: 1.2em; }
.story-data .ep-text .text-ja{ font-size: 1.2em; }
.story-data .ep-text .text-en{ font-size: 1.0em; }
.story-data .ep-tdmenu{ padding: 4em 2em 1em 2em; border:#a78f39 solid 1px; }
.story-data .tdmenu-title{ width: calc( 611/3000*100vw*2); top:-3em; }
.story-data .tdmenu-pic{ padding: 3.3em 3em; background: url("../images/story-tdmenu-bg.png") no-repeat center center; background-size: contain;  }
.story-data .tdmenu-text{font-size: 1.133em; margin-bottom: 2em;  }
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }


/* character */
.cont-sub-character{ }
.cont-sub-character > .inner{ padding: 0em; }
.sub-content-container.sub-character-container{ min-height: 120vw; }

.character-bg{ background-image: url("../images/character-bg-image-sp.jpg") ; background-size: 150%;   }

.character-navi ul li{ width: calc(1/3*100%); display: block; margin: 0; padding: 1.0em; }

.modal-character{ position: absolute; top:0; left:0; pointer-events: auto; }
.character-data-frame{ background-size: calc( 1000/1000*100vw); padding: 2em 0; top:5em; } 
.character-data-frame::before,
.character-data-frame::after{ height: calc( 60/1000*100vw*.7); bottom:0; left:0; background-size: calc( 40/1000*100vw*.7); }
.character-data-frame::after{ top: 0; bottom: inherit; }

.character-cursor{ width: 96%; top:40vh; left: 2%; }
.character-cursor ul li{ width:calc(97/1000*100vw*.7); height: calc(133/1000*100vw*.7);  }
.character-close{ top:-4em; right: 1em;  }
.character-close a{ width:calc(146/1000*100vw*.6); height: calc(146/1000*100vw*.6); }


.character-data-container{ width:100%; min-height: 40vw; }
.cont-character-data{ width:100%; display: none; }
.character-data{ position: relative; }
.character-data .chr-img{ position: relative; z-index: 3; width: 70%; margin: 0 auto; }
.character-data .chr-face{ display: none; position: absolute; top:3em; left: 50%; z-index: 3; width: 40%; }
.character-data .chr-prof{ position: relative; top: inherit; left: inherit; z-index: 3; width: 80%; background: rgba(255,255,255,.85); margin: -2em auto 2em auto; }
.character-data .chr-prof.noface{ top: inherit; }

.character-data .chr-ic{ position: relative; text-align: center; }
.character-data .chr-ic > span{ display: inline-block; width:6em; margin-bottom: .8em; }

.character-data .chr-prof .name-ja{ font-size: 2.666em; font-weight: 900; margin-bottom: .1em; letter-spacing: .1em; text-align: center; }
.character-data .chr-prof .cv-ja{ font-size: 1.466em; font-weight: 700; margin-bottom: .1em; letter-spacing: .1em; text-align: center;}
.character-data .chr-prof .name-cv-en{ font-size: 1.2em; color: #a53e19; font-weight: 700; margin-bottom: .8em; letter-spacing: .05em; text-align: center;}
.character-data .chr-prof .profile-j{ font-size: 1.333em; letter-spacing: .05em;}
.character-data .chr-prof .profile-e{ font-size: 1.133em; color: #a53e19; letter-spacing: .05em; margin-bottom: 0;}

/* .character-data.crt{ display: block; }
.character-data.crt .chr-img{ animation: anm-character-change .5s .05s ease-out both running; }
@keyframes anm-character-change {
  0% { opacity: 0; transform: scale(.2,1.2) rotateY(180deg);}
  100% { opacity: 1; transform: scale(1,1) rotateY(0deg);}
} */

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

/* bddvd */
.bd-cat-navi ul li a span{ font-size: 1.2em;  }

.cont-sub-bddvd{ }
.cont-sub-bddvd > .inner{ padding: 1em; }
.sub-content-container.sub-bddvd-container{  }

.bdbox-navi{ margin: 0 auto; }
.bdbox-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; position: relative; }
.bdbox-navi ul li{  display: block; margin: 0; padding: .5em .5em; position: relative;}
.bdbox-navi ul li.spc-sp{ display: block; width: 100%; pointer-events: none; padding: 0; line-height: 0; }
.bdbox-navi ul li a{ display: block; width: 100%; padding: .5em .8em; background-color: #fff; border: .2em solid #a78f39; border-radius: .5em; color: #a78f39; text-align: center; position: relative; }
.bdbox-navi ul li a span{ font-size: 1.0em; font-weight: bold; }

.bdbox-data{ display: none;}
.bdbox-data { max-width: 35em; }
.bdbox-data.crt{ display: block; animation: fadeIn 1.0s 0s ease-out both; }

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

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

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

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

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


/* books */
.cont-sub-books{ }
.cont-sub-books > .inner{ padding: 1em; }
.sub-content-container.sub-books-container{  }

.books-list{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto 1em auto;}
.books-list > div{width: calc(380/1000*100vw*.75);margin: .5em 1em;}
.books-list > div p{ font-size:1.2em; margin-bottom: 0; letter-spacing: .05em; text-align: center;}


/* special */
.cont-sub-special{ }
.cont-sub-special > .inner{ padding: 1em; }
.sub-content-container.sub-special-container{  }

.movie-list{ display: flex; flex-wrap: wrap; justify-content: center; padding: 2em 0 1em 0; }
.movie-list > div{ width: calc( (100% - (1.5em * 2)) / 2 ); }

.special-list > div{ width: 100%; margin-bottom: 1.5em; margin-right: 0; }



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