@charset "UTF-8";
/* ==========================================================================
   style.css  ―  Umnet TOP
   - PCコーディング基準（デザイン幅 1500px）
   - デスクトップファースト。@media は末尾に 1024 / 767 でまとめて記述
   - レイアウトは grid 中心。オーバーレイは grid 重ねで absolute を多用しない
   - 全体設定（body 等）はここで一元管理（システムCSSと重複定義しない）
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Variables
   -------------------------------------------------------------------------- */
:root {
  /* font-family のみ変数を使用（その他の値はハードコーディング） */
  /* base（日本語）: 游ゴシック体 */
  --font-base: "游ゴシック体", "Yu Gothic", YuGothic, "游ゴシック", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  /* 英字: Times New Roman 優先、無ければ EB Garamond */
  --font-serif: "Times New Roman", "EB Garamond", "Noto Serif JP", serif;
  /* セリフ（和欧混植）: Noto Serif JP */
  --font-serif-jp: "Noto Serif JP", serif;
  /* EB Garamond Roman（フッター見出し等） */
  --font-eb: "EB Garamond", serif;
}

/* --------------------------------------------------------------------------
   2. Base
   -------------------------------------------------------------------------- */
body {
  background-color: #ffffff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 14px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a {
  transition:
    opacity 0.25s ease,
    color 0.25s ease;
}

/* futureshop システムCSSの a:hover（青字＋下線）を打ち消す */
a:hover,
a:active,
a:visited {
  color: inherit;
  text-decoration: none;
}

@media (hover: hover) {
  a:hover {
    opacity: 0.6;
  }
}

.mrb-10 {
  margin-bottom: 10px;
}

.sp-only {
  display: none;
}

/* --------------------------------------------------------------------------
   2-1. システムCSS（fs_style / fs_theme）の上書き
   - フォーム要素の既定枠・padding・focus 装飾などをデザインに合わせて打ち消す
   -------------------------------------------------------------------------- */
.search-panel__input,
.newsletter__input {
  border-radius: 0;
}

.search-panel__input {
  padding: 0;
}

.search-panel__input:focus,
.newsletter__input:focus {
  box-shadow: none;
}

.newsletter__input:focus {
  border-color: #2b2b2b;
}

.search-panel__submit,
.newsletter__submit {
  -webkit-appearance: none;
  appearance: none;
}

/* 英字（セリフ）共通 — EB Garamond Medium */
.global-nav__link,
.products__title,
.feature__label,
.category-nav__label,
.more-button {
  font-family: var(--font-serif);
  font-weight: 500;
  letter-spacing: 0.05em;
}

/* フッター領域は游ゴシック（base を継承） */
.site-footer {
  font-family: var(--font-base);
}

/* --------------------------------------------------------------------------
   3. Header
   -------------------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: #ffffff;
}

.site-header__inner {
  display: grid;
  /* ロゴ / ナビ（ロゴの右60px）/ アイコン（右寄せ） */
  grid-template-columns: auto auto 1fr;
  align-items: center;
  column-gap: 60px;
  min-height: 80px;
  padding-inline: 45px;
}

.site-header__utils {
  justify-self: end;
}

.site-header__logo img {
  width: 120px;
}

.site-header__toggle {
  display: none; /* SPのみ表示 */
}

.global-nav {
  align-self: stretch; /* ヘッダー高さいっぱい（WEAR展開の基準にする） */
}

.global-nav__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 28px;
  height: 100%;
}

.global-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
}

/* ロールオーバーで色・不透明度は変えず、下線のみ表示 */
.global-nav__link:hover {
  opacity: 1;
}

.global-nav__link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 1px;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s ease;
}

/* ホバー時、および WEAR はナビ展開中も下線を維持 */
.global-nav__item:hover > .global-nav__link::after,
.global-nav__item:focus-within > .global-nav__link::after,
.global-nav__item--dropdown.is-open > .global-nav__link::after {
  transform: scaleX(1);
}

.global-nav__caret {
  display: inline-flex;
  align-items: center;
  margin-left: 7px;
}

.global-nav__caret img {
  width: 8px;
}

/* SP用アコーディオン開閉ボタン（PCでは非表示） */
.global-nav__expand {
  display: none;
}

/* SP専用項目（CONTACT）はPCでは非表示 */
.global-nav__item--sp {
  display: none;
}

.global-nav__item--has-child {
  position: relative;
}

/* WEAR の li をヘッダー高さいっぱいにして、展開メニューをヘッダー下端から開始 */
.global-nav__item--dropdown {
  align-self: stretch;
  display: flex;
  align-items: center;
}

/* WEAR の開閉でキャレットを反転 */
.global-nav__caret img {
  transition: transform 0.25s ease;
}

.global-nav__item--dropdown.is-open .global-nav__caret img {
  transform: rotate(180deg);
}

/* ドロップダウン本体（PCはWEARをクリックで開閉。メインビジュアル上端から展開） */
.global-nav__submenu {
  position: absolute;
  top: 100%;
  left: -26px;
  display: grid;
  gap: 6px;
  width: max-content; /* 最長項目に合わせて展開幅を可変に（INFORMATION等の長い項目対応） */
  min-width: 150px;
  margin-top: 0;
  padding: 24px 26px;
  background-color: rgba(255, 255, 255, 0.9);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}

.global-nav__item--dropdown.is-open > .global-nav__submenu {
  opacity: 1;
  visibility: visible;
}

.global-nav__sublink {
  font-family: var(--font-serif);
  font-size: 16px;
  letter-spacing: 0.12em;
  white-space: nowrap; /* 長い項目（特定商取引法に基づく表記 等）を折り返さない */
}

/* INFORMATION の展開だけ PC は 14px（項目が長いため。折返し防止は width:max-content で対応） */
.global-nav__submenu--info .global-nav__sublink {
  font-size: 14px;
}

.global-nav__submenu.global-nav__submenu--info .global-nav__sublink {
  font-family: var(--font-base);
}

/* 検索パネル（PCはヘッダー右下にドロップダウン / デザイン: 459×74） */
.search-panel {
  position: absolute;
  top: 100%;
  right: 45px;
  z-index: 99;
  width: 459px;
  max-width: calc(100% - 90px);
  padding: 18px 24px;
  /* パネルは白の90%透過（フォーム内は不透過にする） */
  background-color: rgba(255, 255, 255, 0.9);
}

.search-panel[hidden] {
  display: none;
}

.search-panel__form {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 7px 14px;
  border: 1px solid #e3e3e3;
  background-color: #ffffff;
}

.search-panel__input {
  border: 0;
  background: transparent;
  outline: none;
  font-family: var(--font-serif);
  font-size: 14px;
  line-height: 1.3;
}

.search-panel__input::placeholder {
  color: #646464;
  letter-spacing: 0.05em;
}

/* 検索送信ボタン: icon-search-btn.svg（→矢印） */
.search-panel__submit {
  width: 20px;
  height: 16px;
  background-image: url(../img/icon-search-btn.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px auto;
}

.site-header__utils {
  display: flex;
  align-items: center;
  gap: 22px;
}

/* アイコンは全て同じ整列に（虫眼鏡=button のズレ防止） */
.site-header__util {
  display: block;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.site-header__util img {
  width: 20px;
}

/* --------------------------------------------------------------------------
   4. Hero
   -------------------------------------------------------------------------- */
.hero {
  display: grid;
}

.hero__video,
.hero__overlay,
.hero__logo,
.hero__sound,
.hero__sns {
  grid-area: 1 / 1;
}

/* 背景動画（PC: mv-movie_pc.mp4 1920×1080）。高さは動画比率で決める */
.hero__video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* メインビジュアル上の透過レイヤー（デザイン指定: #646464 / opacity .30 / multiply） */
.hero__overlay {
  background-color: #646464;
  opacity: 0.3;
  mix-blend-mode: multiply;
}

.hero__logo {
  place-self: center;
  z-index: 1;
}

.hero__logo img {
  /* 1500px基準の37vw。1920px相当(約711px)で頭打ちにして拡大を保証 */
  width: 37vw;
  max-width: 711px;
}

/* 音声トグル（右下・細白フチの円形。初期はミュート＝.is-muted） */
.hero__sound {
  place-self: end end;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0 24px 24px 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  background-color: rgba(50, 50, 50, 0.18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  cursor: pointer;
  transition:
    background-color 0.25s ease,
    border-color 0.25s ease;
}
@media (hover: hover) {
  .hero__sound:hover {
    border-color: #ffffff;
    background-color: rgba(50, 50, 50, 0.34);
  }
}
.hero__sound::before {
  content: "";
  width: 19px;
  height: 19px;
  background: url("../img/icon-sound-on.svg") center / contain no-repeat;
}
.hero__sound.is-muted::before {
  background-image: url("../img/icon-sound-off.svg");
}

/* SNS（SP時のみメインビジュアル右下に表示） */
.hero__sns {
  display: none;
  place-self: end end;
  z-index: 1;
  gap: 10px;
  padding: 0 18px 24px 0;
}

.hero__sns img {
  width: 26px;
}

.one__word {
  text-align: center;
  margin: 30px auto 0;
  border: 1px solid #646464;
  padding: 10px 10px 8px;
  max-width: min(900px, 100% - 40px);
  margin-inline: auto; /* 900pxで頭打ちになったとき中央寄せ */
}

/* --------------------------------------------------------------------------
   5. Feature (Autumn / Winter)
   -------------------------------------------------------------------------- */
.feature {
  padding-top: 110px;
}

.feature__label {
  margin-bottom: 20px;
  font-size: 24px;
  text-align: center;
}

.feature__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.feature__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --------------------------------------------------------------------------
   6. Products (RECOMMEND / ALL)
   -------------------------------------------------------------------------- */
.products {
  padding-top: 110px;
}

.products__title {
  margin-bottom: 20px;
  font-size: 24px;
  letter-spacing: 0.05em;
  text-align: center;
}

.product-list {
  display: grid;
  gap: 70px 1px;
  grid-template-columns: repeat(4, 1fr);
}

.product-card {
  display: grid;
  align-content: start;
}

.product-card__media {
  display: grid;
  overflow: hidden;
}

.product-card__image {
  grid-area: 1 / 1;
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  background: #f2f1ed;
}
/* 画像未登録商品のプレースホルダー（グレー枠・比率維持） */
.product-card__image--empty {
  background: #f2f1ed;
  object-fit: contain;
}

/* 商品カードはロールオーバー画像(-40)表示のため、
   汎用の a:hover { opacity: 0.6 }（薄くなる処理）を打ち消す */
@media (hover: hover) {
  .product-card a:hover,
  .product-card__link:hover,
  .fs-c-productListItem a:hover {
    opacity: 1;
  }
}

/* 商品画像ロールオーバー（-40.jpg）
   JSがベース画像の親に .js-rollover-wrap を付与し、オーバーレイ画像を重ねて
   opacity でクロスフェードする（※ホバー時の拡大(scale)は仕様変更で廃止） */
.js-rollover-wrap {
  position: relative;
}
a.js-rollover-wrap {
  display: block;
}
.js-rollover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.js-rollover-img.is-visible {
  opacity: 1;
}

.product-card__nav {
  grid-area: 1 / 1;
  align-self: center;
  width: 36px;
  height: 36px;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.product-card__nav::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 auto;
  border-top: 1px solid #2b2b2b;
  border-right: 1px solid #2b2b2b;
}

.product-card__nav--prev {
  justify-self: start;
}

.product-card__nav--prev::before {
  transform: rotate(-135deg);
}

.product-card__nav--next {
  justify-self: end;
}

.product-card__nav--next::before {
  transform: rotate(45deg);
}

@media (hover: hover) {
  .product-card__media:hover .product-card__nav {
    opacity: 1;
  }
}

.product-card__body {
  padding: 20px 25px 0;
  font-size: 14px;
}

.product-card__name {
  font-weight: 400;
  line-height: 1.5;
}

/* MORE button（PCデザインには無いためSPのみ表示） */
.products__more {
  display: none;
}

/* hidden 属性での非表示を SP の display:flex より優先させる */
.products__more[hidden] {
  display: none;
}

/* 「ALL一覧を見る」ボタン（PC常時／SPは展開後に表示）。more-button のテイストを流用 */
.products__all-link {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

/* 角丸ピル形。「MORE」中央＋右端に「＋」 */
.more-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 266px;
  max-width: 100%;
  height: 47px;
  border: 1px solid #e3e3e3;
  border-radius: 999px;
  background-color: transparent; /* <button> でも <a> と同じ見た目に */
  -webkit-appearance: none;
  appearance: none;
  color: #646464;
  font-size: 16px;
  letter-spacing: 0.2em;
  cursor: pointer;
}

.more-button__icon {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
}

.more-button__icon::before,
.more-button__icon::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  background-color: currentColor;
}

.more-button__icon::before {
  width: 12px;
  height: 1px;
}

.more-button__icon::after {
  width: 1px;
  height: 12px;
}

/* --------------------------------------------------------------------------
   7. Category nav (banners)
   -------------------------------------------------------------------------- */
#products__allanker {
  margin: 0 auto 60px;
}

#products__allanker .products__all-link {
  margin-top: 0px;
}

/* ALL一覧ボタンは単純なリンク＝more-button の「＋」アイコンは出さない */
#products__allanker .more-button__icon {
  display: none;
}

#fs_Top #products__allanker,
.fs-body-category-all #products__allanker {
  display: none;
}

.fs-c-productListItem__preorderMessage.fs-c-preorderMessage {
  order: 5;
  margin: 5px 12px 0;
  padding: 6px 12px;
  font-size: 12px;
  color: #fff;
  background: #646464;
  border: 1px solid #646464;
  line-height: 1;
  text-align: center;
}

.fs-body-my-wishlist .fs-c-productListItem__preorderMessage.fs-c-preorderMessage {
  order: 3;
}

.category-nav {
  padding-top: 120px;
  padding-inline: 60px;
}

/* WPページ（body.umnet-wp）だけ category-nav の上余白を0に。
   詳細度(0,2,0)で各ブレイクポイントの .category-nav(0,1,0) を上回るため全幅で有効 */
.umnet-wp .category-nav {
  padding-top: 0;
}

.category-nav__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.category-nav__link {
  display: grid;
}

.category-nav__image,
.category-nav__label {
  grid-area: 1 / 1;
}

.category-nav__image,
.category-nav__image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 334 / 120;
  object-fit: cover;
}

.category-nav__label {
  place-self: center;
  z-index: 1;
  color: #ffffff;
  font-family: var(--font-serif);
  font-size: 24px;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
}

/* --------------------------------------------------------------------------
   8. Copy visual
   -------------------------------------------------------------------------- */
.copy-visual {
  display: grid;
  margin-top: 110px;
}

.copy-visual__media,
.copy-visual__inner {
  grid-area: 1 / 1;
}

.copy-visual__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.copy-visual__inner {
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr; /* 行を全高にして上詰め/下詰めを効かせる */
  gap: 40px;
  width: 100%;
  max-width: 1100px; /* コンテンツ中央 max1050px */
  margin-inline: auto;
  padding: 120px 45px;
  color: #ffffff;
  font-family: var(--font-serif-jp); /* この部分は Noto Serif JP */
}

/* 左：左上詰め */
.copy-visual__lead-ja {
  align-self: start;
  justify-self: start;
  text-align: left;
  font-size: 15px;
  line-height: 2.4;
  letter-spacing: 0.08em;
}

.copy-visual__lead-ja p:not(:first-child) {
  margin-top: 2em;
}

/* 右：右下起点・テキストは左寄せ */
.copy-visual__lead-en {
  align-self: end;
  justify-self: end;
  text-align: left;
  font-size: 15px;
  line-height: 2.2;
  letter-spacing: 0.06em;
}

.copy-visual__lead-en p:not(:first-child) {
  margin-top: 2em;
}

/* --------------------------------------------------------------------------
   9. Footer
   -------------------------------------------------------------------------- */
.site-footer {
  margin-top: 0;
}

.newsletter {
  display: none; /* SPのみ表示 */
}

.site-footer__inner {
  padding: 70px 45px 60px;
}

.site-footer__logo {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}

.site-footer__logo img {
  width: 200px;
}

/* 4グループを各1列に配置（Umnet / ACCOUNT / INFORMATION / CONTACT） */
.footer-nav {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  justify-content: center;
  align-items: start;
  column-gap: 60px;
}

.footer-group__title {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7; /* 他列リンクと行高を揃えて先頭行を一致させる */
  letter-spacing: 0.05em;
}

/* アコーディオン見出し・CONTACT は EB Garamond Roman */
.footer-group--collapsible .footer-group__title,
.footer-group--single .footer-group__title {
  font-family: var(--font-eb);
  font-weight: 500;
}

/* アコーディオングループ（Umnet/ACCOUNT/INFORMATION）はPCでは見出しを隠してリンクのみ表示 */
.footer-group--collapsible .footer-group__title {
  display: none;
}

.footer-group__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  font: inherit;
  letter-spacing: inherit;
  text-align: left;
}

.footer-group__list {
  display: grid;
  gap: 12px;
  font-size: 13px;
  color: #555555;
}

.footer-group__icon {
  display: none; /* SPのアコーディオン記号 */
}

.site-footer__sns {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 56px;
}

.site-footer__sns img {
  width: 22px;
}

.titleunb {
  margin-bottom: 40px;
}

/* ==========================================================================
   10. Responsive  ―  @media は以下にまとめて記述
   ========================================================================== */

/* ---------- Tablet ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .site-header__inner {
    column-gap: 24px;
    padding-inline: 28px;
  }

  .search-panel {
    right: 28px;
    max-width: calc(100% - 56px);
  }

  .global-nav__list {
    gap: 18px;
  }

  .global-nav__link {
    font-size: 13px;
  }

  .feature {
    padding-top: 80px;
  }

  .products {
    padding-top: 80px;
  }

  .products__title {
    font-size: 20px;
    margin-bottom: 36px;
  }

  .category-nav {
    padding-top: 90px;
    padding-inline: 28px;
  }

  .copy-visual {
    margin-top: 80px;
  }

  .copy-visual__inner {
    padding: 60px 28px;
  }

  .copy-visual__lead-en {
    font-size: 16px;
  }

  .site-footer__inner {
    padding: 70px 28px 60px;
  }
}

/* ---------- SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  /* ---- Header ---- */
  .site-header__inner {
    grid-template-columns: 1fr auto 1fr;
    column-gap: 14px;
    min-height: 60px;
    padding-inline: 18px;
    position: relative; /* ロゴの絶対中央配置の基準 */
  }

  .site-header__toggle {
    display: grid;
    gap: 6px;
    width: 24px;
    grid-column: 1;
    justify-self: start;
  }

  .site-header__toggle-bar {
    display: block;
    width: 100%;
    height: 1px;
    background-color: #2b2b2b;
    transition: transform 0.3s ease;
  }

  /* 2本線ハンバーガー → ✕ */
  .site-header__toggle[aria-expanded="true"] .site-header__toggle-bar:nth-child(1) {
    transform: translateY(3.5px) rotate(20deg);
  }
  .site-header__toggle[aria-expanded="true"] .site-header__toggle-bar:nth-child(2) {
    transform: translateY(-3.5px) rotate(-20deg);
  }

  /* ロゴは常にヘッダーの上下左右中央（絶対配置） */
  .site-header__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
  }

  .site-header__logo img {
    width: 90px;
  }

  .site-header__utils {
    grid-column: 3;
    justify-self: end;
    align-items: center;
    gap: 8px;
  }

  .site-header__util img {
    width: 18px;
  }

  /* グローバルナビ：オフキャンバス */
  .global-nav {
    position: fixed;
    inset: 60px 0 0;
    z-index: 90;
    padding: 8px 26px 56px;
    background-color: #ffffff;
    overflow-y: auto;
    transform: translateX(100%);
    visibility: hidden;
    transition:
      transform 0.35s ease,
      visibility 0.35s ease;
  }

  .global-nav.is-open {
    transform: translateX(0);
    visibility: visible;
  }

  .global-nav__list {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    height: auto;
  }

  .global-nav__item {
    position: relative;
    border-bottom: 1px solid #e3e3e3;
  }

  /* PCで付けた full-height/flex をSPでは解除 */
  .global-nav__item--dropdown {
    display: block;
    align-self: auto;
  }

  .global-nav__item--sp {
    display: block;
  }

  .global-nav__link {
    padding: 17px 4px;
    font-size: 17px;
  }

  /* 子メニューを持つ親リンクは行全幅にして、行のどこをタップしても開閉できるように */
  .global-nav__item--has-child > .global-nav__link {
    width: 100%;
  }

  .global-nav__link::after {
    content: none;
  }

  .global-nav__caret {
    display: none;
  }

  /* +/× 開閉ボタン */
  .global-nav__expand {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 54px;
    /* 見出しリンクと同じ高さ（line-height 1.7em + 上下padding 17px×2）にして
       「＋」をテキストと縦中央で揃える */
    font-size: 17px;
    height: calc(1.7em + 34px);
  }

  .global-nav__expand::before,
  .global-nav__expand::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #2b2b2b;
  }

  .global-nav__expand::before {
    width: 13px;
    height: 1px;
    transform: translate(-50%, -50%);
  }

  .global-nav__expand::after {
    width: 1px;
    height: 13px;
    transform: translate(-50%, -50%);
    transition: transform 0.3s ease;
  }

  .global-nav__item.is-open > .global-nav__expand::after {
    transform: translate(-50%, -50%) scaleY(0);
  }

  /* サブメニュー（アコーディオン） */
  .global-nav__submenu {
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    display: block;
    width: auto; /* PCの width:max-content を解除（SPはブロックで通常フロー） */
    min-width: 0;
    margin: 0;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
  }

  .global-nav__item.is-open > .global-nav__submenu {
    max-height: 420px;
  }

  .global-nav__sublink {
    display: block;
    padding: 12px 0 12px 4px;
    font-size: 14px;
  }

  .global-nav__submenu li:last-child .global-nav__sublink {
    padding-bottom: 22px;
  }

  /* 検索パネル：全幅で展開 */
  .search-panel {
    right: 0;
    left: 0;
    width: auto;
    max-width: none;
    padding: 14px 18px;
  }

  /* iOS Safari はフォーカス時に font-size<16px の入力欄を自動ズームするため、
     SPの入力欄は 16px にしてズームを防止する */
  .search-panel__input,
  .newsletter__input {
    font-size: 16px;
  }

  .sp-only {
    display: block;
  }

  /* ---- Hero ---- */
  /* SPは縦動画（mv-movie_sp.mp4 1080×1920） */
  .hero__video {
    aspect-ratio: 9 / 16;
  }

  /* SPはロゴを .hero の上下左右中央に */
  .hero__logo {
    place-self: center;
    padding: 0;
  }

  .hero__logo img {
    width: 250px;
  }

  /* SPはSNSが右下のため、音声トグルは左下へ */
  .hero__sound {
    place-self: end start;
    width: 40px;
    height: 40px;
    margin: 0 0 22px 16px;
  }
  .hero__sound::before {
    width: 17px;
    height: 17px;
  }

  .hero__sns {
    display: flex;
    padding: 0 16px 22px 0;
  }

  .hero__sns img {
    width: 28px;
  }

  /* ---- Feature ---- */
  .feature {
    padding-top: 56px;
  }

  .feature__label {
    margin-bottom: 15px;
    font-size: 17px;
  }

  .feature__grid {
    grid-template-columns: 1fr;
  }

  /* ---- Products ---- */
  .products {
    padding-top: 64px;
  }

  .products__title {
    margin-bottom: 15px;
    font-size: 17px;
  }

  .product-list {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1px;
    row-gap: 50px;
  }

  /* SP：各リストは初期4点のみ表示、MOREで全件展開 */
  .product-list .product-card:nth-child(n + 5) {
    display: none;
  }

  .product-list.is-expanded .product-card:nth-child(n + 5) {
    display: grid;
  }

  /* レコメンドページ（recommend_page）は SP でも全件表示（4件制限を解除・MOREなし） */
  .recommend_page .product-list .product-card:nth-child(n + 5) {
    display: grid;
  }

  .product-card__nav {
    display: none;
  }

  .products__more {
    display: flex;
    justify-content: center;
    margin-top: 40px;
  }

  /* 商品が4件以下（5件目が無い）なら MORE は不要 */
  .products:not(:has(.product-card:nth-child(5))) .products__more,
  .footer_products:not(:has(.product-card:nth-child(5))) .products__more {
    display: none;
  }

  /* SP：「ALL一覧を見る」は MORE 表示中（未展開かつ5件以上）だけ隠す
     → 展開後、または元々4件以下のときは表示 */
  .products:has(.product-list:not(.is-expanded)):has(.product-card:nth-child(5)) .products__all-link,
  .footer_products:has(.product-list:not(.is-expanded)):has(.product-card:nth-child(5)) .products__all-link {
    display: none;
  }

  .product-card__body {
    padding: 15px 15px 0;
  }

  /* ---- Category nav ---- */
  .category-nav {
    padding-top: 64px;
    padding-inline: 15px;
  }

  .category-nav__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  /* SPは正方形タイル（-sp画像が646×646） */
  .category-nav__image,
  .category-nav__image img {
    aspect-ratio: 1 / 1;
  }

  .category-nav__label {
    font-size: 15px;
  }

  /* ---- Copy visual ---- */
  .copy-visual {
    margin-top: 50px;
  }

  .copy-visual__inner {
    grid-template-columns: 1fr;
    grid-template-rows: none; /* PCの 1fr を解除（SPは上下 space-between で配置） */
    align-content: space-between;
    gap: 0;
    padding: 40px 18px;
    min-height: 78vw;
  }

  /* 767px=13px → 375px=10px を vw で線形に補間（767でいきなり小さくならない） */
  .copy-visual__lead-ja {
    font-size: calc(9.13px + 0.765vw);
    line-height: 2.2;
  }

  /* 右下起点・テキスト右寄せ。767px=15px → 375px=12px を vw で線形補間 */
  .copy-visual__lead-en {
    justify-self: end;
    text-align: right;
    font-size: calc(9.13px + 0.765vw);
  }

  /* ---- Newsletter (SPのみ) ---- */
  .newsletter {
    display: grid;
    gap: 14px;
    padding: 48px 18px 0;
    border-top: 1px solid #e3e3e3;
  }

  .newsletter__title {
    font-size: 15px;
    letter-spacing: 0.04em;
    text-align: left;
  }

  /* 全幅の枠付き入力欄（プレースホルダ＋→矢印を内包） */
  .newsletter__form {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 15px 16px;
    border: 1px solid #e3e3e3;
    background-color: #ffffff;
  }

  .newsletter__input {
    padding: 0;
    border: 0;
    background: transparent;
    outline: none;
    font-size: 16px; /* iOSのフォーカス時自動ズーム防止 */
    line-height: 1.4;
  }

  .newsletter__input::placeholder {
    color: #8c8c8c;
  }

  /* 送信は icon-search-btn.svg（→） */
  .newsletter__submit {
    width: 20px;
    height: 16px;
    padding: 0;
    background-color: transparent;
    background-image: url(../img/icon-search-btn.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px auto;
  }

  /* ---- Footer ---- */
  .site-footer__inner {
    padding: 30px 18px 44px;
  }

  .site-footer__logo {
    order: 2;
    margin: 50px 0 0;
  }

  .site-footer__logo img {
    width: 168px;
  }

  .site-footer__inner {
    display: flex;
    flex-direction: column;
  }

  .footer-nav {
    order: 1;
    display: block;
  }

  .footer-group {
    border-bottom: 1px solid #e3e3e3;
  }

  .footer-group__title {
    display: block;
    font-size: 20px;
  }

  .footer-group--collapsible .footer-group__title {
    display: block;
  }

  .footer-group__link {
    display: block;
    padding: 18px 4px;
  }

  .footer-group__toggle {
    padding: 18px 4px 10px;
  }

  .footer-group__icon {
    position: relative;
    display: block;
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
  }

  .footer-group__icon::before,
  .footer-group__icon::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    background-color: #2b2b2b;
  }

  .footer-group__icon::before {
    width: 12px;
    height: 1px;
  }

  .footer-group__icon::after {
    width: 1px;
    height: 12px;
    transition: transform 0.3s ease;
  }

  .footer-group__toggle[aria-expanded="true"] .footer-group__icon::after {
    transform: scaleY(0);
  }

  .footer-group__body {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
  }

  .footer-group--collapsible.is-open .footer-group__body {
    max-height: 400px;
  }

  .footer-group__list {
    padding: 0 4px 18px;
    gap: 14px;
  }

  .site-footer__sns {
    display: none; /* SPでは非表示 */
  }
}

/* ==========================================================================
   ★★★ ここから LOOK ページ専用 ★★★
   - 共通部（ヘッダー/カテゴリーナビ/コピービジュアル/フッター）は TOP と同一
   - 固有: パンくず / LOOKグリッド / 画像モーダル
   ========================================================================== */

/* アクセシビリティ用：視覚的に隠す */
.u-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* ---- LOOK セクション ---- */
.look {
  padding-top: 48px;
}

/* パンくず（本番はシステム出力 .fs-c-breadcrumb / デザイン: x60 / セリフ / 12px / グレー） */
.fs-c-breadcrumb {
  padding-inline: 60px;
  font-family: var(--font-serif);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: #8c8c8c;
}

.fs-c-breadcrumb__list {
  display: flex;
  flex-wrap: nowrap; /* 折り返さない */
  align-items: center;
  padding: 0; /* システム既定の padding:5px を解除 */
  overflow-x: auto; /* 長い場合は横スクロール */
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* スクロールバー非表示（Firefox） */
}
.fs-c-breadcrumb__list::-webkit-scrollbar {
  display: none; /* スクロールバー非表示（Chrome/Safari） */
}

.fs-c-breadcrumb__listItem {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto; /* 縮まず横に伸ばす */
  white-space: nowrap;
}

/* 区切りをシステム既定の " > " から icon-pankuzu.svg に置換 */
.fs-c-breadcrumb__listItem + .fs-c-breadcrumb__listItem::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 8px;
  margin: 0 12px;
  background: url(../img/icon-pankuzu.svg) no-repeat center / contain;
}

/* カレント（最後の項目＝テキスト）は濃いグレー */
.fs-c-breadcrumb__listItem:last-child {
  color: #646464;
}

/* ---- LOOK グリッド（PC: 4カラム / 269×408 / gap10 / 中央 max1106） ---- */
.look-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  width: 100%;
  max-width: 1106px;
  margin: 40px auto 0;
  padding-inline: 24px;
  box-sizing: border-box;
}

.look-card {
  display: block;
  width: 100%;
  cursor: pointer;
}

.look-card img {
  display: block;
  width: 100%;
  aspect-ratio: 270 / 408;
  object-fit: cover;
  transition: opacity 0.3s ease;
}

