@charset "UTF-8";
/* =========================================
   Cigna Contact Page — cigna-contact.css
   medicaldich.com/cigna-contact/
   cigna.css を読み込んだ後に追加読み込みすること
   ========================================= */

/* ===== PAGE HERO ===== */
.cigna-contact-page .cc-hero {
  background: var(--cn-navy-dark);
  padding: 56px 0 52px;
  text-align: center;
  color: var(--cn-white);
}
.cigna-contact-page .cc-hero-eyebrow {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #fff;           /* 白色指定 */
  margin-bottom: 12px;
}
.cigna-contact-page .cc-hero-title {
  font-size: clamp(26px, 4vw, 38px);
  font-weight: 800;
  color: var(--cn-white);
  margin: 0 0 20px;
  line-height: 1.3;
}
.cigna-contact-page .cc-hero-lead {
  font-size: 14px;
  color: rgba(255,255,255,.85);
  line-height: 1.9;
  margin: 0;
}
.cigna-contact-page .cc-hero-lead strong {
  color: var(--cn-white);
  font-weight: 700;
}

/* ===== FORM SECTION ===== */
.cigna-contact-page .cc-form-section {
  background: var(--cn-gray-bg);
  padding: 64px 0 80px;
}

/* ===== FORM BODY（シングルカラム・中央寄せ） ===== */
.cigna-contact-page .cc-form-body {
  background: #fff;
  border-radius: var(--cn-r-lg);
  padding: 48px 56px;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
  max-width: 680px;
  margin: 0 auto;
}

/* ===== フォームフィールド ===== */
.cigna-contact-page .cc-field {
  margin-bottom: 28px;
}
.cigna-contact-page .cc-field:last-of-type {
  margin-bottom: 0;
}

/* ラベル */
.cigna-contact-page .cc-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--cn-text);
  margin-bottom: 8px;
}
.cigna-contact-page .cc-required {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: #c53030;
  padding: 1px 6px;
  border-radius: 3px;
  line-height: 1.5;
}
.cigna-contact-page .cc-optional {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: var(--cn-gray-mid);
  background: var(--cn-gray-light);
  padding: 1px 6px;
  border-radius: 3px;
  line-height: 1.5;
}

/* ===== style.css の .wpcf7 競合を完全リセット ===== */
/* style.css が .wpcf7 { width:85%; margin:40px auto !important } を持つため上書き */
.cigna-contact-page .wpcf7 {
  width: 100% !important;
  margin: 0 !important;
}
/* style.css が .wpcf7 p { margin: 0 0 40px } を持つため上書き */
.cigna-contact-page .wpcf7 p {
  margin: 0 !important;
}

/* テキスト入力・セレクト共通 */
/* style.css: height:60px / max-width:92% / background:#fcfbf4 を上書き */
.cigna-contact-page .wpcf7-form input[type="text"],
.cigna-contact-page .wpcf7-form input[type="email"],
.cigna-contact-page .wpcf7-form input[type="tel"],
.cigna-contact-page .wpcf7-form input[type="number"],
.cigna-contact-page .wpcf7-form textarea {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  padding: 11px 14px !important;
  border: 1.5px solid var(--cn-gray-light) !important;
  border-radius: var(--cn-r) !important;
  font-size: 14px !important;
  color: var(--cn-text) !important;
  background: #fff !important;
  background-color: #fff !important;
  transition: border-color .2s, box-shadow .2s;
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box !important;
  font-family: inherit;
  line-height: 1.6 !important;
  float: none !important;
  vertical-align: top;
}
.cigna-contact-page .wpcf7-form input[type="text"]:focus,
.cigna-contact-page .wpcf7-form input[type="email"]:focus,
.cigna-contact-page .wpcf7-form input[type="tel"]:focus,
.cigna-contact-page .wpcf7-form input[type="number"]:focus,
.cigna-contact-page .wpcf7-form textarea:focus {
  outline: none !important;
  border-color: var(--cn-navy) !important;
  box-shadow: 0 0 0 3px rgba(0,51,255,.1) !important;
  background-color: #fff !important;
}

