/*
Theme Name: Welcart Basic Child
Template: welcart_basic
Description: shaddy-hataya.com ギフト専門店 子テーマ（全面リデザイン v2／老舗ギフト商家×エディトリアル）
Version: 0.2.1
*/

/* =========================================================
   (1) CSS変数（パレット・タイポ）
   アートディレクション = 老舗ギフト商家 × エディトリアル
   生成り中立を死守（D1）。朱は慶事カード内のみ（D3）。
   ========================================================= */
:root {
  /* --- パレット（生成り中立／指令準拠） --- */
  --c-base:          #FAF8F5;  /* 全体地・生成り */
  --c-paper:         #FFFDFA;  /* カード地・やや温かい白 */
  --c-warm:          #F1EADD;  /* 温かいベージュ帯（電話バー/実店舗/CTA帯＝旧ダーク帯の置換） */
  --c-warm-line:     #E0D5C2;  /* 温かい帯の罫 */
  --c-ink:           #2C2722;  /* 構造・本文濃（冷たい鉄紺→温かい墨茶へ。慶事も弔事も中立に） */
  --c-text:          #3A352E;  /* 本文（温かい消炭） */
  --c-gold:          #B59A6D;  /* 金茶＝ヘアライン/シール/小アクセントのみ */
  --c-gold-deep:     #9A8055;  /* 金茶の濃（テキストAA確保用） */

  --c-celebrate:     #C04A3B;  /* 慶事＝華やかな朱赤 */
  --c-celebrate-deep:#963327;
  --c-celebrate-tint:#FAF0EE;  /* 慶事の淡（カード地・チップ地） */

  --c-condole:       #4E5D6C;  /* 弔事＝藍鼠（スレートブルー） */
  --c-condole-deep:  #3A4754;
  --c-condole-tint:  #F0F3F6;  /* 弔事の淡 */

  --c-line:          #E6DFD4;  /* 罫 */
  --c-muted:         #6A6A6C;  /* 補助テキスト */

  /* --- タイポ（実Webフォント＋フォールバック） --- */
  --font-serif: "Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  --font-sans:  "Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;

  /* --- レイアウト --- */
  --maxw:   1160px;
  --radius: 3px;            /* 角丸＝控えめ */
  --shadow:        0 1px 4px rgba(30,37,48,.07);
  --shadow-hover:  0 6px 18px rgba(30,37,48,.12);

  /* --- 紙のグレイン（ごく微細なSVGノイズ／やりすぎ厳禁） --- */
  --paper-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
}

/* =========================================================
   (2) ベース（モバイルファースト・崩れ防止）
   ========================================================= */
* { box-sizing: border-box; }

body.welcart-child,
.welcart-child {
  margin: 0;
  background-color: var(--c-base);
  background-image: var(--paper-grain);   /* 紙のグレインを地に重ねる */
  color: var(--c-text);
  font-family: var(--font-sans);
  font-size: 17px;        /* シニア配慮：本文17px */
  line-height: 1.85;      /* 行間1.85 */
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;     /* 横スクロール防止 */
  word-break: normal;
  overflow-wrap: normal;  /* 不自然な改行を避ける（D4） */
}

.welcart-child img { max-width: 100%; height: auto; display: block; }

.welcart-child a { color: var(--c-ink); text-decoration: none; }
.welcart-child a:hover { text-decoration: underline; }

/* 見出しは明朝（格調） */
.welcart-child h1,
.welcart-child h2,
.welcart-child h3,
.welcart-child .font-serif {
  font-family: var(--font-serif);
  font-weight: 600;
  color: var(--c-ink);
  letter-spacing: .03em;
  line-height: 1.5;
  word-break: keep-all;   /* 見出しの不自然な改行を抑止（D4） */
}

/* レイアウトラッパ（相対幅・固定px幅禁止） */
.ec-container {
  width: 100%;
  max-width: var(--maxw);
  margin-left: auto;
  margin-right: auto;
  padding-left: 22px;
  padding-right: 22px;
}

/* セクション共通の縦リズム */
.ec-section { padding: 52px 0; }
.ec-section--tight { padding: 34px 0; }

/* セクション見出し（金茶の控えめ下線つき・エディトリアル） */
.ec-sec-head { text-align: center; margin: 0 0 32px; }
.ec-sec-head h2 {
  font-size: 1.6rem;
  margin: 0 0 12px;
}
.ec-sec-head .ec-sec-lead {
  margin: 0;
  font-size: .98rem;
  color: var(--c-muted);
}
.ec-sec-head h2::after {
  content: "";
  display: block;
  width: 52px;
  height: 2px;
  margin: 14px auto 0;
  background: var(--c-gold);
}

/* =========================================================
   (3) 水引モチーフ ディバイダ（慶弔の前後を中心に）
   金茶ヘアライン＋結びのSVG。装飾は decorative（aria-hidden運用）。
   ========================================================= */
.ec-mizuhiki {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0 auto;
  max-width: var(--maxw);
  padding: 6px 22px;
  color: var(--c-gold);
}
.ec-mizuhiki::before,
.ec-mizuhiki::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-gold) 40%, var(--c-gold) 60%, transparent);
  opacity: .7;
}
.ec-mizuhiki svg { display: block; flex: 0 0 auto; }

/* =========================================================
   (4) ボタン（タップ44px+・上品な微リフト）
   ========================================================= */
