@charset "UTF-8";

#sub_kv {
  position: relative;
  z-index: 1;
  width: 100%;
  background-size: contain;
  padding-top: calc((360 / 1439) * 100%);
}
#sub_kv .logo1,
#sub_kv .logo2 {
  position: absolute;
  width: 7.25%;
  max-width: 80px;
}
#sub_kv .logo1 {
  top: 0;
  left: 0;
  background: transparent url(../img/logo_sw.svg) 0px 0px / contain no-repeat;
  padding-top: calc((100 / 100) * 7.25%);
}
#sub_kv .logo2 {
  top: 0;
  right: 0;
  background: transparent url(../img/logo_neos.svg) 0px 0px / contain no-repeat;
  padding-top: calc((100 / 100) * 7.25%);
}
#sub_kv .ns_logo {
  position: absolute;
  top: 0.5em;
  left: 0;
  z-index: 1;
}
#sub_kv .ps_logo {
  position: absolute;
  top: 0.5em;
  left: 20em;
  z-index: 1;
}
#sub_kv .game_logo {
  position: absolute;
  display: flex;
  top: 0.5em;
  left: 0;
  z-index: 1;
}

/* #sub_kv h1 {
  position: absolute;
  top: 26%;
  left: 50%;
  transform: translateX(-50%);
  width: 10%;
  max-width: 144px;
  background: transparent url(../img/sub_page_img/sub_logo_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((68 / 144) * 10%);
} */

#sub_kv h1 {
  position: absolute;
  content: url(../img/sub_page_img/sub_logo_pc.svg);
  width: 15%;
  top: 24%;
  left: 50%;
  transform: translateX(-50%);
}
/* 240305 */
/* #sub_kv h1.pt {
  background: transparent url(../img/kv_logo_pc_pt.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((363 / 488) * 10%);
}
#sub_kv h1.es {
  background: transparent url(../img/kv_logo_pc_es.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((363 / 488) * 10%);
}
#sub_kv h1.de {
  background: transparent url(../img/kv_logo_pc_de.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((363 / 488) * 10%);
}
#sub_kv h1.en {
  background: transparent url(../img/kv_logo_pc_en.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((363 / 488) * 10%);
}
#sub_kv h1.kr {
  top: 3.4%;
  background: transparent url(../img/kv_logo_pc_kr.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((363 / 488) * 10%);
}
#sub_kv h1.tw {
  top: 3.4%;
  background: transparent url(../img/kv_logo_pc_tw.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((257 / 609) * 10%);
}
#sub_kv h1.cn {
  top: 3.4%;
  background: transparent url(../img/kv_logo_pc_cn.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((259 / 607) * 10%);
} */
#sub_kv h1.pt {
  content: url(../img/kv_logo_pc_pt.png);
}
#sub_kv h1.es {
  content: url(../img/kv_logo_pc_es.png);
}
#sub_kv h1.de {
  content: url(../img/kv_logo_pc_de.png);
}
#sub_kv h1.en {
  content: url(../img/kv_logo_pc_en.png);
}
#sub_kv h1.kr {
  content: url(../img/kv_logo_pc_kr.png);
  width: 10%;
  top: 22%;
}
#sub_kv h1.tw {
  content: url(../img/kv_logo_pc_tw.png);
}
#sub_kv h1.cn {
  content: url(../img/kv_logo_pc_cn.png);
}

#sub_kv h2 {
  position: absolute;
  z-index: 2;
  top: 54%;
  left: 0;
  right: 0;
  margin: auto;
}

/* KV_bg img */
.story_bg {
  /* background: transparent url(../img/sub_page_img/kv_story_pc.svg) 0 0 no-repeat; */
  background: transparent url(../img/sub_page_img/kv_story_pc.png) 0 0 no-repeat;
}
.characters_bg {
  background: transparent url(../img/sub_page_img/kv_characters_pc.svg) 0 0 no-repeat;
}
.stage_bg {
  background: transparent url(../img/sub_page_img/kv_stage_pc.png) 0 0 no-repeat;
}
.production_bg {
  background: transparent url(../img/sub_page_img/kv_production_pc.svg) 0 0 no-repeat;
}
.summer_bg {
  background: transparent url(../img/sub_page_img/kv_summer_pc.svg) 0 0 no-repeat;
}
.summer_bg.kr {
  background: transparent url(../img/sub_page_img/kv_summer_pc_kr.svg) 0 0 no-repeat;
}
.creators_bg {
  background: transparent url(../img/sub_page_img/kv_creators_pc.svg) 0 0 no-repeat;
}
.special_bg,
.sound_bg {
  background: transparent url(../img/sub_page_img/kv_special_pc.svg) 0 0 no-repeat;
}
.inquiry_bg {
  background: transparent url(../img/sub_page_img/kv_inquiry_pc.svg) 0 0 no-repeat;
}
.report_bg {
  background: transparent url(../img/sub_page_img/kv_report_pc.png) 0 0 no-repeat;
}
.cast_bg {
  background: transparent url(../img/sub_page_img/kv_cast_pc.png) 0 0 no-repeat;
}
.media_bg {
  background: transparent url(../img/sub_page_img/kv_media_pc.png) 0 0 no-repeat;
}

/* kv_subtitle img */
.story {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.story.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}
.story.cn {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_story_pc_cn.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 424px;
}

.characters {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.characters.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.characters.cn {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_characters_pc_cn.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}

.stage {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.stage.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.stage.cn {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_stage_pc_cn.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}

.production {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_production_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}

.summer {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.summer.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 431) * 29.514%);
  max-width: 425px;
}
.summer.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 431) * 29.514%);
  max-width: 425px;
}
.summer.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 431) * 29.514%);
  max-width: 425px;
}
.summer.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 431) * 29.514%);
  max-width: 425px;
}
.summer.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 431) * 29.514%);
  max-width: 425px;
}
.summer.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.summer.cn {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_summer_pc_cn.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}