/* プレースホルダー */
.cigna-contact-page .wpcf7-form input::placeholder,
.cigna-contact-page .wpcf7-form textarea::placeholder {
  color: var(--cn-gray-mid);
  font-size: 13px;
}

/* ===== セレクトボックス（下矢印） ===== */
/*
 * CF7の実際の出力構造:
 *   div.cc-select-wrap
 *     span.wpcf7-form-control-wrap  ← CF7が自動挿入
 *       select
 *
 * style.css の .wpcf7 select に float:left / max-width:92% が設定されているため、
 * cc-select-wrap の高さが崩壊し ::after 矢印が外に飛び出す。
 * 以下で float・max-width・width を明示的にリセットする。
 */
.cigna-contact-page .cc-select-wrap {
  position: relative;
  display: block;
  overflow: hidden; /* float解除のフォールバック */
}
/* CF7が挿入する span を block・幅100%に */
.cigna-contact-page .cc-select-wrap .wpcf7-form-control-wrap {
  display: block !important;
  width: 100% !important;
}
/* style.css の .wpcf7 select を完全上書き */
.cigna-contact-page .wpcf7-form select {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 11px 36px 11px 14px !important; /* 右側に矢印スペース確保 */
  height: auto !important;
  border: 1.5px solid var(--cn-gray-light) !important;
  border-radius: var(--cn-r) !important;
  font-size: 14px !important;
  color: var(--cn-text) !important;
  background-color: #fff !important;
  cursor: pointer;
  box-sizing: border-box;
  font-family: inherit;
  line-height: 1.6;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color .2s, box-shadow .2s;
}
.cigna-contact-page .wpcf7-form select:focus {
  outline: none;
  border-color: var(--cn-navy) !important;
  box-shadow: 0 0 0 3px rgba(0,51,255,.1);
}
/* 矢印は cc-select-wrap::after で描画 */
.cigna-contact-page .cc-select-wrap::after {
  content: '';
  position: absolute !important;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #555;
  pointer-events: none;
  z-index: 1;
}

/* テキストエリア */
.cigna-contact-page .wpcf7-form textarea {
  resize: vertical;
  min-height: 120px;
}

/* ===== バリデーションエラー ===== */
.cigna-contact-page .wpcf7-not-valid-tip {
  display: block;
  font-size: 12px;
  color: #c53030;
  margin-top: 4px;
}
.cigna-contact-page .wpcf7-form input.wpcf7-not-valid,
.cigna-contact-page .wpcf7-form select.wpcf7-not-valid,
.cigna-contact-page .wpcf7-form textarea.wpcf7-not-valid {
  border-color: #c53030;
  box-shadow: 0 0 0 3px rgba(197,48,48,.1);
}

/* ===== 送信レスポンス ===== */
.cigna-contact-page .wpcf7-response-output {
  margin: 16px 0 0;
  padding: 12px 16px;
  border-radius: var(--cn-r);
  font-size: 13px;
  border: none !important;
}
.cigna-contact-page .wpcf7-mail-sent-ok {
  background: #f0fff4;
  color: #276749;
  border-left: 4px solid var(--cn-green) !important;
}
.cigna-contact-page .wpcf7-mail-sent-ng,
.cigna-contact-page .wpcf7-aborted {
  background: #fff5f5;
  color: #c53030;
  border-left: 4px solid #c53030 !important;
}
.cigna-contact-page .wpcf7-spam-blocked {
  background: #fffaf0;
  color: #7b341e;
  border-left: 4px solid #dd6b20 !important;
}

