@charset "utf-8";
/* ===========================================================================
 * L4 — uic- 자체 컴포넌트
 *
 *   여기 두는 것   KRDS 에 없고 **두 개 이상의 프로젝트에서 쓸** 것 (S40 §2 의 Q4)
 *                  예: .uic-search-panel · .uic-grid · .uic-chart · .uic-toast
 *                  외부 라이브러리 래핑(Tabulator·ECharts·video.js…)의 토큰 어댑터도 여기다
 *   두지 않는 것   제품 도메인 고유 개념 — 그것은 L5 다
 *
 *   ⚠️ 자체 컴포넌트도 **내부 요소는 krds- 클래스를 조합**한다. 버튼을 새로 그리지 않는다 —
 *      .krds-btn.tertiary.xsmall 을 쓴다 (절대 규칙 6).
 *   ⚠️ 마크업은 WEB-INF/tags/uic/ 의 태그파일이 담당한다. 화면이 라이브러리 API 를 직접 부르지 않는다.
 *   ⚠️ 단방향 참조 — ui-core 는 lms·oper·front 를 참조하지 않는다 (D-02).
 *
 *   ⚠️ **[data-krds-mode=high-contrast] 대응을 넣지 않았다.** 앱이 그 속성을 아직 켜지 않는다
 *      (JSP·JS 어디에도 없다). 고대비 모드를 도입할 때 KRDS 와 같은 방식으로
 *      아래 --uic-* 변수만 high-contrast 토큰으로 다시 묶으면 된다.
 * =========================================================================== */

/* ---------------------------------------------------------------------------
 * 목록 화면 세로 리듬 — **한 값** 【TASK-UI12 · 사용자 지적 2026-09-13】
 *
 *   통일 값: `--krds-gap-5` (= `--krds-number-8` = 1.6rem = 16px, 8pt 격자).
 *   근거: KRDS `.krds-structured-list` 의 `--list-gap` 이 `--krds-gap-5` 다.
 *         기존 최빈값은 검색 패널→다음 `gap-6`(2rem)·툴바→표 `gap-4`(1.2rem)로
 *         **갈렸다** — 최빈값 ≠ KRDS 이면 KRDS 쪽이 이긴다(TASK-UI12).
 *
 *   버튼 ↔ 패널 경계: `--krds-padding-5`(0.8rem) — 검색 패널 안 여백.
 *   버튼 묶음 정렬: **오른쪽**(상태·건수는 왼쪽 · 기능은 오른쪽 — C-B04 · D-55).
 * ------------------------------------------------------------------------- */
:root {
	--uic-list--stack-gap: var(--krds-gap-5);
	--uic-list--panel-pad: var(--krds-padding-5);
	--uic-list--btn-gap: var(--krds-gap-2);
}

/* ---------------------------------------------------------------------------
 * uic-search-panel — 목록 검색 조건 패널
 *
 *   KRDS 에는 목록 검색 패널이 없다. .search-layer 는 헤더 전역검색 오버레이라
 *   용도가 다르다 (S40 §2 Q4 → L4).
 *   내부 입력은 .krds-input · .krds-form-select · .krds-btn 을 그대로 쓴다 —
 *   여기서는 **배치와 여백만** 정한다.
 * ------------------------------------------------------------------------- */
.uic-search-panel {
	--uic-search-panel--color-surface: var(--krds-light-color-surface-gray-subtler);
	--uic-search-panel--color-border: var(--krds-light-color-border-gray-light);
	/* 제목 줄 높이와 그 아래 간격. **단추가 컨트롤과 같은 높이에 서는 근거**다 —
	   단추는 이 둘을 더한 만큼 내려온다. 값을 여기 한 곳에 두어 셋이 함께 움직인다. */
	--uic-search-panel--label-height: 2.4rem;
	--uic-search-panel--label-gap: var(--krds-gap-2);
	display: flex;
	flex-wrap: wrap;
	/* ⚠️ **위로 붙인다.** flex-end 로 두면 설명이 두 줄인 칸만 컨트롤이 위로 밀려
	   조건마다 입력칸 높이가 달라진다(사용자 지적 2026-09-10). 제목 줄이 고정 높이라
	   위로 붙이는 것만으로 컨트롤이 나란히 선다. */
	align-items: flex-start;
	gap: var(--krds-gap-4) var(--krds-gap-3);
	margin-bottom: var(--uic-list--stack-gap);
	padding: var(--uic-list--panel-pad);
	background-color: var(--uic-search-panel--color-surface);
	border: 1px solid var(--uic-search-panel--color-border);
	border-radius: var(--krds-radius-medium2);
}

