@import url("reset.css");
/* CSS Document */

/*****
*
*HTML5
*
*****/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
img {max-width:100%; height:auto; width:auto\9; /* ie8 */ display:block;margin:0 auto; }

/*****
*
*Basic
*
*****/

.clear{ clear:both;}
.small_p{ font-size:80%}
.tit{ font-weight:bold;}
.red{ color:#c70750;}



body {
	font: 100% 微軟正黑體,細明體, 新細明體;
	background: #666666;
	margin: 0; /* 比較好的做法是將 Body 元素的邊界與欄位間隔調整為零，以處理不同的瀏覽器預設值 */
	padding: 0;
	text-align: center; /* 這樣會讓容器在 IE 5* 瀏覽器內置中對齊。然後，文字會在 #container 選取器中設定為靠左對齊預設值 */
	color: #333;
	font-size: 15px;
	line-height: 1.6;
}

h1{  /*最大標題*/
	font-size:30px;
	color:#000000;
}

h2{ /*第二標題*/
	font-size:24px;
	color:#333;
	font-weight:bolder;
}

h3{ /*段落小標，以及商品名稱*/
	font-size:18px;
	color:#00F;
}

h4{ /*項目名稱*/
	font-size:16px;
	color:#00F;
}


#container {
	width: 1000px;
	background: #FFFFFF;
	margin: 0 auto; /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	border: 1px solid #333;
	text-align: left; /* 這樣做會覆寫 Body 元素上的 text-align: center。 */
}

#header {
	background: #69F; 
}

#lefter {
	padding: 0 0px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:700px;
	background: #FFFFFF;
	float:left;
	text-align: left;
}


#buttonMenu {
	padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:650px;
	height:100px;
	background:#FFFFFF;
}

#mainTop {
	padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:650px;
	height:70px;
	background:#FFFFFF;
	background-image:url(images/body/body_left/mainTop.jpg)
}

#mainMain {
	padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:650px;
	background:#FFFFFF;
	/*background-image:url(images/body/body_left/mainMain.jpg)*/
}
#mainBot {
	padding: 0 0px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:680px;
	height:70px;
	background:#FFFFFF;
	background-image:url(images/body/body_left/mainBot.jpg);
         position:relative;
        float: left;    
}

#righter {
	padding: 0 0px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:300px;
	background: #FFFFFF;
	float:right;
        /*margin-left: 10px;*/
}

.cacaNews_Top{	
padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:250px;
	height:23px;
	background-image:url(images/body/body_right/cacaNews_Top.jpg)}
.cacaNews_Title{
	padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:250px;
	background-image:url(images/body/body_right/cacaNews_Title.jpg)}
.cacaNews_Line{
	padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:250px;
	height:35px;
	background-image:url(images/body/body_right/cacaNews_Line.jpg)}
.cacaNews_Main{padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:250px;
/*        height:500px;*/
	background-image:url(images/body/body_right/cacaNews_Main.jpg)}
.news_img_box{
    margin: 0 0 5px;
    overflow: hidden;
    /*width: 250px;*/
    height:250px;
} 
.news_img_box img{
   max-height: 100%;
   width: auto; 
}
.cacaNews_Bot{padding: 0 25px; /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	width:250px;
	height:34px;
	background-image:url(images/body/body_right/cacaNews_Bot.jpg)}


#footer {
	clear:both;
	padding: 0 0px; /* 這個欄位間隔符合上面顯示的 Div 中，元素的靠左對齊。 */
	background:#FFFFFF;
}
#footer p {
	margin: 0; /* 將頁尾中第一個元素的邊界調整為零可避免邊界收合的可能性 (Div 之間出現的空間) */
	padding: 0px 0; /* 這個元素的欄位間隔將會建立空間，就如同邊界一樣，但是沒有邊界收合的問題 */
}