.ec-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 50px;
  padding: 13px 28px;
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, transform .12s ease, box-shadow .18s ease;
}
.ec-btn:hover { text-decoration: none; transform: translateY(-1px); box-shadow: var(--shadow); }
.welcart-child a.ec-btn--celebrate,
.ec-btn--celebrate { background: var(--c-celebrate); color: #fff; }
.welcart-child a.ec-btn--celebrate:hover,
.ec-btn--celebrate:hover { background: var(--c-celebrate-deep); color: #fff; }

.welcart-child a.ec-btn--condole,
.ec-btn--condole { background: var(--c-condole); color: #fff; }
.welcart-child a.ec-btn--condole:hover,
.ec-btn--condole:hover { background: var(--c-condole-deep); color: #fff; }

.welcart-child a.ec-btn--ink,
.ec-btn--ink { background: var(--c-ink); color: #fff; }
.welcart-child a.ec-btn--ink:hover,
.ec-btn--ink:hover { background: #2a3340; color: #fff; }
.ec-btn--ghost {
  background: transparent;
  color: var(--c-ink);
  border-color: var(--c-ink);
}
.ec-btn--ghost:hover { background: var(--c-ink); color: #fff; }

/* 画像プレースホルダ（生成り無地＋ラベル） */
.ec-imgph {
  background:
    repeating-linear-gradient(135deg, rgba(181,154,109,.05) 0 14px, transparent 14px 28px),
    #EFEAE2;
  border: 1px dashed #CFC6B6;
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #9A9082;
  font-size: .82rem;
  letter-spacing: .04em;
  min-height: 170px;
  padding: 14px;
}
.ec-imgph--hero { min-height: 340px; }
.ec-imgph--wide { aspect-ratio: 16 / 9; }
.ec-imgph--square { aspect-ratio: 1 / 1; }

/* 用語の小注（D6：満中陰志＝… など） */
.ec-term {
  border-bottom: 1px dotted var(--c-gold-deep);
  cursor: help;
}
.ec-note {
  display: block;
  font-size: .78rem;
  font-weight: 400;
  color: var(--c-muted);
  font-family: var(--font-sans);
  line-height: 1.6;
  margin-top: 2px;
}

/* =========================================================
   (5) §3-1 ユーティリティ／電話相談バー（D5：窓口とわかるボタン状）
   ========================================================= */
.ec-utility {
  background: var(--c-warm);
  color: var(--c-text);
  border-bottom: 1px solid var(--c-warm-line);
}
.ec-utility .ec-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 18px;
  padding-top: 11px;
  padding-bottom: 11px;
  text-align: center;
}
.ec-utility__label {
  color: var(--c-gold-deep);
  font-weight: 700;
  font-size: .95rem;
  letter-spacing: .04em;
}
.ec-utility__tel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ec-utility__tel a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 18px;
  border-radius: 999px;
  background: var(--c-gold);
  color: var(--c-ink);
  font-family: var(--font-serif);
  font-size: 1.25rem;          /* D5：18px超 */
  font-weight: 700;
  white-space: nowrap;
  letter-spacing: .02em;
  transition: background-color .18s ease, transform .12s ease;
}
.ec-utility__tel a:hover { background: #c7ad80; transform: translateY(-1px); text-decoration: none; }
.ec-utility__tel .ec-tel-ico { font-size: 1.15rem; line-height: 1; }
.ec-utility__hours { color: var(--c-muted); font-size: .85rem; }

/* =========================================================
   (6) §4 ヘッダ化粧（#masthead.site-header）安定セレクタ
   ========================================================= */
#masthead.site-header {
  background: var(--c-base) !important;
  border-bottom: 1px solid var(--c-line) !important;
}
#masthead.site-header .inner {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: var(--maxw) !important;
  margin: 0 auto !important;
  padding: 16px 22px !important;
  float: none !important;
}
#masthead.site-header .site-title {
  font-family: var(--font-serif) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  margin: 0 !important;
  float: none !important;
  text-align: left !important;
  width: auto !important;
}
#masthead.site-header .site-title a {
  font-family: var(--font-serif) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  letter-spacing: .05em !important;
  display: inline-block !important;
}
#masthead.site-header .site-title a:hover { text-decoration: none !important; color: var(--c-gold-deep) !important; }
#masthead.site-header .site-description:empty { display: none !important; }
#masthead.site-header .header-right,
#masthead.site-header .snav {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  float: none !important;
  position: static !important;
  margin: 0 !important;
  width: auto !important;
}
#masthead.site-header .search-box {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  border: 1px solid var(--c-line) !important;
  border-radius: var(--radius) !important;
  background: #fff !important;
  overflow: hidden !important;
  padding-left: 10px !important;
  width: auto !important;
  max-width: 320px !important;
  float: none !important;
}
#masthead.site-header .search-box .fa { color: var(--c-muted) !important; }
#masthead.site-header .search-box .s-box { display: flex !important; align-items: center !important; width: 100% !important; }
#masthead.site-header .search-box input[type="text"],
#masthead.site-header .search-box input[type="search"],
#masthead.site-header .search-box .search-text {
  border: 0 !important;
  outline: none !important;
  padding: 10px 12px !important;
  font-size: .95rem !important;
  min-height: 44px !important;
  background: transparent !important;
  width: 100% !important;
  max-width: 220px !important;
}
#masthead.site-header .search-box button,
#masthead.site-header .search-box input[type="submit"],
#masthead.site-header .search-box .searchsubmit {
  border: 0 !important;
  background: var(--c-ink) !important;
  color: #fff !important;
  min-height: 44px !important;
  padding: 0 14px !important;
  cursor: pointer !important;
  font-family: "FontAwesome", var(--font-sans) !important;
}
#masthead.site-header .membership {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: .9rem !important;
  position: static !important;
  float: none !important;
  width: auto !important;
}
#masthead.site-header .membership ul { list-style: none !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 12px !important; margin: 0 !important; padding: 0 !important; }
#masthead.site-header .membership a { color: var(--c-ink) !important; }
#masthead.site-header .snav .incart-btn {
  position: static !important;
  float: none !important;
  margin: 0 !important;
}
#masthead.site-header .snav .incart-btn a { display: inline-flex !important; align-items: center !important; gap: 6px !important; color: var(--c-ink) !important; }

/* グローバルナビ */
#masthead.site-header .main-navigation ul {
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px 24px !important;
  margin: 0 !important;
  padding: 0 22px 12px !important;
  justify-content: center !important;
}
#masthead.site-header .main-navigation a {
  display: inline-block !important;
  padding: 8px 4px !important;
  font-size: .95rem !important;
  color: var(--c-ink) !important;
}

/* 親テーマのデフォルトヘッダー画像を非表示にする（D5/D8） */
.main-image {
  display: none !important;
}

/* グローバルナビ */
#masthead.site-header .main-navigation ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 24px;
  margin: 0;
  padding: 0 22px 12px;
  justify-content: center;
}
#masthead.site-header .main-navigation a {
  display: inline-block;
  padding: 8px 4px;
  font-size: .95rem;
  color: var(--c-ink);
}

/* =========================================================
   (7) §3-2 ヒーロー（D8：中立・専門店の丁寧さ）
   ========================================================= */
