/* ===== news-list ===== */
.news-sec{padding-top:36px}
.news-grid{row-gap:56px}
.ncard{display:block;color:inherit}
.ncard:hover .ncard__title{color:#000}

/* gradient + how-logo placeholder thumbnail */
.ncard__img--ph{
  background:linear-gradient(120deg,#dfe6f2,#efe2ef 40%,#f6efe0 70%,#e2eff0);
  position:relative;
}
.ncard__img--ph::after{
  content:"";position:absolute;inset:0;
  background:url("../images/logo-mu.png") no-repeat center/70px;opacity:.5;
}

/* ===== pagination ===== */
.pager{display:flex;justify-content:center;gap:18px;margin-top:64px}
.pager__num{
  width:42px;height:42px;border-radius:50%;
  border:1px solid #cfcfca;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--latin);font-size:14px;color:#9a9a95;transition:.2s;
}
.pager__num.is-current{border-color:#2b2b2b;color:#2b2b2b}
.pager__num:hover{border-color:#2b2b2b;color:#2b2b2b}

/* ===== mobile (SP) ===== */
@media(max-width:820px){
  /* page hero: shrink oversized latin title so it fits */
  .page-hero{padding:28px 22px 6px}
  .page-hero__title{font-size:30px;letter-spacing:.10em}
  .page-hero__sub{margin-top:10px;font-size:13px}

  /* news list: single full-width column, tighter vertical rhythm */
  .news-sec{padding-top:24px}
  .news-grid{row-gap:34px}
  .ncard__img{aspect-ratio:16/10;margin-bottom:12px}
  .ncard__meta{font-size:11px;margin-bottom:6px}
  .ncard__title{font-size:14px;line-height:1.7}
  .ncard__img--ph::after{background-size:60px}

  /* pagination: keep centered, fit and shrink */
  .pager{gap:14px;margin-top:40px}
  .pager__num{width:38px;height:38px;font-size:13px}
}