/* お知らせ一覧・詳細 */

.page-news .global-nav__list > li > a.is-current {
  box-shadow: inset 0 -3px 0 #337ab7;
}

/* トップ「お知らせ」と同じトークン（top.css の .news-list が参照） */
.page-news {
  --news-ink: #221815;
  --news-tag-bg: #221815;
  --news-rule: rgba(34, 24, 21, 0.22);
  --news-tag-pill-width: 160px;
  --news-title-font: "zen-maru-gothic", sans-serif;
}

.news-main {
  padding: 40px 0 72px;
}

.news-main--article {
  padding-bottom: 64px;
}

/* カテゴリタブ */
.news-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 0 auto 36px;
  max-width: 720px;
}

@media (min-width: 768px) {
  .news-tabs {
    grid-template-columns: repeat(4, 1fr);
    max-width: none;
    margin-bottom: 40px;
  }
}

.news-tabs__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 10px 12px;
  border: none;
  border-radius: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  color: var(--color-text);
  background: #e8e8e8;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.news-tabs__btn:hover {
  background: #dedede;
}

.news-tabs__btn.is-active {
  background: #337ab7;
  color: #ffffff;
}

.news-tabs__btn.is-active:hover {
  background: #2e6da4;
  color: #ffffff;
}

a.news-tabs__btn {
  text-decoration: none;
}

/* SP：長いラベルのカテゴリタブをグリッド内に収める */
@media (max-width: 767px) {
  .page-news .news-tabs__btn {
    min-height: 44px;
    padding: 8px 10px;
    font-size: 14px;
    line-height: 1.3;
  }
}

/* 一覧：マークアップは top.css の .news-list に合わせる */
.news-main__archive {
  max-width: 850px;
  margin-inline: auto;
  width: 100%;
  --news-rule: rgba(34, 24, 21, 0.22);
}

.news-archive__item.is-hidden {
  display: none;
}

/* 協会・施設共通。施設は main.yb-archive--news で詳細度を上げる（施設 CSS より確実に効かせる） */
.news-main__archive ul.news-list > li.news-archive__item,
main.yb-archive--news .news-main__archive ul.news-list > li.news-archive__item {
  border-top: none;
  border-bottom: 1px solid rgba(34, 24, 21, 0.22);
  border-bottom: 1px solid var(--news-rule, rgba(34, 24, 21, 0.22));
}

/* 先頭の DOM 上の li が is-hidden でも、一覧の上端に罫線が出る */
.page-news .news-main__archive .news-list {
  border-top: 1px solid var(--news-rule);
}

.page-news .news-main__archive .news-list > li:first-child {
  border-top: none;
}

.news-main__filter-empty {
  margin: 0;
  padding: 20px 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--news-ink);
}

/* ページネーション */
.news-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 20px;
  margin-top: 48px;
  font-size: 15px;
  color: var(--color-muted);
}

.news-pager a {
  color: var(--color-text);
  text-decoration: none;
}

.news-pager a:hover {
  text-decoration: underline;
}

.news-pager__sep {
  margin: 0 4px;
  color: #999999;
}

.news-pager [aria-current="page"] {
  font-weight: 700;
  color: #337ab7;
  pointer-events: none;
}

/* 詳細：記事ヘッダ */
.news-article {
  max-width: 800px;
  margin-inline: auto;
}

.news-article__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin-bottom: 16px;
}

.news-article__tag {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  background: #4a3c38;
  color: #ffffff;
}

.news-article__date {
  font-size: 16px;
  color: var(--color-muted);
  font-variant-numeric: tabular-nums;
}

