/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
.cl{
  clear:both;
}
/*------------------ 系统介绍 ------------------*/
.agency{
	padding: 8em 0 1em 0;
	background: url(../img/bg4.jpg) no-repeat center center #0A2A46;
	min-width: 1200px;
}

.entersteps-content {
          width: 1200px;
          margin: 0 auto;
          text-align: center;
        }
.entersteps-content10 {
          width: 100%;
          margin: 0 auto;
          text-align: center;
          padding:0 1.5em 0 0;
        }
div {
         display: block;
       }
.entersteps-content .entersteps-title {
    color: #fff;
    font-size: 36px;
    font-weight: 900;
    margin: 0;
    padding-bottom: 1em;
    text-align: center;
}

.entersteps-content .entersteps-list ul li {
    width: 32%;
    float: left;
    border-top: 1px solid #fff;
    padding-right: 30px;
    padding-top: 37px;
    position: relative;
}
.entersteps-list .entersteps-list-title{
  color:#fff;
}

.entersteps-list:before {
    content: "";
    width: 36px;
    height: 36px;
    position: absolute;
    top: 0px;
    right: 0;
    border: 2px solid #2a4c97;
    border-radius: 50%;
    text-align: center;
    line-height:36px;
    z-index: 2;
    background-color: #f7f7f7;
}

.entersteps-list:after {
    content: "";
    width: 50px;
    height: 4px;
    position: absolute;
    top: 0px;
    right: -5px;
    z-index: 1;
}

.entersteps-content .entersteps-list ul .entersteps-li-two:before {
    content: "2";
}
.entersteps-content .entersteps-list ul .entersteps-li-three:before {
    content: "3";
}
.entersteps-content .entersteps-list ul .entersteps-li-four:before {
    content: "4";
}
.entersteps-content .entersteps-list ul .entersteps-li-five:before {
    content: "5";
}
.entersteps-content .entersteps-list ul .entersteps-li-six:before {
    content: "6";
}

.entersteps-content .entersteps-list ul li:before {
    content: "1";
    width: 36px;
    height: 36px;
    position: absolute;
    top: -15px;
    left: 0;
    border: 2px solid #2a4c97;
    border-radius: 50%;
    text-align: center;
    line-height: 36px;
    color: #2a4c97;
    font-weight: 600;
    z-index: 2;
}


.entersteps-content .entersteps-list ul li:after {
    content: "";
    width: 35px;
    height: 35px;
    position: absolute;
    top: -15px;
    background: #fff;
    border-radius: 50%;
    z-index: 1;
}



.entersteps-content .entersteps-list-tips {
    font-size: 14px;
    color: #D1D1D1;
}
.entersteps-content10 .entersteps-list-tips {
    font-size: 14px;
    color: #D1D1D1;
}
.entersteps-list {
    position: relative;
    display: inline-block;
    text-align: left;
    width: 100%;
}


.clearfix.entersteps-ul{
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;
    display: table;
    width: 100%;
}


.entersteps-content .entersteps-btn {
    text-align: center;
    padding:15px;
}

.entersteps-content .entersteps-btn a {
    display: inline-block;
    width: auto;
    height: 48px;
    background: #2a4c97;
    font-size: 18px;
    color: #fff;
    padding:0 15px;
    text-align: center;
    line-height: 48px;
    border-radius: 4px;
    webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    text-decoration:none;
}

.entersteps-content .entersteps-btn a:hover{
	background: #152558;
}


