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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- fonts ---- */
body{font-family:'M PLUS Rounded 1c', sans-serif, serif;}


/* ---- common style ---- */
a,a:visited {color: #b73459;}
a:hover,a:active {color: #f09eb5; }
a.ilink-fr{ color: #FFF; display: inline-block; padding: 5px; background: #7364AA; line-height: 0; margin-bottom: 10px; }
a.ilink-fr:hover{ color: #faaa00; background: #bb0000; }
a.ilink-btn{ color: #FFF; display: inline-block; padding: .1em .4em; border-radius: .5em; background-color: #b73459; }
.hv_fade{ opacity: 1; }
.hv_fade:hover{ opacity: 0.7; cursor: pointer; }
a.ilink-btn:hover{ opacity: .7; text-decoration: none;}

.ilink2{ display: inline-block; padding: 0.2em 0.5em 0.2em 0.5em ; background-color: #f09eb5; text-decoration: none; border-radius: .9em; font-weight: bold; color: #fff; text-align: center; }
.ilink2,
.ilink2:visited,
.ilink2:active{ color: #fff;}
.ilink2:hover{ text-decoration: none; color: #fff; opacity: .7; }

.ac-color1{color:#f09eb5;}/* pink - news */
.ac-color2{color:#d595bd;}/* purple - story */
.ac-color3{color:#8b9f1a;}/* green - caststaff */
.ac-color4{color:#eab93a;}/* orange - comics */
.ac-color4b{color:#81cde4;}/* blue - comics */
.ac-color5{color:#9cbaff;}/* blue - onair */
.ac-color6{color:#f7ab8a;}/* orange - special */

.ttl1{ padding:0.2em 0.1em; margin-bottom: .5em; background-color: rgba(0,0,0,.02);}
.ttl2{ padding:0.1em 0.1em; margin-bottom: .5em; border-bottom: rgba(0,0,0,.1) dotted 2px;}

.icon-flower{width:.9em;vertical-align: -0.05em;}

.frm1 img,img.frm1{ border: #dedede solid 1px; }

.font-space-01{ letter-spacing: -0.1em }
.font-space-02{ letter-spacing: -0.2em }

.mg6eml{ margin-left: 6em;}

dl.table-inln{ display: block; list-style-type: none; margin: 0; }
dl.table-inln dt{ display: inline-block; white-space: nowrap; vertical-align: top; margin: 0; font-weight: normal; }
dl.table-inln dd{ display: inline-block; white-space: inherit; vertical-align: top; margin: 0;}

.table-a{ border-collapse: collapse;}
.table-a th{ padding:0.5em; background-color: rgba(0,0,0,.02);border-bottom: rgba(255,255,255,.5) solid 2px; font-weight: normal; text-align: inherit; vertical-align: top; text-align: left;  }
.table-a td{ padding:0.5em; background-color: rgba(0,0,0,0);border-bottom: rgba(0,0,0,.1) dotted 2px; vertical-align: top; }
.table-a td.blnkcell{ border: none; font-size: .5em; }

.list-a{  margin: 0 auto; display: flex; flex-wrap: wrap;  }
.list-a > div{ background-color: rgba(0,0,0,.02); width: 49%; margin: .3em .5%;   }

.frame-a{ background: rgba(0,0,0,.03); }
.frame-b{ background: rgba(254,249,141,0.2); box-sizing: border-box;}

.al-ct-pc{ text-align: center; }
.al-ct-sp{ text-align: inherit; }

/* responsive display */
.hide{ display: none;}
.hide-pc{ display: none; }
.hide-sp{ display: inherit;}

/* youtube embed responsive */
.video-embed {position: relative;height: 0;padding: 0 0 56.25%;overflow: hidden;}
.video-embed iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/* colorbox customize */
#cboxOverlay{background:#FFF;}
#cboxContent{margin-top:60px;background:#FFF;}
#cboxLoadedContent{border:5px solid #FFF; background:#fff;}
#cboxClose{top:-55px; right:5px; display:block; background:url(../images/lib/colorbox/close.png) no-repeat top center; width:50px; height:50px; }
#cboxClose:hover{ background-position: top center; }
#cboxPrevious{top:-55px; left:5px; display:block; background:url(../images/lib/colorbox/prev.png) no-repeat top center; width:50px; height:50px; }
#cboxPrevious:hover{ background-position: top center; }
#cboxNext{top:-55px; left:65px; display:block; background:url(../images/lib/colorbox/next.png) no-repeat top center; width:50px; height:50px; }
#cboxNext:hover{ background-position: top center; }

/* twitter iOS fix */
.twitter-container iframe { width: 740px !important; }

/* slick fix */
.slick-list,.slick-slide {outline: none !important;}/* Chromeでフォーカス時の枠線を消す */
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
body{ font-size: 18px; color: #747474; } 
.wrapper{ width:100%; position: relative;}
.upper{ width: 100%; position: relative;}
.upper .upper-bg{ width: 100%; position: relative;}
.upper .upper-bg > .inner{ width: 100%; max-width: 1280px; margin: 0 auto;  position: relative; display: flex;}
.upper .logo-bg{ width: 38.21%; max-width: 489px; position: absolute; /* top:-15.625%; */ /* top:-25.625%; left: -8.2%; */ top:-200px; left: -105px;}
.upper .particle-bg{ pointer-events: none; width: 100%; height: 99.9%; position: absolute; top:0; /* z-index: 0; */ } 
.upper .particle-bg canvas#ptcCanvas {display: block;position: fixed;top: 0;left: 0;width: 100%;height: 100%; }

header,article,section,footer{ position: relative;  }

header{ width: 31.25%; max-width: 400px; }
article{ width: 68.75%; max-width: 880px; padding-bottom: 5%; }

.footer-bg{ background: url(../images/top-footer_bg.png) repeat-x center bottom; background-size: contain;/* position: relative; z-index: 0; */ }
footer{ width:100%; position: relative;}

.cont-right{ width: calc( 100% - 260px ); max-width: 1140px; /* width: 81.429%; */ }
.cont-left{ width: 260px; }
header #Logo{ width: 78%; max-width: 312px; position: relative; margin:3% 0 0 2%; }
header #GlovalNavi{ width: 80%; max-width: 320px; margin: 32% 0 0 9%;}
header #GlovalNavi > div{ margin-bottom: 8%; }
#SpMenu,#SpMenuClose{ display: none; }

.sub-navi{ width: 88.63%; max-width: 780px; margin: 0 auto; margin-bottom: 1em; }
.sub-navi .navi-body{ display: flex; font-size: .888em; }
.sub-navi .navi-body > div{ margin-right: .5em; }

.sc-page-title h1{ display: block; width: 50%; max-width: 640px; margin: 4% 4% 5% auto; }
.sc-content-s0{ width: 100%; max-width: 880px; margin: 0 auto; }
.sc-content-s1{ width: 88.63%; max-width: 780px; margin: 0 auto; }

footer{ position: relative; text-align: center;  padding: 0 0 2em 0; }
.ft-copyrihgt{ font-size: 0.611em; margin: 0; color: #fff; }
#PageTop{ width: 2.6em; height: 2.6em; position: absolute; bottom:2em; right:2em; /* z-index: 11; */ }

.entry{ width: 88.63%; max-width: 780px; margin: 0 auto; margin-bottom: 4em; }
.entry:last-child{margin-bottom: 0;}
.entry .entry-head{ margin-bottom: 1em; display: flex; }
.entry .entry-date{ width: 4.4em; height: 4.4em; color:#fff; background: url(../images/news-date_bg.png) no-repeat left top; background-size: contain; flex-basis: 9%; }
.entry .entry-date > p{ font-size: 0.666em; line-height: 1.1;  transform: rotate(-45deg); -ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg);transform-origin:45% 15%;}
.entry .entry-date > p span{ display: block; }
.entry .entry-title{ padding-top: 1em; color: #b73459; font-size: 1.333em; flex-basis: 90%; margin-left: -0.8em; }
.entry .entry-body{   }
.entry .entry-left{ width: 43.58%; margin-right: 3%; /* float: left;  */box-sizing: border-box; }
.entry .entry-right{ width: 53.42%; /* float: left; */ box-sizing: border-box; }
.entry-nodate .entry-title{ width: 100%; display: block; }
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

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

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

/* NEWS */
#Page_News{ background-color: #f09eb5; }
#Page_News .upper{ background: url(../images/news-upper_bg.png); }
#Page_News .footer-bg{ background-image: url(../images/news-footer_bg.png);  }

/* ON AIR */
#Page_Onair{ background-color: #9cbaff; }
#Page_Onair .upper{ background: url(../images/onair-upper_bg.png); }
#Page_Onair .footer-bg{ background-image: url(../images/onair-footer_bg.png);  }
#Page_Onair .upper-bg{ background: url(../images/onair-fig.png) no-repeat right bottom; background-size: 18.55em auto; }
.table-onair{ font-size: 1.111em; }
.table-onair tr{ padding-bottom: .5em; } 
.table-onair th{ color: #9cbaff; padding-right: 1em; vertical-align: top;}
.table-onair .c1{ display: inline-block; width: 6.5em; }
.onair-line{ background:url(../images/onair-line.png) no-repeat left center; background-size: inherit; }
.table-onair a{ color: #9cbaff; }
.onair-list2{  margin: 0 auto; display: flex; flex-wrap: wrap;  }
.onair-list2 > div{ background-color: rgba(255,255,255,.5); width: 49%; margin: .3em .5%;   }
.onair-list2 a{ color: #9cbaff; }

/* STORY */
#Page_Story{ background-color: #d595bd; }
#Page_Story .upper{ background: url(../images/story-upper_bg.png); }
#Page_Story .footer-bg{ background-image: url(../images/story-footer_bg.png);  }
/* #Page_Story article{ background: url(../images/story-intro_txt_bg.png) no-repeat right top; background-size: contain; } */

.story-navi{ display: flex; flex-wrap: wrap; width: 96.6%; max-width: 850px; margin: 0 auto; margin-bottom: 1em; }
.story-navi > div{ width: 7.4%; margin: 0.4665%}
.story-navi > div.cs{ opacity: .5; pointer-events: none; }
.story-navi > div.crt{ pointer-events: none; }
.story-navi-intro{ margin-bottom: 0;} 
.story-navi-intro > div{ width: calc(7.4% * 5 + 0.4665% * 8);}

.story-ep-container{ width: 96.6%; max-width: 850px; margin: 0 auto;  position: relative; border-radius: .5em; border: #d595bd solid .222em; overflow: hidden; }
.story-ep-container .ep-title{ font-size: 1.222em; padding: .4em; text-align: center; margin-bottom: .5em; background-color: #d595bd; color: #FFF; }
.story-ep-container .ep-title > span{}
.story-ep-container .ep-staff{ margin: 0 1em; text-align: center; }
.story-ep-container .ep-text{ margin: 0 1em; }
.story-ep-container .slider-sceneImage{ margin: 1em 1em .2em 1em; }
/*
.story-ep-container .slider-sceneImage .slick-slide { transition: .3s ease; transform: scale(.85); transform-origin: 100% 50%;}
.story-ep-container .slider-sceneImage .slick-current { transform: scale(1); transform-origin: 50% 50%;}
.story-ep-container .slider-sceneImage .slick-current + .slick-slide { transform-origin: 0 50%;}
*/
.slider-thumb{ display: flex; flex-wrap: nowrap;  margin: 0 1em 1em 1em; }
.slider-thumb > div{ margin-right: .2em; }
.slider-thumb > div:last-child{ margin-right: 0; }

.story-intro-container{ width: 96.6%; max-width: 850px; margin: 0 auto; position: relative; }
/* .story-intro-container > div{ background: url(../assets/story/intro-bg.png) no-repeat right top; background-size: contain; } */

#Outline{ margin-bottom: 2em; }
#StoryData{ display: none; }


/* STAFF&CAST */
#Page_Staffcast{ background-color: #c0d353; }
#Page_Staffcast .upper{ background: url(../images/staffcast-upper_bg.png); }
#Page_Staffcast .footer-bg{ background-image: url(../images/staffcast-footer_bg.png);  }

/* CHARACTER */
#Page_Character{ background-color: #81cddb; }
#Page_Character .upper{ background: url(../images/character-upper_bg.png); }
#Page_Character .footer-bg{ background-image: url(../images/character-footer_bg.png);  }

nav.chara-navi{ margin: 0 auto -2% 3.5%; width: 75%; background: url(../images/character-chara-navi-bg2.png) no-repeat center top; background-size: 100% 100%; }
nav.chara-navi > .inner{ display: flex; padding: 4% 3% 7% 3%;  }
nav.chara-navi > .inner > div{ margin-right: 1%; } 
nav.chara-navi > .inner > div:last-child{ margin-right: 0; }
.chara-list > div{ display: none; }
.chara-list > div#C1{ display: block; }

/* PRODUCTS */
#Page_Products{ background-color: #eab93a; }
#Page_Products .upper{ background: url(../images/comics-upper_bg.png); }
#Page_Products .footer-bg{ background-image: url(../images/comics-footer_bg.png);  }
#Page_Products .sub-navi .navi-body > div{ width:10.666em;}
.products-line{ background:url(../images/products-line.png) no-repeat left center; background-size: inherit; }
.entry-products{ width: 88.63%; max-width: 780px; margin: 0 auto; margin-bottom: 4em; }
.entry-products .entry-title{ font-size: 1.666em; color:#eab93a; text-align: center; background:url(../images/comics-line.png) no-repeat center bottom; background-size: inherit; padding-bottom: .5em; margin-bottom: .5em; }

#Page_Products .ilink2{ background-color: #eab93a;}

.entry-products2{ width: 88.63%; max-width: 780px; margin: 0 auto; margin-bottom: 4em; border-radius: .5em; border: #eab93a solid .222em; background-color: rgba(255,255,255,.8); }
.entry-products2 .entry-title{ font-size: 1.222em; color:#fff; text-align: center; background:#eab93a; border-radius: .2rem .2rem 0 0; padding: .2em; }
.entry-products2 .entry-body{ padding: 1em; }

.music-col-block{ display: flex; flex-wrap: wrap; margin-bottom: 1em; }
.music-col-block .left-col{ width: 47.62%; margin-right: 1.9%; }
.music-col-block .right-col{ width: 50.48%; }
.table-music-data th{ vertical-align: top; font-weight: normal; }

.bnf-list{ display: flex; flex-wrap: wrap; margin-bottom: 1em; }
.bnf-list .item{ width: 49%; margin: .5%; }
.bnf-list .shop{ width: 100%; font-size: 0.888em; color: #fff; background-color: #eab93a; font-weight: bold; margin-bottom: .2em; }
.bnf-list .thumb-np{  border: #eab93a dotted 1px;  margin-bottom: .2em; }
.bnf-list .data{ text-align: center; }
.bnf-list .name{ font-size: 0.888em; /* color: #eab93a; */ letter-spacing: -0.05em; margin-bottom: .3em; }
.bnf-list .cond{ font-size: 0.666em; margin-bottom: .3em; }
.bnf-list .start{ font-size: 0.666em; }

.bnf-list.news-bnf-list .shop{  background: none; color: #f09eb5  }
.bnf-list.news-bnf-list .thumb-np{  border: none;  margin-bottom: .2em; }
.bnf-list.news-bnf-list .cond{ display: none; }
.bnf-list.news-bnf-list .start{ display: none; }

.bnf-list-music{ display: flex; flex-wrap: wrap; margin-bottom: 1em; }
.bnf-list-music .item{ width: 49%; margin:0 .5%; display: flex; flex-wrap: wrap; margin-bottom: 1em; align-items: center; }
.bnf-list-music .item-col1{ width: 98%; margin: 0 .9%; display: flex; flex-wrap: wrap; margin-bottom: 1em;  }
.bnf-list-music .item-col2{ width: 49%; margin: 0 .5%; display: flex; flex-wrap: wrap; margin-bottom: 1em;  }
.bnf-list-music .shop{  width: 100%; padding: 0 .2em; font-size: 0.888em; color: #fff; background-color: #eab93a; font-weight: bold; margin-bottom: .2em; text-align: center;}
.bnf-list-music .thumb-np{ border: #eab93a dotted 1px;  margin-bottom: .2em;  }
.bnf-list-music .data{ text-align: center; width: 100%;}
.bnf-list-music .excond{  }
.bnf-list-music .name{ font-size: 0.888em; /* color: #eab93a; */ letter-spacing: -0.05em; margin-bottom: .3em; }
.bnf-list-music .cond{ font-size: 0.666em; margin-bottom: .3em;}
.bnf-list-music .start{ font-size: 0.666em; }

.bnf-list-music.news-bnf-list-music .shop{  background: none; color: #f09eb5  }
.bnf-list-music.news-bnf-list-music .thumb-np{ /*  border: none;  margin-bottom: .2em; */ display: none; }
/* .bnf-list-music.news-bnf-list-music .cond{ display: none; } */
.bnf-list-music.news-bnf-list-music .start{ display: none; }

/* SPECIAL */
#Page_Special{ background-color: #f7ab8a; }
#Page_Special .ct-color{color: #f7ab8a;}
#Page_Special .upper{ background: url(../images/special-upper_bg.png); }
#Page_Special .footer-bg{ background-image: url(../images/special-footer_bg.png);  }
#Page_Special a.ilink-btn{ background-color: #f7ab8a; }
#Page_Special .sub-navi .navi-body > div{ width:10.666em;}

#Page_Special .ilink2{ background-color: #f7ab8a;}

.entry-movie{ width: 88.63%; max-width: 780px; margin: 0 auto; margin-bottom: 4em; border-radius: .5em; border: #f7ab8a solid .222em; background-color: rgba(255,255,255,.8); }
.entry-movie .entry-title{ font-size: 1.222em; color:#fff; text-align: center; background:#f7ab8a; border-radius: .2rem .2rem 0 0; padding: .2em; }
.entry-movie .entry-body{ padding: 1em; }

/* TOP */
#Page_Top{ background:#FFF url(../images/top-upper_bg.png);  }
#Page_Top .upper{ /* background:#6dd3e6 none; */ background:url(../images/top-upper_bg2.png) repeat-x center top; background-size: auto 53.11em; }
#Page_Top .middle{ display: none; }
#Page_Top .ft-copyrihgt{ color: #b2b2b2; }

#Page_Top header{ width: 25%; max-width: 320px; }
#Page_Top article{ width: 75%; max-width: 960px; padding-bottom: 5%; }

#Page_Top header #Logo{ display: none; }
#Page_Top header #GlovalNavi{ width: 96.875%; max-width: 310px; margin: 6% 0 0 0;}
#Page_Top header #GlovalNavi > div{ margin-bottom: 4%; }

/* #Page_Top header .movie{width: 71.5%; max-width: 286px; position: relative; margin:4% 0 0 5%;  } */


#Page_Top article{ margin: 0; padding-bottom: 0; /* margin-bottom: -2.1%; */ }

#Page_Top .upper .logo-bg{z-index: 1; display: none;}
#Page_Top .footer-bg{ width: 100%;  position: relative; }

#Page_Top .sc-top_kv{ position: relative; line-height: 0;}
#Page_Top .sc-top_kv .inner{ position: relative;}
#Page_Top .sc-top_kv .inner .spc{ position: relative; }
#Page_Top .sc-top_kv .inner .vis{ width: 100%; height: 100%; position: absolute; top:0; right:0; overflow: hidden; }
#Page_Top .sc-top_kv .inner .vis .vis-anim-spc{ position: relative; }
#Page_Top .sc-top_kv .inner .vis #animation_container{ position: absolute; top:0; width: 100%; height: 100%; }

#Page_Top .sc-top_kv .inner .vis-logo{ width: 37.605%; max-width: 361px; position: absolute; top:0; right:2.5%; }
#Page_Top .sc-top_kv .inner .onair{ width: 49.0625%; max-width: 471px; position: absolute; top:2%; left:2.5%; }


#Page_Top .sc-movie{ width: 32.5%; max-width: 286px; position: absolute; top:28%; left: -33%; z-index: 1; }
#Page_Top .news-twitter{ width: 33.9%; position: absolute; top:45%; left: -33.9%;z-index: 1; }
#Page_Top .sc-news .ttl,
#Page_Top .sc-twitter .ttl{ margin-bottom: .5em; }
#Page_Top .sc-news .news-container,
#Page_Top .sc-twitter .twitter-container{ background-color: rgba(255,255,255,.9); border-radius: .7em 0 0 .7em; padding: .7em; }
#Page_Top .sc-news{ margin-bottom: 1.5em; }
#Page_Top .sc-twitter{ margin-bottom: 1.5em; }

.news-container dl{ font-size: 1.0em; margin: 0 0 .3em 0;}
.news-container dl:last-child{ margin: 0;}
.news-container dl dt{ font-size: 0.66em; font-weight: normal; margin-bottom: 0; letter-spacing: 0.05em; }
.news-container dl dd{ font-size: 0.77em; line-height: 1.1; color: #000; }
.news-container dl dd a,
.news-container dl dd a:visited{ text-decoration: none; color: #000; }
.news-container dl dd a:hover{ text-decoration: underline; color: #000; }

#Page_Top footer{ position: relative; text-align: center;  padding: 2em 0 3em 0; }


.pc-dur1{ animation-duration: 0;}
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■      

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

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

}
/* Custom 1440 ----------------------------------------------------------------------------- */
@media (max-width: 1439px) {
/* body{ font-size: calc((100vw / 1440) * 18); } */
.upper .logo-bg{ width: 38.21%; max-width: 489px; position: absolute; /* top:-15.625%; */ top:-15.625vw; left: -8.2vw; }
}
/* Custom 1280 ----------------------------------------------------------------------------- */
@media (max-width: 1279px) {
body{ font-size: calc((100vw / 1280) * 18); }
/* .upper .logo-bg{ width: 38.21%; max-width: 489px; position: absolute; /* top:-15.625%; */ top:-15.625vw; left: -8.2vw; } */
}
/* LG ----------------------------------------------------------------------------- */
@media (max-width: 1199px) {

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

}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
.pcbr {display: none;}
.pcbr:before {content: "" ;}
.spbr:before {content: "\A" ;white-space: pre ;}
.pc-dur1{ animation-duration: 1.0s;}
.al-ct-pc{ text-align: inherit; }
.al-ct-sp{ text-align: center; }

.list-a > div{ width: 99%;   }

/* ---- Structure ---- */
body{ font-size: calc((100vw / 960) * 36); }
/* body{ font-size: calc((100vw / 640) * 16); } */

/* .upper > .inner{ flex-direction: column;} */
.upper .upper-bg > .inner{ display: block;}
.upper .logo-bg{ display: none; }

header{ width: 100%; max-width: inherit; position: absolute; z-index: 5; top:0; }
article{ width: 100%; max-width: inherit; padding-bottom: 9%; }

header #Logo{ width: 49.792%; max-width: 478px; position: relative; margin:0 auto; padding-top: 2%; }
header #GlovalNavi{ width: 66.67%; max-width: 640px; margin: 3% 0 0 23%;}
header #GlovalNavi > div{ margin-bottom: 2%; }
#SpMenu{ display: block; width: 12.84%; position: absolute; padding-top: 3%; top:3%; left: 3%; z-index: 2; }
.gloval-nav-block{ padding-bottom: 5%; background: url(../images/common-spmenu_bg.png) no-repeat center top; background-size: cover; }
#SpMenuClose{ display: block; width: 5.11%; margin: 0 4% 0 auto; }
.sc-page-title h1{ display: block; width: 66.67%; max-width: 640px; margin: 0 4% 7% auto; padding-top: 4%; }
.sc-content-s0{ width: 100%; max-width: inherit; margin: 0 auto; }
.sc-content-s1{ width: 91.667%; max-width: 880px; margin: 0 auto; }

.gloval-nav-block{ display: none; }

footer{ position: relative; text-align: center;  padding: 0 0 2em 0; }
.ft-copyrihgt{ font-size: 0.611em; margin: 0; color: #fff; }
#PageTop{ width: 2.6em; height: 2.6em; position: relative; bottom:inherit; right:inherit; margin: 0 auto 1em auto; }


.entry .entry-date{ width: 4.4em; height: 4.4em; flex-basis: 18%; }
.entry .entry-title{ flex-basis: 82%; }

/* ON AIR */
#Page_Onair .upper-bg{ background-size: 8em auto; }
.onair-bg-prop{  width: 8em; bottom:-1em; right: 0;  }
.onair-list2 > div{ width: 99%;   }

/* STORY */
.story-navi{ width: 91.667%; }
.story-navi > div{ width: 11.8%; margin: 0.3%} 
.story-navi-intro > div{ width: calc(11.8% * 5 + 0.3% * 8);}

.story-ep-container{ width: 91.667%;}
.story-intro-container{ width: 91.667%;}

/* PRODUCTS */
.music-col-block{ /* width: 70%; */ margin: 0 auto 1em auto; }
.music-col-block .left-col{ width: 100%; margin-right: 0; }
.music-col-block .right-col{ width: 90%; margin: 0 auto; }
.bnf-list .item{ width: 99%; margin: .5%; }
.bnf-list-music .item{ width: 99%; margin:0 .5%; display: flex; flex-wrap: wrap; margin-bottom: 1em; align-items: center; }


/* CHARACTER */
nav.chara-navi{ width: 91.667%; margin: 0 auto -2% auto; background-image:url(../images/character-chara-navi-bg2-sp.png)  }
nav.chara-navi > .inner{ flex-wrap: wrap; padding: 2.5% 2% 5% 3%;  }
nav.chara-navi > .inner > div{ width: 24%; margin-right: 1%; margin-bottom: 1%; } 

/* TOP */
#Page_Top .upper{  background-image:none; }
#Page_Top header{ width: 100%; max-width: inherit; }
#Page_Top article{ width: 100%; max-width: inherit; padding-bottom: 5%; }

#Page_Top header #Logo{ display: block; }
#Page_Top header #GlovalNavi{ width: 66.67%; max-width: 640px; margin: 3% 0 0 23%;}
#Page_Top header #GlovalNavi > div{ margin-bottom: 2%; }
#Page_Top header .gloval-nav-block{ z-index: 1; }

#Page_Top .sc-top_kv .inner .vis{ width: 100%; position: absolute; top:0; right:0;  }
#Page_Top .sc-top_kv .inner .onair{ width: 44%; top:2%; left:16.5%; }
#Page_Top .sc-movie{ width: 91.667%; max-width: 880px; margin: 1em auto 1em auto; position: relative; top:inherit; left: inherit; text-align: center; }

#Page_Top .news-twitter{ width: 91.667%; max-width: 880px; margin: 0 auto; position: relative; top:inherit; left: 0; right: 0; }
#Page_Top .sc-news .ttl,
#Page_Top .sc-twitter .ttl{ width: 66.67%; max-width: 640px; }
#Page_Top .sc-news .news-container,
#Page_Top .sc-twitter .twitter-container{ background-color: inherit; border-radius: inherit; padding: 0; }
#Page_Top .sc-news{ margin-bottom: 2em; }

}
/* XS ----------------------------------------------------------------------------- */
@media (max-width: 543px) {


}
/* pc - large ----------------------------------------------------------------------------- */
@media (min-width: 768px) {
.spbr {display: none;}
.spbr:before {content: "" ;}

}
/* pc - xlarge ----------------------------------------------------------------------------- */
@media (min-width: 1200px) {

}
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■      

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
.dly-5{ animation-delay: 0.5s;}
.dly1{ animation-delay: 1.0s;}
.dly1-5{ animation-delay: 1.5s;}
.dly2{ animation-delay: 2.0s;}
.dly3{ animation-delay: 3.0s;}
.dly4{ animation-delay: 4.0s;}
.dly5{ animation-delay: 5.0s;}
.dur-5{ animation-duration: 0.5s;}
.dur1{ animation-duration: 1.0s;}
.dur1-5{ animation-duration: 1.5s;}
.dur2{ animation-duration: 2.0s;}
.dur3{ animation-duration: 3.0s;}
.dur4{ animation-duration: 4.0s;}
.dur5{ animation-duration: 5.0s;}

@-webkit-keyframes fadeInDownSM {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -15%, 0);
    transform: translate3d(0, -15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownSM {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -15%, 0);
    transform: translate3d(0, -15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownSM {
  -webkit-animation-name: fadeInDownSM;
  animation-name: fadeInDownSM;
}

@-webkit-keyframes fadeInUpSM {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpSM {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 15%, 0);
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpSM {
  -webkit-animation-name: fadeInUpSM;
  animation-name: fadeInUpSM;
}