*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Pretendard, sans-serif;
    background:#ffffff;
    color:#111;
}

.container{
    display:flex;
    height:100vh;
}

/* ===========================
   Sidebar
=========================== */

.sidebar{
    width:300px;
    background:#ffffff;
    border-right:1px solid #ddd;
    padding:50px 30px;
    overflow-y:auto;
}

h1{
    font-size:24px;
    font-weight:600;
    margin-bottom:55px;
    letter-spacing:-0.02em;
}

/* ===========================
   Category Tree
=========================== */

#categoryTree ul{
    list-style:none;
    margin:0;
    padding:0;
}

/* 하위 메뉴는 처음에 닫힘 */
#categoryTree ul ul{
    display:none;
    margin-left:20px;
    padding-left:8px;
}

/* 최상위 메뉴 */
#categoryTree > ul{
    display:block;
}

/* 폴더 */
#categoryTree .folder{
    display:flex;
    align-items:center;
    gap:7px;

    padding:7px 0;

    font-size:16px;
    font-weight:500;

    cursor:pointer;

    transition:color .2s;
}

#categoryTree .folder:hover{
    color:#666;
}

/* 화살표 */
#categoryTree .arrow{
    display:inline-block;

    width:12px;

    font-size:10px;
    color:#777;

    transition:transform .25s;
}

/* 펼쳐졌을 때 화살표 */
#categoryTree .arrow.open{
    transform:rotate(90deg);
}

/* 파일 / 최하위 카테고리 */
#categoryTree .file{
    padding:6px 0;

    font-size:14px;
    font-weight:400;

    color:#444;

    cursor:pointer;

    transition:color .2s;
}

#categoryTree .file:hover{
    color:#000;
}

/* 선택된 카테고리 */
#categoryTree .file.active{
    color:#ff4ea0;
}

.main{

    margin-top:26px;

    font-size:16px;
    font-weight:500;

    padding-left:0;
}

.active{
    color:#444;
}

/* ===========================
   Content
=========================== */

.content{
    flex:1;
    padding:50px 70px;

    background:#f3f3f3;
}

.content h2{

    font-size:22px;
    font-weight:500;
}

.content p{

    font-size:14px;
    color:#888;
}

/* ===========================
   Gallery
=========================== */

.gallery{

    display:grid;

    grid-template-columns:repeat(5, 1fr);

    gap:24px;

    margin-top:30px;

}


/* 작품 */

.gallery-item{

    cursor:pointer;

}


/* 이미지 */

.work-image{

    width:100%;

    aspect-ratio:1 / 1;

    overflow:hidden;

    background:#e9e9e9;

}


.work-image img{

    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    transition:transform .3s ease;

}


.gallery-item:hover .work-image img{

    transform:scale(1.03);

}


/* 제목 */

.work-title{

    margin-top:10px;

    font-size:13px;

    font-weight:400;

    color:#444;

}


/* 작품이 없을 때 */

.empty-message{

    margin-top:30px;

    font-size:14px;

    color:#999;

}
.sidebar {
    position: relative;
}

.admin-login {
    position: absolute;
    left: 30px;
    bottom: 30px;

    font-size: 11px;
    font-weight: 400;
    color: #aaa;

    text-decoration: none;

    transition: 0.2s;
}

.admin-login:hover {
    color: #222;
}

/* 작품 상세 */

.work-detail {
    width: 100%;
}

.back-to-gallery {
    margin-bottom: 25px;

    border: none;
    background: none;

    color: #999;

    cursor: pointer;

    font-size: 14px;
}

.back-to-gallery:hover {
    color: #222;
}

.detail-image {
    width: 100%;
    max-width: 900px;

    margin-bottom: 30px;
}

.detail-image img {
    display: block;

    width: 100%;
    height: auto;
}

.detail-info h2 {
    margin: 0 0 15px;

    font-size: 24px;
    font-weight: 500;
}

.detail-description {
    margin: 0;

    color: #666;

    font-size: 14px;

    line-height: 1.8;

    white-space: pre-line;
}

.empty-description {
    color: #aaa;
}
h1 a.admin-logo {
    color: #222 !important;
    text-decoration: none !important;
}

h1 a.admin-logo:visited {
    color: #222 !important;
    text-decoration: none !important;
}

h1 a.admin-logo:hover {
    color: #222 !important;
    text-decoration: none !important;
}