/**
 * Created by 爱吃肉 on 2017/9/25.
 */
body, button, input, select, textarea{font: 12px/1.5 "Microsoft YaHei",arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;}
body{background-color: #eeeeee;}
*{padding:0 0; margin:0 0;}
a{ color:#333333; text-decoration:none}
a:hover{text-decoration:none; color: #000;}
img{border:none;}
li{ list-style:none;}
.clear{ clear:both;}
.w1200{width: 1200px; margin: 0 auto; display: block;}
.fl{float: left;}
.fr{float: right;}
.block{display: block;}
/** 特殊字体处理 **/
@font-face {
    font-family: 'SYBEBAS';
    src:url('fonts/BEBAS/BEBAS.jpg') format('truetype'),
    url('fonts/BEBAS/BEBAS1.jpg') format('embedded-opentype'),
    url('fonts/BEBAS/BEBAS2.jpg') format('truetype');
    font-weight: bold;
    font-style: normal;
}

/** 全局渐变文字样式**/
.text-gradient {
    font-family: 'SYBEBAS';
    font-size: 20px;
    line-height: 25px;
    color: transparent;
    background: -webkit-linear-gradient(-30deg, #ffffff 20%, #ffffff 100% );
    -webkit-background-clip: text;
}

/**头部**/
.header{width:100%; height:80px;  position: relative; background-color: #fff; display: block;}
.header>.w1200{ display: block; height: 100%;background: #ffffff;}
.fixedNav{
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    z-index:100000;
    _position:absolute;
    _top:expression(eval(document.documentElement.scrollTop));
}
.header .header-logo{ padding: 9px; width: 267px; height: 62px;}
.header .header-nav{width: 640px;}
.header .header-nav .nav{float: left; margin-left:60px; height: 60px; margin-top: 20px;}
.header .header-nav .nav li{float: left;  }
.header .header-nav .nav li h3{position: relative; font-size:16px;height: 60px; text-align: center; line-height: 60px; margin: 0 8px; padding: 0 20px;}
.header .header-nav .nav li h3:after{background: #161c60;bottom: 0;content: ''; width: 0;display: block;height: 3px;left: 0;
position: absolute;-webkit-transition: width 300ms cubic-bezier(0.165, 0.84, 0.44, 1);transition: width 300ms cubic-bezier(0.165, 0.84, 0.44, 1);  }
.header .header-nav .nav li:hover h3:after{ width:100%}

.header .menu{display:none; z-index:99;position: absolute; width: 100%; top: 80px; height: 255px; left: 0; background-color: rgba(22, 28, 96, 0.95); color: #ffffff;  padding-bottom: 20px;}
.header .menu a{color: #aaaaaa;}
.header .menu a:hover{color: #ffffff;}
.header .menu .menu-box{float: left; margin-left: -40px;}
.header .menu dl{float: left; font-size: 14px;  margin-left: 20px;  width: 215px; margin-top: 35px; line-height: 30px; font-weight: bold;}
.header .menu .rb{border-right: 1px solid #aaaaaa; }
.header .menu dl dt{margin-bottom: 10px; }
.header .menu dl dd{float: left; width: calc(100% - 20px); padding-left: 10px;}
.header .menu dl dd a:before{content: "-"; padding: 0 5px; color: #aaa; font-weight: bold;}
.header .menu dl dd.last{width: 185px; height: 120px;}
.header .menu dl dd.last img{width: 185px; height: 120px; background-color: #ccc;}
.header .menu .menu-img {margin-top: 40px;}
.header .menu .menu-img img{width:210px; height: 170px; margin-left: 20px; background-color: #ccc; }
.header .header-tel{ float: left; width: 260px; font-size: 30px; text-align: right; line-height: 80px; color: #de4129; font-family: SYBEBAS;}

.banner{width: 100%; height: 860px; position: relative; }
.banner .bd{position:relative; z-index:0;}
.banner .bd ul,.banner .bd ul li{width: 100%; height: 860px;}
.banner .bd ul li{background-position: center center; background-repeat: no-repeat;}
.banner .bd ul li a{float: left; width: 100%; height: 100%}
.banner .bd ul li .banner-text{text-align: center; padding-top: 150px;}
.banner .bd ul li .banner-text dd {display: block;}
.banner .bd ul li .banner-text .dd1{  padding-bottom: 60px;}
.banner .bd ul li .banner-text .dd2{}
.banner .bd ul li .banner-text .dd3{}
.banner .hd{ width:100%;  position:absolute; z-index:1; bottom:20px; left:0; height:30px; line-height:30px; text-align:center; }
.banner .hd ul li{ cursor:pointer; display:inline-block; *display:inline; zoom:1; width:11px; height:11px; margin:4px; background:url(../images/dot-black.png) 0 0; overflow:hidden;
    line-height:9999px; filter:alpha(opacity=40);opacity:0.4; }
.banner .hd ul .on{ filter:alpha(opacity=100);opacity:1;  }

.service-box{ width: 100%; height: auto; display: block; padding-top: 100px; }
.service-box dl{width: calc(25% - 25px); float: left; cursor: pointer;padding-bottom: 100px; padding-left: 25px;}
.service-box dl dt h3{font-size: 16px; font-weight: bolder; color: #999; padding-bottom: 10px; position: relative; margin-bottom: 5px; }
.service-box dl dt h3:after{content: " "; height: 4px; width:220px; background-color: #f5a700; position: absolute; left: 0; bottom: 0;
    -webkit-transition: width 300ms cubic-bezier(0.165, 0.84, 0.44, 1);transition: width 300ms cubic-bezier(0.165, 0.84, 0.44, 1);}

.service-box dl dt p{font-size: 24px; color: #999; font-weight: 100; padding: 15px 0;}
.service-box dl dt .text-gradient {
    font-size: 48px;
    line-height: 55px;
    color: #111111;
}
.service-box dl:hover dt .text-gradient{color:transparent;}
.service-box dl dd{font-size: 14px; width:224px; border-bottom: 1px solid #cccccc; padding-top: 8px; line-height: 30px; padding-left: 3px; font-family: "Microsoft YaHei"  }
.service-box dl:hover dt h3{color: #111;}
.service-box dl dd a{color: #111111;}
.service-box dl dd:hover{background-color: #e3e3e3; }


.p-tagList {font-size: 0px;margin: 0 -10px -10px 0  }
.p-tagList__item { font-size: 14px; line-height: 1;display: inline-block;max-width: 100%;padding: 0 10px 10px 0;cursor: pointer;}
.p-tagList__link  {
    overflow: hidden;
    text-overflow: ellipsis;
    /* white-space: nowrap; */
    background: #f5a700;
    color: #ffffff;
    display: block;
    max-width: 100%;
    min-width: 75px;
    padding: 9px 10px 7px;
    text-align: center;
    border: 3px solid #f5a700;
}
.p-tagList__link:hover,.p-tagList .on  .p-tagList__link{
    color: #ffffff;
    border: 3px solid ;
    border-image: -webkit-linear-gradient( left ,#f5a700 ,#f5a700) 1 1;
}
.p-tagList__link--gy {
    background: #eef2f3
}
.p-tagList__link--seo {
    background: #c00;
    color: #fff;
    font-weight: 700
}
.p-tagList__link--seo:hover {
    background: #a30000;
    color: #fff
}
.p-tagList__link--ad {
    background: #cca800;
    color: #fff;
    font-weight: 700
}
.p-tagList__link--ad:hover {
    background: #b89800;
    color: #fff
}
.p-tagList__link--creative {
    background: #1870c3;
    color: #fff;
    font-weight: 700
}
.p-tagList__link--creative:hover {
    background: #135a9c;
    color: #fff
}
.p-tagList__link--marketing {
    background: #359c46;
    color: #fff;
    font-weight: 700
}
.p-tagList__link--marketing:hover {
    background: #2a7d38;
    color: #fff
}
.p-tags {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 40px;
    position: relative;

}
.p-tags__header {
    color: #fff;
    margin-right: 36px;
    padding: 8px 40px 8px 24px;
    position: relative;
    background-image: url(../images/tags.png);
    background-size: cover;
    background-repeat: no-repeat;
}
.p-tags__header:before {
    content: '';
    display: block;
    position: absolute
}
.p-tags__header:before {
    background: #fff;
    border-radius: 50%;
    height: 8px;
    left: 8px;
    margin-top: -4px;
    position: absolute;
    top: 50%;
    width: 8px
}
.p-tags__content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 40px;
    overflow: hidden;
    padding-right: 50px;
    font-family: "微软雅黑";
}
.p-tags__content.is-active {
    height: auto;
    overflow: visible
}
.p-tags__more {
    color: transparent;
    font: 0/0 a;
    overflow: hidden;
    text-shadow: none;
    border:none;
    height: 36px;
    position: absolute;
    right: 0;
    top: 0;
    width: 36px;
    background-image: url(../images/J.png);
    background-size: cover;
    background-repeat: no-repeat;
}
.p-tags__more:before, .p-tags__more:after {
    background: #fff;
    content: '';
    display: block;
    height: 4px;
    left: 50%;
    margin: -2px 0 0 -11px;
    position: absolute;
    top: 50%;
    width: 22px
}
.p-tags__more:after {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: -webkit-transform 200ms;
    transition: -webkit-transform 200ms;
    transition: transform 200ms;
    transition: transform 200ms, -webkit-transform 200ms
}
.is-active .p-tags__more:after {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}
.u-text-eng {font-size: 14px;}
.case-box-body .case-content{width: 100%;margin:0 auto; }
.case-box-body .case-content .case-list{width: calc(100% - 30px); margin: 0 15px; min-width: 1200px; float: left;}
.case-box-body .case-content .case-list li{width: calc(33.3333% - 30px); height: auto; float: left;   margin:15px; background-color: #ffffff;  overflow: hidden;  }
.case-box-body .case-content .case-list li:hover{box-shadow: 0 17px 50px 0 rgba(0,0,0,.19);transform: translate3d(0,-2px,0);transition: all .3s cubic-bezier(.55,0,.1,1);}
.case-box-body .case-content .case-list li img{width: 100%;background-color: #ccc; transition: all 0.36s;  border-bottom: 3px solid #999999; }
.case-box-body .case-content .case-list li:hover img{transform: scale(1.1); }
.case-box-body .case-content .case-list li a:hover img{border-bottom: 3px solid #00ffff;}
.case-box-body .case-content .case-list li .case-info{width: calc(100% - 40px); height: 110px;  background-color: #fff;  padding: 10px 20px 10px 20px; position: relative;}
.case-box-body .case-content .case-list li .case-info .case-t{color: #666666; font-size: 18px;}
.case-box-body .case-content .case-list li .case-info .case-c{ padding-right: 75px; font-size: 12px; color: #aaaaaa;}
.case-box-body .case-content .case-list li .case-info .case-d{position: absolute; right: 15px; bottom: 15px; font-size:18px; color: #aaaaaa; font-family: "SYBEBAS" }
.case-box-body .case-content .case-list li:nth-child(3n+1){clear:both;}
.case-box-body .case-content .case-more{ width:calc(100% - 60px);  margin: 0 30px;height: 60px; font-size: 18px; line-height: 60px; text-align: center; display: block; color: #ffffff; background: url("../images/casemore-bg-1.png") top center no-repeat;  background-size: 100% 60px; }
.case-box-body .case-content .case-more:hover{background: url("../images/casemore-bg-1.png") top center no-repeat; background-size: 100% 60px; transition: all .3s cubic-bezier(.55,0,.1,1);}
.events-box{}
.events-box .events-box-hd{border-left: 1px solid #ccc;border-right: 1px solid #ccc; width:calc(100% - 4px); height: 180px;  float: left;color: #111111; text-align: center;}
.events-box .events-box-hd-box{width: 398px; height: 120px; border-left: 1px solid #ccc;border-right: 1px solid #ccc; padding-top: 60px; margin-left: 398px; }
.events-box .events-box-hd h1{ margin-top: 20px; font-size: 45px; font-family: "SYBEBAS" ;}
.events-box .events-box-hd h1 span{width: 20px;font-size: 1px; display: inline-block;}
.events-box .events-box-hd small{font-size: 14px;}
.events-box ul{border-left: 1px #cccccc solid; width: 1199px;  float: left;}
.events-box ul li{border-right: 1px solid #ccc; width: 319px; float: left; padding: 40px; margin-left: -1px;}
.events-box ul li .eno{display: block; margin-bottom: 10px;}
.events-box ul li .text-gradient {font-size: 48px; line-height: 50px; color: #cccccc}
.events-box ul li a:hover .text-gradient{color: transparent;transition: all .3s cubic-bezier(.55,0,.1,1);}
.events-box ul li h4,
.events-box ul li p{font-size: 16px; line-height: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.events-box ul li a:hover h4,
.events-box ul li a:hover p{color: #244bc9}

/**案例幻灯**/
.case-banner{ position: relative; z-index: 1; width: 100%; height:828px; }
.case-banner-tit{ position: absolute; left: 50%; top: 0; z-index: 10; width: 400px; height: 125px; margin-left: -600px; color: #ffffff; }
.case-banner-tit h3{font-family: "SYBEBAS"; font-size: 36px; padding:35px 0 10px 40px;}
.case-banner-tit h3 span{width: 10px; font-size: 1px; display: inline-block;}
.case-banner-tit p{font-size: 16px; font-weight: bold; padding-left: 40px;}

.case-banner-hd{ position: absolute; left: 50%; top: 475px; z-index: 4; display: block; width: 400px; height:15px; margin-left: -570px; }
.case-banner-hd  li{ cursor:pointer; display: inline-block; *display:inline; zoom:1; width:11px; height:11px; text-indent: -999px; white-space: no-wrap; overflow: hidden; margin:4px; background:url(http://sypc.rochao.com/templets/images/dot-wt.png) 0 0; filter:alpha(opacity=60);opacity:0.6; }
.case-banner-hd .on{ filter:alpha(opacity=1);opacity:1;  }

.case-banner-bd li{ width: 100%; height:828px; background-position: top center; background-repeat: no-repeat;}
.case-banner-bd li a.bglink { position: absolute; top: 0; left: 0; z-index: 2; display: block; width: 100%; height: 100%; }
.case-banner-bd .bd-info{position: relative;z-index: 3;height: auto;}
.case-banner-bd .bd-info dl{ position: absolute; left: 0; top:0; z-index: 1; display: block; width: 400px; height: 520px; color:#fff; background-color: #111111; }
.case-banner-bd .bd-info dl dd{font-size: 18px; padding-left: 40px;}
.case-banner-bd .bd-info dl .dd1{padding:180px 0 60px 40px; }
.case-banner-bd .bd-info dl .dd2{ margin-bottom: 15px; }
.case-banner-bd .bd-info dl .dd2 span { padding-bottom: 10px; border-bottom: 3px solid #fff; }

.abouts-banner{width: 100%; min-width: 1200px;  position: relative; margin-top: 100px; display: block;}
.abouts-banner .abouts-banner-bd{width: 57%; height: 100%; float: right; padding-left: 8%; padding-top: 36px; background: url("../images/img-bannerbg.png") left top no-repeat; background-size: 100% 80%;}
.abouts-banner .abouts-banner-bd ul{float: left;}
.abouts-banner .abouts-banner-bd li{float: left;}
.abouts-banner .abouts-banner-bd li img{width: 100%;display: block; min-height: 300px;background-color: #000000;}
.abouts-banner .abouts-banner-hd{width: 100%; display: block; float: left; }
.abouts-banner .abouts-banner-hd li{width: 12.5%; height: auto; float: left; cursor: pointer; }
.abouts-banner .abouts-banner-hd li img{width: 100%;  -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
.abouts-banner .abouts-banner-hd li.on img{-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%); filter:none;}
.abouts-banner .abouts-banner-info{width: 30%;  min-width: 380px; float: left; position: absolute; left: 0;
    top:0;}
.abouts-banner .abouts-banner-info h1 {margin-right: 110px; margin-top:85px; font-family: "SYBEBAS"; font-size: 60px; line-height: 72px; float: right;}

.abouts-banner .abouts-banner-info img{position: absolute; top:185px; right: -190px;}
.abouts-banner .abouts-banner-info  p{ display: none; width:400px; height: auto; position: absolute; top:320px; right: -50px; font-size: 18px; color: #666;}
.abouts-banner .abouts-banner-info  p span { display: block; text-indent: 2em; padding-top: 10px; }

.costomer{padding-top: 50px;}
.costomer .costomer-header{width: 100%; text-align: center; font-size: 16px; margin-bottom: 60px;}
.costomer .costomer-header h1{font-family: "SYBEBAS"; font-size: 48px; line-height: 60px;}
.costomer .costomer-list{width: 100%; height: auto; float: left;}
.costomer .costomer-list li{float: left; width: 25%; text-align: center; height: 165px;}
.costomer-fooder{width: 100%; height:567px; background: url("../images/costomer-f-b1.jpg") top center no-repeat;}

.footer{width: 100%; height: 835px; display: block; background: url("../images/fooder-bg.jpg") top center no-repeat; color: #cccccc;}
.footer .footer-contact{ width: 1160px; font-size: 18px; padding-top: 80px; margin-left: 40px;}
.footer .footer-contact .fc-title{font-family: 'SYBEBAS'; font-size: 36px; line-height: 60px; padding-bottom: 15px;}
.footer .footer-contact .fc-title span{width: 8px; font-size: 1px; display: inline-block;}
.footer .footer-contact .fc-tel{font-family: 'SYBEBAS';font-size: 48px; color: #ffa902; line-height: 45px; padding-bottom: 20px;}
.footer .footer-service{color: #cccccc;  font-size: 18px; margin-top: 60px; margin-left: 40px;}
.footer .footer-service p{height: 50px; margin: 20px 0; display: block;}
.footer .footer-service p.list{height: 28px;}
.footer .footer-service .fs-btn{width:148px; cursor: pointer; height: 48px; line-height: 48px; margin-right: 20px; border: 1px #ffffff solid; color: #cccccc; font-size: 18px; text-align: center;display: inline-block; }
.footer .footer-service .fs-btn2{background: url("../images/f-btn-2.png") center no-repeat; width: 175px; height: 55px; display: block; line-height: 55px; color: #ffffff; text-align: center;}
.footer .footer-service .fs-btn2:hover{background: url("../images/f-btn-2a.png") center no-repeat; }
.footer .footer-info{  width: 100%; float: left; margin-top:40px; margin-bottom: 40px;}
.footer .footer-info-bd{margin-left: 40px;padding-left: 298px; height: 60px;  padding-top: 20px; background:url("../images/footer-logo.png") left center no-repeat;
line-height: 19px; font-size:14px; }
.footer .footer-info-bd p{padding-top: 25px;}
.footer .footer-info-rd{padding-left:20px;text-align: right; }
.footer .footer-info-rd img{padding-right: 20px; }
.footer .footer-menu{width: 100%; /*height: 35px;*/ line-height: 35px; text-align: center;float: left; }
.footer .footer-menu a{color: #666666; padding: 0 10px; display: inline-block; font-size: 14px; }
.footer .footer-menu a:hover{color: #cccccc}
.footer .footer-copyright{text-align: center;color: #666666; width: 100%; float: left;margin-top: 10px;}
/**分页样式**/
.pagelist{width: 100%; height:60px; margin: 50px 0; text-align: center; font-size: 14px;}
.pagelist ul { list-style: none; }
.pagelist li { display: inline-block; }
.pagelist li span,.pagelist li a{display: inline-block; margin:0 5px; line-height: 28px; padding: 0 8px; min-width: 28px; height: 28px; border: 2px #ccc solid;text-align: center; color: #244bc9; background-color: #fff; }
.pagelist .thisclass a,.pagelist li a:hover{border: 2px #244bc9 solid; background-color: #244bc9;color: #ffffff; }
.pagelist .first,.pagelist .last{line-height: 60px;  border: none;}
.pagelist .first{color: #ffffff; width: 60px; height: 60px; background: url("../images/list-f-b.png") center no-repeat;}
.pagelist .last{color: #244bc9; width: 60px; height: 60px; background: url("../images/list-f-l.png") center no-repeat;}
.pagelist .first:hover,.pagelist .last:hover{border: none;}


/**右侧 客户菜单**/
.sidescroll{position: fixed; right: 0; top:400px; width: 70px;}
.sidescroll ul li{width: 70px; height: 70px; display: block; cursor: pointer;  position: relative;}
.sidescroll ul li.qq{background: url("../images/sidescroll-qq.png")top center no-repeat}
.sidescroll ul li.wx{background: url("../images/sidescroll-wx.png")top center no-repeat}
.sidescroll ul li.qq:hover{background: url("../images/sidescroll-qq-h.png")top center no-repeat}
.sidescroll ul li.wx:hover{background: url("../images/sidescroll-wx-h.png")top center no-repeat}
.sidescroll ul li  span{display: none}
.sidescroll ul li:hover span{display: block;}
.sidescroll ul li.qq span{}
.sidescroll ul li.qq:hover span{position: absolute; right: 70px; top:0;}
.sidescroll ul li.wx:hover span{position: absolute; right: 70px; top:-26px;}
.sidescroll ul li.top{background: url("../images/sidescroll-top.png")top center no-repeat; display: none;}

/**caselist*/
.caselist-banner{width: 100%; background: url("../images/caselist-banner.jpg") top center no-repeat; height:400px; margin-bottom: 50px;}
.newlist-banner{width: 100%; background: url("../images/newlist-banner.jpg") top center no-repeat; height:400px; margin-bottom: 50px;}


/**about**/
.about-banner{width: 100%; background: url("../images/about-banner.jpg") top center no-repeat; height:400px; margin-bottom: 20px; }
.about-banner1{width: 100%; background: url("../images/about-banner1.jpg") top center no-repeat; height:598px; margin-bottom: 20px; }
.about-banner2{width: 100%; background: url("../images/about-banner2.jpg") top center no-repeat; height:598px; margin-bottom: 20px; }
.about-banner3{width: 100%; background: url("../images/about-banner3.jpg") top center no-repeat; height:598px; margin-bottom: 20px; }
.about-banner4{width: 100%; background: url("../images/about-banner4.jpg") top center no-repeat; height:598px; margin-bottom: 20px; }
.about-banner5{width: 100%; background: url("../images/about-banner5.jpg") top center no-repeat; height:598px; margin-bottom: 20px; }
#about-team { margin-top: 10px; }
.about-r{width: 590px; height:660px; padding-bottom: 335px; background: url("../images/about/r2.png") bottom right no-repeat; margin-bottom: 10px; }
.about-l{width: 590px; height: 325px; margin-bottom: 10px; padding-left: 10px;}
.about-l .u-info{width:290px; height: 325px; background: #111111; color: #fff; position: relative }
.about-l .info-a{padding-left: 40px ; padding-top: 45px; font-size: 18px;}
.about-l .info-a .text-gradient{font-size:30px; }
.triangle-left:before {
    content: " ";
    position: absolute;
    top:142px;
    left: -20px;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-right: 20px solid #111111;
    border-bottom: 20px solid transparent;
}

.triangle-right:before {
    content: " ";
    position: absolute;
    top:142px;
    right: -20px;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-left: 20px solid #111111;
    border-bottom: 20px solid transparent;
}


.about-l .info-b{font-size: 14px; color: #cccccc; margin-top: 40px; margin-left: 40px;}
.about-b{width: 100%; height:216px; margin-bottom: 150px; float: left;}
.about-b img{width:calc(16.6666% - 10px);margin-left: 10px; padding: 0; border: 0; float: left;}

/**service**/
.s-banner{width: 100%; background: url("../images/s-banner.png") top center no-repeat; height:400px; }
.service-l{text-align: center;}
.service-l li{float: left; width: 25%; margin-bottom: 40px;  }
.service-l li img{width: 100%;}
.service-l li p{font-size: 18px; color: #666; line-height: 35px;}
.service-zx{ text-align: center; margin-bottom: 60px; margin-top: 40px;}
.service-zx .text-gradient{font-size: 45px; line-height: 80px;}
.service-zx .text-gradient b{font-size: 1px; width: 12px; font-weight: 100; display: inline-block;}
.service-zx .szbtn{background: url("../images/service/s-zx.png") no-repeat; font-size: 18px; width: 460px; display: inline-block; height: 60px; text-align: center; line-height: 60px; color: #ffffff;}
.service-zx .szbtn:hover{background: url("../images/service/s-zx2.png") no-repeat;}
/**case**/
.c-banner{width: 100%; background:#1e2022 url("../images/cbanner.jpg") top center no-repeat; height:400px; padding-bottom: 180px; }
.n-banner{width: 100%; background:#1e2022 url("../images/newlist-banner.jpg") top center no-repeat; height:400px; padding-bottom: 180px; }
.case-right{width: 310px; margin-top: -110px; height: auto; background: #ffffff;}
.case-right .case-right-top{background: url("../images/case-right-bg.png") top center no-repeat; width: 280px; padding-left: 30px; height: 80px; padding-top: 30px; color: #ffffff; font-size:14px;}
.case-right .case-right-top h1{font-family: SYBEBAS; font-size:18px; line-height: 35px;}
.case-right .case-right-box{ margin-top: 20px; padding: 0 25px;}
.case-right .case-right-box li{width: 260px; text-align: center; margin-bottom: 15px; display: block; font-size: 14px;}
.case-right .case-right-bottom{margin: 35px 15px;}
.case-left{width: 870px; float: left; margin-top:-255px; height: auto;}
.case-left .case-left-logo{display: block; width: 140px; height: 140px; background-color: #fff; text-align: center; margin-bottom: 15px;}
.case-left  .case-left-title{width: 100%; color: #ffffff; padding: 15px 0;}
.case-left .case-left-tag{margin-top: 50px;}
.case-left .case-left-tag a{height: 34px; color: #666666; line-height: 34px;border: 3px solid #EEEEEE; background-color: #ffffff; margin-right: 20px;  display: inline-block; padding: 0 25px; font-size: 14px; text-align: center; font-weight: bold;}
.case-left .case-left-tag a:hover{color: #1a1a1a;border: 3px solid;border-image: -webkit-linear-gradient( left ,#2245C8 ,#43A8DF) 1 1;  }
.case-left .case-left-content{font-size: 14px; color: #333333; float: left; margin: 50px 0;}

.case-latest{background-color: #ffffff; width: 100%; height: 450px;}
.case-latest .case-latest-top{width: 100%; font-size: 14px; padding: 20px 0; float: left; margin-top: 20px;}
.case-latest .case-latest-box {width: 1220px; margin-left: -20px; height:290px; float: left; }
.case-latest .case-latest-box li{width: 380px; margin-left: 20px; float: left;height:290px;}

.article { overflow: hidden; }
.article img { /*display: block;*/ max-width: 1200px; }

.coltit { padding: 10px 0; margin-bottom: 20px; text-align: center; font-size: 20px; }
.coltit strong { color: #f00; }

.singlepage { margin-bottom: 40px; padding: 20px; min-height: 400px; font-size: 14px; color: #333333; background-color: #fff; box-shadow: 0 17px 50px 0 rgba(0,0,0,.19); }