position: stickyが追尾してくれません

Question

前提・実現したいこと

サイドメニューを一塊にして追尾させたいです。
理想は、５つのメニュー項目があるとしたら、その５つを全て表示したままスクロールしてフッターまで来たら順々に消えてほしいのですが、現状はスクロールを始めてすぐ、一番上のメニューから順々に消えていってしまいます。

該当のソースコード

こちらで見ていただけます→CodePen

右側にメインメニューがあるのですが、CodePenに記入してもdisplay: flex; にできなかったため削除してあります。
本当はアコーディオンメニューとして開くのですが、そちらも機能していません。

試したこと

height:100%や300%をいろいろな箇所に入れてみたのですが変化がありませんでした。

粗雑なコードで申し訳ありませんが、ご教授いただけますと幸いです。
質問に不足事項があれば教えて頂きたいです。
宜しくお願い致します。