@charset "utf-8";
@import "font.css";

@import "./inside.css";
@import "./speech_bubble.css";
@import "scroll.css";

.main {
	font-family: "Pretendard Variable", Pretendard, "Helvetica Neue", "Segoe UI", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	font-style: normal;
	font-size: 14px;
	position: relative;
	display: block;
	height: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	/*-webkit-user-select: none;*/
	/*-moz-user-select: none;*/
	/*-ms-user-select: none;*/
	/*user-select: none;*/
	/*-khtml-user-select: none;*/
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: transparent;
}

.user-chat,
.ncs-chat,
.prime-chat {
	display: inline-block;
	word-break: keep-all;
	word-wrap: break-word;
}

/* 고객센터 */
.ncs-chat__area {
	display: flex;
}
.ncs-chat__area .ncs-chat__box {
	display: flex;
	flex-direction: column;
	overflow: initial;
}

/* QACOWORK-9221 */
.ncs-chat__area .ncs-chat__box[data-size="small"] {
	max-width: 474px;
}
.ncs-chat__area .ncs-chat__box[data-size="large"] {
	max-width: 878px;
}

 /* 고객센터 프로필 */
.chat__profile {
	flex: none;
	width: var(--profileSize);
	height: var(--profileSize);
	margin-right: 8px;
	border-radius: calc(var(--profileSize) * 0.5);
}
.chat__profile > i {
	display: inline-block;
	width: var(--profileSize);
	height: var(--profileSize);
}
.chat__profile > .profile-ncs {background: url("../image/main/img__profile.png") no-repeat;background-size: contain;}
.chat__profile > .profile-kart {background: url("../image/main/img__profile-01.png") no-repeat;background-size: contain;}
.chat__profile > .profile-prime {background: url("../image/main/img__profile-prime2.png") no-repeat;background-size: contain;}
/*./ 고객센터 프로필 */

/* 채팅 입력 시간 */
.input__time {
	padding-top: 8px;
	font-size: 11px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.64;
	letter-spacing: -0.11px;
	text-align: left;
	color: var(--grey07)
}