.creators {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_creators_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.special.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_special_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}
.inquiry {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_inquiry_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 425) * 29.514%);
  max-width: 425px;
}
.subscription {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_subscription_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 443) * 29.514%);
  max-width: 425px;
}
.report {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_report_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((188 / 848) * 29.514%);
  max-width: 425px;
}
.cast {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((187 / 848) * 29.514%);
  max-width: 425px;
}
.cast.pt {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_pt.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((187 / 848) * 29.514%);
  max-width: 425px;
}
.cast.es {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_es.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((187 / 848) * 29.514%);
  max-width: 425px;
}
.cast.de {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_de.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((187 / 848) * 29.514%);
  max-width: 425px;
}
.cast.en {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_en.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((187 / 848) * 29.514%);
  max-width: 425px;
}
.cast.tw {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_tw.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.cast.cn {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_cn.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}
.cast.kr {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_cast_pc_kr.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((94 / 424) * 29.514%);
  max-width: 425px;
}

.media {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_media_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((189 / 848) * 29.514%);
  max-width: 425px;
}
.sound {
  width: 37.7%;
  background: transparent url(../img/sub_page_img/subtitle_soundtrack_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((188 / 1086) * 37.7%);
  max-width: 543px;
}
.guidebook {
  width: 37.7%;
  background: transparent url(../img/sub_page_img/subtitle_guidebook_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((188 / 1086) * 37.7%);
  max-width: 543px;
}
.terms {
  width: 44%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((118 / 1268) * 44%);
  max-width: 634px;
}
.terms.kr {
  width: 36%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_kr.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((73 / 740) * 36%);
  max-width: 740px;
}
.terms.en {
  width: 46%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_en.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((123 / 869) * 46%);
  max-width: 740px;
}
.terms.de {
  width: 46%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_de.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((123 / 869) * 46%);
  max-width: 740px;
}
.terms.es {
  width: 46%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_es.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((123 / 869) * 46%);
  max-width: 740px;
}
.terms.pt {
  width: 46%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_pt.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((123 / 869) * 46%);
  max-width: 740px;
}
.benefits {
  width: 29.514%;
  background: transparent url(../img/sub_page_img/subtitle_benefits_pc.svg) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((93 / 425) * 29.514%);
  max-width: 425px;
}

#sub_kv h2.en {
  /* top: 40%; */
}
.terms.tw {
  width: 36%;
  background: transparent url(../img/sub_page_img/subtitle_terms_pc_tw.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((73 / 740) * 36%);
  max-width: 740px;
}
.kumamoto_repo {
  width: 55%;
  background: transparent url(../img/sub_page_img/subtitle_kumamoto_pc.png) 0 0 no-repeat;
  background-size: contain;
  padding-top: calc((188 / 1621) * 55%);
  max-width: 795px;
}

#sub_content {
  margin: 5.556% 0 6.336% 0;
}
#sub_content > .inner {
  width: 64.21%;
  max-width: 920px;
  margin: 0 auto 6.336%;
}
#sub_content .inner .middle-w {
  width: 880px;
  margin: 0 auto;
}
#sub_content .inner .small-w {
  width: 69.566%;
  max-width: 640px;
  margin: 0 auto;
}

.nav_line {
  width: 43.48%;
  margin: 0 auto 5.218% auto;
}

.nav_title {
  margin-bottom: 5.219% !important;
  text-transform: uppercase;
}

.production_name {
  margin-bottom: 6.67% !important;
}

/* top-btn */
.btn_box {
  width: 26.74%;
  margin: auto;
  box-sizing: border-box;
  border-radius: 50px;
  border: 3px solid #0088cc;
  background: #ffffff;
  cursor: pointer;
}
.btn :hover {
  opacity: 0.6;
  transition-duration: 0.25s;
}
.btn_box .btn_inner {
  position: relative;
  width: 100%;
  padding: 10% 0;
  margin: auto;
  text-align: center;
  letter-spacing: 0.04em;
}
.btn_box .btn_inner::after {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f078";
  font-weight: 900;
  font-size: 1.5em;
  color: #0088cc;
  right: 10%;
  transform: rotate(180deg);
}

/* story */
#sub_content .inner .text {
  line-height: 1.8;
  letter-spacing: 0.02em;
  margin: 0 0 7.5% 0;
}
#sub_content .inner .img_single {
  margin: 0 0 7.5% 0;
}

#sub_content .inner .img_float {
  display: flex;
  justify-content: space-between;
}

/* characters */
#sub_content .inner .char_img {
  margin: 0 auto 3.908% auto;
}
#sub_content .inner .c01 {
  width: 77.97%;
}
#sub_content .inner .c02 {
  width: 75.625%;
}
#sub_content .inner .c03 {
  width: 75.625%;
}
#sub_content .inner .c04 {
  width: 70.315%;
}
#sub_content .inner .c05 {
  width: 100%;
}
#sub_content .inner .text_sub {
  text-align: center;
  margin: 0 0 2.5% 0;
  color: transparent;
  font-weight: 600;
  background: linear-gradient(to right, rgba(0, 136, 204, 1) 25%, rgba(0, 94, 204, 1) 75%);
  -webkit-background-clip: text;
  letter-spacing: 0.1em;
  /* line-height: 1.2; */
  line-height: 1.5;
}
#sub_content .inner .text_line {
  width: 62.5%;
  margin: 0 auto 1.8% auto;
}
#sub_content .inner .text_c {
  text-align: center;
  line-height: 2;
  margin: 0 0 12.5% 0;
}

