@import url("https://use.typekit.net/nfq5gja.css");
@import url("https://use.typekit.net/vmb6vko.css");
@charset "UTF-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}
div.embed-tbsplayer-audio {
background-color:#fff;
}
div.embed-tbsplayer-audio .tbs-player {
height:46px;
}
div.lbx-overlay {
z-index:10000;position:absolute;background-color:#000;width:100%;height:100%;left:0;top:0;right:0;bottom:0;opacity:0.9;
}
/*/////////////////////////////////////////////////////////////////////////
default_CSS
/////////////////////////////////////////////////////////////////////////*/
@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium");
}
body { font-family: Roboto, 'Helvetica Neue' ,'Terminal', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; -webkit-text-size-adjust: 100%; line-height: 1;}
body, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, form, table, caption, tbody, tfoot, thead, tr, th, td, article,figure { margin:0; padding:0; font-weight: normal; font-size:100%; box-sizing: border-box;}
/*p {background-color:rgba(255,255,255,.01);}*/
img,iframe { border:none;}
ol,ul { list-style:none; list-style-type: none;}
.relative { position: relative;}
.hid{visibility: hidden;}
.cover {width:100%; height:100%;}
@media print {
.noprint {display:none !important;}
}
/*font*/
.tCenter { text-align:center !important}
.tRight { text-align:right !important}
.tLeft { text-align:left !important}
/*font-size*/
html { font-size: 62.5%;}
body { font-size: 1.6rem; }
h1 { font-size: 3.2rem; }
h2 { font-size: 2.3rem; }
h3 { font-size: 2.1rem; }
h4 { font-size: 2.0rem; }
p { font-size: 1.6rem; }
.f160 { font-size:160%;}
.f140 { font-size:140%;}
.f130 { font-size:130%;}
.f120 { font-size:120%;}
.f110 { font-size:110%;}
.f95 { font-size:95%;}
.f90 { font-size:90%;}
.f85 {font-size:85% !important;}
.f80 {font-size:80% !important;}
.f75 {font-size:75% !important;}
.stred{color:#af1918;}
.stred2{color:#801012;}
.styel{color:#ba8532;}
.stblu{color:#377a9f;}
.stpur{color:#841c9c;}
.ffsp{font-feature-settings: "palt";}
/*link*/
a { text-decoration:none; color:#fff;}
a:hover { text-decoration:none; color:#fff;}
#menu li,header #logo a,a.btn_prev,a.btn_s,a.btn_i,#prevnext ul li a,.update li a,.bnarea ul li a,.bn_prev a,#gotop a,a.btn_df,ul.bnr li a,.btnitem,#snsarea #sns a,.paraviorg{text-decoration:none;
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}
#menu li:hover,header #logo a:hover,a.btn_i:hover,a.btn_df:hover,.bn_prev a:hover,#gotop a:hover,ul.bnr li a:hover,.btnitem:hover,#snsarea #sns a:hover,.paraviorg:hover{text-decoration:none;
filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70;}
.no-link{ pointer-events: none; cursor: default; text-decoration:none; opacity:0.3;}

.aomg {
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
font-weight: 600;
font-style: normal;
}
.pnec {
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;
}

/*/////////////////////////////////////////////////////////////////////////
コンテンツ用CSS／オリジナル設定
/////////////////////////////////////////////////////////////////////////*/
html, body, div#con-body {background-color:#1b1d1e; color:#fff;}
#con-body {background-color:transparent;}
.inner{width:1080px; margin:0 auto;}

#top header{margin:0 auto;}
#top main#head{width:100%; background-image:linear-gradient(to top, rgba(24,26,29,1) 20%,rgba(33,36,38,1) 60%,rgba(33,36,38,1) 100%);}
#top main#head h1{width:1080px; height:765px; height:530px; position:relative; margin:0 auto;}
/*
#top main#head h1 .main1{background: url(../img/top/main.jpg?0906) no-repeat center bottom; background-size:cover; width:1080px; height:765px; margin:0 auto; position:absolute; bottom:0; left:0; right:0;
animation: fadein 1.8s cubic-bezier(.4, 0, .2, 1) normal;}
*/
#top main#head h1 .main1{width:70%; margin:auto; position:absolute; top:25%; left:0; right:0;
animation: fadein 1.8s cubic-bezier(.4, 0, .2, 1) normal;}
#top main#head h1 .main2{position:absolute; left:0; right:0; top:10%; width:55%; margin:auto; opacity: 0;
animation: fadein 2s ease 1s 1 forwards;}
#top main#head h1 .main3{position:absolute; left:0; right:0; bottom:10%; width:39%; width:65%; margin:auto; opacity: 0;
animation: fadein 2s ease 1.5s 1 forwards;}

/*change*/
#top main#head h1 .main0{width:90%; position:absolute; top:38%; left:5%; opacity: 0;
animation: fadeinout 6s ease 1s 1 forwards;}
#top main#head h1 .main1{width:70%; margin:auto; position:absolute; top:25%; left:0; right:0; opacity: 0;
animation: fadein 4s ease 6.6s 1 forwards;}
#top main#head h1 .main2{position:absolute; left:0; right:0; top:10%; width:55%; margin:auto; opacity: 0;
animation: fadein 4s ease 8.6s 1 forwards;}
#top main#head h1 .main0 #tjgo2026 { display: block; width: 100%; height: 0; padding-top: 16.71309192%; padding-top: -webkit-calc(360 / 2154 * 100%); calc(360 / 2154 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/top/tjgo2026.png); position: relative;}
#top main#head h1 .main1 #title2026 { display: block; width: 100%; height: 0; padding-top: 50.7%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/top/title2026.png); position: relative;}
#top main#head h1 .main0 #tjgo2026 img, #top main#head h1 .main1 #title2026 img { width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
@keyframes fadeinout {
    0% {opacity:0;}
    80% {opacity:1;}
    100% {opacity:0;}
}
@-webkit-keyframes fadeinout {
    0% {opacity:0;}
    80% {opacity:1;}
    100% {opacity:0;}
}
/*_change*/


@keyframes fadein {
    0% {opacity:0;}
    100% {opacity:1;}
}
@-webkit-keyframes fadein {
    0% {opacity:0;}
    100% {opacity:1;}
}

#container{position:relative;}
#top #container{background: url(../img/top/corner.png) no-repeat 0 0; padding:2em 0 0; background-size:80%;}

#topsns{width:650px; margin:0 auto; padding:.5em 0 0; text-align:center; position:relative; z-index:2;}
#topsns h2{position:relative; vertical-align:middle; display:inline-block; padding:0;
font-size:330%; color:#af1918; letter-spacing:0.05em; z-index:1; position: relative;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;
}
#topsns .slash{height:50px; z-index:1; margin:0 .25em 0 0;}
#topsns h2:before{
content: "";
width:100%;
height:90%;
position: absolute;
left: -120px;
top:0;
background: url(../img/top/slash.svg) no-repeat 0 0; background-size:auto;
}
/*#topsns h2:before{
content: "";
width:70px;
height:1px;
background-color:#af1918;
position: absolute;
left: -85px;
top:50%;
}*/

