@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:NotoSansDL;
    src:url(../../font/NotoSansKR-DemiLight.eot);
    src:local('※'), url(../../font/NotoSansKR-DemiLight.woff) format('woff');
}
@font-face{
    font-family:NotoSansL;
    src:url(../../font/NotoSans-Light.eot);
    src:local('※'), url(../../font/NotoSans-Light.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:GyeonggiTitleM;
    src:url(../../font/GyeonggiTitle_Medium.eot);
    src:local('※'), url(../../font/GyeonggiTitle_Medium.woff) format('woff');
}
@font-face{
    font-family:GmarketM;
    src:url(../../font/GmarketSansMedium.eot);
    src:local('※'), url(../../font/GmarketSansMedium.woff) format('woff');
}
@font-face{
    font-family:Montserrat;
    src:url(../../font/Montserrat-Regular.eot);
    src:local('※'), url(../../font/Montserrat-Regular.woff) format('woff');
}
@font-face{
    font-family:MontserratM;
    src:url(../../font/Montserrat-Medium.eot);
    src:local('※'), url(../../font/Montserrat-Medium.woff) format('woff');
}
@font-face{
    font-family:MontserratSB;
    src:url(../../font/Montserrat-SemiBold.eot);
    src:local('※'), url(../../font/Montserrat-SemiBold.woff) format('woff');
}
@font-face{
    font-family:MontserratB;
    src:url(../../font/Montserrat-Bold.eot);
    src:local('※'), url(../../font/Montserrat-Bold.woff) format('woff');
}
@font-face{
    font-family:PretendardL;
    src:url(../../font/Pretendard-Light.eot);
    src:local('※'), url(../../font/Pretendard-Light.woff) format('woff');
}
@font-face{
    font-family:Pretendard;
    src:url(../../font/Pretendard-Regular.eot);
    src:local('※'), url(../../font/Pretendard-Regular.woff) format('woff');
}
@font-face{
    font-family:PretendardM;
    src:url(../../font/Pretendard-Medium.eot);
    src:local('※'), url(../../font/Pretendard-Medium.woff) format('woff');
}
@font-face{
    font-family:PretendardSB;
    src:url(../../font/Pretendard-SemiBold.eot);
    src:local('※'), url(../../font/Pretendard-SemiBold.woff) format('woff');
}
@font-face{
    font-family:rokafM;
    src:url(../../font/ROKAF_Medium.eot);
    src:local('※'), url(../../font/ROKAF_Medium.woff) format('woff');
}
@font-face{
    font-family:rokafB;
    src:url(../../font/ROKAF_Bold.eot);
    src:local('※'), url(../../font/ROKAF_Bold.woff) format('woff');
}
@font-face{
    font-family:Barlow;
    src:url(../../font/Barlow-Regular.eot);
    src:local('※'), url(../../font/Barlow-Regular.woff) format('woff');
}

/* .header1 */
.header1 {background:#285a83;}
.header1>div {width:1760px;margin:0 auto;}
.header1>div::after {content:"";display:block;clear:both}
.header1 .globalMenu {padding:7px 0;text-align: right;}
.header1 .globalMenu>ul {font-size:0}
.header1 .globalMenu>ul>li {display:inline-block}
.header1 .globalMenu>ul>li:not(:first-child) {margin-left:28px}
.header1 .globalMenu>ul>li .userId {color:#fff;margin-right:28px}
.header1 .globalMenu>ul>li>a {color:#fff;font-family:PretendardM,sans-serif;}

.header1 .globalMenu .myLib select {width:160px;height: 23px; line-height: 23px; padding: 0 28px 0 0; box-sizing:border-box; position: relative; color: #fff; background: url(../../../image/en/main/statusArrowOn.png) no-repeat right 3px top 10px; -webkit-background-size: 10px 5px; background-size: 10px 5px;border:none;font-size:16px;box-sizing: border-box;vertical-align: top;}
.header1 .globalMenu .myLib select option {color:#1c1c1c;height:16px;line-height: 16px;font-size:14px}
.header1 .globalMenu .myLib .myLibGo {display:inline-block;margin-left:10px;font-size:14px}
/* header2 */
.header2 {background:#fff}
.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;width:1760px;margin:0 auto}
.header2>div .logo>a {display:block;padding-right:110px;background:url(../../../image/en/logoBackground.png) no-repeat right top -6px;color:#000;font-family:rokafB,sans-serif;font-size:23px;letter-spacing: -0.01em;text-align: center;line-height: 28px;}
.header2>div .logo>a>span {display:block;color:#686868;font-family:rokafM,sans-serif;font-size:16px;letter-spacing: -0.01em;}

#divTopMenu {margin-right:245px}
.topMenu>ul>li {display:inline-block;position:relative;padding:32px 20px 32px 0}
.topMenu>ul>li:not(:last-child) {margin-right:65px}
.topMenu>ul>li>a {color:#000;font-family:PretendardM,sans-serif;font-size:21px;letter-spacing: -0.05em;}
.topMenu>ul>li .menuList {display:none}
.topMenu>ul>li .menuList {display: none; position: absolute; width: 200px; top: 80px; left: 50%; margin-left: -50px; box-sizing: border-box; text-align: left; padding: 27px 30px; background: #fff; border: 1px solid #dfdfdf; box-shadow: 5px 5px 16px rgba(0,0,0,0.11); -webkit-box-shadow: 5px 5px 16px rgba(0,0,0,0.11); z-index: 10}
.topMenu>ul>li .menuList > li:not(:first-child) {margin-top: 13px;}
.topMenu>ul>li .menuList > li > a {color: #333; letter-spacing: -0.025em;font-size: 16px; font-family:NotoSansB; position: relative}
.topMenu>ul>li .menuList > li > a.menuDown::after {content: ''; display: block; clear: both; width: 13px; height: 8px; background: url('../../../image/en/menuArrow.png') no-repeat center center; background-size: 100%; position: absolute; top: 9px; right: -19px}
.topMenu>ul>li .menuList > li > ul {font-size: 14px; color: #eee; padding: 9px 0 3px;}
.topMenu>ul>li .menuList > li > ul > li {margin-top: 3px}
.topMenu>ul>li .menuList > li > ul > li > a {color: #555555; font-size: 16px; letter-spacing: -0.025em; font-family:NotoSans}

/* fix */
.header2.fixed {position:fixed;width:100%;top:0;left:0;box-shadow: 0px 10px 20px rgba(0,0,0,0.08);-webkit-box-shadow: 0px 10px 20px rgba(0,0,0,0.08);z-index: 5;}
#divContents.on {margin-top:94px}

/* searchBox */
#divSearch {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#divSearch form .searchBox {position:relative;width:458px;background: #fff;border:2px solid #0357be; position: relative;box-sizing: border-box;}
#divSearch form .searchBox input[type="text"].searchInput {border: none; background: none; color: #222; letter-spacing: -0.01em; font-size: 16px; padding: 0 20px 0 12px; line-height: 50px; height: 50px;font-family:Pretendard,sans-serif; width: calc(100% - 90px); width: -webkit-calc(100% - 90px);box-sizing:border-box}
#divSearch form .searchBox input[type="text"].searchInput::placeholder {color: #fff; letter-spacing: -0.025em; font-size: 20px}
#divSearch form .searchBox input[type="text"].searchInput::-webkit-input-placeholder {color: #222; letter-spacing: -0.01em; font-size: 16px;font-family:Pretendard,sans-serif;opacity: 1;}
#divSearch form .searchBox input[type="text"].searchInput::-moz-placeholder {color: #222; letter-spacing: -0.01em; font-size: 16px;font-family:Pretendard,sans-serif;opacity: 1;}
#divSearch form .searchBox input[type="text"].searchInput::-ms-input-placeholder {color: #222; letter-spacing: -0.01em; font-size: 16px;font-family:Pretendard,sans-serif;opacity: 1;}
#divSearch form .searchBox .autoComBtn {position:absolute;top:11px;right:95px}
#divSearch form .searchBox .autoComW {top:52px;width: calc(100% - 90px); width: -webkit-calc(100% - 90px)}
#divSearch form .searchBox .languageBtn {width:20px;height:100%;background: url('../../../image/en/languageBtn.png') no-repeat center center;top:0;right:65px}
#divSearch form .searchBox .languageBtn span {display:inline-block;text-indent: -9999px;}
#divSearch form .searchBox .languageBtn:hover > span {visibility: visible; opacity: 1; top: -12px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#divSearch form .searchBox input[type="submit"].searchBtn {position:absolute;right:0;background:url(../../../image/en/main/searchBtn2.png) no-repeat center #2967c3;width:50px;height:50px;padding:0;border:none;text-indent: -9999px;}

/* keywordRanking  */
#keywordRanking {margin-left:20px;position: relative;}
#keywordRanking .keywordList {width: 160px; height: 48px; line-height: 48px; overflow: hidden; position: relative}
#keywordRanking .keywordList::after {display: block; content: ''; position: absolute; right:5px; top: 22px; background: url(../../../image/en/main/rankArrow.png) no-repeat; background-size: 12px 8px; -webkit-background-size: 12px 8px; width: 12px; height: 8px; z-index: 2}
#keywordRanking .keywordList ul {position: absolute; left: 0; top: 0; width: 160px}
#keywordRanking .keywordList ul li {height: inherit}
#keywordRanking .keywordList ul li::after {display: block; content: ''; clear: both}
#keywordRanking .keywordList ul li a {float: left; margin-left: 20px; color: #0d0d0d; letter-spacing: -0.05em; font-size: 16px; display: block; -webkit-width: calc(100% - 64px); width: calc(100% - 64px); text-overflow: ellipsis; overflow: hidden; white-space: nowrap}
#keywordRanking .keywordList ul li span {float: left; margin-top: 15px; display: block; width: 21px; height:21px; line-height: 21px; text-align: center; font-size: 16px; color: #fff; border-radius: 50%; background: #525252;padding-right:1px;box-sizing: border-box;}
#keywordRanking .keywordAll{display: block; position: absolute; left: 0px; top: 33px; width: 280px; box-sizing: border-box; background: rgba(255,255,255,1); padding: 20px; box-shadow: 8px 5px 27px rgba(65,66,97,0.11); -webkit-box-shadow: 8px 5px 27px rgba(65,66,97,0.11); opacity: 0; visibility: hidden; z-index: 3; transition: all 0.4s ease; -webkit-transition: all 0.4s ease}
#keywordRanking .keywordAll.on{opacity: 1; visibility: visible; top: -33px; transition: all 0.4s ease; -webkit-transition: all 0.4s ease}
#keywordRanking .keywordAll ul li{margin-bottom: 4px}
#keywordRanking .keywordAll ul li::after {display: block; content: ''; clear: both}
#keywordRanking .keywordAll ul li a {float: left; margin-left: 20px; color: #0d0d0d; letter-spacing: -0.05em; font-size: 16px; display: block; -webkit-width: calc(100% - 41px); width: calc(100% - 41px); text-overflow: ellipsis; overflow: hidden; white-space: nowrap}
#keywordRanking .keywordAll ul li a:hover{text-decoration: underline}
#keywordRanking .keywordAll ul li span {float: left; display: block; width: 21px; height:21px; line-height: 21px; text-align: center; margin-top: 3px; font-size: 16px; color: #fff; border-radius: 50%; background: #525252;padding-right:1px;box-sizing: border-box;}

/* pc 와 tablet 사이 */
@media screen and (max-width:1780px) {
    .header1>div {width:auto;margin: 0 24px}
    .header2>div {width:auto;margin:0 24px}
    #divTopMenu {margin-right:0}
    .topMenu>ul>li.menu3 {padding-right:0}
    .topMenu>ul>li.menu3 .menuList {left: auto;right:0}
}
@media screen and (max-width:1380px) {
    .topMenu>ul>li:not(:last-child) {margin-right:20px}
    .topMenu>ul>li>a {font-size:19px}
    #divSearch {width:calc(100% - 700px);width:-webkit-calc(100% - 700px)}
    #divSearch form {width:calc(100% - 180px);width:-webkit-calc(100% - 180px)}
    #divSearch form .searchBox {width:100%}
}
@media screen and (min-width:1025px) and (max-width:1180px) {
    .header2>div .logo>a {padding-right:95px;font-size:20px;line-height: 25px;background-size:92px auto;background-position:right top -2px}
    .header2>div .logo>a>span {font-size:15px}
    #divSearch {width:calc(100% - 550px);width:-webkit-calc(100% - 550px)}
}
/* tablet */
@media screen and (max-width:1024px) {
    .header2>div {position:relative}
    .header2>div .logo>a {padding-right:95px;font-size:20px;line-height: 25px;background-size:92px auto;background-position:right top -2px}
    .header2>div .logo>a>span {font-size:15px}
    #divTopMenu {margin-top:90px}
    .topMenu>ul>li {padding-top:0;padding-bottom:16px}
    .topMenu>ul>li:not(:last-child) {margin-right:60px}
    .topMenu>ul>li .menuList {top:36px}
    #divSearch {position:absolute;top:16px;right:0;width:435px}
    #keywordRanking .keywordList::after {right:0}
    #keywordRanking .keywordAll {left:auto;right:0}
    #divContents.on {margin-top:133px}
}
/* mobile */
@media screen and (max-width:767px) {
    .header1>div {width:auto;margin: 0 16px}
    .header1 .globalMenu>ul>li:not(:first-child) {margin-left:14px}
    .header1 .globalMenu>ul>li>a {font-size:14px}
    .header1 .globalMenu>ul>li .userId {color:#fff;margin-right:14px;font-size:14px}
    .header1 .globalMenu .myLib select {width:112px;height:22px;line-height: 22px;font-size:14px}
    .header2  {padding:12px 0 0}
    .header2>div {width:auto;margin:0 16px;-webkit-box-lines: multiple;-ms-flex-wrap: wrap; flex-wrap: wrap;}
    .header2 h1 {width:100%;text-align: center;}
    #divSearch {display:block;position:static;width:100%;margin-top:8px}
    #divSearch form {width:100%}
    #divTopMenu {width:100%;margin-top:12px;text-align: center;}
    .topMenu>ul>li:not(:last-child) {margin-right:24px}
    .topMenu>ul>li>a {font-size:16px}
    .topMenu>ul>li .menuList {top:30px;width:150px;padding:20px 24px}
    .topMenu>ul>li .menuList > li > a {font-size:15px}

    .header2>div .logo>a {display:inline-block;font-size:17px;background-size:76px auto;padding-right:80px;background-position:right top;line-height: 21px;margin-left:48px}
    .header2>div .logo>a>span {font-size:13px}
    #divSearch form .searchBox input[type="text"].searchInput {width:calc(100% - 40px);width:-webkit-calc(100% - 40px);height:40px;line-height: 40px;font-size:14px}
    #divSearch form .searchBox input[type="text"].searchInput::placeholder {font-size:14px}
    #divSearch form .searchBox input[type="submit"].searchBtn {width:40px;height:40px}
    #divSearch form .searchBox .autoComW {width:calc(100% - 40px);width:-webkit-calc(100% - 40px)}
    #divSearch form .searchBox .autoComBtn {top:7px;right:52px}
    #keywordRanking  {display:none}
    #divContents.on {margin-top:157px}
}


/* bgArea */
.bgArea {position:relative;height:688px;background:url(../../../image/en/main/mainBg.png) no-repeat center}
.bgArea .intro {padding-top:196px;color:#fff;font-family:rokafM,sans-serif;font-size:45px;text-align: center;letter-spacing: -0.025em;text-shadow: 5px 7px 8px rgba(0, 0, 0, 0.35);line-height: 54px;}
.bgArea .intro>span {display:block;font-size:33px;letter-spacing: -0.025em;}

.noticeSlideBox {position:absolute;bottom:20px;width:100%}
.noticeSlideW {position:relative;width:1240px;height:208px;margin:0 auto;padding:40px 200px 40px 48px;background:rgba(0,0,0,0.7);box-shadow: 14px 12px 21px 0px rgba(0, 0, 0, 0.29);-webkit-box-shadow: 14px 12px 21px 0px rgba(0, 0, 0, 0.29);box-sizing: border-box;}
.noticeSlide {position:relative;}
.noticeSlide .noticeItem {display:none;position:absolute;top:0;left:0;width:100%}
.noticeSlide .noticeItem.on {display:block}
.noticeSlide .noticeItem .tag {display:block;margin-bottom:5px;color:#71b7df;font-family: NotoSansM,sans-serif;letter-spacing: -0.05em;}
.noticeSlide .noticeItem .noticeTitle {display:block;margin-bottom:15px;color:#fff;font-family:PretendardSB,sans-serif;font-size:28px;letter-spacing: -0.01em;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.noticeSlide .noticeItem .noticeText {display:block;height:41px;color:#fff;font-family:PretendardM,sans-serif;font-size:18px;letter-spacing: -0.01em;line-height: 20px;overflow: hidden;}

.noticeBtns {position:absolute;bottom:24px;right:20px;border:1px solid #878688;font-size:0}
.noticeBtns .prev {display:inline-block;width:54px;height:54px;border-right:1px solid #878688;background:url(../../../image/en/main/noticePrev2.png) no-repeat center;text-indent: -9999px;}
.noticeBtns .next {display:inline-block;width:54px;height:54px;border-left:1px solid #878688;background:url(../../../image/en/main/noticeNext2.png) no-repeat center;text-indent: -9999px;}
.noticeBtns .pause {display:inline-block;width:54px;height:54px;background:url(../../../image/en/main/noticePause.png) no-repeat center top 19px;text-indent: -9999px;}
.noticeBtns .play {display:none;width:54px;height:54px;background:url(../../../image/en/main/noticePlay.png) no-repeat center top 19px;text-indent: -9999px;}

/* pc 와 tablet 사이 */
@media screen and (min-width:1921px) {
    .bgArea {background-size:100% 688px}
}
@media screen and (max-width:1260px) {
    .noticeSlideW {width:auto;margin:0 24px}
}
/* tablet */
@media screen and (max-width:1024px) {
    .bgArea {height:400px;background-size:1200px auto}
    .bgArea .intro {padding-top:40px;font-size:35px;line-height: 44px;}
    .bgArea .intro>span {font-size:25px}
}
/* mobile */
@media screen and (max-width:767px) {
    .noticeSlideW {width:auto;margin:0 16px}
    .bgArea {height:305px;background-size:850px auto}
    .bgArea .intro {padding-top:28px;font-size:28px;line-height: 35px;}
    .bgArea .intro>span {font-size:19px}
    .noticeSlideW {padding:20px 16px 40px 16px;height: 164px;}
    .noticeSlide .noticeItem .tag {margin-bottom:2px;font-size:13px}
    .noticeSlide .noticeItem .noticeTitle {margin-bottom:10px;font-size:18px}
    .noticeSlide .noticeItem .noticeText {font-size:15px}
    .noticeBtns {bottom: 12px;}
    .noticeBtns .prev {width:27px;height:27px;background-size:6px auto}
    .noticeBtns .next {width:27px;height:27px;background-size:6px auto}
    .noticeBtns .pause {width:27px;height:27px;background-size:5px auto;background-position:center top 10px}
    .noticeBtns .play {width:27px;height:27px;background-size:5px auto;background-position:center top 10px}
}


/* .contents1 */
.contents1 {width:1240px;margin:0 auto;padding: 42px 0 28px 0;position:relative}
.contents1::after {content:"";display:block;clear:both}
.notice {height: 468px; position: relative}
.notice h2 {float:left;color:#010101;font-size:36px;font-family:PretendardL,sans-serif;letter-spacing: -0.05em;}
.notice h2>strong {color:#010101;font-family:PretendardSB,sans-serif;font-size:36px;letter-spacing: -0.05em;}
.notice h2>span {display:block;margin-top:2px;color:#2b2b2b;font-size:16px;letter-spacing: -0.05em;font-family:Pretendard,sans-serif}
.noticeTab {float:right;overflow-x: auto; overflow-y: hidden}
.noticeTab>ul {font-size:0}
.noticeTab>ul>li {display:inline-block;}
.noticeTab>ul>li:not(:last-child) {margin-right:12px}
.noticeTab>ul>li {min-width:140px;height:55px;padding:0 12px;border:1px solid #b3b3b3;background:#fff;text-align: center;line-height: 55px;box-sizing: border-box;}
.noticeTab>ul>li.on {border:1px solid #0357be;background:#0357be;color:#fff}
.noticeTab>ul>li>a {display:block;color:#1c1c1c;font-family:Pretendard,sans-serif;font-size:18px;letter-spacing: -0.05em;}
.noticeTab>ul>li.on>a {display:inline-block;color:#fff}
.noticeTab>ul>li>a.more {display:none;width:14px;height:53px;margin-left:4px;background:url(../../../image/en/main/noticeMore.png) no-repeat center;text-indent: -9999px;}
.noticeTab>ul>li.on>a.more {display:inline-block}

.noticeTab>ul > li > .noticeListW {display: none; width:calc(100% - 444px);width:-webkit-calc(100% - 444px); position: absolute; top: 0; left: 0; margin-top: 156px;}
.noticeTab>ul > li.on > .noticeListW {display:block}

/* noticeList */
.noticeList {font-size:0;text-align: left;}
.noticeList .noticeImg {display:inline-block;width:calc(33.333% - 16px);width:-webkit-calc(33.333% - 16px);vertical-align: top;}
.noticeList .noticeImg:not(:last-child) {margin-right:24px}
.noticeList .noticeImg > a {display: block;}
.noticeList .noticeImg > a > span {display: block;height:auto;line-height: 1.2;}
.noticeList .noticeImg > a > span.noticeTitle {color: #1b1b1b; font-family:NotoSansM; font-size: 18px; letter-spacing: -0.025em; line-height: 28px; max-height: 56px; overflow: hidden;  margin-bottom: 10px;text-overflow: ellipsis;white-space: nowrap;}
.noticeList .noticeImg > a > span.noticeText {padding-bottom:50px;color:#555; letter-spacing: -0.05em; font-size:16px;line-height: 26px; height: 87px; overflow: hidden;border-bottom:1px solid #ccc}
.noticeList .noticeImg > a:hover > span.noticeText {text-decoration: underline;}
.noticeList .noticeImg > a span.addInfo {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;margin-top:18px}
.noticeList .noticeImg > a span.noticeDate {color:#888;font-size:15px;font-family: Barlow,sans-serif;}
.noticeList .noticeImg > a span.move {display:block;width:25px;height:25px;background:url(../../../image/en/main/noticeMove.png) no-repeat;text-indent: -9999px;}
.noticeList .noticeImg > a > span.tag > span {display:block;margin-bottom:26px;color:#888;font-size:15px;font-family: NotoSansM,sans-serif;letter-spacing: -0.05em;}


/* 계단식 공지사항 */
.noticeListW .difType {margin-top:-32px;border-top:2px solid #000}
.noticeListW .difType>ul>li {height:auto;padding:12px 14px 12px 24px;border-bottom:1px solid #ddd;line-height: 32px;}
.noticeListW .difType>ul>li::after {content:"";display:block;clear:both}
.noticeListW .difType>ul>li>a.tit {float:left;display:block;max-width:calc(100% - 100px);max-width:-webkit-calc(100% - 100px);color:#3b3b3b;font-size:16px;letter-spacing: -0.05em;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.noticeListW .difType>ul>li>a.tit:hover {color:#000;text-decoration: underline;}
.noticeListW .difType>ul>li .date {float:right;color:#6d6d6d;font-size:14px;font-family: Roboto,sans-serif;}
.noticeListW .difType .more {position: absolute; top: -40px; right: 12px; display: block; text-indent: -9999px; width: 28px; height: 28px; background: url('../../../image/en/main/moreBtn.png') no-repeat center center; -webkit-background-size: 14px 14px; background-size: 14px 14px}


/* popupZone */
.popupZone {position:absolute;top:162px;right:0;width: 362px;}
.popupSlide .popupImg > a {display: block; overflow: hidden}
.popupSlide .popupImg > a > img {display:block;width: 100%}
 /* popupBtnW */
.popupBtnW .btnW .popupPrev,
.popupBtnW .btnW .popupNext {display: inline-block; width: 8px; height: 25px; text-indent: -9999px; vertical-align: middle}
.popupBtnW .btnW .popupPrev {background: url('../../../image/en/main/slickPrev.png') no-repeat center center; background-size: 8px 12px; -webkit-background-size: 8px 12px}
.popupBtnW .btnW .popupNext {background: url('../../../image/en/main/slickNext.png') no-repeat center center; background-size: 8px 12px; -webkit-background-size: 8px 12px}
/* pause, play */
.popupBtnW {position:absolute;bottom:5px;left:0;width:100%;height:46px;padding-top:10px;background:rgba(0,0,0,0.5);text-align: center;z-index: 1;box-sizing: border-box;}
.popupBtnW .btnW > a {margin-right: 12px}
.popupBtnW .btnW .popupPause,
.popupBtnW .btnW .popupPlay {width: 8px; height: 25px; text-indent: -9999px}
.popupBtnW .btnW .popupPause {background: url('../../../image/en/main/slickPause.png') no-repeat center center; background-size: 8px 11px; -webkit-background-size: 8px 11px; display: inline-block}
.popupBtnW .btnW .popupPlay {background: url('../../../image/en/main/slickPlay.png') no-repeat center center; background-size: 6px 11px; -webkit-background-size: 6px 11px; display: none}
.popupNum {display: inline-block; margin-left: 8px; font-family:Roboto; letter-spacing: -0.025em; color: #fff; vertical-align: middle}
.popupNum .current {color: #ec6c61;margin-right: 2px}
.popupNum .whole {margin-left: 2px}

/* pc 와 tablet 사이 */
@media screen and (max-width:1260px) {
    .contents1 {width:auto;margin:0 24px}
    .noticeTab>ul > li > .noticeListW {width:calc(100% - 386px);width:-webkit-calc(100% - 386px)}
}
/* tablet */
@media screen and (max-width:1024px) {
    .contents1 {padding-top:24px}
    .notice {height:432px}
    .notice h2 {float:none;font-size:30px;line-height: 1.2;}
    .notice h2>strong {font-size:30px}
    .notice h2>span {font-size:15px;margin-top:0}
    .noticeTab {float:none;margin-top:16px}
    .noticeTab>ul>li {height:44px;line-height: 44px;}
    .noticeTab>ul>li>a {font-size:16px}
    .noticeTab>ul>li>a.more {margin-left:2px;height:41px;background-size:11px auto}
    .noticeTab>ul > li > .noticeListW {width:calc(100% - 8px);width:-webkit-calc(100% - 8px);margin-top:136px}

    .noticeListW .difType>ul>li {line-height: 27px;}

    .popupZone {position:relative;top:0;left:0;width:100%}

}
/* mobile */
@media screen and (max-width:767px) {
    .contents1 {width:auto;margin:0 16px}
    .notice {height:342px}
    .notice h2 {font-size:28px}
    .notice h2>strong {font-size:28px}
    .notice h2>span {font-size:14px;margin-top:0}
    .noticeTab>ul>li {min-width:100px;height:38px;line-height: 38px;}
    .noticeTab>ul>li>a {font-size:15px}
    .noticeTab>ul>li>a.more {height:37px}
    .noticeList .noticeImg > a > span.tag > span {margin-bottom:0;font-size:13px}
    .noticeList .noticeImg > a > span.noticeTitle {font-size:17px}
    .noticeList .noticeImg > a > span.noticeText {height:60px;padding-bottom:24px;font-size:14px;line-height: 20px;}
    .noticeList .noticeImg > a span.addInfo {margin-top:8px}
    .noticeList .noticeImg > a span.noticeDate {font-size:13px}
    .noticeList .noticeImg > a span.move {width:18px;height:18px;background-size:18px auto}

    .noticeListW .difType {margin-top:-10px}
    .noticeListW .difType>ul>li {padding:10px 14px 10px 12px;line-height:17px;}
    .noticeListW .difType>ul>li:nth-of-type(6) {display:none}
    .noticeListW .difType>ul>li>a.tit {font-size:14px}
    .noticeListW .difType>ul>li .date {font-size:13px}
}
@media screen and (max-width:550px) {
    .notice {height:694px}
    .notice.dif {height:342px}
    .noticeTab>ul {width:465px}
    .noticeList .noticeImg {width:100%;margin-right:0;margin-bottom:20px}
    .noticeList .noticeImg > a > span.noticeText {}
}

.contents2 {padding: 40px 0 56px; background: #f8f8f8}
.contents2>div {position:relative;width:1240px;margin:0 auto;height:520px}
.contents2>div::after {content:"";display:block;clear:both}
.contents2 h2 {float:left;color:#2b2b2b;font-size:36px;font-family:PretendardL,sans-serif;letter-spacing: -0.05em;}
.contents2 h2>strong {color:#2b2b2b;font-family:PretendardSB,sans-serif;font-size:36px;letter-spacing: -0.05em;}
.contents2 h2>span {display:block;margin-top:2px;color:#2b2b2b;font-size:16px;letter-spacing: -0.05em;font-family:Pretendard,sans-serif}
.bookTab {float:right;}
.bookTab > ul {font-size:0}
.bookTab > ul > li {display:inline-block;min-width:140px;height:55px;padding:0 12px;border:1px solid #b3b3b3;background:#fff;text-align: center;line-height: 55px;box-sizing: border-box;}
.bookTab > ul > li:not(:last-child) {margin-right:12px}
.bookTab > ul > li.on {border:1px solid #0357be;background:#0357be;color:#fff}
.bookTab > ul > li>a {display:block;}
.bookTab > ul > li > a > span {color: #1c1c1c;font-family:Pretendard,sans-serif;; font-size: 18px; letter-spacing: -0.05em; position: relative;}
.bookTab > ul > li.on > a > span {color:#fff}
/* hover,click effect */

.bookTab > ul > li > .bookListW {display: none; position: absolute; top: 122px; left: 0; width: 100%}
.bookTab > ul > li.on > .bookListW {display: block; text-align: center}

.bookListW .bookList{position: relative; height: 300px;}
.bookListW .bookList.noList{text-align: center;margin-top: 100px;padding-top: 110px;font-size: 20px;color: #000;height: 93px;background:url(../../../image/en/main/noResult2.png) no-repeat center top;}
.bookListW .intraBook.noList{text-align: center;margin-top: 100px;padding-top: 110px;font-size: 20px;color: #000;height: 93px;background:url(../../../image/en/main/noResult2.png) no-repeat center top;}
.bookListW .bookList .slick-track{top: 20px;}
.bookListW .bookList div a {}
.bookList .bookImg > a {display:block}
.bookList .bookImg > a span.bookCoverBg {display:block;position:relative;width:154px;height:206px;margin:0 auto;background:url(../../../image/en/main/bookBg.png) no-repeat;transition:.3s;-webkit-transition:.3s}
.bookList .bookImg > a:hover span.bookCoverBg {transform: translateY(-10px);-webkit-transform: translateY(-10px)}
.bookList .bookImg > a span.bookCoverBg img {position:absolute;top:1px;left:1px;width:147px;height:204px;z-index: 1;}
.bookList .bookImg > a .bookInfo {}
.bookList .bookImg > a .bookInfo span.bookTitle {display:block;max-width:98%;height:auto;margin-top:24px;line-height: 1.2;color:#000;font-size:16px;letter-spacing: -0.05em;font-family: NotoSansDL,sans-serif;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.bookList .bookImg > a .bookInfo span.writer {display:block;max-width:98%;height:auto;margin-top:8px;line-height: 1.2;color:#6f6660;font-size:14px;font-family: NotoSansDL,sans-serif;letter-spacing: -0.075em;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}

/* moreList2 */
.bookListW .moreList2 {background:#f8f8f8;display:inline-block;width:176px;margin-top:48px;line-height: 1.2;height:auto;border:1px solid #d1d1d1;text-align: center;}
.bookListW .moreList2 .more {display:block;padding:14px 0;color:#2b2b2b;transition:.5s}
.bookListW .moreList2 .more:hover {background:#0357be;color:#fff}
/*bookPrev, bookNext*/
.bookListW .bookPrev,
.bookListW .bookNext {width: 34px; height: 70px; position: absolute;top:50%;transform: translateY(-50%);-webkit-transform: translateY(-50%); text-indent: -9999px; z-index: 2}
.bookListW .bookPrev {background: url('../../../image/en/main/bookPrev.png') no-repeat center center;left: -90px}
.bookListW .bookNext {background: url('../../../image/en/main/bookNext.png') no-repeat center center;right: -90px}

/* intraBook */
.contents2>div.intra {height: 524px;}
.intraBookSlide ul::after {content:"";display:block;clear:both}
.intraBookSlide ul li {float:left;width:calc(33.333% - 14px);width:-webkit-calc(33.333% - 14px);margin:0 20px 20px 0}
.intraBookSlide ul li>a {display:block;position:relative;padding:21px 32px;border:1px solid #fff;background:#fff;text-align: left;box-shadow: 3px 4px 18px 0px rgba(0, 0, 0, 0.03);-webkit-box-shadow: 3px 4px 18px 0px rgba(0, 0, 0, 0.03);transition:.3s;-webkit-transition:.3s}
.intraBookSlide ul li>a:hover {border:1px solid #0357be}
.intraBookSlide ul li>a .bookTitle {display:block;max-width:98%;margin-bottom:2px;color:#000;font-family: PretendardM,sans-serif;letter-spacing: -0.05em;font-size:16px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;height:auto;line-height: 1.2;}
.intraBookSlide ul li>a .writer {display:block;max-width:98%;color:#919191;font-size:14px;letter-spacing: -0.05em;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;height:auto;line-height: 1.2;}
.intraBookSlide ul li>a .arrow {position:absolute;top:50%;right:16px;transform: translateY(-50%);-webkit-transform: translateY(-50%);width:7px;height:11px;background:url(../../../image/en/main/bookMove.png) no-repeat;text-indent: -9999px;}

.intraBook .bookPrev, .intraBook .bookNext {top:38%}

/* pc 와 tablet 사이 */
@media screen and (min-width:768px) {
    .intraBookSlide ul li:nth-of-type(3n) {margin-right:0}
}
@media screen and (max-width:1440px) {
    .bookListW .bookPrev {left:-45px}
    .bookListW .bookNext {right:-45px}
}
@media screen and (max-width:1360px) {
    .bookListW .bookPrev {left:0px}
    .bookListW .bookNext {right:0px}
    .intraBook .slick-list {margin:0 60px}

}
@media screen and (max-width:1260px) {
    .contents2>div {width:auto;padding:0 24px}
    .intraBook {margin:0 24px}
    .bookListW .bookPrev {left:0px}
    .bookListW .bookNext {right:0px}
}
@media screen and (max-width:1024px) {
    .contents2 h2 {font-size:30px;line-height: 1.2;}
    .contents2 h2>strong {font-size:30px}
    .contents2 h2>span {font-size:15px;margin-top:0}
    .bookTab > ul > li {height:44px;line-height: 44px;}
    .bookTab > ul > li>a>span {font-size:16px}
    .bookListW .slick-list {padding-bottom:10px}
    .bookListW .slick-slide {width:200px}
    .intraBook .slick-list {margin:0;padding-bottom:0}

}
@media screen and (max-width:767px) {
    .contents2 {padding:24px 0 28px 0}
    .contents2>div {height:488px;padding:0 16px}
    .contents2 h2 {float:none;font-size:28px}
    .contents2 h2>strong {font-size:28px}
    .contents2 h2>span {font-size:14px;margin-top:0}
    .bookTab {float:none;margin-top:16px}
    .bookTab > ul > li {min-width:100px;height:38px;line-height: 37px;}
    .bookTab > ul > li>a>span {font-size:15px}

    .bookListW .moreList2 {width:100px;margin-top:8px}
    .bookListW .moreList2 .more {padding:10px 0;font-size:14px}

    .intraBook {margin:0 16px}
    .intraBookSlide ul li {width:calc(50% - 6px);width:-webkit-calc(50% - 6px);margin:0 12px 12px 0}
    .intraBookSlide ul li:nth-of-type(2n) {margin-right:0}
    .intraBookSlide ul li>a {padding:12px 16px}
    .intraBookSlide ul li>a .bookTitle {font-size:14px}
    .intraBookSlide ul li>a .writer {font-size:12px}
    .intraBookSlide ul li>a .arrow {right:4px}
}

/* pointArea */
.pointArea{padding-top: 50px;box-sizing: border-box;background-image: url(../../../image/en/main/origin.png);background-repeat: no-repeat;background-position:center;box-shadow: inset 5px 7px 32px 0px rgba(0, 0, 0, 0.35);-webkit-box-shadow: inset 5px 7px 32px 0px rgba(0, 0, 0, 0.35);}

.pointArea>div {width:1240px;margin:0 auto}
.pointArea>div::after {content:"";display:block;clear:both}
.pointArea h2 {color:#fff;font-size:36px;font-family:PretendardL,sans-serif;letter-spacing: -0.05em;}
.pointArea h2>strong {color:#fff;font-family:PretendardSB,sans-serif;font-size:36px;letter-spacing: -0.05em;}
.pointArea h2>span {display:block;margin-top:2px;color:#e7e7e7;font-size:16px;letter-spacing: -0.05em;font-family:Pretendard,sans-serif}
.statusTab {
    margin-top: 16px;
}
.statusTab>ul {font-size:0}
.statusTab>ul>li {display:inline-block;width: 180px;height: 55px;margin-bottom: 12px;border:1px solid #b3b3b3;background:#fff;text-align: center;line-height: 55px;box-sizing: border-box;}
.statusTab>ul>li:not(:last-child) {margin-right:12px}
.statusTab>ul>li.on {border:1px solid #0357be;background:#0357be;color:#fff}
.statusTab>ul>li>a {display:block;}
.statusTab>ul>li>a>span {display:inline-block;color: #1c1c1c;font-family:Pretendard,sans-serif;font-size: 18px;letter-spacing: -0.05em;position: relative;line-height: 1.2;}
.statusTab>ul>li.on>a>span {color:#fff;}
@media screen and (max-width:1260px){
    .pointArea.intra h2 {float:none}
    .pointArea.intra .statusTab {float:none;margin-top:32px}

    .pointArea>div {width:auto;margin:0 24px}
}
@media screen and (max-width:1024px){
    .pointArea h2 {font-size:30px;line-height: 1.2;}
    .pointArea h2>strong {font-size:30px}
    .pointArea h2>span {font-size:15px;margin-top:0}
    .statusTab {margin-top:32px}
    .statusTab>ul>li>a>span {font-size:16px}
}
@media screen and (max-width:767px){
	.pointArea.internet .statusTab>ul>li {width: 135px;height: 45px; padding:0}
    .statusTab>ul>li>a>span {font-size:13px;padding:6px 12px 6px 4px}
}


/* pointArea internet */
.pointArea.internet {height:264px;background-attachment: fixed}
.statusTab>ul>li>div.slideMenu {display:none;position:absolute;top:53px;left:-1px;background:#fff;width:100%;border:1px solid #fff;border-top:1px solid #b3b3b3;z-index: 1;box-shadow: 2px 2px 8px rgba(0,0,0,0.3);}
.pointArea.internet .statusTab>ul>li {position:relative}
.pointArea.internet .statusTab>ul>li>a>span {display: block;padding:6px 16px 6px 8px;background:url(../../../image/en/main/statusArrow.png) no-repeat right 4px center;}
.pointArea.internet .statusTab>ul>li.on>a>span {background:url(../../../image/en/main/statusArrowOn.png) no-repeat right center}
.statusTab>ul>li>div.slideMenu.on {border-top:1px solid #fff}
.statusTab>ul>li>div.slideMenu>ul {padding:12px}
.statusTab>ul>li>div.slideMenu>ul>li {height:auto;line-height: 1.2;}
.statusTab>ul>li>div.slideMenu>ul>li:not(:last-child) {margin-bottom:12px}
.statusTab>ul>li>div.slideMenu>ul>li>a {color:#1c1c1c}
@media screen and (max-width:1024px) {
    .pointArea.internet {padding-top:36px;background-attachment: unset;background:url(../../../image/en/main/origin.png); background-position: center bottom -206px;height: 326px;}
    .statusTab>ul>li>div.slideMenu {top:42px}
    .statusTab>ul>li>div.slideMenu>ul>li>a {font-size:14px}
}
@media screen and (max-width:767px){
    .statusTab>ul>li>div.slideMenu>ul>li>a {font-size:13px}
    .statusTab>ul>li>div.slideMenu {top:36px}
}
@media screen and (max-width:480px){
    .pointArea.internet {padding-top:40px}
    .pointArea.internet .statusTab>ul {/*width:212px;*/margin:0 auto}
    .pointArea.internet .statusTab>ul>li:nth-of-type(2n) {margin-right:0}
}
/* pointArea intra */
.pointArea.intra {height:632px;background-position:center bottom -60px}
.pointArea.intra>div {position:relative}
.pointArea.intra .tabMenuW {display:none;position:absolute;top: 174px;left:0;width:100%;border:1px solid #e2e2e2;text-align: left;line-height: 1.2;}
.pointArea.intra .statusTab>ul>li.on .tabMenuW {display:block}
.pointArea.intra .tabMenu {display: -webkit-box; display: -ms-flexbox; display: flex;}
.pointArea.intra .tabMenu .classify {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: center;-webkit-box-align: center; -ms-flex-align: center; align-items: center;width:256px;min-height:344px;background:#f6f6f6;text-align: center;}
.pointArea.intra .tabMenu .classify>div {margin-top:-20px}
.pointArea.intra .tabMenu .classify .ko {padding-top:136px;color:#525252;font-size:26px;font-family: NotoSansM,sans-serif;}
.pointArea.intra .tabMenu .classify .en {margin-top:8px;color:#a3a3a3;font-family:MontserratM,sans-serif;line-height: 21px;}
.pointArea.intra .tabMenu .classify .army {background:url(../../../image/en/main/army.png) no-repeat center top}
.pointArea.intra .tabMenu .classify .navy {background:url(../../../image/en/main/navy.png) no-repeat center top}
.pointArea.intra .tabMenu .classify .airForce {background:url(../../../image/en/main/airForce.png) no-repeat center top}
.pointArea.intra .tabMenu .classify .direct {background:url(../../../image/en/main/direct.png) no-repeat center top}
.pointArea.intra .tabMenu .classify .marine {background:url(../../../image/en/main/marine.png) no-repeat center top}
.pointArea.intra .tabMenu .listArea {width:calc(100% - 256px);width:-webkit-calc(100% - 256px);min-height:344px;max-height:344px;padding:44px 52px 30px 52px;background:#fff;box-sizing: border-box;overflow-y: auto;}
.pointArea.intra .tabMenu .listArea>ul {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-lines: multiple;-ms-flex-wrap: wrap; flex-wrap: wrap;}
.pointArea.intra .tabMenu .listArea>ul>li {width:calc(25% - 9px);margin-right:12px;margin-bottom:12px}
.pointArea.intra .tabMenu .listArea>ul>li>a {display:inline-block;padding-left:26px;background:url(../../../image/en/main/statusList.png) no-repeat left top 2px;color:#050505;font-size:16px}
.pointArea.intra .tabMenu .listArea>ul>li>a:hover {text-decoration: underline;}

@media screen and (max-width:1260px){
    .pointArea.intra {height:680px}
    .pointArea.intra .tabMenuW {top:180px}
}


@media screen and (min-width:1161px) {
    .pointArea.intra .tabMenu .listArea>ul>li:nth-of-type(4n) {margin-right:0}
}
@media screen and (min-width:1025px) and (max-width:1160px) {
    .pointArea.intra {height:680px}
    .pointArea.intra .tabMenu .listArea>ul>li {width:calc(33.333% - 9px)}
    .pointArea.intra .tabMenu .listArea>ul>li:nth-of-type(3n) {margin-right:0}
}
@media screen and (min-width:851px) and (max-width:1024px) {
    .pointArea.intra {height:620px}
    .pointArea.intra .tabMenuW {top:156px}
    .pointArea.intra .tabMenu .classify {display:none}
    .pointArea.intra .tabMenu .listArea {width:100%;padding:30px 28px 15px 28px;min-height:295px;max-height:295px}
    .pointArea.intra .tabMenu .listArea>ul>li {width:calc(25% - 9px)}
    .pointArea.intra .tabMenu .listArea>ul>li:nth-of-type(4n) {margin-right:0}
}
@media screen and (min-width:651px) and (max-width:850px) {
    .pointArea.intra {height:626px;padding-top:40px}
    .pointArea.intra .tabMenuW {top:156px}
    .pointArea.intra .tabMenu .classify {display:none}
    .pointArea.intra .tabMenu .listArea {width:100%;padding:30px 28px 15px 28px;min-height:295px}
    .pointArea.intra .tabMenu .listArea>ul>li {width:calc(33.333% - 9px)}
    .pointArea.intra .tabMenu .listArea>ul>li:nth-of-type(3n) {margin-right:0}
}
@media screen and (min-width:400px) and (max-width:650px) {
    .pointArea.intra {height:626px;padding-top:40px}
    .pointArea.intra .tabMenuW {top:156px}
    .pointArea.intra .tabMenu .classify {display:none}
    .pointArea.intra .tabMenu .listArea {width:100%;padding:30px 28px 15px 28px;min-height:295px}
    .pointArea.intra .tabMenu .listArea>ul>li {width:calc(50% - 9px)}
    .pointArea.intra .tabMenu .listArea>ul>li:nth-of-type(2n) {margin-right:0}
}
@media screen and (max-width:399px) {
    .pointArea.intra {height:626px;padding-top:40px}
    .pointArea.intra .tabMenuW {top:156px}
    .pointArea.intra .tabMenu .classify {display:none}
    .pointArea.intra .tabMenu .listArea {width:100%;padding:30px 28px 15px 28px;min-height:295px}
    .pointArea.intra .tabMenu .listArea>ul>li {width:100%;margin-right:0}
}

@media screen and (max-width:1024px) {
    .pointArea.intra .statusTab {overflow: auto;overflow-y: hidden;}
    .pointArea.intra .statusTab>ul {width:958px;}
}

@media screen and (max-width:767px) {
    .pointArea.intra {height:556px}
    .pointArea.intra .tabMenuW {top:140px}
    .pointArea.intra .tabMenu .listArea {min-height:332px;max-height:332px;overflow: auto;overflow-x: hidden;padding:20px;}
    .pointArea.intra .tabMenu .listArea>ul>li {margin-bottom:8px}
    .pointArea.intra .tabMenu .listArea>ul>li>a {padding-left:22px;background-position:left top 1px;font-size:14px}
    .pointArea.intra .statusTab>ul {width:860px;}
}
@media screen and (max-width:325px) {
    .pointArea h2>strong {font-size:26px}
}


@media screen and (min-width:1921px) {
    .pointArea {background-size:cover}
}

/* banner */
.banner {background: #fff; position: relative}
.bannerListW {position: relative;width:1240px; height:108px;margin:0 auto;padding:26px 0;box-sizing: border-box;}
.bannerList {margin-left:150px}
.bannerList .slick-list {padding-bottom:10px}
.bannerList .bannerImg > a {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center;width:170px;height: 55px;border:1px solid #ddd;box-shadow: 4px 4px 12px -4px rgba(0, 0, 0, 0.19);-webkit-box-shadow: 4px 4px 12px -4px rgba(0, 0, 0, 0.19);box-sizing: border-box;color:#333;padding:0 12px;line-height: 1.2;}
.bannerBtnW {position: absolute; left: 0; top: 50px; box-sizing: border-box;}
.bannerList .bannerImg > a img {display:block;width:168px;height:auto;margin-left:-12px}
.bannerList {padding-bottom:10px}


/*bannerBtnW*/
.bannerBtnW .bannerPrev,
.bannerBtnW .bannerNext {width: 7px; height: 10px; display: inline-block; text-indent: -9999px}
.bannerBtnW .bannerPrev {padding-right:8px;background: url('../../../image/en/main/bannerPrev.png') no-repeat left center; -webkit-background-size: 7px 10px; background-size: 7px 10px}
.bannerBtnW .bannerNext {position:relative;padding-left:14px;background: url('../../../image/en/main/bannerNext.png') no-repeat right center; -webkit-background-size: 7px 10px; background-size: 7px 10px}
.bannerBtnW .bannerNext::before {content:"";display:block;position:absolute;top:0;left:0;width:1px;height:10px;background:#ccc}

/* .bannerBtnW .bannerPlay.hidden, .bannerBtnW .bannerPause.hidden {display:none}
.bannerBtnW .slick-arrow.slick-hidden {display:none} */

/* footer */
.footer{padding: 30px 0;background: #3e3e3e}
.footerMenuW {width:1240px;margin:0 auto}
/* footerMenu1 */
.footerMenu1 {margin-bottom: 35px;text-align: right;}
.footerMenu1 > ul li {display: inline-block; margin-left: 60px}
.footerMenu1 > ul li:first-of-type {margin-left: 0}
.footerMenu1 > ul li a {color: #b1b1b1}
/* relationSiteW */
.footerMenu1 .relationSiteW > a.siteGoto {display: inline-block; color:rgba(255,255,255,0.7); font-family:MontserratSB,sans-serif; height: 40px; line-height: 38px; padding: 0 11px; background: #5d5d5d; margin-left: 3px;vertical-align: top;}
.footerMenu1 .relationSiteW .relationSite {display: inline-block; width: 192px}
.footerMenu1 .relationSiteW .relationSite select#relSite {width:100%; height: 40px; line-height: 38px; border: 1px solid rgba(226,227,242,0.18); padding: 0 15px; box-sizing:border-box; position: relative; color: rgba(255,255,255,0.5); background: url(../../../image/en/siteArrow.png) no-repeat right 10px center #3e3e3e; -webkit-background-size: 10px 5px; background-size: 10px 5px}
.footerMenu1 .relationSiteW .relationSite select#relSite option {background:#3e3e3e}

/* footerMenu2 */
.footerMenu2 {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.footerMenu2 .libraryInfo {text-align: right;}
.footerMenu2 .libraryInfo ul {margin-bottom:24px;text-align: right;font-size:0;}
.footerMenu2 .libraryInfo ul>li {display:inline-block}
.footerMenu2 .libraryInfo ul>li:not(:last-child) {margin-right:40px}
.footerMenu2 .libraryInfo ul>li>a {color:#b1b1b1;font-size:15px;letter-spacing: -0.05em;}
.footerMenu2 .libraryInfo ul>li>a.privacy {color:#fff}
.footerMenu2 address {color: rgba(254,254,254,0.5); line-height: 20px; letter-spacing: -0.05em;font-family: Montserrat,NotoSans,sans-serif;}
.footerMenu2 .copyright {color: rgba(254,254,254,0.5); line-height: 20px; letter-spacing: 0; font-family: Montserrat,NotoSans,sans-serif}
/* count */
.footerMenu2 .count ul {display: inline-block;text-align: left;}
.footerMenu2 .count ul li {font-size: 15px; color: #cfcfcf; padding-bottom: 4px;}
.footerMenu2 .count ul li:last-child {padding-bottom: 0}
.footerMenu2 .count ul li span {margin-left: 15px; font-family: Montserrat,sans-serif;color:#cfcfcf}

/* pc 와 tablet 사이 */
@media screen and (max-width:1260px) {
    .bannerListW {width:auto;margin:0 24px}
    .footerMenuW {width:auto;margin:0 24px}
}
/* tablet */
@media screen and (max-width:1024px) {
    .bannerList {margin-left:80px}
    .footer {padding:28px 0 40px 0}
    .footerMenu1 {margin-bottom:24px}
    .footerMenu2 .libraryInfo {width:calc(100% - 170px);width:-webkit-calc(100% - 170px)}
}
/* mobile */
@media screen and (max-width:767px) {
    .bannerListW {width:auto;margin:0 16px}
    .footerMenuW {width:auto;margin:0 16px}
    .footerMenu1 {margin-bottom:12px;text-align: center;}
    .footerMenu2 {display:block}
    .footerMenu2 .count {margin-bottom: 16px;text-align: center;}
    .footerMenu2 .libraryInfo {width:100%;text-align: center;}
    .footerMenu2 .libraryInfo ul {text-align: center;margin-bottom: 8px;}
}

@media screen and (max-width:470px) {
    .bannerList {margin-left:60px}
    .bannerList .bannerImg > a {margin:0 auto}
}

/* topBtn */
a.topBtn {display: block; visibility: hidden; opacity: 0; position: fixed; bottom: 160px; right: 24px; z-index: 10; width: 97px; height: 97px; text-align: center; color: #ededec; font-family:RobotoM; padding-top: 48px; background: #3067b9 url('../../../image/en/topBtn.png') no-repeat center center; box-sizing: border-box; -webkit-box-shadow: 3px 5px 5px rgba(0,0,0,0.23); box-shadow: 3px 5px 5px rgba(0,0,0,0.23)}
a.topBtn.on {visibility: visible; opacity: 1}
a.topBtn,
a.topBtn.on {transition: all 0.5s ease; -webkit-transition: all 0.5s ease}
a.topBtn:before,
a.topBtn:after {content: ''; display: block; width: 100%; height: 8px; background: url('../../../image/en/topBtnArrow.png') no-repeat center center; background-size: 13px 8px; -webkit-background-size: 13px 8px}
a.topBtn:after,
a.topBtn:before  {opacity: 0; position: absolute; left: 50%; top: 28%; transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; transform: -webkit-translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0)}
a.topBtn:before {-webkit-animation: movement1 2s ease-in-out infinite; animation: movement1 2s ease-in-out infinite}
a.topBtn:after {-webkit-animation: movement1 2s 1s ease-in-out infinite; animation: movement1 2s 1s ease-in-out infinite}
@media screen and (min-width: 1289px) and (max-width: 1500px){
    a.topBtn {right: 5%}
}
@media screen and (max-width: 1024px){
    a.topBtn {display: none}
}

@keyframes movement1 {
    0% {
        opacity: 0;
        top: 38%;
    }
    70% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-webkit-keyframes movement1 {
    0% {
        opacity: 0;
        top: 38%;
    }
    70% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

/* 다국어입력 */
.languageWrap {display:none;width:550px;background: #EBEBEB; box-shadow: rgba(0, 0, 0, 0.5) 0px 2px 5px; border-radius: 5px;position: absolute; left: 0; top: 52px; z-index: 2;}
.languageContent{background: #EBEBEB; border-radius: 0 0 5px 5px;}
.languageContent .tit{display: block; color: #3a3b3d; font-size: 18px; font-family:NotoSansM; margin-left: 4px;}
.languageContent .languageSelect a{display: inline-block; margin:  4px 2px; padding: 0 10px; border: 1px solid #3a3a3c; border-radius: 5px; color: #343a40; height: 38px; line-height: 38px; -webkit-transition: 0.3s; transition: 0.3s;}
.languageContent .languageSelect a:hover{background: #343a40; color: #fff;}
@media screen and (max-width: 767px){
    .languageWrap{display: none !important;}
}
/* 다국어입력 */

/* 상단공지 */
.topInfo .closeBox {background:#555}
.topInfo .closeBox>div {display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: flex-end;-webkit-box-align: center; -ms-flex-align: center; align-items: center;width:1240px;height:35px;margin:0 auto}
.topInfo .closeBox input[type="checkbox"] {width:13px;height:13px;margin:2px 7px 0 0}
.topInfo .closeBox a {color:#fff;font-size:14px;letter-spacing: -0.05em;}
.topInfo .closeBox .closeBtn {display:inline-block;width:12px;height:10px;margin:2px 0 0 7px;background:url(../../../image/en/main/topInfoClose.png) no-repeat;text-indent: -9999px;}

/* 레이어 스타일 */
.layerNotice {position:fixed;border-radius: 5px;z-index: 100;overflow: hidden;box-shadow: 1px 4px 31.36px 0.64px rgba(0, 0, 0, 0.3);-webkit-box-shadow: 1px 4px 31.36px 0.64px rgba(0, 0, 0, 0.3);}
.layerNotice .topArea {background:#3f54a9;padding:15px 20px}
.layerNotice .topArea p {color:#fff;font-size:19px;letter-spacing: -0.05em;}
.layerNotice .contentAreaW {background:#fff;padding:18px}
.layerNotice .contentArea {max-height:530px;margin-bottom:16px;overflow-y: auto;}
.layerNotice .contentArea img {width:100%;height:auto}

.layerNotice .closeArea {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;}
.layerNotice .closeArea input[type="checkbox"] {width:14px;height:13px}
.layerNotice .closeArea label {color:#141414;font-size:14px;letter-spacing: -0.05em;}
.layerNotice .closeArea .closeBtn {padding-right:22px;background:url(../../../image/en/main/layerClose.png) no-repeat right top 5px;color:#141414;font-family: NotoSansM,sans-serif;}

@media screen and (min-width: 1921px){
    .topInfo {background-size:cover}
}
@media screen and (min-width:1024px) and (max-width: 1288px){
    .topInfo {padding:0 24px}
    .topInfo .infoList {width:auto}
    .topInfo .infoList>ul>li {padding:0 20px 0 0}
    .topInfo .closeBox {right:20px}
}
@media screen and (min-width:720px) and (max-width: 1024px){
    .topInfo {padding:0 20px}
    .topInfo .infoList {width:100%;margin-left:0;padding-top:38px}
    .topInfo .infoList>ul>li {padding:0 20px 0 0}
    .topInfo .closeBox {transform: none;top:auto;right:20px;bottom:12px;}
}

@media screen and (max-width: 767px){
    .topInfo {padding:0 20px;background:none;background:#e7f2f9;height:128px}
    .topInfo .infoList {width:100%;margin-left:0;padding-top:14px}
    .topInfo .infoList>ul>li {float:none;width:100%;padding:0 20px 0 0}
    .topInfo .infoList>ul>li:not(:last-child) {margin-bottom:6px}
    .topInfo .infoList>ul>li>a {font-size:14px;background-position:left top 5px}
    .topInfo .infoList>ul>li p.txt {margin-top:0;font-size:13px}
    .topInfo .closeBox {transform: none;top:auto;right:10px;bottom:8px;}

    .layerNotice .contentArea {max-height:250px}
}

/* 챗봇 */
.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/en/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/en/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/en/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/en/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/en/chatbot/bg-bots-type.png) no-repeat 0 0; }
ul.bots li a span.trafic { background: url(../../../image/en/chatbot/bg-bots-type.png) no-repeat -30px 0; }
ul.bots li a span.weather { background: url(../../../image/en/chatbot/bg-bots-type.png) no-repeat -60px 0; }
ul.bots li a span.movie { background: url(../../../image/en/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/en/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/en/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/en/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/en/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/en/chatbot/tts_play_button.png) no-repeat center/cover; cursor:pointer;  position:absolute;}
.message li.bot .avata.tts.active {background: url(../../../image/en/chatbot/tts_active_button.png) no-repeat center/cover;}
.message li.bot .avata.tts.active:hover {background: url(../../../image/en/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/en/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/en/chatbot/microphone.png) no-repeat 0 0; cursor:pointer; background-size:20px; }
.write-form i.microphone.active {background: url(../../../image/en/chatbot/microphone-active.gif) no-repeat 0 0; background-size:20px; }
.write-form i.microphone.disable {background: url(../../../image/en/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/en/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/en/chatbot/avata_set.png) no-repeat 0 0; }
.message.trafic li.bot .avata { background: url(../../../image/en/chatbot/avata_set.png) no-repeat -43px 0; }
.message.weather li.bot .avata { background: url(../../../image/en/chatbot/avata_set.png) no-repeat -86px 0; }
.message.movie li.bot .avata { background: url(../../../image/en/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/en/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/en/chatbot/opinion_back.png) no-repeat 40px center/contain; float:left; }
.opinions .opinion-header .top-btn.cancel {background: url(../../../image/en/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/en/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/en/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}