@charset "UTF-8";
:root {
  --white:#fff;
  --dbs3-white:#FFFEF2;
  --dbs3-red:#EA3D3D;
  --dbs3-lightgreen:#DAE7CB;
  --bds3-black-01:#150F15;
  --dbs3-black-02:#1E151E;
  --tsukumin-D:'TsukuMinPr6N-D', serif;
  --tsukumin-B:'TsukuMinPr6N-B', serif;
  --gothic: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
}
.ntv-wrapper{
  background: url('../images/common/ptn-base.jpg'),repeat top left;
  background-size: 150px;
}
.sp-block {
  display: none;
}
.pc-block {
  display: block;
}
.ntv-main img {
  width: 100%;
  vertical-align: bottom;
  display: block;
}

/* btn */
.btn {
  position: relative;
  display: block;
  width: min(80vw, 300px);
  margin: 30px auto 0;
  padding: 22px 0;
  font-family: var(--tsukumin-D);
  font-size: 2rem;
  line-height: 100%;
  letter-spacing: 1.05px;
  text-align: center;
  background: url('../images/common/bg-btn.png') no-repeat left top #C01B1E;
  background-size: cover;
  transition: .3s ease-in-out;
  color: var(--dbs3-white);
}
.btn::after {
  position: absolute;
  content: '';
  top: 50%;
  right: 28px;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--dbs3-white);
  border-right: 2px solid var(--dbs3-white);
  transform: translate(0,-50%) rotate(45deg);
}
.btn:hover{
  background-color: #AA181B;
}
.btn:hover::after, .btn:hover span{
  filter:drop-shadow(0 0 10px rgba(255,254,242,.6));
}

