@charset "UTF-8";
/*========================================
*	common
========================================*/
::selection {
  color: #000;
  background: #fff;
}

*,
*:after,
*:before {
  box-sizing: border-box;
}

*:focus {
  outline: 0;
}

html,
body {
  font-size: 62.5%;
  color: #fff;
  background-color: #000;
  font-family: "Noto Sans JP", sans-serif;
}

body {
  width: 100%;
}

a {
  color: #000;
  text-decoration: none;
}

h1,
h2,
h3 {
  line-height: 1;
}

ul,
li {
  list-style: none;
}

tr,
th,
td {
  font-weight: normal;
  text-align: left;
}

img,
picture {
  -webkit-backface-visibility: hidden;
  width: 100%;
  max-width: 100%;
  pointer-events: none;
  vertical-align: bottom;
}

.pc-none {
  display: none;
}
@media only screen and (max-width: 750px) {
  .pc-none {
    display: block;
  }
}

@media only screen and (max-width: 750px) {
  .sp-none {
    display: none;
  }
}

.txt-r {
  font-size: 1.6vw;
  vertical-align: super;
  font-weight: 400;
}
@media only screen and (min-width: 751px) {
  .txt-r {
    font-size: 0.6588579795vw;
  }
}

@media only screen and (max-width: 750px) {
  .header-hamburger {
    background-color: rgba(255, 255, 255, 0.25);
    width: 13.2vw;
    height: 13.2vw;
    padding: 0.9333333333vw;
    position: fixed;
    top: 2.4vw;
    right: 2.1333333333vw;
    z-index: 9;
    pointer-events: all;
    cursor: pointer;
  }
  .header-hamburger .is-menu,
  .header-hamburger .is-close {
    transition: opacity 0.2s;
  }
  .header-hamburger.js--active p .is-menu {
    opacity: 0;
  }
  .header-hamburger.js--active p .is-close {
    opacity: 1;
  }
  .header-hamburger__wrap {
    background-color: #fff;
    width: 100%;
    height: 100%;
    padding-top: 2.2666666667vw;
  }
  .header-hamburger__wrap p {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    color: #000;
    font-size: 2.6666666667vw;
    position: relative;
  }
  .header-hamburger__wrap p span {
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }
  .header-hamburger__wrap p .is-menu {
    opacity: 1;
  }
  .header-hamburger__wrap p .is-close {
    opacity: 0;
  }
  .header-hamburger__line {
    margin: 0 auto 0.5333333333vw;
    width: 7.2vw;
    height: 4vw;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1.0666666667vw;
    overflow: hidden;
  }
  .header-hamburger__line span {
    width: 7.2vw;
    height: 0.6666666667vw;
    display: flex;
    justify-content: center;
    gap: 0.4vw;
  }
  .header-hamburger__line span:before, .header-hamburger__line span:after {
    content: "";
    display: block;
    width: 3.3333333333vw;
    height: 100%;
    background-color: #000;
    transition: transform 0.2s;
  }
  .header-hamburger__line.js--active span {
    gap: 0;
  }
  .header-hamburger__line.js--active span:before {
    transform: translate3d(1%, 0, 0);
  }
  .header-hamburger__line.js--active span:after {
    transform: translate3d(-1%, 0, 0);
  }
  .header-hamburger__line.js--active span:first-of-type:before, .header-hamburger__line.js--active span:last-of-type:before {
    transform: translate3d(-120%, 0, 0);
  }
  .header-hamburger__line.js--active span:first-of-type:after, .header-hamburger__line.js--active span:last-of-type:after {
    transform: translate3d(120%, 0, 0);
  }
}
.header-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  z-index: 8;
  transition: opacity 0.4s;
}
.header-nav.js--active {
  opacity: 1;
  pointer-events: all;
}
@media only screen and (max-width: 750px) {
  .header-nav {
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.85);
    padding: 22.1333333333vw 0;
    overflow: scroll;
    pointer-events: none;
    overscroll-behavior-y: none;
  }
}
@media only screen and (min-width: 751px) {
  .header-nav {
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    height: 4.5387994143vw;
    opacity: 1;
    z-index: 2;
  }
}
.header-nav__list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media only screen and (min-width: 751px) {
  .header-nav__list {
    flex-direction: row;
  }
}
.header-nav__list--item {
  position: relative;
}
@media only screen and (max-width: 750px) {
  .header-nav__list--item {
    width: 100%;
    height: 16vw;
  }
}
@media only screen and (min-width: 751px) {
  .header-nav__list--item {
    padding-top: 1.3909224012vw;
  }
}
.header-nav__list--item:before {
  display: block;
  content: "";
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .header-nav__list--item:before {
    width: 8.345534407vw;
    height: 2.4524158126vw;
  }
}
.header-nav__list--item:not(:first-of-type) {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .header-nav__list--item:not(:first-of-type) {
    margin-top: 0;
    margin-left: 2.0131771596vw;
  }
}
.header-nav__list--item[data-update=true] a:after {
  display: block;
  content: "";
  background-image: url(../data/webp/common/icon_new.webp);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  width: 8.2666666667vw;
  height: 2.4vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .header-nav__list--item[data-update=true] a:after {
    width: 1.3909224012vw;
    height: 0.439238653vw;
  }
}
.header-nav__list--item a {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  color: #fff;
  font-size: 8vw;
  position: relative;
  width: fit-content;
}
@media only screen and (max-width: 750px) {
  .header-nav__list--item a {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 751px) {
  .header-nav__list--item a {
    display: block;
    font-size: 1.1713030747vw;
    letter-spacing: 0.16vw;
    text-indent: 0.16vw;
    padding: 0.9882869693vw 0 0;
  }
  .header-nav__list--item a span {
    position: relative;
    padding: 0 0.5490483163vw;
    text-shadow: 0 0.1464128843vw 0 rgba(0, 0, 0, 0.3);
  }
  .header-nav__list--item a span:before {
    display: block;
    content: "";
    background-color: #fff;
    width: 0%;
    height: 0.1464128843vw;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    transition: 400ms;
  }
  .header-nav__list--item a:hover span:before {
    width: 100%;
  }
}
.header-nav__list--item a[tabindex="-1"] {
  color: rgba(255, 255, 255, 0.25);
  pointer-events: none;
}
@media only screen and (max-width: 750px) {
  .header-nav__sns {
    background-color: #fff;
    color: #000;
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 5.76vw;
    letter-spacing: 0.36vw;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 53.3333333333vw;
    height: 13.3333333333vw;
    margin: 8.5333333333vw auto 0;
    position: relative;
  }
  .header-nav__sns:before {
    display: block;
    content: "";
    background: transparent url(../data/webp/common/icon_x_blk.webp) no-repeat;
    background-size: contain;
    width: 5.7333333333vw;
    height: 6vw;
    margin-right: 3.0666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .header-wrap:before {
    display: block;
    content: "";
    background: linear-gradient(to bottom, #000 0%, transparent 100%);
    width: 100%;
    height: 7.3206442167vw;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 500ms;
    pointer-events: none;
  }
  .header-wrap:has(.js--fixed) {
    position: fixed;
    width: 100%;
    height: 7.3206442167vw;
    z-index: 2;
  }
  .header-wrap:has(.js--fixed):before {
    opacity: 1;
  }
}

.footer {
  background-color: #292929;
  position: relative;
  z-index: 1;
}
.footer-top {
  background-color: #000;
}
.footer-top__txt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.4166666667;
  color: #999;
  font-size: 3.2vw;
  padding: 5.3333333333vw 4vw;
}
@media only screen and (min-width: 751px) {
  .footer-top__txt {
    font-size: 0.878477306vw;
    line-height: 1;
    text-align: center;
    padding: 1.4275256223vw 1.0980966325vw;
  }
}
.footer-top__txt a {
  color: #00c6ff;
  border-bottom: solid 0.2666666667vw #00c6ff;
}
@media only screen and (min-width: 751px) {
  .footer-top__txt a {
    border-bottom: solid min(0.0366032211vw, 1px) #00c6ff;
  }
}
.footer-center {
  padding: 7.4666666667vw 0 8.2666666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 4.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-center {
    padding: 2.0497803807vw 0 2.2693997072vw;
    gap: 1.8301610542vw;
  }
}
.footer-center__banner {
  width: 63.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-center__banner {
    width: 17.4963396779vw;
  }
}
.footer-center__sns {
  background: #000;
  border-radius: 50%;
  width: 12vw;
  height: 12vw;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .footer-center__sns {
    width: 3.074670571vw;
    height: 3.074670571vw;
    transition: 400ms;
  }
  .footer-center__sns:hover {
    background: #fff;
  }
  .footer-center__sns:hover .btn-off {
    opacity: 0;
  }
  .footer-center__sns:hover .btn-on {
    opacity: 1;
  }
}
.footer-center__sns span {
  width: 4.8vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
@media only screen and (min-width: 751px) {
  .footer-center__sns span {
    width: 1.2445095168vw;
    transition: 400ms;
  }
}
.footer-center__sns .btn-on {
  opacity: 0;
}
.footer-center__sns .btn-off {
  opacity: 1;
}
.footer-btm {
  background-color: #000;
  box-shadow: 0 0 2.6666666667vw rgba(0, 0, 0, 0.6);
}
@media only screen and (min-width: 751px) {
  .footer-btm {
    box-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.6);
  }
}
.footer-btm__wrap {
  padding: 10.6666666667vw 4vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__wrap {
    margin: 0 auto;
    padding: 3.3308931186vw 0;
    width: 53.8067349927vw;
  }
}
.footer-btm__copy {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: #ccc;
  font-size: 2.6666666667vw;
  line-height: 1.55;
}
@media only screen and (min-width: 751px) {
  .footer-btm__copy {
    font-size: 0.7320644217vw;
    line-height: 1.8;
    text-align: center;
  }
}
.footer-btm__pf {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 4.5333333333vw;
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__pf {
    margin-top: 2.0497803807vw;
    gap: 1.6105417277vw;
  }
}
.footer-btm__pf--item.switch {
  width: 29.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__pf--item.switch {
    width: 10.3221083455vw;
  }
}
.footer-btm__pf--item.ps {
  width: 28.6666666667vw;
  margin-left: 0.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__pf--item.ps {
    width: 9.9560761347vw;
    margin-left: 0.2928257687vw;
  }
}
.footer-btm__pf--item.steam {
  width: 23.6vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__pf--item.steam {
    width: 8.1991215227vw;
  }
}
.footer-btm__tm {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: #ccc;
  font-size: 2.6666666667vw;
  line-height: 1.55;
  margin-top: 6.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__tm {
    font-size: 0.7320644217vw;
    line-height: 1.8;
    text-align: center;
    margin-top: 1.9033674963vw;
  }
}
.footer-btm__tm span {
  display: inline-block;
}
.footer-btm__tm .logo-1 {
  width: 9.7333333333vw;
  vertical-align: middle;
}
@media only screen and (min-width: 751px) {
  .footer-btm__tm .logo-1 {
    width: 2.6720351391vw;
  }
}
.footer-btm__tm .logo-2 {
  width: 4.4vw;
  vertical-align: middle;
  margin-top: -0.2666666667vw;
  margin-left: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .footer-btm__tm .logo-2 {
    width: 1.2079062958vw;
    margin-top: -0.0732064422vw;
    margin-left: 0.1464128843vw;
  }
}

.common-main {
  position: relative;
  z-index: 1;
}
.common-wrap {
  margin: 0 auto;
  position: relative;
  z-index: 2;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .common-wrap {
    max-width: 91.21522694vw;
  }
}
.common-under {
  padding-top: 8.9333333333vw;
  margin-bottom: 11.3333333333vw;
  position: relative;
  overflow-x: hidden;
}
@media only screen and (min-width: 751px) {
  .common-under {
    padding-top: 1.9399707174vw;
    margin-bottom: 6.5153733529vw;
  }
}
.common-title {
  margin-bottom: 16.4vw;
}
@media only screen and (min-width: 751px) {
  .common-title {
    margin-bottom: 3.4407027818vw;
  }
}
.common-title__wrap {
  mix-blend-mode: overlay;
  position: relative;
  z-index: 1;
}
.common-title__roma {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 21.3333333333vw;
  position: absolute;
  z-index: -1;
  width: fit-content;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
  opacity: 0;
}
@media only screen and (min-width: 751px) {
  .common-title__roma {
    font-size: 13.17715959vw;
  }
}
.common-title__h1 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  letter-spacing: 1vw;
  text-indent: 1vw;
  position: relative;
  z-index: 1;
  text-align: center;
  padding-top: 8.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .common-title__h1 {
    font-size: 1.8301610542vw;
    letter-spacing: 0.25vw;
    text-indent: 0.25vw;
    padding-top: 4.4655929722vw;
  }
}
.common-title__h1:after {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/parts_title.webp) no-repeat;
  background-size: contain;
  width: 69.2vw;
  height: 15.3333333333vw;
  position: absolute;
  top: 11.4666666667vw;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .common-title__h1:after {
    width: 18.9970717423vw;
    height: 4.2093704246vw;
    top: 5.0512445095vw;
  }
}
.common-parts {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .common-parts {
    left: 50%;
    transform: translateX(-50%);
    width: 91.5080527086vw;
  }
}
.common-parts__top, .common-parts__btm {
  width: 100%;
  height: 1.3333333333vw;
  position: absolute;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .common-parts__top, .common-parts__btm {
    height: 0.439238653vw;
  }
}
.common-parts__top:before, .common-parts__top:after, .common-parts__btm:before, .common-parts__btm:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .common-parts__top:before, .common-parts__top:after, .common-parts__btm:before, .common-parts__btm:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
  }
}
.common-parts__top:before, .common-parts__btm:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .common-parts__top:before, .common-parts__btm:before {
    left: 1.2445095168vw;
  }
}
.common-parts__top:after, .common-parts__btm:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .common-parts__top:after, .common-parts__btm:after {
    right: 1.2445095168vw;
  }
}
.common-parts__top {
  top: 32vw;
}
@media only screen and (min-width: 751px) {
  .common-parts__top {
    top: 6.2225475842vw;
  }
}
.common-parts__btm {
  bottom: 0;
}
@media only screen and (min-width: 751px) {
  .common-parts__btm {
    bottom: 0;
  }
}
.common-article__title {
  padding: 0 4vw 7.7333333333vw;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .common-article__title {
    padding: 0 2.5622254758vw 1.7203513909vw;
  }
}
.common-article__title:after {
  display: block;
  content: "";
  background: linear-gradient(to left, #a200ff 0%, #ed0000 100%);
  background-size: 130% auto;
  width: 100%;
  height: 0.8vw;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .common-article__title:after {
    height: 0.1464128843vw;
  }
}
.common-article__title--h2 {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.6vw;
  line-height: 1.5238095238;
  margin-bottom: 3.2vw;
}
@media only screen and (min-width: 751px) {
  .common-article__title--h2 {
    font-size: 1.4641288433vw;
    line-height: 1.6;
    margin-bottom: 0.0732064422vw;
  }
}
.common-article__title--date {
  display: inline-block;
  color: #bbbbbb;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.4586666667vw;
  margin-left: 3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .common-article__title--date {
    font-size: 0.7909956076vw;
    margin-left: 0.8418740849vw;
  }
}
.common-article__title--tag {
  display: inline-block;
  background-color: #fff;
  height: 5.6vw;
  padding: 0 2.4vw 0.2666666667vw 1.8666666667vw;
  color: #000;
  font-size: 3.4586666667vw;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  position: relative;
  margin-left: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .common-article__title--tag {
    height: 1.2811127379vw;
    padding: 0 0.5490483163vw 0.0732064422vw 0.439238653vw;
    font-size: 0.7909956076vw;
    margin-left: 0.5490483163vw;
  }
}
.common-article__title--tag:before {
  display: block;
  content: "";
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10.531 24.625' fill='rgb(255,255,255)'><path d='M0.481,25.173H79.353V0.565H0.481V10.926H9.532v3.98l-9.051-.095V25.173Z' transform='translate(-0.469 -0.563)'/></svg>");
  background-repeat: no-repeat;
  background-size: auto 100%;
  width: 2.4vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: -2.4vw;
}
@media only screen and (min-width: 751px) {
  .common-article__title--tag:before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.406 34.219' fill='rgb(255,255,255)'><path d='M0.6,34.566H110.4V0.343H0.6v14.41H13.2v5.535L0.6,20.157v14.41Z' transform='translate(-0.594 -0.344)'/></svg>");
    width: 0.5490483163vw;
    left: -0.5490483163vw;
  }
}
.common-article__title--tag span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.common-article__title--tag.new {
  background-color: #ff0000;
  color: #fff;
}
.common-article__title--tag.new:before {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10.531 24.625' fill='rgb(255,0,0)'><path d='M0.481,25.173H79.353V0.565H0.481V10.926H9.532v3.98l-9.051-.095V25.173Z' transform='translate(-0.469 -0.563)'/></svg>");
}
.common-article__wrap {
  padding: 9.3333333333vw 4vw 10vw;
}
@media only screen and (min-width: 751px) {
  .common-article__wrap {
    padding: 1.6105417277vw 2.5622254758vw 2.7452415813vw;
  }
}
.common-article__body {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.3846153846;
}
@media only screen and (min-width: 751px) {
  .common-article__body {
    font-size: 1.0248901903vw;
    line-height: 1.4285714286;
  }
}
.common-article__body > img {
  display: block;
  margin: 0 auto;
  width: auto;
  height: auto;
}
.common-article__body div {
  margin: 0 auto;
}
.common-article__body div > img {
  display: block;
  margin: 0 auto;
  width: auto;
  height: auto;
}
.common-article__body p {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.3846153846;
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .common-article__body p {
    font-size: 1.0248901903vw;
    line-height: 1.4285714286;
    margin-top: 1.8301610542vw;
  }
}
.common-article__body ul {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .common-article__body ul {
    margin-top: 1.8301610542vw;
  }
}
.common-article__body ul li {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.3846153846;
  display: flex;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .common-article__body ul li {
    font-size: 1.0248901903vw;
    line-height: 1.4285714286;
  }
}
.common-article__body ul li:before {
  display: block;
  content: "";
  content: "・";
  display: inline-block;
}
.common-article__body ul li:has(ul.list-small) ul.list-small {
  margin-top: 0;
}
.common-article__body ul li:has(ul.list-small):before {
  content: "";
}
.common-article__body ul.list-small li {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.9333333333vw;
  line-height: 1.6363636364;
}
@media only screen and (min-width: 751px) {
  .common-article__body ul.list-small li {
    font-size: 0.7320644217vw;
    line-height: 1.3;
  }
}
.common-article__body ul.list-small li:before {
  content: "※";
}
.common-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .common-tab {
    gap: 1.0980966325vw;
  }
}
.common-tab__item {
  width: 29.4666666667vw;
  height: 10vw;
}
@media only screen and (min-width: 751px) {
  .common-tab__item {
    width: 9.0409956076vw;
    height: 1.9765739385vw;
  }
}
.common-tab__item--btn {
  background: linear-gradient(to left, #222 0%, #222 100%);
  background-size: 120% auto;
  background-position: center;
  clip-path: polygon(0% 0%, 100% 0, 100% 7.8666666667vw, 27.3333333333vw 100%, 0% 100%);
  color: #fff;
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.2307692308;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
  cursor: pointer;
  pointer-events: all;
}
@media only screen and (min-width: 751px) {
  .common-tab__item--btn:after {
    transition: 400ms;
  }
  .common-tab__item--btn:hover:after {
    opacity: 1;
  }
}
@media only screen and (min-width: 751px) {
  .common-tab__item--btn {
    clip-path: polygon(0% 0%, 100% 0, 100% 1.3909224012vw, 8.4553440703vw 100%, 0% 100%);
    font-size: 0.9516837482vw;
  }
  .common-tab__item--btn:after {
    display: block;
    content: "";
    background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
  }
}
.common-tab__item--btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
.common-tab__item--btn.js--active {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.common-faq__item {
  background-color: rgba(0, 0, 0, 0.5);
}
.common-faq__item:not(:first-of-type) {
  margin-top: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .common-faq__item:not(:first-of-type) {
    margin-top: 1.0980966325vw;
  }
}
.common-faq__item.is-open .common-faq__item--answer {
  max-height: none;
}
.common-faq__item.is-open .common-faq__item--icon {
  transform: translate3d(0, -50%, 0) rotate(90deg);
}
.common-faq__item.is-open .common-faq__item--icon:before {
  opacity: 0;
}
.common-faq__item--wrap {
  display: flex;
  flex-direction: row;
  gap: 4.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--wrap {
    gap: 1.3543191801vw;
  }
}
.common-faq__item--grad {
  background: linear-gradient(135deg, #6c00ff 20%, #ff008f 80%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  height: max-content;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--grad {
    font-size: 1.8301610542vw;
  }
}
.common-faq__item--ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
  line-height: 1.4375;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--ttl {
    font-size: 1.317715959vw;
    line-height: 1.3333333333;
    transition: 400ms;
  }
}
.common-faq__item--txt p {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.4166666667;
  word-break: break-all;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--txt p {
    font-size: 0.878477306vw;
    line-height: 1.5;
  }
}
.common-faq__item--txt p:not(:first-of-type) {
  margin-top: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--txt p:not(:first-of-type) {
    margin-top: 1.0980966325vw;
  }
}
.common-faq__item--txt a {
  word-break: break-all;
  color: #00c6ff;
  cursor: pointer;
  pointer-events: all;
  border-bottom: solid 0.2666666667vw #00c6ff;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--txt a {
    border-bottom: solid min(0.0366032211vw, 1px) #00c6ff;
  }
}
.common-faq__item--txt li,
.common-faq__item--txt span {
  color: #ccc;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.5;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--txt li,
  .common-faq__item--txt span {
    font-size: 0.7320644217vw;
    line-height: 1.5;
  }
}
.common-faq__item--question {
  padding: 5.7333333333vw 10.4vw 6.6666666667vw 5.3333333333vw;
  position: relative;
  z-index: 2;
  cursor: pointer;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--question {
    padding: 1.3909224012vw 2.9282576867vw 1.3543191801vw 1.5739385066vw;
  }
  .common-faq__item--question:hover .common-faq__item--ttl,
  .common-faq__item--question:hover .common-faq__item--icon {
    opacity: 70%;
  }
}
@media only screen and (max-width: 750px) {
  .common-faq__item--question .common-faq__item--wrap {
    align-items: center;
  }
}
@media only screen and (min-width: 751px) {
  .common-faq__item--question .common-faq__item--ttl {
    margin-top: 0.1464128843vw;
  }
}
.common-faq__item--answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 400ms ease;
}
.common-faq__item--answer .common-faq__item--wrap {
  padding: 5.7333333333vw 2.6666666667vw 6.6666666667vw 5.3333333333vw;
  border-top: solid 0.5333333333vw rgba(255, 255, 255, 0.5);
}
@media only screen and (min-width: 751px) {
  .common-faq__item--answer .common-faq__item--wrap {
    padding: 1.317715959vw 1.6837481698vw 1.3543191801vw 1.5739385066vw;
    border-top-width: 0.0732064422vw;
  }
}
.common-faq__item--answer .common-faq__item--txt {
  margin-top: 1.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--answer .common-faq__item--txt {
    margin-top: 0.3660322108vw;
  }
}
.common-faq__item--icon {
  width: 5.8666666667vw;
  height: 5.8666666667vw;
  position: absolute;
  top: 50%;
  right: 2.6666666667vw;
  transform: translate3d(0, -50%, 0) rotate(0deg);
  transition: 400ms;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--icon {
    width: 1.6105417277vw;
    height: 1.6105417277vw;
    right: 0.7320644217vw;
  }
}
.common-faq__item--icon:before, .common-faq__item--icon:after {
  content: "";
  display: block;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.common-faq__item--icon:before {
  width: 100%;
  height: 0.8vw;
  opacity: 1;
  transition: 400ms;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--icon:before {
    height: 0.2196193265vw;
  }
}
.common-faq__item--icon:after {
  width: 0.8vw;
  height: 100%;
}
@media only screen and (min-width: 751px) {
  .common-faq__item--icon:after {
    width: 0.2196193265vw;
  }
}

.bg {
  background: transparent url(../data/webp/common/bg.webp) no-repeat;
  background-size: cover;
  background-position: top center;
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .bg {
    height: 100%;
  }
}
.bg-line {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .bg-line {
    width: 91.5080527086vw;
  }
}
.bg-line span {
  background: #fff;
  position: absolute;
  width: 0.2666666667vw;
  height: 100%;
  top: 0;
  left: 50%;
  opacity: 10%;
}
@media only screen and (min-width: 751px) {
  .bg-line span {
    width: 0.0732064422vw;
  }
}
.bg-line span:before {
  display: block;
  content: "";
  background: #fff;
  width: 0.8vw;
  height: 2.6666666667vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .bg-line span:before {
    width: 0.2196193265vw;
    height: 1.0248901903vw;
  }
}
.bg-line span:nth-child(2) {
  display: block;
  left: calc(50% + 34.6666666667vw);
}
@media only screen and (min-width: 751px) {
  .bg-line span:nth-child(2) {
    left: 0;
    opacity: 100%;
  }
}
.bg-line span:nth-child(3) {
  display: block;
  left: calc(50% - 34.6666666667vw);
}
@media only screen and (min-width: 751px) {
  .bg-line span:nth-child(3) {
    left: calc(50% - 15.0805270864vw);
  }
}
@media only screen and (min-width: 751px) {
  .bg-line span:nth-child(4) {
    left: calc(50% - 30.1610541728vw);
  }
}
@media only screen and (min-width: 751px) {
  .bg-line span:nth-child(5) {
    left: calc(50% + 15.0805270864vw);
  }
}
@media only screen and (min-width: 751px) {
  .bg-line span:nth-child(6) {
    left: calc(50% + 30.1610541728vw);
  }
}
@media only screen and (min-width: 751px) {
  .bg-line span:last-child {
    opacity: 100%;
    left: 100%;
  }
}
.bg-fall {
  position: fixed;
  width: 100%;
  height: 100dvh;
  top: 0;
  left: 0;
  z-index: 2;
}
.bg-fall span {
  display: block;
  background: linear-gradient(to bottom, transparent 0%, rgba(255, 255, 255, 0.5) 100%);
  width: 0.2666666667vw;
  height: 40vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-50px);
  opacity: 0;
  animation: fall linear infinite;
  animation-duration: 12s;
}
@media only screen and (min-width: 751px) {
  .bg-fall span {
    width: 0.0732064422vw;
    height: 9.1508052709vw;
  }
}
.bg-fall span:nth-of-type(1) {
  animation-delay: 3s;
}
.bg-fall span:nth-of-type(2) {
  display: block;
  left: calc(50% + 34.6666666667vw);
  animation-delay: 5s;
}
@media only screen and (min-width: 751px) {
  .bg-fall span:nth-of-type(2) {
    left: calc(50% + 15.0805270864vw);
  }
}
.bg-fall span:nth-of-type(3) {
  display: block;
  left: calc(50% - 34.6666666667vw);
  animation-delay: 5s;
}
@media only screen and (min-width: 751px) {
  .bg-fall span:nth-of-type(3) {
    left: calc(50% - 15.0805270864vw);
  }
}
@media only screen and (max-width: 750px) {
  .bg-fall span:nth-of-type(4) {
    display: none;
  }
}
@media only screen and (min-width: 751px) {
  .bg-fall span:nth-of-type(4) {
    left: calc(50% - 30.1610541728vw);
    animation-delay: 7s;
  }
}
@media only screen and (max-width: 750px) {
  .bg-fall span:nth-of-type(5) {
    display: none;
  }
}
@media only screen and (min-width: 751px) {
  .bg-fall span:nth-of-type(5) {
    animation-delay: 7s;
    left: calc(50% + 30.1610541728vw);
  }
}

.modal-vdo {
  background-color: rgba(0, 0, 0, 0.75);
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
  transition: 400ms;
}
.modal-vdo.js--show {
  opacity: 1;
  pointer-events: all;
  z-index: 9;
}
.modal-vdo__wrap {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
@media only screen and (min-width: 751px) {
  .modal-vdo__wrap {
    width: 87.8477306003vw;
  }
}
.modal-vdo__iframe {
  margin: 0 auto;
  width: 100%;
}
.modal-vdo__iframe iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}
.modal-close {
  background: transparent url(../data/webp/common/btn_close.webp) no-repeat;
  background-size: contain;
  width: 8.5333333333vw;
  height: 10.4vw;
  position: absolute;
  top: 3.8666666667vw;
  right: 4.1333333333vw;
  cursor: pointer;
  pointer-events: all;
}
@media only screen and (min-width: 751px) {
  .modal-close {
    transition: 400ms;
  }
  .modal-close:hover {
    opacity: 0.8;
  }
}
@media only screen and (min-width: 751px) {
  .modal-close {
    width: 2.9282576867vw;
    height: 3.5871156662vw;
    top: 2.2327964861vw;
    right: 2.8550512445vw;
  }
}
.modal-song {
  background-color: rgba(0, 0, 0, 0.75);
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
  transition: 400ms;
}
.modal-song.js--show {
  opacity: 1;
  pointer-events: all;
  z-index: 9;
}
@media only screen and (max-width: 750px) {
  .modal-song.js--show {
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: scroll;
  }
}
.modal-song__wrap {
  width: 100%;
  position: absolute;
  top: 0;
}
@media only screen and (min-width: 751px) {
  .modal-song__wrap {
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 81.0395314788vw;
  }
}
@media only screen and (max-width: 750px) {
  .modal-song__item {
    margin-top: 18.6666666667vw;
    margin-bottom: 11.7333333333vw;
  }
}

