@charset "UTF-8";

/* ==========================================================================
   水津 ECサイト カスタムCSS（FutureShop 上書き用）

   本ファイルの内容は、そのまま FutureShop 管理画面の
   カスタムCSSに貼り付ける「差分」として運用します。

   - 既存スタイルの参照は style.original.css を参照
   - ここには「新規追加」「上書き」したいルールのみを書きます
   ========================================================================== */

/* --------------------------------------------------------------------------
   商品詳細ページ内のバナー画像・YouTube埋め込みを画面幅内に収める
   - <p><img></p> で書かれた sp-message / sp-delifree / sp-deli 等は
     class が無く既存ルールが効かないため、ここで一括対応
   -------------------------------------------------------------------------- */
.fs-l-pageMain img,
.fs-l-pageMain iframe {
  max-width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   商品メイン画像カルーセル（スライドショー）の幅修正
   - 画像が容器を超えて 2倍 などに大きく表示されるのを防ぐ
   - SP の fs-c-productCarouselMainImage / slick で発生
   -------------------------------------------------------------------------- */
.fs-c-productCarouselMainImage,
.fs-c-productCarouselMainImage__carousel,
#fs_productCarouselMainImage {
  max-width: 100% !important;
  overflow: hidden !important;
}

.fs-c-productCarouselMainImage__image,
.fs-c-productCarouselMainImage .slick-slide,
.fs-c-productCarouselMainImage .slick-list,
.fs-c-productCarouselMainImage .slick-track {
  max-width: 100% !important;
  box-sizing: border-box;
}

.fs-c-productCarouselMainImage__image img,
.fs-c-productCarouselMainImage .slick-slide img,
.fs-c-productCarouselMainImage img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

/* slick未初期化時のフォールバック：1枚目のみ表示し、他は非表示 */
.fs-c-productCarouselMainImage__carousel:not(.slick-initialized) .fs-c-productCarouselMainImage__image:not(:first-child) {
  display: none;
}

/* ==========================================================================
   商品オプション（のし・水引・名入れ・紙袋・キャンペーン）UIの統一
   - .fs-c-productSelection（ドロップダウン群）
   - .fs-c-productOption（ラジオボタン）
   を、共通の「カード型」UIに揃える
   ========================================================================== */

/* dl ラッパーをリセット（カード化は dt/dd 単位で行う） */
.fs-c-productSelection,
.fs-c-productOption {
  margin: 16px 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
}

/* 見出し（dt）: 共通グラデーションヘッダー */
.fs-c-productSelection__name,
.fs-c-productOption__name {
  margin: 14px 0 0;
  padding: 12px 16px;
  background: linear-gradient(135deg, #6b1f2a 0%, #8b2c3a 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
  border-radius: 10px 10px 0 0;
}

.fs-c-productSelection__name:first-of-type,
.fs-c-productOption__name:first-of-type {
  margin-top: 0;
}

/* ラベル領域 */
.fs-c-productSelection__label,
.fs-c-productOption__label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: #fff;
}

/* 必須マーク（ピンク背景に「必須」の文字）
   HTMLは "(必須)" のままだが、font-size:0 で原文を消して
   ::before で「必須」を差し込む。
   FutureShop の fs_style.css は .fs-c-requiredMark に対し
     width: 1em; height: 1em; overflow: hidden; text-indent: -999px;
   を当てて「1em四方の小箱」に固定し、::before で "*" を表示する
   設計になっているため、これらを全て解除する必要がある。 */
.fs-c-productSelection__name .fs-c-requiredMark,
.fs-c-productOption__name .fs-c-requiredMark {
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  text-indent: 0 !important;
  padding: 2px 8px !important;
  background: #ec407a !important;
  color: #fff !important;
  font-size: 0 !important;
  font-weight: 700 !important;
  border-radius: 4px !important;
  line-height: 1.4 !important;
  letter-spacing: 0.05em !important;
  white-space: nowrap !important;
}

