@charset "UTF-8";

.sel-lg, .inp-lg {
	width: 100%;
	font-size: 12px;
	padding: 5px;
	height: 22px;
	line-height: 1;
}
.h-46 {
    min-height: 46px;
    display: flex;
    height:100%;
}
/* 블루 계열 */
.text-blue {
	color: #84bedf;
	border-top: 1px solid #ddd;

	    padding-top: 5px;
}

#clinicItemA_1 .text-blue {
	border-top: none;
}

.sel-sm, .inp-sm {
    width: 70px;
    font-size: 12px;
    padding: 5px;
    height: 24px;
    line-height: 1;
}

.inp-xsm{
    width: 50px;
    font-size: 12px;
    height: 25px;
    line-height: 1;
    padding: 5px;
    text-align: center;
}

.sel-sml {
	width: 100px;
	font-size: 12px;
	padding: 5px;
	height: 25px;
	line-height: 1;
}

.sel-m, .inp-m {
	width: 140px;
		height: 22px;
}

.w-200 {
	max-width: 200px !important;
}

.w-100 {
	width: 100% !important;
	max-width: 100% !important;

}

.w-60 {
	width: 60px !important;
	white-space: normal; /* ✅ 줄바꿈 허용 */
	word-wrap: break-word; /* ✅ 오래된 브라우저 호환 */
	overflow-wrap: break-word; /* ✅ 최신 브라우저용 */
}

.h-100{
		    height: 100%;
}

.h-25 {
	height: 25px !important;
}

.empty {
	justify-content: center;
}

.w-300 {
	width: 300px;
	max-width: 300px;
	min-width: 300px;
}

.label-lg-p {
	font-size: 13px;
	font-weight: bold;
}

.border {
	border: 1px solid #ddd;
}

.border-none {
	border: none !important;
}



