@charset "UTF-8";

/* ====================================================================== */
/* [Web Font]
/* ====================================================================== */
@font-face {
	font-family: "Pretendard";
	font-weight: 100;
	font-style: normal;
	src: url("/fonts/Pretendard-Thin-c15ff04b5d7e9f2006898ce93a4495f5.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 200;
	font-style: normal;
	src: url("/fonts/Pretendard-ExtraLight-1ac90a5e5da23d04af9ced4d369af0e7.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 300;
	font-style: normal;
	src: url("/fonts/Pretendard-Light-fde256bdff7de7ea8b148c7d22f01158.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 400;
	font-style: normal;
	src: url("/fonts/Pretendard-Regular-d4a954e87a1d19a80f64da85e7450b85.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 500;
	font-style: normal;
	src: url("/fonts/Pretendard-Medium-98ce178532d0a51919b5d91f4ce99fe0.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 600;
	font-style: normal;
	src: url("/fonts/Pretendard-SemiBold-b50fa0c6afc558302269416ffa7ea9fb.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 700;
	font-style: normal;
	src: url("/fonts/Pretendard-Bold-34dd324033cd43d1df5b3a0322269ee3.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 800;
	font-style: normal;
	src: url("/fonts/Pretendard-ExtraBold-37351d376cbddf973bc44f0f1b34e507.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 900;
	font-style: normal;
	src: url("/fonts/Pretendard-Black-172f16b277ee1ffb59ca064df8278760.woff2") format("woff2");
	font-display: normal;
}

/* radius */
.gap4 {
	gap: 4px !important;
}

.gap8 {
	gap: 8px !important;
}

.gap12 {
	gap: 12px !important;
}

.gap16 {
	gap: 16px !important;
}

.gap20 {
	gap: 20px !important;
}

.gap24 {
	gap: 24px !important;
}

.gap40 {
	gap: 40px !important;
}

.gap80 {
	gap: 80px !important;
}

.m0 {
	margin: 0px !important;
}

.mt0 {
	margin-top: 0px !important;
}

.mr0 {
	margin-right: 0px !important;
}

.mb0 {
	margin-bottom: 0px !important;
}

.ml0 {
	margin-left: 0px !important;
}

.m4 {
	margin: 4px !important;
}

.mt4 {
	margin-top: 4px !important;
}

.mr4 {
	margin-right: 4px !important;
}

.mb4 {
	margin-bottom: 4px !important;
}

.ml4 {
	margin-left: 4px !important;
}

.m6 {
	margin: 6px !important;
}

.mt6 {
	margin-top: 6px !important;
}

.mr6 {
	margin-right: 6px !important;
}

.mb6 {
	margin-bottom: 6px !important;
}

.ml6 {
	margin-left: 6px !important;
}

.m8 {
	margin: 8px !important;
}

.mt8 {
	margin-top: 8px !important;
}

.mr8 {
	margin-right: 8px !important;
}

.mb8 {
	margin-bottom: 8px !important;
}

.ml8 {
	margin-left: 8px !important;
}

.m12 {
	margin: 12px !important;
}

.mt12 {
	margin-top: 12px !important;
}

.mr12 {
	margin-right: 12px !important;
}

.mb12 {
	margin-bottom: 12px !important;
}

.ml12 {
	margin-left: 12px !important;
}

.m16 {
	margin: 16px !important;
}

.mt16 {
	margin-top: 16px !important;
}

.mr16 {
	margin-right: 16px !important;
}

.mb16 {
	margin-bottom: 16px !important;
}

.ml16 {
	margin-left: 16px !important;
}

.m20 {
	margin: 20px !important;
}

.mt20 {
	margin-top: 20px !important;
}

.mr20 {
	margin-right: 20px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}

.ml20 {
	margin-left: 20px !important;
}

.m24 {
	margin: 24px !important;
}

.mt24 {
	margin-top: 24px !important;
}

.mr24 {
	margin-right: 24px !important;
}

.mb24 {
	margin-bottom: 24px !important;
}

.ml24 {
	margin-left: 24px !important;
}

.m40 {
	margin: 40px !important;
}

.mt40 {
	margin-top: 40px !important;
}

.mr40 {
	margin-right: 40px !important;
}

.mb40 {
	margin-bottom: 40px !important;
}

.ml40 {
	margin-left: 40px !important;
}

.p0 {
	padding: 0px !important;
}

.pt0 {
	padding-top: 0px !important;
}

.pr0 {
	padding-right: 0px !important;
}

.pb0 {
	padding-bottom: 0px !important;
}

.pl0 {
	padding-left: 0px !important;
}

.p4 {
	padding: 4px !important;
}

.pt4 {
	padding-top: 4px !important;
}

.pr4 {
	padding-right: 4px !important;
}

.pb4 {
	padding-bottom: 4px !important;
}

.pl4 {
	padding-left: 4px !important;
}

.p6 {
	padding: 6px !important;
}

.pt6 {
	padding-top: 6px !important;
}

.pr6 {
	padding-right: 6px !important;
}

.pb6 {
	padding-bottom: 6px !important;
}

.pl6 {
	padding-left: 6px !important;
}

.p8 {
	padding: 8px !important;
}

.pt8 {
	padding-top: 8px !important;
}

.pr8 {
	padding-right: 8px !important;
}

.pb8 {
	padding-bottom: 8px !important;
}

.pl8 {
	padding-left: 8px !important;
}

.p12 {
	padding: 12px !important;
}

.pt12 {
	padding-top: 12px !important;
}

.pr12 {
	padding-right: 12px !important;
}

.pb12 {
	padding-bottom: 12px !important;
}

.pl12 {
	padding-left: 12px !important;
}

.p16 {
	padding: 16px !important;
}

.pt16 {
	padding-top: 16px !important;
}

.pr16 {
	padding-right: 16px !important;
}

.pb16 {
	padding-bottom: 16px !important;
}

.pl16 {
	padding-left: 16px !important;
}

.p20 {
	padding: 20px !important;
}

.pt20 {
	padding-top: 20px !important;
}

.pr20 {
	padding-right: 20px !important;
}

.pb20 {
	padding-bottom: 20px !important;
}

.pl20 {
	padding-left: 20px !important;
}

.p24 {
	padding: 24px !important;
}

.pt24 {
	padding-top: 24px !important;
}

.pr24 {
	padding-right: 24px !important;
}

.pb24 {
	padding-bottom: 24px !important;
}

.pl24 {
	padding-left: 24px !important;
}

.p40 {
	padding: 40px !important;
}

.pt40 {
	padding-top: 40px !important;
}

.pr40 {
	padding-right: 40px !important;
}

.pb40 {
	padding-bottom: 40px !important;
}

.pl40 {
	padding-left: 40px !important;
}

:root {
	/* background */
	--bgcolor-top: #;
	--bgcolor-bottom: #;
	--bgcolor-primary: #250088;
	--bgcolor-lightGray: #f5f5f5;
	--text-bgcolor: #fff;
	/* 텍스트 Color */
	--text-default: $base-color;
	--text-color: #595959;
	--text-disabled: #8c8c8c;
	--text-heading: #1f1f1f;
	--text-title: #262626;
	--text-primary: #250088;
	--text-blue: #4772d8;
	--text-green: #24883e;
	--text-purple: #6c5abc;
	/* 버튼 BgColor */
	--btn-text-color: #fff;
	--btn-bgcolor-primary: #250088;
	--btn-bgcolor-primary-hover: #170055;
	--btn-bgcolor-blue: #4772d8;
	--btn-bgcolor-blue-hover: #193c8d;
	--btn-bgcolor-green: #24883e;
	--btn-bgcolor-green-hover: #0f4e1f;
	--btn-bgcolor-purple: #6c5abc;
	--btn-bgcolor-purple-hover: #3f2f87;
	--btn-bgcolor-disabled: #f0f0f0;
	/* 테두리 컬러 */
	--border-default: #ccc;
	--border-focus: #256ef4;
	--border-hover: #222222;
	--border-light: #f0f0f0;
	--border-primary: #250088;
	--border-blue: #4772d8;
	--border-green: #24883e;
	--border-purple: #6c5abc;
	/* 뱃지 컬러 */
	--badge-bgcolor-red: #e33642;
	/* Tool BgColor */
	--tool-bgcolor: #434343;
	--tool-bgcolor-dim: rgba(0, 0, 0, 0.94);
	--tool-txt-color: #fff;
}

html {
	font-size: 10px;
}

html[lang=ko-KR],
html[lang=ko] {
	font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", sans-serif;
}

html[lang=ko-KR] body,
html[lang=ko] body {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: #262626;
}

html[lang=en],
html *[lang=en] {
	font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", sans-serif;
}

html[lang=en] body,
html *[lang=en] body {
	font-size: 16px;
	font-weight: 400;
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
	-webkit-text-size-adjust: 100%;
}

main {
	display: block;
}

pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
}

b,
strong {
	font-weight: bolder;
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

img {
	border-style: none;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
[type=button],
[type=reset],
[type=submit] {
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

legend {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

progress {
	vertical-align: baseline;
}

textarea {
	overflow: auto;
}

[type=checkbox],
[type=radio] {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
	height: auto;
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}

[type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

details {
	display: block;
}

summary {
	display: list-item;
}

template {
	display: none;
}

[hidden] {
	display: none;
}

/* reset */
html * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
figure,
legend,
input,
textarea,
button,
p,
blockquote,
th,
td,
form,
fieldset,
blockquote,
iframe {
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

article,
aside,
canvas,
details,
embed,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary {
	display: block;
}

command,
datalist,
keygen,
mark,
meter,
progress,
rp,
rt,
ruby,
time,
wbr {
	display: inline;
}

img {
	display: inline-block;
	vertical-align: top;
	max-width: 100%;
	border: 0;
	image-rendering: -moz-crisp-edges;
	/* firefox */
	image-rendering: -o-crisp-edges;
	/* opera */
	image-rendering: -webkit-optimize-contrast;
	/* chrome(비표준) */
	image-rendering: crisp-edges;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

fieldset {
	border: 0;
}

ul,
ol,
li {
	list-style: none;
}

pre {
	white-space: pre-wrap;
}

legend,
caption {
	position: relative;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	border: 0;
	padding: 0;
	white-space: nowrap;
	clear: both;
}

a {
	color: inherit;
	cursor: pointer;
	background-color: transparent;
}

a:link {
	text-decoration: none;
}

a:hover,
a:focus,
a:active,
a:visited {
	text-decoration: none;
}

em,
i,
address,
cite {
	font-style: normal;
	font-weight: normal;
}

input,
textarea,
select,
button,
table {
	font-size: inherit;
	font-family: inherit;
	border: 0;
	background-color: transparent;
}

button,
select {
	cursor: pointer;
}

textarea,
input,
select {
	border-radius: 0;
	border: 0;
	outline-color: -moz-use-text-color;
	outline-width: medium;
}

textarea {
	resize: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

label {
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

table {
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0;
}

th,
td {
	border-collapse: collapse;
}

select::-ms-expand {
	display: none;
}

/* ====================================================================== */
/* [Web Font]
/* ====================================================================== */
@font-face {
	font-family: "Pretendard";
	font-weight: 100;
	font-style: normal;
	src: url("/fonts/Pretendard-Thin-c15ff04b5d7e9f2006898ce93a4495f5.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 200;
	font-style: normal;
	src: url("/fonts/Pretendard-ExtraLight-1ac90a5e5da23d04af9ced4d369af0e7.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 300;
	font-style: normal;
	src: url("/fonts/Pretendard-Light-fde256bdff7de7ea8b148c7d22f01158.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 400;
	font-style: normal;
	src: url("/fonts/Pretendard-Regular-d4a954e87a1d19a80f64da85e7450b85.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 500;
	font-style: normal;
	src: url("/fonts/Pretendard-Medium-98ce178532d0a51919b5d91f4ce99fe0.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 600;
	font-style: normal;
	src: url("/fonts/Pretendard-SemiBold-b50fa0c6afc558302269416ffa7ea9fb.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 700;
	font-style: normal;
	src: url("/fonts/Pretendard-Bold-34dd324033cd43d1df5b3a0322269ee3.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 800;
	font-style: normal;
	src: url("/fonts/Pretendard-ExtraBold-37351d376cbddf973bc44f0f1b34e507.woff2") format("woff2");
	font-display: normal;
}

@font-face {
	font-family: "Pretendard";
	font-weight: 900;
	font-style: normal;
	src: url("/fonts/Pretendard-Black-172f16b277ee1ffb59ca064df8278760.woff2") format("woff2");
	font-display: normal;
}

/* radius */
.gap4 {
	gap: 4px !important;
}

.gap8 {
	gap: 8px !important;
}

.gap12 {
	gap: 12px !important;
}

.gap16 {
	gap: 16px !important;
}

.gap20 {
	gap: 20px !important;
}

.gap24 {
	gap: 24px !important;
}

.gap40 {
	gap: 40px !important;
}

.gap80 {
	gap: 80px !important;
}

.m0 {
	margin: 0px !important;
}

.mt0 {
	margin-top: 0px !important;
}

.mr0 {
	margin-right: 0px !important;
}

.mb0 {
	margin-bottom: 0px !important;
}

.ml0 {
	margin-left: 0px !important;
}

.m4 {
	margin: 4px !important;
}

.mt4 {
	margin-top: 4px !important;
}

.mr4 {
	margin-right: 4px !important;
}

.mb4 {
	margin-bottom: 4px !important;
}

.ml4 {
	margin-left: 4px !important;
}

.m6 {
	margin: 6px !important;
}

.mt6 {
	margin-top: 6px !important;
}

.mr6 {
	margin-right: 6px !important;
}

.mb6 {
	margin-bottom: 6px !important;
}

.ml6 {
	margin-left: 6px !important;
}

.m8 {
	margin: 8px !important;
}

.mt8 {
	margin-top: 8px !important;
}

.mr8 {
	margin-right: 8px !important;
}

.mb8 {
	margin-bottom: 8px !important;
}

.ml8 {
	margin-left: 8px !important;
}

.m12 {
	margin: 12px !important;
}

.mt12 {
	margin-top: 12px !important;
}

.mr12 {
	margin-right: 12px !important;
}

.mb12 {
	margin-bottom: 12px !important;
}

.ml12 {
	margin-left: 12px !important;
}

.m16 {
	margin: 16px !important;
}

.mt16 {
	margin-top: 16px !important;
}

.mr16 {
	margin-right: 16px !important;
}

.mb16 {
	margin-bottom: 16px !important;
}

.ml16 {
	margin-left: 16px !important;
}

.m20 {
	margin: 20px !important;
}

.mt20 {
	margin-top: 20px !important;
}

.mr20 {
	margin-right: 20px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}

.ml20 {
	margin-left: 20px !important;
}

.m24 {
	margin: 24px !important;
}

.mt24 {
	margin-top: 24px !important;
}

.mr24 {
	margin-right: 24px !important;
}

.mb24 {
	margin-bottom: 24px !important;
}

.ml24 {
	margin-left: 24px !important;
}

.m40 {
	margin: 40px !important;
}

.mt40 {
	margin-top: 40px !important;
}

.mr40 {
	margin-right: 40px !important;
}

.mb40 {
	margin-bottom: 40px !important;
}

.ml40 {
	margin-left: 40px !important;
}

.p0 {
	padding: 0px !important;
}

.pt0 {
	padding-top: 0px !important;
}

.pr0 {
	padding-right: 0px !important;
}

.pb0 {
	padding-bottom: 0px !important;
}

.pl0 {
	padding-left: 0px !important;
}

.p4 {
	padding: 4px !important;
}

.pt4 {
	padding-top: 4px !important;
}

.pr4 {
	padding-right: 4px !important;
}

.pb4 {
	padding-bottom: 4px !important;
}

.pl4 {
	padding-left: 4px !important;
}

.p6 {
	padding: 6px !important;
}

.pt6 {
	padding-top: 6px !important;
}

.pr6 {
	padding-right: 6px !important;
}

.pb6 {
	padding-bottom: 6px !important;
}

.pl6 {
	padding-left: 6px !important;
}

.p8 {
	padding: 8px !important;
}

.pt8 {
	padding-top: 8px !important;
}

.pr8 {
	padding-right: 8px !important;
}

.pb8 {
	padding-bottom: 8px !important;
}

.pl8 {
	padding-left: 8px !important;
}

.p12 {
	padding: 12px !important;
}

.pt12 {
	padding-top: 12px !important;
}

.pr12 {
	padding-right: 12px !important;
}

.pb12 {
	padding-bottom: 12px !important;
}

.pl12 {
	padding-left: 12px !important;
}

.p16 {
	padding: 16px !important;
}

.pt16 {
	padding-top: 16px !important;
}

.pr16 {
	padding-right: 16px !important;
}

.pb16 {
	padding-bottom: 16px !important;
}

.pl16 {
	padding-left: 16px !important;
}

.p20 {
	padding: 20px !important;
}

.pt20 {
	padding-top: 20px !important;
}

.pr20 {
	padding-right: 20px !important;
}

.pb20 {
	padding-bottom: 20px !important;
}

.pl20 {
	padding-left: 20px !important;
}

.p24 {
	padding: 24px !important;
}

.pt24 {
	padding-top: 24px !important;
}

.pr24 {
	padding-right: 24px !important;
}

.pb24 {
	padding-bottom: 24px !important;
}

.pl24 {
	padding-left: 24px !important;
}

.p40 {
	padding: 40px !important;
}

.pt40 {
	padding-top: 40px !important;
}

.pr40 {
	padding-right: 40px !important;
}

.pb40 {
	padding-bottom: 40px !important;
}

.pl40 {
	padding-left: 40px !important;
}

:root {
	/* background */
	--bgcolor-top: #;
	--bgcolor-bottom: #;
	--bgcolor-primary: #250088;
	--bgcolor-lightGray: #f5f5f5;
	--text-bgcolor: #fff;
	/* 텍스트 Color */
	--text-default: $base-color;
	--text-color: #595959;
	--text-disabled: #8c8c8c;
	--text-heading: #1f1f1f;
	--text-title: #262626;
	--text-primary: #250088;
	--text-blue: #4772d8;
	--text-green: #24883e;
	--text-purple: #6c5abc;
	/* 버튼 BgColor */
	--btn-text-color: #fff;
	--btn-bgcolor-primary: #250088;
	--btn-bgcolor-primary-hover: #170055;
	--btn-bgcolor-blue: #4772d8;
	--btn-bgcolor-blue-hover: #193c8d;
	--btn-bgcolor-green: #24883e;
	--btn-bgcolor-green-hover: #0f4e1f;
	--btn-bgcolor-purple: #6c5abc;
	--btn-bgcolor-purple-hover: #3f2f87;
	--btn-bgcolor-disabled: #f0f0f0;
	/* 테두리 컬러 */
	--border-default: #ccc;
	--border-focus: #256ef4;
	--border-hover: #222222;
	--border-light: #f0f0f0;
	--border-primary: #250088;
	--border-blue: #4772d8;
	--border-green: #24883e;
	--border-purple: #6c5abc;
	/* 뱃지 컬러 */
	--badge-bgcolor-red: #e33642;
	/* Tool BgColor */
	--tool-bgcolor: #434343;
	--tool-bgcolor-dim: rgba(0, 0, 0, 0.94);
	--tool-txt-color: #fff;
}

html {
	font-size: 10px;
}

html[lang=ko-KR],
html[lang=ko] {
	font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", sans-serif;
}

html[lang=ko-KR] body,
html[lang=ko] body {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: #262626;
}

html[lang=en],
html *[lang=en] {
	font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", sans-serif;
}

html[lang=en] body,
html *[lang=en] body {
	font-size: 16px;
	font-weight: 400;
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
	-webkit-text-size-adjust: 100%;
}

main {
	display: block;
}

pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
}

b,
strong {
	font-weight: bolder;
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

img {
	border-style: none;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
[type=button],
[type=reset],
[type=submit] {
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

legend {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

progress {
	vertical-align: baseline;
}

textarea {
	overflow: auto;
}

[type=checkbox],
[type=radio] {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
	height: auto;
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}

[type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

details {
	display: block;
}

summary {
	display: list-item;
}

template {
	display: none;
}

[hidden] {
	display: none;
}

/* reset */
html * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
figure,
legend,
input,
textarea,
button,
p,
blockquote,
th,
td,
form,
fieldset,
blockquote,
iframe {
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

article,
aside,
canvas,
details,
embed,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary {
	display: block;
}

command,
datalist,
keygen,
mark,
meter,
progress,
rp,
rt,
ruby,
time,
wbr {
	display: inline;
}

img {
	display: inline-block;
	vertical-align: top;
	max-width: 100%;
	border: 0;
	image-rendering: -moz-crisp-edges;
	/* firefox */
	image-rendering: -o-crisp-edges;
	/* opera */
	image-rendering: -webkit-optimize-contrast;
	/* chrome(비표준) */
	image-rendering: crisp-edges;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

fieldset {
	border: 0;
}

ul,
ol,
li {
	list-style: none;
}

pre {
	white-space: pre-wrap;
}

legend,
caption {
	position: relative;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	border: 0;
	padding: 0;
	white-space: nowrap;
	clear: both;
}

a {
	color: inherit;
	cursor: pointer;
	background-color: transparent;
}

a:link {
	text-decoration: none;
}

a:hover,
a:focus,
a:active,
a:visited {
	text-decoration: none;
}

em,
i,
address,
cite {
	font-style: normal;
	font-weight: normal;
}

input,
textarea,
select,
button,
table {
	font-size: inherit;
	font-family: inherit;
	border: 0;
	background-color: transparent;
}

button,
select {
	cursor: pointer;
}

textarea,
input,
select {
	border-radius: 0;
	border: 0;
	outline-color: -moz-use-text-color;
	outline-width: medium;
}

textarea {
	resize: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

label {
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

table {
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0;
}

th,
td {
	border-collapse: collapse;
}

select::-ms-expand {
	display: none;
}

/* 테넌트관리 */
.listBox>ul {
	padding-left: 10px;
}

.listBox>ul>li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 12px;
}

.listBox>ul>li .tit {
	color: #767676;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	position: relative;
}

.listBox>ul>li .tit.accent {
	color: #222;
	font-weight: 600;
}

.listBox>ul>li .tit::before {
	content: "";
	position: absolute;
	left: -10px;
	top: 8px;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: #767676;
}

.listBox>ul>li .con {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.listBox>ul>li .dat {
	color: #767676;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: -0.2px;
}

.listBox>ul li:last-child {
	margin-bottom: 0;
}

.solution {
	height: calc(100% - 254px);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	overflow: hidden !important;
}

.solution .row .titArea {
	border: 0;
	padding: 12px 0 12px;
}

.solution .row:first-child .titArea {
	padding-top: 0;
	border-bottom: 1px solid #ddd;
}

.solution .row:nth-of-type(1) {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
}

.solution .row:nth-of-type(2) {
	-webkit-box-flex: 2;
	-ms-flex: 2 1 0px;
	flex: 2 1 0;
}

.solution .row:nth-of-type(3) {
	-webkit-box-flex: 2;
	-ms-flex: 2 1 0px;
	flex: 2 1 0;
}

.cardBox {
	height: calc(100% - 12px);
}

.cardBox>ul {
	height: calc(100% - 70px);
	min-height: 100px;
	gap: 12px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardBox>ul>li {
	position: relative;
	border-radius: 8px;
	border: 1px solid #ddd;
	background: #fff;
	width: 100%;
	min-height: 100px;
}

.cardBox>ul>li>.tit {
	position: absolute;
	top: 16px;
	left: 16px;
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	opacity: 0.5;
}

.cardBox>ul>li .cou {
	position: absolute;
	bottom: 16px;
	right: 16px;
	color: #222;
	text-align: right;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.5px;
	opacity: 0.5;
}

.cardBox .progressbarWrap {
	opacity: 0.5;
	/* 전체 영역 */
	/* 진행된 */
}

.cardBox .progressbarWrap progress {
	border: none;
	border-radius: 10px;
	overflow: hidden;
	width: 100%;
	height: 6px;
}

.cardBox .progressbarWrap progress::-webkit-progress-bar {
	background-color: #eee;
	border-radius: 10px;
}

.cardBox .progressbarWrap progress::-webkit-progress-value {
	background-color: var(--btn-bgcolor-primary);
	border-radius: 10px;
	-webkit-transition: width 0.3s ease;
	transition: width 0.3s ease;
}

.cardBox.active ul li .tit {
	opacity: 1;
}

.cardBox.active ul li .cou {
	opacity: 1;
}

.cardBox.active .progressbarWrap {
	opacity: 1;
}

.cardBox.type2>ul {
	height: 125px;
}

.cardBox.type2>ul>li {
	padding: 16px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardBox.type2>ul>li>.tit {
	position: static;
	opacity: 1;
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.cardBox.type2>ul>li .cou {
	opacity: 1;
	position: static;
	text-align: left;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.cardBox.type2>ul>li .cou b {
	font-size: 36px;
	font-weight: 700;
	padding-right: 5px;
}

.cardBox.type2>ul>li .inf {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.cardBox.type2>ul>li .inf b {
	padding: 0px 3px 0px 5px;
}

.cardBox.type2>ul>li:hover {
	background: #688bdf;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.cardBox.type2>ul>li:hover .tit {
	color: #fff;
}

.cardBox.type2>ul>li:hover .cou {
	color: #fff;
}

.cardBox.type2>ul>li:hover .inf {
	color: #fff;
}

.cardBox.type2>ul>li:hover .inf .ico {
	-webkit-filter: brightness(10);
	filter: brightness(10);
}

.cardBox.type3 {
	height: auto;
	margin-bottom: 8px;
}

.cardBox.type3>ul {
	overflow-x: auto;
	height: auto;
	padding-bottom: 4px;
}

.cardBox.type3>ul>li {
	min-width: 250px;
	height: 120px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardBox.type3>ul>li>.tit {
	position: static;
	padding: 8px 16px;
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	opacity: 1;
	border-bottom: 1px solid #ddd;
}

.cardBox.type3>ul>li .con {
	padding: 8px 16px;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	height: 100%;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	word-break: break-word;
}

.cardBox.type3>ul>li .con textarea {
	border: 0;
	padding: 0;
}

.cardBox.type3>ul>li .dat {
	padding: 8px 16px 8px;
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.cardBox.type3>ul.fdC {
	gap: 16px;
}

.cardBox.type4 {
	height: auto;
}

.cardBox.type4>ul {
	overflow-x: auto;
	height: auto;
	padding-bottom: 4px;
}

.cardBox.type4>ul>li {
	min-width: 19.6%;
	height: 158px;
	padding: 16px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.cardBox.type4>ul>li>.tit {
	position: static;
	margin-bottom: 8px;
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
	opacity: 1;
}

.cardBox.type4>ul>li>.con .listBox ul li {
	margin-bottom: 4px;
}

.cardBox.type4>ul>li:hover {
	background: #4c9e61;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.cardBox.type4>ul>li:hover .tit {
	color: #fff;
}

.cardBox.type4>ul>li:hover .tit::before {
	background: #fff;
}

.cardBox.type4>ul>li:hover .con {
	color: #fff;
}

.cardBox.type5 ul li {
	height: 120px;
	padding: 16px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardBox.type5 ul li>div {
	opacity: 1;
}

.cardBox.type5 ul li .tit {
	padding: 0;
	position: static;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardBox.type5 ul li .tit .title {
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.cardBox.type5 ul li .tit .badge {
	border-radius: 100px;
	border: 1px solid #bbb;
	background: #fff;
	height: 22px;
	line-height: 20px;
	padding: 0px 16px;
	color: #222;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.cardBox.type5 ul li .con {
	padding: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.cardBox.type5 ul li .con .ico {
	margin-right: 5px;
	width: 16px;
	height: 16px;
}

.cardBox.type5 ul li .con .cou {
	position: static;
	opacity: 1;
}

.cardBox.type5 ul li:hover {
	background: #4c9e61;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.cardBox.type5 ul li:hover .tit .title {
	color: #fff;
}

.cardBox.type5 ul li:hover .con .txt {
	color: #fff;
}

.cardBox.type5 ul li:hover .con .ico {
	-webkit-filter: invert(1) brightness(10);
	filter: invert(1) brightness(10);
}

.cardBox.type5 ul li:hover .con .cou {
	color: #fff;
}

.borderBot {
	border-bottom: 8px solid #e3e5e8;
}

/* 챗 대시보드 */
.countBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.countBox .lA {
	color: #222;
	font-size: 14px;
	line-height: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.countBox .lA strong {
	font-size: 36px;
	line-height: 36px;
	font-weight: 700;
}

.countBox .rA .dote {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #2bc840;
}

.countBox .rA .dote.wait {
	background: #2bc840;
}

.countBox .rA .dote.logoff {
	background: #969696;
}

.countBox .rA .dote.error {
	background: #de3412;
}

.countBox .rA .dote.leave {
	background: #ffb114;
}

.countBox .rA span {
	font-size: 14px;
	line-height: 14px;
	font-weight: 400;
}

.countBox .rA span strong {
	font-weight: 700;
}

.countBox.type2 .rA strong {
	font-size: 36px;
	line-height: 36px;
	font-weight: 700;
}

.cardList {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 8px;
	min-height: 60px;
}

.cardList .card {
	width: 100%;
	height: 100%;
	padding: 8px;
	border-radius: 8px;
	border: 1px solid #969696;
	background: rgba(150, 150, 150, 0.1);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.cardList .card.wait {
	border: 1px solid #228738;
	background: rgba(34, 135, 56, 0.1);
}

.cardList .card.wait .tit {
	color: #228738;
}

.cardList .card.wait .con {
	color: #228738;
}

.cardList .card.logon {
	border: 1px solid #4876ef;
	background: rgba(72, 118, 239, 0.1);
}

.cardList .card.logon .tit {
	color: #4876ef;
}

.cardList .card.logon .con {
	color: #4876ef;
}

.cardList .card.leave {
	border: 1px solid #ffb114;
	background: rgba(255, 177, 20, 0.1);
}

.cardList .card.leave .tit {
	color: #ffb114;
}

.cardList .card.leave .con {
	color: #ffb114;
}

.cardList .card.logoff {
	border: 1px solid #969696;
	background: rgba(150, 150, 150, 0.1);
}

.cardList .card.logoff .tit {
	color: #222;
}

.cardList .card.logoff .con {
	color: #222;
}

.cardList .card .tit {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.cardList .card .con {
	text-align: right;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.cardList .card .con strong {
	font-size: 20px;
	font-weight: 700;
}

.innerHover .inner:hover {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	border: 1px solid var(--bgcolor-primary-hover) !important;
	background: var(--bgcolor-primary-hover) !important;
	-webkit-box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
}

.innerHover .inner:hover .titArea .titBox h4 {
	color: #fff;
}

.innerHover .inner:hover .conArea .countBox .lA {
	color: #fff;
}

.innerHover .inner:hover .conArea .countBox .rA span {
	color: #fff;
}

.innerHover .inner:hover .conArea .countBox .rA strong {
	color: #fff;
}

.innerHover .inner:hover .conArea .cardList .card {
	border: 1px solid #fff;
	background: rgba(255, 255, 255, 0.1);
}

.innerHover .inner:hover .conArea .cardList .card .tit {
	color: #fff;
}

.innerHover .inner:hover .conArea .cardList .card .con {
	color: #fff;
}

.chatBotType .innerHover .inner:hover {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	border: 1px solid #4c9e61 !important;
	background: #4c9e61 !important;
	-webkit-box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
}

.callBotType .innerHover .inner:hover {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	border: 1px solid var(--border-purple) !important;
	background: var(--btn-bgcolor-purple) !important;
	-webkit-box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.25);
}

.chartArea {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	height: 100%;
}

.chartArea .row {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.chartArea .row .chartBox {
	border: 1px solid #ddd;
	height: calc(100% - 46px);
}

.counselList ul li {
	padding: 16px;
	border-bottom: 1px solid #ddd;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.counselList ul li .lA {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 12px;
}

.counselList ul li .lA .thum {
	width: 48px;
	height: 48px;
}

.counselList ul li .lA .info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.counselList ul li .lA .info .name {
	color: #1a1a1a;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.counselList ul li .lA .info .time {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.counselList ul li .rA .state {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.counselList ul li .rA .state .dote {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	background: #228738;
}

.counselList ul li .rA .state .txt {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	margin-left: 4px;
}

.counselList ul li .rA .state.progress .dote {
	background: #228738;
}

.counselList ul li .rA .state.wait .dote {
	background: #2bc840;
}

.counselList ul li .rA .state.logoff .dote {
	background: #969696;
}

.counselList ul li .rA .state.error .dote {
	background: #de3412;
}

.counselList ul li .rA .state.leave .dote {
	background: #ffb114;
}

.counselList ul li:last-child {
	border-bottom: 0;
}

.state {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.state .dote {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	background: #228738;
}

.state .txt {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	margin-left: 4px;
}

.state.progress .dote {
	background: #228738;
}

.state.wait .dote {
	background: #2bc840;
}

.state.logon .dote {
	background: #4876ef;
}

.state.logoff .dote {
	background: #969696;
}

.state.error .dote {
	background: #de3412;
}

.state.leave .dote {
	background: #ffb114;
}

.titArea .state {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.titArea .state .dote {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: 0px solid rgba(0, 0, 0, 0.1);
	background: #d9d9d9;
}

.counselListCount ul li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 12px;
	padding: 16px;
	border-bottom: 1px solid #ddd;
}

.counselListCount ul li .lA .thum {
	width: 48px;
	height: 48px;
}

.counselListCount ul li .rA {
	width: 100%;
	overflow: hidden;
}

.counselListCount ul li .rA .idBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-bottom: 3px;
}

.counselListCount ul li .rA .idBox .id {
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.counselListCount ul li .rA .idBox .id .state {
	display: inline-block;
	border-radius: 100px;
	border: 1px solid rgba(109, 120, 130, 0.5);
	background: rgba(109, 120, 130, 0.1);
	width: 48px;
	height: 24px;
	text-align: center;
	line-height: 22px;
	padding: 0 8px;
	margin-left: 8px;
	color: #6d7882;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.counselListCount ul li .rA .idBox .id .state.wait {
	border: 1px solid rgba(109, 120, 130, 0.5);
	background: rgba(109, 120, 130, 0.1);
	color: #6d7882;
}

.counselListCount ul li .rA .idBox .id .state.consul {
	background: rgba(72, 118, 239, 0.1);
	border: 1px solid rgba(72, 118, 239, 0.5);
	color: #4876ef;
}

.counselListCount ul li .rA .idBox .id .state.complete {
	background: rgba(34, 135, 56, 0.1);
	border: 1px solid rgba(34, 135, 56, 0.5);
	color: #228738;
}

.counselListCount ul li .rA .idBox .id .state.process {
	background: rgba(255, 177, 20, 0.1);
	border: 1px solid rgba(255, 177, 20, 0.5);
	color: #ffb114;
}

.counselListCount ul li .rA .idBox .date {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.counselListCount ul li .rA .txtBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 16px;
}

.counselListCount ul li .rA .txtBox .txt {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.counselListCount ul li .rA .txtBox .count.zero {
	display: none;
}

.counselListCount ul li .rA .txtBox .count span {
	display: inline-block;
	width: 18px;
	height: 18px;
	line-height: 18px;
	border-radius: 100px;
	background: #e6603d;
	text-align: center;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
}

.historyList ul li {
	padding: 12px 0px;
	border-bottom: 1px solid #ddd;
}

.historyList ul li:first-child {
	padding-top: 0;
}

.historyList ul li:last-child {
	border-bottom: 0;
}

.historyList ul li .pathBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-bottom: 5px;
}

.historyList ul li .pathBox .pat {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.historyList ul li .pathBox .pat span {
	color: var(--text-primary);
}

.historyList ul li .pathBox .dat {
	color: #767676;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.historyList ul li .subject {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.chatWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	background: #e3eaf9;
	overflow: hidden;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.chatWrap .chatBody {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	padding: 16px;
	overflow-y: auto;
}

.chatWrap .chatDate {
	width: 90px;
	height: 30px;
	line-height: 29px;
	padding: 0 16px;
	text-align: center;
	font-size: 14px;
	color: #666;
	margin: 0px auto 12px;
	position: relative;
	border-radius: 100px;
	border: 1px solid rgba(71, 114, 216, 0.5);
	background: rgba(255, 255, 255, 0.7);
	color: var(--text-primary);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.chatWrap .chatMsg {
	margin-bottom: 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.chatWrap .chatMsg .time {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 4px;
}

.chatWrap .chatMsg .time strong {
	font-weight: 600;
}

.chatWrap .chatMsg .bubble {
	max-width: 80%;
	padding: 10px 14px;
	border-radius: 8px;
	line-height: 1.4;
	font-size: 14px;
	word-break: keep-all;
}

.chatWrap .chatMsg.user {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}

.chatWrap .chatMsg.user .bubble {
	background: #fff;
	-webkit-box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.1);
	box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.1);
	color: #333;
}

.chatWrap .chatMsg.agent {
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.chatWrap .chatMsg.agent .bubble {
	background: #395bad;
	color: #fff;
}

.chatWrap .chatFoot {
	background: #fff;
	border-top: 1px solid #d9dbe0;
	padding: 8px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 10px;
}

.chatWrap .chatFoot .inputBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	border-bottom: 1px solid #ddd;
}

.chatWrap .chatFoot .inputBox textarea {
	border: 0;
	min-height: 60px;
}

.chatWrap .chatFoot .inputBox .sendBtn {
	background: #4b6ef6;
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 8px 16px;
	font-size: 14px;
	cursor: pointer;
	-webkit-transition: background 0.2s;
	-o-transition: background 0.2s;
	transition: background 0.2s;
}

.chatWrap .chatFoot .inputBox .sendBtn:hover {
	background: #3a5be0;
}

.chatWrap .chatFoot .chatBtns {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.chatWrap .chatFoot .chatBtns .lA {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 8px;
}

.chatWrap .chatFoot .chatBtns .rA {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.chatWrap .chatFoot .chatBtns .rA .fileBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	position: relative;
}

.chatWrap .chatFoot .chatBtns .rA .fileBox .fileInput {
	display: none;
}

.chatWrap .chatFoot .chatBtns .rA .fileBox .fileLabel {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	font-size: 20px;
	background: #fff;
	margin-right: 8px;
	cursor: pointer;
}

.chatWrap .chatFoot .chatBtns .rA .fileBox .fileName {
	display: inline-block;
	font-size: 13px;
	color: #444;
	max-width: 80px;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-right: 16px;
}

.chatWrap .chatFoot .chatBtns .rA .sendBtn {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	cursor: pointer;
	-webkit-transition: background 0.2s;
	-o-transition: background 0.2s;
	transition: background 0.2s;
}

.chatWrap.type2 .chatFoot {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-orient: unset;
	-webkit-box-direction: unset;
	-ms-flex-direction: unset;
	flex-direction: unset;
	padding: 18px 20px;
}

.chatWrap.type2 .chatFoot .inputBox {
	border-bottom: 0;
	width: 100%;
}

.chatWrap.type2 .chatFoot .inputBox textarea {
	border: 0;
	width: 100%;
	height: 32px;
	min-height: unset;
}

.chatWrap.type2 .chatFoot .chatBtns {
	width: auto;
	white-space: nowrap;
}

/* 탭메뉴 */
.tabWrap .tabMenu {
	list-style: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 0;
	margin: 0;
	gap: 24px;
}

.tabWrap .tabMenu li {
	text-align: center;
	padding: 13px 2px;
	cursor: pointer;
	border-bottom: 2px solid transparent;
}

.tabWrap .tabMenu li.active {
	border-bottom: 2px solid #007bff;
	font-weight: bold;
}

.tabWrap .tabContent .tabPanel {
	display: none;
}

.tabWrap .tabContent .tabPanel.active {
	display: block;
}

.tabWrap.type2 .tabMenu {
	gap: 0;
}

.tabWrap.type2 .tabMenu li {
	min-width: 48px;
	height: 32px;
	line-height: 30px;
	padding: 0px 12px;
	border-radius: 6px;
	border: 1px solid #bbb;
	background: #fff;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.tabWrap.type2 .tabMenu li:first-child {
	border-radius: 6px 0px 0px 6px;
}

.tabWrap.type2 .tabMenu li:nth-child(2) {
	border-radius: 0px 6px 6px 0px;
}

.tabWrap.type2 .tabMenu li.active {
	color: var(--text-primary);
	border: 1px solid var(--border-primary);
	background: #edf1fc;
}

.tabWrap.type2.green li.active {
	color: var(--text-primary);
	border: 1px solid var(--border-primary);
	background: #eaf4ec;
}

.templateList ul li {
	padding: 8px 0px;
	border-radius: 8px;
	border: 1px solid #c3c3c3;
	background: #fff;
	margin-bottom: 8px;
}

.templateList ul li .tit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 0px 16px 8px;
	border-bottom: 1px solid #e4e4e4;
}

.templateList ul li .tit span {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.templateList ul li .tit button {
	white-space: nowrap;
	color: #222;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.templateList ul li .con {
	padding: 8px 16px 0px;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.inputArea {
	border-radius: 4px;
	border: 1px solid #c3c3c3;
	background: #fff;
	padding: 8px 3px 8px 12px;
	height: 100%;
	overflow-y: auto;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.inputArea .thinking {
	margin-top: 10px;
}

.laterProcess .proInfo {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	gap: 4px 24px;
	padding: 8px 16px;
	margin-bottom: 8px;
	border-radius: 8px;
	border: 1px solid #ccc;
	background: #fff;
}

.laterProcess .proInfo dl {
	width: 46%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.laterProcess .proInfo dl dt {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.laterProcess .proInfo dl dd {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.laterProcess .proList ul li {
	padding: 8px 0px;
	border-radius: 8px;
	border: 1px solid #c3c3c3;
	background: #fff;
	margin-bottom: 8px;
}

.laterProcess .proList ul li .tit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 0px 16px 8px;
	border-bottom: 1px solid #e4e4e4;
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.laterProcess .proList ul li .con {
	padding: 8px 16px 0px;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	min-height: 100px;
}

.laterProcess .proList ul li .con textarea {
	min-height: 90px;
	border: 0;
	padding: 0;
}

.laterProcess .proList ul li .con .pathBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 10px;
}

.laterProcess .proList ul li .con .pathBox .path {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 24px;
}

.laterProcess .proList ul li .con .pathBox .path span {
	position: relative;
}

.laterProcess .proList ul li .con .pathBox .path span::before {
	content: "";
	width: 24px;
	height: 20px;
	position: absolute;
	right: -24px;
	top: 0px;
	background: url("/img/icon/ico_arrow_gray-523dc0a9952dc84487778796b835fb16.svg") no-repeat 50%/20px;
	opacity: 0.7;
}

.laterProcess .proList ul li .con .pathBox .path span:last-child::before {
	display: none;
}

.laterProcess .proList ul li .con .pathBox .delBtn {
	width: 20px;
	height: 20px;
	background-color: #eee;
	border-radius: 50%;
	margin-left: 8px;
}

.laterProcess .proList ul li .con .radioWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 8px;
}

.laterProcess .proList ul li .con .radioWrap .col input {
	margin-right: 4px;
}

.botTxt {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 8px;
	padding: 10px 20px;
	position: relative;
}

.botTxt::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background-image: -o-repeating-linear-gradient(left, #ddd 0, #ddd 4px, transparent 4px, transparent 8px);
	background-image: repeating-linear-gradient(to right, #ddd 0, #ddd 4px, transparent 4px, transparent 8px);
}

.botTxt .inputBox {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.botTxt .inputBox input[type=text] {
	width: 60px;
	min-width: unset;
}

.botTxt .inputBox input[type=number] {
	width: 60px;
	min-width: unset;
}

.infoBox {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.messageBox {
	height: 100%;
}

.messageBox ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 8px;
	height: 100%;
}

.messageBox ul li {
	border-radius: 8px;
	border: 1px solid #ddd;
	background: #fff;
	padding: 10px 20px;
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.messageBox ul li .tit {
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.messageBox ul li .con {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.messageBox ul li .con .cou {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.messageBox ul li .con .cou strong {
	font-size: 36px;
	font-weight: 700;
	padding: 0px 4px;
}

.messageBox ul li:hover {
	border: 1px solid #688bdf;
	background: #688bdf;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.messageBox ul li:hover .tit {
	color: #fff;
}

.messageBox ul li:hover .con .ico {
	-webkit-filter: invert(1) contrast(100);
	filter: invert(1) contrast(100);
}

.messageBox ul li:hover .con .cou {
	color: #fff;
}

.chatCounType .tblList table thead th {
	background: #4067c2;
}

.chatCounType input[type=checkbox]:checked {
	background-image: url(/img/check-on-blue-75fe4531dca955525eea21c904f129a5.svg);
}

.chatBotType .tblList table thead th {
	background: #207a38;
}

.chatBotType input[type=checkbox]:checked {
	background-image: url(../img/check-on-green.svg);
}

.callBotType .tblList table thead th {
	background: var(--btn-bgcolor-purple);
}

.callBotType input[type=checkbox]:checked {
	background-image: url(../img/check-on-purple.svg);
}

.treeBox {
	min-height: 300px;
	max-height: 600px;
	overflow-y: auto;
}

.treeBox .tree-branch .contents {
	margin-top: 0;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar {
	gap: 0;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .branch-drag-handler {
	min-width: 15px;
	height: 30px;
	position: relative;
	z-index: 1;
	margin-right: 4px;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .branch-drag-handler .ico {
	text-indent: -99999999px;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .folder {
	margin-right: 8px;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .inpBox {
	position: relative;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .inpBox .branch-title {
	padding: 0px 8px;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .inpBox .delBtn {
	position: absolute;
	top: 9px;
	right: 8px;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #eaeaea;
}

.treeBox .tree-branch .contents .branch-wrapper .left-sidebar .inpBox .delBtn .ico {
	width: 15px;
	height: 15px;
	background-size: 8px;
	vertical-align: top;
}

.treeBox .tree-branch .contents .branch-wrapper .right-sidebar {
	opacity: 1;
	white-space: nowrap;
}

.treeBox .tree-branch .contents .branch-wrapper .right-sidebar button {
	color: #222;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.treeBox .tree-branch:nth-of-type(1) .branch-drag-handler {
	display: none;
}

.treeBox .tree-branch:nth-of-type(1) .right-sidebar .add-sibling {
	display: none;
}

.treeBox .ico {
	vertical-align: middle;
}

.progBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 0% 5%;
	gap: 8px;
}

.progBox progress {
	width: 100%;
	height: 6px;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
	border: none;
	background: transparent;
}

.progBox progress::-webkit-progress-bar {
	background-color: #eee;
	border-radius: 999px;
	-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
}

.progBox progress::-webkit-progress-value {
	background: #4876ef;
	border-radius: 999px;
	-webkit-transition: width 0.3s ease;
	transition: width 0.3s ease;
}

.progBox progress::-moz-progress-bar {
	background: #4876ef;
	border-radius: 999px;
}

.progBox span {
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
	width: 17%;
	display: inline-block;
	text-align: right;
}

.progress-container {
	width: 65%;
	height: 6px;
	background: #eee;
	border-radius: 50px;
	overflow: visible;
	position: relative;
	margin: 0% 10%;
}

.progress-container .progress-bar {
	height: 100%;
	width: 100%;
	background: -webkit-gradient(linear, left top, right top, from(#eb1c24), color-stop(25%, #f35724), color-stop(50%, #f8931f), color-stop(75%, #80b134), to(#3ab349));
	background: -o-linear-gradient(left, #eb1c24 0%, #f35724 25%, #f8931f 50%, #80b134 75%, #3ab349 100%);
	background: linear-gradient(to right, #eb1c24 0%, #f35724 25%, #f8931f 50%, #80b134 75%, #3ab349 100%);
	border-radius: 50px;
	position: relative;
	-webkit-clip-path: inset(0 100% 0 0);
	clip-path: inset(0 100% 0 0);
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}

.progress-container .progress-value {
	position: absolute;
	top: 50%;
	left: 100%;
	-webkit-transform: translate(10px, -50%);
	transform: translate(10px, -50%);
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
	width: 15%;
	white-space: nowrap;
	text-align: right;
}

.sopWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.sopWrap .seaArea {
	width: 35%;
	border: 1px solid #ddd;
	background: #f4f4f4;
	border-radius: 8px 0 0 8px;
}

.sopWrap .seaArea .searBox {
	padding: 8px 20px;
	border-bottom: 1px solid #ddd;
}

.sopWrap .seaArea .cardBox {
	padding: 10px 20px;
	border-bottom: 1px solid #ddd;
	height: 514px;
	overflow-y: auto;
	margin-bottom: 0;
}

.sopWrap .seaArea .cardBox ul {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.sopWrap .seaArea .cardBox ul li {
	height: 93px;
	min-height: unset;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
}

.sopWrap .seaArea .cardBox ul li.on {
	border: 2px solid var(--border-green);
}

.sopWrap .seaArea .cardBox ul li .tit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 8px 16px;
}

.sopWrap .seaArea .cardBox ul li .tit .sub {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.sopWrap .seaArea .cardBox ul li .tit .dat {
	padding: 0;
}

.sopWrap .seaArea .cardBox ul li .con {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	overflow: hidden;
	height: 50px;
	padding-bottom: 0;
}

.sopWrap .seaArea .pagiBox {
	padding: 0px 20px;
}

.sopWrap .seaArea .pagiBox #paginationWrap ul {
	width: 100%;
}

.sopWrap .seaArea .pagiBox #paginationWrap ul .pageInput {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	text-align: center;
	margin: 0 16.5%;
}

.sopWrap .seaArea .pagiBox #paginationWrap ul:last-child {
	display: none;
}

.sopWrap .inpArea {
	width: 65%;
	border: 1px solid #ddd;
	border-radius: 0px 8px 8px 0px;
}

.sopWrap .inpArea .titArea {
	padding: 8px 20px !important;
	border-bottom: 1px solid #ddd !important;
}

.sopWrap .inpArea .titArea .infoBox {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.sopWrap .inpArea .conArea {
	padding: 8px 20px 16px;
}

.sopWrap .inpArea .conArea .inpBox textarea {
	height: 367px;
	margin-bottom: 8px;
}

.sopWrap .inpArea .conArea .exBox {
	border-radius: 8px;
	border: 1px solid #ffb114;
	background: rgba(255, 177, 20, 0.1);
	padding: 16px 20px;
}

.sopWrap .inpArea .conArea .exBox h3 {
	margin-bottom: 8px;
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.sopWrap .inpArea .conArea .exBox ul {
	padding-left: 20px;
}

.sopWrap .inpArea .conArea .exBox ul li {
	list-style: disc;
}

.resultBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	height: 100%;
}

.resultBox .ico {
	margin-bottom: 8px;
}

.resultBox h3 {
	margin-bottom: 4px;
	color: var(--text-green);
	text-align: center;
	font-size: 17px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.resultBox p {
	color: #222;
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.linkPaste {
	position: relative;
	border-radius: 8px;
	border: 1px solid #ddd;
	background: #fff;
	padding: 8px;
}

.linkPaste>button {
	position: absolute;
	top: 8px;
	right: 8px;
}

.linkPaste>input {
	border: 0;
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	padding: 0 100px 0 0 !important;
}

.updownBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.updownBox .lA {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.updownBox .lA strong {
	font-weight: 700;
	padding-left: 5px;
}

.updownBox .rA {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.updownBox .rA strong {
	margin-right: 8px;
	color: #222;
	font-size: 36px;
	font-weight: 700;
	letter-spacing: -0.5px;
	line-height: 36px;
}

.updownBox .rA .updown {
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.5px;
	margin-left: 8px;
	line-height: 20px;
}

.updownBox .rA .updown.up {
	color: #de3412;
}

.updownBox .rA .updown.down {
	color: #3b82f6;
}

.actionBtn button {
	width: 22px;
	height: 22px;
	border-radius: 4px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.actionBtn button .ico {
	width: 16px;
	height: 16px;
	background-size: 16px 16px;
	background-position: center center;
}

.actionBtn button.on .ico,
.actionBtn button:hover .ico {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-webkit-filter: invert(0%) brightness(0%);
	filter: invert(0%) brightness(0%);
}

/* clearfix */
.clearfix {
	*zoom: 1;
}

.clearfix:before,
.clearfix:after {
	content: "";
	display: block;
}

.clearfix:after {
	clear: both;
}

/* common */
html,
body {
	width: 100%;
	height: 100%;
}

body {
	min-width: 1920px;
	min-height: 1080px;
}

#header,
#wrap {
	min-width: 1920px;
}

#wrap {
	position: relative;
	width: 100%;
	height: calc(100% - 56px);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background: #f0f4f7;
}

/* hidden */
.blind {
	position: absolute;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	border: 0;
	padding: 0;
	white-space: nowrap;
}

/* dim */
#dim {
	position: fixed;
	display: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 1100;
}

html.is-locked body {
	height: calc(var(--window-inner-height) - 1px);
	overflow: hidden;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html.is-locked #wrap {
	position: fixed;
}

/* req */
.req {
	color: #f55;
	font-size: 14px;
	font-weight: 700;
	margin-left: 3px;
}

/* display */
.disShow {
	display: block !important;
}

.disHide {
	display: none !important;
}

/* align */
.ac {
	text-align: center !important;
}

.ar {
	text-align: right !important;
}

.al {
	text-align: left !important;
}

.flex {
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
}

.aiC {
	-webkit-box-align: center !important;
	-ms-flex-align: center !important;
	align-items: center !important;
}

.aiS {
	-webkit-box-align: start !important;
	-ms-flex-align: start !important;
	align-items: flex-start !important;
}

.aiE {
	-webkit-box-align: end !important;
	-ms-flex-align: end !important;
	align-items: flex-end !important;
}

.jcB {
	-webkit-box-pack: justify !important;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
}

.jcS {
	-webkit-box-pack: start !important;
	-ms-flex-pack: start !important;
	justify-content: flex-start !important;
}

.jcE {
	-webkit-box-pack: end !important;
	-ms-flex-pack: end !important;
	justify-content: flex-end !important;
}

.fdC {
	-webkit-box-orient: vertical !important;
	-webkit-box-direction: normal !important;
	-ms-flex-direction: column !important;
	flex-direction: column !important;
}

.fwN {
	-ms-flex-wrap: nowrap !important;
	flex-wrap: nowrap !important;
}

.fwW {
	-ms-flex-wrap: wrap !important;
	flex-wrap: wrap !important;
}

.vaT {
	vertical-align: top !important;
}

.vaM {
	vertical-align: middle !important;
}

.vaB {
	vertical-align: bottom !important;
}

.fwW {
	-ms-flex-wrap: wrap !important;
	flex-wrap: wrap !important;
}

.flex0 {
	-webkit-box-flex: 0 !important;
	-ms-flex: 0 !important;
	flex: 0 !important;
}

.flex1 {
	-webkit-box-flex: 1 !important;
	-ms-flex: 1 !important;
	flex: 1 !important;
}

/* auto */
.hAuto {
	height: auto !important;
}

.h100 {
	height: 100% !important;
}

/* overflow */
.ofH {
	overflow: hidden !important;
}

.ofA {
	overflow: auto !important;
}

/* border */
.noBorder {
	border: 0 !important;
}

/* padding */
.noPadding {
	padding: 0 !important;
}

/* accent */
.accentTxt {
	color: #222 !important;
	font-weight: 600 !important;
}

.fcBlue {
	color: #4876ef !important;
}

.fcRed {
	color: #de3412 !important;
}

/* 말줄임 */
.ellipsis {
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
}

.formArea,
.btnArea {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 8px;
}

.inputBox,
.formBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 8px;
}

.formArea ul {
	width: 100%;
}

.formArea ul li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-top: 8px;
	gap: 80px;
	min-height: 55px;
}

.formArea ul li dl {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
}

.formArea ul li dl dt {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	min-width: 90px;
	white-space: nowrap;
	margin-top: 5px;
	height: 100%;
}

.formArea ul li dl dd {
	gap: 10px;
	width: 100%;
}

.formArea ul li dl dd .inputBox {
	width: 100%;
}

.formArea ul li dl dd .inputBox input {
	/* width: 100%; */
}

.formArea ul li dl dd .inputBox .row {
	position: relative;
}

.formArea ul li dl dd .inputBox .row>input {
	padding: 0 50px 0 12px;
}

.formArea ul li dl dd .inputBox .row .subTxt {
	position: absolute;
	right: 12px;
	top: 6px;
	color: #999;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.formArea ul li dl dd .inputBox .row.left>input {
	padding: 0 12px 0 80px;
}

.formArea ul li dl dd .inputBox .row.left .subTxt {
	right: auto;
	left: 12px;
}

.formArea ul li dl dd .inputBox.time {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.formArea ul li dl dd .inputBox.time input {
	padding: 0px 8px;
	width: 40px;
	min-width: unset;
}

.formArea ul li dl dd .inputBox.day button {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	padding: 0;
	text-align: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	background: #eee;
}

.formArea ul li dl dd .inputBox.day button.on {
	background: #fff;
	border: 1px solid var(--border-purple);
	color: var(--text-purple);
}

.formArea ul li dl dd .inputBox.day button.all {
	border-radius: 50px;
	min-width: 50px;
	width: auto;
	white-space: nowrap;
}

.formArea.type2 ul li dl dt {
	margin: 0;
	height: auto;
}

.formArea.type2 ul li dl dd {
	width: unset;
}

.formArea.doteLine {
	border-bottom: 1px dashed #ddd;
}

.stateLabel {
	background: #fff;
	border: 1px solid var(--border-default);
	color: var(--text-color);
	display: inline-block;
	border-radius: 100px;
	padding: 3px 10px 4px;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: -0.5px;
	line-height: normal;
	min-width: 46px;
}

.stateLabel.active {
	border: 1px solid rgba(34, 135, 56, 0.5);
	background: rgba(34, 135, 56, 0.1);
	color: #228738;
}

.stateLabel.red {
	border: 1px solid rgba(222, 52, 18, 0.5);
	background: #fcebe8;
	color: #de3412;
}

.stateLabel.yellow {
	border: 1px solid rgba(255, 177, 20, 0.5);
	background: #fff8e8;
	color: #ffb114;
}

.stateLabel.green {
	border: 1px solid rgba(34, 135, 56, 0.5);
	background: #e9f3ec;
	color: #228738;
}

.stateLabel.gray {
	border: 1px solid rgba(150, 150, 150, 0.5);
	background: #f5f5f5;
	color: #969696;
}

.stateLabel.blue {
	border: 1px solid rgba(72, 118, 239, 0.5);
	background: rgba(72, 118, 239, 0.1);
	color: #4876ef;
}

.stateLabel.type2 {
	border: 0;
	border-radius: 4px;
	background: rgba(36, 136, 62, 0.1);
	height: 24px;
	line-height: 16px;
	color: var(--text-green);
	font-size: 14px;
	font-weight: 600;
}

.stateLabel.type3.blue {
	background: #4876ef;
	color: #fff;
}

.btnArea {
	padding-top: 8px;
	margin-top: 16px;
}

.btnArea.left {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
}

.btnArea.right {
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

.btnArea.borderTop {
	border-top: 1px solid #ddd;
}

/* btn */
[class^=btn] {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
}

[class^=btn][class*=outline] {
	background: #fff;
	border: 1px solid var(--border-default);
	color: var(--text-color);
}

[class^=btn][class*=primary] {
	background-color: var(--btn-bgcolor-primary);
	color: var(--btn-text-color);
}

[class^=btn][class*=primary]:hover,
[class^=btn][class*=primary]:focus {
	background-color: var(--btn-bgcolor-primary-hover);
}

[class^=btn][class*=blue] {
	background: var(--btn-bgcolor-blue);
	border: 1px solid var(--border-blue);
	color: #fff;
}

[class^=btn][class*=blue]:hover,
[class^=btn][class*=blue]:focus {
	background-color: var(--btn-bgcolor-blue-hover);
}

[class^=btn][class*=outlineBlue] {
	background: #fff;
	border: 1px solid var(--border-blue);
	color: var(--text-blue);
}

[class^=btn][class*=green] {
	background: var(--btn-bgcolor-green);
	border: 1px solid var(--border-green);
	color: #fff;
}

[class^=btn][class*=green]:hover,
[class^=btn][class*=green]:focus {
	background-color: var(--btn-bgcolor-green-hover);
}

[class^=btn][class*=outlineGreen] {
	background: #fff;
	border: 1px solid var(--btn-bgcolor-green);
	color: var(--text-green);
}

[class^=btn][class*=purple] {
	background: var(--btn-bgcolor-purple);
	border: 1px solid var(--border-purple);
	color: #fff;
}

[class^=btn][class*=purple]:hover,
[class^=btn][class*=purple]:focus {
	background-color: var(--btn-bgcolor-purple-hover);
}

[class^=btn][class*=outlinePurple] {
	background: #fff;
	border: 1px solid var(--border-purple);
	color: var(--text-purple);
}

[class^=btn][class*=xs] {
	padding: 0 12px;
	border-radius: 4px;
	min-height: 22px;
}

[class^=btn][class*=sm] {
	padding: 0 12px;
	border-radius: 4px;
	min-height: 24px;
}

[class^=btn][class*=md] {
	padding: 0 16px;
	border-radius: 4px;
	min-height: 32px;
}

[class^=btn][class*=lg] {
	padding: 0 24px;
	border-radius: 4px;
	min-height: 48px;
}

[class^=btn][class*=xlg] {
	padding: 0 32px;
	border-radius: 4px;
	min-height: 56px;
}

[class^=btn][class*=full] {
	width: 100%;
}

[class^=btn]:disabled {
	pointer-events: none;
	background-color: var(--btn-bgcolor-disabled);
	color: var(--text-disabled);
}

[class^=btn]:disabled:hover,
[class^=btn]:disabled:focus {
	background-color: var(--btn-bgcolor-disabled);
	color: var(--text-disabled);
}

[class^=btn].dis {
	pointer-events: none;
	border: 1px solid #bbb;
	color: #bbb;
}

[class^=btn].dis .ico {
	-webkit-filter: grayscale(1);
	filter: grayscale(1);
	opacity: 0.7;
}

/* form */
input,
textarea,
select {
	background: #fff;
	border: 1px solid var(--border-default);
	color: #222;
	width: 100%;
}

input[class*=xs],
textarea[class*=xs],
select[class*=xs] {
	padding: 0 12px;
	border-radius: 4px;
	min-height: 22px;
}

input[class*=sm],
textarea[class*=sm],
select[class*=sm] {
	padding: 0 12px;
	border-radius: 4px;
	min-height: 24px;
}

input[class*=md],
textarea[class*=md],
select[class*=md] {
	padding: 0 16px;
	border-radius: 4px;
	min-height: 32px;
}

input[class*=lg],
textarea[class*=lg],
select[class*=lg] {
	padding: 0 24px;
	border-radius: 4px;
	min-height: 48px;
}

input[class*=xlg],
textarea[class*=xlg],
select[class*=xlg] {
	padding: 0 32px;
	border-radius: 4px;
	min-height: 56px;
}

textarea {
	line-height: 2;
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	min-width: 120px;
	border-radius: 4px;
	padding: 8px;
}

textarea:hover {
	border-color: var(--border-hover);
}

textarea:focus {
	border-color: var(--border-focus);
	outline: 1px solid var(--border-focus);
}

textarea.error {
	border-color: #de3412;
}

textarea.error:focus {
	border-color: #de3412;
	outline: 1px solid #de3412;
}

textarea:disabled {
	border: 1px solid #e4e4e4;
	background: #f1f1f1;
	color: #bbb;
}

textarea:-moz-read-only {
	background: #f1f1f1;
}

textarea:read-only {
	background: #f1f1f1;
}

textarea::-webkit-input-placeholder {
	color: #bbb;
}

textarea::-moz-placeholder {
	color: #bbb;
}

textarea:-ms-input-placeholder {
	color: #bbb;
}

textarea::-ms-input-placeholder {
	color: #bbb;
}

textarea::placeholder {
	color: #bbb;
}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url("/img/icon/ico_arrow_sm-aadb0ffdb07f0b207ef036c5ce79ce68.svg") calc(100% - 5px) center no-repeat;
	min-width: 120px;
	padding: 0 28px 0 8px !important;
}

select:hover {
	border-color: var(--border-hover);
}

select:focus {
	border-color: var(--border-focus);
	outline: 1px solid var(--border-focus);
}

select.error {
	border-color: #de3412;
}

select.error:focus {
	border-color: #de3412;
	outline: 1px solid #de3412;
}

select:disabled {
	border: 1px solid #e4e4e4;
	background: #f1f1f1;
	color: #bbb;
}

input[type=text],
input[type=tel],
input[type=number] {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	min-width: 120px;
	height: 32px;
	border-radius: 4px;
}

input[type=text]:hover,
input[type=tel]:hover,
input[type=number]:hover {
	border-color: var(--border-hover);
}

input[type=text]:focus,
input[type=tel]:focus,
input[type=number]:focus {
	border-color: var(--border-focus);
	outline: 1px solid var(--border-focus);
}

input[type=text].error,
input[type=tel].error,
input[type=number].error {
	border-color: #de3412;
}

input[type=text].error:focus,
input[type=tel].error:focus,
input[type=number].error:focus {
	border-color: #de3412;
	outline: 1px solid #de3412;
}

input[type=text]:disabled,
input[type=tel]:disabled,
input[type=number]:disabled {
	border: 1px solid #e4e4e4;
	background: #f1f1f1;
	color: #bbb;
}

input[type=text]:-moz-read-only,
input[type=tel]:-moz-read-only,
input[type=number]:-moz-read-only {
	background: #f1f1f1;
}

input[type=text]:read-only,
input[type=tel]:read-only,
input[type=number]:read-only {
	background: #f1f1f1;
}

input[type=text]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder {
	color: #bbb;
}

input[type=text]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=number]::-moz-placeholder {
	color: #bbb;
}

input[type=text]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder {
	color: #bbb;
}

input[type=text]::-ms-input-placeholder,
input[type=tel]::-ms-input-placeholder,
input[type=number]::-ms-input-placeholder {
	color: #bbb;
}

input[type=text]::placeholder,
input[type=tel]::placeholder,
input[type=number]::placeholder {
	color: #bbb;
}

input[type=radio] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 50%;
	width: 16px;
	height: 16px;
	border: 1px solid #d9d9d9;
	vertical-align: middle;
	position: relative;
	cursor: pointer;
	margin-bottom: 2px;
}

input[type=radio]::before {
	display: block;
	content: "";
	width: 14.5px;
	height: 14.5px;
	-webkit-transition: 120ms -webkit-transform ease-in-out;
	transition: 120ms -webkit-transform ease-in-out;
	-o-transition: 120ms transform ease-in-out;
	transition: 120ms transform ease-in-out;
	transition: 120ms transform ease-in-out, 120ms -webkit-transform ease-in-out;
	-webkit-box-shadow: inset 14px 14px #333;
	box-shadow: inset 14px 14px #333;
	border-radius: 50%;
	-webkit-transform: scale(0);
	transform: scale(0);
	-webkit-box-shadow: inset 14px 14px #fff !important;
	box-shadow: inset 14px 14px #fff !important;
}

input[type=radio]:checked::before {
	-webkit-transform: scale(0.55);
	transform: scale(0.55);
}

input[type=radio]:checked {
	background-color: var(--btn-bgcolor-primary);
	border: 1px solid var(--btn-bgcolor-primary);
}

input[type=radio].doteBlue {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	border: 1px solid #bbb;
	background: #f1f1f1;
	vertical-align: middle;
	position: relative;
	cursor: pointer;
	margin-bottom: 2px;
}

input[type=radio].doteBlue::before {
	display: block;
	content: "";
	width: 18.5px;
	height: 18.5px;
	-webkit-transition: 120ms -webkit-transform ease-in-out;
	transition: 120ms -webkit-transform ease-in-out;
	-o-transition: 120ms transform ease-in-out;
	transition: 120ms transform ease-in-out;
	transition: 120ms transform ease-in-out, 120ms -webkit-transform ease-in-out;
	-webkit-box-shadow: inset 14px 14px #333;
	box-shadow: inset 14px 14px #333;
	border-radius: 50%;
	-webkit-transform: scale(0);
	transform: scale(0);
	-webkit-box-shadow: inset 14px 14px var(--bgcolor-primary) !important;
	box-shadow: inset 14px 14px var(--bgcolor-primary) !important;
}

input[type=radio].doteBlue:checked::before {
	-webkit-transform: scale(0.55);
	transform: scale(0.55);
}

input[type=radio].doteBlue:checked {
	background-color: #fff;
	border: 1px solid var(--border-primary);
}

input[type=radio].checkBlue {
	border: 1.5px solid #222;
}

input[type=radio].checkBlue::before {
	content: "";
	position: absolute;
	top: 1px;
	left: 50%;
	margin-left: -2px;
	width: 3px;
	height: 7px;
	border-right: 1.4px solid #222;
	border-bottom: 1.4px solid #222;
	-webkit-transform: rotate(45deg) scale(1);
	transform: rotate(45deg) scale(1);
	-webkit-transition: -webkit-transform 0.15s ease-in-out;
	transition: -webkit-transform 0.15s ease-in-out;
	-o-transition: transform 0.15s ease-in-out;
	transition: transform 0.15s ease-in-out;
	transition: transform 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
	-webkit-box-shadow: unset !important;
	box-shadow: unset !important;
	box-shadow: unset !important;
	border-radius: 0%;
}

input[type=radio].checkBlue:checked {
	background-color: var(--btn-bgcolor-blue);
	border-color: var(--border-blue);
}

input[type=radio].checkBlue:checked::before {
	border-color: #fff;
	-webkit-transform: rotate(45deg) scale(1);
	transform: rotate(45deg) scale(1);
}

input[type=checkbox] {
	vertical-align: middle;
	cursor: pointer;
	border: unset;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 20px;
	height: 20px;
	background: url("/img/check-off-a131d44fb86af053f27c5571c6ca4d91.svg") no-repeat 50%/100%;
}

input[type=checkbox]:checked {
	background-image: url("/img/check-on-d3ff69199870e0c919c0ff32acbdc96b.svg");
}

input[type=checkbox]:focus {
	outline: none;
}

input:focus {
	outline: none;
}

.colArea {
	gap: 8px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.colArea label {
	font-size: 16px;
	margin-left: 4px;
}

.titArea {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 8px 20px;
	border-bottom: 1px solid #ddd;
	height: 48px;
}

.titArea .titBox h3 {
	font-size: 15px;
	font-weight: 600;
	color: #000;
}

.titArea .titBox h4 {
	color: #222;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.titArea .titBox .timerWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.titArea .titBox .timerWrap .thum {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	overflow: hidden;
	margin-right: 8px;
}

.titArea .titBox .timerWrap .thum.type2 {
	width: 32px;
	height: 32px;
}

.titArea .titBox .timerWrap .id {
	color: #222;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.titArea .titBox .timerWrap .timeBox {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 16px;
	margin-left: 16px;
}

.titArea .titBox .timerWrap .timeBox::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 50%;
	margin-top: -5px;
	width: 1px;
	height: 10px;
	background: #ccc;
}

.titArea .titBox .timerWrap .timeBox .txt {
	padding-left: 4px;
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.titArea .titBox .timerWrap .timeBox .txt>.time {
	padding-left: 4px;
	color: #222;
}

.titArea .btnBox {
	gap: 4px;
}

.titArea .btnBox .icoArrDown.active {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

.titArea .infoBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.titArea .infoBox .txt {
	font-size: 14px;
	font-weight: 400;
}

.titArea .infoBox .total span {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.titArea .infoBox .total span strong {
	display: inline-block;
	border-radius: 100px;
	background: #eeeff3;
	width: 28px;
	height: 24px;
	line-height: 24px;
	color: #222;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
	margin-left: 4px;
}

.titArea .syncBox span {
	color: #222;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

.titArea .syncBox .ico {
	margin-right: 4px;
}

.titArea .timeBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
}

.titArea .timeBox>div {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.titArea .timeBox>div b {
	color: #222;
}

.titArea .timeBox>div .ico {
	width: 20px;
	height: 20px;
	margin-right: 3px;
}

.titArea .timeBox>div.time {
	color: #222;
}

.stateBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
}

.stateBox>div {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.stateBox>div span {
	display: inline-block;
	text-align: center;
	min-width: 28px;
	padding: 0px 8px;
	height: 24px;
	line-height: 22px;
	border-radius: 9999px;
	border: 1px solid rgba(109, 120, 130, 0.5);
	background: rgba(109, 120, 130, 0.1);
	margin-left: 4px;
	color: #6d7882;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.stateBox>div.consul span {
	border: 1px solid rgba(72, 118, 239, 0.5);
	background: rgba(72, 118, 239, 0.1);
	color: #4876ef;
}

.stateBox>div.wait span {
	border: 1px solid rgba(109, 120, 130, 0.5);
	background: rgba(109, 120, 130, 0.1);
	color: #6d7882;
}

.stateBox>div.process span {
	border: 1px solid rgba(255, 177, 20, 0.5);
	background: rgba(255, 177, 20, 0.1);
	color: #ffb114;
}

.stateBox>div.complete span {
	border: 1px solid rgba(34, 135, 56, 0.5);
	background: rgba(34, 135, 56, 0.1);
	color: #228738;
}

.stateBox>div.error span {
	border: 1px solid rgba(222, 52, 18, 0.5);
	background: rgba(222, 52, 18, 0.1);
	color: #de3412;
}

.infoBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.infoBox .txt {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.reqTxt {
	color: #de3412;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: -0.5px;
	margin-top: 4px;
	padding-left: 20px;
	position: relative;
}

.reqTxt::before {
	content: "";
	background: url("/img/icon/ico-warning-02795497e23af4ee0c46f1e9f04b39c2.svg") no-repeat 50%/100%;
	width: 16px;
	height: 16px;
	position: absolute;
	top: 0px;
	left: 0px;
}

.searchBtn {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.searchBtn>input {
	border-radius: 4px 0px 0px 4px !important;
}

.searchBtn>button {
	padding: 0 !important;
	min-width: 32px;
	min-height: 32px;
	font-size: 0;
	border-radius: 0px 4px 4px 0px !important;
	background: url("/img/icon/icon-search-black-9796357cd0f62cbbb10ed79a8217f60f.svg") no-repeat 50%/20px #fff !important;
}

.searchBtn.type2>input {
	border-radius: 4px !important;
	padding-right: 40px !important;
}

.searchBtn.type2>button {
	padding: 0 !important;
	min-width: 30px;
	min-height: 30px;
	font-size: 0;
	border-radius: 0px !important;
	border: 0 !important;
	background: url("/img/icon/icon-search-black-9796357cd0f62cbbb10ed79a8217f60f.svg") no-repeat 50%/20px !important;
	position: absolute;
	right: 2px;
}

/* 헤더영역 */
#header {
	width: 100%;
	height: 56px;
	padding: 10px 16px;
	border-bottom: 1px solid var(--border-default);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

#header .logoWrap h1 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	line-height: normal;
}

#header .logoWrap h1 a {
	display: inline-block;
	height: 16px;
}

#header .logoWrap h1 a img {
	width: 148px;
}

#header .logoWrap .tit {
	margin-left: 24px;
	color: var(--text-primary);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.5px;
}

#header .btnWrap {
	gap: 8px;
}

#header .setWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 24px;
}

#header .setWrap .setBtn a {
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

#header .setWrap .setBtn a i {
	width: 20px;
	height: 20px;
	margin-right: 3px;
	vertical-align: middle;
}

#header .setWrap .setBtn a i.icoSet {
	background: url("/img/icon/ico-set-04584e66accf1a04bfd0ffe2df243a04.svg") no-repeat 50%/20px;
}

#header .setWrap .counselBtn a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

#header .setWrap .counselBtn a .userImg {
	position: relative;
	width: 32px;
	height: 32px;
}

#header .setWrap .counselBtn a .userImg .dote {
	position: absolute;
	top: 0px;
	right: -2px;
	display: inline-block;
	border-radius: 100px;
	background: #2bc840;
	width: 10px;
	height: 10px;
}

#header .setWrap .counselBtn a i {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	vertical-align: middle;
}

#header .setWrap .counselBtn a i.icoArrDown {
	background: url("/img/icon/ico-arr-down-w-e7e2abfb9a1874bdb15d92628074a7b4.svg") no-repeat 50%/16px;
}

#header.chatCounsel {
	background: var(--bgcolor-primary);
}

#header.chatCounsel .headerNav ul li.active a {
	background: var(--bgcolor-primary);
}

#header.chatBot {
	background: var(--bgcolor-primary);
}

#header.chatBot .headerNav ul li.active a {
	background: var(--bgcolor-primary);
}

#header.callBot {
	background: var(--bgcolor-primary);
}

#header.callBot .headerNav ul li.active a {
	background: var(--bgcolor-primary);
}

.headerNav ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	background: #fff;
	padding: 0px 6px;
	border-radius: 50px;
	height: 34px;
}

.headerNav ul li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.headerNav ul li a {
	min-width: 70px;
	height: 26px;
	line-height: 26px;
	padding: 0 10px;
	text-align: center;
	color: #222;
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.headerNav ul li.active a {
	background: var(--bgcolor-primary);
	-webkit-box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.25);
	box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.25);
	color: #fff;
	border-radius: 50px;
}

.titWrap {
	background: #fff;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
	border-bottom: 1px solid #ddd;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 20px;
}

.titWrap h3 {
	color: #000;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -0.5px;
}

/* 메뉴 영역 */
#nav {
	position: relative;
	width: 72px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background: #fff;
	padding: 20px 16px;
	border-right: 1px solid #ddd;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

#nav:not(.active) {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#nav .navList {
	width: 100%;
}

#nav .navList li {
	margin-bottom: 10px;
	height: 40px;
}

#nav .navList li a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 8px 8px;
}

#nav .navList li a>div {
	display: none;
	font-size: 16px;
	font-weight: 600;
	color: #222;
	overflow: hidden;
	height: 24px;
}

#nav .navList li a .ico {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	font-size: 0;
}

#nav .navList li a .ico.icoDash {
	background-image: url("/img/icon/ico-dashboard-cdb682e5ae07621d16519e221cf870ac.svg");
}

#nav .navList li a .ico.icoGroup {
	background-image: url("/img/icon/ico-group-123dc2159fd863febce944d86641652a.svg");
}

#nav .navList li a .ico.icoLog {
	background-image: url("/img/icon/ico-log-17a423ecb26bcf5904dba50f1c957436.svg");
}

#nav .navList li a .ico.icoClock {
	background-image: url("/img/icon/ico-clock-106d87ca4a5919b0776fc914fed316d8.svg");
}

#nav .navList li a .ico.icoScreen {
	background-image: url("/img/icon/ico-screen-d8fcf447eede172d8e1b65852ceb05d3.svg");
}

#nav .navList li a .ico.icoManage {
	background-image: url("/img/icon/ico-manage-d2862ca1e69682c6e86b82d8fdd65047.svg");
}

#nav .navList li a .ico.icoHistory {
	background-image: url("/img/icon/ico-history-fe2f39837eb0392868391ad2977c0080.svg");
}

#nav .navList li a .ico.icoStati {
	background-image: url("/img/icon/ico-stati-02ea20d27def15cae8d47d651be36498.svg");
}

#nav .navList li a .ico.icoCounselor {
	background-image: url("/img/icon/ico-counselor-5f68dd3fe5393afb820542f7a2e70f2a.svg");
}

#nav .navList li a .ico.icoDictionary {
	background-image: url("/img/icon/ico-dic-4bddcaabe776e8fd481145825433cad9.svg");
}

#nav .navList li a .ico.icoMessage {
	background-image: url("/img/icon/ico-message-17d1bc50cf129272ee200f41b3bbcfe9.svg");
}

#nav .navList li a .ico.icoWrite {
	background-image: url("/img/icon/ico-write-fad6868a3266cf3ce2698e48a0fce086.svg");
}

#nav .navList li a .ico.icoBulb {
	background-image: url("/img/icon/ico-bulb-845bc093b8d465a0a544530ade2be944.svg");
}

#nav .navList li a .ico.icoSharing {
	background-image: url("/img/icon/ico-sharing-21c1d110512fd04516e5278823330b6b.svg");
}

#nav .navList li a .ico.icoIntegration {
	background-image: url("/img/icon/ico-integration-b2aea667c0171e8d3dc4c6504f7197f6.svg");
}

#nav .navList li a .ico.icoCustomer {
	background-image: url("/img/icon/ico-customer-b1cb5b48a535ce08b219dd6efc0c498f.svg");
}

#nav .navList li a .ico.icoInbound {
	background-image: url("/img/icon/ico-inbound-574f84bab70c008cee360e07ae7e7284.svg");
}

#nav .navList li a .ico.icoOutbound {
	background-image: url("/img/icon/ico-outbound-4d0adc0228c30db48bbeca3e2dd8d6b0.svg");
}

#nav .navList li a .ico.icoCallhistory {
	background-image: url("/img/icon/ico-callhistory-fe2f39837eb0392868391ad2977c0080.svg");
}

#nav .navList li a.active {
	border-radius: 6px;
	background: var(--bgcolor-primary);
}

#nav .navList li a.active .ico {
	-webkit-filter: invert(1) brightness(10);
	filter: invert(1) brightness(10);
}

#nav .navList li a.active>div {
	color: #fff;
}

#nav .panelBtn {
	position: absolute;
	right: 16px;
	bottom: 20px;
	background: var(--bgcolor-primary);
	border-radius: 50%;
	width: 24px;
	height: 24px;
}

#nav .panelBtn .ico {
	display: inline-block;
	width: 24px;
	height: 24px;
	font-size: 0;
	vertical-align: top;
}

#nav .panelBtn .ico.icoArrRight {
	background: url("/img/icon/ico-arr-right-white-2b009c011571cc3d78a74d0fbd36dd63.svg") no-repeat 55% 50%/7px;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#nav.active .navList li a {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
}

#nav.active .navList li a>div {
	display: block;
	margin-left: 8px;
}

#nav.active .panelBtn .ico.icoArrRight {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#nav.chatCounsel li a.active {
	background: var(--bgcolor-primary);
}

#nav.chatCounsel .panelBtn {
	background: var(--bgcolor-primary);
}

#nav.chatBot li a.active {
	background: var(--bgcolor-primary);
}

#nav.chatBot .panelBtn {
	background: var(--bgcolor-primary);
}

#nav.callBot li a.active {
	background: var(--bgcolor-primary);
}

#nav.callBot .panelBtn {
	background: var(--bgcolor-primary);
}

/* 컨텐츠 영역 */
#contents {
	position: relative;
	min-width: calc(100% - 72px);
	height: 100%;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	padding: 15px 12px;
}

#contents>.innerWrap {
	height: 100%;
}

#contents .inner {
	display: inline-block;
	width: 100%;
	height: 100%;
	border-radius: 8px;
	border: 1px solid #ddd;
	background: #fff;
	overflow-y: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	overflow: hidden;
}

#contents .inner .row {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#contents .conArea {
	padding: 16px 20px;
	overflow-y: auto;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	overflow: auto;
}

#contents .conArea .tblBox {
	height: calc(100% - 40px);
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	overflow: hidden;
}

#contents.chat {
	padding-top: 52px;
}

/* 검색 영역 */
.searchBox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-bottom: 8px;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
}

.searchBox ul li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 8px;
}

.searchBox ul li dl dt {
	display: none;
}

/* table */
.tblList {
	width: 100%;
	height: calc(100% - 40px);
	border-top: 1px solid var(--border-default);
	border-bottom: 1px solid var(--border-default);
	background: #f9f9fa;
	overflow: auto;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.tblList table {
	width: 100%;
}

.tblList table tr th,
.tblList table tr td {
	padding: 2px 8px;
	text-align: center;
	background: #fff;
	height: 30px;
}

.tblList table tr:not(:last-child) th,
.tblList table tr:not(:last-child) td {
	border-bottom: 1px solid var(--border-default);
}

.tblList table th {
	background-color: var(--bgcolor-lightGray);
	color: var(--text-color);
}

.tblList table th:not(:first-child) {
	border-left: 1px solid var(--border-default);
}

.tblList table td {
	font-size: 13px;
	line-height: 1.3;
	color: var(--text-default);
}

.tblList table td:not(:first-child) {
	border-left: 1px solid var(--border-default);
}

.tblList table td input[type=text],
.tblList table td input[type=tel],
.tblList table td input[type=email],
.tblList table td input[type=password],
.tblList table td input[type=number] {
	min-width: auto;
	height: 24px;
}

.tblList table thead {
	border-bottom: 1px solid var(--border-default);
}

.tblList table thead tr th {
	border-top: 1px solid var(--border-default);
	background: var(--bgcolor-primary);
	color: var(--text-bgcolor);
	font-weight: 500;
	position: sticky;
	top: -1px;
	z-index: 9;
}

.tblList table thead tr th .icoSorting {
	margin-left: 4px;
	width: 20px;
	height: 20px;
	font-size: 0;
	background: url("/img/icon/ico-sorting-2d00c5a996b1b8f2228a9b406cce5a1c.svg") no-repeat 50%/20px;
	vertical-align: middle;
}

.tblList table thead tr th .icoSorting.active {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

.tblList table tbody tr.on td {
	background: #f0eff8;
}

.tblList table tbody tr th {
	border-top: 1px solid var(--border-default);
	border-bottom: 1px solid var(--border-default);
	border-right: 1px solid var(--border-default);
	color: var(--text-color);
	font-weight: 500;
	background-color: var(--bgcolor-lightGray);
	line-height: 39px;
}

.tblList table tbody tr td {
	position: relative;
	border-top: 1px solid var(--border-default);
	border-bottom: 1px solid var(--border-default);
}

.tblList table tbody tr td+th {
	border-left: 1px solid var(--border-default);
}

.tblList.type1 table tr th,
.tblList.type1 table tr td {
	height: 26px;
}

.tblList.type1 table thead th {
	background: rgba(37, 0, 136, 0.1);
	color: #222;
	text-align: center;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: -0.26px;
}

.chatCounType .tblList tbody tr.on td {
	background: rgba(71, 114, 216, 0.1);
}

.tblForm table {
	width: 100%;
}

.tblForm table tr th,
.tblForm table tr td {
	text-align: left;
	min-height: 32px;
	padding-bottom: 8px;
}

.tblForm table tr:last-child th,
.tblForm table tr:last-child td {
	padding-bottom: 0px;
}

.tblForm table tr th {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

.tblForm table tr td textarea {
	color: #222;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

#footer {
	margin-top: auto;
}

h1 {
	font-size: 28px;
	line-height: 36px;
	color: var(--text-heading);
	font-weight: 600;
}

h3 {
	font-size: 18px;
	line-height: 25px;
	font-weight: 600;
	color: var(--text-heading);
}

h4 {
	font-size: 16px;
	line-height: 22px;
	font-weight: 500;
	color: var(--text-title);
}

#paginationWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 10px 0px 0px;
}

#paginationWrap ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 4px;
}

#paginationWrap ul li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

#paginationWrap ul li a {
	font-size: 0;
	width: 28px;
	height: 28px;
	padding: 0;
	border-color: #bbb;
}

#paginationWrap ul li.first a {
	background: url("/img/icon/ico-arr-first-a1dae69e6146154a9a058efc0e9e5604.svg") center no-repeat #fff;
	text-indent: -9999px;
	overflow: hidden;
}

#paginationWrap ul li.prev a {
	background: url("/img/icon/ico-arr-prev-d63ded00354a13da9becd9ee5d550ef4.svg") center no-repeat #fff;
	text-indent: -9999px;
	overflow: hidden;
}

#paginationWrap ul li.next a {
	background: url("/img/icon/ico-arr-next-dd9248251884b10b280c357d600f1690.svg") center no-repeat #fff;
	text-indent: -9999px;
	overflow: hidden;
}

#paginationWrap ul li.last a {
	background: url("/img/icon/ico-arr-last-89613345514e20976a9eb248a12f48f0.svg") center no-repeat #fff;
	text-indent: -9999px;
	overflow: hidden;
}

#paginationWrap ul li.pageInput {
	margin: 0px 24px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

#paginationWrap ul li.pageInput>input {
	min-width: unset;
	width: 40px;
	height: 28px;
	text-align: right;
	border-color: #bbb;
}

#paginationWrap ul li.pageInput .dash {
	padding: 0px 5px;
}

#paginationWrap ul .total {
	color: #767676;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

#paginationWrap ul .total span {
	margin-left: 5px;
}

#paginationWrap ul .perPageSelect select {
	border-color: #bbb;
	margin-left: 8px;
	height: 28px;
}

[class^=i-][class*=sm] {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 4px;
	vertical-align: bottom;
}

[class^=i-][class*=md] {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 4px;
	vertical-align: bottom;
}

[class^=i-][class*=lg] {
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 4px;
	vertical-align: middle;
}

/* scroll bar */
.mCSB_scrollTools {
	opacity: 1 !important;
}

.mCSB_dragger_bar {
	background-color: rgba(0, 0, 0, 0.3) !important;
}

.scroll-bar {
	position: relative;
	overflow-y: auto;
}

.scroll-bar::-webkit-scrollbar {
	width: 10px;
}

.scroll-bar::-webkit-scrollbar-track {
	background-color: rgba(255, 255, 255, 0);
}

.scroll-bar::-webkit-scrollbar-thumb {
	background: #bbb;
	border-radius: 50px;
	border: 3px solid #ffffff;
}

/* custom-sel */
.custom-sel {
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 100%;
}

.custom-sel>button {
	display: inline-block;
	vertical-align: top;
	position: relative;
	width: 100%;
	height: 32px;
	line-height: 29px;
	border-radius: 4px;
	border: 1px solid var(--border-default);
	font-size: 14px !important;
	color: var(--text-title);
	padding: 0 36px 0 8px;
	background-size: 20px 20px;
	text-align: left;
	overflow: hidden;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.custom-sel>button:after {
	content: "";
	display: block;
	position: absolute;
	position: absolute;
	right: 6px;
	top: 50%;
	width: 20px;
	height: 20px;
	background: url("../img/arrow-down.svg") no-repeat center;
	-webkit-transform: rotate(0) translateY(-50%);
	transform: rotate(0) translateY(-50%);
}

.custom-sel>ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	width: 100%;
	max-height: 185px;
	background-color: #fff;
	border-top: 0;
	border-radius: 6px 6px;
	border: 1px solid var(--border-default);
	z-index: 1;
	overflow-y: auto;
}

.custom-sel>ul>li {
	padding: 12px;
	font-size: 14px !important;
	color: var(--text-color);
	cursor: pointer;
}

.custom-sel>ul>li.selected {
	font-weight: 500;
	color: var(--text-title);
	background-color: #f5f5f5;
}

.custom-sel.open {
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

.custom-sel.open>button {
	border: 1px solid #262626;
}

.custom-sel.open>button::after {
	-webkit-transform: rotate(180deg) translateY(50%);
	transform: rotate(180deg) translateY(50%);
}

/* datepicker */
.datepicker {
	width: 131px !important;
	height: 40px;
	padding: 0 8px;
}

.ui-widget-header {
	padding: 0 !important;
	margin: 0 0 16px !important;
	border-color: #fff;
	background: #fff;
	border: 0;
}

.ui-datepicker {
	width: 300px;
	padding: 24px;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1);
	box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1);
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	display: inline-block;
	width: 32px;
	height: 32px;
	border: 1px solid #d9d9d9 !important;
	background: #fff;
	border-radius: 0;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	width: 16px;
	height: 16px;
}

