/*==================================
  全体設定
==================================*/
body {
  font-family: "Noto Sans JP", sans-serif;
  color: #333;
  font-weight: 400;
}

/* プレビューヘッダーを非表示 */
.fs-preview-header {
  display: none;
}

li {
  list-style-type: none;
}

a {
  color: #333;
  text-decoration: none;
}

a:visited {
  color: inherit;
}

a:hover {
  text-decoration: none;
}

.fs-l-main {
  margin: 0px auto;
}

.fs-c-heading {
  margin: 0;
  padding: 0;
}

/*==================================
  ページ見出し（全ページ共通）
  中央寄せ・モダンでシンプル
==================================*/
html body[class] .fs-c-heading.fs-c-heading--page,
html body[class] h1.fs-c-heading.fs-c-heading--page {
  margin: 28px 0 32px !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: none !important;
  background: transparent !important;
  color: #333 !important;
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

@media (max-width: 767px) {
  html body[class] .fs-c-heading.fs-c-heading--page,
  html body[class] h1.fs-c-heading.fs-c-heading--page {
    margin: 20px 0 24px !important;
    font-size: 1.4rem !important;
    letter-spacing: 0.03em !important;
  }
}

/*==================================
  パンくずリスト（全ページ共通）
  商品詳細ページの表示仕様を基準にする。
  display は指定せず、意図的な非表示設定を維持する。
==================================*/
html body[class] nav.fs-c-breadcrumb,
html body[class] div.fs-c-breadcrumb {
  width: 100% !important;
  max-width: 1216px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 8px !important;
  box-sizing: border-box !important;
  color: #666 !important;
}

html body[class] .fs-c-breadcrumb__list {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 2px 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  scrollbar-width: thin;
}

html body[class] .fs-c-breadcrumb__listItem {
  color: #666 !important;
  line-height: 1.5 !important;
}

html body[class] .fs-c-breadcrumb__list a {
  color: #666 !important;
  font-size: 1.1rem !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

html body[class] .fs-c-breadcrumb__listItem + .fs-c-breadcrumb__listItem::before {
  content: ">" !important;
  display: inline !important;
  padding-left: 0.35em !important;
  padding-right: 0.35em !important;
  font-size: 0.9rem !important;
  color: #aaa !important;
  flex-shrink: 0;
}

html body[class] .fs-c-breadcrumb__listItem + .fs-c-breadcrumb__listItem::after {
  content: none !important;
  display: none !important;
}

/* 商品詳細と同様、現在ページ名はパンくずに重ねて表示しない */
html body[class] .fs-c-breadcrumb__listItem:last-child {
  display: none !important;
}

/* パンくずが複数連続するときは間隔を詰める（商品詳細と同じ挙動） */
html body[class] .fs-c-breadcrumb:has(~ .fs-c-breadcrumb) {
  padding-bottom: 0 !important;
}

/* SPで2本目を折りたたんで非表示のときは、見えている最後の1本に下余白を戻す
   （is-breadcrumb-last は商品詳細のJSが「最後に見えているパンくず」へ付与） */
html body[class] .fs-c-breadcrumb.is-breadcrumb-last {
  padding-bottom: 8px !important;
}

html body[class] nav.fs-c-breadcrumb + div.fs-c-breadcrumb,
html body[class] .fs-c-breadcrumb + .fs-c-breadcrumb {
  padding-top: 0 !important;
}

/* サブグループも本体リストと同じ上下パディングだけで揃える（行間を均一に） */
html body[class] .fs-c-breadcrumb__list--subgroup {
  margin: 0 !important;
  padding: 2px 0 !important;
}

@media (max-width: 768px) {
  html body[class] nav.fs-c-breadcrumb,
  html body[class] div.fs-c-breadcrumb {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  html body[class] .fs-c-breadcrumb__list {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  html body[class] .fs-c-breadcrumb__list a {
    font-size: 0.9rem !important;
  }
}