@charset "UTF-8";

.layer-overlay {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	z-index: 99;
}
/*아이디찾기*/
.information-id-group {
	display: flex;
	flex-direction: column;
	width: 1100px;
	margin: 0 auto;
	gap: 20px;
	text-align: center;
	height: 100%;
	min-height: auto;
}

.method {
	max-width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 50%;
	padding: 3.2rem;
	text-decoration: none;
	border: 1px solid #cbd4ff;
	border-radius: 10px;
	background-color: #edf2ff;
	gap: 5px;
	flex: 1;
}

.method .tit {
	font-size: 25px;
	font-weight: 600;
}

.auth-before {
	display: flex;
	flex-direction: column;
	gap: 30px;
	    height: 100%;
}

.auth-before h2 {
	text-align: justify;
	color: #fff;
}

.cl-text {
	gap: 5px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.cl-text h4 {
	font-size: 22px;
}

.auth-before-group {
	display: flex;
	justify-content: space-between;
	border-radius: 10px;
	flex-direction: column;
	gap: 20px;
	align-items: center;
}

.cl-subtext {
	width: 70%;
	line-height: 1.5;
	padding: 10px 0;
	border-radius: 10px;
	font-size: 14px;
	color: #777;
}

.ico-certification-phone:before {
	content: '';
	background-image: url(../images/icon/ico-certification-phone.svg);
	display: block;
	width: 32px;
	height: 32px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.user-info-wrapper h2 {
	color: #fff;
	text-align: justify;
}

.user-info-wrapper .id-box span {
	color: #2d50ff;
	font-weight: 600;
	margin-right: 5px;
}

.user-info-wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.user-info-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
}

.subtext {
	font-size: 13px;
	color: #777;
}

span.subtitle {
	text-align: left;
	font-size: 22px;
	font-weight: 600;
}

.result-box {
	line-height: 2;
	display: flex;
	align-items: center;
	gap: 5px;
	justify-content: center;
	background-color: #edf2ff;
	padding: 10px 35px;
	border-radius: 10px;
	border: 1px solid #cbd4ff;
}

.user-info-content {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-top: 10px;
	width: 50%;
}

.name-box {
	display: flex;
	align-items: center;
	gap: 5px;
}

.has-member {
	display: flex;
	width: 50%;
	gap: 10px;
	margin: auto;
}

.name-box::before {
	content: "";
	display: block;
	width: 35px;
	height: 35px;
	background-image: url(../images/icon/ion_person-circle.svg);
	background-size: contain;
	background-repeat: no-repeat;
	margin-right: 6px;
	vertical-align: middle;
	margin: auto;
}

.auth-after {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 20px;
}

.new-pw-group {
	width: 100%;
}

.new-pw-item {
	display: flex;
	gap: 10px;
	border-bottom: 1px solid #ddd;
	width: 100%;
	margin: auto;
	padding: 15px 0;
	text-align: left;
	align-items: center;
}

.form-check {
	display: flex;
	gap: 5px;
}

.new-pw-title {
	width: 150px;
}

.new-pw-inp {
	width: calc(100% - 150px);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.new-pw-inp .input {
	width: 100%;
	font-size: 15px;
}

.btn-toggle-pw {
	position: relative;
	width: 32px;
	height: 32px;
	border: none;
	background: none;
	cursor: pointer;
}

/* 기본 눈 아이콘 (비밀번호 숨김 상태) */
.btn-toggle-pw::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-image: url('../images/icon/ico-pwd-view-on.svg');
	/* 아이콘 경로 */
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}
/* active일 때: 눈 뜬 상태 (비밀번호 표시 중) */
.btn-toggle-pw.active::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-image: url('../images/icon/ico-pwd-view-off.svg');
	/* 아이콘 경로 */
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}

/*로그인*/
.section-bc {
	background-color: #fff;
}

.user_contents {
	width: 50%;
	margin: auto;
	    height: 100%;
}

