@import url('goble.css');
@import url('header.css');

/*banner*/
div.moduletable-banner{width:100%;background: url(../images/loading.gif) no-repeat;margin:0 auto;}
.flexslider{width:100%;overflow: hidden;}
.flexslider .slides > li{display: none;}
.flexslider .slides img{width:100%;height:auto;display: block;}
.slides: after{content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
html[xmlns] .slides{display: block;}
* html .slides{height: 1%;}
.no-js .slides > li: first-child{display: block;}


.flexslider{position: relative;zoom: 1;}
.flexslider .slides{zoom: 1;}
.flexslider .slides > li{position: relative;}
.flex-caption{background: none;-ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);zoom: 1;}
.flex-caption{width: 96%;padding: 2%;position: absolute;left: 0;bottom: 0;background: rgba(0,0,0,.3);color: #fff;text-shadow: 0 -1px 0 rgba(0,0,0,.3);font-size: 14px;line-height: 18px;}
.flex-direction-nav{height: 0;}
.flex-direction-nav li a{display:block;width: 47px;height: 80px;position: absolute;top: 50%;margin-top: -40px;cursor: pointer;text-indent: -9999px;}
.flex-direction-nav li a.next{right: 0;background: url("../images/bg_direction_nav.png") no-repeat scroll -47px 0 transparent;}
.flex-direction-nav li a.next: hover{}
.flex-direction-nav li a.next: active{background: url("../images/bg_direction_nav.png") no-repeat scroll -47px -80px transparent;}

.flex-direction-nav li a.prev{left: 0;background: url("../images/bg_direction_nav.png") no-repeat scroll 0 0 transparent;}
.flex-direction-nav li a.prev: hover{}
.flex-direction-nav li a.prev: active{background: url("../images/bg_direction_nav.png") no-repeat scroll 0 -80px transparent;}
.flex-direction-nav li a.disabled{opacity: .3;filter: alpha(opacity=30);cursor: default;}

.flex-control-nav{position: absolute;bottom:0;width:100%;margin:0 auto;text-align:center;}
.flex-control-nav li{display: inline-block;zoom: 1;*display: inline;margin-right: 10px;margin-bottom: 15px;}
.flex-control-nav li a{display: block;width: 8px;height: 8px;margin: 0 1px;border-radius:10px;background:#fff;text-indent: -9999px;}
.flex-control-nav li a:hover{background:#B9B9B9;width: 8px;height: 8px;margin: 0 1px;border-radius:10px;}
.flex-control-nav li a.active{background:#B9B9B9;width: 28px;height: 8px;margin: 0 1px;border-radius:10px;}
/*banner */

/*团队展示*/
.short-bar{position:absolute;top:187px;left:50%;margin-left:-15px;width:30px;height:3px;background-color:#fff}
.active .short-bar{top:201px;background-color:#e90018}

.team-box{width: 1100px;margin: 0 auto;}
.team-box-l{float: left;width: 360px;}
.team-box-l img{width: 95%;height: auto;background: #ddd;padding: 5px;border-radius:5px;}

.team-box-r{float: right;width:700px;}
.team-box-r .tops{border-bottom: 1px solid #ddd;height: 45px;line-height: 45px;}
.team-box-r .tops .h1{font-size: 28px;color:#e3161e;margin-right: 50px;float: left;}
.team-box-r .tops .h2{line-height: 40px;float: right;}
.team-box-r .info{line-height: 26px;font-size: 14px;color:#666;padding:20px 0;}


/*联系我们*/
.conatct-box{width:90%;padding:0;text-align: left;margin: 50px auto;}
.conatct-box .contact-info{width: 100%;margin:10px auto;}
.conatct-box .contact-info h2{font-size: 24px;color:#666;margin-bottom: 20px;}
.conatct-box .contact-info p{width: 100%;font-size:16px;height: 50px;line-height: 50px;color:#666;}
.conatct-box .contact-info img{margin-right: 15px;width: 20px;height: 20px;}

.sitemp{width:1200px;line-height:42px;color: #666;font-size: 14px;margin:0 auto;background: url(../images/navle.png) left center no-repeat;}
.sitemp .site{text-align: left; line-height: 50px;}
.sitemp .site a{color: #666;}

.right .content{padding-top:15px;line-height: 24px;font-size: 14px; color: #333; line-height: 1.7;}
.sort_album{margin-top: 15px;}

/*售后服务*/
.web-design{width: 1340px;margin: 0 auto;}
.web-design ul li{width:593px;height:290px;padding:20px 15px;margin:20px;float:left;border: 1px solid #E7E7E7;position:relative;overflow:hidden;cursor:pointer;z-index: 9999;}
.web-design ul li img{width:260px;height:280px;float: right;}

.web-design ul li .txt-box{width:299px;height:299px;position:absolute;left:0;top:0;bottom:0;color:#666;}

.web-design ul li .nbg01{background:url('../images/nums01.png') no-repeat 12px 15px;}
.web-design ul li .nbg02{background:url('../images/nums02.png') no-repeat 12px 15px;}
.web-design ul li .nbg03{background:url('../images/nums03.png') no-repeat 12px 15px;}
.web-design ul li .nbg04{background:url('../images/nums04.png') no-repeat 12px 15px;}


.web-design ul li .txt{width: 258px;margin: 0 auto;padding-top: 100px;}
.web-design ul li .txt h3{font-size:20px;font-weight:bold;color:#555;line-height:30px;width: 170px;margin-bottom:50px;}
.web-design ul li .txt p{font-size: 14px;color:#555;line-height: 25px;}


/*关于*/
.ab-box{margin:0 auto;width:1200px}
.ab-box ul{margin-top:50px}
.ab-box ul li{margin:50px auto;width:1200px;height:380px;border-radius:5px;padding:20px;}

.ab-box ul li:after,.ab-box .work-content .work-item li:before{display:table;content:""}
.ab-box ul li:after{clear:both;overflow:hidden}
.ab-box ul li.img-right .work-info{width:520px;padding: 0 40px;color:#181818;font-size: 14px;}
.ab-box ul li .work-img{overflow:hidden;width:600px;height:auto;}
.ab-box ul li .work-img img{width:600px;height:400px;}

.ab-box ul li .work-info{width:520px;padding: 0 40px;color:#181818;font-size: 14px;position:relative;}
.ab-box ul li .work-info i{display:block;width:90px;height:3px;background:#185EA8;position:absolute;left:0;}
.ab-box ul li .work-info h3{color:#333;font-size:24px;line-height:80px}
.ab-box ul li .work-info p{color:#666;font-size:14px;line-height:25px;margin-top: 30px;}
.ab-box ul li .work-info>img{margin-top:36px}


.about-f-banner{width:100%;height:280px;background: url(../images/about-f-banner.jpg) no-repeat;;background-size:cover;}
.about-f-banner div{width: 200px;margin:0 auto;text-align: center;padding: 50px 0;}
.about-f-banner div h1{font-size:24px;color:#fff;font-weight:inherit;margin-top: 5px;line-height: 60px;}
.about-f-banner div i{width:40px;height:4px;background:#fff;font-style:normal;display:block;margin:0 auto;}
.about-f-banner div p{color:#999;font-size: 14px;text-transform:uppercase;line-height: 60px;margin-bottom: 30px;}

.about-f-banner a{margin-top:40px;line-height: 35px;height:35px;color:#fff;border:2px solid #35567A;padding:6px 35px;border-radius:5px;font-size:14px;text-decoration: none;background:rgba(53,86,122,0.8);}
.about-f-banner a:hover{border:2px solid #fff;color:#fff;transition: All 0.8s ease; -webkit-transition: All 0.8s ease; -moz-transition: All 0.8s ease; -o-transition: All 0.8s ease; }



.works-infobox{width: 1200px;height:100%;margin:0 auto;}
.works-infobox .works-infobox-left{width:800px;float: left;padding: 20px 0;color:#666;font-size: 14px;line-height: 30px;}
.works-infobox .works-infobox-right{width:320px;float: right;padding: 20px 0;}


.works_content{width:1200px;height:auto;margin:0 auto;}
.works_content .child{position:relative;float:left;width:25%;}
.works_content .child .childImg{width:292px;height:174px; vertical-align:middle;margin:0 4px 8px 4px;}

.works_content .child .childHide{display:none;position:absolute;top:0px;left:0px;width:292px;height:174px;margin:0 4px 8px 4px;background:#000;filter:alpha(opacity=80);opacity:0.8;}
.works_content .child .childPointer{position:absolute;bottom:17px;right:20px;width:50px;height:50px;}
.works_content .child .childTag{letter-spacing:0.1em;font-weight:100;font-stretch:condensed;padding:6%;position:absolute;top:0px;left:0px;width:88%;font-size:22px;color:#fff;text-align:left;z-index:999;}
.works_content .child .childTag .childSub{width:30px;height:2px;background:#fff;margin:10px 0px;z-index:999;}



.table-box{width:240px;background: #F8F8F8;padding: 40px;border-radius:4px;}
.table-box h3{color: #181818;font-size: 16px;font-weight: lighter;}
.table-box span{color: #999999;font-size: 12px;margin-bottom: 15px;display: block;}
.table-box p{font-size: 14px;color:#999999;line-height: 32px;}
.table-box p i{font-size: 14px;color:#181818;line-height: 32px;margin-left: 15px;}



.show-next{width: 1200px;margin: 0 auto;border-bottom: 1px solid #DFDFD5;padding-top: 20px;height: 80px;}
.show-next .show-next-left{float:left;width: 120px;}
.show-next .show-next-left img{width:120px;height:40px;}

.show-next .show-next-right{float:right;width: 500px;}

.show-next .show-next-right .nNewsup{float: right;}
.show-next .show-next-right .nNewsup li{float:left;width:120px;height:40px;margin-right: 15px;}
.show-next .show-next-right .nNewsup li img{width:120px;height:40px;}


.xiangguan{width: 1200px;margin: 30px auto;height: 400px;}
.xiangguan h3{color: #181818;font-size: 24px;font-weight: lighter;}

.xiangguan-casebox{width:1275px;margin:25px auto;}
.xiangguan-casebox ul{overflow:hidden; zoom:1;}
.xiangguan-casebox ul li{width: 375px;float: left;margin:0 35px 25px 0;position: relative;}
.xiangguan-casebox ul li:last-child{width: 375px;float: left;margin:0 0 25px 0;position: relative;}
.xiangguan-casebox ul li a{width:375px;height:250px;position: absolute;overflow:hidden;top:0px;left:0;right:0;}
.xiangguan-casebox ul li a:hover img{width: 375px;height:250px;transform:scale(0.9,0.9); -ms-transform:scale(0.9,0.9); -moz-transform:scale(0.9,0.9); -webkit-transform:scale(0.9,0.9); -o-transform:scale(0.9,0.9);}
.xiangguan-casebox ul li:hover{color:#fff;border-radius:0;}
.xiangguan-casebox ul li:hover img{width:375px;height:250px;transform:scale(0.9,0.9); -ms-transform:scale(0.9,0.9); -moz-transform:scale(0.9,0.9); -webkit-transform:scale(0.9,0.9); -o-transform:scale(0.9,0.9);}

.xiangguan-casebox ul li img{width: 100%;height:250px;-moz-transition: all 2s; -webkit-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s;}
.xiangguan-casebox ul li .news_bott{padding:15px 0;margin-top: 250px;}
.xiangguan-casebox ul li .news_bott h2{font-size:18px;color: #666;line-height: 30px;font-weight: normal;}
.xiangguan-casebox ul li .news_bott p{line-height:25px;font-size: 14px;color:#999;}

.xiangguan-casebox ul li:hover .news_bott{padding: 15px 0 15px 15px;-webkit-transition: all .8s; -moz-transition: all .8s; transition: all .8s;}
.xiangguan-casebox ul li:hover .news_bott h2{font-size:18px;color: #666;line-height: 30px;font-weight: normal;}
.xiangguan-casebox ul li:hover .news_bott p{line-height:25px;font-size: 14px;color:#999;}



/*案例列表*/
.casebox{width:1275px;margin:10px auto 50px auto;}
.casebox ul{overflow:hidden; zoom:1;}
.casebox ul li{width: 375px;float: left;margin:0 25px 25px 25px;position: relative;}
.casebox ul li a{width:375px;height:250px;position: absolute;overflow:hidden;top:0px;left:0;right:0;}
.casebox ul li a:hover img{width: 375px;height:250px;transform:scale(0.9,0.9); -ms-transform:scale(0.9,0.9); -moz-transform:scale(0.9,0.9); -webkit-transform:scale(0.9,0.9); -o-transform:scale(0.9,0.9);}
.casebox ul li:hover{background:url('../images/icon03.png') no-repeat right 250px;color:#fff;border-radius:0;}
.casebox ul li:hover img{width:375px;height:250px;transform:scale(0.9,0.9); -ms-transform:scale(0.9,0.9); -moz-transform:scale(0.9,0.9); -webkit-transform:scale(0.9,0.9); -o-transform:scale(0.9,0.9);}

.casebox ul li img{width: 100%;height:250px;-moz-transition: all 2s; -webkit-transition: all 2s; -ms-transition: all 2s; -o-transition: all 2s; transition: all 2s;}
.casebox ul li .news_bott{padding:15px 0;margin-top: 250px;}
.casebox ul li .news_bott h2{font-size:18px;color: #666;line-height: 30px;font-weight: normal;}
.casebox ul li .news_bott p{line-height:25px;font-size: 14px;color:#999;}

.casebox ul li:hover .news_bott{padding: 15px 0 15px 60px;background:url(../images/blue.png) no-repeat;-webkit-transition: all .8s; -moz-transition: all .8s; transition: all .8s;}
.casebox ul li:hover .news_bott h2{font-size:18px;color: #666;line-height: 30px;font-weight: normal;}
.casebox ul li:hover .news_bott p{line-height:25px;font-size: 14px;color:#999;}


.casebox2-a a{text-align:center;color:#181818;font-size: 16px;display:block;margin:30px auto 100px auto;padding:0 15px;border: 1px solid #EEEEEE;border-radius:4px;width:85px;height:40px;line-height:40px;transition: all .5s linear;}
.casebox2-a a:hover{border: 1px solid #999;}

/*案例 show*/
.cases-next{width:100%;margin:30px auto;height:30px;border-top:1px solid #ccc;padding: 20px 0;}
.cases-next p{width:100%;height: 35px;line-height: 35px;color:#333;float:left;overflow: hidden;font-size:14px;}
.cases-next p:hover{transition: All 0.8s ease; -webkit-transition: All 0.8s ease; -moz-transition: All 0.8s ease; -o-transition: All 0.8s ease;}
.cases-next p a{line-height: 35px;color:#333;font-size:14px;}

.content-info{width: 100%; height: auto; overflow: hidden;}
.content-info2{float: left; font-size: 22px; color: #333333; font-weight: bold;}
.content-info2 em{display: block; width: 24px; height: 4px; background: #d50e18; margin-top: 30px; overflow: hidden;}


.url-link{float: right; line-height: 42px; overflow: hidden;}
.url-link em{ font-size: 16px; color: #d50e18; font-style: normal;}
.url-link div{display: inline-block; vertical-align: top; width: 42px; height: 42px; border: 1px solid #da2932; border-radius: 100%; margin-right: 15px;  transition: all .5s ease 0s; position: relative; overflow: hidden;}
.url-link div span{display: block; width: 40px; height: 40px; background: url(../images/urllinka.png) center center no-repeat; position: relative; z-index: 1;}
.url-link div:after{content: ""; display: block; width:0%; height: 0%; background: #d50e18; position: absolute; top:50%; left:50%; border-radius: 100%; transition: all .5s ease 0s;}
.url-link:hover div{background: #d50e18;}
.url-link:hover div span{background-image: url(../images/urllink.png);}
.url-link:hover div:after{width: 100%; height: 100%; top: 0; left: 0;}


/*案例 show  相关 案例*/

.xgcasebg {float:left; width:270px; height:155px;position:relative; overflow:hidden   }
.xgcasebg img {width:270px;height:155px; z-index:1;  }

.xgcasebg .pic_bg {width:0; height:0; background:#eee; position:absolute; top:50%; left:50%; z-index:0}
.xgcasebg:hover .pic_bg {width:100%; height:100%;top:0; left:0; opacity:0.80; filter:alpha(opacity=80);/*支持 IE 浏览器*/ -moz-opacity:0.80;/*支持 FireFox 浏览器*/ +filter:alpha(opacity=50);/*支持 IE 浏览器*/  transition: All 0.3s ease; -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease;}

.xgcasebg .pic_text{width:100%; height:100px;  position:absolute; top:50%; text-align:center; background-position:center;color:#fb811d;font-size:20px; opacity:0;filter:alpha(opacity=0);-moz-opacity:0; z-index:11}
.xgcasebg:hover .pic_text{ opacity:1;filter:alpha(opacity=1);-moz-opacity:1; top:20%;transition: All 0.5s ease; -webkit-transition: All 0.5s ease; -moz-transition: All 0.5s ease; -o-transition: All 0.5s ease; }
 
.xgcasebg .pic_more{ width:68px; height:64px;  position:absolute; top:100%; left:36%; z-index:11 }
.xgcasebg:hover .pic_more {top:38%;transition: All 0.5s ease; -webkit-transition: All 0.5s ease; -moz-transition: All 0.5s ease; -o-transition: All 0.5s ease; background: url(../images/icon_jia.png) no-repeat bottom center; }
.xgcasebg:hover .pic_more:hover { transition: All 0.5s ease; -webkit-transition: All 0.5s ease; -moz-transition: All 0.5s ease; -o-transition: All 0.5s ease; background: url(../images/icon_jia2.png) no-repeat bottom center; +background:none;  -webkit-transform:rotate(270deg) scale(1,1);
    -moz-transform:rotate(180deg) scale(1,1);
    -o-transform:rotate(180deg) scale(1,1);
    -ms-transform:rotate(180deg) scale(1,1);
    transform:rotate(180deg) scale(1,1);}


/*手机微信开发模块*/
.wxtopcon{width:760px;height:314px;margin:auto;background: url(../images/wxtop_conbg.jpg);margin-top:80px;padding-top:70px;padding-left:40px;}
.wxtopcon dl{width:80px;float:left;margin-right:45px;text-align: center;}
.wxtopcon dl span{width:80px;height:60px;position: relative;display: block;}
.wxtopcon dl span img{width:80px;height: 60px;position: absolute;left:0;top:0;margin:0 auto;}
.wxtopcon dl h1{line-height: 40px;font-size: 16px;color:#111111;font-weight: normal;}
.wxtopcon ul{color:#111111;line-height: 28px;text-align: center;font-size: 16px;padding-top: 150px;}


.title_code_zhu {font-size:32px; ont-size:60px; font-size:40px\0;height:52px; line-height:52px;text-align: center;color:#333;font-weight:normal;}
.title_code_fu { font-size:20px;font-weight:normal; height:36px; line-height:36px; background: url(../images/title_code_fu.jpg) no-repeat center;text-align: center;color:#333;}

/* 内容 */
.h1-title{padding:35px 0 15px 0;margin:20px 0 30px 0;border-bottom: 1px dotted #cccccc;text-align: center;}
.h1-title h1{font-size:26px;color:#555;font-weight: normal;height: 40px;line-height: 40px;}
.h1-title .time{font-size:14px;font-weight:normal;width:100%;margin:5px 0;}

.nextbox{width:100%;height: 35px;margin:25px auto;padding:30px 0;border-top:1px solid #E0E0E0;border-bottom:1px solid #E0E0E0;}
.nextbox .zuo{height: 35px;line-height: 35px;padding-left:13px;color:#555;float:left;overflow: hidden;}
.nextbox .zuo a{color:#555;}

.nextbox .you{height: 35px;line-height: 35px;padding-left:13px;color:#555;float:right;overflow: hidden;}
.nextbox .you a{line-height: 35px;color:#555;font-size:14px;text-decoration: none;}
.nextbox .you a:hover{color:#f20c2b;transition: All 0.8s ease; -webkit-transition: All 0.8s ease; -moz-transition: All 0.8s ease; -o-transition: All 0.8s ease; }

.nextbox a{line-height: 35px;color:#fff;font-size:14px;text-decoration: none;}
.nextbox a:hover{color:#f20c2b;transition: All 0.8s ease; -webkit-transition: All 0.8s ease; -moz-transition: All 0.8s ease; -o-transition: All 0.8s ease; }

.nextbox-down{line-height:28px; font-size:14px;margin-bottom:30px;padding-top:30px; margin-top:20px}
.nextbox-down .qq-link{border:1px solid #e80111;color:#ffffff;background:#e80111;padding:3px 6px;text-align: center;}
.nextbox-down h2{color:#d30000;}
.nextbox-down h2 a{color:#d30000;background: none;border:0;}

.hotnews,.hottips{background:#ffffff; overflow:hidden; margin:15px 0;border-radius: 6px;}
.hotnews h2,.hottips h2{ height:45px; line-height:45px; font-size:14px;border-bottom:1px solid #cccccc; text-indent:18px;}
.hotnews ul,.hottips ul{ margin:10px 18px 18px 18px;}
.hotnews li{ height:28px; line-height:28px; display:block; overflow:hidden;;background:url(../img/icon.gif) no-repeat 0px 13px; text-indent:12px;}
.hotnews li a{white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis; width:264px;display:block; overflow:hidden;}
.hottips ul{ margin-top:18px; display:block; overflow:hidden;}
.hottips li a{ color:#fff;}
.hottips li{background-color:#d7232c;color: white;font-size: 14px;display: inline-block;margin-bottom: 6px;margin-right: 6px;padding: 2px 4px;border-radius: 2px;opacity: 0.6;cursor: pointer; float:left\9;white-space:nowrap;filter:alpha(opacity=60);
box-shadow:0 4px 3px -3px rgba(0, 0, 0, 0.1);
-webkit-transition:opacity 0.2s ease-in-out;
-moz-transition:opacity 0.2s ease-in-out;
-ms-transition:opacity 0.2s ease-in-out;
-o-transition:opacity 0.2s ease-in-out;
transition:opacity 0.2s ease-in-out}
.hottips li:hover{opacity:1;filter:alpha(opacity=100);}
.hottips li:nth-child(2n){background-color:#2F9944;}
.hottips li:nth-child(3n){background-color:#0664B0;}
.hottips li:nth-child(4n){background-color:#CA5254;}


.des_headerbg{background:#181818;width:100%;height: 800px;}
.des_header{width:1200px; position:relative; height:auto; margin: 0 auto;}

.hx_box{width:1200px;height:800px;overflow:hidden;position:relative;z-index:30; margin: 0 auto;}

.hx_big_box{position:absolute; z-index:40;}
.hx_big_box li{width:1200px;float:left; position:relative; z-index:50;vertical-align:middle;}
.hx_big_box li img{width:100%; height:auto;padding:0 auto;}

.hx_s{width:100%;background: #000;opacity: 0.7;height:74px;left:0;right:0;overflow:hidden; position:relative;top:-75px;z-index:31;}
.hx_s_box{position:absolute;width:500px;margin:0 auto;z-index:50;left: 0;right: 0;top:12px;}
.hx_s_box li{float:left; width:72px; height:48px; margin-right:10px;border-bottom: 4px solid #ddd;cursor:pointer;}
.hx_s_box li.on{border-bottom: 4px solid #f00;z-index:99;}
.hx_s_box li img{width:72px;height:48px;}

.btn_left,.btn_right{display:block; background:url(../images/btn_left.png) no-repeat;width:45px; height:45px;position:absolute;z-index:96;}
.btn_left{top:320px; left:-22%;}
.btn_right{background:url(../images/btn_right.png) no-repeat; top:320px;right:-22%;}