@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:#e1e1e1; color: #363636; line-height: 160%;   }
a, a:link { color: #363636; 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%;}

.demo:after,.demo2:after{content:"."; display:block; height:0; clear:both; visibility:hidden}
.demo,.demo2{*+height:1%;}


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

#header{width:1002px;  padding:0; display:block; height:80px; }
#header h1{width:245px; height:49px; margin:15px 0 0px 20px; float:left; display:block; }

#submenu{ width:350px; float:right; padding:16px 0 0 0; margin:0; }
#submenu ul{ width:350px; 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 15px 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;   }

#navi { width:1002px; height:34px; padding:0px; margin:0; display:block; z-index:10;}
#navi ul{ list-style-type: none; margin: 0px ; padding: 0; }

#navi li.button { height:34px; float:left; margin:0; display:block; position: relative; }


/*---------------left&content---------------------*/
#content { width:1002px; float:left; height:100%; margin:0 0 45px 0;  position:relative;}
#left_wrap{ width:224px; float:left; padding:0; margin:0 0px 0 0; background:url(images/yuhseng_20.jpg) no-repeat right 96px;}

.leftnavi{ width:185px; float:left; margin:0 0 120px 20px; padding:0; }
.leftnavi dl{ margin:0; padding:0; display:block;}
.leftnavi dt{ height:30px; list-style:none; margin:0; padding:6px 0px 0 8px; display:block; font-weight: bold; color: #686868; border-bottom:1px solid #d0d0d0;}
.leftnavi dt a{color:#686868; display:inline-block; }
.leftnavi dt a:hover{ color:#0381cd; text-decoration:none; display:inline-block;}

.leftnavi dt.on2{ height:30px; color:#0381cd; text-decoration:none; display:block; font-weight: bold; padding:6px 10px 0 15px;}
.leftnavi dt.on2 a{ color:#0381cd; text-decoration:none; display:inline-block; padding:0; }
.leftnavi dt.on2 a:hover{color:#0381cd; text-decoration:none; }

.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; }

.leftnavi_bg{ background:url(images/yuhseng_20.jpg) no-repeat right top;}

#right_content { width:778px; margin:0; padding:0; float: left; }

.title{ width:710px; margin:0 auto; border-bottom:1px solid #c6c6c6;}
#site-right {float: right; position:relative; margin:5px 0px 0px 20px; font-size:12px; color:#3885bc; text-align:right; z-index:3; width:500px; }
#site-right a{ color:#999999;}
#site-right a:hover{ color:#3885bc; text-decoration:none; }

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


/*---------------index---------------------*/
#content_index { width:1002px; float:left; height:100%; margin:0 0 15px 0;  position:relative; background:url(images/index_04.jpg) repeat-x;}
#index_left{ width:443px; float:left; padding:0; margin:25px 27px 0 15px; }
#index_left div#hot{ width:429px; float:left; height:110px; border:1px solid #d0d0d0; background-color:#f1f1f1; padding:11px 0px 12px 12px; margin:5px 0 0 0; }
#index_left div#hot ul{ list-style-type: none; }
#index_left div#hot li{ width:131px; height:auto; float:left; margin: 0px 12px 0 0 ; position: relative; }
.p_pic{ width:129px; height:90px; border:1px solid #c4c4c4;}
.p_name {color:#333333; font-size:12px; margin: 5px 0px 0 0; }
.p_name a{color:#333333; font-size:12px; text-decoration:none; }
.p_name a:hover{list-style:none; text-decoration:none; color:#016fa9; }

#next{ width:100px; float:right; padding:0; margin:5px 0px 0 0px; text-align:right; position:relative; }

#index_center{ width:295px; float:left; font-size:12px; padding:0; margin:25px 22px 0 0px; }
.center_text{ color:#016db6; }
.center_text02{ line-height: 1.7; margin:6px 0px 0 0px; }
#more{ width:77px; float:right; padding:0; margin:62px 0px 0 0px; text-align:right; position:relative; }

#index_right{ width:195px; float:left; font-size:12px; padding:0; margin:25px 0px 0 0px; }
#contact_info{ height:154px; margin:8px 0px 0 0px; padding:0 10px 0 0; background:url(images/index_13.jpg) no-repeat;}
#map{ width:77px; float:right; padding:0; margin:39px 0px 0 0px; text-align:right; }


/*---------------product---------------------*/
.category_con{ margin:0px; }
.table{ background-color:#7d7d7d; }
.list_text{ font-weight: bold; color: #ffffff; }
.product_name{ color: #202020; }
.product_name a{ color:#202020; text-decoration: underline; }
.product_name a:hover{ color:#202020; text-decoration: none;}
.product_name2{ color: #ffffff; }
.product_name2 a{ color:#ffffff; text-decoration: underline; }
.product_name2 a:hover{ color:#ffffff; text-decoration: none;}
.pic_space{ padding:3px; }
.style1 {color: #FFFFFF}

#p_content { width:710px; float:left; height:100%; padding:0 0 20px 0; margin:0 0 30px 0;  position:relative; border-bottom:1px dotted #bebebe;}
#pic_con { width:367px; float:left; margin:0 50px 10px 0;  position:relative; }
.pic { 
 width:365px; 
 height:255px; 
 margin:0 0px 4px 0; 
 text-align:center; 
 border:1px solid #d4d4d4;
   
 /* Firefox, Chrome */ 
 line-height : 255px; 
 white-space : nowrap; 
    
 /* IE */ 
 *font-size : 230px;  /* 255px * 0.9 = 229.5px */ 
 *font-family : Arial; 
}
.pic:after {content : "."; font-size : 0; -webkit-text-size-adjust : none; }
.pic img {vertical-align : middle; } 
/* .pic 設定圖片垂直置中 */

.zoom{ font-size: 11px; color:#343434; text-align:right;}

#p_text { width:290px; float:left; margin:0 0px 0px 0;  position:relative; }
#p_text_con ul{ list-style-type :none ; margin:0px; padding:0px 0 0 0px;}
#p_text_con li{ background:url(images/icon_02.jpg) no-repeat 0px; LINE-HEIGHT: 1.9; padding-left:16px; background-position : 0 10px; background-position : 0 8px \9; /*IE6、IE7、IE8*/}

#b_text { font-size: 15px; font-weight: bold; color: #0568a7; margin:0 0px 15px 0; }
#b_text2 { font-size: 15px; font-weight: bold; color: #0568a7; margin:0 0px 20px 0; clear:both; }

#small { width:290px; height:56px; padding:0px; margin:35px 0 0 0; display:block; z-index:10;}
#small ul{ list-style-type: none; }
#small li.pics { height:56px; float:left; margin: 0px 8px 8px 0 ; display:block; position: relative; border:1px solid #d4d4d4;}


/*---------------news---------------------*/
#content4{ width:669px; margin:0 auto; padding:30px 0 0 0; }

.news_line { border-bottom:1px solid #e3e3e3; }

.news a{ font-size: 13px; font-weight:bold; color:#474747; text-decoration: none; padding:0 0 0 8px; }
.news a:hover{ font-size: 13px; font-weight:bold; color:#0381cd; text-decoration: none;}

.news_date{ font-size: 12px; color:#888888; text-align:center; }
.news_date2{ font-size: 12px; color:#ffffff; text-align:center; }
.news_title { font-size: 13px; font-weight:bold; color:#ffffff; border-right:1px solid #ffffff; padding:5px 12px 5px 15px; }
.news_con { padding:22px 15px 22px 15px; border-bottom:1px solid #acacac; }
.news_back{ text-align: right; margin:10px 0px 0px 0px; }

.page {color:#d4d4d4; font-size:12px; width:670px; margin:0; text-align:center; padding:18px 0 0 0; clear:both;}
.page a{color:#57575d; font-size:12px; text-decoration:none; }
.page a:hover{font-weight: bold; text-decoration:none; color:#016edc; }
.page span.on{font-weight: bold; text-decoration:none; color:#016edc; }



/*---------------contact---------------------*/
.com_name{ font-weight: bold; color: #0381cd; }

#content3{ width:669px; margin:0 auto; }
#content3 div#contact{ padding:23px 0 25px 5px; }

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

.form_bg{ background:url(images/contact_06.jpg) repeat; }
.contact_button{ text-align: right; margin:17px 5px 0 0; }


/*---------------form---------------------*/
form { margin: 0 0px; padding: 0px; }
.input { _position: relative; BORDER: #cccccc 1px solid; WIDTH: 488px; HEIGHT: 19px; COLOR: #262626; 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 { _position: relative; BORDER: #cccccc 1px solid; WIDTH: 488px; HEIGHT: 100px; COLOR: #262626; BACKGROUND-COLOR: #f0f0f0; }
.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;}
.radio { _position: relative; background: transparent; filter:progid: DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#FFFFFF', gradientType='0'); font-family: Arial, Helvetica, sans-serif;}


/*---------------------------- footer css----------------------------------------------------- */
#footer{ clear:both; width:1002px; height: 92px; padding:0; display:block; font-size:12px; background:url(images/yuhseng_34.jpg) no-repeat;}
#footer div#footmenu{ width:972px; padding: 10px 30px 0 0; color:#c5c5c5;}
#footer div#footmenu a{ color:#c5c5c5;}
#footer div#footmenu a:hover{ color:#ffffff;}
#footer div#footmenu ul li{ float:right; padding:0 0px 0 10px; }

#info{ clear:both; width:972px; text-align: right; padding:10px 30px 0 0; color:#cccccc;}
#copyright{ width:972px; text-align: right; font-size:11px; padding:0px 30px 0 0; color:#a6a6a6;}