img {
    vertical-align: middle;
    image-rendering: -webkit-optimize-contrast;
}

@media (max-width: 1580px) {
    :root {
        --font14: 12px;
        --font15: 13px;
        --font16: 14px;
        --font17: 15px;
        --font18: 16px;
        --font19: 17px;
        --font20: 18px;
        --font21: 19px;
        --font22: 20px;
        --font23: 21px;
        --font24: 22px;
        --font25: 23px;
        --font26: 24px;
        --font28: 25px;
        --font29: 24px;
        --font30: 26px;
        --font33: 0.38rem;
        --font40: 0.42rem;
    }
}

* {
    user-select: none;
    box-sizing: border-box;
}

.ulbox {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 1rem;
    margin: 0;
    padding: 0;
}

    .ulbox li {
        background-color: white;
        overflow: hidden;
        display: list-item;
        border-radius: .5rem;
        LIST-STYLE-TYPE: none;
    }

        .ulbox li a {
            border: 0;
            display: auto;
        }

        .ulbox li .imgbox {
            overflow: hidden;
            position: relative;
        }

            .ulbox li .imgbox img {
                width: 100%;
                transition: .5s;
            }

        .ulbox li:hover .imgbox img {
            transform: scale(1.05);
        }

        .ulbox li .con {
            box-sizing: border-box;
            padding: 1.35rem 1.25rem
        }

        .ulbox li h5 {
            color: #333333;
            font-weight: 400;
            font-size: var(--font22);
            display: -webkit-box;
            overflow: hidden;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .ulbox li:hover h5 {
            color: #138cc4;
        }

        .ulbox li .time {
            color: #adadad;
            margin-top: 1rem;
        }