@charset "utf-8";


/* 변경 사유(2026-10-11): 아이콘 PNG → SVG 교체(고해상도 화면 흐림 방지). 대상: bz_works.css(이 파일이 바로 뒤에 로드된다).
   원본 PNG 는 그대로 두고 같은 폴더에 같은 이름의 .svg 를 추가했다. 퍼블리셔 원본 CSS 는 수정하지 않고 같은 선택자·같은 @media 로
   background-image(배경 외 속성은 그 속성)만 .svg 로 덮는다. 위치·크기 선언은 원본 그대로다.
   이 블록은 파일 맨 앞에 둔다 — 아래쪽 기존 프로젝트 오버라이드가 계속 이기도록(동일 특이성이면 뒤가 이김).
   3D·그림자·반투명 그림(AI 공 아이콘, 플레이어 버튼, 파일 형식 로고 등)은 벡터로 옮기면 품질이 떨어져 PNG 를 유지한다.
   SVG 대부분은 원본 PNG 를 추적해 픽셀 비교로 맞췄고, 툴바 선 아이콘·점선으로 깨진 원형 아이콘은 손으로 다시 그렸다.
   순서 보존(2026-10-11 보정): 블록이 원본보다 뒤에 로드되므로, 원본에서 대상 규칙을 이기던 뒤쪽 규칙(반응형 background:none 등)도
   같은 순서로 이 블록에 다시 적는다(background-image 만). 원본과 같은 순서라 결과는 원본과 같고 그림만 .svg 다. */
