$(document).ready(function(){
	var showTime = 300;
	var hideTime = 200;
	
	var aa1 = document.getElementById("navibox01");
	var navi1 = document.getElementById("navi1");
	$(navi1).append($(aa1));
	
	$(navi1).hover(function() {
		$(aa1).css({"opacity":"0.999"})
		$(aa1).show(showTime);
	}, function() {
		$(aa1).hide(hideTime);
	});
//////////////////////////////////////////////////////////////////////////////////////////////////
	var aa2 = document.getElementById("navibox02");
	var navi2 = document.getElementById("navi2");
	$(navi2).append($(aa2));
	
	$(navi2).hover(function() {
		$(aa2).css({"opacity":"0.999"})
		$(aa2).show(showTime);
	}, function() {
		$(aa2).hide(hideTime);
	});
//////////////////////////////////////////////////////////////////////////////////////////////////
	var aa3 = document.getElementById("navibox03");
	var navi3 = document.getElementById("navi3");
	$(navi3).append($(aa3));
	
	$(navi3).hover(function() {
		$(aa3).css({"opacity":"0.999"})
		$(aa3).show(showTime);
	}, function() {
		$(aa3).hide(hideTime);
	});
//////////////////////////////////////////////////////////////////////////////////////////////////
	var aa4 = document.getElementById("navibox04");
	var navi4 = document.getElementById("navi4");
	$(navi4).append($(aa4));
	
	$(navi4).hover(function() {
		$(aa4).css({"opacity":"0.999"})
		$(aa4).show(showTime);
	}, function() {
		$(aa4).hide(hideTime);
	});

});