/* stage */
.bg_gray {
  background-color: #f8f7f5 !important;
}
.stage_type {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.stage_list {
  width: 47.827%;
  height: max-content;
  background-color: #fff;
  margin-bottom: 3%;
  border-radius: 8px;
}
.stage_list:nth-last-of-type(2) {
  margin-bottom: 0;
}
.stage_list:last-of-type {
  margin-bottom: 0;
}

.stage_list img {
  border-radius: 8px 8px 0 0;
}
.stage_desc {
  width: 81.82%;
  padding: 5.456% 9.094% 7.275%;
}
.stage_desc .description {
  line-height: 1.8;
  letter-spacing: 0.02em;
}

/* production */
.production_list {
  width: 47.827%;
  height: max-content;
  background-color: #f8f7f5;
  margin-bottom: 8.696%;
  border-radius: 16px;
}
.production_list:nth-last-of-type(2) {
  margin-bottom: 0;
}
.production_list:last-of-type {
  margin-bottom: 0;
}

/* creators */
.creators_box {
  display: flex;
  margin-bottom: 9.092%;
}
.reverse {
  flex-direction: row-reverse;
}
.creators_box p {
  letter-spacing: 0.08em;
  line-height: 1.5;
  font-feature-settings: "palt" on;
}
.creators_pic {
  width: 59.092%;
  max-width: 520px;
  padding-right: 4.546%;
}
.reverse .creators_pic {
  padding-right: 0;
}
.reverse .creators_desc {
  padding-right: 4.546%;
}
.creators_desc {
  width: 36.365%;
  /*  max-width: 320px;*/
}
.creators_pic img {
  margin-bottom: 3.08%;
}
.creators_pic .role {
  width: 53.847%;
  /*  max-width: 280px;*/
}
.creators_pic .role_type {
  margin-bottom: 2.86%;
  color: #424242;
  font-weight: 500;
}
.creators_pic .role_desc {
  color: #757575;
  font-weight: 100;
}
.creators_desc img {
  margin-bottom: 5%;
}
.creators_desc .type {
  color: #0077cc;
  margin-bottom: 2.5%;
  line-height: 1.4;
}
.creators_desc .name {
  color: #0077cc;
  margin-bottom: 12.5%;
}
.creators_desc .comment {
  color: #0088cc;
  line-height: 1.8;
}

/* special */
.special_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.special_list .contents {
  width: 47.827%;
}
.special_list .contents.center_co {
  width: 100%;
  margin: 0 auto;
}
.special_list .contents.center_co .contents_name {
  width: 47.827%;
  margin: 0 auto 5.218%;
}
.two_co {
  display: flex;
  justify-content: space-between;
}
.special_list .contents.center_co .download_list {
  width: 46%;
}
.text_center {
  text-align: center;
}
.download_list {
  position: relative;
  width: 100%;
  height: max-content;
  padding: 9.092% 0;
  margin-bottom: 10.91%;
  border-radius: 16px;
  background-color: #f8f7f5;
}
.download_list:last-of-type {
  margin-bottom: 0;
}
.contents_name {
  margin-bottom: 10.91%;
}
.contents_name img {
  margin-bottom: 10%;
}
.contents_name p {
  line-height: 1;
  text-transform: uppercase;
}
.download_list img {
  display: block;
  width: 37.276%;
  border: 4px solid #fff;
  border-radius: 16px;
  margin: 0 auto 5.455%;
  box-sizing: border-box;
  filter: drop-shadow(0px 2px 12px rgba(88, 74, 4, 0.2));
}
.special_detail {
  width: 81.82%;
  margin: 0 auto;
}
.special_detail .description {
  line-height: 1.8;
  letter-spacing: 0.02em;
  margin-bottom: 6.67%;
}
.download_list .btn_box {
  width: 56.366%;
  border: 4px solid #0088cc;
}
.download_list .btn .btn_box .btn_inner::after {
  transform: rotate(0deg);
}

.scene .download_list img {
  width: 56.365%;
}
.scene .btn_box {
  border: 3px solid #0088cc;
}

.scene .btn_inner {
  padding: 6.67% 0;
}
.wp_dl .btn {
  margin-bottom: 2.73%;
}
.wp_dl .btn:last-of-type {
  margin-bottom: 5.456%;
}

.soon_btn {
  width: 56.366%;
  margin: 0 auto 5.456% auto;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 32px;
}
.soon_btn .soon {
  text-align: center;
}
.soon_btn .soon .soon_inner {
  padding: 6.67% 0;
}

/* inquiry */
.inquiry_content {
  width: 69.56%;
  max-width: 640px;
  margin: 0 auto;
}
.inquiry_content .inq_caption {
  text-align: center;
  margin: 0 0 3.75% 0;
}
.inquiry_content .inq_read {
  line-height: 1.8;
  margin: 0 0 7.5% 0;
}
.inquiry_content .inq_read.cent {
  text-align: center;
}

.inquiry_content .confirm-value {
  margin: 0 0 3.75% 0;
  white-space: pre-wrap;
}

.inquiry_content .input-label {
  margin: 0 0 1.1% 0;
}
.inquiry_content .input-label span {
  display: inline-block;
  vertical-align: middle;
}
.inquiry_content .input-label .caption {
  text-align: left;
  color: #0088cc;
  line-height: 1;
}
.inquiry_content .input-label .required {
  box-sizing: border-box;
  background: #0088cc;
  border-radius: 16px;
  padding: 0.625% 1.25%;
  margin: 0 0 0 2.5%;
}

.inquiry_content .input_area {
  margin: 0 0 3.75% 0;
}
.inquiry_content .input_area .validation-error-message {
  line-height: 1.5;
  padding: 0 0 0 3.125%;
}
.inquiry_content .input_area .input_box {
  display: block;
  box-sizing: border-box;
  background: #ffffff;
  border: 2px solid #eeedec;
  border-radius: 24px;

  padding: 1.5625% 3.75%;
}

.inquiry_content .input_area .input_box.haserror {
  border: 2px solid #e72a00;
}

.inquiry_content .input_area .input_box input[type="text"],
.inquiry_content .input_area .input_box input[type="email"],
.inquiry_content .input_area .input_box select {
  box-sizing: border-box;
  width: 100%;
  border: none;
  outline: none;
}
.inquiry_content .input_area .input_box textarea {
  box-sizing: border-box;
  line-height: 1.8;
  outline: none;
  border: none;
  width: 100%;
  height: calc((284 / 640) * 542px);
  resize: none;
  font-family: "Noto Sans JP";
}
.inquiry_content .inq_notice {
  margin: 7.5% 0;
}
.inquiry_content .inq_notice .cap {
  line-height: 1;
  margin: 0 0 2.5% 0;
}
.inquiry_content .inq_notice .read {
  line-height: 1.8;
}

.inquiry_content .inq_btn,
.inquiry_content .inq_btn_bak {
  display: block;
  box-sizing: border-box;
  width: 37.5%;
  margin: 0 auto;
  text-align: center;

  border-radius: 50px;
  border: 3px solid #0088cc;
  background: #ffffff;
  cursor: pointer;

  padding: 3.3% 0;
  transition-duration: 0.25s;
}
.inquiry_content .inq_btn_bak {
  border: 3px solid #ffffff;
  background: #0088cc;
  margin: 0 3% 0 0;
}

.inquiry_content .btn_area {
  text-align: center;
}
.inquiry_content .btn_area button {
  display: inline-block;
}

.inquiry_content .inq_btn:hover,
.inquiry_content .inq_btn_bak:hover {
  opacity: 0.6;
  transition-duration: 0.25s;
}

.inquiry_content .subs_caption {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/sub_page_img/subscript_cap.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.inquiry_content .subs_cap_tex {
  width: 100%;
  text-align: center;
  margin: 0 0 3.75% 0;
}
.inquiry_content .subs_cap_tex .lines {
  position: relative;
  line-height: 1.8;
  padding: 0 0 1% 0;
}
.inquiry_content .subs_cap_tex .lines::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: calc((4 / 400) * 100%);
}

.inquiry_content .subs_read {
  text-align: center;
  /* margin: 0 0 3.75% 0; */
  margin: 0 0 6% 0;
  line-height: 1.5;
}

.inquiry_content .subs_s_cap {
  text-align: center;
  margin: 0 0 3.75% 0;
  width: 100%;
}

.inquiry_content .subs_s_cap p {
  width: 40%;
  margin: 0 auto;
  box-sizing: border-box;
  border-radius: 50px;
  border: 3px solid #ffffff;
  background: #0088cc;
}
.inquiry_content .subs_s_cap p span {
  display: block;
  padding: 6% 0;
}

.inquiry_content .subs_s_read {
  line-height: 1.5;
  margin: 0 0 3.75% 0;
}
.inquiry_content .subs_s_read span {
  display: block;
  text-indent: -1em;
  padding-left: 1em;
  margin: 0 0 1.5% 0;
  /* letter-spacing: -0.05em; */
}
.inquiry_content .subs_s_read label {
  display: inline-block;
  padding: 0 0 0.5% 1em;
  position: relative;
  margin: 0 3% 0 0;
}
.inquiry_content .subs_s_read label::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;

  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}

