// javascript document
$(document).ready(function() {
    
	var w=window.innerwidth || document.documentelement.clientwidth || document.body.clientwidth;
    var h=window.innerheight || document.documentelement.clientheight || document.body.clientheight;
	
	var indexprow=$(".about3 .box").width();
	
	var indexprol=$(".about3 .box ul li").length;
	$(".about3 .box  ul li").css({"width":indexprow/3});
	if($(window).width()<767){
		$(".about3 .box  ul li").css({"width":indexprow});
		}
	$(".about3 .box  ul").css({"width":indexprow*indexprol,"margin-left":-indexprow});
	$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
	$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
	$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
	
	function indexproleft(){
		$(".about3 .box  ul").animate({"margin-left":0},500,function(){
			$(".about3 .box  ul").css({"margin-left":-indexprow});
			$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
			$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
			$(".about3 .box  ul li").first().before($(".about3 .box  ul li").last());
			});
		}
	function indexproright(){
		$(".about3 .box  ul").animate({"margin-left":-2*indexprow},500,function(){
			$(".about3 .box  ul").css({"margin-left":-indexprow});
			$(".about3 .box  ul li").last().after($(".about3 .box  ul li").first());
			$(".about3 .box  ul li").last().after($(".about3 .box  ul li").first());
			$(".about3 .box  ul li").last().after($(".about3 .box  ul li").first());
			});
		}
	$(".about3 .box  ul").hammer().on("swiperight",function(){
		indexproleft();
		});
	$(".about3 .box  ul").hammer().on("swipeleft",function(){
		indexproright();
		});
	
	$(".about3 .btn .left").hammer().on("tap",function(){
		indexproleft();
		});
	$(".about3 .btn .right").hammer().on("tap",function(){
		indexproright();
		});
	
});