@charset "UTF-8";

.fv {
  container-type: inline-size;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1440 / 768;
  background-color: #eaebe6;
  user-select: none;
}

.fv__inner {
  --fv-u: calc(100cqw / 1440);
  position: absolute;
  inset: 0;
}

.fv__inner img {
  display: block;
  max-width: none;
}

.fv__photo,
.fv__debut,
.fv__car,
.fv__title img {
  position: absolute;
}

.fv__title,
.fv__title > *,
.fv__debut {
  margin: 0;
  padding: 0;
}

.fv__photo {
  top: calc(55 * var(--fv-u));
  left: calc(736 * var(--fv-u));
  width: calc(587 * var(--fv-u));
  height: calc(515 * var(--fv-u));
  overflow: hidden;
}

.fv__photo img,
.fv__debut img {
  width: 100%;
  height: 100%;
}

.fv__photo img {
  object-fit: cover;
}

.fv__photo-item {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.2s ease;
}

.fv__photo-item.is-active {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .fv__photo-item {
    transition: none;
  }
}

.fv__title-catch {
  top: calc(125.945 * var(--fv-u));
  left: calc(59.479 * var(--fv-u));
  width: calc(609.521 * var(--fv-u));
  height: calc(59.757 * var(--fv-u));
}

.fv__title-shingata {
  top: calc(217.114 * var(--fv-u));
  left: calc(59.479 * var(--fv-u));
  width: calc(85.142 * var(--fv-u));
  height: calc(39.022 * var(--fv-u));
}

.fv__title-name {
  top: calc(207.437 * var(--fv-u));
  left: calc(166.061 * var(--fv-u));
  width: calc(502.939 * var(--fv-u));
  height: calc(51.382 * var(--fv-u));
}

.fv__title-logo {
  top: calc(273.664 * var(--fv-u));
  left: calc(59.479 * var(--fv-u));
  width: calc(609.519 * var(--fv-u));
  height: calc(177.583 * var(--fv-u));
}

.fv__title-hybrid {
  top: calc(414.195 * var(--fv-u));
  left: calc(59.479 * var(--fv-u));
  width: calc(169.447 * var(--fv-u));
  height: calc(32.25 * var(--fv-u));
}

.fv__debut {
  top: calc(491.43 * var(--fv-u));
  left: calc(32 * var(--fv-u));
  width: calc(661.463 * var(--fv-u));
  height: calc(102.894 * var(--fv-u));
}

.fv__car {
  top: calc(223.547 * var(--fv-u));
  left: calc(830.16 * var(--fv-u));
  width: calc(585.01 * var(--fv-u));
  height: calc(514.455 * var(--fv-u));
}

@media screen and (max-width: 750px) {
  .fv {
    aspect-ratio: 375 / 552;
  }

  .fv__inner {
    --fv-u: calc(100cqw / 375);
  }

  .fv__photo {
    top: calc(231 * var(--fv-u));
    left: calc(20 * var(--fv-u));
    width: calc(260 * var(--fv-u));
    height: calc(228 * var(--fv-u));
  }

  .fv__title-catch {
    top: calc(19 * var(--fv-u));
    left: calc(44.873 * var(--fv-u));
    width: calc(285.088 * var(--fv-u));
    height: calc(27.95 * var(--fv-u));
  }

  .fv__title-shingata {
    top: calc(60.5 * var(--fv-u));
    left: calc(44.873 * var(--fv-u));
    width: calc(39.815 * var(--fv-u));
    height: calc(18.252 * var(--fv-u));
  }

  .fv__title-name {
    top: calc(55.98 * var(--fv-u));
    left: calc(94.72 * var(--fv-u));
    width: calc(235.242 * var(--fv-u));
    height: calc(24.031 * var(--fv-u));
  }

  .fv__title-logo {
    top: calc(86.96 * var(--fv-u));
    left: calc(44.873 * var(--fv-u));
    width: calc(285.083 * var(--fv-u));
    height: calc(83.037 * var(--fv-u));
  }

  .fv__title-hybrid {
    top: calc(152.68 * var(--fv-u));
    left: calc(44.873 * var(--fv-u));
    width: calc(79.254 * var(--fv-u));
    height: calc(15.084 * var(--fv-u));
  }

  .fv__debut {
    top: calc(182 * var(--fv-u));
    left: calc(62.527 * var(--fv-u));
    width: calc(249.943 * var(--fv-u));
    height: calc(36 * var(--fv-u));
  }

  .fv__car {
    top: calc(274.875 * var(--fv-u));
    left: calc(103 * var(--fv-u));
    width: calc(258.005 * var(--fv-u));
    height: calc(226.888 * var(--fv-u));
  }
}