html {
    overflow-x: hidden;
    max-width: 100%;
}

.ad-slot {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

@media (max-width: 767px) {
    body {
        overflow-x: hidden;
        max-width: 100%;
    }

    main {
        max-width: 100%;
        overflow-x: clip;
    }

    .ad-slot {
        display: flex;
        justify-content: flex-end;
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        margin-left: calc(50% - 50vw + 10px);
        margin-right: calc(50% - 50vw + 10px);
        overflow: hidden;
    }

    .ad-slot iframe,
    .ad-slot ins,
    .ad-slot img,
    .ad-slot > * {
        max-width: 100% !important;
    }

    .play_list,
    .other_play_list .grid,
    .search_data_box {
        min-width: 0;
        width: 100%;
    }

    .play_list > *,
    .other_play_list .grid > *,
    .search_data_box > * {
        min-width: 0;
        max-width: 100%;
    }

    .grid > * {
        min-width: 0;
    }
}

@media (max-width: 640px) {
    .shadow-\[6px_6px_0px_0px_\#1A1A1A\] {
        box-shadow: 4px 4px 0px 0px var(--mmm-text);
    }
    .shadow-\[8px_8px_0px_0px_\#1A1A1A\] {
        box-shadow: 4px 4px 0px 0px var(--mmm-text);
    }
}
@media (min-width: 1024px) {
    .hover\:-translate-y-1:hover {
        transform: translateY(-8px);
    }
}