@charset "utf-8";
@import url("/include/css/common/default.css");
@import url("/include/css/common/common.css");
@import url("/include/css/common/button.css");
@import url("layout.css");

.topPopupWrap {background-color:#37bdb2  !important;}

#container.main {position:relative; z-index:30; padding:0; background:none; background:url(/include/image/sclib/main/bg_visual.jpg?ver=20250408) no-repeat center top;}
.sectionGroup {position:relative; max-width:1200px; margin:0 auto}
.sectionGroup::after {content:""; display:block; clear:both}
.mtit {font-size:1.563em; font-weight:700; color:#383b3e; line-height:1; margin-bottom:24px; transform:rotate(0.033222deg);}
.more {position:absolute; right:25px; top:30px;}
.more1 {position:absolute; right:0; top:0;}

#section1 {overflow:hidden; position:relative; padding-top:75px;}
.slogan {font-size:2.125em; text-align:center; color:#fff; line-height:1.3; text-shadow:0 0 5px rgba(0,0,0,.5); margin-bottom:38px; word-break: keep-all;}
.slogan span {font-weight:700;}

/* 통합검색 */
.mainSearchWrap {overflow:hidden; clear:both; position:relative; margin-bottom:45px; text-align:center;}
.mainSearchWrap .title {position:absolute; left:-4px; top:-4px; display:block; width:189px; line-height:75px; text-align:center; font-size:1.5em; font-weight:700; color:#fff; z-index:1; border-radius:75px;}
.mainSearchForm {display:inline-block; position:relative; line-height:0; vertical-align:top}
.mainSearchKeyword {position:relative; height:75px; line-height:75px; padding-right:70px; padding-left:189px; background-color:#fff; border:solid 4px #37bdb2; border-radius:75px; box-sizing:border-box;}
.mainSearchKeyword input {display:block; width:100%; min-width:480px; height:67px; padding:0 20px; font-size:1.250em; color:#939393; border:0;}
.mainSearchKeyword .btnSearch {display:block; position:absolute; top:0; right:0; width:70px; height:67px; border-radius:0 10px 10px 0;background:url(/include/image/sclib/main/ico_search.png) no-repeat 0 center;}
.mainBestKeyword {overflow:hidden; position:relative; min-width:750px; margin-top:25px; vertical-align:top; white-space: nowrap;}
.mainBestKeyword .keywordListWrap {overflow:hidden; font-size:1.125em; color:#fff; text-align:left}
.mainBestKeyword .keywordList {text-align:center;}
.mainBestKeyword .keywordList li {display:inline; margin:0 10px; line-height:1;}
.mainBestKeyword .keywordList li a {text-shadow:0 0 5px rgba(0,0,0,.8);}
.mainBestKeyword .keywordList li:last-child {margin-right:0;}

.mainServiceWrap {overflow:hidden; position:relative;}
/* 도서관 이용시간 */
.libraryInfoGroup {position:relative; border:solid 1px #cdcecf; border-bottom:none; background-color:#f7f7ff;}
.libraryTime {position:relative; padding:28px 25px;}
.libraryTime .info li {overflow:hidden; position:relative; border-radius:3px;}
.libraryTime .info li dl dt {float:left; width:50%; padding-left:5px; color:#333; box-sizing:border-box;}
.libraryTime .info li dl dd {float:left; width:25%; color:#555; text-align:center; border-left:solid 1px #dde1e8; box-sizing:border-box;}
.libraryTime .info.none li dl dt {width:100%;}
.libraryTime .info li:first-child {padding:8px 0 7px; line-height:1; margin-bottom:8px; background-color:#7cbde8;}
.libraryTime .info li:first-child dl dt {color:#fff; font-size:1.063em; font-weight:700; transform:rotate(0.033222deg);}
.libraryTime .info li:first-child dl dd {color:#fff; font-size:1.063em; font-weight:700; transform:rotate(0.033222deg); border-left:solid 1px rgba(255,255,255,.5);}
.info > div.top > span::after {background-color: #bd9fd2}
.libraryholiday {overflow:hidden; position:relative; background-color:#26847c; padding:5px 0 4px 120px;}
.libraryholiday .selMonth {position:absolute; left:0; top: 50%; width:120px; height:27px; line-height:27px; margin-top:-13px; padding:0 16px; box-sizing:border-box;}
.libraryholiday .selMonth p {color:#fff; font-weight:700; transform:rotate(0.033222deg);}
.libraryholiday .selMonth .controlArea {position:absolute; top:50%; right:0; margin-top:-14px;}
.libraryholiday .selMonth .controlArea a {display:block; margin:5px 0}
.libraryholiday .selMonth .controlArea a#btnUp {border-right:6px solid transparent; border-bottom:6px solid #fff; border-left:6px solid transparent}
.libraryholiday .selMonth .controlArea a#btnDwon {border-top:6px solid #fff; border-right:6px solid transparent; border-left:6px solid transparent}
.libraryholiday .viewDate {display:inline-block; padding:0 10px; min-height:44px; position:relative; box-sizing:border-box; vertical-align:top;}
.libraryholiday .viewDate p {color:#fff; font-weight:700; transform:rotate(0.033222deg); display:table;}
.libraryholiday .viewDate p span {display:table-cell; height:44px; line-height:1.4; vertical-align:middle;}

/* 도서관 이용시간 */
.noticeGroup {position:relative; border:solid 1px #cdcecf; background-color:#fff;}
.noticeArea {position:relative; padding:30px 25px;}
.noticeArea .noticeList li {overflow:hidden; position:relative; padding-right:95px; text-overflow:ellipsis; white-space:nowrap}
.noticeArea .noticeList li + li {margin-top:7px}
.noticeArea .noticeList li.nodata {padding-right:0; line-height:180px; text-align:center; color:#666;}
.noticeArea .noticeList li a {font-size:1.063em; color:#333;}
.noticeArea .noticeList .date {display:block; position:absolute; top:0; right:0; color:#666;}

/* 팝업존 */
.popupZone {overflow:hidden; position:relative;}
.popupZone .controlGroup {overflow:hidden; position:absolute; bottom:0; left:0; z-index:30; width:100%; height:28px; z-index: 101;} 
.popupZone .controlGroup a {float:left; display:block; position:relative; width:25px; height:28px; background-color:rgba(0,0,0,.5);}
.popupZone .controlGroup a:before {content:""; display:block; position:absolute; top:50%; left:50%; background:url("/include/image/intro/main/btn_control_split.png") 0 0 no-repeat}
.popupZone .controlGroup .nowpage {display:inline-block; height:28px; line-height:28px; padding:0 10px; background-color:rgba(0,0,0,.5); font-size:0.938em; color:#fff;transform:rotate(0.033222deg);}
.popupZone .controlGroup .arrowWrap {display:inline-block; overflow:hidden; position:relative; min-height:28px; padding:0 25px; vertical-align:middle}
.popupZone .controlGroup .pp-controls {float:left}
.popupZone .controlGroup .arrow {position:absolute;top:0}
.popupZone .controlGroup .btnSlidePrev {left:0}
.popupZone .controlGroup .btnSlideNext {right:0}
.popupZone .controlGroup .listTypeWrap {display:inline-block;vertical-align:middle}
.popupZone .controlGroup .btnSlidePrev:before {width:7px;height:11px;margin:-5.5px 0 0 -3.5px}
.popupZone .controlGroup .btnSlideNext:before {width:7px;height:11px;margin:-5.5px 0 0 -3.5px;background-position-x:-7px}
.popupZone .controlGroup .btnSlidePlay:before {width:8px;height:9px;margin:-4.5px 0 0 -3px;background-position-x:-14px}
.popupZone .controlGroup .btnSlidePause:before {width:7px;height:9px;margin:-4.5px 0 0 -3.5px;background-position-x:-22px}
.popupZone .popupList {overflow:hidden;}
.popupZone .popupList.thumb {position:relative;}
.popupZone .popupList.thumb > li {position:absolute; top:0; left:0; width:100%; height:100%;}
.popupZone .popupList.thumb a,.popupZone .popupList.thumb span {display:block;height:100%}
.popupZone .popupList.thumb .slide {display:block;width:100%;height:100%}
.popupZone .textPopup {overflow:hidden;position:absolute;top:0;left:0;right:0;bottom:0;line-height:1.4;word-break:keep-all}
.popupZone .textPopup .title {line-height:1.2}

/* popup template */
.popupZone.public img[src$="bg_pzTemp01.jpg"] ~ .textPopup {margin:6.382978723404255% 9.85106382978723%; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp01.jpg"] ~ .textPopup .title {padding-top:15.8695652173913%;text-align:center;font-weight:700;font-size:1.500em;color:#333;letter-spacing:-1.5px;transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp01.jpg"] ~ .textPopup .summary {margin:2% 10px;font-size:1.125em;color:#737373; line-height: 1.35;}
.popupZone.public img[src$="bg_pzTemp01.jpg"] ~ .textPopup .desc {padding:0 6.521739130434783%;text-align:center;font-weight:700;font-size:1.125em;color:#237dd8;transform:rotate(0.033222deg);}

.popupZone.public img[src$="bg_pzTemp02.jpg"] ~ .textPopup {padding:9.574468085106383% 6.382978723404255% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp02.jpg"] ~ .textPopup .title {font-weight:500;font-size:1.500em;color:#fcc04a;text-align:center;letter-spacing:-1.5px}
.popupZone.public img[src$="bg_pzTemp02.jpg"] ~ .textPopup .summary {margin:3% 0;font-size:1.063em;color:#fff;}
.popupZone.public img[src$="bg_pzTemp02.jpg"] ~ .textPopup .desc {position:absolute;top:72.51764705882353%;right:6.382978723404255%;left:6.382978723404255%;font-size:1.063em;color:#4b4540;}

.popupZone.public img[src$="bg_pzTemp03.jpg"] ~ .textPopup {padding:8.36595744680851% 7.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp03.jpg"] ~ .textPopup .title {font-weight:700;font-size:1.500em;color:#d13507; transform:rotate(0.033222deg);text-align:center;}
.popupZone.public img[src$="bg_pzTemp03.jpg"] ~ .textPopup .summary {margin:3% 0;font-size:1.125em;color:#000}
.popupZone.public img[src$="bg_pzTemp03.jpg"] ~ .textPopup .desc {padding:7px 10px;font-size:1.063em;color:#74630d; border-radius:10px;background-color:rgba(255,255,255,.7); font-weight:700; transform:rotate(0.033222deg);}

.popupZone.public img[src$="bg_pzTemp04.jpg"] ~ .textPopup {padding:4.382978723404255% 5.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp04.jpg"] ~ .textPopup .title {font-weight:700; padding:0 12%; font-size:1.500em;color:#8ac4f6; text-align:center; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp04.jpg"] ~ .textPopup .summary {margin:2% 0 2.5%;font-size:1.125em;color:#fff;}
.popupZone.public img[src$="bg_pzTemp04.jpg"] ~ .textPopup .desc {padding:8px 13px; font-size:1.063em; color:#666; border-radius:10px; background-color:#fff; font-weight:700; transform:rotate(0.033222deg);}

.popupZone.public img[src$="bg_pzTemp05.jpg"] ~ .textPopup {padding:4.882978723404255% 4.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp05.jpg"] ~ .textPopup .title {font-weight:700; font-size:1.500em; color:#004c5e; text-align:center; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp05.jpg"] ~ .textPopup .summary {margin:2% 0;font-size:1.125em;color:#515151;}
.popupZone.public img[src$="bg_pzTemp05.jpg"] ~ .textPopup .desc {padding:8px 13px; font-size:1.063em; color:#666; border-radius:10px; background-color:#fff; background-color:#fff; font-weight:700; transform:rotate(0.033222deg);}

.popupZone.public img[src$="bg_pzTemp06.jpg"] ~ .textPopup {padding:4.382978723404255% 8.51063829787234% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp06.jpg"] ~ .textPopup .title {font-weight:700; font-size:1.500em;color:#07bd41; text-align:center; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp06.jpg"] ~ .textPopup .summary {margin:2% 0;font-size:1.125em;color:#000;}
.popupZone.public img[src$="bg_pzTemp06.jpg"] ~ .textPopup .desc {margin:3% 0;font-size:1.063em;color:#666;}

.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup {padding:4.582978723404255% 5.846808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup .title {position:relative; padding-bottom:15px; font-weight:700; font-size:1.500em; color:#dc2f50; text-align:center; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup .title::before {content:"";position:absolute;bottom:2px;left:0;width:100%;height:2px;background-color:#fff}
.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup .title::after {content:"";position:absolute;bottom:-4px;left:50%;width:16px;height:15px;margin-left:-8px;background:url(/include/image/popupzone/bg_pzTemp07_title.png) 50% 100% no-repeat}
.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup .summary {margin:2.5% 0;font-size:1.125em;color:#333;}
.popupZone.public img[src$="bg_pzTemp07.jpg"] ~ .textPopup .desc {padding:5px 10px; font-size:1.063em; color:#666; border-radius:10px; background-color:rgba(255,255,255,.7)}

.popupZone.public img[src$="bg_pzTemp08.jpg"] ~ .textPopup {padding:4.319148936170213% 5.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp08.jpg"] ~ .textPopup .title {font-weight:700;font-size:1.500em; color:#fdfb39; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp08.jpg"] ~ .textPopup .summary {min-height:32.5%;margin:3.5% 10% 5% 0;font-size:1.125em;color:#fff;}
.popupZone.public img[src$="bg_pzTemp08.jpg"] ~ .textPopup .desc {margin:3.5% 0; font-size:1.063em; color:#494848;}

.popupZone.public img[src$="bg_pzTemp09.jpg"] ~ .textPopup {padding:6.446808510638298% 12.95744680851064% 0 8.074463085106383%; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp09.jpg"] ~ .textPopup .title {font-weight:700; font-size:1.500em; color:#812300; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp09.jpg"] ~ .textPopup .summary {margin:6.5% 0 3%; font-size:1.063em; color:#333;}
.popupZone.public img[src$="bg_pzTemp09.jpg"] ~ .textPopup .desc {margin:3% 0; font-size:1em; color:#666;} 

.popupZone.public img[src$="bg_pzTemp10.jpg"] ~ .textPopup {padding:6.382978723404255% 2.446808510638298% 0 6.446808510638298%; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp10.jpg"] ~ .textPopup .title {font-weight:700; font-size:1.500em;color:#405ea0; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp10.jpg"] ~ .textPopup .summary {margin:3% 0;font-size:1.063em;color:#477e9d;}
.popupZone.public img[src$="bg_pzTemp10.jpg"] ~ .textPopup .desc {margin:3% 0;  font-size:1.063em;color:#555;}

.popupZone.public img[src$="bg_pzTemp11.jpg"] ~ .textPopup {padding:6.382978723404255% 6.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp11.jpg"] ~ .textPopup .title {font-weight:700; font-size:1.500em;color:#4d862e; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp11.jpg"] ~ .textPopup .summary {margin:3% 0;font-size:1.063em;color:#4b542c;}
.popupZone.public img[src$="bg_pzTemp11.jpg"] ~ .textPopup .desc {margin:3% 0;  font-size:1.063em;color:#333; font-weight:700; transform:rotate(0.033222deg);}

.popupZone.public img[src$="bg_pzTemp12.jpg"] ~ .textPopup {padding:5.319148936170213% 5.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp12.jpg"] ~ .textPopup .title {font-weight:700;font-size:1.500em; color:#493f97; transform:rotate(0.033222deg);}
.popupZone.public img[src$="bg_pzTemp12.jpg"] ~ .textPopup .summary {min-height:32.5%;margin:3.5% 10% 4% 0;font-size:1.063em;color:#494661;}
.popupZone.public img[src$="bg_pzTemp12.jpg"] ~ .textPopup .desc {margin:3.5% 0; font-size:1.063em; color:#fff; }

.popupZone.public img[src$="bg_pzTemp13.jpg"] ~ .textPopup {padding:6.319148936170213% 5.446808510638298% 0; letter-spacing:-1px;}
.popupZone.public img[src$="bg_pzTemp13.jpg"] ~ .textPopup .title {font-weight:700;font-size:1.500em; color:#333; transform:rotate(0.033222deg); text-align:center;}
.popupZone.public img[src$="bg_pzTemp13.jpg"] ~ .textPopup .summary {min-height:32%;margin:3% 10% 3% 0;font-size:1.063em;color:#666;}
.popupZone.public img[src$="bg_pzTemp13.jpg"] ~ .textPopup .desc {margin:3.5% 0; font-size:1.063em; color:#333; font-weight:700; transform:rotate(0.033222deg); }

/* 서비스바로가기 */
.shortcut {overflow:hidden; position:relative; margin:30px 0 35px;}
.shortcutList li {float:left; width:25%; text-align:center;}
.shortcutList li a {display:block; height:100%; font-size:1.063em; line-height:1; color:#555; letter-spacing:-0.05em;}
.shortcutList li .ico {display:block; width:100px; height:100px; margin:0 auto; background:url(/include/image/common/ico_summary.png) 0 0 no-repeat}
.shortcutList li.svc1 .ico {background-position-x:0} /*이용안내*/
.shortcutList li.svc2 .ico {background-position:-100px 0} /*대출반납*/
.shortcutList li.svc3 .ico {background-position-x:-200px} /*상호대차*/
.shortcutList li.svc4 .ico {background-position:-300px 0;} /*희망도서신청*/
.shortcutList li.svc5 .ico {background-position-x:-400px} /*프로그램신청*/
.shortcutList li.svc6 .ico {background-position-x:-500px} /*전자책*/
.shortcutList li.svc7 .ico {background-position-x:-600px} /*대관안내*/
.shortcutList li.svc8 .ico {background-position-x:-700px} /*온라인설문*/
.shortcutList li.svc9 .ico {background-position: -500px -395px;} /* 전자잡지 */

/* 프로그램신청 */
#section2 {overflow:hidden; position:relative; padding:40px 0 30px; background:#37bdb2 url(/include/image/common/main_pattern.png);}
#section2 .mtit {margin-bottom:35px; color:#fff;}
.swiper-wrapper .nodata {color: #fff;}
.swiper-container {width: 100%; height: 100%; padding-bottom:50px !important;}
.swiper-slide {display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}
.paginationWrap {position: absolute; left: 0; bottom:0; width:100%; text-align: center; z-index: 20; overflow: hidden;}
.paginationWrap .button-play,.paginationWrap .button-stop {display:inline-block; width:15px; height:15px; background:url(/include/image/intro/main/btn_sp_2.png) 0 0 no-repeat; margin-left:-2px; margin-top: 1px; }
.paginationWrap .button-stop {background-position-x:0; }
.paginationWrap .button-play {background-position-x:-15px;}
.swiper-pagination {display: inline-block !important; position: relative !important;}
.swiper-pagination span {margin:0 4px;}
.swiper-pagination-bullet {width:15px !important; height:15px !important; border:solid 2px #fff; background-color:#0070ba !important; opacity:1 !important; border-radius:15px !important; box-sizing:border-box;}
.swiper-pagination-bullet-active {width:39px !important; background-color:#fff !important;}

.programInfo {overflow:hidden; position:relative; width: 100%; padding-left:6px;}
.programInfo .thumbBox {border-radius:5px; overflow: hidden; background-color:#fff; padding-bottom:20px;}
.programInfo .thumbBox .thumb {display:block; max-width:100%; height:100%; box-sizing:border-box; background:#1d4a77 url(/include/image/sclib/main/pro_bg.jpg) no-repeat right bottom;}
.programInfo .thumbBox .thumb p {overflow:hidden; color:#fff; height:51px; font-size:1.125em; font-weight:700; transform:rotate(0.033222deg); padding:15px 20px 0; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.programInfo .thumbBox .thumb img {display:block; width:100%; height:100%; margin:0 auto}
.programInfo .thumbBox .tit {display:block; overflow:hidden; height:48px; font-size:1.188em; font-weight:700; line-height:1.4; padding:10px 20px 0; transform:rotate(0.033222deg); margin-bottom:8px;}
.programInfo .thumbBox .tit img {margin-top:-2px;vertical-align:middle}
.programInfo .thumbBox .info {display:block; color:#444; padding:0 20px; line-height:1.5;}
.programInfo .thumbBox .info span {display:inline-block; font-weight:700; transform:rotate(0.033222deg);}

.status {position:absolute; left:0; top:50%; min-width:75px; margin-top:-55px; font-weight:bold; color:#fff; text-align:center; padding:5px 0; z-index: 9; transform:rotate(0.033222deg);}
.status.ready {background-color:#3c92ea !important;}
.status.ready::after {content:''; position:absolute; left: 0; bottom: -4px; border-top:4px solid #1b60a6; border-left:6px solid transparent;}
.status.apply {background: #ff515d !important;}
.status.apply::after {content:''; position:absolute; left: 0; bottom: -4px; border-top:4px solid #b31621; border-left:6px solid transparent;}
.status.finish {background-color:#888 !important;}
.status.finish::after {content:''; position:absolute; left: 0; bottom: -4px; border-top:4px solid #464646; border-left:6px solid transparent;}
.status.wait {background-color:#1ea953 !important;}
.status.wait::after {content:''; position:absolute; left: 0; bottom: -4px; border-top:4px solid #146b35; border-left:6px solid transparent;}


/* 북리스트 */
#section3 {overflow:hidden; position:relative;}
.bookZone {overflow:hidden; position:relative; background-color:#f5f5f5; padding:30px 0; box-sizing:border-box;}
.bookZone .more {position:absolute;top:60px;right:49px}
.bookZone .tab {margin-bottom:34px;}
.bookZone .tab > li {float:left;}
.bookZone .tab > li + li {margin-left:10px}
.bookZone .tab > li a {display:inline-block; font-size:1.313em; min-width:183px; height:56px; line-height:56px; text-align:center; background-color:#fff; border-radius:56px; box-sizing:border-box; color:#333;}
.bookZone .tab > li:last-child a {padding:0 20px;}
.bookZone .tab > li.on a {border:2px solid #37bdb2; font-weight:700; transform:rotate(0.033222deg); box-shadow:3px 3px 0 #37bdb2;}
.bookList {display:flex;flex-wrap:wrap}
.bookList > li {float:left;width:25%;text-align:center;box-sizing:border-box; }
.bookList .cover {display:block; position:relative; padding:0 13.333% 4.761% 0;}
.bookList .cover a {display:block;position:relative;width:100%;padding-top:133.333%}
.bookList .cover img {position:absolute;top:0;left:0;width:100%;height:100%; border:solid 1px #a9a9a9; box-shadow:6px 6px 7px rgba(0, 0, 0, .15);}
.bookList .rank {position:absolute;top:10px;left:-8px;z-index:2;width:34px;height:34px;padding:0 8px 8px 0;font-size:1.400em;line-height:34px;color:#fff;text-align:center;background:url(/include/image/common/bg_main_rank.png) 0 0 no-repeat;background-size:cover}
.bookList .txt,.bookList .writer {display:block;overflow:hidden;margin-right:13.333%;font-weight:normal;text-align:center;letter-spacing:-0.05em;text-overflow:ellipsis;white-space:nowrap; color:#555;}
.bookList .txt {font-size:1.067em; color:#333;}
.bookList > li.nodata {float:none;width:100%;line-height:150px;text-align:center;}

/* 링크존 */
.linkZone {overflow:hidden; position:relative; background-color:#ececec; padding:38px 0; box-sizing:border-box;}
.linkZone li {position:relative; background-color:#fff; border-radius:5px; margin-bottom:14px;}
.linkZone li dl dt {position:absolute; left:15px; top:50%; width:38px; height:38px; margin-top:-19px; background:url(/include/image/common/main_sns.png) 0 0;}
.linkZone li dl dt.blog {background-position-y:-38px;}
.linkZone li dl dt.kakao {background-position-y:-76px;}
.linkZone li dl dt.culture {background-position-y:-114px;}
.linkZone li dl dt.ask {background-position-y:-152px;}
.linkZone li dl dt.daum {background-position-y:-190px;}
.linkZone li dl dt.instagram {background-position-y:-228px;}
.linkZone li dl dt.lock {background-position-y: -266px}
.linkZone li dl dd {display:table; width:100%; color:#333;}
.linkZone li dl dd p {display:table-cell; vertical-align:middle; width:100%; height:55px; padding:0 0 0 64px; line-height:1.2;}
.linkZone li dl dd p span {font-size:0.875em; color:#555;}

/* 배너 */
#section4 {overflow:hidden; position:relative; background-color:#cdcdcd;}
.banner {position:relative; padding:15px 0;}
.banner .controlArea {overflow:hidden; position:absolute; top:23px; left:0;}
.banner .controlArea a {display:block; width:35px; height:36px; background:url("/include/image/common/btn_roll.png") 0 0 no-repeat}
.banner .controlArea > a {float:left}
.banner .controlArea .pp-controls {float:left}
.banner .controlArea .pp-controls a {width:36px}
.banner .controlArea .btnSlideNext {width:35px;background-position-x:-106px}
.banner .controlArea .btnSlidePause {background-position-x:-35px}
.banner .controlArea .btnSlidePlay {background-position-x:-70px}
.bannerZone {overflow:hidden; margin-left:135px}
.bannerZone .bannerList {overflow:hidden}
.bannerZone .bannerList > li {float:left; width:198px; height:52px; text-align: center; background-color:#fff; margin-right:15px; border: solid 1px #ddd;}
.bannerZone .bannerList a {color:#333;font-size:1.143em}
.bannerZone .bannerList a img {width: 100%; height: 100%;}

@media screen and (max-width:1000px){
	#section1 {padding:50px 15px 0;}
	.mainSearchWrap {margin-bottom:40px;}
	.mainSearchForm {display:block; padding:0 60px;}
	.mainSearchKeyword input, .mainBestKeyword {min-width:auto;}

	#section2 {padding:30px 15px 20px;}
	.bookZone {padding:30px 15px 20px;}
	.bookZone .tab {margin-bottom:25px; border-bottom:solid 1px #dadada; border-right:solid 1px #dadada;}
	.bookZone .tab > li {float:left; width:50%;}
	.bookZone .tab > li + li {margin-left:0}
	.bookZone .tab > li a {display:block; font-size:1.125em; width:100%; min-width:auto; height:40px; line-height:40px; text-align:center; background-color:#fff; border-radius:0; box-sizing:border-box; color:#333; border:solid 1px #dadada; border-right:none; border-bottom:none;}
	.bookZone .tab > li:last-child a {padding:0;}
	.bookZone .tab > li.on a {color:#fff; background-color:#2d89c6; border:none; box-shadow:none;}

	.linkZone {padding:15px 15px 0;}
	.linkZone ul {margin-left:-15px;}
	.linkZone ul li {float:left; width:calc(50% - 15px); margin-left:15px;}

	#section4 {padding:0 15px;}
	.banner .controlArea {top:20px;}
	.banner .controlArea a { width:25px; height:26px; background:url("/include/image/common/btn_roll_M.png") 0 0 no-repeat}
	.banner .controlArea .pp-controls a {width:26px}
	.banner .controlArea .btnSlideNext {width:25px;background-position-x:-77px}
	.banner .controlArea .btnSlidePause {background-position-x:-26px}
	.banner .controlArea .btnSlidePlay {background-position-x:-51px}
	.bannerZone {margin-left:100px}
	.bannerZone .bannerList > li {width:130px; height: 34px margin-right:10px;}
}
@media screen and (max-width:640px){
	.slogan {font-size:1.875em; margin-bottom:20px;}
	.mainSearchForm {padding:0 30px;}
	.mainSearchKeyword {overflow:hidden; padding-left:0; padding-right:60px; height:60px; line-height:60px;}
	.mainSearchKeyword .btnSearch {width:60px; height:52px;}
	.mainSearchKeyword input {height:52px;}
	.mainSearchWrap .title {display:none;}
	.mainBestKeyword {margin-top:15px;}
	.mainBestKeyword .keywordList li {margin:0 7px;}

	.programInfo .thumbBox .thumb {background-size:cover;}
	.programInfo .thumbBox .thumb p {height:43px; padding:15px 20px 0;}
	.programInfo .thumbBox .tit {height:38px; padding:10px 20px 0; margin-bottom:8px;}

	.bookList > li {width:33.33%;}
	.bookList .cover {display:block; position:relative; padding:0 6.666% 4.761% 6.666%;}
	.bookList > li:nth-child(4) {display:none;}
}
@media screen and (max-width:480px){
	.more {top:22px;}
	.more1 {top:-3px;}
	.slogan {font-size:1.625em; letter-spacing: -1px;}

	.libraryTime, .noticeArea {padding:25px 20px;}
	.libraryholiday .selMonth {width:110px;}
	.libraryholiday .selMonth .controlArea {margin-top:-16px;}
	.libraryholiday .selMonth .controlArea a {margin:7px 0}

	.popupZone .textPopup {font-size:1.125em}

	.shortcut {margin:20px 0 10px;}
	.shortcutList li {margin-bottom:15px;}
	.shortcutList li .ico {width:80px; height:80px; background-size:640px 624px;}
	.shortcutList li.svc1 .ico {background-position-x:0;} /*이용안내*/
	.shortcutList li.svc2 .ico {background-position:-80px -104px;} /*책이음*/
	.shortcutList li.svc3 .ico {background-position-x:-160px;} /*상호대차*/
	.shortcutList li.svc4 .ico {background-position:-240px -104px;} /*모바일앱다운로드*/
	.shortcutList li.svc5 .ico {background-position-x:-320px;} /*프로그램신청*/
	.shortcutList li.svc6 .ico {background-position-x:-400px;} /*전자책*/
	.shortcutList li.svc7 .ico {background-position-x:-480px;} /*대관안내*/
	.shortcutList li.svc8 .ico {background-position-x:-560px;} /*온라인설문*/
	.shortcutList li.svc9 .ico {background-position: -397px -316px;} /* 전자잡지 */
	.programInfo .thumbBox .thumb p {padding:10px 15px 0;}
}
@media screen and (max-width:431px){
	.status {top:68px; margin-top:0;}
}
@media screen and (max-width:375px){
	.popupZone .textPopup {font-size:1.188em}
	.status {top:60px;}
	.programInfo .thumbBox .tit {height:38px;}
}
@media screen and (max-width:360px){
	
}
@media screen and (min-width:1000px){
	.libraryInfoGroup {float:left; width:350px; height:300px; border-bottom:solid 1px #cdcecf; box-sizing:border-box;}
	.libraryTime .info.none {height:140px;}
	.noticeGroup {float:left; width:480px; height:300px; border-left:none; box-sizing:border-box;}
	.popupZone {float:left; width:370px; height:300px;}
	.shortcutList li {width:12.5%;}

	#section3 {background:linear-gradient(90deg, #f5f5f5 50%,#ececec 50%,#ececec 100%)}
	.bookZone {float:left; width:900px; height:510px; padding:45px 20px 0 0;}
	.linkZone {float:left; width:300px; padding:38px 0 0 50px; }
}