@charset "UTF-8";



@media screen and (min-width: 768px) {
  .c-breadcrumb {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
  }
}
@media screen and (max-width: 767px) {
  html{
    scroll-behavior: smooth;
  }
  .c-breadcrumb {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
    color: var(--color-white);
  }
  .c-breadcrumb .c-breadcrumb__text, body .c-breadcrumb > ol > li:last-child > *{
    color: var(--color-white);
  }
}
html{
  overflow: auto;
}
body{
  overflow-x: clip;
}

#JK260807Kitty .bg-img{
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  #JK260807Kitty{
    padding-top: 9.8rem;
  }
}
#JK260807Kitty .mask {
  position: absolute;
  width: 100%;
  height: 100%;
}
#JK260807Kitty .mask__inner{
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#JK260807Kitty .maskArea{
  width: calc(var(--sp-artboard-width) * var(--formula));
  height: 100%;
  overflow: hidden;
}

/*================================
  sticky
=================================*/
#JK260807Kitty .sticky-block-wrap{
  position: relative;
  display: block;
  overflow: clip;
}
#JK260807Kitty .sticky-block{
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}
#JK260807Kitty #sticky-00{
  top: var(--sticky-block00-pos);
}


/* =====================================================
   JAMIE KAY × HELLO KITTY 特集LP
   計測ID: JK260807Kitty （全セレクタの親）
   レイアウト: SP特化型／PCパターン E（中央SPコンテンツ＋左右追従レール）
   単位・命名などの規約は coding-guidelines.md を参照
   ※ 数値コメントの GY はデザイン（Illustrator）のY座標（SP 750幅・sp_01 + sp_02 連結）
   ===================================================== */

/* ▼ -----------可変設定---------- ▼
   指示書:
   ・中央列 = SP版コンテンツを 440px（画面幅1400px時）で流し込み、可変、max-width:500px
     → 500px に到達する画面幅は 1590px。よって 1591px 以上は固定、1590px 以下は可変。
   ・左右カラム = 画面幅1400px以上は固定、1400px以下は可変（中央列と閾値が異なるため
     --variable_pc を別系統で定義している） */
.lp_variable {
  /*デザインの値*/
  --pc-width: 1590;/*PCデザイン幅（中央列が最大幅に到達する画面幅）*/
  --sp-width: 750;/*SPデザイン幅*/
  --pc-artboard-width: 500;/*PC時の中央コンテンツ列の幅（max-width）*/
  --sp-artboard-width: 750;/*SP時の中央コンテンツ列の幅*/
  --pc-rail-width: 1400;/*左右レールの基準幅（1401px以上で固定）*/
 /*可変率の計算式*/
  --formula: calc(var(--variable) * var(--ratio));/*SP,PC共通箇所（中央列）の可変割合*/
  --formula_pc: calc(var(--variable_pc) * 1);/*PCデザイン基準（左右レール）の可変割合*/
 }

/* PC画面幅 1591px以上 中央列固定（500px） */
@media (min-width: 1591px) {
  .lp_variable {
  --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
  --variable: 1px; /* 固定値（可変しない） */
  }
 }

 /* PC画面幅 768〜1590px 中央列可変 */
 @media (min-width: 768px) and (max-width: 1590.98px) {
  .lp_variable {
  --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
  --variable: calc(100vw / var(--pc-width));
  }
 }

 /* SP画面幅 767px以下 可変 */
 @media (max-width: 767.98px) {
  .lp_variable {
  --ratio: 1;
  --variable: calc(100vw / var(--sp-width));
  }
 }

/* 左右レール: 1401px以上は固定 / 768〜1400px は可変 */
@media (min-width: 1401px) {
  .lp_variable { --variable_pc: 1px; }
}
@media (min-width: 768px) and (max-width: 1400.98px) {
  .lp_variable { --variable_pc: calc(100vw / var(--pc-rail-width)); }
}
@media (max-width: 767.98px) {
  .lp_variable { --variable_pc: calc(100vw / var(--pc-rail-width)); }
}
/* ▲ -----------可変設定---------- ▲ */

/* ▼ -----------カスタムプロパティ---------- ▼ */
#JK260807Kitty {
  --color-text: #715243;
  --color-bg: #f7f2e7;
  --color-red: #b14c4f;
  --color-red-text: #b14c4f;
  --color-white: #fff;
  --color-cream: #fffef3;
  --font-base: "effra", "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --font-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --font-en: "effra", "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Cormorant Infant", "orpheus-pro", "Times New Roman", serif;
  --ease-base: cubic-bezier(0.25, 0.1, 0.25, 1);
  --duration-base: 1s;
  --lp-header-offset: 0px; /* サイト共通ヘッダー高（追従レールの逃げ）*/
}
/* ▲ -----------カスタムプロパティ---------- ▲ */

/* ▼ -----------LPスコープ リセット---------- ▼ */
#JK260807Kitty * {
  box-sizing: border-box;
  font: inherit;
  letter-spacing: inherit;
  font-feature-settings: "palt";
}

#JK260807Kitty img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  transition: unset;
}

#JK260807Kitty picture {
  display: block;
}

