/*
 * スマホの見た目の、幅 481〜767px で写真だけを直す（2026-11-01）。協業タスク「タブレット幅のレイアウトを作る」。
 * スマホの CSS は写真の高さを固定している（カードは 120〜144px、個別ページの上は 200px）。
 * そのまま幅 700px に広げると、細長く切れて何の写真か分からなくなるので、縦横比を保つ。
 * 読み込みは v6/footer-css-768.html（media で幅を限っている）。幅 480px 以下には効かない。
 */

/* 一覧・プリスクール TOP・親子留学 TOP の学校カード */
main > div > section > section.ps > a,
main > div > section > section.sa > a,
main > div > section > section.hp > a,
main > div > section > section.oe > a { display: block; width: 100%; height: auto; }
/* スマホの CSS の高さは div[style] に付いているので、[style] を付けないとそちらが勝つ */
main > div > section > section.ps > a > div[style],
main > div > section > section.sa > a > div[style],
main > div > section > section.hp > a > div[style],
main > div > section > section.oe > a > div[style],
main > div > section > section.ps > a > div,
main > div > section > section.sa > a > div,
main > div > section > section.hp > a > div,
main > div > section > section.oe > a > div { width: 100%; height: auto; max-height: 320px; aspect-ratio: 2 / 1; }

/* 個別ページの上の写真 */
body > header > div.og-image { height: auto; aspect-ratio: 12 / 5; }
