.pon-present-page {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 12px 42px;
  color: #5a3a1c;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "メイリオ", Meiryo, sans-serif;
  line-height: 1.8;
}

.pon-present-page * {
  box-sizing: border-box;
}

.pon-present-page img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

.pon-hero {
  text-align: center;
  padding: 18px 10px 24px;
}

.pon-logo {
  margin-bottom: 12px;
}

.pon-logo img {
  max-width: 280px;
}

.pon-title {
  margin: 0 0 18px;
  font-size: 42px;
  line-height: 1.25;
  font-weight: bold;
  color: #5a3a1c;
  letter-spacing: 0.04em;
}

.pon-lead {
  margin: 0 0 16px;
  color: #5a3a1c;
  font-size: 18px;
  font-weight: bold;
}

.pon-badge-wrap {
  margin-top: 12px;
}

.pon-badge {
  display: inline-block;
  margin: 6px;
  padding: 8px 18px;
  background: #fff2c9;
  border: 1px solid #ead49a;
  border-radius: 999px;
  color: #5a3a1c;
  font-size: 15px;
  font-weight: bold;
}

.pon-fun-message {
  display: inline-block;
  margin: 18px 0 0;
  padding: 10px 22px;
  background: #fff7e6;
  border-radius: 999px;
  color: #5a3a1c;
  font-size: 20px;
  font-weight: bold;
}

.pon-main-image {
  max-width: 760px;
  margin: 0 auto 28px;
  text-align: center;
}

.pon-main-image img {
  width: 100%;
  height: auto;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.pon-card {
  background: #fffdf7;
  border: 1px solid #eadfcb;
  border-radius: 24px;
  box-shadow: 0 8px 24px rgba(90, 58, 28, 0.08);
  padding: 28px;
  margin: 0 auto 26px;
}

.pon-info-box {
  max-width: 760px;
}

.pon-info-box h2,
.pon-form-title {
  margin: 0 0 18px;
  color: #5a3a1c;
  font-size: 34px;
  line-height: 1.3;
  text-align: center;
}

.pon-info-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pon-info-list li {
  margin-bottom: 10px;
  padding: 12px 16px;
  background: #fffaf0;
  border: 1px solid #efe3ce;
  border-radius: 14px;
  color: #5a3a1c;
  line-height: 1.6;
}
.pon-info-list strong {
  display: inline;
  margin-right: 6px;
  color: #5a3a1c;
  font-size: 18px;
}

.pon-sub-note {
  margin-top: 14px;
  padding: 14px 16px;
  background: #fdf6e8;
  border-radius: 14px;
  color: #5a3a1c;
  font-size: 15px;
  text-align: center;
}

.pon-form-card {
  max-width: 760px;
}

.pon-form-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}

.pon-form-table th,
.pon-form-table td {
  vertical-align: middle;
}

.pon-form-table th {
  width: 220px;
  padding: 14px 16px;
  background: #fff3d8;
  border: 1px solid #efe1bd;
  border-right: none;
  border-radius: 14px 0 0 14px;
  text-align: left;
  color: #5a3a1c;
  font-size: 15px;
  font-weight: bold;
}

.pon-form-table td {
  padding: 14px 16px;
  background: #ffffff;
  border: 1px solid #efe1bd;
  border-radius: 0 14px 14px 0;
  color: #5a3a1c;
}

.pon-form-table input[type="text"],
.pon-form-table textarea {
  width: 100%;
  max-width: 460px;
  padding: 10px 12px;
  border: 1px solid #d9cfbf;
  border-radius: 8px;
  background: #ffffff;
  color: #5a3a1c;
  font-size: 16px;
  line-height: 1.5;
}

.pon-form-table textarea {
  min-height: 150px;
  resize: vertical;
}

.pon-form-table input[type="text"]:focus,
.pon-form-table textarea:focus {
  outline: none;
  border-color: #c9b18a;
}

.pon-form-table label {
  display: inline-block;
  margin-right: 18px;
  color: #5a3a1c;
}

.pon-required {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  background: #8b5a2b;
  color: #ffffff;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.4;
}

.pon-small {
  display: block;
  margin-top: 6px;
  color: #7a5a36;
  font-size: 13px;
}

.pon-submit-wrap {
  margin-top: 22px;
  text-align: center;
}