#JK260807Kitty button {
  padding: 0;
  cursor: pointer;
  appearance: none;
  color: inherit;
  background-color: unset;
  border: unset;
}

#JK260807Kitty a {
  color: inherit;
  text-decoration: none;
}

#JK260807Kitty h1,
#JK260807Kitty p,
#JK260807Kitty figure,
#JK260807Kitty figcaption,
#JK260807Kitty section {
  margin: 0;
  padding: 0;
}

/* 表示制御ユーティリティ */
@media (min-width: 768px) {
  #JK260807Kitty .is-hidden--desktop { display: none !important; }
}
@media (max-width: 767.98px) {
  #JK260807Kitty .is-hidden--mobile { display: none !important; }
}
/* ▲ -----------LPスコープ リセット---------- ▲ */

/* ▼ -----------ベーススタイル---------- ▼ */
#JK260807Kitty {
  color: var(--color-text);
  background-color: var(--color-bg);
  font-family: var(--font-base);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
/* ▲ -----------ベーススタイル---------- ▲ */

/* ▼ -----------出現アニメーション（.js-inview 用）---------- ▼ */
#JK260807Kitty .js-inview {
  opacity: 0;
  translate: 0 calc(40 * var(--formula, 1px));
  transition: opacity var(--duration-base) var(--ease-base),
    translate var(--duration-base) var(--ease-base);
}

#JK260807Kitty .js-inview.is-active {
  opacity: 1;
  translate: 0 0;
}

@media (prefers-reduced-motion: reduce) {
  #JK260807Kitty .js-inview {
    opacity: 1;
    translate: 0 0;
    transition: none;
  }
}
/* ▲ -----------出現アニメーション---------- ▲ */

/* ▼ -----------レイアウト（3カラム）---------- ▼ */
/* 中央コンテンツ列の幅（SP: 100vw / PC: 500px を上限に可変）
   ※ 中央列は --formula（基準幅 1590・上限 500px）、左右レールは --formula_pc（基準幅 1400）と
      閾値が異なるため、雛形の「PCは --formula_pc」上書きは使わず --formula で通す */
#JK260807Kitty .lp-inner {
  width: calc(var(--sp-artboard-width) * var(--formula));
  margin-inline: auto;
}

@media (min-width: 768px) {
  #JK260807Kitty .lp-layout { display: grid; align-items: start; }
  #JK260807Kitty .lp-layout--col-2 { grid-template-columns: 1fr 1fr; }
  #JK260807Kitty .lp-layout--col-3 {
    grid-template-columns: 1fr calc(var(--sp-artboard-width) * var(--formula)) 1fr;
  }
}

/* 中央（スクロールする本体）
   ※ 横はみ出しの閉じ込みは中央列ではなく各セクション（.lp-look / .lp-flow）で行う。
      ここに overflow を付けると内側の position:sticky（せり上がり演出の固定）が効かなくなる */

/* 左右サブ（PC追従／SP非表示） */
#JK260807Kitty .lp-layout__sub { display: none; }
@media (min-width: 768px) {
  #JK260807Kitty .lp-layout__sub {
    display: grid;
    place-items: center;
    position: sticky;
    top: var(--lp-header-offset, 0px);
    height: calc(100vh - var(--lp-header-offset, 0px));/* dvh 非対応向けフォールバック */
    height: calc(100dvh - var(--lp-header-offset, 0px));
    overflow: hidden;
  }
}
/* ▲ -----------レイアウト（3カラム）---------- ▲ */

/* =====================================================
   PC 左右レール（上下左右中央・1401px以上は固定 / 1400px以下は可変）
   ===================================================== */
#JK260807Kitty .lp-rail {
  display: block;
  text-align: center;
}

/* 左: JAMIE KAY × HELLO KITTY ロゴ ＋ COLLABORATION（PC 290x108 / y422） */
#JK260807Kitty .lp-rail__logo {
  width: calc(290 * var(--formula_pc));
  margin-inline: auto;
  /* margin-top: calc(-90 * var(--formula_pc)); */
}

#JK260807Kitty .lp-rail__collab {
  margin-top: calc(12 * var(--formula_pc));
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: calc(22.5 * var(--formula_pc));
  line-height: 1.2;
  /* letter-spacing: 0.16em; */
  color: var(--color-red-text);
  /* text-indent: 0.16em; */
  letter-spacing: 0;
}

/* 右: CHECK ALL ITEMS（PC 247x247 相当 = SP 550px の 0.4486 倍） */
#JK260807Kitty .lp-rail__cta {
  width: calc(247 * var(--formula_pc));
  margin-inline: auto;
  /* margin-bottom: calc(70 * var(--formula_pc)); */
}
#JK260807Kitty .lp-rail__cta:hover{
  opacity: 0.7;
  transition: 0.5s;
}

/* =====================================================
   共通部品
   ===================================================== */
/* 商品クレジット（Effra 22px / 行送り 44px = line-height 2（デザイン実測）/ 下線付きリンク） */
#JK260807Kitty .lp-credit {
  position: relative;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(22 * var(--formula));
  line-height: 2;
  letter-spacing: 0.04em;
  color: var(--color-red-text);
}

