@media screen で　max-width を指定してモバイル用とデスクトップ向けにCSSを切り替えるように書いたが、
iPhoneで確認しても変わらず、なんでやー！ と叫んでいた。

久しぶりにサイトを作成していたせいで、meta に viewport を追加しわすれていただけだったようだ。
head内に

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">

を追加して解決。