
.sub_sort li a, .sort_info .title a, .sort_info, .proType_topic li:before{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
/* img scale */
.c_pub_pic img{
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
.proType_sort li:hover .sort_pic img{
	transform: scale(1.06);
	-webkit-transform: scale(1.06);
	-moz-transform: scale(1.06);
	-o-transform: scale(1.06);
}

/* proType_sort */
.proType_box .web_th{max-width: 1400px;}

.proType_sort{padding-top: 2%;}
.proType_sort li{width: 31%; margin-top: 3.5%; position: relative; overflow: hidden; margin-right: 3.5%;}
.proType_sort li:nth-child(3n){margin-right: 0;}
.proType_sort li .sort_pic{padding-bottom: 114.3%; overflow: hidden;}
.proType_sort li .sort_info{background: rgba(var(--comColorRgb), 0.86); color: #fff; padding: 5% 15px; text-align: center; line-height: 1.25; position: absolute; bottom: -10%; left: 0; right: 0; z-index: 1; height: 0;}
.proType_sort li .sort_info .name{color: #fff; font-size: 32px; text-transform: uppercase; font-family: 'Adobe Heiti Std';}

.proType_sort li:hover .sort_info{height: auto; bottom: 0;}

@media only screen and (max-width: 1450px) {
	.proType_sort li .sort_info .name{font-size: 30px;}
}
@media only screen and (max-width: 1350px) {
	.proType_sort li .sort_info .name{font-size: 28px;}
	
}
@media only screen and (max-width: 1200px) {
	.proType_sort{padding-top: 0;}
	.proType_sort li{width: 31.5%; margin-top: 2%; margin-right: 2.75%;}
	.proType_sort li .sort_info .name{font-size: 24px;}
}

@media only screen and (max-width: 950px) {
	.proType_sort li{width: 48.5%; margin-top: 20px; margin-right: 3%;}
	.proType_sort li:nth-child(3n){margin-right: 3%;}
	.proType_sort li:nth-child(2n){margin-right: 0;}
	.proType_sort li .sort_info{height: auto; bottom: 0; padding: 15px 15px;}
	.proType_sort li .sort_info .name{font-size: 20px;}
}
@media only screen and (max-width: 640px) {
	.proType_sort li{width: 100%; margin-top: 20px; margin-right: 0 !important;}
}

/* proType_topic_box */
.proType_topic_box{}
.proType_topic{padding: 3% 0 0;}
.proType_topic li{width: 23%; overflow: hidden; border-radius: 10px; background: #E5DEC7; padding: 2.5% 20px 80px; text-align: center; position: relative; z-index: 0;}
.proType_topic li:before{position: absolute; left: 0; top: 0; width: 100%; height: 0; content: ''; z-index: -1; background: var(--commonColor);}
.proType_topic li .title{font-size: 24px; font-weight: bold; line-height: 1.5; text-transform: uppercase; height: 4.5em; overflow: hidden;}
.proType_topic li .title .txt{font-size: inherit;}
.proType_topic li .brief{line-height: 1.5; color: #666; padding: 10px 0;}
.proType_topic li .order{text-align: right; color: var(--commonColor); font-size: 72px; font-weight: bold; line-height: 1; position: absolute; left: 20px; right: 20px; bottom: 10px;}

.proType_topic li:hover .title, .proType_topic li:hover .title a{color: #fff;}
.proType_topic li:hover .brief{color: #fff;}
.proType_topic li:hover .order{color: #E5DEC7;}
.proType_topic li:hover::before{height: 100%;}


@media only screen and (max-width: 1350px) {
	.proType_topic li{padding-bottom: 72px;}
	.proType_topic li .title{font-size: 22px;}
	.proType_topic li .order{font-size: 62px;}
}
@media only screen and (max-width: 1200px) {
	.proType_topic li{padding-bottom: 62px;}
	.proType_topic li{width: 48.5%; margin-bottom: 30px;}
	.proType_topic li .title{font-size: 21px; height: 3em;}
	.proType_topic li .order{font-size: 52px;}
}

@media only screen and (max-width: 950px) {
	.proType_topic li{padding: 15px; padding-bottom: 50px;}
	.proType_topic li .title{font-size: 20px;}
	.proType_topic li .order{font-size: 42px;}
}
@media only screen and (max-width: 640px) {
	.proType_topic li{width: 100%; margin-bottom: 20px;}
	.proType_topic li .title{font-size: 20px; height: auto; display: block;}
	.proType_topic li:last-child{margin-bottom: 0;}
}