/* 기본 말풍선 */
.speech__bubble {
	position: relative;
	/* 기본 말풍선 여백 */
	padding: var(--padding1);
	border-radius: 10px;
	border: solid 1px var(--grey01);
	background-color: var(--grey00);
	transition: all 0.5s ease-out;
}
.speech__bubble > * {
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
.speech__bubble.ncs-chat:before,
.speech__bubble.prime-chat {
	display: inline-block;
	position: absolute;
	top: 15px;
	left: 0;
	margin-left: -6px;
	z-index: 1;
	content: '';
	width: 6px;
	height: 8px;
	background: url('../image/main/bubble__arrow.png');
}
.speech__bubble.__inside:before {
	display: none;
}


.speech__bubble.prime-chat {
	border: solid 1px var(--primeColor);
}
/* 연관 말풍선 간격 */
.speech__bubble + .speech__bubble {
	margin-top: 8px;
}
.ncs-chat__area + .ncs-chat__area {
	margin-top: 16px;
}
.speech__bubble.ncs-chat + .speech__bubble.ncs-chat:before,
.btn_list-wrap + .speech__bubble.ncs-chat:before {
	display: none;
}
.ncs-chat__area + .user-chat__area {
	margin-top: 16px;
}
/* 개인 입력 */
.user-chat__area {
	width: 100%;
	text-align: right;
}
.user-chat__area:after {
	content: '';
	width: 100%;
	height: 50px;
	display: block;
	clear: both;
}
.user-chat__area .user-chat__box {
	position: relative;
}

/* 개인 입력 말풍선 */
.speech__bubble.user-chat {
	font-size: 14px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.57;
	letter-spacing: -0.48px;
	text-align: left;
	color: var(--grey00);
	background: var(--primary02);
}
.user-chat__box .input__time {
	text-align: right;
}
.user-chat__box + .user-chat__box {
	margin-top: 8px;
}
/* 입력중 도트 애니메이션 */
.writing__bubble {
	display: inline-block;
	width: 41px;
	height: auto;
	padding: 12px 16px;
}
.writing__bubble .writing__stage {
	position: relative;
}
.ncs-chat.writing__bubble .dot-flashing{
	left: 16px;
}
.user-chat.writing__bubble .dot-flashing{
	right: 16px;
	left: auto;
}
/* 고객센터 입력 시 */
.writing__bubble[data-target="ncs"] {
	left: 16px;
}
.writing__bubble[data-target="user"] {
	right: 16px;
	left: auto;
}
.writing__bubble[data-target="user"]:after {
	content: '';
	width: 100%;
	height: 0;
	display: block;
	clear: both;
}


/* form */
.speech__bubble .title,
.speech__bubble .title2,
.cs-title {
	font-size: 14px;
	font-stretch: normal;
	font-style: normal;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: -0.48px;
	color: var(--text_primary);
}
.speech__bubble .title > br {
	/*display: none;*/
}
.speech__bubble .title2 {
	font-weight: 400;
}
.speech__bubble .title16 {
	font-size: 16px;
	font-weight: 700;
}
.speech__bubble .sub-title {
	padding: 6px 0;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
	color: var(--text_secondary);
}

.text__wrap > .sub-title {
	padding: 0;
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
	word-break: break-all;
	color: var(--text_primary);
	text-align: left;
}
.text__wrap .text-box {
	padding: 16px 0;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
	word-break: break-all;
}
.text__wrap > .text-box .ps__text {
	display: block;
}
.text-box .link-text {
	display: block;
}
.link-text + .ps__text {
	margin-top: 6px;
}
.__divided {
	border-top: 1px solid var(--grey13);
	margin-top: 20px;
	padding-top: 20px;
}


/* ---- user ----- */



.speech__bubble[data-chat-type="user"] {
	width: fit-content;
	max-width: var(--size_max);
	padding: var(--padding);
}

.speech__bubble[data-chat-type="default"] {
	width: fit-content;
	max-width: var(--size-large);
	word-break: break-word;
	padding: var(--padding);
	font-size: 14px;
}

.speech__bubble[data-chat-type="default2"] {
	width: fit-content;
	max-width: var(--size-large);
	word-break: break-word;
	padding: 9px 11px;
}
.speech__bubble[data-chat-type="default3"] {
	 padding: 9px 11px 15px;
}

.speech__bubble[data-chat-type="default2"] .btn__like { 
	position: absolute;
	right: -30px;
	top: calc(100% - 30px);
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 28px;
	height: 28px;
}
.speech__bubble[data-chat-type="default2"] .btn__like > i {
	user-select: none;
	pointer-events: none;
}
@-webkit-keyframes fadeOutUp {
  from {
    opacity: 0;
  }
	50% {
		 opacity: 1;
	}
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.speech__bubble[data-chat-type="default2"] .btn__like:hover,
.speech__bubble[data-chat-type="default2"] .btn__like.active {
	color: var(--primary06);
}

.speech__bubble[data-chat-type="default2"] .btn__like.active::before  {
	content: '좋아요!';
	position: absolute;
	left: 0;
	right: 0;
	width: 40px;
	top: 0;
	margin-left: -5px;
	font-size: 12px;
	color: var(--primary06);
	font-style: normal;
	font-weight: 500;
	line-height: 18px; /* 150% */
	letter-spacing: -0.26px;
	animation: fadeOutUp 1s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}


.btn__like > .icon-like {
	height: inherit;
	width: inherit;
	user-select: none;
	pointer-events: none;
}
.icon-like::before{
	vertical-align: top;
}

.speech__bubble[data-chat-type="default3"] .btn_medium {
	max-width: 222px;
}

.speech__bubble[data-chat-type="chatbot"] {
	max-width: var(--size_max);
	width: fit-content;
	padding: var(--padding);
}
.speech__bubble[data-chat-type="chatbot2"] {
	max-width: var(--size-small);
	padding: var(--padding2);
}
.speech__bubble[data-chat-type="chatbot3"] {
	max-width: var(--size-large);
	padding: var(--padding2);
}
.speech__bubble[data-chat-type="chatbot2"] .btn-wrap button {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
}

/* chatbot3 */
.speech__bubble .text__wrap{
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
	text-align: left;
	color: var(--text_primary);
	overflow: hidden;
	word-break: break-word;
	word-wrap: break-word; /* 단어를 줄바꿈 */
}

.speech__bubble[data-chat-type="chatbot"] .text__wrap {
	white-space: pre-line;
	word-wrap: break-word; /* 단어를 줄바꿈 */
}
.speech__bubble[data-chat-type="chatbot"] .text__wrap .title {
	display: block;
	font-weight: 700;
}
.speech__bubble[data-chat-type="chatbot"] .text__wrap .sub-title {
	display: block;
	font-weight: 700;
	word-break: break-all;
}
.speech__bubble[data-chat-type="default"] .ps__text {
	margin-top: 20px;
}
.text__wrap .title, .text__wrap .title2 {
	display: block;
	font-weight: 700;
}
.text__wrap .title2 {
	margin-top: 20px;
}
/* feedback 버튼이 있는 말풍선 */
.chat__contents-box {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.chat__contents-box + .speech__bubble {
	margin-top: var(--padding1);
}

/* 말풍선 버튼 */
.chat__box > .speech__button {
	padding-top: 8px;
}
.chat__box > .speech__button._flex {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.speech__button._flex > button + button {
	margin-top: 0;
	margin-left: 4px;
}

.speech__button > button {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	height: 32px;
	/*padding: 0 8px 0 5px;*/
	padding: 0 10px 0 8px;
	font-weight: 400;
	font-size: 12px;
	line-height: 1;
	letter-spacing: -0.26px;
	border-radius: 10px;
	color: var(--text_primary);
	border: solid 1px var(--grey01);
	background-color: var(--grey00);
	box-sizing: border-box;
}

.speech__button > button i[class^="icon__"],
.speech__button > button i[class^="icon-"] {
	margin-right: 4px;
	/*margin-top: 2px;*/
}
.speech__button > button.icon-btn i[class^="icon__"],
.speech__button > button.icon-btn i[class^="icon-"]{
	margin-right: 0;
}

.speech__button > button i[class^="icon-"] {
	font-size: 14px;
	line-height: 1;
}

.icon__refresh {
	width: 24px;
	height: 24px;
	background: url("../image/main/icon__refresh@2x.png") no-repeat 50% 50%;
	background-size: contain;
}
.rotate {
	animation: rotate 1.5s infinite running linear;
	transform-origin: center;
}

@keyframes rotate {
	from {
		transform: rotate(0);
		transform-origin: center;
		/*transform: rotate3d(0, 0, 1, 0);*/
		opacity: 0.9;
	}
	to {
		transform: rotate(360deg);
		/*transform: rotate3d(0, 0, 1, 360deg);*/
		opacity: 1;
	}
}

.btn-refresh:hover .rotate{
	animation-play-state: paused;
}
.btn-refresh:hover .rotate.icon__refresh {
	width: 24px;
	height: 24px;
	background: url("../image/main/icon__refresh_on@2x.png") no-repeat 50% 50%;
	background-size: contain;
}
.speech__button > button .keyword {
	max-width: 70px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.speech__button > button:hover,
.speech__button > button:active {
	background-color: var(--hoverColor);
}
.speech__button > button + button {
	margin-top: 4px;
}

/* 로그인, 시스템 말풍선 여백 다름. */
.speech__bubble[data-chat-type="system"] {
	width: var(--size-small);
	padding: var(--padding2);
}
.speech__bubble[data-chat-type="system2"] {
	width: var(--size-small);
	padding: var(--padding4);
	margin-bottom: 76px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.speech__bubble[data-chat-type="system2"]  .added_box {
	position: absolute;
	left: -1px;
	right: -1px;
	margin-top: 15px;
	padding: 15px;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px; /* 157.143% */
	letter-spacing: -0.3px;
	color: var(--text_secondary);
	background: var(--grey23);
	border: 1px solid var(--grey01);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}
.speech__bubble[data-chat-type="system2"] .btn-wrap .link-text {
	display: block;
	margin: 10px auto 0;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px; /* 150% */
	letter-spacing: -0.26px;
	text-align: center;
	text-decoration-line: underline;
	color: #747A86;
}

.speech__bubble[data-chat-type="system2"] .added_box .link-text {
	margin-left: 5px;
}
.speech__bubble[data-chat-type="login"] {
	width: var(--size-xsmall);
	text-align: center;
}

.speech__bubble[data-chat-type="login2"] {
	min-width: var(--size-small);
	text-align: center;
}
.speech__bubble[data-chat-type="refresh"] {
	max-width: 282px;
	padding: var(--padding2);
	object-fit: fill;
}
.speech__bubble[data-chat-type="refresh"] .btn-wrap button:nth-child(1) {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
}
.speech__bubble[data-chat-type="refresh"] .text__wrap {
	word-break: break-all;
}
.speech__bubble[data-chat-type="login"] .title,
.speech__bubble[data-chat-type="login2"] .title {
	font-size: 16px;
}
.speech__bubble[data-chat-type="login"] .btn__primary,
.speech__bubble[data-chat-type="login2"] .btn__primary {
	max-width: var(--btnSize);
}

.speech__bubble[data-chat-type="login"] .link-text,
.speech__bubble[data-chat-type="login2"] .link-text {
	padding-top: 10px;
}

.speech__bubble .link-text > .btn__link-text {
	line-height: 1;
}
.title2 > .warning_text {
	display: block;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.57;
	letter-spacing: -0.48px;
	color: var(--errorColor01);
}


/* 1대1 문의 글 남기기 */
.speech__bubble[data-chat-type="form"] {
	position: relative;
	width: var(--size-large);
	/* 하단 고정 버튼 높이값 확보 */
	padding-bottom: 48px;
}

/* 1대1문의 */
/* 기본 form 스타일 */
.cs__box {
	width: 100%;
	background-color: var(--grey00);
}
.cs__box .cs-title {
	font-style: normal;
	font-weight: 400;
}
.cs__box .cs-form {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	width: 100%;
	gap: 20px;
	margin: 0 0 33px;
}
.cs__box .cs-title + .cs-form {
	margin: 20px 0 33px;
}
.cs__box .files__wrap {
	/*margin: 21px 0 0*/
}
.cs__box .check__wrap {
	/*margin: 20px 0 32px;*/
	padding: 22px 20px;
	border: 1px solid var(--grey13);
	border-radius: 4px;
	background-color: var(--grey04);
}
.cs__box .check__wrap .options {
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	gap: 20px;
}
.cs__box .check__wrap .ps__text {
	display: block;
	padding-top: 4px;
	margin-left: 26px;
}
.cs__box .cs-item {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	/*gap: 12px;*/
}

.cs__box .cs-item > * {
	width: 100%;
}

.cs-item .cs-item_desc {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	gap: 6px;
}

.cs-item .cs-item_title {
	display: inline-block;
	font-weight: 700;
}
.required .cs-item_title:after {
	content: '*';
	display: inline;
	width: 10px;
	height: 100%;
	color: var(--errorColor01);
}
.cs-item .cs-item_title + .cs-item_desc {
	margin-top: 12px;
}
.cs-item .cs-item_desc + .cs-item_desc {
	margin-top: 6px;
}
.cs-item .cs-item_title .ps__text2 {
	display: block;
}
.input__wrap {
	position: relative;
	width: 100%;
}
.speech__bubble[data-chat-type="system"] .input__wrap {
	margin-top: 30px;
}
.speech__bubble[data-chat-type="system"] .title-desc {
	margin: 0;
}

/* 검색결과 */
.keyword_text {
	padding: 11px 0;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 22px; /* 157.143% */
	letter-spacing: -0.3px;
}
.tag {
	padding: 1px 6px;
	color: #0A74FF;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px; /* 157.143% */
	letter-spacing: -0.3px;
	border-radius: 4px;
	background-color: #F5F6FA;
}
.keyword_text .tag {
	margin-right: 8px;
}


/* form -- input */
.input__wrap .txt-cnt {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	top: -30px;
	right: 0;
	font-size: 12px;
	text-align: right;
	letter-spacing: -0.26px;
	color: var(--grey07);
}
.error_text {
	display: none;
}
.isError .error_text {
	display: block;
	max-height: 75px;
	overflow: hidden;
}

.speech__bubble[data-chat-type="system"] .input__wrap .txt-cnt {
	top: -20px;
}
.select__wrap.isError .error_text {
	padding-top: 44px;
}
.select__wrap + .input__wrap .txt-cnt {
	top: -68px;
}

/* debug_1012 */
.select__wrap.isError + .input__wrap > .txt-cnt {
	top: -102px !important;
}
.speech__bubble[data-chat-type="system"] .error_text {
	margin-top: 4px;
}
.txt-cnt > em {
	font-size: 12px;
	font-weight: 500;
	text-align: right;
	letter-spacing: -0.26px;
	vertical-align: bottom;
	color: var(--grey11);
}
.txt-cnt > .cnt {
	margin-left: 0;
	margin-right: 1px;
	font-weight: 700;
}
.isError .txt-cnt > .cnt {
	color: var(--errorColor01);
}
.speech__bubble[data-chat-type="system"] .btn-wrap button:nth-child(1) {
	/*margin-top: 8px;*/
	margin-top: 20px;
}
.speech__bubble[data-chat-type="system"] .sub-title + .btn-wrap button:nth-child(1){
	margin-top: 14px;
}

/* common --- */
.input-box,
.date-box {
	position: relative;
	width: 100%;
	height: 40px;
	border: 1px solid var(--grey13);
	border-radius: 4px;
	box-sizing: border-box;
}

.input__wrap .input-box {
	padding: 6px 65px 6px 13px;
}
.input__wrap .input-box input {
	width: 100%;
	height: 100%;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
}

/* form - disabled 처리 */
.speech__bubble[data-chat-type="form"] .isDisabled {
	color: #A1A7B5;
	border: 1px solid #DADEE6 !important;
	opacity: 0.5 !important;
	background-color: #E9ECF2 !important;
	user-select: none;
	pointer-events: none;
}

/* 날짜 입력 */
.date__wrap {}
.date__wrap .date-box {
	padding: 6px 13px;
	background: url("../image/main/icon__quick-calendar@2x.png") calc(100% - 15px) 50% no-repeat;
	background-size: 20px 20px;
}
.date-box.isDisabled {
	background: url("../image/main/icon__quick-calendar_g.svg") calc(100% - 15px) 50% no-repeat;
}

.select__wrap {
	position: relative;
	width: 100%;
	min-height: 40px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	border-radius: 4px;
	box-sizing: border-box;
	z-index: 4;
}


/* 선택박스 에러 케이스 */
.select__wrap.isError > .select-box{
	border-color: var(--errorColor01);
}

.select__wrap .select-box {
	border: 1px solid var(--grey13);
}
.select__wrap:hover .select-box {
	border-color: var(--primary02);
}

.select-box {
	width: 100%;
	height: 40px;
	display: flex;
	flex-direction: column;
	/*justify-content: flex-start;*/
	justify-content: center;
	align-items: stretch;
	padding: 4px;
	z-index: 11;
	border-radius: 4px;
	box-sizing: border-box;
}

/* 기본 드롭다운 */
.select__wrap > .select-box {
	position: absolute;
	z-index: 2;
}

.select-box .select__options {
	display: none;
}
.select-box.open {
	height: auto;
	box-shadow: 0 3px 25px 0 rgba(0, 0, 0, 0.16);
	border: solid 1px var(--primary02);
	background-color: var(--grey00);
}
.select-box.open > .select__options {
	display: block;
	height: auto;
	perspective: initial;
}
.select__options li {
	height: 40px;
	padding: 8px;
	cursor: pointer;
}
.select__options li:hover {
	background-color: var(--primary05);
}
.select__options li:active,
.select-box .btn__select:active,
.select-box .btn__select2:active {
	color: var(--primary02);
}

.select-box.open > .ico {
	transform: rotate(180deg);
}
.select-box .btn__select,
.select-box .btn__select2 {
	display: block;
	width: 100%;
	padding: 4px 8px;
	color: var(--grey07);
	box-sizing: border-box;
	cursor: pointer;
	transition: color 0.2s;
}
.select-box .ico {
	width: 24px;
	height: 24px;
	position: absolute;
	top: 8px;
	right: 10px;
	background: url("../image/main/icon__arrow1@2x.png") 50% 50% no-repeat;
	background-size: 20px 20px;
	pointer-events: none;
	transition: transform 0.1s;
}
.select-box.isDisabled .ico {
	background: url("../image/main/icon__arrow1_g.svg") 50% 50% no-repeat;
}

/* 날짜 선택, 입력 - 생년월일 */
.date__select-wrap {
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
	z-index: 5;
	width: 100%;
	height: 40px;
	box-sizing: border-box;
}

.cs-item .cs-item_desc.date__select-wrap {
	flex-direction: row;
}

.date__select-wrap .select-box {
	position: relative;
	z-index: 2;
	border: 1px solid var(--grey13);
	background-color: var(--grey00);
}


.date__select-wrap.isError {
	min-height: 40px;
	box-sizing: content-box;
	padding-bottom: 45px;
}

.date__select-wrap.isError .select-box{
	border-color: var(--errorColor01);
}

.date__select-wrap.isError .error_text {
	display: block;
	position: absolute;
	top: 45px;
	left: 0;
	right: 0;
}

.date-box:hover {
	border-color: var(--primary02);
}
.input__wrap .input-box:hover,
.date__select-wrap .select-box:hover,
.input__wrap .input-box.__focused {
	border-color: var(--primary02);
}


/* 인풋 */
.input-box > .btn__delete {
	position: absolute;
	right: 10px;
	top: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	/*width: 28px;*/
	/*height: 28px;*/
	padding: 2px;
	margin-left: 18px;
	flex: none;
	text-align: center;
	cursor: pointer;
	background: url("../image/main/icon__delete3@2x.png") 50% 50% no-repeat;
	background-size: contain;
	opacity: 0;
	transition: all 0.3s ;
	pointer-events: none;
	user-select: none;
}

.input-box > .btn__delete:hover {
	width: 28px;
	height: 28px;
	background: url("../image/main/icon__delete3_hover@2x.png") 50% 50% no-repeat;
	background-size: contain;
}
.input__wrap .input-box.__focused .btn__delete {
	opacity: 1;
	pointer-events: auto;
	user-select: auto;
}

.chat-input__area .input__wrapper {
	position: relative;
}
/* 채팅창 인풋 박스 */
.input__wrapper.input-box .btn__delete {
	width: 40px;
	height: 40px;
	right: 40px;
	top: 4px;
	background-size: 28px 28px;
}
.input__wrapper.input-box.__focused .btn__delete {
	opacity: 1;
	pointer-events: auto;
	user-select: auto;
}
.cs__box .error_text {
	display: none;
	padding-top: 4px;
}
.isError {
	border-color: var(--errorColor01) !important;
}
.isError .error_text {
	display: block;
}
.error_text + .error_text {
	padding-top: 2px;
}
.isError .input-box,
.isError .writing__area {
	border-color: var(--errorColor01);
}

.speech__bubble[data-chat-type="form"] .full_btn-wrap {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 48px;
}

.speech__bubble[data-chat-type="form"] .full_btn-wrap button {
	height: 100%;
	border-radius: 0;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}
/*./ 1대1 문의 글 남기기 */

.speech__bubble .btn-wrap button:nth-child(1) {
	margin: var(--padding1) auto 0;
}
.speech__bubble .full_btn-wrap button:nth-child(1) {
	margin: 0 auto 0;
}
button + .btn__secondary,
button + .btn__secondary-line,
button + .btn__primary,
button + .btn__primary-line{
	margin-top: 8px;
}
.speech__bubble .btn-wrap {
	width: 100%;
}
.btn-wrap, .full_btn-wrap {
	font-style: normal;
	font-weight: 700;
	line-height: 18px;
	letter-spacing: -0.26px;
}
.btn-wrap > button {
	text-align: center;
}
.btn-wrap .btn-text2 {
	font-weight: 400;
}
.btn-wrap .btn-text2 > em,
.btn-wrap .btn-text {
	font-size: 14px;
	font-weight: 700;
	display: inline-block;
	line-height: 1.1;
}
.full_btn-wrap .btn-text {
	font-size: 16px;
	font-weight: 700;
}

/* 말풍선 내부 버튼 */
.speech__bubble button {
	width: 100%;
	height: 40px;
	box-sizing: border-box;
}
.title__wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16px;
}
.title__wrap .title {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
/* ### 2024 renew*/
.title__wrap .title .title_desc {
	margin-left: 4px;
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px; /* 153.846% */
	letter-spacing: -0.26px;
	color: var(--text_secondary);
}


/* 특별 도움말*/
.speech__bubble[data-chat-type="list"] {
	width: var(--size-large2);
	/*padding: 16px;*/
	padding: 12px;
	/*padding: 12px 12px 46px 12px;*/
}
.speech__bubble[data-chat-type="list"].__swipe {
	padding: 12px ;
}
.page__swiper .pagination.swiper-pagination3 {
	display: flex;
	justify-content: center;
	
	/*height: 30px;*/
	align-items: flex-start;
	padding-top: 15px;
}
	/* 공지 하단 페이징 없는 타입 */
.speech__bubble[data-chat-type="list1"] {
	width: var(--size-large2);
	padding: 12px;
}
.list__wrap .list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 4px;
	width: 100%;
}

/* 공지사항 가로 swiper */
.page__swiper {
	width: 100%;
	max-height: fit-content;
	overflow: hidden;
}
.page__swiper .swiper-wrapper {
	/*max-height: 216px;*/
	max-height: 310px;
	display: flex;
	/*flex-flow: column wrap;*/
	flex-flow: row;
}
.page__swiper .paging-wrap {
	position: absolute;
	width: 68px;
	top: 14px;
	right: 10px;
	height: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* 공지 swiper 내부의 리스트 */
.page__swiper .list__item > span {
	display: block;
	width: 100%;
	max-height: 30px;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: break-word;
	overflow: hidden;
}

.page__swiper .paging-wrap .swiper-pagination2 {
	text-align: center;
}

.page__swiper .swiper-button-prev {
	width: 20px;
	height: auto;
	left: 0;
}
.page__swiper .swiper-button-next {
	right: 0;
	width: 20px;
	height: auto;
}


.page__swiper .swiper-button-prev:after,
.page__swiper .swiper-button-next:after{
	display: none;
}

.list__wrap .list .list__item,
.list__wrap .list .list__item2 {
	position: relative;
	width: 100%;
	min-height: 40px;
	align-self: stretch;
	flex-grow: 0;
	line-height: 1.4;
	background: var(--grey04);
	border: 1px solid var(--secondary01);
	border-radius: 6px;
	transition: all 0.3s;
	cursor: pointer;
	word-break: break-all;
}
.list__wrap .list .list__item3 {
	position: relative;
	width: 100%;
	flex-grow: 0;
	background: var(--grey04);
	border: 0;
	transition: all 0.3s;
	cursor: pointer;
}
.list__wrap .list .list__item.prime_user,
.list__wrap .list .list__item2.prime_user {
	background: var(--primeBg);
	color: var(--primeColor2);
	border: 1px solid var(--primeBorder);
}
.list__wrap .list .list__item.prime_user:hover,
.list__wrap .list .list__item2.prime_user:hover {
	border: 1px solid var(--primeBorder2);
}

/* inside table list */
.list__wrap .list.__inside {
	gap: 0;
	overflow: hidden;
	border-radius: 6px;
	padding: 9px 16px;
	border: 1px solid var(--secondary01);
	background-color: var(--grey04);
}
.list__wrap .list .list__item .item__detail{
	line-height: 1.2;
	vertical-align: baseline;
}

/*.list__wrap .list.__inside > li,*/
.list__wrap .list.__inside > .list-item3 {
	position: relative;
	width: 100%;
	min-height: 40px;
	padding: 7px 0;
	align-self: stretch;
	flex-grow: 0;
	background: var(--grey04);
	border-radius: 0;
	border: 0;
	transition: all 0.3s;
	cursor: pointer;
}
.list__wrap .list .list__item2 {
	min-height: 44px;
	border-radius: 0;
	border: none;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	border-top: 1px solid var(--secondary01);
	color: var(--primary02);
	word-break: break-all;
	padding-left:16px;
}
.list__wrap .list .list__item2.__ex {
	color: var(--text_primary);
}
.list__wrap .list > li dl {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
/* 마우스 오버 이펙트 */
.list__wrap .list > li:hover {
	background: var(--grey02);
	border-color: var(--grey06);
}
.list__wrap .list .list__item2:hover {
	border-color: transparent;
	border-top: 1px solid var(--secondary01);
}


/* 말풍선 타입 : 검색 */
.speech__bubble[data-chat-type="list2"] {
	max-width: var(--size-large2);
	padding: 12px 4px 12px 12px;
}
.isPad .speech__bubble[data-chat-type="list2"] {
	padding: 12px;
}

.speech__bubble[data-chat-type="list2"] .list__wrap {
	height: 100%;
	/*max-height: 228px;*/
	max-height: 250px; /* 5개 이후 부터 스크롤*/
	overflow-y: scroll;
	background-color: transparent;
}

/* 질문응답 메시지1 -> 16 */
.speech__bubble[data-chat-type="list3"] {
	max-width: var(--size-small);
	overflow: hidden;
	padding: var(--padding2) 0 0;
}
/* 질문응답 메시지1 -> 16 */

.speech__bubble[data-chat-type="list3"] .title__wrap > .title {
	font-style: normal;
	font-weight: 700;
	font-size: 14px;
	padding: 0 var(--padding2);
}
.speech__bubble[data-chat-type="list3"] .list__wrap .list,
.accordion__box > .list__wrap .list {
	gap: 0;
	box-sizing: border-box;
}

/* 유형제거 후 패딩 수정 */
.list__wrap .list > .list__item,
.list__wrap .list > .list__item2,
.list__wrap .list.__inside > .list__item3 {
	min-height: 40px;
	padding: 10px;
	line-height: 22px;
	word-break: break-all;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: break-word;
	overflow: hidden;
}


/* 말풍선 페이징 */
.swiper-pagination-current,
.swiper-pagination-total,
.paging ._current,
.paging ._total {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 22px;
	text-align: right;
	letter-spacing: -0.48px;
	color: var(--grey07);
}
.paging ._current,
.swiper-pagination-current {
	font-weight: 700;
	color: var(--text_primary);
}
.paging ._total:before {
	content: '/';
	display: inline-block;
	width: 5px;
	height: 100%;
	/*margin: 0 4px;*/
	text-align: center;
	color: var(--grey05);
}
.paging i {
	color: var(--grey05);
}
/* 말풍선 페이징 */

/* 말풍선 타입 : faq */
.speech__bubble[data-chat-type="feedback"] {
	max-width: var(--size_max);
	min-width: var(--size_min);
	width: fit-content;
	transition: all 0.2s;
}
.speech__bubble[data-chat-type="faq"] {
	max-width: var(--size_max);
	min-width: var(--size_min);
	width: fit-content;
	padding: var(--padding3) var(--padding3);
	transition: all 0.2s;
}


/* 버튼이 여러개 말풍선 */
.speech__bubble[data-chat-type="buttonList"] {
	max-width: var(--size-large);
	min-width: var(--size_min);
	width: fit-content;
	padding: var(--padding3) var(--padding3);
	transition: all 0.2s;
}
.speech__bubble[data-chat-type="buttonList"] button {
	cursor: pointer;
}


.speech__bubble[data-chat-type="buttonList"] .cont-title {
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 24px; /* 150% */
	letter-spacing: -0.35px;
}

.speech__bubble[data-chat-type="buttonList"] .cont-box {
	width: 100%;
	margin-top: 12px;
	max-height: 304px;
	overflow-x: hidden;
	overflow-y: auto;
}
.speech__bubble[data-chat-type="buttonList"] .btn_list-wrap {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	gap: 4px;
	flex-wrap: wrap;
	max-height: 304px;
}
.speech__bubble[data-chat-type="buttonList"] .btn_list-wrap .listBtn {
	width: calc(50% - 2px);
	height: 40px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid var(--grey111);
	background: #fff;

}
.speech__bubble[data-chat-type="buttonList"] .listBtn:hover {
	color: var(--primary07);
	border-color: var(--primary07);
}
.speech__bubble[data-chat-type="buttonList"] button:disabled {
	color: rgba(143, 150, 163, 0.60) !important;
	background: rgba(210, 214, 224, 0.60) !important;
	border-color: rgba(210, 214, 224, 0.60) !important;
	user-select: none;
	pointer-events: none;
}


	/* bubble button type222 */
.btn_list-wrap.faq__buttons {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	/* faq, qna 최대 넓이값 + 오른쪽 메뉴 너비를 최대 넓이로 지정 */
	max-width: var(--size_max);
	margin: 8px 0;
}


.btn_list-wrap.faq__buttons > .btn--faq {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 4px;
	width: fit-content;
	height: 44px;
	padding: 0 15px;
	font-size: 14px;
	background-color: #fff;
	border: 1px solid var(--grey01);
	border-radius: 10px;
	/*transition: all 0.3s;*/
	box-sizing: border-box;
}

.btn_list-wrap.faq__buttons > .btn--faq.icon__fast {
	padding: 0 34px 0 16px;
	background-position: calc(100% - 14px) 48%;
	transition: background-position 0.3s;
}
.btn_list-wrap.faq__buttons > .btn--faq i {
	margin: 0;
}
.btn_list-wrap.faq__buttons > .btn--faq:hover {
	background-color: var(--grey01);
}
.btn_list-wrap.faq__buttons > .btn--faq.icon__fast:hover {
	background-position: calc(100% - 10px) 48%;
}
/* 말풍선 아코디언 리스트 */
.accordion__box {
	margin: 40px 0 0;
}
.accordion__box .btn-wrap {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	border-top: 1px solid var(--secondary01);
}
.accordion__box.open {
	margin: 40px 0 30px;
}
.accordion__box.open .btn-wrap {
	border-top: 0;
}

.accordion__box .btn__accordion {
	display: flex;
	justify-content: center;
	align-items: center;
	height: inherit;
	padding: 15px 0;
	font-weight: 400;
	color: var(--grey08);
}
.accordion__box .btn__accordion:hover {
	color: var(--text_primary);
}
.accordion__box .btn__accordion i {
	font-size: 16px;
	transition: transform 0.3s;
	pointer-events: none;
}
.accordion__box .accordion {
	display: none;
	max-width: var(--size_max);
	max-height: fit-content;
}
.accordion__box.open .accordion {
	display: block;
	height: auto;
	perspective: initial;
}
.accordion__box.open .btn__accordion i {
	transform: matrix(1, 0, 0, -1, 0, 0);
}
.list__wrap .list.__inside > li:hover {
	background: var(--grey04);
	border-color: transparent;
	color: var(--primary02);
	font-weight: 700;
	text-decoration: underline;
}
.list__wrap .list.__inside > li .keyword {
	margin-right: 0;
}
.ncs-wrapper.cont3 {
	padding-bottom: 0;
}
/* 말풍선 타입 : 문의 답변 */
.speech__bubble[data-chat-type="qna"] {
	max-width: var(--size_max);
	min-width: var(--size_min);
	padding: 16px 0 0;
	transition: all 0.1s;
}
.speech__bubble[data-chat-type="qna"] .ncs-wrapper {
	margin: 0 var(--padding3) 0;
}
.speech__bubble[data-chat-type="qna"] .accordion__box {
	margin: -8px 0 0;
}
.speech__bubble[data-chat-type="qna"] .accordion__box > .list__wrap {
	margin: 0 var(--padding3);
	width: calc(100% - var(--padding3) * 2);
}
.speech__bubble[data-chat-type="qna"] .accordion__box .btn-wrap {
	position: static;
}
.ncs-answer__wrapper {
	border-top: 1px solid var(--grey01);
	padding: 24px var(--padding3) 24px;
	margin-top: 24px;
}

.ncs-answer__wrapper + .accordion__box {
	--gap: 0;
}
.ncs-answer__wrapper > .title {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 7px;
	margin-bottom: 6px;
	font-style: normal;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.56;
	letter-spacing: -0.54px;
}
.ncs-answer__wrapper .answer {
	width: 100%;
	overflow: hidden;

	margin-top: 16px;
	padding: 16px;
	font-size: 14px;
	line-height: 1.57;
	letter-spacing: -0.48px;
	border: 1px solid var(--secondary01);
	border-radius: 4px;
}

.ncs-answer__wrapper .answer__title {
	font-weight: 700;
	margin-bottom: 24px;
}

input[type="file"] {
	display: none;
	width: 0;
	height: 0;
	opacity: 0;
}
/* 파일 첨부, 첨부된 파일 리스트 */
.btn__add-file {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 100%;
	height: 40px;
	font-style: normal;
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: -0.48px;
	color: var(--text_primary);
	border-radius: 4px;
	background-color: var(--secondary01);
	cursor: pointer;
}
.btn__add-file:hover {
	background-color: var(--secondary02);
}

button.__disabled {
	user-select: none;
	pointer-events: none;
	opacity: 0.6 !important;
	border-radius: 4px;
	background-color: #dadee6 !important;
}

.file__list {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 6px;
	width: 100%;
	margin-bottom: 6px;
}
.file__list.hide {
	display: none;
}
.file__list-item {
	/* todo: 체크!!! 삭제 버튼 없는 경우도 있나..? */
	display: flex;
	justify-content: space-between;
	align-items: center;
	/*gap: 13px;*/
	width: 100%;
	height: 40px;
	padding: 6px 4px 6px 13px;
	color: var(--grey08);
	border: 1px solid var(--grey13);
	border-radius: 4px;
}
.file__list-item .file__name {
	font-size: 14px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.file__list-item .btn__delete {
	width: 24px;
	height: 24px;
	margin-left: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	text-align: center;
	border: 1px solid transparent;
}
.file__list-item .btn__delete.icon-x {
	font-size: 10px;
	color: var(--grey07);
}
.file__list-item .btn__delete:hover {
	color: var(--grey07);
	background-color: var(--grey04);
	border-radius: 4px;
}

/* 말풍선 category 전체 도움말 */
.ncs-chat[data-chat-type="category"] {
	background-color: transparent !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: hidden;
	border-radius: 0;
}
.list-map {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 8px;
	flex: 1 1;
	padding-bottom: 20px;
}

/* slide 카드 사이즈 */
.list-map > li {
	width: 240px;
	height: auto;
	min-height: 230px;
	align-self: stretch;
	padding-right: 0;
}
.list-map .bubble {
	min-width: 232px;
	height: 100%;
	padding: 12px 0 0;
	
	position: relative;
	/* 기본 말풍선 여백 */
	border-radius: 10px;
	border: solid 1px var(--grey01);
	background-color: var(--grey00);
}
.list-map .bubble .title__wrap {
	padding: 0 12px 11px;
	border-bottom: solid 1px var(--grey01);
	margin-bottom: 0;
}
.list-map li .list__wrap2 > .list {
	display: flex;
	gap: 10px;
	flex-direction: column;
	justify-content: flex-start;
	padding: 12px;
}
.list-map .bubble .list__wrap2 > .list .list__item {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	letter-spacing: -0.48px;
}

.list-map .list .list__item:hover {
	color: var(--primary01);
}

/* PC 1096 ~ */

/* swiper lib custom ---- override */
.category__swiper > .swiper-pagination1 {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0 !important;
	width: 240px;
	margin: 0 auto;
	text-align: center;
	height: 30px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	z-index: 10;
}

.swiper-button-next,
.swiper-button-prev,
.swiper-button-disabled {
	--swiper-theme-color: var(--grey05);
	--swiper-pagination-bullet-opacity: 1;
	--swiper-pagination: var(--grey06);
	color: var(--grey06, var(--grey05));
}
.swiper-pagination-bullet {
	--swiper-pagination-bullet-size: 5px;
}
.swiper-pagination-bullet-active {
	--swiper-theme-color: var(--grey05);
	--swiper-pagination-bullet-opacity: 1;
	--swiper-pagination: var(--grey06);
	opacity: var(--swiper-pagination-bullet-opacity, 1);
	background: var(--grey06, var(--grey08));
}
.page__swiper .swiper-button-next,
.page__swiper .swiper-button-prev {
	font-size: 20px;
	top: 40%;
}
.page__swiper .swiper-button-next:hover,
.page__swiper .swiper-button-prev:hover,
.page__swiper .swiper-button-next:active,
.page__swiper .swiper-button-prev:active {
	--swiper-theme-color: var(--primary01);
}

.mySwiper {
	width: 100%;
}
.swiper-slide {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	width: 84%;
}
.page__swiper {
	--swiper-navigation-size: 15px
}

.swiper-pagination-fraction {
	display: inline-block;
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
/* swiper lib custom ---- override */
/* 툴팁 레이어 */
.pop__layer {
	display: none;
	pointer-events: none;
	user-select: none;
	position: absolute;
	z-index: 666;
	width: 300px;
	height: 100%;
	max-height: 112px;
	background: #fff;
	box-shadow: 0px 3px 25px rgba(0, 0, 0, 0.16);
	border-radius: 4px;
	box-sizing: border-box;
}
.pop__layer .btn__link-text {
	display: block;
}
.pop__layer .pop__layer-content {
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	margin: 10px auto;
	box-sizing: content-box;
	overflow: hidden;
}
.pop__layer .pText {
	width: 100%;
	font-weight: 400;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	display:-webkit-box; 
	word-wrap:break-word; 
	line-height: 1.5;
	-webkit-line-clamp: 4; 
	-webkit-box-orient:vertical; 
	overflow:hidden; 
	text-overflow:ellipsis;
}

.pop__layer .p.pText *:not(img) {
	width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  word-wrap: break-word !important;
  font-size: 16px !important;
}

.pop__layer .pText + .pText {
	width: 100%;
	word-break: break-all;
	text-overflow: ellipsis;
	font-size: 16px;
	line-height: 1.57;
	white-space: nowrap;
}

/*2024 카테고리*/
.ncs-chat[data-chat-type="category2"] {
	width: var(--size_max2);
	min-width: var(--size_min);
	padding: 0 !important;
	transition: width 0.3s ease;
}
.ncs-chat[data-chat-type="category2"]._mobile {
	display: none;
}
.category_wrapper {
	display: flex;
	width: auto;
	height: 488px;
	align-items: flex-start;
}

.category_wrapper > ul {
	width: 159px;
	flex: none;
	height: 100%;
	padding: 8px 0;
	border-right: 1px solid #E8EBF2;
}

.category_wrapper .tab {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 40px;
	padding: 8px 9px 8px 15px;
	font-size: 15px;
	font-style: normal;
	font-weight: 700;
	line-height: 22px; /* 146.667% */
	letter-spacing: -0.35px;
	cursor: pointer;
}
.category_wrapper .tab:hover,
.category_wrapper .tab.active {
	color: var(--primary06);
}
.category_wrapper .tab.active:after {
	content: '\e80f';
	font-family: "fontello", fontello, sans-serif;
}
.category_wrapper .tab_contents {
	width: 100%;
	display: none;
	max-height: 480px;
	overflow-y: scroll;
}
.category_wrapper .tab[disabled] {
	opacity: 0.2;
	user-select: none;
	pointer-events: none;
}
.category_wrapper  .tab_contents.active {
	display: flex;
	flex-wrap: wrap;
}
.category_wrapper  .tab_contents .bubble {
	width: 50%;
	border-bottom: 1px solid #E8EBF2;
}

.category_wrapper  .tab_contents .bubble:nth-of-type(odd) {
	border-right: 1px solid #E8EBF2;
}

.category_wrapper  .tab_contents .bubble .title__wrap {
	padding: 11px 15px;
	height: 44px;
	border-bottom: solid 1px var(--grey01);
	margin-bottom: 0;
}
.category_wrapper  .tab_contents .bubble .list__wrap2 > .list {
	display: flex;
	/*gap: 10px;*/
	flex-direction: column;
	justify-content: flex-start;
	/*padding: 12px;*/
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px; /* 153.846% */
	letter-spacing: -0.26px;
	color: #747a86;
}

.bubble .list__wrap2 .list__item {
	max-height: 56px;
	min-height: 40px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	line-height: 22px;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	padding: 8px 15px;
	color: #747a86;
	cursor: pointer;
	transition: color 0.3s;
	box-sizing: border-box;
}
.bubble .list__wrap2 .list__item[disabled] {
	color: #A1A7B5;
	background-color: rgba(255,255,255,0.5);
	user-select: none;
	pointer-events: none;
}

.bubble .list__wrap2 .list__item:hover {
	color: #17191c;
}



/* ------------------------- ~./ pc -------------------------------------------- */

/* 타블렛  768 ~ 1096 */
@media screen and (max-width: 1095px) {
	.speech__bubble .title {
		font-size: 14px !important;
	}
	/* 연관 말풍선 간격 */
	.speech__bubble + .speech__bubble {
		margin-top: 4px;
	}
	.ncs-chat__area + .ncs-chat__area {
		margin-top: 8px;
	}
}

@media screen and (max-width: 767px){
	.page__swiper .swiper-wrapper {
		max-height: 272px;
	}
	.speech__bubble[data-chat-type="list"].__swipe {
		padding: 12px;
	}
	.page__swiper .pagination.swiper-pagination3 {
		margin: 0 auto;
		height: 14px;
		z-index: 8;
		padding-top: 0;
		align-items: flex-end;
		text-align: center;
	}
	.ncs-chat[data-chat-type="category2"] {
		width: calc(100% - 60px);
	}
}



/* 모바일  ~ 639 */
@media screen and (max-width: 639px) {
	.speech__bubble .title {
		font-size: 14px;
	}
	.speech__bubble .title > br {
		display: block;
	}
	/* 연관 말풍선 간격 */
	.speech__bubble + .speech__bubble {
		margin-top: 4px;
	}
	.ncs-chat__area + .ncs-chat__area {
		margin-top: 8px;
	}
	.chat__box > .speech__button {
		padding-top: 4px;
	}
	
	/* 반응형 폰트 사이즈 */
	.select-box .btn__select, .select-box .btn__select2,
	.btn__add-file,
	.btn-wrap .btn-text,
	.btn-wrap .btn-text2,
	.btn-wrap .btn-text2 > em {
		font-size: 12px;
		line-height: 1;
	}
	.full_btn-wrap .btn-text,
	.btn-wrap  .btn__primary .btn-text {
		font-size: 14px;
	}
	.speech__bubble[data-chat-type='user'] {
		max-width: var(--size_max2);
	}
	.title__wrap {
		margin-bottom: 13px;
	}
	.speech__bubble[data-chat-type="login"] button:nth-child(1) {
		margin: 16px auto 0;
	}
	.speech__bubble[data-chat-type="login"] .link-text, .speech__bubble[data-chat-type="login2"] .link-text {
		padding-top: 12px;
	}
	
	.speech__bubble[data-chat-type="system"] .btn-wrap button:nth-child(1) {
		/*margin-top: 8px;*/
		margin-top: 16px;
	}
	.speech__bubble[data-chat-type="system"] .sub-title + .btn-wrap button:nth-child(1){
		margin-top: 10px;
	}
	
	
	.btn__feedback i {
		font-size: 16px;
	}
	.speech__bubble[data-chat-type="list2"] {
		max-width: var(--size-large2);
		padding: 8px 2px 8px 10px;
	}
	.speech__bubble[data-chat-type="list"] {
		padding: 12px;
	}
	.speech__bubble[data-chat-type="chatbot"] {
		max-width: var(--size-medium);
	}
	/* todo: 체크 */
	.speech__bubble[data-chat-type="chatbot"] .text__wrap br {
		display: none;
	}
	.list__wrap .list > li dl {
		display: block;
		text-align: left;
	}
	.list__wrap .list > .list__item,
	.list__wrap .list > .list__item2,
	.list__wrap .list.__inside > .list__item3 {
		padding: 12px;
		max-height:46px;
	}
	
	.list__wrap .list > .list__item > span,
	.list__wrap .list > .list__item2 > span,
	.list__wrap .list.__inside > .list__item3 > span {
		display: block;
		width: 100%;
		max-height: 30px;
		font-size: 14px;
		line-height: 22px;
		
		text-overflow: ellipsis;
		white-space: nowrap;
		word-wrap: break-word;
		overflow: hidden;
	}
	
	.list__wrap .swiper-wrapper .list > .list__item {
		max-height: 46px;
	}
	.list__wrap .list.__inside {
		gap: 4px;
		border: 0;
		padding: 0;
		background-color: transparent;
	}
	.list__wrap .list.__inside > li,
	.list__wrap .list.__inside > .list__item3 {
		padding: 12px;
		border: 1px solid var(--secondary01);
		border-radius: 6px;
	}
	/*.accordion__box {*/
	/*	margin-top: 28px;*/
	/*}*/
	.accordion__box .btn__accordion {
		height: 44px;
		font-size: 14px;
		box-sizing: border-box;
		margin-top: 0;
	}
	.btn_list-wrap.faq__buttons {
		display: block;
		margin: 8px 36px 8px 0;
		gap: 0;
		background-color: #fff;
		border: 1px solid var(--grey01);
		border-radius: 10px;
		overflow: hidden;
	}
	.btn_list-wrap.faq__buttons > .btn--faq {
		width: 100%;
		border: 0;
		border-radius: 0;
	}
	.btn_list-wrap.faq__buttons > .btn--faq:not(:first-child) {
		border-top: 1px solid var(--grey01);
	}
	.btn_list-wrap.faq__buttons > .btn--faq.icon__fast {
		background-size: 14px 14px;
		background-position: calc(100% - 10px) 48%;
	}
	.speech__button.__prev {
		padding-top: 8px;
	}
	
	/* todo: form */
	/*.cs__box .cs-form {*/
	.cs__box .cs-title + .cs-form {
		padding: 0 0;
		margin: 16px 0 24px;
	}
	.cs__box .cs-form .options {
		gap: 16px;
	}
	.cs__box .check__wrap {
		padding: 17px 13px;
	}
	.cs__box .cs-form {
		gap: 20px;
	}
	.input__wrap .input-box {
		padding: 8px 24px 10px 8px;
	}
	.input__wrap .input-box.__focused {
		padding: 8px 44px 10px 8px;
	}
	.input__wrap .input-box input {
		font-size: 12px;
		font-weight: 400;
		line-height: 18px;
		letter-spacing: -0.26px;
	}
	.date__select-wrap {
		height: auto;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 5px;
		flex: auto 1 1;
	}
	.date__select-wrap .select-box {
		width: calc(50% - 3px);
	}
	.date__select-wrap .select-box.open {
		position: absolute;
		z-index: 12;
	}
	.date__select-wrap .select-box:first-child {
		width: 100%;
	}
	
	.date__select-wrap .select-box.open:nth-child(1) {
		top: 0;
		left: 0;
		right: 0;
	}
	.date__select-wrap .select-box.open:nth-child(2) {
		top: 45px;
		left: 0;
	}
	.date__select-wrap .select-box.open:nth-child(3) {
		top: 45px;
		right: 0;
	}
	.date__select-wrap .select-box.open + .select-box {
		margin-left: calc(50% + 5px);
	}
	.date__select-wrap.isError .error_text {
		top: 90px;
	}

	.speech__bubble[data-chat-type="faq"],
	.speech__bubble[data-chat-type="qna"] {
		width: calc(100vw  - 100px);
	}
	
	.file__list-item .file__name {
		font-size: 12px;
	}
	/* 채팅창 인풋 박스 */
	.input__wrapper.input-box .btn__delete {
		/*right: 70px;*/
		/*top: 22px;*/
		right: 36px;
		top: 0;
	}
/*}*/

/* 전체 카테고리 가로 스와이프로 변경되는 시점! window는 562*/
/* QA 요청 사항으로 639로 변경함 QACOWORK-9233 */
	.ncs-chat[data-chat-type="category"] {
		width: calc(100vw - 56px);
		height: 100%;
	}
	.speech__bubble[data-chat-type="qna"],
	.speech__bubble[data-chat-type="faq"]{
		/*max-width: calc(100vw - 116px);*/
		max-width: 420px;
		min-width: var(--size_min);
	}
	.speech__bubble[data-chat-type="category"] .list-map {
		flex-wrap: nowrap;
		align-items: stretch;
		flex: 1 1;
	}
	.speech__bubble[data-chat-type="category"] .list-map li{
		height: auto;
	}
	/* ## category swiper */
	.mySwiper {
		width: 100%;
	}
	.swiper-slide {
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		width: 84%;
	}
	/* slide 카드 사이즈 */
	.list-map > li {
		/* slide 카드 사이즈 */
		width: 240px;
	}
	.list-map > li .bubble {
		width: 232px;
		padding: 12px 0;
		position: relative;
		/* 기본 말풍선 여백 */
		border-radius: 10px;
		border: solid 1px var(--grey01);
		background-color: var(--grey00);
	}
	.select__wrap.isError + .input__wrap > .txt-cnt {
		top: -114px !important;
	}
	
	/* category 2024 */
	.ncs-chat[data-chat-type="category2"]._pc {
		display: none;
	}
	.ncs-chat[data-chat-type="category2"]._mobile {
		display: block;
		width: calc(100% - 30px);
		height: 300px;
	}
	
	.ncs-chat[data-chat-type="category2"]._mobile .category_wrapper {
		position: relative;
		flex-direction: column;
		height: 300px;
	}

	.category_wrapper .tab {
		font-size: 14px;
		font-style: normal;
		font-weight: 700;
		line-height: 22px; /* 157.143% */
		letter-spacing: -0.3px;
	}
	.category_wrapper .tab-box {
		width: 100%;
		height: 48px;
		overflow-y: hidden;
		overflow-x: auto;
		border-bottom: 1px solid var(--grey01);
	}
	.category_wrapper:after {
		content: '';
		position: absolute;
		z-index: 2;
		width: 20px;
		height: 45px;
		right: 0;
		top: 1px;
		border-top-right-radius: 10px;
		background: linear-gradient(to right, rgba(255, 255, 255, 0.00)0%, rgba(255, 255, 255, 1) 100%);
	}
	.tab-box::-webkit-scrollbar,
	.bubble_tab-box::-webkit-scrollbar{
		width: 0;
		height: 0;
	}
	.tab-box::-webkit-scrollbar-track,
	.bubble_tab-box::-webkit-scrollbar-track {
		background-color: transparent; /* 트랙 배경색을 투명하게 설정 */
	}
	.tab-box::-webkit-scrollbar-thumb,
	.bubble_tab-box::-webkit-scrollbar-thumb{
		background-color: transparent; /* 썸 배경색을 투명하게 설정 */
	}

	
	.category_wrapper .tab-box > ul {
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 14px;
		height: inherit;
		box-sizing: content-box;
		margin: 0 11px;
		border-bottom: 1px solid var(--grey00);
	}
	.category_wrapper .tab-box .mTab {
		flex: 1; /* 아이템들이 남는 공간을 차지하도록 함 */
		white-space: nowrap;
		height: 46px;
		padding: 13px 0;
		font-size: 14px;
		font-style: normal;
		font-weight: 700;
		line-height: 22px; /* 157.143% */
		letter-spacing: -0.3px;
		border-bottom: 2px solid transparent;
	}
	.category_wrapper .tab-box .mTab:hover,
	.category_wrapper .tab-box .mTab.active {
		color: #17191c;
		background: none;
		border-bottom-color: #17191C;
	}
	.category_wrapper .tab-box .mTab.active:after {
		display: none;
	}
	.category_wrapper .mTab_contents {
		display: none;
		justify-content: center;
		align-items: flex-start;
		width: 100%;
		/*height: 230px;*/
		height: calc(100% - 49px);
		overflow-y: hidden;
	}
	.bubble_tab{
		font-size: 14px;
		font-style: normal;
		font-weight: 700;
		line-height: 22px; /* 157.143% */
		letter-spacing: -0.3px;
	}
	.category_wrapper .bubble_tab_content {
		display: none;
		height: 100%;
		overflow-y: auto;
	}
	.category_wrapper .bubble_tab_content .list .list__item {
		padding: 8px 11px;
		font-size: 13px;
		font-style: normal;
		font-weight: 400;
		line-height: 20px; /* 153.846% */
		letter-spacing: -0.26px;
		
		color: var(--text_secondary);
	}
	.category_wrapper .bubble_tab_content .list .list__item:hover {
		color: var(--primary06);
	}
	.category_wrapper .mTab_contents.active,
	.bubble_tab_content.active{
		display: flex;
	}
	
	.bubble_tab-box {
		width: 45%;
		max-width: 166px;
		min-width: 130px;
		height: 100%;
		overflow-y: auto;
		border-right: 1px solid var(--grey01);
		transition: all 0.3s;
	}
	.bubble_tab-box > ul {
		padding: 10px 0;
	}
	.bubble_tab-box .tab {
		padding: 7px 11px;
		min-height: 36px;
		height: auto;
	}
	.bubble_tab_content {
		width: 55%;
		transition: all 0.3s;
	}
	.speech__bubble[data-chat-type="default2"] {
		max-width: var(--size_min);
		padding: 7px 11px;
	}
	.speech__bubble[data-chat-type="default3"] {
		max-width: var(--size_min);
		padding: 7px 11px 15px;
	}
	.speech__bubble[data-chat-type="default3"] .btn_medium {
		max-width: 212px;
	}
	.speech__bubble[data-chat-type="system"] {
		width: var(--size_min);
	}
	.speech__bubble[data-chat-type="system2"] {
		width: var(--size-medium);
		/*margin-bottom: 100px;*/
	}
	.speech__bubble[data-chat-type="system2"] .added_box {
		margin-top: 15px;
		word-break: break-word;
	}


	.speech__bubble[data-chat-type="buttonList"] .cont-title {
		font-size: 14px;
	}
	.speech__bubble[data-chat-type="buttonList"] .btn_list-wrap {
		flex-direction: column;
		flex-wrap: nowrap;
	}
	.speech__bubble[data-chat-type="buttonList"] .btn_list-wrap .listBtn {
		width: 100%;
		min-height: 40px;
	}
}

/* 모바일 - 최소 예외처리 */
@media screen and (max-width:400px){
	.page__swiper .swiper-wrapper {
		max-height: 376px;
		min-width: 216px;
	}
	.speech__bubble[data-chat-type="refresh"] {
		max-width: var(--size-small);
	}
	.ncs-chat[data-chat-type="category2"]._mobile {
		max-width: calc(100vw - 60px);
	}
	.speech__bubble[data-chat-type='user'],
	.speech__bubble[data-chat-type="default"],
	.speech__bubble[data-chat-type="form"]  {
		max-width: var(--size-medium);
	}

	.list__wrap .list .list__item2 {
		min-height: 44px;
		height: auto;
	}
	.speech__bubble .sub-title {
		font-size: 12px;
		line-height: 1.5;
		letter-spacing: -0.26px;
	}
	
	.speech__bubble .text__wrap .sub-title {
		font-size: 14px;
		line-height: 1.5;
		letter-spacing: -0.26px;
	}
}



@media screen and (max-width: 639px) {
	 @supports (-webkit-touch-callout: none) {
		 .speech__bubble[data-chat-type="list2"] {
			 padding: 8px 0 8px 10px;
		 }
		 .speech__bubble[data-chat-type="list2"] .list__wrap {
			 padding-right: 12px;
		 }
	 }
}