/*==================================

 Layout

==================================*/
.teaser-main-mainImg{
  position: relative;
}
.teaser-main-mainImg::before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
.teaser-main-mainImg img {
  display: block;
  width: 100%;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -moz-touch-callout:none;
  -moz-user-select:none;
  user-select:none;
}
.teaser-main-onair{
  background-color: #000;
  color: #fff;
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 1px;
  font-weight: bold;
  padding: 10px;
}
.teaser-contents {
  box-sizing: border-box;
  font-size: 1.6rem;
}
/* ブロック */
.teaser-block{
  word-break: break-all;
}
.teaser-block-inner{
  padding:0;
}
/* ブロック内テキスト */
.teaser-block p{
  color: var(--dbs3-white);
  font-size: 1.6rem;
  line-height: 160%;
  letter-spacing: 1.05px;
}
/* h3
--------------------------------- */
.teaser-block-title{
  position: relative;
  display: block;
  width: 100%;
  background:no-repeat center left / contain;
}
/* ---------------------------------
 右カラム設定
--------------------------------- */
/* 右カラム　タイトル */
.ntv-box-title, .ntv-box-title.title-base, .drama-box-title.title-base {background: #372F2F;}

/* ---------------------------------
 メニュー（UNIT04タイプ）設定
--------------------------------- */
.teaser-main-nav {
  position: relative;
  margin: 30px 0 0;
  padding: 0 10px;
  z-index: 2;
}
.teaser-main-nav ul {
  display: flex;
  flex-flow: row wrap;
  gap: 10px;
  margin: 0 auto;
  width: 100%;
}
.teaser-main-nav ul li {
  position: relative;
  padding: 10px;
  vertical-align: top;
  border: 2px solid var(--dbs3-white);
}
@keyframes labelblink {
  0% {
    box-shadow: 0 0 12px #EA3D3D;
  }
  50% {
    box-shadow: 0 0 4px #EA3D3D;
  }
  100% {
    box-shadow: 0 0 12px #EA3D3D;
  }
}
.teaser-main-nav ul li .label {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  top: -14px;
  left: 50%;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 100%;
  background: var(--dbs3-red);
  border-radius: 4px;
  transform: translateX(-50%);
  z-index: 30;
  color: var(--white);
  white-space: nowrap;
  animation: labelblink 2s ease-in-out infinite;
}
.teaser-main-nav ul li a {
  text-indent: -9999px;
  display: block;
  margin: 0 auto;
  overflow: hidden;
  line-height: 0;
  font-size: 0;
  width: 100%;
  height: 83px;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.teaser-main-nav ul li.is-coming a {
  pointer-events: none;
  opacity: 0.6;
}
.teaser-main-nav ul li:nth-of-type(1) a {
  background-image: url("../images/nav/nav-intro.png");
}
.teaser-main-nav ul li:nth-of-type(2) a {
  background-image: url("../images/nav/nav-cast-head.png");
}
.teaser-main-nav ul li:nth-of-type(3) a {
  background-image: url("../images/nav/nav-cast.png");
}
.teaser-main-nav ul li:nth-of-type(4) a {
  background-image: url("../images/nav/nav-topics.png");
}

.teaser-main-nav ul li:hover{
  background: url('../images/common/bg-noise.gif') repeat left top;
  background-size: 150px;
}
.teaser-main-nav ul li:hover a {
  filter:drop-shadow(0 0 10px rgba(255,254,242,.9));
}

/* row-4（4列） */
.teaser-main-nav ul.row-4 li {
  width: calc((100% - 30px) / 4);
}
/* row-3（3列） */
.teaser-main-nav ul.row-3 li {
  width: calc((100% - 10px) / 3);
}

/* ---------------------------------
 SNS
--------------------------------- */
.teaser-topsns{
  padding: 10px 22px 0;
}
.teaser-topsns .teaser-topsns-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.teaser-topsns .teaser-topsns-list li{
  margin-left: 10px;
  line-height: 1;
}
.teaser-topsns  .teaser-topsns-list li:first-child{
  margin-left: 0px;
}
.teaser-topsns .teaser-topsns-list li a{
  display: block;
  padding: 17px;
  width: 200px;
  background: var(--dbs3-black-02);
  border: 1px solid rgba(255,254,242,.3);
  border-radius: 56px;
  transition: opacity .3s ease-in-out;
}
.teaser-topsns .teaser-topsns-list li a span{
  display: flex;
  justify-content: center;
  align-items: center;
}
.teaser-topsns .teaser-topsns-list li a span .topsns-icn{
  margin-right: 5px;
  width: 22px;
  height: 22px;
}
.teaser-topsns .teaser-topsns-list li a.topsns-x span .topsns-kana{
  width: 100%;
  aspect-ratio: 47 / 7;
  max-width: 94px;
}
.teaser-topsns .teaser-topsns-list li a.topsns-ig span .topsns-kana{
  width: 100%;
  aspect-ratio: 135 / 16;
  max-width: 135px;
}
.teaser-topsns .teaser-topsns-list li a.topsns-tt span .topsns-kana{
  width: 100%;
  aspect-ratio: 8 / 1;
  max-width: 128px;
}
.teaser-topsns .teaser-topsns-list li a:hover{
  opacity: .7;
}

/* ---------------------------------
 NEWS
--------------------------------- */
#news.teaser-block{
  padding: 100px 0 120px;
}
#news .teaser-block-inner{
  position: relative;
}
#news .teaser-block-title{
  position: absolute;
  content: '';
  top: -20px;
  right: 0;
  max-width: 130px;
  aspect-ratio: 65 / 152;
  background-image: url('../images/ttl/ttl-news.png');
  z-index: 2;
}
#news .news-list {
  margin-right: 110px;
}
#news .news-list .news-slide {
  margin: 0 10px 0 0;
}
#news .news-list .news-item {
  padding: 15px;
  margin-bottom: 15px;
  background: rgba(69,57,82,.4);
}
#news .news-list .news-item:last-child {
  margin-bottom: 0;
}
#news .news-list .news-item:hover{
  opacity: .7;
}
#news .news-list a {
  display: flex;
}
#news .news-list .news-item-img {
  width: 130px;
  display: inline-block;
}
#news .news-list .news-item-text {
  margin-left: 15px;
  flex: 1;
}
#news .news-list .news-item-text .news-item-text-date {
  margin-bottom: 5px;
  font-size: 1.2rem;
}
#news .news-list .news-item-text .news-item-text-date span {
  display: inline-block;
  line-height: 20px;
  margin-right: 5px;
  padding: 0 5px;
}
#news .news-list .news-item-text .news-item-text-date .category {
  display: inline-block;
  min-width: 75px;
  margin-right: 8px;
  line-height: 20px;
  color: var(--dbs3-lightgreen);
  text-align: center;
  background: var(--dbs3-red);
}
#news .news-list .news-item-text .news-item-text-title {
  margin-bottom: 0;
  font-size: 1.4rem;
  line-height: 180%;
  letter-spacing: normal;
}
#news .slick-dots button {
  display: none;
}
#news .slick-dots {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
#news .slick-dots li {
  width: 8px;
  height: 8px;
  background-color: #4D5148;
  border-radius: 50%;
  margin: 0 4px;
  cursor: pointer;
}
#news .slick-dots li.slick-active {
  background-color: var(--dbs3-red);
}
#news .news-list .slick-arrow {
  position: absolute;
  top: 50%;
  width: 30px;
  height: 30px;
  height: 100%;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  border: none;
  background-image: url(../images/slick-arrow.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
  z-index: 1;
  transform: translateY(-50%);
  border-radius: 50%;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  display: none !important;
}
#news .news-list .slick-prev {
  height: 30px;
  left: 0;
  transform: translateY(-50%) rotate(180deg);
  box-shadow: 0px -4px 4px 0px rgba(0, 0, 0, 0.25);
}
#news .news-list .slick-next {
  height: 30px;
  right: 0;
}
#news .news-list .slick-disabled {
  display: none !important;
}

