@charset "big5";
body,ul,div,h2, p{ margin: 0; padding: 0;}
th{ font-size:15px; color:#006699; text-align:right;}
#TABLE{ width:80%; margin:15px auto; border:1px dashed #6b6b6b; background-color:#E1F0FF; }
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #00588a;
	background-image:url(images/background.jpg);
	text-align: center; /* 這樣會讓容器在 IE 5* 瀏覽器內置中對齊。然後，文字會在 #container 選取器中設定為靠左對齊預設值 */
	color: #000000;
}
.oneColFixCtrHdr #container {
	width: 962px;  /* 使用比完整 800px 少 20px 的寬度會允許使用瀏覽器邊框並且避免水平捲軸出現 */
	background: #FFFFFF;
	margin: 0 auto; /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	border: 1px solid #ffffff;
	text-align: left; /* 這樣做會覆寫 Body 元素上的 text-align: center。 */
}
.oneColFixCtrHdr #header {
	background: #DDDDDD;
	height:177px;
	background-image:url(images/heard.jpg);
	background-repeat:no-repeat;
	text-indent:-9999px;
	padding: 0 10px 0 20px;  /* 這個欄位間隔符合下面顯示的 Div 中，元素的靠左對齊。如果在 #header 中使用影像而非文字，您可能會想要移除欄位間隔。 */
}
.oneColFixCtrHdr #MAIN_NAV { height:50px; text-align:center; background-color: #e30000; background-image:url(images/menu_bg.jpg); background-repeat:no-repeat; background-position:bottom;}

.oneColFixCtrHdr #MAIN_NAV ul{ list-style-type:none; padding-left:30px;}

.oneColFixCtrHdr #MAIN_NAV li{float: left;}

.oneColFixCtrHdr #MAIN_NAV li a{
	display: block;
	padding: 5px 15px 1px 20px;
	line-height:30px;
	color:#FFFFFF;
	font-size:18px;
	text-decoration:none;
	background-color: #ed1c24;
	background-image:url(images/line.gif); background-repeat:no-repeat; background-position:0px;
}

#MAIN_NAV li a:hover{
	background-color: #0075b8;
}
#AGAIN{ width:90%; padding:5px; background-color:#FFFFCC; text-align:left; margin:5px ;}
.oneColFixCtrHdr #header h1 {
	margin: 0; /* 將 #header Div 中最後一個元素的邊界調整為零可避免邊界收合 (Div 之間出現的空間，無法解釋)。如果 Div 的周圍具有邊框，這就不是必要動作，因為該項設定也會避免邊界收合 */
	padding: 10px 0; /* 使用欄位間隔而非邊界便可讓元素遠離 Div 的邊緣 */
}
.oneColFixCtrHdr #mainContent {
	padding: 10px 20px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	background: #FFFFFF;


}
.oneColFixCtrHdr #DATA{ float:left;

}
.oneColFixCtrHdr #mainContent h3{ text-align:center; color:#003366;}
.oneColFixCtrHdr #mainContent p{font-size:15px; color:#333333; }
.oneColFixCtrHdr #mainContent span{color:#CC0000; font-weight:bold; }
.oneColFixCtrHdr #mainContent ol{font-size:15px; color:#333333; padding-left:45px;}
.oneColFixCtrHdr #WAY{ width:95%; margin:0 auto;}
.oneColFixCtrHdr #WAY h4{ margin:10px; color:#0066CC; padding-left:40px; background-image:url(images/buttom.gif); background-repeat:no-repeat; line-height:30px; border-bottom:1px dotted #29abe2;} 
.oneColFixCtrHdr #WAY p{ padding-left:50px;}
.pic_box{ width:150px; float:left; margin:10px; background-image:url(images/img_bg.jpg); background-repeat:no-repeat; padding:5px; border-bottom-style:dotted; border-bottom-color:#336699; }
.pic_box h2{ font-size:18px; background-color:#0f7ce1; color:#FFFFFF; margin-bottom:20px;}
.pic_box h5{ font-size:15px; margin:10px 0; color:#006699;}
img.prod_image{ width:110px; height:110px; border:#ffffff 1px solid; text-align:center;}
span.price{font-size:24px;color:#a6f2a4;}

.TITLE{ float:right; width:751px; margin:0; }
.BOX { float:right; width:711px; margin:0 20px;}

/* 右下 */
.BOX .BOX_MAIN .BOX_IN{ background-image:url(images/table.gif); background-position:right bottom; padding-bottom:20px;
}

/* 左下 */
.BOX .BOX_MAIN{ background-image:url(images/table.gif); background-position:left bottom; padding-left:20px;}


/* 左上 */
.BOX .BOX_TOP{ height:58px;  background-image:url(images/table.gif); background-position:left top; padding-left:10px;}

/* 右上 */
.BOX .BOX_TOP h2{ text-indent:5px; background-image:url(images/table.gif); background-position:right top; font-size:16px; line-height:50px; color:#006699;}



.BOX p{ padding:0 20px 0 0; font-size:15px; color:#333333; text-indent:33px;}

td{ text-align:left;}
table{ margin-top:20px;}



.PAGE{ clear:both;float:right; font-size:13px;}

a:active {
  outline:none;
}

:focus {
  -moz-outline-style:none;
}
.oneColFixCtrHdr #footer {
	padding: 0 10px; /* 這個欄位間隔符合上面顯示的 Div 中，元素的靠左對齊。 */
	height:90px;
	background-image:url(images/floot_bg.jpg); background-repeat:no-repeat;
	
}
.oneColFixCtrHdr #footer p {
	margin: 0; /* 將頁尾中第一個元素的邊界調整為零可避免邊界收合的可能性 (Div 之間出現的空間) */
	padding: 55px 0 0 0;
	color:#FFFFFF;
	text-align:center;
	
}
.clearfloat { /* 這個類別應該放置於 Div 或 Break 元素上，而且應該是完整包含浮動的容器關閉前的最後一個元素 */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
