@charset "UTF-8";
/* ============================================================
  THE NEW BASIC — THE SWEAT WEAR (26aw_wear_sweat)【デザインあり】
  スコープ .LS_swwear ／ randr実測基準（docs/randr-reference.md）／ナイロンLP(26aw_wear_ny)と同系デザイン・重なる動きなし（依頼表R11）
  流体スケール: calc(N * var(--u))  N=375アートボードのデザインpx
  指定色: タイトル・ボタン #000022（依頼表 タイトルカラー/ボタンカラー）— 価格下線にも限定使用
  PC: 2分割（左=KV+タイトル sticky／右=LP本体）※依頼表「PCは２分割の右側LPのデザイン」
============================================================ */
.LS_swwear *, .LS_swwear *::before, .LS_swwear *::after { box-sizing: border-box; }
.LS_swwear {
  --key: #000022;
  --color-white: #fff;
  --color-text: #38383B;
  --font-century: "century-gothic", "Alte Haas Grotesk", "Helvetica Neue", sans-serif;
  --font-en: "avenir-lt-pro", "Alte Haas Grotesk", "Helvetica Neue", sans-serif;
  --font-ja: "hiragino-kaku-gothic-pron", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
  --fw-light: 300; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --pc-width: 1600; --pc-artboard-width: 500; --sp-width: 375;
  --u: calc(var(--variable) * var(--ratio));
  font-family: var(--font-ja);
  text-align: left; /* 本番Theme/base.cssのtext-align:justify継承を遮断（字間が不自然に広がるため） */
  font-feature-settings: "palt";
  color: var(--color-text);
  background-color: var(--color-white);
  overflow: clip;
  -webkit-font-smoothing: antialiased;
}
/*@media (min-width: 1600px) { .LS_swwear { --ratio: calc(var(--pc-artboard-width) / var(--sp-width)); --variable: 1px; } }*/
/*@media (min-width: 1600px) { .LS_swwear { --ratio: calc(var(--pc-artboard-width) / var(--sp-width)); --variable: calc(100vw / var(--pc-width)); } }*/
@media (min-width: 1600px) { .LS_swwear { --ratio: calc(var(--pc-artboard-width) / var(--sp-width)); --variable: calc(100vw / var(--pc-width)); } }
@media (min-width: 768px) and (max-width: 1600px) { .LS_swwear { --ratio: calc(var(--pc-artboard-width) / var(--sp-width)); --variable: calc(100vw / var(--pc-width)); } }
@media (max-width: 767px) { .LS_swwear { --ratio: 1; --variable: calc(100vw / var(--sp-width)); } }
.LS_swwear img, .LS_swwear picture { display: block; width: 100%; height: auto; vertical-align: bottom; } /* KVは<picture>でSP=800×1000(4:5)/PC=1500×2000(3:4)を切替・比率は原画像どおり */
.LS_swwear a { color: inherit; text-decoration: none; }
.LS_swwear a:hover { opacity: .6; transition: opacity .3s; }
.LS_swwear h1, .LS_swwear h2, .LS_swwear p, .LS_swwear ul, .LS_swwear figure { margin: 0; padding: 0; }
.LS_swwear ul { list-style: none; }
.LS_swwear section { position: relative; }
.LS_swwear .u-en { font-family: var(--font-en); }
.LS_swwear .lp_inner { width: calc(335 * var(--u)); margin-left: auto; margin-right: auto; }
.LS_swwear [id] { scroll-margin-top: var(--header-full-height, 178px); }

/* ============================================================
  骨格 — SP: 縦一列 ／ PC: 2分割（左 sticky・右はアートボード幅を中央固定）
  † 右カラムの内容幅を calc(375*--u) に固定し、テキスト(335u)と画像(375u)の
    比率をrandrの中央カラム構造と一致させる
============================================================ */
.LS_swwear .sw_body { width: calc(375 * var(--u)); margin: 0 auto; padding-bottom: calc(115 * var(--u)); }
@media (min-width: 768px) {
  .LS_swwear { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; --ny-reserved: calc(345 * var(--u)); }
  .LS_swwear .sw_head, .LS_swwear .sw_body { min-width: 0; max-width: 100%; }
  /* 左カラム拡大(1.3倍)は本番ナイロンLP最終版に合わせて不採用 — 左右同スケール */
  .LS_swwear .sw_head { position: sticky; top: var(--header-full-height, 178px); height: calc(100vh - var(--header-full-height, 178px)); display: flex; align-items: center; justify-content: center; overflow: hidden; } /* transformはレイアウト高さを変えないため autoだと内部スクロールが出る。JS等比縮小で必ず収まる前提のhidden */
  .LS_swwear .sw_head__inner { width: calc(335 * var(--u)); }
  /* KVはデザイン比率固定。低背画面は sw_head__inner 全体をJSで等比スケール（構図不変） */
  .LS_swwear .sw_kv { width: calc(270 * var(--u)); margin: 0 auto; }
  .LS_swwear .sw_head__inner { transform-origin: 50% 50%; }
}
@media (max-width: 767px) { .LS_swwear .sw_kv { width: 100%; } }

