.contents {
  position: relative;
  z-index: 1;
}

.contents__inner {
  width: min(87.17vw, 435.89px);
  padding-top: min(10.25vw, 51.28px);
  margin: 0 auto;
}

.contents__bnr.-active {
  animation: kiraIn 0.8s ease-out forwards;
}

.mv {
  position: relative;
}

.mv__back {
  position: absolute;
  top: min(2.05vw, 10.25px);
  left: min(1.53vw, 7.69px);
  width: min(8.2vw, 41.02px);
  z-index: 3;
  filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.5));
}
.mv__back a {
  aspect-ratio: 1;
  display: grid;
  font-size: 0;
  place-content: center;
}
.mv__back a:before {
  aspect-ratio: 1;
  border-left: min(0.51vw, 2.56px) solid #fff;
  border-top: min(0.51vw, 2.56px) solid #fff;
  content: "";
  rotate: -45deg;
  translate: 25%;
  width: min(4.61vw, 23.07px);
}

.mv__logo {
  width: min(29.48vw, 147.43px);
  position: absolute;
  top: min(0.76vw, 3.84px);
  left: min(2.05vw, 10.25px);
  z-index: 2;
}

.mv__circle {
  position: absolute;
  top: min(56.41vw, 282.05px);
  left: 50%;
  transform: translateX(-50%);
}
.mv__circle:before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  content: "";
  aspect-ratio: 563/559;
  width: min(105.12vw, 525.64px);
  opacity: 0;
  height: auto;
  background: url(../img/chara/mv/ph_circle.webp) no-repeat 100% top/cover;
}
.-load .mv__circle:before {
  animation: c-in 0.5s 2.1s ease-out forwards;
}

@keyframes circleRotate {
  0% {
    transform: translateX(-50%) translateY(-50%) rotate(0);
  }
  100% {
    transform: translateX(-50%) translateY(-50%) rotate(360deg);
  }
}
.mv__upper {
  overflow: hidden;
  position: relative;
}

.mv__ph {
  opacity: 0;
  width: min(150vw, 750px);
  filter: blur(min(1.28vw, 6.41px));
  margin: max(-26.93vw, -134.62px) 0 0 max(-32.06vw, -160.26px);
  scale: 1.2;
  z-index: 2;
  position: relative;
}

@keyframes phScale {
  0% {
    opacity: 0;
    filter: blur(min(1.28vw, 6.41px));
    scale: 1.2;
  }
  100% {
    filter: blur(min(0vw, 0px));
    opacity: 1;
    scale: 1;
  }
}
.mv__lower {
  position: sticky;
  z-index: 1;
  padding: 0 min(6.66vw, 33.33px);
}

.mv__chara__ttl {
  z-index: 2;
  position: relative;
  width: min(89.23vw, 446.15px);
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5)) drop-shadow(0 0 30px rgba(0, 0, 0, 0.8));
}

.mv__chara__detail {
  font-family: "Lora", san-serif;
  color: #e5e5e5;
  white-space: nowrap;
}
.mv__chara__detail dt {
  font-weight: 500;
  position: relative;
}
.mv__chara__detail dt:before, .mv__chara__detail dt:after {
  border-radius: 100vmax;
  content: "";
  inset: 0;
  position: absolute;
  z-index: -1;
}
.mv__chara__detail dt:after {
  inset: min(0.25vw, 1.28px);
}
.mv__chara__detail dd {
  line-height: 1;
}
.mv__chara__detail dd span {
  font-size: min(4.61vw, 23.07px);
  margin-left: 1em;
}
.mv__chara__detail.-top {
  align-items: center;
  margin-top: min(3.33vw, 16.66px);
  display: flex;
  border-inline: min(0.25vw, 1.28px) solid #e5e5e5;
  -moz-column-gap: min(1.28vw, 6.41px);
       column-gap: min(1.28vw, 6.41px);
  justify-content: center;
  height: min(6.15vw, 30.76px);
}
.mv__chara__detail.-top dt {
  font-size: min(3.58vw, 17.94px);
  line-height: min(5.12vw, 25.64px);
  padding-inline: 0.6em;
  display: flex;
  align-items: center;
  padding: 0 min(3.07vw, 15.38px);
}
.mv__chara__detail.-top dt:before {
  border: 2px #e5e5e5 solid;
}
.mv__chara__detail.-top dt:after {
  background-color: transparent;
}
.mv__chara__detail.-top dd {
  font-size: min(5.12vw, 25.64px);
  margin-left: getvw(5);
}
.mv__chara__detail.-top dd span {
  font-size: min(4.61vw, 23.07px);
}
.mv__chara__detail.-bottom {
  border-top: min(0.25vw, 1.28px) solid #e5e5e5;
  gap: min(6.41vw, 32.05px) min(2.56vw, 12.82px);
  margin-top: min(6.41vw, 32.05px);
  padding-top: min(6.41vw, 32.05px);
}
.mv__chara__detail.-bottom dt {
  font-size: min(3.58vw, 17.94px);
  line-height: min(5.12vw, 25.64px);
  padding-inline: 0.8em;
  color: #001e59;
  font-weight: 600;
  display: inline-block;
}
.mv__chara__detail.-bottom dt:nth-of-type(2) {
  margin-left: min(5.12vw, 25.64px);
}
.mv__chara__detail.-bottom dt:after {
  background-color: #e5e5e5;
}
.mv__chara__detail.-bottom dd {
  font-weight: 700;
  font-size: min(5.12vw, 25.64px);
  margin-left: min(1.79vw, 8.97px);
}

.mv__chara__detail__flex {
  display: flex;
  align-items: center;
}
.mv__chara__detail__flex:nth-of-type(2) {
  margin-top: min(4.1vw, 20.51px);
}

