/* Diver MAX — 関連記事（カード型）。Diver の記事本文と子テーマ（MAX UI）に馴染む控えめな見た目。
 * トーン: 角丸 12px、影 0 8px 24px rgba(0,0,0,.08)、フォントはサイトの設定を継承。色は front.css の変数を使う。
 */
.dm-related{margin:2.5em 0 1.5em;clear:both;font:inherit}
.dm-related-title{font:inherit;font-size:1.1em;font-weight:700;color:inherit;margin:0 0 1em;padding:0 0 .5em;border-bottom:1px solid var(--dmf-line,#E4E8EE);line-height:1.5;background:none}
.dm-related-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.dm-related-item{margin:0;padding:0;min-width:0}
.dm-related-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--dmf-ink,inherit);background:var(--dmf-surface,#fff);border:1px solid var(--dmf-line,#E4E8EE);border-radius:var(--dmf-radius,12px);overflow:hidden;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s cubic-bezier(.2,.7,.2,1)}
.dm-related-link:hover{transform:translateY(-3px);box-shadow:var(--dmf-shadow,0 8px 24px rgba(0,0,0,.08));text-decoration:none;color:var(--dmf-ink,inherit)}
.dm-related-link:focus-visible{outline:2px solid var(--dmf-accent,#5B5BD6);outline-offset:2px}
.dm-related-thumb{display:block;position:relative;aspect-ratio:16/9;background:var(--dmf-surface-2,#F1F3F6);overflow:hidden}
.dm-related-thumb img{width:100%;height:100%;object-fit:cover;display:block;margin:0;border-radius:0;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.dm-related-link:hover .dm-related-thumb img{transform:scale(1.04)}
.dm-related-thumb-none::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--dmf-surface-2,#F1F3F6),var(--dmf-surface,#fff))}
.dm-related-body{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px}
.dm-related-name{font-weight:700;font-size:.92em;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dm-related-date{font-size:.78em;color:var(--dmf-muted,#7B8794);margin-top:auto}
@media (max-width:767px){
  .dm-related-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .dm-related-body{padding:10px 12px 12px}
}
@media (max-width:420px){
  .dm-related-list{grid-template-columns:1fr}
  .dm-related-link{flex-direction:row;align-items:stretch}
  .dm-related-thumb{flex:0 0 38%;aspect-ratio:4/3}
  .dm-related-body{flex:1;justify-content:center}
}
/* 自動内部リンク */
a.dm-auto-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}