/* ===== お問い合わせフォーム：確実に隙間が空く・完成版 =====
   前提：CF7タグに class:cf-wide / class:cf-wide-btn を付与
   例)
   [text* your-name class:cf-wide]
   [email* your-email class:cf-wide]
   [textarea your-message class:cf-wide]
   [submit class:cf-wide-btn "送信"]
============================================================== */

/* フォーム全体：中央寄せ＆最大幅 */
.contact-area .wpcf7{
  width:100%;
  max-width:800px;
  margin:40px auto 0;         /* 見出しとの間も確保 */
  padding:0 18px;             /* 端の余白（スマホ向け） */
  box-sizing:border-box;
}

/* 見出し下の余白（Elementor見出しにも効く） */
.contact-area h1,
.contact-area h2,
.contact-area h3{
  margin-bottom:40px;
}

/* 各フィールドを囲む <p> の間隔（行間） */
.contact-area .wpcf7 form p{
  margin:0 0 28px;            /* 項目同士の縦間隔を広めに */
}

/* ラベル（項目名）：“中に入力が入る”前提で縦並び＋gapで確実に隙間 */
.contact-area .wpcf7 form label{
  color:#fff;
  font-weight:700;
  display:flex;               /* ← ここがポイント */
  flex-direction:column;      /* テキスト→入力を縦に */
  row-gap:14px;               /* テキストと入力の間隔（調整はここ） */
  line-height:1.4;
}

/* 念のため：従来構造の wrap にも直接マージンを付与（保険） */
.contact-area .wpcf7 form label > .wpcf7-form-control-wrap{
  margin-top:0;               /* row-gap が効くので 0 でOK（テーマ干渉対策） */
  width:100%;
  display:block;
}

/* 入力の見た目（cf-wide 前提） */
.wpcf7 .cf-wide{
  display:block;
  width:100%;
  box-sizing:border-box;
  background:#111;
  color:#fff;
  border:2px solid #888;      /* 太めの罫線 */
  border-radius:4px;
  padding:12px;
  font-size:1rem;
  line-height:1.6;
}

/* 単一行入力の高さ */
.wpcf7 .cf-wide[type="text"],
.wpcf7 .cf-wide[type="email"]{
  height:46px;
}

/* テキストエリア */
.wpcf7 .cf-wide textarea{
  min-height:340px;
  resize:vertical;
}

/* 送信ボタン（小さめ・中央寄せ・青） */
.wpcf7 .cf-wide-btn{
  display:block;
  width:40%;                  /* PC時は控えめ幅 */
  margin:28px auto 0;         /* 上余白＋中央 */
  background:#007BFF;
  color:#fff;
  border:none;
  padding:12px 16px;
  border-radius:4px;
  cursor:pointer;
  font-size:1rem;
  text-align:center;
}
.wpcf7 .cf-wide-btn:hover{ background:#0056b3; }

/* レスポンシブ（スマホではボタン全幅） */
@media (max-width: 768px){
  .wpcf7 .cf-wide-btn{ width:100%; }
}



