.gutn-video-list {
}
.video-list {
	display: flex;
	gap: 30px;
}

.video-list__video {
	flex: 1 1 50%;
	border-radius: 10px;
	overflow: hidden;
	/* aspect-ratio: ; */
	position: relative;
	align-self: flex-start;
	aspect-ratio: 450 / 494;
}

.video-list__video > a {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.video-list__video .play {
	border-radius: 50px;
	background: rgba(130, 130, 130, 0.4);
	width: 102px;
	display: flex;
	height: 102px;
	justify-content: center;
	align-items: center;
}

.video-list__video .play svg {
	color: var(--c-white);
	width: 34px;
	height: auto;
}

.video-list__list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	flex: 1 1 50%;
}

.video-list__list-item {
	padding: 14px;
	background: #f5f2f0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	border-radius: 10px;
	/* font-size: 14px; */
}

.video-list__list-item header {
	display: flex;
	align-items: center;
	gap: 16px;
}

.video-list__list-item .index {
	color: #9f8363;
}

.video-list__list-item .title {
	font-size: 18px;
	font-weight: 500;
}

.video-list__list-item > p {
	margin: 0 !important;
}

.video-list__video .picture {
	height: 100%;
}

@media (max-width: 1024px) {
	.video-list {
		flex-direction: column;
	}
	.video-list__video {
		width: 100%;
		aspect-ratio: 14/9;
	}
}