/* お知らせ：小さな画像と日付・分類・見出しをまとめた一覧。 */
.newsp-list {
 padding-bottom: var(--space-7);
 scroll-margin-top: calc(var(--space-12) + var(--space-4));
 background-color: var(--color-bg);
 background-image: url("../../img/bg_top-concrete.webp");
}
.newsp-list__inner { max-width: calc(var(--space-13) * 8 + var(--space-9)); padding-inline: var(--space-5); }
.newsp-list__items { border-top: 1px solid var(--color-border); }
.newsp-list__item { border-bottom: 1px solid var(--color-border); }
.newsp-list__link { display: flex; align-items: center; gap: var(--space-4); min-height: var(--space-11); padding: var(--space-4) 0; }
.newsp-list__thumb { flex: none; width: var(--space-10); height: var(--space-10); overflow: hidden; border-radius: var(--radius-sm); }
.newsp-list__thumb img { width: 100%; height: 100%; object-fit: cover; }
.newsp-list__body { display: grid; flex: 1; min-width: 0; grid-template-columns: auto minmax(0,1fr); gap: var(--space-1) var(--space-4); }
.newsp-list__date { font-size: var(--fs-body-sm); color: var(--color-text-muted); line-height: var(--lh-body); white-space: nowrap; }
.newsp-list__category { font-size: var(--fs-body-sm); color: var(--color-primary); line-height: var(--lh-body); }
.newsp-list__heading { grid-column: 1 / -1; font-size: var(--fs-body-pc); line-height: var(--lh-body); overflow-wrap: anywhere; }
.newsp-list__more { flex: none; width: var(--space-2); height: var(--space-2); margin-inline: var(--space-1); border-top: 1px solid var(--color-primary); border-right: 1px solid var(--color-primary); transform: rotate(45deg); }
.newsp-list__link:hover .newsp-list__heading { color: var(--color-primary); text-decoration: underline; text-underline-offset: var(--space-1); }
.newsp-list__link:focus-visible { outline: 2px solid var(--color-primary); outline-offset: var(--space-1); }
.newsp-list__empty { padding-block: var(--space-9); text-align: center; }
.newsp-list__clear { display: inline-flex; align-items: center; min-height: var(--space-9); margin-top: var(--space-4); color: var(--color-primary); border-bottom: 1px solid; }
@media (min-width:768px) {
 .newsp-list__inner { padding-inline: var(--space-6); }
 .newsp-list__link { gap: var(--space-5); }
}
@media (max-width:374px) {
 .newsp-list__thumb { width: var(--space-9); height: var(--space-9); }
 .newsp-list__link { gap: var(--space-3); }
 .newsp-list__body { column-gap: var(--space-2); }
}
