@charset "utf-8";
/* CSS Document */

/* layout */
body{-webkit-text-size-adjust:none;background: #f9fbfb}
img{-ms-interpolation-mode:bicubic;}
.chat_wrap{width:100%;overflow-x:hidden;}
.chat_top{position:relative;background:#fff url(../img/bg_navbar.png) 0 0 repeat-x;z-index:100;padding:0 10px;height:135px;box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.23);}
.talk_wrap{padding:15px;margin-bottom:60px;}
.chat_bottom{position:fixed;bottom:0;width:100%;border-top:1px solid rgba(0,0,0,0.1);z-index:100;}

/* character_info */
.character_info{box-sizing:border-box;width:100%;padding:15px 0;height:240px;text-align:center;background: #41aafc; /* Old browsers */
background: -moz-linear-gradient(top,  #41aafc 0%, #165d94 100%); /* FF3.6-15 */ 
background: -webkit-linear-gradient(top,  #41aafc 0%,#165d94 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #41aafc 0%,#165d94 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#41aafc', endColorstr='#165d94',GradientType=0 ); /* IE6-9 */}
.character .img{position:relative;width:135px;height:135px;border-radius: 50%;background:url(../img/wp.png) center bottom  no-repeat rgba(28,60,143,.3);background-size: auto 90%; margin:0 auto;}
.character_info .txt{color:#fff;margin-top:10px;letter-spacing:-0.5px;}
.character_info .name{color:#fff;font-size:25px;font-weight:500;}

/* chat_top */
.chat_top h1{position:relative;height:48px;}
.chat_top h1 a >img{position:absolute;top:5px;opacity:0.35;height:38px;}
.chat_top .btn_list{width:200px;}
.chat_top .btn_group{margin-top:7px;box-sizing:border-box;width:136px;padding:5px;text-align:center;border-radius:20px;border: 1px solid rgba(255, 255, 255, 0.3);color:#fff;font-size:14px;}
.chat_top .btn_group .fa-minus, 
.chat_top .btn_group .fa-plus{width:40px;height:15px;}
.chat_top .question{float:none;padding-left:10px;padding-top:3px;font-size:26px;color:#6cb5ef;}
.chat_top .btn_close2{font-size:28px; padding-top:2px; color:white;}
.chat_top .menu_wrap{position:absolute;top:48px;width:calc(100% - 20px);height:87px;}
.chat_top .menu_list > a{display:block;float:left;width:18.4%;height:87px;text-align:center;color:#284c6e;font-size:15px;font-weight:500;letter-spacing:-0.5px;margin-right:2%;}
.chat_top .menu_list > a > .thum_wrap{width:50px;height:50px;margin: 5px auto 0 auto;}
.chat_top .menu_list > .main_menu01 > .thum_wrap{background:url(../img/m01.png) 0 0 no-repeat;background-size:contain;}
.chat_top .menu_list > .main_menu02 > .thum_wrap{background:url(../img/m02.png) 0 0 no-repeat;background-size:contain;}
.chat_top .menu_list > .main_menu03 > .thum_wrap{background:url(../img/m03.png) 0 0 no-repeat;background-size:contain;}
.chat_top .menu_list > .main_menu04 > .thum_wrap{background:url(../img/m04.png) 0 0 no-repeat;background-size:contain;}
.chat_top .menu_list > .main_menu05 > .thum_wrap{background:url(../img/m05.png) 0 0 no-repeat;background-size:contain;}

.sticky {position: fixed;top: 0px;width: calc(100% - 20px);}

/* talk_wrap */
.talk_wrap{overflow-x:hidden;overflow-y:auto;}
.chat_img{width:40px;height:40px;border-radius: 50%;background: url(../img/icon_bot.png) center bottom no-repeat #bbb;background-size: auto;}
.bot_wrap .tit{display:inline-block;padding:12px 0 0 10px;color:#666;font-size:14px;letter-spacing:-0.8px;}
.bot_cont{position:relative;float:left;max-width:88%;box-sizing:content-box;}
.bot_cont .box_txt{float:left;position:relative; padding: 10px;border-radius:12px;background: rgba(190,190,190,0.2);border: 1px solid rgba(190,190,190,0.3);font-size:15px;}
.time{position:absolute;bottom:0;right:-60px;font-size:12px;color:#888;}
.user_cont{position: relative;float:right;max-width: 88%;
box-sizing: content-box;font-size:15px;}
.user_cont .user_txt{float:right;position:relative; margin-left:5px; padding: 10px;border-radius:12px;background: #fdb3a0;border:1px solid rgb(253, 179, 160,0.3);}
.time.user{left:-60px;}
.btn_list li > a{display:block;background: #fff;border:1px solid #298cd9;border-radius: 12px;padding:8px 0;text-align:center;color: #298cd9;font-size:14px;}
.btn_list li > a.on,.btn_list li > a:hover{background:#0889e7;color:#fff;}
.btn_list.long li{margin-top:5px;}
.btn_list.short li{float:left;width:32%;margin-left:2%;}
.btn_list.short .go,
.btn_list.short .check,
.btn_list.short .send
{background:#0889e7;color:#fff;}
.btn_list.short .go:hover,
.btn_list.short .check:hover,
.btn_list.short .send:hover
{background:#3f9bdf;border: 1px solid #3f9bdf;}
.btn_list.short li.half{width:49%;}
.btn_list.popup{position:relative;left:55px;}
.bot_cont .more{width:100%;margin-top:5px;border:1px dashed rgba(0,0,0,0.4);color:rgba(0,0,0,.6);background:#fff;padding:8px 0;border-radius:12px;text-align:center;font-size:14px;}
.bot_cont .more .fa-plus{color: rgba(0,0,0,0.3);}
.bot_cont .warning{color:#fa2121;font-weight:600;}


/* chat_bottom */
.chat_ark{position:absolute;bottom:59px;left:15px;z-index:100; width:calc(100% - 92px);background:#fff;border:1px solid #ced4da;}
.chat_ark .list{height:215px;overflow-y:auto;}
.chat_ark .list li > a{width: calc(100% - 16px);padding: 7px 0 7px 16px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.chat_ark .list li > a:hover{background:rgba(108, 181, 239, 0.2);}
.chat_ark .list li > a > span{color: #0889e7;}
.new_btn_wrap{position:relative;padding:15px;height:35px;background:#a7d1eb;overflow:hidden;}
.btm_btn_list{width:2000px;height:40px;margin-left:20px;overflow:hidden;}
.btm_btn_list > a{box-sizing:border-box;display:inline-block;padding:0 8px;width:137px;height:35px;line-height:33px;margin-right:6px;text-align:center;background:#fff;border-radius:20px;border: 1px solid #18729f;color: #0071b6;overflow: hidden;text-overflow: ellipsis;
white-space: nowrap;font-size:15px;}
.btm_btn_list > a.on, .btm_btn_list > a:hover{background:#0d5f91;color:#fff;}
.pre_arrow{display:block;position: absolute;top:13px;
left:3px;width:18px;height:29px;padding:6px;text-align: center;background:#a7d1eb;font-size:28px;}
.pre_arrow .fa-angle-left{vertical-align:top;}
.next_arrow{display:block;position:absolute;top:13px;right:0;width:18px;height:29px;padding:6px;text-align:center;background:#a7d1eb;font-size:28px;}
.next_arrow .fa-angle-right{vertical-align:top;}
.chat_box{padding:15px;border-top: 1px solid rgba(0,0,0,0.1);background:#fff;}
.chat_write_box .write{width:calc(100% - 60px);padding-left:10px;height:45px;color:#333;border:1px solid #ced4da;}
input::-webkit-input-placeholder{ color:#999;}
input::-moz-input-placeholder{ color:#999;}
input:-ms-input-placeholder{color:#999 !important;}
.send_btn{display:block;padding:6px 12px;width:55px;height:45px;background:#0889e7;color:#fff;font-size:20px;}
.send_btn:hover{background-color:#6c757d;}

/* 자동완성 */

/* autocomplete */
.ui-autocomplete {
	/* left: -4px !important; */
	position: fixed;
	z-index: 1000;
	float: left;
	min-width: 160px; /* padding: 4px 0; */
	margin: 0 0 10px 20px;
	list-style: none;
	background-color: #ffffff;
	border: 1px solid #0770c8;
	/* border-radius: 5px; */
}

.ui-menu-item>a {
	white-space: nowrap;
	text-overflow: ellipsis;
	text-decoration: none;
	padding: 4px 0 4px 8px;
	color: #333;
	display: block;
	font-size: 16px;
}

.ui-menu-item>a{width: calc(100% - 16px);padding: 7px 0 7px 16px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.ui-menu-item>a:hover{background:rgba(108, 181, 239, 0.2);}
.ui-menu-item>a>span{color: #0889e7;}

.ui-state-active {
	background-color: rgba(108, 181, 239, 0.2);
}

.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.idea{margin-left: 70px;
    margin-top: 8px;
    font-size: 18px;
    color: white;}

.blinking{
	-webkit-animation:blink 1s ease-in-out infinite alternate;
    -moz-animation:blink 1s ease-in-out infinite alternate;
    animation:blink 1s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

.agree{
    display: block;
    position: fixed;
    border: 1px solid;
    width: 300px;
    height: 500px;
    right: 5px;
    background: white;
    left: 0;
    margin: auto;
    top: 20%;
    padding: 15px;
    overflow-y: scroll;
}

.agree p{
	font-size:16px;
}
.agree strong{
	font-size:16px;
    font-weight: 600;
}

/* pop_up : 만족도 조사 */
.pop_up.survey {display:none;}
.pop_up .mark_overlay{position:fixed;top:0;left:0;bottom:0;
right:0;background: #383838;z-index: 100;opacity: 0.8;}
.pop_up .cont{position:fixed;top:25%;left:48%;z-index:130; width:330px;height:490px;border-radius: 12px;background:#fff;border:1px solid #dfdfdf;margin:0 0 0 -158px;}
.pop_up .event_img{position:fixed;top:20%;left:45%;z-index:130;margin:0 0 0 -158px;}
.pop_up .cont .top{padding: 13px 15px;font-weight: bold;
border-bottom: 1px solid #dbdbdb;background: #f7f7f7;
line-height: 22px;border-radius: 12px 12px 0 0;}
.pop_up .site_survey .score{width:193px;height: 26px; margin:15px auto 10px;background:url(../img/star_bg.png) 0 0 no-repeat;}
.pop_up .score a{width:28px;height: 26px;display: block;margin-right:13px;float:left;}
.pop_up .score a > img{position:relative;top:-2px;}
.pop_up .score a.last{margin:0;}
.pop_up .score a .tit{position:absolute; left:-99999px; top:0; text-indent:-99999px; width:1px; height:1px; font-size:0; line-height:0;}
.cont .tit{color:#0889e7;font-weight:500;padding:0 15px;font-size:15px;}
.cont .tit.system + p{font-size:14px;text-align:center;padding-top:10px;}
.cont textarea{width:285px;height:70px;margin: 10px 15px 18px 15px;padding:5px;overflow-y:auto;}
.site_survey.answer{margin:18px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:15px 0;}
/* rating */
#score a.on {background: url(../img/icon_star_b.png) no-repeat;}
#score2 a.on {background: url(../img/icon_star.png) no-repeat;}


/* pop_up : 위피톡 오픈 이벤트 */
.pop_up.event {display:none;}
.pop_up.event .cont{height:438px;}
.cont .top .close{font-size:20px;}
.cont .top .close > .fa-times{color:#ccc;}
.personal_info > input[type="text"]{box-sizing: border-box;margin: 0 15px;width:calc(100% - 30px);border: 1px solid #dcdcdc;height:35px;font-size:14px;}
.personal_info .choice_chk{margin:10px 15px 0 15px;font-size:14px;}
.personal_info .choice_chk input[type="checkbox"]{display:none;}
.personal_info .choice_chk input[type="checkbox"] + label span{position:relative;top:2px;display:inline-block;width:15px;height:15px;margin:-2px 10px 0 0;background:url(../img/btn_checkbox.png) 0 0 no-repeat;}
.personal_info .choice_chk input[type="checkbox"]:checked + label span{background-position: 0 -15px;}
.personal_info .choice_chk input[type="checkbox"]:checked + label{color: #0876d3;}
.talk textarea{height:85px;}
.btn_list.short .send{position:relative;left:100px;}

/* pop_up : 개인정보 수집/이용 동의 */
.pop_up.info .cont{top:60%;margin: 0 0 0 -144px;width:305px;height:302px;}
.pop_up.info .cont .top{background:#284c6e;color: #fff;}
.pop_up.info .cont .top .fa-times{color:#fff;}
.pop_up.info .info_txt{box-sizing:border-box;height:250px;padding:10px 0;overflow-y:auto;}
.pop_up.info .info_txt .sub{font-size:14px;padding:0 15px;}

/* develop_sch : 발전용어 검색 */
.develop_sch .sch_top{position:fixed;top:0;width:100%;
z-index: 10;background-color:#fff;border-bottom: 1px solid #0889e7;}
.sch_top h1{width: calc(100% - 30px);height:55px;line-height:55px;
font-size:20px;color:#333;text-align:center;padding:0 15px;}
.sch_top .logo{font-weight:bold;}
.sch_top .logo > img{position:relative;top:-5px;margin-right:8px;width:62px;}
.sch_cont{position:absolute;top:70px;width:calc(100% - 30px);padding:0 15px;}
.sch_top .btn_close{font-size:22px;color:#165d94;}
.search .search{width: calc(100% - 42px);height:45px;border:1px solid #ced4da;}
.search .btn_search{display:block;width:42px;height:45px;line-height: 38px;background:#b5b5b5;text-align:center;cursor: pointer;}
.term_area .tit{font-size:17px;font-weight:bold;margin-bottom:15px;}
dt, dd {padding:10px;}
dt {display: block;line-height:45px;
background:#f7f8fa;padding: 0 10px;border-bottom: 1px solid #ddd;
text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.3);font-weight:bold;
cursor: pointer;}
dt:hover, dt.on {background: #0889e7;color: #fff;}
dd {display: none;border-bottom: 2px solid #0889e7;
padding: 10px;color: #666;}
.term_btn_list{width:210px;margin:0 auto;}
.term_btn_list > li{margin-left:10px;}
.term_btn_list > li > a{display: block;width:98px;background: #fff;
border: 1px solid #298cd9;border-radius: 12px;padding: 8px 0;
text-align: center;color: #298cd9;font-size: 14px;}
.term_btn_list > a.on,  
.term_btn_list li > a:hover{background:#0889e7;color:#fff;}
.term_btn_list .btn_more{background: #0889e7;color: #fff;}
.term_btn_list .btn_more.on,.term_btn_list .btn_more:hover{background:#3f9bdf;border: 1px solid #3f9bdf;}

/* pop_up : 챗봇 사용법 */
.pop_up.coach_mark .mark_cont{position:fixed;top:0px;z-index:150;display:none;}
.pop_up.coach_mark .mark_cont .btn_pre_arrow{
position:absolute;top:370px;left:17px;}
.pop_up.coach_mark .mark_cont .btn_next_arrow{
position:absolute;top:370px;right:17px;}
.pop_up.coach_mark .btn_close{position:absolute;bottom:76px;left:201px;z-index:150;width:90px;height:30px;line-height:30px;border-radius:5px;background:#0889e7;color:#fff;text-align:center;}

/* pop_up : 이벤트결과 발표 */
.pop_up1.coach_mark1{display: none;}
.pop_up1.coach_mark1 .mark_cont1{position:fixed;top:25%;left:53%;z-index:130; width:300px;height:430px;border-radius: 12px;background:#fff;border:1px solid #dfdfdf;margin:0 0 0 -158px;}
/*.pop_up1.coach_mark1 .mark_cont1{position:fixed;top:0px;z-index:150;display:none;}*/
.marks_btn1{    position: absolute;
    top: 400px;
    left: 100px;}
.pop_up1 .mark_overlay{position:fixed;top:0;left:0;bottom:0;
right:0;background: #383838;z-index: 100;opacity: 0.8;}
.pop_up1.coach_mark1 .mark_cont1 .btn_pre_arrow1{
position:absolute;top:210px;left:-30px;}
.pop_up1.coach_mark1 .mark_cont1 .btn_next_arrow1{
position:absolute;top:210px;right:-30px;}
.pop_up1.coach_mark1 .btn_close1{position:absolute;left:43%;top:55%;z-index:150;width:90px;height:25px;line-height:25px;border-radius:5px;background:gray;color:#fff;text-align:center;}