#JK260807Kitty .lp-credit a {
  text-decoration: underline;
  text-underline-offset: 0.1em;
  text-decoration-thickness: 0.04em;
}

#JK260807Kitty .lp-credit--on-red { color: var(--color-white); }

/* © 表記（Effra 13px）。すべて1行想定なので折り返さない */
#JK260807Kitty .lp-approval {
  font-family: var(--font-en);
  font-weight: 400;
  font-size: calc(13 * var(--formula));
  line-height: 1.5;
  letter-spacing: 0.02em;
  white-space: nowrap;
  color: var(--color-white);
}

/* 円周に沿う © 表記 */
#JK260807Kitty .lp-approval-arc {
  position: absolute;
  display: block;
  overflow: visible;
  pointer-events: none;
}

#JK260807Kitty .lp-approval-arc text {
  font-family: var(--font-en);
  /* SVG内はユーザー単位（viewBox）で、SVG自体の width/height が calc(● * var(--formula)) のため
     ここはデザイン値そのままの 13 を指定する。calc(13 * var(--formula)) にすると二重に縮小される */
  font-size: 13px;
  letter-spacing: 0.02em;
  fill: var(--color-white);
}

/* 画像ブロック */
#JK260807Kitty .lp-figure {
  position: relative;
}

#JK260807Kitty .lp-figure > a {
  display: block;
}

#JK260807Kitty .lp-figure__approval {
  position: absolute;
}

/* スライダー（★ 自動フェード切替＋スワイプ可） */
#JK260807Kitty .lp-slider {
  position: relative;
}

#JK260807Kitty .lp-slider__frame {
  overflow: hidden;
}

#JK260807Kitty .lp-slider__frame .swiper-slide a {
  display: block;
}

#JK260807Kitty .lp-slider__approval {
  position: absolute;
  z-index: 2;
}

#JK260807Kitty .lp-slider__frameline {
  position: absolute;
  z-index: 3;
  pointer-events: none;
}

/* 背景装飾（ドット・柄） */
#JK260807Kitty .lp-deco {
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

/* リボン装飾（左右にゆらぐ） */
#JK260807Kitty .lp-ribbon {
  position: absolute;
  z-index: 4;
  pointer-events: none;
  transform-origin: 50% 50%;
  animation: lp-sway 3.4s ease-in-out infinite;
}

/* @keyframes lp-sway {
  0%, 100% { rotate: -7deg; }
  50% { rotate: 7deg; }
} */
@keyframes lp-sway {
  0% {
    rotate: 0deg;
  }
  40% {
    rotate: 0deg;
  }
  55% {
    rotate: 15deg;
  }
  70% {
    rotate: -15deg;
  }
  75% {
    rotate: 0deg;
  }
  100% {
    rotate: 0deg;
  }
}

@media (prefers-reduced-motion: reduce) {
  #JK260807Kitty .lp-ribbon { animation: none; }
}

/* せり上がり演出（前のブロックを画面下で固定し、次の画像がせり上がって重なる） */
#JK260807Kitty .lp-riseup {
  position: relative;
}

/* 固定側: 「自身の底辺が画面下に来たら固定」＝ top を（画面高 − 自身の高さ）にする
   ※ bottom:0 では逆挙動（下から現れて留まる）になるため top で指定する
   ※ .lp-look の position:relative に負けないよう詳細度を上げている
   ※ 高さはブロックごとに異なるため --pin-height を各ブロックで指定する */
#JK260807Kitty .lp-riseup__pin,
#JK260807Kitty .lp-look.lp-riseup__pin {
  position: sticky;
  top: calc(100vh - var(--pin-height));/* dvh 非対応向けフォールバック */
  top: calc(100dvh - var(--pin-height));
  z-index: 0;
  overflow: visible;
}

#JK260807Kitty .lp-riseup__cover {
  position: relative;
  z-index: 1;
}

/* =====================================================
   MV（GY194-1527／ムービー 750x1333・自動再生・リピート）
   ===================================================== */
#JK260807Kitty .lp-mv {
  position: relative;
  z-index: 1;
}

#JK260807Kitty .lp-mv__video {
  display: block;
  width: calc(750 * var(--formula));
  height: calc(1333 * var(--formula));
  object-fit: cover;
  background-color: var(--color-bg);
}

/* =====================================================
   KV（GY1607-2607／750x1000）
   ===================================================== */
#JK260807Kitty .lp-kv {
  position: relative;
  margin-top: calc(80 * var(--formula));
}

#JK260807Kitty .lp-kv__link {
  display: block;
}

#JK260807Kitty .lp-kv__img {
  width: calc(750 * var(--formula));
}

/* ロゴ GY1615 x105 540x330（透明パディング込みのデザイン枠で配置） */
#JK260807Kitty .lp-kv__logo {
  position: absolute;
  left: calc(105 * var(--formula));
  top: calc(8 * var(--formula));
  width: calc(540 * var(--formula));
}

/* COLLABORATION GY1849 32.55px */
#JK260807Kitty .lp-kv__collab {
  position: absolute;
  left: 0;
  top: calc(242 * var(--formula));
  width: 100%;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: calc(32.55 * var(--formula));
  line-height: 1.1;
  /* letter-spacing: 0.16em;
  text-indent: 0.16em; */
  letter-spacing: 0;
  text-align: center;
  color: var(--color-cream);
}

