.c_txbg1{
    background: url("tximg1.png");
}
.c_txbg2{
    background: url("tximg2.png");
}
.c_txbg3{
    background: url("tximg3.png");
}
.c_2{
    padding: 75px 0;
    background: #213574;
    /* height: 900px; */
}
.c2_1{
    height: 356px;
    background: rgba(22, 41, 103, 1);
    padding:0 24px;
    -webkit-transition: all .36s ease;
    transition: all .36s ease;
    overflow: hidden;
}
.c2_1:hover{
    background: rgba(22, 41, 103, 0);
}
.c2_1:hover .c2_1top{
    padding-top:32px; 
}
.c2_1:hover .c2_1top h4{
   color: #ec6000;
}
.c2_1:hover .c2_1top p{
    color: #fff;
 }
.c2_1:hover .c2_1bottom::after{
    width: 100%;
    background-color: #f25a00;
}
.c2_1:hover .c2_1bottom i{
    opacity: 1; 
    right: 0;
}
.c2_1top{
    padding-top: 95px;
    height: 270px;
    -webkit-transition: all .36s ease;
    transition: all .36s ease;
}
.c2_1top h4{
    color: #fff;
    margin-top: 0;
    margin-bottom:20px
}
.c2_1top p{
    color: #8c8a8b;
    font-size:12px;
    line-height: 30px;
}
.c2_1bottom{
    width:100%;
    height: 85px;
    position: relative;
    border-top: 1px solid #fff;
    
}
.c2_1bottom::after{
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    -webkit-transition: all .36s ease;
    width: 0%;
    height: 1px;
    background-color: #fff;
    -webkit-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}
.c2_1bottom span{
    line-height: 85px;
    color: #fff;
}
.c2_1bottom i{
    opacity: 0; 
    position: absolute;
    top: 25px;
    right: -42px;
    width: 34px;
    height: 34px;
    border: 1px solid #fff;
    border-radius: 0%;
    -webkit-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}
.c2_1bottom i::before{
    content: ">";
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    line-height: 14px;
    font-size: 14px;
    position: absolute;
    top: -6px;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    line-height: 44px;
    color: #fff;
}

.c_2 a{display: block;}




.solution-box-wraper {
	width: 100%;
	background: #292e33;
}
.solution-box {
    position: relative;
    width: 1200px!important;
    min-width: 1200px!important;
    max-width: 1200px!important;
    margin:auto
}
.arr-btn {
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    z-index: 99;
    display: none\0;
    *display: none;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    transition: all .5s;
    -moz-transition: all .5s;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
}
.solution-box:hover .arr-btn {
	display: block\0;
	*display: block;
	opacity: 1;
	-moz-opacity:1;
	-khtml-opacity: 1;
}

