@charset "UTF-8";
.mf-intro {
  --content: min(794 / var(--browserFontSize) * 1rem, 100% - var(--gap) * 2);
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  padding-top: clamp(3.75rem, 3.5333204931rem + 0.9244992296vw, 4.125rem);
  padding-bottom: 5.625rem;
  background-color: var(--color-blue-70);
}
.mf-intro > * {
  grid-column: content;
}
.mf-intro__heading {
  margin-bottom: clamp(3.6875rem, 3.6875rem + 0vw, 3.6875rem);
  font-size: 1.5625rem;
  line-height: 1.48;
  letter-spacing: 0.09em;
  font-weight: 700;
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-intro__heading {
    font-size: 1.25rem;
    line-height: 1.4;
  }
}
.mf-intro__heading__text {
  padding-right: 0.3125rem;
  padding-bottom: 0.1875rem;
  padding-left: 0.3125rem;
  background-image: linear-gradient(
    to top,
    #ffe100 0.8125rem,
    transparent 0.8125rem
  );
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
@media screen and (max-width: 48rem) {
  .mf-intro__heading__text {
    padding-right: 0.1875rem;
    padding-bottom: 0.1875rem;
    padding-left: 0.1875rem;
  }
}
.mf-intro__body {
  display: grid;
  grid-template-columns: 293fr 296fr 205fr;
  grid-template-rows: clamp(0rem, -2.094568567rem + 8.936825886vw, 3.625rem) auto clamp(
      0rem,
      -0.5416987673rem + 2.311248074vw,
      0.9375rem
    );
}
@media screen and (max-width: 48rem) {
  .mf-intro__body {
    grid-template-columns: 63fr 258fr 14fr;
    grid-template-rows: 8.125rem auto 4.375rem;
    width: min(20.9375rem, 100%);
    margin-right: auto;
    margin-left: auto;
  }
}
.mf-intro__balloon {
  grid-column: 1/-1;
  grid-row: 1/-1;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto 1fr auto;
  z-index: 2;
}
@media screen and (max-width: 48rem) {
  .mf-intro__balloon {
    grid-template-columns: 310fr 52fr 308fr;
    grid-template-rows: 153fr 217fr 113fr;
  }
}
.mf-intro__balloon__item:nth-of-type(1) {
  grid-column: 1/2;
  grid-row: 1/2;
  justify-self: flex-end;
}
.mf-intro__balloon__item:nth-of-type(2) {
  grid-column: 3/4;
  grid-row: 1/2;
}
@media screen and (max-width: 48rem) {
  .mf-intro__balloon__item:nth-of-type(2) {
    padding-top: 1.8125rem;
  }
}
.mf-intro__balloon__item:nth-of-type(3) {
  grid-column: 1/2;
  grid-row: 3/4;
  justify-self: flex-end;
  padding-right: 0.375rem;
}
@media screen and (max-width: 48rem) {
  .mf-intro__balloon__item:nth-of-type(3) {
    padding-right: 0;
  }
}
.mf-intro__balloon__button {
  outline: none;
  box-shadow: none;
}
.mf-intro__img {
  grid-column: 2/3;
  grid-row: 2/3;
  align-self: center;
  z-index: 1;
}
.mf-intro__img img {
  width: 100%;
}
.mf-introDialog {
  width: fit-content;
  max-width: min(57.5rem, 100% - var(--gap) * 2);
  min-width: min(37.5rem, 100% - var(--gap) * 2);
  max-height: calc(100% - var(--gap) * 2);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  overflow: visible;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog {
    --gap: 1.875rem;
  }
}
.mf-introDialog[open] {
  display: flex;
}
.mf-introDialog::backdrop {
  background-color: color-mix(in srgb, var(--color-blue-10), transparent 50%);
  background-color: rgb(from var(--color-blue-10) r g b/50%);
}
.mf-introDialog__wrapper {
  width: 100%;
  background-color: var(--color-light);
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: var(--color-blue-10);
  border-radius: var(--border-radius-xl);
  overflow: auto;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__wrapper {
    border-radius: var(--border-radius-lg);
  }
}
.mf-introDialog__inner {
  padding-top: 3.1875rem;
  padding-right: clamp(1.875rem, 0.93605547rem + 4.0061633282vw, 3.5rem);
  padding-bottom: 2.875rem;
  padding-left: clamp(1.875rem, 0.93605547rem + 4.0061633282vw, 3.5rem);
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__inner {
    padding-top: 1.375rem;
    padding-bottom: 2.875rem;
  }
}
.mf-introDialog__heading {
  width: fit-content;
  margin-right: auto;
  margin-bottom: 3.0625rem;
  margin-left: auto;
  padding-bottom: 0.1875rem;
  border-bottom-width: var(--border-width-lg);
  border-bottom-style: solid;
  border-bottom-color: var(--color-blue-10);
  font-size: 1.5625rem;
  line-height: 1.48;
  letter-spacing: 0.12em;
  font-weight: 700;
  color: var(--color-blue-10);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__heading {
    margin-bottom: 2.1875rem;
    font-size: 1.1875rem;
    line-height: 1.4210526316;
  }
}
.mf-introDialog__lead {
  margin-bottom: 3.4375rem;
  font-size: 1.1875rem;
  line-height: 2;
  font-weight: 700;
  color: var(--color-blue-10);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__lead {
    margin-bottom: 1.875rem;
    font-size: 0.9375rem;
    line-height: 1.8;
  }
}
.mf-introDialog__lead .line {
  background-image: linear-gradient(
    to top,
    var(--color-blue-50) 0.5625rem,
    transparent 0.5625rem
  );
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__lead .line {
    background-image: linear-gradient(
      to top,
      var(--color-blue-50) 0.4375rem,
      transparent 0.4375rem
    );
  }
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog01"] .mf-introDialog__lead {
    margin-bottom: 1.875rem;
    font-size: 1.0625rem;
    line-height: 1.8823529412;
  }
}
.mf-introDialog[data-dialog="dialog03"] .mf-introDialog__lead {
  margin-bottom: 1.9375rem;
}
@media print, screen and (min-width: 48.0625rem) {
  .mf-introDialog__row {
    display: grid;
  }
  .mf-introDialog[data-dialog="dialog01"] .mf-introDialog__row {
    grid-template-columns: 445fr 292fr;
    column-gap: 3.4375rem;
  }
  .mf-introDialog[data-dialog="dialog02"] .mf-introDialog__row {
    grid-template-columns: 338fr 342fr;
    column-gap: 3.75rem;
  }
  .mf-introDialog[data-dialog="dialog03"] .mf-introDialog__row {
    grid-template-columns: 100%;
  }
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog01"]
    .mf-introDialog__column
    + .mf-introDialog__column {
    margin-top: 1.25rem;
  }
}
.mf-introDialog[data-dialog="dialog02"] .mf-introDialog__column {
  grid-column: 1/2;
  grid-row: 1/3;
}
.mf-introDialog[data-dialog="dialog02"] .mf-introDialog__text {
  grid-column: 2/3;
  grid-row: 1/2;
  font-size: 1.0625rem;
  line-height: 1.8235294118;
  color: var(--color-blue-10);
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog02"] .mf-introDialog__text {
    margin-top: 1.625rem;
    font-size: 0.875rem;
    line-height: 1.5714285714;
  }
}
.mf-introDialog[data-dialog="dialog03"] .mf-introDialog__text {
  font-size: 1.0625rem;
  line-height: 1.6470588235;
  font-weight: 600;
  color: var(--color-blue-40);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog03"] .mf-introDialog__text {
    font-size: 0.8125rem;
    line-height: 1.9230769231;
  }
}
.mf-introDialog[data-dialog="dialog02"] .mf-introDialog__links {
  grid-column: 2/3;
  grid-row: 2/3;
  align-self: flex-end;
  font-size: 0.75rem;
  line-height: 1.75;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog02"] .mf-introDialog__links {
    margin-top: 2.3125rem;
    font-size: 0.6875rem;
    line-height: 1.3636363636;
  }
}
.mf-introDialog[data-dialog="dialog02"] .mf-introDialog__links a {
  color: currentColor;
}
.mf-introDialog[data-dialog="dialog02"]
  .mf-introDialog__links
  a[target="_blank"]:after {
  display: inline-block;
  width: 1.125rem;
  height: 1.125rem;
  margin-top: -0.125rem;
  margin-left: 0.4375rem;
  background-image: url(data:image/webp;base64,UklGRs4AAABXRUJQVlA4WAoAAAAQAAAAEQAAEQAAQUxQSHcAAAABcFNbe9t8LgRqRrddHMwhbXcCwBBExau3cAkDjellqur/FAARQTBJk9szICRCWs94Pri25Us6Jun5tXXXX02fsXbNAHaQdhwu54feRp91NvqoX0Jy+mjLRHL6s98GXsI5ajn47QQDlef/Ou85aZRzrM+S9JliAABWUDggMAAAABADAJ0BKhIAEgA+bTKVR6QioiEoCACADYlpAMoAFsbeAAD+82hjFlqduRLxKwAAAA==);
  background-size: cover;
  vertical-align: middle;
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-introDialog[data-dialog="dialog02"]
    .mf-introDialog__links
    a[target="_blank"]:after {
    width: 0.8125rem;
  }
}
.mf-introDialog__close {
  position: absolute;
  display: grid;
  place-items: center;
  width: 3.125rem;
  height: 3.125rem;
  top: -1rem;
  right: -1rem;
  background-color: var(--color-blue-10);
  border-radius: 50%;
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__close {
    width: 2.75rem;
    height: 2.75rem;
    top: -1.25rem;
  }
}
.mf-introDialog__close:before,
.mf-introDialog__close:after {
  grid-column: 1/-1;
  grid-row: 1/-1;
  display: block;
  width: 1.875rem;
  height: 0.1875rem;
  background-color: var(--color-light);
  border-radius: var(--border-radius-infinity);
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-introDialog__close:before,
  .mf-introDialog__close:after {
    width: 1.75rem;
  }
}
.mf-introDialog__close:before {
  rotate: 45deg;
}
.mf-introDialog__close:after {
  rotate: -45deg;
}
.mf-accordions {
  --spacer: 3.125rem;
  padding-top: var(--spacer);
}
@media screen and (max-width: 48rem) {
  .mf-accordions {
    --spacer: 1.25rem;
  }
}
.mf-accordions:has(.mf-accordions__item:last-child:not([open])),
.mf-accordions:has(.mf-accordions__item:last-child[open][data-animation]) {
  padding-bottom: var(--spacer);
}
.mf-accordions__item {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
.mf-accordions__item + .mf-accordions__item {
  margin-top: 1.25rem;
}
.mf-accordions__item[open]:not([data-animation="closing"])
  + .mf-accordions__item,
.mf-accordions__item
  + .mf-accordions__item[open]:not([data-animation="closing"]) {
  margin-top: var(--spacer);
}
.mf-accordions__button {
  --icon-width: 1.875rem;
  --icon-pos: 1.125rem;
  position: relative;
  display: block;
  width: min(42.5rem, 100% - var(--gap) * 2);
  margin-right: auto;
  margin-left: auto;
  padding-top: 0.875rem;
  padding-right: calc(var(--icon-width) + var(--icon-pos) + 0.625rem);
  padding-bottom: 0.9375rem;
  padding-left: 0.9375rem;
  background-color: var(--color-blue-10);
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: var(--color-blue-10);
  font-size: 1.5625rem;
  line-height: 1.48;
  color: var(--color-light);
  text-align: center;
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--border-radius-md);
  transition-property: background-color, color, margin;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
@media screen and (max-width: 48rem) {
  .mf-accordions__button {
    --icon-width: 0.9375rem;
    --icon-pos: 0.5rem;
    padding-top: 0.625rem;
    padding-right: calc(var(--icon-width) + var(--icon-pos) + 0.5rem);
    padding-bottom: 0.75rem;
    padding-left: 0.8125rem;
    font-size: 1rem;
    line-height: 1.5;
  }
}
@media (any-hover: hover) {
  .mf-accordions__button:hover {
    background-color: var(--color-light);
    color: var(--color-blue-10);
  }
}
.mf-accordions__button:before,
.mf-accordions__button:after {
  position: absolute;
  display: block;
  width: var(--icon-width);
  height: 0.25rem;
  top: 0;
  right: var(--icon-pos);
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  background-color: currentColor;
  content: "";
  transition-property: rotate;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
@media screen and (max-width: 48rem) {
  .mf-accordions__button:before,
  .mf-accordions__button:after {
    height: 0.125rem;
  }
}
.mf-accordions__item:not([open]) .mf-accordions__button:after {
  rotate: 90deg;
}
.mf-accordions__detail {
  overflow: hidden;
}
.mf-howTo {
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  margin-top: var(--spacer);
  padding-top: 7.5rem;
  background-color: var(--color-blue-80);
}
@media screen and (max-width: 48rem) {
  .mf-howTo {
    padding-top: 2.8125rem;
  }
}
.mf-howTo__heading {
  grid-column: content;
  display: grid;
  justify-items: center;
  align-items: flex-start;
  margin-bottom: 5.1875rem;
}
@media screen and (max-width: 48rem) {
  .mf-howTo__heading {
    margin-bottom: 2.5rem;
  }
}
.mf-howTo__heading > * {
  grid-column: 1/-1;
  grid-row: 1/-1;
}
.mf-howTo__heading__text {
  padding-top: 4.9375rem;
  font-size: 1.5625rem;
  line-height: 1.48;
  font-weight: 700;
  color: var(--color-blue-40);
  text-align: center;
  word-break: keep-all;
}
@media screen and (max-width: 48rem) {
  .mf-howTo__heading__text {
    padding-top: 1.375rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }
}
.mf-howTo__experience {
  grid-column: content;
  padding-bottom: 8.125rem;
}
@media screen and (max-width: 48rem) {
  .mf-howTo__experience {
    padding-bottom: 3.375rem;
  }
}
.mf-howTo__comparison {
  grid-column: full;
  padding-top: 7.3125rem;
  padding-bottom: 12.875rem;
  background-color: var(--color-blue-90);
}
@media screen and (max-width: 48rem) {
  .mf-howTo__comparison {
    padding-top: 4rem;
    padding-bottom: 4.625rem;
  }
}
.mf-experience__box {
  position: relative;
  margin-bottom: 5rem;
  padding: 4.125rem 1.25rem 1.9375rem;
  background-color: var(--color-light);
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: var(--color-blue-40);
  border-radius: var(--border-radius-xl);
}
@media screen and (max-width: 48rem) {
  .mf-experience__box {
    margin-bottom: 2.8125rem;
    padding-top: 2.4375rem;
    padding-bottom: 1rem;
    border-radius: var(--border-radius-lg);
  }
}
.mf-experience__box:after {
  position: absolute;
  display: block;
  width: 3.3125rem;
  height: 1.625rem;
  top: calc(100% + var(--border-width-lg));
  right: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto;
  background-color: var(--color-blue-40);
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-experience__box:after {
    width: 2.3125rem;
    height: 1.125rem;
  }
}
.mf-experience__heading {
  margin-bottom: 2.9375rem;
  font-size: 1.25rem;
  line-height: 1.5;
  text-align: center;
  font-weight: 700;
  color: var(--color-blue-40);
  word-break: keep-all;
}
@media screen and (max-width: 48rem) {
  .mf-experience__heading {
    margin-bottom: 2rem;
    font-size: 0.9375rem;
    line-height: 1.3333333333;
  }
}
.mf-experience__fadeImage__img {
  display: grid;
  justify-content: center;
}
.mf-experience__fadeImage__img > * {
  grid-column: 1/-1;
  grid-row: 1/-1;
}
.mf-experience__fadeImage__img .fade-img {
  animation: fade 3s infinite ease-in-out alternate;
}
.mf-experience__fadeImage__caption {
  margin-top: 4.375rem;
  font-size: 0.75rem;
  line-height: 1.5;
}
@media screen and (max-width: 48rem) {
  .mf-experience__fadeImage__caption {
    margin-top: 0.875rem;
    font-size: 0.5625rem;
    line-height: 1.4444444444;
  }
}
@keyframes fade {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  to {
    opacity: 1;
  }
}
.mf-experience__result {
  width: min(37.5rem, 100%);
  margin-right: auto;
  margin-left: auto;
}
.mf-experience__result__label {
  margin-bottom: 1.5625rem;
  padding-bottom: 1rem;
  font-size: 1.5625rem;
  line-height: 1.48;
  font-weight: 700;
  color: var(--color-blue-40);
  text-align: center;
  word-break: keep-all;
}
@media screen and (max-width: 48rem) {
  .mf-experience__result__label {
    margin-bottom: 1rem;
    padding-bottom: 0;
    font-size: 1.125rem;
    line-height: 1.8333333333;
  }
}
.mf-experience__result__label span {
  padding-right: calc((100% - 34.375rem) / 2);
  padding-bottom: 1rem;
  padding-left: calc((100% - 34.375rem) / 2);
  background-image: linear-gradient(
    to top,
    var(--color-blue-40) var(--border-width-lg),
    transparent var(--border-width-lg)
  );
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
@media screen and (max-width: 48rem) {
  .mf-experience__result__label span {
    padding-bottom: 0.1875rem;
    background-image: linear-gradient(
      to top,
      var(--color-blue-40) var(--border-width-md),
      transparent var(--border-width-md)
    );
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }
}
.mf-experience__result__desc {
  font-size: 1.125rem;
  line-height: 2.5;
  font-weight: 700;
  color: var(--color-blue-10);
}
@media screen and (max-width: 48rem) {
  .mf-experience__result__desc {
    font-size: 0.875rem;
    line-height: 1.8571428571;
  }
}
.mf-experience__result__desc span {
  background-image: linear-gradient(
    to top,
    #ffe100 1.6875rem,
    transparent 1.6875rem
  );
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mf-comparison {
  --content: min(1010 / var(--browserFontSize) * 1rem, 100% - var(--gap) * 2);
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
}
.mf-comparison__heading {
  grid-column: content;
  position: relative;
  margin-bottom: 3.5rem;
  padding-bottom: 3.6875rem;
  font-size: 1.1875rem;
  line-height: 2.2105263158;
  letter-spacing: 0.06em;
  font-weight: 500;
  color: var(--color-blue-40);
  text-align: center;
  z-index: 0;
}
@media screen and (max-width: 48rem) {
  .mf-comparison__heading {
    margin-bottom: 2.5rem;
    padding-bottom: 2.8125rem;
    font-size: 0.9375rem;
    line-height: 1.7333333333;
  }
}
.mf-comparison__heading:after {
  position: absolute;
  display: block;
  width: 4.375rem;
  height: 5.9375rem;
  right: 0;
  bottom: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABfBAMAAACn2azkAAAAJFBMVEVHcEz///////////////////////////////////////////8Uel1nAAAAC3RSTlMAwKIsYfAQ0IxKxI17RrwAAAFuSURBVEjH7Ze/TsMwEMatUFWsLF1YMrFkYalAYsnClBHE0iUgoT4AUpculRh5gopHYGpIVOBejot9dnyOHUuw+hucP/fL5+QusS5CcJ2soLsU03oGgIcI84bMV4Q5R+aQmMQkJjGJSUxiLF2fvU4wMjrDk2WQUdEbHNsgU+HhpyhwhDzAZH2wEVu18TPS4KCYwYgx0gYPJQpN7WHmFBPvcgsbD7NWoW/yg2M9YubqNmCnHg/1MmKuVKClNKGo6xkY7ISkSp0n1J3DLAcbNFpZRoYhm47qRFfcM+bWducza4bfJZ9aMxW3YZkg5pRnzcpoY5iCZ982yonJxjZCPJFRLRkqJlzwt1qbS2aYmkm7f+DwY2b2NJioPlWd2h23m5Q0S+X466scpPV8obO4jakIuFVw2utBoUZ7GbVBo61BjsF+fW2YTXDx0aV1isn1SMxiahkrvMX0lTb//5qZxW36dyT2C9KXtowyYi/+wvwCvYQnjv1kN8gAAAAASUVORK5CYII=);
  background-size: cover;
  z-index: -1;
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-comparison__heading:after {
    width: 3.625rem;
    height: 4.875rem;
  }
}
.mf-comparison__list,
.mf-comparison__item {
  grid-column: full;
  display: grid;
  grid-template-columns: subgrid;
}
.mf-comparison__item + .mf-comparison__item {
  margin-top: 7.75rem;
}
@media screen and (max-width: 48rem) {
  .mf-comparison__item + .mf-comparison__item {
    margin-top: 3.75rem;
  }
}
.mf-comparison__num {
  position: relative;
  grid-column: content;
  display: grid;
  align-items: center;
  grid-template-columns: max-content auto;
  column-gap: 1.5625rem;
  row-gap: 0.9375rem;
  margin-bottom: 2.25rem;
  font-size: 1.5625rem;
  line-height: 1.48;
  letter-spacing: 0.1em;
  font-weight: 700;
  word-break: keep-all;
  color: var(--color-blue-40);
}
@media screen and (max-width: 48rem) {
  .mf-comparison__num {
    column-gap: 1.3125rem;
    row-gap: 0.8125rem;
    margin-bottom: 1.1875rem;
    font-size: 1.1875rem;
    line-height: 1.4736842105;
  }
}
.mf-comparison__num img {
  flex-shrink: 0;
  width: auto;
  height: 2.5rem;
  letter-spacing: 0;
}
@media screen and (max-width: 48rem) {
  .mf-comparison__num img {
    height: 2rem;
  }
}
.mf-comparison__num:after {
  --dots-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMiAzIj4KICA8Y2lyY2xlIGN4PSIzLjUiIGN5PSIxLjUiIHI9IjEuNSIvPgo8L3N2Zz4K);
  grid-column: 1/-1;
  height: 0.1875rem;
  background-color: var(--color-blue-40);
  -webkit-mask-image: var(--dots-image);
  mask-image: var(--dots-image);
  -webkit-mask-size: 0.75rem 0.1875rem;
  mask-size: 0.75rem 0.1875rem;
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-comparison__num:after {
    height: 0.125rem;
    -webkit-mask-size: 0.5rem 0.125rem;
    mask-size: 0.5rem 0.125rem;
  }
}
.mf-comparison__item:nth-of-type(odd) .mf-comparison__num {
  justify-content: flex-start;
}
.mf-comparison__item:nth-of-type(2n) .mf-comparison__num {
  justify-content: flex-end;
}
.mf-comparison__image {
  grid-column: full;
  display: grid;
  grid-template-columns: subgrid;
  justify-items: center;
  padding-top: 3.3125rem;
  padding-bottom: 3.125rem;
  background-color: var(--color-light);
  --border-radius: 7.625rem;
}
@media screen and (max-width: 48rem) {
  .mf-comparison__image {
    padding-top: 3.125rem;
    padding-bottom: 4rem;
  }
}
.mf-comparison__image > * {
  grid-column: content;
}
@media screen and (max-width: 48rem) {
  .mf-comparison__image > * {
    grid-column: full;
  }
}
@media screen and (max-width: 48rem) {
  .mf-comparison__image {
    --border-radius: 3.75rem;
  }
}
.mf-comparison__item:nth-of-type(odd) .mf-comparison__image {
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
}
.mf-comparison__item:nth-of-type(2n) .mf-comparison__image {
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}
.mf-point {
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  margin-top: var(--spacer);
}
.mf-point__wrap {
  grid-column: full;
  display: grid;
  grid-template-columns: subgrid;
  padding-top: 4.0625rem;
  padding-bottom: 7.3125rem;
  background-color: var(--color-blue-60);
  clip-path: polygon(
    0% 0%,
    100% 0%,
    100% calc(100% - 5.9375rem),
    50% 100%,
    0% calc(100% - 5.9375rem)
  );
}
@media screen and (max-width: 48rem) {
  .mf-point__wrap {
    padding-top: 3.125rem;
    padding-bottom: 5.875rem;
    clip-path: polygon(
      0% 0%,
      100% 0%,
      100% calc(100% - 2.8125rem),
      50% 100%,
      0% calc(100% - 2.8125rem)
    );
  }
}
.mf-point__wrap > * {
  grid-column: content;
}
.mf-point__heading {
  display: grid;
  align-items: flex-start;
  margin-bottom: 2.875rem;
}
@media screen and (max-width: 48rem) {
  .mf-point__heading {
    margin-bottom: 1.875rem;
  }
}
.mf-point__heading > * {
  grid-column: 1/-1;
  grid-row: 1/-1;
}
.mf-point__heading__img {
  margin-left: calc(-1 * var(--gap));
}
.mf-point__heading__text {
  padding-top: 3.4375rem;
  font-size: 1.5625rem;
  line-height: 1.48;
  letter-spacing: 0.1em;
  font-weight: 700;
  color: var(--color-light);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-point__heading__text {
    padding-top: 2.3125rem;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
.mf-point__desc {
  text-align: center;
}
.mf-point__desc__label {
  margin-bottom: 2.0625rem;
  font-size: 1.125rem;
  line-height: 1.5555555556;
  font-weight: 500;
  word-break: keep-all;
  color: var(--color-blue-10);
}
@media screen and (max-width: 48rem) {
  .mf-point__desc__label {
    font-size: 0.875rem;
    line-height: 1.5714285714;
  }
}
.mf-point__desc__img {
  margin-bottom: 3rem;
}
@media screen and (max-width: 48rem) {
  .mf-point__desc__img {
    margin-bottom: 2.1875rem;
  }
}
.mf-point__desc__box {
  width: min(26.25rem, 100%);
  margin-right: auto;
  margin-left: auto;
  padding: 1.3125rem 1.25rem 1.375rem;
  background-color: var(--color-light);
  font-size: 1.125rem;
  line-height: 1.5555555556;
  font-weight: 700;
  color: var(--color-blue-40);
  word-break: keep-all;
  border-radius: var(--border-radius-lg);
}
@media screen and (max-width: 48rem) {
  .mf-point__desc__box {
    padding-top: 0.8125rem;
    padding-bottom: 0.8125rem;
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}
.mf-point__relation {
  grid-column: full;
  display: grid;
  grid-template-columns: subgrid;
  padding-top: 5.625rem;
}
@media screen and (max-width: 48rem) {
  .mf-point__relation {
    padding-top: 2.75rem;
  }
}
.mf-point__relation > * {
  grid-column: content;
}
.mf-point__relation__label {
  margin-bottom: 3rem;
  font-size: 1.625rem;
  line-height: 1.4230769231;
  font-weight: 700;
  color: var(--color-blue-40);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-point__relation__label {
    font-size: 1.25rem;
    line-height: 1.4;
  }
}
.mf-point__relation__tabs {
  justify-self: center;
}
.mf-relationTab {
  --full: minmax(0, 3.5625rem);
  --label: 7.1875rem;
  --tabs: 22.6875rem;
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [img-start label] var(--label) [tabs] var(--tabs)
    [img-end] var(--full) [full-end];
  align-items: center;
  width: min(37rem, 100%);
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab {
    --label: 5.3125rem;
    --tabs: 14.375rem;
  }
}
.mf-relationTab__img {
  grid-column: img;
  text-align: center;
  margin-bottom: 0.9375rem;
}
.mf-relationTab__tab {
  display: contents;
}
.mf-relationTab__tab__label {
  grid-column: label;
  text-align: center;
  font-size: 1.0625rem;
  line-height: 1.4117647059;
  font-weight: 400;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__tab__label {
    font-size: 0.8125rem;
    line-height: 1.4615384615;
  }
}
.mf-relationTab__tab__tabs {
  grid-column: tabs;
  display: grid;
  grid-template-columns: repeat(3, max-content);
  justify-content: space-between;
  padding-right: 1.1875rem;
  padding-left: 1.125rem;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__tab__tabs {
    padding-right: 0;
    padding-left: 0;
  }
}
.mf-relationTab__tab__item {
  position: relative;
}
.mf-relationTab__tab__item:after {
  position: absolute;
  display: block;
  width: 1.75rem;
  height: 0.875rem;
  top: calc(100% + 0.5rem);
  right: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto;
  background-color: var(--color-blue-40);
  transition-property: opacity;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
  opacity: 0;
  content: "";
}
.mf-relationTab__tab__item:has(input:checked):after {
  opacity: 1;
}
.mf-relationTab__tab__button {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: repeat(2, max-content);
  place-items: center;
  align-content: center;
  width: 5.625rem;
  height: 5.625rem;
  padding-bottom: 0.25rem;
  background-color: var(--color-grey-80);
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: var(--color-grey-80);
  color: var(--color-grey-60);
  cursor: pointer;
  border-radius: 50%;
  z-index: 0;
  transition-property: background-color, border-color, color;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__tab__button {
    width: 4.5rem;
    height: 4.5rem;
  }
}
.mf-relationTab__tab__button:has(input:checked) {
  background-color: var(--color-light);
  border-color: var(--color-blue-40);
  color: var(--color-blue-40);
}
.mf-relationTab__tab__button input {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  cursor: inherit;
  border-radius: inherit;
}
.mf-relationTab__tab__button__sub {
  font-size: 0.9375rem;
  line-height: 1;
  letter-spacing: 0.06em;
  font-weight: 400;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__tab__button__sub {
    font-size: 0.75rem;
    line-height: 1;
  }
}
.mf-relationTab__tab__button__main {
  margin-top: 0.4375rem;
  font-size: 1.1875rem;
  line-height: 1;
  letter-spacing: -0.0752631579em;
  font-weight: 700;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__tab__button__main {
    margin-top: 0.25rem;
    font-size: 1rem;
    line-height: 1;
  }
}
.mf-relationTab__panels {
  grid-column: full;
  margin-top: 2rem;
}
.mf-relationTab__panels__list {
  display: grid;
  grid-template-columns: 100%;
}
.mf-relationTab__panels__item {
  grid-column: 1/-1;
  grid-row: 1/-1;
  display: none;
}
.mf-relationTab:has(input[name="relationTab"][value="large"]:checked)
  .mf-relationTab__panels__item[data-panel="large"] {
  display: block;
}
.mf-relationTab:has(input[name="relationTab"][value="small"]:checked)
  .mf-relationTab__panels__item[data-panel="small"] {
  display: block;
}
.mf-relationTab:has(input[name="relationTab"][value="fit"]:checked)
  .mf-relationTab__panels__item[data-panel="fit"] {
  display: block;
}
.mf-relationTab__panels__note {
  grid-column: full;
  margin-top: 1.125rem;
  text-align: right;
  font-size: 0.8125rem;
  line-height: 1;
}
@media screen and (max-width: 48rem) {
  .mf-relationTab__panels__note {
    margin-top: 0.4375rem;
    font-size: 0.5625rem;
    line-height: 1;
  }
}
.mf-relationPanel {
  background-color: var(--color-blue-90);
}
.mf-relationPanel__img {
  display: block;
  width: 100%;
}
.mf-relationPanel__desc {
  display: grid;
  place-items: center;
  padding: 1.625rem 1.25rem;
}
@media screen and (max-width: 48rem) {
  .mf-relationPanel__desc {
    padding: 1rem 1.25rem 1.125rem;
  }
}
.mf-relationPanel__list {
  font-size: 1.125rem;
  line-height: 1.7222222222;
  font-weight: 700;
}
@media screen and (max-width: 48rem) {
  .mf-relationPanel__list {
    font-size: 0.875rem;
    line-height: 1.4285714286;
  }
}
.mf-relationPanel__list li {
  padding-left: 3.1875rem;
}
@media screen and (max-width: 48rem) {
  .mf-relationPanel__list li {
    padding-left: 2.375rem;
  }
}
.mf-relationPanel__list li + li {
  margin-top: 0.875rem;
}
@media screen and (max-width: 48rem) {
  .mf-relationPanel__list li + li {
    margin-top: 0.5625rem;
  }
}
.mf-relationPanel__list li:before {
  display: inline-block;
  width: 2.1875rem;
  height: 2.1875rem;
  margin: -0.5rem 1rem -0.125rem -3.1875rem;
  background-size: cover;
  vertical-align: middle;
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-relationPanel__list li:before {
    width: 1.625rem;
    height: 1.625rem;
    margin: -0.375rem 0.75rem -0.125rem -2.375rem;
  }
}
.mf-relationPanel__list.is-bad {
  color: var(--color-grey-30);
}
.mf-relationPanel__list.is-bad li:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNSAzNSI+CiAgPHBhdGggZmlsbD0iI2IyYjJiMiIgZD0iTTE3LjUgOC40IDI5LjQgMjlINS42TDE3LjUgOC40bTAtNC44LTE2IDI3LjhoMzJsLTE2LTI3LjhaIi8+Cjwvc3ZnPgo=);
}
.mf-relationPanel__list.is-good {
  color: var(--color-blue-40);
}
.mf-relationPanel__list.is-good li:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiIHZpZXdCb3g9IjAgMCAzNSAzNSI+CiAgPGNpcmNsZSBmaWxsPSIjZmZlMTAwIiBjeD0iMTcuNSIgY3k9IjE3LjUiIHI9IjE3LjUiIGNsYXNzPSJjbHMtMSIvPgogIDxjaXJjbGUgZmlsbD0iI2ZmZiIgY3g9IjE3LjUiIGN5PSIxNy41IiByPSIxMy41IiBjbGFzcz0iY2xzLTIiLz4KICA8Y2lyY2xlIGZpbGw9IiNmZmUxMDAiIGN4PSIxNy41IiBjeT0iMTcuNSIgcj0iOS44IiBjbGFzcz0iY2xzLTEiLz4KICA8Y2lyY2xlIGZpbGw9IiNmZmYiIGN4PSIxNy41IiBjeT0iMTcuNSIgcj0iNS45IiBjbGFzcz0iY2xzLTIiLz4KPC9zdmc+Cg==);
  background-size: cover;
}
.mf-try {
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  margin-top: var(--spacer);
  padding-top: 7.0625rem;
  padding-bottom: 4.5rem;
  background-color: var(--color-grey-90);
}
@media screen and (max-width: 48rem) {
  .mf-try {
    padding-top: 4.0625rem;
    padding-bottom: 4.5rem;
  }
}
.mf-try > * {
  grid-column: content;
}
.mf-try__heading {
  margin-bottom: 3.4375rem;
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-try__heading {
    margin-bottom: 3.125rem;
  }
}
.mf-try__quote {
  --quoteOffset: 3.9375rem;
  padding-top: var(--quoteOffset);
}
@media screen and (max-width: 48rem) {
  .mf-try__quote {
    --quoteOffset: 1.3125rem;
  }
}
.mf-try__quote__text {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  place-items: center;
  padding: 5.1875rem 1.25rem 12.5rem;
  background-color: var(--color-light);
  text-align: center;
  word-break: keep-all;
  border-radius: var(--border-radius-xl);
}
@media screen and (max-width: 48rem) {
  .mf-try__quote__text {
    padding-top: 3rem;
    padding-bottom: 7.125rem;
    border-radius: var(--border-radius-lg);
  }
}
.mf-try__quote__text:before,
.mf-try__quote__text:after {
  position: absolute;
  display: block;
  background-size: cover;
  content: "";
}
.mf-try__quote__text:before {
  width: 5.875rem;
  height: 9rem;
  top: calc(-1 * var(--quoteOffset));
  right: 5.125rem;
  background-image: url(/images/max_mf/img_quote_deco01.webp);
}
@media screen and (max-width: 48rem) {
  .mf-try__quote__text:before {
    width: 3.3125rem;
    height: 5.0625rem;
    right: 1.0625rem;
  }
}
.mf-try__quote__text:after {
  width: min(32.4375rem, 86.0317460317%);
  right: 0;
  left: 0;
  bottom: 0;
  margin-right: auto;
  margin-left: auto;
  background-image: url(../images/max_mf/img_quote_deco02.webp);
  aspect-ratio: 519/131;
}
@media screen and (max-width: 48rem) {
  .mf-try__quote__text:after {
    width: min(16.9375rem, 86.0317460317%);
    background-image: url(../images/max_mf/img_quote_deco02_sp.webp);
    aspect-ratio: 542/157;
  }
}
.mf-try__quote__text span {
  margin-bottom: 2.25rem;
  font-size: 1.25rem;
  line-height: 1.85;
  font-weight: 600;
  color: var(--color-blue-10);
}
@media screen and (max-width: 48rem) {
  .mf-try__quote__text span {
    margin-bottom: 1.75rem;
    font-size: 1rem;
    line-height: 1.6875;
  }
}
.mf-try__quote__footer {
  margin-top: 0.9375rem;
  font-size: 0.75rem;
  line-height: 1;
  text-align: right;
}
@media screen and (max-width: 48rem) {
  .mf-try__quote__footer {
    margin-top: 0.8125rem;
    font-size: 0.5625rem;
    line-height: 1;
  }
}
.mf-try__quote__cite {
  font-style: normal;
}
.mf-coupon {
  --content: min(710 / var(--browserFontSize) * 1rem, 100% - var(--gap) * 2);
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  padding-top: 3.125rem;
  padding-bottom: 3.375rem;
  background-color: var(--color-blue-20);
  background-image: linear-gradient(
    to bottom,
    var(--color-blue-30),
    var(--color-blue-10)
  );
}
@media screen and (max-width: 48rem) {
  .mf-coupon {
    padding-top: 1.25rem;
    padding-bottom: 1.8125rem;
  }
}
.mf-coupon > * {
  grid-column: content;
}
.mf-coupon__img {
  margin-bottom: 3.125rem;
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-coupon__img {
    margin-bottom: 1.25rem;
  }
}
.mf-coupon__anchor {
  display: grid;
  place-items: center;
  margin-bottom: 3.125rem;
}
@media screen and (max-width: 48rem) {
  .mf-coupon__anchor {
    margin-bottom: 1.3125rem;
  }
}
.mf-coupon__anchor a {
  position: relative;
  display: block;
  width: min(300px, 100%);
  padding-top: 0.9375rem;
  padding-bottom: 1.0625rem;
  background-image: linear-gradient(257deg, #cfaf2a, #feef89 50%, #cfaf2a);
  font-size: 1.5625rem;
  line-height: 1.48;
  font-weight: 700;
  color: var(--color-blue-10);
  text-align: center;
  text-decoration: none;
  border-radius: var(--border-radius-infinity);
}
.mf-coupon__anchor a:after {
  position: absolute;
  display: block;
  width: 1.25rem;
  height: 0.625rem;
  top: 0;
  right: 1.4375rem;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  background-color: currentColor;
  -webkit-mask-image: var(--arrow-image);
  mask-image: var(--arrow-image);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  rotate: -90deg;
  content: "";
}
.mf-coupon__notes {
  margin-left: 1em;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-light);
  list-style-type: "・";
}
.mf-coupon__caution {
  margin-top: 1.125rem;
  font-size: 1.125rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--color-light);
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-coupon__caution {
    font-size: 0.875rem;
    line-height: 1.5;
    text-align: left;
  }
}
.mf-product {
  --content: min(920 / var(--browserFontSize) * 1rem, 100% - var(--gap) * 2);
  display: grid;
  grid-template-columns:
    [full-start] var(--full) [content-start] var(--content) [content-end] var(
      --full
    )
    [full-end];
  padding-top: 40px;
  padding-bottom: 100px;
}
@media screen and (max-width: 48rem) {
  .mf-product {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.mf-product > * {
  grid-column: content;
}
.mf-product__heading {
  margin-bottom: 5rem;
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-product__heading {
    margin-bottom: 2.5rem;
  }
}
.mf-product__tech {
  text-align: center;
}
@media screen and (max-width: 48rem) {
  .mf-product__tech {
    grid-column: full;
  }
}
.mf-product__features {
  margin-top: 5.75rem;
}
@media screen and (max-width: 48rem) {
  .mf-product__features {
    margin-top: 2rem;
  }
}
.mf-product__subHeading {
  display: flex;
  justify-content: space-between;
  column-gap: 1rem;
  margin-bottom: 2.5rem;
  padding-bottom: 0.6875rem;
  border-bottom-width: var(--border-width-lg);
  border-bottom-style: solid;
  border-bottom-color: var(--color-blue-40);
}
@media screen and (max-width: 48rem) {
  .mf-product__subHeading {
    margin-bottom: 1.875rem;
    padding-bottom: 0.5rem;
    font-size: 0.9375rem;
    line-height: 1.7333333333;
  }
}
* + .mf-product__subHeading {
  margin-top: 5.75rem;
}
@media screen and (max-width: 48rem) {
  * + .mf-product__subHeading {
    margin-top: 2rem;
  }
}
.mf-product__subHeading__text {
  font-size: 1.5625rem;
  line-height: 1.48;
  letter-spacing: 0.1em;
  font-weight: 600;
  color: var(--color-blue-40);
}
@media screen and (max-width: 48rem) {
  .mf-product__subHeading__text {
    font-size: 0.9375rem;
    line-height: 1.7333333333;
  }
}
.mf-product__subHeading__toggle {
  position: relative;
  display: flex;
  width: fit-content;
  font-size: 1.25rem;
  line-height: 1.6;
  font-weight: 600;
  color: var(--color-blue-40);
}
@media screen and (max-width: 48rem) {
  .mf-product__subHeading__toggle {
    font-size: 0.9375rem;
    line-height: 1.6666666667;
  }
}
.mf-product__subHeading__toggle__icon {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: 1.875rem;
  height: 1.875rem;
  margin-top: 0.125rem;
  margin-right: 0.375rem;
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: currentColor;
  border-radius: 50%;
}
@media screen and (max-width: 48rem) {
  .mf-product__subHeading__toggle__icon {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 0.25rem;
  }
}
.mf-product__subHeading__toggle__icon:before,
.mf-product__subHeading__toggle__icon:after {
  grid-column: 1/-1;
  grid-row: 1/-1;
  display: block;
  width: 1rem;
  height: 0.125rem;
  background-color: currentColor;
  transition-property: rotate;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-product__subHeading__toggle__icon:before,
  .mf-product__subHeading__toggle__icon:after {
    width: 0.75rem;
    height: 0.125rem;
  }
}
.mf-product__subHeading__toggle:not(.is-open)
  .mf-product__subHeading__toggle__icon:after {
  rotate: 90deg;
}
.mf-feature {
  padding-bottom: 2.5rem;
  border-bottom-width: var(--border-width-lg);
  border-bottom-style: solid;
  border-bottom-color: var(--color-blue-40);
  transition-property: padding;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
  overflow: hidden;
  padding-right: 10px;
}
.mf-feature[open]:not([data-animation="closing"]) {
  padding-bottom: 6.25rem;
}
@media screen and (max-width: 48rem) {
  .mf-feature {
    padding-bottom: 1.875rem;
    padding-right: 25px;
  }
  .mf-feature[open]:not([data-animation="closing"]) {
    padding-bottom: 1.875rem;
  }
}
@media screen and (max-width: 550px) {
  .mf-feature {
    padding-bottom: 1.875rem;
    padding-right: 10px;
  }
}
* + .mf-feature {
  margin-top: 2.5rem;
}

@media screen and (max-width: 48rem) {
  * + .mf-feature {
    margin-top: 1.875rem;
  }
}
.mf-feature__label {
  --toggleSize: 1.875rem;
  display: grid;
  align-items: center;
  grid-template-columns:
    [num] 6.25rem [sub-text main-text] 1fr [toggle] var(--toggleSize)
    var(--gap);
  grid-template-rows: [num-start toggle-start] 1fr [sub-text] max-content [main-text] max-content 1fr [num-end toggle-end];
  column-gap: 2rem;
  color: var(--color-blue-40);
  word-break: keep-all;
}
@media screen and (max-width: 48rem) {
  .mf-feature__label {
    --toggleSize: 1rem;
    grid-template-columns: [num] 3.5rem [sub-text main-text] 1fr [toggle] calc(
        var(--toggleSize) + 0.625rem
      );
    grid-template-rows: [num-start toggle-start] 1fr [sub-text] max-content [main-text] max-content 1fr [num-end toggle-end];
    column-gap: 1rem;
  }
}
.mf-feature__label__num {
  grid-area: num;
  display: grid;
  place-items: center;
  width: 6.25rem;
  height: 6.25rem;
  padding: 0.25rem 0.625rem 1rem;
  background-color: var(--color-blue-40);
  font-size: 3.75rem;
  line-height: 1;
  color: var(--color-light);
  border-radius: 50%;
  overflow: hidden;
}
@media screen and (max-width: 48rem) {
  .mf-feature__label__num {
    width: 3.5rem;
    height: 3.5rem;
    padding-bottom: 0.625rem;
    font-size: 2.1875rem;
    line-height: 1;
  }
}
.mf-feature__label__sub {
  grid-area: sub-text;
  margin-bottom: 0.375rem;
  font-size: 1.125rem;
  line-height: 1.3333333333;
  width: fit-content;
}
@media screen and (max-width: 48rem) {
  .mf-feature__label__sub {
    font-size: 0.875rem;
    line-height: 1.1428571429;
  }
}
.mf-feature__label__main {
  grid-area: main-text;
  font-size: 1.75rem;
  line-height: 1.4285714286;
  width: fit-content;
}
@media screen and (max-width: 48rem) {
  .mf-feature__label__main {
    font-size: 1.25rem;
    line-height: 1.3;
  }
}
.mf-feature__label__toggle {
  grid-area: toggle;
  align-self: center;
  display: grid;
  place-items: center;
  width: var(--toggleSize);
  height: var(--toggleSize);
  background-color: var(--color-light);
  border-radius: 50%;
  border: solid var(--color-blue-40) 2px;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 48rem) {
  .mf-feature__label__toggle {
    width: 50px;
    height: 50px;
  }
}
@media screen and (max-width: 550px) {
  .mf-feature__label__toggle {
    width: 30px;
    height: 30px;
  }
}
.mf-feature__label__toggle:before,
.mf-feature__label__toggle:after {
  grid-column: 1/-1;
  grid-row: 1/-1;
  display: block;
  width: 1.875rem;
  height: 0.25rem;
  background-color: currentColor;
  transition-property: rotate;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-feature__label__toggle:before,
  .mf-feature__label__toggle:after {
    width: 1rem;
    height: 0.125rem;
  }
}
.mf-feature:not([open]) .mf-feature__label__toggle:after {
  rotate: 90deg;
}
.mf-feature__detail {
  margin-top: 1.6875rem;
  font-size: 1.125rem;
  line-height: 1.8888888889;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 48rem) {
  .mf-feature__detail {
    font-size: 0.9375rem;
    line-height: 1.6;
    letter-spacing: 0;
  }
}
@media print, screen and (min-width: 48.0625rem) {
  .mf-feature__detail .font-large {
    font-size: 1.3125rem;
    line-height: 1.8095238095;
  }
}
.mf-feature.item01 .mf-feature__detail {
  width: min(50.1875rem, 100%);
  margin-top: 4.75rem;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 48rem) {
  .mf-feature.item01 .mf-feature__detail {
    margin-top: 1.875rem;
  }
}
.mf-feature__heading4 {
  color: var(--color-light);
  text-align: center;
}
.mf-feature.item01 .mf-feature__heading4 {
  font-weight: 400;
}
@media print, screen and (min-width: 48.0625rem) {
  .mf-feature.item01 .mf-feature__heading4 {
    margin-bottom: 1.625rem;
    padding: 0.5rem 0.625rem 0.5625rem;
    background-color: var(--color-blue-40);
    font-size: 1.5625rem;
    line-height: 1.48;
  }
}
@media screen and (max-width: 48rem) {
  .mf-feature.item01 .mf-feature__heading4 {
    width: fit-content;
    margin-right: auto;
    margin-bottom: 1.125rem;
    margin-left: auto;
  }
  .mf-feature.item01 .mf-feature__heading4 span {
    display: block;
    padding: 0.0625rem 0.625rem 0.1875rem;
    background-color: var(--color-blue-40);
    font-size: 1.25rem;
    line-height: 1.3;
  }
  .mf-feature.item01 .mf-feature__heading4 span + span {
    margin-top: 0.625rem;
  }
}
.mf-feature.item01 * + .mf-feature__heading4 {
  margin-top: 6.375rem;
}
@media screen and (max-width: 48rem) {
  .mf-feature.item01 * + .mf-feature__heading4 {
    margin-top: 3.125rem;
  }
}
.mf-feature.item02 .mf-feature__heading4 {
  margin-bottom: 1.75rem;
  padding-top: 1.125rem;
  padding-bottom: 1.1875rem;
  background-color: var(--color-blue-40);
  font-size: 1.5625rem;
  line-height: 1.48;
  font-weight: 500;
  border-radius: var(--border-radius-md);
}
.mf-feature.item02 .mf-feature__heading4 span {
  position: relative;
  top: 0.0625rem;
  font-size: 1.875rem;
  line-height: 0.8333333333;
}
@media screen and (max-width: 48rem) {
  .mf-feature.item02 .mf-feature__heading4 {
    margin-bottom: 0.8125rem;
    padding-top: 0.375rem;
    padding-bottom: 0.5rem;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
  }
  .mf-feature.item02 .mf-feature__heading4 span {
    font-size: 1.25rem;
    line-height: 0.9;
  }
}
.mf-feature.item02 * + .mf-feature__heading4 {
  margin-top: 6rem;
}
@media screen and (max-width: 48rem) {
  .mf-feature.item02 * + .mf-feature__heading4 {
    margin-top: 3.25rem;
  }
}
.mf-feature__balloon {
  position: relative;
  margin-top: 3.4375rem;
  padding: 5.625rem 1.25rem 3.25rem;
  background-color: var(--color-blue-90);
  text-align: center;
  border-radius: var(--border-radius-xl);
}
@media screen and (max-width: 48rem) {
  .mf-feature__balloon {
    margin-top: 2rem;
    padding: 2.5rem 0.75rem 1.5rem;
    border-radius: var(--border-radius-lg);
  }
}
.mf-feature__balloon:before {
  position: absolute;
  display: block;
  width: 2.8125rem;
  height: 1.875rem;
  right: calc(50% - 15rem);
  bottom: 100%;
  background-color: inherit;
  clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
  content: "";
}
@media screen and (max-width: 48rem) {
  .mf-feature__balloon:before {
    width: 1.875rem;
    height: 1.25rem;
    right: calc(50% - 7.5rem);
  }
}
.mf-otherFeature {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
  overflow: hidden;
}
* + .mf-otherFeature {
  margin-top: 3.125rem;
}
* + .mf-otherFeature[open]:not([data-animation="closing"]) {
  margin-top: 6.25rem;
}
@media screen and (max-width: 48rem) {
  * + .mf-otherFeature {
    margin-top: 1.875rem;
  }
  * + .mf-otherFeature[open]:not([data-animation="closing"]) {
    margin-top: 1.875rem;
  }
}
.mf-otherFeature__button {
  --icon-width: 1.875rem;
  --icon-pos: 1.125rem;
  position: relative;
  width: min(21.25rem, 100%);
  margin-right: auto;
  margin-left: auto;
  padding-top: 0.875rem;
  padding-right: calc(var(--icon-width) + var(--icon-pos) + 0.625rem);
  padding-bottom: 0.9375rem;
  padding-left: var(--gap);
  font-size: 1.5625rem;
  line-height: 1.48;
  font-weight: 700;
  text-align: center;
  background-color: var(--color-blue-40);
  border-width: var(--border-width-lg);
  border-style: solid;
  border-color: var(--color-blue-40);
  color: var(--color-light);
  border-radius: var(--border-radius-md);
  transition-property: background-color, color, margin;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
@media screen and (max-width: 48rem) {
  .mf-otherFeature__button {
    width: min(17.5rem, 100%);
    padding-top: 0.8125rem;
    padding-bottom: 0.8125rem;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}
@media (any-hover: hover) {
  .mf-otherFeature__button:hover {
    background-color: var(--color-light);
    color: var(--color-blue-40);
  }
}
.mf-otherFeature__button:before,
.mf-otherFeature__button:after {
  position: absolute;
  display: block;
  width: 1.875rem;
  height: 0.25rem;
  top: 0;
  right: var(--icon-pos);
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  background-color: currentColor;
  content: "";
  transition-property: rotate;
  transition-duration: 0.3s;
  transition-timing-function: var(--easing);
}
.mf-otherFeature:not([open]) .mf-otherFeature__button:after {
  rotate: 90deg;
}
.mf-otherFeature__detail {
  margin-top: 7rem;
  font-size: 1.125rem;
  line-height: 1.8888888889;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 48rem) {
  .mf-otherFeature__detail {
    margin-top: 1.5rem;
    font-size: 0.9375rem;
    line-height: 1.6;
    letter-spacing: 0;
  }
}
.mf-otherFeature__heading4 {
  display: grid;
  margin-bottom: 1.25rem;
  color: var(--color-blue-40);
  font-weight: 400;
}
@media screen and (max-width: 48rem) {
  .mf-otherFeature__heading4 {
    margin-bottom: 0.8125rem;
  }
}
.mf-otherFeature__heading4__sub {
  font-size: 1.375rem;
  line-height: 1.3636363636;
}
@media screen and (max-width: 48rem) {
  .mf-otherFeature__heading4__sub {
    font-size: 0.875rem;
    line-height: 1.2857142857;
  }
}
.mf-otherFeature__heading4__main {
  font-size: 1.75rem;
  line-height: 1.2142857143;
}
@media screen and (max-width: 48rem) {
  .mf-otherFeature__heading4__main {
    font-size: 1.25rem;
    line-height: 1.3;
  }
}