.bor-top-rig {
	border-top: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.bor-top-bot-no {
	border-top: none !important;
	border-bottom: none !important;
}

.bor-top-no {
	border-top: none !important;
}

.bor-bot-ri-no {
	border-bottom: none !important;
	border-right: none !important;
}

.bor-top-ri-no {
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
}

.bor-top {
	border-top: 1px solid #bcbcbc;
}

.bor-bottom {
	border-bottom: 1px solid #bcbcbc;
}

.bor-left {
	border-left: 1px solid #bcbcbc;
}

.table-cell input.inp-sm {
	width: 80%;
	display: inline-block;
	vertical-align: middle;
}

.table-cell select.sel-sm {
	width: 100%;
}

.eraser {
	vertical-align: middle;
	cursor: pointer;
}

.table {
	display: table;
	width: 100%;
	border-collapse: collapse; /* 겹치는 선 없애기 느낌 */
}

.table-row {
	display: table-row;
	border: 1px solid #ddd;
}

.table-cell {
	display: table-cell;
	padding: 5px;
	vertical-align: middle;
	text-align: center;
	border-right: 1px solid #ddd;
}

.table-cell:first-child {
	width: 100px;
}

.table-cell:nth-child(2) {
	width: 200px;
	max-width: 200px;
}

.table-header .table-cell {
	font-weight: bold;
	background: #f2f8fb;
	border: 1px solid #ddd;
}

.gap-10 {
	gap: 10px;
}

.gap-20 {
	gap: 20px;
}

.gap-5 {
	gap: 5px;
}

.p-5 {
	padding: 5px;
}

.pop-content-wrap {
	padding: 0px;
	background-color: #fff;
	width: 100%;
	height: 100%;
}



.button-group {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.button-group .btn-close {
	padding: 0 15px;
	font-weight: 500;
	height: 32px;
	line-height: 1;
	min-width: 82px;
	font-size: 12px;
	background-color: #fff;
	border: 1px solid #132058;
	color: #132058;
}

.button-group .btn-save {
	padding: 0 15px;
	font-weight: 500;
	height: 32px;
	line-height: 1;
	min-width: 82px;
	font-size: 12px;
	background-color: #132058;
}

.clinicitems_1 {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-height: 100%;
	width: 100%;
}

.clinicitems_container {
	display: flex;
	width: 100%;
	height: 100%;
}

.clinicitems_group {
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
	padding: 5px;
	height: 100%;
}

.new-menu {
	display: flex;
	justify-content: space-between;
	gap: 5px;
	padding: 8px;
	height: 51px; /*변경예정*/
}

.new-menu ul {
	display: flex;
	justify-content: space-between;
	border: 1px solid #000;
	gap: 5px;
}

.new-menu ul a {
	font-size: 12px;
}

/*공통 왼쪽 사이드바*/
.sidebar {
	display: flex;
	flex-direction: column;
	max-width: 250px;
	background-color: #e0e7ef;
	position: relative;
	max-height: 100%;
	min-width: 250px;
}

.sidebar-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 5px;
	overflow: auto;
height: calc(100% - 5px);
	/* 	scrollbar-gutter: stable; */
	padding-left: 5px;
}

.sidebar-header {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: space-between;
	width: 100%;
}

.sidebar-header h2 {
	font-size: 17px;
	font-weight: bolder;
	color: #2a3c66;
}

.sidebar-content {
	display: flex;
	flex-direction: column;
	height: 100%;
/*     overflow: hidden; 필요하면 auto */
}

.sidebar-content ol {
	display: flex;
	flex-direction: column;
	gap: 10px;
		height: 100%;
}

.sidebar-title {
	background-color: #fff;
	border: 1px solid #2a3c66;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
}

.sidebar-s {
	padding: 10px;
	font-weight: 600;
	color: #132058;
}

.sidebar-o, .sidebar-a, .sidebar-p {
	padding: 10px;
	border-bottom: 1px solid;
	font-weight: 600;
	color: #132058;
}

.sidebar-list {
    max-height: 300px;
    overflow-y: auto;
    transition: max-height 0.3s ease;
}

.list-title {
	padding: 10px;
	background-color: #ddd;
}

.sidebar-list ul {
	display: flex;
	flex-direction: column;
	line-height: 1.5;
	    max-height: 100%;
}



.sidebar-list .active {
	display: block;
	background-color: #84bedf;
/* 	margin: 10px 5px; */
}

.sidebar-list .active a {
	color: #fff;
	font-weight: bold;
}

.sidebar-list .list-title {
	cursor: pointer;
	font-weight: bold;
	background: #eeeeee;
	padding: 8px;
	border-radius: 0 0 5px 5px;
	position: relative;
	font-size: 13px;
}

.algorithm::before {
	content: '';
	display: block;
	width: 32px;
	height: 32px;
	background-color: #132058;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: 80% auto;
	-webkit-mask-size: 80% auto;
	mask-image: url("../images2/icon/carbon_flow.svg");
	-webkit-mask-image: url("../images2/icon/carbon_flow.svg");
}

.patient-search.close2 button {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	display: flex;
	width: 24px;
	height: 24px;
	background-color: #132058;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: 80% auto;
	-webkit-mask-size: 80% auto;
	mask-image: url("../images/icon/close.png");
	-webkit-mask-image: url("../images/icon/close.png");
}

.patient-search input {
	min-width: 100px;
	width: 100%;
}
/* 꺾쇠 기본 (열림 상태 ↓) */
.sidebar-list .list-title::after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	background: url("../../resources/images/icon/arrow-down.png") no-repeat
		center center;
	background-size: contain;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.layout {
	display: flex;
	position: relative;
	height: calc(100% - 92px);
	/* 	overflow: auto; */
}

/* 닫힌 상태 (→) */
.sidebar-list ul.closed .list-title::after {
	background-image: url("../../resources/images/icon/arrow-right.png");
}

.sidebar-list .list-title::before {
	content: "•";
	margin-right: 6px;
	color: #555;
	font-size: 12px;
	vertical-align: top;
	display: inline-block;
}

.sidebar.closed {
	transform: translateX(-100%); /* 왼쪽으로 숨김 */
	width: 0; /* 아예 숨김 */
	overflow: hidden;
    display: none !important;
}

/* 사이드바 열렸을 때: 버튼을 사이드바 옆으로 이동 */
.sidebar:not(.closed) ~ .sidebar-toggle-btn {
	left: 206.5px;
}

/* 사이드바 닫혔을 때: 버튼은 화면 왼쪽 고정 */
.sidebar.closed ~ .sidebar-toggle-btn {
	left: -10px;
}

.sidebar-toggle-btn {
	top: 0;
	right: -10px;
	width: 35px;
	height: 32px;
	cursor: pointer;
	background-color: #fff;
	color: #000000;
	margin-right: 5px;
	font-size: 20px;
}

.sidebar-list ul li a {
	font-size: 12px;
	display: flex;
    padding: 8px;
}

/* 상세 */
.clinicitems_sub {
	display: flex;
	flex-direction: column;
	width: 100% !important;
	background-color: #fff;
	height: 100%
}

.top-btn-nav {
	display: flex;
	width: 100%;
	height: 32px;
}

.top-nav {
	display: flex;
}

.top-nav-item {
	color: #000;
	font-weight: 400;
	display: flex;
	align-items: center;
	gap: 5px;
}

.top-nav-item:first-child {
	color: #ff9200;
	font-weight: bold;
	display: flex;
	align-items: center;
	gap: 5px;
}

.top-nav-item::after {
	content: '';
	display: flex;
	width: 13px;
	height: 13px;
	background-color: #132058;
	mask-position: center center;
	-webkit-mask-position: center center;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: 80% auto;
	-webkit-mask-size: 80% auto;
	mask-image: url("../images2/icon/chevron-right.svg");
	-webkit-mask-image: url("../images2/icon/chevron-right.svg");
}

.top-nav-breadcrumb {
	display: flex;
	flex-wrap: wrap;
}

/*표시작*/
.table-horizontal {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
}

.table-horizontal li {
	display: flex;
	align-items: center;
	width: 100%;
}

.table-horizontal > li > .td-group > .td-row {
  position: relative; /* ::after 위치 기준 */
}
/* ::after로 밑줄 만들기 */
.table-horizontal > li > .td-group > .td-row::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;           /* 아래쪽에 선 위치 */
  height: 1px;         /* 선 두께 */
  background-color: #ccc; /* 선 색상 */
  pointer-events: none;   /* 클릭 방해 방지 */
}

/**/

.table-horizontal li {
  position: relative;
}


