Linearize cards in bootstrap 4

I have this code to show my layout, I have tried many combinations but with none I can align them:

 <div class="col col-sm-2 col-md-2">
    </div>
<div class="row">
    <div class="col col-sm-2 col-md-2">
    </div>
    <div class="col col-sm-8 col-md-8">
        <div class="card-columns">
            @foreach($asesorias as $asesoria)
            <div class="card" style="width: 18rem;height:100%">
                <img class="card-img-top" src="/adminlte/img/user4-128x128.jpg" alt="Foto perfil asesor">
                <div class="card-body">
                    <h5 class="card-title">{{ $asesoria->place }}</h5>
                    <p class="card-text">
                        <strong>Comunidad: </strong>{{ $asesoria->comunidad_id }}<br>
                        <strong>Provincia: </strong>{{ $asesoria->provincia_id }}<br>
                        <strong>Municipio:</strong>{{ $asesoria->municipio_id }}<br>
                        <strong>Lugar: </strong>{{ $asesoria->place }}<br>
                        <strong>Fecha: </strong>{{ $asesoria->date }}<br>
                        <strong>Hora: </strong>{{ $asesoria->time }}<br>
                        <br>
                    </p>

                </div>
                <div class="text-center"
                    style="position: absolute;bottom: 0;left:0;right:0;margin-left:auto;margin-right:auto;">
                    <a href="#" class="btn btn-primary">Reservar</a>
                </div>
            </div>

            @endforeach
        </div>
    </div>
    <div class="col col-sm-2 col-md-2">
    </div>
</div>

but the result view is this:

Cards are not align because content is diferent in each one.

.card-columns {
    column-count:3;
 }

How could I linearize them?

I have changed by

card-deck

but now I ask me, if I want only 4 columns in my view, how doing it?