#topsns #sns{text-align:center; margin:0 auto; display:inline-block; width:250px; vertical-align:middle;}
#topsns #sns a{width:90px; height:90px; margin:0 2.5% 0; position: relative; display:inline-block; border-radius:50%; border:1px solid #fff; transition:.3s;}
#topsns #sns a:hover{opacity:0.5;}
#topsns #sns a img{position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:50%;}
#topsns #sns a.sns_l img{width:55%;}

/*menu*/
#menu {margin:0 auto; position: relative; padding:0 0; box-shadow: 0 50px 30px -30px rgba(0,0,0,0.3); border-top:1px solid rgba(175,25,24,0.6); border-bottom:1px solid rgba(175,25,24,0.6);
background-color:#161819;}
#menu ul {width:1080px; margin:0 auto; display: flex; flex-flow: row wrap; justify-content: center; align-items: center;}
#menu li {text-align:center; height:110px; vertical-align: middle; position: relative; margin:0;
width:150px;
width: -webkit-calc(100% / 6);
width: calc(100% / 6);
}
#menu li:nth-child(odd){background: url(../img/bg3.png); background-size:3px;}
#menu li:nth-child(even){background: linear-gradient(-28deg, rgba(175,25,24,0.5) 0%,rgba(175,25,24,0.3) 15%,rgba(175,25,24,0) 35%,rgba(175,25,24,0) 100%);}
#menu li a {width:100%; height:100%; display: block; text-decoration:none; color:#fff; vertical-align: middle;
z-index:5; box-sizing: border-box;
display: flex;  justify-content: center; align-items: center;
transition-duration: .5s;}

#menu li a p{font-size:150%; font-weight:800; z-index:1; text-shadow: -1px -1px 0px rgba(175,25,24,0.6);}
#menu li a p::first-letter,#menu li span.f130{font-size:130%;}
#menu li span.eng{color:#af1918; display:inline-block; width:100%; font-size:90%; vertical-align: middle; text-shadow:none;
margin:0;
letter-spacing:.04em;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;}
#menu li.menu5 p{letter-spacing:-.2em; line-height:100%;}
#menu li.menu3:hover,#menu li.menu4:hover,#menu li.menu6:hover{opacity:1;}
/*#menu li.menu6{filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5;}*/

.bn_recruit,.bn_generator{margin:2em auto 1em;width:650px; aspect-ratio: 100 / 23; box-shadow:14px 14px 20px rgba(0,0,0,0.3); position: relative; border:1px solid rgba(175,25,24,0.6);}
.bn_recruit a,.bn_generator a{display:block; width:100%; height:100%; background: url(../img/top/bn_2026_2.png) repeat center center; background-size:cover; transition: 0.5s;}
.bn_generator a{background-image:url(../img/top/bn_generator.png?2601);}
.bn_recruit a:hover,.bn_generator a:hover{opacity:0.5;}

/*next*/
#next{margin:.8em auto 0; padding:2em 0 7em; position: relative; 
background: url(../img/top/tr1.svg) no-repeat left bottom;
background-size:20%;
overflow: hidden;
}
#next:before{background: url(../img/bg.png) repeat right top; background-size:auto;
  content: '';
  position: absolute;
  top:15%;
  right:0;
  width:75%;
  height:80%;
}
#next h2{position: relative; padding:2.5em 0; background: url(../img/top/next.svg) no-repeat left 20% top 0; background-size:auto 100%; width:50%;}
#next h2 span.ttl{color:#fff; font-size:300%;}
#next .inner{padding:0;}
#next #trailer,#tshd #trailer {position: relative; width:864px; height:486px; background-size:cover; background-position: center center; background-repeat: no-repeat; margin:0 auto; overflow: hidden; z-index:11; transition:.5s; background-size:cover;
background-color:#eee;}

#next #trailer iframe,#next #trailer a,#tshd #trailer iframe,#tshd #trailer a,#spmov iframe {width:100%; height:486px; display:block;}

#next .play_btn,#spmov .play_btn,#tshd .play_btn { width:70px; height: 70px; border-radius:50%; background: rgba(0, 0, 0, .5); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  display: block; z-index:111; 
background-image:linear-gradient(-30deg, rgba(22,23,25,0.7) 0,rgba(22,23,25,0.7) 100%);}
#next .play_txt,#spmov .play_txt,#tshd .play_txt { color: rgba(255, 255, 255,0.8); font-size:140%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)  rotate(90deg);}
#next .slash{height:70px; z-index:1; margin:0 .5em 0 0;}
#next .nextonair{position: relative;}
#next .nextonair h3{padding:.5em 0 0;
text-align:right;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;
font-size:200%;}
#next .nextonair span.sharp{color:#af1918; font-size:200%; letter-spacing:0; padding:0 .3em 0 0;}
#next .nextonair span.epnum{color:#af1918; font-size:200%;}
#next .nextonair span.nextoad{font-size:250%; display:inline-block; color:#af1918;}
#next #storyline{width:57%; padding:2em 0 1.5em 2em; }
#storyline p.text {padding:.5em 0; line-height:200%; font-size:170%; color:#fff; letter-spacing:.1em;}
.oa_info{ font-size:130%; color:#fff; text-align:center;width:100%; padding:0 0 .8em;}

#next a.btn_story{position: relative; font-size:200%; display: block; width:25%; text-align:center; margin:1.3em auto 0; color:#1b1d1e; background-color:rgba(175,25,24,1);
transform: skewX(-18deg); 
padding:.8em 0; transition:.5s ease-in-out; box-shadow:14px 14px 14px rgba(0,0,0,0.3);
z-index:11;}
#next a.btn_story span{ display: inline-block; transform: skewX(18deg);}
#next a.btn_story:hover{opacity:0.5;}

.bdr4c{position:absolute; right:calc(50% - 620px); bottom:8%; width:350px; z-index:1;}
.catch2{position:absolute; right:5%; /*right:calc(50% - 700px);*/ bottom:0; width:600px;}

/*topics*/
#tbstopics{margin:3em auto; background-color:#161719;}
/*#tbstopics:before{
content: "";
width:30%;
height:2px;
background-color:#c1af1e;
position: absolute;
left:0;
bottom:5%;
}*/
#topics {position:relative; padding:6em 0 1em;}
#topics h2{color:#af1918; font-size:500%; letter-spacing:.03em;
position: absolute;
left:0;
top:-8%;
}
#topics .tolist{text-align:right; position: absolute; top:10%; right:1%;}
#topics .tolist a{position:relative; display:block; z-index:2; color:#fff; transition:.5s;}
#topics .tolist a:before{
content: "";
width:50px;
height:1px;
background-color:#fff;
position: absolute;
left: -65px;
top: 50%;
}
#topics .tolist a:hover{filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70;}

/*chara
#chara h2{padding:2em 0 1.5em;}
#chara h2 span.ttl{color:#fff; font-size:300%;}
#chara .inner{padding:0; background: url(../img/top/chara.svg?1) no-repeat left 10% top 0; background-size:75%;}
#chara{background-color:#202123; padding:2em 0;}
#chara .ph_chara{position:relative; max-width:1000px; height:905px; margin:0 auto !important; background:url(../img/top/chara.png?230910) no-repeat center center; background-size:cover;}*/

