@charset "utf-8";

/* CSS Document */
html, body, div, p, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td {
	margin: 0;
	padding: 0;
	color: #000000;
}
body { background:url(langs/tw/images/bg.jpg) repeat-x #4c4c4c; font-size: 15px; color:#484848; line-height: 170%; font-family: "Open Sans", 微軟正黑體, Arial, Helvetica; }
input, select, button, textarea { font-size: 15px; font-family: "Open Sans", 微軟正黑體, Helvetica, Arial; }
button { font-family:微軟正黑體, Arial, Helvetica; border:0; cursor:pointer; }
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button; }
ul, li { list-style-type:none; }
a { text-decoration:none; color:#484848; border:none; outline:none; }
a img { border:0; outline:none; }
a:hover { color:#007cd4; }

.clearfix:before,
.clearfix:after {
  display: table;
  content: " ";
}
.clearfix:after {
  clear: both;
}


/*---------------layout---------------------*/
#wrapper{ width:1100px; height:100%; margin:0 auto; background-color:#fff; position:relative; }

#header{width:1100px; height:86px; padding:0; display:block; background-color:#000; }
#header h1{width:235px; height:86px; float:left; display:block; margin:0 38px 0 0; }

#navi-wrap{ width:657px; float:left;  }
#navi-block{ margin:0 auto; display:table; }

/*
#navi { text-align:center; }
#navi ul{ list-style-type:none; }
#navi li{ float:left; height:86px; font-size:16px; font-weight:bold; color:#ededed; line-height:86px; text-align:center; }
#navi li a{ color:#ededed; padding:0 42px 0 42px; display:block; }
#navi li a:hover{ color:#f6cf00; background-color:#5c5c5c; }
*/


/*--------------*/
#nav { text-align:center; }
#nav > ul{ list-style-type:none; height:86px; }
#nav > ul > li{ float:left; width:150px; font-size:16px; font-weight:bold; color:#ededed; line-height:86px; text-align:center; position: relative; }
#nav > ul > li a{ color:#ededed; display:block; }
#nav > ul > li a:hover{ color:#f6cf00; background-color:#5c5c5c; }
#nav > ul > li.now a{ color:#f6cf00; background-color:#5c5c5c; }


#nav > ul > li > div{ position:absolute; border-radius:0 0 5px 5px; box-shadow:0 3px 3px 0 rgba(0, 0, 0, 0.5); background-color:#535353; filter:alpha(opacity=95); background: rgba(83,83,83,0.95); width:1101px; top:86px; z-index:9999; }
#nav > ul > li > div:after{	content:"";	clear:both;	display:block; }
#nav > ul > li.product > div{ left:-452px; }
#nav > ul > li > div > ul{ float:left; }
#nav > ul > li > div > ul.subNav{ width:100%; }
#nav > ul > li > div > ul.subNav:after{	content:""; clear:both; display:block; padding-bottom:25px; }
#nav > ul > li > div > ul.subNav > li{ width:150px; margin:26px 0 0 33px; float:left; }
#nav > ul > li > div > ul.subNav > li.firstInRow{ clear:both; }
#nav > ul > li > div > ul.subNav > li h3{ font-size:15px; color:#f6cf00; line-height:21px; text-align:left; }
#nav > ul > li > div > ul.subNav > li h3 a{ color:#f6cf00; padding:0; background-color: transparent; }
#nav > ul > li > div > ul.subNav > li h3 a:hover{ color:#f6cf00; }
#nav > ul > li > div > ul.subNav > li ul{ margin-top:12px; background-color:none; }
#nav > ul > li > div > ul.subNav > li ul li{ font-size:14px; margin-top:6px; line-height:22px; text-align:left; }
#nav > ul > li > div > ul.subNav > li ul li a{ color:#fff; font-weight:normal; padding:0; text-decoration:none; background-color: transparent; }
#nav > ul > li > div > ul.subNav > li ul li a:hover{ color:#f6cf00; }



#lang-icon { width:auto; display:block; float:left; margin:30px 0 0 25px; }
#lang-icon ul{ list-style-type:none; }
#lang-icon li{ float:left; font-size:13px; color:#c1c1c1; padding:0 0 0 14px; margin:0 0 0 14px; background:url(langs/tw/images/line.jpg) no-repeat left 8px; }
#lang-icon li a{ color:#c1c1c1; }
#lang-icon li a:hover{ color:#a2d6fc; }
#lang-icon li:first-child{ padding-left:0; margin-left:0; background:none; }


#content{ width:1044px; margin:0 auto; height:100%; margin-top:20px; padding-bottom:70px; position:relative; z-index:10; }



.site { font-size:14px; color:#7a7a7a; margin:0 0 25px 1px; }
.site a{ color:#7a7a7a; }
.site a:hover{ color:#007cd4; }
.site span.on a{ color:#007cd4; }
.site span.arr{ margin:0 7px 0 7px; }

.title{ padding:0 0 12px 1px; margin:0 0 40px 0; border-bottom:1px solid #dbdbdb; }
.title h3{ font-size:28px; font-weight:normal; color:#353535; }

.search{ float:right; margin:0 0 0 30px; }
.search-btn{ vertical-align:top; cursor:pointer; }




/*---------------index---------------------*/
#index-bg{ background-color:#000; }




/*---------------product---------------------*/
#prod-wrap { width:1044px; margin:0 0 40px 0; position:relative; }
#prod-content { width:645px; float:left; margin:0 15px 0 0; }
#pic-con { margin:0 0 40px 0; text-align:center; cursor:pointer; }

#small { height:100%; float:left; display:block; }
#small ul{ width:118px; float:left; margin: 0 12px 25px 0; }
#small ul:nth-child(5n){ margin-right:0; }
#small li.photo{ width:118px; height:118px; display:block; text-align:center; border:1px solid #cdcdcd; cursor:pointer; }
#small li.photo:hover{ border:1px solid #007cd4; }
#small li.prod-model, .prod-model a{ font-size:14px; color:#414141; height:38px; margin:9px 0 0 0; text-align:center; line-height: 20px;}
#small li.prod-model a:hover{ color:#007cd4; }


#p_text_block { width:384px; float:left; }
.product-name { font-size: 27px; color: #626262; padding:17px 0 15px 2px; border-bottom:1px solid #dbdbdb; }
.p-text-con{ margin:22px 0 30px 3px; line-height: 30px; }
.p-text-con02{ padding:22px 0 30px 3px; line-height: 30px; border-bottom:1px solid #dbdbdb; }
.p_text_title{ font-size:17px; color: #000; padding:0 0 8px 2px; }

.prod-power{ padding:14px 0 4px 0; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; }
.prod-power-bg{ width:73px; float:left; font-size: 14px; color: #515151; padding:0 10px 0 0; margin:0 12px 0 1px; text-align:center; background:url(langs/tw/images/size-bg.png) no-repeat; line-height: 23px;}
.prod-power-text{ width:100%; float:left; }
.prod-power-text ul{ list-style-type: none; margin:-1px 0 0 3px; }
.prod-power-text li{ float:left; font-size: 15px; color: #585858; padding:0 14px 0 0; margin:0 14px 9px 0; background:url(langs/tw/images/line-02.jpg) no-repeat right 6px; }
.prod-power-text li a{ color: #585858; }
.prod-power-text li a:hover{ color: #007cd4; text-decoration:underline; }
.prod-power-text li:last-child{ background:none; padding-right:0; margin-right:0; }

.back{ margin:15px 0 0 0; text-align:right; }


.spec-title-block{ border-bottom:1px solid #d0d0d0; }
.spec-title{ width:200px; font-size: 16px; color: #242424; padding:7px 0 6px 0; background-color:#e8e8e8; text-align:center; border-radius:10px 10px 0 0; }
.spec-con{ margin:35px 0 35px 1px; line-height: 28px; }
.spec-con li{ list-style:inside disc; }
.back-btn{ float:right; }


.search-list { width:1042px; float:left; display:block; margin:0 0 0 2px; }
.search-list ul{ width:118px; float:left; margin: 0 35px 35px 0; }
.search-list ul:nth-child(7n){ margin-right:0; }
.search-list li.photo{ width:118px; height:118px; display:block; text-align:center; border:1px solid #cdcdcd; cursor:pointer; }
.search-list li.photo:hover{ border:1px solid #007cd4; }
.search-list li.prod-model, .prod-model a{ font-size:14px; color:#414141; margin:9px 0 0 0; text-align:center; line-height: 20px;}
.search-list li.prod-model a:hover{ color:#007cd4; }



.mobile-nav ul{ float:left; width:100%; background-color:#646464; }
.mobile-nav ul.subNav{ width:100%; }
.mobile-nav ul.subNav:after{ content:""; clear:both; display:block; padding-bottom:25px; }
.mobile-nav ul.subNav li{ width:150px; margin:26px 0 0 33px; float:left; }
.mobile-nav ul.subNav li.firstInRow{ clear:both; }
.mobile-nav ul.subNav li h3{ font-size:15px; color:#f6cf00; margin-bottom:-6px; line-height:21px; text-align:left; }
.mobile-nav ul.subNav li h3 a{ color:#f6cf00; padding:0; background-color:transparent; }
.mobile-nav ul.subNav li h3 a:hover{ color:#f6cf00; }
.mobile-nav ul.subNav li ul{ margin-top:12px; background-color:#none; }
.mobile-nav ul.subNav li ul li{ font-size:14px; margin:6px 0 0 0; line-height:22px; text-align:left; }
.mobile-nav ul.subNav li ul li a{ color:#fff; font-weight:normal; padding:0; text-decoration:none; background-color: transparent; }
.mobile-nav ul.subNav li ul li a:hover{ color:#f6cf00; }



.page_block{ margin:0 auto; display:table; clear:both; }

.page{ font-size: 13px; color:#828282; text-align:center; margin:0; height:100%; }
.page ul{ list-style-type: none; margin:0px ; }
.page li { float:left; margin:0px 5px 0px 0px; text-align:center; }
.page li a{color:#9b9b9b; width:22px; height:22px; padding:3px; border:1px solid #b8b8b8; display:block; text-decoration:none; line-height: 22px; }
.page li a:hover{color:#f54b46; border:1px solid #f54b46; display:block; text-decoration:none; }
.page li.on{color:#f54b46; font-weight: bold; width:22px; height:22px; padding:3px; border:1px solid #f54b46; display:block; line-height: 22px; }
.page li:last-child { margin-right:0;}




/*---------------about & quality---------------------*/
.about-con{ padding:25px 0 70px 0; min-height:316px; background:url(langs/tw/images/about_03.jpg) no-repeat left 25px; }
.about-text-block{ margin:0 0 0 568px; }
.about-title{ font-size: 24px; color: #1a1a1a; margin:0 0 22px 0; }
.about-logo{ margin:0 20px 0 0; vertical-align: baseline; }
.about-text{ font-size: 16px; padding:0 0 0 3px; line-height:35px; }


.quality-con{ padding:25px 0 70px 0; min-height:316px; }




/*---------------contact---------------------*/
.contact_info{ width:240px; float:left; padding:20px 25px 25px 25px; margin:0 40px 0 0; background-color:#f4f4f4; }
.company-name{ font-size:20px; color: #202020; margin:3px 0 12px 2px; }

.info_text{ font-size: 14px; }
.info_text a:hover{ color: #0472bc; text-decoration:underline; }
.info_text p{ padding:0px 0 0 55px; min-height:45px; line-height:52px; }
.info_tel{ font-size:20px; color: #0472bc; background:url(langs/tw/images/tel.png) no-repeat 0px 11px; }
.info_fax{ font-size:20px; color: #0472bc; background:url(langs/tw/images/fax.png) no-repeat 0px 11px; }
.info_email{ background:url(langs/tw/images/mail.png) no-repeat 0px 10px; }
.info_address{ background:url(langs/tw/images/address.png) no-repeat 0px 10px; color: #353535; }
.info_address_text{ line-height:28px; }


.contact_form{ width:714px; float:left; }

.contact_text{margin:0 0px 20px 0; padding:0 0 14px 0; border-bottom:1px dotted #c7c7c7; }
.star02{ font-size:13px; color: #e60012; margin:0 0px 0 3px; }
.input-space{margin:0 0 0 16px; }
.input-space02{margin:0 0 0 26px; }


.submit{ width:135px; height:40px; float:right; font-size: 16px; color: #fff; text-align:center; margin-right:3px; padding:0 0 1px 0; background-color:#156aab; display:block; border-radius:6px; }
.submit:hover, .submit:focus{ background-color:#bb9001; color: #fff; }


.contact-bg{ width:376px; height:272px; left:0; bottom:17px; position:absolute; background:url(langs/tw/images/contact-bg.jpg) no-repeat; z-index:3; }



/*---------------form---------------------*/
form { margin: 0 0px; padding: 0px; }

.input { border: #c8c8c8 1px solid; width: 225px; height: 25px; color: #333333; background-color: #fff; padding:3px 10px 3px 10px; border-radius:4px; }
.textarea {border: #c8c8c8 1px solid; width: 595px; height: 165px; color: #333333; background-color: #fff; padding:5px 10px 5px 10px; margin:16px 0 16px 0; border-radius:4px; }
.select { border: 1px solid #c2c2c2; color: #505050; height:27px; padding:3px 3px 3px 3px; font-family: Arial, Helvetica, sans-serif; }
.option { font-size:12px; color:#333; font-weight:bold;}

.code-input { border: #c8c8c8 1px solid; width: 180px; height: 26px; COLOR: #333333; background-color: #fff; padding:3px 10px 3px 10px; border-radius:4px; }
.search-input { border: #b5b5b5 1px solid; border-right: none; width: 150px; height: 23px; color: #727272; background-color: #f3f3f3; padding:0px 8px 0px 8px; }
.search-input1 { border: #b5b5b5 1px solid; border-right: none; color: #727272; background-color: #f3f3f3; padding:0px 8px 0px 8px; }




/*---------------------------- footer css----------------------------------------------------- */
#footer{ background-color:#000; }
#footer-block{ width:1070px; margin:0 auto; padding:19px 15px 18px 15px;}

#footer-navi{ margin:0 40px 0 0; }
#footer-navi ul{ list-style-type: none; }
#footer-navi li{ float:left; font-size: 14px; color: #7d7d7d; padding:0 0 0 14px; margin:0 0 0 14px; background:url(langs/tw/images/line-03.jpg) no-repeat left 7px; }
#footer-navi li a{ color: #7d7d7d; }
#footer-navi li a:hover{ color: #f6cf00; }
#footer-navi li:first-child{ margin-left:0; padding-left:0; background:none; }

.copyright{ float:right; font-size: 13px; color: #6a6a6a; }
.copyright a{ color: #6a6a6a; }
.copyright a:hover{ color: #01a485; }


#footer-info{ font-size: 14px; color: #7d7d7d; padding:8px 0 0 0; clear:both; }