/* cf7 郵便番号部分 */
.zip-row {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  gap: 0 !important;
}

/* CF7が生成する郵便番号入力欄のラッパー */
.zip-row .wpcf7-form-control-wrap {
  flex: 1 1 auto;
  min-width: 0;
  margin-right: 0 !important;
}

/* 郵便番号入力欄 */
.zip-row input {
  width: 100% !important;
  min-width: 0;
  height: 44px;
  padding: 0 22.3281px;
  margin-right: 0 !important;
  box-sizing: border-box;
}

/* 郵便番号から自動入力ボタン */
.zip-row .your-zip {
  flex: 0 0 auto;
  width: auto !important;
  min-width: max-content;
  height: 44px;
  white-space: nowrap;
  padding: 0 10px;
  margin-left: 0 !important;
  box-sizing: border-box;
  font-size: 14px;
  background-color: #0071BE !important;
}

/* 説明と入力フィールドの間 */
.zip-note {
  display: block;
  margin-bottom: 8px;
}

/* CF7 必須ラベルの背景色 */
.form-common__inner--label.label-required {
  background: #0071BE !important;
  color: #fff !important;
}


/* ==================================================
   会員登録フォーム
   郵便番号部分
   他フォームと見た目を揃える
   ================================================== */

#section-form-connect .zip-area-connect {
  display: block !important;
}

/* 説明文 */
#section-form-connect .zip-area-connect .zip-note {
  display: block !important;
  width: 100%;
  margin-bottom: 8px;
}

/* 入力欄＋自動入力ボタン */
#section-form-connect .zip-area-connect .zip-row {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  width: 100%;
  margin-bottom: 0;
}

/* CF7入力欄ラッパー */
#section-form-connect .zip-area-connect .zip-row .wpcf7-form-control-wrap {
  flex: 1 1 auto;
  min-width: 0;
  margin-right: 0 !important;
}

/* 郵便番号入力欄 */
#section-form-connect .zip-area-connect .zip-row input {
  width: 100% !important;
  min-width: 0;
  height: 44px !important;
  padding: 0 22.3281px !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}

/* 郵便番号から自動入力ボタン */
#section-form-connect .zip-area-connect .zip-row .your-zip {
  flex: 0 0 auto;
  width: auto !important;
  min-width: max-content;
  height: 44px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  box-sizing: border-box;
  white-space: nowrap;
  font-size: 14px;
  background-color: #0071BE !important;
}


/* 土地探し相談フォーム：必須ラベル */
#page-feature02 .form-common__inner--label.label-required {
  background: #0071BE !important;
  background-color: #0071BE !important;
  color: #fff !important;
}


/* ==================================================
   固定ボタン設定 0908-

   HTML上は4個
   TEL
   来店予約
   モデルハウス
   カタログ請求

   PC：1025px以上
   右端に縦3個

   タブレット・SP：1024px以下
   画面下に横3個
   ================================================== */

/* ボタン間の隙間設定 */
:root {
	--floating-btn-gap: 0px;
/*   --floating-btn-gap: 2px;　 */
  --floating-btn-gap-color: #333333;
}

/* 各ボタン共通 */
.headerContent-vertical-list-item a {
  background: #2d2d2d !important;
}

/* 来店予約だけ青 */
.headerContent-vertical-list-item.visit-btn a {
  background: #0071BE !important;
}


/* ==================================================
   PC
   1025px以上
   ================================================== */
@media screen and (min-width: 1025px) {

  /* TELは非表示 */
  .headerContent-vertical-list-item.tel-btn {
    display: none !important;
  }

  /* モデルハウスは表示 */
  .headerContent-vertical-list-item.modelhouse-btn {
    display: block !important;
    visibility: visible !important;
  }

  /* ボタンを縦並び */
  .headerContent-vertical-list {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }

  /* ボタン群の背後を透明 */
  .headerContent-vertical {
    background: transparent !important;
  }

  /* 並び順 */
  .headerContent-vertical-list-item.visit-btn {
    order: 1;
  }

  .headerContent-vertical-list-item.modelhouse-btn {
    order: 2;
  }

  .headerContent-vertical-list-item.request-btn {
    order: 3;
  }

  /* 通常ボタンのホバー */
  .headerContent-vertical-list-item a:hover {
    background: #fff !important;
    color: #2d2d2d !important;
  }

  /* 来店予約のホバー */
.headerContent-vertical-list-item.visit-btn a:hover {
  background: #fff !important;
  color: #2d2d2d !important;
}
}


/* ==================================================
   タブレット・SP
   1024px以下
   ================================================== */
@media screen and (max-width: 1024px) {

  /* モデルハウスは非表示 */
  .headerContent-vertical
  .headerContent-vertical-list
  li.headerContent-vertical-list-item.modelhouse-btn {
    display: none !important;
    visibility: hidden !important;
  }

  /* TELは表示 */
  .headerContent-vertical-list-item.tel-btn {
    display: block !important;
    visibility: visible !important;
  }

  /* 画面下に配置 */
  .headerContent-vertical {
    width: 100% !important;
    top: auto !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    transform: none !important;
    height: auto !important;
    background: transparent !important;
  }

  /* 3ボタン横並び */
  .headerContent-vertical-list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    gap: var(--floating-btn-gap) !important;
    background: var(--floating-btn-gap-color) !important;
  }

  /* 並び順 */
  .headerContent-vertical-list-item.tel-btn {
    order: 1;
  }

  .headerContent-vertical-list-item.visit-btn {
    order: 2;
  }

  .headerContent-vertical-list-item.request-btn {
    order: 3;
  }

  /* 3ボタンを均等幅 */
  .headerContent-vertical-list-item {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
  }

  /* ボタンの高さ・余白 */
  .headerContent-vertical-list-item a {
    width: 100% !important;
    min-height: 70px !important;
    padding: 8px 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box;
  }
}