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

/* layout */
.chat_wrap{width:100%;overflow-x:hidden;}
.chat_top{position: relative;height:55px;box-sizing:content-box;padding:0 15px;}
.talk_wrap{position: absolute;top:55px;bottom:50px;width:calc(100% - 30px);padding: 15px;overflow-x: hidden;overflow-y: auto;background:#f4f4f4;box-shadow: 0 1px 4px #382a10;}
.bot_wrap{margin-bottom:15px;}
.bot_wrap:after{content:"";display:block;clear:both;}
.user_wrap{margin-bottom:15px;}
.user_wrap:after{content:"";display:block;clear:both;}
.chat_bottom{position:fixed;bottom:0;z-index:100;width:calc(100% - 30px);height:50px;line-height:48px;padding:0 15px;z-index: 100;background: #fff;}

/* chat_top */
.chat_top h1{float:left;width:calc(100% - 30px);font-size:1.8rem;font-weight:bold;text-align:center;line-height:53px;}
.chat_top h1 > img{width:52px;padding-right:10px;vertical-align:text-bottom;}
.chat_top .question{font-size:2rem;color:#666;line-height:55px;position: absolute;right: 48px;}
.chat_top .close{float:right;font-size:2rem;color:#666;line-height:55px;position: absolute;right: 25px;}


/* talk_wrap */
.bot_wrap .bot_img{position:absolute;left:0;width:38px;height:38px;background:url(../img/bot_img.png) 0 0 no-repeat;background-size: contain;}
.bot_wrap .bot_cont{position:relative;float:left;max-width:89%;box-sizing:content-box;}
.bot_wrap .bot_cont button{padding:5px;text-align:center;border-radius:30px;background: #35a6d2;width: calc(100% - 40px);color: #fff;font-size: 15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:40px;}
.bot_wrap .bot_cont button{padding:5px;text-align:center;border-radius:30px;background: #35a6d2;    width: calc(100% - 40px);color: #fff;font-size: 15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:40px;}
.bot_wrap .bot_cont button{padding:5px;text-align:center;border-radius:30px;background: #35a6d2;    width: calc(100% - 40px);color: #fff;font-size: 15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:40px;}
.bot_wrap .bot_cont .logo_txt{background: url(../img/info_logo.png?version=202508121020) 3px center no-repeat;
background-size: 55px;color: #3d4754;font-size: 1.6rem;font-weight: bold;padding-left: 70px;margin-bottom: 8px;}
.bot_wrap .bot_cont .logo_txt strong{font-size:1.6rem;color:#3d4754;display: block;margin-bottom:6px;}
.bot_wrap .bot_cont .box_txt{overflow-x: hidden;position: relative;margin-left:45px;border:1px solid #dfdfdf;border-radius:0 13px 13px 13px;background:#fff;padding:13px 15px;letter-spacing:-0.25px;}
.bot_wrap .bot_cont .box_txt.m0{margin-left:0;}
.bot_wrap .time{display:block;clear:both;font-size:1.2rem;color:#999;padding: 3px 0 0 45px;}
.bot_wrap .time.p0{padding-left:0;}

.bot_wrap .btn_list{clear:both;padding-top:8px;}
.bot_wrap .btn_list li{box-sizing:border-box;height:30px;/* line-height: 28px; */border:1px solid #ffaa18;border-radius:30px;text-align:center;background:#fff;margin-top:6px;color:#ffa200;box-shadow: 0 2px 3px #e7e7e7;}
.bot_wrap .btn_list li:first-child{margin-top:0;}
.bot_wrap .btn_list li > a{display:block;line-height: 30px;}
.bot_wrap .btn_list li > a:hover,
.bot_wrap .btn_list li > a.on{background:#ffa200;color:#fff;border-radius: 30px;font-weight:bold;}

.bot_wrap .banner_wrap{position: relative;padding: 10px 0 0 45px;height:197px;clear:both;overflow:hidden;}
.banner_wrap:after{content: '';position: absolute;top: 0;right:-20px;bottom:0;z-index:10;width:25px;
background:#f4f4f4;}
.bot_wrap .banner_wrap > a{display:block;width:25px;height:30px;line-height:30px;font-size:2rem;text-align:center;background:#ffbe63;color: #fff;border-radius:4px;}
.bot_wrap .banner_list{width:990px;}
.bot_wrap .banner_list > li{display:inline-block;float:left;box-sizing:border-box;width:190px;height:197px;border:1px solid #d7d7d7;border-radius:15px;background:#fff;margin-left:10px;}
.bot_wrap .banner_list > li:first-child{margin-left:0;}
.bot_wrap .banner_list > li .tit{height:35px;line-height:33px;background:#ffa200;    
border-radius: 8px 8px 0 0;color:#fff;padding:0 10px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.bot_wrap .banner_list .keyword{padding:8px;box-sizing:content-box;}
.bot_wrap .banner_list .keyword li{height:30px;line-height:30px;border-radius:5px;background:#f2f2f2;text-align:center;margin-top: 5px;border: 1px solid #dedede;box-shadow: 0 2px 3px #e9e9e9;}
.bot_wrap .banner_list .keyword li:first-child{margin-top:0;}
.bot_wrap .banner_list .keyword li > a{display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding: 0 10px;}
.bot_wrap .banner_list .keyword li > a:hover{text-decoration:underline;}

.btn_wrap{padding-top:8px;margin-left: 20px;}
.btn_wrap:after{content:"";clear:both;display:block;}
.menu_wrap{clear:both; margin-right: -50px;}
.menu_wrap + .menu_wrap{padding-top: 6px;}
.menu_wrap li{float:left;width: 19%;border: 1px solid #ded8d4;border-radius:8px;background:#fff;margin-left: 6px;font-size: 1.3rem;text-align:center;font-weight:500;height:75px;box-shadow: 0 1px 2px 0 rgba(56, 42, 16, .25);}
.menu_wrap li.bg_icon1{background:url(../img/icon_b1.png) center 10px no-repeat #fff;background-size: 40px 33px;}
.menu_wrap li.bg_icon2{background:url(../img/icon_b2.png) center 10px no-repeat #fff;background-size:33px;}
.menu_wrap li.bg_icon3{background:url(../img/icon_b3.png) center 10px no-repeat #fff;background-size: 36px 32px;}
.menu_wrap li.bg_icon4{background:url(../img/icon_b4.png) center 10px no-repeat #fff;background-size: 34px;}
.menu_wrap li.bg_icon5{background:url(../img/icon_b5.png) center 10px no-repeat #fff;background-size: 33px;}
.menu_wrap li.bg_icon6{background:url(../img/icon_b6.png) center 10px no-repeat #fff;background-size: 32px;}
.menu_wrap li.bg_icon7{background:url(../img/icon_b7.png) center 10px no-repeat #fff;background-size: 35px;}
.menu_wrap li.bg_icon8{background: url(../img/icon_b8.png) center 10px no-repeat #fff;background-size: 33px;}

.menu_wrap li:first-child{margin-left:0;}
.menu_wrap li > a{display:block;color:#ff7901;height: 76px;box-shadow: inset 0 -1px 3px rgba(197,196,195,0.66);border-radius: 8px;box-sizing: border-box;padding-top: 46px;line-height: 26px;}
.menu_wrap li > a > span{display:block;}
.menu_wrap li > a > span.one{height:36px;line-height:36px;}
.input_box{width:100%; height:37px;margin-top:10px;}
.input_box input[type="text"]{float:left; width:calc(100% - 60px); height:35px; resize:none; font-size:14px;word-break: break-all;border: 1px solid #dcdcdc; color: #555; padding-left:5px; }
.input_box a{display: inline-block; width:60px; line-height:35px; text-align:center; background-color:#ffa200; color:#fff;}

.bot_wrap .indent_wrap{width:88%;clear:both;padding: 10px 0 0 45px;}
.bot_wrap .indent_box li{float:left;box-sizing: border-box;height:30px;line-height: 28px;
border: 1px solid #ffaa18;border-radius: 30px;text-align: center;background: #fff;color: #ffa200;
margin:0 7px 6px 0;}
.bot_wrap .indent_box li:first-child{margin-left:0;}
.bot_wrap .indent_box li > a{padding:0 15px;}
.bot_wrap .indent_box li > a:hover,
.bot_wrap .indent_box li > a.on{background:#ffa200;color:#fff;border-radius:30px;}

.bot_wrap .tbl_tit{margin: 10px 0 8px 0;font-size: 1.5rem;font-weight: bold;}
.bot_wrap .tbl_type > table{width:100%;}
.bot_wrap .tbl_type thead td{background:#1c89cb; color:#fff; border-right:1px solid #dcdcdc; text-align:center; padding:10px 10px;}
.bot_wrap .tbl_type thead th{background: #f4f4f4;text-align:center;border-top: 2px solid #dfdfdf;border-right: 1px solid #dfdfdf;border-bottom:1px solid #dfdfdf;padding: 6px 10px;}
.bot_wrap .tbl_type table td{text-align:center;padding: 5px 9px;border-bottom: 1px solid #dfdfdf;border-right: 1px solid #dfdfdf;}
.bot_wrap .tbl_type table td.last{border-right:none;}
.bot_wrap .tbl_type table td .color{color:#0000ff;}
.bot_wrap .tbl_type table td .num{display:block;font-size:1.3rem;}
.bot_wrap .tbl_type.col{border-top: 2px solid #dfdfdf;}
.bot_wrap .tbl_type.col table th{background: #f4f4f4;text-align:center;;border-bottom:1px solid #dfdfdf;padding: 6px 10px;}
.bot_wrap .tbl_type.col table th + td{text-align:left;}
.bot_wrap .btn_more{display: block; padding:0 10px; height:30px; line-height:30px; font-size:14px; text-align:center;border-radius:30px;margin-top: 10px;background: #ffa200;color: #fff;font-weight:bold;}
.bot_wrap .btn_more .fa-angle-down,.fa-angle-up{font-size: 1.6rem;margin-left: 8px;}   

.user_wrap .user_txt{position:relative;float:right;max-width:85%;border-radius: 13px 0 13px 13px;background:#ff7901;color:#fff;padding:8px 14px;letter-spacing:-0.25px;}
.user_wrap .time.user{float:right;clear:both;font-size:1.2rem;color:#999;padding-top: 3px;}

/* 자동 완성 기능 : chat_ark*/
.chat_ark{position: absolute;bottom:50px;z-index: 90;width:100%;background: #fff;border: 2px solid #ffa200;box-sizing: border-box;border-radius: 10px 10px 0 0;display:none;}
.chat_ark .list{margin-bottom:10px;}
.chat_ark .list li > a{display:block;border-bottom: 1px dotted #ff9600;padding: 6px 15px;}
.chat_ark .list li a:hover{background:#ffe0b3;}
.chat_ark .list li:first-child a:hover{border-radius: 10px 10px 0 0;}
.chat_ark .list li a > span{color:#ff9600;font-weight: bold;}

/* chat_bottom */
.chat_box .font_box{position:relative;float:left;}
.chat_box .font_box .b_font{width: 34px;}
.chat_box .font_box .s_font{position:absolute;top: 2px;left: 28px;width: 25px;}
.chat_box .font_box img{max-width:100%;}

.chat_box .chat_write_box{float:right;width:calc(100% - 73px);}
.chat_box .chat_write_box .write{position:relative;top:-2px;width: calc(100% - 37px);height: 40px;}
.chat_box .chat_write_box .send_btn{border:none;float:right;line-height: 46px;}
.chat_box .chat_write_box .send_btn > img{width:28px;}

/*  coach_marks */
.marks_overlay .coach_marks{position: absolute;top: 55px;left: 0;bottom: 50px;right: 0;background:#383838;z-index: 100;opacity: 0.8;}
.marks_overlay .mark_cont .mark_banner{position: absolute;top: 50%;left: 50%;margin: -235px 0 0 -140px;z-index: 100;}
.marks_overlay .mark_cont .mark_banner li > img{width: 285px;}
.marks_overlay .btn_close{position: absolute;bottom: 76px;z-index: 130;width: 100%;text-align: center;}
.marks_overlay .btn_close > a{display:block;width: 82px;height: 25px;line-height: 25px;color: #fff;font-weight:bold;border-radius:8px;margin: 0 auto;text-align:center;border: 1px solid #fff;}