.list__blog-vp{
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 225px);
 }
.item__blog-vp-home:nth-child(1){
  grid-column: 1/3;
  grid-row: 1/3;
}
.item__blog-vp-home:nth-child(2){
  grid-column: 3/5;
  grid-row: 1/2;
}
.item__blog-vp-home:nth-child(3){
  grid-column: 3/4;
  grid-row: 2/3;
}
.item__blog-vp-home:nth-child(4){
  grid-column: 4/5;
  grid-row: 2/3;
}
.title__item-blog-vp-home h2{
  z-index: 1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.title__item-blog-vp-home h2 a{
  color: var(--color-primary);
  font-size: var(--font-size-body);
}
.title__item-blog-vp-home h2 a:hover{ 
  text-decoration: underline;
  color: var(--color-primary);
}
.desc__item-blog-vp-home p{
  color: var(--color-primary);
  padding-bottom: 0;
  margin-bottom: 20px;
  font-size: calc(var(--font-size-body) - 2px);
  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.item__blog-vp-home:nth-child(1) .desc__item-blog-vp-home p{
  margin-bottom: 40px;
  font-size: var(--font-size-body) ;
}
.desc__item-blog-vp-home:nth-child(3)
.desc__item-blog-vp-home:nth-child(4){
  font-size: calc(var(--font-size-body) - 2px);
}
.view__detail-listblog{
  font-size: calc(var(--font-size-body) + 2px);
  color: var(--color-2);
}
.view__detail-listblog:hover{
  color: #00ea65;
  text-decoration: underline;
}
.img__blog-vp-home{
  background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.title__item-blog-vp-home{
  padding: 20px;
}
.overlay-7::after{
  content: '';
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--color-second);
  position: absolute;
  opacity: .7;
}
.content__show-blog-vp-home{
  padding: 25px;
  top: 100%;
  transition: .4s;
}
.title__item-blog-vp-home.showtitle__item-blog-vp-home{
  padding: 0;
  margin-bottom: 20px;
}
.content__show-blog-vp-home::after{
  content: '';
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  background: var(--color-second);
  opacity: .7;
}
.desc__item-blog-vp-home,
.view__detail-listblog,
.title__item-blog-vp-home.showtitle__item-blog-vp-home{
  z-index: 1;
}
.item__blog-vp-home{
  margin-bottom: 30px;
  overflow: hidden;
}
.item__blog-vp-home:hover .content__show-blog-vp-home{
  top: 0;
}
.item__blog-vp-home:hover .hiddentitle__item-blog-vp-home{
  display: none;
}
@media (min-width: 768px){
  .d-md-grid{
    display: grid;
  }
.item__blog-vp-home:nth-child(1){
  margin-right: 15px;
}
.item__blog-vp-home:nth-child(2){
  margin-bottom: 15px;
}
.item__blog-vp-home:nth-child(3){
  margin-right: 7.5px;
}
.item__blog-vp-home:nth-child(4){
  margin-left: 7.5px;
}
.item__blog-vp-home:nth-child(1) .content__show-blog-vp-home{
  padding: 8%;
}
.item__blog-vp-home:nth-child(1) .title__item-blog-vp-home h2 a{ 
  font-size: calc(var(--font-size-body) + 6px);
}
.item__blog-vp-home{
  margin-bottom: 0;
}
}