.card{transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;width:100%;height:100%;background:#fff;position: relative;}
.card-area{height:500px;width:100%;position:relative;}
.card-item.active{z-index:6;width:49.1%;height:500px}
.card-area .card-item+.card-item{margin-left:-1px}
.card-item{z-index:4;transition:all .3s cubic-bezier(.4,0,.2,1),z-index 0s .12s;position:relative;float:left;width:25.5%;height:500px;background-color:transparent;overflow: hidden;}
.card_img{
	position: relative;
	transition: all ease-out .3s;
}
.card_img img{
	min-width: 935px;
	position: relative;
}
.card_img h3{
	position: absolute;
	bottom: 60px;
	left: 50px;
	color: #fff;
}
.card_img h3:before{
	content: "";
	border-left: 6px solid #086BCF;
	height: 16px;
	position: absolute;
	top: 5px;
	left: -15px;
}
.card-content1{
	position: absolute;
	top: 0;
	right: 0;
	display: none;
	transition: all ease-out .3s;
}
.card-content1 img{
	max-width: inherit!important;
}
.card-content1_word{
	position: absolute;
	top: 40%;
	left: 25%;
	color: #FFFFFF;
}
.card-content1_word a{
	color: #fff;
	margin-top: 50px;
	display: flex;
	transition: all ease-out .3s;
}
.card-content1_word a img{
	margin: 2px 0 0 12px;
	width: 24px;
	height: 14px;
}
.card-content1:hover .card-content1_word a{
	transform:translateX(25px);
	-webkit-transform:translateX(25px);  
	-moz-transform:translateX(25px);
	transition: all ease-out .3s;  
}
.card-item.active .card-content1{
	display: block;
}
.card-item:hover .card-content1{
	display: block;
}