/* © GY2583 */
#JK260807Kitty .lp-kv__approval {
  position: absolute;
  left: 0;
  top: calc(976 * var(--formula));
  width: 100%;
  text-align: center;
}

/* =====================================================
   COMMING SOON バー（GY2607-2687）
   ※ 8/21 12:00 の実売スタート時に HTML の <aside class="lp-notice"> ごと削除
   ===================================================== */
#JK260807Kitty .lp-notice {
  display: grid;
  place-items: center;
  height: calc(80 * var(--formula));
  background-color: var(--color-red);
}

#JK260807Kitty .lp-notice__text {
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: calc(28 * var(--formula));
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: var(--color-white);
  white-space: nowrap;
}

#JK260807Kitty .lp-notice__small {
  font-size: calc(20 * var(--formula));
}

/* =====================================================
   リード文（GY2767-3318）
   ===================================================== */
#JK260807Kitty .lp-lead {
  padding-top: calc(65 * var(--formula));
  text-align: center;
}

#JK260807Kitty .lp-lead__text {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: calc(26 * var(--formula));
  line-height: 2;
  letter-spacing: 0.02em;
  color: var(--color-text);
}

#JK260807Kitty .lp-lead__text--2 {
  margin-top: calc(34 * var(--formula));
}

/* =====================================================
   ルックセクション 共通
   ===================================================== */
#JK260807Kitty .lp-look {
  position: relative;
  /* 子要素の margin が外へ相殺しないようにする（背景の境界をデザイン位置で固定するため） */
  display: flow-root;
  /* デザインのアートボード幅（中央列）で左右のはみ出しを閉じる。縦のはみ出しは残す */
  overflow-x: clip;
}

#JK260807Kitty .lp-look--red1,
#JK260807Kitty .lp-look--red2 {
  background-color: var(--color-red);
}

#JK260807Kitty .lp-look--cream1,
#JK260807Kitty .lp-look--cream2,
#JK260807Kitty .lp-look--cream3,
#JK260807Kitty .lp-look--logo {
  background-color: var(--color-bg);
}

/* 図版・クレジットは背景装飾より前面 */
#JK260807Kitty .lp-look > .lp-figure,
#JK260807Kitty .lp-look > .lp-credit,
#JK260807Kitty .lp-look > .lp-slider,
#JK260807Kitty .lp-look > .lp-logo-kitty {
  position: relative;
  z-index: 1;
}

/* =====================================================
   赤背景セクション ①（GY3889-7469 / h3580）
   ===================================================== */
#JK260807Kitty .lp-look--red1 {
  height: calc(3580 * var(--formula));
  --pin-height: calc(3580 * var(--formula));
  margin-top: calc(581 * var(--formula));
}

/* 白ドット GY4174 x-133 550x550 */
#JK260807Kitty .lp-deco--dots01 {
  left: calc(-133 * var(--formula));
  top: calc(285 * var(--formula));
  width: calc(550 * var(--formula));
}

/* 白ドット GY5944 x84 666x1110 */
#JK260807Kitty .lp-deco--dots02 {
  left: calc(84 * var(--formula));
  top: calc(2055 * var(--formula));
  width: calc(666 * var(--formula));
}

/* look01: GY3455 x45 660x880 r50（赤ブロック上端をまたぐ） */
#JK260807Kitty .lp-figure--look01 {
  width: calc(660 * var(--formula));
  margin-top: calc(-434 * var(--formula));
  margin-left: calc(45 * var(--formula));
}

#JK260807Kitty .lp-figure--look01 img {
  border-radius: calc(60 * var(--formula));
}

#JK260807Kitty .lp-figure__approval--look01 {
  left: calc(184 * var(--formula));
  top: calc(856 * var(--formula));
}

/* look02: GY4455 x155 595x740（異形／CSS mask で形状を再現） */
#JK260807Kitty .lp-figure--look02 {
  width: calc(595 * var(--formula));
  margin-top: calc(120 * var(--formula));
  margin-left: calc(155 * var(--formula));
}

#JK260807Kitty .lp-figure--look02 img {
  -webkit-mask-image: url(../img/look02-mask.png);
  mask-image: url(../img/look02-mask.png);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

#JK260807Kitty .lp-figure--look02 .lp-approval-arc {
  left: calc(13 * var(--formula));
  top: calc(13 * var(--formula));
  width: calc(694 * var(--formula));
  height: calc(714 * var(--formula));
}

#JK260807Kitty .lp-figure--look02 .look02-credit{
  position: absolute;
  left: calc(288 * var(--formula));
  top: calc(605 * var(--formula));
  width: calc(326 * var(--formula));
  height: calc(150 * var(--formula));
}

/* クレジット GY5235 x343（右寄せ 2行） */
#JK260807Kitty .lp-credit--right {
  margin-top: calc(30 * var(--formula));
  margin-right: calc(31 * var(--formula));
  text-align: right;
}

