/* =============================================
   News Detail Page
   ============================================= */

/* -- Layout -- */
.news-detail {
  width: 100%;
  background-color: #fff;
}
.news-detail__inner {
  display: flex;
  flex-direction: column;
  gap: 2.67vw;
  padding: 13.87vw 16.8vw 5.33vw;
}

/* -- Article Header -- */
.news-detail__header {
  display: flex;
  flex-direction: column;
  gap: 1.2vw;
}
.news-detail__meta {
  display: flex;
  align-items: center;
  gap: 0.6vw;
  min-width: 0;
}
.news-detail__date {
  flex-shrink: 0;
  color: #242426;
  font-family: Figtree, sans-serif;
  font-size: 0.87vw;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0.05em;
}
.news-detail__category {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 24vw;
  min-width: 0;
  padding: 0.07vw 0.47vw 0.2vw;
  overflow: hidden;
  background-color: #0b50ae;
  border-radius: 0.27vw;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.8vw;
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0.05em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.news-detail__title {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2.53vw;
  font-weight: 900;
  line-height: 1.45;
  letter-spacing: 0.05em;
  overflow-wrap: anywhere;
}
.legal-page__header {
  gap: 0;
}
.legal-page__header .section-header__eyebrow {
  margin-bottom: 1vw;
}
.news-card__separator {
  display: block;
  width: 100%;
  height: 1px;
  background-color: #dcdcdc;
}

/* -- Hero Image -- */
.news-detail__hero {
  margin: 0;
}
.news-detail__hero-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.33vw;
  object-fit: cover;
}

/* -- Article Body -- */
.news-detail__body {
  display: flex;
  flex-direction: column;
  gap: 1.67vw;
}
.news-detail__section {
  display: flex;
  flex-direction: column;
  gap: 1.67vw;
}
.news-detail__body h1 {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2.8vw;
  font-weight: 900;
  line-height: 1.45;
  letter-spacing: 0.05em;
  overflow-wrap: anywhere;
}
.news-detail__body h2 {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2.4vw;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.05em;
}
.news-detail__body h3 {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 2vw;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.05em;
}
.news-detail__body h4 {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.6vw;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.05em;
}
.news-detail__body h5,
.news-detail__body h6 {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.05em;
}
.news-detail__body h5 {
  font-size: 1.33vw;
}
.news-detail__body h6 {
  font-size: 1.13vw;
}
.news-detail__body p {
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.07vw;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.05em;
  overflow-wrap: anywhere;
}
.news-detail__body a {
  color: #0b50ae;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  overflow-wrap: anywhere;
}
.news-detail__body ul,
.news-detail__body ol {
  display: flex;
  flex-direction: column;
  gap: 0.47vw;
  padding-left: 1.6vw;
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.07vw;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
.news-detail__body ul ul,
.news-detail__body ul ol,
.news-detail__body ol ul,
.news-detail__body ol ol {
  margin-top: 0.47vw;
}
.news-detail__body li {
  overflow-wrap: anywhere;
}
.news-detail__body blockquote {
  padding: 1.33vw 1.6vw;
  margin: 0;
  background-color: #f6f7f9;
  border-left: 0.27vw solid #0b50ae;
  border-radius: 0.33vw;
}
.news-detail__body blockquote > * + * {
  margin-top: 0.8vw;
}
.news-detail__body code {
  padding: 0.13vw 0.4vw;
  background-color: #f6f7f9;
  border-radius: 0.27vw;
  font-family: monospace;
  font-size: 0.93em;
}
.news-detail__body mark {
  padding: 0.07vw 0.2vw;
  background-color: #fff1a8;
}
.news-detail__body img,
.news-detail__body iframe,
.news-detail__body video {
  max-width: 100%;
  height: auto;
}
.news-detail__body figure,
.news-detail__body .wp-caption {
  max-width: 100%;
  margin-right: 0;
  margin-left: 0;
}
.news-detail__body figure img,
.news-detail__body .wp-caption img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}
.news-detail__body figcaption,
.news-detail__body .wp-caption-text {
  margin-top: 0.67vw;
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.93vw;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.05em;
  overflow-wrap: anywhere;
}
.news-detail__body .alignleft,
.news-detail__body .alignright,
.news-detail__body .aligncenter,
.news-detail__body .alignnone {
  max-width: 100%;
}
.news-detail__body table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  color: #242426;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1vw;
  line-height: 1.6;
  white-space: nowrap;
}
.news-detail__body th,
.news-detail__body td {
  padding: 0.73vw 0.93vw;
  border: 1px solid #dcdcdc;
  text-align: left;
  vertical-align: top;
}
.news-detail__body th {
  background-color: #f6f7f9;
  font-weight: 700;
}
.news-detail__body pre {
  max-width: 100%;
  padding: 1.07vw;
  overflow-x: auto;
  background-color: #f6f7f9;
  border-radius: 0.33vw;
  color: #242426;
  font-family: monospace;
  font-size: 0.93vw;
  line-height: 1.6;
  white-space: pre;
}
.news-detail__body pre code {
  padding: 0;
  background-color: transparent;
  border-radius: 0;
  font-size: inherit;
}