/* ---------------------------------
 動画
--------------------------------- */
#movie.teaser-block{
  padding: 0 0 100px;
}
#movie .movie-container{
  position: relative;
  padding: 30px 20px 20px;
  background: url('../images/common/ptn-red-01.png') left top;
  background-size: 180px;
}
#movie .movie-aooni{
  position: absolute;
  content: '';
  display: block;
  top: -60px;
  right: 20px;
  width: 100%;
  max-width: 120px;
  aspect-ratio: 60 / 91;
  background: url('../images/common/img-aooni.png') no-repeat top left / cover;
}
#movie .teaser-block-title{
  margin-bottom: 20px;
  max-width: 309px;
  aspect-ratio: 103 / 30;
  background-image: url('../images/ttl/ttl-movie.png');
}
.teaser-contents .movie-player{
  position: relative;
  margin: 0 auto;
  padding-top: 56.25%;
  width: 100%;
  border: 1px solid var(--dbs3-red);
}
.teaser-contents .movie-player iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#movie .movie-sub {
  position: relative;
  margin: 10px 20px 0;
}
#movie .movie-sub .slick-list {
  width: 100%;
}
#movie .movie-sub .slick-slide {
  margin: 0 5px;
  cursor: pointer;
  padding: 10px 0;
}
#movie .movie-sub .slick-slide:hover{
  opacity: .8;
}
#movie .movie-sub .new {
  position: absolute;
  top: 1px;
  left: 5px;
  z-index: 2;
  display: block;
  width: 50px;
}
#movie .movie-sub .new span {
  display: block;
  padding-top: 60.9756097561%;
  content: "";
  background-image: url(../images/icon_new.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
#movie .movie-sub .movie-thumbnail {
  position: relative;
  display: block;
  width: 100%;
  padding-top: 56.25%;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#movie .movie-sub .movie-thumbnail::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/movie-icon-play.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20%;
  content: "";
}
#movie .movie-sub .text-box {
  padding: 10px 0 0;
}
#movie .movie-sub .item-title {
  font-size: 1.6rem;
  line-height: 150%;
  color: var(--dbs3-white);
}
#movie .movie-sub .date {
  font-size: 1.2rem;
  line-height: 150%;
  color: var(--dbs3-lightgreen);
}
#movie .movie-sub .slick-arrow {
  position: absolute;
  top: 45%;
  width: 32px;
  height: 100%;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  border: none;
  background-image: url(../images/btn-slider.png);
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
  z-index: 1;
  transform: translateY(-50%);
}
#movie .movie-sub .slick-prev {
  left: -20px;
  transform: rotate(180deg);
  top: -5%;
}
#movie .movie-sub .slick-next {
  right: -20px;
}
#movie .movie-sub .slick-disabled {
  display: none !important;
}

/* ---------------------------------
 INTRO
--------------------------------- */
#intro.teaser-block{
  padding: 0 0 100px;
}
#intro .intro-container{
  position: relative;
  padding: 30px 30px 50px;
  background: url('../images/intro/bg-intro.png') left top;
  background-size: 112px;
  border: 2px solid #382449;
}
#intro .teaser-block-title{
  position: absolute;
  max-width: 130px;
  aspect-ratio: 65 / 77;
  right: 30px;
  background-image: url('../images/ttl/ttl-intro.png');
}
#intro .intro-text{
  position: relative;
  margin: 0 auto;
  width: 100%;
  max-width: 604px;
  z-index: 2;
}
#intro .intro-text p{
  margin: 0 auto;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  text-indent: -9999px;
  white-space: nowrap;
  background: url('../images/intro/intro-txt-pc.png') no-repeat top center;
  background-size: contain;
  aspect-ratio: 604 / 805;
}
/* ---------------------------------
 シリーズ作品・関連作品
--------------------------------- */
#dbs-series.teaser-block{
  margin-bottom: 100px;
  background: rgba(18,15,21,.6);
}
.dbs-series-container{
  display: block;
  margin: 0 auto;
  padding: 30px 20px;
}
#dbs-series .teaser-block-subtitle{
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
#dbs-series .teaser-block-subtitle::before,
#dbs-series .teaser-block-subtitle::after{
  content: '';
  flex-grow: 1;
  height: 1px;
  background: url('../images/ttl/ttl-border.png') repeat-x top left;
  background-size: 65px 1px;
}
#dbs-series .teaser-block-subtitle span{
  position: relative;
  display: block;
  width: 100%;
  max-width: 294px;
  aspect-ratio: 147 / 22;
  background: url('../images/ttl/ttl-sub-series.png') no-repeat center top / cover;
}
#dbs-series .teaser-block-subtitle::before{
  margin-right: 10px;
}
#dbs-series .teaser-block-subtitle::after{
  margin-left: 10px;
}
#dbs-series .banner-list{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
#dbs-series .banner-list-item{
  width: 100%;
  max-width: 307px;
  aspect-ratio: 50 / 13;
}
#dbs-series .banner-list-item:first-child{
  margin-right: 10px;
}
#dbs-series .banner-list-item:last-child{
  margin-top: 10px;
}
#dbs-series .banner-list-item a{
  position: relative;
  transition: .3s ease-in-out;
}
#dbs-series .banner-list-item a:hover{
  opacity: 0.7;
}
#dbs-series .banner-list-item a::before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
#dbs-series .banner-list-item a img{
  -webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
	user-select:none;
}
/* 追加項目 */
#dbs-series .related-banner-list{
  padding-top: 30px;
}

