/* エラー表示 */
.st-field-error {
  color: #c82333;
  font-size: .875rem;
  margin-top: .25rem;
  margin-bottom: 0;
  display: none;
  font-weight: bold;
}

/* ステップ表示 */
.formProcedure {
  background-color: #f6f6f6;
  border: 1px solid #000;
  display: flex;
  height: 75px;
  padding: 0;
}

.formProcedure li {
  align-items: center;
  color: #222;
  display: flex;
  flex-grow: 1;
  font-size: .75rem;
  justify-content: center;
  position: relative;
  text-align: center;
  margin: 0;
  padding: 0 .5rem;
}

.formProcedure li::before,
.formProcedure li::after {
  border-left: 10px solid #000;
  border-bottom: 10px solid transparent;
  border-top: 10px solid transparent;
  content: "";
  display: block;
  left: 100%;
  position: absolute;
}

.formProcedure li::after {
  border-left-color: #f6f6f6;
  margin-left: -1px;
}

.formProcedure li:last-child::before,
.formProcedure li:last-child::after {
  content: "";
  display: none;
}

.formProcedure li.current {
  background-color: #f29600;
  color: #222;
  font-weight: bold;
  border: solid 3px #000;
}

.formProcedure li.current::after {
  border-left-color: #000000;
  margin-left: 0;
}

@media (min-width: 768px) {
  .formProcedure li {
    font-size: 1rem;
  }

  .formProcedure li::before,
  .formProcedure li::after,
  .formProcedure li.current::after {
    border-width: 18px;
  }
}

/* 問い合わせ内容の選択 */
.inquiry-type-select-wrap {
  margin-bottom: 2rem;
}

@media (min-width: 768px) {
  .inquiry-type-select-wrap select {
    width: auto;
  }
}

/* フォーム基本 */
.st-form {
  padding: 1rem;
  background: #f6f6f6;
  border-top: 1px solid #cfd1cf;
}

.st-form-parts.form-control,
.st-form-parts.custom-select {
  background-color: #fff;
}

.inquiry-type-select-wrap .form-control,
.st-form .form-control {
  border-color: #767676;
}

.st-form fieldset {
  border-color: #767676 !important;
}

.st-form-group {
  border-bottom: 1px solid #cfd1cf;
  padding-bottom: 1rem;
}

.st-form-group-bg {
  padding: 1rem;
  background-color: #fff;
  box-sizing: border-box;
  border-radius: .25rem;
}

.st-form-group .form-check-label {
  cursor: pointer;
}

.st-txtDeco {
  text-decoration: underline;
}

/* チェックボックス・ラジオボタン */
.st-form .form-check-input,
.st-form-check-privacy .form-check-input {
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0;
}

.st-form .st-form-check-bg {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: 1rem 1.25rem;
  background-color: #fff;
  margin-bottom: 1rem;
  border-radius: .25rem;
  width: 100%;
}

.st-form .st-form-check:not(.st-form-check-bg) {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding-left: 0;
  padding-right: 1.5rem;
  margin-bottom: .5rem;
  vertical-align: top;
}

.st-form .st-form-check-bg .form-check-input,
.st-form .st-form-check:not(.st-form-check-bg) .form-check-input {
  position: static;
  margin: 0;
  flex-shrink: 0;
}

.st-form .st-form-check-bg .form-check-label,
.st-form .st-form-check:not(.st-form-check-bg) .form-check-label {
  margin: 0;
}

/* 個人情報同意 */
.st-form-check-privacy {
  width: 100%;
  display: flex;
  align-items: center;
}

.st-form-group-privacy {
  border: solid 3px #f29600;
  padding: 1.5rem;
  margin-top: 2rem;
  border-radius: .25rem;
  background-color: #fff;
}

.st-form-check-privacy > .form-check-label {
  width: 100%;
  box-sizing: border-box;
  min-height: 100%;
  padding: 1rem 1rem 1rem 2.5rem;
}

/* 必須バッジ */
.st-badge {
  color: #fff;
  background-color: #dc3545;
  margin: .1rem 0 0 .5rem;
  padding: .25em .4em;
  vertical-align: top;
}

/* エラーサマリー */
.formAlert {
  margin-top: .3rem;
  margin-left: .8rem;
  color: #c82333;
  font-weight: bold;
  margin-bottom: 0;
}

.formAlert > a,
.formAlert > a:link,
.formAlert > a:visited,
.formAlert > a:active,
.formAlert > a:hover {
  color: #c82333;
  font-weight: bold;
  text-decoration: underline !important;
}

/* ボタン */
.st-form-button {
  display: flex;
  justify-content: center;
}

.st-form-btn {
  width: 100%;
  padding: 1.5rem;
  font-size: 1rem;
  color: #222 !important;
}

.st-form-btn-reset {
  background-color: #e9eaeb;
  margin: 1rem 1rem 0 0;
  border: #222 solid 1px;
}

.st-form-btn-reset:hover {
  background-color: #ddd;
}

.st-form-btn-next {
  background-color: #f29600;
  margin: 1rem 0 0 0;
}

.st-form-btn-next:hover {
  background-color: #e48d00 !important;
}

.st-form-btn-next.is-disabled,
.st-form-btn-next.is-disabled:hover,
.st-form-btn-next:disabled,
.st-form-btn-next:disabled:hover {
  background-color: #e9eaeb !important;
  opacity: 1 !important;
  border: #222 solid 1px;
  cursor: default;
}

.st-inquiry-form a:focus-visible,
.st-inquiry-form button:focus-visible,
.st-inquiry-form input:focus-visible,
.st-inquiry-form select:focus-visible,
.st-inquiry-form textarea:focus-visible,
.st-inquiry-form [tabindex]:focus-visible {
  outline: 3px solid #005fcc;
  outline-offset: 3px;
}

/* 確認画面 */
.confirm-table {
  width: 100%;
  border-collapse: collapse;
}

.confirm-table,
.confirm-table tbody,
.confirm-table tr,
.confirm-table th,
.confirm-table td {
  display: block;
  width: 100%;
}

.confirm-table tr {
  padding: .75rem 0;
}

.confirm-table th,
.confirm-table td {
  padding: 1rem;
  vertical-align: top;
  text-align: left;
}

@media (min-width: 576px) {
  .st-form-btn {
    font-size: 1.2rem;
  }
}

@media (min-width: 768px) {
  .confirm-table {
    display: table;
  }

  .confirm-table tbody {
    display: table-row-group;
  }

  .confirm-table tr {
    display: table-row;
    width: auto;
    padding: 0;
  }

  .confirm-table th,
  .confirm-table td {
    display: table-cell;
    padding: 1rem;
  }

  .confirm-table th {
    width: 30%;
  }

  .confirm-table td {
    width: 70%;
  }

  .st-form-btn {
    width: 10rem;
    font-size: 1.5rem;
  }
}

@media (min-width: 992px) {
  .st-form-btn {
    width: 15rem;
  }
}