.ec-hero {
  background:
    radial-gradient(120% 90% at 80% 0%, rgba(181,154,109,.06), transparent 60%),
    var(--c-base);
}
.ec-hero__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
  align-items: center;
}
.ec-hero__eyebrow {
  font-family: var(--font-sans);
  font-size: .82rem;
  letter-spacing: .28em;
  color: var(--c-gold-deep);
  text-transform: uppercase;
  margin: 0 0 14px;
}
.ec-hero__copy { text-align: center; }
.ec-hero__title {
  font-size: clamp(1.25rem, 4.6vw, 2.45rem); /* 画面幅で可変＝ブランド行を1行に収める */
  margin: 0 0 16px;
  line-height: 1.5;
}
.ec-hero__title .ec-hero__br { display: inline; }   /* レスポンシブ改行制御（D4） */
.ec-hero__title .ec-hero__brand { white-space: nowrap; } /* "シャディ ホームハタヤのギフト"を空白で割らない */
.ec-hero__lead {
  font-size: 1.08rem;
  color: #4A4A4C;
  margin: 0 0 28px;
}
.ec-hero__cta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.ec-hero__cta .ec-btn { width: 100%; max-width: 340px; }

/* =========================================================
   (8) §3-3 慶弔2大入口（最重要・D2 二重符号化）
   ========================================================= */
.ec-gateways__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
.ec-gateway {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  border-top: 4px solid var(--c-line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: box-shadow .18s ease, transform .12s ease;
}
.ec-gateway:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.ec-gateway--celebrate { border-top-color: var(--c-celebrate); }
.ec-gateway--condole  { border-top-color: var(--c-condole); }
/* D2：左の縦帯でも弁別（色だけに頼らない補強） */
.ec-gateway::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 5px;
}
.ec-gateway--celebrate::before { background: var(--c-celebrate); }
.ec-gateway--condole::before  { background: var(--c-condole); }

.ec-gateway__media .ec-imgph { border: 0; border-radius: 0; min-height: 160px; }
.ec-gateway--celebrate .ec-gateway__media .ec-imgph { background: var(--c-celebrate-tint); color: #A86F67; }
.ec-gateway--condole  .ec-gateway__media .ec-imgph { background: var(--c-condole-tint);  color: #6C727C; }

.ec-gateway__body { padding: 24px 24px 28px; }
.ec-gateway__title {
  font-size: 1.4rem;
  margin: 0 0 8px;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
}
/* D2：アイコン（慶事＝梅／弔事＝結び切り）で二重符号化 */
.ec-gateway__icon {
  flex: 0 0 auto;
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  align-self: center;
}
.ec-gateway--celebrate .ec-gateway__title { color: var(--c-celebrate); }
.ec-gateway--condole  .ec-gateway__title { color: var(--c-condole); }
.ec-gateway__title small {
  font-size: .78rem;
  color: #8A8A8C;
  font-family: var(--font-sans);
  letter-spacing: .18em;
}
.ec-gateway__desc { margin: 0 0 18px; font-size: .98rem; color: #50504F; }
.ec-gateway__tags {
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ec-gateway__tags li a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: .9rem;
  line-height: 1.4;
  border: 1px solid var(--c-line);
  background: var(--c-base);
}
.ec-gateway--celebrate .ec-gateway__tags li a { border-color: #E2C7C2; color: var(--c-celebrate-deep); }
.ec-gateway--condole  .ec-gateway__tags li a { border-color: #D2D6DC; color: var(--c-condole-deep); }
.ec-gateway__tags li a:hover { text-decoration: none; }
.ec-gateway--celebrate .ec-gateway__tags li a:hover { background: var(--c-celebrate-tint); }
.ec-gateway--condole  .ec-gateway__tags li a:hover { background: var(--c-condole-tint); }
.ec-gateway .ec-btn { width: 100%; }

/* =========================================================
   (9) §3-4 マナー安心ナビ（4枚）
   ========================================================= */
.ec-manner { background: var(--c-paper); }
.ec-manner__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.ec-manner__card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 26px 20px;
  text-align: center;
  background: var(--c-base);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  color: var(--c-ink);
  min-height: 44px;
  transition: box-shadow .18s ease, transform .12s ease;
}
.ec-manner__card:hover { text-decoration: none; box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.ec-manner__icon {
  width: 46px; height: 46px;
  margin: 0 auto 4px;
  border-radius: 50%;
  border: 1px solid var(--c-gold);
  display: flex; align-items: center; justify-content: center;
  color: var(--c-gold-deep);
  font-size: 1.2rem;
}
.ec-manner__card h3 { font-size: 1.1rem; margin: 0; }
.ec-manner__card p { margin: 0; font-size: .88rem; color: var(--c-muted); line-height: 1.75; }

/* =========================================================
   (10) §3-5 シーン／用途から探す（チップ群・慶弔色分け＋ラベル）
   ========================================================= */
.ec-scenes__group { margin-bottom: 30px; }
.ec-scenes__group:last-child { margin-bottom: 0; }
.ec-scenes__grouphead {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-serif);
  font-size: 1.18rem;
  margin: 0 0 16px;
}
.ec-scenes__grouphead::before {
  content: "";
  width: 12px; height: 12px; border-radius: 2px;
  display: inline-block;
  flex: 0 0 auto;
}
.ec-scenes__group--celebrate .ec-scenes__grouphead { color: var(--c-celebrate); }
.ec-scenes__group--celebrate .ec-scenes__grouphead::before { background: var(--c-celebrate); }
.ec-scenes__group--condole  .ec-scenes__grouphead { color: var(--c-condole); }
.ec-scenes__group--condole  .ec-scenes__grouphead::before { background: var(--c-condole); }
.ec-chips {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ec-chips li a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 16px;
  border-radius: var(--radius);
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  font-size: .94rem;
  color: var(--c-text);
}
.ec-chips li a:hover { text-decoration: none; }
.ec-scenes__group--celebrate .ec-chips li a { border-left: 3px solid var(--c-celebrate); }
.ec-scenes__group--celebrate .ec-chips li a:hover { background: var(--c-celebrate-tint); }
.ec-scenes__group--condole  .ec-chips li a { border-left: 3px solid var(--c-condole); }
.ec-scenes__group--condole  .ec-chips li a:hover { background: var(--c-condole-tint); }

/* =========================================================
   (11) §3-6 商品ジャンルから探す（カテゴリ自動列挙）
   ========================================================= */
.ec-genres { background: var(--c-paper); }
.ec-genres__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.ec-genres__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 16px;
  min-height: 58px;
  background: var(--c-base);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  color: var(--c-ink);
  font-size: .96rem;
  transition: box-shadow .18s ease, border-color .18s ease;
}
.ec-genres__item:hover { text-decoration: none; box-shadow: var(--shadow); border-color: var(--c-gold); }
.ec-genres__item::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c-gold);
  flex: 0 0 auto;
}

/* =========================================================
   (12) §3-7 おすすめ／新着商品グリッド
   Welcart安定セレクタ：.front-il / article[id^="post-"]
     .itemimg / .itemname / .itemprice / .incart-btn
   D3：商品グリッドは中立配色。価格は鉄紺。朱を使わない。
   ========================================================= */
.front-il {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);   /* モバイル2列 */
  gap: 16px;
}

