/*
  v2-ds.css — トップ（ワイド2）で揃えた見せ方を、Shopify 標準のページにも当てる共通部品（2026-09-30〜）
  値はトップで実際に効いている最終値を書き起こしたもの（トップ側の CSS は v2-top-scene-finder.css）。
  対象は標準ページだけ（コレクション・製品・カート・検索・会員・ブログ・記事・固定ページ・404）。LP とトップには当てない。
  部品:
    1. セクション見出し    PC 28px / SP 22px・太字・行間 1.4
    2. 「すべて見る」       枠なしの小さな文字リンク＋矢印（矢印はサイト共通の 1 種）
    3. 売れ筋ランキング    TOP3 を大きく・4 位以降は 4 列、区切り線、画像・名前・価格の大きさ
    4. クーポン表示        赤の枠線（塗りつぶさない）
*/

/* ── 1. セクション見出し ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="customers/"], [data-template^="blog"], [data-template^="article"], [data-template="page"], [data-template^="page.legal"], [data-template="404"], [data-template^="list-collections"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  .shopify-section :is(h2, h3).heading {
  color: #1a1a1a;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.01em;
}
@media (min-width: 1080px) {
  body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="customers/"], [data-template^="blog"], [data-template^="article"], [data-template="page"], [data-template^="page.legal"], [data-template="404"], [data-template^="list-collections"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
    .shopify-section :is(h2, h3).heading { font-size: 28px; }
}

/* ── 2. 「すべて見る」: 枠なしの文字リンク＋矢印 ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="customers/"], [data-template^="blog"], [data-template^="article"], [data-template="page"], [data-template^="page.legal"], [data-template="404"], [data-template^="list-collections"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  .btn-sm-sqr-outline {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 0;
  border: 0 !important;
  border-radius: 0;
  background: none !important;
  color: #1a1a1a;
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
  &::after {
    content: "";
    width: 14px;
    height: 14px;
    flex: none;
    margin: 0;
    transform: none;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  &:hover { opacity: 0.7; }
}

/* ── 3. 売れ筋ランキング ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="blog"], [data-template^="article"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  .v2-products-ranking {
  & .contents .items.is-current,
  & .contents .items:only-child {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 10px;
    width: auto !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    overflow: visible !important;

    & > article:nth-of-type(n) {
      display: block !important;
      flex: none !important;
      width: auto !important;
      min-width: 0;
      padding-left: 8px !important;
      border-left: 1px solid #e6e6e6 !important;
    }
    & > article:nth-of-type(n + 8) { display: none !important; }
  }
  /* SP: トップと同じく 3 列 × 2 行（1〜6 位）。色の小窓は省いて縦を詰める */
  @media (max-width: 1079.98px) {
    & .contents .items.is-current,
    & .contents .items:only-child {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px 8px;
      & > article:nth-of-type(n) { grid-column: auto; }
      & > article:nth-of-type(n + 7) { display: none !important; }
      & .product-card-default-thum, & .product-card-default-thum img { height: 104px !important; }
      & .product-card-default-thum img { width: 100%; object-fit: contain; }
      & .product-card-default-others, & .product-card-default-dots, & .product-card-default-length { display: none !important; }
      & .product-card-default-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: 6px; font-size: 11px; line-height: 1.45; }
      & .product-price-v2 { font-size: 13px; }
    }
  }
  /* PC: TOP3 の順位リボンを大きく */
  @media (min-width: 1080px) {
    & .contents .items > article:nth-of-type(-n + 3)::before { transform: scale(1.35); transform-origin: top left; }
  }
  @media (min-width: 1080px) {
    & .contents .items.is-current,
    & .contents .items:only-child {
      grid-template-columns: repeat(12, minmax(0, 1fr));
      gap: 32px 16px;
      & > article:nth-of-type(n) { padding-left: 16px !important; }
      & > article:nth-of-type(-n + 3) { grid-column: span 4; }
      & > article:nth-of-type(n + 4) { grid-column: span 3; }
      & > article:nth-of-type(-n + 3) .product-card-default-thum { height: 320px; & img { height: 320px; object-fit: contain; } }
      & > article:nth-of-type(n + 4) .product-card-default-thum { height: 200px; & img { height: 200px; object-fit: contain; } }
      & > article:nth-of-type(-n + 3) .product-card-default-name { font-size: 17px; font-weight: 700; }
      & > article:nth-of-type(-n + 3) .product-price-v2 { font-size: 20px; }
      & > article:nth-of-type(n + 4) .product-card-default-name { font-size: 14px; }
      & > article:nth-of-type(n + 4) .product-price-v2 { font-size: 16px; }
    }
  }
}

/* ── 4. クーポン表示: 赤の枠線 ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="blog"], [data-template^="article"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  .product-price-v2-coupon-label {
  padding: 3px 7px;
  border: 1px solid #d6334a;
  border-radius: 2px;
  background: #fff !important;
  color: #c62839 !important;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
}

/* ── 5. 記事の一覧（カテゴリの「おすすめ記事」など）: トップの Anker Magazine と同じ、見出しが主役のリスト ──
   区切り線・左に見出しと抜粋・右に写真（PC 160px / SP 112px）。PC は 2 列 */
