@charset "utf-8";

/* Font */
@font-face{
    font-family:NotoSansB;
    src:url(../../font/NotoSansKR-Bold.eot);
    src:local('※'), url(../../font/NotoSansKR-Bold.woff) format('woff');
}
@font-face{
    font-family:NotoSansM;
    src:url(../../font/NotoSansCJKkr-Medium.eot);
    src:local('※'), url(../../font/NotoSansCJKkr-Medium.woff) format('woff');
}
@font-face{
    font-family:NotoSans;
    src:url(../../font/NotoSansCJKkr-Regular.eot);
    src:local('※'), url(../../font/NotoSansCJKkr-Regular.woff) format('woff');
}
@font-face{
    font-family:Roboto;
    src:url(../../font/Roboto-Regular.eot);
    src:local('※'), url(../../font/Roboto-Regular.woff) format('woff');
}
@font-face{
    font-family:RobotoM;
    src:url(../../font/Roboto-Medium.eot);
    src:local('※'), url(../../font/Roboto-Medium.woff) format('woff');
}
@font-face{
    font-family:RobotoB;
    src:url(../../font/Roboto-Bold.eot);
    src:local('※'), url(../../font/Roboto-Bold.woff) format('woff');
}

/* Layout */
#divWrapper{position: relative;}
* {letter-spacing: -0.04em;font-family:NotoSans, sans-serif; font-size: 15px;}
option{font-family:NotoSans;}
.header1, .header2 > div, #divTopMenu > ul > li .menuContent, .footerMenu{ width: 1240px; margin: 0 auto;}

