/* LC Switch */
.lcs_wrap { display: inline-block; direction: ltr; height: 28px; vertical-align: middle; }
.lcs_wrap input { display: none; }
.lcs_switch {display: inline-block;	position: relative; width: 73px; height: 28px; border-radius: 30px; background: #ddd; overflow: hidden; cursor: pointer; -webkit-transition: all .2s ease-in-out; -ms-transition: 	all .2s ease-in-out; transition: 		all .2s ease-in-out; }
.lcs_cursor { display: inline-block; position: absolute; top: 3px; width: 22px; height: 22px; border-radius: 100%; background: #fff; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.1); z-index: 10; -webkit-transition: all .2s linear; -ms-transition: all .2s linear; transition: all .2s linear; }
.lcs_label { line-height: 18px; color: #fff; font-weight: bold; position: absolute; width: 50px; top: 5px; overflow: hidden; text-align: center; opacity: 0; -webkit-transition: all .2s ease-in-out .0.5s; -ms-transition: all .2s ease-in-out .0.5s; transition: all .2s ease-in-out .0.5s; }
.lcs_label.lcs_label_on { left: -70px; z-index: 6;}
.lcs_label.lcs_label_off { right: -70px; z-index: 5; }
.lcs_switch.lcs_on { background: #75b936; box-shadow: 0 0 2px #579022 inset; }
.lcs_switch.lcs_on .lcs_cursor { left: 48px; }
.lcs_switch.lcs_on .lcs_label_on { left: 10px; opacity: 1; }
.lcs_switch.lcs_off { background: #b2b2b2; box-shadow: 0px 0px 2px #a4a4a4 inset; }
.lcs_switch.lcs_off .lcs_cursor { left: 3px; }
.lcs_switch.lcs_off .lcs_label_off { right: 10px; opacity: 1; }
.lcs_switch.lcs_disabled { opacity: 0.65; filter: alpha(opacity=65); cursor: default; }
.lcs_wrap.small {display: inline-block; direction: ltr; height: 20px; vertical-align: middle; }
.lcs_wrap.small input { display: none;}
.lcs_switch.small { display: inline-block; position: relative; width: 48px; height: 20px; border-radius: 15px; background: #ddd; overflow: hidden; cursor: pointer; -webkit-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; transition: all .1s ease-in-out; }
.lcs_cursor.small {	display: inline-block;	position: absolute;	top: 2px; width: 16px; height: 16px; border-radius: 100%; background: #fff; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.1);	z-index: 10; -webkit-transition: all .1s linear;  -ms-transition: all .1s linear; transition: all .1s linear; }
.lcs_label.small { line-height: 10px; font-size:10px !important; color: #fff; font-weight: bold; position: absolute; width: 20px; top: 5px; overflow: hidden; text-align: center; opacity: 0; -webkit-transition: all .1s ease-in-out .1s; -ms-transition: all .1s ease-in-out .1s; transition: all .1s ease-in-out .1s; }
.lcs_label.lcs_label_on.small { left: -20px; z-index: 6;}
.lcs_label.lcs_label_off.small { right: -20px; z-index: 5; }
.lcs_switch.lcs_on.small { background: #75b936; box-shadow: 0 0 2px #579022 inset; }
.lcs_switch.lcs_on.small .lcs_cursor { left: 30px; }
.lcs_switch.lcs_on.small .lcs_label_on { left: 7px; opacity: 1; }
.lcs_switch.lcs_off.small { background: #b2b2b2; box-shadow: 0px 0px 2px #a4a4a4 inset; }
.lcs_switch.lcs_off.small .lcs_cursor { left: 3px; }
.lcs_switch.lcs_off.small .lcs_label_off { right: 5px; opacity: 1; }
.lcs_switch.lcs_disabled.small { opacity: 0.65; filter: alpha(opacity=65); cursor: default; }




/* 정보등록에러 */
input.error, textarea.error, select.error, div.ui-group.error > label{position:relative; border:2px dashed red !important;}

label.error:after{content:'<< 필수입력'; position:absolute; margin-left:5px;color:red; font-size:11px; letter-spacing:-1px; display:inline-block }
/* input,select,image replaceelement에는 가상요소 안먹음 */
span.required-message{position:absolute; z-index:99; margin-top:-10px; margin-left:-15px; padding:2px 5px; border-radius:5px; background:red; color:#fff;}

a {color:#333; }
a:hover { color:#333; text-decoration:none }
input:not([type=file]), select, textarea{
    padding: calc(.4em - 1px);
	vertical-align:middle;
	border-radius: 3px;
	border: 1px solid #c5c5c5;
    color: #333;
}

input[type='text'] { width:80px }
input[amt] { text-align:right }
em{font-style:normal;}
input::placeholder{color:#bbb  !important; letter-spacing:-1px;}
input::-webkit-input-placeholder {color:#bbb;letter-spacing:-1px;}
input:-ms-input-placeholder {color:#bbb;letter-spacing:-1px;}



main .header {
	border:0px;
	border-bottom:1px solid #ccc;
	padding:3px;
	box-shadow: 0 3px 2px rgba(0,0,0,0.15);
	margin-bottom:15px;
}
main .header h2{
	font-size:16px; font-weight:bold; padding:0; margin:0;
}




/*스크롤바*/

.chat-room::-webkit-scrollbar-thumb {
	background-color: #afafaf;
    border-radius: 7px;
}

.chat-room::-webkit-scrollbar-thumb:hover {
    background-color: #95a5b3;
    border-radius: 10px;
}

.chat-room::-webkit-scrollbar-track {
    background: #bacee0;
    border-radius: 10px;
}

.chat-room {
	width: 100%;
	max-width: 500px;
	height: calc(100vh - 400px);
	overflow-y: scroll;
	margin: 0 auto;
	padding: 15px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: #f6f6f6;
	border-radius: 1em 0 0 1em;
}

/* 공통 메시지 박스 */
.message {
	display: flex;
	flex-direction: column;
	max-width: 80%;
}

/* 메타 정보 (보낸사람 / 시간) */
.meta {
	font-size: 11px;
	color: #888;
	margin-bottom: 2px;
	display: flex;
	gap: 10px;
	align-items: center;
}

/* 받은 메시지 */
.message.recived {
	align-self: flex-start;
}
.message.recived .meta {
	justify-content: flex-start;
}
.message.recived .bubble {
	background: #ffffff;
	color: #333;
	border: 1px solid #ddd;
	border-radius: 15px 15px 15px 0;
	padding: 10px 15px;
	word-break: break-word;
}

/* 보낸 메시지 */
.message.sent {
	align-self: flex-end;
}
.message.sent .meta {
	justify-content: flex-end;
}
.message.sent .bubble {
	background: #4a90e2;
	color: #fff;
	border-radius: 15px 15px 0 15px;
	padding: 10px 15px;
	word-break: break-word;
}

.devCheck{ color:red }
#null-message{
	background:#00000066; padding-top:100px; color:#fff; height:100%; width:100%;
	text-align:center;
	font-size:1.5em;
	position:absolute;
	backdrop-filter: blur(3px);
	z-index:10;
	border-radius:10px;
}


html {
	font-size:12px;
	-webkit-text-size-adjust:none;
	-ms-text-size-adjust : none;
	-moz-text-size-adjust : none;
}
*{
	font-family:'맑은고딕';
}
body {
	color:#333;
	fill:#444;/* 아이콘 */
	width:100%;
	min-width:1024px;
	max-width:1600px;
	height:100vh;
	margin:0;
	font-size:1rem;
	text-align:left;
	line-height:1.6;
	font-family:'맑은고딕, NotoSans KR, san-serif';
	font-weight:400;
	overflow:hidden;
}
body #side-bar{background:#0A8F9A; box-shadow:none; border-right:1px solid #ddd; position:fixed}

em.care-match-logo{
	margin-right:1em;
	color:#000; font-weight:800;
	letter-spacing:1px;
	font-size:1.2em;
}
em.care-match-logo:after{
    content: "";
    position: absolute;
    width: 1em;
    height: 1em;
	margin-left:-.3em;
	margin-top:-.3em;
    background: url(/assets/img/ezcare-symbol.svg) center no-repeat;
	background-size: cover
}

main { width:calc(100% - 100px); max-width:1400px; min-width:1100px; margin-left:100px;}
#side-bar a{display:block;}

#side-bar {
	width:100px;
	height: 100vh;
	background-color:#999;
	color:#fff;
	box-shadow: 1px 1px 1px #333;
}
#side-bar .small_title{position: relative; display:inline-block; margin-bottom:.5rem; font-size:1rem;color:#a4d9dd; padding-right:4px;}
#side-bar .small_title:after{content:''; position:absolute; right:5px; bottom:-1px; width:90%; border:1px solid #119da9; }
#side-bar ul{list-style:none;margin:0;padding:0; font-size:13px}
#side-bar ul li a.nav-link{
    background: #efefef;
    margin: .3rem;
    padding: .4rem;
    border-radius: .3rem;
    color: #333;
}
#side-bar ul li a.nav-link:hover{
	font-weight:bold;
	background:#5eb7bf;
}

#side-bar ul li a.nav-link-sub{
    margin: 1px;
    padding: 3px 5px;
    color: #fff;
	display:inline-block;
	width:90%;
}
#side-bar ul li a.nav-link-sub:hover{
	cursor:pointer;
	border-radius:3px;
	background:#5eb7bf;
}
#side-bar ul li.small_title{
	text-align:right;
	font-size:11px;

}
#side-bar .nav-link-sub.point{width:90%; height:40px; box-sizing: border-box; background:#3fa9b1; border-radius:3px; padding:3px 8px; line-height:1.1; letter-spacing:-1px;margin:0 auto;  display:block; fill:#efefef}
#side-bar .nav-link-sub.point:hover {  background:#0a747d; fill:#666}
#side-bar .nav-link-sub.point.tool-btn-postInsert{background:#736FE5; border:1px solid #999}
#side-bar .nav-link-sub.point.tool-btn-postInsert:hover{background:#514dc3}

.bottom-action-button {
	text-align:right;
	border-top:1px solid #ccc;
	padding-top:10px;
	margin-top:10px;
	margin-bottom:5px;
}
.bottom-action-button button {
	font-size:13px; height:35px; margin:auto; font-weight:bold; padding:.3em 1em;
}

span.required-message {
    position: absolute;
    z-index: 99;
    margin-top: -10px;
    margin-left: -15px;
    padding: 1px 2px;
    border-radius: 5px;
    background: red;
    color: #fff;
	opacity:.5;
	font-size:10px !important;
}
input.error, textarea.error, select.error, div.ui-group.error > label {
    border: 1px dashed red !important;
}


.line-card{
	background:#f9f9f9;      /* 톤 다운된 카드 배경 */
	border:1px solid #D7DEE3;
	border-radius:6px;
	padding:5px 10px;
	line-height:1.4;
	min-height:30px;
}