/* 会社サイト コラム共通（トップの index.html と同じ色・字体） */
:root {
  --navy:#14245e; --ink:#0b1233; --accent:#ec5a23; --gold:#ffce00; --green:#2F7D4E;
  --paper:#f7f5f0; --line:#e7e4db; --line-cool:#e3e6ef;
  --text:#272a34; --muted:#5d6170; --on-dark-muted:#b9c1dd;
  --serif:"Shippori Mincho","Hiragino Mincho ProN",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --shadow-card:0 2px 6px rgba(20,36,94,.05), 0 14px 34px rgba(20,36,94,.08);
}
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:var(--sans); color:var(--text); background:#fff; line-height:1.95; font-size:16.5px; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:var(--navy); }
.wrap { max-width:820px; margin:0 auto; padding-left:max(22px, env(safe-area-inset-left, 0px)); padding-right:max(22px, env(safe-area-inset-right, 0px)); }

header.top { position:sticky; top:0; z-index:50; background:rgba(11,18,51,.88); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); color:#fff; padding-block:12px; border-bottom:1px solid rgba(255,255,255,.08); }
header.top .wrap { display:flex; align-items:center; justify-content:space-between; gap:14px; max-width:1020px; }
.brand { font-weight:900; font-size:15.5px; letter-spacing:.04em; line-height:1.4; color:#fff; text-decoration:none; }
.brand small { display:block; font-weight:500; font-size:10.5px; color:var(--on-dark-muted); letter-spacing:.14em; }
nav.top-nav { display:flex; gap:4px 18px; flex-wrap:wrap; justify-content:flex-end; }
nav.top-nav a { color:#fff; text-decoration:none; font-weight:700; font-size:13px; white-space:nowrap; }

main.article { padding-block:40px 64px; }
.crumb { font-size:13px; color:var(--muted); margin-bottom:18px; }
.crumb a { color:var(--muted); }
.tag { display:inline-block; font-size:12px; font-weight:700; letter-spacing:.12em; color:var(--accent); border:1px solid var(--accent); border-radius:99px; padding:2px 12px; margin-bottom:12px; }
h1 { font-family:var(--serif); font-weight:800; color:var(--navy); font-size:clamp(23px,3.8vw,34px); line-height:1.55; letter-spacing:.02em; margin-bottom:10px; text-wrap:balance; }
.meta { font-size:13.5px; color:var(--muted); margin-bottom:30px; padding-bottom:18px; border-bottom:1px solid var(--line); }
main p { margin-bottom:20px; }
h2 { font-family:var(--serif); font-weight:700; color:var(--navy); font-size:clamp(20px,3vw,26px); line-height:1.5; margin:44px 0 14px; padding-left:14px; border-left:5px solid var(--accent); }
h2.small { font-size:17px; margin-top:40px; }
main ul { padding-left:1.3em; margin-bottom:20px; }
main li { margin-bottom:8px; }
.note { font-size:13.5px; color:var(--muted); }

.kekka { border:2px solid var(--green); background:#EDF5EE; border-radius:14px; padding:20px 22px 8px; margin:24px 0 8px; }
.kekka h2 { margin:0 0 10px; border-left:0; padding-left:0; color:var(--green); font-size:19px; }
.kekka li { font-size:15.5px; }

.tablewrap { overflow-x:auto; margin:8px 0 24px; -webkit-overflow-scrolling:touch; }
table.cmp { border-collapse:collapse; min-width:860px; width:100%; font-size:13.5px; line-height:1.7; background:#fff; border:1px solid var(--line-cool); }
table.cmp th, table.cmp td { border:1px solid var(--line-cool); padding:10px 12px; vertical-align:top; text-align:left; min-width:0; }
table.cmp thead th { background:var(--navy); color:#fff; font-weight:700; white-space:nowrap; }
table.cmp tbody th { background:var(--paper); color:var(--navy); font-weight:700; width:9em; white-space:nowrap; }
table.cmp td.s { background:#EDF5EE; }
table.cmp td.w { background:#FBEDE6; }

.cost { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; margin:8px 0 10px; }
.cost .c { background:#fff; border:1.5px solid var(--line-cool); border-radius:14px; box-shadow:var(--shadow-card); padding:18px 18px 10px; min-width:0; }
.cost .n { font-size:13px; font-weight:700; color:var(--accent); letter-spacing:.08em; }
.cost .v { font-family:var(--serif); font-size:24px; font-weight:800; color:var(--navy); margin:4px 0 8px; font-variant-numeric:tabular-nums; }
.cost p { font-size:13.5px; color:var(--text); margin-bottom:8px; }

.cta { background:linear-gradient(160deg,var(--ink) 0%,var(--navy) 80%); color:#fff; border-radius:16px; padding:28px 26px; margin:40px 0 24px; text-align:center; }
.cta h2 { color:#fff; border-left:0; padding-left:0; margin:0 0 10px; text-align:center; }
.cta p { color:rgba(255,255,255,.88); font-size:15px; max-width:600px; margin:0 auto 18px; }
.btns { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-weight:800; font-size:14.5px; padding:12px 22px; border-radius:99px; border:2px solid #fff; color:#fff; }
.btn.line { background:#06C755; border-color:#06C755; }

ul.src { font-size:13px; color:var(--muted); }
ul.src li { margin-bottom:4px; }

.list { display:grid; gap:16px; margin-top:24px; }
.card { display:block; text-decoration:none; background:#fff; border:1.5px solid var(--line-cool); border-radius:14px; box-shadow:var(--shadow-card); padding:20px 22px; color:var(--text); }
.card .tag { margin-bottom:6px; }
.card h3 { font-family:var(--serif); color:var(--navy); font-size:19px; line-height:1.5; margin-bottom:6px; }
.card p { font-size:14.5px; margin:0; }
.card .date { font-size:13px; color:var(--muted); margin-top:8px; }

footer { background:var(--ink); color:var(--on-dark-muted); font-size:13px; padding-block:28px; }
footer .wrap { display:grid; gap:8px; }
footer a { color:#fff; text-decoration:none; }
footer .links { display:flex; gap:6px 14px; flex-wrap:wrap; }

@media (max-width:760px) {
  .cost { grid-template-columns:1fr; }
  header.top .wrap { flex-direction:column; align-items:flex-start; gap:8px; }
  nav.top-nav { justify-content:flex-start; }
}