/* 共通 */
/* JFB 必須マークを「必須」バッジに変更 */
.jfb-required,
.jet-form-builder__required {
  font-size: 0;
}

.jfb-required::after,
.jet-form-builder__required::after {
  content: "必須";
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: var(--c-red-primary);
  padding: 1px 8px 2px;
  border-radius: 2px;
  margin-left: .2rem;
}

.p-form__privacy {
 line-height: 1.5;
 font-size: .88rem;
}

.p-contact .p-form__privacy {
 padding-block: clamp(0, 0.97rem + 2.27vw, 2.5rem) clamp(0, -1.324rem + 5.67vw, 2.5rem);
}

.privacy-link a {
 text-decoration: underline;
 transition: .3s;
}

.privacy-link a:hover,
.privacy-link a:focus-visible {
 opacity: .5;
}

@media (width >=48rem) {
 .privacy-link {
  text-align: center;
 }

 .p-contact .p-form__privacy .wp-block-group__inner-container {
  padding-block-start: 2.5rem;
 }
}

.prev-textLink {
 background: none;
}

.field-type-checkbox-field .jet-form-builder__field-label.for-checkbox>span::before {
 background-color: var(--c-white);
}

.jet-form-builder__action-button-wrapper {
 display: flex;
 align-items: center;
 justify-content: center;
}

.p-contact__button {
min-width: 12rem;
display: flex;
align-items: center;
justify-content: center;
 padding: .4rem 1.5rem;
 border-radius: 2rem;
 background-color: var(--c-red-primary);
 font-weight: var(--font-weight-bold);
 color: var(--c-white);
}

.jet-form-builder__next-page-wrap {
 margin-block-start: 2rem;
 width: fit-content;
 position: relative;
 margin-inline: auto;
 button {
  padding: .5rem 1rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  transition: var(--duration-normal);
  &:hover,
  &:focus-visible {
   opacity: .7;
  }
 }
}

@media (width >=48rem) {
 .p-contact__form>div {
  display: grid;
  gap: .5rem;
 }
}

.jet-form-builder__label-text {
 font-weight: var(--font-weight-bold);
 letter-spacing: var(--tracking-normal);
 line-height: 1.5;
}

.p-contact__form {
 margin-block-start: 2rem;
}


@media (width >=48rem) {
 .p-contact__form .jet-form-builder-row {
  margin-block-end: 1rem;
  align-items: center;
  flex-wrap: inherit;
  flex-direction: row;
 }
}

@media (width <48rem) {
 .jet-form-builder__label {
  color: #4A5568;
  margin-block-end: .5rem;
 }

 .jet-form-builder__field-wrap {
  margin-block-end: 1.5rem;
 }
}

.p-form__item {
 margin-block: .5rem 1.2rem;
}

.layout-column .jet-form-builder__field,
.p-form__itemMessage {
 padding: .8rem 1.5rem;
 border: solid 1px #ddd;
 border-radius: 5px;
 align-items: center;

}

.layout-column .jet-form-builder__field {
 height: clamp(3.8rem, 3.268rem + 0.57vw, 4rem) !important;
}

/********* request（郵便番号） /*********/
#zip {
 max-width: 15rem !important;
}

/* 確認ページ */
.confirmation-container {
 font-weight: var(--font-weight-bold);
 font-size: 1.125rem;
 margin-block-start: clamp(2.5rem, 1.97rem + 2.27vw, 3.5rem);
 background-color: var(--c-white);
 border-radius: calc(10 * var(--torem));
 padding: clamp(2.5rem, 2.235rem + 1.13vw, 3rem) clamp(1.5rem, 0.705rem + 3.4vw, 3rem);

 .wp-block-group__inner-container {
  display: grid;
  gap: clamp(1rem, 0.47rem + 2.27vw, 2rem);
 }

 em {
  font-size: 1rem;
 }
}


@media (width >=48rem) {
 .confirmation-title {
  margin-inline-end: 1rem;
  max-width: 14rem;
  flex: 0 0 14rem;
  width: 100%;
  display: inline-block;
 }

 .confirmation-container p {
  display: flex;
  align-items: flex-start;
 }

 .confirmation-container span {
  display: block;
 }
}