.ui-datepicker table {
	padding: 0em 0 0em;
	margin: 0;
}

.ui-datepicker table thead {
	border: 0;
	margin-top: 16px;
}

.ui-datepicker table thead tr th {
	color: #aeb3ba;
	text-align: center;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: -0.18px;
	line-height: normal;
	width: 24px;
	height: 34px;
	padding: 0;
}

.ui-datepicker table thead tr th:first-child {
	color: #aeb3ba !important;
}

.ui-datepicker table thead tr th:last-child {
	color: #aeb3ba !important;
}

.ui-datepicker table tbody {
	border: 0;
}

.ui-datepicker table tbody tr {
	border: 0;
}

.ui-datepicker table tbody tr td {
	text-align: center;
	padding: 5px;
}

.ui-datepicker .ui-datepicker-title {
	text-align: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 4px;
	color: #000;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.28px;
}

.ui-datepicker .ui-datepicker-title>select.ui-datepicker-month,
.ui-datepicker .ui-datepicker-title>select.ui-datepicker-year {
	width: auto;
	min-width: auto;
	height: 28px;
	padding: 0px 24px 0 8px !important;
	border-radius: 6px;
	border: 1px solid #dedfe3;
	text-align: center;
	overflow: hidden;
	color: #101010;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -0.32px;
	background-size: 14px !important;
}