/* 商品カード（li / article どちらでも当たるよう両指定） */
.front-il > li,
.front-il article[id^="post-"],
article[id^="post-"].ec-item {
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .18s ease, transform .12s ease;
}
.front-il > li { background: transparent; border: 0; box-shadow: none; }  /* li内のarticleに装飾を集約 */
.front-il > li:hover,
.front-il article[id^="post-"]:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-2px);
}

/* 商品画像 */
.front-il .itemimg,
article[id^="post-"] .itemimg {
  display: block;
  width: 100%;
  margin: 0;
  background: #EFEAE2;
}
.front-il .itemimg img,
article[id^="post-"] .itemimg img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

/* 商品名（可読ゴシック） */
.front-il .itemname,
article[id^="post-"] .itemname {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.65;
  color: var(--c-ink);
  margin: 0;
  padding: 14px 16px 4px;
}
.front-il .itemname a,
article[id^="post-"] .itemname a { color: inherit; }

/* 価格（D3：朱でなく鉄紺／中立） */
.front-il .itemprice,
article[id^="post-"] .itemprice {
  font-family: var(--font-sans);
  color: var(--c-ink);
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  padding: 0 16px 14px;
}
.front-il .itemprice .tax,
article[id^="post-"] .itemprice .tax {
  font-size: .74rem;
  font-weight: 400;
  color: #8A8A8C;
  margin-left: 4px;
}

/* 「詳しく見る／のし・包装を選ぶ」（D3：上品なゴーストボタン・朱を使わない） */
.front-il .incart-btn,
article[id^="post-"] .incart-btn {
  margin: auto 14px 16px;
}
.front-il .incart-btn a,
.front-il .incart-btn .ec-item-more,
article[id^="post-"] .incart-btn a,
article[id^="post-"] .incart-btn .ec-item-more {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  width: 100%;
  min-height: 48px;
  padding: 9px 12px;
  border: 1px solid var(--c-ink);
  border-radius: var(--radius);
  background: transparent;
  color: var(--c-ink);
  font-family: var(--font-sans);
  font-size: .96rem;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease;
}
.front-il .incart-btn a small,
article[id^="post-"] .incart-btn a small {
  font-size: .72rem;
  font-weight: 400;
  color: var(--c-muted);
}
.front-il .incart-btn a:hover,
.front-il .incart-btn .ec-item-more:hover,
article[id^="post-"] .incart-btn a:hover,
article[id^="post-"] .incart-btn .ec-item-more:hover {
  background: var(--c-ink);
  color: #fff;
  text-decoration: none;
}
.front-il .incart-btn a:hover small,
article[id^="post-"] .incart-btn a:hover small { color: #D9D4CB; }

.ec-items-empty {
  text-align: center;
  color: var(--c-muted);
  padding: 24px 0;
}

/* =========================================================
   (13) §3-8 のし・包装の実例
   ========================================================= */
.ec-wrapping { background: var(--c-paper); }
.ec-wrapping__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
.ec-wrapping__note {
  margin-top: 22px;
  padding: 16px 20px;
  background: var(--c-base);
  border: 1px solid var(--c-gold);
  border-radius: var(--radius);
  font-size: .96rem;
  text-align: center;
}
.ec-wrapping__note strong { color: var(--c-ink); }

/* =========================================================
   (14) §3-9 お客様の声
   ========================================================= */
.ec-voices__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.ec-voice {
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px 22px;
}
.ec-voice__stars { color: var(--c-gold); font-size: .98rem; letter-spacing: 2px; margin-bottom: 8px; }
.ec-voice__text { margin: 0 0 12px; font-size: .96rem; color: #4A4A4C; }
.ec-voice__meta { margin: 0; font-size: .84rem; color: #8A8A8C; }

/* =========================================================
   (15) §3-10 実店舗情報
   ========================================================= */
.ec-store { background: var(--c-warm); color: var(--c-text); }
.ec-store .ec-sec-head h2 { color: var(--c-ink); }
.ec-store .ec-sec-head .ec-sec-lead { color: var(--c-muted); }
.ec-store .ec-sec-head h2::after { background: var(--c-gold); }
.ec-store__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
}
.ec-store__info dl { margin: 0; }
.ec-store__info dt {
  font-family: var(--font-serif);
  color: var(--c-gold-deep);
  font-size: .92rem;
  margin-top: 16px;
}
.ec-store__info dt:first-child { margin-top: 0; }
.ec-store__info dd { margin: 2px 0 0; font-size: 1.02rem; color: var(--c-text); }
.ec-store__info dd a { color: var(--c-ink); text-decoration: underline; }
/* D5：店舗ブロックにも電話CTA再掲 */
.ec-store__tel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  min-height: 50px;
  padding: 10px 22px;
  border-radius: 999px;
  background: var(--c-gold);
  color: var(--c-ink);
  font-family: var(--font-serif);
  font-size: 1.2rem;
  font-weight: 700;
}
.ec-store__tel:hover { background: #c7ad80; text-decoration: none; transform: translateY(-1px); }
.ec-store__map .ec-imgph { background: var(--c-base); border-color: var(--c-warm-line); color: var(--c-muted); min-height: 230px; }

/* =========================================================
   (16) §3-11 料金まとめバナー（D7：送料目安一言を併記）
   ========================================================= */
.ec-policy { background: var(--c-base); }
.ec-policy__inner {
  border: 1px solid var(--c-gold);
  border-radius: var(--radius);
  background: var(--c-paper);
  padding: 30px 24px;
  text-align: center;
}
.ec-policy__title {
  font-family: var(--font-serif);
  font-size: 1.28rem;
  color: var(--c-ink);
  margin: 0 0 22px;
}
.ec-policy__items {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.ec-policy__item {
  padding: 18px 16px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: var(--c-base);
}
.ec-policy__item .ec-policy__free {
  display: block;
  font-family: var(--font-serif);
  font-size: 1.1rem;
  color: var(--c-ink);
  margin-bottom: 4px;
}
.ec-policy__item .ec-policy__cond {
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--c-ink);
}
.ec-policy__item .ec-policy__unit { font-size: .92rem; font-weight: 400; color: var(--c-muted); }
.ec-policy__note {
  margin: 18px 0 0;
  font-size: .86rem;
  color: var(--c-muted);
}

/* =========================================================
   (17) フッタ化粧（＋D5 フッタ電話CTA）
   ========================================================= */
.ec-footer {
  background: var(--c-ink);
  color: #C7C2B8;
  padding: 34px 0;
  font-size: .86rem;
  text-align: center;
  border-top: 3px solid var(--c-gold);
}
.ec-footer a { color: #EDE8DF; }
.ec-footcta {
  background: var(--c-warm);
  color: var(--c-text);
  padding: 30px 0;
  text-align: center;
  border-top: 1px solid var(--c-warm-line);
}
.ec-footcta__lead { margin: 0 0 14px; font-family: var(--font-serif); font-size: 1.15rem; color: var(--c-ink); }
.ec-footcta__tel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 12px 30px;
  border-radius: 999px;
  background: var(--c-gold);
  color: var(--c-ink);
  font-family: var(--font-serif);
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: .02em;
}
.ec-footcta__tel:hover { background: #c7ad80; text-decoration: none; transform: translateY(-1px); }
.ec-footcta__hours { margin: 12px 0 0; font-size: .85rem; color: var(--c-muted); }

/* =========================================================
   (18) §4 商品詳細ページ化粧（#itempage）安定セレクタ準拠
   ========================================================= */
#itempage {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
}
#itempage #img-box .itemimg {
  width: 100%;
  margin: 0;
  background: #EFEAE2;
  border-radius: var(--radius);
  overflow: hidden;
}
#itempage #img-box .itemimg img { width: 100%; height: auto; display: block; }
#itempage .item-info .itemname,
#itempage .item-info h1,
#itempage .item-info h2 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  color: var(--c-ink);
  margin: 0 0 14px;
  line-height: 1.5;
}