/* 공통 — 위, 좌, 우 선만 */
.table-horizontal > li::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  pointer-events: none;
  box-sizing: border-box;
}

.table-horizontal .th-1-2 {
    min-width: 140px;
    max-width: 140px;
    width: 100px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    word-break: break-word;
    padding: 8px;
    background: rgb(224, 231, 239);

}



/**/

.sub-content {
	display: flex;
	flex-direction: column;
	max-height: 100%;
	overflow: auto;
	height: 100%
}


.upload-icon {
	width: 100%;
	cursor: pointer;
	display: flex;
	justify-content: center;
	font-size: 12px;
	height: 100%;
	align-items: center;
	flex: 1;
}

.upload-file {
	position: relative;
	padding: 3px 10px;
	border-radius: 5px;
	color: #4d4d4d;
	padding-left: 35px;
	border: 1px solid #132058;
	height: 25px;
	font-size: 11px;
	display: flex;
	align-items: center;
	height: calc(100% - 10px);
	background-color: #fff;
}

.upload-icon div.upload-file:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	background: url("../../resources/images/icon/et_upload.png") no-repeat center center;
	background-size: contain;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 5px;
}

.upload-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.table-horizontal .th {
	min-width: 70px;
	padding: 8px;
	background: #fafcff;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 70px;
	font-size: 11px;
	text-align: center;
	border-right: 1px solid #bcbcbc;
	        word-break: break-word;
    line-height: 1.5;
}

.table-horizontal .th-1 {
    min-width: 100px;
    max-width: 100px;
    width: 100px;
    padding: 8px;
    background: #e0e7ef;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    font-size: 12px;
    line-height: 1.2;
    text-align: center;
    word-break: break-word;
}


.clinicItem-image{
    content: "";
    display: inline-block;
    width: 22px;
    height: 16px;
    background: url("../../resources/images2/icon/image-search-1.svg") no-repeat center center;
    background-size: contain;
    /* position: absolute; */
    top: 50%;
    transform: translateY(20%);
    left: 67px;
    border-radius: 3px;
}
.clinicItem-image:hover{
	content: "";
    display: inline-block;
    width: 22px;
    height: 16px;
    background: url("../../resources/images2/icon/image-search.svg") no-repeat center center;
    background-size: contain;
    /* position: absolute; */
    top: 50%;
    transform: translateY(20%);
    left: 67px;
    border-radius: 3px;
}



.btn-icon {
    content: "";
    display: inline-block;
    width: 22px;
    height: 16px;
    background: url("../../resources/images/icon/external-3.svg") no-repeat center center;
    
    background-size: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 67px;
    border-radius: 3px;
}
.btn-icon:hover{
    content: "";
    display: inline-block;
    width: 22px;
    height: 16px;
    background: url("../../resources/images/icon/external-2.svg") no-repeat center center;
    background-size: contain;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 67px;
    border-radius: 3px;	
}


.relative{
	    position: relative;
}

.table-horizontal .th-5 {
    height: 100%;
    max-width: 241px;
    min-width: 241px;
    background-color: #e0e7ef;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
}

.table-horizontal .th-6 {
	height: 100%;
	max-width: 240px;
	min-width: 240px;
	background-color: #e0e7ef;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 13px;
}

.table-horizontal .th-7 {
	height: 100%;
	max-width: 200px;
	min-width: 200px;
	background-color: #e0e7ef;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 13px;
}

.table-horizontal .th-8 {
	height: 100%;
	max-width: 240px;
	min-width: 240px;
	background-color: #e0e7ef;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 13px;
}
.table-horizontal-2{
list-style: none;
    padding: 0;
    margin: 0;
    display: flex;	
}

.table-horizontal-2 .th-2{
	    max-width: 140px;
    min-width: 140px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    word-break: break-word;
    padding: 5px;
    background: rgb(243, 249, 255);
        font-size: 13px;
}

.table-horizontal-2>li::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-left: 1px solid #bcbcbc;
	border-bottom: 1px solid #bcbcbc;
    pointer-events: none;
    box-sizing: border-box;
}



.table-horizontal .th-2 {
    max-width: 140px;
    min-width: 140px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    word-break: break-word;
    padding: 5px;
    background: rgb(243, 249, 255);
        font-size: 12px;
}

.table-horizontal .th-2-3 {
    max-width: 220px;
    min-width: 220px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    word-break: break-word;
    padding: 5px;
    background: rgb(243, 249, 255);
        font-size: 13px;
}

.table-horizontal .th-2-1 {
	max-width: 100px;
	min-width: 100px;
	padding: 8px;
	background: #fafcff;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	text-align: center;
	line-height: 1.5;
}

.table-horizontal .th-2-2 {
	max-width: 110px;
	min-width: 110px;
	padding: 8px;
background: #f3f9ff;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	text-align: center;
	line-height: 1.5;
}

.td-img-group {
	display: flex;
	width: 100%;
	height: 100%;
}

.review-of-systems{
    border-bottom: 1px solid #bcbcbc;	
}

.img-item {
	position: relative;
	width: 80px;
	height: 80px;
}

.video-item .close:after {
	-webkit-mask-size: 15px auto;
	width: 10px;
	height: 10px;
	background-color: #000;
}