/* -- Back Button -- */
.news-detail__back-wrap {
  display: flex;
  justify-content: center;
  padding-top: 2vw;
}
.news-detail__back-btn {
  display: flex;
  align-items: center;
  gap: 0.67vw;
  padding: 1vw 1.67vw;
  border: 2px solid #eee;
  border-radius: 0.67vw;
  color: #242426;
  text-decoration: none;
}
.news-detail__back-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.07vw;
  font-weight: 700;
  line-height: 1.45;
}
.news-detail__back-dot {
  display: block;
  width: 0.4vw;
  height: 0.4vw;
  background-color: #0b50ae;
  border-radius: 50%;
}

/* =============================================
   SP (mobile)
   ============================================= */
@media (width <= 767px) {
  .news-detail__inner {
    gap: 5.33vw;
    padding: 43.2vw 5.33vw 10.67vw;
  }

  /* -- Header SP -- */
  .news-detail__header {
    gap: 2.67vw;
  }
  .news-detail__meta {
    gap: 2.13vw;
  }
  .news-detail__date {
    font-size: 3.2vw;
  }
  .news-detail__category {
    max-width: 62vw;
    padding: 0.27vw 1.87vw 0.8vw;
    border-radius: 1.07vw;
    font-size: 2.67vw;
  }
  .news-detail__title {
    font-size: 5.87vw;
  }
  .legal-page__header .section-header__eyebrow {
    margin-bottom: 2.13vw;
  }
  .news-card__separator {
    margin-top: 0;
  }

  /* -- Hero SP -- */
  .news-detail__hero-img {
    border-radius: 1.6vw;
  }

  /* -- Body SP -- */
  .news-detail__body {
    gap: 5.33vw;
  }
  .news-detail__section {
    gap: 4vw;
  }
  .news-detail__body h1 {
    font-size: 6.4vw;
  }
  .news-detail__body h2 {
    font-size: 5.33vw;
  }
  .news-detail__body h3 {
    font-size: 4.53vw;
  }
  .news-detail__body h4 {
    font-size: 4vw;
  }
  .news-detail__body h5 {
    font-size: 3.73vw;
  }
  .news-detail__body h6 {
    font-size: 3.47vw;
  }
  .news-detail__body p {
    font-size: 3.73vw;
  }
  .news-detail__body ul,
  .news-detail__body ol {
    gap: 1.6vw;
    padding-left: 5.33vw;
    font-size: 3.73vw;
  }
  .news-detail__body ul ul,
  .news-detail__body ul ol,
  .news-detail__body ol ul,
  .news-detail__body ol ol {
    margin-top: 1.6vw;
  }
  .news-detail__body blockquote {
    padding: 4vw 4.27vw;
    border-left-width: 1.07vw;
    border-radius: 1.07vw;
  }
  .news-detail__body blockquote > * + * {
    margin-top: 2.67vw;
  }
  .news-detail__body code {
    padding: 0.53vw 1.07vw;
    border-radius: 0.8vw;
  }
  .news-detail__body mark {
    padding: 0.27vw 0.8vw;
  }
  .news-detail__body figcaption,
  .news-detail__body .wp-caption-text {
    margin-top: 2.13vw;
    font-size: 3.47vw;
  }
  .news-detail__body table {
    font-size: 3.47vw;
  }
  .news-detail__body th,
  .news-detail__body td {
    padding: 2.13vw 2.67vw;
  }
  .news-detail__body pre {
    padding: 3.2vw;
    border-radius: 1.07vw;
    font-size: 3.2vw;
  }

  /* -- Back Button SP -- */
  .news-detail__back-wrap {
    padding-top: 5.33vw;
  }
  .news-detail__back-btn {
    gap: 2.67vw;
    padding: 2.67vw 5.33vw;
    border-radius: 2.13vw;
  }
  .news-detail__back-text {
    font-size: 3.73vw;
  }
  .news-detail__back-dot {
    width: 1.33vw;
    height: 1.33vw;
  }
}