.fs-c-productSelection__name .fs-c-requiredMark::before,
.fs-c-productOption__name .fs-c-requiredMark::before {
  content: "必須" !important;
  display: inline-block !important;
  font-size: 11px !important;
  color: #fff !important;
  line-height: 1.4 !important;
}

/* 本体（dd）: カードボディ */
#fs_ProductDetails .fs-c-productSelection__selection,
.fs-c-productOption__option {
  margin: 0;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-top: none;
  border-radius: 0 0 10px 10px;
}

/* ドロップダウンを上品なスタイルに統一 */
#fs_ProductDetails .fs-c-productSelection .fs-c-dropdown {
  position: relative;
}

#fs_ProductDetails .fs-c-productSelection .fs-c-dropdown__menu {
  width: 100%;
  font-size: 15px;
  padding: 12px 40px 12px 14px;
  background-color: #fff;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236b1f2a' stroke-width='2' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
  border: 2px solid #e0e0e0;
  border-radius: 8px;
  color: #222;
  line-height: 1.5;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#fs_ProductDetails .fs-c-productSelection .fs-c-dropdown__menu:hover {
  border-color: #c5b0b5;
}

#fs_ProductDetails .fs-c-productSelection .fs-c-dropdown__menu:focus {
  outline: none;
  border-color: #6b1f2a;
  box-shadow: 0 0 0 3px rgba(107, 31, 42, 0.15);
}

/* オプションのコメント（豪華特典の説明文など） */
.fs-c-productOption__comment {
  margin-top: 12px;
  padding: 10px 12px;
  background: #fff7f0;
  border-left: 3px solid #d7a35a;
  font-size: 13px;
  line-height: 1.7;
  color: #555;
  border-radius: 4px;
}

/* ==========================================================================
   商品説明エリア（リッチコンテンツ）
   .fs-p-productDescription 内に独自のセクションを構築
   - クラス名 prefix: su-（Suishin の略）で名前空間を分離
   ========================================================================== */

.fs-p-productDescription {
  --su-wine: #6b1f2a;
  --su-wine-light: #8b2c3a;
  --su-cream: #f6efe3;
  --su-gold: #d7a35a;
  --su-pink: #f5d6e0;
  --su-pink-light: #fce5ec;
  --su-text: #333;
  --su-muted: #666;
  --su-border: #e8e1d6;
  color: var(--su-text);
  line-height: 1.8;
  font-feature-settings: "palt" 1;
}

/* 既存の <font><b> による装飾の影響を消す（ヒーロー以下を独自スタイルに） */
.fs-p-productDescription font {
  font-size: inherit;
  font-weight: inherit;
}

/* セクション共通 */
.fs-p-productDescription .su-section {
  margin: 48px 0;
}

.fs-p-productDescription .su-section__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0 0 24px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--su-wine);
  text-align: center;
}

.fs-p-productDescription .su-section__title::before,
.fs-p-productDescription .su-section__title::after {
  content: "";
  flex: 1;
  max-width: 60px;
  height: 1px;
  background: var(--su-gold);
}

.fs-p-productDescription .su-section__title small {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--su-muted);
  margin-top: 4px;
}

/* ---------- ヒーロー ---------- */
.fs-p-productDescription .su-hero {
  text-align: center;
  padding: 24px 16px 32px;
  background: linear-gradient(180deg, #fffaf0 0%, #fff 100%);
  border-radius: 12px;
}

.fs-p-productDescription .su-hero__copy {
  display: inline-block;
  margin: 0 0 12px;
  padding: 4px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--su-wine);
  border-radius: 999px;
  letter-spacing: 0.05em;
}

.fs-p-productDescription .su-hero__title {
  margin: 0 0 6px;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--su-wine);
  letter-spacing: 0.04em;
}

.fs-p-productDescription .su-hero__title span {
  color: var(--su-gold);
}

.fs-p-productDescription .su-hero__sub {
  margin: 0 0 16px;
  font-size: 13px;
  color: var(--su-muted);
}