/* スライダー① GY5462 x0 630x840 */
#JK260807Kitty .lp-slider--1 {
  width: calc(630 * var(--formula));
  margin-top: calc(149 * var(--formula));
}

#JK260807Kitty .lp-slider--1 .lp-slider__frame {
  border-radius: 0 calc(60 * var(--formula)) calc(60 * var(--formula)) 0;
}

/* 白フチ GY5462 x-20 650x840 */
#JK260807Kitty .lp-slider__frameline--1 {
  left: calc(-20 * var(--formula));
  top: 0;
  width: calc(650 * var(--formula));
}

#JK260807Kitty .lp-slider__approval--1 {
  left: calc(13 * var(--formula));
  top: calc(808 * var(--formula));
}

/* クレジット GY6342 x30（1行） */
#JK260807Kitty .lp-credit--left {
  margin-top: calc(30 * var(--formula));
  margin-left: calc(30 * var(--formula));
}

/* リボン GY5534 x659 / GY5583 x554 */
#JK260807Kitty .lp-ribbon--b {
  left: calc(659 * var(--formula));
  top: calc(1645 * var(--formula));
  width: calc(68 * var(--formula));
  animation-delay: -0.4s;
}

#JK260807Kitty .lp-ribbon--a {
  left: calc(554 * var(--formula));
  top: calc(1694 * var(--formula));
  width: calc(123 * var(--formula));
  animation-delay: -1.2s;
}

/* look03: GY6526 x210 510x680 r50 */
#JK260807Kitty .lp-figure--look03 {
  width: calc(510 * var(--formula));
  margin-top: calc(150 * var(--formula));
  margin-left: calc(210 * var(--formula));
}

#JK260807Kitty .lp-figure--look03 img {
  border-radius: calc(60 * var(--formula));
}

#JK260807Kitty .lp-figure__approval--look03 {
  left: calc(109 * var(--formula));
  top: calc(656 * var(--formula));
}

/* クレジット GY7246 右端719（1行） */
#JK260807Kitty .lp-credit--right2 {
  margin-top: calc(30 * var(--formula));
  margin-right: calc(31 * var(--formula));
  text-align: right;
}

/* リボン GY7309 x46 */
#JK260807Kitty .lp-ribbon--c {
  left: calc(46 * var(--formula));
  top: calc(3420 * var(--formula));
  width: calc(118 * var(--formula));
  animation-delay: -2.1s;
}

/* =====================================================
   スライダー②（GY7469-8469 / 750x1000）＝ せり上がりで表示
   ===================================================== */
#JK260807Kitty .lp-slider--2 {
  width: calc(750 * var(--formula));
}

#JK260807Kitty .lp-slider__approval--2 {
  left: calc(13 * var(--formula));
  top: calc(976 * var(--formula));
}

/* =====================================================
   クリーム背景セクション ①（GY8469-10814）
   ===================================================== */
#JK260807Kitty .lp-deco--pattern01 {
  left: 0;
  top: 0;
  width: calc(750 * var(--formula));
}

/* クレジット GY8509（中央 2行） */
#JK260807Kitty .lp-credit--center {
  margin-top: calc(30 * var(--formula));
  text-align: center;
}

/* スライダー③ GY8736 x0 600x800 */
#JK260807Kitty .lp-slider--3 {
  width: calc(600 * var(--formula));
  margin-top: calc(149 * var(--formula));
}

#JK260807Kitty .lp-slider--3 .lp-slider__frame {
  border-radius: 0 calc(60 * var(--formula)) calc(60 * var(--formula)) 0;
}

#JK260807Kitty .lp-slider__approval--3 {
  left: calc(13 * var(--formula));
  top: calc(768 * var(--formula));
}

/* クレジット GY9576 x30（2行） */
#JK260807Kitty .lp-credit--left2 {
  margin-top: calc(30 * var(--formula));
  margin-left: calc(30 * var(--formula));
}

/* スライダー④ GY9843 x75 675x900 r(277,0,0,0) */
#JK260807Kitty .lp-slider--4 {
  width: calc(675 * var(--formula));
  margin-top: calc(189 * var(--formula));
  margin-left: calc(75 * var(--formula));
}

#JK260807Kitty .lp-slider--4 .lp-slider__frame {
  border-radius: calc(300 * var(--formula)) 0 0 0;
}

#JK260807Kitty .lp-slider__approval--4 {
  left: calc(13 * var(--formula));
  top: calc(874 * var(--formula));
}

/* クレジット GY10783 右端719（1行） */
#JK260807Kitty .lp-credit--right3 {
  margin-top: calc(30 * var(--formula));
  margin-right: calc(31 * var(--formula));
  text-align: right;
}

/* =====================================================
   横フロー（右から左へループ）共通
   ===================================================== */
#JK260807Kitty .lp-flow {
  position: relative;
  height: calc(860 * var(--formula));
  overflow-x: clip;
}

#JK260807Kitty .lp-flow__viewport {
  position: absolute;
  inset: 0;
  /* overflow:clip 非対応ブラウザでも横スクロールを発生させない（内部に sticky なし） */
  overflow: hidden;
}

