section {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.case-list {
	padding: 60px 0 30px;
}
section.case-list {
    min-height: 610px;
}
.case-list h1 {
	color: #fff;
}
.case-list a {
	text-decoration: none;
	color: #0097a0;
	display: block;
}
.case-list .num {
	font-weight: 800;
	font-size: 24px;
}
.case-list .name {
	color: #fff;
	font-size: 20px;
	margin-bottom: 30px;
}
.case-list .pic img {
	max-width: 100%;
}
.case-list .text {
	color: #999;
	text-transform: uppercase;
	margin: 30px 0;
}
.case-list .btn {
	color: #0097a0;
	border-color: #0097a0;
	margin: 0 auto;
	display: block;
	width: 120px;
	padding-left: 0;
	padding-right: 0;
	min-width: auto;
}
.case-list .item {
	margin-bottom: 50px;
}
.case-list .row:last-child .item { margin-bottom: 0;}
.col-right {
	text-align: right;
}


.pic-tr {
	display: none;
	position: relative;
	width: 100%;
	height: 240px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 0 50%;
	-moz-transform-origin: 0 50%;
	-o-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transform: perspective(220px) rotate3d(0,10,0,10deg);
	-moz-transform: perspective(220px) rotate3d(0,10,0,10deg);
	-o-transform: perspective(220px) rotate3d(0,10,0,10deg);
	transform: perspective(220px) rotate3d(0,10,0,10deg);
}
.pic-tr img {
	max-width: 100%;
}
.pic-1 {
	z-index: 3;
	left: 41%;
	top: 33%;
	width: 98%;
}
.pic-2 {
	z-index: 2;
	top: 15%;
	left: 18%;
	width: 85.93%;
}
.pic-tr-i {
	position: absolute;
	box-shadow: 0 0 75px 0 rgba(0,0,0,0.4);
}
.pic-3 {
	top: 0;
	left: 0;
	width: 77.15%;
}

@media (min-width: 768px) {
	.ra-flex-center {
		display: flex;
		flex-direction: column;
		height: 100%;
		justify-content: center;
	}
	section { padding: 52px 0;}
	.case-list { padding-bottom: 60px;}
	.case-list .item {height: 280px;}
	.case-list .pic {
		position: absolute;
		top: 0;
		left: 100%;
		width: 100%;
	}
	.case-list .btn {
		position: absolute;
		left: 0;
		bottom: 0;
	}
	
	.case-list h1 {
		font-size: 42px;
	}
	.case-list .num, .case-list .name {
		font-size: 28px;
	}
	.case-list .col-right .pic {
		left: auto;
		right: 100%;
	}
	.case-list .col-right .btn {
		left: auto;
		right: 0;
	}

	.pic-tr {
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		right: -100%;
		-webkit-transform: perspective(235px) rotate3d(0,10,0,10deg);
		-moz-transform: perspective(235px) rotate3d(0,10,0,10deg);
		-o-transform: perspective(235px) rotate3d(0,10,0,10deg);
		transform: perspective(235px) rotate3d(0,10,0,10deg);
	}
	.col-right .pic-tr {
		left: -100%;
		right: auto;
	}
}
@media (min-width: 992px) {
	header { background: none;}
}
@media (max-height: 620px) and (min-width: 1024px) {
	section { padding: 40px 0 0;}
}
@media (min-height: 620px) and (min-width: 1024px) {
	section { padding: 70px 0 0;}
}
@media (min-width: 1024px) {
	.case-list h1 {
		font-size: 60px;
	}
	.case-list {
		padding-top: 120px;
	}
	.top-menu a {
		color: #f1f1f1;
	}
	.color .top-menu a {
		color: #414141;
	}
	.case-list .item {
		height: 360px;
		margin-bottom: 80px;
	}
	.case-list .num, .case-list .name {
		font-size: 36px;
	}
	.index-feedback {
		padding-bottom: 70px;
	}
}
@media (max-width: 1480px) {
}
@media (min-width: 1024px) and (min-height: 768px) {

}
@media (min-width: 1280px) {
	.case-list .num, .case-list .name {
		font-size: 48px;
	}
	.case-list .item {
		height: 420px;
	}
	.case-list .text {
		max-width: 480px;
		font-size: 22px;
	}
	.case-list h1 {
		font-size: 80px;
	}
	.case-list .col-right .text {
		margin-left: auto;
	}
	.case-list .item {
		margin-bottom: 140px;
	}
	.case-list .row:last-child .item {
		margin-bottom: 80px;
	}

	.pic-tr {
		position: absolute;
		top: 0;
		right: 100%;
		width: 100%;
		height: 100%;
	}
	.pic-tr img {
		max-width: 100%;
	}
	.pic-1 {
		z-index: 3;
		left: 41%;
		top: 33%;
		width: 98%;
	}
	.pic-2 {
		z-index: 2;
		top: 15%;
		left: 18%;
		width: 85.93%;
	}
	.pic-tr-i {
		position: absolute;
		box-shadow: 0 0 75px 0 rgba(0,0,0,0.4);
	}
	.pic-3 {
		top: 0;
		left: 0;
		width: 77.15%;
	}
}
@media (min-width: 1390px) and (min-height: 768px) {
}
@media (min-width: 1400px) and (min-height: 780px) {
}
@media (min-width: 1200px) and (min-height: 610px) {

}
@media (min-width: 1620px) and (min-height: 768px) {

}
@media (min-width: 768px) and (max-height: 767px){

}
@media (min-width: 768px) and (max-width: 1023px) and (min-height: 900px) {

}
@media (min-width: 1024px) and (max-height: 680px) {

}
@media (min-width: 1024px) and (max-height: 680px) {
	.case-list h1 {
		font-size: 60px;
	}
	.case-list .row:last-child .item {
	    margin-bottom: 0;
	}
	.case-list .num, .case-list .name {
	    font-size: 38px;
	}
	.case-list .item {
	    height: auto;
	}
	.case-list .btn {
	    position: relative;
	    margin-left: 0;
	}
}

