@charset "UTF-8";

body {
	background:#efefef;
}
th {
	font-weight:normal;
}
.CodeMirror {
	height: auto !important;
	background-color: #ddeeff !important;
}
.CodeMirror.javascript {
	background-color: #ddffdd !important;
}
.CodeMirror-scroll {max-height: 300px;}
td.codemirror-bg {
	background-color: #ddeeff !important;
}
td.codemirror-bg-javascript {
	background-color: #ddffdd !important;
}
.display-flex {
	display: -webkit-flex !important;
	display: -moz-flex !important;
	display: -ms-flexbox !important;
	display: -o-flex !important;
	display: flex !important;
}
input[type=radio],input[type=checkbox] {min-width:16px !important}
select,input {max-width:100%;box-sizing:border-box;}

/* 본문 컨테이너 — 폭은 항상 100%(개별 index.css 에서 고정폭 재정의 금지) */
div.make-container {
	max-width:100%;
	margin:0 auto;
	padding:0.5em;
}

/* 본문 */
div.page-contents {
	border:4px solid #999;
	border-radius:.5em;
	padding:8px;
	background:white;
	margin-bottom:.5em;
	box-shadow: 6px 6px 16px #aaa;
	font-size:14px;
}

/* 메인 헤드 */
div.main-head {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: -o-flex;
	display: flex;
	align-items:center;
	margin-bottom:.2em;
	min-height: 38px;
	flex-wrap:wrap;
}
/* 로고 */
div.main-logo {
	font-size:140%;
	margin-right:16px;
}

/* 로고 이미지 + GetData 워드마크 — [시스템 설정 > 기본 설정](/System/Basic) 에서 관리.
   배경색은 회사별 클래스가 아니라 설정값(LOGO_BG)이 인라인 style 로 들어온다. */
div.company-brand-main-logo {
	display:flex;
	align-items:center;
	gap:8px;
	line-height:1;
}
div.company-brand-main-logo .company-header-logo {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;
	height:30px;
	padding:4px 8px;
	border-radius:2px;
}
div.company-brand-main-logo .company-header-logo img {
	display:block;
	width:auto;
	height:22px;
	max-width:112px;
	object-fit:contain;
	padding:0;
	border-radius:0;
	background:transparent;
}
div.company-brand-main-logo .getdata-wordmark {
	white-space:nowrap;
}

/* 메뉴 */
div.main-menu {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: -o-flex;
	display: flex;
	-ms-flex:1 1 auto;
	flex:1 1 auto;
}

/* 메뉴 아이템 */
div.main-menu ul {
	white-space: normal;
}
div.main-menu a {
	padding:2px 6px;
	font-size:14px;
}
div.main-menu a:hover {
	color:#1f8dd6;
	opacity:0.8;
}

/* 선택된 메뉴 */
div.main-menu li.selected a {
	color:#1f8dd6;
}

/* 계정 */
div.main-account {
	flex:0 0 auto;
	margin-left: 1em;
	position:relative;
	display:flex;
	align-items:center;
}
/* 계정 이름 */
div.main-account div.name {
	cursor:pointer;
}
div.main-account div.name:hover {
	color:#1f8dd6;
}
/* 계정 메뉴 */
div.main-account div.account-menu {
	display:none;
	position:absolute;
	right:0;
	top:1.5em;
	background:white;
	border:1px solid #999;
	box-shadow:3px 3px 8px #666;
	width:120px;
	z-index:9999;
}
a.account-menu-item {
	display:block;
	text-align:center;
	padding:.5em;
	text-decoration:none;
	color:#666;
	border-bottom:1px dotted #ccc;
}
a.account-menu-item:last-child {
border-bottom:none;
}
a.account-menu-item:visited {
	text-decoration:none;
	color:#666;
}
a.account-menu-item:hover {
	background-color:#1f8dd6;
	color:white;
}

/* 페이지 제목 */
div.page-title {
	font-size:150%;
	margin:.1em 0 .3em .1em;
	color:#1f8dd6;
}

