function RollImage(json, first, next){

	 var start = first;
	 var end = next;
	//À̹ÌÁö ·Ñ¸µ ¼³Á¤°ª
	var config = {
		currentImg : parseInt(start), //¿ø·¡°ª 0
		nextImg : parseInt(end), //¿ø·¡°ª 1
		listArea : e(json.list_area),
		imageList : e(json.list_area).getElementsByTagName("DIV"),
		imgCnt : e(json.list_area).getElementsByTagName("DIV").length-1, //0ºÎÅÍ ½ÃÀÛ
		rollTime : json.roll_time,
		moveTime : json.move_time,
		coordX1 : 0,
		coordX2 : e(json.list_area).offsetWidth,
		coordY : e(json.list_area).offsetHeight,
		moveAt : json.moveAt,
		direction : json.direction,
		label : e(json.label),
		labelType : json.labelType
	};

	
	labelBind(config); //¶óº§(¹öÆ°) ¹ÙÀεå
	setRoll(config); //·Ñ¸µ ½ÃÀÛ
	rollPause(config); //¸¶¿ì½º ¿À¹ö½Ã ·Ñ¸µ ¸ØÃã
	
	//À̹ÌÁö ·Ñ¸µ ±âº» ¼¼ÆÃÇϱâ
	function setRoll(c){
		c.coordX1 = 0;
		c.coordX2 = c.listArea.offsetWidth;
		c.coordY = c.listArea.offsetHeight;

		if(c.direction=="right" || c.direction=="down"){
			c.coordX2 = c.coordX2 * -1;
			c.coordY = c.coordY * -1;
		}
		
		c.imageList[c.nextImg].style.display = "block";
		setPosition(c);
		rollOver(c)
		//c.imageList[c.nextImg].style.left = c.coordX2+"px";
		
		c.rollTimer = setTimeout(function(){imgMove(c)},c.rollTime);
	};

	//À̹ÌÁö¸¦ ¿òÁ÷ÀÌ°Ô ÇÑ´Ù.
	function imgMove(c){
		if(c.direction == "left" || c.direction == "right"){
			c.imageList[c.currentImg].style.left = c.coordX1 + "px";
			c.imageList[c.nextImg].style.left = c.coordX2 + "px";
		}else if(c.direction == "up" || c.direction == "down"){
			c.imageList[c.currentImg].style.top = c.coordX1 + "px";
			c.imageList[c.nextImg].style.top = c.coordY + "px";
		}
		//alert(c.imageList[c.nextImg].style.left);
		var moveAt = parseInt(c.moveAt);
		if (c.direction == "left"){
			c.coordX1 -= moveAt;
			c.coordX2 -= moveAt;
		}else if(c.direction == "right"){
			c.coordX1 += moveAt;
			c.coordX2 += moveAt;
		}else if(c.direction=="up"){
			c.coordX1 -= moveAt;
			c.coordY -= moveAt;
		}else if(c.direction=="down"){
			c.coordX1 += moveAt;
			c.coordY += moveAt;
		}
		
		//if(c.coordX1 < (-1*c.listArea.offsetWidth) ) {
		if( isNextImgRoll(c) ) {
			c.currentImg = c.nextImg;
			c.nextImg += 1;
			if(c.currentImg == c.imgCnt) c.nextImg = 0;
			clearTimeout(c.moveTimer);
			clearTimeout(c.rollTimer);
			setRoll(c);
			return;
		}
		c.moveTimer = setTimeout(function(){imgMove(c)},c.moveTime);
	};
	
	//´ÙÀ½ À̹ÌÁö ·Ñ¸µ ÇؾßÇÏ´ÂÁö È®ÀÎ
	function isNextImgRoll(c){
		var d = c.direction;
		if(d=="left" && c.coordX2 < 0 ) return true;
		else if(d=="right" && c.coordX2 > 0) return true;
		else if(d=="up" && c.coordY < 0 ) return true;
		else if(d=="down" && c.coordY > 0) return true;

		return false
	};

	//·Ñ¸µ ¹æÇâ¿¡ µû¸¥ µÎ¹ø° À̹ÌÁö À§Ä¡ ÁÂÇ¥ ¼³Á¤
	function setPosition(c){
		var d = c.direction;
		if(d=="left") c.imageList[c.nextImg].style.left = c.listArea.offsetWidth+"px";
		else if(d=="right") c.imageList[c.nextImg].style.left = (-1 * c.listArea.offsetWidth) + "px";
		else if(d=="up") c.imageList[c.nextImg].style.top = c.listArea.offsetHeight + "px";
		else if(d=="down") c.imageList[c.nextImg].style.top = (-1 * c.listArea.offsetHeight) + "px";

		//alert(c.imageList[c.nextImg].style.left);
	};
	
	//onmouseover ½Ã ¿òÁ÷ÀÓ ¸ØÃã
	function rollPause(c){
	//alert(c.listArea.onmouseover);
		c.listArea.onmouseover = function(){
			clearTimeout(c.rollTimer);
		}

		c.listArea.onmouseout = function(){
			//alert("c.listArea.onmouseout");
			setRoll(c);
		}
	};

	//¶óº§°ú ¹ÙÀεå
	function labelBind(c){
		if(c.label == null) return; //¶óº§À» »ç¿ëÇÏÁö ¾ÊÀ¸¸é ¾Æ·¡´Â ½ÇÇàµÇÁö ¾Ê´Â´Ù.
		var labels = c.label.getElementsByTagName(c.labelType);

		c.label.onmouseover = function(){ //¶óº§¿µ¿ª¿¡ ¸¶¿ì½º°¡ ¿À¸é
			for(n in labels){ 
				if(labels[n] == event.srcElement){
					//c.imageList[c.currentImg].style.display = "none";
					c.currentImg = parseInt(n);
					c.nextImg = parseInt(n)+1;
					if(c.currentImg == c.imgCnt) c.nextImg = 0;
					clearTimeout(c.rollTimer);
					viewImg(c);
					rollOver(c);
					break;
				}
			}
			//alert(event.srcElement)
		}
		
		c.label.onmouseout = function(){
			for(n in labels){
				if(labels[n]==event.srcElement){
					setRoll(c);
					break;
				}
			}
		}
	};

	//¶óº§ onmouseover ½Ã Ŭ·¡½º Àû¿ë
	function rollOver(c){
		if(c.label == null) return;
		var els = c.label.getElementsByTagName(c.labelType);
		
		if(c.labelType == "img"){
			
			for(n in els){
				if(typeof els[n] == "object"){
					if(n == c.currentImg){
						els[n].src = els[n].getAttribute("oversrc");
					}else{
						els[n].src = els[n].getAttribute("outsrc");
					}
				}
			}
		}else{
			for(n in els){
				if(typeof els[n] == "object"){
					if(n == c.currentImg){
						var ocss = els[n].className;
						els[n].className = ocss+" "+els[n].getAttribute("overcss");
					}else{
						els[n].className = els[n].getAttribute("outcss");
					}
				}
			}
		}
	}

	//¶óº§¿¡¼­ ¼±ÅÃµÈ À̹ÌÁö º¸À̱â
	function viewImg(c){
		//alert(c.currentImg);
		for(n=0; n<c.imgCnt+1; n++)	{
			c.imageList[n].style.display = "none";
		}
		
		c.imageList[c.currentImg].style.left = "0px";
		c.imageList[c.currentImg].style.top = "0px";
		c.imageList[c.currentImg].style.display = "block";
	};
}

function debug(t){
e("dis").innerHTML = t + "<br>";
}

//id°ªÀ¸·Î °´Ã¼ ¹Ýȯ
function e(id){
	var o = document.getElementById(id);
	if(typeof o == undefined || o == null) { return null;}

	return o;
}