.swiper-pagination-bullet-active {
    background: #FFD027;
}

.swiper-slide {
    position: relative;
}

.swiper-nav-button {
    width: 32px;
    height: 32px;
    color: #5d5d5d;
    text-align: center;
    border-radius: 50%;
}

.swiper-nav-button:hover {
    background-color: transparent;
}

.swiper-button-prev:after,
.swiper-button-next:after {
    content: '';
    display: none;
}

.swiper-nav-button .inno-icon {
    font-size: 1.75rem;
}

.swiper-nav-button.triangle {
    width: 12px;
    height: 26px;
    color: #fff;
    background-color: rgba(0, 0, 0, .4);
    border-radius: 2px;
    transition: background-color .3s;
}

.swiper-nav-button.triangle .inno-icon {
    font-size: 1rem;
    transform: scale(0.4);
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right {
    background: rgba(255, 255, 255, 0.8);
}

@media (max-width: 991px) {
    .swiper-nav-button.triangle {
        display: none;
    }
}

@media (min-width: 992px) {
    .swiper-nav-button {
        width: 64px;
        height: 64px;
    }

    .swiper-nav-button.triangle {
        top: calc(50% - 1.5rem);
        width: 46px;
        height: 46px;
        color: #FFD027;
        background-color: transparent;
    }

    .swiper-nav-button.triangle .inno-icon {
        font-size: 1.25rem;
        transform: scale(1);
    }

    .swiper-nav-button.triangle.swiper-button-prev {
        left: -1rem;
    }

    .swiper-nav-button.triangle.swiper-button-next {
        right: -1rem;
    }
}
