/* 記事の詳細（templates/notes-detail.php）。
   出所：NotesDetailPC の <style>（PC）と NotesDetailSP の <style>（900px 以下）。値は変えない。
   フッターの規則は会社・事業所トップと同じ（トップのテンプレート CSS と同じ値を持つ）。
   カンプとの差：見学への1行の段の inline style（上下 space-6）をここへ移した。PC と SP で DOM が違うので、PC の DOM に揃えて SP は縦に積む。 */

html, body { margin: 0; }
.band { padding: 0 var(--gutter-pc); }
.article { padding: var(--space-6) var(--gutter-pc) var(--section-pc); }
.article__head { max-width: var(--measure-article); margin: 0 auto var(--space-5); }
.article .lm-pager { max-width: var(--measure-article); margin-left: auto; margin-right: auto; }
.after-band { padding: var(--space-6) var(--gutter-pc); border-top: 1px solid var(--rule); } /* 記事（paper）とフッター（sea）の間で埋もれないよう paper-sunk の面にし、記事との境に罫（2026-10-14） */
.after { display: flex; justify-content: space-between; align-items: center; max-width: 880px; margin: 0 auto; }
.after .lm-body { margin: 0; }

/* アイキャッチ（あるときだけ。見出しの下に 9:7） */
.article__eyecatch { max-width: var(--measure-article); margin: 0 auto var(--space-5); aspect-ratio: 9 / 7; overflow: hidden; }
.article__eyecatch img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 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 以下：NotesDetailSP ---- */
@media (max-width: 900px) {
  .band { padding: 0 var(--gutter-sp); }
  .article { padding: var(--space-5) var(--gutter-sp) var(--space-6); }
  .article__head { margin: 0 0 var(--space-5); }
  .article__head .lm-h1 { margin: 0; }
  .article__eyecatch { margin: 0 0 var(--space-5); }
  .lm-article { max-width: none; }
  .lm-article p { font-size: 16px; line-height: 2.1; letter-spacing: .04em; margin-bottom: var(--space-3); }
  .lm-article h2 { margin: var(--space-4) 0 var(--space-2); font-size: 18px; line-height: 1.8; letter-spacing: .08em; }
  .lm-article blockquote { margin-bottom: var(--space-3); padding-left: var(--space-2); }
  .lm-article blockquote p { font-size: 15px; }
  .article .lm-pager { display: grid; gap: var(--space-3); justify-items: start; margin-top: var(--space-5); }
  .after-band { padding: var(--space-6) var(--gutter-sp); }
  .after { display: block; }
  .after .lm-body { margin: var(--space-2) 0 var(--space-4); font-size: 14px; }
  .after .lm-btn { display: flex; width: 100%; }

  .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)); }
}