@charset "UTF-8";
/* Light */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-Light.woff2") format("woff2"), url("../font/NotoSansJP-Light.woff") format("woff");
  font-weight: 300;
  font-display: swap;
}
/* Regular */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-Regular.woff2") format("woff2"), url("../font/NotoSansJP-Regular.woff") format("woff");
  font-weight: 400;
  font-display: swap;
}
/* Medium */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-Medium.woff2") format("woff2"), url("../font/NotoSansJP-Medium.woff") format("woff");
  font-weight: 500;
  font-display: swap;
}
/* SemiBold */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-SemiBold.woff2") format("woff2"), url("../font/NotoSansJP-SemiBold.woff") format("woff");
  font-weight: 600;
  font-display: swap;
}
/* Bold */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-Bold.woff2") format("woff2"), url("../font/NotoSansJP-Bold.woff") format("woff");
  font-weight: 700;
  font-display: swap;
}
/* Black */
@font-face {
  font-family: "Noto Sans JP";
  src: url("../font/NotoSansJP-Black.woff2") format("woff2"), url("../font/NotoSansJP-Black.woff") format("woff");
  font-weight: 900;
  font-display: swap;
}
:root {
  --font-weight-base: 400;
  --line-height-base: 1.43;
  --font-family-base: "Noto Sans JP", sans-serif;
  --font-color-black: #4c4948;
  --font-color-d-black: #000;
  --font-color-gray: #949291;
  --font-color-white: #fff;
  --font-color-accent-ud-green: #138a2b;
  --font-color-accent-d-green: #2f636d;
  --font-color-accent-green: #5cb531;
  --font-color-accent-orange: #f9c158;
  --font-color-accent-blue: #58abd4;
  --bg-color-green: #5cb531;
  --bg-color-white: #fff;
  --bg-color-beige: #e6ddc2;
  --grad-color-l-green: #f1f9ed;
  --grad-color-d-green: #a9d98e;
}

/* ===========================================
共通設定
=========================================== */
body {
  font-size: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
  line-height: var(--line-height-base);
  color: var(--font-color-black);
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-base);
  position: relative;
}

.buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media screen and (min-width: 769px) {
  .hidden-pc {
    display: none;
  }
}

@media not screen and (min-width: 769px) {
  .hidden-sp {
    display: none;
  }
}

.inline-block {
  display: inline-block;
  font-weight: inherit;
}

.inner {
  padding-inline: clamp(10.24px, 3.2vw, 18.016px);
  max-width: calc(clamp(299.52px, 93.6vw, 526.968px) + clamp(10.24px, 3.2vw, 18.016px) * 2);
  margin-inline: auto;
}
@media screen and (min-width: 769px) {
  .inner {
    padding-inline: 0;
    max-width: initial;
  }
}

@media screen and (min-width: 769px) {
  .pc-inner {
    padding-inline: clamp(40px, 3.125vw, 60px);
    max-width: calc(clamp(1200px, 93.75vw, 1800px) + clamp(40px, 3.125vw, 60px) * 2);
    margin-inline: auto;
  }
}

.prevent-scroll {
  overflow: hidden;
}

.button-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(11.0933333333px, 3.4666666667vw, 19.5173333333px);
  background: var(--bg-color-green);
  padding-top: clamp(21.3333333333px, 6.6666666667vw, 37.5333333333px);
  padding-bottom: clamp(21.3333333333px, 6.6666666667vw, 37.5333333333px);
  padding-left: clamp(20.48px, 6.4vw, 36.032px);
  padding-right: clamp(20.48px, 6.4vw, 36.032px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  -webkit-box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
          box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  width: 100%;
}

@media screen and (min-width: 769px) {
  row-gap: clamp(8px, 0.625vw, 12px);
  -webkit-column-gap: clamp(37.3333333333px, 2.9166666667vw, 56px);
  -moz-column-gap: clamp(37.3333333333px, 2.9166666667vw, 56px);
  column-gap: clamp(37.3333333333px, 2.9166666667vw, 56px);
  max-width: clamp(1200px, 93.75vw, 1800px);
  padding-top: clamp(40px, 3.125vw, 60px);
  padding-bottom: clamp(40px, 3.125vw, 60px);
  padding-left: clamp(40px, 3.125vw, 60px);
  padding-right: clamp(40px, 3.125vw, 60px);
  border-radius: clamp(16px, 1.25vw, 24px);
  -webkit-box-shadow: 0 clamp(8px, 0.625vw, 12px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.25);
  box-shadow: 0 clamp(8px, 0.625vw, 12px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.25);
}

.button-reveal {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(11.0933333333px, 3.4666666667vw, 19.5173333333px);
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: max-height 0.4s ease, opacity 0.35s ease;
  transition: max-height 0.4s ease, opacity 0.35s ease;
}
.button-wrapper.is-expanded .button-reveal {
  max-height: 400px;
  opacity: 1;
}