.inquiry_content .subs_t_cap {
  position: relative;
  text-align: center;
  /* margin: 0 0 3.75% 0; */
  margin: 6% 0;
  width: 100%;
}
.inquiry_content dl {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  padding: 0 0 3% 0;
  margin: 3% 0 0 0;
}
.inquiry_content dl:nth-last-of-type(1) {
  position: relative;
  display: block;
  padding: 0 0 4% 0;
  margin: 4% 0 0 0;
}
.inquiry_content dl::before {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;

  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}

.inquiry_content dl dt {
  width: 30%;
  letter-spacing: 0.5em;
  line-height: 1.5;
}
.inquiry_content dl:nth-last-of-type(1) dt {
  width: 100%;
  margin: 0 0 1.5% 0;
  letter-spacing: 0.125em;
}
.inquiry_content dl dd {
  width: 70%;
  line-height: 1.5;
}
.inquiry_content dl:nth-last-of-type(1) dd {
  width: 100%;
}
.inquiry_content .subs_t_reads {
  margin: 6% 0;
  line-height: 1.5;
}
.inquiry_content .subs_t_reads.notice {
  letter-spacing: -0.065em;
}
.inquiry_content .subs_t_reads span {
  display: block;
  text-indent: -1em;
  padding-left: 1em;
}

/* report */
#report_box {
  width: 69.56%;
  max-width: 640px;
  margin: 0 auto;
}
#repo_caption {
  margin: 0 0 9.375% 0;
}
#repo_caption .repo_title {
  position: relative;
  margin: 0 0 5% 0;
  padding: 5.625% 0 0 0;
  color: transparent;
  background: linear-gradient(to right, rgba(0, 136, 204, 1) 25%, rgba(0, 94, 204, 1) 75%);
  -webkit-background-clip: text;
  letter-spacing: 0.16em;
  line-height: 1;
}
#repo_caption .repo_title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;

  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}
#repo_caption .repo_detail {
  line-height: 1.8;
  letter-spacing: 0.08em;
}

#report_box .repo_component {
  margin: 0 0 9% 0;
}
#report_box .repo_component .repo_comp_read {
  line-height: 1.8;
  /* letter-spacing: 0.08em; */
  letter-spacing: 0.02em;
  margin: 0 0 2.5% 0;
}
#report_box .repo_component .repo_comp_detail {
  line-height: 1.8;
  margin: 0 0 5% 0;
}

#report_box .repo_component .credit {
  position: relative;
  width: 100%;
  text-align: right;
}
#report_box .repo_component .repo_comp_credit {
  display: inline-block;

  width: auto;

  box-sizing: border-box;
  border-top: 1px solid #0088cc;
  border-bottom: 1px solid #0088cc;
  padding: 2.5% 0;
  line-height: 1.8;
  text-align: right;
}

#report_box .repo_component #repo_slids {
  width: 100%;
}
#report_box .repo_component #repo_slids dl {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#report_box .repo_component #repo_slids dl dt,
#report_box .repo_component #repo_slids dl dd {
  cursor: pointer;
}

#report_box .repo_component #repo_slids dl dt {
  position: relative;
  width: 100%;
  margin: 0 0 5% 0;
  padding: 0 0 5% 0;
}

#report_box .repo_component #repo_slids dl dt::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;

  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}

#report_box .repo_component #repo_slids dl dd {
  width: 11.5%;
  /* width: 22.5%; */
  overflow: hidden;
  box-sizing: border-box;
  border-radius: 4px;
  border: 2px solid #0088cc;

  line-height: 0;
  font-size: 0;
}
#report_box .repo_component #repo_slids dd.on {
  position: relative;
  z-index: 1;
}
#report_box .repo_component #repo_slids dd.on::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 136, 204, 0.8);
}
#report_box .repo_component #repo_slids dd.on::after {
  content: "＋";
  position: absolute;
  z-index: 2;
  top: 22.5%;
  right: 0;
  left: 0;
  width: 100%;
  margin: auto;
  font-size: 1rem;
  line-height: 1;
  color: #ffffff;
  text-align: center;
}

#report_box .repo_component #repo_slids.kumamoto {
  position: relative;
  padding: 5% 0 0 0;
}
#report_box .repo_component #repo_slids.kumamoto::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;

  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}

#report_box .repo_component #repo_slids.kumamoto dl dt::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;

  background: unset;
  padding-top: 0;
}
#report_box .repo_component #repo_slids.kumamoto dl dt,
#report_box .repo_component #repo_slids.kumamoto dl dd {
  position: relative;
  width: 48%;
  margin: 0 0 4% 0;
  padding: 0;

  overflow: hidden;
  box-sizing: border-box;
  /* border-radius: 4px;
  border: 2px solid #0088CC; */
  border-radius: 0;
  border: unset;

  line-height: 0;
  font-size: 0;
}

#report_box .repo_component #repo_slids.kumamoto dd.on {
  position: relative;
  z-index: 1;
}
#report_box .repo_component #repo_slids.kumamoto dd.on::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: transparent;
}
#report_box .repo_component #repo_slids.kumamoto dd.on::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: unset;
  right: unset;
  left: unset;
  width: 100%;
  margin: auto;
  font-size: 1rem;
  line-height: 1;
  color: transparent;
  text-align: center;
}

#modal_popup {
  opacity: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  transition-duration: 0.25s;
}
#modal_popup .inner {
  position: relative;
  z-index: 1;
  width: 55.55%;
  margin: 0 auto;
  max-width: 800px;
  max-height: 60vh;
}
#modal_popup .inner #modal_fade {
  position: relative;
  z-index: 1;
  padding: 0 0 10% 0;
}
#modal_popup #close {
  cursor: pointer;
  position: absolute;
  z-index: 2;
  right: -5%;
  top: -2.22vw;

  width: 8%;
  background: transparent url(../img/sub_page_img/report_img/close_btn.png) 0 0 / contain no-repeat;
  padding-top: calc((128 / 128) * 8%);
}

#modal_popup .num {
  display: inline-block;
  width: 100%;
  position: absolute;
  bottom: 1.25vw;
  text-align: center;
  line-height: 1.4;
  font-family: "Noto Sans JP";
}
#modal_popup .prev {
  cursor: pointer;
  position: absolute;
  z-index: 3;
  bottom: 0;
  left: 36%;

  width: 8%;
  background: transparent url(../img/sub_page_img/report_img/arrow_btn.png) 0 0 / contain no-repeat;
  padding-top: calc((129 / 128) * 8%);
  transition-duration: 0.25s;
}
#modal_popup .next {
  cursor: pointer;
  position: absolute;
  z-index: 3;
  bottom: 0;
  right: 36%;

  width: 8%;
  background: transparent url(../img/sub_page_img/report_img/arrow_btn.png) 0 0 / contain no-repeat;
  padding-top: calc((129 / 128) * 8%);
  transform: rotate(180deg);
  transition-duration: 0.25s;
}
#modal_popup .prev:hover,
#modal_popup .next:hover {
  background: transparent url(../img/sub_page_img/report_img/arrow_btn_f.png) 0 0 / contain no-repeat;
  transition-duration: 0.25s;
}
#modal_popup .bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 136, 204, 0.8);
}

