.s-title-text-4 {
  font-size: 16px;
  font-weight: 400;
  color: #9b9b9b;
  line-height: 1.5;
  margin-bottom: 45px;
}



@media (min-width: 360px) and (max-width: 767px) {
 .parent-s4 {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(3, auto);
grid-column-gap: 0px;
grid-row-gap: clamp(10px, 10px + 0.42821*(100vw - 360px), 15px);
}
.div-s4-1 { grid-area: 1 / 1 / 2 / 2; }
.div-s4-2 { grid-area: 2 / 1 / 3 / 2; }
.div-s4-3 { grid-area: 3 / 1 / 4 / 2; }
.s-title-h2 h2 {
    font-size: 32px;
    }
    .box-04 { 
        text-align: center;
      }   
}



@media (min-width: 768px) and (max-width: 991px) {
.parent-s4 {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(3, auto);
grid-column-gap: 0px;
grid-row-gap: clamp(15px, 15px + 0.04983*(100vw - 360px), 20px);
}
.div-s4-1 { grid-area: 1 / 1 / 2 / 2; }
.div-s4-2 { grid-area: 2 / 1 / 3 / 2; }
.div-s4-3 { grid-area: 3 / 1 / 4 / 2; }

.box-04 { 
    text-align: center;
  }
}


@media (min-width: 992px) and (max-width: 1199px) {
.parent-s4 {
width: 90%;
margin-left: auto;
margin-right: auto;    
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, auto);
grid-column-gap: 30px;
grid-row-gap: 18px;
}
.div-s4-1 { grid-area: 1 / 1 / 2 / 3; }
.div-s4-2 { grid-area: 2 / 1 / 3 / 2; }
.div-s4-3 { grid-area: 2 / 2 / 3 / 3; }

.box-04 { 
    text-align: center;
  } 
  .s-title-text-4 {
    text-align: center;
}  
}



@media (min-width: 1200px) and (max-width: 1920px) {
.parent-s4 {
width: 90%;
margin-left: auto;
margin-right: auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 30px;
grid-row-gap: 0px;
}
.div-s4-1 { grid-area: 1 / 1 / 2 / 2; }
.div-s4-2 { grid-area: 1 / 2 / 2 / 3; }
.div-s4-3 { grid-area: 1 / 3 / 2 / 4; }

.div-s4-1 {
padding-right: 20%;
} 
.s-title-h2 h2 {
font-size: 32px;
}
}