フレックスコンテナ内のアイテムの配置方向を指定するプロパティです。row（横並び）、column（縦並び）、row-reverse、column-reverseの値があり、レスポンシブデザインでの方向切り替えに便利です。
flex-direction: row | row-reverse | column | column-reverse.element {
flex-direction: row;
}flex-direction: row;横方向（左から右）に配置（デフォルト）
flex-direction: column;縦方向（上から下）に配置
レスポンシブデザインでは、画面サイズに応じてrowとcolumnを切り替えることが多い。
親要素にdisplay: flexを指定し忘れると効果がない。
IE11+, 全モダンブラウザ