.banner-swiper .swiper-slide {
    width: 100% !important;
    max-width: 1200px;
}

.banner-slide img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 768px) {
    .banner-slide img {
        height: 120px;
    }
}
Bunu dene olmazsa responsive resime geçersin

[
<picture>
    <source media="(max-width: 768px)" srcset="banner-mobile.jpg">
    <source media="(max-width: 1024px)" srcset="banner-tablet.jpg">
    <img src="banner-desktop.jpg" alt="Banner" class="img-fluid">
</picture>
  • Desktop: 1200x200px (mevcut)
  • Tablet: 768x150px
  • Mobile: 480x100px