#body
{
  
  section
  {
    h1
    {
      position: relative;
      text-align: center;
      color:$main-color;
      font-size: 24px;
      font-weight: 400;
      line-height: 36px;
      letter-spacing: 2.4px;
      margin-bottom:50px;
      &::after
      {
        content:' ';
        width: 21px;
        height:15px;
        background-color: #9CCCD3;
        border-radius: 100%;
        position: absolute;
        top:-14px;
        left:calc(50% - 10px);
      }
    }
    #knowledge-menu
    {
      h2
      {
        position: relative;
        color:$main-color;
        font-size: 20px;
        font-weight: 400;
        line-height: 30px;
        letter-spacing: 2px;
        padding-left:30px;
        margin-bottom:35px;
        &::after
        {
          content:' ';
          width: 21px;
          height:15px;
          background-color: #9CCCD3;
          border-radius: 100%;
          position: absolute;
          top:calc(50% - 7px);
          left:0;
        }
      }

      ul
      {
        li
        {
          margin-bottom:20px;
          a
          {
            display: block;
            border:1px solid $main-color;
            border-radius: 80px;
            padding:10px 0 10px 40px;
            font-size: 16px;
            line-height: 24px;
            letter-spacing: 1.6px;
            color:#C4BCAC;
            transition-duration:.5s;
            &:hover
            {
              color:$bg-color;
              background-color: $main-color;
            }
          }
          &.active
          {
            a
            {
              color:$bg-color;
              background-color: $main-color;
            }
          }
        }
      }
    }
    .article-list
		{
      display: flex;
			flex-wrap:wrap;
			article
			{
				box-shadow: 0px 4px 9px 0px rgba(91, 63, 41, 0.30);
				border-radius: 20px;
				overflow: hidden;
				background-color: $bg-color;
				picture
				{
					width: 100%;
					display: block;
					img
					{
						display: block;
						width: 100%;
						object-fit: cover;
					}
				}
				>div
				{
					padding:25px;
					.info
					{
						margin-bottom:10px;
						display: flex;
						font-size: 16px;
						letter-spacing: 1.6px;
						color:#C4BCAC;
						justify-content:space-between;
						a
						{
							color:#C4BCAC;
							transition-duration:.5s;
							&:hover
							{
								color:$main-color;
							}
						}
					}
					h3
					{
						margin-bottom:10px;
						a
						{
							font-size: 24px;
							letter-spacing: 2.4px;
							color:$main-color;
							line-height: 150%;
						}
					}
					p
					{
						font-size: 16px;
						letter-spacing: 1.6px;
						line-height: 24px;
						height:48px;
						color:#C4BCAC;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						overflow: hidden;
					}
				}
			}
			@media(min-width:768px)
			{
				article
				{
					width: calc(90% / 3);
					margin-left:2.5%;
					margin-right:2.5%;
					margin-bottom:40px;
					&:nth-child(3n)
					{
						margin-right:0;
					}
					&:nth-child(3n + 1)
					{
						margin-left: 0;
					}
				}
			}

			@media(max-width:767px)
			{
				article
				{
					width: calc(50% - 10px);
					margin-left:10px;
					margin-right:10px;
					margin-bottom:20px;
					&:nth-child(2n)
					{
						margin-right:0;
					}
					&:nth-child(2n + 1)
					{
						margin-left: 0;
					}
				}
			}
		}
    @media(min-width:1148px)
    {
      display: flex;
      flex-wrap:wrap;
      justify-content:space-between;
      h1
      {
        width: 100%;
      }
      #knowledge-menu
      {
        width: 200px;
      }
      .article-list
      {
        padding-left:40px;
        width: calc(100% - 200px);
      }
    }
    @media(max-width:767px)
    {
      .article-list
      {
        article
        {
          >div
          {
            .info
            {
              display: block;
              a,time
              {
                display: block;
              }
            }
          }
          
        }
      }
    }
  }
}