@charset "utf-8";


/* skip */
#skip{height:0}
#skip a{display:block;position:absolute;left:0;top:-100px;width:100%;height:1px;text-align:center}
#skip a:focus,#skip a:active{position:absolute;top:0;z-index:30;height:18px;padding: 12px 0;background: #25507e;color:#fff;font-size: 16px;font-weight:bold;}

/* layout */
.chat_wrap{height:100%;}
.chat_box{position:relative;width:100%;height:100%;box-sizing:border-box;}
.chat_top{position:relative;background: #fff;box-shadow:0 2px 3px rgba(0, 0, 0, .08);z-index:10}
.chat_cont{width:100%;position: absolute;top:55px;bottom:79px;padding: 15px 16px;box-sizing:border-box;overflow-y:auto;background: #EFF6FF;overflow-x: hidden;}
.chat_bottom{position: absolute;left: 0;right: 0;bottom: 0;height: 50px;background:#B1D6F9;box-sizing: border-box;}

/* icon */
.ico_menu{width:22px;height:22px;background-image:url(/images/ico_menu.png);}
.ico_guide{width:22px;height:22px;background-image:url(/images/ico_guide.png);}
.ico_close{width:18px;height:18px;background-image:url(/images/ico_close.png);}
.ico_send{width:18px;height:20px;background-image:url(/images/ico_send.png);}
.ico_bot{width:40px;height:34px;background:url(/images/ico_bot.png)}

/* chat_top */
.h_tit{height:55px;padding:11px 16px;box-sizing: border-box;text-align:center}
.chat_name{font-size:1.8rem;color:#333;font-weight:500;letter-spacing:-0.5px;vertical-align: middle}
.top_btn{position:absolute;top:0;left:9px}
.menu_btn{padding:16px 7px}
.top_btn.right{right:9px;left:auto}

/* chat_cont */
.bot_wrap:after{content:"";display:block;clear:both;}
.bot_wrap,.user_wrap {margin-bottom:20px;}
.bot_wrap{position:relative;padding-left:45px}
.bot_img{position:absolute;left:0;top:0;}
.bot_box .bot_txt{float:left;max-width:95%;border-radius: 0 15px 15px 15px;position: relative;background-color: #fff;line-height:1.29;padding:11px 12px 12px}
.bot_box .bot_txt + .bot_txt{margin-top:10px}
.bot_txt:after{content:"";display:block;clear:both;}

/* 200자 이상 bot_txt_cut */
/* .bot_box .bot_txt_cut{float:left;max-width:95%;border-radius: 0 15px 15px 15px;position: relative;background-color: #fff;line-height:1.29;padding:11px 12px 12px; height:100px; overflow:hidden;} */
.bot_box .bot_txt_cut{max-width:95%;border-radius: 0 15px 15px 15px;position: relative;background-color: #fff;line-height:1.29;padding:11px 12px 12px; height:100px; overflow:hidden;}
.bot_box .bot_txt_cut + .bot_txt_cut{margin-top:10px}
.bot_txt_cut:after{content:"";display:block;clear:both;}

.time{clear:both;display:block;font-size:1.2rem;color: #999;letter-spacing: -0.12px;padding-top:5px;}
.user_box:after{content:"";display:block;clear:both;}
.user_box .user_txt{float:right;position:relative;padding:11px 12px 12px;line-height: 1.29;background-color: #FEE993;border-radius: 15px 0 15px 15px}
.user_box .user_txt:after{content:"";display:block;clear:both;}
.user_box .user_txt + .user_txt{clear:both;margin-top:5px;}
.user_box .time{clear:both;float:right}


/* 2021-12-08 수정 시작 */
.menu_wrap{padding:0 7px;margin-bottom:40px!important}
.menu_tit{margin-bottom:5px}
.menu_tit:before{content:"";display:block;width:100%;height:1px;background:#BCCCE2;position: relative;top: 15px;}
.menu_tit .txt{display:inline-block;font-size:1.5rem; background:#EFF6FF;padding-right:10px;position: relative}
.menu_list{margin-left:-7px;font-size:0;text-align:left}
.menu_item{display:inline-block;width:33.3333%;vertical-align:top}
.menu_link{display:block;height:100px;padding:12px 0; background-color:#fff;text-align:center;border-radius:15px;box-sizing:border-box;box-shadow: 0 1px 1px rgba(0,0,0,.1);margin:6px 0 0 7px}
.menu_link:hover, .menu_link.on{border:2px solid #356DB5}
.menu_link:hover .menu_txt, .menu_link.on .menu_txt{color:#356DB5;font-weight:500;}
.menu_link .menu_unit{display:inline-block;vertical-align:middle}
.menu_link .menu_txt{display:inline-block;font-size:1.4rem;color:#555;line-height:1.1;vertical-align:middle;letter-spacing:-0.5px;font-weight: 500;}
.menu_unit:after{overflow:hidden;display:inline-block;height:100%;vertical-align:middle;content:''}
.icon{display:block;height:45px;background-repeat:no-repeat;background-size: contain !important;margin: 0 auto 11px auto;}
.icon.menu01{width:45px;background-image:url(/images/ico_menu01.png);}
.icon.menu02{width:51px;background-image:url(/images/ico_menu02.png);}
.icon.menu03{width:50px;background-image:url(/images/ico_menu03.png);margin-bottom: 5px;}
.icon.menu04{width:52px;background-image:url(/images/ico_menu04.png);}
.icon.menu05{width:45px;background-image:url(/images/ico_menu05.png);}
.icon.menu06{width:45px;background-image:url(/images/ico_menu06.png);}
.icon.ci01{width:75px;height:55px;margin-top:11px; background-image:url(/images/ico_ci01.png);}
.icon.ci02{width:90px;height:50px;margin-top:11px;background-image:url(/images/ico_ci02.png);}
.icon.ci03{width:86px;height:30px;margin-top:23px;background-image:url(/images/ico_ci03.png);}
.icon.ci04{width:83px;height:39px;margin-top:19px;background-image:url(/images/ico_ci04.png);}
.icon.ci05{width:89px;height:60px;margin-top:8px;background-image:url(/images/ico_ci05.png);}
/* 2021-12-08 수정 끝 */

.btn_group{margin-top:10px;}
.btn_link{display:block;height:36px;background:#f1f1f1;border-radius:30px;padding:9px 10px;text-align: center;color: #333;letter-spacing: -0.14px;box-sizing: border-box;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}/*  2021-10-08 수정*/
.btn_group li + li {margin-top: 6px;}
.btn_link:hover, .btn_link.on{background-color:#356DB5!important;color:#fff!important;font-weight:500;}/*  2021-10-08 수정*/
.btn_link.btn_type{background-color:#fff;border:1px solid #356DB5;color:#356DB5;font-weight:500}
.btn_link.btn_type:hover, .btn_link.btn_type.on{background-color: #f2f8ff;}
.btn_link.btn_ass{background-color:#fff;border:1px solid #356DB5;color:#356DB5;font-weight:500}
.btn_link.btn_ass:hover, .btn_link.btn_ass.on{background-color: #f2f8ff;}

.btn_wrap{clear:both;margin:0 10px 0 -45px}
.btn_group_type .btn_item{display: inline-block; margin-top:0px;}
.btn_group_type .btn_type{margin:10px 0 0 10px}
.btn_group_type .btn_link.btn_type:hover, .btn_group_type .btn_link.btn_type.on{background-color:#356DB5;color:#fff;font-weight:500;}

.img_box{margin-top:10px}
.img_tit{display:block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; font-weight:500;margin-bottom:10px;font-size:1.4rem}
.img_box .img_link{display:block;}
.img_box .img_link > img{display:block;max-width:100%;}
/*.img_wrap{clear:both; margin:0 10px 0 -45px}*/
.img_wrap{clear:both; text-align:center;}
.img_wrap .img_list{font-size:0;margin-bottom:20px!important}
.img_wrap .img_box{width:250px!important;vertical-align:top;border-radius: 0 15px 15px 15px;position: relative;background-color: #fff;padding:11px 12px 12px;margin-left:10px}



/* slick */
.menu_wrap.slide_wrap .slick-prev{left:-6px;margin-top:13px}
.menu_wrap.slide_wrap .slick-next{right:-6px;margin-top:13px}
.slide_wrap .slick-prev{left:-6px;margin-top:5px}
.slide_wrap .slick-next{right:-16px;margin-top:5px}
.slide_wrap .slick-dots{left:0;right:0;bottom:-24px;width:auto}
.slide_wrap .slick-dots li{margin:5px;width:8px;height:8px}
.slide_wrap .slick-dots li.slick-active {margin:5px;width:17px;height:8px} /* 버튼 간격 조정 */
.slide_wrap .slick-dots li button{padding:0;width:8px;height:8px;background-color:#ddd;opacity:1;border-radius:10px}
.slide_wrap .slick-dots li button:before{display:none}
.slide_wrap .slick-dots li.slick-active button{background-color:#189FE9; width:17px}
.slide_wrap .slick-prev:before,.slide_wrap .slick-next:before,.slide_wrap .slick-prev:before,.slide_wrap .slick-next:before{display:none}
.slide_wrap .slick-prev,.slide_wrap .slick-prev:hover,.slide_wrap .slick-prev:focus{width:7px;height:10px;background-image:url(/images/ico_prev.png);background-size: contain}
.slide_wrap .slick-next,.slide_wrap .slick-next:hover,.slide_wrap .slick-next:focus{width:7px;height:10px;background-image:url(/images/ico_next.png);background-size: contain}
.slide_wrap .slick-disabled{cursor:default;opacity:.5}


/* chat_bottom */
.bottom_inner{padding:8px 16px;}
.inp_box{position:relative;height:34px}
.inp_box .inp{width:100%;padding: 7px 12px 7px 15px;display: block;box-sizing:border-box;border-left: 1px solid #e2e2e2;;letter-spacing: -0.35px;color: #333;border-radius:18px}
.inp_box .inp:focus + .btn_send .ico_send, .inp_box .inp:active + .btn_send .ico_send{background:url(/images/ico_send_on.png)}
.btn_send{position: absolute;top:7px;right:12px}
.bottom_menu{position:absolute;bottom:50px;left:0;right:0;background-color:#B1D6F9;border-radius:10px 10px 0 0}
.bottom_menu .btn_txt{display:inline-block;width:49%;text-align:center; padding:12px 0 8px;color:#333}
.bottom_menu .btn_txt:first-child::after{position:absolute;left:50%; content:"";width:1px;height:15px;background-color:#75B2EB}

.auto_keyword{border-radius: 10px 10px 0 0;background-color: #fff;position: absolute;bottom: 50px;left: 0;right: 0;z-index: 100;box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.1);overflow: hidden}
.keyword_box .sch_link{color: #333;display: block;;padding:7px 16px 8px 16px;box-sizing: border-box;}
.keyword_box .sch_link mark{color: #356DB5;}
.keyword_box .sch_link:hover, .keyword_box .sch_link.on,.keyword_box .sch_link:active{background:#E0EDFE;}
.keyword_box .sch_link.on{font-weight: 500}

/*  2021-10-08 추가 시작 */
.info_box{margin-top:10px;}
.info_box li + li{margin-top:5px;}
.info_box .info_tit:before{content:"";display:inline-block;width:4px;height:4px;background: #ababab;vertical-align: middle;margin-right: 5px;}
.info_box .info_tit{display:inline-block;min-width:87px;line-height:1.29;}
.info_box .btn_link{display: inline-block;height: 25px;padding:4px 10px 3px;font-size:1.3rem;margin-left:6px;vertical-align:middle}

.chat_wrap.pop{background: #EFF6FF}
.pop_top{position:relative;background-color:#fff;box-shadow:0 2px 3px rgba(0, 0, 0, .08);z-index:10}
.pop_cont{width:100%; background-color:#fff;position: absolute;top:55px;bottom:50px;padding: 15px 16px;box-sizing:border-box;overflow-y:auto;line-height: 1.5}
.pop_bottom{position:absolute; background-color:#fff; left:0;right:0;bottom:0;z-index:10}
.pop_btn_group{font-size:0;padding: 10px 16px}
.pop_btn_group .btn_link{display:inline-block;width:100%; height:36px;background:#ddd;border-radius:30px;padding:9px 10px;text-align: center;color: #333;letter-spacing: -0.14px;box-sizing: border-box;font-size:1.4rem}
.pop_btn_group.half button{width:calc(50% - 4px);}
.pop_btn_group.half button + button{margin-left:7px;}
.pop_cont .pop_img >img{position:absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width:calc(100% - 30px)}
.pop_box .survey_tit{font-size:1.5rem;font-weight:500;}
.star_rating_box{margin: 15px 0 35px;font-size:0}
.star_rating_box .ico_star{display:inline-block;width:30px;height:30px;background:url(/images/ico_star.png);text-indent:-9999px;background-size:30px 30px;vertical-align:top;cursor:pointer}
.star_rating_box .ico_star.is_selected{background-image:url(/images/ico_star_on.png)}
.star_rating_box .ico_star+.ico_star{margin-left:10px}
.pop_box .opinion{width:100%;height: 230px;margin: 5px 0 6px;border-radius: 5px;border:1px solid #ddd;background: #fff;resize: none;padding: 10px;box-sizing: border-box;-ms-overflow-y:auto;}
.opinion_info:after{content:"";display:block;clear:both;}
.opinion_info .txt{float:left;font-size:1.3rem;color:#666}
.opinion_info .txt.num{float:right;}
.dimmed{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:100}
.layer_wrap{display:none;position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;z-index:200}
.layer_cont{position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);width:310px;border-radius:20px;background-color: #fff;box-sizing:border-box;}
/* 만족도조사 글자수레이어  width 줄여주기 위해*/
#layer_cont{position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);width:215px;border-radius:20px;background-color: #fff;box-sizing:border-box;}
.survey_box{padding:40px 30px;}
.alert_box{padding:30px 20px 10px 20px;box-sizing: border-box;}
.alert_box .txt{text-align:center;font-size:16px;font-weight:bold;color:#333;line-height:1.38;letter-spacing: -0.4px;}
.pop_back{padding:17px 7px}
.ico_back{width:13px;height:20px;background-image:url(/images//ico_back.png)}
.guide_img_box{height:100%;text-align:center}
.guide_img_box > img{height:95%}
.guide_box{padding:10px 16px 0 16px}
.guide_box .tit_box:after{content:"";position:relative;top:3px;left:0;display:block;height:2px;background:#356DB5;}
.guide_box .tit_box strong{font-size:1.6rem;font-weight:500;line-height:1.13;letter-spacing:-0.4px;color: #356DB5;display: inline-block;margin-bottom: 5px;}
.guide_box .tit_box span{position:relative;top:-12px;left:10px;}
.guide_box .tit_box span.tit_txt{top:0;left:0;}
.guide_box .cont{margin:20px 0 0 10px;position: relative;}
.guide_box .cont + .tit_box{margin-top:40px;}
.guide_box .qna_list li{line-height:1.3;}
.guide_box .qna_list li span{word-break:keep-all;}
.guide_box .qna_list li:before{position:relative;top:-2px;content:"";display:inline-block;width:4px;height:4px;background:#ababab; vertical-align:middle;margin-right:8px;}
.guide_box .qna_list li + li{margin-top:15px;}
@media (min-width:320px) and (max-width:420px){
	.qna_list li .m_txt{display:block;padding-left:11px;}
}
.error_cont{width:100%;position: absolute;top:55px;bottom:50px;padding:15px 16px;box-sizing:border-box;text-align:center}
.main_tit{font-size:1.8rem;font-weight:500;white-space:pre-line;line-height: 1.5;letter-spacing: -0.63px;}
.info_txt{font-size:1.4rem;line-height: 1.43;margin:20px 0 30px}
.error_cont .btn_link{display: inline-block;width:100px}
/*  2021-10-08 추가 끝 */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
	z-index: 100;
}

.ui-autocomplete {
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
/* 자동완성 */
.ui-autocomplete a span{
	color:red; 
	font-weight:bold;
}
.ui-autocomplete a{
	display:block;
}
.ui-autocomplete a:hover{
	background-color:#eaeff9; 
	border: 1px solid #003eff;
}

/* dim-layer */

.chat_dim-layer {
	display: none;
	position: fixed;
	_position: absolute;
	top: 75px;
	left: 62px;
	width: 75%;
	height: 75%;
	z-index: 100;
}

.survey_dim-layer {
	display: none;
	position: fixed;
	_position: absolute;
	top: 75px;
	left: 62px;
	width: 75%;
	height: 75%;
	z-index: 100;
}

.dimBg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color:#000;
	opacity:.5;
	filter:alpha(opacity=50);
	z-index: 99;
}

.guide1_dim-layer {
	display: none;
	position: fixed;
	_position: absolute;
	top: 75px;
	left: 62px;
	width: 75%;
	height: 75%;
	z-index: 100;
}

.guide2_dim-layer {
	display: none;
	position: fixed;
	_position: absolute;
	top: 75px;
	left: 62px;
	width: 75%;
	height: 75%;
	z-index: 100;
}
/* 웹 접근성 조치 */
.user_message {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
}
/* 웹 접근성 조치 */
.chat_message {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
}
/* 웹 접근성 조치 */
.menu_img_txt {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
}