.ui-datepicker .ui-datepicker-header {
	position: relative;
}

.ui-datepicker .ui-datepicker-header>a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	border-radius: 4px;
	background: #f1f4f8;
	width: 20px;
	height: 20px;
	border: 0 !important;
}

.ui-datepicker .ui-datepicker-header>a span {
	display: inline-block;
	text-indent: -9999px;
	background-size: 12px 12px !important;
}

.ui-datepicker .ui-datepicker-header>a.ui-datepicker-prev {
	position: absolute;
	top: 50% !important;
	left: 4px !important;
	margin-top: -10px;
}

.ui-datepicker .ui-datepicker-header>a.ui-datepicker-prev span {
	background-image: url("/img/arrow-left-gray-af86e31f2586ed67a4edc5a9a8787eef.png");
	-webkit-filter: invert(1);
	filter: invert(1);
}

.ui-datepicker .ui-datepicker-header>a.ui-datepicker-next {
	position: absolute;
	top: 50% !important;
	right: 4px !important;
	margin-top: -10px;
}

.ui-datepicker .ui-datepicker-header>a.ui-datepicker-next span {
	background-image: url("/img/arrow-right-gray-6862c752c49d2f1e3951c0b3ab2c4439.png");
	-webkit-filter: invert(1);
	filter: invert(1);
}