/* 価格・税表記（詳細は購入文脈なので朱で訴求） */
#itempage .field_price,
#itempage .itemprice {
  font-family: var(--font-sans);
  font-size: 1.55rem;
  font-weight: 700;
  color: var(--c-celebrate);
}
#itempage .field_price em.tax {
  font-style: normal;
  font-size: .78rem;
  font-weight: 400;
  color: #8A8A8C;
  margin-left: 6px;
}

/* カートフォーム */
#itempage .item-info > form[action$="/usces-cart/"] {
  margin-top: 18px;
  padding: 20px;
  background: var(--c-base);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
}
#itempage .skuform .skuname { font-weight: 600; color: var(--c-ink); margin-bottom: 10px; }

/* オプションセレクト */
#itempage dl.item-option { margin: 0 0 16px; }
#itempage dl.item-option dt {
  font-size: .92rem;
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: 6px;
}
#itempage dl.item-option dd { margin: 0 0 12px; }
#itempage dl.item-option select.iopt_select {
  width: 100%;
  min-height: 50px;
  padding: 10px 12px;
  font-size: 1rem;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: #fff;
  color: var(--c-text);
}

/* 数量 */
#itempage span.quantity { display: inline-flex; align-items: center; gap: 8px; margin: 8px 0 16px; }
#itempage span.quantity .skuquantity {
  width: 76px;
  min-height: 50px;
  padding: 8px 10px;
  font-size: 1rem;
  text-align: center;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
}

/* カゴへ（主要CTA・購入文脈なので朱） */
#itempage span.cart-button { display: block; }
#itempage span.cart-button .skubutton {
  display: block;
  width: 100%;
  min-height: 56px;
  padding: 15px 18px;
  border: 0;
  border-radius: var(--radius);
  background: var(--c-celebrate);
  color: #fff;
  font-family: var(--font-sans);
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .18s ease;
}
#itempage span.cart-button .skubutton:hover { background: var(--c-celebrate-deep); }

/* =========================================================
   (19) §4 サイドバー化粧（aside#secondary）
   ========================================================= */
aside#secondary { font-size: .95rem; }
aside#secondary .widget {
  background: var(--c-paper);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  padding: 18px 18px;
  margin-bottom: 18px;
}
aside#secondary .widget-title,
aside#secondary .widgettitle {
  font-family: var(--font-serif);
  font-size: 1.08rem;
  color: var(--c-ink);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-gold);
}
aside#secondary ul { list-style: none; margin: 0; padding: 0; }
aside#secondary li { border-bottom: 1px dotted var(--c-line); }
aside#secondary li:last-child { border-bottom: 0; }
aside#secondary li a {
  display: block;
  padding: 10px 4px;
  min-height: 44px;
  color: var(--c-text);
}
aside#secondary .widget_welcart_category li a:hover { color: var(--c-gold-deep); text-decoration: none; }

/* =========================================================
   (20) モーション（ロード時の静かなstaggeredフェードイン）
   prefers-reduced-motion を尊重。
   ========================================================= */
