@charset "UTF-8";
/*
#overview
変数定義

色やフォント、ブレイクポイントなどはsass変数として管理しています
*/
/*
#styleguide
ブレイクポイント

以下ブレイクポイント変数をmixinにセットしています。@include mq(sd){}で指定の範囲を示して、
{}で囲った範囲がメディアクエリとして書き出されます。詳細はsass関数ページに記述。

- 新仕様ページ用
$breakpoint_xxsd: 320px;
$breakpoint_xsd: 384px;
$breakpoint_sd:	592px;
$breakpoint_md:	800px;
$breakpoint_ld:	1152px;
$breakpoint_xld: 1366px;

- 既存ページ用
$breakpoint-generic:	640px;
*/
/*
#styleguide
フォント

以下5つのフォントセットをsass変数化して、使用しています。

$font: 'YuGothicM-Universal','YuGothic',-apple-system,"メイリオ","MS PGothic",sans-serif;
$font-webfont: 'Noto Sans Japanese','YuGothicM-Universal','YuGothic',-apple-system,"メイリオ","MS PGothic",sans-serif;
$font-number: Avenir,"Avenir Next",-apple-system,Helvetica,Arial,'YuGothicM-Universal','YuGothic',sans-serif;
$font-smartdevice: -apple-system,BlinkMacSystemFont,sans-serif;
$font-design: Tinos;

```
<p style="font-family:'YuGothicM-Universal','YuGothic',-apple-system,"メイリオ","MS PGothic",sans-serif;">$font: 1234567890かっこうはいっしょのごつごつうち顔へ口へ考えつい窓ますた。</p>
<p style="font-family:'Noto Sans Japanese','YuGothicM-Universal','YuGothic',-apple-system,"メイリオ","MS PGothic",sans-serif;">$font-webfont: 1234567890かっこうはいっしょのごつごつうち顔へ口へ考えつい窓ますた。</p>
<p style="font-family:-apple-system,BlinkMacSystemFont,sans-serif;">$font-smartdevice: 1234567890かっこうはいっしょのごつごつうち顔へ口へ考えつい窓ますた。</p>
<p style="font-family:Avenir,"Avenir Next",-apple-system,Helvetica,Arial,'YuGothicM-Universal','YuGothic',sans-serif">$font-number: 1234567890かっこうはいっしょのごつごつうち顔へ口へ考えつい窓ますた。</p>
<p style="font-family:'Tinos'">$font-design: 1234567890かっこうはいっしょのごつごつうち顔へ口へ考えつい窓ますた。</p>
```
*/
/*
#text-size

@txt-size : 16;
@txt-size_xld : 16;
@txt-size_ld : 14;
@txt-size_md : 14;
@txt-size_sd : 14;
@txt-size_xsd : 14;
@txt-size_xxsd : 12;

*/
/*
#colors

## CSSカラー変数

@color_white: #fff;
@color_red: #E00D0D;
@color_blue: #1C52AC;

@color_prime: rgb(0,86,167);
@color_live: rgb(189,8,82);
@color_cinema: rgb(0,162,115);


@color_primary: #0056A7;
@color_primary-safe: #003399;

@color_title: #1E3A67;
@color_text: #222;
@color_text-light: #555;
@color_text-safe: #767676;
@color_date: #666;

@color_caution:	#CC3333;
@color_promotion	:	#EE0000;
@color_linktext: #235990;

@color_hover : #eee;
@color_selected: #222;


//背景色
@bgcolor: #fff;
@bgcolor_header: rgba(255,255,255,1);
@bgcolor_control: #DDD;

@bgcolor_gray: #E5E5E5;
@bgcolor_lightgray: #F4F4F4;


@bgcolor_service: #EBF5FF;

@bgcolor_page-title:	#EFEFEF;
@bgcolor_lightgray-title:	#CCE8F4;


@btn_join: #cf2f6f;


*/
/*
//overview
sass関数

多用する記述をsass関数として定義しています
*/
/*
//styleguide
メディアクエリ記述関数

@全領域

各ブレイクポイントを指定して、メディアクエリを出力する。
※sassの@extendはmixiln内で使用できません。

@ include mq(sd){
	sd(592px以下)向けのCSS記述
}
*/
@media screen and (max-width: 1366px) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 1152px) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 800px) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 800px) and (orientation: landscape) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 592px) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 384px) and (orientation: portrait) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 320px) and (orientation: portrait) {
  ._dumy_ {
    display: none;
  }
}

