/* mainSection2.css */
.banner-section {
    width: 100%;
    overflow: hidden;
    padding-bottom: 100px;
}

.banner-inner {
    height: 300px;
    border-radius: 10px;
}

.banner-img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    display: block;
}

/* ============================================================
   TABLET  769px ~ 1024px
   ============================================================ */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .banner-section {
        padding-bottom: 70px;
    }

    .banner-inner {
        height: 220px;
        padding: 32px 20px;
    }
}


/* ============================================================
   MOBILE  ~ 768px
   ============================================================ */
@media screen and (max-width: 768px) {
    .banner-section {
        padding-bottom: 48px;
    }

    .banner-inner {
        height: 160px;
        padding: 16px;
    }
}


/* ============================================================
   SMALL MOBILE  ~ 480px
   ============================================================ */
@media screen and (max-width: 480px) {
    .banner-section {
        padding-bottom: 36px;
    }

    .banner-inner {
        height: 120px;
        padding: 12px;
    }
}