/*============================
#point
============================*/
section#point {
  padding: var(--scale-80, 80px) var(--padding-inline, 20px);
  background: var(--surface-variant, #f0f6fd);
}
section#point div.point__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--scale-56, 56px);
  align-self: stretch;
}
section#point div.point__container div.point__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--scale-20, 20px);
}
section#point div.point__container div.point__heading div.heading__en.en {
  display: flex;
  padding-bottom: var(--scale-8, 8px);
  justify-content: center;
  align-items: center;
  border-bottom: var(--scale-4, 4px) solid var(--primary, #003da7);
  color: var(--primary, #003da7);
  text-align: center;
  font-family: Roboto;
  font-size: var(--scale-24, 24px);
  font-style: normal;
  font-weight: 700;
  line-height: 100%; /* 24px */
  letter-spacing: 1.92px;
}
section#point div.point__container div.point__heading h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--scale-12, 12px);
}
section#point div.point__container div.point__heading h2 div.h2__sub-title {
  color: var(--on-surface, #2a292c);
  text-align: center;
  font-family: "Noto Sans JP";
  font-size: var(--scale-32, 32px);
  font-style: normal;
  font-weight: 700;
  line-height: 130%; /* 41.6px */
}
section#point div.point__container div.point__heading h2 div.h2__main-title {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 4px var(--scale-4, 4px);
  flex-wrap: wrap;
  color: var(--primary, #003da7);
  text-align: center;
  font-family: "Noto Sans JP";
  font-size: var(--scale-40, 40px);
  font-style: normal;
  font-weight: 700;
  line-height: 130%; /* 52px */
}
section#point
  div.point__container
  div.point__heading
  h2
  div.h2__main-title
  span.box {
  display: flex;
  padding: var(--scale-4, 4px) var(--scale-16, 16px);
  justify-content: center;
  align-items: center;
  background: var(--primary, #003da7);
  color: var(--surface, #fff);
  text-align: center;
  font-family: "Noto Sans JP";
  font-size: var(--scale-40, 40px);
  font-style: normal;
  font-weight: 700;
  line-height: 130%; /* 52px */
}

section#point div.point__container div.point__articles {
  display: flex;
  align-items: flex-start;
  gap: var(--gap-column, 40px);
  margin-inline: auto;
  max-width: var(--width-md);
}
section#point
  div.point__container
  div.point__articles
  article.articles__article {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--scale-16, 16px);
  position: relative;
  flex: 1 0 0;
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  div.article__num {
  color: var(--primary, #003da7);
  text-align: center;
  font-family: Roboto;
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%; /* 44px */
  position: absolute;
  left: 0;
  top: 0;
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  div.article__num
  svg {
  position: absolute;
  left: 0.5em;
  top: 0.5em;
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  h3 {
  flex: 1 0 0;
  color: var(--on-surface, #2a292c);
  text-align: center;
  font-family: "Noto Sans JP";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 130%; /* 31.2px */
  padding-top: 2em;
  padding-inline: 2em;
  z-index: 5;
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  figure.comment__img {
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  figure.comment__img
  img {
}
section#point
  div.point__container
  div.point__articles
  article.articles__article
  div.article__description {
  color: var(--on-surface, #2a292c);
  font-family: "Noto Sans JP";
  font-size: var(--scale-18, 18px);
  font-style: normal;
  font-weight: 700;
  line-height: 170%; /* 30.6px */
}

@media screen and (max-width: 1024px) {
  section#point div.point__container div.point__articles {
    flex-direction: column;
  }
}