/* ============================================================
  リード — THE NEW BASIC（#000022）+ 和文リード + CTA
============================================================ */
.LS_swwear .sw_lead { text-align: center; }
.LS_swwear .sw_lead__title { margin-top: calc(37 * var(--u)); font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(40 * var(--u)); line-height: 1; letter-spacing: .02em; color: var(--key); }
.LS_swwear .sw_lead__en { font-size: calc(12 * var(--u)); letter-spacing: .06em; font-weight: var(--fw-semibold); } /* リード1行目「THE NEW BASIC — THE SWEAT WEAR」（指示書テキスト原文どおり） */
.LS_swwear .sw_lead__ja { margin-top: calc(30 * var(--u)); font-size: calc(13 * var(--u)); line-height: 2.3076923077; letter-spacing: .05em; font-weight: var(--fw-light); font-feature-settings: normal; }

/* CTA — 幅335/padding11/16semibold、リード直後35・上60<下90 */
.LS_swwear .c-btn { width: calc(335 * var(--u)); margin: calc(60 * var(--u)) auto 0; background-color: var(--key); color: var(--color-white); font-size: calc(16 * var(--u)); line-height: 2.125; letter-spacing: .1em; font-weight: var(--fw-semibold); }
.LS_swwear .c-btn > a { display: flex; justify-content: center; align-items: center; width: 100%; padding: calc(11 * var(--u)) 0; white-space: nowrap; }
.LS_swwear .sw_lead__ja + .c-btn { margin-top: calc(35 * var(--u)); }

