@charset "UTF-8";
/* 共通コンポーネントCSS（ヘッダー/フッター/ボトム）: index.css の64KB制限回避のため分離。
   FTP配信し index.html で <link>（index.css の後）。純CSS＝Prettier整形可。var()は index.css の :root から解決 */

/* ===== スクロール出現アニメ（下からフェードアップ）。全ページ共通 =====
   .js-reveal(html)がJSで付く時だけ隠す＝JS無効/エラー時は全表示。reduced-motionで自動オフ。
   対象は見出し/本文/画像/カード等の“中身”のみ（背景バンド・背景画像・hero・sticky.pd-infoはJS側で除外）。
   カード/行/グリッドの子は inline の transition-delay で時間差(stagger)。初回画面内は .reveal--instant で即表示。 */
.js-reveal .reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.js-reveal .reveal.is-visible {
    opacity: 1;
    transform: none;
}
.js-reveal .reveal--instant {
    transition: none !important;
    transition-delay: 0s !important;
}
@media (prefers-reduced-motion: reduce) {
    .js-reveal .reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* 行頭マーカー分割行(hang JS生成)。--gap=直前の<br>数。PCは(br-1)行ぶん空行（br1=詰め／br2=1行／…）。SPはsp-common.cssで別式 */
body {
    overflow-x: clip; /* SP: 100vwレイアウト×classicスクロールバーによる微小な横スクロールを抑止（sticky/fixedは非破壊） */
}
.u-hang-line {
    margin-top: calc((var(--gap, 1) - 1) * 1lh);
}

/* ============================================================
   共通ヘッダー移植（mock を実測値のまま / .l-header 配下にスコープ）
   mock/index.css(site-nav) + mock/product_list.css(ph-header/cat-bar/メガメニュー) を忠実移植
   変更したのは①ロゴ=<{$logo}>(invertなし) ②メニュー位置=各タブ基準(動的対応) のみ
   ============================================================ */
/* ---- mock ベース/リセットを移植ルート配下に決定論的に再現 ----
   純正テンプレは content-box 既定（グローバル * リセット無し）。mock は border-box＋* リセット前提で
   組まれているため、移植ルート配下だけ mock 環境へ揃える＝寸法計算を完全一致させる。
   ※以降フッター等を移植したら、その root（例: .site-footer）を下記セレクタ群に追加する */
.ph-header,
.ph-header *,
.ph-header *::before,
.ph-header *::after,
.cat-bar,
.cat-bar *,
.cat-bar *::before,
.cat-bar *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.ph-header,
.cat-bar {
    font-family: var(--font-body);
    font-weight: 350;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
    line-height: 1.65;
    color: var(--c-black);
    -webkit-font-smoothing: antialiased;
}
.ph-header img,
.cat-bar img {
    max-width: 100%;
    display: block;
}
.ph-header a,
.cat-bar a {
    color: inherit;
    text-decoration: none;
}
.ph-header a:hover,
.cat-bar a:hover {
    opacity: 0.7;
    transition: opacity 0.25s;
}
.ph-header ul,
.ph-header ol,
.cat-bar ul,
.cat-bar ol {
    list-style: none;
}
.ph-header button,
.cat-bar button {
    font-family: inherit;
}

/* ---- ph-header 白62px（mock/product_list.css） ---- */
.l-header .ph-header {
    height: var(--follow-h);
    background: var(--c-white);
    color: var(--c-accent);
}
.l-header .ph-header__inner {
    position: relative;
    height: var(--follow-h);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 51px;
}
.l-header .ph-header__logo {
    position: absolute;
    left: 50%;
    translate: -50% 0;
    display: flex;
    align-items: center;
}
.l-header .ph-header__logo img {
    height: auto;
    width: 88px;
}

/* ---- site-nav（mock/index.css） ---- */
.l-header .site-nav {
    display: flex;
    align-items: center;
    font-family: var(--font-en);
    font-size: var(--fs-sub);
    letter-spacing: 0.03em;
}
.l-header .site-nav__item {
    position: relative;
    display: flex;
    align-items: center;
    color: inherit;
    line-height: 1;
    background: none;
    border: 0;
    font: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    text-decoration: none;
}
/* アイテム区切り: border-leftは要素高依存で不揃い→疑似要素で固定19pxに */
.l-header .site-nav__item + .site-nav__item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    translate: 0 -50%;
    width: 1px;
    height: 19px;
    background: rgba(255, 255, 255, 0.55); /* hero(暗背景)用の既定 */
}
.l-header .site-nav__item--account {
    gap: 16px;
    padding-right: 36px;
}
.l-header .site-nav__item--cart {
    gap: 1px;
    padding: 0 34px 0 31px;
}
.l-header .site-nav__item--menu {
    gap: 29px;
    padding-left: 38px;
}
.l-header .site-nav__icon {
    display: block;
    width: auto;
    height: auto;
}
/* CART専用の微調整フック（アイコン。共通の site-nav__icon を継承しつつ cart だけ上書き。カウントは .cart-count） */
.l-header .site-nav__icon--cart {
    margin-left:5px;
	margin-bottom: 4px;
}
.l-header .site-nav__menu {
    display: block;
    width: 51px;
    height: 13px;
    stroke: currentColor;
    stroke-width: 1.6;
    fill: none;
}
.l-header .cart-count {
    font-size: 12px;
	line-height: 1;
    margin-bottom: 20px;
}
/* --follow（白背景用に茶へ） */
.l-header .site-nav--follow {
    color: var(--c-accent);
}
.l-header .site-nav--follow .site-nav__item + .site-nav__item::before {
    background: #7f624f;
}
.l-header .site-nav--follow .site-nav__icon {
    filter: brightness(0) saturate(100%) invert(42%) sepia(24%) saturate(600%) hue-rotate(347deg) brightness(92%);
}