.fs-p-productDescription .su-hero__lead {
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
  color: var(--su-text);
}

/* ---------- セット内容（カード） ---------- */
.fs-p-productDescription .su-set__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.fs-p-productDescription .su-card {
  background: #fff;
  border: 1px solid var(--su-border);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.fs-p-productDescription .su-card__title {
  margin: 0;
  padding: 8px 8px 9px;
  background: linear-gradient(135deg, var(--su-wine) 0%, var(--su-wine-light) 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.fs-p-productDescription .su-card__img {
  background: var(--su-cream);
}

.fs-p-productDescription .su-card__img img {
  display: block;
  width: 100%;
  height: auto;
}

.fs-p-productDescription .su-card__desc {
  padding: 14px 14px 6px;
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--su-text);
  flex-grow: 1;
}

.fs-p-productDescription .su-card__tag {
  display: inline-block;
  margin: 0 14px 14px;
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--su-wine);
  background: #fff;
  border: 1px solid var(--su-gold);
  border-radius: 4px;
  letter-spacing: 0.04em;
}

/* ---------- 母の日キャンペーン バナー ---------- */
.fs-p-productDescription .su-mothers {
  margin: 32px 0;
  padding: 24px 20px;
  background: linear-gradient(135deg, var(--su-pink-light) 0%, var(--su-pink) 100%);
  border-radius: 12px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.fs-p-productDescription .su-mothers__copy {
  margin-bottom: 20px;
}

.fs-p-productDescription .su-mothers__title {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  color: #b03a6a;
  letter-spacing: 0.06em;
}

.fs-p-productDescription .su-mothers__lead {
  margin: 0;
  font-size: 13px;
  line-height: 1.8;
  color: #6e3b50;
}

.fs-p-productDescription .su-mothers__features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.fs-p-productDescription .su-mothersFeature {
  background: #fff;
  border-radius: 10px;
  padding: 12px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(176, 58, 106, 0.08);
}

.fs-p-productDescription .su-mothersFeature img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
  margin-bottom: 8px;
}

.fs-p-productDescription .su-mothersFeature span {
  display: block;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #6e3b50;
}

.fs-p-productDescription .su-mothers__note {
  margin: 16px 0 0;
  font-size: 11px;
  color: #6e3b50;
  opacity: 0.85;
}

/* ---------- 選ばれる理由（4カラム） ---------- */
.fs-p-productDescription .su-reasons__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.fs-p-productDescription .su-reason {
  background: #fff;
  border: 1px solid var(--su-border);
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}

.fs-p-productDescription .su-reason__title {
  margin: 0 0 10px;
  padding-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--su-wine);
  border-bottom: 2px solid var(--su-gold);
}

.fs-p-productDescription .su-reason__img {
  margin-bottom: 10px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--su-cream);
}

.fs-p-productDescription .su-reason__img img {
  display: block;
  width: 100%;
  height: auto;
}

.fs-p-productDescription .su-reason__desc {
  margin: 0;
  font-size: 12px;
  line-height: 1.7;
  color: var(--su-text);
  text-align: left;
}

/* ---------- ステップ（楽しみ方） ---------- */
.fs-p-productDescription .su-steps__list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: su-step-counter;
}

.fs-p-productDescription .su-step {
  position: relative;
  background: #fff;
  border: 1px solid var(--su-border);
  border-radius: 10px;
  padding: 16px 10px 12px;
  text-align: center;
}

.fs-p-productDescription .su-step__num {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--su-wine);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(107, 31, 42, 0.25);
}

.fs-p-productDescription .su-step__title {
  margin: 0 0 10px;
  padding-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--su-wine);
  text-align: center;
  border-bottom: 1px dashed var(--su-gold);
}

.fs-p-productDescription .su-step__desc {
  margin: 0;
  font-size: 12px;
  line-height: 1.7;
  color: var(--su-text);
  text-align: left;
}