body[data-template^="collection"] .collection-recommend-articles {
  padding: 0 20px !important;
  background: none !important;
  @media (min-width: 1080px) { padding: 0 !important; }
  & .heading { margin-bottom: 20px !important; align-items: center; }
  & .list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    overflow: visible !important;
    border-top: 1px solid #e3e3e3;
    @media (min-width: 1080px) { grid-template-columns: 1fr 1fr !important; column-gap: 48px !important; }
  }
  & .item {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 112px;
    grid-template-areas: "title img" "desc img";
    align-content: center;
    column-gap: 16px;
    row-gap: 6px;
    width: auto !important;
    padding: 16px 0;
    border-bottom: 1px solid #e3e3e3;
    color: #1a1a1a;
    @media (min-width: 1080px) { grid-template-columns: minmax(0, 1fr) 160px; column-gap: 24px; padding: 20px 0; }
  }
  & .img-wrap {
    grid-area: img;
    align-self: center;
    aspect-ratio: 16 / 9;
    margin: 0 !important;
    overflow: hidden;
    border-radius: 2px !important;
    background: #f2f2f2;
    & img { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; transform: none !important; }
  }
  & .title {
    grid-area: title;
    align-self: end; /* 写真の高さで行が伸びても、見出しと抜粋は中央にまとめる */
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 0 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;
    @media (min-width: 1080px) { font-size: 16px !important; }
  }
  & .description {
    grid-area: desc;
    align-self: start;
    /* 抜粋は 1 行。-webkit-line-clamp は Chrome で効かず 2 行出て、見出しが 2 行の記事だけ行の高さで切れていた → 1 行＋末尾「…」に */
    display: block !important;
    -webkit-line-clamp: unset;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 0 !important;
    color: #888 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
  }
  & .item:hover .title { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #bbb; }
}

