@charset "UTF-8";
/***********************************************************
基本設定
************************************************************/
img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

i {
  display: inline-block;
}

a {
  display: block;
}
a:hover {
  opacity: 0.8;
  transition: all 0.3s;
  cursor: pointer;
}

/***********************************************************
body
************************************************************/
body {
  width: 100%;
  background-color: #ffffff;
  font-family: "Noto Sans JP", sans-serif;
  color: #000000;
  min-width: 23.4375rem;
}

/***********************************************************
skip-link
************************************************************/
.skip-link {
  position: absolute;
  top: -40px;
  /* 初期位置は画面外 */
  left: 0;
  z-index: 100;
  padding: 8px;
  background: #000;
  text-decoration: none;
  color: #fff;
}

.skip-link:focus {
  top: 0;
  /* フォーカス時に表示される */
}

/***********************************************************
loading-animation
************************************************************/
#loading {
  position: fixed;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: white;
}

.spinner {
  width: 50px;
  height: 50px;
  border: 5px solid #ccc;
  border-top: 5px solid #333;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
#loadingarea {
  display: none;
}

/***********************************************************
common
************************************************************/
/*---------- フォント ----------*/
.poppins {
  font-family: "Poppins", sans-serif;
}

.oleo {
  font-family: "Oleo Script", system-ui;
}

.cta-btn__inner {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 18.75rem;
  height: 3.5rem;
  margin-inline: auto;
  padding: 1.25rem;
  background-color: #bdfa3e;
  font-weight: 900;
  color: #454545;
  line-height: 1;
  text-align: center;
  border-radius: 5px;
  transition: transform 0.3s ease;
  /* 拡大＆浮きのアニメ */
}

/* 光 */
.cta-btn__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 50%;
  height: 100%;
  background: rgba(255, 255, 255, 0.4);
  transform: skewX(-20deg);
  transition: left 0.6s ease;
}

/* ホバー時の光 ＋ 浮き＆拡大 */
.cta-btn__inner:hover::before {
  left: 130%;
  opacity: 1;
}

/* ここが変更ポイント：拡大 & 浮かせる */
.cta-btn__inner:hover {
  opacity: 1;
  transform: translateY(-4px) scale(1.04);
}

.section__container--common01 {
  /*---------- セクション左右幅-01 ----------*/
  padding-inline: 1.71875rem;
}

.section__container--common02 {
  /*---------- セクション左右幅-02 ----------*/
  padding-inline: 1.09375rem;
}

.section__container--common03 {
  /*---------- セクション左右幅-03 ----------*/
  padding-inline: 1.25rem;
}

.section__content--common {
  /*---------- コンテンツ上下余白 ----------*/
  max-width: 67.5rem;
  margin-inline: auto;
  padding: clamp(2.125rem, -0.069rem + 9.36vw, 6.25rem) 0 clamp(2.5rem, 0.505rem + 8.51vw, 6.25rem);
}

.section__title--common {
  /*---------- セクションタイトル ----------*/
  margin-bottom: clamp(1.75rem, 0.021rem + 7.38vw, 5rem);
  font-size: clamp(1.625rem, 1.16rem + 1.99vw, 2.5rem);
  font-weight: 900;
  line-height: 1.5;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .section__title--common {
    line-height: 1;
  }
}

.toggle-btn {
  /*---------- 詳しくはこちらボタン ----------*/
  position: relative;
  width: 100%;
  padding: 1.375rem 1.25rem;
  font-size: clamp(1rem, 0.934rem + 0.28vw, 1.125rem);
  font-weight: 700;
  line-height: 1;
  text-align: center;
  border: solid 0.125rem;
}
.toggle-btn__bar {
  /*---------- 詳しくはこちらボタンのバー ----------*/
  position: absolute;
  top: 50%;
  right: 0.75rem;
  display: inline-block;
  width: 1rem;
  height: 0.125rem;
  background-color: #000000;
  transform: translateY(-50%);
}
.toggle-btn__bar--bar02 {
  /*---------- 詳しくはこちらの動くバーの＋状態 ----------*/
  opacity: 1;
  /* 中心を軸にする（デフォルト） */
  transform: translateY(-50%) rotate(90deg);
  transform-origin: center center;
  transition: all 0.7s ease 0s;
}
.toggle-btn__bar--close {
  /*---------- 詳しくはこちらの動くバーの－状態 ----------*/
  opacity: 0;
  transform: translateX(-50%) rotate(450deg);
  transition: all 0.7s ease 0s;
}

.aside {
  /*---------- アサイド外枠 ----------*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 3.125rem;
  width: 100%;
  padding: clamp(4.0625rem, 3.398rem + 2.84vw, 5.3125rem) 1.25rem clamp(4.0625rem, 3.032rem + 4.4vw, 6rem);
  background-image: url(../images/sp/start_bg_sp.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .aside {
    background-image: url(../images/pc/aside_bg_pc.webp);
  }
}
.aside__catch {
  /*---------- アサイドのキャッチコピー ----------*/
  font-size: clamp(1.0625rem, 0.996rem + 0.28vw, 1.1875rem);
  font-weight: 900;
  color: #ffffff;
  line-height: 1.7647058824;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .aside__catch {
    line-height: 1;
  }
}
@media screen and (min-width: 768px) {
  .aside__catch br {
    display: none;
  }
}