/* ===== 送信ボタン ===== */
/* style.css: .wpcf7-submit { width:330px; background:#ee7632; margin:50px auto } を上書き */
.cigna-contact-page .wpcf7-form input[type="submit"],
.cigna-contact-page .wpcf7-submit {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 15px 28px !important;
  background: var(--cn-green) !important;
  background-color: var(--cn-green) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: var(--cn-r) !important;
  cursor: pointer;
  letter-spacing: .04em;
  transition: background .2s, transform .1s;
  margin: 32px 0 0 !important;
  font-family: inherit;
}
.cigna-contact-page .wpcf7-form input[type="submit"]:hover,
.cigna-contact-page .wpcf7-submit:hover {
  background: #00693c;
  transform: translateY(-1px);
}
.cigna-contact-page .wpcf7-form input[type="submit"]:active,
.cigna-contact-page .wpcf7-submit:active {
  transform: translateY(0);
}
.cigna-contact-page .wpcf7-spinner {
  margin: 0 0 0 12px;
  vertical-align: middle;
}

/* ===== reCAPTCHA 表記 ===== */
.cigna-contact-page .cc-recaptcha-notice {
  margin-top: 20px;
  font-size: 11px;
  color: var(--cn-gray-mid);
  line-height: 1.7;
  text-align: center;
}
.cigna-contact-page .cc-recaptcha-notice a {
  color: var(--cn-navy);
  text-decoration: underline;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .cigna-contact-page .cc-form-body {
    padding: 28px 20px;
  }
  .cigna-contact-page .cc-hero {
    padding: 44px 0 40px;
  }
  .cigna-contact-page .cc-hero-lead br {
    display: none;
  }
  .cigna-contact-page .cc-form-section {
    padding: 40px 0 56px;
  }
}

/* =========================================
   Cigna Thanks Page
   ========================================= */
.cigna-contact-page .cc-thanks-section {
  background: var(--cn-gray-bg);
  padding: 80px 0 100px;
}
.cigna-contact-page .cc-thanks-body {
  background: #fff;
  border-radius: var(--cn-r-lg);
  padding: 64px 56px;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}
.cigna-contact-page .cc-thanks-icon {
  width: 72px;
  height: 72px;
  background: #f0fff4;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 28px;
}
.cigna-contact-page .cc-thanks-icon svg {
  width: 38px;
  height: 38px;
  stroke: var(--cn-green);
}
.cigna-contact-page .cc-thanks-title {
  font-size: clamp(22px, 3vw, 28px);
  font-weight: 800;
  color: var(--cn-text);
  line-height: 1.4;
  margin: 0 0 20px;
}
.cigna-contact-page .cc-thanks-lead {
  font-size: 14px;
  color: var(--cn-gray-dark);
  line-height: 1.8;
  margin: 0 0 28px;
}
.cigna-contact-page .cc-thanks-note {
  background: var(--cn-gray-bg);
  border-radius: var(--cn-r);
  padding: 20px 24px;
  text-align: left;
  margin-bottom: 36px;
}
.cigna-contact-page .cc-thanks-note p {
  font-size: 13px;
  color: var(--cn-gray-dark);
  line-height: 1.8;
  margin: 0 0 12px;
}
.cigna-contact-page .cc-thanks-note p:last-child {
  margin-bottom: 0;
}
.cigna-contact-page .cc-thanks-actions {
  display: flex;
  justify-content: center;
}
.cigna-contact-page .cc-thanks-actions .cn-btn-navy-solid {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  background: var(--cn-navy);
  color: #fff !important;
  border-radius: var(--cn-r);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s;
}
.cigna-contact-page .cc-thanks-actions .cn-btn-navy-solid:hover {
  background: var(--cn-navy-dark);
}
.cigna-contact-page .cc-thanks-actions .cn-btn-navy-solid svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .cigna-contact-page .cc-thanks-section {
    padding: 48px 0 64px;
  }
  .cigna-contact-page .cc-thanks-body {
    padding: 40px 20px;
  }
  .cigna-contact-page .cc-thanks-lead br {
    display: none;
  }
  .cigna-contact-page .cc-thanks-note {
    padding: 16px;
  }
}
