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

body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline; list-style:none; text-decoration:none; letter-spacing:0.1em; font-family:"新細明體";}

body{background:#f6f3ee url(../images/pic-texture.jpg) 0 0 no-repeat;}
*#wrapper {}
a{display:block; cursor:pointer; height:100%;}
img{vertical-align:bottom;}
ul{width:100%;}
.leftSec{width:360px; float:left;padding-top:15px;}
.leftSec.gradient{height:770px; background:url(../images/a-map-gradient.png) 0 0 no-repeat; padding:0; position:relative;}
.rightSec{float:left; width:620px; position:relative; background:url(../images/pic-texture-02.jpg) 0 0 repeat; padding-top:15px;}
.rightSec.paddingTop{padding:0;}

#header{min-width:900PX; height:45px; background:#000; position:relative; text-indent:-9999px;}
.header-cn-name{width:235px; height:55px; position:absolute; left:1em; background:url(../images/header-l-zh.jpg) 0 0 no-repeat;}
.header-en-name{width:155px; height:55px; position:absolute; right:1em; background:url(../images/header-l-en.jpg) 0 0 no-repeat;}
#footer{width:100%; height:40px; background:#000; color:#999; position:fixed; bottom:0;}
#footerCase{width:100%; height:40px; background:#000; color:#999;}
.footer01{float:left; margin:5px; font-size:12px;}
.footer02{float:right; margin:10px 5px; font-size:12px;}
.content{width:980px; margin:0 auto; margin-bottom:50px; position:relative;}
.h-content{padding-top:50px; height:740px;}

/*內頁選項*/
ul.naviBar{height:40px; margin-bottom:50px;}
ul.naviBar li{float:left; margin-right:3px;}
ul.naviBar li a{width:100px; height:27px; overflow:hidden; text-indent:-9999px; position:relative;}
ul.naviBar li a span{width:100px; height:54px; display:block; position:absolute; top:0;}
ul.naviBar li a span#navi1{background:url(../images/sub-navi-1.jpg) 0 0 no-repeat;}
ul.naviBar li a span#navi2{background:url(../images/sub-navi-2.jpg) 0 0 no-repeat;}
ul.naviBar li a span#navi3{background:url(../images/sub-navi-3.jpg) 0 0 no-repeat;}
ul.naviBar li a span#navi4{background:url(../images/sub-navi-4.jpg) 0 0 no-repeat;}
ul.naviBar li a span#navi5{background:url(../images/sub-navi-5.jpg) 0 0 no-repeat;}
ul.naviBar li a span#navi6{background:url(../images/sub-navi-6.jpg) 0 0 no-repeat;}
.r-content{width:560px; padding:0 30px; }
.t-sub{height:60px;}
.t-sub img{float:right;}

.lineStyle{width:100%; height:10px; margin-top:0.2em;}
.lineStyle .dot{float:left; width:5px; height:5px; background:url(../images/listDot-02.gif) 0 0 no-repeat;}
.lineStyle .line{float:left; width:98%; height:1px; background:#333; margin-left:3px; margin-top:2px;}

/*intro*/
.titleDisplay{display:none;}
.contentChg{width:560px; /*height:710px;*/ overflow:hidden; position:relative;}
.introWrap{width:2500px; position:absolute; left:0;}
.introWrapIn{float:left; width:560px; margin-right:20px; position:relative;}
.height710px{height:710px;}
.height770px{height:770px;}
.introWrapIn h3{font-size:18px; color:#820000; margin-bottom:0.2em; letter-spacing:0.2em;}
.introWrapIn p{font-size:15px; color:#545454; margin-bottom:1em; letter-spacing:0.15em; line-height:1.5em;}
.introWrapIn span{font-size:12px; color:#666;}
.introWrapIn .teamStructure{padding-bottom:20px; height:auto;}
.introWrapIn .teamStructure h3.teamTitle{display:inline-block; margin:0; vertical-align:top;}
.introWrapIn .teamStructure ul{display:inline-block; width:440px; font-size:15px; color:#545454; margin-left:20px;}
.introWrapIn .teamStructure ul li{list-style:url(../images/listDot.gif);}
#bi-content-01{position:absolute; top:40px; background:url(../images/pic-texture-02.jpg) 0 0 repeat;}
#tm-content-01{position:absolute; top:40px; background:url(../images/pic-texture-02.jpg) 0 0 repeat;}
ul.intro-header-navi{height:30px; margin-left:0.5em;}
ul.intro-header-navi li{width:95px; height:30px; float:left; margin-right:1em; cursor:pointer}
ul.intro-header-navi li#intro-navi-01{background:url(../images/intro-navi-b-01.jpg) 0 0 no-repeat;}
ul.intro-header-navi li#intro-navi-02{background:url(../images/intro-navi-b-02.jpg) 0 0 no-repeat;}
ul.numPager{width:15%; height:25px; float:right; margin:0.5em 0;}
ul.numPager li.pagerActived{background:#820000; color:#eee;}
ul.numPager li{float:left; width:20px; height:20px; padding-top:2px; padding-left:2px; margin-right:0.5em; border:1px #808080 solid; color:#808080; background-color:none; font-weight:bold; text-align:center; cursor:pointer;}

/*case*/
ul.caseBox{height:50px; padding:5px; margin:20px auto; background:url(../images/hc-gradient.png) repeat-x 0 0;}
ul.caseBox li{margin:0 auto; width:120px;}
.caseSec{width:100%; height:80px; margin-bottom:20px;}
.caseSecIn{float:left; width:200px;}
.caseSecIn-l{border-right:1px solid #666; padding-left:0;}
ul.caseOp{height:100%; padding:0 20px;}
ul.caseOp li{float:left; margin:10px 10px;}
ul.caseOp li a{width:75px; height:20px;}
ul.caseOp li a#op1{background:url(../images/hc-caseOption.jpg) no-repeat 0 0;}
ul.caseOp li a#op2{background:url(../images/hc-caseOption.jpg) no-repeat -75px 0;}
ul.caseOp li a#op3{background:url(../images/hc-caseOption.jpg) no-repeat 0 -40px;}
ul.caseOp li a#op4{background:url(../images/hc-caseOption.jpg) no-repeat -75px -40px;}
ul.caseOp li a#op2:hover{background:url(../images/hc-caseOption.jpg) no-repeat -75px -20px;}
ul.caseOp li a#op3:hover{background:url(../images/hc-caseOption.jpg) no-repeat 0 -60px;}
ul.caseOp li a#op4:hover{background:url(../images/hc-caseOption.jpg) no-repeat -75px -60px;}

ul.caseInfo{height:30px; font-size:15px; color:#666; margin:1em 0;}
ul.caseInfo li{float:left; width:180px;}
ul.caseInfo li strong{color:#666;}
.caseMedia{width:100%; height:400px; border:1px solid #CCC; overflow:hidden; position:relative;}
.caseMediaWrap{width:1120px; height:400px; position:absolute; left:0;}
.caseMediaIn{float:left; width:560px; height:400px;}
.cboxElement{float:left;}

/*achievement*/
ul.a-header-navi{height:30px; margin-left:0.5em;}
ul.a-header-navi li{width:95px; height:30px; float:left; margin-right:1em; cursor:pointer}
ul.a-header-navi li#a-navi-01{background:url(../images/a-navi-b-01.jpg) 0 0 no-repeat;}
ul.a-header-navi li#a-navi-02{background:url(../images/a-navi-b-02.jpg) 0 0 no-repeat;}
ul.a-header-navi li#a-navi-03{background:url(../images/a-navi-b-03.jpg) 0 0 no-repeat;}
.achieveSec{width:100%; padding:0.5em; position:relative; border:none;}
.achieveContentChg{width:980px; height:730px; overflow:hidden; position:relative;}
.achieveWrap{width:3200px; position:absolute; left:0;}
.achieveWrapIn{float:left; width:980px; margin-right:30px;}
.achieveContent{width:95%; height:600px; display:none;}
ul.achieveList{height:650px; border:none;}
ul.achieveList li{width:520px; padding:5px 10px; margin-bottom:1em; position:relative; cursor:pointer;}
ul.achieveList li a{height:auto; position:absolute; display:inline-block; right:2%; bottom:10%;}
ul.achieveList li div.title{width:500px; height:24px; padding-left:30px; padding-top:6px; background:url(../images/a-list-title.jpg) 0 0 no-repeat;}
ul.achieveList li div.title h3{font-weight:bold;}
ul.achieveList li div.title span{width:63px; height:8px; display:inline-block; margin-left:5px; background:url(../images/a-decoTxt.png) 0 0 no-repeat;}
ul.achieveList li div.txt{width:490px; height:auto; padding:10px 20px; font-size:15px; border-bottom:solid 1px #b2b2b2; background:url(../images/a-gradient.png) 0 0 repeat; background-size:100% 95%;}
ul.achieveList li div.txt div.info{float:left; width:33%;height:100%;}
ul.achieveList li div.txt div.info-w{width:67%;}
ul.achieveList li div.txt div.info p{color:#666; margin-bottom:10px; }
ul.achieveList li div.txt div.info p span{font-weight:bold; color:#333; margin-left:1em;}
.bgImg{width:600px; height:40px; float:right; margin-right:20px; background:url(../images/pic-texture-02.jpg) 0 0 repeat;}
.iframeContent{width:980px; height:730px;}
.mapcontent{width:980px; position:relative;}
.mapScope{width:360px; height:540px; margin-top:150px;}
.mapBar{width:360px; height:40px; background:#f7f5ef; margin-top:5px;}
.compass{width:16px; height:41px; position:absolute; z-index:99; top:20px; right:20px; background:url(../images/a-icon-compass.png) 0 0 no-repeat;}
.zoomer.dark_zoomer{background:url(../images/pic-texture-03.jpg) 0 0 repeat;}
.zoomBtn{display:inline-block; cursor:pointer; width:60px; height:21px; margin:10px 7px;}
.zoomer_custom_zoom_out{background:url(../images/a-zoomOut.jpg) 0 0 no-repeat;}
.zoomer_custom_zoom_out:hover{background:url(../images/a-zoomOut.jpg) 0 -21px no-repeat;}
.zoomer_custom_zoom_in{background:url(../images/a-zoomIn.jpg) 0 0 no-repeat;}
.zoomer_custom_zoom_in:hover{background:url(../images/a-zoomIn.jpg) 0 -21px no-repeat;}

ul.zoomer-list li{width:2.5%; height:2.5%; background:#333; position:absolute; border-radius:50%;} 

/*map-hsinchu*/
.map{width:358px; height:500px; position:relative; overflow:hidden; border:1px solid #666;}

/*b-map-hsinchu*/
ul.zoomer-list li#b-HSZ-dot-1{top:28%; left:23%;}

/*h-map-hsinchu*/
ul.zoomer-list li#h-HSZ-dot-1{top:39%; left:37%;}
ul.zoomer-list li#h-HSZ-dot-2{top:24%; left:21%;}

/*a-map-taipei*/
ul.zoomer-list li#a-TPE-dot-1{top:85%; left:56%;}
ul.zoomer-list li#a-TPE-dot-2{top:82%; left:55%;}
ul.zoomer-list li#a-TPE-dot-3{top:85%; left:45%;}
ul.zoomer-list li#a-TPE-dot-4{top:82%; left:51%;}
ul.zoomer-list li#a-TPE-dot-5{top:85%; left:41%;}
ul.zoomer-list li#a-TPE-dot-6{top:86%; left:51%;}
ul.zoomer-list li#a-TPE-dot-7{top:82%; left:40%;}
ul.zoomer-list li#a-TPE-dot-8{top:81%; left:65%;}

/*a-map-hsinchu*/
ul.zoomer-list li#a-HSZ-dot-1{top:21%; left:15%;}
ul.zoomer-list li#a-HSZ-dot-2{top:30%; left:25%;}
ul.zoomer-list li#a-HSZ-dot-3{top:22%; left:12%;}

/*a-map-taichung*/
ul.zoomer-list li#a-TXG-dot-1{top:56%; left:30%;}
ul.zoomer-list li#a-TXG-dot-2{top:38%; left:48%;}
ul.zoomer-list li#a-TXG-dot-3{top:42%; left:48%;}
ul.zoomer-list li#a-TXG-dot-4{top:68%; left:35%;}
ul.zoomer-list li#a-TXG-dot-5{top:26%; left:34%;}

/*news*/
.newsSec{width:100%; padding:0.5em; margin-top:1em; position:relative;}
.newsWrap{width:2300px; position:absolute; left:0;}
.newsWrapIn{float:left; width:570px; margin-right:30px;}
.newsContent{width:95%; height:600px; display:none;}
.newsContent-02{width:95%; height:600px;}
a#newsCancel{height:20px; display:none; margin-left:85%; margin-bottom:10px; font-weight:bold; color:#333;}
a#newsCancel:hover{color:#063}
ul.newsList{height:700px; width:96%;}
ul.newsList li{width:510px; height:95px; padding:5px 10px; margin-bottom:0.5em; background:url(../images/hn-texture.jpg) 0 0 repeat-y;}
ul.newsList li:nth-child(2n){background:url(../images/hn-texture-02.jpg) 0 0 repeat-y;}
ul.newsList li a{display:block; width:100%; height:100%; cursor:pointer}
ul.newsList li div{float:left;}
ul.newsList li div.txt{width:100%;}
ul.newsList li div.txt h3{font-size:16px; color:#820000; font-weight:bold; margin-bottom:3px;}
ul.newsList li div.txt p.date{font-size:12px; color:#a0a064;}
ul.newsList li div.txt p.outline{font-size:14px; color:#4c4c4c;}
.subList{width:440px; margin:0 auto;}
ul.subListIn{width:440px; height:20px; padding:0 10px;}
ul.subListIn li{float:left;}
ul.subListIn li a{color:#666; display:inline-block; margin:0 1em; cursor:pointer;}
ul.subListIn li a:hover{color:#000;}
ul.hn-header-navi{height:30px; margin-left:0.5em;}
ul.hn-header-navi li{width:95px; height:30px; float:left; margin-right:1em; cursor:pointer}
ul.hn-header-navi li#hn-navi-01{background:url(../images/hn-navi-b-01.jpg) 0 0 no-repeat;}
ul.hn-header-navi li#hn-navi-02{background:url(../images/hn-navi-b-02.jpg) 0 0 no-repeat;}

.progressLogoPic{width:470px; height:260px; margin-bottom:1em;}
.progressLogo{width:235px; float:left; padding-top:100px;}
.progressPic{width:235px; float:left;}
.progressTable{width:470px;}
table.progressList{font-size:15px;}
table.progressList caption{width:470px; height:25px; background: url(../images/hn-processList-title.jpg) 0 0 no-repeat; margin-bottom:0.5em;}
table.progressList tr{height:25px; cursor:pointer;}
table.progressList td.num{width:25px; height:20px; padding-top:3px; font-weight:bold; background:#820000; color:#FFF; text-align:center;}
table.progressList td.info{width:80%; padding:0 10px; font-weight:bold; color:#333;}
table.progressList td.date{margin-left:50px; color:#666;}
table.progressList tr:hover td.num{background:none; color:#820000;}
table.progressList tr:hover td.info{background:#820000; color:#fff;}
table.progressList tr:hover td.date{color:#820000;}

/*Group*/
.groupSec{width:100%; margin:30px 0;}
.groupSec .title{float:left; width:20%; margin-right:5%;}
.groupSec .title a{width:95px; height:2em; margin:0 auto;}
.groupSec .title #t-relation1{background:url(../images/gr-title-b-01.jpg) 0 0 no-repeat;}
.groupSec .title #t-relation2{background:url(../images/gr-title-b-02.jpg) 0 0 no-repeat;}
.groupSec .outline{float:left; width:75%; }

/*Service*/
.serviceSec{width:100%; margin:30px 0;} 
.serviceSec .info{width:500px; height:110px; padding:30px; background:url(../images/cs-pic.jpg) 0 0 no-repeat; margin:1em auto;}
.info .infoDetail{margin-bottom:1em;}
.info .infoDetail h3{float:left; width:50px; margin-left:2em;}
.info .infoDetail p{float:left; font-weight:bold;}
#contact{margin:4em 0;}
#contact .secApl{width:100%; margin:1.5em 0;}
#contact .secApl label{float:left; width:95px; height:30px; text-indent:-99999em; cursor:pointer;}
#contact .secApl label#t-username{background:url(../images/cs-t-name-r.jpg) 0 0 no-repeat;}
#contact .secApl label#t-telphone{background:url(../images/cs-t-tel-r.jpg) 0 0 no-repeat;}
#contact .secApl label#t-Email{background:url(../images/cs-t-email-r.jpg) 0 0 no-repeat;}
#contact .secApl label#t-title{background:url(../images/cs-t-title-r.jpg) 0 0 no-repeat;}
#contact .secApl label#t-case{background:url(../images/cs-t-case-r.jpg) 0 0 no-repeat;}
#contact .secApl label#t-content{background:url(../images/cs-t-content-r.jpg) 0 0 no-repeat;}
#contact .secApl input,textarea{float:left; width:450px; margin-top:6px; background:none; border:none; border-bottom:1px solid #666; font-family:Georgia, "新細明體"; font-style:italic; color:#808080; letter-spacing:0.1em; font-size:16px}
#contact input#btnReset{float:right; width:70px; height:15px; margin:0 2em; cursor:pointer; border:none; background:url(../images/cs-btn-reset.jpg) 0 0 no-repeat; text-indent:-99999em;}
#contact input#btnReset:hover{background:url(../images/cs-btn-reset.jpg) 0 -15px no-repeat;}
#contact input#btnSubmit{float:right; width:70px; height:15px; cursor:pointer; border:none; background:url(../images/cs-btn-submit.jpg) 0 0 no-repeat; text-indent:-99999em;}
#contact input#btnSubmit:hover{background:url(../images/cs-btn-submit.jpg) 0 -15px no-repeat;}

/*home*/
#home-logo{height:50px;}
#home-logo img{float:right;}

/* pager */
.cycle-pager {text-align:center; width:100%; overflow:hidden; margin-top:1em;}
.cycle-pager span {width:13px; height:13px; background:#808080; margin-right:0.5em;display:inline-block; cursor:pointer; text-indent:-9999px; }
.cycle-pager span.cycle-pager-active {background:#820000;}
.cycle-pager > * { cursor: pointer;}

/*accordion*/
.sm{list-style:none; width:980px; height:520px; display:block; overflow:hidden; margin:0 auto;-moz-box-shadow:1px 3px 6px #333;-webkit-box-shadow:1px 3px 6px #333;box-shadow:1px 3px 6px #333;}
.sm li{float:left; display:inline; overflow:hidden}
.sm li a{cursor:pointer; width:100%; position:relative;}
.sm li a h3{display:none; text-indent:-9999em;}

.clearFix{clear:both;}
.marginRight0{margin-right:0;}
