@charset "utf-8";

/*기본설정/폰트설정 : 딜러/고객 각각 포함되어있어 작업시 제외해도 됨*/

/* pretendard */
@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	src: 
	url('/font/Pretendard/Pretendard-Thin.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Thin.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	src: 
	url('/font/Pretendard/Pretendard-ExtraLight.woff') format('woff'),
	url('/font/Pretendard/Pretendard-ExtraLight.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	src: 
	url('/font/Pretendard/Pretendard-Light.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Light.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	src: 
	url('/font/Pretendard/Pretendard-Regular.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	src: 
	url('/font/Pretendard/Pretendard-Medium.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Medium.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	src: 
	url('/font/Pretendard/Pretendard-SemiBold.woff') format('woff'),
	url('/font/Pretendard/Pretendard-SemiBold.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	src: 
	url('/font/Pretendard/Pretendard-Bold.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	src: 
	url('/font/Pretendard/Pretendard-ExtraBold.woff') format('woff'),
	url('/font/Pretendard/Pretendard-ExtraBold.ttf') format('truetype');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	src: 
	url('/font/Pretendard/Pretendard-Black.woff') format('woff'),
	url('/font/Pretendard/Pretendard-Black.ttf') format('truetype');
}



/*************************************************************************/

/*1:1문의 : 기본*/
.chat-com *{box-sizing: border-box;margin:0; padding:0;border: 0;font-family:'Pretendard';font-weight:400; color:#000;line-height:1;}
.chat-com ul, 
.chat-com li{list-style: none;padding:0;}
.chat-com a{text-decoration: none;color:inherit;}

.chat-com{position:fixed;top:0;left:0;z-index:999;overflow:hidden;width:100%;height:100vh;margin:0 auto;padding:0;}
.chat-com-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:#20212383;}
.chat-com-con{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;max-width:400px;max-height:800px;}
.chat-com button {border: 0; border:none; box-shadow:none; border-radius:0; padding:0; cursor:pointer;}
.chat-com a{color:inherit;text-decoration: none;}
.chat-com .dealer-thumb img{width:100%}

.chat-com .con-top{width:100%;}
.chat-com .chat-hd{display:flex;position:relative;text-align:center;align-items:center;justify-content:center;width:100%;height:50px;padding:0px 20px;background:#163989;}
.chat-com .con-top h2{font-size:20px;font-weight:500;text-align: center;color:#fff;}
.chat-com .con-top span{font-size:20px;font-weight:500;text-align: center;color:#fff;}
.chat-com .chat-close{position:absolute;top:50%;right:20px;transform:translateY(-50%);background:none;}
.chat-com .chat-setting{position:absolute;top:50%;left:20px;transform:translateY(-50%);background:none;}  /* 2024-07-16 LEE */
/*.chat-com .con-wrap{width:100%;height:calc(100% - 136px)}*/
.chat-com .con-wrap{width:100%;height:calc(100% - 136px)}
.chat-com .dealer-info{display:flex;width:100%;height:55px;padding:0 20px;align-items: center;justify-content: space-between;background:#1778FB;}
.chat-com .dealer-info>div{display:flex;align-items: center;}
.chat-com .dealer-info .dealer-thumb{width:40px;height:40px;margin-right:10px;border-radius: 40px;overflow:hidden;}
.chat-com .con-top .dealer-name{font-size: 16px;color:#fff;}
.chat-com .con-top .dealer-name span{font-weight:700;color:#fff;}
.chat-com .dealer-score{margin-right:23px;font-size:16px;font-weight:700;color:#fff;}
.chat-com .dealer-rate-form-btn{display:flex;height:28px;padding:2px 7px;border-radius:8px;background:#f4f4f4;font-size: 12px;font-weight:700;align-items:center;justify-content:center;}
.chat-com .dealer-rate-pre-btn{display:flex;width:25px;height:25px;border-radius:50%;background:#f4f4f4;align-items:center;justify-content:center;}
.chat-com .chat-area{position:relative;height:calc(100% - 70px);padding:20px;background:#fff;overflow-y:auto;}
.chat-com .con-bt{display:flex;width:100%;height:70px;padding:0px 20px;align-items: center;justify-content: space-between;border-top:1px solid #f4f4f4;background:#eeeeee;}
.chat-com .con-bt>div{display:flex;align-items: center;}
.chat-com .con-bt .con-l{width:80%;}
.chat-com .con-bt .con-r{width:18%;justify-content: flex-end;}
.chat-com .con-bt a{display:block;}
.chat-com .con-bt input[type="text"]{width:100%;height:40px;margin-left:10px;font-size:16px;min-width:auto;padding:0;border:none;border-radius: 10px;}
.chat-com .con-bt input[type="text"]::placeholder{color: rgba(13, 8, 44, 0.60);}
.chat-com .con-bt .chat-send-btn{display:flex;width:40px;height:40px;margin-left:15px;border-radius:50%;align-items:center;justify-content: center;background:#1778FB;}

.chat-com .chat-area .bubble-wrap{margin-bottom:30px;}
.chat-com .chat-area .spch-bubble .spch-bubble-txt{position:relative;padding:10px 15px;}
.chat-com .chat-area .spch-date{position:absolute;bottom:-15px;right:0;font-size:10px;color:rgba(13, 8, 44, 0.40);}
.chat-com .chat-area .user-bubble .spch-bubble{display:flex;justify-content:flex-end;margin-left:30px;}
.chat-com .chat-area .user-bubble .spch-bubble .spch-bubble-txt{border-radius: 10px 0px 10px 10px;background:#1778FB;}
.chat-com .chat-area .user-bubble .spch-bubble .spch-bubble-txt p{color:#fff;font-size:14px;}
.chat-com .chat-area .dealer-bubble{display:flex;align-items: flex-start;margin-right:30px;}
.chat-com .chat-area .dealer-bubble .dealer-thumb{overflow:hidden;width:30px;height:30px;margin-right:10px;border-radius:50%;}
.chat-com .chat-area .dealer-bubble .dealer-name{margin-bottom:5px;font-size:12px;font-weight:600;}
.chat-com .chat-area .dealer-bubble .spch-bubble .spch-bubble-txt{border-radius: 0px 10px 10px 10px;background: #F1F7FF;}
.chat-com .chat-area .dealer-bubble .spch-bubble .spch-bubble-txt p{font-size:14px;}
.chat-com .chat-area .dealer-bubble.typing .spch-bubble-txt{display:flex;align-items: center;gap:8px;}
.chat-com .chat-area .dealer-bubble.typing .typing-load{display:block;width:11px;height:11px;border-radius:50%;background:#c7dfff;}
.chat-com .chat-area .chat-date{display:flex;width:fit-content;margin:0 auto 20px;padding:7px 12px;align-items:center;border-radius: 41px;background:#f4f4f4;font-size:10px;}
.chat-com .chat-area .chat-date p{margin-left:2px;font-size:10px;color:#0D082C;}
/* 2024-08-04 LEE */
.chat-com .chat-area .chat-date .se{margin-left:2px;font-size:14px;font-weight:600;color:#FF0000;}
.chat-com .chat-area .chat-date .ss{margin-left:2px;font-size:14px;font-weight:600;color:#0D082C;}
.svgred {filter: invert(11%) sepia(87%) saturate(7431%) hue-rotate(356deg) brightness(95%) contrast(114%);}
/* 2024-08-04 LEE */

/*하단 평가 버튼 노출*/
.chat-com .dealer-review-wrap{position:absolute;bottom:20px;width:calc(100% - 40px);}
.chat-com .dealer-review-wrap>a{display:flex;width:100%;height:44px;margin-top:10px;padding:0 15px;align-items: center;justify-content:center;font-size:16px;font-weight:600;border-radius:20px;}
.chat-com .dealer-review-wrap .dealer-recom-btn{background:#1778FB;color:#fff;}
.chat-com .dealer-review-wrap .dealer-review-btn{background:#fff;color:#1778FB;border:1px solid #1778FB;}


/*1:1문의 : 팝업*/

/*공통*/
.chat-pop-com{position:absolute;top:0;left:0;z-index:9999;width:100%;height:100%;}
.chat-pop-com .pop-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:#20212383;}
.chat-pop-com .pop-con{position:absolute;top:50%;left:50%;width:calc(100% - 60px);padding:20px;border-radius:25px;background:#fff;transform:translate(-50%, -50%);}
.chat-pop-com .pop-close{position:absolute;top:20px;right:20px;}
.chat-pop-com .pop-con .con-tit h3{margin:20px 0;text-align:center;font-size:20px;font-weight:600;line-height:1.4;}
.chat-pop-com .chat-pop-btn{display:flex;width:100%;height:44px;padding:0px 15px;border-radius:20px;font-size:16px;color:#fff;font-weight:600;background:#1778FB;align-items:center;justify-content:center;}

/*팝업 - 추천/비추천*/
.chat-pop-recom .pop-con .emoji-btn-area{width:100%;padding-bottom:20px;border-bottom:1px dashed #DFE0E2;}
.chat-pop-recom .pop-con .emoji-btn-area ul{display:flex;align-items: center;justify-content: center;gap:40px;text-align:center;}
.chat-pop-recom .pop-con .emoji-btn-area li span{display:block;margin-top:10px;font-size:16px;color:#9DA0A5;}
.recom-good-sel .pop-con .emoji-btn-area .emoji-good span{color:#1778FB;}
.recom-bad-sel .pop-con .emoji-btn-area .emoji-bad span{color:#1778FB;}
.chat-pop-com .pop-con .emoji-btn{width:56px;height:56px;border-radius:50%;}
.chat-pop-com .pop-con .emoji-good .emoji-btn{background:#eee url(/images/chat/ico_chat_rate_good_off.svg) no-repeat center center;background-size:35px;}
.recom-good-sel .pop-con .emoji-good .emoji-btn{background:#1778FB url(/images/chat/ico_chat_rate_good_on.svg) no-repeat center center;background-size:35px;}
.chat-pop-com .pop-con .emoji-bad .emoji-btn{background:#eee url(/images/chat/ico_chat_rate_bad_off.svg) no-repeat center center;background-size:40px;}
.recom-bad-sel .pop-con .emoji-bad .emoji-btn{background:#1778FB url(/images/chat/ico_chat_rate_bad_on.svg) no-repeat center center;background-size:40px;}
.chat-recom-reason{padding:27px 0;}
.chat-recom-reason li{margin-bottom:20px;}
.recom-bad-sel .chat-recom-reason li:last-child{margin-bottom:0;}
.chat-recom-reason label {display: block;position: relative;padding-left: 30px;cursor: pointer;font-size: 16px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.chat-recom-reason label input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.chat-recom-reason .chkmark {position: absolute;top: 50%;left: 0;height: 20px;width: 20px;background: url(/images/chat/ico_chat_chk_off.png) no-repeat center;background-size: contain;transform: translateY(-50%);}
.chat-recom-reason label input:checked ~ .chkmark {background: url(/images/chat/ico_chat_chk_on.png) no-repeat center;background-size: contain;}


/*팝업 - 후기 입력*/
.chat-pop-review .chat-review-con{margin-bottom:20px;padding:10px 20px;border-radius: 20px;border:1px solid #DFE0E2;}
.chat-pop-review textarea{width:100%;height:228px;padding:0;resize:none;font-size:14px;border-radius: 0;}

/* 24-01-07 LEE */
.chat-com-con .btn_wrap {position: relative; text-align: center;}
.chat-com-con .btn_r {display: inline-flex; align-items: center; justify-content: center; background: #163989; color: #fff; padding: 0 40px; border-radius: 50px; box-sizing: border-box; font-weight: 600; flex-shrink: 0}
.chat-com-con .size50 {height: 50px; line-height: 50px; font-size: 20px}

.set_cont .dealer-list{padding:20px 0 10px 0;margin:0 20px;align-items: center;justify-content: space-between;border-bottom: 1px solid #ddd;}
.set_cont .dealer-list .dealer-bubble{display:absolute;align-items: flex-start;}
.set_cont .dealer-list .dealer-bubble .dealer-thumb{overflow:hidden;width:30px;height:30px;margin-right:10px;border-radius:50%;}
.set_cont .dealer-list .dealer-bubble .dealer-name{width:calc(100% - 80px);font-size:12px;font-weight:600;margin-bottom:5px;}
.set_cont .dealer-list .dealer-bubble .spch-bubble .spch-bubble-txt{padding:10px;border-radius: 0px 10px 10px 10px;background: #F1F7FF;}
.set_cont .dealer-list .dealer-bubble .spch-bubble .spch-bubble-txt p{font-size:14px;}
.set_cont .dealer-list .dealer-bubble.typing .spch-bubble-txt{display:flex;align-items: center;gap:8px;}
.set_cont .dealer-list .dealer-bubble.typing .typing-load{display:block;width:11px;height:11px;border-radius:50%;background:#c7dfff;}
.set_cont .dealer-list .spch-date{width:80px;font-size:12px;color:rgba(13, 8, 44, 0.40);display:inline-block;float:right;}

.select {
//  color: #333333;
  font-size: 12px;
  height: 25px;
  border-radius: 0;
  border: 1px solid #DFE0E2;
  min-width: 150px;
  padding: 0 20px 0 10px;
  background-image: url('/images/etc/bbs_select.svg'); background-size: 12px; background-position : calc(100% - 10px) 50%;
}