/* おすすめサイト紹介（/links/）。1件＝画像 → サイト名 → 紹介文 → 文字リンク の縦積み */
/* .page の padding 指定が .wrap の左右余白を消すので、このページでは戻す */
.wrap.page.lk-page { padding-left: 20px; padding-right: 20px; }

.lk-cta {
  background: var(--surface); border-radius: 8px; padding: 14px 18px; margin: 18px 0 0;
  display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.page .lk-cta p { margin: 0; font-size: 14.5px; }
.lk-cta a { color: var(--brand); font-weight: 700; white-space: nowrap; }

.lk-toc { border: 1px solid var(--line); border-radius: 8px; padding: 14px 18px; margin: 18px 0 0; }
.lk-toc b { font-size: 13px; color: var(--sub); }
.page .lk-toc ol { margin: 4px 0 0; padding-left: 1.6em; columns: 2; column-gap: 28px; }
.page .lk-toc li { font-size: 14.5px; line-height: 1.9; margin-bottom: 0; break-inside: avoid; }
.lk-toc a { color: var(--brand); }

.page .lk-list { list-style: none; margin: 40px 0 0; padding: 0; }
.page .lk-list > li { padding: 0 0 40px; margin: 0 0 40px; border-bottom: 1px solid var(--line); }
.page .lk-list > li:last-child { border-bottom: 0; margin-bottom: 0; }
.lk__img {
  display: block; border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
  aspect-ratio: 16 / 10; background: #F3F4F6; transition: border-color .15s, box-shadow .15s;
}
.lk__img:hover { border-color: var(--brand); box-shadow: var(--shadow); }
.lk__img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.page .lk-list h2 {
  font-size: 21px; line-height: 1.5; margin: 18px 0 6px; padding-left: 0; border-left: 0;
}
.lk-list h2 small { display: block; font-size: 13.5px; font-weight: 700; color: var(--brand); margin-top: 2px; }
.page .lk-list p { margin: 0 0 14px; }
.lk__go {
  color: var(--brand); font-weight: 700; font-size: 15px;
  text-decoration: underline; text-underline-offset: 3px;
}
.lk__go::after { content: " ↗"; font-weight: 400; }
.lk__go:hover { color: var(--action); }

.lk-about { margin-top: 8px; padding-top: 36px; border-top: 2px solid var(--text); }
.page .lk-about h2 { margin-top: 0; }

@media (max-width: 600px) {
  .page .lk-toc ol { columns: 1; }
}
