@charset "utf-8";
/*about zyr
 * 内容：互联网资质
 * 2017-9-20
 */
/*页面公用 start*/
.icons{background: url(/public/images/aptitude/icons_03.png) no-repeat;}

/*banner start*/
.banner-text{
	width: 1200px;
	text-align: left;
	position: absolute;
	left: 50%;    
	margin-left: -560px;
	top: 0;
}
.text-img{
	display: block;
	width: 401px;
	height:198px;
	margin: 100px 0  50px;
}
.blue{color:#2eb4b5;}
/*banner end*/

/*热门互联网资质服务 start*/
.hot-list{
	width: 1039px;
	margin: 0 auto;
	overflow: hidden;
	border-left:1px solid #e5e5e5 ;
	border-top: 1px solid #e5e5e5;
}
.hot-list li{
	width: 24.9%;
	float: left;
	text-align: center;
	height: 179px;
	overflow:hidden ;
	border-right: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    overflow: hidden;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.hot-list li:before{
	content: "";
    position: absolute;
    z-index: -1;
    width: 260px;
    height: 260px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    border-radius:50%;
    filter:alpha(opacity=0);
    -moz-opacity:0;
    -khtml-opacity:0;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.hot-list li:hover:before{  
	animation: backgound-li 1s linear;
	-webkit-transform: scale(2);
    transform: scale(2);
}
.hot-list .bg-li{background: #f7f7f7;}
.hot-list li i{
	width: 95px;
	height: 75px;
	margin: 36px 0 10px;
}
.hot-list li .hot-icon2{background-position: -95px 0;}
.hot-list li .hot-icon3{background-position: -190px 0;}
.hot-list li .hot-icon4{background-position: -285px 0;}
.hot-list li .hot-icon5{background-position: -380px 0;}
.hot-list li .hot-icon6{background-position: -475px 0;}
.hot-list li .hot-icon7{background-position: -570px 0;}
.hot-list li .hot-icon8{background-position: -665px 0;}
.hot-list li .hot-icon9{background-position: -760px 0;}
.hot-list li .hot-icon10{background-position: -855px 0;}
.hot-list li .hot-icon11{background-position: -950px 0;}
.hot-list li .hot-icon12{background-position: -1045px 0;}
.hot-list li p{
	font-size: 16px;
	line-height: 18px;
	color: #333;
}
.hot-list li:hover i{
    animation: hot 0.6s linear 1;
    -moz-animation: hot 0.6s linear 1;
    -webkit-animation: hot 0.6s linear 1;
    -moz-animation: hot 0.6s linear 1;
    -ms-animation: hot 0.6s linear 1;
    -o-animation: hot 0.6s linear 1;
}
/*热门互联网资质服务 end*/
/*为什么要办理互联网资质 start*/
.box{
	background: url(/public/images/aptitude/why-bg1_02.jpg) repeat-x;
	position: relative;
	z-index: 3;
}
.why-bg{
	width: 415px;
	height: 454px;
	position: absolute;
	right:-3px;
	top: 0;
	z-index: -1;
}
.why-list{
	width: 1140px;
	padding:0 0 60px 60px;
	overflow: hidden;
}
.why-list li{
	width: 225px;
	height: 257px;
	border-radius: 5px;
	background: #fff;
	text-align: center;
	float: left;
	margin-right: 60px;
	line-height: 0;
	box-shadow: 0 0 15px 0 rgba(216,216,216.,0.4);
	position: relative;
	z-index: 3;
}
.why-list li:before,.why-list li:after{
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 225px;
    height: 0;
    background:#2eb4b5;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    z-index: -1;
}
.why-list li:hover:before,.why-list li:hover:after{
	height: 129px;
}
.why-list li:after{
    top: auto;
    bottom: 0;
}
.why-list li i{
	width: 99px;
	height: 99px;
	border-radius: 50%;
	background-position: 0 -75px;
	margin: 23px 0 19px;
	vertical-align: middle;
	-webkit-transition: all.6s;
	transition: all.6s;
}
.why-list li p{
	font-size: 24px;
	line-height: 26px;
	color: #262626;
	padding-bottom: 17px;
}
.why-list li span{
	font-size: 14px;
	line-height: 16px;
	color: #353535;
}
.why-list li .why-icon2{background-position: -99px -75px;}
.why-list li .why-icon3{background-position: -198px -75px;}
.why-list li .why-icon4{background-position: -297px -75px;}
.why-list li:hover i{
	background-color: #f7f7f7;
    -webkit-animation: tadaA 2s ease-out infinite;
    animation: tadaA 2s ease-out infinite;
}
.why-list li:hover p,.why-list li:hover span{color: #fff;}
/*为什么要办理互联网资质 end*/
/*8大优势 start*/ 
.adv-list{
	width: 1050px;
	margin: 0 auto;
	overflow: hidden;
}
.adv-list li{
	width: 200px;
	height: 230px;
	float: left;
	text-align: center;
	margin:0 5px;
	background: url(/public/images/aptitude/adv-bg.png) no-repeat;
	-webkit-transition: background-image .6s;
	transition: background-image .6s;
	line-height: 0;
	position: relative;
	z-index: 3;
}
.adv-list li:hover{background:none;}
.adv-bg{
	width: 0;
	height: 230px;
	background: url(/public/images/aptitude/adv-bg.png) no-repeat;
	background-position: -200px 0;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	-webkit-transition: width .5s;
	transition: width .5s;
}
.adv-list li:hover .adv-bg{width: 200px;}
.adv-list .adv-li{margin-top:-52px;}
.adv-list .adv-li6{margin-left:109px;}
.adv-list li a{
	width: 100%;
	height: 100%;
}
.adv-list li i{
	width: 45px;
	height: 45px;
	background-position: 0 -182px;
	margin: 68px 0 28px;
	-webkit-transition: all .6s;
	transition: all .6s;
}
.adv-list li .adv-icon2{background-position: -45px -182px;}
.adv-list li .adv-icon3{background-position: -90px -182px;}
.adv-list li .adv-icon4{background-position: -135px -182px;}
.adv-list li .adv-icon5{background-position: -180px -182px;}
.adv-list li .adv-icon6{background-position: -225px -182px;}
.adv-list li .adv-icon7{background-position: -270px -182px;}
.adv-list li .adv-icon8{background-position: -315px -182px;}
.adv-list li .adv-icon9{background-position: -360px -182px;}
.adv-list li:hover i{background-position: 0 -227px;}
.adv-list li:hover .adv-icon2{background-position: -45px -227px;}
.adv-list li:hover .adv-icon3{background-position: -90px -227px;}
.adv-list li:hover .adv-icon4{background-position: -135px -227px;}
.adv-list li:hover .adv-icon5{background-position: -180px -227px;}
.adv-list li:hover .adv-icon6{background-position: -225px -227px;}
.adv-list li:hover .adv-icon7{background-position: -270px -227px;}
.adv-list li:hover .adv-icon8{background-position: -315px -227px;}
.adv-list li:hover .adv-icon9{background-position: -360px -227px;}
.adv-list li p{
	font-size: 16px;
	line-height: 18px;
	color: #2b2e33;
}
.adv-list li:hover p,.adv-list li:hover p font{color: #fff;}
/*8大优势 end*/
/*互联网资质办理流程 start*/
.flow-list{
	width: 100%;
	background: url(/public/images/aptitude/flow-bg.png) no-repeat;
	background-position: center 47px;
	height: 200px;
}
.flow-list li{
	width: 16.66%;
	text-align: center;
	position: relative;
	float: left;
	z-index: 3;
}
.flow-list li a{width: 100%;}
.icon-box{
	width: 129px;
	margin: 0 auto;
	text-align: center;
	height: 92px;
	border-top: 6px solid #ebecee;
	background: #fff;
	box-shadow: 0 0 18px 2px rgba(0,0,0,0.1);
	-webkit-transition: all .5s;
	transition: all .5s;
}
.icon-box i{
	width: 40px;
	height: 35px;
	background-position: 0 -273px;
	margin-top: 28px;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.icon-box .flow-icon2{background-position: -40px -273px;}
.icon-box .flow-icon3{background-position: -80px -273px;}
.icon-box .flow-icon4{background-position: -120px -273px;}
.icon-box .flow-icon5{background-position: -160px -273px;}
.icon-box .flow-icon6{background-position: -200px -273px;}
.flow-list li p{
	font-size: 16px;
	line-height: 18px;
	color: #333;
	padding-top: 25px;
}
.flow-list li em{
	width: 37px;
	height: 37px;
	text-align: center;
	line-height: 36px;
	font-size: 23px;
	color: #fff;
	background-position: 0 -311px ;
	position: absolute;
    left: 3px;
    bottom: 40px;
    z-index: -1;
}
.flow-list li .num-icon2{background-position: -37px -311px;}
.flow-list li .num-icon3{background-position: -74px -311px;}
.flow-list li .num-icon4{background-position: -112px -311px;}
.flow-list li .num-icon5{background-position: -150px -311px;}
.flow-list li .num-icon6{background-position: -187px -311px;}
.flow-list .cur em{
	-webkit-animation: gelatine 1s infinite;
    -moz-animation: gelatine 1s infinite;
    animation: gelatine 1s infinite;
}
.flow-list .cur .icon-box{
	-webkit-animation-name: bounce;
	animation-name: bounce;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}
.flow-list .cur .icon-box i{
	transform: scale(1.3);
}
/*互联网资质办理流程 end*/