/*-- services --*/
.services{
	padding: 6em 0;
}
.services-info{
	text-align: center;
	width: 80%;
	margin: 0 auto;
}	
.services-info h3{
	color: #666666;
	font-size: 36px;
	font-weight: 900;
	margin: 0;
	padding-bottom: 1em;
	background: url(../about-images/hr.png) no-repeat 410px 53px;
}
.services-info span{
	color:#E74C3C;
}
.services-info p{
	font-size:16px;
	color:#858585;
	margin: 1.5em 0 4em 0;
}
.services-grids {
	width: 100%;
	margin-left: 3em;
}
.service-grid{
	width: 20%;
	float: left;
}
.service-grid-bg{
	background:#3A5169;
	height: 160px;
    width: 160px;
    border-radius:50%;
	text-align:center;
	position:relative;
	 
}
.service-grid-bg.red {
	background: #E74C3C;
}
.service-grid-text{
	position:absolute;
	left:36px;
	top: 58px;
	text-align: center;
	
}

.service-grid-text1{
  position:absolute;
  left:46px;
  top: 58px;
  text-align: center;
  
}

.service-grid-text h5{
	font-size:16px;
	color:#FFF;
	margin:0;
}
.service-grid-text1 h5{
  font-size:16px;
  color:#FFF;
  margin:0;
}

.service-grid-text h2{
	color:#FFF;
	margin:0;
	font-size: 22px;
}
.service-grid-text1 h2{
  color:#FFF;
  margin:0;
  font-size: 22px;
}

.service-grid-text p{
	color:#FFF;
	font-size: 12px;
	font-weight: 300;
}
.service-grid-text1 p{
  color:#FFF;
  font-size: 12px;
  font-weight: 300;
}