/* ---------- お客さまの声 ---------- */
.fs-p-productDescription .su-reviews__summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 20px;
}

.fs-p-productDescription .su-reviews__stars {
  color: var(--su-gold);
  font-size: 18px;
  letter-spacing: 0.1em;
}

.fs-p-productDescription .su-reviews__score {
  font-size: 22px;
  font-weight: 700;
  color: var(--su-wine);
  line-height: 1;
}

.fs-p-productDescription .su-reviews__period {
  font-size: 12px;
  color: var(--su-muted);
}

.fs-p-productDescription .su-reviews__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.fs-p-productDescription .su-review {
  background: #fff;
  border: 1px solid var(--su-border);
  border-radius: 10px;
  padding: 16px;
}

.fs-p-productDescription .su-review__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--su-border);
}

.fs-p-productDescription .su-review__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}

.fs-p-productDescription .su-review__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.fs-p-productDescription .su-review__meta .su-review__stars {
  color: var(--su-gold);
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 1;
}

.fs-p-productDescription .su-review__profile {
  margin: 0;
  font-size: 12px;
  color: var(--su-muted);
}

.fs-p-productDescription .su-review__body {
  margin: 0;
  font-size: 13px;
  line-height: 1.8;
  color: var(--su-text);
}

/* レビュー下の注記（※写真はイメージです） */
.fs-p-productDescription .su-reviews__note {
  margin: 12px 0 0;
  font-size: 11px;
  color: var(--su-muted);
  text-align: right;
  letter-spacing: 0.04em;
}

/* ---------- FAQ（通常） ---------- */
.fs-p-productDescription .su-faqList {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--su-border);
}

.fs-p-productDescription .su-faqList > li {
  border-bottom: 1px solid var(--su-border);
}

.fs-p-productDescription .su-faqItem {
  background: #fff;
}

.fs-p-productDescription .su-faqItem__q {
  position: relative;
  display: block;
  padding: 14px 44px 14px 44px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--su-text);
  cursor: pointer;
  list-style: none;
  transition: background-color 0.15s ease;
}

.fs-p-productDescription .su-faqItem__q::-webkit-details-marker {
  display: none;
}

.fs-p-productDescription .su-faqItem__q::before {
  content: "Q.";
  position: absolute;
  left: 14px;
  top: 14px;
  font-weight: 700;
  color: var(--su-wine);
  font-size: 15px;
  font-family: Georgia, "Times New Roman", serif;
}

/* +/- アイコン */
.fs-p-productDescription .su-faqItem__q::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 50%;
  width: 14px;
  height: 14px;
  background-image:
    linear-gradient(currentColor, currentColor),
    linear-gradient(currentColor, currentColor);
  background-size: 14px 2px, 2px 14px;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--su-wine);
  transform: translateY(-50%);
  transition: transform 0.2s ease;
}

.fs-p-productDescription .su-faqItem[open] .su-faqItem__q::after {
  background-size: 14px 2px, 0 14px;
}

.fs-p-productDescription .su-faqItem__q:hover {
  background-color: #faf6ee;
}

.fs-p-productDescription .su-faqItem__a {
  position: relative;
  padding: 4px 20px 16px 44px;
  font-size: 13px;
  line-height: 1.8;
  color: var(--su-text);
  background-color: #faf6ee;
}

.fs-p-productDescription .su-faqItem__a::before {
  content: "A.";
  position: absolute;
  left: 14px;
  top: 4px;
  font-weight: 700;
  color: var(--su-gold);
  font-size: 15px;
  font-family: Georgia, "Times New Roman", serif;
}

/* ---------- FAQ（母の日専用：ピンクテーマ） ---------- */
.fs-p-productDescription .su-faq--mothers {
  background: linear-gradient(135deg, var(--su-pink-light) 0%, var(--su-pink) 100%);
  padding: 20px;
  border-radius: 12px;
}

.fs-p-productDescription .su-section__title--mothers {
  color: #b03a6a;
}