@keyframes loading-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.loading {
  background-color: #000;
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 1;
  z-index: 100;
}
.loading.js--hide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 1000ms;
}
.loading-rings {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.loading-ring {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.loading-ring_1 {
  background: transparent url(../data/webp/common/bg_circle_1.webp) no-repeat;
  background-size: 100% auto;
  animation: loading-rotate 4s linear infinite;
}
.loading-ring_2 {
  background: transparent url(../data/webp/common/bg_circle_2.webp) no-repeat;
  background-size: 100% auto;
  animation: loading-rotate 5s linear infinite;
}
.loading-ring_3 {
  background: transparent url(../data/webp/common/bg_circle_3.webp) no-repeat;
  background-size: 100% auto;
  animation: loading-rotate 4.5s linear infinite;
}
.loading-ring_4 {
  background: transparent url(../data/webp/common/bg_circle_4.webp) no-repeat;
  background-size: 100% auto;
  animation: loading-rotate 5.5s linear infinite;
}
.loading-text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33.3333333333vw;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}
@media only screen and (min-width: 751px) {
  .loading-text {
    width: 9.1508052709vw;
  }
}
.loading-item {
  border-radius: 50%;
  width: 72vw !important;
  height: 72vw !important;
  position: absolute;
  top: 50dvh;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.loading-item canvas {
  width: 100% !important;
  height: 100% !important;
}
@media only screen and (min-width: 751px) {
  .loading-item {
    width: 19.7657393851vw !important;
    height: 19.7657393851vw !important;
  }
}

.opening {
  width: 100%;
  height: 200dvh;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  opacity: 1;
  z-index: 9;
  pointer-events: none;
  overflow-x: hidden;
  background: #000;
}
@media only screen and (max-width: 750px) {
  .opening {
    overflow: hidden;
  }
}
.opening.js--white {
  background: transparent;
}
.opening.js--hide {
  opacity: 0;
  pointer-events: none;
}
.opening-shine {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
  background: #fff;
  opacity: 0;
}
.opening-shine.js--anime {
  transition: opacity 800ms;
  opacity: 1;
}
.opening-line {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.opening-line.js--hide {
  opacity: 0;
}
.opening-line video {
  width: calc(100% + 29.3333333333vw);
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0vw;
  z-index: -1;
  top: -9.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .opening-line video {
    width: calc(100% + 8.0527086384vw);
    top: -9.5168374817vw;
    left: -12.4450951684vw;
  }
}
.opening-item {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.opening-item.js--hide {
  opacity: 0;
}
.opening-item__logo {
  width: 100%;
  height: 49.0666666667vw;
  position: absolute;
  top: 36.5333333333vw;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .opening-item__logo {
    width: 53.4040995608vw;
    height: 21.9985358712vw;
    top: 12.0058565154vw;
    left: 11.2737920937vw;
  }
}
.opening-item__logo--wh {
  position: absolute;
  top: 0;
  left: 0;
}
.opening-item__logo--wh.js--anime {
  transition: opacity 800ms;
  opacity: 0;
}
.opening-ring {
  position: absolute;
  width: 100%;
  top: -81.3333333333vw;
  left: 0;
}
.opening-ring.js--hide {
  opacity: 0;
}
@media only screen and (min-width: 751px) {
  .opening-ring {
    width: 124.2313323572vw;
    top: -34.0409956076vw;
    left: -34.0409956076vw;
  }
  .opening-ring.js--scrollbar {
    left: -34.6998535871vw;
  }
}
.opening-ring video {
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .opening-ring video {
    object-fit: contain;
  }
}

.pagination {
  margin: 0 auto;
  width: 92vw;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .pagination {
    width: 25.6222547584vw;
    gap: 1.3909224012vw;
  }
}
.pagination-prev, .pagination-next {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2vw;
}
@media only screen and (min-width: 751px) {
  .pagination-prev, .pagination-next {
    gap: 0.439238653vw;
  }
  .pagination-prev:hover span:before, .pagination-next:hover span:before {
    width: 100%;
  }
}
.pagination-prev span, .pagination-next span {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 3.3333333333vw;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .pagination-prev span, .pagination-next span {
    font-size: 1.0248901903vw;
  }
  .pagination-prev span:before, .pagination-next span:before {
    display: block;
    content: "";
    background-color: #fff;
    width: 0%;
    height: 0.2928257687vw;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    transition: 400ms;
  }
}
.pagination-prev:after {
  display: block;
  content: "";
  background: transparent url(../img/common/arrow_wh.svg) no-repeat;
  background-size: contain;
  width: 4.8vw;
  height: 5.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .pagination-prev:after {
    width: 1.0614934114vw;
    height: 1.2445095168vw;
  }
}
.pagination-next:before {
  display: block;
  content: "";
  background: transparent url(../img/common/arrow_wh.svg) no-repeat;
  background-size: contain;
  width: 4.8vw;
  height: 5.7333333333vw;
  transform: rotate(180deg);
}
@media only screen and (min-width: 751px) {
  .pagination-next:before {
    width: 1.0614934114vw;
    height: 1.2445095168vw;
  }
}
.pagination-num {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .pagination-num {
    gap: 0.439238653vw;
  }
}
.pagination-num__item {
  background-color: #222;
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 6vw;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10vw;
  height: 12vw;
}
@media only screen and (min-width: 751px) {
  .pagination-num__item {
    font-size: 1.317715959vw;
    width: 2.196193265vw;
    height: 2.635431918vw;
    transition: 400ms;
  }
  .pagination-num__item:hover {
    background-color: #fff;
    color: #222;
  }
}
.pagination-num__item.current {
  background-color: #fff;
  color: #000;
}

@keyframes glitch-main {
  0% {
    transform: translateX(-25%);
    opacity: 1;
  }
  5% {
    transform: translateX(20%);
  }
  10% {
    transform: translateX(-15%);
  }
  15% {
    transform: translateX(10%);
  }
  20% {
    transform: translateX(-10%);
  }
  25% {
    transform: translateX(5%);
  }
  30% {
    transform: translateX(-5%);
  }
  35% {
    transform: translateX(4%);
  }
  40% {
    transform: translateX(-3%);
  }
  45% {
    transform: translateX(2%);
  }
  50% {
    transform: translateX(-1%);
  }
  55% {
    transform: translateX(1%);
  }
  60% {
    transform: translateX(-0.5%);
  }
  65% {
    transform: translateX(0.5%);
  }
  70% {
    transform: translateX(-0.25%);
  }
  75% {
    transform: translateX(0.25%);
  }
  80% {
    transform: translateX(-0.1%);
  }
  85% {
    transform: translateX(0.1%);
  }
  90% {
    transform: translateX(-0.05%);
  }
  95% {
    transform: translateX(0.05%);
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}
@keyframes glitch-anime01 {
  0% {
    transform: translateX(-25%);
    opacity: 1;
  }
  5% {
    transform: translateX(20%);
  }
  10% {
    transform: translateX(-15%);
  }
  15% {
    transform: translateX(10%);
  }
  20% {
    transform: translateX(-10%);
    opacity: 0;
  }
  25% {
    transform: translateX(5%);
  }
  30% {
    transform: translateX(-5%);
  }
  35% {
    transform: translateX(4%);
  }
  40% {
    transform: translateX(-3%);
  }
  45% {
    transform: translateX(2%);
  }
  50% {
    transform: translateX(-1%);
  }
  55% {
    transform: translateX(1%);
  }
  60% {
    transform: translateX(-0.5%);
  }
  65% {
    transform: translateX(0.5%);
  }
  70% {
    transform: translateX(-0.25%);
  }
  75% {
    transform: translateX(0.25%);
  }
  80% {
    transform: translateX(-0.1%);
  }
  85% {
    transform: translateX(0.1%);
  }
  90% {
    transform: translateX(-0.05%);
  }
  95% {
    transform: translateX(0.05%);
  }
  100% {
    transform: translateX(0%);
    opacity: 0;
  }
}
@keyframes glitch-anime02 {
  0% {
    transform: translateX(25%);
    opacity: 1;
  }
  5% {
    transform: translateX(-20%);
  }
  10% {
    transform: translateX(15%);
  }
  15% {
    transform: translateX(-10%);
  }
  20% {
    transform: translateX(10%);
    opacity: 0;
  }
  25% {
    transform: translateX(-5%);
  }
  30% {
    transform: translateX(5%);
  }
  35% {
    transform: translateX(-4%);
  }
  40% {
    transform: translateX(3%);
  }
  45% {
    transform: translateX(-2%);
  }
  50% {
    transform: translateX(1%);
  }
  55% {
    transform: translateX(-1%);
  }
  60% {
    transform: translateX(0.5%);
  }
  65% {
    transform: translateX(-0.5%);
  }
  70% {
    transform: translateX(0.25%);
  }
  75% {
    transform: translateX(-0.25%);
  }
  80% {
    transform: translateX(0.1%);
  }
  85% {
    transform: translateX(-0.1%);
  }
  90% {
    transform: translateX(0.05%);
  }
  95% {
    transform: translateX(-0.05%);
  }
  100% {
    transform: translateX(0%);
    opacity: 0;
  }
}
@keyframes glitch-anime03 {
  0% {
    transform: translateX(-25%);
    opacity: 1;
  }
  5% {
    transform: translateX(20%);
  }
  10% {
    transform: translateX(-15%);
  }
  15% {
    transform: translateX(10%);
  }
  20% {
    transform: translateX(-10%);
    opacity: 0;
  }
  25% {
    transform: translateX(5%);
  }
  30% {
    transform: translateX(-5%);
  }
  35% {
    transform: translateX(4%);
  }
  40% {
    transform: translateX(-3%);
  }
  45% {
    transform: translateX(2%);
  }
  50% {
    transform: translateX(-1%);
  }
  55% {
    transform: translateX(1%);
  }
  60% {
    transform: translateX(-0.5%);
  }
  65% {
    transform: translateX(0.5%);
  }
  70% {
    transform: translateX(-0.25%);
  }
  75% {
    transform: translateX(0.25%);
  }
  80% {
    transform: translateX(-0.1%);
  }
  85% {
    transform: translateX(0.1%);
  }
  90% {
    transform: translateX(-0.05%);
  }
  95% {
    transform: translateX(0.05%);
  }
  100% {
    transform: translateX(0%);
    opacity: 0;
  }
}
.common-glitch__inner {
  position: relative;
  opacity: 0;
}
.common-glitch__inner.js--anime {
  opacity: 1;
}
.common-glitch__inner.js--anime .common-glitch__dummy {
  animation: glitch-main 0.6s linear forwards;
  animation-timing-function: steps(1, end);
  animation-delay: 400ms;
}
.common-glitch__inner.js--anime .common-glitch__anime01 {
  animation: glitch-anime01 0.6s linear;
  animation-timing-function: steps(1, end);
  animation-delay: 400ms;
}
.common-glitch__inner.js--anime .common-glitch__anime02 {
  animation: glitch-anime02 0.6s linear;
  animation-timing-function: steps(1, end);
  animation-delay: 400ms;
}
.common-glitch__inner.js--anime .common-glitch__anime03 {
  animation: glitch-anime03 0.6s linear;
  animation-timing-function: steps(1, end);
  animation-delay: 400ms;
}
.common-glitch__dummy {
  position: relative;
  opacity: 0;
}
.common-glitch__main {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.common-glitch__main img {
  position: absolute;
  width: 100%;
}
.common-glitch__main img.common-glitch__anime01 {
  opacity: 0;
  mask-size: 100% 56%;
  mask-image: repeating-linear-gradient(0deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 10px, rgba(0, 0, 0, 0) 10px, rgba(0, 0, 0, 0) 12px, rgb(0, 0, 0) 12px, rgb(0, 0, 0) 17px, rgba(0, 0, 0, 0) 17px, rgba(0, 0, 0, 0) 25px);
}
.common-glitch__main img.common-glitch__anime02 {
  opacity: 0;
  mask-size: 100% 30%;
  mask-image: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0) 7px, rgb(0, 0, 0) 7px, rgb(0, 0, 0) 11px, rgba(0, 0, 0, 0) 11px, rgba(0, 0, 0, 0) 20px, rgb(0, 0, 0) 20px, rgb(0, 0, 0) 30px);
}
.common-glitch__main img.common-glitch__anime03 {
  opacity: 0;
  mask-size: 100% 6%;
  mask-image: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0) 5px, rgb(0, 0, 0) 5px, rgb(0, 0, 0) 15px, rgba(0, 0, 0, 0) 15px, rgba(0, 0, 0, 0) 35px, rgb(0, 0, 0) 35px, rgb(0, 0, 0) 50px);
}

.sns {
  width: 11.4666666667vw;
  position: absolute;
  top: 17.3333333333vw;
  right: 3.0666666667vw;
  z-index: 4;
}
@media only screen and (min-width: 751px) {
  .sns {
    width: 4.2459736457vw;
    top: 0;
    right: auto;
    left: 0;
    z-index: 2;
  }
}
.sns-btn {
  background-color: rgba(0, 0, 0, 0.75);
  display: block;
}
@media only screen and (min-width: 751px) {
  .sns-btn {
    transition: 400ms;
  }
  .sns-btn:hover {
    background-color: rgba(255, 255, 255, 0.75);
  }
  .sns-btn:hover .sns-btn__icon {
    background-color: #fff;
  }
  .sns-btn:hover .sns-btn__icon--item .btn-off {
    opacity: 0;
  }
  .sns-btn:hover .sns-btn__icon--item .btn-on {
    opacity: 1;
  }
  .sns-btn:hover .sns-btn__text p {
    color: #000;
  }
}
.sns-btn__icon {
  background-color: rgba(0, 0, 0, 0.9);
  width: 100%;
  height: 11.4666666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 751px) {
  .sns-btn__icon {
    background-color: #000;
    height: 4.2459736457vw;
    transition: 400ms;
  }
}
.sns-btn__icon--item {
  width: 6.1333333333vw;
  height: 6.4vw;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .sns-btn__icon--item {
    width: 1.4275256223vw;
    height: 1.4641288433vw;
  }
}
.sns-btn__icon--item span {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .sns-btn__icon--item span {
    transition: 400ms;
  }
}
.sns-btn__icon--item .btn-off {
  opacity: 1;
}
.sns-btn__icon--item .btn-on {
  opacity: 0;
}
@media only screen and (min-width: 751px) {
  .sns-btn__text {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1.7203513909vw;
    padding-bottom: 2.5622254758vw;
  }
  .sns-btn__text p {
    color: #fff;
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 1.4231332357vw;
    writing-mode: vertical-rl;
    letter-spacing: 0.1em;
    transition: 400ms;
  }
}
@media only screen and (min-width: 751px) {
  .sns.js--scrollbar {
    width: 13.0666666667vw;
    max-width: 3.5871156662vw;
    top: 0;
    right: auto;
    left: 0;
  }
  .sns.js--scrollbar .sns-btn__icon {
    height: 3.5871156662vw;
    max-height: 3.5871156662vw;
  }
}
@media only screen and (min-width: 1024px) {
  .sns.js--scrollbar {
    width: 13.0666666667vw;
    max-width: 3.5871156662vw;
  }
  .sns.js--scrollbar .sns-btn__icon {
    height: 3.5871156662vw;
    max-height: 3.5871156662vw;
  }
}
@media only screen and (min-width: 1440px) {
  .sns.js--scrollbar {
    max-width: 3.8067349927vw;
  }
  .sns.js--scrollbar .sns-btn__icon {
    max-height: 3.8067349927vw;
  }
}
@media only screen and (min-width: 1920px) {
  .sns.js--scrollbar {
    max-width: 3.8799414348vw;
  }
  .sns.js--scrollbar .sns-btn__icon {
    max-height: 3.8799414348vw;
  }
}

.popup {
  background: rgba(0, 0, 0, 0.75);
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  cursor: none;
  transition: 400ms;
  z-index: -2;
}
.popup.js--show {
  opacity: 1;
  cursor: auto;
  z-index: 9;
  overflow-y: auto;
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.popup.js--show::-webkit-scrollbar {
  display: none;
}
.popup-block {
  position: relative;
  padding-top: 20vw;
}
@media only screen and (min-width: 751px) {
  .popup-block {
    padding-top: 0;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 51.2445095168vw;
  }
}
.popup-block__title {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  text-shadow: 0 0 2.6666666667vw #000;
  height: 23.6vw;
  position: relative;
  z-index: 2;
  padding-top: 8.8vw;
  text-align: center;
  letter-spacing: 0.15em;
  text-indent: 0.15em;
}
@media only screen and (min-width: 751px) {
  .popup-block__title {
    font-size: 1.4641288433vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
    height: 4.5387994143vw;
    padding-top: 1.4641288433vw;
  }
}
.popup-block__title:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .popup-block__title:before {
    background-image: url(../data/webp/common/bg_title_pc.webp);
    width: 51.3909224012vw;
    height: 4.5387994143vw;
  }
}
.popup-block__body {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  backdrop-filter: blur(10px);
  margin: 0 auto;
  width: 100%;
  padding: 12.2666666667vw 0 15.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .popup-block__body {
    clip-path: polygon(0 0, 10.4319180088vw 0, 11.3469985359vw 1.0980966325vw, 40.0439238653vw 1.0980966325vw, 40.8491947291vw 0, 100% 0, 100% 0%, 100% 100%, 0% 100%, 0% 100%, 0 100%, 0% 0%);
    padding: 3.3674963397vw 4.7218155198vw 4.0629575403vw;
    margin-top: -1.4641288433vw;
  }
}
.popup-block__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin: 8vw auto 0;
  width: 84.9333333333vw;
  gap: 6.1333333333vw 2.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .popup-block__btn {
    margin-top: 2.0497803807vw;
    width: 34.0775988287vw;
    gap: 1.2811127379vw 0.8418740849vw;
  }
}
.popup-block__btn--item {
  background: linear-gradient(90deg, #fff 0%, #fff 100%);
  position: relative;
  width: 84.9333333333vw;
  height: 16vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4.2666666667vw;
  padding: 0 0 2.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .popup-block__btn--item {
    width: 19.9487554905vw;
    height: 4.39238653vw;
    font-size: 1.1713030747vw;
    padding: 0.878477306vw 0 0.8052708638vw;
    transition: 400ms;
  }
  .popup-block__btn--item:after {
    display: block;
    content: "";
    background: linear-gradient(90deg, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: 400ms;
    z-index: 1;
  }
  .popup-block__btn--item:hover .is-off {
    opacity: 0;
  }
  .popup-block__btn--item:hover .is-on {
    opacity: 1;
  }
  .popup-block__btn--item:hover:after {
    opacity: 1;
  }
}
.popup-block__btn--item:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/product/bg_btn.webp) no-repeat;
  background-size: 100% auto;
  background-position: bottom;
  width: 100%;
  height: 16vw;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .popup-block__btn--item:before {
    height: 4.39238653vw;
    bottom: -0.3660322108vw;
  }
}
.popup-block__btn--item span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.popup-block__btn--item span.is-off {
  background: linear-gradient(90deg, #6c00ff 0%, #ff008f 70%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
}
.popup-block__btn--item span.is-on {
  color: #fff;
  opacity: 0;
}
.popup-block__btn--item[target=_blank] span:after {
  display: block;
  content: "";
  display: inline-block;
  background-image: url(../data/webp/common/icon_blank.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4vw;
  height: 4vw;
  margin-left: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .popup-block__btn--item[target=_blank] span:after {
    width: 1.0980966325vw;
    height: 1.0980966325vw;
    margin-left: 0.7320644217vw;
  }
}
.popup-block__btn--item[target=_blank] span.is-off:after {
  background-image: url(../data/webp/common/icon_blank.webp);
}
.popup-block__btn--item[target=_blank] span.is-on:after {
  background-image: url(../data/webp/common/icon_blank_wh.webp);
}
.popup-block__btn--more {
  background-color: #fff;
  position: relative;
  width: 41.3333333333vw;
  height: 13.3333333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.7333333333vw;
  text-align: center;
  padding-bottom: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .popup-block__btn--more {
    width: 16.6178623719vw;
    height: 3.6603221083vw;
    font-size: 1.0248901903vw;
    padding-bottom: 0;
  }
}
@media only screen and (min-width: 751px) and (min-width: 751px) {
  .popup-block__btn--more {
    transition: 400ms;
  }
  .popup-block__btn--more:hover {
    opacity: 0.8;
  }
}
.popup-block__close {
  background: transparent url(../data/webp/common/btn_close.webp) no-repeat center center;
  background-size: contain;
  width: 8.5333333333vw;
  height: 10.4vw;
  position: absolute;
  top: 4vw;
  cursor: pointer;
}
@media only screen and (max-width: 750px) {
  .popup-block__close {
    right: 4vw;
  }
}
@media only screen and (min-width: 751px) {
  .popup-block__close {
    width: 2.9282576867vw;
    height: 3.5871156662vw;
    top: 0;
    left: calc(100% + 1.0980966325vw);
  }
}
@media only screen and (min-width: 751px) and (min-width: 751px) {
  .popup-block__close {
    transition: 400ms;
  }
  .popup-block__close:hover {
    opacity: 0.8;
  }
}

.top .header-nav__list--item[data-current=top]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .top .header-nav__list--item[data-current=top]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
.top-wrap {
  position: relative;
  overflow: hidden;
  padding-bottom: 19.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-wrap {
    margin-top: -5.6368960469vw;
    padding-bottom: 5.270863836vw;
  }
}
.top-h2 {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 6.72vw;
  line-height: 1.4537063744;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: 0 auto;
  width: 100%;
  height: 19.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-h2 {
    font-size: 2.196193265vw;
    line-height: 0.9090909091;
    height: 4.5754026354vw;
  }
}
.top-h2 span {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  margin-top: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .top-h2 span {
    font-size: 0.878477306vw;
    margin-top: 0.439238653vw;
  }
}
.top-bg__mask {
  width: 100%;
  height: 100%;
  mix-blend-mode: overlay;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
.top-bg__mask span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(../img/top/mask.svg);
  background-repeat: no-repeat;
  background-size: 514.9333333333vw auto;
  background-position: 50% -158.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-bg__mask span {
    background-size: 139.7877013177vw auto;
    background-position: 50% 14.6412884334vw;
  }
}
.top-bg__mask span:nth-child(2) {
  top: 186.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-bg__mask span:nth-child(2) {
    top: 48.3162518302vw;
  }
}
.top-bg__mask span:nth-child(3) {
  top: 373.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-bg__mask span:nth-child(3) {
    top: 96.6325036603vw;
  }
}
.top-bg__mask span:nth-child(4) {
  top: 560vw;
}
@media only screen and (min-width: 751px) {
  .top-bg__mask span:nth-child(4) {
    top: 144.9487554905vw;
  }
}
.top-bg__mask span:nth-child(5) {
  top: 746.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-bg__mask span:nth-child(5) {
    top: 193.2650073206vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-bg__topper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
  }
  .top-bg__topper:before {
    display: block;
    content: "";
    display: block;
    background-image: url(../data/webp/top/parts_grad.webp);
    background-size: 100% auto;
    background-repeat: no-repeat;
    width: 100%;
    height: 66.7642752562vw;
    position: absolute;
    top: 6.1859443631vw;
    left: 0;
    z-index: 1;
    mix-blend-mode: hard-light;
  }
  .top-bg__topper:after {
    display: block;
    content: "";
    width: 100%;
    height: 71.486090776vw;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background-image: url(../data/webp/top/parts_top.webp);
    background-size: 100% auto;
    background-repeat: no-repeat;
  }
  .top-bg__topper.js--scrollbar:before {
    top: 6.149341142vw;
  }
}
.top-bg__parts {
  width: 100%;
  height: 100%;
  position: absolute;
}
@media only screen and (min-width: 751px) {
  .top-bg__parts {
    top: 76.2811127379vw;
  }
  .top-bg__parts--mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 5.4904831625vw;
    left: 0;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: color;
    pointer-events: none;
  }
  .top-bg__parts--mask:before, .top-bg__parts--mask:after {
    content: "";
    display: block;
    width: 3.6603221083vw;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: -1;
  }
  .top-bg__parts--mask:before {
    background-color: #a200ff;
    left: 0;
  }
  .top-bg__parts--mask:after {
    background-color: #fe0490;
    right: 0;
  }
  .top-bg__parts--bar {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    pointer-events: none;
    z-index: 1;
  }
  .top-bg__parts--bar:before, .top-bg__parts--bar:after {
    content: "";
    display: block;
    background-size: 100% auto;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
  }
  .top-bg__parts--bar:before {
    background-image: url(../data/webp/top/parts_left.webp);
    width: 9.2606149341vw;
    height: 290.9956076135vw;
    left: 0;
  }
  .top-bg__parts--bar:after {
    background-image: url(../data/webp/top/parts_right.webp);
    width: 9.2606149341vw;
    height: 290.9956076135vw;
    right: 0;
  }
}
.top-bg__line {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-bg__line {
    width: 91.5080527086vw;
  }
}
.top-bg__line--item {
  background: #fff;
  position: absolute;
  width: 0.2666666667vw;
  height: 100%;
  top: 0;
  left: 50%;
  opacity: 10%;
}
@media only screen and (min-width: 751px) {
  .top-bg__line--item {
    width: 0.0732064422vw;
    left: 100%;
    opacity: 100%;
  }
}
.top-bg__line--item:before {
  display: block;
  content: "";
  background: #fff;
  width: 0.8vw;
  height: 2.6666666667vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .top-bg__line--item:before {
    width: 0.2196193265vw;
    height: 1.0248901903vw;
  }
}
.top-bg__line--item:after {
  display: block;
  content: "";
  background: #fff;
  width: 0.8vw;
  height: 2.6666666667vw;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .top-bg__line--item:after {
    width: 0.2196193265vw;
    height: 1.0248901903vw;
  }
}
.top-bg__line--item:nth-child(2) {
  display: block;
  left: calc(50% + 34.6666666667vw);
}
@media only screen and (min-width: 751px) {
  .top-bg__line--item:nth-child(2) {
    left: 0;
    opacity: 100%;
  }
}
@media only screen and (max-width: 750px) {
  .top-bg__line--item:nth-child(3) {
    display: block;
    left: calc(50% - 34.6666666667vw);
  }
}
.top-bg__light {
  background: transparent url(../data/webp/top/bg_mask.webp) no-repeat;
  background-size: contain;
  width: 100%;
  height: 227.4666666667vw;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
  mix-blend-mode: hard-light;
  transform: scale(1.075);
}
@media only screen and (min-width: 751px) {
  .top-bg__light {
    background-image: url(../data/webp/top/bg_mask_pc.webp);
    height: 79.6486090776vw;
  }
}
.top-bg__light.js--anime {
  transition: transform 400ms;
  transition-delay: 0ms;
  transform: scale(1);
}

.top-fv {
  position: relative;
  z-index: 3;
  opacity: 0;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .top-fv {
    margin: 0 auto;
    width: 100%;
    max-width: 91.2884333821vw;
  }
}
.top-fv.js--anime {
  opacity: 1;
}
.top-fv.js--anime .top-fv__chara--norm,
.top-fv.js--anime .top-fv__chara--mask {
  transition: transform 400ms;
  transition-delay: 0ms;
  transform: scale(1);
}
.top-fv.js--anime .top-fv__chara--mask img,
.top-fv.js--anime .top-fv__catch--anim img {
  opacity: 0;
  transition: opacity 600ms;
  transition-delay: 100ms;
}
.top-fv__wrap {
  margin: 0 auto;
  width: 100%;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-fv__wrap {
    max-width: 91.21522694vw;
  }
}
.top-fv__catch {
  width: 72.4vw;
  height: 35.4666666667vw;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .top-fv__catch {
    margin: 2.5333333333vw auto 0 16.2666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-fv__catch {
    width: 20.9370424597vw;
    height: 47.9136163982vw;
    position: absolute;
    top: 5.270863836vw;
    right: 4.7584187408vw;
  }
}
.top-fv__catch--anim, .top-fv__catch--item {
  position: absolute;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-fv__catch--anim, .top-fv__catch--item {
    top: 0;
  }
}
.top-fv__catch--item {
  width: 100%;
  height: 100%;
  top: 0;
}
.top-fv__catch--item.js--anime {
  opacity: 1;
}
.top-fv__catch--anim {
  width: 100%;
  height: 100%;
  z-index: 2;
}
@media only screen and (max-width: 750px) {
  .top-fv__catch--anim {
    top: 0;
    left: 0;
  }
}
.top-fv__chara {
  width: 100%;
  height: 130.6666666667vw;
  position: relative;
  z-index: 2;
  margin-top: -6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__chara {
    width: 45.0585651537vw;
    height: 52.6720351391vw;
    margin-top: 0;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }
}
.top-fv__chara--norm, .top-fv__chara--mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scale(1.05);
}
.top-fv__pf {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: 2.6666666667vw;
  margin-top: 4vw;
  margin-left: 3.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__pf {
    justify-content: flex-start;
    align-items: center;
    margin-top: 0;
    margin-left: 3.0014641288vw;
    gap: 0.6588579795vw;
  }
}
.top-fv__pf--item.switch {
  width: 20.4vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__pf--item.switch {
    width: 5.2342606149vw;
  }
}
.top-fv__pf--item.ps {
  width: 19.7333333333vw;
  margin-left: 1.2vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__pf--item.ps {
    width: 5.0878477306vw;
    margin-left: 0.3660322108vw;
  }
}
.top-fv__pf--item.steam {
  width: 18.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__pf--item.steam {
    width: 4.9048316252vw;
  }
}
@media only screen and (max-width: 750px) {
  .top-fv__pf.sp-none {
    display: none;
  }
}
@media only screen and (min-width: 751px) {
  .top-fv__pf.pc-none {
    display: none;
  }
}
@media only screen and (min-width: 751px) {
  .top-fv__block {
    width: 71.9985358712vw;
    margin-left: 0.6588579795vw;
  }
}
.top-fv__block--top {
  position: relative;
  margin-top: -28.8vw;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .top-fv__block--top {
    margin-top: 0;
    padding-top: 20.0219619327vw;
  }
}
.top-fv__block--btm {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  z-index: 2;
  gap: 4.5333333333vw;
}
@media only screen and (max-width: 750px) {
  .top-fv__block--btm {
    margin-top: -4.8vw;
    flex-direction: column;
  }
}
@media only screen and (min-width: 751px) {
  .top-fv__block--btm {
    gap: 0.6588579795vw;
    flex-direction: column-reverse;
    margin-left: 2.0863836018vw;
    margin-top: -0.878477306vw;
  }
}
.top-fv__logo {
  width: 100%;
  height: 43.8666666667vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-fv__logo {
    margin-top: 0;
    width: 32.7232796486vw;
    height: 13.4699853587vw;
  }
}
.top-fv__release {
  margin: -12vw auto 0;
  width: 92.8vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__release {
    margin-top: -3.0014641288vw;
    margin-left: -1.4641288433vw;
    width: 25.4758418741vw;
  }
}
.top-fv__banner {
  display: block;
  width: 89.4666666667vw;
  cursor: pointer;
  position: relative;
  pointer-events: all;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner {
    width: 22.9502196193vw;
  }
  .top-fv__banner:before {
    display: block;
    content: "";
    background: transparent url(../data/webp//top/fv/banner_ed_pc_on.webp) no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    transition: 400ms;
  }
  .top-fv__banner:hover:before {
    opacity: 1;
  }
  .top-fv__banner:hover .top-fv__banner--img {
    opacity: 0;
  }
}
.top-fv__banner--img {
  width: 84.8vw;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--img {
    width: 22.9502196193vw;
    transition: 400ms;
  }
}
.top-fv__banner--dtl {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 2.24vw;
  letter-spacing: 0.28vw;
  display: block;
  position: absolute;
  z-index: 1;
  top: 1.3333333333vw;
  right: 6.5333333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--dtl {
    font-size: 1.0248901903vw;
    letter-spacing: 0.1166666667vw;
    top: 0.6588579795vw;
    right: 2.9282576867vw;
    transition: 400ms;
  }
}
.top-fv__banner--dtl span {
  width: 2.6666666667vw;
  height: 1.8666666667vw;
  position: relative;
  margin-left: 1.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--dtl span {
    width: 1.2445095168vw;
    height: 0.878477306vw;
    margin-left: 0.6588579795vw;
  }
}
.top-fv__banner--dtl span svg {
  width: 1.6vw;
  position: absolute;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--dtl span svg {
    width: 0.7320644217vw;
  }
}
.top-fv__banner--dtl span svg:last-child {
  left: 1.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--dtl span svg:last-child {
    left: 0.5124450952vw;
  }
}
.top-fv__banner--dtl span svg path {
  fill: #eee;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--dtl span svg path {
    transition: 400ms;
  }
}
.top-fv__banner--more {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.top-fv__banner--more svg {
  width: 100%;
}
.top-fv__banner--more svg path {
  fill: #0d0d0d;
}
@media only screen and (min-width: 751px) {
  .top-fv__banner--more svg path {
    fill: #1e1e1e;
    transition: 400ms;
  }
}
.top-fv__reserve {
  display: block;
  width: 73.0666666667vw;
  height: 12vw;
  margin-left: 5.3333333333vw;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .top-fv__reserve {
    width: 20.0585651537vw;
    height: 3.2942898975vw;
    margin-left: 7.1010248902vw;
  }
  .top-fv__reserve:hover .btn-off {
    opacity: 0;
  }
  .top-fv__reserve:hover .btn-on {
    opacity: 1;
  }
}
.top-fv__reserve .btn-off,
.top-fv__reserve .btn-on {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 2;
  transition: 400ms;
}
.top-fv__reserve .btn-off {
  opacity: 1;
}
.top-fv__reserve .btn-on {
  opacity: 0;
}

.top-teaser__wrap {
  padding-top: 17.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-teaser__wrap {
    padding-top: 8.7115666179vw;
  }
}
.top-teaser__wrap:before, .top-teaser__wrap:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  top: 9.3333333333vw;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-teaser__wrap:before, .top-teaser__wrap:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
    top: 11.2737920937vw;
  }
}
.top-teaser__wrap:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-teaser__wrap:before {
    left: 1.2445095168vw;
  }
}
.top-teaser__wrap:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .top-teaser__wrap:after {
    right: 1.2445095168vw;
  }
}
.top-teaser__h2 {
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .top-teaser__h2 {
    padding-top: 0.7320644217vw;
  }
}
.top-teaser__h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/teaser/bg_ttl.webp) no-repeat;
  background-size: contain;
  width: 86.2666666667vw;
  height: 41.2vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-teaser__h2:before {
    width: 34.5168374817vw;
    height: 16.5080527086vw;
  }
}
.top-teaser__block {
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 750px) {
  .top-teaser__block {
    margin-top: -2.6666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-teaser__block {
    margin-top: 0.3660322108vw;
    width: 70.2415812592vw;
  }
}
.top-teaser__block:before {
  display: block;
  content: "";
  width: 100%;
  height: 85.7333333333vw;
  position: absolute;
  top: -6.6666666667vw;
  left: 0;
  z-index: -1;
  background: transparent url(../data/webp/top/teaser/bg_teaser.webp) no-repeat;
  background-size: contain;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-teaser__block:before {
    background-image: url(../data/webp/top/teaser/bg_teaser_pc.webp);
    height: 43.7042459736vw;
    top: -1.5373352855vw;
  }
}
.top-teaser__thumb {
  margin: 0 auto;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.05);
  padding: 0.5333333333vw 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  pointer-events: all;
}
@media only screen and (min-width: 751px) {
  .top-teaser__thumb {
    width: 66.7642752562vw;
    padding: 0.1464128843vw;
  }
  .top-teaser__thumb:hover .top-teaser__thumb--img:before {
    opacity: 0;
  }
  .top-teaser__thumb:hover .top-teaser__thumb--btn-inner {
    transform: scale(1.08);
  }
}
.top-teaser__thumb--btn {
  width: 45.2vw;
  height: 41.2vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: 4;
  opacity: 1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-teaser__thumb--btn {
    width: 18.1918008785vw;
    height: 16.5080527086vw;
  }
}
.top-teaser__thumb--btn-inner {
  background: transparent url(../data/webp/common/icon_play.webp) no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-teaser__thumb--btn-inner {
    transform: scale(1);
    transition: 400ms;
  }
}
.top-teaser__thumb--img {
  position: relative;
}
.top-teaser__thumb--img:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/pattern_mov.webp) repeat;
  background-size: 0.8vw auto;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}