/* ---- cat-bar 黒40px（mock/product_list.css） ---- */
.l-header .cat-bar {
    position: relative;
    z-index: 50;
    height: var(--nav-h);
    background: var(--c-ink);
    color: var(--c-white);
}
.l-header .cat-bar__list {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 34px;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
}
.l-header .cat-bar__item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-inline: 26px;
    cursor: pointer;
}
.l-header .cat-bar__item--has-menu {
    position: relative;
}
.l-header .cat-bar__label {
    color: inherit;
    text-decoration: none;
}
.l-header .cat-bar__item--search {
    padding-left: 6px;
    gap: 15px;
    border-right: 1px solid rgba(255, 255, 255, 0.28);
    margin-right: 8px;
    cursor: default; /* 商品検索は押せないラベル（検索機能なし）＝ポインター無効 */
}
.l-header .cat-bar__search-label {
    display: flex;
    align-items: center;
    gap: 15px;
}
.l-header .cat-bar__search-icon {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
}
.l-header .cat-bar__search-text {
    color: var(--c-white);
    letter-spacing: 0.03em;
    white-space: nowrap;
}
.l-header .cat-bar__caret {
    width: 8px;
    height: 8px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    rotate: 45deg;
    translate: 0 -2px;
}

/* ---- ホバーメガメニュー（mock/product_list.css・実測値のまま。位置のみ各タブ基準） ---- */
.l-header .cat-bar__menu {
    display: none;
    position: absolute;
    left: 0;
    top: calc(100% + 16px);
    z-index: 60;
    width: 579px;
    padding: 38px 0 43px 40px;
    background: rgba(39, 39, 39, 0.9);
    border-radius: 10px;
}
.l-header .cat-bar__menu--domestic {
    padding-bottom: 36px;
}
.l-header .cat-bar__menu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -16px;
    height: 16px;
}
.l-header .cat-bar__menu::after {
    content: "";
    position: absolute;
    top: -7px;
    left: 40px;
    width: 13px;
    height: 7px;
    background: rgba(39, 39, 39, 0.9);
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.l-header .cat-bar__item--has-menu:hover .cat-bar__menu,
.l-header .cat-bar__item--has-menu:focus-within .cat-bar__menu {
    display: block;
}

.l-header .cat-bar__all,
.l-header .cat-bar__box {
    position: relative;
    height: 40px;
    background: rgba(255, 255, 255, 0.051);
    border: 1px solid #707070;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-num);
    font-size: 14px;
    color: var(--c-white);
    text-decoration: none;
}
.l-header .cat-bar__all {
    width: 489px;
    margin-bottom: 36px;
    font-weight: 500;
    letter-spacing: 0.03em;
}
.l-header .cat-bar__all::after,
.l-header .cat-bar__box::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    translate: 0 -50%;
    width: 6.6px;
    height: 13.1px;
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%22-0.0005%20-0.0011%206.5655%2013.1323%22%3E%3Cpath%20d=%22M%205.442995071411133%206.564970970153809%20L%200.1362986713647842%2012.29093837738037%20C%200.09260813146829605%2012.3371114730835%200.05806708335876465%2012.39181995391846%200.03467423468828201%2012.45210742950439%20C%200.01128149311989546%2012.51239681243896%20-0.0004989457665942609%2012.57684326171875%201.586239886819385e-05%2012.64194488525391%20C%200.0005306703387759626%2012.70704746246338%200.01333009079098701%2012.77127456665039%200.03767311573028564%2012.83112621307373%20C%200.06201613321900368%2012.89097690582275%200.09741927683353424%2012.9451379776001%200.1418340355157852%2012.99054431915283%20C%200.1862493455410004%2013.0359525680542%200.238794282078743%2013.07162189483643%200.2964270412921906%2013.09547519683838%20C%200.3540609180927277%2013.1194372177124%200.4156403541564941%2013.13114452362061%200.4776005446910858%2013.12983131408691%20C%200.5395607352256775%2013.12862873077393%200.6006707549095154%2013.1145133972168%200.6573954224586487%2013.08825397491455%20C%200.7141211628913879%2013.06210327148438%200.765333354473114%2013.02435398101807%200.8080713152885437%2012.97719669342041%20L%206.432216167449951%206.908121585845947%20C%206.517342090606689%206.816256046295166%206.564970970153809%206.693140506744385%206.564970970153809%206.564970970153809%20C%206.564970970153809%206.436800479888916%206.517342090606689%206.313685417175293%206.432216167449951%206.221819400787354%20L%200.8080713152885437%200.1527209728956223%20C%200.765333354473114%200.1056037396192551%200.7141211628913879%200.06785362213850021%200.6573954224586487%200.04165424033999443%20C%200.6006707549095154%200.01545486319810152%200.5395607352256775%200.00132723234128207%200.4776005446910858%208.867227734299377e-05%20C%200.4156403541564941%20-0.001149895135313272%200.3540609180927277%200.01052498631179333%200.2964270412921906%200.0344383530318737%20C%200.238794282078743%200.05835180357098579%200.1862493455410004%200.09402794390916824%200.1418340355157852%200.1394039243459702%20C%200.09741927683353424%200.1847788095474243%200.06201613321900368%200.2389529496431351%200.03767311573028564%200.2987893521785736%20C%200.01333009079098701%200.3586257696151733%200.0005306703387759626%200.4229362010955811%201.586239886819385e-05%200.4880005419254303%20C%20-0.0004989457665942609%200.5530649423599243%200.01128149311989546%200.6175898313522339%200.03467423468828201%200.6778420209884644%20C%200.05806708335876465%200.7380953431129456%200.09260813146829605%200.7928789258003235%200.1362986713647842%200.8390229344367981%20L%205.442995071411133%206.564970970153809%20Z%22%20fill=%22%23FFFFFF%22/%3E%3C/svg%3E")
        center / contain no-repeat;
}
.l-header .cat-bar__group {
    display: flex;
    align-items: flex-start;
}
.l-header .cat-bar__group + .cat-bar__group {
    margin-top: 11px;
}
.l-header .cat-bar__glabel {
    width: 111px;
    line-height: 40px;
    font-family: var(--font-num);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.03em;
    color: var(--c-white);
}
.l-header .cat-bar__gboxes {
    display: grid;
    grid-template-columns: repeat(2, 180px);
    gap: 11px 18px;
}
.l-header .cat-bar__gboxes--5 {
    gap: 5px 18px;
}
/* オリジナルサブメニューのシリーズ区切り（すべて/シリーズ/地金の並び。金銀は入れ子グループ） */
.l-header .cat-bar__hr {
    width: 489px;
    margin: 16px 0;
    border: 0;
    border-top: 1px dashed rgba(255, 255, 255, 0.3);
}
/* シリーズpill（Ulti Met./Designgot）を2列いっぱいに */
.l-header .cat-bar__box--wide {
    grid-column: 1 / -1;
}

