/* ============================================================
   KoKo+navi 社福LIBRARY（ブログ一覧）共通スタイル
   既存のホームページ/セキュリティページとトークン共有
   ============================================================ */

:root{
  --navy-900:#0f1d36;
  --navy-800:#17284a;
  --navy-700:#223550;
  --navy-600:#2c4570;
  --blue-500:#3e6aa8;
  --blue-400:#5282ca;
  --blue-50:#eef3fa;
  --blue-25:#f7faff;
  --gold-600:#b48a3a;
  --gold-500:#c9a24a;
  --gold-400:#d9b85e;
  --gold-50:#f8f2e3;
  --accent:#c2453a;
  --accent-dark:#9e352c;
  --ink-900:#14213d;
  --ink-700:#2c3a55;
  --ink-500:#5a6478;
  --ink-300:#9aa3b5;
  --ink-200:#c3cad6;
  --line:#dfe5ef;
  --line-soft:#eaeef6;
  --bg:#fafbfd;
  --paper:#f6f3ec;
  --white:#ffffff;
  --shadow-sm:0 1px 2px rgba(15,29,54,.04), 0 2px 8px rgba(15,29,54,.04);
  --shadow-md:0 4px 16px rgba(15,29,54,.08);
  --shadow-lg:0 12px 40px rgba(15,29,54,.12);
  --radius:6px;
  --radius-lg:12px;
  --serif:"Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --sans:"Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --num:"Inter","Noto Sans JP",sans-serif;
}

.library-page *,
.library-page *::before,
.library-page *::after{box-sizing:border-box}
.library-page{
  font-family:var(--sans);
  font-size:15px;
  color:var(--ink-900);
  background:var(--white);
  line-height:1.85;
  font-feature-settings:"palt";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  word-break:normal;
  overflow-wrap:anywhere;
  line-break:strict;
  width:100%;
}
.library-page img,
.library-page svg{display:block;max-width:100%}
.library-page a{color:inherit;text-decoration:none}
.library-page p{margin:0}
.library-page h1,
.library-page h2,
.library-page h3,
.library-page h4{margin:0;font-weight:700;letter-spacing:.02em}
.library-page ul{margin:0;padding:0;list-style:none}
.library-page button{font-family:inherit;cursor:pointer}

.lib-container{
  max-width:1200px;margin:0 auto;padding:0 32px;
}

/* ============== Utility bar ============== */
.lib-utility{background:var(--navy-900);color:#cfd7e6;font-size:12px}
.lib-utility-inner{
  max-width:1200px;margin:0 auto;padding:8px 32px;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.lib-utility a{color:#e6ecf5}
.lib-utility .u-contact{display:flex;gap:20px;align-items:center}
.lib-utility .u-tel{font-family:var(--num);font-weight:700;letter-spacing:.04em}

/* ============== Header ============== */
.lib-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.96);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.lib-header-inner{
  max-width:1200px;margin:0 auto;padding:14px 32px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.lib-brand{display:flex;align-items:baseline;gap:10px}
.lib-brand-mark{
  font-family:var(--serif);font-weight:700;font-size:22px;color:var(--navy-800);
  letter-spacing:.02em;
}
.lib-brand-mark .plus{color:var(--accent);font-weight:700;margin:0 1px}
.lib-nav{display:flex;gap:30px;font-size:14px}
.lib-nav a{color:var(--ink-700);font-weight:500;transition:color .2s;padding:6px 0;position:relative}
.lib-nav a:hover{color:var(--blue-500)}
.lib-nav a.current{color:var(--navy-800);font-weight:700}
.lib-nav a.current::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold-500);
}
.lib-header-cta{display:flex;gap:12px;align-items:center}
.lib-btn-ghost{
  font-size:13px;color:var(--ink-700);padding:11px 16px;border:1px solid var(--line);
  border-radius:var(--radius);font-weight:600;background:#fff;
}
.lib-btn-ghost:hover{border-color:var(--navy-700);color:var(--navy-700)}
.lib-btn-cta{
  font-size:13px;color:#fff;background:var(--accent);
  padding:12px 18px;border-radius:var(--radius);font-weight:700;letter-spacing:.04em;
  transition:background .2s;
}
.lib-btn-cta:hover{background:var(--accent-dark)}

/* ============== Breadcrumb ============== */
.lib-breadcrumb{
  background:var(--bg);border-bottom:1px solid var(--line);
  font-size:12px;color:var(--ink-500);
}
.lib-breadcrumb-inner{
  max-width:1200px;margin:0 auto;padding:13px 32px;
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;letter-spacing:.04em;
}
.lib-breadcrumb a{color:var(--ink-500)}
.lib-breadcrumb a:hover{color:var(--blue-500)}
.lib-breadcrumb .sep{color:var(--ink-300)}
.lib-breadcrumb .current{color:var(--navy-800);font-weight:600}

/* ============== Footer ============== */
.lib-footer{background:#0a1529;color:#8f9ab1;padding:56px 0 32px;font-size:13px}
.lib-footer-inner{
  display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:48px;
  padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.08);
}
.lib-footer-brand .lib-brand-mark{color:#fff;font-size:24px}
.lib-footer-brand .brand-desc{margin-top:14px;font-size:12.5px;color:#8f9ab1;line-height:2}
.lib-footer h5{color:#fff;font-size:13px;font-weight:600;margin-bottom:16px;letter-spacing:.08em}
.lib-footer ul li{margin-bottom:10px;font-size:12.5px}
.lib-footer ul a:hover{color:#fff}
.lib-footer-bottom{
  padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;
  font-size:11.5px;color:#5a6478;
}
.lib-footer-bottom a{color:#8f9ab1}
.lib-footer-bottom a:hover{color:#fff}

/* ============== Common: section eyebrow / title ============== */
.lib-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--num);font-size:11px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--blue-500);
}
.lib-eyebrow::before{content:"";width:28px;height:1.5px;background:currentColor;flex-shrink:0}
.lib-eyebrow.gold{color:var(--gold-600)}

/* ============== Common: category palette (subtle, used as thin accent only) ============== */
.cat-corp { --cat-color: var(--navy-700); --cat-soft: #e7eaf2; --cat-label:"社会福祉法人"; }
.cat-news { --cat-color: var(--blue-500); --cat-soft: var(--blue-50); --cat-label:"お知らせ"; }
.cat-blog { --cat-color: var(--ink-500); --cat-soft: #eef0f4; --cat-label:"ブログ"; }
.cat-explain { --cat-color: var(--gold-600); --cat-soft: var(--gold-50); --cat-label:"解説"; }
.cat-dl { --cat-color: var(--accent); --cat-soft: #f9e7e5; --cat-label:"資料DL"; }

/* ============== Common pagination ============== */
.lib-pagination{
  display:flex;align-items:center;justify-content:center;gap:6px;margin-top:48px;
}
.lib-pagination a, .lib-pagination span{
  min-width:38px;height:38px;padding:0 10px;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--num);font-size:13px;font-weight:600;color:var(--ink-500);
  border:1px solid var(--line);border-radius:4px;background:#fff;
}
.lib-pagination a:hover{border-color:var(--navy-700);color:var(--navy-800)}
.lib-pagination .current{background:var(--navy-800);color:#fff;border-color:var(--navy-800)}
.lib-pagination .step{padding:0 14px;font-size:12px}