/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/
/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
body{ 
background:url(../images/lay_bg.png) top repeat-x #d5d5d5;
width:100%;
height:auto;
}

/*----------------- index ------------------*/
/*------ index header --------*/

#header_square{
	background:url(../images/header_bg.gif) top repeat-x ;
	width:100%;
	height:116px;
	position:fixed;
	z-index:20;
	}
#header_top{
	width:100%;
	height:35px;
	}
#flashaim{
	width:213px;
	padding:10px 0 0 400px;
	}
#logo{
	width:178px;
	height:48px;
	margin:10px 0 0 20px;
	float:left;
	}
#header_bar{
	width:136px;
	margin:10px 0 0 400px;
	float:left;
	}
#header_bar1{
	width:180px;
	margin: 10px 0 0;
	float:left;
}
	
/*222*/
#content_square{
	width:960px;
}
#content_title{
	width:960px;
	height:116px;
	float:left;
}
#img_square{
	width:960px;
	margin:100px 0 0 0;
	float:left;
	}
#pagefivemap_left{
	width:673px;
	float:left;
}
.img_1{
	width:673px;
	float:left;
}	
.img_2{
	width:673px;
	float:left;
}	
#pagefivemap_right{
	width:287px;
	float:left;
	margin:100px 0 0 0;
}
.blank{
	height:55px;
	padding:2px 0 0 0;
}
.blank_1{
	height:55px;
	padding:2px 0 0 0;
}
.blank_2{
	height:55px;
	padding:2px 0 0 0;
}
.blank1{
	height:120px;
	padding:2px 0 0 0;
}
.blank2{
	height:50px;
	padding:2px 0 0 0;
}
#pagefivemap_right input{width:250px;height:30px}
textarea{width:250px;height:90px;}

#foot_square{
	width:100%;
	height:194px;
	position:fixed;	
	z-index:12;
}



/* #Page Styles
================================================== */
img{max-width:100%; border:none;}




/* #Media Queries
================================================== */

	/* Tablet Portrait 平板直式 */
	/* Note: Design for a width of 768px */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		body{ background-position:0 -60px;}
		
		
		/*index_header------------------------------------------------*/
		#index{height:510px;}
		
		#header_top{width:100%;height:35px;}
		#flashaim{width:213px;padding:10px 0 0 250px;}
		#logo{margin:0 0 0 35px;}
		#header_bar{margin:15px 0 0 200px;}
		#header_bar1{margin:15px 0 0 0px;}
		
		#content_square{width:768px;}
		#content_title{width:768px;}
		#img_square{width:700px;float:left;margin: 30px 0 0 40px;}
		#pagefivemap_left{width:673px;float:left;}
		.img_1{width:673px;float:left;}	
		.img_2{width:673px;float:left;}	
		#pagefivemap_right{width:650px;padding:0px;margin: 0 0 0 10px; position:relative;}
		.blank{ width:350px;height:50px;padding: 0; float:left;}
		.blank_1{ width:350px;height:50px;padding: 0; float:left;}
		.blank_2{ width:350px;height:50px;padding: 0; float:left;}
		.blank1{ height:128px;padding: 0; position:absolute; left:350px;}
		.blank2{width:300px;height:70px;padding: 0;position:absolute; top:90px; left:350px;}
		#pagefivemap_right input{width:310px;height:30px}
		textarea{width:250px;height:50px;}
	}

/* Mobile (Portrait) 手機直式*/
	/* Note: Design for a width of 320px */
	@media only screen and (max-width: 767px) {
		body{ background-position:0 -250px; }
		
		
		/*index_header------------------------------------------------*/
		#index{height:510px; height:auto;}
		
		#header_top{width:100%;height:35px;}
		#flashaim{width:213px;padding:10px 0 0 40px;}
		#logo{width:160px;margin:0;}
		#header_bar{margin:10px 0 0 30px; max-width:100px;}
		#header_bar1{margin:0 0 0 160px; max-width:130px;}
		
		#content_square{width:310px;}
		#content_title{width:310px;}
		#img_square{width:280px;float:left;margin: 30px 0 0 0px;}
		#pagefivemap_left{width:310px;float:left;}
		.img_1{width:310px;float:left;}	
		.img_2{width:310px;float:left;}	
		#pagefivemap_right{width:280px;padding:0 0 0 15px;margin:0; position:relative;}
		.blank{ width:300px;height:50px;padding: 0; }
		.blank_1{ width:300px;height:50px;padding: 0; }
		.blank_2{ width:300px;height:50px;padding: 0;}
		.blank1{ height:80px;padding: 0; }
		.blank2{width:300px;height:50px;padding: 0;}
		#pagefivemap_right input{width:260px;height:30px}
		textarea{width:260px;height:50px;}
	}
/* Mobile (Landscape) 手機橫式 */
	/* Note: Design for a width of 480px */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		body{ background-position:0 -250px;}
		
		
		/*index_header------------------------------------------------*/
		#index{height:510px;}
		
		#header_top{width:100%;height:35px;}
		#flashaim{width:213px;padding:10px 0 0 100px;}
		#logo{width:178px;margin:0;}
		#header_bar{margin:10px 0 0 0;}
		#header_bar1{margin:10px 0 0 0;}
		
		#content_square{width:450px;}
		#content_title{width:450px;}
		#img_square{width:450px;float:left;margin: 30px 0 0 0px;}
		#pagefivemap_left{width:450px;float:left;}
		.img_1{width:450px;float:left;}	
		.img_2{width:450px;float:left;}	
		#pagefivemap_right{width:450px;padding:0 0 0 15px;margin:0; position:relative;}
		.blank{ width:420px;height:50px;padding: 0; }
		.blank_1{ width:420px;height:50px;padding: 0; }
		.blank_2{ width:420px;height:50px;padding: 0;}
		.blank1{  width:420px;height:80px;padding: 0; }
		.blank2{width:300px;height:100px;padding: 0 0 0 50px;}
		#pagefivemap_right input{width:360px;height:30px}
		textarea{width:360px;height:50px;}
	}