@keyframes ec-fade-up {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ec-reveal {
  opacity: 0;
  animation: ec-fade-up .7s cubic-bezier(.22,.61,.36,1) forwards;
}
.ec-reveal--1 { animation-delay: .05s; }
.ec-reveal--2 { animation-delay: .22s; }
.ec-reveal--3 { animation-delay: .40s; }

@media (prefers-reduced-motion: reduce) {
  .welcart-child *,
  .ec-reveal {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* =========================================================
   (21) ブレークポイント（600〜959：2カラム / 960+：多カラム）
   ========================================================= */
@media (min-width: 600px) {
  .ec-section { padding: 64px 0; }

  /* ヒーロー：写真＋コピーの横並び */
  .ec-hero__inner {
    grid-template-columns: 1.05fr .95fr;
    gap: 40px;
  }
  .ec-hero__copy { text-align: left; }
  .ec-hero__cta { flex-direction: row; align-items: stretch; justify-content: flex-start; }
  .ec-hero__cta .ec-btn { width: auto; max-width: none; flex: 1; }

  /* 慶弔入口：横2分割 */
  .ec-gateways__grid { grid-template-columns: 1fr 1fr; }

  /* マナー4枚：2列 */
  .ec-manner__grid { grid-template-columns: repeat(2, 1fr); }

  /* ジャンル：3列 */
  .ec-genres__grid { grid-template-columns: repeat(3, 1fr); }

  /* 商品グリッド：3列 */
  .front-il { grid-template-columns: repeat(3, 1fr); }

  /* のし実例：2列 */
  .ec-wrapping__grid { grid-template-columns: 1fr 1fr; }

  /* お客様の声：3列 */
  .ec-voices__grid { grid-template-columns: repeat(3, 1fr); }

  /* 料金：横並び2枠 */
  .ec-policy__items { grid-template-columns: 1fr 1fr; }

  /* 実店舗：情報＋地図2カラム */
  .ec-store__grid { grid-template-columns: .9fr 1.1fr; }

  /* 商品詳細：画像＋情報2カラム */
  #itempage { grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
}

@media (min-width: 960px) {
  .ec-manner__grid { grid-template-columns: repeat(4, 1fr); }
  .ec-genres__grid { grid-template-columns: repeat(4, 1fr); }
  .front-il { grid-template-columns: repeat(4, 1fr); }
}

/* =========================================================
   (22) §5 会員ページ・カートページ化粧（#memberpages, #cartpages）
   ========================================================= */

/* 共通コンテナ調整
   ⚠️実DOM: カートは #cartpages が無く #content.cart-page > article#wc_cart。
   会員は #content.member-page > #memberpages。両系統を中央寄せ・幅制限する。 */
#memberpages,
#cartpages,
.cart-page #wc_cart {
  max-width: 960px !important;
  margin: 40px auto !important;
  padding: 0 22px !important;
  color: var(--c-text) !important;
  box-sizing: border-box !important;
}

/* ページタイトル（明朝・格調）
   ⚠️実DOM: member_page_title / cart_page_title は #memberpages の外＝
   #content.member-page / #content.cart-page > article 直下にある。
   旧 #memberpages/#cartpages 子孫指定では当たらず見出しだけ左寄せになっていた。 */
.member-page .member_page_title,
.cart-page .cart_page_title,
#memberpages .member_page_title,
#cartpages .cart_page_title {
  font-family: var(--font-serif) !important;
  font-size: 1.8rem !important;
  color: var(--c-ink) !important;
  text-align: center !important;
  margin-bottom: 24px !important;
}
.member-page .member_page_title::after,
.cart-page .cart_page_title::after,
#memberpages .member_page_title::after,
#cartpages .cart_page_title::after {
  content: "" !important;
  display: block !important;
  width: 40px !important;
  height: 2px !important;
  background: var(--c-gold) !important;
  margin: 12px auto 0 !important;
}

/* フォーム上部・下部の説明テキスト調整（ダサいデカ文字の縮小） */
#memberpages .header_explanation,
#memberpages .header_explanation p,
#memberpages .footer_explanation,
#memberpages .footer_explanation p,
#memberpages > p,
#memberpages .entry-content p,
#cartpages > p,
#cartpages .entry-content p {
  font-size: 0.9rem !important;
  line-height: 1.7 !important;
  color: var(--c-muted) !important;
  margin-bottom: 24px !important;
}

/* ログインページのフォーム中央寄せ＆カード化（バランス調整） */
#memberpages .loginbox {
  max-width: 450px !important;
  margin: 0 auto 40px !important;
  background: var(--c-paper) !important;
  border: 1px solid var(--c-line) !important;
  border-radius: var(--radius) !important;
  padding: 34px !important;
  box-shadow: var(--shadow) !important;
}
#memberpages .loginbox .member-box,
#memberpages .loginbox .new-entry {
  width: 100% !important;
  float: none !important;
}
#memberpages .loginbox .new-entry {
  margin-top: 32px !important;
  padding-top: 24px !important;
  border-top: 1px dashed var(--c-line) !important;
}
#memberpages .loginbox .new-entry h2 {
  font-size: 1.15rem !important;
  margin-bottom: 12px !important;
}

/* 入力フォーム共通（テキストボックス、パスワード、セレクト） */
#memberpages input[type="text"],
#memberpages input[type="password"],
#memberpages input[type="email"],
#memberpages input[type="tel"],
#memberpages select,
#cartpages input[type="text"],
#cartpages input[type="number"],
#cartpages select {
  font-family: var(--font-sans) !important;
  font-size: 1rem !important;            /* シニア可読：16px以上（クロスレビュー反映） */
  color: var(--c-text) !important;
  border: 1px solid var(--c-line) !important;
  border-radius: var(--radius) !important;
  background: #fff !important;
  padding: 12px 14px !important;
  min-height: 48px !important;           /* タップ精度：44→48px */
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
#memberpages input[type="text"]:focus,
#memberpages input[type="password"]:focus,
#memberpages input[type="email"]:focus,
#memberpages input[type="tel"]:focus,
#memberpages select:focus,
#cartpages input[type="text"]:focus,
#cartpages input[type="number"]:focus,
#cartpages select:focus {
  border-color: var(--c-gold) !important;
  /* フォーカス可視を色変化のみ→影リングで明確化（WCAG 2.4.7） */
  box-shadow: 0 0 0 3px rgba(181, 154, 109, 0.35) !important;
}

/* テーブルスタイル（会員登録フォーム、カートテーブル） */
table.customer_form,
table.cart_table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin-bottom: 32px !important;
  border: 1px solid var(--c-line) !important;
}
table.customer_form th,
table.customer_form td,
table.cart_table th,
table.cart_table td {
  padding: 16px 14px !important;
  border-bottom: 1px solid var(--c-line) !important;
  font-size: 0.95rem !important;
}
table.customer_form th,
table.cart_table th {
  background: var(--c-warm) !important;
  color: var(--c-ink) !important;
  font-weight: 600 !important;
  text-align: left !important;
  width: 25% !important;
}

/* 会員登録フォーム：外側の補足・例示テキストの縮小・色薄化（入力ボックスと区別） */
table.customer_form td {
  color: var(--c-muted) !important;
  font-size: 0.9rem !important;          /* シニア可読：14.5→15.3px（クロスレビュー反映） */
  line-height: 1.6 !important;
}
table.customer_form td input,
table.customer_form td select,
table.customer_form td textarea {
  font-size: 1rem !important;            /* 16px以上 */
  color: var(--c-text) !important;
  margin-right: 8px !important;
}

/* カートテーブル調整（枠線・改行・在庫表示） */
table.cart_table {
  border: 1px solid var(--c-line) !important;
}
table.cart_table th,
table.cart_table td {
  border: 1px solid var(--c-line) !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important; /* 基本は改行を防ぐ（在庫あり幅不足対策） */
}
table.cart_table th:nth-child(2),
table.cart_table td:nth-child(2) {
  text-align: left !important;
  white-space: normal !important; /* 商品名だけは改行を許可 */
}

