/* 갤러리 페이지 전용 스타일 */

.gallery-card {
    cursor: pointer;
}

.gallery-card .top {
    position: relative !important;
    overflow: hidden;
}

.gallery-card .p-num {
    position: absolute !important;
    right: 10px !important;
    bottom: 10px !important;
    width: 80px;
    height: 80px;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.gallery-card .p-num p {
    color: #fff !important;
    font-size: 24px !important;
    font-weight: bold;
    margin: 0;
    line-height: 1;
}

/* 갤러리 컨테이너 및 컬럼 레이아웃 수정 */
#gallery-container {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 30px; /* 컬럼 사이 30px 간격 */
    max-width: 1260px; /* 3 x 400px + 2 x 30px = 1260px */
    margin: 0 auto;
}

#gallery-container > div {
    flex: 0 0 400px; /* 각 컬럼을 정확히 400px로 고정 */
    width: 400px;
    min-height: 1px; /* flexbox 버그 방지 */
}

/* pnoti-wrap 크기 강제 적용 */
.gallery-card.pnoti-wrap {
    width: 400px !important;
    max-width: 400px;
    min-width: 400px;
    box-sizing: border-box;
}

.gallery-card.pnoti-wrap .top {
    width: 400px !important;
}

.gallery-card.pnoti-wrap .bot {
    width: 400px !important;
}

/* 갤러리 이미지 크기 제한 */
.gallery-card.pnoti-wrap .top img {
    width: 400px !important;
    max-width: 400px;
    height: auto;
    object-fit: cover;
    display: block;
}

.no-results {
    text-align: center;
    padding: 60px 0;
    color: #666;
    width: 400px;
}

/* 갤러리 카드 제목 길이 제한 */
.gallery-card .bot-top h5 {
    max-width: 250px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* 갤러리 모달 중앙 정렬 */
#gallery-modal.popup {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 50 !important;
    max-width: 90vw;
    max-height: 90vh;
    overflow-y: auto;
}