display: none / visibility: hidden не анимируются... у них только два состояния - или видно, или не видно) Надо вообще не трогать родительский блок, а внутренним блокам дать height: 0; overflow: hidden; transition: какой-то.
https://jsfiddle.net/OPTlMUS/06gwa1me/