/** Shopify CDN: Minification failed

Line 187:1 Unexpected "/"

**/
/* =========================
   Custom overrides (Dawn)
   ========================= */

/* 全体タイポ微調整（不要なら削除OK） */
:root{
  --font-body-scale: 1.08;
  --font-heading-scale: 1.12;
}

/* ====== Title → 名前＋属性バッジ ====== */
.kf-product-header{display:flex;flex-direction:column;gap:.5rem;margin:0 0 .5rem}
.kf-title{font-size:clamp(2.4rem,3.6vw,3.2rem);line-height:1.15;font-weight:700;margin:0}
.kf-badges{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-start}
.kf-badge{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.45rem .9rem;border-radius:999px;border:1px solid #e5e7eb;
  font-weight:600;font-size:1.2rem;line-height:1;background:#f3f4f6;color:#111827;
}
.kf-badge .kf-ico{margin-right:.4rem;line-height:1}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 言語 */
.kf-badge--lang-english{background:#e8f2ff;color:#0b57d0;border-color:#c9dcff}
.kf-badge--lang-japanese{background:#eaf7ea;color:#1f7a1f;border-color:#cfead0}
/* 例 */
.kf-badge--lang-spanish{background:#fff1e6;color:#b54600;border-color:#ffd7bd}
.kf-badge--lang-french {background:#eef2ff;color:#3b4bd6;border-color:#d8ddff}
.kf-badge--lang-german {background:#eef7ff;color:#1d4e89;border-color:#d4e6ff}

/* 性別（中立寄り） */
.kf-badge--gender-female{background:#f5e8ff;color:#6b21a8;border-color:#ead6ff}
.kf-badge--gender-male  {background:#e6f7fb;color:#03697a;border-color:#c9eef5}
.kf-badge--gender-unisex{background:#eef2f7;color:#374151;border-color:#d7dce3}

/* プラン */
.kf-badge--tier{font-weight:700}
.kf-badge--tier-premium{background:#fff3c4;color:#7a4b00;border-color:#f1d487}
.kf-badge--tier-lite   {background:#f3f4f6;color:#111827;border-color:#e5e7eb}

/* ダークモード（任意） */
@media (prefers-color-scheme: dark){
  .kf-badge{background:#2b2f36;color:#f3f4f6;border-color:#3a3f47}
  .kf-badge--lang-english{background:#0b57d0;color:#e8f2ff;border-color:#2b6fde}
  .kf-badge--lang-japanese{background:#1f7a1f;color:#eaf7ea;border-color:#2d8e2d}
  .kf-badge--gender-female{background:#6b21a8;color:#f5e8ff;border-color:#7e33b9}
  .kf-badge--gender-male  {background:#03697a;color:#e6f7fb;border-color:#087f92}
  .kf-badge--gender-unisex{background:#3b4252;color:#eef2f7;border-color:#485065}
  .kf-badge--tier-premium {background:#7a4b00;color:#fff3c4;border-color:#946006}
}

/* ====== 商品ページのレイアウト調整 ======
/* ====== 商品ページのレイアウト調整 ====== */
/* Dawnはモバイルで info カラムが center になりがちなので左寄せに */
.template-product .product__info-container{ text-align:left !important; }

/* タイトル＆ヘッダーを確実に左寄せ */
.template-product .product__title{ text-align:left !important; margin-left:0 !important; margin-right:auto !important; width:100% !important; }
.template-product .product__title .kf-product-header,
.template-product .product__title .kf-title{ text-align:left !important; margin:0 !important; }

/* タイトルサイズ（.kf-title優先。純正h1にも適用しておく） */
.template-product .kf-title.h1,
.template-product .product__title{
  font-size:clamp(2.6rem,3.8vw,3.4rem);
  line-height:1.15;
  font-weight:700;
}

/* 価格を少し強調 */
.product__price,
.price--large,
.product-single__price{
  font-size:clamp(2.0rem,3vw,2.4rem);
  font-weight:700;
}

/* 本文の読みやすさ */
.template-product .product__text,
.template-product .product__description,
.template-product .rte{
  font-size:1.6rem;
  line-height:1.9;
}

/* ボタンの文字サイズ微調整（任意） */
.template-product .button,
.shopify-payment-button__button,
.shopify-payment-button__button--unbranded{
  font-size:1.6rem;
  padding:1.1rem 1.4rem;
}

/* バッジ列の左寄せ */
.template-product .kf-badges{ justify-content:flex-start !important; }

/* オプション等のラベルを左寄せ */
.template-product .product-form__input,
.template-product .quantity__label{ justify-content:flex-start; }

/* 小物（任意） */
.p-name{font-weight:700;margin-top:.25rem}
.p-tags{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.25rem}
.tag{padding:.18rem .52rem;border-radius:999px;font-size:.85rem;border:1px solid #e5e7eb;line-height:1.2}
.tag.premium{border-color:#b68c00}

/* モバイル微調整 */
@media (max-width: 749px){
  .template-product .kf-title.h1,
  .template-product .product__title{ font-size:clamp(2.2rem,7vw,2.8rem); }
  .price--large{ font-size:2.0rem; }
  .kf-badge{ font-size:1.15rem; padding:.42rem .8rem; }
}

/* ====== Predictive search：ページ/記事は出さない（必要ならON） ====== */
#predictive-search-results .predictive-search__pages-wrapper,
#predictive-search-results [data-resource-type="page"],
#predictive-search-results [data-resource-type="article"],
#predictive-search-results li[id*="option-page"],
#predictive-search-results li[id*="option-article"],
#predictive-search-results a[href*="/pages/"],
#predictive-search-results a[href*="/blogs/"],
#predictive-search-results a[href*="/blog/"]{
  display:none !important;
}

/* === タイトル＆バッジ：左揃え＋“寄りすぎ防止”インセット === */
/* 旧レイアウト寄りの見え方に合わせて、タイトルブロック全体に左パディングを付与 */
:root{
  --kf-title-inset-mobile: 1.0rem;  /* モバイルの内側余白（左） */
  --kf-title-inset-desktop: 1.4rem; /* デスクトップの内側余白（左） */
}

.kf-product-header{
  align-items: flex-start;      /* 左寄せ */
  text-align: left !important;  /* 念のため */
  padding-left: var(--kf-title-inset-mobile);
}
@media (min-width: 750px){
  .kf-product-header{ padding-left: var(--kf-title-inset-desktop); }
}

/* タイトルを大きめに（旧レイアウト相当にアップ） */
.kf-title{
  font-size: clamp(2.8rem, 4vw, 3.6rem); /* 28–36px 目安 */
  line-height: 1.15;
  font-weight: 800;
  margin: 0;
}

/* バッジはタイトルと同じインセット内に置く（同じ左位置から始まる） */
.kf-badges{
  justify-content: flex-start;
  margin-top: .35rem;           /* タイトル直下に少し間隔 */
}

/* 念のためカード/商品ページ双方で確実に左寄せを固定 */
.card-wrapper .kf-product-header,
.template-product .product__title .kf-product-header{
  align-items: flex-start;
  text-align: left !important;
}

/* reset: タイトルの全幅化/左寄せの強制を解除 */
.template-product .product__title{
  width: auto;
  margin-left: unset;
  margin-right: unset;
}

@media (min-width: 990px){
  /* タイトルブロックを右カラムの左端に合わせる */
  .template-product .product__title{
    /* 右カラム（=ページの50%より右）に寄せる */
    margin-left: calc(50% + var(--grid-desktop-horizontal-spacing)/2) !important;
    max-width: 62rem; /* 見出しの行長。必要に応じて調整 */
  }

  /* 先に付けたインセットが二重にならないよう、デスクトップは0に */
  .kf-product-header{ padding-left: 0; }
}
*/

/* =========================
   Search only (predictive + /search)
   ========================= */

/* --- 予測検索ドロップダウン（ヘッダーのサジェスト） --- */
#predictive-search-results [data-resource-type="product"] .predictive-search__item-content{
  display:flex; flex-direction:column; align-items:flex-start;
  text-align:left; padding-left:.6rem; /* 左に寄り過ぎ防止の薄いインセット */
}

#predictive-search-results [data-resource-type="product"] .predictive-search__item-heading{
  margin:0; font-weight:800; line-height:1.2;
  font-size: clamp(1.7rem, 2.4vw, 2.2rem); /* Jeffery を大きめに */
}

#predictive-search-results [data-resource-type="product"] .kf-badges{
  margin-top:.35rem; gap:.5rem; justify-content:flex-start;
}

#predictive-search-results [data-resource-type="product"] .kf-badge{
  font-size:1.2rem; padding:.35rem .7rem;
}

/* ページ/記事は出さない（既存ルールはそのままでOK） */


/* --- /search 検索結果ページ（カードの見た目を合わせる） --- */
.template-search .card__content,
.template-search .card__information,
.template-search .card-information{
  align-items:flex-start; text-align:left;
}

.template-search .card__heading{
  font-size: clamp(1.9rem, 2.4vw, 2.4rem);
  font-weight:800; margin:.1rem 0 0; line-height:1.2;
}

.template-search .kf-badges{ margin-top:.35rem; gap:.5rem; justify-content:flex-start; }
.template-search .kf-badge{ font-size:1.2rem; padding:.35rem .7rem; }

/* ===== カード画像を大きく保つ ===== */
body.template-search #custom-grid .card__media img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ===== PC表示で左寄せ ===== */
body.template-search #custom-grid {
  justify-content: start; /* 右側に余白を寄せる */
}
/* 検索ページ：グリッドは常に左寄せ（アイテムが2つでも左へ寄る） */
body.template-search #custom-grid {
  justify-content: flex-start;   /* ← これだけでOK */
}

/* 画像をカード幅いっぱいに（小さくならないように） */
body.template-search #custom-grid .card__media img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover; /* 収まり優先にしたければ contain に変更 */
}

/* 余白はテーマ変数に合わせる（任意） */
@media (min-width: 990px){
  body.template-search #custom-grid {
    column-gap: var(--grid-desktop-horizontal-spacing);
    row-gap: var(--grid-desktop-vertical-spacing);
  }
}
@media (max-width: 989px){
  body.template-search #custom-grid {
    column-gap: var(--grid-mobile-horizontal-spacing);
    row-gap: var(--grid-mobile-vertical-spacing);
  }
}

/* ===== Search (/search) グリッド調整 ===== */

/* グリッドは常に左寄せ（2件でも左に寄る） */
body.template-search #custom-grid{
  justify-content:flex-start;
}

/* 画像をカード幅いっぱいに（大きく見せる） */
body.template-search #custom-grid .card__media img{
  width:100% !important;
  height:auto !important;
  object-fit:cover; /* 全面で見せたい: cover / 全体を収めたい: contain */
}

/* ギャップはテーマ変数に追従 */
@media (min-width: 990px){
  body.template-search #custom-grid{
    column-gap: var(--grid-desktop-horizontal-spacing);
    row-gap: var(--grid-desktop-vertical-spacing);
  }
}
@media (max-width: 989px){
  body.template-search #custom-grid{
    column-gap: var(--grid-mobile-horizontal-spacing);
    row-gap: var(--grid-mobile-vertical-spacing);
  }
}

/* /search の #custom-grid を強制 2 / 4 カラムに */
@media (max-width: 749px){
  body.template-search #custom-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px}
  body.template-search #custom-grid > *{width:auto !important;max-width:none !important;flex:0 0 auto !important}
}
@media (min-width: 750px){
  body.template-search #custom-grid{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:var(--grid-desktop-horizontal-spacing)}
  body.template-search #custom-grid > *{width:auto !important;max-width:none !important;flex:0 0 auto !important}
}

/* =========================
   Search results grid - PC用の幅制御
   ========================= */
@media (min-width: 990px){
  body.template-search #custom-grid {
    max-width: 1200px;   /* Dawn標準の横幅に制限 */
    margin: 0 auto;      /* 中央寄せ */
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--grid-desktop-horizontal-spacing);
  }
}

/* ===== Search: wrapper とグリッドの幅制限 ===== */

/* .page-width を付けた独自ラッパーに Dawn の幅制限を適用 */
body.template-search .kf-custom-grid-wrap.page-width{
  max-width: var(--page-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-width-margin);
  padding-right: var(--page-width-margin);
}

/* グリッドは左寄せ（2件でも左に寄る） */
body.template-search #custom-grid{
  justify-content: flex-start;
  column-gap: var(--grid-desktop-horizontal-spacing);
  row-gap: var(--grid-desktop-vertical-spacing);
}

/* モバイルのギャップはテーマ変数に追従 */
@media (max-width: 989px){
  body.template-search #custom-grid{
    column-gap: var(--grid-mobile-horizontal-spacing);
    row-gap: var(--grid-mobile-vertical-spacing);
  }
}

/* 画像はカード幅いっぱいに（必要なら contain に変更可） */
body.template-search #custom-grid .card__media img{
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
}