.sub_sticker {
  display: block;
  position: absolute;
  width: 15%;
  top: 50%;
  right: 10%;
  transform: rotate(-15deg);
}
.sub_sticker:hover {
  opacity: 0.6;
}

/* cast */
#sub_content > .inner.cast_inner {
  width: 71.11111%;
  max-width: 1024px;
}
#cast_area {
  width: 100%;
}
#cast_area .cast_caption {
  position: relative;
  width: 43%;
  text-align: center;
  line-height: 1.4;
  letter-spacing: 0.2em;
  padding: 4.7% 0 0 0;
  margin: 0 auto 12.5% auto;
}
#cast_area .cast_caption::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}
#cast_area .cast_box {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#cast_area .cast_box.mla::before,
#cast_area .cast_box.mla::after {
  display: block;
  content: "";
  width: 24%;
  height: 0;
  order: 1;
}
#cast_area .cast_box .detail_box {
  position: relative;
  width: 24%;
  margin: 0 1% 12.5% 0;
  padding: 0 0 2.344% 0;

  box-sizing: border-box;
  border-radius: 12px;
  background: #f8f7f5;
}
#cast_area .cast_box .detail_box:nth-last-child(1) {
  margin: 0 0 12.5% 0;
}
#cast_area .cast_box .detail_box .thumbs {
  width: 65.57%;
  margin: -33% auto 6.56% auto;
}
#cast_area .cast_box .detail_box .char {
  text-align: center;
  line-height: 1.5;
  margin: 0 0 3.3% 0;
}
#cast_area .cast_box .detail_box .name {
  text-align: center;
  line-height: 1.2;
  margin: 0 0 6.56% 0;
}
#cast_area .cast_box .detail_box .inner {
  width: 85.245%;
  margin: 0 auto;
  line-height: 1.5;
  /* letter-spacing: 0.08em; */
  letter-spacing: -0.02em;
  word-break: break-all;
}

/* media */
/* #media_area {

} */
#media_area .media_box {
  box-sizing: border-box;
  border-bottom: 2px dotted #0088cc;
  position: relative;
  width: 100%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;

  padding: 0 0 3% 0;
  margin: 0 0 3% 0;
}
/* #media_area .media_box::after{
  content: '';
  position: absolute;
  bottom: 0;

  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / contain no-repeat;
  padding-top: 4px;
} */

#media_area .media_box .day_cat {
  width: 12.5%;
}
#media_area .media_box .day_cat .date {
  line-height: 1.5;
  margin: 0 0 5% 0;
}
#media_area .media_box .day_cat .cat {
  box-sizing: border-box;
  border-radius: 4px;
  overflow: hidden;

  display: inline-block;
  width: auto;
  padding: 5% 8%;

  text-align: center;
}
#media_area .media_box .day_cat .cat span {
  text-align: center;
}
#media_area .media_box .detail {
  position: relative;
  width: 80%;
  /* padding-top: calc((120/640)*80%); */
  padding-top: calc((100 / 640) * 80%);
}
#media_area .media_box .detail .title {
  position: absolute;
  top: 0;
  left: 0;

  display: block;
  line-height: 1.5;
}
#media_area .media_box .detail .link {
  box-sizing: border-box;
  border-bottom: 1px solid #0088cc;
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 0 0 1% 0;
}
#media_area .media_box .detail .pop {
  cursor: pointer;
}
#media_area .media_box .detail .link::after {
  font-family: "Font Awesome 5 Free";
  content: "\f35d";
  font-weight: 900;
  font-size: 1em;
  margin: 0 0 0 8px;
}