/*character*/
#character h2{padding:2em 0 1.5em;}
#character h2 span.ttl{color:#fff; font-size:300%;}
#character .inner{padding:0; background: url(../img/top/chara.svg?1) no-repeat left 10% top 0; background-size:75%;}
#character .inner figure{position:relative; width:650px; height:1124px; background: url(../img/top/cast2026.jpg) no-repeat center center; background-size:cover; margin:0 auto;}

.ft-wrap{background: url(../img/bg2.png); background-size:500px;}

/*whatsnew*/
#whatsnew{margin:0 auto; position:relative; background: url(../img/top/logo2.svg) no-repeat center center; background-size:auto 100%; padding:3em 0 0;}
#whatsnew h2{margin:0; z-index:11; position: relative;}
#whatsnew h2 span.ttl{color:#1b1d1e; font-size:280%; margin:0 0 0 auto; padding:0; display:block; text-align:left;}
#whatsnew h2 {
    padding:1em 0;
    background: #af1918;
    font-weight: bold;
     width:41vw;
}
#whatsnew h2::before {
    position: absolute;
    top: 0;
    right:-10%;
    width: 50%;
    height: 100%;
    background: #af1918;
    content: '';
    transform: skew(-30deg);
    z-index: -1;
}
.cat{position:absolute; right:-15%; /*right:calc(50% - 700px);*/ top:5px; width:100px;}
#update {width:1080px; position:relative; margin:0 auto; padding:3em 0 3em;}
#update ul#topicslist{display: flex; flex-flow: row wrap; justify-content: center; align-items: center; /*padding:1em 0 3em 0;
height:auto;*/ height:330px; overflow-y:scroll; padding:.5em 2em 0 0;}
#update ul::-webkit-scrollbar {width:3px;}
#update ul::-webkit-scrollbar-track {background:none;}
#update ul::-webkit-scrollbar-corner {display: none;}
#update ul::-webkit-scrollbar-thumb {background:rgba(175,25,24,0.5); border-radius:20px;}

#update ul#topicslist li{width:47.5%; height:140px; position: relative; margin:0 0 2em 0; z-index:1; border:2px solid #fff; box-sizing: border-box;}
#update ul#topicslist li a span.thum{width:160px; height:136px; display:inline-block; background-size: cover; background-repeat: no-repeat; background-position: center center; vertical-align:top; margin:0 2.5% 0 0; vertical-align: middle; /*background-image:url(../img/ph1.jpg);*/}
#update ul#topicslist li p{display:inline-block;line-height:1.4; padding:0; width:60%; vertical-align: middle; font-weight:500; font-size:110%; color:#fff;}
#update ul#topicslist li a{display:block; width:100%; color:#fff;}
#update ul#topicslist li a:hover{opacity: 0.5; transition: 0.4s;}
#update ul#topicslist li span.ymd{color:#af1918; font-size:120%; display:inline-block; position:absolute; bottom:5%; right:1%; text-align:right; line-height:100%; padding:0 .2em 0;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 600;
font-style: normal;}
/*#update ul#topicslist li:nth-last-child(2) a{pointer-events: none; cursor: default;}*/
#update .ytbthum{background-position: center center !important; background-size:contain !important; background-color:rgba(20,21,21,0.7);}
#update .logothum{background-position: center center !important; background-size:80% !important; background-color:rgba(20,21,21,0.7);}

/*bnr*/
.bnarea{padding:2em 0 .5em; width:100%; background-color:rgba(20,21,21,0.7);}
ul.bnr{display: flex; flex-flow: row wrap; width:1080px; justify-content:center; margin:0 auto; position:relative; z-index:1; padding:0 40px 0 0;}
ul.bnr li{width:500px; height:158px;  margin:0 0 1.5em 0;}
ul.bnr li a{display:block; width:100%; height:100%; background-repeat: no-repeat; background-position:center center; position: relative; background-size:cover; border:1px solid rgba(175,25,24,0.6);}
ul.bnr li.bn_extra a {background-image:url(../img/top/bn_extra.jpg);}
ul.bnr li.bn_stamp a {background-image:url(../img/top/bn_stamp.png?2512);}
ul.bnr li.bn_shopping a {background-image:url(../img/top/bn_shopping.png?240612);}
ul.bnr li.bn_goods a {background-image:url(../img/top/bn_goods.png?2512);}
ul.bnr li.bn_dvd a {background-image:url(../img/top/bn_dvd.png);}
ul.bnr li.bn_goods a {background-image:url(../img/top/bn_goods.jpg);}
ul.bnr li.bn_goods202603 a {background-image:url(../img/top/bn_goods202603.jpg);}

/*sns*/
#snsarea{position: relative; padding:.5em 0 3em; margin:2em auto 4em;
background-image:linear-gradient(to top, rgba(20,21,21,0.7) 0%,rgba(20,21,21,0.7) 100%); 
background-repeat:no-repeat;
background-size:85% 100%;
background-position:right top;
z-index:1;
}
#snsarea .inner{width:1080px; margin:3em auto 0; display: flex; flex-flow: row wrap; position: relative; justify-content: center;}
#igTL h3,#twTL h3,#rect h3{font-size:330%; color:#af1918; letter-spacing:0.05em; z-index:1; position: relative;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;}

#igTL,#twTL{width:350px; height:auto; margin:0 2em 3em 0; position: relative;}
#igTL div.insta,#twTL .tline{width:100%; margin:.5em auto 1.5em; overflow:hidden; background-color:rgba(45,45,45,0.5); border-left:1px solid #af1918;}

#twTL .tw-inner{width:100%; margin:0 auto; position: relative; padding:1.5em 0 0;}
#igTL .outgo,#twTL .outgo{position:absolute; bottom:0; left:1%; font-size:75%; color:#fff; display:block;}
#rect {width:300px; text-align:center; /*background:rgba(255,255,255,0.3);*/}
#rect h3{padding:0 0 4%; background-size:50%;}
#rect .ad {display:block; width:300px; height: 250px; background:#fff;}

#snsarea #sns{text-align:center; margin:0 auto 2em;}
#snsarea #sns a{width:80px; height:80px; margin:5% 1.4% 0; position: relative; display:inline-block; border-radius:50%; border:1px solid #fff;}
#snsarea #sns a img{position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:50%;}
#snsarea #sns a.sns_l img{width:55%;}