/* ============================================================
   商品検索メニュー（Menuで開くフルスクリーンoverlay・AB-06実測ベース）
   PC=2カラム（左:商品検索/右:リンク）。SP版は別途。
   ============================================================ */
.gmenu,
.smenu {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 100000; /* .l-header.is-fixed/.is-open が z-index:10000(index.css)なので、その上へ */
    background: rgba(39, 39, 39, 0.97); /* #272727 を不透明度97%（背後がわずかに透けるガラス面） */
    color: var(--c-white);
    overflow-y: auto;
    /* body直下へ移設するため、継承に頼らず基底フォントを明示（JA=Noto、EN/numは各要素で上書き） */
    font-family: var(--font-body);
    font-weight: 350;
    letter-spacing: 0.03em;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}
.gmenu.is-open,
.smenu.is-open {
    display: block;
}
.gmenu,
.gmenu *,
.gmenu *::before,
.gmenu *::after,
.smenu,
.smenu *,
.smenu *::before,
.smenu *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.gmenu__inner {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    min-height: 100%;
}
/* 上バー＝TOPヒーローヘッダーと同一デザイン（色白・右端×）。top.cssの.site-header実測を複製 */
.gmenu__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 31px 51px 31px 53px;
}
.gmenu__brand {
    display: flex;
    align-items: center;
    gap: 27px;
}
.gmenu__logo img {
    display: block;
    height: 72px;
    width: auto;
    filter: brightness(0) invert(1);
}
.gmenu__sub {
    font-size: var(--fs-body);
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}
.gmenu__nav {
    display: flex;
    align-items: center;
    font-family: var(--font-en);
    font-size: var(--fs-sub);
    letter-spacing: 0.03em;
}
.gmenu__item {
    display: flex;
    align-items: center;
    gap: 16px;
    color: inherit;
    line-height: 1;
    background: none;
    border: 0;
    font: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    text-decoration: none;
}
.gmenu__item + .gmenu__item {
    border-left: 1px solid rgba(255, 255, 255, 0.55);
}
.gmenu__item--account {
    padding-right: 36px;
}
.gmenu__item--cart {
    gap: 1px; /* ヒーローヘッダー .site-nav__item--cart と同一 */
    padding: 0 34px 0 31px;
}
.gmenu__item--cart .gmenu__icon {
    margin-left: 5px;
    margin-bottom: 4px; /* .site-nav__icon--cart と同一 */
}
.gmenu__cart-count {
    font-family: var(--font-num);
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    margin-bottom: 20px; /* .l-header .cart-count と同一（上付き） */
}
.gmenu__srch {
    display: none; /* SP専用ラベル（メニューバー中央の検索アイコン++商品検索） */
}
.gmenu__item--close {
    padding-left: 38px;
}
.gmenu__icon {
    display: block;
    width: auto;
    height: auto;
    margin-bottom: 6px;
    filter: brightness(0) invert(1);
}
.gmenu__x-ic {
    display: block;
    width: auto;
    height: 22px;
    filter: brightness(0) invert(1); /* 色白 */
	margin:0 8px;
}
.gmenu__body {
    display: grid;
    grid-template-columns: 403px 455px;
    justify-content: space-between;
    max-width: 1040px;
    margin: 40px auto 0;
    padding-bottom: 60px;
}
.gmenu__en {
    font-family: var(--font-en);
    font-size: 12px;
}
.gmenu__title {
    margin-top: 16px;
    font-size: 22px;
    font-weight: 400;
    letter-spacing: 0.08em;
}
.gmenu__card {
    position: relative;
    display: block;
    width: 403px;
    margin-top: 22px;
    padding: 24px 28px;
    background: var(--c-white);
    color: var(--c-black);
    text-decoration: none;
}
/* 自前色(黒)のカードはホバー/フォーカスでも自色維持（グローバルの color:inherit で親=白に変わるのを防ぐ）。フェード(opacity)は継続 */
.gmenu__card:hover,
.gmenu__card:focus {
    color: var(--c-black);
}
.gmenu__card .ja {
    display: block;
    font-size: 15px;
    letter-spacing: 0.05em;
}
.gmenu__card .en {
    display: block;
    margin-top: 6px;
    font-family: var(--font-num);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #8b735e;
}
.gmenu__card::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    translate: 0 -50%;
    width: 32px;
    height: 32px;
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2032%2032'%3E%3Ccircle%20cx='16'%20cy='16'%20r='16'%20fill='%239C7861'/%3E%3Cpath%20d='M13.288%2013.227%2019.667%2016.201%2013.288%2018.603%2016.401%2016.021%20Z'%20fill='%23FFFFFF'/%3E%3C/svg%3E") center / contain no-repeat;
}
.gmenu__desc {
    margin-top: 30px;
    font-family: var(--font-num);
    font-size: 10px;
    letter-spacing: 0.06em;
    line-height: 20px;
}
.gmenu__links {
    list-style: none;
}
.gmenu__links li + li {
    margin-top: 0;
}
.gmenu__links li:nth-child(4) {
    margin-top: 44px; /* PC: FAQ(3)→About(4)のグループ区切り余白（デザインAB-06-menu-pc準拠）。SPは#smenu側で別指定 */
}
.gmenu__links li {
    border-bottom: 1px dashed rgba(255, 255, 255, 0.3);
}
.gmenu__links a {
    position: relative;
    display: block;
    padding: 14px 0;
    color: inherit;
    text-decoration: none;
}
.gmenu__links .en {
    display: block;
    font-family: var(--font-en);
    font-size: 12px;
}
.gmenu__links .ja {
    display: block;
    margin-top: 4px;
    font-size: 16px;
    letter-spacing: 0.06em;
}
.gmenu__links a::after {
    content: "";
    position: absolute;
    right: 4px;
    top: 50%;
    width: 11.37px;
    height: 9.58px;
    background: url(https://file001.shop-pro.jp/PA01503/177/detail-arrow-white.svg) center / contain no-repeat;
    translate: 0 -50%;
}
.gmenu__overlay {
    display: none;
}
/* SP専用要素はPCでは非表示（パネル=アコーディオン、アカウント、SHOWROOM/SNS） */
.gmenu__panel,
.gmenu__account,
.gmenu__info {
    display: none;
}

/* ===== SP版メニュー（375基準vw・アコーディオン・AB-06 SP1/SP2実測） ===== */
@media screen and (max-width: 767px) {
    .gmenu__inner {
        width: 100%;
    }
    /* 上バー: sp-barと同一構成（ロゴ40px+検索アイコン+商品検索+カート+数）＋×38px。実測x: 検索アイコン+147/カート254/×318。下線=線3281(y60) */
    .gmenu__bar {
        position: sticky; /* メニュー開時ヘッダーは画面上部に固定（本体だけスクロール） */
        top: 0;
        z-index: 2;
        height: 16vw;
        padding: 0 5.333vw;
        justify-content: flex-start;
        background: #272727; /* スクロールで下を通る本文を隠す不透明地 */
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }
    .gmenu__brand {
        gap: 0;
    }
    .gmenu__logo img {
        height: 10.667vw;
    }
    .gmenu__sub {
        display: none;
    }
    .gmenu__srch {
        display: flex;
        align-items: center;
        gap: 2.4vw;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
    }
    .gmenu__srch-ic {
        width: 5.333vw;
        height: auto;
        display: block;
        filter: brightness(0) invert(1);
    }
    .gmenu__srch span {
        font-size: 3.2vw;
        font-weight: 400;
        letter-spacing: 0.08em;
        line-height: 1;
    }
    .gmenu__nav {
        margin-left: auto;
    }
    .gmenu__item--account {
        display: none;
    }
    .gmenu__item + .gmenu__item {
        border-left: 0;
    }
    .gmenu__item--cart {
        gap: 0;
        padding: 0;
    }
    .gmenu__item--cart > span:first-child {
        display: none; /* CART文字はSPなし＝アイコン+数のみ */
    }
    .gmenu__item--cart .gmenu__icon {
        width: 5.333vw;
        height: auto;
        margin: 0;
    }
    .gmenu__cart-count {
        margin: 0 0 0 2.4vw;
        font-size: 3.733vw;
    }
    .gmenu__item--close {
        padding-left: 0;
        margin-left: 8vw;
    }
    .gmenu__item--close > span {
        display: none; /* Menu文字はSPなし＝×のみ */
    }
    .gmenu__x-ic {
        width: 10.133vw;
        height: auto;
        margin: 0;
    }
    /* 本体: 単一カラム。右リンクリストはSP非表示 */
    .gmenu__body {
        display: block;
        max-width: none;
        margin: 0;
        padding: 12.8vw 5.333vw 10.667vw; /* en(product)=y108 → バー下から48px */
    }
    .gmenu__links {
        display: none;
    }
    .gmenu__en {
        font-size: 3.2vw;
    }
    .gmenu__title {
        margin-top: 0;
        font-size: 5.333vw; /* 実測: Source Han Normal 20px */
        font-weight: 350;
    }
    /* グループカード（335x75）＋アコーディオン（パネル=白335x399/355） */
    .gmenu__group {
        margin-top: 3.2vw;
    }
    .gmenu__group + .gmenu__group {
        margin-top: 3.733vw; /* card1底233→card2 247 */
    }
    .gmenu__card {
        width: 100%;
        margin-top: 0;
        padding: 4.6vw 7.467vw;
    }
    .gmenu__card .ja {
        font-size: 4vw;
    }
    .gmenu__card .en {
        margin-top: 0;
        font-size: 2.667vw;
    }
    .gmenu__card::after {
        right: 5.333vw;
        width: 8.533vw;
        height: 8.533vw;
        rotate: 90deg; /* SPはアコーディオン: 既定は下向き（SVGは右向き→90度回転） */
        transition: rotate 0.25s ease;
    }
    .gmenu__card:has(+ .gmenu__panel.is-open)::after {
        rotate: -90deg; /* 展開中は上向き */
    }
    .gmenu__panel {
        background: rgba(255, 255, 255, 0.05); /* is-openの塗り=白5%透過（暗いgmenu上のガラス面） */
        color: var(--c-white);
        padding: 8.533vw 4.8vw 10.667vw; /* 実測: 上32/左右18/下40 */
		border:1px solid #707070;
		border-top:none;
    }
    .gmenu__panel.is-open {
        display: block;
    }
    .gmenu__all {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 13.333vw; /* 300x50 */
        background: rgba(255, 255, 255, 0.05); /* ボタン=同じ白5%ガラス */
        border: 1px solid #c9c9c9; /* 枠線=グレー c9c9c9 */
        border-radius: 1.067vw;
        font-size: 3.733vw;
        letter-spacing: 0.05em;
        color: var(--c-white);
        text-decoration: none;
    }
    /* facet: ラベル右に水平線。facet間は全幅区切線（実測: pills底433→線472→ラベル519） */
    .gmenu__facet {
        margin-top: 12vw; /* すべてボタン底315→ラベル360 */
    }
    .gmenu__facet + .gmenu__facet {
        margin-top: 10.4vw;
        padding-top: 12.533vw;
        border-top: 1px solid #c9c9c9; /* 区切線=グレー c9c9c9 */
    }
    .gmenu__flabel {
        display: flex;
        align-items: center;
        font-size: 4vw;
        letter-spacing: 0.03em;
    }
    .gmenu__flabel::after {
        content: "";
        flex: 1;
        height: 0;
        margin-left: 5.333vw;
        border-top: 1px dashed #c9c9c9; /* ラベル右の水平線=破線グレー c9c9c9 */
    }
    .gmenu__pills {
        margin-top: 4.8vw;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 5.333vw 4.267vw; /* 行20/列16 */
    }
    .gmenu__pill {
        position: relative; /* 右端シェブロンの絶対配置基準 */
        display: flex;
        align-items: center;
        justify-content: center;
        height: 10.667vw; /* 142x40 */
        background: rgba(255, 255, 255, 0.05); /* ボタン=同じ白5%ガラス */
        border: 1px solid #c9c9c9; /* 枠線=グレー c9c9c9 */
        border-radius: 1.067vw;
        font-size: 3.733vw;
        color: var(--c-white);
        text-decoration: none;
    }
    /* ボタン右端の細い山形シェブロン「›」（線色=c9c9c9で統一） */
    .gmenu__all::after,
    .gmenu__pill::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 4.267vw; /* 実測16px相当 */
        width: 1.6vw; /* 6px相当 */
        height: 1.6vw;
        border-top: 1px solid #c9c9c9;
        border-right: 1px solid #c9c9c9;
        rotate: 45deg;
        translate: 0 -50%;
    }
    /* アカウントボタン（335x50・アイコン+文字） */
    .gmenu__account {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 2.667vw;
        height: 13.333vw;
        margin-top: 8.533vw; /* card2底322→356 */
        background: rgba(255, 255, 255, 0.05); /* ボタン=同じ白5%ガラス */
        border: 1px solid #707070;
        color: var(--c-white);
        font-size: 3.733vw;
        letter-spacing: 0.03em;
        text-decoration: none;
        border-radius: 1.5vw;
    }
	.gmenu__account:hover {
		color: var(--c-white);
	}
    .gmenu__account-ic {
        width: 5.333vw;
        height: auto;
        display: block;
        filter: brightness(0) invert(1); /* ガラスボタン上=白アイコン */
    }
    /* 説明＋SHOW ROOM＋Social（実測: 線439→desc486 / desc底558→線586→shop640） */
    .gmenu__desc {
        margin-top: 8.8vw;
        padding-top: 12.533vw;
        border-top: 1px dashed rgba(255, 255, 255, 0.3);
        font-size: 2.667vw;
        line-height: 6.4vw;
    }
	#smenu .gmenu__desc {
        margin-top: 0;
        padding-top: 12.533vw;
        border-top: none;
    }

    .gmenu__info {
        display: block;
        margin-top: 7.467vw;
        padding-top: 10.4vw;
        border-top: 1px solid rgba(255, 255, 255, 0.3);
    }
    .gmenu__shop {
        font-size: 3.733vw;
        letter-spacing: 0.03em;
        margin-bottom: 4vw;
    }
    .gmenu__addr,
    .gmenu__hours {
        margin-top: 1.6vw;
        font-size: 3.2vw;
        letter-spacing: 0.03em;
    }
    .gmenu__social-label {
        margin-top: 8.533vw;
        font-family: var(--font-num);
        font-size: 3.733vw;
        letter-spacing: 0.08em;
    }
    .gmenu__social {
        margin-top: 3.733vw;
        display: flex;
        align-items: center;
        gap: 4vw;
    }
    .gmenu__social img {
        width: 9vw;
        height: auto;
        display: block;
    }
}