/* ボタン（主要CTA：朱赤） */
#memberpages input[type="submit"].member_login_button,
#memberpages input[type="submit"][value="送信する"],
#memberpages input[type="submit"].send,
#cartpages input[type="submit"].kouza,
#cartpages input[type="submit"][value*="次へ"],
#cartpages button[type="submit"].checkout_btn,
#cartpages input[type="submit"][value*="次へ進む"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 50px !important;
  padding: 12px 36px !important;
  background-color: var(--c-celebrate) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-sans) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background-color 0.18s ease !important;
  margin: 10px 0 !important;
  box-shadow: none !important;
}
#memberpages input[type="submit"].member_login_button:hover,
#memberpages input[type="submit"][value="送信する"]:hover,
#cartpages input[type="submit"].kouza:hover,
#cartpages input[type="submit"][value*="次へ"]:hover {
  background-color: var(--c-celebrate-deep) !important;
}

/* サブボタン（グレー/ベージュ系：住所検索、数量更新、買い物を続ける） */
#memberpages input.search-zipcode,
#cartpages input.upbutton,
#cartpages input.backbutton,
#cartpages input[type="submit"].backbutton,
#cartpages input[type="submit"][value*="続ける"],
#memberpages .button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 10px 22px !important;
  background-color: var(--c-warm) !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-warm-line) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-sans) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.18s ease, border-color 0.18s ease !important;
  box-shadow: none !important;
}
#memberpages input.search-zipcode:hover,
#cartpages input.upbutton:hover,
#cartpages input.backbutton:hover {
  background-color: var(--c-warm-line) !important;
}

/* 削除ボタンの縮小（カート内） */
#cartpages input.delbutton,
table.cart_table input[type="submit"].delbutton {
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 12px !important;
  font-size: 0.8rem !important;
  background-color: transparent !important;
  color: var(--c-muted) !important;
  border: 1px solid var(--c-line) !important;
  border-radius: var(--radius) !important;
  cursor: pointer !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  font-weight: 500 !important;
}
#cartpages input.delbutton:hover,
table.cart_table input[type="submit"].delbutton:hover {
  background-color: #fceceb !important;
  color: var(--c-celebrate) !important;
  border-color: #f7dcd9 !important;
}

/* カートページのステップ表示
   ⚠️実DOM: 実体は div.cart_navi > ul > li（li.current が現在地）。
   旧 .cart_step は存在せず、ステップが素のテキスト羅列に見えていた。 */
.cart_navi { margin-bottom: 28px !important; }
.cart_navi ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  border-bottom: 2px solid var(--c-line) !important;
}
.cart_navi li {
  padding: 10px 6px !important;
  font-size: 0.9rem !important;
  color: var(--c-muted) !important;
  flex: 1 1 0 !important;
  text-align: center !important;
  position: relative !important;
  white-space: nowrap !important;
  counter-increment: cartstep !important;
}
/* 番号付与（1〜4）で手順感を出す */
.cart_navi ul { counter-reset: cartstep !important; }
.cart_navi li::before {
  content: counter(cartstep) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: var(--c-line) !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  vertical-align: middle !important;
}
.cart_navi li.current {
  color: var(--c-celebrate) !important;
  font-weight: 700 !important;
}
.cart_navi li.current::before {
  background: var(--c-celebrate) !important;
}
.cart_navi li.current::after {
  content: "" !important;
  position: absolute !important;
  bottom: -2px !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background: var(--c-celebrate) !important;
}
@media (max-width: 580px) {
  .cart_navi li { font-size: 0.74rem !important; padding: 8px 2px !important; }
  .cart_navi li::before { width: 17px !important; height: 17px !important; margin-right: 3px !important; font-size: 0.64rem !important; }
}

/* フッターの文字色潰れを解消 */
#colophon,
footer.site-footer,
.site-footer {
  background-color: var(--c-ink) !important;
  color: #c8c9cc !important;
}
#colophon a,
footer.site-footer a,
.site-footer a,
.footer-menu a,
ul.footer-menu li a {
  color: #EDE8DF !important;   /* ⚠️実体は ul.footer-menu のリンク＝親テーマが #2C2722(ink) を当て暗背景で潰れていた */
}
#colophon a:hover,
footer.site-footer a:hover,
.site-footer a:hover,
.footer-menu a:hover,
ul.footer-menu li a:hover {
  color: var(--c-gold) !important;
  text-decoration: underline !important;
}
/* フッターメニューの並び・余白を整える（リンクが団子にならないよう） */
ul.footer-menu {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 10px 28px !important;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 8px 0 !important;
}
ul.footer-menu li { margin: 0 !important; }
#colophon .copy,
.site-footer .copyright,
.site-footer .copy {
  color: #9da0a5 !important;
}

/* =========================================================
   (23) モバイル：会員登録フォーム／カートテーブルの縦積み化
   2カラム(th 25%|td)のままだと390px幅で入力欄が潰れて窮屈なため、
   th を見出し帯・td をフル幅にスタックさせて指で押しやすくする。
   ========================================================= */
@media (max-width: 580px) {
  table.customer_form,
  table.customer_form tbody,
  table.customer_form tr {
    display: block !important;
    width: 100% !important;
  }
  table.customer_form th,
  table.customer_form td {
    display: block !important;
    width: 100% !important;
    border-bottom: 0 !important;
    padding: 10px 12px !important;
  }
  table.customer_form th {
    border-top: 1px solid var(--c-line) !important;
    padding-bottom: 4px !important;
  }
  table.customer_form td {
    padding-top: 4px !important;
    padding-bottom: 16px !important;
  }
  table.customer_form td input[type="text"],
  table.customer_form td input[type="email"],
  table.customer_form td input[type="tel"],
  table.customer_form td input[type="password"],
  table.customer_form td select {
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px 0 !important;
    box-sizing: border-box !important;
  }
  /* 姓名・フリガナ等の横並び2入力はそのまま（説明テキストは下に） */
  table.customer_form td .member_name,
  table.customer_form td .member_furigana {
    display: inline-block !important;
  }
}

/* =========================================================
   (24) クロスレビュー反映（シニアUX/ブランド/アクセシビリティ 3観点の統合）
   ========================================================= */

/* 新規入会導線をボタン化（初回客のCVR導線が弱いテキストリンクだった）。
   購入前の入口なので朱の「枠線」ボタン＝ログイン(塗り)と役割差をつける。 */