/* ── 6. 製品一覧（コレクション・検索）: トップの製品リストと同じ区切り線・文字の大きさ。色はモノトーン ── */
body:is([data-template^="collection"], [data-template^="search"]) :is(.collection-products-v2, .search-v2) {
  & .collection-products-v2-list,
  & .search-v2-product-list {
    gap: 28px 8px !important;
    @media (min-width: 1080px) { gap: 40px 16px !important; }
    & > article.product-card-default {
      padding: 0 0 0 8px !important;
      border-left: 1px solid #e6e6e6 !important;
      @media (min-width: 1080px) { padding-left: 16px !important; }
    }
  }
  & .product-card-default-name {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 2.9em !important;
    max-height: none !important;
    margin: 10px 0 8px !important;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    @media (min-width: 1080px) { font-size: 14px; }
  }
  & .product-card-default-badge {
    border: 1px solid #1a1a1a !important;
    border-radius: 2px;
    background: #fff !important;
    color: #1a1a1a !important;
    font-weight: 500;
  }

  /* 並び替え・絞り込みボタン・在庫トグル・適用中の条件 */
  & .filter-v2-products-sort-selectbox,
  & .filter-v2-btn {
    height: 40px;
    border: 1px solid #cfcfcf !important;
    border-radius: 4px !important;
    background-color: #fff;
    color: #1a1a1a;
    font-size: 13px;
  }
  & input[type="text"], & input[type="number"], & .filter-v2-select {
    border-radius: 4px !important;
    &:focus { border-color: #1a1a1a !important; box-shadow: none !important; }
  }
  & input:checked + .filter-v2-stock-toggle-track { background: #1a1a1a; }
  & .filter-v2-stock-toggle-label { color: #1a1a1a; font-size: 13px; }
  & .filter-v2-chip { border-color: #dcdcdc; border-radius: 4px; background: #fff; }

  /* 絞り込みの項目 */
  & .filter-v2-block { border-color: #e6e6e6 !important; }
  & .filter-v2-block-title {
    color: #1a1a1a;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: none;
  }
  & .filter-v2-group-text { font-size: 13px; }
  & .filter-v2-checkbox {
    width: 18px; height: 18px; min-width: 18px;
    border: 1px solid #b5b5b5 !important;
    border-radius: 2px;
    &:has(input[type="radio"]) { border-radius: 50%; }
    &:has(input[type="checkbox"]:checked) { background-color: #1a1a1a; border-color: #1a1a1a !important; }
    &:has(input[type="checkbox"]:checked)::after { width: 11px; height: 11px; }
    &:has(input[type="radio"]:checked) { border: 1px solid #1a1a1a !important; background: #fff; }
    &:has(input[type="radio"]:checked)::after { width: 8px; height: 8px; background: #1a1a1a; }
  }
  & .filter-v2-radio { border-color: #dcdcdc; border-radius: 4px; color: #1a1a1a; }
  & .filter-v2-group-radio:checked + label { border-color: #1a1a1a; background: #f4f4f4; }
  & :is(.filter-v2-link-clear, .filter-v2-link-clear-pc) {
    color: #1a1a1a;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #bbb;
    &:hover, &:active { background: none; }
  }
  & .filter-v2-btn-apply { border-radius: 4px; font-weight: 700; }

  /* ページ送り */
  & .pagination {
    & li, & a { border-radius: 4px; background: #fff; color: #1a1a1a; }
    & li:not(.active):not(.disabled):not(.pagination-next):not(.pagination-prev) { border: 1px solid #e6e6e6; }
    & li:not(.active) a { width: 100%; height: 100%; background: none; }
    & li:hover, & a:hover { background: #f4f4f4; color: #1a1a1a; }
    & li.active { background: #1a1a1a; color: #fff; }
  }
}

/* ── 7. カテゴリの見出し帯: 見出しは太字、「おすすめ製品を比較」はトップの共通ボタン（v2-btn）と同じ ── */
body[data-template^="collection"] {
  & .collection-visual-title { font-weight: 700; letter-spacing: 0.01em; }
  & .collection-visual-block .collection-compare-table-button,
  & .collection-categories-compare-table .collection-compare-table-button {
    gap: 8px;
    align-self: flex-start;
    width: fit-content;
    max-width: none;
    min-height: 44px;
    padding: 0 18px 0 20px;
    border: 1px solid #cfcfcf;
    border-radius: 4px;
    background: #fff;
    color: #1a1a1a;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.02em;
    transition: background 0.2s, border-color 0.2s;
    &:hover { background: #f4f4f4; border-color: #b5b5b5; }
    &::after {
      content: "";
      display: block;
      position: static;
      width: 16px;
      height: 16px;
      flex: none;
      margin: 0;
      border: 0;
      transform: none;
      background: currentColor;
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    }
  }
  & .collection-categories :is(p, span, .title, [class*="name"]) { color: #1a1a1a; }
}

/* ── 9. 製品ページ ── */
body[data-template^="product"] {
  /* カートに入れる: 水色の塗り・角丸 4px（10/2 カート・購入のボタンは水色に戻す方針。色はライブと同じ #00a9e0） */
  & .product-form__cart-submit:not([disabled]) {
    border: 1px solid #00a9e0 !important;
    border-radius: 4px !important;
    background: #00a9e0 !important;
    color: #fff !important;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: background 0.2s;
    &:hover { background: #0093c4 !important; border-color: #0093c4 !important; }
  }
  /* 価格下のマイル・配送・法人アイコン: 水色をやめて黒 */
  & :is(.icon-svg-mile, .icon-svg-track, .icon-svg-corporate) svg {
    & [fill]:not([fill="none"]):not([fill="white"]):not([fill="#fff"]):not([fill="#FFF"]) { fill: #1a1a1a; }
    & [stroke]:not([stroke="none"]) { stroke: #1a1a1a; }
  }
  & .icon-svg-corporate svg [fill="#D9D9D9"] { fill: #1a1a1a; }
  & .amazon-button { border-color: #cfcfcf !important; color: #1a1a1a; &:hover { background: #f4f4f4; } }

  /* 画像の下の「特徴・製品仕様・比較表・レビュー」: 灰色の箱をやめ、区切り線と下向き矢印のリンク列に */
  & .product-internal-links {
    gap: 0 !important;
    border-block: 1px solid #e6e6e6;
    & .item {
      background: none !important;
      color: #1a1a1a !important;
      font-size: 12px;
      & + .item { border-left: 1px solid #e6e6e6; }
      &::after {
        width: 12px;
        height: 12px;
        background: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
        transform: translateY(-50%) rotate(90deg);
        transition: transform 0.2s;
      }
      &:hover { background: #f7f7f7 !important; }
      &:hover::after { transform: translateY(-30%) rotate(90deg); }
    }
    & .link { padding-block: 12px !important; }
    @media (min-width: 1080px) { & .item { font-size: 13px; } }
  }

  /* 会員特典（購入ボタンの下）: 見出しは太字、アイコンはモノトーン */
  & .product-benefit {
    & .block p { font-weight: 700; font-size: 16px; @media (min-width: 1080px) { font-size: 18px; } }
    & .block a { color: #1a1a1a; text-underline-offset: 3px; text-decoration-color: #bbb; }
    & li p { font-size: 14px; font-weight: 500; @media (min-width: 1080px) { font-size: 16px; } }
    & li span { font-weight: 400; }
    & .icon-svg svg, & .icon-svg svg * { color: #1a1a1a; }
    & .icon-svg svg :is(path, circle, rect, ellipse, polygon, line)[fill]:not([fill="none"]):not([fill="#fff"]):not([fill="white"]):not([fill="#FFF"]) { fill: #1a1a1a; }
    & .icon-svg svg :is(path, circle, rect, ellipse, polygon, line)[stroke]:not([stroke="none"]) { stroke: #1a1a1a; }
  }

  /* セクション見出し（製品比較表・製品仕様）: トップと同じ太字 */
  & :is(.products-comparison-chart-title, .product-specs-title) {
    color: #1a1a1a;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.4;
    letter-spacing: 0.01em;
    @media (min-width: 1080px) { font-size: 28px !important; }
  }
  /* 「もっと見る」: 水色をやめて黒の文字リンク */
  & :is(.products-comparison-chart-readmore, .products-specs-readmore) {
    color: #1a1a1a !important;
    font-size: 14px;
    font-weight: 500;
    & span { border-color: #1a1a1a !important; }
  }
}

/* ── 10. 製品カード（全標準ページ共通）: 名前は 2 行・中太、ラベルは黒の枠。ランキングの大きさ指定は 3. が優先 ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="blog"], [data-template^="article"], [data-template="404"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  article.product-card-default {
  & .product-card-default-name {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    height: 2.9em !important;
    max-height: none !important;
    font-weight: 500;
    line-height: 1.45;
  }
  & .product-card-default-badge {
    border: 1px solid #1a1a1a !important;
    border-radius: 2px;
    background: #fff !important;
    color: #1a1a1a !important;
    font-weight: 500;
  }
  & .product-card-default-item.is-active { border-color: #8a8a8a !important; }
  /* ひとこと説明: 名前より目立たない灰色・2 行まで */
  & .product-card-defaul-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-top: 8px;
    color: #666;
    font-size: 12px;
    line-height: 1.6;
    @media (min-width: 1080px) { font-size: 13px; }
  }
}
/* ランキングの SP（3 列）はトップと同じく説明を出さない */
@media (max-width: 1079.98px) {
  body .v2-products-ranking .contents .items .product-card-defaul-desc { display: none !important; }
}

/* ── 11. 横スクロールの矢印（全標準ページ共通）: トップと同じ角丸 4px の四角＋共通矢印 ── */
body:is([data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="blog"], [data-template^="article"], [data-template="404"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  .v2-rail-nav button {
  border-radius: 4px !important;
  box-shadow: none !important;
  border: 1px solid #dcdcdc !important;
  background: #fff !important;
  color: #1a1a1a !important;
  & svg { display: none; }
  &::before {
    content: "" !important;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px !important;
    height: 18px !important;
    border: 0 !important;
    background: currentColor !important;
    transform: translate(-50%, -50%) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }
  &[data-rail-prev]::before { transform: translate(-50%, -50%) rotate(180deg) !important; }
  &:hover { background: #f4f4f4 !important; }
}

/* ── 12. 製品ページの関連製品レール・特徴の見出し ── */
body[data-template^="product"] {
  & .recommended-products {
    max-width: var(--site-w, 1080px) !important;
    & .heading { padding-right: 96px; }
    & > .button {
      position: absolute !important;
      top: 4px;
      right: 0;
      width: auto !important;
      margin: 0 !important;
      min-height: 0;
      padding: 6px 0;
      border: 0;
      background: none;
      color: #1a1a1a;
      font-size: 13px;
      &::before { display: none; }
      &::after {
        position: static !important;
        transform: none !important;
        width: 14px;
        height: 14px;
        background: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
      }
      &:hover { opacity: 0.7; }
    }
    & .splide__slide > article { border-left-color: #e6e6e6 !important; }
  }
  & .item_detail_title #features,
  & h3#features {
    color: #1a1a1a;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.4;
    letter-spacing: 0.01em;
    @media (min-width: 1080px) { font-size: 28px !important; }
  }
}

/* ── 13. 検索: 見出しは太字、「製品 / 記事・FAQ / 特集・ページ」はトップと同じ下線のタブ ── */
body:is([data-template^="search"], [data-template^="collection"]) .filter-v2-title {
  color: #1a1a1a;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
}
body[data-template^="search"] {
  & .search-v2-tabs {
    gap: 24px !important;
    padding: 0 !important;
    border-bottom: 1px solid #e6e6e6;
    background: none !important;
    overflow-y: hidden;
  }
  & .search-v2-tab {
    margin-bottom: -1px;
    padding: 4px 2px 12px !important;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    background: none !important;
    color: #666 !important;
    font-size: 14px;
    font-weight: 400 !important;
    &:hover { background: none !important; color: #1a1a1a !important; }
    &.is-active { border-bottom-color: #1a1a1a !important; color: #1a1a1a !important; font-weight: 700 !important; }
    @media (min-width: 1080px) { font-size: 15px; padding-bottom: 14px !important; }
  }
  & .search-v2-tab-count {
    min-width: 0;
    height: auto;
    padding: 0;
    background: none !important;
    color: #999 !important;
    font-size: 12px;
    font-weight: 400;
  }
}

/* ── 14. 会員（ログイン・登録など）と 404: 水色のボタンをトップと同じ黒／枠線ボタンに ── */
body:is([data-template^="customers/"], [data-template="404"]) {
  & main :is(h1, h2) { color: #1a1a1a; font-weight: 700; }
  & .button.button-bg-blue,
  & main .btn:not(.btn--secondary) {
    border: 1px solid #1a1a1a !important;
    border-radius: 4px !important;
    background: #1a1a1a !important;
    color: #fff !important;
    font-weight: 700;
    &:hover { background: #333 !important; }
  }
  & .button.button-border-blue {
    border: 1px solid #cfcfcf !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #1a1a1a !important;
    font-weight: 500;
    &:hover { background: #f4f4f4 !important; }
  }
  & :is(.textlink, .text-link--accent) {
    color: #1a1a1a !important;
    border-color: #1a1a1a !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #bbb;
  }
  & input:is([type="email"], [type="text"], [type="password"], [type="tel"]):focus { border-color: #1a1a1a !important; box-shadow: none !important; outline: none; }
}

/* ── 15. カート: 手続きボタンは水色の塗り（10/2 方針）、それ以外の水色の文字・枠はモノトーン。おすすめの幅はトップと同じ ── */
body[data-template^="cart"] {
  & .cart-wrap :is(h1, h2) { color: #1a1a1a; font-weight: 700; }
  & .cart__submit {
    border: 1px solid #00a9e0 !important;
    border-radius: 4px !important;
    background: #00a9e0 !important;
    color: #fff !important;
    font-weight: 700;
    &:hover { background: #0093c4 !important; border-color: #0093c4 !important; }
  }
  & .cart-free-ship, & .cart-free-ship * { color: #1a1a1a !important; }
  & .icon-svg-question svg { color: #999; & [stroke]:not([stroke="none"]) { stroke: #999; } & [fill]:not([fill="none"]):not([fill="#fff"]):not([fill="white"]) { fill: #999; } }
  & .cart-login-promotion {
    border-color: #e6e6e6 !important;
    border-radius: 4px !important;
    background: #fff !important;
  }
  & .cart-login-promotion__button {
    border: 1px solid #cfcfcf !important;
    border-radius: 4px !important;
    &:hover { background: #f4f4f4 !important; }
    & svg [stroke]:not([stroke="none"]) { stroke: #1a1a1a; }
  }
  & .cart-continue { border-radius: 4px; background: #fff !important; border-color: #cfcfcf !important; &:hover { background: #f4f4f4 !important; } }
  @media (min-width: 1080px) {
    & .product-recommendations.v2-grid-product-list { max-width: var(--site-w) !important; }
  }
}

/* ── 16. 製品カードの「カートに追加」（トップ・閲覧履歴を含む）: ライブと同じ水色の枠＋黒文字、形は角丸 4px（10/2 カート・購入のボタンは水色に戻す方針） ── */
body:is([data-template="index"], [data-template^="collection"], [data-template^="product"], [data-template^="cart"], [data-template^="search"], [data-template^="blog"], [data-template^="article"], [data-template="404"], [data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"])
  :is(.btn-add-to-cart:not(.btn-add-to-cart-sold-out):not([disabled]), #browsingHistoryProductsList .btn-cart:not(.btn-disabled):not([disabled])) {
  border: 1px solid #00a9e0 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #1a1a1a !important;
  font-weight: 500;
  &:hover { background: #e8f7fc !important; border-color: #00a9e0 !important; }
}

/* ── 17. ヘッダーの検索パネル（全ページ）: 幅をトップと同じに、タブは下線、色はモノトーン ── */
body:not([data-template^="business:"]) .v2-form-hd-search-predictive-search {
  @media (min-width: 1080px) {
    & .container { max-width: var(--site-w, 1080px) !important; }
    & .v2-form-hd-search-predictive-search__product-list { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 32px 16px !important; }
  }
  & .v2-form-hd-search-predictive-search__title { font-weight: 700; }
  & .v2-form-hd-search-predictive-search__product-list > article.product-card-default {
    padding: 0 0 0 8px !important;
    border-left: 1px solid #e6e6e6 !important;
    @media (min-width: 1080px) { padding-left: 16px !important; }
    & .product-card-default-name {
      display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
      height: 2.9em !important; max-height: none !important; font-weight: 500; line-height: 1.45;
    }
    & .product-card-default-badge { border: 1px solid #1a1a1a !important; border-radius: 2px; background: #fff !important; color: #1a1a1a !important; }
  }
  & .v2-form-hd-search-predictive-search__tab {
    gap: 24px !important;
    border-bottom: 1px solid #e6e6e6;
    overflow-x: auto;
    overflow-y: hidden;
  }
  & .v2-form-hd-search-predictive-search__tab-item {
    margin-bottom: -1px;
    padding: 4px 2px 12px !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    background: none !important;
    color: #666 !important;
    font-size: 14px;
    font-weight: 400 !important;
    &:hover { background: none !important; color: #1a1a1a !important; }
    &.is-active { border-bottom-color: #1a1a1a !important; color: #1a1a1a !important; font-weight: 700 !important; }
    @media (min-width: 1080px) { font-size: 15px; padding-bottom: 14px !important; }
  }
  & .v2-form-hd-search-predictive-search__close-modal button {
    color: #1a1a1a !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #bbb;
  }
}
body:not([data-template^="business:"]) .v2-form-hd-search-predictive-search__link-page a {
  justify-content: center;
  gap: 8px;
  min-height: 44px !important;
  padding: 0 20px !important;
  border: 1px solid #cfcfcf !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #1a1a1a !important;
  font-size: 14px;
  font-weight: 500;
  @media (min-width: 1080px) { width: auto !important; max-width: none !important; }
  &:hover { background: #f4f4f4 !important; border-color: #b5b5b5 !important; }
  &::after {
    position: static !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    transform: none !important;
    background: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat !important;
  }
}

/* ── 18. レビュー（Leeep）のページ送り: コレクションのページ送りと同じ四角（40px・角丸 4px・現在ページは黒） ── */
body[data-template^="product"] .LeeepReviewPager {
  & .LeeepReviewPagerList { display: flex; align-items: center; justify-content: center; gap: 4px; }
  & .LeeepReviewPagerItem {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #1a1a1a !important;
    font-size: 15px;
    line-height: 1;
    &:hover { background: #f4f4f4 !important; }
  }
  & .LeeepReviewPagerItem:has(svg),
  & li.LeeepReviewPagerItem:not(.LeeepReviewPagerItemCurrent) { border-color: transparent !important; background: none !important; }
  & .LeeepReviewPagerItemCurrent { border-color: #1a1a1a !important; background: #1a1a1a !important; color: #fff !important; }
}

/* ── 19. カテゴリの見出し帯（PC）: 文字の欄を画像の手前まで広げる（見出しが 340px で折り返していた） ── */
@media (min-width: 1080px) {
  body[data-template^="collection"] .collection-visual-block {
    gap: 48px !important;
    & > :not(.collection-visual-image):not(.collection-visual-image-empty):not(img):not(picture) { flex: 1 1 0; min-width: 0; }
    & .collection-visual-inner { width: auto !important; max-width: none !important; }
    & .collection-visual-title { max-width: none !important; width: auto !important; }
  }
}

/* ── 20. ヘッダーの「製品カテゴリから探す」（全ページ）: トップの「製品を探す」と同じタイル。詳しい分類は切り替え ──
   snippets/v2-header-cat-tiles.liquid。画像は CSS 背景（検索結果のサムネに拾われないため）で、表示時にだけ付く */
.v2-hcat {
  @media (max-width: 1079.98px) { padding: 8px 20px 24px; }
  & .v2-hcat__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 20px; }
  & .v2-hcat__title { margin: 0; color: #1a1a1a; font-size: 18px; font-weight: 700; line-height: 1.4; }
  & .v2-cat-detail {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 0; border: 0; background: none;
    color: #777; font: inherit; font-size: 12px; line-height: 1.5; cursor: pointer;
    & .v2-cat-detail__sw { position: relative; width: 24px; height: 14px; border-radius: 7px; background: #d6d6d6; transition: background 0.2s; }
    & .v2-cat-detail__sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 10px; height: 10px; border-radius: 50%; background: #fff; transition: transform 0.2s; }
    &[aria-pressed="true"] { color: #1a1a1a; }
    &[aria-pressed="true"] .v2-cat-detail__sw { background: #1a1a1a; }
    &[aria-pressed="true"] .v2-cat-detail__sw::after { transform: translateX(10px); }
  }
  & .v2-hcat__list {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; margin: 0; padding: 0; list-style: none;
    @media (min-width: 1080px) { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 24px 16px; }  /* トップの「製品を探す」と同じ 7 列（14 分類 = 7 × 2 段） */
  }
  & .v2-hcat__cat { display: grid; justify-items: center; gap: 10px; color: #1a1a1a; text-decoration: none; }
  & .v2-hcat__visual {
    display: grid; place-items: center; width: 100%; aspect-ratio: 1; padding: 8px; box-sizing: border-box;
    border-radius: 4px; background-color: #f3f5f6; color: #1a1a1a; transition: background-color 0.2s;
    @media (min-width: 1080px) { padding: 16px; }
  }
  & .v2-hcat__visual--all { background-color: #e9edef; }
  /* 白地の製品写真（その他など）もグレーの面になじませる */
  & .v2-hcat__visual.is-img { background-blend-mode: multiply; }
  & .v2-hcat__cat:hover .v2-hcat__visual { background-color: #eaedef; }
  & .v2-hcat__label { color: #1a1a1a; font-size: 11px; font-weight: 500; line-height: 1.4; text-align: center; word-break: keep-all; overflow-wrap: anywhere; @media (min-width: 1080px) { font-size: 13px; } }
  & .v2-hcat__detail { display: none; }
}
html[data-cat-detail] .v2-hcat {
  & .v2-hcat__list { display: none; }
  & .v2-hcat__detail { display: block; }
}

/* ── 21. レビュー（Leeep）: PC は左に平均点と集計を固定、右にレビューを区切り線で並べる（9/30 C 案）。星・集計バーは水色のまま ── */
body[data-template^="product"] .LeeepReviewRoot {
  & .LeeepReviewAvgRatingValue { font-size: 56px !important; font-weight: 700; letter-spacing: -0.02em; }
  & .LeeepReviewStatsRatingBarBg { height: 4px !important; border-radius: 2px !important; }
  & .LeeepReviewWriteLink { border-radius: 4px !important; background: #1a1a1a !important; color: #fff !important; }
  & .LeeepReviewListFilterButton { border-radius: 4px !important; border: 1px solid #cfcfcf !important; background: #fff !important; }
  & .LeeepReviewTitle { color: #1a1a1a; font-weight: 700; margin-top: 6px !important; font-size: 18px !important; line-height: 1.5 !important; }
  & .LeeepReviewText { color: #333; margin-top: 10px !important; font-size: 15px !important; line-height: 1.9 !important; }
  & .LeeepReviewerInfo { margin-top: 14px !important; justify-content: flex-start !important; gap: 12px; }
  & .LeeepReviewerName { color: #1a1a1a !important; font-size: 13px !important; font-weight: 500; }
  & .LeeepReviewDate { width: auto !important; text-align: left !important; color: #999 !important; font-size: 12px !important; }
  & .LeeepReviewHelpfulButton { height: 30px; padding: 0 12px !important; border-radius: 4px !important; border: 1px solid #dcdcdc !important; background: #fff !important; color: #1a1a1a !important; font-size: 12px !important; }
  & .LeeepReviewList { border-top: 1px solid #e6e6e6; }
  & .LeeepReview { margin: 0 !important; padding: 28px 0 !important; border: 0 !important; border-bottom: 1px solid #e6e6e6 !important; border-radius: 0 !important; box-shadow: none !important; }
  & .LeeepReviewRatingStar { transform: scale(0.72); transform-origin: left center; }
  @media (min-width: 1080px) {
    display: grid !important; grid-template-columns: 300px minmax(0, 1fr); column-gap: 64px; align-items: start;
    & > * { grid-column: 2; }
    & > .LeeepReviewStats { grid-column: 1; grid-row: 1 / span 3; position: sticky; top: 96px; padding-top: 0 !important; min-height: 0 !important; height: auto !important; }
    & .LeeepReviewStatsOverview { align-items: start !important; align-content: start !important; }
    & .LeeepReviewStatsOverview { display: grid !important; grid-template-columns: 1fr !important; gap: 20px !important; justify-items: start; }
    & .LeeepReviewStatsSummary { align-items: flex-start !important; text-align: left !important; }
    & .LeeepReviewStatsRatingRowList { width: 100% !important; }
    & .LeeepReviewStatsRatingBarBg { flex: 1; }
  }
}

/* レビューの見出し「商品レビュー」: 他の見出しと同じ太字・左寄せ */
body[data-template^="product"] #leeep-tag-review-title {
  color: #1a1a1a;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.4;
  text-align: left !important;
  @media (min-width: 1080px) { font-size: 28px !important; }
}
body[data-template^="product"] .section-embed-liquid.page-width:has(#leeep-tag-review-title) { padding-inline: 0 !important; }


/* ── 22. ブランドトップ（/pages/charging・audio・projector・cleaner）: 幅・見出し・ボタン・カテゴリ・旧診断をトップの見せ方に ──
   製品カード・ランキング・矢印・「すべて見る」・カートに追加は上の共通ルールの対象に含めてある */
body:is([data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"]) {
  @media (min-width: 1080px) {
    & main section :is(.wrapper, .l-inr-md),
    & main .v2-products-ranking,
    & main .Category .scroll-container {
      width: 100% !important;
      max-width: var(--site-w) !important;
      margin-inline: auto !important;
    }
    & main .diagnosis-banner img { width: 100% !important; height: auto; }
    & main .Category > :is(.heading, .wrapper) { width: 100% !important; max-width: var(--site-w) !important; }
  }
  & main :is(h2, h3).heading,
  & main .v2-top-new-product-heading {
    color: #1a1a1a;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.01em;
    text-align: left !important;
    @media (min-width: 1080px) { font-size: 28px !important; }
  }
  & main .brandlink :is(h1, h2, h3):not(.heading) { font-weight: 700; }
  & main .Brand :is(h3, h4):not(.heading) { font-weight: 700; }
  /* ページ上部のカテゴリの小さなボタン */
  & .category-subnav__chip { border-radius: 4px !important; border-color: #dcdcdc !important; color: #1a1a1a; }
  /* 「Ankerについて」などの水色ボタン → トップの共通ボタン */
  & main .btn-arrow-move {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 0 20px !important;
    border: 1px solid #cfcfcf !important; border-radius: 4px !important;
    background: #fff !important; color: #1a1a1a !important; font-size: 14px; font-weight: 500;
    &:hover { background: #f4f4f4 !important; border-color: #b5b5b5 !important; }
    &::after { filter: brightness(0); }
  }
  /* カテゴリから探す: トップの「製品を探す」タイルと同じ面 */
  & main .category-box { border: 0 !important; border-radius: 4px !important; background: #f3f5f6 !important; color: #1a1a1a; font-weight: 500; &:hover { background: #eaedef !important; } }
  /* ブランド内の診断（旧型）: 角丸 4px・水色をやめる */
  & main .v2-finder { border-radius: 4px !important; border-color: #e6e6e6 !important; }
  & main .v2-finder__opt { border-radius: 4px !important; background: #f3f5f6 !important; color: #1a1a1a !important; & svg { color: #1a1a1a !important; stroke: currentColor; } &:hover { background: #eaedef !important; } }
  & main .v2-finder :is([class*="progress"] i, [class*="dots"] i, [class*="bar"] i).is-current,
  & main .v2-finder :is([class*="progress"], [class*="step"]) .is-active { background: #1a1a1a !important; }
}
body:is([data-template="page.anker-v2"], [data-template="page.soundcore-v2"], [data-template="page.nebula-v2"], [data-template="page.cleaner"]) {
  /* KV: トップと同じく中央の 1 枚を --site-w 幅に（JS が 1080px を直書きしているので上書き） */
  @media (min-width: 1080px) {
    & .brand-slider .js-splide-top-main.v2-rail {
      --v2-rail-w: var(--site-w) !important;
      --v2-rail-pad: calc((100% - var(--site-w)) / 2) !important;
      & .splide__slide img { width: 100%; height: auto; }
      /* 左右にのぞく前後の画像の暗い覆い（1080px 基準で置かれていた）はトップに合わせて出さない */
      &::before, &::after { display: none !important; }
    }
  }
  /* 売れ筋ランキングのタブ: トップと同じ下線タブ（上の水色線をやめる） */
  & .v2-products-ranking .titles {
    gap: 24px !important;
    border-bottom: 1px solid #e6e6e6;
    overflow-y: hidden;
    & .button {
      margin-bottom: -1px;
      padding: 4px 2px 12px !important;
      border: 0 !important;
      border-bottom: 2px solid transparent !important;
      border-radius: 0 !important;
      background: none !important;
      color: #666 !important;
      font-size: 14px;
      font-weight: 400 !important;
      height: auto !important;
      &:hover { color: #1a1a1a !important; }
      &.is-current { border-bottom-color: #1a1a1a !important; color: #1a1a1a !important; font-weight: 700 !important; }
      @media (min-width: 1080px) { font-size: 15px; padding-bottom: 14px !important; }
    }
  }
}

/* ── 23. 本文書体の取りこぼし: Gen Interface JP Display（下層は noto-sans-jp.css が "Noto Sans JP" の名前で配信）に揃える ──
   記事本文やページ本文の HTML に書体を直書きしているもの。テーマ側で上書きする（10/1 実測で外れていた箇所） */
/* Magazine 記事: 本文に <style> で h3.h3-only-style { font-family: "Hiragino Kaku Gothic ProN", … } が入っている */
body[data-template="article.magazine"] .page-article-magazine h3.h3-only-style,
body[data-template="article.magazine"] h3.h3-only-style {
  font-family: "Noto Sans JP", sans-serif;
}
/* 製品ページ内の診断（#shindan.sp-quiz）: -apple-system / system-ui 指定で OS の書体になっていた */
body[data-template^="product"] .sp-quiz {
  font-family: "Noto Sans JP", sans-serif;
}

/* ── 24. カテゴリの長期保証ブロック: 水色の文字（小見出し・「24ヶ月」・もっと詳しく）をモノトーンに。図はそのまま ── */
body[data-template^="collection"] .collection-guarantee {
  & .toptxt { color: #666 !important; }
  & .highlight { color: #1a1a1a !important; }
  & .more-link { color: #1a1a1a !important; text-decoration: none; }
  & .more-link svg, & .more-link path { fill: currentColor !important; }
  & .more-link:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #bbb; }
}

/* ── 25. カテゴリのブランドの帯: one-anker のブランドページの帯（page-brand-v2.css「ブランド帯テンプレート」）と同じ作り ──
   ロゴは出さない。PC は画像を右 45%（実寸比・クロップなし）、文字は左でコンテンツの左端に揃える。地の色はブランドごと。
   SP は画像を上 200px に、文字の下地に同じ画像のぼかしを敷く（--band-img は brand-banner.liquid が渡す） */
body[data-template^="collection"] .collection-brand-bnr {
  --band-bg: #e8e9ee;
  position: relative;
  overflow: hidden;
  background: var(--band-bg) !important;
  &.-anker { --band-bg: #d6d7de; }
  &.-nebula { --band-bg: #f4f4f4; }
  & .collection-brand-bnr-img { position: relative !important; inset: auto !important; }
  & .collection-brand-bnr-txt { position: relative !important; inset: auto !important; transform: none !important; margin: 0 !important; color: #1a1a1a; }
  & .collection-brand-bnr-txt .ttl { margin: 0 !important; font-size: 22px; font-weight: 700; line-height: 1.5; }
  & .collection-brand-bnr-txt .prof { margin: 12px 0 0 !important; font-size: 13px; line-height: 1.9; color: #444; }
  @media (min-width: 1080px) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    min-height: 320px;
    padding: 0 !important;
    & .collection-brand-bnr-img { order: 2; flex: 0 0 45%; width: 45% !important; height: auto !important; }
    & .collection-brand-bnr-img::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 15%; background: linear-gradient(to right, var(--band-bg) 0%, transparent 100%); z-index: 1; }
    & .collection-brand-bnr-img img { display: block; width: 100% !important; height: auto !important; max-width: none; object-fit: unset !important; }
    & .collection-brand-bnr-img img.m-sp { display: none !important; }
    & .collection-brand-bnr-txt { flex: 1 1 auto; min-width: 0; width: auto !important; max-width: none !important; padding: 32px 40px 32px max(20px, calc((100vw - var(--site-w)) / 2)) !important; }
    & .collection-brand-bnr-txt .prof { max-width: 560px; }
  }
  @media (max-width: 1079px) {
    display: block !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    & > * { width: 100% !important; max-width: none !important; margin: 0 !important; }
    & .collection-brand-bnr-img { height: 200px !important; }
    & .collection-brand-bnr-txt { display: block !important; text-align: left !important; }
    & .collection-brand-bnr-txt .ttl, & .collection-brand-bnr-txt .prof { text-align: left !important; }
    & .collection-brand-bnr-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: right center; }
    & .collection-brand-bnr-img img.m-pc { display: block !important; }
    & .collection-brand-bnr-img img.m-sp { display: none !important; }
    & .collection-brand-bnr-txt { width: 100% !important; padding: 28px 20px 32px !important; z-index: 1; overflow: hidden; }
    & .collection-brand-bnr-txt::before { content: ""; position: absolute; inset: -30px; background-image: var(--band-img); background-size: cover; background-position: right center; filter: blur(28px); transform: scale(1.15); opacity: 0.45; z-index: -2; }
    & .collection-brand-bnr-txt::after { content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, 0.62); z-index: -1; }
    & .collection-brand-bnr-txt .ttl { font-size: 18px; }
  }
}

/* ── 26. 「Sold Out」ボタン（製品カード・閲覧履歴など全ページ）: 丸いピル型だった → 「カートに追加」と同じ角丸 4px。色はグレーの塗りのまま ── */
:is(.btn-add-to-cart-sold-out, .btn-cart.btn-disabled, .btn-add-to-cart[disabled]) {
  border-radius: 4px !important;
}

/* 26b. 10/8 閲覧履歴の「Sold Out」: 丸いグレーの塗り（別部品 .sold-out-badge）で「カートに追加」と形・高さ・文字がそろっていなかった
   → 同じ大きさ・角丸 4px・1px の枠にし、押せないことはグレーの文字と薄い地で示す */
.browsing-history-products .browsing-history-product-card .sold-out-badge {
  box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%;
  min-height: 36px; padding: 0 12px !important; border: 1px solid #e3e3e3 !important; border-radius: 4px !important;
  background: #f5f5f5 !important; color: #9a9a9a !important; font-weight: 500 !important; line-height: 1; cursor: default;
}

/* ── 27. 製品ページのレビュー: 下の会員特典の帯と詰まっていた（閲覧履歴が無いとき 12px）→ セクションの下に余白 ── */
body[data-template^="product"] .shopify-section:has(.LeeepReviewPager, [id^="leeep-embedded"], .mxpr-block-product-review) {
  padding-bottom: 56px;
  @media (min-width: 1080px) { padding-bottom: 80px; }
}

/* 10/9 ヘッダーの検索枠はどのページもトップと同じ角丸 4px（従来はトップだけ 4px・他ページはピル型で揃っていなかった） */
.v2-header-main .v2-form-hd-search, .v2-form-hd-search, .v2-header-search, .v2-header-search input { border-radius: 4px !important; }

/* 10/9 ヘッダー上のお知らせバー: 横に 1 枚ぶんスライドする動きをやめ、その場で短くフェードして入れ替える（文字は 4px だけ上下）
   ライブラリは使っていない（CSS だけ）。1 枚あたり 3.5 秒・入れ替えは 0.35 秒 */
.v2-hd-topics-css:is([data-slides="2"], [data-slides="3"]) .v2-hd-topics-slides { display: grid; animation: none !important; transform: none !important; }
.v2-hd-topics-css:is([data-slides="2"], [data-slides="3"]) .v2-hd-topics-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; animation: 7s linear infinite both v2-hd-fade-2; }
.v2-hd-topics-css[data-slides="3"] .v2-hd-topics-slide { animation-name: v2-hd-fade-3; animation-duration: 10.5s; }
.v2-hd-topics-css .v2-hd-topics-slide-clone { display: none !important; }
/* 上下の線と白地は外枠に持たせ、フェードするのは中身だけにする（線まで点滅して見えないように） */
.v2-hd-topics-css:is([data-slides="2"], [data-slides="3"]) { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background: #fff; }
.v2-hd-topics-css:is([data-slides="2"], [data-slides="3"]) .v2-hd-topics { border-top: 0; border-bottom: 0; background: transparent; }
.v2-hd-topics-css .v2-hd-topics-slide:nth-child(1) { animation-delay: -0.35s; }
.v2-hd-topics-css .v2-hd-topics-slide:nth-child(2) { animation-delay: 3.15s; }
.v2-hd-topics-css .v2-hd-topics-slide:nth-child(3) { animation-delay: 6.65s; }
@keyframes v2-hd-fade-2 {
  0% { opacity: 0; visibility: visible; transform: translateY(4px); }
  5%, 45% { opacity: 1; visibility: visible; transform: none; }
  50% { opacity: 0; visibility: hidden; transform: translateY(-4px); }
  100% { opacity: 0; visibility: hidden; }
}
@keyframes v2-hd-fade-3 {
  0% { opacity: 0; visibility: visible; transform: translateY(4px); }
  3.33%, 30% { opacity: 1; visibility: visible; transform: none; }
  33.33% { opacity: 0; visibility: hidden; transform: translateY(-4px); }
  100% { opacity: 0; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  @keyframes v2-hd-fade-2 { 0%, 45% { opacity: 1; visibility: visible; } 50%, 100% { opacity: 0; visibility: hidden; } }
  @keyframes v2-hd-fade-3 { 0%, 30% { opacity: 1; visibility: visible; } 33.33%, 100% { opacity: 0; visibility: hidden; } }
}