.arr-btn {
	background-color: rgba(255,255,255,0.08);
}
.arr-btn i {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -10px;
	margin-top: -18px;
	display: block;
	width: 20px;
	height: 36px;
	z-index: 100;
}
.arr-btn .arr-left {
	background: url(index-sprite.png) no-repeat 0 -1538px;
    left: 0;
}
.arr-btn .arr-right {
	background: url(index-sprite.png) no-repeat 0 -1500px;
    right:0;
}
.solution-list {
	width: auto!important;
}
.arr-btn-left {
	left: 0;
}
.arr-btn-right {
	right: 0;
}
.solution-list ul li {
	float: left;
	position: relative;
	height: 500px;
	width: 300px;
	transition: background-color .5s;
	-moz-transition: background-color .5s;
	-webkit-transition: background-color .5s;
	-o-transition: background-color .5s;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
}
.solution-bg-li01 {
	background: url(cloud-photo.jpg) no-repeat center;
}
.solution-bg-li02 {
	background: url(finance-photo.jpg) no-repeat center;
}
.solution-bg-li03 {
	background: url(mobile-photo.jpg) no-repeat center;
}
.solution-bg-li04 {
	background: url(busin-photo.jpg) no-repeat center;
}
.solution-bg-li05 {
	background: url(game-photo.jpg) no-repeat center;
}
@media only screen and (max-width: 1200px) {
	.solution-list ul li {
		width: 224px;
	}
}
@media only screen and (max-width: 1017px) {
	.solution-list ul li {
		width: 224px;
	}
}
.solution-list ul li .li-bgcolor {
	height: 100%;
	position: absolute;
	width: 100%;
	background-color: #292e33;

}
.li-bgcolor.opa-5 {
	filter:alpha(opacity=50);
	opacity: 0.5;
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
}
.li-bgcolor.opa-8 {
	filter:alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
}
.solution-list ul li > i {
	position: absolute;
	top: 170px;
	left: 50%;
	margin-left: -30px;
	width: 60px;
	height: 60px;
	z-index: 2;
	transition: top .5s;
	-moz-transition: top .5s;
	-webkit-transition: top .5s;
	-o-transition: top .5s;
}
.solution-list ul li > i.cloud-icon {
	background: url(solution-items-icon.png) no-repeat 0 0;
}
.solution-list ul li > i.finance-icon {
	background: url(solution-items-icon.png) no-repeat 0 -60px;
}
.solution-list ul li > i.mobile-icon {
	background: url(solution-items-icon.png) no-repeat 0 -120px;
}
.solution-list ul li > i.busin-icon {
	background: url(solution-items-icon.png) no-repeat 0 -180px;
}
.solution-list ul li > i.game-icon {
	background: url(solution-items-icon.png) no-repeat 0 -240px;
}
.solution-list ul li:hover > i {
	margin-left: -30px;
	width: 60px;
	height: 60px;
}
.solution-list ul li > p.solution-title {
	position: absolute;
	top: 280px;
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 20px;
	z-index: 2;

	transition: top .5s;
	-moz-transition: top .5s;
	-webkit-transition: top .5s;
	-o-transition: top .5s;
}
.solution-list ul li > p.solution-intro {
	text-indent: 26px;
	font-size: 12px;
	height: 150px;
	padding: 0 30px;
	overflow: hidden;
	position: absolute;
	top: 282px;
	color: #fff;
	line-height: 2;
	z-index: 2;
	opacity: 0;
	filter: alpha(opacity=0);
	transition: all .6s;
	-moz-transition: all .6s ;
	-webkit-transition: all .6s ;
	-o-transition: all .6s ;
}
.solution-list ul li > a {
	position: absolute;
	top: 452px;
	left: 50%;
	margin-left: -59px;
	width: 118px;
	height: 34px;
	line-height: 32px;
	text-align: center;
	border: 1px solid #fff;
	font-size: 14px;
	color: #fff;
	z-index: 2;
	opacity: 0;

	transition: all .6s ;
	-moz-transition: all .6s ;
	-webkit-transition: all .6s ;
	-o-transition: all .6s ;
}
.solution-list ul li:hover .li-bgcolor {
	background-color: #059fff;
}
.solution-list ul li:hover i {
	top: 76px;
}
.solution-list ul li:hover p.solution-title {
	top: 168px;
}
.solution-list ul li:hover p.solution-intro {
	top: 230px;
	opacity: 1;
	filter: alpha(opacity=100);
}
.solution-list ul li:hover a {
	top: 380px;
	opacity: 1;
	filter: alpha(opacity=100);
}

.cp3 {background:url(a6.png) 50% 50%;height:743px;}
.cp3 .cloud-service-list li {
    position: relative;
    float: left;
    width: 32%;
    height: 240px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin-left: 1%;
    margin-top: 20px;
    cursor: pointer;
    text-align:center;
}

