bootstrap 4
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>
<div class="accordion" id="accordion-0">
<div class="card vmm-level-0">
<div class="card-header" id="heading-e958e05a79134f62b8052cffa57ac5c5">
<h2 class="accordion-header vmm-entry">
<button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapse-e958e05a79134f62b8052cffa57ac5c5" aria-expanded="true" aria-controls="collapse-e958e05a79134f62b8052cffa57ac5c5">
<span itemprop="name">Menu 1</span>
</button>
</h2>
</div>
<div id="collapse-e958e05a79134f62b8052cffa57ac5c5" class="collapse show" aria-labelledby="heading-e958e05a79134f62b8052cffa57ac5c5" data-parent="#accordion-0" style="">
<div class="card-body">
<span itemprop="name">Menu 1-1</span>
</div>
</div>
</div>
<div class="card vmm-level-0">
<div class="card-header" id="heading-60e531f3f27c4247808d4fe46df1ef06">
<h2 class="accordion-header vmm-entry">
<button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapse-60e531f3f27c4247808d4fe46df1ef06" aria-expanded="true" aria-controls="collapse-60e531f3f27c4247808d4fe46df1ef06">
<span itemprop="name">Menu-2</span>
</button>
...
CSS
.container {
margin-top: 20px;
margin-bottom: 20px;
}