@charset "UTF-8";
/*
 各ページ.css（ファイル名変更可）
 本サイト各ページ用CSS
*/


#music .d-box-title {
  max-width: 450px;
  width: 100%;
  height: 60px;
  background-image: url(../images/music/title_music.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  font-size: 0;
  margin: 0 auto 55px;
}

.music-area {
  margin-bottom: 80px;
}

.music-area:last-child {
  margin-bottom: 0px;
}

.music-subtitle-main {
  background-image: url(../images/music/subtitle_main.png);
}

.music-subtitle-ost {
  background-image: url(../images/music/subtitle_ost.png);
}

[class*="music-subtitle-"] {
  width: calc(100% - 140px);
  height: 29px;
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  margin: 0 auto 85px;
  font-size: 0;
}

[class*="music-subtitle-"]::before {
  content: "";
  width: 100%;
  height: 3px;
  position: absolute;
  bottom: -20px;
  background-color: #fff;
}

[class*="music-title-"] {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin: 0 auto 60px;
  font-size: 0;
}

.music-title-song {
  width: 162px;
  height: 78px;
  background-image: url(../images/music/songtitle.png);
}

.music-title-ost{
  height: 120px;
  width: 414px;
  background-image: url(../images/music/osttitle.png);
}

[class*="music-image-"] {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
}

.music-image-main {
  padding-top: 63.23%;
  width: calc(100% - 50px);
  margin: 0 auto;
  background-image: url(../images/music/music_img.png);
}

.music-image-ost {
  padding-top: 61.8%;
  max-width: 596px;
  margin: 0 auto;
  background-image: url(../images/music/music_ost.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.music-text-ost {
  text-align: center;
  color: #fff;
  font-size: 16px;
}

.music-text-ost span {
  font-size: 26px;
}

.music-8bitchara {
  height: 83px;
  width: 476px;
  margin: 0 auto 30px;
  background-image: url(../images/music/music_8bit.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}


/* trailer-movie
------------------------------ */
.trailer-movie {
  width: 90%;
  max-width: 600px;
  margin: 0 auto 30px;
  position: relative;
}

.trailer-movie-data {
  padding-top: 56%;
  position: relative;
}

.trailer-movie-data iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}



/* ---------------------------------
 SP用
--------------------------------- */
@media only screen and (max-width: 600px) {
  .music-area {
    margin-bottom: 40px;
  }

  #music .d-box-title {
    width: auto;
    height: auto;
    padding-top: 8.5%;
    margin-bottom: 10.035%;
  }


  [class*="music-subtitle-"] {
    width: 89.657%;
    height: auto;
    padding-top: 5%;
    margin-bottom: 14.657%;
  }

  .music-title-song {
    width: auto;
    height: auto;
    padding-top: 13%;
    margin-bottom: 10.345%;
  }

  .music-title-ost{
    width: auto;
    height: auto;
    padding-top: 20.69%;
    margin-bottom: 10.345%;
  }

  .music-image-main {
    padding-top: 91%;
    max-width: inherit;
    width: auto;
  }

  .music-image-commingsoon {
    padding-top: 87%;
    max-width: inherit;
    width: auto;
  }

  .music-text-ost {
    font-size: 12px;
  }

  .music-text-ost span {
    font-size: 18px;
  }

  .music-8bitchara {
    height: auto;
    width: auto;
    padding-top: 14.312%;
    margin-bottom: 5.175%;
  }

  .trailer-movie {
    width: 89.29%;
    margin-bottom: 5.175%;
  }

}

/* ---------------------------------
 PC用
--------------------------------- */
@media screen and (min-width: 993px) {}

/* ---------------------------------
 tablet FONT用
--------------------------------- */
@media screen and (min-width : 601px) {}