.blogList {
    padding: 32px 0;
}

.blogContent.blogFull {
    position: relative;
    margin-bottom: 32px;
}

.blogContent {
    margin-bottom: 32px;
}

.blogContent img {
    aspect-ratio: 2/1.1;
    width: 100%;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}

.blogFull .blogBg {
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .8));
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}

.blogNB {
    background: #ffab00;
    padding: 0 .5rem;
    color: #172b4d;
    display: inline-flex;
    align-items: center;
    margin-bottom: 32px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}

.blogFull .blogTT {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 24px;
}

.blogFull .blogTitle a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    font-size: 36px;
    margin-bottom: 24px;
}

.blogTitle h2 {
    font-size: 24px;
    font-weight: 600;
    margin-top: 24px;
}

.blogTitle a {
    text-decoration: none;
    color: #172b4d;
}

.blogTitle a:hover {
    color: #6b778c;
}

.blogTitle time {
    color: #6b778c;
    font-size: 14px;
    margin-bottom: 24px;
}

.blogTitle p {
    font-size: 16px;
    margin-bottom: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blogFull .blogTitle time {
    font-size: 16px;
    color: #fff;
}

@media (min-width:992px) {
    .blogList,
    .blogPost,
    .blogPostLQ {
        padding: 64px 0;
    }
    .blogFull .blogTT {
        padding: 64px
    }
}


/* blogPost */

.blogPost {
    padding: 32px 0;
}

.blogPostLink ul {
    padding: 0;
}

.blogPostLink ul li {
    list-style: none;
    display: inline-block;
}

.blogPostLink ul li a {
    text-decoration: none;
    color: #6b778c;
    font-size: 14px;
    font-weight: 500;
}

.blogPostAthour {
    display: flex;
    align-items: center;
}

.blogPostAthour img {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.blogPostContent h1 {
    font-size: 28px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 32px;
}

.blogPostContent img{
  max-width:100%;
  height:auto;
}

.blogPostContent a{
  text-decoration:none;
  color:#ffab00;
}

.blogPostAthour .blogPostName {
    margin-left: 16px;
    color: #6b778c;
}

.blogPostAthour .blogPostName h5 {
    font-weight: 600;
    font-size: 18px;
}

.blogPostAthour .blogPostName span {
    font-size: 14px;
}

.BlogPostAthorLink {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
}

.BlogPostAthorLink ul {
    padding: 0;
    margin: 0;
}

.BlogPostAthorLink ul li {
    list-style: none;
    display: inline-block;
    margin: 5px;
}

.BlogPostAthorLink ul li img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: .5;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    width: 24px;
    height: 24px;
}

.BlogPostAthorLink ul li img:hover {
    -webkit-filter: none;
    filter: none;
    opacity: 1;
}

.blogPostLQ {
    padding: 32px 0;
}

.blogPostBtn {
    text-align: center;
    padding: 64px 0;
}

.blogPostBtn a {
    color: #fff;
    text-decoration: none;
    transition: all .5s;
    padding: 5px 16px;
    display: inline-flex;
    background: #ffab00;
    border: 1px solid #dfe1e6;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
}

.blogPostBtn a:hover {
    color: #6b778c;
}