.inner {
	max-width: 133rem;
	width: 86%;
	margin: 0 auto;
}
.flex-wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#contact-intro {
  padding: 15rem 0; /* 上下左右の余白 */
}

#contact-intro .inner {
  max-width: 120rem; /* 最大幅 */
}

#contact-intro .inner .intro-box {
  font-size: 2rem; /* フォントサイズ */
  line-height: 1.75; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
  text-align: center; /* 中央寄せ */
  margin-bottom: 3em; /* 下マージン */
}

#contact-intro .inner .free-box {
  padding: 5%; /* 内側の余白 */
  background-color: #f2f2f2; /* 背景色 */
  justify-content: center; /* 中央揃え（水平方向） */
  align-items: center; /* 中央揃え（垂直方向） */
  gap: 6rem; /* アイテム間の余白 */
  margin-bottom: 8rem; /* 下マージン */
}

#contact-intro .inner .free-box .logo-box {
  max-width: 31.6rem; /* 最大幅 */
  width: 90%; /* 幅 */
}

#contact-intro .inner .free-box .txt-box > h4 {
  font-size: 4rem; /* フォントサイズ */
  line-height: 1.5; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
  font-weight: 600; /* フォントの太さ */
  padding-bottom: 0.5em; /* 下パディング */
  margin-bottom: 0.5em; /* 下マージン */
  color: #136ca3; /* 文字色 */
  border-bottom: 3px solid #eaa732; /* 下線 */
}

#contact-intro .inner .free-box .txt-box > p {
  font-size: 3rem; /* フォントサイズ */
  line-height: 1.5; /* 行の高さ */
  letter-spacing: 0.13em; /* 文字間隔 */
}

#contact-intro .inner .tel-box {
  text-align: center; /* 中央寄せ */
}

#contact-intro .inner .tel-box .copy {
  font-size: 2.8rem; /* フォントサイズ */
  line-height: 1.6; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
}

#contact-intro .inner .tel-box a {
  font-size: 11rem; /* フォントサイズ */
  line-height: 1; /* 行の高さ */
  letter-spacing: 0.02em; /* 文字間隔 */
  justify-content: center; /* 中央揃え（水平方向） */
  align-items: center; /* 中央揃え（垂直方向） */
  padding: 0.1em 0; /* 上下パディング */
  gap: 0.1em; /* アイテム間の余白 */
}

#contact-intro .inner .tel-box a .img-box {
  width: 1.26em; /* 幅 */
}

#contact-intro .inner .tel-box a span.en {
  color: #00a73c; /* 文字色 */
}

#contact-intro .inner .tel-box .notice {
  font-size: 2.2rem; /* フォントサイズ */
  line-height: 1.75; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
}

@media (max-width: 1024px) {
  #contact-intro .inner .free-box .txt-box > h4 {
    font-size: 3rem; /* フォントサイズを調整 */
  }

  #contact-intro .inner .free-box .txt-box > p {
    font-size: 1.8rem; /* フォントサイズを調整 */
  }
}

@media (max-width: 1024px) and (max-width: 840px) {
  #contact-intro .inner .tel-box a {
    font-size: 9rem; /* フォントサイズを調整 */
  }
}

@media (max-width: 1024px) and (max-width: 840px) and (max-width: 520px) {
  #contact-intro {
    padding: 8rem 0; /* パディングを調整 */
  }

  #contact-intro .inner .intro-box {
    font-size: 1.4rem; /* フォントサイズを調整 */
  }

  #contact-intro .inner .free-box {
    padding: 15% 5%; /* 内側の余白を調整 */
    gap: 2rem; /* アイテム間の余白を調整 */
  }

  #contact-intro .inner .free-box .txt-box {
    width: 90%; /* 幅を調整 */
  }

  #contact-intro .inner .free-box .txt-box > h4 {
    font-size: 2.2rem; /* フォントサイズを調整 */
    text-align: center; /* 中央寄せ */
  }

  #contact-intro .inner .free-box .txt-box > p {
    font-size: 1.4rem; /* フォントサイズを調整 */
    text-align: center; /* 中央寄せ */
  }

  #contact-intro .inner .tel-box .copy {
    font-size: 1.8rem; /* フォントサイズを調整 */
  }

  #contact-intro .inner .tel-box a {
    font-size: 4.4rem;
  }

  #contact-intro .inner .tel-box .notice {
    font-size: 1.6rem; /* フォントサイズを調整 */
  }
}

#thanks-area {
  padding: 8rem 0; /* 上下左右の余白 */
}

#thanks-area .inner {
  text-align: center; /* 中央寄せ */
}

#thanks-area .inner > h3 {
  font-size: 2.4rem; /* フォントサイズ */
  margin-bottom: 2em; /* 下マージン */
  color: #136ca3; /* 文字色 */
}