/*post*/
#snspost{margin:0 auto; text-align:center; padding:0; position:relative; padding:2.5em 0 0; display: flex; flex-flow: row wrap; justify-content: center; align-items: center;}
#snspost p:first-of-type{font-size:160% !important; text-align:center; font-weight:600 !important; line-height:120% !important;}
#snspost p span.outgo{display:block; font-size:1.25rem !important; padding:0 !important;}
#snspost #sns{text-align:center; margin:0 0 0 1em;}
#snspost #sns a{width:75px; height:75px; margin:0 2px 0; position: relative; display:inline-block; border-radius:50%; transition:.3s; border:1px solid #fff;}
#snspost #sns a:hover{opacity:0.5;}
#snspost #sns a img{position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:40%;}
#snspost p.htag{font-size:180% !important; display:inline-block; padding:1em 0 .5em; line-height:100% !important; font-weight:500 !important; width:100%;}
#snspost p.htag span{color:#ffff; background-color:#af1918; padding:0 !important; display:inline-block; letter-spacing:.05em;}
a.postbtn{font-size:160%; font-weight:700; display: block; width:350px; text-align:center; margin:.5em auto .25em; color:#1b1d1e; background-color:#af1918; transform: skewX(-18deg); padding:.8em 0; transition:.5s ease-in-out; box-shadow:14px 12px 12px rgba(0,0,0,0.15);}
a.postbtn span{ display: inline-block; transform: skewX(18deg);}

/*footer*/
footer{text-align:center; padding:2.5em 0 1.5em; position: relative; z-index:1; /*background-color:#801012;*/ overflow:hidden;
background-image:linear-gradient(to top, rgba(126,16,18,1) 0%,rgba(126,16,18,1) 100%); 
background-repeat:no-repeat;
background-size:100% 88%;
background-position:left bottom;}
footer:before{
content: "";
width:150px;
height:250px;
position: absolute;
right:0;
top:0;
background: url(../img/top/cat2.svg) no-repeat right -30px top 5px; background-size:100%;
}
footer .share{display:inline-block; vertical-align:top; padding:35px 0 0; position: relative; z-index:10;}
footer p.copy {text-align:center; padding:1em 0; font-size:105%; color:#1a1c1e; font-weight: 600;}
footer p.copy a{color:#1a1c1e;}
#secret footer{background:none;}
#secret footer:before{background:none;}
#secret footer p.copy{color:#fff;}

/*f2*/
footer.dir2 .share{position:absolute; top:20%; left:0;}
#rect2 {width:300px; height: 250px; background:#fff; position:absolute; bottom:10%; right:0;}

#gotop {position: absolute; bottom:100px; right:0; z-index:10; text-align:right; padding:1em .8em; width:40px;}
#top #gotop{bottom:40px;}
#gotop a {display:block;}
#gotop img{width:100%; }

/*------------------　2nd　------------------ */
header#dir{padding:0; margin:0 auto; position: relative;}
header#dir #logo{margin:0 auto; background-image:linear-gradient(to top, rgba(24,26,29,1) 20%,rgba(33,36,38,1) 60%,rgba(33,36,38,1) 100%); padding:2em 0 2.5em;}
header#dir #logo a{margin:0 auto; background: url(../img/head.svg?1) no-repeat center center; background-size:contain; display:block; width:600px; height:230px; animation: fadein 1.5s ease 0s 1 normal,blur 1.8s;}
#secret header#dir #logo{background:none; padding:2.5em 0 1.5em;}
#secret header#dir #logo a{margin:0 auto; background: url(../img/logo2026.svg) no-repeat center center; background-size:contain; display:block; width:500px; height:220px; animation: fadein 1.5s ease 0s 1 normal,blur 1.8s;}


h1#ttl{padding:2em 0 3em; margin:0 auto; position: relative; max-width:980px; background-repeat: no-repeat; background-position:left 10% top 0; background-size:auto 100%;}
h1#ttl span{color:#fff; font-size:200%;
font-family:a-otf-midashi-go-mb31-pr6n, sans-serif;
font-weight: 600;
font-style: normal;
text-shadow:2px 2px 0px rgba(0,0,0,0.5);}
#about h1#ttl{background-image: url(../img/about.svg);}
#info h1#ttl{background-image: url(../img/news.svg);}
#story h1#ttl{background-image: url(../img/story.svg);}
#extra h1#ttl{background-image: url(../img/extra.svg);}
#caststaff h1#ttl{background-image: url(../img/caststaff.svg); background-size:auto 85%; background-position:right top 0;}
#caststaff h1#ttl span{letter-spacing:-.15em;}

.wrap{position: relative; padding:3.5em 0 0; background: url(../img/stripe.svg) no-repeat left calc(50% - 600px) top 0; background-size:800px auto;}

#contents{max-width:980px; background-color:rgba(20,21,21,0.7); padding:3.5em 0 2em; margin:-3em auto 3em; position: relative;}
#secret #contents{padding:0; margin:1em auto;}
#contents .inner{width:90%;}
#contents .inner p {padding:1em 0 .5em; line-height:1.7;}

.ph_cut {width:700px; height:467px; margin:1.5em auto; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative;}
.ph_cut_l {width:400px; height:600px; margin:1.5em auto; background-size: cover; background-repeat: no-repeat; background-position: center top; position: relative;}
.lazy {position:relative; display: block; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.lazy img {position:absolute;left:0;top:0; width:100%; height:100%;}
.line1 {border-bottom:1px solid #af1918; padding:0 .2em .15em;}
.line2 {background: linear-gradient(transparent 70%, rgba(255,255,255,0.3) 70%); padding:0 .2em .1em;}
.bdr{padding:.8em 1.5em; margin:1.5em auto; font-size:95%;}
.bdr2{padding:.8em 1.5em; margin:1.5em auto .5em; font-size:95%; border:1px solid #dabd64; box-shadow:10px 10px 20px rgba(29,77,108,0.2);}
.fuchidori {font-weight: bold; color: rgba(0, 0, 0, 0); text-shadow:2px 2px 0 #fef900; -webkit-text-stroke: 1px #fd52ba; text-stroke: 1px #fd52ba;}

/*about*/
#highlight h2{font-weight:800; line-height:150%; font-size:180%; margin:0 0 .5em; text-align:center; position: relative;}
#highlight h2:first-of-type span{display:inline-block; font-size:120%; line-height:160%;
  background-image:linear-gradient(100deg, rgba(19,89,127,1), rgba(255, 255, 255, 0)), linear-gradient(170deg, rgba(43,159,181,1), rgba(255, 255, 255, 0)), linear-gradient(340deg, rgba(0,162,141,1), rgba(255, 255, 255, 0));
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
#highlight h2 span.f140{line-height:130%;}
#highlight p span.f140{font-weight:800;}
#highlight h3{font-weight:600; line-height:150%; font-size:190%; margin:0 auto; text-align:center; padding:1em 0;}
#highlight .heart{width:30px; display:inline-block;}
#highlight .ph1{width:800px; height:565px; background:#ededed;}
#highlight .ph1 span {width:100%; height:100%; background-image:url(../img/aboutph.jpg); background-position: center bottom; position: absolute; z-index:auto; display:block;  background-size: cover;}

#cast table td {padding:.5em .5em .5em 1em; font-size:90%;}
#highlight p.cap {font-size:85%; text-align:center; padding:0 !important; margin:0 !important;}
#highlight .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}
#highlight input:checked ~ .hidden_show {
    padding:.5em 0 0;
    height: auto;
    opacity: 1;
}
#highlight label {cursor :pointer;}
#highlight input {display: none;}
#highlight .comment {padding:.8em 1.2em; margin:1.5em 0; border:1px solid rgba(255,255,255,0.6); box-shadow:6px 6px 14px rgba(29,77,108,0.1);}
#highlight .comment h4{padding:.3em .3em .3em; font-size:130%; font-weight:800; line-height:140%; color:#af1918;}
#highlight .comment p{padding:.5em;}
#highlight label{font-size:140%; font-weight:700; display: block; width:40%; text-align:center; margin:1.5em auto 1.5em; color:#1b1d1e; background-color:#af1918;
transform: skewX(-18deg);
padding:1.2em 0; transition:.5s ease-in-out; box-shadow:14px 12px 12px rgba(0,0,0,0.15);}
#highlight label span{ display: inline-block; transform: skewX(18deg);}
#highlight label:hover{opacity:0.5;}
#highlight .stred {color:#af1918;}

/*caststaff*/
#caststaff h2{color:#af1918; margin:0 auto .5em; text-align:center; letter-spacing:.05em; font-size:400%; position:relative; position: relative; 
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight:700;
font-style: normal;
letter-spacing:.1em;
}
#caststaff p.castname{padding:0; margin:0; font-size:180%; line-height:160%;}
#caststaff p.castname span.lh140{line-height:120%; display:inline-block;}
#caststaff p.castname span.maru{font-size:80% !important; line-height:100% !important; display:inline-block; padding:1em 0 !important; margin:0 !important;
font-family: Roboto, 'Helvetica Neue' ,'Terminal', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-weight:normal;}
#caststaff h2.staff{margin:1.5em auto .5em;}
/*#caststaff h2:before, #caststaff h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color:#c1af1e;
}
#caststaff h2:before {
  left:0;
}
#caststaff h2:after {
  right: 0;
}*/
#caststaff h3{width:82%; margin:1.5em auto .6em; font-size:105%; position: relative; line-height:170%; color:#af1918; background-color:rgba(45,45,45,0.3);
border-left:2px solid #af1918; border-right:2px solid #af1918; transform: skew(-12deg);}
#caststaff h3 span{ display: inline-block; transform: skew(12deg);}

#caststaff #spvlist h2{margin:2em auto 0; letter-spacing:0;}
#caststaff #spvlist h2:first-of-type{margin:0 auto;}
#caststaff h3:first-of-type{margin:0 auto .6em;}
#caststaff .credit{text-align:center; width:60%; margin:0 auto 2em; font-size:140%; line-height:1.7; font-weight: 500;}
#caststaff .credit span.lh120{line-height:120%; display:inline-block; padding:.25em 0 0;}
#caststaff .credit span.f80{font-size:80% !important;}
#caststaff .credit span.f80_2{font-size:85%; line-height:130%; display:block;}
#caststaff .credit span.f80_3{font-size:80%; line-height:130%; display:block;}
#caststaff #spvlist.credit p{line-height:120%;}
#caststaff table{width:80%; margin:0 auto; font-size:160%;}
#caststaff table td{text-align:center; padding:2% 0; line-height:1;}
#caststaff table td.emp{padding:0 !important;}
#caststaff table td.cname{text-align:left;width:47%; vertical-align:bottom;}
#caststaff table td.chara{text-align:right;width:45%; vertical-align:bottom; color:#076981;}
#caststaff table td.naka{padding:0 0 0; font-size:80%; vertical-align:middle; line-height:0; color:#fff;}
#caststaff table td.maru{font-size:80%; color:#fff; padding:0;}
#caststaff table td.bdr_n{padding:0 0 5%; position:relative;}
#caststaff table td.bdr_n:before {
  content: '';
  position: absolute;
  left:0;
  right:0;
  margin:0 auto;
  top: 50%;
  width:80%;
  height: 1px;
  background-color:#bdbbac;
}
.group{font-size:80%; font-feature-settings: "palt";}

/*btn*/
a.btn_df {width:40%; display:block; text-align:center; font-weight:600; font-size:150%; transition: 0.5s; position: relative; padding:1.4em 0; margin:1.5em auto; background: none; color:#eb6100;}
a.btn_df span{position: relative;  z-index:2;}
a.btn_df:before,a.btn_df:after { 
  content:'';
  width:94%;
  height:94%;
  position: absolute;
  display: inline-block;
}
a.btn_df:before {
  border-left: solid 2px #eb6100;
  border-top: solid 2px #eb6100;
  top:0;
  left:0;
}
a.btn_df:after {
  border-right: solid 2px #eb6100;
  border-bottom: solid 2px #eb6100;
  bottom:0;
  right:0;
}

/*share*/
#share{width:50%; text-align:center; margin:2% auto; vertical-align:middle;}
#share span{position: relative; font-weight:600; color:#fff;}
#share span:before{
content: "";
width:35%;
height:1px;
background-color:#fff;
position: absolute;
left:-45%;
top:50%;
z-index:1;
}
#top #share{margin:3.5em auto 0; width:100%; padding:1em 0;}
#top #share h4{font-size:230%; padding:1.5em 0 .6em; position: relative; color:#af1918;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;
}
#top #share h4:before{
content: "";
width:1px;
height:40%;
background-color:#af1918;
position: absolute;
left: 50%;
top:0;
z-index:1;
}
#share ul{display: inline-block; margin:0 0 0 .5em; vertical-align:middle;}
#share ul li{display:inline-block; border-radius:50%; margin:0 .4em 0;}
#share ul li img{width:50px;}
#share ul li a{display:block;}
#share ul li a img{transition: .5s;}
#share ul li a:hover img{transform: scale(1.2);}

