Center vertically a display: inline-block in a container next to an image

Question

I want to center these div that are with display in line block

My code is this:

.img_first,
.text_desc {
    display: inline-block;
    vertical-align: middle;
    background-color: blueviolet;
}

.primera_seccion {
    width: 100%;
    height: 500px;
    background-color: aqua;

}

.primera_seccion .first img {
    width: 500px;
    margin-left: 200px;
}

.text_desc {
    width: 500px;
    margin-left: 200px;
}

<section class="primera_section">
    <div class="first">
        <div class="img_first"><img src="img/imagen1.jpg" alt=""></div>
            <div class="text_desc">
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium
                laboriosam doloremque voluptatum molestias aliquam nemo ea, expedita excepturi quam commodi, odio
                dolor, vero facere? Magnam officia deleniti corporis reiciendis dolor.
                Officiis soluta illo molestias eveniet accusantium laboriosam facere. Ex accusamus culpa id nesciunt
                atque fugit, odio alias totam dignissimos, ducimus qui quod deserunt ad consectetur, voluptate esse
                quaerat ipsa iure!
                Vel sint nisi corporis id numquam esse, assumenda corrupti cupiditate mollitia nostrum dolorum in
                laudantium sapiente! Nesciunt itaque suscipit, hic soluta reiciendis quaerat eveniet adipisci, magni
                iste numquam minus a!
            </div>
        <div class="boton_desc"></div>
    </div>
</section>

And I got this in my web:

How can I do to center in vertical without removing display:inline-block

Answer 1

Solution add to .primera_seccion:

.primera_seccion{
   display: flex;
   align-items: center;
}