How to fix switching .active and .show classes in Bootstrap?

Question

css

Good afternoon.
Please help me fix the problem with switching the list https://jsfiddle.net/kadikey58/48ky2m0n/
As you can see, when switching tabs, the .active and .show classes are added, but not removed from the active ones.
But as soon as you pull these tabs out of the carousel, it immediately works as it should.

Answer 1

The answer turned out to be simple - it's better to swap the carousel and tabs. That is, make two .list-tab.list-group blocks inside each .carousel-item