@charset "UTF-8";

.snapshot-page .case-cover-panel { padding-top: 32px; }

.snapshot-page .case-screen-frame {
    width: min(70%, 300px);
    background: transparent;
    border: 0;
    border-radius: 0;
}

.snapshot-page .case-screen-frame picture { display: contents; }

.snapshot-band {
    padding-block: 72px;
    color: #ffffff;
    background: #000000;
    scroll-margin-top: 72px;
}

.snapshot-card {
    padding: 32px;
    color: #000000;
    background: #ffffff;
    border-radius: 16px;
}

.snapshot-card .tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 0;
    margin: 0;
    padding: 0;
}

.snapshot-card .skill-dot-list li { color: #000000; }
.snapshot-card .skill-dot-list li:not(:last-child)::after { color: #707070; }
.snapshot-gallery figure { padding: 12px; }
.snapshot-gallery figure > div { background: #000000; }

@media (max-width: 760px) {
    .snapshot-page .case-screen-frame { width: min(76%, 280px); }
}

@media (max-width: 520px) {
    .snapshot-card { padding: 24px; }
}