@charset "utf-8";
/* CSS Document */

@import url("reset.css");


/*  ================ htm ================ */
body, table {font:12px/1.5 Arial, sans-serif, Verdana, Geneva, sans-serif; color:#999; line-height:20px; letter-spacing:0.1em;}
input, select, textarea {font:0.9em/1.2 Verdana, Arial, Helvetica, sans-serif; color:#666;}
form {margin:0; padding:0;}
strong {font-weight:bold;}
A:hover {text-decoration:underline;}
A:link {color:#999;}
A:visited {color:#999;}
A:active, A:hover {color:#00b9e7;}
A:link, A:visited, A:active {text-decoration:none;}



/*  ================ layout ================ */
#layout{width:100%;background:url(../images/header-bg.gif) 0 0 repeat-x; height:110px;}
#header{margin:0 auto;width:960px; height:110px;}
/*Mars add chrome css hack*/
body:nth-of-type(1) #header{margin:0 auto;width:960px; height:80px;}

#container{margin:0 auto;position:relative; width:960px;*padding-top:10px;_padding-top:-5px;}
#side-Right{ float:right; width:160px;padding-top:10px;}
#Main {float:left;width:800px; }
#side-Left{float:left;width:140px; padding-top:10px;}
#Main-contnet {float:right;width:630px; padding:15px 15px 0 15px;}
#Main-contnet p{}
#Main-contnet p a{ color:#00b9e7;text-decoration:none; border-bottom:#00b9e7 solid 1px;}
#Main-contnet p a:hover{color:#00b9e7;text-decoration:none; border:none;}
#Main-contnet p span{ color:#000;}
#sub-main{width:960px;}

.logo{ display:block; float:left; width:140px; height:65px; margin-top:28px;}

/* ================ nav ================ */
#nav{ float:right;width:780px; height:55px; padding-top:55px; position:relative; z-index:1;_padding-top:0px;_margin-top:55px;}
#nav ul{}
#nav li{ float:left;}
#nav li a.product{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:0 0; background-repeat:no-repeat; text-indent:-9999px;}
#nav li a.product:hover{background:url(../images/btn.gif);background-position:0 -55px;}
/* #nav li a.focus-pro{display:block; width:130px; height:55px;background:url(../images/btn.gif);background-position:0 0; background-repeat:no-repeat; background-position:0 -55px;text-indent:-9999px;}    換頁停留在此圖片*/
#nav li a.industry{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:-130px 0; background-repeat:no-repeat; text-indent:-9999px;}
#nav li a.industry:hover{background:url(../images/btn.gif);background-position:-130px -55px;}
#nav li a.case{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:-260px 0; background-repeat:no-repeat;text-indent:-9999px;}
#nav li a.case:hover{background:url(../images/btn.gif);background-position:-260px -55px;}
#nav li a.service{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:-390px 0; background-repeat:no-repeat;text-indent:-9999px;}
#nav li a.service:hover{background:url(../images/btn.gif);background-position:-390px -55px;}
#nav li a.nextlink{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:-520px 0; background-repeat:no-repeat;text-indent:-9999px;}
#nav li a.nextlink:hover{background:url(../images/btn.gif);background-position:-520px -55px;}
#nav li a.demo{ display:block; width:130px; height:55px;background:url(../images/btn.gif); background-position:-650px 0; background-repeat:no-repeat;text-indent:-9999px;}
#nav li a.demo:hover{background:url(../images/btn.gif);background-position:-650px -55px;}

.uplink{ position:absolute; right:0; top:10px; width:260px; height:18px; z-index:5;_top:-45px;}
.uplink ul{float:right;}
.uplink li{padding-left:10px;}
.uplink li a{color:#999;font-family:Arial, Verdana; font-size:12px; color:#999;line-height:18px;}
.uplink li a:hover{color:#000; text-decoration:none;}
.langs{width:65px; height:18px; line-height:18px; border:#C3C3C3 solid 1px;text-align:center; font-size:11px; color:#999;}


/* ================ nav-Over ================ */

.navOver-pro{position:absolute;display:none;width:124px;top:110px;left:3px; text-align:center;z-index:100;_top:55px;}
.navOver-pro #body{ background:url(../images/btn-over_body.gif) 0 0 repeat-y;}
p{}

.navOver-pro a{ color:#999; padding:3px 5px; display:block;border-bottom:#EEE solid 1px; width:113px;}
.navOver-pro a:hover{ color:#FFF; background-color:#000;border:none; text-decoration:none;}

.navOver-industry{position:absolute;display:none;width:124px;top:110px;left:134px; text-align:center;z-index:110;_top:55px;}
.navOver-industry #body{ background:url(../images/btn-over_body.gif) 0 0 repeat-y;}
p{}
.navOver-industry a{ color:#999;padding:3px 5px; display:block;border-bottom:#EEE solid 1px;width:113px;}
.navOver-industry a:hover{ color:#FFF; background-color:#000;border:none;text-decoration:none;}

.navOver-case{position:absolute;display:none;width:124px;top:110px;left:264px; text-align:center;z-index:120;_top:55px;}
.navOver-case #body{ background:url(../images/btn-over_body.gif) 0 0 repeat-y;}
p{}
.navOver-case a{ color:#999;padding:3px 5px; display:block;border-bottom:#EEE solid 1px;width:113px;}
.navOver-case a:hover{ color:#FFF; background-color:#000;border:none;text-decoration:none;}

.navOver-service{position:absolute;display:none;width:124px;top:110px;left:394px; text-align:center;z-index:130;_top:55px;}
.navOver-service #body{ background:url(../images/btn-over_body.gif) 0 0 repeat-y;}
p{}
.navOver-service a{ color:#999;padding:3px 5px; display:block;border-bottom:#EEE solid 1px;width:113px;}
.navOver-service a:hover{ color:#FFF; background-color:#000;border:none;text-decoration:none;}

.header-partline{width:100%; height:10px; background-image:url(../images/header-linebg.gif); background-repeat:repeat-x;} 



/*
#header{margin:0 auto;width:960px; height:110px;}
*/
/* ================ mainIndex ================ */
#keyimg {  margin:0 auto; width:960px; height:340px;border:#e5e5e5 solid 1px; background-color:#fff; margin-top:15px; margin-bottom:30px; text-align:center;*margin-bottom:20px;}
#keyimg ul{width:85px; height:10px;margin:0 auto;  position:absolute; bottom:120px; left:439px; *padding-bottom:145px;}

/*Mars add chrome css hack*/
body:nth-of-type(1) #keyimg ul{bottom:100px;}

#keyimg li {float:left;}
#keyimg li { display:block;padding-right:8px;width:9px; height:10px; background-image:url(../images/btn-point.gif); background-position:0 0; background-repeat:no-repeat;cursor:pointer;}
#keyimg li.activeSlide { background-image:url(../images/btn-point-over.gif);}
#keyimg li:focus{ background-image:url(../images/btn-point-over.gif);}

#keyimg2{  margin: 0 auto; width:960px;z-index:0;}
#keyimg2 img{ width:960px; height:340px; border:none; z-index:110;}

/*
#nav2 a { border: 1px solid #ccc; background: #fc0; text-decoration: none; margin: 0 5px; padding: 3px 5px;  }
#nav2 a.activeSlide { background: #ea0; }
#nav2 a:focus { outline: none; }
*/


.case-index{ float:left;width:330px; padding-right:30px;}
.case-index h3{ display:block; width:85px; height:25px;background:url(../images/title-1.gif) 0 0 no-repeat; text-indent:-9999px; padding-bottom:7px;}
.case-index img{ float:left;width:140px;padding:5px 5px; border:#e3e3e3 solid 1px; text-align:center; margin:0 auto;}
.case-index img:hover{ border:#000 solid 1px;}
.case-txt{ float:right;width:170px; text-align:left;color:#999;}
.case-txt a{color:#00b9e7;text-decoration:none;border-bottom:#00b9e7 solid 1px;}
.case-txt a:hover{color:#00b9e7;text-decoration:none; border:none;}

.industry-index{ float:right;width:600px;}
.industry-index h3{ display:block; width:370px; height:25px;background:url(../images/title-2.gif) 0 0 no-repeat; text-indent:-9999px; padding-bottom:7px;}
.industry-index img{ float:left;width:140px;padding:5px 5px; border:#e3e3e3 solid 1px; text-align:center; margin:0 auto;}
.industry-index img:hover{ border:#000 solid 1px;}
.industry-txt{ float:right;width:440px; text-align:left;color:#999;}
.industry-txt a{color:#00b9e7;text-decoration:none;border-bottom:#00b9e7 solid 1px;}
.industry-txt a:hover{color:#00b9e7;text-decoration:none; border:none;}


.service-btn{ width:600px; height:40px;}
.service-btn ul{ }
.service-btn li{float:left; padding-left:8px; line-height:40px;}
.service-btn li a.A{ display:block; width:134px; height:40px; background:url(../images/service-btn-01.gif) 0 0 no-repeat;}
.service-btn li a.A:hover{background:url(../images/service-btn-01.gif) 0 -40px no-repeat;}
.service-btn li a.B{ display:block; width:134px; height:40px; background:url(../images/service-btn-02.gif) 0 0 no-repeat;}
.service-btn li a.B:hover{background:url(../images/service-btn-02.gif) 0 -40px no-repeat;}
.service-btn li a.C{ display:block; width:134px; height:40px; background:url(../images/service-btn-03.gif) 0 0 no-repeat;}
.service-btn li a.C:hover{background:url(../images/service-btn-03.gif) 0 -40px no-repeat;}


.service-btn2{ width:450px; height:40px;}
.service-btn2 ul{ }
.service-btn2 li{float:left; padding-right:8px; line-height:40px;}
.service-btn2 li a.A{ display:block; width:134px; height:40px; background:url(../images/service-btn-01.gif) 0 0 no-repeat;}
.service-btn2 li a.A:hover{background:url(../images/service-btn-01.gif) 0 -40px no-repeat;}
.service-btn2 li a.B{ display:block; width:134px; height:40px; background:url(../images/service-btn-02.gif) 0 0 no-repeat;}
.service-btn2 li a.B:hover{background:url(../images/service-btn-02.gif) 0 -40px no-repeat;}
.service-btn2 li a.C{ display:block; width:134px; height:40px; background:url(../images/service-btn-03.gif) 0 0 no-repeat;}
.service-btn2 li a.C:hover{background:url(../images/service-btn-03.gif) 0 -40px no-repeat;}


/* ================ sideLeft-nav ================ */
.side-nav-foot{ display:block; width:140px; height:20px;background:url(../images/sidbar_footer.gif) 0 0 no-repeat; margin-bottom:10px;}

.side-pro{ display:block; width:140px;}
.side-pro #body{ background-color:#f6f6f6;}
.side-pro h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_01.gif) 0 0 no-repeat;}
.side-pro ul{}
.side-pro li{width:140px;height:28px; color:#999;line-height:22px;}
.side-pro li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-pro li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-pro li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


.side-industy{ display:block; width:140px;}
.side-industy #body{ background-color:#f6f6f6;}
.side-industy h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_02.gif) 0 0 no-repeat;}
.side-industy ul{}
.side-industy li{width:140px;height:28px; color:#999;line-height:22px;}
.side-industy li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-industy li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-industy li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


.side-case{ display:block; width:140px;}
.side-case #body{ background-color:#f6f6f6;}
.side-case h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_03.gif) 0 0 no-repeat;}
.side-case ul{}
.side-case li{width:140px;height:28px; color:#999;line-height:22px;}
.side-case li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-case li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-case li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


.side-service{ display:block; width:140px;}
.side-service #body{ background-color:#f6f6f6;}
.side-service h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_04.gif) 0 0 no-repeat;}
.side-service ul{}
.side-service li{width:140px;height:28px; color:#999;line-height:22px;}
.side-service li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-service li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-service li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


.side-nextlink{ display:block; width:140px;}
.side-nextlink #body{ background-color:#f6f6f6;}
.side-nextlink h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_05.gif) 0 0 no-repeat;}
.side-nextlink ul{}
.side-nextlink li{width:140px;height:28px; color:#999;line-height:22px;}
.side-nextlink li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-nextlink li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-nextlink li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


.side-demo{ display:block; width:140px;}
.side-demo #body{ background-color:#f6f6f6;}
.side-demo h3{ display:block; width:140px; height:96px;background:url(../images/sidbar-head_06.gif) 0 0 no-repeat;}
.side-demo ul{}
.side-demo li{width:140px;height:28px; color:#999;line-height:22px;}
.side-demo li a{display:block;width:134px; padding:3px 3px;color:#999; font-size:13px; border-bottom:#fff solid 1px; text-align:center;}
.side-demo li a:hover{background-color:#000; color:#FFF;border:none; text-decoration:none;}
.side-demo li a.focus{ background-color:#B0B0B0; color:#FFF;border:none; text-decoration:none;}


/* ================ sideLeft ================ */
.side-calling{ display:block;width:140px; height:125px; background:url(../images/side-contact.gif) 0 0 no-repeat; margin-bottom:8px;}
.side-down img{ width:140px;margin-bottom:8px;border:#fff solid 1px;}
.side-down img:hover{ border:#000 solid 1px;}
/*.side-calling img{ width:140px; border:#fff solid 1px;}
.side-calling img:hover{border:#000 solid 1px;}*/


/* ================ sideRight ================ */
.success-case{ display:block; width:140px; height:90px; background:url(../images/case-success-bg.gif) 0 0 no-repeat; padding:27px 10px 3px 10px;}
.success-case img{ background-color:#FFF; border:#6fcee8 solid 1px;width:140px; height:80px;}
.success-case img:hover{border:#000 solid 1px;}



/* ================ mainContent ================ */
.path{ float:left;line-height:6px; background:url(../images/path-dot.gif) 0 0 no-repeat; padding:0 0 10px 22px; border-bottom:#fff solid 1px; width:610px;*line-height:12px;}
.path span{ color:#000;}
.maincon img{ display:block;width:630px; height:90px; border:#eee solid 1px; margin-bottom:10px;}
.insidecontent{margin:auto 0;padding:10px 0 15px 0; text-align:center;}

.client{ width:630px;border-bottom:#e6e5bb solid 1px; padding:10px 0 15px 0;}
.client-intro{padding-left:170px;}
.client-intro span { color:#000;}
.client-casepic{float:left;display:block; width:140px; height:80px; padding:10px 10px; margin-right:10px; background:url(../images/case-client-bg.gif) 0 0 no-repeat;}
.client-casepic img{ width:140px; height:80px; border:#e9e8c0 solid 1px;}
.client-casepic img:hover{ border:#000 solid 1px;}

label.txt{ float:left; width:60px; text-align:center;}
input.textbox{ background-color:#FFF; border:#CCC solid 1px; color:#999; font-size:12px; line-height:18px; width:300px;}
input.sendinfo{ margin:0 auto; text-align:center;display:block; width:125px; height:45px; background:url(../images/submit.gif) 0 0 no-repeat; border:none; cursor:pointer;color:#999; font-size:13px;}
input.check{background-color:#FFF; border:#CCC solid 1px; color:#999; width:6px; height:6px;}
textarea.textblock{ background-color:#FFF; border:#CCC solid 1px; color:#999; font-size:12px; line-height:22px; width:620px; height:120px; overflow-x:hidden; overflow-y:scroll; padding:5px 5px; letter-spacing:0.1em;}
.part{padding-bottom:10px;}

/* .fitindustry{ margin:0 auto; width:630px; height:35px; border:#00b9e7 dotted 1px; text-align:center; padding-top:8px; color:#999;} */
.fitindustry{ float:left;width:540px; height:27px;color:#999; line-height:27px; background:url(../images/con-title-block.gif) left top no-repeat; padding-left:90px;}
.fitindustry img{ float:right;}
.fitindustry a{color:#00b9e7;text-decoration:none; border-bottom:#00b9e7 solid 1px;}
.fitindustry a:hover{color:#00b9e7;text-decoration:none; border:none;}


/* LEVEL ONE-上方menu*/
ul.dropdown{ position: relative; width: 100%; }
ul.dropdown li{ margin:0 auto;float: left; width: 130px; height:55px;position: relative; text-align:center; font-weight: bold;font-size:13px; font-family:Arial, Verdana;}
ul.dropdown a:hover{color:#00b9ef;}
ul.dropdown li a { display: block;color: #333; position: relative; z-index: 2000;padding: 20px 5px 0 5px;}
ul.dropdown li a:hover,ul.dropdown li a.hover{background:url(../images/head-btn-bg.gif) 0 0 no-repeat; position: relative; height:55px;}
/* LEVEL TWO-下方menu*/
ul.dropdown ul.sub_menu{display: none;position: absolute; top:0; left:0; z-index: 1000;border:#00b9ef solid 1px; width:128px;}
ul.dropdown ul.sub_menu #body{ background:url(../images/btn-over_body.gif) 0 0 repeat-y;}
ul.dropdown ul.sub_menu li{ background:#fff; color:#999; border-bottom: 1px solid #eee;text-align:center; font-weight:normal;font-size:12px;font-family:Arial, Verdana;}
ul.dropdown ul.sub_menu li a{ display: block; background: #fff !important; color:#999;} 
ul.dropdown ul.sub_menu li a:hover{ display: block; background: #000 !important; color:#fff;} 


a.top{ display:block;width:630px; height:21px;border-bottom:#eee solid 1px; text-align:center; background:url(../images/top.gif) center bottom no-repeat; margin-top:30px;}
a.top:hover{ text-decoration:none;}


/* ================ footer ================ */
#footer{ width:100%; height:280px;border-top:#e3e3e3 solid 1px; background:url(../images/footer-bg.gif) 0 0 repeat-x; margin-top:35px;*margin-top:15px;display:block; clear: both; overflow: hidden;}
#f-con{ margin:0 auto; width:960px; height:280px; }
.f-logo{ float:left;width:160px; padding-right:30px; text-align:center; margin-top:20px;}
.f-logo img{ padding-bottom:8px;}

.f-cate{ padding:20px 0 0 0;width:770px;*margin-top:5px; float:right;}
.f-cate h3{ color:#00b9e7; font-size:13px;font-family:Arial, Verdana; padding-bottom:10px;text-align:center; font-weight: none;}
.f-cate ul{ float:left;padding-right:10px;_padding-right:10px;width:100px;}
.f-cate li{text-align:center;}
.f-cate li a{color:#999;font-family:Arial, Verdana; font-size:12px; color:#999;line-height:24px;}
.f-cate li a:hover{color:#000; text-decoration:none;}

/*
.f-case{ float:left;width:205px;text-align:center;}
.f-case-left{ float:left; width:100px; padding-right:5px;}
.f-case-right{ float:right; width:100px;}
*/


/* ================ font ================ */
.blue{ color:#00b9e7; font-size:13px; font-family:Arial, Verdana;}
.blue-B{ color:#00b9e7; font-size:13px; font-family:Arial, Verdana; font-weight:bold;}
.dark-black{ color:#575757;}
.black{ color:#000;}

/* ================ ad plaza================ */
.ad-tbar{width:728px; height:90px;  margin:0 auto; margin-bottom:15px; margin-top:20px;}
/*Mars add chrome css hack*/
body:nth-of-type(1) .ad-tbar{margin-top:0px;}
.ad-tbar img{width:728px; height:90px;border:#eee solid 1px;}
.ad-tbar img:hover{ border:#000 solid 1px;}
.ad-buildingbar{ width:160px; height:600px; margin-top:10px;valign:top;}
.ad-buildingbar img{width:160px; height:600px;border:#EEE solid 1px;}
.ad-buildingbar img:hover{ border:#000 solid 1px;}

.ad-leftsmall{ width:140px; height:84px;valign:top; margin-bottom:10px;}
.ad-leftsmall img{width:140px; height:84px;border:#EEE solid 1px; cursor:pointer;}
.ad-leftsmall img:hover{ border:#000 solid 1px;}


/* ================ others ================ */
.hide {font-size:0; line-height:0; color:#fff; text-indent:-9999px;}
.clear {clear:both; font-size:0; line-height:0;}
.hr {clear:both; font-size:0; line-height:0; background:url(../../../n_images/tw2/global/ico_lineDot.gif) repeat-x center; height:10px;}
html .noBorder {border:none;}


/* ================ service-iframe ================ */
.i-service-con{width:630px;overflow-y:scroll; overflow-x:hidden; background-color:#FFFEE8;padding:15px 15px;}