.cp3 .cloud-service-list li .cloud-service-sligen-from {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 230px;
    height: 240px;
    background: #fff;
    -o-transform: perspective(800px) rotateY(0deg);
    -webkit-transform: perspective(800px) rotateY(0deg);
    -ms-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
    -o-transition: transform 500ms ease-in-out;
    -ms-transition: transform 500ms ease-in-out;
    -webkit-transition: transform 500ms ease-in-out;
    transition: transform 500ms ease-in-out;
    opacity: 1;
    filter: alpha(opacity=100);
}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg1{background: url(b3.png) 0px 0px; width:67px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg1{background: url(b3.png) 0px 60px; width:67px;height:60px;}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg2{background: url(b3.png) -68px 0px; width:69px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg2{background: url(b3.png) -68px 60px; width:69px;height:60px;}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg3{background: url(b3.png) -136px 0px; width:69px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg3{background: url(b3.png) -136px 60px; width:69px;height:60px;}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg4{background: url(b3.png) -205px 0px; width:69px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg4{background: url(b3.png) -205px 60px; width:69px;height:60px;}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg5{background: url(b3.png) -276px 0px; width:70px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg5{background: url(b3.png) -276px 60px; width:70px;height:60px;}

.cp3 .cloud-service-list li .cloud-service-sligen-from .cloud-service-bg6{background: url(b3.png) -345px 0px; width:59px;height:60px;}
.cp3 .cloud-service-list li .cloud-service-sligen-back .cloud-service-bg6{background: url(b3.png) -345px 60px; width:59px;height:60px;}

.cp3 .cloud-service-sligen span {
    display: block;
    margin:auto;
    margin-top: 30px;
}
.cp3 .cloud-service-sligen .cloud-service-name {font-size:18px;text-align:center;margin-bottom:25px;}
.cp3 .cloud-service-sligen .cloud-service-info {font-size:12px;line-height:22px;padding:0px 35px;text-align:justify;}
.cp3 .cloud-service-sligen-back .cloud-service-name {color:#fff;}
.cp3 .cloud-service-sligen-back .cloud-service-info {color:#fff;}
.cp3 .cloud-service-sligen-from .cloud-service-name {color:#3e82f7;}
.cp3 .cloud-service-sligen-from .cloud-service-info {color:#999999;}
.cloud-service-list li .cloud-service-sligen-back {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 230px;
    height: 240px;
    background: #386ad9;
    -o-transition: transform 500ms cubic-bezier(0.07, 0.42, 0.65, 1.3);
    -ms-transition: transform 500ms cubic-bezier(0.07, 0.42, 0.65, 1.3);
    -moz-transition: transform 500ms cubic-bezier(0.07, 0.42, 0.65, 1.3);
    -webkit-transition: transform 500ms cubic-bezier(0.07, 0.42, 0.65, 1.3);
    transition: transform 500ms cubic-bezier(0.07, 0.42, 0.65, 1.3);
    -o-transform: perspective(800px) rotateY(-180deg);
    -ms-transform: perspective(800px) rotateY(-180deg);
    -moz-transform: perspective(800px) rotateY(-180deg);
    -webkit-transform: perspective(800px) rotateY(-180deg);
    transform: perspective(800px) rotateY(-180deg);
    opacity: 0;
    filter: alpha(opacity=0);
}

.cloud-service-list li:hover .cloud-service-sligen-from {
	-o-transform: perspective(800px) rotateY(180deg);
	-ms-transform: perspective(800px) rotateY(180deg);
	-moz-transform: perspective(800px) rotateY(180deg);
	-webkit-transform: perspective(800px) rotateY(180deg);
	transform: perspective(800px) rotateY(180deg);
	opacity: 0;
	filter: alpha(opacity=0);
}
.cloud-service-list li:hover .cloud-service-sligen-back{
	-o-transform: perspective(800px) rotateY(0deg);
	-ms-transform: perspective(800px) rotateY(0deg);
	-moz-transform: perspective(800px) rotateY(0deg);
	-webkit-transform: perspective(800px) rotateY(0deg);
	transform: perspective(800px) rotateY(0deg);
	opacity: 1;
	filter: alpha(opacity=100);
}

.news .cate{color:#3e82f7;line-height:40px;border-bottom:1px solid #3e82f7;margin-bottom:20px}
.news .cate div:first-child{font-size:22px;}
.news ul li{line-height:40px}
.news ul li a{display:block;}
.news ul li a span{display:inline-block;float:right;font-size:12px;margin-top:10px}
.news ul li a:hover{color:#3e82f7}
