(function($) {
$(function(){
	var _imgNum = 0;	//画像の枚数
	var _imgSize = 0;	//画像のサイズ
	var _current = 0;	//現在の画像
	var _prev = 0;
	var _timer = 7000;	//タイマー時間
	var _fadeTime = 1000;
	var _hTimer;

	//画像サイズ取得
	_imgSize = $('#lotation-banner ul li img').width();

	//メイン画像の数だけ繰り返す
	$('#lotation-banner ul li').each(function(){
		if (_imgNum != _current) {
			//画像をずらして左外に配置
			$(this).css('margin-left', -_imgSize).fadeTo(0,0);
		}
		//ループの数をカウントして_imgNumに入れる
		_imgNum++;
	});

	//一定時間ごとにimageFadeを実行
	_hTimer = setInterval(function(){imageFade(_current +1);}, _timer);

	//ページネーションクリック
	$('#lotation-banner-tab ul li').click(function() {
		var thisNum = $('#lotation-banner-tab ul li').index(this);
		//押したボタンが現在の画像じゃなかったら実行
		if(thisNum  != _current) {
			clearInterval(_hTimer);

			imageFade(thisNum);
			//一定時間ごとにimageFadeを実行
			_hTimer = setInterval(function(){imageFade(_current +1);}, _timer);
		}
	});

	function imageFade(next) {
		// 次の画像が最後なら1枚目、１枚目なら最後
		if (next == _imgNum) {
			next = 0;
		} else if(next == -1) {
			next = (_imgNum-1);
		}

		//次の画像を動かす
		$("#lotation-banner li").eq(next).css("margin-left", 0).fadeTo(_fadeTime,1);
		$("#lotation-banner li").eq(_current).fadeTo(_fadeTime,0);
		_prev = _current;
		setTimeout(function() {
            $("#lotation-banner li").eq(_prev).css("margin-left", -_imgSize);
        }, _fadeTime );

		//現在の番号を次の番号にする。
		_current = next;
	}
});
})(jQuery);