@media only screen and (min-width: 751px) {
  .top-teaser__thumb--img:before {
    background-size: 0.2196193265vw auto;
    opacity: 1;
    transition: 400ms;
  }
}
.top-teaser__more {
  display: block;
  background: rgba(0, 0, 0, 0.5) url(../data/webp/common/pattern_button.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 84.9333333333vw;
  height: 13.3333333333vw;
  margin: 4vw auto 0;
}
@media only screen and (min-width: 751px) {
  .top-teaser__more {
    background-size: 0.3660322108vw auto;
    width: 66.3982430454vw;
    height: 2.9282576867vw;
    margin-top: 0.8052708638vw;
    transition: 400ms;
  }
  .top-teaser__more:hover {
    background-color: #000;
  }
}
.top-teaser__more span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-teaser__more span {
    font-size: 1.0248901903vw;
  }
}

.top-news__wrap {
  padding-top: 12.8vw;
}
@media only screen and (min-width: 751px) {
  .top-news__wrap {
    padding-top: 2.7086383602vw;
  }
}
.top-news__wrap .common-glitch__main img {
  mask-size: 100% 20%;
}
.top-news__wrap:before, .top-news__wrap:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  top: 13.6vw;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-news__wrap:before, .top-news__wrap:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
    top: 3.1844802343vw;
  }
}
.top-news__wrap:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-news__wrap:before {
    left: 1.2445095168vw;
  }
}
.top-news__wrap:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .top-news__wrap:after {
    right: 1.2445095168vw;
  }
}
.top-news__frame {
  position: relative;
  margin: 0 auto;
  width: 100%;
  padding: 0 4vw 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-news__frame {
    width: 82.4304538799vw;
    padding: 0 6.149341142vw 1.8667642753vw;
  }
}
.top-news__frame--top {
  width: 92vw;
  height: 3.2vw;
  position: absolute;
  top: 8.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-news__frame--top {
    width: 70.1317715959vw;
    height: 1.0614934114vw;
    top: 2.2693997072vw;
  }
}
.top-news__frame--top:before, .top-news__frame--top:after {
  content: "";
  display: block;
  background: transparent url(../img/top/news/frame.svg) no-repeat;
  background-size: auto 3.2vw;
  width: 32vw;
  height: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  filter: drop-shadow(0 0 1.3333333333vw #000);
  will-change: filter;
}
@media only screen and (min-width: 751px) {
  .top-news__frame--top:before, .top-news__frame--top:after {
    background-image: url(../img/top/news/frame_pc.svg);
    background-size: auto 1.0614934114vw;
    width: 31.4055636896vw;
    filter: drop-shadow(0 0 0.3660322108vw #000);
  }
}
.top-news__frame--top:before {
  left: 0;
  transform: translateY(-50%) rotateX(180deg);
}
.top-news__frame--top:after {
  right: 0;
  transform: translateY(-50%) rotate(180deg);
}
.top-news__frame--btm {
  width: 92vw;
  height: 2.9333333333vw;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .top-news__frame--btm {
    width: 70.1317715959vw;
    height: 1.0614934114vw;
  }
}
.top-news__frame--btm:after {
  content: "";
  display: block;
  background: transparent url(../img/top/news/frame_full.svg) no-repeat;
  background-size: 100% auto;
  width: 100%;
  height: 2.9333333333vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  filter: drop-shadow(0 0 1.3333333333vw #000);
  will-change: filter;
}
@media only screen and (min-width: 751px) {
  .top-news__frame--btm:after {
    background-image: url(../img/top/news/frame_full_pc.svg);
    height: 1.0614934114vw;
    filter: drop-shadow(0 0 0.3660322108vw #000);
  }
}
.top-news__frame--btm-parts {
  padding-bottom: 8vw;
}
@media only screen and (min-width: 751px) {
  .top-news__frame--btm-parts {
    padding-bottom: 1.6837481698vw;
  }
}
.top-news__h2 {
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 0 1.3333333333vw #000);
  will-change: filter;
  font-size: 6.6666666667vw;
  line-height: 1;
  padding-bottom: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-news__h2 {
    font-size: 1.756954612vw;
    padding-bottom: 0.1464128843vw;
  }
}
.top-news__list {
  display: flex;
  flex-wrap: wrap;
  gap: 3.0666666667vw;
  margin: 0 auto;
  width: 85.2vw;
}
@media only screen and (min-width: 751px) {
  .top-news__list {
    width: 66.6178623719vw;
    gap: 1.0248901903vw;
  }
}
.top-news__list--item {
  width: 100%;
  height: 29.3333333333vw;
  background-image: url(../data/webp/top/news/bg_news.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .top-news__list--item {
    background-image: url(../data/webp/top/news/bg_news_pc.webp);
    width: 21.5226939971vw;
    height: 20.2049780381vw;
    transition: 400ms;
  }
  .top-news__list--item:before {
    display: block;
    content: "";
    background-image: url(../data/webp/top/news/bg_news_on_pc.webp);
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
    transition: 400ms;
  }
  .top-news__list--item:hover:before {
    opacity: 1;
  }
}
.top-news__list--link {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 2.6666666667vw;
  width: 100%;
  padding: 2.9333333333vw 2.9333333333vw 2.9333333333vw 1.2vw;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link {
    justify-content: center;
    flex-direction: column;
    padding: 1.2445095168vw 1.1713030747vw 1.4641288433vw;
    gap: 0.5856515373vw;
  }
}
.top-news__list--link .link-thumb {
  position: relative;
  width: 41.6vw;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-thumb {
    width: 19.1800878477vw;
  }
}
.top-news__list--link .link-dtl {
  width: calc(100% - 44.2666666667vw);
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl {
    width: 100%;
  }
}
.top-news__list--link .link-dtl__ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.7626666667vw;
  line-height: 1.4377413127;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__ttl {
    font-size: 1.0248901903vw;
    line-height: 1.5;
  }
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    margin-top: 0.1464128843vw;
  }
}
.top-news__list--link .link-dtl__date {
  display: block;
  color: #bbbbbb;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 2.072vw;
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__date {
    font-size: 0.878477306vw;
    margin-top: 0.2196193265vw;
  }
}
.top-news__list--link .link-dtl__tag {
  margin-top: 1.0666666667vw;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__tag {
    margin-top: 0.2928257687vw;
  }
}
.top-news__list--link .link-dtl__tag p {
  display: inline-block;
  background-color: #fff;
  height: 3.4666666667vw;
  padding: 0 1.3333333333vw 0.2666666667vw 2.1333333333vw;
  color: #000;
  font-size: 2.072vw;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__tag p {
    height: 1.2811127379vw;
    padding: 0 0.5856515373vw 0.0732064422vw 0.7320644217vw;
    font-size: 0.7909956076vw;
  }
}
.top-news__list--link .link-dtl__tag p:before {
  display: block;
  content: "";
  background-color: #000;
  width: 1.3333333333vw;
  height: 0.6666666667vw;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__tag p:before {
    width: 0.439238653vw;
    height: 0.1830161054vw;
  }
}
.top-news__list--link .link-dtl__tag p span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.top-news__list--link .link-dtl__tag p.new {
  background-color: #ff0000;
  color: #fff;
  height: 3.7333333333vw;
  margin-left: 1.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__tag p.new {
    height: 1.3543191801vw;
    margin-left: 0.3660322108vw;
  }
}
.top-news__list--link .link-dtl__tag p.new span {
  padding-bottom: 0.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-news__list--link .link-dtl__tag p.new span {
    padding-bottom: 0.1098096633vw;
  }
}
.top-news__more {
  display: block;
  background: rgba(0, 0, 0, 0.5) url(../data/webp/common/pattern_button.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 84.9333333333vw;
  height: 13.3333333333vw;
  margin: 4vw auto 0;
}
@media only screen and (min-width: 751px) {
  .top-news__more {
    background-size: 0.3660322108vw auto;
    width: 66.3982430454vw;
    height: 2.9282576867vw;
    margin-top: 0.8052708638vw;
    transition: 400ms;
  }
  .top-news__more:hover {
    background-color: #000;
  }
}
.top-news__more span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-news__more span {
    font-size: 1.0248901903vw;
  }
}

.top-title__wrap {
  padding-top: 12.4vw;
}
@media only screen and (min-width: 751px) {
  .top-title__wrap {
    padding-top: 2.7086383602vw;
  }
}
.top-title__wrap:before, .top-title__wrap:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  top: 3.4666666667vw;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-title__wrap:before, .top-title__wrap:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
    top: 0.7320644217vw;
  }
}
.top-title__wrap:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-title__wrap:before {
    left: 1.2445095168vw;
  }
}
.top-title__wrap:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .top-title__wrap:after {
    right: 1.2445095168vw;
  }
}
.top-title__h2 {
  position: relative;
  z-index: 2;
  padding-top: 3.7333333333vw;
  font-size: 8vw;
  line-height: 1;
  text-shadow: 0 0 2.6666666667vw #000;
}
@media only screen and (min-width: 751px) {
  .top-title__h2 {
    font-size: 2.196193265vw;
    padding-top: 1.317715959vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
  }
}
.top-title__h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-title__h2:before {
    background-image: url(../data/webp/common/bg_title_pc.webp);
    width: 70.2049780381vw;
    height: 6.2225475842vw;
  }
}
.top-title__block {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  backdrop-filter: blur(10px);
  mask-image: url(../img/top/title/bg.svg);
  mask-size: 100% auto;
  mask-position: 0% -2.1333333333vw;
  mask-repeat: no-repeat;
  margin: 0 auto;
  width: 100%;
  padding: 12vw 4vw 13.2vw;
}
@media only screen and (min-width: 751px) {
  .top-title__block {
    mask-image: url(../img/top/title/bg_pc.svg);
    mask-position: 0% 0%;
    margin-top: -0.5124450952vw;
    padding: 3.3308931186vw 1.9033674963vw 2.6720351391vw;
    width: 70.0585651537vw;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 0.2562225476vw;
  }
}
.top-title__list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 0.5333333333vw;
  margin-top: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list {
    gap: 0.1830161054vw;
    margin-top: 0;
    width: 32.9428989751vw;
  }
}
.top-title__list--item {
  background-image: url(../img/title/bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 92vw;
  height: 14.2666666667vw;
  display: flex;
  align-items: center;
  flex-direction: row;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item {
    background-image: url(../data/webp/title/bg_pc.webp);
    width: 32.9428989751vw;
    height: 5.1244509517vw;
  }
}
.top-title__list--item[data-title=raideen] .top-title__list--logo span {
  width: 22.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=raideen] .top-title__list--logo span {
    width: 8.0527086384vw;
  }
}
.top-title__list--item[data-title=cbv] .top-title__list--logo span {
  width: 20.4vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=cbv] .top-title__list--logo span {
    width: 7.3206442167vw;
  }
}
.top-title__list--item[data-title=dunbine] .top-title__list--logo span {
  width: 12.8vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=dunbine] .top-title__list--logo span {
    width: 4.1727672035vw;
  }
}
.top-title__list--item[data-title=dunbine_new] .top-title__list--logo span {
  width: 12.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=dunbine_new] .top-title__list--logo span {
    width: 4.5021961933vw;
  }
}
.top-title__list--item[data-title=lgaim] .top-title__list--logo span {
  width: 20.4vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=lgaim] .top-title__list--logo span {
    width: 7.3572474378vw;
  }
}
.top-title__list--item[data-title=zg] .top-title__list--logo span {
  width: 18.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=zg] .top-title__list--logo span {
    width: 6.149341142vw;
  }
}
.top-title__list--item[data-title=gshar] .top-title__list--logo span {
  width: 20vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gshar] .top-title__list--logo span {
    width: 7.1376281113vw;
  }
}
.top-title__list--item[data-title=msv] .top-title__list--logo span {
  width: 24.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=msv] .top-title__list--logo span {
    width: 8.78477306vw;
  }
}
.top-title__list--item[data-title=gg] .top-title__list--logo span {
  width: 18.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gg] .top-title__list--logo span {
    width: 6.6983894583vw;
  }
}
.top-title__list--item[data-title=gew] .top-title__list--logo span {
  width: 13.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gew] .top-title__list--logo span {
    width: 4.9780380673vw;
  }
}
.top-title__list--item[data-title=gsd] .top-title__list--logo span {
  width: 23.6vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gsd] .top-title__list--logo span {
    width: 8.4187408492vw;
  }
}
.top-title__list--item[data-title=gw] .top-title__list--logo span {
  width: 22.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gw] .top-title__list--logo span {
    width: 7.8330893119vw;
  }
}
.top-title__list--item[data-title=gw] .top-title__list--ttl {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gw] .top-title__list--ttl {
    margin-top: 1.0980966325vw;
  }
}
.top-title__list--item[data-title=mzks] .top-title__list--logo span {
  width: 18.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mzks] .top-title__list--logo span {
    width: 6.5519765739vw;
  }
}
.top-title__list--item[data-title=gra] .top-title__list--logo span {
  width: 18.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gra] .top-title__list--logo span {
    width: 7.2840409956vw;
  }
}
.top-title__list--item[data-title=gra] .top-title__list--ttl {
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gra] .top-title__list--ttl {
    margin-top: 0.2928257687vw;
  }
}
.top-title__list--item[data-title=mp] .top-title__list--logo span {
  width: 23.2vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mp] .top-title__list--logo span {
    width: 8.3089311859vw;
  }
}
.top-title__list--item[data-title=mdw] .top-title__list--logo span {
  width: 23.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mdw] .top-title__list--logo span {
    width: 8.5285505124vw;
  }
}
.top-title__list--item[data-title=mdw] .top-title__list--badge.i2 {
  left: 38.8vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mdw] .top-title__list--badge.i2 {
    left: 13.9092240117vw;
  }
}
.top-title__list--item[data-title=mdw_movie] .top-title__list--logo span {
  width: 22.2666666667vw;
}
@media only screen and (max-width: 750px) {
  .top-title__list--item[data-title=mdw_movie] .top-title__list--logo span {
    margin-top: 1.8666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mdw_movie] .top-title__list--logo span {
    width: 8.0161054173vw;
  }
}
.top-title__list--item[data-title=mdw_movie] .top-title__list--ttl {
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=mdw_movie] .top-title__list--ttl {
    margin-top: 0.2928257687vw;
  }
}
.top-title__list--item[data-title=cglr3] .top-title__list--logo span {
  width: 23.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=cglr3] .top-title__list--logo span {
    width: 8.2723279649vw;
  }
}
.top-title__list--item[data-title=cglr] .top-title__list--logo span {
  width: 21.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=cglr] .top-title__list--logo span {
    width: 7.7598828697vw;
  }
}
.top-title__list--item[data-title=gsp] .top-title__list--logo span {
  width: 20.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=gsp] .top-title__list--logo span {
    width: 7.3938506589vw;
  }
}
.top-title__list--item[data-title=dyna] .top-title__list--logo span {
  width: 23.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--item[data-title=dyna] .top-title__list--logo span {
    width: 8.1259150805vw;
  }
}
.top-title__list--badge {
  position: absolute;
  top: 0;
  width: 12.8vw;
  left: 28.4vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--badge {
    width: 4.5754026354vw;
    left: 10.1756954612vw;
  }
}
.top-title__list--logo {
  width: 27.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--logo {
    width: 9.8096632504vw;
  }
}
.top-title__list--logo span {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  width: 39.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--logo span {
    width: 8.3089311859vw;
  }
}
.top-title__list--logo span img {
  width: auto;
  height: auto;
  max-height: 19.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--logo span img {
    max-height: 3.9897510981vw;
  }
}
.top-title__list--ttl {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  padding: 0 3.7333333333vw;
  word-break: break-word;
  width: calc(100% - 27.3333333333vw);
}
@media only screen and (min-width: 751px) {
  .top-title__list--ttl {
    font-size: 1.1713030747vw;
    padding: 0 1.2079062958vw;
    width: calc(100% - 9.8096632504vw);
  }
}
.top-title__list--ttl span {
  color: #cccccc;
  display: block;
  font-size: 2.0453333333vw;
}
@media only screen and (min-width: 751px) {
  .top-title__list--ttl span {
    font-size: 0.7320644217vw;
    margin-top: 0.2928257687vw;
  }
}
.top-title__more {
  display: block;
  background: rgba(255, 255, 255, 0.25) url(../data/webp/common/pattern_button_wh.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 92vw;
  height: 10.6666666667vw;
  margin: 4vw auto 0;
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .top-title__more {
    background-size: 0.3660322108vw auto;
    width: 100%;
    height: 2.9282576867vw;
    margin-top: 1.0614934114vw;
    transition: 400ms;
  }
  .top-title__more:hover {
    background-color: #fff;
    color: #000;
  }
}
.top-title__more span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-title__more span {
    font-size: 1.0248901903vw;
  }
}

