.related { background-color: #f0f0f0; }
.related > h2 {
	font-size: 16px;
	font-family: Avenir-Heavy,sans-serif;
}
.related > div {
	position: relative;
	overflow: hidden;
	margin-top: 20px;
	display: flex;
	justify-content: flex-start;
	gap: 20px;
}
.related > div .item{
	/* margin: 0 10px; */
	background: #fff;
	flex:1;
	max-width: 200px;
	display: flex;
	flex-direction: column;
}
.related > div .item > div{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex:1;
	padding: 10px;
}
.related > div .item a{
	display: block;
	width: 100%;
}
.related > div .item .im{
	width: 100%;
	aspect-ratio: 1/1;
}
.related > div .item .im img,
.related > div .item .im video{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.related > div .item .title{
	font-family:Avenir-Medium, sans-serif;
	font-size: 14px;
	font-weight: 700;
	display: -webkit-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	width: auto;
	margin-bottom: 5px;
}
@media (max-width: 767px) {
	.related > div{
		flex-direction: column;
	}
    .related > div .item{
		width: 100%;
		flex-direction:row;
		max-width: 100%;
	}
	.related > div .item .im{
		width: 30%;
		max-width: 110px;
	}
}