@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');
}

/* Layout */
* {margin:0;padding:0;font-weight:400;letter-spacing: -0.03em;}
#divWrapper{font-family:NotoSans, sans-serif;overflow:hidden;}
a:hover{color: inherit;}
a, input{font-family:NotoSans, sans-serif; display: block;}
.topInfo > div,.header1, .header2 > div, .quickMenu, .contents2, .bookContent, .userGuide, .bannerListW, .footerMenu > div, .libraryInfo{
        width: 1280px; margin: 0 auto;
}
.header{position: relative;}
/* PC와 테블릿 사이 */
@media screen and (min-width:1025px) and (max-width: 1340px){
    .topInfo > div, .header1, .header2 > div, .quickMenu, .contents2, .bookContent, .userGuide, .bannerListW, .footerMenu > div, .libraryInfo{
        width: auto; margin: 0 20px;
    }
}
#divContents{width: 100%;}

/* 상단고정 */
.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;}

/*topInfo*/
.topInfo{position:relative;background:url(../../../../image/ko/local/main/topInfoBg.png) no-repeat; background-size: cover; color: #fffefe;}
.topInfo > div{position:relative; height:130px}
.topInfo_box{padding-top: 25px;}
.topInfo_box > ul > li{max-width:70%;}
.topInfo_box > ul > li:not(:first-of-type){margin-top: 10px;}
.topInfo_box > ul > li > a{position: relative; display:block; padding-left:15px; color: #fffefe;font-size:15px; font-family:NotoSansM, sans-serif;line-height:17px; overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.topInfo_box > ul > li > a:hover{color: #fff; text-decoration: underline;}
.topInfo_box > ul > li > a::after{display: block; content: ''; position: absolute; left: 8px; top: 8px; width: 4px; height: 1px; background-color: #fffefe;}
.topInfoCloseBox{position:absolute;top:70px;right:0; font-size:13px;color:rgba(255, 255, 255, 0.77);vertical-align: middle;}
.topInfoCloseBox input[type="checkbox"]{vertical-align: middle; display: inline-block;}
.topInfoCloseBox label{vertical-align: middle;padding-right:12px; cursor: pointer;}
.topInfoCloseBox .close{position: relative; top: 7px;display: inline-block; width: 22px;height: 22px;}

/* header1 */
.header1{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: space-between;padding: 22px 0;}
.header1 .logo a{width: 260px; height: 38px;}
.header1 .logo a img{width: 100%; height: 100%;}
#globalMenu > ul, #globalMenu ul.university{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#globalMenu > ul > li > a{display: inline-block;}
#globalMenu > ul > li ul.university > li{margin-left: 12px; }
#globalMenu > ul > li ul.university > li:not(:last-of-type){padding-right: 12px; background: url(../../../../image/ko/local/globalMenuBar.png) no-repeat right top 5px;}
#globalMenu > ul > li ul.university > li.fric a{color: #b2216c;}
#globalMenu > ul > li ul.university > li.university2{position: relative;}
#globalMenu > ul > li ul.university > li.university2 > a{padding-right: 15px; background: url(../../../../image/ko/local/arrow.png) no-repeat right top 8px;}
#globalMenu > ul > li ul.university > li.university2 > a.on, #globalMenu > ul > li ul.university > li.university2 > a:hover{background: url(../../../../image/ko/local/arrowOn.png) no-repeat right top 8px;}
#globalMenu > ul > li ul.university > li ul{opacity: 0; visibility: hidden; -webkit-transition: 0.3s; transition: 0.3s; position: absolute; left: -21px;top: 26px; padding: 14px 22px; width: 160px; height: 117px; border: 1px solid #b3b3b3; box-sizing: border-box; background-color: #fff; z-index: 22; box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.22);}  
#globalMenu > ul > li ul.university > li ul.on{opacity: 1; visibility: visible;}
#globalMenu > ul > li ul.university > li ul li:not(:last-of-type){margin-bottom: 11px;}
#globalMenu > ul > li ul.university > li ul li a{line-height: 1; font-size: 13px; color: #4c4c4c;}
#globalMenu > ul > li ul.university > li.university2 a:hover, #globalMenu > ul > li ul.university > li.university2 a.on{color: #2d56be;}
#globalMenu > ul > li ul.university > li ul li:hover a{color: #2d56be; text-decoration: underline;}
#globalMenu > ul > li.language{margin-left: 30px;}
#globalMenu > ul > li.language a{color: #014099; font-family:RobotoM, sans-serif;}
#globalMenu > ul > li.login{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-align: center; -ms-flex-align: center; align-items: center;background: url(../../../../image/ko/local/globalMenuBar.png) no-repeat right top 5px;padding-right: 12px;margin-left: 12px;}
#globalMenu>ul>li.login:first-child {margin-left: 0;}
#globalMenu > ul > li.login > p{color: #0d4296; font-family:NotoSansM, sans-serif; margin-right: 8px;}
#globalMenu > ul > li.login .myMenuArea > .myMenuBtn{position: relative; padding-left: 13px; margin-right: 10px; width: 84px; height: 20px; line-height: 20px; text-align: center; background: #2d56be; border-radius: 5px; font-size: 13px; font-family:NotoSansM, sans-serif; color: #fff; box-sizing: border-box;}
#globalMenu > ul > li.login .myMenuArea > .myMenuBtn::after{display: block; content: ''; position: absolute; left: 13px; top: 3px; background: url(../../../../image/ko/local/myInfoIcon.png) no-repeat; width: 8px;height: 14px;}
#globalMenu > ul > li.login .myMenuArea > .leaveBtn{position: relative; margin-right: 10px; width: 84px; height: 20px; line-height: 20px; text-align: center; background: #2d56be; border-radius: 5px; font-size: 13px; font-family:NotoSansM, sans-serif; color: #fff; box-sizing: border-box;}
#globalMenu > ul > li.login .myMenuArea > .leaveBtn::after{display: block; content: ''; position: absolute; left: 13px; top: 3px; width: 8px;height: 14px;}
#globalMenu > ul > li.login > a{color: #292929; font-family: NotosansM, sans-serif;}
#globalMenu .otpModal {background: #b2216c;border: none;color: #fff;padding: 0 8px;border-radius: 5px;font-size: 14px;font-family: 'NotoSansM', sans-serif;line-height: 24px;cursor: pointer;}

/* 요약정보 */
.myMenu{display:none; position:absolute; left:0; top:82px; width:100%;background:#ececef;z-index:22;}
.myMenu > div {width: 1300px; box-sizing:border-box;position:relative; margin:0 auto;padding:24px 40px 20px 20px}
.myMenu .myMenuListW:after {content:"";display:block;clear:both}
.myMenu .myInfo {float:left;width:300px;margin-right:10px;}
.myInfo p.infoTit {margin-bottom:12px;color:#231815;font-size:17px;letter-spacing:-0.05em}
.myInfo p.infoTit:after {content:"";display:block;clear:both}
.myInfo p.infoTit span.user {float:left;max-width:150px;color:#231815;font-family:NotoSansM;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.myInfo ul.summaryInfo li {position:relative;color:#333;font-size:14px;}
.myInfo ul.summaryInfo li:before{position: absolute;left:-8px;top:10px;content:'';width:4px;height:1px;background:#333;}
.myInfo ul.summaryInfo li:first-child:before {display:none}
.myInfo ul.summaryInfo li:first-child{margin-bottom:9px}
.myInfo ul.summaryInfo li:first-child div{display: inline-block;}
.myInfo ul.summaryInfo li:first-child div .payment{display: inline-block;}
.myInfo ul.summaryInfo li span{color:#333}
.myInfo ul.summaryInfo li div {line-height:13px; padding-right: 10px; position: relative;}
.myInfo ul.summaryInfo li div > span:nth-of-type(2) {color:#0090cc}
.myInfo ul.summaryInfo li div:nth-of-type(2)::before{display: block; content: ''; width: 1px; height: 11px; background-color: #7f7f7f; position: absolute; left: -7px; top: 1px;}
.myMenu .myMenuList{float:left;margin-top:0;}
.myMenuList > ul:after {content:"";display:block;clear:both}
.myMenuList > ul li{float:left;width:145px;height:112px;margin-left:14px;background:#fff;}
.myMenuList > ul li:first-child{margin-left:0}
.myMenuList a.myMenuTit{display:block;padding-top:7px;color:#4a4a4a;font-size:15px;font-family:NotoSansM;text-align:center;letter-spacing:-0.05em}
.myMenuList a.myMenuStatus{display: block;margin:3px 8px;padding:0 35px;background:#1f58af;font-size:14px;color:#fff;letter-spacing:-0.05em;}
.myMenuList a.myMenuStatus span{color:#3cddff}
.myMenuList > ul li:last-child a.myMenuStatus {padding:3px 21px; background-color: #cfe3ef;color: #181818;}
.myMenuList > ul li:last-child a.myMenuStatus span{display: inline-block;padding:2px 5px 0;vertical-align:top;}
.myMenuList > ul li:last-child a.myMenuStatus img{display: inline-block;width:14px;height:14px}
.myMenu .close{position: absolute;right:5px;bottom:20px;width:30px;height:31px;text-indent:-9999px;background:url(../../../../image/ko/local/myMenuClose.png) no-repeat 0 0;}
@media screen and (min-width:1025px) and (max-width:1300px){
    .myMenu > div{width:auto;margin:0 20px;}
}
@media screen and (min-width:1025px) and (max-width:1260px){
    .myMenu .myInfo{float: none;}
    .myMenu .myMenuList{float:none;margin-top:20px;}
}
/* header2 */
.header2{position: relative; border-top: 1px solid #e9e8e7; border-bottom: 1px solid #e9e8e7; height: 66px; box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.14);}
.mobileLogoW{display: none;}
#divTopMenu{ height: 66px;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: 1150px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
#divTopMenu > ul > li.topMenu > a{display: block; width: 135px; font-family:NotoSansM, sans-serif; font-size: 19px; color: #231815; text-align: center;}

/* 슬라이드 메뉴 클릭시 */
#divTopMenu > ul > li.on > a{color: #b2216c !important;}
#divTopMenu > ul > li > div{display: none;position: absolute; left: 0; top: 67px; z-index: 21;width: 100%;background: #f9f9f9;}
#divTopMenu > ul > li > div .menuTit{width: 28%; background: #153b7c; position: relative; float: left; height: 340px;}
#divTopMenu > ul > li > div .menuTit::before{display: block; content: ''; width: 100%; height: 55px; background: #092f70; position: absolute; left: 0; bottom: 0;}
#divTopMenu > ul > li > div .menuTit::after{display: block; content: ''; width: 100%; height: 151px; background: url(../../../../image/ko/local/topMenuBg1.png) no-repeat right bottom; position: absolute; left: 0; bottom: 0;}
#divTopMenu > ul > li > div .menuTit div{width: 190px; position: relative; margin: 42px 36px 0 auto;}
#divTopMenu > ul > li > div .menuTit div::after{display: block; content: ''; width: 64px; height: 74px; position: absolute; right: 0; bottom: -93px;}
#divTopMenu > ul > li:nth-of-type(1) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon01.png) no-repeat;}
#divTopMenu > ul > li:nth-of-type(2) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon02.png) no-repeat;}
#divTopMenu > ul > li:nth-of-type(3) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon03.png) no-repeat;}
#divTopMenu > ul > li:nth-of-type(4) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon04.png) no-repeat;}
#divTopMenu > ul > li:nth-of-type(5) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon05.png) no-repeat;}
#divTopMenu > ul > li:nth-of-type(6) > div .menuTit div::after{background: url(../../../../image/ko/local/topMenuIcon06.png) no-repeat;}
#divTopMenu > ul > li > div .menuTit div span{color: #fff; font-size: 27px; font-family:NotoSansM, sans-serif; position: relative;}
#divTopMenu > ul > li > div .menuTit div span::after{display: block; content: ''; width: 31px; height: 3px; background-color: #fff; position: absolute; left: 0; top: 52px;}
#divTopMenu > ul > li > div .menuTit div p{margin-top: 40px; color: rgba(255, 255, 255, 0.7); font-family:NotoSansM, sans-serif; word-break: keep-all;}
#divTopMenu > ul > li > div .menuContent{width: 72%; background: #f9f9f9; float: right; position: relative;}
#divTopMenu > ul > li > div .menuContent::after{display: block; content: ''; width: 15px; height: 22px; background: url(../../../../image/ko/local/topMenuArrow.png) no-repeat left top; position: absolute; left: -14px; top: 51px;}
#divTopMenu > ul > li > div .menuContent > ul{height: 285px;display: -webkit-box; display: -ms-flexbox; display: flex; box-sizing: border-box; padding: 45px 330px 0px 0px; line-height: 1;}
#divTopMenu > ul > li > div .menuContent > ul > li{min-width: 145px;padding: 0 40px;}
#divTopMenu > ul > li > div .menuContent > ul > li:not(:last-of-type){background: url(../../../../image/ko/local/topMenuBar.png) no-repeat right top;}
#divTopMenu > ul > li > div .menuContent > ul > li > a{margin-bottom: 20px;color: #153b7c;font-size: 17px;font-family:NotoSansM, sans-serif;}
#divTopMenu > ul > li > div .menuContent > ul > li .menuList ul li {margin-top: 15px; position: relative; padding-left: 10px;-webkit-transition: 0.2s;-ms-transition: 0.2s;transition: 0.2s;}
#divTopMenu > ul > li > div .menuContent > ul > li .menuList ul li::before{display: block; content: ''; width: 3px; height: 3px; background: #c0c3ce; position: absolute; left: 0; top: 5px;}
#divTopMenu > ul > li > div .menuContent > ul > li .menuList ul li:hover::before{background: #537eae;}
#divTopMenu > ul > li > div .menuContent > ul > li .menuList ul li a{display: inline-block; color: #666666; font-size: 15px;-webkit-transition: 0.2s;-ms-transition: 0.2s; transition: 0.2s; position: relative;word-break: keep-all;}
#divTopMenu > ul > li > div .menuContent > ul > li .menuList ul li:hover a{color: #b2216c; text-decoration: underline;}
#divTopMenu > ul > li > div .menuContent .closeBox{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 55px; background: #ededed;}
#divTopMenu > ul > li > div .menuContent .closeBox p{color: #666; padding-left: 36px; font-size: 15px; margin-right: 27%;}
#divTopMenu > ul > li > div .menuContent .closeBox a{height: 25px;}
.blackBg {display:none;position:fixed;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:20}
.blackBg.on {display:block}
.wholeMenuBtn{width: 25px; height: 25px;display: -webkit-box; display: -ms-flexbox; display: flex; text-indent: -9999px;}
.wholeMenuBtn div span{display: block; height: 2px; background: #000000; width: 20px; -webkit-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s;}
.wholeMenuBtn div span:nth-of-type(1){width: 24px;}
.wholeMenuBtn div span:nth-of-type(2){margin: 8px 0; width: 17px;}
.wholeMenuBtn div span:nth-of-type(3){width: 21px;}
.wholeMenuBtn:hover div span{width: 24px;}
@media screen and (min-width:1300px) and (max-width:1550px){
    #divTopMenu > ul > li > div .menuContent > ul{padding-right: 20px;}
    #divTopMenu > ul > li > div .menuContent > ul > li{padding: 0 2%;min-width: 0;width: 20%;}
    #divTopMenu > ul > li > div .menuTit{width: 24%;}
    #divTopMenu > ul > li > div .menuContent{width: 76%;}
}
@media screen and (max-width:1299px){ 
    #divTopMenu > ul > li > div .menuTit div{margin-right: 20px;}
    #divTopMenu > ul > li > div .menuContent > ul{padding-right: 0;}
    #divTopMenu > ul > li > div .menuContent > ul > li{padding: 0 2%; min-width:0px; width: 20%;}
    #divTopMenu > ul > li > div .menuTit{width: 22%;}
    #divTopMenu > ul > li > div .menuContent{width: 78%;}
    #divTopMenu > ul > li > div .menuContent > ul > li > a{font-size:16px}
    #divTopMenu > ul > li > div .menuContent .closeBox p{margin-right: 11%;}
}

/* PC 전체메뉴 */
@media screen and (min-width:1025px){
    .wholeMenu{width: 100%; height: 100%; overflow-y: auto; position: fixed; top: 0; left: 0; z-index: 200; background: rgba(27, 59, 134, 0.98); opacity:0;visibility:hidden;transition:opacity .5s ease;}
    .wholeMenu.on{visibility:visible; opacity:1}
    .wholeMenu .menuArea{width: 1250px; margin: 0 auto; padding: 100px 0;}
    .wholeMenu .menuArea .menuList .mobileWholeMenuTop{display: none;}
    .wholeMenu .menuArea .menuList .mobileWholeMenuTop li a.mobileWholeMenuLogin{height: 50px; line-height: 50px;}
    .wholeMenu .menuArea .menuList .btnWrap{display: none;}
    .wholeMenu .menuArea h2{margin-bottom: 85px; color: #fff; font-size: 36px; text-align: center;}
    .wholeMenu .menuArea .divMenuList > ul{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .wholeMenu .menuArea .divMenuList > ul > li .wholeMenuTit{font-size: 19px; font-family:NotoSansM, sans-serif; line-height: 55px; padding-left: 20px; color: #76daff; width: 175px; height: 55px; border-top: 1px solid rgba(174, 225, 225, 0.41); border-bottom: 1px solid rgba(174, 225, 225, 0.41); box-sizing: border-box;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul{margin-left: 20px;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li{margin-top: 40px;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li > a{margin-bottom: 15px; color: #fefeff;font-size: 16px; font-family:NotoSansM, sans-serif;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li ul li a{color: rgba(255, 255, 255, 0.7); position: relative; }
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li ul li:not(:last-of-type) a{margin-bottom: 10px;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li ul li a::after{display: block; content: ''; position: absolute; left: -8px; top: 10px; background-color: rgba(255, 255, 255, 0.7); width: 4px;height: 1px;}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li ul li a:hover{color: rgba(102, 232, 255, 0.7);}
    .wholeMenu .menuArea .divMenuList > ul > li > ul > li ul li a:hover::after{background-color: rgba(102, 232, 255, 0.7);}
    .wholeMenu .menuClose{width:41px;height:41px; position: absolute; right: 15%; top: 100px; -webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);overflow:hidden;text-indent:-9999px;}
    .wholeMenu .menuClose span:nth-of-type(1){width: 2px; height: 0px; background: #f2f3f8; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); transition: height 0.3s; transition-delay: 0.3s;}
    .wholeMenu .menuClose span:nth-of-type(2){width: 0px; height: 2px; background: #f2f3f8; position: absolute; left: 0; top: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateY(-50%); transition: width 0.3s;transition-delay: 0.6s;}
    .wholeMenu .menuClose.on span:nth-of-type(1){height: 40px;}
    .wholeMenu .menuClose.on span:nth-of-type(2){width: 40px;}
}
@media screen and (min-width:1025px) and (max-width: 1300px){
    .wholeMenu .menuArea{width: auto; margin: 0 10px;}
    .wholeMenu .menuArea .divMenuList > ul > li .wholeMenuTit{width: 165px;}
    .wholeMenu .menuArea .divMenuList > ul > li div > ul{margin-left: 10px;}
}

/* Main Background */
.mainVisual{position:relative;width:100%;height:450px;overflow:hidden; text-align: center;}
.mainVisual .visualImg{display: none; width: 100%; height: 450px; position:absolute;top:0;left:0;}
.mainVisual .visualImg img{width: auto; height: 100%;}
.mainVisual .btnW a{position:absolute;top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width:40px;height:90px;text-indent:-9999px;background-repeat:no-repeat;z-index:2}
.mainVisual a.btnPrev{left:140px;background:url(../../../../image/ko/local/main/slidePrev.png) no-repeat;}
.mainVisual a.btnNext{right:140px;background:url(../../../../image/ko/local/main/slideNext.png) no-repeat;}
.mainVisual .dotW {position:absolute;bottom:35px;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);height:10px;margin:0 auto;}
.mainVisual .dotW a.dot {display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:10px;background:#fff;text-indent:-9999px;vertical-align:top;transition:1.5s;-webkit-transition:1.5s;border : 1px solid  rgba(0, 0, 0, 0.5);}
.mainVisual .dotW .dot.on {background:#a52869}
.mainVisual .dotW .pause {position:absolute;top:-5px;right:-20px}
.mainVisual .dotW .play {display:none;position:absolute;top:-5px;right:-20px}
@media screen and (min-width:1920px){
    .mainVisual .visualImg img{width: 100%;}
}
/* PC와 테블릿 사이 */
@media screen and (min-width:1025px) and (max-width:1400px){
    .mainVisual a.btnPrev{left: 25px;}
    .mainVisual a.btnNext{right: 25px;}
}

/* 검색 */
.searchW{position: relative;z-index: 1;}
#divSearch{padding: 35px 50px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 176px; width: 870px; background: rgba(255, 255, 255, 0.85); -webkit-box-sizing: border-box; box-sizing: border-box;}
#divSearch .searchForm ul{position: relative;}
#divSearch .searchForm ul li{display: inline-block;}
#divSearch .searchForm ul li > a{display: block; width: 83px; height: 49px; color: #4a4a4a; font-size: 20px; text-align: center; padding-top: 12px; box-sizing: border-box; position: relative;}
#divSearch .searchForm ul li > a::before{content:''; display:block;position:absolute;top:0;left:50%;right:50%;height:2px;background:#b2216c;-webkit-transition:.3s; -ms-transition:.3s; transition:.3s;}
#divSearch .searchForm ul li.on > a::before{left: 0; right: 0;}
#divSearch .searchForm ul li.on > a{color: #b2216c; font-family:NotoSansM, sans-serif;}
#divSearch .searchForm ul li > div:nth-of-type(1){display: none;position: absolute;left: 0;top: 50px;width: 100%;border: 4px solid #b2216c;box-sizing: border-box;}
#divSearch .searchForm ul li.on > div:nth-of-type(1){display: block;}
#divSearch .searchForm input[type="text"]{width: 92%; height: 50px; padding-left: 14px; box-sizing: border-box; background: transparent; color: #4a4a4a; font-size: 16px; border: none;}
#divSearch .searchForm input[type="text"]::placeholder{color: #4a4a4a; font-size: 16px;} 
#divSearch .searchForm input[type="text"]::-webkit-input-placeholder{color: #4a4a4a; font-size: 16px;} 
#divSearch .searchForm input[type="text"]::-moz-placeholder{color: #4a4a4a; font-size: 16px;} 
#divSearch .searchForm input[type="text"]:-ms-placeholder{color: #4a4a4a; font-size: 16px;} 
#divSearch .searchForm input[type="image"]{ position: absolute; right: 14px; top: 10px;}

/*자동완성*/
.widesrchBtn{display:inline-block;position:absolute;top: 0px;right: 50px;width:20px;height: 47px;text-align: center;cursor:pointer;}
.widesrchBtn > img{margin-top:16px;}
.widesrchLayer{display:none;position:absolute;top: 54px;left:0;width: 100%;z-index: 30;}
.widesrchLayer > div{margin: 0;background-color:#fff;border:1px solid #ddd;}
.widesrchLayer.on{display:block;}
.widesrchHeader{background: #f9f9f9;padding: 2px 8px;height: 20px; box-sizing: border-box;}
.widesrchHeader span{float: left;line-height:1.0em;font-size:12px}
.widesrchHeader  p {display: inline-block;float: right;font-size: 12px;}
.widesrchHeader  p a{display:inline-block;height:12px;font-weight:normal;background:url(../../../../image/ko/local/widesrchLine.gif) no-repeat 0 3px;padding: 0 6px 0 10px;cursor:pointer;}
.widesrchHeader  p a:first-child{background:none;}
.widesrchContent{padding: 0px 8px 0;height: 143px !important;overflow-y:scroll;font-family:NotoSans, sans-serif !important;font-size:12px; box-sizing: border-box; width: 100%;}
.widesrchContent ul{height:auto !important;border:none !important}
.widesrchContent li{float:none !important;font-family:NotoSans,sans-serif;font-size:12px}
.widesrchContent li:hover, .widesrchContent li:focus{background:none !important;border:none !important;}
.widesrchContent dl dt{margin:7px 0;font-size:12px}
.widesrchContent dl dt:hover a{color:#b2216c}
.widesrchContent2{padding: 4px 8px;height: 176px;overflow-y:scroll;}

/* Quick Menu */
.contents1{background: #fafafa;height: 150px;position: relative;}
.quickMenuW{padding-top: 30px;}
.quickMenu ul li{display: inline-block; width: calc(11.111111% - 3px); text-align: center;}
.quickMenu ul li a{display: block;}
.quickMenu ul li a img{width: 51px; -webkit-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
.quickMenu ul li a{-webkit-transition: 0.5s ease; -ms-transition: 0.5s ease; transition: 0.5s ease; -webkit-transform:  perspective(500px) rotate(.001deg);-ms-transform:  perspective(500px) rotate(.001deg); transform:  perspective(500px) rotate(.001deg);}
.quickMenu ul li a:hover {-webkit-transform: perspective(500px) rotate(.001deg) translateY(-10px);-ms-transform: perspective(500px) rotate(.001deg) translateY(-10px); transform: perspective(500px) rotate(.001deg) translateY(-10px);}
.quickMenu ul li span{display: block; padding-top: 5px; color: #464646; font-family:NotoSansM, sans-serif; font-size: 15px;}
.quickMenu ul li a:hover span{color: #b2216c;}
.quickMenuW > a{display: none; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
.quickMenuW > a img{width: 12px;}
.quickMenuW > a.prev{left: 10px;}
.quickMenuW > a.next{right: 10px;}

@media screen and (max-width:1280px) and (min-width:1025px) {
	.quickMenu ul li span {letter-spacing:-0.08em;}
}

/* *contents2 */
.contents2{padding: 60px 0 67px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.contents2 .more{text-indent: -9999px; display: block; width: 21px; height: 21px; background: url(../../../../image/ko/local/main/moreBtn.png) no-repeat; background-size: 21px;}

/* popupZone */
.popupZone{width: 311px; position: relative; }
.popupZone div ul.popupImg li{display: none; -webkit-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
.popupZone div ul.popupImg li.on{display: block;}
.popupZone div ul.popupImg li div a{display: block; height: 384px;}
.popupZone div ul.popupImg li div a img{width: 100%; height: 100%;}
.control{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; bottom: 1px; width: 100%; height: 55px; background: rgba(0, 0, 0, 0.65); text-align: center;}
.control ul{margin-right: 10px; height: 55px;}
.control ul li{display: inline-block; margin: 0 6px; padding-top: 21px;}
.control ul li a{display: block; width: 13px; height: 13px; border-radius: 100%; background: rgba(197, 197, 197, 0.7); text-indent: -9999px; -webkit-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s;}
.control ul li.on a{background: #fff;}
.control > a{display: block; text-indent: -9999px;}
.control > a.pause{width: 20px; height: 20px; background: url(../../../../image/ko/local/main/eventBtnPause.png) no-repeat center;}
.control > a.play{display: none; width: 20px; height: 20px; background: url(../../../../image/ko/local/main/eventBtnPlay.png) no-repeat center;}

/* 공지사항 */
.notice{width: 38%; height: 384px;}
.notice > ul{position: relative; padding: 0px 0 0 5px;}
.notice > ul > li {display: inline-block; margin-right: 24px;}
.notice > ul > li:last-of-type{margin-right: 0;}
.notice > ul > li > a{color: #737373; font-size: 19px; font-family:NotoSansM, sans-serif;}
.notice > ul > li.on > a{color: #000; font-size: 21px; border-top: 1px solid #2f2f2f ; padding-top: 7px;}
.notice > ul > li .noticeContent{display: none; position: absolute; left: 0; top: 60px; border-top: 2px solid #131313;}
.notice > ul > li.on .noticeContent{display: block; width: 100%;}
.notice > ul > li .noticeContent ul li{height: 53px; padding: 0 4px 0 9px; 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: space-between; border-bottom: 1px solid #e3e3e3;}
.notice > ul > li .noticeContent ul li a{display: block; width: 80%; color: #393939; font-size: 16px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.notice > ul > li .noticeContent ul li a:hover{text-decoration: underline;}
.notice > ul > li .noticeContent ul li span.noticeDate{color: #6d6d6d;}
.notice > ul > li .noticeContent a.more{position: absolute; right: 0; top:-49px}
@media screen and (min-width:1025px) and (max-width: 1240px){
    .notice{margin: 0 20px;}
    .notice > ul > li .noticeContent ul li a{width: 70%;}
    .notice > ul > li{margin-right: 18px;}
}

/* 도서관일정 */
.schedule{height: 384px; position: relative; border: 1px solid #ececec; padding: 25px 21px 20px 21px; box-sizing: border-box;}
.schedule .tit{color: #000000; font-size: 20px; font-family:NotoSansM, sans-serif; line-height: 1;}
.schedule .more{position: absolute; top: 28px; right: 20px;}
.schedule ul{margin-top: 15px;}
.schedule ul li{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 5px;}
.schedule ul li:last-of-type{margin-bottom: 0;}
.schedule ul li div.scheduleDate{display: table; width: 72px; height: 72px;margin-right: 20px; text-align: center; background-color: #a52869; color: #fff;}
.schedule ul li div.scheduleDate span.scheduleDateDay{display: block; padding-top: 10px; padding-bottom: 3px; font-family:NotoSansB, sans-serif; font-size: 29px; line-height: 29px;}
.schedule ul li div.scheduleDate span.scheduleDateMonth{font-size: 13px; color: rgba(255, 255, 255, 0.8);}
.schedule ul li a{display: block; max-width: 240px; width: 70%;}
.schedule ul li a p{font-size: 16px; color: #393939; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.schedule ul li a span{display: block; margin-top: 5px; color: #737373;}
@media screen and (min-width:1025px){
    .schedule{width: 29%;}
}
@media screen and (min-width:1025px) and (max-width: 1240px){
    .schedule ul li a{width: 60%;}
}

/* BOOK LIST */
.contents3{-webkit-background: linear-gradient(90deg, #f1f1f1 50%, #00427d 50%); -ms-background: linear-gradient(90deg, #f1f1f1 50%, #00427d 50%); background: linear-gradient(90deg, #f1f1f1 50%, #00427d 50%); height: 650px; position: relative;}
.bookContent{padding-top: 90px; position: relative;}
.bookContent h2{color: #222222; font-size: 36px; font-family: NotoSansB, sans-serif; margin-bottom: 45px; line-height: 1;}
.bookContent > span{display: block; position: absolute; top: 171px; right: 2px; width: 258px; height: 127px; background: #417ca7 url(../../../../image/ko/local/main/current.png) no-repeat;-webkit-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; text-indent: -9999px; }
.tabList{position: relative; z-index: 1;}
.tabList > li::after{display: block; content: ''; clear: both;}
.tabList > li > a.bookMore2{width: 25px; height: 25px; background: url(../../../../image/ko/local/main/bookMore4.png) no-repeat; background-size: 25px; text-indent: -9999px; position: absolute; right: 40px; top: 42px; -webkit-transition: 0.3s;-ms-transition: 0.3s;transition: 0.3s; transition-property: background-image;}
.tabList > li.on > a.bookMore2{background: url(../../../../image/ko/local/main/bookMore2.png) no-repeat; background-size: 25px;}
.tabList > li:nth-of-type(2) > a.bookMore2{top: 172px;}
.tabList > li:nth-of-type(3) > a.bookMore2{top: 302px;}
.tabList > li > a.tab{position: relative; float: right; padding-top: 33px; width: 258px;height: 129px; text-align: center; color: rgba(255, 255, 255, 0.6); font-size: 30px; box-sizing: border-box; transition-delay: 0.2s; transition-duration: 0.3s; transition-property: color;}
.tabList > li.on > a.tab{color: #fff;}
.tabList > li > a span{display: block; font-size: 12px; font-family:Roboto, sans-serif; position: absolute; left: 80px;}
.tabList > li .bookListW{position: absolute; left: 0; top: 0; display: none; width: 1020px; height: 385px; background: #fff; padding: 57px 50px 37px 50px; box-shadow: 5px 9px 24px 0px rgba(0, 0, 0, 0.21);  box-sizing: border-box;}
.tabList > li.on .bookListW{display: block;}
.tabList > li .bookListW .bookList{width: 100%; overflow: hidden; position: relative; height: 100%;}
.tabList > li .bookListW .bookList ul{width: 500%; position: absolute; left: 0;}
.tabList > li .bookListW .bookList ul li{display: inline-block; width: 4%;}
.tabList > li .bookListW .bookList ul li a div.bookImgW{position: relative; width: 147px; height: 221px; margin: 0 auto; background: url(../../../../image/ko/local/main/bookCoverBg.png) no-repeat; background-size: 147px 221px; overflow: hidden;}
.tabList > li .bookListW .bookList ul li a div.bookImgW img{width: 145px; height: 213px; position: absolute; left: 1px; top: 7px;}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover{position: absolute; left: 0; top: 221px; width: 147px; height: 221px; background: rgba(0, 0, 0, 0.8); text-align: center; -webkit-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s;}
.tabList > li .bookListW .bookList ul li a:hover div.bookImgW .bookCover{top: 0;}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover .bookTitle{display: block; padding-top: 40px; color: #fff; font-size: 13px; width: 90%; margin: 25px auto 5px auto; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover .author{color: #c0c0c0; font-size: 13px;}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover .bookMore{display: block; text-indent: -9999px; width: 20px; height: 20px; border: 1px solid #fff; position: absolute; top: 60%; left:50%; -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover .bookMore::after{position: absolute; top: 4px; left: 4px; display: block; content: ''; width: 12px;height: 12px; background: url(../../../../image/ko/local/main/bookMore.png) no-repeat center; background-size: 12px; transition: 0.2s;}
.tabList > li .bookListW .bookList ul li a div.bookImgW .bookCover .bookMore:hover::after{-webkit-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}
.tabList > li .bookListW .bookList ul li a .bookInfo span{display: block; text-align: center; }
.tabList > li .bookListW .bookList ul li a .bookInfo .bookTitle{width: 90%; margin: 28px auto 5px auto; color: #1f1f1f; font-size: 15px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.tabList > li .bookListW .bookList ul li a .bookInfo .author{color: #737373; font-size: 13px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.noList{text-align: center; line-height: 250px;}
/* BOOK LIST 이전 다음 버튼 */
.tabList > li .bookListW > a{display: none;}
.tabList > li.on .bookListW > a{display: block;}
.bookListW > a{position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: block; width: 90px; height: 60px; text-indent: -9999px; -webkit-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
.bookListW > a.prev{ left: -140px; background: url(../../../../image/ko/local/main/bookPrev.png) no-repeat right center; background-size: 62px 9px;}
.bookListW > a.prev::after{display: block; content: ''; position: absolute; top: 0; left: 0; background: url(../../../../image/ko/local/main/bookPrevIcon.png) no-repeat left center; background-size:60px 61px ; width: 60px; height: 61px;}
.bookListW > a.next{right: -368px; background: url(../../../../image/ko/local/main/bookNextP.png) no-repeat left center; background-size: 62px 9px;}
.bookListW > a.next::after{display: block; content: ''; position: absolute; top: 0; right: 0; background: url(../../../../image/ko/local/main/bookNextIcon.png) no-repeat right center; background-size:60px 61px ; width: 60px; height: 61px; opacity: 0.5 !important;}
@media screen and (min-width:1551px) and (max-width: 1600px){
    .bookListW > a.prev{left: -50px;}
}
@media screen and (min-width:1025px) and (max-width: 1550px){
    .tabList{width: 94%;}
    .tabList > li .bookListW{width: 79%; padding: 57px 40px 37px 40px;}
    .bookListW > a.next{right: -37%;}
    .bookListW > a.prev{left: -45px;}
    .bookContent > span{right: 6%;}
}
@media screen and (min-width:1025px) and (max-width: 1400px){
    .bookContent h2{margin-left: 100px;}
    .tabList{left: 50px; width: 88%;}
    .tabList > li .bookListW{width: 75%;}
    .tabList > li .bookListW .bookList ul li{width: 5%;}
    .bookContent > span{right: 8%;}
    .bookListW > a.next{right: -45%;}
}
@media screen and (min-width:1240px) and (max-width: 1400px){
    .tabList > li .bookListW{width: 78%;}
    .bookListW > a.next{right: -40%;}
}
@media screen and (min-width:1025px) and (max-width: 1240px){
    .tabList > li .bookListW .bookList ul li{width: 6.6%;}
}

/* 중앙도서관 메뉴보기 */
.contents4{width: 100%;}
.contents4 > div:first-of-type{margin: 0 auto; background: #165890;}
.contents4 > div .moreMenuTit{color: #fff; text-align: center; padding: 25px 0; margin: 0 auto; width: 300px;}
.contents4 > div .moreMenuTit strong{position: relative; padding-right: 34px; font-size: 16px; font-family:NotoSansM, sans-serif;}
.contents4 > div .moreMenuTit strong:before {display:block; content:'';position: absolute;right: 5px;top: 8px;opacity:1; background: url(../../../../image/ko/local/main/moreMenu.png) no-repeat; background-size: 16px 10px; width: 16px; height: 9px;}
.contents4 > div .moreMenuTit strong:after {display:block; content:'';position: absolute;;right: 5px;top: 8px;opacity: 0;-webkit-transform: translateY(-10px);-ms-transform: translateY(-10px);transform: translateY(-10px); background: url(../../../../image/ko/local/main/moreMenu.png) no-repeat; background-size: 16px 10px; width: 16px; height: 9px;}
.contents4 > div .moreMenuTit:hover strong:before {opacity: 0;-webkit-transform: translateY(5px);-ms-transform: translateY(5px);transform: translateY(5px);-webkit-transition: all .2s cubic-bezier(0.47, 0, 0.75, 0.72) 0s;transition: all .2s cubic-bezier(0.47, 0, 0.75, 0.72) 0s;}
.contents4 > div .moreMenuTit:hover strong:after {opacity: 1;-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);-webkit-transition: all .3s cubic-bezier(0, 0, 0.2, 1) .3s;transition: all .3s cubic-bezier(0, 0, 0.2, 1) .3s;}

.wholeMenu2{display: none; width: 100%; height: 100%; overflow: visible; background: #f8f8f8;}
.wholeMenu2 .menuArea{width: 1250px; margin: 0 auto; padding: 27px 0 70px 0;}
.wholeMenu2 .menuArea > ul{display: -webkit-box; display: -ms-flexbox; display: flex;-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.wholeMenu2 .menuArea > ul > li .wholeMenuTit{font-size: 19px; font-family:NotoSansM, sans-serif; line-height: 44px; color: #005596; width: 160px; height: 44px; border-top: 1px solid #005596; border-bottom: 1px solid #005596; box-sizing: border-box;}
.wholeMenu2 .menuArea > ul > li div > ul > li{margin-top: 25px;}
.wholeMenu2 .menuArea > ul > li div > ul > li > a{margin-bottom: 10px; color: #646464;font-size: 15px; font-family:NotoSansM, sans-serif;}
.wholeMenu2 .menuArea > ul > li div > ul > li ul li{padding-left: 13px;}
.wholeMenu2 .menuArea > ul > li div > ul > li ul li a{color: #6f6f6f; position: relative; }
.wholeMenu2 .menuArea > ul > li div > ul > li ul li:not(:last-of-type) a{margin-bottom: 7px;}
.wholeMenu2 .menuArea > ul > li div > ul > li ul li a::after{display: block; content: ''; position: absolute; left: -8px; top: 10px; background-color: #919191; width: 2px;height: 2px;}
.wholeMenu2 .menuArea > ul > li div > ul > li ul li a:hover{color: #1c91cd;}
.wholeMenu2 .menuArea > ul > li div > ul > li ul li a:hover::after{background-color: #1c91cd;}
@media screen and (min-width:1025px) and (max-width: 1250px){
    .wholeMenu2 .menuArea{width: 100%;}
}
/* Footer */
/* 사용자 */
.userGuide {height: 90px; padding-top: 30px; box-sizing: border-box;}
.userGuide ul li{display: inline-block; width: 16.4%;}
.userGuide ul li:not(:last-of-type){background: url(../../../../image/ko/local/footerBar.png) no-repeat right center;}
.userGuide ul li a{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 30px;}
.userGuide ul li a img{margin-right: 22px; width: 36px; height: 30px;}
.userGuide ul li a span{color: #555555; -webkit-transition: 0.2s; -ms-transition: 0.2s; transition: 0.2s; font-size: 16px; font-family: NotoSansM, sans-serif;}
.userGuide ul li a:hover span{color: #2a98d2;}

/* banner */
.banner{background: #f7f7f7; height: 70px;}
.banner .bannerListW{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 70px;}
.banner .btnW {width: 136px; float: left; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-around;}
.banner .btnW a{display: block; text-indent: -9999px; width: 44px; height: 44px; border: 1px solid #dadada;}
.banner .btnW a.prev{background: url(../../../../image/ko/local/main/bannerPrev.png) no-repeat center;}
.banner .btnW a.next{background: url(../../../../image/ko/local/main/bannerNext.png) no-repeat center;}
.banner .btnW a.pause{border-left: none; border-right: none; background: url(../../../../image/ko/local/main/bannerPause.png) no-repeat center;}
.banner .btnW a.play{border-left: none; border-right: none; display: none; background: url(../../../../image/ko/local/main/bannerPlay.png) no-repeat center;}
.banner .bannerList{position: relative; width: 90%; height: 40px; overflow: hidden;}
.banner .bannerList ul{position: absolute; left: 0 ; width: 200%;}
.banner .bannerList ul li{display: inline-block; width: 10%; vertical-align: middle;}
.banner .bannerList ul li a{display: block; text-align: center; -webkit-transition: 0.3s; -ms-transition: 0.3s; transition: 0.3s;}
/* PC와 테블릿 사이 */
@media screen and (min-width:1025px) and (max-width: 1340px){
    .banner .bannerList{width: 86%;}
    .banner .bannerList ul li{width: 12.5%;}
}
 
#divFooter{width: 100%;}
.footer{background: #323232; font-family: NotoSans, sans-serif;}
.footerMenu{height: 60px; border-bottom: 1px solid #5c5c5c;}
.footerMenu > div{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;}
.footerMenu div div:first-of-type ul li{display: inline-block;}
.footerMenu div div:first-of-type ul li:not(:last-of-type){padding-right: 40px; background: url(../../../../image/ko/local/footerBar.png) no-repeat right 20px center;}
.footerMenu div div ul li a{color: #a0a0a0;}
.footerMenu div div ul li a.privacy{color: #FFEB3B;}
.relationSite{position: relative;}
.relationSite > a{display: block; padding-left: 18px; width: 208px; height: 40px; line-height: 40px; background-color: #424242; color: #afadad; font-family: NotoSansM; box-sizing: border-box;}
.relationSite > a::after{display: block; content: ''; position: absolute; right: 24px; top: 17px; background: url(../../../../image/ko/local/moreSiteBtn.png) no-repeat; width: 10px; height: 7px; background-size: 10px 7px;}
.relationSite ul{display: none; position: absolute; bottom: 40px; width: 100%; margin-bottom: 0; padding: 20px 0; background: #2b2b2b; box-sizing: border-box; z-index: 1}
.relationSite ul li{padding: 0 20px;}
.relationSite ul li:not(:last-of-type){margin-bottom: 10px;}
.relationSite ul li a{display: block; color: #aeaeae; -webkit-transition: 0.4s; -ms-transition: 0.4s; transition: 0.4s;}
.relationSite ul li a:hover{color: #fff;}
.libraryInfo{height: 110px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.libraryInfo .footerLogo{width: 195px;height: 50px; margin-right: 4%;}
.libraryInfo > div{margin-right: 8%;}
.libraryInfo > div address{color: #a0a0a0; font-family:NotoSansM, sans-serif;}
.libraryInfo > div p.copyright{color: #a0a0a0; font-size: 12px; font-family:Roboto, sans-serif;}
.libraryInfo > div p.copyright span{color: #dcdcdc;}
.libraryInfo > ul{display: -webkit-box; display: -ms-flexbox; display: flex; margin-right: 20px;}
.libraryInfo > ul li:not(:first-of-type){margin-left: 10px;}
.libraryInfo > ul li a{display: block; text-indent: -9999px; width: 38px; height: 38px;-webkit-transition: 0.2s; -ms-transition: 0.2s; transition: 0.2s;}
.libraryInfo > ul li:nth-of-type(1) a{background: url(../../../../image/ko/local/sns1.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(2) a{background: url(../../../../image/ko/local/sns2.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(3) a{background: url(../../../../image/ko/local/sns3.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(4) a{background: url(../../../../image/ko/local/sns4.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(1) a:hover{background: url(../../../../image/ko/local/snsOn1.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(2) a:hover{background: url(../../../../image/ko/local/snsOn2.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(3) a:hover{background: url(../../../../image/ko/local/snsOn3.png) no-repeat;}
.libraryInfo > ul li:nth-of-type(4) a:hover{background: url(../../../../image/ko/local/snsOn4.png) no-repeat;}
.libraryInfo > a{margin-left: auto;}

#openModal {
    background: #b2216c;
    border: none;
    color: #fff;
    padding: 0 8px;
    border-radius: 5px;
    font-size: 14px;
    font-family: 'NotoSansM', sans-serif;
    line-height: 24px;
}