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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #000; background:#fff url("../images/common/bg-pattern.png") repeat center top; background-size: calc(1280/3000*100vw) 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; pointer-events: none; }
.part-foreground{ position: absolute; width: 100%; min-height:100%; overflow: hidden; z-index: 999; pointer-events: none; }
.part-header{ position: absolute; z-index: 1000; }
.part-body{ position: relative; }
.part-footer{ position: relative; }


/* header */
.part-header{ pointer-events: none; position: fixed; top:0; right:0; }
.global-logo{ width: 33em; position: absolute; top:11.25em; left:-93.25vw; display: none; z-index: 2; }

.cont-global-navi{ width: 5.3vw; height: 100vh; position: absolute; top:0; right: 0; pointer-events: none; background: linear-gradient(180deg, rgba(164,0,62,1) 0%, rgba(164,0,62,1) 40%, rgba(0,0,0,1) 100%); }
.global-navi{ width:94.7vw; height: 100vh; margin: 0 ;  position: absolute; top:0; left:-94.7vw; visibility: hidden; pointer-events: none;}
.global-navi:before{ content:""; display: block; width:1%; height: 100%; margin: 0 ; background-color:rgba(255,255,255,.6); position: absolute; top:0; right:0; transition: all .5s ease 0s;}
.global-navi > ul{ width: 100%; display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: wrap; list-style-type: none; padding: 5em 5em 0 0; margin: 0 0 0 auto; position: relative; }
.global-navi > ul > li{ text-align: right; display: inline-block; padding: 0 ; margin: 0; line-height: 1; position: relative; filter: drop-shadow(0 0 .2em rgba(255,255,255,1)) drop-shadow(0 0 .4em rgba(255,255,255,1));}
.global-navi > ul > li a{ display: inline-block; position: relative; letter-spacing: .05em; padding: 0 0 .4em 0; font-size: 2.5em; font-weight: 300;line-height: 1; color: #e4007f; position: relative; transform-origin: right center; pointer-events: all; transition: all .1s ease-out 0s;  }
.global-navi > ul > li a > span{  }
.global-navi > ul > li a:hover{ text-decoration: none; transform: scale(1.1,1.1); }
.global-navi > ul > li a:hover > span{  color: #e4007f; }
.global-navi > ul > li.crt a{ pointer-events: none; }
.global-navi > ul > li.crt a > span{  color: #a3003e; }
.global-navi > ul > li.cs a{ pointer-events: none; color: #AAA;  }

.global-season{ width: 2em; margin: 0; position: fixed; top:9em; right: 1.5em; display: block; }
.global-season > div{ display: block; padding: 0 ; margin: 0 0 1.5em 0 ; line-height: 1; }
.global-season > div a{display: block; width: 100%; padding: 0;text-align: center;line-height: 0; text-decoration: none; pointer-events: auto;}
.global-season > div a:hover{ text-decoration: none; transform: scale(1.1,1.1); transform-origin: center center; }

.global-share{ width: 2.5em; margin: 0; position: fixed; bottom:5em; right: 1.35em; display: block; }
.global-share > div{ display: block; padding: 0 ; margin: 0 0 1.5em 0 ; line-height: 1; }
.global-share > div a{display: block; width: 100%; padding: 0;text-align: center;line-height: 0; text-decoration: none; pointer-events: auto;}
.global-share > div a:hover{ text-decoration: none; transform: scale(1.1,1.1); transform-origin: center center; }

.cont-sp-btn{ display: block; width: 2.96vw; position: absolute; top:1.1vw; right: 1.1vw; pointer-events: all; }
.cont-sp-btn a{ display: block; line-height: 0; }
.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-global-navi{ display: block; }
.spmenu-on .global-logo{ display: block; transition: all .1s ease 1.5s;}
.spmenu-on .global-navi{ visibility: visible; pointer-events: auto; }
.spmenu-on .global-navi:before{ width: 100%;  }
.spmenu-on .cont-sp-btn .sp-navi-open{ display: none; }
.spmenu-on .cont-sp-btn .sp-navi-close{ display: block; }
.spmenu-on .part-body,
.spmenu-on .part-footer{ filter: blur(4px); }

/* body */
.part-body{ margin: 0 auto; }
.top-page .part-body{ width:94.7vw; margin: 0; display: flex; flex-wrap: wrap; align-items: flex-start; }
.cont-upper{ position: relative; }
.top-page .cont-upper{ width: calc(1080/3000*100vw); top:0; }
.cont-middle{ position: relative; }
.top-page .cont-middle{ width: calc(1760/3000*100vw); }
.cont-middle2{ position: relative; }
.top-page .cont-middle2{ width: 100%; }

.cont-top-content{   }
.cont-top-content > .inner{  }
.cont-top-upper{ position: relative; }
.cont-top-upper > .inner{ padding: 1em 0; }
.cont-sub-content{ width: calc(2348/3000*100vw); }
.cont-sub-content > .inner{ padding: 2.2em 5.2em;  }
.cont-sub-upper{ position: relative; }
.cont-sub-upper > .inner{ padding: 2.2em; }

.top-conttitle{ font-size: 1em; margin: 0 auto 4em auto; text-align: center; }
.top-conttitle > div{ width: calc(1160/3000*100vw); margin: 0 auto;  }
/* .sub-conttitle{ font-size: 1em; margin: 0 auto; text-align: center; position: relative; z-index: 2; }
.sub-conttitle > div{ width: calc(2032/3000*100vw); margin: 0 auto; } */
.cont-subtitle{ font-size: 1em; margin: 0 auto; text-align: center; }
.cont-subtitle > div{ width: calc(880/3000*100vw); margin: 0 auto; }

.sub-cont-container{ }

.body-bg{ height: 100%; width: calc(652/3000*100vw); background-color: #FFF; position: absolute; top:0; right:0; pointer-events: none; }
.body-bg .bg{ height: 100vh; width: 100%; position: sticky; top:0; right:0; background: url("../images/common/body-bg3.webp") no-repeat 0 0; background-size: auto 100%;opacity: .5; }

.top-oa-b{ width: calc(1046/3000*100vw); margin-left: .5vw;}
.top-logo{ padding: 4em 1.5em 3em 1.5em; }
.sub-logo{ display: block; width:calc(534/3000*100vw); pointer-events: auto; }
.sub-subtitle{ width: 50vw; border-bottom:#a3003e solid 1px; position: absolute; top:7vw; right:27vw; text-align: right; line-height: 1; }
.sub-subtitle > span{ font-size: 2.6em; font-weight: 300; letter-spacing: .5em; color: #a3003e; }

.block-title{ background: rgba( 0,0,0,.1); position: relative; line-height: 1; padding: 0; overflow: hidden; }
.block-title > p{ display: inline-block; padding: .5em 5em .5em .5em; margin: 0;  position: relative; }
.block-title > p > span{ font-size: 1.5em; font-weight: 400; color: #FFF; position: relative; letter-spacing: .05em; }
.block-title > p:before{ content:""; display: inline-block; background-color:#a3003e; width: 100%; height: 100%; position: absolute; top:0; left:-2.5em; transform: skew(45deg); }

/* footer */
.part-footer{  }
.cont-global-footer{ }
.cont-global-footer:before{ content:""; width: 100%; height: 100%; position: absolute; top:0; left:0; background: #a3003e;mix-blend-mode: multiply; }
.footer-pagetop{width: calc( 84/30 * 1em );height: calc( 105/30 * 1em );position: fixed; bottom:1.1em; right: 1.1em;z-index: 2000;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{ width: 94.7vw; text-align: center; padding: 0 0 1vw 0; }
.cont-footer > .sep{ width: 95%; margin: 0 auto 0 2.5%; height: 1px; background-color: #000; opacity: .3; margin-bottom: 1.5em; }

.footer-navi{ width: 100%; margin: 0 auto 1.5em auto; position: relative; display: block; padding: 2.5em 0; background-color: rgba(0,0,0,.25); }
.footer-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; padding: 0 1em; margin: 0;  }
.footer-navi > ul > li{ display: block; padding: 0 1.5em ; margin: 0; line-height: 1; }
.footer-navi > ul > li a{ color: #fff; font-weight: 300; text-decoration: none; }
.footer-navi > ul > li a:hover{ color: #000;  }
.footer-navi > ul > li.cs a{ color: #000; opacity: .3; pointer-events: none; }
.footer-navi > ul > li a > span{ font-size: 1.2em; letter-spacing: .1em;}

.footer-btn{ width: 100%; margin: 0 auto 1.5em auto; position: relative; display: flex; flex-wrap: nowrap; justify-content: center; }
.footer-btn > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; padding: 0 1em; margin: 0;  }
.footer-btn > ul > li{  display: block; padding: .25em 1.25em; margin: 0 0 .5em 0; line-height: 1; border-left:#FFF solid 1px; }
.footer-btn > ul > li:first-child{ border-left:none; margin: 0; }
.footer-btn > ul > li a{ color: #fff; font-size: 1.2em; text-decoration: none; }
.footer-btn > ul > li a:hover{ transform: scale(1.1,1.1); }

.footer-banner{ width: 100%; margin: 0 auto 1.5em auto; position: relative; display: flex; flex-wrap: nowrap; justify-content: center; }
.footer-banner > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; padding: 0 1em; margin: 0;  }
.footer-banner > ul > li{ width: 13.333em; display: block; padding: .5em ; margin: 0; line-height: 1; }
.footer-banner > ul > li a{ color: #fff; font-weight: 900; text-decoration: none; }
.footer-banner > ul > li a:hover{ transform: scale(1.1,1.1); }

.footer-copyrihgt p{ color: #fff; font-size: .8em; margin-bottom: 0; }


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

.table-a{ border-collapse: separate; border-spacing: 2px;}
.table-a th{ padding:0.5em; background-color:rgba(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; }


.frame-a{ background-color: rgba(120,120,120,.05); }
.frame-b{ background-color: rgba(255,255,255,.8); }

.sep-a{ line-height: 0; height: 1em; margin: 0 auto 2em auto; border-bottom:#a3003e dotted .233em;  }

.sdw-a{ filter: drop-shadow(.5em .5em 0 rgba(205,145,46,.2));  }

.cont-ttl-a{ font-size: 1em; line-height: 1.2; display: inline-block; position: relative; padding: 0 1em .9em 1em; margin-bottom: 0; text-align: center; }
.cont-ttl-a:before{ content:""; display: block; background-color: #a3003e; width: 100%; height: .5em; position: absolute; left:0; bottom:0; }
.cont-ttl-a:after{ content:""; display: block; background-color: #e5005a; width: calc(100% - 5em ); height: .5em; position: absolute; left:0; right:0; bottom:0; margin: 0 auto; }
.cont-ttl-a span{  color:#a3003e; font-weight: bold; letter-spacing: .1em; position: relative; display: inline-block; padding: 0 1.3em; z-index: 2; }

.cont-entries{ margin: 0 auto; padding-bottom: 3em; }
.content-entry{  background-color: transparent; border-radius: 0; box-sizing: border-box; margin-bottom: 5em; position: relative; }

.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-head{ margin-bottom: .9em; border-bottom: 1px solid #a3003e; position: relative; }
.content-entry .entry-head:before{ content:""; width: 10em; height: 1px; position: absolute; bottom: -1px; pointer-events: none; background-color: #e5005a; }
.content-entry .entry-body{ font-size: 1.2em; letter-spacing: .1em; line-height: 1.8; }

.content-entry .entry-date{ font-size: 1em; color:#e5005a; line-height: 1; display: inline-block; position: relative; margin: 0 auto .5em auto; }
.content-entry .entry-date > span{ display: inline-block; font-weight: 300; font-size: 1.333em; letter-spacing: .1em; padding: 0 0em; line-height: 1.0; position: relative; }
.content-entry .entry-title{ font-size: 1em; color:#a3003e; margin-bottom: .5em; }
.content-entry .entry-title > span{ font-size: 2em; font-weight: 300; letter-spacing: .1em; line-height: 1.5; }

.modal-data{ display: none; }
.cont-modal{ width: 100%; max-width: 1280px; margin: 0 auto; }
.frame-modal{ background-color: rgba(255,255,255,1); border:#cd9932 solid calc(6/30*1em); padding: 0; }

/* 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; margin-bottom: 0; }
.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ position: relative; margin: 0 auto; overflow: hidden; z-index: 2; }

.cont-top-visual .grp{ width: 100%; margin: 0; position: relative; display: none;}
.cont-top-visual .grp.on{ display: block; }

.kv-container .grp > div{ position: absolute; top:0; }
.kv-container .grp .bg{ top:inherit; position: relative; margin: 0 auto; background-color: #a3003d;  }
.kv-container .grp .vis{ }
.kv-container .grp .sil{ }
.kv-container .catch{ width: calc( 167/3000*100vw); position: absolute; top:24.5vw; left:0; right: 0; margin: 0 auto; }
.kv-container .oa1{ width: calc( 316/3000*100vw); position: absolute; top:0; left: 5vw;  }

/* animetion init */
.kv-container .on .vis,
.kv-container .on .sil,
.kv-container .catch,
.kv-container .oa1,
.kv-container .oa2,
.top-oa-b,
.top-logo{ opacity: 0; }

.s0 .kv-container .on .sil{ transform: scale(1.15); transform-origin: center top; }
.s0 .kv-container .on .vis{ transform: scale(1.1); transform-origin: center top; }
.s0 .kv-container .oa1{ transform: translateY(-5%); }
.s0 .top-oa-b{ transform: translate(0,-10%); }
.s0 .top-logo{ transform: translate(0,10%); }

.s0 .kv-container .on .bg{ background-color: #113; transition: all .5s ease .25s;  }
/* .s1 .kv-container .on .sil{ transform: scale(1.1); opacity: 1; transition: all .5s ease 0s;  } */
.s1 .top-oa-b{ transform: translate(0,0); opacity: 1; transition: all 1.0s ease 0s; }
.s1 .top-logo{ transform: translate(0,0); opacity: 1; transition: all 1.0s ease 0s; }
/* .s1 .kv-container .catch{ transform: translateY(0); opacity: 1; transition: all .5s ease .25s; } */

/* .s1 .kv-container .on .sil{ transform: scale(1); opacity: 0; transition: all .5s ease .25s;  } */
.s1 .kv-container .on .vis{ opacity: 1; transform: scale(1); transition: all .5s ease 0s; }
.s2 .kv-container .oa1{ transform: translateY(0); opacity: 1; transition: all .5s ease .25s; }

/* movie */
.cont-top-movie{ width: 100%; margin-bottom: 0; background-color: #000; border-top:#6a0028 solid 5px; border-bottom:#6a0028 solid 5px; z-index: 2;  }
.cont-top-movie .movie-player-frame{ position: relative; width: 100%; max-width: 1620px; margin:0 auto; }

/* news twitter */
.cont-top-news-twitter.cont-top-content{ width: 100%; margin: 0; position: relative; z-index: 5; }
.cont-top-news-twitter.cont-top-content > .inner{ display: flex; flex-wrap: wrap; align-items:stretch; margin: 0 auto; padding: 0; }
.cont-top-news,
.cont-top-twitter{ width: 100%; padding: 0; position: relative;  }
.cont-top-news{ margin-bottom: 2em; }

.top-news-twitter-title{ width: 10.43vw; margin: 0 auto 0 0; position: relative; z-index: 2; }

/* news */
.cont-top-news{  }
.news-container{ position: relative;  }
.news-container dl{ font-size: 1.0em; margin: 0 2em .5em 0; padding: .5em .5em .5em 3.5em; background-color: #FFF; border:#a3003e solid 1px; border-left:none; position: relative; }
.news-container dl:last-child{ margin-bottom: 0; }
.news-container dl:before{ content:""; width: .2em; height: 2.25em; background: #a3003e; position: absolute; top:1.0em; left:1.6em;  }
.news-container dl dt{ display: inline-block; font-weight: 600; color:#a3003e; margin: 0 ; padding: 0; line-height: 1; }
.news-container dl dt > span{ font-size: 1.333em; }
.news-container dl dd{ display: block; margin: 0; padding: 0; font-size: 1.2em; font-weight: normal; line-height: 1.4; letter-spacing: .1em; font-family: YakuHanJP_Noto, 'smartfont', "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; }
.news-container dl dd a,
.news-container dl dd a:visited{ text-decoration: none;  color:#a3003e; }
.news-container dl dd a:hover{ text-decoration: underline; color:#a3003e; }
.more-btn{ position: relative; text-align:right; margin-right:2em; }
.more-btn > a{ display: inline-block; width: 6.93vw; text-decoration: none; color:#a3003e; padding: 0; position: relative; }

/* twitter */
.cont-top-twitter{ }
.twitter-widget-container{ width: 70%; margin: 1em auto; background-color: #FFF; position: relative; overflow: hidden;  }
.twitter-widget-container iframe{ min-height: 100%; }
.twitter-timeline-container{ padding: .5em; }


/* SUB-PAGE */
/* news */
.cont-entries-news{  }


/* on air */
.onair-list-container{ max-width: 55em; margin: 0 auto; }
.onair-list{ margin: 0 auto 1em auto ; }
.onair-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: left; padding: 1.0em; background-color: rgba(255, 255, 255, 0.8); border:#a3003e solid 1px; border-left:#a3003e solid 6px; border-radius: 0; }
.onair-list:nth-child(even){ margin-left: 2em; }
.onair-list:nth-child(odd){ margin-right: 2em; }

.onair-list.str{ border-left:#a3003e solid 3px;}
.onair-list.str:nth-child(even){ margin-left: 0; }
.onair-list.str:nth-child(odd){ margin-right: 0; }

.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: normal; margin-bottom: 0; letter-spacing: .05em; color: #a3003e; }
.onair-list .schd{ font-size: 1.2em; font-weight: normal; margin-bottom: 0; letter-spacing: .05em; color: #000; display: inline-block; width: 6.5em; }
.onair-list .time{ font-size: 1.2em; font-weight: normal; margin-bottom: 0; letter-spacing: .05em; color: #000; display: inline-block; }
.onair-list .extr{ font-size: .9em; font-weight: normal; margin: .3em 0 0.1em 0; letter-spacing: .05em; color: #000;}
a.onair-list { text-decoration: none; color: #000; pointer-events: all; }
a.onair-list:hover{ background-color: #a3003e; color: #fff; }
a.onair-list:hover .name,
a.onair-list:hover .time{ color: #fff; }

.onair-list-il-container{ max-width: 55em; margin: 0 auto; color: #444; }
.onair-list-il{ margin: 0 auto .5em auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.onair-list-il > a{ width: 32.0%; margin: 0.25%; display: flex; justify-content: center; align-items: center; color: #000; padding: .5em .25em;  background-color: rgba(255, 255, 255, 0.8); border:#a3003e solid 1px; border-left:#a3003e solid 3px; border-radius: 0; text-decoration: none;  }
.onair-list-il > a.dbl{ width: 50.0%; padding: .5em 0; font-size: 1.4em; margin: 0.25%; }
.onair-list-il > a span{ display: block; font-size: .9em; line-height: 1.2; }
.onair-list-il > a.cs{ pointer-events: none; }
.onair-list-il > a:hover{ background-color: #a3003e; color: #fff;}

.onair-list-il-ttl{ text-align: center; margin-bottom: .25em; }
.onair-list-il-ttl > span{ display: inline-block; background: #a3003e; color: #fff; padding: .25em .5em; }

/* story */

.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 a{ display: block; width: 3em; height: 3em; padding-top: .6em; text-align: center; color:#a3003e; border-top: #a3003e solid 1px; border-bottom: #a3003e solid 1px; line-height: 1; position: relative; text-decoration: none; overflow: hidden; }
.story-navi ul > li.n0 a{ width: 12.5em; }
.story-navi ul > li a:before{ content:""; width: 100%; height: 100%; display: block; position: absolute; top:0; left:-1em; background-color:#a3003e; 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: #e5005a; left:0; }
.story-navi ul > li a span{ font-size: 1.433em; font-weight: normal; 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: #a3003e; 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: 2em; display: block; position: relative; z-index: 2; }
.story-data .ep-no{ font-size: 1em; padding: .25em 2em; margin-bottom: 1em; position: relative; display: inline-block; background-color: #a3003e; }
.story-data .ep-no > span{ font-size: 1.4em; color: #fff; font-weight: normal; letter-spacing: .1em; position: relative; }

.story-data .ep-no:before{ content:"●"; color: #FFF; font-size: .3em; position: absolute; top:.5em; left:.5em; }
.story-data .ep-no:after{ content:"●"; color: #FFF; font-size: .3em; position: absolute; bottom:.5em; right:.5em; }

.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:#a3003e; font-weight: normal; letter-spacing: .1em; line-height: 2; display: inline; background-color: rgba(228, 0, 127, 0.05); }
.story-data .ep-slider-sceneImage{ width: 100%; background-color: transparent; border: #a3003e 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: 65%;  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{ margin-bottom: 2em; 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.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }



.intro-container{ display: flex; flex-wrap: wrap; justify-content: center; padding: 2em 0 ; }
.intro-container .fig{ width: 40%; position: relative; }
.intro-fig-frame{ padding: .5em; border:#e9e9e9 solid 1px; background-color:#FFF; filter: drop-shadow( .5em .5em .5em rgba(0,0,0,.5));  transform: rotate(2deg);}
.intro-fig-frame > img{}
.intro-container .text{ width: 100%; position: relative; padding-left: 1em; text-align: center; }
.intro-container .text > p{ font-size:1.333em; line-height: 2.0; letter-spacing: .1em;  }
.intro-container .text > p [data-ruby]::before { top: -1.9em; }

/* staffcast */
.staffcast-list{ width: 100%; text-align: left; display: flex; flex-wrap: wrap; justify-content: left; }
.staffcast-list > div{ width: 25%; }
.staffcast-list.cs > div{ width: 25%;  }
.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 > div{ margin-bottom: 2em; position: relative; }
.staffcast-list .pos{ display: block; font-size: 1.0em; color: #a3003e; letter-spacing: .05em;  margin-bottom: .5em; line-height: 1; }
.staffcast-list.cs .pos{ color: #AAA;  }
.staffcast-list .name{ display: inline-block; font-size: 1.2em; letter-spacing: .05em; margin-bottom: 0; line-height: 1; position: relative; }
.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: 1.25em; position: absolute; top:-0.25em; left:calc(50% + 2.0em); text-decoration: none; pointer-events: auto; }
.staffcast-list .cmt.ch2{ left:calc(50% + 1.5em); }
.staffcast-list .cmt.ch4{ left:calc(50% + 2.5em); }
.staffcast-list .cmt.ch5{ left:calc(50% + 3.0em); }
.staffcast-list .cmt.ch6{ left:calc(50% + 3.5em); }
.staffcast-list .cmt:hover{transform: scale(1.1); text-decoration: none; cursor: pointer; }
.staffcast-cs{ font-size: 1.2em; letter-spacing: .1em; margin-bottom: 2em; color: #AAA; }




/* character */
.cont-character-navi{ margin: 0 auto; min-height:calc(1600/3000*100vw); }
.character-navi{ width: 100%; margin: 0 auto; }
.character-navi ul{ display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style-type: none; }
.character-navi ul li{ width: calc(1/6*100%); display: block; margin: 0; padding: .5em; position: relative; }
.character-navi ul li.sep{ width: 100%; height: 1px; padding: 0; }
/* .character-navi ul li.label{ width: 100%; }
.character-navi ul li.label > span{ display: block;  color: #a3003e; border:#a3003e solid .133em; padding: .2em .2em .2em 1.5em; line-height: 1; font-weight: bold; font-size: 1.2em; letter-spacing: .1em; position: relative; }
.character-navi ul li.label > span:before{ content:""; width: 1em; height: 1em; background: url("../assets/character/ind.png") no-repeat center center; background-size: contain; position: absolute; top:.2em; left:.2em; } */

.character-navi ul li.label{ width: calc(100% - 0.5em*2 ); background: rgba( 0,0,0,.1); position: relative; line-height: 1; padding: 0; margin: .5em; overflow: hidden;  }
.character-navi ul li.label > p{ display: inline-block; padding: .5em 5em .5em .5em; margin: 0;  position: relative; }
.character-navi ul li.label > p > span{ font-size: 1.5em; font-weight: normal; color: #FFF; position: relative; letter-spacing: .05em; }
.character-navi ul li.label > p:before{ content:""; display: inline-block; background-color:#a3003e; width: 100%; height: 100%; position: absolute; top:0; left:-2.5em; transform: skew(45deg); }

.character-navi ul li.label.spc > span{ opacity: 0; }
.character-navi ul li.label.p0{ display: none; }
.character-navi ul li.label.p1{ width: calc(1/6*100% - 0.5em*2); }
.character-navi ul li.label.p2{ width: calc(2/6*100% - 0.5em*2); }
.character-navi ul li.label.p3{ width: calc(3/6*100% - 0.5em*2); }
.character-navi ul li.label.p4{ width: calc(4/6*100% - 0.5em*2); }
.character-navi ul li.label.p5{ width: calc(5/6*100% - 0.5em*2); }
.character-navi ul li a{ display: block; line-height: 1; background-size: 100%; transition: all .1s ease 0s;}
.character-navi ul li a:hover{ transform: translateY(-0.5em); text-decoration: none; }
.character-navi ul li a .th{ margin-bottom: 0; position: relative; overflow: hidden; }
.character-navi ul li a .th img{ position: relative; }
.character-navi ul li a .th:before{ content:""; width: 100%; height: 1px; transform: skewY(-30deg); background-color: #e5005a; position: absolute; bottom:0; left:0; }
.character-navi ul li a:hover .th:before{ height: 70%; transition: all .25s ease 0s; }
.character-navi ul li a .cap{ }
.character-navi ul li a .cap{ margin-bottom: 0; color:#a3003e; font-size: 1.2em; letter-spacing: .1em; font-weight: normal; display: block; border:#a3003e solid 1px; position: relative; padding: .125em; text-align: center; }
.character-navi ul li a .cap > span{  }

.modal-character{ width: 100%; min-height: 100%; position: absolute; top:0; left:0; pointer-events: auto;  background:#fff url("../images/common/bg-pattern.png") repeat center top; background-size: calc(1280/3000*100vw) auto; }
/* .modal-character::before{ content:""; width: 100%; min-height: 100%; background: rgba(255,255,255,.95); position: absolute; top:0; left:0; } */
.character-data-frame{ width: 100%; /*background: #FFF; border-top:#a3003e solid 1px; border-bottom:#a3003e solid 1px;*/ padding: 0 0; position: absolute; top:2em; left:0; }

.character-cursor{ display: block; position: absolute; width: 90%; top:25vw; left: 2.5%; z-index: 5; }
.character-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.character-cursor ul li{ display: block; width:calc(80/3000*100vw); height: calc(147/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("../assets/character/cursor.png") no-repeat center center; background-size: 100%; transform-origin: center center; }
.character-cursor ul li.right span{ transform: scale(-1,1); }
.character-cursor ul li span:hover{ transform: scale(1.1,1.1); text-decoration: none; }
.character-cursor ul li.right span:hover{ transform: scale(-1.1,1.1); }
.character-cursor ul li.off{ pointer-events: none; opacity: .1; }

.character-close{ display: block; position: relative; padding: 2em 0 0 45vw }
.character-close a{ display: block; width:calc(126/3000*100vw); height: calc(126/3000*100vw); position: relative; text-decoration: none; }
.character-close a span{ display: block; width:100%; min-height: 100%; background: url("../assets/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 0 12.5%; position: relative; }

.cont-character-data{ width:100%;  }
.character-data{ width:100%; min-height:calc(1600/3000*100vw); position: relative; padding-bottom: 1em; }
.character-data:before{ content:""; width: 25em; height: 25em; border:#a3003e solid 1px; position: absolute; top:15em; left:30em; opacity: .5; transform: rotateZ(45deg); }
.character-data:after{ content:""; width: 35em; height: 35em; border:#a3003e solid 1px; position: absolute; top:10em; left:40em; opacity: .5; transform: rotateZ(45deg); }
.character-data .chr-back{ position: absolute; top:8.5em; opacity: 1; }
.character-data .chr-img{ margin: 0 0 0 auto; position: relative; z-index: 3; width: calc(1000/3000*100vw); }
.character-data .chr-prof{ width: 100%; position: absolute; top: 3vw; left: 0; z-index: 2; }
.character-data .chr-back .name-en{ display: inline-block; font-size: 1.6em; line-height: 1.1; text-align: left; color:#a3003e; letter-spacing: .1em; position: relative; }
.character-data .chr-back .sep{ padding: 0 .5em; display: inline-block; font-size: 1.6em; line-height: 1.1; text-align: left; color:#a3003e; letter-spacing: .1em; position: relative; }
.character-data .chr-back .class{ display: inline-block; font-size: 1.6em; line-height: 1.1; text-align: left; color:#a3003e; letter-spacing: .1em; position: relative; }
.character-data .chr-prof .name{ display: inline-block; font-size: 2.666em; font-weight: bold; color:#a3003e; margin: 0 .5em .25em 0; letter-spacing: .1em; }
.character-data .chr-prof .cv{ display: inline-block; color:#a3003e; font-size: 1.3em; line-height: 1; font-weight: bold; letter-spacing: .1em; padding: .25em; margin: 0; }
.character-data .chr-prof .line{ position: relative; width: 50%; height: 1px; margin-bottom: 5.5em; background-color:#a3003e;}
.character-data .chr-prof .catch{ position: relative; line-height: 1; margin-bottom: 1.25em;}
.character-data .chr-prof .catch > span{ font-size: 1.9em; display: inline-block; background-color: #a3003e; color: #fff; padding: .25em; margin-bottom: .25em; letter-spacing: .1em; }
.character-data .chr-prof .profile{ width: 26em; font-size: 1.333em; line-height: 1.8; letter-spacing: .05em; }
.character-data .chr-prof .data{ font-size: 1em; color: #a3003e; letter-spacing: .05em; padding: 0 ; margin-bottom: 0;}
.cont-character-data{ display: none; }

.character-data:before { animation: character-data-back 15s 0s linear both running infinite; }
.character-data:after { animation: character-data-back 25s 0s linear both running infinite; }
@keyframes character-data-back {
  0% { transform: rotateZ(45deg) rotateX(0deg) rotateY(0deg);}
  100% { transform: rotateZ(45deg) rotateZ(360deg) rotateY(360deg);}
}
#CharaStage .character-data { animation: anm-character-change .5s .05s 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; }







/* bddvd */

/* music */

.artist-link{ font-size: .8em; display: flex; flex-wrap: wrap; }
.artist-link a{ margin: 0 .25em .25em 0; }



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

.bnf-list .shop{ width: 100%; min-height: 2.4em; color: #a3003e; border: #a3003e solid 1px; padding: .2em .4em; margin-bottom: .25em; font-size: 0.8em; line-height: 1.2; display: flex; align-items: center; }
.bnf-list .shop > p{ letter-spacing: 0; }
.bnf-list .thumb{ padding: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{ height: 22em; position: relative; }
.bnf-list .thumb .inner a{ display: block; height: 22em; position: relative; }
.bnf-list .thumb .inner img.vt{ max-width: auto; height: 22em; width: auto\9;}
.bnf-list .thumb.np{ pointer-events: none;  }
.bnf-list .data{ width: 100%; text-align: center; }
.bnf-list .excond{ font-size: 0.666em; color: #ccc; margin-bottom: .3em; }
.bnf-list .name{ font-size: 1em; color: #a3003e; letter-spacing: -0.05em; margin-bottom: .3em; text-align: center; }
.bnf-list .cond{ font-size: 0.9em; margin-bottom: .3em; background-color:#a3003e; display: inline-block; padding: .2em .4em; color: #fff; }
.bnf-list .start{ font-size: 0.8em;  }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; text-align: center;  }

/* special */
.cont-sub-content.cont-sub-special > .inner{ }
.sub-special-container{ min-height: 70vh; }
.special-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: center; }
.special-list .thumb{ width: 70%; padding: 2% 1%; }
.special-list .thumb a{ display: block; width: 100%; padding: 1.5em 0; background-color: transparent; border:#a3003e solid 1px; border-radius: 0; color: #a3003e; transition: all .1s ease 0s; text-decoration: none; position: relative; overflow: hidden;}
.special-list .thumb a:before{ content:""; width: 100%; min-height: 100%; position: absolute; top:0; right:0; opacity: 0; mix-blend-mode: screen; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.special-list .thumb a:after{ content:""; width: 4em; height: 4em; background-color: #a3003e; position: absolute; top:-2.7em; right: -2.7em; transform: rotate(45deg); }
.special-list .thumb a > span{ font-size: 1.6em; letter-spacing: .01em; font-weight: bold; position: relative; }
.special-list .thumb a:hover{ transform: scale(1.05,1.05); color: #FFF; background-color:#a3003e; }
.special-list .thumb a:hover:after{ background-color: #FFF; top:inherit; right:inherit; bottom:-2.7em; left: -2.7em; }

.movie-list{ display: flex; flex-wrap: wrap; }
.movie-list .thumb{ width: 33.33%; padding: 1%; text-align: center; }
.movie-list .thumb a{ position: relative; text-decoration: none; line-height: 1; }
.movie-list .thumb a img{ border: #a3003e solid 1px; margin-bottom: .5em; }
.movie-list .thumb .cap{ display: inline-block; background-color:#a3003e; padding: .25em 1.25em; letter-spacing: .1em; margin-bottom: 0; color:#fff; position: relative; }

.movie-list .thumb .cap:before{ content:"●"; color: #FFF; font-size: .3em; position: absolute; top:.5em; left:.5em; }
.movie-list .thumb .cap:after{ content:"●"; color: #FFF; font-size: .3em; position: absolute; bottom:.5em; right:.5em; }

.comment-list{ display: flex; flex-wrap: wrap;}
.comment-list .thumb{ width: 20%; padding: .5%; text-align: center; }
.comment-list .thumb.cs{ opacity: .5; display: none; }
.comment-list .thumb a{ display: block; position: relative; text-decoration: none; overflow: hidden; }
.comment-list .thumb a:after{ content:""; width: 12em; height: 12em; background-color: #a3003e; opacity: 1; position: absolute; bottom:-7.5em; left: -7.5em; transform: rotate(45deg); }
.comment-list .thumb a:hover:after{ opacity: .8; bottom:-6em; left: -6em; transition: all .25s ease 0s; }
.comment-list .thumb a img{ border: #a3003e solid 1px; position: relative; }
.comment-list .thumb .pos{ font-size: .8em; display: inline-block; padding: .25em .75em; margin: 0; line-height: 1; color: #FFF; background-color: #e5005a; position: absolute; bottom:2.75em; left: 0; z-index: 2; }
.comment-list .thumb .name{ font-size: 1.2em; letter-spacing: .1em; display: inline-block; padding: .25em .5em; margin: 0; line-height: 1; color: #FFF; background-color: #a3003e; position: absolute; bottom:.2em; left: 0; z-index: 2; }

.comment-container{ background-color: #FFF; padding: 2em; border: #a3003e solid 1px; position: relative; overflow: hidden; }
.comment-container:before{ content:""; width: 12em; height: 12em; background-color: #a3003e; opacity: 1; position: absolute; bottom:-7.5em; left: -7.5em; transform: rotate(45deg); }
.comment-container:after{ content:""; width: 12em; height: 12em; background-color: #a3003e; opacity: 1; position: absolute; top:-7.5em; right: -7.5em; transform: rotate(45deg); }
.comment-container > .bgc{ width: 40%; position: absolute; top:-5em; right:-5em; opacity: .2; }

/* goods */
.cont-sub-content.cont-sub-goods > .inner{ }
.sub-goods-container{ min-height: 70vh; }

.cont-sub-goods .cont-tiles{ margin: 0 auto;  }
.goods-list{ display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; align-items: stretch;  }
.goods-list .goods-data{ width: 18.0%; margin: 1%; padding: 0; background-color: rgba(0,0,0,.0); position: relative; overflow: hidden; }
.goods-list .goods-data .goods-thumb{ position:reletive; }
/* .goods-list .goods-data .goods-thumb::before{ content:""; width: 5.5em; height: 5.5em; background-color: #a3003e; opacity: 1; position: absolute; bottom:-4em; left: -4em; transform: rotate(45deg); } */
.goods-list .goods-data .goods-thumb::after{ content:""; width: 5.5em; height: 5.5em; background-color: #a3003e; opacity: 1; position: absolute; top:-4em; right: -4em; transform: rotate(45deg); }
.goods-list .goods-data .goods-thumb-img{ width: 100%; padding: 0 0 .25em 0; display: table-cell; text-align: center; vertical-align: middle; }
.goods-list .goods-data .goods-thumb-img img{ border: #a3003e solid 1px; }
.goods-list .goods-data .goods-thumb-name{ padding: 0; margin: 0; font-size: .8em; color: #a3003e; font-weight: normal; text-align: left; }
.cont-modal.goods{ width: 77vw;  }
.goods-frame{ padding: 1em; background:#fff; }
.goods-frame > div{ background:#fff url("../images/common/bg-pattern.png") repeat center top; background-size: calc(1280/3000*100vw) auto; position: relative; overflow: hidden; }
.goods-detail{ display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; padding: 1em; }
.goods-list .goods-data .goods-detail-container{ display: none; }
.goods-detail .goods-detail-img{ width: 40%; padding: 0 2em 0 0; display: table-cell; text-align: center; vertical-align: middle; }
.goods-detail .goods-detail-img img{ border: #a3003e solid 1px; }
.goods-detail .goods-detail-data{ width: 60%;  }
.goods-detail .goods-detail-data .goods-detail-name{ font-size: 1.433em; color:#a3003e; letter-spacing: .05em; }
.goods-detail .goods-detail-data .goods-detail-text{ font-size: 1.033em; line-height: 1.8; letter-spacing: .05em; }
.goods-detail .goods-detail-data .goods-data-link{ padding: 0; font-size: .8em; 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) {
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
body{ background-size: 100%; }

/* header */
.part-header{ pointer-events: none; position: fixed; top:0; right:0; }
.global-logo{ width: 11.25em; top:1.5em; left:-86vw; display: none; }
.cont-global-navi{ width: 10vw; height: 100vh; position: absolute; top:0; right: 0; pointer-events: none; background-color: #FFF; }
.global-navi:before{ }
.global-navi > ul{ padding: 2em 3em 0 0;  }
.global-navi > ul > li{  }
.global-navi > ul > li a{ padding: 0 0 .75em 0; font-size: 2.5em; }
.global-season{ width: 2em; top:6em; right: .8em; }
.global-share{ width: 3em; bottom:5em; right: .3em; }
.cont-sp-btn{ width: 7vw; top:1.3vw; right: 1.3vw;  }


/* body */
.part-body{ margin: 0 auto; }
.top-page .part-body{ width:90vw; margin: 0; display: block;  }
.cont-upper{ position: relative; }
.top-page .cont-upper{ width: 100%; position: relative; top:0; z-index: 2; }
.cont-middle{ position: relative; }
.top-page .cont-middle{ width: 100%; position: absolute; top:5em; z-index: 1; }
.cont-top-content{  }
.cont-top-content > .inner{  }
.cont-top-upper{ position: relative; }
.cont-top-upper > .inner{ padding: 1em 0; }
.top-page .cont-top-upper > .inner{ padding-top: .6em; }
.cont-sub-content{ width: 90vw; }
.cont-sub-content > .inner{ padding: 1.5em;  }
.cont-sub-upper{ position: relative; }
.cont-sub-upper > .inner{ padding: 1.5em; margin-bottom: 21vw; }

.top-conttitle{ font-size: 1em; margin: 0 auto 4em auto; text-align: center; }
.top-conttitle > div{ width: calc(1160/3000*100vw); margin: 0 auto;  }
.cont-subtitle{ font-size: 1em; margin: 0 auto; text-align: center; }
.cont-subtitle > div{ width: calc(880/3000*100vw); margin: 0 auto; }

.sub-cont-container{ }
.body-bg{ width: 100%; height: 20vw; top:22vw;}
.body-bg .bg{ height: 20vw; background-image: url("../images/common/body-bg3.webp"); background-position: center center; background-size:100% auto; }
.body-bg .clr{ width: 100%; height: 10vw; right:0; }
.body-bg .ttl{ width: 100%; height: 10vw; right:0; }
.body-bg .ttl span{ font-size: 4em; left: 0; transform: rotate(0deg); }

.top-oa-b{ width: 69vw; margin: 0 auto;}
.top-logo{ padding: 37em 6.5em 3em 6.5em; filter: drop-shadow(0 0 .3em #FFF) drop-shadow(0 0 .3em #FFF); }
.sub-logo{ display: block; width:30vw; pointer-events: auto; }
.sub-subtitle{ width: 52.5vw; top:12vw; right:10vw;  }
.sub-subtitle > span{ font-size: 1.9em; letter-spacing: .25em; }

/* footer */
.part-footer{  }
.cont-global-footer{ }
.footer-pagetop{ width: calc( 84/30 * 1em ); height: calc( 105/30 * 1em ); bottom:.45em; right: .45em;}
.cont-footer{ width: 90%; text-align: center; padding: 0 0 1.5em 0; }

.footer-navi{ width: 100%; margin: 0 auto 1.5em auto; padding: 1em 0; flex-wrap: wrap;  }
.footer-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; padding: 0 .5em; margin: 0;  }
.footer-navi > ul > li{  display: block; padding: .9em 1em ; margin: 0; line-height: 1; }
.footer-navi > ul > li a > span{ font-size: 1.2em; letter-spacing: .1em;}

.footer-btn > ul > li{ display: block; padding: .25em 1.0em; margin: 0 0 .5em 0;  }
.footer-btn > ul > li a{ font-size: 1.0em; }

.footer-banner > ul > li{ width: 50%; padding: .5em ; }





/* content */
.cont-ttl-a span{ font-size: 1.6em;  padding: 0 1.3em; }

.content-entry{ }
.modal-data{ display: none; }
.frame-modal{ padding: 0; }


/* TOP-PAGE */
/* main */
.cont-top-visual .kv-container{  }
.cont-top-visual .grp{ width: 100%; margin: 0 auto; position: relative; display: none;}
.cont-top-visual .grp.on{ display: block; }

.kv-container .catch{ width: calc( 167/3000*100vw*1.5); position: absolute; top:36vw; }
.kv-container .oa1{ width: calc( 316/3000*100vw*1.75); position: absolute; top:0; left: 5vw;  }

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

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

.top-news-twitter-title{ width: 20.86vw; }

/* news */
.cont-top-news{  }
.more-btn{ position: relative; text-align:right; margin-right:2em; line-height: 1; }
.more-btn > a{ width: 13vw;  }

/* twitter */
.cont-top-twitter{ }
.twitter-widget-container{ width: 80%; margin: 1em auto 2em auto; }


/* SUB-PAGE */
/* news */

/* on air */
.onair-list-container{ max-width: inherit; }
.onair-list{ margin: 0 auto .5em auto; max-width: inherit; padding: .75em ; }
.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.13em; margin-bottom: .25em; }
.onair-list .schd{ font-size: 1em; }
.onair-list .time{ font-size: 1em;  }
.onair-list .extr{ font-size: .8em; }

.onair-list-il > a{ width: 49%; margin: 0.5%; }
.onair-list-il > a.dbl{ width: 70.0%; padding: .5em 0; font-size: 1.2em; margin: 0.25%; }

/* story */
.story-navi ul > li.n0 a{ width: 11.0em; }
.story-navi ul > li.spc-sp{ display: block; width: 100%; height: 1px;  }

.cont-story-data{ width: 100%; margin: 0 auto; position: relative; }


.story-data .ep-title > span{ font-size: 2.2em; }


.story-data .ep-slider-thumb{ width: 100%; }

.intro-container .fig{ width: 90%; }
.intro-container .text > p{ font-size:1.3em; line-height: 2.0; letter-spacing: .1em;  }
.intro-container .text > p [data-ruby]::before { top: -1.9em; }


/* staffcast */
.staffcast-list{ width: 100%; text-align: left; display: flex; flex-wrap: wrap; justify-content: flex-start; }
.staffcast-list > div{ width: 50%; }
.staffcast-list.cs > div{ width: 40%; }
.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 > div{ margin-bottom: 2em; position: relative; }
.staffcast-list .pos{ font-size: 1.0em; }
.staffcast-list.cs .pos{ color: #AAA;  }
.staffcast-list .name{ font-size: 1.2em; }
.staffcast-list .ext{ font-size: .8em; }
.staffcast-list .cmt{ width: 1.5em; }


/* character */
.character-navi ul li{ width: calc(1/4*100%); display: block; margin: 0; padding: .25em; }
.character-navi ul li.label{ width: calc(100% - 0.25em*2 ); margin: .25em;   }
.character-navi ul li.label.p0{ display: block; }
.character-navi ul li.label.s0{ display: none; }
.character-navi ul li.label.s1{ width: calc(1/4*100% - 0.25em*2); }
.character-navi ul li.label.s2{ width: calc(2/4*100% - 0.25em*2); }
.character-navi ul li.label.s3{ width: calc(3/4*100% - 0.25em*2); }
.character-navi ul li.label.s4{ width: calc(4/4*100% - 0.25em*2); }
.character-navi ul li a .th{ margin-bottom: 0em; }
.character-navi ul li a .cap{ font-size: .9em; }

.modal-character{ position: absolute; top:0; left:0; pointer-events: auto; }
.character-data-frame{ padding: 2em 0; top:5em; }

.character-cursor{ width: 20%; top:-11vw; left: 68%; }
.character-cursor ul li{ width:calc(80/1000*100vw*.6); height: calc(147/1000*100vw*.6);  }

.character-close{ position: absolute; top:-4em; left: 1em; padding: 0; }
.character-close a{ width:calc(126/1000*100vw*.6); height: calc(126/1000*100vw*.6); }

.character-data-container{ width:88%; margin: 0 auto 0 1.25%; min-height: 40vw; }

.cont-character-data{ width:100%;  }
.character-data{ width:100%; min-height:200vw; position: relative; overflow: hidden; }

.character-data:before{ width: 25em; height: 25em; top:35em; left:5em; }
.character-data:after{ width: 35em; height: 35em; top:40em; left:5em; }

.character-data .chr-back{ position: absolute; top:5.0em; left:1em; opacity: 1; }
.character-data .chr-img{ margin: 0 auto; position: relative; z-index: 3; width: 100%; }
.character-data .chr-prof{ width: 95%; margin: 0 auto; position: relative; top: inherit; left: inherit; z-index: 2; }

.character-data .chr-prof .name{  font-size: 2.4em; margin: 0 .5em .25em 0; }
.character-data .chr-prof .cv{ font-size: 1.3em; margin: 0 0 .5em 0; }
.character-data .chr-prof .line{ width: 100%; margin-bottom: 4.5em; }
.character-data .chr-prof .catch{ position: relative; line-height: 1; margin-bottom: 1em;}
.character-data .chr-prof .catch > span{ font-size: 1.5em; }
.character-data .chr-prof .profile{ width: 100%; font-size: 1.333em; }
.character-data .chr-prof .data{ font-size: 1.133em; }

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


/* music */
.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:1em 2.5em;  }
.bnf-list .thumb .inner img.vt{  }

/* special */
.sub-special-container{  }
.special-list{ display: flex; flex-wrap: wrap; justify-content: center; }
.special-list .thumb{ width: 90%; padding: 2% 1%; }
.special-list .thumb a{ padding: 1.5em 0;}
.special-list .thumb a > span{ font-size: 1.2em;  }

.movie-list .thumb{ width: 100%; padding: 5%; }

.comment-list .thumb{ width: 33.33%; padding: .5%; text-align: center; }

.comment-container:before{ bottom:-8.5em; left: -8.5em; }
.comment-container:after{ top:-8.5em; right: -8.5em; }
.comment-container > .bgc{ width: 80%; position: absolute; top:23.5em; right:-5em; opacity: .2; }

/* goods */
.goods-list{ display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; align-items: stretch;  }
.goods-list .goods-data{ width: 48%; margin: 1%; padding: 0;  position: relative; overflow: hidden; }
.goods-list .goods-data .goods-thumb::after{ content:""; width: 5.5em; height: 5.5em; background-color: #a3003e; opacity: 1; position: absolute; top:-4em; right: -4em; transform: rotate(45deg); }

.cont-modal.goods{ width: 100%;  }
.goods-frame{ padding: 1em;  }
.goods-detail .goods-detail-img{ width: 100%; padding: 0 0 1em 0; }
.goods-detail .goods-detail-data{ width: 100%;  }
.goods-detail .goods-detail-data .goods-detail-name{ font-size: 1.433em; letter-spacing: .05em; }
.goods-detail .goods-detail-data .goods-detail-text{ font-size: 1.033em; line-height: 1.8; letter-spacing: .05em; }
.goods-detail .goods-detail-data .goods-data-link{ padding: 0; font-size: .8em; margin-bottom: 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) {

}