.button-reveal__text {
  color: var(--font-color-white);
  font-size: clamp(11.9466666667px, 3.7333333333vw, 21.0186666667px);
  text-align: center;
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
  opacity: 0;
  -webkit-transition: opacity 0.3s ease 0.1s, -webkit-transform 0.3s ease 0.1s;
  transition: opacity 0.3s ease 0.1s, transform 0.3s ease 0.1s;
}
.button-wrapper.is-expanded .button-reveal__text {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
@media screen and (min-width: 769px) {
  .button-reveal__text {
    font-size: clamp(18.6666666667px, 1.4583333333vw, 28px);
  }
}

.button-reveal__qr {
  max-width: clamp(120px, 37.5vw, 211px);
  width: 100%;
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
  opacity: 0;
  -webkit-transition: opacity 0.3s ease 0.15s, -webkit-transform 0.3s ease 0.15s;
  transition: opacity 0.3s ease 0.15s, transform 0.3s ease 0.15s;
}
.button-wrapper.is-expanded .button-reveal__qr {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}

.button {
  display: grid;
  grid-template-columns: clamp(40.1066666667px, 12.5333333333vw, 70.5626666667px) 1fr;
  grid-template-rows: auto auto;
  row-gap: clamp(11.0933333333px, 3.4666666667vw, 19.5173333333px);
  -webkit-column-gap: clamp(18.7733333333px, 5.8666666667vw, 33.0293333333px);
  -moz-column-gap: clamp(18.7733333333px, 5.8666666667vw, 33.0293333333px);
  column-gap: clamp(18.7733333333px, 5.8666666667vw, 33.0293333333px);
  max-width: clamp(299.52px, 93.6vw, 526.968px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .button {
    grid-template-columns: clamp(81.3333333333px, 6.3541666667vw, 122px) -webkit-max-content;
    grid-template-columns: clamp(81.3333333333px, 6.3541666667vw, 122px) max-content;
    grid-template-rows: auto auto;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}
@media (hover: hover) and (pointer: fine) {
  .button:hover {
    -webkit-transform: translateY(clamp(4.2666666667px, 1.3333333333vw, 7.5066666667px));
            transform: translateY(clamp(4.2666666667px, 1.3333333333vw, 7.5066666667px));
  }
}
@media screen and (hover: hover) and (pointer: fine) and (min-width: 769px) {
  .button:hover {
    -webkit-transform: translateY(clamp(3.3333333333px, 0.2604166667vw, 5px));
            transform: translateY(clamp(3.3333333333px, 0.2604166667vw, 5px));
  }
}

.button__title {
  grid-column: 1/3;
  grid-row: 1/2;
  color: var(--font-color-white);
  text-align: center;
  font-size: clamp(20.48px, 6.4vw, 36.032px);
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .button__title {
    grid-column: 2/3;
    grid-row: 1/2;
    display: inline-block;
    font-size: clamp(42.6666666667px, 3.3333333333vw, 64px);
    text-shadow: 0 clamp(2.6666666667px, 0.2083333333vw, 4px) clamp(2.6666666667px, 0.2083333333vw, 4px) rgba(0, 0, 0, 0.25);
  }
}

.button__text {
  grid-column: 2/3;
  grid-row: 2/3;
  color: var(--font-color-white);
  font-size: clamp(11.9466666667px, 3.7333333333vw, 21.0186666667px);
  white-space: nowrap;
}
@media screen and (min-width: 769px) {
  .button__text {
    grid-column: 2/3;
    grid-row: 2/3;
    font-size: clamp(18.6666666667px, 1.4583333333vw, 28px);
  }
}

.button__icon {
  grid-column: 1/2;
  grid-row: 2/3;
  max-width: clamp(40.1066666667px, 12.5333333333vw, 70.5626666667px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .button__icon {
    grid-column: 1/2;
    grid-row: 1/3;
    max-width: clamp(81.3333333333px, 6.3541666667vw, 122px);
  }
}

@media screen and (min-width: 769px) {
  .return-button-wrapper {
    position: absolute;
    z-index: 10;
    top: clamp(-10px, -0.5208333333vw, -6.6666666667px);
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media screen and (min-width: 769px) {
  .return-button {
    position: relative;
    display: inline-block;
    width: clamp(53.3333333333px, 4.1666666667vw, 80px);
    height: clamp(53.3333333333px, 4.1666666667vw, 80px);
    border-radius: 50%;
    background: var(--bg-color-green);
    -webkit-box-shadow: 0 clamp(8px, 0.625vw, 12px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.15);
            box-shadow: 0 clamp(8px, 0.625vw, 12px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .return-button:hover {
    opacity: 0.7;
  }
}
@media screen and (min-width: 769px) {
  .return-button::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -58%);
            transform: translate(-50%, -58%);
    width: clamp(32px, 2.5vw, 48px);
    height: clamp(18.6666666667px, 1.4583333333vw, 28px);
    background: var(--bg-color-white);
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
  }
}

.heading-area {
  padding-top: clamp(71.68px, 22.4vw, 126.112px);
  padding-bottom: clamp(80.2133333333px, 25.0666666667vw, 141.1253333333px);
}
@media screen and (min-width: 769px) {
  .heading-area {
    padding-top: 0;
    padding-bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
  }
}

.heading-wrapper {
  padding-top: clamp(9.3866666667px, 2.9333333333vw, 16.5146666667px);
  padding-bottom: clamp(10.24px, 3.2vw, 18.016px);
  background: rgba(255, 255, 255, 0.75);
}
@media screen and (min-width: 769px) {
  .heading-wrapper {
    padding-top: clamp(12.6666666667px, 0.9895833333vw, 19px);
    padding-bottom: clamp(16px, 1.25vw, 24px);
  }
}

.heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(5.12px, 1.6vw, 9.008px);
}
@media screen and (min-width: 769px) {
  .heading {
    gap: clamp(7.3333333333px, 0.5729166667vw, 11px);
  }
}
.heading.heading--green {
  color: var(--font-color-accent-green);
}

.heading__text {
  font-size: clamp(20.48px, 6.4vw, 36.032px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .heading__text {
    font-size: clamp(42.6666666667px, 3.3333333333vw, 64px);
  }
}

/* ===========================================
ヘッダー
=========================================== */
.header {
  background: var(--bg-color-white);
  height: clamp(54.6133333333px, 17.0666666667vw, 96.0853333333px);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}
@media screen and (min-width: 769px) {
  .header {
    height: clamp(66.6666666667px, 5.2083333333vw, 100px);
  }
}

.header__inner {
  padding-inline: clamp(10.24px, 3.2vw, 18.016px);
  height: 100%;
}
@media screen and (min-width: 769px) {
  .header__inner {
    padding-inline: clamp(6.6666666667px, 0.5208333333vw, 10px);
    max-width: calc(clamp(1266.6666666667px, 98.9583333333vw, 1900px) + clamp(6.6666666667px, 0.5208333333vw, 10px) * 2);
    margin-inline: auto;
  }
}

.header__content {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.header__logo {
  display: inline-block;
  line-height: 0;
}

.header__logo-link {
  display: inline-block;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  .header__logo-link:hover {
    opacity: 0.6;
  }
}

.header__logo-image {
  display: inline-block;
  width: clamp(34.1333333333px, 10.6666666667vw, 60.0533333333px);
}
@media screen and (min-width: 769px) {
  .header__logo-image {
    width: clamp(253.3333333333px, 19.7916666667vw, 380px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .header__logo-image {
    width: 40px;
  }
}

.header__hmb-button {
  display: inline-block;
  position: relative;
  z-index: 1002;
  cursor: pointer;
}

.hmb-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: var(--bg-color-green);
  padding: clamp(9.3866666667px, 2.9333333333vw, 16.5146666667px) clamp(4.2666666667px, 1.3333333333vw, 7.5066666667px) clamp(7.68px, 2.4vw, 13.512px);
  border-radius: clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px);
  width: clamp(40.96px, 12.8vw, 72.064px);
  height: clamp(40.96px, 12.8vw, 72.064px);
  -webkit-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  .hmb-button:hover {
    background-color: var(--font-color-accent-ud-green);
  }
}
@media screen and (min-width: 769px) {
  .hmb-button {
    display: none;
  }
}

.hmb-button__bar {
  width: 100%;
  height: clamp(5.12px, 1.6vw, 9.008px);
  background: var(--bg-color-white);
}

/* ===========================================
ドロワーメニュー
=========================================== */
.drawer-nav {
  position: fixed;
  z-index: 1001;
  overflow-y: scroll;
  scrollbar-width: none;
  top: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  right: -100%;
  width: clamp(256px, 80vw, 450.4px);
  height: calc(100vh - clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px));
  max-height: -webkit-max-content;
  max-height: -moz-max-content;
  max-height: max-content;
  padding-top: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
  padding-bottom: clamp(42.6666666667px, 13.3333333333vw, 75.0666666667px);
  background: var(--bg-color-green);
  border-radius: clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px);
  -webkit-transition: right 0.5s ease-in-out;
  transition: right 0.5s ease-in-out;
}
@media screen and (min-width: 769px) {
  .drawer-nav {
    position: relative;
    z-index: initial;
    overflow: initial;
    top: initial;
    right: initial;
    width: initial;
    height: 100%;
    max-height: initial;
    padding-top: initial;
    padding-bottom: initial;
    background: initial;
    border-radius: initial;
  }
}
.drawer-nav.is-open {
  right: clamp(10.24px, 3.2vw, 18.016px);
}

.drawer-nav__inner {
  padding-left: clamp(20.48px, 6.4vw, 36.032px);
  padding-right: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
}
@media screen and (min-width: 769px) {
  .drawer-nav__inner {
    padding-left: 0;
    padding-right: 0;
    height: 100%;
  }
}

.drawer-nav__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28.16px, 8.8vw, 49.544px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 769px) {
  .drawer-nav__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0;
    height: 100%;
  }
}

.drawer-nav__item {
  height: 100%;
}
@media screen and (min-width: 769px) {
  .drawer-nav__item:nth-of-type(1) .drawer-nav__link::before {
    display: none;
  }
  .drawer-nav__item:has(.drawer-nav__sub-list) {
    position: relative;
  }
  .drawer-nav__item:has(.drawer-nav__sub-list):hover .drawer-nav__sub-list, .drawer-nav__item:has(.drawer-nav__sub-list):focus-within .drawer-nav__sub-list {
    -webkit-transition: opacity 0.3s ease-in-out, clip-path 0.5s ease-in-out, visibility 0.3s;
    transition: opacity 0.3s ease-in-out, clip-path 0.5s ease-in-out, visibility 0.3s;
    clip-path: inset(0 0 0 0);
    opacity: 1;
    visibility: visible;
  }
}

.drawer-nav__link,
.drawer-nav__sub-link {
  color: var(--font-color-white);
  font-weight: 500;
  line-height: 1.64;
  text-decoration: underline;
  text-underline-offset: clamp(1.7066666667px, 0.5333333333vw, 3.0026666667px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(9.3866666667px, 2.9333333333vw, 16.5146666667px);
}
@media screen and (min-width: 769px) {
  .drawer-nav__link,
  .drawer-nav__sub-link {
    position: relative;
    color: var(--font-color-accent-ud-green);
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none;
  }
}

@media screen and (min-width: 769px) {
  .drawer-nav__link {
    position: relative;
    min-width: clamp(186.6666666667px, 14.5833333333vw, 280px);
    height: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-inline: clamp(6.6666666667px, 0.5208333333vw, 10px);
    white-space: nowrap;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .drawer-nav__link:hover::after {
    width: clamp(66.6666666667px, 5.2083333333vw, 100px);
  }
}
@media screen and (min-width: 769px) {
  .drawer-nav__link::after {
    position: absolute;
    content: "";
    bottom: clamp(16.6666666667px, 1.3020833333vw, 25px);
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
    height: clamp(1.3333333333px, 0.1041666667vw, 2px);
    background: var(--font-color-accent-ud-green);
    -webkit-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;
  }
  .drawer-nav__link::before {
    position: absolute;
    z-index: 10;
    content: "";
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: clamp(1.3333333333px, 0.1041666667vw, 2px);
    height: clamp(16px, 1.25vw, 24px);
    background: var(--font-color-accent-ud-green);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .drawer-nav__link {
    min-width: auto;
    padding-inline: 20px;
  }
}

.drawer-nav__sub-list {
  margin-left: clamp(25.6px, 8vw, 45.04px);
  margin-top: clamp(29.0133333333px, 9.0666666667vw, 51.0453333333px);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(25.6px, 8vw, 45.04px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 769px) {
  .drawer-nav__sub-list {
    margin-left: 0;
    margin-top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: clamp(10.6666666667px, 0.8333333333vw, 16px);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    padding-top: clamp(12px, 0.9375vw, 18px);
    padding-bottom: clamp(28px, 2.1875vw, 42px);
    padding-left: clamp(16px, 1.25vw, 24px);
    padding-right: clamp(16px, 1.25vw, 24px);
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    min-height: clamp(120px, 9.375vw, 180px);
    background: var(--bg-color-white);
    clip-path: inset(0 0 100% 0);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 3s ease-in-out, clip-path 0.5s ease-in-out, visibility 3s;
    transition: opacity 3s ease-in-out, clip-path 0.5s ease-in-out, visibility 3s;
  }
}

@media screen and (min-width: 769px) {
  .drawer-nav__sub-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .drawer-nav__sub-link:hover::after {
    width: clamp(66.6666666667px, 5.2083333333vw, 100px);
  }
}
@media screen and (min-width: 769px) {
  .drawer-nav__sub-link::after {
    position: absolute;
    content: "";
    bottom: clamp(-2px, -0.1041666667vw, -1.3333333333px);
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
    height: clamp(1.3333333333px, 0.1041666667vw, 2px);
    background: var(--font-color-accent-ud-green);
    -webkit-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .drawer-nav__sub-link {
    text-align: center;
  }
}

.menu-overlay {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  inset: 0;
  backdrop-filter: blur(6px);
  background: rgba(241, 249, 237, 0.8);
  z-index: 1000;
  -webkit-transition: 1s ease;
  transition: 1s ease;
}
.menu-overlay.is-open {
  visibility: visible;
  opacity: 1;
}

/* ===========================================
ファーストビュー
=========================================== */
.fv {
  margin-top: clamp(54.6133333333px, 17.0666666667vw, 96.0853333333px);
  padding-top: clamp(29.0133333333px, 9.0666666667vw, 51.0453333333px);
  background: var(--bg-color-beige);
}
@media screen and (min-width: 769px) {
  .fv {
    margin-top: clamp(66.6666666667px, 5.2083333333vw, 100px);
    padding-top: 0;
    background: var(--bg-color-white);
  }
}

.fv__box {
  position: relative;
  background: var(--bg-color-white);
  padding-top: clamp(17.92px, 5.6vw, 31.528px);
  padding-bottom: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  text-align: center;
  overflow: hidden;
}
@media screen and (min-width: 769px) {
  .fv__box {
    background: url(../img/fv-image-pc.webp) no-repeat right center/cover;
    padding-top: clamp(72.6666666667px, 5.6770833333vw, 109px);
    padding-bottom: clamp(40.6666666667px, 3.1770833333vw, 61px);
    padding-left: clamp(40px, 3.125vw, 60px);
    padding-right: clamp(40px, 3.125vw, 60px);
    border-radius: 0;
  }
}
.fv__box::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  background: url(../img/fv-image.webp) no-repeat center center/contain;
}
@media screen and (min-width: 769px) {
  .fv__box::after {
    display: none;
  }
}

.fv__heading {
  position: relative;
  z-index: 1;
  color: var(--font-color-accent-green);
  font-size: clamp(23.8933333333px, 7.4666666667vw, 42.0373333333px);
  font-weight: 700;
  line-height: 1.46;
}
@media screen and (min-width: 769px) {
  .fv__heading {
    font-size: clamp(85.3333333333px, 6.6666666667vw, 128px);
  }
}

.fv__logo {
  position: relative;
  z-index: 1;
  margin-top: clamp(34.1333333333px, 10.6666666667vw, 60.0533333333px);
}
@media screen and (min-width: 769px) {
  .fv__logo {
    margin-top: clamp(72.6666666667px, 5.6770833333vw, 109px);
  }
}
.fv__logo img {
  max-width: clamp(41.8133333333px, 13.0666666667vw, 73.5653333333px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .fv__logo img {
    max-width: clamp(133.3333333333px, 10.4166666667vw, 200px);
  }
}

.fv__text {
  position: relative;
  z-index: 1;
  margin-top: clamp(8.5333333333px, 2.6666666667vw, 15.0133333333px);
  color: var(--font-color-accent-green);
  line-height: 1.17;
}
@media screen and (min-width: 769px) {
  .fv__text {
    margin-top: clamp(43.3333333333px, 3.3854166667vw, 65px);
    font-size: clamp(32px, 2.5vw, 48px);
    line-height: 1.46;
  }
}

.button-wrapper:has(.button-reveal) {
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  .button-wrapper:has(.button-reveal):hover {
    -webkit-transform: translateY(clamp(4.2666666667px, 1.3333333333vw, 7.5066666667px));
    transform: translateY(clamp(4.2666666667px, 1.3333333333vw, 7.5066666667px));
  }
  .button-wrapper:has(.button-reveal) .button:hover {
    -webkit-transform: none;
    transform: none;
  }
}
@media screen and (hover: hover) and (pointer: fine) and (min-width: 769px) {
  .button-wrapper:has(.button-reveal):hover {
    -webkit-transform: translateY(clamp(3.3333333333px, 0.2604166667vw, 5px));
    transform: translateY(clamp(3.3333333333px, 0.2604166667vw, 5px));
  }
}

.fv__buttons {
  padding-top: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  padding-bottom: clamp(34.9866666667px, 10.9333333333vw, 61.5546666667px);
}
@media screen and (min-width: 769px) {
  .fv__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
about
=========================================== */
.about {
  background: url(../img/white-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .about {
    background: none;
    position: relative;
  }
}

.about__heading-area {
  background: url(../img/about-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .about__heading-area {
    background: none;
  }
}

.about__heading .heading__icon {
  width: clamp(23.04px, 7.2vw, 40.536px);
  height: clamp(22.1866666667px, 6.9333333333vw, 39.0346666667px);
}
@media screen and (min-width: 769px) {
  .about__heading .heading__icon {
    width: clamp(40.6666666667px, 3.1770833333vw, 61px);
    height: clamp(38.6666666667px, 3.0208333333vw, 58px);
  }
}

.about__content {
  padding-top: clamp(25.6px, 8vw, 45.04px);
}
@media screen and (min-width: 769px) {
  .about__content {
    background: url(../img/about-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(120px, 9.375vw, 180px);
    padding-bottom: clamp(26.6666666667px, 2.0833333333vw, 40px);
  }
}

.about__box {
  padding-top: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  padding-bottom: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  padding-left: clamp(10.24px, 3.2vw, 18.016px);
  padding-right: clamp(10.24px, 3.2vw, 18.016px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .about__box {
    padding-top: clamp(44px, 3.4375vw, 66px);
    padding-bottom: clamp(35.3333333333px, 2.7604166667vw, 53px);
    padding-left: clamp(26.6666666667px, 2.0833333333vw, 40px);
    padding-right: clamp(26.6666666667px, 2.0833333333vw, 40px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
  }
}

.about__text .is-d-green {
  color: var(--font-color-accent-d-green);
  font-weight: 900;
}
.about__text .is-green {
  color: var(--font-color-accent-green);
}
.about__text .is-orange {
  color: var(--font-color-accent-orange);
  font-weight: 900;
}
.about__text .is-blue {
  color: var(--font-color-accent-blue);
}

@media screen and (min-width: 769px) {
  .about__text-pc {
    text-align: center;
    font-size: clamp(32px, 2.5vw, 48px);
    line-height: 2;
  }
  .about__text-pc .is-big {
    font-size: clamp(42.6666666667px, 3.3333333333vw, 64px);
    font-weight: 700;
  }
}

.about__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .about__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
overview
=========================================== */
.overview {
  background: var(--bg-color-beige);
}
@media screen and (min-width: 769px) {
  .overview {
    background: none;
    position: relative;
  }
}

.overview__heading-area {
  background: url(../img/overview-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .overview__heading-area {
    background: none;
  }
}

.overview__heading .heading__icon {
  width: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .overview__heading .heading__icon {
    width: clamp(34.6666666667px, 2.7083333333vw, 52px);
    height: clamp(32.6666666667px, 2.5520833333vw, 49px);
  }
}

.overview__content {
  padding-top: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
}
@media screen and (min-width: 769px) {
  .overview__content {
    background: url(../img/overview-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(101.3333333333px, 7.9166666667vw, 152px);
    padding-bottom: clamp(18.6666666667px, 1.4583333333vw, 28px);
  }
}

.overview__box {
  margin-left: auto;
  margin-right: auto;
  padding-top: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  padding-bottom: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  padding-left: clamp(9.3866666667px, 2.9333333333vw, 16.5146666667px);
  padding-right: clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
  max-width: clamp(279.04px, 87.2vw, 490.936px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .overview__box {
    min-height: clamp(533.3333333333px, 41.6666666667vw, 800px);
    padding-top: clamp(33.3333333333px, 2.6041666667vw, 50px);
    padding-bottom: clamp(33.3333333333px, 2.6041666667vw, 50px);
    padding-left: clamp(80px, 6.25vw, 120px);
    padding-right: clamp(80px, 6.25vw, 120px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
    max-width: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

@media screen and (min-width: 769px) {
  .overview-table {
    border-collapse: collapse;
    width: clamp(533.3333333333px, 41.6666666667vw, 800px);
  }
}

.overview-table__row {
  grid-template-columns: clamp(93.0133333333px, 29.0666666667vw, 163.6453333333px) 1fr;
}
@media screen and (min-width: 769px) {
  .overview-table__row {
    grid-template-columns: clamp(173.3333333333px, 13.5416666667vw, 260px) 1fr;
  }
}

.overview-table__head {
  text-align: left;
  color: var(--font-color-gray);
  font-weight: 700;
  line-height: 2;
  width: clamp(93.0133333333px, 29.0666666667vw, 163.6453333333px);
}
.overview-table__head span {
  font-weight: inherit;
}
@media screen and (min-width: 769px) {
  .overview-table__head {
    padding-inline: clamp(8px, 0.625vw, 12px);
    border-top: 1px solid var(--font-color-black);
    border-bottom: 1px solid var(--font-color-black);
    border-left: 1px solid var(--font-color-black);
    font-size: clamp(16px, 1.25vw, 24px);
    color: var(--font-color-black);
    width: clamp(186.6666666667px, 14.5833333333vw, 280px);
  }
}

.overview-table__data {
  color: var(--font-color-gray);
  font-weight: 400;
  line-height: 2;
}
@media screen and (min-width: 769px) {
  .overview-table__data {
    padding-inline: clamp(8px, 0.625vw, 12px);
    border-top: 1px solid var(--font-color-black);
    border-bottom: 1px solid var(--font-color-black);
    border-left: 1px dashed var(--font-color-black);
    border-right: 1px solid var(--font-color-black);
    color: #4c4948;
    font-size: clamp(16px, 1.25vw, 24px);
    font-weight: 400;
  }
}
.overview-table__data .is-link {
  padding-left: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  position: relative;
}
@media screen and (min-width: 769px) {
  .overview-table__data .is-link {
    padding-left: clamp(20px, 1.5625vw, 30px);
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .overview-table__data .is-link:hover {
    opacity: 0.7;
  }
}
.overview-table__data .is-link::before {
  position: absolute;
  content: "";
  top: 50%;
  left: clamp(1.7066666667px, 0.5333333333vw, 3.0026666667px);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: clamp(16.2133333333px, 5.0666666667vw, 28.5253333333px);
  height: clamp(11.0933333333px, 3.4666666667vw, 19.5173333333px);
  background: url(../img/overview-mail-icon.webp) no-repeat center center/contain;
}
@media screen and (min-width: 769px) {
  .overview-table__data .is-link::before {
    width: clamp(16px, 1.25vw, 24px);
    height: clamp(13.3333333333px, 1.0416666667vw, 20px);
  }
}
.overview-table__data .is-link::after {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  height: clamp(0.8533333333px, 0.2666666667vw, 1.5013333333px);
  background: var(--font-color-gray);
}
@media screen and (min-width: 769px) {
  .overview-table__data .is-link::after {
    height: clamp(1.3333333333px, 0.1041666667vw, 2px);
  }
}

.overview-table__list {
  display: grid;
  grid-template-columns: 1fr;
}

.overview__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .overview__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
features
=========================================== */
.features {
  background: url(../img/white-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .features {
    background: none;
    position: relative;
  }
}

.features__heading-area {
  background: url(../img/feature-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .features__heading-area {
    background: none;
  }
}

.features__heading .heading__icon {
  width: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .features__heading .heading__icon {
    width: clamp(34.6666666667px, 2.7083333333vw, 52px);
    height: clamp(32.6666666667px, 2.5520833333vw, 49px);
  }
}

.features__content {
  padding-top: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
}
@media screen and (min-width: 769px) {
  .features__content {
    background: url(../img/feature-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(106.6666666667px, 8.3333333333vw, 160px);
    padding-bottom: clamp(13.3333333333px, 1.0416666667vw, 20px);
  }
}

.features__boxes {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20.48px, 6.4vw, 36.032px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 769px) {
  .features__boxes {
    grid-template-columns: repeat(4, clamp(280px, 21.875vw, 420px));
    gap: clamp(20px, 1.5625vw, 30px);
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__boxes {
    grid-template-columns: repeat(2, clamp(280px, 21.875vw, 420px));
  }
}

.features__box {
  max-width: clamp(279.04px, 87.2vw, 490.936px);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
}
@media screen and (min-width: 769px) {
  .features__box {
    max-width: initial;
    padding-top: clamp(53.3333333333px, 4.1666666667vw, 80px);
    padding-left: clamp(13.3333333333px, 1.0416666667vw, 20px);
    padding-right: clamp(13.3333333333px, 1.0416666667vw, 20px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.95);
    -webkit-box-shadow: 0 clamp(2.6666666667px, 0.2083333333vw, 4px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.15);
            box-shadow: 0 clamp(2.6666666667px, 0.2083333333vw, 4px) clamp(8px, 0.625vw, 12px) 0 rgba(0, 0, 0, 0.15);
  }
}
.features__box:nth-of-type(1) {
  padding-bottom: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(1) {
    padding-bottom: clamp(133.3333333333px, 10.4166666667vw, 200px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(1) {
    padding-bottom: 20px;
  }
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(1) .features__image {
    margin-top: clamp(106.6666666667px, 8.3333333333vw, 160px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(1) .features__image {
    margin-top: 20px;
  }
}
.features__box:nth-of-type(1) .features__image img {
  max-width: clamp(136.5333333333px, 42.6666666667vw, 240.2133333333px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(1) .features__image img {
    max-width: clamp(186.6666666667px, 14.5833333333vw, 280px);
  }
}
.features__box:nth-of-type(2) {
  padding-bottom: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(2) {
    padding-bottom: clamp(80px, 6.25vw, 120px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(2) {
    padding-bottom: 20px;
  }
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(2) .features__image {
    margin-top: clamp(117.3333333333px, 9.1666666667vw, 176px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(2) .features__image {
    margin-top: 20px;
  }
}
.features__box:nth-of-type(2) .features__image img {
  max-width: clamp(136.5333333333px, 42.6666666667vw, 240.2133333333px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(2) .features__image img {
    max-width: clamp(186.6666666667px, 14.5833333333vw, 280px);
  }
}
.features__box:nth-of-type(3) {
  padding-bottom: clamp(15.36px, 4.8vw, 27.024px);
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(3) {
    padding-bottom: clamp(80px, 6.25vw, 120px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(3) {
    padding-bottom: 20px;
  }
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(3) .features__image {
    margin-top: clamp(80px, 6.25vw, 120px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(3) .features__image {
    margin-top: 20px;
  }
}
.features__box:nth-of-type(3) .features__image img {
  max-width: clamp(61.44px, 19.2vw, 108.096px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(3) .features__image img {
    max-width: clamp(80px, 6.25vw, 120px);
  }
}
.features__box:nth-of-type(4) {
  padding-bottom: clamp(14.5066666667px, 4.5333333333vw, 25.5226666667px);
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(4) {
    padding-bottom: clamp(80px, 6.25vw, 120px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(4) {
    padding-bottom: 20px;
  }
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(4) .features__image {
    margin-top: clamp(126.6666666667px, 9.8958333333vw, 190px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .features__box:nth-of-type(4) .features__image {
    margin-top: 60px;
  }
}
.features__box:nth-of-type(4) .features__image img {
  max-width: clamp(71.68px, 22.4vw, 126.112px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .features__box:nth-of-type(4) .features__image img {
    max-width: clamp(80px, 6.25vw, 120px);
  }
}

@media screen and (min-width: 769px) {
  .feature__text-pc {
    text-align: center;
    color: var(--font-color-accent-d-green);
    font-size: clamp(16px, 1.25vw, 24px);
  }
  .feature__text-pc .is-big {
    font-weight: 900;
  }
}

.features__text {
  color: var(--font-color-accent-d-green);
  text-align: center;
  font-weight: 400;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

.features__sub-text {
  color: var(--font-color-accent-d-green);
  text-align: center;
  font-size: clamp(10.24px, 3.2vw, 18.016px);
  font-weight: 400;
}
@media screen and (min-width: 769px) {
  .features__sub-text {
    margin-top: clamp(16px, 1.25vw, 24px);
    font-size: clamp(16px, 1.25vw, 24px);
  }
}

.features__image {
  text-align: center;
  margin-top: clamp(10.24px, 3.2vw, 18.016px);
}

.features__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .features__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
mvv
=========================================== */
.mvv {
  background: var(--bg-color-beige);
}
@media screen and (min-width: 769px) {
  .mvv {
    background: none;
    position: relative;
  }
}

.mvv__heading-area {
  background: url(../img/mvv-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .mvv__heading-area {
    background: none;
  }
}

.mvv__heading .heading__icon {
  width: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .mvv__heading .heading__icon {
    width: clamp(34.6666666667px, 2.7083333333vw, 52px);
    height: clamp(32.6666666667px, 2.5520833333vw, 49px);
  }
}

.mvv__content {
  padding-top: clamp(28.16px, 8.8vw, 49.544px);
}
@media screen and (min-width: 769px) {
  .mvv__content {
    background: url(../img/mvv-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(148.6666666667px, 11.6145833333vw, 223px);
    padding-bottom: clamp(30px, 2.34375vw, 45px);
  }
}

.mvv__cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 769px) {
  .mvv__cards {
    grid-template-columns: repeat(3, clamp(293.3333333333px, 22.9166666667vw, 440px));
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: clamp(113.3333333333px, 8.8541666667vw, 170px);
  }
}
@media screen and (min-width: 769px) and (min-width: 769px) and (max-width: 1279px) {
  .mvv__cards {
    grid-template-columns: repeat(3, clamp(216px, 15.068vw + 100.123px, 293px));
    gap: clamp(20px, 18.2vw - 119.955px, 113px);
  }
}

.mvv-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20.48px, 6.4vw, 36.032px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 769px) {
  .mvv-card {
    grid-template-rows: -webkit-max-content 1fr;
    grid-template-rows: max-content 1fr;
    gap: clamp(12px, 0.9375vw, 18px);
  }
}

.mvv-card__heading-wrapper {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  background: var(--bg-color-white);
  width: clamp(136.5333333333px, 42.6666666667vw, 240.2133333333px);
  height: clamp(136.5333333333px, 42.6666666667vw, 240.2133333333px);
  border-radius: 50%;
}
@media screen and (min-width: 769px) {
  .mvv-card__heading-wrapper {
    background: rgba(255, 255, 255, 0.85);
    width: clamp(213.3333333333px, 16.6666666667vw, 320px);
    height: clamp(213.3333333333px, 16.6666666667vw, 320px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .mvv-card__heading-wrapper {
    width: 160px;
    height: 160px;
  }
}

.mvv-card__heading {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(-10deg);
          transform: translate(-50%, -50%) rotate(-10deg);
  font-size: clamp(27.3066666667px, 8.5333333333vw, 48.0426666667px);
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .mvv-card__heading {
    font-size: clamp(32px, 2.5vw, 48px);
  }
}

.mvv-card__body {
  background: var(--bg-color-white);
  padding-top: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
  padding-bottom: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
  padding-left: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
  padding-right: clamp(13.6533333333px, 4.2666666667vw, 24.0213333333px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  -webkit-box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
          box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
}
@media screen and (min-width: 769px) {
  .mvv-card__body {
    background: rgba(255, 255, 255, 0.85);
    height: 100%;
    padding-top: clamp(28.6666666667px, 2.2395833333vw, 43px);
    padding-bottom: clamp(34px, 2.65625vw, 51px);
    padding-left: clamp(13.3333333333px, 1.0416666667vw, 20px);
    padding-right: clamp(13.3333333333px, 1.0416666667vw, 20px);
    border-radius: clamp(16px, 1.25vw, 24px);
    -webkit-box-shadow: 0 clamp(2.6666666667px, 0.2083333333vw, 4px) clamp(2.6666666667px, 0.2083333333vw, 4px) 0 rgba(0, 0, 0, 0.25);
            box-shadow: 0 clamp(2.6666666667px, 0.2083333333vw, 4px) clamp(2.6666666667px, 0.2083333333vw, 4px) 0 rgba(0, 0, 0, 0.25);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .mvv-card__body {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.mvv-card__text {
  color: var(--font-color-d-black);
  text-align: center;
  line-height: 1;
}
@media screen and (min-width: 769px) {
  .mvv-card__text {
    font-size: clamp(16px, 1.25vw, 24px);
    line-height: 1.46;
  }
}
.mvv-card__text .is-highlight {
  font-size: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
  color: var(--font-color-accent-green);
}
@media screen and (min-width: 769px) {
  .mvv-card__text .is-highlight {
    font-size: clamp(21.3333333333px, 1.6666666667vw, 32px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .mvv-card__text .is-highlight {
    font-size: 16px;
  }
}

@media screen and (min-width: 769px) {
  .mvv-card__sub-text {
    margin-top: clamp(24px, 1.875vw, 36px);
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
  }
}

.mvv__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .mvv__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
photo
=========================================== */
.photo {
  background: url(../img/white-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .photo {
    background: none;
    position: relative;
  }
}

.photo__heading-area {
  background: url(../img/photo-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .photo__heading-area {
    background: none;
  }
}

.photo__heading .heading__icon {
  width: clamp(20.48px, 6.4vw, 36.032px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .photo__heading .heading__icon {
    width: clamp(40px, 3.125vw, 60px);
    height: clamp(40px, 3.125vw, 60px);
  }
}

.photo__content {
  padding-top: clamp(29.0133333333px, 9.0666666667vw, 51.0453333333px);
}
@media screen and (min-width: 769px) {
  .photo__content {
    background: url(../img/photo-heading-bg.webp) no-repeat right center/cover;
    padding-top: clamp(165.3333333333px, 12.9166666667vw, 248px);
    padding-bottom: clamp(88px, 6.875vw, 132px);
  }
}

.photo__box {
  padding-top: clamp(20.48px, 6.4vw, 36.032px);
  padding-bottom: clamp(20.48px, 6.4vw, 36.032px);
  padding-left: clamp(10.24px, 3.2vw, 18.016px);
  padding-right: clamp(10.24px, 3.2vw, 18.016px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
}
@media screen and (min-width: 769px) {
  .photo__box {
    padding-top: clamp(86.6666666667px, 6.7708333333vw, 130px);
    padding-bottom: clamp(106.6666666667px, 8.3333333333vw, 160px);
    padding-left: clamp(40px, 3.125vw, 60px);
    padding-right: clamp(40px, 3.125vw, 60px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
  }
}

.photo__text {
  color: var(--font-color-accent-d-green);
  text-align: center;
}
@media screen and (min-width: 769px) {
  .photo__text {
    font-size: clamp(24px, 1.875vw, 36px);
    line-height: 2;
  }
}

.photo__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .photo__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
system
=========================================== */
.system {
  background: var(--bg-color-beige);
}
@media screen and (min-width: 769px) {
  .system {
    background: none;
    position: relative;
  }
}

.system__heading-area {
  background: url(../img/system-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .system__heading-area {
    background: none;
  }
}

.system__heading .heading__icon {
  width: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .system__heading .heading__icon {
    width: clamp(34.6666666667px, 2.7083333333vw, 52px);
    height: clamp(32.6666666667px, 2.5520833333vw, 49px);
  }
}

.system__content {
  padding-top: clamp(28.16px, 8.8vw, 49.544px);
}
@media screen and (min-width: 769px) {
  .system__content {
    background: url(../img/system-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(100px, 7.8125vw, 150px);
    padding-bottom: clamp(20px, 1.5625vw, 30px);
  }
}

.system__box {
  padding-top: clamp(20.48px, 6.4vw, 36.032px);
  padding-bottom: clamp(20.48px, 6.4vw, 36.032px);
  padding-left: clamp(10.24px, 3.2vw, 18.016px);
  padding-right: clamp(10.24px, 3.2vw, 18.016px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
  -webkit-box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
          box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
}
@media screen and (min-width: 769px) {
  .system__box {
    padding-top: clamp(140px, 10.9375vw, 210px);
    padding-bottom: clamp(206.6666666667px, 16.1458333333vw, 310px);
    padding-left: clamp(40px, 3.125vw, 60px);
    padding-right: clamp(40px, 3.125vw, 60px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
  }
}

.system__text {
  text-align: center;
  color: var(--font-color-d-black);
}
@media screen and (min-width: 769px) {
  .system__text {
    font-size: clamp(24px, 1.875vw, 36px);
    line-height: 2;
  }
}

.system__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .system__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
works
=========================================== */
.works {
  background: url(../img/white-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .works {
    background: none;
    position: relative;
  }
}

.works__heading-area {
  background: url(../img/works-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .works__heading-area {
    background: none;
  }
}

.works__heading .heading__icon {
  width: clamp(19.6266666667px, 6.1333333333vw, 34.5306666667px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .works__heading .heading__icon {
    width: clamp(34.6666666667px, 2.7083333333vw, 52px);
    height: clamp(32.6666666667px, 2.5520833333vw, 49px);
  }
}

.works__content {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
}
@media screen and (min-width: 769px) {
  .works__content {
    background: url(../img/works-heading-bg.webp) no-repeat center center/cover;
    padding-top: clamp(100px, 7.8125vw, 150px);
    padding-bottom: clamp(20px, 1.5625vw, 30px);
  }
}

.works-box {
  padding-top: clamp(22.1866666667px, 6.9333333333vw, 39.0346666667px);
  padding-bottom: clamp(23.8933333333px, 7.4666666667vw, 42.0373333333px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 769px) {
  .works-box {
    padding-top: clamp(73.3333333333px, 5.7291666667vw, 110px);
    padding-bottom: clamp(73.3333333333px, 5.7291666667vw, 110px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
    grid-template-columns: clamp(266.6666666667px, 20.8333333333vw, 400px) clamp(533.3333333333px, 41.6666666667vw, 800px);
    grid-template-rows: -webkit-max-content 1fr;
    grid-template-rows: max-content 1fr;
    -webkit-column-gap: clamp(86.6666666667px, 6.7708333333vw, 130px);
       -moz-column-gap: clamp(86.6666666667px, 6.7708333333vw, 130px);
            column-gap: clamp(86.6666666667px, 6.7708333333vw, 130px);
    row-gap: clamp(35.3333333333px, 2.7604166667vw, 53px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .works-box {
    grid-template-columns: 200px 1fr;
    padding-left: 20px;
    padding-right: 20px;
    -webkit-column-gap: 40px;
       -moz-column-gap: 40px;
            column-gap: 40px;
    row-gap: 20px;
  }
}

.works-box__image {
  text-align: center;
}
@media screen and (min-width: 769px) {
  .works-box__image {
    grid-column: 1/2;
    grid-row: 1/3;
  }
}
.works-box__image img {
  max-width: clamp(227.84px, 71.2vw, 400.856px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .works-box__image img {
    max-width: 100%;
  }
}

.works-box__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 769px) {
  .works-box__title {
    grid-column: 2/3;
    grid-row: 1/2;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
  }
}

.works-box__title-main {
  color: var(--font-color-d-black);
  font-size: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
  font-weight: 600;
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  .works-box__title-main {
    color: var(--font-color-black);
    font-size: clamp(32px, 2.5vw, 48px);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: clamp(3.3333333333px, 0.2604166667vw, 5px);
  }
}

.works-box__title-sub {
  color: var(--font-color-d-black);
  font-weight: 600;
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  .works-box__title-sub {
    color: var(--font-color-black);
    font-size: clamp(32px, 2.5vw, 48px);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: clamp(3.3333333333px, 0.2604166667vw, 5px);
  }
}

.works-box__text {
  padding-left: clamp(20.48px, 6.4vw, 36.032px);
  padding-right: clamp(20.48px, 6.4vw, 36.032px);
  color: var(--font-color-d-black);
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  .works-box__text {
    grid-column: 2/3;
    grid-row: 2/3;
    color: var(--font-color-black);
    font-size: clamp(24px, 1.875vw, 36px);
    text-decoration: underline;
    text-underline-offset: clamp(3.3333333333px, 0.2604166667vw, 5px);
    padding-left: 0;
    padding-right: 0;
  }
}

.works__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .works__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
message
=========================================== */
.message {
  background: var(--bg-color-beige);
}
@media screen and (min-width: 769px) {
  .message {
    background: none;
    position: relative;
  }
}

.message__heading-area {
  background: url(../img/message-heading-bg.webp) no-repeat center center/cover;
}
@media screen and (min-width: 769px) {
  .message__heading-area {
    background: none;
  }
}

.message__heading {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.message__heading .heading__icon {
  width: clamp(20.48px, 6.4vw, 36.032px);
  height: clamp(20.48px, 6.4vw, 36.032px);
}
@media screen and (min-width: 769px) {
  .message__heading .heading__icon {
    width: clamp(33.3333333333px, 2.6041666667vw, 50px);
    height: clamp(33.3333333333px, 2.6041666667vw, 50px);
  }
}
.message__heading .heading__text {
  font-size: clamp(17.0666666667px, 5.3333333333vw, 30.0266666667px);
}
@media screen and (min-width: 769px) {
  .message__heading .heading__text {
    font-size: clamp(42.6666666667px, 3.3333333333vw, 64px);
  }
}

.message__content {
  padding-top: clamp(28.16px, 8.8vw, 49.544px);
}
@media screen and (min-width: 769px) {
  .message__content {
    background: url(../img/message-heading-bg.webp) no-repeat left center/cover;
    padding-top: clamp(100px, 7.8125vw, 150px);
    padding-bottom: clamp(20px, 1.5625vw, 30px);
  }
}

.message__box {
  padding-top: clamp(20.48px, 6.4vw, 36.032px);
  padding-bottom: clamp(20.48px, 6.4vw, 36.032px);
  padding-left: clamp(10.24px, 3.2vw, 18.016px);
  padding-right: clamp(10.24px, 3.2vw, 18.016px);
  border-radius: clamp(6.8266666667px, 2.1333333333vw, 12.0106666667px);
  background: var(--bg-color-white);
  -webkit-box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
          box-shadow: 0 clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) clamp(3.4133333333px, 1.0666666667vw, 6.0053333333px) 0 rgba(0, 0, 0, 0.25);
}
@media screen and (min-width: 769px) {
  .message__box {
    padding-top: clamp(113.3333333333px, 8.8541666667vw, 170px);
    padding-bottom: clamp(126.6666666667px, 9.8958333333vw, 190px);
    padding-left: clamp(20px, 1.5625vw, 30px);
    padding-right: clamp(20px, 1.5625vw, 30px);
    border-radius: clamp(16px, 1.25vw, 24px);
    background: rgba(255, 255, 255, 0.85);
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .message__box {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.message__text {
  color: var(--font-color-d-black);
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  .message__text {
    text-align: center;
    color: var(--font-color-black);
    font-size: clamp(24px, 1.875vw, 36px);
    line-height: 2;
  }
}

.message__buttons {
  padding-top: clamp(40.96px, 12.8vw, 72.064px);
  padding-bottom: clamp(47.7866666667px, 14.9333333333vw, 84.0746666667px);
}
@media screen and (min-width: 769px) {
  .message__buttons {
    padding-top: clamp(40px, 3.125vw, 60px);
    padding-bottom: clamp(40px, 3.125vw, 60px);
  }
}

/* ===========================================
footer
=========================================== */
.footer {
  padding-top: clamp(29.8666666667px, 9.3333333333vw, 52.5466666667px);
  padding-bottom: clamp(59.7333333333px, 18.6666666667vw, 105.0933333333px);
}
@media screen and (min-width: 769px) {
  .footer {
    padding-top: clamp(53.3333333333px, 4.1666666667vw, 80px);
    padding-bottom: clamp(13.3333333333px, 1.0416666667vw, 20px);
    position: relative;
  }
}

@media screen and (min-width: 769px) {
  .footer__inner {
    padding-inline: clamp(66.6666666667px, 5.2083333333vw, 100px);
    max-width: calc(clamp(1146.6666666667px, 89.5833333333vw, 1720px) + clamp(66.6666666667px, 5.2083333333vw, 100px) * 2);
    margin-inline: auto;
  }
}

.footer__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 769px) {
  .footer__content {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .footer__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 60px;
  }
}

@media screen and (min-width: 769px) {
  .footer__nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: clamp(160px, 12.5vw, 240px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .footer__nav {
    gap: 60px;
  }
}

@media screen and (min-width: 769px) {
  .footer__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: clamp(10.6666666667px, 0.8333333333vw, 16px);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
  }
}

@media screen and (min-width: 769px) {
  .footer__list-link {
    color: var(--font-color-accent-green);
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .footer__list-link:hover {
    opacity: 0.7;
  }
}

.footer__company-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 769px) {
  .footer__company-info {
    gap: clamp(66.6666666667px, 5.2083333333vw, 100px);
  }
}
@media screen and (min-width: 769px) and (max-width: 1279px) {
  .footer__company-info {
    width: 100%;
    gap: initial;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

@media screen and (min-width: 769px) {
  .footer-table__head {
    text-align: left;
    width: clamp(86.6666666667px, 6.7708333333vw, 130px);
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
    font-weight: 400;
  }
}

@media screen and (min-width: 769px) {
  .footer-table__data {
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
  }
  .footer-table__data .is-link {
    text-decoration: underline;
    text-underline-offset: clamp(3.3333333333px, 0.2604166667vw, 5px);
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
  }
}
@media screen and (min-width: 769px) and (hover: hover) and (pointer: fine) {
  .footer-table__data .is-link:hover {
    opacity: 0.7;
  }
}

.footer__logo {
  text-align: center;
}

.footer__logo-link {
  display: inline-block;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
@media (hover: hover) and (pointer: fine) {
  .footer__logo-link:hover {
    opacity: 0.6;
  }
}

.footer__logo-image {
  max-width: clamp(40.96px, 12.8vw, 72.064px);
  width: 100%;
}
@media screen and (min-width: 769px) {
  .footer__logo-image {
    max-width: clamp(100px, 7.8125vw, 150px);
  }
}

.footer__domain {
  margin-top: clamp(15.36px, 4.8vw, 27.024px);
  text-align: center;
  color: var(--font-color-d-black);
  font-size: clamp(8.5333333333px, 2.6666666667vw, 15.0133333333px);
  font-weight: 300;
}
@media screen and (min-width: 769px) {
  .footer__domain {
    margin-top: clamp(16px, 1.25vw, 24px);
    color: var(--font-color-accent-ud-green);
    font-size: clamp(13.3333333333px, 1.0416666667vw, 20px);
    font-weight: 700;
  }
}
.footer__domain span {
  font-weight: inherit;
}