.top-product__wrap {
  padding-top: 23.2vw;
}
@media only screen and (min-width: 751px) {
  .top-product__wrap {
    padding-top: 2.635431918vw;
  }
}
.top-product__wrap:before, .top-product__wrap:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  top: 10.6666666667vw;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-product__wrap:before, .top-product__wrap:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
    top: 0.7320644217vw;
  }
}
.top-product__wrap:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__wrap:before {
    left: 1.2445095168vw;
  }
}
.top-product__wrap:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__wrap:after {
    right: 1.2445095168vw;
  }
}
.top-product__h2 {
  position: relative;
  z-index: 2;
  padding-top: 3.7333333333vw;
  font-size: 8vw;
  line-height: 1;
  text-shadow: 0 0 2.6666666667vw #000;
}
@media only screen and (min-width: 751px) {
  .top-product__h2 {
    font-size: 2.196193265vw;
    padding-top: 1.317715959vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
  }
}
.top-product__h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-product__h2:before {
    background-image: url(../data/webp/common/bg_title_pc.webp);
    width: 70.2049780381vw;
    height: 6.2225475842vw;
  }
}
.top-product__block {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  backdrop-filter: blur(10px);
  clip-path: polygon(0 0, 0 0, 1.4666666667vw 1.4666666667vw, 98.6666666667vw 1.4666666667vw, 100% 0, 100% 0, 100% 100%, 96vw 100%, 93.2vw 99.2%, 6.9333333333vw 99.2%, 4vw 100%, 0 100%);
  padding-bottom: 16vw;
  margin: 2.1333333333vw auto 0;
}
@media only screen and (min-width: 751px) {
  .top-product__block {
    clip-path: polygon(0 0, 19.9121522694vw 0, 21.6691068814vw 1.6837481698vw, 48.5358711567vw 1.6837481698vw, 50.1464128843vw 0, 100% 0, 100% 100%, 100% 100%, 100% 100%, 0% 100%, 0 100%, 0% 0%);
    margin-top: -1.3909224012vw;
    padding-bottom: 2.9648609078vw;
    width: 70.0585651537vw;
  }
}
.top-product__detail {
  padding-top: 8.8vw;
  padding-bottom: 9.0666666667vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-product__detail {
    padding-top: 4.9780380673vw;
    padding-bottom: 4.9780380673vw;
  }
}
.top-product__detail:after {
  display: block;
  content: "";
  background-size: 100% auto;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: calc(100% - 46.8vw);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-product__detail:after {
    height: calc(100% - 10.6149341142vw);
  }
}
.top-product__detail--ttl {
  text-align: center;
}
.top-product__detail--ttl span {
  display: inline-block;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  letter-spacing: 0.15em;
  text-indent: 0.15em;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--ttl span {
    font-size: 1.6837481698vw;
    letter-spacing: 0.1em;
    text-indent: 0.1em;
  }
}
.top-product__detail--ttl span:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #a200ff 0%, #ed0000 100%);
  background-size: contain;
  width: 36vw;
  height: 1.6vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--ttl span:before {
    background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
    width: 9.8828696925vw;
    height: 0.439238653vw;
  }
}
.top-product__detail--img {
  position: relative;
  margin-top: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--img {
    margin-top: 1.5739385066vw;
  }
}
.top-product__detail--btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
  margin-top: 6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--btn {
    align-items: flex-start;
    margin-top: 1.6837481698vw;
  }
}
.top-product__detail--reserve {
  background: linear-gradient(90deg, #fff 0%, #fff 100%);
  position: relative;
  width: 100%;
  height: 12vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
  padding: 3.2vw 0 2.9333333333vw;
  position: relative;
  margin: 0 auto;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--reserve {
    width: 27.9648609078vw;
    height: 2.9282576867vw;
    font-size: 1.1713030747vw;
    padding: 0.878477306vw 0 0.8052708638vw;
    transition: 400ms;
  }
  .top-product__detail--reserve:after {
    display: block;
    content: "";
    background: linear-gradient(90deg, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: 400ms;
    z-index: 1;
  }
  .top-product__detail--reserve:hover .is-off {
    opacity: 0;
  }
  .top-product__detail--reserve:hover .is-on {
    opacity: 1;
  }
  .top-product__detail--reserve:hover:after {
    opacity: 1;
  }
}
.top-product__detail--reserve:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/product/bg_btn.webp) no-repeat;
  background-size: 100% auto;
  width: 100%;
  height: 12vw;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--reserve:before {
    height: 2.9282576867vw;
    bottom: -0.3660322108vw;
  }
}
.top-product__detail--reserve span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.top-product__detail--reserve span:after {
  display: block;
  content: "";
  display: inline-block;
  background-image: url(../data/webp/common/icon_blank.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4vw;
  height: 4vw;
  margin-left: 1.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--reserve span:after {
    width: 1.0980966325vw;
    height: 1.0980966325vw;
    margin-left: 0.3660322108vw;
  }
}
.top-product__detail--reserve span.is-off {
  background: linear-gradient(90deg, #6c00ff 0%, #ff008f 70%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
}
.top-product__detail--reserve span.is-off:after {
  background-image: url(../data/webp/common/icon_blank.webp);
}
.top-product__detail--reserve span.is-on {
  color: #fff;
  opacity: 0;
}
.top-product__detail--reserve span.is-on:after {
  background-image: url(../data/webp/common/icon_blank_wh.webp);
}
.top-product__detail--more {
  display: block;
  background: rgba(255, 255, 255, 0.25) url(../data/webp/common/pattern_button_wh.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 92vw;
  height: 10.6666666667vw;
  margin: 4.2666666667vw auto 0;
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--more {
    background-size: 0.3660322108vw auto;
    width: 27.9648609078vw;
    height: 2.9282576867vw;
    margin-top: 1.0980966325vw;
    transition: 400ms;
  }
  .top-product__detail--more:hover {
    background-color: #fff;
    color: #000;
  }
}
.top-product__detail--more span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.2vw;
}
@media only screen and (min-width: 751px) {
  .top-product__detail--more span {
    font-size: 1.0248901903vw;
  }
}
.top-product__tab {
  padding-bottom: 6.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__tab {
    padding-bottom: 1.2811127379vw;
  }
}
.top-product__type {
  width: 100%;
  position: relative;
  z-index: 1;
}
.top-product__type--block {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  transition: opacity 400ms;
  pointer-events: none;
  transition: opacity 600ms;
}
.top-product__type--block.js--active {
  position: relative;
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
.top-product__type--swiper {
  width: 82.6666666667vw;
  margin: 0 auto;
}
@media only screen and (min-width: 751px) {
  .top-product__type--swiper {
    width: 56.6617862372vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-product__type--wrapper {
    justify-content: center;
    gap: 1.1346998536vw;
    transform: none !important;
  }
}
.top-product__type--item {
  border: solid 0.2666666667vw #fff;
  width: 82.6666666667vw;
  margin: 0 2.8vw;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item {
    border-width: 0.0732064422vw;
    width: 18.0819912152vw;
    margin: 0;
  }
}
.top-product__type--item-inner {
  padding: 3.6vw 3.3333333333vw 4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-inner {
    padding: 0.7686676428vw 0.7320644217vw 0.878477306vw;
  }
}
.top-product__type--item-btn {
  display: block;
  background: rgba(255, 255, 255, 0.25) url(../data/webp/common/pattern_button_wh.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 100%;
  height: 10.6666666667vw;
  margin: 0 auto;
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-btn {
    background-size: 0.3660322108vw auto;
    height: 2.196193265vw;
    transition: 400ms;
  }
  .top-product__type--item-btn:hover {
    background-color: #fff;
    color: #000;
  }
}
.top-product__type--item-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-btn span {
    font-size: 0.878477306vw;
    font-size: 1.0248901903vw;
  }
}
.top-product__type--item-name {
  background-color: #fff;
  color: #000;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.6666666667vw;
  line-height: 1.1428571429;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 8.4vw;
  margin-top: 3.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-name {
    font-size: 1.0248901903vw;
    line-height: 1.1428571429;
    height: 1.8301610542vw;
    margin-top: 0.7320644217vw;
  }
}
.top-product__type--item-price {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 3.7333333333vw;
  margin-left: 1.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price {
    margin-top: 0.6588579795vw;
    margin-left: 0.3294289898vw;
  }
}
.top-product__type--item-price dt {
  background: linear-gradient(to right, #a200ff 0%, #ed0000 100%);
  background-size: 150% auto;
  background-position: center;
  width: 24.4vw;
  height: 6.1333333333vw;
  clip-path: polygon(0 0, 86% 0, 100% 100%, 14% 100%);
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.36vw;
  line-height: 1.4285714286;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price dt {
    width: 5.3440702782vw;
    height: 1.3543191801vw;
    font-size: 0.737920937vw;
    line-height: 1.4285714286;
  }
}
.top-product__type--item-price dd {
  margin-left: 2.8vw;
  width: calc(100% - 27.2vw);
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price dd {
    margin-left: 0.6222547584vw;
    width: calc(100% - 5.9663250366vw);
  }
}
.top-product__type--item-price dd p {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price dd p {
    font-size: 0.7613469985vw;
  }
}
.top-product__type--item-price dd p b {
  font-size: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price dd p b {
    font-size: 1.4641288433vw;
  }
}
.top-product__type--item-price dd p span {
  font-size: 4.8vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--item-price dd p span {
    font-size: 1.0541727672vw;
  }
}
.top-product__type--pagination {
  position: relative;
  bottom: auto !important;
  padding-bottom: 5.8666666667vw;
}
.top-product__type--pagination .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.5);
  border-radius: 0;
  width: 6.6666666667vw;
  height: 1.3333333333vw;
  margin: 0 0.4vw;
  opacity: 1;
}
.top-product__type--pagination .swiper-pagination-bullet-active {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.top-product__type--buy-ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4vw;
  text-align: center;
  width: 100%;
  position: relative;
  z-index: 2;
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-ttl {
    font-size: 0.878477306vw;
    margin-top: 1.0248901903vw;
  }
}
.top-product__type--buy-ttl:before, .top-product__type--buy-ttl:after {
  content: "";
  display: block;
  background: transparent url(../img/product/frame.svg) no-repeat;
  background-size: contain;
  width: 20.8vw;
  height: 3.7333333333vw;
  position: absolute;
  top: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-ttl:before, .top-product__type--buy-ttl:after {
    width: 4.4289897511vw;
    height: 0.8418740849vw;
    top: 0.3660322108vw;
  }
}
.top-product__type--buy-ttl:before {
  left: 0;
  transform: rotateY(180deg);
}
.top-product__type--buy-ttl:after {
  right: 0;
}
.top-product__type--buy-pf {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 2.1333333333vw;
  margin-top: 2.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-pf {
    gap: 0.3660322108vw;
    margin-top: 0.7320644217vw;
  }
}
.top-product__type--buy-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36.6666666667vw;
  height: 13.3333333333vw;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn {
    width: 8.0527086384vw;
    height: 2.9282576867vw;
    font-size: 0.7320644217vw;
    border: solid 0.1098096633vw transparent;
    transition: 400ms;
  }
}
.top-product__type--buy-btn p {
  text-align: center;
}
.top-product__type--buy-btn .txt-r {
  font-size: 1.6vw;
  vertical-align: super;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn .txt-r {
    font-size: 0.6588579795vw;
  }
}
.top-product__type--buy-btn.sw {
  background: rgba(255, 85, 85, 0.15) url(../data/webp/product/bg_pattern_red.webp) repeat;
  background-size: 0.9333333333vw auto;
  color: #ff5555;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn.sw {
    background-size: 0.2562225476vw auto;
  }
  .top-product__type--buy-btn.sw:hover {
    border-color: #ff5555;
  }
}
.top-product__type--buy-btn.ps {
  background: rgba(73, 193, 255, 0.15) url(../data/webp/product/bg_pattern_blue.webp) repeat;
  color: #49c1ff;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn.ps {
    background-size: 0.2562225476vw auto;
  }
  .top-product__type--buy-btn.ps:hover {
    border-color: #49c1ff;
  }
}
.top-product__type--buy-btn.steam {
  background: rgba(85, 255, 97, 0.15) url(../data/webp/product/bg_pattern_green.webp) repeat;
  color: #55ff61;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn.steam {
    background-size: 0.2562225476vw auto;
  }
  .top-product__type--buy-btn.steam:hover {
    border-color: #55ff61;
  }
}
.top-product__type--buy-btn.wh {
  background: rgba(255, 255, 255, 0.15) url(../data/webp/product/bg_pattern_wh.webp) repeat;
  color: #fff;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn.wh {
    background-size: 0.2562225476vw auto;
  }
  .top-product__type--buy-btn.wh:hover {
    border-color: #fff;
  }
}
.top-product__type--buy-btn[tabindex="-1"] {
  cursor: auto;
  pointer-events: none;
  background: transparent url(../data/webp/product/bg_pattern_gray.webp) repeat;
  color: #999;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__type--buy-btn[tabindex="-1"] {
    background-size: 0.2562225476vw auto;
  }
}
.top-product__type--prev, .top-product__type--next {
  background: transparent url(../img/common/arrow_wh.svg) no-repeat;
  background-size: contain;
  width: 5.7333333333vw;
  height: 6.9333333333vw;
  top: 4.2666666667vw;
  right: auto;
}
.top-product__type--prev:after, .top-product__type--next:after {
  display: none;
}
.top-product__type--next {
  right: 30.1333333333vw;
}
.top-product__type--prev {
  transform: rotate(180deg);
  left: 30.1333333333vw;
}
.top-product__pck {
  width: 82.6666666667vw;
  margin: 0 auto;
}
@media only screen and (min-width: 751px) {
  .top-product__pck {
    width: 56.6617862372vw;
  }
}
.top-product__pck--wrapper {
  flex-direction: row;
  width: fit-content;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--wrapper {
    justify-content: center;
    gap: 1.1346998536vw;
  }
}
.top-product__pck--item {
  border: solid 0.2666666667vw #fff;
  width: 82.6666666667vw;
  margin: 0 2.8vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item {
    border-width: 0.0732064422vw;
    width: 18.0819912152vw;
    margin: 0;
  }
}
.top-product__pck--item-inner {
  padding: 3.6vw 3.3333333333vw 4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-inner {
    padding: 0.7686676428vw 0.7320644217vw 0.878477306vw;
  }
}
.top-product__pck--item-btn {
  display: block;
  background: rgba(255, 255, 255, 0.25) url(../data/webp/common/pattern_button_wh.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 100%;
  height: 10.6666666667vw;
  margin: 0 auto;
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-btn {
    background-size: 0.3660322108vw auto;
    height: 2.196193265vw;
    transition: 400ms;
  }
  .top-product__pck--item-btn:hover {
    background-color: #fff;
    color: #000;
  }
}
.top-product__pck--item-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-btn span {
    font-size: 0.878477306vw;
  }
}
.top-product__pck--item-name {
  background-color: #fff;
  color: #000;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.6666666667vw;
  line-height: 1.1428571429;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 8.4vw;
  margin-top: 3.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-name {
    font-size: 1.0248901903vw;
    line-height: 1.1428571429;
    height: 1.8301610542vw;
    margin-top: 0.7320644217vw;
  }
}
.top-product__pck--item-price {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 3.7333333333vw;
  margin-left: 1.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price {
    margin-top: 0.6588579795vw;
    margin-left: 0.3294289898vw;
  }
}
.top-product__pck--item-price dt {
  background: linear-gradient(to right, #a200ff 0%, #ed0000 100%);
  background-size: 150% auto;
  background-position: center;
  width: 24.4vw;
  height: 6.1333333333vw;
  clip-path: polygon(0 0, 86% 0, 100% 100%, 14% 100%);
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.36vw;
  line-height: 1.4285714286;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price dt {
    width: 5.3440702782vw;
    height: 1.3543191801vw;
    font-size: 0.737920937vw;
    line-height: 1.4285714286;
  }
}
.top-product__pck--item-price dd {
  margin-left: 2.8vw;
  width: calc(100% - 27.2vw);
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price dd {
    margin-left: 0.6222547584vw;
    width: calc(100% - 5.9663250366vw);
  }
}
.top-product__pck--item-price dd p {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price dd p {
    font-size: 0.7613469985vw;
  }
}
.top-product__pck--item-price dd p b {
  font-size: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price dd p b {
    font-size: 1.4641288433vw;
  }
}
.top-product__pck--item-price dd p span {
  font-size: 4.8vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--item-price dd p span {
    font-size: 1.0541727672vw;
  }
}
.top-product__pck--pagination {
  position: relative;
  bottom: auto !important;
  padding-bottom: 5.8666666667vw;
}
.top-product__pck--pagination .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.5);
  border-radius: 0;
  width: 6.6666666667vw;
  height: 1.3333333333vw;
  margin: 0 0.4vw;
  opacity: 1;
}
.top-product__pck--pagination .swiper-pagination-bullet-active {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.top-product__pck--buy-ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4vw;
  text-align: center;
  width: 100%;
  position: relative;
  z-index: 2;
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-ttl {
    font-size: 0.878477306vw;
    margin-top: 1.0248901903vw;
  }
}
.top-product__pck--buy-ttl:before, .top-product__pck--buy-ttl:after {
  content: "";
  display: block;
  background: transparent url(../img/product/frame.svg) no-repeat;
  background-size: contain;
  width: 20.8vw;
  height: 3.7333333333vw;
  position: absolute;
  top: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-ttl:before, .top-product__pck--buy-ttl:after {
    width: 4.4289897511vw;
    height: 0.8418740849vw;
    top: 0.3660322108vw;
  }
}
.top-product__pck--buy-ttl:before {
  left: 0;
  transform: rotateY(180deg);
}
.top-product__pck--buy-ttl:after {
  right: 0;
}
.top-product__pck--buy-pf {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 2.1333333333vw;
  margin-top: 2.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-pf {
    gap: 0.3660322108vw;
    margin-top: 0.7320644217vw;
  }
}
.top-product__pck--buy-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36.6666666667vw;
  height: 13.3333333333vw;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-btn {
    width: 8.0527086384vw;
    height: 2.9282576867vw;
    font-size: 0.7320644217vw;
  }
}
.top-product__pck--buy-btn p {
  text-align: center;
}
.top-product__pck--buy-btn .txt-r {
  font-size: 1.6vw;
  vertical-align: super;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-btn .txt-r {
    font-size: 0.6588579795vw;
  }
}
.top-product__pck--buy-btn.sw {
  background: rgba(255, 85, 85, 0.15) url(../data/webp/product/bg_pattern_red.webp) repeat;
  background-size: 0.9333333333vw auto;
  color: #ff5555;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-btn.sw {
    background-size: 0.2562225476vw auto;
  }
}
.top-product__pck--buy-btn.ps {
  background: rgba(73, 193, 255, 0.15) url(../data/webp/product/bg_pattern_blue.webp) repeat;
  color: #49c1ff;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-btn.ps {
    background-size: 0.2562225476vw auto;
  }
}
.top-product__pck--buy-btn.steam {
  background: rgba(85, 255, 97, 0.15) url(../data/webp/product/bg_pattern_green.webp) repeat;
  color: #55ff61;
  background-size: 0.9333333333vw auto;
}
@media only screen and (min-width: 751px) {
  .top-product__pck--buy-btn.steam {
    background-size: 0.2562225476vw auto;
  }
}
.top-product__benefits {
  background-color: rgba(255, 255, 255, 0.15);
  padding: 5.2vw 2.6666666667vw 4.2666666667vw;
  margin: 8.2666666667vw auto 0;
  width: 82.8vw;
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits {
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 1.317715959vw;
    padding: 0.9150805271vw 1.2811127379vw 0.9516837482vw 0.9516837482vw;
    width: 56.6617862372vw;
  }
}
.top-product__benefits--wrap {
  padding: 0 4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--wrap {
    padding: 0 6.4421669107vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--ttl {
    order: 2;
    width: 23.0966325037vw;
    margin-top: 1.6471449488vw;
    margin-left: 1.1713030747vw;
  }
}
.top-product__benefits--ttl-h3 {
  text-align: center;
}
.top-product__benefits--ttl-h3 span {
  display: inline-block;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.6vw;
  letter-spacing: 0.15em;
  text-indent: 0.15em;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--ttl-h3 span {
    font-size: 1.5373352855vw;
    letter-spacing: 0.1em;
    text-indent: 0.1em;
  }
}
.top-product__benefits--ttl-h3 span:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  background-size: 100% auto;
  width: 26.6666666667vw;
  height: 1.6vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--ttl-h3 span:before {
    width: 7.3206442167vw;
    height: 0.439238653vw;
  }
}
.top-product__benefits--ttl-txt {
  text-align: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.3333333333vw;
  line-height: 1.36;
  margin-top: 3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--ttl-txt {
    font-size: 0.9882869693vw;
    line-height: 1.3333333333;
    margin-top: 1.1713030747vw;
  }
}
.top-product__benefits--img {
  position: relative;
  margin-top: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--img {
    margin-top: 0;
    order: 1;
    width: 29.7218155198vw;
  }
}
.top-product__benefits--dtl {
  border: solid 0.2666666667vw #fff;
  padding: 3.0666666667vw 3.6vw;
  margin-top: 4.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--dtl {
    border-width: 0.0732064422vw;
    margin-left: auto;
    padding: 0.8418740849vw 0.9882869693vw;
    width: 23.0966325037vw;
    margin-top: -8.7115666179vw;
    order: 3;
  }
}
.top-product__benefits--dtl-txt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.5;
  position: relative;
  padding-left: 4.9866666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--dtl-txt {
    font-size: 0.878477306vw;
    padding-left: 1.3323572474vw;
  }
}
.top-product__benefits--dtl-txt:before {
  display: block;
  content: "";
  border: solid 0.5333333333vw #fff;
  width: 3.12vw;
  height: 3.12vw;
  position: absolute;
  top: 0.8vw;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--dtl-txt:before {
    border-width: 0.1464128843vw;
    width: 0.8565153734vw;
    height: 0.8565153734vw;
    top: 0.2196193265vw;
  }
}
.top-product__benefits--dtl-txt:not(:first-of-type) {
  margin-top: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--dtl-txt:not(:first-of-type) {
    margin-top: 0.5856515373vw;
  }
}
.top-product__benefits--btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
  margin-top: 6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--btn {
    align-items: flex-start;
    margin-top: 1.6837481698vw;
  }
}
.top-product__benefits--reserve {
  background: linear-gradient(90deg, #fff 0%, #fff 100%);
  position: relative;
  width: 100%;
  height: 12vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
  padding: 3.2vw 0 2.9333333333vw;
  position: relative;
  margin: 0 auto;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--reserve {
    width: 27.9648609078vw;
    height: 2.9282576867vw;
    font-size: 1.1713030747vw;
    padding: 0.878477306vw 0 0.8052708638vw;
    transition: 400ms;
  }
  .top-product__benefits--reserve:after {
    display: block;
    content: "";
    background: linear-gradient(90deg, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: 400ms;
    z-index: 1;
  }
  .top-product__benefits--reserve:hover .is-off {
    opacity: 0;
  }
  .top-product__benefits--reserve:hover .is-on {
    opacity: 1;
  }
  .top-product__benefits--reserve:hover:after {
    opacity: 1;
  }
}
.top-product__benefits--reserve:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/product/bg_btn.webp) no-repeat;
  background-size: 100% auto;
  width: 100%;
  height: 12vw;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--reserve:before {
    height: 2.9282576867vw;
    bottom: -0.3660322108vw;
  }
}
.top-product__benefits--reserve span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.top-product__benefits--reserve span:after {
  display: block;
  content: "";
  display: inline-block;
  background-image: url(../data/webp/common/icon_blank.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4vw;
  height: 4vw;
  margin-left: 1.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--reserve span:after {
    width: 1.0980966325vw;
    height: 1.0980966325vw;
    margin-left: 0.3660322108vw;
  }
}
.top-product__benefits--reserve span.is-off {
  background: linear-gradient(90deg, #6c00ff 0%, #ff008f 70%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
}
.top-product__benefits--reserve span.is-off:after {
  background-image: url(../data/webp/common/icon_blank.webp);
}
.top-product__benefits--reserve span.is-on {
  color: #fff;
  opacity: 0;
}
.top-product__benefits--reserve span.is-on:after {
  background-image: url(../data/webp/common/icon_blank_wh.webp);
}
.top-product__benefits--more {
  display: block;
  background: rgba(255, 255, 255, 0.25) url(../data/webp/common/pattern_button_wh.webp) repeat;
  background-size: 1.3333333333vw auto;
  width: 92vw;
  height: 10.6666666667vw;
  margin: 5.4666666667vw auto 0;
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--more {
    background-size: 0.3660322108vw auto;
    width: 56.6617862372vw;
    height: 2.9282576867vw;
    margin-top: 1.6471449488vw;
    transition: 400ms;
  }
  .top-product__benefits--more:hover {
    background-color: #fff;
    color: #000;
  }
}
.top-product__benefits--more span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__benefits--more span {
    font-size: 1.0248901903vw;
  }
}
.top-product__spec {
  background-color: rgba(0, 0, 0, 0.5);
  margin: 9.6vw auto 0;
}
@media only screen and (min-width: 751px) {
  .top-product__spec {
    margin-top: 1.9765739385vw;
    width: 56.6617862372vw;
  }
}
.top-product__spec--wrap {
  padding: 4.8vw 4vw 14vw;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--wrap {
    padding: 0.878477306vw 2.196193265vw 3.2942898975vw;
  }
}
.top-product__spec--ttl {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  margin: 0 auto;
  width: 49.8666666667vw;
  height: 17.3333333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 6.6666666667vw;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--ttl {
    width: 15.5563689605vw;
    height: 4.5754026354vw;
    font-size: 1.8301610542vw;
  }
}
.top-product__spec--dtl {
  margin: 0 auto;
  width: 84.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.7320644217vw 1.5739385066vw;
  }
}
.top-product__spec--dtl dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  border-bottom: solid #999 0.4vw;
  padding: 1.3333333333vw 0;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl dl {
    border-bottom-width: 0.1098096633vw;
    padding: 0;
    gap: 1.0980966325vw;
    width: fit-content;
  }
}
.top-product__spec--dtl dl:first-of-type {
  padding-top: 0;
}
@media only screen and (max-width: 750px) {
  .top-product__spec--dtl dl:last-of-type {
    padding-bottom: 2.9333333333vw;
  }
}
.top-product__spec--dtl dl dt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 3.2;
  color: #999;
}
@media only screen and (max-width: 750px) {
  .top-product__spec--dtl dl dt {
    width: 21.6vw;
  }
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl dl dt {
    font-size: 0.8931185944vw;
    line-height: 3.2;
  }
}
.top-product__spec--dtl dl dd {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
}
@media only screen and (max-width: 750px) {
  .top-product__spec--dtl dl dd {
    width: calc(100% - 21.6vw);
    line-height: 1.625;
  }
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl dl dd {
    font-size: 0.8931185944vw;
    line-height: 3.2;
  }
}
.top-product__spec--dtl dl dd span {
  font-size: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl dl dd span {
    font-size: 0.7320644217vw;
  }
}
.top-product__spec--dtl dl dd span.txt-r {
  font-size: 2.1333333333vw;
  vertical-align: super;
}
@media only screen and (min-width: 751px) {
  .top-product__spec--dtl dl dd span.txt-r {
    font-size: 0.6588579795vw;
  }
}
.top-product__steam {
  background-color: rgba(0, 0, 0, 0.5);
  margin: 7.7333333333vw auto 0;
  padding: 11.4666666667vw 4vw 12vw;
}
@media only screen and (min-width: 751px) {
  .top-product__steam {
    margin-top: 1.3543191801vw;
    width: 56.6617862372vw;
    padding: 2.1229868228vw 1.4641288433vw 2.3426061493vw;
  }
}
.top-product__steam--ttl {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  margin: 0 auto;
  font-size: 4.8vw;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .top-product__steam--ttl {
    font-size: 1.1713030747vw;
  }
}
.top-product__steam--ttl .txt-r {
  font-size: 2.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .top-product__steam--ttl .txt-r {
    font-size: 0.6588579795vw;
  }
}
.top-product__steam--txt {
  margin: 0 auto;
  line-height: 1;
  margin-top: 7.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .top-product__steam--txt {
    margin-top: 2.0131771596vw;
    width: 53.6603221083vw;
  }
}
.top-product__parts {
  display: block;
  width: 100%;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__parts {
    bottom: -1.4641288433vw;
  }
}
.top-product__parts:before, .top-product__parts:after {
  content: "";
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../data/webp/common/parts_bd.webp);
  width: 2.8vw;
  height: 1.3333333333vw;
  position: absolute;
  top: 8vw;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .top-product__parts:before, .top-product__parts:after {
    background-image: url(../data/webp/common/parts_bd_pc.webp);
    width: 1.0248901903vw;
    height: 0.439238653vw;
    top: 0;
  }
}
.top-product__parts:before {
  left: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__parts:before {
    left: 1.2445095168vw;
  }
}
.top-product__parts:after {
  right: 0;
}
@media only screen and (min-width: 751px) {
  .top-product__parts:after {
    right: 1.2445095168vw;
  }
}

.news .header-nav__list--item[data-current=news]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .news .header-nav__list--item[data-current=news]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
.news-wrap {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  padding-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .news-wrap {
    max-width: 75.4758418741vw;
    padding-bottom: 0;
  }
}
.news-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2.8vw;
  margin: 0 auto;
  padding-bottom: 10.5333333333vw;
  width: 85.2vw;
}
@media only screen and (min-width: 751px) {
  .news-list {
    width: 100%;
    gap: 0.7320644217vw;
    padding-bottom: 2.8184480234vw;
  }
}
.news-list__item {
  width: 100%;
  height: 29.0666666667vw;
  background-image: url(../data/webp/news/bg.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .news-list__item {
    background-image: url(../data/webp/news/bg_pc.webp);
    width: 24.6705710102vw;
    height: 8.4553440703vw;
    transition: 400ms;
  }
  .news-list__item:before {
    display: block;
    content: "";
    background-image: url(../data/webp/news/bg_on.webp);
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
    transition: 400ms;
  }
  .news-list__item:hover:before {
    opacity: 1;
  }
}
.news-list__link {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 2.6666666667vw;
  width: 100%;
  padding: 2.9333333333vw 2.9333333333vw 2.9333333333vw 1.2vw;
}
@media only screen and (min-width: 751px) {
  .news-list__link {
    padding: 0.8418740849vw 0.9516837482vw 0.8052708638vw 0.2928257687vw;
    gap: 0.7320644217vw;
  }
}
.news-list__link--thumb {
  width: 41.6vw;
}
@media only screen and (min-width: 751px) {
  .news-list__link--thumb {
    width: 12.0424597365vw;
  }
}
.news-list__link--dtl {
  width: calc(100% - 44.2666666667vw);
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl {
    width: calc(100% - 12.7745241581vw);
  }
}
.news-list__link--dtl-ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.764vw;
  line-height: 1.4380125422;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-ttl {
    font-size: 0.8008784773vw;
    line-height: 1.4373857404;
  }
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-wrap {
    margin-top: 0.1464128843vw;
  }
}
.news-list__link--dtl-date {
  display: block;
  color: #bbbbbb;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 2.072vw;
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-date {
    font-size: 0.600658858vw;
    margin-top: 0.2196193265vw;
  }
}
.news-list__link--dtl-tag {
  margin-top: 1.0666666667vw;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-tag {
    margin-top: 0.3660322108vw;
  }
}
.news-list__link--dtl-tag p {
  display: inline-block;
  background-color: #fff;
  height: 3.4666666667vw;
  padding: 0 1.3333333333vw 0.2666666667vw 2.1333333333vw;
  color: #000;
  font-size: 2.0733333333vw;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-tag p {
    height: 0.9882869693vw;
    padding: 0 0.5856515373vw 0.0366032211vw 0.7320644217vw;
    font-size: 0.600658858vw;
  }
}
.news-list__link--dtl-tag p:before {
  display: block;
  content: "";
  background-color: #000;
  width: 1.3333333333vw;
  height: 0.6666666667vw;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-tag p:before {
    width: 0.3660322108vw;
    height: 0.1830161054vw;
  }
}
.news-list__link--dtl-tag p span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.news-list__link--dtl-tag p.new {
  background-color: #ff0000;
  color: #fff;
  height: 3.7333333333vw;
  margin-left: 1.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-tag p.new {
    height: 1.0248901903vw;
    margin-left: 0.3660322108vw;
  }
}
.news-list__link--dtl-tag p.new span {
  padding-bottom: 0.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .news-list__link--dtl-tag p.new span {
    padding-bottom: 0.0366032211vw;
  }
}
.news-article {
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  clip-path: polygon(0 0, 4vw 0, 8vw 2.6666666667vw, 92vw 2.6666666667vw, 96vw 0, 100% 0, 100% 100%, 100% 100%, 100% 100%, 0% 100%, 0 100%, 0% 0%);
  margin: 0 auto;
  width: 100%;
  padding-top: 10vw;
}
@media only screen and (min-width: 751px) {
  .news-article {
    clip-path: polygon(0 0, 10.3953147877vw 0, 11.3469985359vw 0.8052708638vw, 40.0439238653vw 0.8052708638vw, 40.8491947291vw 0, 100% 0, 100% 100%, 100% 100%, 100% 100%, 0% 100%, 0 100%, 0% 0%);
    width: 51.2445095168vw;
    padding-top: 2.635431918vw;
  }
}

