/* Reuse the existing document-request form styles without changing that form. */

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { font-size: 15px; scroll-behavior: smooth; }
    body { font-family: 'Noto Sans JP', sans-serif; background: #F4FBFF; color: #1A3040; line-height: 1.7; }

    /* ─── ヒーロー ─── */
    .dr-hero {
      background: linear-gradient(135deg, #065570 0%, #0A7A96 60%, #1BBCDF 100%);
      padding: 96px 0 56px;
      text-align: center;
      color: #fff;
    }
    .dr-hero .tag {
      display: inline-block;
      background: rgba(255,255,255,.15);
      border: 1px solid rgba(255,255,255,.3);
      padding: 4px 18px;
      border-radius: 20px;
      font-size: .75rem;
      font-weight: 700;
      letter-spacing: .12em;
      margin-bottom: 14px;
    }
    .dr-hero h1 {
      font-size: clamp(1.4rem, 3.5vw, 2rem);
      font-weight: 800;
      margin-bottom: 10px;
    }
    .dr-hero p { font-size: .875rem; opacity: .85; }
    .dr-hero .hero-badges {
      display: flex;
      justify-content: center;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 18px;
    }
    .dr-hero .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: rgba(255,255,255,.18);
      border: 1px solid rgba(255,255,255,.3);
      border-radius: 20px;
      padding: 5px 14px;
      font-size: .78rem;
      font-weight: 600;
    }

    /* ─── コンテナ ─── */
    .container { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
    .dr-body { padding: 44px 0 80px; }

    /* ─── グリッド ─── */
    .dr-grid { display: grid; grid-template-columns: 1fr 300px; gap: 26px; align-items: start; }
    @media (max-width: 860px) { .dr-grid { grid-template-columns: 1fr; } }

    /* ─── カード ─── */
    .dr-card {
      background: #fff;
      border-radius: 16px;
      box-shadow: 0 4px 20px rgba(27,188,223,.08);
      border: 1px solid rgba(200,236,245,.6);
      padding: 26px 28px;
      margin-bottom: 20px;
    }
    .dr-card-title {
      font-size: .9rem;
      font-weight: 700;
      color: #065570;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      gap: 7px;
      padding-bottom: 11px;
      border-bottom: 2px solid #E0F8FF;
    }
    .dr-card-title i {
      color: #0A7A96;
      font-size: .95rem;
      flex-shrink: 0;
    }

    /* ─── フォーム要素 ─── */
    .form-group { margin-bottom: 18px; }
    .form-group:last-child { margin-bottom: 0; }
    .form-label {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: .825rem;
      font-weight: 600;
      color: #3A6070;
      margin-bottom: 6px;
    }
    .req {
      color: #EF4444;
      font-size: .72rem;
      font-weight: 700;
      background: #FEE2E2;
      padding: 1px 6px;
      border-radius: 4px;
    }
    .form-input {
      width: 100%;
      padding: 10px 14px;
      border: 1.5px solid #C8ECF5;
      border-radius: 10px;
      font-size: .9rem;
      font-family: inherit;
      color: #1A3040;
      background: #FAFEFF;
      transition: border-color .2s, box-shadow .2s;
      outline: none;
    }
    .form-input:focus {
      border-color: #1BBCDF;
      box-shadow: 0 0 0 3px rgba(27,188,223,.12);
    }
    .form-input.error {
      border-color: #EF4444;
      box-shadow: 0 0 0 3px rgba(239,68,68,.1);
    }
    textarea.form-input {
      resize: vertical;
      min-height: 130px;
    }
    .form-hint {
      font-size: .77rem;
      color: #7A9BAA;
      margin-top: 5px;
      line-height: 1.6;
    }
    .field-error {
      font-size: .78rem;
      color: #EF4444;
      margin-top: 5px;
      min-height: 1em;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    /* ─── プログラム選択チェックボックス ─── */
    .program-options { display: flex; flex-direction: column; gap: 8px; }
    .program-option {
      border: 1.5px solid #C8ECF5;
      border-radius: 10px;
      padding: 12px 16px;
      cursor: pointer;
      transition: all .2s;
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }
    .program-option:hover { border-color: #1BBCDF; background: #F0FBFF; }
    .program-option.checked { border-color: #0A7A96; background: #E0F8FF; }
    .program-option input[type="checkbox"] {
      margin-top: 2px;
      accent-color: #0A7A96;
      flex-shrink: 0;
      width: 17px;
      height: 17px;
      cursor: pointer;
    }
    .program-option-info { flex: 1; }
    .program-name { font-weight: 700; font-size: .875rem; color: #065570; margin-bottom: 2px; }
    .program-meta { font-size: .75rem; color: #7A9BAA; display: flex; flex-wrap: wrap; gap: 6px; }
    .program-meta span {
      background: #E0F8FF;
      color: #0A7A96;
      padding: 1px 8px;
      border-radius: 12px;
      font-weight: 600;
    }
    .program-loading {
      text-align: center;
      padding: 24px;
      color: #7A9BAA;
      font-size: .85rem;
    }
    .programs-note {
      font-size: .78rem;
      color: #7A9BAA;
      margin-bottom: 12px;
    }

    /* ─── PP同意エリア ─── */
    .pp-wrap {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 14px 16px;
      background: #F4FBFF;
      border: 1.5px solid #C8ECF5;
      border-radius: 10px;
    }
    .pp-wrap input[type="checkbox"] {
      width: 18px;
      height: 18px;
      margin-top: 2px;
      accent-color: #0A7A96;
      flex-shrink: 0;
      cursor: pointer;
    }
    .pp-wrap label {
      font-size: .85rem;
      line-height: 1.7;
      color: #3A6070;
      cursor: pointer;
    }

    /* ─── 送信ボタン ─── */
    .dr-submit {
      width: 100%;
      padding: 15px 24px;
      background: linear-gradient(135deg, #0A7A96, #065570);
      color: #fff;
      border: none;
      border-radius: 12px;
      font-size: 1rem;
      font-weight: 700;
      font-family: inherit;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: opacity .2s, box-shadow .2s;
      box-shadow: 0 6px 20px rgba(10,122,150,.25);
    }
    .dr-submit:hover:not(:disabled) {
      opacity: .92;
      box-shadow: 0 8px 24px rgba(10,122,150,.35);
    }
    .dr-submit:disabled {
      opacity: .65;
      cursor: not-allowed;
    }
    .dr-ssl-note {
      text-align: center;
      font-size: .75rem;
      color: #7A9BAA;
      margin-top: 10px;
    }

    /* ─── ローディング ─── */
    .dr-loading {
      text-align: center;
      padding: 80px 20px;
      color: #7A9BAA;
      font-size: .95rem;
    }
    .dr-loading i { margin-right: 8px; }

    /* ─── エラー表示（API取得失敗・非公開） ─── */
    .dr-unavailable {
      max-width: 560px;
      margin: 60px auto;
      text-align: center;
      background: #fff;
      border-radius: 20px;
      padding: 52px 36px;
      box-shadow: 0 8px 40px rgba(27,188,223,.10);
      border: 1px solid rgba(200,236,245,.7);
    }
    .dr-unavailable .icon-wrap {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: #FEE2E2;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
      font-size: 1.6rem;
      color: #EF4444;
    }
    .dr-unavailable h2 {
      font-size: 1.2rem;
      font-weight: 800;
      color: #1A3040;
      margin-bottom: 12px;
    }
    .dr-unavailable p {
      font-size: .875rem;
      color: #5A8090;
      line-height: 1.8;
      margin-bottom: 8px;
    }
    .dr-unavailable .back-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 20px;
      padding: 11px 24px;
      background: linear-gradient(135deg, #0A7A96, #065570);
      color: #fff;
      border-radius: 10px;
      text-decoration: none;
      font-weight: 700;
      font-size: .9rem;
    }

    /* ─── 完了画面 ─── */
    .dr-thanks {
      max-width: 600px;
      margin: 60px auto;
      text-align: center;
      background: #fff;
      border-radius: 20px;
      padding: 52px 40px;
      box-shadow: 0 8px 40px rgba(27,188,223,.12);
      border: 1px solid rgba(200,236,245,.7);
    }
    .dr-thanks .check-circle {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      background: linear-gradient(135deg, #0A7A96, #1BBCDF);
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 24px;
      font-size: 1.8rem;
      color: #fff;
    }
    .dr-thanks h2 {
      font-size: 1.4rem;
      font-weight: 800;
      color: #065570;
      margin-bottom: 14px;
    }
    .dr-thanks .sub {
      font-size: .9rem;
      color: #5A8090;
      margin-bottom: 8px;
      line-height: 1.7;
    }
    .dr-thanks .confirm-box {
      background: #F4FBFF;
      border: 1px solid #C8ECF5;
      border-radius: 12px;
      padding: 20px 24px;
      margin: 24px 0;
      text-align: left;
    }
    .dr-thanks .back-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 10px;
      padding: 12px 28px;
      background: linear-gradient(135deg, #0A7A96, #065570);
      color: #fff;
      border-radius: 10px;
      text-decoration: none;
      font-weight: 700;
      font-size: .95rem;
      box-shadow: 0 6px 20px rgba(10,122,150,.25);
    }

    /* ─── サイドバー ─── */
    .dr-sidebar-card {
      background: #fff;
      border-radius: 16px;
      padding: 22px 20px;
      margin-bottom: 16px;
      box-shadow: 0 4px 20px rgba(27,188,223,.08);
      border: 1px solid rgba(200,236,245,.6);
    }
    .dr-sidebar-card h3 {
      font-size: .875rem;
      font-weight: 700;
      color: #065570;
      margin-bottom: 14px;
      padding-bottom: 10px;
      border-bottom: 1.5px solid #E0F8FF;
      display: flex;
      align-items: center;
      gap: 7px;
    }
    .dr-sidebar-card ul {
      list-style: none;
      padding: 0;
    }
    .dr-sidebar-card li {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: .82rem;
      color: #5A8090;
      margin-bottom: 9px;
      line-height: 1.6;
    }
    .dr-sidebar-card li i {
      color: #1BBCDF;
      font-size: .75rem;
      margin-top: 4px;
      flex-shrink: 0;
    }
    .dr-sidebar-free {
      background: linear-gradient(135deg, #065570, #0A7A96);
      color: #fff;
      border: none;
    }
    .dr-sidebar-free h3 { color: #FFD726; border-color: rgba(255,255,255,.2); }
    .dr-sidebar-free p  { font-size: .85rem; line-height: 1.7; opacity: .92; }
    .dr-sidebar-free .free-label {
      font-size: 2rem;
      font-weight: 800;
      letter-spacing: .04em;
      margin-bottom: 4px;
    }

    /* ─── 希望順位セレクト（program_1st / 2nd / 3rd） ─── */
    .program-pref-grid { display: flex; flex-direction: column; gap: 14px; }
    .pref-row { display: flex; flex-direction: column; gap: 4px; }
    .pref-label-wrap {
      display: flex; align-items: center; gap: 8px;
      font-size: .82rem; font-weight: 600; color: #3A6070; margin-bottom: 6px;
    }
    .pref-badge {
      display: inline-flex; align-items: center; justify-content: center;
      width: 22px; height: 22px; border-radius: 50%;
      font-size: .72rem; font-weight: 800; flex-shrink: 0;
    }
    .pref-badge.first  { background: #FFD726; color: #7A5200; }
    .pref-badge.second { background: #E2E8F0; color: #4A5568; }
    .pref-badge.third  { background: #FED7AA; color: #7C2D12; }
    .opt {
      color: #0A7A96;
      font-size: .72rem;
      font-weight: 700;
      background: #E0F8FF;
      padding: 1px 6px;
      border-radius: 4px;
    }
    select.form-input {
      cursor: pointer;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%230A7A96' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 14px center;
      appearance: none;
      -webkit-appearance: none;
      padding-right: 36px;
    }
    /* Turnstile ウィジェット */
    .turnstile-wrap { margin-bottom: 14px; }
    .turnstile-error { font-size: .8rem; color: #EF4444; margin-top: 6px; display: none; }
  
[hidden]{display:none!important}
.video-main{max-width:760px;margin:32px auto;padding:0 20px 40px}
.video-main .dr-card{margin-bottom:20px}
.video-main .form-group{margin-bottom:16px}
.video-main .form-input{width:100%}
.video-submit{width:100%;border:0;cursor:pointer}
.video-complete{background:#fff;border-radius:16px;padding:32px;box-shadow:0 6px 24px rgba(6,85,112,.06)}
.video-complete h1{font-size:1.3rem;color:#065570;margin-bottom:6px}
.video-complete .lead{font-size:.875rem;color:#54717f;margin-bottom:20px}
#videos{display:grid;gap:18px}
.video-season{font-size:.875rem;font-weight:700;color:#065570;margin-bottom:6px}
.video-cta{display:block;text-align:center;padding:17px 20px;border-radius:10px;background:linear-gradient(110deg,#087b99,#13a8bd);color:#fff;font-weight:700;font-size:1.05rem;text-decoration:none}
.video-cta:hover{filter:brightness(.95)}
#brochure-section{margin-top:22px;border-top:1px solid #e0edf2;padding-top:16px}
#brochure-section h2{font-size:.875rem;color:#54717f;margin-bottom:6px}
#brochures{list-style:none;margin:0;padding:0;font-size:.8125rem}
#brochures li{margin:6px 0}#brochures a,.video-secondary a{color:#087b99;text-decoration:underline}
.video-secondary{margin-top:24px;font-size:.8125rem;color:#54717f}
#message{color:#b44136;font-size:.875rem;margin:12px 0}
.video-consent{display:flex;align-items:flex-start;gap:10px;font-size:.875rem}.video-consent input{margin-top:6px}
@media(max-width:600px){.video-main{padding:0 16px 24px;margin:20px auto}.video-complete{padding:24px 20px}.video-main .form-input{font-size:16px}.video-cta{padding:16px 10px}.dr-hero{padding:88px 16px 32px}}

.video-complete{scroll-margin-top:90px}

#site-floating-cta{display:none!important}
.dr-hero .tag{color:#fff}

/* Completion screen only; leave the request form and submit button unchanged. */
.video-complete-title{display:flex;align-items:center;gap:10px;line-height:1.6}
.video-complete-check{display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px;height:30px;border-radius:50%;background:#e7f6f6;color:#087b99;font-size:1rem;font-weight:600}
.video-complete #videos{gap:20px}
.video-complete .video-cta{padding:18px 24px;line-height:1.5;box-shadow:0 4px 12px rgba(8,123,153,.12)}
.video-complete a:focus-visible{outline:3px solid #087b99;outline-offset:4px}
.video-complete #brochures{display:flex;flex-wrap:wrap;gap:4px 20px;line-height:1.7}
.video-complete #brochures a{text-underline-offset:3px}
.video-complete .video-secondary{margin-top:20px;padding-top:16px;border-top:1px solid #e0edf2}
.video-complete .video-secondary{display:flex;flex-wrap:wrap;gap:8px}
.video-complete .video-secondary a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 18px;border:1px solid #b4cfd9;border-radius:8px;color:#54717f;font-size:.8125rem;font-weight:500;text-decoration:none;background:transparent}
.video-complete .video-secondary a:hover{background:#f1f8fa}
@media(max-width:600px){
 .video-complete h1{font-size:1.05rem}
 .video-complete .lead{font-size:.8125rem;margin:10px 0 20px}
 .video-complete .video-cta{padding:16px 12px;font-size:1rem}
 .video-complete #brochures{gap:2px 16px}
}