/* 프로젝트명 */
div.project-name {
	flex:0 0 auto;
	margin-left: 1em;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flexbox;
	display:flex;
	align-items:center;
	color:red;
}
/* 메뉴가 있는 공용 헤더(head.html 의 main-head-menu) — 폭이 좁아도 항상 한 줄.
   로고·계정·배지는 제 폭을 지키고, 메뉴가 우선이라 제목이 먼저 끝까지 줄어든 뒤에도 모자랄 때만 메뉴 띠 안에서 가로 스크롤한다.
   헤더 자체에는 overflow 를 걸지 않는다(계정 메뉴·배지 팝업이 잘린다). univ 전용 헤더는 이 클래스가 없어 그대로 */
div.main-head.main-head-menu {
	-ms-flex-wrap:nowrap;
	flex-wrap:nowrap;
}
div.main-head-menu > div.main-logo {
	-ms-flex:0 0 auto;
	flex:0 0 auto;
}
/* padding/margin 상쇄 — 스크롤 상자가 메뉴 링크의 포커스 테두리를 자르지 않게 여유만 준다(자리 차지는 그대로) */
div.main-head-menu > div.main-menu {
	-ms-flex:1 1 auto;
	flex:1 1 auto;
	min-width:96px;
	padding:4px;
	margin:-4px;
	overflow-x:auto;
	overflow-y:hidden;
}
div.main-head-menu > div.main-menu > div.pure-menu {
	-ms-flex:0 0 auto;
	flex:0 0 auto;
	width:auto;
}
div.main-head-menu > div.main-menu ul {
	white-space:nowrap;
}
div.main-head-menu > div.main-menu::-webkit-scrollbar {
	height:4px;
}
div.main-head-menu > div.main-menu::-webkit-scrollbar-thumb {
	background:rgba(128,128,128,0.55);
	border-radius:2px;
}
@supports (-moz-appearance:none) {
	div.main-head-menu > div.main-menu {scrollbar-width:thin;}
}
/* 긴 프로젝트명 — 메뉴·계정·배지를 먼저 놓고 남는 폭만 쓰며 넘치면 한 줄 말줄임.
   전체 제목은 title(getdata.js SetProjectNameTip)로 보인다.
   기본 자리는 120px(짧으면 실제 폭)이고, 같은 줄의 남는 폭을 제목 길이까지 차지한다. 모자라면 메뉴보다 먼저 이 자리부터 내준다.
   메뉴가 있는 공용 헤더에만 적용 — univ 전용 헤더(main-menu 없음)는 그대로 */
