/* ===== スクールサーチ LP ===== */
:root{
  --blue:#0052cc;
  --blue-dark:#003d99;
  --navy:#1e2a5a;
  --yellow:#ffb81c;
  --bg:#eef3fb;
  --card:#ffffff;
  --text:#333;
  --muted:#6b7280;
  --line:#e3e8f0;
  --maxw:1120px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",system-ui,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}

/* ===== Header ===== */
.header{
  position:sticky;top:0;z-index:100;
  background:#fff;
  box-shadow:0 1px 8px rgba(0,40,120,.08);
}
.header__inner{
  max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;
  position:relative;
}
.header__logo img{height:40px;width:auto;}
.nav{display:flex;gap:28px;font-weight:700;font-size:15px;}
.nav a{padding:6px 2px;border-bottom:2px solid transparent;transition:.2s;}
.nav a:hover{color:var(--blue);border-color:var(--blue);}

/* hamburger (CSS only) */
.nav-toggle{display:none;}
.nav-burger{display:none;}
.nav-overlay{display:none;}

/* ===== Hero ===== */
.hero{position:relative;background:#dcebff;overflow:hidden;}
.hero__bg img{width:100%;}
.hero__copy{
  position:absolute;
  top:50%;left:7%;
  transform:translateY(-50%);
  width:43%;max-width:600px;
}
.hero__copy img{width:100%;filter:drop-shadow(0 4px 14px rgba(0,40,120,.12));}

/* ===== Bio (profile + intro) ===== */
.bio{max-width:var(--maxw);margin:0 auto;padding:64px 24px;}
.bio__card{
  background:var(--card);
  border-radius:18px;
  box-shadow:0 10px 40px rgba(0,40,120,.08);
  padding:56px 60px;
  display:flex;gap:56px;align-items:flex-start;
}

/* --- profile (left) --- */
.bio__profile{flex:0 0 300px;text-align:center;}
.bio__avatar{
  width:200px;height:200px;margin:0 auto 18px;
  border-radius:50%;overflow:hidden;
  border:2px solid var(--blue);
  background:#fff;
}
.bio__avatar img{width:100%;height:100%;object-fit:cover;}
.bio__badge{
  display:block;background:var(--blue);color:#fff;
  font-size:14px;font-weight:800;letter-spacing:2px;
  padding:6px 0;border-radius:4px;margin:0 0 14px;
}
.bio__name{margin:0 0 6px;font-size:34px;font-weight:800;color:var(--navy);letter-spacing:2px;}
.bio__role{margin:0 0 14px;font-size:15px;font-weight:800;color:var(--text);}
.bio__desc{
  margin:0;font-size:13px;color:var(--muted);line-height:1.8;
  text-align:left;font-style:italic;
}

/* --- intro (right) --- */
.bio__intro{
  flex:1 1 auto;
  border-left:1px solid var(--line);
  padding-left:56px;
}
.bio__intro-head{
  margin:0 0 22px;font-size:26px;font-weight:800;color:var(--navy);
  font-style:italic;letter-spacing:1px;
}
.bio__intro p{margin:0 0 18px;font-size:15px;color:var(--text);line-height:1.9;}
.bio__strong{font-weight:800;}
.bio__hl{color:var(--blue);font-weight:800;}
.bio__closing{color:var(--blue);font-weight:800;font-style:italic;}
.bio__line{color:#06a648;font-weight:800;text-decoration:underline;}
.bio__line:hover{opacity:.8;}
.bio__checks{
  list-style:none;margin:0 0 18px;padding:20px 24px;
  background:#eef3fb;border-radius:12px;
}
.bio__checks li{
  position:relative;padding-left:30px;
  font-size:15px;font-weight:700;color:var(--navy);line-height:1.6;
}
.bio__checks li + li{margin-top:8px;}
.bio__checks li::before{
  content:"";position:absolute;left:0;top:3px;
  width:18px;height:18px;border-radius:50%;
  border:2px solid var(--blue);
  background:
    linear-gradient(45deg,transparent 46%,var(--blue) 46%,var(--blue) 54%,transparent 54%);
}

/* ===== CTA ===== */
.cta{background:#fff;}
.cta__link{display:block;}
.cta__link img{width:100%;}
.cta__link{transition:filter .2s;}
.cta__link:hover{filter:brightness(1.04);}

/* ===== Ranking ===== */
.ranking{max-width:var(--maxw);margin:0 auto;padding:64px 24px 80px;}
.ranking__head{margin-bottom:40px;}
.ranking__head img{max-width:760px;}
.rank-list{display:flex;flex-direction:column;gap:22px;}

.rank-card{
  background:#fff;border-radius:16px;
  box-shadow:0 6px 24px rgba(0,40,120,.07);
  display:flex;align-items:stretch;gap:0;overflow:hidden;
  border:1px solid var(--line);
}
.rank-card__badge{
  flex:0 0 92px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#fff;font-weight:800;line-height:1;
  background:linear-gradient(160deg,#5b8def,#0052cc);
}
.rank-card--1 .rank-card__badge{background:linear-gradient(160deg,#ffd24d,#f5a300);}
.rank-card--2 .rank-card__badge{background:linear-gradient(160deg,#cfd6e0,#9aa6b8);}
.rank-card--3 .rank-card__badge{background:linear-gradient(160deg,#e0a679,#bd7b46);}
.rank-card__num{font-size:40px;}
.rank-card__label{font-size:14px;margin-top:4px;}

.rank-card__body{flex:1 1 auto;padding:22px 26px;min-width:0;}
.rank-card__name{margin:0 0 4px;font-size:21px;font-weight:800;color:var(--navy);}
.rank-card__cat{margin:0 0 8px;font-size:13px;color:var(--blue);font-weight:700;}
.rank-card__stars{color:var(--yellow);font-size:16px;letter-spacing:1px;margin-bottom:10px;}
.rank-card__stars b{color:var(--text);font-size:15px;margin-left:6px;}
.rank-card__tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 12px;}
.rank-card__tags li{
  background:#eef3fb;color:var(--blue-dark);
  font-size:12px;font-weight:700;border-radius:999px;padding:4px 12px;
}
.rank-card__desc{margin:0;font-size:14px;color:var(--muted);}

.rank-card__action{
  flex:0 0 200px;
  border-left:1px dashed var(--line);
  padding:22px 24px;
  display:flex;flex-direction:column;justify-content:center;gap:12px;
}
.rank-card__price{margin:0;font-size:14px;color:var(--text);text-align:center;}
.rank-card__price b{font-size:20px;color:var(--navy);}
.rank-card__btn{
  display:block;text-align:center;
  background:linear-gradient(180deg,#06c755,#04a648);
  color:#fff;font-weight:800;font-size:14px;
  padding:12px 10px;border-radius:999px;
  box-shadow:0 4px 12px rgba(6,199,85,.3);
  transition:.2s;
}
.rank-card__btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(6,199,85,.4);}
.ranking__note{margin:24px 2px 0;font-size:12px;color:var(--muted);}

/* ===== News (新着記事一覧) ===== */
.news{max-width:var(--maxw);margin:0 auto;padding:24px 24px 80px;}
.news__head{text-align:center;margin-bottom:40px;}
.news__eyebrow{
  margin:0;font-size:13px;font-weight:800;letter-spacing:3px;color:var(--blue);
}
.news__title{
  margin:6px 0 10px;font-size:30px;font-weight:800;color:var(--navy);
  position:relative;display:inline-block;
}
.news__title::after{
  content:"";display:block;width:56px;height:4px;border-radius:2px;
  background:linear-gradient(90deg,var(--blue),var(--yellow));
  margin:12px auto 0;
}
.news__lead{margin:0;font-size:14px;color:var(--muted);}

.news-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.news-card{
  background:#fff;border-radius:16px;overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 6px 24px rgba(0,40,120,.07);
  transition:transform .2s,box-shadow .2s;
}
.news-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,40,120,.14);}
.news-card__link{display:block;height:100%;}
.news-card__thumb{
  position:relative;height:150px;
  display:flex;align-items:flex-end;padding:14px;
}
.news-card__thumb--c1{background:linear-gradient(135deg,#5b8def,#0052cc);}
.news-card__thumb--c2{background:linear-gradient(135deg,#36c5d6,#0a8aa8);}
.news-card__thumb--c3{background:linear-gradient(135deg,#7ac77a,#2e9e54);}
.news-card__thumb--c4{background:linear-gradient(135deg,#f5a85b,#e07a2e);}
.news-card__thumb--c5{background:linear-gradient(135deg,#b07ad6,#7a3ec7);}
.news-card__thumb--c6{background:linear-gradient(135deg,#5b6b8f,#2a3a66);}
.news-card__cat{
  background:rgba(255,255,255,.92);color:var(--navy);
  font-size:12px;font-weight:800;border-radius:999px;padding:5px 14px;
}
.news-card__body{padding:18px 20px 22px;}
.news-card__date{font-size:12px;color:var(--blue);font-weight:700;}
.news-card__title{
  margin:8px 0 10px;font-size:16px;font-weight:800;color:var(--navy);
  line-height:1.5;
}
.news-card__excerpt{margin:0;font-size:13px;color:var(--muted);line-height:1.7;}
.news__note{margin:28px 2px 0;font-size:12px;color:var(--muted);text-align:center;}

/* ===== Footer ===== */
.footer{background:linear-gradient(160deg,#0a4bb5,#0a2e7a);color:#fff;}
.footer__inner{max-width:var(--maxw);margin:0 auto;padding:48px 24px;text-align:center;}
.footer__brand{font-size:24px;font-weight:800;margin:0;letter-spacing:1px;}
.footer__tag{margin:6px 0 22px;font-size:13px;opacity:.85;}
.footer__nav{display:flex;justify-content:center;gap:28px;flex-wrap:wrap;font-size:14px;font-weight:600;margin-bottom:22px;}
.footer__nav a{opacity:.9;}
.footer__nav a:hover{opacity:1;text-decoration:underline;}
.footer__copy{margin:0;font-size:12px;opacity:.7;}

/* ===== Floating banner ===== */
.floating{
  position:fixed;right:18px;bottom:18px;z-index:90;
  width:400px;
  filter:drop-shadow(0 8px 20px rgba(0,20,80,.28));
  transition:transform .2s;
  animation:floatY 2.4s ease-in-out infinite;
}
.floating:hover{transform:translateY(-3px) scale(1.03);}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}

/* ===== Responsive (<=768px) ===== */
@media (max-width:768px){
  .header__inner{padding:12px 16px;}
  .header__logo img{height:30px;}

  /* hamburger */
  .nav-burger{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    width:46px;height:42px;cursor:pointer;color:var(--blue-dark);
  }
  .nav-burger span{display:block;width:26px;height:3px;background:var(--blue-dark);border-radius:2px;transition:.3s;}
  .nav-burger em{font-size:9px;font-style:normal;font-weight:700;letter-spacing:1px;}
  .nav{
    position:fixed;top:0;right:-100%;
    width:74%;max-width:320px;height:100vh;
    background:#fff;flex-direction:column;gap:0;
    padding:80px 28px;z-index:120;
    box-shadow:-8px 0 30px rgba(0,20,80,.18);
    transition:right .3s ease;
  }
  .nav a{padding:18px 0;border-bottom:1px solid var(--line);font-size:16px;}
  .nav-overlay{
    display:none;position:fixed;inset:0;background:rgba(10,20,60,.4);z-index:110;
  }
  .nav-toggle:checked ~ .nav{right:0;}
  .nav-toggle:checked ~ .nav-overlay{display:block;}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(8px) rotate(45deg);}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0;}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

  /* hero: copy stacked on top */
  .hero__copy{
    top:4%;left:50%;transform:translateX(-50%);
    width:78%;max-width:none;
  }

  /* bio: stack */
  .bio{padding:40px 16px;}
  .bio__card{flex-direction:column;gap:28px;padding:32px 22px;}
  .bio__profile{flex:none;width:100%;}
  .bio__avatar{width:160px;height:160px;}
  .bio__name{font-size:30px;}
  .bio__intro{border-left:none;border-top:1px solid var(--line);padding-left:0;padding-top:28px;}
  .bio__intro-head{font-size:22px;}
  .bio__intro p{font-size:14px;}
  /* スマホは改行を詰めて自然な折り返しに */
  .bio__intro p br{display:none;}
  .bio__closing br,.bio__strong br{display:inline;}

  /* ranking */
  .ranking{padding:44px 16px 64px;}
  .ranking__head img{max-width:100%;}
  .rank-card{flex-direction:column;}
  .rank-card__badge{flex:none;flex-direction:row;gap:6px;padding:8px 0;width:100%;}
  .rank-card__num{font-size:26px;}
  .rank-card__label{margin-top:0;}
  .rank-card__action{flex:none;border-left:none;border-top:1px dashed var(--line);width:100%;flex-direction:row;justify-content:space-between;align-items:center;}
  .rank-card__price{text-align:left;}
  .rank-card__btn{flex:0 0 auto;padding:12px 22px;}

  /* news */
  .news{padding:16px 16px 56px;}
  .news__title{font-size:24px;}
  .news-list{grid-template-columns:1fr;gap:18px;}
  .news-card__thumb{height:128px;}

  /* floating smaller (SPで下部ツールバー/セーフエリアに隠れないよう底上げ＋前面化) */
  .floating{width:296px;right:10px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:130;}
}

/* ===== Tablet (769px〜1024px) ===== */
@media (min-width:769px) and (max-width:1024px){
  .news-list{grid-template-columns:repeat(2,1fr);}
}
