/* single-news */

.single-news .site-main {
  background: url(../../images/news/news-bg.webp) repeat center center / 1440px 1296.5px;
}

.l-single-news {
  padding-block: 0 80px;
}

.l-single-news-inner {
  max-width: calc(840 / 1440 * 100cqi);
  margin-inline: auto;
  padding-inline: 20px;
}

/* 記事カード */
.l-single-news-article {
  background-color: var(--umi-color-surface);
  padding: 30px;
}

/* ヘッダー（日付 + タイトル） */
.l-single-news-header {
  padding-bottom: 20px;
  border-bottom: 1px solid #000;
  margin-bottom: 20px;
}

.l-single-news-header__date {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.05em;
  margin-bottom: 10px;
}

.l-single-news-header__title {
  font-size: 28px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;
}

/* 本文 */
.l-single-news-content {
  font-size: 16px;
  line-height: 1.7;
}

.l-single-news-content h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
  padding-left: 16px;
  border-left: 4px solid var(--umi-color-accent);
  margin-block: 32px 16px;
}

.l-single-news-content h3 {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  margin-block: 24px 12px;
}

.l-single-news-content p {
  margin-bottom: 16px;
}

.l-single-news-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin-block: 24px;
  margin-inline: auto;
}

.l-single-news-content a {
  color: var(--umi-color-accent);
  text-decoration: underline;

  &:hover {
    color: #000;
    text-decoration: none;
  }
}

.l-single-news-content strong {
  font-weight: 700;
}

/* BACKボタン */
.l-single-news-back {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

/* SP */
@media (max-width: 767px) {
  .l-single-news {
    padding-block: 0 88px;
  }

  .l-single-news-inner {
    max-width: 100%;
    padding-inline: 20px;
  }

  .l-single-news-article {
    padding: 30px;
  }

  .l-single-news-back {
    margin-top: 60px;
  }
}