@charset "utf-8";
body { width:100%; font-family:"微软雅黑", Arial; background:#eff2f4; overflow-x:hidden; }
a:focus { outline:none; }
header { position:fixed; left:-240px; width:240px; background:White; -webkit-transition:left .3s ease-in-out 0s;
-moz-transition:left .3s ease-in-out 0s;
-ms-transition:left .3s ease-in-out 0s;
-o-transition:left .3s ease-in-out 0s;
transition:left .3s ease-in-out 0s;
z-index:99; }
header.active { left:0px; }
header .box { margin:40px 30px 0px 0px; text-align:right; }
header .box .wechat { margin-top:20px; }
header .box .wechat img { margin-bottom:10px; width:130px; height:130px; }
header .box .wechat i { float:right; display:block; margin:3px 0 0 9px; width:9px; height:14px; background:url(../img/icons.png) no-repeat top right; }
header .box nav { float:right; margin-top:50px; }
header .box nav ul { position:relative; list-style:none; padding:0px; }
header .box nav ul li a { display:block; position:relative; width:100px; padding:4px 15px 8px 15px; color:#333; font-size:14px; text-align:center; text-decoration:none; z-index:10; -webkit-transition:all .2s ease-in-out 0s;
-moz-transition:all .2s ease-in-out 0s;
-ms-transition:all .2s ease-in-out 0s;
-o-transition:all .2s ease-in-out 0s;
transition:all .2s ease-in-out 0s;
}
header .box nav ul li.bg { position:absolute; top:0px; width:130px; height:32px; border-left:1px solid #eee; background:#2fd0b5; -moz-border-radius:16px; -webkit-border-radius:16px; border-radius:16px; -webkit-transition:all .2s ease-in-out 0s;
-moz-transition:all .2s ease-in-out 0s;
-ms-transition:all .2s ease-in-out 0s;
-o-transition:all .2s ease-in-out 0s;
transition:all .2s ease-in-out 0s;
}
header footer { position:absolute; bottom:20px; right:30px; color:#666; font-family:Arial, "宋体"; font-size:12px; line-height:22px; text-align:right; }
header footer a { color:#666; }
header footer a:hover { color:#333; text-decoration:none; border-bottom:1px dotted #333; }
header footer u { margin:0 5px; text-decoration:none; }
section.toolbar { position:fixed; left:0px; width:100%; height:80px; background:#eff2f4; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
z-index:100; }
section.toolbar.active { left:240px; }
.toolbar a.homelink, .toolbar .logo, .toolbar .mini, .toolbar .miniBtn, .footWechat { display:none; }
.toolbar .switch { float:left; margin:22px 0px 0px 30px; font-size:24px; cursor:pointer; z-index:10; }
.toolbar .category { float:left; margin:22px 0px 0px 30px; }
.toolbar .btn { line-height:12px; padding-bottom:6px; color:#777; font-family:"宋体"; font-size:12px; }
.toolbar .category .btn-primary { color:#eee; background-color:#666; border-color:#666; }
.toolbar .btnList { float:left; margin:18px 0px 0px 30px; }
.toolbar .btnList .link { margin-left:5px; }
.toolbar .btnList .link .btn { line-height:16px; padding-bottom:8px; color:#777; font-family:"微软雅黑"; font-size:14px; }
.toolbar .btnList .link .btn span.glyphicon-arrow-left { margin-right:8px; }
.toolbar .btnList .link .btn span.glyphicon-arrow-right { margin-left:8px; }
.toolbar h1 { float:left; margin-left:40px; font-size:24px; }
.toolbar h1 .glyphicon { margin:0px 15px; font-size:18px; }
section.content { position:absolute; top:100px; left:0px; width:100%; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
section.content.active { left:288px; }

section.xianztj.active {
    left: 288px;
}
section.xianztj { position:absolute; top:80px; left:0px; width:100%; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}

.caselist ul.items { top:0px; margin-left:25px; }
.caselist ul.items li { position:relative; padding:0px; width:300px; height:276px; margin:0px 15px 30px 15px; border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8; cursor:pointer; overflow:hidden; }
.caselist ul.items li .shade { position:absolute; width:100%; height:176px; margin-top:-176px; background:Black; -moz-opacity:0.7; opacity:0.7; filter:alpha(opacity=70); -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
z-index:10; }
.caselist ul.items li .shade u { display:block; margin:0 auto; margin-top:66px; width:44px; height:44px; background:url(../img/icons.png) no-repeat 0px -168px; }
.caselist ul.items li p { position:absolute; margin:10px 20px; color:#999; font-family:Arial, "宋体"; font-size:12px; line-height:26px; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
z-index:10; }
.caselist ul.items li p strong { color:#222; font-family:Arial, "微软雅黑"; font-size:16px; font-weight:normal; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li .bg { width:100%; height:100px; background-color:#fff; -moz-opacity:0.5; opacity:0.5; filter:alpha(opacity=50); -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li .bg u { display:block; position:absolute; width:100%; height:100px; margin-top:150px; background-color:#2ed0b4; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li:hover .shade { margin-top:0px; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li:hover .bg { -moz-opacity:1; opacity:1; filter:alpha(opacity=100); -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li:hover .bg u { margin-top:0px; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li:hover p { color:White; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caselist ul.items li:hover p strong { color:White; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.caseshow .banner { width:100%; height:450px; background-repeat:no-repeat !important; background-position:center top !important; }
.caseshow .caption { height:32px; margin:40px 0 20px 60px; padding-left:20px; font-size:22px; background:url(../img/icons.png) no-repeat 0px -471px; }
.caseshow .words { margin:0 80px 0 60px; }
.caseshow .words>h1 { display:inline-block; margin:0px 0px 15px 0px; font-size:18px; line-height:30px; text-indent:28px; }
.caseshow .words>span.rel { margin-left:28px; color:#888; line-height:30px; }
.caseshow .words>span.rel a { color:#888; text-decoration:none; }
.caseshow .words>span.rel a:hover { border-bottom:1px solid #999; }
.caseshow .words>span.rel u { margin:0px 12px; color:#bbb; text-decoration:none; }
.caseshow .words p { line-height:25px; text-indent:28px; }
.caseshow .words>dl.tags { margin-top:20px; }
.caseshow .words>dl.tags dt { display:inline-block; margin-left:28px; }
.caseshow .words>dl.tags dt .glyphicon { margin:0px 8px 0px 12px; }
.caseshow .words>dl.tags dd { display:inline-block; margin-top:10px; }
.caseshow .words>dl.tags dd a { margin-right:5px; padding:2px 8px 4px 8px; color:White; background:#2fd0b5; text-decoration:none; }
.caseshow .demo { margin:0 auto; margin-bottom:30px; width:1000px; border-left:15px solid White; border-right:15px solid White; background:White; }
.caseshow .demo p { margin:0px; font-size:0; }
.caseshow .demo img { width:1000px; border-top:15px solid White; border-bottom:15px solid White; }
.artlist ul.items { position:relative; top:0px; margin:0px 60px; margin-top:20px; padding:0px; list-style:none; }
.artlist ul.items li { margin-bottom:50px; height:66px; }
.artlist ul.items li span.date { display:block; float:left; width:58px; height:66px; padding-top:2px; color:White; font-size:24px; text-align:center; background:url(../img/icons.png) no-repeat 0px -512px; }
.artlist ul.items li span.date u { display:block; margin-top:-5px; font-size:16px; text-decoration:none; }
.artlist ul.items li a.thumb { display:block; float:left; margin-left:12px; width:230px; border:3px solid White; background:White; }
.artlist ul.items li p.left { float:left; display:block; padding-right:30px; }
.artlist ul.items li p.right { display:block; float:left; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.artlist ul.items li p.right span.title { display:block; }
.artlist ul.items li p.right span.title a { color:#333; font-size:24px; text-decoration:none; }
.artlist ul.items li p.right span.title a:hover { color:#2fd0b5; }
.artlist ul.items li p.right span.rel { display:block; margin-top:10px; color:#999; font-family:Arial, "宋体"; font-size:12px; }
.artlist ul.items li p.right span.rel u { margin:0 10px; color:#aaa; text-decoration:none; }
.artlist ul.items li p.right span.rel a { color:#999; text-decoration:none; }
.artlist ul.items li p.right span.rel a:hover { border-bottom:1px solid #999; }
.artlist ul.items li p.right span.summary { display:block; margin-top:15px; height:60px; color:#555; line-height:28px; overflow:hidden; }
.artlist ul.items li span.tags { display:block; margin-top:8px; }
.artlist ul.items li span.tags .glyphicon { color:#2cc0a7; }
.artlist ul.items li span.tags a { margin-left:10px; color:#2cc0a7; }
.artshow .box { position:relative; margin:20px 0 0 60px; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.artshow .box h1 { font-size:30px; line-height:42px; }
.artshow .box .rel { display:block; color:#999; padding-bottom:30px; border-bottom:1px solid #dadada; }
.artshow .box .rel a { color:#999; text-decoration:none; }
.artshow .box .rel a:hover { border-bottom:1px solid #999; }
.artshow .box .rel u { margin:0px 15px; color:#aaa; text-decoration:none; }
.artshow .box .words { padding-top:50px; border-top:1px solid White; }
.artshow .box .words p { margin-bottom:30px; font-size:18px; line-height:36px; }
.artshow .box .words p a { margin:0 3px; color:#3588be; text-decoration:none; border-bottom:1px dotted #999; }
.artshow .box .words p a:hover { border-bottom:1px solid #3588be; }
.artshow .box>dl.tags { margin-top:40px; }
.artshow .box>dl.tags dt { display:inline-block; }
.artshow .box>dl.tags dt .glyphicon { margin:0px 8px 0px 12px; }
.artshow .box>dl.tags dd { display:inline-block; margin-top:10px; }
.artshow .box>dl.tags dd a { margin-right:5px; padding:2px 8px 4px 8px; color:White; background:#2fd0b5; text-decoration:none; }
.artshow .box .bdsharebuttonbox { margin-bottom:40px; }
.artshow aside { position:fixed; right:-310px; width:280px; border:15px solid White; background:White; z-index:100; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.artshow aside.active { right:85px; }
.artshow aside .ad img { width:280px; height:210px; }
.artshow aside .caption { margin-top:25px; height:25px; border-bottom:2px solid #eee; }
.artshow aside .caption h3 { display:inline-block; position:relative; top:-22px; padding-bottom:8px; font-size:18px; border-bottom:2px solid #2fd0b5; }
.artshow aside ul.items { list-style:none; margin:0px; padding:0px; margin-top:20px; }
.artshow aside ul.items li { margin-top:20px; height:70px; }
.artshow aside ul.items li a.thumb { float:left; margin-right:15px; }
.artshow aside ul.items li a.thumb img { width:101px; height:70px; }
.artshow aside ul.items li .title { display:block; line-height:22px; }
.artshow aside ul.items li .title a { color:#333; text-decoration:none; }
.artshow aside ul.items li .title a:hover { color:#2fd0b5; }
.artshow aside ul.items li .rel { margin-top:5px; display:block; color:#aaa; }
.artshow aside ul.items li .rel .glyphicon { margin:0px 5px 0px 15px; }
.taglist ul.items { position:relative; top:0px; margin:0px 40px; margin-top:20px; padding:0px; list-style:none; }
.taglist ul.items li { float:left; width:100%; padding-bottom:12px; margin-bottom:20px; border-bottom:1px dotted #d3d3d3; }
.taglist ul.items li a.thumb { display:block; float:left; margin-left:12px; width:115px; height:80px; border:3px solid White; background:White; }
.taglist ul.items li a.thumb img.product { margin-top:6px; }
.taglist ul.items li p { display:block; float:left; margin-left:30px; }
.taglist ul.items li p span.title { display:block; }
.taglist ul.items li p span.title a { color:#333; font-size:20px; text-decoration:none; }
.taglist ul.items li p span.title a:hover { color:#2fd0b5; }
.taglist ul.items li p span.rel { display:block; margin-top:8px; }
.taglist ul.items li p span.rel u { margin:0 10px; color:#aaa; text-decoration:none; }
.taglist ul.items li p span.rel a { color:#333; }
.taglist ul.items li span.tags { display:block; margin-top:8px; }
.taglist ul.items li span.tags a { margin-left:10px; color:#2cc0a7; }
.taglist ul.items li span.tags a.active { color:#2cc0a7; }
.paging { margin:0px 0px 30px 40px; }
.qzPagination { display:inline-block; height:35px; }
.qzPagination .total { padding-right:8px; }
.qzPagination span { display:block; float:left; width:35px; height:35px; margin-right:-1px; font-family:Arial; font-size:16px; line-height:34px; text-align:center; background:#f6f6f6; }
.qzPagination a { display:block; float:left; width:35px; height:35px; margin-right:-1px; border:#dfdfdf 1px solid; color:#555; font-family:Arial; font-size:16px; line-height:34px; text-align:center; text-decoration:none; background:#f6f6f6; }
.qzPagination a:hover { background:#eee; }
.qzPagination span.current { position:relative; border:#2fd0b5 1px solid; color:White; font-family:Arial; background:#2fd0b5; }
.qzPagination span.disabled { border:#dfdfdf 1px solid; color:#aaa; cursor:not-allowed; }
.qzPagination .prev { -moz-border-radius:5px 0px 0px 5px; -webkit-border-radius:5px 0px 0px 5px; border-radius:5px 0px 0px 5px; }
.qzPagination .next { -moz-border-radius:0px 5px 5px 0px; -webkit-border-radius:0px 5px 5px 0px; border-radius:0px 5px 5px 0px; }
.dock { position:fixed; right:10px; bottom:45px; width:160px; z-index:200; }
.dock ul.icons { position:absolute; list-style:none; right:0px; padding:0px; width:50px; -webkit-transition:all .3s ease-in-out 0s;
-moz-transition:all .3s ease-in-out 0s;
-ms-transition:all .3s ease-in-out 0s;
-o-transition:all .3s ease-in-out 0s;
transition:all .3s ease-in-out 0s;
}
.dock ul.icons li i { display:block; position:relative; width:50px; height:50px; margin-bottom:5px; background:url(../img/icons.png) no-repeat; background-color:#333; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; cursor:pointer; -moz-opacity:0.8; opacity:0.8; filter:alpha(opacity=80); -webkit-transition:all .2s ease-in-out 0s;
-moz-transition:all .2s ease-in-out 0s;
-ms-transition:all .2s ease-in-out 0s;
-o-transition:all .2s ease-in-out 0s;
transition:all .2s ease-in-out 0s;
z-index:210; }
.dock ul.icons li.active i { background-color:#222; -moz-border-radius:0px 5px 5px 0px; -webkit-border-radius:0px 5px 5px 0px; border-radius:0px 5px 5px 0px; -moz-opacity:1; opacity:1; filter:alpha(opacity=100); }
.dock ul.icons li.up i { background-position:-63px -150px; }
.dock ul.icons li.up.active i { background-position:-63px -150px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }
.dock ul.icons li.tel i { background-position:-62px -108px; }
.dock ul.icons li.im i { background-position:-63px -20px; }
.dock ul.icons li p { display:block; position:absolute; right:5px; padding:5px 10px 5px 15px; height:38px; font-size:12px; line-height:20px; border:1px solid #333; border-right:none; background:#222; -moz-border-radius:5px 0px 0px 5px; -webkit-border-radius:5px 0px 0px 5px; border-radius:5px 0px 0px 5px; -moz-opacity:0; opacity:0; filter:alpha(opacity=0); -webkit-transition:all .4s ease-in-out .1s;
-moz-transition:all .4s ease-in-out .1s;
-ms-transition:all .4s ease-in-out .1s;
-o-transition:all .4s ease-in-out .1s;
transition:all .4s ease-in-out .1s;
overflow:hidden; z-index:201; }
.dock ul.icons li.active p { right:50px; -moz-opacity:1; opacity:1; filter:alpha(opacity=100); }
.dock ul.icons li.tel p { top:55px; width:80px; color:#ddd; font-family:Arial, "宋体"; }
.dock ul.icons li.im p { top:110px; width:100px; }
.dock ul.icons li.im p a { display:block; width:100%; height:50px; line-height:34px; color:#2fd0b5; font-size:14px; text-align:center; text-decoration:none; }
.dock ul.icons li.im p a:hover { color:White; }
@media (max-height:630px) {
header footer {
display:none;
}
}
@media (max-width:1100px) {
header {
width:0px;
}
header, header.active, .toolbar .switch {
display:none;
}
section.toolbar.active, section.content.active {
left:0px;
}
section.toolbar {
background:White;
height:56px;
}
.toolbar a.homelink {
float:left;
display:inline;
}
.toolbar a.homelink .glyphicon {
position:relative;
margin:15px 0px 0px 30px;
color:#333;
font-size:24px;
cursor:pointer;
z-index:10;
}
.toolbar .logo {
display:block;
float:left;
margin:14px 0px 0px 30px;
width:80px;
}
.toolbar .category {
margin:14px 30px 0px 0px;
float:right;
}
.toolbar .btnList {
margin:12px 30px 0px 0px;
float:right;
}
.toolbar h1 {
float:right;
margin:16px 35px 0px 0px;
font-size:20px;
}
.toolbar h1 .glyphicon {
margin:0px 12px;
font-size:20px;
}
.artlist ul.items {
margin-left:30px;
}
.artshow aside {
margin-top:28px;
}
.artshow aside ul.items li:nth-child(4) {
display:none;
}
.caselist ul.items li {
width:290px;
height:267px;
}
}
@media (max-width:800px) {
.toolbar .category, .toolbar .btnList {
display:none;
}
.toolbar .mini {
display:block;
margin:14px 30px 0px 0px;
float:right;
}
.toolbar .mini ul.dropdown-menu {
min-width:100px;
}
.toolbar .mini .link {
margin:0px;
}
.toolbar .mini .link .btn {
padding:6px 8px;
}
.artlist ul.items {
margin-right:30px;
}
.artshow .box {
margin-left:30px;
}
.artshow aside, .dock {
display:none;
width:0px;
}
.caseshow .caption {
margin-left:40px;
}
.caseshow .words {
margin:0 30px 0 40px;
}
.footWechat {
display:block;
margin:0 auto;
margin-bottom:30px;
width:156px;
}
.footWechat img {
border:3px solid White;
}
.footWechat p {
margin-top:10px;
text-align:center;
}
.footWechat i {
display:none;
background:none;
}
}
@media (max-width:700px) {
.artlist ul.items li p.left {
display:none;
width:0px;
}
.artshow .box h1 {
font-size:24px;
line-height:40px;
}
.caseshow .words>dl.tags dt {
margin-left:0px;
}
.taglist ul.items li a.thumb {
display:none;
}
.taglist ul.items li p {
margin-left:0px;
}
}
@media (max-width:420px) {
.toolbar a.homelink .glyphicon, .toolbar .logo {
margin-left:15px;
}
.toolbar .mini {
margin-right:15px;
}
.toolbar h1 {
margin:19px 20px 0px 0px;
font-size:14px;
}
.toolbar h1 .glyphicon {
margin:0px 7px;
font-size:14px;
}
.artlist ul.items li p.right span.title a {
font-size:18px;
line-height:30px;
}
.artshow .box h1 {
font-size:20px;
line-height:36px;
}
.artshow .box .words p {
font-size:16px;
line-height:32px;
}
.artshow .box dl.tags dt {
display:none;
}
.caseshow .caption {
margin-left:20px;
}
.caseshow .words {
margin:0 10px 0 20px;
}
.caseshow .words h1 {
text-indent:0px;
}
.caseshow .words span.rel, .caseshow .words dl.tags dt {
display:none;
}
.taglist ul.items {
margin:0px 20px;
}
}
.clear { clear:both; }
.hide { display:none; }
#BDBridgeWrap { display:none; }