.ui-datepicker table.ui-datepicker-calendar {
	border: 0 !important;
}

.ui-datepicker .ui-state-default {
	display: inline-block;
	height: 26px;
	line-height: 24px;
	width: 26px;
	padding: 0;
	border: none;
	text-align: center;
	color: #101010;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.28px;
	background: none;
}

.ui-datepicker .ui-state-default.ui-state-active {
	position: relative;
	border-radius: 100px;
	border: 1px solid var(--border-primary);
	background: rgba(71, 114, 216, 0.1);
}

.ui-datepicker .ui-state-default.ui-state-active::after {
	content: "";
	display: block;
	position: absolute;
	top: -2px;
	right: -2px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--bgcolor-primary);
	margin-left: -0.08em;
}

.datepickerWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
}

.datepickerWrap .ui-datepicker-trigger {
	position: absolute;
	right: 8px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.datepickerWrap>div {
	width: calc(50% - 7px);
	position: relative;
}

.datepickerWrap>span {
	text-align: center;
	width: 14px;
	color: var(--text-color);
	font-weight: 600;
}

.ui-datepicker .ui-state-default.ui-state-active {
	border: 1px solid var(--border-primary);
	background: rgba(37, 0, 136, 0.1);
}

.ui-datepicker .ui-state-default.ui-state-active::after {
	content: "";
	background: var(--border-primary);
}

.ui-datepicker.chatBotType .ui-state-default.ui-state-active {
	border: 1px solid var(--border-green);
	background: rgba(36, 136, 62, 0.1);
}

.ui-datepicker.chatBotType .ui-state-default.ui-state-active::after {
	content: "";
	background: var(--btn-bgcolor-green);
}

.ui-datepicker.chatCounType .ui-state-default.ui-state-active {
	border: 1px solid var(--border-blue);
	background: rgba(71, 114, 216, 0.1);
}

.ui-datepicker.chatCounType .ui-state-default.ui-state-active::after {
	content: "";
	background: var(--btn-bgcolor-blue);
}

.ui-datepicker.callBotType .ui-state-default.ui-state-active {
	border: 1px solid #6151a9;
	background: rgba(37, 0, 136, 0.1);
}

.ui-datepicker.callBotType .ui-state-default.ui-state-active::after {
	content: "";
	background: #6151a9;
}

#wrap.login {
	min-width: unset;
	min-height: unset;
	height: 100%;
}

