
/* ===== デザイントークン ===== */
:root {
  --woollen-primary: #c83939;   /* 主色（アクセント/SALE/必須/OUTLET） */
  --woollen-link: #2469ff;
  --woollen-ok: #1aa358;
  --woollen-text: #222;
  --woollen-sub: #888;
  --woollen-line: #eee;
  --wl-font-base: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Yu Gothic', 'Meiryo', sans-serif;
  --wl-font-en: 'Jost', 'Helvetica Neue', Arial, sans-serif;
}

:root { scroll-behavior: auto; }

/* ===== フォント（本文=Noto Sans JP / 英語見出し=Jost） ===== */
body { font-family: var(--wl-font-base); }
.sec-title__en,
.sec-title--row .ttl .en,
.card__brand,
.brand-grid__item,
.outlet-bar__main,
.err-code,
.news-list__date,
.l-catnav__item,
.wl-brand,
.wl-footer__heading,
.wl-footer__followLabel,
.ec-favoriteRole__itemBrand,
.order-card__brand { font-family: var(--wl-font-en); }

/* ===== ヘッダー右上：会員リンク（ログイン/新規登録・ダークバー） ===== */
.l-header__memberlinks { align-items: stretch; gap: 0; background: #333; border-radius: 2px; overflow: hidden; }
.l-header__memberlinks a { display: inline-flex; align-items: center; color: #fff; padding: 8px 18px; font-size: 13px; line-height: 1; }
.l-header__memberlinks a + a { border-left: 1px solid rgba(255, 255, 255, .35); }
.l-header__memberlinks a:hover { background: #444; color: #fff; }
/* ログインボタン左の会員名（ログイン時表示。太字で操作リンクと区別） */
.l-header__memberlinks .l-header__username { font-weight: 700; }

/* ===== メール文面プレビュー（page40/42 = EC-CUBE Mail/*.twig 相当。inc/mail_layout_*.php）===== */
.wl-mailPreview { background: #ececec; }
.wl-mail { max-width: 680px; margin: 0 auto; padding: 8px 14px 40px; background: #fff; }
.wl-mail__brand { text-align: center; font-size: 20px; padding: 18px 0; margin: 0; font-family: var(--wl-font-en, inherit); letter-spacing: .04em; }
.wl-mail__box { background: #f3f3f3; padding: 18px 14px; font-size: 13px; line-height: 1.8; }
.wl-mail__box + .wl-mail__box { margin-top: 14px; }
.wl-mail__note { background: #f3f3f3; padding: 18px 14px; font-size: 11px; color: #888; line-height: 1.7; margin-top: 14px; }
@media (max-width: 767px) {
  .l-header__topicons { display: none !important; }
  .l-header__mainnav  { display: none !important; }
  .l-catnav           { display: block !important; }
  .l-header__logo img { height: 24px; }
}

/* PC: ヘッダー共通（全ページ） */
@media (min-width: 768px) {
  .l-header__right            { flex-direction: column; align-items: flex-end; gap: 16px !important; }
  /* ヘッダー背景を透過（全ページ共通） */
  .l-header,
  .l-header__bar              { background: transparent !important; box-shadow: none !important; }
  /* ヘッダーバー: 縦余白＋3列レイアウト（ロゴ | ナビ | アイコン） */
  .l-header__bar              { padding-block: 18px !important; grid-template-columns: auto 1fr auto !important; }
  /* PCでもドロワーを開けるようにする（pc.css の display:none!important を上書き） */
  .l-drawer:not([hidden])     { display: flex !important; }
  /* PCハンバーガーボタン */
  .l-header__hamb-pc          { align-self: center; }
  .l-header__hamb-pc-btn      { display: flex; flex-direction: column; gap: 6px; cursor: pointer; padding: 4px; background: none; border: none; width: 28px; align-items: stretch; }
  .l-header__hamb-pc-btn span { display: block; height: 2px; flex: 0 0 2px; background: #222; width: 100%; }
  /* ヘッダー内カテゴリナビ */
  .l-header__mainnav          { display: flex; gap: 60px; justify-content: center; align-items: center; }
  .l-header__mainnav .l-catnav__item { flex-direction: row !important; padding: 4px 0 !important; gap: 0 !important; font-size: 14px; font-weight: 600; color: #444; }
  .l-header__mainnav .icon    { display: none !important; }
  /* WOMEN/MEN タブ: グレー背景廃止 → アンダーライン型 */
  .tabs-gender                { background: rgba(255,255,255,.15) !important; backdrop-filter: blur(6px); border-bottom: none; }
  .tabs-gender__item          { font-weight: 600; font-family: var(--wl-font-en); color: #888; }
  /* 修正1: バーは黒のみ（pc.css の red border-bottom-color を打ち消す） */
  .tabs-gender__item.is-active { color: #222; border-bottom-color: transparent; }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  .l-header__mainnav { display: none !important; }
}

@media (max-width: 767px) {
  .l-header__logo img { height: auto; max-height: 30px; width: auto; max-width: 44vw; }
}

/* ===== EC-CUBE 主要要素のアクセント ===== */
/* カート/レジ系の主要アクションボタンは黒に統一（商品詳細の add-cart=.pd-variant-row__cart #222 と揃える。赤はSALE/バッジ/価格のアクセント専用） */
.ec-blockBtn--action, .ec-inlineBtn--action { background-color: #222; border-color: #222; color: #fff; }
.ec-blockBtn--action:hover, .ec-blockBtn--action:focus,
.ec-inlineBtn--action:hover, .ec-inlineBtn--action:focus { background-color: #000; border-color: #000; color: #fff; }
.ec-cartNavi__badge { background-color: var(--woollen-primary); }
.price02-default { color: var(--woollen-primary); font-weight: 700; }
a:hover { color: var(--woollen-primary); }

/* ===== ショッピングカート: SP の窮屈さを少し緩和（左右余白・行間を拡大） ===== */
@media (max-width: 767px) {
  .ec-cartRole__cart { padding: 0 14px; box-sizing: border-box; }
  .ec-cartRow .ec-cartRow__contentColumn { padding: 16px 0; }
  .ec-cartRow .ec-cartRow__delColumn,
  .ec-cartRow .ec-cartRow__amountColumn { padding-top: 16px; padding-bottom: 16px; }
  .ec-cartRow .ec-cartRow__summary { line-height: 1.7; }
  .ec-cartRow .ec-cartRow__summary .ec-cartRow__name { margin-bottom: 8px; }
  .ec-cartRow .ec-cartRow__img { padding-right: 14px; }
  .ec-cartRow .ec-cartRow__amountColumn .ec-cartRow__amountSP { margin-bottom: 14px; }
}

/* ===== 商品カード(.ec-shelfGrid) ===== */
.ec-shelfGrid__item-image { position: relative; aspect-ratio: 3 / 4; overflow: hidden; background: #f3f3f3; }
.ec-shelfGrid__item-image img { width: 100%; height: 100%; object-fit: cover; }
.wl-badge { position: absolute; left: 0; bottom: 0; z-index: 1; font-size: 11px; font-weight: 700; line-height: 1; padding: 4px 10px; color: #fff; }
.wl-badge--new { background: #222; }
/* 一覧カード（include.js の badge-- 系）: キャンペーン対象＝白地×赤枠 */
.badge--campaign { background: #fff; color: var(--woollen-primary); border: 1px solid var(--woollen-primary); }
.badge { font-family: var(--wl-font-en); font-weight: 400; letter-spacing: .08em; padding: 3px 10px; border-radius: 0; line-height: 1.6; }
.badge--restock, .badge--campaign { font-family: inherit; letter-spacing: .04em; } /* 日本語ラベルは本文フォント */
.wl-badge--sale { background: var(--woollen-primary); }
.wl-brand { margin-top: 8px; font-family: var(--wl-font-en); letter-spacing: .04em; color: var(--woollen-sub); font-weight: 700; }
/* 注文カードのブランド名（page44/45）＝商品一覧カードの .card__brand と同トーン（Jostはフォントグループ側で指定） */
.order-card__brand { font-size: 11px; letter-spacing: .04em; color: #222; }
.wl-tax { font-size: 10px; color: var(--woollen-sub); margin-left: 2px; font-weight: 400; }
.ec-headerSearch .ec-input input { margin: 0; }       /* ヘッダー検索のinputズレ対策 */
.ec-shelfGrid .ec-shelfGrid__item .ec-productRole__btn { padding-top: 12px; }  /* カートボタン上の余白 */

/* ===== 商品詳細ギャラリー（Swiper + Fancybox） ===== */
.ec-sliderItemRole .js-detail-slider { width: 100%; overflow: hidden; }
.detail-slide-item { text-align: center; }
.detail-slide-item-img { width: 100%; height: auto; display: block; }
.detail-slide-nav { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.detail-slide-nav-item { width: calc(20% - 5px); cursor: pointer; border: 1px solid transparent; }
.detail-slide-nav-item.selected { border-color: var(--woollen-primary); }
.detail-slide-nav-img { width: 100%; height: 100%; display: block; aspect-ratio: 3 / 4; object-fit: cover; }

.wl-fullbleed { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
/* 100vw はスクロールバー幅を含み左右に数pxはみ出すため clip で抑止（hidden と違いスクロールコンテナを作らず sticky を壊さない） */
.ec-layoutRole:has(.wl-fullbleed) { overflow-x: clip; }

.pd-summary { padding: 14px; }
/* パンくず: ページ上部から右カラム内へ移設（"/"区切り）。common.css/pc.css の全幅用余白を打ち消し */
.pd-summary .breadcrumb { padding: 0 0 14px; }
.pd-summary .breadcrumb .sep { color: #bbb; }
.pd-summary__badges { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.pd-summary__brand { margin-top: 12px; font-family: var(--wl-font-en); font-size: 13px; font-weight: 400; letter-spacing: .04em; color: #222; }
.pd-summary__brand a { color: inherit; }
/* 商品名: 太字・大きめ。下端の薄い罫線で価格ブロックと区切る */
.pd-summary__name { font-size: 20px; font-weight: 700; line-height: 1.4; margin-top: 6px; padding-bottom: 14px; border-bottom: 1px solid #eee; color: var(--woollen-text); }
/* 取消線の旧価格: 価格の上に単独行（配色は .card__price del と同トーン） */
.pd-summary__priceDel { display: block; margin-top: 14px; font-size: 14px; font-weight: 400; color: var(--woollen-sub); }
.pd-summary__priceRow { display: flex; align-items: baseline; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.pd-summary__priceDel + .pd-summary__priceRow { margin-top: 4px; }
/* 価格: 通常/SALEとも #222 太字（SALEは旧価格＋OFFチップで表現。price02-default の赤を上書き） */
.pd-summary__price { font-size: 24px; color: var(--woollen-text); }
/* 税込表記 = .card__price small と同トーン（グレー・細字） */
.pd-summary__price small { font-size: 13px; font-weight: 400; color: #555; margin-left: 6px; }
/* OFF率: SALE色の塗りチップ（白抜き） */
.pd-summary__off { background: var(--woollen-primary); color: #fff; font-size: 12px; font-weight: 700; line-height: 1; padding: 5px 8px; }
.pd-summary__points { font-size: 12px; color: var(--woollen-sub); margin-top: 8px; }

.pd-tags { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px 4px; }
.pd-tags a { display: inline-block; font-size: 12px; line-height: 1; color: #555; background: #fff; border: 1px solid #ddd; padding: 6px 10px; }
.pd-tags a:hover { color: var(--woollen-primary); border-color: var(--woollen-primary); }

/* ===== 商品カード(.card) 余白 ===== */
.card .card__badges { left: 8px; bottom: 8px; }
.card .card__brand, .card .card__name, .card .card__price,
.card .card__thumbs, .card .card__colors { padding-left: 10px; padding-right: 10px; }
.card .card__brand { margin-top: 10px; }
/* ブランド名のスタイルを TOP カード（.wl-na__brand）に統一（細字・#222） */
.card .card__brand { font-weight: 400; color: #222; letter-spacing: .04em; font-size: 12px; }
/* 商品名が1行のとき2行分の空きが値段上部に出るのを防ぐ（min-height 解除＝値段を名前直下に詰める） */
.card .card__name { min-height: 0; }
.card .card__price { padding-bottom: 12px; }
.card:hover .card__name { color: var(--woollen-text); }

/* ===== 商品詳細の2カラム化を1段遅らせる（EC-CUBE標準768→992。core上書きのため範囲指定） ===== */
@media (min-width: 768px) and (max-width: 991px) {
  .ec-productRole .ec-grid2 { display: block; }
  .ec-productRole .ec-grid2 .ec-grid2__cell { width: 100%; }
}

/* ===== 購入導線（page30 クーポン / page31 確認） ===== */
.coupon-options { display: grid; grid-template-columns: 1fr; gap: 10px; }   /* ベース=1列 */
.coupon-option { border: 1px solid #ddd; padding: 12px; font-size: 13px; display: flex; gap: 8px; align-items: flex-start; background: #fff; cursor: pointer; }
.coupon-option.is-selected { border-color: var(--woollen-primary); background: #fdf3f3; }
.coupon-option input[type="radio"] {
  -webkit-appearance: auto; appearance: auto;
  width: 18px; height: 18px; min-height: 0; padding: 0; border: 0; flex: 0 0 auto;
  margin: 2px 0 0; accent-color: var(--woollen-primary); cursor: pointer;
}
.coupon-option__body { flex: 1; min-width: 0; }
.coupon-option__title { line-height: 1.5; }
.coupon-option__sub { font-size: 12px; margin-top: 6px; color: #555; }
.coupon-option__sub .num { color: var(--woollen-primary); font-weight: 700; }
.coupon-option__row { display: flex; gap: 6px; margin-top: 6px; align-items: stretch; }
.coupon-option__row input[type="text"] { flex: 1; min-width: 0; border: 1px solid #c8c8c8; padding: 6px 8px; font-size: 12px; background: #fff; height: 36px; }
.coupon-option__row button { background: #222; color: #fff; padding: 0 14px; font-size: 12px; border: 1px solid #222; cursor: pointer; height: 36px; flex: 0 0 auto; }
.btn-change { margin-top: 10px; }
.ec-orderPayment .ec-input p { margin-bottom: 8px; }
.ec-orderRole { line-height: 1.8; } /* style.css の 1.4 を上書きして行間を広めに */
.ec-orderRole .ec-rectHeading h2 { font-size: 16px; font-weight: 700; letter-spacing: .02em; background: #222; color: #fff; padding: 12px 16px; } /* style.css の #F3F3F3/8px 12px を黒帯・白文字・広めパディングに。16px＝.ec-orderRole の本文サイズと同じ */
.ec-orderRole .ec-blockRadio { font-size: 13px; color: #222; }
.ec-orderDelivery .ec-orderDelivery__title { font-size: 14px; } /* style.css の 18px を縮小（「お届け先」等のサブ見出し） */
.ec-mypageRole .ec-orderRole { padding-left: 0; padding-right: 0; font-size: 14px; }
.ec-mypageRole .order-card { margin-left: 0; margin-right: 0; }
/* クーポン一覧(page75): 同様に .coupon-list 自身の横padding(14px)が二重になる→マイページ配下では0に */
.ec-mypageRole .coupon-list { padding-left: 0; padding-right: 0; }
/* お気に入り一覧(page10): ブランド名・商品名・価格を商品一覧カード（.card__brand / .card__name / .card__price）と同トーンに */
.ec-favoriteRole .ec-favoriteRole__itemBrand { margin: 8px 0 0; font-size: 12px; letter-spacing: .04em; color: #222; }
/* リストは他のマイページと同じく .ec-mypageRole（最大1130px）の幅内に収める（上に24px） */
.ec-favoriteRole { margin-top: 24px; }
/* グリッド化（EC-CUBE標準の item 47.5%/25%幅＋内側padding 10px を置換。SP2列/PC3列） */
.ec-favoriteRole .ec-favoriteRole__itemList { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 10px; }
/* card風: 枠線＋白背景＋パディング。削除ボタンは最下部 */
.ec-favoriteRole .ec-favoriteRole__item { width: auto; margin: 0; padding: 10px; border: 1px solid #e5e5e5; background: #fff; display: flex; flex-direction: column; }
.ec-favoriteRole .ec-favoriteRole__actions { order: 2; margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.ec-favoriteRole .ec-favoriteRole__actions a.btn { width: auto; min-width: 0; padding-left: 8px; padding-right: 8px; font-size: 12px; min-height: 42px; color: #222; }
.ec-favoriteRole .ec-favoriteRole__actions a.ec-favoriteRole__remove { color: #c83939; border-color: #c83939; }
@media (min-width: 768px) {
  .ec-favoriteRole .ec-favoriteRole__itemList { grid-template-columns: repeat(3, 1fr); gap: 28px 16px; }
  .ec-favoriteRole .ec-favoriteRole__actions { flex-direction: row; align-items: stretch; gap: 10px; }
  /* flex-basis:0 ＋ grow:1 で文字数に依存せず横幅を厳密に二等分（サイズは page55 と同じ 14px / 48px） */
  .ec-favoriteRole .ec-favoriteRole__actions a.btn { flex: 1 1 0; font-size: 14px; min-height: 48px; }
}
.ec-favoriteRole .ec-favoriteRole__itemThumb { position: relative; aspect-ratio: 3 / 4; overflow: hidden; background: #f3f3f3; }
.ec-favoriteRole .ec-favoriteRole__item .ec-favoriteRole__itemThumb img { width: 100%; height: 100%; object-fit: cover; max-height: none; }
/* 商品画像右上にハートマーク（お気に入り登録済みの表示・装飾のみ／動作なし） */
.ec-favoriteRole .ec-favoriteRole__itemThumb .ec-favoriteRole__logo {
  position: absolute; top: 8px; right: 8px; z-index: 1;
  font-size: 20px; color: var(--woollen-primary); line-height: 1;
}
.ec-favoriteRole .ec-favoriteRole__itemTitle { margin: 3px 0 0; line-height: 1.4; font-size: 12px; }
.ec-favoriteRole .ec-favoriteRole__itemPrice { margin-top: 4px; font-size: 13px; font-weight: 700; color: #222; }
@media (min-width: 768px) {
  .ec-favoriteRole .ec-favoriteRole__itemTitle { font-size: 13px; }
  .ec-favoriteRole .ec-favoriteRole__itemPrice { font-size: 14px; }
}
/* 注文詳細(page46) 注文ヘッダ案A: 黒帯内右端にステータスバッジ＋メタ横並び（縦線区切り・SPは折り返し） */
.wl-orderHead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
.wl-orderHead .order-card__status { white-space: nowrap; flex: 0 0 auto; } /* バッジ内で「発送済/み」と改行させない */
.wl-orderMetaRow { list-style: none; margin: 0 0 8px; padding: 0; } /* メタは縦並び */
.ec-orderDelivery__actions .ec-select label { display: inline-block; background: #ddd; color: #333; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 2px; margin-right: 8px; }
.ec-totalBox__pointBlock .ec-font-bold { font-weight: 700; }
/* 注文詳細(page46): メール配信履歴のアコーディオン（件名を押したら本文が開く。実機の collapse 相当を details/summary で再現） */
.wl-mailHistory__head { cursor: pointer; list-style: none; }
.wl-mailHistory__head::-webkit-details-marker { display: none; }
.wl-mailHistory__time { display: block; font-size: 13px; }
.wl-mailHistory__subject { display: block; margin-top: 2px; font-size: 13px; color: #2469ff; }
.wl-mailHistory__body { margin-top: 12px; }
.wl-mailHistory__body pre { white-space: pre-wrap; font-family: inherit; font-size: 13px; line-height: 1.8; margin: 0; }
.wl-mailHistory__close { background: none; border: 0; padding: 0; margin-top: 12px; font-size: 13px; color: #2469ff; cursor: pointer; }
/* PC: クーポンを2列 */
@media (min-width: 768px) {
  .coupon-options { grid-template-columns: 1fr 1fr; }
  .ec-orderRole__summary {
    position: sticky;
    top: calc(var(--sticky-header-h, 53px) + var(--sticky-catnav-h, 38px) + 12px);
    align-self: flex-start;
  }
}

/* ===== お届け先カード(page55): クーポンカードと同トーン（ダーク帯＋ラベル付き明細・レスポンシブグリッド） ===== */
.wl-addrList { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 6px; }
@media (min-width: 600px) { .wl-addrList { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .wl-addrList { grid-template-columns: repeat(3, 1fr); } }
.wl-addrCard { display: flex; flex-direction: column; border: 1px solid #333; background: #fff; font-size: 13px; }
/* EC-CUBE標準 .ec-addressList .ec-addressList__item（display:table＋点線border-bottom, 詳細度0,2,0）を打ち消す */
.ec-addressList .ec-addressList__item.wl-addrCard { display: flex; flex-direction: column; border: 1px solid #333; }
.wl-addrCard__top { position: relative; overflow: hidden; background: #333; padding: 18px 14px; text-align: center; }
.wl-addrCard__top::before {
  content: "Address"; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--wl-font-en); font-weight: 700; font-size: 46px; line-height: 1;
  white-space: nowrap; color: rgba(255,255,255,.06); pointer-events: none; z-index: 0;
}
.wl-addrCard__name { position: relative; z-index: 1; margin: 0; color: #fff; font-size: 16px; font-weight: 700; letter-spacing: .04em; }
.wl-addrCard__meta { margin: 0; padding: 2px 14px 4px; }
.wl-addrCard__meta > div { padding: 12px 0; border-bottom: 1px solid #e5e5e5; }
.wl-addrCard__meta > div:last-child { border-bottom: 0; }
.wl-addrCard__meta dt { font-weight: 700; color: #333; font-size: 12px; }
.wl-addrCard__meta dd { margin: 6px 0 0; color: #555; font-size: 12px; line-height: 1.6; }
/* アクションは 削除／変更 を横並び */
.wl-addrCard__actions { margin-top: auto; padding: 10px 14px 16px; display: flex; gap: 10px; }
.wl-addrCard__actions .btn { flex: 1; width: auto; }

/* ===== フッター（BRAND / ITEM CATEGORY ＋ ロゴ / FOLLOW US / インフォ） ===== */
.wl-footer { background: #f5f5f5; margin-top: 40px; padding: 0; }
.wl-footer .wl-footer__inner { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.wl-footer__top { padding: 48px 0; }
.wl-footer__topGrid { display: flex; flex-direction: column; gap: 32px; justify-content: center; }
.wl-footer__heading { font-size: 20px; font-weight: 700; letter-spacing: .18em; color: #222; margin-bottom: 18px; }
.wl-footer__heading a { color: inherit; }
.wl-footer__heading a:hover { color: var(--woollen-primary); }
.wl-footer__subheading { font-family: var(--wl-font-en); font-size: 13px; font-weight: 700; letter-spacing: .14em; color: #555; margin: 0 0 10px; }
.wl-footer__cols2 + .wl-footer__subheading { margin-top: 20px; }
.wl-footer__list { list-style: none; margin: 0; padding: 0; }
.wl-footer__list li { padding: 5px 0; }
.wl-footer__list a { font-size: 13px; color: #555; }
.wl-footer__list a:hover { color: var(--woollen-primary); }
.wl-footer__cols2 { display: flex; gap: 40px; }
.wl-footer__bottom { border-top: 1px solid #ddd; padding: 32px 0 20px; }
.wl-footer__bottomGrid { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 24px; }
.wl-footer__logo { padding: 0 !important; text-align: center !important; }
.wl-footer__logo img { height: 30px; width: auto; display: block; }
.wl-footer__follow { text-align: center; }
.wl-footer__followLabel { font-size: 12px; letter-spacing: .12em; color: #222; margin-bottom: 10px; }
.wl-footer__sns { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #222; color: #fff; font-size: 18px; }
.wl-footer__sns:hover { background: var(--woollen-primary); color: #fff; }
.wl-footer__info { gap: 48px; }
.wl-footer__copyright { text-align: center; font-size: 11px; color: #888; margin-top: 24px; }
@media (min-width: 768px) {
  .wl-footer__topGrid { flex-flow: row wrap; gap: 40px 32px; align-items: flex-start; }
  .wl-footer__topGrid > .wl-footer__col { flex: 0 0 calc((100% - 64px) / 3); }        /* 3列 */
  .wl-footer__topGrid > .wl-footer__col--panels { order: -1; flex: 0 0 100%; flex-direction: row; gap: 24px; } /* 最上部・全幅・横並び */
  .wl-footer__col--panels .wl-footer__panel { flex: 1; }
  .wl-footer__cols2 { gap: 20px; }
  .wl-footer__bottomGrid { flex-direction: row; justify-content: space-between; text-align: left; gap: 30px; }
  .wl-footer__logo { text-align: left !important; }
}
/* PC Wide(1024〜): 4カラム横並び（OUTLET/NEWSLETTER は右端の列で縦積みに戻す） */
@media (min-width: 1024px) {
  .wl-footer__topGrid { flex-wrap: nowrap; gap: 80px; }
  .wl-footer__topGrid > .wl-footer__col { flex: 1 1 auto; }
  .wl-footer__topGrid > .wl-footer__col--panels { order: 0; flex: 0 1 auto; flex-direction: column; gap: 16px; }
  .wl-footer__cols2 { gap: 64px; }
}

@media (max-width: 767px) {
  .wl-footer__topGrid > .wl-footer__col:nth-child(2) .wl-footer__cols2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 16px;
    row-gap: 0;
  }
  .wl-footer__topGrid > .wl-footer__col:nth-child(2) .wl-footer__cols2 > ul {
    display: contents;
  }
}

/* ===== ページトップへ戻る ===== */
.ec-blockTopBtn.pagetop {
  position: fixed; right: 22px; bottom: 22px; z-index: 40;
  width: 42px; height: 42px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: #222; border: 1px solid #ccc; border-radius: 2px;
  font-size: 16px; box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
}
.ec-blockTopBtn.pagetop:hover { background: #222; color: #fff; border-color: #222; }

.wl-main--full { width: 100%; }

/* ----- キービジュアル(hero-slider)：表示枚数(--hero-pv)基準・中央寄せ ----- */
/* 〜1280px: 表示枚数1（全幅1スライド） / 1280px〜: 表示枚数1.5（中央＋両端チラ見せ） */
@media (min-width: 768px) {
  .hero-slider .hero-slider__track {
    aspect-ratio: auto;
    align-items: center;
    --hero-pv: 1;  /* slidesPerView 相当の表示枚数 */
    /* 中央寄せ：50%(=画面中央) − アクティブ半分 − idx×1枚ぶん（1枚 = 100%/表示枚数） */
    transform: translateX(calc(50% - 50% / var(--hero-pv) - var(--slider-idx, 0) * 100% / var(--hero-pv)));
  }
  .hero-slider__item { flex: 0 0 calc(100% / var(--hero-pv)); }
  .hero-slider__item img { width: 100%; height: auto; object-fit: cover; }
}
/* ワイド(1280px〜)：表示枚数 1.3 */
@media (min-width: 1280px) {
  .hero-slider .hero-slider__track { --hero-pv: 1.3; }
}

/* ----- 注目のキーワード（ヒーロー直下の検索チップ） ----- */
.wl-keywords { border-bottom: 1px solid #e5e5e5; background: #fff; }
/* 見出し（FEATURES と同形式: 英字大＋日本語小・中央） */
.wl-keywords__head { text-align: center; padding: 28px 14px 16px; }
.wl-keywords__head .en { display: block; font-family: var(--wl-font-en); font-size: 26px; font-weight: 400; letter-spacing: .06em; }
.wl-keywords__head .ja { display: block; font-size: 12px; color: #555; margin-top: 4px; }
.wl-keywords__label { flex: 0 0 auto; font-size: 15px; font-weight: 700; letter-spacing: .08em; color: #333; }
/* SPも横スクロールにせず折り返して全キーワードを表示 */
.wl-keywords__list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.wl-keywords__chip { display: inline-block; white-space: nowrap; padding: 6px 14px; border: 1px solid #ccc; border-radius: 999px; font-size: 12px; color: #333; background: #fff; transition: background .2s, color .2s, border-color .2s; }
.wl-keywords__chip:hover { background: #222; color: #fff; border-color: #222; }
/* page03_top_lowheader KEYWORDS: 枠なし・見出しは共通 .sec-title・チップは中央寄せ（各キーワードに #） */
.wl-keywords__body { max-width: 1100px; margin: 0 auto; padding: 0 14px; }
.wl-keywords--ranked .wl-keywords__list { justify-content: center; gap: 12px; }
.wl-keywords--ranked .wl-keywords__chip { padding: 11px 20px; font-size: 13px; letter-spacing: .04em; }
/* 上位3件のランキングチップ（黒地＋順位＋右上矢印）。通常チップの1行上に独立表示 */
.wl-keywords__list--rank { margin-bottom: 14px; }
.wl-keywords--ranked .wl-keywords__chip--rank {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 11px 22px; background: #222; border-color: #222; color: #fff;
}
.wl-keywords--ranked .wl-keywords__chip--rank:hover { background: #000; border-color: #000; }
.wl-keywords__rank { font-family: var(--wl-font-en); font-size: 14px; font-weight: 600; line-height: 1; }
/* 右上向き矢印。Free版に fa-arrow-up-right が無いため fa-arrow-up を45度回転して代用 */
.wl-keywords__arrow { font-size: 12px; color: var(--woollen-primary); transform: rotate(45deg); }
/* 直下の背景固定バナーとの間隔（SP=40px / PC=80px は媒体クエリ側で上書き） */
.wl-keywords + .wl-hero-banner,
.wl-infobar--news + .wl-hero-banner,
.wl-newsbar + .wl-hero-banner { margin-top: 40px; }
@media (min-width: 768px) {
  .wl-keywords__label { font-size: 17px; }
  .wl-keywords__list { justify-content: center; }
}

/* ----- FEATURES（特集スワイパー） ----- */
/* FEATURES: 見出し上の余白を半分（SP 48→24px / PC 96→48px）※後方の .wl-main--full .section より高詳細度に */
.wl-main--full .section.wl-feature { padding-top: 24px; }
@media (min-width: 768px) { .wl-main--full .section.wl-feature { padding-top: 48px; } }
.wl-feature__head { position: relative; text-align: center; padding: 28px 14px 16px; }
.wl-feature__head .en { display: block; font-family: var(--wl-font-en); font-size: 26px; font-weight: 700; letter-spacing: .18em; }
.wl-feature__head .ja { display: block; font-size: 12px; color: #555; margin-top: 4px; }
.wl-feature__head .all { display: none; font-size: 12px; color: #555; text-decoration: underline; text-underline-offset: 12px; }
.wl-feature__all-sp { display: block; text-align: center; padding: 20px 0 0; font-size: 12px; color: #555; text-decoration: underline; text-underline-offset: 12px; }
.wl-feature__swiper { position: relative; padding: 0 24px; }
@media (min-width: 768px) { .wl-feature__swiper { padding: 0 48px; } }  /* 画面両端に少し余白 */
.wl-feature__swiper .swiper-slide { height: auto; }
.wl-feature__nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 36px; height: 56px; display: flex; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .4); color: #fff; font-size: 24px; cursor: pointer; user-select: none;
}
.wl-feature__nav--prev { left: 14px; }
.wl-feature__nav--next { right: 14px; }
.wl-feature__nav.swiper-button-disabled,
.wl-feature__nav.swiper-button-lock { opacity: 0; pointer-events: none; }
.wl-feature__card { position: relative; display: block; overflow: hidden; background: #eee; }
.wl-feature__card img { width: 100%; height: auto; display: block; }
/* FEATURE 画像上のテキストは非表示（画像のみ表示） */
.wl-feature__overlay, .wl-feature__couponRibbon { display: none; }
/* PC: 「一覧」リンクを右上に絶対配置、見出しサイズ拡大 */
@media (min-width: 768px) {
  .wl-feature__head .all { display: inline-block; position: absolute; right: 32px; bottom: 28px; margin-top: 0; }
  .wl-feature__all-sp { display: none; }
  .wl-feature__head .en { font-size: 28px; }
  .wl-feature__head .ja { margin-top: 1px; }
  .wl-feature__head { padding-bottom: 28px; }
}
@media (min-width: 1024px) {
  .wl-feature__head .en { font-size: 32px; }
}

/* ----- FEATURE下バナー / INFORMATION / NEW ARRIVAL ヒーロー ----- */
.wl-topbanner { display: block; max-width: 900px; margin: 24px auto; padding: 0 14px; }
.wl-topbanner img { width: 100%; height: auto; display: block; }

.wl-info { margin-top: 64px; }
.wl-info__list { max-width: 1000px; margin: 0 auto; padding: 0 14px; border-top: 1px solid #e5e5e5; }
.wl-info__item { display: block; text-align: center; padding: 18px 14px; border-bottom: 1px solid #e5e5e5; font-size: 13px; color: #333; text-decoration: underline; }
.wl-info__item:hover { color: var(--woollen-primary); }

/* ----- INFORMATION バー（ヒーロー直下・お知らせ縦1件ローテーション） ----- */
.wl-infobar { background: #fff; border-bottom: 1px solid #e5e5e5; }
.wl-infobar__inner { max-width: 760px; margin: 0 auto; padding: 0 14px; height: 84px; display: flex; align-items: center; gap: 12px; } /* 最大幅は NEWS と同じ 760px */
.wl-infobar__label { flex: 0 0 72px; font-family: var(--wl-font-en); font-size: 12px; letter-spacing: .1em; color: #222; }
@media (min-width: 768px) { .wl-infobar__label { flex-basis: 130px; } } /* INFORMATION / NEWS で左幅を統一 */
.wl-infobar__divider { flex-shrink: 0; width: 1px; height: 18px; background: #e5e5e5; }
.wl-infobar__swiper.swiper { flex: 1; min-width: 0; height: 44px; margin: 0; overflow: hidden; }
/* slidesPerView:'auto' 用 — スライド幅はコンテンツ幅（コンテナ幅上限） */
.wl-infobar__swiper .swiper-slide { width: auto; max-width: 100%; }
/* ※ Swiper が注入する .swiper-slide { display:block } に勝つよう詳細度を上げる */
.wl-infobar .wl-infobar__slide { display: flex; align-items: center; height: 100%; line-height: 1.6; font-size: 12px; color: #333; overflow: hidden; position: relative; padding-left: 16px; } /* 本文は .wl-infobar__text でクランプ */
/* スライド左端の塗りつぶし丸（ピンク） */
.wl-infobar__slide::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: #ee7fa6; }
.wl-infobar__slide:hover { color: var(--woollen-primary); text-decoration: underline; text-decoration-color: #f6bcd2; }
/* カウンター＋矢印のグループ（SPのみ表示。カウンター横並び・その下に矢印） */
.wl-infobar__ctrl { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; }
@media (min-width: 768px) { .wl-infobar__ctrl { display: none; } }
.wl-infobar__count { font-family: var(--wl-font-en); font-size: 10px; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: .08em; color: #999; }
.wl-infobar__count-sep { margin: 0 3px; color: #ccc; }
/* シンプル版 INFORMATION（見出し・カウンターなし。1行×縦スライド） */
.wl-infobar--simple .wl-infobar__inner { height: 44px; }
.wl-infobar--simple .wl-infobar__text { -webkit-line-clamp: 1; }
.wl-infobar--simple .wl-infobar__navs { flex-direction: column; gap: 2px; }
.wl-infobar--simple .wl-infobar__date { flex: 0 0 auto; margin-right: 10px; }

/* NEWS（中央見出し＋3件の静的縦リスト。各行は日付＋見出しの2段） */
.wl-newsbar { background: #fff; }
.wl-newsbar .sec-title { padding-top: 33px; } /* 見出し上の余白 22px の1.5倍 */
.wl-newsbar__list { max-width: 760px; margin: 0 auto; padding: 0 14px; }
.wl-newsbar__item { display: flex; flex-direction: column; gap: 2px; position: relative; padding: 12px 24px 12px 16px; line-height: 1.6; color: #222; }
/* NEWS の本文は黒（.wl-infobar__text は INFORMATION バー等と共有なので .wl-newsbar 配下に限定） */
.wl-newsbar__item .wl-infobar__text { color: #222; }
.wl-newsbar__item + .wl-newsbar__item { border-top: 1px solid #eee; }
.wl-newsbar__item::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: #ee7fa6; }
/* 各行の右端の矢印（詳細へ誘導。SPの2段組み・PCの1行組みどちらでも右端中央） */
.wl-newsbar__arrow { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); font-size: 13px; color: #222; transition: color .2s; }
.wl-newsbar__item:hover .wl-infobar__text,
.wl-newsbar__item:hover .wl-newsbar__arrow { color: var(--woollen-primary); }
/* 一覧リンク「新着一覧」（FEATURES の「特集・キャンペーン一覧」と同配置: SP=下部中央 / PC=見出し右端） */
.wl-newsbar .sec-title { position: relative; }
.wl-newsbar .sec-title .all { display: none; font-size: 12px; font-weight: 400; color: #555; text-decoration: underline; text-underline-offset: 12px; }
.wl-newsbar__all-sp { display: block; text-align: center; padding: 20px 14px 24px; font-size: 12px; color: #555; text-decoration: underline; text-underline-offset: 12px; }
@media (min-width: 768px) {
  /* 基準をコンテンツ幅（リストと同じ max-width:1000px）にし、セクション右端に揃える */
  .wl-newsbar .sec-title { max-width: 760px; margin-left: auto; margin-right: auto; }
  .wl-newsbar .sec-title .all { display: inline-block; position: absolute; right: 14px; bottom: 28px; }
  .wl-newsbar__all-sp { display: none; }
}
@media (min-width: 768px) {
  /* PC: 日付と見出しを横並びに */
  .wl-newsbar__item { flex-direction: row; align-items: center; gap: 16px; }
}

.news-list--newsbar .news-list__row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px;
  position: relative; padding: 12px 24px 12px 16px;
  border-bottom: 0; line-height: 1.6; font-size: 12px;
}
.news-list--newsbar .news-list__row + .news-list__row { border-top: 1px solid #eee; }
.news-list--newsbar .news-list__row::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: #ee7fa6; }
.news-list--newsbar .news-list__date { font-size: 11px; color: #888; letter-spacing: .04em; }
.news-list--newsbar .news-list__cat { align-self: center; }
/* カテゴリバッジ: 横幅統一＋黒べた塗りで全カテゴリ統一（common.css のカラーバッジ定義を上書き。page71/72 共通） */
.news-list__cat,
.news-list__cat--important,
.news-list__cat--info,
.news-list__cat--campaign,
.news-list__cat--restock { flex: 0 0 auto; width: 7em; padding: 2px 0; border: 0; background: #222; color: #fff; }
/* SP: 1行目=日付＋バッジ、2行目〜=タイトル（TOPと同じ2行クランプ） */
.news-list--newsbar .news-list__title { flex: 1 1 100%; font-size: 12px; color: #222; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .2s; }
.news-list--newsbar .news-list__row:hover .news-list__title,
.news-list--newsbar .news-list__row:hover .wl-newsbar__arrow { color: var(--woollen-primary); }
@media (min-width: 768px) {
  /* PC: TOP同様1行並び（日付/バッジ/タイトル/矢印） */
  .news-list--newsbar .news-list__row { flex-wrap: nowrap; gap: 16px; }
  .news-list--newsbar .news-list__title { flex: 1 1 auto; }
}

/* NEWS バー（INFORMATION直下・同構造。スライドは1行目日付＋2〜3行目本文） */
.wl-infobar--news .wl-infobar__swiper.swiper { height: auto; }
.wl-infobar--news .wl-infobar__divider { height: 40px; }
.wl-infobar__label--news { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
/* INFORMATION の改行: SPのみ2行（INFOR/MATION）。PCは1行 */
@media (min-width: 768px) {
  .wl-infobar__br { display: none; }
  /* NEWS ラベル: PCは NEWS と VIEW MORE を横並び */
  .wl-infobar__label--news { flex-direction: row; align-items: center; gap: 14px; }
}
.wl-infobar__more { font-family: var(--wl-font-en); font-size: 10px; letter-spacing: .08em; color: #999; text-decoration: underline; text-underline-offset: 4px; }
.wl-infobar__more:hover { color: var(--woollen-primary); }
.wl-infobar .wl-infobar__slide--news { display: flex; flex-direction: column; justify-content: center; gap: 4px; height: 100%; line-height: 1.5; white-space: normal; }
.wl-infobar__date { font-family: var(--wl-font-en); font-size: 11px; color: #888; letter-spacing: .04em; }
.wl-infobar__text { font-size: 12px; color: #333; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* 横スライド用: 左右矢印を横並びに */
.wl-infobar__navs { flex-shrink: 0; display: flex; flex-direction: row; gap: 8px; }
.wl-infobar__nav-btn { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; color: #222; cursor: pointer; transition: opacity .2s; }
.wl-infobar__nav-btn:hover { opacity: .6; }
.wl-infobar__nav-btn svg { width: 15px; height: 15px; }
@media (min-width: 768px) {
  .wl-infobar__inner { gap: 24px; }
  .wl-infobar__label { font-size: 13px; }
  .wl-infobar__slide { font-size: 13px; }
  /* PC: NEWS バーのみ Swiper 不使用の3等分静的表示（JS側で destroy） */
  .wl-infobar--news .wl-infobar__swiper .swiper-wrapper { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
  .wl-infobar--news .wl-infobar__swiper .swiper-slide { width: auto; max-width: none; display: flex; justify-content: center; gap: 0; }
  .wl-infobar--news .wl-infobar__navs { display: none; }
}

.wl-hero-banner { position: relative; width: 100%; margin: 24px 0; overflow: hidden; }
.wl-hero-banner img { width: 100%; height: auto; display: block; }
.wl-hero-banner__overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; }
.wl-hero-banner__overlay .en { font-family: var(--wl-font-en); font-size: 26px; font-weight: 700; letter-spacing: .18em; text-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
.wl-hero-banner__overlay .ja { font-size: 13px; margin-top: 2px; text-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
@media (min-width: 768px) { .wl-hero-banner__overlay .en { font-size: 28px; } }
@media (min-width: 1024px) { .wl-hero-banner__overlay .en { font-size: 32px; } }
/* 背景固定（パララックス）版: <img> を置かず背景画像で表示（page03_top_lowheader の NEW ARRIVAL / OUTLET） */
.wl-hero-banner--fixed { height: 60vw; background: url("../img/low_header11.jpeg") center / cover no-repeat; }
.wl-hero-banner--fixed2 { background-image: url("../img/low_header08.jpeg"); } /* 2つ目（RESTOCK 上）の画像 */
@media (min-width: 768px) { .wl-hero-banner--fixed2 { display: none; } } /* 2つ目はSP専用（PC非表示） */
/* SPのみ: バナー画像上に見出し（NEW ARRIVAL / RESTOCK）を表示 */
.wl-hero-banner__overlay--sp { display: none; }
@media (max-width: 767px) {
  .wl-hero-banner__overlay--sp { display: flex; }
  /* 画像上に見出しを出すため、セクション側の見出しはSPでは非表示 */
  .wl-newarrival > .sec-title { display: none; }
}
/* CONCEPT セクション（本文最下部・ブランドコピー） */
.wl-concept { background-image: url("../img/low_header12.jpeg"); }
.wl-concept__brand { font-family: var(--wl-font-en); font-size: 30px; font-weight: 400; letter-spacing: 0; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
.wl-concept__copy { font-size: 12px; letter-spacing: .3em; margin-top: 14px; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
@media (min-width: 768px) {
  .wl-concept__brand { font-size: 44px; }
  .wl-concept__copy { font-size: 14px; }
}
@media (min-width: 768px) {
  /* fixed は PC のみ（iOS Safari は background-attachment: fixed 非対応のため SP は通常スクロール） */
  .wl-hero-banner--fixed { height: 40vw; background-attachment: fixed; }
}

/* ----- RECOMMEND scroller ナビ（.wl-na__nav スタイルに統一） ----- */
.scroller__nav { background: transparent; color: #707070; font-size: 44px; width: 36px; cursor: pointer; }

/* ----- NEW ARRIVAL（スワイパー＋カード） ----- */
.wl-na__swiper.swiper { position: relative; padding: 0 14px; }  /* .swiper でSwiper実行時CSSの padding:0 に勝たせる */
.wl-na__swiper .swiper-slide { height: auto; }
.wl-na__nav {
  position: absolute; top: 42%; transform: translateY(-50%); z-index: 3;
  width: 36px; height: 56px; display: flex; align-items: center; justify-content: center;
  background: transparent; color: #707070; font-size: 44px;
  cursor: pointer; user-select: none;
}
.wl-na__nav--prev { left: 24px; }
.wl-na__nav--next { right: 24px; }
.wl-na__nav.swiper-button-disabled,
.wl-na__nav.swiper-button-lock { opacity: 0; pointer-events: none; }
/* 外側スライダーのページネーション（ドット）。矢印(.wl-na__nav)はドットに置換 */
.wl-na__pg { display: flex; justify-content: center; gap: 0; margin-top: 16px; }
.wl-na__pg .swiper-pagination-bullet { width: 7px; height: 7px; margin: 0; border-radius: 50%; background: rgba(0,0,0,.25); opacity: 1; cursor: pointer; transition: background .2s; }
.wl-na__pg .swiper-pagination-bullet-active { background: #222; }
.wl-na__pg.swiper-pagination-lock { display: none; }   /* 1ページのみ＝ドット非表示 */
.wl-na__pg.swiper-scrollbar,
.wl-na__pg.swiper-scrollbar-horizontal { position: relative; display: block; width: 100%; height: 12px; margin: 24px auto 0; left: auto; right: auto; bottom: auto; background: #e5e5e5; border-radius: 0; cursor: pointer; }
.wl-na__pg.swiper-scrollbar .swiper-scrollbar-drag,
.wl-na__pg.swiper-scrollbar-horizontal .swiper-scrollbar-drag { background: repeating-linear-gradient(to bottom, #222 0 2px, transparent 2px 5px); border-radius: 0; } /* ベタ塗り→横3重線（高さ12px内に2px線×3） */
.wl-na__link { display: block; color: inherit; }
.wl-na__media { position: relative; aspect-ratio: 3 / 4; overflow: hidden; background: #f3f3f3; }
.wl-na__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* ベース(スマホ)=NEWバッジ/サムネを縦並び（下:バッジ・上:サムネ） */
.wl-na__sub { display: flex; flex-direction: column-reverse; align-items: flex-start; justify-content: space-between; gap: 6px; margin-top: 10px; min-height: 28px; }
.wl-na__badge { background: #222; color: #fff; font-family: var(--wl-font-en); font-size: 11px; letter-spacing: .08em; padding: 3px 10px; }
/* バッジ複数並び＋種別（NEW=黒 / 再入荷=グレー / キャンペーン対象=赤枠。一覧カードの badge-- 系と同トーン） */
.wl-na__badges { display: flex; flex-wrap: wrap; gap: 4px; }
.wl-na__badge--restock { background: #888; font-family: inherit; letter-spacing: .04em; }
.wl-na__badge--campaign { background: #fff; color: var(--woollen-primary); border: 1px solid var(--woollen-primary); font-family: inherit; letter-spacing: .04em; padding: 2px 9px; }
.wl-na__thumbs { display: flex; gap: 5px; }
.wl-na__thumbs img { width: 38px; height: 38px; padding: 3px; object-fit: cover; border: 1px solid #e5e5e5; background: #fff; display: block; }
/* 商品カード／一覧のサブサムネイル列（TOP新着 .wl-na__thumbs を一覧カードへ流用） */
/* バッジ＋サムネ行（TOP .wl-na__sub と同配置: 画像下・SP=縦積み(サムネ上) / PC=バッジ左・サムネ右） */
.card__sub { display: flex; flex-direction: column-reverse; align-items: flex-start; justify-content: space-between; gap: 6px; margin-top: 10px; min-height: 28px; padding-left: 10px; padding-right: 10px; }
.card__sub .card__badges { position: static; left: auto; bottom: auto; flex-wrap: wrap; }
.card__sub .card__thumbs { margin: 0; padding-left: 0; padding-right: 0; }
@media (min-width: 768px) {
  .card__sub { flex-direction: row; align-items: center; gap: 0; }
  .card__sub .card__thumbs { margin-left: auto; } /* バッジなしカードでもサムネは右端 */
}
.card__thumbs { display: flex; gap: 5px; margin: 8px 0 2px; }
.card__thumbs img { width: 38px; height: 38px; padding: 3px; object-fit: cover; border: 1px solid #e5e5e5; background: #fff; display: block; }
.wl-na__brand { margin-top: 8px; font-family: var(--wl-font-en); font-size: 12px; letter-spacing: .04em; color: #222; }
.wl-na__name { margin-top: 6px; font-size: 12px; color: #666; line-height: 1.5; }
.wl-na__price { margin-top: 6px; font-size: 13px; color: #222; }
.wl-na__price small { font-size: 11px; color: #888; margin-left: 2px; }
/* 商品カード ホバー: 第2画像フェードイン ＋「詳細を見る」スライドアップ */
.wl-na__img--hover {
    position: absolute; inset: 0;
    width: 100%; height: 100%; object-fit: cover; display: block;
    opacity: 0;
}
.wl-na__detail-btn {
    display: none;
}
@media (hover: hover) {
    .wl-na__img--main    { transition: transform .5s ease; }
    .wl-na__img--hover   { transition: opacity .4s ease; }
    .wl-na__detail-btn   { transition: transform .3s ease; }
    .wl-na__item:hover .wl-na__img--main,
    .card:hover        .wl-na__img--main   { transform: scale(1.03); }
    .wl-na__item:hover .wl-na__img--hover,
    .card:hover        .wl-na__img--hover  { opacity: 1; }
    .wl-na__item:hover .wl-na__detail-btn  { transform: translateY(0); }
}

/* カード内マルチ画像（js-img-hover）: 矢印クリック切替 */
.js-img-hover .wl-na__img {
  position: absolute; inset: 0;
  opacity: 0; transition: opacity .6s cubic-bezier(.4,0,.2,1);
}
.js-img-hover .wl-na__img.is-active { opacity: 1; }
/* メディアラッパー（矢印の位置基準） */
.wl-na__media-wrap { position: relative; }
/* 画像ドット（ページネーション）は全ページ廃止（NEW ARRIVAL/RANKING/OUTLET 等カード共通） */
.wl-na__img-dots {
  display: none; gap: 6px; justify-content: center;
  padding: 7px 0 2px; pointer-events: none;
}
.wl-na__img-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(0,0,0,.2); transition: background .2s;
}
.wl-na__img-dot.is-active { background: #222; }
/* 矢印ボタン（ラッパー基準で画像外側に） */
.wl-na__img-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 5; background: none; border: none;
  width: 52px; height: 80px;
  display: none; align-items: center; justify-content: center;   /* SP: 画像送り矢印は非表示（スワイプ/サムネで切替）。PCのみ表示 */
  font-size: 64px; font-weight: 100; line-height: 1; color: rgba(180,180,180,.9); cursor: pointer; padding: 0;
  transition: opacity .2s;
}
.wl-na__img-arrow--prev { left: 0px; }
.wl-na__img-arrow--next { right: 0px; }
@media (min-width: 768px) { .wl-na__img-arrow { display: flex; } }
@media (hover: hover) {
  .wl-na__img-arrow { opacity: 0; }
  .wl-na__item:hover .wl-na__img-arrow { opacity: 1; }
  .wl-na__img-dots { opacity: 0; }
  .wl-na__item:hover .wl-na__img-dots { opacity: 1; }
}

/* カード内ギャラリー（js-na-gallery）: サムネクリックで画像切替＋hoverで専用画像を表示 */
.js-na-gallery .wl-na__img {
  position: absolute; inset: 0;
  opacity: 0; transition: opacity .6s cubic-bezier(.4,0,.2,1);
}
.js-na-gallery .wl-na__img.is-active { opacity: 1; }
.wl-na__hoverimg {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; display: block;
  opacity: 0; z-index: 2; pointer-events: none;
}
@media (hover: hover) {
  .wl-na__hoverimg { transition: opacity .4s ease; }
  /* hover認知範囲は画像本体（.wl-na__media）のみ。矢印/ドット/サムネ/テキスト上では発火しない */
  .wl-na__media:hover .wl-na__hoverimg { opacity: 1; }
}
.wl-na__thumb { cursor: pointer; transition: border-color .2s; }
.wl-na__thumb.is-active { border-color: #222; }

/* ===== 一覧グリッドカード ギャラリー（.card：サムネクリックで画像切替＋hover専用画像） ===== */
.card__slide {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity .5s cubic-bezier(.4,0,.2,1);
}
.card__slide.is-active { opacity: 1; }
.card__hoverimg {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; z-index: 2; pointer-events: none;
}
.card__badges { z-index: 3; } /* hover画像(z-index:2)より前面でバッジを維持 */
@media (hover: hover) {
  .card__hoverimg { transition: opacity .4s ease; }
  .card__media:hover .card__hoverimg { opacity: 1; }
}
.card__thumb { cursor: pointer; transition: border-color .2s; }
.card__thumb.is-active { border-color: #222; }

.wl-na__viewall { text-align: center; margin-top: 32px; padding: 0 14px; }
.wl-na__viewall a { display: inline-block; min-width: 0; width: 100%; padding: 14px 32px; border: 1px solid #222; font-family: var(--wl-font-en); font-size: 13px; letter-spacing: .1em; color: #222; }
.wl-na__viewall a:hover { background: #222; color: #fff; }
/* PC: 横並び・余白拡大・VIEW ALLを内容幅に */
@media (min-width: 768px) {
  .wl-na__swiper.swiper { padding: 0 40px; }
  .wl-na__sub { flex-direction: row; align-items: center; gap: 0; }
  .wl-na__viewall { padding: 0; }
  .wl-na__viewall a { min-width: 220px; width: auto; }
}

/* ----- BRAND（白ロゴカード・グレー背景） ----- */
.wl-brandsec { background: #f5f5f5; margin-top: 64px; padding-bottom: 48px; }
/* BRAND + ITEM CATEGORY 共通背景（page03_top_lowheader）: 元のグレー */
.wl-lowsec-bg { background: #f5f5f5; }
.wl-lowsec-bg .wl-brandsec, .wl-lowsec-bg .wl-itemcat { background: transparent; }
.wl-lowsec-bg .wl-keywords { background: transparent; border-bottom: 0; padding-top: 24px; padding-bottom: 60px; } /* チップ下のグレー余白（計72px） */
@media (min-width: 768px) { .wl-lowsec-bg .wl-keywords { padding-bottom: 80px; } } /* PC: 計96px */
/* page03_top: ITEM CATEGORY 直下の KEYWORDS もグレー背景で連結（lowheader と同等） */
.wl-itemcat + .wl-keywords { background: #f5f5f5; border-bottom: 0; padding-top: 24px; padding-bottom: 60px; }
@media (min-width: 768px) { .wl-itemcat + .wl-keywords { padding-bottom: 80px; } }
.wl-brandsec__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; max-width: 1200px; margin: 0 auto; padding: 0 14px; }
.wl-brandsec__item { display: block; }
.wl-brandsec__item img { width: 100%; height: auto; display: block; }
@media (min-width: 768px) {
  .wl-brandsec__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 0 24px; }
}
@media (min-width: 1024px) {
  .wl-brandsec__grid { grid-template-columns: repeat(4, 1fr); }
}

/* ----- OUTLET TOP: brand-grid を TOP ページの wl-brandsec__grid サイズに揃える ----- */
/* SP: 3列 → 2列 */
.wl-main--full .brand-grid               { grid-template-columns: repeat(2, 1fr); gap: 10px; }
.wl-main--full .brand-grid__item         { aspect-ratio: auto; min-height: 0; }
.wl-main--full .brand-grid__item img     { width: 100%; height: auto; display: block; }
/* PC: 7列・全幅 */
@media (min-width: 768px) {
  .wl-main--full .brand-grid             { grid-template-columns: repeat(7, 1fr); gap: 12px; max-width: none; margin: 0; padding: 0 40px; }
  .wl-main--full .brand-grid__item       { min-height: 0; font-size: 12px; padding: 6px; }
}

/* ----- OUTLET TOP: l-listing 上余白（PC のみ） ----- */
@media (min-width: 768px) {
  .wl-main--full .l-listing { margin-top: 48px; }
  /* 商品一覧の2カラム: 上パディングは0（pc.css の 24px を上書き） */
  .l-listing { padding-top: 0; }
}


/* ----- ITEM CATEGORY（WOMAN/MENタブ＋アイコン） ----- */
.wl-itemcat { background: #f5f5f5; padding-bottom: 56px; }
.wl-itemcat__tabs { display: flex; justify-content: center; max-width: 560px; margin: 0 auto 36px; border-bottom: 1px solid #ddd; }
.wl-itemcat__tab { flex: 1; padding: 12px; background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; font-family: var(--wl-font-en); font-size: 14px; letter-spacing: .1em; color: #999; cursor: pointer; }
.wl-itemcat__tab.is-active { color: #222; border-bottom-color: #222; }
.wl-itemcat__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 10px; max-width: 1100px; margin: 0 auto; padding: 0 14px; }
/* アイコン上・ラベル下の縦積み・中央揃え */
.wl-itemcat__item { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #333; text-align: center; }
.wl-itemcat__icon { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 100%; }
.wl-itemcat__icon img { display: block; width: 80%; height: auto; }
.wl-itemcat__label { font-size: 12px; }
.wl-itemcat__item:hover .wl-itemcat__label { color: var(--woollen-primary); }
@media (min-width: 768px) {
  /* PC: アイコン拡大に合わせて列数を調整（768〜=4列 / 1024〜=5列） */
  .wl-itemcat__grid { grid-template-columns: repeat(4, 1fr); gap: 28px 20px; padding: 0 24px; }
  .wl-itemcat__label { font-size: 13px; }
}
@media (min-width: 1024px) {
  .wl-itemcat__grid { grid-template-columns: repeat(6, 1fr); }
}

/* ----- RANKING（NEW ARRIVALカード流用・スワイパー＋順位リボン） ----- */
.wl-rank__swiper.swiper { position: relative; padding: 0 14px; }
.wl-rank__swiper .swiper-slide { height: auto; }
.wl-rank__num {
  position: absolute; top: 0; left: 0; z-index: 3; /* hover画像(z-index:2)より前面に */
  width: 42px; height: 42px; clip-path: polygon(0 0, 100% 0, 0 100%);
  color: #fff; font-family: var(--wl-font-en); font-weight: 700; font-size: 14px; line-height: 1; padding: 4px 0 0 5px;
}
.wl-rank__num--1 { background: #c9a227; } /* 金 */
.wl-rank__num--2 { background: #aab0b5; } /* 銀 */
.wl-rank__num--3 { background: #b9803d; } /* 銅 */
@media (min-width: 768px) {
  .wl-rank__swiper.swiper { padding: 0 40px; }
}

/* ----- ブランド詳細：ブランド説明文 ----- */
.wl-brand-desc { max-width: 960px; margin: 32px auto 44px; padding: 0 20px; }  /* 背景なし：上下はmargin、左右paddingは内寄せとして温存 */
.wl-brand-desc__inner { display: flex; flex-direction: column; gap: 20px; }
.wl-brand-desc__logo { width: 100px; height: 100px; border-radius: 50%; overflow: hidden; border: 1px solid #e8e8e8; flex-shrink: 0; margin: 0 auto; }
.wl-brand-desc__logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wl-brand-desc__body { flex: 1; }
.wl-brand-desc__name { font-family: var(--wl-font-en); font-size: 22px; letter-spacing: .06em; line-height: 1; }
.wl-brand-desc__text { font-size: 13px; line-height: 1.9; color: #555; margin-top: 12px; }
.wl-brand-desc__text + .wl-brand-desc__text { margin-top: 6px; }
.wl-brand-desc__btn { display: block; text-align: center; padding: 13px 0; border: 1px solid #222; margin-top: 24px; font-family: 'Times New Roman', serif; font-weight: 700; letter-spacing: .05em; color: #222; }
.wl-brand-desc__btn:hover { background: #222; color: #fff; }

/* ===== ページヘッダー帯（画像背景＋文字オーバーレイ・全幅）。任意ページで再利用可 ===== */
.page-hero { position: relative; background-size: cover; background-position: center; min-height: 150px; display: flex; align-items: center; justify-content: center; text-align: center; }
.page-hero::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.32); }
.page-hero__inner { position: relative; z-index: 1; color: #fff; padding: 24px 16px; }
.page-hero__en { display: block; font-family: var(--wl-font-en); font-size: 28px; font-weight: 400; letter-spacing: .14em; line-height: 1.1; }
.page-hero__ja { display: block; font-size: 12px; letter-spacing: .1em; margin-top: 8px; }
/* 日本語のみパターン（.page-hero--ja）: 英字なし・日本語をメインタイトルとして表示 */
.page-hero--ja .page-hero__ja { margin-top: 0; font-size: 20px; font-weight: 500; letter-spacing: 0; }
/* 左寄せパターン（.page-hero--left）: 見出しを記事本文カラム（.article-hero/.article-body の880px）に合わせて左寄せ（page72） */
.page-hero--left .page-hero__inner { width: 100%; max-width: 880px; margin: 0 auto; padding: 24px 14px; text-align: left; }
/* 記事タイトル入りパターン（.page-hero__title）: 記事見出しを画像上にメイン表示（page72）。サイズは --ja の見出し(20px/28px)と統一 */
.page-hero__title { font-size: 20px; font-weight: 500; line-height: 1.6; margin: 0; }
/* 記事ページ用: パンくずを本文カラム（.article-hero/.article-body の880px）に合わせる（page72） */
.breadcrumb--article { max-width: 880px; margin: 0 auto; }
@media (min-width: 768px) {
  .page-hero { min-height: 220px; }
  .page-hero__en { font-size: 42px; }
  .page-hero__ja { font-size: 13px; margin-top: 10px; }
  .page-hero--ja .page-hero__ja { font-size: 28px; }
  /* PC: 記事本文(.article-hero/.article-body)の左右パディング24px(pc.css)に合わせる */
  .page-hero--left .page-hero__inner { padding: 24px; }
  .page-hero__title { font-size: 28px; }
}

/* ===== 帯バナー（画像のみ・全幅・文字なし）。任意ページで再利用可 ===== */
.page-banner { background-size: cover; background-position: center; min-height: 300px; }
@media (min-width: 768px) { .page-banner { min-height: 480px; } }

/* ===== BRANDS 紹介（page11）: ロゴ＋説明＋「商品をみる」ボタン（横並び） ===== */
/* アンカージャンプを滑らかに（慣性スクロール） */
html { scroll-behavior: smooth; }
/* ブランド内リンクナビ（各ブランドへジャンプ・枠線チップ） */
.brand-nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; max-width: none; margin: 32px auto 0; padding: 0 24px; }  /* SP: 2列 */
.brand-nav a { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: #555; letter-spacing: .04em; padding: 10px 18px; border: 1px solid #ccc; transition: background .2s, color .2s, border-color .2s; line-height: 1.2; }
.brand-nav a:hover { background: #222; color: #fff; border-color: #222; }
.brand-nav__en { font-family: var(--wl-font-en); font-size: 13px; font-weight: 600; }
.brand-nav__ja { font-size: 11px; }
.brand-nav a::after { content: ""; border-style: solid; border-width: 5px 4px 0 4px; border-color: currentColor transparent transparent transparent; margin-top: 3px; }
@media (min-width: 768px) {
  /* PC/タブレット: 横幅いっぱいに。auto-fit で列数自動、各列は 1fr で等幅に伸びて全幅を埋める（SPは2列） */
  .brand-nav { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
}
.brand-intro { scroll-margin-top: 100px; }  /* sticky ヘッダー分のアンカーオフセット */

.brand-intros { max-width: none; margin: 48px auto 0; padding: 0 24px; }
.brand-intro { display: flex; flex-direction: column; gap: 24px; padding: 56px 0; border-top: 1px solid var(--woollen-line); }
.brand-intro:first-child { border-top: 0; padding-top: 8px; }
/* 横長ビジュアル（ブランドロゴ・名称を内包）。SP=上に全幅、PC=左半分 */
.brand-intro__media { flex: 0 0 auto; width: 100%; }
.brand-intro__media img { display: block; width: 100%; height: auto; }
.brand-intro__body { flex: 1; min-width: 0; max-width: 700px; margin-inline: auto; }  /* 右側ボックスは700px上限で中央寄せ */
.brand-intro__name { font-family: var(--wl-font-en); font-size: 24px; letter-spacing: 0; font-weight: 700; margin: 0 0 18px; }
.brand-intro p { font-size: 14px; line-height: 1.95; color: #555; margin: 0 0 14px; }
/* ボタン2つ（ブランドページへ＝黒 / 商品を探す＝アウトライン）を等幅で横並び・全体で横幅いっぱい */
.brand-intro__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.brand-intro__btn { display: flex; align-items: center; justify-content: center; min-height: 50px; padding: 13px 20px; background: #222; color: #fff; font-size: 13px; letter-spacing: .08em; border: 1px solid #222; transition: background .2s, color .2s; text-align: center; }
.brand-intro__btn:hover { background: #fff; color: #222; }
.brand-intro__btn--outline { background: #fff; color: #222; }
.brand-intro__btn--outline:hover { background: #222; color: #fff; }
@media (min-width: 1280px) {
  /* 2カラム化は1280px以上で（〜1279pxは1カラムのまま）。左半分=ビジュアル / 右半分=ブランド名＋説明。左右は上下中央揃い */
  .brand-intro { flex-direction: row; align-items: center; gap: 48px; }
  .brand-intro__media { flex: 0 0 50%; width: 50%; }
}
@media (min-width: 768px) {
  .wl-brand-desc { margin-block: 40px 52px; padding: 0 32px; }  /* PC：上下はmargin、左右paddingは温存 */
  .wl-brand-desc__inner { flex-direction: row; align-items: flex-start; gap: 44px; }
  .wl-brand-desc__logo { width: 140px; height: 140px; margin: 0; }
}

/* ----- 法務ページ：章見出し・表・括弧付き番号リスト（page67_privacy 等） ----- */
/* 章見出し（第N章=h2）：黒ベタ塗り・白文字・左寄せの帯（条見出し .legal-article=h3 より上位） */
.legal-chapter { font-size: 19px; font-weight: 700; color: #fff; background: #222; text-align: left; padding: 16px 20px; margin: 44px 0 18px; line-height: 1.55; }
.legal-wrap .legal-chapter:first-of-type { margin-top: 16px; }
/* page80 等：帯見出しを legal-block 内に置く場合は上マージンを詰める（過度な余白防止） */
.legal-block > .legal-chapter { margin-top: 0; }
/* 条見出し（第N.N条=h3）：章(h2)の下位レベル。見た目は黒の左ライン見出し（旧 .legal-block h2 相当） */
.legal-block h3.legal-article { font-size: 17px; font-weight: 700; color: #222; padding: 8px 0 8px 12px; border-left: 4px solid #222; margin: 0 0 12px; }

/* ===== 商品一覧（page06 等）：タブ高さ揃え・並び替えセレクト ===== */
/* WOMEN/MEN タブ と カテゴリタブの「箱」の高さを揃える（中央に文字を配置） */
.tabs-gender__item,
.tabs-gender__subitem { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; box-sizing: border-box; }
/* カテゴリバーの上下余白を詰める（WOMENの黒下線〜カテゴリ下のグレー下線の間隔を縮める） */
.tabs-gender__sub { padding: 6px 16px; }
/* 並び替えセレクト（商品一覧タイトル行の右端へ。旧 .tabs-sub の置換） */
.l-listing__sort { font-size: 13px; color: #444; padding: 7px 10px; border: 1px solid #ccc; border-radius: 2px; background: #fff; cursor: pointer; line-height: 1.4; }
.wl-sortbar { display: flex; justify-content: flex-end; padding: 12px 12px 0; }
@media (min-width: 768px) { .wl-sortbar { max-width: 1280px; margin: 0 auto; padding: 16px 24px 0; } }
@media (min-width: 1024px) { .wl-sortbar { padding-left: 40px; padding-right: 40px; } }
@media (min-width: 768px) {
  /* PC: タイトル左・並び替え右の1行（pc.css の display:block を上書き） */
  .l-listing__title { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; }
  /* サイドバーの「対象商品N件」バッジをタイトル行と同じ高さ44pxにして下端を揃える */
  .l-filter__badge { display: flex; align-items: center; justify-content: center; height: 44px; padding-top: 0; padding-bottom: 0; box-sizing: border-box; }
}
@media (max-width: 767px) {
  /* SP: タイトル文言は従来どおり非表示。並び替えセレクトのみ右端に表示 */
  .l-listing__title { display: flex !important; align-items: center; justify-content: flex-end; padding: 10px 14px; }
  .l-listing__title-text { display: none; }
}
/* 適法性根拠などの表：SPは横スクロールで保持 */
.legal-table-wrap { overflow-x: auto; margin: 14px 0 18px; -webkit-overflow-scrolling: touch; }
.legal-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 15px; }
.legal-table th, .legal-table td { border: 1px solid #ddd; padding: 10px 12px; text-align: left; vertical-align: top; line-height: 1.7; }
.legal-table thead th { background: #f3f3f3; font-weight: 700; white-space: nowrap; }
.legal-table td:first-child { background: #fafafa; font-weight: 600; }
/* (1)(2)… の括弧付き番号リスト（表からの参照番号に対応） */
ol.legal-ol-paren { list-style: none; counter-reset: lp; padding-left: 0; margin: 8px 0 12px; font-size: 15px; line-height: 1.95; color: #444; }
.legal-ol-paren > li { counter-increment: lp; position: relative; padding-left: 2.6em; margin: 4px 0; }
.legal-ol-paren > li::before { content: "(" counter(lp) ")"; position: absolute; left: 0; color: #444; }
/* 用語＋説明の定義リスト（適法性根拠の詳細など） */
ul.legal-deflist { list-style: none; padding-left: 0; margin: 6px 0 12px; font-size: 15px; line-height: 1.95; color: #444; }
.legal-deflist > li { padding: 3px 0 3px 6.5em; text-indent: -6.5em; }
.legal-deflist > li strong { display: inline-block; min-width: 6em; text-indent: 0; }
/* 問い合わせ窓口ブロック */
.legal-contact { background: #f8f8f8; padding: 16px 18px; font-size: 15px; line-height: 1.95; color: #444; margin-top: 12px; }
.legal-contact strong { display: block; margin: 10px 0 2px; }
.legal-contact strong:first-child { margin-top: 0; }

/* ----- ブランド商品一覧（page14/15）：ページ上部のブランドロゴ（page12 と同じ円形トリミング） ----- */
.wl-brandlist__logo { text-align: center; padding: 20px 14px 6px; }
.wl-brandlist__logo img { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; border: 1px solid #e8e8e8; margin: 0 auto; display: block; }
@media (min-width: 768px) { .wl-brandlist__logo img { width: 120px; height: 120px; } }
/* ブランド選択解除（ロゴ直下・全商品一覧へ戻る） */
.wl-brandlist__clear { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 12px; color: #555; text-decoration: underline; text-underline-offset: 4px; }
.wl-brandlist__clear:hover { color: var(--woollen-primary); }
.wl-brandlist__clear .fa-solid { font-size: 11px; }

/* 選択中の絞り込み条件バー（2カラム .l-listing の上に全幅配置・チップの × でその条件だけ解除） */
.wl-activefilters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 14px; background: #f7f7f7; border: 1px solid #eee; border-radius: 3px; margin: 0 14px 14px; }
.wl-activefilters__label { font-size: 12px; font-weight: 700; color: #333; }
.wl-activefilters__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.wl-activefilters__chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; background: #fff; border: 1px solid #ccc; border-radius: 999px; font-size: 12px; color: #333; }
.wl-activefilters__chip:hover { border-color: var(--woollen-primary); color: var(--woollen-primary); }
.wl-activefilters__chip .fa-xmark { font-size: 11px; color: #999; }
.wl-activefilters__chip:hover .fa-xmark { color: var(--woollen-primary); }
.wl-activefilters__swatch { width: 14px; height: 14px; border-radius: 50%; border: 1px solid #ccc; display: inline-block; }
.wl-activefilters__clear { margin-left: auto; font-size: 12px; color: #555; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.wl-activefilters__clear:hover { color: var(--woollen-primary); }
@media (min-width: 768px) { .wl-activefilters { margin-left: 40px; margin-right: 40px; } }

/* バッジ＋絞り込み中バーの横並びラッパ（page06）：強調バッジをバーの外側・左隣に置き、バーは残り幅いっぱい */
.wl-filterbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 14px 14px; }
.wl-filterbar .wl-activefilters { flex: 1; margin: 0; }
@media (min-width: 768px) { .wl-filterbar { gap: 12px; margin-left: 40px; margin-right: 40px; } }
.wl-filter-badge--outlet { display: inline-flex; align-items: center; justify-content: center; padding: 3px 10px; background: var(--woollen-primary); color: #fff; font-family: var(--wl-font-en); font-size: 11px; font-weight: 700; border-radius: 2px; white-space: nowrap; }
.wl-filter-badge__icon { height: 1.25em; width: auto; margin-right: .35em; }
.wl-filter-badge--brand { display: inline-block; padding: 3px 10px; background: #333; color: #fff; font-family: var(--wl-font-en); font-size: 11px; font-weight: 700; border-radius: 2px; white-space: nowrap; }
/* SP はバッジを横幅いっぱいの帯にする（1行占有・センター。バーは折り返して次の行へ） */
@media (max-width: 767.98px) {
  .wl-filter-badge--outlet,
  .wl-filter-badge--brand { flex: 1 0 100%; text-align: center; padding: 6px 10px; }
}
/* PC はバッジを大きく見せる（3倍=33px から少し縮小） */
@media (min-width: 768px) {
  .wl-filter-badge--outlet,
  .wl-filter-badge--brand { font-size: 26px; padding: 8px 24px; border-radius: 4px; }
}

/* ----- ブランド詳細：カテゴリナビ（タブ下線スタイル） ----- */
/* ブランド詳細: 条件で探す（フィルターフォーム）。チェック→「この条件で探す」で商品一覧へ */
.wl-brandFilter { max-width: 1080px; margin: 10px auto 0; padding: 0 24px; }
.wl-brandFilter__grid { display: grid; grid-template-columns: 1fr; gap: 24px 40px; }
@media (min-width: 600px) { .wl-brandFilter__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) { .wl-brandFilter__grid { grid-template-columns: repeat(3, 1fr); } }
.wl-brandFilter__block h4 { font-size: 13px; font-weight: 700; letter-spacing: .06em; color: #222; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid #e5e5e5; }
.wl-brandFilter__list { list-style: none; margin: 0; padding: 0; }
.wl-brandFilter__list li { padding: 4px 0; }
.wl-brandFilter__list label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #444; cursor: pointer; }
.wl-brandFilter__range { display: flex; align-items: center; gap: 10px; }
.wl-brandFilter__range input { flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid #ccc; font-size: 13px; }
.wl-brandFilter__range span { color: #555; }
.wl-brandFilter select.input { width: 100%; padding: 8px 10px; border: 1px solid #ccc; font-size: 13px; background: #fff; }
.wl-brandFilter__submit { text-align: center; margin-top: 28px; }
.wl-brandFilter__submit .btn { width: auto; min-width: 280px; }

.wl-brand-catnav { border-bottom: 1px solid #e0e0e0; background: #fff; }
.wl-brand-catnav__list { display: flex; list-style: none; margin: 0 auto; padding: 0 14px; max-width: 1280px; overflow-x: auto; scrollbar-width: none; }
.wl-brand-catnav__list::-webkit-scrollbar { display: none; }
.wl-brand-catnav__list li a { display: block; padding: 14px 18px; font-size: 12px; font-family: var(--wl-font-en); letter-spacing: .06em; color: #999; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.wl-brand-catnav__list li a:hover { color: #333; }
.wl-brand-catnav__list li.is-active a { color: #222; border-bottom-color: #222; font-weight: 700; }
@media (min-width: 768px) {
  .wl-brand-catnav__list { padding: 0 24px; justify-content: center; }
}

/* ----- OUTLET（NEW ITEMS / RESTOCK 2カラム） ----- */
.wl-outlet__cols { display: flex; flex-direction: column; gap: 32px; }
.wl-outlet__col { flex: 1; min-width: 0; }
.wl-outlet__banner { position: relative; display: block; }
.wl-outlet__banner img { width: 100%; height: auto; display: block; }
.wl-outlet__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-align: center; }
.wl-outlet__overlay .en { font-family: var(--wl-font-en); font-size: 26px; font-weight: 700; letter-spacing: .16em; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
.wl-outlet__overlay .ja { font-size: 12px; margin-top: 4px; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
/* 横並びレイアウト（page03_top_lowheader: 〜1023=ワンカラム / 1024〜=左見出し50%＋右コンテンツ50%） */
/* 見出し画像パネル: 全幅共通で low_header06 背景（SP/タブレットは通常スクロール背景） */
.wl-outlet--side .wl-outlet__side-head {
  min-height: 200px; margin-bottom: 40px;
  display: flex; align-items: center; justify-content: center;
  background: url("../img/low_header06.jpeg") center / cover no-repeat;
}
.wl-outlet--side .wl-outlet__side-head .sec-title { text-align: center; padding-bottom: 0; }
.wl-outlet--side .wl-outlet__side-head .sec-title__en,
.wl-outlet--side .wl-outlet__side-head .sec-title__ja { color: #fff; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
@media (min-width: 768px) {
  /* NEW ITEMS / RESTOCK はそれぞれ全幅の1行（縦積み） */
  .wl-outlet--side .wl-outlet__cols { flex-direction: column; gap: 56px; }
  .wl-outlet--side .wl-outlet__side-head .sec-title { display: none; }
  /* 同ページの .wl-hero-banner--fixed と同じく背景固定（パララックス）＋同じ高さ 40vw */
  .wl-outlet--side .wl-outlet__side-head { background-attachment: fixed; height: 40vw; min-height: 0; }
}

/* カラム見出し（テキストのみ版: page03_top_lowheader の NEW ITEMS / RESTOCK） */
.wl-outlet__heading { text-align: center; padding: 8px 0; }
.wl-outlet--side .wl-outlet__col:nth-child(1) .wl-outlet__heading { padding-top: 24px; }
.wl-outlet--side .wl-outlet__col:nth-child(2) .wl-outlet__heading { padding-top: 16px; }
/* 1段目（アイコン＋OUTLET・小さめ） */
.wl-outlet__heading-label { display: flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--wl-font-en); font-size: 13px; font-weight: 400; letter-spacing: .1em; color: #222; margin-bottom: 2px; }
.wl-outlet__heading-label img { width: 33px; height: auto; }
.wl-outlet__heading .en { display: block; font-family: var(--wl-font-en); font-size: 26px; font-weight: 400; letter-spacing: .08em; color: #222; }
.wl-outlet__heading .ja { display: block; font-size: 13px; color: #888; margin-top: 4px; letter-spacing: .1em; }
.wl-outlet__swiper.swiper { position: relative; overflow: hidden; padding: 20px 14px 0; }
.wl-outlet__swiper .swiper-slide { height: auto; }
@media (min-width: 768px) {
  .wl-outlet__cols { flex-direction: row; gap: 32px; }
  /* NEW ITEMS / RESTOCK の境目を明示（中央の区切り線） */
  .wl-outlet__col + .wl-outlet__col { border-left: 1px solid #e5e5e5; padding-left: 32px; }
  .wl-outlet__swiper.swiper { padding-left: 24px; padding-right: 24px; }
  .wl-outlet__banner            { aspect-ratio: 5/2.5; overflow: hidden; }
  .wl-outlet__banner img        { height: 100%; object-fit: cover; }
}

/* ----- NEWS（新着情報・左ラベル＋リスト） ----- */
.wl-news { max-width: 1280px; margin: 24px auto; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }
.wl-news__inner { max-width: 760px; margin: 0 auto; padding: 32px 14px; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; justify-content: center; }
.wl-news__head { flex: 0 0 auto; text-align: left; }
.wl-news__head .en { display: block; font-family: var(--wl-font-en); font-size: 22px; font-weight: 700; letter-spacing: .16em; }
.wl-news__head .ja { display: block; font-size: 11px; color: #888; margin-top: 4px; }
/* VIEW MORE: PC=見出し下の空きスペース / SP=右上の空き（どちらも縦を伸ばさない） */
.wl-news__inner { position: relative; }
.wl-news__more { display: inline-block; margin-top: 14px; font-family: var(--wl-font-en); font-size: 12px; letter-spacing: .1em; color: #333; text-decoration: underline; text-underline-offset: 6px; }
.wl-news__more:hover { color: var(--woollen-primary); }
@media (min-width: 768px) {
  .wl-news__more { margin-top: 34px; }
}
@media (max-width: 767px) {
  .wl-news__more { position: absolute; top: 32px; right: 14px; margin-top: 0; }
}
.wl-news__list { flex: 1; list-style: none; margin: 0; padding: 0; }
.wl-news__list li a { display: flex; flex-direction: column; gap: 2px; padding: 16px 0; align-items: baseline; color: #333; font-size: 13px; }
.wl-news__list li { border-bottom: 1px solid var(--woollen-line); }
.wl-news__date { flex: 0 0 auto; width: 9em; color: #888; font-family: var(--wl-font-en); letter-spacing: .04em; font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
.wl-news__list li a:hover .wl-news__title { color: var(--woollen-primary); }
@media (min-width: 768px) {
  .wl-news__inner { padding: 8px 24px; flex-direction: row; gap: 60px; }
  .wl-news__list li a { flex-direction: row; gap: 0; }
  .wl-news__head .en { font-size: 28px; }
  .wl-news__head .ja { margin-top: 2px; }
}
@media (min-width: 1024px) {
  .wl-news__head .en { font-size: 32px; }
}

/* ----- BROWSING HISTORY（閲覧履歴・スワイパー） ----- */
.wl-browsing { max-width: 1280px; margin-left: auto; margin-right: auto; }

/* padding だと次スライドの端が余白部分に見えるため margin で外側余白に */
.wl-history__swiper.swiper { position: relative; margin: 0 14px; padding: 0; }
.wl-history__swiper .swiper-slide { height: auto; }
.wl-history__item { display: block; position: relative; overflow: hidden; }
.wl-history__item img { width: 100%; height: auto; display: block; }
/* 閲覧履歴はホバーアニメーションなし（hover画像は非表示） */
.wl-history__item .wl-na__hoverimg { display: none; }
@media (min-width: 768px) {
  .wl-history__swiper.swiper { margin: 0 40px; padding: 0; }
}

/* ===== プリフッター（全ページ共通） ===== */
/* OUTLET SALE バナー */
/* プリフッター全体を非表示（メルマガはフッター内 Newsletter 列へ、OUTLET訴求もフッターOUTLET列へ集約済み） */
.wl-prefooter { display: none; }
.wl-prefooter__sale { display: block; max-width: 900px; margin: 24px auto 48px; padding: 0 24px; }
.wl-prefooter__sale img { width: 100%; height: auto; display: block; margin-bottom: 16px; }
/* メールマガジン（ダークブロック＋中央タイトル＋入力風フィールド） */
/* フッター内ダークパネル列（OUTLET ＋ Newsletter を縦並び格納） */
.wl-footer__col--panels { display: flex; flex-direction: column; gap: 16px; order: -1; /* SP: 縦積みの最上部に表示（OUTLETが先頭） */ }
.wl-footer__panel { background: #333; padding: 28px 28px 32px; text-align: center; border-radius: 5px; }
.wl-footer__panel .wl-footer__heading { color: #fff; }
/* SP(縦積み)では横幅いっぱい。PC(横並び)では通常順・上詰め */
@media (min-width: 768px) { .wl-footer__col--panels { order: 0; align-self: flex-start; } }
.wl-footer__mailmag { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 20px; background: #fff; border-radius: 8px; font-size: 13px; color: #333; }
.wl-footer__mailmag:hover { background: #eee; color: #000; }
.wl-footer__mailmagIcon { color: #777; font-size: 33px; }
.wl-footer__mailmagIcon--img { width: 33px; height: auto; display: block; }

.wl-mailmag { background: #333; max-width: 1280px; margin: 24px auto 80px; padding: 44px 24px; text-align: center; }
.wl-mailmag__ttl { color: #fff; font-weight: 700; font-size: 26px; letter-spacing: .12em; margin: 0 0 20px; }
.wl-mailmag__field { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; max-width: 300px; margin: 0 auto; padding: 14px 18px; background: #fff; color: #333; font-size: 13px; border-radius: 8px; }
.wl-mailmag__field:hover { color: #000; }
.wl-mailmag__icon { color: #777; }

.ec-mypageRole { max-width: 1130px; padding-top: 32px; }
/* マイページナビ active 色をWoollenアクセントに（EC-CUBEは #DE5D50） */
.ec-navlistRole .active a { color: var(--woollen-primary); }
.ec-navlistRole .ec-navlistRole__item.active { border-bottom: 2px solid var(--woollen-primary); }
/* PC: 項目が8個に増え箱型タブでは窮屈なため、枠線を外して下線式タブバー化（SPは2列グリッドのまま） */
@media (min-width: 768px) {
  .ec-navlistRole .ec-navlistRole__navlist { border-width: 0 0 1px; border-color: #ddd; justify-content: center; }
  .ec-navlistRole .ec-navlistRole__item { width: auto; border-width: 0; font-weight: 500; font-size: 13px; letter-spacing: .04em; }
  .ec-navlistRole .ec-navlistRole__item a { padding: 12px 18px; color: #555; }
  .ec-navlistRole .ec-navlistRole__item:hover { background: transparent; }
  .ec-navlistRole .ec-navlistRole__item:hover a { color: #222; }
  /* アクティブ: 赤下線をバーの線に重ねる */
  .ec-navlistRole .ec-navlistRole__item.active { border-bottom: 2px solid var(--woollen-primary); margin-bottom: -1px; }
  .ec-navlistRole .active a { font-weight: 700; }
}
/* ようこそメッセージ（案A: 左寄せ1行型・下罫線。SPは幅に応じて2行に折り返し） */
.ec-welcomeMessage { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; text-align: left; margin: 0 0 20px; padding-bottom: 12px; border-bottom: 1px solid var(--woollen-line); }
.ec-welcomeMessage p:first-child { font-weight: 700; font-size: 16px; }
.ec-welcomeMessage p + p { color: var(--woollen-sub); font-size: 13px; margin-top: 0; }
/* 会員サマリー（保有ポイント / 会員ランク） */
.wl-mypageSummary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 24px; padding: 14px; background: #f8f8f8; border: 1px solid #e5e5e5; }
.wl-mypageSummary__label { color: var(--woollen-sub); font-size: 11px; }
.wl-mypageSummary__value { font-size: 18px; font-weight: 700; margin-top: 4px; }
.wl-mypageSummary__value--rank { font-size: 14px; }
.wl-mypageSummary__value small { font-size: 11px; font-weight: 400; }
/* マイページ内セクション見出し */
.wl-mypageBlock { margin: 0 0 24px; }
.wl-mypageBlock__head { font-size: 14px; font-weight: 700; padding: 0 0 8px; margin: 0 0 12px; border-bottom: 1px solid #ddd; }
/* マイページ内ボタン群: SP=縦並び / PC=横並び中央 */
.wl-mypageActions { display: flex; flex-direction: column; gap: 10px; padding: 18px 0; }
@media (min-width: 768px) {
  .wl-mypageActions { flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .wl-mypageActions > .btn { width: auto; min-width: 220px; }
}
/* 注文カードのサムネイル画像（item01〜04.jpg を流用） */
.order-card__thumb { overflow: hidden; }
.order-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 注意・警告ボックス（退会/ポイント等） */
.wl-noticeBox { margin: 0 0 16px; padding: 14px; background: #fff3cd; border: 1px solid #ffd166; font-size: 12px; line-height: 1.8; }
.wl-noticeBox--info { background: #f5f5f5; border-color: #e5e5e5; color: #555; }
.wl-noticeBox--warn { border-color: #ffe082; color: #6b5410; }  /* テンプレ注意バナー（page51/61 メールプレビュー） */
.wl-noticeBox__title { font-weight: 700; color: var(--woollen-primary); font-size: 13px; margin-bottom: 8px; }

.wl-feature__head .en        { font-weight: 400; letter-spacing: .06em; }
.wl-hero-banner__overlay .en { font-weight: 400; letter-spacing: .08em; }
.wl-outlet__overlay .en      { font-weight: 400; letter-spacing: .06em; }
.wl-news__head .en           { font-weight: 400; letter-spacing: .06em; }
.wl-mailmag__ttl             { font-weight: 400; letter-spacing: .05em; }
.wl-footer__heading          { font-weight: 400; letter-spacing: .06em; }
.sec-title__en               { font-weight: 400; letter-spacing: .06em; }
.sec-title__ja               { letter-spacing: .1em; }
.wl-na__viewall a            { letter-spacing: .1em; }
.wl-itemcat__tab             { letter-spacing: .05em; }
.wl-brand-catnav__list li a  { letter-spacing: .04em; }

/* ====== メインビジュアル ナビ（スワイパーナビと同スタイル） ====== */
.hero-slider__nav {
  background: transparent; color: #fff; font-size: 88px; font-weight: 100;
  width: 72px; height: 96px;
  mix-blend-mode: difference; /* 背景が暗→白、明→黒 に自動切替 */
}

.hero-slider__nav .fa-solid    { font-size: 36px; }
.wl-feature__nav .fa-solid     { font-size: 16px; }
.wl-na__img-arrow .fa-solid    { font-size: 26px; }
.scroller__nav .fa-solid       { font-size: 20px; }
.wl-infobar__nav-btn .fa-solid { font-size: 15px; }

/* ====== PC: TOPページ セクション余白統一 ====== */
@media (min-width: 768px) {
  .wl-info        { margin-top: 0; }
  .wl-brandsec    { margin-top: 0; }
  .wl-hero-banner { margin: 0; }
  .wl-topbanner   { margin: 0 auto 40px; }
  .wl-news        { margin-top: 0; margin-bottom: 0; padding: 40px 0; }
}

/* ====== INFORMATION「お知らせ一覧」ボタン幅を VIEW ALL に統一（PC） ====== */
@media (min-width: 768px) {
  .wl-info .more-link { max-width: none; text-align: center; }
  .wl-info .more-link a { display: inline-block; min-width: 220px; width: auto; padding: 18px 64px; text-decoration: none; font-family: var(--wl-font-en); font-size: 12px; letter-spacing: .1em; }
}

/* ====== シンプルヘッダー（お問い合わせ等）: ロゴ＋マイページ・カートのみ ====== */
.p-simplenav .l-header__notice { display: none !important; }
.p-simplenav .l-header__memberlinks { display: none !important; }
/* PC: topicons の検索アイコン（1番目）を非表示 */
.p-simplenav .l-header__topicons a:first-child { display: none !important; }
/* SP: 検索アイコン・ハンバーガーを非表示 */
.p-simplenav .l-header__icons a[aria-label="search"],
.p-simplenav .l-header__hamb { display: none !important; }

/* ====== TOP / フル幅ページ: コンテンツ間・ボタン余白拡大（Tomorrowland Edition 参考） ====== */
/* SP */
.wl-main--full .section { padding-block: 48px; }
.wl-na__viewall         { margin-top: 48px; }
/* SP: セクション間余白を統一（section padding-block:48px に揃える） */
.wl-topbanner                { margin-block: 0; }
.wl-hero-banner              { margin-block: 0; }
.wl-main--full .wl-info      { margin-top: 0; }
.wl-main--full .wl-brandsec  { margin-top: 0; }
.wl-main--full .wl-news      { margin: 0 auto; }
/* SP のみ（max-width: 767px）: 余白統一・バナー高さ調整。PC に一切影響しない。 */
@media (max-width: 767px) {
  /* FEATURES タイトル余白を他 sec-title に揃える */
  .wl-feature__head                        { padding-top: 22px; padding-bottom: 14px; }

  /* NEW ARRIVAL ヒーローバナー — 上余白拡大・バナー→カード間を詰める */
  .wl-hero-banner                          { margin-top: 32px; }
  .wl-hero-banner img                      { height: 60vw; object-fit: cover; }
  .wl-main--full .wl-newarrival            { padding-top: 8px; }

  /* 修正1: BRAND — セクション前の余白拡大（外側 margin）。padding は section 規則の 48px のまま（= 下と同じ）。 */
  .wl-main--full .wl-brandsec              { margin-top: 40px; }

  /* 修正3+4: ITEM CATEGORY — 上余白縮小（BRAND との継ぎ目タイト）・下余白拡大 */
  .wl-main--full .wl-itemcat               { padding-top: 8px; padding-bottom: 80px; }

  /* 修正5: OUTLET カラム間（RESTOCK 上）余白拡大 */
  .wl-main--full .wl-outlet__cols          { gap: 80px; }
  .wl-main--full .wl-outlet__swiper.swiper { padding-top: 0; }

  /* OUTLET バナー（NEW ITEMS / RESTOCK）: SP の縦高を拡大 */
  .wl-outlet__banner                       { aspect-ratio: 4 / 3; overflow: hidden; }
  .wl-outlet__banner img                   { height: 100%; object-fit: cover; }

  /* 修正3: OUTLET — 上余白を少し詰める */
  .wl-main--full .wl-outlet                { padding-top: 32px; }

  /* 修正6: NEWS — 上余白拡大 */
  .wl-main--full .wl-news                  { margin-top: 40px; }

  /* 商品グリッド: タブ直下でくっつく問題（l-listing が display:contents のため） */
  .p-grid                                  { padding-top: 36px; }
}

/* PC */
@media (min-width: 768px) {
  .wl-main--full .section       { padding-block: 96px; }
  /* NEW ARRIVAL: ヒーローバナー直下のため上下余白を縮小 */
  .wl-main--full .wl-newarrival { padding-top: 56px; padding-bottom: 96px; }
  /* BRAND→ITEMCAT は同一グレー背景でつながるため ITEMCAT 上余白を縮小 */
  .wl-main--full .wl-itemcat    { padding-top: 24px; }
  /* INFORMATION: OUTLETバナー直下のため上余白調整 */
  .wl-main--full .wl-info       { padding-top: 64px; }
  /* OUTLET: ヒーローバナー直下のため上余白を縮小 */
  .wl-main--full .wl-outlet     { padding-top: 48px; }
  /* SP側の extra margin をPCで解除（section padding が役割を担う） */
  .wl-info                      { margin-top: 0; }
  /* VIEW ALL: コンテンツ→ボタン間（統一値） */
  .wl-na__viewall               { margin-top: 64px; }
  .wl-info .wl-na__viewall      { margin-top: 40px; }
  .wl-na__viewall a             { padding: 18px 64px; font-size: 12px; }
  /* セクション下余白の正規化 */
  .wl-brandsec                  { margin-top: 0; padding-block: 48px; }
  .wl-itemcat                   { padding-bottom: 96px; }
  /* 連結要素（バナー）はマイナスマージンでFEATURESに寄せる */
  .wl-topbanner                 { margin-block: 0; margin-top: -40px; margin-bottom: 24px; }
  .wl-hero-banner               { margin-block: 0; }
  /* NEW ARRIVAL バナー: INFORMATIONバー化でOUTLETバナー直下に来るため上余白を確保（page03） */
  .wl-topbanner + .wl-hero-banner { margin-top: 64px; }
  /* 注目のキーワード直下の背景固定バナー（page03_top_lowheader）: 上余白を大きく */
  .wl-keywords + .wl-hero-banner,
  .wl-infobar--news + .wl-hero-banner,
  .wl-newsbar + .wl-hero-banner { margin-top: 80px; }
  .wl-hero-banner img           { height: 32vw; object-fit: cover; } /* NEW ARRIVAL(page03): 旧40vwの8割 */
  /* NEWS はコンパクト（商品主体セクションより余白小） */
  .wl-news                      { padding: 64px 0; }
  /* sec-title の下余白拡大（タイトル→コンテンツ間のリズム） */
  .sec-title                    { padding-bottom: 24px; }
  .wl-main--full .sec-title__en { font-size: 30px; }
  /* メールマガジン 上余白・下余白 */
  .wl-mailmag                   { margin-top: 0; }
  /* フッター ブランドエリア 上余白拡大 */
  .wl-footer__top               { padding-top: 80px; }
  /* ヘッダー（全ページ共通）: 常に高透明度の白 */
  .l-header, .l-header__bar     { background: rgba(255,255,255,.15) !important; backdrop-filter: blur(6px); }
}
@media (min-width: 1024px) {
  .wl-main--full .sec-title__en { font-size: 36px; }
}


main:not(.wl-main--full) .section       { margin-top: 32px; padding-block: 0; }   /* SP 背景なし */
main:not(.wl-main--full) .section--gray { margin-block: 0; padding-block: 32px; }  /* SP 背景あり */
body:not(.p-top) .wl-main--full .section:not(.section--gray) { margin-top: 48px; padding-block: 0; }  /* SP 背景なし */

.mt-6  { margin-top: 3.5rem !important; }   /* 56px  */
.mt-7  { margin-top: 4rem   !important; }   /* 64px  */
.mt-8  { margin-top: 4.5rem !important; }   /* 72px  */
.mt-9  { margin-top: 5rem   !important; }   /* 80px  */
.mt-10 { margin-top: 5.5rem !important; }   /* 88px  */
.mt-11 { margin-top: 6rem   !important; }   /* 96px  */
.mt-12 { margin-top: 6.5rem !important; }   /* 104px */
.mt-13 { margin-top: 7rem   !important; }   /* 112px */
.mt-14 { margin-top: 7.5rem !important; }   /* 120px */
.mt-15 { margin-top: 8rem   !important; }   /* 128px */
.mb-6  { margin-bottom: 3.5rem !important; } /* 56px  */
.mb-7  { margin-bottom: 4rem   !important; } /* 64px  */
.mb-8  { margin-bottom: 4.5rem !important; } /* 72px  */
.mb-9  { margin-bottom: 5rem   !important; } /* 80px  */
.mb-10 { margin-bottom: 5.5rem !important; } /* 88px  */
.mb-11 { margin-bottom: 6rem   !important; } /* 96px  */
.mb-12 { margin-bottom: 6.5rem !important; } /* 104px */
.mb-13 { margin-bottom: 7rem   !important; } /* 112px */
.mb-14 { margin-bottom: 7.5rem !important; } /* 120px */
.mb-15 { margin-bottom: 8rem   !important; } /* 128px */

@media (min-width: 768px) and (max-width: 1023.98px) {
  .p-grid { grid-template-columns: repeat(3, 1fr); }
}

.p-grid.p-grid--full { max-width: none; }
@media (min-width: 768px) {
  .p-grid.p-grid--full {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 36px 24px;
    padding-left: 40px; padding-right: 40px;
  }
}

.ec-pageHeader h1, .ec-pageHeader .h1 {
  font-family: var(--wl-font-base);
  font-weight: 500; font-size: 18px; letter-spacing: 0;
  text-align: center; color: var(--woollen-text);
  border-top: none; border-bottom: 1px solid var(--woollen-line);
  padding: 18px 0 16px; margin: 0 0 24px;
}

.ec-blockBtn--cancel { background: #fff; color: var(--woollen-text); border: 1px solid var(--woollen-text); font-weight: 500; letter-spacing: .04em; }
.ec-blockBtn--cancel:hover { background: #f7f7f7; color: var(--woollen-text); border-color: var(--woollen-text); } /* 黒反転はやめ、白地のまま軽く濃度変化 */
.ec-totalBox .ec-totalBox__btn a.ec-blockBtn--cancel { color: var(--woollen-text); }
.ec-totalBox .ec-totalBox__btn a.ec-blockBtn--cancel:hover { color: var(--woollen-text); }
.btn--cart { letter-spacing: .08em; }

.tabs-gender { background: transparent; border-bottom: 1px solid var(--woollen-line); }
.tabs-gender__item { font-family: var(--wl-font-en); color: var(--woollen-sub); letter-spacing: .05em; }
.tabs-gender__item.is-active { background: transparent; color: var(--woollen-text); box-shadow: inset 0 -2px 0 var(--woollen-text); }

.section--gray { background: #f5f5f5; }

@media (min-width: 768px) {
  main:not(.wl-main--full) .section       { margin-top: 72px; padding-block: 0; }   /* 1A PC 背景なし */
  main:not(.wl-main--full) .section--gray { margin-block: 0; padding-block: 72px; }  /* 1A PC 背景あり */
  body:not(.p-top) .wl-main--full .section:not(.section--gray) { margin-top: 96px; padding-block: 0; }  /* PC フル幅・背景なし */
  /* 1B PC: 見出し拡大＋一覧見出しも同族トーンに */
  .ec-pageHeader h1, .ec-pageHeader .h1 { font-size: 26px; margin: 8px 0 40px; padding-bottom: 18px; }
  .l-listing__title { font-weight: 500; letter-spacing: .08em; font-size: 18px; border-bottom: 1px solid var(--woollen-line); }
}


/* ===== Newsletter Popup: 画面内に収める（PC） ===== */
#popup-newsletter {
  align-items: center;   /* 上揃え→縦中央 */
  padding: 24px 16px;
}
#popup-newsletter .modal__panel {
  max-height: calc(100vh - 48px);
  overflow-y: auto;
}
#popup-newsletter .modal__panel img {
  max-height: 45vh;
  object-fit: cover;
  width: 100%;
}

/* ===== 丸型クローズボタン（お気に入り一覧などの削除ボタン）: 背景をライトグレーに ===== */
.ec-closeBtn--circle { background: #efefef; }

@media (max-width: 767px) {
  .l-header__notice { display: none; }
  .l-header__bar { padding: 10px 14px; }              /* 上下を均等に */
  .l-header__icons { gap: 18px; align-items: center; } /* 均等・程よい間隔 */
  .l-header__icons > * { flex: 0 0 auto; }
  .l-header__hamb { margin-left: 2px; }                /* メニューだけ少し離してグルーピング */
}