.video-item {
	position: relative;
	border-top: 1px dotted #ddd;
	height: 80px;
	width: 80px;
}

.video-item video {
	width: 80px;
	height: 80px;
	border-radius: 5px;
	border: 1px solid #ccc;
}

.file-list {
	width: 100%;
	padding: 5px;
	position: relative;
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
	max-height: 155px;
	flex: 2;
	overflow: auto;
}

.file-item {
	background-color: #595e68;
	padding: 10px;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.file-item .text {
	font-size: 15px;
	color: #fff;
	font-weight: 500;
}

.file-item .text-sm {
	font-size: 11px;
	color: #a5a5a5;
}

.img-item:first-child {
	border-top: none;
}

.table-horizontal .th-3 {
	height: 100%;
	display: flex;
	align-items: center;
	width: 40px;
	max-width: 40px;
	min-width: 40px;
	justify-content: center;
	background-color: #fafcff;
	word-break: break-all;
	text-align: center;
	font-size: 12px;
	border-right: 1px solid #ddd;
}

.table-horizontal .th-4 {
    height: 100%;
    display: flex;
    align-items: center;
    background-color: #fafcff;
    max-width: 100px;
    min-width: 100px;
    padding: 5px;
    justify-content: center;
    word-break: break-all;
    text-align: center;
    font-size: 12px;

}

.group-border {
	border-bottom: 1px solid #ddd;
	border-left: 1px solid #ddd;
}



.table-horizontal .td-wrap {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    height: 100%;
    width: 100%;
    gap: 5px;
    padding: 5px;
    border-left: 1px solid rgb(188, 188, 188);
        line-height: 1.5;
}

.table-horizontal .td {
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 5px;
	max-width: 100%;
}

.td-row-group {
	display: flex;
	flex-direction: column;
	width: 100%;
	    border-left: 1px solid #ddd;
}

.table-horizontal .tds {
	width: 100%;
    justify-content: left;
	display: flex;
	align-items: center;
	padding: 5px;
	font-size: 12px;
	    line-height: 1.5;
    border-right: 1px solid #bcbcbc;
}

.table-horizontal .tds:last-child {
	border-right: none;
}

textarea.chief {
	min-height: 70px;
	height: 70px;
	padding: 5px;
	font-size: 13px;
}

textarea.chief2 {
	min-height: 120px;
	height: 120px;
	padding: 5px;
	font-size: 13px;
}

.content {
	justify-content: center;
}

.col-date {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(0, 0, 0);
    line-height: 1.5;
    font-weight: bold !important;
    font-size: 13px !important;
    border-left: 1px solid rgb(188, 188, 188);
    padding: 8px;
    background: rgb(224, 231, 239) !important;
}

.td-group-2 {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
.td-group-2, .td-rows {
    position: relative;
}

.td-rows {
    display: flex;
    width: 100%;
    height: 100%;
}
.td-group-2::after, .td-rows::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    pointer-events: none;
    box-sizing: border-box;
    border-top: 1px solid rgb(188, 188, 188);
    border-left: 1px solid rgb(188, 188, 188);
    border-right: 1px solid rgb(188, 188, 188);
}

.col-date-1 {
    min-width: 100px;
    max-width: 100px;
    width: 100px;
    color: rgb(0, 0, 0);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 2;
    font-weight: bold !important;
    font-size: 13px !important;
    padding: 8px;
    background: rgb(224, 231, 239);
}
.col-date-2 {
    min-width: 140px;
    max-width: 140px;
    width: 140px;
    color: rgb(0, 0, 0);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 2;
    font-weight: bold !important;
    font-size: 13px !important;
    padding: 8px;
    background: rgb(224, 231, 239);
    border-left: 1px solid rgb(188, 188, 188);
}

.col-date-2-2 {
    min-width: 220px;
    max-width: 220px;
    width: 140px;
    color: rgb(0, 0, 0);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 2;
    font-weight: bold !important;
    font-size: 13px !important;
    padding: 8px;
    background: rgb(224, 231, 239);
    border-left: 1px solid rgb(188, 188, 188);
}
.col-date-graph {
    background: #e0e7ef !important;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-size: 13px;
    line-height: 2.5;
    width: 100%;

}
.table-horizontal>li::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 1px solid #bcbcbc;
    border-left: 1px solid #bcbcbc;
    border-right: 1px solid #bcbcbc;
    pointer-events: none;
    box-sizing: border-box;
}
.search-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
	flex: 1;
}


.search-group li:hover {
	cursor: pointer;
}

.td-row-group1 {
	display: flex;
	flex-direction: column;
	width: 100%;
border-left: 1px solid #bcbcbc;
}

.pd-0_5 {
	padding: 0px 5px 5px 5px;
}

.search-group.pd-0_5 textarea {
	min-height: 70px;
	padding: 5px 15px;
}

.search-list {
	width: 100%;
	line-height: 1.5;
	max-height: 150px;
	overflow: auto;
	font-size: 12px;
	border: 1px solid #ddd;
	border-radius: 5px;
}

.search-list ul {
	background-color: #f2f8fb;
	width: 100%;
}

.search-list li {
	padding: 5px;
	border-bottom: 1px solid #ddd;
}

.search-list li.on {
	background-color: #84bedf;
	color: #fff;
}