/* 조건 하나 = .form-group 하나.
   남는 폭을 **고르게 나눠 갖되**(D-216) 너무 넓어지지 않게 상한을 둔다 —
   조건이 둘뿐인 화면에서 입력칸이 화면 절반을 먹으면 비율이 깨진다(사용자 지적). */
.uic-search-panel .form-group {
	/* ⚠️ **1rem 은 10px 이다**(KRDS 가 html 을 62.5% 로 둔다) — 16px 으로 읽고
	   값을 잡으면 칸이 생각보다 **절반 크기**로 나온다(실측). */
	flex: 1 1 16rem;
	max-width: 32rem;
	width: auto;
	min-width: 0;
}

/* KRDS 의 .form-conts 는 flex + gap 이라 제목-컨트롤 간격을 저쪽이 쥔다.
   여기서는 **간격을 우리가 쥐어야** 단추 높이를 계산할 수 있다. */
.uic-search-panel .form-conts {
	display: block;
}

/* 제목 줄을 **고정 높이**로 둔다. 긴 이름이 두 줄이 되면 그 칸만 컨트롤이 내려가
   줄이 어긋난다 — 넘치면 말줄임으로 자른다(전체 문구는 설명 줄에 있다). */
.uic-search-panel .form-label {
	display: block;
	height: var(--uic-search-panel--label-height);
	margin-bottom: var(--uic-search-panel--label-gap);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* ⚠️ `.form-group` 을 선택자에 남긴다 — 빼면 KRDS 의 `.krds-input.medium`(고정 256px)과
   특정성이 같아져 **로드 순서에 따라 폭이 안 먹는다**(실측: 360px 칸에 256px 입력칸). */
.uic-search-panel .form-group .krds-input,
.uic-search-panel .form-group .krds-form-select {
	width: 100%;
}

/* 단추는 **컨트롤과 같은 줄**에 서고 **글자만큼만** 넓다.
   ⚠️ 늘어나게 두면 조건보다 큰 단추가 된다(실측: 360px).
   ⚠️ **조건이 많아 줄바꿈되면 이 윈여백이 어색해진다** — 그 줄에는 제목이 없기 때문이다.
      CSS 는 줄바꿈 여부를 모른다. 지금은 조건 최소폭을 16rem 으로 두어
      **조건 다섯 개까지 한 줄**에 들어오게 했다(지금 화면의 최대가 다섯이다).
      여섯째가 생기면 **단추를 감싸는 구조**로 바꿔야 한다 — 그전까지 만들지 않는다. */
.uic-search-panel > .krds-btn,
.uic-search-panel > a.krds-btn {
	flex: 0 0 auto;
	height: var(--krds-size-height-7);
	margin-top: calc(var(--uic-search-panel--label-height) + var(--uic-search-panel--label-gap));
}

/* 첫 단추만 오른쪽으로 민다 — 뒤따르는 단추는 그 옆에 붙는다 */
.uic-search-panel > .krds-btn:not(.krds-btn ~ .krds-btn) {
	margin-left: auto;
}

/* 좁은 폭에서는 조건이 한 줄에 하나씩 — 억지로 나눠 넣으면 글자가 잘린다 */
@media (max-width: 767px) {
	.uic-search-panel .form-group {
		flex: 1 1 100%;
		max-width: none;
	}

	.uic-search-panel > .krds-btn,
	.uic-search-panel > a.krds-btn {
		width: 100%;
		margin-top: 0;
		margin-left: 0;
	}
}

/* ---------------------------------------------------------------------------
 * uic-grid-toolbar — 총 건수 · 페이지 크기 · 엑셀 (D-52 · D-55)
 *
 *   표 위에 놓인다. **왼쪽은 표의 상태**(총 건수 · 페이지당 개수),
 *   **오른쪽은 기능**(등록·수정·삭제·엑셀)이다 【사용자 지시 2026-09-11】.
 *   섮어 놓으면 **읽는 것과 누르는 것**이 같은 줄에 섞여 무엇이 단추인지 흐려진다.
 * ------------------------------------------------------------------------- */
.uic-grid-toolbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--krds-gap-3);
	margin-bottom: var(--uic-list--stack-gap);
}

