/* 電話をかける校舎を選ぶシート（js/main.js が組み立てる）
   style.css を読まない LP（lp フォルダの各ページ）でも使うので、独立したファイルにしている。
   色は読み込み先ページの :root 変数を使う（--navy --brand-blue --brand-green --line --muted --bg）。 */
.tel-sheet{position:fixed;inset:0;z-index:200;display:none}
.tel-sheet.is-open{display:block}
.tel-sheet .veil{position:absolute;inset:0;background:rgba(10,22,45,.55);
  opacity:0;transition:opacity .24s ease}
.tel-sheet.is-open .veil{opacity:1}
.tel-sheet .panel{position:absolute;left:0;right:0;bottom:0;
  max-height:88vh;overflow-y:auto;background:var(--bg);
  border-radius:18px 18px 0 0;padding:22px 18px calc(20px + env(safe-area-inset-bottom));
  transform:translateY(100%);transition:transform .28s cubic-bezier(.16,.84,.3,1)}
.tel-sheet.is-open .panel{transform:translateY(0)}
@media (min-width:701px){
  .tel-sheet .panel{left:50%;right:auto;bottom:auto;top:50%;width:min(460px,92vw);
    transform:translate(-50%,-46%) scale(.98);border-radius:16px;opacity:0;
    transition:transform .24s ease,opacity .24s ease}
  .tel-sheet.is-open .panel{transform:translate(-50%,-50%) scale(1);opacity:1}
}
.tel-sheet .grip{width:38px;height:4px;border-radius:4px;background:var(--line);margin:0 auto 16px}
@media (min-width:701px){.tel-sheet .grip{display:none}}
.tel-sheet h2{font-family:'Shippori Mincho','Hiragino Mincho ProN','Yu Mincho',YuMincho,serif;
  font-size:18px;font-weight:700;color:var(--navy);text-align:center;line-height:1.6;margin-bottom:18px}
.tel-sheet .item{display:flex;align-items:center;gap:12px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-md,4px);padding:14px 16px;margin-bottom:10px}
.tel-sheet .item .body{flex:1;min-width:0}
.tel-sheet .item .k{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.06em;
  border-radius:100px;padding:2px 9px}
.tel-sheet .item.blue .k{color:var(--brand-blue);border:1px solid var(--brand-blue)}
.tel-sheet .item.green .k{color:var(--brand-green);border:1px solid var(--brand-green)}
.tel-sheet .item .n{font-size:12.5px;font-weight:700;color:var(--muted);line-height:1.4;margin-left:8px}
.tel-sheet .item .t{display:block;font-family:'Shippori Mincho','Hiragino Mincho ProN','Yu Mincho',YuMincho,serif;
  font-size:22px;font-weight:700;color:var(--navy);letter-spacing:.01em;line-height:1.25}
.tel-sheet .item .go{flex:none;display:grid;place-items:center;width:42px;height:42px;
  border-radius:50%;background:var(--navy);color:#fff}
.tel-sheet .item .go .ic{width:19px;height:19px}
.tel-sheet .hours{font-size:12px;color:var(--muted);text-align:center;margin:14px 0 16px;line-height:1.8}
.tel-sheet .close{display:block;width:100%;background:none;border:1px solid var(--line);
  border-radius:100px;padding:13px;font-size:14px;font-weight:800;color:var(--muted);cursor:pointer}
@media (hover:hover){
  .tel-sheet .item:hover{border-color:var(--navy);box-shadow:0 6px 18px rgba(21,42,82,.1)}
  .tel-sheet .close:hover{background:#fff;color:var(--navy)}
}
@media (prefers-reduced-motion:reduce){
  .tel-sheet .veil,.tel-sheet .panel{transition:none}
}
