@charset "UTF-8";
/*--------------------------------------------------------------------
/- admin  :TV TOKYO Communications Corporation.
/- update :20170510
/--------------------------------------------------------------------*/
/**********************************************************************
基本設定
**********************************************************************/
.wrapper { color: #333; font-size: 14px; font-family: Helvetica, Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", Osaka, "MS PGothic", sans-serif; line-height: 1.9; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; min-width: 980px; background: #e9e9e9; margin: 0 auto; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media screen and (max-width: 768px) { .wrapper { min-width: 100%; } }

@media all and (-ms-high-contrast: none) { .wrapper { font-feature-settings: normal !important; } }

.wrapper div, .wrapper span, .wrapper object, .wrapper iframe, .wrapper h1, .wrapper h2, .wrapper h3, .wrapper h4, .wrapper h5, .wrapper h6, .wrapper p, .wrapper blockquote, .wrapper pre, .wrapper abbr, .wrapper address, .wrapper cite, .wrapper code, .wrapper del, .wrapper dfn, .wrapper em, .wrapper img, .wrapper q, .wrapper samp, .wrapper strong, .wrapper sub, .wrapper sup, .wrapper var, .wrapper b, .wrapper i, .wrapper dl, .wrapper dt, .wrapper dd, .wrapper ol, .wrapper ul, .wrapper li, .wrapper fieldset, .wrapper form, .wrapper label, .wrapper legend, .wrapper table, .wrapper caption, .wrapper tbody, .wrapper tfoot, .wrapper thead, .wrapper tr, .wrapper th, .wrapper td, .wrapper article, .wrapper aside, .wrapper canvas, .wrapper details, .wrapper figcaption, .wrapper figure, .wrapper footer, .wrapper header, .wrapper hgroup, .wrapper menu, .wrapper nav, .wrapper section, .wrapper summary, .wrapper time, .wrapper mark, .wrapper audio, .wrapper video, .wrapper input { box-sizing: border-box; }

/**********************************************************************
外枠の設定
**********************************************************************/
.wrapper .wrapper_inner { width: 980px; margin: 0 auto; }

@media screen and (max-width: 768px) { .wrapper .wrapper_inner { width: 100%; } }

.wrapper #content_left { float: left; margin: 0; width: 650px; }

@media screen and (max-width: 768px) { .wrapper #content_left { width: 100%; } }

.wrapper #content_right { float: right; margin-top: 15px; width: 300px; }

@media screen and (max-width: 768px) { .wrapper #content_right { width: 100%; margin-top: 0; } }

.wrapper .clearfix:after { content: ""; display: block; clear: both; }

/**********************************************************************
スマホサイトへ遷移するボタン
**********************************************************************/
.wrapper .smpBranch { padding: 15px 15px 25px 15px; background: #fff; }

.wrapper .smpBranch a, .wrapper .smpBranch nav ul li span, .wrapper nav ul li .smpBranch span { display: block; background: #1365c8; color: #fff; font-weight: bold; font-size: 54px; text-decoration: none; padding: 35px 0; text-align: center; text-shadow: -5px -5px 1px #05378b; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; box-shadow: 0px 10px 0px #05378b; }

/**********************************************************************
	テキスト
**********************************************************************/
.wrapper .center { text-align: center; }

.wrapper .left { text-align: left; }

.wrapper .right { text-align: right; }

.wrapper .hidetext { text-indent: -9999px; font-size: 1px; overflow: hidden; }

.wrapper .none { display: none; }

.wrapper .txt_large { font-size: 116%; *font-size: 15px; }

.wrapper .txt_x-large { font-size: 131%; *font-size: 17px; }

.wrapper .txt_small { font-size: 85%; *font-size: 11px; }

.wrapper .txt_x-small { font-size: 77%; *font-size: 10px; }

.wrapper .txt_thin { font-weight: normal; }

.wrapper .attenntion { text-indent: -1em; margin-left: 1em; }

.wrapper .red { color: #d41316; }

.wrapper .mincho { font-family: "游明朝", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", serif; }

.wrapper .italic { font-style: italic; }

/**********************************************************************
 フロート
**********************************************************************/
.wrapper .float_l { float: left; }

.wrapper .float_r { float: right; }

.wrapper .clearfix:after { content: "."; display: block; height: 0.1px; clear: both; visibility: hidden; }

.wrapper .clearfix { zoom: 1; }

.wrapper .clear { clear: both; }

/**********************************************************************
margin / padding
*********************************************************************/
.wrapper .mt5 { margin-top: 5px !important; }

.wrapper .mt10 { margin-top: 10px !important; }

.wrapper .mt15 { margin-top: 15px !important; }

.wrapper .mt20 { margin-top: 20px !important; }

.wrapper .mt30 { margin-top: 30px !important; }

.wrapper .mt40 { margin-top: 40px !important; }

.wrapper .mt50 { margin-top: 50px !important; }

.wrapper .mt60 { margin-top: 60px !important; }

.wrapper .mt80 { margin-top: 80px !important; }

.wrapper .mb5 { margin-bottom: 5px !important; }

.wrapper .mb10 { margin-bottom: 10px !important; }

.wrapper .mb15 { margin-bottom: 15px !important; }

.wrapper .mb20 { margin-bottom: 20px !important; }

.wrapper .mb30 { margin-bottom: 30px !important; }

.wrapper .mb40 { margin-bottom: 40px !important; }

.wrapper .mb50 { margin-bottom: 50px !important; }

.wrapper .mb60 { margin-bottom: 60px !important; }

.wrapper .mb80 { margin-bottom: 80px !important; }

.wrapper .lr_p20 { padding: 0 20px !important; }

.wrapper .pt10 { padding-top: 10px !important; }

.wrapper .pt20 { padding-top: 20px !important; }

.wrapper .p20 { padding: 20px !important; }

.wrapper .w100 { width: 100% !important; }

.wrapper .w80 { width: 80% !important; }

.wrapper .w50 { width: 50% !important; }

.wrapper .w40 { width: 40% !important; }

.wrapper .w30 { width: 30% !important; }

.wrapper .radius5 { border-radius: 5px; }

/**********************************************************************
NAV
**********************************************************************/
.wrapper nav { background: #1ea121; color: #fff; }

@media screen and (min-width: 769px) { .wrapper nav { font-size: 15px; } }

.wrapper nav h1 a, .wrapper nav h1 ul li span, .wrapper nav ul li h1 span { display: block; background: url(../images/img_logo_pc.jpg) center center no-repeat; height: 130px; overflow: hidden; text-indent: -9999px; }

@media screen and (max-width: 768px) { .wrapper nav h1 a, .wrapper nav h1 ul li span, .wrapper nav ul li h1 span { padding-bottom: 25%; background: url(../images/img_logo_sp.jpg) center center no-repeat; background-size: cover; height: 0; } }

.wrapper nav h1 img { transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper nav h1 img:hover { opacity: 0.8; }

.wrapper nav h2 { display: block; padding: 8px; line-height: 1; background: rgba(0, 0, 0, 0.2); font-size: 20px; font-weight: normal; text-align: center; }

@media screen and (max-width: 768px) { .wrapper nav h2 { font-size: 14px; font-weight: bold; } }

.wrapper nav ul { border-right: solid 1px #1ea121; }

.wrapper nav ul li { /*width: 25%;	メニュー4列の場合*/ /*width: 33.33%;	メニュー3列の場合*/ width: 25%; /*メニュー2列の場合*/ display: block; float: left; }

@media screen and (max-width: 768px) { .wrapper nav ul li { width: 50%; /*&:last-child { width: 100%; }*/ } }

.wrapper nav ul li a, .wrapper nav ul li span { display: block; position: relative; padding: 17px 5px; text-align: center; color: #fff; text-decoration: none; line-height: 1.1em; border-bottom: solid 1px #1ea121; border-left: solid 1px #20ae24; transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper nav ul li a.current, .wrapper nav ul li span.current { background: #1c981f; }

@media screen and (max-width: 768px) { .wrapper nav ul li a, .wrapper nav ul li span { font-weight: bold; } }

.wrapper nav ul li a:hover, .wrapper nav ul li span:hover { color: #1a8c1d; background: #fad500; position: relative; font-weight: bold; }

.wrapper nav ul li span { opacity: 0.5; cursor: default; }

.wrapper nav ul li span:hover { background: none; }

.wrapper nav ul li:nth-of-type(-n + 3) a, .wrapper nav ul li:nth-of-type(-n + 3) span { border-top: none; }

.wrapper nav ul li span.batch { opacity: 1; display: block; position: absolute; top: 0; right: 0; padding: 0; width: 20px; height: 20px; background: red; color: #fff; font-size: 10px; text-align: center; line-height: 1; border: solid 1px rgba(255, 255, 255, 0.5); border-radius: 50%; padding-top: 3px; z-index: 10; }

.wrapper #content_right .nav_list_wrap ul { border-top: solid 1px #1ea121; border-right: solid 1px #1ea121; }

/**********************************************************************
ソーシャルボタン
**********************************************************************/
/*SNSアイコンフォント*/
@font-face { font-family: "fontello"; src: url("/fonts/template_sns_icon.woff") format("woff"), url("/fonts/template_sns_icon.ttf") format("truetype"); font-weight: normal; font-style: normal; }

.wrapper .socialbtn { text-align: center; }

.wrapper .socialbtn .tx_social_table { margin: 0 auto; }

.wrapper .sns_link a, .wrapper .sns_link nav ul li span, .wrapper nav ul li .sns_link span { text-decoration: none; }

.wrapper .sns_link a:before, .wrapper .sns_link nav ul li span:before, .wrapper nav ul li .sns_link span:before { font-family: "fontello"; text-decoration: none; color: #fff; line-height: 50px; font-size: 180%; text-align: center; display: block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }

.wrapper .sns_link a[href*="twitter"], .wrapper .sns_link nav ul li span[href*="twitter"], .wrapper nav ul li .sns_link span[href*="twitter"] { background: #1da1f2; }

.wrapper .sns_link a[href*="instagram"], .wrapper .sns_link nav ul li span[href*="instagram"], .wrapper nav ul li .sns_link span[href*="instagram"] { background: #e4405f; background: -webkit-linear-gradient(135deg, #f13f79 30%, #786ad5 100%); background: linear-gradient(135deg, #f13f79 30%, #786ad5 100%); }

.wrapper .sns_link a[href*="instagram"]:after, .wrapper .sns_link nav ul li span[href*="instagram"]:after, .wrapper nav ul li .sns_link span[href*="instagram"]:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: -webkit-linear-gradient(15deg, #ffdb2c, #f9764c 25%, rgba(255, 77, 64, 0) 50%) no-repeat; background: linear-gradient(15deg, #ffdb2c, #f9764c 25%, rgba(255, 77, 64, 0) 50%) no-repeat; z-index: -10; }

.wrapper .sns_link a[href*="line"], .wrapper .sns_link nav ul li span[href*="line"], .wrapper nav ul li .sns_link span[href*="line"] { background: #00c300; }

.wrapper .sns_link a[href*="facebook"], .wrapper .sns_link nav ul li span[href*="facebook"], .wrapper nav ul li .sns_link span[href*="facebook"] { background: #3b5998; }

.wrapper .sns_link a[href*="twitter"]:before, .wrapper .sns_link nav ul li span[href*="twitter"]:before, .wrapper nav ul li .sns_link span[href*="twitter"]:before { content: "\e800"; }

.wrapper .sns_link a[href*="instagram"]:before, .wrapper .sns_link nav ul li span[href*="instagram"]:before, .wrapper nav ul li .sns_link span[href*="instagram"]:before { content: "\e804"; }

.wrapper .sns_link a[href*="line"]:before, .wrapper .sns_link nav ul li span[href*="line"]:before, .wrapper nav ul li .sns_link span[href*="line"]:before { content: "\e805"; }

.wrapper .sns_link a[href*="facebook"]:before, .wrapper .sns_link nav ul li span[href*="facebook"]:before, .wrapper nav ul li .sns_link span[href*="facebook"]:before { content: "\e80f"; }

.wrapper .sns_block #tx_social_bar { display: block; margin-top: 10px; }

.wrapper .sns_block #tx_social_bar a.Twitter, .wrapper .sns_block #tx_social_bar nav ul li span.Twitter, .wrapper nav ul li .sns_block #tx_social_bar span.Twitter, .wrapper .sns_block #tx_social_bar a.Facebook, .wrapper .sns_block #tx_social_bar nav ul li span.Facebook, .wrapper nav ul li .sns_block #tx_social_bar span.Facebook, .wrapper .sns_block #tx_social_bar a.Google, .wrapper .sns_block #tx_social_bar nav ul li span.Google, .wrapper nav ul li .sns_block #tx_social_bar span.Google, .wrapper .sns_block #tx_social_bar a.Atode, .wrapper .sns_block #tx_social_bar nav ul li span.Atode, .wrapper nav ul li .sns_block #tx_social_bar span.Atode, .wrapper .sns_block #tx_social_bar a.Hatena, .wrapper .sns_block #tx_social_bar nav ul li span.Hatena, .wrapper nav ul li .sns_block #tx_social_bar span.Hatena, .wrapper .sns_block #tx_social_bar a.Line, .wrapper .sns_block #tx_social_bar nav ul li span.Line, .wrapper nav ul li .sns_block #tx_social_bar span.Line { display: inline-block; transition: all 0.3s; -webkit-transition: all 0.3s; border-radius: 100px; margin: 0 5px 0 0; font-size: 16px; width: 30px; height: 30px; line-height: 30px; padding: 5px; position: relative; }

.wrapper .sns_block #tx_social_bar a.Twitter:before, .wrapper .sns_block #tx_social_bar nav ul li span.Twitter:before, .wrapper nav ul li .sns_block #tx_social_bar span.Twitter:before, .wrapper .sns_block #tx_social_bar a.Facebook:before, .wrapper .sns_block #tx_social_bar nav ul li span.Facebook:before, .wrapper nav ul li .sns_block #tx_social_bar span.Facebook:before, .wrapper .sns_block #tx_social_bar a.Google:before, .wrapper .sns_block #tx_social_bar nav ul li span.Google:before, .wrapper nav ul li .sns_block #tx_social_bar span.Google:before, .wrapper .sns_block #tx_social_bar a.Atode:before, .wrapper .sns_block #tx_social_bar nav ul li span.Atode:before, .wrapper nav ul li .sns_block #tx_social_bar span.Atode:before, .wrapper .sns_block #tx_social_bar a.Hatena:before, .wrapper .sns_block #tx_social_bar nav ul li span.Hatena:before, .wrapper nav ul li .sns_block #tx_social_bar span.Hatena:before, .wrapper .sns_block #tx_social_bar a.Line:before, .wrapper .sns_block #tx_social_bar nav ul li span.Line:before, .wrapper nav ul li .sns_block #tx_social_bar span.Line:before { position: absolute; width: 30px; height: 30px; line-height: 30px; text-align: center; display: block; margin: 0; top: 0; left: 0; }

/**********************************************************************
フッターレコメンドパーツ
**********************************************************************/
@media screen and (min-width: 769px) { .wrapper #reccomend_drama { margin: 0; margin-top: 40px; background: #474747; padding: 40px 0; }
  .wrapper #reccomend_drama h1 { padding: 0; margin: 0; font-size: 24px; color: #ccc; font-weight: normal; }
  .wrapper #reccomend_drama .reccomend_drama_wrapper_inner { margin: 0 auto; width: 980px; }
  .wrapper #reccomend_drama ul { margin-top: 25px; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; width: 100%; -webkit-overflow-scrolling: touch; }
  .wrapper #reccomend_drama ul li { width: 19%; margin: 10px 1% 10px 0; background: #fff; font-size: 13px; line-height: 1.3em; float: left; opacity: 0.9; transition: 0.4s all; display: none; }
  .wrapper #reccomend_drama ul li a, .wrapper #reccomend_drama nav ul li span, .wrapper nav #reccomend_drama ul li span { text-decoration: none; color: #666; }
  .wrapper #reccomend_drama ul li img { width: 100%; display: block; }
  .wrapper #reccomend_drama ul li span.title { display: block; text-decoration: none; font-weight: normal; padding: 10px 15px 20px 15px; }
  .wrapper #reccomend_drama ul li span.title span.waku { display: block; font-size: 10px; margin-bottom: 3px; }
  .wrapper #reccomend_drama ul li:hover { opacity: 1; }
  .wrapper #reccomend_drama ul#mon li.mon, .wrapper #reccomend_drama ul#tue li.tue, .wrapper #reccomend_drama ul#wed li.wed, .wrapper #reccomend_drama ul#thu li.thu, .wrapper #reccomend_drama ul#fri li.fri, .wrapper #reccomend_drama ul#sat li.sat, .wrapper #reccomend_drama ul#sun li.sun, .wrapper #reccomend_drama li.other { display: block; } }

@media screen and (max-width: 768px) { .wrapper .scrollbox.recommend { padding: 20px 0; margin-top: 0; }
  .wrapper .scrollbox.recommend h1 { color: #555; font-size: 16px; margin: 0 0 20px 10px; font-weight: normal; }
  .wrapper .scrollbox.recommend li { padding: 0; min-width: 80%; border: solid 1px #ccc; display: none; }
  .wrapper .scrollbox.recommend li span.title { padding: 10px; }
  .wrapper .scrollbox.recommend li span.waku { padding: 0; display: block; font-size: 10px; margin-bottom: 5px; font-weight: normal; }
  .wrapper .scrollbox.recommend li:first-child { margin-left: 10px; }
  .wrapper .scrollbox.recommend ul#mon li.mon, .wrapper .scrollbox.recommend ul#tue li.tue, .wrapper .scrollbox.recommend ul#wed li.wed, .wrapper .scrollbox.recommend ul#thu li.thu, .wrapper .scrollbox.recommend ul#fri li.fri, .wrapper .scrollbox.recommend ul#sat li.sat, .wrapper .scrollbox.recommend ul#sun li.sun, .wrapper .scrollbox.recommend li.other { display: block; } }

/**********************************************************************
	コンテンツ横スクロール表示
**********************************************************************/
@media screen and (max-width: 768px) { .wrapper .scrollbox { display: block; }
  .wrapper .scrollbox ul { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: no-wrap; width: 100%; overflow: scroll; -webkit-overflow-scrolling: touch; }
  .wrapper .scrollbox li { min-width: 55%; width: 100%; margin: 0 2% 0 0; border-radius: 4px; background: #fff; vertical-align: top; border: solid 1px #ccc; }
  .wrapper .scrollbox li:first-child { margin-left: 2%; }
  .wrapper .scrollbox li:last-child { margin-right: 2%; }
  .wrapper .scrollbox li a, .wrapper .scrollbox nav ul li span, .wrapper nav ul .scrollbox li span { text-decoration: none; color: #666; font-size: 85%; line-height: 1.2; }
  .wrapper .scrollbox li a img, .wrapper .scrollbox nav ul li span img, .wrapper nav ul .scrollbox li span img { display: block; border-radius: 4px 4px 0 0; width: 100%; }
  .wrapper .scrollbox li a span, .wrapper .scrollbox nav ul li span span, .wrapper nav ul .scrollbox li span span { text-align: left; display: block; }
  .wrapper .scrollbox li a span.txt, .wrapper .scrollbox nav ul li span span.txt, .wrapper nav ul .scrollbox li span span.txt { text-align: left; display: block; white-space: normal; padding: 10px; } }

/**********************************************************************
共通パーツ
**********************************************************************/
@media screen and (min-width: 769px) { .wrapper .smp_only { display: none !important; } }

@media screen and (max-width: 768px) { .wrapper .pc_only { display: none !important; } }

.wrapper .oa_alert { color: #ee0000; font-size: 14px; font-weight: bold; line-height: 1.4; position: relative; padding: 10px 12px; background: #fff; }

.wrapper .oa_alert:before { content: "！"; background: #ee0000; color: #fff; font-weight: bold; font-size: 12px; border-radius: 100px; width: 18px; height: 18px; display: inline-block; text-align: center; line-height: 20px; margin-right: 8px; vertical-align: 2px; }

.wrapper .common_title { background: #1ea121; color: #fff; padding: 15px; border-top: solid 3px #ffd900; font-size: 18px; line-height: 1em; }

@media screen and (max-width: 768px) { .wrapper .common_title { background: #fff; text-align: center; color: #333; font-size: 16px; } }

.wrapper .common_title.arrow { padding: 0; line-height: 1em; }

.wrapper .common_title.arrow a, .wrapper .common_title.arrow nav ul li span, .wrapper nav ul li .common_title.arrow span { padding: 15px; color: #fff; text-decoration: none; display: block; position: relative; transition: all 0.3s; -webkit-transition: all 0.3s; }

@media screen and (max-width: 768px) { .wrapper .common_title.arrow a, .wrapper .common_title.arrow nav ul li span, .wrapper nav ul li .common_title.arrow span { color: #333; } }

.wrapper .common_title.arrow a:after, .wrapper .common_title.arrow nav ul li span:after, .wrapper nav ul li .common_title.arrow span:after { content: ""; position: absolute; right: 18px; top: 50%; margin-top: -6px; display: block; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; }

@media screen and (max-width: 768px) { .wrapper .common_title.arrow a:after, .wrapper .common_title.arrow nav ul li span:after, .wrapper nav ul li .common_title.arrow span:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper .common_title.arrow a:hover:after, .wrapper .common_title.arrow nav ul li span:hover:after, .wrapper nav ul li .common_title.arrow span:hover:after { border-color: #1ea121; }

.wrapper .common_title.arrow a:hover, .wrapper .common_title.arrow nav ul li span:hover, .wrapper nav ul li .common_title.arrow span:hover { color: #1ea121; }

.wrapper .common_title.no_top_border { border-top: none; }

.wrapper .common_title_second { background: #1ea121; font-size: 20px; line-height: 1.1em; padding: 20px; color: #fff; font-weight: bold; }

@media screen and (min-width: 1300px) { .wrapper .common_title_second { font-size: 22px; } }

.wrapper .common_subtitle_second { border-bottom: solid 2px #1ea121; padding-bottom: 5px; font-size: 22px; font-weight: bold; line-height: 1.3em; margin-top: 40px; }

.wrapper .common_subtitle_second.border_black { border-color: #222; }

@media screen and (max-width: 768px) { .wrapper .common_subtitle_second { font-size: 18px; } }

.wrapper .common_subtitle_border { font-size: 16px; font-weight: bold; border-bottom: solid 1px #666; padding: 5px; }

@media screen and (max-width: 768px) { .wrapper .common_subtitle_border { font-size: 15px; } }

.wrapper .common_subtitle_first { background: #1ea121; font-size: 24px; line-height: 1.1em; padding: 10px; color: #fff; margin-top: 70px; font-weight: bold; }

@media screen and (min-width: 1300px) { .wrapper .common_subtitle_first { font-size: 22px; } }

@media screen and (max-width: 768px) { .wrapper .common_subtitle_first { font-size: 17px; } }

.wrapper .common_subtitle_third { font-size: 20px; border-left: solid 6px #1ea121; padding-left: 15px; line-height: 1.1em; font-weight: bold; margin-top: 40px; }

@media screen and (max-width: 768px) { .wrapper .common_subtitle_third { font-size: 16px; } }

.wrapper .common_large_date { color: #1ea121; font-size: 20px; line-height: 1em; display: block; margin-bottom: 15px; }

@media screen and (max-width: 768px) { .wrapper .common_large_date { font-size: 16px; } }

.wrapper .common_box { padding: 20px; background: #fff; font-size: 16px; }

.wrapper .common_box a, .wrapper .common_box nav ul li span, .wrapper nav ul li .common_box span { color: #1ea121; }

.wrapper .common_table { width: 100%; }

.wrapper .common_table th { background: #1ea121; color: #fff; padding: 10px; border: solid 1px #e9e9e9; text-align: left; vertical-align: top; }

.wrapper .common_table td { padding: 15px; border: solid 1px #e9e9e9; vertical-align: top; }

.wrapper .common_table.one_line th, .wrapper .common_table.one_line td { width: 100%; display: block; }

.wrapper .common_table.bg_light th { background: white; color: #333; border-bottom: none; }

.wrapper a.common_link_txt, .wrapper nav ul li span.common_link_txt { color: #1ea121; }

.wrapper a.common_link_button, .wrapper nav ul li span.common_link_button, .wrapper .common_link_button a, .wrapper .common_link_button nav ul li span, .wrapper nav ul li .common_link_button span { display: block; width: 68%; text-align: center; padding: 20px 10px; border: solid 1px #222; border-radius: 5px; margin: 20px auto 0 auto; font-size: 16px; text-decoration: none; color: #222; position: relative; line-height: 1.1em; box-sizing: border-box; transition: all 0.3s; -webkit-transition: all 0.3s; }

@media screen and (max-width: 768px) { .wrapper a.common_link_button, .wrapper nav ul li span.common_link_button, .wrapper .common_link_button a, .wrapper .common_link_button nav ul li span, .wrapper nav ul li .common_link_button span { font-size: 13px; padding: 15px 10px; width: 100%; } }

.wrapper a.common_link_button:hover, .wrapper nav ul li span.common_link_button:hover, .wrapper .common_link_button a:hover, .wrapper .common_link_button nav ul li span:hover, .wrapper nav ul li .common_link_button span:hover { background: #c9f5ca; border: solid 1px #1ea121; color: #1ea121; }

.wrapper a.common_link_button:after, .wrapper nav ul li span.common_link_button:after, .wrapper .common_link_button a:after, .wrapper .common_link_button nav ul li span:after, .wrapper nav ul li .common_link_button span:after { content: ""; position: absolute; right: 25px; top: 50%; margin-top: -13px; display: block; width: 15px; height: 15px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; margin-top: -6px; right: 21px; border-color: #222; border-width: 2px; width: 10px; height: 10px; }

@media screen and (max-width: 768px) { .wrapper a.common_link_button:after, .wrapper nav ul li span.common_link_button:after, .wrapper .common_link_button a:after, .wrapper .common_link_button nav ul li span:after, .wrapper nav ul li .common_link_button span:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper a.common_link_button:hover:after, .wrapper nav ul li span.common_link_button:hover:after, .wrapper .common_link_button a:hover:after, .wrapper .common_link_button nav ul li span:hover:after, .wrapper nav ul li .common_link_button span:hover:after { content: ""; position: absolute; right: 25px; top: 50%; margin-top: -13px; display: block; width: 15px; height: 15px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; margin-top: -6px; right: 21px; border-color: #1ea121; border-width: 2px; width: 10px; height: 10px; }

@media screen and (max-width: 768px) { .wrapper a.common_link_button:hover:after, .wrapper nav ul li span.common_link_button:hover:after, .wrapper .common_link_button a:hover:after, .wrapper .common_link_button nav ul li span:hover:after, .wrapper nav ul li .common_link_button span:hover:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper .common_link_button { display: none; }

.wrapper a.next_button, .wrapper nav ul li span.next_button { display: block; background: #ffd900; text-align: center; color: #fff; padding: 13px 0; position: relative; font-size: 12px; margin-top: 10px; border-radius: 5px; text-decoration: none; font-weight: bold; line-height: 1em; transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper a.next_button span, .wrapper nav ul li span.next_button span { display: block; font-size: 15px; font-weight: normal; line-height: 1em; padding-top: 5px; }

.wrapper a.next_button:after, .wrapper nav ul li span.next_button:after { content: ""; position: absolute; right: 18px; top: 50%; margin-top: -6px; display: block; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; }

@media screen and (max-width: 768px) { .wrapper a.next_button:after, .wrapper nav ul li span.next_button:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper a.next_button:hover, .wrapper nav ul li span.next_button:hover { opacity: 0.9; }

.wrapper .youtube_wrap { position: relative; width: 100%; height: 0; padding-top: 56.25%; }

.wrapper .youtube_wrap iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

.wrapper .uliza_wrap { position: relative; width: 100%; height: 0; padding-top: 56.25%; }

.wrapper .uliza_wrap div[poster] { position: absolute !important; top: 0 !important; right: 0 !important; width: 100% !important; height: 100% !important; }

.wrapper #movie iframe { vertical-align: top; }

.wrapper .youtube_pop { position: relative; height: 160px; overflow: hidden; }

.wrapper .youtube_pop img { width: 100%; height: auto; }

.wrapper .youtube_pop a:after, .wrapper .youtube_pop nav ul li span:after, .wrapper nav ul li .youtube_pop span:after { content: ""; background: url(../images/icon_youtube.png) no-repeat; background-size: contain; position: absolute; left: 50%; top: 50%; width: 50px; height: 35px; margin: -18px 0 0 -25px; }

.wrapper .sns_box { position: relative; text-align: center; overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper .sns_box:after { content: ""; position: absolute; width: 100%; height: 100%; background: url(../images/img_sns.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover; top: 0; left: 0; }

.wrapper .sns_box .sns_bg { padding: 15px 15px 30px 15px; position: relative; z-index: 2; background: rgba(30, 161, 33, 0.6); }

.wrapper .sns_box h1 { color: #fff; font-size: 16px; padding-bottom: 20px; text-shadow: 0 0 3px rgba(0, 0, 0, 0.5); }

.wrapper .sns_box ul.sns_link { display: table; table-layout: fixed; width: 100%; }

.wrapper .sns_box ul.sns_link li { display: table-cell; text-align: center; }

.wrapper .sns_box a, .wrapper .sns_box nav ul li span, .wrapper nav ul li .sns_box span { position: relative; width: 80%; min-width: 50px; height: 50px; display: block; z-index: 2; background: #fff; border-radius: 100px; overflow: hidden; margin: 0 auto; box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); }

@media screen and (min-width: 769px) { .wrapper .video_service { background: #fff; }
  .wrapper .video_service h1 { padding: 15px 10px 15px 10px; font-size: 18px; line-height: 1em; color: #222; border-top: solid 4px #1ea121; }
  .wrapper .video_service .common_title_second { padding: 20px; color: #fff; }
  .wrapper .video_service li { padding: 10px; border-top: solid 1px #efefef; }
  .wrapper .video_service li img { display: block; float: left; width: 50%; margin: 0 10px 0 0; border-radius: 3px; }
  .wrapper .video_service li a, .wrapper .video_service nav ul li span, .wrapper nav ul .video_service li span { transition: all 0.3s; -webkit-transition: all 0.3s; display: block; font-size: 78%; line-height: 1.5em; color: #222; text-decoration: none; }
  .wrapper .video_service li:after { content: ""; display: block; clear: both; }
  .wrapper .video_service li.other { text-align: right; text-decoration: underline; }
  .wrapper .video_service li:hover { opacity: 0.9; } }

@media screen and (max-width: 768px) { .wrapper .video_service h1 { padding: 15px 10px 15px 10px; font-size: 16px; line-height: 1em; text-align: center; color: #fff; background: #1ea121; }
  .wrapper .video_service .banner { padding: 10px 0; }
  .wrapper .video_service .banner li.other { position: relative; }
  .wrapper .video_service .banner li.other a, .wrapper .video_service .banner nav ul li.other span, .wrapper nav ul .video_service .banner li.other span { position: absolute; top: 50%; padding: 40px; font-weight: bold; font-size: 14px; color: #222; -webkit-transform: translateY(-50%); transform: translateY(-50%); display: block; } }

@media screen and (max-width: 768px) { .wrapper #content_right { text-align: center; } }

.wrapper #content_right li.large img { width: 100%; float: none; border-radius: 3px 3px 0 0; }

.wrapper #content_right li.large span.txt { display: block; padding: 10px; font-size: 14px; }

.wrapper #content_right li.original img { width: 100%; float: none; border-radius: 3px 3px 0 0; }

.wrapper #content_right li.original span.txt { display: block; padding: 10px; background: #000; color: #fff; font-size: 14px; border-radius: 0 0 3px 3px; }

@media screen and (max-width: 768px) { .wrapper #content_right .yomu_wrap { position: relative; width: 100%; border-top: solid 3px #1ea121; }
  .wrapper #content_right .yomu_wrap iframe { top: 0; right: 0; width: 100% !important; } }

@media screen and (max-width: 768px) and (max-width: 768px) { .wrapper #content_right .yomu_wrap iframe { height: 280px; } }

.wrapper #content_left .video_service ul { background: #fff; padding: 10px; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

.wrapper #content_left .video_service ul:after { content: ""; display: block; clear: both; }

.wrapper #content_left .video_service li { padding: 10px; width: 33.33%; float: left; border: none; }

.wrapper #content_left .video_service li img { width: 100%; }

.wrapper #content_left .video_service li a, .wrapper #content_left .video_service nav ul li span, .wrapper nav ul #content_left .video_service li span { font-size: 14px; color: #333; }

.wrapper #content_left .video_service li span { margin-top: 5px; }

.wrapper #content_left .video_service li.other { clear: both; width: 100%; float: none; text-align: right; }

.wrapper .sp_banner_box { background: #fff; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul { padding-bottom: 10px; } }

.wrapper .sp_banner_box ul li { font-size: 16px; position: relative; }

@media screen and (min-width: 769px) { .wrapper .sp_banner_box ul li { border-bottom: solid 1px #e9e9e9; } }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li { width: 100%; padding: 8px 16px 0; margin-bottom: 8px; border-top: solid 1px #e9e9e9; } }

.wrapper .sp_banner_box ul li.new:after { content: "NEW"; display: block; position: absolute; top: 3px; left: 3px; width: 40px; padding: 3px; background: #f00; color: #fff; font-size: 10px; line-height: 1; font-weight: bold; text-align: center; }

.wrapper .sp_banner_box ul li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

.wrapper .sp_banner_box ul li img { width: 100%; height: 100%; max-height: 120px; border-radius: 3px; object-fit: cover; font-family: "object-fit: cover;"; /*IE対応*/ }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li img { max-height: 250px; } }

.wrapper .sp_banner_box ul li a, .wrapper .sp_banner_box nav ul li span, .wrapper nav .sp_banner_box ul li span { color: #333; text-decoration: none; display: table; padding: 10px; width: calc(100% - 20px); transition: all 0.3s; -webkit-transition: all 0.3s; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li a, .wrapper .sp_banner_box nav ul li span, .wrapper nav .sp_banner_box ul li span { display: flex; padding: 0; width: 100%; } }

.wrapper .sp_banner_box ul li a:hover, .wrapper .sp_banner_box nav ul li span:hover, .wrapper nav .sp_banner_box ul li span:hover { color: #1ea121; background: #f4fdf4; }

.wrapper .sp_banner_box ul li a:hover img, .wrapper .sp_banner_box nav ul li span:hover img, .wrapper nav .sp_banner_box ul li span:hover img { opacity: 0.9; }

.wrapper .sp_banner_box ul li a:after, .wrapper .sp_banner_box nav ul li span:after, .wrapper nav .sp_banner_box ul li span:after { content: ""; display: block; clear: both; }

.wrapper .sp_banner_box ul li a .sp_img, .wrapper .sp_banner_box nav ul li span .sp_img, .wrapper nav .sp_banner_box ul li span .sp_img { display: table-cell; width: 220px; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li a .sp_img, .wrapper .sp_banner_box nav ul li span .sp_img, .wrapper nav .sp_banner_box ul li span .sp_img { display: block; width: 20%; } }

.wrapper .sp_banner_box ul li a .txt, .wrapper .sp_banner_box nav ul li span .txt, .wrapper nav .sp_banner_box ul li span .txt { display: table-cell; position: relative; text-align: left; vertical-align: middle; font-size: 18px; padding: 0 20px; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li a .txt, .wrapper .sp_banner_box nav ul li span .txt, .wrapper nav .sp_banner_box ul li span .txt { display: block; font-size: 14px; line-height: 1.3; padding: 10px; color: #222; width: 80%; padding: 0 0 0 8px; } }

.wrapper .sp_banner_box ul li a .txt .date, .wrapper .sp_banner_box nav ul li span .txt .date, .wrapper nav .sp_banner_box ul li span .txt .date { margin-top: 4px; opacity: 0.5; font-size: 11px; display: block; position: absolute; bottom: 0; left: 20px; line-height: 1; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li a .txt .date, .wrapper .sp_banner_box nav ul li span .txt .date, .wrapper nav .sp_banner_box ul li span .txt .date { left: auto; bottom: auto; position: relative; } }

.wrapper .sp_banner_box ul li .logo { position: absolute; right: 20px; bottom: -12px; width: 120px; display: block; }

@media screen and (max-width: 768px) { .wrapper .sp_banner_box ul li .logo { right: 16px; bottom: 0; width: 100px; } }

.wrapper .sp_banner_box ul li .logo img { width: 100%; }

.wrapper #bangumi_page_top { position: fixed; bottom: 20px; left: 50%; margin-left: 520px; z-index: 5; width: 60px; height: 60px; background: #1ea121; border-radius: 100px; text-indent: -999px; display: block; overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper #bangumi_page_top:after { content: ""; position: absolute; right: 25px; top: 50%; margin-top: -13px; display: block; width: 15px; height: 15px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); overflow: hidden; margin-top: -5px; right: 21px; }

@media screen and (max-width: 768px) { .wrapper #bangumi_page_top:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper #bangumi_page_top:hover { opacity: 0.9; }

.wrapper #bangumi_page_top.hide { bottom: -80px; }

/**********************************************************************
インデックス
**********************************************************************/
#index.wrapper .common_title_second.sns { padding: 5px; text-align: center; }

@media screen and (max-width: 768px) { #index.wrapper .bn_list { background-color: #fff; } }

#index.wrapper .bn_list li { display: none; margin-top: 10px; }

@media screen and (max-width: 768px) { #index.wrapper .bn_list li { margin-top: 0; min-width: 80%; } }

#index.wrapper .bn_list li:nth-child(-n + 3) { display: block; }

#index.wrapper .pager { display: none; }

#index.wrapper .pageNum { display: none; }

@media screen and (min-width: 1300px) { #index.wrapper .bn_list li:nth-child(-n + 4) { display: block; } }

/*インデックス 概要
--------------------------------------------------------------------*/
.wrapper #outline { background: #fff; overflow: hidden; }

.wrapper #outline .outline_box { padding: 30px; }

@media screen and (max-width: 768px) { .wrapper #outline .outline_box { padding: 20px; } }

.wrapper #outline .cast_box { padding: 0 30px 30px 30px; }

@media screen and (max-width: 768px) { .wrapper #outline .cast_box { padding: 0 20px 20px 20px; } }

/*インデックス 概要
--------------------------------------------------------------------*/
.wrapper #form .common_box { padding: 40px; }

@media screen and (min-width: 769px) { .wrapper #form .common_box { font-size: 16px; } }

@media screen and (max-width: 768px) { .wrapper #form .common_box { padding: 15px; } }

/*キャスト＆ゲスト
--------------------------------------------------------------------*/
.wrapper { /*.cast_list.img1 { li{ width: 28%; } } .cast_list.img2 { li{ margin-right:5%; width: 28%; } } .cast_list.img3 { li{ width: 20%; } }*/ }

.wrapper .cast_list { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-justify-content: center; -webkit-justify-content: center; justify-content: center; width: 100%; padding: 0 20px 0px 20px; }

@media screen and (max-width: 768px) { .wrapper .cast_list { padding: 0; } }

.wrapper .cast_list li { margin: 20px 2% 0 2%; width: 29%; line-height: 1.3; text-align: center; }

@media screen and (max-width: 768px) { .wrapper .cast_list li { margin: 20px 2% 0 2%; width: 46%; padding: 0; } }

.wrapper .cast_list li .name { display: block; margin: 10px 0 5px 0; font-size: 16px; font-weight: bold; }

.wrapper .cast_list li .actor { display: block; margin: 5px 0; font-size: 14px; }

.wrapper .cast_list li .desc { display: block; font-size: 12px; color: #666; }

.wrapper .cast_list li img { width: 100%; height: auto; border-radius: 50%; }

.wrapper .sp_banner_box li:nth-child(n + 6) { display: none; }

@media screen and (min-width: 1300px) { .wrapper #outline .movie_wrap_outer { width: 50%; padding: 30px; float: left; }
  .wrapper #outline .outline_box { width: 50%; padding: 30px 30px 30px 0; float: right; } }

/**********************************************************************
#下層ページ
**********************************************************************/
.wrapper.bottom h1.pageTitle { font-size: 150%; display: block; }

.wrapper.bottom .common_title { border-top: none; background: #222; padding: 15px 0 15px 40px; font-size: 20px; line-height: 1em; position: relative; color: #fff; }

@media screen and (max-width: 768px) { .wrapper.bottom .common_title { font-size: 15px; text-align: left; padding: 15px 0 15px 25px; } }

.wrapper.bottom .common_title:after { content: ""; width: 8px; height: 50%; background: #ffd900; display: block; position: absolute; left: 10px; top: 50%; margin-top: -15px; }

@media screen and (max-width: 768px) { .wrapper.bottom .common_title:after { width: 4px; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin-top: 0; } }

.wrapper.bottom .super_large_text { font-size: 36px !important; line-height: 1.4em; letter-spacing: -1px; font-weight: bold; }

@media screen and (max-width: 768px) { .wrapper.bottom .super_large_text { font-size: 24px !important; } }

.wrapper.bottom .large_text { font-size: 22px; line-height: 1.4em; font-weight: bold; }

.wrapper.bottom .small_text { font-size: 12px; line-height: 1.4em; font-weight: bold; }

.wrapper.bottom .common_box { padding: 30px; }

.wrapper.bottom a.next_button, .wrapper.bottom nav ul li span.next_button { padding: 25px 0; font-weight: bold; font-size: 15px; }

.wrapper.bottom a.next_button span, .wrapper.bottom nav ul li span.next_button span { font-weight: bold; font-size: 20px; padding-top: 10px; }

.wrapper.bottom a.next_button:after, .wrapper.bottom nav ul li span.next_button:after { content: ""; position: absolute; right: 20px; top: 50%; margin-top: -8px; display: block; width: 10px; height: 10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; border-width: 3px; }

@media screen and (max-width: 768px) { .wrapper.bottom a.next_button:after, .wrapper.bottom nav ul li span.next_button:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

.wrapper.bottom .bnr_large { background: #fff; border: solid 1px #ddd; }

.wrapper.bottom .bnr_large a, .wrapper.bottom .bnr_large nav ul li span, .wrapper.bottom nav ul li .bnr_large span { transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper.bottom .bnr_large a:hover, .wrapper.bottom .bnr_large nav ul li span:hover, .wrapper.bottom nav ul li .bnr_large span:hover { opacity: 0.8; }

.wrapper.bottom .bnr_large img { width: 100%; height: auto; }

/**********************************************************************
	mainvisual
**********************************************************************/
.wrapper { /* Youtube*/ /* brightcove*/ }

.wrapper .mainvisual { background: url(../images/bg.png); position: relative; width: 100%; min-height: 365px; overflow: hidden; overflow: hidden; }

@media screen and (max-width: 768px) { .wrapper .mainvisual { min-height: auto; } }

@media screen and (min-width: 1300px) { .wrapper .mainvisual { min-height: 433px; } }

.wrapper .mainvisual li { float: left; }

.wrapper .mainvisual .slider img { width: 100%; height: auto; margin: auto; }

@media screen and (min-width: 1300px) { .wrapper .movie_wrap_outer { padding: 0 100px; } }

.wrapper .movie_wrap { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }

.wrapper .movie_wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.wrapper .bc_wrap { position: relative; width: 100%; padding-top: 56.25%; }

.wrapper .bc_wrap .bc_inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/**********************************************************************
	bangumi_box
**********************************************************************/
.wrapper .bangumi_box { background: #fff; padding: 40px; margin: 0 0 30px 0; }

@media screen and (max-width: 768px) { .wrapper .bangumi_box { padding: 15px 15px 25px 15px; } }

.wrapper h2.bangumi_head { color: #111; overflow: hidden; }

.wrapper h2.bangumi_head .bangumi_date { display: block; font-size: 16px; color: #444; margin: 0 0 10px 0; }

@media screen and (max-width: 768px) { .wrapper h2.bangumi_head .bangumi_date { font-size: 14px; margin-bottom: 0; } }

.wrapper h2.bangumi_head .bangumi_tit { display: block; font-size: 30px; line-height: 1.4; font-weight: bold; margin: 0 0 30px 0; }

@media screen and (max-width: 768px) { .wrapper h2.bangumi_head .bangumi_tit { font-size: 18px; margin: 0 0 10px 0; } }

.wrapper .bangumi_box .detail { font-size: 18px; position: relative; }

.wrapper .bangumi_box .detail p { font-size: 16px; margin: 0 0 1em 0; }

@media screen and (max-width: 768px) { .wrapper .bangumi_box .detail p { font-size: 14px; } }

.wrapper .bangumi_box .detail li, .wrapper .bangumi_box .detail div { font-size: 16px; }

@media screen and (max-width: 768px) { .wrapper .bangumi_box .detail li, .wrapper .bangumi_box .detail div { font-size: 14px; } }

.wrapper .bangumi_box .detail .bangumi_tit_sub { font-size: 18px; margin: 0 -5px 0.5em -5px; background: #f5f5f5; padding: 10px; }

@media screen and (max-width: 768px) { .wrapper .bangumi_box .detail .bangumi_tit_sub { font-size: 16px; } }

.wrapper .bangumi_box a.btn, .wrapper .bangumi_box nav ul li span.btn, .wrapper nav ul li .bangumi_box span.btn { width: 95%; margin: 0 auto 30px auto; }

.wrapper .readmore { display: none; }

#index.wrapper .bangumi_box .detail.hide { height: 150px; overflow: hidden; }

#index.wrapper .bangumi_box .detail .readmore { position: absolute; display: block; bottom: 0; width: 100%; padding: 20px 0 5px 0; text-align: center; background: transparent linear-gradient(180deg, rgba(255, 255, 255, 0.5), white) repeat scroll 0 0; font-weight: bold; cursor: pointer; z-index: 999; }

#index.wrapper .bangumi_box .detail .readmore span { border-radius: 20px; padding: 5px 30px; background: #1ea121; color: #fff; }

#index.wrapper .freeinfo-title, #index.wrapper .freeinfo-text, #index.wrapper .oaepisode-text, #index.wrapper .oaepisode-title { display: block; }

#index.wrapper .freeinfo-title, #index.wrapper .oaepisode-title { background: #efefef; padding: 4px 8px; margin-bottom: 8px; }

/**********************************************************************
	バックナンバーサムネイル
**********************************************************************/
.wrapper .bn_title { color: #888; font-size: 185%; margin: 0 0 20px 0; }

.wrapper .bn_list { display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; }

.wrapper .bn_list li { position: relative; width: 32%; background: #fff; border: solid 1px #ddd; cursor: pointer; margin: 0 2% 20px 0; overflow: hidden; }

.wrapper .bn_list li:nth-child(3n) { margin: 0 0 20px 0; }

.wrapper .bn_list li .bn_img { position: relative; overflow: hidden; }

.wrapper .bn_list li .bn_img img { width: 100%; height: 100%; max-height: 170px; object-fit: cover; font-family: "object-fit: cover;"; /*IE対応*/ transition: all 0.3s; transform-origin: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

@media screen and (max-width: 768px) { .wrapper .bn_list li .bn_img img { max-height: 14.5vw; } }

.wrapper .bn_list li.movie .bn_img:after { content: ""; background: url(../../common/images/icon_movie.png) no-repeat; background-size: contain; position: absolute; left: 50%; top: 50%; width: 50px; height: 35px; margin: -18px 0 0 -25px; }

.wrapper .bn_list li.youtube .bn_img:after { content: ""; background: url(../../common/images/icon_youtube.png) no-repeat; background-size: contain; position: absolute; left: 50%; top: 50%; width: 50px; height: 35px; margin: -18px 0 0 -25px; }

.wrapper .bn_list li:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); }

.wrapper .bn_list li .bn_txt_box { padding: 16px; line-height: 1.4; }

.wrapper .bn_list li .bn_txt_box .bn_date { color: #888; margin: 0 0 5px 0; font-size: 12px; opacity: 0.8; }

.wrapper .bn_list li .bn_txt_box .bn_txt { color: #111; font-size: 116%; font-weight: bold; }

.wrapper .bn_list li .bn_txt_box .bn_txt a, .wrapper .bn_list nav ul li .bn_txt_box .bn_txt span, .wrapper nav ul .bn_list li .bn_txt_box .bn_txt span, .wrapper .bn_list li .bn_txt_box .bn_txt a:hover, .wrapper .bn_list nav ul li .bn_txt_box .bn_txt span:hover, .wrapper nav ul .bn_list li .bn_txt_box .bn_txt span:hover { color: #111; text-decoration: none; }

.wrapper .bn_list li .bn_txt_box .bn_txt .read { font-size: 14px; opacity: 0.6; display: block; margin: 8px 0 16px; font-weight: normal; }

@media screen and (max-width: 768px) { .wrapper .bn_list li .bn_txt_box .bn_txt .read { display: none; } }

.wrapper .bn_list.human li { position: relative; }

@media screen and (max-width: 768px) { .wrapper .bn_list.human li { display: flex; }
  .wrapper .bn_list.human li .bn_txt_box { align-self: center; } }

.wrapper .bn_list.human li .bn_date { font-size: 11px; opacity: 0.7; position: absolute; bottom: 5px; left: 16px; color: #888 !important; }

@media screen and (max-width: 768px) { .wrapper .bn_list.human li .bn_date { left: auto; bottom: 5px; right: 10px; } }

.wrapper .bn_list.movie li { position: relative; padding-bottom: 16px; }

@media screen and (max-width: 768px) { .wrapper .bn_list.movie li { padding-bottom: 0; } }

.wrapper .bn_list.movie li .bn_date { font-size: 11px; opacity: 0.7; position: absolute; bottom: 5px; left: 10px; color: #888 !important; }

@media screen and (max-width: 768px) { .wrapper .bn_list.movie li .bn_date { left: auto; bottom: 5px; right: 10px; } }

.wrapper .bn_list.movie li .bn_img:before { -webkit-border-radius: 50%; box-sizing: border-box; z-index: 2; position: absolute; top: 50%; left: 50%; width: 55px; height: 55px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 6px solid rgba(255, 255, 255, 0.9); border-radius: 50%; content: ""; background: rgba(0, 0, 0, 0.3); opacity: 0.8; }

@media screen and (max-width: 768px) { .wrapper .bn_list.movie li .bn_img:before { width: 25px; height: 25px; top: auto; left: auto; bottom: 13px; right: 12px; transform: none; -webkit-transform: none; border-width: 3px; } }

.wrapper .bn_list.movie li .bn_img:after { box-sizing: border-box; z-index: 2; position: absolute; top: 50%; left: 50%; width: 16px; height: 24px; -webkit-transform: translate(-25%, -50%); transform: translate(-25%, -50%); border: 12px solid transparent; border-left: 16px solid rgba(255, 255, 255, 0.9); content: ""; opacity: 0.8; }

@media screen and (max-width: 768px) { .wrapper .bn_list.movie li .bn_img:after { width: 8px; height: 12px; top: auto; left: auto; bottom: 20px; right: 13px; transform: none; -webkit-transform: none; border: 6px solid transparent; border-left: 8px solid rgba(255, 255, 255, 0.9); } }

@media screen and (max-width: 768px) { .wrapper#backnumber .bn_title { color: #888; font-size: 18px; margin: 0 0 10px 10px; border: none; padding: 0; }
  .wrapper#backnumber .bn_list li { width: 100%; margin: 0; border: none; border-bottom: solid 1px #ddd; }
  .wrapper#backnumber .bn_list li .bn_img { position: relative; width: 30%; float: left; padding: 10px; }
  .wrapper#backnumber .bn_list li .bn_txt_box { width: 70%; float: left; font-size: 13px; line-height: 1.3; padding: 8px 8px 8px 0; }
  .wrapper#backnumber .bn_list li .bn_txt_box .bn_date { font-size: 10px; }
  .wrapper#backnumber .bn_list li .bn_txt_box .bn_txt { font-size: 100%; }
  .wrapper#backnumber .bn_list li:nth-child(3n) { margin: 0; } }

/**********************************************************************
	ページ送り
**********************************************************************/
.wrapper .pager { width: 100%; margin: 20px 0 30px 0; overflow: hidden; }

.wrapper .pager .pagenation { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; position: relative; }

.wrapper .pager .pagenation li { margin: 0 2px; }

.wrapper .pager .pagenation li.btn_first { position: absolute; top: 0; left: 0; }

@media screen and (max-width: 768px) { .wrapper .pager .pagenation li.btn_first { left: 2%; } }

.wrapper .pager .pagenation li.btn_first span { display: none; }

.wrapper .pager .pagenation li.btn_last { position: absolute; top: 0; right: 0; }

@media screen and (max-width: 768px) { .wrapper .pager .pagenation li.btn_last { right: 2%; } }

.wrapper .pager .pagenation li.btn_last span { display: none; }

.wrapper .pager .pagenation li a, .wrapper .pager .pagenation nav ul li span, .wrapper nav ul .pager .pagenation li span, .wrapper .pager .pagenation li span { display: block; padding: 0.6em 0; font-size: 15px; width: 2.8em; text-decoration: none; background: #fff; border-radius: 3px; border: solid 1px #ddd; color: #999; text-align: center; }

.wrapper .pager .pagenation li a:hover, .wrapper .pager .pagenation nav ul li span:hover, .wrapper nav ul .pager .pagenation li span:hover { color: #fff; background: #ccc; border: solid 1px #ccc; }

.wrapper .pager .pagenation li.here a, .wrapper .pager .pagenation nav ul li.here span, .wrapper nav ul .pager .pagenation li.here span { color: #fff; background: #333; border: solid 1px #333; }

.wrapper #bn_list .pageNum { /*margin:30px 0; text-align:center;*/ display: none; }

/* NEWS
-------------------------------------------------------*/
#news.wrapper .common_title_second { padding: 10px; font-size: 14px; }

#news.wrapper article section.common_box { margin-bottom: 30px; }

#news.wrapper ul#news_list, #news.wrapper .newsAutoPage_item { display: none; margin-bottom: 30px; }

#news.wrapper ul#news_list li a, #news.wrapper nav ul#news_list li span { display: block; background: #fff; padding: 10px; position: relative; text-decoration: none; border-top: solid 1px #ececec; color: #525252; line-height: 1.4; overflow: hidden; }

#news.wrapper ul#news_list li a:hover, #news.wrapper nav ul#news_list li span:hover { background: #dff9df; }

#news.wrapper ul#news_list li a .thum, #news.wrapper nav ul#news_list li span .thum { display: block; float: left; width: 29%; background: url(../../smp/news/images/noimage.png) top left no-repeat; background-size: 100%; min-height: 106px; }

#news.wrapper ul#news_list li a .thum img, #news.wrapper nav ul#news_list li span .thum img { width: 100%; height: auto; }

#news.wrapper ul#news_list li a .txt, #news.wrapper nav ul#news_list li span .txt { display: block; float: right; width: 68%; }

#news.wrapper ul#news_list li a span.date, #news.wrapper nav ul#news_list li span span.date { display: block; font-size: 12px; line-height: 1; margin-bottom: 4px; color: #1ea121; }

/**********************************************************************
	footer
**********************************************************************/
.wrapper .share_box h1 { text-align: center; }

.wrapper .socialbtn { width: 270px; margin: 20px auto 10px auto; }

.wrapper .sns_block #tx_social_bar { width: 270px; margin: 20px auto 0 auto; }

.wrapper .sns_block #tx_social_bar a.Twitter, .wrapper .sns_block #tx_social_bar nav ul li span.Twitter, .wrapper nav ul li .sns_block #tx_social_bar span.Twitter, .wrapper .sns_block #tx_social_bar a.Facebook, .wrapper .sns_block #tx_social_bar nav ul li span.Facebook, .wrapper nav ul li .sns_block #tx_social_bar span.Facebook, .wrapper .sns_block #tx_social_bar a.Google, .wrapper .sns_block #tx_social_bar nav ul li span.Google, .wrapper nav ul li .sns_block #tx_social_bar span.Google, .wrapper .sns_block #tx_social_bar a.Atode, .wrapper .sns_block #tx_social_bar nav ul li span.Atode, .wrapper nav ul li .sns_block #tx_social_bar span.Atode, .wrapper .sns_block #tx_social_bar a.Hatena, .wrapper .sns_block #tx_social_bar nav ul li span.Hatena, .wrapper nav ul li .sns_block #tx_social_bar span.Hatena, .wrapper .sns_block #tx_social_bar a.Line, .wrapper .sns_block #tx_social_bar nav ul li span.Line, .wrapper nav ul li .sns_block #tx_social_bar span.Line { display: inline-block; font-size: 18px; width: 35px; height: 35px; line-height: 35px; margin: 0 10px 0 0; }

.wrapper .sns_block #tx_social_bar a.Twitter:before, .wrapper .sns_block #tx_social_bar nav ul li span.Twitter:before, .wrapper nav ul li .sns_block #tx_social_bar span.Twitter:before, .wrapper .sns_block #tx_social_bar a.Facebook:before, .wrapper .sns_block #tx_social_bar nav ul li span.Facebook:before, .wrapper nav ul li .sns_block #tx_social_bar span.Facebook:before, .wrapper .sns_block #tx_social_bar a.Google:before, .wrapper .sns_block #tx_social_bar nav ul li span.Google:before, .wrapper nav ul li .sns_block #tx_social_bar span.Google:before, .wrapper .sns_block #tx_social_bar a.Atode:before, .wrapper .sns_block #tx_social_bar nav ul li span.Atode:before, .wrapper nav ul li .sns_block #tx_social_bar span.Atode:before, .wrapper .sns_block #tx_social_bar a.Hatena:before, .wrapper .sns_block #tx_social_bar nav ul li span.Hatena:before, .wrapper nav ul li .sns_block #tx_social_bar span.Hatena:before, .wrapper .sns_block #tx_social_bar a.Line:before, .wrapper .sns_block #tx_social_bar nav ul li span.Line:before, .wrapper nav ul li .sns_block #tx_social_bar span.Line:before { width: 35px; height: 35px; line-height: 35px; }

.wrapper .sns_block #tx_social_bar a.Line, .wrapper .sns_block #tx_social_bar nav ul li span.Line, .wrapper nav ul li .sns_block #tx_social_bar span.Line { margin: 0; }

/**********************************************************************
	paraviリンクパーツ（メインカラム）
**********************************************************************/
@media screen and (min-width: 769px) { .wrapper #paravi_boxB * { box-sizing: border-box; }
  .wrapper #paravi_boxB { background: #fff; border: solid 1px rgba(0, 0, 0, 0.1); }
  .wrapper #paravi_boxB .player { position: relative; overflow: hidden; }
  .wrapper #paravi_boxB .player_thum { width: 100%; height: 50%; overflow: hidden; }
  .wrapper #paravi_boxB .player_thum .img { width: 100%; height: auto; }
  .wrapper #paravi_boxB .player .player_thum:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.1); transition: all 0.3s; -webkit-transition: all 0.3s; }
  .wrapper #paravi_boxB .player:hover .player_thum:after { background: rgba(0, 0, 0, 0.4); }
  .wrapper #paravi_boxB .player .player_txt { position: absolute; display: block; bottom: 0; left: 0; width: 100%; padding: 15px; background: rgba(0, 58, 134, 0.9); color: white; font-size: 18px; text-align: center; transition: all 0.3s; -webkit-transition: all 0.3s; }
  .wrapper #paravi_boxB .player .player_txt .small { font-size: 14px; display: block; }
  .wrapper #paravi_boxB .player:hover .player_txt { color: white; background: rgba(0, 58, 134, 0.9); text-shadow: 0 0 5px #000000; }
  .wrapper #paravi_boxB .player .link { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; }
  .wrapper #paravi_boxB .player .bt_play { position: absolute; top: 50%; left: 50%; margin-left: -35px; margin-top: -35px; }
  .wrapper #paravi_boxB .player .bt_play:before { content: ""; position: absolute; top: 0; left: 0; width: 70px; height: 70px; background: rgba(0, 0, 0, 0.5); border: solid 4px #fff; border-radius: 43px; transition: all 0.3s; -webkit-transition: all 0.3s; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
  .wrapper #paravi_boxB .player:hover .bt_play:before { width: 90px; height: 90px; border-radius: 53px; top: -10px; left: -10px; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
  .wrapper #paravi_boxB .player .bt_play:after { content: ""; position: absolute; top: 21px; left: 28px; width: 0; height: 0; border-style: solid; border-width: 18px 0 18px 26px; border-color: transparent transparent transparent #fff; }
  .wrapper #paravi_boxB .paravi_banner { background: #fff; overflow: hidden; position: relative; box-shadow: 0 2px 1px 0 rgba(0, 0, 0, 0.05); }
  .wrapper #paravi_boxB .paravi_banner:hover { box-shadow: 0 2px 1px 0 rgba(0, 0, 0, 0.1); }
  .wrapper #paravi_boxB .paravi_banner .link { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; z-index: 100; }
  .wrapper #paravi_boxB .paravi_banner_txt { padding: 0px 10px 10px 20px; }
  .wrapper #paravi_boxB .paravi_banner_txt .title { float: left; width: calc(100% - 110px); color: #003a86; font-size: 26px; line-height: 1.2; font-weight: bold; padding: 10px 0 0 0; }
  .wrapper #paravi_boxB .paravi_banner_txt .logo { float: right; width: 100px; padding: 10px 10px 0 0; }
  .wrapper #paravi_boxB .paravi_banner_txt .logo img { width: 100%; }
  .wrapper #paravi_boxB .paravi_banner_txt .paravi_txt_small { clear: both; font-size: 12px; color: #6685a5; padding: 10px 0 0 0; }
  .wrapper #paravi_boxB .paravi_banner_img { padding: 10px; overflow: hidden; }
  .wrapper #paravi_boxB .paravi_banner_img li { width: 49%; float: left; position: relative; }
  .wrapper #paravi_boxB .paravi_banner_img li img { width: 100%; }
  .wrapper #paravi_boxB .paravi_banner_img li:nth-child(1) { margin-right: 2%; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play { position: absolute; top: 50%; left: 50%; margin-left: -20px; margin-top: -20px; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play:before { content: ""; position: absolute; top: 0; left: 0; width: 40px; height: 40px; background: rgba(0, 0, 0, 0.5); border: solid 3px #fff; border-radius: 26px; transition: all 0.3s; -webkit-transition: all 0.3s; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play:after { content: ""; position: absolute; top: 12px; left: 18px; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 15px; border-color: transparent transparent transparent #fff; } }

@media screen and (max-width: 768px) { .wrapper #paravi_boxB { background: #fff; border: solid 1px rgba(0, 0, 0, 0.1); }
  .wrapper #paravi_boxB .player { position: relative; overflow: hidden; }
  .wrapper #paravi_boxB .player_thum { width: 100%; height: 50%; overflow: hidden; }
  .wrapper #paravi_boxB .player_thum .img { width: 100%; height: auto; }
  .wrapper #paravi_boxB .player .player_thum:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.1); }
  .wrapper #paravi_boxB .player .player_txt { padding: 5px 10px; background: #003a86; color: white; font-size: 3.5vw; }
  .wrapper #paravi_boxB .player .link { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; }
  .wrapper #paravi_boxB .player .bt_play { position: absolute; top: 50%; left: 50%; margin-left: -35px; margin-top: -35px; }
  .wrapper #paravi_boxB .player .bt_play:before { content: ""; position: absolute; top: 0; left: 0; width: 70px; height: 70px; background: rgba(0, 0, 0, 0.5); border: solid 4px #fff; border-radius: 43px; }
  .wrapper #paravi_boxB .player .bt_play:after { content: ""; position: absolute; top: 21px; left: 28px; width: 0; height: 0; border-style: solid; border-width: 18px 0 18px 26px; border-color: transparent transparent transparent #fff; }
  .wrapper #paravi_boxB .paravi_banner { background: #fff; overflow: hidden; position: relative; box-shadow: 0 2px 1px 0 rgba(0, 0, 0, 0.05); }
  .wrapper #paravi_boxB .paravi_banner .link { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; z-index: 100; }
  .wrapper #paravi_boxB .paravi_banner_txt { padding: 5px 10px 5px; }
  .wrapper #paravi_boxB .paravi_banner_txt .paravi_txt_small img { float: right; width: 9%; margin-left: 5px; margin-bottom: 1vw; }
  .wrapper #paravi_boxB .paravi_banner_txt .title { color: #003a86; font-size: 5vw; line-height: 1.2; letter-spacing: 2px; font-weight: bold; margin-top: 5px; }
  .wrapper #paravi_boxB { overflow: hidden; padding: 0 10px 10px; }
  .wrapper #paravi_boxB .logo { float: right; width: 9%; margin-left: 1%; }
  .wrapper #paravi_boxB .logo img { width: 100%; }
  .wrapper #paravi_boxB .paravi_txt_small { float: left; font-size: 3vw; line-height: 1.2; color: #6685a5; margin-top: 5px; margin-bottom: 5px; }
  .wrapper #paravi_boxB .paravi_banner_img { padding: 10px; }
  .wrapper #paravi_boxB .paravi_banner_img:after { content: "."; display: block; height: 0.1px; clear: both; visibility: hidden; }
  .wrapper #paravi_boxB .paravi_banner_img li { width: 49%; float: left; position: relative; }
  .wrapper #paravi_boxB .paravi_banner_img li img { width: 100%; }
  .wrapper #paravi_boxB .paravi_banner_img li:nth-child(1) { margin-right: 2%; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play { position: absolute; top: 50%; left: 50%; margin-left: -20px; margin-top: -20px; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play:before { content: ""; position: absolute; top: 0; left: 0; width: 40px; height: 40px; background: rgba(0, 0, 0, 0.5); border: solid 3px #fff; border-radius: 26px; transition: all 0.3s; -webkit-transition: all 0.3s; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
  .wrapper #paravi_boxB .paravi_banner_img li .bt_play:after { content: ""; position: absolute; top: 12px; left: 18px; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 15px; border-color: transparent transparent transparent #fff; } }

/**********************************************************************
	@media
**********************************************************************/
@media screen and (min-width: 1300px) { .wrapper .wrapper_inner { width: 1300px; }
  .wrapper #content_left { width: 970px; }
  .wrapper nav { font-size: 18px; }
  .wrapper nav ul li a, .wrapper nav ul li span { border-top: none; }
  .wrapper #bangumi_page_top { margin-left: 680px; }
  .wrapper #reccomend_drama .reccomend_drama_wrapper_inner { width: 1300px; }
  .wrapper #reccomend_drama ul li { width: 15.5%; }
  .wrapper .bnr_large { background: #fff; border: solid 1px #ddd; padding: 0 150px; }
  .wrapper .bn_list li, .wrapper .bn_list li:nth-child(3n) { width: 235px; margin: 0 10px 20px 0; }
  .wrapper .bn_list li:nth-child(4n) { margin: 0 0 20px 0; }
  .wrapper .bn_list.human li { width: 32%; margin: 0 2% 20px 0; }
  .wrapper .bn_list.human li:nth-child(3n) { margin: 0 0 20px 0; }
  .wrapper .bangumi_box { padding: 40px 100px 60px 100px; }
  .wrapper .news_article { float: left; width: 650px; }
  .wrapper .news_archive { float: right; width: 300px; margin-bottom: 30px; }
  .wrapper #video .title { font-size: calc(16px + 0.5vw); padding: 15px; }
  .wrapper #video .video_holder_wrap { margin: 0 100px; overflow: inherit !important; }
  .wrapper #video .video_holder_wrap:before, .wrapper #video .video_holder_wrap:after { content: ""; display: block; position: absolute; width: 100px; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 10; }
  .wrapper #video .video_holder_wrap:before { left: 0; top: 0; }
  .wrapper #video .video_holder_wrap:after { right: 0; top: 0; }
  .wrapper #video_wrap #video_bnr { padding: 0 90px 0 80px; }
  #news.wrapper ul#news_list li a .thum, #news.wrapper nav ul#news_list li span .thum { min-height: 55px; }
  #special.wrapper ul#sp_list li a .thum, #special.wrapper nav ul#sp_list li span .thum { min-height: 55px; } }

.wrapper .common_link_button { transition: all 0.3s; -webkit-transition: all 0.3s; }

.wrapper .common_link_button.open { cursor: pointer; }

.wrapper .common_link_button.open:after, .wrapper .common_link_button.open:hover:after { -webkit-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); top: calc(50% + 5px); }

.wrapper .common_link_button.noactive { pointer-events: none; opacity: 0.5 !important; }

/**********************************************************************
	汎用カードスタイル
**********************************************************************/
.wrapper .card_list { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; }

.wrapper .card_list li { padding: 1%; margin-bottom: 20px; }

.wrapper .card_list li img { max-width: 100%; }

.wrapper .card_list li p { margin: 0; padding: 0; }

.wrapper .card_list li p.tit { background-color: #1ea121; color: #fff; text-align: center; font-size: 100%; }

.wrapper .card_list li p.tit_sub { border-bottom: 1px solid #000; padding: 4px 0 4px; line-height: 150%; text-align: center; }

.wrapper .card_list li p.desc { font-size: 85%; line-height: 170%; margin-top: 5px; }

.wrapper .card_list.col3 li { width: 32%; margin-left: 1%; }

@media screen and (min-width: 769px) { .wrapper .card_list.col3 li:nth-child(3n-2) { margin-left: 0; } }

@media screen and (max-width: 768px) { .wrapper .card_list.col3 li { width: 49%; margin: 0; margin-bottom: 20px; }
  .wrapper .card_list.col3 li:nth-child(2n-1) { margin-right: 2%; } }

.wrapper .card_list.col4 li { width: 25%; }

@media screen and (max-width: 768px) { .wrapper .card_list.col4 li { width: 49%; margin: 0; margin-bottom: 20px; }
  .wrapper .card_list.col4 li:nth-child(2n-1) { margin-right: 2%; } }

/**********************************************************************
	以下テレ東プラス用
**********************************************************************/
@media screen and (min-width: 769px) { /**********************************************************************
基本設定
**********************************************************************/
  .wrapper #backnumber_holder img { width: 100%; height: auto; }
  .wrapper #backnumber_holder img.pluslogo { width: auto; height: 15px; vertical-align: baseline; }
  .wrapper #backnumber_holder .entry_detail_related_image img { width: auto; height: auto; }
  .wrapper #backnumber_holder .yomu_video_palyer { position: relative; width: 100%; height: 0; padding-top: 56.25%; }
  .wrapper #backnumber_holder .yomu_video_palyer iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }
  .wrapper #backnumber_holder .p { margin-top: 0.5em; }
  .wrapper #backnumber_holder .entry_detail_related_title, .wrapper #backnumber_holder .entry_detail_related_box, .wrapper #backnumber_holder .btn_otherphoto { display: none; }
  .wrapper #backnumber_holder .content_detail_special_area { margin-bottom: 1em; }
  .wrapper #backnumber_holder p.content_detail_special_txt { font-size: 90%; color: #fff; line-height: 1.5; padding: 0px 15px 10px; background: #000; margin: 0; }
  .wrapper #backnumber_holder h2.content_detail_special_tit { font-size: 110%; color: #fff; line-height: 1.5; padding: 15px 15px 5px 15px; background: #000; }
  .wrapper #backnumber_holder div.relationposts_nav:after { content: ""; display: block; clear: both; }
  .wrapper #backnumber_holder div.relationposts_nav a, .wrapper #backnumber_holder div.relationposts_nav nav ul li span, .wrapper nav ul li #backnumber_holder div.relationposts_nav span { font-size: 90%; padding: 10px 40px 10px 0; display: block; text-decoration: none; position: relative; overflow: hidden; border-bottom: solid 1px #eee; color: #1ea121; font-weight: bold; transition: all 0.3s; -webkit-transition: all 0.3s; }
  .wrapper #backnumber_holder div.relationposts_nav a:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:after { content: ""; position: absolute; right: 18px; top: 50%; margin-top: -6px; display: block; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; border-color: #ccc; right: 10px; } }

@media screen and (min-width: 769px) and (max-width: 768px) { .wrapper #backnumber_holder div.relationposts_nav a:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

@media screen and (min-width: 769px) { .wrapper #backnumber_holder div.relationposts_nav a:hover, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:hover, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:hover { color: #167618; font-weight: bold; }
  .wrapper #backnumber_holder div.relationposts_nav a:hover:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:hover:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:hover:after { border-color: #1ea121; right: 5px; }
  /**********************************************************************
	サムネイル
**********************************************************************/
  .wrapper #plus_article_list { display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
  .wrapper #plus_article_list .plus_article_txt { color: #888; font-size: 185%; margin: 0 0 20px 0; }
  .wrapper #plus_article_list li:nth-child(3n) { margin: 0 0 20px 0; }
  .wrapper #plus_article_list li { width: 32%; background: #fff; border: solid 1px #ddd; cursor: pointer; margin: 0 2% 20px 0; overflow: hidden; }
  .wrapper #plus_article_list .plus_article_img { position: relative; overflow: hidden; }
  .wrapper #plus_article_list .plus_article_img img { width: 100%; transition: all 0.3s; transform-origin: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
  .wrapper #plus_article_list li:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); }
  .wrapper #plus_article_list li:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); }
  .wrapper #plus_article_list .plus_article_txt { padding: 10px 10px 15px 10px; line-height: 1.4; color: #111; font-weight: bold; font-size: 100%; display: block; min-height: 140px; }
  .wrapper #plus_article_list a, .wrapper #plus_article_list nav ul li span, .wrapper nav ul li #plus_article_list span, .wrapper #plus_article_list a:hover, .wrapper #plus_article_list nav ul li span:hover, .wrapper nav ul li #plus_article_list span:hover { color: #111; text-decoration: none; }
  .wrapper .pager.plus_article { width: 100%; margin: 20px 0 30px 0; overflow: hidden; }
  .wrapper .pager.plus_article .pagenation.simple-pagination { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; position: relative; }
  .wrapper .pagenation.simple-pagination { /*@include break_smp{ li a, li span { width: 2em; } }*/ }
  .wrapper .pagenation.simple-pagination li { margin: 0 2px; }
  .wrapper .pagenation.simple-pagination li.btn_first { position: absolute; top: 0; left: 0; }
  .wrapper .pagenation.simple-pagination li.btn_first span { display: none; }
  .wrapper .pagenation.simple-pagination li.btn_last { position: absolute; top: 0; right: 0; }
  .wrapper .pagenation.simple-pagination li.btn_last span { display: none; }
  .wrapper .pagenation.simple-pagination li a, .wrapper .pagenation.simple-pagination nav ul li span, .wrapper nav ul .pagenation.simple-pagination li span, .wrapper .pagenation.simple-pagination li span { display: block; padding: 0.6em 0; font-size: 15px; width: 2.8em; text-decoration: none; background: #fff; border-radius: 3px; border: solid 1px #ddd; color: #999; text-align: center; }
  .wrapper .pagenation.simple-pagination li a:hover, .wrapper .pagenation.simple-pagination nav ul li span:hover, .wrapper nav ul .pagenation.simple-pagination li span:hover, .wrapper .pagenation.simple-pagination li span:hover { color: #fff; background: #ccc; border: solid 1px #ccc; }
  .wrapper .pagenation.simple-pagination li.here a, .wrapper .pagenation.simple-pagination nav ul li.here span, .wrapper nav ul .pagenation.simple-pagination li.here span, .wrapper .pagenation.simple-pagination li.here span { color: #fff; background: #333; border: solid 1px #333; }
  .wrapper .pagenation.simple-pagination li span.ellipse { padding: 0; margin: 0; background: none; border: none; display: inline-block; width: auto; line-height: 40px; pointer-events: none; }
  #index.wrapper #plus_article_list .plus_article_txt { min-height: auto; } }

@media screen and (max-width: 768px) { /********************************************************************** 基本 */
  .wrapper #backnumber_holder img { width: 100%; height: auto; }
  .wrapper #backnumber_holder img.pluslogo { width: auto; height: 15px; vertical-align: baseline; }
  .wrapper #backnumber_holder .entry_detail_related_image img { width: auto; height: auto; }
  .wrapper #backnumber_holder .yomu_video_palyer { position: relative; width: 100%; height: 0; padding-top: 56.25%; }
  .wrapper #backnumber_holder .yomu_video_palyer iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }
  .wrapper #backnumber_holder .detail p { margin-top: 0.5em; }
  .wrapper #backnumber_holder .entry_detail_related_title, .wrapper #backnumber_holder .entry_detail_related_box, .wrapper #backnumber_holder .btn_otherphoto { display: none; }
  .wrapper #backnumber_holder .content_detail_special_area { margin-bottom: 1em; }
  .wrapper #backnumber_holder p.content_detail_special_txt { font-size: 90%; color: #fff; line-height: 1.5; padding: 0px 15px 10px; background: #000; margin: 0; }
  .wrapper #backnumber_holder h2.content_detail_special_tit { font-size: 110%; color: #fff; line-height: 1.5; padding: 15px 15px 5px 15px; background: #000; }
  .wrapper #backnumber_holder div.relationposts_nav:after { content: ""; display: block; clear: both; }
  .wrapper #backnumber_holder div.relationposts_nav a, .wrapper #backnumber_holder div.relationposts_nav nav ul li span, .wrapper nav ul li #backnumber_holder div.relationposts_nav span { font-size: 90%; padding: 10px 40px 10px 0; display: block; text-decoration: none; position: relative; overflow: hidden; border-bottom: solid 1px #eee; color: #1ea121; font-weight: bold; transition: all 0.3s; -webkit-transition: all 0.3s; }
  .wrapper #backnumber_holder div.relationposts_nav a:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:after { content: ""; position: absolute; right: 18px; top: 50%; margin-top: -6px; display: block; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; transition: all 0.3s; -webkit-transition: all 0.3s; border-color: #ccc; right: 10px; } }

@media screen and (max-width: 768px) and (max-width: 768px) { .wrapper #backnumber_holder div.relationposts_nav a:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:after { border-top: 2px solid #333; border-right: 2px solid #333; } }

@media screen and (max-width: 768px) { .wrapper #backnumber_holder div.relationposts_nav a:hover, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:hover, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:hover { color: #167618; font-weight: bold; }
  .wrapper #backnumber_holder div.relationposts_nav a:hover:after, .wrapper #backnumber_holder div.relationposts_nav nav ul li span:hover:after, .wrapper nav ul li #backnumber_holder div.relationposts_nav span:hover:after { border-color: #1ea121; right: 5px; }
  /********************************************************************** サムネイル */
  .wrapper #plus_article_list { color: #888; font-size: 18px; margin: 0; }
  .wrapper #plus_article_list li { background: #fff; border-bottom: solid 1px #ddd; overflow: hidden; }
  .wrapper #plus_article_list .plus_article_img { position: relative; width: 50%; float: left; padding: 10px; }
  .wrapper #plus_article_list .movie .plus_article_img:after { content: ""; background: url(../../../common/images/icon_movie.png) no-repeat; background-size: contain; position: absolute; left: 50%; top: 50%; width: 50px; height: 35px; margin: -18px 0 0 -25px; }
  .wrapper #plus_article_list .plus_article_img img { width: 100%; height: auto; }
  .wrapper #plus_article_list .plus_article_txt { width: 50%; float: left; font-size: 13px; line-height: 1.3; padding: 8px 8px 8px 0; }
  .wrapper #plus_article_list .bn_date { color: #888; font-size: 10px; }
  .wrapper #plus_article_list li a, .wrapper #plus_article_list nav ul li span, .wrapper nav ul #plus_article_list li span, .wrapper #plus_article_list li a:hover, .wrapper #plus_article_list nav ul li span:hover, .wrapper nav ul #plus_article_list li span:hover, .wrapper #plus_article_list li span { color: #111; font-weight: bold; text-decoration: none; }
  .wrapper .pager.plus_article { width: 100%; margin: 20px 0 30px 0; overflow: hidden; }
  .wrapper .pager.plus_article .pagenation.simple-pagination { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; position: relative; }
  .wrapper .pagenation.simple-pagination li { margin: 0 2px; }
  .wrapper .pagenation.simple-pagination li.btn_first { position: absolute; top: 0; left: 0; }
  .wrapper .pagenation.simple-pagination li.btn_first span { display: none; }
  .wrapper .pagenation.simple-pagination li.btn_last { position: absolute; top: 0; right: 0; }
  .wrapper .pagenation.simple-pagination li.btn_last span { display: none; }
  .wrapper .pagenation.simple-pagination li a, .wrapper .pagenation.simple-pagination nav ul li span, .wrapper nav ul .pagenation.simple-pagination li span, .wrapper .pagenation.simple-pagination li span { display: block; padding: 0.6em 0; font-size: 15px; width: 2.8em; text-decoration: none; background: #fff; border-radius: 3px; border: solid 1px #ddd; color: #999; text-align: center; }
  .wrapper .pagenation.simple-pagination li a, .wrapper .pagenation.simple-pagination nav ul li span, .wrapper nav ul .pagenation.simple-pagination li span, .wrapper .pagenation.simple-pagination li span { width: 2em; }
  .wrapper .pagenation.simple-pagination li a:hover, .wrapper .pagenation.simple-pagination nav ul li span:hover, .wrapper nav ul .pagenation.simple-pagination li span:hover, .wrapper .pagenation.simple-pagination li span:hover { color: #fff; background: #ccc; border: solid 1px #ccc; }
  .wrapper .pagenation.simple-pagination li.here a, .wrapper .pagenation.simple-pagination nav ul li.here span, .wrapper nav ul .pagenation.simple-pagination li.here span, .wrapper .pagenation.simple-pagination li.here span { color: #fff; background: #333; border: solid 1px #333; }
  .wrapper .pagenation.simple-pagination li span.ellipse { padding: 0; margin: 0; background: none; border: none; display: inline-block; width: auto; line-height: 40px; pointer-events: none; }
  #index.wrapper #plus_article_list .plus_article_txt { min-height: auto; } }

/*--- vuejs transition ----------------*/
.wrapper .list-transition-enter-active, .wrapper .list-transition-leave-active { transition: all 1s; }

.wrapper .list-transition-enter, .wrapper .list-transition-leave-to { opacity: 0; transform: translateY(30px); }
