@charset "utf-8";

/*#############################################################
Name: » A-Lou
Date: 2008-08-19
Type: Layout Css
#############################################################*/


/*------------------------body---------------------*/

* {    
 vertical-align: baselinebaseline;    
 font-weight: inherit;    
 font-family: inherit;    
 font-style: inherit;    
 font-size: 100%;    
 border: 0 none;    
 outline: 0;    
 padding: 0;    
 margin: 0;    
 } 

body {
	font:normal 12px Arial, Helvetica, sans-serif;
	text-align: center; /*IE5.5以前用的置中對齊*/
	text-decoration: none; /*刪除連結線*/
	background-color:#393939;
}

HTML { 
	scrollbar-face-color:#e5e5e5;
	scrollbar-arrow-color:#aaa;
	scrollbar-track-color:#FFF;
	scrollbar-shadow-color:#aaa;
	scrollbar-highlight-color:#aaa;
	scrollbar-3dlight-color:#FFF;
	scrollbar-darkshadow-color:#FFF;
} /*僅IE捲軸有作用.FireFox不支援*/



/*------------------------Layout---------------------*/
.wrapper{
	margin:0;
	padding:9px 0 0;	
	background: #393939 url(../images/bg.jpg) center top repeat-y;
}

.container { 
	margin: 0 auto;
	width: 782px;
}

.header { 
	height: 122px; 
}
.logo {
	float:left;
	width: 258px;
	height: 113px; 
	background-color:#990000;
	background:#FFF url(../images/logo.jpg) no-repeat;
}
.menu {
	float:right;
	width: 524px;
	height: 113px; 
	background-color:#fff;
}
/*------------------------Banner---------------------*/

.banner{
	clear:both;
	width: 782px; 
	height: 199px;
}

/*------------------------Left Side---------------------*/

.con_left {
	position:relative;
	float:left;	
	width: 258px;
	height:400px;
	text-align:left;
	background:#fff url(../images/con_left_bg.jpg) left top no-repeat;
}

.img {
	position:absolute;
	top:91px;
	left:52px;
	width:165px;
	height:285px;
	background-color:#333;
	z-index:1;
}

/*------------------------Right Side---------------------*/

/*=======<*.php>通用=========*/
.con_right {
	float:right;
	width: 524px;
	text-align:right;
	background:#fff url(../images/con_right_bg.jpg) repeat-x;
}

.con_headlin{
	margin-top:13px;
	background:#FFF url(../images/headlin.jpg) right top no-repeat;
	width:505px;
	height:77px;
}
.content{
	width: 782px;
	position:relative;
	background:#fff url(../images/con_right_bg.jpg) repeat-x;
}
/*=======<index.php> <products.php> <products_1.php>=========*/
.con_headlin_left{
	float:left;
	width:173px;
}

.con_headlin_right{
	float:right;
	width:332;
}

.list_pro{
	width:452px;
	height:83px;
	margin:33px 26px 18px 0;
	background:#fff url(../images/list_pro.jpg) no-repeat;
}
.cc_bg{
	float:left;
	position:absolute;
	left:50%;
	top:693px;
	margin-left:-391px;
	background:#fff url(../images/cc_bg.jpg) no-repeat;
	width:288px;
	height:500px;
	z-index:50;
	}
.oo_bg{
	float:left;
	position:absolute;
	left:50%;
	top:800px;
	margin-left:-365px;
	background:url(../images/oo_bg.jpg) repeat-y;
	width:268px;
	height:1200px;
	z-index:50;
	}
.blue{
	float:left;
	position:absolute;
	width:113px;
	height:98px;
	background:url(../images/blue.jpg) no-repeat;
	top:270px;
	left:311px;
}
.cloth{
	float:left;
	position:absolute;
	width:242px;
	height:313px;
	background:url(../images/cloth.jpg) no-repeat;
	top:404px;
	left:0;
	z-index:0;
}

/*=======<facilities.php>=========*/
.facilities_left{
	float:left;
	position:relative;
	width:230px;
	height:720px;
	background:url(../images/con_left_bg.jpg) left top no-repeat;
}
.facilities_right{
	float:right;
	width:552px;
}
.content .facilitie_left{
	position:absolute;
	float:left;
	top:176px;
	left:25px;
	width:180px;
	height:540px;
	z-index:1;
}
.facilitie_right{
	width:552px;
	text-align:left;
	margin:25px 0 30px 0;
}
.facilitie_right li{
	float:left;
	list-style:none;
	margin:0 13px 23px 0;
	font:12px/26px Arial, Helvetica, sans-serif;
	color:#999;
	background:url(../images/facilitie_but.jpg) left 99% no-repeat;
}
.facilitie_right img{
	display:block;
}
.facilitie_font{
	padding-left:50px;
}
/*=======<product.php> menu =========*/
.con_product_ban{
	width:443px;
	height:23px;
	margin:30px 26px 20px 0;
	background:url(../images/product_but_bg.jpg) left top no-repeat;
}
/*=======<product.php>========*/
.con_product{
	width:471px;
	text-align:center;
	margin-bottom:30px;
}
.con_product li{
	float:left;
	list-style:none;	
	margin:0 27px 0 0;
	font:12px/29px Arial, Helvetica, sans-serif;
	color:#999;
}
.con_product img{
	display:block;
}

