@charset "utf-8";

body { background:url(../images/bg.jpg) top center; margin:0; padding:0; font-family: Arial,"微軟正黑體"; font-size: 12px;}
a { text-decoration:none;}
img { border:0; vertical-align:middle;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}/* End hide from IE-mac */ 
.warpper { width:1000px; margin:0 auto;}


/** 選單 **/
.menu { width:1000px; margin:  0 auto;  }
.menu>ul { margin:0; padding:0; height:30px; list-style:none;}
.menu>ul>li { position:relative; float:left; width:166px; line-height:30px; font-size:12px; text-align:center;}
.menu>ul>li  a { color:#333; display:block;}
.menu>ul>li  a:hover { color: #F30;}

.menu>ul>li{margin:0; padding:0; float:left; _margin:0 2px 0 0;}
    .menu>ul>li.parent ul{display:none;}
	.menu>ul>li.parentOn ul {display:block;}
	.menu>ul>li>a {display:block;}
	.menu>ul>li>a:hover {}
	
	.menu>ul>li>ul { position:absolute; width:100%; z-index:999;}
	
	/** 次級選單 **/
	.sub { background:#fff; margin:0; padding:0; list-style:none;}
		   .sub li {background:#fff; text-align:center; line-height:35px; }
		   .sub li .on-hover { background: #E6E6E6;  display:block; font:13px; color:#333;}
			 .sub a { display:block; font:13px; color:#333;border-bottom:1px #CCC dotted;}
			 .sub a:hover { background: #EFEFEF; color: #333; }



/** 頭部 **/
.header { height:120px; position:relative; }
.header .logo { width:355px; font-size:24px; color:#fff; line-height:100px; margin:0 auto; text-align:center; margin-top:27px; }
.header .top-tool { background:url(../images/tool-bg.jpg) repeat-x; font-size:12px; color:#fff; min-height:30px; }
.header .top-tool .tool-box{ width:1000px; margin:0 auto; text-align:right;}


/** main **/
.main { width:1000px; margin:0 auto; min-height:300px; padding:35px 0 0 0;}
.col-01 { float:left; width:265px; padding-right:13px; margin-right:10px;}
.col-02 { float:left; width:712px; }
.col-03 { float:left; }

.page-main {}
h3.page-title { font-size:16px; color:#39C; margin: 0 0 10px 0; padding:0;}
.content { font-size:15px; line-height:1.5em; color:#666; font-family:"微軟正黑體"; }

.btn-bottom { text-align:center; padding: 10px 0; margin-top:20px; border-top: 1px #CCC dotted;}
input.input-btn01 { background: #06C; line-height:25px; width:100px; color:#fff; font-size:12px; border:0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin: 0 3px;}
input.input-btn02 { background: #900; line-height:25px; width:100px; color:#fff; font-size:12px; border:0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;margin: 0 3px;}



/**首頁主要按鈕**/
.menu-btn{ margin:50px 0; }
.menu-btn ul{ list-style:none; margin:0; padding:0;}
.menu-btn ul li{ display:block; width:33.3%; float:left; text-align:center;}


/**聯絡我們**/
.contact{ width:330px; float:left; line-height:1.6; margin-top:10px;}
.contact h3{ font-family:"微軟正黑體"; font-weight:bold; font-size:18px; color:#2d64a7;}
.map{ width:370px; border:5px solid #dbdbdb; float:left; margin-top:10px;}


/** 訊息視窗 **/
.announcement { width:900px; margin:0 auto;}
.announcement h3 { text-align:center; font-size:16px; border-bottom:1px #CCC dotted; margin-bottom:10px; line-height:30px;}
.announcement .content { padding:10px; border:1px #39F solid; font-size:15px; color:#333; line-height:1.5em; text-align:center;}

/** 會員專區 **/
.login { margin-top:10px; width:300px; margin: 0 auto; position:relative;}
.login ul { list-style:none; margin:0; padding:20px 0; border-top:1px #CCC dotted; border-bottom:1px #CCC dotted;}
.login ul li { padding:3px 0; height:25px}
.login ul li img { vertical-align:middle;}
.login .options-th { float:left; width:60px; font-size:12px; color: #999; line-height:25px; text-align:right; padding-right:10px;}
.login .options-td { float:left; width:200px; font-size:12px; color:#333; line-height:25px;}
input.login-input-style01 { background: #EAEAEA ;  font-size:12px; color:#333; padding:3px 5px; line-height:15px; border:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 150px;}
input.login-btn-style01 { background: #666 ;  font-size:12px; color:#fff; padding:5px; line-height:40px; border:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 60px; position:absolute; top:55px; right:0px;}
.member-post { border:1px #CCC solid; margin:10px 0; padding:20px; text-align:center; font-size:15px; color:#666; line-height:1.5em; } 
.new-regist { width: 650px; margin: 0 auto;}
.login-tool { text-align:center; padding-top:10px;}
.forget { font-size:12px; color:#333;}
a.forget  { color:#333; text-decoration:none; padding:5px;} a.forget:link  { color: #900;}
.regist { font-size:12px; color:#333;}
a.regist { color:#333; text-decoration:none; padding:5px;} a.regist { color: #09C;}

/** 歷史訂單 **/
.cart {width:900px; margin: 0 auto; }
.order-history { } 
h3.order-number { color:#960; }
th.order-history-th { background: #C99; font-size:15px; color:#FFF; text-align:center; line-height:25px;  border-right:1px #fff dotted;} 
.order-history td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.order-history img.pro-photo { width:90px; height:90px; padding:10px; border:1px #CCC solid;}
.order-history .pro-name { font-size:15px; color: #333; text-align:left;}
.order-history .price { font-size:15px; color:#900;}
.order-history .numb { font-size:15px; color: #66F;}
.order-history .count { font-size:15px; color: #333;}
.order-history .count-portal { height:20px; padding:10px 0; border-bottom:1px #CCC dotted;}
                     .count-price { font-size:15px; color: #900; font-weight:bold;}
.order-history .portal { display:block; width:200px; font-size:15px; color:#900; float:right; text-align:right;}
.order-history .freight { display:block; width:150px; font-size:15px; color:#900; float:right; text-align:right;}


/** 購物車 **/
.cart {width:900px; margin: 0 auto; }
.shopping-car { } 
th.shopping-car-th { background: #69C; font-size:15px; color:#FFF; text-align:center; line-height:25px;  border-right:1px #fff dotted;} 
.shopping-car td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.shopping-car img.pro-photo { width:90px; height:90px; padding:10px; border:1px #CCC solid;}
.shopping-car .pro-name { font-size:15px; color: #333; text-align:left;}
.shopping-car .price { font-size:15px; color:#900;}
.shopping-car .numb { font-size:15px; color: #66F;}
.shopping-car .count { font-size:15px; color: #333;}
.shopping-car .count-portal { height:20px; padding:10px 0; border-bottom:1px #CCC dotted;}
                     .count-price { font-size:15px; color: #900; font-weight:bold;}
.shopping-car .portal { display:block; width:200px; font-size:15px; color:#900; float:right; text-align:right;}
.shopping-car .freight { display:block; width:150px; font-size:15px; color:#900; float:right; text-align:right;}

/** 產品陳列 **/
.pro-list { clear:both; margin-bottom:10px;}
.pro-list h3{ margin:20px 0 15px 10px;}
.pro-list-title { font-size:16px; line-height:30px; color: #89B48E; font-weight:bold; padding: 0 0 0px 0; margin-bottom:10px; border-bottom:1px #999 dotted;}
.pro-list ul { list-style:none; margin:0; padding:0;}
.pro-list ul li { margin:5px 10px 25px 10px; width:216px; float:left;}
.pro-list ul li .pro-photo { display:block; width:216px; height:216px; }
.pro-list ul li .pro-photo img { width:100%; height:100%;}
.pro-list ul li .pro-name{ display:block; font-size:16px; color:#333; text-align:center; padding:5px 0; font-family:"微軟正黑體";}
.pro-list ul li .pro-brief { float:left; width:550px; }
.pro-list ul li .pro-brief h3.pro-list-name { font-size:15px; color:#333; margin:0 0 10px 0; padding:0; }
.pro-list ul li .pro-brief p.pro-list-content { margin:0; padding:0px 0; font-size:12px; line-height:1.5em; color: #999;  }

.cart-info { position:absolute; right:10px; bottom: 10px; width:200px;}
.cart-info .price { font-size:18px; font-weight:bold; color: #666; line-height:25px; }
.cart-info .check-out { display:block; float:right; width:90px; text-align:center;}
.cart-info .check-out a { background: #39C; font-size:13px; color:#fff; line-height:25px; display:block;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.cart-info .check-out a:hover { background: #039;}


.pro-detaile { }
h3.pro-detaile-title { border-bottom:1px #06C dotted; font-size:15px; color:#333; line-height:30px; margin-bottom:10px;}
.pro-detaile .pro-photo {background:#fff; float:left; width:200px; height:200px; margin:0 10px 10px 0; padding:8px; border:1px #CCC solid;}
.pro-specification { float:left; width:510px; font-size:12px; line-height:1.5em; color:#333; position:relative; height:220px; margin-bottom:10px;}
.pro-specification p { margin:}
.pro-content { padding:0px 0; font-size:12px; line-height:1.5em; color:#999;} 
.pro-content p.spec { margin:0; padding:0; font-size:12px; line-height:1.5em; color:#333;}


/** 首業主廣告 **/
.edm { background:url(../images/edm01.jpg) top center; height:400px;}
.banner{ background:url(../images/banner.jpg) top center; height:352px;}

/** 左邊選單 **/
.left-menu { }
.left-menu h3 { font-size:18px; line-height:20px; padding:5px 0; color:#999; margin:0 0 5px 0; text-align:center; border-bottom:1px #CCC solid; }
.left-menu ul { list-style:none; margin:0; padding:0; }
.left-menu ul li  { margin:0; padding:0 0 10px 0; }
.left-menu ul li a { font-size:12px; line-height:1.5em; color:#666; display:block; padding:0;}
.left-menu ul li a:hover { color: #36C;}

/** 最新消息 **/
.news-detaile { padding:10px 0;}
.news-detaile h3.title { font-size:18px; line-height:25px; border-bottom:1px #CCC dotted;}
.news-detaile .news-de-time { color:#F60; line-height:25px;}
 .news-detaile .content { font-size:13px; color: #333; line-height:25px;}

/** 首頁最新消息 **/
.index-news-th { border-bottom:1px; border-bottom:1px #CCC solid; padding:5px 0; height:20px; line-height:20px; }
.index-news-th .news-date { display:block; width:99px; font-size:12px; color:#333; text-align:center; border-right:1px #CCC solid; float:left; }
.index-news-th .news-title { display:block; width:630px; font-size:12px; color:#333; text-align:center; float:left; }
.index-news ul { list-style: none; margin:0; padding:0; }
.index-news ul li  { border-bottom:1px #CCC dotted; line-height:1.5em; padding:3px 0;}
.index-news ul li a { font-size:12px;  color:#666; display:block; padding: 5px 0 5px 10px;}
.index-news ul li a:hover { color: #36C;}
.index-news ul li .list-news-date  {display:block; width:100px; font-size:12px; color: #9FAF47; text-align:center; float:left; padding: 5px 0;}
.index-news ul li .list-news  {display:block; width:630px; font-size:12px; color:#333;  float:left; border-left:1px #EEE solid; }


/** 表單 **/
.forms-style01 { border-top:1px #CCC dotted; margin-top:10px; padding-top:10px;}
.forms-style01 ul { list-style:none; margin:0; padding:10px　0;}
.forms-style01 ul li { padding:3px 0;}
.forms-style01 ul li img { vertical-align:middle;}
.forms-style01 .options-th { float:left; width:90px; font-size:12px; color: #999; line-height:25px; text-align:right; padding-right:10px;}
.forms-style01 .options-td { float:left; width:500px; font-size:12px; color:#333; line-height:25px;}
input.input-style01 { background: #EAEAEA ; font-size:12px; color:#333; padding:3px 5px; line-height:15px; border:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 200px;}
textarea.textarea-style01 { background: #EAEAEA ; font-size:12px; color:#333; padding:3px 5px; line-height:15px; border:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; width: 300px;}


/* 頁次 */	
.page{ height:40px; font:13px/40px "微軟正黑體"; color:#333; text-align: center; clear:both; margin-top:10px; border-top:1px #CCC dotted;}
  .page a {color:#333;}
  .page a:hover {color: #C30;}

/** footer **/
.footer { padding:0; font-size:12px; color:#666; border-top:1px #CCC solid; clear:both; margin-top:20px;}
.footer .f-top{ background:url(../images/footer-bg.jpg); height:50px;}
.footer .f-top .f-box{ width:1000px; margin:0 auto;}
.footer .f-top .f-box a{ display:block; background:#202428; width:80px; padding:14px 0; float:right; text-align:center;}

.footer .footer-info{ width:1000px; margin:0 auto;}
.footer .footer-info .footer-logo{ width:270px; height:26px; border-right:1px solid #999; margin:40px 0 34px 0; float:left;}
.footer .footer-info .infor{ float:left; margin:38px 0 34px 30px; width:470px; font-family:"微軟正黑體"; color:#666; font-size:12px;}

.footer .copyright{ float:left; text-align:right; width:230px; margin:38px 0 34px 0; }
.footer .copyright a{ color:#666;}
.footer .copyright a:hover{ text-decoration:underline;}