/* 상태 묶음 — 총 건수와 페이지당 개수를 **붙여 둔다** */
.uic-grid-toolbar .uic-grid-status {
	display: flex;
	align-items: center;
	gap: var(--krds-gap-4);
}

/* 총 건수 옆에 페이지 크기 — 표 **위**에 나란히 (D-217) */
.uic-grid-toolbar .uic-grid-size {
	display: flex;
	align-items: center;
	gap: var(--krds-gap-2);
}

.uic-grid-toolbar .uic-grid-size label {
	color: var(--krds-light-color-text-subtle);
	font-size: var(--krds-pc-font-size-label-small);
	white-space: nowrap;
}

.uic-grid-toolbar .total {
	margin: 0;
	color: var(--krds-light-color-text-basic);
}

/* 기능 단추는 **오른쪽 끝**으로 몰아 상태 묶음과 떨어뜨린다 */
.uic-grid-toolbar .page-size-form,
.uic-grid-toolbar .uic-grid-toolbar-actions {
	display: flex;
	align-items: center;
	gap: var(--uic-list--btn-gap);
	margin-left: auto;
}

/* 단추가 여럿이면 첫 묶음만 밀고 나머지는 그 옆에 붙는다 */
.uic-grid-toolbar .uic-grid-toolbar-actions ~ .uic-grid-toolbar-actions {
	margin-left: 0;
}

/* ---------------------------------------------------------------------------
 * 목록 전용 버튼 묶음 — 표·검색 패널 위·아래 【TASK-UI12】
 *
 *   KRDS `.btn-wrap` 은 `width: 100%` 만 준다. 목록에서는 **오른쪽 정렬**과
 *   표/패널과의 `stack-gap` 을 여기서 한 번에 잡는다.
 *   ⚠️ **폼 화면의 `.btn-wrap` 은 건드리지 않는다**(UI13 범위) — 인접 형제로
 *      검색 패널·그리드·표만 고른다.
 * ------------------------------------------------------------------------- */
.btn-wrap:has(+ .uic-search-panel),
.btn-wrap:has(+ .uic-grid-toolbar),
.btn-wrap:has(+ .uic-grid),
.btn-wrap:has(+ .krds-table-wrap),
.uic-search-panel + .btn-wrap,
.uic-grid-toolbar + .btn-wrap,
.uic-grid + .btn-wrap,
.krds-table-wrap + .btn-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	gap: var(--uic-list--btn-gap);
	margin-bottom: var(--uic-list--stack-gap);
}

/* ---------------------------------------------------------------------------
 * uic-no-data — 「조회 결과가 없습니다」 한 줄
 *
 *   표의 빈 셀에도, 카드 목록의 빈 자리에도 같은 모양으로 쓴다.
 * ------------------------------------------------------------------------- */
.uic-no-data {
	padding: var(--krds-padding-10) var(--krds-padding-5);
	text-align: center;
	color: var(--krds-light-color-text-subtle);
}

/* ---------------------------------------------------------------------------
 * uic-grid — Tabulator 6.5.2 **토큰 어댑터** 【40-ui-krds §2 · C1】
 *
 *   라이브러리 기본 테마를 그대로 쓰지 않는다. 그러면 브랜드색을 바꿨을 때
 *   이 표만 옛 색으로 남는다 (semlearn-krds-component 스킬 §3).
 *   여기서 하는 일은 **KRDS .krds-table-wrap .tbl.data 와 같은 값으로 다시 칠하는 것**뿐이다 —
 *   그래서 변수 이름도 KRDS 표의 것을 그대로 참조한다.
 *
 *   ⚠️ vendor/tabulator/6.5.2/tabulator.min.css 원본은 고치지 않는다 (C1 · 절대 규칙 6).
 *   ⚠️ 값은 --krds-* 토큰만. 색·간격 하드코딩 금지.
 * ------------------------------------------------------------------------- */
