/* 記事一覧（templates/notes-index.php）。
   出所：NotesIndexPC の <style>（PC）と NotesIndexSP の <style>（900px 以下）。値は変えない。
   カンプとの差：見出し帯の見出しブロックの inline style（margin: space-5 0 0）をここへ移した。パンくずを見出しの上に足した（Breadcrumb）。
   フッターの規則はトップ・記事詳細と同じ。 */

html, body { margin: 0; }
.section { padding: var(--section-pc) var(--gutter-pc); }
.band { padding: 0 var(--gutter-pc) var(--space-5); }
.band .lm-heading { margin: var(--space-5) 0 0; }
.band .lm-h1 { margin-top: var(--space-4); }
.band .lm-body { margin-top: var(--space-2); }
.notes__wrap { max-width: 880px; margin: 0 auto; }
.lm-pager { max-width: 880px; margin-left: auto; margin-right: auto; }

/* footer（トップ・記事詳細と同じ） */
.footer { padding: var(--space-6) var(--gutter-pc) var(--space-5); }
.footer__row { display: flex; justify-content: space-between; align-items: baseline; }
.footer__sns { display: flex; gap: var(--space-4); margin: 0; padding: 0; list-style: none; font-size: 12px; letter-spacing: .14em; }
.footer__sns a { color: var(--on-sea-muted); text-decoration: none; }
.footer__bottom { margin-top: var(--space-6); padding-top: var(--space-3); border-top: 1px solid var(--rule-sea); }
.lm-paper .footer__sns a { color: var(--ink-muted); }
.lm-paper .footer__bottom { border-top-color: var(--rule); }
.lm-header .lm-logo { height: var(--logo-h, 24px); }

/* ---- 900px 以下：NotesIndexSP ---- */
@media (max-width: 900px) {
  .section { padding: var(--space-6) var(--gutter-sp); }
  .band { padding: 0 var(--gutter-sp) var(--space-5); }
  .band .lm-heading { margin: var(--space-5) 0 0; }
  .band .lm-h1 { margin-top: var(--space-3); }
  .band .lm-body { margin-top: var(--space-2); font-size: 14px; }
  .notes__wrap { max-width: none; }
  .lm-pager { margin-top: var(--space-5); }

  .footer { padding: var(--space-5) var(--gutter-sp) var(--space-4); }
  .footer__row:not(.footer__bottom) { display: block; }
  .footer .lm-nav { flex-direction: column; gap: var(--space-2); margin-top: var(--space-4); }
  .footer__bottom { display: grid; gap: var(--space-2); margin-top: var(--space-5); }
  .footer__sns { gap: var(--space-3); }
  .lm-header .lm-logo { height: var(--logo-h-sp, var(--logo-h, 24px)); }
}