/* ヘッダーナビゲーションメニュー_202602 */
 
 .fs-p-headerNavBar {
        height: 5em;
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
        align-items: center;
        /* 必要に応じてスタイルを追加 */
    }

    .keywordSearch {
        padding-right: 3%;
        width: 415px;
    }


    .fs-p-headerNavigation__list {
        list-style: none;
        /* デフォルトのリストスタイルを削除 */
        text-align: center;
        /* <ul>の内容を右揃え */
        margin: 0 0 0 -30%;
        /* 必要に応じて余白を調整 */
        padding: 0;
        /* 必要に応じて内側の余白を調整 */
    }

    .fs-p-headerNavigation__listItem {
        display: inline-block;
        /* リスト項目を横に並べる */
        margin: 0 10px;
        /* 必要に応じて間隔を調整 */
    }

    .fs-p-headerNavigation__link {
        text-decoration: none;
        /* 必要に応じて装飾を調整 */
    }

    @media (max-width: 1300px) {

        /* 画面幅が1300px以下の場合のスタイル */
        .fs-p-headerNavigation__list {
            margin: 0;
            /* 必要に応じて余白を調整 */
        }
    }

    @media (max-width: 991px) {

        /* 画面幅が1300px以下の場合のスタイル */
        .keywordSearch {
            width: 300px;
        }
    }

    @media (max-width: 859px) {

        /* 画面幅が859px以下の場合のスタイル */
        .keywordSearch {
            display: none;
        }
    }


    /* 7/25追加 */
    .fs-p-headerNavigation__list {
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding-left: 24px;
        /* ←ロゴと揃える */
        margin: 0;
    }

    @media (max-width: 768px) {
        .fs-p-headerNavigation {
            overflow-x: auto;
            white-space: nowrap;
        }

        .fs-p-headerNavigation__list {
            flex-wrap: nowrap;
        }
    }

    /* オリジナルTシャツを増やしたことでサーチバーをもっと早めに消す必要がある↓ */


    @media (max-width: 1173px) and (min-width: 859px) {
        .keywordSearch {
            width: 220px;
        }
    }

    @media (max-width: 979px) {
        .keywordSearch {
            display: none;
        }
    }

    /* ヘッダーナビゲーションアイコン */
    /* デフォルトはPC向け（18×14px） */
    .h-icon {
        width: 18px;
        height: auto;
        vertical-align: middle;
    }

    /* スマホ・タブレット（〜768px）は大きめに */
    @media screen and (max-width: 768px) {
        .tshirt-icon {
            width: 26px;
            height: 26px;
        }
    }

    @media screen and (min-width: 768px) {
    .fs-p-headerNavigation__link, .fs-p-headerNavigation__viewCartButton, .fs-p-headerNavigation__viewSubscriptionCartButton {
        flex-direction: row;
        font-size: 1.8rem;
    }
}


 /* ヘッダーユーティリティ_202602 */
 /* ヘッダーナビゲーションメニュー_202602 */
 
 .fs-p-headerNavBar {
        height: 5em;
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
        align-items: center;
        /* 必要に応じてスタイルを追加 */
    }

    .keywordSearch {
        padding-right: 3%;
        width: 415px;
    }


    .fs-p-headerNavigation__list {
        list-style: none;
        /* デフォルトのリストスタイルを削除 */
        text-align: center;
        /* <ul>の内容を右揃え */
        margin: 0 0 0 -30%;
        /* 必要に応じて余白を調整 */
        padding: 0;
        /* 必要に応じて内側の余白を調整 */
    }

    .fs-p-headerNavigation__listItem {
        display: inline-block;
        /* リスト項目を横に並べる */
        margin: 0 10px;
        /* 必要に応じて間隔を調整 */
    }

    .fs-p-headerNavigation__link {
        text-decoration: none;
        /* 必要に応じて装飾を調整 */
    }

    @media (max-width: 1300px) {

        /* 画面幅が1300px以下の場合のスタイル */
        .fs-p-headerNavigation__list {
            margin: 0;
            /* 必要に応じて余白を調整 */
        }
    }

    @media (max-width: 991px) {

        /* 画面幅が1300px以下の場合のスタイル */
        .keywordSearch {
            width: 300px;
        }
    }

    @media (max-width: 859px) {

        /* 画面幅が859px以下の場合のスタイル */
        .keywordSearch {
            display: none;
        }
    }


    /* 7/25追加 */
    .fs-p-headerNavigation__list {
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding-left: 24px;
        /* ←ロゴと揃える */
        margin: 0;
    }

    @media (max-width: 768px) {
        .fs-p-headerNavigation {
            overflow-x: auto;
            white-space: nowrap;
        }

        .fs-p-headerNavigation__list {
            flex-wrap: nowrap;
        }
    }

    /* オリジナルTシャツを増やしたことでサーチバーをもっと早めに消す必要がある↓ */


    @media (max-width: 1173px) and (min-width: 859px) {
        .keywordSearch {
            width: 220px;
        }
    }

    @media (max-width: 979px) {
        .keywordSearch {
            display: none;
        }
    }

    /* ヘッダーナビゲーションアイコン */
    /* デフォルトはPC向け（18×14px） */
    .h-icon {
        width: 18px;
        height: auto;
        vertical-align: middle;
    }

    /* スマホ・タブレット（〜768px）は大きめに */
    @media screen and (max-width: 768px) {
        .tshirt-icon {
            width: 26px;
            height: 26px;
        }
    }

    @media screen and (min-width: 768px) {
    .fs-p-headerNavigation__link, .fs-p-headerNavigation__viewCartButton, .fs-p-headerNavigation__viewSubscriptionCartButton {
        flex-direction: row;
        font-size: 1.8rem;
    }
}


 /* ヘッダーユーティリティ_202602 */
 /* ===== hNav 共通 ===== */
