Files
PM_test/views/main/main.html
2026-06-12 17:14:03 +09:00

3469 lines
187 KiB
HTML

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PROJECT MASTER</title>
<link rel="stylesheet" href="/main/css/style.css">
<link rel="icon" href="/main/img/favicon-pm.ico">
<script>
window.addEventListener('error', function(e) {
fetch('/log-client-error', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
message: e.message,
source: e.filename,
lineno: e.lineno,
colno: e.colno,
stack: e.error ? e.error.stack : null
})
}).catch(err => console.error('Error reporting failed:', err));
});
window.addEventListener('unhandledrejection', function(e) {
fetch('/log-client-error', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
message: 'Unhandled Rejection: ' + (e.reason ? e.reason.message || e.reason : ''),
source: 'unhandledrejection',
lineno: 0,
colno: 0,
stack: e.reason ? e.reason.stack : null
})
}).catch(err => console.error('Error reporting failed:', err));
});
</script>
</head>
<body>
<div class="project-inactive-sign">
<div class="text">프로젝트 비활성화 상태</div>
</div>
<div class="banner-notice-area">
<div class="background"></div>
<div class="content"></div>
</div>
<div class="header">
<div class="left">
<div class="relocate-cover header-title-cover"></div>
<div class="title">
<div class="marquee-track">
<!-- <img class="pm" src="/main/img/header/header-logo-pm.svg"> -->
<div class="pm text">PM</div>
<div class="symbol text">/</div>
<!-- <img class="category" src=""> -->
<div class="category text"></div>
<div class="symbol text">:</div>
<div class="project-name"></div>
</div>
</div>
</div>
<div class="center">
<div class="left wrap">
<div class="menu-add permission-min-sub-master">
<div class="add-btn">
<div class="image"></div>
</div>
</div>
<div class="menu-tab header-scrollbar scroll-container">
<div class="btn overview-btn" id="overview" data-resource-path="/과업개요">
<div class="wrap">
<div class="image icon"></div>
<div class="name-text">과업개요</div>
</div>
</div>
</div>
<div class="scroll-btn scroll-left">
<div class="image"></div>
</div>
<div class="scroll-btn scroll-right">
<div class="image"></div>
</div>
</div>
<div class="right wrap">
<div class="relocate-cover header-right-cover"></div>
<div class="menu-tab">
<div class="btn official-doc-btn" id="official-doc" data-resource-path="/공문">
<div class="wrap">
<div class="image icon"></div>
<div class="name-text">공문</div>
<div class="ai-logo"></div>
</div>
</div>
<div class="btn model-btn" id="model" data-resource-path="/위치기반모델">
<div class="wrap">
<div class="image icon"></div>
<div class="name-text">위치기반모델</div>
</div>
</div>
<div class="btn download-btn" style="display: flex">
<div class="wrap">
<div class="image icon"></div>
<div class="name-text">폴더다운로드</div>
<div class="download-reddot" style="display: none;"></div>
</div>
</div>
</div>
</div>
</div>
<div class="right">
<div class="relocate-cover connected-users-cover"></div>
<div class="connected-users">
<div class="title">접속 인원</div>
<div class="count">0 명</div>
<!-- <div class="image"></div> -->
</div>
</div>
</div>
<!-- 플로팅 버전 컨트롤 박스 관련 코드 -->
<!-- <article class="control-box">
<div class="drag-handle">
<img class="icon" src="/main/img/archive/drag-handle.svg">
</div>
<div class="contents-wrap">
<div class="file-area-mode-btn-wrap btn-wrap">
<button class="file-area-mode-btn btn list" id="list">
<i class="icon"></i>
<div class="text ft-12">
<span class="ft-12">리</span>
<span class="ft-12">스</span>
<span class="ft-12">트</span>
</div>
</button>
<button class="file-area-mode-btn btn grid" id="grid">
<i class="icon"></i>
<div class="text ft-12">
<span class="ft-12">그</span>
<span class="ft-12">리</span>
<span class="ft-12">드</span>
</div>
</button>
<button class="file-area-mode-btn btn map" id="map">
<i class="icon"></i>
<div class="text ft-12">
<span class="ft-12">위</span>
<span class="ft-12">치</span>
<span class="ft-12">보</span>
<span class="ft-12">기</span>
</div>
</button>
</div>
</div>
</article> -->
<div class="archive-main main scrollbar">
<div class="archive-main-left">
<!-- <div class="relocate-cover tree-title-cover"></div> -->
<div class="tree-title selected" data-resource-path="">
<div class="wrap">
<div class="text"></div>
</div>
</div>
<div class="tree-container scrollbar scroll-container" data-resource-path="" tabindex="-1">
<div class="tree-wrap"></div>
<div class="tree-notice notice">
생성된 폴더가 없습니다.
<br><br>
폴더를 생성해주세요.
</div>
</div>
<!-- 아카이브 좌측 영역 고정 버전 컨트롤 박스 관련 코드 -->
<article class="control-box">
<div class="contents-wrap">
<div class="file-area-mode-btn-wrap btn-wrap">
<div class="file-area-mode-btn btn grid" id="grid">
<div class="text ft-14">썸네일</div>
</div>
<div class="file-area-mode-btn btn list" id="list">
<div class="text ft-14">리스트</div>
</div>
<div class="file-area-mode-btn btn map" id="map">
<div class="text ft-14">지도 표시</div>
</div>
</div>
</div>
</article>
</div>
<div class="relocate-cover list-viewer-cover">
<div class="container">
<div class="notice-wrap">
<div class="text">파일을 이동할 폴더를 선택한 뒤, 확인을 눌러주세요.</div>
</div>
<div class="path-wrap">
<div class="path old-path">
<div class="key">기존 폴더 경로</div>
<div class="value">-</div>
</div>
<div class="path new-path">
<div class="key">선택 폴더 경로</div>
<div class="value">-</div>
</div>
</div>
<div class="btn-wrap"></div>
</div>
</div>
<div class="archive-main-center">
<div class="list-container">
<div class="list-wrap list-header" data-resource-path="">
<div class="list-item-wrap">
<div class="list-item">
<div class="wrap list-header-area">
<!-- <div class="type ft-12">종류</div> -->
<div class="name ft-12 sort-asc">파일명</div>
<div class="author ft-12">작성자</div>
<div class="uploader ft-12">등록자</div>
<div class="create-date ft-12">등록일자</div>
<div class="size ft-12">용량</div>
<div class="state ft-12">상태</div>
<div class="memo ft-12">메모</div>
</div>
<div class="wrap control-area">
<div class="thumbnail control-item">
<div class="text-wrap">
<div class="text ft-12">
썸네일 크기
</div>
</div>
<!-- 임시 버튼 -->
<div class="thumb-btn-wrap" style="display:none">
<div class="thumb-btn">썸네일생성</div>
</div>
<div class="input-wrap">
<div class="btn minus">
<div class="image"></div>
<div class="text ft-12">작게</div>
</div>
<div class="slider-input">
<!-- <div class="icon small"></div> -->
<input class="thumbnail-size-slider" type="range" min="-10" max="-1" value="-5" step="1">
<!-- <div class="icon large"></div> -->
</div>
<div class="btn plus">
<div class="image"></div>
<div class="text ft-12">크게</div>
</div>
</div>
</div>
<div class="label-wrap">
<div class="category control-item">
<div class="text-wrap">
<div class="text ft-12">
라벨
</div>
</div>
<div class="radio-btn-wrap">
<div class="radio-btn none">
<div class="radio-wrap">
<input type='radio' name='category' value='none' checked>
<!-- <input type='radio' name='category' value='none'> -->
<div class="ft-12">숨김</div>
</div>
</div>
<div class="radio-btn name">
<div class="radio-wrap">
<input type='radio' name='category' value='name'>
<!-- <input type='radio' name='category' value='name' checked> -->
<div class="ft-12">파일명</div>
</div>
</div>
<div class="radio-btn uploader">
<div class="radio-wrap">
<input type='radio' name='category' value='uploader'>
<div class="ft-12">등록자</div>
</div>
</div>
<div class="radio-btn create-date">
<div class="radio-wrap">
<input type='radio' name='category' value='create-date'>
<div class="ft-12">등록일자</div>
</div>
</div>
<div class="radio-btn size">
<div class="radio-wrap">
<input type='radio' name='category' value='size'>
<div class="ft-12">용량</div>
</div>
</div>
</div>
</div>
<div class="sort control-item">
<div class="text-wrap">
<div class="text ft-12">
순서
</div>
</div>
<div class="radio-btn-wrap">
<div class="radio-btn asc disabled">
<div class="radio-wrap">
<input type='radio' name='sort' value='asc' checked>
<div class="ft-12">오름차순</div>
</div>
</div>
<div class="radio-btn desc disabled">
<div class="radio-wrap">
<input type='radio' name='sort' value='desc'>
<div class="ft-12">내림차순</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="list-wrap list-body scrollbar scroll-container" data-resource-path="" tabindex="-1">
<div class="notification-wrap">
<div class="text"></div>
</div>
<div class="list-item-wrap viewport"></div>
<div class="map-container viewport" id="map-container">
<div class="map-progress">
<div class="text" id="text">
<span>지도 준비중</span>
<img src="/main/img/archive/progress.gif">
</div>
<div class="count-progress">
<div class="fileName">
<span></span>
</div>
<div class="count">
<div class="index">
<span></span>
</div>
<div class="division">
<span>/</span>
</div>
<div class="total">
<span></span>
</div>
</div>
</div>
</div>
<div class="cluster-list-wrap scrollbar"></div>
<div class="edit-mode-ui">
<div class="edit-mode-ui-wrap">
<div class="title">
<div class="text ft-14">위치 수정 모드</div>
</div>
<div class="contents">
<div class="info-wrap"></div>
<div class="coord-wrap">
<div class="input-wrap">
<div class="left">
<div class="input">
<div class="text ft-14">경도</div>
<input type="text" class="coord-input lon ft-14" id="lon-input" ondragstart="return false">
</div>
<div class="input">
<div class="text ft-14">위도</div>
<input type="text" class="coord-input lat ft-14" id="lat-input" ondragstart="return false">
</div>
</div>
<div class="right">
<div class="focus-btn btn">
<div class="text ft-14">위치 보기</div>
</div>
</div>
</div>
<div class="btn-wrap">
<div class="save-btn btn">
<div class="text ft-14">저장</div>
</div>
<div class="delete-btn btn">
<div class="text ft-14">위치 삭제</div>
</div>
<div class="cancel-btn btn">
<div class="text ft-14">취소</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="control-btn-wrap">
<button class="overlays-fit-btn btn">
<div class="icon"></div>
<div class="text ft-12">파일 전체 영역</div>
</button>
<button class="pmtiles-fit-btn btn">
<div class="icon"></div>
<div class="text ft-12">PMTiles 전체 영역</div>
</button>
<button class="base-map-btn btn">
<div class="icon"></div>
<div class="text ft-12">기본지도</div>
</button>
</div>
<div class="base-map">
<div class="text-wrap">
<div class="text ft-14">
기본지도
</div>
<div class="close"></div>
</div>
<div class="radio-btn-wrap">
<div class="radio-btn">
<div class="radio-wrap">
<input type='radio' name='base-map' value='road' checked>
<div class="ft-12">일반</div>
</div>
</div>
<div class="radio-btn">
<div class="radio-wrap">
<input type='radio' name='base-map' value='satellite'>
<div class="ft-12">위성</div>
</div>
</div>
<div class="radio-btn">
<div class="radio-wrap">
<input type='radio' name='base-map' value='hybrid'>
<div class="ft-12">하이브리드</div>
</div>
</div>
</div>
</div>
</div>
<div class="dnd-area">
<div class="image"></div>
<!-- <div class="text">폴더 또는 파일을 여기에 드래그하세요.</div> -->
<div class="text-wrap">
<div class="text">파일을 여기에 드래그하세요.</div>
</div>
<div class="warn-wrap">
<div class="warn1"></div>
<div class="warn2"></div>
</div>
</div>
</div>
</div>
<div class="list-notice notice" style="display: flex;">
<img class="list-notice-viewer" style="display: none;">
<div class="list-notice-box">
<div class="list-notice-top">
<div class="list-notice-description">
<h3>예시 이미지</h3>
</div>
<img class="image" src="/main/img/archive/img--designDocument-center.jpg" alt="img--example">
</div>
<div class="list-notice-bottom">
<div class="list-notice-bottom-body">
<h4>1. PPT 템플릿을 다운로드한 후, 현재 폴더에 대한 가이드를 작성해주세요.<br>2. 작성한 가이드를 이미지로 저장한 뒤, 해당 이미지를 등록해주세요.
</h4>
</div>
<div class="list-notice-bottom-footer">
<div class="list-notice-negative">
<img class="icon" src="/main/img/archive/icon--download.svg" alt="icon--download">
<h3>템플릿 다운로드</h3>
</div>
<label class="list-notice-positive" for="fileInput" style="cursor: pointer;">
<h3>이미지 등록</h3>
</label>
<input type="file" id="fileInput" accept=".jpg, .jpeg, .png" style="display: none;">
</div>
</div>
<div class="list-notice-box-toggle">
<img class="icon" src="/main/img/archive/icon--big-edit.svg" alt="icon--big-edit">
</div>
<div class="list-notice-box-toggle-menu" style="display: none;">
<div class="list-notice-box-toggle-menu-list download">
<img class="icon" src="/main/img/archive/icon--download.svg" alt="icon--download">
<h4>템플릿 다운로드</h4>
</div>
<label class="list-notice-box-toggle-menu-list change" for="fileInput2">
<img class="icon" src="/main/img/archive/icon--photo.svg" alt="icon--photo">
<h3>이미지 변경</h3>
</label>
<input type="file" id="fileInput2" accept=".jpg, .jpeg, .png" style="display: none;">
<!-- <div class="list-notice-box-toggle-menu-list change">
<img class="icon" src="/main/img/archive/icon--photo.svg" alt="icon--photo">
<h4>이미지 변경</h4>
</div> -->
<div class="list-notice-box-toggle-menu-list delete">
<img class="icon" src="/main/img/archive/icon--photoDelete.svg" alt="icon--photoDelete">
<h4>이미지 삭제</h4>
</div>
</div>
</div>
<!-- <img class="list-notice-viewer" src="/main/img/archive/sample.png" style="object-fit: contain; width:100%; height:90%">
폴더 트리에서 폴더를 선택하면 파일 리스트가 표시됩니다. -->
</div>
</div>
<div class="archive-main-right">
<div class="viewer-container">
<div class="viewer-header">
<div class="wrap">
<div class="text-wrap">
<div class="title ft-14">미리보기</div>
<div class="thumb-alert ft-12">문서/도면 미리보기는 10페이지까지만 표시됩니다.</div>
</div>
<div class="btn">
<div class="text ft-12">전체보기</div>
</div>
</div>
</div>
<div class="viewer-wrap">
<!-- <div class="thumb-alert">
<div class="image"></div>
<div class="text">문서/도면 미리보기는 10페이지까지만 표시됩니다.</div>
</div>
<div class="open-new-window-btn">
<div class="image"></div>
<div class="text">전체 보기</div>
</div> -->
<div class="viewer"></div>
</div>
<div class="info-wrap open">
<div class="separator">
<div class="toolbar">
<div class="toolbar-container">
<div class="btn prev-btn">
<div class="image"></div>
</div>
<div class="btn next-btn">
<div class="image"></div>
</div>
</div>
</div>
<div class="toggle-btn">
<div class="image"></div>
<div class="text ft-12"></div>
</div>
</div>
<div class="metadata scrollbar">
<div class="metadata-item-wrap">
<div class="wrap line1">
<div class="item name">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
</div>
</div>
</div>
<div class="wrap line2">
<div class="item uploader">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
</div>
</div>
<div class="item create-date">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
</div>
</div>
</div>
<div class="wrap line3">
<div class="item author">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
<div class="btn">
<div class="text ft-12">수정</div>
</div>
</div>
</div>
<div class="item size">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
</div>
</div>
</div>
<div class="wrap line4">
<div class="item gps-data">
<div class="key ft-12">
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
<span class="ft-12"></span>
</div>
<div class="value-wrap">
<div class="value ft-14"></div>
<div class="btn">
<div class="text ft-12">수정</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="memo">
<div class="header">
<div class="title ft-12">메모</div>
<div class="wrap">
<div class="message">저장되었습니다.</div>
<!-- <div class="btn ai-btn gemini permission-min-worker">
<img class="ai-start" src="/main/img/ai_test.svg">
<img class="ai-loading" src="/main/img/archive/progress.gif" style="display: none;">
</div> -->
<!-- <div class="btn api-btn inner permission-min-worker">
<img class="ai-start" src="/main/img/ai_security.svg">
<img class="ai-loading" src="/main/img/archive/progress.gif">
</div> -->
<div class="btn api-btn outer permission-min-worker">
<img class="ai-start" src="/main/img/ai_summarize.svg">
<img class="ai-loading" src="/main/img/archive/progress.gif" style="display: none;">
</div>
<div class="btn edit-btn permission-min-worker">
<div class="text">수정</div>
</div>
</div>
</div>
<div class="body">
<div class="wrap">
<div class="message">수정 버튼을 눌러 내용을 작성/수정할 수 있습니다.</div>
<textarea class="textarea scrollbar" spellcheck="false" cols="30" rows="4" wrap="hard" disabled></textarea>
</div>
</div>
</div>
</div>
<div class="viewer-progress">
<div class="text">연결중</div>
<div class="wrap">
<div class="bar">
<div class="fill"></div>
</div>
</div>
</div>
</div>
<div class="viewer-notice notice">
<img src="/main/img/archive/image__preview-help_page.jpg">
</div>
</div>
</div>
<article class="recycle-bin-modal">
<div class="modal-wrap">
<div class="modal-header narrow-area">
<div class="title">
<div class="left-wrap">
<div class="title-wrap">
<div class="text">타이틀</div>
</div>
</div>
</div>
<div class="close"></div>
</div>
<div class="modal-body">
<div class="recycle-bin-wrap">
<div class="list-container list">
<div class="list-wrap list-header" data-resource-path="">
<div class="list-item-wrap">
<div class="list-item">
<div class="wrap list-header-area">
<!-- <div class="type ft-12">종류</div> -->
<div class="name ft-12 sort-asc">파일명</div>
<div class="original-location ft-12">원래 위치</div>
<div class="remove-user ft-12">삭제자</div>
<div class="remove-date ft-12">삭제일자</div>
<div class="author ft-12">작성자</div>
<div class="uploader ft-12">등록자</div>
<div class="create-date ft-12">등록일자</div>
<div class="size ft-12">용량</div>
<div class="state ft-12">상태</div>
</div>
</div>
</div>
</div>
<div class="list-wrap list-body scrollbar scroll-container" data-resource-path="" tabindex="-1">
<div class="list-item-wrap viewport"></div>
</div>
</div>
</div>
</div>
</div>
</article>
<article class="archive-modal">
<div class="wrap">
<article class="log-filter">
<div class="head">
<span class="title _h3">로그필터</span>
<button class="_button-xsmall reset">초기화</button>
</div>
<div class="body">
<div class="log-date">
<span class="subtitle">활동시간</span>
<div class="log-date-wrap">
<span class="category">시작</span>
<input type="date" value="">
</div>
<div class="log-date-wrap">
<span class="category">종료</span>
<input type="date" value="">
</div>
</div>
<div class="log-user">
<span class="subtitle">사용자</span>
<div class="custom-select-wrap">
<div class="custom-select-display">모든 사용자</div>
<ul class="custom-select-list"></ul>
<select id="log-user-select" name="log-user-select" hidden></select>
</div>
</div>
<div class="log-activity">
<div class="head-group">
<span class="subtitle">활동유형</span>
<div class="button-wrap">
<button class="_button-xsmall select-all">전체선택</button>
<button class="_button-xsmall clear-all">전체해제</button>
</div>
</div>
<span class="category">파일 / 폴더관련</span>
<label>
<input type="checkbox" value="uploadData_file" checked>
<span class="--checkbox"></span>
<span>파일 업로드</span>
</label>
<label>
<input type="checkbox" value="renameTarget" checked>
<span class="--checkbox"></span>
<span>이름 변경</span>
</label>
<label>
<input type="checkbox" value="removeTarget" checked>
<span class="--checkbox"></span>
<span>삭제</span>
</label>
<label>
<input type="checkbox" value="downloadTarget" checked>
<span class="--checkbox"></span>
<span>다운로드</span>
</label>
<label>
<input type="checkbox" value="relocateTarget" checked>
<span class="--checkbox"></span>
<span>파일 이동</span>
</label>
<label>
<input type="checkbox" value="createFolder" checked>
<span class="--checkbox"></span>
<span>새 폴더 생성</span>
</label>
<label>
<input type="checkbox" value="setDataPermission_folder" checked>
<span class="--checkbox"></span>
<span>폴더 권한 설정</span>
</label>
<label>
<input type="checkbox" value="convertPdf" checked>
<span class="--checkbox"></span>
<span>PDF 변환</span>
</label>
<span class="category">유저관련</span>
<label>
<input type="checkbox" value="editAuthor" checked>
<span class="--checkbox"></span>
<span>작성자 변경</span>
</label>
<label>
<input type="checkbox" value="deletePermission" checked>
<span class="--checkbox"></span>
<span>권한 삭제</span>
</label>
<label>
<input type="checkbox" value="addPermission" checked>
<span class="--checkbox"></span>
<span>권한 추가</span>
</label>
<span class="category">기타</span>
<label>
<input type="checkbox" value="summarizeAI" checked>
<span class="--checkbox"></span>
<span>AI 요약</span>
</label>
</div>
</div>
<div class="foot">
<button class="_button-medium">적용</button>
</div>
</article>
<div class="modal-wrap">
<div class="modal-header narrow-area">
<div class="title">
<div class="left-wrap">
<div class="title-wrap">
<div class="text">타이틀</div>
<div class="users-count"></div>
</div>
<div class="btn set-user-permission-btn permission-min-sub-master">
<div class="text">유저 권한 설정</div>
</div>
<!-- <div class="btn dev-menu-btn permission-min-dev">
<div class="text">개발자 메뉴</div>
</div> -->
</div>
<!-- <div class="right-wrap">
<button class="project-type" id="project-type-btn">
<h5 class="project-type__label --type__support">지원</h5>
<i class="project-type__icon"></i>
</button>
<h5 class="--type-capsule" id="project-type-capsule">시공</h5>
<ul class="project-type__list">
<li class="project-type__list_item --type__construction">시공</li>
<li class="project-type__list_item --type__design">설계</li>
<li class="project-type__list_item --type__surgest">제안</li>
<li class="project-type__list_item --type__research">연구</li>
<li class="project-type__list_item --type__support">지원</li>
<li class="project-type__list_item --type__center">센터</li>
</ul>
<button class="project-step" id="project-step-btn">
<h5 class="project-step__label --step__active">진행</h5>
<i class="project-step__icon"></i>
</button>
<h5 class="" id="project-step-capsule">진행</h5>
<ul class="project-step__list">
<li class="project-step__list_item --step__active">진행</li>
<li class="project-step__list_item --step__stop">중지</li>
<li class="project-step__list_item --step__done">완료</li>
<li class="project-step__list_item --step__wait">대기</li>
</ul>
<div class="project-manager-title">프로젝트 관리자</div>
<div class="project-manager-name"></div>
</div> -->
</div>
<div class="close"></div>
</div>
<div class="modal-body">
<div class="connected-users-wrap">
<div class="user-item-wrap scrollbar"></div>
<div class="project-setting-wrap" style="display: flex; flex-direction: column;">
<div class="project-name-wrap" style="display: flex; gap:1rem;">
<div>프로젝트명</div>
<div class="project-type-wrap" id="project-type-wrap">
<button class="project-type" id="project-type-btn">
<h5 class="project-type__label --type__support">지원</h5>
<i class="project-type__icon"></i>
</button>
<h5 class="--type-capsule" id="project-type-capsule">시공</h5>
<ul class="project-type__list">
<li class="project-type__list_item --type__construction">시공</li>
<li class="project-type__list_item --type__design">설계</li>
<li class="project-type__list_item --type__surgest">제안</li>
<li class="project-type__list_item --type__research">연구</li>
<li class="project-type__list_item --type__support">지원</li>
<li class="project-type__list_item --type__center">센터</li>
<li class="project-type__list_item --type__survey">측량</li>
</ul>
</div>
<div class="project-type-wrap" id="project-type-wrap-overseas" style="display: none;">
<button class="project-type" id="project-type-btn-overseas">
<h5 class="project-type__label --type__MP">MP (기본계획)</h5>
<i class="project-type__icon"></i>
</button>
<h5 class="--type-capsule" id="project-type-capsule-overseas">MP (기본계획)</h5>
<ul class="project-type__list">
<li class="project-type__list_item --type__MP">MP (기본계획)</li>
<li class="project-type__list_item --type__DD">DD (실시설계)</li>
<li class="project-type__list_item --type__FS">FS (타당성조사)</li>
<li class="project-type__list_item --type__PD">PD (기본설계)</li>
<li class="project-type__list_item --type__DS">DS (설계감리)</li>
<li class="project-type__list_item --type__CS">CS (시공감리)</li>
<li class="project-type__list_item --type__PMC">PMC (실시설계)</li>
<li class="project-type__list_item --type__IDC">IDC (타당성조사)</li>
<li class="project-type__list_item --type__DR">DR (설계검토)</li>
<li class="project-type__list_item --type__BD">BD (수주영업)</li>
<li class="project-type__list_item --type__ETC">ETC (기타)</li>
</ul>
</div>
<div class="project-input-wrap" style="display: flex; gap:1rem;">
<div class ="project-setting-name" id="project-name-view"></div>
<input type="text" class="project-setting-name" id="project-name-input" style="display:none; border: 1px solid black;">
</div>
<div class="project-step-wrap">
<button class="project-step" id="project-step-btn">
<h5 class="project-step__label --step__active">진행</h5>
<i class="project-step__icon"></i>
</button>
<h5 class="" id="project-step-capsule">진행</h5>
<ul class="project-step__list">
<li class="project-step__list_item --step__active">진행</li>
<li class="project-step__list_item --step__stop">중지</li>
<li class="project-step__list_item --step__done">완료</li>
<li class="project-step__list_item --step__wait">대기</li>
</ul>
</div>
<div class="peoject-save-wrap">
<button class="project-save-btn" id ="project-save-btn" style="border: solid 1px black;">수정</button>
<button class="project-cancel-btn" id ="project-cancel-btn" style="border: solid 1px black;">취소</button>
</div>
</div>
<div class="project-manager-wrap" style="display: flex; gap:1rem;">
<div class="project-manager-title">프로젝트 관리자</div>
<div class="project-manager-name"></div>
</div>
<div class="project-location-wrap" style="display: flex; gap:1rem;">
<div class="project-location-title">프로젝트 위치</div>
<div class="project-location-lat"></div>
<div class="project-location-lon"></div>
<button class="project-location-btn" id="project-location-btn" style="border: solid 1px black;">수정</button>
</div>
</div>
<div class="btn-wrap">
<div class="logout-btn">
<div class="image"></div>
<div class="text">로그아웃</div>
</div>
</div>
</div>
<div class="manual-wrap"></div>
<div class="size-wrap">
<div class="chart"></div>
<div class="text">저장공간 관련 문의: GSIM 개발팀 이호성 수석연구원</div>
</div>
<div class="log-wrap">
<div class="log-item-wrap log-header">
<div class="log-item">
<div class="date"><div class="text">활동시간</div></div>
<div class="user"><div class="text">사용자</div></div>
<div class="activity"><div class="text">활동유형</div></div>
<div class="log"><div class="text">활동내용</div></div>
</div>
</div>
<div class="log-item-wrap log-body scrollbar scroll-container"></div>
</div>
<div class="text-wrap"></div>
<!-- <div class="input-wrap"></div> -->
<div class="project-list-wrap"></div>
<div class="input-wrap"></div>
<div class="user-list-wrap">
<div class="user-item-wrap scrollbar"></div>
<!-- 작성자 변경 선택 결과 숨김 -->
<!-- <div class="selected-user-item-wrap">
<div class="text">선택 결과</div>
<div class="selected-user-item"></div>
</div> -->
</div>
<div class="btn-wrap">
<div class="cancel">변환</div>
<!-- <div class="convert">변환</div> -->
<!-- <div class="confirm">확인</div> -->
</div>
</div>
</div>
</div>
</article>
<article class="project-location-modal" style="display: none; z-index: 99;">
<div class="modal-wrap">
<div class="modal-head">
<h3 class="title">프로젝트 위치수정</h3>
<!-- <div class="custom-select-wrap">
<div class="custom-select-display">광역자치단체</div>
<ul class="custom-select-list scrollbar">
<li>도시1</li>
<li>도시2</li>
<li>도시3</li>
<li>도시4</li>
</ul>
</div>
<div class="custom-select-wrap">
<div class="custom-select-display">기초자치단체</div>
<ul class="custom-select-list scrollbar">
<li>도시1</li>
<li>도시2</li>
<li>도시3</li>
<li>도시4</li>
</ul>
</div>
<div class="custom-select-wrap">
<div class="custom-select-display">지방자치단체</div>
<ul class="custom-select-list scrollbar">
<li>도시1</li>
<li>도시2</li>
<li>도시3</li>
<li>도시4</li>
</ul>
</div> -->
<i class="close icon"></i>
</div>
<div class="modal-body">
<div id="map-location" style="position: absolute; top:0; width:100%; height:100%;"></div>
<!-- <div class="ol-viewport" style="position: relative; overflow: hidden; width: 100%; height: 100%;">
<div class="ol-unselectable ol-layers" style="position: absolute; width: 100%; height: 100%; z-index: 0;">
<div class="ol-layer" style="position: absolute; width: 100%; height: 100%;">
<canvas width="960" height="735" style="position: absolute; left: 0px; transform-origin: left top; transform: matrix(1, 0, 0, 1, 0, 0);"></canvas>
</div>
</div>
<div class="ol-overlaycontainer" style="position: absolute; z-index: 0; width: 100%; height: 100%; pointer-events: none;">
<div class="ol-overlay-container ol-selectable" style="position: absolute; pointer-events: auto; transform: translate(-50%, -100%) translate(296.016px, 561.163px);">
<div style="background: #fff;color: #111;padding: 0.25rem 0.5rem;border-radius: 0.25rem;border: 0.1875rem solid #F21D0D;box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);font-size: 0.875rem;font-weight: 500;line-height: 1.25rem;letter-spacing: -0.0175rem;">
선택한 위치<br>Lon: 125.778687 <br>Lat: 34.021412
</div>
</div>
<div class="ol-overlay-container ol-selectable" style="position: absolute; pointer-events: auto; transform: translate(-50%, -50%) translate(296.016px, 576.163px);">
<div class="marker" style="width: 1rem;height: 1rem;background-color: #F21D0D;border-radius: 50%;border: 0.1875rem solid #fff;box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);"></div>
</div>
</div>
<div class="ol-overlaycontainer-stopevent" style="position: absolute; z-index: 0; width: 100%; height: 100%; pointer-events: none;">
<div class="ol-overlay-container ol-selectable" style="position: absolute; pointer-events: auto; transform: translate(-50%, -100%) translate(473.81px, 331.726px);">
<div style="background: #fff;color: #111;padding: 0.25rem 0.5rem;border-radius: 0.25rem;border: 0.1875rem solid #0D8DF2;box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);font-size: 0.875rem;font-weight: 500;line-height: 1.25rem;letter-spacing: -0.0175rem;">
저장된 위치 <br>
Lon: 127.73199<br>
Lat: 36.084663
</div>
</div>
<div class="ol-overlay-container ol-selectable" style="position: absolute; pointer-events: auto; transform: translate(-50%, -50%) translate(473.81px, 346.726px);">
<div style="width: 1rem;height: 1rem;background-color: #0D8DF2;border-radius: 50%;border: 0.1875rem solid #fff;box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);"></div>
</div>
</div>
</div> -->
<!-- </div> -->
<!-- <div class="coordinate">
<div class="top">
<div class="latitude">
<h5>위도</h5>
<h6>0000.0000 N</h6>
</div>
<div class="longtitude">
<h5>경도</h5>
<h6>0000.0000 N</h6>
</div>
</div>
<div class="bottom">
<h5>위치정보</h5>
<h6>없음</h6>
</div>
</div> -->
<!-- <div class="scale">
<button class="up">+</button>
<button class="down">-</button>
</div> -->
<div class="map-wrap">
<div class="base-map on">
<div class="text-wrap">
<div class="text ft-14">
기본지도
</div>
<div class="close"></div>
</div>
<div class="radio-btn-wrap">
<label class="radio-wrap">
<input type="radio" name="location-base-map" value="road" checked>
<div class="ft-12">일반</div>
</label>
<label class="radio-wrap">
<input type="radio" name="location-base-map" value="satellite">
<div class="ft-12">위성</div>
</label>
<label class="radio-wrap">
<input type="radio" name="location-base-map" value="hybrid">
<div class="ft-12">하이브리드</div>
</label>
</div>
</div>
<button class="xs-button">
<i class="icon"></i>
<h6 class="label">기본지도</h6>
</button>
</div>
</div>
<div class="modal-foot">
<button class="button">취소</button>
<button class="primary-button">저장</button>
</div>
</div>
</article>
<article class="permission-modal">
<div class="modal-background"></div>
<div class="modal-wrap">
<div class="modal-header">
<div class="header-tab">
<!-- 부관리자 탭 -->
<input type="radio" id="sub-master" class="tab-input" name="tabs" checked>
<label for="sub-master" class="tab-label">
<!-- <img draggable="false" src="/main/img/permission/sub-master.svg" alt="부관리자"> -->
부관리자
</label>
<!-- 보안참여자 탭 -->
<input type="radio" id="security-worker" class="tab-input" name="tabs">
<label for="security-worker" class="tab-label border-left">
<!-- <img draggable="false" src="/main/img/permission/worker.svg" alt="보안참여자"> -->
보안참여자
</label>
<!-- 일반참여자 탭 -->
<input type="radio" id="worker" class="tab-input" name="tabs">
<label for="worker" class="tab-label border-left">
<!-- <img draggable="false" src="/main/img/permission/worker.svg" alt="일반참여자"> -->
일반참여자
</label>
<!-- 참관자 탭 -->
<input type="radio" id="viewer" class="tab-input" name="tabs">
<label for="viewer" class="tab-label border-left">
<!-- <img draggable="false" src="/main/img/permission/viewer.svg" alt="참관자"> -->
참관자
</label>
</div>
<div class="header-toolbar">
<div id="help-btn"><img src="/main/img/permission/help.svg">도움말</div>
<div class="header-user-num-wrap">
<p class="selected-user-num">선택된 인원 : </p>
<div class="user-num"></div>
</div>
<img class="close" draggable="false" src="/main/img/permission/close.svg" alt="닫기">
</div>
</div>
<article class="modal-permission-help">
<div class="modal-permission-help__head">
<h3 class="modal-permission-help__head_title">유저권한 도움말</h3>
<p class="modal-permission-help__head_text"> 각 사 대표이사, 총괄기획실 실장, 기술개발센터 센터장은 자동으로 <span class="--text__color-dahong">모든 권한</span>이 부여됩니다.</p>
<img class="modal-permission-help__head_close --icon" src="/main/img/permission/close.svg" alt="/" />
</div>
<table class="modal-permission-help__body">
<tbody class="modal-permission-help__body_tbody">
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td" rowspan="2"><h6 class="modal-permission-help__body_tbody_tr_td_text">구분</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">인원관리</h6></td>
<td class="modal-permission-help__body_tbody_tr_td" colspan="2"><h6 class="modal-permission-help__body_tbody_tr_td_text">프로젝트 관리</h6></td>
<td class="modal-permission-help__body_tbody_tr_td" colspan="2"><h6 class="modal-permission-help__body_tbody_tr_td_text">파일 관리</h6></td>
<td class="modal-permission-help__body_tbody_tr_td" colspan="2"><h6 class="modal-permission-help__body_tbody_tr_td_text">보안 관리</h6></td>
</tr>
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">구성원초대 및 권한 설정</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">탭편집</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">카테고리 편집</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">파일 열람</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">파일 편집</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">보안 설정</h6></td>
<td class="modal-permission-help__body_tbody_tr_td"><h6 class="modal-permission-help__body_tbody_tr_td_text">보안 파일 열람 및 편집</h6></td>
</tr>
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td"><h5 class="--permission__submaster">부관리</h5></td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
</tr>
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td"><h5 class="--permission__security">보안</h5></td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
</tr>
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td"><h5 class="--permission__nomal">일반</h5></td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td class="modal-permission-help__body_tbody_tr_td">
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
</tr>
<tr class="modal-permission-help__body_tbody_tr">
<td class="modal-permission-help__body_tbody_tr_td"><h5 class="--permission__viewer">참관</h5></td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/icon__correct--color-green.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/"/>
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
<td class="modal-permission-help__body_tbody_tr_td">
<img class="--icon" src="/main/img/permission/close.svg" alt="/" />
</td>
</tr>
</tbody>
</table>
</article>
<div class="modal-body">
<!-- 탭 왼쪽 -->
<div class="left _scrollbar">
<div class="search-box">
<div class="wrap">
<input class="search-input" type="text" id="permission-search" placeholder="이름 검색">
<img class="search-image" draggable="false" src="/main/img/archive/search.svg" alt="검색">
</div>
</div>
<ul class="_scrollbar"></ul>
<ul class="search-result-container" style="display: none;"></ul>
</div>
<!-- 탭 오른쪽 -->
<div class="right">
<!-- 관리자 탭의 내용 -->
<div class="select-list select-list-sub-master _scrollbar" style="display: block;">
<ul></ul>
</div>
<!-- 보안참여자 탭의 내용 -->
<div class="select-list select-list-security-worker _scrollbar" style="display: none;">
<ul></ul>
</div>
<!-- 일반참여자 탭의 내용 -->
<div class="select-list select-list-worker _scrollbar" style="display: none;">
<ul></ul>
</div>
<!-- 뷰어 탭의 내용 -->
<div class="select-list select-list-viewer _scrollbar" style="display: none;">
<ul></ul>
</div>
</div>
</div>
<!-- 버튼 -->
<div class="modal-footer">
<div class="cancel-btn" id="permission-cancel">취소</div>
<div class="submit-btn" id="permission-submit">저장</div>
</div>
</div>
</article>
<article class="dev-menu-modal permission-min-dev">
<div class="modal-wrap">
<div class="modal-header narrow-area">
<div class="title">
<div class="left-wrap">
<div class="title-wrap">
<div class="text">개발자 메뉴</div>
</div>
</div>
</div>
<div class="close"></div>
</div>
<div class="modal-body">
<div class="left">
<div class="toggle-wrap"></div>
<div class="btn-wrap scrollbar"></div>
</div>
<div class="right">
<div class="total-user-count"></div>
<div class="total-user-list scrollbar"></div>
</div>
</div>
</div>
</div>
</article>
<!-- 구성 (사이트맵) 모달 -->
<article class="composition-modal" style="display: none;">
<div class="modal-wrap">
<div class="head">
<h3>구성</h3>
<i></i>
</div>
<ul class="_scrollbar">
<li>
<h3>최상단 폴더-1</h3>
<ul>
<li>
<h5>상단 폴더-1-1</h5>
<ul>
<li><i></i>
<h6>폴더-1-1-1</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-1-2</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-1-3</h6>
<h6>000</h6>
</li>
</ul>
</li>
<li>
<h5>상단 폴더-1-2</h5>
<ul>
<li><i></i>
<h6>폴더-1-2-1</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-2-2</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-2-3</h6>
<h6>000</h6>
</li>
</ul>
</li>
<li>
<h5>상단 폴더-1-3</h5>
<ul>
<li><i></i>
<h6>폴더-1-3-1</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-3-2</h6>
<h6>000</h6>
</li>
<li><i></i>
<h6>폴더-1-3-3</h6>
<h6>000</h6>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</article>
<div class="overview-modal-wrapper"></div>
<!-- 과업개요 시작-->
<div class="overview-main main">
<!-- 사업개요 -->
<div class="overview-screen">
<div class="overview scrollbar">
<!-- 왼쪽영역 -->
<div class="overview-box-1 scrollbar">
<!-- 사업목적 -->
<div class="box">
<div class="box-header">
<h3>사업목적</h3>
<div class="box-header--right section-left-edit permission-min-sub-master cursor-btn">
<img src="/main/img/overview/edit.svg" alt="edit">
</div>
</div>
<div class="box-body business-purpose">
<h4 class="business-purpose"></h4>
</div>
</div>
<!-- 위치도 -->
<div class="box">
<div class="box-header">
<h3>위치도 / 개요도</h3>
</div>
<div class="box-body location-map-detail">
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>대륙</p>
</div>
<div class="type--wrap-right">
<h4 class="continent"></h4>
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>국가</p>
</div>
<div class="type--wrap-right">
<h4 class="nation-nm"></h4>
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap">
<div class="type--wrap-left">
<p>수행지역</p>
</div>
<div class="type--wrap-right">
<h4 class="performance-area"></h4>
</div>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap">
<div class="type--wrap-left">
<p>참고지역</p>
</div>
<div class="type--wrap-right">
<h4 class="reference-area"></h4>
</div>
</div>
</div>
<div class="main-vban-wrap bg">
<div class="inner">
<div class="vb-swiper">
<div class="swiper">
<ul class="swiper-wrapper">
<li class="swiper-slide">
<img class="location-map" alt="location-map"
src="/main/img/overview/non-photo-overview.svg"
onerror="this.src='/main/img/overview/non-photo-overview.svg'">
</li>
</ul>
<button type="button" class="swiper-button-prev">
<img class="icon" src="/main/img/overview/prev.svg" alt="prev">
</button>
<button type="button" class="swiper-button-next">
<img class="icon" src="/main/img/overview/next.svg" alt="next">
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 시설규모 -->
<div class="box">
<div class="box-header">
<h3>시설규모</h3>
<div class="box-header--right facility-size">
<button class="xs-btn-type">
<h6>전체보기</h6>
</button>
</div>
</div>
<div class="box-body facility-size">
<div class="type--wrap">
<div class="type--wrap-left">
<p>개요</p>
</div>
<div class="type--wrap-right">
<h4 class="facility-overview"></h4>
</div>
</div>
</div>
<div class="scroll-box facility-size">
</div>
</div>
</div>
<div class="section-division-border"></div>
<!-- 가운데영역 -->
<div class="overview-box-2 scrollbar">
<!-- 과업개요 -->
<div class="box">
<div class="box-header">
<h3>과업개요</h3>
<div class="box-header--right">
<div class="box-header--right-set">
<p>약칭</p>
<h5 class="abbreviated-name"></h5>
</div>
<div class="box-header--right-set">
<p>Project Code</p>
<h5 class="project-no"></h5>
</div>
<div class="box-header--right section-middle-edit permission-min-sub-master cursor-btn">
<img src="/main/img/overview/edit.svg" alt="edit">
</div>
</div>
</div>
<div class="box-body task-overview">
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업명(국)</p>
</div>
<div class="type--wrap-right">
<h4 class="task-nm-kr"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업명(영)</p>
</div>
<div class="type--wrap-right">
<h4 class="task-nm-en"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업종류</p>
</div>
<div class="type--wrap-right">
<h4 class="task-type"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업내용</p>
</div>
<div class="type--wrap-right">
<h4 class="task-purpose"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>발주규모</p>
</div>
<div class="type--wrap-space-evenly">
<div class="type--wrap-right">
<h5 class="currency-code">USD</h5>
</div>
<div class="type--wrap-right">
<h4 class="order-size-usd"></h4>
</div>
<div class="type--wrap-right">
<h5>KRW</h5>
</div>
<div class="type--wrap-right">
<h4 class="order-size-krw"></h4>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>예정착공일 </p>
</div>
<div class="type--wrap-right">
<h4 class="scheuled-commencement-date"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>발주처</p>
</div>
<div class="type--wrap-right">
<h4 class="client"></h4>
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>계약기간</p>
</div>
<div class="type--wrap-right">
<h4 class="contract-period"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>원발주처</p>
</div>
<div class="type--wrap-right">
<h4 class="client-origin"></h4>
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>재원</p>
</div>
<div class="type--wrap-right">
<h4 class="financial"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>입찰방식</p>
</div>
<div class="type--wrap-right">
<h4 class="bid"></h4>
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>재원국가</p>
</div>
<div class="type--wrap-right">
<h4 class="financial-country"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>선정방식</p>
</div>
<div class="type--wrap-right">
<h4 class="selection-method"></h4>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 공동도급 -->
<div class="box">
<div class="box-header">
<h3>공동도급</h3>
</div>
<div class="box-body">
<div class="overview-table-container _scrollbar" id="overview-table-container"></div>
</div>
</div>
<!-- 과업기간 -->
<div class="box task-period">
<div class="box-header">
<h3>과업기간</h3>
<div class="box-header--right task-period">
<button class="xs-btn-type">
<h6>변동내역</h6>
</button>
</div>
</div>
<div class="box-body">
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>계약일</p>
</div>
<div class="type--wrap-right">
<h4 class="contract-date"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>착수일</p>
</div>
<div class="type--wrap-right">
<h4 class="commencement-date"></h4>
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>종료예정일</p>
</div>
<div class="type--wrap-right">
<h4 class="scheduled-completion-date"></h4>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>종료일</p>
</div>
<div class="type--wrap-right">
<h4 class="completion-date"></h4>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 사내담당 -->
<div class="box">
<div class="box-header">
<h3>사내담당</h3>
</div>
<div class="box-body company-manager">
<div class="type--wrap">
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당부서</p>
</div>
<div class="type--wrap-right">
<h4 class="department"></h4>
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>책임자</p>
</div>
<div class="type--wrap-right">
<h4 class="projectmanager-nm"></h4>
<!-- <select id="/" name="/">
<option value="/">이호성 수석연구원</option>
<option value="/">박정우 선임연구원</option>
<option value="/">민홍 선임연구원</option>
<option value="/">김건우A 연구원</option>
</select> -->
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당자</p>
</div>
<div class="type--wrap-right">
<h4 class="manager-nm"></h4>
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>지원부서</p>
</div>
<div class="type--wrap-right">
<h4 class="support-department"></h4>
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당자</p>
</div>
<div class="type--wrap-right">
<h4 class="support-manager-nm"></h4>
</div>
</div>
</div>
<!-- 공간확보를 위한 더미 html -->
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p></p>
</div>
<div class="type--wrap-right">
<h4></h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section-division-border tips"></div>
<!-- 오른쪽영역 -->
<div class="overview-box-3 scrollbar">
<div class="box exchange-time">
<div class="box-header">
<h3>교류시간</h3>
<div class="box-header--right" style="display: none;">
<h6>한국이 필리핀보다 <span class="type-em-red">1시간</span> 빠릅니다.</h6>
</div>
</div>
<div class="box-body">
<!-- 국가별 영문코드 요청사항 있을때 사용 -->
<!-- <div class="top-section" style="display: none;">
<div class="top-section--div">
<p>한국</p>
<h5 class="kor-country-code"></h5>
</div>
<div class="top-section--div">
<p class="other-country"></p>
<h5 class="other-country-code"></h5>
<h5 class="other-country-time"></h5>
</div>
</div> -->
<div class="bottom-section">
<div class="time-bar">
<h5 class="kst-time"></h5>
<div class="bar"></div>
<h5 class="other-country-time"></h5>
</div>
<div class="bottom-section-1">
<p>00:00</p>
<p style="margin-left: 2.25rem;">03:00</p>
<p style="margin-left: 3.25rem;">06:00</p>
<p style="margin-left: 3.5rem;">09:00</p>
<p style="margin-left: 3.375rem;">12:00</p>
<p style="margin-left: 3.375rem;">15:00</p>
<p style="margin-left: 3.375rem;">18:00</p>
<p style="margin-left: 3.5rem;">21:00</p>
<p style="margin-left: 2.5rem;">24:00</p>
</div>
<div class="bottom-section-2">
<h4>한국</h4>
<div class="timetable">
<div class="timetable-block del-right"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block work-hour"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
<div class="timetable-block"></div>
</div>
</div>
<div class="bottom-section-3">
<h4 class="other-country"></h4>
<div class="timetable">
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
<div class="timetable-block">
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
<div class="timetable-half-block">
<div class="timetable-quarter-block"></div>
<div class="timetable-quarter-block"></div>
</div>
</div>
</div>
</div>
<div class="bottom-section-4">
<p class="other-country-time1">00:00</p>
<p style="margin-left: 2.25rem;" class="other-country-time2">03:00</p>
<p style="margin-left: 3.375rem;" class="other-country-time3">06:00</p>
<p style="margin-left: 3.5rem;" class="other-country-time4">09:00</p>
<p style="margin-left: 3.375rem;" class="other-country-time5">12:00</p>
<p style="margin-left: 3.375rem;" class="other-country-time6">15:00</p>
<p style="margin-left: 3.5rem;" class="other-country-time7">18:00</p>
<p style="margin-left: 3.375rem;" class="other-country-time8">21:00</p>
<p style="margin-left: 2.375rem;" class="other-country-time9">24:00</p>
</div>
</div>
</div>
</div>
<!-- 주요일정 -->
<div class="box">
<div class="box-header">
<h3>주요일정</h3>
</div>
<div class="calendar">
<div id="calendar">
<div class="calendar-header">
<div class="calendar-btn prev-month"><img src="/main/img/overview/prevMonth.svg"></div>
<div class="month-header"></div>
<div class="calendar-btn next-month"><img src="/main/img/overview/nextMonth.svg"></div>
<div class="add-schedule-btn permission-min-worker"><img src="/main/img/overview/add.svg"></div>
</div>
</div>
</div>
</div>
<!-- 주요 현안 및 이슈 -->
<div class="box issue">
<div class="box-header">
<h3>주요 현안 및 이슈</h3>
<div class="box-header--right task-period">
<button class="xs-btn-type issue-edit">
<h6>수정</h6>
</button>
<button class="xs-btn-type issue-save" style="display: none;">
<h6>저장</h6>
</button>
<button class="xs-btn-type issue-cancle" style="display: none;">
<h6>취소</h6>
</button>
</div>
</div>
<div class="box-body">
<div class="wrap">
<div class="message">수정 버튼을 눌러 내용을 작성/수정할 수 있습니다.</div>
<textarea class="issue-content scrollbar" disabled></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 일정리스트 모달 -->
<div class="overview-modal schedule-list" style="display: none;">
<div class="overview-modal-block">
<div class="overview-modal-header">
<h3 class="overview-modal-name">일정 리스트</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body body-not-gap"></div>
</div>
</div>
<!-- 일정관리 모달창 -->
<div class="overview-modal schedule" style="display: none;">
<div class="overview-modal-header">
<h3 class="overview-modal-name">이벤트 편집</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body body-not-gap body-not-bottom">
<div class="type--wrap">
<div class="type--wrap-left">
<p>제목</p>
</div>
<input type="text" class="schedule-title" id="schedule-title" name="title">
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>설명</p>
</div>
<input type="text" class="schedule-content" id="schedule-content" name="content">
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>국가</p>
</div>
<label class="radio-wrapper">
<input type="radio" name="country" value="대한민국" checked>
<span class="custom-radio"></span>
<h4>대한민국</h4>
</label>
<label class="radio-wrapper">
<input type="radio" name="country" value="필리핀">
<span class="custom-radio"></span>
<h4>필리핀</h4>
</label>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>하루종일</p>
</div>
<label class="custom-checkbox all-day">
<input type="checkbox" id="allDay">
<span></span>
</label>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>일정</p>
</div>
<div class="time-group">
<div class="time-field">
<input type="date" id="startDate" name="startDate" class="startDate">
</div>
<div class="time-field">
<input type="time" id="startTime" name="startTime" class="startTime">
</div>
</div>
&nbsp;~&nbsp;
<div class="time-group">
<div class="time-field">
<input type="date" id="endDate" name="endDate" class="endDate">
</div>
<div class="time-field">
<input type="time" id="endTime" name="endTime" class="endTime">
</div>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>색상</p>
</div>
<div class="color">
<button class="label-color on" style="background-color: #F21D0D;" data-color="#F21D0D"></button>
<button class="label-color" style="background-color: #B92ED1;" data-color="#B92ED1"></button>
<button class="label-color" style="background-color: #6D3DC2;" data-color="#6D3DC2"></button>
<button class="label-color" style="background-color: #0D8DF2;" data-color="#0D8DF2"></button>
<button class="label-color" style="background-color: #4DB251;" data-color="#4DB251"></button>
<button class="label-color" style="background-color: #FFBF00;" data-color="#FFBF00"></button>
<button class="label-color" style="background-color: #A0705F;" data-color="#A0705F"></button>
<button class="label-color" style="background-color: #7F7F7F;" data-color="#7F7F7F"></button>
<button class="label-color" style="background-color: #688897;" data-color="#688897"></button>
</div>
</div>
<!-- 닫기 저장 -->
<div class="modal-footer">
<div class="schedule-delete btn-delete" style="display: none;">
<h3>삭제</h3>
</div>
<div class="btn-close">
<h3>닫기</h3>
</div>
<div class="schedule-save btn-active">
<h3>저장</h3>
</div>
</div>
</div>
</div>
<!-- 사업개요 section-left 모달 -->
<div class="overview-modal section-left" style="display: none;">
<div class="overview-modal-block">
<div class="overview-modal-header">
<h3 class="overview-modal-name">사업개요 수정</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body scrollbar">
<div class="box">
<div class="box-header">사업목적</div>
<div class="box-body">
<textarea class="business-purpose scrollbar"> </textarea>
</div>
</div>
<div class="box">
<div class="box-header">위치도 / 개요도</div>
<div class="box-body">
<div class="type--wrap">
<div class="type--wrap-left">
<p>대 륙</p>
</div>
<h4 class="continent only-overseas"></h4>
<input type="text" class="continent no-overseas">
<div class="type--wrap-left">
<p>국 가</p>
</div>
<h4 class="nation only-overseas"></h4>
<input class="nation no-overseas" type="text">
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>수행지역</p>
</div><input type="text" class="performance-area">
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>참고지역</p>
</div><input type="text" class="reference-area">
</div>
<div class="type--wrap" style="justify-content: space-between;">
<p>위치도/개요도</p>
<label for="overview-img-file-input" class="overview-img-file-label">
<div class="xs-btn-type-icon">
<img class="icon" src="/main/img/overview/icon-add.svg" alt="icon-add">
<h6>추가</h6>
</div>
</label>
<input id="overview-img-file-input" type="file" name="overview-img-file-input" class="overview-img-file-input" accept="image/*" multiple style="display: none;">
</div>
<div class="type--wrap images">
<div class="dropbox-wrap">
<div class="dropbox">
<div class="dropbox-top">
<img class="icon" src="/main/img/overview/icon-imageFile.svg"
alt="icon-dropfile">
<p>
여기로 파일을 드래그하거나 <br>
<strong style="border-bottom: 0.063rem solid #777;">우측 상단에서 이미지 파일을
업로드하세요.</strong>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="box">
<div class="box-header">
<h3>시설규모</h3>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>개요</p>
</div>
<input class="facility-overview" type="text">
</div>
<div class="box-tabs">
<div class="section-tabs _scrollbar">
<div class="tab click-on">
<h3>SectionA</h3>
<button class="xs-btn">
<img class="icon" src="/main/img/overview/icon-close-111.svg"
alt="icon-close-111">
</button>
</div>
<div class="tab">
<h3>SectionB</h3>
<button class="xs-btn">
<img class="icon" src="/main/img/overview/icon-close-111.svg"
alt="icon-close-111">
</button>
</div>
<div class="tab new-tab">
<input class="tab-style-input" type="text" placeholder="입력해주세요.">
<button class="xs-btn">
<img class="icon" src="/main/img/overview/icon-close-111.svg"
alt="icon-close-111">
</button>
</div>
<button class="xs-btn">
<img class="icon" src="/main/img/overview/icon-add.svg" alt="icon-add">
</button>
</div>
<!-- Section 내용 테이블 형식 -->
<div class="section-content">
<div class="section-content--cell">
<input class="short-input" type="text">
<input class="middle-input" type="text">
<input class="short-input" type="text">
<input class="middle-input" type="text">
</div>
<div class="section-content--cell add-cell-btn">
<img class="icon" src="/main/img/overview/icon-add-primary.svg"
alt="icon-add-primary">
<h3>셀추가</h3>
</div>
</div>
</div>
</div>
</div>
<!-- 닫기 저장 -->
<div class="modal-footer">
<div class="btn-close">
<h3>닫기</h3>
</div>
<div class="section-left-save btn-active">
<h3>저장</h3>
</div>
</div>
</div>
</div>
<!-- 사업개요 section-2 모달 -->
<div class="overview-modal section-middle" style="display: none;">
<div class="overview-modal-header">
<h3>사업개요 수정</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/icon-close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body scrollbar">
<div class="box-header">
<h3>과업개요</h3>
<div class="box-header--right">
<div class="type--wrap">
<div class="type--wrap-left">
<p>약칭</p>
</div>
<input class="abbreviated-name" type="text">
<div style="display: flex; align-items: center;">
<p class="project-code">Project Code</p>
<h4 class="project-no only-overseas"></h4>
<input type="text" class="project-no no-overseas">
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업명(국)</p>
</div>
<div class="type--wrap-right">
<h4 class="task-nm-kr only-overseas"></h4>
<input type="text" class="task-nm-kr no-overseas">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업명(영)</p>
</div>
<div class="type--wrap-right">
<input class="task-nm-en" type="text">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업종류</p>
</div>
<div class="type--wrap-right">
<h4 class="task-type only-overseas"></h4>
<input type="text" class="task-type no-overseas">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>과업내용</p>
</div>
<div class="type--wrap-right">
<input class="task-purpose" type="text">
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>발주규모</p>
</div>
<div class="type--wrap-right">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<h5 class="currency-code">USD</h5>
</div>
<div class="type--wrap-right">
<input type="text" class="order-size-usd" style="width: 17rem;">
</div>
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>예정착공일</p>
</div>
<div class="type--wrap-right">
<h4 class="scheuled-commencement-date only-overseas"></h4>
<input type="date" class="scheuled-commencement-date no-overseas">
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<h5>KRW</h5>
</div>
<div class="type--wrap-right">
<input class="order-size-krw" type="text">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>계약기간</p>
</div>
<div class="type--wrap-right">
<h4 class="contract-period only-overseas"></h4>
<input type="text" class="contract-period no-overseas">
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>발주처</p>
</div>
<div class="type--wrap-right">
<h4 class="client only-overseas"></h4>
<input class="client no-overseas" type="text">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>재원</p>
</div>
<div class="type--wrap-right">
<input class="financial" type="text">
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>원발주처</p>
</div>
<div class="type--wrap-right">
<input class="client-origin" type="text">
</div>
</div>
<div class="type--wrap">
<div class="type--wrap-left">
<p>재원국가</p>
</div>
<div class="type--wrap-right">
<input class="financial-country" type="text">
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>입찰방식</p>
</div>
<div class="type--wrap-right">
<h4 class="bid only-overseas"></h4>
<input class="bid no-overseas" type="text">
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>선정방식</p>
</div>
<div class="type--wrap-right">
<input class="selection-method" type="text">
</div>
</div>
</div>
</div>
<div class="box-header">
<h3>과업기간</h3>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>계약일</p>
</div>
<div class="type--wrap-right">
<h4 class="contract-date only-overseas"></h4>
<input class="contract-date no-overseas" type="date">
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>종료예정일</p>
</div>
<div class="type--wrap-right">
<h4 class="scheduled-completion-date only-overseas"></h4>
<input class="scheduled-completion-date no-overseas" type="date">
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>착수일</p>
</div>
<div class="type--wrap-right">
<h4 class="commencement-date only-overseas"></h4>
<input class="commencement-date no-overseas" type="date">
</div>
</div>
</div>
<div class="wrap-2-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>종료일</p>
</div>
<div class="type--wrap-right">
<input class="completion-date" type="date">
</div>
</div>
</div>
</div>
<div class="box-header">
<h3>공동도급</h3>
<!--overseas 분기처리-->
<div class="box-header--right no-overseas">
<button class="joint-contract-add">열추가</button>
<button class="joint-contract-delete">열삭제</button>
</div>
</div>
<div class="overview-table-container _scrollbar">
</div>
<div class="box-header">
<h3>사내담당</h3>
</div>
<div class="type--wrap">
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당부서</p>
</div>
<div class="type--wrap-right">
<h4 class="department only-overseas"></h4>
<input class="department no-overseas" type="text">
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>책임자</p>
</div>
<div class="type--wrap-right">
<h4 class="projectmanager-nm only-overseas"></h4>
<input class="projectmanager-nm no-overseas" type="text">
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당자</p>
</div>
<div class="type--wrap-right">
<h4 class="manager-nm only-overseas"></h4>
<input class="manager-nm no-overseas" type="text">
</div>
</div>
</div>
</div>
<div class="type--wrap">
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>지원부서</p>
</div>
<div class="type--wrap-right">
<input class="support-department" type="text">
</div>
</div>
</div>
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p>담당자</p>
</div>
<div class="type--wrap-right">
<input class="support-manager-nm" type="text">
</div>
</div>
</div>
<!-- 공간확보를 위한 더미 html -->
<div class="wrap-3-set">
<div class="type--wrap">
<div class="type--wrap-left">
<p></p>
</div>
<div class="type--wrap-right">
<h4></h4>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="btn-close">
<h3>닫기</h3>
</div>
<div class="btn-active">
<h3 class="section-middle-save">저장</h3>
</div>
</div>
</div>
<div class="overview-modal task-period" style="display: none;">
<div class="overview-modal-header">
<h3>과업기간 변동내역</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/icon-close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body body-not-gap _scrollbar">
<div class="type--wrap">
<div class="wrap-4-set">
<div class="type--wrap-left">
<p>계약일</p>
</div>
<div class="type--wrap-right">
<h4 class="contract-date">--</h4>
</div>
</div>
<div class="wrap-4-set">
<div class="type--wrap-left">
<p>착수일</p>
</div>
<div class="type--wrap-right">
<h4 class="commencement-date">--</h4>
</div>
</div>
<div class="wrap-4-set">
<div class="type--wrap-left">
<p>종료예정일</p>
</div>
<div class="type--wrap-right">
<h4 class="scheduled-completion-date">--</h4>
</div>
</div>
<div class="wrap-4-set">
<div class="type--wrap-left">
<p>종료일</p>
</div>
<div class="type--wrap-right">
<h4 class="completion-date"></h4>
</div>
</div>
</div>
<div class="box-header">
<h3>과업 중지 이력</h3>
<div class="box-header--right">
<button class="xs-btn-type-icon task-history-add permission-min-sub-master">
<img class="icon" src="/main/img/overview/icon-add.svg" alt="icon-add">
<h6>추가</h6>
</button>
</div>
</div>
<div class="work-list">
<div class="work-list-number">
<h6>차수</h6>
</div>
<div class="work-list-date">
<h6>중지일자</h6>
</div>
<div class="work-list-script">
<h6>중지사유</h6>
</div>
<div class="work-list-redate">
<h6>재개일자</h6>
</div>
<div class="work-list-detail">
<h6>협의내용</h6>
</div>
<div class="work-list-changedate">
<h6>변경일자</h6>
</div>
</div>
<ul>
</ul>
</div>
<div class="modal-footer">
<div class="btn-close">
<h3>닫기</h3>
</div>
<div class="btn-active task-history-save permission-min-sub-master">
<h3>저장</h3>
</div>
</div>
</div>
<!-- 시설규모 전체보기 모달 -->
<div class="overview-modal facility-size" style="display: none;">
<div class="overview-modal-header">
<h3>시설규모</h3>
<div class="overview-modal-header--end">
<img class="icon" src="/main/img/overview/icon-close.svg" alt="icon-close">
</div>
</div>
<div class="overview-modal-body">
</div>
<div class="modal-footer">
<div class="btn-close">
<h3>닫기</h3>
</div>
</div>
</div>
</div>
<!-- 과업개요 끝 -->
<!-- 공문 시작 -->
<div class="official-doc-main main">
<!-- 초기화면 도움말 -->
<div class="official-doc-instructions">
<img src="/main/img/officialDoc/img__official-doc-help.jpg">
<div class="doc-instructions-close-btn">
<div class="instructions-radio">
<label class="custom-checkbox">
<input type="checkbox" id="doc-instructions-radio">
<span></span>
</label>
<div class="text-set">
<h3>도움말 보지않기</h3>
</div>
</div>
<button class="xs-btn-instructions">
<img class="icon" src="/main/img/officialDoc/icon-close-111.svg" alt="icon-close-111">
</button>
</div>
</div>
<!-- 파일부분 -->
<div class="official-doc-list-container">
<div class="official-doc-main-header">
<div class="official-doc-head--left">
<div class="official-doc-head-space">
<h6>구분</h6>
<div class="doc-custom-select-wrapper" id="doc-select-type">
<div class="doc-custom-select" tabindex="0">
<div>
<span class="selected">구분</span>
<div class="options"></div>
</div>
<div>
<img class="icon" src="/main/img/officialDoc/icon-down-sign-aaa.svg" alt="icon-down-sign-aaa">
</div>
</div>
</div>
</div>
<div class="official-doc-head-space">
<h6>기준 (Ourside)</h6>
<div class="doc-custom-select-wrapper" id="doc-select-base">
<div class="doc-custom-select" tabindex="0">
<div>
<span class="selected">기준</span>
<div class="options"></div>
</div>
<div>
<img class="icon" src="/main/img/officialDoc/icon-down-sign-aaa.svg" alt="icon-down-sign-aaa">
</div>
</div>
</div>
</div>
<div class="official-doc-head-space">
<h6>상대기관 (Counterparty)</h6>
<div class="doc-custom-select-wrapper" id="doc-select-target">
<div class="doc-custom-select" tabindex="0">
<div>
<span class="selected">상대기관</span>
<div class="options"></div>
</div>
<div>
<img class="icon" src="/main/img/officialDoc/icon-down-sign-aaa.svg" alt="icon-down-sign-aaa">
</div>
</div>
</div>
</div>
</div>
<div class="official-doc-head--right">
<button class="xs-btn-type official-doc-category">
<h6 class="category-text">전체보기</h6>
<h6 class="category-count">(-)</h6>
</button>
<button class="xs-btn-type official-doc-category">
<h6 class="category-text">행정/일반</h6>
<h6 class="category-count">(-)</h6>
</button>
<button class="xs-btn-type official-doc-category">
<h6 class="category-text">기술/성과물</h6>
<h6 class="category-count">(-)</h6>
</button>
<button class="xs-btn-type official-doc-category">
<h6 class="category-text">회의/기타</h6>
<h6 class="category-count">(-)</h6>
</button>
<div class="official-doc-head--right-line"></div>
<button class="xs-btn-type-icon official-doc-setting-button">
<img class="icon" src="/main/img/officialDoc/icon-setting-111.svg" alt="icon-setting-111">
<h6>설정</h6>
</button>
</div>
</div>
<div class="official-doc-main-body" id="official-doc-main-body">
<div class="official-doc-file" id="official-doc-file">
<!-- 수신 -->
<div class="official-doc-top" id="doc-recipient-container">
<div class="official-doc-header no-contextmenu">
<div class="official-doc-header--left">
<div class="official-doc-title">
<img class="icon" src="/main/img/officialDoc/icon-reception.svg" alt="icon-reception">
<h3>수신 공문 리스트</h3>
</div>
</div>
</div>
<div class="official-doc-list no-contextmenu">
<div class="recipient-number official-doc-file--number official-doc-list-header-item-wrap doc-sort-desc">
<h6 class="official-doc-list-header-item">No.</h6>
</div>
<div class="recipient-office-number official-doc-file--office-number official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">공문번호</h6>
</div>
<div class="recipient-date official-doc-file--date official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">공문일자</h6>
</div>
<div class="recipient-from official-doc-file--from official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">From</h6>
</div>
<div class="recipient-to official-doc-file--to official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">To</h6>
</div>
<div class="recipient-title official-doc-file--title official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">제목</h6>
</div>
<div class="recipient-state official-doc-file--state official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">상태</h6>
</div>
</div>
<hr>
<!-- 파일리스트 부분 -->
<ul class="scrollbar"></ul>
</div>
<!-- 화면 위아래 슬라이더 -->
<div class="official-doc-center-division" id="doc-slider">
<div class="official-doc-division-button">
<img class="logo" src="/main/img/officialDoc/icon-division-big.svg" alt="icon-division-big">
</div>
<div class="line"></div>
</div>
<!-- 발신 -->
<div class="official-doc-bottom" id="doc-sending-container">
<div class="official-doc-header no-contextmenu">
<div class="official-doc-header--left">
<div class="official-doc-title">
<img class="icon" src="/main/img/officialDoc/icon-outgoing.svg" alt="icon-outgoing">
<h3>발신 공문 리스트</h3>
</div>
</div>
</div>
<div class="official-doc-list no-contextmenu">
<div class="sending-number official-doc-file--number official-doc-list-header-item-wrap doc-sort-desc">
<h6 class="official-doc-list-header-item">No.</h6>
</div>
<div class="sending-office-number official-doc-file--office-number official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">공문번호</h6>
</div>
<div class="sending-date official-doc-file--date official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">공문일자</h6>
</div>
<div class="sending-from official-doc-file--from official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">From</h6>
</div>
<div class="sending-to official-doc-file--to official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">To</h6>
</div>
<div class="sending-title official-doc-file--title official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">제목</h6>
</div>
<div class="sending-state official-doc-file--state official-doc-list-header-item-wrap">
<h6 class="official-doc-list-header-item">상태</h6>
</div>
</div>
<hr>
<!-- 파일리스트 부분 -->
<ul class="scrollbar"></ul>
</div>
</div>
<div class="doc-dnd-area" id="doc-dnd-area">
<div class="doc-image"></div>
<div class="doc-text">파일을 여기에 드래그하세요.</div>
</div>
</div>
</div>
<!-- 프리뷰부분 -->
<div class="official-doc-preview no-contextmenu">
<div class="official-doc-preview--notice">파일 리스트에서 파일을 선택하면 미리보기가 표시됩니다.</div>
<div class="official-doc-preview--container">
<div class="viewer-header">
<div class="wrap">
<div class="text-wrap">
<div class="title ft-14">미리보기</div>
</div>
<div class="btn">
<div class="text ft-12">전체보기</div>
</div>
</div>
</div>
<div class="viewer-wrap">
<div class="viewer"></div>
</div>
<div class="info-wrap open">
<div class="separator">
<div class="toggle-btn">
<div class="image"></div>
<div class="text ft-12">공문 정보</div>
</div>
</div>
<div class="metadata scrollbar"></div>
</div>
</div>
</div>
<!-- 공문 컨텍스트 메뉴 -->
<div class="official-doc-contextmenu main">
<div class="official-doc-contextmenu-container">
<!-- <div class="official-doc-contextmenu-item official-doc-contextmenu-padding" id="addVersionFileDoc">
<form class="btn" enctype="multipart/form-data">
<input type="file" id="addVersionFileDocInput" multiple>
<label class="contextmenu-padding" id="uploadFileLabel" for="addVersionFileDocInput">
<img src="/main/img/archive/contextmenu/addOn_version.svg" alt="icon">
<div class="wrap">
<div class="name">버전파일 추가</div>
</div>
</label>
</form>
</div> -->
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding add-on-file attach" id="addAttachFileDoc">
<form class="btn" enctype="multipart/form-data">
<input type="file" id="addAttachFileDocInput" multiple>
<label class="contextmenu-padding" id="uploadFileLabel" for="addAttachFileDocInput">
<img src="/main/img/archive/contextmenu/addOn_attachment.svg" alt="icon">
<div class="wrap">
<div class="name">첨부파일 추가</div>
</div>
</label>
</form>
</div>
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding" id="renameTargetDoc">
<img src="/main/img/archive/contextmenu/renameTarget.svg" alt="icon">
<div class="wrap">
<div class="name">수정</div>
</div>
</div>
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding downloadTargetDoc">
<img src="/main/img/archive/contextmenu/downloadTarget.svg" alt="icon">
<div class="wrap">
<div class="name">다운로드</div>
</div>
</div>
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding deleteTargetDoc">
<img src="/main/img/archive/contextmenu/deleteTarget.svg" alt="icon">
<div class="wrap">
<div class="name">삭제</div>
</div>
</div>
</div>
</div>
<div class="official-doc-contextmenu attach">
<div class="official-doc-contextmenu-container">
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding" id="renameAttachTargetDoc">
<img src="/main/img/archive/contextmenu/renameTarget.svg" alt="icon">
<div class="wrap">
<div class="name">이름 변경</div>
</div>
</div>
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding downloadTargetDoc">
<img src="/main/img/archive/contextmenu/downloadTarget.svg" alt="icon">
<div class="wrap">
<div class="name">다운로드</div>
</div>
</div>
<div class="official-doc-contextmenu-item official-doc-contextmenu-padding deleteTargetDoc">
<img src="/main/img/archive/contextmenu/deleteTarget.svg" alt="icon">
<div class="wrap">
<div class="name">삭제</div>
</div>
</div>
</div>
</div>
</div>
<!-- AI로딩 -->
<div class="doc-ai-loading" style="display: none;">
<div class="ai-loading-content">
<img src="/main/img/archive/progress.gif" alt="loading" />
<p class="text">AI가 문서를 처리 중입니다.</p>
<p class="text">작업에는 20~30초 정도 소요됩니다.</p>
<p class="text">잠시만 기다려주세요.</p>
</div>
</div>
<!-- 모달 백그라운드 -->
<div class="official-doc-modal-background"></div>
<!-- 첨부파일 이름수정모달 -->
<div class="official-doc-modal official-doc-context-modal" style="display: none;">
<div class="official-doc-modal-block">
<div class="official-doc-modal-header"></div>
<div class="official-doc-modal-body"></div>
<div class="official-doc-modal-footer">
<button class="official-doc-negative-btn">
<h3>취소</h3>
</button>
<button class="official-doc-positive-btn">
<h3>확인</h3>
</button>
</div>
</div>
</div>
<!-- AI선택모달 -->
<div class="official-doc-modal official-doc-ai-choice-modal">
<div class="official-doc-modal-block">
<div class="official-doc-modal-header">
<h3>AI 설정</h3>
</div>
<div class="official-doc-modal-body">
<label class="radio-wrapper">
<input type="radio" name="aiChoice" value="outerAi" checked>
<span class="custom-radio"></span>
<span class="custom-radio-text">일반문서(외부AI)</span>
</label>
<label class="radio-wrapper disabled">
<input type="radio" name="aiChoice" value="innerAi" disabled>
<span class="custom-radio"></span>
<span class="custom-radio-text">보안문서(내부AI)</span>
</label>
<label class="radio-wrapper disabled">
<input type="radio" name="aiChoice" value="aiNotUse" disabled>
<span class="custom-radio"></span>
<span class="custom-radio-text">AI 사용 안함</span>
</label>
</div>
<div class="official-doc-modal-footer">
<button class="official-doc-negative-btn">
<h3>취소</h3>
</button>
<button class="official-doc-positive-btn">
<h3>확인</h3>
</button>
</div>
</div>
</div>
<!-- 파일 추가/수정 모달 // 업서트모달 -->
<div class="official-doc-modal official-doc-upsert-modal">
<div class="official-doc-modal-block">
<div class="official-doc-modal-header"></div>
<div class="official-doc-modal-body"></div>
<div class="official-doc-modal-footer">
<div class="doc-required-info">
<span class="doc-required-star">*</span> 표시는 필수입력 항목 입니다.
</div>
<button class="official-doc-negative-btn">
<h3>취소</h3>
</button>
<button class="official-doc-positive-btn">
<h3>확인</h3>
</button>
</div>
</div>
<div class="official-doc-modal-preview"></div>
</div>
<!-- 공문 세팅 버튼 모달 // 세팅모달 -->
<div class="official-doc-modal official-doc-setting-modal">
<div class="official-doc-setting-modal-header official-doc-dori">
<h3>페이지 설정</h3>
<!-- <div class="doc-close"></div> -->
</div>
<div class="official-doc-modal-body-s">
<h3>보기설정</h3>
<div class="official-doc-cell-div">
<div class="official-doc-cell-0">
<div class="official-doc-cell-0--title top">
<p>수/발신 주체</p>
</div>
<div class="official-doc-cell-0--title bottom">
<p>상대기관</p>
</div>
</div>
<div class="official-doc-cell-1">
<div class="official-doc-cell-1--title">
<h4>발주처</h4>
</div>
<div class="official-doc-cell-1--body-1">
<div class="official-doc-inline-list">
<div class="order-base"></div>
</div>
</div>
<div class="official-doc-line-icon">
<img class="logo" src="/main/img/officialDoc/icon__exchange--aaa.svg" alt="icon__exchange">
</div>
<div class="official-doc-cell-1--body-2">
<div class="official-doc-inline-list">
<div class="order-target"></div>
</div>
</div>
</div>
<div class="official-doc-cell-center-division"></div>
<div class="official-doc-cell-2">
<div class="official-doc-cell-2--title">
<h4>발주처 외</h4>
</div>
<div class="official-doc-cell-2--body-1">
<div class="official-doc-inline-list">
<div class="other-order-base"></div>
</div>
</div>
<div class="official-doc-line-icon">
<img class="logo" src="/main/img/officialDoc/icon__exchange--aaa.svg" alt="icon__exchange">
</div>
<div class="official-doc-cell-2--body-2">
<div class="official-doc-inline-list">
<div class="other-order-target"></div>
<div class="official-doc-inline-add-btn other-order-target-btn">
<img class="icon" src="/main/img/officialDoc/icon-add.svg" alt="icon-add">
<h5>추가</h5>
</div>
</div>
</div>
</div>
</div>
<div class="official-doc-line-set"></div>
<h3>사용자설정</h3>
<div class="official-doc-line-text">
<label class="custom-checkbox">
<input type="checkbox" id="doc-instructions">
<span></span>
</label>
<div class="text-set">
<h4>사용방법 / 도움말 보기</h4>
<p>체크를 해제하면 초기 화면에서 더 이상 사용방법 및 도움말을 보지 않습니다.</p>
</div>
</div>
</div>
<div class="official-doc-modal-footer">
<button class="official-doc-negative-btn">
<h3>취소</h3>
</button>
<button class="official-doc-positive-btn">
<h3>저장</h3>
</button>
</div>
</div>
<!-- 공문 끝 -->
<div class="relocate-cover footer-cover"></div>
<div class="footer">
<div class="left">
<div class="wrap manual-wrap">
<div class="title text">도움말</div>
</div>
<div class="footer-separator"></div>
<div class="wrap question-wrap">
<div class="title text">문의사항</div>
</div>
<div class="footer-separator"></div>
<div class="wrap patch-note-wrap">
<div class="title text">패치노트</div>
</div>
<div class="footer-separator"></div>
<div class="wrap recycle-bin-wrap">
<div class="title text">휴지통</div>
</div>
<div class="footer-separator"></div>
<div class="wrap size-wrap">
<div class="title text">저장공간</div>
<!-- <div class="size-text">
<div class="numerator"></div>
<div>/</div>
<div class="denominator"></div>
</div>
<div class="size-bar">
<div class="base">
<div class="value"></div>
</div>
</div> -->
<div class="size-percent"></div>
</div>
<div class="footer-separator"></div>
<div class="wrap site-map-wrap">
<div class="title text">구성</div>
</div>
<div class="footer-separator"></div>
<div class="wrap log-wrap">
<div class="title text">활동로그</div>
<div class="latest-log"></div>
</div>
</div>
<div class="right">
<p>Powered by BARON Consultant Co,.Ltd</p>
</div>
</div>
<div class="init-progress">
<div class="text" id="text">
<span>데이터 불러오는 중</span>
<img src="/main/img/archive/progress.gif">
</div>
</div>
<div class="file-progress">
<div class="file-progress-wrap">
<div class="title">
<div class="title-wrap">
<span></span>
<img src="/main/img/archive/progress.gif">
</div>
<div class="warn">
<span>* 업로드가 완료되기 전에 브라우저를 종료하면 업로드한 내용이 사라질 수 있습니다.</span>
</div>
</div>
<div class="text">
<div class="file-name">
<span></span>
</div>
<div class="count-progress">
<div class="count">
<span></span>
</div>
</div>
</div>
<div class="size-progress">
<div class="size">
<span> </span>
</div>
<div class="percentage">
<span> </span>
</div>
</div>
</div>
</div>
<div class="contextmenu main-menu">
<div class="contextmenu-container"></div>
</div>
<div class="context-focus-box"></div>
<div class="not-dnd-area"></div>
<div class="main-notice notice">
<div>상단 메뉴탭에서 메뉴를 선택하면 내용이 표시됩니다.</div>
</div>
<div class="download-modal" style="display: none;">
<div class="download-modal-wrap">
<div class="download-modal__head">
<div class="download-modal__head_title">폴더다운로드(관리자)</div>
<div class="download-modal__head_subtitle">
압축 완료 시점부터
<b class="--text__color-dahong" style="font-size: 0.75rem;">24시간 이내</b>에만 다운로드가
가능합니다.
</div>
<img
class="download-modal__head_close --icon"
src="/main/img/archive/close.svg"
alt="/" style="cursor: pointer;"
/>
</div>
<div class="download-modal__body">
<div class="download-modal__body_top">
<h5 class="download-modal__body_top_name">폴더명</h5>
<h5 class="download-modal__body_top_time">유효기간</h5>
<h5 class="download-modal__body_top_status">상태</h5>
</div>
<ul class="download-modal__body_list _scrollbar">
</ul>
</div>
<div class="download-modal__foot">
<button class="--button__medium">닫기</button>
</div>
</div>
</div>
</body>
</html>
<!-- HmCesium API -->
<script src="https://api.digitalarchive.work/hmCesium/lib/Cesium/Build/Cesium/Cesium.js"></script>
<link href="https://api.digitalarchive.work/hmCesium/lib/Cesium/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<script src="https://api.digitalarchive.work/hmCesium/lib/axios/dist/axios.js"></script>
<script src="https://api.digitalarchive.work/hmCesium/lib/proj4/dist/proj4.js"></script>
<script src="https://api.digitalarchive.work/hmCesium/lib/swiper/swiper-bundle.min.js"></script>
<link rel="stylesheet" href="https://api.digitalarchive.work/hmCesium/lib/swiper/swiper-bundle.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.8.1/github-markdown.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
<script src="https://api.digitalarchive.work/hmCesium/lib/jszip/dist/jszip.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.6.0/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@3.11.174/build/pdf.min.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/pdf-lib/dist/pdf-lib.min.js"></script> -->
<script src="https://cdn.jsdelivr.net/npm/ol@v10.6.0/dist/ol.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol@v10.6.0/ol.css">
<script src="https://cdn.jsdelivr.net/npm/exifr/dist/lite.umd.js"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script src="socket.io.js" type="module"></script>
<script src="/main/jsm/main.js" type="module"></script>