#dbs-series .related-banner-list a{
  position: relative;
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 307px;
  aspect-ratio: 67 / 16;
  transition: .3s ease-in-out;
}
#dbs-series .related-banner-list a:hover{
  opacity: 0.7;
}
#dbs-series .related-banner-list a::before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
#dbs-series .related-banner-list a img{
  -webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
	user-select:none;
}

/* ---------------------------------
 CAST-HEAD
--------------------------------- */
#cast-head.teaser-block{
  padding: 0 0 100px;
}
#cast-head .teaser-block-title{
  margin: 0 auto 50px;
  max-width: 595px;
  aspect-ratio: 119 / 18;
  background-image: url('../images/ttl/ttl-cast-head.png');
}
#cast-head .cast-head-list dl{
  margin-top: 80px;
}
#cast-head .cast-head-list dl:first-child{
  margin-top: 0;
}
#cast-head .cast-head-list dt{
  display: flex;
  align-items: center;
  padding-left: 60px;
}
#cast-head .cast-head-list dt .img-fliter{
  position: relative;
  width: 100%;
  max-width: 280px;
  aspect-ratio: 28 / 33;
}
#cast-head .cast-head-list dt .img-fliter::before{
  content: '';
  position: absolute;
  width: 100%;
  width: 100%;
  display: block;
  top: 0;
  left: 0;
}
#cast-head .cast-head-list dt .img-fliter .img{
  display: block;
  width: 100%;
  aspect-ratio: 28 / 33;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -moz-touch-callout:none;
  -moz-user-select:none;
  user-select:none;
  background: no-repeat center left #ccc;
  background-size: cover;
}
#cast-head .cast-head-list dt .img-fliter .img.cast-01{
  background-image: url('../images/cast-head/img-cast-sakurai.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-02{
  background-image: url('../images/cast-head/img-cast-01.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-03{
  background-image: url('../images/cast-head/img-cast-02.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-04{
  background-image: url('../images/cast-head/img-cast-03.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-05{
  background-image: url('../images/cast-head/img-cast-04.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-06{
  background-image: url('../images/cast-head/img-cast-05.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-07{
  background-image: url('../images/cast-head/img-cast-06.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-08{
  background-image: url('../images/cast-head/img-cast-07.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-09{
  background-image: url('../images/cast-head/img-cast-08.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-10{
  background-image: url('../images/cast-head/img-cast-09.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-11{
  background-image: url('../images/cast-head/img-cast-10.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-12{
  background-image: url('../images/cast-head/img-cast-11.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-13{
  background-image: url('../images/cast-head/img-cast-12.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-14{
  background-image: url('../images/cast-head/img-cast-13.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-15{
  background-image: url('../images/cast-head/img-cast-14.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-16{
  background-image: url('../images/cast-head/img-cast-15.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-17{
  background-image: url('../images/cast-head/img-cast-16.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-18{
  background-image: url('../images/cast-head/img-cast-17.jpg');
}
#cast-head .cast-head-list dt .img-fliter .img.cast-19{
  background-image: url('../images/cast-head/img-cast-18.jpg');
}

#cast-head .cast-head-list dt .txt{
  padding-left: 60px;
  font-size: 2.4rem;
  line-height: 100%;
  letter-spacing: 1.05px;
  font-family: var(--tsukumin-B);
  color: var(--dbs3-red);
}
#cast-head .cast-head-list dt .txt .age{
  font-size: 1.8rem;
}
#cast-head .cast-head-list dt .txt .name{
  display: block;
  padding-top: 12px;
  font-size: 4.2rem;
  line-height: 100%;
  color: var(--dbs3-white);
}
#cast-head .cast-head-list dt .txt .name .group{
  display: block;
  font-size: 1.3rem;
}
#cast-head .cast-head-list dt .txt .name .group.pl10{
  padding-left: 10px;
}
#cast-head .cast-head-list dd{
  padding-top: 30px;
}
#cast-head .cast-head-list dd p{
  font-size: 1.8rem;
}
#cast-head .cast-head-list dd p .position {
  font-weight: bold;
  color: #9747FF;
}

/* ---------------------------------
 CAST
--------------------------------- */
#cast.teaser-block{
  padding: 27px 0 100px;
}
#cast .cast-container{
  position: relative;
  padding: 180px 20px 60px;
  background: url('../images/common/ptn-red-02.png') left top;
  background-size: 180px;
}
#cast .teaser-block-title{
  position: absolute;
  content: '';
  top: -27px;
  left: 50%;
  transform: translateX(-50%);
  max-width: 130px;
  aspect-ratio: 65 / 79;
  background-image: url('../images/ttl/ttl-cast.png');
  z-index: 2;
}
#cast .cast-list{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
#cast .cast-list li{
  display: block;
  margin-bottom: 24px;
  width: 100%;
  font-family: var(--tsukumin-B);
  font-size: 2.4rem;
  line-height: 100%;
  letter-spacing: 1.05px;
  text-align: center;
  color: var(--dbs3-white);
}
#cast .cast-list li:last-child{
  margin-bottom: 0;
}
#cast .cast-list li.w50{
  display: flex;
  justify-content: center;
}
#cast .cast-list li.w50 .item{
  padding-left: 40px;
}
#cast .cast-list li.w50 .item:first-child{
  padding-left: 0;
}
#cast .cast-list li span{
  display: block;
  font-size: 1.3rem;
}
/* 妖追加 */
#cast .cast-list li .ayakashi{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
#cast .cast-list li .ayakashi img{
  max-width: 180px;
  aspect-ratio: 10 / 3;
}
#cast .cast-list li .ayakashi > div{
  margin-bottom: 10px;
}
#cast .cast-list li .ayakashi > div:last-child{
  margin-bottom: 0;
}
#cast .cast-list li .ayakashi .col2{
  display: flex;
  justify-content: center;
  align-items: center;
}
#cast .cast-list li .ayakashi .col2 img:first-child{
  margin-right: 10px;
}