.border{
	background: #FFF;
	margin: 1em auto;
	width: 80%;
	height: 3px;
}
/*-- services-bottom --*/
.services-bottom{
	background:url(../images/sr-bottom.jpg) no-repeat 0px 0px;
	background-size:cover;
	min-height:349px;
}
.services-bottom-text{
	width: 72%;
	margin: 82px auto;
}
.services-bottom-text h3{
	color: #FFF;
	font-size: 33px;
	font-weight: 700;
	text-align: center;
	letter-spacing: 2px;
	margin:0;
}
.services-bottom-text span{
	color:#E74C3C;
}
.services-bottom-text label{
	display:block;
}
span.line {
	width: 4%;
	height: 1px;
	background: rgba(255, 254, 254, 0.75);
	display: inline-block;
}
span.line-anchor {
	text-decoration: none;
	color: #FFF;
	text-transform: uppercase;
	width: 28%;
	margin: 1em 0;
	text-align: center;
	padding: 10px 0;
	font-size: 20px;
	font-weight: 200;
	cursor: text;
}
.sub-text{
	text-align: center;
	margin-top: 3em;
}
/*-- work --*/
.work{
	padding:2em 0;
	background:#F7F7F7;
	text-align: center;
}
.work-info {
	text-align:left;
	width: 80%;
	margin: 0 auto;
}
.work-info h3{
	text-align: center;
	color: #666666;
	font-size: 36px;
	font-weight: 900;
	margin: 0 auto;
	padding-bottom: 1em;
	background: url(../about-images/hr.png) no-repeat 410px 53px;
}
.work-info span {
	color: #E74C3C;
}
.work-info p {
	font-size: 22px;
	color: #858585;
}
.work-info-grid{
	float:left;
	width:33%;
	position: relative;
	cursor: pointer;
}
.work-info-grid img{
	width:100%;
}
.caption {
	display: none;
	top: 0;
	width: 100%;
	position: absolute;
	background: rgba(231, 76, 60, 0.73);
	height: 100%;
	text-align: center;
}
.caption span {
	background: url(../images/link.png) no-repeat;
	width: 101px;
	height: 102px;
	display: block;
	text-align: center;
	position: absolute;
	top: 30%;
	right: 37%;
	background-size: 100%;
}
.work-info-grid:hover div.caption {
	display: block;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
/*-- blog --*/
.blog{
	padding:2em 0;
	text-align: center;
}
.blog-info {
	text-align: left;
	width: 80%;
	margin: 0 auto;
}
.blog-info h3{
	color: #666666;
	font-size: 36px;
	font-weight: 900;
	margin: 0;
	padding-bottom: 1em;
	background: url(../about-images/hr.png) no-repeat 410px 53px;
	text-align: center;
}
.blog-info span {
	color: #E74C3C;
}
.blog-info p {
	font-size: 16px;
	color: #858585;
	margin:0.2em 0;
}
.blog-info-grid{
	width:33%;
	float:left;
	position: relative;
	cursor: pointer;
}
.blog-info-grid-text{
	background: #F6F6F6;
	padding: 0 1em 3em 1.5em;
	text-align: left;
}
.work-info-grid.first{
	float:left;
	width:100%;
	position: relative;
	cursor: pointer;
}
.blog-info-grid-text label{
	color: #6F6F6F;
	font-size: 12px;
	font-weight: 600;
	margin: 4em 0 0 0;
}
.blog-info-grid-text h5{
	font-size:22px;
	font-weight:600;
	color: #6F6F6F;
	margin: 0;
}
.blog-info-grid-text p{
	font-size:16px;
	font-weight:500;
	color: #6F6F6F;
	margin: 1.5em 0 3em;
}
.blog-info-grid-text span{
	font-size:16px;
	font-weight:500;
	color: #6F6F6F;
}
.blog-info-grid-text span img{
	margin:0 .5em;
}
.gray{
	background:#ECECEC;
}
.partners{
		background:url(../images/snow.jpg) no-repeat 0px 0px;
		background-size:cover;
		padding: 6em 0;
}
.slid-grid{
	float:left;
	width: 16.66%;
	text-align: center;
}
/*-- address --*/
.address{
	background:#E74C3C;
	padding: 2em 0;
}
.address ul{
	padding:0;
	margin:0;
}
.address ul li{
	display:inline-block;
	color:#FFF;
	font-size:18px;
}
.address ul li a{
	color:#FFF;
}
.address ul li a:hover{
	text-decoration:none;
}
.address ul li span{
	font-size:18px;
	font-weight:600;
}
.address ul li.p-number{
	margin: 0 6.4em;
}
/*-- description --*/
.description{
	padding: 6em 0;
}
.description-left ul{
	padding:0;
	margin:0;
}
.description-left ul li{
	display:inline-block;
}
.description-left ul li a img{
	margin-top: -126px;
}
.description-left ul li.para{
	font-size: 16px;
	color: #666666;
	width: 60%;
	font-weight: 600;
	margin-left: 1em;
	line-height: 1.5em;
}
.description-right{
	text-align:left;
}
.description-right h5{
	color: #676767;
	font-size: 18px;
	text-transform: uppercase;
	margin: 0;
	font-weight: 700;
}
.border1{
	width: 100%;
	height: 1px;
	background: #676767;
	margin: .5em 0 1em;
}
.list{
	text-align:left;
	float:left;
	width: 44%;
}
.list ul{
	margin:0;
	padding:0;
}
.list ul li{
	display: block;
}
.list ul li a{
	color: #777777;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.5em;
}
.list ul li a:hover{
	text-decoration:none;
	color:#E74C3C;
	transition: .5s all;
	-webkit-transition: .5s all;
	-moz-transition: .5s all;
	-o-transition: .5s all;
	-ms-transition: .5s all;
}
/*-- quote --*/
.quote{
	text-align: center
}
.quote a{
	background: #3A5169;
	color: #FFF;
	font-weight: 900;
	font-size: 22px;
	margin: 0;
	letter-spacing: 5px;
	display: block;
	padding: .5em 0;
}
.quote a:hover{
	color:#FFF;
	text-decoration:none;
	background:#E74C3C;
	transition: .5s all;
	-webkit-transition: .5s all;
	-moz-transition: .5s all;
	-o-transition: .5s all;
	-ms-transition: .5s all;
}
/*-- footer-top --*/
.footer-top{
	background:#F7f7f7;
	padding: 3em 0;
}
.icons {
	text-align: center;
}
.icons ul {
	padding: 0;
	margin: 0;
}
.icons ul li {
	display: inline-block;
	margin: 0 2em;
}
.icons ul li a.facebook {
	background: url(../images/social-icons.png) no-repeat 0px 0px;
	width: 20px;
	height: 37px;
	display: block;
}
.icons ul li a.facebook:hover{
	background: url(../images/social-iconshr.png) no-repeat 0px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
.icons ul li a.instagram {
	background: url(../images/social-icons.png) no-repeat -27px 0px;
	width: 31px;
	height: 37px;
	display: block;
}
.icons ul li a.instagram:hover{
	background: url(../images/social-iconshr.png) no-repeat -27px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
.icons ul li a.behance {
	background: url(../images/social-icons.png) no-repeat -71px 0px;
	width: 34px;
	height: 37px;
	display: block;
}
.icons ul li a.behance:hover {
	background: url(../images/social-iconshr.png) no-repeat -71px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
.icons ul li a.chrome {
	background: url(../images/social-icons.png) no-repeat -111px 0px;
	width: 34px;
	height: 37px;
	display: block;
}
.icons ul li a.chrome:hover {
	background: url(../images/social-iconshr.png) no-repeat -111px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
.icons ul li a.twitter {
	background: url(../images/social-icons.png) no-repeat -151px 0px;
	width: 34px;
	height: 37px;
	display: block;
}
.icons ul li a.twitter:hover {
	background: url(../images/social-iconshr.png) no-repeat -151px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
.icons ul li a.dribble {
	background: url(../images/social-icons.png) no-repeat -194px 0px;
	width: 34px;
	height: 37px;
	display: block;
}
.icons ul li a.dribble:hover {
	background: url(../images/social-iconshr.png) no-repeat -194px 0px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
}
/*-- footer-bottom --*/
.foot{ 
	background-color:#f7f7f7; 
	height:80px; 
	width:100%; 
	color:#6d6d6d;
	padding-top:20px;
}
.foot a{
	color:#6d6d6d; 
	padding:0 5px;
	font-size: 14px;
}
.foot a:hover{
	color:#f40;
	text-decoration: none;
}
.foot_nav{
	color:#6d6d6d; 
	padding:12px 0 ; 
	width: 100%;
	margin: 0 auto;
	text-align: center; 
	background-color:#f7f7f7; 
}
.foot_nav a{ 
	color:#6d6d6d; 
	padding:0 5px;
	font-size: 11px;
}
.foot_bar{ 
	line-height:20px; 
	font-size:11px; 
	padding:2px 0 0 0;
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}
.some-info{
    margin-top: 10px;
}
/*-- to-top --*/
#toTop {
	display: none;
	text-decoration: none;
	position: fixed;
	bottom: 14px;
	right: 2%;
	overflow: hidden;
	z-index: 999; 
	width: 24px;
	height: 24px;
	border: none;
	text-indent: 100%;
	background: url("../images/up-arrow.png") no-repeat 0px 0px;
}
#toTopHover {
	width: 40px;
	height: 40px;
	display: block;
	overflow: hidden;
	float: right;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
}
span.menu {
	display: none;
}
/*-- responsive-design --*/
@media (max-width:1440px)
{
	.agency-left {
		margin-left: 12em;
	}
}
@media (max-width:1366px)
{
	.agency-left {
		margin-left: 8em;
	}
	.services-bottom-text h3 {
		font-size: 31px;
	}
	.callbacks_tabs {
		left: 43%;
	}
}
@media (max-width:1280px)
{
	.head-bg {
		min-height: 660px;
	}
	.agency-left h2 {
		font-size: 32px;
	}
	.agency-left h4 {
		font-size: 22px;
	}
	.agency-left p {
		font-size: 16px;
	}
	.agency-left {
		margin-left: 4em;
	}
	.callbacks_nav {
		left: -3%;
	}
	.callbacks_nav.next {
		left: 100%;
	}
	.services-bottom-text h3 {
		font-size: 29px;
	}
	.callbacks_tabs {
		left: 42%;
	}
}
@media (max-width:1024px)
{
	.head-bg {
		min-height: 600px;
	}
	.head-info {
		margin: 9em 0 0 0;
	}
	.top-nav ul li {
		margin: 0 1em;
	}
	.agency {
		padding: 4em 0;
	}
	.agency-left h2 {
		font-size: 28px;
		padding-bottom: .7em;
	}
	.agency-left {
		background: url(../images/hr.png) no-repeat 1px 34px;
		width: 34%;
	}
	.agency-left h4 {
		font-size: 18px;
		margin: 0 auto;
	}
	.agency-right {
		width: 100%;
	}
	.services {
		padding: 4em 0;
	}
	.services-info h3 {
		background: url(../about-images/hr.png) no-repeat 322px 53px;
	}
	.service-grid-bg {
		height: 146px;
		width: 146px;
	}
	.service-grid-text {
		left: -21px;
		top: 5px;
	}
	.service-grid-text h5 {
		font-size: 15px;
	}
	.services-bottom-text h3 {
		font-size: 22px;
	}
	.callbacks_tabs {
		left: 40%;
		top: 74%;
	}
	.sub-text {
		margin-top: 2em;
	}
	.services-bottom {
		min-height: 250px;
	}
	.services-bottom-text {
		width: 72%;
		margin: 4em auto;
	}
	.work {
		padding: 4em 0;
	}
	.work-info h3 {
		background: url(../about-images/hr.png) no-repeat 326px 53px;
	}
	.blog {
		padding: 4em 0;
	}
	.blog-info h3 {
		background: url(../about-images/hr.png) no-repeat 326px 53px;
	}
	.blog-info-grid-text h5 {
		font-size: 18px;
	}
	.blog-info-grid-text p {
		margin: 1em 0;
	}
	.address ul li {
		font-size: 16px;
	}
	.address ul li.p-number {
		margin: 0 4.5em;
	}
	.address ul li span {
		font-size: 16px;
	}
	.description {
		padding: 4em 0;
	}
	.description-left ul li a img {
		margin-top: -192px;
	}
	.services-grids {
		margin-left: 1.88em;
	}
}
@media (max-width:768px)
{
	.header {
		padding: 1em 0 0 0;
	}
	span.menu{
		display: block;
		text-align: right;
		padding: 2em;
		cursor: pointer;
		color: #E74C3C;
		font-size: 16px;
		font-weight: 700;
		position:relative;
	}
	.top-nav {
		float: right;
	}
	ul.nav1 {
		display: none;
	}
	.top-nav ul {
		padding: 0;
		margin: 0;
		z-index: 999;
		position: absolute;
		width: 100%;
		left:0;
	}
	.top-nav ul.nav1 li {
		display: block;
		text-align: center;
		background: #1A3958;
		border-bottom: 1px solid #0F2031;
		margin: 0;
	}
	.top-nav ul li a {
		font-size: 16px;
		padding: 1em 0;
		color: #FFF;
		display: block;
	}
	.btn-1 {
		width: 177px;
	}
	.head-info h1 {
		font-size: 30px;
	}
	.head-info p {
		font-size: 14px;
	}
	.callbacks_nav {
		left: 0%;
	}
	.callbacks_nav.next {
		left: 95%;
	}
	.button {
		margin: 3em 0 1em .1em;
		font-size: 18px;
		background: url(../images/arrow.png) no-repeat 136px 16px;
	}
	.btn-1e:hover, .btn-1e:active {
		background: url(../images/arrowhr.png) no-repeat 136px 16px;
	}
	.head-bg {
		min-height: 496px;
	}
	.agency-left h2 {
		font-size: 26px;
	}
	.agency-left h4 {
		width: 80%;
	}
	.agency-left p {
		width: 80%;
		margin: 0.5em auto;
	}
	.agency-left {
		float: none;	
		width:100%;
		text-align:center;
		margin:0;
	}
	.button-red:hover {
		background: url(../about-images/arrowhr.png) no-repeat 169px 16px;
	}
	.agency {
		padding: 2em 0;
	}
	.agency-right {
		float:right;
		width: 100%;
	}
	.agency-left {
		background: url(../about-images/hr.png) no-repeat 320px 32px;
	}
	.services {
		padding: 2em 0 0 0;
	}
	.services-info h3 {
		font-size: 26px;
		background: url(../about-images/hr.png) no-repeat 234px 31px;
	}
	.services-info p {
		margin: 0.5em 0 4em 0;
	}
	.services-grids {
		width: 100%;
		margin-left: 5.88em;
	}
	.service-grid {
		width: 50%;
		float: left;
		margin-bottom: 5em;
	}
	.services-bottom-text h3 {
		overflow: hidden;
		height: 50px;
	}
	span.line-anchor {
		font-size: 16px;
	}
	.callbacks_tabs {
		left: 37%;
	}
	.work {
		padding: 2em 0;
	}
	.work-info h3 {
		background: url(../images/hr.png) no-repeat 234px 31px;
		font-size: 26px;
	}
	.services-bottom-text {
		margin: 3em auto;
	}
	.services-bottom {
		min-height: 206px;
	}
	.work-info p {
		margin: 0.5em 0 1em 0;
	}
	.work-info-grids {
		width: 90%;
		margin: 0 auto;
	}
	.blog {
		padding: 2em 0;
	}
	.blog-info h3 {
		font-size: 26px;
		background: url(../about-images/hr.png) no-repeat 234px 31px;
	}
	.blog-info p {
		margin: 0.5em 0 ;
	}
	.blog-info-grid-text h5 {
		overflow: hidden;
		height: 18px;
	}
	.blog-info-grid-text {
		padding: 0 1em 2em 1.5em;
	}
	.blog-info-grid-text p {
		font-size: 14px;	
		margin: 1em 0 1em;
	}
	.blog-info-grid-text span {
		font-size: 14px;
	}
	.partners {
		padding: 3em 0;
	}
	.address ul {
		text-align: left;
		margin: 0 0 0 8em;
	}
	.address ul li {
		display: block;
	}
	.address ul li.p-number {
		margin: .5em 0;
	}
	.address {
		padding: 1em 0;
	}
	.description {
		padding: 2em 0;
	}
	.description-left ul li a img {
		margin-top: -79px;
	}
	.description-left {
		text-align: center;
		padding-bottom: 2em;
	}
	.description-left ul li.para {
		text-align: left;
	}
	.footer-top {
		padding: 2em 0;
	}
	.caption span {
		width: 64px;
		height: 64px;
	}
}
@media (max-width:640px)
{
	.top-nav ul li a {
		padding: .8em 0;
	}
	.head-info {
		margin: 6em 0 0 0;
	}
	.head-bg {
		min-height: 438px;
	}
	.agency-left {
		background: url(../about-images/hr.png) no-repeat 258px 32px;
	}
	.agency-left h4 {
		font-size: 17px;
		width: 70%;
	}
	.services-grids {
		margin-left: 5.3em;
	}
	.services-info h3 {
		background: url(../about-images/hr.png) no-repeat 194px 31px;
	}
	.callbacks_tabs {
		left: 34%;
	}
	.work-info h3 {
		background: url(../about-images/hr.png) no-repeat 188px 31px;
	}
	.blog-info-grid-text p {
		overflow: hidden;
		height: 62px;
	}
	.slid-grid a img {
		width: 87%;
	}
	.address ul li {
		display: block;
	}
	.address ul li.p-number {
		margin: .5em 0;
	}
	.description-left ul li a img {
		margin-top: -105px;
	}
	.description-left ul li.para {
		font-size: 14px;
	}
	.description-right h5 {
		font-size: 16px;
	}
	.icons ul li {
		margin: 0 1.5em;
	}
}

/**右侧工具按钮**/