.moon-list[data-v-344bdff5] {
    grid-gap: .2rem .1rem;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(var(--col-num), minmax(2rem, 1fr));
    width: 100%
}

.moon-row-list[data-v-344bdff5] {
    grid-gap: .2rem;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 1fr;
    width: 100%
}

.moon-row-list .moon-list-item[data-v-344bdff5] {
    width: 100%
}

.column-title[data-v-344bdff5] {
    color: #878787;
    font-size: .26rem;
    padding-bottom: .8rem;
    padding-top: .6rem
}

.column-title h2[data-v-344bdff5] {
    color: var(--tv-text-1);
    font-size: .42rem;
    font-weight: 700
}

@media screen and (min-width:767.98px) and (max-width:999.98px) {
    .moon-list[data-v-344bdff5] {
        grid-template-columns: repeat(4, minmax(2rem, 1fr))
    }

    .moon-list.col-2[data-v-344bdff5] {
        grid-template-columns: repeat(3, minmax(2rem, 1fr))
    }
}

@media screen and (min-width:1000px) and (max-width:1199.98px) {
    .moon-list[data-v-344bdff5] {
        grid-template-columns: repeat(5, minmax(2rem, 1fr))
    }

    .moon-list.col-2[data-v-344bdff5] {
        grid-template-columns: repeat(4, minmax(2rem, 1fr))
    }
}

@media screen and (min-width:1200px) {
    .moon-list[data-v-344bdff5] {
        grid-template-columns: repeat(6, minmax(2rem, 1fr))
    }

    .moon-list.col-2[data-v-344bdff5] {
        grid-template-columns: repeat(5, minmax(2rem, 1fr))
    }
}