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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* body{font-family: YakuHanRPs, "M PLUS Rounded 1c", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;} */

/* background */
.skin-cbg #Background .bg-motion{ width: 100%; height: 100vh; background-image:url(../images/bg-motion-cbg.gif); }

/* foreground */
.skin-cbg #Foreground .log-screen .login{ display: none; flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; width: 100%; height: 100%; background-color: #4809bb; }
.skin-cbg #Foreground .log-screen .logout{ display: none;}
.skin-cbg #Foreground .log-screen .login .text{ width: 100%; text-align: center; }
.skin-cbg #Foreground .log-screen .login::after{ content:""; display: block; width: 100%; height: 2px; background-color: #FFF; animation:log-screen-on 3.0s 0s 1 linear backwards; }

.skin-cbg #Foreground .log-screen.start .login{ display: flex; }
.skin-cbg #Foreground .log-screen.start .logout{ display: none; }

.skin-cbg #Foreground .log-screen.end .login{ animation:log-screen-on 1.0s 1.0s 1 reverse ease-out both; }
.skin-cbg #Foreground .log-screen.end .login .text{ animation:fadeOut 1.0s 0s 1 ease-out both;  }
.skin-cbg #Foreground .log-screen.end .login::after{ animation:fadeOut 1.0s 0s 1 ease-out both; }

/* header */

.skin-cbg .global-navi-lang > ul > li:first-child div:before{ border-color: rgba(255,255,255,.8) transparent transparent transparent; }
.skin-cbg .global-navi-lang > ul > li.crt:first-child div:before{ border-color: rgba(230,40,40,.7) transparent transparent transparent; }
.skin-cbg .global-navi-lang > ul > li:last-child div:before{ border-color: transparent transparent rgba(255,255,255,.8) transparent; }
.skin-cbg .global-navi-lang > ul > li.crt:last-child div:before{ border-color: transparent transparent rgba(230,40,40,.7) transparent; }
.skin-cbg .global-navi{ background-color: rgba(255,255,255,.8); }

.skin-cbg .cont-skin-btn .skin-btn-login{ display: block; }
.skin-cbg .cont-skin-btn .skin-btn-logout{ display: none; }

