@charset "UTF-8";

/*顶部图标*/
.container_nav .row ul li.li1 a i {background-image: url(../images/solution/solution_li1.png);}
.container_nav .row ul li.li2 a i {background-image: url(../images/solution/solution_li2.png);}
.container_nav .row ul li.li3 a i {background-image: url(../images/solution/solution_li3.png);}
.container_nav .row ul li.li4 a i {background-image: url(../images/solution/solution_li4.png);}
.container_nav .row ul li.li5 a i {background-image: url(../images/solution/solution_li5.png);}
.container_nav .row ul li.li6 a i {background-image: url(../images/solution/solution_li6.png);}
.container_nav .row ul li.li7 a i {background-image: url(../images/solution/solution_li7.png);}
.container_nav .row ul li.li8 a i {background-image: url(../images/solution/solution_li8.png);}
.container_nav .row ul li:hover a i,.container_nav .row ul li.on a i {background-color: transparent;border-color: #00000000;}
.container_nav .row ul li:hover a span,.container_nav .row ul li.on a span {color: #ffd800;}


.w_title {text-align: center;}
.w_title h2{font-size:30px;text-transform:uppercase;}
.w_title h2 span{font-weight:lighter}
.w_title h5{font-size:20px}
.w_title h5 span{font-weight:400}
.w_center{width:1200px;margin:auto}
.w_center{position:relative;z-index:1}

.w_solutions .w_icon_wrap{text-align:justify;margin-top:60px;margin-bottom:74px}
.w_solutions .w_icon_wrap li a{color:#fff}
.w_solutions .w_icon_wrap li:last-child{margin-right:0}
.w_solutions .w_icon_wrap li{display:inline-block;text-align:center;color:#fff;font-size:17px;float:left;margin-right:49px}
.w_solutions .w_icon_wrap li .w_pic{position:relative;width:107px;height:107px;margin-bottom:17px}
.w_solutions .w_icon_wrap li .w_pic img{width:100%;position:absolute;left:0;top:0}
.w_solutions .w_icon_wrap li .w_pic .w_pic_hover{display:none}
.w_function .w_icon_wrap li,.w_solutions .w_icon_wrap li{transition:all .25s}
.w_function .w_icon_wrap li:hover,.w_solutions .w_icon_wrap li:hover{transform:translate3d(0,-30px,0)}
.w_solutions .w_icon_wrap li:hover img{display:none}
.w_solutions .w_icon_wrap li:hover .w_pic_hover{display:inline-block}
.w_solutions .w_icon_wrap li:hover{color:#ffa64f}
.w_solutions .w_con_wrap{position:relative}
.w_solutions .w_con_wrap img{border:1px solid #ebebeb}
.w_solutions .w_con{position:absolute;right:0;top:80px;background:#006acd;color:#fff;width:445px;padding:0 37px;height:300px;padding-top:52px}
.w_solutions .w_con h1{font-size:32px;margin-bottom:15px}
.w_solutions .w_con h2{font-size:27px;font-weight:400;margin-bottom:29px;text-transform:uppercase}
.w_solutions .w_con p{font-size:14px;line-height:25px;text-align:justify}
.w_solutions .w_con a{display:block;width:142px;height:42px;text-align:center;line-height:42px;background:#878787;font-size:14px;color:#fff;position:absolute;bottom:-21px;left:0;right:0;margin:auto;transition: color .2s,background .2s;
    -webkit-transition: color .2s,background .2s;}
.w_solutions .w_con a:hover {background:#990099;}

.w_function{text-align:center;padding: 0px 0px 0px;}
.w_function .w_icon_wrap{padding:60px 0}
.w_function .w_icon_wrap li{width:180px;padding:0 70px;display:inline-block}
.w_function .w_icon_wrap li img{width:100%}
.w_function .w_icon_wrap li p {color: #555;font-size: 20px;margin-top: 15px;}
.w_fl {padding-top: 140px;}
.w_function .w_web_wrap{position:relative;text-align:left;color:#fff}
.w_function .w_web_wrap.w_web_cloth{background:#273139}
.w_function .w_web_wrap h1{position:absolute;font-size:40px;line-height:65px;top:0;left:22px;margin-bottom:14px;z-index: 1;}
.w_function .w_web_wrap p{font-size:16px;letter-spacing:-.05em;position:absolute;line-height:24px;top:69px;left:22px;text-transform:uppercase;font-weight:lighter}
.w_function .w_web_wrap p span{font-weight:700}
.w_function .w_con{background:#0095e2 url(../images/solution/w_bg3.jpg) no-repeat top center;overflow:hidden}
.w_function .w_con .w_grid{float:right;}
.w_function .w_web_wrap h2,.w_function .w_web_wrap p{z-index:1}


.w_pics{width:285px;overflow:hidden;height:211px;z-index:0;position:relative;background:#273139;border-radius:20px}
.w_web_wrap.spe .w_pics{height:165px}
.w_web_wrap.spe2 .w_pics{height:112px}
.w_pics img{position:absolute;z-index:0;height:50%;bottom:0;right:0}
.w_web_wrap.on .w_pics{background:#990099}
.w_function .w_web_wrap.spe2 h1{line-height:32px;padding-top:20px;margin-bottom:0;font-size:22px}
.w_function .w_web_wrap.spe2 p{top:58px;line-height:20px;font-size:12px}
.w_function .w_web_wrap.spe3{float:left;margin-right:17px;width:138px}
.w_function .w_web_wrap.spe3 .w_pics{height:168px;width:138px}
.w_function .w_web_wrap.spe3 .w_pics img{width:70%;height:auto}
.w_function .w_web_wrap.spe3 h1{top:30px;line-height:22px;font-size:18px}
.w_function .w_web_wrap.spe3 p{font-size:12px;top:82px;line-height:18px}

.sm1 li{height:215px;width:284px}
.sm2 li{height:215px;width:412px}
.sm3 li{height:215px;width:307px}
.sm4 li{height:215px;width:294px}
.sm li{float:left}
.sm li em{width:103px;height:34px;font-size:18px;color:#fff;line-height:34px;float:left}
.sm li em.bg1,.sm li em.bg2,.sm li em.bg3{background-image:url(../images/solution/dn1.png)}
.sm li img{margin:0 10px;float:left}
.sm li i{color:#fff;text-align:left;font-size:14px;float:left}
.w_grid{width:865px;padding-top: 80px;}

.w_marketing_services {padding-top: 60px;}
.thismsg{text-align:center;width:200px;}
.thismsg h5{font-size:30px;text-transform:uppercase;font-weight:700;line-height:70px;color:#0095e2}
.thismsg p{font-size:14px;line-height:24px;color:#343434}
.thismsg p em{color:#0095e2}
.this{position:relative;height: 663px;background: url(../images/solution/this1.jpg) center no-repeat;}
.thismsg{position:absolute;left:50%}
.thismsg1{top:142px;margin-left:-430px}
.thismsg2{top:142px;margin-left:200px}
.thismsg3{margin-left:-468px;top:383px}
.thismsg4{    margin-left: -110px;top:383px}
.thismsg5{margin-left:323px;top:383px}


.index-4{    margin: 40px 0px;}
.index-4 .title {
  text-align: center;
}

.index-4 .title p {
  color: #444;
  font-size: 26px;
  position: relative;
}

.index-4 .title p:first-child {
  text-align: center;
  font-weight: 600;
}

.index-4 .title p:first-child:before {
  display: block;
  content: '';
  height: 2px;
  width: 50px;
  left: 48%;
  top: 50px;
  margin: auto;
  position: absolute;
  background: #bf3131;
}

.index-4 .title p:last-child {
  color: #999;
  font-size: 14px;
  margin: 30px 0 10px 0;
}

.index-4  .col-md-2 {
    width: 16.66666667%;float:left;
}

.index-4 .col-md-2 {
  padding: 0;
}

.index-4 .col-md-2:hover i {
  transform: rotateY(360deg);
}

.index-4 .col-md-2 i {
  display: block;
 
  height:70px;
  text-align: center;
  color: #f22645;
  transition: all 0.5s;
}

.index-4 .col-md-2 i.lico1{background:url(../images/i1.png) no-repeat center}
.index-4 .col-md-2 i.lico2{background:url(../images/i2.png) no-repeat center}
.index-4 .col-md-2 i.lico3{background:url(../images/i3.png) no-repeat center}
.index-4 .col-md-2 i.lico4{background:url(../images/i4.png) no-repeat center}
.index-4 .col-md-2 i.lico5{background:url(../images/i5.png) no-repeat center}
.index-4 .col-md-2 i.lico6{background:url(../images/i6.png) no-repeat center}
.index-4 .col-md-2 i.lico7{background:url(../images/i7.png) no-repeat center}

.index-4 .col-md-2 p {
  text-align: center;
}

.index-4 .col-md-2 p:first-child {
  font-size: 18px;
  color: #333333;
}

.index-4 .col-md-2 p:last-child {
  color: #999999;
  margin: 5px 0 25px;
}

.index-4 .flex {
  display: flex;
  margin: 0 75px;
}

.index-4 .flex li {
  flex: auto;
  text-align: center;
}

.index-4 .flex li c {
  display: inline-block;
  width: 30px;
  height: 30px;
  float: left;
  text-align: center;
  line-height: 30px;
  border: 1px solid #dedede;
  font-size: 13px;
  color: #999999;
  border-radius: 50%;
  font-style: normal;
}

.index-4 .flex li span {
  display: inline-block;
  width: 160px;
  height: 1px;
  background: #dedede;
  margin-top: 15px;
}

.index-4 .flex li:last-child span {
  display: none;
}
.section .titlebox {width: 100%;text-align: center;margin-bottom: 40px;}
.section .titlebox h4 {color: #333;font-size: 38px; font-weight: bold} 
.section .titlebox p {color: #666;font-size: 15px;}


.main_consultbg {width: 100%;min-height: 150px;background-color: #00ad66;margin: 40px 0px;}
.main_consultbg .main_consultbox {position: relative;padding: 20px 0px;}
.main_consultbg .main_consultbox .wen,.main_consultbg .main_consultbox .txt,.main_consultbg .main_consultbox .advisory {display: inline-block;vertical-align: middle;}
.main_consultbg .main_consultbox .txt {margin: 0 50px;}
.main_consultbg .main_consultbox .txt h5 {color: #fff;font-size: 30px;}
.main_consultbg .main_consultbox .txt h5 strong {font-size: 50px;margin-right: 20px;}
.main_consultbg .main_consultbox .txt p {color: #fff;font-size: 20px;}
.main_consultbg .main_consultbox .advisory a {display: inline-block;width: 188px;height: 48px;line-height: 48px;text-align: center;border:1px solid #fff;margin-left: 25px;color: #fff;font-size: 18px;position: relative;
transition:all .6s ease-in-out;-moz-transition:all .6s ease-in-out;-webkit-transition:all .6s ease-in-out;}
.main_consultbg .main_consultbox .advisory a:hover {color: #00ad66;background: #fff;}
.main_consultbg .main_consultbox .advisory a em {display: block;width: 100%;background:#fff;text-align: center;position: absolute;left: 0px;width: 0px;overflow: hidden;white-space: nowrap;
transition: width .6s ease-in-out;-moz-transition: width .6s ease-in-out;-webkit-transition: width .6s ease-in-out;}
.main_consultbg .main_consultbox .advisory a:hover em {width: 100%;}
.main_consultbg .main_consultbox .advisory a:hover i {width: 0px;}
.main_consultbg .main_consultbox .duang {position: absolute;right: 0px;top: 0px;}
.case_wrap {width:94%;margin:0 auto;}
.case_wrap ul li{float:left; width:24%;margin:0.5%; *width:24.97%; text-align:center; background:#fff;-webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;}
.case_wrap ul li a{display:block;}
.case_wrap ul li article{position:relative; width:100%; height:0; padding-top:62.4%; overflow:hidden;}
.case_wrap ul li article img{position:absolute; top:0; left:0; width:100.5%; height:100%; -webkit-transition:0.8s; -moz-transition:0.8s; transition:0.8s; -webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); transform:translate3d(0,0,0);}
.case_wrap ul li article summary{width:100%; height:50px; position:absolute; bottom:-50px; left:0; line-height:50px; color:#dcdcdc; background:rgba(0,0,0,0.5); background:#666\9; text-align:left; text-indent:20px; z-index:3; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.case_wrap ul li .info {width: 100%;height: 60px;overflow: hidden;padding:0px 0px 0px 10px;box-sizing:border-box;}
.case_wrap ul li .info h5 {display: block;float: left;width: calc(100% - 100px);height: 40px;line-height: 40px;margin: 10px 0px;text-align: left;}
.case_wrap ul li .info h5 a {font-size:18px; color:#333;-webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;    overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.case_wrap ul li .info .fr {width: 90px;height: 60px;}
.case_wrap ul li .info .fr a {display: inline-block;vertical-align: middle;text-align: right;margin-left: 10px;width: 20px;height: 60px;background-repeat: no-repeat;background-position: center;}
.case_wrap ul li .info .fr a.case_pc {background-image: url(../images/pc_b.png);}
.case_wrap ul li .info .fr a.case_phone {background-image: url(../images/phone_b.png);}

.case_wrap ul li:hover {background-color: #006acd;}
.case_wrap ul li:hover a article summary{bottom:0;}
.case_wrap ul li:hover a article img{-webkit-transform:scale(1.1); -moz-transform:scale(1.1); transform:scale(1.1);}
.case_wrap ul li:hover a article:before{opacity:1; filter:alpha(opacity=100); zoom:1;}
.case_wrap ul li:hover a article:after{opacity:1; filter:alpha(opacity=100); zoom:1; -webkit-transform:scale(1); -moz-transform:scale(1); transform:scale(1);}
.case_wrap ul li:hover .info h5 a {color:#fff;}
.case_wrap ul li:hover .info .fr a.case_pc {background-image: url(../images/pc_w.png);}
.case_wrap ul li:hover .info .fr a.case_phone {background-image: url(../images/phone_w.png);}



/*屏幕小于768px应用一下样式*/
@media (max-width:768px) {
   .w_solutions {padding: 0 20px;}
   .w_center {width: auto;}
   .w_solutions .w_con_wrap img {border:none;}
   .w_solutions .w_con {position: static;width: 100%;height: auto;padding: 20px 20px 40px;box-sizing:border-box;}
   .w_solutions .w_con h1 {font-size: 24px;}
   .w_solutions .w_con h2 {font-size: 20px;margin-bottom: 15px;}
   .w_function .w_icon_wrap li {width: 100px;padding: 0 10px;}

   .w_fl {width: 100%;text-align: center;padding-top: 30px;}
   .w_function .w_web_wrap {display: inline-block;}
   .w_grid {width: 100%;}
   .sm3 li {width: 50% !important;padding-left: 25px;box-sizing:border-box;}

   .this{position:relative;padding: 30px 20px;background:none;height: auto;}
   .thismsg {position: static;margin:0 auto;width: 50%;float: left;margin-bottom: 30px;}
   .index-4  .col-md-2{width:50%}
   	.section .titlebox h4 {font-size: 30px;}
	.section .titlebox p {font-size: 16px;}
.main_consultbg .main_consultbox .wen {width: 100px;height: 100px;}
	.main_consultbg .main_consultbox .txt {margin:0 10px;width: calc(100% - 130px);}
	.main_consultbg .main_consultbox .txt h5 {font-size:18px;}
	.main_consultbg .main_consultbox .txt p {font-size: 14px;}
	.main_consultbg .main_consultbox .advisory {width: 100%;text-align: center;}
	.main_consultbg .main_consultbox .advisory a {width: 40%;height: 42px;line-height: 40px;margin:10px 1%;box-sizing:border-box;}
   .case_wrap {width: auto;}
	.case_wrap ul {padding: 0px 7px}
	.case_wrap ul li {width: calc(50% - 6px);margin: 3px;box-sizing:border-box;}
	.case_wrap ul li .info {height: 40px;}
	.case_wrap ul li .info h5 {width: 100%;height: 20px;line-height: 20px;}
	.case_wrap ul li .info h5 a {font-size: 16px;}
	.case_wrap ul li .info .fr {display: none;}
	.casepage {border-bottom: 1px solid #e1e6ed;margin-bottom: 20px;}
   
   
   
}


/*屏幕小于540px应用一下样式*/
@media (max-width:540px) {
	.sm3 li {width: 100% !important;padding-left: 40px;}
	.thismsg {width: 100%;}
}