@media (width <48rem) {
 .confirmation-title {
  display: block;
  color: #B6B6B6;
  font-weight: var(--font-weight-medium);
 }

 .confirmation-container p {
  display: grid;
  gap: .5rem;
 }
}

button.jet-form-builder__submit{
 justify-content: center!important;
}

/* プラポリチェック202604追加 */
.privacy-container {
 margin-block: 1rem;
}

.privacy-container {
 font-size: .95rem;
 position: relative;
 display: flex;
 justify-content: center;
}

.field-type-radio-field .jet-form-builder__field-label.for-radio :checked+span::before,
.field-type-checkbox-field .jet-form-builder__field-label.for-checkbox :checked+span::before {
 border-color: var(--c-red-primary);
 background-color: var(--c-red-primary);
}


/********* privacy /*********/
.privacy-title {
 text-align: center;
 font-size: 1.4rem;
}

.privacy-section {
 margin-top: 1.2rem;
}

.privacy-title {
 font-size: 1rem;
 font-weight: 700;
 margin: 0 0 12px;
}

.privacy-box {
 max-height: 12.5rem;
 border-radius: .5rem;
 overflow-y: auto;
 padding: 24px;
 border: 1px solid #C4C4C4;
 background: #fff;
 font-size: 0.9rem;
 line-height: 1.8;
}

/* スクロールバー（WebKit系のみ） */
.privacy-box::-webkit-scrollbar {
 width: 10px;
}

.privacy-box::-webkit-scrollbar-track {
 background: #f3f3f3;
 border-radius: 10px;
}

.privacy-box::-webkit-scrollbar-thumb {
 background: #c9c9c9;
 border-radius: 10px;
}

/* 先頭リード */
.privacy-box>p:first-child {
 margin-top: 0;
}

/* セクション間の余白 */
.privacy-box section {
 padding-top: 14px;
 margin-top: 14px;
 border-top: 1px solid #eee;
}

.privacy-box section:first-of-type {
 border-top: 0;
 margin-top: 0;
 padding-top: 0;
}

/* 見出し（h3/h4） */
.privacy-box h3 {
 margin: 0 0 8px;
 font-size: 1rem;
 font-weight: 700;
 line-height: var(--line-height-100);
 padding-left: .5rem;
 border-left: 3px solid var(--c-red-primary, #b71c1c);
}

.privacy-box h4 {
 margin: 12px 0 6px;
 font-size: 0.9rem;
 font-weight: 700;
 border-bottom: 1px solid #C32026;
}

/* 段落 */
.privacy-box p {
 margin: 0 0 1.5rem;
 font-size: 0.85rem;
}

.privacy-box p:last-child {
 margin-bottom: 0;
}

/* リスト */
.privacy-box ul {
 margin: 6px 0 12px;
 padding-left: 1.2em;
}

.privacy-box li {
 margin: 4px 0;
 position: relative;
 padding-left: 1.2rem;

 &:before {
  content: "・";
  position: absolute;
  left: 0;
 }
}

/* 住所 */
.privacy-box address {
 font-style: normal;
 margin-top: 6px;
 padding: 12px 14px;
 background: #fafafa;
 border: 1px solid #eee;
 border-radius: 8px;
}

/* リンク */
.privacy-box a {
 color: var(--c-red-primary, #b71c1c);
 text-decoration: underline;
}

.privacy-box a:hover {
 text-decoration: none;
}

/* フォーカス時（キーボード操作しやすく） */
.privacy-box:focus {
 outline: 2px solid var(--c-red-primary, #b71c1c);
 outline-offset: 3px;
}
/* 入力エラーのときに背景をピンクにする */
input:invalid,
textarea:invalid,
select:invalid,
.form-item-select:has(option[value=""]:checked) {
 background-color: #fff0f3;
}


.field-type-radio-field .jet-form-builder__field-label.for-radio :checked+span::before,
.field-type-checkbox-field .jet-form-builder__field-label.for-checkbox :checked+span::before {
 border-color: var(--c-red-primary);
 background-color: var(--c-red-primary);
}