.hNav{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:14px;
}
.hNav > li{ margin:0; padding:0; }

.hNav a{
  display:flex;
  align-items:center;
  text-decoration:none;
}

/* ロゴ（共通） */
.hNav__logoImg{
  height:40px;
  width:auto;
  display:block;
}
.hNav__logoText{
  display:none; /* とりあえず非表示 */
}

/* ===== PC（768px〜）：右アイコンのみ、ロゴは隠す ===== */
@media (min-width: 768px){
  .hNav{ gap:22px; }

  /* PCはロゴを出さない（ロゴは別の場所に出すならそっちで） */
  .hNav__logo{ display:none; }

  /* PCはアイコン＋文字を横並びに（文字要らなければ span を display:none に） */
  .hNav a{ gap:8px; }
  .hNav span{ font-size:14px; line-height:1; }
}

/* ===== SP（〜767px）：ロゴを中央に、アイコンは縦積み表示 ===== */
@media (max-width: 767px){
  .hNav{
    justify-content:space-between;
    gap:0;
    width:100%;
  }

  /* 並び：ログイン・ロゴ・検索・カート */
  .hNav__login{ order:1; }
  .hNav__logo { order:2; display:block; }
  .hNav__search{order:3; }
  .hNav__cart{  order:4; }

  /* SPはアイコン＋ラベルを縦 */
  .hNav a{
    flex-direction:column;
    gap:6px;
    min-width:56px; /* タップしやすく */
  }
  .hNav span{
    display:inline;
    font-size:12px;
    line-height:1;
  }

  /* ロゴだけは縦にしない＆幅を確保 */
  .hNav__logo a{
    flex-direction:column;
    min-width:auto;
  }
}

/* ===== 上段ヘッダーの骨格（白背景エリア） ===== */
.fs-l-header__contents{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 16px;
  gap:12px;
}

.fs-l-header__leftContainer{ flex:0 0 auto; }
.fs-l-header__logo{ flex:1 1 auto; display:flex; justify-content:flex-start; }
.fs-l-header__utility{ flex:0 0 auto; display:flex; align-items:center; }

/* ===== hNav：黒い「・」消す＋横並び固定 ===== */
.hNav{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center;
  gap:22px;
}
.hNav > li{ list-style:none !important; margin:0; padding:0; }

.hNav a{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
}

.hNav span{
  display:inline;        /* PCはテキスト出す */
  font-size:14px;
  line-height:1;
}

/* PCはドロワーボタン非表示にしたいなら */
@media (min-width: 768px){
  .fs-l-header__drawerOpener{ display:none; }
}

/* SPではECロゴパーツを非表示（ロゴはhNav内に出す想定） */
@media (max-width: 767px){
  .fs-l-header__logo{ display:none; }

  .hNav{
    justify-content:space-between;
    gap:0;
    width:100%;
  }
  .hNav a{
    flex-direction:column;
    gap:6px;
  }
  .hNav span{
    font-size:12px;
  }
}

/* ===== 上段ヘッダーの骨格（白背景エリア） ===== */
.fs-l-header__contents{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 16px;
  gap:12px;
}

.fs-l-header__leftContainer{ flex:0 0 auto; }
.fs-l-header__logo{ flex:1 1 auto; display:flex; justify-content:flex-start; }
.fs-l-header__utility{ flex:0 0 auto; display:flex; align-items:center; }

/* ===== hNav：黒い「・」消す＋横並び固定 ===== */
.hNav{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center;
  gap:22px;
}
.hNav > li{ list-style:none !important; margin:0; padding:0; }

.hNav a{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
}

.hNav span{
  display:inline;        /* PCはテキスト出す */
  font-size:14px;
  line-height:1;
}

/* PCはドロワーボタン非表示にしたいなら */
@media (min-width: 768px){
  .fs-l-header__drawerOpener{ display:none; }
}

/* SPではECロゴパーツを非表示（ロゴはhNav内に出す想定） */
@media (max-width: 767px){
  .fs-l-header__logo{ display:none; }

  .hNav{
    justify-content:space-between;
    gap:0;
    width:100%;
  }
  .hNav a{
    flex-direction:column;
    gap:6px;
  }
  .hNav span{
    font-size:12px;
  }
}

/* ===== 白箱の中で：左はドロワー（既存パーツ）、中央はロゴ、右はアイコン ===== */
.hHeader_202602{
  width:100%;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;
}

/* ロゴ */
.hLogoLink{ display:flex; flex-direction:column; text-decoration:none; }
.hLogoImg{ height:44px; width:auto; display:block; }
.hLogoText{ margin-top:6px; font-size:12px; line-height:1; }

