.index-more{ padding-left:30px;}
.index-more i{ right:25px; width:25px;}

.ny-banner{  width: 100%; height: 360px;}
.ny-banner .text{ padding-top: 115px; color:#FFFFFF;}
.ny-banner .text div{ font-size: 25px; letter-spacing: 2px;}
.ny-banner .text p{ margin-top: 10px; position: relative; padding-bottom: 25px; letter-spacing:7px;}
.ny-banner .text p:after{ content:""; position: absolute; bottom:0; left:0; width: 60px; height: 1px; background: #0670c2;}
.ny-banner .text span{ margin-top: 25px; display: block; font-size: 28px; text-transform: uppercase; letter-spacing: 2px;}

.bread{ padding: 22px 0; font-size: 12px; border-bottom: 1px solid #eeeeee; color: #777777;}
.bread i{ font-style: normal; color: #0670c2;}
.bread em{ font-style: normal; margin: 0 2px;}

.ny-tit{ text-align: center;}
.ny-tit span{ display:block; font-size: 24px; color: #111111;}
.ny-tit p{ margin-top: 10px; font-size: 12px; color: #aaaaaa; letter-spacing: 1px; text-transform: uppercase;}



/* ========== */
/* = BASE = */
/* ========== */
.base{ padding: 70px 0 130px;}
.base li{ margin-top: 60px;}
.base li a{ display:block;}
.base li .img{ float: left; width:42.9%; max-width: 515%; position: relative; overflow: hidden;}
.base li .img img{ width: 100%; position: relative; z-index:0;}
.base li .img:before{ opacity:0; content:""; position: absolute; z-index: 1; top:0; left:0; width: 100%; height: 100%; border:2px solid #0670c2;  -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.base li .text{ float: right; width: 57.1%; padding:4% 5% 10px;}
.base li .tit{ font-size: 24px; color: #111111; text-transform:uppercase;}
.base li .tip{ margin-top: 30px; padding-bottom: 25px; border-bottom: 1px solid #eeeeee; line-height: 30px; color: #494949;}
.base li .tip p{ position: relative; padding-left: 72px;}
.base li .tip b{ position: absolute; top:0; left:0; line-height:30px; display: inline-block;}
.base li .tip em{ display: inline-block; position: relative; padding-left: 12px;}
.base li .tip em:before{ content: ""; position: absolute; top:15px; left:0; width: 4px; height:4px; background: #0670c2; border-radius:2px; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.base li .des{ margin-top:30px; color: #999999; line-height: 30px; height: 60px; overflow: hidden;}
.base li .index-more{ margin-top: 45px;}
.base li a:hover{ background: #0670c2; color:#FFFFFF;}
.base li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.base li a:hover .img:before{ opacity: 1;}
.base li a:hover .tit{ color: #FFFFFF;}
.base li a:hover .tip{ color: #FFFFFF; border-bottom: 1px solid #4090cd;}
.base li a:hover .tip em:before{ background: #FFFFFF;}
.base li a:hover .des{ color: #FFFFFF; opacity: .6;}
.base li a:hover .index-more{ background: #ffffff;}
.base li a:hover .index-more i{ transform: translateX(10px); -webkit-transform: translateX(10px);}


/* ========== */
/* = TAG = */
/* ========== */
.tag{ padding: 70px 0 40px;}
.tag .tab{ margin-top: 35px; text-align: center;}
.tag .tab span{  margin:0 10px; display: inline-block; padding:15px 25px; text-align: center; background: #f3f3f3; color: #0670c2; border-radius:5px; cursor: pointer;}
.tag .tab span .img{ display: inline-block; position: relative;}
.tag .tab span .img .default{  transform: rotateY(0); -webkit-transform: rotateY(0); opacity:1;}
.tag .tab span .img .hover{ position: absolute; top:0; left:0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.tag .tab span.active,
.tag .tab span:hover{ background: #0670c2; color: #FFFFFF;}
.tag .tab span.active .img .hover,
.tag .tab span:hover .img .hover{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg);opacity: 1;}
.tag .tab span.active .img .default,
.tag .tab span:hover .img .default{ transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.tag .js-tab-box{ margin-top: 50px;}
.tag .js-tab-con{ display: none;}
.tag .js-tab-con.active{ display: block;}


.tag-list{ margin:0 -15px;}
.tag-list li{ float: left; width:33.3333333%; margin-bottom:30px; padding: 0 15px;}
.tag-list li a{ display: block;}
.tag-list li .img{ background: #FFFFFF; position: relative; overflow: hidden;}
.tag-list li .img img{ width: 100%; position: relative; z-index:0; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.tag-list li .img:before{ content:""; position: absolute; z-index:1; top:0; left:0; width:100%; height: 100%; border:2px solid #FFFFFF; border-bottom:2px solid #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.tag-list li .con{ padding:25px 35px;}
.tag-list li .con span{ display: block; font-size: 20px; color:#111111; text-transform: uppercase; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.tag-list li .con p{ margin-top:10px; width: 100%; color: #777777; line-height: 24px; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.tag-list li .con p em{ margin-right:15px; position: relative; padding-left: 10px; line-height: 24px;}
.tag-list li .con p em:before{ content: ""; position: absolute; top:8px; left:0; width: 4px; height:4px; background: #777777; border-radius:2px; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.tag-list li .more{ border-top: 1px solid #eeeeee; padding:25px 35px;}
.tag-list li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.tag-list li a:hover .img:before{ border:2px solid #0670c2; }
.tag-list li a:hover .text{ background: #0670c2;}
.tag-list li a:hover .con span{ color: #FFFFFF;}
.tag-list li a:hover .con p{ color: #FFFFFF; opacity: .7;}
.tag-list li a:hover .con p em:before{ background: #FFFFFF;}
.tag-list li a:hover .more{ border-top: 1px solid #4793ce;}
.tag-list li a:hover .index-more{ background: #ffffff;}
.tag-list li a:hover .index-more i{ transform: translateX(10px); -webkit-transform: translateX(10px);}


/* ========== */
/* = TAG-DETAIL = */
/* ========== */
.tag-detail{ padding:60px 0 80px;}
.tag-detail .img{ float: left; width: 43%; max-width: 515px; border-bottom:4px solid #0871c2;}
.tag-detail .text{ float: right; width: 50%; padding-top: 50px;}
.tag-detail .text .tit{ padding-bottom: 25px; font-size: 24px; color: #0670c2; text-transform: uppercase;  border-bottom: 1px solid #eeeeee;}
.tag-detail .text .tip{ margin-top: 25px; color: #494949;}
.tag-detail .text .tip p{ position: relative; padding-left: 72px; line-height:30px;}
.tag-detail .text .tip b{ position: absolute; top:0; left:0;}
.tag-detail .text .tip em{ display: inline-block; padding-left:12px; margin-right: 40px; position: relative;}
.tag-detail .text .tip em:before{ content: ""; position: absolute; top:14px; left:0; width: 4px; height:4px;  background: #0670c2; border-radius:2px;}
.tag-detail .text .des{ margin-top:30px; color: #999999; line-height: 30px;}
.tag-detail .text .index-more{ margin-top:45px; background:#0670c2; color:#FFFFFF;}
.tag-detail .text .index-more i{ background-image: url(../images/ico_more_white.png);}

.tag-content{ margin-top: 70px;}
.tag-content .tit{ background: #333333; padding: 20px 30px; color: #FFFFFF;}
.tag-content .tit span{ display: inline-block;  font-size: 22px; line-height: 22px; padding-left: 15px; border-left: 2px solid #0583e4;}
.tag-content .tit em{ display: inline-block; margin-left: 15px; text-transform: uppercase; font-size: 12px; color: #5d5d5d;}
.tag-content .con{ padding:  70px 30px; color: #494949; line-height: 30px; color: #494949;}
.tag-content .con .tip{ position: relative; padding-left: 12px;}
.tag-content .con .tip:before{ content: ""; position: absolute; top:12px; left:0;  width: 4px; height:4px; background: #0670c2; border-radius:2px;}
.tag-content .con .left{ float:left; width:40%;}
.tag-content .con .detail-img{ float:right; max-width:55%; margin:-30px 0;}

.return-list{ margin-top: 35px; text-align: right;}
.return-list a{ display: inline-block; font-size: 12px; background: #0670c2; color: #FFFFFF; padding: 10px 30px; border-radius:6px;}
.return-list a:hover{ background: #2b88fb;}


/* ========== */
/* = SOFTWARE = */
/* ========== */
.yellow-tit{  padding-bottom: 35px; border-bottom:1px dotted #a2a2a2; }
.yellow-tit span{ display: inline-block; background: url(../images/square.png) no-repeat left; padding-left: 25px;font-size: 18px; line-height: 18px; font-weight: bold; color: #111111;}
.yellow-tit em{ margin-left: 10px; font-style: normal; font-size: 12px; text-transform: uppercase; color: #aaaaaa;}

.software{ padding: 70px 0 95px;}
.software .des-box{ margin-top:65px; padding: 0 0 50px 25px; line-height: 36px; font-size: 16px; color:#111111; position: relative;  background: url(../images/square.png) no-repeat 0 12px;}
.software-algorithm{ padding: 40px 0 65px; background: #333333;}
.software-algorithm .yellow-tit{ border-bottom: 1px dotted #5c5c5c;}
.software-algorithm .yellow-tit span{ color: #FFFFFF;}
.software-algorithm .text{ margin-top: 30px; line-height: 30px; color: #FFFFFF; padding: 0 25px;}
.software-algorithm .text p{ padding-left: 15px; position: relative;}
.software-algorithm .text p:before{ content: ""; position: absolute; top:13px; left:0;  width: 4px; height:4px; background: #0670c2; border-radius:2px;}
.software-algorithm .img{ margin-top: 50px;}
.software-function{ padding-top: 45px;}
.software-function ul{ margin-top:5px; padding-bottom: 20px; border-bottom: 1px dotted #a2a2a2;}
.software-function li{ margin-bottom: 15px; float: left; width: 12.5%; font-size: 12px; text-align: center; padding: 15px 0 20px; text-align: center; position: relative; }
.software-function li:nth-child(8n+1){ clear: both;}
.software-function li:before{ content: ""; position: absolute; left:0; top:0; width: 0; height:3px; background: #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.software-function li .img{ position: relative; display: inline-block;}
.software-function li .img .default{  transform: rotateY(0); -webkit-transform: rotateY(0); opacity:1;}
.software-function li .img .hover{ position: absolute; top:0; left:0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.software-function li p{ margin-top:8px; line-height:24px;}
.software-function li:hover{ -o-box-shadow:0 0 20px rgba(0,0,0,.08); -ms-box-shadow:0 0 20px rgba(0,0,0,.08); -moz-box-shadow:0 0 20px rgba(0,0,0,.08); -webkit-box-shadow:0 0 20px rgba(0,0,0,.08); box-shadow:0 0 20px rgba(0,0,0,.08); color: #0670c2;}
.software-function li:hover:before{ width: 100%; }
.software-function li:hover .img .hover{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg);opacity: 1;}
.software-function li:hover .img .default{ transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.software .index-more{ width: 182px; margin:42px auto 0; background: #0670c2; color: #FFFFFF;}
.software .index-more i{ width:45px; background:url(../images/ico_more_white.png) right no-repeat;}


/* ========== */
/* = SYSTEM = */
/* ========== */
.system{ padding:  70px 0 95px;}
.system .des-box{ margin-top:65px; padding: 0 0 50px 25px; line-height: 36px; font-size: 14px; color:#111111; position: relative;  background: url(../images/square.png) no-repeat 0 12px; letter-spacing: 1px;}

.system-advantage{ padding:40px 0 55px; background: #333333;}
.system-advantage .yellow-tit{ border-bottom: 1px dotted #5c5c5c;}
.system-advantage .yellow-tit span{ color: #FFFFFF;}
.system-advantage ul{ margin-top: 50px;}
.system-advantage li{ float: left; width: 25%; padding:50px 0 45px 30px; color:#FFFFFF; position: relative;}
.system-advantage li:before{ content: ""; position: absolute; left:0; top:0; width: 0; height:4px; background: #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.system-advantage li .img{ display: inline-block; position: relative;}
.system-advantage li .img .default{  transform: rotateY(0); -webkit-transform: rotateY(0); opacity:1;}
.system-advantage li .img .hover{ position: absolute; top:0; left:0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.system-advantage li .tit{ margin-top:55px; font-size: 18px; }
.system-advantage li span{ margin-top: 20px; display: block; font-size: 14px;}
.system-advantage li p{ margin-top: 5px; font-size: 12px; color: #999999;}
.system-advantage li:hover{ background: #FFFFFF;}
.system-advantage li:hover:before{ width: 100%; }
.system-advantage li:hover .img .hover{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg);opacity: 1;}
.system-advantage li:hover .img .default{ transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.system-advantage li:hover .tit{ color: #0670c2;}
.system-advantage li:hover span{ color: #111111;}

.system-technology{ margin-top:40px;}
.system-technology .des{ margin-top: 35px; color: #494949; line-height: 30px;}
.system-technology .content{ margin-top: 35px; padding: 50px; text-align: center;}

.system-function{ margin-top: 75px;}
.system-function ul{ margin: 0 -5px; padding-bottom: 55px; border-bottom:1px dotted #a2a2a2;}
.system-function li{ margin-top: 55px; padding: 0 5px; float: left; width: 33.3333333333%; text-align: center;}
.system-function li:nth-child(3n+1){ clear: both;}
.system-function li .img{ display: inline-block; position: relative;}
.system-function li .img .default{  transform: rotateY(0); -webkit-transform: rotateY(0); opacity:1;}
.system-function li .img .hover{ position: absolute; top:0; left:0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.system-function li span{ display: block; margin-top: 30px; color: #111111; font-size: 18px; font-weight: bold;}
.system-function li p{ margin:  25px auto 0; color: #555555; line-height: 24px; max-width: 300px; }
.system-function li:hover .img .hover{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg);opacity: 1;}
.system-function li:hover .img .default{ transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.system-function li:hover span{ color: #0670c2;}
.system .index-more{ width: 182px; margin:42px auto 0; background: #0670c2; color: #FFFFFF;}
.system .index-more i{ width:45px; background:url(../images/ico_more_white.png) right no-repeat;}


/* ========== */
/* = CASE = */
/* ========== */
.case{ padding: 80px 0;}
.case ul{ margin: 0 -28px 70px;}
.case li{ margin-top: 50px; float: left; width: 50%; padding: 0 28px;}
.case li a,.case li .box{ display: block; position: relative;}
.case li a:before, .case li .box:before{ content: ""; position: absolute; bottom:0; left:0; width: 0; height: 4px; background: #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.case li .img{ position: relative; overflow: hidden;}
.case li .text{ padding: 28px 180px 25px 30px; position: relative;}
.case li .text p{ font-size: 16px; color: #111111;}
.case li .text .index-more{ position: absolute; top:50%; margin-top: -19px; right:20px;}
.case li a:hover:before ,.case li .box:hover:before{ width: 100%;}
.case li a:hover .img img, .case li .box:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.case li a:hover .text p, .case li .box:hover .text p{ color: #0670c2;}

.page{ text-align: center;}
.page a{ margin:0 3px; border: 1px solid #eeeeee; display: inline-block; padding: 0 5px; min-width: 36px; line-height: 36px; height: 38px;}
.page a.active,.page a:hover{ background: #0670c2; color: #FFFFFF; border: 1px solid #0670c2;}
.page em{ font-style: normal; margin: 0 10px;}
.page span{ margin-left: 20px; color: #282e2a;}


/* ========== */
/* = NEWS = */
/* ========== */
.news{ padding: 25px 0 80px;}
.news ul{ margin: 0 -15px 60px;}
.news li{ margin-top: 30px; float: left; width: 33.3333333%; padding: 0 15px;}
.news li a{ display: block; position: relative;}
.news li a:before{ content: ""; position: absolute; bottom:0; left:0; width: 0; height: 4px; background: #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.news li .img{ overflow: hidden;}
.news li .img img{ width: 100%;}
.news li .text{  border: 1px solid #eeeeee; padding:30px 20px;}
.news li .text span{ font-size: 22px; color: #9c9c9c;}
.news li .text div{ margin-top: 20px; font-weight: bold; font-size: 16px; color: #111111;}
.news li .text p{  margin-top: 22px; line-height: 24px; height: 48px; color: #999999; overflow: hidden;}
.news li a:hover{ background: #FFFFFF; -o-box-shadow:0 0 20px rgba(0,0,0,.08); -ms-box-shadow:0 0 20px rgba(0,0,0,.08); -moz-box-shadow:0 0 20px rgba(0,0,0,.08); -webkit-box-shadow:0 0 20px rgba(0,0,0,.08); box-shadow:0 0 20px rgba(0,0,0,.08);}
.news li a:hover:before{ width: 100%;}
.news li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.news li a:hover .text{ border: 1px solid #FFFFFF;}
.news li a:hover .text div{ color: #0670c2;}


/* ========== */
/* = NEWS-DETAIL = */
/* ========== */
.news-detail{ padding:50px 0 70px;}
.news-detail .title{ color: #111111; font-size:18px; line-height: 26px; text-align: center;}
.article-come{ margin-top:35px; line-height:26px; text-align: center; color: #999999;}
.article-come span{ margin:0 70px; padding-left: 28px; display: inline-block; vertical-align: middle; position: relative;}
.article-come span:after{ content:""; position: absolute; top:50%; margin-top: -5px; right:-70px; width: 1px; height: 12px; background: #dfdfdf;}
.article-come .bdsharebuttonbox{ display:inline-block; vertical-align: middle;}
.article-come .span-date{ background: url(../images/ico_come.png) no-repeat left;}
.article-come .span-num{ background: url(../images/ico_time.png) no-repeat left;}
.article-come .span-share{ padding-left: 35px; background: url(../images/ico_share.png) no-repeat left;}
.article-come .span-share:after{ display: none;}
.news-detail .news-article{ margin-top: 15px;  padding-top: 50px; border-top: 1px dotted #8e8e8e; line-height: 30px; color: #777777;}
.news-detail .return-list{  padding-bottom: 20px; border-bottom:1px dotted #8e8e8e;  text-align: right;}

.flip{ margin-top: 20px;}
.flip a{ max-width:47%; display: inline-block; position: relative; line-height:38px;}
.flip a span{ position: absolute; top:0; display:inline-block; padding: 0 30px; height: 38px; line-height: 36px; border: 1px solid #e5e5e5; text-align: center; border-radius:5px; }
.flip .prev{ float: left; padding-left:120px;}
.flip .prev span{ left:0;}
.flip .next{ float: right; padding-right:120px;}
.flip .next span{ right:0;}
.flip a:hover{ color: #085dd1;}
.flip a:hover span{ background: #0670c2; border: 1px solid #0670c2; color: #FFFFFF;}


/* ========== */
/* = ABOUT = */
/* ========== */
.about{ padding: 70px 0 80px;}
.about-box{ margin-top: 40px; padding:55px 55px 60px; line-height: 30px; color: #555555;}
.about-box .text{ padding-left: 25px; background: url(../images/square.png)  0 10px no-repeat;}
.about-box .img{ margin-top: 50px;}
.honor-box{ margin-top: 70px; padding-bottom: 50px; border-bottom: 1px dotted #b7b7b7; }
.honor-box .content{ margin-top: 35px; padding: 25px 35px;}
.honor-box .content .left{ float: left; width:37.2%; padding:8px;}
.honor-box .content ul{ float: right; width: 62%;}
.honor-box .content ul li{ float: left; padding:8px; width: 16.66666667%;}
.about .index-more{ width: 182px; margin:30px auto 0; background: #0670c2; color: #FFFFFF;}
.about .index-more i{ width:45px; background:url(../images/ico_more_white.png) right no-repeat;}


/* ========== */
/* = CONTACT = */
/* ========== */
.contact{ padding: 70px 0 110px;}
.contact-info{ margin-top: 55px; padding:70px 0 60px; border-top: 1px dotted #ababab; border-bottom: 1px dotted #ababab;}
.contact-info .content{ margin: 0 -30px;}
.contact-info .item{ float: left; width: 25%; padding: 0 30px;}
.contact-info .item .tit{ display: block; font-size: 18px; color: #111111;}
.contact-info .item span{ margin-top:10px; display: block; font-size: 12px; color: #c6c6c6;}
.contact-info .item .text{ margin-top: 25px; color: #777777; line-height: 28px;}
.contact-info .item .text p{ margin-top:5px;}
.contact-info .item .text a{ color: #777777; }
.contact-info .item .text a:hover{ color: #0670c2;}
.map-tit{ margin-top: 70px; text-align: center;}
.map-tit p{ font-size: 18px; color: #111111;}
.map-tit div{ margin-top: 45px;}
.map-tit div span{ margin: 0 70px; display: inline-block; vertical-align: middle; padding-left: 25px; position: relative;}
.map-tit div .tel{ background: url(../images/ico_contact_tel.png) no-repeat left;}
.map-tit div .tel:after{ content: ""; position: absolute; top:50%; right:-70px; width: 1px; height: 12px; margin-top: -6px; background: #cccccc;}
.map-tit div .address{ background: url(../images/ico_contact_address.png) no-repeat left;}
.contact .map{ margin-top: 60px;}
.contact .map-con{ width:100%; height:450px;}
.contact .map-con img{ max-width:1000%; width: auto;}


/* ========== */
/* = SOLUTION = */
/* ========== */
.solution-bread{ text-align: right;}
.solution-banner{ position: relative; background: #333333;}
.solution-banner .img{ position: absolute; top:0; left:0; width: 50%; height: 100%;}
.solution-banner .box{ float: right; width: 48%; max-width: 500px; padding:65px 0 60px 0; color: #b7b7b7;}
.solution-banner .box .tit{ font-size: 24px; color: #FFFFFF;}
.solution-banner .box .tip{ margin-top: 15px; line-height:30px; position: relative; padding-left: 75px;}
.solution-banner .box .tip b{ position: absolute; top:0; left:0; }
.solution-banner .box .tip em{ display: inline-block; padding-left:12px; margin-right: 40px; position: relative;}
.solution-banner .box .tip em:before{ content: ""; position: absolute; top:14px; left:0; width: 4px; height:4px;  background: #0670c2; border-radius:2px;}
.solution-banner .box .text{ margin-top: 30px; padding-top: 30px; border-top: 1px solid #515151;}
.solution-banner .box .text span{ display: inline-block; width: 80px; height: 80px; border-radius: 40px; background: #FFFFFF; text-align: center;}
.solution-banner .box .text b{ display: inline-block; max-width: 4em; vertical-align: middle; font-size:14px; color: #0670c2;}
.solution-banner .box .text i{ display: inline-block;vertical-align: middle; height: 100%;}
.solution-banner .box .text em{ margin: 0 5px; display: inline-block; vertical-align: middle;}
.solution-banner .box .des{ margin-top: 45px; line-height:30px; position: relative; padding-left:75px;}
.solution-banner .box .des b{ position: absolute; top:0; left:0; }
.solution-banner .index-more{ margin-top:45px; color: #FFFFFF; background: #0670c2;}
.solution-banner .index-more i{ background:url(../images/ico_more_white.png) right no-repeat;}

.solution-model{ margin-top: 65px;}
.solution-model .text{ margin-top: 40px; padding:30px 50px;}
.solution-model .text p{line-height:30px; }
.solution-model .text p em{ font-style: normal; position: relative;  display:inline-block; line-height:30px;padding-left: 15px;}
.solution-model .text p em:before{ content: ""; position: absolute; top:14px; left:0; width: 4px; height:4px;  background: #0670c2; border-radius:2px;}

.solution-characteristics{ margin-top: 55px;}
.solution-characteristics .content{padding: 35px 0 60px;}
.solution-characteristics ul{ margin: 0 -15px;}
.solution-characteristics li{ float: left; width: 33.3333333%; padding: 15px;}
.solution-characteristics li:nth-child(3n+1){ clear: both;}
.solution-characteristics .item{ padding:30px;}
.solution-characteristics .item img{ float: left;}
.solution-characteristics .item div{ margin-left: 85px;}
.solution-characteristics .item div span{ display: block; line-height: 36px; font-size: 18px; color: #111111; font-weight: bold;}
.solution-characteristics .item div p{ margin-top: 5px; color: #555555;}

.solution-functions{ padding:40px 0 50px; background: #333333;}
.solution-functions .yellow-tit{ border-bottom: 1px dotted #5c5c5c;}
.solution-functions .yellow-tit span{ color: #FFFFFF;}
.solution-functions ul{ margin-top: 50px;}
.solution-functions li{ float: left; width: 16.66666666666%; text-align: center; padding:25px 5px 30px; position: relative;}
.solution-functions li:before{ content: ""; position: absolute; top:0; left:0; width: 0; height: 4px; background: #0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.solution-functions li .img{ display: inline-block; position: relative;}
.solution-functions li .img .default{  transform: rotateY(0); -webkit-transform: rotateY(0); opacity:1;}
.solution-functions li .img .hover{ position: absolute; top:0; left:0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}
.solution-functions li span{ display: block; margin-top:15px; color: #ffffff; font-size: 18px; font-weight: bold;}
.solution-functions li p{ margin-top: 15px; font-size: 12px; color: #999999;}
.solution-functions li:hover{ background: #FFFFFF;}
.solution-functions li:hover:before{ width: 100%;}
.solution-functions li:hover span{ color: #0670c2;}
.solution-functions li:hover .img .hover{ transform: rotateY(0deg); -webkit-transform: rotateY(0deg);opacity: 1;}
.solution-functions li:hover .img .default{ transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0;}

.xg-products{ padding: 70px 0;}
.xg-products ul{ margin:0 -15px;}
.xg-products li{ float: left; width:33.3333333%; margin-top: 40px; padding: 0 15px;}
.xg-products li a{ display: block;}
.xg-products li .img{ background: #FFFFFF; position: relative; overflow: hidden;}
.xg-products li .img img{ width: 100%; position: relative; z-index:0; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.xg-products li .img:before{ content:""; position: absolute; z-index:1; bottom:0; left:0; width:100%; height: 2px; background:#0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.xg-products li .text{ margin-top: 20px; position: relative; line-height: 38px; font-size: 20px; color: #111111; padding-right:160px;}
.xg-products li .text .index-more{ position: absolute; top:0; right:0;}
.xg-products li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.xg-products li a:hover .text{ color: #0670c2;}
.xg-products li a:hover .index-more{ background: #0670c2; color: #FFFFFF;}
.xg-products li a:hover .index-more i{ transform: translateX(10px); -webkit-transform: translateX(10px); background: url(../images/ico_more_white.png) right no-repeat;}

.solution-cooperation{ padding: 45px 0 55px; background: #f3f6f8;}
.solution-cooperation ul{ margin-top: 30px;}
.solution-cooperation li{ float: left; width: 14.28571%; padding: 4px;}
.solution-cooperation li div{ position: relative;}
.solution-cooperation li div:before{ content:""; position: absolute; z-index:1; top:0; left:0; width:0; height: 4px; background:#0670c2; -webkit-transition: all ease .4s;  -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.solution-cooperation li:hover div:before{ width: 100%;}

.solution-services{ padding: 65px 0 95px;}
.solution-services .text{ padding: 45px 25px 35px; line-height: 36px; color: #494949;}
.solution-services .text p{ position: relative; padding-left: 15px;}
.solution-services .text p:before{ content: ""; position: absolute; top:14px; left:0; width: 4px; height:4px;  background: #0670c2; border-radius:2px;}
.solution-services  .content{ padding-bottom: 65px; border-bottom: 1px dotted #a2a2a2;}
.solution-services  .content li{ float: left; width: 12.5%; text-align: center; padding: 25px 0 35px; font-size: 12px;}
.solution-services  .content li p{ margin-top:10px;}
.solution-services .index-more{ width: 182px; margin:42px auto 0; background: #0670c2; color: #FFFFFF;}
.solution-services .index-more i{ width:45px; background:url(../images/ico_more_white.png) right no-repeat;}


@media (max-width:780px) {
    .ny-tit span{ font-size:20px;}


    /* ========== */
    /* = BASE = */
    /* ========== */
    .base{ padding: 40px 0;}
    .base li{ margin-top:40px;}
    .base li .img{ float: none; width:100%; }
    .base li .text{ float: none; width:100%;  padding: 20px;}
    .base li .tit{ font-size: 18px;}
    .base li .tip{ margin-top:15px; padding-bottom:15px;}
    .base li .des{ margin-top:15px;}
    .base li .index-more{ margin-top:15px;}


    /* ========== */
    /* = TAG = */
    /* ========== */
    .tag{ padding: 40px 0 30px;}
    .tag .tab span{ width:80px; margin: 0 2px;}
    .tag .js-tab-box{ margin-top:30px;}
    .tag-list{ margin: 0 -5px; }
    .tag-list li{ margin-bottom: 20px; width: 50%; padding: 0 5px; }
    .tag-list li:nth-child(2n+1){ clear: both;}
    .tag-list li .con{ padding: 10px;}
    .tag-list li .con span{ font-size: 16px;}
    .tag-list li .con p{ margin-top: 3px; font-size: 12px;}
    .tag-list li .more{ display: none;}


    /* ========== */
    /* = TAG-DETAIL = */
    /* ========== */
    .tag-detail{ padding:40px 0;}
    .tag-detail .img{ float: none; width: 100%; max-width: 100%;}
    .tag-detail .text{ float: none; width: 100%; padding-top: 25px;}
    .tag-detail .text .tit{ font-size: 20px;}
    .tag-detail .text .index-more{ margin-top: 20px;}
    .tag-content{ margin-top: 40px;}
    .tag-content .tit span{ font-size:16px; line-height: 16px;}
    .tag-content .con{ padding: 30px; }
    .tag-content .con .left{ float:none; width: 100%;}
    .tag-content .con .detail-img{ margin-top: 30px; float:none;}



    /* ========== */
    /* = SOFTWARE = */
    /* ========== */
    .yellow-tit{  padding-bottom: 15px; }
    .yellow-tit span{ font-size: 16px;}

    .software{ padding:40px 0;}
    .software .des-box{ margin-top:25px; padding-bottom:30px; line-height:26px; font-size:14px; background: url(../images/square.png) no-repeat 0 8px;}
    .software-algorithm{ padding-bottom: 35px;}
    .software-algorithm .img{ margin-top: 20px; }
    .software-function li{ width: 25%; font-size: 10px;}
    .software-function li .img{ max-width:50%;}
    .software-function li:nth-child(4n+1){ clear: both;}
    .software .index-more{ margin-top: 35px;}


    /* ========== */
    /* = SYSTEM = */
    /* ========== */
    .system{ padding: 40px 0;}
    .system .des-box{ margin-top:25px; padding-bottom:30px; line-height: 26px; background: url(../images/square.png) no-repeat 0 5px;}
    .system-advantage{ padding:40px 0;}
    .system-advantage ul{ margin-top: 30px;}
    .system-advantage li{ float: left; width:50%; padding: 20px; text-align: center;}
    .system-advantage li:nth-child(2n+1){clear:both;}
    .system-advantage li .img{width: 40px;}
    .system-advantage li .tit{ margin-top:15px; font-size: 16px;}
    .system-advantage li span{ margin-top: 10px; font-size: 12px;}

    .system-function{ margin-top: 35px;}
    .system-function ul{ padding-bottom:30px;;}
    .system-function li{ margin-top: 30px;  width: 50%;}
    .system-function li:nth-child(2n+1){ clear: both; }
    .system-function li:nth-child(3n+1){ clear: initial;}
    .system-function li .img{ width:30%; }
    .system-function li span{ margin-top:10px; font-size: 16px; }
    .system-function li p{margin-top: 10px; font-size: 12px; line-height: 20px;}



    /* ========== */
    /* = CASE = */
    /* ========== */
    .case{ padding:40px 0;}
    .case ul{ margin: 0 -5px 30px;}
    .case li{ margin-top:20px; padding: 0 5px; text-align: center;}
    .case li .text{ padding:15px 10px;}
    .case li .text p{ font-size: 14px;}
    .case li .text .index-more{ display: none;}

    .page a{ margin:1px; min-width:32px; line-height:30px; height:32px;}
    .page span{ margin-left: 0; margin-top: 10px; display: block;}



    /* ========== */
    /* = NEWS = */
    /* ========== */
    .news{ padding: 15px 0 40px;}
    .news ul{ margin: 0 -5px 30px;}
    .news li{ margin-top: 20px; float: left; width:50%; padding: 0 5px;}
    .news li .text{ padding:20px;}
    .news li .text span{ font-size:16px;}
    .news li .text div{ margin-top: 10px;  font-size: 14px;}
    .news li .text p{  margin-top: 10px; font-size: 12px; line-height: 20px; height: 40px;}


    /* ========== */
    /* = NEWS-DETAIL = */
    /* ========== */
    .news-detail{ padding:30px 0;}
    .article-come{ margin-top: 20px;}
    .article-come span{ margin:0 10px; }
    .article-come span:after{ display: none;}
    .article-come .span-share{clear: both;}

    .news-detail .news-article{ line-height: 26px; font-size: 13px; padding-top:40px;}
    .flip a{ font-size: 12px;}
    .flip a span{ padding: 0 10px;}
    .flip .prev{ padding-left:65px;}
    .flip .next{  padding-right: 65px;}



    /* ========== */
    /* = ABOUT = */
    /* ========== */
    .about{ padding: 40px 0;}
    .about-box{ margin-top:30px; padding:30px; line-height:26px; font-size: 13px;}
    .about-box .img{ margin-top: 30px;}
    .honor-box{ margin-top:40px; padding-bottom: 40px;}
    .honor-box .content{padding:15px;}
    .honor-box .content .left{ float: none; width:100%;}
    .honor-box .content ul{ float: none; width: 100%;}
    .honor-box .content ul li{ width:25%;}


    /* ========== */
    /* = CONTACT = */
    /* ========== */
    .contact{ padding: 40px 0;}
    .contact-info{ margin-top:30px; padding:0 0 30px;}
    .contact-info .content{ margin: 0;}
    .contact-info .item{width: 100%; margin-top: 30px; padding: 0 0;}
    .contact-info .item .text{ margin-top: 15px;}
    .contact-info .item .text p{ margin-top:0;}
    .map-tit{ margin-top: 40px; }
    .map-tit div{ margin-top:20px;}
    .map-tit div span{ margin:0 0 10px;}
    .map-tit div .tel:after{ display: none;}
    .contact .map{ margin-top:30px;}
    .contact .map-con{  height:250px;}




    /* ========== */
    /* = SOLUTION = */
    /* ========== */
    .solution-banner .img{ position: relative; padding-bottom:60%; width: 100%;}
    .solution-banner .box{ width:100%; max-width: 100%; padding:30px 10px;}
    .solution-banner .box .tit{ font-size:18px; color: #FFFFFF;}
    .solution-banner .box .text{ margin-top:20px; padding-top:20px;}
    .solution-banner .box .text span{width:50px; height:50px; border-radius:30px; }
    .solution-banner .box .text b{ margin: 0; font-size:10px;}
    .solution-banner .box .text em img{ height:10px;}
    .solution-banner .box .des{ margin-top: 15px;}
    .solution-banner .index-more{ margin-top:25px;}

    .solution-characteristics .content{ padding-bottom: 35px;}
    .solution-characteristics ul{ margin: 0 -5px;}
    .solution-characteristics li{ width:50%; text-align: center; padding:5px;}
    .solution-characteristics li:nth-child(2n+1){ clear: both;}
    .solution-characteristics li:nth-child(3n+1){ clear: initial;}
    .solution-characteristics .item{ padding:20px 2px;}
    .solution-characteristics .item img{ float: none; width: 40px;}
    .solution-characteristics .item div{ margin-left:0;}
    .solution-characteristics .item div span{ font-size: 14px;}
    .solution-characteristics .item div p{ font-size: 12px;}

    .solution-functions li{ width:33.33333%; padding: 15px 2px;}
    .solution-functions li:nth-child(3n+1){clear: both;}
    .solution-functions li .img{ width: 40px;}
    .solution-functions li span{ margin-top: 5px; font-size: 14px;}
    .solution-functions li p{ margin-top:5px; font-size: 12px;}

    .xg-products{ padding: 40px 0;}
    .xg-products li{ width:100%; margin-top:30px; }
    .xg-products li .text{ font-size: 16px;}

    .solution-cooperation li{ width:33.33333%;}

    .solution-services{ padding:40px 0;}
    .solution-services .text{ padding:20px 0; line-height:28px;}
    .solution-services .text p:before{top:11px;}
    .solution-services  .content{ padding-bottom: 45px; }
    .solution-services  .content li{ width:25%; padding: 20px 0;}
    .solution-services  .content li:nth-child(4n+1){ clear: both; }
    .solution-services  .content li img{ width: 40px;}

}






.zx-news{  padding-bottom:80px; }
.zx-news .tit{ border-bottom: 1px solid #eeeeee; font-size: 20px; color: #333333; padding-bottom:20px; font-weight: bold;  margin-bottom:20px;}
.zx-news li{ float: left; width: 33.33333333%; padding: 0 20px; }
.zx-news li a{ display: block; line-height: 34px; height: 34px; position: relative; padding-left:15px;}
.zx-news li a:before{ content: ""; position: absolute; top:50%; margin-top: -3px; left:0;  width:6px; height: 6px ; border-radius: 50% ; background: #096fc3;}

@media (max-width:780px) {
    .zx-news{  padding-bottom:40px; }
    .zx-news li{ width: 100%; padding:0;}
}