@charset "UTF-8";
/* カラー */
/* フォント */
.altTxt {
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
  font-size: 0px;
}

[data-scroll] {
  opacity: 0;
  -webkit-transition: opacity 1.0s ease, -webkit-transform 1.0s ease;
  transition: opacity 1.0s ease, -webkit-transform 1.0s ease;
  transition: transform 1.0s ease, opacity 1.0s ease;
  transition: transform 1.0s ease, opacity 1.0s ease, -webkit-transform 1.0s ease;
}

[data-scroll].anime-left {
  -webkit-transform: translate(-50px, 0);
          transform: translate(-50px, 0);
}

[data-scroll].anime-right {
  -webkit-transform: translate(50px, 0);
          transform: translate(50px, 0);
}

[data-scroll].anime-top {
  -webkit-transform: translate(0, 50px);
          transform: translate(0, 50px);
}

[data-scroll].anime-bottom {
  -webkit-transform: translate(0, -50px);
          transform: translate(0, -50px);
}

[data-scroll="in"] {
  opacity: 1.0;
}

[data-scroll="in"].anime-left {
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

[data-scroll="in"].anime-right {
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

[data-scroll="in"].anime-top {
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

[data-scroll="in"].anime-bottom {
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

/*
 topics.css（ファイル名変更不可）
 本サイト記事ページ用CSS（記事ページのみ読み込まれる）
*/
.drama-contentsBox {
  margin: 0 auto;
  background-image: url(../images/common/bg_gray.png);
}

.drama-contentsBox-inner {
  padding: 30px 0;
  background-image: url(../images/common/topics_en.png);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: right top;
}

@media (max-width: 992px) {
  .drama-contentsBox-inner {
    padding: 10px 0;
    background-size: auto 50%;
  }
}

@media (max-width: 600px) {
  .drama-contentsBox-inner {
    padding: 10px 0;
    background-size: auto 500px;
  }
}

.drama-main .drama-box-title > span.title-01 {
  background-image: url(../images/common/topics_tit.png);
  background-position: center;
  height: 77px;
  margin-bottom: 40px;
}

@media (max-width: 600px) {
  .drama-main .drama-box-title > span.title-01 {
    height: 40px;
    background-size: auto 100%;
    margin-bottom: 25px;
  }
}

#topics {
  background-image: url(../images/common/topics_line.png);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: auto;
}

@media (max-width: 992px) {
  #topics {
    background-position: left 220px;
    background-size: 50%;
  }
}

#topics .drama-box-title {
  padding: 0;
}

@media (max-width: 992px) {
  #topics .topics-box-body {
    padding: 0 10px;
  }
}

body.second .drama-main .drama-box-body {
  border: none;
}

#popin {
  display: none;
}