.section-first {
	max-width: 1100px;
	display: flex;
	flex-direction: column;
	gap: 30px;
	margin: auto;
	height: 100%;
	min-height: calc(100vh - 153px);
}

.admin-login-wrapper {
	display: flex;
	flex-direction: column;
}

/* .login-title {
	display: flex;
	flex-direction: column;
	gap: 30px;
	box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.15);
	border-radius: 10px;
	background-color: #ffffff;
} */
.mid-section {
	display: flex;
	width: 100%;
	flex-direction: column;
}

.logintext-group {
	display: flex;
	flex-direction: column;
	background-image: url("../images/background/login_background.jpg");
	/* 이미지 경로 */
	background-size: cover; /* 영역에 맞게 채움 */
	background-position: center; /* 가운데 정렬 */
	background-repeat: no-repeat; /* 반복 방지 */
	border-radius: 10px 0 0 10px;
	padding: 100px 30px;
	color: #fff;
	flex: 1;
	gap: 30px;
	padding: 30px;
}

.btn-wrap {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
}

.btn-wrap .btn {
	background-color: #2d50ff;
	padding: 10px;
	width: 100%;
	border-radius: 5px;
	color: #fff;
}

.user-wrap {
	gap: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 20px 0;
	flex: 1;
}

.user-wrap-group {
	display: flex;
	flex-direction: column;
	height: 76px;
	background-color: #2d50ff;
}

.login-text {
	font-size: 25px;
	font-weight: bold;
	display: flex;
	width: 100%;
	height: 93.7px;
	align-items: center;
}

.sm-group {
	display: flex;
	flex-direction: column;
	font-size: 16px;
	gap: 5px;
}

.user-input {
	display: flex;
	width: 100%;
	border-bottom: 1px solid #ddd;
}

.userlogin_id, .userlogin_pw {
	display: flex;
	width: 100%;
	font-size: 15px;
	padding: 10px;
}

.user-btn {
	display: flex;
	font-size: 14px;
	letter-spacing: -1px;
	justify-content: center;
	gap: 5px;
}

.user-info {
	display: flex;
	justify-content: center;
}

.login-log {
	display: flex;
	width: 150px;
	margin: auto 15px;
}

.login-item {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.login-group {
	display: flex;
	flex-direction: column;
	gap: 20px;
	justify-content: left;
	width: 50%;
	margin: 50px auto;
}

.login-wrap {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.user-input.warning {
	border-bottom: 1px solid #ee0000;
}

.userlogin-title {
	min-width: 120px;
	display: flex;
	align-items: center;
}

.login-warning-text {
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-items: center;
}



.top-nav {
	display: flex;
	align-items: center;
	padding: 20px;
	gap: 5px;
	max-width: 1400px;
	margin: auto;
}

.top-container {
	border-bottom: 1px solid #ddd;
}

.top-nav span::before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	background-image: url("../images/icon/next.svg"); /* 아이콘 이미지 */
	background-size: contain; /* 크기에 맞게 */
	background-repeat: no-repeat;
	margin-right: 6px;
	vertical-align: middle;
}

.top-nav a {
	color: #949494;
}

.side-nav {
	display: flex;
	flex-direction: column;
	max-height:100%;
	z-index: 1;
	width: 330px;
	border-right: 1px solid rgba(229, 229, 229, 0.5);
	background-color: #ffffff;
	box-sizing: border-box;
	transition: all 0.25s;
	box-shadow: 1px -1px 8px #e4e4e487;
	padding: 20px;
}

.area_sidemenu {
	background-color: #fff;
}

.area_sidemenu .menu .menu_label {
	font-size: 25px;
	color: #000000;
	font-weight: 600;
}

/* .list_opentype {
	position: relative;
}

.list_opentype li {
	display: block;
	padding: 15px;
	font-size: 16px;
	line-height: 22px;
	color: #444;
	word-break: break-all;
	text-align: left;
	position: relative;
	cursor: pointer;
	border-bottom: 1px solid rgba(229, 229, 229, 0.5);
}

.list_opentype li.select {
	background-color: #EDF2FF;
	color: #3f4044;
	font-weight: bold;
}

.list_opentype li:hover {
	background-color: #EDF2FF;
	color: #000;
}
 */
.list_opentype li.select>a {
	background: #edf2ff;
	color: #2d50ff;
	font-weight: 600;
}

.list_opentype li>a {
	display: block;
	padding: 15px 20px;
	font-weight: 400;
	border-bottom: 1px solid #ddd;
}
/*하위메뉴*/
.list_opentype li .submenu li a {
	position: relative;
	font-size: 14px;
	text-decoration: none;
	display: block;
	padding: 15px 35px;
	border-bottom: 1px solid #ddd;
	color: #767676;
	font-weight: 400;
}

.menu-text-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px;
	border-bottom: 2px solid #2d50ff;
}

