@charset "UTF-8";
/**  Mixins */
/*------------------------------------*\
    breakpoint vars
\*------------------------------------*/
/*------------------------------------*\
    breakpoint mixin
\*------------------------------------*/
/** Break desktop first**/
:root {
  --base-width: 750;
}

@media (min-width: 768px) {
  :root {
    --base-width: 1920;
  }
}
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9;
  color: transparent;
  width: 32px;
  height: 92px;
  min-width: initial;
  border-radius: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0;
  transition: all 0.3s;
}
.slick-arrow:hover {
  opacity: 0.6;
}
.slick-arrow::before, .slick-arrow::after {
  content: "";
  width: 7px;
  height: 2px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 40%;
  transform: translate(-50%, -50%);
}
.slick-arrow:hover {
  color: transparent;
}
.slick-arrow.slick-prev {
  left: 0;
}
.slick-arrow.slick-prev::before {
  transform: rotate(-45deg);
  top: calc(50% - 2px);
}
.slick-arrow.slick-prev::after {
  transform: rotate(45deg);
  top: calc(50% + 2px);
}
.slick-arrow.slick-next {
  right: 0;
}
.slick-arrow.slick-next::before {
  transform: rotate(45deg);
  top: calc(50% - 2px);
}
.slick-arrow.slick-next::after {
  transform: rotate(-45deg);
  top: calc(50% + 2px);
}

.slick-dots {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
  z-index: 9;
}
.slick-dots li {
  margin: 0 5px;
  padding: 0;
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  cursor: pointer;
  transition: all 0.3s;
}
.slick-dots li.slick-active {
  background: #000;
}
.slick-dots li button {
  padding: initial;
  max-width: initial;
  min-width: initial;
  color: transparent;
  font-size: 0;
}

/** Global **/
@font-face {
  font-family: "Akrobat";
  src: url("../fonts/Akrobat-Regular/Akrobat-Regular.eot");
  src: url("../fonts/Akrobat-Regular/Akrobat-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Akrobat-Regular/Akrobat-Regular.woff2") format("woff2"), url("../fonts/Akrobat-Regular/Akrobat-Regular.woff") format("woff"), url("../fonts/Akrobat-Regular/Akrobat-Regular.ttf") format("truetype");
  font-weight: 400;
}
@font-face {
  font-family: "Akrobat";
  src: url("../fonts/Akrobat-ExtraBold/Akrobat-ExtraBold.eot");
  src: url("../fonts/Akrobat-ExtraBold/Akrobat-ExtraBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Akrobat-ExtraBold/Akrobat-ExtraBold.woff2") format("woff2"), url("../fonts/Akrobat-ExtraBold/Akrobat-ExtraBold.woff") format("woff"), url("../fonts/Akrobat-ExtraBold/Akrobat-ExtraBold.ttf") format("truetype");
  font-weight: 900;
}
@font-face {
  font-family: "AbadiMT";
  src: url("../fonts/AbadiMT/AbadiMT.eot");
  src: url("../fonts/AbadiMT/AbadiMT.eot?#iefix") format("embedded-opentype"), url("../fonts/AbadiMT/AbadiMT.woff2") format("woff2"), url("../fonts/AbadiMT/AbadiMT.woff") format("woff"), url("../fonts/AbadiMT/AbadiMT.ttf") format("truetype");
  font-weight: 400;
}
@font-face {
  font-family: "AbadiMT";
  src: url("../fonts/AbadiMT-CondensedExtraBold/AbadiMT-CondensedExtraBold.eot");
  src: url("../fonts/AbadiMT-CondensedExtraBold/AbadiMT-CondensedExtraBold.eot?#iefix") format("embedded-opentype"), url("../fonts/AbadiMT-CondensedExtraBold/AbadiMT-CondensedExtraBold.woff2") format("woff2"), url("../fonts/AbadiMT-CondensedExtraBold/AbadiMT-CondensedExtraBold.woff") format("woff"), url("../fonts/AbadiMT-CondensedExtraBold/AbadiMT-CondensedExtraBold.ttf") format("truetype");
  font-weight: 900;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
}

[tabindex="-1"]:focus {
  outline: 0 !important;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
}

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit;
}

ol,
ul,
dl {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: 700;
}

dd {
  margin-bottom: 0.5rem;
  margin-left: 0;
}

blockquote {
  margin: 0 0 1rem;
}

b,
strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

a {
  color: #6096c4;
  text-decoration: none;
}
a:hover {
  opacity: 0.8;
}

a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
  outline: 0;
}

pre,
code,
kbd,
samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1em;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
}

figure {
  margin: 0;
  padding: 0;
}

img {
  vertical-align: middle;
  border-style: none;
}

svg {
  overflow: hidden;
  vertical-align: middle;
}

table {
  border-collapse: collapse;
}

caption {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  color: #6c757d;
  text-align: left;
  caption-side: bottom;
}

th {
  text-align: inherit;
}

label {
  display: inline-block;
  margin-bottom: 0.5rem;
}

button {
  border-radius: 0;
}

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

select {
  word-wrap: normal;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

button:not(:disabled),
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled) {
  cursor: pointer;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

input[type=radio],
input[type=checkbox] {
  box-sizing: border-box;
  padding: 0;
}

input[type=date],
input[type=time],
input[type=datetime-local],
input[type=month] {
  -webkit-appearance: listbox;
}

textarea {
  overflow: auto;
  resize: vertical;
}

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
  line-height: inherit;
  color: inherit;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  outline-offset: -2px;
  -webkit-appearance: none;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

output {
  display: inline-block;
}

summary {
  display: list-item;
  cursor: pointer;
}

template {
  display: none;
}

[hidden] {
  display: none !important;
}

:root {
  --white: #ffffff;
  --black: #000000;
  --smoke: #f4f5ef;
  --gray: #e5e5e5;
  --red: #d32d25;
  --primary: #dc704c;
  --second: #d32d25;
  --text-body: #000;
  --radius: 5px;
}

/* Base Setting
---------------------------------------- */
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  font-family: "Hiragino Sans", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック体", "游ゴシック", "Yu Gothic", "Yu Gothic Medium,", Meiryo, "Helvetica Neue", Arial, sans-serif;
  overflow-wrap: break-word;
  font-weight: 400;
  color: var(--text-body);
  line-height: 1.5;
  position: relative;
  width: 100%;
  background: var(--white);
  letter-spacing: 0.2px;
}

p:last-of-type {
  margin: 0;
}

a {
  transition: all 0.3s;
  color: var(--text-body);
  outline: none !important;
}
a:hover {
  opacity: 0.7;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Hiragino Sans", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック体", "游ゴシック", "Yu Gothic", "Yu Gothic Medium,", Meiryo, "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
}

h1 {
  font-size: 2.25rem;
  line-height: 1.3;
}
@media (min-width: 48em) {
  h1 {
    font-size: 2.875rem;
  }
}

h2 {
  font-size: 2.5rem;
  line-height: 1.15;
}
@media (min-width: 48em) {
  h2 {
    font-size: 3.5rem;
  }
}

h3 {
  font-size: 2.125rem;
  line-height: 1.16;
}
@media (min-width: 48em) {
  h3 {
    font-size: 2.5rem;
  }
}

h4 {
  font-size: 1.75rem;
  line-height: 1.16;
}
@media (min-width: 48em) {
  h4 {
    font-size: 2.25rem;
  }
}

h5 {
  font-size: 1.25rem;
  line-height: 1.2;
}
@media (min-width: 48em) {
  h5 {
    font-size: 1.5rem;
  }
}

h6 {
  font-size: 1.125rem;
  line-height: 1.3;
}
@media (min-width: 48em) {
  h6 {
    font-size: 1.25rem;
  }
}

img {
  max-width: 100%;
  vertical-align: bottom;
}

iframe {
  max-width: 100%;
}

.container-fluid, .container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 calc(40 / var(--base-width) * 100vw);
  position: relative;
}
@media only screen and (min-width: 768px) {
  .container-fluid, .container {
    padding-inline: 20px;
  }
}

