.wrap{max-width:820px; margin:0 auto; padding:0 24px;}
header .wrap, footer .wrap{max-width:1080px;}

.page-hero{
  position:relative; color:#fff; overflow:hidden;
  background:
  linear-gradient(105deg, rgba(15,32,25,0.86) 0%, rgba(15,32,25,0.55) 60%, rgba(15,32,25,0.2) 100%),
  url("../assets/course.webp") center/cover no-repeat,
  linear-gradient(135deg,#163a2e,#24483c);
}
.page-hero .wrap{position:relative; z-index:2; max-width:1080px; padding:64px 24px 48px;}
.page-hero .eyebrow{color:var(--gold); font-weight:700; font-size:13px; letter-spacing:0.08em; margin-bottom:8px;}
.page-hero h1{font-size:32px; margin:8px 0 12px;}
.page-hero p{color:#e4e6e0; font-size:15px; max-width:640px; margin:0;}
.crumb{font-size:12px; color:#c9cdc2; margin-bottom:12px;}
.crumb a{color:#c9cdc2;}

section{padding:56px 0;}
.eyebrow{color:var(--gold-strong); font-weight:700; font-size:13px; letter-spacing:0.08em; margin-bottom:8px;}
h2{font-size:20px; color:var(--navy); margin:0 0 12px;}

.flow-mini{display:flex; gap:0; margin:28px 0 40px;}
.flow-mini .step{flex:1; text-align:center; position:relative; padding:0 10px;}
.flow-mini .step:not(:last-child)::after{content:"→"; position:absolute; top:14px; right:-6px; color:var(--border); font-size:13px;}
.flow-mini .num{width:30px; height:30px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; margin:0 auto 8px;}
.flow-mini p{font-size:12px; color:var(--text-sub); margin:0;}

.form-card{background:var(--white); border:1px solid var(--border); border-radius:14px; padding:28px; text-align:center;}
.form-card iframe{width:100%; height:900px; border:none; border-radius:10px; background:var(--bg);}
.form-fallback{margin-top:18px; font-size:13px; color:var(--text-sub);}
.form-fallback a{color:var(--navy); font-weight:700;}

/* お問い合わせ：フォーム切り替えタブ */
.form-tabs{display:flex; gap:8px; margin:0 0 20px; border-bottom:1px solid var(--border);}
.form-tab{
  flex:1; background:none; border:none; cursor:pointer; font-family:inherit;
  padding:14px 12px; font-size:14px; font-weight:700; color:var(--text-sub);
  border-bottom:2px solid transparent; margin-bottom:-1px;
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.form-tab:hover{color:var(--navy);}
.form-tab.active{color:var(--navy); border-bottom-color:var(--gold-strong);}
.form-panel[hidden]{display:none;}

.dev-note{
  margin-top:20px; background:#fff6e0; border:1px solid #e9d8a6; color:#6b5716;
  font-size:12px; border-radius:10px; padding:16px 20px;
}
.dev-note b{display:block; margin-bottom:4px;}

.note-list{margin-top:32px; display:flex; flex-direction:column; gap:12px;}
.note-item{display:grid; grid-template-columns:24px 1fr; gap:12px; font-size:13px; color:var(--text-sub);}
.note-item .dot{width:20px; height:20px; border-radius:50%; background:var(--navy); color:var(--gold); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700;}

.final-cta{background:var(--navy); color:#fff; text-align:center; padding:56px 0;}
.final-cta h2{color:#fff;}
.final-cta p{color:#c7c9c0; margin:0 0 24px;}
.final-cta .btn-primary{background:var(--gold-strong); color:#fff; padding:14px 32px; font-size:14px;}

@media(max-width:860px){

  .flow-mini{flex-direction:column; gap:14px;}
  .flow-mini .step:not(:last-child)::after{display:none;}
  .form-card{padding:16px;}
  .form-card iframe{height:1400px;}

}


/* =========================================================
   レスポンシブ（下層ページ共通）
   ※ common.css より後に読み込まれるので、ここで上書きする
   ========================================================= */
@media(max-width:1024px){
  section{padding:44px 0;}
  .page-hero .wrap{padding-top:52px; padding-bottom:40px;}
  .page-hero h1{font-size:27px;}
}
@media(max-width:600px){
  .page-hero .wrap{padding-left:16px; padding-right:16px; padding-top:36px; padding-bottom:28px;}
  .page-hero h1{font-size:22px; line-height:1.45;}
  .page-hero p{font-size:14px;}
  .crumb{font-size:11px; margin-bottom:10px;}
  section{padding:34px 0;}
  h2{font-size:19px;}
  .final-cta{padding:40px 0;}
  .final-cta .btn-primary{padding:13px 22px;}
}

@media(max-width:600px){
  .form-card{padding:12px;}
  .form-card iframe{height:1500px;}
  .form-tabs{gap:4px;}
  .form-tab{padding:12px 6px; font-size:12.5px;}
}
