.templateBox {
	border: 2px solid #fff;
	box-shadow: 0px 3px 12px 0px rgba(3, 47, 105, 0.09);
	border-radius: 6px;
	background: linear-gradient(180deg, #f5f7fa 0%, #ffffff 100%);
	height: 208px;
	box-sizing: border-box;
	padding: 16px 20px;
	transition: box-shadow 0.2s cubic-bezier(0, 0, 1, 1);
	&:hover {
		box-shadow: 0px 6px 24px 0px rgb(3 47 105 / 14%);
	}
	.templateTop {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin-bottom: 12px;
		.templateTopItem {
			font-size: 12px;
			line-height: 20px;
			color: rgba(138, 144, 153, 1);
		}
		.templateTopLine {
			width: 1px;
			height: 16px;
			background-color: rgba(221, 225, 230, 1);
			margin: 0 11px;
		}
	}
	.templateTitleBox {
		height: 24px;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin-bottom: 12px;
		.templateTitle {
			font-size: 15px;
			line-height: 22px;
			color: rgba(30, 38, 51, 1);
			margin-left: 8px;
			font-weight: 550;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			display: inline-block;
		}
	}
	.templateDesc {
		height: 60px;
		font-size: 12px;
		line-height: 20px;
		color: rgba(86, 92, 102, 1);
		margin-bottom: 16px;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		display: -webkit-box;
	}
}