.search-list2, .search-list3 {
	min-height: 188px;
	max-height: 188px;
	overflow: auto;
	font-size: 12px;
	border: 1px solid #ddd;
	border-radius: 5px;
	width: 100%;
	line-height: 1.6;
}

.search-list2 ul {
	background-color: #f2f8fb;
	width: 100%;
}

.search-list3 ul {
	width: 100%;
}

.search-list2 li {
	padding: 5px;
	border-bottom: 1px solid #ddd;
}

.search-list3 li {
	padding: 5px;
	display: inline-block;
}

.search-list2 li.on {
	background-color: #84bedf;
	color: #fff;
}

.flex-05 {
	flex: 0.5;
}

.pd-5 {
	padding: 5px;
	gap: 5px;
}

.flex-1 {
	flex: 1;
}


.sub-item.sub-item-group .table-horizontal .th {
	border-bottom: none;
}

.sub-item-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
/*     justify-content: center; */
    flex: 1 1 0%;
}



.text-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.text-group label {
	font-weight: bolder;
}

.text-con {
	display: flex;
	line-height: 1.5;
}

.column {
	display: flex;
	width: 100%;
	overflow: auto;

}

.scroll-auto {
	max-height: 360px;
	overflow: auto;
}


/* #bubAll1+label::before, #bubAll1+label::after, #bubAll2+label::before,
	#bubAll2+label::after, #bubAll3+label::before, #bubAll3+label::after {
	top: 50%;
	left: 5px;
} */


input[type="checkbox"]+label.ch-box::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-50%, -50%);
	display: flex;
	width: 15px;
	height: 15px;
	border: 1px solid #132058;
	border-radius: 3px;
	background-color: #ffffff;
}

input[type="checkbox"]:checked+label.ch-box::after {
	content: '';
	position: absolute;
	top: 0px;
	left: 0px;
	transform: translate(-50%, -50%);
	width: 17px;
	height: 17px;
	background-color: #e60000;
	border-radius: 100%;
	box-shadow: none;
	mask-position: 45% 35%;
	-webkit-mask-position: 45% 35%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: 60% auto;
	-webkit-mask-size: 60% auto;
	mask-image: url("../images/icon/check.svg");
	-webkit-mask-image: url("../images/icon/check.svg");
}

.chack-box {
	position: relative;
	max-width: 40px;
	padding: 15px;
}

.ck-item-group {
	justify-content: flex-start !important;
	padding-left: 80px !important;
	max-height: 100%;
	min-height: 35px;
	position: relative;
}

.pd-none {
	padding: 0 !important;
}

.img-group {
	display: flex;
	min-width: 100%;
	max-width: 100%;
	flex-direction: row;
	gap: 0px;
	position: relative;
}

.img-group img {
	width: 80px;
	border-radius: 5px;
	height: 80px;
	border: 1px solid #ccc;
	object-fit: contain;
}

.img-list {
	width: 100%;
	height: 100%;
}

.td-row .img-group {
	display: flex;
	height: 100%;
	overflow: auto;
	align-items: center;
	min-width: 50%;
	max-width: 50%;
	flex-direction: column;
	gap: 0px;
	position: relative;
	background-color: #f7f9fc;
	border-left: 1px solid #ddd;
}

.td-row.gap-20 {
	min-height: 25px;
}

