/* 공용 유틸 시트 — 콘솔·포털의 모든 layout header 가 기존 CSS(콘솔 basic_con.css, 포털 portal/style.css) 바로 뒤에서 싣는다. */

/* 겹친 조회 창을 업무 창 위로 올리는 표식 클래스. 두 저장소가 같은 이름의 클래스를 쓰면서
   iaas 는 화면별 CSS 의 뿌리 id 규칙(#vpc-traffic-graph-modal 등)으로, iaas-admin 은 공용 조각
   header/member.php 의 인라인 <style> 로 따로 갖고 있던 것을 양쪽 utility.css 하나로 모았다
   (2026-09-09 사용자 결정으로 basic_con.css 에 먼저 모았다가 옮겼다). 붙는 곳: iaas console/vpc/traffic.php ·
   console/server/traffic_modal.php, iaas-admin header/member.php.
   bootstrap 의 .modal{z-index:1055} 과 특이도가 같아 시트 순서로 이긴다 — utility.css 는
   bootstrap.css 뒤에 실린다. iaas-admin 에서는 창이 열리는 순간 util.js 의 적층 처리가
   인라인 z-index 로 덮으므로 이 값은 닫힌 상태에만 효력이 있다. */
.modal-2000-z-index{z-index:2000}

/* 확인 모달 본문 — util.js confirmModal 이 그리는 p.confirm-modal-text 의 글자 크기·행간.
   예전에는 이 p 의 인라인 style 이 정했다. 같은 요소의 font-size·line-height 를 basic_con.css 의
   `.iteasy_modal .modal-body > p`(0,2,1)도 정하므로 클래스 하나로는 지고, 그보다 특이도가 높은 선택자로 쓴다. */
.iteasy_modal .modal-body .confirm-modal-text {
	font-size:13px;
	line-height:1.6;
}
/* DataTables 처리중 이미지 — dtable.js GetKoLocale 의 sProcessing 이 그리는 img.dt-loading-img 의 크기. */
.dt-loading-img {
	width:100px;
	height:100px;
}

/* 표 열 폭 — <col class="cw-N"> 의 N 은 폭(%)이다. 화면마다 따로 두던 열 폭 클래스를 하나의 이름 체계로 모았다.
   실효 폭은 그 열의 <td> 폭으로 확인한다. */
.cw-6{width:6%}
.cw-10{width:10%}
.cw-12{width:12%}
.cw-13{width:13%}
.cw-14{width:14%}
.cw-20{width:20%}
.cw-22{width:22%}
.cw-25{width:25%}
.cw-30{width:30%}
.cw-75{width:75%}

/* 감춤 — `!important` 를 붙이지 않는다. jQuery 의 `.show()` 가 인라인으로 되돌리는 자리와
   싸우면 토글이 깨진다. */
.is-hidden {
	display:none;
}
/* 숨은 파일 선택 칸 — 보이는 버튼이 `click()` 으로 대신 누르는 `<input type="file">`. 입력 칸 배치 규칙(portal `customer.css` 의
   `#contact ul li .filebox input[type="file"]` 등)이 특이도로 이기는 자리를 인라인 style 이 막고 있던 값이라 `!important` 로 고정한다. */
.file-input-hidden {
	border:0 !important;
	display:none !important;
	width:0 !important;
	height:0 !important;
}

/* 지연 가림 — fragment-reveal.js 가 조각 삽입 때 시트가 오기 전까지 붙이는 클래스.
   조각 JS 가 폭을 재므로 배치는 그대로 둔다 — `display:none` 은 쓰지 않고 `opacity` 는 투명한 채 눌려서 쓰지 않는다.
   `!important` 를 붙이지 않는다. */
.is-revealing {
	visibility:hidden;
}
/* 가림 동안 보이는 스피너 — bootstrap 의 `spinner-border` 와 같은 모양에 같은 `@keyframes spinner-border` 를 쓴다.
   조각 가운데에 띄워 배치를 건드리지 않고, 같은 삽입에서 가린 형제가 여럿이면 첫 요소에만 둔다. */
.is-revealing::after {
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	box-sizing:border-box;
	width:2rem;
	height:2rem;
	margin:-1rem 0 0 -1rem;
	border:0.25em solid currentcolor;
	border-right-color:transparent;
	border-radius:50%;
	animation:0.75s linear infinite spinner-border;
	visibility:visible;
}
.is-revealing ~ .is-revealing::after {
	content:none;
}