/* ==========================
   ガイド系ページ 横遷移ナビ
   ========================== */
/*【お買い物ガイド】全体*/
h3.footer_notice_heading {
  text-align: center;
  border-bottom: 2px solid #6b5f8e;
  padding: 20px 0;
  margin-bottom: 40px;
  color: #6b5f8e;
  font-weight: bold;
}

/*【お買い物ガイド】横遷移*/
/* 全体ラッパー */
.guide-links-area {
  width: 100%;
  padding: 5px 4% 20px;
  box-sizing: border-box;
}

/* レイアウト（まずはスマホ：1列） */
.guide-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr; /* ★ 基本は1列 */
  gap: 8px;
}

/* タブレット以上：2列 */
@media (min-width: 600px) {
  .guide-links {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* PC：4列 */
@media (min-width: 960px) {
  .guide-links {
    grid-template-columns: repeat(4, 1fr); /* ★ 4つ並び */
  }
}

.guide-links__item {
}

/* ボタン本体 */
.guide-links__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 10px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  background-color: #fff;
  text-decoration: none;
  color: #000;
  font-size: 14px;
  white-space: nowrap;
  border-radius: 3px;
}

/* ▶（右向き）
.guide-links__link::after {
  content: "";
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid #6b5f8e; 
} */

/* ホバー */
.guide-links__link:hover {
  background-color: #f9f9f9;
}

/* ▼（アクティブ） */
/* アクティブ時：リンク無効・見た目も変更 */
.guide-links__item--active .guide-links__link {
  pointer-events: none; /* ★クリック無効化 */
  cursor: default; /* ★カーソルを通常に */
  background-color: #f4f2f7; /* ほんのりアクセント寄りの無効色（お好みで） */
  border-color: #d7d2e7; /* お好みでボーダーも弱く */
  color: #6b5f8e; /* 見出し文字もアクセント寄りに */
}

/* アクティブ時の矢印 ▼ 
.guide-links__item--active .guide-links__link::after {
  border: none;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #6b5f8e;
}*/

/* ==========================
   ガイド系ページ 共通スタイル
   ========================== */

.if-guide {
  max-width: 960px;
  margin: 0 auto;
  padding: 32px 16px;
  font-size: 14px;
  line-height: 1.8;
  color: #333;
  box-sizing: border-box;
}

.if-guide__title {
  font-size: 22px;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 40px;
  letter-spacing: 0.08em;
  border-bottom: 2px solid #6b5f8e;
}

/* セクション見出し */
.if-guide__section {
  margin-bottom: 32px;
}

.if-guide__heading {
  font-size: 17px;
  font-weight: 700;
  border-left: 4px solid #333;
  padding-left: 10px;
  margin-bottom: 16px;
}

.if-guide__text {
  margin-bottom: 12px;
}
.if-guide__text a{
    text-decoration: underline;
    color: #08c;
}

.if-guide-list {
  margin: 0;
  padding-left: 1.4em;
}

.if-guide-list li {
  margin-bottom: 6px;
}

/* カードレイアウト（配送方法・支払い方法など） */
.if-guide-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.if-guide-card {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 16px;
  box-sizing: border-box;
  background-color: #fff;
}

.if-guide-card__title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
}

.if-guide-card__badge {
  display: inline-block;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  background-color: #f5f5f5;
  margin-bottom: 10px;
}

.if-guide-card__list {
  margin: 0 0 10px;
  padding-left: 1.2em;
}

.if-guide-card__list li {
  margin-bottom: 4px;
}

.if-guide-card__price {
  font-size: 13px;
  font-weight: 700;
  margin: 10px 0 4px;
}

.if-guide-card__note {
  font-size: 12px;
  color: #777;
}

/* テーブル（地域別送料など） */
.if-guide-table-wrap {
  margin-top: 8px;
}

.if-guide-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.if-guide-table th,
.if-guide-table td {
  border-top: 1px solid #eee;
  padding: 6px 4px;
  text-align: left;
}

.if-guide-table th {
  width: 50%;
  font-weight: 400;
}

.if-guide-subheading {
  font-size: 14px;
  font-weight: 700;
  margin: 12px 0 6px;
}

/* お支払いページなどで使う小見出し・注意書き */
.if-guide-note {
  font-size: 12px;
  color: #777;
  margin-top: 4px;
}

/* レスポンシブ */
@media (max-width: 960px) {
  .if-guide {
    padding: 24px 12px;
  }

  .if-guide-cards {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .if-guide__title {
    font-size: 20px;
  }

  .if-guide__heading {
    font-size: 16px;
  }

  .if-guide-card {
    padding: 14px;
  }
}

.if-logo-guide {
  display: block;
  width: 140px;   
  margin: 8px 0 12px;
  border: 1px solid #eee;
}

/* ==========================
   FAQ 用スタイル
   ========================== */

/* 上部ジャンプメニュー */
.if-faq-nav {
  margin: 16px 0 24px;
}

.if-faq-nav__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.if-faq-nav__item a {
  display: block;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #e0e0e0;
  font-size: 12px;
  text-decoration: none;
  color: #333;
  background-color: #fafafa;
  white-space: nowrap;
}

.if-faq-nav__item a:hover {
  background-color: #f0f0f0;
}

/* 質問ブロック */
.if-faq-item {
  border-top: 1px solid #eee;
  padding-top: 20px;
  scroll-margin-top: 140px; /* ←ここをヘッダーの高さ＋ちょい にする */
}

.if-faq-question {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
}

.if-faq-answer {
  margin-left: 0;
}

.if-faq-subheading {
  font-size: 14px;
  font-weight: 700;
  margin: 10px 0 4px;
}

/* スムーズスクロール */
html {
  scroll-behavior: smooth;
}

/* スマホ対応 */
@media (max-width: 600px) {
  .if-faq-nav__list {
    gap: 6px;
  }

  .if-faq-nav__item a {
    font-size: 11px;
    padding: 5px 8px;
    white-space: normal;
  }

  .if-faq-question {
    font-size: 15px;
  }

  /* スマホアンカー位置補正（ヘッダー53px対応） */
  .if-faq-item {
    scroll-margin-top: 80px;
  }

  .if-faq-item:target::before {
    content: "";
    display: block;
    height: 80px;
    margin-top: -80px;
  }
}