*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Phetsarath OT', Arial, sans-serif;
}
.carderp{
    max-width: 70%;
    
    /* border: 1px solid black; */
    margin: 0 auto;
    padding: 2rem;
    
   
   
    
    
}
.carderp h1{
    text-align: center;
    color: blueviolet;
   font-weight: bold;
   font-size: 40px;
   margin-top: 3rem;
}
.erp{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 50px;
    row-gap: 80px;
    margin-top: 1rem;
  
     /* border: 1px solid black; */
    
    
    
}
.erp-box{
    
    height: 320px;
    /* border: 1px solid black; */
    
}
.erp-box a {
    text-decoration: none;
}
.erp-box img{
    width: 100%;
    height: 210px;
    overflow: hidden;
    object-fit: cover;
    border-radius: 5px;
    

}
.erp-box h2{
    color: black;
}
.erp-k{
    display: flex;
    gap: 10px;
    color: rgb(129, 179, 179);
    margin: .5rem 0;
    
}
.erp-k hr {
    color:rgb(129, 179, 179) ;
    border: 1px solid rgb(129, 179, 179);
    height: 18px;
}
.erp-k h4 {
    color: blueviolet;
}
.erp-box img:hover{
     box-shadow: 0 0px 10px brown;
}
/* ປ່ຽນ */

@media (max-width: 1024px) {
    .carderp {
        max-width: 90%;
    }
    .erp {
        grid-template-columns: repeat(2, 1fr); /* ເຫຼືອ 2 ຖັນ */
        gap: 20px;
    }
}

/* ສຳລັບ ມືຖື (ໜ້າຈໍນ້ອຍກວ່າ 768px) */
@media (max-width: 768px) {
    .carderp {
        max-width: 95%;
        padding: 1rem;
    }
    .erp {
        grid-template-columns: 1fr; /* ເຫຼືອ 1 ຖັນ (ລຽງລົງລຸ່ມ) */
        row-gap: 40px;
    }
    .carderp h1 {
        margin-top: 1rem;
    }
    .erp-box {
        min-height: auto; /* ໃຫ້ຄວາມສູງປັບຕາມເນື້ອໃນ */
    }
}