/*//////pc//////*/
@media all and (min-width: 768px) {
.nobr{display: none;	}
#next .nextonair{display: flex; flex-flow: row wrap; justify-content: space-between; align-items: stretch;}
#whatsnew h2 span.ttl{max-width:400px;} 
#update ul#topicslist{justify-content: start; align-items: start;}
#update ul#topicslist li:nth-child(2n){margin:0 0 1.5em 4.5%;}

/*ul.bnr li:first-of-type{margin:0 2em 1.6em;}
ul.bnr li:nth-child(2n){margin:0 40px 1em 0;}*/
ul.bnr li:first-of-type,ul.bnr li:nth-child(3n){margin:0 40px 1em 0;}
#topics{width:1080px; margin:0 auto;}
.bdr4c_2{position:absolute; left:calc(50% - 800px); top:-45%; width:350px; z-index:-1;}
}

/*//////smp//////*/
@media all and (max-width: 767px) {
html, body, div#con-body {background-size:150%,auto;}
body,p { font-size: 1.4rem;}
h1 { font-size: 2.6rem;}
h2 { font-size: 2rem; line-height:1.5em;}
h3 { font-size: 1.6rem; }
h4 { font-size: 1.4rem; }
.f90 { font-size: 1.2rem;}
.hidtxt{visibility:visible;}
.hid_sp{display:none;}
.pcbr{display: none;	}
.ph_cut img,.ph_cut_l img,#spot #trailer img,#update ul#topicslist li span.thum img,#mainph span img,.bn_recruit a,#character .inner figure img{position:absolute;left:0;top:0; width:100%; height:100%;}

#top header{margin:0 auto;}
/*#top main#head h1{width:100%; height:0; padding:70.875% 0 0;}
#top main#head h1 .main1{width:100%; height:100%;}*/
#top main#head h1{width:100%; height:0; padding:62% 0 0;}
#top main#head h1 .main1{width:84%; top:26%;}
#top main#head h1 .main2{width:56%; top:10%;}
#top main#head h1 .main2{width:64%; top:10%;}
#top main#head h1 .main3{bottom:9%; width:75%;}

#top #container{padding:5% 0 0;
background-size:100%;}