#wrap.login .loginWrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

#wrap.login .loginWrap>div {
	width: 50%;
}

#wrap.login .loginWrap .logoArea {
	background: url("/img/bg/bg-login-ff558028524b40d813892b9ed8dfbfff.svg") no-repeat 100% 50%/500px #e9e6f3;
	height: 100%;
}

#wrap.login .loginWrap .logoArea h1 {
	position: absolute;
	top: 64px;
	left: 100px;
}

#wrap.login .loginWrap .loginArea {
	padding: 0px 60px;
}

#wrap.login .loginWrap .loginArea .inner {
	max-width: 360px;
}

#wrap.login .loginWrap .loginArea .inner .tit {
	margin-bottom: 20px;
}

#wrap.login .loginWrap .loginArea .inner .tit h2 {
	font-size: 40px;
	color: #222;
	font-weight: 300;
	line-height: 120%;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text],
#wrap.login .loginWrap .loginArea .inner .inp input[type=password] {
	height: 56px;
	padding: 8px 16px;
	border-radius: 4px;
	border: 1px solid #e4e4e4;
	background: #fff;
	width: 100%;
	margin-bottom: 16px;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]::-webkit-input-placeholder,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]::-webkit-input-placeholder {
	font-size: 17px;
	color: #bbb;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]::-moz-placeholder,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]::-moz-placeholder {
	font-size: 17px;
	color: #bbb;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]:-ms-input-placeholder,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]:-ms-input-placeholder {
	font-size: 17px;
	color: #bbb;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]::-ms-input-placeholder,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]::-ms-input-placeholder {
	font-size: 17px;
	color: #bbb;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]::placeholder,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]::placeholder {
	font-size: 17px;
	color: #bbb;
}

