$(function(){
	$('.box_bnr').slick({
		autoplay: true,
		infinite: true,
		slidesToShow: 1,
		centerMode: true,
		variableWidth: true,
		autoplaySpeed: 4000,
		speed: 1000,
		dots: true,
		zIndex: 0,
		prevArrow: '<p class="slick-prev"></p>',
		nextArrow: '<p class="slick-next"></p>',
	});

	$('.box_top_slider').slick({
		fade: true,
		autoplay: true,
		autoplaySpeed: 4000,
		speed: 2000,
		pauseOnFocus: false,
		pauseOnHover: false,
		dots: false,
		arrows: false,
		prevArrow: '<p class="slick-prev"></p>',
		nextArrow: '<p class="slick-next"></p>'
	});

	if($('.js-slider').length) {
		$('.js-slider').slick({
			infinite: true,
			slidesToShow: 1,
			slidesToScroll: 1,
			autoplay: true,
			autoplaySpeed: 4000,
			speed: 1000,
			fade: true,
			dots: false,
			arrows: false,
			pauseOnHover: false,
			pauseOnFocus: false
		});
	}
	$('.js-dots li').on('click', function (index) {
		$dots = $(this).parent();
		$slider = $(this).parents('.js-wrp').find('.js-slider');
		var indexx = $dots.find('li').index(this);
		$(this).addClass('dots_active').siblings().removeClass('dots_active');
		$slider.slick('slickGoTo', indexx);
	});
	$('.js-slider').on('afterChange', function(event, slick, currentSlide){
		$dots = $(this).parents('.js-wrp').find('.js-dots');
		$dots.find('li').eq(currentSlide).addClass('dots_active').siblings().removeClass('dots_active');
	});
});