.mv__chara__txt {
  font-family: "Lora", san-serif;
  font-weight: 600;
  font-style: italic;
  font-size: min(5.38vw, 26.92px);
  line-height: 1.3333333333;
  margin-top: min(3.84vw, 19.23px);
  text-align: left;
  background: linear-gradient(90deg, rgb(255, 221, 88) 16.65%, rgb(255, 244, 207) 41.18%, rgb(242, 223, 150) 56.5%, rgb(235, 200, 63) 71.79%, rgb(247, 234, 180) 98.51%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@keyframes slideGradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.mv__chara__desc {
  margin-top: min(2.56vw, 12.82px);
  color: #e5e5e5;
  font-family: "Lora", san-serif;
  font-weight: 400;
  font-size: min(3.84vw, 19.23px);
  line-height: 1.6;
  width: min(88.46vw, 442.3px);
}

.mv__mov iframe {
  aspect-ratio: 16/9;
  margin-top: min(10.25vw, 51.28px);
  width: 100%;
}

.present {
  position: relative;
  font-family: "Lora", san-serif;
}
.present:before {
  content: "";
  background: url(../img/chara/present/ph_part.webp) no-repeat 100% top/cover;
  width: 100%;
  height: min(11.79vw, 58.97px);
  position: absolute;
  top: min(14.1vw, 70.51px);
}

.present__inner {
  padding: min(34.35vw, 171.79px) min(6.66vw, 33.33px) 0;
}

.present__txt {
  color: #e5e5e5;
  text-align: center;
  font-size: min(5.12vw, 25.64px);
  font-weight: 700;
  margin-top: min(10.25vw, 51.28px);
}

.present__period {
  text-align: center;
  width: 100%;
  margin-top: min(4.61vw, 23.07px);
}

.present__period__ttl {
  padding: min(0.25vw, 1.28px) 0 0;
  font-size: min(3.84vw, 19.23px);
  color: #001e59;
  background-color: #e5e5e5;
  font-weight: 500;
}

.present__period__txt {
  padding: min(2.05vw, 10.25px) 0;
  color: #e5e5e5;
  border: min(0.25vw, 1.28px) solid #e5e5e5;
  font-size: min(4.61vw, 23.07px);
  font-weight: 700;
}

.present__sec__txt {
  text-align: center;
  margin-top: min(3.58vw, 17.94px);
  color: #e5e5e5;
  font-size: min(4.1vw, 20.51px);
  font-weight: 500;
}

.present__sec {
  margin-top: min(8.71vw, 43.58px);
}
.present__sec .is-end {
  position: relative;
}
.present__sec .is-end:after {
  background-color: rgba(26, 26, 26, 0.9);
  color: #d1d5db;
  content: "Distribution has ended.";
  display: grid;
  font-size: min(3.84vw, 19.23px);
  font-weight: 500;
  inset: max(-1.54vw, -7.7px);
  place-content: center;
  position: absolute;
}
.present__sec:first-of-type {
  margin-top: min(8.71vw, 43.58px);
}
.present__sec.-active {
  animation: kiraIn 0.8s ease-out forwards;
}
@keyframes kiraIn {
  0% {
    filter: brightness(1);
    opacity: 0;
  }
  50% {
    filter: brightness(2.5);
  }
  100% {
    filter: brightness(1);
    opacity: 1;
  }
}

.present__sec__ttl {
  align-items: center;
  display: flex;
  height: min(9.23vw, 46.15px);
  padding-block: min(0.76vw, 3.84px);
}
.present__sec__ttl > span {
  background: radial-gradient(closest-side, #efe5c2, #e9d791, #e1c03c) text;
  font-size: min(5.12vw, 25.64px);
  padding-bottom: 0.1em;
  -webkit-text-fill-color: transparent;
}
.present__sec__ttl > span span {
  font-size: min(4.1vw, 20.51px);
}
.present__sec__ttl:after {
  margin: 0 min(2.56vw, 12.82px) 0 auto;
}

.present__sec__ph {
  margin: min(3.07vw, 15.38px) auto 0;
  width: min(59.99vw, 300px);
}

.present__sec__col {
  margin-inline: auto;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  width: 100%;
  justify-content: space-between;
}
.present__sec__col .cp__sec__btn {
  margin-top: min(1.53vw, 7.69px);
}

.present__sec__btn {
  width: min(41.28vw, 206.41px);
}
.present__sec__btn a {
  display: block;
}
.present__sec__btn a[href="#"] {
  pointer-events: none;
}
.-banner .present__sec__btn {
  margin: 0 auto;
  margin-top: min(3.07vw, 15.38px);
}

.present__sec__row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: min(3.07vw, 15.38px) auto 0;
  width: min(80.76vw, 403.84px);
}

.present__sec__ico {
  width: min(37.43vw, 187.17px);
}

.present__sec__banner {
  margin-top: min(3.07vw, 15.38px);
  width: min(84.61vw, 423.07px);
  margin: min(3.07vw, 15.38px) auto 0;
}

.present__desc {
  font-size: min(3.07vw, 15.38px);
  line-height: 1.5;
  color: #e5e5e5;
  margin-top: min(8.2vw, 41.02px);
  font-family: "Roboto", sans-serif;
  opacity: 0.8;
}

@media (min-width: 1024px) {
  .mv__logo {
    display: none;
  }
  .-load .mv__ph {
    animation: phScale 0.8s 1.8s ease-out forwards;
  }
}

@media (max-width: 1023px) {
  .-load .mv__ph {
    animation: phScale 0.9s 0.8s ease-out forwards;
  }
}