#JK260807Kitty .lp-flow__track {
  display: flex;
  align-items: flex-start;
  width: max-content;
  will-change: transform;
  /* animation: lp-flow-scroll 32s linear infinite; */
  animation: 20s linear 0s infinite normal none running lp-flow-scroll;
}

#JK260807Kitty .lp-flow__cell {
  position: relative;
  flex: 0 0 auto;
}

#JK260807Kitty .lp-flow__cell > a {
  display: block;
}

#JK260807Kitty .lp-flow__approval {
  position: absolute;
}

#JK260807Kitty .lp-flow__cell--up .lp-flow__approval {
  left: calc(86 * var(--formula));
  top: calc(586 * var(--formula));
}

#JK260807Kitty .lp-flow__cell--down .lp-flow__approval {
  left: calc(87 * var(--formula));
  top: calc(826 * var(--formula));
}

/* 上段セル: 画像 → クレジット（GY+660） */
#JK260807Kitty .lp-flow__cell--up .lp-credit--flow {
  margin-top: calc(30 * var(--formula));
}

@keyframes lp-flow-scroll {
  from { transform: translateX(var(--flow-offset)); }
  to { transform: translateX(calc(var(--flow-offset) - 50%)); }
}

@media (prefers-reduced-motion: reduce) {
  #JK260807Kitty .lp-flow__track {
    animation: none;
    transform: translateX(var(--flow-offset));
  }
}

/* ▽ 横フロー ①（GY11006-11866 / セル 465＋余白30 = ピッチ495 / 初期 x-352） */
#JK260807Kitty .lp-flow--1 {
  margin-top: calc(189 * var(--formula));
}

#JK260807Kitty .lp-flow--1 .lp-flow__track {
  --flow-offset: calc(-352 * var(--formula));
}

#JK260807Kitty .lp-flow--1 .lp-flow__cell {
  width: calc(465 * var(--formula));
  margin-right: calc(30 * var(--formula));
}

#JK260807Kitty .lp-flow--1 .lp-flow__cell img {
  border-radius: calc(60 * var(--formula));
}

/* 下段セル: クレジット（GY11140 = +134）→ 画像（+240） */
#JK260807Kitty .lp-flow--1 .lp-flow__cell--down {
  padding-top: calc(124 * var(--formula));
}

#JK260807Kitty .lp-flow--1 .lp-flow__cell--down > a {
  margin-top: calc(28 * var(--formula));
}

/* リボン（静止・ゆらぎのみ） */
#JK260807Kitty .lp-ribbon--d {
  /* left: calc(608 * var(--formula)); */
  left: calc(-38 * var(--formula));
  top: calc(73 * var(--formula));
  width: calc(78 * var(--formula));
  animation-delay: -0.7s;
}

#JK260807Kitty .lp-ribbon--e {
  /* left: calc(52 * var(--formula)); */
  left: calc(-90 * var(--formula));
  top: calc(695 * var(--formula));
  width: calc(64 * var(--formula));
  animation-delay: -1.6s;
}

#JK260807Kitty .lp-ribbon--f {
  /* left: calc(98 * var(--formula)); */
  left: calc(-60 * var(--formula));
  top: calc(747 * var(--formula));
  width: calc(103 * var(--formula));
  animation-delay: -2.4s;
}

/* =====================================================
   クリーム背景セクション ②（GY12066-14590）
   ===================================================== */
#JK260807Kitty .lp-look--cream2 {
  margin-top: calc(200 * var(--formula));
}

#JK260807Kitty .lp-deco--pattern02 {
  left: 0;
  top: calc(375 * var(--formula));
  width: calc(750 * var(--formula));
}

/* look04: GY12066 x0 615x820 r(0,50,50,0) */
#JK260807Kitty .lp-figure--look04 {
  width: calc(615 * var(--formula));
}

#JK260807Kitty .lp-figure--look04 img {
  border-radius: 0 calc(60 * var(--formula)) calc(60 * var(--formula)) 0;
}

#JK260807Kitty .lp-figure__approval--look04 {
  left: calc(13 * var(--formula));
  top: calc(796 * var(--formula));
}

/* look05: GY12966 x210 600x450 r(50,0,0,50) */
#JK260807Kitty .lp-figure--look05 {
  width: calc(600 * var(--formula));
  margin-top: calc(80 * var(--formula));
  margin-left: calc(210 * var(--formula));
}

#JK260807Kitty .lp-figure--look05 img {
  border-radius: calc(60 * var(--formula)) 0 0 calc(60 * var(--formula));
}

#JK260807Kitty .lp-figure__approval--look05 {
  right: calc(73 * var(--formula));/* 設計の右端 x737 基準（フォント差で右が切れないように） */
  top: calc(426 * var(--formula));
  text-align: right;
}

/* クレジット GY13456 右端719（1行） */
#JK260807Kitty .lp-credit--right4 {
  margin-top: calc(30 * var(--formula));
  margin-right: calc(31 * var(--formula));
  text-align: right;
}

/* スライダー⑤ GY13639 x45 660x880 r50 */
#JK260807Kitty .lp-slider--5 {
  width: calc(660 * var(--formula));
  margin-top: calc(149 * var(--formula));
  margin-left: calc(45 * var(--formula));
}

