.sm-banners{max-width:980px;margin:24px auto;display:flex;flex-direction:column;gap:20px;padding:0 12px;}
.sm-banner{position:relative;border-radius:14px;overflow:hidden;color:#fff;
  background-size:cover;background-position:center;box-shadow:0 10px 26px rgba(20,50,76,.18);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:9px;padding:7% 8%;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;}
.sm-banner::before{content:"";position:absolute;inset:0;z-index:0;}
.sm-banner>*{position:relative;z-index:1;}

/* ── ① 高2生 拡張体験 ───────────────────────────── */
.sm-kou2{aspect-ratio:934/471;background-color:#123E68;background-image:url('/upload/tenant_1/高2拡張体験　画像.jpg');}
.sm-kou2::before{background:linear-gradient(90deg,rgba(8,33,63,.72) 0%,rgba(8,33,63,.52) 46%,rgba(8,33,63,.10) 72%,rgba(8,33,63,0) 100%);}

/* ── ② 洛北中 定期テスト対策体験 ──────────────────── */
.sm-rakuhoku{aspect-ratio:943/426;background-color:#0A2444;background-image:url('/upload/tenant_1/洛北中定期テスト対策体験　画像.jpg');}
.sm-rakuhoku::before{background:linear-gradient(90deg,rgba(6,22,44,.58) 0%,rgba(6,22,44,.34) 46%,rgba(6,22,44,0) 72%);}

/* ── ③ 小学生 学力診断テスト ──────────────────────── */
.sm-shindan{aspect-ratio:934/471;background-color:#1B5E8C;background-image:url('/upload/tenant_1/小学生学力診断テスト　画像.jpg');}
.sm-shindan::before{background:linear-gradient(90deg,rgba(24,38,54,.74) 0%,rgba(24,38,54,.56) 48%,rgba(24,38,54,.16) 74%,rgba(24,38,54,0) 100%);}

/* ── 通年 洛北中・近隣中学生 定期テスト対策（既存バナー・据え置き） ── */
.sm-testprep{aspect-ratio:943/426;background-color:#16365F;background-image:url('/upload/tenant_1/bg-test-prep.png');}
.sm-testprep::before{background:linear-gradient(90deg,rgba(8,24,52,.60) 0%,rgba(8,24,52,.30) 46%,rgba(8,24,52,0) 72%);}

/* ── 共通パーツ ─────────────────────────────────── */
.sm-ribbon{display:inline-block;background:linear-gradient(135deg,#F39B3D,#E07D1E);
  font-size:1.2rem;font-weight:700;letter-spacing:.1em;padding:8px 26px;border-radius:999px;}
.sm-ribbon-red{background:linear-gradient(135deg,#D8503C,#B62F22);}
.sm-ribbon-gold{background:linear-gradient(135deg,#F5C24B,#E0A92E);color:#3a2c05;}
.sm-pre{display:block;font-size:1.05rem;font-weight:500;text-shadow:0 2px 8px rgba(11,40,70,.55);}
.sm-title{display:block;font-size:2.9rem;font-weight:900;line-height:1.05;text-shadow:0 3px 12px rgba(11,40,70,.5);}
.sm-title .sm-y{color:#F5C24B;font-weight:900;}
.sm-title .sm-r{color:#FFB4A2;font-weight:900;}
.sm-lead{display:block;font-size:1.15rem;font-weight:700;text-shadow:0 2px 8px rgba(11,40,70,.55);}
.sm-badge{display:inline-block;background:rgba(255,255,255,.92);color:#1B4F8A;font-size:.8rem;
  font-weight:700;line-height:1.35;padding:5px 11px;border-radius:8px;}
.sm-badge-gold{background:rgba(255,240,200,.95);color:#7A4A15;}
.sm-sub{display:block;font-size:.9rem;font-weight:500;text-shadow:0 2px 8px rgba(11,40,70,.55);}
.sm-cta{display:inline-block;background-color:#F59333;
  background-image:linear-gradient(135deg,#FFAA45,#F0820F);color:#fff;
  font-size:1.05rem;font-weight:700;padding:11px 24px;border-radius:999px;text-decoration:none;margin-top:4px;}
.sm-cta-gold{display:inline-block;background:linear-gradient(135deg,#F5C24B,#E0A92E);color:#3a2c05;
  font-size:1.05rem;font-weight:900;padding:11px 28px;border-radius:999px;text-decoration:none;margin-top:8px;}
.sm-tp-label{display:inline-block;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.14);
  font-size:.9rem;font-weight:700;padding:4px 15px;border-radius:999px;}
.sm-tp-title{display:block;font-size:2.6rem;font-weight:900;line-height:1.12;text-shadow:0 3px 12px rgba(6,20,45,.6);}
.sm-tp-title2{display:block;font-size:2.6rem;font-weight:900;line-height:1.12;color:#F5C24B;text-shadow:0 3px 12px rgba(6,20,45,.6);}
.sm-tp-formula{display:block;font-size:1.05rem;font-weight:700;text-shadow:0 2px 8px rgba(6,20,45,.6);}

@media (max-width:600px){
  .sm-kou2,.sm-rakuhoku,.sm-shindan,.sm-testprep{aspect-ratio:auto;min-height:210px;}
  /* スマホは文字が横幅いっぱいに広がるため、全面を均一に暗くして可読性を確保する */
  .sm-kou2::before{background:linear-gradient(120deg,rgba(8,33,63,.74) 0%,rgba(8,33,63,.62) 60%,rgba(8,33,63,.48) 100%);}
  .sm-rakuhoku::before{background:linear-gradient(120deg,rgba(6,22,44,.62) 0%,rgba(6,22,44,.48) 60%,rgba(6,22,44,.34) 100%);}
  .sm-shindan::before{background:linear-gradient(120deg,rgba(24,38,54,.74) 0%,rgba(24,38,54,.62) 60%,rgba(24,38,54,.50) 100%);}
  .sm-title,.sm-tp-title,.sm-tp-title2{font-size:1.8rem;}
  .sm-lead{font-size:.95rem;}
  .sm-badge{font-size:.66rem;}
  .sm-pre,.sm-sub,.sm-tp-formula{font-size:.8rem;}
  .sm-cta,.sm-cta-gold{font-size:.9rem;padding:9px 18px;}
  .sm-ribbon{font-size:.95rem;padding:6px 18px;}
  .sm-banner{gap:6px;padding:6% 7%;}
}