/* ⚠️ **`.uic-grid.tabulator` 가 아니다** — 표는 감싸개 **안쪽**에 만들어진다
   (uic-grid.js 의 createHost · role="grid" 를 표 하나로 좁히기 위한 것이다) */
.uic-grid .tabulator {
	background-color: transparent;
	border: 0;
	border-top: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary);
	font-size: var(--krds-pc-font-size-label-medium);
	color: var(--krds-light-color-text-subtle);
}

.uic-grid .tabulator-header {
	background-color: var(--krds-light-color-surface-secondary-subtler);
	border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-secondary-light);
	color: var(--krds-light-color-text-bolder);
	font-weight: var(--krds-font-weight-bold);
}

.uic-grid .tabulator-header .tabulator-col {
	background-color: transparent;
	border-right: 0;
}

.uic-grid .tabulator-header .tabulator-col .tabulator-col-content {
	padding: var(--krds-padding-3) var(--krds-padding-6);
	font-size: var(--krds-pc-font-size-heading-xxsmall);
}

.uic-grid .tabulator-row {
	background-color: var(--krds-light-color-surface-white-subtle);
	border-bottom: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-divider-gray-light);
}

.uic-grid .tabulator-row .tabulator-cell {
	padding: var(--krds-padding-5) var(--krds-padding-6);
	border-right: 0;
	color: var(--krds-light-color-text-subtle);
}

/* 칸에 다 안 들어가면 **… 으로 줄인다** 【사용자 지시 2026-09-11】.
   자르는 것은 CSS 뿐이라 **DOM 에는 온전한 값이 그대로 있다** —
   스크린리더는 전부 읽고, 마우스는 띄우기(uic-grid.js 의 tooltip)로 본다. */
.uic-grid .tabulator-row .tabulator-cell,
.uic-grid .tabulator-col .tabulator-col-title {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* 접속 경로를 접어 두는 칸 【사용자 지시 2026-09-11】.
   대표 IP 옆의 + 를 누르면 경로가 아랫줄에 펼쳐지고 행이 그만큼 높아진다.
   ⚠️ **이 칸만 줄바꿈을 푼다** — 위의 규칙이 nowrap 이라 두 줄이 되지 않는다. */
.uic-grid .tabulator-row .tabulator-cell.uic-trail-cell {
	white-space: normal;
}

/* 대표 IP 와 단추는 **언제나 한 줄**이다.
   ⓘ 여기가 nowrap 이라 칸이 좁으면 셀이 넘치고, 그것을 uic-grid.js 의 폭 맞춤이 보고 넓힌다 —
     칸을 손으로 재지 않아도 IP 와 단추가 나란히 들어간다. */
.uic-trail-head {
	display: inline-block;
	white-space: nowrap;
}

.uic-trail-more {
	margin-left: var(--krds-padding-1);
	padding: 0 var(--krds-padding-1);
	border: var(--krds-light-border-width-variable-regular) solid var(--krds-light-color-border-gray-light);
	border-radius: var(--krds-radius-small1);
	background-color: var(--krds-light-color-surface-white);
	color: var(--krds-light-color-text-subtle);
	/* 글자 줄과 같은 높이여야 한다 — 크면 그것만으로 행이 높아진다(실측 51 → 77) */
	line-height: 1;
	vertical-align: middle;
}

.uic-trail-more:hover {
	background-color: var(--krds-light-color-surface-gray-subtle);
}

/* 펼친 경로. 대표 IP 아래에 붙어 **한 칸 안에서** 읽힌다.
   ⚠️ **:not([hidden]) 을 뗄 수 없다** — display 를 그냥 주면 뒤에 오는 이 규칙이
      [hidden] 의 display:none 을 이겨 **접어 둔 경로가 처음부터 펼쳐진다**(실측). */
.uic-trail-path:not([hidden]) {
	display: block;
	color: var(--krds-light-color-text-subtle);
	font-size: var(--krds-pc-font-size-label-small);
	word-break: break-all;
}

/* ⚠️ **`.tabulator-tableholder` 를 빼지 않는다.** 벤더 규칙이 선택자 넷이라
   (`.tabulator .tabulator-tableholder .tabulator-placeholder .tabulator-placeholder-contents`)
   셋으로 적으면 **여기 값이 전부 무시되고** 글자가 #ccc 로 남는다 — 흰 바탕에서 명도대비 1.6
   (axe color-contrast · serious · 실측 2026-09-11) */
.uic-grid .tabulator-tableholder .tabulator-placeholder .tabulator-placeholder-contents {
	padding: var(--krds-padding-10) var(--krds-padding-5);
	color: var(--krds-light-color-text-subtle);
	font-size: var(--krds-pc-font-size-label-medium);
	font-weight: var(--krds-font-weight-regular);
}

/* 바닥의 페이지네이션 — KRDS .krds-pagination 과 같은 값으로 맞춘다 */
.uic-grid .tabulator-footer {
	background-color: transparent;
	border-top: 0;
	color: var(--krds-light-color-text-subtle);
}

/* ⚠️ **벤더 CSS 는 `.tabulator` 안쪽에만 걸려 있다.** 페이저는 표 **밖**에 그려지므로
   (uic-grid.js 의 footerElement) 자리잡기를 여기서 한다 — 안 적으면 안여백이 사라진다 */
.uic-grid .tabulator-footer .tabulator-footer-contents {
	display: flex;
	align-items: center;
	padding: var(--krds-padding-2) var(--krds-padding-4);
}

/* 페이저는 **가운데**에 둔다 — KRDS .krds-pagination 이 그렇다(justify-content: center) 【D-216】 */
.uic-grid .tabulator-footer .tabulator-paginator {
	/* 바닥글 폭을 다 쓴다 — 안 그러면 가운데 정렬이 제 글자 폭 안에서만 돈다 */
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--krds-gap-2);
	text-align: center;
}