/* ===== ハンバーガー用サイトメニュー #smenu（SP専用・SP-MENU.png実測。共有要素はgmenuクラス流用） ===== */
@media screen and (max-width: 767px) {
    #smenu .gmenu__body {
        padding-top: 3.2vw; /* 上バー(60px)直下→アカウントボタン */
    }
    #smenu .gmenu__account {
        position: relative;
    }
    #smenu .gmenu__account::after { /* 右端シェブロン › */
        content: "";
        position: absolute;
        top: 50%;
        right: 4.267vw;
        width: 1.6vw;
        height: 1.6vw;
        border-top: 1px solid currentColor;
        border-right: 1px solid currentColor;
        rotate: 45deg;
        translate: 0 -50%;
    }
    #smenu .gmenu__links {
        display: block;
        margin-top: 4.533vw; /* アカウントボタン底→News */
    }
    #smenu .gmenu__links li {
        border-bottom: 1px dashed rgba(255, 255, 255, 0.3);
    }
    #smenu .gmenu__links li:nth-child(4) {
        margin-top: 8vw; /* FAQ→About間のグループ区切り（実測: 通常80→110px） */
    }
    #smenu .gmenu__links a {
        padding: 5.6vw 0; /* 実測: 項目ピッチ約80px */
    }
    #smenu .gmenu__links .en {
        font-size: 3.2vw; /* Optima 12px */
    }
    #smenu .gmenu__links .ja {
        margin-top: 0;
        font-size: 4.267vw; /* Source Han 16px 0.06em */
    }
    #smenu .gmenu__links a::after {
        right: 1.067vw;
        width: 1.6vw;
        height: 1.6vw;
    }
}