div.main-menu ~ div.project-name {
	display:block;
	-ms-flex:9999 1000000 120px;
	flex:9999 1000000 120px;
	min-width:0;
	max-width:-webkit-max-content;
	max-width:-moz-max-content;
	max-width:max-content;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
/* 제목이 있는 단일 프로젝트 — 말줄임(…)과 전체 제목 툴팁을 띄울 자리 32px 은 남기고, 그 뒤에 메뉴가 스크롤한다.
   제목이 없으면(title 없음) 위 규칙대로 0 까지 줄어든다 */
div.main-menu ~ div.project-name[title]:not(.project-name-group) {
	min-width:32px;
}
/* 같은 폴더 SELECT 가 있을 때 — 기본 자리는 SELECT 폭(최대 200px + 접두어 여백 2px)이고 공통 접두어가 먼저 줄어든다.
   SELECT 포커스 테두리가 잘리지 않게 말줄임은 접두어 쪽에서 처리. 메뉴보다 먼저 줄어들되 SELECT 를 쓸 수 있는 80px 은 남기고, 그 뒤에 메뉴가 스크롤한다 */
div.main-menu ~ div.project-name.project-name-group {
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-preferred-size:202px;
	flex-basis:202px;
	min-width:80px;
	overflow:visible;
}
div.main-menu ~ div.project-name-group > span.project-name-prefix {
	-ms-flex:0 1000000 auto;
	flex:0 1000000 auto;
	min-width:0;
	overflow:hidden;
	text-overflow:ellipsis;
}
div.main-menu ~ div.project-name-group > select.project-name-select {
	-ms-flex:0 1 auto;
	flex:0 1 auto;
	min-width:0;
}
/* 같은 폴더 프로젝트들의 공통 접두어(고정 텍스트) */
span.project-name-prefix {
	font-size:13px;
	color:#888;
	white-space:nowrap;
	margin-right:2px;
}
/* 같은 폴더로 지정된 프로젝트가 있을 때 이름 대신 나열되는 SELECT — 다른 프로젝트로 즉시 전환 */
select.project-name-select {
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	max-width: 200px;
	font-family:inherit;
	font-size:13px;
	font-weight:600;
	color:#1f6fb2;
	background-color:#eaf4fc;
	background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3E%3Cpath%20fill='%231f8dd6'%20d='M4%206l4%204%204-4z'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 8px center;
	background-size:11px;
	border:1px solid #bcdcf5;
	border-radius:12px;
	padding:2px 22px 2px 10px;
	cursor:pointer;
	white-space:nowrap;
	text-overflow:ellipsis;
	transition:border-color .15s,background-color .15s,box-shadow .15s;
}
select.project-name-select:hover {
	border-color:#1f8dd6;
	background-color:#dcedfa;
}
select.project-name-select:focus {
	outline:none;
	border-color:#1f8dd6;
	box-shadow:0 0 0 3px rgba(31,141,214,0.2);
}

/* 오른쪽 버튼 메뉴 */
#contextmenu {
	z-index:9999;
	background:white;
	min-width: 150px;
	box-shadow: 0 4px 5px 3px rgba(0, 0, 0, 0.2);
	position: absolute;
	display: none;
}
/* 오른쪽 버튼 메뉴 아이템 */
#contextmenu > div {
	padding:6px 12px;
	color:#666;
	font-size:14px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
#contextmenu > div:not(.not-click) {
	cursor: pointer;
}
#contextmenu > div:hover:not(.not-click) {
	background-color:#1f8dd6;
	color:white;
}

table.common {
	table-layout:fixed;
	border-collapse:collapse;
	border-spacing:0;
	margin-bottom:.5em;
	color:#666;
	border-bottom:1px solid #cbcbcb;
	width:100%;
}
table.common th {
	text-align:center;
	vertical-align: middle;
	color:#333;
	background-color:#e0e0e0;
	border:1px solid #bbb;
	padding:.3em;
}
table.common td {
	vertical-align: middle;
	padding:.3em;
	/*text-align:center;*/
	border:1px solid #bbb;
}
table.hover > tbody > tr:hover {
	cursor:pointer;
	background-color: #eee;
}

/* 모달 */
div.modal {
	padding:1em;
	border:3px solid #1f8dd6;
	background-color:#fcfcff;
	color:#666;
	margin-bottom:.5em;
	border-radius: 5px;
	line-height:150%;
	font-size:14px;
}

/* 팝업 버튼들 */
div.modal-buttons {
	text-align:center;
	margin-top:0.7em;
}

/* flex 로 width 왼쪽은 내용만큼, 오른쪽은 나머지 전부 차지 */
.flex-left {
	flex:0 0 auto;
	-ms-flex: 0 0 auto;
	display:block;
}
.flex-right {
	flex:1 1 auto;
	-ms-flex:1 1 auto;
	display:block;
}

/* 도움말 상자 */
#helpbox {
	z-index:9999;
	min-width: 150px;
	/* 내용이 길어도 화면을 통째로 덮지 않도록 크기를 제한하고 넘치면 스크롤 */
	max-width: min(560px, 90vw);
	max-height: 60vh;
	overflow: auto;
	box-shadow: 0 4px 5px 3px rgba(0, 0, 0, 0.2);
	border-radius: 5px;
	position: absolute;
	padding:.5em;
	border:3px solid #1f8dd6;
	background-color:#fcfcff;
	font-size:90%;
	display: none;
}

hr.divider {
	width:100%;
	border:none;
	border-top:1px dotted #ccc;
	height:1px;
}

