/* 学習記事の、ブログの記事のスタイルに足りない部分だけ。 */
.learn-article .prose img { box-shadow:none; border-radius:8px; }
.learn-article .prose figcaption { color:var(--text-sub); font-size:.9rem; line-height:1.6; }
.learn-article .learn-portrait { max-width:340px; margin:0 auto 2em; }
.learn-article .learn-wide { max-width:880px; margin:0 auto 2em; }
.learn-article .learn-pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:2em 0; }
.learn-article .learn-pair figure { margin:0; min-width:0; }
.learn-article .learn-pair img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
.learn-article .learn-screen { max-width:300px; margin:2em auto; }
.learn-article .learn-screen img { border:1px solid var(--line); }

.learn-foot { max-width:780px; margin:48px auto 0; padding-top:32px; border-top:1px solid var(--line); }
.learn-cta { text-align:center; margin:0 0 28px; }
.learn-cta .btn-primary { background:var(--cyan-text); font-size:1rem; }
.learn-pager { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 24px; }
.learn-pager a { display:block; min-width:0; padding:14px 16px; border:1px solid var(--line); border-radius:8px; color:var(--text-main); text-decoration:none; line-height:1.55; background:#fff; }
.learn-pager a:hover, .learn-pager a:focus-visible { border-color:var(--cyan-text); }
.learn-pager .next { grid-column:2; text-align:right; }
.learn-pager small { display:block; font-size:.85rem; color:var(--text-sub); margin-bottom:2px; }
.learn-back { text-align:center; margin:0; }
.learn-back a { color:var(--cyan-text); text-decoration:underline; text-underline-offset:3px; }

@media (max-width:640px) {
  .learn-pager { grid-template-columns:1fr; }
  .learn-pager .next { grid-column:auto; }
}
