.grid_list {
    display: grid;
    grid-template-columns: var(--layout-room-grid-template-columns-sm);
    grid-gap: var(--layout-room-grid-gap-sm);
    grid-column-gap: var(--layout-room-grid-gap-live-sm);
    grid-template-rows: var(--layout-room-grid-template-rows-sm);

    box-sizing: border-box;
}

.list-box-margin {
    margin: 0 0 16px 0;
}

.live_grid_list_sm {
    display: grid;
    grid-template-columns: var(--layout-grid-template-columns-sm);
    grid-gap: var(--layout-grid-gap-sm);
    grid-column-gap: var(--layout-grid-gap-live-sm);
    grid-template-rows: var(--layout-grid-template-rows-sm);

    /* 有的地方（父级）是固定的，会导致超出 */
    /*grid-template-columns: repeat(3, 14.5vw );*/
    /*grid-gap: 1.75vw;*/
    /*grid-column-gap:2.29vw;*/
    /*grid-template-rows: 23.8vh;*/
}
.live_grid_list_sm .list-box{
    height: var(--layout-grid-template-rows-sm);
}
.grid_list .list-box{
    height: var(--layout-room-grid-template-rows-sm);
    box-shadow: 0 4px 10px 0 #0000001A;
}
.grid_list .list-box .box-top img{
    height: var(--layout-room-live-list-item-img-height-sm);
}
.grid_list .list-box .box-bottom {
    padding: 6px 12px;
    gap: 4px;
}

.live_grid_list{
    display: grid;
    grid-template-columns: var(--layout-grid-template-columns);
    grid-gap: var(--layout-grid-gap);
    grid-column-gap: var(--layout-grid-gap-live);
    grid-template-rows: var(--layout-grid-template-rows);
}
.live_grid_list .box-top img {
    height: var(--layout-live-list-item-img-height);
}
.live_grid_list .list-box {
    height: var(--layout-grid-template-rows);
}