/*============================
#mv
============================*/

section#mv {
  display: flex;
  height: 532px;
  padding: min(80px, 100vw / 375 * 40) var(--padding-inline, 20px) 0px;
  flex-direction: column;
  align-self: stretch;
  background: url(../images/front-page-mv-wave.svg) center bottom / 100vw
      min(150px, 100vw / 375 * 40) no-repeat,
    url(../images/mv-bg.jpg) center center / auto 100% no-repeat;
}

section#mv span.half {
  margin-right: -0.5em;
}

section#mv div.mv__body {
  width: 100%;
  max-width: 1080px;
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  gap: min(40px, 100vw / 375 * 20);
}

section#mv div.mv__body h1 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--scale-8, 8px);
}
section#mv div.mv__body h1 div {
  display: flex;
  padding: var(--scale-8, 8px) var(--scale-14, 14px);
  justify-content: center;
  align-items: center;
  border-radius: var(--scale-8, 8px);
  background: rgba(255, 255, 255, 0.9);
  color: var(--primary, #f0813b);
  font-feature-settings: "hwid" on;
  font-family: "Zen Maru Gothic";
  font-size: min(48px, 100vw / 375 * 29);
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

section#mv div.mv__body .body__sub-title {
  writing-mode: vertical-rl;
  color: var(--on-surface, #423527);
  font-feature-settings: "vrt2" on;
  font-family: "Zen Maru Gothic";
  font-size: min(32px, 100vw / 375 * 24);
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 38.4px */
  text-orientation: upright;
}

@media screen and (max-width: 920px) {
  section#mv {
    height: min(840px, 100vw / 375 * 540);
    background: linear-gradient(
        to top,
        white 0,
        white 56px,
        transparent 56px,
        transparent 100%
      ),
      url(../images/front-page-mv-wave.svg) center bottom 56px / 100vw
        min(150px, 100vw / 375 * 40) no-repeat,
      url(../images/mv-bg-sp.jpg) center top / auto 100% no-repeat;
  }
  section#mv div.mv__body {
    flex-direction: column-reverse;
  }
  section#mv div.mv__body .body__sub-title {
    width: fit-content;
    margin-left: calc(100vw / 375 * 48);
  }
}

section#mv div.mv__body .body__sub-title span.quate {
  transform: rotate(180deg) translateX(0.25em);
}
section#mv div.mv__body .body__sub-title span.quate:nth-of-type(1) {
  transform: rotate(180deg) translateX(-0.25em);
  margin-top: -0.5em;
}
section#mv div.mv__area {
  display: flex;
  padding-left: var(--scale-14, 14px);
  align-items: center;
  gap: var(--scale-16, 16px);
  color: var(--on-surface, #423527);
  font-family: "Zen Maru Gothic";
  font-size: min(24px, 100vw / 375 * 20);
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  max-width: 1080px;
  width: 100%;
  margin-inline: auto;
  margin-top: min(56px, 100vw / 375 * 44);
}
section#mv div.mv__area div.area__text {
}
section#mv div.mv__area figure {
}
section#mv div.mv__area figure img {
  width: min(120px, 100vw / 375 * 80);
  aspect-ratio: 120/101;
}