* {
	margin: 0;
	padding: 0;
}
.home{
	.main {
		display: flex;
		flex-grow: 1;
		flex-basis: auto;
		flex-direction: column;
		margin-top: 0px;
		.post-card {
			display: flex;
			max-width: 100%;
			padding: 0 calc((100% - 1200px)/2) 40px;
			flex-wrap: wrap;
			justify-content: center;
			align-items: stretch;
			&-display {
				flex-basis: 360px;
				display: flex;
				flex-grow: 1;
				flex-shrink: 1;
				position: relative;
				min-height: 420px;
				margin: 20px;
				background-color: #FFF;
				border-radius: 10px;
				overflow: hidden;
				box-shadow: 0 20px 40px 0 rgba(50,50,50,0.08);
				flex-direction: column;
				top: 0px;
				transition: ease-in-out;
				-moz-transition: top .5s;
				-webkit-transition: top .5s;
				-o-transition: top .5s;
				&:hover {
					cursor: pointer;
					top: -15px;
				}
				a {
					text-decoration: none;
					display: flex;
					flex-direction: column;
					flex-grow: 1;
					flex-shrink: 1;
					.post-card-title {
						padding: 30px 24px;
						display: flex;
						flex-grow: 1;
						font-size: 20px;
						font-weight: 500;
						line-height: 36px;
						color: @textColorTheme;
					}
					img {
						width: 100%;
						height: 200px;
						margin-bottom: 30px;
						background: @headerBackgroundColor;
						object-fit: cover;
					}
				}
			}
			&-meat {
				display: flex;
				padding: 8px 24px 24px 16px;
				justify-content: space-between;
				.meat-info {
					display: flex;
					flex-direction: column;
					.info-auth {
						display: flex;
						z-index: 3;
						align-content: flex-start;
						align-items: center;
						a {
							left: -8px;
							padding: 2px 8px;
							font-size: 14px;
							line-height: 20px;
							color: #898FA0;
							background: transparent;
							border-radius: 12px;
							text-decoration: none;
							outline: 0;
							cursor: pointer;
						}
					}
					.info-data {
						margin: 8px 0 0 8px;
						font-size: 12px;
						line-height: 18px;
						color: @textColorTheme;
					}
				}
			}
		}
		.post-block{
			padding: 0 calc((100% - 1160px)/2);
			margin-bottom: 50px;
			&-content{
				margin: 20px 0;
				text-decoration: none;
				display: flex;
				padding: 50px;
				border-radius: 10px;
				background-color: #fff;
				box-shadow: 0 20px 40px 0 rgba(50,50,50,0.08);
				position: relative;
				top: 0px;
				transition: all .5s ease-in-out;
				-moz-transition: all .5s;
				-webkit-transition: all .5s;
				-o-transition: all .5s;
				&:hover {
					cursor: pointer;
					top: -15px;
				}
				img{
					width: 456px;
					height: 258px;
					background: @headerBackgroundColor;
					object-fit: cover;
					border-radius: 15px;
				}
				&-info{
					flex: 1;
					padding: 0 40px;
					display: flex;
					flex-direction: column;
					// justify-content: space-between;
					h2{
						color: @textColorTheme;
						font-size: 22px;
						font-weight: 500;
						line-height: 38px;
						.text-line();
						&:hover {
							color: #000;
						}
					}
					&-excerpt{
						margin: 20px 0;
						font-size: 16px;
						line-height: 30px;
						.text-line(3);
						color: #999;
						letter-spacing:2px;
					}
					&-exhibition{
						margin-top: auto;
						display: flex;
						align-items: center;
						justify-content: space-between;
						&-tags{
							display: flex;
							align-items: center;
							a{
								display: inline-block;
							}
						}
						.post-tag{
							color: #898FA0;
							margin-right: 16px;
						}
					}
				}
			}
			@media screen and (max-width:1300px) {
				&-content{
					margin: 20px 100px;
					img{
						width: 380px;
						height: 214px;
						background: @headerBackgroundColor;
						object-fit: cover;
						border-radius: 15px;
					}
					&-info{
						&-excerpt{
							.text-line(2);
						}
					}
				}
			}
			@media screen and (max-width:1000px) {
				&-content{
					margin: 20px 100px;
					flex-direction: column;
					align-items: center;
					img{
						width:100%;
						height: 300px;
						background: @headerBackgroundColor;
						object-fit: cover;
						border-radius: 15px;
					}
					&-info{
						width: 100%;
						padding-top: 30px;
						&-excerpt{
							margin: 10px 0;
							.text-line(2);
						}
					}
				}
			}
			@media screen and (max-width:800px) {
				&-content{
					margin: 20px 50px;
					padding: 30px;
				}
			}
			@media screen and (max-width:600px) {
				&-content{
					margin: 20px;
					padding: 20px;
					img{
						height: 260px;
					}
					&-info{
						width: 100%;
						padding-top: 20px;
					}
				}
			}
		}
		
		.meat-type {
			width: 32px;
			height: 32px;
			margin-top: 10px;
			background: url('https://cdn.jsdelivr.net/gh/duogongneng/MyBlogImg/imgicon-article.svg') no-repeat;
		}
	}
	
	.change-page {
		height: 40px;
		display: flex;
		padding: 0 calc((100% - 1160px)/2);
		margin-bottom: 20px;
		color: @textColorTheme;
		.p-page {
			display: flex;
			flex-basis: 0;
			justify-content: flex-start;
			align-items: center;
			flex-grow: 1;
			a {
				color: @textColorTheme;
				text-decoration: none;
				.previous {
					width: 120px;
					height: 40px;
					text-align: center;
					line-height: 40px;
					border-radius: 10px;
					color: #898FA0;
					margin-left: 18px;
					box-shadow: 0 20px 40px 0 rgba(50,50,50,0.1);
					transition: ease-in-out;
					-moz-transition: margin-top .5s;
					-webkit-transition: margin-top .5s;
					-o-transition: margin-top .5s;
				}
				.previous:hover {
					margin-top: -15px;
					cursor: pointer;
				}
			}
		}
		.n-page {
			display: flex;
			flex-basis: 0;
			justify-content: flex-end;
			align-items: center;
			flex-grow: 1;
			a {
				color: @textColorTheme;
				text-decoration: none;
				.next {
					width: 120px;
					height: 40px;
					text-align: center;
					line-height: 40px;
					border-radius: 10px;
					margin-right: 18px;
					color: #898FA0;
					box-shadow: 0 20px 40px 0 rgba(50,50,50,0.1);
					transition: ease-in-out;
					-moz-transition: margin-top .5s;
					-webkit-transition: margin-top .5s;
					-o-transition: margin-top .5s;
					&:hover {
						margin-top: -15px;
						cursor: pointer;
					}
				}
				
			}
		}
	}
}


@media screen and (min-width:600px) {
	.home{
		.main {

		}
	}
}