.fs-p-productDescription .su-section__title--mothers::before,
.fs-p-productDescription .su-section__title--mothers::after {
  background: #d57b9b;
}

.fs-p-productDescription .su-faq--mothers .su-faqList {
  border-top: none;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(176, 58, 106, 0.08);
}

.fs-p-productDescription .su-faq--mothers .su-faqList > li {
  border-bottom: 1px solid #f5e3eb;
}

.fs-p-productDescription .su-faq--mothers .su-faqList > li:last-child {
  border-bottom: none;
}

.fs-p-productDescription .su-faq--mothers .su-faqItem__q::before {
  color: #b03a6a;
}

.fs-p-productDescription .su-faq--mothers .su-faqItem__q::after {
  color: #b03a6a;
}

.fs-p-productDescription .su-faq--mothers .su-faqItem__q:hover {
  background-color: #fdf2f6;
}

.fs-p-productDescription .su-faq--mothers .su-faqItem__a {
  background-color: #fdf2f6;
}

.fs-p-productDescription .su-faq--mothers .su-faqItem__a::before {
  color: #d57b9b;
}

/* ==========================================================================
   商品詳細について（.fs-p-card.su-spec）
   既存の .articleList_Info を活用しつつ、ワインレッド+ゴールドの
   テーマで上書きして見た目を統一する
   ========================================================================== */

.fs-p-card.su-spec {
  --c-text: #333;
  --c-border: #e8e1d6;
  --c-accent: #d7a35a;
  --c-wine: #6b1f2a;
  --c-cream: #faf6ee;
  background: #fff;
  margin: 32px 0;
  padding: 0;
  color: var(--c-text);
  line-height: 1.8;
}

/* セクションタイトル（センター + 左右の金線、他セクションと統一） */
.fs-p-card.su-spec .fs-p-card__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0 0 20px;
  padding: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--c-wine);
  text-align: center;
  border-bottom: none;
}

.fs-p-card.su-spec .fs-p-card__title::before,
.fs-p-card.su-spec .fs-p-card__title::after {
  content: "";
  flex: 1;
  max-width: 60px;
  height: 1px;
  background: var(--c-accent);
}

.fs-p-card.su-spec .fs-p-card__title span {
  display: inline-block;
}

/* 各行（dl）：テーブル風に統一 */
.fs-p-card.su-spec .articleList_Info {
  display: grid;
  grid-template-columns: 11em 1fr;
  column-gap: 24px;
  align-items: start;
  margin: 0;
  padding: 18px 16px;
  border-top: 1px solid var(--c-border);
  border-bottom: none;
}

.fs-p-card.su-spec .articleList_Info:last-of-type {
  border-bottom: 1px solid var(--c-border);
}

/* 偶数行に薄いクリーム背景（縞模様で読みやすく） */
.fs-p-card.su-spec .articleList_Info:nth-of-type(even) {
  background: var(--c-cream);
}

/* 左カラム（dt）：ワインレッドの見出し + 金のアクセントバー */
.fs-p-card.su-spec .articleList_Info dt {
  position: relative;
  margin: 0;
  padding-left: 14px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.6;
  color: var(--c-wine);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px;
}

.fs-p-card.su-spec .articleList_Info dt::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  bottom: 0.35em;
  width: 4px;
  background: var(--c-accent);
  border-radius: 2px;
}

.fs-p-card.su-spec .articleList_Info dt small {
  font-size: 11px;
  font-weight: 500;
  color: #999;
  letter-spacing: 0;
}

/* 右カラム（dd）：装飾を解除してクリーンに */
.fs-p-card.su-spec .articleList_Info dd {
  margin: 0;
  padding-left: 0;
  border-left: none;
  font-size: 14px;
  line-height: 1.8;
  color: var(--c-text);
}

.fs-p-card.su-spec .articleList_Info dd p {
  margin: 0 0 6px;
  font-size: 14px;
  line-height: 1.8;
}

.fs-p-card.su-spec .articleList_Info dd p:last-child {
  margin-bottom: 0;
}