.td-group {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.td-row {
	display: flex;
	width: 100%;
	height: 100%;
}

.sub-item-group > .td-group > .td-row {
    border-top: 1px solid rgb(188, 188, 188);
    border-left: 1px solid rgb(188, 188, 188);
}

.sub-item {
    width: 100%;
    background-color: rgb(255, 255, 255);
    display: flex;
    flex-direction: column;
}

.inp-group {
	display: flex;
	align-items: center;
	width: 100%;
}

.inp-group label {
	width: 40px;
}

.inp-group input {
	width: 100%;
	height: 25px;
}

.bac-img {
	background-image: url("../images/background/bac-img01.png");
	width: 233px;
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	background-size: 63%;
	background-position: left bottom;
    position: fixed;
	margin: 0 10px;
	min-height: 345px;
	    top: 120px;
}
.img-text-box{
    margin-left: 263px;
    min-height: 390px;	
}
.sub-item-essential p {
	line-height: 2;
}

.sub-item-essential {
	border-radius: 5px;
}

.paperweight {
	padding: 5px;
	background-color: #84bedf;
	color: #fff;
	border-radius: 5px;
	display: flex;
	margin: 5px auto;
	font-size: 12px;
}

.overlay {
	display: flex;
	flex-direction: column;
	    margin-top: 20px;
}

.overlay a.heent {
	width: 34px;
	height: 45px;
	position: absolute;
	right: 143px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 0;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
	
}

.overlay a.respiratory {
	width: 85px;
	height: 15px;
	position: absolute;
	right: 115px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 0px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.cardiac {
	width: 65px;
	height: 20px;
	position: absolute;
	right: 125px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 0px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.gastrointestinal {
	width: 55px;
	height: 35px;
	position: absolute;
	right: 130px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 0px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.urinary {
	width: 65px;
	height: 8px;
	position: absolute;
	right: 126px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: -6px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.genital {
	width: 65px;
	height: 8px;
	position: absolute;
	right: 126px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 5px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.obgy {
	width: 65px;
	height: 8px;
	position: absolute;
	right: 126px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	bottom: 25px;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
}

.overlay a.musculoskeletal {
    width: 65px;
    height: 35px;
    position: absolute;
    right: 130px;
    background-color: rgb(255 185 185 / 38%);
    display: inline-block;
    z-index: 999;
    border-radius: 100%;
    bottom: 12px;
    box-shadow: 0 0 5px 1px rgb(255 194 194 / 61%);
}

.overlay a.skin {
	width: 14px;
	height: 69px;
	position: absolute;
	left: 22px;
	background-color: rgb(255 185 185/ 38%);
	display: inline-block;
	z-index: 999;
	border-radius: 100%;
	box-shadow: 0 0 5px 1px rgb(255 194 194/ 61%);
	top:0;
	transform: rotate(15deg);
}

.overlay a.action {
	background-color: rgb(255 0 0/ 38%);
	box-shadow: 0 0 5px 1px rgb(254 0 0/ 61%);
}

.overlay li {
	justify-content: flex-end;
}

.overlay li button {
	font-size: 10px;
	color: #000;
	position: relative;
	text-align: end;
}

.overlay li.action button {
	display: flex;
	align-items: center;
	font-size: 10px;
	color: #ff0000;
}

.overlay li.heent-group {
	height: 40px;
}

.overlay li.respiratory-group {
	height: 23px;
	align-items: center;
}

.overlay li.cardiac-group {
	height: 20px;
	align-items: flex-start;
}

.overlay li.skin-group {
	justify-content: left;
	width: 20%;
}

.overlay li.gastrointestinal-group {
	height: 32px;
	align-items: center;
	margin-top: -10px;
}

.overlay li.urinary-group {
	height: 20px;
	align-items: center;
}

.overlay li.genital-group {
	height: 20px;
	align-items: end;
}

.overlay li.obgy-group {
	height: 27px;
	align-items: end;
}

.musculoskeletal-group {
	height: 37px;

}

.overlay li.genital-group button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #000;
	margin-right: 5px;
}

.overlay li.obgy-group button::after {
	content: "";
	position: absolute;
	top: -4%;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #000;
	margin-right: 5px;
	transform: rotate(15deg);
}

.overlay li.heent-group button::after {
	content: "";
	position: absolute;
	top: 5px;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #000;
	margin-right: 5px;
}

.overlay li.respiratory-group button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 100%;
	width: 20px;
	height: 2px;
	border-top: 1px dashed #3f3f3f;
	margin-right: 5px;
}

.overlay li.cardiac-group button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #3f3f3f;
	margin-right: 5px;
}

.overlay li.gastrointestinal-group button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #3f3f3f;
	margin-right: 5px;
}

.overlay li.urinary-group button::after {
	content: "";
	position: absolute;
	top: 100%;
	right: 100%;
	width: 65px;
	height: 2px;
	border-top: 1px dashed #000;
	margin-right: 5px;
	transform: rotate(-10deg);
}

.overlay li.musculoskeletal-group button::after {
	content: "";
	position: absolute;
	top: 25%;
	right: 100%;
	width: 22px;
	height: 2px;
	border-top: 1px dashed #3f3f3f;
	margin-right: 5px;
}

.overlay li.skin-group button::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
	width: 10px;
	height: 2px;
	border-top: 1px dashed #3f3f3f;
	margin-right: 5px;
}

.overlay li.action button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 100%;
	width: 60px;
	height: 2px;
	border-top: 1px dashed #ff0000;
	margin-right: 5px;
}

.overlay li.obgy-group.action button::after {
	top: -4%;
}

.overlay li.urinary-group.action button::after {
	top: 100%;
	width: 65px;
}

.overlay li.musculoskeletal-group.action button::after {
	top: 25%;
	width: 22px;
}

.overlay li.skin-group.action button::after {
	width: 10px;
}

.check-wrap-column {
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	display: flex;
}

.img-item .close:after {
	-webkit-mask-size: 10px auto;
	width: 8px;
	height: 8px;
	background-color: #000;
}

.file-item .close:after {
	-webkit-mask-size: 15px auto;
	width: 10px;
	height: 10px;
	background-color: #fff;
}

.img-group button.close {
	position: absolute;
	top: 3px;
	right: 3px;
	background-color: #c5c5c559;
	padding: 5px;
	border-radius: 100%;
}

.preview {
	margin-top: 10px;
	position: relative;
}

.preview img {
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 5px;
}

/*평가설문지*/
.clinicItemO_6 {
	display: flex;
	flex-direction: column;
	gap: 10px;
	height: calc(100% - 37px);
}

.cclinicItemO_6-screen {
	display: flex;
	width: 100%;
	gap: 5px;
	height: calc(100% - 37px);
}

.cclinicItemO_6-screen-list {
	display: flex;
	flex-direction: column;
	gap: 5px;
	height: calc(60% - 2.5px);
	overflow: hidden;
}

.clinicItemO_6-table-list {
	display: flex;
	flex-direction: column;
	gap: 5px;
	height: calc(40% - 2.5px);
	overflow: hidden;
}

.clinicItemO_6-table-list h2 {
	font-size: 15px;
	font-weight: bold;
	background: none;
	padding: 5px;
}