@media (hover: hover) {
  /* .look-card は <a>（商品リンク）。全体の a:hover{opacity:.6} で二重に沈むのを打ち消し、
     ホバー表現は画像側（img 0.82）に任せる */
  .look-card:hover {
    opacity: 1;
  }
  .look-card:hover img {
    opacity: 0.82;
  }
}

/* ---- LOOK 画像モーダル（ライトボックス） ---- */
.look-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  /* フェードイン／アウト */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

.look-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.look-modal__overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background-color: rgba(0, 0, 0, 0.7);
  cursor: pointer;
}

.look-modal__figure {
  position: relative;
  z-index: 1;
  margin: 0;
}

.look-modal__image {
  display: block;
  max-width: 76vw;
  max-height: 86vh;
  width: auto;
  height: auto;
  cursor: pointer; /* PC：クリックで該当商品ページへ遷移 */
  /* 前後切替のクロスフェード（opacity / transform のみ＝軽量・GPU合成） */
  transition:
    opacity 0.3s ease,
    transform 0.45s ease;
}

.look-modal__image.is-switching {
  opacity: 0;
  transform: scale(1.03);
}

/* CLOSE ボタン（icon-close.svg）: 画像の右上外側 */
.look-modal__close {
  position: absolute;
  top: 0;
  left: 100%;
  margin-left: 14px;
  z-index: 3;
  width: 16px;
  height: 16px;
  background: url(../img/icon-close.svg) no-repeat center / contain;
}

/* 前後ナビ（icon-prev.svg / icon-next.svg）: 画像の左右外側・縦中央 */
.look-modal__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 11px;
  height: 26px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.look-modal__nav--prev {
  right: 100%;
  margin-right: 18px;
  background-image: url(../img/icon-prev.svg);
}

.look-modal__nav--next {
  left: 100%;
  margin-left: 18px;
  background-image: url(../img/icon-next.svg);
}

/* ---------- LOOK : Tablet ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .breadcrumb {
    padding-inline: 28px;
  }
}

/* ---------- LOOK : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .look {
    padding-top: 28px;
  }

  .fs-c-breadcrumb {
    padding-inline: 18px;
    font-size: 11px;
  }

  /* SPは1カラム（画像を縦積み） */
  .look-grid {
    grid-template-columns: 1fr;
    gap: 8px;
    max-width: none;
    margin-top: 24px;
    padding-inline: 18px;
  }

  /* SPは画像基準の余白を詰める */
  .look-modal__close {
    margin-left: 8px;
  }

  .look-modal__nav--prev {
    margin-right: 10px;
  }

  .look-modal__nav--next {
    margin-left: 10px;
  }

  .look-modal__image {
    max-width: 80vw;
    max-height: 82vh;
  }
}

/* ==========================================================================
   ★★★ ここから コマクリ 商品一覧（fs-c-productList）を TOPの商品カード風に ★★★
   - レイアウト / 余白 / フォント / 「税込→tax in」は CSS のみで対応可
   - 商品画像は出力に存在しないため、商品テンプレートにパーツ組込が前提
   ========================================================================== */

.fs-c-productList {
  margin-top: 40px;
}

.fs-c-productList__controller {
  display: none;
}

/* 商品一覧グリッド（PC: 4列フルブリード。システム既定の flex を grid で上書き） */
.fs-c-productList__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 70px 1px; /* TOPの .product-list と同じ（行70px・列0） */
  margin: 0;
}

.fs-c-productListItem {
  margin: 0;
  padding: 0;
  border: 0;
}

/* article > form を flex 化し、order で TOPカードの並びに揃える */
.fs-c-productListItem > form {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 商品画像（要・商品画像パーツの組込）→ TOPの product-card__media 相当 */
.fs-c-productListItem__image {
  order: 1;
  margin: 0;
  overflow: hidden;
}
.fs-c-productListItem__image a,
.fs-c-productListItem__image picture {
  display: block;
}
.fs-c-productListItem__image img {
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

/* 商品名 → product-card__name 相当（TOPと同じ14px） */
.fs-c-productListItem__productName {
  order: 2;
  margin: 0;
  padding: 14px 12px 0;
  font-family: var(--font-base);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
.fs-c-productName__name {
  color: #646464;
}

/* 在庫切れ表示 */
.fs-c-productListItem__outOfStock {
  order: 5;
  margin: 5px 12px 0;
  padding: 6px 12px;
  font-size: 12px;
  color: #8c8c8c;
}

.fs-c-productListItem__productDescription {
  order: 4;
  margin: 0;
}

/* 価格 → product-card__price 相当 */
.fs-c-productListItem__prices {
  order: 3;
  margin: 0;
  padding: 6px 12px 0;
}
.fs-c-productPrice {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
}
.fs-c-productPrice__main,
.fs-c-productPrice__main__price,
.fs-c-price__currencyMark,
.fs-c-price__value {
  font-size: 14px;
  color: #646464;
}

/* 「税込」→「tax in」（元テキストを隠して content で差し替え） */
.fs-c-productPrice__addon {
  margin-left: 6px;
}
/* システム既定の括弧 ( ) を除去 */
.fs-c-productPrice__addon::before,
.fs-c-productPrice__addon::after {
  content: none;
}
.fs-c-productPrice__addon__label {
  font-size: 0;
}
.fs-c-productPrice__addon__label::after {
  content: "tax in";
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #646464;
}

/* お気に入りボタンは非表示 */
.fs-c-productListItem__control {
  display: none;
}

.fs-c-productListItem__viewMoreImageButton {
  display: none;
}

/* 並び替え・件数バーが不要な場合は次を有効化
.fs-c-productList__controller { display: none; }
*/

/* ---------- コマクリ 商品一覧 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-c-productList__list {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1px; /* TOPの .product-list（SP）と同じ */
    row-gap: 50px;
  }
}

/* ==========================================================================
   ★★★ 共通テキストページ（プライバシーポリシー / 利用規約 / 特商法 / 各ポリシー等） ★★★
   - 中央寄せ1カラムの読み物ページ用。クラスは汎用名（page-title / page-body）で、
     どのテキスト系ページでも単体HTMLにそのまま組める（コマクリのフリーページ等）。
   - 共通部（ヘッダー/パンくず/カテゴリーナビ/コピービジュアル/フッター）は他ページと同一。
   - 構成: page-title(h1・共通見出し) + page-body(本文枠) > __lead / __section / __heading / __list / __contact
   ========================================================================== */

/* 共通ページ見出し（h1）。中央寄せ・他のテキストページでも流用する独立クラス */
.page-title {
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  letter-spacing: 0.08em;
  color: #646464;
}

/* 中央寄せの読み物カラム（デザイン: ページ中央 / 本文幅 約760px） */
.page-body {
  box-sizing: border-box;
  max-width: 760px;
  margin-inline: auto;
  padding: 64px 20px 96px;
  line-height: 1.57; /* デザインの行ピッチ ≈22px（14px×1.57）。段落・項目は追加余白なしでこのピッチで流す */
}

.products-body {
  box-sizing: border-box;
  margin-inline: auto;
  padding: 64px 0px 96px;
}

/* リード文（タイトル直下の導入。段落同士は p の margin:0＝行ピッチのまま） */
.page-body__lead {
  margin-top: 44px;
}

/* セクション（見出し+本文のまとまり） */
.page-body__section {
  margin-top: 44px;
}

/* セクション見出し（本文よりひと回り大きく・中字。下に本文へ ≈20px） */
.page-body__heading {
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: #646464;
}

/* セクション内の段落・リストは追加余白を入れず、行ピッチ（≈22px）で連続させる
   （デザインは改行・項目間に余白を持たず一定ピッチで流れる） */

/* 番号付きリスト（reset で list-style/padding は 0。counter で「1.」を付与）
   番号は本文左端そろえ、本文は ≈16px ぶら下げインデント（折返しは本文に揃う） */
.page-body__list {
  counter-reset: doc-item;
}
.page-body__list > li {
  position: relative;
  padding-left: 16px;
}
.page-body__list > li::before {
  counter-increment: doc-item;
  content: counter(doc-item) ".";
  position: absolute;
  left: 0;
  color: #646464;
}

.page-body__section .words {
  margin-bottom: 1em;
}

/* 中黒（・）リスト：番号の代わりにマーカーを「・」にした変種 */
.page-body__list--disc > li::before {
  content: "・";
}

/* 任意：リード文とリストを視覚的に分けたい箇所に付ける上余白（半行ぶん）。
   デザイン上、直前文との間に空きがある場合のみ付与する */
.page-body__list--gap {
  margin-top: 10px;
}

/* リスト項目内の補足行（例：…）。中黒の本文位置（＝中黒1文字分インデント）にそろえ、
   折返しは「例：」の後ろにぶら下げ揃え */
.page-body__eg {
  display: block;
  padding-left: 2em;
  text-indent: -2em;
}

/* お問い合わせ先（address のイタリックを解除。メール行などの a に下線） */
.page-body__contact {
  font-style: normal;
}
.page-body__contact a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* 本文中のリンク（「こちら」等）も下線（FAQの .faq__a-inner a と同体裁） */
.page-body__section p a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------- 共通テキストページ : Tablet ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .page-body {
    padding: 56px 32px 80px;
  }
}

/* ---------- 共通テキストページ : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .page-body {
    padding: 46px 20px 56px;
  }
  .products-body {
    padding: 46px 0px 56px;
  }
  .page-title {
    font-size: 16px;
  }
  .page-body__lead {
    margin-top: 32px;
  }
  .page-body__section {
    margin-top: 32px;
  }
  .page-body__heading {
    margin-bottom: 12px;
    font-size: 15px;
  }
}

/* ===== Poplink custom styling — matched to Umnet site design ===== */
.poplink.pc011 {
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, 游ゴシック, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif !important;
  color: #646464 !important;
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08) !important;
  width: 100% !important;
  max-width: 459px !important;
  z-index: 9999 !important;
  top: 100% !important;
  left: 0 !important;
  right: auto !important;
  margin-top: 4px !important;
}
.poplink.pc011 .poplink_suggest {
  border: none !important;
  border-bottom: 1px solid #ececec !important;
  background: #fff !important;
  padding: 4px 0 !important;
}
.poplink.pc011 .poplink_suggest .word {
  color: #646464 !important;
  font-size: 13px !important;
  letter-spacing: 0.3px;
  padding: 8px 16px !important;
  cursor: pointer;
  transition:
    background-color 0.15s,
    color 0.15s;
}
.poplink.pc011 .poplink_suggest .word:hover,
.poplink.pc011 .poplink_suggest .word.over {
  background: #f5f6f8 !important;
  color: #667895 !important;
}
.poplink.pc011 .poplink_suggest .word.highlighted {
  color: #667895 !important;
  font-weight: 500 !important;
  background: transparent !important;
}
.poplink.pc011 .header {
  background: #fff !important;
  color: #646464 !important;
  font-family: "Times New Roman", "EB Garamond", "Noto Serif JP", serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 12px 16px 8px !important;
  border-bottom: 1px solid #ececec !important;
}
.poplink.pc011 .item {
  padding: 0 !important;
  border-bottom: 1px solid #f2f2f2 !important;
}
.poplink.pc011 .item:last-child {
  border-bottom: none !important;
}
.poplink.pc011 .item > a {
  display: block !important;
  padding: 12px 16px !important;
  text-decoration: none !important;
  transition: background-color 0.15s;
  overflow: hidden;
}
.poplink.pc011 .item > a:hover {
  background: #f5f6f8 !important;
}
.poplink.pc011 .item .item_left {
  width: 64px !important;
  height: 64px !important;
  margin-right: 12px !important;
  float: left !important;
}
.poplink.pc011 .item .image_box {
  width: 64px !important;
  height: 64px !important;
}
.poplink.pc011 .item .image_box img {
  width: 64px !important;
  height: 64px !important;
  object-fit: cover !important;
  display: block !important;
}
.poplink.pc011 .item .item_right {
  margin-left: 76px !important;
  width: auto !important;
  overflow: hidden !important;
}
.poplink.pc011 .item .item_right .title {
  color: #646464 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.3px;
  font-weight: 400 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.poplink.pc011 .item .item_right .summary,
.poplink.pc011 .item .item_right .any1,
.poplink.pc011 .item .item_right .any2,
.poplink.pc011 .item .item_right .any3 {
  color: #999 !important;
  font-size: 11px !important;
  margin-top: 2px !important;
}

div.poplink > div.poplink_search {
  border: none !important;
}

/* ===== ① はみ出し対策：PC・SP共通（既存 .poplink.pc011 にも適用） ===== */
.poplink.pc011,
.poplink.pc011r {
  max-height: min(70vh, 560px) !important; /* 画面高さの70%まで */
  overflow: hidden !important; /* 全体は固定枠 */
  display: flex !important;
  flex-direction: column !important;
}
/* 商品結果リストだけを内部スクロールさせ、ヘッダー等は常に見える状態に */
.poplink.pc011 .poplink_search,
.poplink.pc011r .poplink_search {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
/* スクロールバーを細く控えめに */
.poplink.pc011 .poplink_search::-webkit-scrollbar,
.poplink.pc011r .poplink_search::-webkit-scrollbar {
  width: 6px;
}
.poplink.pc011 .poplink_search::-webkit-scrollbar-thumb,
.poplink.pc011r .poplink_search::-webkit-scrollbar-thumb {
  background: #d7d7d7;
  border-radius: 3px;
}

/* ===== ② 無駄な余白の除去（スクロール結果） ===== */
/* 空の「おすすめ」等（poplink_invisible）は system の visibility:hidden で場所を取るため display:none に畳む */
div.poplink .poplink_invisible {
  display: none !important;
}
/* 商品結果の空行（any1〜any3 が空のとき）を詰める */
.poplink.pc011 .item_right .any1:empty,
.poplink.pc011 .item_right .any2:empty,
.poplink.pc011 .item_right .any3:empty,
.poplink.pc011r .item_right .any1:empty,
.poplink.pc011r .item_right .any2:empty,
.poplink.pc011r .item_right .any3:empty {
  display: none !important;
  margin: 0 !important;
}

/* ===== 検索パネルの閉じるボタン（SPでサジェストを閉じやすくする） =====
   既存の検索パネル（入力＋送信）のレイアウトは変えず、検索ボックス直下＝
   サジェスト(poplink)領域の右上に浮かせる（absolute・最前面）。 */
.search-panel__close {
  display: none;
}
@media (max-width: 767px) {
  /* サジェスト(poplink: z-index 9999)より前面で閉じられるようパネルを最前面に */
  .search-panel {
    z-index: 10000;
  }
  /* 検索ボックスの直下、右寄せに小さく浮かせる（パネルのフローには影響しない）
     表示は「サジェスト(poplink)が出ている時」だけ（.is-visible を JS が付与） */
  .search-panel__close {
    position: absolute;
    top: 100%;
    right: 10px;
    margin-top: 10px;
    z-index: 10001;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #ffffff;
    border: 1px solid #e6e6e6;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  }
  .search-panel__close.is-visible {
    display: block;
  }
  .search-panel__close::before,
  .search-panel__close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 1px;
    background-color: #646464;
  }
  .search-panel__close::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .search-panel__close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
}

/* ==========================================================================
   ★★★ CONTACT（お問い合わせ）ページ専用 ★★★
   - 中央寄せ1カラム（フォーム幅 約560px）
   - フォーム要素はシステムCSS（fs_theme）の枠・角丸・focus装飾を打ち消してデザインに合わせる
   - 共通の .page-title（中央見出し）を流用
   ========================================================================== */
.contact {
  box-sizing: border-box;
  max-width: 560px;
  margin-inline: auto;
  padding: 64px 20px 96px;
}

/* リード文（中央） */
.contact__lead {
  margin-top: 36px;
  text-align: center;
  font-size: 14px;
}

/* 「よくあるご質問はこちら」ピル（中央・角丸フル） */
.contact__faq {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 266px;
  max-width: 100%;
  height: 46px;
  margin: 36px auto 0;
  border: 1px solid #cbcbcb;
  border-radius: 999px;
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .contact__faq:hover {
    opacity: 1;
    border-color: #646464;
  }
}

/* フォーム本体 */
.contact-form {
  display: grid;
  gap: 28px;
  margin-top: 72px;
}

/* 姓・名 の2カラム */
.contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

.contact-form__label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  color: #646464;
}
/* WP(CF7)側で改行が <br> 化してラベル→入力欄が間延びするのを保険で解消
   （autop無効化と併用。静的版は <br> が無いので無害） */
.contact-form__field br,
.contact-form__row br {
  display: none;
}

.contact-form__req {
  margin-left: 3px;
  color: #db496b; /* 必須マーク */
}

/* 入力欄：システム既定の枠・角丸・focus装飾を打ち消してデザインに合わせる */
.contact-form__input,
.contact-form__textarea {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #cbcbcb;
  border-radius: 6px;
  background-color: #ffffff;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
  -webkit-appearance: none;
  appearance: none;
}

.contact-form__input {
  height: 40px;
  padding: 0 12px;
}

.contact-form__textarea {
  min-height: 311px;
  padding: 12px;
  line-height: 1.7;
  resize: vertical;
}

.contact-form__input:focus,
.contact-form__textarea:focus {
  outline: none;
  border-color: #8c8c8c;
  box-shadow: none;
}

/* 送信ボタン（緑・中央） */
.contact-form__submit {
  display: block;
  width: 260px;
  max-width: 100%;
  min-height: 46px;
  margin: 20px auto 0;
  border: 0;
  border-radius: 0;
  background-color: #08b783;
  color: #ffffff;
  font-family: var(--font-base);
  font-size: 14px;
  letter-spacing: 0.1em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
@media (hover: hover) {
  .contact-form__submit:hover {
    opacity: 0.85;
  }
}

/* ---- Contact Form 7（WP版お問い合わせ）出力向けの補完 ----
   - ショートコードは html_class="contact-form" で form 要素に .contact-form を付与
   - CF7既定CSS（.wpcf7 form … の(0,2,1)〜(0,3,1)）に勝つよう .contact-form.wpcf7-form で詳細度確保 */
.contact-form .wpcf7-form-control-wrap {
  display: block; /* 既定はinline。label下で全幅にする */
}
.contact-form .wpcf7-not-valid {
  border-color: #db496b; /* 未入力・不正の入力欄 */
}
.contact-form.wpcf7-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: #db496b;
}
/* 送信結果メッセージ（バリデーションエラー等）。状態別のCF7既定色を打ち消して統一 */
.contact-form.wpcf7-form .wpcf7-response-output,
.contact-form.wpcf7-form.invalid .wpcf7-response-output,
.contact-form.wpcf7-form.unaccepted .wpcf7-response-output,
.contact-form.wpcf7-form.failed .wpcf7-response-output,
.contact-form.wpcf7-form.aborted .wpcf7-response-output {
  margin: 0;
  padding: 12px 16px;
  border: 1px solid #db496b;
  border-radius: 6px;
  font-size: 13px;
  color: #db496b;
  text-align: center;
}
/* 送信成功時は完了ページへ遷移するため成功メッセージは出さない */
.contact-form.wpcf7-form.sent .wpcf7-response-output {
  display: none;
}
/* 送信中スピナーはボタン下・中央 */
.contact-form.wpcf7-form .wpcf7-spinner {
  display: block;
  margin: 12px auto 0;
}

/* ---------- CONTACT : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .contact {
    padding: 36px 20px 56px;
  }
  .contact__lead {
    margin-top: 28px;
  }
  .contact__faq {
    margin-top: 28px;
  }
  .contact-form {
    margin-top: 48px;
  }
  .contact-form__row {
    gap: 12px;
  }
  /* iOS フォーカス時の自動ズーム防止（16px以上） */
  .contact-form__input,
  .contact-form__textarea {
    font-size: 16px;
  }
  .contact-form__submit {
    width: 100%;
    min-height: 50px;
  }
}

/* ==========================================================================
   ★★★ お問い合わせ（送信完了）ページ専用 ★★★
   - 中央寄せのh1（共通 .page-title）＋ 完了メッセージ
   ========================================================================== */
.completed {
  box-sizing: border-box;
  max-width: 560px;
  margin-inline: auto;
  padding: 80px 20px 120px;
  text-align: center;
}

.completed__message {
  margin-top: 46px;
  font-size: 16px;
  line-height: 2;
}

/* ---------- お問い合わせ（送信完了）: SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .completed {
    padding: 48px 20px 72px;
  }
  .completed__message {
    margin-top: 32px;
    line-height: 1.9;
  }
}

/* ==========================================================================
   ★★★ よくあるご質問（FAQ）ページ専用 ★★★
   - 中央寄せ1カラム（幅760px）＋ Q/A アコーディオン（+/−）＋ MORE で続きを表示
   - 共通の .page-title（中央見出し）を流用
   ========================================================================== */
.faq {
  box-sizing: border-box;
  max-width: 760px;
  margin-inline: auto;
  padding: 64px 20px 96px;
}

.faq__list {
  margin-top: 46px;
}

/* 各Q/A項目（下線で区切り） */
.faq__item {
  border-bottom: 1px solid #e3e3e3;
}

/* Q行（クリックで開閉。1行=約80px、Qを上下中央に） */
.faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  padding: 27px 0;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: #3c3c3c;
  text-align: left;
  cursor: pointer;
}

/* +/− アイコン（右端） */
.faq__icon {
  position: relative;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
}
.faq__icon::before,
.faq__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #646464;
  transition: opacity 0.2s ease;
}
.faq__icon::before {
  width: 12px;
  height: 1px;
  transform: translate(-50%, -50%);
}
.faq__icon::after {
  width: 1px;
  height: 12px;
  transform: translate(-50%, -50%);
}
/* 開いている時は縦線を消して「−」に */
.faq__item.is-open .faq__icon::after {
  opacity: 0;
}

/* A（回答）：max-height で開閉 */
.faq__a {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.faq__item.is-open .faq__a {
  /* 最長回答（返品・交換の条件）がSPで約580pxのため余裕を持たせる */
  max-height: 1000px;
}
.faq__a-inner {
  padding: 0 0 30px;
  font-size: 14px;
  line-height: 1.9;
  color: #646464;
}
.faq__a-inner p + p {
  margin-top: 14px;
}
.faq__a-inner a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* MORE ボタン（続きのQ&Aを表示）。見た目は index と共通の .more-button を流用 */
.faq__more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}
.faq__more-wrap[hidden] {
  display: none;
}

/* MORE で表示する続き項目（初期は非表示） */
.faq__item--more {
  display: none;
}
.faq__item--more.is-shown {
  display: block;
}

/* ---------- FAQ : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .faq {
    padding: 36px 20px 56px;
  }
  .faq__list {
    margin-top: 28px;
  }
  .faq__q {
    gap: 16px;
    padding: 20px 0;
    font-size: 15px;
  }
  .faq__a-inner {
    padding-bottom: 22px;
  }
  .faq__more-wrap {
    margin-top: 36px;
  }
}

/* ==========================================================================
   ★★★ Umnet（ABOUT / ブランドステートメント）ページ専用 ★★★
   - 中央寄せの細いカラム（約430px）／左寄せの明朝テキスト／段落間ひろめ＋署名
   ========================================================================== */
.about-umnet {
  box-sizing: border-box;
  max-width: 460px;
  margin-inline: auto;
  padding: 64px 20px 96px;
  font-family: var(--font-serif-jp);
  color: #646464;
  letter-spacing: 0.05em;
}

/* タイトル「Umnet」（英字セリフ） */
.about-umnet__title {
  font-family: var(--font-serif);
  font-size: 25px;
  letter-spacing: 0.06em;
  color: #3c3c3c;
}

.about-umnet__body {
  margin-top: 36px;
}

.about-umnet p {
  font-size: 15px;
  line-height: 1.8;
}

/* 1文＝1段落。段落間 ≈48px */
.about-umnet__group p + p {
  margin-top: 23px;
}

/* ブロック間 ≈78px */
.about-umnet__group + .about-umnet__group {
  margin-top: 53px;
}

/* 署名（デザイナー名）もブロック相当の間隔をあける */
.about-umnet__sign {
  margin-top: 53px;
}

/* ---------- Umnet : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .about-umnet {
    padding: 36px 20px 56px;
  }
  .about-umnet__title {
    font-size: 23px;
  }
  .about-umnet p {
    font-size: 14px;
  }
  .about-umnet__body {
    margin-top: 28px;
  }
  .about-umnet__group p + p {
    margin-top: 18px;
  }
  .about-umnet__group + .about-umnet__group,
  .about-umnet__sign {
    margin-top: 40px;
  }
}

/* ==========================================================================
   ★★★ Umnet Shibuya（shibuya.html） ★★★
   - 中央760pxカラム：セリフ見出し＋中央リード＋店内写真2枚＋アクセス/所在地＋地図
   - 地図は Google マップ埋め込みを filter でモノクロ化
   ========================================================================== */
.shibuya {
  box-sizing: border-box;
  max-width: 800px; /* コンテンツ760 + 左右padding20 */
  margin-inline: auto;
  padding: 64px 20px 100px;
  color: #646464;
}

/* タイトル（英字セリフ・中央） */
.shibuya__title {
  font-family: var(--font-serif);
  font-size: 30px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-align: center;
  color: #333333;
}

.shibuya__lead {
  margin-top: 44px;
  text-align: center;
  font-size: 14px;
  line-height: 2;
}

/* 店内写真（3:2・縦積み） */
.shibuya__photos {
  display: grid;
  gap: 24px;
  margin-top: 64px;
}
.shibuya__photos img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* アクセス / 所在地（ラベル｜値。行間に細罫線） */
.shibuya__info {
  margin-top: 60px;
}
.shibuya__info-row {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 24px;
  align-items: baseline;
  font-size: 14px;
  line-height: 1.8;
}
.shibuya__info-row + .shibuya__info-row {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #d9d9d9;
}
/* ラベルは「所 在 地」のように両端揃え（アクセスと同幅に見せる） */
.shibuya__info-row dt {
  text-align: justify;
  text-align-last: justify;
}

/* Google マップ（モノクロ） */
.shibuya__map {
  margin-top: 60px;
}
.shibuya__map iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 760 / 416;
  border: 0;
  filter: grayscale(1);
}

/* ---------- Umnet Shibuya : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .shibuya {
    padding: 36px 20px 56px;
  }
  .shibuya__title {
    font-size: 23px;
  }
  .shibuya__lead {
    margin-top: 28px;
    text-align: left;
  }
  .shibuya__photos {
    margin-top: 40px;
    gap: 14px;
  }
  .shibuya__info {
    margin-top: 48px;
  }
  .shibuya__info-row {
    grid-template-columns: 72px 1fr;
    gap: 16px;
    font-size: 13px;
  }
  .shibuya__map {
    margin-top: 40px;
  }
}

/* ==========================================================================
   ★★★ ログイン（コマクリ システムページ）の見た目調整 ― CSSのみで上書き ★★★
   - HTMLは編集不可（fs-c-loginForm 等のシステム出力）。system CSS を後勝ち＋!important で上書き
   - 【重要】fs-c-* は他のシステムページ（カート/会員登録/マイページ等）にも出るため、
     すべて body の固有クラス「.fs-body-login」配下にスコープし、ログインページ限定にする
   - デザイン: 中央カラム(約460px) / ラベル上＋全幅入力 / 必須*(ピンク) / 緑のログインボタン /
     下部に「新しいアカウントを作成」リンク
   ========================================================================== */

