silck slider 슬릭 슬라이더 질문드립니당

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/>

 

<link rel="stylesheet" href="<?php echo G5_THEME_CSS_URL; ?>/mainStyle.css">

<link rel="stylesheet" href="<?php echo G5_THEME_CSS_URL; ?>/common/common.css">

<link rel="stylesheet" href="<?php echo run_replace('head_css_url', G5_THEME_CSS_URL.'/style.css?ver='.G5_CSS_VER, G5_THEME_URL); ?>">

<link rel="stylesheet" href="<?php echo run_replace('head_css_url', G5_THEME_CSS_URL.'/layout.css?ver='.G5_CSS_VER, G5_THEME_URL); ?>">

<link rel="stylesheet" href="<?php echo run_replace('head_css_url', G5_THEME_CSS_URL.'/contents.css?ver='.G5_CSS_VER, G5_THEME_URL); ?>">

<link rel="stylesheet" href="<?php echo run_replace('head_css_url', G5_THEME_CSS_URL.'/animate.css?ver='.G5_CSS_VER, G5_THEME_URL); ?>">

<link rel="stylesheet" href="<?php echo run_replace('head_css_url', G5_THEME_CSS_URL.'/swiper-bundle.min.css?ver='.G5_CSS_VER, G5_THEME_URL); ?>">

 

<script type="text/javascript" src="<?php echo run_replace('head_js_url', G5_THEME_JS_URL.'/jquery-1.11.2.min.js?ver='.G5_JS_VER, G5_THEME_URL); ?>"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js"></script>

<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>

 

<script type="text/javascript" src="<?php echo run_replace('head_js_url', G5_THEME_JS_URL.'/jquery.waypoints.min.js?ver='.G5_JS_VER, G5_THEME_URL); ?>"></script>

<script type="text/javascript" src="<?php echo run_replace('head_js_url', G5_THEME_JS_URL.'/jquery.counterup.min.js?ver='.G5_JS_VER, G5_THEME_URL); ?>"></script>

<script type="text/javascript" src="<?php echo run_replace('head_js_url', G5_THEME_JS_URL.'/main.js?ver='.G5_JS_VER, G5_THEME_URL); ?>"></script>

<script type="text/javascript" src="<?php echo run_replace('head_js_url', G5_THEME_JS_URL.'/swiper.min.js?ver='.G5_JS_VER, G5_THEME_URL); ?>"></script>

<div class="aboutWrap page">

<div class="box inner">

<div class="main_title">

<h2 class="wow fadeInDown" data-wow-delay="0.3s">전저리 여과설비, 순수 및 초순수설비, 재이용 설비, 폐수처리 설비</h2>

<p class="wow fadeInDown" data-wow-delay="0.4s">전문적이고 다양한 기술능력 보유</p>

</div>

<div class="post-slider">

<i class="fas fa-chevron-left prev"></i>

<i class="fas fa-chevron-right next"></i>

<div class="post-wrapper">

<a href="#" class="post">1<br/><span></span></a>

<a href="#" class="post">2<br/><span></span></a>

<a href="#" class="post">3<br/><span></span></a>

<a href="#" class="post">4<br/><span></span></a>

<a href="#" class="post">5<br/><span></span></a>

<a href="#" class="post">6<br/><span></span></a>

<a href="#" class="post">1<br/><span></span></a>

<a href="#" class="post">1<br/><span></span></a>

<a href="#" class="post">1<br/><span></span></a>

</div>

</div>

</div>

</div>

.post-slider{

width:70%;

margin:0px auto;

position:relative;

}

.post-slider .post-wrapper{

width:84%;

height:350px;

margin:0px auto;

overflow: hidden;

padding:10px 0px 10px 0px;

}

.post-slider .post-wrapper .post{

width:300px;

height:200px;

display:inline-block;

background:gray;text-align: center;

background-color: #cccccc;

margin-right: 46px;

}

.post-slider .next{

position:absolute;

top:60%;

right:30px;

font-size:2em;

color:gray;

cursor: pointer;

}

.post-slider .prev{

position:absolute;

top:60%;

left:30px;

font-size:2em;

color:gray;

cursor: pointer;

}

<script>

$('.post-wrapper').slick({

slidesToShow:4,

slidesToScroll: 4,

autoplay: false,

autoplaySpeed: 2000,

nextArrow:$('.next'),

prevArrow:$('.prev'),

});

</script>