/* ============================================================
  アイテムセクション — 左寄せ太め見出し + 機能アイコン（指示）
============================================================ */
.LS_swwear .sw_item { margin-top: calc(100 * var(--u)); }
.LS_swwear .sw_item__no { font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(16 * var(--u)); line-height: 1; letter-spacing: .1em; color: var(--key); }
.LS_swwear .sw_item__title { margin-top: calc(10 * var(--u)); font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(25 * var(--u)); line-height: 1.36; letter-spacing: .06em; text-align: left; }
.LS_swwear .sw_item__title-ja { display: block; margin-top: calc(6 * var(--u)); font-family: var(--font-ja); font-size: calc(13 * var(--u)); line-height: 1.8; letter-spacing: .1em; font-weight: var(--fw-semibold); }
.LS_swwear .sw_item__main { margin-top: calc(30 * var(--u)); }
.LS_swwear .sw_item__main a { display: block; }
/* コンセプト — 生地寄り画像 + 「nyc Sweat Series」（左寄せ太字・依頼表指示）+ 段落間は原文の空行を再現 */
.LS_swwear .sw_concept { margin-top: calc(100 * var(--u)); }
@media (min-width: 768px) { .LS_swwear .sw_concept { margin-top: calc(60 * var(--u)); } }
.LS_swwear .sw_concept__text { margin-top: calc(37 * var(--u)); text-align: left; }
.LS_swwear .sw_concept__title { font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(25 * var(--u)); line-height: 1.36; letter-spacing: .06em; }
.LS_swwear .sw_concept__lead { margin-top: calc(18 * var(--u)); font-size: calc(13 * var(--u)); line-height: 2.3076923077; letter-spacing: .05em; font-weight: var(--fw-light); font-feature-settings: normal; }
.LS_swwear .sw_concept__lead + .sw_concept__lead { margin-top: calc(0 * var(--u)); }
.LS_swwear .sw_style a { display: block; }
/* 機能紹介スライダー（お戻し0904: 既存の切替写真をスライド化・●〇ドット＋＜＞矢印で複数枚を可視化） */
.LS_swwear .sw_feature .swiper { position: relative; width: 100%; }
.LS_swwear .sw_feature .swiper-slide { width: 100%; }
.LS_swwear .sw_feature__frame { margin: 0; }
.LS_swwear .sw_feature__frame figcaption { width: calc(335 * var(--u)); margin: calc(14 * var(--u)) auto 0; font-size: calc(12 * var(--u)); line-height: 2; letter-spacing: .05em; font-weight: var(--fw-light); text-align: center; }
.LS_swwear .sw_feature .swiper-pagination { position: absolute; left: 0; right: 0; top: calc(448 * var(--u)); bottom: auto; z-index: 2; display: flex; justify-content: center; column-gap: calc(9 * var(--u)); }
.LS_swwear .sw_feature .swiper-pagination-bullet { display: block; width: calc(8 * var(--u)); height: calc(8 * var(--u)); margin: 0; border-radius: 50%; border: 1px solid var(--key); background: var(--color-white); opacity: 1; }
.LS_swwear .sw_feature .swiper-pagination-bullet-active { background: var(--key); }
.LS_swwear .sw_slider__nav { position: absolute; top: calc(234 * var(--u)); transform: translateY(-50%); z-index: 2; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border: 0; padding: 0; background: rgba(255, 255, 255, .85); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.LS_swwear .sw_slider__nav::before { content: ""; width: calc(10 * var(--u)); height: calc(10 * var(--u)); border-top: 1px solid var(--key); border-right: 1px solid var(--key); }
.LS_swwear .sw_slider__nav.-prev { left: 0; }
.LS_swwear .sw_slider__nav.-prev::before { transform: rotate(-135deg); margin-left: calc(4 * var(--u)); }
.LS_swwear .sw_slider__nav.-next { right: 0; }
.LS_swwear .sw_slider__nav.-next::before { transform: rotate(45deg); margin-right: calc(4 * var(--u)); }
.LS_swwear .sw_slider__nav:hover { opacity: .6; }
.LS_swwear .sw_feature .swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
.LS_swwear .sw_feature .swiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 100%; scroll-snap-align: start; }
.LS_swwear .sw_feature .swiper:not(.swiper-initialized) .sw_slider__nav, .LS_swwear .sw_feature .swiper:not(.swiper-initialized) .swiper-pagination { display: none; }

