@charset "utf-8";
.vpc{display: inherit;}
.vsp{display: none;}
div.left_box {}
div.left_box div.sppg_title p span { font-size:80%; font-weight:lighter; color:#FF0000;}

.page_contents .sppg_content p.txt01 { padding: 10px}

div.left_box section.sppg_box p.btn_gyao { text-align:center;}
div.left_box section.sppg_box p.pr_banner { width: 96%; margin: 30px auto;}
div.left_box section.sppg_box p.pr_banner img { width: 100%; height: auto;}

div.left_box div.sppg_content #box-photogallery a img  { border-radius:5px;}

.pc_none { display:none;}

.page_contents div.movie_box { width:96%; margin:0 auto;}

.flb { display:flex; flex-wrap: wrap; /*justify-content:center;*/ width: 100%; margin: 0 auto; }

/* スタッフ */
.flb.list_staff, .flb.list_song { display: flex; flex-wrap: wrap; justify-content: left; width: 100%; margin: 1% 0 3%; }
.flb.list_staff div { width: calc(100% / 2 - 20px); margin: 0 10px 10px; padding-bottom: 10px; border-bottom: 1px solid #efefef; text-align: center; }

.flb.list_song div { width: calc(48% - 4px); margin: 0 1% 30px; }
.flb.list_song div:nth-child(odd) { text-align: right; }
.flb.list_song div:nth-child(odd) img { width: 80%; }
.flb.list_song div:nth-child(even) { text-align: left; }


.page_contents .sppg_content p.tit_cat { font-size: 0.75rem; color: #777; letter-spacing: 0.03em; }
.page_contents .sppg_content p.name { font-size: 0.9rem; line-height: 1.3; color: #000; letter-spacing: 0em; }
.page_contents .sppg_content p.name span { font-size: 0.75rem; vertical-align: middle; }

/* タイトル */
div.left_box div.sppg_content p.lead_txt span { font-weight: 300; }
div.left_box div.sppg_content p.lead_txt span strong { /*color:#6666cc;*/ font-size: 100%; font-weight: 600; display:block; }

.notice{font-size: 80%;}

.flb.box-photogallery{width: 96%; margin: 18px auto 14px;}
.flb.box-photogallery a{width: calc(100% / 4);}
.flb.box-photogallery a img{width: 100%; height: auto;}

.page_contents .sppg_content h3.detail { position: relative; }
.page_contents .sppg_content h3.detail span.img_new { position: absolute; top: -33px; left: -10px; width: 100%; max-width: 44px; }
.page_contents .sppg_content h3.detail span.img_new img { width: 100%; }

/* 番組詳細 */
.txt p{font-size: 88%; line-height: 1.8!important;}


/* 次回予告　アーカイブ */
.bg_title { background: #f4cc20; border-radius: 6px; margin: 0 0 8px; }
.page_contents .sppg_content .box_oa .title p { /*margin: 0 auto!important;*/ }
.title p span { font-size: 120%; font-weight: 600; line-height: 1.0; color: #000; padding: 14px 2% 0; display: inline-block; }
.page_contents .sppg_content .date p { width: 96%; margin: 0 auto; padding: 0 0 6px; color: #07993f; text-align: right; font-size: 80%; font-weight: 600; }
/*.page_contents .sppg_content p { width: 100%; margin: 0 0 5px; font-size: 0.95rem; line-height: 1.8; }
*/

/*スライダー*/
.swiper {width: 90%; /*height: 304px;*/ margin: 0.5rem auto 2rem;}
.swiper-slide {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #fff; font-weight: bold;}
.swiper-slide img {width: 100%; height: auto; margin: 20px 0;}

.page_contents .sppg_content p.btn_more {width: 90%; margin: 0 auto; padding: 10px 0; color:#fff; border-radius:6px; background: #00a0d1; text-align: center; cursor: pointer; font-weight: bold;}
.page_contents .sppg_content p.btn_more:hover { opacity: 0.7; filter: alpha(opacity=70); /* ie 6 7 */ -ms-filter: "alpha(opacity=70)";  /* ie 8 */}


/*出演者*/
.page_contents .sppg_content h3.cast { position: relative; }
.page_contents .sppg_content h3.cast span.img_new { position: absolute; top: -33px; left: -10px; width: 100%; max-width: 44px; }
.page_contents .sppg_content h3.cast span.img_new img { width: 100%; }

ul.li_cast_wide { display:flex; flex-wrap: wrap; width: 100%; /*padding: 10px 2%; border-radius: 10px; background: #ececec;*/ }
ul.li_cast_wide li { display:flex; flex-wrap: wrap; width: 98%; max-width: 480px; margin: 0 auto 16px; padding-bottom: 16px; border-bottom: 1px solid #efefef; }
ul.li_cast_wide li div.img_cast { width: 100%; /*max-width: 120px;*/ }
ul.li_cast_wide li div.img_cast img { width: 100%; margin-bottom: 10px; }
ul.li_cast_wide li div.txt_cast { width: 100%; margin: 0 0%; padding: 4px 0 0; }
.page_contents .sppg_content ul.li_cast_wide li div.txt_cast p { text-align: center!important; }

ul.li_cast { display:flex; flex-wrap: wrap; width: 100%; max-width: 480px; margin: 0 auto; /*padding: 10px 2%; border-radius: 10px; background: #ececec;*/ }
ul.li_cast li { display:flex; flex-wrap: wrap; width: calc(96% / 2 - 10px); max-width: 240px; margin: 0 2% 16px; padding-bottom: 16px; border-bottom: 1px solid #efefef; }
ul.li_cast li div.img_cast { width: 100%; /*max-width: 120px;*/ }
ul.li_cast li div.img_cast img { width: 100%; margin-bottom: 10px; }
ul.li_cast li div.txt_cast { width: 100%; margin: 0 0%; padding: 4px 0 0; }
.page_contents .sppg_content ul.li_cast li div.txt_cast p { text-align: center!important; }

ul.li_cast_noimg { display: flex; flex-wrap: wrap; width: 98%; margin: 0 1% 16px; }
ul.li_cast_noimg li { display: flex; flex-wrap: wrap; width: 98%; margin: 0 1% 16px; }
ul.li_cast_noimg li div.txt_cast { width: 98%; margin: 0 1%; padding: 4px 0 0; }
.page_contents .sppg_content ul.li_cast_noimg li div.txt_cast p { text-align: center!important; }

/*ul.sub_cast li {width: calc(94% / 6); margin: 0 0.5% 20px;}
ul.sub_cast li p.cast_img {margin: 0 auto 10px;}
ul.sub_cast li p.cast_img img {width: 100%; border-radius: 6px;}
ul.sub_cast li p.cast_cap {width: 90%; margin: 0 auto; padding-top: 4px; font-size: 0.9rem; line-height: 1.2; text-align: center;}
ul.sub_cast li p.cast_cap span {display: flow-root; width: 50%; margin: 0 auto 6px; padding: 2px 0; border-radius: 5px;}
ul.sub_cast li p.cast_cap span.c01 {background: red;}
ul.sub_cast li p.cast_cap span.c02 {background: blue;}
ul.sub_cast li p.cast_cap span.c03 {background: green;}
ul.sub_cast li p.cast_cap span.c04 {background: purple;}
ul.sub_cast li p.cast_cap span.c05 {background: orange;}
ul.sub_cast li p.cast_cap span.c06 {background: black;}
ul.sub_cast li p.cast_cap span.c07 {background: pink;}
ul.sub_cast li p.cast_cap span.c08 {background: yellow;}
ul.sub_cast li p.cast_cap span.c09 {background: violet;}
ul.sub_cast li p.cast_cap span.c10 {background: white; border: 1px solid #000;}
ul.sub_cast li p.cast_cap span.c11 {background: brown;}
ul.sub_cast li p.cast_cap span.c12 {background: gray;}*/


/*ヘッダー*/
#top_img{position: relative; width: 100%; max-width: 600px; padding-top: 56%; /*height: 356px;*/ background-color: #FFF;}
#top_logo{position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; max-width: 600px;}
#top_logo img{width: 100%;}


ul.cnt{width: 96%; margin: 0 2%;}
ul.cnt li{padding-left: 1em; text-indent: -1em; font-size: 0.9rem; line-height: 2;}


.page_contents .sppg_content ul.cast_list li p.cast_txt {line-height: 1.0;}
.page_contents .sppg_content ul.cast_list li p.cast_txt span {line-height: 0.8;}
.page_contents .sppg_content .box_oa p {text-align: justify;}

/*見逃し配信------------------------------------------*/
div.left_box div.sppg_content  div.movie_box { margin-bottom:1em;}
div.left_box div.sppg_content  div.movie_box img{ width: 100%; height: auto;}
/* 動画ボタン調整*/
.btn_flex-even > li { flex-basis: 100%;}
.btn_flex-even li img {display: block; width: 100%; max-width: 150px; height: auto; text-align: center; margin: 0 auto;}
.bnr { width: 70%; max-width: 600px; margin: 0 auto; }
.bnr img { width: 100%; border-radius: 6px; }
.bnr p { margin: 6px 0; font-size: 0.9rem; text-align: center; }


/*キャストコメント*/
div.left_box div.sppg_content  div.coment {display: flex; margin: 10px;background-color: #f5f5f5;}
div.left_box div.sppg_content  div.coment p {margin: 10px;}
div.left_box div.sppg_content  div.coment p span {font-weight: bold;}
div.left_box div.sppg_content  div.coment img {margin: 0 10px;}

/*アイコン sns*/
	section.sc_sns{margin-bottom: 3em;}
	section.sc_sns > div div.box_sns{margin:1em auto;background-color:#e5e5e5;padding: 1em 0 0.5em 0; box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.1);border-radius: 30px;margin: 0 0.5em;}
	section.sc_sns .iconflx{display:flex;gap:0.25em;align-self:center; justify-content: center; }
	section.sc_sns .iconflx li{width: 80px;}
	section.sc_sns .iconflx li p{text-align: center;font-size: 0.75rem;padding: 0.2em 0;}
	section.sc_sns .iconflx li a{}
	section.sc_sns .iconflx li a:hover{opacity: 0.7;}
	section.sc_sns .iconflx li a img{display: block;margin: 0 auto;width: 70%;height: auto;}

@media screen and (max-width: 768px) {
	section.sc_sns > div{padding: 0em;}
	}
/*/アイコン sns*/


@media screen and (max-width: 768px) {

.vpc{display: none;}
.vsp{display: inherit;}

/*.page_contents .sppg_content p { width:auto;}*/
.page_contents .sppg_content ul.cast_list li p.cast_txt { width:79%; left:0;}
div.left_box div.sppg_content div.onair_box,
div.left_box div.sppg_content div.backnumber_box dl dd { display:block;}
div.left_box div.sppg_content div.onair_box p:first-child,
div.left_box div.sppg_content div.backnumber_box dl dd p:first-child { width:95%;}
/*div.left_box div.sppg_content div.backnumber_box dl dt { width:50%;}*/
div.left_box div.sppg_content div.backnumber_box dl dd p:last-child { padding:10px;}
div.left_box div.sppg_content div.onair_box p img,
div.left_box div.sppg_content div.backnumber_box dl dd p img { left:2.7%;}
div.left_box section.sppg_box p.btn_gyao { width:90%; margin:0 auto;}
div.left_box section.sppg_box p.btn_gyao img { width:100%; height:auto;}

div.left_box div.sppg_content  div.movie_box { text-align:center;}
div.left_box div.sppg_content  div.movie_box iframe { position:relative; width:100%; max-width:750px; min-height:270px;}

.pc_none { display:block;}

#top_img{max-width: none;}
#top_logo{max-width: none;}

.page_contents .sppg_content h3.detail { position: relative; }
.page_contents .sppg_content h3.detail span.img_new { position: absolute; top: -33px; left: 2px; width: 100%; max-width: 44px; }
.page_contents .sppg_content h3.detail span.img_new img { width: 100%; }

/* 次回予告　アーカイブ */
.page_contents .sppg_content p {width: calc(96% - 0.6em); margin: 0 2%; font-size: 0.95rem; line-height: 1.8; }
.page_contents .sppg_content .box_oa .title p {width: 96%; margin: 0 2%; }


/*出演者*/
ul.sub_cast li {width: calc(96% / 4); margin: 0 0.5% 1%;}

/*見逃し配信*/
div.left_box div.sppg_content  div.movie_box { text-align:center;margin-bottom:0.5em;}
div.left_box div.sppg_content  div.movie_box iframe {position:relative; width:96%;}	

/*スタッフ*/
/*.flb.list_staff { margin: 1% 0 30px; }
.flb.list_staff div { width: calc(48% - 4px); }*/


}




@media screen and (max-width: 480px) {


div.left_box div.sppg_content  div.movie_box iframe { position:relative; width:100%; max-width:360px; /*height:200px;*/ min-height: 200px;}


/* タイトル */
.page_contents .sppg_content .date p{text-align: center;}
/*.title.flb div:nth-child(1){width: 100%;}
.title.flb div:nth-child(2){width: 100%; text-align: center;}
.title.flb div:nth-child(3){width: 100%;}
.title.flb div:nth-child(3) p{width: 100%; margin: 10px 0 15px;}*/



/* ランキング */


/* コメント */

/*.comment.flb div:nth-child(1){width: 26%; text-align: center; padding: 0 1.5%; order: 2;}
.comment.flb div:nth-child(1) img{width: 100%;}
.comment.flb div:nth-child(2){width: 66%; order: 3;}
.comment.flb div:nth-child(3){width: 30%; margin: 0 70% 10px 0; order: 1;}
.comment.flb div:nth-child(3) img{width: 100%;}*/

.comment.flb div:nth-child(1){width: 50%; margin: 20px 25% 10px; order: 2;}
.comment.flb div:nth-child(2){width: 100%; order: 1;}
.comment.flb div:nth-child(3){width: 100%; margin: 0 25% 10px; order: 3;}

/*吹き出し*/
.balloon{position: relative; display: inline-block; margin: 0 0 0 15px; padding: 7px 10px; min-width: 120px; max-width: 100%; color: #333; font-size: 95%; line-height: 2.1; background: #FFF; border: solid 3px #cacaca; box-sizing: border-box; border-radius: 6px;}
.balloon:before {
  content: ""; position: absolute; top: unset; bottom: -24px; left: 50%; margin-left: -15px; border: 12px solid transparent; border-top: 12px solid #fff; z-index: 2;}
.balloon:after {
  content: ""; position: absolute; top: unset; bottom: -30px; left: 50%; margin-left: -17px; border: 14px solid transparent; border-top: 14px solid #cacaca; z-index: 1;}

/*スタッフ*/
.flb.list_staff div { width: calc(98% - 4px); margin: 0 1% 10px; }
.flb.list_staff div:last-child { border-bottom: none; }
	
/*キャストコメント*/
div.left_box div.sppg_content  div.coment {display: block;}
div.left_box div.sppg_content div.coment img { display: block; width: 80%; margin: 0 auto;}

	
}