/* music_dl */
.music_inner {
  width: 69.56%;
  max-width: 640px;
  margin: 0 auto;
}
.music_inner .subs_caption {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/sub_page_img/subscript_cap.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.kr {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_kr.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.en {
  width: 80%;
  margin: 0 auto 4% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_en.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.de {
  width: 80%;
  margin: 0 auto 4% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_de.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.es {
  width: 80%;
  margin: 0 auto 4% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_es.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.pt {
  width: 80%;
  margin: 0 auto 4% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_pt.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_caption.tw {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/sub_page_img/subscript_cap_tw.png) 0 0 / contain no-repeat;
  padding-top: calc((463 / 1256) * 80%);
}
.music_inner .subs_cap_tex {
  width: 100%;
  text-align: center;
  margin: 0 0 3.75% 0;
}
.music_inner .subs_cap_tex .lines {
  position: relative;
  line-height: 1.8;
  padding: 0 0 1% 0;
}
/* .music_inner .subs_cap_tex .lines::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: calc((4 / 400) * 100%);
} */
.music_inner .subs_cap_tex .lines::after {
  content: "";
  position: absolute;
  width: 100%;
  height: auto;
  left: 0;
  bottom: 0;
  background: url(../img/sub_page_img/line_bar_title_pc.svg) cover no-repeat;
}

.music_inner .sereal_img {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/sound/card_img.png) 0 0 / contain no-repeat;
  padding-top: calc((346 / 550) * 80%);
}
.music_inner .gb_sereal_img {
  width: 80%;
  margin: 0 auto 1.5% auto;
  background: transparent url(../img/gb/gb_img.png) 0 0 / contain no-repeat;
  padding-top: calc((400 / 550) * 80%);
}

.music_inner .main_notice {
  text-align: center;
  margin: 0 0 6% 0;
  line-height: 1.5;
}
.music_inner .subs_read {
  text-align: center;
  margin: 0 0 6% 0;
  line-height: 1.5;
}
.music_inner .err {
  text-align: center;
  margin: 0 0 3% 0;
  line-height: 1.5;
}
.music_inner .err.hidden {
  display: none;
}

.music_inner .subs_t_cap {
  position: relative;
  text-align: center;
  margin: 6% 0;
  width: 100%;
}
.music_inner .subs_t_reads {
  margin: 6% 0;
  line-height: 1.5;
}
.music_inner .dln {
  line-height: 1.5;
  margin: 0 0 8% 0;
}
.music_inner .subs_t_reads span {
  display: block;
  text-indent: -1em;
  padding-left: 1em;
  margin: 0 0 0.5em 0;
}
.music_inner .subs_t_reads span.mid_cap {
  margin: 1.5em 0 0.5em 0;
}
.music_inner .dl_detail_text {
  /* padding: 1% 0 8% 0; */
  margin: 0 0 6% 0;
}
.music_inner .dl_detail_text .subs_t_reads {
  margin: 0;
}
.notice-li {
  text-indent: -2em !important;
}
.music_inner .form_box {
  margin: 0 0 8% 0;
}
.music_inner .form_box .input_area {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  /* margin: 0 0 8% 0; */
}
.music_inner .form_box .input_area .input_label {
  display: inline-block;
  width: 30%;

  box-sizing: border-box;
  background: #ffffff;
  border: 2px solid #eeedec;
  border-radius: 24px;
  padding: 1.5625% 3.75%;
}
.music_inner .form_box .input_area .input_label:focus-within {
  border: 2px solid #0088cc;
}
.music_inner .form_box .input_area span {
  position: relative;
  display: block;
  width: 5%;
}
.music_inner .form_box .input_area span::after {
  position: absolute;
  top: 45%;
  left: 0;
  right: 0;
  margin: auto;
  content: "";
  background: #0088cc;
  width: 50%;
  padding-top: 4px;
}

.music_inner .form_box .input_area .input_label input[type="text"] {
  text-align: center;
  box-sizing: border-box;
  width: 100%;
  border: none;
  outline: none;
  text-transform: uppercase;
}

.music_inner .form_box .btn_box_column {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
}
.music_inner .form_box .btn_box_column .btn {
  cursor: pointer;
  display: block;
  box-sizing: border-box;
  width: 30%;
  margin: 0 3% 0 0;
  padding: 3.3% 0;
  text-align: center;
  border-radius: 50px;
  transition-duration: 0.25s;
}
.music_inner .form_box .btn_box_column .btn:hover {
  opacity: 0.6;
  transition-duration: 0.25s;
}
.music_inner .form_box .btn_box_column .btn.clear {
  border: 3px solid #ffffff;
  background: #0088cc;
}
.music_inner .form_box .btn_box_column .btn.submit {
  border: 3px solid #0088cc;
  background: #ffffff;
  margin: 0;
}

.music_inner .dl_notice {
  position: relative;
  padding: 3.15% 5.24%;

  background: #ffffff;
  box-sizing: border-box;
  border-radius: 16px;
  filter: drop-shadow(0px 2px 12px rgba(88, 74, 4, 0.2));
  margin-bottom: 6%;
}
.music_inner .dl_notice .dl_notice_inner {
  width: 100%;
  height: 16vw;
  max-height: 230px;
  /* width: 100%;
  height: 9vw;
  max-height: 130px; */
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.music_inner .dl_notice .dl_notice_inner::-webkit-scrollbar {
  display: none;
}
.music_inner .dl_notice .dl_notice_inner .notice_caption {
  text-align: center;
  margin: 0 0 3% 0;
}
.music_inner .dl_notice .dl_notice_inner dl {
  margin: 0 0 5% 0;
}
.music_inner .dl_notice .dl_notice_inner dl dt {
  line-height: 1.8;
}
.music_inner .dl_notice .dl_notice_inner dl dd {
  line-height: 1.5;
}
.music_inner .faq {
  display: block;
  box-sizing: border-box;
  width: 37.5%;
  margin: 0 auto;
  text-align: center;
  border-radius: 50px;
  border: 3px solid #0088cc;
  background: #ffffff;
  cursor: pointer;
  padding: 3.3% 0;
  transition-duration: 0.25s;
}
.music_inner .faq:hover {
  opacity: 0.6;
  transition-duration: 0.25s;
}

.music_inner .track_area {
  width: 100%;
}
.music_inner .track_area .track_box {
  position: relative;

  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  align-items: center;

  margin: 0 0 5% 0;
  /* padding: 0 0 2.5% 0; */
  padding: 0 0 2% 0;
}
.music_inner .track_area .track_box::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: transparent url(../img/sub_page_img/line_bar_title_pc.svg) 0 0 / cover no-repeat;
  padding-top: 4px;
}
.music_inner .track_area .track_box:nth-last-of-type(1) {
  margin: 0;
}

.music_inner .track_area .track_box .title {
  max-width: 75%;
  color: transparent;
  background: linear-gradient(to right, rgba(0, 136, 204, 1) 25%, rgba(0, 94, 204, 1) 75%);
  -webkit-background-clip: text;
  background-clip: text;
  line-height: 1;
}
.music_inner .track_area .track_box .title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;

  /* width: 1.5em; */
  width: 2em;
  /* background: transparent url(../img/sub_page_img/sound_icon.png) 0 0 / contain no-repeat; */
  background: transparent url(../img/sub_page_img/gb_icon.png) 0 0 / contain no-repeat;
  padding-top: calc((156 / 163) * 2em);
  margin-right: 0.5em;
}
.music_inner .track_area .track_box .title span {
  letter-spacing: 0;
  margin: 0 0 0 0.5em;
}

.music_inner .track_area .track_box .dl_btn {
  position: absolute;
  /* top: -0.25em; */
  top: 0;
  right: 0;
  box-sizing: border-box;
  width: 20%;
  text-align: center;
  border-radius: 50px;
  border: 2px solid #0088cc;
  background: #ffffff;
  cursor: pointer;
  transition-duration: 0.25s;
}
.music_inner .track_area .track_box .dl_btn.over {
  text-align: center;
  border-radius: unset;
  border: none;
  background: #ffffff;
  cursor: unset;
  top: 0.25em;
}
.music_inner .track_area .track_box .dl_btn.over a,
.music_inner .track_area .track_box .dl_btn.over span {
  color: #bdbdbd;
}
.music_inner .track_area .track_box .dl_btn.over:hover {
  opacity: 1;
}
.music_inner .track_area .track_box .dl_btn:hover {
  opacity: 0.6;
  transition-duration: 0.25s;
}
.music_inner .track_area .track_box .dl_btn a {
  display: block;
  padding: 5% 0;
}

.term_ttl {
  text-align: center;
  margin: 0 0 8% 0;
}
.term_cap {
  line-height: 2;
}
.term_tex {
  margin: 0 0 8% 0;
}
.term_guide {
  margin: 0 0 1em 0;
}
.term_guide_right {
  text-align: right;
  line-height: 2;
}
.term_guide span {
  display: block;
  text-indent: unset !important;
  padding-left: unset !important;
  margin: 0 0 0.5em 0;
}
.term_guide .term_guide_cp {
}
.term_guide .term_guide_tex {
}
.term_guide .term_guide_tex .indents {
  display: block;
  text-indent: -1em;
  padding-left: 1em;
  margin: 0 0 0.5em 0;
}

@media screen and (max-width: 750px) {
  #sub_kv {
    padding-top: calc(100%);
  }
  #sub_kv .logo1,
  #sub_kv .logo2 {
    position: absolute;
    width: 13.866667%;
    max-width: unset;
  }
  #sub_kv .logo1 {
    background: transparent url(../img/logo_sw.svg) 0px 0px / contain no-repeat;
    padding-top: calc((100 / 100) * 13.866667%);
  }
  #sub_kv .logo2 {
    top: 68%;
    background: transparent url(../img/logo_neos.svg) 0px 0px / contain no-repeat;
    padding-top: calc((100 / 100) * 13.866667%);
  }
  #sub_kv .ps_logo {
    width: 34%;
    left: 12em;
  }
  #sub_kv .game_logo {
    width: 84%;
  }
  #sub_kv h1 {
    width: 54%;
    top: 12%;
    padding-top: calc((68 / 144) * 30%);
  }
  #sub_kv h1.kr {
    width: 34%;
    top: 12%;
  }
  #sub_kv h2 {
    top: 54%;
    width: 74%;
    padding-top: calc((93 / 425) * 74%);
  }

  #sub_kv h2.terms {
    width: 56.5%;
    padding-top: calc((247 / 848) * 56.5%);
  }
  #sub_kv h2.en {
    width: 90%;
    /* padding-top: calc((123 / 869) * 90%); */
  }
  #sub_kv h2.kumamoto_repo {
    width: 58.26%;
    padding-top: calc((290 / 874) * 58.26%);
  }
  .terms {
    background: transparent url(../img/sub_page_img/subtitle_terms_sp.png) 0 0 no-repeat;
    background-size: contain;
    max-width: 848px;
  }
  .terms.kr {
    background: transparent url(../img/sub_page_img/subtitle_terms_sp_kr.png) 0 0 no-repeat;
    background-size: contain;
    max-width: 848px;
  }
  .terms.tw {
    background: transparent url(../img/sub_page_img/subtitle_terms_sp_tw.png) 0 0 no-repeat;
    background-size: contain;
    max-width: 848px;
  }
  .kumamoto_repo {
    background: transparent url(../img/sub_page_img/subtitle_kumamoto_sp.png) 0 0 no-repeat;
    background-size: contain;
    max-width: 874px;
  }

  /* KV_bg img */
  .story_bg {
    background: transparent url(../img/sub_page_img/kv_story_sp.svg) 0 0 / contain no-repeat;
  }
  .characters_bg {
    background: transparent url(../img/sub_page_img/kv_characters_sp.svg) 0 0 / contain no-repeat;
  }
  .stage_bg {
    background: transparent url(../img/sub_page_img/kv_stage_sp.png) 0 0 / contain no-repeat;
  }
  .production_bg {
    background: transparent url(../img/sub_page_img/kv_production_sp.svg) 0 0 / contain no-repeat;
  }
  .summer_bg {
    background: transparent url(../img/sub_page_img/kv_summer_sp.svg) 0 0 / contain no-repeat;
  }
  .summer_bg.kr {
    background: transparent url(../img/sub_page_img/kv_summer_sp_kr.png) 0 0 / contain no-repeat;
  }
  .creators_bg {
    background: transparent url(../img/sub_page_img/kv_creators_sp.svg) 0 0 / contain no-repeat;
  }
  .special_bg,
  .sound_bg {
    background: transparent url(../img/sub_page_img/kv_special_sp.svg) 0 0 / contain no-repeat;
  }
  .inquiry_bg {
    background: transparent url(../img/sub_page_img/kv_inquiry_sp.svg) 0 0 / contain no-repeat;
  }
  .report_bg {
    background: transparent url(../img/sub_page_img/kv_report_sp.png) 0 0 / contain no-repeat;
  }
  .cast_bg {
    background: transparent url(../img/sub_page_img/kv_cast_sp.png) 0 0 / contain no-repeat;
  }
  .media_bg {
    background: transparent url(../img/sub_page_img/kv_media_sp.png) 0 0 / contain no-repeat;
  }
  /* kv_subtitle img */
  /*
  .story{
    width: 74%;
    padding-top: calc((93/425)*74%);
  }
  .characters{
    width: 74%;
    padding-top: calc((93/425)*74%);
  }
  .stage{
    width: 74%;
    padding-top: calc((93/425)*74%);
  }
  .production{
    width: 74%;
    padding-top: calc((93/425)*74%);
  }
  
*/

  #sub_content .inner {
    width: 86.4%;
    /* max-width: 324px; */
    margin: 7.41% auto 0 auto;
  }
  #sub_content .inner .small-w {
    width: 100%;
  }

  #sub_content .inner .middle-w {
    width: 100%;
  }

  /* story */
  #sub_content .inner .img_float {
    display: block;
    margin: 0 0 7.5% 0;
  }
  #sub_content .inner .img_float p {
    margin: 0 0 7.5% 0;
  }

  /* character */
  #sub_content .inner .c01 {
    width: 100%;
  }
  #sub_content .inner .c02 {
    width: 100%;
  }
  #sub_content .inner .c03 {
    width: 100%;
  }
  #sub_content .inner .c04 {
    width: 86%;
  }
  #sub_content .inner .c05 {
    width: 100%;
  }

  /* stage */
  .stage_type .stage_list {
    width: 100%;
    margin-bottom: 10%;
  }

  /* production */
  .stage_type .production_list {
    width: 100%;
    margin-bottom: 8.696%;
  }

  /* creators */
  .creators_box {
    display: block;
    margin-bottom: 18%;
  }
  .creators_pic {
    width: 100%;
    margin: 0 auto 5% auto;
    padding: 0;
  }
  .creators_pic .role {
    width: 100%;
  }
  .role_type {
    text-align: center;
  }
  .creators_desc {
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }
  .creators_desc .type {
    text-align: center;
  }
  .creators_desc .name {
    text-align: center;
    margin-bottom: 6%;
  }

  /* special */
  .special_list {
    display: block;
  }
  .special_list .contents {
    width: 100%;
    margin-bottom: 16%;
  }
  .download_list {
    padding: 14% 0;
  }
  .download_list img {
    width: 52%;
  }
  .scene .download_list img {
    width: 78%;
  }

  .download_list .btn_box {
    width: 82%;
  }
  .btn_box .btn_inner {
    padding: 6.67% 0;
  }

  .wp_dl {
    margin-bottom: 16%;
  }
  .wp_dl:last-of-type {
    margin-bottom: 0;
  }
  .wp_dl .btn {
    margin-bottom: 10%;
  }
  .two_co {
    display: block;
  }
  .special_list .contents.center_co .download_list,
  .special_list .contents.center_co .contents_name {
    width: 100%;
  }

  /* inquiry */
  .inquiry_content {
    width: 100%;
  }
  .inquiry_content .inq_read {
    line-height: 2;
    margin: 0 0 12.5% 0;
  }
  .inquiry_content .inq_notice .cap {
    line-height: 1.5;
  }
  .inquiry_content .inq_btn,
  .inquiry_content .inq_btn_bak {
    width: 100%;
  }
  .inquiry_content .btn_area button {
    width: 47%;
    display: inline-block;
  }
  .wp_dl .soon_btn,
  .soon_btn {
    width: 82%;
  }

  .inquiry_content .subs_caption {
    width: 100%;
    margin: 0 auto 1.5% auto;
    background: transparent url(../img/sub_page_img/subscript_cap.png) 0 0 / contain no-repeat;
    padding-top: calc((463 / 1256) * 100%);
  }

  .inquiry_content .subs_s_cap p {
    width: 70%;
  }
  .inquiry_content .subs_s_cap p span {
    padding: 3% 0;
  }
  .inquiry_content .subs_s_read label {
    display: inline-block;
    padding: 0 0 1% 1em;
    position: relative;
    margin: 0;
  }
  .inquiry_content .subs_s_read span {
    display: block;
    letter-spacing: -0.05em;
  }
  .inquiry_content .subs_read {
    margin: 0 0 10% 0;
  }
  .inquiry_content .subs_t_cap {
    margin: 10% 0;
  }
  .inquiry_content dl {
    display: block;
    padding: 0 0 6% 0;
    margin: 6% 0 0 0;
  }
  .inquiry_content dl dt,
  .inquiry_content dl dd {
    width: 100%;
  }
  .inquiry_content dl:nth-last-of-type(1) dt {
    margin: 0;
  }
  .inquiry_content .subs_t_reads {
    letter-spacing: -0.033em;
    margin: 6% 0 10% 0;
  }

  #report_box {
    width: 100%;
    max-width: 750px;
  }
  #repo_caption {
    margin: 0 0 10% 0;
  }

  #repo_caption .repo_title {
    position: relative;
    margin: 0 0 10% 0;
    padding: 10% 0 0 0;
    color: transparent;
    letter-spacing: 0.16em;
    line-height: 1.4;
  }
  #repo_caption .repo_detail {
    line-height: 1.5;
  }

  #report_box .repo_component .repo_comp_read {
    line-height: 1.5;
    margin: 0 0 5% 0;
  }
  #report_box .repo_component .repo_comp_detail {
    line-height: 1.5;
    margin: 0 0 5% 0;
    word-break: break-all;
  }

  #report_box .repo_component #repo_slids dl {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #report_box .repo_component #repo_slids.kumamoto dl {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  #report_box .repo_component .credit {
    text-align: center;
    margin: 12% 0 0 0;
  }
  #report_box .repo_component .repo_comp_credit {
    padding: 2.5% 0;
    text-align: center;
  }

  #report_box .repo_component #repo_slids dl dt {
    margin: 0 0 3% 0;
    padding: 0 0 3% 0;
  }
  #report_box .repo_component #repo_slids dl dd {
    width: 30%;
    margin: 0 5% 3% 0;
  }
  #report_box .repo_component #repo_slids dl dd:nth-of-type(3n) {
    margin: 0 0 3% 0;
  }

  #report_box .repo_component #repo_slids dd.on::after {
    top: 27.5%;
    font-size: 1.5rem;
  }
  #modal_popup .inner {
    width: 96%;
  }

  #modal_popup .inner #modal_fade {
    padding: 0 0 12.5% 0;
  }
  #modal_popup #close {
    right: 0;
    top: -10vw;
    width: 10%;
    background: transparent url(../img/sub_page_img/report_img/close_btn.png) 0 0 / contain no-repeat;
    padding-top: calc((128 / 128) * 10%);
  }
  #modal_popup .prev {
    left: 0;
    width: 10%;
    background: transparent url(../img/sub_page_img/report_img/arrow_btn.png) 0 0 / contain no-repeat;
    padding-top: calc((129 / 128) * 10%);
  }
  #modal_popup .next {
    right: 0;
    width: 10%;
    background: transparent url(../img/sub_page_img/report_img/arrow_btn.png) 0 0 / contain no-repeat;
    padding-top: calc((129 / 128) * 10%);
  }

  /* cast */
  #sub_content > .inner.cast_inner {
    width: 98%;
    margin: 7.41% auto 0 auto;
  }
  #cast_area .cast_caption {
    width: 88.4%;
    padding: 5% 0 0 0;
    margin: 0 auto 25% auto;
  }
  #cast_area .cast_box .detail_box {
    width: 48%;
    margin: 0 2% 25% 0;
    padding: 0 0 4% 0;
  }
  #cast_area .cast_box .detail_box .thumbs {
    margin: -33% auto 4% auto;
  }
  #cast_area .cast_box .detail_box .name {
    margin: 0 0 4% 0;
  }
  #cast_area .cast_box .detail_box:nth-child(even),
  #cast_area .cast_box .detail_box:nth-last-child(1) {
    margin: 0 0 25% 0;
  }

  /* media */
  #media_area .media_box {
    display: block;
    padding: 0 0 5% 0;
    margin: 0 0 8% 0;
  }
  #media_area .media_box .day_cat {
    width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 0 0 5% 0;
  }
  #media_area .media_box .day_cat .date {
    line-height: 1.5;
    margin: 0;
  }
  #media_area .media_box .day_cat .cat {
    box-sizing: border-box;
    border-radius: 4px;
    overflow: hidden;
    display: inline-block;
    width: auto;
    padding: 1.5% 3%;
    text-align: center;
  }
  #media_area .media_box .detail {
    position: relative;
    width: 100%;
    /* padding-top: calc((120/320)*100%); */
    padding-top: calc((100 / 320) * 100%);
  }
  .sub_sticker {
    width: 33%;
    top: 68.5%;
    right: unset;
    transform: rotate(-0);
    left: 1%;
  }
  /* music_dl */
  .music_inner {
    width: 100%;
  }
  .music_inner .subs_read,
  .music_inner .form_box,
  .music_inner .form_box .input_area,
  .music_inner .err {
    /* margin: 0 0 10% 0; */
  }
  .music_inner .form_box .input_area span::after {
    width: 60%;
    padding-top: 2px;
  }
  .music_inner .form_box .input_area .input_label {
    padding: 1.5625% 3%;
    width: 100%;
  }
  .music_inner .form_box .btn_box_column .btn {
    width: 48.5%;
  }
  .music_inner .dl_notice .dl_notice_inner {
    height: 60vw;
    max-height: 240px;
  }

  .music_inner .track_area .track_box {
    position: relative;
    display: block;
    margin: 0 0 10% 0;
    padding: 0 0 5% 0;
  }
  .music_inner .track_area .track_box .title {
    max-width: 100%;
    margin: 0 0 2.5% 0;
    text-align: center;
    letter-spacing: -0.05em;
  }
  .music_inner .track_area .track_box .title span {
    display: block;
    margin: 0;
  }
  .music_inner .track_area .track_box .dl_btn {
    position: relative;
    top: unset;
    right: unset;
    width: 80%;
    margin: 0 auto;
  }
  .music_inner .track_area .track_box .dl_btn a {
    padding: 3% 0;
  }
  .music_inner .sereal_img {
    width: 100%;
    margin: 0 auto 5% auto;
    background: transparent url(../img/sound/card_img.png) 0 0 / contain no-repeat;
    padding-top: calc((346 / 550) * 100%);
  }
}