/* クレジット（商品名14/.15em・価格18 century+2px下線） */
.LS_swwear .sw_credit { margin-top: calc(37 * var(--u)); text-align: left; }
.LS_swwear .sw_credit__date { font-size: calc(13 * var(--u)); line-height: 1.8; letter-spacing: .06em; font-weight: var(--fw-semibold); }
.LS_swwear .sw_credit__name { font-size: calc(14 * var(--u)); line-height: 1.86; letter-spacing: .15em; font-weight: var(--fw-semibold); }
.LS_swwear .sw_credit__name span { display: block; font-size: calc(12 * var(--u)); letter-spacing: .1em; font-weight: var(--fw-regular); }
.LS_swwear .sw_credit__size { margin-top: calc(8 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.6; letter-spacing: .1em; font-weight: var(--fw-medium); }
.LS_swwear .sw_credit__price { display: inline-block; margin-top: calc(8 * var(--u)); font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(18 * var(--u)); line-height: 1.33; letter-spacing: .05em; border-bottom: 2px solid var(--key); padding-bottom: calc(2 * var(--u)); }
.LS_swwear .sw_credit__lead { margin-top: calc(18 * var(--u)); font-size: calc(13 * var(--u)); line-height: 2.3076923077; letter-spacing: .05em; font-weight: var(--fw-light); font-feature-settings: normal; }

.LS_swwear .sw_feature { margin-top: calc(37 * var(--u)); }

/* ============================================================
  物画像スライド — カラー展開カード（2枚並び+次がのぞく46%・ループ）
============================================================ */
.LS_swwear .sw_colors { margin-top: calc(75 * var(--u)); overflow: hidden; max-width: 100%; }
.LS_swwear .sw_colors .swiper-slide { width: 46%; margin-right: calc(10 * var(--u)); }
.LS_swwear .sw_colors .swiper-slide a { display: block; }
.LS_swwear .sw_colors .swiper-slide .sw_colors__card { display: block; } /* 10/7発売前＝リンクなしカード */
.LS_swwear .sw_colors .sw_colors__date { margin-top: calc(10 * var(--u)); font-size: calc(11 * var(--u)); line-height: 1.6; letter-spacing: .05em; font-weight: var(--fw-semibold); }
.LS_swwear .sw_colors .sw_colors__name { margin-top: calc(10 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.6; letter-spacing: .1em; font-weight: var(--fw-semibold); }
.LS_swwear .sw_colors .sw_colors__date + .sw_colors__name { margin-top: calc(2 * var(--u)); }
.LS_swwear .sw_colors .sw_colors__name span { display: block; font-size: calc(10 * var(--u)); letter-spacing: .06em; font-weight: var(--fw-regular); }
.LS_swwear .sw_colors .sw_colors__color { margin-top: calc(6 * var(--u)); font-size: calc(11 * var(--u)); letter-spacing: .1em; font-weight: var(--fw-medium); }
.LS_swwear .sw_colors .sw_colors__price { display: inline-block; margin-top: calc(4 * var(--u)); font-family: var(--font-century); font-weight: var(--fw-bold); font-size: calc(14 * var(--u)); line-height: 1.33; letter-spacing: .05em; border-bottom: 2px solid var(--key); padding-bottom: calc(1 * var(--u)); }
.LS_swwear .sw_colors .swiper { width: calc(375 * var(--u)); margin-left: auto; margin-right: auto; }
.LS_swwear .sw_colors .swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
.LS_swwear .sw_colors .swiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 46%; scroll-snap-align: start; }

/* スタイリング画像 */
.LS_swwear .sw_style { margin-top: calc(50 * var(--u)); }

/* 末尾CTA（上75・下90の非対称で次セクションと分離） */
.LS_swwear .sw_foot { margin-top: calc(75 * var(--u)); }
.LS_swwear .sw_foot .c-btn { margin-top: 0; }


/* ============================================================
  スクロールフェード（0.8s / 50px rise / rootMargin -30%）
============================================================ */
.LS_swwear .js-fade { opacity: 0; transform: translateY(calc(50 * var(--u))); transition: opacity .8s cubic-bezier(.42,0,.58,1), transform .8s cubic-bezier(.42,0,.58,1); }
.LS_swwear .js-fade.is-shown { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .LS_swwear .js-fade { opacity: 1; transform: none; transition: none; }
  .LS_swwear .sw_head { position: static; height: auto; }
}

/* 本番 #Wrap/#Contents/.main-area のoverflow上書き（sticky左カラム不発火の真因対策） */
#Wrap, #Contents, .main-area { overflow: clip !important; overflow-x: clip !important; }
/* lazy画像のロード完了フェード（ブロックfade後に読み込まれた画像がポップインするのを防ぐ。JSがクラス付与） */
.LS_swwear img.is-lazyfade { opacity: 0; }
.LS_swwear img.is-lazyfade.is-lazydone { opacity: 1; transition: opacity .8s ease; }

/* スライド可視化 — 全幅スクロールバー（ドラッグ可・スライドと左端揃え） */
.LS_swwear .sw_colors .swiper { position: relative; padding-bottom: calc(28 * var(--u)); }
.LS_swwear .sw_colors .swiper-scrollbar { position: absolute; left: 0; right: 0; bottom: calc(6 * var(--u)); height: 2px; background: #E2E2E6; }
.LS_swwear .sw_colors .swiper-scrollbar-drag { height: 100%; border-radius: 0; background: var(--key); cursor: grab; }

/* SP: カラーカードのスワイパー左右余白（本番ナイロンLP最終版準拠） */
@media (max-width: 767px) { .LS_swwear .sw_colors .swiper { padding: 0 calc(20 * var(--u)) calc(28 * var(--u)) calc(20 * var(--u)); } }

/* 価格（税込・下線）にも商品リンク — 見た目は従来どおり */
.LS_swwear .sw_credit__price a { color: inherit; text-decoration: none; }

@media (min-width: 768px) {
  .LS_swwear .sw_head { transition: top 0.5s, height 0.5s; height: auto; }
  .LS_swwear.scroll-up .sw_head { top: 0; }
  .LS_swwear .sw_lead__title { margin-top: calc(20 * var(--u)); font-size: calc(26 * var(--u)); }
  .LS_swwear .sw_lead__ja { margin-top: calc(10 * var(--u)); font-size: calc(10 * var(--u)); }
  .LS_swwear .sw_head .c-btn { margin-bottom: calc(115 * var(--u)); }
  .LS_swwear .sw_lead__ja + .c-btn { margin-top: calc(20 * var(--u)); }
}