.procedure ul, .activities ul, .distinctive__list ul, .compare__item ul, .reason__top ul, .site-footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mission > h2, .activities__bottom h3::before, .distinctive__bottom, .distinctive__table--col-special::before, .compare__item, .section-heading h2 {
  background: #663085;
  background: linear-gradient(32deg, #663085 14%, #ae324c 30%, #da3c32 54%, #e9be4c 80%);
}

input[type=text],
input[type=email],
input[type=password],
input[type=phone],
input[type=search],
textarea,
select {
  border: 1px solid var(--gray);
  border-radius: var(--radius);
  padding: 15px 24px;
  outline: none !important;
}

.btn {
  transition: all 0.3s;
  color: var(--white);
  padding: 16px 25px;
  min-width: 230px;
  text-align: center;
  font-weight: 700;
  display: inline-flex;
  outline: none !important;
  border-radius: 0;
  background: var(--primary);
  text-transform: uppercase;
  border: 0;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.btn:hover {
  opacity: 0.7;
  color: var(--white);
}
.btn--green {
  background: #5bae73;
}

.btn-outline {
  transition: all 0.3s;
  color: var(--primary);
  padding: 15px 25px;
  min-width: 230px;
  text-align: center;
  font-weight: 700;
  display: inline-block;
  outline: none !important;
  border-radius: var(--radius);
  background: none;
  text-transform: uppercase;
  border: 1px solid var(--primary);
}
.btn-outline:hover {
  opacity: 0.9;
  color: var(--white);
}
.btn-outline svg {
  margin-right: 15px;
  max-height: 20px;
}
.btn-outline.btn-white {
  border-color: var(--white);
  color: var(--white);
}

.section-heading {
  text-align: center;
  position: relative;
  z-index: 1;
  min-height: calc(150 / var(--base-width) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: calc(80 / var(--base-width) * 100vw);
  padding-top: calc(24 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .section-heading {
    margin-bottom: 100px;
    min-height: 120px;
    padding-top: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .section-heading {
    margin-bottom: 130px;
    min-height: 200px;
  }
}
.section-heading h2 {
  line-height: 1;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "Akrobat", sans-serif;
  font-weight: 900;
  font-size: calc(150 / var(--base-width) * 100vw);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  margin: 0;
  opacity: 0.28;
}
@media only screen and (min-width: 768px) {
  .section-heading h2 {
    font-size: 120px;
  }
}
@media only screen and (min-width: 992px) {
  .section-heading h2 {
    font-size: 160px;
  }
}
@media only screen and (min-width: 1200px) {
  .section-heading h2 {
    font-size: 200px;
  }
}
.section-heading h3 {
  font-size: calc(60 / var(--base-width) * 100vw);
  line-height: 1.3;
  font-weight: 700;
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .section-heading h3 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 1200px) {
  .section-heading h3 {
    font-size: 62px;
  }
}

.table-row {
  width: 100%;
  border-spacing: calc(5 / var(--base-width) * 100vw);
  border-collapse: separate;
}
@media only screen and (min-width: 768px) {
  .table-row {
    border-spacing: 10px;
  }
}
.table-row th {
  background: #404040;
  color: var(--white);
  text-align: center;
  font-weight: 600;
  font-size: calc(28 / var(--base-width) * 100vw);
  padding: calc(4 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw);
  line-height: 1.5;
}
@media only screen and (min-width: 768px) {
  .table-row th {
    font-size: 22px;
    padding: 5px 10px;
  }
}
@media only screen and (min-width: 1200px) {
  .table-row th {
    font-size: 28px;
    padding: 5px 20px;
  }
}
.table-row td {
  font-weight: 500;
  text-align: center;
  font-size: calc(26 / var(--base-width) * 100vw);
  background: var(--white);
  height: calc(85 / var(--base-width) * 100vw);
  line-height: 1.1;
  padding: calc(10 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .table-row td {
    font-size: 24px;
    line-height: 1.4;
    height: 90px;
    padding: 10px 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .table-row td {
    font-size: 32px;
    height: 115px;
  }
}
@media only screen and (min-width: 768px) {
  .table-row td small {
    font-size: 18px;
  }
}
@media only screen and (min-width: 1200px) {
  .table-row td small {
    font-size: 26px;
  }
}

.container-fluid {
  max-width: 1920px;
}
@media (min-width: 48em) {
  .container-fluid {
    padding: 0 64px;
  }
}

.hamburger {
  position: relative;
  width: 28px;
  height: 18px;
  line-height: 1;
  cursor: pointer;
  display: block;
  right: 0;
  z-index: 99;
  opacity: 1;
}
.hamburger span {
  width: 28px;
  height: 2px;
  background: #555555;
  backface-visibility: hidden;
  position: absolute;
  display: block;
  margin: auto;
  transition: 0.3s all ease;
  transform: rotate(0deg);
  border-radius: 5px;
  top: calc(50% - 1px);
  left: calc(50% - 14px);
}
.hamburger span::before, .hamburger span::after {
  content: "";
  transform-origin: center center;
  width: 100%;
  height: 2px;
  background: #555555;
  backface-visibility: hidden;
  position: absolute;
  left: 0;
  top: 8px;
  transition: 0.3s all ease;
  border-radius: 5px;
  opacity: 1;
}
.hamburger span::after {
  top: -8px;
}
.hamburger.active span {
  transform: rotate(225deg);
}
.hamburger.active span::before {
  transform: rotate(-90deg);
  top: 0;
}
.hamburger.active span::after {
  opacity: 0;
}

@media screen and (min-width: 1024px) {
  .pcbr {
    display: block;
  }

  .spbr {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .pcbr {
    display: none;
  }

  .spbr {
    display: block;
  }
}
@media only screen and (min-width: 768px) {
  .hide-pc {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .hide-sp {
    display: none;
  }
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-canter {
  text-align: canter;
}

.slick-slider .slick-arrow {
  width: calc(29 / var(--base-width) * 100vw);
  width: calc(32 / var(--base-width) * 100vw);
  border: 0;
  padding: 0;
  margin: 0;
  z-index: 20;
  outline: none;
}
@media only screen and (min-width: 768px) {
  .slick-slider .slick-arrow {
    width: 37px;
    height: 41px;
  }
}
.slick-slider .slick-arrow::before, .slick-slider .slick-arrow::after {
  display: none;
}
.slick-slider .slick-arrow.slick-prev {
  background: url("../images/slider-arrow-left.png") no-repeat 0 0/100%;
}
.slick-slider .slick-arrow.slick-next {
  background: url("../images/slider-arrow-right.png") no-repeat 0 0/100%;
}
.slick-slider .slick-dots {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 / var(--base-width) * 100vw) calc(22 / var(--base-width) * 100vw);
  bottom: 0;
}
@media only screen and (min-width: 768px) {
  .slick-slider .slick-dots {
    gap: 10px 18px;
  }
}
.slick-slider .slick-dots li {
  width: auto;
  height: auto;
  margin: 0;
  background: none;
}
.slick-slider .slick-dots li button {
  padding: 0;
  width: calc(22 / var(--base-width) * 100vw);
  height: calc(22 / var(--base-width) * 100vw);
  border-radius: 50%;
  background: #A6A6A6;
  border: 0;
  display: block;
}
@media only screen and (min-width: 768px) {
  .slick-slider .slick-dots li button {
    width: 20px;
    height: 20px;
  }
}
.slick-slider .slick-dots li.slick-active button {
  background: var(--black);
}

.site-header {
  background: var(--white);
  text-align: center;
  padding-top: calc(37 / var(--base-width) * 100vw);
  position: relative;
  z-index: 99;
}
@media only screen and (min-width: 768px) {
  .site-header {
    padding-top: 30px;
  }
}
.site-header__logo img {
  display: inline-block;
  margin-bottom: calc(-80 / var(--base-width) * 100vw);
  max-width: calc(132 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .site-header__logo img {
    margin-bottom: -60px;
    max-width: 164px;
  }
}

.site-footer {
  background: url("../images/bg-gradient-5.png") no-repeat 50% 50%/cover;
  text-align: center;
  font-size: calc(25 / var(--base-width) * 100vw);
  line-height: 1.8;
  font-weight: 400;
  color: var(--white);
  padding-block: calc(60 / var(--base-width) * 100vw) calc(50 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .site-footer {
    padding-block: 80px;
    font-size: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .site-footer {
    font-size: 25px;
  }
}
.site-footer ul {
  display: flex;
  flex-wrap: wrap;
  font-size: calc(28 / var(--base-width) * 100vw);
  gap: calc(24 / var(--base-width) * 100vw) 0;
  justify-content: center;
  max-width: 980px;
  margin: 0 auto calc(50 / var(--base-width) * 100vw);
  line-height: 1;
}
@media only screen and (min-width: 768px) {
  .site-footer ul {
    font-size: 22px;
    margin: 0 auto 60px;
    gap: 20px 0;
  }
}
@media only screen and (min-width: 1200px) {
  .site-footer ul {
    font-size: 28px;
    gap: 30px 0;
  }
}
.site-footer ul li {
  border-right: 1px solid var(--white);
  margin-right: calc(18 / var(--base-width) * 100vw);
  padding-right: calc(18 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .site-footer ul li {
    margin-right: 20px;
    padding-right: 20px;
  }
}
.site-footer ul li:last-child {
  border-right: 0;
  margin-right: 0;
  padding-right: 0;
}
.site-footer ul li a {
  color: var(--white);
}

.btn-fixed {
  position: sticky;
  bottom: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 99;
  padding: calc(75 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .btn-fixed {
    padding: 30px;
  }
}
@media only screen and (min-width: 1200px) {
  .btn-fixed {
    padding: 40px;
  }
}
.btn-fixed a {
  background: #262626;
  color: var(--white);
  text-align: center;
  font-size: calc(39 / var(--base-width) * 100vw);
  font-weight: 700;
  min-height: calc(96 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 982px;
  margin-inline: auto;
}
@media only screen and (min-width: 768px) {
  .btn-fixed a {
    font-size: 32px;
    min-height: 76px;
  }
}
@media only screen and (min-width: 1200px) {
  .btn-fixed a {
    font-size: 45px;
    min-height: 98px;
  }
}

/** pages */
.banner {
  position: relative;
  z-index: 1;
  padding-block: calc(38 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner {
    padding-block: calc(30 / 1200 * 100vw) calc(90 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner {
    padding-block: 30px 90px;
  }
}
.banner::before {
  content: "";
  background: url("../images/bg-gradient-1-sp.png") no-repeat 50% 50%/cover;
  width: 100%;
  top: calc(90 / var(--base-width) * 100vw);
  position: absolute;
  bottom: 0;
  left: 0;
}
@media only screen and (min-width: 768px) {
  .banner::before {
    background-image: url("../images/bg-gradient-1.png");
    top: calc(140 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner::before {
    top: 140px;
  }
}
.banner .container {
  z-index: 20;
}
.banner > img {
  position: absolute;
  pointer-events: none;
  mix-blend-mode: multiply;
  z-index: 4;
}
.banner__image--1 {
  top: calc(42 / var(--base-width) * 100vw);
  left: 0;
  max-width: calc(95 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__image--1 {
    top: calc(35 / 1200 * 100vw);
    max-width: calc(338 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__image--1 {
    max-width: 338px;
  }
}
.banner__image--2 {
  bottom: calc(-70 / var(--base-width) * 100vw);
  left: 0;
  max-width: calc(295 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__image--2 {
    max-width: calc(385 / 1200 * 100vw);
    bottom: calc(-160 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__image--2 {
    max-width: 385px;
    bottom: -160px;
  }
}
.banner__image--3 {
  bottom: calc(106 / var(--base-width) * 100vw);
  right: 0;
  max-width: calc(372 / var(--base-width) * 100vw);
  z-index: 4;
}
@media only screen and (min-width: 768px) {
  .banner__image--3 {
    max-width: calc(706 / 1200 * 100vw);
    bottom: calc(-116 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1200px) {
  .banner__image--3 {
    max-width: 706px;
    bottom: -116px;
  }
}
.banner__logo {
  text-align: center;
  position: relative;
  z-index: 1;
}
.banner__logo img {
  max-width: calc(132 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__logo img {
    max-width: calc(164 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1200px) {
  .banner__logo img {
    max-width: 164px;
  }
}
.banner__content {
  padding-top: calc(150 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content {
    padding-top: calc(50 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content {
    padding-top: 50px;
  }
}
.banner__content--top {
  position: relative;
  z-index: 1;
}
.banner__content--top h1 {
  font-size: calc(68 / var(--base-width) * 100vw);
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: 0 0 20px #fff, 0 0 18px #fff, 0 0 16px #fff, 0 0 14px #fff, 0 0 12px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 18px #fff, 0 0 16px #fff, 0 0 14px #fff, 0 0 12px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
  margin: 0;
  z-index: 2;
}
@media only screen and (min-width: 768px) {
  .banner__content--top h1 {
    font-size: calc(110 / 1200 * 100vw);
    margin: 0 0 0 calc(40 / 1200 * 100vw);
    text-shadow: 0 0 calc(20 / 1200 * 100vw) #fff, 0 0 calc(18 / 1200 * 100vw) #fff, 0 0 calc(16 / 1200 * 100vw) #fff, 0 0 calc(14 / 1200 * 100vw) #fff, 0 0 calc(12 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(20 / 1200 * 100vw) #fff, 0 0 calc(18 / 1200 * 100vw) #fff, 0 0 calc(16 / 1200 * 100vw) #fff, 0 0 calc(14 / 1200 * 100vw) #fff, 0 0 calc(12 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff;
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--top h1 {
    font-size: 110px;
    margin: 0 0 0 40px;
    text-shadow: 0 0 20px #fff, 0 0 18px #fff, 0 0 16px #fff, 0 0 14px #fff, 0 0 12px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 18px #fff, 0 0 16px #fff, 0 0 14px #fff, 0 0 12px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
  }
}
.banner__content--top h1 strong {
  font-size: calc(92 / var(--base-width) * 100vw);
  color: var(--red);
  font-weight: 800;
}
@media only screen and (min-width: 768px) {
  .banner__content--top h1 strong {
    font-size: calc(150 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--top h1 strong {
    font-size: 150px;
  }
}
.banner__content--top h3 {
  font-size: calc(34.7 / var(--base-width) * 100vw);
  font-weight: 700;
  margin: 0;
  position: absolute;
  width: calc(169 / var(--base-width) * 100vw);
  height: calc(134 / var(--base-width) * 100vw);
  background: url("../images/banner-cmt.png") no-repeat 0 0/100% 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(10 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw);
  line-height: 1.1;
  top: calc(-166 / var(--base-width) * 100vw);
  left: calc(10 / var(--base-width) * 100vw);
  z-index: 3;
}
@media only screen and (min-width: 768px) {
  .banner__content--top h3 {
    font-size: calc(50 / 1200 * 100vw);
    width: calc(242 / 1200 * 100vw);
    height: calc(194 / 1200 * 100vw);
    padding: calc(10 / 1200 * 100vw) calc(20 / 1200 * 100vw) calc(30 / 1200 * 100vw);
    top: calc(-210 / 1200 * 100vw);
    left: calc(40 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--top h3 {
    font-size: 50px;
    width: 242px;
    height: 194px;
    padding: 10px 20px 30px;
    top: -210px;
    left: 40px;
  }
}
.banner__content--top picture {
  position: absolute;
  top: calc(-284 / var(--base-width) * 100vw);
  right: calc(-20 / var(--base-width) * 100vw);
  width: calc(383 / var(--base-width) * 100vw);
  z-index: -1;
}
@media only screen and (min-width: 768px) {
  .banner__content--top picture {
    width: calc(537 / 1200 * 100vw);
    right: calc(10 / 1200 * 100vw);
    top: calc(-230 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--top picture {
    width: 537px;
    right: 10px;
    top: -230px;
  }
}
.banner__content--top picture img {
  width: 100%;
}
.banner__content--main {
  font-size: calc(24 / var(--base-width) * 100vw);
  font-weight: 600;
  text-shadow: 0 0 calc(29 / var(--base-width) * 100vw) #fff, 0 0 calc(29 / var(--base-width) * 100vw) #fff, 0 0 calc(20 / var(--base-width) * 100vw) #fff, 0 0 calc(10 / var(--base-width) * 100vw) #fff;
  display: flex;
  position: relative;
  z-index: 3;
  justify-content: flex-end;
  line-height: 1.46;
  text-align: center;
  margin-block: calc(35 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--main {
    text-align: left;
    line-height: 1.4;
    margin-block: calc(10 / 1200 * 100vw) calc(40 / 1200 * 100vw);
    padding-right: calc(200 / 1200 * 100vw);
    font-size: calc(32 / 1200 * 100vw);
    text-shadow: 0 0 calc(29 / 1200 * 100vw) #fff, 0 0 calc(29 / 1200 * 100vw) #fff, 0 0 calc(20 / 1200 * 100vw) #fff, 0 0 calc(10 / 1200 * 100vw) #fff;
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--main {
    margin: 10px 0 40px;
    padding-right: 200px;
    font-size: 32px;
    text-shadow: 0 0 29px #fff, 0 0 29px #fff, 0 0 20px #fff, 0 0 10px #fff;
  }
}
.banner__content--main img {
  position: absolute;
  right: calc(-20 / var(--base-width) * 100vw);
  bottom: calc(35 / var(--base-width) * 100vw);
  width: calc(81 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--main img {
    right: calc(74 / 1200 * 100vw);
    bottom: calc(-80 / 1200 * 100vw);
    width: calc(105 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--main img {
    right: 74px;
    bottom: -80px;
    width: 105px;
  }
}
.banner__content--bottom {
  display: flex;
  justify-content: center;
  gap: calc(7 / var(--base-width) * 100vw);
  position: relative;
}
@media only screen and (min-width: 768px) {
  .banner__content--bottom {
    gap: calc(16 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--bottom {
    gap: 16px;
  }
}
.banner__content--bottom img {
  position: absolute;
  z-index: 3;
  left: calc(50% - 0.3vw);
  top: calc(-40 / var(--base-width) * 100vw);
  transform: translateX(-50%);
  width: calc(61 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--bottom img {
    left: calc(50% - 3px);
    top: calc(-28 / 1200 * 100vw);
    width: calc(86 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--bottom img {
    left: calc(50% - 3px);
    top: -28px;
    width: 86px;
  }
}
.banner__content--circle {
  position: relative;
  z-index: 1;
  width: calc(160 / var(--base-width) * 100vw);
  height: calc(160 / var(--base-width) * 100vw);
  background: var(--white);
  box-shadow: 0 calc(10 / var(--base-width) * 100vw) calc(10 / var(--base-width) * 100vw) rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-weight: 700;
  font-size: calc(20.7 / var(--base-width) * 100vw);
  line-height: 1.14;
  text-align: center;
  letter-spacing: 0;
}
@media only screen and (min-width: 768px) {
  .banner__content--circle {
    width: calc(270 / 1200 * 100vw);
    height: calc(270 / 1200 * 100vw);
    box-shadow: 0 calc(10 / 1200 * 100vw) calc(10 / 1200 * 100vw) rgba(0, 0, 0, 0.4);
    font-size: calc(35 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle {
    width: 270px;
    height: 270px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.4);
    font-size: 35px;
  }
}
.banner__content--circle p {
  margin: 0;
}
.banner__content--circle strong {
  color: var(--red);
  font-weight: 800;
  font-size: calc(24.89 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle strong {
    font-size: calc(42 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle strong {
    font-size: 42px;
  }
}
.banner__content--circle strong small {
  font-size: calc(20 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle strong small {
    font-size: calc(32 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle strong small {
    font-size: 32px;
  }
}
.banner__content--circle:nth-child(1) {
  font-size: calc(24.89 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle:nth-child(1) {
    font-size: calc(42 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle:nth-child(1) {
    font-size: 42px;
  }
}
.banner__content--circle:nth-child(1) strong {
  font-size: calc(49.79 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle:nth-child(1) strong {
    font-size: calc(80 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle:nth-child(1) strong {
    font-size: 80px;
  }
}
.banner__content--circle:nth-child(2) {
  font-size: calc(23.71 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle:nth-child(2) {
    font-size: calc(40 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle:nth-child(2) {
    font-size: 40px;
  }
}
.banner__content--circle:nth-child(2) strong {
  font-size: calc(41.49 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .banner__content--circle:nth-child(2) strong {
    font-size: calc(70 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle:nth-child(2) strong {
    font-size: 70px;
  }
}
.banner__content--circle:nth-child(3) strong, .banner__content--circle:nth-child(4) strong {
  margin-top: calc(7 / var(--base-width) * 100vw);
  display: inline-block;
}
@media only screen and (min-width: 768px) {
  .banner__content--circle:nth-child(3) strong, .banner__content--circle:nth-child(4) strong {
    margin-top: calc(7 / 1200 * 100vw);
  }
}
@media only screen and (min-width: 1240px) {
  .banner__content--circle:nth-child(3) strong, .banner__content--circle:nth-child(4) strong {
    margin-top: 7px;
  }
}

.buttons__inner {
  display: flex;
  gap: 30px;
  padding: calc(50 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw) calc(100 / var(--base-width) * 100vw);
  flex-direction: column;
}
@media only screen and (min-width: 768px) {
  .buttons__inner {
    padding: 55px 30px;
    gap: 40px;
    flex-direction: row;
  }
}
.buttons__inner .btn {
  flex-basis: 0;
  flex-grow: 1;
  font-size: calc(38 / var(--base-width) * 100vw);
  min-height: calc(97 / var(--base-width) * 100vw);
  gap: calc(50 / var(--base-width) * 100vw);
  z-index: 15;
  padding: calc(10 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .buttons__inner .btn {
    font-size: 20px;
    min-height: 72px;
    gap: 30px;
    padding: 15px;
  }
}
@media only screen and (min-width: 1200px) {
  .buttons__inner .btn {
    font-size: 35px;
    gap: 40px;
    min-height: 88px;
  }
}
.buttons__inner .btn img {
  max-height: calc(54 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .buttons__inner .btn img {
    max-height: 32px;
  }
}
@media only screen and (min-width: 1200px) {
  .buttons__inner .btn img {
    max-height: 54px;
  }
}

.challenges {
  background: #E5E5E5;
  text-align: center;
  position: relative;
}
.challenges h2 {
  font-size: calc(52 / var(--base-width) * 100vw);
  font-weight: 700;
  text-align: center;
  position: absolute;
  top: calc(60 / var(--base-width) * 100vw);
  width: 100%;
  left: 0;
  z-index: 2;
  margin: 0;
  letter-spacing: 0.4px;
}
@media only screen and (min-width: 768px) {
  .challenges h2 {
    font-size: 40px;
    top: 60px;
  }
}
@media only screen and (min-width: 992px) {
  .challenges h2 {
    font-size: 60px;
    top: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .challenges h2 {
    font-size: 80px;
  }
}
.challenges h2 span {
  color: var(--red);
}
.challenges h3 {
  color: var(--white);
  display: flex;
  flex-direction: column;
  gap: calc(14 / var(--base-width) * 100vw);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(35 / var(--base-width) * 100vw);
  z-index: 2;
  align-items: flex-start;
  font-size: calc(53 / var(--base-width) * 100vw);
  font-weight: 600;
  letter-spacing: 0.4px;
  line-height: 1.3;
  margin: 0;
  white-space: nowrap;
}
@media only screen and (min-width: 768px) {
  .challenges h3 {
    font-size: 42px;
    gap: 18px;
    bottom: 50px;
  }
}
@media only screen and (min-width: 992px) {
  .challenges h3 {
    font-size: 60px;
  }
}
@media only screen and (min-width: 1200px) {
  .challenges h3 {
    font-size: 75px;
  }
}
.challenges h3 span {
  background: #0d0d0d;
  box-shadow: 8px 8px 8px #282828;
  background: #0d0d0d;
  padding: calc(10 / var(--base-width) * 100vw) calc(34 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .challenges h3 span {
    padding: 7px 30px;
  }
}
@media only screen and (min-width: 1200px) {
  .challenges h3 span {
    padding: 7px 45px;
  }
}
.challenges h3 span:last-child {
  margin-left: calc(136 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .challenges h3 span:last-child {
    margin-left: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .challenges h3 span:last-child {
    margin-left: 190px;
  }
}

.reason__top {
  background: #e5e5e5;
  position: relative;
  padding-block: calc(53 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .reason__top {
    padding-block: 50px 70px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__top {
    padding-block: 80px 100px;
  }
}
.reason__top::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 100%;
  border-top: calc(57 / var(--base-width) * 100vw) solid #e5e5e5;
  border-left: calc(95 / var(--base-width) * 100vw) solid transparent;
  border-right: calc(95 / var(--base-width) * 100vw) solid transparent;
}
@media only screen and (min-width: 768px) {
  .reason__top::after {
    border-top-width: 50px;
    border-left-width: 90px;
    border-right-width: 90px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__top::after {
    border-top-width: 81px;
    border-left-width: 136px;
    border-right-width: 136px;
  }
}
.reason__top .container {
  display: flex;
  justify-content: center;
}
.reason__top ul {
  font-weight: 600;
  font-size: calc(30 / var(--base-width) * 100vw);
  line-height: 1.3;
  letter-spacing: 0.2px;
}
@media only screen and (min-width: 768px) {
  .reason__top ul {
    font-size: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__top ul {
    font-size: 38px;
  }
}
.reason__top ul li {
  background: url("../images/check-square.png") no-repeat 0 0/calc(38 / var(--base-width) * 100vw);
  padding-left: calc(51 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .reason__top ul li {
    background-size: 32px;
    padding-left: 52px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__top ul li {
    background-size: 54px;
    padding-left: 78px;
  }
}
.reason__top ul li + li {
  margin-top: calc(20 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .reason__top ul li + li {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__top ul li + li {
    margin-top: 30px;
  }
}
.reason__bottom {
  padding-block: calc(100 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .reason__bottom {
    padding-block: 80px 50px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__bottom {
    padding-block: 120px 70px;
  }
}
.reason__bottom h3 {
  margin: 0;
  font-size: calc(56 / var(--base-width) * 100vw);
  font-weight: 700;
  line-height: 1.5;
}
@media only screen and (min-width: 768px) {
  .reason__bottom h3 {
    font-size: 52px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__bottom h3 {
    font-size: 80px;
  }
}
.reason__bottom h3 span {
  color: var(--white);
  line-height: 1;
  background: url("../images/bg-gradient-2.png") no-repeat 0 0/cover;
  padding: calc(10 / var(--base-width) * 100vw) calc(45 / var(--base-width) * 100vw);
  letter-spacing: 0.4px;
  display: inline-flex;
  min-height: calc(79 / var(--base-width) * 100vw);
  align-items: center;
}
@media only screen and (min-width: 768px) {
  .reason__bottom h3 span {
    min-height: 76px;
    padding: 10px 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .reason__bottom h3 span {
    min-height: 113px;
    padding: 10px 62px;
  }
}

.special {
  position: relative;
  z-index: 4;
}
.special::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../images/bg-gradient-3.png") no-repeat 50% 50%/cover;
  z-index: -3;
  mix-blend-mode: multiply;
}
.special picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -5;
}
.special picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.special h2 {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  color: var(--primary);
  opacity: 0.3;
  margin: 0;
  font-family: "AbadiMT", sans-serif;
  letter-spacing: 0.4px;
  font-size: calc(183 / var(--base-width) * 100vw);
  mix-blend-mode: multiply;
  line-height: 1;
  font-weight: 700;
  bottom: 0;
}
@media only screen and (min-width: 768px) {
  .special h2 {
    font-size: calc(414 / var(--base-width) * 100vw);
    bottom: auto;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
@media only screen and (min-width: 1200px) {
  .special h2 {
    font-size: 414px;
  }
}
.special__inner {
  padding-block: calc(60 / var(--base-width) * 100vw);
  min-height: calc(268 / var(--base-width) * 100vw);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .special__inner {
    padding-block: 50px;
    min-height: 270px;
  }
}
@media only screen and (min-width: 1200px) {
  .special__inner {
    padding-block: 70px;
    min-height: 435px;
  }
}
.special__inner h3 {
  color: var(--white);
  margin: 0;
  text-shadow: 0px 0px calc(20 / var(--base-width) * 100vw) rgba(98, 98, 100, 0.85);
  font-size: calc(58 / var(--base-width) * 100vw);
  font-weight: 700;
  letter-spacing: 0.4px;
  line-height: 1.228;
}
@media only screen and (min-width: 768px) {
  .special__inner h3 {
    font-size: 60px;
    text-shadow: 0px 0px 20px rgba(98, 98, 100, 0.85);
  }
}
@media only screen and (min-width: 1200px) {
  .special__inner h3 {
    font-size: 100px;
    line-height: 1.125;
  }
}
.special__inner h3 strong {
  font-weight: 700;
  font-size: calc(72 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .special__inner h3 strong {
    font-size: 64px;
  }
}
@media only screen and (min-width: 1200px) {
  .special__inner h3 strong {
    font-size: 120px;
  }
}
.special__inner h3 small {
  font-size: calc(60 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .special__inner h3 small {
    font-size: 56px;
  }
}
@media only screen and (min-width: 1200px) {
  .special__inner h3 small {
    font-size: 95px;
  }
}

.solve {
  padding-block: calc(90 / var(--base-width) * 100vw) calc(130 / var(--base-width) * 100vw);
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .solve {
    padding-block: 100px 80px;
  }
}
@media only screen and (min-width: 1200px) {
  .solve {
    padding-block: 160px 105px;
  }
}
.solve > img {
  position: absolute;
  z-index: -1;
}
.solve__image--1 {
  max-width: calc(313 / var(--base-width) * 100vw);
  top: calc(-175 / var(--base-width) * 100vw);
  left: calc(60 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .solve__image--1 {
    max-width: 220px;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
  }
}
@media only screen and (min-width: 1200px) {
  .solve__image--1 {
    max-width: 448px;
  }
}
.solve__image--2 {
  max-width: calc(500 / var(--base-width) * 100vw);
  bottom: calc(-380 / var(--base-width) * 100vw);
  right: calc(100 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .solve__image--2 {
    max-width: 260px;
    top: 37%;
    bottom: auto;
    right: 0;
  }
}
@media only screen and (min-width: 1200px) {
  .solve__image--2 {
    max-width: 345px;
  }
}
.solve__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(30 / var(--base-width) * 100vw) calc(15 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .solve__inner {
    gap: 40px 30px;
  }
}
@media only screen and (min-width: 1200px) {
  .solve__inner {
    gap: 60px 100px;
  }
}
.solve__item {
  display: flex;
  flex-direction: column;
  box-shadow: 0px 0px calc(20 / var(--base-width) * 100vw) 0px rgba(98, 98, 100, 0.4);
  background: url("../images/check-square.png") no-repeat calc(9 / var(--base-width) * 100vw) calc(8 / var(--base-width) * 100vw)/calc(33 / var(--base-width) * 100vw) var(--white);
}
@media only screen and (min-width: 768px) {
  .solve__item {
    background-size: 33px;
    background-position: 10px 10px;
    box-shadow: 0px 0px 20px 0px rgba(98, 98, 100, 0.4);
  }
}
@media only screen and (min-width: 1200px) {
  .solve__item {
    background-size: 54px;
    background-position: 15px 12px;
  }
}
.solve__item--top {
  flex-basis: 0;
  flex-grow: 1;
  text-align: center;
  padding: calc(30 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw) calc(10 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .solve__item--top {
    padding: 30px 20px 10px;
  }
}
.solve__item--top h3 {
  margin: 0 0 calc(5 / var(--base-width) * 100vw);
  font-size: calc(30 / var(--base-width) * 100vw);
  font-weight: 700;
  min-height: calc(74 / var(--base-width) * 100vw);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  line-height: 1.228;
}
@media only screen and (min-width: 768px) {
  .solve__item--top h3 {
    font-size: 26px;
    margin: 0 0 10px;
    line-height: 1.18;
    min-height: 80px;
  }
}
@media only screen and (min-width: 1200px) {
  .solve__item--top h3 {
    font-size: 38px;
    min-height: 90px;
  }
}
.solve__item--top figure img {
  width: 75%;
  max-width: 340px;
}
@media only screen and (min-width: 1200px) {
  .solve__item--top figure img {
    width: auto;
  }
}
.solve__item h4 {
  background: var(--primary);
  color: var(--white);
  margin: 0;
  font-weight: 700;
  font-size: calc(30 / var(--base-width) * 100vw);
  line-height: 1.25;
  padding: calc(19 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw);
  min-height: calc(85 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.2px;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .solve__item h4 {
    font-size: 28px;
    padding: 19px 20px;
    min-height: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .solve__item h4 {
    font-size: 40px;
    min-height: 138px;
  }
}

.points {
  position: relative;
  z-index: 10;
}
.points__row {
  padding-block: calc(90 / var(--base-width) * 100vw) calc(120 / var(--base-width) * 100vw);
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .points__row {
    padding-block: calc(300 / var(--base-width) * 100vw) calc(220 / var(--base-width) * 100vw);
  }
}
@media only screen and (min-width: 1200px) {
  .points__row {
    padding-block: calc(180 / var(--base-width) * 100vw);
  }
}
.points__row > h2 {
  position: absolute;
  bottom: calc(45 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%) rotate(-8.1deg);
  color: #a6a6a6;
  opacity: 0.2;
  margin: 0;
  font-family: "AbadiMT", sans-serif;
  letter-spacing: 0.4px;
  font-size: calc(181 / var(--base-width) * 100vw);
  mix-blend-mode: multiply;
  z-index: -1;
}
@media only screen and (min-width: 768px) {
  .points__row > h2 {
    font-size: calc(414 / var(--base-width) * 100vw);
    transform: translateX(-50%) rotate(-5deg);
    bottom: -1vw;
  }
}
@media only screen and (min-width: 1920px) {
  .points__row > h2 {
    font-size: 414px;
    bottom: calc(50 / var(--base-width) * 100vw);
  }
}
.points__row--inner {
  position: relative;
}
.points__row--inner > h2 {
  color: #a6a6a6;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0 0 calc(20 / var(--base-width) * 100vw);
  font-weight: 600;
  line-height: 0.95;
  font-family: "Akrobat", sans-serif;
  text-transform: uppercase;
  z-index: 8;
  font-size: calc(43 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--inner > h2 {
    font-size: 40px;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--inner > h2 {
    font-size: 70px;
  }
}
@media only screen and (min-width: 1600px) {
  .points__row--inner > h2 {
    position: absolute;
    left: -205px;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
  }
}
@media only screen and (min-width: 1800px) {
  .points__row--inner > h2 {
    left: -295px;
  }
}
.points__row--inner > h2 strong {
  font-size: calc(123 / var(--base-width) * 100vw);
  font-weight: 900;
}
@media only screen and (min-width: 768px) {
  .points__row--inner > h2 strong {
    font-size: 110px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--inner > h2 strong {
    font-size: 200px;
  }
}
@media only screen and (min-width: 768px) {
  .points__row--info {
    display: flex;
  }
}
.points__row--content {
  font-size: calc(28 / var(--base-width) * 100vw);
  line-height: 1.846;
  font-weight: 600;
  line-height: 1.6;
}
@media only screen and (min-width: 768px) {
  .points__row--content {
    width: 50%;
    font-size: 22px;
  }
}
@media only screen and (min-width: 992px) {
  .points__row--content {
    font-size: 26px;
  }
}
.points__row--content h3 {
  font-size: calc(45 / var(--base-width) * 100vw);
  line-height: 1.25;
  font-weight: 700;
  margin: 0 0 calc(20 / var(--base-width) * 100vw);
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .points__row--content h3 {
    font-size: 40px;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--content h3 {
    font-size: 52px;
  }
}
.points__row--content--full {
  width: 100%;
  text-align: center;
  margin-bottom: calc(30 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--content--full {
    margin-bottom: 40px;
  }
}
.points__row figure {
  margin-top: calc(45 / var(--base-width) * 100vw);
  padding-inline: calc(20 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row figure {
    width: 50%;
    padding-inline: 30px 0;
    margin-top: 0;
  }
}
@media only screen and (min-width: 992px) {
  .points__row figure {
    padding-left: 75px;
  }
}
.points__row figure img {
  width: 100%;
}
.points__row--group {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(18 / var(--base-width) * 100vw);
  position: relative;
  margin-top: calc(65 / var(--base-width) * 100vw);
  padding-inline: calc(35 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--group {
    grid-template-columns: 1fr 1fr;
    gap: 46px;
    padding: 0;
    gap: 18px;
    margin-top: 22px;
  }
}
.points__row--group::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(30 / var(--base-width) * 100vw);
  height: calc(30 / var(--base-width) * 100vw);
  background: url("../images/cross-2.png") no-repeat 0 0/100%;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .points__row--group::before {
    width: 30px;
    height: 30px;
  }
}
.points__row--group h4 {
  background: var(--white);
  line-height: 1.4;
  text-align: center;
  padding: 12px 10px;
  margin: 0;
  letter-spacing: 0;
  font-size: calc(31 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--group h4 {
    font-size: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--group h4 {
    font-size: 30px;
  }
}
.points__row--group h4 span {
  color: var(--red);
}
.points__row--bottom {
  text-align: center;
  margin-top: 40px;
}
.points__row--bottom h4 {
  line-height: 1.56;
  font-weight: 700;
  font-size: calc(40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--bottom h4 {
    font-size: 36px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--bottom h4 {
    font-size: 50px;
  }
}
.points__row--bottom h4 u {
  text-decoration: none;
  border-bottom: calc(2 / var(--base-width) * 100vw) solid var(--red);
}
@media only screen and (min-width: 768px) {
  .points__row--bottom h4 u {
    border-bottom-width: 3px;
  }
}
.points__row--bottom h4 span {
  color: var(--red);
  font-size: calc(46 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--bottom h4 span {
    font-size: 40px;
  }
}
@media only screen and (min-width: 1920px) {
  .points__row--bottom h4 span {
    font-size: 56px;
  }
}
.points__row--comments {
  margin-top: calc(35 / var(--base-width) * 100vw);
  display: flex;
  gap: calc(45 / var(--base-width) * 100vw);
  flex-direction: column;
  align-items: flex-start;
}
@media only screen and (min-width: 768px) {
  .points__row--comments {
    margin-top: 28px;
    display: flex;
    gap: 12px 22px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
  }
}
.points__row--comments h4 {
  background: #BCCCE6;
  border-radius: calc(17 / var(--base-width) * 100vw);
  font-weight: 600;
  font-size: calc(26 / var(--base-width) * 100vw);
  line-height: 1.357;
  position: relative;
  padding: calc(16 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw);
  margin: 0;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .points__row--comments h4 {
    width: calc(50% - 11px);
    font-size: 22px;
    border-radius: 17px;
    padding: 16px 5px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--comments h4 {
    font-size: 27px;
  }
}
.points__row--comments h4::after {
  content: "";
  position: absolute;
  top: calc(100% - 1px);
  border-top: calc(31 / var(--base-width) * 100vw) solid #BCCCE6;
  border-left: calc(10 / var(--base-width) * 100vw) solid transparent;
  border-right: calc(10 / var(--base-width) * 100vw) solid transparent;
  left: 29%;
}
@media only screen and (min-width: 768px) {
  .points__row--comments h4::after {
    border-top-width: 33px;
    border-left-width: 10px;
    border-right-width: 10px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--comments h4:first-child {
    margin-top: -34px;
  }
}
@media only screen and (max-width: 767px) {
  .points__row--comments h4:nth-child(2) {
    align-self: flex-end;
  }
}
.points__row--comments h4:nth-child(2)::after {
  left: 58%;
}
@media only screen and (max-width: 767px) {
  .points__row--comments h4:nth-child(3) {
    margin-left: calc(44 / var(--base-width) * 100vw);
  }
}
.points__row--comments h4:nth-child(3)::after {
  left: 15%;
}
.points__row--number {
  display: flex;
  align-items: center;
}
.points__row--number h3 {
  margin: 0 calc(20 / var(--base-width) * 100vw) 0 0;
  font-family: "Akrobat", sans-serif;
  font-weight: 900;
  color: #5d529b;
  border-right: 1px solid #666666;
  height: 100%;
  display: flex;
  align-items: center;
  min-width: calc(50 / var(--base-width) * 100vw);
  font-size: calc(35 / var(--base-width) * 100vw);
  line-height: 1;
}
@media only screen and (min-width: 768px) {
  .points__row--number h3 {
    font-size: 30px;
    border-right-width: 2px;
    min-width: 45px;
    margin: 0 20px 0 0;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--number h3 {
    font-size: 50px;
    min-width: 65px;
  }
}
.points__row--number h4 {
  flex-basis: 0;
  flex-grow: 1;
  margin: 0;
  font-weight: 600;
  font-size: calc(28 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row--number h4 {
    font-size: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .points__row--number h4 {
    font-size: 36px;
  }
}
.points__row:nth-child(odd) {
  clip-path: polygon(0 calc(110 / var(--base-width) * 100vw), 100% 0, 100% calc(100% - 14.67vw), 0% 100%);
}
@media only screen and (min-width: 768px) {
  .points__row:nth-child(odd) {
    clip-path: polygon(0 10vw, 100% 0, 100% calc(100% - 10vw), 0% 100%);
  }
}
@media only screen and (min-width: 1200px) {
  .points__row:nth-child(odd) {
    clip-path: polygon(0 8.85vw, 100% 0, 100% calc(100% - 8.85vw), 0% 100%);
  }
}
.points__row:nth-child(odd)::before, .points__row:nth-child(odd)::after {
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}
.points__row:nth-child(odd)::before {
  z-index: -8;
  background-image: -moz-linear-gradient(90deg, rgba(102, 48, 133, 0.99608) 0%, #ae324c 14%, #da3c32 53%, #e27d3f 87%, #e9be4c 100%);
  background-image: -webkit-linear-gradient(90deg, rgba(102, 48, 133, 0.99608) 0%, #ae324c 14%, #da3c32 53%, #e27d3f 87%, #e9be4c 100%);
  background-image: -ms-linear-gradient(90deg, rgba(102, 48, 133, 0.99608) 0%, #ae324c 14%, #da3c32 53%, #e27d3f 87%, #e9be4c 100%);
  opacity: 0.2;
}
.points__row:nth-child(odd)::after {
  background: #663085;
  background: linear-gradient(32deg, #663085 0%, #ae324c 14%, #da3c32 54%, #e9be4c 100%);
  z-index: 1;
  opacity: 0.2;
  z-index: -3;
}
.points__row:nth-child(odd) .points__row--inner h2 {
  color: var(--white);
}
.points__row:nth-child(even) {
  padding-block: calc(40 / var(--base-width) * 100vw) calc(160 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .points__row:nth-child(even) {
    padding-block: calc(30 / var(--base-width) * 100vw) calc(80 / var(--base-width) * 100vw);
  }
}
.points__row:nth-child(even) > h2 {
  color: var(--primary);
}
.points__row:nth-child(even) .points__row--inner h2 {
  left: auto;
}
@media only screen and (min-width: 1600px) {
  .points__row:nth-child(even) .points__row--inner h2 {
    right: -205px;
  }
}
@media only screen and (min-width: 1800px) {
  .points__row:nth-child(even) .points__row--inner h2 {
    right: -295px;
  }
}

.compare {
  padding-block: calc(20 / var(--base-width) * 100vw) calc(200 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare {
    padding-block: 80px 260px;
  }
}
@media only screen and (min-width: 768px) {
  .compare .slick-arrow {
    transform: translate(-50%, -50%);
  }
}
.compare .slick-arrow.slick-prev {
  left: calc(-40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare .slick-arrow.slick-prev {
    left: 15%;
  }
}
@media only screen and (min-width: 992px) {
  .compare .slick-arrow.slick-prev {
    left: 25%;
  }
}
.compare .slick-arrow.slick-next {
  right: calc(-40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare .slick-arrow.slick-next {
    right: 15%;
    transform: translate(50%, -50%);
  }
}
@media only screen and (min-width: 992px) {
  .compare .slick-arrow.slick-next {
    right: 25%;
  }
}
@media only screen and (min-width: 768px) {
  .compare .slick-list {
    padding-inline: 15%;
  }
}
@media only screen and (min-width: 992px) {
  .compare .slick-list {
    padding-inline: 25%;
  }
}
.compare .slick-slide {
  margin: calc(40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare .slick-slide {
    margin: 30px 39px;
  }
}
.compare .slick-dots {
  bottom: calc(-50 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare .slick-dots {
    bottom: -55px;
  }
}
.compare__item {
  position: relative;
  z-index: 1;
  padding: calc(40 / var(--base-width) * 100vw) calc(35 / var(--base-width) * 100vw) calc(35 / var(--base-width) * 100vw);
  text-align: center;
  box-shadow: 0px 0px calc(29 / var(--base-width) * 100vw) 0px rgba(98, 98, 100, 0.9);
}
@media only screen and (min-width: 768px) {
  .compare__item {
    padding: 40px 35px;
    box-shadow: 0px 0px 29px 0px rgba(98, 98, 100, 0.9);
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item {
    padding: 50px 45px 40px;
  }
}
.compare__item::before {
  content: "";
  position: absolute;
  top: calc(8 / var(--base-width) * 100vw);
  left: calc(8 / var(--base-width) * 100vw);
  right: calc(8 / var(--base-width) * 100vw);
  bottom: calc(8 / var(--base-width) * 100vw);
  background: var(--white);
  z-index: -1;
}
@media only screen and (min-width: 768px) {
  .compare__item::before {
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
  }
}
.compare__item ul {
  font-size: calc(28 / var(--base-width) * 100vw);
  line-height: 1.38;
  font-weight: 600;
}
@media only screen and (min-width: 768px) {
  .compare__item ul {
    font-size: 23px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item ul {
    font-size: 36px;
  }
}
.compare__item ul li {
  display: flex;
  align-items: center;
  gap: calc(18 / var(--base-width) * 100vw);
  text-align: left;
}
@media only screen and (min-width: 768px) {
  .compare__item ul li {
    gap: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item ul li {
    gap: 24px;
  }
}
.compare__item ul li + li {
  margin-top: calc(30 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare__item ul li + li {
    margin-top: 18px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item ul li + li {
    margin-top: 40px;
  }
}
.compare__item ul li label {
  background: #404040;
  color: var(--white);
  font-weight: 600;
  font-size: calc(24 / var(--base-width) * 100vw);
  line-height: 1.5;
  min-width: calc(174 / var(--base-width) * 100vw);
  min-height: calc(40 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .compare__item ul li label {
    font-size: 18px;
    min-height: 40px;
    min-width: 140px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item ul li label {
    font-size: 28px;
    min-height: 51px;
    min-width: 226px;
  }
}
.compare__item ul li label.special-label {
  background: var(--primary);
}
.compare__item ul li strong {
  font-size: calc(30 / var(--base-width) * 100vw);
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .compare__item ul li strong {
    font-size: 22px;
  }
}
@media only screen and (min-width: 768px) {
  .compare__item ul li strong {
    font-size: 40px;
  }
}
.compare__item h3 {
  font-weight: 700;
  font-size: calc(40 / var(--base-width) * 100vw);
  margin: calc(35 / var(--base-width) * 100vw) 0 0;
  border: calc(5 / var(--base-width) * 100vw) solid var(--primary);
  color: var(--red);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(98 / var(--base-width) * 100vw);
  padding: calc(10 / var(--base-width) * 100vw) calc(60 / var(--base-width) * 100vw);
  line-height: 1;
  min-width: calc(448 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare__item h3 {
    font-size: 26px;
    margin: 30px 0 0;
    border-width: 5px;
    min-height: 80px;
    padding: 5px 20px;
    min-width: 280px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item h3 {
    font-size: 50px;
    margin: 50px 0 0;
    min-height: 127px;
    padding: 5px 35px;
    min-width: 320px;
  }
}
@media only screen and (min-width: 1800px) {
  .compare__item h3 {
    font-size: 40px;
    min-width: 590px;
  }
}
.compare__item h3 strong {
  font-weight: 700;
  font-size: calc(62 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .compare__item h3 strong {
    font-size: 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .compare__item h3 strong {
    font-size: 60px;
  }
}
@media only screen and (min-width: 1800px) {
  .compare__item h3 strong {
    font-size: 80px;
  }
}

.distinctive {
  padding-block: calc(60 / var(--base-width) * 100vw) calc(120 / var(--base-width) * 100vw);
  background: #F6F1EA;
}
@media only screen and (min-width: 768px) {
  .distinctive {
    padding-block: 90px 170px;
  }
}
.distinctive h2 {
  font-size: calc(38 / var(--base-width) * 100vw);
  margin: 0 0 calc(48 / var(--base-width) * 100vw);
  font-weight: 700;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .distinctive h2 {
    text-align: left;
    font-size: 36px;
    margin: 0 0 15px;
  }
}
.distinctive__table {
  font-size: calc(28 / var(--base-width) * 100vw);
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: 0;
}
@media only screen and (min-width: 768px) {
  .distinctive__table {
    font-size: 24px;
  }
}
@media only screen and (max-width: 1200px) {
  .distinctive__table {
    overflow-x: auto;
  }
}
.distinctive__table--inner {
  display: flex;
  gap: calc(4 / var(--base-width) * 100vw);
  min-width: calc(1500 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--inner {
    gap: 4px;
    min-width: 1200px;
  }
}
.distinctive__table--col {
  display: flex;
  flex-direction: column;
  gap: calc(6 / var(--base-width) * 100vw);
  flex-basis: 0;
  flex-grow: 1;
}
@media only screen and (min-width: 768px) {
  .distinctive__table--col {
    gap: 6px;
  }
}
.distinctive__table--col h3 {
  font-size: calc(28 / var(--base-width) * 100vw);
  background: #404040;
  min-height: calc(59 / var(--base-width) * 100vw);
  color: var(--white);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(5 / var(--base-width) * 100vw);
  margin: 0;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .distinctive__table--col h3 {
    font-size: 28px;
    min-height: 59px;
    padding: 5px;
  }
}
.distinctive__table--col:nth-child(1) {
  flex-grow: 0.9;
}
.distinctive__table--col-special {
  flex-grow: 1.1;
  position: relative;
  z-index: 1;
}
.distinctive__table--col-special h3 {
  background: url("../images/bg-gradient-6.png") no-repeat 50% 50%/cover;
}
.distinctive__table--col-special::before {
  content: "";
  z-index: -2;
  position: absolute;
  top: 0;
  left: calc(-7 / var(--base-width) * 100vw);
  right: calc(-7 / var(--base-width) * 100vw);
  bottom: calc(-7 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--col-special::before {
    left: -7px;
    right: -7px;
    bottom: -7px;
  }
}
.distinctive__table--col-special::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: #F6F1EA;
  z-index: -1;
}
.distinctive__table--cell {
  height: calc(170 / var(--base-width) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(15 / var(--base-width) * 100vw);
  background: var(--white);
  text-align: center;
  padding: calc(5 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--cell {
    height: 170px;
    gap: 15px;
  }
}
.distinctive__table--cell h4 {
  margin: 0;
  font-weight: 700;
  font-size: calc(28 / var(--base-width) * 100vw);
  line-height: 1.4;
}
@media only screen and (min-width: 768px) {
  .distinctive__table--cell h4 {
    font-size: 28px;
  }
}
.distinctive__table--cell small {
  font-size: calc(20 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--cell small {
    font-size: 20px;
  }
}
.distinctive__table--cell span {
  color: var(--red);
}
.distinctive__table--cell img {
  max-width: calc(46 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--cell img {
    max-width: 46px;
  }
}
.distinctive__table--1 {
  padding-bottom: calc(106 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__table--1 {
    padding-bottom: 106px;
  }
}
.distinctive__table--1 .distinctive__table--col-special .distinctive__table--cell:last-child {
  position: relative;
}
.distinctive__table--1 .distinctive__table--col-special .distinctive__table--cell:last-child::before {
  content: "";
  width: calc(47 / var(--base-width) * 100vw);
  height: calc(61 / var(--base-width) * 100vw);
  background: url("../images/double-arrow-down-2.png") no-repeat 0 0/100%;
  bottom: calc(-84 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}
@media only screen and (min-width: 768px) {
  .distinctive__table--1 .distinctive__table--col-special .distinctive__table--cell:last-child::before {
    width: 47px;
    height: 61px;
    bottom: -84px;
  }
}
.distinctive__list {
  max-width: 970px;
  margin: 0 auto calc(140 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__list {
    margin: 0 auto 140px;
  }
}
.distinctive__list ul {
  font-size: calc(32 / var(--base-width) * 100vw);
  font-weight: 600;
  line-height: 1.42;
}
@media only screen and (min-width: 768px) {
  .distinctive__list ul {
    font-size: 32px;
  }
}
.distinctive__list ul li {
  background: url("../images/check-purple.png") no-repeat calc(35 / var(--base-width) * 100vw) 50%/calc(50 / var(--base-width) * 100vw) var(--white);
  padding: calc(21 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw) calc(21 / var(--base-width) * 100vw) calc(125 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__list ul li {
    padding: 21px 30px 21px 125px;
    background-size: 50px;
    background-position: 35px 50%;
  }
}
.distinctive__list ul li + li {
  margin-top: calc(24 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__list ul li + li {
    margin-top: 24px;
  }
}
.distinctive__list ul li strong {
  font-size: calc(35 / var(--base-width) * 100vw);
  color: var(--red);
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .distinctive__list ul li strong {
    font-size: 35px;
  }
}
.distinctive__bottom {
  position: relative;
  z-index: 1;
  margin-top: calc(165 / var(--base-width) * 100vw);
  text-align: center;
  font-weight: 700;
  font-size: calc(60 / var(--base-width) * 100vw);
  line-height: 1.28;
  padding: calc(70 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw) calc(65 / var(--base-width) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(36 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .distinctive__bottom {
    font-size: 50px;
    padding: 50px 30px 45px;
    gap: 36px;
    margin-top: 120px;
  }
}
@media only screen and (min-width: 1200px) {
  .distinctive__bottom {
    font-size: 70px;
    padding: 70px 60px 65px;
    margin-top: 165px;
  }
}
.distinctive__bottom::before {
  content: "";
  position: absolute;
  top: calc(10 / var(--base-width) * 100vw);
  left: calc(10 / var(--base-width) * 100vw);
  right: calc(10 / var(--base-width) * 100vw);
  bottom: calc(10 / var(--base-width) * 100vw);
  background: var(--white);
  z-index: -1;
}
@media only screen and (min-width: 768px) {
  .distinctive__bottom::before {
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
  }
}
.distinctive__bottom::after {
  content: "";
  position: absolute;
  width: calc(76 / var(--base-width) * 100vw);
  height: calc(93 / var(--base-width) * 100vw);
  background: url("../images/double-arrow-down.png") no-repeat 0 0/100%;
  top: calc(-60 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 768px) {
  .distinctive__bottom::after {
    width: 76px;
    height: 93px;
    top: -60px;
  }
}
.distinctive__bottom h3 {
  background: url("../images/bg-gradient-2.png") no-repeat 50% 50%/cover;
  color: var(--white);
  font-size: calc(80 / var(--base-width) * 100vw);
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.4px;
  padding: calc(8 / var(--base-width) * 100vw) calc(65 / var(--base-width) * 100vw);
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .distinctive__bottom h3 {
    font-size: 60px;
    padding: 8px 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .distinctive__bottom h3 {
    font-size: 80px;
    padding: 8px 65px;
  }
}

.activities {
  background: url("../images/activities-bg.png") no-repeat 0 0/cover;
  padding-block: calc(100 / var(--base-width) * 100vw) calc(200 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .activities {
    padding-block: 160px 260px;
  }
}
.activities ul {
  font-size: calc(50 / var(--base-width) * 100vw);
  line-height: 1.2;
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .activities ul {
    font-size: 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .activities ul {
    font-size: 60px;
  }
}
.activities ul li {
  background: var(--white);
  box-shadow: 0px 0px calc(20 / var(--base-width) * 100vw) 0px rgba(98, 98, 100, 0.4);
  min-height: calc(192 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  padding: calc(50 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw);
  position: relative;
  text-align: center;
  justify-content: center;
}
@media only screen and (min-width: 768px) {
  .activities ul li {
    min-height: 160px;
    padding: 20px 40px 20px 160px;
    box-shadow: 0px 0px 20px 0px rgba(98, 98, 100, 0.4);
    justify-content: flex-start;
  }
}
@media only screen and (min-width: 1200px) {
  .activities ul li {
    min-height: 192px;
    padding: 20px 50px 20px 200px;
  }
}
.activities ul li + li {
  margin-top: calc(65 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .activities ul li + li {
    margin-top: 45px;
  }
}
.activities ul li > strong {
  position: absolute;
  left: 50%;
  top: calc(-43 / var(--base-width) * 100vw);
  transform: translateX(-50%);
  font-size: calc(90 / var(--base-width) * 100vw);
  line-height: 1;
  font-family: "Akrobat", sans-serif;
  font-weight: 900;
  color: var(--primary);
}
@media only screen and (min-width: 768px) {
  .activities ul li > strong {
    font-size: 70px;
    left: 45px;
    top: 50%;
    transform: translateY(-50%);
  }
}
@media only screen and (min-width: 1200px) {
  .activities ul li > strong {
    font-size: 106px;
  }
}
.activities__bottom {
  text-align: left;
  position: relative;
  margin-top: calc(180 / var(--base-width) * 100vw);
  font-size: calc(26 / var(--base-width) * 100vw);
  font-weight: 500;
  line-height: 1.73;
}
@media only screen and (min-width: 768px) {
  .activities__bottom {
    margin-top: 180px;
    font-size: 26px;
    text-align: center;
  }
}
.activities__bottom::before {
  content: "";
  position: absolute;
  width: calc(76 / var(--base-width) * 100vw);
  height: calc(93 / var(--base-width) * 100vw);
  background: url("../images/double-arrow-down.png") no-repeat 0 0/100%;
  top: calc(-130 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 768px) {
  .activities__bottom::before {
    width: 76px;
    height: 93px;
    top: -130px;
  }
}
.activities__bottom h3 {
  display: inline-flex;
  position: relative;
  z-index: 1;
  color: var(--white);
  font-size: calc(60 / var(--base-width) * 100vw);
  font-weight: 700;
  line-height: 1.28;
  padding: calc(20 / var(--base-width) * 100vw) calc(70 / var(--base-width) * 100vw);
  min-height: calc(280 / var(--base-width) * 100vw);
  margin: 0 0 calc(60 / var(--base-width) * 100vw);
  align-items: center;
  justify-content: center;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .activities__bottom h3 {
    font-size: 54px;
    margin: 0 0 60px;
    min-height: 220px;
    padding: 20px 50px;
  }
}
@media only screen and (min-width: 1200px) {
  .activities__bottom h3 {
    font-size: 70px;
    min-height: 280px;
    padding: 20px 70px;
  }
}
.activities__bottom h3::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.5;
  mix-blend-mode: multiply;
}

.products {
  padding-block: calc(130 / var(--base-width) * 100vw) calc(110 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .products {
    padding-block: 170px 150px;
  }
}
.products__title {
  text-align: center;
  font-weight: 600;
  font-size: calc(32 / var(--base-width) * 100vw);
  margin-bottom: calc(80 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .products__title {
    font-size: 26px;
    margin-bottom: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .products__title {
    margin-bottom: 140px;
    font-size: 38px;
  }
}
.products__title h2 {
  font-size: calc(52 / var(--base-width) * 100vw);
  font-weight: 700;
  line-height: 1.3;
  position: relative;
  margin: 0 0 calc(80 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .products__title h2 {
    font-size: 48px;
  }
}
@media only screen and (min-width: 1200px) {
  .products__title h2 {
    font-size: 52px;
  }
}
.products__title h2::before {
  content: "";
  width: calc(101 / var(--base-width) * 100vw);
  height: calc(5 / var(--base-width) * 100vw);
  background: var(--red);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 768px) {
  .products__title h2::before {
    width: 101px;
    height: 5px;
  }
}
.products__title h3 {
  font-size: calc(38 / var(--base-width) * 100vw);
  font-weight: 700;
  display: inline-block;
  background: var(--primary);
  color: var(--white);
  line-height: 1.3;
  margin: 0 0 calc(40 / var(--base-width) * 100vw);
  padding: calc(9 / var(--base-width) * 100vw) calc(22 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .products__title h3 {
    font-size: 32px;
    margin: 0 0 18px;
    padding: 9px 22px;
  }
}
@media only screen and (min-width: 1200px) {
  .products__title h3 {
    font-size: 38px;
  }
}
.products__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(42 / var(--base-width) * 100vw) calc(24 / var(--base-width) * 100vw);
  padding-inline: calc(40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .products__list {
    grid-template-columns: 1fr 1fr;
    gap: 42px 24px;
    padding-inline: 0;
  }
}
.products__list figure img {
  width: 100%;
}

.procedure {
  padding-block: calc(110 / var(--base-width) * 100vw) calc(160 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .procedure {
    padding-block: 110px 270px;
  }
}
.procedure ul li {
  background: #663085;
  background: linear-gradient(32deg, #663085 30%, #ae324c 40%, #da3c32 45%, #e9be4c 75%);
  position: relative;
  z-index: 1;
  font-size: calc(45 / var(--base-width) * 100vw);
  line-height: 1.35;
  box-shadow: 0px 0px calc(21 / var(--base-width) * 100vw) 0px rgba(98, 98, 100, 0.9);
  padding: calc(24 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw);
  min-height: calc(183 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  font-weight: 600;
  text-align: center;
  justify-content: center;
}
@media only screen and (min-width: 768px) {
  .procedure ul li {
    justify-content: flex-start;
    text-align: left;
    min-height: 183px;
    padding: 20px 50px 20px 120px;
    font-size: 32px;
    box-shadow: 0px 0px 21px 0px rgba(98, 98, 100, 0.9);
  }
}
@media only screen and (min-width: 1200px) {
  .procedure ul li {
    padding: 20px 50px 20px 200px;
    font-size: 48px;
  }
}
.procedure ul li + li {
  margin-top: calc(40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .procedure ul li + li {
    margin-top: 35px;
  }
}
.procedure ul li + li::after {
  content: "";
  width: calc(39 / var(--base-width) * 100vw);
  height: calc(50 / var(--base-width) * 100vw);
  background: url("../images/double-arrow-down-2.png") no-repeat 0 0/100%;
  top: calc(-50 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}
@media only screen and (min-width: 768px) {
  .procedure ul li + li::after {
    width: 47px;
    height: 61px;
    top: -50px;
  }
}
.procedure ul li::before {
  content: "";
  position: absolute;
  top: calc(8 / var(--base-width) * 100vw);
  left: calc(8 / var(--base-width) * 100vw);
  bottom: calc(8 / var(--base-width) * 100vw);
  right: calc(8 / var(--base-width) * 100vw);
  z-index: -1;
  background: var(--white);
}
@media only screen and (min-width: 768px) {
  .procedure ul li::before {
    top: 8px;
    left: 8px;
    bottom: 8px;
    right: 8px;
  }
}
.procedure ul li > strong {
  position: absolute;
  left: calc(22 / var(--base-width) * 100vw);
  top: calc(22 / var(--base-width) * 100vw);
  font-size: calc(60 / var(--base-width) * 100vw);
  line-height: 1;
  font-family: "Akrobat", sans-serif;
  font-weight: 900;
  color: var(--primary);
}
@media only screen and (min-width: 768px) {
  .procedure ul li > strong {
    left: 30px;
    font-size: 66px;
    top: 50%;
    transform: translateY(-50%);
  }
}
@media only screen and (min-width: 1200px) {
  .procedure ul li > strong {
    font-size: 105px;
  }
}

.strength {
  position: relative;
}
.strength picture {
  display: block;
}
.strength picture img {
  display: block;
  width: 100%;
}
.strength__inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.strength__inner .container {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  padding-bottom: calc(35 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .strength__inner .container {
    padding-bottom: 50px;
  }
}
@media only screen and (min-width: 1200px) {
  .strength__inner .container {
    padding-bottom: 135px;
  }
}
@media only screen and (max-width: 767px) {
  .strength__inner .container {
    padding-inline: calc(10 / var(--base-width) * 100vw);
  }
}
.strength__inner h2 {
  font-size: calc(60 / var(--base-width) * 100vw);
  color: var(--white);
  line-height: 1.412;
  font-weight: 700;
  text-shadow: 0 0 20px #626264;
  margin: 0 0 calc(30 / var(--base-width) * 100vw);
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .strength__inner h2 {
    font-size: 48px;
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .strength__inner h2 {
    font-size: 80px;
    margin: 0 0 80px;
  }
}
.strength__inner h2 span {
  font-size: calc(75 / var(--base-width) * 100vw);
  padding: calc(5 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw);
  background: url("../images/bg-gradient-2.png") no-repeat 50% 50%/cover;
}
@media only screen and (min-width: 768px) {
  .strength__inner h2 span {
    font-size: 50px;
    padding: 2px 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .strength__inner h2 span {
    font-size: 75px;
    padding: 3px 30px;
  }
}
.strength__inner h6 {
  font-weight: 600;
  font-size: calc(28 / var(--base-width) * 100vw);
  line-height: 1.285;
  color: var(--white);
  margin: 0;
  align-self: flex-end;
}
@media only screen and (min-width: 768px) {
  .strength__inner h6 {
    font-size: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .strength__inner h6 {
    font-size: 28px;
  }
}

.mission {
  padding-block: calc(55 / var(--base-width) * 100vw) calc(390 / var(--base-width) * 100vw);
  position: relative;
}
@media only screen and (min-width: 768px) {
  .mission {
    padding-block: 120px 400px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission {
    padding-block: 150px 520px;
  }
}
@media only screen and (min-width: 1800px) {
  .mission {
    padding-block: 170px 670px;
  }
}
.mission > h2 {
  position: absolute;
  font-family: "AbadiMT", sans-serif;
  font-size: calc(177 / var(--base-width) * 100vw);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  bottom: calc(110 / var(--base-width) * 100vw);
  left: 50%;
  transform: translateX(-50%) rotate(-5deg);
  opacity: 0.3;
  mix-blend-mode: multiply;
}
@media only screen and (min-width: 768px) {
  .mission > h2 {
    font-size: 140px;
    bottom: 130px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission > h2 {
    font-size: 280px;
  }
}
@media only screen and (min-width: 1800px) {
  .mission > h2 {
    font-size: 414px;
  }
}
.mission__row {
  font-size: calc(30 / var(--base-width) * 100vw);
  line-height: 1.73;
  font-weight: 600;
}
@media only screen and (min-width: 768px) {
  .mission__row {
    font-size: 24px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission__row {
    font-size: 30px;
  }
}
.mission__row + .mission__row {
  margin-top: calc(75 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .mission__row + .mission__row {
    margin-top: 80px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission__row + .mission__row {
    margin-top: 190px;
  }
}
.mission__row strong {
  font-weight: 700;
  color: var(--red);
}
.mission__row--top {
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .mission__row--top {
    flex-direction: row;
    text-align: left;
  }
}
.mission__row--top h4 {
  background: #663085;
  background: linear-gradient(0deg, #663085 14%, #ae324c 30%, #da3c32 54%, #e9be4c 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "Akrobat", sans-serif;
  font-size: calc(90 / var(--base-width) * 100vw);
  line-height: 1;
  margin: 0 0 calc(25 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .mission__row--top h4 {
    font-size: 76px;
    min-width: 90px;
    margin: 0;
  }
}
@media only screen and (min-width: 992px) {
  .mission__row--top h4 {
    font-size: 90px;
    min-width: 110px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission__row--top h4 {
    font-size: 120px;
    min-width: 140px;
  }
}
.mission__row--top h3 {
  font-size: calc(48 / var(--base-width) * 100vw);
  line-height: 1.29;
  margin: 0 0 calc(35 / var(--base-width) * 100vw);
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .mission__row--top h3 {
    font-size: 32px;
    margin: 0;
  }
}
@media only screen and (min-width: 992px) {
  .mission__row--top h3 {
    font-size: 48px;
  }
}
@media only screen and (min-width: 1200px) {
  .mission__row--top h3 {
    font-size: 58px;
  }
}

.faq {
  background: #F9F7F2;
  padding-block: calc(80 / var(--base-width) * 100vw) calc(150 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .faq {
    padding-block: 120px 200px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq {
    padding-block: 150px 350px;
  }
}
.faq__item + .faq__item {
  margin-top: calc(40 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .faq__item + .faq__item {
    margin-top: 40px;
  }
}
.faq__item h3 {
  font-size: calc(35 / var(--base-width) * 100vw);
  font-weight: 600;
  line-height: 1.857;
  margin: 0 0 calc(16 / var(--base-width) * 100vw);
  display: flex;
  gap: calc(20 / var(--base-width) * 100vw);
  align-items: center;
  cursor: pointer;
  min-height: calc(116 / var(--base-width) * 100vw);
  background: var(--white);
  padding: calc(20 / var(--base-width) * 100vw) calc(22 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw) calc(10 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .faq__item h3 {
    font-size: 28px;
    margin: 0 0 14px;
    gap: 20px;
    padding: 20px 17px;
    min-height: 100px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item h3 {
    font-size: 35px;
    gap: 28px;
    min-height: 116px;
  }
}
.faq__item h3::before {
  content: "Q";
  font-family: "Akrobat", sans-serif;
  font-size: calc(50 / var(--base-width) * 100vw);
  font-weight: 900;
  color: var(--white);
  background: var(--primary);
  width: calc(67 / var(--base-width) * 100vw);
  min-width: calc(67 / var(--base-width) * 100vw);
  height: calc(67 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  border-radius: 50%;
}
@media only screen and (min-width: 768px) {
  .faq__item h3::before {
    width: 52px;
    min-width: 52px;
    height: 52px;
    font-size: 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item h3::before {
    width: 77px;
    min-width: 77px;
    height: 77px;
    font-size: 50px;
  }
}
.faq__item h3::after {
  content: "";
  width: calc(28 / var(--base-width) * 100vw);
  height: calc(28 / var(--base-width) * 100vw);
  min-width: calc(28 / var(--base-width) * 100vw);
  background: url("../images/plus.png") no-repeat 50% 50%/100%;
  margin-left: auto;
}
@media only screen and (min-width: 768px) {
  .faq__item h3::after {
    width: 28px;
    height: 28px;
    min-width: 28px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item h3::after {
    width: 34px;
    height: 34px;
    min-width: 34px;
  }
}
.faq__item--body {
  background: var(--white);
  font-size: calc(28 / var(--base-width) * 100vw);
  line-height: 1.5;
  position: relative;
  padding: calc(20 / var(--base-width) * 100vw) calc(20 / var(--base-width) * 100vw) calc(40 / var(--base-width) * 100vw) calc(105 / var(--base-width) * 100vw);
  display: none;
}
@media only screen and (min-width: 768px) {
  .faq__item--body {
    font-size: 20px;
    padding: 28px 30px 28px 90px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item--body {
    font-size: 28px;
    padding: 28px 30px 28px 125px;
  }
}
.faq__item--body::before {
  content: "A";
  font-family: "Akrobat", sans-serif;
  font-size: calc(50 / var(--base-width) * 100vw);
  font-weight: 900;
  color: var(--white);
  background: #b3b3b3;
  width: calc(67 / var(--base-width) * 100vw);
  min-width: calc(67 / var(--base-width) * 100vw);
  height: calc(67 / var(--base-width) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  border-radius: 50%;
  position: absolute;
  left: calc(12 / var(--base-width) * 100vw);
  top: calc(12 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .faq__item--body::before {
    width: 52px;
    min-width: 52px;
    height: 52px;
    font-size: 40px;
    left: 17px;
    top: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item--body::before {
    width: 77px;
    min-width: 77px;
    height: 77px;
    font-size: 50px;
  }
}
.faq__item--image {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: calc(30 / var(--base-width) * 100vw);
  font-size: calc(20 / var(--base-width) * 100vw);
  align-items: flex-end;
}
@media only screen and (min-width: 768px) {
  .faq__item--image {
    gap: 30px;
    font-size: 20px;
  }
}
.faq__item--image figure img {
  max-width: calc(185 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .faq__item--image figure img {
    max-width: 120px;
  }
}
@media only screen and (min-width: 1200px) {
  .faq__item--image figure img {
    max-width: 185px;
  }
}
.faq__item--image h6 {
  font-size: calc(20 / var(--base-width) * 100vw);
  font-weight: 400;
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .faq__item--image h6 {
    width: auto;
    font-size: 20px;
  }
}
.faq__item.show h3::after {
  background-image: url("../images/minus.png");
}

.consultation {
  padding-top: calc(155 / var(--base-width) * 100vw);
  position: relative;
  z-index: 5;
}
@media only screen and (min-width: 768px) {
  .consultation {
    padding-top: 150px;
  }
}
@media only screen and (min-width: 1200px) {
  .consultation {
    padding-top: 200px;
  }
}
.consultation .container {
  max-width: 1740px;
}
.consultation__inner {
  border-radius: calc(49 / var(--base-width) * 100vw);
  position: relative;
  z-index: 1;
  min-height: calc(700 / var(--base-width) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(75 / var(--base-width) * 100vw) calc(30 / var(--base-width) * 100vw) calc(10 / var(--base-width) * 100vw);
  gap: calc(45 / var(--base-width) * 100vw);
  background: url("../images/consultation-bg-sp.png") no-repeat 0 100%/cover;
}
@media only screen and (min-width: 768px) {
  .consultation__inner {
    border-radius: 32px;
    padding: 140px 40px 90px;
    gap: 65px;
    min-height: 400px;
    background-image: url("../images/consultation-bg.png");
  }
}
@media only screen and (min-width: 1200px) {
  .consultation__inner {
    border-radius: 49px;
  }
}
.consultation__inner > h2 {
  position: absolute;
  top: 34%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: var(--primary);
  opacity: 0.3;
  margin: 0;
  font-family: "AbadiMT", sans-serif;
  letter-spacing: 0.4px;
  font-size: calc(155 / var(--base-width) * 100vw);
  mix-blend-mode: multiply;
  line-height: 1;
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .consultation__inner > h2 {
    font-size: 140px;
    top: 50%;
  }
}
@media only screen and (min-width: 992px) {
  .consultation__inner > h2 {
    font-size: 220px;
  }
}
@media only screen and (min-width: 1800px) {
  .consultation__inner > h2 {
    font-size: 374px;
  }
}
.consultation__inner h3 {
  font-size: calc(80 / var(--base-width) * 100vw);
  color: var(--white);
  line-height: 1.2;
  text-shadow: 0px 0px calc(20 / var(--base-width) * 100vw) rgba(98, 98, 100, 0.85);
  font-weight: 700;
  margin: 0;
  mix-blend-mode: hard-light;
}
@media only screen and (min-width: 768px) {
  .consultation__inner h3 {
    font-size: 54px;
    text-shadow: 0px 0px 20px rgba(98, 98, 100, 0.85);
  }
}
@media only screen and (min-width: 1200px) {
  .consultation__inner h3 {
    font-size: 70px;
  }
}
@media only screen and (min-width: 1800px) {
  .consultation__inner h3 {
    font-size: 100px;
  }
}
.consultation__link {
  background: url("../images/arrow-circle.png") no-repeat 50% 100%/calc(100 / var(--base-width) * 100vw);
  font-weight: 600;
  font-size: calc(40 / var(--base-width) * 100vw);
  display: inline-flex;
  flex-direction: column;
  text-align: left;
  line-height: 1.2;
  padding-bottom: calc(125 / var(--base-width) * 100vw);
  min-height: 127px;
  justify-content: center;
}
@media only screen and (min-width: 768px) {
  .consultation__link {
    font-size: 26px;
    padding-bottom: 0;
    padding-right: 100px;
    background-size: 80px;
    background-position: 100% 50%;
  }
}
@media only screen and (min-width: 1200px) {
  .consultation__link {
    font-size: 32px;
    padding-right: 140px;
    background-size: 127px;
  }
}
@media only screen and (min-width: 1800px) {
  .consultation__link {
    font-size: 40px;
    padding-right: 180px;
    background-size: 127px;
  }
}
.consultation__link strong {
  font-weight: 700;
  font-size: calc(65 / var(--base-width) * 100vw);
}
@media only screen and (min-width: 768px) {
  .consultation__link strong {
    font-size: 42px;
  }
}
@media only screen and (min-width: 1200px) {
  .consultation__link strong {
    font-size: 52px;
  }
}
@media only screen and (min-width: 1800px) {
  .consultation__link strong {
    font-size: 65px;
  }
}

.last-option {
  margin-top: 10px;
  position: relative;
}
@media only screen and (min-width: 768px) {
  .last-option {
    margin-top: -40px;
  }
}
@media only screen and (min-width: 1200px) {
  .last-option {
    margin-top: -80px;
  }
}
@media only screen and (min-width: 1800px) {
  .last-option {
    margin-top: -100px;
  }
}
.last-option picture {
  display: block;
}
.last-option picture img {
  display: block;
  width: 100%;
}
.last-option h2 {
  font-family: "Hiragino Mincho StdN", "HiraMinStdN", YuMincho, 游明朝, Times New Roman, Hiragino Mincho ProN, HGS明朝B, ＭＳ Ｐ明朝, serif;
  font-weight: 700;
  font-size: calc(54 / var(--base-width) * 100vw);
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
  width: 100%;
  padding-inline: 20px;
  line-height: 1.64;
}
@media only screen and (min-width: 768px) {
  .last-option h2 {
    font-size: 42px;
    top: calc(50% + 40px);
  }
}
@media only screen and (min-width: 1200px) {
  .last-option h2 {
    font-size: 56px;
    top: calc(50% + 80px);
  }
}
@media only screen and (min-width: 1800px) {
  .last-option h2 {
    font-size: 70px;
    top: calc(50% + 100px);
  }
}