@charset "UTF-8";

/* ============================================
   お問い合わせページ（/contact/）
   main.css の body.home .contact 一式と top-append.css の
   .contact__document-cta / .cta__btn--dark を移植したもの。
   home専用のスクロール連動アニメ（.inview 前提で初期 opacity:0）は
   本ページに監視JSが無いため外し、静的表示にしている（最終見た目は同一）。
   上下の余白のみ独立ページ用に調整（TOPでは前セクションとの margin-top だった部分）。
============================================ */

.contact-page .contact {
  position: relative;
  z-index: 2;
}
@media (width >= 751px) {
  .contact-page .contact {
    padding-top: 12.5rem;
    padding-bottom: 9.375rem;
    margin-inline: auto;
    width: 75rem;
  }
}
@media (width <= 750px) {
  .contact-page .contact {
    padding-top: 26.6666666667vw;
    padding-bottom: 21.3333333333vw;
    margin-inline: 5.3333333333vw;
  }
}

@media (width >= 751px) {
  .contact-page .contact .section-title-group {
    margin-bottom: 9.375rem;
    position: relative;
  }
}
@media (width <= 750px) {
  .contact-page .contact .section-title-group {
    margin-bottom: 8.5333333333vw;
  }
}
.contact-page .contact .section-title-text {
  margin: 0;
}
@media (width >= 751px) {
  .contact-page .contact .section-title-text {
    position: absolute;
    top: calc(100% + 9.375rem);
    left: 4.75rem;
  }
}
@media (width <= 750px) {
  .contact-page .contact .section-title-text {
    margin-bottom: 3.2vw;
  }
  .contact-page .contact .section-title-text img {
    width: 56vw;
  }
}
.contact-page .contact .section-title {
  line-height: 1;
}
@media (width >= 751px) {
  .contact-page .contact .section-title {
    font-size: 7.5rem;
    text-align: center;
  }
}
@media (width <= 750px) {
  .contact-page .contact .section-title {
    font-size: 8.5333333333vw; /* TOPと同値 */
  }
}

/* 資料請求ボタン（top-append.css より移植。横幅・位置を .form に揃える） */
.contact-page .contact__document-cta {
  margin-bottom: 2rem;
  text-align: center;
}
@media (width >= 751px) {
  .contact-page .contact__document-cta {
    margin-left: 20.625rem;
    width: 49.5rem;
  }
}

/* ボタン基礎（main.css より移植） */
.contact-page .cta__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 220px;
  height: auto;
  font-size: 1.25rem;
  line-height: 1.2;
  background-color: #BE2020;
  padding: 10px 16px;
  border-radius: 10px;
}
.contact-page .cta__btn:hover {
  opacity: 0.8;
}
.contact-page .cta__btn span {
  font-size: 0.75rem;
}
.contact-page .cta__btn--dark {
  width: 100%;
  background-color: #171717;
  color: #fff;
}
.contact-page .cta__btn--dark:hover {
  opacity: 0.8;
}