/* ---------------------------------
 STAFF
--------------------------------- */
#staff.teaser-block{
  padding: 0 0 100px;
}
#staff .staff-container{
  display: flex;
  align-items: flex-start;
}
#staff .teaser-block-title{
  margin-right: 43px;
  max-width: 137px;
  aspect-ratio: 65 / 79;
  background-image: url('../images/ttl/ttl-staff.png');
}
#staff .staff-list{
  padding: 50px 0 0;
  width: 100%;
}
#staff .staff-list li{
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 40px;
  margin-bottom: 20px;
}
#staff .staff-list li:last-child{
  margin-bottom: 0;
}
#staff .staff-list li span {
  font-family: var(--tsukumin-B);
  font-size: 1.8rem;
  line-height: 200%;
  letter-spacing: 1.05px;
  text-align: right;
  color: var(--dbs3-red);
}
#staff .staff-list li span + span{
  font-size: 2.2rem;
  line-height: 160%;
  text-align: left;
  color: var(--dbs3-white);
}
#staff .staff-list li span span{
  display: inline-block;
  font-size: 1.6rem;
  color: var(--dbs3-white);
}
/* ---------------------------------
 ティザーTOPICS一覧用
--------------------------------- */
#topics-area.teaser-block{
  padding: 0 0 100px;
}
#topics-area .teaser-block-title{
  margin: 0 auto 30px;
  max-width: 567px;
  aspect-ratio: 63 / 10;
  background-image: url('../images/ttl/ttl-topics.png');
}
#topics-area .drama-box-body{
  background: transparent;
}
#topics .topics-item{
  overflow: hidden;
}
#topics .topics-item,
#topics .topics-item:not(:first-child){
  background: var(--bds3-black-01);
  color: var(--dbs3-white);
  border-color: #5B5757;
}
#topics .topics-pickup{
  background: var(--bds3-black-01);
}
#topics .topics-data,
#topics .topics-pickup-text,
#topics .topics-pickup-data .genre,
#topics .topics-pickup-data .date{
  color: var(--dbs3-white) !important;
}
#topics .topics-item > a:hover{
  opacity: .7;
}
#topics .topics-text{
  margin-top: 20px !important;
  font-size: 1.6rem !important;
  line-height: 140% !important;
}
#topics .topics-data{
  margin-bottom: 20px !important;
}
/* ティザーTOPICS一覧用 */
#topics.drama-area{
  padding: 0;
  margin: 0;
}
#topics .drama-box-title{display: none;}
/* ボタン */
#topics .drama-btn.btn-more {
  position: relative;
  display: block;
  width: min(80vw, 300px);
  margin: 30px auto 0;
  padding: 22px 0;
  font-family: var(--tsukumin-D);
  font-size: 2rem;
  line-height: 100%;
  letter-spacing: 1.05px;
  text-align: center;
  background: url('../images/common/bg-btn.png') no-repeat left top #C01B1E;
  background-size: cover;
  transition: .3s ease-in-out;
  color: var(--dbs3-white);
}
#topics .drama-btn.btn-more::after {
  position: absolute;
  content: '';
  top: 50%;
  right: 28px;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--dbs3-white);
  border-right: 2px solid var(--dbs3-white);
  transform: translate(0,-50%) rotate(45deg);
}
#topics .drama-btn.btn-more:hover{
  background-color: #AA181B;
  text-shadow: 0 0 10px rgba(255,254,242,.6);
  cursor: pointer;
}
#topics .drama-btn.btn-more:hover::after{
  filter:drop-shadow(0 0 10px rgba(255,254,242,.6));
}
#topics .drama-btn.btn-more i {
  display: none;
}
/* リスト */
@media screen and (min-width: 993px) {
  #topics .topics-item {
    width: 48.495%;
  }
  #topics .topics-item:nth-of-type(n+3) {
    margin-top: 20px;
  }
  #topics .topics-item:nth-of-type(2n+1) {
    margin-left: 0;
  }
  #topics .topics-item:nth-of-type(2n) {
    margin-left: 3.013%;
  }
}
/* ---------------------------------
 SNS
--------------------------------- */
#sns-area.teaser-block{
  padding: 58px 0 120px;
}
#sns-area .sns-container{
  position: relative;
  padding: 98px 20px 40px;
  background: url('../images/common/bg-wave.jpg') no-repeat left top;
  background-size: cover;
}
#sns-area .teaser-block-title{
  position: absolute;
  content: '';
  top: -58px;
  left: 50%;
  transform: translateX(-50%);
  max-width: 130px;
  aspect-ratio: 26 / 31;
  background-image: url('../images/ttl/ttl-sns.png');
  z-index: 2;
}
#sns-area .sns-area-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 40px;
}
#sns-area .sns-area-list li{
  line-height: 1;
  width: min(80vw, 240px);
}
#sns-area .sns-area-list li:first-child{
  margin-right: 15px;
}
#sns-area .sns-area-list li:last-child{
  margin-top: 15px;
}
#sns-area .sns-area-list li a{
  display: block;
  padding: 17px;
  background: var(--dbs3-black-02);
  border: 1px solid rgba(255,254,242,.3);
  border-radius: 62px;
  transition: .3s ease-in-out;
}
#sns-area .sns-area-list li a span{
  display: flex;
  justify-content: center;
  align-items: center;
}
#sns-area .sns-area-list li a span .sns-icn{
  margin-right: 5px;
  width: 28px;
  height: 28px;
}
#sns-area .sns-area-list li a.sns-x span .sns-kana{
  width: 121px;
  height: 18px;
}
#sns-area .sns-area-list li a.sns-ig span .sns-kana{
  width: 152px;
  height: 18px;
}
#sns-area .sns-area-list li a.sns-tt span .sns-kana{
  width: 144px;
  height: 18px;
}
#sns-area .sns-area-list li a:hover{
  opacity: .75;
}

