/*============================
#mv
============================*/
section#mv {
  display: flex;
  height: min(100vw / 1280 * 640, 640px);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  padding: min(100vw/ 375 * 24, 80px) var(--padding-inline) var(--padding-block);
  background: url(../images/front-mv-bg.jpg) center center / auto 100% no-repeat;
}

@media screen and (max-width: 768px) {
  section#mv {
    height: calc(100vw / 375 * 560);
    background: url(../images/front-mv-bg-sp.jpg) center center / auto 100%
      no-repeat;
    justify-content: flex-start;
  }
}

section#mv div.mv__container {
  width: 100%;
  max-width: 1080px;
  margin-inline: auto;
}
section#mv div.mv__container h2 {
  color: var(--primary, #105e9a);
  /* h3 */
  font-family: "Shippori Mincho";
  font-size: min(100vw / 375 * 40, 56px);
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 42px */
  border: none;
  margin: 0;
  padding: 0;
}
section#mv div.mv__container p {
  color: var(--primary, #105e9a);
  margin-top: 1em;

  /* h3 */
  font-family: "Shippori Mincho";
  font-size: min(100vw / 375 * 20, 28px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 42px */
}

/*============================
#links
============================*/
section#links {
  display: flex;
  padding: 160px var(--padding-inline) var(--padding-block, 80px);
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.3),
      rgba(255, 255, 255, 0.3)
    ),
    linear-gradient(
      0deg,
      var(--surface-variant, #f5f7f8) 32%,
      rgba(255, 255, 255, 0) 32%
    ),
    url(../images/front-links-bg.jpg) center center / cover no-repeat,
    var(--parimary-container, #dbeaf5);
}
section#links div.links__buttons {
  display: flex;
  width: 100%;
  max-width: 1080px;
  align-items: normal;
  gap: var(--card-gap, 20px);
}

@media screen and (max-width: 768px) {
  section#links div.links__buttons {
    flex-direction: column;
  }
}

section#links div.links__buttons a.buttons__button {
  display: flex;
  padding: var(--scale-24, 24px);
  justify-content: center;
  align-items: center;
  gap: var(--scale-24, 24px);
  flex: 1 0 0;
  border-radius: var(--scale-4, 4px);
  background: var(
    --primary-gradient,
    linear-gradient(
      90deg,
      #194a71 0%,
      var(--primary, #105e9a) 49.52%,
      #4d96cf 100%
    )
  );
}
section#links div.links__buttons a.buttons__button div.button__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--scale-16, 16px);
  flex: 1 0 0;
}
section#links div.links__buttons a.buttons__button div.button__text h3 {
  display: flex;
  align-items: flex-start;
  gap: var(--scale-16, 16px);
  align-self: stretch;
  color: var(--surface, #fff);
  padding: 0;
  margin: 0;

  /* h3 */
  font-family: "Shippori Mincho";
  font-size: var(--scale-28, 28px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 42px */
  border: none;
}
section#links div.links__buttons a.buttons__button div.button__text h3:after {
  display: none;
}
section#links div.links__buttons a.buttons__button div.button__text h3 img {
  width: var(--scale-40, 40px);
}
section#links div.links__buttons a.buttons__button div.button__text h3 span {
}
section#links div.links__buttons a.buttons__button div.button__text p {
  align-self: stretch;
  color: var(--surface, #fff);
  font-feature-settings: "palt" on;

  /* body */
  font-family: "Noto Sans JP";
  font-size: var(--scale-18, 18px);
  font-style: normal;
  font-weight: 400;
  line-height: 200%; /* 36px */
  margin: 0;
}

section#links div.links__buttons a.buttons__button figure.button__arrow {
  width: var(--scale-20, 20px);
}
section#links div.links__buttons a.buttons__button figure.button__arrow img {
}
