Проблема со слайдером slick для моб устройств

https://slavkevich.github.io/kraken_boost/ есть такая верстка ИМ, в нем есть dropdown menu http://joxi.ru/krDBzDgTgjVBY2, в нем в мобильной версии карточки товара делаются слайдером с помощью slick slider. Вот такой скрипт.

$('.header-bottom-subnav__cards').slick({
    settings: 'unslick',
    arrows: false,
    dots: false,
    infinite: false,
    slidesToShow: 4,
    slidesToScroll: 4,
    responsive: [{
        breakpoint: 1401,
        settings: {
            slidesToShow: 3,
            slidesToScroll: 1,
            touchThreshold: 300,
        }
    } , {
        breakpoint: 1130,
        settings: {
            slidesToShow: 2,
            slidesToScroll: 2,
        }
    } , {
        breakpoint: 991,
        settings: {
            slidesToShow: 2,
            slidesToScroll: 1,
        }
    } , {
        breakpoint: 768,
        settings: {
            slidesToShow: 2,
            slidesToScroll: 1,
            touchThreshold: 700,
            variableWidth: true,
        }
    } , {
        breakpoint: 480,
        settings: {
            slidesToShow: 1,
            slidesToScroll: 1,
            touchThreshold: 700,
            variableWidth: true,

        }
    }
]
}); 

Проблема начинается при маленьких экранах < 480. Последний слайд проскролливает и становится в такую позицию http://joxi.ru/5mdLgM1Uaz8XGm А дизайном необходимо вот так http://joxi.ru/RmzGEkBijeMoZ2. как такого добиться, спасибо!


Ответы (0 шт):