@charset "utf-8";
/* layout */
.chat_wrap{height:100%;}
.chat_box{position:relative;width:100%;height:100%;box-sizing:border-box;}
.chat_top{height: 60px;padding:12px 20px 9px;
box-sizing: border-box; background: #0E2757;}
.chat_cont{width:100%;position: absolute;top:60px;bottom:50px;padding:8px 15px;
box-sizing:border-box;overflow-y:auto;overflow-x:hidden;background: #f8f8f8;
    border-radius: 20px 20px 0 0;line-height: 1.3;font-size: 14px;}
.chat_bottom{position: absolute;left:0;right:0;bottom:0;height:50px;background: #fff;box-sizing: border-box;border: 1px solid #E2E2E2;}

/* icon */
.ico_logo{width:40px;height:40px;background-image:url(../images/logo_chat1.png);}
.ico_tfont{position:relative; top:1px; width:30px;height:30px;background-image:url(../images/ico_font.png);}
.ico_help{position:relative;top:-1px;width:23px;height:22px;background-image:url(../images/ico_help.png);}
.ico_close{position:relative;top:1px;width:30px;height:30px;background-image:url(../images/ico_close.png);}
.ico_pop_close{z-index:100; width:13px;height:13px;background:url(../images/ico_pop_close.png);background-size:contain;}
/*.ico_voice_mike{background: url(../images/ico_voice_mike.png) #458df3;background-size: contain;}*/
.ico_mike{width:15px;height:22px;background-image:url(../images/ico_mike_on.png);margin: 0px 0px 8px;}
.ico_send{width:33px;height:33px;background-image:url(../images/ico_send.png);}
.ico_square{display: inline-block;width:50px;height:50px;background:url(../images/ico_square.png) no-repeat 50% 50%;border-right: 1px solid #E2E2E2;}
/* chat_top */
.h_tit{display:block;text-align:left;}
.h_tit .logo{width:36px;height:39px;cursor:pointer;vertical-align: middle;}
.h_tit span{margin-left: 12px;color: #fff;font-size: 15px;font-weight: 400;cursor: pointer;}
.top_btn.right button + button{margin-left:15px;}
.top_btn.right{position:absolute;top:16px;right:16px;}
.font_control{position:absolute;left:0;right:0;bottom: 75px;margin: 0 42px 0 43px;height:158px;border-radius:15px;background-color:#fff;box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);z-index: 100;}
.font_inner{padding: 30px 41px;}
.font_inner .box_tit{display:block;line-height: 1.07;font-weight:normal;text-align:center;}
.btn_pop_close{z-index:50; position:absolute;top:15px;right:18px;}
.font_bar{position:relative}
.font_level{margin-top:39px;width:100%;height:0;border: 1px solid #d7def8;}
.font_level:after{content:"";display:block;clear:both;}
.font_type{float:left;}
.font_type.fz1{position:relative;left: -2px;width:33.33%;}
.font_type.fz2{width:33.33%;}
.font_type.fz3{width:33.33%;}
.font_type.fz4{position: absolute;top: 1px;right: -3px;}
.font_type .bg_font{display:block;width:12px;height:12px;background-color: #d7def8;border-radius:50%;position: relative;top: -6px;}
.font_type .bg_font.on,.font_type .bg_font:hover,.font_type .bg_font:active{display:block;width:36px;height:36px;background:url(../images/txt_font_size.png) 0 0 no-repeat;background-size:contain;position: relative;top: -18px;left:-12px;}
.font_type.fz4 .bg_font.on,.font_type.fz4 .bg_font:hover,.font_type.fz4 .bg_font:active{left:13px;}
.font_inner .btn_control{position:absolute;height:20px;top:106px;left: 34px;bottom:2px;padding: 4px;}
.ico_minus{width:14px;height:4px;background-image:url(../images/ico_minus.png);position: relative;top: 5px;}
.ico_plus{width:13px;height:13px;background-image:url(../images/ico_plus.png);}
.font_inner .btn_zoom{left:auto;top:104px;right:33px;}
.dimmed_2{display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:100}
.layer_star{position:fixed;left:50%;top:50%;width:80%;background-color:#FFFFFF;padding:20px;border-radius:10px; -webkit-transform:translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform:translate(-50%,-50%);z-index:200;}
.layer_star_bx .tit{font-size:1.6rem;margin-bottom:30px}
.layer_star_bx .btn_close{position:absolute;right:0;top:5px;padding:15px;margin-right:5px;background-color:transparent;line-height:0;cursor:pointer}
.layer_star_bx .ico_close{width:15px;height:15px;background-image:url(../images/ico_close.png)}
.layer_star_bx .layer_cont{height:400px;font-size:1.4rem;line-height:17px;margin-bottom:15px;overflow-y:auto}
.layer_star_bx .btn_area{margin-bottom:0}
.star_wrap{text-align:center}
.star_wrap dt{margin-bottom:15px;font-size:1.4rem}
/*.star_wrap .star{color: #fff; font-size: 30px; align-items: center; justify-content: space-evenly; text-shadow: 1px 1px 0.2px black; cursor: pointer;}
.star_wrap .star.on{justify-content: space-evenly; text-shadow: 1px 1px 0.2px black;}*/
.star_wrap .star{width:30px;height:30px;display: inline-block;background: url("../images/ico_star_off.png") no-repeat right 0;background-size: auto 100%;text-indent: -9999px;cursor: pointer;}
.star_wrap .star.on{width:30px; height:30px; display: inline-block; background: url("../images/ico_star_on.png") no-repeat left!important;background-size: auto 100%;text-indent: -9999px;cursor: pointer; background-position:0 0!important;}
.inp_textarea_box{margin:20px 0;height:110px;border-radius:4px}
.inp_textarea_box .inp_textarea{padding:10px !important;width:100%;height:100%;font-size:12px;line-height:1.3;border:0 !important;background-color:#f5f5f5;resize:none;box-sizing:border-box}
.star_rating_box{margin-top:20px;font-size:0}
.survey_btn_area{margin-top:25px;text-align:center}
.survey_btn_area .btn_menu{margin:0;color:#333; width:100px; border:1px solid #fda614;}
.survey_btn_area .btn_menu+.btn_menu{margin-left:4px}
.ui-helper-hidden-accessible{display:block;};
/*map */
.dimmed_3{display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:100}
.layer_map{position:fixed;left:50%;top:50%;width:80%;background-color:#FFFFFF;padding:20px;border-radius:10px; -webkit-transform:translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform:translate(-50%,-50%);z-index:200;}
.layer_map_bx .btn_close{position:absolute;right:0;top:5px;padding:15px;margin-right:5px;background-color:transparent;line-height:0;cursor:pointer}
.layer_map img{max-height:calc(100% - 15px);margin-top:15px;}
.map_wrap{text-align:center}
.map_wrap div{margin-bottom:15px;font-size:1.4rem} /* 추가 수정 필요 */
.map_btn_area{margin-top:25px;text-align:center}
.map_btn_area .btn_menu{margin:0;color:#333; width:100px; border:1px solid #fda614;}
.map_btn_area .btn_menu+.btn_menu{margin-left:4px}

/* chat_cont */
.bot_wrap,.user_wrap{margin-bottom:15px;}
.bot_wrap{position:relative;max-width:93%;}
.bot_wrap.menu{max-width:100%;}
.bot_wrap:after{content:"";display:block;clear:both;}
.bot_wrap.carousel{max-width:100%;}
.bot_wrap.carousel .swiper-container{padding-bottom:10px; padding-top: 2px;float:left; height:60px; width:100%}
@media (max-width:499px) {
.bot_wrap.carousel .swiper-container{height: 70px;}	
}
.bot_box{margin:6px 0 0 0;}
.bot_box.next{display:inline-block;width: calc(100% - 60px);margin: 0 0 0 5px;}
.bot_box .logo.greeting{float:left; width:100px;}
.bot_box .bot_txt{float:left;background:#fff;padding: 10px 20px;border-radius: 0 15px 15px 15px;word-break: keep-all;min-width:150px;box-shadow: 0px 2px 2px #acbcd5;}
.bot_box .bot_txt.greeting{width: calc(100% - 172px)!important;margin-left:6px;}
.bot_box .bot_txt + .bot_txt{clear:both;margin-top: 5px;}
.chat_menu{clear:both;padding-top:6px;font-size:0;margin: 0 0 -5px -4px;}
.chat_menu:after{content:"";display:block;clear:both;}
.chat_menu li{display:inline-block;width:25%;/* height: 95px; */}
.chat_menu .icon_box{display: flex;flex-wrap: wrap;align-items: center;
    justify-content: center;margin: 0 0 5px 4px;padding: 8px 11px;border-radius: 15px;text-align:center;background: #fff;box-sizing: border-box;}
.icon_box .icon{display:block;width: 25px;height:25px;background-repeat:no-repeat;background-size:contain;margin: 4px;}
.icon_box .icon.m1{background-image:url(../images/ico_menu01.png);}
.icon_box .icon.m2{background-image:url(../images/ico_menu02.png);}
.icon_box .icon.m3{background-image:url(../images/ico_menu03.png);}
.icon_box .icon.m4{background-image:url(../images/ico_menu04.png);}
.icon_box .icon.ai{background-image:url(../images/ico_ai.png);}
.icon_box .m_txt{display:block;margin: 0 4px;font-size:13px;word-break: keep-all;line-height: 1.5;}
.notice_slide .item,
.top_notice .bn_th a,
.top_notice .bn_th:before {height: 60px;}
.notice_slide .item a {font-size: 12px;}

/*map */
.dimmed_3{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:100}
.layer_help{position:fixed;top:0;left:0;right:0;bottom:0;text-align:center;z-index:200}
.layer_help img{max-height:calc(100% - 15px);margin-top:15px;}
.layer_help .btn_close{position:absolute;left:0;top:5px;color:#fff;font-size:1.3rem;border-bottom:1px solid #fff;padding:10px;margin:5px 0 0 10px;background-color:transparent;cursor:pointer;}


/* 21-11-12 table */

.table-box{width:100%; min-width:250px; border-top: 1px solid #c4c4c4; border-bottom: 1px solid #c4c4c4; border-collapse: collapse;}
.table-box tr th {width:50%; border-bottom:1px solid #c4c4c4; font-weight:300; background-color:#f5f5f5; color:#888}
.table-box tr th, .table-box tr td{padding:10px; text-align:center;font-size:14px;}
.table-box tr th:last-child, .table-box tr td.num{border-left:1px solid #c4c4c4}
.table-box tbody tr:nth-child(2n){background-color:#f5f5f5;}
.table-box tr td.num i{width:10px; height:10px; display:inline-block; border-radius:50%; margin-right:10px}
.table-box tr td.num i.best{background-color:#2359c4}
.table-box tr td.num i.good{background-color:#01b56e}
.table-box tr td.num i.bad{background-color:#f5c932}
.table-box tr td.num i.worst{background-color:#da3539}


@media (max-width:532px){
 .table-box tr th, .table-box tr td{padding: 4px 0px; word-break: break-all;}
 }  


/*
.table-box{width:100%; font-size: 10px; border-top: 1px solid #c4c4c4; border-bottom: 1px solid #c4c4c4; border-collapse: collapse;}
.table-box td, .table-box th {border: 1px solid #ddd; padding: 8px;}
.table-box tr:nth-child(even){background-color: #f2f2f2;}
.table-box tbody tr:nth-child(even){background-color:#f5f5f5;}
.table-box tr:hover {background-color: #ddd;}
.table-box th {padding-top: 12px; padding-bottom: 12px; text-align: 1eft; background-color: #04AA6D; color: white}
*/
/*  ljw */
.content_box.hidden{display:none;}



/* @media (max-width:417px) {
	.icon_box .m_txt{display:block;margin-top: 10px;font-size:14px;line-height: 1.4;word-break: keep-all;}
}

@media (max-width:365px) {
	.icon_box .m_txt{display:block;margin-top: 10px;font-size:12px;line-height: 1.4;word-break: keep-all;}
} */


.icon_box:hover,.icon_box.on{cursor:pointer;}
/* .icon_box:hover .icon.m1, .icon_box.on .icon.m1{background-image:url(../images/ico_menu01.png);}
.icon_box:hover .icon.m2, .icon_box.on .icon.m2{background-image:url(../images/ico_menu02.png);}
.icon_box:hover .icon.m3, .icon_box.on .icon.m3{background-image:url(../images/ico_menu03.png);}
.icon_box:hover .icon.m4, .icon_box.on .icon.m4{background-image:url(../images/ico_menu04.png);}
.icon_box:hover .icon.m5, .icon_box.on .icon.m5{background-image:url(../images/ico_menu05_on.png);}
.icon_box:hover .icon.m6, .icon_box.on .icon.m5{background-image:url(../images/ico_menu06_on.png);}
 */
.btn_list{padding:10px 0px;font-size: 14px;}
.btn_list li + li{margin-top:5px;}
.btn_list .btn_txt{display:block;width:100%;height:35px;padding:8px 20px;line-height: 1.2;box-sizing:border-box;text-align:center;border-radius: 5px;box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);background-color: #fff;border: 1px solid #CCDDEF;}

.btn_list .side_box{position:fixed;top:76px;right:16px;width:50px;height:50px;box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2);background: url(../images/ico_exit.png) center no-repeat #21bab1;border-radius:50%;background-size: 22px;z-index: 150;cursor:pointer;}

.btn_list .btn_txt:active,.btn_list .btn_txt:hover, .btn_list li.on .btn_txt{color:#fff;font-weight:500;box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);background-color: #0C55C8;}
.btn_view{margin:12px 0px 5px;display:block;padding: 7px 10px 8px 11px;border-radius: 5px;box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);color:#458df3;background: #fff;position: relative;}
.btn_view:after{content:"";display: block;position: absolute;right: 10px;top: 11px;width: 11px;height: 10px;background-image: url(../images/ico_view.png);background-size:contain;}

.bot_box .bot_txt.parking{border-radius:15px;padding:15px 10px;}
.parking_form .tit{display:block;font-size:1.6rem;font-weight: 500;letter-spacing:-0.4px;line-height:1.13;color: #3f455c;text-align: center;}
.tbl_parking{margin-top:14px;width:100%;border-collapse:separate;border-spacing:0 5px;}
.tbl_parking th,td{padding:4px 0 5px 0;line-height: 1.29;}
.tbl_parking th{width:90px;height:29px;background-color: #e3e6f3;border-radius: 3px;box-sizing:border-box;font-weight:500;}
.tbl_parking td{padding-left:9px;}
.btn_form{width:100%;margin-top:10px;}
.btn_form li{float:left;width: 48.5%;}
.btn_form li:first-child{margin-left:0;}
.btn_form li + li{margin-left:5px;}
.btn_form li.on .btn, .btn_form .btn:hover,.btn_form .btn:active{box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);background:#458df3;color:#fff;}
.btn_form .btn{width:100%;height:35px;font-size:1.3rem;font-weight:500;border-radius:30px;background:#fff;line-height:1.31;letter-spacing: -0.33px;}

.img_box{margin:10px 0;min-width:246px;text-align: center;}
.img_box.only{margin:0;}
.img_box .img_answer{max-width:100%;width:auto !important;height:auto; object-fit: cover;}

/* 프로세싱 스타일 추가 */
.processing{margin:10px 0;min-width:100px;text-align:left;width:30px;height:10px;}
.processing.only{margin:0;}
.processing .img_processing{max-width:100%;width:auto !important;height:auto;}
.user_box .user_processing{max-width:94%;float: right;position:relative;background: #fff;border-radius: 15px 0 15px 15px;padding: 9px 10px 10px;line-height: 1.29;color: #fff;}

.menu_box{display:inline-block;vertical-align:top;background:#f5f6fa;border-radius:15px;box-sizing:border-box;width:260px;white-space:normal;} 
.menu_box .tit{height:37px;border-radius:15px 15px 0 0;background:#d9e0f8;padding:7px 0 8px 0;box-sizing:border-box;}
.menu_box .tit span{display:block;font-size:1.5rem;font-weight:500;text-align: center;line-height:22px;letter-spacing: -0.38px;}
.menu_box .keyword{margin:10px;}
.menu_box .keyword li{height:35px;}
.menu_box .keyword li > a{display:block;background:#fff;border-radius:30px;font-size:1.3rem;color:#3f455c;padding:7px 0 9px 0;line-height: 1.31;letter-spacing: -0.33px;text-align: center;}
.menu_box .keyword li > a:active,.menu_box .keyword li > a:hover, .menu_box .keyword li > a.on{box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);background-color: #458df3;color:#fff;font-weight:500;}
.menu_box .keyword li > a.more{border:1px solid #dde2f8;background-color: #eff1f9;box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);color:#364b91;font-weight: normal;}
.menu_box .keyword li + li {margin-top:5px;}
.time{clear:both;display:block;font-size:13px;line-height: 1.5;letter-spacing: -0.3px;color: #66656A;;padding-top: 4px;}
.main_time{clear:both;display:block;font-size:13px;line-height: 1.5;letter-spacing: -0.3px;color: #66656A;padding-top: 0px;}

.user_wrap::after{content:"";display:block;clear:both;}
.user_box .user_txt{max-width:87%;float: right;position:relative;background: #0C55C8;border-radius: 10px 0 10px 10px;padding:10px 20px;line-height: 1.4;color: #fff;word-break: break-all;margin-top: 10px;}
.user_box .user_txt + .user_txt{clear:both;margin-top:5px;}
.time.user{text-align:right;}

/* chat_bot*/
.card_wrap{width:90%; display:flex; margin-top:10px;height:250px;}
.card_wrap .card{position: relative; display:inline-block; margin-right:10px; margin-left:45px; padding:15px; border-radius:5px; background:#fff; white-space:normal; vertical-align:top;}
.card_wrap .card .card_tit{color:#666; width:210px; margin-bottom:10px; }
.card_wrap .card .card_tit p{font-size:1.7rem; color:#333; margin-bottom:3px; font-weight:800}

.category_area{clear:both; width:100%; padding-top:6px;padding: 9px 10px 0px 10px;font-size:0;white-space:nowrap; position:relative;}
.category_box{display:inline-block;width:230px;min-height:230px;border-radius:15px;background-color:#f5f6fa;vertical-align:top;overflow:hidden;}
.category_box+.category_box{margin-left:5px}
.category_box .category_tit{display:block;padding:10px 0;font-size:1.3rem;font-weight:500;background-color:#d9e0f8;text-align:center; overflow:hidden;letter-spacing: -0.38px;}
.category_list{padding:5px 13px 10px 15px}
.category_list .category_item{margin-top:5px}
.category_item .category_link{display:block;height:30px;width:200px;font-size:13px;background-color:#fff;border-radius:30px;text-align: center;line-height:30px}
.category_item .category_link:hover{color:#fff;background-color:#458df3; cursor:hand}
.category_item .category_more{border:1px solid #dde2f8;display:block;height:30px;width:200px;font-size:13px;color:#364b91;background-color:#eff1f9;border-radius:30px;text-align:center;line-height:30px;}
.category_item .category_more:hover{color:#fff;background-color:#458df3; cursor:hand}

.card_list{height: auto;
    padding-left: 5px;
    display: inline-block;
    width:480px;
    overflow:visible;
}
.ts-controls{
	width: 50%;
    text-align: center;
}

.ts-paging {
    margin: 0px 0 12px 60px;
}

.ts-paging-btn {
	display: inline-block;
	width: 20px;
	height: 10px;
	margin: 3px;
	font-size: 0px;
	line-height: 0;
	text-indent: -9999px;
	background: #f8fafd;
	border-radius: 10px;
}

.ts-paging-btn.ts-paging-active {
	/*background: #7f9ed4;*/
	background: #458df3;
}

.ts-controls {
	width: 100%;
	text-align: center;
}

.ts-paging {
	margin: 0px 0 12px 60px;
}

.sign_area {
    position: absolute;
    top: 90px;
    left: 90px;
    width: 360px;
    height: 54px;
    background: #f4f4f4;
    border-radius: 10px;
    padding: 12px 25px 15px 20px;
    z-index: 3;
    transition: left 300ms ease;
}

.sign_area_tog {
    position: absolute;
    top: 10px !important;
    z-index: 3;
}

.sign_area_lefttog {
    position: absolute;
    top: 90px;
    left: 33px !important;
    width: 360px;
    height: 54px;
    background: #f4f4f4;
    border-radius: 10px;
    padding: 12px 25px 15px 20px;
    z-index: 3;
}

.sign_area li {
    float: left;
    margin-left: 5px;
}

.sign_area li:first-child {
    float: left;
    margin-left: 0px;
}

.sign_1 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #000;
    color: #fff;
}

.sign_2 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #999;
    color: #fff;
}

.sign_3 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 10px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #009c7c;
    color: #fff;
}

.sign_4 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 10px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #fabe00;
    color: #fff;
}

.sign_5 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 10px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #e83525;
    color: #fff;
}

.sign_6 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 10px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #00a0e9;
    color: #fff;
}

.sign_7 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #999;
    color: #fff;
}

.sign_8 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 10px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #999;
    color: #fff;
}

.sign_9 {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding-top: 5px;
    line-height: 100%;
    font-family: Sp_r;
    font-size: 10px;
    text-align: center;
    background: #8b3c7e;
    color: #fff;
}

.sign_area .sign_on {
    cursor: pointer;
    float: right;
    margin-top: 5px;
    width: 40px;
    height: 24px;
    background: url("../images/sign_on.png") no-repeat;
}

.sign_area .sign_off {
    cursor: pointer;
    float: right;
    margin-top: 5px;
    width: 40px;
    height: 24px;
    background: url("../images/sign_off.png") no-repeat;
}

.con02_wrap .con {
        float: left;
        padding-top: 8px;
        width: 78px;
        height: 58px;
        border: 1px solid #e1e1e1;
        border-radius: 6px;
        text-align: center;
    }

.con02_wrap .con .txt01 {
        font-family: Sp_r;
        font-size: 12px;
        color: #333;
    }

.con02_wrap .con .txt02 {
        line-height: 15px;
        font-family: Sp_r;
        font-size: 18px;
        color: #0058a6;
    }

/* chat_bottom */
.bottom_inner{display: flex;}
.inp_box{display:flex;justify-content: space-between;
    align-items: center;width: 100%;padding:4.5px 15px; box-sizing:border-box;background:#fff;}
.inp_txt{width: 100%}
.inp_txt .inp{width: calc(100% - 24px);background: #fff;letter-spacing: -0.42px;color: #333;}
.auto_keyword{width: 100%;border-radius:15px 15px 0 0;border: solid 1px #e1e5f5;background-color: #ffffff;position: absolute;bottom: 50px;left: 0px;right: 0px;z-index: 100;font-size:14px;}
.ui-autocomplete li{box-sizing:border-box;}
.ui-autocomplete .search_link{display:block;height:35px;color: #3f455c;padding: 8px 15px 7px 15px;box-sizing: border-box;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height: 18px;}
.ui-autocomplete .search_link strong{color:#0C55C8;font-weight: 500;}
.ui-autocomplete .search_link:hover{background-color: #f5f6fa; cursor:pointer;border-radius:15px;}
.ui-autocomplete li.first .word:hover,.keyword_box li.first .word:active{border-radius:15px 15px 0 0;}
.ui-autocomplete li.last .word:hover,.keyword_box li.last .word:active{border-radius:0 0 15px 15px;}
.voice_wrap{position: absolute;bottom: 56px;left: 0;right: 0;height:264px;background-color: #f5f6fa;border-radius: 15px 15px 0 0;z-index: 100;}
.voice_box .tit{display:block;margin:25px auto 5px auto;
text-align: center;font-size: 1.8rem;font-weight: 500;line-height: 1.3;letter-spacing: -0.5px;}
.voice_box .tit_mike{display:block;text-align: center;color:#458df3;font-size: 1rem;font-weight: 500;letter-spacing: -0.5px;margin: 8px 0px 10px;}
.voice_box .timer{text-align: center;color:#458df3;font-size: 1rem;font-weight: 500;letter-spacing: -0.5px;margin: 8px 0px 10px;}
.mike_area{display:block;width:110px;height:110px;margin:0 auto;padding: 10px;box-sizing: border-box;border-radius:50%;}
.mike_area .btn_mike{display:block;width:90px;height:90px;border-radius: 50%;margin:0 auto;background:url(../images/ico_voice_mike.png
) center no-repeat #458df3;background-size:35px 50px;backface-visibility: hidden;

	-webkit-animation-name: animate;
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;	

	-moz-animation-name:  animate;
    -moz-animation-duration: 4s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;

	-o-animation-name: animate;
    -o-animation-duration: 4s;
    -o-animation-timing-function: linear;
    -o-animation-iteration-count: infinite;

	animation-name: animate;
    animation-duration: 4s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;		
	
}

@-webkit-keyframes animate{
	0%{ -webkit-box-shadow: 0 0 0 0 rgba(206,221,255,.8),0 0 0 0 rgba(206,221,255,.8);}	
	40%{ -webkit-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 0 rgba(206,221,255,.8);}	
	80%{ -webkit-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
	100%{ -webkit-box-shadow: 0 0 0 0 rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
}
@-moz-keyframes animate{
	0%{ -moz-box-shadow: 0 0 0 0 rgba(206,221,255,.8),0 0 0 0 rgba(206,221,255,.8);}	
	40%{ -moz-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 0 rgba(206,221,255,.8);}	
	80%{ -moz-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
	100%{ -moz-box-shadow: 0 0 0 0 rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
}

@-o-keyframes animate{
	0%{ -o-box-shadow: 0 0 0 0 rgba(206,221,255,.8),0 0 0 0 rgba(206,221,255,.8);}	
	40%{ -o-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 0 rgba(206,221,255,.8);}	
	80%{ -o-box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
	100%{ -o-box-shadow: 0 0 0 0 rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
}
@keyframes animate{
	0%{box-shadow: 0 0 0 0 rgba(206,221,255,.8),0 0 0 0 rgba(206,221,255,.8);}	
	40%{box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 0 rgba(206,221,255,.8);}	
	80%{box-shadow: 0 0 0 50px rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
	100%{box-shadow: 0 0 0 0 rgba(206,221,255,.0),0 0 0 30px rgba(206,221,255,0);}	
}

.btn_mike:hover .ico_mike{background-image:url(../images/ico_mike_on.png);}
/* .btn_send{position:absolute;top:17px;right:16px;} */
.btn_send:hover .ico_send{/* background-image:url(../images/ico_send_on.png); */cursor:pointer;}


/* guide_wrap */
.dimmed_1{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.75);z-index:150;}
.guide_wrap{position:fixed;left:50%;top:50%;width:80%;background-color:#FFFFFF;padding:20px;border-radius:10px; -webkit-transform:translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform:translate(-50%,-50%);z-index:200;}
.guide_wrap_bx .btn_close{position:absolute;right:0;top:5px;padding:15px;margin-right:5px;background-color:transparent;line-height:0;cursor:pointer}
.guide_wrap img{max-height:calc(100% - 15px);margin-top:15px;}
.guide_wrap1{text-align:left; margin-top:30px; }
.guide_wrap1 div{ margin-bottom:15px; font-size:1.4rem} /* 추가 수정 필요 */
.guide_btn_area{margin-top:25px;text-align:center}
.guide_btn_area .btn_menu{margin:0;color:#333; width:100px; border:1px solid #fda614;}
.guide_btn_area .btn_menu+.btn_menu{margin-left:4px}

/* loading */
.three-balls {margin: 10px auto 0; width: 60px; text-align: center;}
.three-balls .ball {margin: 0px 2px 0px; position: relative; width: 10px; height: 10px; border-radius: 50%; display: inline-block; -webkit-animation: bouncedelay 3.0s infinite cubic-bezier(.62, .28, .23, .99) both; animation: bouncedelay 3.0s infinite cubic-bezier(.62, .28, .23, .99) both; background: #006aee;}
.three-balls .ball1 {-webkit-animation-delay: -.16s; animation-delay: -.16s;}
.three-balls .ball2 {-webkit-animation-delay: -.08s; animation-delay: -.08s;}
@keyframes bouncedelay {
  0% {bottom: 0; background-color: #0e2787;}
  16.66% {bottom: 12px; background-color: #d0cef0;}
  33.33% {bottom: -5px; background-color: #2f1f94;}
  50% {bottom: -5px; background-color: #0e2787;}
  66.66% {bottom: -5px; background-color: #d0cef0;}
  83.33% {bottom: 12px; background-color: #2f1f94;}
  100% {bottom: 0; background-color: #0e2787;}
}
@-webkit-keyframes bouncedelay {
  0% {bottom: 0; background-color: #0e2787;}
  16.66% {bottom: 12px; background-color: #d0cef0;}
  33.33% {bottom: -5px; background-color: #2f1f94;}
  50% {bottom: -5px; background-color: #0e2787;}
  66.66% {bottom: -5px; background-color: #d0cef0;}
  83.33% {bottom: 12px; background-color: #2f1f94;}
  100% {bottom: 0; background-color: #0e2787;}
}



/*  2021-06-04  추가 시작 */
.ico_cursor{display:block;position:absolute;left:50%;bottom:33px;width:50px;height:40px;background:url(../images/ico_cursor.png) no-repeat;background-size:contain;margin-left:13px;-webkit-animation:click 2s infinite;
	animation: click 2s infinite;}
  @-webkit-keyframes click {
	0% {-webkit-transform:translate(0, 0)}
	20% {-webkit-transform:translate(15px, 15px)}
	40% {-webkit-transform:translate(0, 0)}
  }
  @keyframes click {
	0% {transform:translate(0, 0);}
	20% {transform:translate(15px, 15px);}
	40% {transform:translate(0, 0);}
  }
  .spinner{height:33px;margin:0 3px}
  .spinner > div{background-color:#fff;height:100%;width:2px;display:inline-block;margin:0 1px;-webkit-animation:voice 1.2s infinite ease-in-out;animation: voice 1.2s infinite ease-in-out}
  .spinner .rect2{-webkit-animation-delay: -1.1s;animation-delay: -1.1s}
  .spinner .rect3{-webkit-animation-delay: -1.0s;animation-delay: -1.0s}
  .spinner .rect4{-webkit-animation-delay: -0.9s;animation-delay: -0.9s}
  .spinner .rect5{-webkit-animation-delay: -0.8s;animation-delay: -0.8s}
  .spinner .rect6{-webkit-animation-delay: -0.7s;animation-delay: -0.7s}
  .spinner .rect7{-webkit-animation-delay: -0.6s;animation-delay: -0.6s}
  .spinner .rect8{-webkit-animation-delay: -0.5s;animation-delay: -0.5s}
  @-webkit-keyframes voice {
	0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
	20% { -webkit-transform: scaleY(1.0) }
  }
  @keyframes voice {
	0%, 40%, 100% {transform: scaleY(0.4);-webkit-transform: scaleY(0.4);}  
	20% { transform: scaleY(1.0);-webkit-transform: scaleY(1.0);}
  }
  .bounce{margin:5px}
  .bounce > div{width:12px;height:12px;margin:0 2px; background-color: #0C55C8;border-radius: 100%;display: inline-block;-webkit-animation: bouncedelay 1.4s infinite ease-in-out both;animation: bouncedelay 1.4s infinite ease-in-out both;
  }
  .bounce .ball1 {-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
  .bounce .ball2 {-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
  @-webkit-keyframes bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0) }
	40% { -webkit-transform: scale(1.0) }
  }
  @keyframes bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0);transform: scale(0);} 
	40% { -webkit-transform: scale(1.0);transform: scale(1.0);}
  }
  /*  2021-06-04  추가 끝 */
  	
/* 22-01 접이식버튼 */
.btn_list li.fold{margin: 0 0 10px 0;}
.btn_list .btn_txt.folding {background: #fff url(../images/ico_arrow_down.png) no-repeat 90% 50%;min-width: 300px;padding: 0 60px 0 40px;} 
.btn_list .btn_txt.folding.on {background: #458df3 url(../images/ico_arrow_up.png) no-repeat 90% 50%;} 
.btn_list .btn_txt.folding:hover{background: #458df3 url(../images/ico_arrow_down_white.png) no-repeat 90% 50%;}
.btn_list .btn_txt.folding.on:hover{background:#458df3 url(../images/ico_arrow_up.png) no-repeat 90% 50%;}
.content_box{margin-bottom:16px;}

/* 주메뉴 */
.menu-g{margin-top: 16px;}