#topsns{width:100%; margin:0 auto 2.5%; padding:0 0;}
#topsns h2{font-size:9.5vw; padding:0 0 0 5%;}
#topsns h2:before{
background:none;
}
/*#topsns h2:before{
width:35%;
height:1px;
left:-40%;
top:50%;
}*/
#topsns #sns{text-align:left; margin:0 0 0 auto; display:inline-block; width:43%; vertical-align:middle; padding:0 0 0 2%;}
#topsns #sns a{width:15.1vw; height:15.1vw; margin:0;}
#topsns #sns a:first-of-type{margin:0 3.5% 0 0;}

#menu ul {width:100%;}
#menu li {height:0; width:31%;
width: calc(100% / 3);
padding:22% 0 0;
}
#menu li a{position:absolute; top:0; left:0;}
#menu li a p{font-size:4.5vw;}
#menu li.menu5 p{letter-spacing:-.2em;}
#menu li span.eng{font-size:4vw;}
#menu li span.f90{font-size:3.8vw;}

.bn_recruit,.bn_generator{margin:5% auto 5%; width:90%;}

/*next*/
#next{margin:0 auto 0; padding:0 0 14%; overflow:hidden;}
#next .inner{width:100%; padding:0;}
#next:before{
  height:76%;
}
#next h2{width:100%; padding:8% 0 8% 4%;}
#next h2 span.ttl{font-size:10vw;}
#next #trailer{width:96%; position:relative; padding:54% 0 0; height:0; overflow: hidden !important; z-index:11; margin:0 auto;}
#next #trailer{background-position:top 30% center !important; padding:54% 0 0;
/*box-shadow:-6px -6px rgba(255,255,97,0.2),20px 20px 30px rgba(247,213,97,0.5);*/}
#tshd #trailer{width:100%; position:relative; padding:56.25% 0 0; height:0; overflow: hidden !important; z-index:11; margin:0 auto; background-position:top 30% center !important;}
#trailer iframe,.emb iframe,#spmov iframe,#next #trailer a,#next #trailer img,#spmov #digest a,#spmov #digest img,#tshd #trailer a,#tshd #trailer img{position:absolute; top: 0; left:0; width:100% !important; height: 100% !important;}
#next .play_btn,#spmov .play_btn,#tshd .play_btn{width:14%; height:25%;}
#next .play_txt,#spmov .play_txt,#tshd .play_txt {font-size:4.3vw;}

#newep{width:100%; margin:0 auto; padding:.7em 0 0;}

#next .nextonair h3{font-size:3.8vw; letter-spacing:0; position: absolute; bottom:3%; right:3%; display:inline-block; padding:0; width:100%; line-height:100%;}
#next .slash{height:8vw;margin:0 .5% 0 0;}
#newep .nextonair span.sharp{padding:0;}
#newep .nextonair span.epnum{font-size:160%;}
#newep .nextonair span.nextoad{font-size:300%;}
#newep #storyline{width:85%; margin:0 0 0 auto; display:block; position: relative; padding:0 0 1%;}
#newep p.text {line-height:160%; font-size:4.5vw;}
#storyline p.text span{padding:0 1%;}
#storyline p.text span.epline1{margin:0 0 .2em 0;}
#storyline p.text span.epline2{margin:0 0 .2em 4em;}
.oa_info{ font-size:3vw; padding:1% 0 .8em;}
#next a.btn_story{width:54%; margin:5% auto 0; padding:2.5% 0; font-size:5.4vw; letter-spacing:-.1em; line-height:150%;}
.bdr4c{right:-20%; bottom:7%; width:45%;}
.catch2{right:0; width:60%;}

/*topics*/
#tbstopics{padding:0 0 1%; margin:5% auto 0;}
#topics {padding:12% 0 0;}
#topics h2{font-size:13vw; 
left:4%;
top:-14%;
}
#topics .tolist{text-align:right; position: absolute; top:8%; right:1.5%; font-size:3.2vw;}
#topics .tolist a:before{
width:9.5vw;
left: -11.5vw;
}

/*chara
#chara h2{padding:6% 0 4% 4%;}
#chara h2 span.ttl{font-size:10vw;}
#chara h2 span.pastep{font-size:6vw;}
#chara{padding:2.5% 0 5%;}
#chara .inner{width:100%; background-size:100%;}
#chara .ph_chara{width:100%; height:0; padding:89.7% 0 0;}*/

/*character*/
#character h2{padding:6% 0 4% 4%;}
#character h2 span.ttl{font-size:10vw;}
#character .inner{width:100%; background-size:100%;}
#character .inner figure{width:80%; height:0; padding:138.32% 0 0;}

.ft-wrap{background: url(../img/bg2.png); background-size:100%;}

/*whatsnew*/
#whatsnew{margin:0 auto 0; padding:7% 0 0;}
#whatsnew h2{width:58%; margin:0 0 5%; padding:6% 0 6% 4%;}
#whatsnew h2::before {
}
#whatsnew h2 span.ttl{font-size:10vw; padding:0; text-align:left;}
.cat{right:-10%; top:-8%; width:26%;}

#update{padding:0 0 5%; width:100%;}
#update ul#topicslist{height:auto; padding:1% 0 2% 0;
overflow-y:scroll;
height:460px; padding:1% 0 2% 1%;
overflow-scrolling: touch;
-webkit-overflow-scrolling: touch;
height:47vh;}
#update ul#topicslist li p{line-height:130% !important; font-size:3.4vw;}
#update ul#topicslist li{width:88%; height:auto; margin:0 0 4.5%;}
#update ul#topicslist li a span.thum{width:35%; height:auto; margin:0 2% 0 0; position:relative; padding:25% 0 0;} 
#update ul#topicslist li span.ymd{font-size:4vw;}

/*bnr*/
.bnarea{padding:3% 0;}
ul.bnr{width:80%; align-items: center; padding:0;}
ul.bnr li{width:100%; height:auto; margin:2% auto;}
ul.bnr li a{height:0; padding:32% 0 0;}
.streambnr{padding:5% 0; margin:2.5% auto 0;}

/*post*/
#snspost{padding:6% 0 0;}
#snspost p:first-of-type{font-size:5.2vw !important; width:38%; padding:2vw 0 0 !important;}
#snspost p span.outgo{font-size:2vw !important;}
#snspost #sns{margin:0; width:36%; text-align:left;}
#snspost #sns a{width:14vw; height:14vw; margin:0 1.25% 0;}
#snspost p.htag{font-size:5.2vw !important; line-height:130% !important; padding:4vw 0 4vw !important;}
#snspost a.postbtn{width:60%; font-size:5vw; margin:.5vw auto 0;}

/*sns*/
#snsarea{padding:2% 0; margin:4% auto 4%;}
#snsarea .inner{width:100%; margin:5% auto 0;}
#igTL h3,#twTL h3,#rect h3{font-size:11vw;}
#igTL,#twTL{margin:0 auto 10%; width:90%; height: calc(320px + 2%); padding:0 0 2%;}
#igTL{height:auto; margin:0 auto 12%;}
#twTL .tline{
margin:.5% auto 0; padding:0;
height:300px;
/*overflow-y: scroll;*/
overflow-scrolling: touch;
-webkit-overflow-scrolling: touch;}
#igTL div.insta{margin:1% auto 0;}
#twTL .outgo,#igTL .outgo{position:absolute; left:.5%; bottom:-3%;}

