$(document).ready(function() {
	// 初期設定
	nums  = 4;		// ずらす個数
	total = 8;		// 全部の個数
	width = $('#carousel_ul li').outerWidth();	// 1個の横幅

	var left_indent = 0 - total * width;
	$('#carousel_ul').css({'left' : left_indent});	// CSSのleftを指定

	// 右側のボタン押した時
	$('#left_scroll img').click(function(){

		// アニメーション
		var left_indent = parseInt($('#carousel_ul').css('left')) + nums * width;
		$('#carousel_ul:not(:animated)').animate({'left' : left_indent},750,function(){
			// 末尾の nums 個を先頭にコピー
			for (i=0;i < nums;i++) {
				$('#carousel_ul li:first').before($('#carousel_ul li:last'));
			}

			$('#carousel_ul').css({'left' : left_indent});
		});

		// 表示位置を調整
		left_indent = 0 - total * width;
		$('#carousel_ul').css({'left' : left_indent});

	});

	// 左側のボタンを押した時
	$('#right_scroll img').click(function(){

		// アニメーション
		var left_indent = parseInt($('#carousel_ul').css('left')) - nums * width;
		$('#carousel_ul:not(:animated)').animate({'left' : left_indent},750,function(){
			// 先頭の nums 個を末尾に
			for (i=0;i < nums;i++) {
				$('#carousel_ul li:last').after($('#carousel_ul li:first'));
			}

			$('#carousel_ul').css({'left' : left_indent});
		});

		// 表示位置を調整
		left_indent = 0 - total * width;
		$('#carousel_ul').css({'left' : left_indent});

	});
});