/***********************************************************
header
************************************************************/
.header {
  /*---------- header ----------*/
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 3.75rem;
  background-color: #ffffff;
}
@media screen and (min-width: 1024px) {
  .header {
    height: 4.75rem;
  }
}
.header__container {
  /*---------- ヘッダー内の幅とサイド余白 ----------*/
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 85.375rem;
  margin-inline: auto;
  padding: 0.625rem 1.25rem;
}
@media screen and (min-width: 1024px) {
  .header__container {
    padding: 0 0 0 2.1875rem;
  }
}
.header__logo img {
  /*---------- ヘッダーロゴ ----------*/
  width: clamp(6.5625rem, 4.056rem + 10.7vw, 13.175rem);
  height: clamp(1.125rem, 0.676rem + 1.92vw, 2.3125rem);
}
.header__burger {
  /*---------- ハンバーガーメニューボタン ----------*/
  position: relative;
  z-index: 3;
  transition: 0.3s;
}
@media screen and (min-width: 1024px) {
  .header__burger {
    display: none;
  }
}
.header__burger-bar {
  /*---------- ボタンのバー ----------*/
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 2.5rem;
}
.header__nav {
  /*---------- ハンバーガナビゲーション枠 ----------*/
  z-index: 2;
  opacity: 0;
  visibility: hidden;
}
@media screen and (min-width: 1024px) {
  .header__nav {
    display: flex;
    opacity: 1;
    visibility: visible;
  }
}
.header__nav-list {
  /*---------- ナビゲーションリスト ----------*/
  position: absolute;
  top: 3.75rem;
  right: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  row-gap: 0.875rem;
  width: 100%;
  padding: 0.938rem 1.625rem;
  background-color: #ffffff;
}
@media screen and (min-width: 1024px) {
  .header__nav-list {
    position: static;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    -moz-column-gap: 3.125rem;
         column-gap: 3.125rem;
    width: 100%;
    height: auto;
    padding: 0;
  }
}
.header__nav-item {
  /*---------- ナビゲーションアイテム ----------*/
  font-size: clamp(0.875rem, 0.828rem + 0.2vw, 1rem);
  line-height: 0.875rem;
}
.header__contact-btn {
  /*---------- ナビゲーション内のお申込みボタン ----------*/
  display: none;
}
@media screen and (min-width: 1024px) {
  .header__contact-btn {
    display: block;
    width: 16.5rem;
    height: 4.75rem;
  }
}
@media screen and (min-width: 1024px) and (min-width: 1024px) {
  .header__contact-btn a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: #1989ff;
    font-weight: 700;
    color: #ffffff;
  }
}
@media screen and (min-width: 1024px) {
  .header__nav-link {
    position: relative;
    /*---------- ナビゲーションリンク ----------*/
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
  }
  .header__nav-link::after {
    content: "";
    position: absolute;
    bottom: -0.625rem;
    left: 0;
    width: 0%;
    /* ← 最初は0 */
    height: 2px;
    background-color: #000000;
    /* 下線の色 */
    transition: width 0.3s ease;
    /* ← 横に伸びるアニメーション */
  }
  .header__nav-link:hover::after {
    width: 100%;
    /* ← ホバーで100%まで伸びる */
  }
}
.header__nav.is-active {
  /*---------- ナビゲーションの切り替え ----------*/
  opacity: 1;
  visibility: visible;
  transition: 0.3s;
}

/***********************************************************
fv
************************************************************/
.fv {
  width: 100%;
  padding-top: 3.75rem;
  background-image: linear-gradient(0deg, rgb(3, 132, 245) 0%, rgb(0, 104, 192) 100%);
}
@media screen and (min-width: 1024px) {
  .fv {
    position: relative;
    display: flex;
    flex-direction: row-reverse;
    height: 574px;
    padding-top: 4.75rem;
    background-image: linear-gradient(-180deg, rgb(3, 132, 245) 0%, rgb(0, 104, 192) 100%);
  }
}
.fv__img {
  /*---------- ｆｖ背景画像 ----------*/
  width: 100%;
  max-height: 37.5rem;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 6rem));
}
@media screen and (min-width: 1024px) {
  .fv__img {
    width: 52.1229868228%;
    clip-path: polygon(calc(100% - 26rem) 0, 100% 0, 100% 100%, 0 100%);
  }
  .fv__img img {
    height: 100%;
  }
}
.fv__color {
  /*---------- ｆｖ背景色 ----------*/
  width: 100%;
}
@media screen and (min-width: 1024px) {
  .fv__color {
    width: 47.8770131772%;
    max-width: 654px;
  }
}
.fv__content {
  /*---------- fvコンテンツ　コンテンツ幅 ----------*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-inline: 20px;
  transform: translateY(-50px);
}
@media screen and (min-width: 1024px) {
  .fv__content {
    padding: 6.4375rem 0 0 5.375rem;
    transform: none;
  }
}
.fv__selling {
  /*---------- ｆｖセールスポイントのボックス ----------*/
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  row-gap: 0.3125rem;
  margin-inline: auto;
}
@media screen and (min-width: 450px) {
  .fv__selling {
    justify-content: center;
  }
}
@media screen and (min-width: 1024px) {
  .fv__selling {
    justify-content: start;
    height: auto;
    margin-inline: 0;
    padding-inline: 0;
    padding-bottom: 2.5rem;
    background-color: transparent;
  }
}
.fv__catch {
  /*---------- ｆｖキャッチコピー ----------*/
  padding-inline: 0.3125rem;
  background-color: #ffffff;
  font-size: clamp(1.625rem, 1.294rem + 1.41vw, 2.5rem);
  font-weight: bold;
  line-height: 1.8076923077;
}
@media screen and (min-width: 1024px) {
  .fv__catch {
    padding-inline: 0;
    background-color: transparent;
    font-size: clamp(1.75rem, -0.496rem + 3.51vw, 2.5rem);
    color: #ffffff;
    line-height: 1;
  }
}
.fv__circles {
  /*---------- ｆｖのサークルのボックス ----------*/
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 0.3125rem;
       column-gap: 0.3125rem;
  margin-inline: auto;
  margin-top: 0.1875rem;
  margin-bottom: 0.875rem;
  padding-inline: 10px;
}
@media screen and (min-width: 1024px) {
  .fv__circles {
    position: absolute;
    right: 20px;
    bottom: 20px;
    margin-bottom: 0;
  }
}
.fv__circle {
  /*---------- ｆｖのサークル単体 ----------*/
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(5.938rem, 4.312rem + 6.93vw, 8.75rem);
  height: clamp(5.938rem, 4.312rem + 6.93vw, 8.75rem);
  background-image: linear-gradient(125deg, rgb(189, 250, 62) 0%, rgb(220, 249, 143) 50%, rgb(239, 252, 173) 100%);
  border-radius: 50%;
}
.fv__circle-text {
  /*---------- ｆｖのサークルのテキスト ----------*/
  font-size: clamp(0.75rem, 0.642rem + 0.46vw, 0.938rem);
  font-weight: bold;
  letter-spacing: 0.01em;
  word-break: keep-all;
  text-align: center;
}
.fv__circle-text--tight {
  letter-spacing: -0.1em;
}
.fv__circle-text--big {
  font-size: clamp(0.938rem, 0.685rem + 1.08vw, 1.375rem);
}
.fv__about {
  /*---------- ｆｖ下の詳細部ボックス ----------*/
  margin-inline: auto;
  font-size: clamp(0.9375rem, 0.914rem + 0.1vw, 1rem);
  font-weight: 500;
  color: #ffffff;
  line-height: 1.8;
}
@media screen and (min-width: 1024px) {
  .fv__about {
    margin-inline: 0;
    line-height: 1.75;
  }
}
.fv__description {
  /*---------- ｆｖ下の詳細部の説明文 ----------*/
  margin-bottom: 1.563rem;
}
@media screen and (min-width: 1024px) {
  .fv__description {
    margin-bottom: 1.25rem;
  }
}
.fv__points {
  /*---------- ｆｖ下の詳細部のポイントボックス ----------*/
  margin-bottom: clamp(2.0625rem, 1.873rem + 0.81vw, 2.5625rem);
}
.fv__point {
  /*---------- ｆｖしたの詳細部ポイントのテキストとアイコン ----------*/
  display: flex;
}
.fv__point::before {
  content: "\f058";
  margin-right: 0.313rem;
  font-size: clamp(0.9375rem, 0.914rem + 0.1vw, 1rem);
  font-family: "Font Awesome 5 Free";
}