#wrap.login .loginWrap .loginArea .inner .inp input[type=text]:focus,
#wrap.login .loginWrap .loginArea .inner .inp input[type=password]:focus {
	border: 1px solid #c3c3c3;
}

#wrap.login .loginWrap .loginArea .inner .inp .pwWrap {
	position: relative;
}

#wrap.login .loginWrap .loginArea .inner .inp .pwWrap>button {
	font-size: 0;
	width: 24px;
	height: 24px;
	position: absolute;
	right: 16px;
	top: 16px;
	background: url("/img/icon/ico-eye-off-b7a433f4237d415587bcbb2cd763f3b8.svg") no-repeat 50%/24px;
}

#wrap.login .loginWrap .loginArea .inner .inp .pwWrap>button.active {
	background: url("/img/icon/ico-eye-928feef76f361525d11f1a5737d4cb33.svg") no-repeat 50%/24px;
}

#wrap.login .loginWrap .loginArea .inner .inp .saveId {
	margin-bottom: 40px;
}

#wrap.login .loginWrap .loginArea .inner .inp .saveId input[type=checkbox] {
	margin: 0px 5px 3px;
}

#wrap.login .loginWrap .loginArea .inner .inp .saveId label {
	color: #767676;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.5px;
}

#wrap.login .loginWrap .loginArea .inner .inp .btnLogin {
	width: 100%;
	height: 56px;
	padding: 10px 16px;
	border-radius: 4px;
	background: var(--bgcolor-primary);
	color: #fff;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.1px;
	margin-bottom: 24px;
	text-align: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

