


.more{ float:left;}
.more a {
	position: relative;
	transition: ease .6s;
	-ms-transition: ease .6s;
	-o-transition: ease .6s;
	-webkit-transition: ease .6s;
	-moz-transition: ease .6s;
	padding:0;
	   width:252px;
	   height:180px;
	   display: block;
	    border:1px solid #eee;

}

.more a:hover {
	background: none;
	 color:#ff0000;
}

.more a:hover i:first-child {
	width: 100%;
	right: 0;
	left: auto
}

.more a:hover i:nth-child(2) {
	right: 0;
	height: 100%;
	top: 0;
	bottom: auto
}

.more a:hover i:nth-child(3) {
	right: 0;
	height: 100%;
	top: auto;
	bottom: 0
}

.more a:hover i:nth-child(4) {
	width: 100%;
	right: auto;
	left: 0
}

.more a i {
	transition: ease .6s;
	-ms-transition: ease .6s;
	-o-transition: ease .6s;
	-webkit-transition: ease .6s;
	-moz-transition: ease .6s;
	position: absolute;
	height: 2px;
	background: #ED3F4A;
}



.more a i:first-child {
	top: 0;
	width: 0%;
	right: auto;
	left: 0
}

.more a i:nth-child(2) {
	width: 2px;
	height: 0%;
	left: 0;
	bottom: 0;
	top: auto
}

.more a i:nth-child(3) {
	width: 2px;
	height: 0%;
	right: 0;
	bottom: auto;
	top: 0
}

.more a i:nth-child(4) {
	bottom: 0;
	width: 0%;
	right: 0;
	left: auto
}



.more a span img{
	opacity: 1;
	   width:230px; 
	   height:164px;
	   display:block;
	   padding:10px;

}

.more a:hover span{	 color:#333;}

.more .scroll-watch-in-view {
	transition-delay: .7s
}

.more .scroll-watch-in-view i:first-child {
	animation: hua 2s ease
}

.more .scroll-watch-in-view i:nth-child(2) {
	animation: hua2 2s ease
}

.more .scroll-watch-in-view i:nth-child(3) {
	animation: hua3 2s ease
}

.more .scroll-watch-in-view i:nth-child(4) {
	animation: hua4 2s ease
}

.more .scroll-watch-in-view span {
	transition: all cubic-bezier(.4,0,.2,1) 1s .8s;
	-ms-transition: all cubic-bezier(.4,0,.2,1) 1s .8s;
	-o-transition: all cubic-bezier(.4,0,.2,1) 1s .8s;
	-webkit-transition: all cubic-bezier(.4,0,.2,1) 1s .8s;
	-moz-transition: all cubic-bezier(.4,0,.2,1) 1s .8s;
	opacity: 1
}

@keyframes hua {
	0% {
		width: 0%;
		right: 0;
		left: auto
	}

	36% {
		width: 100%
	}

	100% {
		width: 0%;
		right: auto;
		left: 0
	}
}

@keyframes hua2 {
	0% {
		height: 0%;
		left: 0;
		top: 0
	}

	36% {
		height: 100%
	}

	100% {
		height: 0%;
		left: 0;
		top: auto
	}
}

@keyframes hua3 {
	0% {
		height: 0%;
		bottom: 0;
		top: auto
	}

	36% {
		height: 100%
	}

	100% {
		height: 0%;
		bottom: auto;
		top: 0
	}
}

@keyframes hua4 {
	0% {
		width: 0%;
		right: auto;
		left: 0
	}

	36% {
		width: 100%
	}

	100% {
		width: 0%;
		right: 0;
		left: auto
	}
}

@media (max-width:1200px) {
	

	.style {
		padding: .5rem 0 .4rem;
		background-attachment: inherit
	}

	.style .one {
		width: 73%;
		border-left: .1rem solid transparent;
		border-right: .05rem solid transparent
	}

	.style .two {
		width: 27%;
		border-left: .05rem solid transparent;
		border-right: .1rem solid transparent
	}

	.style .two .pro:first-child {
		border-bottom: .05rem solid transparent
	}

	.style .two .pro:last-child {
		border-top: .05rem solid transparent
	}

	.style-warpper {
		padding: .5rem 0 0
	}

	
	.more {
		margin-top: .4rem
	}
}

@media (max-width:850px) {
	
}

@media (max-width:650px) {
	

	.more {
		margin-top: .8rem
	}

	.more a {
		font-size: 12px;
		padding: 6px 30px
	}



	.style .one .page-list {
		font-size: 13px
	}

	.style .one .page-list a {
		line-height: 32px
	}

	.style {
		padding: 1.3rem 0 .3rem
	}

	.style .one {
		width: 100%;
		overflow: inherit;
		border: 0
	}

	.style .one .style-page {
		position: absolute;
		bottom: -5.7rem
	}

	.style .two {
		display: none;
		width: 100%;
		border: 0;
		margin-bottom: .8rem
	}

	.style .two .pro {
		display: inline-block;
		width: 50%;
		border-top: .2rem solid transparent!important;
		border-bottom: .2rem solid transparent!important;
		border-left: .1rem solid transparent;
		border-right: .1rem solid transparent
	}

	.style .more {
		display: none
	}

	.style-warpper {
		padding: 1rem 0 0
	}

	
}

@media (max-width:355px) {
	.style .one .style-page {
		bottom: -5.9rem
	}
}

@media (max-width:330px) {
	.style .one .style-page {
		bottom: -6rem
	}
}