#rect {margin:0 auto 3%; z-index:10;}
#rect h3{margin:0; padding:0 0 3%;}

.bdr4c_2{position:absolute; left:-10%; bottom:12%; width:45%;}

#snsarea #sns{margin:3% auto 0;}
#snsarea #sns a{width:70px; height:70px; margin:2% 2% 0;}

@media all and (max-width: 320px) {
#next #sns{width:80%; background-size:100%;}
#next #sns a{width:65px; height:65px; margin:0 1% 0;}
}

footer{padding:8% 0 5%;
background-size:100% 80%;
}
footer:before{
width:28%;
height:100%;
background-position:right -30px top 5px;
}
footer p.copy{text-align:left; padding:2% 0 0 4%; line-height:130%; font-size:90%; width:80%;}
footer.dir2{margin:0 0;}
footer.dir2 .share{position:static; padding:5% 0;}
#rect2{position:static; margin:0 auto;}
#gotop{right:0; bottom:4%; width:35px;}
#top #gotop{right:0; bottom:16%;}

/*------------------　2nd　------------------ */
header#dir{padding:0; margin:0 auto;}
header#dir #logo{padding:6% 0 6%;}
header#dir #logo a{position: relative; width:70%; height:0; padding:30% 0 0;}
#secret header#dir #logo{padding:6% 0;}
#secret header#dir #logo a{width:75%; height:0; padding:32% 0 0;}
header#dir #logo a img {position:absolute;left:0;top:0; width:100%; height:100%;}
.wrap{padding:8% 0 0; background-size:60%; background-position: left -80% top 0;}
h1#ttl{padding:6% 0 9% 3%; background-position:left 20% top 0;}
h1#ttl span{font-size:10vw;}
#caststaff h1#ttl{background-size:auto 100%; background-position:left top;}

#contents{width:96%; margin:-4.5% auto 6%; padding:5% 0 5%; box-sizing: border-box; }
#secret #contents{width:100%; padding:0; margin:0 auto;}
#contents .inner{width:98%;}
#contents .inner p {padding:.5em 0 1em; line-height:160%;}
#contents .inner p.f85,#contents .inner p.f80 {line-height:normal !important;}
.ph_cut {width:100%; height:0; padding:66.6% 0 0; position: relative; margin:1em auto;}
.ph_cut_l {width:60%; height:0; padding:90% 0 0; position: relative; margin:1em auto .5em;}
#bknm{width:100%; margin:2em auto 1em;}
.bdr{width:92%; padding:.4em 0;}

/*about*/
#highlight h2{font-size:4.5vw; padding:0 0 0; line-height:145%; margin:0 0 2%; letter-spacing:-.05em;}
#highlight h2:first-of-type span{line-height:150%; font-size:120%;
  background:linear-gradient(120deg, rgba(19,89,127,1), rgba(43,159,181,1), rgba(43,159,181,0.5)),rgba(100,162,141,1));
  background-image: linear-gradient(-225deg, rgba(19,89,127,1) 0%, rgba(11,122,167,1) 30%, rgba(0,162,141,1) 100%);}
#about #contents p,#story #contents p,#music #contents p {padding:1em 1em .5em;}
#highlight p span.f140{font-size:120%;}
#highlight h3{font-size:4.5vw; padding:3% 0 2% !important; margin:0 auto; line-height:145%; font-feature-settings: "palt"; font-weight:800;}
#highlight .ph1{width:95%; height:0; padding:67.13% 0 0; margin:4% auto 0;}
#highlight .ph1 span{position: absolute; top:0; left:0;}
#highlight .comment{width:94%; margin:.8em auto 1em; padding:2.5%;}
#highlight .comment h4{font-size:130%; padding:.2em 0 0 .3em; margin:0 0 .6em;}
#highlight .comment p{padding:0 .5em !important; font-size:95%;}
#highlight label{width:75%; margin:5% auto 5%; padding:4% 0; font-size:5.5vw; letter-spacing:-.1em; line-height:150%;}

.bdr3{width:92%;}
.bdr3:last-child{padding:0 !important;}

#story #trailer,#movie .emb {width:92%; position: relative; padding:51.75% 0 0; height: 0; overflow: hidden; height:auto; margin:0 auto .5em;}
#story #trailer iframe,#topics .emb iframe,#movie .emb iframe,#story #trailer img{ position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}

/*caststaff*/
#caststaff h2{font-size:12.5vw; margin:0 auto 2%;}
#caststaff p.castname{font-size:5.6vw; padding:0; margin:0;}
#caststaff h2.staff{margin:8% auto 2%;}
#caststaff h3{margin:5% auto .5em; font-size:5vw;}

#caststaff table{width:100%; margin:0 auto 2%;}
#caststaff table td{padding:2.5% 0;}
#caststaff table td.cname{font-size:5vw; width:50%;}
#caststaff table td.chara{font-size:5vw; width:42%;}
#caststaff table td.naka{font-size:3.4vw; vertical-align:middle;}
#caststaff .credit{width:95%; font-size:4.5vw; margin:0 auto 2%;}
#caststaff table td.cname span.f90{font-size:3vw;}
#caststaff table td.maru{font-size:75%; padding:2% 0 !important; line-height:100% !important;}
#caststaff .credit span.f80_2{font-size:90%;}
.group{font-size:70%;}


a.btn_ap {margin:.5em auto 1.5em; width:62%; font-size:1.5rem; font-size:4vw;}
a.btn_s{width:50%;}
a.btn_i {margin:.5em 0 .2em; padding:.5em 2em;}
a.btn_df,#a.btn_df2{width:75%; margin:1.2em auto 5%; padding:4% 0; font-size:5.5vw; letter-spacing:.05em; line-height:150%;}
a.btn_df2{width:70%; padding:4% 0; margin:1.5em auto 1em; font-size:4.3vw;}

#msg #contents h1.entry span.ttl img{top:-1.2%;}
#msg .postbtn{margin:12% auto 5%;}

/*share*/
#share{width:100%; margin:2% auto 5%;}
#top #share{margin:10% auto 0;}
#top #share h4{font-size:8vw; padding:12% 0 4%;}
#top #share h4:before{
height:35%;
top:0;
}
#share span:before{
content: "";
width:40%;
left: -50%;
}
#share ul li{margin:0 .2em 0;}
#share ul li img{width:40px;}
}
.md-inner {box-shadow:none !important;}

.fadedown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadedown;
 -ms-animation-name: fadedown;
 animation-name: fadedown;
 visibility: visible !important;
}
@-webkit-keyframes fadedown {
 0% { opacity: 0; -webkit-transform: translateY(10px);}
 100% { opacity: 1; -webkit-transform: translateY(0);}
}
@keyframes fadedown {
 0% { opacity: 0; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px);}
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
}