/* アイコン */
.hNav{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:18px;
}
.hNav > li{ margin:0; padding:0; }
.hNav a{ display:flex; align-items:center; gap:8px; text-decoration:none; }
.hNav span{ line-height:1; }

/* ===== PC：ロゴ左／右にログイン・カート（検索は消すなら） ===== */
@media (min-width:768px){
  .hLogoLink{ align-items:flex-start; }
  .hNav__search{ display:none; } /* PCで検索不要なら */
  .hNav span{ font-size:14px; display:inline; }
}

/* ===== SP：ロゴ中央／右アイコン縦（ドロワーは別パーツで左） ===== */
@media (max-width:767px){
  .hHeader_202602{
    display:grid;
    grid-template-columns: 1fr; /* 自前領域はロゴ＋アイコンだけなので1列でOK */
    row-gap:8px;
    padding:10px 12px;
  }

  .hHeader_202602__logo{ justify-self:center; }
  .hLogoLink{ align-items:center; }

  /* SPはアイコンを横に3つ並べたいなら */
  .hNav{ justify-content:space-between; gap:0; width:100%; }
  .hNav a{ flex-direction:column; gap:6px; min-width:56px; justify-content:center; }
  .hNav span{ font-size:12px; display:inline; }
}

/* 共通 */
.hNav{list-style:none!important;margin:0!important;padding:0!important;display:flex!important;align-items:center!important;gap:18px;}
.hNav>li{margin:0;padding:0;list-style:none!important;}
.hNav a{display:flex;align-items:center;gap:8px;text-decoration:none;}
.hNav span{line-height:1;}
.hLogoLink{display:flex;flex-direction:column;text-decoration:none;align-items:flex-start;}
.hLogoImg{height:44px;width:auto;display:block;}
.hLogoText{margin-top:6px;font-size:12px;line-height:1;}



/* PC：ロゴ左、右にログイン＆カート（検索は不要なら消す） */
@media (min-width:768px){
  .hNav__search{display:none!important;}
  .fs-l-header__logo{margin-right:auto!important;} /* 左寄せキープ */
}

/* SP：5列グリッドで「ドロワー / ログイン / ロゴ / 検索 / カート」 */
@media (max-width:767px){
  .fs-l-header__contents{
    display:grid!important;
    grid-template-columns:auto auto 1fr auto auto!important;
    align-items:center!important;
    column-gap:10px!important;
  }
  .fs-l-header__leftContainer{grid-column:1!important;}
  .fs-l-header__logo{grid-column:3!important;justify-self:center!important;}
  .hLogoLink{align-items:center;}

  .fs-l-header__utility{display:contents!important;}
  .fs-l-header__utility .hNav{display:contents!important;}
  .hNav__login{grid-column:2!important;}
  .hNav__search{grid-column:4!important;}
  .hNav__cart{grid-column:5!important;}

  .hNav a{flex-direction:column!important;gap:6px!important;min-width:56px!important;justify-content:center!important;}
  .hNav span{font-size:12px!important;display:inline!important;}
}

/* 202602テーマにだけ効かせる */
.is-theme-202602 .fs-p-logo--202602{
  display:flex;
}

.is-theme-202602 .fs-p-logo--202602 .fs-p-logo__link{
  display:flex;
  flex-direction:column;
  text-decoration:none;
}

.is-theme-202602 .fs-p-logo--202602 .fs-p-logo__image{
  height:44px;
  width:auto;
  display:block;
}

.is-theme-202602 .fs-p-logo--202602 .fs-p-logo__lead{
  margin:6px 0 0;
  font-size:12px;
  line-height:1;
}

/* PC：左寄せ */
@media (min-width:768px){
  .is-theme-202602 .fs-l-header__logo{
    justify-content:flex-start;
    margin-right:auto;
  }
  .is-theme-202602 .fs-p-logo--202602 .fs-p-logo__link{
    align-items:flex-start;
  }
}

/* SP：中央 */
@media (max-width:767px){
  .is-theme-202602 .fs-l-header__logo{
    justify-self:center;
  }
  .is-theme-202602 .fs-p-logo--202602 .fs-p-logo__link{
    align-items:center;
  }
}

/* =========================
  ヘッダー/青帯 共通の基準
========================= */
:root{
  --wrap-max: 1200px;                 /* サイトの基準幅（お好みで） */
  --gutter: clamp(16px, 2vw, 24px);   /* 左右余白（PC幅変化でも自然に） */
}

/* 上段白ヘッダー：中央固定 */
.fs-l-header__contents{
  width: 100%;
  max-width: var(--wrap-max);
  margin: 0 auto;
  padding: 12px var(--gutter);
}

/* 青帯（商品一覧の開始位置）も同じ基準に揃える */
.fs-p-headerNavigation__list{
  max-width: var(--wrap-max);
  margin: 0 auto;
  padding-left: var(--gutter) !important;
  padding-right: var(--gutter) !important;
}