.pon-submit-note {
  margin: 0 0 14px;
  color: #5a3a1c;
  font-size: 15px;
}

.pon-submit-btn {
  display: inline-block;
  min-width: 320px;
  padding: 16px 24px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(180deg, #f3a53a 0%, #e58e20 100%);
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 5px 0 #c77716;
}

.pon-submit-btn:hover {
  opacity: 0.95;
}

@media screen and (max-width: 767px) {
  .pon-present-page {
    padding: 14px 8px 30px;
  }

  .pon-hero {
    padding: 12px 4px 18px;
  }

  .pon-title {
    font-size: 28px;
  }

  .pon-lead {
    font-size: 16px;
  }

  .pon-badge {
    display: block;
    margin: 8px auto;
    max-width: 320px;
  }

  .pon-fun-message {
    font-size: 17px;
    border-radius: 18px;
  }

  .pon-main-image {
    margin-bottom: 22px;
  }

  .pon-card {
    padding: 18px 14px;
    border-radius: 18px;
    margin-bottom: 20px;
  }

  .pon-info-box h2,
  .pon-form-title {
    font-size: 28px;
  }

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

  .pon-form-table th {
    border-right: 1px solid #efe1bd;
    border-radius: 14px 14px 0 0;
    margin-bottom: 0;
  }

  .pon-form-table td {
    border-top: none;
    border-radius: 0 0 14px 14px;
    margin-bottom: 8px;
  }

  .pon-form-table input[type="text"],
  .pon-form-table textarea {
    max-width: 100%;
  }

  .pon-form-table label {
    display: block;
    margin: 0 0 8px;
  }

  .pon-submit-btn {
    width: 100%;
    min-width: 0;
    padding: 15px 14px;
    font-size: 16px;
  }
}

/* フォーム下の空白を詰める */
.pon-form-card {
  padding-bottom: 26px;
}

.pon-form-table {
  margin-bottom: 12px !important;
}

.pon-form-table tr:last-child th,
.pon-form-table tr:last-child td {
  margin-bottom: 0;
}

.pon-form-card form {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.pon-submit-wrap {
  margin-top: 8px !important;
  padding-top: 0 !important;
}

.pon-submit-note {
  margin: 0 0 14px !important;
}

.pon-form-card form > p:empty,
.pon-form-card form > br {
  display: none !important;
}

/* メルマガ：ラジオボタン右に「購読する」を配置 */
.pon-form-table td label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 18px 0 0;
  line-height: 1.5;
}

.pon-form-table td label input[type="radio"] {
  margin: 0;
}

/* フォーム下の空白を削除 */
.pon-form-table {
  margin-bottom: 0 !important;
  border-spacing: 0 10px;
}

.pon-form-card form {
  margin: 0 !important;
  padding: 0 !important;
}

.pon-submit-wrap {
  margin-top: 14px !important;
  padding-top: 0 !important;
}

.pon-submit-note {
  margin: 0 0 14px !important;
  line-height: 1.7;
}

.pon-form-table textarea {
  min-height: 120px;
}

/* =========================================================
   WordPressテーマCSS対策：フォーム下の空白・ラジオずれ修正
========================================================= */

/* テーマ側 .post_content p の影響をこのページ内だけ止める */
.pon-present-page p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.7 !important;
}

/* フォーム下の余白を確実に詰める */
.pon-present-page .pon-form-table {
  margin: 0 !important;
  padding: 0 !important;
}

.pon-present-page .pon-form-card form {
  margin: 0 !important;
  padding: 0 !important;
}

.pon-present-page .pon-submit-wrap {
  margin: 12px 0 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

.pon-present-page .pon-submit-note {
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
  line-height: 1.7 !important;
  color: #5a3a1c !important;
}

/* WordPressが自動で入れたbrや空p対策 */
.pon-present-page form > br,
.pon-present-page form > p:empty,
.pon-present-page .pon-form-card > br,
.pon-present-page .pon-form-card > p:empty {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ラジオボタンと文字を横並びで中央揃え */
.pon-present-page .pon-form-table td label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 20px 0 0 !important;
  padding: 0 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

.pon-present-page .pon-form-table input[type="radio"] {
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  vertical-align: middle !important;
}

/* メルマガの説明文をラジオの下に自然に配置 */
.pon-present-page .pon-small {
  display: block !important;
  margin-top: 6px !important;
  line-height: 1.5 !important;
}