#JK260807Kitty .lp-slider--5 .lp-slider__frame {
  border-radius: calc(60 * var(--formula));
}

#JK260807Kitty .lp-slider__approval--5 {
  left: calc(184 * var(--formula));
  top: calc(856 * var(--formula));
}

/* クレジット GY14559（中央 1行） */
#JK260807Kitty .lp-credit--center2 {
  margin-top: calc(30 * var(--formula));
  text-align: center;
}

/* ▽ 横フロー ②（GY14783-15643 / セル 466＋余白29 / 初期 x-353） */
#JK260807Kitty .lp-flow--2 {
  margin-top: calc(190 * var(--formula));
}

#JK260807Kitty .lp-flow--2 .lp-flow__track {
  --flow-offset: calc(-353 * var(--formula));
}

#JK260807Kitty .lp-flow--2 .lp-flow__cell {
  width: calc(466 * var(--formula));
  margin-right: calc(29 * var(--formula));
}

#JK260807Kitty .lp-flow--2 .lp-flow__cell img {
  border-radius: calc(60 * var(--formula));
}

/* 下段セル: クレジット（GY14962 = +179 / 1行）→ 画像（+240） */
#JK260807Kitty .lp-flow--2 .lp-flow__cell--down {
  padding-top: calc(169 * var(--formula));
}

#JK260807Kitty .lp-flow--2 .lp-flow__cell--down > a {
  margin-top: calc(27 * var(--formula));
}

#JK260807Kitty .lp-credit--flow-right {
  text-align: right;
}

#JK260807Kitty .lp-ribbon--g {
  /* left: calc(131 * var(--formula)); */
  left: auto;
  right: calc(-70 * var(--formula));
  top: calc(40 * var(--formula));
  width: calc(63 * var(--formula));
  animation-delay: -0.3s;
}

#JK260807Kitty .lp-ribbon--h {
  /* left: calc(51 * var(--formula)); */
  left: auto;
  right: calc(-40 * var(--formula));
  top: calc(84 * var(--formula));
  width: calc(98 * var(--formula));
  animation-delay: -1.9s;
}

#JK260807Kitty .lp-ribbon--i {
  /* left: calc(565 * var(--formula)); */
  left: auto;
  right: calc(-25 * var(--formula));
  top: calc(748 * var(--formula));
  width: calc(78 * var(--formula));
  animation-delay: -2.7s;
}

/* =====================================================
   ロゴブロック（GY15643-16467 / h824）＝ せり上がりの固定側
   ===================================================== */
#JK260807Kitty .lp-look--logo {
  height: calc(824 * var(--formula));
  --pin-height: calc(824 * var(--formula));
}

#JK260807Kitty .lp-logo-kitty {
  width: calc(370 * var(--formula));
  margin-top: calc(160 * var(--formula));
  margin-left: calc(190 * var(--formula));
}

/* スライダー⑥（GY16467-17467 / 750x1000）＝ せり上がりで表示 */
#JK260807Kitty .lp-slider--6 {
  width: calc(750 * var(--formula));
}

#JK260807Kitty .lp-slider__approval--6 {
  left: calc(229 * var(--formula));
  top: calc(976 * var(--formula));
}

/* =====================================================
   赤背景セクション ②（GY17467-20867 / h3400）
   ===================================================== */
#JK260807Kitty .lp-look--red2 {
  height: calc(3400 * var(--formula));
}

/* 白ドット GY18591 x282 666x1244 */
#JK260807Kitty .lp-deco--dots03 {
  left: calc(282 * var(--formula));
  top: calc(1124 * var(--formula));
  width: calc(666 * var(--formula));
}

/* クレジット GY17507（中央 2行） */
#JK260807Kitty .lp-credit--center3 {
  margin-top: calc(30 * var(--formula));
  text-align: center;
}

/* look06: GY17774 x272 490x500（円） */
/* look07 と 110px 重なる。設計では look06 が前面（intake z: 1047 < 1106）
   ※ .lp-look > .lp-figure の z-index:1 に詳細度で勝つ形で指定する */
#JK260807Kitty .lp-look > .lp-figure--look06 {
  width: calc(490 * var(--formula));
  margin-top: calc(189 * var(--formula));
  margin-left: calc(272 * var(--formula));
  z-index: 2;
}

#JK260807Kitty .lp-figure--look06 img {
  border-radius: 50%;
}

/* 白フチ（円） GY17774 x270 500x500 */
#JK260807Kitty .lp-figure__ring {
  position: absolute;
  left: calc(-2 * var(--formula));
  top: 0;
  width: calc(500 * var(--formula));
  pointer-events: none;
}

#JK260807Kitty .lp-approval-arc--look06 {
  left: calc(11 * var(--formula));
  top: calc(13 * var(--formula));
  width: calc(474 * var(--formula));
  height: calc(474 * var(--formula));
}

#JK260807Kitty .lp-figure--look06 .look06-credit{
  position: absolute;
  left: calc(205 * var(--formula));
  top: calc(368 * var(--formula));
  width: calc(244 * var(--formula));
  height: calc(118 * var(--formula));
  border-radius: 0;
}