.bz_workspace .bz_main .bz_aside > ul > li.bz_document_menu > .bz_folder_open{background-image:url(../images/workspace/ico_aside_arrow_down.svg);}
.bz_workspace .bz_main .bz_aside > ul > li.bz_document_menu.bz_open > .bz_folder_open{background-image:url(../images/workspace/ico_aside_arrow_up.svg);}
.bz_workspace .bz_main .bz_aside > ul > li.bz_document_menu > .bz_folder_add{background-image:url(../images/workspace/ico_folder_plus.svg);}
.bz_workspace .bz_main .bz_aside > ul > li > .bz_folder li{background-image:url(../images/workspace/ico_down_folder.svg);}
.bz_workspace .bz_main .bz_conts .bz_fast_create ul li .bz_get_document span{background-image:url(../images/workspace/ico_file.svg);}
.bz_workspace .bz_main .bz_conts .bz_fast_create ul li .bz_create_folder span{background-image:url(../images/workspace/ico_folder.svg);}
.bz_workspace .bz_main .bz_drive .bz_drive_top .bz_drive_title .bz_drive_path span{background-image:url(../images/workspace/ico_my_drive_top_folder.svg);}
.bz_workspace .bz_main .bz_drive .bz_drive_top .bz_drive_title .bz_drive_path span::after{background-image:url(../images/workspace/ico_my_drive_path_arrow.svg);}
.bz_workspace .bz_main .bz_drive .bz_drive_top .bz_drive_search button{background-image:url(../images/workspace/ico_my_drive_top_search.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_checkbox .bz_drive_all_checkbox span{background-image:url(../images/workspace/check_box.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_checkbox .bz_drive_all_checkbox input:checked ~ span{background-image:url(../images/workspace/checked_box.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_checkbox .bz_drive_view_type.recently span{background-image:url(../images/workspace/ico_clock.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_checkbox .bz_drive_view_type.creator span{background-image:url(../images/workspace/ico_people.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_checkbox .bz_drive_view_type.bookmark span{background-image:url(../images/workspace/ico_star.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_select > span{background-image:url(../images/workspace/ico_select_arrow.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_select.on > span{background-image:url(../images/workspace/ico_select_arrow02.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_select > ul li.on button::after{background-image:url(../images/workspace/ico_selected.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_sort .bz_drive_sort_box{background-image:url(../images/workspace/ico_sort_box_off.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_sort .bz_drive_sort_list{background-image:url(../images/workspace/ico_sort_list_off.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_sort .bz_drive_sort_box.on{background-image:url(../images/workspace/ico_sort_box.svg);}
.bz_workspace .bz_main .bz_drive_list .bz_drive_list_top .bz_drive_sorting .bz_drive_sort .bz_drive_sort_list.on{background-image:url(../images/workspace/ico_sort_list.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > label span{background-image:url(../images/workspace/check_box.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > label input:checked ~ span{background-image:url(../images/workspace/checked_box.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > label input:checked ~ span{background-image:url(../images/workspace/checked_box.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_bookmark{background-image:url(../images/workspace/ico_bookmark_off.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_bookmark.on{background-image:url(../images/workspace/ico_bookmark.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_del{background-image:url(../images/workspace/ico_my_drive_del.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_down{background-image:url(../images/workspace/ico_my_drive_down.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_restoration{background-image:url(../images/workspace/ico_my_drive_restoration.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_adit{background-image:url(../images/workspace/ico_my_drive_adit.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_ok{background-image:url(../images/workspace/ico_my_drive_ok.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_no{background-image:url(../images/workspace/ico_my_drive_del.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_del:hover{background-image:url(../images/workspace/ico_my_drive_del_hover.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_down:hover{background-image:url(../images/workspace/ico_my_drive_down_hover.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_restoration:hover{background-image:url(../images/workspace/ico_my_drive_restoration_hover.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_adit:hover{background-image:url(../images/workspace/ico_my_drive_adit_hover.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_ok:hover{background-image:url(../images/workspace/ico_my_drive_ok_hover.svg);}
.bz_workspace .bz_main .bz_drive_list > ul > li > .bz_drive_list_buttons .bz_drive_list_no:hover{background-image:url(../images/workspace/ico_my_drive_del_hover.svg);}
@media (max-width: 760px){
  .bz_workspace .bz_main .bz_conts .bz_fast_create ul li .bz_create span{background-image:none;}
  .bz_workspace .bz_main .bz_conts .bz_fast_create ul li .bz_create_folder span{background-image:none;}
  .bz_workspace .bz_main .bz_conts .bz_fast_create ul li .bz_get_document span{background-image:none;}
}
/* SVG 아이콘 교체 블록 끝 */

/*
 * bz_works_react.css — React 어댑테이션 브리지 (퍼블리싱 bz_works.css 보완)
 *
 * 변경 사유(2026-06-23): 퍼블리싱 bz_works.css의 드라이브 카드 썸네일 규칙은
 *   .bz_drive_list > ul > li > a > img / li > img (TAG=img) 기준이다.
 *   - 데스크톱 크기:  li > a > img { width:100% }            (837)
 *   - 라인뷰 숨김:    .view_type_list ... li > a > img {none}  (1086)  ← class .bz_drive_list_thumbnail 도 포함(직접자식 한정)
 *   - ≤760 숨김:      li > a > img, li > img { display:none }  (1572)
 *   그러나 "문서 카드"의 미리보기는 슬라이드/iframe을 렌더하는 <div class="bz_drive_list_thumbnail">라
 *   tag 셀렉터가 닿지 않아 모바일/라인뷰에서 썸네일이 숨지 않고 거대하게 남는다(반응형 깨짐).
 *   → div 썸네일 전용으로 동일 동작(데스크톱 크기 + 라인뷰/≤760 숨김)을 브리지한다.
 *   (폴더/새폴더 카드는 실제 <img>라 퍼블리싱 규칙이 그대로 적용됨 — 인라인 스타일만 제거)
 */

/* 데스크톱 박스뷰: img의 width:100% + 자연 높이를 div(aspect-ratio)로 대체 */
.bz_workspace .bz_main .bz_drive_list > ul > li a div.bz_drive_list_thumbnail {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background-color: #ffffff;
}

/* 라인뷰(view_type_list)에서 div 썸네일 숨김 (퍼블리싱은 tag 기준이라 div 미적용) */
.bz_workspace .bz_main .bz_drive_list.view_type_list > ul > li a div.bz_drive_list_thumbnail {
  display: none !important;
}

/* ≤760 모바일에서 div 썸네일 숨김 → 카드가 컴팩트 행으로 (퍼블리싱 의도와 일치) */
@media (max-width: 760px) {
  .bz_workspace .bz_main .bz_drive_list > ul > li a div.bz_drive_list_thumbnail {
    display: none !important;
  }
}

/*
 * 변경 사유(2026-06-25): 카드 제목의 파일 아이콘(i_word/i_pdf 등)이 텍스트와 분리되어
 *   자기 줄로 떨어지는 문제 — 아이콘 1줄 + 텍스트 클램프 2줄 = 최대 3줄로 보임.
 *   원인: Tailwind preflight의 `img{display:block}`이, line-clamp용으로
 *   `display:-webkit-box; -webkit-box-orient:vertical`인 strong 안에서 아이콘 img를
 *   블록 요소로 만들어 줄바꿈시킴. 원본 퍼블리싱은 Tailwind가 없어 img가 기본 inline이라
 *   아이콘이 텍스트 첫 줄에 붙고 정상적으로 2줄로 끊긴다.
 *   → 제목 아이콘만 inline(+baseline)으로 되돌려 퍼블리싱과 동일 동작 복원.
 *   (썸네일 등 다른 img는 영향 없음 — 이 셀렉터는 제목 strong 직계 img만 한정)
 */
.bz_workspace
  .bz_main
  .bz_drive_list
  > ul
  > li
  .bz_drive_list_content
  .bz_drive_list_title
  strong
  > img {
  display: inline;
  /* 변경 사유(2026-06): baseline 정렬 시 아이콘 하단이 첫 줄 베이스라인에 붙어
     아이콘이 위로 떠오르고 글자 줄이 아이콘 하단에 맞춰져 보임.
     아이콘 높이(1.4666em)가 줄 높이와 같으므로 top으로 첫 줄 라인박스에 맞춤
     (display:inline 유지 → 2줄 line-clamp 그대로 동작). */
  vertical-align: top;
}
