/* /wp/ 資料ダウンロード — カード直下に開く申込パネル

   CF7のフォーム定義には .form-row / .form-label / .form-field / .required-badge という
   クラスが元から入っていたが、CSSが一切当たっていなかったため縦積みで出ていた。
   ここでスタイルを与える。フォーム定義そのものは変更していない。
   影響範囲を /wp/ のパネル内に限るため、すべて .wp-dl-panel 配下で閉じている。 */

.wp-dl-panel{position:relative;border:1px solid #e2e5ea;border-left:4px solid #9d001c;
  border-radius:10px;background:#fff;padding:26px 26px 22px;margin:14px 0 30px;
  box-shadow:0 6px 24px rgba(16,32,135,.10)}

/* 中身はパネルの中央に寄せる */
.wp-dl-panel .custom-form-container{max-width:560px;margin:0 auto;font-family:inherit}
.wp-dl-note{max-width:560px;margin:0 auto 20px;text-align:center;
  font-size:13px;color:#666e7a;line-height:1.85;padding:0 44px}

.wp-dl-close{position:absolute;top:14px;right:16px;width:34px;height:34px;
  border:1px solid #e2e5ea;background:#fff;border-radius:50%;cursor:pointer;
  font-size:17px;line-height:1;color:#666e7a;padding:0}
.wp-dl-close:hover{background:#f4f6fb;color:#102087}

/* ラベルを左、入力欄を右に並べる */
.wp-dl-panel .form-row{display:grid;grid-template-columns:10.5em 1fr;gap:14px;
  align-items:center;margin:0 0 12px}
.wp-dl-panel .form-label p,
.wp-dl-panel .form-field p{margin:0}
.wp-dl-panel .form-label label{font-size:14px;font-weight:600;color:#333;line-height:1.5}
.wp-dl-panel .form-field .wpcf7-form-control-wrap{display:block}
.wp-dl-panel .form-field input{width:100%;box-sizing:border-box}

/* [必須] は赤・小さめ */
.wp-dl-panel .required-badge{color:#9d001c;font-size:11px;font-weight:700;
  white-space:nowrap;margin-left:3px;letter-spacing:.02em}

/* 送信ボタンは LeadGL の青 */
.wp-dl-panel .ark-block-button{margin-top:22px !important}
.wp-dl-panel input[type="submit"].wpcf7-submit{
  --arkb-btn-color--bg:#102087;
  background:#102087;border:1px solid #102087;color:#fff;
  padding:13px 34px;border-radius:6px;font-weight:700;font-size:15px;cursor:pointer}
.wp-dl-panel input[type="submit"].wpcf7-submit:hover{background:#0b1660;border-color:#0b1660}

/* 検証メッセージが出たときに窮屈にならないように */
.wp-dl-panel .wpcf7-not-valid-tip{font-size:12px;margin-top:4px}
/* 送信結果のメッセージもパネルの中央に出す */
.wp-dl-panel .wpcf7-response-output{margin:18px auto 6px;max-width:560px;font-size:13.5px;
  text-align:center;line-height:1.8;padding:12px 16px;border-radius:6px}
/* 各項目のエラーは、その入力欄に沿って左寄せのまま */
.wp-dl-panel .form-field .wpcf7-not-valid-tip{text-align:left}

@media(max-width:640px){
  .wp-dl-panel{padding:48px 16px 16px}
  .wp-dl-close{top:10px;right:10px;width:30px;height:30px;font-size:15px}
  .wp-dl-note{padding:0}
  .wp-dl-panel .form-row{grid-template-columns:1fr;gap:6px;margin-bottom:14px}
  .wp-dl-panel .form-label label{font-size:13.5px}
}