/* ===== Hide Dawn predictive dropdown ONLY in the header ===== */
header predictive-search,
header [data-predictive-search],
header .predictive-search,
header .predictive-search__results,
header #predictive-search-results,
header #predictive-search-results-groups-wrapper,
header [id^="predictive-search-results-"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

/* === おすすめ（You may also like）カードのタイトルを太字＋大きく === */
/* Dawn は .card__heading や .card-information__text.h4 に強い指定があるため
   ここではセレクタを深く＆!important で確実に上書き */
.product-recommendations .grid__item .card-wrapper .card__heading,
.product-recommendations .grid__item .card-wrapper .card__heading .full-unstyled-link,
.product-recommendations .grid__item .card-wrapper .card-information__text.h4,
.product-recommendations .grid__item .card-wrapper .card-information__text.h4 .full-unstyled-link {
  font-weight: 700 !important;                       /* 太字 */
  font-size: clamp(1.6rem, 1.2vw + 1rem, 1.9rem) !important; /* 検索ページ相当のサイズ感 */
  line-height: 1.35 !important;
  color: #111827 !important;                         /* 濃いグレー */
  display: block !important;                         /* 複数行でも安定 */
  margin-bottom: 4px !important;
}

/* 文字が潰れて見えないように、タイトルの余白＆折返しも調整（任意） */
.product-recommendations .card__heading {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* ===== You may also like：カードタイトルを検索ページと同じトーンに ===== */
/* product-recommendations 要素配下だけを太字＋少し大きく */
product-recommendations .card__heading,
product-recommendations .card__heading .full-unstyled-link,
#product-recommendations .card__heading,
#product-recommendations .card__heading .full-unstyled-link,
product-recommendations .h5.card__heading,
#product-recommendations .h5.card__heading {
  font-weight: 700 !important;                           /* 太字 */
  font-size: clamp(1.6rem, 1.2vw + 1rem, 1.9rem) !important; /* 検索ページ相当 */
  line-height: 1.35 !important;
  color: #111827 !important;
  display: block !important;
  margin-bottom: 4px !important;
}

/* 文字の折返しを許可（任意） */
product-recommendations .card__heading {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#PS_PORTAL_PANEL .ps-title {
  font-size: 1.5rem !important;  /* ← 強制 */
  font-weight: 700 !important;   /* ← 太字も確実に */
  line-height: 1.4 !important;
  color: #000 !important;
}

/* 商品ページタイトルを左寄せ */
.product__title,
.product__title h1,
.kf-title {
  text-align: left !important;
  justify-content: flex-start !important;
}

/* CloudFront画像のレスポンシブ最適化 */
.product__media-wrapper img {
  max-width: 100%;
  height: auto !important;
  object-fit: contain !important;
}
.product__media-wrapper picture {
  display: block;
  width: 100%;
}

/* モバイルで画像をタイトルより上に */
@media (max-width: 749px) {
  .product .product__media-wrapper { order: -1; }
  .product .product__info-wrapper  { order: 0; }
}
