@charset "utf-8";

/* ===== portfolio 게시판 스킨 (다크 테마 + 갤러리) ===== */
/* request 스킨 공통 스타일 import */
@import url("../request/style.css");

/* ===== 갤러리 그리드 ===== */
.bo_gallery_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(clamp(14rem, 15.625vw, 18.75rem), 1fr));
    gap: clamp(1rem, 1.5625vw, 1.875rem);
}

.bo_gallery_item {
    position: relative;
    border-radius: clamp(0.5rem, 0.625vw, 0.75rem);
    overflow: hidden;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    transition: border-color 0.3s ease;
}

.bo_gallery_item:hover {
    border-color: rgba(255, 255, 255, 0.15);
}

.bo_gallery_item .td_chk {
    position: absolute;
    top: clamp(0.5rem, 0.625vw, 0.75rem);
    left: clamp(0.5rem, 0.625vw, 0.75rem);
    z-index: 2;
}

.bo_gallery_link {
    display: block;
    color: inherit;
}

.bo_gallery_link:hover {
    text-decoration: none;
}

.bo_gallery_thumb {
    position: relative;
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

.bo_gallery_thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.85);
    transition: all 0.4s ease;
}

.bo_gallery_item:hover .bo_gallery_thumb img {
    filter: brightness(1);
    transform: scale(1.03);
}

.bo_gallery_info {
    padding: clamp(0.875rem, 1.0417vw, 1.25rem);
}

.bo_gallery_info .bo_cate_link {
    margin-bottom: clamp(0.375rem, 0.4167vw, 0.5rem);
}

.bo_gallery_title {
    font-size: clamp(0.9375rem, 0.9375vw, 1.125rem);
    color: rgba(255, 255, 255, 0.85);
    font-weight: 500;
    line-height: 1.4;
    margin: 0 0 clamp(0.375rem, 0.4167vw, 0.5rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bo_gallery_meta {
    font-size: clamp(0.8125rem, 0.7292vw, 0.875rem);
    color: rgba(255, 255, 255, 0.3);
}

/* 반응형 */
@media screen and (max-width: 768px) {
    .bo_gallery_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: clamp(0.5rem, 0.625vw, 0.75rem);
    }
}

@media screen and (max-width: 480px) {
    .bo_gallery_grid {
        grid-template-columns: 1fr;
    }
}