/* ============================================================
   学習塾RENA｜夏期講習 特設ランディングページ（1c 爽やか・ポップ）
   このページ専用のスタイル。トップページとは別の「夏の特設」トーン。
   ============================================================ */
:root{
  --sky:      #5cc4e8;
  --sky-deep: #0a7ea4;
  --teal:     #00b3a4;
  --teal-d:   #0c6f66;
  --orange:   #ef8f3c;
  --orange-d: #c96a1c;
  --ink:      #2b3a3a;
  --ink-soft: #4a6a6a;
  --paper:    #f2fafd;
  --cream:    #eaf7fb;
  --serif: 'Shippori Mincho', serif;
  --sans:  'Zen Kaku Gothic New', system-ui, sans-serif;
  --wrap: 1040px;
  --pad: clamp(20px, 5vw, 40px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body.summer{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.9;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.summer h1,.summer h2,.summer h3,.summer p{margin:0}
.summer img{max-width:100%;display:block}
.summer a{color:inherit;text-decoration:none}
.s-wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}

/* ---------- 共通見出し ---------- */
.s-eyebrow{text-align:center;font-size:11px;font-weight:900;letter-spacing:.16em;color:var(--teal);margin-bottom:8px}
.s-eyebrow-orange{color:var(--orange)}
.s-eyebrow-sky{color:var(--sky-deep)}
.s-h2{text-align:center;font-family:var(--serif);font-weight:700;font-size:clamp(22px,4vw,30px);color:var(--teal-d);letter-spacing:.03em;line-height:1.5}
main>section{padding-block:clamp(44px,7vw,68px)}

/* ---------- ボタン ---------- */
.s-btn{display:inline-block;font-weight:900;font-size:15px;padding:15px 26px;border-radius:999px;transition:.2s;text-align:center}
.s-btn:hover{transform:translateY(-2px)}
.s-btn-primary{background:linear-gradient(90deg,var(--teal),#28c7b6);color:#fff;box-shadow:0 14px 28px -10px rgba(0,179,164,.7)}
.s-btn-white{background:#fff;color:var(--sky-deep);box-shadow:0 8px 20px -10px rgba(10,90,120,.5)}

/* ============================================================ HEADER */
.s-header{position:sticky;top:0;z-index:50;background:rgba(242,250,253,.86);backdrop-filter:blur(10px);border-bottom:1px solid rgba(10,126,164,.1)}
.s-header-in{display:flex;align-items:center;justify-content:space-between;height:60px}
.s-brand{display:flex;align-items:baseline;gap:8px}
.s-brand-logo{font-family:var(--serif);font-weight:800;font-size:23px;letter-spacing:.06em;color:var(--teal-d)}
.s-brand-logo span{color:var(--teal)}
.s-brand-mark{font-family:var(--serif);font-weight:800;font-size:22px;letter-spacing:.08em;color:var(--teal-d)}
.s-brand-sub{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--teal)}
.s-header-cta{background:var(--orange);color:#fff;font-weight:900;font-size:13px;padding:9px 20px;border-radius:999px}

/* ============================================================ HERO */
.s-hero{position:relative;min-height:min(86vh,720px);display:flex;align-items:flex-end;overflow:hidden;background:var(--sky)}
.s-hero-img{position:absolute;inset:0}
.s-hero-img img{width:100%;height:100%;object-fit:cover;object-position:72% 20%}
.s-hero-scrim{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(10,90,120,.12) 0%,transparent 26%,transparent 52%,rgba(242,250,253,.35) 84%,var(--paper) 100%),
  linear-gradient(90deg,rgba(12,111,102,.34) 0%,rgba(12,111,102,.06) 40%,transparent 62%)}
.s-hero-in{position:relative;padding-bottom:clamp(30px,5vw,54px);padding-top:64px}
.s-badge{display:inline-block;font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--sky-deep);background:#fff;padding:7px 15px;border-radius:999px;box-shadow:0 6px 16px -6px rgba(0,0,0,.3)}
.s-hero-title{font-family:var(--serif);font-weight:800;font-size:clamp(44px,9vw,84px);line-height:1.12;letter-spacing:.04em;color:#fff;margin-top:16px;text-shadow:0 3px 20px rgba(8,60,80,.45)}
.s-hero-catch{font-family:var(--serif);font-weight:700;font-size:clamp(17px,3.4vw,24px);color:#fff;margin-top:14px;letter-spacing:.04em;text-shadow:0 2px 14px rgba(8,60,80,.5)}
.s-hero-catch em{font-style:normal;color:#ffe08a}
.s-hero-date{display:inline-flex;flex-direction:column;gap:2px;background:#fff;border-radius:16px;padding:12px 22px;margin-top:20px;box-shadow:0 14px 30px -12px rgba(8,60,80,.5)}
.s-hero-date-grade{font-weight:900;font-size:13px;color:var(--sky-deep)}
.s-hero-date-range{font-family:var(--serif);font-weight:700;font-size:clamp(22px,4.6vw,30px);color:var(--orange)}
.s-hero-date-range small{font-size:14px;margin:0 1px}
.s-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

/* ============================================================ INTRO */
.s-intro{background:#fff;text-align:center}
.s-intro-text{font-family:var(--serif);font-weight:600;font-size:clamp(16px,3vw,22px);line-height:2;color:var(--teal-d);letter-spacing:.03em}

/* ============================================================ FLOW */
.s-flow{background:var(--cream)}
.s-flow .s-eyebrow{margin-top:0}
.s-flow-grid{display:flex;align-items:stretch;justify-content:center;gap:clamp(10px,3vw,26px);margin-top:26px;flex-wrap:wrap}
.s-flow-card{flex:1;min-width:220px;max-width:360px;border-radius:22px;padding:28px 24px;text-align:center;background:#fff;box-shadow:0 14px 30px -18px rgba(10,90,120,.5)}
.s-flow-card.is-1{background:#e6f8f4}
.s-flow-card.is-2{background:#fff1e2}
.s-flow-num{width:44px;height:44px;margin:0 auto 10px;border-radius:50%;color:#fff;font-weight:900;font-size:21px;display:flex;align-items:center;justify-content:center}
.is-1 .s-flow-num{background:var(--teal)}
.is-2 .s-flow-num{background:var(--orange)}
.s-flow-title{font-family:var(--serif);font-weight:700;font-size:20px;margin-bottom:8px}
.is-1 .s-flow-title{color:var(--teal-d)}
.is-2 .s-flow-title{color:var(--orange-d)}
.s-flow-desc{font-size:13.5px;line-height:1.85;color:var(--ink-soft)}
.s-flow-arrow{align-self:center;color:var(--orange);font-size:26px;font-weight:900}

/* ============================================================ CAMPAIGN */
.s-camp{background:var(--paper)}
.s-camp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:26px}
.s-camp-card{background:linear-gradient(140deg,#fff,#f0fbf8);border:2px solid #cdeee7;border-radius:22px;padding:26px 24px;text-align:center}
.s-camp-tag{display:inline-block;font-size:12px;font-weight:900;color:#fff;background:var(--teal);padding:6px 16px;border-radius:999px}
.s-camp-lead{font-size:14px;font-weight:700;color:var(--ink);margin-top:14px}
.s-camp-big{font-family:var(--serif);font-weight:800;font-size:clamp(28px,6vw,38px);color:var(--orange);letter-spacing:.02em;margin-top:4px;line-height:1.2}
.s-camp-big span{font-size:16px;margin-left:4px}
.s-camp-big s{color:#a9b8b8;font-size:.62em;font-weight:700}
.s-camp-note{font-size:11.5px;line-height:1.75;color:#7d9091;margin-top:12px}

/* ============================================================ 通常授業：きょうだい割引 */
.s-regular{background:#fff;border-top:1px solid #e3eef1}
.s-reg-kicker{text-align:center;font-size:11.5px;font-weight:700;color:var(--orange-d);background:#fff4e9;border:1px solid #f6d9b8;border-radius:999px;padding:6px 16px;width:fit-content;margin:0 auto 16px}
.s-reg-sub{text-align:center;font-size:13.5px;line-height:1.9;color:var(--ink-soft);max-width:860px;margin:12px auto 0}
.s-sib-steps{display:flex;align-items:stretch;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:30px}
.s-sib-step{flex:1;min-width:150px;max-width:230px;display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--cream);border:2px solid #d7ecec;border-radius:20px;padding:22px 16px}
.s-sib-step.is-half{background:linear-gradient(160deg,#fff6ea,#ffeede);border-color:#f4d6b0}
.s-sib-step.is-third{background:linear-gradient(160deg,#fff1e0,#ffe6cc);border-color:#f0c79a}
.s-sib-step.is-more{background:#f2fafd;border-color:#d7ecec;border-style:dashed}
.s-sib-order{font-size:12.5px;font-weight:900;color:var(--teal-d);letter-spacing:.04em}
.s-sib-step.is-half .s-sib-order,.s-sib-step.is-third .s-sib-order{color:var(--orange-d)}
.s-sib-frac{display:flex;flex-direction:column;align-items:center;font-family:var(--serif);color:var(--orange);line-height:1}
.s-sib-frac b{font-size:26px;font-weight:800;color:var(--teal-d)}
.s-sib-frac i{font-style:normal;font-size:34px;font-weight:800}
.s-sib-frac em{display:block;width:38px;height:3px;background:var(--orange);border-radius:2px;margin:3px 0}
.s-sib-frac-more{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--sky-deep);text-align:center;line-height:1.5}
.s-sib-cap{font-size:12.5px;font-weight:700;color:var(--ink-soft);text-align:center}
.s-sib-op{align-self:center;font-size:26px;font-weight:900;color:#c7d9d9}
.s-sib-zero{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin:24px auto 0;background:linear-gradient(100deg,var(--teal),#33cabb);color:#fff;border-radius:18px;padding:18px 26px;max-width:560px;box-shadow:0 16px 34px -18px rgba(0,179,164,.8)}
.s-sib-zero-label{font-size:13.5px;font-weight:700}
.s-sib-zero-big{font-family:var(--serif);font-weight:800;font-size:26px;letter-spacing:.02em;display:inline-flex;align-items:baseline;gap:8px}
.s-sib-zero-big s{color:rgba(255,255,255,.6);font-size:.66em;font-weight:700}
.s-reg-note{font-size:11.5px;line-height:1.85;color:#8aa;margin-top:18px;text-align:center;max-width:860px;margin-inline:auto}

@media (max-width:640px){
  .s-sib-op{transform:rotate(90deg)}
  .s-sib-step{max-width:none}
}

/* ============================================================ PRICE */
.s-price{background:var(--cream)}
.s-price-sub{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:10px}
.s-price-sub b{color:var(--orange-d)}
.s-price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:24px}
.s-price-card{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 12px 28px -18px rgba(10,90,120,.55)}
.s-price-head{background:linear-gradient(90deg,var(--teal),#33cabb);color:#fff;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.s-price-grade{font-family:var(--serif);font-weight:700;font-size:20px}
.s-price-vol{font-size:11.5px;opacity:.95;text-align:right}
.s-price-spec{list-style:none;margin:0;padding:14px 20px}
.s-price-spec li{display:flex;gap:12px;font-size:13px;color:var(--ink-soft);padding:5px 0;line-height:1.7}
.s-price-spec li span{flex:none;width:40px;font-weight:700;color:var(--sky-deep);font-size:12px}
.s-price-fee{display:flex;align-items:baseline;justify-content:flex-end;gap:12px;padding:12px 20px 20px;border-top:1px dashed #d6e6ea}
.s-price-old{font-size:13px;color:#a9b8b8;text-decoration:line-through}
.s-price-now{font-family:var(--serif);font-weight:800;font-size:clamp(26px,5vw,32px);color:var(--orange);display:flex;align-items:baseline;gap:6px}
.s-price-now small{font-size:12px;font-weight:700;color:var(--ink-soft);font-family:var(--sans)}
.s-price-foot{font-size:11px;color:#8aa;line-height:1.75;margin-top:16px;text-align:center}

/* ============================================================ APPROACH */
.s-approach{background:#fff}
.s-approach-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:24px}
.s-approach-card{border:2px solid #e0eef1;border-radius:22px;padding:26px 26px;background:var(--paper)}
.s-approach-card h3{font-family:var(--serif);font-weight:700;font-size:18px;color:var(--teal-d);margin-bottom:10px}
.s-approach-card p{font-size:13.5px;line-height:1.95;color:var(--ink-soft)}

/* ============================================================ GALLERY */
.s-gallery{background:#fff}
.s-gallery-sub{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:10px}
.s-gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.s-gal-item{margin:0;position:relative;border-radius:18px;overflow:hidden;background:var(--cream);box-shadow:0 10px 26px -18px rgba(10,90,120,.5)}
.s-gal-item img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform .5s ease}
.s-gal-item:hover img{transform:scale(1.05)}
.s-gal-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 16px 12px;font-size:12.5px;font-weight:700;color:#fff;background:linear-gradient(0deg,rgba(8,60,80,.78),transparent)}
.s-gal-item.is-wide{grid-column:span 2}
.s-gal-note{text-align:center;font-family:var(--serif);font-size:15px;color:var(--teal-d);margin-top:30px;letter-spacing:.04em}
.s-gal-small{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px;max-width:520px;margin-inline:auto}
.s-gal-small .s-gal-item img{aspect-ratio:1/1}

@media (max-width:719px){
  .s-gal-grid{grid-template-columns:repeat(2,1fr)}
  .s-gal-item.is-wide{grid-column:span 2}
}
@media (max-width:420px){
  .s-gal-grid{grid-template-columns:1fr}
  .s-gal-item.is-wide{grid-column:span 1}
}

/* ============================================================ ENTRY FORM */
.s-entry{background:linear-gradient(180deg,var(--cream),var(--paper))}
.s-entry-sub{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:10px}
.s-entry-sub a{color:var(--sky-deep);font-weight:700}
.s-form{max-width:560px;margin:26px auto 0;background:#fff;border-radius:24px;padding:clamp(22px,4vw,34px);box-shadow:0 20px 44px -26px rgba(10,90,120,.6)}
.s-field{margin-bottom:16px}
.s-field label,.s-field-label{display:block;font-size:13px;font-weight:700;color:var(--teal-d);margin-bottom:7px}
.s-req{display:inline-block;font-size:10px;font-weight:900;color:#fff;background:var(--orange);padding:2px 7px;border-radius:5px;margin-left:4px;vertical-align:1px}
.s-form input,.s-form select,.s-form textarea{width:100%;border:2px solid #e0eef1;border-radius:12px;padding:13px 14px;font-size:15px;font-family:var(--sans);background:#f6fbfc;color:var(--ink);transition:border-color .2s,background .2s}
.s-form input:focus,.s-form select:focus,.s-form textarea:focus{outline:none;border-color:var(--teal);background:#fff}
.s-form textarea{resize:vertical}
.s-form input.s-invalid,.s-form select.s-invalid{border-color:#e2725b;background:#fdf2ef}
.s-choice{display:flex;gap:9px;flex-wrap:wrap}
.s-choice label{display:flex;align-items:center;gap:7px;flex:1;min-width:120px;border:2px solid #e0eef1;border-radius:12px;padding:11px 14px;font-size:13.5px;font-weight:700;color:var(--ink-soft);cursor:pointer;margin:0;transition:.15s}
.s-choice input{width:auto;accent-color:var(--teal)}
.s-elem-note{font-size:12px;line-height:1.7;color:var(--orange-d);background:#fff4e9;border:1px solid #f6d9b8;border-radius:10px;padding:9px 12px;margin-bottom:10px}
.s-choice label:has(input:checked){border-color:var(--teal);background:#e6f8f4;color:var(--teal-d)}
.s-submit{width:100%;border:0;cursor:pointer;background:linear-gradient(90deg,var(--orange),#f5a94f);color:#fff;font-family:var(--sans);font-weight:900;font-size:16px;padding:17px;border-radius:999px;box-shadow:0 16px 30px -12px rgba(239,143,60,.7);transition:transform .2s;margin-top:6px}
.s-submit:hover{transform:translateY(-2px)}
.s-form-note{font-size:11.5px;color:#8aa;text-align:center;margin-top:12px;line-height:1.7}
.s-thanks{max-width:560px;margin:26px auto 0;background:#fff;border-radius:24px;padding:40px 28px;text-align:center;box-shadow:0 20px 44px -26px rgba(10,90,120,.6)}
.s-thanks-mark{width:60px;height:60px;margin:0 auto 16px;border-radius:50%;background:var(--teal);color:#fff;font-size:30px;font-weight:900;display:flex;align-items:center;justify-content:center}
.s-thanks h3{font-family:var(--serif);font-size:21px;color:var(--teal-d);margin-bottom:10px}
.s-thanks p{font-size:14px;color:var(--ink-soft);line-height:1.9}

/* ============================================================ FOOTER */
.s-footer{background:var(--teal-d);color:#c9ece7}
.s-footer-in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-block:clamp(32px,5vw,44px)}
.s-footer-mark{color:#fff}
.s-footer-logo{color:#fff;font-size:22px}
.s-footer-logo span{color:var(--teal-light)}
.s-footer-tag{font-family:var(--serif);font-size:14px;color:#a8ebe2;margin-top:8px}
.s-footer-addr{font-size:12.5px;line-height:1.95;color:#8fc9c1}
.s-footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-block:16px;font-size:12px;color:#7bb8b0;text-align:center}

/* ============================================================ FAB（常時表示の申し込みボタン） */
.s-fab{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:60;background:linear-gradient(90deg,var(--orange),#f5a94f);color:#fff;font-weight:900;font-size:14px;padding:14px 30px;border-radius:999px;box-shadow:0 14px 30px -8px rgba(239,143,60,.75);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.s-fab.show{opacity:1;pointer-events:auto}
.s-fab:hover{transform:translateX(-50%) translateY(-2px)}

/* ============================================================ ロゴ(マーク+学習塾RENA) トップページと統一 */
.s-brand{display:flex;align-items:center;gap:9px}
.s-brand-img{height:36px;width:auto;display:block;flex:none}
.s-brand-logo{font-size:15px;color:var(--ink);display:flex;align-items:baseline}
.s-brand-logo span{font-size:24px;margin-left:6px;letter-spacing:.05em}
.s-footer-brand{display:flex;align-items:center;gap:10px}
.s-footer-img{height:42px;width:auto;display:block;flex:none}
.s-footer-logo{font-size:14px;color:#e6f8f4}
.s-footer-logo span{font-size:22px;color:#33cabb}

@media (max-width:719px){
  .s-flow-arrow{transform:rotate(90deg)}
  .s-hero-img img{object-position:center 22%}
}
@media (min-width:900px){
  .s-hero-in{padding-bottom:60px}
}