/* 申込フォーム・完了画面（車ローン） */

.contact{
  background:#f3f4f6;
  padding:0 0 2rem;
  min-height:100vh;
}

.contact__head{
  text-align:center;
  padding:1rem 1rem .2rem;
}

.contact__ribbon{
  display:inline-block;
  margin:0 auto .85rem;
  background:var(--navy);
  color:#fff;
  font-size:.72rem;
  font-weight:800;
  padding:.28em 1.2em;
  border-radius:999px;
}

.contact__title{
  font-size:1.35rem;
  font-weight:900;
  letter-spacing:.02em;
  margin-bottom:.25rem;
}

.contact__sub{
  font-size:.72rem;
  font-weight:700;
  color:#555;
  margin-bottom:.9rem;
}

.contact__card{
  background:#fff;
  margin:0 .7rem 1rem;
  padding:1.2rem 1rem 1.4rem;
  border:1px solid #e5e7eb;
  border-radius:.5rem;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
}

.contact-form__section{margin-bottom:1.35rem}
.contact-form__heading{
  font-size:.92rem;
  font-weight:900;
  border-left:3px solid var(--blue);
  padding-left:.5rem;
  margin-bottom:.75rem;
}

.field{margin-bottom:.75rem}
.field label{
  display:block;
  font-size:.72rem;
  font-weight:800;
  margin-bottom:.28rem;
}
.field .req{color:#e60012;margin-left:.1em}
.field input{
  width:100%;
  font-size:.85rem;
  padding:.55rem .65rem;
  border:1px solid #d1d5db;
  border-radius:.35rem;
  outline:none;
  background:#fff;
  font-family:inherit;
  color:var(--ink);
}
.field input:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(0,72,199,.12);
}
.field input::placeholder{color:#aaa}

.contact-form__agree{margin:.4rem 0 1rem}
.agree{
  display:flex;
  align-items:flex-start;
  gap:.45rem;
  font-size:.68rem;
  font-weight:700;
  line-height:1.5;
  cursor:pointer;
}
.agree input{
  margin-top:.15rem;
  flex:none;
  width:1rem;
  height:1rem;
}
.contact-form__disclaimer{
  font-size:.58rem;
  color:#777;
  line-height:1.45;
  margin-top:.45rem;
}
.field-error{
  font-size:.62rem;
  color:#e60012;
  margin-top:.3rem;
}

.contact-form__submit{text-align:center}
.contact-submit{
  display:flex;
  width:100%;
  margin:0;
  padding:.78rem 2.4rem .78rem 3.4rem;
  border:none;
  box-shadow:0 2px 0 rgba(150,60,0,.18), 0 3px 8px rgba(0,0,0,.08);
  outline:none;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  font-family:inherit;
}
.contact-form__after{
  font-size:.58rem;
  color:#777;
  margin-top:.45rem;
  line-height:1.4;
}

.contact__back{
  text-align:center;
  font-size:.72rem;
  font-weight:700;
}
.contact__back a{color:#555;text-decoration:underline}

.thankyou[hidden],
.contact[hidden]{display:none !important}
.thankyou{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:2rem 1.5rem;
  background:#fff;
}
.thankyou p{
  font-size:.92rem;
  font-weight:700;
  line-height:1.9;
  color:#444;
  margin-bottom:1.5rem;
}
.thankyou__back{
  display:inline-block;
  font-size:.78rem;
  font-weight:800;
  color:#fff;
  background:var(--navy);
  padding:.55rem 1.4rem;
  border-radius:.3rem;
}