.pro_list {

	width: 100%;

	overflow: hidden;

	/* margin-top: 20px; */
}

.pro_list ul {

	width: 100%;

	display: flex;

	flex-direction: row;

	flex-wrap: wrap;

	justify-content: flex-start;

	gap: 20px;

	padding: 20px;
}

.pro_list ul li {

	width: calc((100% - 40px) / 3);

	background: white;

	padding: 20px;

	/* height: 15vw; */

	/* float: left; */

	/* margin-right: 3%; */

	/* border: 1px solid #ddd; */

	/* margin-bottom: 24px; */

	/* padding: 15px; */

	/* position: relative; */
}

.pro_list ul li .pic .imgauto {

	width: 100%;

	/* height: 272px; */

	overflow: hidden;
}

.pro_list ul li .pic .imgauto img {

	transition: .5s;

	-webkit-transform: scale(1);

	transform: scale(1);

	height: 20vh;

	width: 100%;

	object-fit: cover;
}

.pro_list ul li .pic span {

	font-size: 18px;

	color: black;

	font-weight: bold;

	display: block;

	/* text-align: center; */

	line-height: 30px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

	margin-top: 15px;
}

.pro_list ul li .pic .desc {

	font-size: 16px;

	color: black;

	font-weight: 400;

	display: -webkit-box;

	-webkit-line-clamp: 3;

	-webkit-box-orient: vertical;

	overflow: hidden;

	text-overflow: ellipsis;

	line-height: 1.5em;

	line-clamp: 3;

	box-orient: vertical;

	white-space: normal;
}

.pro_list ul li .text {

	width: 272px;

	height: 272px;

	display: none;

	background: rgba(0, 122, 255, .7);

	position: absolute;

	top: 15px;

	left: 15px;

}

.pro_list ul li .text a {

	width: 100%;

	height: 100%;

	display: block;

}

.pro_list ul li .text a img {

	display: block;

	margin: 100px auto;

}

.pro_list ul li:hover .text {

	display: block;

}

.pro_list ul li:hover .pic .imgauto img {

	-webkit-transform: scale(1.15, 1.15);

	transform: scale(1.15, 1.15);

	transition: .5s;

}

.pro_list ul li:hover .pic span {

	font-weight: normal;

	color: #0241e2;

}

.pro_list ul li:hover .pic .to-case-a {

	font-weight: normal;

	color: #0241e2;

}

.to-case {
	display: flex;
	/* justify-content: center; */
	margin-top: 15px;
}

.to-case-a {
	/* padding: 5px 20px; */
	/* background: #edf2f7; */
	border-radius: 2px;
	cursor: pointer;
	color: black;
}

.to-case-a:hover {
	font-weight: bold;
}

@media screen and (max-width:768px) {

	.pro_list ul li {

		width: 100%;

	}
}