/* 既存の横帯ナビはデスクトップ非表示（cat-barで代替）。Menuボタン→ドロワーは従来通り */
@media screen and (min-width: 1030px) {
    .l-header .l-main-navi {
        display: none !important;
    }
}

/* ============================================================
   フッター移植（mock site-footer を実測値のまま / .site-footer 配下にスコープ）
   mock/index.css(.site-footer*) を忠実移植。ロゴは <{$logo}> を白フィルタで暗背景対応
   ============================================================ */
/* mock ベース/リセットを移植ルート配下に再現（決定論的サメネス） */
.site-footer,
.site-footer *,
.site-footer *::before,
.site-footer *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.site-footer {
    font-family: var(--font-body);
    font-weight: 350;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}
.site-footer img {
    max-width: 100%;
    display: block;
}
.site-footer a {
    color: inherit;
    text-decoration: none;
}
.site-footer a:hover {
    opacity: 0.7;
    transition: opacity 0.25s;
}
.site-footer ul,
.site-footer ol {
    list-style: none;
}

/* --- mock 実測値そのまま --- */
.site-footer {
    position: relative;
    background: var(--c-ink);
    color: var(--c-white);
    padding-top: 75px;
}
.site-footer__inner {
    width: 1200px;
    margin-inline: auto;
    padding-right: 24px;
    display: flex;
    justify-content: space-between;
}
.site-footer__brand img {
    height: auto;
    width: 247px;
    filter: brightness(0) invert(1);
}
.site-footer__brand .shop-name {
    margin-top: 29px;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
}
.site-footer__external {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    font-family: var(--font-en);
    font-size: var(--fs-product);
}
.site-footer__external a {
    display: block;
    width: 348px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    position: relative;
}
.site-footer__external a::after {
    content: "";
    position: absolute;
    right: 2px;
    top: 0;
    bottom: 12px; /* = a の padding-bottom。テキスト行内で縦中央に */
    margin-top: auto;
    margin-bottom: auto;
    width: 6.379px;
    height: 5.376px;
    background: url(https://file001.shop-pro.jp/PA01503/177/detail-arrow-white.svg) center / contain no-repeat;
}
.site-footer__nav {
    display: flex;
    gap: 156px;
    padding-top: 4px;
}
.site-footer__nav ul {
    display: flex;
    flex-direction: column;
    gap: 33px;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
}
.site-footer__pagetop {
    position: absolute;
    right: 30px;
    bottom: 55px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-family: var(--font-en);
    font-size: 11px;
    letter-spacing: 0.02em;
}
.site-footer__pagetop-ic {
    width: 35px;
    height: 35px;
    display: block;
}
.site-footer__pagetop-circle {
    width: 35px;
    height: 35px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.site-footer__pagetop-circle svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.4;
}
.site-footer__bottom {
    margin-top: 79px;
    height: 30px;
    background: var(--c-ink-2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-num);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.03em;
}

/* ============================================================
   共通ボトム移植（mock ガイド帯＋カレンダー / 実測値そのまま / 各rootにmockリセット再現）
   ※ガイド帯の背景写真は後日ホスティング。現状は .guide の #000 をプレースホルダとして表示
   ============================================================ */
.guide,
.guide *,
.guide *::before,
.guide *::after,
.calendar,
.calendar *,
.calendar *::before,
.calendar *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.guide,
.calendar {
    font-family: var(--font-body);
    font-weight: 350;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}
.guide a,
.calendar a {
    color: inherit;
    text-decoration: none;
}
.guide a:hover,
.calendar a:hover {
    opacity: 0.7;
    transition: opacity 0.25s;
}

/* sec-heading（共有見出し） */
.sec-heading {
    text-align: center;
}
.sec-heading__en {
    font-family: var(--font-en);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.2;
}
.sec-heading__ja {
    font-size: var(--fs-body);
    letter-spacing: 0.06em;
	margin-top: 0;
}
.heading-set--invert {
    color: var(--c-white);
}

/* Shopping Guide バンド（mock 実測値そのまま） */
.guide {
    margin-top: 102px;
    position: relative;
    height: 600px;
    color: var(--c-white);
    background: #000;
}
.guide img.bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.guide__inner {
    position: relative;
    width: 1200px;
    margin-inline: auto;
    padding-top: 117px;
}
.guide__buttons {
    display: grid;
    grid-template-columns: repeat(3, 391px);
    justify-content: space-between;
    gap: 13px;
    margin-top: 55px;
}
.guide__buttons a,
.guide__faq {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    border: 1px solid #c9c9c9;
    background: rgba(255, 255, 255, 0.12);
    font-size: var(--fs-body);
    font-weight: 500;
    letter-spacing: 0.03em;
    color: var(--c-white);
}
.guide__buttons a::after,
.guide__faq::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 1px solid currentColor;
    border-top: 1px solid currentColor;
    rotate: 45deg;
    translate: 0 -50%;
}
.guide__faq {
    margin-top: 32px;
}

