@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&family=Noto+Serif+JP:wght@400;500&family=Cinzel:wght@400&family=Roboto:wght@400;500&display=swap");
@import url("lib/ress.min.css");
:root {
  /* neutral */
  --white: #ffffff;
  --black: #000000;
  --black-rgb: 0, 0, 0;
  --gray: #5a5a5a; /* ナビオーバーレイ VOICE セクション背景 */
  --gray-dark: #363636; /* FEATURE / STEP UP FLOW セクション背景 */
  --gray-light: #e5e5e5; /* 地図エリア背景 */
  /* accent */
  --red: #eb1818; /* Google MAP ボタン */
  /* font */
  /* main sans-serif Japanese (Noto Sans JP) */
  --font-1: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif;
  /* serif Japanese (Noto Serif JP) — 見出し・電話番号・本文 */
  --font-2: "Noto Serif JP", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "ヒラギノ明朝 ProN", serif;
  /* decorative Latin (Cinzel) — セクション英字見出し・コピーライト */
  --font-3: "Cinzel", serif;
  /* Latin sans-serif (Roboto) */
  --font-4: "Roboto", sans-serif;
  /* transition */
  --hover-transition: .2s ease;
}

.p-page {
  margin-bottom: 13.2rem;
  margin-top: 4rem;
  padding: 8.5rem 7.6rem;
}
@media screen and (max-width: 767px) {
  .p-page {
    border-radius: unset;
    padding: 3.7rem 2.4rem 7.5rem;
    margin: 0 calc(50vw - 50%);
    width: 100dvw;
  }
}
.p-page .desc {
  letter-spacing: 0.128rem;
  line-height: 175%;
  margin: 0 0 7.8rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-page .desc {
    margin: 0 0 3.8rem;
  }
}

.p-confirm .message {
  line-height: 180%;
  padding: 2rem 0 0;
}
@media screen and (max-width: 767px) {
  .p-confirm .message {
    padding: 1rem 0 0;
  }
}

.p-complete {
  padding-bottom: 15rem;
  padding-top: 9rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-complete {
    padding-bottom: 9rem;
    padding-top: 4.5rem;
  }
}
.p-complete .desc {
  letter-spacing: 0.128rem;
  margin: 0 0 11.5rem;
}
@media screen and (max-width: 767px) {
  .p-complete .desc {
    margin: 0 0 4.3rem;
  }
}

.field {
  border-bottom: 1px solid #D1CFCF;
  font-family: var(--font-1);
  display: grid;
  grid-template-columns: 21.5rem auto;
  column-gap: 3rem;
  padding: 1.9rem 0;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .field {
    border: none;
    display: flex;
    flex-direction: column;
    padding: 1.9rem 0 0;
  }
}
.field-label {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 0 0 0 0.3rem;
}
@media screen and (max-width: 767px) {
  .field-label {
    gap: 1.4rem;
    justify-content: start;
  }
}
.field-label .required {
  align-items: center;
  background: #AC2B20;
  color: white;
  display: flex;
  font-size: 1.4rem;
  height: 2.4rem;
  justify-content: center;
  line-height: 1;
  width: 4rem;
}
.field-label .note {
  display: block;
  font-size: 1.4rem;
  letter-spacing: 0.112rem;
  line-height: 142.857%;
  padding: 0.5rem 0 0;
}
@media screen and (max-width: 767px) {
  .field-label .note {
    padding-left: 1.5rem;
    text-indent: -1.5rem;
  }
}
.field-body {
  font-size: 1.4rem;
  padding: 1.2rem 0 1.2rem 2rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .field-body {
    font-size: 1.6rem;
    padding: 1rem 0 1rem 0;
  }
}
.p-confirm .field-body {
  font-size: 1.2rem;
  padding: 3.2rem 0 3.2rem 2.35rem;
}
@media screen and (max-width: 767px) {
  .p-confirm .field-body {
    font-size: 1.6rem;
    padding: 1rem 0 1rem 2.2rem;
  }
}
.field-body:before {
  background: #D1CFCF;
  content: " ";
  display: inline-block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 1px;
}
@media screen and (max-width: 767px) {
  .field-body:before {
    display: none;
  }
}
.field-body input[type=text],
.field-body input[type=email],
.field-body input[type=tel],
.field-body textarea {
  background: #F8F8F8;
  border-radius: 0.4rem;
  font-size: 1.2rem;
  height: 5.8rem;
  padding: 0 2rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .field-body input[type=text],
  .field-body input[type=email],
  .field-body input[type=tel],
  .field-body textarea {
    font-size: 1.5rem;
  }
}
.field-body input[type=text]::placeholder,
.field-body input[type=email]::placeholder,
.field-body input[type=tel]::placeholder,
.field-body textarea::placeholder {
  color: rgba(0, 0, 0, 0.3);
}
.field-body textarea {
  height: 26.1rem;
  padding: 1.5rem 2rem;
}
@media screen and (max-width: 767px) {
  .field-body textarea {
    height: 34.1rem;
  }
}
.field-body .radios {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  padding: 1rem 0 3.5rem 1rem;
}
@media screen and (max-width: 767px) {
  .field-body .radios {
    padding: 1.2rem 0 2rem 0rem;
  }
}
.field-body .radios label {
  cursor: pointer;
  display: flex;
  font-size: 1.4rem;
  gap: 0.8rem;
  letter-spacing: 0.112rem;
}
.field-body .radios label input[type=radio] {
  opacity: 0;
  position: absolute;
}
.field-body .radios label input[type=radio] + span {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5V18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18V16.5C13.1421 16.5 16.5 13.1421 16.5 9Z" fill="%23B2B2B2"/></svg>') no-repeat 0 50%/1.8rem auto;
  padding: 0 0 0 2.5rem;
}
.field-body .radios label input[type=radio]:checked + span {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5ZM9 4C11.7614 4 14 6.23858 14 9C14 11.7614 11.7614 14 9 14C6.23858 14 4 11.7614 4 9C4 6.23858 6.23858 4 9 4Z" fill="%23868686"/></svg>') no-repeat 0 50%/1.8rem auto;
}
.field-body .error {
  bottom: -1rem;
  color: var(--red);
  display: none;
  font-size: 1.2rem;
  position: absolute;
  left: 2rem;
}
@media screen and (max-width: 767px) {
  .field-body .error {
    left: 0;
  }
}
.field-body .error.is-visible {
  display: block;
}

.buttons {
  display: flex;
  justify-content: center;
  gap: 2rem;
  padding: 8.4rem 0 0;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .buttons {
    align-items: center;
    flex-direction: column;
    padding: 4.7rem 0 0;
  }
}

/*# sourceMappingURL=contact.css.map */