.sub-container {
	display: flex;
	max-width: 1400px;
	margin: 0 auto;
	width: 100%;
	height: 100%;
}

.open-icon {
	width: 25px;
	height: 25px;
}

.button-down {
	display: flex;
	justify-content: end;
}

.button-down-icon {
	padding: 5px 10px;
	background-color: #2d50ff;
	color: #fff;
	border-radius: 5px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.button-down-icon button {
	color: #fff;
}

.download {
	width: 20px !important;
	height: 20px;
	display: flex;
}

.new-icon-group .file-size {
	font-weight: 600;
	letter-spacing: -1px;
}

.docscontent {
	display: flex;
	width: calc(100% - 330px);
	flex-direction: column;
	background-color: #f7f8f8;
	height: 100%;
}

.content-title {
	padding: 20px;
	background-color: #2d50ff;
	color: #fff;
}

.content-title h2 {
	display: flex;
	height: 100%;
	align-items: end;
}

.title-button {
	display: flex;
	justify-content: space-between;
}

.title-button>.button-down>.button-down-icon {
	border: 1px solid #fff;
}

.docscontent-content {
	display: flex;
	flex-direction: column;
	padding: 20px;
	height: 100%;
}

.content-sub {
	background-color: #fff;
	padding: 20px;
	height: 100%;
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 10px;
	display: flex;
}

.content-sub h3 {
	margin-left: 5px;
}

.content-row {
	background-color: #fff;
	padding: 10px;
	display: flex;
	gap: 10px;
	height: 100%;
}

.toggle-btn, .expand-btn {
	display: none;
}

.menu-text-title select.version {
    border: 1px solid #2d50ff;
    border-radius: 5px;
    padding: 5px 10px;
    width: 100px;
    color: #2d50ff;
}

/*관리자 */
.admin-wrap {
	gap: 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 30px;
	flex: 1;
}

.luserlogin {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.luser_btn {
	background-color: #132058;
	padding: 10px;
	width: 100%;
	border-radius: 5px;
	color: #fff;
}

.luser-section-bc {
	height: 100%;
	display: flex;
}

.luser-logintext-group {
	display: flex;
	flex-direction: column;
	color: #fff;
	flex: 1;
	gap: 30px;
	padding: 30px;
	background-color: #132058;
	border-radius: 0 10px 10px 0;
	justify-content: center;
	align-items: center;
	background-image: url(../images/background/bg_intro.svg);
	background-repeat: no-repeat;
}

.luser-login-text {
	font-size: 25px;
	font-weight: bold;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.luser-logintext-group .sm-group {
	align-items: center;
}
/*회원가입*/

/*단계*/
.c-title-section {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #2d50ff;
	padding: 10px 15px;
	height: 76px;
}

.heading-area h2 {
	color: #fff;
}

.c-step-list.default .info-title:before {
	content: counter(stepCounter);
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color: #2d50ff;
	border: 1px solid #ffffff;
	margin: 0 auto 5px;
	border: 1px solid #ffffff;
}

.info-title {
	color: #fff;
}

.is-blind {
	overflow: hidden;
	border: 0;
	position: absolute;
	width: 1px;
	height: 1px;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
}

.c-step-list.default>li:first-of-type:after {
	left: 50%;
	content: "";
	position: absolute;
	top: 16px;
	left: 0;
	width: 100%;
	height: 0.5px;
	background-color: #ddd;
}

.pd-none {
	padding: 0 !important;
}

.c-step-wrap {
	flex: 0 0 auto;
	margin-top: 0;
	padding: 0 0 0 40px;
}

.c-step-list.default {
	font-size: 12px;
	display: flex;
	text-align: center;
	margin-left: -15px;
	justify-content: center;
	counter-reset: stepCounter
}

.c-step-list.default>li {
	min-width: 112px;
	padding: 0 10px;
	position: relative;
}

.c-step-list>li {
	counter-increment: stepCounter;
}

.c-step-list.default .is-active .info-title {
	color: #fff;
}

.c-step-list.default .is-active .info-title:before {
	background-color: #fff;
	border-width: 2px;
	border-color: #2d50ff;
	color: #2d50ff;
	font-weight: 700;
}

.c-step-list.default>li:first-of-type:after {
	left: 50%;
}

/**/
.user-info-sub-group {
	display: flex;
	flex-direction: column;
	gap: 30px;
	width: 100%;
}

.user-info-sub {
	width: 100%;
	background-color: #edf2ff;
	padding: 10px;
	border-radius: 5px;
	font-size: 13px;
	font-weight: 400;
	border: 1px solid #d3daff;
	text-align: left;
}

.user-info-sub ol li:before {
	content: " ·"; /* li 뒤에 · 추가, 앞에 공백 한 칸 */
	color: #000; /* 색상 지정 가능 */
	display: inline-block;
	position: absolute;
}

.user-info-sub ol li span {
	padding: 0 10px;
	display: inline-block;
}

.user-info-sub-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
}

.f_field {
	display: flex;
	vertical-align: middle;
	box-sizing: border-box;
	float: left;
	position: relative;
	width: 100%;
	    height: 100%;
}

.f_wrap {
	display: flex;
	position: relative;
	width: 100%;
	gap: 10px;
	border-bottom: 1px solid #ddd;
	margin: auto;
	padding: 15px 0;
	text-align: left;
	align-items: center;
}

.f_field .ff_title {
	display: inline-block;
	vertical-align: middle;
	min-width: 130px;
	overflow: hidden;
	font-size: 16px;
	color: #000;
	line-height: 32px;
	text-align: left;
}

.f_field-group {
	display: flex;
	flex-direction: column;
}

.f_warning.on {
	display: inline-block;
}

.f_warning.t1 {
	color: #381efb;
}

.ff_wrap-group {
	display: flex;
	flex-direction: column;
	width: calc(100% - 130px);
}

.f_warning {
	display: none;
	width: calc(100% - 135px);
	text-indent: 10px;
	text-align: left;
	font-size: 13px;
	font-weight: 400;
	color: #f90000;
	line-height: 25px;
	letter-spacing: -0.5px;
	word-break: keep-all;
	margin-left: 140px;
	padding: 10px 0;
}

.f_field .ff_title label {
	position: relative;
}

.ff_wrap {
	display: flex;
	position: relative;
	float: left;
	width: calc(100% - 130px);
	line-height: 0;
	gap: 10px;
	align-items: center;
}

.f_field input {
	display: inline-block;
	vertical-align: middle;
	max-width: 100%;
	float: left;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	outline: none;
	border-radius: 5px;
	font-size: 15px;
	font-weight: 400;
	color: #000;
	letter-spacing: -0.5px;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding: 10px;
}

.field-checkbox {
	display: flex;
	width: 50%;
	margin: auto;
	font-size: 13px;
	flex-direction: column;
	align-items: self-end;
	gap: 10px;
}

.field-checkbox-item {
	display: flex;
	align-items: stretch;
	gap: 2px;
}

.f_field .ff_wrap .button {
	margin-left: 10px;
}

.additional {
	border: 1px solid #d6dcff;
	padding: 20px;
	border-radius: 5px;
	background-color: #edf2ff;
}

.button.middle {
	width: auto;
	min-width: 80px;
	height: 45px;
	border-width: 1px;
	border-radius: 5px;
	padding: 0;
	text-indent: 0;
	font-size: 16px;
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
	position: relative;
	border: #2d50ff solid 1px;
	font-weight: 400;
	color: #2d50ff !important;
	-webkit-transition: 0.3s;
	text-decoration: none !important;
}

.ff_wrap+.ff_wrap {
	margin-top: 15px;
}

.select.email, .select.affiliation {
	width: 100%;
	background-color: #fff !important;
	background: url('../../resources/images/icon/icon_arrow_selectbox.svg')
		no-repeat right 20px center;
	background-size: 15px;
	overflow: visible;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 1.5;
	display: inline-block;
	height: 40px;
	padding-left: 10px;
	border: 1px solid #ddd;
}


.input.email+.dash {
	display: inline-block;
	float: left;
	vertical-align: middle;
	box-sizing: border-box;
	width: 40px;
	font-size: 24px;
	font-weight: 300;
	color: #848484;
	letter-spacing: -0.5px;
	line-height: 1.5;
	text-align: center;
}



.f_field .email .input.on:last-child {
	display: inline-block;
}

.input:hover {
	border-color: #381efb;
}

button.view.btn-agree {
	color: #0b0b0b;
	letter-spacing: -2px;
	font-size: 14px;
	border-radius: 5px;
	text-decoration: underline;
	line-height: 2;
}

.agree-term {
	width: 18px;
}

/*api 신청*/
.terms-wrapper {
	max-width: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* 시각적으로 보이지 않지만 스크린리더에는 보이는 텍스트 */
.visually-hidden {
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
	border: 0;
	padding: 0;
	margin: -1px;
}

/* textarea 스타일 (읽기전용) */
.terms-textarea {
	width: 100%;
	height: 240px;
	padding: 12px;
	resize: vertical; /* 사용자가 높이 조절 가능 */
	border: 1px solid #d0d0d0;
	border-radius: 6px;
	line-height: 1.6;
	background: #fafafa;
	color: #222;
	font-size: 14px;
	box-sizing: border-box;
	resize: none;
}

/* 약관 영역 박스 (읽기전용) */
.terms-box {
	width: 100%;
	height: 240px;
	border: 1px solid #d0d0d0;
	border-radius: 5px;
	background: #fafafa;
	box-sizing: border-box;
	overflow: auto;
}

.terms-controls {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: end;
}

.terms-actions {
	margin-top: 10px;
	display: flex;
	gap: 8px;
}

.btn {
	padding: 8px 14px;
	border-radius: 6px;
	border: 1px solid transparent;
	cursor: pointer;
	font-weight: 600;
	background: #2b6cb0;
	color: #fff;
}

.btn.secondary {
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
}

.btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* 이메일 입력 영역 기본 스타일 */
.ff_wrap.email {
	display: flex;
	align-items: center;
	gap: 6px; /* 요소 간 간격 */
}

/* 직접입력 input 기본 숨김 */
#emailDomain {
	display: none; /* 숨김 상태 */
}

/* 직접입력 선택 시 활성화 */
#emailDomain.on {
	display: inline-block; /* 또는 block 가능 */
}

.temp-wrapper {
	display: flex;
	align-items: center;
	gap: 5px;
    width: 100%;
}

.temp-wrapper input {
/* 	max-width: 150px; */
	width: 100%;
}

.login-group .font_12.red {
	padding: 0 0 0 120px;
	text-align: left;
}

/*시술*/
.data-term-tree {
	font-size: 12px;
	color: #222;
	border-radius: 5px;
	display: flex;
	gap: 10px;
	/* 	min-width: calc(100% - 250px); */
	width: 100%;
}

/* 각 단계별 들여쓰기 — 트리 느낌 */
.data-term-tree ul {
	list-style: none;
	/*	padding-left: 15px;  depth마다 들여쓰기 */
}

.data-term-tree>ul>li>ul>li>ul {
	border-left: 1px solid #ddd;
}

.data-term-tree>ul>li>ul>li>ul>li>ul {
	border-left: 1px solid #ddd;
}

.data-term-tree>ul:first-child>li>ul>li {
	border-left: 1px solid #ddd;
}

.data-term-tree>ul>li>ul>li>ul>li>ul>li>ul {
	border-left: 1px solid #ddd;
}

.data-term-tree>ul:last-child>li>ul {
	border-left: 1px solid #ddd;
}

.data-term-tree.datadevicetree>ul:last-child>li>ul, .data-term-tree.dataprestree>ul:last-child>li>ul
	{
	border-left: none;
}

.dataprestree>ul, .datadevicetree>ul {
	width: 100% !important;
}

.data-term-tree>ul:first-child>li>ul {
	display: flex;
	gap: 15px;
}

.data-term-tree>ul:first-child>li>div, .data-term-tree>ul:last-child>li>div
	{
	border: 1px solid #dae0e5;
	color: #0349ff;
	background-color: #edf2ff;
	font-weight: 600;
	font-size: 15px;
}

.data-term-tree>ul {
	border-left: none; /* 최상위는 라인 제거 */
	padding-left: 0;
	height: 100%;
}

.data-term-tree li {
	margin: 5px 0;
	width: 100%;
	height: 100%;
	padding-left: 15px;
}

/* 노드 영역 */
.data-term-tree li>div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 5px 8px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 5px;
	transition: all 0.2s ease;

	position: relative;
}
.data-term-tree li>div.leaf.has-terms{
	    background-color: #edf2ff;
	        cursor: pointer;
}
.data-term-tree li>div.leaf.has-terms.active {
	    background-color: #edf2ff;
    border: 1px solid #2d50ff;
    box-shadow: 0 0 2px #2d50ff;
}