.news-detail__navi {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4.9333333333vw 6.9333333333vw;
  margin: 4.8vw auto 0;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi {
    margin-top: 0.9150805271vw;
    width: 51.2445095168vw;
    gap: 1.7935578331vw 1.4641288433vw;
  }
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--dtl {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0.9150805271vw 1.0980966325vw;
  }
  .news-detail__navi--dtl .dtl-thumb {
    width: 5.9297218155vw;
    height: 3.2942898975vw;
    position: relative;
    z-index: 1;
    overflow: hidden;
  }
  .news-detail__navi--dtl .dtl-thumb img {
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
  }
  .news-detail__navi--dtl .dtl-ttl {
    color: #fff;
    font-family: "BIZ UDPGothic", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 0.7320644217vw;
    line-height: 1.45;
    margin-left: 0.8052708638vw;
    width: calc(100% - 6.7349926794vw);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
  }
}
.news-detail__navi--prev, .news-detail__navi--next {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #222;
  width: 46.5333333333vw;
  height: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev, .news-detail__navi--next {
    width: 24.8901903367vw;
    height: 6.9546120059vw;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .news-detail__navi--prev:hover .btn-txt, .news-detail__navi--next:hover .btn-txt {
    background-color: #fff;
    color: #111;
  }
  .news-detail__navi--prev:hover .btn-txt svg path, .news-detail__navi--next:hover .btn-txt svg path {
    fill: #111;
  }
}
.news-detail__navi--prev .btn-txt, .news-detail__navi--next .btn-txt {
  display: flex;
  align-items: center;
  justify-content: center;
}
.news-detail__navi--prev .btn-txt svg, .news-detail__navi--next .btn-txt svg {
  width: 4vw;
  height: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev .btn-txt svg, .news-detail__navi--next .btn-txt svg {
    width: 0.6588579795vw;
    height: 0.7320644217vw;
  }
}
.news-detail__navi--prev .btn-txt svg:last-of-type, .news-detail__navi--next .btn-txt svg:last-of-type {
  margin-left: -2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev .btn-txt svg:last-of-type, .news-detail__navi--next .btn-txt svg:last-of-type {
    margin-left: -0.3660322108vw;
  }
}
.news-detail__navi--prev .btn-txt svg path, .news-detail__navi--next .btn-txt svg path {
  fill: #fff;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev .btn-txt svg path, .news-detail__navi--next .btn-txt svg path {
    transition: 400ms;
  }
}
.news-detail__navi--prev .btn-txt, .news-detail__navi--next .btn-txt {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 5.3333333333vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8666666667vw;
}
@media only screen and (max-width: 750px) {
  .news-detail__navi--prev .btn-txt, .news-detail__navi--next .btn-txt {
    letter-spacing: 0.4vw;
    text-indent: 0.4vw;
  }
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev .btn-txt, .news-detail__navi--next .btn-txt {
    background-color: #111;
    width: 100%;
    height: 1.8301610542vw;
    font-size: 0.7320644217vw;
    gap: 0.1464128843vw;
    padding: 0 0.7320644217vw;
    transition: 400ms;
  }
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--prev .btn-txt {
    justify-content: flex-end;
  }
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--next .btn-txt {
    justify-content: flex-start;
  }
}
.news-detail__navi--next .btn-txt svg {
  transform: rotate(180deg);
}
.news-detail__navi--index {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #222;
  width: 44vw;
  height: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--index {
    width: 8.0527086384vw;
    height: 2.9282576867vw;
    transition: 400ms;
  }
  .news-detail__navi--index:hover {
    background-color: #fff;
  }
  .news-detail__navi--index:hover p {
    color: #222;
  }
  .news-detail__navi--index:hover .parts span {
    background-color: #222;
  }
}
.news-detail__navi--index p {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 5.3333333333vw;
  letter-spacing: 0.4vw;
  text-indent: 0.4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--index p {
    font-size: 1.0541727672vw;
    letter-spacing: 0.144vw;
    text-indent: 0.144vw;
    gap: 0.2196193265vw;
    transition: 400ms;
  }
}
.news-detail__navi--index p:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/icon_index.webp) no-repeat;
  background-size: contain;
}
.news-detail__navi--index .parts {
  width: 4.8vw;
  height: 4.5333333333vw;
  margin-top: 0.5333333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.4vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--index .parts {
    width: 0.9516837482vw;
    height: 0.878477306vw;
    margin-top: 0.0732064422vw;
    gap: 0.0732064422vw;
  }
}
.news-detail__navi--index .parts span {
  background-color: #fff;
  width: 2.096vw;
  height: 2.096vw;
}
@media only screen and (min-width: 751px) {
  .news-detail__navi--index .parts span {
    width: 0.4099560761vw;
    height: 0.4099560761vw;
    transition: 400ms;
  }
}

.movie .header-nav__list--item[data-current=movie]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .movie .header-nav__list--item[data-current=movie]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
.movie-wrap {
  padding: 0 4vw 9.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .movie-wrap {
    padding: 0 0 0.5124450952vw;
  }
}
.movie-list {
  margin: 0 auto;
  width: 91.2vw;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 5.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .movie-list {
    width: 71.0102489019vw;
    gap: 1.756954612vw;
    justify-content: center;
    flex-direction: row;
    flex-grow: 1;
  }
}
.movie-list__item {
  width: 100%;
  position: relative;
  background-color: rgba(255, 255, 255, 0.2);
  padding: 0.2666666667vw;
  clip-path: polygon(0% 0%, 100% 0, 100% 97%, 98% 100%, 0% 100%);
  cursor: pointer;
  pointer-events: all;
}
@media only screen and (min-width: 751px) {
  .movie-list__item {
    clip-path: polygon(0% 0%, 100% 0, 100% 97%, 98% 100%, 0% 100%);
    width: 34.6266471449vw;
    padding: 0.0732064422vw;
  }
  .movie-list__item:hover .movie-list__item--thumb:before {
    opacity: 0;
  }
  .movie-list__item:hover .movie-list__item--thumb:after {
    transform: translate3d(-50%, -50%, 0) scale(1.08);
  }
}
.movie-list__item--wrap {
  background-color: rgba(0, 0, 0, 0.9);
  clip-path: polygon(0% 0%, 100% 0, 100% 97%, 98% 100%, 0% 100%);
  height: 100%;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--wrap {
    clip-path: polygon(0% 0%, 100% 0, 100% 97%, 98% 100%, 0% 100%);
  }
}
.movie-list__item--thumb {
  width: 100%;
  height: 50.9333333333vw;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--thumb {
    height: 19.3997071742vw;
  }
}
.movie-list__item--thumb:before {
  display: block;
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--thumb:before {
    opacity: 1;
    transition: 400ms;
  }
}
.movie-list__item--thumb:after {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/icon_play.webp) no-repeat;
  background-size: contain;
  width: 30.8vw;
  height: 28.6666666667vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: 2;
  opacity: 1;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--thumb:after {
    width: 12.4450951684vw;
    height: 11.3469985359vw;
    transition: 400ms;
  }
}
.movie-list__item--thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.movie-list__item--ttl {
  padding: 2.6666666667vw 3.7333333333vw 4.6666666667vw 3.0666666667vw;
  display: flex;
  flex-direction: row;
  gap: 2vw;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--ttl {
    padding: 1.2811127379vw 1.2811127379vw;
    gap: 0.7320644217vw;
  }
}
.movie-list__item--ttl p {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #fff;
  font-size: 3.4666666667vw;
  line-height: 1.3076923077;
  width: calc(100% - 7.4666666667vw);
}
@media only screen and (min-width: 751px) {
  .movie-list__item--ttl p {
    font-size: 1.1713030747vw;
    line-height: 1.3125;
    width: calc(100% - 2.8184480234vw);
  }
}
.movie-list__item--ttl[data-new=true]:before {
  content: "";
  display: block;
  background: transparent url(../data/webp/common/icon_new_red.webp) no-repeat;
  background-size: contain;
  width: 7.4666666667vw;
  height: 3.4666666667vw;
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .movie-list__item--ttl[data-new=true]:before {
    width: 2.8184480234vw;
    height: 1.2811127379vw;
    margin-top: 0.2196193265vw;
  }
}

.product .header-nav__list--item[data-current=product]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .product .header-nav__list--item[data-current=product]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
.product .txt-r {
  font-size: 2.1333333333vw;
  margin-bottom: 1.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .product .txt-r {
    font-size: 0.5856515373vw;
    margin-bottom: 0.5856515373vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-wrapper {
    margin-bottom: 2.5622254758vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=package] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=package] .product-nav__list--item[data-current=package] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=download] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=download] .product-nav__list--item[data-current=download] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=early] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=early] .product-nav__list--item[data-current=early] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=dlc] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=dlc] .product-nav__list--item[data-current=dlc] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=spec] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=spec] .product-nav__list--item[data-current=spec] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.product-inner[data-product=spec] .product-nav {
  margin-bottom: 7.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=spec] .product-nav {
    margin-bottom: 2.6720351391vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=faq] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=faq] .product-nav__list--item[data-current=faq] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (max-width: 750px) {
  .product-inner[data-product=faq] .product-h2 {
    font-size: 8vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-inner[data-product=trial] .product-wrap {
    padding-bottom: 3.1844802343vw;
  }
}
.product-inner[data-product=trial] .product-nav__list--item[data-current=trial] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (max-width: 750px) {
  .product-inner[data-product=trial] .product-h2 {
    font-size: 8vw;
  }
}
.product-wrap {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  padding-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-wrap {
    max-width: 51.2445095168vw;
    padding-bottom: 2.5622254758vw;
  }
}
.product-h2 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  text-shadow: 0 0 2.6666666667vw #000;
  height: 23.6vw;
  position: relative;
  z-index: 2;
  padding-top: 8.8vw;
  text-align: center;
  letter-spacing: 0.15em;
  text-indent: 0.15em;
}
@media only screen and (min-width: 751px) {
  .product-h2 {
    font-size: 1.4641288433vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
    height: 6.2225475842vw;
    padding-top: 1.4641288433vw;
  }
}
.product-h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .product-h2:before {
    background-image: url(../data/webp/common/bg_title_pc.webp);
    width: 51.3909224012vw;
    height: 4.5387994143vw;
  }
}
.product-h2.small {
  font-size: 5.3333333333vw;
  padding-top: 7.4666666667vw;
}
@media only screen and (max-width: 750px) {
  .product-h2.small {
    line-height: 1.1;
  }
}
@media only screen and (min-width: 751px) {
  .product-h2.small {
    font-size: 1.317715959vw;
    padding-top: 1.0980966325vw;
  }
}
.product-h2.small .common-h2__wrap {
  display: block;
}
@media only screen and (min-width: 751px) {
  .product-h2.small .common-h2__wrap {
    line-height: 0.9;
  }
}
.product-h2.small small {
  font-size: 5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-h2.small small {
    font-size: 0.8052708638vw;
  }
}
@media only screen and (max-width: 750px) {
  .product-h2.small.std {
    padding-top: 9.6vw;
  }
}
@media only screen and (max-width: 750px) {
  .product-h2.small-sp {
    font-size: 5.3333333333vw;
    padding-top: 7.4666666667vw;
    line-height: 1.1;
  }
}
.product-h2.double {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  padding-top: 1.8666666667vw;
  line-height: 1.4;
}
@media only screen and (min-width: 751px) {
  .product-h2.double {
    flex-direction: row;
    font-size: 1.7679355783vw;
    line-height: 1;
    padding-top: 0;
    padding-bottom: 1.6105417277vw;
    padding-right: 1.9033674963vw;
  }
}
.product-h2.double .double-small {
  display: flex;
  flex-direction: row;
  font-size: 4vw;
  line-height: 1;
}
@media only screen and (min-width: 751px) {
  .product-h2.double .double-small {
    font-size: 0.7686676428vw;
    line-height: 1.4;
    text-align: right;
  }
}
.product-cont {
  margin-top: 7.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-cont {
    margin-top: 2.7086383602vw;
  }
}
.product-cont__block:not(:first-of-type) {
  margin-top: 11.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-cont__block:not(:first-of-type) {
    margin-top: 3.3674963397vw;
  }
}

.product-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 3.0666666667vw 1.8666666667vw;
  margin-bottom: 6.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-nav {
    gap: 1.0980966325vw;
    margin-bottom: 1.4641288433vw;
  }
}
.product-nav__list {
  width: 29.4666666667vw;
  height: 10vw;
}
@media only screen and (min-width: 751px) {
  .product-nav__list {
    width: 9.0409956076vw;
    height: 1.9765739385vw;
  }
}
.product-nav__list--item {
  background: linear-gradient(to left, #222 0%, #222 100%);
  background-size: 120% auto;
  background-position: center;
  clip-path: polygon(0% 0%, 100% 0, 100% 7.8666666667vw, 27.3333333333vw 100%, 0% 100%);
  color: #fff;
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.2307692308;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .product-nav__list--item:after {
    transition: 400ms;
  }
  .product-nav__list--item:hover:after {
    opacity: 1;
  }
}
@media only screen and (min-width: 751px) {
  .product-nav__list--item {
    clip-path: polygon(0% 0%, 100% 0, 100% 1.3909224012vw, 8.4553440703vw 100%, 0% 100%);
    font-size: 0.878477306vw;
  }
  .product-nav__list--item:after {
    display: block;
    content: "";
    background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
  }
}
.product-nav__list--item span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}

.product-navi {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-navi {
    gap: 0.2562225476vw;
    flex-direction: row;
    justify-content: center;
  }
}
.product-navi__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8666666667vw;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .product-navi__nav {
    gap: 1.0248901903vw;
  }
}
.product-navi__nav:has(.product-navi__nav--item:nth-of-type(n+4)) {
  flex-wrap: wrap;
  gap: 4vw 1.8666666667vw;
}
@media only screen and (max-width: 750px) {
  .product-navi__nav:has(.product-navi__nav--item:nth-of-type(n+4)) .product-navi__nav--item.pb {
    padding-top: 0;
    padding-bottom: 5.4666666667vw;
  }
}
.product-navi__nav--item {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.9333333333vw;
  line-height: 1.3636363636;
  display: block;
  min-width: 29.6vw;
  width: fit-content;
  text-align: center;
  position: relative;
  z-index: 2;
  padding-bottom: 5.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item {
    min-width: 7.9795021962vw;
    font-size: 0.9516837482vw;
    line-height: 1.2307692308;
    padding-bottom: 1.1713030747vw;
  }
  .product-navi__nav--item:hover .product-navi__nav--item-parts:before {
    left: -0.6222547584vw;
  }
  .product-navi__nav--item:hover .product-navi__nav--item-parts:after {
    right: -0.6222547584vw;
  }
  .product-navi__nav--item:hover .product-navi__nav--item-parts .on {
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
}
.product-navi__nav--item-parts {
  width: 29.6vw;
  height: 2vw;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item-parts {
    width: 7.9795021962vw;
    height: 0.5490483163vw;
  }
  .product-navi__nav--item-parts .on {
    display: block;
    background-image: url(../data/webp/chara/parts_nav_on.webp);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.8301610542vw;
    height: 0.878477306vw;
    position: absolute;
    top: -0.2928257687vw;
    left: 50%;
    transform: translate3d(-50%, -20%, 0);
    opacity: 0;
    transition: 400ms;
  }
}
.product-navi__nav--item-parts:before, .product-navi__nav--item-parts:after {
  content: "";
  display: block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item-parts:before, .product-navi__nav--item-parts:after {
    width: 4.0629575403vw;
    transition: 400ms;
  }
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item-parts:before {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    left: 0;
    transform: rotateY(180deg);
  }
}
.product-navi__nav--item-parts:after {
  background-image: url(../data/webp/chara/parts_nav.webp);
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item-parts:after {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    right: 0;
  }
}
.product-navi__nav--item.pb {
  padding-top: 2.4vw;
  padding-bottom: 7.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-navi__nav--item.pb {
    padding-top: 0.6954612006vw;
    padding-bottom: 1.6837481698vw;
  }
}

.product-block {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  backdrop-filter: blur(10px);
}
@media only screen and (min-width: 751px) {
  .product-block {
    clip-path: polygon(0 0, 10.3953147877vw 0, 11.383601757vw 0.6222547584vw, 40.0439238653vw 0.6222547584vw, 40.8491947291vw 0, 100% 0, 100% 0%, 100% 100%, 0% 100%, 0% 100%, 0 100%, 0% 0%);
    margin-top: -2.7818448023vw;
  }
}
.product-block__wrap {
  padding: 12vw 0 10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__wrap {
    padding: 3.6603221083vw 0 2.5622254758vw;
  }
}
.product-block__inner {
  padding: 0 4vw;
}
@media only screen and (min-width: 751px) {
  .product-block__inner {
    padding: 0 2.5622254758vw 0;
  }
}
.product-block__img {
  width: 100%;
  margin-bottom: 8.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__img {
    margin-bottom: 1.8667642753vw;
  }
}
.product-block__detail {
  margin-top: 6.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail {
    margin-top: 1.4275256223vw;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.9150805271vw;
  }
}
.product-block__detail--ttl {
  display: flex;
  align-items: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1.4285714286;
  padding: 0.8vw 5.6vw;
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 5.6vw 100%);
}
@media only screen and (max-width: 750px) {
  .product-block__detail--ttl {
    mask-image: linear-gradient(to right, #ed0000 60%, transparent 100%);
    mask-size: 100% auto;
    mask-repeat: no-repeat;
  }
}
@media only screen and (min-width: 751px) {
  .product-block__detail--ttl {
    clip-path: polygon(0 0, 6.2225475842vw 0, 100% 100%, 1.1713030747vw 100%);
    font-size: 1.0248901903vw;
    line-height: 1.4285714286;
    padding: 0.1464128843vw 0.3660322108vw 0.2196193265vw;
    width: 7.3938506589vw;
    height: 1.8301610542vw;
    justify-content: center;
    margin-top: 0.3660322108vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-block__detail--ttl.small {
    font-size: 0.9516837482vw;
  }
}
.product-block__detail--txt {
  padding-left: 6.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--txt {
    padding-left: 0.3660322108vw;
    width: calc(100% - 9.2606149341vw);
  }
}
.product-block__detail--txt > p {
  display: inline-block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 7.4666666667vw;
  margin-top: 4.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--txt > p {
    font-size: 2.0497803807vw;
    margin-top: 0;
  }
}
.product-block__detail--txt > p span {
  font-weight: 400;
  font-size: 4.8vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--txt > p span {
    font-size: 1.317715959vw;
  }
}
.product-block__detail--txt > span {
  font-size: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--txt > span {
    font-size: 0.9516837482vw;
  }
}
.product-block__detail--list {
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list {
    margin-top: 0.2928257687vw;
  }
}
.product-block__detail--list li {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2.8vw;
  position: relative;
  padding-left: 6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li {
    flex-direction: column;
    gap: 0.8052708638vw;
    padding-left: 1.8301610542vw;
  }
}
.product-block__detail--list li:not(:first-of-type) {
  margin-top: 3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li:not(:first-of-type) {
    margin-top: 1.0248901903vw;
  }
}
.product-block__detail--list li p {
  color: #ccc;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.5;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li p {
    font-size: 0.878477306vw;
  }
}
.product-block__detail--list li p.txt-whb {
  color: #fff;
  font-weight: 700;
}
.product-block__detail--list li p.txt-whb span {
  color: #ccc;
}
.product-block__detail--list li p b {
  color: #fff;
  font-weight: 700;
  font-size: 3.7333333333vw;
  line-height: 1.6428571429;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li p b {
    font-size: 1.0248901903vw;
  }
}
.product-block__detail--list li p span {
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.8;
  display: flex;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li p span {
    font-size: 0.8052708638vw;
    line-height: 1.4090909091;
  }
}
.product-block__detail--list li p span:before {
  content: "※";
  display: inline-block;
}
.product-block__detail--list li p span.btn-song {
  font-weight: bold;
  color: #00c6ff;
  cursor: pointer;
  pointer-events: all;
}
.product-block__detail--list li p span.btn-song:before {
  display: none;
}
.product-block__detail--list li.mt {
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li.mt {
    margin-top: 0.7320644217vw;
  }
}
.product-block__detail--list li:before {
  display: block;
  content: "";
  border: solid #fff 0.5333333333vw;
  width: 3.4666666667vw;
  height: 3.4666666667vw;
  position: absolute;
  top: 1.3333333333vw;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list li:before {
    border-width: 0.1464128843vw;
    width: 0.9516837482vw;
    height: 0.9516837482vw;
    top: 0.3660322108vw;
  }
}
.product-block__detail--list p {
  color: #ccc;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.5;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list p {
    font-size: 0.878477306vw;
  }
}
.product-block__detail--list p.txt-whb {
  color: #fff;
  font-weight: 700;
}
.product-block__detail--list p.txt-whb span {
  color: #ccc;
}
.product-block__detail--list p b {
  color: #fff;
  font-weight: 700;
  font-size: 3.7333333333vw;
  line-height: 1.6428571429;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list p b {
    font-size: 1.0248901903vw;
  }
}
.product-block__detail--list p span {
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.8;
  display: flex;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--list p span {
    font-size: 0.8052708638vw;
    line-height: 1.4090909091;
  }
}
.product-block__detail--list p span:before {
  content: "※";
  display: inline-block;
}
.product-block__detail--sub {
  margin-top: -2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--sub {
    margin-top: -0.7320644217vw;
  }
}
.product-block__detail--sub li {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
  padding-left: 0;
}
.product-block__detail--sub li:not(:first-of-type) {
  margin-top: 0;
}
.product-block__detail--sub li p {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1.6428571429;
  width: calc(100% - 6.2666666667vw);
  padding-left: 3.7333333333vw;
  text-indent: -3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--sub li p {
    font-size: 1.0248901903vw;
    width: calc(100% + 0.3660322108vw);
    padding-left: 1.0980966325vw;
    text-indent: -1.0980966325vw;
  }
}
.product-block__detail--sub li p span {
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.8;
  display: flex;
  flex-direction: row;
}
@media only screen and (min-width: 751px) {
  .product-block__detail--sub li p span {
    font-size: 0.8052708638vw;
    line-height: 1.4090909091;
  }
}
.product-block__detail--sub li:before {
  display: none;
}
.product-block__detail a {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #fff;
  font-size: 4.2666666667vw;
  margin-top: 6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__detail a {
    font-size: 1.1713030747vw;
    margin-top: 1.317715959vw;
  }
}
.product-block__btn {
  background-color: rgba(255, 255, 255, 0.1);
  clip-path: polygon(2.6666666667vw 0%, 0% 0%, 100% 0, 100% calc(100% - 2.6666666667vw), calc(100% - 2.6666666667vw) 100%, 0% 100%, 0 100%, 0% 2.6666666667vw);
  margin-top: 6.6666666667vw;
  padding: 6.1333333333vw 3.4666666667vw 4.5333333333vw;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .product-block__btn {
    clip-path: polygon(0.7320644217vw 0%, 0% 0%, 100% 0, 100% calc(100% - 0.7320644217vw), calc(100% - 0.7320644217vw) 100%, 0% 100%, 0 100%, 0% 0.7320644217vw);
    margin-top: 1.8301610542vw;
    padding: 1.6837481698vw 2.5622254758vw 2.196193265vw;
  }
}
.product-block__btn--h3 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1.4285714286;
  text-align: center;
  margin-bottom: 6.4vw;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3 {
    font-size: 1.0248901903vw;
    margin-bottom: 1.756954612vw;
  }
}
.product-block__btn--h3:before, .product-block__btn--h3:after {
  content: "";
  display: block;
  background-size: 150% auto;
  background-position: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28.8vw;
  height: 1px;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3:before, .product-block__btn--h3:after {
    width: 17.5695461201vw;
  }
}
.product-block__btn--h3:before {
  background: linear-gradient(to right, #a200ff 0%, #ed0000 100%);
  left: -3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3:before {
    left: -2.5622254758vw;
  }
}
.product-block__btn--h3:after {
  background: linear-gradient(to left, #a200ff 0%, #ed0000 100%);
  right: -3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3:after {
    right: -2.5622254758vw;
  }
}
.product-block__btn--h3.medium:before, .product-block__btn--h3.medium:after {
  width: 30.4vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3.medium:before, .product-block__btn--h3.medium:after {
    width: 17.9355783309vw;
  }
}
.product-block__btn--h3.long:before, .product-block__btn--h3.long:after {
  width: 10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--h3.long:before, .product-block__btn--h3.long:after {
    width: 12.8111273792vw;
  }
}
.product-block__btn--wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--wrap {
    flex-direction: row;
    gap: 1.4641288433vw 1.0980966325vw;
  }
}
.product-block__btn--item {
  background: linear-gradient(90deg, #fff 0%, #fff 100%);
  position: relative;
  width: 84.9333333333vw;
  height: 16vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4.2666666667vw;
  padding: 0 0 2.9333333333vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--item {
    width: 19.9487554905vw;
    height: 4.39238653vw;
    font-size: 1.1713030747vw;
    padding: 0.878477306vw 0 0.8052708638vw;
    transition: 400ms;
  }
  .product-block__btn--item:after {
    display: block;
    content: "";
    background: linear-gradient(90deg, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: 400ms;
    z-index: 1;
  }
  .product-block__btn--item:hover .is-off {
    opacity: 0;
  }
  .product-block__btn--item:hover .is-on {
    opacity: 1;
  }
  .product-block__btn--item:hover:after {
    opacity: 1;
  }
}
.product-block__btn--item:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/product/bg_btn.webp) no-repeat;
  background-size: 100% auto;
  background-position: bottom;
  width: 100%;
  height: 16vw;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--item:before {
    height: 4.39238653vw;
    bottom: -0.3660322108vw;
  }
}
.product-block__btn--item span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.product-block__btn--item span:after {
  display: block;
  content: "";
  display: inline-block;
  background-image: url(../data/webp/common/icon_blank.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4vw;
  height: 4vw;
  margin-left: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--item span:after {
    width: 1.0980966325vw;
    height: 1.0980966325vw;
    margin-left: 0.7320644217vw;
  }
}
.product-block__btn--item span.is-off {
  background: linear-gradient(90deg, #6c00ff 0%, #ff008f 70%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
}
.product-block__btn--item span.is-off:after {
  background-image: url(../data/webp/common/icon_blank.webp);
}
.product-block__btn--item span.is-on {
  color: #fff;
  opacity: 0;
}
.product-block__btn--item span.is-on:after {
  background-image: url(../data/webp/common/icon_blank_wh.webp);
}
.product-block__btn--inner:has(a[tabindex="-1"]) {
  opacity: 50%;
}
.product-block__btn--inner:has(a[tabindex="-1"]) .product-block__btn--item {
  pointer-events: none;
}
.product-block__btn--grp {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--grp {
    gap: 0.7686676428vw 0.6954612006vw;
    margin-top: 0.1830161054vw;
  }
}
.product-block__btn--grp a {
  background-color: #fff;
  position: relative;
  width: 41.3333333333vw;
  height: 13.3333333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4vw;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .product-block__btn--grp a {
    width: 13.140556369vw;
    height: 2.4158125915vw;
    font-size: 0.878477306vw;
  }
}
@media only screen and (min-width: 751px) and (min-width: 751px) {
  .product-block__btn--grp a {
    transition: 400ms;
  }
  .product-block__btn--grp a:hover {
    opacity: 0.8;
  }
}
.product-block__spec {
  margin: 0 auto;
  position: relative;
  z-index: 1;
  padding-left: 4vw;
  padding-right: 4vw;
}
@media only screen and (min-width: 751px) {
  .product-block__spec {
    padding-left: 2.4890190337vw;
    padding-right: 2.4890190337vw;
  }
}
.product-block__spec--wrap {
  overflow-x: scroll;
  white-space: nowrap;
}
.product-block__spec--wrap:after {
  display: block;
  content: "";
  height: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__spec--wrap:after {
    height: 0.1830161054vw;
  }
}
.product-block__spec--wrap::-webkit-scrollbar {
  background: rgba(204, 204, 204, 0.2);
  height: 2.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__spec--wrap::-webkit-scrollbar {
    height: 0.5856515373vw;
  }
}
.product-block__spec--wrap::-webkit-scrollbar-thumb {
  border-radius: 0;
  background: rgba(204, 204, 204, 0.5);
}
.product-block__spec--item {
  display: inline-block;
  min-width: 100%;
  width: 312.1333333333vw;
  height: 128.2666666667vw;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .product-block__spec--item {
    width: 72.3279648609vw;
    height: 29.7218155198vw;
  }
}
.product-block__spec--item-ttl {
  position: sticky;
  width: 31.8666666667vw;
  height: 128.2666666667vw;
  top: 0;
  left: 0;
  z-index: 3;
}
@media only screen and (min-width: 751px) {
  .product-block__spec--item-ttl {
    width: 7.3938506589vw;
    height: 29.7218155198vw;
  }
}
.product-block__spec--item-dtl {
  position: absolute;
  top: 0;
  left: 31.8666666667vw;
  z-index: 2;
  width: 280.2666666667vw;
  height: 128.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__spec--item-dtl {
    left: 7.3938506589vw;
    width: 64.934114202vw;
    height: 29.7218155198vw;
  }
}
.product-block__slide--slider {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--slider {
    width: 46.4128843338vw;
  }
}
.product-block__slide--slider:not(:first-of-type) {
  margin-top: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--slider:not(:first-of-type) {
    margin-top: 2.196193265vw;
  }
}
.product-block__slide--pagination {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin-top: -1.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--pagination {
    margin-top: -0.3660322108vw;
  }
}
.product-block__slide--pagination .swiper-pagination-bullet {
  border-radius: 0;
  background: rgba(255, 255, 255, 0.5);
  width: 6.6666666667vw;
  height: 1.3333333333vw;
  margin: 0 0.4vw;
  opacity: 1;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--pagination .swiper-pagination-bullet {
    width: 1.8301610542vw;
    height: 0.3660322108vw;
    margin: 0 0.1098096633vw;
    transition: background 300ms;
  }
  .product-block__slide--pagination .swiper-pagination-bullet:hover {
    background: #fff;
  }
}
.product-block__slide--pagination .swiper-pagination-bullet-active {
  background-color: #fff;
  width: 20.6666666667vw;
  transition: none;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--pagination .swiper-pagination-bullet-active {
    width: 5.6734992679vw;
  }
}
.product-block__slide--navi {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6.9333333333vw;
  gap: 2vw;
  margin-top: 3.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--navi {
    height: 1.9033674963vw;
    gap: 1.2079062958vw;
    margin-top: 1.1713030747vw;
  }
}
.product-block__slide--prev, .product-block__slide--next {
  position: relative;
  background: transparent url(../img/common/arrow_wh.svg) no-repeat;
  background-size: contain;
  background-position: center;
  width: 5.7333333333vw;
  height: 6.9333333333vw;
  top: auto;
  left: auto;
  right: auto;
  margin-top: 0;
}
@media only screen and (min-width: 751px) {
  .product-block__slide--prev, .product-block__slide--next {
    width: 1.5739385066vw;
    height: 1.9033674963vw;
  }
}
.product-block__slide--prev:after, .product-block__slide--next:after {
  display: none;
}
.product-block__slide--prev {
  transform: rotate(-180deg);
}

.product-caution {
  width: 100%;
  padding: 0 4vw 10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-caution {
    padding: 0 2.5622254758vw 2.3426061493vw;
  }
}
@media only screen and (min-width: 751px) {
  .product-caution .txt-r {
    font-size: 0.5124450952vw;
  }
}
.product-caution__block:not(:first-of-type) {
  margin-top: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-caution__block:not(:first-of-type) {
    margin-top: 1.3909224012vw;
  }
}
.product-caution__block--ttl {
  color: #ccc;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.6;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .product-caution__block--ttl {
    font-size: 0.7320644217vw;
    margin-bottom: 0.2928257687vw;
  }
}
.product-caution__block--ttl span {
  width: calc(100% - 5.3333333333vw);
}
@media only screen and (min-width: 751px) {
  .product-caution__block--ttl span {
    width: calc(100% - 1.4641288433vw);
  }
}
.product-caution__block--ttl:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #a200ff 0%, #ed0000 100%);
  width: 4vw;
  height: 0.2666666667vw;
  margin-right: 1.3333333333vw;
  margin-top: 2.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-caution__block--ttl:before {
    width: 1.0980966325vw;
    height: 0.0732064422vw;
    margin-right: 0.3660322108vw;
    margin-top: 0.5856515373vw;
  }
}
.product-caution__block--dtl, .product-caution__block--list {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #ccc;
  font-size: 2.6666666667vw;
  line-height: 1.6;
}
@media only screen and (min-width: 751px) {
  .product-caution__block--dtl, .product-caution__block--list {
    font-size: 0.7320644217vw;
  }
}
.product-caution__block--list:has(.txt-norm) li {
  padding-left: 0;
  text-indent: 0;
}
.product-caution__block--list li {
  padding-left: 2.6666666667vw;
  text-indent: -1.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-caution__block--list li {
    padding-left: 0.7320644217vw;
    text-indent: -0.3660322108vw;
  }
}
.product-caution__block--list li:not(.txt-norm):before {
  content: "※";
  display: inline-block;
}
.product-caution__txt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #cccccc;
  font-size: 2.6666666667vw;
  line-height: 1.6;
  margin-top: 6.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .product-caution__txt {
    font-size: 0.7320644217vw;
    line-height: 1.6;
    margin-top: 1.317715959vw;
  }
}
.product-caution__txt a {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #cccccc;
  font-size: 2.6666666667vw;
  line-height: 1.6;
}
@media only screen and (min-width: 751px) {
  .product-caution__txt a {
    font-size: 0.7320644217vw;
  }
}
.product-caution__txt b {
  display: inline-block;
  font-weight: 900;
  font-size: 1.2em;
  margin-bottom: 0.3em;
}

