ここ数年の間にHTML/CSS の進歩が著しくてフォローアップが大変ですが、そのぶん以前より実装の手間やカスタマイズが楽になったと思えばここが苦労のしどころだと思います。

今回はフレックスボックスの使い方をおさらい。
仕様の変化を繰り返してきたため検索しても古い情報にたどりつきがちです。更新日付をチェックしつつ、必要な情報を探しまわることに。

特にベンダープレフィックスの確認が面倒でした。いくつかの参考ページ。(古い方から経緯を追って)
http://www.webcreativepark.net/css/flexible-box/display-flex/
https://irec.jp/web-create/html5css3/flexbox-browser/

使い方の解説がわかりやすかったのは以下。ただし、当時のモダンブラウザのみ対応という方針で、ベンダープレフィックスについては別途調べる必要がありました。
https://mamewaza.com/support/blog/howto-use-flex.html

以下は最近の更新があった記事。
https://www.kerenor.jp/css3-flexbox-property/
http://honttoni.blog74.fc2.com/blog-entry-268.html

RWD用のCSSを含めて微調整して出来上がり!

いまのところ自分の持つデバイスでは不具合なく仕上がったのですが、もしも不具合が見られる方は仕様デバイスとOSバージョンとブラウザバージョンを教えていただけると幸いです。