/* =========================
  PC：ロゴは左、右にログイン/カート等
========================= */
@media (min-width:768px){
  .fs-l-header__contents{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:16px !important;
  }

  /* PCはドロワーを出さないなら（出すなら消してOK） */
  .fs-l-header__drawerOpener{ display:none !important; }

  .fs-l-header__leftContainer{ flex:0 0 auto !important; }
  .fs-p-logo--202602{ flex:0 0 auto !important; margin-right:auto !important; } /* ロゴを左へ */
  .fs-l-header__utility{ flex:0 0 auto !important; }

  /* PCユーティリティ：横並び（アイコン＋文字） */
  .hNav{ list-style:none!important; margin:0!important; padding:0!important; display:flex!important; gap:18px; align-items:center; }
  .hNav a{ display:flex; align-items:center; gap:8px; text-decoration:none; }
  .hNav span{ font-size:14px; line-height:1; }
}

/* =========================
  SP：1行固定（マス目で2段にならない）
  ドロワー / ログイン / ロゴ / 検索 / カート
========================= */
@media (max-width:767px){
  .fs-l-header__contents{
    display:grid !important;
    grid-template-columns: auto auto 1fr auto auto !important;
    align-items:center !important;
    column-gap:10px !important;
  }

  /* 左：ドロワー */
  .fs-l-header__leftContainer{ grid-column:1 !important; }

  /* 中央：ロゴ */
  .fs-p-logo--202602{
    grid-column:3 !important;
    justify-self:center !important;
  }

  /* 右：utility内のliをgrid列に参加させる */
  .fs-l-header__utility{ display:contents !important; }
  .fs-l-header__utility .hNav{ display:contents !important; }

  .hNav__login{ grid-column:2 !important; }
  .hNav__search{ grid-column:4 !important; }
  .hNav__cart{   grid-column:5 !important; }

  /* SPは縦積み（アイコン＋文字） */
  .hNav a{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    text-decoration:none;
  }
  .hNav span{ font-size:12px; line-height:1; }

  /* SPで2段に見えやすいので、店名テキストは消すのが安定 */
  /* .fs-p-logo--202602 .fs-p-logo__lead{ display:none; }
  .fs-p-logo--202602 .fs-p-logo__image{ height:34px; width:auto; } */
}

