@charset "utf-8";

/* ============================================================
   お知らせ（一覧・カテゴリ・記事）専用スタイル
   ============================================================ */

/* ---------- 一覧 ---------- */
.news-index { padding-bottom: 160px; }

.news-list--page { margin-top: 100px; }

.news-empty {
  margin-top: 110px;
  font-family: var(--f-heading);
  font-size: 20px;
  line-height: 1.4;
  font-weight: 700;
  color: var(--c-ink);
  text-align: center;
}

@media (max-width: 840px) {
  .news-index { padding-bottom: 160px; }
  .news-list--page { margin-top: 80px; }
  .news-empty { margin-top: 90px; font-size: 18px; }
}

/* ---------- 記事ページ ---------- */
.article {
  width: 1000px;
  max-width: calc(100% - 60px);
  margin: 180px auto 0;
}

.article__title {
  font-family: var(--f-heading);
  font-size: 28px;
  line-height: 1.5;
  font-weight: 700;
}

/* 本文中の各要素 */
.article__body { margin-top: 120px; }

.article__body > * + * { margin-top: 39px; }

.article__body p {
  font-size: 16px;
  line-height: 1.8;
}

.article__body h2,
.article__body h3 {
  font-family: var(--f-heading);
  font-size: 20px;
  line-height: 1.8;
  font-weight: 700;
}

/* 区切り線は前を詰めて、後ろを空ける */
.article__body hr {
  height: 0;
  margin: 0;
  border: 0;
  border-top: 1px solid #ccc;
}
.article__body > * + hr { margin-top: 10px; }

.article__body > * + ul { margin-top: 10px; }
.article__body ul { padding-left: 20px; }
.article__body ul li {
  font-size: 16px;
  line-height: 1.4;
}
.article__body ul li + li { margin-top: 10px; }

.article__body ol { padding-left: 1.4em; list-style: decimal; }

.article__body img { margin-inline: auto; }

.article__body figure figcaption {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--c-gray);
  text-align: center;
}

.article__body a {
  color: #007cff;
  text-decoration: underline;
  text-underline-offset: 3px;
  word-break: break-all;
}

/* 画像を2枚横並びにするとき */
.article__figures {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-items: end;
}
.article__figures figure { margin: 0; }

@media (max-width: 840px) {
  .article__figures { grid-template-columns: 1fr; gap: 26px; }
}

/* 記事内の表 */
.article__table {
  width: 780px;
  max-width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 14px;
  line-height: 1.4;
  color: var(--c-dark);
}
.article__table th,
.article__table td {
  padding: 13px 15px;
  background: var(--c-white);
  border: 1px solid var(--c-sage);
  text-align: left;
  vertical-align: top;
  font-weight: 400;
}
.article__table tr > *:first-child { width: 246px; }

.article__table-wrap { overflow-x: auto; }
.article__body > * + .article__table-wrap { margin-top: 0; }

.article__note {
  font-size: 14px;
  line-height: 1.8;
  color: var(--c-gray);
}

.article__end { text-align: right; }

/* 一覧に戻る */
.article__back {
  margin: 40px auto 180px;
  text-align: center;
}
.article__back a {
  display: inline-grid;
  place-items: center;
  width: 280px;
  max-width: 100%;
  height: 60px;
  background: var(--c-gray);
  border-radius: 32px;
  font-family: var(--f-heading);
  font-size: 18px;
  line-height: 1.4;
  color: var(--c-white);
  transition: opacity .2s;
}
.article__back a:hover { opacity: .8; }

@media (max-width: 840px) {
  /* SPでも本文の文字サイズはPCと同じ（元サイトと同様） */
  .article { width: 100%; max-width: calc(100% - 60px); margin-top: 140px; }
  .article__title { font-size: 20px; line-height: 1.5; }
  .article__body { margin-top: 111px; }
  .article__body > * + * { margin-top: 30px; }
  .article__table th,
  .article__table td { padding: 10px 12px; }
  .article__table tr > *:first-child { width: 110px; }
  .article__back { margin: 40px auto 120px; }
  .article__back a { width: 240px; height: 54px; font-size: 16px; }
}