$(window).load(function(){	

	$(".img").animate({marginTop: "-700px", marginLeft: "-700px"}, 10000 )
		.animate({marginTop: "-500px", marginLeft: "-0px"}, 10000 )
		.animate({marginTop: "-100px", marginLeft: "0px", width: "960px"}, 10000 )
		.animate({opacity: 0.0}, 10000 );
		
	$(".img2").animate({marginTop: "0px", marginLeft: "0px"}, 30000 )
		.animate({marginTop: "-500px", marginLeft: "-700px"}, 15000 )
		.animate({marginTop: "-500px", marginLeft: "-0px"}, 10000 )
		.animate({marginTop: "-0px", marginLeft: "-700px"}, 10000 )
		.animate({marginTop: "-100px", marginLeft: "0px", width: "960px"}, 10000 );
		
})

$(document).ready(function(){
	$("#port_car_com").hide()
	$("#port_mini_com").hide()
	$("#port_the_com").hide()
	$("#port_lamp_com").hide()
	$("#port_gkkol_com").hide()
	
	$("#port_gkkol").click(function(){
	
		$("#port_gkkol_com").slideToggle(500)
		
	})
	
	$("#port_lamp").click(function(){
		
		if ($("#port_lamp").css('height') == '550px') {
			$("#port_lamp img").animate({
				width: "1920px",
				top: "-450px",
				left: "-650px"
			}, 1000)
			$("#port_lamp p").fadeIn(1000)
			$("#port_lamp_com").slideToggle(1000)
			$("#port_lamp").animate({height: "200px"}, 1000 )
		}
		else if ($("#port_lamp").css('height') == '200px'){
			$("#port_lamp img").animate({
				width: "920px",
				top: "0px",
				left: "0px"
			}, 1000)
			$("#port_lamp p").fadeOut(1000)
			$("#port_lamp_com").slideToggle(1000)
			$("#port_lamp").animate({height: "550px"}, 1000 )
		}
		
	})
	
	$("#port_car").click(function(){
		
		if ($("#port_car").css('height') == '550px') {
			$("#port_car img").animate({
				width: "1920px",
				top: "-550px",
				left: "-150px"
			}, 1000)
			$("#port_car p").fadeIn(1000)
			$("#port_car_com").slideToggle(1000)
			$("#port_car").animate({height: "200px"}, 1000 )
		}
		else if ($("#port_car").css('height') == '200px'){
			$("#port_car img").animate({
				width: "920px",
				top: "0px",
				left: "0px"
			}, 1000)
			$("#port_car p").fadeOut(1000)
			$("#port_car_com").slideToggle(1000)
			$("#port_car").animate({height: "550px"}, 1000 )
		}
		
	})
	
	$("#port_mini").click(function(){
		
		if ($("#port_mini").css('height') == '650px') {
			$("#port_mini img").animate({
				width: "920px",
				top: "-150px",
				left: "0px"
			}, 1000)
			$("#port_mini p").fadeIn(1000)
			$("#port_mini_com").slideToggle(1000)
			$("#port_mini").animate({height: "200px"}, 1000 )
		}
		else if ($("#port_mini").css('height') == '200px'){
			$("#port_mini img").animate({
				width: "920px",
				top: "0px",
				left: "0px"
			}, 1000)
			$("#port_mini p").fadeOut(1000)
			$("#port_mini_com").slideToggle(1000)
			$("#port_mini").animate({height: "650px"}, 1000 )
		}
		
	})
	
	$("#port_the").click(function(){
		
		if ($("#port_the").css('height') == '650px') {
			$("#port_the img").animate({
				width: "1680px",
				top: "-550px",
				left: "-250px"
			}, 1000)
			$("#port_the p").fadeIn(1000)
			$("#port_the_com").slideToggle(1000)
			$("#port_the").animate({height: "200px"}, 1000 )
		}
		else if ($("#port_the").css('height') == '200px'){
			$("#port_the img").animate({
				width: "920px",
				top: "0px",
				left: "0px"
			}, 1000)
			$("#port_the p").fadeOut(1000)
			$("#port_the_com").slideToggle(1000)
			$("#port_the").animate({height: "650px"}, 1000 )
		}
		
	})
	
})