/* ===== SPヘッダー：1行＆下揃えで理想形に寄せる ===== */
@media (max-width: 767px){

  /* 1行グリッド（ドロワー / ログイン / ロゴ / 検索 / カート） */
  .fs-l-header__contents{
    display: grid !important;
    grid-template-columns: auto auto 1fr auto auto !important;
    align-items: end !important;          /* ★全員を下揃え */
    column-gap: 10px !important;
  }

  /* 左：ドロワー */
  .fs-l-header__leftContainer{ grid-column: 1 !important; align-self: end !important; }

  /* 中央：ロゴ */
  .fs-p-logo--202602{
    grid-column: 3 !important;
    justify-self: center !important;
    align-self: end !important;           /* ★ロゴも下揃え */
  }
  .fs-p-logo--202602 .fs-p-logo__link{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
  }
  .fs-p-logo--202602 .fs-p-logo__image{ height: 48px !important; width: auto !important; display:block !important; }
  .fs-p-logo--202602 .fs-p-logo__lead{
    display: block !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  /* 右：utilityを“中身だけ”にして li を列に参加させる */
  .fs-l-header__utility{ display: contents !important; }
  .fs-l-header__utility .hNav{
    display: contents !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .hNav > li{ list-style:none !important; margin:0 !important; padding:0 !important; }

  /* ログイン/検索/カートの列指定＋下揃え */
  .hNav__login{  grid-column: 2 !important; align-self: end !important; }
  .hNav__search{ grid-column: 4 !important; align-self: end !important; }
  .hNav__cart{   grid-column: 5 !important; align-self: end !important; }

  /* アイコン＋ラベルは縦積み */
  .hNav a{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
  }
  .hNav span{
    display: block !important;
    font-size: 12px !important;
    line-height: 1 !important;
  }

  /* ドロワーボタンも縦積み（MENUを出したい場合） */
  .fs-p-drawerButton{
    display:flex !important;
    flex-direction: column !important;
    align-items:center !important;
    gap: 6px !important;
  }
  .fs-p-drawerButton__label{
    font-size:12px !important;
    line-height:1 !important;
    text-transform: uppercase !important; /* menu → MENU */
  }

}

@media (max-width: 767px){

  /* まず header を 1行グリッドにする */
  .fs-l-header__contents{
    display:grid !important;
    grid-template-columns: auto auto 1fr auto auto !important; /* menu / login / logo / search / cart */
    grid-auto-rows: 1fr !important;
    align-items: end !important;
    column-gap: 10px !important;
  }

  /* 左：ドロワー */
  .fs-l-header__leftContainer{
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
  }

  /* 中央：ロゴ */
  .fs-p-logo--202602{
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: end !important;
  }

  /* ★ここが肝：utilityとulを“消して”liをgrid直下にする（強セレクタ） */
  .fs-l-header__contents > .fs-l-header__utility{
    display: contents !important;
  }
  .fs-l-header__contents > .fs-l-header__utility > ul.hNav{
    display: contents !important;
  }

  /* liを必ず1行目に固定＋列指定 */
  .fs-l-header__contents > .fs-l-header__utility > ul.hNav > li{
    grid-row: 1 !important;
    align-self: end !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .fs-l-header__contents > .fs-l-header__utility > ul.hNav > li.hNav__login{  grid-column: 2 !important; }
  .fs-l-header__contents > .fs-l-header__utility > ul.hNav > li.hNav__search{ grid-column: 4 !important; }
  .fs-l-header__contents > .fs-l-header__utility > ul.hNav > li.hNav__cart{   grid-column: 5 !important; }

  /* 見た目（縦積み） */
  .hNav a{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:6px !important;
    text-decoration:none !important;
  }
  .hNav span{
    display:block !important;
    font-size:12px !important;
    line-height:1 !important;
  }

  /* ロゴ下の店名 */
  .fs-p-logo--202602 .fs-p-logo__lead{
    margin:0 !important;
    font-size:12px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
}

/* =========================
  PC側（979px〜）
========================= */
@media (min-width: 979px){
  .fs-l-header__contents{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:16px !important;
  }

  /* PCはドロワー不要なら非表示（必要なら消してOK） */
  .fs-l-header__drawerOpener{ display:none !important; }

  .fs-l-header__leftContainer{ flex:0 0 auto !important; }
  .fs-p-logo--202602{ flex:0 0 auto !important; margin-right:auto !important; }
  .fs-l-header__utility{ flex:0 0 auto !important; }

  .hNav{
    list-style:none!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    gap:18px;
    align-items:center;
  }
  .hNav a{
    display:flex;
    align-items:center;
    gap:8px;
    text-decoration:none;
  }
  .hNav span{
    font-size:14px;
    line-height:1;
  }
}
@media (max-width: 384px){

  /* ヘッダー全体の余白を詰める */
  .fs-l-header__contents{
    padding: 10px 10px !important;
    column-gap: 6px !important;
  }

  /* ロゴを少し小さく（被り防止） */
  .fs-p-logo--202602 .fs-p-logo__image{
    height: 40px !important;
  }

  /* 店名テキストは狭幅では消す（ここが一番効く） */
  .fs-p-logo--202602 .fs-p-logo__lead{
    display: none !important;
  }

  /* アイコン＋文字の文字を小さく */
  .hNav span{
    font-size: 10px !important;
  }

  /* タップ領域は確保しつつ、横幅を食いすぎない */
  .hNav a{
    min-width: 44px !important;
    gap: 4px !important;
  }

  /* MENU文字が邪魔なら消す（アイコンだけに） */
  .fs-p-drawerButton__label{
    display: none !important;
  }
}

/* ロゴ下テキストを中央揃え（PC/SP共通でOK） */
.fs-p-logo--202602 .fs-p-logo__link{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.fs-p-logo--202602 .fs-p-logo__lead{
  text-align: center;
  width: 100%;
  margin: 0;
}

@media (min-width: 768px){
  /* 念のため a をflexに固定（上書きされてるとmarginが効かない） */
  ul.hNav > li > a{
    display:flex !important;
    align-items:center !important;
    gap:8px;
  }

  /* ログイン・カートだけ文字を上げる */
  ul.hNav > li.hNav__login > a > span,
  ul.hNav > li.hNav__cart  > a > span{
    display:inline-block !important;          /* ★これ重要 */
    transform: translateY(-8px) !important;   /* ←ここを微調整 */
    line-height: 1 !important;
  }
}

/* ============================
  青帯（ヘッダーナビ）だけ調整
  ・中央配置のまま「きゅっ」を解消
  ・文字切れ防止（自動で少し縮む）
============================ */
@media (max-width: 978px) and (min-width: 531px){

  /* 青帯の外枠が max-width で小さくなってるケースが多いので解除 */
  body .fs-p-headerNavigation,
  body .fs-p-headerNavBar{
    max-width: none !important;
    width: 100% !important;
  }

  /* 青帯のul：中央のまま、広がりを持たせる */
  body .fs-p-headerNavigation__list{
    display: flex !important;
    align-items: center !important;

    /* “真ん中感”は維持しつつ、詰まらないように均等配分 */
    justify-content: space-evenly !important;

    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;

    /* 左右の余白は画面幅に合わせて自然に */
    padding-left: clamp(12px, 3vw, 28px) !important;
    padding-right: clamp(12px, 3vw, 28px) !important;

    gap: 0 !important;
    list-style: none !important;
    flex-wrap: nowrap !important;
  }

  /* li：余計なマージンを殺す + 詰まり防止 */
  body .fs-p-headerNavigation__listItem{
    margin: 0 !important;
    min-width: 0 !important;
  }

  /* リンク：押しやすさは確保しつつ横幅を食いすぎない */
  body .fs-p-headerNavigation__link{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 6px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  /* 文字切れ対策：幅が狭いほどフォントが少し縮む */
  body .fs-p-headerNavigation__link,
  body .fs-p-headerNavigation__link span{
    font-size: clamp(12px, 1.6vw, 14px) !important;
    line-height: 1.1 !important;
  }
}


/* =========================================
  PC（979px〜）：青帯ナビを“少し大きく”、gapも広げる（自動）
========================================= */
@media (min-width: 979px){

  /* テキストサイズ（徐々に大きく） */
  .fs-p-headerNavigation__link{
    font-size: clamp(1rem, 0.65vw + 0.7rem, 1.2rem) !important;
  }

  /* アイコン画像があるなら：一緒に少しだけ拡大（徐々に） */
  .fs-p-headerNavigation__link img,
  .fs-p-headerNavigation__link svg{
    width: clamp(18px, 0.6vw + 14px, 24px) !important;
    height: auto !important;
  }

  /* 項目間の余白（徐々に広げる） */
  .fs-p-headerNavigation__list{
    gap: clamp(1.1rem, 2.2vw, 2.4rem) !important;
  }

  /* 青帯の上下の“余白”も少し足して押しつぶれ感を減らす */
  .fs-p-headerNavigation{
    padding-block: clamp(0.15rem, 0.5vw, 0.55rem) !important;
  }
}

/* =========================================
  PC（979px〜）：青帯ナビの「アイコン↔文字」を広げる＋文字を少し大きく
========================================= */
@media (min-width: 768px){

  /* リンクをflex化して、アイコンと文字の間をgapで管理 */
  .fs-p-headerNavigation__link{
    display: inline-flex !important;
    align-items: center !important;

    /* アイコンと文字の間隔：詰まり解消（自動） */
    column-gap: clamp(0.55rem, 0.9vw, 0.95rem) !important;

    /* 文字サイズ：少し大きく（自動） */
    font-size: clamp(1.05rem, 0.55vw + 0.75rem, 1.6rem) !important;

    /* 行の高さで詰まり感を軽減 */
    line-height: 1.1 !important;
  }

  /* 文字だけ微調整（必要なら） */
  .fs-p-headerNavigation__link span{
    line-height: 1.1 !important;
  }

  /* アイコン画像が入ってる場合：少しだけ大きく（自動） */
  .fs-p-headerNavigation__link img,
  .fs-p-headerNavigation__link svg{
    width: clamp(18px, 0.6vw + 14px, 24px) !important;
    height: auto !important;
    flex: 0 0 auto !important;
  }
}


/* =========================================
  青帯：背景はフル幅 / 中身だけ1216px
========================================= */

/* 青帯（背景）＝フル幅のまま */
.fs-p-headerNavBar{
  width: 100%;
  /* 背景色はここ（既に指定があるならそのままでOK） */
  /* background: var(--fs-color-maincolor); */

  /* 中身寄せ用 */
  box-sizing: border-box;
}

/* 青帯の“中身”を1216pxに揃える（navと検索を横並び） */
.fs-p-headerNavBar{
  display: flex;
  align-items: center;
  justify-content: center; /* ← 中身ブロックを中央に置く */
}

/* 中身ブロック（1216px）を作る：flex items を横に並べる */
.fs-p-headerNavBar > .fs-p-headerNavigation,
.fs-p-headerNavBar > #fs_p_headerNavigation,
.fs-p-headerNavBar > .keywordSearch{
  /* いったん初期化（個別に指定する） */
}

/* “中身コンテナ”を疑似的に作る：nav側を伸ばし、検索を右に */
.fs-p-headerNavBar{
  padding: 0 16px; /* 端のガター */
}

/* nav+検索を「1216pxの中」に収めるため、疑似コンテナ化 */
.fs-p-headerNavBar{
  /* 中央に置く中身の最大幅 */
  --main-w: 1216px;
}
.fs-p-headerNavBar{
  /* 内側に1216pxのレーンを作る */
}
.fs-p-headerNavBar{
  /* 中身のレーン */
}
.fs-p-headerNavBar{
  /* ここが実質コンテナ */
}

/* ★ここが肝：子要素を“1216pxのレーン”として扱う */
.fs-p-headerNavBar{
  gap: clamp(10px, 2vw, 24px);
}
.fs-p-headerNavBar > nav.fs-p-headerNavigation,
.fs-p-headerNavBar > #fs_p_headerNavigation{
  flex: 1 1 auto;
  max-width: calc(var(--main-w) - clamp(220px, 26vw, 420px) - 24px);
  min-width: 0;
}

.keywordSearch{
  flex: 0 0 auto;
  width: clamp(220px, 26vw, 420px);
  min-width: 200px;
}

/* navのリスト：中央寄せ気味＋gap可変 */
#fs_p_headerNavigation .fs-p-headerNavigation__list{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 2.2vw, 30px);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 画面が広い時：中身を1216pxに収める（左右に余白ができるのは正常） */
@media (min-width: 1024px){
  .fs-p-headerNavBar{
    padding-left: max(16px, calc((100vw - var(--main-w)) / 2));
    padding-right: max(16px, calc((100vw - var(--main-w)) / 2));
  }
}

/* 979px未満：あなたの既存ルールに合わせてOK（必要なら検索非表示など） */
@media (max-width: 978px){
  .fs-p-headerNavBar{
    padding: 0 12px;
  }
}

@media (max-width: 768px) {
  label.fs-p-drawerButton.fs-p-drawerButton--open {
    position: relative;
    top: 6px;
    /* または transform: translateY(6px); */
  }
}

@media (max-width: 385px) {
  label.fs-p-drawerButton.fs-p-drawerButton--open {
    top: 2px !important;
    /* または transform: translateY(2px) !important; */
  }
}



/* =========================================================
   FSテーマ オリジナルCSS（重複整理版）
   - 共通部分：PC/タブレットテーマ と レスポンシブ/スマートフォンテーマで重複していたCSS
   - PC/タブレットテーマのみ：ランキング装飾CSS（PC側にのみ存在）
   ※ 既存の挙動を変えないよう、内容は基本そのまま・重複のみ削除
   ※ CSS内のHTMLコメント（<!-- -->）は無効なため、通常のCSSコメントに修正
========================================================= */

/* ⇓ 共通CSS（両テーマに共通）⇓ */
.company{
    width: 100%;
}

table{
    width: 90%;
}

@media screen and (max-width: 768px) {
    ul.fs-pt-list.fs-pt-list--noMarker {
      display: flex !important;
      flex-direction: column !important;
    }
  
    ul.fs-pt-list.fs-pt-list--noMarker > li.fs-pt-list__item {
      width: 100% !important;
      box-sizing: border-box !important;
    }
  
    ul.fs-pt-list.fs-pt-list--noMarker a.fs-pt-list__link {
      display: flex !important;              /* 横並び */
      align-items: flex-start !important;    /* 上揃え */
      gap: 0.75em !important;                /* 日付と本文の間隔 */
      padding: 1px !important;
      text-decoration: none !important;
      box-sizing: border-box !important;
      flex-wrap: nowrap !important;          /* 折り返し禁止で左右 */
    }
  
    ul.fs-pt-list.fs-pt-list--noMarker a.fs-pt-list__link time {
      white-space: nowrap !important;
      width: 89px !important;                 /* 日付の幅を固定 */
      flex-shrink: 0 !important;             /*  日付が縮まない */
      padding: 2px;
      text-align: center;
    }
  
    /* 予備案（未使用）：必要な場合だけ有効化
    ul.fs-pt-list.fs-pt-list--noMarker a.fs-pt-list__link {
      word-break: break-word !important;
    }
    ul.fs-pt-list.fs-pt-list--noMarker li.fs-pt-list__item::before,
    ul.fs-pt-list.fs-pt-list--noMarker a.fs-pt-list__link::before {
      content: none !important;
      display: none !important;
    }

    ul.fs-pt-list.fs-pt-list--noMarker a.fs-pt-list__link {
      padding-left: 0 !important;
      margin-left: 0 !important;
      text-indent: 0 !important;
    }

    ul.fs-pt-list.fs-pt-list--noMarker li.fs-pt-list__item {
      padding-left: 0 !important;
      margin-left: 0 !important;
    }
    */
  }

  
/* 8/25追加 */

/* ============ 1) パンくず：PCのみ Category列の直上に揃える ============ */
@media (min-width:1024px){
  :root{
    --main-w: 1216px;  /* .fs-l-main の max-width */
    --pad: 8px;        /* .fs-l-main の左右 padding */
    --side: 280px;     /* 左サイド実幅（実測で調整） */
    --gap: 24px;       /* サイドとメインの間の余白 */
    --bc-top: 24px;    /* 上の余白 */
    --bc-bottom: 8px;  /* 下の余白 */
    --cat-pad: 1.6em;  /* 1〜2文字分だけ右に寄せる */
  }

  body.fs-body-category nav.fs-c-breadcrumb{
    max-width: var(--main-w);
    margin: var(--bc-top) auto var(--bc-bottom) !important;
    padding-inline: var(--pad);
    box-sizing: border-box;

    /* [カテゴリ][間][メイン] の3列を“器”側で作る */
    display: grid;
    grid-template-columns: var(--side) var(--gap) 1fr;
    align-items: start;
  }
  body.fs-body-category nav.fs-c-breadcrumb > .fs-c-breadcrumb__list{
    grid-column: 1;                 /* ← カテゴリ列の上 */
    justify-self: start;
    list-style: none;
    margin: 0;
    padding-left: var(--cat-pad);   /* 1～2文字分右へ */
    transform: none !important;     /* 以前の調整を無効化 */
  }
}

/* ============ 2) 商品グループ：共通初期化（崩れ防止） ============ */
.fs-c-subgroup .fs-c-subgroupList{
  list-style: none;
  margin: 0;
  padding: 0;
}
.fs-c-subgroup .fs-c-subgroupList > li{
  width: auto !important;    /* 既定の幅/floatを無効化 */
  margin: 0 !important;
  float: none !important;
  clear: none !important;
}

/* ラベルと矢印を常に1行で横並び */
.fs-c-subgroup .fs-c-subgroupList__link{
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  min-height: 44px;
  width: 100%;
  box-sizing: border-box;
}
.fs-c-subgroup .fs-c-subgroupList__label{
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 疑似要素の矢印をflex前提に修正（grid指定を打ち消す） */
.fs-c-subgroup .fs-c-subgroupList__link::after{
  content: "\e90c";
  font-family: "fs-icon" !important;
  font-size: 1.8rem;
  line-height: 1;
  color: #6492a8;
  margin-left: 12px;
  flex: 0 0 auto;
  align-self: center;
  grid-column: auto !important;
  grid-row: auto !important;
}

/* ============ 3) レスポンシブ列数 ============ */
/* SP（～767px）：最大2列＋余白 */
@media (max-width: 767px){
  .fs-c-subgroup .fs-c-subgroupList{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 12px;
    row-gap: 10px;
  }

}

/* PC（1024px～）：最大4列＋余白 */
@media (min-width:1024px){
  .fs-c-subgroup .fs-c-subgroupList{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    column-gap: 16px;
    row-gap: 12px;
  }
}


/* ===== タブレット帯 768–1023px の調整 ===== */

/* パンくず：中央の器に合わせて余白だけ整える */
@media (min-width:768px) and (max-width:1023px){
  nav.fs-c-breadcrumb{
    max-width: var(--main-w);
    margin: 16px auto 8px;  /* 上下余白 */
    padding-inline: var(--pad);
    box-sizing: border-box;
  }
  nav.fs-c-breadcrumb .fs-c-breadcrumb__list{
    margin: 0; padding: 0;  /* 既定の字下げを打消し */
  }
}

/* 商品グループ：タブレットでもグリッド＆余白を適用（最大2列） */
@media (min-width:768px) and (max-width:1023px){
  .fs-c-subgroup .fs-c-subgroupList{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* ←3列にしたい場合は 3 に */
    column-gap: 16px;
    row-gap: 12px;
    margin: 0; padding: 0; list-style: none;
  }
  .fs-c-subgroup .fs-c-subgroupList > li{
    float: none !important; clear: none !important;
    width: auto !important; margin: 0 !important;
  }
  /* 1件だけの時は全幅 */
  .fs-c-subgroup .fs-c-subgroupList > li:only-child{
    grid-column: 1 / -1 !important;
  }
}


/* 下側のステータスだけ非表示（上は残す） */
.fs-body-category .fs-c-subgroup > ul.fs-c-subgroupList ~ .fs-c-listControl .fs-c-listControl__status{
  display: none !important;
}

/* 商品ページのパンくずをPCだけ整える（両方のシステムパーツに適用） */
@media (min-width:1024px){
  :root{
    --main-w: 1216px;  /* = .fs-l-main の max-width */
    --pad: 8px;        /* 左右の内側余白 */
    --bc-top: 16px;    /* 上マージン */
    --bc-bottom: 8px;  /* 下マージン */
    --bc-indent: 0;    /* 左に1～2文字分寄せたい時は 1.6em などに */
  }

  /* 器：中央幅に揃えて上下余白を付与（nav版・div版の両方） */
  .fs-body-product nav.fs-c-breadcrumb,
  .fs-body-product div.fs-c-breadcrumb{
    max-width: var(--main-w);
    margin: var(--bc-top) auto var(--bc-bottom);
    padding-inline: var(--pad);
    box-sizing: border-box;
  }

  /* リストの字下げをリセット＋任意のインデント */
  .fs-body-product nav.fs-c-breadcrumb .fs-c-breadcrumb__list,
  .fs-body-product div.fs-c-breadcrumb .fs-c-breadcrumb__list{
    list-style: none;
    margin: 0;
    padding-left: var(--bc-indent);
  }

  /* サブグループ側で ol が複数並ぶ場合の間隔 */
  .fs-body-product div.fs-c-breadcrumb .fs-c-breadcrumb__list + .fs-c-breadcrumb__list{
    margin-top: 6px; /* お好みで */
  }
}

/* 商品ページ(PC)：パンくずの ol と ol の間の余白をゼロに */
@media (min-width:1024px){
  /* まず各olのデフォ余白をゼロに */
  .fs-body-product nav.fs-c-breadcrumb .fs-c-breadcrumb__list,
  .fs-body-product div.fs-c-breadcrumb .fs-c-breadcrumb__list{
    margin: 0 !important;
    padding: 0;
    list-style: none;
  }
  /* 兄弟olの間に入っている上マージン系を念のため打ち消し */
  .fs-body-product div.fs-c-breadcrumb .fs-c-breadcrumb__list + .fs-c-breadcrumb__list{
    margin-top: 0 !important;
  }

  /* nav の直後にある div.fs-c-breadcrumb をピンポイント指定 */
  .fs-body-product nav.fs-c-breadcrumb + div.fs-c-breadcrumb{
    margin-top: 0 !important;
  }
}

/* 海人情報のリスト：6件目以降を非表示 */
.fs-p-dateList .fs-pt-list__item:nth-child(n+6) {
  display: none !important;
}
/* ⇑ 共通CSS（両テーマに共通）⇑ */


/* =========================================================
  商品詳細：PC=2カラム（左=少し広く） / SP=1カラム（HTML変更なし）
  対象：.fs-l-productLayout__item--1 / --2
========================================================= */

/* SP（デフォルト）：縦1列 */
.fs-l-main.fs-l-product .fs-l-productLayout.fs-system-product{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 24px !important; /* 余白はお好みで */
}

/* 既存テーマの float/width 指定を無効化（崩れ防止） */
.fs-l-main.fs-l-product .fs-l-productLayout.fs-system-product > .fs-l-productLayout__item{
  float: none !important;
  width: auto !important;
  min-width: 0; /* はみ出し防止（長い要素対策） */
}

/* PC：横2列（左=画像側を少し広く） */
@media (min-width: 979px){
  .fs-l-main.fs-l-product .fs-l-productLayout.fs-system-product{
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr) !important;
    column-gap: clamp(16px, 3vw, 48px) !important;
    row-gap: 24px !important;
    align-items: start;
  }
}