/* リボン GY17823 x263 */
#JK260807Kitty .lp-ribbon--j {
  left: calc(263 * var(--formula));
  top: calc(356 * var(--formula));
  width: calc(118 * var(--formula));
  animation-delay: -1.1s;
}

/* look07: GY18164 x0 630x840 r(0,53,53,0)（look06 と重なる） */
#JK260807Kitty .lp-figure--look07 {
  width: calc(630 * var(--formula));
  margin-top: calc(-110 * var(--formula));
}

#JK260807Kitty .lp-figure--look07 img {
  border-radius: 0 calc(60 * var(--formula)) calc(60 * var(--formula)) 0;
}

#JK260807Kitty .lp-figure__approval--look07 {
  left: calc(13 * var(--formula));
  top: calc(816 * var(--formula));
}

/* 小さな © GY18333 x413（9.4px・look07 内） */
#JK260807Kitty .lp-figure__approval--look07s {
  left: calc(413 * var(--formula));
  top: calc(169 * var(--formula));
  font-size: calc(9.4 * var(--formula));
}

/* クレジット GY19044 x30（1行） */
#JK260807Kitty .lp-credit--left3 {
  margin-top: calc(30 * var(--formula));
  margin-left: calc(30 * var(--formula));
}

/* look08: GY19267 x30 690x920（アーチ） */
#JK260807Kitty .lp-figure--look08 {
  width: calc(690 * var(--formula));
  margin-top: calc(189 * var(--formula));
  margin-left: calc(30 * var(--formula));
}

#JK260807Kitty .lp-figure--look08 img {
  border-radius: calc(345 * var(--formula)) calc(345 * var(--formula)) 0 0;
}

#JK260807Kitty .lp-figure__approval--look08 {
  left: calc(196 * var(--formula));
  top: calc(896 * var(--formula));
}

/* look09: GY20347 x150 600x800 r(50,0,0,50)（赤ブロック下端をまたぐ） */
#JK260807Kitty .lp-figure--look09 {
  width: calc(600 * var(--formula));
  margin-top: calc(160 * var(--formula));
  margin-left: calc(150 * var(--formula));
}

#JK260807Kitty .lp-figure--look09 img {
  border-radius: calc(60 * var(--formula)) 0 0 calc(60 * var(--formula));
}

/* 白フチ GY20347 x150 640x800 */
#JK260807Kitty .lp-figure__frameline {
  position: absolute;
  left: 0;
  top: 0;
  width: calc(640 * var(--formula));
  pointer-events: none;
}

#JK260807Kitty .lp-figure__approval--look09 {
  right: calc(13 * var(--formula));/* 設計の右端 x737 基準（フォント差で右が切れないように） */
  top: calc(768 * var(--formula));
  text-align: right;
}

/* リボン GY20920 x40 / GY20979 x90 */
#JK260807Kitty .lp-ribbon--k {
  left: calc(40 * var(--formula));
  top: calc(3453 * var(--formula));
  width: calc(68 * var(--formula));
  animation-delay: -0.9s;
}

#JK260807Kitty .lp-ribbon--l {
  left: calc(90 * var(--formula));
  top: calc(3512 * var(--formula));
  width: calc(123 * var(--formula));
  animation-delay: -2.2s;
}

/* =====================================================
   クリーム背景セクション ③ ＋ CHECK ALL ITEMS（GY20867-23277）
   ===================================================== */
#JK260807Kitty .lp-look--cream3 {
  padding-bottom: calc(132 * var(--formula));
}

/* クレジット GY21187 x379（右寄せ 2行） */
#JK260807Kitty .lp-credit--right5 {
  margin-top: calc(310 * var(--formula));
  margin-right: calc(31 * var(--formula));
  text-align: right;
}

/* スライダー⑦ GY21413 x0 645x860 r(0,53,53,0) */
#JK260807Kitty .lp-slider--7 {
  width: calc(645 * var(--formula));
  margin-top: calc(148 * var(--formula));
}

#JK260807Kitty .lp-slider--7 .lp-slider__frame {
  border-radius: 0 calc(60 * var(--formula)) calc(60 * var(--formula)) 0;
}

#JK260807Kitty .lp-slider__approval--7 {
  left: calc(13 * var(--formula));
  top: calc(836 * var(--formula));
}

/* クレジット GY22313 x30（2行） */
#JK260807Kitty .lp-credit--left4 {
  margin-top: calc(30 * var(--formula));
  margin-left: calc(30 * var(--formula));
}

/* CHECK ALL ITEMS GY22560 x100 550x550 */
#JK260807Kitty .lp-cta {
  position: relative;
  z-index: 1;
  width: calc(550 * var(--formula));
  margin-top: calc(166 * var(--formula));
  margin-left: calc(100 * var(--formula));
}

#JK260807Kitty .lp-cta__link {
  display: block;
}

/* 最後の © GY23117（22px・赤） */
#JK260807Kitty .lp-approval--footer {
  position: relative;
  z-index: 1;
  margin-top: calc(2 * var(--formula));
  font-size: calc(22 * var(--formula));
  text-align: center;
  color: var(--color-red-text);
}