.news-article__title {
  margin: 0 0 24px;
  font-size: clamp(20px, 4vw, 26px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

.news-article__divider {
  margin: 0 0 32px;
  border: none;
  border-top: 1px solid #dddddd;
}

.news-article__body {
  font-size: 15px;
  line-height: 1.9;
}

.news-article__body p {
  margin: 0 0 1.5em;
}

.news-article__body p:last-child {
  margin-bottom: 0;
}

.news-article__figure {
  margin: 32px 0 0;
  text-align: center;
}

.news-article__placeholder {
  aspect-ratio: 16 / 9;
  max-height: 420px;
  margin-inline: auto;
  background: #e0e0e0;
  border-radius: 4px;
}

.news-article__back-wrap {
  margin-top: 48px;
  text-align: center;
}

.btn-back-list {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 40px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  color: #ffffff;
  background: #3a2e2a;
  transition: opacity 0.2s;
}

.btn-back-list:hover {
  text-decoration: none;
  opacity: 0.92;
  color: #ffffff;
}

/* ---------- 施設 yb_news / yb_event：協会お知らせと同型（タブ・アクセントは各施設の --psg-pink） ---------- */
.yb-archive--news,
.yb-archive--event,
.yb-single.yb-single--news {
  --news-ink: #221815;
  --news-tag-bg: var(--psg-brown, #3a2e2a);
  --news-rule: rgba(34, 24, 21, 0.22);
  --news-tag-pill-width: 160px;
  --news-title-font: "zen-maru-gothic", sans-serif;
}

.yb-archive--news .news-main--facility-archive,
.yb-archive--event .news-main--facility-archive,
.yb-facility-single.yb-single--news .news-main.news-main--facility-single {
  padding: 0;
  margin: 0;
}

.yb-archive--news .news-tabs--fac3,
.yb-archive--event .news-tabs--fac3,
.yb-single.yb-single--news .news-tabs--fac3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 36px;
  max-width: none;
}

@media (min-width: 768px) {
  .yb-archive--news .news-tabs--fac3,
  .yb-archive--event .news-tabs--fac3,
  .yb-single.yb-single--news .news-tabs--fac3 {
    margin-bottom: 40px;
  }
}

@media (max-width: 767px) {
  /* 施設お知らせ・イベント：SP でもタブは 3 列横並び（スクショ準拠） */
  .yb-archive--news .news-tabs--fac3,
  .yb-archive--event .news-tabs--fac3,
  .yb-single.yb-single--news .news-tabs--fac3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .yb-archive--news .news-tabs--fac3 .news-tabs__btn,
  .yb-archive--event .news-tabs--fac3 .news-tabs__btn,
  .yb-single.yb-single--news .news-tabs--fac3 .news-tabs__btn {
    min-height: 44px;
    padding: 8px 6px;
    font-size: 13px;
    line-height: 1.25;
  }
}

.yb-archive--news .news-tabs__btn.is-active,
.yb-archive--event .news-tabs__btn.is-active,
.yb-single.yb-single--news .news-tabs__btn.is-active {
  background: var(--psg-pink, #337ab7);
  color: #ffffff;
}

.yb-archive--news .news-tabs__btn.is-active:hover,
.yb-archive--event .news-tabs__btn.is-active:hover,
.yb-single.yb-single--news .news-tabs__btn.is-active:hover {
  background: var(--psg-pink-dark, #2e6da4);
  color: #ffffff;
}

.yb-archive--news .news-main__archive .news-list {
  border-top: 1px solid var(--news-rule, rgba(34, 24, 21, 0.22));
}

.yb-archive--news .news-main__archive .news-list > li:first-child {
  border-top: none;
}

.yb-archive--news .news-main__filter-empty.yb-facility-news-empty {
  color: var(--news-ink);
}

.yb-archive--news .news-pager [aria-current="page"] {
  color: var(--psg-pink-dark, #337ab7);
}

.yb-single.yb-single--news .news-article__tag {
  background: var(--news-tag-bg, #4a3c38);
}

.yb-single.yb-single--news .btn-back-list {
  background: var(--psg-brown, #3a2e2a);
}

.yb-single.yb-single--news .news-article__divider {
  border-top-color: var(--news-rule);
}

.yb-single.yb-single--news .news-article__title {
  color: var(--news-ink);
}

/* SP：お知らせ一覧・詳細でカテゴリタグが長いとき日付と重ならないよう折返し */
@media (max-width: 767px) {
  .page-news .news-list__meta,
  .yb-archive--news .news-list__meta {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px 12px;
    column-gap: 12px;
  }

  .page-news .news-list__tag,
  .yb-archive--news .news-list__tag {
    width: auto;
    min-width: 0;
    max-width: calc(100% - 7.5rem);
    flex: 1 1 auto;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    justify-content: center;
    word-break: break-word;
    hyphens: auto;
  }

  .page-news .news-list__date,
  .yb-archive--news .news-list__date {
    flex: 0 0 auto;
    margin-left: 0;
  }

  .page-news .news-article__meta,
  .yb-facility-single.yb-single--news .news-article__meta {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px 12px;
  }

  .page-news .news-article__tag,
  .yb-facility-single.yb-single--news .news-article__tag {
    max-width: calc(100% - 7.5rem);
    flex: 1 1 auto;
    white-space: normal;
    text-align: center;
    line-height: 1.35;
    word-break: break-word;
  }

  .page-news .news-article__date,
  .yb-facility-single.yb-single--news .news-article__date {
    flex: 0 0 auto;
  }

  /* ページ送りを中央に整理 */
  .page-news .news-pager .navigation,
  .yb-archive--news .news-pager .navigation,
  .yb-archive--event .news-pager .navigation {
    width: 100%;
  }

  .page-news .news-pager .nav-links,
  .yb-archive--news .news-pager .nav-links,
  .yb-archive--event .news-pager .nav-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 14px;
  }

  .page-news .news-pager a.page-numbers,
  .page-news .news-pager span.page-numbers,
  .yb-archive--news .news-pager a.page-numbers,
  .yb-archive--news .news-pager span.page-numbers,
  .yb-archive--event .news-pager a.page-numbers,
  .yb-archive--event .news-pager span.page-numbers {
    min-width: 1.25em;
    text-align: center;
  }
}