/* ===========================
   [mochibun-form] ショートコード専用CSS
   元ネタ: /akiya/satei/css/style.css の該当クラスを抽出・スコープ化
=========================== */
.mochibun-form {
  --color-bg-form:   #d3e6e4;
}

.mochibun-form .u-br-10 { border-radius: 10px !important; }
.mochibun-form .u-fs-14 { font-size: 1.4rem !important; }
.mochibun-form .u-mt-5 { margin-top: 5px !important; }
.mochibun-form .u-mb-20 { margin-bottom: 20px !important; }
.mochibun-form .u-sp-mb-10 { margin-bottom: 10px !important; }

@media (max-width: 767px) {
  .mochibun-form .hidden-sm-down { display: none !important; }
}
@media (min-width: 768px) {
  .mochibun-form .hidden-md-up { display: none !important; }
}

/* ===========================
   査定フォーム本体
=========================== */
.mochibun-form .p-autofill-formbox {
  position: relative;
  background-color: #FFF;
  border-radius: 10px;
}
.mochibun-form .p-autofill-formbox > p img {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner {
  padding: 40px;
  position: relative;
  z-index: 1;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form {
  background: none;
  max-width: inherit;
  margin: 0;
  padding: 0;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form input[type="text"],
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form select {
  width: 100% !important;
  max-width: 100% !important;
  font-size: 2rem;
  padding: 15px;
  box-sizing: border-box;
  background-color: rgba(6,58,120,0.12);
  border: 2px solid #063A78;
  border-radius: 5px;
  -webkit-appearance: none;
  appearance: none;
  color: inherit;
  font-family: inherit;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form select {
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23063A78' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px 8px;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form #submit {
  width: 100%;
  color: #FFF;
  font-size: 3rem;
  font-weight: bold;
  padding: 15px 10px;
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  appearance: none;
  background-color: #329F98;
  box-shadow: 0 5px 0 0 #1a514e;
  border-radius: 5px;
  transition: background-color .5s;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form #submit:hover {
  background-color: #39b6ae;
}
.mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form .is-autofill-transparent {
  opacity: .4;
}
@media screen and (max-width: 767px) {
  .mochibun-form .p-autofill-formbox .p-autofill-formbox-innner { padding: 20px; }
  .mochibun-form .p-autofill-formbox .p-autofill-formbox-innner .address-txt { font-size: 1.2rem !important; }
  .mochibun-form .p-autofill-formbox .p-autofill-formbox-innner form #submit { font-size: 2rem; }
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
  .mochibun-form .p-autofill-formbox-innner .col-md-2,
  .mochibun-form .p-autofill-formbox-innner .col-md-3,
  .mochibun-form .p-autofill-formbox-innner .col-md-7 {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 10px;
  }
}
