/* コラム（記事・一覧）。色・影・速さは style.css の :root から取る */
.col-page{padding:calc(var(--header-h) + 40px) 0 96px;background:#fff}
.col-container{width:100%;max-width:760px;margin:0 auto;padding:0 20px}
.col-crumb{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--ink-500);margin-bottom:28px}
.col-crumb a{color:var(--brand-700);text-decoration:none}
.col-crumb a:hover{text-decoration:underline}
.col-head{margin-bottom:40px;padding-bottom:28px;border-bottom:1px solid var(--ink-200)}
.col-head h1{font-size:clamp(24px,4vw,34px);font-weight:900;line-height:1.45}
.col-lead{margin-top:14px;color:var(--ink-600)}
.col-meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:16px;font-size:13px;color:var(--ink-500);font-variant-numeric:tabular-nums}
.col-body{font-size:16px;line-height:1.95;color:var(--ink-800)}
.col-body > * + *{margin-top:1.2em}
.col-body h2{margin-top:2.4em;padding-left:14px;border-left:4px solid var(--brand-600);font-size:clamp(20px,2.8vw,24px);font-weight:900}
.col-body h3{margin-top:1.8em;font-size:18px;font-weight:700}
.col-body ul,.col-body ol{padding-left:1.4em}
.col-body ul{list-style:disc}
.col-body ol{list-style:decimal}
.col-body li + li{margin-top:.4em}
.col-body a{color:var(--brand-700);text-underline-offset:3px}
.col-body strong{background:linear-gradient(transparent 62%,var(--brand-100) 62%)}
.col-body table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.7}
.col-body th,.col-body td{border:1px solid var(--ink-200);padding:10px 12px;text-align:left;vertical-align:top}
.col-body th{background:var(--ink-50);font-weight:700;color:var(--ink-900)}
.col-body .col-point{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius);padding:18px 22px}
.col-body .col-point > * + *{margin-top:.6em}
.col-body .col-sources{font-size:14px;color:var(--ink-600)}
.col-cta{margin-top:56px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 28px;border-radius:var(--radius-lg);background:var(--brand-900);color:#cfe5e0;font-size:14px;line-height:1.8}
.col-cta > div{flex:1 1 320px}
.col-cta-title{color:#fff;font-size:18px;font-weight:900;margin-bottom:6px}
.col-back{margin-top:32px;font-size:14px}
.col-back a{color:var(--brand-700)}
.col-list{display:grid;gap:14px}
.col-list a{display:block;padding:22px 24px;border:1px solid var(--ink-200);border-radius:var(--radius);text-decoration:none;transition:border-color var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),transform var(--dur-2) var(--ease)}
.col-list a:hover{border-color:var(--brand-200);box-shadow:var(--shadow-card);transform:translateY(-2px)}
.col-list time{font:600 13px/1 var(--font-en);color:var(--ink-500);font-variant-numeric:tabular-nums}
.col-list h2{margin:10px 0 8px;font-size:18px;font-weight:700}
.col-list p{font-size:14px;color:var(--ink-600);line-height:1.8}
.col-empty{color:var(--ink-500)}
.navigation.pagination{margin-top:32px}
.nav-links{display:flex;gap:8px;flex-wrap:wrap}
.nav-links .page-numbers{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--ink-200);border-radius:10px;text-decoration:none;color:var(--ink-700)}
.nav-links .page-numbers.current{background:var(--brand-600);border-color:var(--brand-600);color:#fff}
@media (max-width:640px){
  .col-container{padding:0 16px}
  .col-page{padding-bottom:72px}
  .col-cta{padding:22px}
  .col-cta .btn{width:100%}
  .col-body table{display:block;overflow-x:auto}
}