/* BEGIN peppuri-mv-content-v1-20260925 */
/* MV専用。Figma 50:29 / 63:2。実画像・テキスト・リンクを個別配置。 */
.peppuri-mv {
  --mv-ink: #241507;
  --mv-scene: max(343px, 87.949cqw);
  --mv-enter-distance: 8px;
  --mv-drift-distance: -4px;
  color: var(--mv-ink);
  font-family: "Noto Sans JP", sans-serif;
  background: var(--mv-background, #ffd02f radial-gradient(ellipse 56.818% 62.5% at 50% 50%, #fff39e 0%, #ffe267 50%, #ffd94b 75%, #ffd02f 100%));
  overflow: clip;
  width: 100%;
}
.peppuri-mv *, .peppuri-mv *::before, .peppuri-mv *::after { box-sizing: border-box; }
.peppuri-mv p, .peppuri-mv h2 { margin: 0; }
.peppuri-mv img { display: block; max-width: none; }
.peppuri-mv__inner { container-type: inline-size; position: relative; width: 100%; max-width: 600px; margin-inline: auto; padding-bottom: 26px; }
.peppuri-mv__copy { position: relative; z-index: 2; width: max(194px, 49.744cqw); max-width: calc(100% - 26px); margin-inline: auto; min-height: var(--mv-scene); padding-top: 4.103cqw; display: flex; flex-direction: column; align-items: center; gap: max(18px, 4.615cqw); text-align: center; }
.peppuri-mv__intro { display: flex; flex-direction: column; align-items: center; gap: max(9px, 2.308cqw); width: 100%; }
.peppuri-mv__logo { width: 33.333cqw; height: auto; aspect-ratio: 600 / 164; }
.peppuri-mv__tagline { font-size: max(1.55rem, 3.974cqw); line-height: 1.35484; font-weight: 700; }
.peppuri-mv__title { width: 100%; }
.peppuri-mv__title h2 { font-size: max(4.6rem, 11.795cqw); line-height: 1.152174; font-weight: 900; letter-spacing: 0; overflow-wrap: anywhere; }
.peppuri-mv__title h2 span { display: block; }
.peppuri-mv__underline { width: 93.814%; height: 2.051cqw; margin-inline: auto; }
.peppuri-mv__body { font-size: max(1.35rem, 3.462cqw); line-height: 1.55556; font-weight: 700; }
.peppuri-mv__art { position: absolute; inset: 0 0 auto; height: var(--mv-scene); pointer-events: none; }
.peppuri-mv__float { position: absolute; }
.peppuri-mv__entry, .peppuri-mv__drift, .peppuri-mv__tilt { width: 100%; height: 100%; }
.peppuri-mv__float img { width: 100%; height: 100%; object-fit: cover; }
.peppuri-mv__float--photo { width: 25.128cqw; height: 32.308cqw; left: 2.358cqw; top: 6.038cqw; --mv-delay: .2s; --mv-period: 3.2s; --mv-float-delay: 2.7s; }
.peppuri-mv__float--photo .peppuri-mv__tilt { transform: rotate(-10deg); }
.peppuri-mv__float--photo .peppuri-mv__tilt, .peppuri-mv__float--product .peppuri-mv__tilt { border: 2.2px solid #fff; border-radius: 4.615cqw; box-shadow: 0 5px 8px #6b3b0529; overflow: hidden; background: #fff; }
.peppuri-mv__float--illustration { width: 24.615cqw; height: 36.526cqw; left: 2.051cqw; top: 50cqw; --mv-delay: .8s; --mv-period: 3.6s; --mv-float-delay: 2.8s; --mv-enter-distance: 4px; }
.peppuri-mv__float--character { width: 22.051cqw; height: 39.744cqw; right: 4.872cqw; top: 3.077cqw; --mv-delay: 1.4s; --mv-period: 3.4s; --mv-float-delay: 2.9s; }
.peppuri-mv__float--character .peppuri-mv__tilt { position: relative; }
.peppuri-mv__float--character img { position: absolute; width: 87.41%; height: 91.13%; top: 6.29%; left: 1.94%; }
.peppuri-mv__float--product { width: 23.333cqw; height: 32.051cqw; right: 3.966cqw; top: 51.064cqw; --mv-delay: 2s; --mv-period: 3.8s; --mv-float-delay: 3s; --mv-enter-distance: 4px; }
.peppuri-mv__float--product .peppuri-mv__tilt { position: relative; transform: rotate(14deg); }
.peppuri-mv__cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-inline: 13px; position: relative; z-index: 3; }
.peppuri-mv__button { display: flex; align-items: center; gap: 6px; min-height: 52px; padding: 10px 8px; border-radius: 8px; color: var(--mv-ink); text-decoration: none; font-weight: 700; font-size: 1.6rem; line-height: 1.375; box-shadow: 0 8px 14px #6b3b051f; transition: filter .18s, box-shadow .18s; }
.peppuri-mv__button span { flex: 1; min-width: 0; text-align: center; overflow-wrap: anywhere; }
.peppuri-mv__button picture, .peppuri-mv__button img { width: 16px; height: 16px; flex: 0 0 16px; }
.peppuri-mv__button--pink { background: #ff9baa; }
.peppuri-mv__button--mint { background: #9cc7c5; }
.peppuri-mv__button--peach { background: #ffc4a6; }
.peppuri-mv__button--lilac { background: #d3bce8; }
@media (hover: hover) { .peppuri-mv__button:hover { filter: brightness(1.045); box-shadow: 0 5px 10px #6b3b0530; } }
.peppuri-mv__button:focus-visible { outline: 3px solid var(--mv-ink); outline-offset: 3px; }
.peppuri-mv__decorations { position: absolute; inset: 0; pointer-events: none; }
.peppuri-mv__decorations img { position: absolute; }
.peppuri-mv__decorations--pc { display: none; }
.peppuri-mv__decorations--sp .d1 { width: 4.615cqw; height: 11.006cqw; left: 27.949cqw; top: 6.410cqw; }
.peppuri-mv__decorations--sp .d2 { width: 4.615cqw; height: 11.006cqw; left: 2.051cqw; top: 41.282cqw; }
.peppuri-mv__decorations--sp .d3 { width: 4.359cqw; height: 10.394cqw; right: 28.205cqw; top: 7.692cqw; }
.peppuri-mv__decorations--sp .d4 { width: 4.615cqw; height: 11.006cqw; right: -.256cqw; top: 76.154cqw; }
.peppuri-mv__decorations--sp .d5 { width: 7.062cqw; height: 6.65cqw; left: 20.8cqw; top: 77.1cqw; transform: rotate(8deg); }
.peppuri-mv__decorations--sp .d6 { width: 5.694cqw; height: 5.36cqw; right: 1.12cqw; top: 36.5cqw; }
.peppuri-mv__decorations--sp .d7 { width: 4.359cqw; height: 4.359cqw; left: 15.385cqw; top: 42.564cqw; }
.peppuri-mv__decorations--sp .d8 { width: 4.103cqw; height: 4.103cqw; left: 23.846cqw; top: 70.513cqw; }
.peppuri-mv__decorations--sp .d9 { width: 3.333cqw; height: 3.333cqw; right: 1.795cqw; top: 15.385cqw; }
@media (max-width: 359px) {
  .peppuri-mv__float--photo { width: 22cqw; height: 28.286cqw; left: .5cqw; }
  .peppuri-mv__float--illustration { width: 22cqw; height: 32.645cqw; left: 0; top: 68cqw; }
  .peppuri-mv__float--character { width: 20cqw; height: 36.046cqw; right: 0; }
  .peppuri-mv__float--product { width: 21cqw; height: 28.846cqw; right: -2.5cqw; top: 70cqw; }
}
@media (min-width: 1024px) {
  .peppuri-mv { --mv-enter-distance: 24px; --mv-drift-distance: -8px; }
  .peppuri-mv__inner { max-width: 1672px; padding-bottom: min(24px, 1.435vw); min-height: min(941px, 56.280vw); }
  .peppuri-mv__copy { width: 36.842%; min-height: 0; padding-top: 2.811cqw; gap: 1.077cqw; }
  .peppuri-mv__intro { gap: 1.077cqw; }
  .peppuri-mv__logo { width: 33.672cqw; }
  .peppuri-mv__tagline, .peppuri-mv__body { font-size: max(1.8rem, 1.914cqw); line-height: 1.4375; }
  .peppuri-mv__sp-break { display: none; }
  .peppuri-mv__title h2 { font-size: max(6.4rem, 8.134cqw); line-height: 1.07353; letter-spacing: .419cqw; }
  .peppuri-mv__underline { width: 89.61%; height: 1.316cqw; }
  .peppuri-mv__art { height: 56.28cqw; }
  .peppuri-mv__float--photo { width: 20.335cqw; height: 23.923cqw; left: 6.34cqw; top: 2.662cqw; }
  .peppuri-mv__float--photo .peppuri-mv__tilt, .peppuri-mv__float--product .peppuri-mv__tilt { border-width: .299cqw; border-radius: 3.469cqw; box-shadow: 0 .837cqw 1.316cqw #6b3b0529; }
  .peppuri-mv__float--illustration { width: 16.746cqw; height: 24.85cqw; left: 8.134cqw; top: 29.218cqw; --mv-enter-distance: 24px; }
  .peppuri-mv__float--character { width: 15.431cqw; height: 27.811cqw; right: 8.792cqw; top: -.060cqw; }
  .peppuri-mv__float--product { width: 21.621cqw; height: 23.733cqw; right: 5.696cqw; top: 29.821cqw; --mv-enter-distance: 24px; }
  .peppuri-mv__float--product .peppuri-mv__tilt { transform: rotate(9deg); }
  .peppuri-mv__float--product img { position: absolute; width: 108.01%; height: 98.4%; left: -5.86%; top: .06%; }
  .peppuri-mv__cta { width: 36.842%; margin: 1.077cqw auto 0; gap: .837cqw; }
  .peppuri-mv__button { min-height: max(52px, 5.323cqw); padding: 10px max(8px, .718cqw); gap: max(6px, .718cqw); border-radius: max(8px, .718cqw); font-size: max(1.6rem, 1.435cqw); line-height: 1.33333; }
  .peppuri-mv__button picture, .peppuri-mv__button img { width: max(16px, 1.435cqw); height: max(16px, 1.435cqw); flex-basis: max(16px, 1.435cqw); }
  .peppuri-mv__decorations--sp { display: none; }
  .peppuri-mv__decorations--pc { display: block; }
  .peppuri-mv__decorations--pc .d1 { width: 3.11cqw; height: 7.416cqw; left: 2.435cqw; top: 18.992cqw; transform: rotate(-14.52deg); }
  .peppuri-mv__decorations--pc .d2 { width: 3.11cqw; height: 7.416cqw; left: 29.625cqw; top: 10.709cqw; transform: rotate(12deg); }
  .peppuri-mv__decorations--pc .d3 { width: 3.11cqw; height: 7.416cqw; left: 3.409cqw; top: 33.014cqw; }
  .peppuri-mv__decorations--pc .d4 { width: 3.11cqw; height: 7.416cqw; left: 71.582cqw; top: 9.091cqw; transform: rotate(18deg); }
  .peppuri-mv__decorations--pc .d5 { width: 3.11cqw; height: 7.416cqw; left: 95.566cqw; top: 45.092cqw; transform: rotate(-168.45deg); }
  .peppuri-mv__decorations--pc .d6 { width: 4.357cqw; height: 4.101cqw; left: 21.99cqw; top: 44.55cqw; transform: rotate(-12deg); }
  .peppuri-mv__decorations--pc .d7 { width: 4.357cqw; height: 4.101cqw; left: 90.477cqw; top: 10.645cqw; transform: rotate(10deg); }
  .peppuri-mv__decorations--pc .d8 { width: 1.615cqw; height: 1.615cqw; left: 26.615cqw; top: 27.572cqw; }
  .peppuri-mv__decorations--pc .d9 { width: 3.409cqw; height: 3.409cqw; left: 24.222cqw; top: 39.354cqw; }
  .peppuri-mv__decorations--pc .d10 { width: 1.854cqw; height: 1.854cqw; left: 92.883cqw; top: 3.409cqw; }
  .peppuri-mv__decorations--pc .d11 { width: 2.033cqw; height: 2.033cqw; left: 94.079cqw; top: 20.993cqw; }
}
/* 文字拡大時は実測して画像を独立行へ移し、文字と操作領域を保護する。 */
.peppuri-mv[data-expanded-copy] .peppuri-mv__copy { width: calc(100% - 26px); max-width: 750px; min-height: 0; padding-bottom: 24px; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__art { position: relative; height: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; padding: 24px 20px 36px; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__float { position: relative; inset: auto; justify-self: center; width: min(160px, 32cqw); height: auto; aspect-ratio: 3 / 4; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__float--illustration { aspect-ratio: 633 / 942; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__float--character { aspect-ratio: 258 / 465; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__decorations { display: none; }
.peppuri-mv[data-expanded-copy] .peppuri-mv__cta { width: auto; margin-inline: 13px; }
/* デフォルトは完成状態。JS初期化成功時のみ透明化する。 */
.peppuri-mv[data-motion="waiting"] .peppuri-mv__entry { opacity: 0; }
.peppuri-mv[data-motion="playing"] .peppuri-mv__entry { animation: peppuri-mv-enter .6s cubic-bezier(.22,.61,.36,1) var(--mv-delay) both; }
.peppuri-mv[data-motion="playing"] .peppuri-mv__drift { animation: peppuri-mv-float var(--mv-period) ease-in-out var(--mv-float-delay) infinite both; }
.peppuri-mv[data-paused] .peppuri-mv__entry, .peppuri-mv[data-paused] .peppuri-mv__drift { animation-play-state: paused; }
@keyframes peppuri-mv-enter { from { opacity: 0; transform: translateY(var(--mv-enter-distance)); } to { opacity: 1; transform: translateY(0); } }
@keyframes peppuri-mv-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(var(--mv-drift-distance)); } }
.peppuri-mv-page .fixed-icon[data-peppuri-suppressed] { visibility: hidden !important; pointer-events: none !important; }
@media (prefers-reduced-motion: reduce) {
  .peppuri-mv .peppuri-mv__entry, .peppuri-mv .peppuri-mv__drift { animation: none !important; transform: none !important; opacity: 1 !important; }
  .peppuri-mv__button { transition: none; }
}


/* コンテンツ幅版。確認用URLパラメーターへの依存なし。 */
.peppuri-mv-mount { box-sizing: border-box; width: 100%; padding-top: 23px; }
.peppuri-mv.peppuri-mv--content { box-sizing: border-box; margin-block: 0; }
.peppuri-mv .peppuri-mv__button:link,
.peppuri-mv .peppuri-mv__button:visited,
.peppuri-mv .peppuri-mv__button:hover,
.peppuri-mv .peppuri-mv__button:active { color: var(--mv-ink); opacity: 1; }
@media (min-width: 1024px) {
  .peppuri-mv.peppuri-mv--content {
    width: calc(100% - 40px);
    max-width: 1240px;
    margin-inline: auto;
    container-type: inline-size;
  }
  .peppuri-mv.peppuri-mv--content .peppuri-mv__inner {
    min-height: 56.280cqw;
    padding-bottom: 1.435cqw;
  }
}

/* END peppuri-mv-content-v1-20260925 */

/* 下部中央を支点に、上部が左右に揺れる */
.peppuri-mv--content {
  --mv-swing-angle: 5deg;
}

.peppuri-mv--content .peppuri-mv__drift {
  transform-origin: 50% 100%;
}

.peppuri-mv--content[data-motion="playing"] .peppuri-mv__drift {
  animation-name: peppuri-mv-swing;
}

/* PCの揺れ幅 */
@media (min-width: 1024px) {
  .peppuri-mv--content {
    --mv-swing-angle: 3deg;
  }
}

@keyframes peppuri-mv-swing {
  0%, 50%, 100% {
    transform: rotate(0deg);
    animation-timing-function: cubic-bezier(.33, .52, .66, 1);
  }
  25% {
    transform: rotate(var(--mv-swing-angle));
    animation-timing-function: cubic-bezier(.33, 0, .66, .48);
  }
  75% {
    transform: rotate(calc(-1 * var(--mv-swing-angle)));
    animation-timing-function: cubic-bezier(.33, 0, .66, .48);
  }
}

/* BEGIN peppuri-mv-button-left-20261003 */
.peppuri-mv .peppuri-mv__button {
  padding-left: clamp(16px, 5.128cqw, 28px);
}
.peppuri-mv .peppuri-mv__button span {
  text-align: left;
}
/* END peppuri-mv-button-left-20261003 */