/* ── iPlus Academy Contract Form ─────────────────────────────── */
:root {
  --iac-primary:  #2c5f8a;
  --iac-accent:   #e67e22;
  --iac-bg:       #f8f9fb;
  --iac-card:     #fff;
  --iac-border:   #d0d7de;
  --iac-text:     #24292f;
  --iac-muted:    #6e7781;
  --iac-red:      #cf222e;
  --iac-green:    #1a7f37;
}

.iac-form-wrap {
  max-width: 760px;
  margin: 0 auto;
  font-family: 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  color: var(--iac-text);
}

/* ── ステップインジケーター ── */
.iac-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 32px;
  overflow-x: auto;
}
.iac-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 12px;
  color: var(--iac-muted);
  padding: 0 12px;
  position: relative;
}
.iac-step span {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--iac-border);
  color: var(--iac-muted);
  display: flex; align-items: center; justify-content: center;
  font-weight: bold; font-size: 13px;
  margin-bottom: 4px;
  transition: background .2s, color .2s;
}
.iac-step.active span { background: var(--iac-primary); color: #fff; }
.iac-step.done span   { background: var(--iac-green);   color: #fff; }
.iac-step.active, .iac-step.done { color: var(--iac-text); }

/* ── カード ── */
.iac-step-content {
  background: var(--iac-card);
  border: 1px solid var(--iac-border);
  border-radius: 10px;
  padding: 28px 32px;
}
.iac-step-content h2 {
  margin-top: 0;
  font-size: 20px;
  color: var(--iac-primary);
  border-bottom: 2px solid var(--iac-primary);
  padding-bottom: 8px;
  margin-bottom: 20px;
}

/* ── フィールド ── */
.iac-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 600px) { .iac-field-grid { grid-template-columns: 1fr; } }
.iac-field-full { grid-column: 1 / -1; }

.iac-field { display: flex; flex-direction: column; gap: 4px; }
.iac-field label { font-size: 13px; font-weight: 600; }
.iac-field input[type="text"],
.iac-field input[type="email"],
.iac-field input[type="tel"],
.iac-field input[type="date"],
.iac-field input[type="number"],
.iac-field select,
.iac-field textarea {
  border: 1px solid var(--iac-border);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 14px;
  transition: border-color .15s;
  outline: none;
  width: 100%;
  box-sizing: border-box;
}
.iac-field input:focus, .iac-field select:focus {
  border-color: var(--iac-primary);
  box-shadow: 0 0 0 3px rgba(44,95,138,.12);
}
.required { color: var(--iac-red); margin-left: 2px; }
.iac-small { font-size: 12px; color: var(--iac-muted); margin: 4px 0 0; }

/* ── ボタン ── */
.iac-btn {
  display: inline-block;
  padding: 9px 20px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  background: var(--iac-primary);
  color: #fff;
  transition: background .15s;
}
.iac-btn:hover  { background: #1e4466; }
.iac-btn-sub    { background: #fff; color: var(--iac-primary); border-color: var(--iac-primary); }
.iac-btn-sub:hover { background: var(--iac-bg); }
.iac-btn-primary { background: var(--iac-accent); border-color: var(--iac-accent); font-size: 16px; padding: 12px 28px; }
.iac-btn-primary:hover { background: #d35400; }
.iac-btn:disabled { opacity: .5; cursor: not-allowed; }

.iac-actions { margin-top: 24px; display: flex; gap: 12px; align-items: center; }

/* ── 通知 ── */
.iac-notice {
  padding: 12px 16px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-size: 14px;
}
.iac-notice.error   { background: #ffeef0; border: 1px solid var(--iac-red);   color: var(--iac-red); }
.iac-notice.success { background: #e6ffed; border: 1px solid var(--iac-green); color: var(--iac-green); }
.iac-notice.info    { background: #ddf4ff; border: 1px solid #54aeff;          color: #0550ae; }

/* ── OTP ── */
#iac-otp-block { margin-top: 16px; }
#iac-otp { width: 160px !important; font-size: 22px; letter-spacing: 6px; text-align: center; }

/* ── 価格サマリー ── */
.iac-pricing-card {
  background: #f0f6ff;
  border: 1px solid #a8c7ea;
  border-radius: 8px;
  padding: 20px;
  margin-top: 20px;
}
.iac-pricing-card h3 { margin: 0 0 12px; font-size: 16px; color: var(--iac-primary); }
.iac-pricing-table { width: 100%; border-collapse: collapse; }
.iac-pricing-table td { padding: 6px 4px; font-size: 14px; border-bottom: 1px solid #cde; }
.iac-pricing-table td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.iac-total-row td { font-weight: bold; font-size: 16px; border-top: 2px solid var(--iac-primary); color: var(--iac-primary); }
.iac-campaign-row { background: #fff3cd; color: #856404; font-weight: bold; padding: 6px 8px; border-radius: 4px; font-size: 13px; }
.iac-strike { text-decoration: line-through; color: var(--iac-muted); }
.iac-discount { color: var(--iac-red); font-weight: bold; }

.iac-monthly-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #eaf3ff;
  border: 1px solid #a8c7ea;
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 14px;
}
.iac-monthly-info strong { font-size: 16px; color: var(--iac-primary); }
.iac-initial-head {
  font-size: 13px;
  color: var(--iac-muted);
  margin: 0 0 6px;
  font-weight: 600;
}

  margin-top: 12px;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid var(--iac-border);
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--iac-text);
}

/* ── チェックボックスグループ ── */
.iac-checkbox-group { display: flex; flex-wrap: wrap; gap: 10px; }
.iac-checkbox-group label { display: flex; align-items: center; gap: 6px; font-size: 14px; cursor: pointer; }

/* ── 規約 ── */
.iac-terms-box {
  height: 280px;
  overflow-y: scroll;
  border: 1px solid var(--iac-border);
  border-radius: 6px;
  padding: 16px;
  background: var(--iac-bg);
  font-size: 13px;
  line-height: 1.7;
  margin-bottom: 16px;
}
.iac-terms-box h3 { font-size: 14px; color: var(--iac-primary); margin-top: 0; }
.iac-agreements { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.iac-check-label {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 14px; cursor: pointer;
  padding: 10px 14px;
  border: 1px solid var(--iac-border);
  border-radius: 6px;
  transition: background .1s;
}
.iac-check-label:has(input:checked) { background: #e6ffed; border-color: var(--iac-green); }
.iac-check-label input { margin-top: 2px; width: 16px; height: 16px; flex-shrink: 0; }

/* ── Canvas 署名 ── */
.iac-signature-block { margin-bottom: 20px; }
.iac-canvas-wrapper {
  width: 100%;
  max-width: 500px;
  margin-bottom: 8px;
}
#iac-signature-canvas {
  display: block;
  border: 2px dashed var(--iac-border);
  border-radius: 6px;
  background: #fff;
  cursor: crosshair;
  touch-action: none;
  width: 100%;
}

/* ── 完了画面 LINE ── */
.iac-line-block {
  margin: 24px auto;
  max-width: 360px;
  text-align: center;
}
.iac-line-lead {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--iac-text);
}
.iac-line-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #06c755;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 14px 28px;
  border-radius: 8px;
  text-decoration: none;
  transition: background .15s;
  width: 100%;
  box-sizing: border-box;
}
.iac-line-btn:hover { background: #05b04a; color: #fff; }

/* ── 完了画面 支払い情報 ── */
.iac-payment-complete {
  margin: 16px auto;
  max-width: 420px;
  padding: 14px 18px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.8;
  text-align: left;
}
.iac-payment-complete.credit { background: #f0f6ff; border: 1px solid #a8c7ea; }
.iac-payment-complete.bank   { background: #f0fff4; border: 1px solid #a0d9b4; }
.iac-complete { text-align: center; padding: 20px; }
.iac-complete-icon { font-size: 64px; margin-bottom: 12px; }
.iac-complete h2 { color: var(--iac-green); }

/* 規約内クーリング・オフ強調（特商法対応） */
.iac-terms-box table { width: 100%; border-collapse: collapse; }
.iac-terms-box table td { padding: 8px 10px; font-size: 13px; border: 1px solid #ccc; }
.iac-terms-box table tr:nth-child(2) td {
  border: 2px solid #cc0000;
  color: #cc0000;
}
.iac-terms-box table tr:nth-child(2) td strong { color: #cc0000; }
.iac-verified-email {
  background: #e6ffed;
  border: 1px solid #56d364;
  border-radius: 6px;
  padding: 8px 14px;
  font-size: 13px;
  margin-bottom: 20px;
}