.clinicItemO_6-optional-value {
	flex: 1;
	overflow: auto;
}

.cclinicItemO_6-group {
	display: flex;
	flex-direction: column;
	height: 100%;
	gap: 5px;
}

h2.list-title::before {
	content: "•";
	margin-right: 6px;
	color: #555;
	font-size: 12px;
	vertical-align: top;
	display: inline-block;
}

.clinicItemTree .clinicitems_group {
	height: 100%;
}

/*기기검사*/
.cclinicItem {
	display: flex;
	flex-direction: column;
	gap: 10px;
	height: calc(100% - 37px);
}

.cclinicItem-screen {
	display: flex;
	width: 100%;
	gap: 5px;
	height: calc(100% - 37px);
}

.cclinicItem-group {
	display: flex;
	flex-direction: column;
	height: 100%;
	gap: 5px;
}

.cclinicItem-screen-list {
	display: flex;
	height: calc(50% - 2.5px);
	flex-direction: column;
	gap: 5px;
	overflow: hidden;
}

.cclinicItem-table-list {
	display: flex;
	height: calc(50% - 2.5px);
	flex-direction: column;
	gap: 5px;
	overflow: hidden;
}

.cclinicItem-optional-value {
	flex: 1;
	overflow: auto;
}

.cclinicItem-optional-value .list-name {
	max-width: 200px;
	min-width: 200px;
	width: 200px;
}

.cclinicItem-optional-value .table thead {
	border: 1px solid #ddd;
}

.cclinicItem-optional-value .table th {
	background-color: #e0e7ef;
	padding: 5px;
}

.cclinicItem-optional-value .table th, .table td {
	text-align: center;
	vertical-align: middle;
	border-right: 1px solid #ddd;
}

.cclinicItem-optional-value .table tr.custom-bg {
	background-color: #f2f8fb;
	border: 1px solid #ddd;
}

.cclinicItem-optional-value .table td {
	font-size: 13px;
	line-height: 1.5;
	background-color: #fff;
	height: 38px;
}

.cclinicItem-optional-value .table td.custom-img {
	max-width: 400px;
	width: 400px;
	display: flex;
	height: 130px;
	background-color: #f7f9fc;
}

.cclinicItem-optional-value .table th.img {
	max-width: 400px;
	width: 400px;
}

.cclinicItem-optional-value .table th.img-del {
	max-width: 25px;
	width: 25px;
}

.accordion {
	width: 100%;
	display: flex;
	justify-content: center;
}

