li {
    list-style: none;
}
a {
    text-decoration: none;
}
a:hover, a:visited, a:link {
    text-decoration: none;
}
.spot-list-box {
    display:grid;
    grid-template-columns: repeat(3, 1fr); row-gap: 57px; column-gap: 27px;
    padding-bottom: 100px;
}
.spot-title-text {
    margin: 10px 0;
    font-weight: 400; font-size: 16px; color: #222222;
    text-align: center;
}
.spot-image-box {
    max-width: 400px; width: 100%; height: fit-content;
    cursor: pointer;
}
.spot-image-box .image {
    width: 100%; height: 100%;
    aspect-ratio: 7/5; object-fit: cover;
    border-radius: 0 0 0 30px;
}
.spot-image-box .image {
    width: 100%; height: 100%;
    aspect-ratio: 7/5; object-fit: cover;
    border-radius: 0 0 0 30px;
    transition: transform 0.2s;
}
.spot-image-box .image:hover {
    transform: scale(1.1);
}








/*      ########################### Media ######################    */
@media screen and (max-width: 767px) {
    .spot-list-box {
        grid-template-columns: repeat(1, 1fr);
    }
    .spot-image-box {
        max-width: unset;
    }
    .spot-list-box {
        padding-bottom: 38px;
    }
}