/* ====== /c1/support 用 共通 ====== */
.support-guide, .support-faq, .support-update { /* ページ全体の余白調整など */ }

.support-guide {
  /* background-color: #E5FFFF; */
}
.support-faq {
  /* background-color: #FFF2E5; */
}
.support-update {
  /* background-color: #E5FFF2; */
}

/* FAQ 2列グリッド（スマホ1列） */
.faq-section { margin-block: 2rem; }
.faq-title { font-size:var(--font-md); margin-bottom: .75rem; }
.faq-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 20px;
}
.faq-item a { font-weight: 600; text-decoration: none; }
.faq-item a:hover { text-decoration: underline; }
.faq-excerpt { margin-top: .25rem; font-size:var(--font-xs); color: #666; }
@media (max-width: 768px) {
  .faq-grid { grid-template-columns: 1fr; }
}

/* 利用ガイド（カテゴリ別セクション） */
.guide-section { margin-block: 1.5rem; }
.guide-section h2 { margin-bottom: .5rem; font-size:var(--font-md); }
.guide-list { list-style: none; margin: 0; padding: 0; }
.guide-list li { margin: .25rem 0; }
.excerpt { color: #666; font-size:var(--font-xs); margin-top: .1rem; }

/* ===== メイン余白 ===== */
.c1s-main {
  font-size:var(--font-md);
  max-width: 1300px;
  margin: 0 auto;
  padding: 24px 16px 56px;
  /* background-color: #F5F5F5; */

}

/* ===== FAQ 2列グリッド ===== */
.faq-section { margin-block: 24px; }
.faq-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 24px;
}
.faq-item a { font-weight: 600; color: #111; text-decoration: none; }
.faq-item a:hover { text-decoration: underline; }
.faq-excerpt { margin-top: .25rem; font-size:var(--font-xs); color: #666; }
@media (max-width: 768px) { .faq-grid { grid-template-columns: 1fr; } }

/* ===== ガイド一覧 ===== */
.guide-section { margin-block: 24px; }
.guide-section h2 { margin: 0 0 8px; font-size:var(--font-md); }
.guide-list { list-style: none; margin: 0; padding: 0; }
.guide-list li { margin: 6px 0; }
.excerpt { color: #666; font-size:var(--font-xs); margin-top: .1rem; }

/* パンくず */
.c1s-breadcrumbs { font-size:var(--font-xs); color:#777; margin:12px 0 8px; }
.c1s-breadcrumbs a { color:#555; text-decoration:none; }
.c1s-breadcrumbs a:hover { text-decoration:underline; }
.c1s-breadcrumbs span { margin:0 6px; }

/* カード一覧 */
.c1s-cards { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:14px 24px; }
@media (max-width:768px){ .c1s-cards{ grid-template-columns:1fr; } }

.c1s-card { border:1px solid #eee; border-radius:10px; padding:14px; background:#fff; }
.c1s-card__link { text-decoration:none; color:#111; display:block; }
.c1s-card__title { font-weight:700; margin-bottom:.25rem; }
.c1s-card__excerpt { color:#666; font-size:var(--font-md); }

/* アーカイブヘッダ・並び替え */
.c1s-archive-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:12px 0 18px; }
.c1s-sort select { padding:6px 8px; border-radius:6px; border:1px solid #ddd; }

/* 詳細 */
.c1s-article h1 { margin:6px 0 10px; }
.c1s-meta { color:#666; margin-bottom:12px; display:flex; gap:12px; flex-wrap:wrap; }
.c1s-postnav { display:flex; justify-content:space-between; margin-top:24px; }
.c1s-postnav a { text-decoration:none; }

/* FAQ/Guide（既出のクラス流用） */
.faq-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px 24px; list-style:none; margin:0; padding:0; }
@media (max-width:768px){ .faq-grid{ grid-template-columns:1fr; } }

/* ===== レイアウト（左コンテンツ + 右サイドバー） ===== */
.c1s-layout {
  display: grid;
  grid-template-columns: 1fr 280px; /* 右サイド幅はお好みで */
  gap: 24px;
}

/* ===== カテゴリ 2列グリッド ===== */
.c1s-catgrid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2列にする */
  gap: 16px 20px; /* 各カードの間隔 */
}
/* カテゴリカード */
.c1s-catcard {
  border: 1px solid #eee;
  border-radius: 8px;
  background: #fff;
  padding: 16px 20px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 8px;
}
.c1s-catcard__head { margin-bottom: 4px; }
.c1s-catcard__title {
  font-size:var(--font-lg);
  font-weight: 600;
  color: #111827;
  text-decoration: none;
}
.c1s-catcard__title:hover {
  text-decoration: underline;
  color: #10b981;
}
/* 投稿リスト */
.c1s-catposts {
  margin-top: 0px;
  padding-left: 0;
  list-style: none;
}

.c1s-catposts__item + .c1s-catposts__item {
  margin-top: 2px;
}
.c1s-catposts__item a {
  text-decoration: none;
  color: #2b6cb0;
  font-size: var(--font-md);
}
.c1s-catposts__item a:hover { text-decoration: underline; }

/* カテゴリカード */
.c1s-catcard__link {
  display: block; padding: 14px; text-decoration: none; color: #111;
}
.c1s-catcard__desc { color: #666; font-size:var(--font-md); margin: .25rem 0 0; }
.c1s-catcard__more { display: inline-block; margin-top: 8px; color: #2b6cb0; font-weight: 600; }
.c1s-catcard__desc { color:#666; font-size:var(--font-md); margin:.25rem 0 0; }
.c1s-catcard__morewrap { margin-top: 10px; }
.c1s-catcard__morelink { font-weight: 700; color: #2b6cb0; text-decoration: none; }
.c1s-catcard__morelink:hover { text-decoration: underline; }
.c1s-catcard__empty { color:#777; font-size:var(--font-md); }

/* ===== 右サイド：検索 + カテゴリリンク ===== */
.c1s-search { display: grid; gap: 8px; padding: 12px; border: 1px solid #eee; border-radius: 10px; background: #fff; }
.c1s-search__label { font-weight: 700; }
.c1s-search__input {
  height: 40px; padding: 0 10px; border: 1px solid #ddd; border-radius: 8px; outline: none;
}
.c1s-search__input:focus { border-color: #2b6cb0; }

.c1s-sidecats { margin-top: 16px; padding: 12px; border: 1px solid #eee; border-radius: 10px; background: #fff; }
.c1s-sidecats__title { font-weight: 700; margin-bottom: 8px; }
.c1s-sidecats__list { list-style: none; margin: 0; padding: 0; }
.c1s-sidecats__list li { margin: 6px 0; }
.c1s-sidecats__list a { text-decoration: none; color: #2b6cb0; }
.c1s-sidecats__list a:hover { text-decoration: underline; }

/* ===== レスポンシブ ===== */
@media (max-width: 960px) {
  .c1s-layout { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .c1s-catgrid { grid-template-columns: repeat(1, minmax(0,1fr)); 
    gap: 16px;
  }
}

/* ===== カテゴリバッジ ===== */
.c1s-badges { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.c1s-badge {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.78rem; font-weight:700; line-height:1;
  color:#166534; background:#ecfdf5; border:1px solid #bbf7d0;
  padding:6px 8px; border-radius:999px; /* pill */
}
.c1s-badge__dot {
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:#10b981;
}

/* ダーク・色数調整をしたい場合はカテゴリごとに色を変える例：
   .term-guide .c1s-badge { ... } のように body_class() や data-属性で分岐も可 */

/* ===== タグラベル ===== */
.c1s-tags { display:flex; flex-wrap:wrap; gap:8px; margin:4px 0; }
.c1s-tag  { font-size:.78rem; color:#64748b; }

/* 行レイアウト：左メタ / 右本文 */
.c1s-card__row { display: flex; gap: 12px; align-items: flex-start; }

/* 左のメタ列：幅を固定 or 収まり良く */
.c1s-meta-col {
  flex: 0 0 160px;           /* お好みで：140〜180px など */
  display: flex; flex-direction: column; gap: 6px;
}

/* 右の本文列：残り幅を使う */
.c1s-content-col { flex: 1 1 auto; min-width: 0; } /* min-width:0 で折返しOK */

@media (max-width: 640px) {
  .c1s-card__row { flex-direction: column; gap: 8px; }
  .c1s-meta-col { flex: none; }
}

/* 既存：バッジ/タグ（必要なら微調整） */
.c1s-badges { display:flex; flex-wrap:wrap; gap:6px; }
.c1s-badge { display:inline-flex; align-items:center; gap:6px;
  font-size:.78rem; font-weight:700; line-height:1;
  color:#166534; background:#ecfdf5; border:1px solid #bbf7d0;
  padding:6px 8px; border-radius:999px;
}
.c1s-badge__dot { width:8px; height:8px; border-radius:50%; background:#10b981; display:inline-block; }
.c1s-tags { display:flex; flex-wrap:wrap; gap:8px; }
.c1s-tag  { font-size:.78rem; color:#64748b; }

/* ===== 検索結果 ===== */
/* 1カラムの縦並び */
.c1s-results--onecol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 24px;
}

/* タイトル右下にメタを寄せる */
.c1s-result__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end; /* タイトルの“下端”と揃える */
  gap: 16px;
}
.c1s-result__title {
  margin: 0;
  line-height: 1.3;
}
.c1s-result__meta {
  font-size: 0.9rem;
  white-space: nowrap; /* 右エリアで折返しを抑制（必要に応じて外す） */
}
.c1s-meta__sep { opacity: .6; margin: 0 .4em; }

.c1s-result__excerpt { margin-top: 8px; color: #444; }

/* ページネーション */
.c1s-pagination { margin-top: 32px; text-align: center; }
.c1s-pagination .page-numbers {
  display: inline-block;
  padding: 6px 10px;
  margin: 0 4px;
  border: 1px solid #ddd;
}
.c1s-pagination .current { background: #f5f5f5; font-weight: 700; }

/* ==== Support記事本文：UL/OLの左はみ出し修正 ==== */
/* 対象：single-c1-support の本文。必要に応じてスコープを広げてもOK */
.c1s-article .c1s-content ul,
.c1s-article .c1s-content ol {
  /* 行頭マーカーが本文内に収まるようパディングを戻す */
  padding-inline-start: 1.6em; /* 16px相当（font-size基準） */
  margin-inline-start: 0;
  list-style-position: outside; /* 標準。マーカーを外側に出してテキストは揃える */
}

/* リスト項目の行間と段落間 */
.c1s-article .c1s-content li + li { margin-top: .35em; }
.c1s-article .c1s-content ul + p,
.c1s-article .c1s-content ol + p { margin-top: 1em; }

/* ネストしたリストのインデントをやや浅く */
.c1s-article .c1s-content li > ul,
.c1s-article .c1s-content li > ol {
  padding-inline-start: 1.2em;
  margin-top: .35em;
}

/* 番号の桁が増えてもズレにくく（等幅数字） */
.c1s-article .c1s-content ol { font-variant-numeric: tabular-nums; }

/* Safari等で ::marker の字詰めが気になる場合の微調整（任意） */
.c1s-article .c1s-content li::marker { font-variant-numeric: tabular-nums; }

/* 画像・コードブロックと並ぶ時の余白調整（任意） */
.c1s-article .c1s-content ul,
.c1s-article .c1s-content ol { margin-block: .6em 1em; }

/* Support記事本文内のリスト行間をやや狭く */
.c1s-article .c1s-content ul,
.c1s-article .c1s-content ol {
  line-height: 1.4; /* 通常1.6〜1.8のところを少し詰める */
}

/* リスト項目間の余白も少し狭める */
.c1s-article .c1s-content li + li {
  margin-top: 0.2em; /* 前項との間を詰める */
}

/* ネストリストも同様に */
.c1s-article .c1s-content li > ul,
.c1s-article .c1s-content li > ol {
  line-height: 1.4;
  margin-top: 0.2em;
}

/* 右サイド全体をやや小さめに */
.c1s-guide-right {
  font-size: 0.9em; /* 本文より一段小さく（約14px） */
  line-height: 1.6;
}

/* カテゴリ見出し（利用ガイド / 更新情報） */
.c1s-sidecats__title {
  font-size: 0.9em;   /* 約13px */
  font-weight: 600;
  margin-bottom: 0.5em;
  color: var(--color-text, #333);
}

/* カテゴリリンク一覧 */
.c1s-sidecats__list li a {
  font-size: 0.8em;   /* 約12px */
  line-height: 1.5;
  color: var(--color-link, #222);
}

.c1s-sidecats__list li a:hover {
  text-decoration: underline;
  opacity: 0.8;
}