/*	instagram
============================== */
#igTL div.insta{padding:3.5% 1%;}
div.insta ul{margin:0 auto; display: flex; flex-flow: row wrap; justify-content: center; align-items: center;}
div.insta ul li {
margin:1.2%;
width: -webkit-calc(96% / 3 - 2.5%) ;
width: calc(96% / 3 - 2.5%);
}
div.insta ul li span, div.insta ul li a, div.insta ul li a img {
	display:block;
}
div.insta ul li a, div.insta ul li a img {
	background-position:center center;
	background-repeat:no-repeat;
}
div.insta ul li a {
	background-size:cover;
	position:relative;
	height:0;
	padding-top:100%;
}
div.insta ul li a:hover img {
	background-color:rgba(20,20,20,0.5);
}
div.insta ul li a img {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border:0;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	transition:.5s;
}
div.insta ul li a img.icon-video {
	background-image:url(../img/top/play.svg);
	background-size:35%;
}

@media all and (max-width: 767px) {
#igTL div.insta{padding:3% 1.5% 3%;}
div.insta ul{margin:0 auto 0;}
div.insta ul li {margin:1.1%;}
}

div#bn_super {border-bottom:1px solid #e8e4e0;}

/* stream */
#stream{padding:1.5em 0 1em; max-width:1080px; margin:0 auto; text-align:center;}
#stream h2{font-size:500%; color:#af1918; letter-spacing:0.05em; z-index:1; position: relative; text-align:left;
font-family: "proxima-nova-extra-condensed", sans-serif;
font-weight: 700;
font-style: normal;}

div#tshd{padding:1.5em 0 1.5em; text-align:center; background-color:rgba(20,21,21,0.7);}
div#tshd span.tbs-stream-txt{
font-size:140%;
letter-spacing:.1em;
color:#fff;
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif !important;
font-weight: 600;
font-style: normal;
}
div#tshd .stream_bn{max-width:1080px; margin:auto; display: flex; flex-flow: row wrap; justify-content:center;}
div#tshd .latest{width:30%; padding:0 5% 0 0; border-right:1px solid rgba(255, 255, 255,0.5);}
div#tshd .allep{width:60%;}

div#tshd .stream_bn a{background-color:rgba(255,255,255,0.8); display:block; margin:.5em auto; padding:1.8em 0; background-position: center center; background-repeat: no-repeat;}

div#tshd .allep ul {display: flex; flex-flow: row wrap; justify-content:center; align-items: stretch; width:100%;}
div#tshd .allep ul li {	width:40%; margin:0 0 0 1.5em;}

div#tshd .stream_bn .latest a{background-image:url(../img/top/tver_g.svg); background-size:30%;}

@media all and (max-width: 767px) {
div#tshd{padding:0;}
div#tshd .stream_bn{width:96%;}
div#tshd span.tbs-stream-txt{font-size:3.5vw !important;}
/*div#tshd .allep ul li { width:45%; width:40%; margin:0 0 0 3%; margin:0 2% 0;}
div#tshd .stream_bn a{margin:3% auto 0; padding:15% 0; padding:13% 0;}
div#tshd .latest{width:35%; padding:0 3% 0 0;}
div#tshd .allep{width:65%; width:80%;}
div#tshd .stream_bn .latest a{background-size:40%; padding:13.5% 0;} 
div#tshd .stream_bn .paravi a{background-size:75%;}
div#tshd .stream_bn .netflix a{background-size:70%;}*/
}

div#tsft{padding:1em 0; margin:0 auto;}
div#tsft nav ul {
    margin:0 auto;
	max-width:980px !important;
	display: flex; flex-flow: row wrap; justify-content: center; align-items: center;
}
div#tsft nav ul li {
    width:35%;
	margin:0 1% 2% !important;
	border:1px solid rgba(2555,255,255,0.6);
}
div#tsft nav ul li.u-next{background: url(../img/top/u-next.svg) no-repeat center center !important; background-size:65% !important;}
div#tsft nav ul li.netflix{background: url(../img/top/netflix.svg) no-repeat center center !important; background-size:60% !important;}
div#tsft nav ul li a {
	display:block;
	padding:28% 0 0;
	background-repeat: no-repeat;
	background-position:center center;
}
div#tsft p {
line-height:120%;
font-size:90%;
padding:0 !important;
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
font-weight: 600;
font-style: normal;
}
/*div#tsft a{width:300px; padding:2.5em 0; display:block; background: url(../img/top/u-next.svg?2025) no-repeat center center !important; background-size:65% !important; margin:1em auto; border:1px solid rgba(2555,255,255,0.6);}*/

/*//////smp//////*/
@media all and (max-width: 767px) {
#stream{padding:0 0 5%;} 
#stream h2{font-size:13vw; padding:0 0 0 4%;}
div#tsft{padding:0;}
div#tsft nav ul {width:100%;}
div#tsft nav ul li {width:45%;}
.tbs-stream-footer nav ul {justify-content: center;}
.tbs-stream-footer nav ul li {
	width: calc(100% / 2 - 4%);
	margin:0 1.8% 3%;
}
.tbs-stream-footer nav ul li.tbs-stream-paravi a {background-size:58% !important;}
div#tsft p {font-size:2.8vw;}
}

#bn_rect,#bn_responsive{text-align:center;}
#top #bn_rect{padding:0 0 1em;}
#bn_rect{padding:1em 0;}
#bn_responsive{padding:0 0 1em;}

/*lazyload*/
.lazyload, .lazyloading { opacity: 0;}
.lazyloaded { opacity: 1; transition: all 1000ms;}

.nocontxt { user-select: none; -webkit-user-select: none; -ms-user-select: none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-drag:none; -khtml-user-drag: none; -webkit-touch-callout: none; text-align:center;}
.nocontxt img { pointer-events: none;}
.prgimg100 { max-width: 100%;}


a.btn_info{font-size:200%; font-weight:700; display: block; width:38%; text-align:center; margin:1em auto .25em; color:#1b1d1e; background-color:#af1918; transform: skewX(-18deg); padding:.8em 0; transition:.5s ease-in-out; box-shadow:14px 12px 12px rgba(0,0,0,0.15);}
a.btn_info span{ display: inline-block; transform: skewX(18deg);}
a.cast_btn_info { font-size: 150%; line-height: 130%;}
@media all and (max-width: 767px) {
a.btn_info{width:68%; margin:5% auto .5%; padding:4% 0; font-size:6vw; letter-spacing:.05em; line-height:150%;}
a.cast_btn_info { font-size: 5vw; line-height: 120%;}
}

/* stream */
#stream0 { padding: 0 0 1em 0; text-align:center; max-width:1200px; margin: 2em auto 0 auto;}
.muryo { text-align: center; font-size: 130%; font-weight: 800; padding-bottom: .5em;}
.muryo:before { content: "／"; display: inline-block; transform: scaleX(-1);}
.muryo:after { content: "／"; display: inline-block;}
div#tsft nav ul { max-width:1200px !important;}
#tsft .tver{background:url(../img/top/tver_g.svg) no-repeat center center !important; background-size:30% !important;}
#tsft .tbsfree{background:url(../img/top/tbsfree.svg) no-repeat center center !important; background-size:80% !important;}
/*for_W768-*/
@media (min-width: 768px) { 
div#tsft nav ul li { width: 21%;}
}