.story .header-nav__list--item[data-current=story]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .story .header-nav__list--item[data-current=story]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
@media only screen and (min-width: 751px) {
  .story .common-title__roma {
    letter-spacing: 0;
    text-indent: 0;
  }
}
@media only screen and (min-width: 751px) {
  .story-cont {
    margin-bottom: 2.9648609078vw;
  }
}
.story-block {
  margin: 0 auto;
  padding: 0 4vw 11.2vw;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .story-block {
    padding: 0.7320644217vw 0 3.074670571vw;
  }
}
.story-block__txt {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1.8214285714;
  word-break: keep-all;
  text-shadow: 0 0 1.8666666667vw #000;
}
@media only screen and (min-width: 751px) {
  .story-block__txt {
    font-size: 1.0248901903vw;
    line-height: 2;
    text-shadow: 0 0 0.5124450952vw #000;
  }
}
.story-block__txt:not(:first-of-type) {
  margin-top: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .story-block__txt:not(:first-of-type) {
    margin-top: 1.0980966325vw;
  }
}

.chara .header-nav__list--item[data-current=character]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .chara .header-nav__list--item[data-current=character]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
.chara .common-title {
  margin-bottom: 15.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara .common-title {
    margin-bottom: 3.4407027818vw;
  }
}
.chara-wrap {
  padding: 0 4vw 11.6vw;
}
@media only screen and (min-width: 751px) {
  .chara-wrap {
    padding: 0 1.0980966325vw 3.1844802343vw;
  }
}
.chara-wrap[data-chara=character] .chara-nav__list--item[data-current=character] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.chara-wrap[data-chara=original] .chara-nav__list--item[data-current=original] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.chara-wrap[data-chara=special] .chara-nav__list--item[data-current=special] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
.chara-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6vw;
}
@media only screen and (min-width: 751px) {
  .chara-nav {
    gap: 1.0980966325vw;
  }
}
.chara-nav__list {
  width: 29.4666666667vw;
  height: 10vw;
}
@media only screen and (min-width: 751px) {
  .chara-nav__list {
    width: 9.0409956076vw;
    height: 1.9765739385vw;
  }
}
.chara-nav__list--item {
  background: linear-gradient(to left, #222 0%, #222 100%);
  background-size: 120% auto;
  background-position: center;
  clip-path: polygon(0% 0%, 100% 0, 100% 7.8666666667vw, 27.3333333333vw 100%, 0% 100%);
  color: #fff;
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.2307692308;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .chara-nav__list--item:after {
    transition: 400ms;
  }
  .chara-nav__list--item:hover:after {
    opacity: 1;
  }
}
@media only screen and (min-width: 751px) {
  .chara-nav__list--item {
    clip-path: polygon(0% 0%, 100% 0, 100% 1.3909224012vw, 8.4553440703vw 100%, 0% 100%);
    font-size: 0.9516837482vw;
  }
  .chara-nav__list--item:after {
    display: block;
    content: "";
    background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
  }
}
.chara-nav__list--item span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
.chara-pager {
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .chara-pager {
    margin: 0 auto;
    width: 60.6881405564vw;
  }
}
.chara-pager__wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.chara-pager__right {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__right {
    gap: 0.3660322108vw;
  }
}
.chara-pager__index {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(17, 17, 17, 0.5);
  width: 21.3333333333vw;
  height: 8vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__index {
    width: 5.8565153734vw;
    height: 2.196193265vw;
    transition: 400ms;
  }
  .chara-pager__index:hover {
    background-color: #fff;
  }
  .chara-pager__index:hover p {
    color: #222;
  }
  .chara-pager__index:hover .parts span {
    background-color: #222;
  }
}
.chara-pager__index p {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 3.7333333333vw;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__index p {
    font-size: 1.0248901903vw;
    gap: 0.5490483163vw;
    transition: 400ms;
  }
}
.chara-pager__index p:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/icon_index.webp) no-repeat;
  background-size: contain;
}
.chara-pager__index .parts {
  width: 3.4666666667vw;
  height: 3.2vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__index .parts {
    width: 0.9516837482vw;
    height: 0.878477306vw;
    gap: 0.0732064422vw;
  }
}
.chara-pager__index .parts span {
  background-color: #fff;
  width: 1.4933333333vw;
  height: 1.4933333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__index .parts span {
    width: 0.4099560761vw;
    height: 0.4099560761vw;
    transition: 400ms;
  }
}
.chara-pager__prev, .chara-pager__next {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(17, 17, 17, 0.5);
  width: 21.3333333333vw;
  height: 8vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__prev, .chara-pager__next {
    width: 5.8565153734vw;
    height: 2.196193265vw;
  }
  .chara-pager__prev:hover .btn-txt, .chara-pager__next:hover .btn-txt {
    background-color: #fff;
    color: #111;
  }
  .chara-pager__prev:hover .btn-txt svg path, .chara-pager__next:hover .btn-txt svg path {
    fill: #111;
  }
}
.chara-pager__prev .btn-txt, .chara-pager__next .btn-txt {
  display: flex;
  align-items: center;
  justify-content: center;
}
.chara-pager__prev .btn-txt svg, .chara-pager__next .btn-txt svg {
  width: 2.9333333333vw;
  height: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__prev .btn-txt svg, .chara-pager__next .btn-txt svg {
    width: 0.8052708638vw;
    height: 0.9516837482vw;
  }
}
.chara-pager__prev .btn-txt svg path, .chara-pager__next .btn-txt svg path {
  fill: #fff;
}
@media only screen and (min-width: 751px) {
  .chara-pager__prev .btn-txt svg path, .chara-pager__next .btn-txt svg path {
    transition: 400ms;
  }
}
.chara-pager__prev .btn-txt, .chara-pager__next .btn-txt {
  color: #fff;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 3.7333333333vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8666666667vw;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media only screen and (min-width: 751px) {
  .chara-pager__prev .btn-txt, .chara-pager__next .btn-txt {
    width: 100%;
    height: 1.8301610542vw;
    font-size: 1.0248901903vw;
    gap: 0.6954612006vw;
    padding: 0 0.3660322108vw;
    transition: 400ms;
  }
}
.chara-pager__prev .btn-txt span {
  margin-top: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__prev .btn-txt span {
    margin-top: 0.1464128843vw;
  }
}
.chara-pager__prev .btn-txt svg {
  transform: rotate(180deg);
}
.chara-pager__next .btn-txt span {
  margin-top: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-pager__next .btn-txt span {
    margin-top: 0.1464128843vw;
  }
}
.chara-block {
  margin-top: 6.2666666667vw;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block {
    margin-top: 1.9033674963vw;
    gap: 0.2562225476vw;
    flex-direction: row;
    justify-content: center;
  }
}
.chara-block__list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list {
    gap: 0.1464128843vw;
    margin-top: 0;
    width: 30.270863836vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-block__list a:after {
    display: block;
    content: "";
    background-image: url(../data/webp/title/bg_pc_on.webp);
    background-size: contain;
    background-repeat: no-repeat;
    width: 30.270863836vw;
    height: 4.7218155198vw;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
    transition: 400ms;
  }
  .chara-block__list a:hover:after {
    opacity: 1;
  }
}
.chara-block__list--item {
  color: #fff;
  width: 92vw;
  height: 14.2666666667vw;
  display: flex;
  align-items: center;
  flex-direction: row;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item {
    width: 30.270863836vw;
    height: 4.7218155198vw;
  }
}
.chara-block__list--item:before {
  display: block;
  content: "";
  background-image: url(../img/title/bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item:before {
    background-image: url(../data/webp/title/bg_pc.webp);
    transition: 400ms;
  }
}
.chara-block__list--item[data-title=raideen] .chara-block__list--logo span {
  width: 22.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=raideen] .chara-block__list--logo span {
    width: 7.3938506589vw;
  }
}
.chara-block__list--item[data-title=cbv] .chara-block__list--logo span {
  width: 20.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=cbv] .chara-block__list--logo span {
    width: 6.7349926794vw;
  }
}
.chara-block__list--item[data-title=dunbine] .chara-block__list--logo span {
  width: 12.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=dunbine] .chara-block__list--logo span {
    width: 3.8433382138vw;
  }
}
.chara-block__list--item[data-title=dunbine_new] .chara-block__list--logo span {
  width: 12.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=dunbine_new] .chara-block__list--logo span {
    width: 4.1361639824vw;
  }
}
.chara-block__list--item[data-title=lgaim] .chara-block__list--logo span {
  width: 20.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=lgaim] .chara-block__list--logo span {
    width: 6.7349926794vw;
  }
}
.chara-block__list--item[data-title=zg] .chara-block__list--logo span {
  width: 18.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=zg] .chara-block__list--logo span {
    width: 5.710102489vw;
  }
}
.chara-block__list--item[data-title=gshar] .chara-block__list--logo span {
  width: 20vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gshar] .chara-block__list--logo span {
    width: 5.710102489vw;
  }
}
.chara-block__list--item[data-title=msv] .chara-block__list--logo span {
  width: 24.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=msv] .chara-block__list--logo span {
    width: 8.0893118594vw;
  }
}
.chara-block__list--item[data-title=gg] .chara-block__list--logo span {
  width: 18.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gg] .chara-block__list--logo span {
    width: 6.149341142vw;
  }
}
.chara-block__list--item[data-title=gew] .chara-block__list--logo span {
  width: 13.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gew] .chara-block__list--logo span {
    width: 4.5754026354vw;
  }
}
.chara-block__list--item[data-title=gsd] .chara-block__list--logo span {
  width: 23.6vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gsd] .chara-block__list--logo span {
    width: 7.7964860908vw;
  }
}
.chara-block__list--item[data-title=gw] .chara-block__list--logo span {
  width: 22.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gw] .chara-block__list--logo span {
    width: 7.2108345534vw;
  }
}
.chara-block__list--item[data-title=gw] .chara-block__list--ttl {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gw] .chara-block__list--ttl {
    margin-top: 1.0980966325vw;
  }
}
.chara-block__list--item[data-title=mzks] .chara-block__list--logo span {
  width: 18.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mzks] .chara-block__list--logo span {
    width: 6.0761346999vw;
  }
}
.chara-block__list--item[data-title=gra] .chara-block__list--logo span {
  width: 18.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gra] .chara-block__list--logo span {
    width: 6.6983894583vw;
  }
}
.chara-block__list--item[data-title=gra] .chara-block__list--ttl {
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gra] .chara-block__list--ttl {
    margin-top: 0.2928257687vw;
  }
}
.chara-block__list--item[data-title=mp] .chara-block__list--logo span {
  width: 23.2vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mp] .chara-block__list--logo span {
    width: 7.6866764275vw;
  }
}
.chara-block__list--item[data-title=mdw] .chara-block__list--logo span {
  width: 23.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mdw] .chara-block__list--logo span {
    width: 7.8696925329vw;
  }
}
.chara-block__list--item[data-title=mdw] .chara-block__list--badge.i2 {
  left: 38.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mdw] .chara-block__list--badge.i2 {
    left: 13.9092240117vw;
  }
}
.chara-block__list--item[data-title=mdw_movie] .chara-block__list--logo span {
  width: 22.2666666667vw;
}
@media only screen and (max-width: 750px) {
  .chara-block__list--item[data-title=mdw_movie] .chara-block__list--logo span {
    margin-top: 1.8666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mdw_movie] .chara-block__list--logo span {
    width: 7.3572474378vw;
  }
}
.chara-block__list--item[data-title=mdw_movie] .chara-block__list--ttl {
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=mdw_movie] .chara-block__list--ttl {
    margin-top: 0.2928257687vw;
  }
}
.chara-block__list--item[data-title=cglr3] .chara-block__list--logo span {
  width: 23.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=cglr3] .chara-block__list--logo span {
    width: 7.6134699854vw;
  }
}
.chara-block__list--item[data-title=cglr] .chara-block__list--logo span {
  width: 21.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=cglr] .chara-block__list--logo span {
    width: 7.1376281113vw;
  }
}
.chara-block__list--item[data-title=gsp] .chara-block__list--logo span {
  width: 20.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=gsp] .chara-block__list--logo span {
    width: 6.7715959004vw;
  }
}
.chara-block__list--item[data-title=dyna] .chara-block__list--logo span {
  width: 23.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--item[data-title=dyna] .chara-block__list--logo span {
    width: 7.4304538799vw;
  }
}
.chara-block__list--badge {
  position: absolute;
  top: 0;
  width: 12.8vw;
  left: 28.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--badge {
    width: 4.5754026354vw;
    left: 10.1756954612vw;
  }
}
.chara-block__list--logo {
  width: 27.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--logo {
    width: 9.8096632504vw;
  }
}
.chara-block__list--logo span {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  width: 39.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--logo span {
    width: 8.3089311859vw;
  }
}
.chara-block__list--logo span img {
  width: auto;
  height: auto;
  max-height: 19.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--logo span img {
    max-height: 3.9897510981vw;
  }
}
.chara-block__list--ttl {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  padding: 0 3.7333333333vw;
  word-break: break-word;
  width: calc(100% - 27.3333333333vw);
}
@media only screen and (min-width: 751px) {
  .chara-block__list--ttl {
    font-size: 0.9421669107vw;
    padding: 0 1.2079062958vw;
    width: calc(100% - 9.8096632504vw);
  }
}
.chara-block__list--ttl span {
  color: #cccccc;
  display: block;
  font-size: 2.0453333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__list--ttl span {
    font-size: 0.6731332357vw;
    margin-top: 0.2928257687vw;
  }
}
.chara-block__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8666666667vw;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .chara-block__nav {
    gap: 1.0248901903vw;
  }
}
.chara-block__nav--item {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.1538461538;
  display: block;
  width: 29.6vw;
  text-align: center;
  position: relative;
  z-index: 2;
  padding-bottom: 5.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item {
    width: 7.9795021962vw;
    font-size: 0.9516837482vw;
    line-height: 1.2307692308;
    padding-bottom: 1.1713030747vw;
  }
  .chara-block__nav--item:hover .chara-block__nav--item-parts:before {
    left: -0.6222547584vw;
  }
  .chara-block__nav--item:hover .chara-block__nav--item-parts:after {
    right: -0.6222547584vw;
  }
  .chara-block__nav--item:hover .chara-block__nav--item-parts .on {
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
}
.chara-block__nav--item-parts {
  width: 100%;
  height: 2vw;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item-parts {
    height: 0.5490483163vw;
  }
  .chara-block__nav--item-parts .on {
    display: block;
    background-image: url(../data/webp/chara/parts_nav_on.webp);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.8301610542vw;
    height: 0.878477306vw;
    position: absolute;
    top: -0.2928257687vw;
    left: 50%;
    transform: translate3d(-50%, -20%, 0);
    opacity: 0;
    transition: 400ms;
  }
}
.chara-block__nav--item-parts:before, .chara-block__nav--item-parts:after {
  content: "";
  display: block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item-parts:before, .chara-block__nav--item-parts:after {
    width: 4.0629575403vw;
    transition: 400ms;
  }
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item-parts:before {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    left: 0;
    transform: rotateY(180deg);
  }
}
.chara-block__nav--item-parts:after {
  background-image: url(../data/webp/chara/parts_nav.webp);
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item-parts:after {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    right: 0;
  }
}
.chara-block__nav--item.pb {
  padding-top: 2.4vw;
  padding-bottom: 7.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-block__nav--item.pb {
    padding-top: 0.6954612006vw;
    padding-bottom: 1.6837481698vw;
  }
}
.chara-block__nav:has(.chara-block__nav--item:nth-of-type(n+4)) {
  flex-wrap: wrap;
  gap: 4vw 1.8666666667vw;
}
.chara-h2 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  text-shadow: 0 0 2.6666666667vw #000;
  height: 23.6vw;
  position: relative;
  z-index: 2;
  padding-top: 8.8vw;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .chara-h2 {
    font-size: 1.9033674963vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
    height: 6.2225475842vw;
    padding-top: 2.1229868228vw;
  }
}
.chara-h2.small {
  font-size: 5.8666666667vw;
  padding-top: 6.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-h2.small {
    font-size: 1.756954612vw;
    padding-top: 2.1229868228vw;
  }
}
.chara-h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/chara/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .chara-h2:before {
    background-image: url(../data/webp/chara/bg_title_pc.webp);
    width: 60.980966325vw;
    height: 6.2225475842vw;
  }
}

@keyframes chara-bullet {
  0% {
    clip-path: polygon(0 0, 0 0, 0% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-width: 751px) {
  .chara-detail {
    margin-bottom: 3.1478770132vw;
  }
}
.chara-detail .common-title {
  margin-bottom: 16.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail .common-title {
    margin-bottom: 0.6222547584vw;
  }
}
.chara-detail__wrap {
  padding-bottom: 13.3333333333vw;
  position: static;
}
@media only screen and (max-width: 750px) {
  .chara-detail__wrap {
    padding-left: 0;
    padding-right: 0;
  }
}
@media only screen and (min-width: 751px) {
  .chara-detail__wrap {
    padding-bottom: 3.1478770132vw;
  }
}
.chara-detail__body {
  padding: 0;
  margin: 8vw auto 0;
  width: 100%;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .chara-detail__body {
    margin-top: 1.0980966325vw;
    padding: 0.878477306vw 0 0;
    width: 60.8345534407vw;
  }
}
.chara-detail__body:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  clip-path: polygon(0 0, 0 0, 0 0, 100% 0, 100% 0, 100% 0, 100% 100%, 85.3333333333vw 100%, 78.6666666667vw calc(100% - 6.1333333333vw), 21.8666666667vw calc(100% - 6.1333333333vw), 15.0666666667vw 100%, 0 100%);
  mix-blend-mode: overlay;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .chara-detail__body:before {
    clip-path: polygon(0 0, 0 0, 0 0, 100% 0, 100% 0, 100% 0, 100% 100%, 46.1200585652vw 100%, 45.4612005857vw calc(100% - 0.7320644217vw), 17.4231332357vw calc(100% - 0.7320644217vw), 16.8374816984vw 100%, 0 100%);
  }
}
.chara-detail__block {
  position: relative;
  z-index: 2;
}
.chara-detail__block--kv {
  width: 100%;
  margin: 0 auto;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--kv {
    width: 59.4802342606vw;
  }
}
.chara-detail__block--ttl {
  text-align: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.0666666667vw;
  line-height: 1.4736842105;
  margin-top: 6.9333333333vw;
  text-shadow: 0 0 2.6666666667vw #000;
  padding: 0 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--ttl {
    font-size: 1.6837481698vw;
    padding: 0 2.9282576867vw;
    margin-top: 1.6837481698vw;
    line-height: 1;
  }
}
.chara-detail__block--wrap {
  position: relative;
  z-index: 2;
  width: 100%;
}
.chara-detail__block--dtl {
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  clip-path: polygon(0 0, 15.0666666667vw 0, 21.8666666667vw 6.1333333333vw, 78.6666666667vw 6.1333333333vw, 85.3333333333vw 0, 100% 0, 100% 100%, 85.3333333333vw 100%, 78.6666666667vw calc(100% - 6.1333333333vw), 21.8666666667vw calc(100% - 6.1333333333vw), 15.0666666667vw 100%, 0 100%);
  padding-top: 13.3333333333vw;
  padding-bottom: 10vw;
  margin-top: 4.2666666667vw;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--dtl {
    clip-path: polygon(0 0, 20.1317715959vw 0, 21.5959004392vw 1.317715959vw, 39.458272328vw 1.317715959vw, 40.9956076135vw 0, 100% 0, 100% 100%, 46.1200585652vw 100%, 45.4612005857vw calc(100% - 0.7320644217vw), 17.4231332357vw calc(100% - 0.7320644217vw), 16.8374816984vw 100%, 0 100%);
    padding-top: 3.074670571vw;
    padding-bottom: 2.6720351391vw;
    margin-top: 1.2811127379vw;
  }
}
.chara-detail__block--tag {
  width: 100%;
  position: absolute;
  top: -2.4vw;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--tag {
    top: -0.5124450952vw;
  }
}
.chara-detail__block--tag-item {
  width: 26.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--tag-item {
    width: 5.4904831625vw;
  }
}
.chara-detail__block--tag-item:not(:first-of-type) {
  margin-left: -5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--tag-item:not(:first-of-type) {
    margin-left: -0.7320644217vw;
  }
}
.chara-detail__block--slider {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--slider {
    width: 56.588579795vw;
  }
}
.chara-detail__block--slider:not(:first-of-type) {
  margin-top: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--slider:not(:first-of-type) {
    margin-top: 2.196193265vw;
  }
}
.chara-detail__block--pagination {
  position: relative;
  z-index: 1;
  margin-top: 4.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--pagination {
    margin-top: 1.2445095168vw;
  }
}
.chara-detail__block--pagination .swiper-pagination-bullet {
  border-radius: 0;
  background-color: rgba(255, 255, 255, 0.5);
  width: 6.6666666667vw;
  height: 1.3333333333vw;
  margin: 0 0.4vw;
  opacity: 1;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--pagination .swiper-pagination-bullet {
    width: 1.8301610542vw;
    height: 0.3660322108vw;
    margin: 0 0.1098096633vw;
    transition: background-color 300ms;
  }
  .chara-detail__block--pagination .swiper-pagination-bullet:hover {
    background-color: #fff;
  }
}
.chara-detail__block--pagination .swiper-pagination-bullet:after {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  clip-path: polygon(0 0, 0 0, 0% 100%, 0% 100%);
}
.chara-detail__block--pagination .chara-pagination-bullet-active {
  background-color: #fff;
  width: 20.6666666667vw;
  transition: none;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--pagination .chara-pagination-bullet-active {
    width: 5.6734992679vw;
  }
}
.chara-detail__block--pagination .chara-pagination-bullet-active:after {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  animation: chara-bullet 5000ms linear;
}
.chara-detail__block--synopsis {
  background-color: rgba(0, 0, 0, 0.5);
  margin: 6.5333333333vw auto 0;
  width: 92vw;
  padding: 9.0666666667vw 5.3333333333vw 8vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--synopsis {
    margin-top: 2.196193265vw;
    width: 56.588579795vw;
    padding: 2.0863836018vw 2.9282576867vw 2.635431918vw;
  }
}
.chara-detail__block--synopsis-ttl {
  text-align: center;
}
.chara-detail__block--synopsis-ttl span {
  display: inline-block;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.6vw;
  letter-spacing: 0.15em;
  text-indent: 0.15em;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--synopsis-ttl span {
    font-size: 1.5373352855vw;
    letter-spacing: 0.1em;
    text-indent: 0.1em;
  }
}
.chara-detail__block--synopsis-ttl span:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  background-size: 100% auto;
  width: 36vw;
  height: 1.6vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--synopsis-ttl span:before {
    width: 9.8828696925vw;
    height: 0.439238653vw;
  }
}
.chara-detail__block--synopsis-txt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.7916666667;
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-detail__block--synopsis-txt {
    font-size: 1.0248901903vw;
    line-height: 1.7142857143;
    margin-top: 1.0980966325vw;
  }
}

