section
{
	header
	{
		h1
		{
			font-size: 24px;
			font-weight: 700;
			line-height: 36px; /* 150% */
			letter-spacing: 2.16px;
			color:$main-color;
			margin-bottom:25px;
		}
		p
		{
			font-size: 16px;
			font-weight: 400;
			line-height: 24px; /* 150% */
			letter-spacing: 1.44px;
			color:$text-color;
			margin-bottom:80px;
		}
	}
	#article-list
	{
		article
		{
			margin-bottom:40px;
			picture
			{
				display: block;
				margin-bottom:20px;
				img
				{
					display: block;
					width: 100%;
					transition-duration:0.5s;
					&:hover
					{
						opacity: .5;
					}
				}
			}
			time
			{
				font-size: 15px;
				font-weight: 500;
				line-height: 24px; /* 150% */
				letter-spacing: 1.44px;
				color:rgba(0, 45, 94, 0.50);
				display: block;
				margin-bottom:20px;
			}
			h2
			{
				margin-bottom:20px;
				a
				{
					color:$main-color;
					font-size: 24px;
					font-weight: 700;
					line-height: 36px; /* 150% */
					letter-spacing: 2.16px;
					transition-duration:0.5s;
					&:hover
					{
						color:$text-color;
					}
				}
			}
			p
			{
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				overflow: hidden;

				font-size: 16px;
				color:$text-color;
				font-weight: 400;
				line-height: 24px; /* 150% */
				letter-spacing: 1.44px;
				margin-bottom:20px;
			}
			.more
			{
				display: flex;
				a
				{
					display: flex;
					align-items:center;
					padding:11px 48px;
					border-radius: 50px;
					color:#fff;
					background-color: $main-color;
					border:1px solid $main-color;
					transition-duration:0.5s;
					i
					{
						transition-duration:0.5s;
						width: 22px;
						height: 22px;
						background-color: #fff;
						border-radius: 100%;
						color:$main-color;
						margin-left: 10px;
						text-align: center;
						line-height: 22px;
					}
					&:hover
					{
						background-color: #fff;
						color:$main-color;
						i
						{
							background-color: $main-color;
							color:#fff;
						}
					}
				}
			}
		}
		@media(min-width:768px)
		{
			display: flex;
      flex-wrap:wrap;
			article
			{
				width: calc(92% / 3 );
				margin:2%;
				&:nth-child(3n)
				{
					margin-right: 0px;
				}
				&:nth-child(3n + 1)
				{
					margin-left: 0px;
				}
			}
		}
		@media(max-width:767px)
		{
			article
			{
				picture
				{
					margin-bottom:10px;
				}
				time
				{
					margin-bottom:5px;
				}
				h2
				{
					margin-bottom:5px;
					a
					{
						font-size: 16px;
						font-weight: 700;
						line-height: 24px; /* 150% */
						letter-spacing: 1.44px;
					}
				}
				p
				{
					margin-bottom:5px;
				}
				.more
				{
					a
					{
						font-size: 13px;
						font-style: normal;
						line-height: 20px; /* 153.846% */
						padding:6px 16px;
						i
						{
							font-size:6px;
							width: 12px;
							height:12px;
							line-height: 12px;
						}
					}
				}
			}
		}
	}
}