#wrap.login .loginWrap .loginArea .inner .infoTxt {
	color: #767676;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

#wrap.login .loginWrap .loginArea .inner .infoTxt a {
	color: #222;
	font-size: 15px;
	font-weight: 600;
	padding-right: 5px;
}

#navBtn {
	background: transparent;
	display: none;
	border: 1px solid #aaa;
	position: absolute;
	bottom: 5px;
	right: 0;
	padding: 0;
	text-decoration: none;
	color: #333;
	text-align: center;
	font-weight: bold;
	font-size: 0;
	display: none;
}

#navBtn:hover {
	background: rgba(0, 0, 0, 0.05);
}

#navBtn.selected {
	background: rgba(0, 0, 0, 0.1);
}

#navBtn:before {
	/* content: '☰'; */
	content: "≡";
	display: block;
	font-size: 36px;
	font-style: normal;
	font-weight: normal;
	line-height: 1.05;
	height: 1em;
	width: 1em;
	color: inherit;
	speak: none;
}

#navBtn.mobile {
	display: inline-block;
}

/* 토글버튼 */
.toggleBtnset {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	width: auto;
}

.toggleBtnset .toggleLabel {
	font-size: 14px;
	color: #666;
	white-space: nowrap;
}

.toggleBtnset .toggle {
	display: none;
}