/* CATI */
ul.submenu-buttons {
	list-style: none;
	padding:4px 0 8px;
	margin:0 0 4px;
	border-bottom:1px dotted #ccc;
}
ul.submenu-buttons li {
	display:inline-block;
}
ul.submenu-buttons li a {
	text-decoration: none;
	font-size:14px;
	color:#777;
	padding:4px 8px;
	cursor:pointer;
}
ul.submenu-buttons li.selected a {
	text-decoration: none;
	background-color:#1f8dd6;
	border-radius: 4px;
	color:white;
}
ul.submenu-buttons li a:hover {
	background-color:#1f8dd6aa;
	color:white;
	border-radius: 4px;
}

/*CATI 상단 메뉴*/
div.filters {
	display:flex;
	align-items: center;
	/*padding:.5em;*/
	margin:0 0 .4em;
	/*border:1px solid #ccc;*/
	/*background:#f0f0f0;*/
	font-size:14px;
}
div.filters label {
	margin-right:1em;
}
/*하단 버튼*/
div.bottom-buttons {
	display:flex;
	font-size:14px;
}

/* 달력 토, 일요일 색 */
table.ui-datepicker-calendar tr td.ui-datepicker-week-end:first-child a {
	color:red;
}
table.ui-datepicker-calendar tr td.ui-datepicker-week-end:last-child a {
	color:blue;
}

/*디스플레이 배율에 따른 선 굵기 조절 */
@media(-webkit-min-device-pixel-ratio:1.25){
	table.common {border-bottom-width:0.8px;}
	table.common th,table.common tr.is-sum td {border-width:0.8px;}
	table.common td {border-width:0.8px;}
	div.main-account div.account-menu {border-width:0.8px;}
}
@media(-webkit-min-device-pixel-ratio:1.5){
	table.common {border-bottom-width:0.8px;}
	table.common th,table.common tr.is-sum td {border-width:0.8px;}
	table.common td {border-width:0.8px;}
	div.main-account div.account-menu {border-width:0.8px;}
}
@media(-webkit-min-device-pixel-ratio:1.75){
	table.common {border-bottom-width:0.8px;}
	table.common th,table.common tr.is-sum td {border-width:0.8px;}
	table.common td {border-width:0.8px;}
	div.main-account div.account-menu {border-width:0.8px;}
}
/*@media(-webkit-min-device-pixel-ratio:2){*/
/*	table.common {border-bottom-width:0.5px;}*/
/*	table.common th,table.common tr.is-sum td {border-width:0.5px;}*/
/*	table.common td {border-width:0.5px;}*/
/*	div.main-account div.account-menu {border-width:0.5px;}*/
/*}*/
/*@media(-webkit-min-device-pixel-ratio:2.25){*/
/*	table.common {border-bottom-width:0.44px;}*/
/*	table.common th,table.common tr.is-sum td {border-width:0.44px;}*/
/*	table.common td {border-width:0.44px;}*/
/*	div.main-account div.account-menu {border-width:0.44px;}*/
/*}*/
/*@media(-webkit-min-device-pixel-ratio:2.5){*/
/*	table.common {border-bottom-width:0.4px;}*/
/*	table.common th,table.common tr.is-sum td {border-width:0.4px;}*/
/*	table.common td {border-width:0.4px;}*/
/*	div.main-account div.account-menu {border-width:0.4px;}*/
/*}*/
/*@media(-webkit-min-device-pixel-ratio:3){*/
/*	table.common {border-bottom-width:0.33px;}*/
/*	table.common th,table.common tr.is-sum td {border-width:0.33px;}*/
/*	table.common td {border-width:0.33px;}*/
/*	div.main-account div.account-menu {border-width:0.33px;}*/
/*}*/
/*@media(-webkit-min-device-pixel-ratio:3.5){*/
/*	table.common {border-bottom-width:0.29px;}*/
/*	table.common th,table.common tr.is-sum td {border-width:0.29px;}*/
/*	table.common td {border-width:0.29px;}*/
/*	div.main-account div.account-menu {border-width:0.29px;}*/
/*}*/