.skin-cbg .btn-bnr > a{ background-color: #360295; }
.skin-cbg .btn-bnr > a > .inner{ background-color: #FFF; border-color: #360295 ;  }
.skin-cbg .btn-bnr > a:hover{ color: #fff; background-color: #360295; }
.skin-cbg .btn-bnr > a:hover > .inner{ background-color: transparent; border-color: #FFF ;  }

.skin-cbg .btn-bnr.bgthm > a > .inner{ background-color: transparent; border-color: #000 ; }
.skin-cbg .btn-bnr.bgthm > a:hover{ color: #e62828; }

/* entry */
.skin-cbg .content-entry{ background-color: rgba(255,255,255,.8); margin-bottom: 3em; border: rgba(230,40,40,.9) solid .5em; border-radius: 1.5em; }

/* accordion */
.skin-cbg .content-accordion{ background-color: rgba(255,255,255,.8); border-left: rgba(230,40,40,.9) solid .5em; border-right: rgba(230,40,40,.9) solid .5em; }
.skin-cbg .content-accordion:first-child{ padding-top: 1em; border-top: rgba(230,40,40,.9) solid .5em; border-radius: 1.5em 1.5em 0 0;}
.skin-cbg .content-accordion:last-child{ padding-bottom: 1em; border-bottom: rgba(230,40,40,.9) solid .5em; border-radius: 0 0 1.5em 1.5em;}


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

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

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

/* TOP-PAGE */

.skin-cbg .top-subtitle > span{ font-size: calc(3.3em*0.9); letter-spacing: .1em; font-family: vdl-logojrblack, sans-serif; font-weight:normal;}
.skin-cbg .cont-top-visual .kv-container .vis{ background-image: url(../images/main/cbg1/kv.jpg);  }
.skin-cbg .cont-top-visual .kv-container .catch{ background-image: url(../images/main/cbg1/catch.png); top:1vw;}
.skin-cbg .cont-top-visual .kv-container .oa{ background-image: url(../images/main/cbg1/oa.png); top:53vw;}
.skin-cbg .cont-top-visual .kv-container .logo{ /* background-image: url(../images/main/hmn1/logo.png); */ top:34vw;}

.skin-cbg .cont-top-visual .kv-container .loading{font-size: 2em; color: #848484; font-family: vdl-logojrblack, sans-serif;  }

.skin-cbg .cont-top-visual .kv-container .catch-w{ background-image: url(../images/main/cbg1/catch-fxw.png); top:26vw; }
.skin-cbg .cont-top-visual .kv-container .catch-w-fx{ background-image: url(../images/main/cbg1/catch.png); top:26vw; }


.skin-cbg.init .cont-top-visual .kv-container .oa{ opacity: 0; top:34vw; }
.skin-cbg.init .cont-top-visual .kv-container .logo{ opacity: 0; top:19vw; }
.skin-cbg.s3 .cont-top-visual .kv-container .oa{ transition: 1.1s top ease-in-out 0s; top: 70vw; }
.skin-cbg.s3 .cont-top-visual .kv-container .logo{ transition: 1.1s top ease-in-out 0s; top: 48vw; }



/* news twitter */
.skin-cbg .cont-top-news,
.skin-cbg .cont-top-twitter{ background: rgba( 0,0,0,.6 ); }

/* introduction */
.skin-cbg .cont-top-introduction .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #c43fff); filter: drop-shadow(.1em .1em 0 #c43fff); }
.skin-cbg .intro-bg-cbg{ display: block; width: 100%; height: 100%; position: absolute; top:0; background: url(../images/common-cbg-pattern.png) repeat center top; background-size: calc( 1200/30*1em ); opacity: .3; animation:intro-bg-cbg-flush 2.0s 0s infinite ease-out backwards; }
@keyframes intro-bg-cbg-flush {
  0% { opacity: 0; }
  50% { opacity: .3; }
  100% { opacity: 0; }
}

/* onair */
.skin-cbg .cont-top-onair{ background:#360295 -webkit-linear-gradient(top, #360295, #7303bd); background:#360295 linear-gradient(to bottom, #360295, #7303bd); color: #FFF; }
.skin-cbg .cont-top-onair .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #ff8a00); filter: drop-shadow(.1em .1em 0 #ff8a00); }
.skin-cbg .onair-bg-cbg{ display: block; width: 100%; height: 100%; position: absolute; top:0; background: url(../images/common-cbg-pattern.png) repeat center top; background-size: calc( 1200/30*1em ); opacity: .05; }

/* story */
.skin-cbg .cont-top-story{ background: rgba(0,0,0,0) url(../images/common-motion-bg-ylw.png) repeat; background-size: 6px; }
.skin-cbg .cont-top-story .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #360295); filter: drop-shadow(.1em .1em 0 #360295); }
.skin-cbg .cont-top-story .cont-top-content > .inner{ background-color: rgba(6,122,27,.8); }
.skin-cbg .story-bg{ position: absolute; top:0; }

/* staffcast */
.skin-cbg .cont-top-staffcast{ background: #FFF none; }
.skin-cbg .cont-top-staffcast .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #e42f8d); filter: drop-shadow(.1em .1em 0 #e42f8d); }
.skin-cbg .staffcast-bg1,
.skin-cbg .staffcast-bg2{ display: none; }
.skin-cbg .staffcast-bgc1,
.skin-cbg .staffcast-bgc2{ display: block; position: absolute; top:0; }
.skin-cbg .staffcast-bgc1{ width: 100%; height: 100%; background: url(../images/common-cbg-pattern-k.png) repeat center top; background-size: calc( 1200/30*1em ); opacity: .1;}
.skin-cbg .staffcast-bgc2{ width: 100%; height: 100%; background: url(../images/staffcast/cbg-bg.png) repeat center top; background-size: 100%; }

/* character */
.skin-cbg .cont-top-character{ background-color: #0008ee; color: #FFF; overflow: hidden; }
.skin-cbg .cont-top-character .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #06bf3f); filter: drop-shadow(.1em .1em 0 #06bf3f); }
.skin-cbg .character-bg1{ background-image:url(../images/bg-cut1c.jpg); }
.skin-cbg .character-bg2{ background-image:url(../images/bg-cut2c.jpg); }
.skin-cbg .character-bg3{ background-image:url(../images/bg-cut3c.jpg); }
.skin-cbg .cont-top-character .cont-top-content > .inner{ background-color: rgba(255,138,0,.8); }


/* music */
.skin-cbg .cont-top-music{ }
.skin-cbg .cont-top-music .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #f800e4); filter: drop-shadow(.1em .1em 0 #f800e4); }


/* bddvd */
.skin-cbg .cont-top-bddvd{ }
.skin-cbg .cont-top-bddvd .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #fff711); filter: drop-shadow(.1em .1em 0 #fff711); }
.skin-cbg .bddvd-bg{ background-color: rgba(255, 31, 210, 0.4);  mix-blend-mode: hard-light; }


/* products (music&bddvd) */
.skin-cbg .cont-top-products{ background: #fff711 none;  }
.skin-cbg .products-bg{ display: block; width: 100%; height: 100%; min-height: 100%; background: url(../images/common-cbg-pattern-k.png) repeat center top; background-size: calc( 1200/30*1em ); opacity: .1; position: absolute; top:0; }


/* movie */
.skin-cbg .cont-top-movie{ color: #FFF; overflow: hidden; }
.skin-cbg .cont-top-movie{ background: rgba(113,47,234,.1) url(../images/common-motion-bg-ppl.png) repeat; background-size: 6px; }
.skin-cbg .cont-top-movie .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #00a035); filter: drop-shadow(.1em .1em 0 #00a035); }
.skin-cbg .cont-top-movie .cont-top-content > .inner{ background-color: rgba(255,35,143,.8); }


/* special */
.skin-cbg .cont-top-special{ background:#e42f45 none; }
.skin-cbg .special-bg{ display: block; width: 100%; height: 100%; min-height: 100%; background: url(../images/common-cbg-pattern-w.png) repeat center top; background-size: calc( 1200/30*1em ); opacity: .1; position: absolute; top:0; }
.skin-cbg .cont-top-special .top-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #004cf8); filter: drop-shadow(.1em .1em 0 #004cf8); color: #FFF; }


/* SUB-PAGE */
.skin-cbg.sub-page{ background: #4809bb url(../images/common-cbg-pattern-w10.png) repeat center top; background-size: calc( 1200/30*1em ); }
/*
.cont-sub-content{ width: 66.666%; margin: 0 auto; }
.cont-sub-content > .inner{ padding: 4em 2.5em; }
.content-modal .cont-top-content > .inner{ padding: 1em; }
.sub-subtitle{ font-size: 1em; margin-bottom: 2.5em; padding: 0; box-sizing: border-box; text-align: center; }
*/
.skin-cbg .sub-subtitle > span{ color: #FFF; font-size: calc(3.3em*0.9); letter-spacing: .1em; font-family: vdl-logojrblack, sans-serif; font-weight:normal;}

.skin-cbg .sub-conttitle{ color: #FFF; font-family: vdl-logojrblack, sans-serif; font-weight:normal; font-size: calc(1em*0.9);  -webkit-filter: drop-shadow(.1em .1em 0 #000); filter: drop-shadow(.1em .1em 0 #000); }



/* news */
#Page_News.skin-cbg #Background .bg-art{ background-image: url(../images/news/bg-art-c.png); }
#Page_News.skin-cbg .sub-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #bea101); filter: drop-shadow(.1em .1em 0 #bea101);}
/* special */
#Page_Special.skin-cbg #Background .bg-art{ background-image: url(../images/special/bg-art-c.png); }
#Page_Special.skin-cbg .sub-subtitle > span{ -webkit-filter: drop-shadow(.1em .1em 0 #bea101); filter: drop-shadow(.1em .1em 0 #bea101);}
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■      

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

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

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

}
/* MD ----------------------------------------------------------------------------- */
@media (max-width: 991px) {
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {

/* background */
.skin-cbg #Background .bg-motion{ background-image:url(../images/bg-motion-cbg-sp.gif); }

.skin-cbg .global-navi{ background-color: transparent;  }

/* TOP-PAGE */

.skin-cbg .cont-top-visual .kv-container .vis{ background-image: url(../images/main/cbg1/kv-sp.jpg);  }
.skin-cbg .cont-top-visual .kv-container .catch{ background-image: url(../images/main/cbg1/catch-sp.png); top:0vw; }
.skin-cbg .cont-top-visual .kv-container .oa{ background-image: url(../images/main/cbg1/oa-sp.png); top:150vw; }
.skin-cbg .cont-top-visual .kv-container .logo{ background-image: url(../images/main/hmn1/logo-sp.png); top:50vw; }

.skin-cbg .cont-top-visual .kv-container .catch-w{ background-image: url(../images/main/cbg1/catch-fxw-sp.png); top:62vw;}
.skin-cbg .cont-top-visual .kv-container .catch-w-fx{ background-image: url(../images/main/cbg1/catch-fx-sp.png); top:62vw;}

.skin-cbg.init .cont-top-visual .kv-container .oa{ opacity: 0; top:88vw; }
.skin-cbg.init .cont-top-visual .kv-container .logo{ opacity: 0; top:62vw; }

.skin-cbg.s3 .cont-top-visual .kv-container .oa{ transition: 1.1s top ease-in-out 0s; top: 150vw; }
.skin-cbg.s3 .cont-top-visual .kv-container .logo{ transition: 1.1s top ease-in-out 0s; top: 80vw; }


/* character */
.skin-cbg .character-bg1{ background-image:url(../images/bg-cut1c-sp.jpg); }
.skin-cbg .character-bg2{ background-image:url(../images/bg-cut2c-sp.jpg); }
.skin-cbg .character-bg3{ background-image:url(../images/bg-cut3c-sp.jpg); }


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

}