.toggleBtnset .toggleSlide {
	position: relative;
	width: 36px;
	height: 20px;
	display: block;
	border-radius: 12px;
	background: #bfbfbf;
	cursor: pointer;
	-webkit-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

.toggleBtnset .togBtn {
	width: 16px;
	height: 16px;
	position: absolute;
	top: 50%;
	left: 2px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	border-radius: 50%;
	background: #fff;
	-webkit-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

.toggleBtnset .toggle:checked+.toggleSlide {
	background: var(--btn-bgcolor-primary);
}

.toggleBtnset .toggle:checked+.toggleSlide .togBtn {
	left: calc(100% - 18px);
}

.toggleBtnset.type2 {
	position: relative;
	left: -15px;
}

.toggleBtnset.type2 .toggleSlide {
	background: #de3412;
}

.toggleBtnset.type2 .toggleLabel {
	color: #de3412;
	position: absolute;
	top: 1px;
	right: -30px;
}

.toggleBtnset.type2 .toggle:checked+.toggleSlide {
	background: #228738;
}

.toggleBtnset.type2 .toggle:checked+.toggleSlide>.toggleLabel {
	color: #228738;
}

.toggleBtnset.blue .toggle:checked+.toggleSlide {
	background: var(--btn-bgcolor-primary);
}

/* 체크박스 커스텀 */
.custom-check {
	position: relative;
	display: inline-block;
}

.custom-check label {
	background-color: var(--text-bgcolor);
	border: 1px solid var(--border-default);
	border-radius: 2px;
	cursor: pointer;
	width: 16px;
	height: 16px;
	display: inline-block;
	position: absolute;
	top: 0px;
	left: 0px;
}

.custom-check label:after {
	content: "";
	border: 2px solid #fff;
	border-top: none;
	border-right: none;
	opacity: 0;
	position: absolute;
	left: 3px;
	top: 3px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	height: 3px;
	width: 6px;
}

.custom-check input[type=checkbox] {
	opacity: 0;
}

.custom-check input[type=checkbox]:checked+label {
	background-color: var(--btn-bgcolor-primary);
	border-color: var(--btn-bgcolor-primary);
}

.custom-check input[type=checkbox]:checked+label:after {
	opacity: 1;
}


.popup {
	top: 50%;
	left: 50%;
	position: fixed;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 1200;
	width: 100%;
}

.popup .popHead {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 12px 16px;
	background: var(--bgcolor-primary);
	height: 56px;
}

.popup .popHead .popTitle {
	font-size: 20px;
	font-weight: 600;
	color: #fff;
}

.popup .popHead .popClose {
	width: 24px;
	height: 24px;
	text-indent: -9999px;
	background: url("/img/icon/ico-pop-close-dcff16395091955c427e6240994a855b.svg") no-repeat center;
}

.popup .popBody {
	background: #fff;
}

.popup .popBody>.inner {
	padding: 16px 30px;
	min-height: 320px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.popup .popBody>.inner .popSec {
	display: inline-block;
	width: 100%;
	height: 100%;
	border-radius: 8px;
	border: 1px solid #ddd;
	background: #fff;
	margin-bottom: 12px;
}

.popup .popBody>.inner .popSec .titArea {
	border-bottom: 1px solid #ddd;
	padding: 8px 20px;
}

.popup .popBody>.inner .popSec .conArea {
	padding: 10px 20px 16px 20px;
}

.popup .popBody .scroll-bar::-webkit-scrollbar-thumb {
	border: 3px solid #f1f2f4;
}

.popup .popBody .titArea {
	padding: 0 0 7px;
	margin: 16px 0 0px;
	border-bottom: 1px solid #222;
}

.popup .popBody .titArea .titBox h3 {
	font-size: 14px;
}

.popup .popBody .titArea:nth-of-type(1) {
	margin-top: 0;
}

.popup .popBody .tblBox {
	height: calc(100% - 40px);
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	overflow: hidden;
	position: relative;
}

.popup .popBody .tblBox .tblList {
	margin-top: 0;
}

.popup .popBody .btnArea {
	border-top: 1px solid #ddd;
	width: 100%;
}

.popup .popBody .formArea ul li dl dt {
	min-width: 60px;
}

.popup .popBody .formArea ul.minNone li dl dt {
	min-width: unset;
}

.popup.type2 {
	border-radius: 8px;
}

.popup.type2 .popHead {
	padding: 10px 20px;
	border-radius: 8px 8px 0px 0px;
	background: #fff;
	border-bottom: 1px solid #e4e4e4;
}

.popup.type2 .popHead .popTitle {
	color: #222;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.5px;
}

.popup.type2 .popHead .popClose {
	-webkit-filter: invert(1);
	filter: invert(1);
}

.popup.type2 .popBody {
	border-radius: 0px 0px 8px 8px;
}

.popup.type2 .popBody .inner {
	padding: 16px 20px;
}

.noResult {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

.noResult .innerResult .icoNodata {
	margin-bottom: 8px;
}

.noResult .innerResult .resultTxt {
	color: #767676;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: -0.5px;
	text-align: center;
}

/* 스크롤바 전체 */
*::-webkit-scrollbar {
	width: 6px;
	height: 6px;
}

*::-webkit-scrollbar-track {
	background: #fff;
	/* 트랙 배경색 */
	border-radius: 4px;
}

*::-webkit-scrollbar-thumb {
	background: #ddd;
	/* 기본 색상 */
	border-radius: 4px;
}

/* 스크롤바 tblList */
body::-webkit-scrollbar,
.tblList::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

/* 스크롤 트랙 (배경) */
body::-webkit-scrollbar-track,
.tblList::-webkit-scrollbar-track {
	background: #ddd;
	/* 트랙 배경색 */
	border-radius: 4px;
}

/* 스크롤 손잡이 (thumb) */
body::-webkit-scrollbar-thumb,
.tblList::-webkit-scrollbar-thumb {
	background: #999;
	/* 기본 색상 */
	border-radius: 4px;
}

/* 아이콘 영역 */
.ico {
	display: inline-block;
	text-indent: -9999999999px;
	vertical-align: middle;
}

.icoDel {
	width: 14px;
	height: 14px;
	background: url("/img/icon/ico-del-39704893699a721566abc788e715666c.svg") no-repeat 50%/100%;
}

.icoExcel {
	margin-right: 5px;
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-excel-d48a9191dea035e93bbdfbba5647309f.svg") no-repeat 50%/100%;
}

.icoUseradd {
	margin-right: 5px;
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-user-add-03858dcac58482f00aedab16baab08a1.svg") no-repeat 50%/100%;
}

.icoUseraddW {
	margin-right: 5px;
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-user-add-03858dcac58482f00aedab16baab08a1.svg") no-repeat 50%/100%;
	-webkit-filter: invert(1) brightness(10);
	filter: invert(1) brightness(10);
}

.icoInfo {
	margin-right: 5px;
	width: 18px;
	height: 18px;
	background: url("/img/icon/ico-info-c0d29f7a318df1dd4885cc23b2546e19.svg") no-repeat 50%/100%;
}

.icoArrDown {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-arr-down-8397788fc72694debc88f267a4f1ef6e.svg") no-repeat 50%/100%;
}

.icoFileAtt {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-fileattach-e00cf7db0f8cd4bc6e18622c3f46b30d.svg") no-repeat 50%/100%;
}

.icoEnd {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-end-e9d45076df1d3944673e3e0164e828d6.svg") no-repeat 50%/100%;
}

.icoEva {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-eva-514421c1447b7e05b6df1bd073b26fcc.svg") no-repeat 50%/100%;
}

.icoRefresh {
	margin-right: 5px;
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-refresh-2df19aa0e904b1b19fee71e12d5cb787.svg") no-repeat 50%/100%;
}

.icoClock2 {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-clock-2-61cae3bcf1a28eb3e029447088a6fcfe.svg") no-repeat 50%/100%;
}

.icoTimer {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-timer-0a37887e770aa05dd6732d8d0d22324d.svg") no-repeat 50%/100%;
}

.icoSend {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-send-b47a7c4e088b4823dfc9426e4d1b5a53.svg") no-repeat 50%/100%;
}

.icoSaveW {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-save-w-7422a0b5333cef2b8b802048cbaa2ca5.svg") no-repeat 50%/100%;
}

.icoSave {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-save-7cd9b8fb205bb5dbdeeff56c65948e75.svg") no-repeat 50%/100%;
}

.icoDown {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-down-f256275cbe3e085e53b3a04ca556272b.svg") no-repeat 50%/100%;
}

.icoInfoG {
	width: 14px;
	height: 14px;
	margin-right: 5px;
	background: url("/img/icon/ico-info-gray-ca04fcd4b8141fd236ea004fc3819738.svg") no-repeat 50%/100%;
}

.icoPlusW {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-plus-w-76790e7c1173ebc80fdf0b2af381dbf3.svg") no-repeat 50%/100%;
}

.icoPlus {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-plus-w-76790e7c1173ebc80fdf0b2af381dbf3.svg") no-repeat 50%/100%;
	-webkit-filter: invert(1);
	filter: invert(1);
}

.icoDelRed {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-del-red-e34e63b74eeb33ab0f8e95802bb05c1a.svg") no-repeat 50%/100%;
}

.icoEdit {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-edit-ee4fae7d0b2e3e43e49e5767dc0a2c46.svg") no-repeat 50%/100%;
}

.icoScreenSet {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-screen-set-1596cc7a96e7c5c4dbef07be9efe0bdc.svg") no-repeat 50%/100%;
}

.icobuble {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-buble-eb6eb1e43dd608bbb237d6f7994530df.svg") no-repeat 50%/100%;
}

.icoCounsel {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-counsel-8c4f5b40442ae6bb3f8f3cac002935e3.svg") no-repeat 50%/100%;
}

.icoCenter {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-center-5fd1ca7678857b2981c69a55f812c2fc.svg") no-repeat 50%/100%;
}

.icoFol {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-folder-e801f463f535c1b31a501e760f74dba3.svg") no-repeat 50%/100%;
}

.icoChild {
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background: url("/img/icon/ico-child-a8a5f8d71d93d0db6e8f27f92ab52da1.svg") no-repeat 50%/100%;
}

.icoSibling {
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background: url("/img/icon/ico-doc-add-bd28fb86cbd58f2f17917deee76a552a.svg") no-repeat 50%/100%;
}

.icoRemove {
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background: url("/img/icon/ico-del-bla-69c1bd22791861069b871409f27700f4.svg") no-repeat 50%/100%;
}

.icoGroupW {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-group-123dc2159fd863febce944d86641652a.svg") no-repeat 50%/100%;
	-webkit-filter: brightness(10);
	filter: brightness(10);
}

.icoNodata {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-nodata-537a713cbccf70ac56d0745b7befa191.svg") no-repeat 50%/100%;
}

.icoSearchW {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-search-white-d080438a6caec6cdc8a407b81870c079.svg") no-repeat 50%/100%;
}

.icoChart {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-chart-de8d79646fb20928fec6c107e2c12353.svg") no-repeat 50%/100%;
}

.icoWarningTri {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-warning-tri-a51a42c95bbd30224883eadde44d2f73.svg") no-repeat 50%/100%;
}

.icoTimer2 {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-timer-2-5036ec20c4ec627a6dc3c406accac09f.svg") no-repeat 50%/100%;
}

.icoClock {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-clock-106d87ca4a5919b0776fc914fed316d8.svg") no-repeat 50%/100%;
}

.icoRefreshB {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-refresh-black-82ef653b4f6f502ef35104732379ffe3.svg") no-repeat 50%/100%;
}

.icoUplode {
	width: 20px;
	height: 20px;
	margin-right: 3px;
	background: url("/img/icon/ico-upload-b196775bbd2d9cf007dc0003d6c36c42.svg") no-repeat 50%/100%;
}

.icoPlusB {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-plus-blue-8cbfc079d6392e0b380a2444cffdeb5d.svg") no-repeat 50%/100%;
}

.icoLink {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-link-e62c9e32f75aedadaf031784fa0318b1.svg") no-repeat 50%/100%;
}

.icoSet {
	width: 16px;
	height: 16px;
	margin-right: 3px;
	background: url("/img/icon/ico-set-green-43fd6605784da67ecd1b2cf6bb5c06d9.svg") no-repeat 50%/100%;
}

.icoCheckCir {
	width: 48px;
	height: 48px;
	background: url("/img/icon/ico-check-circle-green-8ff1826bfedb9e1f87357998c29cd9a7.svg") no-repeat 50%/100%;
}

.icoPaste {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-paste-green-c2ee39e6a626395b9ee237cb65d28a2c.svg") no-repeat 50%/100%;
}

.icoCsv {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-csv-489e4c7024649bd86ef8d6b0698e2844.svg") no-repeat 50%/100%;
}

.icoDistri {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-distri-12e01f75dcb856a23f61873f16a07e35.svg") no-repeat 50%/100%;
}

.icoTalk {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-talk-eb1f996cda95caff6abaad5706d05a30.svg") no-repeat 50%/100%;
}

.icoDiversion {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-diversion-412ecb15265a410e1305ecf113994995.svg") no-repeat 50%/100%;
}

.icoTalkG {
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url("/img/icon/ico-talk-green-dacdc1a487162fad10606cb771383d92.svg") no-repeat 50%/100%;
}

.icoSync {
	width: 24px;
	height: 24px;
	background: url("/img/icon/ico-sync-0730946b1e25129f4effac700b96b5bc.svg") no-repeat 50%/100%;
}

.icoIncrease {
	width: 8px;
	height: 8px;
	background: url("/img/icon/ico-increase-777e2862d3938e301c415bde1ef28d30.svg") no-repeat 50%/100%;
}

.icoDecrease {
	width: 8px;
	height: 8px;
	background: url("/img/icon/ico-decrease-82292bb2cb399370e00239c386f1c887.svg") no-repeat 50%/100%;
}

.icoDate {
	width: 20px;
	height: 20px;
	background: url("/img/icon/ico-date-9d37ade936f284900e5a0a5acb8b8f65.svg") no-repeat 50%/100%;
}

.icoTelPer {
	width: 36px;
	height: 36px;
	background: url("/img/icon/ico-tel-per-3b68dcaa16eec91d89b44381c5c49131.svg") no-repeat 50%/100%;
}

.icoRobotPer {
	width: 36px;
	height: 36px;
	background: url("/img/icon/ico-robot-per-82e6386292080f4c73c354ddcba390a9.svg") no-repeat 50%/100%;
}

.icoRefreshPer {
	width: 36px;
	height: 36px;
	background: url("/img/icon/ico-refresh-per-bc2d389ad2ea8afed43fe2402eebd5f0.svg") no-repeat 50%/100%;
}

.icoCheckPer {
	width: 36px;
	height: 36px;
	background: url("/img/icon/ico-check-per-d7923ee3245f98984fdfe9bf64f35f7c.svg") no-repeat 50%/100%;
}

.icoPause {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-pause-df435e5baa0fd66b6f04b4ad059c2bec.svg") no-repeat 50%/100%;
}

.icoPlay {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-play-cc14e92acf433477b18171903b505134.svg") no-repeat 50%/100%;
}

.icoStop {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-stop-38fb1372bab2bf270958261858701da8.svg") no-repeat 50%/100%;
}

.icoDeploy {
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background: url("/img/icon/ico-deploy-02628ba3fbf70efec75e47bebf45eba5.svg") no-repeat 50%/100%;
}

.icoSimulation {
	width: 16px;
	height: 16px;
	background: url("/img/icon/ico-simulation-5b4f6cad1c22f0cf3fe3aa894e79c141.svg") no-repeat 50%/100%;
}

/* media query */
@media all and (min-width: 1024px) {
	html {
		font-size: 16px;
	}
}

@media all and (max-width: 1023px) {
	html {
		font-size: 14px;
	}
}

@media all and (max-width: 767px) {
	html {
		font-size: 13px;
	}
}

@media all and (max-width: 639px) {
	html {
		font-size: 12px;
	}
}

@media all and (max-width: 479px) {
	html {
		font-size: 10px;
	}
}

@media all and (max-width: 359px) {
	html {
		font-size: 9px;
	}
}

@media all and (max-width: 319px) {
	html {
		font-size: 8px;
	}
}