/*	DRAMA v8hanyou
============================== */


/* youtube */
.movies ul { width: 99%; margin: 0 auto;}
.movies ul, .movies li { list-style: none; margin: 0; padding: 0; border: 0;}
.movies ul:before, .movies ul:after { content: ""; content: none; display: table;}
.movies ul:after { clear: both; }
.movies ul::after { content: ""; display: block; clear: both;}
.movies li { width: 49%; float: left; background-color: #e6f1fa; margin-bottom: 2%;}
.movies li:nth-child(2n) { float: right;}
.movie { width: 100%; height: 0; padding-top: 56.25%; position: relative; overflow: hidden;}
.movie a { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0;}
.movie a:hover { opacity: .8;}
.movie img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
.movie .play_btn { width: 40px; height: 40px; -ms-border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; background: rgba(0, 0, 0, .5); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%); display: block;}
.movie .play_txt { color: rgba(255, 255, 255, 1); font-size: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)  rotate(90deg); -webkit- transform: translate(-50%, -50%)  rotate(90deg);}
/* _plus */
.movie_sp { display: block; box-sizing: border-box; width: 100%; margin: .5em auto 1em auto; background: rgba(42, 43, 46, 1);}
.movie_sp .movie .play_btn { width: 60px; height: 60px;}
.movie_sp .movie .play_txt { font-size: 120%;}
/* _teaser */
#teaser { width: 90%; margin: 0 auto .5em auto;}

/* mainimg */
.mainimg_drama { width: 100%; position: relative;}
.mainimg_drama img { width: 100%; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; position: relative; z-index: 10;}
.mainimg_drama .onair_space { display: none;}
.mainimg_drama a { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 100;}

/*etc*/
.newtxt { color: rgba(255, 55, 110, 1);}
.unit h2 { box-sizing: border-box; width: 100%;}
.unit h2:before { content: '\02501'; font-size: 90%; font-weight: bold; padding-right: 10px;}
.unit h2 .newtxt { font-size: 85%; font-weight: lighter;}
.unit p { box-sizing: border-box; width: 100%; font-size: 95%;}
.plus .set .cont { font-size: 90%; text-align: justify; text-justify: inter-ideograph;}
/*TBStopic*/
#new { box-sizing: border-box; width: 100%;}
#new h2 { width: 95%;}
/*みどころ*/
#onair .set { box-sizing: border-box; width: 100%; margin: .5em auto;}
#onair .set p { font-size: 100%;}
/*ティザー*/
#next_date { text-align: center; padding: .5em 4%; font-size: 108%; line-height: 130%;}
#next_onair h2 { padding-bottom: 10px;}

/*cast-staff*/
#cs .cast { margin: .3em 0 0 .4em;}
#cs .cast td { padding-bottom: .2em;}
#cs .cast td:last-child { padding-top: .5em;}
#cs .td_ct { padding: 0 1em;}
#cs .staff { padding: 0 0 .75em .4em; line-height: 160%; font-size: 92%;}
#cs .staff div { padding: .2em 0; line-height: 120%;}
/*for_W768-*/
@media screen and (min-width: 768px) {
#cs .cast { margin: .5em 0 0 .5em;}
#cs .staff { padding: .5em 0 .75em .5em;}
#cs .td_ct { padding: 0 2em;}
}

/*sns*/
#sns_sp { margin: 1em auto; padding: .75em 0; background: rgba(255, 255, 255, 1);}
#sns_sp dt { font-size: 85%; font-weight: bold; padding-bottom: .5em;}
#sns_sp ul:before, #sns_sp ul:after { content: ""; display: table;}
#sns_sp ul:after { clear: both;}
#sns_sp ul::after { content: ""; display: block; clear: both;}
#sns_sp ul { display: flex; flex-wrap: wrap; justify-content: center;}
#sns_sp li { box-sizing: border-box; margin: .2em; display: block; position: relative; border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; letter-spacing: .1em; flex-basis: 100px; font-size: 72%;}
#sns_sp .twitter { background: rgba(29, 161, 242, 1);}
#sns_sp .instagram { background: rgba(122, 9, 187, 1);}
#sns_sp .tiktok { background: rgba(254, 44, 84, 1);}
#sns_sp .facebook { background: rgba(24, 119, 242, 1);}
#sns_sp .line { background: rgba(0, 185, 0, 1);}
#sns_sp .youtube { background: rgba(255, 0, 0, 1);}
#sns_sp .x { background: rgba(0, 0, 0, 1);}
#sns_sp li a { box-sizing: border-box; width: 100%; padding: 8px 5px; text-align: center; display: block; color: rgba(255, 255, 255, 1);}
#sns_sp li a:hover { background: rgba(255, 255, 255, .2);}
/*for_W768-*/
@media screen and (min-width: 768px) {
#sns_sp { margin: 0 auto 1em auto;}
}

/*menu*/
.menu label { display: none;}
.menu .hidebox { height: auto; opacity: 1;}
/*for_W768-*/
@media screen and (min-width: 768px) {
.menu .hidebox li { font-size: 78%;}
}

/*TOPみどころ“詳細”ボタン*/
#onair #ss_onair dl { width: 78%; display: inline-block;}
/*#onair #ss_onair .lnk { box-sizing: border-box; width: 14%; padding: .5em; font-size: 64%; color: rgba(255, 255, 255, 1); background: rgba(0, 80, 255, 1); position: absolute; right: 2%; bottom: 10%;}*/
#onair #ss_onair .lnk { box-sizing: border-box; width: 16%; padding: 2% 0; font-size: 85%; color: rgba(255, 255, 255, 1); background: rgba(0, 80, 255, 1); position: absolute; right: 2%; bottom: 12%;}
/*for_W768
@media all and (min-width: 768px) {
#onair #ss_onair dl { width: 85%;}
#onair #ss_onair .lnk { width: 8%; bottom: 12.5%; font-size: 54%; background: rgba(0, 80, 255, .75);}
}-*/

/*みどころ詳細ページ*/
#this_header h2 { padding-bottom: 0;}
#this_onair .photo { margin: 1em auto;}
#this_onair h3 { border: 0; padding-left: 0; margin-left: -1em;}
#this_onair h3:before { content: '\02501'; font-size: 90%; font-weight: bold; padding-right: 10px;}
#this_onair h4 { box-sizing: border-box; width: 100%; margin: 0 auto; font-size: 98%; text-align: left; padding: .75em 10px; font-weight: 600; border-left: 3px solid rgba(0, 80, 255, 1); background: rgba(236, 237, 240, .5); line-height: 130%;}
#this_onair .plus .cont { box-sizing: border-box; font-size: 85%; padding: 1em 0 1.5em .5em;}
.caption { text-align: center; font-size: 85%; padding: .5em 0 2.5em 0; line-height: 130%; margin-top: -.5em;}
/*for_W768-*/
@media screen and (min-width: 768px) {
#this_onair h3 { margin-left: -1.5em;}
}