@charset "utf-8";

/* CSS Document */
html, body, div, p, ul, li, dl, dt, dd, h1, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td { margin: 0; padding: 0; }
img { border: 0 none; font-weight: normal; font-size: 100%; }
ul, li { list-style-type: none; }
body, input, select, button, textarea { font-size: 13px; font-family:Arial, Helvetica, sans-serif; }
button { cursor: pointer; }
h2 { margin:25px 0 25px 0; font-size:16px; font-weight: bold; color: #0081cc; }
body { background-color:#ffffff; color: #505050; line-height: 160%;   }
a, a:link { color: #505050; text-decoration: none; }
a:visited {  }
a:active, a:hover { text-decoration: underline; }
a:focus { outline: none; }
 
 
.clearfix:after{content:"."; display:block; height:0; clear:both; visibility:hidden}
.clearfix{*+height:1%;}
#gotop{ display:none; position: fixed; right: 20px; bottom: 20px; z-index: 999; width: 45px; height: 45px; cursor: pointer; }

/*---------------header---------------------*/
#wrapper{ width:100%; height:100%; margin:0 auto; background-color:#ffffff; }

#header{width:100%; height:84px; background-color:#333; position:fixed; z-index: 9999; }
#header h1{width:490px; height:66px; float:left; display:block; }

#menu_wrap{ width:500px; height:66px; float:right; }
#submenu{ width:500px; float:right; padding:6px 0 0 0; margin:0; }
#submenu ul{ width:500px; padding:0; margin:0 0px 0 0; display:block; float:right;}
#submenu li{ list-style:none; display:block; text-align:left; float:right; color:#666; font-size:12px; margin:0px 12px 0 0px; text-decoration:none;}
#submenu li a{list-style:none; text-align:left; color:#666; font-size:12px; text-decoration:none; }
#submenu li a:hover{list-style:none; text-decoration:none; color:#007ad2;   }
#submenu li.name{ color:#eb2f2f; font-size:12px; }

#search_wrap{ padding:6px 12px 0 0; clear:both; text-align:right; }

#navi { width:1002px; height:35px; padding:0px; margin:0; display:block; z-index:10;}
#navi ul{ list-style-type: none; margin: 0px ; padding: 0; }
#navi li.button { height:35px; float:left; margin:0; display:block; position: relative; }


/*---------------left&content---------------------*/
#content { width:100%; float:left; height:100%; margin:0 0 35px 0;  position:relative; }
#left_wrap{ width:220px; float:left; padding:0; margin:12px 21px 0 12px; }

.leftnavi{ width:220px; float:left; margin:0 0 25px 0px; padding:0; }
.leftnavi dl{ margin:0; padding:0; display:block;}
.leftnavi dt{ height:34px; list-style:none; margin:0; display:block; color: #575757; }
.leftnavi dt a{color:#575757; display:block; background:url(langs/tw/images/sunrich_21.jpg) no-repeat; padding:7px 10px 7px 12px; }
.leftnavi dt a:hover{ color:#ffffff; text-decoration:none; display:block; background:url(langs/tw/images/sunrich_20.jpg) no-repeat; padding:7px 10px 7px 12px; }

.leftnavi dd { color:#505050; margin:0; padding:3px 15px 3px 32px; display:block; }
.leftnavi dd a{ color:#505050; display:inline-block;}
.leftnavi dd a:hover{ color:#0381cd; text-decoration:none; display:inline-block; }
.leftnavi dd.on3{ color:#0381cd; display:inline-block; }
.leftnavi dd.on3 a{ color:#0381cd; text-decoration:none; display:inline-block; }
.leftnavi dd.line{ border-bottom:1px solid #d0d0d0; }

#search { margin:0px 0px 25px 0px; clear:both; }
#c_banner { padding:5px 0px 0px 0px; clear:both; }

#right_content { width:100%; float: left; }

#content2{ margin:0 0 0 16px; }
#content2 div#con{ padding:20px 0 0 0; line-height:30px;}

.title{ width:100%; border-bottom:1px solid #c6c6c6; margin:0 0 20px 0; }
#site-right {float: right; position:relative; margin:7px 0px 0px 0px; font-size:12px; color:#808087;  z-index:3; width:100%; }
#site-right a{ color:#808087;}
#site-right a:hover{ color:#0358ac; text-decoration:none; }
#site-right span.on{ color:#0358ac; }



/*---------------index---------------------*/
#index_banner { width:100%; margin:2px 0 0px 0; border-bottom:3px solid #cccccc; }

#hot_prod{ padding:10px 0px 10px 0px; float:left; height:100%;}
#hot_prev{ width:20px; height:0px; float:left; display:block; position:relative; }
#hot_next{ width:20px; height:0px; float:left; display:block; position:relative; }
#hot_cont{ width:320px; float:left; padding:0px 15px 0 15px; display:block; position:relative; }
#hot_cont ul{ list-style-type: none; margin: 0px ; padding: 0; }
#hot_cont li.prod { height:40px; float:left; margin:0px 6px 0 6px; display:block; position: relative; }
.td_prod { height:40px; padding:0px 6px 0 6px; }

#index_con{ height:134px; padding:0; background:url(langs/tw/images/index_11_m.jpg) no-repeat; clear:both; }
#index_news{ width:290px; float:left; font-size:12px; padding:0; margin:0px 25px 0 25px; }
#index_news_con{ font-size:12px; padding: 3px 0px 0 0; }
#index_news_con ul{ list-style-type: none; margin: 0px ; padding: 0; }
#index_news_con li { margin:6px 0px 6px 3px; }
#index_news_con li a{color:#016781; font-size:12px; text-decoration:none; }
#index_news_con li a:hover{color:#016781; font-size:12px; text-decoration:underline; }

#index_prod{ width:300px; float:left; font-size:12px; padding:0; margin:0px 20px 0 30px; }
#prod_pic{ width:91px; float:left; margin:15px 20px 0 0px; }
#prod_text{ width:188px; float:left; font-size:12px; padding:0; margin:0px 0px 0 0px; }

#index_search{ width:250px; float:left; font-size:12px; padding:0; margin:0px 20px 0 40px; }
#contact_info{ font-size:12px; color:#494949; font-weight:bold; line-height: 1.5; margin:8px 0px 0 0px; padding:0 0px 0 2px; }
#contact_info a{color:#494949; font-size:12px; font-weight:normal; text-decoration:underline; }
#contact_info a:hover{color:#494949; font-size:12px; font-weight:normal; text-decoration:none; }


/*---------------product---------------------*/
.category{ margin:0px 0px 38px 0px; padding:0; }
.list_name{ width:100%; font-weight: bold; color: #5f5f5f; margin:0px 0px 22px 0px; }
.list_line{ width:100%; padding:3px 0px 0px 0px; border-bottom:1px dashed #cecece; clear:both; }
.category_list{ width:100%; color: #5f5f5f; margin:0px 0px 30px 0px; }

.brand{ padding:0px; margin:0; display:block; }
.brand ul{ list-style:none; margin: 0 ; padding: 0;}
.brand li{ display:block; float:left; margin:0px 8px 15px 0px; position: relative; }
.brand li a img{border:1px solid #dcdcdc; }
.brand li a:hover img{border:1px solid #464646; }

#p_content { width:100%; float:left; height:100%; padding:0; margin:0 0 30px 0;  position:relative; }
#p_content2 { width:100%; padding:0; margin:0;  clear:both;  }
#pic_con { width:285px; float:left; margin:0 35px 10px 0;  position:relative; }
.pic { 
 width:285px; 
 height:200px; 
 margin:0 0px 4px 0; 
 text-align:center; 
   
 /* Firefox, Chrome */ 
 line-height : 200px; 
 white-space : nowrap; 
    
 /* IE */ 
 *font-size : 180px;  /* 200px * 0.9 = 180px */ 
 *font-family : Arial; 
}
.pic:after {content : "."; font-size : 0; -webkit-text-size-adjust : none; }
.pic img {vertical-align : middle; } 
/* .pic 設定圖片垂直置中 */

.zoom{ font-size: 12px; text-align:center;}

#p_text { width:380px; float:left; margin:0 0px 0px 0;  position:relative; }
#p_text_con{ margin:0px 0 15px 5px; }
#p_text_con ul{ list-style-type :none ; padding:0px 0 0 0px;}
#p_text_con li{ background:url(langs/tw/images/dot.gif) no-repeat 0px; LINE-HEIGHT: 1.9; padding-left:16px; background-position : 0 10px; background-position : 0 11px \9; /*IE6、IE7、IE8*/}

#b_text { font-size: 15px; font-weight: bold; color: #176375; margin:0 0px 15px 0; padding:0 0 8px 1px; border-bottom:1px solid #dbdbdb;}

#link {font-size: 12px; color: #464646; }
#link a{ color:#176375; text-decoration: underline; }
#link a:hover{ color:#176375; text-decoration: none;}

#related_prod{ margin:25px 0px 0px 25px; color:#02488d;}
#related_prod ul{ list-style:none; margin: 0 ; padding: 0;}
#related_prod li{ float:left; position: relative; width:195px; background:url(langs/tw/images/dot.gif) no-repeat 0px; margin:0 15px 10px 0px; padding:0 0 0 15px; background-position : 0 10px; background-position : 0 8px \9; /*IE6、IE7、IE8*/ }
#related_prod li a{color:#02488d; text-decoration: underline; }
#related_prod li a:hover{ color:#02488d; text-decoration: none; }


/*---------------company & news---------------------*/
#c_content { width:100%; padding:20px 0 20px 0; }
#company_left{ width:297px; float:left; margin:45px 35px 0px 0px; }
.about_text { line-height: 1.9; }
.orange_text { font-size: 13px; color: #ec6a00; }

#n_content { width:100%; padding:10px 0 0 0; margin:0 0 15px 0; }
.news_line{ border-bottom:1px solid #dddddd; }
.news { padding:0 0 0 12px; }
.news a{ color:#505050; text-decoration: none; }
.news a:hover{ color:#016781; left: 1px; top: 1px; position: relative; text-decoration: none;}
.news_date{ font-size: 12px; color:#8f8f8f; text-align: center; }
.news_date2{ font-size: 12px; color:#8f8f8f; text-align: right; padding:5px 20px 0 0;}
.news_bg { background:url(langs/tw/images/news_bg_m.jpg) no-repeat; height:33px; }
.news_title { color:#016781; padding:4px 0px 0px 15px; }
.news_con { padding:7px 15px 20px 15px; margin:0px 0px 8px 0px; border-bottom:1px solid #dddddd; }
.news_back{ text-align: right; margin:10px 5px 0px 0px; }



/*---------------member---------------------*/
#m_content { width:100%; padding:0; margin:0 0 15px 0; }
#login_pic { margin:0 0 0 0; }
#loginForm{ width:100%; margin:0 auto; }
.login_bt{ padding:0 0 7px 0; text-align: right; }
#login_line { width:100%; padding:20px 0 0 0; margin:35px 0 0 0; border-top: #e0e0e0 1px solid; text-align: center;}

.join_form { margin:0px 0 10px 0; font-weight: bold; color: #000000; }
.join_table { border: #cccccc 1px solid; margin:0px 0 30px 0; }
.join_table2 { border: #cccccc 1px solid; margin:0px 0 30px 0; padding:20px; }
.join_td { border-bottom: #cccccc 1px solid; }
.star { font-size: 12px; color: #eb8045; }
.star_text{ font-size: 12px; }
.read { font-size: 12px; color: #eb8045; margin: 10px 0px 22px 0; }
.red_text { color: #e90300; }


/*---------------inquiry---------------------*/
#s_content { width:100%; padding:25px 0 0px 0; }
#search_form{ width:100%; margin:0 auto; height:147px; background:url(langs/tw/images/search_bg1.jpg) no-repeat ; }
#search_form div.go{ padding:55px 0 0 20px ; }
#search_record{ width:100%; margin:0 auto; padding:0 8px 15px 0;  }
#search_record a{font-size: 13px; font-weight: bold; color: #ec7500; text-decoration: underline;}
#search_record a:hover{ font-size: 13px; font-weight: bold; color: #02488d; text-decoration: none;}

#result_text { width:100%; padding:3px 0 0px 0; }
.result_mark { color: #f30b0b;  }
#search_result { width:100%; padding:12px 0 0px 0; }
#search_result td{ text-align: center; }
.td_name { color: #e0e0e0; }
.prod_name { font-weight: bold; color: #ffffff; text-align: left; padding:0 0 0 18px; }
.brand_name { text-align: left; padding:0 0 0 18px; }
.add_inquiry { margin: 27px 0px 0px 0; text-align: center; }
.logo { padding:3px 0 3px 0px; }


#inquiry_list td{ text-align: center; border-bottom: #dfdfdf 1px solid; }
.prod_name2 { text-align: left; padding:0 0 0 10px; }
.brand_name2 { text-align: left; padding:0 0 0 10px; }
.info_pic { margin: 25px 0px 20px 0; }

#search_right{ width:100%; float:right; margin:0px 0px 15px 0px; }
.look {color: #005ab3; }
.look a{ color:#005ab3; text-decoration: underline; }
.look a:hover{ color:#005ab3; text-decoration: none;}

.page { font-size: 12px; color: #555555; }
.page a{ color:#555555; text-decoration: none; }
.page a:hover{ color:#d70028; text-decoration: none;}
.page_on { font-size: 12px; font-weight: bold; color: #d70028; }

.total { font-size: 15px; font-weight: bold; color: #e90300; text-align: right; margin:12px 8px 0 0px; }
.message_pic { margin: 35px 0px 3px 0; }
.price {color: #f35f0d; }
.price2 {font-weight: bold; color: #f35f0d; }



/*---------------contact---------------------*/
.com_name{ font-weight: bold; color: #0452a0; }

.tel_title{ font-size: 12px; color: #878787; }
.map a{ color:#d20b08; text-decoration: none; }
.map a:hover{ color:#d20b08; text-decoration: underline;}

.contact_bg{ background:url(langs/tw/images/contact_bg.jpg) no-repeat right bottom; border-bottom: #2d75bc 2px solid; margin: 0px 0px 5px 0; padding:0 0 15px 10px; }
.contact_button{ text-align: center; margin:22px 5px 0 0;  }
.space{ padding:0px 0px 0 10px;  }
#contact_form td{ border-bottom: #e4e4e4 1px solid;  }


/*---------------form---------------------*/
form { margin: 0 0px; padding: 0px; }
.input { _position: relative; border: #cccccc 1px solid; width: 90%; height: 19px; COLOR: #505050; background-color: #f0f0f0; font-family: Arial, Helvetica, sans-serif; }
.textfield { _position: relative; border: 1px solid #E0E0E0; font-family:Arial, Helvetica, sans-serif; height: 16px; color: #666666; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FEFEFE', endColorstr='#eeeeee',GradientType=0 ); padding:3px;}
.textarea { border: #cccccc 1px solid; width: 100%; height: 120px; COLOR: #505050; background-color: #ffffff; padding:10px; }
.select { _position: relative; border: 1px solid #E0E0E0; color: #949CA3; font-family:Arial, Helvetica, sans-serif; font-size:11px; height: 23px; letter-spacing:1px;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FEFEFE', endColorstr='#eeeeee',GradientType=0 ); padding:1px;}
.option { font-size:12px; color:#333; font-weight:bold;}

.search_input { border: #cdcdcd 1px solid; width: 200px; height: 21px; color: #505050; padding:0 0 0 5px; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; }
.login_input { border: #7f9db9 1px solid; width: 250px; height: 21px; color: #505050; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; }
.search_input2 { border: #6b7b8a 1px solid; width: 230px; height: 30px; color: #505050; padding:0 0 0 5px; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; }
.inquiry_input { border: #afafaf 1px solid; width: 190px; height: 20px; font-size:11px; color: #505050; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; }
.inquiry_input2 { border: #afafaf 1px solid; width: 85px; height: 20px; font-size:12px; color: #505050; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; }
.textarea2 { border: #cccccc 1px solid; width: 90%; height: 90px; COLOR: #505050; background-color: #f5f5f5; margin:9px 0 8px 0; }
.contact_input { border: #cccccc 1px solid; width: 90%; height: 20px; COLOR: #505050; background-color: #f5f5f5; font-family: Arial, Helvetica, sans-serif; }



/*---------------------------- footer css----------------------------------------------------- */
#footer{ clear:both; width:1002px; padding:0px 0 10px 0; display:block; font-size:12px; background-color: #eaeaea; }
#footer div#footmenu{ margin:2px 20px 0px 15px; color:#adadad;}
#footer div#footmenu a{ color:#666666;}
#footer div#footmenu a:hover{ color:#00509f; text-decoration: none; }
#footer div#footmenu ul li{ float:right; padding:0 0px 0 10px; }

#info{ clear:both; width:972px; text-align: left; padding:2px 0px 0 20px; color:#767676;}
#copyright{ width:972px; text-align: left; font-size:11px; padding:0px 0px 0 20px; color:#898989;}



/*---------------QUOTATION PDF---------------------*/
.pdf-com-info{ text-align: right; font-size:12px; color:#666666; line-height: 145%; }
.quotation{ text-align: center; font-weight:bold; font-size:60px; color:#000000; font-style: italic; padding:40px 0 25px 0; }
.pdf-space{ padding:7px 10px 7px 10px; }
.pdf-space01{ padding:15px 10px 15px 10px; }
.total{ font-weight:bold; font-size:18px; color:#000000; line-height: 2.0; }
.total_text{ font-weight:bold; font-size:14px; color:#505050; }