@media screen and (max-width: 592px) {
  .is-visible-sd {
    display: initial !important;
  }
}

[class*="row"][class*="__noEdgeGutter"] {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

/* utility class */
.utl-nowrap {
  display: inline-block;
  white-space: nowrap;
}

.utl-img-fluid {
  max-width: 100%;
  height: auto;
}

.utl-img-fluid.-fill {
  width: 100%;
}

.utl-guard {
  position: relative;
}

.utl-guard::before {
  content: "";
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 2;
}

/*  */
#wol_detail .l__detail_static_bnr > .container {
  padding-bottom: 0;
}

@media screen and (max-width: 592px) {
  #wol_detail .l__detail_static_bnr > .container {
    padding-top: 2.5rem;
    padding-bottom: 3rem;
  }
}

.l__detail_static_bnr > .container > [class*='row'] > [class*='col'] {
  margin: 0 auto 50px;
}

@media screen and (max-width: 800px) {
  .l__detail_static_bnr > .container > [class*='row'] > [class*='col'] {
    margin: 0 auto 30px;
  }
}

@media screen and (max-width: 592px) {
  .l__detail_static_bnr > .container > [class*='row'] > [class*='col'] {
    margin: 0 auto 9px;
  }
}

.l__detail_static_bnr > .container > [class*='row'] > [class*='col']:last-child {
  margin-bottom: 0;
}

.mdl__dvdbnr {
  position: relative;
  box-sizing: border-box;
  width: auto;
  max-width: 740px;
  margin: 0 auto;
  border: 1px solid #0056A7;
}

.mdl__dvdbnr::before {
  content: "▸";
  font-family: wol;
  color: #0056A7;
  font-size: 1.875rem;
  position: absolute;
  right: 5px;
  top: 50%;
  margin-top: -.5em;
  line-height: 1;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr::before {
    font-size: 1.83333rem;
  }
}

.mdl__dvdbnr a {
  display: block;
}

.mdl__dvdbnr a:hover {
  opacity: .8;
}

.mdl__dvdbnr .__inner {
  box-sizing: border-box;
  padding: 10px;
  padding-right: 20px;
}

.mdl__dvdbnr .__inner:after {
  clear: both;
  content: "";
  display: table;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__inner {
    padding: 0.83333rem;
    padding-right: 1.66667rem;
  }
}

.mdl__dvdbnr .__pic {
  float: left;
  max-width: 100px;
}

