Problème flexbox

Bonjour,

J'ai un petit soucis avec ma flexbox. En effet elle recouvre le contenu de la div suivante.

Le code HTML

<aside id="modal5" class="modal" role="article" aria-modal="false" style="display:none;">
    <div class="modal-wrapper js-modal-stop">
        <span class="js-modal-close modal-closebtn">&times;</span>
        <h1 id="title-modal">Service Informatique</h1>

            <div class="service-photo">
                <img src="./img/photo-ph.jpg" alt="" class="service-img">
                <img src="./img/photo-ph.jpg" alt="" class="service-img">
                <img src="./img/photo-ph.jpg" alt="" class="service-img">
            </div>
            <div class="service-content">
                Lorem ipsum dolor, sit amet consectetur adipisicing elit. Laudantium non consequatur hic repudiandae a quod tempore sint eaque quidem dolorem! Consectetur velit explicabo maiores eius dolorem, voluptatibus ipsam tempore necessitatibus!
            </div>

    </div>
</aside>

Le code CSS

.modal-container{

}

.service-photo{
    position: fixed;
    display: flex;
}

.service-img{
    height: 90px;
    width: 90px;  
    border: solid 3px black;
    padding: 5px;
}

.service-img{
    margin-right: 5px;
}

.service-content{

    border-top: solid 3px black;
}

Le résultat

Voici une image du résultat:
https://ibb.co/HDpBzVK

Merci d'avance pour votre aide