$(function() {
	showContents(0);
});

function contentsChange(navi, contents){
	$(navi).each( function(i){
		$(this).unbind("click");
		if($(contents + ":eq("+i+")").is(":hidden")){
			$(this).removeClass("current");
			$(this).click( function(e){
				showContents(i);
			});
			$("img:eq(0)", this).attr("src", $("img:eq(0)", this).attr("src").replace("_on.gif", "_off.gif")).hover(
				function () {
					$(this).attr("src", $(this).attr("src").replace("_off.", "_on."));
				},
				function () {
					$(this).attr("src", $(this).attr("src").replace("_on.", "_off."));
				}
			);
		}else {
			$(this).addClass("current");
			$("img:eq(0)", this).attr("src", $("img:eq(0)", this).attr("src").replace("_off.gif", "_on.gif")).unbind();
		}
	});
}

function showContents(n){
	var navi = "#articleTab li";
	var contents = "#articleArea > div";
//	$("#articleArea").height($(contents + " > div:eq("+n+")").height());

	$(contents).each( function(i){
		if(i == n){
			if($(contents + ":eq("+i+")").is(":hidden")) $(this).fadeIn(200, function(){$("#articleArea").height("auto")});
			var box = contents + ":eq("+i+") div.article_area > div";
			var cols = 4;
			var prop = $.browser.msie && $.browser.version < 7 ? "height" : "min-height";
			var h = 0;
			var b = 0;
			var len = $(box).size();
			$(box).each (function(i){
				h = Math.max($(this).height(), h);
				if(((i+1)%cols) == 0 || i == len - 1){
					if(((i+1)%cols) == 0) $(this).addClass("right");
					$(box + ":lt(" + (i+1) + ")").not(box + ":lt(" + b + ")").css(prop, h + "px");
					h = 0;
					b = (i+1);
				}
			});
		}else {
			$(this).hide();
		}
	});
	contentsChange(navi, contents);
}