/* 상단고정 */
.header2.fixed{position: fixed; top: 0; left: 0; width: 100%; z-index: 198; background: #fff; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 5px;}
.header1.fixed{margin-bottom: 80px;}
.insideSearch.fixed{position: fixed; top: 0 !important;}

/* PC와 테블릿 사이 */
@media screen and (min-width:720px) and (max-width: 1340px){
    .header1, .header2 > div,#divTopMenu > ul > li .menuContent, .footerMenu{width: auto; margin: 0 20px;}
}
@media screen and (max-width: 719px){
    .header1, .header2 > div,#divTopMenu > ul > li .menuContent, .footerMenu{width: auto; margin: 0 10px;}
}
@media screen and (max-width: 319px){
    .header1, .header2 > div,#divTopMenu > ul > li .menuContent, .footerMenu{ width: auto; margin: 0 5px;}
}

/* header1 */
.header1{height: 93px; display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.header1 h1 a{display: block; width: auto; height: 60px; line-height: 60px; color: #231f20 !important; font-size: 22px; font-family:NotoSansB, sans-serif;  -webkit-transition: 0.3s; transition: 0.3s;}
.header1 h1 a img{width: auto; height: 100%; display: inline-block; vertical-align: top; margin-right: 5px;}
.header1 .globalMenu > ul{position: relative;}
.header1 .globalMenu > ul > li {margin-left: 25px; vertical-align: middle;}
.header1 .globalMenu > ul > li:first-of-type{margin-left: 0;}
.header1 .globalMenu > ul > li a{color: #555;}
.header1 .globalMenu > ul > li{display: inline-block;}
.header1 .globalMenu > ul > li.login > p{display: inline-block; color: #555;}
.header1 .globalMenu > ul > li.login > p span{display: inline-block; color: #555;}
.header1 .globalMenu > ul > li.login > a{display: inline-block; color: #555; margin-left: 25px; padding-left: 25px; background: url(../../../image/ko/loginIcon.png) no-repeat left center;}
.header1 .globalMenu > ul > li.profile .myMenuBtn{position:relative;color: #fff !important;padding: 3px 13px 3px 31px; display: block; background: #006951 url(../../../image/ko/myMenuIcon.png) no-repeat left 13px center; border-radius: 15px;}
.header1 .globalMenu > ul > li.profile .myMenuBtn .newMyMenu {position:absolute;top:-6px;right:-6px;width:17px;height:17px;border-radius: 100%;line-height: 17px;background:#d10046;color:#fff;font-size:11px;font-family:Roboto,sans-serif;text-align: center;text-indent: 0;}
.header1 .globalMenu > ul > li.language select{width: 55px; padding-left: 5px; color: #555; background: url(../../../image/ko/moreSiteBtn.png) no-repeat right 5px top 9px; border: none;}

.header1 .globalMenu > ul > li.standardApply > a {color: #ca450a;}

@media screen and (max-width: 1024px){
    .header1{height: 45px;}
    .header1 h1 a{height: 41px; font-size: 15px; line-height: 41px;}
    .header1 .globalMenu > ul > li {margin-left: 5px;}
    .header1 .globalMenu > ul > li.login > p{display: none;}
    .header1 .globalMenu > ul > li.login > a{text-indent: -9999px; width: 18px; height: 28px; background: url(../../../image/ko/loginIcon.png) no-repeat center; margin-left: 0; padding-left: 0;}
    .header1 .globalMenu > ul > li.profile .myMenuBtn{text-indent: -9999px; border-radius: 50%;  background: #006951 url(../../../image/ko/myMenuIcon.png) no-repeat center; width: 30px; height: 30px; padding: 0;}
    .header1 .globalMenu > ul > li.profile .myMenuBtn .newMyMenu {top:-4px}
}
@media screen and (max-width: 719px){
    .header1 {height:auto;padding:2px 0}
}
@media screen and (max-width: 500px){
    .header1{margin: 0 5px;}
    .header1 h1 a{font-size: 14px;}
    .header1 .globalMenu > ul > li {margin-left: 0px;}
}
@media screen and (max-width: 450px){
    .header1 .globalMenu {width:145px;text-align:right;}
    .header1 .globalMenu > ul > li > a {text-align:left}
    .myMenuArea {text-align:left}
}
/* header1 */
/* 요약정보 */
.myMenuArea{display: none; position: absolute; top: 38px; right: 0; width: 450px; border: 1px solid #e8eaed; background: #f5f5f5;box-shadow: 4px 6px 18px 0px rgba(0, 0, 0, 0.23); z-index: 199;}
.myMenuListW .myInfo { padding: 22px 25px 15px 20px; background: #fff; border-bottom: 1px solid #e8eaed;}
.myMenuListW .myInfo .infoTit{height: 40px; line-height: 40px; padding-left: 55px; background: url(../../../image/ko/myInfoIcon.png) no-repeat left center; font-size: 18px; color: #2f2f2f;}
.myMenuListW .myInfo .infoTit .userId{color: #222; font-size: 18px; }
.myMenuListW .myInfo .summary{padding-left: 55px;}
.myMenuListW .myInfo .summary li{padding-left: 8px; color: #7c7c7c; line-height: 24px; position: relative;}
.myMenuListW .myInfo .summary li::after{display: block; content: ''; width: 4px; height: 1px; background: #7c7c7c; position: absolute; left: 0; top: 12px;}
.myMenuListW .myInfo .summary li a{color: #7c7c7c;}
.myMenuListW .myInfo .summary li #mynoticeCount{color: #d71212;}
.myMenuListW .myInfo .summary li #overdueCount{color: #d71212;}
.myMenuListW .myMenuList {margin: 10px 0; background: #fff; padding: 0px 10px 0px 10px; border-top: 1px solid #e8eaed; border-bottom: 1px solid #e8eaed;}
.myMenuListW .myMenuList ul li > span{display: block; padding-top: 13px; padding-bottom:12px; padding-left: 30px;}
.myMenuListW .myMenuList ul li:not(:last-of-type) > span{border-bottom: 1px solid #e9e9e9;}
.myMenuListW .myMenuList ul li > span .myMenuTit{margin-bottom: 5px; display: block;color: #3d3d3d; font-size: 16px;}
.myMenuListW .myMenuList ul li > span a.myMenuStatus{margin-right: 23px; padding-left: 8px; color: #787878; position: relative;}
.myMenuListW .myMenuList ul li > span a.myMenuStatus::after{display: block; content: ''; width: 4px; height: 1px; background: #787878; position: absolute; left: 0; top: 12px;}
.myMenuListW .myMenuList ul li > span a.myMenuStatus span{color: #d71212;}
.myMenuListW .myMenuList2 {background: #f7f7f7; padding: 25px 0 25px 40px; border-top: 1px solid #e8eaed;}
.myMenuListW .myMenuList2 ul li span .myMenuTit{display: block;color: #3d3d3d; font-size: 16px;}
.myMenuListW .myMenuList2 ul li span a.myMenuStatus{display: block; margin-top: 12px; padding-left: 8px; color: #373737; position: relative;}
.myMenuListW .myMenuList2 ul li span a.myMenuStatus::after{display: block; content: ''; width: 4px; height: 1px; background: #373737; position: absolute; left: 0; top: 12px;}
.myMenuArea .close{position: absolute; right: 25px; top: 27px; width: 14px; height: 14px; background:  url(../../../image/ko/myMenuClose.png) no-repeat center; text-indent: -9999px;}
@media screen and (max-width: 1024px){
    .myMenuArea{top: 32px;}
}
@media screen and (max-width: 470px){
    .header1 .globalMenu > ul{position: static;}
    .myMenuArea{width: 100%; left: 0; top: 36px;}
    .myMenuListW .myInfo{padding: 22px 10px 15px 10px;}
    .myMenuListW .myInfo .infoTit{font-size: 17px;}
    .myMenuListW .myInfo .infoTit .userId{font-size: 17px;}
    .myMenuArea .close{right: 10px; top: 10px;}
    .myMenuListW .myMenuList ul li > span{padding-left: 10px;}
    .myMenuListW .myMenuList ul li > span a.myMenuStatus{margin-right: 10px;}
    .myMenuListW .myMenuList2{padding: 15px 0 15px 20px;}
}
/* 요약정보 */

/* .header2 */
.header2{border-top: rgba(255, 255, 255, 0.2) solid 1px; border-bottom: rgba(255, 255, 255, 0.2) solid 1px; height: 74px; position: relative; box-sizing: border-box;}
.header2 > div{height: 100%;}
.header2 .mobileLoginInfo{display: none; font-size: 16px; color: #fff;}
.header2 .mobileLoginInfo span{font-size: 16px;}
#divTopMenu{height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#divTopMenu > ul{width: 1140px; display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#divTopMenu > ul > li > a{display: block; color: #fff; font-size: 19px; font-family:NotoSansM, sans-serif; position: relative; height: 74px; line-height: 74px;}
#divTopMenu > ul > li > a::before{content:''; display:block;position:absolute;top:0px;left:50%;right:50%;height:3px;-webkit-transition:.3s; -ms-transition:.3s; transition:.3s;}
#divTopMenu > ul > li.on > a::before{left: 0; right: 0;}
#divTopMenu > ul > li > div{display: none; position: absolute; left: 0; top: 73px; z-index: 21;width: 100%;background: #fff;}
#divTopMenu > ul > li .menuContent{padding-top: 30px; padding-bottom: 90px;}
#divTopMenu > ul > li .menuContent > ul{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
#divTopMenu > ul > li .menuContent > ul > li{width: 100%;}
#divTopMenu > ul > li .menuContent > ul > li:not(:last-of-type){margin-right: 10px;}
/*#divTopMenu > ul > li .menuContent > ul > li > a{padding: 6px 0 0 17px; color: #444; font-size: 17px; display: block; max-width: 230px; height: 42px; border: 2px solid #e5e7ee; border-radius: 7px; box-sizing: border-box;-webkit-transition: 0.3s; transition: 0.3s;}*/
#divTopMenu > ul > li .menuContent > ul > li > a{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center;-webkit-box-pack: justify; -ms-flex-pack: justify;justify-content: center;padding: 0; color: #444; font-size: 14px; max-width: 230px; height: 42px; border: 2px solid #e5e7ee; border-radius: 7px; box-sizing: border-box;-webkit-transition: 0.3s; transition: 0.3s;line-height:1.2}
#divTopMenu > ul > li .menuContent > ul > li:hover > a{color: #fff;}
#divTopMenu > ul > li .menuContent > ul > li > a.arrow {background-image: url(../../../image/ko/topMenuArrow.png);background-repeat: no-repeat;background-position: right 20px top 17px;}
#divTopMenu > ul > li .menuContent > ul > li .menuList{padding: 18px 0 0 22px;}
#divTopMenu > ul > li .menuContent > ul > li .menuList ul li{margin-bottom: 10px;}
#divTopMenu > ul > li .menuContent > ul > li .menuList ul li a{display: block; color: #7d7d7d; position: relative; padding-left: 13px;}
#divTopMenu > ul > li .menuContent > ul > li .menuList ul li a::after{display: block; content: ''; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 100%; background: #c5c9d6;}
#divTopMenu > ul > li .menuContent > ul > li .menuList ul li a:hover{text-decoration: underline;}

#divTopMenu > .wholeMenuBtn{text-indent: -9999px; width: 29px; height: 20px; display: -webkit-box; display: -ms-flexbox; display: flex;}
#divTopMenu > .wholeMenuBtn span{display: block; width: 29px; height: 2px; background: #fff; -webkit-transition: 0.3s; transition: 0.3s;}
#divTopMenu > .wholeMenuBtn span:nth-of-type(2){margin: 7px 0;}
#divTopMenu > .wholeMenuBtn span:last-of-type{width: 19px; margin-left: auto;}
#divTopMenu > .wholeMenuBtn:hover span{width: 29px !important;}
@media screen and (min-width:1025px) and (max-width: 1340px){
    #divTopMenu > ul > li .menuContent > ul > li > a{font-size: 15px; padding-top: 9px;}
    #divTopMenu > ul > li .menuContent > ul > li:hover > a{background: url(../../../image/ko/topMenuArrowOn.png) no-repeat right 7px top 17px;}
    #divTopMenu > ul{width: 95%;}
}
@media screen and (max-width: 1024px){
    #divTopMenu > ul{display: none;}
    .header2 > div{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
    .header2 .mobileLoginInfo{display: block;}
    #divTopMenu > .wholeMenuBtn{position: absolute; right: 20px; top: 27px;}
}
/* .header2 */
/* PC 전체메뉴 */

@media screen and (min-width:1025px){
    .wholeMenu{width: 100%; height: 100%; overflow-y: auto; position: fixed; top: 93px; left: 0; z-index: 200; opacity:0;visibility:hidden;transition: .3s;}
    .wholeMenu.on{visibility:visible; opacity:1}
    .wholeMenu.fixed{top: 0;}
    .mobileWholeMenuTop p{display: none;}
    .mobileWholeMenuTop a{position: absolute; top: 45px; right: 20px; display: block; width: 48px;height: 48px; border: 1px solid #cce1dc; text-indent: -9999px;}
    .mobileWholeMenuTop a span{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg); height: 25px; width: 2px; background: #a8ccc3; display: block;}
    .mobileWholeMenuTop a span:nth-of-type(2){ transform: translate(-50%, -50%) rotate(135deg); }
    .wholeMenuListW{width: auto; margin: 0 auto; padding: 135px 20px; position: relative;}
    .divMenuList > ul{display: flex; flex-wrap: wrap;}
    .divMenuList > ul > li{width: calc((100% - 210px)/4);}
    .divMenuList > ul > li{margin-right: 70px;}
    .divMenuList > ul > li:nth-of-type(4n){margin-right: 0;}
    .divMenuList > ul > li > a{display: block; margin-bottom: 20px; padding: 20px 0; font-size: 20px; color: #fff; font-family:NotoSansB, sans-serif;}
    .divMenuList > ul > li > ul > li {margin-bottom: 30px;}
    .divMenuList > ul > li > ul > li:last-of-type{margin-bottom: 0;}
    .divMenuList > ul > li:nth-of-type(n+5){margin-top: 65px;}
    .divMenuList > ul > li > ul > li > a{display: block; color: #fff; font-size: 16px; line-height: 1;  margin-bottom: 14px;}
    .divMenuList > ul > li > ul > li > ul li a{display: block; padding-left: 16px; position: relative; font-size: 14px; margin-bottom: 5px;}
    .divMenuList > ul > li > ul > li > ul li a::after{display: block; content: ''; position: absolute; left: 4px; top: 8px; background: #c5c9d6; width: 4px; height: 4px; border-radius: 100%;}
}
@media screen and (min-width:1480px){
    .wholeMenuListW{width: 1240px; padding: 45px 0px;}
    .mobileWholeMenuTop a{right: -90px;}
}

/* PC 전체메뉴 */
/* Mobile, Tablet 전체메뉴 */
@media screen and (max-width:1024px){
    .wholeMenu{display: block; opacity: 0; visibility: hidden; position: fixed; top: 0; right: -1000px; width: calc(100% - 20px); height: 100%; background: #fff; z-index: 301; transition: 0.3s;}
    .wholeMenu.on{visibility: visible; opacity: 1; right: 0;}
    .wholeMenu .menuArea{display: none;}
    .wholeMenu.on .menuArea{display: block;}
    .mobileWholeMenuTop{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;-webkit-box-align: center; -ms-flex-align: center; align-items: center;height: 66px; background: #e7e7e7; padding: 0 20px;}
    .mobileWholeMenuTop p{color: #333; font-size: 14px; padding-left: 30px; background: url(../../../image/ko/mobileMenuBg.png) no-repeat left center; background-size: 20px 16px;}
    .mobileWholeMenuTop .menuClose{display: block; width: 18px; height: 18px; text-indent: -9999px; background: url(../../../image/ko/mobileMenuClose.png) no-repeat; background-size: 18px;}
    .divMenuList{position: relative; height: 100vh;}
    .divMenuList > ul{background: #f2f2f2; height: 100%;}
    .divMenuList > ul > li > a{width: 30%; position: relative; box-sizing: border-box; padding-left: 20px; display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 50px; font-size: 16px; color: #000; font-family:NotoSansM, sans-serif; z-index: 1;}
    .divMenuList > ul > li > a::after{display: block; content: ''; width: calc(100% + 5px); height: 100%; box-shadow: 3px 4px 15px 0px rgba(0, 0, 0, 0.28); position: absolute; left: 0; top: 0; z-index: -1; opacity: 0; -webkit-transition: 0.3s; transition: 0.3s;}
    .divMenuList > ul > li.on > a{color: #fff;}
    .divMenuList > ul > li.on > a::after{opacity: 1;}
    .divMenuList > ul > li > ul{padding: 0 20px; box-sizing: border-box; visibility: hidden; opacity: 0; background: #fff; height: 100%; position:absolute; top: 0; right: 0px; width: 70%; overflow-y: auto; -webkit-transition: 0.3s; transition: 0.3s;}
    .divMenuList > ul > li.on > ul{opacity: 1; visibility: visible;}
    .divMenuList > ul > li > ul > li > a{display: block; padding: 15px 20px 15px 4px ; border-bottom: 1px solid #d6d6d6; color: #333; font-size: 15px; font-family:NotoSansM, sans-serif; position: relative; box-sizing: border-box;}
    .divMenuList > ul > li > ul > li > a.arrow::after{display: block; content: ''; width: 12px; height: 8px; position: absolute; right: 5px; top: 22px; background: url(../../../image/ko/mobileMenuArrow.png) no-repeat center; background-size: 12px 8px; -webkit-transition: 0.3s; transition: 0.3s;}
    .divMenuList > ul > li > ul > li.on > a.arrow::after{-webkit-transform: rotate(180deg); transform: rotate(180deg);}
    .divMenuList > ul > li > ul > li > ul {display: none; padding: 10px 0; border-bottom: 1px solid #d6d6d6;}
    .divMenuList > ul > li > ul > li > ul > li > a{display: block; line-height: 22px; color: #333; font-size: 14px; padding-left: 10px; position: relative;}
    .divMenuList > ul > li > ul > li > ul > li > a::after{display: block; content: ''; position: absolute; left: 0; top: 10px; background: #333; width: 4px ;height: 1px;}
}
@media screen and (max-width:719px){
    .mobileWholeMenuTop{padding: 0 15px;}
    .divMenuList > ul > li > a{padding-left: 15px;}
    .divMenuList > ul > li > ul{padding: 0 10px 0 20px;}
}
@media screen and (max-width:719px){
    .wholeMenu{width: calc(100% - 10px);}
    .divMenuList > ul > li > a{width: 40%;}
    .divMenuList > ul > li > ul{width: 60%;}
}
/* Mobile, Tablet 전체메뉴 */


/* divContentsW */
#divContents{position: relative; width: 1240px; margin: 0 auto 120px auto; }
#divContent{min-height:550px; margin-top: 30px;}
.subCommon{padding-top: 30px;}
#divTitle{font-size: 26px;color: #1f1f1f; margin-bottom: 8px;}
#divLocation ul li{display: inline-block; margin-left: 5px; color: #555;}
#divLocation ul li:not(:first-of-type){margin-left: 18px; padding-left: 23px; background: url(../../../image/ko/locationArrow.png) no-repeat left center;}
@media screen and (max-width:719px){
    #divTitle{text-align: center;}
    #divLocation ul{display: none;}
}

/* Search Total */
#divSearch{position: absolute; right: 0; top: 35px; transition: 0.3s;}
#divSearch:hover , #divSearch.on{box-shadow: 4px 6px 12.09px 0.91px rgba(0, 0, 0, 0.2);}
#divSearch form{position:relative;width:450px;height:55px;padding:0 55px 0 0px; border:none; box-sizing: border-box; background: #eeeeee;}
#divSearch form input[type="text"]{width:100%;height:55px; padding-left: 20px; border:none;background: #eeeeee;box-sizing:border-box;}
#divSearch form input::placeholder{color:#555;}
.searchBoxW ul li div form input[type="text"]::-webkit-input-placeholder{color:#555;}
.searchBoxW ul li div form input[type="text"]::-moz-placeholder{color:#555;}
.searchBoxW ul li div form input[type="text"]:-ms-input-placeholder{color:#555;}
.searchBoxW ul li div form input[type="text"]:-moz-placeholder{color:#555;}
#divSearch form input[type="image"]{position:absolute;top:15px;right:15px;width:25px;height:25px;}
/* Search Total */

/* Tab */
#divTabMenu{margin: 35px 0 50px 0; height: 43px; background: #fff; padding: 0}
#divTabMenu.mTS_destroyed{border-bottom: none;}
#divTabMenu > div.long{margin:0 40px;}
#divTabMenu ul li{display: inline-block; height: 43px; line-height: 43px; }
#divTabMenu ul li a{padding: 0px 45px; color: #555555; font-size: 16px; text-align: center;height: 100%; display: block; border-radius: 25px; border: 1px solid #e3e3e3; box-sizing: border-box;}
#divTabMenu ul li.selected a{height: 43px; color: #fff; font-size: 17px; padding: 0px 60px; background: #1a0dab;}

@media screen and (max-width:1288px){
    #divContents{width: 100%; box-sizing: border-box; padding: 0 24px;}
    #divSearch{right: 24px;}
}
@media screen and (max-width:1024px){
    #divSearch{position: relative; top: 0; right: 0; margin-bottom: 15px;}
    #divSearch form{width: 100%;}
    .subCommon{padding-top: 10px;}
}
@media screen and (max-width:719px){
    #divContents{padding: 0 16px;}
    #divTabMenu ul li a{padding: 0 35px}
    #divTabMenu ul li.selected a{padding: 0 40px;}
}
/* divContentsW */

 /* footer */
.footer{background: #3b3a3f; padding: 50px 0;}
.footerMenu::after{display: block; content: ''; clear: both;}
.libraryInfo{float: left; width: 60%;}
.libraryInfo ul li {display: inline-block;}
.libraryInfo ul li:not(:last-of-type){margin-right: 20px;}
.libraryInfo ul li a{display: inline-block; color: #8f8f8f; font-size: 14px; font-family:NotoSansM, sans-serif;}
.libraryInfo address{color: #7f7f86; font-size: 13px; margin-top: 10px; line-height: 20px;}
.libraryInfo .copyright{color: #939398; font-size: 13px;}

.footerMenuRight{float: right;}

.footerMenuRight> a.siteGoto {display: inline-block; color:#bdbdbd;; font-family:Roboto; height: 40px; line-height: 38px; padding: 0 11px; background: rgba(51,50,56,0.97); margin-left: 3px}
.relationSite {display: inline-block; width: 160px}
.relationSite select#relSite {width:100%;height: 40px;line-height: 38px;border: 1px solid #616161;padding: 0 15px;box-sizing:border-box;position: relative;color: #989898;background: url(../../../image/ko/siteArrow.png) no-repeat right 10px center;background-size: 12px 8px;font-size: 13px;}
.relationSite select#relSite option {background: rgba(51,50,56,0.97);font-size: 13px;color: #bdbdbd;}


.footerMenuRight .count{margin-top: 20px; text-align: center;}
.footerMenuRight .count > span{display: inline-block;color: rgba(152, 152, 152, 0.85);font-size: 13px;}
.footerMenuRight .count ul{display: inline-block;}
.footerMenuRight .count ul li{display: inline-block; color: rgba(152, 152, 152, 0.85);font-size: 13px;}
.footerMenuRight .count ul li:not(:last-child){padding-right: 16px; position: relative;}
.footerMenuRight .count ul li:not(:last-child)::after{display: block; content: ''; width: 1px; height: 12px; position: absolute; right: 4px; top: 5px; background: #606060;}
.footerMenuRight .count ul li span{display: inline-block; margin-left: 3px; font-size: 13px;}
.footerMenuRight .count ul li .today{color: #ff8900;}
.footerMenuRight .count ul li .total{color: #ff8900;}
@media screen and (max-width: 719px){
    .footer{padding: 35px 0 45px 0;}
    .libraryInfo{float: none; width: 100%; text-align: center;}
    .libraryInfo address{font-size: 14px; margin-top: 20px;}
    .libraryInfo .copyright{font-size: 12px; margin-top: 13px;}
    .footerMenuRight{float: none;text-align: center;margin-top: 16px;}
    .relationSite{width: 250px; margin: 0 auto 0;}
    .relationSite > a{width: 270px; margin: 30px auto 0;}
}
/* footer */

.blackBg {display:none;position:fixed;left:0;width:100%;height:100vh;background:rgba(0,0,0,0.6);z-index:20;text-indent: -9999px; transition: 0.2s;}
.blackBg.on {display:block}
.blackBg.mo{top: 0;display:block;z-index: 200;}

/* TopBtn */
.topBtn{opacity: 0; visibility: hidden; position: fixed; bottom: 70px; right: 40px; width: 100px; height: 100px; display: block; background: url(../../../image/ko/TopBtn.png) no-repeat center; transition: 0.5s;}
.topBtn.on{opacity: 1; visibility: visible;}
.topBtn span{display: block; color: #ededec; font-family:RobotoB, sans-serif; line-height: 110px; text-align: center;}
@media screen and (max-width:1024px){
    .topBtn{display: none;}
}
/* TopBtn */

/* 회원증 추가 */
.globalMenu ul>li.card {margin-right:4px}
.globalMenu ul>li.card>a {display:inline-block;padding-left:22px;background:url(../../../image/ko/main/cardType2.png) no-repeat left center;color:#1574bf;}
.card .cardPop {position: fixed;width:100%;top:0;right:-100%;background:#f6f6f6;border-top:10px solid #1574bf;z-index: 199;overflow-y: auto;box-sizing: border-box;transition:right .5s}
.card.on .cardPop {right:0}
.card .cardPop>div {padding:35px 0 12px 0;text-align: center;}
.card .cardPop .popTit {margin-bottom:28px;color:#000;font-family: NotoSansM,sans-serif;font-size:35px;letter-spacing: -0.05em;}
.card .cardPop .popTit>span {display:block;color:#515151;font-family: RobotoM,sans-serif;font-size:24px;}
.qrArea {width:378px;margin:0 auto;padding:40px 20px;background:#fff;border-radius: 15px;box-sizing: border-box;box-shadow:-7px 4px 16px 0px rgba(0, 0, 0, 0.11);-webkit-box-shadow:-7px 4px 16px 0px rgba(0, 0, 0, 0.11)}
.qrUser {color:#010101;font-size:30px;font-family: NotoSansM,sans-serif;letter-spacing: -0.05em;}
.qrSchool {color:#474747;font-size:20px;font-family: NotoSansM,sans-serif;letter-spacing: -0.05em;}
.qrStatus {margin-top:4px;color:#101010;font-size:20px;font-family: NotoSansM,sans-serif;letter-spacing: -0.05em;}
.qr img {width:240px;height:auto; margin: 0 auto;}
.time {margin:24px 0 20px 0;color:#006cfe;font-size:18px;letter-spacing: -0.05em;}
.time span {color:#006cfe;font-size:18px;letter-spacing: -0.05em;}
.qrBtn {margin-top:20px}
.qrBtn a.retry {display:inline-block;min-width:134px;margin:0 3px;padding:13px 32px;background-color:#1574bf;border:1px solid #d0d0d0;border-radius: 10px;box-sizing: border-box;}
.qrBtn a.retry>span {display:inline-block;padding-left:22px;background:url(../../../image/ko/main/retry.png) no-repeat left center;color:#fff;font-size:16px;letter-spacing: -0.05em;}
.qrBtn a.close {display:inline-block;min-width:134px;margin:0 3px;padding:13px 32px;background-color:#fff;border:1px solid #d0d0d0;border-radius: 10px;box-sizing: border-box;}
.qrBtn a.close>span {display:inline-block;padding-left:32px;background:url(../../../image/ko/main/cardClose.png) no-repeat left center;color:#252626;font-size:16px;letter-spacing: -0.05em;}

.cardPop .caution {margin-top:42px;color:#686464;line-height: 24px;font-size: 16px;}

@media screen and (min-width:720px) {
    .globalMenu ul>li.card {display:none}
}
@media screen and (max-width: 719px){
    .header1 .globalMenu > ul{position: static;}
    .myMenuArea{ top: 36px;}
}
@media screen and (max-width: 470px){
    .header1 .globalMenu > ul{position: static;}
    .myMenuArea{width: calc(100% - 10px);width:-webkit-calc(100% - 10px); left: 10px; top: 36px;}
}
@media screen and (max-width: 400px){
    .qrArea {width:auto;margin:0 24px}
    .qr {padding:0 20px}
    .qr img {width:auto;height:160px}
    .qrBtn a.retry {min-width: 0;width:46%;padding:13px 0}
    .qrBtn a.close {min-width: 0;width:46%;padding:13px 0}
}

/* 챗봇 */
.chatBot {display:block;position:fixed;bottom:50px;right:30px;z-index: 10;}
.chatW {display:none;position:fixed;bottom:165px;right:30px;width:400px;z-index: 10;box-shadow: 0 4px 15px 0 rgb(0,0,0,0.2);border-radius: 10px;background:#fff}
.chatIntro {position:absolute;top:0;left:0;width:100%;height:100%;padding:20px 28px; background-color:#194a84;border-radius: 10px;z-index: 1;box-sizing: border-box;}
.chatIntro .tit {margin-bottom:12px;color:#fff;font-size:18px;letter-spacing: -0.05em;}
.chatIntro .txt {color:#fff;font-size:16px;line-height: 21px;letter-spacing: -0.05em;}
.chatIntro .start {position:absolute;bottom:0;left:0;width:100%;height:52px;padding-left:50px;background:url(../../../image/ko/chatbot/ico-send2.png) no-repeat left center #fff;border-radius: 0 0 5px 5px;color:#333;line-height: 52px;box-sizing: border-box;}
.chatClose {position:absolute;top:25px;right:16px;width:20px;height:20px;transform: rotate(45deg);-webkit-transform: rotate(45deg);z-index: 11;}
.chatClose span {position:absolute;background:#fff}
.chatClose span:nth-of-type(1) {width:20px;height:2px;top:50%;left:0;transform: translateY(-50%);-webkit-transform: translateY(-50%)}
.chatClose span:nth-of-type(2) {width:2px;height:20px;top:0;left:50%;transform: translateX(-50%);-webkit-transform: translateX(-50%)}


.chat-container .head {background:#194a84; height: 70px;border-top-left-radius: 10px; border-top-right-radius: 10px; position: relative;text-align: center;}
.chat-container .head .modal-title { font-size: 18px; cursor: pointer; text-decoration: none; color: #fff;font-family:NotoSansM,sans-serif}
.chat-container .chat-wrap { background: #fff;}
.chat-container .chat-wrap .chat {width:100%;height:100%;} /* only chat window */
.chat-container .footer {padding:0;background:none;margin:0; position:relative; bottom:0;}
.head { position: relative;}
h1.h1 { font-size: 18px; font-weight: 300; color: #fff; line-height: 70px; margin: 0 20px; display: inline-block; }
h1.h1 a { font-size: 18px!important; font-weight: 300!important; margin-top: 0; display:inline;}
.head > ul { position: absolute; right: 15px; list-style: none; line-height: 70px; vertical-align: middle; margin: 0;}
.head > ul > li {float: left;}
.head > ul > li + li { margin-left: 23px;}
.head > ul > li > a { line-height: 70px; display: inline-block; vertical-align: middle; cursor:pointer;}
.head > ul > li > a.ico-out {background: url(../../../image/ko/chatbot/ico-out.png) no-repeat 0 0; width:19px; height:26px;}

h1.h1 span { color: #deedf9; cursor: pointer;}
h1.h1 span::before { content: " | "; color: #aa9d8f;}


ul.bots { position: absolute; top: 70px; left: -379px; right: -15px; z-index: 2000; background: url(../../../image/ko/chatbot/bg-bots2.png); box-shadow: 0 3px 3px rgba(0,0,0,0.05); border-bottom: 1px solid #fff;}
ul.bots li { float: left; width: 125px; height: 126px;}
ul.bots li a { display: block; width: 100%; height: 100%;text-align: center; border: 1px solid #fff; border-left: none; border-bottom: none;  padding-top: 95px; position: relative; color: #464646; font-weight: 300;}
ul.bots li:nth-child(4) a { border-right: none;}
ul.bots li a:hover,
ul.bots li a:focus,
ul.bots li a:active,
ul.bots li a.active { background: #5abbec; color: #fff; text-decoration: none;}

ul.bots li a span.bot { position: absolute; width: 45px; height: 61px; background: url(../../../image/ko/chatbot/bg-bots2-bot.png) no-repeat center; top: 25px; left: 40px; z-index: 2001}
ul.bots li a span.type { position: absolute; display: block; width: 30px; height: 30px; top: 57px; right: 20px; z-index: 2002;}
ul.bots li a span.hospital { background: url(../../../image/ko/chatbot/bg-bots-type.png) no-repeat 0 0; }
ul.bots li a span.trafic { background: url(../../../image/ko/chatbot/bg-bots-type.png) no-repeat -30px 0; }
ul.bots li a span.weather { background: url(../../../image/ko/chatbot/bg-bots-type.png) no-repeat -60px 0; }
ul.bots li a span.movie { background: url(../../../image/ko/chatbot/bg-bots-type.png) no-repeat -90px 0; }

.navi { float: right; margin-right: 20px; margin-top: -40px;}
.ico-nav { display: block; width: 19px; height: 15px; background: url(../../../image/ko/chatbot/ico_nav.png) no-repeat 0 0;}
.ico-nav:hover,
.ico-nav:focus { background-position: 0 -15px;}
.navi .mn { border-radius: 10px; background: #fff; -webkit-box-shadow: 3px 3px 10px rgba(165,155,145,0.2); box-shadow: 3px 3px 10px rgba(165,155,145,0.2); position: absolute; top: 20px; left: -115px; min-width: 100px; padding: 0;}
.navi .mn li a { display: inline-block; padding: 0 19px; line-height: 30px; border-bottom: 1px solid #e4ebf0; font-size: 12px;}
.navi .mn li:first-child a { border-top-left-radius: 10px; border-top-right-radius: 10px;}
.navi .mn li:last-child a { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.navi .mn li a:hover,
.navi .mn li a:focus { background: #f7f3ec; color: #846e56;}
.ico-close,
.ico-close:focus { display: block; width: 10px; height: 10px; background: url(../../../image/ko/chatbot/ico-close.png) no-repeat 0 0; position: absolute; right: 20px; top: 30px; z-index: 10;}
.ico-close:hover { background-position: 0 -10px;}

/* chat-wrap
-------------------------------------------*/
.chatbot-Timer {position:relative;height:19px;margin-bottom:24px;text-align: center;}
.chatbot-Timer::before {content:"";display:block;position:absolute;top:12px;left:0;width:102px;height:1px;background:#e4e4e4;}
.chatbot-Timer::after {content:"";display:block;position:absolute;top:12px;right:0;width:102px;height:1px;background:#e4e4e4;}
.chatbot-Timer span {color:#818181;font-size:13px;letter-spacing: -0.025em;line-height: 19px;}
.chat-container .chat-wrap .chat {padding: 24px 0 10px 0;overflow-x: hidden;overflow-y: auto;min-height: 540px;box-sizing: border-box;background: #fff;height: 540px;}
.chat-container .chat-wrap .chat::-webkit-scrollbar{width: 7px;}
.chat-container .chat-wrap .chat::-webkit-scrollbar-thumb{background-color: #c0c4c7; border-radius: 15px;}
.message {padding:0 12px}
.message {list-style: none; }
.message li:first-child {margin-top:0}
.message li { -webkit-transition: all .5s; transition: all .5s; position: relative; display: block; margin-top: 20px; }
.message li:after,
.message li:before { content: ""; clear: both; display: block;}

.message li .bubble { border-radius: 14px; font-size:9.5pt; position: relative; padding: 10px; max-width: calc(100% - 84px) !important; max-width: -webkit-calc(100% - 84px) !important; margin: 0 auto 0 12px; line-height: 1.4; word-wrap: break-word;}
.message li .bubble.bubble2 { max-width: 415px;}

.message li.bot p { white-space: pre-wrap; word-break: break-all; }
.message li.bot p:last-child {margin-bottom:0;}
.message li.bot p.title { font-size: 16px; font-weight: 900; }
.message li.bot p.subtitle { font-size: 12px; }
.message li.bot img, .message li.bot video { max-width: 100%; height: auto;}
.message li.bot audio { max-width: 100%; min-width: 250px;}
.message li.bot .bubble {background: #f0f2f5 !important; float: left; position: relative; border-top-left-radius: 0; }
.message li.bot .bubble .b-tail { background: url(../../../image/ko/chatbot/bubbletail_white.png) no-repeat; width: 18px; height: 20px; position: absolute; top: -8px; left: -5px; z-index: 10;}
.message li.bot .bubble ul { padding: 0px; }

.message li.bot .avata {width: 52px;height: 52px;float: left;top: 0;left: 0;background: url(../../../image/ko/chatbot/ico-bot.png) no-repeat center/cover;background-size: 52px;}
.message li.bot .domainavata { width: 43px; height: 43px; float: left;  border-radius:100%;}
.message li.bot .avata.tts {background: url(../../../image/ko/chatbot/tts_play_button.png) no-repeat center/cover; cursor:pointer;  position:absolute;}
.message li.bot .avata.tts.active {background: url(../../../image/ko/chatbot/tts_active_button.png) no-repeat center/cover;}
.message li.bot .avata.tts.active:hover {background: url(../../../image/ko/chatbot/tts_stop_button.png) no-repeat center/cover;}
.message li.bot .name { font-size: 11px;margin: 0 0 10px 50px;}
.message li.bot .time { font-size: 12px; color: #494848; position: absolute; bottom: 0;letter-spacing: -0.03em;}
.message li.bot .time2 { font-size: 10px; color: #999898; position: absolute; bottom: -20px; left: 0;}

.message li.user .bubble { background: #194a84 !important; float: right; border-top-right-radius: 0; color: #fff;}
.message li.user .bubble .b-tail { background: url(../../../image/ko/chatbot/bubbletail_red.png) no-repeat; width: 18px; height: 20px; position: absolute; top: -7px; right: -4px; z-index: 10;}
.message li.user .time { font-size: 12px; color: #494848; position: absolute; bottom: 0; left: -62px;}

.blank { margin-bottom: 20px;}

.write-form {position:relative; padding:0 10px;box-sizing: border-box; height: 52px; background: #fff !important; margin:20px 0; width: 100%; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.write-form i { position:absolute; top:26px; left:8px; z-index:1; width:20px; height:20px;}
.write-form i.microphone {background: url(../../../image/ko/chatbot/microphone.png) no-repeat 0 0; cursor:pointer; background-size:20px; }
.write-form i.microphone.active {background: url(../../../image/ko/chatbot/microphone-active.gif) no-repeat 0 0; background-size:20px; }
.write-form i.microphone.disable {background: url(../../../image/ko/chatbot/microphone-disabled.png) no-repeat 0 0; pointer-events: none; background-size:20px;}
.write-form textarea {position:relative; box-sizing: border-box; width:84%;height:52px; outline: none; padding: 13px 20px 0 30px;background:#f8f8f8; border: 1px solid #ddd !important; font-family: NotoSans,sans-serif; line-height: 1.4; font-size: 16px; overflow: hidden;  resize: none; letter-spacing: -1px;box-sizing: border-box;border-radius: 30px;}

.write-form .send { float: right; width: 52px; height: 52px; margin: 0; border-radius: 30px; color: #fff; font-size: 13px; font-weight: normal; text-align: center; cursor: pointer;}
.write-form .send span { display: inline-block; width: 52px; height: 52px; background: url(../../../image/ko/chatbot/ico-send.png) no-repeat 0 0 !important;}
.write-form .send span:hover {background-position: 0 -52px;}

#chat-textarea::-webkit-input-placeholder { color: #adadad; font-family:NotoSans,sans-serif;}
#chat-textarea::-moz-input-placeholder { color: #adadad; font-family:NotoSans,sans-serif;}
#chat-textarea:-moz-input-placeholder { color: #adadad; font-family:NotoSans,sans-serif;}
#chat-textarea:-ms-input-placeholder { color: #adadad; font-family:NotoSans,sans-serif;}

#chat-textarea:focus::-webkit-input-placeholder { color: transparent;}
#chat-textarea:focus::-moz-input-placeholder { color: transparent;}
#chat-textarea:focus:-moz-input-placeholder { color: transparent;}
#chat-textarea:focus:-ms-input-placeholder { color: transparent;}

.message.hospital li.bot .avata { background: url(../../../image/ko/chatbot/avata_set.png) no-repeat 0 0; }
.message.trafic li.bot .avata { background: url(../../../image/ko/chatbot/avata_set.png) no-repeat -43px 0; }
.message.weather li.bot .avata { background: url(../../../image/ko/chatbot/avata_set.png) no-repeat -86px 0; }
.message.movie li.bot .avata { background: url(../../../image/ko/chatbot/avata_set.png) no-repeat -129px 0; }


/* cover
-------------------------------------------*/
.cover {height: calc(100% - 2px); min-width:500px; background-image: linear-gradient(340deg, #149ee4, #09cded ); position: relative; padding: 180px 60px 0 60px; text-align:center;}
.cover img.animation { /*  margin-left: 75px;*/ }

/* login
-------------------------------------------*/
.form-login input { display:inline-block; width: 450px; height: 50px; padding-left:30px; font-weight: 300; border: 1px solid #d4d4d4; background: #eee; border-radius: 25px; }
.form-login .dropdown { margin-bottom: 10px;}
.form-login input::placeholder { color: #aca8a8;}
.form-login input:-ms-input-placeholder { color: #aca8a8;}
.form-login input::-ms-input-placeholder { color: #aca8a8;}
.form-login .btn-dropdown {display:inline-block; width: 450px; height: 50px; border: none; border-radius: 21px; text-align: left; padding-left: 30px; padding-right: 30px; font-size: 13px; font-weight: 800; color: #6e7783; background: #fff;}
.form-login .btn-dropdown:hover,
.form-login .btn-dropdown:focus { background: #e0e8ee;}
.form-login .btn-dropdown .caret { float: right; margin-top: 5px; border-top: 8px solid #97a2b0;}
.form-login .dropdown-menu-style { width:450px; padding: 0; position: absolute; top: 455px; left: calc(50% - 225px); z-index: 1000; float: left; margin: 2px 0 0; font-size: 13px; text-align: left; list-style: none; background: #fff; border: none; border-radius: 20px; -webkit-box-shadow: 0 3px 10px rgba(165,155,145,0.21); box-shadow: 0 3px 10px rgba(165,155,145,0.21);}
.form-login .dropdown-menu-style > li > a { display: block; padding: 0 30px; clear: both; font-weight: normal; line-height: 35px; color: #333; white-space: nowrap; border-bottom: 1px solid #e4ebf0;}
.form-login .dropdown-menu-style > li > a:hover,
    .form-login .dropdown-menu-style > li > a:focus { color: #846e56; }
.form-login .dropdown-menu-style > li:first-child > a:hover,
    .form-login .dropdown-menu-style > li:first-child > a:focus  {border-radius:20px 20px 0 0;}
.form-login .dropdown-menu-style > li:last-child > a {border-bottom:none;}
.form-login .dropdown-menu-style > li:last-child > a:hover,
    .form-login .dropdown-menu-style > li:last-child > a:focus {border-bottom:none; border-radius:0 0 20px 20px;}


.form-login .btn-login { width: 450px; height: 50px; text-align: center; border-radius: 25px; border: none; background: #272f38; color: #fff; font-size: 18px; font-weight: 300;  margin-top: 10px;}
.form-login .btn-login:hover { background: #272f38;}

/* loading dot
-------------------------------------------*/
@keyframes dot-keyframes {
  0% {
    opacity: .4;
    transform: scale(0.8, 0.8);
  }

  50% {
    opacity: 1;
    transform: scale(1, 1);
  }

  100% {
    opacity: .4;
    transform: scale(0.8, 0.8);
  }
}

.message li.bot .bubble .dots {
  text-align: center;
  width: 100%;
}
.message li.bot .bubble .dots .dot1 {
    animation: dot-keyframes 1.5s infinite ease-in-out;
    background-color: #000;
    border-radius: 10px;
    display: inline-block;
    height: 10px;
    width: 10px;
  }
.message li.bot .bubble .dots .dot2 {
    animation: dot-keyframes 0.5s infinite ease-in-out;
    background-color: #000;
    border-radius: 10px;
    display: inline-block;
    height: 10px;
    width: 10px;
    }

.message li.bot .bubble .dots .dot3 {
    animation: dot-keyframes 1s infinite ease-in-out;
    background-color: #000;
    border-radius: 10px;
    display: inline-block;
    height: 10px;
    width: 10px;
}

.questions {position:relative;}
.questions > ul {width:calc(100% - 1px);    bottom:70px; top:auto!important; height:auto; background: #fff; border:none!important; }
.questions > ul > li .ui-menu-item-wrapper {padding: 3px 30px;height:35px;  line-height: 35px;  color: #464646; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;}
.questions > ul > li .ui-state-active {border: none;background: #c6e2ff;color: #464646;margin:0;}

.opinion-icon { background: url(../../../image/ko/chatbot/opinion_icon.png) no-repeat center/cover; width: 12px; height: 12px; position: absolute; top: 6px; right: 3px;  cursor: pointer;}
.opinions {position:relative; color:#797979;}
.opinions .opinion-header .top-btn {background-size: contain; height: 14px; cursor: pointer; margin-top:11px;}
.opinions .opinion-header .top-btn.back {background: url(../../../image/ko/chatbot/opinion_back.png) no-repeat 40px center/contain; float:left; }
.opinions .opinion-header .top-btn.cancel {background: url(../../../image/ko/chatbot/opinion_cancel.png) no-repeat center/contain; float:right; }
.opinions > ul {width:100%; bottom:0px; top:unset!important; background: #fff; border-radius: 0px 0px 10px 10px;     position:absolute; padding:0px;    z-index:2;  margin-bottom:0px; /*border-top:1px solid #bbbbbb;*/}
.opinions > ul > li {height:35px; line-height: 35px;    text-align:center; border-bottom:1px solid #bbbbbb;}
.opinions > ul > li:hover{  background:#c4e2ff;}
.opinions > ul > li:first-child:hover{  background:none;}
.opinions > ul > li:last-child {border-bottom:0px;}

.cursor {
    cursor:pointer;
}

@media screen and (max-width:719px) {
    .chatW {bottom:auto;top:0;right:auto;left:0;width:100%;height:100vh;z-index: 200;}
    .chat-container .chat-wrap {height:auto}
    .chat-container .chat-wrap .chat {height:calc(100vh - 140px);height:-webkit-calc(100vh - 140px)}
}
.answer .box.buttons .horizontal .btn {border: 1px solid #ddd;border-radius: 15px;padding: 4px 12px;background: #fff;font-family: NotoSans,sans-serif;color: #333;}


/* 챗봇 */

.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content{
    width: auto;
}

.white-popup{
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 500px;
    margin: 20px auto;
}

/* 메시지 창 */
.message li.bot p {font-size:14px}
.message li.user .bubble>div {font-size:14px}
.message li.user .bubble>div.time { font-size: 12px; color: #494848; position: absolute; bottom: 0; left: -62px;}
.message .bubble .choiceBtn {padding:0 18px; margin-top: 10px}
.message .bubble .btn-link {display:block;width:100%;margin-bottom:10px;padding:11px 0;background:#1fb3e3;border:none;color:#fff;text-align: center;font-family: NotoSans,Roboto,sans-serif;font-size:15px;letter-spacing: -0.03em;border-radius: 30px;cursor: pointer;}
.message .resultTitle {position:relative;padding:10px 0 20px 20px;}
.message .resultTitle::after {content:"";display:block;position:absolute;bottom:0;left:-10px;width:calc(100% + 20px);height:1px;background:#ddd}
.message li.bot .resultTitle p {font-size:16px;color:#262626;letter-spacing: -0.05em;}
.message .slick-dots {margin-top:12px}
.message .slick-dots li {margin-top:0}
.chatBook .imgArea {text-align: center;}
.chatBook .imgArea img {margin:0 auto 20px auto;width:142px;height:194px;box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.2);}
.chatBook .info {margin-bottom: 10px;color:#616161;letter-spacing: -0.03em;font-size:14px;letter-spacing: -0.05em;text-align: center;}
.chatBook .bookGoBtns {padding:0 18px}
.chatBookSlide {margin-top:20px}
.chatBookSlide .slickPrev {display:block;position:absolute;top:84px;left:8px;width:20px;height:41px;background:url(../../../image/ko/chatbot/bookLeft.png);text-indent: -9999px;z-index: 1;cursor: pointer;}
.chatBookSlide .slickNext {display:block;position:absolute;top:84px;right:8px;width:20px;height:41px;background:url(../../../image/ko/chatbot/bookRight.png);text-indent: -9999px;z-index: 1;cursor: pointer}
.chatBookSlide .slick-dots {text-align: center;}
.chatBookSlide .slick-dots>li {display:inline-block}
.chatBookSlide .slick-dots>li button {width:12px;height:12px;margin:0 4px;background:#bbb;;border:none;border-radius: 100%;cursor: pointer;text-indent: -9999px;}
.chatBookSlide .slick-dots>li.slick-active button {background:#194a84}