/***********************************************************
スライダー
************************************************************/
.slider {
  /*---------- スライダ－セクション全体 ----------*/
  background-color: #d0e7ff;
}
.slider__container {
  width: 100%;
  max-width: 1300px;
  margin-inline: auto;
  /*---------- スライダー左右の余白 ----------*/
  padding: clamp(3.1875rem, 2.478rem + 3.03vw, 5.0625rem) 0 clamp(3.4375rem, 3.083rem + 1.51vw, 4.375rem);
}
.slider__catch {
  /*---------- スライダー内キャッチコピー ----------*/
  margin-bottom: 2.625rem;
  font-size: clamp(0.9375rem, 0.701rem + 1.01vw, 1.5625rem);
  font-weight: 700;
  line-height: 1;
  text-align: center;
}
.slider__catch--blue {
  /*---------- スライダー内キャッチコピーの青色部分 ----------*/
  display: inline-block;
  padding-inline: 0.125rem;
  font-size: clamp(1.625rem, 1.294rem + 1.41vw, 2.5rem);
  font-weight: 700;
  color: #0f6fcc;
  line-height: 1;
}
.slider__item {
  /*---------- スライダーのアイテム単体 ----------*/
  padding-inline: clamp(1.8125rem, 1.623rem + 0.81vw, 2.3125rem);
}
.slider__img {
  /*---------- スライダーの画像 ----------*/
  width: clamp(16.375rem, 14.034rem + 9.99vw, 22.5625rem);
  height: clamp(7.25rem, 6.209rem + 4.44vw, 10rem);
  margin-bottom: 1.875rem;
}
.slider__arrows-out {
  /*---------- スライダーの矢印エリア ----------*/
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(16.375rem, 14.034rem + 9.99vw, 22.5625rem);
  height: 3.75rem;
  margin-inline: auto;
  font-size: 1.5625rem;
  font-weight: 700;
  line-height: 1;
}
.slider__prev, .slider__next {
  /*---------- スライダー矢印の背景 ----------*/
  display: inline-block;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.75rem;
  height: 3.75rem;
  background-color: #1989ff;
  border-radius: 50%;
}
.slider__prev {
  /*---------- スライダー左矢印中央寄せ ----------*/
  margin-right: auto;
}
.slider__prev::before {
  /*---------- スライダー矢印左向き ----------*/
  content: "";
  position: relative;
  left: 3px;
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  color: #ffffff;
  border-top: solid 0.25rem;
  border-right: solid 0.25rem;
  transform: rotate(-135deg);
}
.slider__next {
  /*---------- スライダー右矢印中央寄せ ----------*/
  margin-left: auto;
}
.slider__next::before {
  /*---------- スライダー矢印右向き ----------*/
  content: "";
  position: relative;
  right: 3px;
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  color: #ffffff;
  border-top: solid 0.25rem;
  border-right: solid 0.25rem;
  transform: rotate(45deg);
}

/***********************************************************
section-works
************************************************************/
.works {
  /* 共通のアクティブクラス */
  /* 遅延を付ける */
}
@media screen and (min-width: 768px) {
  .works__title br {
    display: none;
  }
}