@media screen and (max-width: 800px) {
  .mdl__dvdbnr .__pic {
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__pic {
    max-width: 6.66667rem;
  }
}

.mdl__dvdbnr .__pic img {
  width: 100%;
  height: auto;
}

.mdl__dvdbnr .__hd,
.mdl__dvdbnr .__desc,
.mdl__dvdbnr .__credit {
  float: right;
  width: calc(100% - 100px - 10px);
  margin-left: 10px;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__hd,
  .mdl__dvdbnr .__desc,
  .mdl__dvdbnr .__credit {
    width: calc(100% - 6.66667rem - 0.83333rem);
  }
}

.mdl__dvdbnr.-no-pic .__hd,
.mdl__dvdbnr.-no-pic .__desc,
.mdl__dvdbnr.-no-pic .__credit {
  width: 100%;
  margin-left: 0;
}

.mdl__dvdbnr .__hd {
  line-height: 1.2;
  margin-bottom: .6em;
  color: #0056A7;
  font-size: 18px;
  font-weight: 700;
}

.mdl__dvdbnr .__hd i {
  font-size: 30px;
  font-style: normal;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__hd {
    font-size: 1.08333rem;
  }
  .mdl__dvdbnr .__hd i {
    font-size: 1.66667rem;
  }
}

.mdl__dvdbnr .__desc {
  line-height: 1.3;
  margin-bottom: 10px;
  color: #222;
  font-size: 15px;
}

.mdl__dvdbnr .__desc small {
  font-size: 11px;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__desc {
    font-size: 0.83333rem;
  }
  .mdl__dvdbnr .__desc small {
    font-size: 0.66667rem;
  }
}

.mdl__dvdbnr .__credit {
  line-height: 1.2;
  color: #8E8E8E;
  font-size: 12px;
}

@media screen and (max-width: 592px) {
  .mdl__dvdbnr .__credit {
    clear: both;
    float: none;
    width: 100%;
    margin: 0;
    font-size: 0.66667rem;
  }
}

.mdl__muryo {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  border: 1px solid #0056A7;
  background: #F4F4F4;
}

.mdl__muryo .__inner {
  padding: 0;
}

.mdl__muryo .__inner:after {
  clear: both;
  content: "";
  display: table;
}

@media screen and (max-width: 800px) {
  .mdl__muryo .__inner {
    padding: 10px;
  }
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__inner {
    padding: 0.75rem 0 0.75rem 0.91667rem;
  }
}

.mdl__muryo .__thumb {
  box-sizing: border-box;
  float: left;
  width: 226px;
  height: auto;
  background: #000;
}

.mdl__muryo .__thumb > * {
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
}

@media screen and (max-width: 800px) {
  .mdl__muryo .__thumb {
    margin-bottom: 11px;
  }
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__thumb {
    width: 8.16667rem;
  }
  .mdl__muryo .__thumb > * {
    padding: 0.41667rem;
  }
}

.mdl__muryo .__thumb img {
  width: 100%;
  height: auto;
}

.mdl__muryo .__thumb a[data-target*="__static-movie-player-"]::after {
  width: 1em;
  height: 1em;
  line-height: 1;
  font-size: 82px;
  color: rgba(255, 255, 255, 0.7);
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__thumb a[data-target*="__static-movie-player-"]::after {
    font-size: 2.83333rem;
  }
}

.mdl__muryo .__hd,
.mdl__muryo .__desc,
.mdl__muryo .__note {
  float: right;
  width: calc(100% - 226px - 20px);
  margin-left: 1.25rem;
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__hd,
  .mdl__muryo .__desc,
  .mdl__muryo .__note {
    width: calc(100% - 8.16667rem - 0.83333rem);
    margin-left: 0.83333rem;
  }
}

.mdl__muryo .__hd {
  padding-top: 10px;
  line-height: 1.5;
  margin-bottom: .4em;
  color: #0056A7;
  font-size: 22px;
  font-weight: 700;
}

.mdl__muryo .__hd a {
  color: inherit;
}

.mdl__muryo .__hd a::before, .mdl__muryo .__hd a::after {
  display: none;
}

.mdl__muryo .__hd a:hover {
  opacity: .8;
}

.mdl__muryo .__hd strong {
  display: inline-block;
  white-space: normal;
  line-height: 1.2;
  font-size: 30px;
  font-weight: 700;
  font-style: normal;
}

@media screen and (max-width: 800px) {
  .mdl__muryo .__hd {
    padding-top: 0;
  }
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__hd {
    margin-bottom: .3em;
    padding-top: 0.25rem;
    font-size: 1rem;
    line-height: 1.5;
  }
  .mdl__muryo .__hd strong {
    line-height: 1.3;
    font-size: 1.26667rem;
  }
}

.mdl__muryo .__desc {
  line-height: 1.3;
  margin-bottom: .9em;
  color: #222;
  font-size: 14px;
}

.mdl__muryo .__desc i {
  font-size: 18px;
  font-style: normal;
  font-weight: inherit;
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__desc {
    font-size: 0.83333rem;
  }
  .mdl__muryo .__desc i {
    font-size: 1.08333rem;
  }
}

.mdl__muryo .__note {
  line-height: 1.4;
  color: #222;
  font-size: 12px;
}

.mdl__muryo .__note p {
  line-height: inherit;
  padding-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width: 592px) {
  .mdl__muryo .__note {
    clear: both;
    float: none;
    width: auto;
    margin: 0;
    padding: 0 0.75rem 0 0;
    font-size: 0.83333rem;
  }
}

.modal__footer {
  position: relative;
  margin-top: -70px;
  height: 70px;
}

@media screen and (max-width: 800px) {
  .modal__footer {
    margin-top: 0;
    height: auto;
  }
}

.modal__footer [class*='icn-'] {
  display: inline-block;
  margin-left: .5rem;
}

.modal__kanyu {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  padding: .5rem;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  font-size: 1.125rem;
  color: #0056A7;
}

@media screen and (max-width: 800px) {
  .modal__kanyu {
    -webkit-flex-flow: column nowrap;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
  }
}

.modal__kanyu a {
  color: inherit;
}

.modal__kanyu .btn__default_join {
  margin: 0 0 0 2rem;
  line-height: 2.6;
  min-width: 1px;
  max-width: 100%;
  padding-left: 1.5rem;
  padding-right: 2.5rem;
  font-size: 1rem;
  font-weight: 400;
  border-radius: 5px;
}

.modal__kanyu .btn__default_join:before {
  right: .75rem;
}

@media screen and (max-width: 800px) {
  .modal__kanyu .btn__default_join {
    margin: 1rem 2rem 0;
  }
}

/*書影*/
#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoei {
  display: block;
  margin: 1rem 0;
  padding-right: 2rem;
  width: 100%;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoei a:hover {
  text-decoration: underline;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic {
  width: auto;
  margin-left: -0.9375rem;
  margin-right: -0.9375rem;
  font-size: 0;
}

@media screen and (max-width: 592px) {
  #detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic {
    margin-left: -0.41667rem;
    margin-right: -0.41667rem;
  }
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic ul {
  list-style: none;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic ul li {
  -webkit-flex: 1 1 27%;
      -ms-flex: 1 1 27%;
          flex: 1 1 27%;
  width: 27%;
  max-width: 170px;
  position: relative;
  margin: 0 0.9375rem 0.5rem;
  height: auto;
}

@media screen and (max-width: 800px) and (orientation: landscape) {
  #detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic ul li {
    max-width: 7.14286rem;
  }
}

@media screen and (max-width: 592px) {
  #detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic ul li {
    margin: 0 0.33333rem 0.41667rem;
    max-width: 5.83333rem;
  }
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiPic ul li img {
  max-width: 100%;
  height: auto;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__shoeiCaption {
  font-size: 10px;
  display: block;
  text-align: left;
  padding-right: .5rem;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__desc {
  margin-bottom: 1rem;
  line-height: 1.625;
  font-size: 1rem;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__desc p {
  line-height: inherit;
  font-size: inherit;
}

@media screen and (max-width: 592px) {
  #detail-program-info-static .__contentCast .__staff_wapper .__staff .__desc {
    font-size: 0.91667rem;
  }
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .__link {
  margin-bottom: 1rem;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .btn__default.__outer {
  position: relative;
  max-width: 12.5rem;
  width: 12.5rem;
  min-width: 1px;
  max-height: 2.5rem;
  height: 2.5rem;
  line-height: 2.5rem;
  font-size: 0.9375rem;
  -webkit-animation-duration: 0s !important;
          animation-duration: 0s !important;
}

#detail-program-info-static .__contentCast .__staff_wapper .__staff .btn__default.__outer::before {
  position: absolute;
  right: .5rem;
  font-family: wol;
  font-size: 1.25rem;
  content: "";
}

.mCustomScrollBox {
  outline: 0;
}