.uic-grid .tabulator-footer .tabulator-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--krds-size-height-6);
	height: var(--krds-size-height-6);
	margin: 0 var(--krds-gap-1);
	padding: 0 var(--krds-padding-3);
	border: 0;
	border-radius: var(--krds-radius-medium1);
	background-color: var(--krds-light-color-action-secondary);
	color: var(--krds-light-color-text-subtle);
	font-size: var(--krds-pc-font-size-label-small);
}

.uic-grid .tabulator-footer .tabulator-page:hover {
	background-color: var(--krds-light-color-action-secondary-hover);
}

.uic-grid .tabulator-footer .tabulator-page.active {
	background-color: var(--krds-light-color-action-secondary-active);
	color: var(--krds-light-color-text-inverse-static);
	font-weight: var(--krds-font-weight-bold);
}

.uic-grid .tabulator-footer .tabulator-page:disabled {
	color: var(--krds-light-color-text-disabled);
}

/* ---------------------------------------------------------------------------
 * 처음·이전·다음·끝은 **화살표 아이콘**으로 【D-216 · KRDS .page-navi 와 같은 모양】
 *
 *   ⚠️ **글자를 지우지 않는다.** `font-size: 0` 은 **눈에서만** 없애고 DOM 에는 남긴다 —
 *      스크린리더는 「이전 페이지」를 그대로 읽는다. `display:none` 이나 텍스트 제거로
 *      바꾸면 아이콘만 남아 **읽을 것이 없어진다**(절대 규칙 8).
 *   ⚠️ 아이콘은 KRDS 원본 파일(`ico_angle.svg`)을 mask 로 쓴다 — 색은 토큰이 정한다.
 * ------------------------------------------------------------------------- */
.uic-grid .tabulator-footer .tabulator-page[data-page="first"],
.uic-grid .tabulator-footer .tabulator-page[data-page="prev"],
.uic-grid .tabulator-footer .tabulator-page[data-page="next"],
.uic-grid .tabulator-footer .tabulator-page[data-page="last"] {
	/* ⚠️ **글자를 숨기지 않는다**(사용자 지적 2026-09-10) — 화살표만으로는 「처음」과 「이전」이
	   구분되지 않았다. 짧은 글자(처음·이전·다음·끝)를 함께 두고, 긴 이름은 title 이 갖는다. */
	gap: var(--krds-gap-1);
	padding: 0 var(--krds-padding-3);
}