.accordion-item {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.accordion-header {
	display: flex;
	justify-content: center;
	padding: 10px;
	background-color: #c9cfd7;
	cursor: pointer;
	gap: 5px;
}

.accordion-content {
	display: none; /* 닫힌 상태로 시작 */
}

.pg-l-15 {
	padding-left: 18px;
}

.th-title {
    display: flex;
    flex-direction: column;
    gap: 5px;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 5px;
}

.th-title>div {
	position: relative;
	display: flex;
	line-height: 1.2;
}

.th-title span {
    display: flex;
    font-size: 12px;
    line-height: 1.3;
}

.table-horizontal-group1 {
	display: flex;
	width: 100%;
}

.table-horizontal-group2 {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.table-horizontal-group3 {
    display: flex;
    flex-direction: column;
    gap: 5px;
    border: 1px solid #ddd;
    border-bottom: none;
    padding: 2px 5px;
    justify-content: center;
}

.accordion-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.essential-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

/************팝업네비 add 11-06 ************/
.popup-nav-menu {
	display: flex;
	width: 100%;
	flex-direction: column;
	position: relative;
	background-color: #e1e8fa;
}

.popup-nav-menu ul {
	display: flex;
	width: calc(100% - 10px);
	gap: 5px;
	padding: 5px;
}


.popup-nav-menu ul li {
	position: relative;
	display: flex;
	border: 1px solid #ddd;
	padding: 5px;
	border-radius: 5px;
	transition: border-color 0.2s, color 0.2s;
	background-color: #fff;
}

.popup-nav-menu ul li.active-li {
	border: 1px solid #FF9200;
}

.popup-nav-menu li a {
	text-decoration: none;
	font-size: 13px;
	position: relative;
}

.popup-nav-menu ul li:hover {
	border-color: #FF9200; /* 원하는 색상으로 변경 */
}

/* hover 시 폰트 색상 */
.popup-nav-menu ul li a:hover {
	color: #FF9200 !important; /* ← 일단 확실히 적용되는지 확인 */
}

/* hover 상태에서 아이콘 색상 변경 */
.popup-nav-item:has(.sub-nav-menu)>a:hover::after {
	color: #FF9200;
}
/* hover 시 폰트 색상 */
.popup-nav-menu ul li:hover h5 {
	color: #FF9200 !important; /* ← 일단 확실히 적용되는지 확인 */
}

.popup-nav-item>a.active {
	color: #FF9200;
}

.popup-nav-menu-1 {
	width: 8%;
}

.popup-nav-menu-2 {
	width: 54%;
}

.popup-nav-menu-3 {
	width: 15%;
}

.popup-nav-menu-4 {
	width: 22%;
}

.fixed-sub-group {
	border: 1px solid #ddd;
	padding: 5px;
	border-radius: 5px;
}

.fixed-sub-nav>.sub-nav-menu {
	border: 1px solid #ff9200;
	padding: 5px;
	border-radius: 5px;
	gap: 10px;
	display: flex;
	background-color: #fff;
	flex-direction: column;
}

.fixed-sub-nav {
	display: none;
	background: #e1e8fa;
	padding: 5px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	position: absolute;
	top: 45px;
    width: calc(100% - 10px);
	z-index: 999;
}

/* 왼쪽 정렬 */
.fixed-sub-nav.align-left {
	text-align: left;
}

/* 오른쪽 정렬 */
.fixed-sub-nav.align-right .sub-nav-menu > .sub-nav-menu-item-1 {
	justify-content: end;
}

.fixed-sub-nav a {
	display: inline-block;
	color: #333;
	text-decoration: none;
	font-size: 13px;
}

.fixed-sub-nav a::after {
	content: 'ㅣ';
	font-size: 13px;
	color: #d2d2d2;
	    margin-left: 5px;
}
/* 마지막 요소만 가상요소 제거 */
.fixed-sub-nav a:last-of-type::after {
	content: none;
}

.fixed-sub-nav a:hover {
	color: #FF9200;
}

.popup-arrow {
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #ff9200;
	position: absolute;
	z-index: 9999;
}

.sub-nav-menu {
	display: none;
}

.sub-nav-menu-item-1,
.sub-nav-menu-item-2 {
display: flex;
    gap: 7px;
    align-items: center;
}

.sub-nav-menu-item-2{
display: none; /* 기본 숨김 */	
}
.sub-nav-menu-item-2.on {
    display: flex;
}


.sub-nav-menu-item-1 > button::after{
	content: "";
	display: inline-block;
	width: 11px;
	height: 10px;
	background: url("../../resources/images/icon/double-down.svg") no-repeat
		center center;
	background-size: contain;
	margin-left: 10px;
}
.sub-nav-menu-item-1 > button.on::after{
	content: "";
	display: inline-block;
	width: 11px;
	height: 10px;
	background: url("../../resources/images/icon/double-down-top.svg") no-repeat
		center center;
	background-size: contain;
}

.popup-nav-title {
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
}

.popup-nav-title h5 {
	font-size: 10px;
	font-weight: 600;
}

.popup-nav-group {
	display: flex;
	width: 100%;
	justify-content: space-between;
}

.popup-nav-item:has(.sub-nav-menu)>a::after {
	content: '▼';
	margin-left: 3px;
	font-size: 7px;
	vertical-align: middle;
}

.popup-nav-item:has(.sub-nav-menu)>a.active::after::after {
	color: #4a90e2;
}

.popup-nav-item {
	box-sizing: border-box;
}

/*설문지 높이*/
.history-wrap.h-100{
    height: 100%;	
}

.clinicleft-search-tab{
    padding: 9px 9px 0;
}

/************기록입력 add 11-06 ************/
.item-clinicHistor-group {
	font-size: 13px;
	gap: 2px;
}

.namepath {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.namepath h5 {
	font-size: 12px;
	font-weight: 900;
}

.namepath-1 {
	padding-left: 20px;
	position: relative;
	color: #000000;
}

.namepath-2 {
	position: relative;
	color: #000;
	padding-left: 10px;
}

.namepath-3 {
	position: relative;
	padding-left: 10px;
}

.namepath-4 {
	position: relative;
	padding-left: 10px;
}

/* 기록입력 뎁스 아이콘 */
.namepath-1::before {
	content: "»";
	position: absolute;
	left: 0;
	top: 1px;
	width: 10px;
	height: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000;
	font-size: 15px;
	margin-left: 5px;
}

.namepath-2::before {
	content: "⏵";
	position: absolute;
	left: 0;
	top: 0;
	width: 10px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000;
	font-size: 10px;
}

.namepath-3::before {
	content: "⏵";
	position: absolute;
	left: 0;
	top: 0;
	width: 10px;
	height: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000000;
	font-size: 10px;
}

.namepath-4::before {
	content: "⏵";
	position: absolute;
	left: 0;
	top: 0;
	width: 10px;
	height: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000000;
	font-size: 10px;
}

.li-focus {
    outline: 2px solid #007bff;     /* 포커스 테두리 */
    background-color: rgba(0, 123, 255, 0.1);
    transition: background-color 0.5s ease, outline 0.5s ease;
}


.bor-rig {
    border-right: 1px solid rgb(188, 188, 188) !important;
}

/**/
.layer-content2{
    height: 700px;
    max-width: 950px;
}
.list-wrap{
    height: 100%;	
    width:100%;
}

/* 이미지 / 영상 공통 스타일 */
#itemImage,
#itemVideo {
    max-width: 100%;
    max-height: 100%;
    width: auto !important;
    height: auto !important;
    object-fit: contain; /* 비율 유지 */
    display: block;
}

.layer-wrap .ch label{
	color:#939393;
}

.td-group-2::after, .td-rows::after{
content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 1px solid #bcbcbc;
    border-left: 1px solid #bcbcbc;
    border-right: 1px solid #bcbcbc;
    pointer-events: none;
    box-sizing: border-box;	
}
