@charset "utf-8";

/* M PLUS 1p フォント */
@font-face {
  font-family: "M PLUS 1p";
  src: url("../fonts/MPLUS1p-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "M PLUS 1p";
  src: url("../fonts/MPLUS1p-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

/* Noto Sans JP フォント */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

/* Inter フォント */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

/* css調整 */
body.is-renewal .footer-navigation,
body:has(.top-kv) .footer-navigation,
body:has(.pagetitle) .footer-navigation,
body:has(.breadcrumbs) .footer-navigation {
  margin-top: 0 !important;
}

/* common */
.contentContainer img {
  vertical-align: top;
}

.contentContainer p {
  margin-bottom: 0;
}

/* ユーティリティクラス */
.u-visible-pc {
  display: block;
}

.u-visible-sp {
  display: none !important;
}

.u-br-sp {
  display: none;
}

.fontNotoSansJp,
.contentContainer {
  font-family: "Noto Sans Japanese";
}

.contentContainer {
  --base-width: 1536;
  --mu-header-height-pc: 90px;
  --mu-header-height-sp: 20px;
  overflow-x: hidden;
}

.fontJinsNextLight {
  font-family: jins_next_ttlight;
}

.fontJinsNextRegular {
  font-family: jins_next_ttregular;
}

.fontJinsNextMedium {
  font-family: jins_next_ttmedium;
}

.fontJinsNextBold {
  font-family: jins_next_ttbold;
}

.fontMPlus1pRegular {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 400;
}

.fontMPlus1pExtraBold {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
}

.fontNotoSansJpRegular {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}

.fontInterBold {
  font-family: "Inter", sans-serif;
  font-weight: 700;
}

/* content */
@keyframes mu-kv-fade-in {
  from {
    transform: scale(0.9);
    opacity: 0;
  }

  to {
    transform: scale(1);
    opacity: 1;
  }
}

.mu__kv {
  position: relative;
  width: 100%;
}

/* Lottie イントロオーバーレイ */
.mu__kv__intro {
  position: absolute;
  top: clamp(-70px, calc(-70 / var(--base-width) * 100vw), 0px);
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  opacity: 1;
  transition: opacity 0.3s ease-out;
}

.mu__kv__intro.is-hidden {
  opacity: 0;
  pointer-events: none;
}

.mu__kv__lottie-wrap {
  width: 13vw;
  height: 9.75vw;
}

.mu__kv__image {
  opacity: 0;
  width: 100%;
  height: auto;
}

.mu__kv.is-kv-animated .mu__kv__image {
  animation: mu-kv-fade-in 0.6s ease-out forwards;
}

/* information scroll animation */
.mu__information__decoration {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

.mu__information__logo,
.mu__information__description,
.mu__information__price {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

.mu__information.is-stickers-visible .mu__information__decoration {
  opacity: 1;
}

.mu__information.is-stickers-visible .mu__information__decoration--bottom-left,
.mu__information.is-stickers-visible
  .mu__information__decoration--bottom-right {
  transition-delay: 0.5s;
}

.mu__information.is-center-visible .mu__information__logo,
.mu__information.is-center-visible .mu__information__description,
.mu__information.is-center-visible .mu__information__price {
  opacity: 1;
}

/* information */
.mu__information {
  position: relative;
  width: 100%;
  border-top: 50px solid #00448d;
  background: linear-gradient(
    to bottom,
    #c7c7c9 11px,
    #00448d 11px,
    #00448d 27px,
    #c7c7c9 27px
  );
  --mu-information-clip-overflow: 876px;
  padding: 90.21px 0 199.45px;
  clip-path: inset(0 0 calc(-1 * var(--mu-information-clip-overflow)) 0);
}

.mu__information p {
  line-height: normal;
}

.mu__information__bg {
  position: absolute;
  top: 27px;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 1;
}

.mu__information__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mu__information__bg::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: var(--mu-information-clip-overflow);
  background-color: #c7c7c9;
}

.mu__information__container {
  position: relative;
  width: 780px;
  margin: 0 auto;
  z-index: 2;
}

.mu__information__decoration {
  position: absolute;
  z-index: 1;
  display: none !important;
}

.mu__information__decoration--top-left {
  top: 58.14px;
  left: clamp(-484px, calc(-50.92vw + 493.66px), -288.47px);
  width: 202.22px;
}

.mu__information__decoration--top-right {
  top: 72.79px;
  right: clamp(-487px, calc(-52.34vw + 517.94px), -286px);
  width: 225px;
}

.mu__information__decoration--bottom-left {
  bottom: -15.65px;
  left: clamp(-452px, calc(-48.26vw + 474.55px), -266.65px);
  width: 249.04px;
}

.mu__information__decoration--bottom-right {
  bottom: 28.84px;
  left: clamp(724.89px, calc(50vw - 43.11px), 916.89px);
  width: 369.13px;
}

.mu__information__container img {
  display: block;
}

.mu__information__logo {
  margin: 0 auto;
  width: 391.66px;
}

.mu__information__description {
  margin-top: 24px;
  text-align: center;
  font-size: 18px;
  color: #00448d;
}

.mu__information__price {
  margin-top: 80px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.mu__information__price__header {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mu__information__price__label {
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  color: #fff7dc;
  background-color: #0070bd;
  padding: 4px 12px;
  border-radius: 80px;
  width: 94px;
}

.mu__information__price__value {
  font-size: 40px;
  font-weight: 800;
  color: #00448d;
}

.mu__information__price__value span {
  font-size: 14px;
}

.mu__information__price__note {
  margin-top: 14px;
  font-size: 14px;
  color: #626264;
}

.mu__information__price__note span {
  font-size: 10px;
}

.mu__information__price__note--small {
  font-size: 10px;
  color: #626264;
}

.mu__information__price__date-image {
  width: 366px;
  margin: 40px auto 0;
}

.mu__information__annotation {
  font-size: 14px;
  color: #626264;
  margin-top: 14px;
}

.mu__information__release-btn-link {
  display: inline-block;
  transition: transform 0.3s ease;
}

.mu__information__release-btn-link:hover {
  transform: rotate(-3.66deg) scale(1.09);
}

.mu__information__price__release-button {
  margin: 14px auto 0;
}

/* lineup scroll animation */
.mu__lineup__bg {
  transform: translateX(-100%);
  transition: transform 0.6s ease-out;
}

.mu__lineup__title__img {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

.mu__lineup__club__list li {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-out;
}

.mu__lineup__club__list li:nth-child(1) {
  transition-delay: 0ms;
}

.mu__lineup__club__list li:nth-child(2) {
  transition-delay: 350ms;
}

.mu__lineup__club__list li:nth-child(3) {
  transition-delay: 700ms;
}

.mu__lineup__club__list li:nth-child(4) {
  transition-delay: 1050ms;
}

.mu__lineup.is-bg-visible .mu__lineup__bg {
  transform: translateX(0);
}

.mu__lineup.is-title-visible .mu__lineup__title__img {
  opacity: 1;
}

.mu__lineup.is-cards-visible .mu__lineup__club__list li {
  opacity: 1;
  pointer-events: auto;
}

/* lineup */
.mu__lineup {
  margin-top: clamp(-31px, calc(-31 / var(--base-width) * 100vw), 0px);
  position: relative;
  height: clamp(0px, calc(876 / var(--base-width) * 100vw), 876px);
}

.mu__lineup__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}

.mu__lineup__bg img {
  width: 100%;
  height: 1200px;
  display: block;
}

.mu__lineup__container {
  position: relative;
  z-index: 2;
  padding-top: clamp(0px, calc(140 / var(--base-width) * 100vw), 140px);
}

.mu__lineup__title__img {
  position: absolute;
  top: clamp(-92px, calc(-92 / var(--base-width) * 100vw), 0px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  width: clamp(0px, calc(1105.94 / var(--base-width) * 100vw), 1105.94px);
  display: block;
}

.mu__lineup__container h2 {
  font-size: 32px;
  color: #fff7dc;
  text-align: center;
}

.mu__lineup__club__list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0px, calc(20 / var(--base-width) * 100vw), 20px);
  justify-content: center;
  margin: 0;
  margin-top: clamp(0px, calc(51.06 / var(--base-width) * 100vw), 51.06px);
}

.mu__lineup__club__card {
  display: block;
  position: relative;
  width: clamp(0px, calc(291.24 / var(--base-width) * 100vw), 291.24px);
}

.mu__lineup__club__card__bg {
  display: block;
  width: 100%;
  height: auto;
  transform-origin: top center;
  transition: transform 0.3s ease;
}

.mu__lineup__club__card:hover .mu__lineup__club__card__bg {
  transform: scaleY(1.05);
}

.mu__lineup__club__card__logo {
  position: absolute;
  top: 0;
  left: 0%;
  width: 100%;
  height: auto;
}

/* product scroll animation (ウーズマカッパ) */

/* テキストライン: 背景帯スライドイン + テキストスライドイン */

/* 1. 元の background-color を無効化し ::before で管理する */
.mu__product__section__inner--oozma .mu__product__text-line--mike,
.mu__product__section__inner--oozma .mu__product__text-line--sullivan,
.mu__product__section__inner--oozma .mu__product__text-line--oozmakappa {
  background-color: transparent;
}

/* 2. ::before で背景帯を表現（初期: 右側にclip → 左からスライドイン） */
.mu__product__section__inner--oozma .mu__product__text-line--mike::before,
.mu__product__section__inner--oozma .mu__product__text-line--sullivan::before,
.mu__product__section__inner--oozma
  .mu__product__text-line--oozmakappa::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #414b00;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  z-index: 0;
}

.mu__product__section__inner--oozma
  .mu__product__text-line.is-band-visible::before {
  clip-path: inset(0 0% 0 0);
}

/* 3. テキスト (inner): 初期状態はclip-pathで非表示（帯と同じ演出） */
.mu__product__section__inner--oozma .mu__product__text-line__inner {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  position: relative;
  z-index: 1;
}

/* 4. テキスト スライドイン（帯と同じclip-pathで左から表示） */
.mu__product__section__inner--oozma
  .mu__product__text-line.is-text-visible
  .mu__product__text-line__inner {
  clip-path: inset(0 0% 0 0);
}

/* 5. スクロール開始（テキストスライドイン完了後） */
.mu__product__section__inner--oozma
  .mu__product__text-line.is-scrolling
  .mu__product__text-line__inner {
  clip-path: none;
  transition: none;
}

/* セクション背景 下からフェードイン */
.mu__product__section__inner--oozma .mu__product__section__bg {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--oozma.is-bg-visible .mu__product__section__bg {
  opacity: 1;
  transform: translateY(0);
}

.mu__product__character-image {
  z-index: 99;
}

/* キャラクター画像 フェードイン */
.mu__product__section__inner--oozma .mu__product__character-image--oozma {
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.mu__product__section__inner--oozma.is-title-visible
  .mu__product__character-image--oozma {
  opacity: 1;
}

/* クラブ名・ロゴ フェードイン (下から) */
.mu__product__section__inner--oozma .mu__product__title--oozma h2,
.mu__product__section__inner--oozma .mu__product__club-icon {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.3s ease-out,
    transform 0.3s ease-out;
}

.mu__product__section__inner--oozma.is-content-visible
  .mu__product__title--oozma
  h2,
.mu__product__section__inner--oozma.is-content-visible .mu__product__club-icon {
  opacity: 1;
  transform: translateY(0);
}

/* キャラクター写真 フェードイン (0.48秒) */
.mu__product__section__inner--oozma .mu__product__character__photo {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--oozma
  .mu__product__character.is-character-visible
  .mu__product__character__photo {
  opacity: 1;
  transform: translateY(0);
}

/* 商品エリア フェードイン (0.48秒) */
.mu__product__section__inner--oozma .mu__product__character__item {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--oozma .mu__product__character__item.is-in-view {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* ホーン/デコ: フェードイン完了後（0.48秒後）に開始 */
.mu__product__section__inner--oozma
  .mu__product__character__item.is-in-view
  .mu__product__horn {
  animation: mu-horn-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) 0.48s forwards;
}

.mu__product__section__inner--oozma
  .mu__product__character__item.is-in-view
  .mu__product__glasses__deco {
  animation: mu-deco-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) 0.48s forwards;
}

/* ケース/特典エリア フェードイン (下から上, 0.48秒) */
.mu__product__section__inner--oozma .mu__product__benefits--oozma {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--oozma .mu__product__benefits--oozma.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* =====================================================
   ロアー / パイソン / エータ 商品セクション スクロールアニメーション
   ===================================================== */

/* テキストライン: 背景帯スライドイン + テキストスライドイン */

/* 1. background-color を無効化し ::before で管理する */
.mu__product__section__inner--roar .mu__product__text-line--randy,
.mu__product__section__inner--roar .mu__product__text-line--johnny,
.mu__product__section__inner--roar .mu__product__text-line--roar {
  background-color: transparent;
}

.mu__product__section__inner--python .mu__product__text-line--carrie,
.mu__product__section__inner--python .mu__product__text-line--naomi,
.mu__product__section__inner--python .mu__product__text-line--pythonnukappa {
  background-color: transparent;
}

.mu__product__section__inner--eta .mu__product__text-line--rosie,
.mu__product__section__inner--eta .mu__product__text-line--nancy,
.mu__product__section__inner--eta .mu__product__text-line--eta {
  background-color: transparent;
}

/* 2. ::before で背景帯を表現（初期: 右側にclip → 左からスライドイン） */
.mu__product__section__inner--roar .mu__product__text-line--randy::before,
.mu__product__section__inner--roar .mu__product__text-line--johnny::before,
.mu__product__section__inner--roar .mu__product__text-line--roar::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #621300;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  z-index: 0;
}

.mu__product__section__inner--python .mu__product__text-line--carrie::before,
.mu__product__section__inner--python .mu__product__text-line--naomi::before,
.mu__product__section__inner--python
  .mu__product__text-line--pythonnukappa::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #d45794;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  z-index: 0;
}

.mu__product__section__inner--eta .mu__product__text-line--rosie::before,
.mu__product__section__inner--eta .mu__product__text-line--nancy::before,
.mu__product__section__inner--eta .mu__product__text-line--eta::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #3f3f3f;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  z-index: 0;
}

/* 3. is-band-visible: 帯をスライドイン */
.mu__product__section__inner--roar
  .mu__product__text-line.is-band-visible::before,
.mu__product__section__inner--python
  .mu__product__text-line.is-band-visible::before,
.mu__product__section__inner--eta
  .mu__product__text-line.is-band-visible::before {
  clip-path: inset(0 0% 0 0);
}

/* 4. テキスト(inner): 初期状態はclip-pathで非表示（帯と同じ演出） */
.mu__product__section__inner--roar .mu__product__text-line__inner,
.mu__product__section__inner--python .mu__product__text-line__inner,
.mu__product__section__inner--eta .mu__product__text-line__inner {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.5s ease-out;
  position: relative;
  z-index: 1;
}

/* 5. is-text-visible: テキストスライドイン（帯と同じclip-pathで左から表示） */
.mu__product__section__inner--roar
  .mu__product__text-line.is-text-visible
  .mu__product__text-line__inner,
.mu__product__section__inner--python
  .mu__product__text-line.is-text-visible
  .mu__product__text-line__inner,
.mu__product__section__inner--eta
  .mu__product__text-line.is-text-visible
  .mu__product__text-line__inner {
  clip-path: inset(0 0% 0 0);
}

/* 6. is-scrolling: スクロール開始 */
.mu__product__section__inner--roar
  .mu__product__text-line.is-scrolling
  .mu__product__text-line__inner,
.mu__product__section__inner--python
  .mu__product__text-line.is-scrolling
  .mu__product__text-line__inner,
.mu__product__section__inner--eta
  .mu__product__text-line.is-scrolling
  .mu__product__text-line__inner {
  clip-path: none;
  transition: none;
}

/* セクション背景 下からフェードイン */
.mu__product__section__inner--roar .mu__product__section__bg,
.mu__product__section__inner--python .mu__product__section__bg,
.mu__product__section__inner--eta .mu__product__section__bg {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--roar.is-bg-visible .mu__product__section__bg,
.mu__product__section__inner--python.is-bg-visible .mu__product__section__bg,
.mu__product__section__inner--eta.is-bg-visible .mu__product__section__bg {
  opacity: 1;
  transform: translateY(0);
}

/* キャラクターグループ画像 フェードイン */
.mu__product__section__inner--roar .mu__product__character-image--roar,
.mu__product__section__inner--python .mu__product__character-image--python,
.mu__product__section__inner--eta .mu__product__character-image--eta {
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.mu__product__section__inner--roar.is-title-visible
  .mu__product__character-image--roar,
.mu__product__section__inner--python.is-title-visible
  .mu__product__character-image--python,
.mu__product__section__inner--eta.is-title-visible
  .mu__product__character-image--eta {
  opacity: 1;
}

/* クラブ名・ロゴ フェードイン */
.mu__product__section__inner--roar .mu__product__title--roar h2,
.mu__product__section__inner--roar .mu__product__club-icon,
.mu__product__section__inner--python .mu__product__title--python h2,
.mu__product__section__inner--python .mu__product__club-icon,
.mu__product__section__inner--eta .mu__product__title--eta h2,
.mu__product__section__inner--eta .mu__product__club-icon {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.3s ease-out,
    transform 0.3s ease-out;
}

.mu__product__section__inner--roar.is-content-visible
  .mu__product__title--roar
  h2,
.mu__product__section__inner--roar.is-content-visible .mu__product__club-icon,
.mu__product__section__inner--python.is-content-visible
  .mu__product__title--python
  h2,
.mu__product__section__inner--python.is-content-visible .mu__product__club-icon,
.mu__product__section__inner--eta.is-content-visible
  .mu__product__title--eta
  h2,
.mu__product__section__inner--eta.is-content-visible .mu__product__club-icon {
  opacity: 1;
  transform: translateY(0);
}

/* キャラクター写真 フェードイン */
.mu__product__section__inner--roar .mu__product__character__photo,
.mu__product__section__inner--python .mu__product__character__photo,
.mu__product__section__inner--eta .mu__product__character__photo {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--roar
  .mu__product__character.is-character-visible
  .mu__product__character__photo,
.mu__product__section__inner--python
  .mu__product__character.is-character-visible
  .mu__product__character__photo,
.mu__product__section__inner--eta
  .mu__product__character.is-character-visible
  .mu__product__character__photo {
  opacity: 1;
  transform: translateY(0);
}

/* 商品エリア フェードイン */
.mu__product__section__inner--roar .mu__product__character__item,
.mu__product__section__inner--python .mu__product__character__item,
.mu__product__section__inner--eta .mu__product__character__item {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--roar .mu__product__character__item.is-in-view,
.mu__product__section__inner--python .mu__product__character__item.is-in-view,
.mu__product__section__inner--eta .mu__product__character__item.is-in-view {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* ホーン/デコ: フェードイン完了後（0.48秒後）に開始 */
.mu__product__section__inner--roar
  .mu__product__character__item.is-in-view
  .mu__product__horn,
.mu__product__section__inner--python
  .mu__product__character__item.is-in-view
  .mu__product__horn,
.mu__product__section__inner--eta
  .mu__product__character__item.is-in-view
  .mu__product__horn {
  animation: mu-horn-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) 0.48s forwards;
}

.mu__product__section__inner--roar
  .mu__product__character__item.is-in-view
  .mu__product__glasses__deco,
.mu__product__section__inner--python
  .mu__product__character__item.is-in-view
  .mu__product__glasses__deco,
.mu__product__section__inner--eta
  .mu__product__character__item.is-in-view
  .mu__product__glasses__deco {
  animation: mu-deco-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) 0.48s forwards;
}

/* ケース/特典エリア フェードイン */
.mu__product__section__inner--roar .mu__product__benefits--roar,
.mu__product__section__inner--python .mu__product__benefits--python,
.mu__product__section__inner--eta .mu__product__benefits--eta {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__product__section__inner--roar .mu__product__benefits--roar.is-visible,
.mu__product__section__inner--python .mu__product__benefits--python.is-visible,
.mu__product__section__inner--eta .mu__product__benefits--eta.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.mu__product__section__inner {
  padding-bottom: clamp(0px, calc(860 / var(--base-width) * 100vw), 860px);
}

.mu__product__section__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: clamp(0px, calc(3687 / var(--base-width) * 100vw), 3687px);
  display: block;
  z-index: 0;
}

.mu__product__section__inner--oozma {
  position: relative;
  z-index: 5;
  margin-top: clamp(-280px, calc(-280 / var(--base-width) * 100vw), 0px);
  padding: clamp(0px, calc(20.3 / var(--base-width) * 100vw), 20.3px) 0
    clamp(0px, calc(860 / var(--base-width) * 100vw), 860px);
}

.mu__product__section__inner--roar {
  position: relative;
  z-index: 5;
  margin-top: clamp(-690px, calc(-690 / var(--base-width) * 100vw), 0px);
}

.mu__product__section__inner--python {
  position: relative;
  z-index: 5;
  margin-top: clamp(-690px, calc(-690 / var(--base-width) * 100vw), 0px);
  padding: clamp(0px, calc(35.3 / var(--base-width) * 100vw), 35.3px) 0
    clamp(0px, calc(860 / var(--base-width) * 100vw), 860px);
}

.mu__product__section__inner--eta {
  position: relative;
  z-index: 5;
  margin-top: clamp(-690px, calc(-690 / var(--base-width) * 100vw), 0px);
  padding: clamp(0px, calc(35.3 / var(--base-width) * 100vw), 35.3px) 0
    clamp(0px, calc(140 / var(--base-width) * 100vw), 140px);
}

.mu__product__section__inner--eta .mu__product__section__bg {
  height: 100%;
}

.mu__product__character {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.mu__product__character--mike {
  margin-top: clamp(0px, calc(98 / var(--base-width) * 100vw), 98px);
  gap: clamp(0px, calc(62.33 / var(--base-width) * 100vw), 62.33px);
}

.mu__product__character--sulley {
  margin-top: clamp(0px, calc(168 / var(--base-width) * 100vw), 168px);
  gap: clamp(0px, calc(82 / var(--base-width) * 100vw), 82px);
}

.mu__product__character--randy {
  margin-top: clamp(0px, calc(73 / var(--base-width) * 100vw), 73px);
  gap: clamp(0px, calc(104 / var(--base-width) * 100vw), 104px);
}

.mu__product__character--johnny {
  margin-top: clamp(0px, calc(168 / var(--base-width) * 100vw), 168px);
  gap: clamp(0px, calc(82.33 / var(--base-width) * 100vw), 82.33px);
}

.mu__product__character--carrie {
  margin-top: clamp(0px, calc(101.01 / var(--base-width) * 100vw), 101.01px);
  gap: clamp(0px, calc(62.33 / var(--base-width) * 100vw), 62.33px);
}

.mu__product__character--naomi {
  margin-top: clamp(0px, calc(168 / var(--base-width) * 100vw), 168px);
  gap: clamp(0px, calc(82 / var(--base-width) * 100vw), 82px);
}

.mu__product__character--rosie {
  margin-top: clamp(0px, calc(81 / var(--base-width) * 100vw), 81px);
  gap: clamp(0px, calc(91 / var(--base-width) * 100vw), 91px);
}

.mu__product__character--nancy {
  margin-top: clamp(0px, calc(168 / var(--base-width) * 100vw), 168px);
  gap: clamp(0px, calc(82.33 / var(--base-width) * 100vw), 82.33px);
}

.mu__product__character__mike {
  margin-bottom: clamp(0px, calc(24.01 / var(--base-width) * 100vw), 24.01px);
}

.mu__product__character__sulley,
.mu__product__character__naomi {
  margin-bottom: clamp(0px, calc(32.65 / var(--base-width) * 100vw), 32.65px);
}

.mu__product__character__randy,
.mu__product__character__rosie {
  margin-bottom: clamp(0px, calc(39.65 / var(--base-width) * 100vw), 39.65px);
}

.mu__product__character__johnny {
  margin-bottom: clamp(0px, calc(17.01 / var(--base-width) * 100vw), 17.01px);
}

.mu__product__character__carrie {
  margin-bottom: clamp(0px, calc(24.01 / var(--base-width) * 100vw), 24.01px);
}

.mu__product__character__nancy {
  margin-bottom: clamp(0px, calc(17.01 / var(--base-width) * 100vw), 17.01px);
}

.mu__product__character__photo {
  width: clamp(0px, calc(416.74 / var(--base-width) * 100vw), 416.74px);
}

.mu__product__character__item {
  position: relative;
  width: clamp(0px, calc(621 / var(--base-width) * 100vw), 621px);
}

.mu__product__character__item__inner {
  position: absolute;
  top: clamp(-36px, calc(-36 / var(--base-width) * 100vw), 0px);
  left: 50%;
  transform: translateX(-50%);
}

.mu__product__character__item__inner h3 {
  margin-top: clamp(-4.55px, calc(-4.55 / var(--base-width) * 100vw), 0px);
  text-align: center;
  font-size: clamp(10px, 1.3vw, 20px);
  color: #00448d;
}

.mu__product__model-title {
  display: block;
  margin: 0 auto;
  width: clamp(0px, calc(342 / var(--base-width) * 100vw), 342px);
}

.mu__product__model-title--mike {
  width: clamp(0px, calc(401.2 / var(--base-width) * 100vw), 401.2px);
}

.mu__product__horn-wrap {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(0px, calc(532.8 / var(--base-width) * 100vw), 532.8px);
  overflow: hidden;
  pointer-events: none;
}

.mu__product__horn {
  display: block;
  width: 100%;
  transform: translateY(100%);
}

@keyframes mu-horn-sprout {
  0% {
    transform: translateY(100%);
  }

  100% {
    transform: translateY(0);
  }
}

.mu__product__character__item.is-in-view .mu__product__horn {
  animation: mu-horn-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}

.mu__product__model-title--sulley {
  width: clamp(0px, calc(464.5 / var(--base-width) * 100vw), 464.5px);
}

.mu__product__model-title--randy {
  width: clamp(0px, calc(432.28 / var(--base-width) * 100vw), 432.28px);
}

.mu__product__model-title--johnny {
  width: clamp(0px, calc(472.5 / var(--base-width) * 100vw), 472.5px);
}

.mu__product__model-title--carrie {
  width: clamp(0px, calc(449.86 / var(--base-width) * 100vw), 449.86px);
}

.mu__product__model-title--naomi {
  width: clamp(0px, calc(474.77 / var(--base-width) * 100vw), 474.77px);
}

.mu__product__model-title--rosie {
  width: clamp(0px, calc(413.44 / var(--base-width) * 100vw), 413.44px);
}

.mu__product__model-title--nancy {
  width: clamp(0px, calc(432.37 / var(--base-width) * 100vw), 432.37px);
}

.mu__product__section {
  position: relative;
  scroll-margin-top: var(--mu-header-height-pc);
}

.mu__product__text-line {
  position: absolute;
  left: calc(-275.71 / var(--base-width) * 100vw);
  width: calc(2202 / var(--base-width) * 100vw);
  height: clamp(0px, calc(185 / var(--base-width) * 100vw), 185px);
  transform: rotate(8deg);
  overflow: hidden;
  display: flex;
  z-index: 1;
  pointer-events: none;
}

.mu__product__text-line--reverse {
  transform: rotate(-8deg);
}

/* 無限スクロール: 2グループ×N枚の参考サイト方式 */
.mu__product__text-line__inner {
  display: flex;
  align-items: center;
  gap: calc(52 / var(--base-width) * 100vw);
  padding-right: calc(52 / var(--base-width) * 100vw);
  height: 100%;
  flex-shrink: 0;
  will-change: transform;
}

/* 左スクロール（デフォルト） */
@keyframes mu-loop-1 {
  from {
    transform: translateX(100%);
  }

  to {
    transform: translateX(-100%);
  }
}

@keyframes mu-loop-2 {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-200%);
  }
}

.mu__product__text-line.is-scrolling
  .mu__product__text-line__inner:nth-child(odd) {
  animation: mu-loop-1 var(--mu-animation-duration, 30s)
    calc(var(--mu-animation-duration, 30s) / -2) linear infinite;
}

.mu__product__text-line.is-scrolling
  .mu__product__text-line__inner:nth-child(even) {
  animation: mu-loop-2 var(--mu-animation-duration, 30s) linear infinite;
}

/* 右スクロール（reverse） */
.mu__product__text-line--reverse.is-scrolling
  .mu__product__text-line__inner:nth-child(odd) {
  animation: mu-loop-1 var(--mu-animation-duration, 30s) 0s linear infinite
    reverse;
}

.mu__product__text-line--reverse.is-scrolling
  .mu__product__text-line__inner:nth-child(even) {
  animation: mu-loop-2 var(--mu-animation-duration, 30s)
    calc(var(--mu-animation-duration, 30s) / -2) linear infinite reverse;
}

/* PC: duration = 2 × グループ幅 ÷ 基準速度(121.27px/s) */
.mu__product__text-line--mike {
  --mu-animation-duration: 53.6s;
}

.mu__product__text-line--sullivan {
  --mu-animation-duration: 88.5s;
}

.mu__product__text-line--oozmakappa {
  --mu-animation-duration: 49.7s;
}

.mu__product__text-line--randy {
  --mu-animation-duration: 55.1s;
}

.mu__product__text-line--johnny {
  --mu-animation-duration: 41.7s;
}

.mu__product__text-line--roar {
  --mu-animation-duration: 63.1s;
}

.mu__product__text-line--carrie {
  --mu-animation-duration: 61.3s;
}

.mu__product__text-line--naomi {
  --mu-animation-duration: 55.8s;
}

.mu__product__text-line--pythonnukappa {
  --mu-animation-duration: 64.3s;
}

.mu__product__text-line--rosie {
  --mu-animation-duration: 44.5s;
}

.mu__product__text-line--nancy {
  --mu-animation-duration: 42.2s;
}

.mu__product__text-line--eta {
  --mu-animation-duration: 50.8s;
}

.mu__product__text-line img {
  height: clamp(0px, calc(112 / var(--base-width) * 100vw), 112px);
  max-width: none;
  display: block;
  flex-shrink: 0;
}

.mu__product__text-line--mike img {
  width: clamp(0px, calc(1033 / var(--base-width) * 100vw), 1033px);
}

.mu__product__text-line--sullivan img {
  width: clamp(0px, calc(1741 / var(--base-width) * 100vw), 1741px);
}

.mu__product__text-line--oozmakappa img {
  width: clamp(0px, calc(954 / var(--base-width) * 100vw), 954px);
}

.mu__product__text-line--randy img {
  width: clamp(0px, calc(1063 / var(--base-width) * 100vw), 1063px);
}

.mu__product__text-line--johnny img {
  width: clamp(0px, calc(581 / var(--base-width) * 100vw), 581px);
}

.mu__product__text-line--roar img {
  width: clamp(0px, calc(1225 / var(--base-width) * 100vw), 1225px);
}

.mu__product__text-line--carrie img {
  width: clamp(0px, calc(1189 / var(--base-width) * 100vw), 1189px);
}

.mu__product__text-line--naomi img {
  width: clamp(0px, calc(1078 / var(--base-width) * 100vw), 1078px);
}

.mu__product__text-line--pythonnukappa img {
  width: clamp(0px, calc(1249 / var(--base-width) * 100vw), 1249px);
}

.mu__product__text-line--rosie img {
  width: clamp(0px, calc(848 / var(--base-width) * 100vw), 848px);
}

.mu__product__text-line--nancy img {
  width: clamp(0px, calc(801 / var(--base-width) * 100vw), 801px);
}

.mu__product__text-line--eta img {
  width: clamp(0px, calc(975 / var(--base-width) * 100vw), 975px);
}

.mu__product__text-line--mike,
.mu__product__text-line--sullivan,
.mu__product__text-line--oozmakappa {
  background-color: #414b00;
}

.mu__product__text-line--randy,
.mu__product__text-line--johnny,
.mu__product__text-line--roar {
  background-color: #621300;
}

.mu__product__text-line--carrie,
.mu__product__text-line--naomi,
.mu__product__text-line--pythonnukappa {
  background-color: #d45794;
}

.mu__product__text-line--rosie,
.mu__product__text-line--nancy,
.mu__product__text-line--eta {
  background-color: #3f3f3f;
}

.mu__product__text-line--mike {
  top: clamp(0px, calc(655 / var(--base-width) * 100vw), 655px);
}

.mu__product__text-line--sullivan {
  top: clamp(0px, calc(1378.02 / var(--base-width) * 100vw), 1378.02px);
}

.mu__product__text-line--oozmakappa {
  bottom: clamp(0px, calc(1091.34 / var(--base-width) * 100vw), 1091.34px);
}

.mu__product__text-line--randy {
  top: clamp(0px, calc(635.02 / var(--base-width) * 100vw), 635.02px);
}

.mu__product__text-line--johnny {
  top: clamp(0px, calc(1378.32 / var(--base-width) * 100vw), 1378.32px);
}

.mu__product__text-line--roar {
  bottom: clamp(0px, calc(1114.34 / var(--base-width) * 100vw), 1114.34px);
}

.mu__product__text-line--carrie {
  top: clamp(0px, calc(667.02 / var(--base-width) * 100vw), 667.02px);
}

.mu__product__text-line--naomi {
  top: clamp(0px, calc(1372.02 / var(--base-width) * 100vw), 1372.02px);
}

.mu__product__text-line--pythonnukappa {
  bottom: clamp(0px, calc(1091.34 / var(--base-width) * 100vw), 1091.34px);
}

.mu__product__text-line--rosie {
  top: clamp(0px, calc(615.02 / var(--base-width) * 100vw), 615.02px);
}

.mu__product__text-line--nancy {
  top: clamp(0px, calc(1369.02 / var(--base-width) * 100vw), 1369.02px);
}

.mu__product__text-line--eta {
  bottom: clamp(0px, calc(370.66 / var(--base-width) * 100vw), 370.66px);
}

/* PC版: 左に画像、右にコンテンツ（縦並び） */
.mu__product__title,
.mu__product__character {
  position: relative;
  z-index: 5;
}

.mu__product__title {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.mu__product__title--roar {
  align-items: center;
}

.mu__product__title--oozma {
  align-items: center;
}

.mu__product__title--oozma .mu__product__content {
  margin: 0 0 0 clamp(-34px, calc(-34 / var(--base-width) * 100vw), 0px);
}

.mu__product__title--python {
  align-items: center;
}

.mu__product__title--eta {
  align-items: center;
}

.mu__product__title h2,
.mu__product__title p {
  color: #ffe36c;
}

.mu__product__title h2 {
  font-size: clamp(15px, 1.56vw, 24px);
}

.mu__product__model-number {
  width: clamp(0px, calc(81 / var(--base-width) * 100vw), 81px);
  margin: clamp(0px, calc(23.4 / var(--base-width) * 100vw), 23.4px) auto 0;
  display: block;
}

.mu__product__title p {
  font-size: clamp(10px, 0.98vw, 15px);
  text-align: center;
}

.mu__product__character-image--oozma {
  width: clamp(0px, calc(930 / var(--base-width) * 100vw), 930px);
}

.mu__product__character-image--roar {
  width: clamp(0px, calc(886 / var(--base-width) * 100vw), 886px);
}

.mu__product__character-image--python {
  width: clamp(0px, calc(595.42 / var(--base-width) * 100vw), 595.42px);
}

.mu__product__character-image--eta {
  width: clamp(0px, calc(870 / var(--base-width) * 100vw), 870px);
}

.mu__product__character-image img {
  width: 100%;
}

.mu__product__content {
  display: flex;
  flex-direction: column;
  gap: calc(20 / var(--base-width) * 100vw);
  align-items: center;
  justify-content: center;
}

.mu__product__content--roar {
  margin: 0 clamp(-50px, calc(-50 / var(--base-width) * 100vw), 0px) 0 0;
}

.mu__product__content--python {
  margin: 0 0 0 clamp(-26.58px, calc(-26.58 / var(--base-width) * 100vw), 0px);
}

.mu__product__content--eta {
  margin: 0 clamp(-102px, calc(-102 / var(--base-width) * 100vw), 0px) 0 0;
}

.mu__product__content--roar h2,
.mu__product__content--roar p {
  color: #fabe00;
}

.mu__product__content--python h2,
.mu__product__content--python p {
  color: #f8e3ee;
}

.mu__product__content--eta h2,
.mu__product__content--eta p {
  color: #d1d1d2;
}

.mu__product__club-icon {
  width: clamp(0px, calc(370.76 / var(--base-width) * 100vw), 370.76px);
}

.mu__product__club-icon--roar {
  width: clamp(0px, calc(393 / var(--base-width) * 100vw), 393px);
}

.mu__product__club-icon--python {
  width: clamp(0px, calc(398 / var(--base-width) * 100vw), 398px);
}

.mu__product__club-icon--eta {
  width: clamp(0px, calc(385 / var(--base-width) * 100vw), 385px);
}

.mu__product__glasses {
  position: relative;
  width: clamp(0px, calc(532.8 / var(--base-width) * 100vw), 532.8px);
  height: clamp(0px, calc(324 / var(--base-width) * 100vw), 324px);
  background-color: #fafafa;
  border-radius: calc(9 / var(--base-width) * 100vw);
  margin: clamp(0px, calc(23.4 / var(--base-width) * 100vw), 23.4px) auto 0;
  overflow: hidden;
}

.mu__product__glasses__deco-wrap {
  position: absolute;
  top: clamp(-7.2px, calc(-7.2 / var(--base-width) * 100vw), 0px);
  left: 50%;
  transform: translateX(-50%);
  width: clamp(0px, calc(443.7 / var(--base-width) * 100vw), 443.7px);
  height: clamp(0px, calc(41.4 / var(--base-width) * 100vw), 41.4px);
  overflow: hidden;
  z-index: 2;
}

.mu__product__glasses__deco {
  display: block;
  width: 100%;
  height: 100%;
  transform: translateY(-100%);
}

@keyframes mu-deco-sprout {
  0% {
    transform: translateY(-100%);
  }

  100% {
    transform: translateY(0);
  }
}

.mu__product__character__item.is-in-view .mu__product__glasses__deco {
  animation: mu-deco-sprout 0.36s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}

.mu__product__glasses-wrap .mu__product__navigation-number {
  --swiper-pagination-bullet-horizontal-gap: 0;
  position: absolute;
  left: clamp(0px, calc(17.1 / var(--base-width) * 100vw), 17.1px);
  bottom: clamp(0px, calc(11.25 / var(--base-width) * 100vw), 11.25px);
  display: flex;
  align-items: center;
  gap: clamp(0px, calc(3.6 / var(--base-width) * 100vw), 3.6px);
  z-index: 2;
}

.mu__product__pg-indicator {
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 0;
  opacity: 1;
  cursor: pointer;
  width: clamp(0px, calc(21.6 / var(--base-width) * 100vw), 21.6px);
  height: clamp(0px, calc(27 / var(--base-width) * 100vw), 27px);
}

.mu__product__pg-indicator img {
  width: 100%;
  height: 100%;
}

.mu__product__pg-indicator__img--active {
  display: none;
}

.mu__product__pg-indicator.swiper-pagination-bullet-active
  .mu__product__pg-indicator__img--default {
  display: none;
}

.mu__product__pg-indicator.swiper-pagination-bullet-active
  .mu__product__pg-indicator__img--active {
  display: block;
}

.mu__product__navigation-arrow {
  position: absolute;
  right: clamp(0px, calc(13.5 / var(--base-width) * 100vw), 13.5px);
  bottom: clamp(0px, calc(11.25 / var(--base-width) * 100vw), 11.25px);
  display: flex;
  align-items: center;
  gap: clamp(0px, calc(11.7 / var(--base-width) * 100vw), 11.7px);
  z-index: 2;
}

.mu__product__swiper-prev,
.mu__product__swiper-next {
  border: none;
  padding: 0;
  cursor: pointer;
  display: inline-block;
  position: relative;
  width: clamp(0px, calc(44.1 / var(--base-width) * 100vw), 44.1px);
  height: clamp(0px, calc(44.1 / var(--base-width) * 100vw), 44.1px);
  background-color: #0070bd;
  border-radius: 50%;
  box-shadow: 3px 4px 0 0 #00448d;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.mu__product__arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(0px, calc(18.9 / var(--base-width) * 100vw), 18.9px);
  height: clamp(0px, calc(18.9 / var(--base-width) * 100vw), 18.9px);
}

.mu__product__arrow-next {
  left: 55%;
}

@media (hover: hover) {
  .mu__product__swiper-prev:hover,
  .mu__product__swiper-next:hover {
    transform: translate(3px, 4px);
    box-shadow: none;
  }
}

.mu__product__swiper-prev.swiper-button-disabled,
.mu__product__swiper-next.swiper-button-disabled {
  cursor: default;
  opacity: 0.4;
}

.mu__product__swiper-prev.swiper-button-disabled:hover,
.mu__product__swiper-next.swiper-button-disabled:hover {
  transform: none;
  box-shadow: 3px 4px 0 0 #00448d;
}

.mu__product__glasses__swiper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.mu__product__glasses__swiper .swiper-wrapper {
  display: flex;
  flex-direction: row;
  transition-property: transform;
  will-change: transform;
}

.mu__product__glasses__swiper .swiper-slide {
  flex-shrink: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.mu__product__glasses__swiper .mu__product__glasses__image {
  border-radius: calc(9 / var(--base-width) * 100vw);
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.mu__product__frame-text__swiper {
  width: clamp(0px, calc(532.8 / var(--base-width) * 100vw), 532.8px);
  margin: clamp(0px, calc(23.4 / var(--base-width) * 100vw), 23.4px) auto 0;
  overflow: hidden;
}

.mu__product__frame-text__swiper .swiper-slide {
  color: #00448d;
  font-size: clamp(10px, 0.98vw, 15px);
  line-height: 1.4;
  height: auto;
}

.mu__product__buy-btn {
  position: absolute;
  top: clamp(0px, calc(565.2 / var(--base-width) * 100vw), 565.2px);
  left: 50%;
  transform: translateX(-50%);
  width: clamp(0px, calc(243 / var(--base-width) * 100vw), 243px);
  height: clamp(0px, calc(73.61 / var(--base-width) * 100vw), 73.61px);
  margin: clamp(0px, calc(40.5 / var(--base-width) * 100vw), 40.5px) auto 0;
  display: block;
  transition: transform 0.3s ease;
}

.mu__product__buy-btn:hover {
  transform: translateX(-50%) rotate(-3.66deg) scale(1.09);
}

.mu__product__benefits {
  position: relative;
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin-top: clamp(0px, calc(162 / var(--base-width) * 100vw), 162px);
}

.mu__product__benefits__title {
  position: relative;
  z-index: 2;
  width: clamp(0px, calc(350 / var(--base-width) * 100vw), 350px);
}

.mu__product__benefits__sample {
  width: clamp(0px, calc(700 / var(--base-width) * 100vw), 700px);
}

.mu__product__benefits__title--left {
  margin: 0 clamp(-41px, calc(-41 / var(--base-width) * 100vw), 0px)
    clamp(0px, calc(41 / var(--base-width) * 100vw), 41px) 0;
}

.mu__product__benefits__title--right {
  margin: 0 0 clamp(0px, calc(41 / var(--base-width) * 100vw), 41px)
    clamp(-17px, calc(-17 / var(--base-width) * 100vw), 0px);
}

.mu__product__benefits__title--eta {
  margin: 0 0 clamp(0px, calc(41 / var(--base-width) * 100vw), 41px)
    clamp(-28px, calc(-28 / var(--base-width) * 100vw), 0px);
}

.mu__product__benefits img,
.mu__product__benefits__sample img {
  width: 100%;
  height: auto;
  display: block;
}

/* link list scroll animation */
.mu__link__list__btn,
.mu__link__list__pagetop__btn,
.mu__copy__right {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.48s ease-out,
    transform 0.48s ease-out;
}

.mu__link__list__section.is-btn-visible .mu__link__list__btn {
  opacity: 1;
  transform: translateY(0);
}

.mu__link__list__section.is-bottom-visible .mu__link__list__pagetop__btn,
.mu__link__list__section.is-bottom-visible .mu__copy__right {
  opacity: 1;
  transform: translateY(0);
}

/* link list */
.mu__link__list__section {
  position: relative;
  z-index: 99;
}

.mu__link__list__bg {
  position: relative;
  height: calc(738 / var(--base-width) * 100vw);
  overflow: hidden;
}

.mu__link__list__bg__img {
  position: absolute;
  top: calc(-150 / var(--base-width) * 100vw);
  width: 100%;
  height: auto;
  display: block;
}

.mu__link__list__container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(0px, calc(496 / var(--base-width) * 100vw), 496px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(0px, calc(10 / var(--base-width) * 100vw), 10px);
}

.mu__link__list__btn {
  width: clamp(0px, calc(471 / var(--base-width) * 100vw), 471px);
}

.mu__link__list__btn a {
  display: block;
  transition: transform 0.3s ease;
}

.mu__link__list__btn a:hover {
  transform: rotate(-3.66deg) scale(1.09);
}

.mu__link__list__btn img,
.mu__link__list__pagetop__btn img {
  width: 100%;
  height: auto;
  display: block;
}

.mu__link__list__pagetop__btn {
  width: clamp(0px, calc(172 / var(--base-width) * 100vw), 172px);
  margin: clamp(0px, calc(70 / var(--base-width) * 100vw), 70px) auto 0;
}

.mu__copy__right {
  display: block;
  width: clamp(0px, calc(110 / var(--base-width) * 100vw), 110px);
  margin-top: clamp(0px, calc(70 / var(--base-width) * 100vw), 70px);
}

@media screen and (min-width: 1024px) {
  .mu__information__decoration {
    display: block !important;
  }
}

@media screen and (min-width: 1920px) {
  .mu__lineup {
    margin-top: -40px;
  }

  /* 1920px以上は中央要素との位置関係を保持しつつ背景のみ拡張 */
  .mu__information__decoration--top-left {
    left: calc(50% - 874px);
  }

  .mu__information__decoration--top-right {
    right: auto;
    left: calc(50% + 652px);
  }

  .mu__information__decoration--bottom-left {
    left: calc(50% - 842px);
  }

  .mu__information__decoration--bottom-right {
    right: auto;
    left: calc(50% + 527px);
  }
}

@media screen and (max-width: 1023px) {
  .mu__lineup__bg img {
    height: 1000px;
  }
}

/* spレイアウト */
@media screen and (max-width: 767px) {
  .contentContainer {
    overflow-x: hidden;
  }

  .u-visible-pc {
    display: none !important;
  }

  .u-visible-sp {
    display: block !important;
  }

  .u-br-sp {
    display: inline;
  }

  .mu__kv__intro {
    top: -66px;
  }

  .mu__kv__lottie-wrap {
    width: 28vw;
    height: 21vw;
  }

  .mu__information {
    position: relative;
    width: 100%;
    border-top: 5.13vw solid #00448d;
    background: linear-gradient(
      to bottom,
      #c7c7c9 1.14vw,
      #00448d 1.14vw,
      #00448d 2.54vw,
      #c7c7c9 2.54vw
    );
    --mu-information-clip-overflow: 230.77vw;
    padding: 10vw 0 32.87vw;
    clip-path: inset(0 0 calc(-1 * var(--mu-information-clip-overflow)) 0);
  }

  .mu__information__bg {
    top: 2.54vw;
    height: calc(100% - 2.54vw);
  }

  .mu__information__bg::after {
    height: var(--mu-information-clip-overflow);
  }

  .mu__information__container {
    position: relative;
    width: 86.67vw;
    margin: 0 auto;
    z-index: 2;
  }

  .mu__information__logo {
    width: 65.67vw;
  }

  .mu__information__description {
    margin-top: 6.41vw;
    font-size: 4.1vw;
  }

  .mu__information__price {
    margin-top: 10.26vw;
  }

  .mu__information__price__header {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .mu__information__price__label {
    text-align: center;
    font-size: 3.69vw;
    margin-right: 1.23vw;
    padding: 1.49vw 4.64vw;
    border-radius: 20.51vw;
    width: 19.28vw;
  }

  .mu__information__price__value {
    font-size: 7.69vw;
  }

  .mu__information__price__value span {
    font-size: 2.87vw;
  }

  .mu__information__price__note {
    margin-top: 3.59vw;
    font-size: 3.07vw;
  }

  .mu__information__price__note span {
    font-size: 2.56vw;
  }

  .mu__information__price__note--small {
    font-size: 2.56vw;
    color: #626264;
  }

  .mu__information__price__date-image {
    width: 75.08vw;
    margin: 10.26vw auto 0;
  }

  .mu__information__annotation {
    font-size: 3.08vw;
    color: #626264;
    margin-top: 3.59vw;
  }

  .mu__information__price__release-button {
    width: 59.23vw;
    margin: 3.59vw auto 0;
  }

  .mu__lineup {
    margin-top: -23.85vw;
    height: 230.77vw;
  }

  .mu__lineup__bg {
    top: -5.5vw;
  }

  .mu__lineup__bg img {
    height: 264vw;
  }

  .mu__lineup__container {
    position: relative;
    z-index: 2;
    padding-top: 34.36vw;
  }

  .mu__lineup__title__img {
    top: 0;
    width: 85.13vw;
  }

  .mu__lineup__club__list {
    gap: 2.29vw;
    margin: 0;
    margin-top: clamp(0px, calc(58 / var(--base-width) * 100vw), 58px);
  }

  .mu__lineup__club__card {
    width: 41.87vw;
  }

  .mu__product__section {
    scroll-margin-top: var(--mu-header-height-sp);
  }

  .mu__product__section__bg {
    height: 920vw;
  }

  .mu__product__section__inner--oozma {
    position: relative;
    z-index: 1;
    margin-top: -95.38vw;
    padding: 15.82vw 0 14.1vw;
  }

  /* product character - mike & sulley */
  .mu__product__character {
    flex-direction: column;
    align-items: center;
  }

  .mu__product__character--mike {
    margin-top: 24.09vw;
    gap: 10.61vw;
  }

  .mu__product__character--sulley {
    margin-top: 18.97vw;
    gap: 10.7vw;
  }

  .mu__product__character__mike,
  .mu__product__character__sulley {
    order: 1;
  }

  .mu__product__character__item {
    order: 2;
    width: 100%;
  }

  .mu__product__horn-wrap {
    width: calc(358 / 390 * 100vw);
  }

  .mu__product__character__item__inner {
    top: -6.41vw;
  }

  .mu__product__character__item__inner h3 {
    height: 4.61vw;
    margin-top: -1.02vw;
    font-size: 4.62vw;
  }

  .mu__product__model-title--mike {
    width: 68.58vw;
  }

  .mu__product__model-title--sulley {
    width: 79.4vw;
  }

  .mu__product__text-line__inner {
    gap: 6.44vw;
    padding-right: 6.44vw;
  }

  .mu__product__text-line--mike {
    top: 118.13vw;
  }

  .mu__product__text-line--sullivan {
    top: 356.53vw;
  }

  .mu__product__text-line--oozmakappa {
    bottom: 97.3vw;
  }

  .mu__product__text-line--randy {
    top: 118.7vw;
  }

  .mu__product__text-line--johnny {
    top: 366.5vw;
  }

  .mu__product__text-line--roar {
    bottom: 97.3vw;
  }

  .mu__product__text-line--carrie {
    top: 118.79vw;
  }

  .mu__product__text-line--naomi {
    top: 358.38vw;
  }

  .mu__product__text-line--pythonnukappa {
    bottom: 96.27vw;
  }

  .mu__product__text-line--rosie {
    top: 128.22vw;
  }

  .mu__product__text-line--nancy {
    top: 373.78vw;
  }

  .mu__product__text-line--eta {
    bottom: 103.3vw;
  }

  .mu__product__text-line {
    height: 22.87vw;
  }

  .mu__product__text-line img {
    height: 13.85vw;
  }

  .mu__product__text-line--mike img {
    width: 128.21vw;
  }

  .mu__product__text-line--sullivan img {
    width: 205.64vw;
  }

  .mu__product__text-line--oozmakappa img {
    width: 107.95vw;
  }

  .mu__product__text-line--randy img {
    width: 121.54vw;
  }

  .mu__product__text-line--johnny img {
    width: 61.79vw;
  }

  .mu__product__text-line--roar img {
    width: 141.54vw;
  }

  .mu__product__text-line--carrie img {
    width: 137.18vw;
  }

  .mu__product__text-line--naomi img {
    width: 123.4vw;
  }

  .mu__product__text-line--pythonnukappa img {
    width: 144.62vw;
  }

  .mu__product__text-line--rosie img {
    width: 94.87vw;
  }

  .mu__product__text-line--nancy img {
    width: 88.97vw;
  }

  .mu__product__text-line--eta img {
    width: 141.54vw;
  }

  /* SP: duration = 2 × グループ幅(vw) ÷ 基準速度(7.896vw/s) */
  .mu__product__text-line--mike {
    --mu-animation-duration: 100s;
  }

  .mu__product__text-line--sullivan {
    --mu-animation-duration: 158.8s;
  }

  .mu__product__text-line--oozmakappa {
    --mu-animation-duration: 84.6s;
  }

  .mu__product__text-line--randy {
    --mu-animation-duration: 94.9s;
  }

  .mu__product__text-line--johnny {
    --mu-animation-duration: 66s;
  }

  .mu__product__text-line--roar {
    --mu-animation-duration: 110.1s;
  }

  .mu__product__text-line--carrie {
    --mu-animation-duration: 106.8s;
  }

  .mu__product__text-line--naomi {
    --mu-animation-duration: 96.3s;
  }

  .mu__product__text-line--pythonnukappa {
    --mu-animation-duration: 112.5s;
  }

  .mu__product__text-line--rosie {
    --mu-animation-duration: 74.6s;
  }

  .mu__product__text-line--nancy {
    --mu-animation-duration: 70.2s;
  }

  .mu__product__text-line--eta {
    --mu-animation-duration: 110.1s;
  }

  /* product scroll animation (ウーズマカッパ) - SP: 上から下へ順番にフェードイン */
  /* SP配置順: h2(order:1) → club-icon(order:2) → character-image(order:3) → description(order:4) */
  .mu__product__section__inner--oozma .mu__product__title--oozma h2 {
    transition:
      opacity 0.3s ease-out 0s,
      transform 0.3s ease-out 0s;
  }

  .mu__product__section__inner--oozma .mu__product__club-icon {
    transition:
      opacity 0.3s ease-out 0.2s,
      transform 0.3s ease-out 0.2s;
  }

  .mu__product__section__inner--oozma .mu__product__character-image--oozma {
    transition: opacity 0.3s ease-out 0.4s;
  }

  /* product scroll animation (ロアー / パイソン / エータ) - SP: h2(0s) → icon(0.2s) → char-image(0.4s) */
  .mu__product__section__inner--roar .mu__product__title--roar h2,
  .mu__product__section__inner--python .mu__product__title--python h2,
  .mu__product__section__inner--eta .mu__product__title--eta h2 {
    transition:
      opacity 0.3s ease-out 0s,
      transform 0.3s ease-out 0s;
  }

  .mu__product__section__inner--roar .mu__product__club-icon,
  .mu__product__section__inner--python .mu__product__club-icon,
  .mu__product__section__inner--eta .mu__product__club-icon {
    transition:
      opacity 0.3s ease-out 0.2s,
      transform 0.3s ease-out 0.2s;
  }

  .mu__product__section__inner--roar .mu__product__character-image--roar,
  .mu__product__section__inner--python .mu__product__character-image--python,
  .mu__product__section__inner--eta .mu__product__character-image--eta {
    transition: opacity 0.3s ease-out 0.4s;
  }

  /* product section - oozma kappa */
  .mu__product__title {
    flex-direction: column;
    align-items: center;
  }

  .mu__product__title h2 {
    font-size: 4.62vw;
  }

  .mu__product__title p {
    font-size: 3.85vw;
  }

  .mu__product__model-number {
    width: 16.67vw;
    margin: 4.1vw auto 0;
  }

  .mu__product__character-image--oozma {
    width: 104.62vw;
    margin-top: -5.36vw;
  }

  .mu__product__character-image {
    order: 3;
  }

  .mu__product__content {
    display: contents;
  }

  .mu__product__content h2 {
    order: 1;
  }

  .mu__product__content p {
    order: 4;
  }

  .mu__product__club-icon {
    order: 2;
    width: 59.74vw;
  }

  .mu__product__glasses {
    width: 94.87vw;
    height: 57.69vw;
    border-radius: 1.45vw;
    margin: 4.1vw auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .mu__product__glasses__deco-wrap {
    width: 78.41vw;
    height: 7.08vw;
    top: -1vw;
  }

  .mu__product__glasses__swiper .mu__product__glasses__image {
    border-radius: 1.45vw;
  }

  .mu__product__pg-indicator {
    width: 4.92vw;
    height: 6.15vw;
  }

  .mu__product__glasses-wrap .mu__product__navigation-number {
    left: 2.31vw;
    bottom: 2.56vw;
    gap: 0.82vw;
  }

  .mu__product__navigation-arrow {
    right: 2.56vw;
    bottom: 2.56vw;
    gap: 2.05vw;
  }

  .mu__product__swiper-prev,
  .mu__product__swiper-next {
    width: 8.21vw;
    height: 8.21vw;
  }

  .mu__product__arrow {
    width: 3.44vw;
    height: 3.51vw;
  }

  .mu__product__frame-text__swiper {
    font-size: 3.5vw;
    width: 89.74vw;
    margin: 4.1vw auto 0;
  }

  .mu__product__frame-text__swiper .swiper-slide {
    font-size: 3.59vw;
  }

  .mu__product__buy-btn {
    top: 104.1vw;
    width: 41.54vw;
    height: 12.58vw;
    margin: 5.13vw auto 0;
  }

  /* product benefits - SP版で縦並び */
  .mu__product__benefits {
    flex-direction: column;
    align-items: center;
    margin-top: 23.85vw;
  }

  .mu__product__benefits__title {
    width: 53.85vw;
  }

  .mu__product__benefits__title--left {
    margin: 0 auto -11.28vw;
  }

  .mu__product__benefits__sample {
    width: 94.87vw;
    margin-bottom: 7.44vw;
  }

  .mu__product__section__inner--roar {
    position: relative;
    z-index: 1;
    margin-top: -1.28vw;
    padding: 15.82vw 0 11.28vw;
  }

  .mu__product__character--randy {
    margin-top: 27.69vw;
    gap: 12.05vw;
  }

  .mu__product__character--johnny {
    margin-top: 19.08vw;
    gap: 10.7vw;
  }

  .mu__product__character__randy {
    order: 1;
  }

  .mu__product__character__johnny {
    order: 1;
  }

  .mu__product__character-image--roar {
    width: 110vw;
    margin-top: -11.79vw;
    order: 3;
  }

  .mu__product__content--roar {
    margin-top: 0;
  }

  .mu__product__club-icon--roar {
    width: 73.08vw;
  }

  .mu__product__model-title--randy {
    width: 73.89vw;
  }

  .mu__product__model-title--johnny {
    width: 80.74vw;
  }

  .mu__product__benefits__title--right {
    order: 1;
    margin: 0 auto -11.28vw;
  }

  .mu__product__benefits__sample--left {
    order: 2;
  }

  .mu__product__section__inner--python {
    position: relative;
    z-index: 1;
    margin-top: -1.28vw;
    padding: 16.33vw 0 13.59vw;
  }

  .mu__product__character--carrie {
    margin-top: 27.03vw;
    gap: 10.98vw;
  }

  .mu__product__character--naomi {
    margin-top: 18.97vw;
    gap: 10.36vw;
  }

  .mu__product__character__carrie {
    order: 1;
  }

  .mu__product__character__naomi {
    order: 1;
  }

  .mu__product__character-image--python {
    width: 74.62vw;
    margin-top: -5.98vw;
    order: 3;
  }

  .mu__product__club-icon--python {
    width: 69.35vw;
  }

  .mu__product__model-title--carrie {
    width: 73.89vw;
  }

  .mu__product__model-title--naomi {
    width: 68.52vw;
  }

  .mu__product__section__inner--eta {
    position: relative;
    z-index: 1;
    margin-top: -1.28vw;
    padding: 17.1vw 0 18.72vw;
  }

  .mu__product__character--rosie {
    margin-top: 27.69vw;
    gap: 13.69vw;
  }

  .mu__product__character--nancy {
    margin-top: 19.08vw;
    gap: 13.29vw;
  }

  .mu__product__character__rosie {
    order: 1;
  }

  .mu__product__character__nancy {
    order: 1;
  }

  .mu__product__character__photo {
    width: 74vw;
  }

  .mu__product__character-image--eta {
    width: 107.95vw;
    margin-top: -4.78vw;
    order: 3;
  }

  .mu__product__content--eta {
    margin-top: 0;
  }

  .mu__product__club-icon--eta {
    width: 73.08vw;
  }

  .mu__product__model-title--rosie {
    width: 73.89vw;
  }

  .mu__product__model-title--nancy {
    width: 80.74vw;
  }

  .mu__link__list__bg {
    height: 128.97vw;
  }

  .mu__link__list__bg__img {
    top: 0;
    height: 128.97vw;
    object-fit: cover;
    object-position: center;
  }

  .mu__link__list__container {
    width: 83.59vw;
    gap: 3.08vw;
  }

  .mu__link__list__btn {
    width: 80.35vw;
  }

  .mu__link__list__pagetop__btn {
    width: 44.1vw;
    margin: 10.26vw auto 0;
  }

  .mu__copy__right {
    width: 22vw;
    margin-top: 9.23vw;
  }
}