/* ⚠️ **처음·끝에는 아이콘을 두지 않는다**(사용자 결정 2026-09-10) — 화살표 하나로는
   「처음」과 「이전」이 구분되지 않아 오히려 헷갈렸다. 글자가 더 분명하다.
   ⚠️ 방향이 뜻을 갖는 둘만 아이콘을 붙인다 — **이전은 글자 앞, 다음은 글자 뒤**다. */
.uic-grid .tabulator-footer .tabulator-page[data-page="prev"]::before,
.uic-grid .tabulator-footer .tabulator-page[data-page="next"]::after {
	content: "";
	display: inline-flex;
	width: var(--krds-icon--size-medium);
	height: var(--krds-icon--size-medium);
	background-color: var(--krds-light-color-text-basic);
	-webkit-mask: url(../../img/component/icon/ico_angle.svg) no-repeat center/contain;
	mask: url(../../img/component/icon/ico_angle.svg) no-repeat center/contain;
}

/* ⚠️ **`ico_angle` 은 아래(∨)를 가리킨다**(SVG 실측) — 그대로 두면 화살표가 위아래를 향한다.
   왼쪽으로 갈 것은 +90°, 오른쪽으로 갈 것은 -90° 로 눕힌다. */
.uic-grid .tabulator-footer .tabulator-page[data-page="prev"]::before {
	transform: rotate(90deg);
}

.uic-grid .tabulator-footer .tabulator-page[data-page="next"]::after {
	transform: rotate(-90deg);
}

.uic-grid .tabulator-footer .tabulator-page:disabled::before,
.uic-grid .tabulator-footer .tabulator-page:disabled::after {
	background-color: var(--krds-light-color-text-disabled);
}

/* 페이지 크기 선택은 KRDS 셀렉트 모양으로 */
.uic-grid .tabulator-footer .tabulator-page-size {
	height: var(--krds-size-height-6);
	padding: 0 var(--krds-padding-5);
	border: 1px solid var(--krds-light-color-input-border);
	border-radius: var(--krds-radius-medium3);
	background-color: var(--krds-light-color-input-surface);
	color: var(--krds-light-color-text-basic);
	font-size: var(--krds-pc-font-size-label-small);
}

/* ⚠️ 포커스 표시를 여기서 다시 만들지 않는다. KRDS 원본이 `*:focus` 에
   outline + box-shadow 를 이미 걸어 두어 Tabulator 요소에도 그대로 붙는다
   (output.css 의 `*:focus`). 덧칠하면 두 벌이 된다. */

/* ---------------------------------------------------------------------------
 * header-privacy — 개인정보 가리기 토글 【사용자 지시 2026-09-11】
 *
 *   머리말의 다른 단추(.btn-navi)와 **같은 모양**으로 둔다. 여기서 하는 일은
 *   ① form 이 감싸고 있어 생기는 여백을 없애고 ② 풀려 있는 상태를 눈에 띄게 하고
 *   ③ 남은 시간을 작게 붙이는 것뿐이다.
 *
 *   ⚠️ **상태를 색으로만 말하지 않는다**(절대 규칙 8) — 자물쇠 그림과 「개인정보 보기/가리기」
 *      라는 글자가 함께 바뀐다. 색은 거들 뿐이다.
 * ------------------------------------------------------------------------- */
.header-privacy {
	display: inline-flex;
	margin: 0;
}

/* 풀려 있는 동안 — 되돌릴 것이 있다는 표시.
   ⚠️ .btn-navi 를 쓰지 않는다 【C-B01】 — KRDS 가 그 클래스에 아이콘 자리를 무조건 그리는데
      마스크 이미지는 정해진 변형에만 있어 **검은 네모**가 남았다(output.css 5039). */
.krds-btn.privacy-on {
	color: var(--krds-light-color-text-danger);
	font-weight: var(--krds-font-weight-bold);
}

/* 남은 시간. 글자를 작게 두어 단추 이름을 가리지 않는다 */
.privacy-left {
	margin-left: var(--krds-gap-1);
	font-size: var(--krds-pc-font-size-label-small);
	font-weight: var(--krds-font-weight-regular);
}