:root{
    --paper:#F7F4EF;
    --ink:#211C18;
    --leather:#6B3A26;
    --leather-deep:#3E2317;
    --line:#DED7CC;
    --muted:#8B8175;
    --surface:#FFFFFF;
    --tag-bg:#EFE9DF;
  }
  :root[data-theme="dark"]{
    --paper:#0B0A08;
    --ink:#EDE6DB;
    --leather:#C99568;
    --leather-deep:#050403;
    --line:rgba(255,255,255,.14);
    --muted:#9C9188;
    --surface:#0B0A08;
    --tag-bg:rgba(255,255,255,.05);
  }

  *{ box-sizing:border-box; }

  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",sans-serif;
    -webkit-font-smoothing:antialiased;
    line-height:1.75;
    font-size:15px;
  }

  h1,h2,h3,.serif{
    font-family:"Shippori Mincho",serif;
    text-wrap:balance;
    font-weight:500;
  }

  .eyebrow{
    font-family:"Zen Kaku Gothic New",sans-serif;
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--muted);
  }

  a{ color:inherit; }
  summary{ cursor:pointer; }
  summary::-webkit-details-marker{ display:none; }

  .wrap{ max-width:1000px; margin:0 auto; padding:0 200px; text-align:center; }

  a:focus-visible, button:focus-visible, summary:focus-visible{
    outline:2px solid var(--leather);
    outline-offset:2px;
  }

  /* ---------- Site header (mock) ---------- */
  .site-header{
    position:sticky; top:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between;
    padding:24px max(200px, calc((100% - 800px) / 2));
    background:var(--paper);
    border-bottom:1px solid var(--line);
  }
  .logo{ font-family:"Shippori Mincho",serif; font-size:19px; letter-spacing:.12em; }
  .site-nav{ display:flex; gap:32px; font-size:12px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
  .site-nav span{ white-space:nowrap; }

  /* ---------- Section scaffolding ---------- */
  section{ position:relative; }
  .section-inner{ padding:110px 0; border-bottom:1px solid var(--line); }
  .section-inner.tight{ padding:80px 0; }
  section:last-of-type .section-inner{ border-bottom:none; }

  h2.section-title{
    font-size:15px; letter-spacing:.14em; text-transform:uppercase;
    font-family:"Zen Kaku Gothic New",sans-serif; font-weight:700;
    color:var(--leather); margin:0 0 10px;
  }
  h2.section-jp{ font-size:26px; margin:0 0 44px; }

  /* ---------- KV ---------- */
  .kv{
    position:relative; min-height:760px;
    display:flex; align-items:flex-end;
    color:#F3EBE0;
    overflow:hidden;
    border-bottom:1px solid var(--line);
  }
  .kv::before{
    content:"";
    position:absolute; inset:0; z-index:1;
    background:linear-gradient(180deg, rgba(38,20,11,.25) 0%, rgba(26,14,8,.40) 50%, rgba(14,8,4,.62) 100%);
    pointer-events:none;
  }
  /* 背景：3段の画像帯（同方向・同速度）・すき間は白 */
  .kv-bg-rows{
    position:absolute; inset:0;
    display:flex; flex-direction:column; gap:40px;
    padding:40px 0;
    background:#FFFFFF;
  }
  .kv-bg-track{
    --kv-speed:220s; /* 一周の時間（大きいほどゆっくり） */
    flex:1; min-height:0;
    display:flex; width:max-content;
    animation: kvScroll var(--kv-speed) linear infinite;
  }
  /* 2段目：画像半分ぶんずらす（1段15枚×2 → 半枚 = 一周の1/30） */
  .kv-bg-track:nth-child(2){ animation-delay:calc(var(--kv-speed) / -30); }
  .kv-bg-group{ display:flex; gap:40px; padding-right:40px; height:100%; }
  /* Pick Up Brands の商品画像を横に流す */
  .kv-bg-img{
    height:100%; aspect-ratio:6/7; flex:none;
    background-color:#FFFFFF;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }
  @keyframes kvScroll{
    from{ transform:translateX(0); }
    to{ transform:translateX(-50%); }
  }
  @media (prefers-reduced-motion: reduce){
    .kv-bg-track{ animation:none; }
  }
  .kv-placeholder-tag{
    position:absolute; top:20px; right:20px; z-index:2;
    font-family:monospace; font-size:10px; letter-spacing:.05em;
    color:rgba(243,235,224,.55);
    border:1px dashed rgba(243,235,224,.4);
    padding:4px 8px; border-radius:4px;
  }
  .kv-content{ position:relative; z-index:2; padding:0 200px 76px; max-width:1200px; margin:0 auto; width:100%; text-align:center; }
  .kv .eyebrow{ color:#D9BFA8; margin-bottom:18px; }
  .kv h1{ font-size:clamp(28px,4.5vw,46px); line-height:1.35; margin:0 0 14px; }
  .kv .period{ font-size:13px; letter-spacing:.04em; color:#E6D6C6; margin:0 0 22px; font-variant-numeric: tabular-nums; }
  .scale-badge{
    display:inline-flex; align-items:center; gap:10px;
    border:1px solid rgba(243,235,224,.4);
    border-radius:999px;
    padding:8px 18px;
    font-size:12.5px; letter-spacing:.04em;
    margin-bottom:28px;
    font-variant-numeric: tabular-nums;
  }
  .scale-badge b{ color:#F3EBE0; font-family:"Shippori Mincho",serif; font-size:14px; }
  .cta{
    display:inline-flex; align-items:center; gap:10px;
    background:transparent; color:var(--ink);
    border:1.5px solid var(--ink);
    padding:13px 28px; border-radius:999px;
    font-size:13px; letter-spacing:.04em; text-decoration:none;
    transition:background-color .2s ease, color .2s ease;
  }
  .cta:hover{ background:var(--ink); color:var(--paper); }
  .cta::after{ content:"→"; }
  .cta.solid-dark{ background:transparent; color:var(--ink); border:1.5px solid var(--ink); }

  /* ---------- Intro ---------- */
  .intro-lead{ max-width:1000px; font-size:15px; color:var(--ink); margin:0 auto; }
  .intro-lead p + p{ margin-top:1.2em; }
  .intro-lead .lede{ font-family:"Shippori Mincho",serif; font-size:20px; margin-bottom:.6em; }

  /* ---------- Scale section (品揃えスケール訴求) ---------- */
  .scale-section{ border-top:1px solid var(--line); color:var(--ink); }
  .scale-section .section-title{ color:var(--leather); }
  .scale-numbers{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; margin-bottom:48px; }
  .scale-numbers .stat{
    display:flex; align-items:center; gap:16px;
    border:1px solid var(--line);
    background:var(--tag-bg);
    border-radius:14px;
    padding:16px 26px;
  }
  .scale-numbers .stat .n{
    font-family:"Shippori Mincho",serif; font-size:32px; line-height:1;
    font-variant-numeric: tabular-nums;
    color:var(--ink);
  }
  .scale-numbers .stat .n .plus{ font-size:.5em; }
  .scale-numbers .stat .label{ font-size:11px; letter-spacing:.05em; color:var(--muted); line-height:1.5; }
  .scale-lead{ max-width:620px; font-size:14px; color:var(--muted); margin:0 auto 36px; }
  .scale-subhead{ font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--leather); margin:0 0 20px; }
  .mosaic-grid{
    display:grid; grid-template-columns:repeat(5,1fr); gap:24px; margin-bottom:40px;
  }
  .mosaic-tile{
    display:flex; flex-direction:column;
    background:var(--tag-bg);
    border:1px solid var(--line);
    border-radius:2px;
    padding:14px 14px 22px;
    text-decoration:none; color:inherit;
    transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease;
  }
  .mosaic-tile:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 16px rgba(33,28,24,.10);
  }
  .mosaic-img{
    aspect-ratio:4/5; position:relative;
    background:
      repeating-linear-gradient(45deg, rgba(33,28,24,.06) 0 8px, transparent 8px 16px),
      rgba(33,28,24,.03);
    border-radius:0;
    overflow:hidden;
  }
  .mosaic-img[class*="lp-"]{ transition:transform .5s cubic-bezier(.22,1,.36,1); }
  .mosaic-tile:hover .mosaic-img[class*="lp-"]{ transform:scale(1.03); }
  .mosaic-name{
    margin-top:16px;
    font-size:12px; letter-spacing:.07em; text-transform:uppercase;
    color:var(--ink); font-weight:700;
    transition:color .35s ease;
  }
  .mosaic-tile:hover .mosaic-name{ color:var(--leather); }
  .mosaic-tile.featured .mosaic-name{ font-weight:700; }
  .mosaic-img[class*="lp-"]{
    background-color:#FFFFFF;
    background-repeat:no-repeat;
    background-size:88%;
    background-position:center 28%;
  }
  .lp-01{ background-image:url("../images/lineup-01.jpg"); }
  .lp-02{ background-image:url("../images/lineup-02.jpg"); }
  .lp-03{ background-image:url("../images/lineup-03.jpg"); }
  .lp-04{ background-image:url("../images/lineup-04.jpg"); }
  .lp-05{ background-image:url("../images/lineup-05.jpg"); }
  .lp-06{ background-image:url("../images/lineup-06.jpg"); }
  .lp-07{ background-image:url("../images/lineup-07.jpg"); }
  .lp-08{ background-image:url("../images/lineup-08.jpg"); }
  .lp-09{ background-image:url("../images/lineup-09.jpg"); }
  /* Pick Up Brands：商品ページの画像を直接表示 */
  .mosaic-img.photo{
    aspect-ratio:6/7;
    background-color:#FFFFFF;
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
    transition:transform .5s cubic-bezier(.22,1,.36,1);
  }
  .mosaic-tile:hover .mosaic-img.photo{ transform:scale(1.03); }
  .mosaic-caption{ font-size:12px; color:#C9B6A5; margin:0 0 40px; }
  .ticker-lead{ font-size:12px; color:var(--muted); margin:0 0 14px; }
  .ticker-wrap{
    overflow:hidden;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .ticker-track{
    display:flex; flex:none; white-space:nowrap;
    animation:scaleTicker 100s linear infinite;
    padding:14px 0;
    width:max-content;
  }
  .ticker-wrap:hover .ticker-track,
  .ticker-wrap:focus-within .ticker-track{ animation-play-state:paused; }
  .ticker-group{ display:contents; }
  .ticker-track span{
    font-family:"Shippori Mincho",serif; font-size:14px; color:var(--ink);
    padding:0 20px; border-right:1px solid var(--line);
  }
  @keyframes scaleTicker{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
  @media (prefers-reduced-motion: reduce){
    .ticker-track{ animation:none; }
    .ticker-wrap{
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      scrollbar-width:thin;
    }
  }
  .scale-cta{ margin-top:56px; text-align:center; }
  @media (max-width:860px){ .mosaic-grid{ grid-template-columns:repeat(3,1fr); } }

  /* ---------- Featured brand cards ---------- */
  .featured-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px;
  }
  .featured-card{ border-top:1px solid var(--line); }
  .featured-card .thumb{
    aspect-ratio:4/5;
    background:
      repeating-linear-gradient(45deg, var(--tag-bg) 0 10px, transparent 10px 20px),
      var(--surface);
    border-bottom:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    font-family:monospace; font-size:10px; color:var(--muted); text-align:center; padding:8px;
  }
  .thumb.featured-img-emmeti{ background-image:url("../images/featured-emmeti.jpg"); background-size:cover; background-position:center; }
  .thumb.featured-img-jamesgrose{ background-image:url("../images/featured-jamesgrose.jpg"); background-size:cover; background-position:center; }
  .thumb.featured-img-schott{ background-image:url("../images/featured-schott.jpg"); background-size:cover; background-position:center; }
  .thumb.featured-img-graphpaper{ background-image:url("../images/featured-graphpaper.jpg"); background-size:cover; background-position:center; }
  .thumb.featured-img-ssstein{ background-image:url("../images/featured-ssstein.jpg"); background-size:cover; background-position:center; }
  .thumb.featured-img-cinquanta{ background-image:url("../images/featured-cinquanta.jpg"); background-size:cover; background-position:center; }
  .featured-card .body{ padding:24px 20px 28px; }
  .featured-card h3{ font-size:17px; margin:0 0 8px; }
  .featured-card p{ font-size:13px; color:var(--muted); margin:0; }

  /* ---------- Guide ---------- */
  .guide-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px; }
  .tinted-section{ background:var(--tag-bg); }
  .leather-card{ border-top:1px solid var(--line); padding:34px 4px 0; }
  .swatch{ height:180px; border-radius:2px; margin-bottom:16px; background-size:cover; background-position:center; background-color:#6B4E3D; }
  .swatch.lamb{ background-image:url("../images/leather-lamb.jpg"); }
  .swatch.cow{ background-image:url("../images/leather-cow.jpg"); }
  .swatch.horse{ background-image:url("../images/leather-horse.jpg"); }
  .swatch.suede{ background-image:url("../images/leather-suede.jpg"); }
  .swatch.sheep{ background-image:url("../images/leather-sheep.jpg"); }
  .swatch.goat{ background-image:url("../images/leather-goat.jpg"); }
  .leather-card h3{ font-size:15px; margin:0 0 6px; }
  .leather-card .tag{ font-size:11px; color:var(--leather); letter-spacing:.04em; margin-bottom:10px; display:block; }
  .leather-card p{ font-size:13px; color:var(--muted); margin:0; }

  /* ---------- Styling ---------- */
  .styling-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px 24px; margin-top:48px; }
  .styling-card .thumb{ aspect-ratio:3/4; background:linear-gradient(150deg,#C9BBA8,#8A7A66); margin-bottom:18px; position:relative; }
  .styling-card .thumb span{ position:absolute; inset:auto 10px 10px auto; font-family:monospace; font-size:9px; color:#fff; opacity:.75; }
  .thumb.staff-img-1{ background-image:url("../images/staff-1.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-2{ background-image:url("../images/staff-2.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-3{ background-image:url("../images/staff-3.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-4{ background-image:url("../images/staff-4.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-5{ background-image:url("../images/staff-5.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-6{ background-image:url("../images/staff-6.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-7{ background-image:url("../images/staff-7.jpg"); background-size:cover; background-position:top center; }
  .thumb.staff-img-8{ background-image:url("../images/staff-8.jpg"); background-size:cover; background-position:top center; }
  .styling-card{ text-align:left; }
  .styling-card .staff{ font-size:12px; color:var(--leather); margin-bottom:6px; }
  .styling-card .jacket-brand{ font-size:11.5px; color:var(--leather); margin-bottom:6px; }
  .styling-card p{ font-size:13px; margin:0; color:var(--muted); }

  /* ---------- Styling videos (YouTube) ---------- */
  .video-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
  .video-card{ display:block; text-decoration:none; color:var(--ink); }
  .video-thumb{
    aspect-ratio:16/9; position:relative;
    background:repeating-linear-gradient(45deg, var(--tag-bg) 0 10px, transparent 10px 20px), var(--surface);
    border:1px solid var(--line); margin-bottom:10px;
    display:flex; align-items:center; justify-content:center;
  }
  .video-thumb .play{
    width:34px; height:34px; border-radius:50%; background:rgba(33,28,24,.78); color:#fff;
    display:flex; align-items:center; justify-content:center; font-size:12px; padding-left:2px; flex:none;
    transition:transform .2s ease;
  }
  .video-card:hover .video-thumb .play{ transform:scale(1.08); }
  .video-img-1{ background-image:url("https://i.ytimg.com/vi/BF_y4WMmPEI/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-img-2{ background-image:url("https://i.ytimg.com/vi/Z_-VzsWtjc8/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-img-3{ background-image:url("https://i.ytimg.com/vi/554Y92jW1FM/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-img-4{ background-image:url("https://i.ytimg.com/vi/nDeOIZMGviA/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-img-5{ background-image:url("https://i.ytimg.com/vi/bKP1GycFyCw/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-img-6{ background-image:url("https://i.ytimg.com/vi/Jr3tlfmLnxo/hqdefault.jpg"); background-size:cover; background-position:center; }
  .video-card p{
    font-size:12px; color:var(--muted); margin:0; line-height:1.5;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* ---------- レザージャケットMarket イベント告知 ---------- */
  .market-promo{
    border:1px solid var(--leather); background:var(--tag-bg);
    padding:56px 48px; text-align:center;
  }
  .market-tag{
    display:inline-block; font-size:11px; letter-spacing:.12em; color:var(--leather);
    border:1px solid var(--leather); padding:4px 12px; margin-bottom:20px;
  }
  .market-promo h2{ font-size:22px; margin:0 0 14px; }
  .market-date{ font-size:12.5px; color:var(--leather); margin:0 0 20px; font-variant-numeric:tabular-nums; }
  .market-promo .desc{ max-width:520px; margin:0 auto 34px; color:var(--muted); font-size:13px; }

  /* ---------- Footer CTA ---------- */
  .footer-cta{ text-align:center; border-top:1px solid var(--line); color:var(--ink); }
  .footer-cta h2{ font-size:22px; margin:0 0 18px; }
  .footer-cta p{ color:var(--muted); font-size:13px; margin:0 0 32px; }
  .footer-cta .cta{ background:transparent; color:var(--ink); border-color:var(--ink); }
  .footer-links{ display:flex; gap:24px; justify-content:center; margin-top:40px; font-size:12px; color:#C9B6A5; }
  .footer-links a{ text-decoration:underline; text-underline-offset:3px; }

  .site-footer{ padding:28px 200px; text-align:center; font-size:11px; color:#C9B6A5; letter-spacing:.04em; background:var(--leather-deep); }

  @media (max-width:860px){
    .site-header{ flex-direction:column; align-items:flex-start; gap:10px; padding:16px 28px; }
    .site-nav{ flex-wrap:wrap; gap:14px 20px; }
    .guide-grid, .styling-grid, .featured-grid{ grid-template-columns:1fr; }
    .video-grid{ grid-template-columns:repeat(2,1fr); }
    .market-promo{ padding:32px 24px; }
    .wrap{ padding:0 28px; }
    .kv-content{ padding:0 28px 48px; }
    .scale-numbers{ gap:12px; }
  }

/* =====================================================================
   BEAMS特集ページ風テーマ（形・構成を参考に、色は低彩度に置き換え）
   丸みのあるパネルの重なり／吹き出しラベル／幾何学系英字（Jost）／
   写真の丸・アーチ切り抜き／ステッカー風ボタン
   ※ この下のブロックを消すと元のデザインに戻ります
   ===================================================================== */
:root{
  --sand:#E6D8C3;       /* 帯色1：サンド */
  --sand-soft:#F4EDE2;  /* カード地 */
  --sage:#CFD5C6;       /* 帯色2：セージ */
  --blush:#EADCD2;      /* 帯色3：ブラッシュ */
  --camel:#A87C52;      /* アクセント：キャメル */
  --dark:#2A2420;
  --panel-r:36px;
  --en:"Jost","Futura","Century Gothic",sans-serif;
}

body{ letter-spacing:.05em; line-height:1.95; background:#fff; }
h1,h2,h3,.serif{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:500; letter-spacing:.08em; }

/* ---- 幅：本文エリアを広げる ---- */
.wrap{ max-width:1080px; padding:0 40px; }
.site-header{ padding:22px max(40px, calc((100% - 1000px) / 2)); border-bottom:none; }
.logo{ font-family:var(--en); font-weight:600; letter-spacing:.14em; }
.site-nav{ font-family:var(--en); font-weight:500; color:var(--ink); }
.kv-content{ padding:0 40px 96px; }

/* ---- パネルの重なり（上角を丸めて前のセクションに少し被せる） ---- */
main > section:not(:first-child){
  position:relative;
  margin-top:calc(var(--panel-r) * -1);
  border-radius:var(--panel-r) var(--panel-r) 0 0;
  background:#fff;
  --pill:var(--sand);
}
main > section.band-sand{ background:var(--sand); --pill:#fff; }
main > section.band-blush{ background:var(--blush); --pill:#fff; }
main > section.band-dark{ background:var(--dark); --pill:var(--camel); }
.tinted-section{ background:#fff; }
.section-inner{ border-bottom:none; padding:120px 0 140px; }
.section-inner.tight{ padding:96px 0 120px; }
.scale-section, .footer-cta{ border-top:none; }
.kv{ border-bottom:none; }

/* ---- 見出し：吹き出しラベル＋大きな和文 ---- */
h2.section-title{
  position:relative; display:inline-block;
  font-family:var(--en); font-weight:500; font-size:13px; letter-spacing:.1em;
  color:var(--ink); background:var(--pill);
  padding:5px 18px; border-radius:999px; margin:0 0 24px;
}
h2.section-title::after{
  content:""; position:absolute; left:50%; bottom:-6px; transform:translateX(-50%);
  border-left:6px solid transparent; border-right:6px solid transparent;
  border-top:7px solid var(--pill);
}
h2.section-jp{ font-size:clamp(22px,2.6vw,30px); letter-spacing:.12em; margin:0 0 48px; }
.eyebrow, .scale-subhead, .ticker-lead{ font-family:var(--en); font-weight:500; }
.scale-subhead{ color:var(--ink); }

/* ---- ボタン：ステッカー風 ---- */
.cta, .cta.solid-dark, .footer-cta .cta{
  background:#fff; color:var(--ink);
  border:1.5px solid var(--ink);
  box-shadow:0 4px 0 var(--ink);
  padding:14px 34px; font-weight:500; letter-spacing:.08em;
  transition:transform .15s ease, box-shadow .15s ease;
}
.cta:hover{ background:#fff; color:var(--ink); transform:translateY(3px); box-shadow:0 1px 0 var(--ink); }
.cta::after{ content:"→"; font-family:var(--en); }

/* ---- KV ---- */
.kv .eyebrow{ font-size:12px; letter-spacing:.2em; color:#fff; }
.kv h1{ font-weight:700; letter-spacing:.14em; }
.scale-badge{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5); }

/* ---- Intro ---- */
.intro-lead{ max-width:720px; }
.intro-lead .lede{ font-family:"Zen Kaku Gothic New",sans-serif; font-weight:500; font-size:20px; line-height:2.1; }

/* ---- Pick Up Brands ---- */
.mosaic-grid{ gap:20px; }
.mosaic-tile{
  background:var(--sand-soft); border:none; border-radius:22px;
  padding:12px 12px 18px;
}
.mosaic-tile:hover{ transform:translateY(-4px); box-shadow:0 10px 20px rgba(42,36,32,.10); }
.mosaic-img, .mosaic-img.photo{ border-radius:16px; }
.mosaic-name{ font-family:var(--en); font-weight:600; font-size:13px; letter-spacing:.06em; margin-top:14px; }
.mosaic-tile:hover .mosaic-name{ color:var(--camel); }

/* ---- 注目アイテム：アーチ型の写真 ---- */
.featured-grid{ gap:40px 28px; }
.featured-card{ border-top:none; text-align:center; }
.featured-card .thumb{ border-bottom:none; border-radius:999px 999px 24px 24px; }
.featured-card .body{ padding:22px 8px 0; }
.featured-card h3{ font-family:var(--en); font-weight:600; font-size:20px; letter-spacing:.06em; }
.featured-card p{ color:var(--ink); opacity:.75; }

/* ---- 選び方ガイド：丸いスウォッチ ---- */
.leather-card{
  border-top:none; background:var(--sand-soft); border-radius:28px;
  padding:36px 26px 34px; text-align:center;
}
.swatch{ width:150px; height:150px; border-radius:50%; margin:0 auto 22px; }
.leather-card .tag{
  display:inline-block; font-family:var(--en); font-weight:500; font-size:11px;
  color:var(--ink); background:#fff; padding:3px 12px; border-radius:999px; margin-bottom:14px;
}
.leather-card h3{ font-size:16px; margin-bottom:10px; }
.leather-card p{ text-align:left; }

/* ---- スタッフスタイリング ---- */
.styling-card .thumb{ border-radius:24px; }
.styling-card .staff{ font-family:var(--en); font-weight:500; color:var(--ink); }
.styling-card .jacket-brand{ color:var(--camel); }
.styling-card p{ color:var(--ink); opacity:.8; }

/* ---- 動画 ---- */
.video-grid{ gap:28px 20px; }
.video-thumb{ border:none; border-radius:18px; overflow:hidden; }
.video-thumb .play{ width:46px; height:46px; background:#fff; color:var(--ink); font-size:14px; box-shadow:0 3px 0 var(--ink); }
.video-card p{ color:var(--ink); opacity:.8; margin-top:4px; }

/* ---- イベント告知 ---- */
.market-promo{ border:none; background:#fff; border-radius:32px; }
.market-tag{ font-family:var(--en); font-weight:500; border:none; background:var(--blush); border-radius:999px; padding:4px 16px; color:var(--ink); }
.market-date{ color:var(--camel); }

/* ---- フッターCTA（ダーク） ---- */
.footer-cta{ color:#F3EBE0; }
.footer-cta p{ color:#D9C7B3; }
.footer-cta h2.section-title{ color:#fff; }
.footer-links{ color:#D9C7B3; }
.site-footer{ background:var(--dark); padding:28px 40px 40px; }

@media (max-width:860px){
  :root{ --panel-r:24px; }
  .wrap{ padding:0 20px; }
  .site-header{ padding:14px 20px; }
  .kv-content{ padding:0 20px 64px; }
  .section-inner{ padding:84px 0 100px; }
  .section-inner.tight{ padding:72px 0 90px; }
  .mosaic-grid{ gap:12px; }
  .featured-card .thumb{ max-width:360px; margin:0 auto; }
}

/* ---- 写真の角：すべて直角に（カード・パネル・ボタンの丸みはそのまま） ---- */
.mosaic-img, .mosaic-img.photo,
.featured-card .thumb,
.swatch,
.styling-card .thumb,
.video-thumb{ border-radius:0; }


/* =====================================================================
   バインダー風タブ（The Lineup〜Watch & Style）
   ・右端のタブをクリックでその項目へ移動
   ・スクロールに合わせて表示中の項目のタブに自動で切り替わり、
     パネルの色もタブの色に変わる
   ===================================================================== */
.binder-section{ padding:110px 0 150px; }
.binder{
  --tab-w:50px;
  max-width:1160px; margin:0 auto; padding:0 40px;
  display:grid; grid-template-columns:minmax(0,1fr) var(--tab-w);
  align-items:start;
}
/* 各タブの色（パネル色／文字色） */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#6F7457; --fg:#F4EFE6; }
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#55231A; --fg:#F4EFE6; }
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#8C8A86; --fg:#FFFFFF; }
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#D9CEBD; --fg:#2A2420; }
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#7A3A26; --fg:#F4EFE6; }

.binder-panel{
  position:relative; z-index:1;
  background:var(--c,#6F7457); color:var(--fg,#F4EFE6);
  border-radius:14px 0 14px 14px;
  transition:background-color .6s ease, color .6s ease;
  --pill:rgba(255,255,255,.92);
}
.binder-page{ scroll-margin-top:calc(var(--header-h,70px) + 24px); }
.binder-page .section-inner{ padding-top:96px; padding-bottom:104px; }
.binder-page + .binder-page .section-inner{ border-top:1px solid color-mix(in srgb, currentColor 22%, transparent); }
.binder-page .wrap{ padding-left:56px; padding-right:56px; }
.binder-panel h2.section-title{ color:#2A2420; }
.binder-panel .scale-lead,
.binder-panel .scale-subhead,
.binder-panel .featured-card p,
.binder-panel .styling-card p,
.binder-panel .styling-card .staff,
.binder-panel .video-card,
.binder-panel .video-card p{ color:inherit; }
.binder-panel .scale-lead{ opacity:.85; }
.binder-panel .styling-card .jacket-brand{ color:inherit; opacity:.7; }
.binder-panel .tinted-section{ background:transparent; }
/* 表示中でない項目は少し沈める */
.binder-page{ transition:opacity .6s ease; }
.binder-page:not(.is-active){ opacity:.55; }

/* タブ */
.binder-tabs{
  position:sticky; top:calc(var(--header-h,70px) + 40px);
  display:flex; flex-direction:column; gap:6px;
  margin-top:40px;
}
.binder-tab{
  appearance:none; border:none; cursor:pointer;
  writing-mode:vertical-rl;
  min-height:150px; width:calc(var(--tab-w) - 8px);
  padding:18px 0;
  background:var(--c); color:var(--fg);
  border-radius:0 10px 10px 0;
  font-family:var(--en); font-size:15px; font-weight:500; letter-spacing:.06em;
  text-align:center;
  opacity:.8;
  transition:width .3s ease, opacity .3s ease;
}
.binder-tab:hover{ opacity:1; }
.binder-tab.is-active{ width:var(--tab-w); opacity:1; }
.binder-tab:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }

@media (max-width:860px){
  .binder-section{ padding:72px 0 100px; }
  .binder{ display:flex; flex-direction:column-reverse; padding:0 12px; }
  .binder-panel{ border-radius:0 0 14px 14px; }
  .binder-page .wrap{ padding-left:18px; padding-right:18px; }
  .binder-page .section-inner{ padding-top:64px; padding-bottom:72px; }
  .binder-page{ scroll-margin-top:calc(var(--header-h,70px) + 64px); }
  .binder-tabs{
    top:var(--header-h,70px); z-index:5;
    flex-direction:row; gap:4px; margin:0;
    overflow-x:auto; scrollbar-width:none;
    background:#fff; padding-top:8px;
  }
  .binder-tabs::-webkit-scrollbar{ display:none; }
  .binder-tab{
    writing-mode:horizontal-tb; min-height:0; width:auto; flex:none;
    padding:10px 16px; font-size:13px; border-radius:10px 10px 0 0;
    white-space:nowrap;
  }
  .binder-tab.is-active{ width:auto; padding-top:14px; }
}
/* 明るいカードの上の文字は常に墨色に */
.binder-panel .mosaic-tile,
.binder-panel .leather-card{ color:var(--ink); }

/* =====================================================================
   大人っぽさの調整（可愛い印象を抑える）
   ・和文見出しは明朝、英字見出しはセリフ（Cormorant Garamond）
   ・字間を詰めて落ち着かせる
   ・角丸はごく小さく（2〜4px）、吹き出し・ステッカー影は廃止
   ※ このブロックを消すと直前のデザインに戻ります
   ===================================================================== */
:root{
  --serif-en:"Cormorant Garamond","Times New Roman",serif;
  --serif-jp:"Shippori Mincho","Hiragino Mincho ProN",serif;
  --panel-r:4px;
  --r:2px;
}
body{ letter-spacing:.02em; line-height:1.9; }

/* 見出し */
h1,h2,h3,.serif{ font-family:var(--serif-jp); font-weight:500; letter-spacing:.04em; }
h2.section-jp{ font-size:clamp(22px,2.4vw,28px); letter-spacing:.06em; }
.kv h1{ font-family:var(--serif-jp); font-weight:500; letter-spacing:.08em; }
.intro-lead .lede{ font-family:var(--serif-jp); letter-spacing:.04em; }

/* 英字ラベル：吹き出しをやめ、細い罫線付きの小さな大文字に */
h2.section-title{
  background:none; padding:0; border-radius:0;
  font-family:var(--en); font-weight:500; font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:inherit; opacity:.8;
  display:inline-flex; align-items:center; gap:14px;
}
h2.section-title::after{ display:none; }
h2.section-title::before,
h2.section-title::after{ content:""; display:block; position:static; transform:none; width:28px; height:0; border:none; border-top:1px solid currentColor; }
.binder-panel h2.section-title{ color:inherit; }
.eyebrow, .scale-subhead, .ticker-lead{ letter-spacing:.24em; font-size:11px; }
.kv .eyebrow{ letter-spacing:.3em; }

/* ブランド名などの英字見出しはセリフで */
.featured-card h3{ font-family:var(--serif-en); font-weight:500; font-size:24px; letter-spacing:.02em; }
.mosaic-name{ font-family:var(--en); font-weight:500; font-size:11px; letter-spacing:.16em; }
.logo{ letter-spacing:.2em; font-weight:500; }
.site-nav{ font-size:11px; letter-spacing:.18em; }

/* パネル・カードの角をほぼ直角に */
main > section:not(:first-child){ border-radius:0; margin-top:0; }
.mosaic-tile{ border-radius:var(--r); padding:10px 10px 16px; }
.mosaic-tile:hover{ transform:none; box-shadow:none; }
.mosaic-tile:hover .mosaic-img.photo{ transform:scale(1.02); }
.mosaic-img, .mosaic-img.photo{ overflow:hidden; }
.leather-card{ border-radius:var(--r); }
.leather-card .tag{ background:none; padding:0; border-radius:0; letter-spacing:.14em; color:var(--camel); }
.market-promo{ border-radius:var(--r); }
.market-tag{ border-radius:0; background:none; border:1px solid currentColor; padding:3px 12px; letter-spacing:.2em; }
.scale-badge{ border-radius:var(--r); }

/* ボタン：ステッカー影をやめ、細い罫線の長方形に */
.cta, .cta.solid-dark, .footer-cta .cta{
  border-radius:var(--r);
  border:1px solid var(--ink);
  box-shadow:none;
  padding:15px 40px;
  font-size:12px; letter-spacing:.16em;
  transition:background-color .25s ease, color .25s ease;
}
.cta:hover{ transform:none; box-shadow:none; background:var(--ink); color:#fff; }
.kv .cta{ background:transparent; color:#fff; border-color:rgba(255,255,255,.85); }
.kv .cta:hover{ background:#fff; color:var(--ink); }
.band-dark .cta{ background:transparent; color:#F3EBE0; border-color:rgba(243,235,224,.7); }
.band-dark .cta:hover{ background:#F3EBE0; color:var(--dark); }
.video-thumb .play{ box-shadow:none; }

/* バインダー・タブ */
.binder-panel{ border-radius:var(--panel-r) 0 var(--panel-r) var(--panel-r); }
.binder-tab{ border-radius:0 4px 4px 0; font-size:12px; letter-spacing:.2em; text-transform:uppercase; }

@media (max-width:860px){
  :root{ --panel-r:4px; }
  .binder-panel{ border-radius:0 0 var(--panel-r) var(--panel-r); }
  .binder-tab{ border-radius:4px 4px 0 0; font-size:11px; letter-spacing:.14em; }
}

/* =====================================================================
   バインダーのタブを「上」に配置／白い余白をなくして横幅いっぱいに
   ===================================================================== */
main > section.binder-section{ background:var(--sand); padding:0; }
.binder{
  display:flex; flex-direction:column; align-items:stretch;
  max-width:none; margin:0; padding:0;
}
.binder-page .wrap{ margin-left:auto; margin-right:auto; }
.binder-tabs{
  order:-1;
  position:sticky; top:var(--header-h,70px); z-index:5;
  flex-direction:row; align-items:flex-end; gap:8px;
  margin:0;
  padding:28px max(40px, calc((100% - 1000px) / 2)) 0;
  overflow-x:auto; scrollbar-width:none;
  background:var(--sand);
  transition:background-color .6s ease;
}
.binder-tabs::-webkit-scrollbar{ display:none; }
/* スクロールで上に張り付いたら、帯の色を表示中のパネル色に */
.binder-tabs, .binder-tabs.is-stuck{ background:#E4D9C5; } /* タブ列の背景：常にベージュ */
.binder-tab{
  writing-mode:horizontal-tb;
  min-height:0; width:auto; flex:none;
  padding:10px 20px;
  border-radius:6px 6px 0 0;
  white-space:nowrap;
}
.binder-tab.is-active{ width:auto; padding-top:14px; }
.binder-panel{ border-radius:48px 48px 0 0; }
.binder-page .wrap{ max-width:1080px; }

@media (max-width:860px){
  .binder{ flex-direction:column; padding:0; }
  .binder-tabs{ padding:16px 16px 0; gap:4px; }
  .binder-tab{ padding:9px 14px; border-radius:6px 6px 0 0; }
  .binder-tab.is-active{ padding-top:12px; }
  .binder-panel{ border-radius:24px 24px 0 0; }
}

/* タブで移動したとき、タブの下にパネルの余白が見える位置で止める
   （見出しの上の余白96pxのうち40pxをタブの裏に隠し、56pxを見せる） */
.binder-page{ scroll-margin-top:calc(var(--header-h,70px) + var(--tabs-h,80px) - 40px); }
@media (max-width:860px){
  /* スマホ：見出しの上の余白64pxのうち24pxを見せる */
  .binder-page{ scroll-margin-top:calc(var(--header-h,70px) + var(--tabs-h,60px) - 40px); }
}


/* =====================================================================
   バインダー：画面の高さに収め、パネル内（赤枠の範囲）だけをスクロール
   ===================================================================== */
main > section.binder-section{
  height:calc(100vh - var(--header-h,70px));
  height:calc(100dvh - var(--header-h,70px));
  min-height:560px;
}
.binder{ height:100%; }
.binder-tabs{ position:relative; top:auto; flex:none; }
.binder-panel{
  flex:1; min-height:0;
  display:flex; flex-direction:column;
}
.binder-scroll{
  position:relative;
  flex:1; min-height:0;
  width:min(1080px, calc(100% - 48px));
  margin:72px auto 0;
  overflow-y:auto; overscroll-behavior:auto;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, currentColor 35%, transparent) transparent;
}
.binder-scroll:focus-visible{ outline:1px solid color-mix(in srgb, currentColor 50%, transparent); outline-offset:4px; }
.binder-scroll::-webkit-scrollbar{ width:6px; }
.binder-scroll::-webkit-scrollbar-thumb{ background:color-mix(in srgb, currentColor 35%, transparent); border-radius:3px; }
.binder-page{ scroll-margin-top:0; }
.binder-page .wrap{ max-width:none; padding-left:32px; padding-right:32px; }
.binder-page .section-inner{ padding-top:0; padding-bottom:96px; }
.binder-page + .binder-page .section-inner{ padding-top:88px; }
/* 最後の項目は、最後までスクロールしたときに見出しが上に来るよう下に余白 */
.binder-page:last-child .section-inner{ padding-bottom:max(96px, 40vh); }

@media (max-width:860px){
  main > section.binder-section{ min-height:480px; }
  .binder-scroll{ width:calc(100% - 16px); margin-top:32px; }
  .binder-page .wrap{ padding-left:10px; padding-right:10px; }
  .binder-page .section-inner{ padding-bottom:64px; }
  .binder-page + .binder-page .section-inner{ padding-top:64px; }
}


/* バインダーを画面に固定（タブ・パネル上部の角丸は常に表示）
   ページのスクロール量ぶんだけセクションの高さをJSで確保し、中身だけを動かす */
main > section.binder-section{ height:auto; min-height:0; }
.binder{
  position:sticky; top:var(--header-h,70px);
  height:calc(100vh - var(--header-h,70px));
  height:calc(100dvh - var(--header-h,70px));
  min-height:480px;
}
.binder-scroll{ overflow:hidden; }

/* スクロール範囲（赤枠）：パネルの横幅いっぱい／上端は少しぼかして切れ目を目立たせない */
.binder-scroll{
  width:100%; margin:72px 0 0; padding-top:32px;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 32px);
          mask-image:linear-gradient(to bottom, transparent 0, #000 32px);
}
.binder-page .wrap{ max-width:1080px; margin-left:auto; margin-right:auto; }
@media (max-width:860px){
  .binder-scroll{ width:100%; margin-top:24px; padding-top:24px;
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 24px);
            mask-image:linear-gradient(to bottom, transparent 0, #000 24px); }
}
/* 上端のぼかしは使わない（境目はくっきり） */
.binder-scroll{ -webkit-mask-image:none; mask-image:none; }
/* PC：固定されたときの余白（タブの上 約88px／パネル上端〜見出しラベル 約96px） */
@media (min-width:861px){
  .binder-tabs{ padding-top:88px; }
  .binder-scroll{ margin-top:56px; }
}

/* ---- Introduction 下の「スクロール」誘導 ---- */
.scroll-cue{
  display:inline-flex; flex-direction:column; align-items:center; gap:14px;
  margin-top:72px; text-decoration:none; color:var(--ink);
}
.scroll-cue__label{
  font-family:var(--en); font-weight:500; font-size:11px; letter-spacing:.28em;
  padding-left:.28em; opacity:.75;
}
.scroll-cue__line{
  position:relative; display:block; width:1px; height:72px; overflow:hidden;
  background:color-mix(in srgb, var(--ink) 18%, transparent);
}
.scroll-cue__line::after{
  content:""; position:absolute; left:0; top:0; width:1px; height:100%;
  background:var(--ink);
  animation:scrollCue 2.2s cubic-bezier(.65,0,.35,1) infinite;
}
@keyframes scrollCue{
  0%  { transform:translateY(-100%); }
  55% { transform:translateY(0); }
  100%{ transform:translateY(100%); }
}
.scroll-cue:hover .scroll-cue__label{ opacity:1; }
@media (prefers-reduced-motion: reduce){
  .scroll-cue__line::after{ animation:none; transform:none; }
}
@media (max-width:860px){
  .scroll-cue{ margin-top:48px; }
  .scroll-cue__line{ height:56px; }
}
.binder-section{ scroll-margin-top:var(--header-h,70px); }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
/* PC：タブを中央揃えに */
@media (min-width:861px){
  .binder-tabs{ justify-content:center; padding-left:40px; padding-right:40px; }
}
/* Introduction とタブの列の背景色をそろえる（#E4D9C5） */
:root{ --sand:#E4D9C5; }
/* PC：タブをひと回り大きく */
@media (min-width:861px){
  .binder-tabs{ gap:10px; }
  .binder-tab{ font-size:14px; padding:16px 34px; border-radius:8px 8px 0 0; }
  .binder-tab.is-active{ padding-top:22px; }
}
@media (min-width:861px){ .binder-tabs{ justify-content:safe center; } }
@media (min-width:861px) and (max-width:1180px){
  .binder-tabs{ gap:6px; padding-left:20px; padding-right:20px; }
  .binder-tab{ font-size:12.5px; padding:14px 20px; }
  .binder-tab.is-active{ padding-top:19px; }
}

/* タブの色（添付のチャコール／トープ／ウォームグレー系で5色） */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#252625; --fg:#EDE8DF; } /* チャコール */
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#897A67; --fg:#F6F2EB; } /* トープ */
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#62605B; --fg:#F1EEE8; } /* ウォームグレー */
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#4E4238; --fg:#EFE8DE; } /* ダークブラウン */
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#A9A092; --fg:#252625; } /* グレージュ */

/* タブ切り替えを“ヌルッと”：高さ・色・パネル色をゆっくり滑らかに変化 */
:root{ --ease-smooth:cubic-bezier(.22,1,.36,1); }
.binder-tab{
  transition:
    padding .7s var(--ease-smooth),
    background-color .7s var(--ease-smooth),
    color .7s var(--ease-smooth),
    opacity .5s var(--ease-smooth);
  will-change:padding;
}
.binder-panel{
  transition:background-color .9s cubic-bezier(.45,0,.2,1), color .9s cubic-bezier(.45,0,.2,1);
}
.binder-page{ transition:opacity .9s var(--ease-smooth); }
@media (prefers-reduced-motion: reduce){
  .binder-tab, .binder-panel, .binder-page{ transition:none; }
}

/* How to Choose：革の写真をカード幅いっぱい（内側12px）の横長に */
.leather-card{ padding:12px 12px 36px; }
.leather-card .swatch{
  width:100%; height:auto; aspect-ratio:14/9;
  margin:0 0 26px; border-radius:0;
}
.leather-card h3{ margin:0 22px 12px; }
.leather-card p{ margin:0 22px; }
@media (max-width:860px){
  .leather-card{ padding:10px 10px 28px; }
  .leather-card h3{ margin:0 14px 10px; }
  .leather-card p{ margin:0 14px; }
}

/* =====================================================================
   フォントを明朝体に統一（和文：Shippori Mincho／英字：Cormorant Garamond）
   ※ このブロックを消すと直前のフォントに戻ります
   ===================================================================== */
:root{
  --mincho:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --en:"Cormorant Garamond","Shippori Mincho","Times New Roman",serif;
}
body, button, input{ font-family:var(--mincho); letter-spacing:.04em; }
h1,h2,h3,.serif,
.intro-lead, .intro-lead .lede,
.scale-lead, .featured-card p, .leather-card p, .styling-card p,
.video-card p, .market-promo .desc, .footer-cta p, .footer-links,
.scale-badge, .site-footer{ font-family:var(--mincho); }

/* 英字（ラベル・ナビ・タブ・ボタン・ブランド名）はセリフ体に */
.logo, .site-nav, .eyebrow, h2.section-title, .scale-subhead, .ticker-lead,
.mosaic-name, .binder-tab, .market-tag, .leather-card .tag,
.styling-card .staff, .styling-card .jacket-brand, .cta, .scroll-cue__label,
.featured-card h3{ font-family:var(--en); }

/* セリフ体は小さいと細く見えるので、少し大きく・やや太めに */
.logo{ font-size:22px; font-weight:600; letter-spacing:.14em; }
.site-nav{ font-size:13px; font-weight:600; letter-spacing:.14em; }
h2.section-title{ font-size:14px; font-weight:600; letter-spacing:.22em; }
.eyebrow, .scale-subhead{ font-size:13px; font-weight:600; letter-spacing:.22em; }
.mosaic-name{ font-size:13.5px; font-weight:600; letter-spacing:.12em; }
.leather-card .tag{ font-size:12.5px; font-weight:600; letter-spacing:.12em; }
.styling-card .staff{ font-size:13px; font-weight:600; }
.styling-card .jacket-brand{ font-size:12.5px; font-weight:500; }
.cta{ font-size:14px; font-weight:600; letter-spacing:.14em; }
.market-tag{ font-size:12.5px; font-weight:600; }
.scroll-cue__label{ font-size:13px; font-weight:600; }
.featured-card h3{ font-size:26px; font-weight:500; }
.binder-tab{ font-weight:600; letter-spacing:.16em; }
@media (min-width:861px){ .binder-tab{ font-size:16px; } }
@media (min-width:861px) and (max-width:1180px){ .binder-tab{ font-size:14px; } }
@media (max-width:860px){ .binder-tab{ font-size:12.5px; } }

/* 注目アイテムの写真（2026AW 撮影カット） */
.thumb.featured-img-emmeti{ background-image:url("../images/featured-emmeti-2026aw.jpg"); }
.thumb.featured-img-jamesgrose{ background-image:url("../images/featured-jamesgrose-2026aw.jpg"); }
.thumb.featured-img-schott{ background-image:url("../images/featured-schott-2026aw.jpg"); }
.thumb.featured-img-ssstein{ background-image:url("../images/featured-ssstein-2026aw.jpg"); }
.thumb.featured-img-graphpaper{ background-image:url("../images/featured-graphpaper-2026aw.jpg"); }
.thumb.featured-img-cinquanta{ background-image:url("../images/featured-cinquanta-2026aw.jpg"); }
.featured-card .thumb[class*="featured-img-"]{ background-size:cover; background-position:center; background-color:#5E5D5E; }

/* =====================================================================
   “かっこいい”リデザイン：ダーク＆エッジ（レザージャケットの世界観）
   ・黒〜墨のダークトーン／生成りの文字／差し色はコニャック（革色）
   ・角丸は基本0、細い罫線で締める
   ・英字は細身のコンデンス体（Oswald）を大文字で、和文は明朝
   ※ このブロックを消すと直前のデザインに戻ります
   ===================================================================== */
:root{
  --paper:#0E0D0C;          /* ページ地（ほぼ黒） */
  --ink:#ECE6DC;            /* 文字（生成り） */
  --muted:#9A9186;
  --line:rgba(236,230,220,.16);
  --surface:#161412;
  --tag-bg:#161412;
  --leather:#A8764E;        /* 差し色：コニャック */
  --camel:#A8764E;
  --sand:#141210;           /* 帯色も暗く */
  --sand-soft:#1B1917;
  --blush:#181614;
  --dark:#0A0908;
  --en:"Oswald","Helvetica Neue",Arial,sans-serif;
  --panel-r:0px; --r:0px;
}
html, body{ background:var(--paper); color:var(--ink); }
body{ letter-spacing:.04em; }
::selection{ background:var(--leather); color:#0E0D0C; }

/* 英字：コンデンス体の大文字 */
.logo, .site-nav, .eyebrow, h2.section-title, .scale-subhead, .ticker-lead,
.mosaic-name, .binder-tab, .market-tag, .leather-card .tag,
.styling-card .staff, .styling-card .jacket-brand, .cta, .scroll-cue__label,
.featured-card h3{ font-family:var(--en); text-transform:uppercase; }
.logo{ font-weight:500; font-size:22px; letter-spacing:.32em; }
.site-nav{ font-weight:400; font-size:12.5px; letter-spacing:.24em; color:var(--muted); }
.site-nav span:hover{ color:var(--ink); }

/* ヘッダー */
.site-header{ background:rgba(14,13,12,.92); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }

/* セクション */
main > section:not(:first-child){ background:var(--paper); border-radius:0; }
main > section.band-sand{ background:var(--paper); }
main > section.band-blush{ background:#121110; }
main > section.band-dark{ background:var(--dark); border-top:1px solid var(--line); }

/* 見出し：英字ラベルは線付きの細いコンデンス、和文は大きく明朝 */
h2.section-title{
  font-weight:400; font-size:13px; letter-spacing:.42em; opacity:1; color:var(--leather);
}
h2.section-title::before, h2.section-title::after{ width:40px; border-top-color:currentColor; opacity:.6; }
h2.section-jp{ font-weight:500; font-size:clamp(24px,2.8vw,34px); letter-spacing:.1em; color:var(--ink); }
.eyebrow{ font-weight:400; font-size:13px; letter-spacing:.42em; }
.scale-subhead{ font-weight:400; font-size:12px; letter-spacing:.42em; color:var(--muted); }

/* ボタン：角ばったアウトライン → ホバーで反転 */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta, .kv .cta{
  background:transparent; color:var(--ink);
  border:1px solid rgba(236,230,220,.7); border-radius:0; box-shadow:none;
  font-weight:400; font-size:13px; letter-spacing:.3em;
  padding:17px 46px;
}
.cta:hover, .band-dark .cta:hover, .kv .cta:hover{ background:var(--ink); color:#0E0D0C; border-color:var(--ink); }
.cta::after{ content:"—"; margin-left:6px; font-family:var(--en); letter-spacing:0; }

/* KV：背景の帯のすき間も黒に、文字の下を少し暗く */
.kv-bg-rows{ background:#0E0D0C; }
.kv-bg-img{ background-color:#1B1917; filter:grayscale(.15) contrast(1.05); }
.kv::before{ background:linear-gradient(180deg, rgba(14,13,12,.35) 0%, rgba(14,13,12,.55) 55%, rgba(14,13,12,.88) 100%); }
.kv .eyebrow{ color:var(--leather); }
.kv h1{ font-weight:500; letter-spacing:.16em; color:#F3EEE6; }
.scale-badge{ border-radius:0; background:transparent; border:none; border-top:1px solid rgba(236,230,220,.35); border-bottom:1px solid rgba(236,230,220,.35); padding:10px 22px; font-family:var(--mincho); }
.scale-badge b{ color:var(--leather); font-family:var(--en); font-size:18px; font-weight:500; }

/* Introduction */
.intro-lead{ color:var(--ink); }
.intro-lead p:not(.lede){ color:var(--muted); }
.scroll-cue{ color:var(--ink); }
.scroll-cue__label{ font-weight:400; letter-spacing:.42em; color:var(--muted); }
.scroll-cue__line{ background:rgba(236,230,220,.14); }
.scroll-cue__line::after{ background:var(--leather); }

/* バインダー（タブ）：すべて角ばったダークトーン */
main > section.binder-section{ background:var(--paper); }
.binder-tabs, .binder-tabs.is-stuck{ background:var(--paper); }
.binder-panel{ border-radius:0; }
.binder-tab{
  border-radius:0; font-weight:400; letter-spacing:.3em;
  border-top:1px solid rgba(236,230,220,.08);
  opacity:.72;
}
.binder-tab.is-active{ opacity:1; box-shadow:inset 0 2px 0 var(--leather); }
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#1A1918; --fg:#ECE6DC; } /* ブラック */
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#2E1B16; --fg:#ECE6DC; } /* オックスブラッド */
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#3A2A1F; --fg:#ECE6DC; } /* ダークコニャック */
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#23262A; --fg:#ECE6DC; } /* ガンメタル */
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#262620; --fg:#ECE6DC; } /* オリーブブラック */
.binder-panel h2.section-title{ color:var(--leather); }
.binder-page + .binder-page .section-inner{ border-top:1px solid rgba(236,230,220,.12); }
.binder-page:not(.is-active){ opacity:.4; }

/* Pick Up Brands：枠なしで写真を立たせ、名前の上に細い罫線 */
.binder-panel .mosaic-tile, .mosaic-tile{
  background:transparent; border:none; border-radius:0; padding:0; color:var(--ink);
}
.mosaic-img, .mosaic-img.photo{ border-radius:0; }
.mosaic-name{
  margin-top:0; padding-top:14px; border-top:1px solid rgba(236,230,220,.18);
  font-weight:400; font-size:13px; letter-spacing:.24em; color:var(--ink);
  text-align:left;
}
.mosaic-tile:hover .mosaic-name{ color:var(--leather); }
.mosaic-img.photo{ margin-bottom:0; }
.mosaic-grid{ gap:36px 20px; }

/* 注目アイテム */
.featured-card{ text-align:left; }
.featured-card .thumb{ border-radius:0; }
.featured-card .body{ padding:20px 0 0; border-top:1px solid rgba(236,230,220,.18); margin-top:14px; }
.featured-card h3{ font-weight:500; font-size:22px; letter-spacing:.18em; }
.featured-card p{ color:inherit; opacity:.7; }

/* 選び方ガイド：ダークカード */
.binder-panel .leather-card, .leather-card{
  background:rgba(0,0,0,.28); color:var(--ink); border-radius:0;
  border:1px solid rgba(236,230,220,.12);
}
.leather-card .tag{ color:var(--leather); font-weight:400; letter-spacing:.24em; }
.leather-card h3{ color:var(--ink); }
.leather-card p{ color:var(--muted); }

/* スタッフ・動画 */
.styling-card .thumb, .video-thumb{ border-radius:0; }
.styling-card .staff{ font-weight:400; letter-spacing:.2em; }
.styling-card .jacket-brand{ color:var(--leather); opacity:1; letter-spacing:.14em; }
.video-thumb{ border:1px solid rgba(236,230,220,.12); }
.video-thumb .play{ background:transparent; color:var(--ink); border:1px solid var(--ink); }
.video-card:hover .video-thumb .play{ background:var(--ink); color:#0E0D0C; }

/* イベント告知 */
.market-promo{ background:transparent; border:1px solid rgba(236,230,220,.2); border-radius:0; }
.market-tag{ border:1px solid var(--leather); color:var(--leather); background:transparent; font-weight:400; letter-spacing:.3em; }
.market-promo h2{ color:var(--ink); }
.market-date{ color:var(--leather); }
.market-promo .desc{ color:var(--muted); }

/* フッター */
.footer-cta{ color:var(--ink); }
.footer-cta p, .footer-links{ color:var(--muted); }
.site-footer{ background:var(--dark); color:#6F675E; border-top:1px solid var(--line); }

@media (max-width:860px){
  .binder-tab{ letter-spacing:.2em; }
  .mosaic-grid{ gap:24px 12px; }
}

/* =====================================================================
   トーンを黒 → 白へ（形・フォント・差し色は「かっこいい」版のまま）
   ・地：白（#FFFFFF／面は #F4F3F1）、文字：墨（#161514）
   ※ このブロックを消すと黒基調に戻ります
   ===================================================================== */
:root{
  --paper:#FFFFFF; --ink:#161514; --muted:rgba(22,21,20,.56);
  --line:rgba(22,21,20,.14); --surface:#F4F3F1; --tag-bg:#F4F3F1;
  --sand:#FFFFFF; --sand-soft:#F4F3F1; --blush:#F4F3F1; --dark:#F4F3F1;
}
html, body{ background:var(--paper); color:var(--ink); }
::selection{ background:var(--leather); color:#fff; }

/* 背景 */
.site-header{ background:rgba(255,255,255,.94); border-bottom:1px solid var(--line); }
.site-nav{ color:var(--muted); }
main > section:not(:first-child), main > section.band-sand, main > section.binder-section{ background:var(--paper); }
main > section.band-blush{ background:#F4F3F1; }
main > section.band-dark{ background:#F4F3F1; border-top:1px solid var(--line); }
.site-footer{ background:#F4F3F1; color:var(--muted); border-top:1px solid var(--line); }
.binder-tabs, .binder-tabs.is-stuck{ background:var(--paper); }
.kv-bg-rows{ background:#FFFFFF; }
.kv-bg-img{ background-color:#F4F3F1; }

/* タブ／パネル：白〜生成りの階調、最後だけ墨 */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#F4F3F1; --fg:#161514; }
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#ECE9E4; --fg:#161514; }
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#E3DFD8; --fg:#161514; }
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#D8D3CB; --fg:#161514; }
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#1C1B1A; --fg:#ECE6DC; }
.binder-tab{ border-top-color:rgba(22,21,20,.08); }
.binder-panel h2.section-jp, .binder-panel .scale-subhead{ color:inherit; }

/* 見出し・本文 */
h2.section-jp{ color:var(--ink); }
.intro-lead{ color:var(--ink); }
.scroll-cue__line{ background:rgba(22,21,20,.14); }

/* ボタン */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta{ color:var(--ink); border-color:rgba(22,21,20,.75); }
.cta:hover, .band-dark .cta:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.binder-panel[data-active="4"] .cta{ color:#ECE6DC; border-color:rgba(236,230,220,.7); }
.binder-panel[data-active="4"] .cta:hover{ background:#ECE6DC; color:#161514; }

/* 罫線・カード */
.binder-page + .binder-page .section-inner{ border-top:1px solid color-mix(in srgb, currentColor 14%, transparent); }
.mosaic-tile, .binder-panel .mosaic-tile, .mosaic-name{ color:inherit; }
.mosaic-name, .featured-card .body{ border-top-color:color-mix(in srgb, currentColor 20%, transparent); }
.mosaic-img, .mosaic-img.photo{ background-color:#FFFFFF; }
.binder-panel .leather-card, .leather-card{ background:rgba(255,255,255,.6); border-color:rgba(22,21,20,.1); color:var(--ink); }
.leather-card h3{ color:var(--ink); }
.video-thumb{ border-color:color-mix(in srgb, currentColor 14%, transparent); }
.video-thumb .play{ color:inherit; border-color:currentColor; }
.market-promo{ border-color:rgba(22,21,20,.18); }
.market-promo h2, .footer-cta{ color:var(--ink); }

/* =====================================================================
   色とフォントを MAISON TAKUYA 風に（レイアウト・形は今のまま）
   ・地：ライトグレー #DEDEDE／文字：チャコール #2E2E2E
   ・差し色：#DA4803 を ロゴ と 英字見出し だけに
   ・英字：本文・ナビ・ボタン＝Switzer／見出し＝Sentient
   ・和文：本文＝Noto Sans JP／リード文・KVコピー＝Noto Serif JP
   ・大文字・広い字間はやめ、小さめで落ち着いた組み方
   ※ このブロックを消すと直前（白×Oswald）に戻ります
   ===================================================================== */
:root{
  --paper:#DEDEDE; --ink:#2E2E2E; --muted:rgba(46,46,46,.58);
  --line:rgba(46,46,46,.16); --surface:#D6D6D6; --tag-bg:#D6D6D6;
  --sand:#DEDEDE; --sand-soft:#D6D6D6; --blush:#D6D6D6; --dark:#D6D6D6;
  --accent:#DA4803;
  --leather:#2E2E2E; --camel:#2E2E2E;   /* 差し色は見出しとロゴだけにするため、その他はチャコールに */
  --sans:"Switzer","Noto Sans JP","Helvetica Neue",Arial,sans-serif;
  --serif:"Sentient","Noto Serif JP","Times New Roman",serif;
  --en:var(--sans); --mincho:var(--sans);
}
html, body{ background:var(--paper); color:var(--ink); }
body, button, input{ font-family:var(--sans); font-size:13.5px; letter-spacing:0; }
::selection{ background:var(--accent); color:#fff; }

/* フォント */
h1,h2,h3,.serif,
.intro-lead, .scale-lead, .featured-card p, .leather-card p, .styling-card p,
.video-card p, .market-promo .desc, .footer-cta p, .footer-links, .scale-badge, .site-footer,
h2.section-jp, .leather-card h3, .market-promo h2, .footer-cta h2{ font-family:var(--sans); }
.intro-lead .lede, .kv h1{ font-family:"Noto Serif JP",var(--serif); font-weight:400; }

/* 大文字・広い字間をやめる */
.logo, .site-nav, .eyebrow, h2.section-title, .scale-subhead, .ticker-lead,
.mosaic-name, .binder-tab, .market-tag, .leather-card .tag,
.styling-card .staff, .styling-card .jacket-brand, .cta, .scroll-cue__label, .featured-card h3{
  font-family:var(--sans); text-transform:none; letter-spacing:.01em; font-weight:400;
}
h2.section-jp{ font-weight:500; font-size:clamp(17px,1.8vw,21px); letter-spacing:.04em; }
.intro-lead .lede{ letter-spacing:.04em; }
.kv h1{ letter-spacing:.06em; }

/* 差し色：ロゴと英字見出しだけ */
.logo{ color:var(--accent); text-transform:uppercase; letter-spacing:.22em; font-size:15px; }
h2.section-title, .binder-panel h2.section-title{
  font-family:var(--serif); font-weight:400; font-size:26px; letter-spacing:0; color:var(--accent);
}
h2.section-title::before, h2.section-title::after{ display:none; }
.binder-panel[data-active="4"] h2.section-title{ color:#F0763C; }
.featured-card h3{ font-family:var(--serif); font-size:18px; }

/* 小さめの文字 */
.site-nav{ font-size:12.5px; color:var(--ink); }
.eyebrow, .scale-subhead, .scroll-cue__label{ font-size:12px; color:var(--muted); }
.kv .eyebrow{ color:#fff; opacity:.85; }
.mosaic-name{ font-size:12.5px; }
.binder-tab{ font-size:13px; }
@media (min-width:861px){ .binder-tab{ font-size:13.5px; } }
.cta{ font-size:13px; font-weight:500; }
.leather-card .tag, .market-tag{ font-size:12px; color:var(--muted); border-color:currentColor; }
.styling-card .staff{ font-size:12.5px; font-weight:500; }
.styling-card .jacket-brand{ font-size:12px; color:inherit; opacity:.6; }
.scale-badge b{ font-family:var(--serif); font-weight:400; color:#fff; }

/* 背景色 */
.site-header{ background:rgba(222,222,222,.94); }
main > section:not(:first-child), main > section.band-sand, main > section.binder-section{ background:var(--paper); }
main > section.band-blush{ background:#D6D6D6; }
main > section.band-dark, .site-footer{ background:#D6D6D6; }
.binder-tabs, .binder-tabs.is-stuck{ background:var(--paper); }
.kv-bg-rows{ background:var(--paper); }
.kv-bg-img{ background-color:#D6D6D6; }
.mosaic-img, .mosaic-img.photo{ background-color:#E6E6E6; }

/* タブ：グレーの階調（最後だけチャコール）、選択中はチャコールの線 */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#D2D2D2; --fg:#2E2E2E; }
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#C8C7C4; --fg:#2E2E2E; }
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#BDBCB8; --fg:#2E2E2E; }
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#B0AFAB; --fg:#2E2E2E; }
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#3A3A39; --fg:#E6E6E6; }
.binder-tab.is-active{ box-shadow:inset 0 2px 0 #2E2E2E; }
#tabbtn-video.is-active{ box-shadow:inset 0 2px 0 #E6E6E6; }

/* ボタン */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta{ color:var(--ink); border-color:rgba(46,46,46,.7); }
.cta:hover, .band-dark .cta:hover{ background:var(--ink); color:#DEDEDE; border-color:var(--ink); }
.binder-panel[data-active="4"] .cta{ color:#E6E6E6; border-color:rgba(230,230,230,.7); }
.binder-panel[data-active="4"] .cta:hover{ background:#E6E6E6; color:#2E2E2E; }

/* 細部 */
.scroll-cue__line{ background:rgba(46,46,46,.15); }
.scroll-cue__line::after{ background:#2E2E2E; }
.binder-panel .leather-card, .leather-card{ background:rgba(255,255,255,.32); border-color:rgba(46,46,46,.1); }
.market-promo{ border-color:rgba(46,46,46,.18); }
.market-date{ color:var(--muted); }
/* KVの上は白文字のまま／字間の残りをリセット */
.kv .cta{ color:#fff; border-color:rgba(255,255,255,.8); }
.kv .cta:hover{ background:#fff; color:#2E2E2E; border-color:#fff; }
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta, .kv .cta{ letter-spacing:.04em; font-family:var(--sans); }
.kv .eyebrow, h2.section-title, .binder-panel h2.section-title{ letter-spacing:.02em; }
/* TOPスライダー（背景の画像帯）の地は白 */
.kv-bg-rows{ background:#FFFFFF; }
.kv-bg-img{ background-color:#FFFFFF; }

/* =====================================================================
   HERITAGE（クラブハウス／トラディショナル）テーマ
   参考：クラシックなゴルフ＆ライフスタイルブランドのブランドボード
   ・色：Clubhouse #F3EFE6（地）／Pine Grove #1E3A2E（文字・主色）
         Field Green #4B5A3A／Leather #7A4E2D／Vintage Gold #B08D46／Midnight #1A2233
   ・書体：見出しラベル＝コンデンス体の大文字（Barlow Condensed）
           英字セリフ＝Libre Baskerville／アクセント＝筆記体（Pinyon Script）
           和文＝Shippori Mincho（見出し）＋Noto Sans JP（本文）
   ・罫線は二重線、ラベルは楕円・バッジ風、左右対称のクラシックな組み
   ※ このブロックを消すと直前のデザインに戻ります
      （直前のファイルは「backup_20260929_ヘリテージ前」フォルダにも保存）
   ===================================================================== */
:root{
  --clubhouse:#F3EFE6; --pine:#1E3A2E; --field:#4B5A3A; --hleather:#7A4E2D; --gold:#B08D46; --midnight:#1A2233;
  --paper:#F3EFE6; --ink:#1E3A2E; --muted:rgba(30,58,46,.62);
  --line:rgba(30,58,46,.28); --surface:#EAE4D8; --tag-bg:#EAE4D8;
  --sand:#F3EFE6; --sand-soft:#EAE4D8; --blush:#EAE4D8; --dark:#1E3A2E;
  --accent:#7A4E2D; --leather:#7A4E2D; --camel:#B08D46;
  --cond:"Barlow Condensed","Oswald","Arial Narrow",sans-serif;
  --bask:"Libre Baskerville","Baskerville","Times New Roman",serif;
  --script:"Pinyon Script","Snell Roundhand",cursive;
  --jpserif:"Shippori Mincho","Libre Baskerville",serif;
  --jpsans:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  --sans:var(--jpsans); --serif:var(--bask); --en:var(--cond); --mincho:var(--jpserif);
}
html, body{ background:var(--paper); color:var(--ink); }
body, button, input{ font-family:var(--jpsans); font-size:14px; letter-spacing:.03em; line-height:1.95; }
::selection{ background:var(--gold); color:var(--pine); }

/* 和文の見出しは明朝 */
h1, h2, h3, .serif, .intro-lead .lede, .kv h1, h2.section-jp, .leather-card h3,
.market-promo h2, .footer-cta h2{ font-family:var(--jpserif); font-weight:500; }
.intro-lead p:not(.lede), .scale-lead, .featured-card p, .leather-card p, .styling-card p,
.video-card p, .market-promo .desc, .footer-cta p, .footer-links, .site-footer{ font-family:var(--jpsans); }

/* 英字ラベル：コンデンス体の大文字・広めの字間 */
.site-nav, .eyebrow, h2.section-title, .scale-subhead, .ticker-lead,
.mosaic-name, .binder-tab, .market-tag, .leather-card .tag,
.styling-card .staff, .styling-card .jacket-brand, .cta, .scroll-cue__label{
  font-family:var(--cond); text-transform:uppercase; font-weight:500; letter-spacing:.22em;
}
.featured-card h3{ font-family:var(--bask); font-weight:400; text-transform:uppercase; letter-spacing:.14em; }

/* ヘッダー：生成り地＋二重罫線、ロゴはセリフの大文字 */
.site-header{ background:rgba(243,239,230,.96); border-bottom:3px double var(--pine); }
.logo{ font-family:var(--bask); font-weight:400; font-size:21px; letter-spacing:.2em; text-transform:uppercase; color:var(--pine); }
.site-nav{ font-size:13px; color:var(--pine); letter-spacing:.2em; }

/* 地の色 */
main > section:not(:first-child), main > section.band-sand, main > section.binder-section{ background:var(--paper); }
main > section.band-blush{ background:var(--surface); border-top:3px double var(--line); }
main > section.band-dark{ background:var(--pine); color:var(--clubhouse); border-top:none; }
.binder-tabs, .binder-tabs.is-stuck{ background:var(--paper); }

/* セクション見出し：線付きの小さな大文字（レザー色）＋和文明朝 */
h2.section-title, .binder-panel h2.section-title{
  display:inline-flex; font-family:var(--cond); font-weight:500; font-size:13px; letter-spacing:.32em;
  color:var(--hleather); opacity:1;
}
h2.section-title::before, h2.section-title::after{ display:block; width:36px; border-top:1px solid currentColor; opacity:.7; }
h2.section-jp{ font-size:clamp(22px,2.4vw,30px); letter-spacing:.1em; color:inherit; }
.binder-panel h2.section-title{ color:var(--gold); }

/* KV：パイングリーンのトーンをかぶせ、筆記体のアクセント */
.kv-bg-rows{ background:var(--clubhouse); }
.kv-bg-img{ background-color:var(--clubhouse); filter:sepia(.18) saturate(.85); }
.kv::before{ background:linear-gradient(180deg, rgba(30,58,46,.30) 0%, rgba(30,58,46,.55) 55%, rgba(20,38,30,.86) 100%); }
.kv .eyebrow{ font-family:var(--script); text-transform:none; letter-spacing:0; font-size:30px; font-weight:400; color:var(--gold); opacity:1; margin-bottom:8px; }
.kv h1{ font-family:var(--jpserif); color:var(--clubhouse); letter-spacing:.14em; font-weight:500; }
.scale-badge{
  font-family:var(--cond); text-transform:uppercase; letter-spacing:.18em; font-size:13px;
  color:var(--clubhouse); background:none; border:none; border-top:3px double rgba(176,141,70,.8); border-bottom:3px double rgba(176,141,70,.8);
  border-radius:0; padding:10px 26px;
}
.scale-badge b{ font-family:var(--bask); font-weight:400; font-size:18px; color:var(--gold); }

/* ボタン：パイングリーンの面＋内側の細線（クラシックなラベル風） */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta, .kv .cta{
  background:var(--pine); color:var(--clubhouse);
  border:1px solid var(--pine); border-radius:0;
  box-shadow:inset 0 0 0 3px var(--pine), inset 0 0 0 4px rgba(243,239,230,.55);
  padding:16px 44px; font-size:14px; letter-spacing:.24em;
}
.cta:hover, .band-dark .cta:hover, .kv .cta:hover{ background:var(--hleather); border-color:var(--hleather); color:var(--clubhouse); box-shadow:inset 0 0 0 3px var(--hleather), inset 0 0 0 4px rgba(243,239,230,.55); }
.cta::after{ content:"›"; font-family:var(--bask); letter-spacing:0; margin-left:4px; }
.kv .cta, .band-dark .cta{ background:transparent; border-color:var(--gold); color:var(--clubhouse); box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(176,141,70,.6); }
.kv .cta:hover, .band-dark .cta:hover{ background:var(--gold); color:var(--pine); border-color:var(--gold); }

/* Introduction：筆記体の添え書き */
.intro-lead .lede{ color:var(--pine); letter-spacing:.08em; }
.intro-lead p:not(.lede){ color:var(--muted); }
.scroll-cue__label{ font-size:12px; color:var(--hleather); }
.scroll-cue__line{ background:rgba(30,58,46,.18); }
.scroll-cue__line::after{ background:var(--gold); }

/* タブ：ブランドカラー5色 */
.binder-tab{ border:none; border-radius:4px 4px 0 0; box-shadow:none; opacity:.9; font-size:13px; letter-spacing:.24em; }
@media (min-width:861px){ .binder-tab{ font-size:14.5px; } }
.binder-tab.is-active{ opacity:1; box-shadow:inset 0 3px 0 var(--gold); }
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#1E3A2E; --fg:#F3EFE6; } /* Pine Grove */
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#4B5A3A; --fg:#F3EFE6; } /* Field Green */
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#7A4E2D; --fg:#F3EFE6; } /* Leather */
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#B08D46; --fg:#1E3A2E; } /* Vintage Gold */
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#1A2233; --fg:#F3EFE6; } /* Midnight */
#tabbtn-styling.is-active{ box-shadow:inset 0 3px 0 var(--pine); }
.binder-panel[data-active="3"] h2.section-title{ color:var(--pine); }
.binder-panel{ border-radius:0; }
.binder-page + .binder-page .section-inner{ border-top:3px double color-mix(in srgb, currentColor 28%, transparent); }
.binder-page:not(.is-active){ opacity:.45; }
.binder-panel h2.section-jp, .binder-panel .scale-subhead, .binder-panel .scale-lead{ color:inherit; }

/* Pick Up Brands：生成りのラベル台紙に写真 */
.mosaic-tile, .binder-panel .mosaic-tile{
  background:var(--clubhouse); color:var(--pine); border:1px solid rgba(30,58,46,.18);
  padding:10px 10px 16px; border-radius:0;
  box-shadow:inset 0 0 0 4px var(--clubhouse), inset 0 0 0 5px rgba(176,141,70,.45);
}
.mosaic-img, .mosaic-img.photo{ background-color:#FFFFFF; }
.mosaic-name{ border-top:none; padding-top:12px; text-align:center; font-size:13px; letter-spacing:.2em; color:var(--pine); }
.mosaic-tile:hover .mosaic-name{ color:var(--hleather); }
.mosaic-grid{ gap:22px 18px; }

/* 注目アイテム */
.featured-card{ text-align:center; }
.featured-card .body{ border-top:none; padding:18px 6px 0; margin-top:0; }
.featured-card h3{ font-size:18px; color:inherit; }
.featured-card p{ opacity:.8; font-size:13px; }

/* 選び方ガイド：生成りのカード */
.leather-card, .binder-panel .leather-card{
  background:var(--clubhouse); color:var(--pine); border:1px solid rgba(30,58,46,.15); text-align:center;
  box-shadow:inset 0 0 0 5px var(--clubhouse), inset 0 0 0 6px rgba(176,141,70,.4);
}
.leather-card .tag{ color:var(--hleather); font-size:12.5px; }
.leather-card h3{ color:var(--pine); }
.leather-card p{ color:rgba(30,58,46,.7); text-align:left; }

/* スタッフ・動画 */
.styling-card .staff{ font-size:13px; }
.styling-card .jacket-brand{ color:inherit; opacity:.75; letter-spacing:.14em; }
.video-thumb{ border:1px solid color-mix(in srgb, currentColor 22%, transparent); }
.video-thumb .play{ background:var(--clubhouse); color:var(--pine); border:none; }

/* イベント告知：バッジ風の枠 */
.market-promo{ background:var(--clubhouse); border:3px double var(--pine); text-align:center; }
.market-tag{ border:1px solid var(--hleather); color:var(--hleather); background:transparent; border-radius:999px; padding:4px 18px; }
.market-promo h2{ color:var(--pine); }
.market-date{ color:var(--hleather); }
.market-promo .desc{ color:var(--muted); }

/* フッター：パイングリーンの帯＋筆記体 */
main > section.band-dark .footer-cta{ color:var(--clubhouse); }
.footer-cta h2{ color:var(--clubhouse); }
.footer-cta h2::after{ content:"Crafted to Wear, Made to Last."; display:block; margin-top:10px; font-family:var(--script); font-size:28px; font-weight:400; letter-spacing:0; color:var(--gold); }
.footer-cta p, .footer-links{ color:rgba(243,239,230,.72); }
.site-footer{ background:#16291F; color:rgba(243,239,230,.6); border-top:1px solid rgba(176,141,70,.35); }

@media (max-width:860px){
  .kv .eyebrow{ font-size:24px; }
  .binder-tab{ letter-spacing:.16em; }
  .footer-cta h2::after{ font-size:22px; }
}
.binder-panel[data-active="2"] h2.section-title{ color:#E9D3A6; }

/* =====================================================================
   CHOCOLATE（ブラウン×アイボリー）：色とフォントだけ差し替え
   参考：ダークブラウンのカード、細い内枠線、ディドーネ体＋筆記体のモードボード
   ・地：チョコレートブラウン #332423／文字：アイボリー #EFE6DA
   ・面：アイボリー #E8DECF（文字はブラウン）、差し色：ブラス #B89A6A
   ・英字見出し・ロゴ＝Bodoni Moda（ディドーネ体）／添え書き＝Pinyon Script
     小さなラベル＝Montserrat の大文字（字間広め）／和文＝Shippori Mincho＋Noto Sans JP
   ※ このブロックを消すと緑のヘリテージ版に戻ります
      （緑版は「backup_20260929_ヘリテージ緑」フォルダにも保存）
   ===================================================================== */
:root{
  --choco:#332423; --espresso:#261B1A; --ivory:#EFE6DA; --cream:#E8DECF; --brass:#B89A6A; --saddle:#6B4A3A; --oxblood:#4E2A26;
  --paper:#332423; --ink:#EFE6DA; --muted:rgba(239,230,218,.62);
  --line:rgba(239,230,218,.32); --surface:#2B1F1E; --tag-bg:#2B1F1E;
  --pine:#332423; --clubhouse:#E8DECF; --gold:#B89A6A; --hleather:#B89A6A;
  --accent:#B89A6A; --leather:#B89A6A; --camel:#B89A6A;
  --didone:"Bodoni Moda","Didot","Bodoni 72","Times New Roman",serif;
  --label:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --bask:var(--didone); --cond:var(--label);
}
html, body{ background:var(--paper); color:var(--ink); }
::selection{ background:var(--brass); color:var(--espresso); }

/* フォント */
.logo, .featured-card h3{ font-family:var(--didone); font-weight:400; }
.logo{ font-size:24px; letter-spacing:.12em; color:var(--ivory); }
.site-nav, .eyebrow, h2.section-title, .scale-subhead, .ticker-lead,
.mosaic-name, .binder-tab, .market-tag, .leather-card .tag,
.styling-card .staff, .styling-card .jacket-brand, .cta, .scroll-cue__label{
  font-family:var(--label); font-weight:500; text-transform:uppercase; letter-spacing:.28em;
}
.site-nav{ font-size:10.5px; color:var(--ivory); }
h2.section-title, .binder-panel h2.section-title{ font-size:10.5px; letter-spacing:.36em; color:var(--brass); }
h2.section-jp{ letter-spacing:.14em; font-weight:400; }
.scale-subhead, .scroll-cue__label{ font-size:10.5px; }
.mosaic-name{ font-size:10.5px; letter-spacing:.26em; }
.binder-tab{ font-size:10.5px; letter-spacing:.3em; }
@media (min-width:861px){ .binder-tab{ font-size:11.5px; } }
.cta{ font-size:11px; letter-spacing:.3em; }
.leather-card .tag, .market-tag, .styling-card .staff, .styling-card .jacket-brand{ font-size:10.5px; }
.featured-card h3{ font-size:22px; letter-spacing:.06em; text-transform:none; }

/* ヘッダー・地 */
.site-header{ background:rgba(51,36,35,.96); border-bottom:1px solid var(--line); box-shadow:0 4px 0 -3px var(--line); }
main > section:not(:first-child), main > section.band-sand, main > section.binder-section{ background:var(--paper); }
main > section.band-blush{ background:var(--espresso); border-top:1px solid var(--line); }
main > section.band-dark{ background:var(--espresso); color:var(--ivory); }
.binder-tabs, .binder-tabs.is-stuck{ background:var(--paper); }
.site-footer{ background:#1E1514; color:rgba(239,230,218,.5); border-top:1px solid var(--line); }

/* KV：ブラウンのトーン、筆記体はアイボリー */
.kv-bg-rows{ background:#FFFFFF; }
.kv-bg-img{ filter:sepia(.25) saturate(.8) brightness(.95); }
.kv::before{ background:linear-gradient(180deg, rgba(51,36,35,.30) 0%, rgba(51,36,35,.58) 55%, rgba(38,27,26,.9) 100%); }
.kv .eyebrow{ color:var(--ivory); }
.kv h1{ color:var(--ivory); font-weight:400; }
.scale-badge{ color:var(--ivory); border-top:1px solid rgba(239,230,218,.5); border-bottom:1px solid rgba(239,230,218,.5); font-family:var(--label); font-size:10.5px; letter-spacing:.3em; }
.scale-badge b{ font-family:var(--didone); color:var(--ivory); font-size:20px; letter-spacing:.04em; }

/* Introduction */
.intro-lead .lede{ color:var(--ivory); font-weight:400; }
.intro-lead p:not(.lede){ color:var(--muted); }
.scroll-cue__label{ color:var(--muted); }
.scroll-cue__line{ background:rgba(239,230,218,.2); }
.scroll-cue__line::after{ background:var(--ivory); }

/* ボタン：細い内枠のアウトライン */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta, .kv .cta{
  background:transparent; color:var(--ivory); border:1px solid rgba(239,230,218,.75);
  box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(239,230,218,.35);
}
.cta:hover, .band-dark .cta:hover, .kv .cta:hover{ background:var(--ivory); color:var(--choco); border-color:var(--ivory); box-shadow:inset 0 0 0 3px var(--ivory), inset 0 0 0 4px rgba(51,36,35,.35); }
.cta::after{ font-family:var(--didone); }

/* タブ：ブラウンの階調＋アイボリー */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#3D2B29; --fg:#EFE6DA; } /* チョコレート */
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#4E2A26; --fg:#EFE6DA; } /* オックスブラッド */
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#6B4A3A; --fg:#EFE6DA; } /* サドル */
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#E8DECF; --fg:#332423; } /* アイボリー */
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#221817; --fg:#EFE6DA; } /* エスプレッソ */
.binder-tab.is-active{ box-shadow:inset 0 2px 0 var(--brass); }
#tabbtn-styling.is-active{ box-shadow:inset 0 2px 0 var(--choco); }
.binder-panel h2.section-title, .binder-panel[data-active="2"] h2.section-title{ color:var(--brass); }
.binder-panel[data-active="2"] h2.section-title{ color:#E3C99B; }
.binder-panel[data-active="3"] h2.section-title{ color:var(--saddle); }
.binder-page + .binder-page .section-inner{ border-top:1px solid color-mix(in srgb, currentColor 22%, transparent); }

/* カード：アイボリーの台紙＋細い内枠（招待状風） */
.mosaic-tile, .binder-panel .mosaic-tile{
  background:var(--cream); color:var(--choco); border:none;
  box-shadow:inset 0 0 0 5px var(--cream), inset 0 0 0 6px rgba(51,36,35,.35);
}
.mosaic-name{ color:var(--choco); }
.mosaic-tile:hover .mosaic-name{ color:var(--saddle); }
.leather-card, .binder-panel .leather-card{
  background:var(--cream); color:var(--choco); border:none;
  box-shadow:inset 0 0 0 6px var(--cream), inset 0 0 0 7px rgba(51,36,35,.3);
}
.leather-card .tag{ color:var(--saddle); }
.leather-card h3{ color:var(--choco); }
.leather-card p{ color:rgba(51,36,35,.72); }
.video-thumb{ border:1px solid color-mix(in srgb, currentColor 25%, transparent); }
.video-thumb .play{ background:var(--ivory); color:var(--choco); }

/* イベント告知：ブラウンのカードに細い内枠 */
.market-promo{
  background:var(--choco); border:none; color:var(--ivory);
  box-shadow:inset 0 0 0 14px var(--choco), inset 0 0 0 15px rgba(239,230,218,.55);
}
.market-tag{ border-color:rgba(239,230,218,.6); color:var(--ivory); }
.market-promo h2{ color:var(--ivory); font-weight:400; }
.market-date{ color:var(--brass); }
.market-promo .desc{ color:var(--muted); }

/* フッターCTA：筆記体はアイボリー */
.footer-cta h2{ color:var(--ivory); font-weight:400; }
.footer-cta h2::after{ color:var(--ivory); opacity:.9; }
.footer-cta p, .footer-links{ color:rgba(239,230,218,.65); }

/* =====================================================================
   タブ（バインダー）部分以外の背景を白に
   ・タブの列とパネルはチョコレートブラウンのまま
   ・白い地の上の文字はブラウン（#332423）
   ===================================================================== */
html, body{ background:#FFFFFF; color:#332423; }
::selection{ background:#B89A6A; color:#fff; }

/* バインダーは今のブラウンを維持 */
main > section.binder-section, .binder-tabs, .binder-tabs.is-stuck{ background:#332423; }

/* ヘッダー */
.site-header{ background:rgba(255,255,255,.96); border-bottom:1px solid rgba(51,36,35,.3); box-shadow:0 4px 0 -3px rgba(51,36,35,.3); }
.logo, .site-nav{ color:#332423; }

/* Introduction・イベント・フッター：白地 */
main > section.band-sand, main > section.band-blush, main > section.band-dark{ background:#FFFFFF; color:#332423; border-top:1px solid rgba(51,36,35,.14); }
main > section.band-sand{ border-top:none; }
.band-sand h2.section-title, .band-blush h2.section-title{ color:#6B4A3A; }
.band-sand h2.section-jp, .band-blush h2.section-jp{ color:#332423; }
.intro-lead .lede{ color:#332423; }
.intro-lead p:not(.lede){ color:rgba(51,36,35,.62); }
.scroll-cue__label{ color:rgba(51,36,35,.6); }
.scroll-cue__line{ background:rgba(51,36,35,.15); }
.scroll-cue__line::after{ background:#332423; }

.market-promo{ background:#FFFFFF; color:#332423; box-shadow:inset 0 0 0 14px #FFFFFF, inset 0 0 0 15px rgba(51,36,35,.5); border:1px solid rgba(51,36,35,.2); }
.market-tag{ border-color:rgba(51,36,35,.5); color:#332423; }
.market-promo h2{ color:#332423; }
.market-date{ color:#8A6A45; }
.market-promo .desc{ color:rgba(51,36,35,.65); }

main > section.band-dark .footer-cta, .footer-cta, .footer-cta h2{ color:#332423; }
.footer-cta h2::after{ color:#6B4A3A; }
.footer-cta p, .footer-links{ color:rgba(51,36,35,.65); }
.site-footer{ background:#FFFFFF; color:rgba(51,36,35,.55); border-top:1px solid rgba(51,36,35,.14); }

/* 白地の上のボタンはブラウンの細枠 */
.band-sand .cta, .band-blush .cta, .band-dark .cta, .footer-cta .cta{
  color:#332423; border-color:rgba(51,36,35,.75); background:transparent;
  box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(51,36,35,.3);
}
.band-sand .cta:hover, .band-blush .cta:hover, .band-dark .cta:hover, .footer-cta .cta:hover{ background:#332423; color:#FFFFFF; border-color:#332423; }
/* アイボリーのパネル（Staff Styling）上のボタンも読めるように */
.binder-panel[data-active="3"] .cta{ color:#332423; border-color:rgba(51,36,35,.75); box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(51,36,35,.3); }
.binder-panel[data-active="3"] .cta:hover{ background:#332423; color:#EFE6DA; }
/* TOPスライダー：画像の色味フィルターを外し、商品画像の白い背景とすき間の白をそろえる */
.kv-bg-img{ filter:none; background-color:#FFFFFF; }
.kv-bg-rows{ background:#FFFFFF; }

/* Introduction：背景をダークブラウン（#312523）に、文字はアイボリー */
main > section.band-sand{ background:#312523; color:#EFE6DA; border-top:none; }
.band-sand h2.section-title{ color:#B89A6A; }
.band-sand .intro-lead .lede{ color:#EFE6DA; }
.band-sand .intro-lead p:not(.lede){ color:rgba(239,230,218,.65); }
.band-sand .scroll-cue{ color:#EFE6DA; }
.band-sand .scroll-cue__label{ color:rgba(239,230,218,.6); }
.band-sand .scroll-cue__line{ background:rgba(239,230,218,.2); }
.band-sand .scroll-cue__line::after{ background:#EFE6DA; }
/* すぐ下のタブの列も同じ色にして、境目の色の段差をなくす */
main > section.binder-section, .binder-tabs, .binder-tabs.is-stuck{ background:#312523; }
/* タブの列の背景を白っぽいアイボリーに */
main > section.binder-section, .binder-tabs, .binder-tabs.is-stuck{ background:#F7F3EE; }

/* タブ／パネル色：添付パレットの順（左→右） */
#tabbtn-lineup,  .binder-panel[data-active="0"]{ --c:#E8E1D4; --fg:#332423; } /* アイボリー */
#tabbtn-featured,.binder-panel[data-active="1"]{ --c:#755D4F; --fg:#F2ECE3; } /* トープブラウン */
#tabbtn-guide,   .binder-panel[data-active="2"]{ --c:#5A403B; --fg:#F2ECE3; } /* ココア */
#tabbtn-styling, .binder-panel[data-active="3"]{ --c:#3A2C2A; --fg:#F2ECE3; } /* ダークブラウン */
#tabbtn-video,   .binder-panel[data-active="4"]{ --c:#372E2D; --fg:#F2ECE3; } /* エスプレッソ */

/* 選択中の線：明るいタブはブラウン、暗いタブはブラス */
.binder-tab.is-active, #tabbtn-styling.is-active{ box-shadow:inset 0 2px 0 #B89A6A; }
#tabbtn-lineup.is-active{ box-shadow:inset 0 2px 0 #5A403B; }

/* 見出しラベルの色 */
.binder-panel h2.section-title,
.binder-panel[data-active="2"] h2.section-title,
.binder-panel[data-active="3"] h2.section-title{ color:#D7BE92; }
.binder-panel[data-active="0"] h2.section-title{ color:#755D4F; }

/* ボタン：明るいパネルはブラウン、暗いパネルはアイボリー */
.binder-panel .cta{ color:#F2ECE3; border-color:rgba(242,236,227,.75); background:transparent; box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(242,236,227,.35); }
.binder-panel .cta:hover{ background:#F2ECE3; color:#332423; border-color:#F2ECE3; }
.binder-panel[data-active="0"] .cta{ color:#332423; border-color:rgba(51,36,35,.75); box-shadow:inset 0 0 0 3px transparent, inset 0 0 0 4px rgba(51,36,35,.3); }
.binder-panel[data-active="0"] .cta:hover{ background:#332423; color:#F2ECE3; }

/* =====================================================================
   GENTLEMAN：40代メンズ向けの落ち着いた高級感
   ・配色はブラウン×アイボリーのまま、飾りを削ぎ落として「静かな上質さ」に
   ・筆記体・二重線・楕円・内枠などの装飾をやめ、細い1本線と直角で端正に
   ・英字のロゴ・ブランド名＝Libre Caslon（クラシックなローマン体）
     ラベル＝Montserrat の小さな大文字／和文見出し＝Shippori Mincho
   ・ボタンは濃いブラウンの塗り、余白を広めに
   ※ このブロックを消すと直前のデザインに戻ります
      （直前のファイルは「backup_20260929_ブラウン女性寄り_2」フォルダにも保存）
   ===================================================================== */
:root{
  --caslon:"Libre Caslon Text","Libre Caslon Display","Baskerville","Times New Roman",serif;
  --didone:var(--caslon); --script:var(--label);
  --deep:#2B201E;
}

/* ロゴ・ブランド名：クラシックなローマン体 */
.logo{ font-family:"Libre Caslon Display",var(--caslon); font-weight:400; font-size:25px; letter-spacing:.2em; text-transform:uppercase; }
.featured-card h3{ font-family:var(--caslon); font-weight:400; font-size:20px; letter-spacing:.08em; text-transform:uppercase; }
.scale-badge b{ font-family:var(--caslon); font-weight:400; font-size:19px; }

/* 和文見出し：明朝をやや締めて落ち着いた組みに */
h1, h2, h3, .serif, .intro-lead .lede, .kv h1, h2.section-jp, .leather-card h3, .market-promo h2, .footer-cta h2{
  font-family:var(--jpserif); font-weight:500;
}
h2.section-jp{ font-size:clamp(22px,2.3vw,28px); letter-spacing:.12em; }
.kv h1{ font-weight:500; letter-spacing:.16em; }

/* 筆記体をやめる */
.kv .eyebrow{ font-family:var(--label); text-transform:uppercase; font-size:11px; font-weight:500; letter-spacing:.36em; color:rgba(239,230,218,.85); margin-bottom:18px; }
.footer-cta h2::after{ content:none; }

/* ヘッダー：細い1本線 */
.site-header{ box-shadow:none; border-bottom:1px solid rgba(51,36,35,.18); }

/* 見出しラベル：線は細く短く */
h2.section-title::before, h2.section-title::after{ width:24px; border-top-width:1px; opacity:.6; }

/* タブ：直角、控えめな文字 */
.binder-tab{ border-radius:0; letter-spacing:.26em; }
.binder-tab.is-active{ box-shadow:inset 0 2px 0 #B89A6A; }
#tabbtn-lineup.is-active{ box-shadow:inset 0 2px 0 #332423; }

/* カード：内枠をやめ、フラットに */
.mosaic-tile, .binder-panel .mosaic-tile{
  background:transparent; box-shadow:none; border:none; padding:0; color:inherit;
}
.mosaic-img, .mosaic-img.photo{ background-color:#FFFFFF; border:none; }
.mosaic-name{ color:inherit; text-align:left; padding-top:14px; border-top:none; }
.mosaic-grid{ gap:40px 20px; }
.leather-card, .binder-panel .leather-card{ box-shadow:none; border:1px solid rgba(51,36,35,.12); background:#F5F0E8; }

/* イベント告知：細い1本線の枠、ラベルは四角く */
.market-promo{ box-shadow:none; border:1px solid rgba(51,36,35,.25); }
.market-tag{ border-radius:0; border:1px solid currentColor; padding:4px 14px; }

/* ボタン：濃いブラウンの塗り、内側の線はなし */
.cta, .cta.solid-dark, .footer-cta .cta, .band-dark .cta, .band-sand .cta, .band-blush .cta, .binder-panel[data-active="0"] .cta{
  background:var(--deep); color:#F2ECE3; border:1px solid var(--deep); box-shadow:none;
  padding:17px 52px; font-size:11px; letter-spacing:.3em;
}
.cta:hover, .band-dark .cta:hover, .band-sand .cta:hover, .band-blush .cta:hover, .footer-cta .cta:hover, .binder-panel[data-active="0"] .cta:hover{
  background:#6B4A3A; border-color:#6B4A3A; color:#F2ECE3; box-shadow:none;
}
.cta::after{ content:"→"; font-family:var(--label); letter-spacing:0; }
/* 暗い地の上ではアイボリーの細枠 */
.kv .cta, .binder-panel .cta{ background:transparent; color:#F2ECE3; border:1px solid rgba(242,236,227,.8); box-shadow:none; }
.kv .cta:hover, .binder-panel .cta:hover{ background:#F2ECE3; color:var(--deep); border-color:#F2ECE3; }
.binder-panel[data-active="0"] .cta{ background:var(--deep); color:#F2ECE3; border-color:var(--deep); }

/* 区切り線：細い1本線 */
.binder-page + .binder-page .section-inner{ border-top:1px solid color-mix(in srgb, currentColor 16%, transparent); }

/* タブ：英字の下に日本語の小見出し */
.binder-tab{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; line-height:1.2; }
.binder-tab__jp{
  display:block; font-family:var(--jpserif); font-size:11.5px; font-weight:400;
  letter-spacing:.08em; text-transform:none; opacity:.8; white-space:nowrap;
}
@media (min-width:861px){ .binder-tab__jp{ font-size:12px; } }
@media (max-width:860px){ .binder-tab__jp{ font-size:10.5px; } }

/* Staff Styling：3スタイリングを横3列で */
.styling-grid{ grid-template-columns:repeat(3,1fr); gap:40px 28px; }
.styling-card{ display:block; text-decoration:none; color:inherit; }
.styling-card .thumb{ aspect-ratio:3/4; transition:opacity .3s ease; }
.styling-card:hover .thumb{ opacity:.88; }
@media (max-width:860px){ .styling-grid{ grid-template-columns:1fr; } }

/* 注目アイテムの写真（差し替え v2／EMMETIは現状のまま） */
.thumb.featured-img-jamesgrose{ background-image:url("../images/featured-jamesgrose-2026aw-v2.jpg"); }
.thumb.featured-img-schott{ background-image:url("../images/featured-schott-2026aw-v2.jpg"); }
.thumb.featured-img-ssstein{ background-image:url("../images/featured-ssstein-2026aw-v2.jpg"); }
.thumb.featured-img-graphpaper{ background-image:url("../images/featured-graphpaper-2026aw-v2.jpg"); }
.thumb.featured-img-cinquanta{ background-image:url("../images/featured-cinquanta-2026aw-v2.jpg"); }

/* 注目アイテム：カード全体をリンクに */
a.featured-card{ display:block; text-decoration:none; color:inherit; }
a.featured-card .thumb{ transition:opacity .3s ease; }
a.featured-card:hover .thumb{ opacity:.88; }
a.featured-card:hover h3{ text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }

/* 日本語フォントをひと回り太く */
body, button, input,
.intro-lead p:not(.lede), .scale-lead, .featured-card p, .leather-card p, .styling-card p,
.video-card p, .market-promo .desc, .footer-cta p, .footer-links{ font-weight:500; }
h1, h2, h3, .serif, .intro-lead .lede, .kv h1, h2.section-jp, .leather-card h3,
.market-promo h2, .footer-cta h2, .binder-tab__jp{ font-weight:600; }
.intro-lead .lede{ font-weight:600; }
/* 英字のブランド名・ロゴは元の太さのまま */
.featured-card h3, .logo{ font-weight:400; }

/* =====================================================================
   タブの色を統一：選択中＝アイボリー（#E7E1D6）、それ以外＝ダークブラウン（#4B413F）
   パネルは選択中のタブと同じアイボリーでつながる
   ===================================================================== */
.binder-tab{ --c:#4B413F; --fg:#EFE8DE; }
.binder-tab.is-active{ --c:#E7E1D6; --fg:#312523; box-shadow:inset 0 3px 0 #312523; }
#tabbtn-lineup, #tabbtn-featured, #tabbtn-guide, #tabbtn-styling, #tabbtn-video{ --c:#4B413F; --fg:#EFE8DE; }
#tabbtn-lineup.is-active, #tabbtn-featured.is-active, #tabbtn-guide.is-active, #tabbtn-styling.is-active, #tabbtn-video.is-active{
  --c:#E7E1D6; --fg:#312523; box-shadow:inset 0 3px 0 #312523;
}
.binder-panel, .binder-panel[data-active]{ --c:#E7E1D6; --fg:#312523; }
.binder-panel h2.section-title,
.binder-panel[data-active] h2.section-title{ color:#755D4F; }
/* ボタン：アイボリーの地ではブラウンの塗り */
.binder-panel .cta, .binder-panel[data-active] .cta{ background:#312523; color:#F2ECE3; border:1px solid #312523; box-shadow:none; }
.binder-panel .cta:hover, .binder-panel[data-active] .cta:hover{ background:#6B4A3A; border-color:#6B4A3A; color:#F2ECE3; }
/* 動画の再生ボタン・枠線も明るい地に合わせる */
.binder-panel .video-thumb .play{ background:#312523; color:#F2ECE3; }

/* レザージャケットMarket：左に告知ビジュアル、右にテキスト */
.market-promo.has-visual{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; align-items:stretch;
  padding:0; text-align:left;
}
.market-visual{ margin:0; }
.market-visual img{ display:block; width:100%; height:100%; aspect-ratio:1/1; object-fit:cover; }
.market-body{ padding:56px 52px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.market-promo.has-visual .desc{ margin-left:0; margin-right:0; }
@media (max-width:860px){
  .market-promo.has-visual{ grid-template-columns:1fr; }
  .market-body{ padding:32px 24px; }
}

/* Introduction：白っぽいアイボリー（タブの列と同じ #F7F3EE）＋ブラウンの文字 */
main > section.band-sand{ background:#F7F3EE; color:#312523; }
.band-sand h2.section-title{ color:#755D4F; }
.band-sand .intro-lead .lede{ color:#312523; }
.band-sand .intro-lead p:not(.lede){ color:rgba(49,37,35,.68); }
.band-sand .scroll-cue{ color:#312523; }
.band-sand .scroll-cue__label{ color:rgba(49,37,35,.6); }
.band-sand .scroll-cue__line{ background:rgba(49,37,35,.16); }
.band-sand .scroll-cue__line::after{ background:#312523; }
/* Introduction：SCROLL の下の余白を詰める */
.band-sand .section-inner, .band-sand .section-inner.tight{ padding-bottom:24px; }
@media (max-width:860px){ .band-sand .section-inner, .band-sand .section-inner.tight{ padding-bottom:16px; } }

/* TOPスライダーの画像をひと回り大きく（KVの高さを上げ、すき間を少し詰める） */
.kv{ min-height:940px; }
.kv-bg-rows{ gap:28px; padding:28px 0; }
.kv-bg-group{ gap:28px; padding-right:28px; }
@media (max-width:860px){ .kv{ min-height:720px; } }
/* スライダーは1段14枚になったので、2段目の半分ずらしを 1/28 に */
.kv-bg-track:nth-child(2){ animation-delay:calc(var(--kv-speed) / -28); }

/* =====================================================================
   TOP：画像の帯の中央に、ダークブラウンのカード（細い内枠）を置く
   フォント：小さい英字＝Montserrat Regular／メイン英字＝Cormorant SC Medium
             見出し和文＝しっぽり明朝／小さい和文＝源真ゴシック（未導入の環境は Noto Sans JP）
   ※ 変更前のファイルは「backup_20260929_TOP変更前」フォルダに保存
   ===================================================================== */
.kv::before{ display:none; }                         /* 暗いグラデーションは外し、画像をそのまま見せる */
.kv{ align-items:center; justify-content:center; }
.kv-content.kv-card-wrap{
  position:relative; z-index:2; width:100%; max-width:none; margin:0;
  padding:0 24px; display:flex; justify-content:center; text-align:center;
}
.kv-card{
  width:min(720px, 100%);
  background:#342523; color:#F3ECE2;
  padding:84px 72px 64px;
  box-shadow:inset 0 0 0 20px #342523, inset 0 0 0 21px rgba(220,200,170,.7);
  text-align:center;
}
.kv-card__season{
  margin:0 0 14px; font-family:"Montserrat",sans-serif; font-weight:400;
  font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:#F3ECE2;
}
.kv-card__title{
  margin:0 0 10px; font-family:"Cormorant SC","Cormorant Garamond",serif; font-weight:500;
  font-size:clamp(40px,5.4vw,64px); line-height:1.05; letter-spacing:.04em; color:#FFFFFF;
}
.kv-card__copy{
  margin:0 0 30px; font-family:"Shippori Mincho",serif; font-weight:700;
  font-size:clamp(20px,2.2vw,26px); letter-spacing:.06em; color:#FFFFFF; line-height:1.5;
}
.kv-card__lead{
  margin:0 auto 44px; max-width:540px; padding:18px 0;
  border-top:1px solid rgba(243,236,226,.75); border-bottom:1px solid rgba(243,236,226,.75);
  font-family:"GenShinGothic","源真ゴシック","Noto Sans JP",sans-serif; font-weight:400;
  font-size:15px; letter-spacing:.14em; color:#F3ECE2;
}
.kv-card__cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 20px; border:1px solid rgba(243,236,226,.8);
  font-family:"GenShinGothic","源真ゴシック","Noto Sans JP",sans-serif; font-weight:500;
  font-size:13px; letter-spacing:.06em; color:#FFFFFF; text-decoration:none;
  transition:background-color .25s ease, color .25s ease;
}
.kv-card__cta span{ font-family:"Montserrat",sans-serif; letter-spacing:0; }
.kv-card__cta:hover{ background:#F3ECE2; color:#342523; }
@media (max-width:860px){
  .kv-card{ padding:56px 28px 44px; box-shadow:inset 0 0 0 12px #342523, inset 0 0 0 13px rgba(220,200,170,.7); }
  .kv-card__lead{ font-size:13px; letter-spacing:.08em; }
}
.kv h1.kv-card__copy{
  font-family:"Shippori Mincho",serif; font-weight:700; font-size:clamp(20px,2.2vw,26px);
  letter-spacing:.06em; line-height:1.5; color:#FFFFFF; margin:0 0 30px;
}
/* TOPスライダーの画像を少し小さく（KVの高さ 940px → 820px） */
.kv{ min-height:820px; }
@media (max-width:860px){ .kv{ min-height:680px; } }
/* TOP背景に薄い白のフェードをかけ、中央のカードを引き立てる */
.kv::before{
  display:block; content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:rgba(255,255,255,.2);
}
/* TOPスライダー：真ん中の段だけ逆方向（左→右）に流す */
.kv-bg-track:nth-child(2){ animation-direction:reverse; }

/* Pick Up Brands：商品画像の上にブランドロゴを重ねる（ARKnetsのブランドロゴ画像を直接参照） */
.mosaic-img.photo{ position:relative; }
.mosaic-logo{
  position:absolute; top:10px; left:10px;
  width:46%; max-height:22%; object-fit:contain; object-position:left top;
  filter:brightness(0); opacity:.85; pointer-events:none;
}
/* ロゴを画像の中央に・白で表示（白地の商品画像でも読めるよう、うすく暗いベールを重ねる） */
.mosaic-img.photo::after{
  content:""; position:absolute; inset:0; background:rgba(30,22,20,.38); pointer-events:none;
  transition:background-color .3s ease;
}
.mosaic-tile:hover .mosaic-img.photo::after{ background:rgba(30,22,20,.2); }
.mosaic-logo{
  top:50%; left:50%; transform:translate(-50%,-50%);
  width:62%; max-height:34%; object-position:center;
  filter:brightness(0) invert(1); opacity:.95; z-index:1;
}
/* ロゴの見た目の大きさを YOKE 基準にそろえる（ロゴごとの余白・形の差を --logo-k で補正） */
.mosaic-logo{ transform:translate(-50%,-50%) scale(var(--logo-k,1)); }
/* Pick Up Brands：写真の下のブランド名を中央揃えに */
.mosaic-name{ text-align:center; }
/* Featured Brands のブランド名：TOPの「Leather Jackets」と同じ Cormorant SC Medium に */
.featured-card h3{
  font-family:"Cormorant SC","Cormorant Garamond",serif; font-weight:500;
  font-size:26px; letter-spacing:.06em; text-transform:none;
}

/* Featured Brands：別注マーク（写真の右上） */
.featured-card .thumb{ position:relative; }
.featured-badge{
  position:absolute; top:14px; right:14px; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  width:64px; height:64px;
  background:#312523; color:#F2ECE3;
  box-shadow:inset 0 0 0 3px #312523, inset 0 0 0 4px rgba(242,236,227,.55);
  font-family:"Shippori Mincho",serif; font-weight:600; font-size:15px; letter-spacing:.1em; line-height:1;
}
.featured-badge small{
  font-family:"Montserrat",sans-serif; font-weight:400; font-size:8px; letter-spacing:.12em; line-height:1; opacity:.85;
}
@media (max-width:860px){ .featured-badge{ width:56px; height:56px; font-size:13px; top:10px; right:10px; } }
/* 別注マーク：丸型・ベージュ */
.featured-badge{
  border-radius:50%;
  background:#E7E1D6; color:#312523;
  box-shadow:inset 0 0 0 3px #E7E1D6, inset 0 0 0 4px rgba(49,37,35,.45);
}
.featured-badge small{ opacity:.8; }
/* 別注マーク：落ち着いた金色（ブラス／シャンパンゴールド） */
.featured-badge{
  background:linear-gradient(135deg,#D8C08E 0%,#B8975E 55%,#A5854F 100%);
  color:#2B201E;
  box-shadow:inset 0 0 0 3px rgba(0,0,0,0), inset 0 0 0 4px rgba(43,32,30,.45), 0 2px 6px rgba(0,0,0,.18);
}

/* 別注マーク：楕円のステッカー風（少し傾けて貼ったように） */
.featured-badge{
  width:118px; height:auto; top:12px; right:10px;
  display:block; padding:0; border-radius:0;
  background:none; box-shadow:none; color:inherit;
  transform:rotate(-12deg);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.22));
}
.featured-badge svg{ display:block; width:100%; height:auto; overflow:visible; }
.featured-badge .fb-fill{ fill:#9C6B45; }                 /* コニャックレザー */
.featured-badge .fb-line{ fill:none; stroke:#2B201E; stroke-width:1.2; }
.featured-badge .fb-dot{ fill:#2B201E; }
.featured-badge text{ fill:#2B201E; }
.featured-badge .fb-arc{ font-family:"Montserrat",sans-serif; font-size:7.6px; font-weight:500; letter-spacing:1.3px; }
.featured-badge .fb-main{ font-family:"Shippori Mincho",serif; font-size:23px; font-weight:700; letter-spacing:2px; }
.featured-badge .fb-sub{ font-family:"Montserrat",sans-serif; font-size:6.8px; font-weight:500; letter-spacing:1.6px; }
@media (max-width:860px){ .featured-badge{ width:96px; top:8px; right:6px; } }
/* 別注マーク：正円・小さめ・時計回りに少し傾ける */
.featured-badge{ width:86px; top:12px; right:12px; transform:rotate(10deg); }
.featured-badge .fb-arc{ font-size:8.2px; letter-spacing:1.1px; }
.featured-badge .fb-main{ font-size:22px; letter-spacing:1.5px; }
@media (max-width:860px){ .featured-badge{ width:72px; top:8px; right:8px; } }
/* タブの日本語小見出し：本文と同じゴシック体（Noto Sans JP）にそろえる */
.binder-tab__jp{ font-family:"GenShinGothic","源真ゴシック","Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif; font-weight:500; letter-spacing:.06em; }
/* タブの英字を1px大きく（PC 11.5→12.5px／スマホ 10.5→11.5px） */
.binder-tab{ font-size:11.5px; }
@media (min-width:861px){ .binder-tab{ font-size:12.5px; } }
/* ゴシック体（本文・説明文）を全体的にひと段階細く（500 → 400） */
body, button, input,
.intro-lead p:not(.lede), .scale-lead, .featured-card p, .leather-card p, .styling-card p,
.video-card p, .market-promo .desc, .footer-cta p, .footer-links, .binder-tab__jp{ font-weight:400; }

/* =====================================================================
   スクロール演出：表示中でない項目を薄くする（白っぽいフェード）のをやめ、
   各要素が画面に入ったときに下からふわっと現れるように
   ===================================================================== */
.binder-page, .binder-page:not(.is-active){ opacity:1; }
.reveal{
  opacity:0; transform:translateY(28px);
  transition:opacity .9s ease, transform 1s cubic-bezier(.22,1,.36,1);
  will-change:opacity, transform;
}
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* 注目アイテム：ホバーで写真だけがゆっくり拡大（下線・薄くなる演出はやめる） */
a.featured-card .thumb{ overflow:hidden; opacity:1 !important; }
a.featured-card .thumb::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:inherit; background-size:cover; background-position:center;
  transform:scale(1); transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}
a.featured-card:hover .thumb::before{ transform:scale(1.05); }
a.featured-card:hover h3{ text-decoration:none; }
.featured-badge{ z-index:2; }
/* TOP背景のフェードを白 → 黒に */
.kv::before{ background:rgba(0,0,0,.2); }

/* 動画でチェック：余白を少し詰める */
#tab-video .section-inner{ padding-top:64px; padding-bottom:max(64px, 28vh); }
#tab-video h2.section-jp{ margin-bottom:32px; }
#tab-video .video-grid{ margin-top:32px; }
@media (max-width:860px){
  #tab-video .section-inner{ padding-top:48px; padding-bottom:48px; }
  #tab-video .video-grid{ margin-top:24px; }
}

/* Montserrat（英字ラベル）を全体的に一段階太く：400→500／500→600 */
.kv-card__season{ font-weight:500; }
.section-title, .scale-subhead, .scroll-cue__label,
.mosaic-tile:not(.featured) .mosaic-name, .cta, .kv-card__cta span,
.tag, .staff, .jacket-brand, .market-tag,
.site-nav span, .binder-tab > span,
.featured-badge .fb-arc, .featured-badge .fb-sub, .featured-badge textPath{ font-weight:600; }
body h2.section-title, body .leather-card .tag{ font-weight:600 !important; }

/* スタッフ名・着用ブランド：本文と同じ日本語ゴシックに */
body .styling-card .staff, body .styling-card .jacket-brand{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif !important;
  font-size:12px; letter-spacing:.04em; text-transform:none; line-height:1.7;
}
body .styling-card .staff{ font-weight:500 !important; }
body .styling-card .jacket-brand{ font-weight:400 !important; }

/* Featured Brands 画像差し替え（v3・グレー背景の吊り撮り） */
.thumb.featured-img-emmeti{ background-image:url("../images/featured-emmeti-2026aw-v3.jpg"); }
.thumb.featured-img-jamesgrose{ background-image:url("../images/featured-jamesgrose-2026aw-v3.jpg"); }
.thumb.featured-img-schott{ background-image:url("../images/featured-schott-2026aw-v3.jpg"); }
.thumb.featured-img-ssstein{ background-image:url("../images/featured-ssstein-2026aw-v3.jpg"); }
.thumb.featured-img-graphpaper{ background-image:url("../images/featured-graphpaper-2026aw-v3.jpg"); }
.thumb.featured-img-cinquanta{ background-image:url("../images/featured-cinquanta-2026aw-v3.jpg"); }

/* Featured Items：商品名・価格の表示 */
a.featured-card{ display:flex; flex-direction:column; }
a.featured-card .body{ flex:1; display:flex; flex-direction:column; padding:22px 4px 0; }
.featured-card h3{ margin:0; }
.featured-card .fc-name{
  margin:8px 0 0; opacity:1;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif; font-weight:500;
  font-size:13px; letter-spacing:.04em; line-height:1.6; color:#312523;
}
.featured-card .fc-desc{ margin:14px 0 0; font-size:13px; line-height:1.9; opacity:.8; text-align:left; }
.featured-card .fc-meta{
  margin-top:auto; padding-top:18px;
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  border-top:1px solid rgba(49,37,35,.18);
}
.featured-card .fc-desc{ margin-bottom:20px; }
.featured-card .fc-price{
  font-family:"Cormorant SC",serif; font-weight:500; font-size:22px; letter-spacing:.02em; color:#312523; line-height:1;
}
.featured-card .fc-price small{
  font-family:"Noto Sans JP",sans-serif; font-size:10.5px; font-weight:400; letter-spacing:.04em; margin-left:4px; opacity:.7;
}
.featured-card .fc-more{
  font-family:"Noto Sans JP",sans-serif; font-size:11.5px; letter-spacing:.08em; color:#312523; opacity:.75;
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
}
.featured-card .fc-more span{ display:inline-block; transition:transform .4s cubic-bezier(.22,1,.36,1); }
a.featured-card:hover .fc-more{ opacity:1; }
a.featured-card:hover .fc-more span{ transform:translateX(4px); }
@media (max-width:860px){
  .featured-card .fc-price{ font-size:19px; }
  .featured-card .fc-more{ font-size:11px; }
}
a.featured-card .thumb{ width:100%; flex-shrink:0; }

/* Market：開催日程・会場 */
.market-info{ margin:22px 0 26px; padding:0; border-top:1px solid rgba(49,37,35,.18); }
.market-info > div{ display:grid; grid-template-columns:5.5em 1fr; gap:12px; padding:14px 0; border-bottom:1px solid rgba(49,37,35,.18); }
.market-info dt{ margin:0; font-family:"Noto Sans JP",sans-serif; font-weight:500; font-size:12.5px; letter-spacing:.06em; }
.market-info dd{ margin:0; font-family:"Noto Sans JP",sans-serif; font-weight:400; font-size:13.5px; line-height:1.8; letter-spacing:.03em; }
.market-info .market-addr{ font-size:12px; opacity:.75; }

/* 英字の明朝体（セリフ）を Cormorant Garamond 400 に統一 */
:root{ --caslon:cormorant-garamond,"Cormorant Garamond",serif; --didone:var(--caslon); }
.logo, .kv .kv-card__title, .featured-card h3, .featured-card .fc-price,
.scale-badge b, .market-body h2{
  font-family:cormorant-garamond,"Cormorant Garamond",serif !important;
  font-weight:600 !important;
}

/* TOPカード：背景 #1e1211・不透明度90%（文字や線は不透明のまま） */
.kv-card{
  background:rgba(30,18,17,.9);
  box-shadow:none;
  outline:1px solid rgba(220,200,170,.7); outline-offset:-21px;
}
@media (max-width:860px){
  .kv-card{ box-shadow:none; outline-offset:-13px; }
}

/* Featured Items v2：左揃え・ブランド名／商品名＋価格／丸矢印／線／説明 */
a.featured-card .body{ padding:26px 6px 0; text-align:left; }
.featured-card h3{
  text-align:left; font-size:28px !important; letter-spacing:.02em !important;
  text-transform:uppercase !important; line-height:1.15; color:#2A1D1B;
  font-weight:500 !important;
}
.featured-card .fc-row{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-top:16px; padding-bottom:18px; border-bottom:1px solid #3A2C2A;
}
.featured-card .fc-info{ min-width:0; }
.featured-card .fc-name{
  margin:0; font-family:cormorant-garamond,"Cormorant Garamond",serif !important; font-weight:500 !important;
  font-size:17px; letter-spacing:.04em; text-transform:uppercase; line-height:1.35; color:#7A6E68; opacity:1;
}
.featured-card .fc-price{
  margin:6px 0 0; font-family:cormorant-garamond,"Cormorant Garamond",serif !important; font-weight:600 !important;
  font-size:19px; letter-spacing:.04em; color:#7A6E68; line-height:1.3; opacity:1;
}
.featured-card .fc-price small{
  font-family:inherit; font-size:13px; font-weight:500; letter-spacing:.02em; margin-left:6px; opacity:1;
}
.featured-card .fc-arrow{
  flex:0 0 auto; width:48px; height:48px; border-radius:50%;
  border:1px solid #2A1D1B; color:#2A1D1B;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background-color .35s ease, color .35s ease;
}
.featured-card .fc-arrow svg{ width:22px; height:11px; transition:transform .4s cubic-bezier(.22,1,.36,1); }
a.featured-card:hover .fc-arrow{ background:#2A1D1B; color:#F3ECE2; }
a.featured-card:hover .fc-arrow svg{ transform:translateX(3px); }
.featured-card .fc-desc{ margin:18px 0 0; padding:0 4px; font-size:13px; line-height:1.9; text-align:left; opacity:.85; color:#2A1D1B; }
@media (max-width:860px){
  .featured-card h3{ font-size:24px !important; }
  .featured-card .fc-name{ font-size:15px; }
  .featured-card .fc-price{ font-size:17px; }
  .featured-card .fc-arrow{ width:42px; height:42px; }
}
.swatch.eco{ background-image:url("../images/leather-eco.jpg"); }

/* Featured Items：商品名・価格を見出し英字（FEATURED ITEMS）と同じ Montserrat 600 に */
.featured-card .fc-name, .featured-card .fc-price, .featured-card .fc-price small{
  font-family:"Montserrat","Helvetica Neue",Arial,sans-serif !important;
  font-weight:600 !important; text-transform:uppercase; color:#755D4F;
}
.featured-card .fc-name{ font-size:12px; letter-spacing:.24em; line-height:1.7; }
.featured-card .fc-price{ margin-top:8px; font-size:13px; letter-spacing:.14em; }
.featured-card .fc-price small{ font-size:10px; letter-spacing:.14em; margin-left:6px; text-transform:none; }
@media (max-width:860px){
  .featured-card .fc-name{ font-size:11.5px; }
  .featured-card .fc-price{ font-size:12.5px; }
}
/* 商品名・価格：字間を狭く、ウェイトを細く */
.featured-card .fc-name, .featured-card .fc-price, .featured-card .fc-price small{ font-weight:500 !important; }
.featured-card .fc-name{ letter-spacing:.1em; }
.featured-card .fc-price{ letter-spacing:.06em; }
.featured-card .fc-price small{ letter-spacing:.04em; }
/* 矢印ボタンを小さく */
.featured-card .fc-arrow{ width:36px; height:36px; }
.featured-card .fc-arrow svg{ width:16px; height:8px; }
@media (max-width:860px){ .featured-card .fc-arrow{ width:34px; height:34px; } }
/* ブランド名〜商品名〜価格の間隔を詰める */
.featured-card h3{ line-height:1.05; }
.featured-card .fc-row{ margin-top:8px; }
.featured-card .fc-name{ line-height:1.4; }
.featured-card .fc-price{ margin-top:3px; line-height:1.3; }
/* 間隔を少し戻す */
.featured-card h3{ line-height:1.1; }
.featured-card .fc-row{ margin-top:12px; }
.featured-card .fc-price{ margin-top:6px; }
/* 説明文の左端を商品名・線とそろえる */
.featured-card .fc-desc{ padding:0; }
.featured-card h3{ margin-left:-1px; }

/* スタッフの着こなし：スタッフ名・着用ブランドを Featured Items の商品名と同じ書体に */
body .styling-card .staff, body .styling-card .jacket-brand{
  font-family:"Montserrat","Helvetica Neue",Arial,sans-serif !important;
  font-weight:500 !important; text-transform:uppercase;
  font-size:12px; letter-spacing:.1em; line-height:1.6;
}
body .styling-card .jacket-brand{ margin-top:4px; opacity:.75; }
@media (max-width:860px){
  body .styling-card .staff, body .styling-card .jacket-brand{ font-size:11.5px; }
}

/* スタッフの着こなし：スタッフ名・ブランドを写真の下部に重ねる */
.styling-card .thumb{ position:relative; overflow:hidden; opacity:1 !important; }
.styling-card .thumb::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:38%;
  background:linear-gradient(to bottom, rgba(20,14,13,0) 0%, rgba(20,14,13,.55) 60%, rgba(20,14,13,.82) 100%);
  pointer-events:none;
}
.styling-card .styling-cap{ position:absolute; left:22px; right:18px; bottom:18px; z-index:1; }
body .styling-card .styling-cap .staff, body .styling-card .styling-cap .jacket-brand{
  font-family:"Montserrat","Helvetica Neue",Arial,sans-serif !important;
  font-weight:400 !important; text-transform:none !important;
  font-size:13px; letter-spacing:.06em; line-height:1.6; color:#FFFFFF !important; opacity:1 !important; margin:0;
}
.styling-card > p{ margin-top:18px; text-align:left; }
.styling-card:hover .thumb{ opacity:1; }
@media (max-width:860px){
  body .styling-card .styling-cap .staff, body .styling-card .styling-cap .jacket-brand{ font-size:12.5px; }
  .styling-card .styling-cap{ left:18px; bottom:14px; }
}

/* スタッフの着こなし：ホバーで写真がゆっくり拡大（Featured Itemsと同じ動き） */
.styling-card .thumb::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:inherit; background-size:cover; background-position:top center;
  transform:scale(1); transition:transform 1.2s cubic-bezier(.22,1,.36,1);
}
.styling-card:hover .thumb::before{ transform:scale(1.05); }
.styling-card .thumb::after{ z-index:0; }
.styling-card .styling-cap{ z-index:2; }


/* ヘッダー：左に 2026 AUTUMN / WINTER ＋ Leather Jackets、右にナビ */
.site-header{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:18px max(40px, calc((100% - 1200px) / 2)) !important;
  background:#FFFFFF !important; border-bottom:none !important; box-shadow:none !important;
}
.site-header .logo{ display:none; }
.hd-brand{ display:flex; flex-direction:column; text-decoration:none; color:#312523; line-height:1; }
.hd-season{
  font-family:"Montserrat",sans-serif; font-weight:500; font-size:11px; letter-spacing:.08em; margin-bottom:6px;
}
.hd-title{
  font-family:cormorant-garamond,"Cormorant Garamond",serif; font-weight:500; font-size:38px; letter-spacing:.01em; line-height:1;
}
.site-header .site-nav{ display:flex; gap:40px; }
.site-header .site-nav a{
  font-family:"Montserrat",sans-serif; font-weight:600; font-size:11.5px; letter-spacing:.24em;
  text-transform:uppercase; color:#312523; text-decoration:none; transition:opacity .3s ease;
}
.site-header .site-nav a:hover{ opacity:.55; }
@media (max-width:860px){
  .site-header{ padding:12px 16px !important; gap:12px; flex-wrap:wrap; }
  .hd-season{ font-size:9.5px; margin-bottom:4px; }
  .hd-title{ font-size:26px; }
  .site-header .site-nav{ gap:16px; }
  .site-header .site-nav a{ font-size:9.5px; letter-spacing:.14em; }
}

/* Introduction の文章をすべて明朝体に */
.band-sand .intro-lead p, .band-sand .intro-lead p:not(.lede){
  font-family:"Shippori Mincho","Yu Mincho","Hiragino Mincho ProN",serif !important;
}
.band-sand .intro-lead p:not(.lede){ font-weight:500; letter-spacing:.06em; line-height:2.1; }

/* Featured Items 画像：サーバーにアップ済みのPNGを参照 */
.thumb.featured-img-emmeti{ background-image:url("../images/emmeti.png"); }
.thumb.featured-img-jamesgrose{ background-image:url("../images/jamesgrose.png"); }
.thumb.featured-img-schott{ background-image:url("../images/schott%20.png"); }
.thumb.featured-img-ssstein{ background-image:url("../images/ssstein.png"); }
.thumb.featured-img-graphpaper{ background-image:url("../images/graphpaper.png"); }
.thumb.featured-img-cinquanta{ background-image:url("../images/cinquata.png"); }

/* ブランド名は正式な大文字・小文字表記のまま表示（Schott／ssstein／Graphpaper） */
.featured-card h3{ text-transform:none !important; }

/* ボタンの矢印：擬似要素ではなく文字として表示（TOPのボタンと同じ ⟶） */
a.cta::after{ content:none !important; display:none !important; }
a.cta{ white-space:nowrap; }
a.cta .cta-arrow{ display:inline-block; margin-left:14px; font-family:"Helvetica Neue",Arial,sans-serif; letter-spacing:0; transition:transform .4s cubic-bezier(.22,1,.36,1); }
a.cta:hover .cta-arrow{ transform:translateX(4px); }

/* 別注ラベルを少し小さく */
.featured-badge{ width:72px !important; top:10px; right:10px; }
@media (max-width:860px){ .featured-badge{ width:60px !important; top:8px; right:8px; } }

/* Leather Jacket Market の見出しを少し大きく */
.market-body h2{ font-size:28px !important; line-height:1.2; }
@media (max-width:860px){ .market-body h2{ font-size:25px !important; } }

/* スタッフの着こなし：8枠（PC 4列×2段／タブレット2列／スマホ1列） */
.styling-grid{ grid-template-columns:repeat(4,1fr) !important; gap:40px 22px !important; }
body .styling-card .styling-cap .staff, body .styling-card .styling-cap .jacket-brand{ font-size:12px; }
.styling-card .styling-cap{ left:16px; right:12px; bottom:14px; }
.styling-card > p{ font-size:12.5px; }
@media (max-width:1100px){ .styling-grid{ grid-template-columns:repeat(2,1fr) !important; } }
@media (max-width:600px){ .styling-grid{ grid-template-columns:1fr !important; } }

/* =====================================================================
   PC（1025px〜）：タブを画面の右端に縦書きで配置。選択中のタブが右端から出てくる
   ===================================================================== */
@media (min-width:1025px){
  .binder{ flex-direction:row !important; }
  .binder-tabs{
    order:2; flex:0 0 76px; width:76px;
    flex-direction:column !important; align-items:flex-end !important; justify-content:flex-start !important;
    gap:6px !important; padding:96px 0 0 0 !important; overflow:visible;
  }
  .binder-tab, .binder-tab.is-active{
    writing-mode:vertical-rl; text-orientation:mixed;
    flex-direction:row !important; align-items:center !important; justify-content:center !important;
    gap:6px !important; white-space:nowrap;
    width:56px; padding:22px 0 !important;
    border-radius:8px 0 0 8px !important;
    transition:width .7s var(--ease-smooth), background-color .7s var(--ease-smooth), color .7s var(--ease-smooth) !important;
  }
  .binder-tab.is-active{
    width:76px;                                   /* 選択中は右端からせり出す */
    box-shadow:inset 3px 0 0 #312523 !important;
  }
  .binder-tab > span{ font-size:12px; letter-spacing:.2em; }
  .binder-tab .binder-tab__jp{ font-size:11px; letter-spacing:.12em; }
  .binder-panel{ flex:1 1 auto; min-width:0; border-radius:0 !important; }
  .binder-scroll{ margin-top:0 !important; padding-top:110px !important; }
}
/* 縦タブ調整：英字と和文を横並び（2列）にして高さを抑え、画面内に5つ収める */
@media (min-width:1025px){
  .binder-tabs{ justify-content:center !important; padding:24px 0 !important; gap:4px !important; }
  .binder-tab, .binder-tab.is-active{
    flex-direction:column !important;           /* 縦書き時は column＝横並び */
    gap:4px !important; padding:14px 0 !important; width:58px;
  }
  .binder-tab.is-active{ width:74px; }
  .binder-tab > span{ font-size:11px; letter-spacing:.12em; }
  .binder-tab .binder-tab__jp{ font-size:10.5px; letter-spacing:.06em; }
}
@media (min-width:1025px) and (max-height:760px){
  .binder-tab > span{ font-size:10px; letter-spacing:.08em; }
  .binder-tab .binder-tab__jp{ font-size:10px; letter-spacing:0; }
  .binder-tab, .binder-tab.is-active{ padding:10px 0 !important; }
}
/* 縦タブ：帯の背景はパネルと同色、角丸なし、タブ間を広めに */
@media (min-width:1025px){
  .binder-tabs, .binder-tabs.is-stuck{ background:#E7E1D6 !important; gap:14px !important; }
  .binder-tab, .binder-tab.is-active{ border-radius:0 !important; }
}
@media (min-width:1025px) and (max-height:760px){
  .binder-tabs{ gap:8px !important; }
}

/* 縦タブの色：選択中は濃いブラウンで背景と区別、非選択はトープ */
@media (min-width:1025px){
  .binder-tab{ --c:#7A6D65; --fg:#F7F3EE; }
  .binder-tab:hover:not(.is-active){ --c:#5F534D; }
  .binder-tab.is-active{ --c:#312523; --fg:#F3ECE2; box-shadow:inset 3px 0 0 #B89A6A !important; }
}
@media (min-width:1025px){
  #tabbtn-lineup, #tabbtn-featured, #tabbtn-guide, #tabbtn-styling, #tabbtn-video{ --c:#7A6D65; --fg:#F7F3EE; }
  #tabbtn-lineup:hover, #tabbtn-featured:hover, #tabbtn-guide:hover, #tabbtn-styling:hover, #tabbtn-video:hover{ --c:#5F534D; }
  #tabbtn-lineup.is-active, #tabbtn-featured.is-active, #tabbtn-guide.is-active, #tabbtn-styling.is-active, #tabbtn-video.is-active{ --c:#312523; --fg:#F3ECE2; }
}

/* Leather Guide：iPadサイズ以下は2列 */
@media (max-width:1024px){
  .guide-grid{ grid-template-columns:repeat(2,1fr) !important; gap:24px 16px !important; }
}
@media (max-width:600px){
  .guide-grid{ gap:20px 12px !important; }
  .leather-card h3{ font-size:14px; }
  .leather-card p{ font-size:12px; }
}

/* スマホ：左右の余白を全セクションで 20px に統一 */
@media (max-width:860px){
  :root{ --sp-side:20px; }
  .band-sand .wrap, .band-blush .wrap, .binder-page .wrap, .binder-page .section-inner{
    padding-left:var(--sp-side) !important; padding-right:var(--sp-side) !important;
  }
  .intro-lead, .market-promo{ margin-left:0 !important; margin-right:0 !important; width:auto !important; }
  .kv-content.kv-card-wrap{ padding-left:var(--sp-side) !important; padding-right:var(--sp-side) !important; }
  .binder-tabs{ padding-left:var(--sp-side) !important; padding-right:var(--sp-side) !important; }
}

/* スマホ：スタッフの着こなしを2列に */
@media (max-width:600px){
  .styling-grid{ grid-template-columns:repeat(2,1fr) !important; gap:28px 12px !important; }
  body .styling-card .styling-cap .staff, body .styling-card .styling-cap .jacket-brand{ font-size:10px !important; letter-spacing:.02em !important; line-height:1.5; }
  .styling-card .styling-cap{ left:10px; right:8px; bottom:10px; }
  .styling-card .thumb::after{ height:48%; }
  .styling-card > p{ font-size:11.5px; line-height:1.8; margin-top:12px; }
}

/* Pick Up Brands：列幅を常に均等に（ブランド名の長さで列幅が変わらないように） */
.mosaic-grid{ grid-template-columns:repeat(5, minmax(0,1fr)) !important; }
@media (max-width:1024px){ .mosaic-grid{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; } }
.mosaic-tile{ min-width:0; }
.mosaic-name{ overflow-wrap:anywhere; }
@media (max-width:600px){
  .mosaic-grid{ gap:24px 10px !important; }
  .mosaic-name{ font-size:9.5px !important; letter-spacing:.08em !important; line-height:1.4; }
}

/* 革の個性：スマホは1列・横長カード（左に革の写真、右にテキスト） */
@media (max-width:600px){
  .guide-grid{ grid-template-columns:1fr !important; gap:14px !important; }
  .leather-card{
    display:grid !important; grid-template-columns:36% 1fr; grid-template-rows:auto auto 1fr;
    column-gap:14px; align-items:start; text-align:left !important; padding:12px !important;
  }
  .leather-card .swatch{
    grid-column:1; grid-row:1 / span 3; width:100% !important; height:100% !important; min-height:110px;
    margin:0 !important; border-radius:0 !important; align-self:stretch;
  }
  .leather-card .tag{ grid-column:2; grid-row:1; margin:2px 0 6px !important; font-size:9.5px !important; letter-spacing:.1em !important; text-align:left; }
  .leather-card h3{ grid-column:2; grid-row:2; margin:0 0 6px !important; font-size:14px !important; line-height:1.5; text-align:left; }
  .leather-card p{ grid-column:2; grid-row:3; margin:0 !important; font-size:11.5px !important; line-height:1.75; text-align:left; }
}
@media (max-width:600px){
  .guide-grid{ grid-template-columns:minmax(0,1fr) !important; }
  .leather-card{ grid-template-columns:36% minmax(0,1fr) !important; min-width:0; }
  .leather-card .tag, .leather-card h3, .leather-card p{ white-space:normal !important; min-width:0; }
}

/* タブを若干角丸に（上タブ＝上側の角／PCの縦タブ＝左側の角） */
.binder-tab, .binder-tab.is-active{ border-radius:6px 6px 0 0 !important; }
@media (min-width:1025px){
  .binder-tab, .binder-tab.is-active{ border-radius:6px 0 0 6px !important; }
}

/* 革の個性：カード全体をリンクに。ホバーでカードが少し大きく */
a.leather-card{ display:block; text-decoration:none; color:inherit;
  transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s cubic-bezier(.22,1,.36,1); will-change:transform; }
a.leather-card:hover{ transform:scale(1.03); box-shadow:0 14px 30px rgba(49,37,35,.12); z-index:1; position:relative; }
@media (hover:none){ a.leather-card:hover{ transform:none; box-shadow:none; } }

/* 革の個性：見出しを改行させない（スマホは文字サイズを調整して1行に収める） */
.leather-card h3{ white-space:nowrap; }
@media (max-width:600px){
  .leather-card h3{ font-size:min(13px, 3.1vw) !important; letter-spacing:0 !important; white-space:nowrap !important; }
}

/* Pick Up Brands：ブランド名の太さを統一（細い方＝600に） */
.mosaic-tile .mosaic-name, .mosaic-tile.featured .mosaic-name{ font-weight:600 !important; }

/* 縦タブ（PC）：英字の字間を少し広げる */
@media (min-width:1025px){
  .binder-tab > span{ letter-spacing:.2em !important; }
}
@media (min-width:1025px) and (max-height:760px){
  .binder-tab > span{ letter-spacing:.14em !important; }
}

/* 動画でチェック：動画下のタイトルを左揃えに */
.video-card, .video-card p{ text-align:left !important; }

/* 革の個性：リード文の色を薄く */
#tab-guide .scale-lead{ color:#8A7E76 !important; opacity:1 !important; }

/* 横並びタブ（iPad・スマホ）：タブ同士の間隔を少し広げる */
@media (max-width:1024px){ .binder-tabs{ gap:12px !important; } }
@media (max-width:600px){ .binder-tabs{ gap:8px !important; } }

/* 改行位置のコントロール：.nb のかたまり単位で折り返す（「、」の後で改行） */
.nb{ display:inline-block; }

/* Pick Up Brands：ブランド名は正式表記のまま（大文字に変換しない） */
.mosaic-name, .mosaic-tile .mosaic-name{ text-transform:none !important; }

/* Featured Items 画像：_2 版に差し替え */
.thumb.featured-img-emmeti{ background-image:url("../images/emmeti_2.png"), url("../images/emmeti.png"); }
.thumb.featured-img-jamesgrose{ background-image:url("../images/jamesgrose_2.png"), url("../images/jamesgrose.png"); }
.thumb.featured-img-schott{ background-image:url("../images/schott_2.png"), url("../images/schott%20.png"); }
.thumb.featured-img-ssstein{ background-image:url("../images/ssstein_2.png"), url("../images/ssstein.png"); }
.thumb.featured-img-graphpaper{ background-image:url("../images/graphpaper_2.png"), url("../images/graphpaper.png"); }
.thumb.featured-img-cinquanta{ background-image:url("../images/cinquata_2.png"), url("../images/cinquata.png"); }

/* サイトフッター（ARKnets 共通ナビ）：コピーライトの上 */
.ark-footer{ background:#FFFFFF; border-top:1px solid rgba(51,36,35,.1); }
.ark-footer__inner{ max-width:1200px; margin:0 auto; padding:64px 40px 56px; display:flex; justify-content:space-between; align-items:flex-start; gap:48px; }
.ark-footer__logo img{ display:block; width:280px; height:auto; }
.ark-footer__nav{ display:grid; grid-template-columns:repeat(4, minmax(150px, 220px)); column-gap:20px; row-gap:0; }
.ark-footer__nav a{
  display:block; padding:12px 0 16px; margin-bottom:28px;
  border-bottom:1px solid #DADADA; color:#222; text-decoration:none;
  font-family:"Lato","Montserrat","Helvetica Neue",Arial,sans-serif; font-weight:600; font-size:15px; letter-spacing:.01em;
  transition:opacity .3s ease;
}
.ark-footer__nav a:hover{ opacity:.55; }
@media (max-width:1024px){
  .ark-footer__inner{ flex-direction:column; align-items:center; padding:48px 24px 32px; gap:32px; }
  .ark-footer__nav{ grid-template-columns:repeat(4, 1fr); width:100%; }
}
@media (max-width:600px){
  .ark-footer__logo img{ width:200px; }
  .ark-footer__nav{ grid-template-columns:repeat(2, 1fr); column-gap:16px; }
  .ark-footer__nav a{ font-size:13px; margin-bottom:16px; padding:10px 0 12px; }
}

/* PAGE TOP（フッターの上） */
.page-top{ background:#FFFFFF; text-align:center; padding:56px 0 40px; }
.page-top a{ display:inline-flex; flex-direction:column; align-items:center; gap:22px; color:#222; text-decoration:none; }
.page-top__line{ display:block; width:1px; height:58px; background:#222; transform-origin:bottom; transition:transform .5s cubic-bezier(.22,1,.36,1); }
.page-top__label{ font-family:"Lato","Montserrat","Helvetica Neue",Arial,sans-serif; font-weight:400; font-size:15px; letter-spacing:.02em; }
.page-top a:hover .page-top__line{ transform:scaleY(1.25); }
.page-top a:hover{ opacity:.7; }
@media (max-width:600px){ .page-top{ padding:40px 0 28px; } .page-top__line{ height:44px; } .page-top__label{ font-size:13px; } }

/* =====================================================================
   ヘッダー：左＝シーズン／中央＝Leather Jackets／右＝ARKnets（リンク）
   ===================================================================== */
.site-header.lj-header{
  position:sticky !important; top:0; z-index:50;
  display:grid !important; grid-template-columns:1fr auto 1fr; align-items:center;
  height:72px; padding:0 max(32px, calc((100% - 1320px) / 2)) !important;
  background:rgba(255,255,255,.96) !important; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(49,37,35,.08) !important; box-shadow:none !important;
}
.lj-header__season{
  justify-self:start; font-family:"Montserrat",sans-serif; font-weight:500; font-size:11.5px;
  letter-spacing:.14em; color:#312523;
}
.lj-header__title{
  justify-self:center; font-family:cormorant-garamond,"Cormorant Garamond",serif; font-weight:500;
  font-size:34px; line-height:1; letter-spacing:.01em; color:#312523; text-decoration:none;
}
.lj-header__ark{
  justify-self:end; display:inline-flex; align-items:center; gap:6px;
  font-family:"Montserrat",sans-serif; font-weight:500; font-size:13px; letter-spacing:.08em;
  color:#312523; text-decoration:none; padding:8px 0; border-bottom:1px solid transparent;
  transition:border-color .3s ease, opacity .3s ease;
}
.lj-header__ark span{ font-size:11px; transition:transform .4s cubic-bezier(.22,1,.36,1); }
.lj-header__ark:hover{ border-bottom-color:#312523; }
.lj-header__ark:hover span{ transform:translate(2px,-2px); }
@media (max-width:860px){
  .site-header.lj-header{ height:56px; padding:0 20px !important; grid-template-columns:auto 1fr auto; }
  .lj-header__season{ display:none; }
  .lj-header__title{ justify-self:start; font-size:24px; }
  .lj-header__ark{ font-size:11.5px; }
}

/* PAGE TOP：ひと回り小さく */
.page-top{ padding:40px 0 28px !important; }
.page-top a{ gap:14px !important; }
.page-top__line{ height:40px !important; }
.page-top__label{ font-size:11.5px !important; letter-spacing:.12em !important; }
@media (max-width:600px){
  .page-top{ padding:32px 0 22px !important; }
  .page-top__line{ height:32px !important; }
  .page-top__label{ font-size:10.5px !important; }
}