.modal-gallery {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gallery-view {
    width: 100%;
    gap: var(--space2);
    display: flex;
    flex-direction: column;
}

.gallery-navi {
    position: sticky;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: var(--space2);
    gap: var(--space3);
    z-index: 1;
    background-color: var(--main50-color);
}

/* 左右ボタン */
.gallery-button {
    width: var(--space4);
    height: var(--space4);
    color: var(--content-color);
    font-size: var(--space3);
}

/* インジケーター */
.gallery-indicators {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space3);
}

.indicator {
    width: var(--space3);
    height: var(--space3);
    background: var(--content-color);
    border-radius: 50%;
    transition: background-color var(--move-anim-time) ease;
}

.indicator.active {
    background: var(--accent-color);
}

.gallery-media {
    position: relative;
    width: 100%;
}

.gallery-image-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    touch-action: pan-y;
}

.gallery-image-wrapper a {
    display: block;
    transition: transform var(--move-anim-time) ease;
}

.gallery-image-wrapper img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    .gallery-view {
        flex-direction: column-reverse;
    }
    .gallery-navi {
        position: unset;
    }
}