/*=======<product_1.php>========*/
.con_product_1{
	width:460px;
	display:block;
	text-align:center;
	margin:0 26px 30px 0;
}
.con_product_1 li{
	float:right;
	list-style:none;	
	margin:0 0 0 30px;
	font:12px/29px Arial, Helvetica, sans-serif;
	color:#999;
}
.con_product_1 img{
	display:block;
}
/*=======<qc.php>=========*/
.qc_left{
	float:left;
	position:relative;
	width:270px;
	height:530px;
	background:url(../images/con_left_bg.jpg) left top no-repeat;
	z-index:5;
}
.qc_right{
	float:right;
	width:506px;
}
.qc_iso{
	position:absolute;
	float:left;
	top:93px;
	left:40px;
	width:235px;
	height:337px;
	z-index:50;
}
.qc{
	width:506px;
	text-align:left;
	margin:25px 0 30px;
}
.qc li{
	float:right;
	list-style:none;
	margin:0 10px 10px 0;
	font:12px/25px Arial, Helvetica, sans-serif;
	color:#999;
	background:url(../images/qc_icon.jpg) left 95% no-repeat;
}
.qc img{
	display:block;
}
.qc_font{
	margin:0 0 0 38px;
}

/*=======<contact.php>=========*/

.contact_content{
	width:782px;
	height:530px;
	background:#fff url(../images/con_right_bg.jpg) left top repeat-x;
}

.contact_left{
	float:left;
	position:absolute;
	left:50%;
	margin:0 0 0 -391px;
	width:258px;
	height:145px;
	background:url(../images/con_left_bg.jpg) left top no-repeat;
	z-index:1;
}
.contact_right{
	float:right;
	position:absolute;
	left:50%;
	margin:0 0 0 -391px;
	width:782px;
	z-index:2;
}
.contact_con{
	width:620px;
	margin :40px 40px 0 0;
}
.contact_pic{
	float:left;
	position:relative;
	width:100px;
	height:95px;
	background:url(../images/contact_pic.jpg) right top no-repeat;
}
.contact_explain{
	float:right;
	text-align:left;
	width:520px;
	height:95px;	
}
.contact_explain p{
	padding:5px 0 0 40px;
	font:12px/24px Arial, Helvetica, sans-serif;
	color:#333;	
}
.contact_bottom{
	float:left;
	position:absolute;
	width:462px;
	height:227px;
	top:260px;
	left:50%;	
	margin:0 0 0 -231px;
	text-align:left;
	background:url(../images/contact_company.jpg) 0 20px no-repeat;
	z-index:3;
}
.contact_bottom img{
	margin:5px 0 0;
	float:right;	
	position:relative;
	
}
.contact_bottom p{
	margin:60px 0 0 22px;
	font:12px/24px Arial, Helvetica, sans-serif;
	color:#666;
}

/*=======<online_advice.php>=========*/
.online_advice_content{
	width:782px;
	height:600px;
	background:#fff url(../images/con_right_bg.jpg) left top repeat-x;
}

.online_advice_left{
	float:left;
	position:absolute;
	left:50%;
	margin:0 0 0 -391px;
	width:258px;
	height:145px;
	background:url(../images/con_left_bg.jpg) left top no-repeat;
	z-index:1;
}
.online_advice_right{
	float:right;
	position:absolute;
	left:50%;
	margin:0 0 0 -391px;
	width:782px;
	z-index:2;
}
.online_advice_con{
	width:620px;
	margin :40px 40px 0 0;
}
.online_advice_pic{
	float:left;
	position:relative;
	width:100px;
	height:95px;
	background:url(../images/online_advice_icon.jpg) right top no-repeat;
}
.online_advice_explain{
	float:right;
	text-align:left;
	width:520px;
	height:95px;	
}
.online_advice_explain p{
	padding:5px 0 0 40px;
	font:12px/24px Arial, Helvetica, sans-serif;
	color:#333;	
}
.online_advice_form{
	clear:both;
	text-align:center;
	width:510px;
	height:400px;
	margin:20px auto 0;
	background:url(../images/online_advice_bg.jpg) 100% 0 no-repeat;	
}

/*==<online_advice.php> form==*/

.formLayout th ,
.formLayout td {
	text-align:center;
	color:#666;
	/*border:1px solid #ccc;*/
	font-size:12px;
}

.formLayout th {
	line-height:30px;
	text-align:right;
	width:99px;
	/*background-color:#eeeeee;*/
	font-weight:normal;
}

.formLayout td {
	text-align:left;
	padding-left:5px;
	/*background-color:#fff;*/
}

.formLayout input.keyin ,
.formLayout textarea {
	border:1px solid #aaaaaa;
}

.formLayout input.keyin {
	width:152px;
	height:20px;	
}

.formLayout input.longInput1 {
	width:202px;
}

.formLayout input.longInput2 {
	width:252px;
}

.formLayout input.longInput3 {
	width:352px;
}

.formLayout th.headerBottom {
	vertical-align:top;
}

.formLayout td.contentBottom {
	padding:10px 0 10px 5px;
}

.formLayout td.formButton {
	height:28px;
	text-align:right;
	vertical-align:middle;
	/*background-color:#dddddd;*/
	padding-right:19px;
}

.formButton input {
	margin-right:13px;
}
/*------------------------Footer---------------------*/

.footer {
	position: relative;
	clear: both;
	margin:0 auto;
	width: 782px; 
	height: 79px;
	text-align: left;
	background:url(../images/footer_bg.jpg) repeat-x;
}
.grnet{
	position:absolute;
	top:20px;
	right:5px;
	width:110px;
	height:20px;
	color:#CCC;
	z-index:1;
}