.test1{
	padding:7px 4px;
	margin: 0;
	border:2px solid rgba(0,0,0,.01);
	position:relative;
	transition:500ms;
	overflow:hidden;
	max-height:200px;
}
.test_img {
	min-height: 189px;
}
.test2{

	overflow:hidden;
	max-height:160px;
}
.prom{
    width:95% !important;
}
.test_img{
	padding:0;
	margin:0;
}
.test1:hover .test_sp1{
	width:100%;
}
.test1:hover .test_sp3{
	width:100%;
}
.test1:hover .test_sp2{
	height:100%;
}
.test1:hover .test_sp4{
	height:100%;
}
.test_sp1{
	position:absolute;
	width:0%;
	height:4px;
	background:rgba(0,0,0,.5);
	top:0;
	left:0;	transition:600ms;
}
.test_sp2{
	position:absolute;
	width:4px;
	height:0%;
	background:rgba(0,0,0,.5);
	top:0;
	left:0;	transition:600ms;
}

.test_sp3{
	position:absolute;
	width:0%;
	height:4px;
	background:rgba(0,0,0,.5);
	bottom:0;
	right:0;	transition:600ms;
}
.test_sp4{
	position:absolute;
	width:4px;
	height:0%;
	background:rgba(0,0,0,.5);
	bottom:0;
	right:0;	transition:600ms;
}
.test_sp5 {
	position: absolute;
	width: 40px;
	height: 50px;
	padding: 5px 10px;
	top: -100%;
	left: 39%;
	background: rgba(0,0,0,.6);
	color: #fff;
	text-align: center;
	font-size: 2.3rem;
	transition: 750ms;
}

.test1:hover .test_sp5{
	top:45%;
}
.prom2{
	width:98%;
}
.prom2h {
	border-bottom:4px dotted #fff;
	
	background:#5B6580;
}
.text-center {
    font-size: 40px;
    font-weight: normal;
    color: #fa5c59;
}
.prom2h h4{
	color:#fff;
}

.prom2m {
	background: rgba(0,0,0,.3);
	padding: 10px 20px;
	color: #fff;
	position:relative;
	overflow:hidden;
}
.prom2m:hover {
	background: rgba(0,0,0,.3);
	padding: 10px 20px;
	border:2px solid red;
	color: #fff;
}
.prom2m   i{
	transition:400ms;
	padding-left:70px;
}
.prom2m:hover i{
	transform:rotate(360deg);
	color:red;
}
.more1 {
	position: absolute;
	left: 0;
	top: 10px;
	width: 100%;
	transition: 500ms;
	height: 100%;
	color:#fff;
}
.more2 {
	position: absolute;
	left: 0;
	top: -45px;
	width: 100%;
	transition: 500ms;
	color: red;
}
.prom2m:hover .more1{
	top:95px;
}
.prom2m:hover .more2{
	top:10px;
}