/* ページヘッダー(hero)のEN/JA見出し — 全ページ共通の単一定義。
   デザイン: EN Optima 30px 字間0 ／ JA Inter Medium 15px 0.06em（間隔15px）。
   商品(page-hero)/フリーページ(gd-hero・about-hero)で別々に定義していたものをここへ集約=drift防止。
   ※EN見出しは強制大文字(text-transform:uppercase)。情報ページはHTML文言が既に大文字、商品/グループENは動的(シリーズ名/グループ名)だがUI統一のため大文字表示。
   ※位置(position:relative 等)とSP上書きは各ページ側に残置。 */
.page-hero__en,
.gd-hero__en,
.about-hero__en {
    font-family: var(--font-en);
    font-size: 30px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1;
    text-transform: uppercase;
}
.page-hero__ja,
.gd-hero__ja,
.about-hero__ja {
    margin-top: 15px;
    font-family: var(--font-body); /* JAは日本語。Noto Sans JP(可変300..700)でweight350を実効化（InterはJPグリフ無し＆400/500のみ）。SPも--font-body */
    font-weight: 350;
    font-size: 15px;
    letter-spacing: 0.06em;
    line-height: 1;
}

/* カレンダー（デザイン無視区域。Color Me <{$calendar}> を右カラムに描画） */
.calendar {
    margin-top: 5px;
    background: var(--c-beige);
    padding: 66px 0 67px;
}
.calendar__inner {
    width: 1200px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 505px;
    column-gap: 100px;
    align-items: center;
}
.calendar__info {
    padding-left: 100px;
    padding-top: 0;
}
.calendar__hours {
    margin-top: 24px;
    font-size: var(--fs-body);
    letter-spacing: 0.03em;
}
.calendar__cmscal {
    position: relative;
    padding-right:100px;
	margin-left: 180px;
}
/* 月送り矢印（2ヶ月表示ON時のみJSで可視化。左右に配置しcaption行に重ねる） */
.calendar__nav {
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #333;
    cursor: pointer;
    z-index: 1;
}
.calendar__nav:hover {
    opacity: 0.6;
}
/* 矢印本体: 1px二辺＋45度回転のシェブロン（.cat-bar__caret 等と同流儀） */
.calendar__nav::before {
    content: "";
    width: 10px;
    height: 10px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
}
.calendar__nav--prev {
    left: calc(50% - 195px);
}
.calendar__nav--prev::before {
    rotate: -135deg;
    translate: 2px 0;
}
.calendar__nav--next {
    right: calc(50% - 100px);
}
.calendar__nav--next::before {
    rotate: 45deg;
    translate: -2px 0;
}
.calendar__nav[hidden] {
    display: none;
}
.calendar__cmscal .tbl_calendar[hidden] {
    display: none;
}
/* 月送りを横スライダー化: JSが各tbl_calendarを .calendar__slide で包み .calendar__track を translate（%基準＝リサイズ追従） */
.calendar__viewport {
    overflow: hidden;
}
.calendar__track {
    display: flex;
    transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.calendar__slide {
    flex: 0 0 100%;
    display: flex;
    justify-content: flex-end; /* PCは右寄せ（従来の margin:0 0 0 auto 相当） */
    align-items: flex-start;   /* 月ごとの行数差で短い月が縦伸びしない */
}
.calendar__cmscal .calendar__track .tbl_calendar {
    margin: 0; /* 右寄せは slide の justify-content が担当 */
}
/* Color Me <{$calendar}> の実出力 <table class="tbl_calendar"> を直接スタイル（プレビューdummyと同一構造）。
   日=.sun / 土=.sat（見出しthと日付tdの両方に付く）／定休日=.holiday。 */
.calendar__cmscal .tbl_calendar {
    border-collapse: collapse;
    table-layout: fixed;
    text-align: center;
    font-size: 13px;
    color: #333;
	margin: 0 0 0 auto;
}
.calendar__cmscal .tbl_calendar caption {
    font-size: 15px;
    letter-spacing: 0.06em;
    margin-bottom: 8px;
}
.calendar__cmscal .tbl_calendar tbody {
	
}
.calendar__cmscal .tbl_calendar th {
    padding: 6px 0;
    font-weight: 400;
}
.calendar__cmscal .tbl_calendar td {
    padding: 7px 0;
}
.calendar__cmscal .tbl_calendar .sun {
    color: #c0392b;
}
.calendar__cmscal .tbl_calendar tr:first-child th {
    color: #4B4B4B;
	font-weight: 700;
}
.calendar__cmscal .tbl_calendar .sat {
    color: #c0392b;
}
.calendar__cmscal .tbl_calendar .holiday {
    color: #c0392b;
}
.calendar__memo {
    margin-top: 12px;
    font-size: var(--fs-small);
}