.banner-section{
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1760px;
    margin: 0 auto;
    overflow: hidden;
    aspect-ratio: 1760 / 525
}

.banner-content{
    position: relative;
    width: 100%;
    height: 100%
}

.banner-nav{
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
    pointer-events: none;
    z-index: 3
}

.nav-arrow{
    background: #ffffff4d;
    border: none;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    cursor: pointer;
    pointer-events: all;
    transition: background .3s;
    display: flex;
    align-items: center;
    justify-content: center
}

.nav-arrow[data-v-97ba678f]:hover {
    background: #ffffff80
}

.arrow-icon{
    width: 20px;
    filter: brightness(0) invert(1)
}

.nav-arrow-right .arrow-icon{
    transform: rotate(180deg)
}

.banner-images{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.banner-image{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity .8s ease-in-out;
    cursor: pointer;
    z-index: 1
}

.banner-image.active{
    opacity: 1;
    z-index: 10
}

.banner-indicators{
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%);
    display: flex;
    gap: 8px;
    z-index: 3
}

.indicator{
    width: 30px;
    height: 12px;
    border-radius: 6px;
    background: #fff6;
    cursor: pointer;
    transition: background .3s
}

.indicator.active{
    width: 60px;
    background: #fff
}

.indicator[data-v-97ba678f]:hover {
    background: #ffffffb3
}

@media (max-width: 1760px) {
    .banner-section{
        width:100%;
        max-width: 100vw
    }
}

@media (max-width: 1300px) {
    .banner-section{
        width:100%
    }
}

@media (max-width: 768px) {
    .banner-section{
        min-width:100vw;
        width: 100vw;
        aspect-ratio: 1760 / 525
    }

    .banner-nav{
        display: none
    }

    .banner-indicators{
        bottom: 20px
    }
}