@media only screen and (min-width: 751px) {
  .chara-orisp {
    margin-bottom: 3.1478770132vw;
  }
}
.chara-orisp__wrap {
  padding-left: 0;
  padding-right: 0;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__wrap[data-chara=special] {
    padding-bottom: 4.39238653vw;
  }
}
.chara-orisp__cont {
  margin: 12.4vw auto 0;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__cont {
    margin-top: 2.635431918vw;
    width: 60.8345534407vw;
  }
}
.chara-orisp__item {
  margin-top: -14.4vw;
  padding-top: 14.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__item {
    margin-top: -3.3674963397vw;
    padding-top: 3.3674963397vw;
  }
}
.chara-orisp__item:not(:last-of-type) {
  margin-bottom: 10.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__item:not(:last-of-type) {
    margin-bottom: 3.3674963397vw;
  }
}
.chara-orisp__block {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-top: 13.7333333333vw;
  padding-bottom: 21.2vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block {
    padding-top: 2.2693997072vw;
    padding-bottom: 3.8067349927vw;
  }
}
.chara-orisp__block:before {
  display: block;
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 96vw 100%, 93.3333333333vw calc(100% - 2.6666666667vw), 6.6666666667vw calc(100% - 2.6666666667vw), 4vw 100%, 0 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block:before {
    clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 43.9970717423vw 100%, 43.411420205vw calc(100% - 0.7320644217vw), 17.4231332357vw calc(100% - 0.7320644217vw), 16.8374816984vw 100%, 0 100%);
  }
}
.chara-orisp__block--item {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
  width: 92.8vw;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item {
    width: 56.588579795vw;
    height: 31.6251830161vw;
    padding: 0 2.6720351391vw;
  }
}
.chara-orisp__block--item:not(:first-of-type) {
  margin-top: 6.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item:not(:first-of-type) {
    margin-top: 1.2811127379vw;
  }
}
@media only screen and (max-width: 750px) {
  .chara-orisp__block--item:before {
    display: block;
    content: "";
    background-image: url(../data/webp/chara/original/bg_pattern.webp);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    width: 91.7333333333vw;
    height: 96.6666666667vw;
    position: absolute;
    bottom: 0.4vw;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 2;
  }
}
.chara-orisp__block--item.i1 {
  background-image: url(../data/webp/chara/original/frame_1.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp__block--item.i1 {
    height: 148vw;
  }
}
.chara-orisp__block--item.i2 {
  background-image: url(../data/webp/chara/original/frame_2.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp__block--item.i2 {
    height: 137.3333333333vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.i2 .chara-orisp__name--txt {
    padding-right: 5.9297218155vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.i2 .chara-orisp__block--dtl {
    margin-left: auto;
  }
}
.chara-orisp__block--item.sp {
  height: 112vw;
}
@media only screen and (max-width: 750px) {
  .chara-orisp__block--item.sp {
    background-image: url(../data/webp/chara/special/frame.webp);
  }
  .chara-orisp__block--item.sp:before {
    background-image: url(../data/webp/chara/special/bg_pattern.webp);
    width: 91.7333333333vw;
    height: 60.6666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp {
    height: 22.0351390922vw;
    padding: 0 2.6720351391vw;
  }
}
.chara-orisp__block--item.sp:not(:first-of-type) {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp:not(:first-of-type) {
    margin-top: 0.7320644217vw;
  }
}
.chara-orisp__block--item.sp .chara-orisp__block--dtl {
  padding: 58.1333333333vw 6.1333333333vw 0;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp .chara-orisp__block--dtl {
    padding: 4.9048316252vw 0 0;
  }
}
.chara-orisp__block--item.sp .chara-orisp__txt {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp .chara-orisp__txt {
    margin-top: 1.0980966325vw;
  }
}
.chara-orisp__block--item.sp .chara-orisp__txt p {
  text-shadow: 0 0 2.6666666667vw rgba(0, 0, 0, 0.5);
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp .chara-orisp__txt p {
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
  }
}
.chara-orisp__block--item.sp .chara-orisp__block--img {
  height: 100vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp .chara-orisp__block--img {
    width: 28.074670571vw;
    height: 28.074670571vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp1 {
    background-image: url(../data/webp/chara/special/1/bg_chara_special.webp);
    margin-top: 2.6720351391vw;
  }
}
.chara-orisp__block--item.sp1 .chara-orisp__block--img {
  top: -10.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp1 .chara-orisp__block--img {
    top: -4.2459736457vw;
    left: calc(50% - 0.3660322108vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp2 {
    background-image: url(../data/webp/chara/special/2/bg_chara_special.webp);
  }
}
.chara-orisp__block--item.sp2 .chara-orisp__block--img {
  top: -16.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp2 .chara-orisp__block--img {
    top: -3.1478770132vw;
    left: calc(50% + 0.3660322108vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp3 {
    background-image: url(../data/webp/chara/special/3/bg_chara_special.webp);
  }
}
.chara-orisp__block--item.sp3 .chara-orisp__block--img {
  top: -15.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp3 .chara-orisp__block--img {
    top: -3.2942898975vw;
    left: calc(50% + 0.2196193265vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp4 {
    background-image: url(../data/webp/chara/special/4/bg_chara_special.webp);
  }
}
.chara-orisp__block--item.sp4 .chara-orisp__block--img {
  top: -15.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp4 .chara-orisp__block--img {
    top: -3.5871156662vw;
    left: calc(50% - 0.878477306vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp5 {
    background-image: url(../data/webp/chara/special/5/bg_chara_special.webp);
  }
}
.chara-orisp__block--item.sp5 .chara-orisp__block--img {
  top: -15.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp5 .chara-orisp__block--img {
    top: -3.2210834553vw;
    left: calc(50% + 0.1464128843vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp6 {
    background-image: url(../data/webp/chara/special/6/bg_chara_special.webp);
  }
}
.chara-orisp__block--item.sp6 .chara-orisp__block--img {
  top: -13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--item.sp6 .chara-orisp__block--img {
    top: -2.9282576867vw;
    left: calc(50% - 0.7320644217vw);
  }
}
.chara-orisp__block--img {
  width: 100%;
  width: 100vw;
  height: 128vw;
  position: absolute;
  top: 0;
  z-index: 1;
  pointer-events: none;
}
@media only screen and (max-width: 750px) {
  .chara-orisp__block--img {
    left: 50%;
    transform: translate3d(-50%, 0, 0);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--img {
    width: 40.9956076135vw;
    height: 40.9956076135vw;
  }
}
.chara-orisp__block--dtl {
  position: relative;
  z-index: 2;
  padding: 57.3333333333vw 5.6vw 0;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--dtl {
    padding: 0;
    width: 26.7203513909vw;
  }
}
.chara-orisp__block--slide {
  margin-top: 10vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__block--slide {
    margin-top: 2.2693997072vw;
  }
}
.chara-orisp__name {
  display: flex;
  flex-direction: row;
  position: relative;
  z-index: 1;
  width: fit-content;
}
.chara-orisp__name--txt {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  clip-path: polygon(0 0, 100% 0%, calc(100% - 8.2666666667vw) 100%, 0% 100%);
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.8666666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: 13.8666666667vw;
  padding: 0 7.7333333333vw 0 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name--txt {
    clip-path: polygon(0 0, 100% 0%, calc(100% - 1.4641288433vw) 100%, 0% 100%);
    font-size: 1.4641288433vw;
    height: 3.0014641288vw;
    padding: 0 1.5373352855vw 0 0.9882869693vw;
    letter-spacing: 0.025em;
    text-indent: -0.025em;
  }
}
.chara-orisp__name--pilot {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 2.6666666667vw;
  line-height: 1.6;
  position: relative;
  z-index: 1;
  padding: 2.1333333333vw 4.2666666667vw 0 11.4666666667vw;
  margin-left: -10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name--pilot {
    font-size: 0.878477306vw;
    line-height: 1;
    padding: 1.0980966325vw 0.3660322108vw 0 2.4890190337vw;
    margin-left: -2.196193265vw;
  }
}
.chara-orisp__name--pilot span {
  font-size: 3.2vw;
  line-height: 1.3333333333;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name--pilot span {
    font-size: 0.878477306vw;
    line-height: 1;
  }
}
.chara-orisp__name--pilot:after {
  display: block;
  content: "";
  background-color: #de00a8;
  width: 100%;
  height: 0.5333333333vw;
  position: absolute;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name--pilot:after {
    height: 0.1464128843vw;
  }
}
.chara-orisp__name--cv {
  background-color: #1a1a1a;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6.6666666667vw;
  padding: 0 2.6666666667vw;
  position: absolute;
  bottom: -4vw;
  right: 0;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name--cv {
    font-size: 0.8052708638vw;
    height: 1.5007320644vw;
    padding: 0 0.7320644217vw;
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    right: -0.5856515373vw;
  }
}
.chara-orisp__name.t2 .chara-orisp__name--txt {
  padding: 0.6666666667vw 1.2vw 0.6666666667vw 0.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name.t2 .chara-orisp__name--txt {
    padding: 0.1464128843vw 0.2562225476vw 0.1464128843vw 0.1464128843vw;
  }
}
.chara-orisp__name.t2 .chara-orisp__name--txt span {
  background-color: #000;
  position: relative;
  display: block;
  padding: 0 9.6vw 0 3.3333333333vw;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(0 0, 100% 0%, calc(100% - 7.6vw) 100%, 0% 100%);
}
@media only screen and (min-width: 751px) {
  .chara-orisp__name.t2 .chara-orisp__name--txt span {
    clip-path: polygon(0 0, 100% 0%, calc(100% - 1.317715959vw) 100%, 0% 100%);
    padding: 0 2.1229868228vw 0 1.317715959vw;
  }
}
.chara-orisp__name.t2 .chara-orisp__name--cv {
  background-color: #fff;
  color: #000;
}
.chara-orisp__txt {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.5833333333;
  color: #fff;
  margin-top: 9.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__txt {
    font-size: 0.878477306vw;
    line-height: 1.5833333333;
    margin-top: 1.4641288433vw;
    width: 27.4524158126vw;
    height: fit-content;
  }
}
.chara-orisp__txt span {
  display: block;
  color: #bbb;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__txt span {
    margin-top: 0.5124450952vw;
  }
}
.chara-orisp__txt span:only-child {
  margin-top: 0;
}
.chara-orisp__sp {
  margin-top: 7.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp {
    margin-top: 2.1229868228vw;
  }
}
.chara-orisp__sp--item {
  margin-top: 7.8666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--item {
    margin-top: 2.1229868228vw;
  }
}
.chara-orisp__sp--wrap {
  margin: 0 auto 0;
  padding-top: 8vw;
  padding-bottom: 14.8vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--wrap {
    width: 60.8345534407vw;
    padding-top: 3.1844802343vw;
    padding-bottom: 4.5387994143vw;
  }
}
.chara-orisp__sp--wrap:before {
  display: block;
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 96vw 100%, 93.3333333333vw calc(100% - 2.6666666667vw), 6.6666666667vw calc(100% - 2.6666666667vw), 4vw 100%, 0 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--wrap:before {
    clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 43.9970717423vw 100%, 43.411420205vw calc(100% - 0.7320644217vw), 17.4231332357vw calc(100% - 0.7320644217vw), 16.8374816984vw 100%, 0 100%);
    margin-top: -0.7320644217vw;
  }
}
.chara-orisp__sp--wrap .chara-orisp__block--slide {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--wrap .chara-orisp__block--slide {
    margin-top: 1.9033674963vw;
  }
}
.chara-orisp__sp--h3 {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.6666666667vw;
  line-height: 1.12;
  color: #fff;
  margin: 0 auto;
  width: fit-content;
  height: 10.4vw;
  padding: 0 4.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--h3 {
    font-size: 1.756954612vw;
    line-height: 1;
    height: 2.5622254758vw;
    padding: 0 1.0980966325vw;
  }
}
.chara-orisp__sp--ttl {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 2;
  color: #fff;
  text-align: center;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--ttl {
    font-size: 1.0980966325vw;
    line-height: 1.0666666667;
    margin-top: 1.0248901903vw;
  }
}
.chara-orisp__sp--btn {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.7333333333vw;
  line-height: 1.5714285714;
  text-align: center;
  padding-bottom: 12.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--btn {
    font-size: 1.0980966325vw;
    line-height: 1;
    padding-bottom: 0;
    margin-top: 2.3426061493vw;
  }
}
.chara-orisp__sp--btn a {
  color: #00c6ff;
  font-weight: 400;
  border-bottom: solid 0.2666666667vw #00c6ff;
}
@media only screen and (min-width: 751px) {
  .chara-orisp__sp--btn a {
    border-bottom: solid min(0.0366032211vw, 1px) #00c6ff;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i1 {
    background-image: url(../data/webp/chara/original/original_1/bg_chara_orig_rb.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i1 .chara-orisp__block--dtl {
    padding-top: 11.2005856515vw;
  }
}
.chara-orisp #ori_1 .chara-orisp__block--item.i1 .chara-orisp__block--img {
  top: -15.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i1 .chara-orisp__block--img {
    top: -7.027818448vw;
    left: calc(50% - 3.8799414348vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i2 {
    background-image: url(../data/webp/chara/original/original_1/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i2 .chara-orisp__block--dtl {
    padding-top: 14.2752562225vw;
  }
}
.chara-orisp #ori_1 .chara-orisp__block--item.i2 .chara-orisp__block--img {
  top: -14.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i2 .chara-orisp__block--img {
    top: -4.9048316252vw;
    left: calc(50% - 37.4084919473vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_1 .chara-orisp__block--item.i2 .chara-orisp__name--txt {
    padding-right: 6.3689604685vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i1 {
    background-image: url(../data/webp/chara/original/original_2/bg_chara_orig_rb.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i1 .chara-orisp__block--dtl {
    padding-top: 12.5915080527vw;
  }
}
.chara-orisp #ori_2 .chara-orisp__block--item.i1 .chara-orisp__block--img {
  top: -15.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i1 .chara-orisp__block--img {
    top: -7.027818448vw;
    left: calc(50% - 3.953147877vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i2 {
    background-image: url(../data/webp/chara/original/original_2/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i2 .chara-orisp__block--dtl {
    padding-top: 15.0073206442vw;
  }
}
.chara-orisp #ori_2 .chara-orisp__block--item.i2 .chara-orisp__block--img {
  top: -14.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i2 .chara-orisp__block--img {
    top: -4.5387994143vw;
    left: calc(50% - 36.0175695461vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_2 .chara-orisp__block--item.i2 .chara-orisp__name--txt {
    padding-right: 5.8565153734vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item:not(:first-of-type) {
    margin-top: 1.6105417277vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i1 {
  background-image: url(../data/webp/chara/original/frame_3-1.webp);
  height: 154.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i1 {
    background-image: url(../data/webp/chara/original/original_3/bg_chara_orig_rb.webp);
    height: 36.0175695461vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i1 .chara-orisp__block--dtl {
    padding-top: 11.1639824305vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i1 .chara-orisp__block--img {
  top: -35.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i1 .chara-orisp__block--img {
    top: -3.953147877vw;
    left: calc(50% - 5.710102489vw);
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i1 .chara-orisp__txt {
  margin-top: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i1 .chara-orisp__txt {
    margin-top: 1.4641288433vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i2 {
  background-image: url(../data/webp/chara/original/frame_3-2.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i2 {
    height: 140vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i2 {
    background-image: url(../data/webp/chara/original/original_3/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i2 .chara-orisp__block--dtl {
    padding-top: 14.8609077599vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i2 .chara-orisp__block--img {
  top: -11.2vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i2 .chara-orisp__block--img {
    top: -4.2459736457vw;
    left: calc(50% - 35.065885798vw);
    width: 39.1654465593vw;
    height: 39.1654465593vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i2 .chara-orisp__name--txt {
    padding-right: 7.5036603221vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i3 {
  background-image: url(../data/webp/chara/original/frame_3-3.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i3 {
    height: 132vw;
  }
  .chara-orisp #ori_3 .chara-orisp__block--item.i3:before {
    background-image: url(../data/webp/chara/original/original_4/bg_pattern.webp);
    height: 77.6vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i3 {
    background-image: url(../data/webp/chara/original/original_4/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i3 .chara-orisp__block--dtl {
    padding-top: 14.8609077599vw;
    margin-left: auto;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i3 .chara-orisp__block--img {
  top: -10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i3 .chara-orisp__block--img {
    top: -5.270863836vw;
    left: calc(50% - 35.944363104vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i3 .chara-orisp__name--txt {
    padding-right: 7.5036603221vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i4 {
  background-image: url(../data/webp/chara/original/frame_3-4.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i4 {
    height: 126.6666666667vw;
  }
  .chara-orisp #ori_3 .chara-orisp__block--item.i4:before {
    background-image: url(../data/webp/chara/original/original_5/bg_pattern.webp);
    height: 72.2666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i4 {
    background-image: url(../data/webp/chara/original/original_5/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i4 .chara-orisp__block--dtl {
    padding-top: 16.3250366032vw;
    margin-left: auto;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i4 .chara-orisp__block--img {
  top: -11.2vw;
  top: -10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i4 .chara-orisp__block--img {
    top: -4.9048316252vw;
    left: calc(50% - 35.944363104vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i4 .chara-orisp__name--txt {
    padding-right: 7.5036603221vw;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i5 {
  background-image: url(../data/webp/chara/original/frame_3-5.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i5 {
    height: 128vw;
  }
  .chara-orisp #ori_3 .chara-orisp__block--item.i5:before {
    background-image: url(../data/webp/chara/original/original_6/bg_pattern.webp);
    height: 73.6vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i5 {
    background-image: url(../data/webp/chara/original/original_6/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i5 .chara-orisp__block--dtl {
    padding-top: 15.9590043924vw;
    margin-left: auto;
  }
}
.chara-orisp #ori_3 .chara-orisp__block--item.i5 .chara-orisp__block--img {
  top: -11.2vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i5 .chara-orisp__block--img {
    top: -5.0512445095vw;
    left: calc(50% - 35.944363104vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_3 .chara-orisp__block--item.i5 .chara-orisp__name--txt {
    padding-right: 7.5036603221vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item:not(:first-of-type) {
    margin-top: 1.6105417277vw;
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i1 {
  background-image: url(../data/webp/chara/original/frame_3-6.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i1 {
    height: 130.6666666667vw;
  }
  .chara-orisp #ori_4 .chara-orisp__block--item.i1:before {
    background-image: url(../data/webp/chara/original/original_7/bg_pattern_1.webp);
    height: 39.8666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i1 {
    background-image: url(../data/webp/chara/original/original_7/bg_chara_orig_rb.webp);
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__block--dtl {
  padding-top: 99.2vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__block--dtl {
    padding-top: 12.3718887262vw;
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__block--img {
  top: -1.0666666667vw;
  left: 52.2%;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__block--img {
    top: -6.9546120059vw;
    left: calc(50% - 4.0263543192vw);
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__txt {
  margin-top: 2.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i1 .chara-orisp__txt {
    margin-top: 1.4641288433vw;
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i2 {
  background-image: url(../data/webp/chara/original/frame_3-7.webp);
}
@media only screen and (max-width: 750px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 {
    height: 117.3333333333vw;
  }
  .chara-orisp #ori_4 .chara-orisp__block--item.i2:before {
    background-image: url(../data/webp/chara/original/original_7/bg_pattern_2.webp);
    height: 63.0666666667vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 {
    background-image: url(../data/webp/chara/original/original_7/bg_chara_orig_pilot.webp);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__block--dtl {
    padding-top: 14.8609077599vw;
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__block--img {
  top: -14.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__block--img {
    top: -4.4655929722vw;
    left: calc(50% - 36.0907759883vw);
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__name--txt span {
    padding-right: 6.2225475842vw;
  }
}
.chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__txt span {
  margin-top: 0.8vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #ori_4 .chara-orisp__block--item.i2 .chara-orisp__txt span {
    margin-top: 3.2942898975vw;
  }
}
.chara-orisp #sp_1 {
  margin-top: -7.8666666667vw;
  padding-top: 7.8666666667vw;
  padding-bottom: 14.6666666667vw;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #sp_1 {
    margin-top: -2.1229868228vw;
    padding-top: 2.1229868228vw;
    padding-bottom: 3.8799414348vw;
  }
}
.chara-orisp #sp_1 .common-parts__btm {
  bottom: 6.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #sp_1 .common-parts__btm {
    bottom: 1.8301610542vw;
  }
}
.chara-orisp #sp_2 {
  margin-top: -14.6666666667vw;
  padding-top: 14.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #sp_2 {
    margin-top: -2.1229868228vw;
    padding-top: 2.1229868228vw;
  }
}
.chara-orisp #sp_2 .chara-orisp__sp--wrap {
  padding-top: 9.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .chara-orisp #sp_2 .chara-orisp__sp--wrap {
    padding-top: 2.1595900439vw;
    margin-top: -2.1595900439vw;
    padding-bottom: 0.7320644217vw;
  }
}
@media only screen and (min-width: 751px) {
  .chara-orisp #sp_2 .chara-orisp__sp--wrap:before {
    top: 1.5373352855vw;
  }
}

.system .header-nav__list--item[data-current=system]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .system .header-nav__list--item[data-current=system]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
@media only screen and (min-width: 751px) {
  .system .common-under {
    margin-bottom: 2.4890190337vw;
  }
}
@media only screen and (max-width: 750px) {
  .system .common-title {
    margin-bottom: 12.2666666667vw;
  }
}
.system-navi {
  margin-top: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5333333333vw;
}
@media only screen and (min-width: 751px) {
  .system-navi {
    margin-top: 1.4641288433vw;
    gap: 0.2562225476vw;
    flex-direction: row;
    justify-content: center;
  }
}
.system-navi__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8666666667vw;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .system-navi__nav {
    gap: 1.0248901903vw;
  }
}
.system-navi__nav--item {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.1538461538;
  display: block;
  min-width: 29.6vw;
  width: fit-content;
  text-align: center;
  position: relative;
  z-index: 2;
  padding-bottom: 5.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item {
    min-width: 7.9795021962vw;
    font-size: 0.9516837482vw;
    line-height: 1.2307692308;
    padding-bottom: 1.1713030747vw;
  }
  .system-navi__nav--item:hover .system-navi__nav--item-parts:before {
    left: -0.6222547584vw;
  }
  .system-navi__nav--item:hover .system-navi__nav--item-parts:after {
    right: -0.6222547584vw;
  }
  .system-navi__nav--item:hover .system-navi__nav--item-parts .on {
    transform: translate3d(-50%, 0, 0);
    opacity: 1;
  }
}
.system-navi__nav--item-parts {
  width: 29.6vw;
  height: 2vw;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item-parts {
    width: 7.9795021962vw;
    height: 0.5490483163vw;
  }
  .system-navi__nav--item-parts .on {
    display: block;
    background-image: url(../data/webp/chara/parts_nav_on.webp);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 1.8301610542vw;
    height: 0.878477306vw;
    position: absolute;
    top: -0.2928257687vw;
    left: 50%;
    transform: translate3d(-50%, -20%, 0);
    opacity: 0;
    transition: 400ms;
  }
}
.system-navi__nav--item-parts:before, .system-navi__nav--item-parts:after {
  content: "";
  display: block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item-parts:before, .system-navi__nav--item-parts:after {
    width: 4.0629575403vw;
    transition: 400ms;
  }
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item-parts:before {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    left: 0;
    transform: rotateY(180deg);
  }
}
.system-navi__nav--item-parts:after {
  background-image: url(../data/webp/chara/parts_nav.webp);
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item-parts:after {
    background-image: url(../data/webp/chara/parts_nav_right.webp);
    right: 0;
  }
}
.system-navi__nav--item.pb {
  padding-top: 2.4vw;
  padding-bottom: 7.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-navi__nav--item.pb {
    padding-top: 0.6954612006vw;
    padding-bottom: 1.6837481698vw;
  }
}
.system-navi__nav:has(.system-navi__nav--item:nth-of-type(n+4)) {
  flex-wrap: wrap;
  gap: 4vw 1.8666666667vw;
}
.system-block {
  margin-top: 10.2666666667vw;
  padding-bottom: 10.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-block {
    margin-top: 1.5007320644vw;
    padding-bottom: 2.7452415813vw;
  }
}
.system-block__item {
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(10px);
  clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 96vw 100%, 93.3333333333vw calc(100% - 2.6666666667vw), 6.6666666667vw calc(100% - 2.6666666667vw), 4vw 100%, 0 100%);
  margin: 0 auto;
  width: 100%;
  padding: 11.7333333333vw 4vw 12.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item {
    clip-path: polygon(0% 0%, 0 0, 0% 0%, 100% 0%, 100% 0, 100% 0%, 100% 100%, 43.9970717423vw 100%, 43.411420205vw calc(100% - 0.7320644217vw), 17.4231332357vw calc(100% - 0.7320644217vw), 16.8374816984vw 100%, 0 100%);
    width: 60.8345534407vw;
    padding: 3.0014641288vw 2.1229868228vw 4.0263543192vw;
  }
}
.system-block__item:not(:first-of-type) {
  margin-top: 15.6vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item:not(:first-of-type) {
    margin-top: 2.5622254758vw;
  }
}
.system-block__item--h2 {
  text-align: center;
  margin-bottom: 7.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--h2 {
    margin-bottom: 1.5373352855vw;
  }
}
.system-block__item--h2 span {
  display: inline-block;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 6.9333333333vw;
  padding: 0 3.0666666667vw;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 751px) {
  .system-block__item--h2 span {
    font-size: 1.9033674963vw;
    padding: 0 1.2445095168vw;
  }
}
.system-block__item--h2 span:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  background-size: 100% auto;
  width: 100%;
  height: 2.6666666667vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .system-block__item--h2 span:before {
    height: 0.439238653vw;
  }
}
.system-block__item--lead {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.7916666667;
  margin-bottom: 6vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--lead {
    font-size: 1.0248901903vw;
    line-height: 1.7142857143;
    margin-bottom: 1.9399707174vw;
    text-align: center;
  }
}
.system-block__item--no {
  background: #fff;
  color: #fff;
  margin: 0 auto 3.2vw;
  width: 22.9333333333vw;
  height: 5.4666666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.2vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--no {
    width: 6.3689604685vw;
    height: 1.4641288433vw;
    font-size: 0.878477306vw;
    margin: 0 auto 1.0980966325vw;
  }
}
.system-block__item--no span {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  background-size: 100% auto;
  background-position: center;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.system-block__item--dtl-block {
  background-color: rgba(0, 0, 0, 0.5);
  padding: 3.3333333333vw 3.3333333333vw 8vw;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.5833333333;
  gap: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-block {
    flex-direction: row;
    font-size: 0.878477306vw;
    padding: 1.0980966325vw;
    gap: 1.2079062958vw;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-block dt {
    width: 23.4260614934vw;
  }
}
.system-block__item--dtl-block dd {
  color: #fff;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-block dd {
    width: calc(100% - 24.6339677892vw);
  }
}
.system-block__item--dtl-block:not(:first-of-type) {
  margin-top: 5.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-block:not(:first-of-type) {
    margin-top: 1.1713030747vw;
  }
}
@media only screen and (max-width: 750px) {
  .system-block__item--dtl-block.reverse {
    flex-direction: column-reverse;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-block.reverse .flex-img {
    width: 26.317715959vw;
  }
  .system-block__item--dtl-block.reverse dd {
    width: calc(100% - 27.5256222548vw);
  }
}
.system-block__item--dtl-flex {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex {
    flex-direction: row;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex .img-l {
    width: 31.3689604685vw;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex:has(.img-l) {
    align-items: center;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex:has(.img-l) dd {
    margin-left: 0.9150805271vw;
    width: calc(100% - 32.2840409956vw);
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex .flex-img {
    width: 26.317715959vw;
  }
}
.system-block__item--dtl-flex .flex-img:not(:first-of-type) {
  margin-top: 4.1333333333vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-flex .flex-img:not(:first-of-type) {
    margin-top: 0;
    margin-left: 1.6471449488vw;
  }
}
.system-block__item--dtl-cont {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 4vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-cont {
    flex-direction: row;
    gap: 1.3909224012vw;
    margin-top: 2.635431918vw;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-cont dt {
    width: 23.4260614934vw;
  }
}
.system-block__item--dtl-cont dd {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.7916666667;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-cont dd {
    width: calc(100% - 24.8169838946vw);
    font-size: 1.0248901903vw;
    line-height: 1.7142857143;
    margin-top: -0.439238653vw;
  }
}
.system-block__item--dtl-cont:first-child {
  padding-bottom: 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-cont:first-child {
    padding-bottom: 1.3543191801vw;
  }
}
@media only screen and (max-width: 750px) {
  .system-block__item--dtl-cont.reverse {
    flex-direction: column-reverse;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-cont.reverse {
    align-items: center;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item--dtl-txt {
    text-align: center;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 751px) {
  .system-block__item#block_2 .reverse {
    padding-right: 1.8301610542vw;
  }
}
.system-block__item#block_3 .system-block__item--lead {
  text-align: left;
}
@media only screen and (min-width: 751px) {
  .system-block__item#block_3 .system-block__item--dtl-cont {
    align-items: center;
    gap: 2.3426061493vw;
  }
  .system-block__item#block_3 .system-block__item--dtl-cont dt {
    width: 36.6032210835vw;
  }
  .system-block__item#block_3 .system-block__item--dtl-cont dd {
    width: calc(100% - 38.9458272328vw);
    font-size: 0.878477306vw;
    line-height: 1.5833333333;
  }
}

.special .header-nav__list--item[data-current=special]:before {
  background-image: url(../data/webp/common/parts_current.webp);
}
@media only screen and (min-width: 751px) {
  .special .header-nav__list--item[data-current=special]:before {
    background-image: url(../data/webp/common/parts_current_pc.webp);
  }
}
@media only screen and (min-width: 751px) {
  .special .common-title {
    margin-bottom: 2.9282576867vw;
  }
}
@media only screen and (min-width: 751px) {
  .special .common-under {
    margin-bottom: 2.9282576867vw;
  }
}
.special-wrap {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  padding-bottom: 13.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .special-wrap {
    max-width: 51.2445095168vw;
    padding-bottom: 2.5622254758vw;
  }
}
@media only screen and (min-width: 751px) {
  .special-wrap[data-special=bgm] {
    padding-bottom: 3.1844802343vw;
  }
}
.special-wrap[data-special=bgm] .special-nav__list--item[data-current=bgm] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .special-wrap[data-special=projectyy] {
    padding-bottom: 3.1844802343vw;
  }
}
.special-wrap[data-special=projectyy] .special-nav__list--item[data-current=projectyy] {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
}
@media only screen and (min-width: 751px) {
  .special-wrap[data-special=projectyy] .special-block {
    clip-path: polygon(0 0, 10.3953147877vw 0, 11.383601757vw 1.8301610542vw, 40.0439238653vw 1.8301610542vw, 40.8491947291vw 0, 100% 0, 100% 0%, 100% 100%, 0% 100%, 0% 100%, 0 100%, 0% 0%);
  }
}
.special-wrap[data-special=projectyy] .special-block__wrap {
  padding-top: 0;
}
@media only screen and (min-width: 751px) {
  .special-wrap[data-special=projectyy] .special-block__wrap {
    padding-top: 1.317715959vw;
  }
}
@media only screen and (min-width: 751px) {
  .special-wrap[data-special=projectyy] .special-block__dtl p {
    font-size: 0.878477306vw;
    line-height: 1.75;
  }
}
.special-h2 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.6vw;
  text-shadow: 0 0 2.6666666667vw #000;
  height: 23.6vw;
  position: relative;
  z-index: 2;
  padding-top: 5.0666666667vw;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .special-h2 {
    font-size: 1.4641288433vw;
    text-shadow: 0 0 0.7320644217vw rgba(0, 0, 0, 0.5);
    height: 6.2225475842vw;
    padding-top: 0.6588579795vw;
  }
}
.special-h2:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/common/bg_title.webp) no-repeat;
  background-size: contain;
  background-position: center center;
  width: 100vw;
  height: 23.6vw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .special-h2:before {
    background-image: url(../data/webp/common/bg_title_2_pc.webp);
    width: 51.3909224012vw;
    height: 4.5387994143vw;
  }
}
.special-h2 span {
  display: block;
  font-size: 3.4666666667vw;
  line-height: 2;
}
@media only screen and (min-width: 751px) {
  .special-h2 span {
    font-size: 0.9516837482vw;
    line-height: 1.8461538462;
  }
}
.special-h2__img {
  margin: 0 auto;
  width: 55.0666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-h2__img {
    width: 13.4333821376vw;
  }
}
.special-block {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  backdrop-filter: blur(10px);
}
@media only screen and (min-width: 751px) {
  .special-block {
    clip-path: polygon(0 0, 10.3953147877vw 0, 11.383601757vw 0.6222547584vw, 40.0439238653vw 0.6222547584vw, 40.8491947291vw 0, 100% 0, 100% 0%, 100% 100%, 0% 100%, 0% 100%, 0 100%, 0% 0%);
    margin-top: -2.7818448023vw;
  }
}
.special-block__nav {
  display: flex;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 3.8666666667vw;
  margin-top: 6.6666666667vw;
  margin-bottom: 7.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .special-block__nav {
    gap: 0.8052708638vw;
    margin-top: 1.6105417277vw;
    margin-bottom: 4.0995607613vw;
  }
}
.special-block__nav--item {
  width: 44vw;
  height: 27.7333333333vw;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--item {
    width: 10.980966325vw;
    height: 6.588579795vw;
  }
}
.special-block__nav--link {
  background: transparent url(../data/webp/special/bg_nav.webp) no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
  padding: 1.4666666667vw;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link {
    background-image: url(../data/webp/special/bg_nav_pc.webp);
    padding: 0.3660322108vw;
  }
}
.special-block__nav--link:after {
  display: block;
  content: "";
  pointer-events: none;
  background-color: #fff;
  width: 100%;
  height: 1.1733333333vw;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link:after {
    height: 0.2928257687vw;
  }
}
.special-block__nav--link:before {
  display: block;
  content: "";
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  pointer-events: none;
  background-color: #fff;
  width: 3.5586666667vw;
  height: 2.496vw;
  position: absolute;
  bottom: 2.7733333333vw;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link:before {
    width: 0.8876281113vw;
    height: 0.6222547584vw;
    bottom: 0.6954612006vw;
  }
}
.special-block__nav--link .tag {
  background-color: #000;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.228vw;
  line-height: 1.9091284593;
  text-align: center;
  width: 100%;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link .tag {
    font-size: 0.8052708638vw;
    line-height: 1.9090909091;
  }
}
.special-block__nav--link .ttl {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.8146666667vw;
  line-height: 1.3848304789;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 9.3333333333vw;
  margin-top: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link .ttl {
    font-size: 0.9516837482vw;
    line-height: 1.3846153846;
    height: 2.196193265vw;
    margin-top: 0.6588579795vw;
  }
}
.special-block__nav--link[tabindex="-1"] {
  opacity: 50%;
  cursor: auto;
}
@media only screen and (min-width: 751px) {
  .special-block__nav--link:not([tabindex="-1"]) {
    transition: 400ms;
  }
  .special-block__nav--link:not([tabindex="-1"]):hover {
    opacity: 0.8;
  }
}
.special-block__wrap {
  padding: 10.6666666667vw 0 12vw;
}
@media only screen and (min-width: 751px) {
  .special-block__wrap {
    padding: 2.7818448023vw 2.4158125915vw 4.5021961933vw;
  }
}
.special-block__dtl {
  padding: 7.0666666667vw 4vw 0;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl {
    padding: 1.9399707174vw 0 0;
  }
}
.special-block__dtl h2 {
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  margin: 0 auto;
  padding: 5.8666666667vw 0;
  width: 100%;
  height: 31.4666666667vw;
  text-align: center;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h2 {
    padding: 1.2079062958vw 0;
    width: 42.4963396779vw;
    height: 6.0761346999vw;
  }
}
.special-block__dtl h2:before {
  display: block;
  content: "";
  background: #000;
  width: 100%;
  height: calc(100% - 2.6666666667vw);
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h2:before {
    height: calc(100% - 0.7320644217vw);
  }
}
.special-block__dtl h2 .txt-wrap {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.8vw;
  line-height: 1.3888888889;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h2 .txt-wrap {
    font-size: 1.317715959vw;
    line-height: 1.3888888889;
  }
}
.special-block__dtl h2 .txt-gray {
  display: block;
  color: #ccc;
  font-size: 3.7333333333vw;
  line-height: 1.5714285714;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h2 .txt-gray {
    font-size: 1.1713030747vw;
    line-height: 1.5625;
  }
}
.special-block__dtl h3 {
  margin: 0 auto;
  width: fit-content;
  position: relative;
  z-index: 2;
}
.special-block__dtl h3:before {
  display: block;
  content: "";
  background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
  width: 100%;
  height: 2.6666666667vw;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: -1;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h3:before {
    height: 0.7320644217vw;
  }
}
.special-block__dtl h3 span {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 5.6vw;
  text-align: center;
  padding: 0 6vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h3 span {
    font-size: 1.4641288433vw;
    padding: 0 1.3909224012vw;
  }
}
.special-block__dtl h4 {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3.7333333333vw;
  text-align: center;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h4 {
    font-size: 1.0248901903vw;
  }
}
.special-block__dtl h4 span {
  display: inline-block;
  background-color: #000;
  padding: 1.8666666667vw 3.4666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl h4 span {
    padding: 0.5124450952vw 0.9516837482vw;
  }
}
.special-block__dtl p {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.2vw;
  line-height: 1.7916666667;
  margin-top: 4.8vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl p {
    font-size: 1.0248901903vw;
    line-height: 1.7142857143;
    margin-top: 1.317715959vw;
    text-align: center;
  }
}
.special-block__dtl p:first-child {
  margin-top: 0;
}
.special-block__dtl .txt-left {
  text-align: left;
}
.special-block__dtl .txt-center {
  text-align: center;
}
.special-block__dtl .txt-yellow {
  color: #ffcc00;
}
.special-block__dtl--item {
  margin-top: -16vw;
  padding-top: 16vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--item {
    margin-top: -5.1244509517vw;
    padding-top: 5.1244509517vw;
  }
}
.special-block__dtl--vdo {
  margin: 6.2666666667vw auto 0;
  width: 100%;
  height: 92vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--vdo {
    width: 27.6720351391vw;
    height: 27.6720351391vw;
    margin-top: 2.0863836018vw;
  }
}
.special-block__dtl--vdo video {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.special-block__dtl--box {
  background-color: rgba(255, 255, 255, 0.1);
  padding: 6vw 3.4666666667vw 10.6666666667vw;
  margin: 5.3333333333vw auto 0;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--box {
    padding: 1.6471449488vw 2.9282576867vw 2.4890190337vw;
    margin-top: 2.3060029283vw;
    width: 42.4963396779vw;
  }
}
.special-block__dtl--box h3 {
  margin-bottom: 6.9333333333vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--box h3 {
    margin-bottom: 1.8301610542vw;
  }
}
.special-block__dtl--box p {
  font-size: 3.7333333333vw !important;
  line-height: 1.5357142857;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--box p {
    font-size: 1.0248901903vw !important;
    margin-top: 1.0980966325vw !important;
  }
}
.special-block__dtl--ol li {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  font-size: 3.7333333333vw;
  line-height: 1.1785714286;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--ol li {
    font-size: 1.0248901903vw;
    line-height: 1.5357142857;
  }
}
.special-block__dtl--ol li:not(:first-of-type) {
  margin-top: 5.6vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--ol li:not(:first-of-type) {
    margin-top: 1.2445095168vw;
  }
}
.special-block__dtl--ol li span {
  display: inline-block;
  width: calc(100% - 4.2666666667vw);
  margin-left: 0.5333333333vw;
  line-height: 1.1785714286;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--ol li span {
    width: calc(100% - 1.1713030747vw);
    margin-left: 0.1464128843vw;
    line-height: 1.5357142857;
  }
}
.special-block__dtl--ol li a {
  color: #0084ff;
  text-decoration: underline;
  font-size: 3.4666666667vw;
  line-height: 1.2692307692;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--ol li a {
    font-size: 1.0248901903vw;
    line-height: 1.5357142857;
  }
}
.special-block__dtl--btn {
  background: linear-gradient(90deg, #fff 0%, #fff 100%);
  position: relative;
  width: 84.9333333333vw;
  height: 16vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4.2666666667vw;
  padding: 0 0 2.9333333333vw;
  margin: 6.6666666667vw auto 0;
  position: relative;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--btn {
    width: 19.9487554905vw;
    height: 3.6603221083vw;
    font-size: 1.1713030747vw;
    padding: 0.878477306vw 0 0.8052708638vw;
    margin-top: 1.4641288433vw;
    transition: 400ms;
  }
  .special-block__dtl--btn:after {
    display: block;
    content: "";
    background: linear-gradient(90deg, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: 400ms;
    z-index: 1;
  }
  .special-block__dtl--btn:hover .is-off {
    opacity: 0;
  }
  .special-block__dtl--btn:hover .is-on {
    opacity: 1;
  }
  .special-block__dtl--btn:hover:after {
    opacity: 1;
  }
}
.special-block__dtl--btn:before {
  display: block;
  content: "";
  background: transparent url(../data/webp/top/product/bg_btn.webp) no-repeat;
  background-size: 100% auto;
  background-position: bottom;
  width: 100%;
  height: 16vw;
  position: absolute;
  bottom: -1.3333333333vw;
  left: 0;
  z-index: -1;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--btn:before {
    height: 4.39238653vw;
    bottom: -0.3660322108vw;
  }
}
.special-block__dtl--btn span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.special-block__dtl--btn span:after {
  display: block;
  content: "";
  display: inline-block;
  background-image: url(../data/webp/common/icon_blank.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4vw;
  height: 4vw;
  margin-left: 2.4vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--btn span:after {
    width: 1.0980966325vw;
    height: 1.0980966325vw;
    margin-left: 0.7320644217vw;
  }
}
.special-block__dtl--btn span.is-off {
  background: linear-gradient(90deg, #6c00ff 0%, #ff008f 70%);
  background-size: 100% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
}
.special-block__dtl--btn span.is-off:after {
  background-image: url(../data/webp/common/icon_blank.webp);
}
.special-block__dtl--btn span.is-on {
  color: #fff;
  opacity: 0;
}
.special-block__dtl--btn span.is-on:after {
  background-image: url(../data/webp/common/icon_blank_wh.webp);
}
.special-block__dtl--figure {
  margin-top: 5.3333333333vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--figure {
    margin-top: 2.1229868228vw;
  }
}
.special-block__dtl--figure .img {
  margin: 5.0666666667vw auto 0;
  width: 72.4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--figure .img {
    flex-direction: row;
    margin-top: 1.3909224012vw;
    width: 100%;
  }
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--figure .img-item {
    width: 19.8755490483vw;
  }
}
.special-block__dtl--terms {
  border: solid 0.2666666667vw #fff;
  width: 100%;
  height: 73.8666666667vw;
  overflow-y: auto;
  padding: 6.1333333333vw 6.4vw;
  margin: 8.5333333333vw auto 0;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms {
    border: solid 0.0732064422vw #fff;
    width: 42.4963396779vw;
    height: 20.2781844802vw;
    padding: 1.8301610542vw 2.1229868228vw;
    margin-top: 2.6720351391vw;
  }
}
.special-block__dtl--terms::-webkit-scrollbar {
  width: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms::-webkit-scrollbar {
    width: 0.7320644217vw;
  }
}
.special-block__dtl--terms::-webkit-scrollbar-track {
  background: transparent;
}
.special-block__dtl--terms::-webkit-scrollbar-thumb {
  background: #fff;
  background-clip: padding-box;
  border-radius: none;
  border: 0.6666666667vw solid transparent;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms::-webkit-scrollbar-thumb {
    border: 0.1830161054vw solid transparent;
  }
}
.special-block__dtl--terms h4 {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 4.2666666667vw;
  line-height: 1.34375;
  text-align: center;
  margin-bottom: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms h4 {
    font-size: 1.1713030747vw;
    margin-bottom: 0.7320644217vw;
  }
}
.special-block__dtl--terms dl:not(:first-of-type) {
  margin-top: 4vw;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms dl:not(:first-of-type) {
    margin-top: 1.0980966325vw;
  }
}
.special-block__dtl--terms dl dt,
.special-block__dtl--terms dl dd {
  font-size: 2.6666666667vw;
  line-height: 1.5;
}
@media only screen and (min-width: 751px) {
  .special-block__dtl--terms dl dt,
  .special-block__dtl--terms dl dd {
    font-size: 0.878477306vw;
    line-height: 1.4583333333;
  }
}
.special-block__dtl--terms dl dt {
  color: #fff;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.special-block__dtl--terms dl dd {
  color: #ccc;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.special-block__dtl--terms dl dd a {
  color: #ccc;
  display: inline-block;
  word-break: break-all;
}

.special-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 3.0666666667vw 1.6vw;
  margin-bottom: 6.2666666667vw;
}
@media only screen and (min-width: 751px) {
  .special-nav {
    gap: 1.0980966325vw;
    margin-bottom: 3.2942898975vw;
  }
}
.special-nav__list {
  width: 29.4666666667vw;
  height: 10vw;
}
@media only screen and (min-width: 751px) {
  .special-nav__list {
    width: 9.0409956076vw;
    height: 1.9765739385vw;
  }
}
@media only screen and (max-width: 750px) {
  .special-nav__list:first-of-type {
    margin-left: 8vw;
  }
  .special-nav__list:nth-of-type(2) {
    margin-right: 8vw;
  }
}
.special-nav__list--item {
  background: linear-gradient(to left, #222 0%, #222 100%);
  background-size: 120% auto;
  background-position: center;
  clip-path: polygon(0% 0%, 100% 0, 100% 7.8666666667vw, 27.3333333333vw 100%, 0% 100%);
  color: #fff;
  display: block;
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3.4666666667vw;
  line-height: 1.2307692308;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 751px) {
  .special-nav__list--item:after {
    transition: 400ms;
  }
  .special-nav__list--item:hover:after {
    opacity: 1;
  }
}
@media only screen and (min-width: 751px) {
  .special-nav__list--item {
    clip-path: polygon(0% 0%, 100% 0, 100% 1.3909224012vw, 8.4553440703vw 100%, 0% 100%);
    font-size: 0.878477306vw;
  }
  .special-nav__list--item:after {
    display: block;
    content: "";
    background: linear-gradient(to right, #6c00ff 0%, #ff008f 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
  }
}
.special-nav__list--item span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 750px) {
  .special-nav__list--item.txt-ls span {
    letter-spacing: -0.001em;
  }
}

@keyframes common-white-anime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fall {
  0% {
    top: -10%;
    opacity: 1;
  }
  100% {
    top: 100%;
  }
}
.common-main {
  overflow-x: hidden;
}
.common-main .js--white {
  position: relative;
  opacity: 0;
}
.common-main .js--white::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #fff;
  z-index: 5;
  pointer-events: none;
}
@media only screen and (min-width: 751px) {
  .common-main .bg-under .bg-line span:nth-of-type(2) {
    left: 50%;
    opacity: 0;
  }
  .common-main .bg-under .bg-line span:last-of-type {
    left: 50%;
    opacity: 0;
  }
}
@media only screen and (min-width: 751px) {
  .common-main .common-under .common-parts {
    opacity: 0;
  }
}
.common-main .common-under .common-title__h1 span {
  position: relative;
  opacity: 0;
  top: 2.6666666667vw;
}
@media only screen and (min-width: 751px) {
  .common-main .common-under .common-title__h1 span {
    top: 0.9150805271vw;
  }
}
.common-main .common-under .common-title__h1::after {
  transform: translate3d(-50%, 0, 0) scale(0, 1);
  transform-origin: 50% 50%;
}
.common-main .common-under .chara-detail__body::before {
  opacity: 0;
}
.common-main .common-under .chara-detail__wrap {
  opacity: 1 !important;
}
.common-main .common-under .chara-pager__wrap,
.common-main .common-under .chara-detail__block {
  opacity: 0;
}
.common-main .common-under .under-wrap .common-h2__wrap {
  opacity: 0;
}
.common-main .common-under .under-wrap:not(.product-wrap) {
  opacity: 0;
}
.common-main .common-under .product-wrap {
  overflow: hidden;
}
.common-main .common-under .product-wrap .product-h2 {
  opacity: 0;
  transform: translate3d(0, 50%, 0);
}
.common-main .common-under .product-wrap .product-block {
  opacity: 0;
  transform: scale(1, 0.85);
}
.common-main .common-under .product-wrap .js--group {
  opacity: 0;
}
.common-main.js--anime .chara-pager__wrap {
  opacity: 1;
  transition: all 500ms;
}
.common-main.js--anime .chara-detail__body::before {
  opacity: 1;
  transition: all 500ms;
}
.common-main.js--anime .chara-detail__block {
  opacity: 1;
  transition: all 500ms;
}
@media only screen and (min-width: 751px) {
  .common-main.js--anime .bg-under .bg-line span:nth-of-type(2) {
    left: 0%;
    opacity: 1;
    transition: all 200ms;
  }
  .common-main.js--anime .bg-under .bg-line span:last-of-type {
    left: 100%;
    opacity: 1;
    transition: all 200ms;
  }
}
@media only screen and (min-width: 751px) {
  .common-main.js--anime .common-under .common-parts {
    opacity: 1;
    transition: all 200ms;
  }
}
.common-main.js--anime .common-under .common-title__h1 span {
  opacity: 1;
  top: 0vw;
  transition: all 300ms;
}
@media only screen and (min-width: 751px) {
  .common-main.js--anime .common-under .common-title__h1 span {
    top: 0vw;
  }
}
.common-main.js--anime .common-under .common-title__h1::after {
  transform: translate3d(-50%, 0, 0) scale(1, 1);
  transition: all 300ms;
}
.common-main.js--anime .common-under .product-wrap .product-h2 {
  opacity: 1;
  transform: translate3d(0, 0%, 0);
  transition: all 200ms;
  transition-delay: 200ms;
}
.common-main.js--anime .common-under .product-wrap .product-block {
  opacity: 1;
  transform: scale(1, 1);
  transition: all 150ms;
  transition-delay: 200ms;
}
.common-main.js--anime .common-under .product-wrap .common-h2__wrap {
  opacity: 1;
  transition: all 300ms;
  transition-delay: 280ms;
}
.common-main.js--anime .common-under .product-wrap .js--group {
  opacity: 1;
  transition: all 400ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(1) {
  transition-delay: 350ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(2) {
  transition-delay: 400ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(3) {
  transition-delay: 450ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(4) {
  transition-delay: 500ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(5) {
  transition-delay: 550ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(6) {
  transition-delay: 600ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(7) {
  transition-delay: 650ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(8) {
  transition-delay: 700ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(9) {
  transition-delay: 750ms;
}
.common-main.js--anime .common-under .product-wrap .js--group:nth-child(10) {
  transition-delay: 800ms;
}
.common-main.js--anime .common-under .under-wrap:not(.product-wrap) {
  opacity: 1;
  transition: all 500ms;
}

.common-under .js--scroll.js--anime .js--white {
  opacity: 1;
}
.common-under .js--scroll.js--anime .js--white::after {
  opacity: 1;
  animation: common-white-anime 500ms forwards;
}

.top .js--glitch img {
  opacity: 0;
}
.top .js--glitch canvas {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate3d(-50%, 0, 0);
}
.top-bg__light.js--none-anime {
  opacity: 1 !important;
  transition: none !important;
}
.top-fv.js--none-anime {
  opacity: 1 !important;
  transition: none !important;
}
.top-fv.js--none-anime .top-fv__chara--norm {
  opacity: 1 !important;
  transition: none !important;
  transform: scale(1) !important;
}
.top-fv.js--none-anime .top-fv__chara--mask {
  opacity: 0 !important;
  transition: none !important;
}
@media only screen and (max-width: 750px) {
  .top .header-hamburger {
    opacity: 0;
  }
  .top .header-hamburger.js--anime {
    opacity: 1;
    transition: opacity 0.6s;
  }
}
.top .top-teaser .top-teaser__h2 {
  opacity: 0;
}
.top .top-teaser .top-teaser__block {
  opacity: 0;
}
.top .top-teaser .top-teaser__thumb {
  overflow: hidden;
}
.top .top-teaser .top-teaser__thumb--btn {
  opacity: 0;
}
.top .top-teaser.js--anime .top-teaser__h2 {
  opacity: 1;
  transition: opacity 300ms;
}
.top .top-teaser.js--anime .top-teaser__block {
  opacity: 1;
  transition: opacity 300ms;
  transition-delay: 100ms;
}
.top .top-teaser.js--anime .top-teaser__thumb--btn {
  opacity: 1;
}
.top .top-teaser.js--anime .top-teaser__thumb--img {
  opacity: 1;
}
.top .top-teaser.js--anime .top-teaser__thumb--img::after {
  opacity: 1;
  animation: common-white-anime 500ms forwards;
  animation-delay: 300ms;
}
.top .top-news .top-news__frame--top-parts {
  opacity: 0;
  transform: translate3d(0, 100%, 0);
}
.top .top-news .top-news__frame--btm-parts {
  opacity: 0;
  transform: translate3d(0, -100%, 0);
}
.top .top-news .top-news__list--item {
  opacity: 0;
}
.top .top-news .top-news__list--item .link-thumb {
  opacity: 0;
}
.top .top-news.js--anime .top-news__frame--top-parts {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition: all 400ms;
}
.top .top-news.js--anime .top-news__frame--btm-parts {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition: all 400ms;
}
.top .top-news.js--anime .top-news__list--item {
  opacity: 1;
  transition: all 280ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(1) {
  transition-delay: 280ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(1) .link-thumb {
  opacity: 1;
  transition: opacity 0ms;
  transition-delay: 280ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(1) .link-thumb::after {
  opacity: 1;
  animation: common-white-anime 500ms forwards;
  animation-delay: 380ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(2) {
  transition-delay: 360ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(2) .link-thumb {
  opacity: 1;
  transition: opacity 0ms;
  transition-delay: 360ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(2) .link-thumb::after {
  opacity: 1;
  animation: common-white-anime 500ms forwards;
  animation-delay: 460ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(3) {
  transition-delay: 440ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(3) .link-thumb {
  opacity: 1;
  transition: opacity 0ms;
  transition-delay: 440ms;
}
.top .top-news.js--anime .top-news__list--item:nth-child(3) .link-thumb::after {
  opacity: 1;
  animation: common-white-anime 500ms forwards;
  animation-delay: 540ms;
}
.top .top-title .top-title__wrap .top-title__h2 {
  transform: scale(1, 0);
}
.top .top-title .top-title__wrap .top-title__block {
  transform: scale(1, 0);
}
.top .top-title .top-title__wrap .top-title__list--item {
  opacity: 0;
  transform: translate3d(0, 25%, 0);
}
@media only screen and (min-width: 751px) {
  .top .top-title .top-title__wrap .top-title__list--item {
    transform: translate3d(0, 50%, 0);
  }
}
.top .top-title .top-title__wrap .top-title__more {
  opacity: 0;
}
.top .top-title.js--anime .top-title__wrap .top-title__h2 {
  transform: scale(1, 1);
  transition: all 200ms;
  transition-delay: 300ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__block {
  transform: scale(1, 1);
  transition: all 200ms;
  transition-delay: 300ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item {
  opacity: 1;
  transform: translate3d(0, 0%, 0);
  transition: all 200ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(1) {
  transition-delay: 430ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(2) {
  transition-delay: 430ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(3) {
  transition-delay: 480ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(4) {
  transition-delay: 480ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(5) {
  transition-delay: 530ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(6) {
  transition-delay: 530ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(7) {
  transition-delay: 580ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(8) {
  transition-delay: 580ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(9) {
  transition-delay: 630ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(10) {
  transition-delay: 630ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(11) {
  transition-delay: 680ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__list--item:nth-child(12) {
  transition-delay: 680ms;
}
.top .top-title.js--anime .top-title__wrap .top-title__more {
  opacity: 1;
  transition: all 500ms;
  transition-delay: 840ms;
}
.top .top-product .top-product__wrap .top-product__h2 {
  transform: scale(1, 0);
}
.top .top-product .top-product__wrap .top-product__block {
  opacity: 0;
  transform: scale(1, 0.5);
}
.top .top-product .top-product__wrap .top-product__detail--ttl span {
  opacity: 0;
}
.top .top-product .top-product__wrap .top-product__detail--ttl span::before {
  transform: translate3d(-50%) scale(0, 1);
  transform-origin: 50% 50%;
}
.top .top-product .top-product__wrap .top-product__detail--btn {
  opacity: 0;
}
.top .top-product .top-product__wrap .top-product__spec {
  opacity: 0;
}
.top .top-product.js--anime .top-product__wrap .top-product__h2 {
  transform: scale(1, 1);
  transition: all 200ms;
  transition-delay: 300ms;
}
.top .top-product.js--anime .top-product__wrap .top-product__block {
  opacity: 1;
  transform: scale(1, 1);
  transition: all 200ms;
  transition-delay: 300ms;
}
.top .top-product.js--anime .top-product__wrap .top-product__detail--ttl span {
  opacity: 1;
  transition: all 200ms;
  transition-delay: 500ms;
}
.top .top-product.js--anime .top-product__wrap .top-product__detail--ttl span::before {
  transform: translate3d(-50%) scale(1, 1);
  transition: all 200ms;
  transition-delay: 500ms;
}
.top .top-product.js--anime .top-product__wrap .top-product__detail--btn {
  opacity: 1;
  transition: all 400ms;
  transition-delay: 400ms;
}
.top .top-product.js--anime .top-product__wrap .top-product__spec {
  opacity: 1;
  transition: all 400ms;
  transition-delay: 600ms;
}
/*# sourceMappingURL=../maps/share.css.map */