@charset "utf-8";
body {
	font: 100% 細明體, 新細明體;
	margin: 0; /* 比較好的做法是將 Body 元素的邊界與欄位間隔調整為零，以處理不同的瀏覽器預設值 */
	padding: 0;
	text-align: center; /* 這樣會讓容器在 IE 5* 瀏覽器內置中對齊。然後，文字會在 #container 選取器中設定為靠左對齊預設值 */
	color: #000000;
	background-color: #666666;
	background-image: url(image/class_ban.jpg);
}
.oneColLiqCtrHdr #container {
	width: 71%;  /* 這樣將會建立為 80% 瀏覽器寬度的容器 */
	background: #FFFFFF; /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	border: 1px solid #000000;
	text-align: left; /* 這樣做會覆寫 Body 元素上的 text-align: center。 */
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
.oneColLiqCtrHdr #header {
	background: #DDDDDD;  /* 這個欄位間隔符合下面顯示的 Div 中，元素的靠左對齊。如果在 #header 中使用影像而非文字，您可能會想要移除欄位間隔。 */
	border: 2px dotted #FFA;
}
.oneColLiqCtrHdr #header h1 {
	margin: 0;
	background-color: #FF3F55;
	color: #FFFBF0;
	padding-top: 5px;
	padding-right: 0;
	padding-bottom: 5px;
	padding-left: 0;
}
.oneColLiqCtrHdr #container #header a {
	color: #FFF;
	text-decoration: none;
	font-family: "華康粗圓體(P)", "華康粗黑體(P)", "華康粗明體(P)";
}

.oneColLiqCtrHdr #mainContent {
	margin-left: 40%;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 20px;
	border: 2px double #2A1F00;
	background-color: #77E3FF;
}
.oneColLiqCtrHdr #mainContent p {
	line-height: 25px;
	font-family: "華康中特圓體(P)", "華康中黑體(P)", "華康中圓體(P)";
}

.oneColLiqCtrHdr #footer {
	padding: 0 10px;
	background-color: #FF9F00;
} 
.oneColLiqCtrHdr #footer p {
	margin: 0; /* 將頁尾中第一個元素的邊界調整為零可避免邊界收合的可能性 (Div 之間出現的空間) */
	padding: 10px 0; /* 這個元素的欄位間隔將會建立空間，就如同邊界一樣，但是沒有邊界收合的問題 */
}.oneColLiqCtrHdr #maincontent1 {
	background-color: #FFF;
	float: left;
	width: 30%;
}
.oneColLiqCtrHdr #mainContent2 {
}

   /* set the image to use and establish the lower-right position */
    .cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2{
	background-color: transparent;
	background-image: url(image/img.png);
	background-repeat: no-repeat;
	background-position: right bottom;
}
    .cssbox{
	/* intended total box width - padding-right(next) */
      width:335px !important; /* IE Win = width - padding */
	width: 320px;
	/* the gap on the right edge of the image (not content padding) */
      padding-right:15px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: 5px;
}

    /* set the top-right image */
    .cssbox_head{
	/* pull the right image over on top of border */
      margin-right:-15px;
	/* right-image-gap + right-inside padding */
      padding-right:15px;
	background-position: right top;
}

    /* set the top-left image */
    .cssbox_head h2{
	background-position:top left;
	margin:0; /* reset main site styles*/
	border:0;
	height:auto !important;
	height:1%;
	padding-top: 5px;
	padding-right: 0;
	padding-bottom: 5px;
	padding-left: 40px;
} /* IE Holly Hack */
.oneColLiqCtrHdr #container #footer table {
	color: #FFF;
	text-decoration: none;
}
.oneColLiqCtrHdr #container #footer a {
	color: #FFF;
	text-decoration: none;
}



    /* set the lower-left corner image */
    .cssbox_body{
	background-position:bottom left;
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 15px;
	padding-left: 15px;
} /* mirror .cssbox_head right/left */
.oneColLiqCtrHdr #container #mainContent h1 {
	color: #FFF;
}