.fs-p-card.su-spec .articleList_Info dd p > b {
  display: inline-block;
  margin-right: 4px;
  color: var(--c-wine);
  font-weight: 700;
}

/* ---------- 栄養成分表示（3カラム サブカード） ---------- */
.fs-p-card.su-spec .su-nutrition {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.fs-p-card.su-spec .su-nutritionItem {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 12px;
}

.fs-p-card.su-spec .su-nutritionItem__title {
  margin: 0 0 8px;
  padding-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--c-wine);
  border-bottom: 1px dashed var(--c-accent);
  letter-spacing: 0.04em;
}

.fs-p-card.su-spec .su-nutritionItem__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.fs-p-card.su-spec .su-nutritionItem__list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  font-size: 12px;
  line-height: 1.5;
  border-bottom: 1px dotted #f0e8d8;
  color: #555;
}

.fs-p-card.su-spec .su-nutritionItem__list li:last-child {
  border-bottom: none;
}

.fs-p-card.su-spec .su-nutritionItem__list li > span:last-child {
  font-weight: 700;
  color: var(--c-wine);
  font-size: 13px;
}

/* ---------- レスポンシブ（タブレット） ---------- */
@media (max-width: 991px) {
  .fs-p-productDescription .su-set__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .fs-p-productDescription .su-reasons__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .fs-p-productDescription .su-steps__list {
    grid-template-columns: repeat(3, 1fr);
  }
  .fs-p-productDescription .su-reviews__list {
    grid-template-columns: 1fr;
  }
  .fs-p-card.su-spec .su-nutrition {
    grid-template-columns: 1fr;
  }
}

/* ---------- レスポンシブ（スマホ） ---------- */
@media (max-width: 640px) {
  .fs-p-productDescription .su-section {
    margin: 36px 0;
  }
  .fs-p-productDescription .su-section__title {
    font-size: 18px;
    gap: 10px;
  }
  .fs-p-productDescription .su-section__title::before,
  .fs-p-productDescription .su-section__title::after {
    max-width: 32px;
  }

  .fs-p-productDescription .su-hero {
    padding: 20px 12px 24px;
  }
  .fs-p-productDescription .su-hero__title {
    font-size: 20px;
  }

  .fs-p-productDescription .su-set__grid {
    grid-template-columns: 1fr;
  }

  .fs-p-productDescription .su-mothers {
    padding: 20px 14px;
  }
  .fs-p-productDescription .su-mothers__title {
    font-size: 18px;
  }
  .fs-p-productDescription .su-mothers__features {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .fs-p-productDescription .su-mothersFeature {
    padding: 8px;
  }
  .fs-p-productDescription .su-mothersFeature span {
    font-size: 10px;
  }

  .fs-p-productDescription .su-reasons__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .fs-p-productDescription .su-reason__title {
    font-size: 13px;
  }

  .fs-p-productDescription .su-steps__list {
    grid-template-columns: repeat(2, 1fr);
  }
  .fs-p-productDescription .su-step__title {
    font-size: 12px;
    min-height: auto;
  }
  .fs-p-productDescription .su-step__desc {
    font-size: 11px;
  }

  /* 商品詳細スペック：縦積み */
  .fs-p-card.su-spec .fs-p-card__title {
    font-size: 18px;
    gap: 10px;
  }
  .fs-p-card.su-spec .fs-p-card__title::before,
  .fs-p-card.su-spec .fs-p-card__title::after {
    max-width: 32px;
  }
  .fs-p-card.su-spec .articleList_Info {
    grid-template-columns: 1fr;
    row-gap: 8px;
    padding: 14px 12px;
  }
  .fs-p-card.su-spec .articleList_Info dt {
    font-size: 14px;
  }
  .fs-p-card.su-spec .articleList_Info dd {
    font-size: 13px;
    padding-left: 14px;
  }
  .fs-p-card.su-spec .su-nutrition {
    grid-template-columns: 1fr;
  }
}

