// Main Visual Vertical Rolling
$(function() {
 var mIndex = 0;
 var mCount = $("#mainSlide ul.imgRolling li").length;
 var cTop = $("#mainSlide ul.imgRolling li .text").offset().top;
 var mTimer;
 function mainInit() {
  var wSize = $(window).width();
  var wrapHeight = $("#mainSlide ul.imgRolling li").height();
  $("#mainSlide ul.imgRolling").css('top', -(mIndex*wrapHeight) + 'px');
  if(wSize < 1025) {
   $("#mainSlide .visual_wrap").css('height',wrapHeight + 'px');
  } else {
   $("#mainSlide .visual_wrap").css('height','1040px');
  }
 }
 function mainSlide() {
  var mSize = $("#mainSlide ul.imgRolling li:first").height();
  var iSize = $("#mainSlide .indicator .active-box").height();
  var wSize = $(window).width();

  if(mIndex>=mCount) {
   mIndex = 0;
  } else if(mIndex<0) {
   mIndex = mCount -1;
  }
  $("#mainSlide ul.imgRolling").stop(true,false).animate({top:-(mSize*mIndex) + 'px'}, 800, 'easeInCubic');
  if(wSize > 1024) {
   $("#mainSlide .indicator .active-box").stop(true,false).animate({top:iSize*mIndex + 'px'}, 1000, 'easeOutCubic');
  }
  $("#mainSlide .indicator .inner a").removeClass('active');
  $("#mainSlide .indicator .inner a").eq(mIndex).addClass('active');
 }
 mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);
 $("#mainSlide .indicator .inner > a").click(function() {
  var $idx = $(this).index();
  if(!$("#mainSlide ul.imgRolling").is(':animated')) {
   clearInterval(mTimer);
   mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);
   mIndex = $idx;
   mainSlide();
  }
 });
 mainInit();
 $(window).resize(function() {
  mainInit();
 });
});