/*==================================

 MEDIA QUERY

==================================*/
@media screen and (max-width: 992px) {
  /* ---------------------------------
     Layout
  --------------------------------- */
  .ntv-wrapper{
    background-size: 90px;
  }
  .sp-block {
    display: block;
  }
  .pc-block {
    display: none;
  }
  .btn {
    margin-top: 20px;
    max-width: 260px;
    font-size: 1.6rem;
  }
  .teaser-block-inner{
    margin: 0 auto;
    width: min(92%, 660px);
  }
  /* ---------------------------------
     nav
  --------------------------------- */
  .teaser-main-nav{
    padding: 0;
    max-width: min(92%, 660px);
    margin: 20px auto 0;
  }
  .teaser-main-nav ul{
    gap: 5px;
  }
  .teaser-main-nav ul li{
    padding: 14px 5px;
    border-width: 1px;
  }
  .teaser-main-nav ul li a{
    height: 73px;
  }
  .teaser-main-nav ul li .label{
    padding: 0 6px;
    top: -10px;
    font-size: 1rem;
    line-height: 160%;
  }
  .teaser-main-nav ul.row-4 li {
    width: calc((100% - 15px) / 4);
  }
  /* topsns */
  .teaser-topsns{
    padding: 10px 15px 0;
  }
  .teaser-topsns .teaser-topsns-list{
    flex-wrap: nowrap;
    margin: 0 auto;
    padding: 0;
    max-width: 660px;
  }
  .teaser-topsns .teaser-topsns-list li{
    margin-left: 5px;
    width: 32.5%;
  }
  .teaser-topsns .teaser-topsns-list li a{
    padding: 8px 0 10px;
    width: 100%;
    min-width: 112px;
  }
  .teaser-topsns .teaser-topsns-list li a span{
    flex-direction: column;
  }
  .teaser-topsns .teaser-topsns-list li a span .topsns-icn{
    margin-right: 0;
    margin-bottom: 3px;
    width: 18px;
    height: 18px;
  }
  .teaser-topsns .teaser-topsns-list li a.topsns-x span .topsns-kana{
    max-width: 67.14px;
  }
  .teaser-topsns .teaser-topsns-list li a.topsns-ig span .topsns-kana{
    max-width: 84.38px;
  }
  .teaser-topsns .teaser-topsns-list li a.topsns-tt span .topsns-kana{
    max-width: 80px;
  }
  /* news */
  #news.teaser-block{
    padding: 60px 0 75px;
  }
  #news .teaser-block-title{
    right: -5px;
    max-width: 70px;
  }
  #news .news-list{
    margin-right: 45px;
  }
  #news .news-list .news-item{
    padding: 10px;
    margin-bottom: 10px;
  }
  #news .news-list .news-item-img{
    width: 110px;
  }
  #news .news-list .news-item-text{
    margin-left:10px;
  }
  #news .news-list .news-item-text .news-item-text-date{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom:0;
    line-height: 140%;
  }
  #news .news-list .news-item-text .news-item-text-date .category{
    margin-right: 0;
    margin-bottom: 5px;
    font-weight: bold;
  }
  #news .news-list .news-item-text .news-item-text-title{
    font-size: 1.3rem;
  }
  /* movie */
  #movie.teaser-block{
    padding: 0 0 44px;
  }
  #movie .movie-container{
    padding: 30px 15px 15px;
  }
  #movie .movie-aooni{
    top: -47px;
    right: 10px;
    max-width: 85px;
  }
  #movie .teaser-block-title{
    margin-bottom: 10px;
    max-width: 179px;
  }
  #movie .movie-sub{
    margin: 0;
  }
  #movie .movie-sub .text-box{
    padding: 5px 0 0;
  }
  #movie .movie-sub .item-title{
    font-size: 1.2rem;
    font-weight: bold;
  }
  #movie .movie-sub .date{
    font-size: 0.9rem;
  }
  /* intro */
  #intro.teaser-block{
    padding: 41px 0 70px;
  }
  #intro .teaser-block-title{
    max-width: 85px;
    top: -41px;
    right: 13px;
  }
  /* SERISE */
  #dbs-series.teaser-block{
    margin-bottom: 70px;
  }
  .dbs-series-container{
    padding: 30px;
  }
  #dbs-series .teaser-block-subtitle{
    margin: 0 auto 15px;
    max-width: 660px;
  }
  #dbs-series .teaser-block-subtitle span{
    max-width: 213px;
  }
  #dbs-series .banner-list{
    margin: 0 auto;
    max-width: 660px;
  }
  /* CAST-HEAD */
  #cast-head.teaser-block{
    padding: 0 0 70px;
  }
  #cast-head .teaser-block-title{
    margin-bottom: 20px;
    max-width: 330px;
  }
  #cast-head .cast-head-list dl{
    margin-top: 50px;
  }
  #cast-head .cast-head-list dt{
    flex-direction: column;
    padding: 0;
  }
  #cast-head .cast-head-list dt .img-fliter{
    max-width: min(57.97%, 260px);
  }
  #cast-head .cast-head-list dt .txt{
    padding-top: 15px;
    padding-left: 0;
    font-size: 1.8rem;
    text-align: center;
  }
  #cast-head .cast-head-list dt .txt .age{
    font-size: 1.4rem;
  }
  #cast-head .cast-head-list dt .txt .name{
    padding-top: 10px;
    font-size: 3.2rem;
    text-align: center;
  }
  #cast-head .cast-head-list dt .txt .name .group{
    text-align: center;
  }
  #cast-head .cast-head-list dt .txt .name .group.pl10{
    padding-left: 0;
  }
  #cast-head .cast-head-list dd{
    padding-top: 20px;
  }
  #cast-head .cast-head-list dd p{
    font-size: 1.4rem;
  }
  /* cast */
  #cast.teaser-block{
    padding: 15px 0 70px;
  }
  #cast .cast-container{
    padding: 115px 15px 30px;
  }
  #cast .teaser-block-title{
    top: -15px;
    max-width: 82px;
  }
  #cast .cast-list li{
    margin-bottom: 20px;
    font-size: 1.6rem;
  }
  #cast .cast-list li.fs-l{
    font-size: 1.8rem;
  }
  #cast .cast-list li.w50 .item{
    padding-left: 10px;
  }
  #cast .cast-list li span{
    font-size: 1rem;
    letter-spacing: -1px;
  }
  #cast .cast-list li .ayakashi img{
    max-width: 100px;
  }
  /* staff */
  #staff.teaser-block{
    padding: 0 0 70px;
  }
  #staff .teaser-block-title{
    margin-right: 30px;
    margin-left: 15px;
    max-width: 82px;
  }
  #staff .staff-list{
    padding: 20px 0 0;
  }
  #staff .staff-list li span{
    font-size: 1.3rem;
  }
  #staff .staff-list li span + span{
    font-size: 1.8rem;
  }
  #staff .staff-list li span span{
    font-size: 1.3rem;
  }
  /* topics */
  #topics-area.teaser-block{
    padding: 0 0 50px;
  }
  #topics-area .teaser-block-title{
    margin: 0 auto 20px;
    max-width: 315px;
  }
  #topics .topics-pickup-data .genre{
    background-color: var(--dbs3-red);
  }
  #topics .topics-item, #topics .topics-item:not(:first-child){
    border-top: 1px solid #2C272C;
  }
  #topics .topics-item:first-child{
    border-color: transparent;
  }
  #topics .topics-text{
    margin-top: 0 !important;
    font-size: 1.4rem !important;
  }
  #topics .topics-data{
    margin-bottom: 0 !important;
  }
  #topics .drama-btn.btn-more{
    margin-top: 20px;
    max-width: 260px;
    font-size: 1.6rem;
  }
  /* sns-area */
  #sns-area.teaser-block{
    padding: 35px 0 100px;
  }
  #sns-area .sns-container{
    padding: 65px 15px 30px;
  }
  #sns-area .teaser-block-title{
    top: -35px;
    max-width: 84px;
  }
  #sns-area .sns-area-list{
    padding-top: 30px;
  }
  #sns-area .sns-area-list li:first-child{
    margin-right: 8px;
  }
  #sns-area .sns-area-list li:last-child{
    margin-top: 10px;
  }
  #sns-area .sns-area-list li a{
    padding: 12px;
  }
  #sns-area .sns-area-list li a span .sns-icn{
    width: 18px;
    height: 18px;
  }
  #sns-area .sns-area-list li a.sns-x span .sns-kana{
    width: 80.57px;
    height: 12px;
  }
  #sns-area .sns-area-list li a.sns-ig span .sns-kana{
    width: 101.25px;
    height: 12px;
  }
  #sns-area .sns-area-list li a.sns-tt span .sns-kana{
    width: 96px;
    height: 12px;
  }
}
@media screen and (max-width: 720px) {
  /* intro */
  #intro .intro-container{
    padding: 60px 13px 30px;
  }
  /* dbs-series */
  #dbs-series .banner-list{
    flex-direction: column;
    flex-wrap: nowrap;
  }
  #dbs-series .banner-list-item{
    margin-top: 10px;
    max-width: 100%;
  }
  #dbs-series .banner-list-item:first-child{
    margin: 0;
  }
  #dbs-series .banner-list-item:last-child{
    margin-top: 10px;
  }
  #dbs-series .related-banner-list{
    padding: 20px 30px 0;
  }
  #dbs-series .related-banner-list a{
    max-width: 100%;
  }
  #cast .cast-list li .ayakashi > div{
    margin-bottom: 5px;
  }
  #cast .cast-list li .ayakashi .col2 img:first-child{
    margin-right: 5px;
  }
  /* staff */
  #staff .staff-list{
    padding-left: 0;
    padding-left: 10vw;
  }
  #staff .staff-list li{
    grid-template-columns: 1fr;
    gap: 0;
    margin-bottom: 10px;
  }
  #staff .staff-list li span{
    text-align: left;
  }
  /* sns-area */
  #sns-area .sns-area-list li{
    width: 45%;
  }
}
@media screen and (max-width: 601px) {
  #movie .movie-sub .slick-arrow {
    top: 35%;
    width: 28px;
  }
  #movie .movie-sub .slick-prev{
    top: -20px;
  }
  #cast .cast-list li.fs-s{
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 430px) {
  /* intro */
  #intro .intro-text p{
    max-width: 315px;
    background-image: url('../images/intro/intro-txt-sp.png');
    aspect-ratio: 315 / 452;
  }
  #dbs-series .related-banner-list{
    padding: 20px 0 0;
  }
  #dbs-series .related-banner-list a{
    max-width: 76vw;
  }
  #staff .staff-list{
    padding-left: 0;
  }
  /* sns-area */
  #sns-area .sns-area-list li{
    max-width: 153px;
    width: calc((100% - 8px) / 2);
  }
}
@media screen and (max-width: 390px) {
    #cast .cast-list li{
    margin-bottom: 15px;
    /*font-size: calc(1.8rem + ((1vw - 0.375rem) * 13.3333));*/
  }
}
/* ---------------------------------
 関連バナー
--------------------------------- */
#sect-related.teaser-block{
  padding-bottom: 100px;
}
#sect-related.teaser-block .related-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 30px;
}
#sect-related.teaser-block .related-list li{
  width: 100%;
  line-height: 1;
  margin-bottom: 10px;
}
#sect-related.teaser-block .related-list:last-child{
  margin-bottom: 0;
}
#sect-related.teaser-block .related-list li img{
  width: 100%;
}

@media screen and (min-width : 601px){
  #sect-related.teaser-block .related-list{
    padding: 0;
  }
  #sect-related.teaser-block .related-list li::nth-child(2n){
    margin-left: 10px;
  }
  #sect-related.teaser-block .related-list li{
    width: calc(50% - 5px);
  }
}