#thanks-area .inner > p {
  font-size: 1.6rem; /* フォントサイズ */
}

#thanks-area .inner > p a {
  color: #136ca3; /* 文字色 */
}

@media (max-width: 520px) {
  #thanks-area {
    padding: 6rem 0; /* パディングを調整 */
  }

  #thanks-area .inner > h3 {
    font-size: 1.8rem; /* フォントサイズを調整 */
  }

  #thanks-area .inner > p {
    font-size: 1.4rem; /* フォントサイズを調整 */
  }
}

#contact-area {
  padding: 15rem 0; /* 上下左右の余白 */
  background-color: #f1f1f1; /* 背景色 */
}

#contact-area .inner {
  max-width: 92rem; /* 最大幅 */
}

#contact-area .inner .form-ttl {
  font-size: 5rem; /* フォントサイズ */
  line-height: 1; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
  padding-bottom: 1.5em; /* 下パディング */
  margin-bottom: 3em; /* 下マージン */
  text-align: center; /* 中央寄せ */
  position: relative; /* 相対位置 */
}

#contact-area .inner .form-ttl:after {
  content: ""; /* 擬似要素の内容 */
  display: block; /* ブロック要素として表示 */
  width: 2em; /* 幅 */
  height: 0.4rem; /* 高さ */
  border-radius: 0.2rem; /* 角丸 */
  background-color: #000; /* 背景色 */
  position: absolute; /* 絶対位置 */
  inset: auto 0 0 0; /* 位置指定（下0、左右中央） */
  margin: 0 auto; /* 中央揃え */
}

#contact-area .inner form {
  width: 100%; /* 幅 */
}

#contact-area .inner form dl {
  width: 100%; /* 幅 */
  margin-bottom: 4%; /* 下マージン */
  font-size: 2rem; /* フォントサイズ */
  line-height: 1.75; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
}

#contact-area .inner form dl dt {
  width: 100%; /* 幅 */
  position: relative; /* 相対位置 */
  margin-bottom: 0.6em; /* 下マージン */
}

#contact-area .inner form dl dt > p {
  display: inline-block; /* インラインブロック要素として表示 */
}

#contact-area .inner form dl dt.hissu:after {
  content: "必須"; /* 擬似要素の内容 */
  display: inline-block; /* インラインブロック要素として表示 */
  font-size: 80%; /* フォントサイズ */
  width: fit-content; /* 幅をコンテンツに合わせる */
  color: #fff; /* 文字色 */
  border-radius: 0.3em; /* 角丸 */
  background-color: #d5003f; /* 背景色 */
  padding: 0.1em 1em; /* 内側の余白 */
  margin-left: 0.7em; /* 左マージン */
}

#contact-area .inner form dl dd {
  width: 100%; /* 幅 */
}

#contact-area .inner form dl dd input[type="text"],
#contact-area .inner form dl dd textarea {
  width: 100%; /* 幅 */
  background-color: #fff; /* 背景色 */
  padding: 1em 0.4em; /* 内側の余白 */
}

#contact-area .inner form dl dd .kakuninarea {
  width: 100%; /* 幅 */
  background-color: #fff; /* 背景色 */
  font-size: 81.8%; /* フォントサイズ */
  text-align: center; /* 中央寄せ */
  padding: 1em 0.4em; /* 内側の余白 */
}

#contact-area .inner form dl dd .kakuninarea a {
  color: #136ca3; /* 文字色 */
  border-bottom: 1px solid #136ca3; /* 下線 */
}

#contact-area .inner form .contact-btn {
  font-size: 2.2rem; /* フォントサイズ */
  line-height: 1.75; /* 行の高さ */
  letter-spacing: 0.1em; /* 文字間隔 */
}

#contact-area .inner form .contact-btn input {
  display: block; /* ブロック要素として表示 */
  width: 100%; /* 幅 */
  max-width: 27.3rem; /* 最大幅 */
  background: #eaa732; /* 背景色 */
  color: #fff; /* 文字色 */
  margin: 0 auto; /* 中央揃え */
  text-align: center; /* 中央寄せ */
  padding: 0.5em 1em; /* 内側の余白 */
  transition: 0.3s; /* トランジション */
}

#contact-area .inner form .contact-btn input:hover {
  background-color: #136ca3; /* ホバー時の背景色 */
}

@media (max-width: 520px) {
  #contact-area {
    padding: 8rem 0; /* パディングを調整 */
  }

  #contact-area .inner .form-ttl {
    font-size: 4rem; /* フォントサイズを調整 */
    padding-bottom: 1em; /* 下パディングを調整 */
    margin-bottom: 1.5em; /* 下マージンを調整 */
  }

  #contact-area .inner form dl {
    font-size: 1.6rem; /* フォントサイズを調整 */
    margin-bottom: 10%; /* 下マージンを調整 */
  }
}