/* hover 시 */
.data-term-tree li>div:hover {
	background: #e6f3ff;
	border-color: #99ccff;
}

/* 버튼 */
.data-term-tree button {
	border: none;
	background: none;
	cursor: pointer;
	margin-left: 5px;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	transition: background 0.2s;
}

/* 임시 아이콘 */
.data-term-tree button.add::before {
	content: '+';
	color: #3b82f6;
	font-weight: bold;
}

.data-term-tree button.edit::before {
	content: '✎';
	color: #f59e0b;
}

.data-term-tree button.delete::before {
	content: '×';
	color: #ef4444;
	font-weight: bold;
}

.data-term-tree button:hover {
	background: #f1f5f9;
}

/* 선택된 노드 */
.data-term-tree li.selected>div {
	background: #cce5ff !important;
	border-color: #66a3ff;
}

.tree-layout {
	display: flex;
	flex-direction: column;
	align-items: center;
	font-family: 'Noto Sans KR';
}

.level {
	display: flex;
	justify-content: center;
	margin: 20px 0;
	position: relative;
}

.group {
	display: flex;
	justify-content: center;
	gap: 30px;
	margin: 0 50px;
}

.node {
	background: #fff;
	border: 2px solid #2b65ec;
	border-radius: 20px;
	padding: 6px 16px;
	font-weight: bold;
	color: #002060;
	text-align: center;
	position: relative;
}

