@media screen and (max-width: 576px) {
    #recommendArea {
        padding: 2% 0%;
    }
}

@media screen and (min-width: 576px) {
    #recommendArea {
        padding: 2% 10%;
    }
}

#the404 {
    color: #367f85;
    font-size: 200px;
    font-weight: bold;
}

#desc {
    color: black;
    font-size: 50px;
    font-weight: bold;
}

#desc2 {
    color: black;
    font-size: 30px;
}

#btn_back {
    margin: 2%;
    padding: 4px 40px;
    color: white;
    background-color: #367f85;
    font-weight: bold;
    border: 1px solid #367f85;
    border-radius: 5px;
}

.hrMain {
    opacity: 1;
}

.recommendClick {
    text-decoration: none;
    color: black;
}

.recommendClick:hover {
    text-decoration: underline;
}

.recommendClick:hover .recommendImg{
    transform: scale(1.05);
}

.recommendImg {
    width: 100%;
    object-fit: cover;
    transition: transform 0.3s ease; 
}