.left-curvebox {
    width: 165px;
    height: 165px;
    position: absolute;
    background: url(/siteassets/img/img-56x65-left-curvebox.png) no-repeat;
    background-size: contain;
    left: -163px;
    bottom: 167px;
    z-index: 0;
}

 .right-curvebox {
    width: 114px;
    height: 114px;
    position: absolute;
    background: url(/siteassets/img/img-56x65-left-curvebox.png) no-repeat;
    background-size: contain;
    right: -69px;
    bottom: 37px;
    z-index: 0;
}

 .center-curvebox {
    width: 114px;
    height: 114px;
    position: absolute;
    background: url(/siteassets/img/img-56x65-mid-curvebox.png) no-repeat;
    background-size: contain;
    right: 177px;
    bottom: 37px;
    z-index: 0;
}

 .scroll-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    height: 519px;
}

     .scroll-wrapper .indicator-wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }

         .scroll-wrapper .indicator-wrapper .indicator {
            height: 8px;
            border-radius: 200px;
            background: rgba(255, 255, 255, 0.3);
            width: 24px;
            margin-right: 9px;
        }

             .scroll-wrapper .indicator-wrapper .indicator:last-child {
                margin-right: 0;
            }

             .scroll-wrapper .indicator-wrapper .indicator.active {
                background: #fff;
                width: 68px;
            }

     .scroll-wrapper.show {
        opacity: 1;
    }

     .scroll-wrapper .scroll-inner-wrapper {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        right: 0;
    }

         .scroll-wrapper .scroll-inner-wrapper .item {
            height: 114px;
            width: 114px;
            position: absolute;
            left: 1140px;
            top: 245px;
            -webkit-transition: all 0.5s ease;
            transition: all 0.5s ease;
            display: none;
            overflow: hidden;
        }

             .scroll-wrapper .scroll-inner-wrapper .item img {
                max-height: 100%;
                max-width: 100%;
            }

             .scroll-wrapper .scroll-inner-wrapper .item p {
                display: none;
                margin: 0;
                text-align: center;
                position: absolute;
                bottom: 45px;
                font-size: 48px;
                font-weight: 700;
                color: #FFF;
                left: 0;
                right: 0;
            }

             .scroll-wrapper .scroll-inner-wrapper .item.prev-1 {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                font-size: 32px;
                font-weight: bold;
                color: #FFF;
                height: 237px;
                width: 237px;
                left: 133px;
                top: 238px;
                opacity: 0.3;
            }

             .scroll-wrapper .scroll-inner-wrapper .item.next-1 {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                font-size: 32px;
                font-weight: bold;
                color: #FFF;
                height: 237px;
                width: 237px;
                left: 895px;
                top: 0;
                opacity: 0.35;
            }

             .scroll-wrapper .scroll-inner-wrapper .item.prev-2 {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                font-size: 32px;
                font-weight: bold;
                color: #FFF;
                height: 114px;
                width: 114px;
                left: 0;
                top: 361px;
                opacity: 0.2;
            }

             .scroll-wrapper .scroll-inner-wrapper .item.next-2 {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                font-size: 32px;
                font-weight: bold;
                color: #FFF;
                height: 114px;
                width: 114px;
                left: 1140px;
                top: 245px;
                opacity: 0.31;
            }

             .scroll-wrapper .scroll-inner-wrapper .item.active {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                font-size: 32px;
                font-weight: bold;
                color: #FFF;
                height: 475px;
                width: 475px;
                left: 395px;
                top: 0;
            }

                 .scroll-wrapper .scroll-inner-wrapper .item.active p {
                    display: block;
                }

                 .scroll-wrapper .scroll-inner-wrapper .item.active + div {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                }


.prev-btn {
    content: "";
    background-image: url(/siteassets/img/img-25x25-prev-btn.webp);
    background-repeat: no-repeat;
    width: 48px;
    height: 48px;
}
    


     .btn:hover {
        background: none;
        color: #FFF;
    }

.next-btn {
    content: "";
    background-image: url(/siteassets/img/img-25x25-next-btn.webp);
    background-repeat: no-repeat;
    width: 48px;
    height: 48px;
    left: 967px;
}

 .btn.inactive {
    pointer-events: none;
}