/* 선 연결 */
.level+.level::before {
	content: "";
	position: absolute;
	top: -10px;
	left: 50%;
	width: 2px;
	height: 20px;
	background: #2b65ec;
	transform: translateX(-50%);
}

.data-term-item span {
	font-size: 12px;
}

.data-term-item span.title-xs {
	font-weight: bold;
	width: 70px;
	display: inline-block;
}

.data-term-item span.title-desc {
	display: block;
	text-indent: 0;
	white-space: pre-line;
	font-size: 11px;
}

.data-term-item {
	display: flex;
	flex-direction: column;
	gap: 5px;
	border-bottom: 1px solid #ddd;
	padding-bottom: 5px;
}

.data-term-card-group {
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 5px;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.data-term-item h4 {
	color: #2d50ff;
	font-size: 12px;
}

.data-term-title h2 {
	padding: 3px 5px;
	width: calc(100% - 22px);
	color: #fff;
	border-radius: 5px;
	font-size: 14px;
}

.data-term-title {
	background-color: #2d50ff;
	padding: 5px;
}

.data-term-item-table {
	width: 100%;
}

.data-term-item-table table {
	width: 100%;
	font-size: 12px;
	border: 1px solid #ddd;
}

.data-term-item-table thead th {
	text-align: left;
	padding: 5px;
	background: #f3f4f6;
	border-bottom: 1px solid #e5e7eb;
}

.data-term-item-table td {
	padding: 5px;
	border-bottom: 1px solid #e5e7eb;
	font-size: 11px;
}

.data-term-item:last-child {
	border-bottom: none;
}

.data-term-card {
	display: none;
}

.data-term-card.active {
	background-color: #edf2ff;
	width: 210px;
	border-radius: 5px;
	border: 1px solid #ddd;
	margin: 0;
	padding: 5px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	position: fixed;
	bottom: 110px;
	height: calc(100vh - 400px);
	z-index: 999;
	right: 0;
}

.sub-item-group-xs {
	position: relative;
}

.data-term-tree>ul:first-child {
	width: 80%;
}

.data-term-tree>ul:last-child {
	width: 20%;
}

.data-term-tree-group {
	width: 100%;
}

.relative {
	position: relative;
}

.data-term-card-group .btn-close {
    position: absolute;
    width: 20px;
    height: 20px;
    padding: 0;
    background: #00000063;
    border: none;
    cursor: pointer;
    border-radius: 50%;
    right: 10px;
    top: 13px;
}

.btn-close::before {
    content: "";
    position: absolute;
    inset: 0; /* top:0; right:0; bottom:0; left:0; 와 동일 — 정중앙 유지 */
    display: block;
    background-image: url('../images/icon/close_w.svg'); /* 원하는 X 이미지 경로 */
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% 50%; /* iOS 기준 안정권. 필요하면 조절 */
    
}

.data-term-content {
	overflow: auto;
	scrollbar-width: thin;
	padding: 5px;
	scrollbar-color: #0000001f transparent;
	display: flex;
	flex: 1 1 0;
	min-height: 0;
}

.data-term-content ul {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

/* 드래그 가능한 테두리 */
.drag-border {
	position: absolute;
	background: transparent;
}
/* 각 방향별 테두리 */
.drag-border.top {
	top: 0;
	left: 0;
	width: 100%;
	height: 10px;
	cursor: move;
}

.drag-border.bottom {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	cursor: move;
	border: none;
}

.drag-border.left {
	top: 0;
	left: 0;
	width: 10px;
	height: 100%;
	cursor: move;
}

.drag-border.right {
	top: 0;
	right: 0;
	width: 10px;
	height: 100%;
	cursor: move;
}

.data-term-tree li>div::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -15px;
	width: 15px;
	height: 0.1px;
	background: #ddd;
	transform: translateY(-50%);
}

.data-term-tree>ul:first-child>li>div::before, .data-term-tree>ul:last-child>li>div::before
	{
	content: "";
	width: 0;
}

/*페이징*/
/* 페이징 */
.pagination-wrap ul {
	display: flex;
	gap: 5px;
	align-items: center;
}

.pagination-wrap-user.right ul {
	justify-content: flex-end;
}

.pagination-wrap-user.center ul {
	justify-content: center;
}

.pagination-wrap-user ul li:not(.paginationjs-ellipsis) a {
	display: flex;
	width: 30px;
	height: 30px;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	border: solid 1px #cdcdcd;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
}

.pagination-wrap-user ul li.active a {
	background-color: #395ad4;
	color: #ffffff;
	border-color: #395ad4;
}

.pagination-wrap-user ul li.paginationjs-ellipsis a {
	padding: 0 5px;
}

.pagination-wrap-user ul li.paginationjs-prev a, 
.pagination-wrap-user ul li.paginationjs-next a 
	{
	color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: auto 15px;
}

.pagination-wrap-user ul li.paginationjs-prev a {
	background-image: url('../images/icon/angle-small-left.svg');
}

.pagination-wrap-user ul li.paginationjs-next a {
	background-image: url('../images/icon/angle-small-right.svg');
}

.pagination-wrap-user ul {
	display: flex;
	gap: 5px;
	align-items: center;
}

.section-content {
	height: auto;
	min-height: auto;
	flex: 1;
	display: flex;
	flex-direction: column;
}

/*사이트맵*/
.site-map {
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}

.site-map-title {
	display: flex;
}

.site-map-title a {
	border: 1px solid #2d50ff;
	border-radius: 5px;
	padding: 10px 20px;
	background-color: #2d50ff;
	font-size: 20px;
	font-weight: 600;
	color: #fff;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.site-map-title a:hover {
	border: 1px solid #2d50ff;
	background-color: #fff;
	color: #2d50ff;
}

.site-map-content {
	width: 100%;
}

.site-map-content-top {
	width: 100%;
	display: flex;
	gap: 10px;
	justify-content: space-between;
}

.site-map-content-top ul {
	display: flex;
	width: 100%;
	position: relative;
	flex-direction: column;
	gap: 40px;
}

.site-map-list-group h2 {
	min-width: 250px;
	padding: 5px 20px;
	background-color: #edf2ff;
	border-radius: 5px;
	border: 1px solid #ebebeb;
	color: #2d50ff;
	width: 280px;
	text-align: center;
	font-size: 17px;
	z-index: 999;
	height: 60px;
	justify-content: center;
	display: flex;
	align-items: center;
}

.site-map-content-top ul.site-map-item {
	flex-direction: row;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	flex-wrap: wrap;
}

.site-map-list-group {
	display: flex;
	gap: 20px;
	width: 100%;
}

.site-map-content-top ul.site-map-item li>a {
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 5px;
	width: 130px;
	text-align: center;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.site-map-content-top ul.site-map-item li>a:hover {
	border: 1px solid #2d50ff;
	color: #2d50ff;
	background-color: #edf2ff;
}

.site-map-content-top ul.site-map-item li>a>span {
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.site-map-content-top ul.site-map-item li {
	display: flex;
	height: 60px;
}

.site-map-list {
	display: flex;
	width: 100%;
}

.std-data {
	display: flex;
	gap: 10px;
	width: 100%;
	flex-direction: column;
}

.std-data-list {
	display: flex;
	gap: 10px;
}

.std-data-item {
	display: flex;
	flex-direction: column;
	gap: 5px;
	flex: 1;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 5px;
	text-align: center;
	color: #666666;
	font-size: 14px;
	background-color: #f7f9ff;
	    cursor: pointer;
}

.std-data-item p {
	font-weight: 600;
	font-size: 25px;
	color: #000;
}


/*커스텀 셀박*/

.dacustom-select-container {
    position: relative;
    width: 100%;
}

.dacustom-select  {
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
    background: #fff;
    user-select: none;
}
.dacustom-selected{
	background: url(../../resources/images/icon/icon_arrow_selectbox.svg) no-repeat right 5px center;
    background-size: 15px;
}


.dacustom-select .dacustom-options {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    border: 1px solid #ddd;
    background: #fff;
    z-index: 1000;
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 5px;
}


.dacustom-select .dacustom-options li {
    padding: 8px 10px;
    cursor: pointer;
}

.dacustom-select .dacustom-options li:hover {
    background: #f0f0f0;
}


.dacustom-select.open .dacustom-options {
    display: block;
}

/* 기존 select 숨기기 */
.dacustom-select-container > select {
    display: none;
}

/*커스텀 셀박*/