#memberpages .new-entry { text-align: center !important; }
#memberpages .new-entry h2 {
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 8px !important;
}
#memberpages .new-entry h2::after {  /* サブ見出しの短い金茶罫（見出し階層の統一） */
  content: "" !important;
  position: absolute !important;
  left: 50% !important; transform: translateX(-50%) !important;
  bottom: 0 !important; width: 28px !important; height: 2px !important;
  background: var(--c-gold) !important;
}
#memberpages .new-entry .nav a,
#memberpages .new-entry p.nav a,
#memberpages .new-entry a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  margin-top: 8px !important;
  padding: 12px 28px !important;
  border: 2px solid var(--c-celebrate) !important;
  border-radius: var(--radius) !important;
  color: var(--c-celebrate) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  text-decoration: none !important;
  background: #fff !important;
  transition: background-color .15s ease, color .15s ease !important;
}
#memberpages .new-entry .nav a:hover,
#memberpages .new-entry a:hover {
  background: var(--c-celebrate) !important;
  color: #fff !important;
}

/* 空カートの「買い物を続ける」だけ主CTAに格上げ（id=previouscart＝空カート時の input）。
   ⚠️非空カートの買い物を続けるは button.continue_shopping_button[name=previous]＝(25)で副ボタン。 */
.cart-page .no_cart { font-size: 1.05rem !important; margin: 8px 0 20px !important; }
input#previouscart.continue_shopping_button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 50px !important;
  padding: 12px 32px !important;
  background: var(--c-celebrate) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
input#previouscart.continue_shopping_button:hover { background: var(--c-celebrate-deep) !important; }

/* 削除ボタンのタップ領域を確保（30px→44px相当。視覚は控えめ・当たり判定は確保） */
#cartpages input.delbutton,
table.cart_table input[type="submit"].delbutton {
  min-height: 44px !important;
  height: auto !important;
  padding: 8px 16px !important;
  font-size: 0.88rem !important;
}

/* 必須マーク（functions.phpのJSで赤化済みの＊）を少し大きく＝視認性 */
table.customer_form th span[style*="C04A3B"] {
  font-size: 1.1em !important;
}

/* 「ログイン情報を記憶」等チェックボックスの拡大（ON/OFF誤操作の低減） */
#memberpages input[type="checkbox"] {
  width: 20px !important;
  height: 20px !important;
  transform: scale(1.15) !important;
  margin-right: 8px !important;
  vertical-align: middle !important;
  accent-color: var(--c-celebrate) !important;
}

/* カートステップの狭幅文字が小さすぎた件を緩和（12.6px→13.5px相当・現在地は折返し許可） */
@media (max-width: 580px) {
  .cart_navi ul { flex-wrap: wrap !important; }
  .cart_navi li { font-size: 0.8rem !important; padding: 8px 3px !important; }
}

/* フッターの巨大な空き帯を圧縮（内容比例の上下余白に。作りかけ感の解消）
   ⚠️実コンテナは nav#site-info.footer-navigation（padding 36/48px）。#colophonではない。 */
#colophon {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
nav#site-info.footer-navigation,
.footer-navigation {
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}

/* =========================================================
   (25) チェックアウト2巡目改修（ボタン中央寄せ・主従色・フォーム左揃え・エラー）
   実DOM: ボタンは div.send 内／前進=.to_*_button・戻る=.back_cart_button
   ・買い物継続=button.continue_shopping_button[name=previous]／エラー=div.error_message
   ========================================================= */

/* 入力フォームの左揃え（姓/名・セイ/メイ の接頭ラベル幅違いで入力欄がガタついていた）。
   member_name(姓/名)・member_furigana(セイ/メイ)を固定幅にして列を揃える。 */
table.customer_form td .member_name,
table.customer_form td .member_furigana {
  display: inline-block !important;
  width: 2.6em !important;
  text-align: left !important;
  margin-right: 6px !important;
  color: var(--c-muted) !important;
}

/* チェックアウトのボタン群＝中央寄せ＋余白（cart/customer/delivery/confirm 共通の div.send） */
#cartpages .send,
.cart-page .send,
#memberpages .send,
#wc_cart .send {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 28px 0 8px !important;
  text-align: center !important;
}

/* 前進＝主CTA（朱）: 次へ／会員ログイン／配送へ／会員登録しながら次へ／注文確定 */
#cartpages .send input.to_customerinfo_button,
#cartpages .send input.to_memberlogin_button,
#cartpages .send input.to_deliveryinfo_button,
#cartpages .send input.to_reganddeliveryinfo_button,
#cartpages .send input.to_confirm_button,
#cartpages .send input.purchase_button,
.cart-page .send input.to_customerinfo_button,
.cart-page .send input.to_memberlogin_button,
.cart-page .send input.to_deliveryinfo_button,
.cart-page .send input.to_reganddeliveryinfo_button,
.cart-page .send input.to_confirm_button,
.cart-page .send input.purchase_button,
.cart-page .send input[name="confirm"],
.cart-page .send input[name="customerinfo"],
.cart-page .send input[name="deliveryinfo"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 12px 40px !important;
  background: var(--c-celebrate) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-sans) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
#cartpages .send input.to_customerinfo_button:hover,
#cartpages .send input.to_memberlogin_button:hover,
#cartpages .send input.to_deliveryinfo_button:hover,
#cartpages .send input.to_reganddeliveryinfo_button:hover,
#cartpages .send input.purchase_button:hover,
.cart-page .send input[name="deliveryinfo"]:hover,
.cart-page .send input.to_reganddeliveryinfo_button:hover { background: var(--c-celebrate-deep) !important; }

/* 戻る・買い物を続ける＝副ボタン（温ベージュ） */
#cartpages .send input.back_cart_button,
#cartpages .send button.continue_shopping_button,
#cartpages .send input.backbutton,
.cart-page .send input.back_cart_button,
.cart-page .send button.continue_shopping_button,
.cart-page .send input[name="previous"],
.cart-page .send input[name="backCart"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 12px 28px !important;
  background: var(--c-warm) !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-warm-line) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-sans) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
#cartpages .send input.back_cart_button:hover,
#cartpages .send button.continue_shopping_button:hover,
.cart-page .send input.back_cart_button:hover { background: var(--c-warm-line) !important; }

/* エラー表示＝ブランドを崩さない朱系の控えめボックス（実体 div.error_message） */
.error_message,
#cartpages .error_message,
#memberpages .error_message {
  background: #FBF1EF !important;
  border: 1px solid #E3B8B0 !important;
  border-left: 4px solid var(--c-celebrate) !important;
  border-radius: var(--radius) !important;
  color: #8A3B30 !important;
  font-size: 0.95rem !important;
  line-height: 1.7 !important;
  padding: 12px 16px !important;
  margin: 0 0 20px !important;
}
.error_message:empty { display: none !important; }   /* 空のエラー枠は出さない */