/* フォーム全体を中央カラムに（h1.page-title は共通スタイルで中央表示済み）
   ※ fs_theme は ≥960px で .fs-c-loginForm を display:flex の2カラムにするため block で上書き */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-loginForm {
  box-sizing: border-box;
  display: block !important;
  max-width: 460px;
  margin: 40px auto 0 !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-loginForm > * {
  flex-basis: auto !important; /* fs_theme の 50% 指定を無効化 */
}

:is(.fs-body-login, .fs-body-cart-login) .fs-c-subSection {
  margin-bottom: 18px !important;
}

/* fs_theme の入力エリアのグレー背景・余白を解除（デザインは白・枠線のみ） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
/* フィールドの各ラッパーを全幅ブロックに（入力欄が狭くならないように） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-fsLogin,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputInformation,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-fsLoginField,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputField,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputField__field {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* セクション見出し「会員登録がお済みのお客様」はデザインに無いので非表示 */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-registeredUsers__title {
  display: none !important;
}

/* 入力テーブルをブロック化（ラベル上・入力下・全幅） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable tbody,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable tr,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable th,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable td {
  display: block !important;
  width: auto !important;
  border: 0 !important;
  padding: 0 !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable tr + tr {
  margin-top: 23px !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable th.fs-c-inputTable__headerCell {
  padding-bottom: 9px !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable__label {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #646464 !important;
}

/* 必須マーク「(必須)」→「*」（ピンク）。システム側の span は潰れて描画されないため、
   span は非表示にし、ラベルの ::after で「*」を付与 */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-requiredMark {
  display: none !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable__label::after {
  content: "*";
  margin-left: 2px;
  font-size: 14px;
  color: #db496b;
}

/* 入力欄（system の枠・角丸・focus装飾を打ち消し、デザインに合わせる） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable input[type="text"],
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid #646464 !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px !important; /* iOS フォーカス時の自動ズーム防止 */
  color: #646464 !important;
  -webkit-appearance: none;
  appearance: none;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputTable input:focus {
  outline: none;
  border-color: #8c8c8c !important;
  box-shadow: none !important;
}
/* パスワード欄を相対配置に（入力グループ） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputGroup {
  position: relative;
  display: block !important;
}
/* パスワード入力は右に「お忘れの方」リンク分の余白を確保（入力文字が重ならないように） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputGroup input[type="password"] {
  padding-right: 160px !important;
}
/* パスワード表示切替ボタンはデザインに無いので非表示 */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--displayPassword {
  display: none !important;
}

/* ログインボタン（緑・PC中央260px / SP全幅） */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-buttonContainer--login {
  margin-top: 46px !important;
  text-align: center;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--login {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--login .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  :is(.fs-body-login, .fs-body-cart-login) .fs-c-button--login:hover {
    opacity: 0.85;
  }
}

/* 「パスワードをお忘れの方」をパスワード入力欄の右内側に重ねる（デザイン通り）。
   リンクはDOM上フォームの後ろにあるため、.fs-c-inputInformation 基準で絶対配置。
   top はこのページのフィールド構成（ラベル+入力×2）から算出した固定値 */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputInformation {
  position: relative;
}

:is(.fs-body-login, .fs-body-cart-login) .fs-c-inputInformation__link {
  position: absolute;
  top: 130px; /* パスワード入力の上端（メールラベル+入力+間隔+パスワードラベル） */
  right: 14px;
  height: 40px; /* 入力欄高さに合わせて縦中央配置 */
  display: flex;
  align-items: center;
  margin: 0 !important;
  pointer-events: none; /* リンク以外は入力欄のクリックを妨げない */
}

:is(#fs_Login) .fs-c-inputInformation__link {
  position: absolute;
  top: 125px; /* パスワード入力の上端（メールラベル+入力+間隔+パスワードラベル） */
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-textLink {
  pointer-events: auto;
  font-size: 11px;
  color: #aaa !important;
  text-decoration: underline;
}

/* 新規会員エリア → 下部の「新しいアカウントを作成」テキストリンクに */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-newUsers {
  margin-top: 18px;
  text-align: center;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-newUsers__title,
:is(.fs-body-login, .fs-body-cart-login) .fs-c-newUsers__message {
  display: none !important; /* 見出し・説明文はデザインに無いので非表示 */
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-buttonContainer--memberRegister {
  margin-top: 0 !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--memberRegister {
  display: inline-block !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important; /* システム由来の薄い影（枠に見える）を除去 */
  background: transparent !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
}
/* ラベル「会員登録」→「新しいアカウントを作成」に差し替え */
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--memberRegister .fs-c-button__label {
  font-size: 0 !important;
  color: #646464 !important;
}
:is(.fs-body-login, .fs-body-cart-login) .fs-c-button--memberRegister .fs-c-button__label::after {
  content: "新しいアカウントを作成";
  font-size: 14px;
}

.fs-c-anotherLogin__message {
  margin-bottom: 20px;
}

/* ---------- ログイン : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  :is(.fs-body-login, .fs-body-cart-login) .fs-c-button--login {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ パスワード再設定（コマクリ システムページ）― CSSのみで上書き ★★★
   - 【重要】fs-c-* は他ページと共有のため、すべて body 固有の .fs-body-forgotPassword 配下にスコープ
   - デザイン: 中央カラム(約460px) / リード文 / 入力欄(メールアドレス・仮パスワード) / 緑ボタン「パスワードを再設定する」/
     下部に「ログイン画面に戻る」リンク
   - 仮パスワードは必須項目のため表示（メールアドレスと同フォーマット）
   ========================================================================== */

/* フォーム全体を中央カラムに */
.fs-body-forgotPassword .fs-c-inputInformation {
  box-sizing: border-box;
  max-width: 460px;
  margin: 24px auto 0 !important;
}

/* リード文「ご登録されているメールアドレスをご入力ください。」（中央） */
.fs-body-forgotPassword .fs-c-inputInformation__message {
  margin: 8px 0 44px !important;
  padding: 0 !important;
  text-align: center;
  font-size: 14px;
  color: #646464;
}
.fs-body-forgotPassword .fs-c-inputInformation__message p {
  margin: 0;
}

/* fs_theme の入力エリアのグレー背景・余白を解除（デザインは白・枠線のみ） */
.fs-body-forgotPassword .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
.fs-body-forgotPassword .fs-c-forgotPasswordField,
.fs-body-forgotPassword .fs-c-inputField,
.fs-body-forgotPassword .fs-c-inputField__field {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 入力テーブルをブロック化（ラベル上・入力下・全幅） */
.fs-body-forgotPassword .fs-c-inputTable,
.fs-body-forgotPassword .fs-c-inputTable tbody,
.fs-body-forgotPassword .fs-c-inputTable tr,
.fs-body-forgotPassword .fs-c-inputTable th,
.fs-body-forgotPassword .fs-c-inputTable td {
  display: block !important;
  width: auto !important;
  border: 0 !important;
  padding: 0 !important;
}
.fs-body-forgotPassword .fs-c-inputTable tr + tr {
  margin-top: 23px !important; /* メールアドレスと仮パスワードのフィールド間 */
}
.fs-body-forgotPassword .fs-c-inputTable th.fs-c-inputTable__headerCell {
  padding-bottom: 9px !important;
}
.fs-body-forgotPassword .fs-c-inputTable__label {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #646464 !important;
}

/* 必須マーク「(必須)」→「*」（ピンク） */
.fs-body-forgotPassword .fs-c-requiredMark {
  display: none !important;
}
.fs-body-forgotPassword .fs-c-inputTable__label::after {
  content: "*";
  margin-left: 2px;
  font-size: 14px;
  color: #db496b;
}

/* 入力欄（system の枠・角丸・focus装飾を打ち消し、デザインに合わせる） */
.fs-body-forgotPassword .fs-c-inputTable input[type="text"],
.fs-body-forgotPassword .fs-c-inputTable input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid #646464 !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px !important; /* iOS フォーカス時の自動ズーム防止 */
  color: #646464 !important;
  -webkit-appearance: none;
  appearance: none;
}
.fs-body-forgotPassword .fs-c-inputTable input:focus {
  outline: none;
  border-color: #8c8c8c !important;
  box-shadow: none !important;
}
.fs-body-forgotPassword .fs-c-button--displayPassword {
  display: none !important;
}

/* 送信ボタン（緑・PC中央260px / SP全幅）。ラベル「送信」→「パスワードを再設定する」 */
.fs-body-forgotPassword .fs-c-buttonContainer--send {
  margin-top: 46px !important;
  text-align: center;
}
.fs-body-forgotPassword .fs-c-button--send {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-forgotPassword .fs-c-button--send .fs-c-button__label {
  font-size: 0 !important;
  color: #fff !important;
}
.fs-body-forgotPassword .fs-c-button--send .fs-c-button__label::after {
  content: "パスワードを再設定する";
  font-size: 15px;
}
@media (hover: hover) {
  .fs-body-forgotPassword .fs-c-button--send:hover {
    opacity: 0.85;
  }
}

/* 「ログイン画面に戻る」リンク（中央・グレー下線）。.back__regist はフリーパーツ */
.fs-body-forgotPassword .back__regist {
  margin-top: 18px;
  text-align: center;
}
.fs-body-forgotPassword .back__regist--word {
  margin: 0;
}
.fs-body-forgotPassword .back__regist--word a {
  font-size: 14px;
  color: #646464;
  text-decoration: underline;
}

/* ---------- パスワード再設定 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-forgotPassword .fs-c-button--send {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ 新しいパスワードの登録（コマクリ システムページ）― CSSのみで上書き ★★★
   - パスワード再設定（fs-body-forgotPassword）と同じ方針。.fs-body-resetPassword 配下にスコープ
   - 構成: 共通 .page-body ラッパー（760px列）の中に、フォームを460px中央で配置
   - 入力: 仮パスワード／変更後のパスワード（どちらも必須・同フォーマット）
   - 緑ボタン「登録」（PC中央260px / SP全幅）
   ========================================================================== */

/* フォームを中央カラム（460px）に。外側の余白は .page-body が担うので padding は無し */
.fs-body-resetPassword .fs-c-inputInformation {
  box-sizing: border-box;
  max-width: 460px;
  margin: 24px auto 0 !important;
  padding: 0;
}

/* リード文（中央） */
.fs-body-resetPassword .fs-c-inputInformation__message {
  margin: 8px 0 44px !important;
  padding: 0 !important;
  text-align: center;
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-resetPassword .fs-c-inputInformation__message p {
  margin: 0;
}

/* fs_theme の入力エリアのグレー背景・余白を解除 */
.fs-body-resetPassword .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
.fs-body-resetPassword .fs-c-changePasswordField,
.fs-body-resetPassword .fs-c-inputField,
.fs-body-resetPassword .fs-c-inputField__field {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 入力テーブルをブロック化（ラベル上・入力下・全幅） */
.fs-body-resetPassword .fs-c-inputTable,
.fs-body-resetPassword .fs-c-inputTable tbody,
.fs-body-resetPassword .fs-c-inputTable tr,
.fs-body-resetPassword .fs-c-inputTable th,
.fs-body-resetPassword .fs-c-inputTable td {
  display: block !important;
  width: auto !important;
  border: 0 !important;
  padding: 0 !important;
}
.fs-body-resetPassword .fs-c-inputTable tr + tr {
  margin-top: 23px !important; /* フィールド間 */
}
.fs-body-resetPassword .fs-c-inputTable th.fs-c-inputTable__headerCell {
  padding-bottom: 9px !important;
}
.fs-body-resetPassword .fs-c-inputTable__label {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #646464 !important;
}

/* 必須マーク「(必須)」→「*」（ピンク） */
.fs-body-resetPassword .fs-c-requiredMark {
  display: none !important;
}
.fs-body-resetPassword .fs-c-inputTable__label::after {
  content: "*";
  margin-left: 2px;
  font-size: 14px;
  color: #db496b;
}

/* 入力欄（system の枠・角丸・focus装飾を打ち消し） */
.fs-body-resetPassword .fs-c-inputTable input[type="text"],
.fs-body-resetPassword .fs-c-inputTable input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid #cbcbcb !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px !important;
  color: #646464 !important;
  -webkit-appearance: none;
  appearance: none;
}
.fs-body-resetPassword .fs-c-inputTable input:focus {
  outline: none;
  border-color: #8c8c8c !important;
  box-shadow: none !important;
}
.fs-body-resetPassword .fs-c-button--displayPassword {
  display: none !important;
}

/* 登録ボタン（緑・PC中央260px / SP全幅）。ラベルは「登録」のまま */
.fs-body-resetPassword .fs-c-buttonContainer--register {
  margin-top: 52px !important;
  text-align: center;
}
.fs-body-resetPassword .fs-c-button--register {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-resetPassword .fs-c-button--register .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  .fs-body-resetPassword .fs-c-button--register:hover {
    opacity: 0.85;
  }
}

/* ---------- 新しいパスワードの登録 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-resetPassword .fs-c-button--register {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ 新規アカウント登録（コマクリ システムページ）― CSSのみで上書き ★★★
   - 【重要】fs-c-* は他ページ（カート・マイページ等）と共有のため、すべて
     body 固有の :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) 配下にスコープする
   - 構成: 共通 .page-body（760px列）の中にフォームを460px中央で配置
   - システム上 削除できない項目（住所詳細・身長など）は残しつつ、デザインの
     トーンに合わせて整える
   - 姓名／姓名（フリガナ）はラベルを各入力枠の上に分割表示（CSSの :has + 擬似要素）
   - 性別「指定なし」非表示・女性/男性の並び替え／ニュースレター「否」非表示・
     「可」→「受け取る」／プライバシー同意は非表示でチェック維持（JS は script.js）
   ========================================================================== */

/* フォームを中央カラム（460px）に。外側余白は .page-body が担うので padding なし */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputInformation {
  box-sizing: border-box;
  max-width: 460px;
  margin: 24px auto 0 !important;
  padding: 0;
}

/* リード文「以下の項目をご入力ください。」（中央） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputInformation__message {
  margin: 8px 0 40px !important;
  padding: 0 !important;
  text-align: center;
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputInformation__message p {
  margin: 0;
}

/* fs_theme のグレー背景・余白を解除。fieldset の既定枠も除去 */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-memberInfoField,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-privacyPolicyAgreeField {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  min-width: 0;
}

/* 入力テーブルをブロック化（ラベル上・入力下・全幅） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tbody,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable th,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable td {
  display: block !important;
  width: auto !important;
  border: 0 !important;
  padding: 0 !important;
}
/* tbody を2カラムグリッド化。各項目は既定で全幅（1/-1）、
   「性別（左）／身長（右）」だけ同じ行に横並びにする（デザイン再現）。
   行間は row-gap、ラベル–入力間は headerCell の padding-bottom が担う */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tbody {
  display: grid !important;
  grid-template-columns: 42% 1fr;
  column-gap: 3%;
  row-gap: 24px;
  align-items: start;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr {
  grid-column: 1 / -1; /* 既定は全幅 */
  margin: 0 !important;
}
/* 性別＝左カラム／身長＝右カラム（隣接する2行を同じグリッド行へ） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_gender-01) {
  grid-column: 1 / 2;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_additionalItemadditional1) {
  grid-column: 2 / 3;
}
/* ラベルと入力の間。上の blockify（th{padding:0}）より詳細度を上げて勝たせる */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable th.fs-c-inputTable__headerCell {
  padding-bottom: 5px !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputField,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputField__field {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable__label {
  display: inline-block;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #646464 !important;
}

/* 必須マーク：ログインページと統一（システムの span は隠し、ラベルの ::after で「*」）。
   :has() で必須項目（requiredMark を持つラベル）だけに付与し、任意項目には付けない */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-requiredMark {
  display: none !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable__label:has(.fs-c-requiredMark)::after {
  content: "*";
  margin-left: 2px;
  font-size: 14px;
  color: #db496b;
}

/* テキスト系入力欄（メール・パスワード・郵便番号・住所・身長 等） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable input[type="text"],
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable input[type="tel"],
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid #646464 !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px !important; /* iOS フォーカス時の自動ズーム防止 */
  color: #646464 !important;
  -webkit-appearance: none;
  appearance: none;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable input:focus {
  outline: none;
  border-color: #8c8c8c !important;
  box-shadow: none !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--displayPassword {
  display: none !important;
}

/* 郵便番号：システムの 8em 固定幅を解除して全幅に */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputField__field--zipCode {
  display: block !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-input--zipCode {
  flex-basis: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

/* ---- 姓名／姓名（フリガナ）：ラベルを各入力枠の上に分割配置 ---- */
/* 元の結合ラベル（th）は隠す */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable__headerCell:has(#fs_label_name),
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable__headerCell:has(#fs_label_nameKana) {
  display: none !important;
}
/* 2入力を横並び→縦積み（各全幅） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup {
  display: block !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup > * + * {
  margin-left: 0 !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item + .fs-c-inputTextGroup__item {
  margin-top: 24px !important;
}
/* 各 item を「ラベル + *（同じ行）／入力（次行・全幅）」のflexに */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item {
  display: flex !important;
  flex: none !important;
  flex-wrap: wrap;
  align-items: baseline;
  width: auto !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item::before {
  order: 1;
  margin-bottom: 9px;
  font-size: 14px;
  color: #646464;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item::after {
  order: 2;
  content: "*";
  margin: 0 0 9px 2px;
  font-size: 14px;
  color: #db496b;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item > input {
  order: 3;
  flex: 0 0 100%;
}
/* 各サブラベルの文言（入力IDで指定。フィールド構造に追従して堅牢） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item:has(#fs_input_lastName)::before {
  content: "姓";
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item:has(#fs_input_firstName)::before {
  content: "名";
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item:has(#fs_input_lastNameKana)::before {
  content: "姓（フリガナ）";
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTextGroup__item:has(#fs_input_firstNameKana)::before {
  content: "名（フリガナ）";
}

/* ---- ドロップダウン（都道府県・生年月日）をデザインの枠に ---- */
/* 罫線は select 本体に付け、テキスト入力と同じ枠に統一（二重線・段差を防ぐ）。
   wrapper の枠は消し、矢印 ::after だけ select の上に重ねる */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-dropdown {
  box-sizing: border-box;
  height: 40px;
  border: 0;
  background: transparent;
  overflow: visible;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-dropdown__menu {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 0 2.4em 0 12px;
  border: 1px solid #646464;
  border-radius: 6px;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 16px;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-dropdown::after {
  top: 1px;
  right: 1px;
  bottom: 1px;
  background: transparent;
  border-left: 0;
  color: #646464;
  font-size: 1.4rem;
}
/* 生年月日：年・月・日の3つを横並びで適切な幅に */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__year {
  width: 120px !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__month,
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__date {
  width: 88px !important;
}

/* ---- ラジオ（性別・ニュースレター）の見た目 ---- */
/* radioGroup は .fs-c-inputField__field でもあるため、上の display:block 化を
   打ち消して flex を再指定（並び替え order / 横並びを効かせる） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radioGroup {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: 8px 24px !important;
  align-items: center;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radioGroup > * {
  flex: 0 0 auto !important;
}
/* 性別の女性/男性ラジオを、右隣「身長」入力欄(高さ40px)の縦中央に合わせる
   （radioGroup を 40px の高さにして align-items:center で中央寄せ） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_gender-01) .fs-c-radioGroup {
  min-height: 40px;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio__radioLabelText {
  font-size: 14px;
  color: #646464;
}
/* ラジオ：細い1px枠・薄グレーの円。選択時はグレーのドット（デザインに合わせ青を打ち消し） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio__radioMark {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0 7px 0 0;
  border: 1px solid #b5b5b5;
  background: #fff;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio__radio:checked:enabled + label > .fs-c-radio__radioMark {
  border-color: #646464;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio__radio:checked:enabled + label > .fs-c-radio__radioMark::before {
  width: 8px;
  height: 8px;
  background: #646464;
}
/* 性別：指定なし(00)を非表示／女性(02)→男性(01)の順に並べ替え */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio:has(#fs_input_gender-00) {
  display: none !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio:has(#fs_input_gender-02) {
  order: 1;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio:has(#fs_input_gender-01) {
  order: 2;
}
/* ニュースレター：否(02)を非表示／可(01)の文言を「受け取る」に */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-radio:has(#fs_input_newsletter-02) {
  display: none !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) #fs_input_newsletter-01 + label .fs-c-radio__radioLabelText {
  font-size: 0;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) #fs_input_newsletter-01 + label .fs-c-radio__radioLabelText::after {
  content: "受け取る";
  font-size: 14px;
  color: #646464;
}
/* ニュースレター：補足説明を「受け取る」の隣に配置（PC）。
   inputField を flex 化し、受け取る(左)＝固定幅／説明(右)＝残り幅で縦中央に */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_newsletter-01) .fs-c-inputField {
  display: flex !important;
  align-items: center;
  column-gap: 20px;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_newsletter-01) .fs-c-inputField > .fs-c-radioGroup {
  flex: 0 0 auto;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputField__explanation {
  flex: 1 1 auto;
  margin: 0;
  font-size: 10px;
  letter-spacing: -0.5px;
  line-height: 1.6;
  color: #646464;
}

/* プライバシーポリシー同意：非表示（HTMLで checked 済みのため同意状態を維持） */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-privacyPolicyAgreeField {
  display: none !important;
}

/* 登録ボタン（緑・PC中央260px / SP全幅）。ラベル「登録」→「アカウントを作成」 */
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-buttonContainer--confirmRegister {
  margin-top: 48px !important;
  text-align: center;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--confirmRegister {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--confirmRegister .fs-c-button__label {
  font-size: 0 !important;
  color: #fff !important;
}
:is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--confirmRegister .fs-c-button__label::after {
  content: "アカウントを作成";
  font-size: 15px;
  font-weight: 700;
}
@media (hover: hover) {
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--confirmRegister:hover {
    opacity: 0.85;
  }
}

/* ---------- 新規アカウント登録 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-button--confirmRegister {
    width: 100%;
    min-height: 52px;
  }
  /* 生年月日：狭い画面でも 年/月/日 を1行に収める */
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__year {
    width: 104px !important;
  }
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__month,
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputDate__date {
    width: 78px !important;
  }
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-dropdownGroup > .fs-c-dropdown:not(:first-of-type) {
    margin-left: 8px !important;
  }
  /* ニュースレター：SP は説明文を「受け取る」の下に回す（デザイン通り） */
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputTable tr:has(#fs_input_newsletter-01) .fs-c-inputField {
    display: block !important;
  }
  :is(.fs-body-register, .fs-body-my-account-settings-edit, .fs-body-my-addressbook-new, .fs-body-customerDetails, .fs-body-newsletter-subscribe, .fs-body-newsletter-unsubscribe) .fs-c-inputField__explanation {
    margin-top: 8px;
    font-size: 12px;
  }
}

/* ==========================================================================
   ★★★ カート経由の会員登録（お客様情報入力 / fs-body-customerDetails）★★★
   - 入力項目は新規登録グループを共用（上の :is に .fs-body-customerDetails 追加済）
   - 身長列が無いので性別を全幅に／同意・チェックボックス・パスワード・ボタンを装飾
   - フォームは .fs-c-inputInformation が 460px 中央なので各要素は幅指定不要
   ========================================================================== */
/* 性別を全幅に（身長列が無く 42% になるのを打ち消す） */
.fs-body-customerDetails .fs-c-inputTable tr:has(#fs_input_gender-01) {
  grid-column: 1 / -1 !important;
}
/* 同意/プライバシー fieldset の既定枠・余白解除 */
.fs-body-customerDetails .fs-c-agreementField {
  margin: 32px 0 0;
  padding: 0;
  border: 0;
  min-width: 0;
}
.fs-body-customerDetails .fs-c-privacyPolicyAgreeField {
  margin: 18px 0 0 !important;
  padding: 0;
  border: 0;
  min-width: 0;
}
.fs-body-customerDetails .fs-c-agreementConfirmationArea__message {
  margin-bottom: 14px;
  font-size: 13px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-customerDetails .fs-c-agreementConfirmation + .fs-c-agreementConfirmation {
  margin-top: 18px;
}
.fs-body-customerDetails .fs-c-agreementConfirmation__message {
  margin-bottom: 10px;
  font-size: 12px;
  line-height: 1.7;
  color: #8c8c8c;
}
/* 会員登録特典リスト（チェックマーク付き） */
.fs-body-customerDetails .fs-p-listWithCheckmark {
  margin: 8px 0;
  padding: 0;
  list-style: none;
}
.fs-body-customerDetails .fs-p-listWithCheckmark li {
  position: relative;
  padding-left: 18px;
  font-size: 12px;
  line-height: 1.85;
}
.fs-body-customerDetails .fs-p-listWithCheckmark li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #08b783;
}
/* チェックボックス（会員規約・メルマガ・プライバシー） */
.fs-body-customerDetails .fs-c-checkbox__label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.6;
  color: #646464;
}
.fs-body-customerDetails .fs-c-checkbox__checkMark {
  flex: 0 0 auto;
  margin-top: 1px;
  /* サイト調に：既定の青（#2559a8/#1f5da0）→ 緑#08b783。枠は入力欄系 #cbcbcb。
     チェック(白)はシステムの fs-icon をそのまま利用（会員規約同意/ニュースレター/プライバシー 全チェック共通） */
  border: 1.5px solid #cbcbcb;
  border-radius: 2px;
  background: #fff;
  transition:
    background 0.2s ease,
    border-color 0.2s ease;
}
.fs-body-customerDetails .fs-c-checkbox__checkbox:checked + label > .fs-c-checkbox__checkMark {
  background: #08b783;
  border-color: #08b783;
}
.fs-body-customerDetails .fs-c-checkbox__labelText a {
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* 同意内のパスワード入力（会員登録用） */
.fs-body-customerDetails .fs-c-agreementConfirmation__addon {
  margin-top: 14px;
}
.fs-body-customerDetails .fs-c-agreementConfirmation__addon__message {
  margin-bottom: 6px;
  font-size: 12px;
  color: #646464;
}
.fs-body-customerDetails .fs-c-agreementConfirmation__password__input input[type="password"] {
  width: 100%;
  height: 40px;
  padding: 0 14px;
  border: 1px solid #cbcbcb;
  border-radius: 0;
  background: #fff;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
.fs-body-customerDetails .fs-c-agreementConfirmation__password__input input[type="password"]:focus {
  border-color: #8c8c8c;
  outline: none;
}
.fs-body-customerDetails .fs-c-agreementConfirmation .fs-c-button--displayPassword {
  display: none; /* 目アイコンは非表示（他フォームと統一） */
}
/* 送信ボタン：会員登録して次へ＝緑プライマリ／次へ＝アウトライン */
.fs-body-customerDetails .fs-c-inputInformation__button {
  display: block !important; /* システムの中央寄せflexを解除して全幅に */
  margin-top: 40px;
}
.fs-body-customerDetails .fs-c-inputInformation__button > div {
  width: 100%;
}
.fs-body-customerDetails .fs-c-button--registerAndContinue,
.fs-body-customerDetails .fs-c-button--next {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  margin: 0;
  border-radius: 0;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-decoration: none;
  cursor: pointer;
}
.fs-body-customerDetails .fs-c-button--registerAndContinue {
  border: 0;
  background: #08b783;
  color: #fff;
}
.fs-body-customerDetails .fs-c-button--registerAndContinue .fs-c-button__label {
  color: #fff;
}
.fs-body-customerDetails .fs-c-button--next {
  border: 1px solid #646464;
  background: #fff;
  color: #646464;
}
.fs-body-customerDetails .fs-c-button--next .fs-c-button__label {
  color: #646464;
}
@media (hover: hover) {
  .fs-body-customerDetails .fs-c-button--registerAndContinue:hover {
    opacity: 0.85;
  }
  .fs-body-customerDetails .fs-c-button--next:hover {
    background: #f5f5f5;
  }
}

/* ==========================================================================
   ★★★ メールマガジン登録（コマクリ システムページ / fs-body-newsletter-subscribe）★★★
   - 入力項目（氏名分割・メール・inputInformation 460中央・必須マーク・
     緑ボタン）は上の register グループを共用（:is に追加済）。
   - 相違点だけをここで上書き:
     ①ボタンのラベルを「アカウントを作成」→「登録」に戻す
     ②プライバシー同意チェックは register では非表示だが、メルマガでは
       唯一の同意なので “表示” してチェックボックスを装飾
     ③受信ドメイン注意（フリーパーツ）を控えめなノートに
   - 外枠は .page-body(760中央) ＋ 共通 .page-title を利用（HTML側）
   ========================================================================== */
/* ①ボタンラベルを「登録」に戻す（register グループの ::after を上書き） */
.fs-body-newsletter-subscribe .fs-c-button--confirmRegister .fs-c-button__label::after {
  content: "登録";
}

/* ②プライバシー同意チェックを表示＆装飾（register の display:none を打ち消す） */
.fs-body-newsletter-subscribe .fs-c-privacyPolicyAgreeField {
  display: block !important;
  margin: 28px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  min-width: 0;
  text-align: center;
}
.fs-body-newsletter-subscribe .fs-c-privacyPolicyAgreeField .fs-c-inputField,
.fs-body-newsletter-subscribe .fs-c-privacyPolicyAgreeField .fs-c-inputField__field {
  display: block;
}
.fs-body-newsletter-subscribe .fs-c-checkbox {
  display: inline-block;
}
.fs-body-newsletter-subscribe .fs-c-checkbox__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-family: var(--font-base);
  font-size: 13px;
  line-height: 1.6;
  color: #646464;
}
.fs-body-newsletter-subscribe .fs-c-checkbox__checkMark {
  flex: 0 0 auto;
}
.fs-body-newsletter-subscribe .fs-c-checkbox__labelText a {
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* チェックボックスをサイト調に：既定の青（#2559a8/#1f5da0）→ 緑#08b783。
   枠は入力欄と同系の #cbcbcb。チェック(白)はシステムの fs-icon をそのまま利用 */
.fs-body-newsletter-subscribe .fs-c-checkbox__checkMark {
  border: 1.5px solid #cbcbcb;
  border-radius: 2px;
  background: #fff;
  transition:
    background 0.2s ease,
    border-color 0.2s ease;
}
.fs-body-newsletter-subscribe .fs-c-checkbox__checkbox:checked + label > .fs-c-checkbox__checkMark {
  background: #08b783;
  border-color: #08b783;
}

/* ③受信ドメイン注意（フリーパーツ fs-p-emailDomainNotice / fs-l-block--center） */
.fs-body-newsletter-subscribe .fs-l-block--center {
  margin-top: 28px;
}
.fs-body-newsletter-subscribe .fs-p-emailDomainNotice {
  max-width: 460px;
  margin: 0 auto;
  font-size: 12px;
  line-height: 1.8;
  color: #8c8c8c;
  text-align: center;
}
.fs-body-newsletter-subscribe .fs-p-emailDomainNotice strong {
  font-weight: 600;
  color: #646464;
}

/* ==========================================================================
   ★★★ ニュースレター停止（システムページ / fs-body-newsletter-unsubscribe）★★★
   - 入力（停止メール・inputInformation 460中央・必須マーク・リード文・枠）は
     register グループを共用（:is に追加済）。単一メール欄なので全行フル幅。
   - ボタンだけ別クラス（fs-c-button--confirmDelete / コンテナ --cancel）。
     システム primary は赤(#b30000)だが、当サイトの primary は全て緑#08b783に
     統一しているため（退会する等の破壊的アクションも緑）緑プライマリで揃える。
   - ラベルは「削除」のまま（システム標準／font-size:0 の置換はしない）
   ========================================================================== */
.fs-body-newsletter-unsubscribe .fs-c-buttonContainer--cancel {
  margin-top: 48px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-newsletter-unsubscribe .fs-c-button--confirmDelete {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  min-width: 0 !important;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-newsletter-unsubscribe .fs-c-button--confirmDelete .fs-c-button__label {
  font-size: 15px;
  font-weight: 700;
  color: #fff !important;
}
@media (hover: hover) {
  .fs-body-newsletter-unsubscribe .fs-c-button--confirmDelete:hover {
    opacity: 0.85;
  }
}
@media (max-width: 767px) {
  .fs-body-newsletter-unsubscribe .fs-c-button--confirmDelete {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ アカウント登録完了（コマクリ システムページ）― CSSのみで上書き ★★★
   - 【重要】fs-c-* は他ページと共有のため、すべて .fs-body-register-success にスコープ
   - デザイン: 中央寄せの完了メッセージ＋下部に控えめなテキストリンク
   - 「マイページトップ」ボタンはテキストはそのまま、見た目はグレー下線リンクに
   ========================================================================== */

/* ページ全体を中央寄せ（.page-body は通常 左寄せの読み物カラム） */
.fs-body-register-success .page-body {
  text-align: center;
}

/* 完了メッセージ：system のグレー区切り線・余白を解除し、中央寄せ */
.fs-body-register-success .fs-c-registerSuccessMessage {
  margin: 40px auto 0 !important;
  padding: 0 !important;
  border-bottom: 0 !important;
  text-align: center;
}
.fs-body-register-success .fs-c-registerSuccessMessage p {
  margin: 0;
  font-size: 15px;
  line-height: 1.9;
  color: #646464;
}
/* 「ログイン画面からログインを…」段落は PC では行ピッチのまま（SPで間隔を付与） */
.fs-body-register-success .conectword + p {
  margin-top: 0;
}

/* 下部の「マイページトップ」：plain ボタンをグレーの下線テキストリンクに */
.fs-body-register-success .fs-c-buttonContainer--myPageTop {
  margin-top: 56px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-register-success .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-register-success .fs-c-button--myPageTop::before {
  content: none !important; /* plain ボタンのアイコン枠が出ないように */
}
.fs-body-register-success .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-register-success .fs-c-button--myPageTop:hover {
    opacity: 0.7;
    text-decoration: underline;
  }
}

/* ---------- アカウント登録完了 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-register-success .fs-c-registerSuccessMessage {
    margin-top: 32px !important;
  }
  .fs-body-register-success .fs-c-registerSuccessMessage p {
    font-size: 14px;
  }
  /* SP は「登録完了メール…」と「ログイン画面から…」の間に余白を入れる */
  .fs-body-register-success .conectword + p {
    margin-top: 24px;
  }
}

/* ==========================================================================
   ★★★ メルマガ登録完了／ニュースレター停止完了（システムページ）★★★
   - 対象: fs-body-newsletter-subscribe-success（登録完了）
           fs-body-newsletter-unsubscribe-success（停止完了）※同じ構成なので共用
   - デザイン無し・完了ページのトーンは「アカウント登録完了」と統一
   - 構成: 共通 .page-title ＋ .fs-c-documentContent（完了文）＋ トップページリンク
   - fs-c-* は他ページ共有のため :is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) にスコープ
   ========================================================================== */
/* ページ全体を中央寄せ（.page-body は通常 左寄せの読み物カラム） */
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .page-body {
  text-align: center;
}
/* 完了メッセージ：system の grid はそのまま／中央寄せ・余白調整。
   1行目「登録が完了いたしました。」を主役に、以降は本文トーン */
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-documentContent {
  max-width: 560px;
  margin: 40px auto 0;
  gap: 16px;
  text-align: center;
}
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-documentContent p {
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
  color: #646464;
}
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-documentContent p:first-child {
  font-size: 16px;
  font-weight: 600;
  color: #646464;
}
/* トップページ：secondary ボタンをグレー下線テキストリンクに（完了ページ共通トーン） */
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-buttonContainer--topPage {
  margin-top: 56px !important;
  justify-content: center;
  text-align: center;
}
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-button--topPage {
  min-width: 0;
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  line-height: 1.6;
  text-decoration: underline;
  text-underline-offset: 3px;
}
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-button--topPage::before {
  content: none !important; /* plain ボタンのアイコン枠を出さない */
}
:is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-button--topPage .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  :is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-button--topPage:hover {
    opacity: 0.7;
    text-decoration: underline;
  }
}

/* ---------- メルマガ登録完了 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  :is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-documentContent {
    margin-top: 32px;
  }
  :is(.fs-body-newsletter-subscribe-success, .fs-body-newsletter-unsubscribe-success) .fs-c-documentContent p:first-child {
    font-size: 15px;
  }
}

/* ==========================================================================
   ★★★ 商品詳細テンプレート（コマクリ システム＋フリーHTML）★★★
   - body 固有 .fs-body-product / レイアウトクラス .fs-l-product4 にスコープ
   - 構成: 左＝商品画像（PCタイル / SPスワイプスライダー）、右＝商品情報＋説明
   - システム既定（item--3 全幅）を上書きし、説明を右カラムに積む
   ========================================================================== */

/* ---- レイアウト（PC: 画像はブラウザ左端に密着・情報は右に余白を残す） ----
   列: [画像 50%] [ギャップ] [情報 ~400px] [右マージン(余り)]
   画像列は左端 x=0（padding-left なし）、右側に大きめの余白を残すデザイン */
.fs-body-product .fs-l-product4 .fs-l-productLayout {
  box-sizing: border-box;
  max-width: none;
  margin: 0;
  padding: 24px 0 100px;
  /* [画像50%] [ギャップ] [情報 最大508px] [右マージン 最小20px] */
  grid-template-columns: 50% minmax(40px, 96px) minmax(0, 508px) minmax(20px, 1fr);
  grid-column-gap: 0;
  grid-row-gap: 0;
  align-items: start;
}
.fs-body-product .fs-l-product4 .fs-l-productLayout__item--1 {
  grid-column: 1;
  grid-row: 1 / span 2;
}
.fs-body-product .fs-l-product4 .fs-l-productLayout__item--2 {
  grid-column: 3;
  grid-row: 1;
  padding-top: 30px; /* 商品名の上の余白（デザイン） */
  position: relative; /* お気に入りハートの絶対配置基準 */
}
.fs-body-product .fs-l-product4 .fs-l-productLayout__item--3 {
  grid-column: 3;
  grid-row: 2;
  margin-top: 44px;
}

.fs-body-product .fs-c-productPreorderMessage {
  margin: 5px 0;
  padding: 6px 12px;
  font-size: 12px;
  color: #fff;
  background: #646464;
  border: 1px solid #646464;
  line-height: 1;
  text-align: center;
  width: 130px;
}
.fs-body-product .fs-l-productLayout__item:has(.fs-c-productPreorderMessage) .fs-c-productPrices--productDetail {
  margin-bottom: 20px !important;
}

.reserv__word {
  margin-top: 2em;
  color: #333;
  font-weight: 700;
}
/* システムが子要素に付ける margin-bottom:8px を解除（グリッドgapで管理） */
.fs-body-product .fs-l-product4 .fs-l-productLayout > * > * {
  margin-bottom: 0;
}

/* ---- 商品画像（PC: タイル状グリッド） ---- */
.fs-body-product .fs-l-productLayout__item--1 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.fs-body-product .fs-c-productPlainImage {
  margin: 0;
}
/* 0・3・6枚目は全幅、その間の2枚は横並び */
.fs-body-product .fs-c-productPlainImage--0,
.fs-body-product .fs-c-productPlainImage--3,
.fs-body-product .fs-c-productPlainImage--6 {
  grid-column: 1 / -1;
}
.fs-body-product .fs-c-productPlainImage img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}
/* 商品詳細の画像領域では No.30〜No.40 を非表示
   - No.30〜39（-30.jpg〜-39.jpg）：バリエーション専用画像
   - No.40（-40.jpg）：商品一覧ロールオーバー専用画像
   ※ div の連番（--N）は「登録画像の並び順」でスロット番号(No.)と一致しないため、
     画像ファイル名（-30.jpg〜-40.jpg）で判定して親要素ごと非表示にする */
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-30.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-31.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-32.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-33.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-34.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-35.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-36.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-37.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-38.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-39.jpg"]),
.fs-body-product .fs-l-productLayout__item--1 .fs-c-productPlainImage:has(img[src*="-40.jpg"]) {
  display: none;
}

/* ▼ バリエーション選択：画像を薄くせず、選択中の画像に罫線を付ける ▼ */

/* 1) 選択時に画像が薄くなる（opacity低下）のを解除 */
.fs-c-variationPanelList__list__item input[type="radio"]:checked + .fs-c-variationPanelList__panel,
.fs-c-variationPanelList__list__item input[type="radio"]:checked + .fs-c-variationPanelList__panel .fs-c-variationPanelList__panel__image,
.fs-c-variationPanelList__list__item input[type="radio"]:checked + .fs-c-variationPanelList__panel .fs-c-variationPanelList__panel__image img {
  opacity: 1 !important;
  filter: none !important;
}

/* 2) 選択中の画像に #646464 の罫線を付ける */
.fs-c-variationPanelList__list__item input[type="radio"]:checked + .fs-c-variationPanelList__panel .fs-c-variationPanelList__panel__image {
  outline: 2px solid #646464 !important;
  outline-offset: -2px; /* 画像の内側に線を引き、レイアウトをずらさない */
}

.fs-c-variationPanelList__list__item .fs-c-variationPanelList__radio:checked + .fs-c-variationPanelList__panel .fs-c-variationPanelList__panel__label {
  font-weight: bold;
}

/* ▲ ここまで ▲ */

/* ---- 商品名 ---- */
.fs-body-product .fs-c-productNameHeading {
  margin: 0;
  padding-right: 36px; /* 右上のお気に入りハートと重ならないように */
  color: #646464;
  font-family: var(--font-serif); /* Times New Roman */
  font-size: 25px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}
.fs-body-product .fs-c-productNameHeading__name {
  font-size: inherit;
}

/* ---- 価格（システムの青・大サイズを打ち消し、控えめに） ---- */
.fs-body-product .fs-c-productPrices--productDetail {
  margin: 10px 0 50px !important;
  align-items: baseline;
  font-family: var(--font-serif); /* Times New Roman */
}
.fs-body-product .fs-c-productPrice--selling {
  align-items: baseline;
}
/* 金額：システムが __main / __value / currencyMark に 13px を当てているため、
   実際の数値（__value）と通貨記号にも明示的にサイズ指定して上書きする */
.fs-body-product .fs-c-productPrices--productDetail .fs-c-productPrice__main__price,
.fs-body-product .fs-c-productPrices--productDetail .fs-c-price__value {
  color: #646464 !important;
  font-size: 18px !important;
  font-weight: 400;
}
.fs-body-product .fs-c-productPrices--productDetail .fs-c-price__currencyMark {
  color: #646464 !important;
  font-size: 18px !important;
}
.fs-body-product .fs-c-productPrice__addon {
  margin-left: 6px;
  font-size: 18px;
  color: #646464;
}
.fs-body-product .fs-c-productPrice__addon__label {
  font-weight: 400;
  font-size: 0; /* 「税込」を隠してデザインの「tax in」に統一 */
}
.fs-body-product .fs-c-productPrice__addon__label::after {
  content: "tax in";
  font-size: 18px;
}

/* ---- ポイント表示はデザインに無いので非表示 ---- */
.fs-body-product .fs-c-productPointDisplay {
  display: none;
}

/* ---- お気に入り＝商品名横のハートアイコン（罫線・文字なし／登録済みは色変化のみ） ----
   システムは登録時に addToWishList → removeFromWishList へクラスを差し替え、
   ::after のハートグリフ（fs-icon）が色付きになる。両状態を枠なしアイコンに整える */
.fs-body-product .fs-c-productQuantityAndWishlist {
  display: block;
}
.fs-body-product .fs-c-productQuantityAndWishlist__wishlist {
  position: absolute;
  top: 30px;
  right: 0;
  margin: 0;
}

.fs-body-product .fs-c-button--removeFromWishList--detail,
.fs-body-product .fs-c-button--addToWishList--detail {
  box-shadow: none !important;
}

.fs-body-product .fs-c-button--addToWishList--detail,
.fs-body-product .fs-c-button--removeFromWishList--detail {
  width: auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0 !important;
  border: 0 !important; /* ② 四角の罫線をなしに */
  background: none !important;
  font-size: 0; /* ラベル文字を隠す */
  line-height: 1;
}
.fs-body-product .fs-c-button--addToWishList--detail .fs-c-button__label,
.fs-body-product .fs-c-button--removeFromWishList--detail .fs-c-button__label {
  display: none;
}
.fs-body-product .fs-c-button--addToWishList--detail::after,
.fs-body-product .fs-c-button--removeFromWishList--detail::after {
  content: "" !important; /* システムの fs-icon グリフを無効化 */
  display: block !important;
  width: 24px;
  height: 20px;
  margin: 0 !important;
  background: url("../img/icon-addToWishList.svg") center / contain no-repeat;
}
/* お気に入り登録済み＝塗りつぶしハートのアイコンへ差し替え */
.fs-body-product .fs-c-button--removeFromWishList--detail::after {
  background-image: url("../img/icon-addToWishList-add.svg");
}

/* ---- 数量セレクトはデザインに無いので非表示 ---- */
.fs-body-product .fs-c-productQuantityAndWishlist__quantity {
  display: none;
}

/* ---- バリエーション 共通 ---- */
.fs-body-product .fs-c-productChooseVariation {
  margin: 22px 0 52px !important;
  display: grid;
  gap: 22px;
}
.fs-body-product .fs-c-variationLabel {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 12px;
  font-weight: 400;
}
/* ⑩ COLOR / SIZE の見出し（PC 18px / SP 17px） */
.fs-body-product .fs-c-variationLabel__label {
  font-family: var(--font-serif); /* Times New Roman */
  font-size: 18px;
  letter-spacing: 0.08em;
  color: #646464;
}
/* 現在の選択値（": Brige" / ": 36"）は冗長なので非表示 */
.fs-body-product .fs-c-variationLabel__value {
  display: none;
}
.fs-body-product .fs-c-variationLabel__label + .fs-c-variationLabel__value::before {
  content: "";
}
/* ⑥ COLOR（画像ありのパネル）の見出しは非表示（画像＋カラー名で十分） */
.fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__label {
  display: none;
}

/* ---- COLOR（画像＋ラベルパネル） :has で画像ありのリストを判定 ---- */
.fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__list {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__panel {
  display: block;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: none;
  cursor: pointer;
}
.fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__panel__content {
  display: block;
  min-height: 0;
  padding: 0;
  background: none !important;
  color: inherit !important;
}
/* ⑧ バリエーション画像は元画像の比率に合わせる（トリミングしない） */
.fs-body-product .fs-c-variationPanelList__panel__image {
  display: block;
  height: auto;
  max-height: none;
  padding: 0;
  position: relative; /* 選択時オーバーレイの基準 */
}
.fs-body-product .fs-c-variationPanelList__panel__image img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: fill;
}
/* 選択中のカラーは画像の上に半透明レイヤーを重ねる（罫線ではなく） */
.fs-body-product .fs-c-variationPanelList__panel__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #e9e8e4;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
/* ⑨ カラー名は左寄せ */
.fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__panel__label {
  display: block;
  margin-top: 7px;
  text-align: left;
  font-size: 12px;
  font-weight: 400;
  color: #646464;
}
/* 在庫切れ（COLOR）※画像を薄くする表現は仕様変更で廃止（2026-07-22）。在庫表記のみ */
.fs-body-product .fs-c-variationPanelList__panel__stock--outOfStock {
  display: block;
  margin-top: 4px;
  text-align: center;
  font-size: 11px;
  color: #b0b0b0;
}

/* ---- SIZE（小さめのボタン） :not(:has(image)) ----
   ラベルを1行目（全幅）、2行目に「ボタン列 ＋ SIZE GUIDE」を横並びで
   配置し、SIZE GUIDE をボタン列(__list)とクロス軸中央で揃える */
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr; /* col1=ボタン列 / col2=SIZE GUIDE */
  align-items: center;
  column-gap: 16px;
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__label {
  grid-column: 1 / -1; /* 見出しは単独で1行 */
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__list {
  grid-column: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: auto;
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__list__item {
  min-width: 0;
  flex: 0 0 auto;
}
/* 非選択（例: 38）＝白地・1px罫線 */
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__panel {
  display: block;
  border: 1px solid #c8c8c8;
  border-radius: 0;
  background: #fff;
  overflow: hidden;
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__panel__content {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 46px;
  padding: 0 10px;
  background: none !important;
  color: #646464 !important;
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__panel__label {
  font-size: 13px;
  font-weight: 400;
}
/* 選択中（例: 36）＝薄グレー塗り・罫線なし・文字は淡色 */
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__radio:checked + .fs-c-variationPanelList__panel {
  border-color: #646464;
  background: #c9c9c9;
}
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__radio:checked + .fs-c-variationPanelList__panel .fs-c-variationPanelList__panel__content {
  color: #646464 !important;
}
/* SIZE GUIDE リンク（HTMLの .sizeguide を JS で SIZE パネル内へ移動）。
   PC=ボタン列(__list)のすぐ右・縦中央（grid col2 / align-items:center で揃う） */
.fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .sizeguide {
  grid-column: 2;
  justify-self: start;
  margin: 0;
}
.fs-body-product .sizeguide a {
  font-family: var(--font-serif);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- カートに追加ボタン（緑・全幅） ---- */
.fs-body-product .fs-c-productActionButton {
  margin-top: 22px;
}
/* ⑪ カート／再入荷お知らせのどちらが出ても緑の全幅ボタンに（ボタンが消えて見えるのを防止）。
   さらにカラーを選択不可にしているため、在庫切れカラーへ切り替わって
   ボタンが「再入荷お知らせ」に化けること自体が起きない */
.fs-body-product .fs-c-button--addToCart--detail,
.fs-body-product .fs-c-button--subscribeToArrivalNotice--detail {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 0;
  background: #08b783;
  box-shadow: none;
  color: #fff;
  font-family: var(--font-base);
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-product .fs-c-button--addToCart--detail .fs-c-button__label {
  font-size: 0;
}
.fs-body-product .fs-c-button--addToCart--detail .fs-c-button__label::after {
  content: "カートに追加";
  font-size: 14px;
  font-weight: 700;
}
.fs-body-product .fs-c-button--subscribeToArrivalNotice--detail .fs-c-button__label {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
}
@media (hover: hover) {
  .fs-body-product .fs-c-button--addToCart--detail:hover,
  .fs-body-product .fs-c-button--subscribeToArrivalNotice--detail:hover {
    opacity: 0.85;
  }
}

.fs-body-cart .fs-c-cartTable__message,
.fs-body-checkout .fs-c-cartTable__message {
  background: #646464;
  color: #ffffff;
  display: inline-block;
  font-size: 10px;
  margin-bottom: 3px;
  padding: 6px 10px;
  line-height: 1;
  width: max-content;
}

.fs-body-cart .fs-c-cartTable__salesPeriod.fs-c-cartProductSalesPeriod,
.fs-body-checkout .fs-c-cartTable__salesPeriod {
  margin-top: 10px;
}

/* ==========================================================================
   商品説明エリア（フリーHTML：.pdp-desc / .pdp-sizeguide / .pdp-modelwear）
   ========================================================================== */
.pdp-desc {
  margin-top: 40px;
}
.fs-body-product .fs-p-productDescription {
  margin: 0;
  color: #333;
}
.fs-body-product .pdp-desc__block {
  /* セクション間の空きを1行分（本文line-height ≈27px）詰める：50→24px */
  margin-top: 24px;
}
.fs-body-product .pdp-desc__block:first-child {
  margin-top: 0;
}
.fs-body-product .pdp-desc__heading {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: #333;
}
.fs-body-product .pdp-desc__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
}

.fs-body-product .fs-c-productNumber {
  border: none;
  padding: 0;
  font-size: 14px;
  margin-top: 30px; /* 注意事項との余白を +20px（10→30） */
  color: #333;
}
.fs-body-product .fs-c-productNumber__number {
  font-weight: normal;
}
.fs-body-product .pdp-desc__code {
  margin: 10px 0 0;
  font-size: 11px;
  color: #969696;
}
.fs-body-product .pdp-desc__list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  line-height: 1.9;
}
.fs-body-product .pdp-desc__list li {
  padding-left: 1em;
  text-indent: -1em;
}
.fs-body-product .pdp-desc__list li::before {
  content: "・";
}
/* 特徴リスト直後の本文（26AWキャプション構成）は1行分空ける */
.fs-body-product .pdp-desc__list + .pdp-desc__text {
  margin-top: 14px;
}
/* 末尾の注意書き（本文と1行分の余白を空ける・本文と同トーン） */
.fs-body-product .pdp-desc__note {
  margin: 27px 0 0;
  font-size: 14px;
  line-height: 1.9;
}

/* 関連商品への相互リンクボタン（独自コメント1）。サイト調の細枠・serif・少し小さめ */
.fs-body-product .pdp-relink {
  margin-top: 28px;
}
.fs-body-product .pdp-relink__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1px solid #333333;
  background-color: transparent;
  font-family: var(--font-serif);
  font-size: 12px;
  letter-spacing: 0.08em;
  line-height: 1;
  color: #333333;
  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    opacity 0.25s ease;
}
.fs-body-product .pdp-relink__btn::after {
  content: "＞";
  font-size: 10px;
}
@media (hover: hover) {
  .fs-body-product .pdp-relink__btn:hover {
    opacity: 1; /* 全体の a:hover{opacity:.6} を打ち消し、反転で押下感を出す */
    background-color: #333333;
    color: #ffffff;
  }
}

/* SIZE GUIDE */
.fs-body-product .pdp-sizeguide {
  margin-top: 50px;
  padding-top: 50px;
  border-top: 1px solid #c8c8c8;
}
.fs-body-product .pdp-sizeguide__heading {
  margin: 0 0 18px;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.12em;
  color: #646464;
  font-family: var(--font-serif);
}
.fs-body-product .pdp-sizeguide__figure {
  margin: 0 0 40px;
  text-align: center;
}
.fs-body-product .pdp-sizeguide__figure img {
  max-width: 100%;
  height: auto;
}
/* 単位／サイズ 切り替え（選択中はグレーで色付け）
   PC=ボタン固定幅（枠はボタン分だけ）／SP=全幅（767以下で上書き） */
.fs-body-product .pdp-sizeguide__toggle {
  display: flex;
  width: fit-content;
  border: 1px solid #646464;
}
.fs-body-product .pdp-sizeguide__toggle--size {
  margin-top: 8px;
}
.fs-body-product .pdp-sizeguide__btn {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid #646464;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  line-height: 1;
  cursor: pointer;
}
.fs-body-product .pdp-sizeguide__btn:first-child {
  border-left: 0;
}
.fs-body-product .pdp-sizeguide__toggle--unit .pdp-sizeguide__btn {
  flex: 0 0 80px;
  height: 32px;
  font-size: 13px;
}
.fs-body-product .pdp-sizeguide__toggle--size .pdp-sizeguide__btn {
  flex: 0 0 96px;
  height: 44px;
  font-size: 13px;
}
.fs-body-product .pdp-sizeguide__btn.is-active {
  background: #c9c9c9;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-product .pdp-sizeguide__btn:not(.is-active):hover {
    background: #f5f5f5;
  }
}
/* 採寸表（見出しの上下に罫線／値は罫線なし） */
.fs-body-product .pdp-sizeguide__table {
  width: 100%;
  margin-top: 20px;
  border-collapse: collapse;
  text-align: center;
  table-layout: fixed;
}
.fs-body-product .pdp-sizeguide__table thead th {
  padding: 8px 4px;
  border-top: 1px solid #646464;
  border-bottom: 1px solid #646464;
  font-size: 13px;
  font-weight: 400;
  color: #646464;
}
.fs-body-product .pdp-sizeguide__table tbody td {
  padding: 12px 4px;
  border: 0;
  font-size: 13px;
  font-weight: 400;
  color: #646464;
}
.fs-body-product .pdp-sizeguide__table tbody tr[hidden] {
  display: none;
}

/* サイズ表の下の「モデル着用」テキスト（表組と余白を空けて配置） */
.fs-body-product .pdp-sizeguide__model {
  margin-top: 28px;
  font-size: 13px;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: #646464;
}

/* モデル着用（関連商品 2列） */
.fs-body-product .pdp-modelwear {
  margin-top: 44px;
}
.fs-body-product .pdp-modelwear__heading {
  /* 【商品説明】(.pdp-desc__heading) と同じあしらい：14px / 700 / #333 */
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 700;
  color: #333;
}
.fs-body-product .pdp-modelwear__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.fs-body-product .pdp-modelwear__card {
  display: block;
  text-decoration: none;
  color: inherit;
}
.fs-body-product .pdp-modelwear__img {
  display: block;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: #f4f4f4;
}
.fs-body-product .pdp-modelwear__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fs-body-product .pdp-modelwear__name {
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: #646464;
}
.fs-body-product .pdp-modelwear__price {
  margin: 4px 0 0;
  font-size: 14px;
  color: #646464;
}
.fs-body-product .pdp-modelwear__price span {
  font-size: 14px;
  color: #646464;
}

/* ---- 画像ギャラリーのサムネイル（SP・JSで生成） ---- */
.fs-body-product .pdp-gallery__thumbs {
  display: none;
}

#fs_CustomerDetails .fs-c-inputInformation__message {
  margin-top: 60px;
}

/* ---------- 商品詳細 : Tablet ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .fs-body-product .fs-l-product4 .fs-l-productLayout {
    padding: 16px 0 80px;
    grid-template-columns: 52% minmax(24px, 48px) minmax(0, 508px) minmax(20px, 1fr);
  }
}

/* ---------- 商品詳細 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-product .fs-l-product4 .fs-l-productLayout {
    display: block;
    padding: 0 0 56px;
  }
  .fs-body-product .fs-l-product4 .fs-l-productLayout__item--2 {
    padding: 24px 20px 0;
  }
  .fs-body-product .fs-l-product4 .fs-l-productLayout__item--3 {
    margin-top: 40px;
    padding: 0 20px;
  }
  /* ④⑤⑩ SP の文字サイズ */
  .fs-body-product .fs-c-productNameHeading {
    font-size: 20px;
  }
  .fs-body-product .fs-c-productPrices--productDetail .fs-c-productPrice__main__price,
  .fs-body-product .fs-c-productPrices--productDetail .fs-c-price__value {
    font-size: 16px !important;
  }
  .fs-body-product .fs-c-productPrices--productDetail .fs-c-price__currencyMark {
    font-size: 13px !important;
  }
  .fs-body-product .fs-c-variationLabel__label {
    font-size: 17px;
  }
  /* お気に入りハート位置（SPは右20pxの余白に合わせる） */
  .fs-body-product .fs-c-productQuantityAndWishlist__wishlist {
    top: 24px;
    right: 20px;
  }
  /* SIZE GUIDE：SP はサイズボタンの下に左寄せで表示（デザイン通り） */
  .fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) {
    grid-template-columns: 1fr; /* 単一列に → ボタンの下へ積む */
  }
  .fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .sizeguide {
    grid-column: 1;
    margin: 0px auto 0;
  }

  /* 画像：横スワイプのスライダー（CSSスクロールスナップ）＋下にサムネ */
  .fs-body-product .fs-l-productLayout__item--1 {
    display: flex;
    grid-template-columns: none;
    gap: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .fs-body-product .fs-l-productLayout__item--1::-webkit-scrollbar {
    display: none;
  }
  .fs-body-product .fs-c-productPlainImage {
    flex: 0 0 100%;
    scroll-snap-align: center;
  }
  .fs-body-product .fs-c-productPlainImage--0,
  .fs-body-product .fs-c-productPlainImage--3,
  .fs-body-product .fs-c-productPlainImage--6 {
    grid-column: auto;
  }
  .fs-body-product .fs-c-productPlainImage img {
    aspect-ratio: 2 / 3;
  }
  /* サムネ列：メイン画像の下に余白なしで密着、画面幅に3枚・多い場合は横スクロール */
  .fs-body-product .pdp-gallery__thumbs {
    display: flex;
    gap: 0;
    overflow-x: auto;
    padding: 0;
    margin: 0;
    scrollbar-width: none;
  }
  .fs-body-product .pdp-gallery__thumbs::-webkit-scrollbar {
    display: none;
  }
  .fs-body-product .pdp-gallery__thumb {
    flex: 0 0 calc(100% / 3); /* 画面幅にちょうど3枚 */
    width: calc(100% / 3);
    aspect-ratio: 2 / 3;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
  }
  .fs-body-product .pdp-gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* アクティブ枠はレイアウトを崩さないよう内側 outline で表現（隙間ゼロを維持） */
  .fs-body-product .pdp-gallery__thumb--active {
    /* outline: 1.5px solid #646464;
    outline-offset: -1.5px; */
    opacity: 0.8;
  }

  /* COLORは3列のまま、SIZEは折り返し */
  .fs-body-product .fs-c-productChooseVariation {
    margin-top: 20px;
  }
  /* COLOR：システムのSP用「横スクロール」を解除し、3色を1行に収める */
  .fs-body-product .fs-c-variationPanelList:has(.fs-c-variationPanelList__panel__image) .fs-c-variationPanelList__list {
    grid-auto-flow: row;
    grid-template-columns: repeat(3, 1fr);
    overflow-x: visible;
    white-space: normal;
    padding-bottom: 0;
  }

  /* 1. バリエーションリストを幅に収める */
  .fs-c-variationPanelList__list {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  .fs-c-variationPanelList__list__item {
    width: max-content !important; /* gap 4px × 2 を差し引いて3分割 */
  }
  .fs-c-variationPanelList__list__item img {
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
  }

  /* 2. 商品名 中央寄せ */
  .fs-c-productNameHeading.fs-c-heading {
    text-align: center !important;
    padding-left: 36px;
  }

  /* 3. 金額 中央寄せ */
  .fs-c-productPrices.fs-c-productPrices--productDetail {
    text-align: center !important;
  }

  /* 4. バリエーション領域 中央寄せ */
  .fs-c-variationPanelList {
    text-align: center !important;
    justify-content: center !important;
  }

  /* 5. サイズガイド見出し 中央寄せ */
  .pdp-sizeguide__heading {
    text-align: center !important;
  }

  /* 6. サイズガイド図解 中央寄せ（resetのimg{display:block}対策） */
  .fs-body-product .pdp-sizeguide__figure img {
    margin-inline: auto;
  }

  /* 7. 切り替えタブはSPでは全幅（PCの固定幅を解除） */
  .fs-body-product .pdp-sizeguide__toggle {
    width: auto;
  }
  .fs-body-product .pdp-sizeguide__toggle .pdp-sizeguide__btn {
    flex: 1 1 0;
  }

  /* 8. 行ラベル列付きで列数が多いサイズ表（futaedress等 --dense）は
        SPで文字と余白を詰めて折り返しを防ぐ */
  .fs-body-product .pdp-sizeguide__table--dense thead th {
    padding: 8px 2px;
    font-size: 11px;
  }
  .fs-body-product .pdp-sizeguide__table--dense tbody td {
    padding: 12px 2px;
    font-size: 11px;
  }

  .fs-body-product .fs-c-variationPanelList:not(:has(.fs-c-variationPanelList__panel__image)) .fs-c-variationPanelList__label {
    justify-content: center;
  }

  .pdp-modelwear {
    border-top: 1px solid #c8c8c8;
    padding-top: 40px;
  }

  .fs-c-productChooseVariation__variation[data-variation-unit-price-axis="true"] .fs-c-variationPanelList__list {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  .fs-c-productChooseVariation__variation[data-variation-unit-price-axis="true"] .fs-c-variationPanelList__list__item {
    flex: 0 0 calc((100% - 8px) / 3) !important;
    max-width: calc((100% - 8px) / 3) !important;
    min-width: 0 !important;
  }
}

/* ==========================================================================
   ★★★ マイページTOP（コマクリ システムページ）― CSSのみで上書き ★★★
   - body 固有 :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) にスコープ
   - デザイン: 中央寄せ / PC＝横並びのテキストリンク / SP＝右矢印つき縦リスト
   - 会員情報表示（デザインに無い要素）はミニマルなテイストで中央に整える
   - ログアウトは JS でメニュー(ul)の最後の項目へ移動（PC/SP共通の見た目）
   ========================================================================== */

/* 中央カラム */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .site-main > section {
  box-sizing: border-box;
  max-width: 1240px;
  margin: 0 auto;
  padding: 64px 20px 96px;
}
/* システムの2カラム(row-reverse flex)を解除して縦積み中央に */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-l-account {
  display: block !important;
}

/* ---- 会員情報（氏名＋ポイント）：グレー枠を外し中央のミニマル表示に ---- */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo {
  max-width: 560px;
  margin: 36px auto 0 !important;
  padding: 0 !important;
  background: none !important;
  text-align: center;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__header {
  display: block;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__accountName {
  font-family: var(--font-serif);
  font-size: 20px;
  color: #646464;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__accountName__nameLabel {
  margin-left: 3px;
  font-size: 14px;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__body {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  background: none !important;
  text-align: center;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point {
  font-size: 12px;
  color: #8c8c8c;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point__label {
  margin-right: 6px;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point__point {
  display: inline;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point__point__available__number {
  color: #646464 !important;
  font-size: 15px !important;
  font-weight: 600;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point__point__available__numberLabel {
  color: #646464;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__point__point__rate {
  margin-left: 4px;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-productListItem__productDescription {
  display: none;
}
/* 有効期限が空なら行ごと非表示 */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-purchasePointExpiration:has(.fs-c-purchasePointExpiration__expiration:empty) {
  display: none;
}

¥ :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-purchasePointExpiration:has(.fs-c-purchasePointExpiration__expiration:empty) {
  display: none;
}

.have_point {
  text-align: center;
  margin: 20px auto 0;
  border: 1px solid #646464;
  width: max-content;
  padding: 4px 10px;
  font-size: 13px;
}

/* ---- メニュー（fs-c-accountService）：PC＝中央の横並びテキストリンク ---- */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService {
  display: flex;
  flex-wrap: wrap; /* 収まらない幅では折り返す（横スクロール防止）。PC(≥1024)では1行に収まる */
  justify-content: center;
  align-items: center;
  gap: 16px 24px;
  margin: 40px 0 0 !important;
  padding: 0;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__page,
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__page--accountDelete {
  flex-basis: auto !important;
  width: auto;
  height: auto !important;
  margin: 0 !important;
  display: block;
  align-items: stretch;
}
/* 「レビュー履歴」メニュー項目は非表示 */
.fs-c-accountService__page--accountReviews {
  display: none !important;
}
/* カード装飾(枠・影・背景・アイコン)を解除して素のテキストリンクに */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink {
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  width: auto !important;
  padding: 0 !important;
  color: #646464 !important;
  text-decoration: none;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink__label {
  flex-grow: 0 !important;
  font-size: 14px !important;
  line-height: 1.4;
}
/* システムのアイコン(::before)は非表示 */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink__label::before {
  display: none !important;
}
@media (hover: hover) {
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}

/* ---- ログアウト（.parts_logout）：JS未実行時のフォールバック中央表示 ---- */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .parts_logout {
  margin-top: 16px;
  text-align: center;
}
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .parts_logout a {
  font-size: 14px;
  color: #646464;
}

/* 末尾の関連商品枠（空）に余計な余白を出さない */
:is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-l-additionalProduct:empty {
  display: none;
}

.fs-body-my-top .fs-l-additionalProduct--wishlist {
  display: none;
}

/*商品検索結果*/
.fs-body-search .fs-c-productList {
  margin-top: 0;
}

/* ---------- マイページTOP : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .site-main > section {
    padding: 46px 20px 56px;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo {
    margin-top: 28px !important;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-p-accountInfo__accountName {
    font-size: 18px;
  }

  /* メニューを縦リスト化：各行 全幅・右矢印・区切り線 */
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService {
    display: block;
    margin-top: 32px !important;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__page,
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__page--accountDelete {
    display: block;
    border-top: 1px solid #e5e5e5;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__page:last-child {
    border-bottom: 1px solid #e5e5e5;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: flex-start !important; /* システムの(0,4,0) justify:center に勝つ */
    padding: 18px 24px 18px 4px !important;
  }
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink__label {
    font-size: 14px !important;
  }
  /* 右向きシェブロン */
  :is(.fs-body-my-top, .fs-body-my-account-password, .fs-body-my-account-settings, .fs-body-my-account-settings-edit, .fs-body-my-wishlist, .fs-body-my-account-delete, .fs-body-my-addressbook-new, .fs-body-my-addressbook, .fs-body-my-points, .fs-body-my-orders) .fs-c-accountService__pageLink::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 6px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #9a9a9a;
    border-right: 1px solid #9a9a9a;
    transform: translateY(-50%) rotate(45deg);
  }
}

/* ==========================================================================
   ★★★ マイページ内 パスワード変更（fs-body-my-account-password）★★★
   - メニュー(fs-c-accountService)＋中央カラムは上のマイページTOPと共有(:is)
   - フォームは「新しいパスワードの登録」ページと同じ見た目
   - マイページトップ(plain)はグレー下線リンク（登録完了ページと同様）
   ========================================================================== */

/* フォームを中央カラム(460px)に */
.fs-body-my-account-password .fs-c-inputInformation {
  box-sizing: border-box;
  max-width: 460px;
  margin: 44px auto 0 !important;
  padding: 0;
}
.fs-body-my-account-password .fs-c-inputInformation__message {
  margin: 8px 0 40px !important;
  padding: 0 !important;
  text-align: center;
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-my-account-password .fs-c-inputInformation__message p {
  margin: 0;
}
/* fs_theme のグレー背景・余白を解除 */
.fs-body-my-account-password .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
.fs-body-my-account-password .fs-c-accountPasswordField,
.fs-body-my-account-password .fs-c-inputField,
.fs-body-my-account-password .fs-c-inputField__field {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* 入力テーブルをブロック化（ラベル上・入力下・全幅） */
.fs-body-my-account-password .fs-c-inputTable,
.fs-body-my-account-password .fs-c-inputTable tbody,
.fs-body-my-account-password .fs-c-inputTable tr,
.fs-body-my-account-password .fs-c-inputTable th,
.fs-body-my-account-password .fs-c-inputTable td {
  display: block !important;
  width: auto !important;
  border: 0 !important;
  padding: 0 !important;
}
.fs-body-my-account-password .fs-c-inputTable tr + tr {
  margin-top: 23px !important;
}
.fs-body-my-account-password .fs-c-inputTable th.fs-c-inputTable__headerCell {
  padding-bottom: 9px !important;
}
.fs-body-my-account-password .fs-c-inputTable__label {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #646464 !important;
}
/* 必須マーク「(必須)」→「*」（両項目とも必須） */
.fs-body-my-account-password .fs-c-requiredMark {
  display: none !important;
}
.fs-body-my-account-password .fs-c-inputTable__label::after {
  content: "*";
  margin-left: 2px;
  font-size: 14px;
  color: #db496b;
}
/* パスワード入力欄 */
.fs-body-my-account-password .fs-c-inputTable input[type="password"] {
  box-sizing: border-box;
  width: 100% !important;
  height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid #cbcbcb !important;
  border-radius: 6px !important;
  background-color: #fff !important;
  font-family: var(--font-base);
  font-size: 16px !important; /* iOS フォーカス時の自動ズーム防止 */
  color: #646464 !important;
  -webkit-appearance: none;
  appearance: none;
}
.fs-body-my-account-password .fs-c-inputTable input:focus {
  outline: none;
  border-color: #8c8c8c !important;
  box-shadow: none !important;
}
/* パスワード表示切替（目アイコン）は非表示 */
.fs-body-my-account-password .fs-c-button--displayPassword {
  display: none !important;
}
/* 変更ボタン（緑・PC中央260px / SP全幅）。ラベルは「変更」のまま */
.fs-body-my-account-password .fs-c-buttonContainer--change {
  margin-top: 52px !important;
  text-align: center;
}
.fs-body-my-account-password .fs-c-button--change {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-my-account-password .fs-c-button--change .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  .fs-body-my-account-password .fs-c-button--change:hover {
    opacity: 0.85;
  }
}

/* 下部「マイページトップ」＝グレー下線リンク */
.fs-body-my-account-password .fs-c-buttonContainer--myPageTop {
  margin-top: 32px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-account-password .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-account-password .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-account-password .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-account-password .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}

/* ---------- パスワード変更 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  /* SP はメニュー（マイページ内リンク一覧）を非表示 */
  .fs-body-my-account-password .fs-c-accountService {
    display: none;
  }
  .fs-body-my-account-password .fs-c-button--change {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ 会員情報詳細（fs-body-my-account-settings）★★★
   - メニュー(fs-c-accountService)＋中央カラムはマイページ系と共有(:is)
   - 登録内容の「読み取り専用テーブル」を、ラベル/値の定義リスト風に整える
   - 変更＝緑ボタン / アカウントトップ(plain)＝グレー下線リンク
   ========================================================================== */
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputInformation {
  box-sizing: border-box;
  max-width: 520px;
  margin: 44px auto 0 !important;
  padding: 0;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputInformation__message {
  margin: 8px 0 28px !important;
  padding: 0 !important;
  text-align: center;
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputInformation__message p {
  margin: 0;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputInformation__field {
  background: none !important;
  padding: 0 !important;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-memberInfoField {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  min-width: 0;
}
/* テーブルを「ラベル｜値」の行リストに */
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable,
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable tbody {
  display: block !important;
  width: auto !important;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable tr {
  display: flex;
  flex-direction: row; /* システムの flex-direction:column を打ち消す */
  flex-wrap: nowrap;
  align-items: baseline;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid #ececec;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable tr:first-child {
  border-top: 1px solid #ececec;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable__headerCell {
  flex: 0 0 132px;
  padding: 0 !important;
  border: 0 !important;
  text-align: left;
  font-size: 13px;
  font-weight: 400;
  color: #8c8c8c;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable__dataCell {
  flex: 1 1 auto;
  padding: 0 !important;
  border: 0 !important;
  font-size: 14px;
  line-height: 1.6;
  color: #646464;
  word-break: break-all;
}
/* 空の値は「—」で表示 */
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-confirmation__data:empty::before {
  content: "—";
  color: #c8c8c8;
}

/* 変更ボタン（緑・PC中央260px / SP全幅）。ラベル「変更」のまま */
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-buttonContainer--change {
  margin-top: 40px !important;
  text-align: center;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--change {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--change .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  :is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--change:hover {
    opacity: 0.85;
  }
}

/* アカウントトップ（plain）＝グレー下線リンク */
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-buttonContainer--myPageTop {
  margin-top: 28px !important;
  justify-content: center;
  text-align: center;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--myPageTop::before {
  content: none !important;
}
:is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  :is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}

/* ---------- 会員情報詳細 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  /* SP はメニュー（マイページ内リンク一覧）を非表示 */
  :is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-accountService {
    display: none;
  }
  :is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-inputTable__headerCell {
    flex-basis: 108px;
  }
  :is(.fs-body-my-account-settings, .fs-body-my-account-delete) .fs-c-button--change {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ 会員登録内容変更（fs-body-my-account-settings-edit）★★★
   - フォームの見た目は「新規アカウント登録」と共有（:is で上記に統合済み）
   - このページ固有：送信ボタン(confirmChange)＝緑 / アカウントトップ＝グレー下線
   - SP はナビ非表示
   ========================================================================== */
.fs-body-my-account-settings-edit .fs-c-buttonContainer--confirmChange {
  margin-top: 48px !important;
  text-align: center;
}
.fs-body-my-account-settings-edit .fs-c-button--confirmChange {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 260px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-my-account-settings-edit .fs-c-button--confirmChange .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  .fs-body-my-account-settings-edit .fs-c-button--confirmChange:hover {
    opacity: 0.85;
  }
}

/* アカウントトップ（plain）＝グレー下線リンク */
.fs-body-my-account-settings-edit .fs-c-buttonContainer--myPageTop {
  margin-top: 28px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-account-settings-edit .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-account-settings-edit .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-account-settings-edit .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-account-settings-edit .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}

/* ---------- 会員登録内容変更 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-account-settings-edit .fs-c-accountService {
    display: none;
  }
  .fs-body-my-account-settings-edit .fs-c-button--confirmChange {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ お気に入り（fs-body-my-wishlist）★★★
   - メニュー＝マイページ系と共有（:is）。中央カラムは商品グリッド用に拡張
   - PC＝4カラムの商品カード / SP＝画像左・情報右の1カラム＋全幅ボタン
   - カラー/サイズのラベルを付与、削除＝グレー下線リンク、SPはナビ非表示
   ========================================================================== */

/* コンテナ幅はマイページ共通（1240px）を使用（上の :is グループで定義済み） */
/* 現在ページ（お気に入り）はメニューで下線 */
.fs-body-my-wishlist .fs-c-accountService__page--wishList .fs-c-accountService__pageLink {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- 商品グリッド ---- */
.fs-body-my-wishlist .fs-c-wishList,
.fs-body-my-wishlist .fs-c-productList {
  margin-top: 40px;
}
.fs-body-my-wishlist .fs-c-productList__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 48px 24px !important;
}
.fs-body-my-wishlist .fs-c-productList__list__item {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.fs-body-my-wishlist .fs-c-productListItem > form {
  display: flex;
  flex-direction: column;
  height: 100%;
}
/* システムが name/prices に付ける order を打ち消し、画像→商品名→価格→ボタン順に固定 */
.fs-body-my-wishlist .fs-c-productListItem__imageContainer {
  order: 1;
}
.fs-body-my-wishlist .fs-c-productListItem__productName {
  order: 2;
}
.fs-body-my-wishlist .fs-c-productListItem__prices {
  order: 3;
}
.fs-body-my-wishlist .fs-c-productListItem__control {
  order: 4;
}

/* 画像 */
.fs-body-my-wishlist .fs-c-productListItem__imageContainer {
  margin: 0 0 14px;
}
.fs-body-my-wishlist .fs-c-productListItem__image {
  margin: 0;
}
.fs-body-my-wishlist .fs-c-productImage__image {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  background: #f4f4f4;
}
/* 「他の画像を見る」ボタン・拡大モーダルは非表示 */
.fs-body-my-wishlist .fs-c-productListItem__viewMoreImageButton,
.fs-body-my-wishlist .fs-c-productImageModal {
  display: none !important;
}

.fs-c-productListItem__image.fs-c-productImage {
  aspect-ratio: 2 / 3;
  height: auto;
  overflow: visible;
}
.fs-c-productListItem__image__image.fs-c-productImage__image {
  aspect-ratio: 2 / 3;
  height: auto;
  object-fit: contain;
  object-position: center;
}

/* 商品名 */
.fs-body-my-wishlist .fs-c-productName {
  margin: 0;
}
.fs-body-my-wishlist .fs-c-productName > a {
  text-decoration: none;
  color: inherit;
}
.fs-body-my-wishlist .fs-c-productName__name {
  display: block;
  font-family: var(--font-serif);
  font-size: 15px;
  line-height: 1.5;
  color: #646464;
}
/* カラー／サイズ（ラベルを付与し、カラー→サイズの順に縦並び） */
.fs-body-my-wishlist .fs-c-productName__variation {
  display: flex;
  flex-direction: column;
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.7;
  color: #8c8c8c;
}
.fs-body-my-wishlist .fs-c-productName__variation__y {
  order: 1;
}
.fs-body-my-wishlist .fs-c-productName__variation__y::before {
  content: "カラー：";
}
.fs-body-my-wishlist .fs-c-productName__variation__x {
  order: 2;
}
.fs-body-my-wishlist .fs-c-productName__variation__x::before {
  content: "サイズ：";
}

/* 価格（税込ラベルはデザインに無いので非表示） */
.fs-body-my-wishlist .fs-c-productListItem__prices {
  margin-top: 8px;
}
.fs-body-my-wishlist .fs-c-productPrice__main__price,
.fs-body-my-wishlist .fs-c-price__value,
.fs-body-my-wishlist .fs-c-price__currencyMark {
  color: #646464 !important;
  font-size: 14px !important;
}
.fs-body-my-wishlist .fs-c-productPrice__addon {
  display: none;
}

/* ---- ボタンエリア ---- */
.fs-body-my-wishlist .fs-c-productListItem__control {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-top: auto;
  padding-top: 14px;
}
/* カート／詳細を見る＝緑の全幅ボタン */
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list,
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--viewProductDetail {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list::before,
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--viewProductDetail::before {
  display: none !important;
}
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list .fs-c-button__label,
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--viewProductDetail .fs-c-button__label {
  color: #fff !important;
}
/* カートは「カートに追加」に文言統一（詳細を見るはそのまま） */
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list .fs-c-button__label {
  font-size: 0;
}
.fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list .fs-c-button__label::after {
  content: "カートに追加";
  font-size: 13px;
}
@media (hover: hover) {
  .fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--addToCart--list:hover,
  .fs-body-my-wishlist .fs-c-productListItem__control .fs-c-button--viewProductDetail:hover {
    opacity: 0.85;
  }
}
/* 解除＝「削除」のグレー下線リンク（中央） */
.fs-body-my-wishlist .fs-c-button--removeFromWishList--icon {
  margin: 0 auto !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  cursor: pointer;
}
.fs-body-my-wishlist .fs-c-button--removeFromWishList--icon::before {
  display: none !important;
}
.fs-body-my-wishlist .fs-c-button--removeFromWishList--icon::after {
  content: "削除";
  font-size: 12px;
  color: #8c8c8c;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* アカウントトップ（plain）＝グレー下線リンク */
.fs-body-my-wishlist .fs-c-buttonContainer--myPageTop {
  margin-top: 56px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-wishlist .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-wishlist .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-wishlist .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}

/* ---------- お気に入り : Tablet ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .fs-body-my-wishlist .site-main > section {
    padding: 40px 24px 80px;
  }
  .fs-body-my-wishlist .fs-c-productList__list {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* ---------- お気に入り : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-wishlist .site-main > section {
    padding: 36px 20px 56px;
  }
  /* ナビ非表示 */
  .fs-body-my-wishlist .fs-c-accountService {
    display: none;
  }
  /* 1カラム・区切り線 */
  .fs-body-my-wishlist .fs-c-productList__list {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin-top: 8px;
  }
  .fs-body-my-wishlist .fs-c-productList__list__item {
    padding: 24px 0 !important;
    border-top: 1px solid #e5e5e5 !important;
  }
  /* カード＝画像左／情報右、ボタンは下に全幅 */
  .fs-body-my-wishlist .fs-c-productListItem > form {
    display: grid;
    grid-template-columns: 110px 1fr;
    column-gap: 16px;
    align-items: start;
  }
  .fs-body-my-wishlist .fs-c-productListItem__imageContainer {
    grid-column: 1;
    grid-row: 1 / 3;
    margin: 0;
  }
  .fs-body-my-wishlist .fs-c-productName {
    grid-column: 2;
    grid-row: 1;
  }
  .fs-body-my-wishlist .fs-c-productListItem__prices {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    margin-top: 8px;
  }
  .fs-body-my-wishlist .fs-c-productListItem__control {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: 16px;
    padding-top: 0;
  }
  /* 画像なしカードは画像列を作らない */
  .fs-body-my-wishlist .fs-c-productListItem:not(:has(.fs-c-productListItem__imageContainer)) > form {
    grid-template-columns: 1fr;
  }
  .fs-body-my-wishlist .fs-c-productListItem:not(:has(.fs-c-productListItem__imageContainer)) .fs-c-productName,
  .fs-body-my-wishlist .fs-c-productListItem:not(:has(.fs-c-productListItem__imageContainer)) .fs-c-productListItem__prices {
    grid-column: 1;
  }
}

/* ==========================================================================
   ★★★ 退会手続き（fs-body-my-account-delete）★★★
   - 会員情報テーブル・中央カラム・アカウントトップは「会員情報詳細」と共有(:is)
   - 退会する＝緑ボタン（右）／キャンセル＝アウトライン（左）のペア
   - PC＝横並び中央 / SP＝縦積み全幅
   ========================================================================== */
.fs-body-my-account-delete .fs-c-buttonContainer--leaveCancel {
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 40px !important;
}
/* キャンセル＝左、退会する＝右（DOM順を order で入れ替え） */
.fs-body-my-account-delete .fs-c-button--cancel {
  order: 1;
}
.fs-body-my-account-delete .fs-c-button--confirmLeave {
  order: 2;
}
.fs-body-my-account-delete .fs-c-button--confirmLeave {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 220px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-my-account-delete .fs-c-button--confirmLeave .fs-c-button__label {
  color: #fff !important;
}
.fs-body-my-account-delete .fs-c-button--cancel {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 220px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 1px solid #cccccc !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-my-account-delete .fs-c-button--cancel .fs-c-button__label {
  color: #646464 !important;
}
@media (hover: hover) {
  .fs-body-my-account-delete .fs-c-button--confirmLeave:hover {
    opacity: 0.85;
  }
  .fs-body-my-account-delete .fs-c-button--cancel:hover {
    opacity: 0.7;
  }
}

/* ---------- 退会手続き : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-account-delete .fs-c-buttonContainer--leaveCancel {
    flex-direction: column;
  }
  .fs-body-my-account-delete .fs-c-button--confirmLeave,
  .fs-body-my-account-delete .fs-c-button--cancel {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ お届け先追加（fs-body-my-addressbook-new）★★★
   - フォーム＝新規アカウント登録と共有（:is）。中央カラムはマイページ共通(1240)
   - 登録＝緑ボタン（右）／キャンセル＝アウトライン（左）のペア＋アカウントトップ
   - メニュー無しページ（SP対応も不要だが念のためペアはSPで縦積み）
   ========================================================================== */
.fs-body-my-addressbook-new .fs-c-buttonContainer--registerCancel {
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 44px !important;
}
.fs-body-my-addressbook-new .fs-c-button--cancel {
  order: 1;
}
.fs-body-my-addressbook-new .fs-c-button--register {
  order: 2;
}
.fs-body-my-addressbook-new .fs-c-button--register {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 220px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: opacity 0.25s ease;
}
.fs-body-my-addressbook-new .fs-c-button--register .fs-c-button__label {
  color: #fff !important;
}
.fs-body-my-addressbook-new .fs-c-button--cancel {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 220px;
  max-width: 100%;
  min-height: 48px;
  margin: 0 !important;
  border: 1px solid #cccccc !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-my-addressbook-new .fs-c-button--cancel .fs-c-button__label {
  color: #646464 !important;
}
@media (hover: hover) {
  .fs-body-my-addressbook-new .fs-c-button--register:hover {
    opacity: 0.85;
  }
  .fs-body-my-addressbook-new .fs-c-button--cancel:hover {
    opacity: 0.7;
  }
}

/* アカウントトップ（plain）＝グレー下線リンク */
.fs-body-my-addressbook-new .fs-c-buttonContainer--myPageTop {
  margin-top: 28px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-addressbook-new .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-addressbook-new .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-addressbook-new .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}

/* ---------- お届け先追加 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-addressbook-new .fs-c-buttonContainer--registerCancel {
    flex-direction: column;
  }
  .fs-body-my-addressbook-new .fs-c-button--register,
  .fs-body-my-addressbook-new .fs-c-button--cancel {
    width: 100%;
    min-height: 52px;
  }
}

/* ==========================================================================
   ★★★ お届け先の追加・変更（お届け先リスト / fs-body-my-addressbook）★★★
   - 中央カラム(1240)はマイページ共通。メニューが入る場合も同スタイル
   - お届け先リストを「グレーのカード」に（氏名＋住所＝左／変更・削除＝右）
   - 追加＝グレー下線リンク（下）／削除＝グレー下線リンク／件数は控えめに
   ========================================================================== */
.fs-body-my-addressbook .fs-c-addressBookList {
  max-width: 640px;
  margin: 40px auto 0;
}
/* フォームのシステム2カラムgridを解除して縦積み＋order制御 */
.fs-body-my-addressbook .fs-c-addressBookList__form {
  display: flex !important;
  flex-direction: column;
}
/* 登録件数（デザインに無いので控えめに・上部右寄せ） */
.fs-body-my-addressbook .fs-c-addressBookList__count {
  order: 1;
  width: 100%;
  margin: 0 0 12px !important;
  text-align: right;
  font-size: 12px;
  color: #8c8c8c;
}
.fs-body-my-addressbook .fs-c-addressBookCount__count {
  margin: 0 2px;
  font-weight: 600;
  color: #646464;
}
/* リスト（テーブル）→ カード群 */
.fs-body-my-addressbook .fs-c-addressBookList__list {
  order: 2;
  display: block;
  width: 100%;
  margin: 0;
  border: 0;
}
.fs-body-my-addressbook .fs-c-addressBookList__list tbody {
  display: block;
  width: 100%;
  border: 0 !important;
}
.fs-body-my-addressbook .fs-c-addressBookList__list tr {
  display: grid;
  grid-template-columns: 1fr auto;
  column-gap: 24px;
  row-gap: 10px;
  align-items: center;
  background: #f5f5f5 !important;
  padding: 26px 32px;
  border: 0 !important;
}
.fs-body-my-addressbook .fs-c-addressBookList__list tr + tr {
  margin-top: 16px;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td {
  display: block;
  padding: 0 !important;
  border: 0 !important;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(2) {
  grid-column: 1;
  grid-row: 2;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(3) {
  grid-column: 2;
  grid-row: 1 / 3;
  justify-self: end;
  align-self: center;
}
/* リスト見出し「お届け先一覧」（デザイン：一番上のカードの上・左・太字 #646464） */
.fs-body-my-addressbook .fs-c-addressBookList__list::before {
  content: "お届け先一覧";
  display: block;
  margin-bottom: 14px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}
/* 各カードの氏名の上に「お届け先」ラベル（太字 #646464 / デザイン通り） */
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(1)::before {
  content: "お届け先";
  display: block;
  margin-bottom: 6px;
  font-family: var(--font-base);
  font-size: 13px;
  font-weight: 700;
  color: #646464;
}
/* 氏名（フリガナは非表示、末尾に「様」） */
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(1) ruby {
  font-size: 15px;
  color: #646464;
  ruby-position: over;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(1) rt {
  display: none;
}
.fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(1)::after {
  content: "　様";
  font-size: 15px;
  color: #646464;
}
/* 住所（〒・住所・電話を縦に） */
.fs-body-my-addressbook .fs-c-address {
  display: block;
  font-size: 13px;
  line-height: 1.85;
  color: #646464;
}
.fs-body-my-addressbook .fs-c-address__zipCode {
  display: block;
}
.fs-body-my-addressbook .fs-c-address__zipCode::before {
  content: "〒";
  margin-right: 3px;
}
.fs-body-my-addressbook .fs-c-address__address {
  display: block;
}
.fs-body-my-addressbook .fs-c-address__tel {
  display: block;
}

/* 変更＝アウトラインボタン／削除＝グレー下線リンク（縦に） */
.fs-body-my-addressbook .fs-c-buttonContainer--deleteChange {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
}
.fs-body-my-addressbook .fs-c-button--changeInfomation {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 104px;
  min-height: 40px;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 1px solid #646464 !important;
  border-radius: 3px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 13px;
  font-weight: 400;
  text-decoration: none;
  cursor: pointer;
}
.fs-body-my-addressbook .fs-c-button--changeInfomation::before {
  content: none !important;
}
.fs-body-my-addressbook .fs-c-button--changeInfomation .fs-c-button__label {
  color: #646464 !important;
}
.fs-body-my-addressbook .fs-c-button--delete {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #8c8c8c !important;
  font-family: var(--font-base);
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.fs-body-my-addressbook .fs-c-button--delete::before {
  content: none !important;
}
.fs-body-my-addressbook .fs-c-button--delete .fs-c-button__label {
  color: #8c8c8c !important;
}

/* 追加＝グレー下線リンク（カードの下・中央）。文言は「追加する」に */
.fs-body-my-addressbook .fs-c-addressBookList__addButton {
  order: 3;
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 28px 0 0 !important;
  text-align: center;
}
.fs-body-my-addressbook .fs-c-button--addToAddressbook {
  display: inline-block;
  width: auto !important;
  min-width: 0 !important;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #646464 !important;
  font-family: var(--font-base);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-addressbook .fs-c-button--addToAddressbook::before {
  content: none !important;
}
.fs-body-my-addressbook .fs-c-button--addToAddressbook .fs-c-button__label {
  font-size: 0;
}
.fs-body-my-addressbook .fs-c-button--addToAddressbook .fs-c-button__label::after {
  content: "追加する";
  font-size: 14px;
}

/* アカウントトップ＝グレー下線リンク */
.fs-body-my-addressbook .fs-c-buttonContainer--myPageTop {
  margin-top: 28px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-addressbook .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-addressbook .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-addressbook .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}

/* ---------- お届け先リスト : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-addressbook .fs-c-addressBookList__list tr {
    grid-template-columns: 1fr;
    padding: 20px;
  }
  .fs-body-my-addressbook .fs-c-addressBookList__list td:nth-child(3) {
    grid-column: 1;
    grid-row: 3;
    justify-self: stretch;
    margin-top: 6px;
  }
  .fs-body-my-addressbook .fs-c-buttonContainer--deleteChange {
    flex-direction: row;
    justify-content: center;
    gap: 20px;
  }
}

/* ==========================================================================
   ★★★ ポイント履歴（fs-body-my-points）★★★
   - デザイン無し。マイページ系のテイストに合わせて提案
   - 中央1240カラム（container :is に .fs-body-my-points 追加済）
   - 見出しは他マイページと同じ体裁（中央＋下ボーダー）
   - 保有ポイントを「グレーカードの明細」に（ご利用可能を主役に）
   - 履歴一覧は見出し＋「履歴がありません。」を中央に
   - アカウントトップはグレー下線リンク
   ========================================================================== */
/* 見出しは共通 .page-title（他マイページと同じ）をそのまま使用（上書きしない） */
/* 履歴ブロック全体を中央の読みやすい幅に */
.fs-body-my-points .fs-c-history {
  max-width: 640px;
  margin: 40px auto 0;
}
/* --- 保有ポイント明細（グレーカード） --- */
/* システムが __info に付ける薄いグレー背景を解除（見出しは listContainer::before と同じく白地に） */
.fs-body-my-points .fs-c-history__info {
  margin: 0;
  padding: 0;
  max-width: 640px;
  background: transparent !important;
}
/* セクション見出し「保有ポイント」 */
.fs-body-my-points .fs-c-history__info::before {
  content: "保有ポイント";
  display: block;
  margin-bottom: 12px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}

.fs-body-my-points .fs-c-history__info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
}
/* 「保有ポイント」見出し */
.fs-body-my-points .fs-c-history__info::before {
  width: auto;
  margin: 0 10px 12px 0; /* margin-right:auto で右端に押し出す */
}
/* 注意文を ::after で右隣に */
.fs-body-my-points .fs-c-history__info::after {
  content: "ポイントは2,000ptごとにご利用いただけます";
  order: 1;
  padding: 4px 10px;
  border: 1px solid #646464;
  font-size: 13px;
  line-height: 1.7;
  white-space: nowrap;
  position: absolute;
  top: -7px;
  left: 50%;
  transform: translateX(-50%);
}
/* ポイント一覧は次の行へ */
.fs-body-my-points .fs-c-history__infoSummary {
  order: 2;
  width: 100%;
}

.fs-body-my-points .fs-c-history__infoSummary {
  background: #f5f5f5;
  padding: 24px 28px;
}
.fs-body-my-points .fs-c-pointSummary {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end; /* 各行のラベル/値を下端で揃え、区切り線の縦位置を一致させる */
  column-gap: 0px;
  row-gap: 12px;
  margin: 0;
}
/* システムが available/limited セルに付ける薄いグレー背景・余白を解除 */
.fs-body-my-points .fs-c-pointSummary dt,
.fs-body-my-points .fs-c-pointSummary dd {
  background: transparent !important;
  padding: 0;
}
.fs-body-my-points .fs-c-pointSummary dt {
  grid-column: 1;
  margin: 0;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
.fs-body-my-points .fs-c-pointSummary dd {
  grid-column: 2;
  margin: 0;
  text-align: right;
}
.fs-body-my-points .fs-c-pointSummary__number {
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 700;
  color: #646464;
}
.fs-body-my-points .fs-c-pointSummary__number::after {
  content: " pt";
  font-size: 12px;
  font-weight: 400;
  color: #646464;
}
/* ご利用可能ポイントを主役に（大きく／下に区切り線） */
.fs-body-my-points .fs-c-pointSummary dt.fs-c-pointSummary__label--availablePoint,
.fs-body-my-points .fs-c-pointSummary dd.fs-c-pointSummary__value--availablePoint {
  align-self: end;
  padding-bottom: 14px;
  border-bottom: 1px solid #dcdcdc;
}
.fs-body-my-points .fs-c-pointSummary dt.fs-c-pointSummary__label--availablePoint {
  font-weight: 700;
  color: #646464;
}
.fs-body-my-points .fs-c-pointSummary__value--availablePoint .fs-c-pointSummary__number {
  font-size: 30px;
  line-height: 1;
}
.fs-body-my-points .fs-c-pointSummary__value--availablePoint .fs-c-pointSummary__number::after {
  font-size: 14px;
}
/* 「うち期間限定ポイント」は補足として控えめに（可能ポイントの内訳） */
.fs-body-my-points .fs-c-pointSummary dt.fs-c-pointSummary__label--limitedPoint,
.fs-body-my-points .fs-c-pointSummary dd.fs-c-pointSummary__value--limitedPoint {
  padding-bottom: 14px;
  border-bottom: 1px solid #dcdcdc;
}
.fs-body-my-points .fs-c-pointSummary dt.fs-c-pointSummary__label--limitedPoint {
  font-size: 12px;
  color: #8c8c8c;
}
.fs-body-my-points .fs-c-pointSummary__value--limitedPoint .fs-c-pointSummary__number {
  font-size: 14px;
  font-weight: 400;
  color: #646464;
}
/* --- 履歴一覧 --- */
.fs-body-my-points .fs-c-history__listContainer {
  margin-top: 40px;
}
.fs-body-my-points .fs-c-history__listContainer::before {
  content: "獲得・利用履歴";
  display: block;
  margin-bottom: 12px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}
/* 履歴なしメッセージ */
.fs-body-my-points .fs-c-noResultMessage {
  margin: 0;
  padding: 40px 20px;
  background: #f5f5f5;
  text-align: center;
}
.fs-body-my-points .fs-c-noResultMessage__title {
  font-family: var(--font-base);
  font-size: 14px;
  color: #8c8c8c;
}
/* 履歴テーブル（データがある場合の最小整形。マイページのテイストに） */
.fs-body-my-points .fs-c-history__list {
  display: table;
  width: 100%;
  border-collapse: collapse;
  border: 0;
  font-family: var(--font-base);
  font-size: 13px;
  color: #646464;
}
.fs-body-my-points .fs-c-history__list th,
.fs-body-my-points .fs-c-history__list td {
  padding: 12px 8px;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
  text-align: left;
  vertical-align: top;
}
.fs-body-my-points .fs-c-history__list thead th {
  font-weight: 700;
  color: #646464;
  border-bottom: 1px solid #cbcbcb;
}
/* --- アカウントトップ（グレー下線リンク） --- */
.fs-body-my-points .fs-c-buttonContainer--myPageTop {
  margin-top: 44px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-points .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-points .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-points .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-points .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}

/* ---------- ポイント履歴 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-points .fs-c-history {
    max-width: none;
  }
  .fs-body-my-points .fs-c-history__info {
    max-width: 640px;
  }
  .fs-body-my-points .fs-c-history__infoSummary {
    padding: 20px;
  }
  .fs-body-my-points .fs-c-pointSummary__value--availablePoint .fs-c-pointSummary__number {
    font-size: 26px;
  }

  .fs-body-my-points .fs-c-accountService {
    display: none;
  }
}

@media (max-width: 480px) {
  .fs-body-my-points .fs-c-history__info::after {
    position: relative;
    left: inherit;
    transform: none;
    margin: 10px auto;
  }
}

/* ==========================================================================
   ★★★ 注文履歴（システムページ / fs-body-my-orders・#fs_MyOrders）★★★
   - デザイン無し。ポイント履歴(fs-body-my-points)と同じ fs-c-history 構造。
   - 外枠中央寄せ・共通 .page-title・アカウントトップ=グレー下線は
     マイページ共通 :is グループに .fs-body-my-orders 追加済で継承。
   - __info：年ドロップダウン＋期間＋合計（注文合計金額/件数）をグレーカードに。
   - __listContainer：見出し＋「履歴がありません。」を中央グレーカードに。
   ========================================================================== */
/* システムは my-orders の .fs-c-history を2カラム(一覧左｜サマリー右)にするが、
   縦積み(サマリー上・一覧下)に統一（ポイント履歴と同じ体裁） */
.fs-body-my-orders .fs-c-history {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  max-width: 640px;
  margin: 40px auto 0;
}
.fs-body-my-orders .fs-c-history__info,
.fs-body-my-orders .fs-c-history__listContainer {
  grid-column: 1 !important;
  grid-row: auto !important;
}
/* システムが __info に付ける薄グレー背景を解除 */
.fs-body-my-orders .fs-c-history__info {
  margin: 0;
  padding: 0;
  background: transparent !important;
}
/* 年セレクト（期間切替）：右寄せの小ドロップダウン */
.fs-body-my-orders .fs-c-history__termCtrl {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}
.fs-body-my-orders .fs-c-history__termCtrl .fs-c-dropdown {
  height: 40px;
  border: 0;
  background: transparent;
  overflow: visible;
}
.fs-body-my-orders .fs-c-history__termCtrl .fs-c-dropdown__menu {
  box-sizing: border-box;
  height: 40px;
  min-width: 120px;
  padding: 0 2.4em 0 12px;
  border: 1px solid #cbcbcb;
  border-radius: 6px;
  background: #fff;
  font-family: var(--font-base);
  font-size: 14px;
  color: #333333;
}
.fs-body-my-orders .fs-c-history__termCtrl .fs-c-dropdown::after {
  top: 1px;
  right: 1px;
  bottom: 1px;
  background: transparent;
  border-left: 0;
  color: #646464;
  font-size: 1.4rem;
}
/* 期間＋合計サマリー：グレーカード */
.fs-body-my-orders .fs-c-history__infoSummary {
  background: #f5f5f5;
  padding: 22px 24px;
}
.fs-body-my-orders .fs-c-history__term {
  margin-bottom: 12px;
  font-size: 13px;
  color: #8c8c8c;
}
.fs-body-my-orders .fs-c-history__total .fs-c-pairList {
  display: grid;
  grid-template-columns: 1fr auto;
  row-gap: 8px;
  margin: 0;
}
.fs-body-my-orders .fs-c-history__total dt {
  grid-column: 1;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important; /* システムの途切れる #7c8790 罫線を解除 */
  font-size: 14px;
  font-weight: 400;
  color: #646464;
}
.fs-body-my-orders .fs-c-history__total dd {
  grid-column: 2;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  text-align: right;
  font-size: 14px;
  font-weight: 600;
  color: #333333;
}
.fs-body-my-orders .fs-c-history__total .fs-c-price {
  font-family: var(--font-serif);
}
/* --- 履歴一覧 --- */
.fs-body-my-orders .fs-c-history__listContainer {
  margin-top: 40px;
}
.fs-body-my-orders .fs-c-history__listContainer::before {
  content: "ご注文一覧";
  display: block;
  margin-bottom: 12px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}
/* 履歴なしメッセージ */
.fs-body-my-orders .fs-c-noResultMessage {
  margin: 0;
  padding: 40px 20px;
  background: #f5f5f5;
  text-align: center;
}
.fs-body-my-orders .fs-c-noResultMessage__title {
  font-family: var(--font-base);
  font-size: 14px;
  color: #8c8c8c;
}
/* --- 注文一覧（データがある場合：.fs-c-orderHistory > .fs-c-orderHistoryItem） --- */
/* 件数表示（1件中 1-1件表示）：控えめに右寄せ */
.fs-body-my-orders .fs-c-listControl {
  margin: 0 0 12px;
  font-family: var(--font-base);
  font-size: 12px;
  color: #8c8c8c;
}
.fs-body-my-orders .fs-c-orderHistory + .fs-c-listControl,
.fs-body-my-orders .fs-c-orderHistoryItem + .fs-c-listControl,
.fs-body-my-orders .fs-c-orderHistory ~ .fs-c-listControl {
  margin: 16px 0 0;
}

.fs-body-my-orders .fs-c-orderHistory {
  margin-top: 0;
}
/* 注文カード：白カード＋細枠（他マイページのカードと同トーン） */
.fs-body-my-orders .fs-c-orderHistoryItem {
  margin-bottom: 16px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  overflow: hidden;
}
.fs-body-my-orders .fs-c-orderHistoryItem:last-child {
  margin-bottom: 0;
}
/* ヘッダー：注文日/コード/合計 ＋ 詳細ボタン。グレー帯で本文と区切る */
.fs-body-my-orders .fs-c-orderHistoryItem__header {
  gap: 10px 20px;
  padding: 14px 20px;
  background: #f5f5f5;
  border-bottom: 1px solid #e0e0e0;
}
.fs-body-my-orders .fs-c-orderHistoryItem__orderInfo {
  padding-top: 0;
  gap: 6px 24px;
}
.fs-body-my-orders .fs-c-orderHistoryItem__orderInfo__info {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;
}
.fs-body-my-orders .fs-c-orderHistoryItem__orderInfo__info dt {
  margin: 0;
}
.fs-body-my-orders .fs-c-orderHistoryItem__orderInfo__info .fs-c-string--label {
  font-size: 12px;
  color: #646464;
}
.fs-body-my-orders .fs-c-orderHistoryItem__orderInfo__info dd {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: #333333;
}
/* ヘッダー内 合計金額はセリフ（他ページの価格と揃える） */
.fs-body-my-orders .fs-c-orderHistoryItem__orderSummary .fs-c-price {
  font-family: var(--font-serif);
}
/* 「注文履歴詳細を見る」＝小さめアウトラインボタン */
.fs-body-my-orders .fs-c-orderHistoryItem__header__button {
  padding: 0;
}
.fs-body-my-orders .fs-c-button--viewOrderHistoryDetail {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid #646464;
  border-radius: 4px;
  background: #fff;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 12px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.fs-body-my-orders .fs-c-button--viewOrderHistoryDetail::before {
  content: none !important;
}
.fs-body-my-orders .fs-c-button--viewOrderHistoryDetail .fs-c-button__label {
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-orders .fs-c-button--viewOrderHistoryDetail:hover {
    opacity: 0.7;
  }
}
/* 本文（商品行） */
.fs-body-my-orders .fs-c-orderHistoryItem__body {
  padding: 4px 20px;
}
.fs-body-my-orders .fs-c-orderHistoryItem__product {
  gap: 4px 16px;
  padding: 18px 0;
}
/* 1注文に複数商品がある場合の区切り：システムの濃い破線(#b2b2b2)を
   カード枠と揃えた淡い実線に */
.fs-body-my-orders .fs-c-orderHistoryItem__product + .fs-c-orderHistoryItem__product {
  border-top: 1px solid #ececec;
}
.fs-body-my-orders .fs-c-orderHistoryItem__productImage__image {
  padding-right: 0;
}
.fs-body-my-orders .fs-c-orderHistoryItem__productName a {
  color: #333333;
  text-decoration: none;
}
.fs-body-my-orders .fs-c-listedProductName__name {
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #333333;
}
.fs-body-my-orders .fs-c-listedProductName__variation {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #8c8c8c;
}
.fs-body-my-orders .fs-c-orderHistoryItem__unitPrice .fs-c-price {
  font-family: var(--font-serif);
  font-size: 14px;
  color: #333333;
}
/* 「税込」→「tax in」（サイト共通の表記に統一）。元テキストは隠して content で差替え */
.fs-body-my-orders .fs-c-productPrice__addon {
  margin-left: 4px;
}
.fs-body-my-orders .fs-c-productPrice__addon__label {
  font-size: 0;
}
.fs-body-my-orders .fs-c-productPrice__addon__label::after {
  content: "tax in";
  font-family: var(--font-base);
  font-size: 11px;
  letter-spacing: 0.02em;
  color: #8c8c8c;
}
.fs-body-my-orders .fs-c-orderHistoryItem__productQuantity {
  font-size: 13px;
  color: #646464;
}
.fs-body-my-orders .fs-c-orderHistoryItem__productQuantity__label {
  margin-right: 6px;
  font-size: 12px;
  color: #8c8c8c;
}
/* 今回レビューは使用しないため「レビューを書く」リンクは非表示 */
.fs-body-my-orders .fs-c-buttonContainer--addReview--detail,
.fs-body-my-orders .fs-c-button--addReview--detail {
  display: none !important;
}
/* --- アカウントトップ（グレー下線リンク） --- */
.fs-body-my-orders .fs-c-buttonContainer--myPageTop {
  margin-top: 44px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-orders .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-orders .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-orders .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-orders .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}
@media (max-width: 767px) {
  .fs-body-my-orders .fs-c-history {
    max-width: none;
  }
  .fs-body-my-orders .fs-c-history__infoSummary {
    padding: 20px;
  }
}

/* ==========================================================================
   ★★★ 注文履歴詳細（システムページ / fs-body-my-orders-details・#fs_MyOrderDetails）★★★
   - デザイン無し。注文履歴(my-orders)・購入フロー(checkout)とテイスト統一。
   - 中央720カラム＋共通 .page-title。税込→tax in はサイト共通表記を踏襲。
   - 標準の :is() グループには入れず自己完結ブロック。
   ========================================================================== */
.fs-body-my-orders-details .site-main > section {
  box-sizing: border-box;
  max-width: 720px;
  margin: 0 auto;
  padding: 64px 20px 96px;
}
.fs-body-my-orders-details .fs-c-orderDetail {
  margin-top: 32px;
}
/* ご注文日時 / ご注文コード：システムの茶枠・茶背景を解除し淡いカードに */
.fs-body-my-orders-details .fs-c-orderDetailList {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 16px;
  padding: 16px 20px;
  border: 0;
  background: #f5f5f5;
}
.fs-body-my-orders-details .fs-c-orderDetailList dt,
.fs-body-my-orders-details .fs-c-orderDetailList dd {
  margin: 0;
  padding: 0;
  line-height: 1.6;
  background: transparent !important;
  color: inherit !important;
}
.fs-body-my-orders-details .fs-c-orderDetailList dt .fs-c-string--label {
  font-size: 12px;
  color: #8c8c8c;
}
.fs-body-my-orders-details .fs-c-orderDetailList dd {
  font-size: 13px;
  color: #333333;
}
/* セクション見出し（ご注文明細 / ご注文内容） */
.fs-body-my-orders-details .fs-c-heading--section {
  margin: 40px 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e0e0e0;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 700;
  color: #333333;
}
/* 明細ブロックはシステムの≥960px 2カラム(1fr 352px)を解除して縦積みに統一 */
.fs-body-my-orders-details .fs-c-orderPerAddressee,
.fs-body-my-orders-details .fs-c-orderDetailInfo {
  display: block;
}
/* お届け先見出し（お届け先1 ＋ ご自宅ラベル）。システムの帯(#7c8790)を解除 */
.fs-body-my-orders-details .fs-c-orderPerAddressee__heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 24px 0 12px;
  padding: 0;
  background: transparent;
  border: 0;
  font-family: var(--font-base);
  font-size: 14px;
  font-weight: 700;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-orderPerAddressee__headingNumber {
  color: #333333;
}
.fs-body-my-orders-details .fs-c-homeLabel {
  padding: 2px 10px;
  border: 1px solid #cbcbcb;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 400;
  color: #646464;
}
/* お届け先（氏名 / 住所）＝淡いカードの定義リスト */
.fs-body-my-orders-details .fs-c-addresseeList {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 20px;
  margin: 0 0 20px;
  padding: 16px 20px;
  background: #f5f5f5;
}
.fs-body-my-orders-details .fs-c-addresseeList dt {
  font-size: 12px;
  font-weight: 400;
  color: #8c8c8c;
}
.fs-body-my-orders-details .fs-c-addresseeList > dd {
  margin: 0;
  font-size: 13px;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-address {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 10px;
}
/* 商品テーブル（cartTable）：画像＋商品名＋単価 ／ 数量 ／ 小計 */
.fs-body-my-orders-details .fs-c-cartTable {
  width: 100%;
  border-collapse: collapse;
}
.fs-body-my-orders-details .fs-c-cartTable thead {
  display: none;
}
.fs-body-my-orders-details .fs-c-cartTable__row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 16px;
  align-items: start;
  padding: 16px 0;
  border-top: 1px solid #e5e5e5;
}
.fs-body-my-orders-details .fs-c-cartTable__row:first-of-type {
  border-top: 0;
}
.fs-body-my-orders-details .fs-c-cartTable__dataCell {
  padding: 0;
  border: 0;
}
.fs-body-my-orders-details .fs-c-cartTable__dataCell--product {
  grid-column: 1 / 3;
  grid-row: 1;
}
.fs-body-my-orders-details .fs-c-cartTable__product {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.fs-body-my-orders-details .fs-c-cartTable__productImage {
  flex: 0 0 88px;
  margin: 0;
  padding-right: 0;
  background: #f2f1ed;
}
.fs-body-my-orders-details .fs-c-cartTable__productImage__image {
  display: block;
  width: 100%;
  height: auto;
}
.fs-body-my-orders-details .fs-c-cartTable__productName a,
.fs-body-my-orders-details .fs-c-listedProductName__name {
  font-family: var(--font-serif);
  font-size: 14px;
  color: #333333;
  text-decoration: none;
}
.fs-body-my-orders-details .fs-c-listedProductName__variation {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  color: #646464;
}
.fs-body-my-orders-details .fs-c-listedProductName__variation__choice + .fs-c-listedProductName__variation__choice::before {
  content: " / ";
}
.fs-body-my-orders-details .fs-c-cartTable__unitPrice {
  margin-top: 8px;
  font-family: var(--font-serif);
  font-size: 14px;
  color: #333333;
}
/* 単価の「税込」→ tax in（サイト共通表記） */
.fs-body-my-orders-details .fs-c-cartTable__unitPrice .fs-c-productPrice__addon {
  margin-left: 4px;
}
.fs-body-my-orders-details .fs-c-cartTable__unitPrice .fs-c-productPrice__addon__label {
  font-size: 0;
}
.fs-body-my-orders-details .fs-c-cartTable__unitPrice .fs-c-productPrice__addon__label::after {
  content: "tax in";
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
/* 数量 / 小計（2行目・ラベルは::beforeで付与） */
.fs-body-my-orders-details .fs-c-cartTable__dataCell--quantity {
  grid-column: 1;
  grid-row: 2;
  font-size: 14px;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-cartTable__dataCell--quantity::before {
  content: "数量：";
  color: #646464;
}
.fs-body-my-orders-details .fs-c-cartTable__dataCell--subtotal {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  text-align: right;
  font-family: var(--font-serif);
  font-size: 15px;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-cartTable__dataCell--subtotal::before {
  content: "小計：";
  font-family: var(--font-base);
  font-size: 13px;
  color: #8c8c8c;
}
/* 合計テーブル（送料/合計 ・ 商品合計/送料/総合計/獲得ポイント）＝グレーカード */
.fs-body-my-orders-details .fs-c-orderTotalInfo,
.fs-body-my-orders-details .fs-c-orderDetailInfo__orderTotal {
  margin-top: 20px;
  padding: 18px 20px;
  background: #f5f5f5;
}
.fs-body-my-orders-details .fs-c-orderTotalTable {
  width: 100%;
  border-collapse: collapse;
}
.fs-body-my-orders-details .fs-c-orderTotalTable th,
.fs-body-my-orders-details .fs-c-orderTotalTable td {
  padding: 6px 0 !important;
  border: 0 !important;
  font-size: 14px;
  line-height: 1.6;
}
.fs-body-my-orders-details .fs-c-orderTotalTable th {
  text-align: left;
  font-weight: 400;
  color: #646464;
}
.fs-body-my-orders-details .fs-c-orderTotalTable td {
  text-align: right;
  color: #333333;
}
/* 合計・総合計は上罫線＋セリフ強調 */
.fs-body-my-orders-details .fs-c-orderTotalTable__total th,
.fs-body-my-orders-details .fs-c-orderTotalTable__total td,
.fs-body-my-orders-details .fs-c-orderTotalTable__grandTotal th,
.fs-body-my-orders-details .fs-c-orderTotalTable__grandTotal td {
  padding-top: 12px !important;
  border-top: 1px solid #e0e0e0 !important;
}
.fs-body-my-orders-details .fs-c-orderTotalTable__total th,
.fs-body-my-orders-details .fs-c-orderTotalTable__grandTotal th {
  font-weight: 700;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-orderTotalTable__total td,
.fs-body-my-orders-details .fs-c-orderTotalTable__grandTotal td,
.fs-body-my-orders-details .fs-c-orderTotalTable__total .fs-c-price,
.fs-body-my-orders-details .fs-c-orderTotalTable__grandTotal .fs-c-price {
  font-family: var(--font-serif);
  font-size: 16px;
  color: #333333;
}
/* お支払い方法（合計カード内・上罫線で区切る） */
.fs-body-my-orders-details .fs-c-orderPaymentTable {
  width: 100%;
  border-collapse: collapse;
  margin-top: 8px;
  padding-top: 12px;
  border-top: 0px solid #e0e0e0;
}
.fs-body-my-orders-details .fs-c-orderPaymentTable th,
.fs-body-my-orders-details .fs-c-orderPaymentTable td {
  padding: 6px 0;
  border: 0;
  font-size: 14px;
}
.fs-body-my-orders-details .fs-c-orderPaymentTable th {
  text-align: left;
  font-weight: 400;
  color: #646464;
  background: none;
}
.fs-body-my-orders-details .fs-c-orderPaymentTable__payment {
  text-align: right;
  color: #333333;
}
/* 配送情報（配達希望日時 / 時間帯 / 配送サービス）＝罫線を外しラベル/値の列に */
.fs-body-my-orders-details .fs-c-deliveryInfoList {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 20px;
  margin-top: 16px;
  border: 0;
  font-size: 13px;
}
.fs-body-my-orders-details .fs-c-deliveryInfoList > dt,
.fs-body-my-orders-details .fs-c-deliveryInfoList__detailList > dt {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-weight: 400;
  color: #8c8c8c;
}
.fs-body-my-orders-details .fs-c-deliveryInfoList > dd {
  margin: 0;
  padding: 0;
  border: 0;
  color: #333333;
}
.fs-body-my-orders-details .fs-c-deliveryInfoList__detailList {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  margin: 0;
}
.fs-body-my-orders-details .fs-c-deliveryInfoList__detailList > dd {
  margin: 0;
  color: #333333;
}
/* 戻るボタン＝アウトライン中央 */
.fs-body-my-orders-details .fs-c-buttonContainer--back {
  margin-top: 40px;
  justify-content: center;
  text-align: center;
}
.fs-body-my-orders-details .fs-c-button--back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 200px;
  min-height: 46px;
  padding: 0 24px;
  border: 1px solid #646464;
  border-radius: 0;
  background: #fff;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
}
.fs-body-my-orders-details .fs-c-button--back::before {
  content: none !important;
}
@media (hover: hover) {
  .fs-body-my-orders-details .fs-c-button--back:hover {
    opacity: 0.7;
  }
}
@media (max-width: 767px) {
  .fs-body-my-orders-details .site-main > section {
    padding: 40px 20px 64px;
  }
  .fs-body-my-orders-details .fs-c-cartTable__productImage {
    flex-basis: 72px;
  }
  /* システムが ≤600px で付ける行の枠・小計セルの背景を解除（縦積みカード体裁を維持） */
  .fs-body-my-orders-details .fs-c-cartTable__row {
    border: 0;
    border-top: 1px solid #e5e5e5;
  }
  .fs-body-my-orders-details .fs-c-cartTable__row:first-of-type {
    border-top: 0;
  }
  .fs-body-my-orders-details .fs-c-cartTable__dataCell {
    padding: 0;
  }
  .fs-body-my-orders-details .fs-c-cartTable__dataCell--subtotal {
    background: transparent;
    border-top: 0;
  }
}

/* ==========================================================================
   ★★★ マイページ クーポン情報（fs-body-my-coupons / #fs_MyCoupons）★★★
   - デザイン無し・他マイページ系とテイスト統一。中央1240カラム＋共通 .page-title
   - クーポン無し時のメッセージ＝中央グレーカード、アカウントトップ＝グレー下線リンク
   ========================================================================== */
.fs-body-my-coupons .site-main > section {
  box-sizing: border-box;
  max-width: 1240px;
  margin: 0 auto;
  padding: 64px 20px 96px;
}
/* クーポン一覧（中央560カラム。無し時のメッセージはグレーカード） */
.fs-body-my-coupons .fs-c-couponList {
  max-width: 560px;
  margin: 40px auto 0;
}
.fs-body-my-coupons .fs-c-noResultMessage {
  margin: 0;
  padding: 40px 20px;
  background: #f5f5f5;
  text-align: center;
}
.fs-body-my-coupons .fs-c-noResultMessage__title {
  font-family: var(--font-base);
  font-size: 14px;
  color: #8c8c8c;
}
/* アカウントトップ＝グレー下線テキストリンク（他マイページと共通あしらい） */
.fs-body-my-coupons .fs-c-buttonContainer--myPageTop {
  margin-top: 32px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-coupons .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-coupons .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-coupons .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-coupons .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}
/* ---------- クーポン情報 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-coupons .site-main > section {
    padding: 40px 20px 64px;
  }
}

/* ==========================================================================
   ★★★ マイページ ログイン連携（fs-body-my-linkedAccounts / #fs_MyLinkedAccounts）★★★
   - システムレイアウト fs-l-main > fs-l-pageMain。デザイン無し・他マイページ系と統一
   - 連携サービスはリスト（ループ想定）＝1行1サービス（サービス名｜状態｜ボタン）
   - 連携停止モーダル（fs-c-modal--linkedAccounts-revoke）は checkout モーダルと同トーン
   ========================================================================== */
.fs-body-my-linkedAccounts .fs-l-pageMain {
  box-sizing: border-box;
  padding: 64px 20px 96px;
}
/* 見出し下の説明＋連携リストは中央560カラム */
.fs-body-my-linkedAccounts .fs-c-inputInformation {
  max-width: 560px;
  margin: 0 auto;
}
.fs-body-my-linkedAccounts .fs-c-inputInformation__message {
  margin-top: 32px;
  font-family: var(--font-base);
  font-size: 14px;
  line-height: 1.9;
  color: #646464;
  text-align: center;
}
.fs-body-my-linkedAccounts .fs-c-inputInformation__field {
  margin-top: 28px;
}
/* 連携サービス一覧（ループ）：1行1サービスのカード（サービス名｜状態｜ボタン） */
.fs-body-my-linkedAccounts .fs-c-linkServicesList {
  display: grid;
  gap: 12px;
  /* ※システムが min-width:1200px で 2カラム(1fr 1fr)にするが、
     こちらは 560px 中央カラムなので常に1列に固定して崩れを防ぐ */
  grid-template-columns: 1fr;
}
.fs-body-my-linkedAccounts .fs-c-linkService {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 16px 20px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  box-shadow: none; /* システムの box-shadow:0 0 2px を解除 */
}
.fs-body-my-linkedAccounts .fs-c-linkService__service {
  flex: 1 1 auto; /* サービス名を左、状態/ボタンを右へ寄せる */
  min-width: 0;
}
.fs-body-my-linkedAccounts .fs-c-linkService__status {
  flex: 0 0 auto;
}
/* システムは __button を固定 width:290px にするが、内容幅に合わせて右寄せ */
.fs-body-my-linkedAccounts .fs-c-linkService__button {
  flex: 0 0 auto;
  width: auto;
}
.fs-body-my-linkedAccounts .fs-c-linkService__service__label {
  font-size: 15px;
  letter-spacing: 0.02em;
  color: #333333;
}
.fs-body-my-linkedAccounts .fs-c-linkService__status__label {
  font-size: 12px;
  color: #8c8c8c;
}
/* 連携する/停止するボタン（テキストボタン時のみサイト調の小アウトラインに。
   SNS公式ボタン画像が出る場合はそのまま活かす）
   ※実ボタンは base の .fs-c-button を持たず fs-c-button--particular 等のみのため
     システム同様 [class*="fs-c-button--"] で拾う */
.fs-body-my-linkedAccounts .fs-c-linkService__button [class*="fs-c-button--"]:not(:has(.fs-c-button__image)) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 16px;
  border: 1px solid #646464;
  border-radius: 0;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  cursor: pointer;
}
/* アカウントトップ＝グレー下線テキストリンク（他マイページ共通あしらい） */
.fs-body-my-linkedAccounts .fs-c-buttonContainer--myPageTop {
  margin-top: 40px !important;
  justify-content: center;
  text-align: center;
}
.fs-body-my-linkedAccounts .fs-c-button--myPageTop {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fs-body-my-linkedAccounts .fs-c-button--myPageTop::before {
  content: none !important;
}
.fs-body-my-linkedAccounts .fs-c-button--myPageTop .fs-c-button__label {
  font-size: 14px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-linkedAccounts .fs-c-button--myPageTop:hover {
    opacity: 0.7;
  }
}
/* 連携停止モーダル（fs-c-modal--linkedAccounts-revoke）＝checkoutモーダルと同トーン */
.fs-body-my-linkedAccounts .fs-c-modal__inner {
  border-radius: 6px;
  box-shadow: 0 12px 44px rgba(0, 0, 0, 0.22);
}
.fs-body-my-linkedAccounts .fs-c-modal__header {
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
  border-radius: 6px 6px 0 0;
  padding: 16px 20px;
  font-size: 15px;
  font-weight: 600;
  color: #333333;
}
.fs-body-my-linkedAccounts .fs-c-modal__close {
  padding: 6px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-my-linkedAccounts .fs-c-modal__close:hover {
    color: #333333;
  }
}
.fs-body-my-linkedAccounts .fs-c-modal__contents {
  padding: 24px 20px 28px;
}
.fs-body-my-linkedAccounts .fs-c-revokeLinkedAccount__info {
  font-size: 14px;
  line-height: 1.8;
  color: #646464;
  text-align: center;
}
.fs-body-my-linkedAccounts .fs-c-revokeLinkedAccount__service {
  color: #333333;
  font-weight: 600;
}
.fs-body-my-linkedAccounts .fs-c-revokeLinkedAccount__note {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.7;
  color: #8c8c8c;
}
.fs-body-my-linkedAccounts .fs-c-modal__inner .fs-c-buttonContainer--pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  max-width: 100%;
  margin: 24px auto 0;
}
.fs-body-my-linkedAccounts .fs-c-modal__inner .fs-c-button--primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0 !important;
  min-height: 46px;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.fs-body-my-linkedAccounts .fs-c-modal__inner .fs-c-button--primary .fs-c-button__label {
  color: #fff !important;
}
.fs-body-my-linkedAccounts .fs-c-modal__inner .fs-c-button--standard {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0 !important;
  min-height: 46px !important;
  margin: 0;
  padding: 0 !important;
  border: 1px solid #646464 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 14px;
  cursor: pointer;
}

/* ---------- ログイン連携 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-my-linkedAccounts .fs-l-pageMain {
    padding: 40px 20px 64px;
  }
  /* カード内：サービス名＋状態を1行目、ボタンを全幅2行目に落とす */
  .fs-body-my-linkedAccounts .fs-c-linkService {
    flex-wrap: wrap;
    gap: 12px 12px;
    padding: 16px;
  }
  .fs-body-my-linkedAccounts .fs-c-linkService__button {
    flex: 1 0 100%;
  }
  .fs-body-my-linkedAccounts .fs-c-linkService__button .fs-c-button:not(:has(.fs-c-button__image)) {
    width: 100%;
  }
}

/* ==========================================================================
   ★★★ 購入ステップ（フリーパーツ .checkout-steps）★★★
   - カート → ご注文手続き → ご注文内容確認 → ご注文完了 の4ステップ
   - システムパーツではなく再利用フリーパーツ。各ページ見出しの直前に設置
   - 現在地の <li> に .is-current を付けると dot / label が濃くなる
   - ドットを水平線でつなぐ（線は list::before、ドットが線の上に重なる）
   ========================================================================== */
.checkout-steps {
  max-width: 600px;
  margin: 0 auto;
  padding: 8px 0 0;
}
.checkout-steps__list {
  position: relative;
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* ドット中心をつなぐ横線（先頭ドット中心=12.5% 〜 末尾ドット中心=87.5%） */
.checkout-steps__list::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 12.5%;
  right: 12.5%;
  height: 1px;
  background: #d5d5d5;
}
.checkout-steps__item {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.checkout-steps__dot {
  position: relative;
  z-index: 1;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #c9c9c9;
}
.checkout-steps__label {
  margin-top: 15px;
  font-family: var(--font-base);
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.02em;
  color: #9a9a9a;
  white-space: nowrap;
}
/* 現在地（濃く） */
.checkout-steps__item.is-current .checkout-steps__dot {
  background: #646464;
}
.checkout-steps__item.is-current .checkout-steps__label {
  color: #646464;
  font-weight: 600;
}

/* ---------- 購入ステップ : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .checkout-steps {
    max-width: none;
    padding-top: 4px;
  }
  .checkout-steps__label {
    margin-top: 12px;
    font-size: 10px;
    letter-spacing: 0;
  }
  .checkout-steps__dot {
    width: 9px;
    height: 9px;
  }
  .checkout-steps__list::before {
    top: 4.5px;
  }
}

/* ==========================================================================
   ★★★ カート本体（fs-body-cart）★★★
   - 2カラム（商品リスト｜ご注文内容）。システムパーツをCSSで整形（購入機能は不変）
   - カートテーブルは thead 非表示＋各 tr を display:contents で grid 化しカード風に
   - 数量は native <select> を装飾（システムの数量更新JSを壊さないため）
   - デザインに無い送料無料告知/Amazon/Apple/お気に入りは残してテイスト整形
   - お気に入りはカルーセルのスライダーを止めて静的グリッド表示
   ========================================================================== */
.fs-body-cart .site-main > section,
.fs-body-checkout .site-main > section,
.fs-body-customerDetails .site-main > section {
  max-width: 1000px;
  margin: 0 auto;
  padding: 48px 20px 100px;
}

.fs-body-cart .fs-c-wishlistProduct {
  display: none !important;
}

/* 見出し「カート」：左寄せ＋下線 */
.fs-body-cart .page-title {
  margin: 40px 0 0;
  padding-bottom: 16px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #646464;
  text-align: left;
}
/* 2カラム */
.fs-body-cart .fs-l-cart__contentsArea {
  display: flex;
  gap: 56px;
  align-items: flex-start;
}
.fs-body-cart .fs-l-cart__mainColumn {
  flex: 1 1 auto;
  min-width: 0;
  border-top: 1px solid #c8c8c8;
}
.fs-body-cart .fs-l-cart__sideColumn {
  flex: 0 0 300px;
  padding: 0;
  border: none;
}

/* --- カートテーブル → カード行 --- */
.fs-body-cart .fs-c-cartTableContainer {
  border: 0;
  padding: 0;
}
.fs-body-cart .fs-c-cartTable,
.fs-body-cart .fs-c-cartTable tbody {
  display: block;
  width: 100%;
  border: 0;
}
.fs-body-cart .fs-c-cartTable thead {
  display: none;
}
.fs-body-cart .fs-c-cartTable__row {
  display: grid;
  grid-template-columns: 160px 1fr auto;
  grid-template-rows: 1fr auto auto;
  grid-template-areas:
    "image info     subtotal"
    "image quantity subtotal"
    "image action   subtotal";
  column-gap: 28px;
  padding: 32px 0;
  border-bottom: 1px solid #e5e5e5;
}
/* システムのセル罫線・アクションボタン枠を解除 */
.fs-body-cart .fs-c-cartTable__dataCell {
  border: 0 !important;
}
.fs-body-cart .fs-c-cartTable__actionButton,
.fs-body-cart .fs-c-cartTable__actionButton__container {
  margin: 0;
  padding: 0;
  border: 0 !important;
  width: auto;
}
/* システムがバリエーションに付ける「（ ）」を解除 */
.fs-body-cart .fs-c-listedProductName__variation::before,
.fs-body-cart .fs-c-listedProductName__variation::after {
  content: none !important;
}
/* product セル/内包 div を display:contents で子（画像・情報）を grid へ昇格 */
.fs-body-cart .fs-c-cartTable__dataCell--product,
.fs-body-cart .fs-c-cartTable__product {
  display: contents;
}
.fs-body-cart .fs-c-cartTable__productImage {
  grid-area: image;
  align-self: start;
  width: 160px;
  margin: 0;
  background: #f2f1ed;
  padding: 0;
}
.fs-body-cart .fs-c-cartTable__productImage__image {
  display: block;
  width: 100%;
  height: auto;
  padding: 0;
}
.fs-body-cart .fs-c-cartTable__productInfo {
  grid-area: info;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.fs-body-cart .fs-c-cartTable__dataCell--quantity {
  grid-area: quantity;
  margin-top: 16px;
  padding: 0;
}
.fs-body-cart .fs-c-cartTable__dataCell--action {
  grid-area: action;
  margin-top: 12px;
  padding: 0;
}
.fs-body-cart .fs-c-cartTable__dataCell--subtotal {
  grid-area: subtotal;
  align-self: end;
  padding: 0;
  text-align: right;
  white-space: nowrap;
}
.fs-body-cart .fs-c-cartTable__dataCell--point {
  display: none;
}

.fs-body-cart .fs-c-estimatedDeliveryDate {
  display: none !important;
}

/* 商品名（serif） */
.fs-body-cart .fs-c-listedProductName__name {
  display: block;
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.3;
  color: #646464;
  text-decoration: none;
}
/* バリエーション：1つ目=サイズ / 2つ目=カラー → 「カラー→サイズ」の順・ラベル付与
   ※このストアは horizontalVariation=サイズ / verticalVariation=カラー の2軸前提 */
.fs-body-cart .fs-c-listedProductName__variation {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 14px;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
.fs-body-cart .fs-c-listedProductName__variation__choice {
  display: block;
}
.fs-body-cart .fs-c-listedProductName__variation__choice:nth-child(1) {
  order: 2;
}
.fs-body-cart .fs-c-listedProductName__variation__choice:nth-child(1)::before {
  content: "サイズ：";
}
.fs-body-cart .fs-c-listedProductName__variation__choice:nth-child(2) {
  order: 1;
}
.fs-body-cart .fs-c-listedProductName__variation__choice:nth-child(2)::before {
  content: "カラー：";
}

/* 単価（serif）：情報カラムの下部（数量のすぐ上）へ */
.fs-body-cart .fs-c-cartTable__unitPrice {
  margin-top: auto;
  padding-top: 6px;
}
.fs-body-cart .fs-c-cartTable__unitPrice .fs-c-productPrice {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.fs-body-cart .fs-c-cartTable__unitPrice .fs-c-price__currencyMark,
.fs-body-cart .fs-c-cartTable__unitPrice .fs-c-price__value {
  font-family: var(--font-serif);
  font-size: 20px;
  color: #646464;
}
.fs-body-cart .fs-c-cartTable__unitPrice .fs-c-productPrice__addon__label {
  font-size: 11px;
  color: #969696;
}

.fs-body-cart .fs-c-cartTableContainer .fs-c-productPrice__addon {
  display: none;
}

/* 数量 select（− 1 + は使わずネイティブselectを装飾） */
.fs-body-cart .fs-c-quantity__select {
  width: 116px;
  height: 40px;
  padding: 0 30px 0 14px;
  border: 1px solid #646464;
  border-radius: 4px;
  background-color: #fff;
  background-image: url("../img/icon-un-arrow.svg");
  background-repeat: no-repeat;
  background-position: right 14px center;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
  -webkit-appearance: none;
  appearance: none;
}
.fs-body-cart .fs-c-quantity__select:focus {
  border-color: #8c8c8c;
  outline: none;
}

/* 削除 / あとで買う（グレー下線リンク） */
.fs-body-cart .fs-c-cartTable__actionButton {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 20px;
}
.fs-body-cart .fs-c-button--cancel--cart,
.fs-body-cart .fs-c-button--buyItLater {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.fs-body-cart .fs-c-button--cancel--cart .fs-c-button__label,
.fs-body-cart .fs-c-button--buyItLater .fs-c-button__label {
  color: #646464;
}

/* 小計（右） */
.fs-body-cart .fs-c-cartTable__dataCell--subtotal::before {
  content: "小計";
  margin-right: 8px;
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-cartTable__price,
.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-price__price {
  display: inline;
}
.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-price__price {
  font-family: var(--font-serif);
  font-size: 18px;
  color: #646464;
}
.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-price__price::after {
  content: " tax in";
  font-family: var(--font-serif);
  font-size: 22px;
  color: #646464;
}

.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-price__currencyMark,
.fs-body-cart .fs-c-cartTable__dataCell--subtotal .fs-c-price__value {
  font-size: 22px;
}

/* --- ご注文内容（サイド） --- */
.fs-body-cart #fs-cartTotals-container {
  padding: 22px 24px;
  border: none;
  background: #f5f5f5;
}
.fs-body-cart #fs-cartTotals-container::before {
  content: "ご注文内容";
  display: block;
  margin-bottom: 14px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}
/* 明細行→[区切り線]→合計 の並びに（デザイン準拠）。
   システムの行順は 数量/商品合計(main)/獲得ポイント なので flex+order で
   商品合計（税込）を最下部の「合計」として強調配置する */
.fs-body-cart .fs-c-orderTotalTable {
  display: block;
  width: 100%;
}
/* システムが最終行に付ける padding:4px を解除 */
.fs-body-cart .fs-c-orderTotalTable > thead > tr:last-of-type,
.fs-body-cart .fs-c-orderTotalTable > tfoot > tr:last-of-type,
.fs-body-cart .fs-c-orderTotalTable > tbody > tr:last-of-type {
  padding: 0;
}
.fs-body-cart .fs-c-orderTotalTable tbody {
  display: flex;
  flex-direction: column;
}
.fs-body-cart .fs-c-orderTotalTable tr {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  border-bottom: 0 !important; /* システムの tr:last-of-type 罫線を解除 */
}
.fs-body-cart .fs-c-orderTotalTable th,
.fs-body-cart .fs-c-orderTotalTable td {
  padding: 5px 0;
  border: 0;
  font-family: var(--font-base);
  font-size: 13px;
  font-weight: 400;
  color: #646464;
  text-align: left;
}
.fs-body-cart .fs-c-orderTotalTable td {
  text-align: right;
  color: #646464;
}
.fs-body-cart .fs-c-orderTotalTable__count {
  order: 1;
}
.fs-body-cart .fs-c-orderTotalTable__getPoint {
  order: 2;
}
.fs-body-cart .fs-c-orderTotalTable__mainRow {
  order: 3;
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid #e0e0e0 !important;
  align-items: center;
}
.fs-body-cart .fs-c-orderTotalTable__mainRow th {
  font-weight: 700;
  color: #646464;
}
.fs-body-cart .fs-c-orderTotalTable__mainRow .fs-c-price__currencyMark {
  font-size: 16px;
}

.fs-body-cart .fs-c-orderTotalTable__mainRow .fs-c-price__value {
  font-family: var(--font-serif);
  font-size: 18px;
  color: #646464;
}

/* 購入ボタンエリア */
.fs-body-cart .fs-c-purchaseHere {
  margin-top: 20px;
}
.fs-body-cart .fs-c-purchaseHere__message {
  margin-bottom: 12px;
  font-size: 12px;
  color: #969696;
  text-align: center;
}
.fs-body-cart .fs-c-purchaseHere__message p {
  margin: 0;
}
/* 主導線＝緑（このサイトでお支払い／ログインして次へ） */
.fs-body-cart .fs-c-button--purchaseHere,
.fs-body-cart .fs-c-button--loginAndPurchase {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #08b783;
  color: #fff;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}
.fs-body-cart .fs-c-button--purchaseHere .fs-c-button__label,
.fs-body-cart .fs-c-button--loginAndPurchase .fs-c-button__label {
  color: #fff;
}
/* 副導線＝アウトライン（ゲストで手続き／新規登録して購入） */
.fs-body-cart .fs-c-button--unregisteredUserPurchase,
.fs-body-cart .fs-c-button--registerAndPurchase {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  margin: 0;
  border: 1px solid #646464;
  border-radius: 0;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}
.fs-body-cart .fs-c-button--unregisteredUserPurchase .fs-c-button__label,
.fs-body-cart .fs-c-button--registerAndPurchase .fs-c-button__label {
  color: #646464;
}
/* ボタンが縦に並ぶ場合の間隔 */
@media (hover: hover) {
  .fs-body-cart .fs-c-button--purchaseHere:hover,
  .fs-body-cart .fs-c-button--loginAndPurchase:hover {
    opacity: 0.85;
  }
  .fs-body-cart .fs-c-button--unregisteredUserPurchase:hover,
  .fs-body-cart .fs-c-button--registerAndPurchase:hover {
    background: #f5f5f5;
  }
}
/* Amazon / Apple Pay（残す・控えめに） */
.fs-body-cart #fs-checkout-amazon-container:empty {
  display: none;
}
.fs-body-cart .fs-c-cartPayment {
  margin-top: 12px;
}
.fs-body-cart .fs-c-applePay__button {
  margin: 0;
}

/* --- 送料無料告知（フリーパーツ） --- */
.fs-body-cart .fs-p-announcement {
  margin-top: 64px;
  padding: 28px 24px;
  background: #f7f6f3;
  text-align: center;
}
.fs-body-cart .fs-p-announcement__title {
  margin-bottom: 10px;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  color: #646464;
}
.fs-body-cart .fs-p-announcement__body p {
  margin: 0 0 14px;
  font-size: 13px;
  color: #646464;
}
.fs-body-cart .fs-p-flexibleColumn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.fs-body-cart .fs-p-linkButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 18px;
  border: 1px solid #cbcbcb;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  text-decoration: none;
}

/* --- 買い物を続ける --- */
.fs-body-cart .fs-c-continueShopping {
  margin-top: 40px;
  text-align: center;
}
.fs-body-cart .fs-c-button--continueShopping {
  padding: 0;
  border: none;
  border-radius: 0;
  color: #646464;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  box-shadow: none;
  background: none;
}
.fs-body-cart .fs-c-button--continueShopping .fs-c-button__label {
  color: #646464;
}

/* --- お気に入り（カルーセル→静的グリッド） --- */
.fs-body-cart .fs-c-wishlistProduct {
  margin-top: 72px;
}
.fs-body-cart .fs-c-wishlistProduct__title {
  margin-bottom: 28px;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 600;
  color: #646464;
  text-align: center;
}
/* 矢印非表示・slickスライダーを無効化して静的グリッドに
   本番は slick が初期化され .slick-list/.slick-track/.slick-slide に inline style
   （width/transform/float/overflow/height）が付くので全て打ち消す */
.fs-body-cart .fs-c-productListCarousel__ctrl {
  display: none !important;
}
.fs-body-cart .fs-c-productListCarousel__list__itemTrack {
  display: block !important;
}
.fs-body-cart .fs-c-productListCarousel .slick-list {
  display: block !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  overflow: visible !important;
}
/* 商品を並べるコンテナ：slick時は .slick-track、未初期化時は itemTrack 直下 */
.fs-body-cart .fs-c-productListCarousel .slick-track,
.fs-body-cart .fs-c-productListCarousel__list__itemTrack:not(.slick-slider) {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 24px;
  width: auto !important;
  transform: none !important;
  opacity: 1 !important;
}
/* システムの clearfix 疑似要素がgrid化で幽霊アイテムになり並びが崩れるので消す */
.fs-body-cart .fs-c-productListCarousel .slick-track::before,
.fs-body-cart .fs-c-productListCarousel .slick-track::after {
  display: none !important;
}
.fs-body-cart .fs-c-productListCarousel .slick-slide {
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}
.fs-body-cart .fs-c-productListCarousel .slick-slide > div {
  height: 100%;
}
/* article の inline display:inline-block / width:100% を打ち消す */
.fs-body-cart .fs-c-productListItem.fs-c-productListCarousel__list__item {
  display: flex !important;
  width: auto !important;
}
/* カード */
.fs-body-cart .fs-c-productListItem {
  display: flex;
  flex-direction: column;
  width: auto;
}
.fs-body-cart .fs-c-productListItem__imageContainer {
  margin-bottom: 14px;
}
.fs-body-cart .fs-c-productListItem__image__image {
  display: block;
  width: 100%;
  height: auto;
  background: #f2f1ed;
}
.fs-body-cart .fs-c-productListItem__productName {
  margin: 0 0 8px;
}
.fs-body-cart .fs-c-productListItem__productName a {
  text-decoration: none;
}
.fs-body-cart .fs-c-productName__name {
  display: block;
  font-family: var(--font-serif);
  font-size: 15px;
  line-height: 1.4;
  color: #646464;
}
.fs-body-cart .fs-c-productName__variation {
  display: block;
  margin-top: 4px;
  font-family: var(--font-base);
  font-size: 12px;
  color: #646464;
}
.fs-body-cart .fs-c-productListItem__prices {
  margin-bottom: 12px;
}
.fs-body-cart .fs-c-productListItem__prices .fs-c-price__currencyMark,
.fs-body-cart .fs-c-productListItem__prices .fs-c-price__value {
  font-family: var(--font-serif);
  font-size: 14px;
  color: #646464;
}
.fs-body-cart .fs-c-productListItem__prices .fs-c-productPrice__addon__label {
  margin-left: 4px;
  font-size: 11px;
  color: #969696;
}
.fs-body-cart .fs-c-productListItem__control {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.fs-body-cart .fs-c-productListItem__control form {
  flex: 1 1 auto;
}
.fs-body-cart .fs-c-button--addToCart--list {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 42px;
  margin: 0;
  border: 1px solid #646464;
  border-radius: 0;
  background: #fff;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  cursor: pointer;
}
.fs-body-cart .fs-c-button--addToCart--list .fs-c-button__label {
  color: #646464;
}
.fs-body-cart .fs-c-button--removeFromWishList--icon {
  flex: 0 0 auto;
  width: 42px;
  min-width: 0;
  height: 42px;
  padding: 0;
  border: 1px solid #e0e0e0;
  border-radius: 0;
  background: #fff no-repeat center / 20px url("../img/icon-addToWishList-add.svg");
  cursor: pointer;
}
.fs-body-cart .fs-c-button--removeFromWishList--icon .fs-c-button__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.fs-body-cart .fs-c-wishlistProduct__footer {
  margin-top: 32px;
  text-align: center;
}
.fs-body-cart .fs-c-viewAllProductsLink {
  color: #646464;
  font-family: var(--font-base);
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- カート : タブレット ( ~1024px ) ---------- */
@media (max-width: 1024px) {
  .fs-body-cart .fs-l-cart__contentsArea {
    gap: 32px;
  }
  .fs-body-cart .fs-l-cart__sideColumn {
    flex-basis: 280px;
  }
  .fs-body-cart .fs-c-productListCarousel__list__itemTrack,
  .fs-body-cart .fs-c-productListCarousel .slick-track {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---------- カート : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .fs-body-cart .page-title {
    text-align: center;
  }
  /* 1カラム積み */
  .fs-body-cart .fs-l-cart__contentsArea {
    flex-direction: column;
    gap: 40px;
  }
  .fs-body-cart .fs-l-cart__sideColumn {
    flex-basis: auto;
    width: 100%;
  }
  /* カード：画像左＋情報右／小計は下・右寄せ */
  .fs-body-cart .fs-c-cartTable__row {
    grid-template-columns: 110px 1fr;
    grid-template-rows: auto;
    grid-template-areas:
      "image info"
      "image quantity"
      "image action"
      "subtotal subtotal";
    column-gap: 16px;
    padding: 24px 0;
  }
  .fs-body-cart .fs-c-cartTable__productImage {
    width: 110px;
  }
  .fs-body-cart .fs-c-listedProductName__name {
    font-size: 18px;
  }
  /* 数量：システムSPの「数量」ラベル＋右寄せを解除して左寄せに */
  .fs-body-cart .fs-c-cartTable__dataCell--quantity {
    display: block;
  }
  .fs-body-cart .fs-c-cartTable__dataCell--quantity::before {
    content: none !important;
  }
  .fs-body-cart .fs-c-cartTable__dataCell--subtotal {
    align-self: auto;
    margin-top: 14px;
    text-align: right;
  }
  /* お気に入り 2カラム */
  .fs-body-cart .fs-c-productListCarousel__list__itemTrack,
  .fs-body-cart .fs-c-productListCarousel .slick-track {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px 16px;
  }

  .fs-body-cart .fs-c-continueShopping {
    margin-top: 0;
  }

  .fs-body-cart .site-main > section,
  .fs-body-checkout .site-main > section,
  .fs-body-customerDetails .site-main > section {
    padding: 46px 20px 56px;
  }
}

/* =====================================================================
   Coming Soon / 店舗クローズ（システムページ fs-body-closed / #fs_StoreClosed）
   - デザイン指定なし。1枚絵の画像を画面中央に配置しサイト調に。
   - マークアップは fs-l-page > fs-l-main > fs-l-pageMain > .close（システム構成）
   - PC＝Umnet_Coming_soon_PC.jpg／SP(767以下)＝同SP.jpg（<picture>で切替）
   - システムが body/main/pageMain を全幅・height:100vh・padding:0、
     pageMain を flex column／align-items:center（横中央）まで設定済。
     → ここでは pageMain を justify-content:center（縦中央）にし、
        背景（生成り）と画像 contain を追加するだけ。
   - contain：width/height:auto＋max-width/height でビューポート内に必ず収め、
     かつ画像のネイティブ解像度より大きくは拡大しない（max系は上限のため）。
   - 余白（レターボックス）はサイトの生成りトーン #f2f1ed
   ===================================================================== */
.fs-body-closed {
  background: #f2f1ed;
}
.fs-body-closed .fs-l-pageMain {
  justify-content: center; /* 縦中央（横中央はシステムの align-items:center） */
  height: 100vh;
  height: 100dvh;
}
.fs-body-closed .close {
  width: 100%;
  margin: 0;
  display: flex;
  justify-content: center;
  line-height: 0; /* img 下の余白除去 */
}
.fs-body-closed .close__visual {
  margin: 0;
  line-height: 0;
}
.fs-body-closed .close__image {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100vh;
  max-height: 100dvh;
}

/* ==========================================================================
   ★★★ ご注文内容確認／チェックアウト（システムページ / fs-body-checkout・#fs_CheckoutV2）★★★
   - 決済手前の確認ページ。システムが多数のプレビューパーツ＋再描画テンプレート
     （<script type="text/x-handlebars">＝非表示）を出力。表示DOMのみ装飾する。
   - レイアウトは fs_theme の [class^=fs-body-checkout] .fs-l-checkout（960↑で
     flex 2カラム：main 1fr｜side 320px）を利用。ここでは中央寄せ・余白・見た目。
   - デザイン: 左＝各確認セクション（見出し左寄せ太字／お届け先・お届け日時は
     グレーカード／変更は白アウトライン小ボタン／入力は角丸ライト枠／ラジオは
     シンプル円）、右＝注文サマリー（グレーカード＋合計強調＋緑ボタン）。SPは縦積み。
   ========================================================================== */
/* ---- 外枠：中央寄せ ---- */
.fs-body-checkout .page-title {
  box-sizing: border-box;
  max-width: 1040px;
  margin: 32px auto 0;
  padding: 0;
  text-align: left;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #646464;
}
.fs-body-checkout .fs-l-checkout {
  box-sizing: border-box;
  max-width: 1040px;
  margin: 28px auto 0;
  padding: 0 0px 80px;
}

.fs-body-checkout .fs-l-checkout__mainColumn {
  border-top: 1px solid #c8c8c8;
  padding-top: 30px;
}

@media screen and (min-width: 960px) {
  .fs-body-checkout .fs-l-checkout {
    gap: 48px;
  }
  /* システムの padding-right/max-width を解除して gap で制御 */
  .fs-body-checkout .fs-l-checkout__mainColumn {
    padding-right: 0 !important;
    max-width: none !important;
    min-width: 0;
  }
  .fs-body-checkout .fs-l-checkout__sideColumn {
    flex-basis: 320px;
    flex-grow: 0;
    position: sticky;
    top: 90px;
  }
}
/* セクション間隔 */
.fs-body-checkout .fs-l-checkout__mainColumn > * + * {
  margin-top: 44px !important;
}
/* システム既定の白枠カード（border/padding）を解除。サマリーは後段でグレーカード化 */
.fs-body-checkout .fs-c-checkout-preview {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: none;
}

/* ---- セクション見出し（お客様の情報／お支払い方法／…）：左寄せ太字 ---- */
.fs-body-checkout .fs-c-checkout-preview__title {
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: left !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-preview__body > * + * {
  margin-top: 16px;
}
/* 小見出し h3（お届け先／お届け詳細）：グレーバッジ→プレーン太字 */
.fs-body-checkout .fs-c-checkout-heading {
  background: none !important;
  color: #646464 !important;
  padding: 0 !important;
  text-align: left !important;
  font-size: 14px;
  font-weight: 600;
}
/* さらに小さいラベル h4（配送サービス／配送方法／配送内容）：小ラベル */
.fs-body-checkout .fs-c-checkout-heading-lv2 {
  border-left: 0 !important;
  padding-left: 0 !important;
  font-size: 12px;
  font-weight: 600;
  color: #8c8c8c;
}

/* ---- 変更/選ぶ/利用する 等の小ボタン（standard）：白アウトライン ---- */
.fs-body-checkout .fs-c-button--standard {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 18px !important;
  border: 1px solid #646464 !important;
  border-radius: 3px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #646464 !important;
  font-family: var(--font-base);
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.04em;
  cursor: pointer;
}
.fs-body-checkout .fs-c-button--standard .fs-c-button__label {
  color: #646464;
}
@media (hover: hover) {
  .fs-body-checkout .fs-c-button--standard:hover {
    background: #f5f5f5 !important;
  }
}

/* ---- お客様の情報：氏名/メール/住所/電話 の定義リスト風 ---- */
.fs-body-checkout .fs-c-checkout-customerInfo {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* PC：情報（左）と「変更」ボタン（右）で2カラム。
   customerInfo 内部は通常の縦積みのまま、__body 側をグリッド化する */
@media (min-width: 768px) {
  .fs-body-checkout .fs-c-checkout-buyerInfo__body {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    column-gap: 32px;
  }
  .fs-body-checkout .fs-c-checkout-buyerInfo__body > * + * {
    margin-top: 0 !important; /* preview__body の縦マージンを解除しグリッドで制御 */
  }
  .fs-body-checkout .fs-c-checkout-buyerInfo .fs-c-checkout-customerInfo {
    grid-column: 1;
    grid-row: 1;
  }
  .fs-body-checkout .fs-c-checkout-buyerInfo .fs-c-checkout-preview__button {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    justify-content: flex-end;
  }
}
.fs-body-checkout .fs-c-checkout-customerInfo > li {
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-customerInfo__name {
  font-size: 15px;
  font-weight: 600;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-customerInfo__name rt {
  font-size: 10px;
  font-weight: 400;
  color: #8c8c8c;
}
.fs-body-checkout .fs-c-checkout-customerInfo__address .fs-u-zipCode::before {
  content: "〒";
  margin-right: 2px;
}
/* 変更ボタン行：情報の下・右寄せ */
.fs-body-checkout .fs-c-checkout-preview__button {
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
}
.fs-body-checkout .fs-c-checkout-buyerInfo .fs-c-checkout-preview__button {
  justify-content: flex-start;
}

/* ---- お届け内容（配送サービス／お届け先／お届け詳細） ---- */
.fs-body-checkout .fs-c-checkout-shippingInfo__body > * + * {
  margin-top: 20px;
}
/* 配送サービス preview：ラベル＋値＋変更を横並び */
.fs-body-checkout .fs-c-checkout-shippingOption {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.fs-body-checkout .fs-c-checkout-shippingOptionPreview {
  margin: 0;
  background: none; /* システム既定の薄グレー背景を解除 */
  padding: 0;
}
.fs-body-checkout .fs-c-checkout-shippingOptionPreview__value {
  margin: 4px 0 0;
  font-size: 14px;
  color: #646464;
}
/* お届け先：グレーカード */
.fs-body-checkout .fs-c-checkout-shippingDestination {
  background: #f5f5f5;
  padding: 22px 24px;
}
.fs-body-checkout .fs-c-checkout-shippingDestination__title {
  margin-bottom: 10px;
}
.fs-body-checkout .fs-c-checkout-shippingAddress {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fs-body-checkout .fs-c-checkout-shippingAddress > li {
  font-size: 14px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingAddress__name {
  font-size: 15px;
  font-weight: 600;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingAddress__name rt {
  font-size: 10px;
  font-weight: 400;
  color: #8c8c8c;
}
.fs-body-checkout .fs-c-homeLabel {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 8px;
  border: 1px solid #cbcbcb;
  border-radius: 2px;
  font-size: 11px;
  font-weight: 400;
  color: #8c8c8c;
  vertical-align: middle;
}
.fs-body-checkout .fs-c-checkout-shippingAddress__address .fs-u-zipCode::before {
  content: "〒";
  margin-right: 2px;
}
.fs-body-checkout .fs-c-checkout-shippingDestination__control {
  margin-top: 14px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.fs-body-checkout .fs-c-checkout-shippingDestination__control .fs-c-buttonContainer {
  margin: 0;
}
/* 「お届け先リストから選ぶ」は chooseDestination（standard）—同じ小ボタン */
.fs-body-checkout .fs-c-button--chooseDestination {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 18px;
  border: 1px solid #646464;
  border-radius: 3px;
  background: #fff;
  box-shadow: none;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
}

/* お届け詳細：商品行 */
.fs-body-checkout .fs-c-checkout-shippingDetail__title {
  margin-bottom: 12px;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productList {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__product {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 16px;
  align-items: start;
  padding: 20px;
  border-top: none;
  margin: 0;
}
/* 商品画像が無い行は 96px 列を作らず情報を全幅に（レイアウト崩れ防止） */
.fs-body-checkout .fs-c-checkout-shippingParcel__product:not(:has(.fs-c-checkout-shippingParcel__productImage)) {
  grid-template-columns: 1fr;
}
/* 2商品以上ある場合、2つ目以降の上部に区切り罫線（1つ目には付かない） */
.fs-body-checkout .fs-c-checkout-shippingParcel__product + .fs-c-checkout-shippingParcel__product {
  border-top: 1px solid #e5e5e5;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productImage {
  margin: 0;
  background: #f2f1ed;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productImage__image {
  display: block;
  width: 100%;
  height: auto;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productName__name {
  font-family: var(--font-serif);
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productVariation {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.8;
  color: #646464;
}
/* バリエーション（サイズ/カラー等）は1項目ずつ縦落とし。
   システムの「（ ）」括弧と choice 間の「/」区切りは解除 */
.fs-body-checkout .fs-c-checkout-shippingParcel__productVariation::before,
.fs-body-checkout .fs-c-checkout-shippingParcel__productVariation::after,
.fs-body-checkout .fs-c-checkout-shippingParcel__productVariation__choice + .fs-c-checkout-shippingParcel__productVariation__choice::before {
  content: none !important;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__productVariation__choice {
  display: block;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__unitPrice {
  margin-top: 8px;
  font-family: var(--font-serif);
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__unitPrice .fs-c-productPrice__addon {
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
  margin-left: 4px;
}
.fs-body-checkout .fs-c-checkout-shippingParcel__quantity {
  font-size: 14px;
  color: #646464;
  grid-column: 1 / span 2;
}
.fs-body-checkout .fs-c-quantityDisplay__label {
  margin-right: 6px;
  color: #646464;
}
/* 配送方法／お届け日時：ラベル＋値、変更を右に。お届け日時ブロックはグレーカード風 */
.fs-body-checkout .fs-c-checkout-shippingDetail__detail {
  margin-top: 16px;
}
.fs-body-checkout .fs-c-checkout-shippingDetail__shippingCarrier__value {
  margin-top: 4px;
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingCarrierComment {
  margin-top: 4px;
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingDetail__deliveryDetail {
  margin-top: 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  background: #f5f5f5;
  padding: 18px 20px;
}
.fs-body-checkout .fs-c-checkout-shippingDetail__deliveryDetailPreview {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 16px;
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingDetail__deliveryDetailPreview dt {
  font-weight: 600;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-shippingDetail__deliveryDetailPreview dd {
  margin: 0;
}
/* 送料テーブル：システム既定の#b2b2b2全周罫線・ヘッダ薄背景を解除し、
   サイト調の上罫線1本のみ（ラベル左／金額右） */
.fs-body-checkout .fs-c-destinationFeeTable {
  width: 100% !important;
  margin-top: 14px;
  border-collapse: collapse;
  border: 0 !important;
}
.fs-body-checkout .fs-c-destinationFeeTable th,
.fs-body-checkout .fs-c-destinationFeeTable td {
  border: 0 !important;
  border-top: 1px solid #e5e5e5 !important;
  padding: 10px 0;
  font-size: 13px;
  color: #646464;
  background: none !important;
}
.fs-body-checkout .fs-c-destinationFeeTable th {
  text-align: left;
  font-weight: 400;
}
.fs-body-checkout .fs-c-destinationFeeTable td {
  text-align: right;
}

/* ---- お支払い方法：ラジオリスト ---- */
.fs-body-checkout .fs-c-checkout-paymentInfo__message,
.fs-body-checkout .fs-c-checkout-couponInfo__message {
  margin-bottom: 14px;
  font-size: 13px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-paymentMethodList {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* 支払い方法：システム既定の2px#f7f7f7全周枠・__titleグレー帯・is-active黒帯を
   すべて解除し、行間の細い区切り線のみのシンプルなリストに */
.fs-body-checkout .fs-c-checkout-paymentMethod {
  border: 0 !important;
  border-top: 1px solid #e5e5e5 !important;
  padding: 16px 0;
}
.fs-body-checkout .fs-c-checkout-paymentMethod:last-child {
  border-bottom: 1px solid #e5e5e5 !important;
}
.fs-body-checkout .fs-c-checkout-paymentMethod__title {
  background: none !important;
  color: #646464 !important;
}
/* 選択中：黒枠/黒帯にせず、緑ラジオで判別（帯・枠は付けない） */
.fs-body-checkout .fs-c-checkout-paymentMethod.is-active {
  border-color: #e5e5e5 !important;
}
.fs-body-checkout .fs-c-checkout-paymentMethod.is-active .fs-c-checkout-paymentMethod__title {
  background: none !important;
  color: #646464 !important;
}
.fs-body-checkout .fs-c-checkout-paymentMethod__body {
  margin-top: 8px;
  padding-left: 26px;
}
.fs-body-checkout .fs-c-checkout-paymentMethod__message p {
  margin: 0;
  font-size: 12px;
  line-height: 1.7;
  color: #8c8c8c;
}
.fs-body-checkout .fs-c-commissionList {
  display: flex;
  gap: 10px;
  margin: 8px 0 0;
  font-size: 12px;
  color: #646464;
}
.fs-body-checkout .fs-c-commissionList dt {
  font-weight: 600;
}
.fs-body-checkout .fs-c-commissionList dd {
  margin: 0;
}

/* ---- ラジオ（支払い方法など checkout 内）：サイト調のシンプル円 ---- */
.fs-body-checkout .fs-c-radio__label {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.fs-body-checkout .fs-c-radio__radioLabelText {
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-radio__radioMark {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0 10px 0 0;
  border: 1px solid #b5b5b5;
  background: #fff;
}
.fs-body-checkout .fs-c-radio__radio:checked:enabled + label > .fs-c-radio__radioMark {
  border-color: #08b783;
}
.fs-body-checkout .fs-c-radio__radio:checked:enabled + label > .fs-c-radio__radioMark::before {
  width: 8px;
  height: 8px;
  background: #08b783;
}

/* ---- 入力欄（クレカ等 checkout 内）：角丸ライト枠 ---- */
.fs-body-checkout .fs-c-inputField__field input[type="text"],
.fs-body-checkout .fs-c-inputField__field input[type="tel"],
.fs-body-checkout .fs-c-inputField__field input[type="password"],
.fs-body-checkout .fs-c-checkout-couponCodeInput__input input {
  box-sizing: border-box;
  width: 100%;
  height: 42px;
  padding: 0 14px;
  border: 1px solid #cbcbcb;
  border-radius: 6px;
  background: #fff;
  font-family: var(--font-base);
  font-size: 16px;
  color: #646464;
  -webkit-appearance: none;
  appearance: none;
}
.fs-body-checkout .fs-c-inputField__field input:focus,
.fs-body-checkout .fs-c-checkout-couponCodeInput__input input:focus {
  outline: none;
  border-color: #8c8c8c;
}

/* ---- クーポン ---- */
.fs-body-checkout .fs-c-checkout-couponCodeInput {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px 12px;
}
.fs-body-checkout .fs-c-checkout-couponCodeInput__title {
  grid-column: 1 / -1;
  font-size: 13px;
  font-weight: 600;
  color: #646464;
}
.fs-body-checkout .fs-c-button--useCoupon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 20px;
  border: 1px solid #646464;
  border-radius: 3px;
  background: #fff;
  box-shadow: none;
  color: #646464;
  font-family: var(--font-base);
  font-size: 13px;
  cursor: pointer;
}

/* ---- ご注文内容（cartTable：確認用の簡易表示） ---- */
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable {
  width: 100%;
  border-collapse: collapse;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable thead {
  display: none;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__row {
  display: grid;
  grid-template-columns: 96px 1fr auto;
  gap: 4px 16px;
  align-items: start;
  padding: 16px 0;
  border-top: 1px solid #e5e5e5;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell {
  padding: 0;
  border: 0;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--product {
  grid-row: 1 / 3;
  grid-column: 1 / 3;
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 16px;
  align-items: start;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__product {
  display: contents;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__productImage {
  margin: 0;
  padding: 0;
  background: #f2f1ed;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__productImage__image {
  display: block;
  width: 100%;
  height: auto;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-listedProductName__name {
  font-family: var(--font-serif);
  font-size: 14px;
  color: #646464;
  text-decoration: none;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-listedProductName__variation {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-listedProductName__variation__choice + .fs-c-listedProductName__variation__choice::before {
  content: " / ";
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__unitPrice {
  margin-top: 8px;
  font-family: var(--font-serif);
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__unitPrice .fs-c-productPrice__addon__label {
  font-family: var(--font-base);
  font-size: 0px;
  color: #646464;
  margin-left: 4px;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--quantity {
  grid-row: 3;
  grid-column: 1 / 2;
  font-size: 14px;
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--quantity::before {
  content: "数量：";
  color: #646464;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--subtotal {
  grid-row: 3;
  grid-column: 3 / 4;
  align-self: end;
  font-family: var(--font-serif);
  font-size: 15px;
  color: #646464;
  text-align: right;
}
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--subtotal::before {
  content: "小計：";
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
}
/* ポイント列は非表示 */
.fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--point {
  display: none;
}

/* ---- 返品特約 ---- */
.fs-body-checkout .fs-c-returnedSpecialContract {
  margin-top: 32px;
  font-size: 14px;
}
.fs-body-checkout .fs-c-returnedSpecialContract a {
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ======================= 右：お支払い金額（サマリー） ======================= */
.fs-body-checkout .fs-c-totalAndActions {
  background: #f5f5f5;
  padding: 24px;
}
.fs-body-checkout .fs-c-totalAndActions .fs-c-checkout-preview__title {
  margin-bottom: 16px !important;
}
.fs-body-checkout .fs-c-orderTotalTable {
  width: 100%;
  border-collapse: collapse;
}
.fs-body-checkout .fs-c-orderTotalTable th,
.fs-body-checkout .fs-c-orderTotalTable td {
  padding: 7px 0;
  border: 0;
  font-size: 13px;
  color: #646464;
  vertical-align: baseline;
}
.fs-body-checkout .fs-c-orderTotalTable th {
  text-align: left;
  font-weight: 400;
}
.fs-body-checkout .fs-c-orderTotalTable td {
  text-align: right;
}
/* 総合計：上に区切り線＋強調 */
.fs-body-checkout .fs-c-orderTotalTable__grandTotal th,
.fs-body-checkout .fs-c-orderTotalTable__grandTotal td {
  padding-top: 16px;
  border-top: 1px solid #d5d5d5;
  color: #646464;
}
.fs-body-checkout .fs-c-orderTotalTable__grandTotal th {
  font-size: 14px;
  font-weight: 600;
}
.fs-body-checkout .fs-c-orderTotalTable__grandTotal td .fs-c-price__value {
  font-size: 22px;
}
.fs-body-checkout .fs-c-orderTotalTable__grandTotal td .fs-c-price {
  font-family: var(--font-serif);
  color: #646464;
}
/* 獲得ポイントは控えめ */
.fs-body-checkout .fs-c-orderTotalTable__earnPoints th,
.fs-body-checkout .fs-c-orderTotalTable__earnPoints td {
  font-size: 12px;
  color: #8c8c8c;
}
/* 注文を確定する：緑プライマリ（fs-c-button--primary の赤を上書き） */
.fs-body-checkout .fs-c-confirmOrder {
  margin-top: 20px;
}
.fs-body-checkout .fs-c-button--confirmOrder,
.fs-body-checkout .fs-c-button--confirmSubscription {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0 !important;
  min-height: 54px;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-checkout .fs-c-button--confirmOrder .fs-c-button__label {
  color: #fff !important;
}
@media (hover: hover) {
  .fs-body-checkout .fs-c-button--confirmOrder:hover {
    opacity: 0.85;
  }
}

/* ======================= SP（〜767px） ======================= */
@media (max-width: 767px) {
  .fs-body-checkout .page-title {
    margin-top: 40px;
    font-size: 18px;
    text-align: center;
  }
  .fs-body-checkout .fs-l-checkout {
    margin-top: 24px;
    padding: 0 0px 56px;
  }
  /* 縦積み時、サマリーはメインの下に余白を空けて */
  .fs-body-checkout .fs-l-checkout__sideColumn {
    margin-top: 40px;
  }
  .fs-body-checkout .fs-c-checkout-shippingParcel__product,
  .fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__row {
    grid-template-columns: 80px 1fr;
  }
  .fs-body-checkout .fs-c-checkout-orderInfo .fs-c-cartTable__dataCell--product {
    grid-template-columns: 80px 1fr;
  }
}

/* ==========================================================================
   ★★★ ご注文完了／決済完了（システムページ / fs-body-checkout-success・#fs_CheckoutSuccess）★★★
   - デザイン無し・完了ページのトーンで統一。文字は中央寄せ。
   - 構成：プレビュー通知パネル＋checkout-steps(ご注文完了=is-current)＋
     共通`.page-title`＋`.fs-c-checkoutSuccess`(お礼＋ご注文コード)。
   - 外枠は共通`.page-body`(760中央)、`.page-title`はグローバル(中央)を利用。
   ========================================================================== */
.fs-body-checkout-success .page-title {
  margin-top: 40px;
}

.fs-body-checkout-success .fs-c-checkoutSuccess {
  margin: 140px auto 0;
  max-width: 640px;
  text-align: center;
}
/* お礼見出し（=subSection__title：既定はグレー#7c8790＋下線）→ #333・下線なし・中央 */
.fs-body-checkout-success .fs-c-checkoutSuccess__title {
  margin: 0 0 20px;
  border: 0;
  color: #333333;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}
.fs-body-checkout-success .fs-c-checkoutSuccess__message p {
  margin: 0;
  font-size: 14px;
  line-height: 2;
  color: #646464;
}
/* ご注文コード：serif で少し強調 */
.fs-body-checkout-success .fs-c-checkoutSuccess__code {
  display: inline-block;
  margin: 0 4px;
  font-family: var(--font-serif);
  font-weight: 600;
  color: #333333;
}

@media (max-width: 767px) {
  .fs-body-checkout-success .fs-c-checkoutSuccess {
    margin: 80px auto 0;
  }
}

/* ==========================================================================
   ★★★ チェックアウト内モーダルのあしらい（fs-body-checkout の各ダイアログ）★★★
   - お客様情報/お届け先/配送/ポイント等の編集モーダル共通。
   - フォームの位置関係(inModalテーブル)は変更せず、枠・入力・ラジオ・
     ドロップダウン・チェックボックス・ボタンのあしらいをテイストに合わせる。
   - 入力枠・必須「*」・ラジオ緑は既に .fs-body-checkout 配下ルールを継承。
   ========================================================================== */
/* 白箱：角丸＋淡い影 */
.fs-body-checkout .fs-c-modal__inner {
  border-radius: 6px;
  box-shadow: 0 12px 44px rgba(0, 0, 0, 0.22);
}
/* ヘッダ：グレー帯→白地＋下罫線、タイトル#333 */
.fs-body-checkout .fs-c-modal__header {
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
  border-radius: 6px 6px 0 0;
  padding: 16px 20px;
}
.fs-body-checkout .fs-c-modal__title,
.fs-body-checkout .fs-c-modal__productName {
  font-size: 15px;
  font-weight: 600;
  color: #333333;
}
.fs-body-checkout .fs-c-modal__close {
  padding: 6px;
  color: #646464;
}
@media (hover: hover) {
  .fs-body-checkout .fs-c-modal__close:hover {
    color: #333333;
  }
}
/* コンテンツ余白 */
.fs-body-checkout .fs-c-modal__contents {
  padding: 24px 20px 28px;
}
/* 必須マークをサイト調のピンクに */
.fs-body-checkout .fs-c-modal__inner .fs-c-requiredMark,
.fs-body-checkout .fs-c-modal__inner .fs-c-requiredMark::before {
  color: #db496b;
}

/* ドロップダウン（都道府県／生年月日）：角丸ライト枠＋システム矢印を再配置 */
.fs-body-checkout .fs-c-modal__inner .fs-c-dropdown {
  box-sizing: border-box;
  height: 42px;
  border: 0;
  background: transparent;
  overflow: visible;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-dropdown__menu {
  box-sizing: border-box;
  width: 100%;
  height: 42px;
  padding: 0 2.4em 0 12px;
  border: 1px solid #cbcbcb;
  border-radius: 6px;
  background: #fff;
  font-family: var(--font-base);
  font-size: 16px;
  color: #333333;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-dropdown::after {
  top: 1px;
  right: 1px;
  bottom: 1px;
  background: transparent;
  border-left: 0;
  color: #646464;
  font-size: 1.4rem;
}
/* 生年月日：年/月/日の幅 */
.fs-body-checkout .fs-c-modal__inner .fs-c-inputDate__year {
  width: 104px !important;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-inputDate__month,
.fs-body-checkout .fs-c-modal__inner .fs-c-inputDate__date {
  width: 78px !important;
}

/* チェックボックス（会員情報を更新する等）：サイト調の緑 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkbox__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-family: var(--font-base);
  font-size: 13px;
  color: #646464;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkbox__checkMark {
  border: 1.5px solid #cbcbcb;
  border-radius: 2px;
  background: #fff;
  transition:
    background 0.2s ease,
    border-color 0.2s ease;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkbox__checkbox:checked + label > .fs-c-checkbox__checkMark {
  background: #08b783;
  border-color: #08b783;
}

/* ボタン（設定＝緑プライマリ／キャンセル＝アウトライン）。pair の左右配置は既定のまま */
.fs-body-checkout .fs-c-modal__inner .fs-c-buttonContainer--pair {
  max-width: 60%;
  margin: 20px auto 0;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-button--primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0 !important;
  min-height: 48px;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #08b783 !important;
  box-shadow: none !important;
  color: #fff !important;
  font-family: var(--font-base);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: opacity 0.25s ease;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-button--primary .fs-c-button__label {
  color: #fff !important;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-button--standard {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0;
  padding: 0 !important;
  border: 1px solid #646464 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #333333 !important;
  font-family: var(--font-base);
  font-size: 14px;
  letter-spacing: 0.04em;
  cursor: pointer;
}
@media (hover: hover) {
  .fs-body-checkout .fs-c-modal__inner .fs-c-button--primary:hover {
    opacity: 0.85;
  }
  .fs-body-checkout .fs-c-modal__inner .fs-c-button--standard:hover {
    background: #f5f5f5 !important;
  }
}

/* ---- お届け先リストモーダル（fs-c-modal--addressList）：カード＋制御ボタン ---- */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee {
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 14px 16px;
  align-items: center;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__data {
  padding: 0;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__data__name {
  min-width: 120px;
  font-size: 15px;
  font-weight: 600;
  color: #333333;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__data__name__home {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 8px;
  border: 1px solid #cbcbcb;
  border-radius: 2px;
  font-size: 11px;
  font-weight: 400;
  color: #8c8c8c;
  vertical-align: middle;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__data__address {
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.7;
  color: #646464;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__control {
  padding: 0;
  gap: 10px;
}
/* 制御ボタン（変更/指定する）：モーダル共通の width:100% を打ち消し、
   内容幅の小さめアウトラインボタンに（幅が確保できず改行する問題を解消） */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__control .fs-c-button--standard {
  display: inline-flex;
  width: auto;
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  border-radius: 3px !important;
  font-size: 13px;
  white-space: nowrap;
}

/* ---- お届け先変更モーダル（fs-c-modal--changeShippingAddress）：選択カード ---- */
/* フォームの位置関係は変更せず、選択中/非選択のあしらいと余白感を調整 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethodList {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: grid;
  gap: 12px; /* カード間の余白 */
}
/* 非選択：白地＋ライトグレー枠 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod,
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethodList--uncollapsed .fs-c-checkout-checkoutMethod:not(.is-active) {
  border: 1px solid #e0e0e0 !important;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}
/* 選択中：緑枠で強調 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod.is-active {
  border: 1.5px solid #08b783 !important;
}
/* タイトル（ラジオ）帯：システムのグレー/ダーク帯を解除し白地・余白確保 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__title,
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethodList--uncollapsed .fs-c-checkout-checkoutMethod:not(.is-active) .fs-c-checkout-checkoutMethod__title:not(.is-active) {
  background: #fff !important;
  color: #333333 !important;
  padding: 14px 16px;
}
/* 選択中のタイトルは淡い緑背景で判別性を上げる */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod.is-active .fs-c-checkout-checkoutMethod__title {
  background: rgba(8, 183, 131, 0.06) !important;
  color: #333333 !important;
}
/* ボディ（住所プレビュー／入力フォーム）の余白 */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body {
  padding: 4px 16px 16px;
}
/* 住所プレビュー（ご自宅側の customerInfo） */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body .fs-c-checkout-customerInfo {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body .fs-c-checkout-customerInfo > li {
  font-size: 13px;
  line-height: 1.8;
  color: #646464;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body .fs-c-checkout-customerInfo__name {
  font-size: 14px;
  font-weight: 600;
  color: #333333;
}
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body .fs-c-checkout-customerInfo__address .fs-u-zipCode::before {
  content: "〒";
  margin-right: 2px;
}
/* 入力フォーム側の field 余白（システム margin:8px auto を上詰めに） */
.fs-body-checkout .fs-c-modal__inner .fs-c-checkout-checkoutMethod__body .fs-c-inputInformation__field {
  margin: 4px 0 0;
}

.fs-body-checkout .fs-c-checkout-settings__title {
  border-bottom: solid 1px #c8c8c8;
  padding-bottom: 6px;
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  .fs-body-checkout .fs-c-modal__inner .fs-c-buttonContainer--pair {
    max-width: 240px;
    margin: 30px auto 0;
    grid-row-gap: 10px;
  }

  .fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee {
    display: block;
  }

  .fs-body-checkout .fs-c-modal__inner .fs-c-checkout-addressee__control {
    grid-template-columns: auto auto;
    gap: 10px;
    margin-top: 10px;
  }
}

/*404*/
.fs-p-pageNotFound__image {
  margin: 0 auto 20px;
}

/* ==========================================================================
   ★★★ NEWS 一覧（WPの投稿機能 / body.page-news・.p-news）★★★
   - Figma: PC 685-4948 / SP 685-5382。NEWS見出し(serif中央)＋
     「日付＋タイトル」の行リスト（罫線なし・余白区切り）＋MORE(角丸アウトライン)。
   - 5件表示・以降はMORE（WPは投稿をページング/AJAX。静的では--hidden行を
     script.js が5件ずつ表示、尽きたらボタンを隠す）。
   ========================================================================== */
.p-news {
  max-width: 1000px;
  margin: 0 auto;
  padding: 96px 20px 120px;
}
.p-news__title {
  margin: 0 0 48px;
  font-family: var(--font-serif);
  font-size: 30px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-align: center;
  color: #333333;
}
.p-news__list {
  max-width: 720px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}
.p-news__item--hidden {
  display: none;
}
/* 記事が0件のとき（WP一覧） */
.p-news__empty {
  max-width: 720px;
  margin: 8px auto 0;
  padding: 40px 20px;
  background: #f5f5f5;
  text-align: center;
  font-family: var(--font-base);
  font-size: 14px;
  color: #8c8c8c;
}
.p-news__link {
  display: flex;
  align-items: baseline;
  gap: 15px;
  padding: 8px 0;
  color: inherit;
  text-decoration: none;
}
.p-news__date {
  flex: 0 0 auto;
  width: 80px;
  font-family: var(--font-base);
  font-size: 13px;
  letter-spacing: 0.04em;
  color: #b0b0b0;
  white-space: nowrap;
}
.p-news__text {
  font-family: var(--font-base);
  font-size: 15px;
  line-height: 1.7;
  color: #333333;
}
@media (hover: hover) {
  .p-news__link:hover .p-news__text {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}
/* MORE：他ページと共通の .more-button（serif・角丸ピル・「+」アイコン）を流用 */
.p-news__more {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}
.p-news__more[hidden] {
  display: none;
}
/* ---------- NEWS 一覧 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .p-news {
    padding: 56px 20px 80px;
  }
  .p-news__title {
    margin-bottom: 36px;
    font-size: 26px;
  }
  .p-news__link {
    gap: 20px;
    align-items: flex-start;
    padding: 12px 0;
  }
  .p-news__date {
    width: 74px;
  }
}

/* ==========================================================================
   ★★★ NEWS 記事詳細（WPの投稿 single / body.page-article・.p-article）★★★
   - Figma: PC 686-6766 / SP 687-7523。中央720カラムに 日付＋タイトル＋本文。
   - 本文(the_content)はWPエディターで入力＝**エディター側にCSSを書かなくて済む
     よう、テーマ側で標準要素(p/a/h2-4/strong/ul/ol/img/wp-block-gallery)を装飾**。
   - デザインに無いが下部に「一覧に戻る」テキストリンクを設置。
   ========================================================================== */
.p-article {
  padding: 72px 20px 100px;
}
.p-article__inner {
  max-width: 720px;
  margin: 0 auto;
}
/* 日付・タイトル（テンプレート出力：the_date / the_title） */
.p-article__date {
  margin: 0;
  font-family: var(--font-base);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: #b0b0b0;
}
.p-article__title {
  margin: 8px 0 32px;
  font-family: var(--font-base);
  font-size: 18px;
  font-weight: normal;
  line-height: 1.6;
  color: #646464;
}
/* ---- 本文（the_content）：WP標準要素を装飾。エディターにCSS不要 ---- */
.p-article__body {
  font-family: var(--font-base);
  font-size: 14px;
  line-height: 2;
  color: #646464;
}
.p-article__body > * {
  margin-top: 0;
  margin-bottom: 0;
}
.p-article__body > * + * {
  margin-top: 1.8em;
}
.p-article__body a {
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.p-article__body h2,
.p-article__body h3,
.p-article__body h4 {
  margin-top: 2.2em;
  margin-bottom: 0.8em;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.6;
  color: #333333;
}
.p-article__body strong,
.p-article__body b {
  font-weight: 600;
  color: #333333;
}
.p-article__body ul,
.p-article__body ol {
  padding-left: 1.4em;
}
.p-article__body li {
  margin: 0.3em 0;
}
.p-article__body img {
  display: block;
  max-width: 100%; /* カラム幅を超えない（崩れ防止） */
  height: auto;
}
.p-article__body figure {
  margin: 0;
}
/* 単体画像（wp-block-image） */
.p-article__body .wp-block-image {
  margin-top: 1.8em;
}
.p-article__body .wp-block-image img {
  background: #f2f1ed;
}
/* 整列・サイズ指定が無い単体画像だけカラム幅いっぱいに（従来の見た目を維持）。
   整列/リサイズ指定がある場合は width:100% を当てず、エディターの指定を尊重する */
.p-article__body .wp-block-image:not(.alignleft):not(.alignright):not(.aligncenter):not(.alignwide):not(.alignfull):not(.is-resized) > img,
.p-article__body .wp-block-image:not(.alignleft):not(.alignright):not(.aligncenter):not(.alignwide):not(.alignfull):not(.is-resized) > a > img {
  width: 100%;
}

/* ============================================================
   WordPress ブロックエディターの整列（左寄せ/右寄せ/中央/幅広/全幅）対応
   ── テーマにWPコアCSSを読み込んでいないため、崩れないよう自前で定義。
   ── figure(.wp-block-image) と、クラシック/インラインの img 直接指定の両対応。
   ============================================================ */
/* 左寄せ：本文がテキスト回り込み */
.p-article__body .alignleft,
.p-article__body img.alignleft {
  float: left;
  max-width: 50%;
  margin: 0.4em 1.5em 1em 0;
}
/* 右寄せ */
.p-article__body .alignright,
.p-article__body img.alignright {
  float: right;
  max-width: 50%;
  margin: 0.4em 0 1em 1.5em;
}
/* 中央寄せ */
.p-article__body .aligncenter {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.p-article__body .aligncenter > img,
.p-article__body img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* 幅広・全幅：中央720pxカラムを飛び出して横スクロール＝崩れになるため、
   フルブリードにはせずカラム幅上限に抑える（＝崩さないことを優先） */
.p-article__body .alignwide,
.p-article__body .alignfull {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}
.p-article__body .alignwide > img,
.p-article__body .alignfull > img {
  width: 100%;
}
/* エディターで幅リサイズした画像：指定幅を尊重しつつカラム内に収める */
.p-article__body .wp-block-image.is-resized > img,
.p-article__body .wp-block-image.is-resized > a > img {
  height: auto;
  max-width: 100%;
}
/* キャプション */
.p-article__body figcaption {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.6;
  color: #8c8c8c;
  text-align: center;
}
/* 段落等のテキスト整列クラス */
.p-article__body .has-text-align-center {
  text-align: center;
}
.p-article__body .has-text-align-right {
  text-align: right;
}
.p-article__body .has-text-align-left {
  text-align: left;
}
/* フロート解除：回り込みが見出し・次ブロック・「一覧に戻る」に波及しないように */
.p-article__body::after {
  content: "";
  display: block;
  clear: both;
}
.p-article__body h2,
.p-article__body h3,
.p-article__body h4 {
  clear: both;
}
/* ギャラリー（2カラム・PC/SP共通）。WPギャラリーブロックをそのまま利用 */
.p-article__body .wp-block-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 1.8em;
}
.p-article__body .wp-block-gallery .wp-block-image,
.p-article__body .wp-block-gallery figure {
  margin: 0;
}
.p-article__body .wp-block-gallery img {
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
  background: #f2f1ed;
}
/* ---- 一覧に戻る（テキストリンク） ---- */
.p-article__back {
  max-width: 720px;
  margin: 56px auto 0;
  text-align: center;
}
.p-article__back-link {
  font-family: var(--font-base);
  font-size: 14px;
  color: #646464;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (hover: hover) {
  .p-article__back-link:hover {
    opacity: 0.7;
  }
}
/* ---------- NEWS 記事詳細 : SP ( ~767px ) ---------- */
@media (max-width: 767px) {
  .p-article {
    padding: 36px 20px 72px;
  }
  .p-article__title {
    margin-bottom: 24px;
    font-size: 17px;
  }
  .p-article__back {
    margin-top: 44px;
  }
}