$(document).ready(function(){
            

    $('.slider-for').slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        arrows: false,
        fade: true,
        asNavFor: '.slider-nav'
      });
      $('.slider-nav').slick({
        slidesToShow: 3,
        slidesToScroll: 1,
        asNavFor: '.slider-for',
        centerMode: true,
        focusOnSelect: true,

        responsive: [ // 반응형 웹 구현 옵션
            {  
                breakpoint: 960, //화면 사이즈 960px
                settings: {
                    slidesToShow:3 
                } 
            },
            { 
                breakpoint: 768, 
                settings: {	
                    slidesToShow:2 
                } 
            },
            { 
                breakpoint: 480,
                settings: {	
                    slidesToShow:1
                } 
            }





        ]
      });
            

});