.works__cards {
  /*---------- ワークスのカードリスト ----------*/
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 1.25rem;
  max-width: 67.5rem;
  margin-bottom: clamp(3.75rem, 3.251rem + 2.13vw, 4.6875rem);
}
@media screen and (min-width: 768px) {
  .works__cards {
    flex-direction: row;
    align-items: stretch;
  }
}
.works__card {
  /*---------- ワークスのカード単体 ----------*/
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 21.5625rem;
  padding: clamp(2.5rem, 1.902rem + 2.55vw, 3.625rem) 1.5rem clamp(1.875rem, 4.172rem - 2.125vw, 3.375rem);
  background-color: #1989ff;
  color: #ffffff;
  border-radius: 10px;
  opacity: 0;
}
.works .works__card--active {
  animation: upFadeIn 0.8s forwards;
}
@keyframes upFadeIn {
  0% {
    opacity: 0;
    transform: translateY(50%);
  }
  75% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.works .works__card--active {
  animation: upFadeIn 0.8s forwards;
}
@media screen and (min-width: 768px) {
  .works .works__card--01 {
    animation-delay: 0s;
  }
}
@media screen and (min-width: 768px) {
  .works .works__card--02 {
    animation-delay: 0.3s;
  }
}
@media screen and (min-width: 768px) {
  .works .works__card--03 {
    animation-delay: 0.6s;
  }
}
.works__img {
  /*---------- ワークスのカードの中の画像 ----------*/
  width: clamp(7.5rem, 6.364rem + 5.68vw, 10.625rem);
  height: clamp(7.5rem, 6.364rem + 5.68vw, 10.625rem);
  margin-bottom: clamp(1.3125rem, 0.972rem + 1.7vw, 2.25rem);
}
.works__point {
  /*---------- ワークスのカードの中のポイントテキスト ----------*/
  margin-bottom: clamp(1.25rem, 0.718rem + 2.27vw, 2.25rem);
  font-size: clamp(0.875rem, 0.809rem + 0.28vw, 1rem);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .works__point {
    line-height: 1.4375;
  }
}
.works__catch {
  /*---------- ワークスのカードの中のキャッチコピー ----------*/
  font-size: clamp(1rem, 0.767rem + 0.99vw, 1.4375rem);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .works__catch {
    line-height: 1.2173913043;
  }
}
.works__detail {
  /*---------- ワークスの詳細のボックス ----------*/
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 1.75rem;
  padding-inline: clamp(0.625rem, -0.04rem + 2.84vw, 1.875rem);
}
@media screen and (min-width: 768px) {
  .works__detail {
    flex-direction: row;
    -moz-column-gap: 2.8125rem;
         column-gap: 2.8125rem;
  }
}
.works__detail-img {
  /*---------- ワークスの詳細部分の画像 ----------*/
  width: clamp(8.0625rem, 5.336rem + 11.63vw, 13.1875rem);
}
.works__detail-text {
  /*---------- ワークスの詳細部分のテキスト ----------*/
  font-size: clamp(0.9375rem, 0.904rem + 0.14vw, 1rem);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .works__detail-text {
    line-height: 1.4375;
  }
}

/***********************************************************
reason
************************************************************/
.reason {
  /*---------- reasonブロック ----------*/
  background-color: #d0e7ff;
}
.reason__content {
  /*---------- コンテンツの最上下の余白 ----------*/
  padding: clamp(2.125rem, -0.069rem + 9.36vw, 6.25rem) 0 clamp(6.25rem, 8.6425rem - 0.22125vw, 7.8125rem);
}
@media screen and (min-width: 768px) {
  .reason .reason__title {
    /*---------- sectionタイトル ----------*/
    margin-bottom: 7.25rem;
  }
}

/***********************************************************
feature
************************************************************/
/*---------- performanceとsecurityの共通クラス ----------*/
/*---------- 2つのセクションの大枠 ----------*/
@media screen and (min-width: 768px) {
  .feature {
    position: relative;
  }
}
.feature:first-of-type {
  /*---------- 2つのセクションの余白 ----------*/
  margin-bottom: clamp(2.75rem, -2.935rem + 24.26vw, 13.4375rem);
}
.feature__number {
  /*---------- ボックス内のナンバリング ----------*/
  margin-bottom: 1.5rem;
  font-size: clamp(3.75rem, 1.755rem + 8.51vw, 7.5rem);
  color: #b1d3ff;
  line-height: 1;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .feature__number {
    position: absolute;
    top: -5.2rem;
    left: 0;
    z-index: 0;
  }
}
.feature__title {
  /*---------- ボックス内のタイトル ----------*/
  margin-bottom: clamp(1.25rem, 0.918rem + 1.42vw, 1.875rem);
  font-size: clamp(1.125rem, 0.726rem + 1.7vw, 1.875rem);
  font-weight: 900;
  line-height: 1.5;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .feature__title {
    position: relative;
    z-index: 1;
    font-weight: 700;
    line-height: 1;
    text-align: left;
  }
}
@media screen and (min-width: 768px) {
  .feature__title br {
    display: none;
  }
}
.feature__title-sub {
  /*---------- ボックス内のサブタイトル ----------*/
  margin-bottom: clamp(0.625rem, -0.372rem + 4.26vw, 2.5rem);
  font-size: clamp(0.9375rem, 0.838rem + 0.43vw, 1.125rem);
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .feature__title-sub {
    line-height: 1.5;
  }
}
.feature__about {
  /*---------- 開閉ボックスのスイッチ含む全体 ----------*/
  background-color: #ffffff;
}
.feature__content {
  /*---------- 開閉ボックスのスイッチ以外のコンテンツとその最大幅 ----------*/
  display: none;
  width: 100%;
  max-width: 54.0625rem;
  margin-inline: auto;
  padding: clamp(1.25rem, -0.412rem + 7.09vw, 4.375rem) 1rem clamp(1.5625rem, 0.066rem + 6.38vw, 4.375rem);
}
.feature__catch {
  /*---------- 開閉コンテンツ内のキャッチコピー ----------*/
  margin-bottom: clamp(1.125rem, 0.992rem + 0.57vw, 1.375rem);
  font-size: clamp(1.0625rem, 0.863rem + 0.85vw, 1.4375rem);
  font-weight: 700;
  line-height: 1.4705882353;
}
@media screen and (min-width: 768px) {
  .feature__catch {
    line-height: 1;
  }
}
.feature__detail {
  /*---------- 開閉コンテンツ内の詳細部 ----------*/
  font-size: clamp(0.9375rem, 0.838rem + 0.43vw, 1.125rem);
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .feature__detail {
    line-height: 1.5;
  }
}
.feature__items {
  /*---------- 詳細部の機能と画像のセットリスト ----------*/
  display: flex;
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
  padding: clamp(1.5rem, 0.569rem + 3.97vw, 3.25rem) 0 clamp(1.5rem, 0.702rem + 3.4vw, 3rem);
}
.feature__item {
  /*---------- 詳細部の機能と画像のセットアイテム ----------*/
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33.3333333333%;
}
.feature__icon {
  /*---------- 詳細部の機能と画像の画像 ----------*/
  font-size: clamp(2.5rem, 1.503rem + 4.26vw, 4.375rem);
  color: #1989ff;
}
.feature__point {
  /*---------- 詳細部の機能と画像のテキスト ----------*/
  margin-top: 1.125rem;
  font-size: clamp(0.8125rem, 0.746rem + 0.28vw, 0.9375rem);
  font-weight: 700;
  line-height: 1.5384615385;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .feature__point {
    line-height: 1.4;
  }
}
.feature__cards {
  /*---------- コンテンツ下部のカード型リスト ----------*/
  display: grid;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: clamp(0.9375rem, 0.771rem + 0.71vw, 1.25rem);
  -moz-column-gap: clamp(0.9375rem, 0.771rem + 0.71vw, 1.25rem);
       column-gap: clamp(0.9375rem, 0.771rem + 0.71vw, 1.25rem);
  grid-template-columns: repeat(auto-fit, 17.1875rem);
  max-width: 865px;
}
.feature__card {
  /*---------- コンテンツ下部のカード型アイテム ----------*/
  position: relative;
  padding: clamp(2.1875rem, 1.855rem + 1.42vw, 2.8125rem) 1.5rem 1.75rem;
  border: solid 0.0625rem #1989ff;
}
@media screen and (min-width: 768px) {
  .feature__card {
    height: 17.1875rem;
  }
}
.feature__card-title {
  /*---------- カードのタイトル ----------*/
  margin-bottom: clamp(1.25rem, 0.918rem + 1.42vw, 1.875rem);
  font-size: clamp(1.0625rem, 1.029rem + 0.14vw, 1.125rem);
  font-weight: 700;
  line-height: 1.4705882353;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .feature__card-title {
    line-height: 1.5;
  }
}
.feature__card-description {
  /*---------- カード内説明文 ----------*/
  font-size: clamp(0.875rem, 0.809rem + 0.28vw, 1rem);
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .feature__card-description {
    line-height: 1.4375;
  }
}
.feature__card-number {
  /*---------- カード内ナンバーの箱 ----------*/
  position: absolute;
  top: 0;
  left: 0;
  width: 5.25rem;
  height: 5.25rem;
  background: linear-gradient(to bottom right, #1989ff 50%, transparent 50%);
}
.feature__card-number {
  /*---------- カードのナンバー ----------*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: inline-block;
  padding-top: 0.5rem;
  padding-left: 1rem;
  font-size: 1.875rem;
  font-weight: 500;
  color: #ffffff;
  line-height: 1;
}
.feature__card-number::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: inline-block;
  width: 5.25rem;
  height: 5.25rem;
  background: linear-gradient(to bottom right, #1989ff 50%, transparent 50%);
}

/***********************************************************
section-voice
************************************************************/
.voice {
  /*---------- セクション-ボイス ----------*/
  background-color: #f2f2f2;
}
@media screen and (min-width: 900px) {
  .voice__container {
    /*---------- ボイスセクション-左右の余白 ----------*/
    padding-inline: 0;
  }
}
.voice__content {
  /*---------- ボイス-左右の余白 ----------*/
  padding: clamp(2.1875rem, 0.027rem + 9.22vw, 6.25rem) 0;
}
@media screen and (min-width: 900px) {
  .voice__content {
    max-width: none;
  }
}
.voice__catch {
  /*---------- ボイス-キャッチコピー ----------*/
  margin-bottom: clamp(0rem, -0.665rem + 2.84vw, 1.25rem);
  font-size: clamp(1.125rem, 0.793rem + 1.42vw, 1.75rem);
  font-family: 700;
  color: #0f6fcc;
  line-height: 1;
  text-align: center;
}
@media screen and (min-width: 900px) {
  .voice__catch {
    font-weight: 900;
  }
}
.voice__title {
  /*---------- ボイス-タイトル ----------*/
  margin-bottom: clamp(1.875rem, 1.543rem + 1.42vw, 2.5rem);
  line-height: 1.5;
}
@media screen and (min-width: 900px) {
  .voice__title {
    line-height: 1;
  }
}
@media screen and (min-width: 900px) {
  .voice__title br {
    display: none;
  }
}
.voice__sub-title {
  /*---------- ボイス-サブタイトル ----------*/
  max-width: 54.0625rem;
  margin-inline: auto;
  margin-bottom: clamp(1.6875rem, 1.255rem + 1.84vw, 2.5rem);
  font-size: clamp(1.125rem, 0.859rem + 1.13vw, 1.625rem);
  font-weight: 700;
  line-height: 1;
}
.voice__cards {
  /*---------- ボイス-カードリスト ----------*/
  overflow: hidden;
}
.voice__card {
  /*---------- ボイス-カードアイテム ----------*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: clamp(2.25rem, 0.654rem + 6.81vw, 5.25rem) clamp(1.6875rem, -1.537rem + 13.76vw, 7.75rem) clamp(3.125rem, 1.995rem + 4.82vw, 5.25rem);
  background-color: #ffffff;
  margin-bottom: clamp(2.1875rem, 2.021rem + 0.71vw, 2.5rem);
}
@media screen and (min-width: 900px) {
  .voice__card {
    flex-direction: row;
  }
}
.voice__card:last-of-type {
  margin-bottom: 0;
}
.voice__img {
  /*---------- ボイス-画像 ----------*/
  width: clamp(7.4375rem, 7.039rem + 1.7vw, 8.1875rem);
  height: clamp(7.4375rem, 7.039rem + 1.7vw, 8.1875rem);
  margin-bottom: 2.625rem;
}
@media screen and (min-width: 900px) {
  .voice__img {
    margin-bottom: 0;
  }
}
.voice__box {
  /*---------- ボイス-テキストボックス ----------*/
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 900px) {
  .voice__box {
    align-items: flex-start;
  }
}
.voice__icon {
  /*---------- ボイス-テキストボックス内のアイコン ----------*/
  position: absolute;
  font-size: clamp(1.0625rem, 0.797rem + 1.13vw, 1.5625rem);
  color: #afd2fe;
}
.voice .fa-quote-left {
  top: -1rem;
  left: 0;
}
@media screen and (min-width: 900px) {
  .voice .fa-quote-left {
    top: -2rem;
    left: -1.25rem;
  }
}
.voice .fa-quote-right {
  right: 0;
  bottom: -1rem;
}
@media screen and (min-width: 900px) {
  .voice .fa-quote-right {
    right: -1.5rem;
    bottom: -1.5rem;
  }
}
.voice__headline {
  /*---------- ボイス-テキストボックス内の見出し ----------*/
  margin-bottom: clamp(1rem, -1.9858vw + 2.3404rem, 1.875rem);
  font-size: clamp(1.0625rem, 0.863rem + 0.85vw, 1.4375rem);
  font-weight: 700;
  line-height: 1;
}
.voice__effect {
  /*---------- ボイス-テキストボックス内のテキスト ----------*/
  font-size: clamp(0.9375rem, 0.904rem + 0.14vw, 1rem);
  font-weight: 500;
  line-height: 1.6666666667;
}
@media screen and (min-width: 900px) {
  .voice__effect {
    line-height: 1.4375;
  }
}
.voice__money {
  /*---------- ボイス-テキストボックス内の料金 ----------*/
  display: inline-block;
  margin-right: 1em;
}
.voice__card--odd {
  /*---------- ボイス-男性の声パート(ネスト) ----------*/
  opacity: 0;
  transform: translateX(-100%);
}
@media screen and (min-width: 900px) {
  .voice__card--odd {
    margin-right: 13.4699853587%;
  }
}
@media screen and (min-width: 900px) {
  .voice__card--odd .voice__img {
    margin-left: 5.75rem;
  }
}
@media screen and (min-width: 900px) {
  .voice__card--odd .voice__box {
    margin-left: 3.0625rem;
  }
}
.voice__card--even {
  /*---------- ボイス-女性の声パート（ネスト） ----------*/
  opacity: 0;
  transform: translateX(100%);
}
@media screen and (min-width: 900px) {
  .voice__card--even {
    flex-direction: row-reverse;
    margin-left: 13.4699853587%;
  }
}
@media screen and (min-width: 900px) {
  .voice__card--even .voice__img {
    margin-right: 5.75rem;
  }
}
@media screen and (min-width: 900px) {
  .voice__card--even .voice__box {
    margin-right: 3.0625rem;
  }
}
.voice .voice__fade--in {
  /*---------- ボイス-カードのスライドの動き ----------*/
  opacity: 1;
  transform: translateX(0);
  transition: all 0.8s ease-out;
}

/***********************************************************
section-step
************************************************************/
.step__content--common {
  /*---------- ３ステップの両サイト余白 ----------*/
  padding: clamp(2.5rem, 0.505rem + 8.51vw, 6.25rem) 0;
}
.step__title--common {
  /*---------- ３ステップのタイトル ----------*/
  margin-bottom: clamp(2.1875rem, 1.689rem + 2.13vw, 3.125rem);
}
@media screen and (min-width: 768px) {
  .step__title--common {
    line-height: 1;
  }
}
@media screen and (min-width: 768px) {
  .step__title--common br {
    display: none;
  }
}
.step__text {
  /*---------- ３ステップの内容 ----------*/
  margin-bottom: clamp(1.875rem, 0.545rem + 5.67vw, 4.375rem);
  font-size: clamp(0.9375rem, 0.838rem + 0.43vw, 1.125rem);
  font-weight: 500;
  line-height: 1.6666666667;
}
@media screen and (min-width: 768px) {
  .step__text {
    line-height: 1.5;
    text-align: center;
  }
}
.step__items {
  /*---------- ３ステップの導入リスト ----------*/
  margin-bottom: clamp(1.625rem, 0.362rem + 5.39vw, 4rem);
}
.step__item {
  /*---------- ３ステップの導入アイテム ----------*/
  display: flex;
  border: solid 0.125rem #1989ff;
  opacity: 0;
  transform: translateY(-20px);
}
.step__number {
  /*---------- ３ステップの導入順序番号 ----------*/
  display: flex;
  justify-content: center;
  align-items: center;
  width: 34.328358209%;
  padding: 1rem;
  background-color: #1989ff;
  font-size: clamp(1rem, 0.867rem + 0.57vw, 1.25rem);
  font-weight: 900;
  color: #ffffff;
  line-height: 1;
  clip-path: polygon(0 0, 100% 0, calc(100% - 17px) 100%, 0 100%);
}
.step__about {
  /*---------- 3ステップの詳細 ----------*/
  display: flex;
  width: 65.671641791%;
  padding: clamp(1.3125rem, 1.213rem + 0.43vw, 1.5rem) 0.75rem;
  font-size: clamp(0.9375rem, 0.904rem + 0.14vw, 1rem);
  font-weight: 700;
  line-height: 1.4666666667;
}
@media screen and (min-width: 768px) {
  .step__about {
    line-height: 1.4375;
  }
}
.step__item--01 {
  /*---------- ３ステップのひとつ目 ----------*/
  position: relative;
  margin-bottom: clamp(3.5rem, 3.367rem + 0.57vw, 3.75rem);
}
.step__item--01::after {
  content: "\f063";
  position: absolute;
  bottom: -2.875rem;
  left: 50%;
  font-size: 2rem;
  font-family: "font Awesome 5 Free";
  font-weight: 700;
  color: #1989ff;
  line-height: 1;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .step__item--01::after {
    bottom: -3.125rem;
  }
}
.step__item--02 {
  /*---------- 3ステップの２つ目 ----------*/
  position: relative;
  margin-bottom: 3.75rem;
}
.step__item--02::after {
  content: "\f063";
  position: absolute;
  bottom: -2.875rem;
  left: 50%;
  font-size: 2rem;
  font-family: "font Awesome 5 Free";
  font-weight: 700;
  color: #1989ff;
  line-height: 1;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .step__item--02::after {
    bottom: -3.125rem;
  }
}
.step__fade--in {
  /*---------- 3ステップのアニメーション ----------*/
  opacity: 1;
  transform: translateY(0);
  transition: all 0.8s ease-out;
}

/***********************************************************
service
************************************************************/
.service__catch {
  /*---------- サービス-キャッチコピー ----------*/
  margin-bottom: clamp(1.375rem, 0.976rem + 1.7vw, 2.125rem);
  font-size: clamp(1.063rem, 0.863rem + 0.85vw, 1.438rem);
  font-weight: 900;
  line-height: 1.4705882353;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .service__catch {
    line-height: 1.5217391304;
  }
}
.service__cards {
  /*---------- サービス内容が書かれたカードリスト ----------*/
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1.25rem;
  max-width: 67.5rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .service__cards {
    flex-direction: row;
  }
}
.service__card {
  /*---------- サービス内容が書かれたカード ----------*/
  max-width: 21.5625rem;
  padding: clamp(2rem, 1.867rem + 0.57vw, 2.25rem) clamp(2rem, 1.734rem + 1.13vw, 2.5rem) clamp(2rem, 1.468rem + 2.27vw, 3rem);
  background-color: #d0e7ff;
  border-radius: 10px;
}
@media screen and (min-width: 768px) {
  .service__card {
    min-height: 18.1875rem;
  }
}
.service__title {
  /*---------- サービスのタイトル ----------*/
  margin-bottom: clamp(1rem, 0.734rem + 1.13vw, 1.5rem);
  font-size: clamp(1.063rem, 1.029rem + 0.14vw, 1.125rem);
  font-weight: 700;
  line-height: 1.4705882353;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .service__title {
    line-height: 1.5555555556;
  }
}
.service__text {
  /*---------- サービス内容 ----------*/
  font-size: clamp(0.938rem, 0.904rem + 0.14vw, 1rem);
  font-weight: 500;
  line-height: 1.4666666667;
}
@media screen and (min-width: 768px) {
  .service__text {
    line-height: 1.4375;
  }
}
.service__text::before {
  content: "・";
  display: inline-block;
}
.service__text--top {
  /*---------- サービス内容の上下余白 ----------*/
  margin-bottom: 0.75rem;
}

/***********************************************************
section-FAQ
************************************************************/
.faq {
  background-color: #f2f2f2;
}
.faq__content {
  padding: clamp(3.75rem, 7.386rem - 18.18vw, 6.25rem) 0 5rem;
}
.faq__inner {
  background-color: #ffffff;
}
.faq__heading {
  /*---------- faqコンテンツの開閉ボタン ----------*/
  padding: clamp(1.375rem, 1.043rem + 1.42vw, 2rem) clamp(0.9375rem, -0.226rem + 4.96vw, 3.125rem);
  background-color: #ffffff;
  font-size: clamp(1rem, 0.767rem + 0.99vw, 1.4375rem);
  text-transform: uppercase;
  text-align: left;
}
.faq__body {
  padding: clamp(1.875rem, 1.376rem + 2.13vw, 2.8125rem) 0.625rem clamp(3.75rem, 3.584rem + 0.71vw, 4.0625rem);
}
.faq__group {
  display: flex;
  flex-direction: column;
  row-gap: clamp(1.875rem, 1.709rem + 0.71vw, 2.1875rem);
  max-width: 54.125rem;
  margin-inline: auto;
}
.faq__box {
  display: flex;
  flex-direction: column;
  row-gap: clamp(1.188rem, 1.154rem + 0.14vw, 1.25rem);
}
.faq__category {
  display: inline-block;
  font-size: clamp(1rem, 0.767rem + 0.99vw, 1.4375rem);
  font-weight: 700;
  line-height: 1;
}
.faq__item {
  background-color: #d0e7ff;
  border-radius: 10px;
}
.faq__questions {
  position: relative;
  padding: clamp(1.5rem, 1.301rem + 0.85vw, 1.875rem) clamp(2rem, 1.169rem + 3.55vw, 3.5625rem) clamp(1.5rem, 1.301rem + 0.85vw, 1.875rem) clamp(1.0625rem, -0.267rem + 5.67vw, 3.5625rem);
  font-size: clamp(1rem, 0.934rem + 0.28vw, 1.125rem);
  line-height: 1.4375;
  text-align: left;
  border: none;
}
@media screen and (min-width: 768px) {
  .faq__questions {
    line-height: 1.5;
  }
}
.faq__questions .bar {
  right: clamp(0.75rem, 0.152rem + 2.55vw, 1.875rem);
}
.faq__questions::before {
  content: "Q.";
}
.faq__answer {
  display: none;
  padding: 0 clamp(2rem, 1.169rem + 3.55vw, 3.5625rem) clamp(1.4375rem, 1.338rem + 0.43vw, 1.625rem) clamp(1.0625rem, -0.267rem + 5.67vw, 3.5625rem);
  font-size: clamp(0.938rem, 0.904rem + 0.14vw, 1rem);
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .faq__answer {
    line-height: 1.4375;
  }
}
.faq__answer::before {
  content: "A.";
}
.faq__answer-items {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  margin-top: 0.5rem;
}
.faq__answer-items .faq__answer-item {
  display: block;
}
.faq__answer-items .faq__answer-item::before {
  content: "・";
}
.faq__answer-item--02 {
  display: block;
}
.faq__answer-item--02::before {
  content: "◆";
}

/***********************************************************
    price
    ************************************************************/
.price {
  background-color: #ffffff;
}
.price::before {
  content: "";
  display: block;
  padding-top: clamp(2.125rem, 0.125rem + 10vw, 6.375rem);
  background-color: #f2f2f2;
}
.price__btn {
  margin-top: clamp(2.125rem, -0.136rem + 9.65vw, 6.375rem);
}
.price__container {
  padding: clamp(2rem, 0.57rem + 6.1vw, 4.6875rem) clamp(1.3125rem, 0.348rem + 4.11vw, 3.125rem) clamp(1.5625rem, -0.133rem + 7.23vw, 4.75rem) clamp(0.75rem, -0.513rem + 5.39vw, 3.125rem);
}
.price__item {
  display: flex;
  -moz-column-gap: clamp(1.875rem, -2.114rem + 17.02vw, 9.375rem);
       column-gap: clamp(1.875rem, -2.114rem + 17.02vw, 9.375rem);
}
.price__item:first-of-type {
  margin-bottom: 1rem;
}
.price__title {
  font-size: clamp(1.0625rem, 0.863rem + 0.85vw, 1.4375rem);
  font-weight: 700;
  word-break: keep-all;
  line-height: 1.4705882353;
}
@media screen and (min-width: 768px) {
  .price__title {
    line-height: 1.2173913043;
  }
}
.price__about {
  font-size: clamp(0.9375rem, 0.838rem + 0.43vw, 1.125rem);
  font-weight: 700;
  line-height: 1.6666666667;
}
@media screen and (min-width: 768px) {
  .price__about {
    line-height: 1.5555555556;
  }
}
.price__font--blue {
  font-size: clamp(1.0625rem, 0.863rem + 0.85vw, 1.4375rem);
  font-weight: 700;
  color: #1989ff;
  line-height: 1.4705882353;
}
@media screen and (min-width: 768px) {
  .price__font--blue {
    line-height: 1.2173913043;
  }
}

/***********************************************************
home-btn
************************************************************/
#to-top {
  position: fixed;
  right: 2rem;
  bottom: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(4rem, 3.468rem + 2.27vw, 5rem);
  height: clamp(4rem, 3.468rem + 2.27vw, 5rem);
  background-color: #ffffff;
  font-size: clamp(0.75rem, 0.617rem + 0.57vw, 1rem);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  border: solid 0.0625rem #1989ff;
  border-radius: 50%;
}

/***********************************************************
footer
************************************************************/
.footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: clamp(1.5625rem, 0.898rem + 2.84vw, 2.8125rem);
  padding: clamp(3.125rem, 1.463rem + 7.09vw, 6.25rem) 1rem clamp(3.25rem, 0.989rem + 9.65vw, 7.5rem);
}
.footer__logo {
  width: clamp(7.3125rem, 3.656rem + 15.6vw, 14.1875rem);
}
.footer__copyright {
  font-size: clamp(0.75rem, 0.684rem + 0.28vw, 0.875rem);
  font-weight: 500;
  line-height: 1;
}

/***********************************************************
コンタクトフォーム
************************************************************/
.contact {
  padding: clamp(3rem, 1.235rem + 7.53vw, 5rem) 1rem;
  background-image: linear-gradient(0deg, rgb(3, 132, 245) 0%, rgb(84, 167, 240) 100%);
  display: flex;
  align-items: center;
}
.contact .contact__wrapper {
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  padding: clamp(2.5rem, 1.397rem + 4.71vw, 3.75rem) clamp(1.25rem, 0.147rem + 4.71vw, 2.5rem);
  background: #fff;
  border-radius: 8px;
}
.contact .contact__wrapper .contact__form .contact__form-label {
  font-size: 20px;
  display: block;
  margin-bottom: 6px;
  font-weight: bold;
}
.contact .contact__wrapper .contact__form .contact__form-label::after {
  content: "必須";
  display: inline-block;
  padding: 2px 4px;
  font-size: 10px;
  line-height: 1;
  background-color: #005fcc;
  color: #ffffff;
  margin-left: 2px;
}
.contact .contact__wrapper .contact__form .contact__form-text,
.contact .contact__wrapper .contact__form .contact__form-textarea {
  width: 100%;
  margin-bottom: clamp(1rem, 0.118rem + 3.76vw, 2rem);
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.contact .contact__wrapper .contact__form .contact__btn {
  display: inline-block;
  padding: 10px 20px;
  background: #0078ff;
  font-size: 16px;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.contact .contact__wrapper .contact__form .contact__btn:hover {
  background: #005fcc;
}
.contact .contact__wrapper .contact__form-fieldset {
  margin-bottom: clamp(1rem, 0.118rem + 3.76vw, 2rem);
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .contact .contact__wrapper .contact__form-fieldset {
    flex-direction: row;
  }
}
.contact .contact__wrapper .contact__form-fieldset .contact__form-radio {
  padding-left: 1rem;
}/*# sourceMappingURL=style.css.map */