﻿﻿/*@keyframes animation1 {
  from {  transform:translateY(100px); opacity:0; }
  to { transform:translateY(0); opacity:1; }
}
@keyframes animation2 {
  0% {transform:translateX(0px);}
  50% {transform:translateX(10px);}
  100% {transform:translateX(0px);}
}
@keyframes animation3 {
  0% {transform:translateX(0px);}
  50% {transform:translateX(5px);}
  100% {transform:translateX(0px);}
}
@keyframes animation4 {
  0% {transform:translateX(0px);}
  50% {transform:translateX(-5px);}
  100% {transform:translateX(0px);}
}*/

html{overflow-y: hidden;}

.skip_beforeBtn {position:absolute; float:left; top:0px; left:0px; width:200px; font-size:14px; font-weight:bold; padding-left:10px; height:20px; z-index:9999;}
.beforeBtn{ position:absolute; display:block; height:0; overflow:hidden;}
.beforeBtn:focus, .beforeBtn:active { height:auto; background:#333; color:#f9f9f9; padding:10px 10px 10px 10px; }


.btnPlay {width:28px; height:27px; background:url(/images/egovframework/scourt/main/slidePlay.png); display:block;}   
.btnPlay.paused{width:28px; height:27px; background:url(/images/egovframework/scourt/main/slideStop.png); display:block;}

.bx-wrapper .bx-viewport{background:none;}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{display:inline-block; width:20px; right:-20px;}
.bx-wrapper .bx-controls-auto .bx-stop{width:28px; height:27px; background:url(/images/egovframework/scourt/main/slideStop.png); display:none;}
.bx-wrapper .bx-controls-auto .bx-start {width:28px; height:27px; background:url(/images/egovframework/scourt/main/slidePlay.png); display:none;}   
.bx-wrapper .bx-controls-auto .bx-start:hover,.bx-wrapper .bx-controls-auto .bx-start.active, .bx-wrapper .bx-controls-auto .bx-stop:hover,.bx-wrapper .bx-controls-auto .bx-stop.active {background-position:0;}
.bx-wrapper .bx-prev{ background:url("/images/egovframework/scourt/main/slideL.png") no-repeat;}
.bx-wrapper .bx-next{ background:url("/images/egovframework/scourt/main/slideR.png") no-repeat;}
.bx-wrapper .bx-viewport .bx-clone{display: none;}
/*슬라이더 리셋*/
.bx-viewport a:focus img{border:2px dotted #00bf85 !important; box-sizing:border-box;}     

.scrollTop{ height:0; opacity:0; overflow:hidden; transition-duration:0.3s; background:#cad6eb;}
.scrollTop > div {width:1320px; margin:0 auto; box-sizing:border-box; height:60px; }
.scrollTop ul:after{content:''; display:block; visibility:hidden; clear:both;}
.scrollTop ul li{width:50%; float:left; height:60px; padding:20px 0; box-sizing:border-box;}
.scrollTop ul li a{line-height:20px; font-size:17px; width:90%; box-sizing:border-box; padding-left:14px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; background:url(/images/egovframework/scourt/main/mainBul.png) left 1px no-repeat;}
.scrollTop ul li a:hover{ animation: animation3 1s infinite; }
.headerAreaMainTop .scrollTop{ height:60px; opacity:1;}
/*상단 롤링 공지*/


.mainTitleBox{position:relative;}
.mainTitleBox h2{font-size:24px; line-height:24px; padding-bottom:15px; border-bottom:1px solid #a0a4a9; font-weight:bold;}
.mainTitleBox .moreBtn{position:absolute; top:5px; font-size:17px; right:0;  }
.mainTitleBox .moreBtn:hover{ animation: animation3 1s infinite; }
/*메인 공통타이틀*/

.mainO{background:#f9fbfd;}

.mainPopslider li div.gradationBg19 a{ animation: animation2 1.3s infinite; }

.mainShort:after{content:''; display:block; visibility:hidden; clear:both;}
.mainShort li{float:left; width:16.6%; text-align:center;}
/*.mainShort li{float:left; width:20%; text-align:center;}*/
.mainShort li a{display:inline-block; font-size:18px; padding-top:90px; transition-duration:0.3s;}
.mainShort li a:hover{color:#014099; transform: scale(1.1, 1.1);}
.mainShort li:first-of-type a{background:url(/images/egovframework/scourt/main/mainQ1_1g.png) center top no-repeat;}
.mainShort li:nth-of-type(2) a{background:url(/images/egovframework/scourt/main/mainQ1_2g.png) center top no-repeat;}
.mainShort li:nth-of-type(3) a{background:url(/images/egovframework/scourt/main/mainQ1_3g.png) center top no-repeat;}
.mainShort li:nth-of-type(4) a{background:url(/images/egovframework/scourt/main/mainQ1_8g.png) center top no-repeat;}
.mainShort li:nth-of-type(5) a{background:url(/images/egovframework/scourt/main/mainQ1_5g.png) center top no-repeat;}
.mainShort li:nth-of-type(6) a{background:url(/images/egovframework/scourt/main/mainQ1_6g.png) center top no-repeat;}
.mainShort li:last-of-type a{background:url(/images/egovframework/scourt/main/mainQ1_7g.png) center top no-repeat;}
.mainShort li:first-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ1_1.png) center top no-repeat;}
.mainShort li:nth-of-type(2) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_2.png) center top no-repeat;}
.mainShort li:nth-of-type(3) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_3.png) center top no-repeat;}
.mainShort li:nth-of-type(4) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_8.png) center top no-repeat;}
.mainShort li:nth-of-type(5) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_5.png) center top no-repeat;}
.mainShort li:nth-of-type(6) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_6.png) center top no-repeat;}
.mainShort li:last-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ1_7.png) center top no-repeat;}
/*.mainShort li:first-of-type a{background:url(/images/egovframework/scourt/main/mainQ1_1g.png) center top no-repeat;}
.mainShort li:nth-of-type(2) a{background:url(/images/egovframework/scourt/main/mainQ1_3g.png) center top no-repeat;}
.mainShort li:nth-of-type(3) a{background:url(/images/egovframework/scourt/main/mainQ1_4g.png) center top no-repeat;}
.mainShort li:nth-of-type(4) a{background:url(/images/egovframework/scourt/main/mainQ1_5g.png) center top no-repeat;}
.mainShort li:last-of-type a{background:url(/images/egovframework/scourt/main/mainQ1_6g.png) center top no-repeat;}
.mainShort li:first-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ1_1.png) center top no-repeat;}
.mainShort li:nth-of-type(2) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_3.png) center top no-repeat;}
.mainShort li:nth-of-type(3) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_4.png) center top no-repeat;}
.mainShort li:nth-of-type(4) a:hover{background:url(/images/egovframework/scourt/main/mainQ1_5.png) center top no-repeat;}
.mainShort li:last-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ1_6.png) center top no-repeat;}*/
/*1단 바로가기*/

.mainTw{background:#eff4fc;}
.mainTw .maxBox:after{content:''; display:block; visibility:hidden; clear:both;}
.mainNotice ul li{padding:14px 10px 12px 10px; border-bottom:1px solid #d5d9e0; box-sizing:border-box;}
.mainNotice ul li a{padding-left:60px; position:relative; box-sizing:border-box;}
.mainNotice ul li a .mainNoticeBul{position:absolute; top:12px; left:4px; font-size:20px; font-weight:bold;}
.mainNotice ul li a b{vertical-align:middle; font-size:18px; line-height:23px; font-weight:bold; max-width:calc(100% - 30px); box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; display:inline-block;}
.mainNotice ul li a span:nth-of-type(2){color:#6d6d6d; font-size:14px; font-weight:bold; margin-bottom:6px; display:block;}
.mainNew{vertical-align:middle; color:#fff; background:#b50081; border-radius:50px; width:23px; line-height:20px; height:23px; padding-top:2px; box-sizing:border-box; text-align:center; display:inline-block; font-size:15px; font-weight:900; margin-left:5px;}
/*2단 공지*/

.mainMonth h2{border-bottom:none;} 
.mainMonth > div{background:#fff; box-sizing:border-box; padding:23px 15px 20px; height:561px; } 
.monthM{text-align:center; margin-bottom:22px;}
.monthM a{display:inline-block; margin:0 30px;}
.monthM a:first-of-type:hover{animation: animation4 1s infinite; }
.monthM a:last-of-type:hover{animation: animation3 1s infinite; }
.monthM b span{font-size:50px; font-weight:bold;}
.monthD {height:375px;}
.monthD th{font-size:22px; font-weight:bold; height:35px;}
.monthD td{height:56px; vertical-align:middle; text-align:center;}
.monthD td span{font-size:20px; line-height:28px; padding-top:4px; height:35px; width:35px; text-align:center; display:inline-block; box-sizing:border-box;}
/* 2025.06.09 웹접근성 처리 - span -> a 태그 변경 */
.monthD td a{font-size:20px; line-height:28px; padding-top:4px; height:35px; width:35px; text-align:center; display:inline-block; box-sizing:border-box;} 
.mainMToday{border:2px solid #014099;  border-radius:50px;}
.mainMClosure{background:#d91f1f; color:#fff; border-radius:5px;}
.mainMSchedule{background:#014099; color:#fff; border-radius:50px;}
.monthDComment{position:absolute; top:475px; right:20px; text-align:right;}
.monthDComment li{display:inline-block; padding-left:15px; font-size:15px;}
.mainMBul {display:inline-block; width:8px; height:8px; border-radius:10px; box-sizing:border-box; margin:0 5px 1px 0;}
.mainMBul.mainMClosure {border-radius:0;}
.monthDetail{border-top:1px solid #ddd; position:relative; box-sizing:border-box; width:100%; height:90px;}
.monthDetail h3{position:absolute; width:100px; text-align:center; font-size:20px; top:33px; left:0; }
.monthCen{position: absolute; left: 110px; top: 50%; transform: translate(0,-50%); width:calc(100% - 110px)} 
.monthDetail p{width:100%; box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal;}
.monthDetail a:nth-of-type(2){margin-top:13px;}
/*2단 도서관일정*/

.mainShort2:after{content:''; display:block; visibility:hidden; clear:both;}
.mainShort2 li{float:left; width:50%; box-sizing:border-box; border-top:1px solid rgba(255, 255, 255, 0.3); text-align:center; padding:20px 0 15px 0; height:145px;}
.mainShort2 li:nth-of-type(2n){border-left:1px solid rgba(255, 255, 255, 0.3);}
.mainShort2 li:first-of-type,.mainShort2 li:nth-of-type(2){border-top:none;}
.mainShort2 li a{color:#fff; font-size:18px; display:inline-block; padding-top:82px; transition-duration:0.3s;}
.mainShort2 li a:hover{color:#b3ebff; transform: scale(1.1, 1.1);}
.mainShort2 li:first-of-type a{background:url(/images/egovframework/scourt/main/mainQ2_1.png) center top no-repeat;}
.mainShort2 li:nth-of-type(2) a{background:url(/images/egovframework/scourt/main/mainQ2_2.png) center top no-repeat;}
.mainShort2 li:nth-of-type(3) a{background:url(/images/egovframework/scourt/main/mainQ2_3.png) center top no-repeat;}
.mainShort2 li:nth-of-type(4) a{background:url(/images/egovframework/scourt/main/mainQ2_4.png) center top no-repeat;}
.mainShort2 li:nth-of-type(5) a{background:url(/images/egovframework/scourt/main/mainQ2_5.png) center top no-repeat;}
.mainShort2 li:nth-of-type(6) a{background:url(/images/egovframework/scourt/main/mainQ2_6.png) center top no-repeat;}
.mainShort2 li:nth-of-type(7) a{background:url(/images/egovframework/scourt/main/mainQ2_7.png) center top no-repeat;}
.mainShort2 li:last-of-type a{background:url(/images/egovframework/scourt/main/mainQ2_8.png) center top no-repeat;}
.mainShort2 li:first-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On1.png) center top no-repeat;}
.mainShort2 li:nth-of-type(2) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On2.png) center top no-repeat;}
.mainShort2 li:nth-of-type(3) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On3.png) center top no-repeat;}
.mainShort2 li:nth-of-type(4) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On4.png) center top no-repeat;}
.mainShort2 li:nth-of-type(5) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On5.png) center top no-repeat;}
.mainShort2 li:nth-of-type(6) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On6.png) center top no-repeat;}
.mainShort2 li:nth-of-type(7) a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On7.png) center top no-repeat;}
.mainShort2 li:last-of-type a:hover{background:url(/images/egovframework/scourt/main/mainQ2_On8.png) center top no-repeat;}
/*2단 바로가기*/

.mainTh{background:#f6f8f9;}
.mainTh .maxBox:after{content:''; display:block; visibility:hidden; clear:both;}
.mainBookArea h2{ border-bottom:1px solid rgba(255, 255, 255, 0.3); color:#fff;}
.mainBookArea .moreBtn{color:#fff;}
.mainMBookList li{text-align:center; padding:35px 0px;}
.mainMBookList a {position:relative;}
.mainMBookList a img{width:130px; height:180px; transition-duration:0.3s; box-shadow:rgba(0, 0, 0, 0.2) 3px 3px 4px;}
.mainMBookList a:hover img{transform: scale(1.1, 1.1);}
.mainMBookList a div {opacity:0; transition-duration:0.3s; position:absolute; top:0; left:0; bottom:0; right:0; background:rgba(0, 0, 0, 0.7); padding:55px 10px 0 10px; }
.mainMBookList a div h3{color:#fff; margin-bottom:35px; font-size:18px; line-height:22px; text-overflow:ellipsis; overflow:hidden; height:44px; -webkit-box-orient:vertical; -webkit-line-clamp:2; word-break:break-all; display:-webkit-box;}
.mainMBookList a div p{color:#fff; font-size:14px; line-height:18px; text-overflow:ellipsis; overflow:hidden; height:18px; -webkit-box-orient:vertical; -webkit-line-clamp:1; word-break:break-all; display:-webkit-box;}
.mainMBookList a:hover div{opacity:1; transform: scale(1.1, 1.1);}
.mainNBookListBox {width:510px; padding:35px 20px; margin:0 auto; box-sizing:border-box;}
.mainNBookList a img{width:130px; height:180px; display:inline-block; vertical-align:middle; box-shadow:rgba(0, 0, 0, 0.2) 3px 3px 2px;}
.mainNBookList a div{width:300px; height:180px; margin-left:30px; display:inline-block; vertical-align:middle; box-sizing:border-box; padding:23px 0;}
.mainNBookList a div h3{font-size:19px; color:#fff; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; margin-bottom:20px;}
.mainNBookList a div p{font-size:15px; line-height:24px; color:#c7cad8; text-overflow:ellipsis; overflow:hidden; max-height:96px; -webkit-box-orient:vertical; -webkit-line-clamp:4; word-break:break-all; display:-webkit-box;}
.mainBookArea .bx-wrapper .bx-prev{left:-40px;}
.mainBookArea .bx-wrapper .bx-next{right:-43px;}
/*3단 책소개*/

.mainThListBox{float:left; margin-left:40px; width:700px; padding:25px 0px;}
.mainListB{padding:15px 0;}
.mainListB li {padding:5px 0;}
.mainListB li a{line-height:30px; padding-left:15px; position:relative;}
.mainListB li a:before{position:absolute; display:block; width:4px; height:4px; content:''; border-radius:5px; top:13px; left:3px; background:#509bcf;}
.mainListB li a p{width: calc(100% - 110px); display:inline-block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; vertical-align:middle;}
.mainListB li a span{ text-align:right; width:105px; vertical-align:middle; display:inline-block;}

.main_tab_nav{position:relative; padding:30px 0;}
.main_tab_nav > li {margin-bottom:15px;}
.main_tab_nav > li > a {font-size:19px; width:140px; padding:15px 20px ;box-sizing:border-box;}
.main_tab_nav > li > a span{float:right;}
.main_tab_nav > li.active > a {background:#fff; box-shadow:rgba(0, 0, 0, 0.1) 2px 2px 6px; color:#4081be; font-weight:bold;} 
.main_tab{position:absolute; left:165px; top:0; width:525px;}
.main_tab .moreBtn{position:absolute; right:0; top:-35px;}
/*3단 공지*/


@media all and (max-width:900px) { 
    
    #fullpage, .fp-section.fp-table, .fp-slide.fp-table, .fp-tableCell{height:auto !important;}
    .headerAreaMainTop{height:120px;}
    #fullpage .fullpagePBox{padding:40px 0;}
    #fullpage .mainO{padding-top:110px;}

    .scrollTop > div {width:calc(100% - 40px);  padding:6px 0 6px 0px;}
    .scrollTop ul li{width:100%; height:24px; padding:2px 0;}
    .scrollTop ul li a{line-height:20px; font-size:14px; width:100%; }
    
    .mainTitleBox h2{font-size:22px; line-height:22px; padding-bottom:10px;}
    .mainTitleBox .moreBtn{font-size:15px;}
    /*메인 공통타이틀*/
    
    .mainSearchArea{margin-bottom:30px;}
    .mainSearchArea:after{content:''; display:block; visibility:hidden; clear:both;}    
    .mainSearchArea .mainSearchBar{background:#fff; border:4px solid #265ca8; padding:0 5px; box-sizing:border-box; width:100%;}
    .mainSearchArea .mainSearchBar span{display:block; padding:10px; border-bottom:1px solid #ddd;}
    .mainSearchArea .mainSearchBar span label{font-size:17px; margin:0 15px 0 5px; line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar span input{ line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar > input{width:100%; border:none; padding:5px 10px; height:55px; box-sizing:border-box; background:url(/images/egovframework/scourt/main/mainSearch.png) right center no-repeat;}
    .mainSearchArea .mainSearchBtn{color:#fff; text-align:center; height:50px; line-height:50px; font-size:17px; float:left; width:50%;} 
    /*1단 검색*/

    .mainPop {position:relative; margin-bottom:20px;}
    .mainPopslider li{position:relative; padding-bottom:140px;}
    .mainPopslider li img{width:100%; height:auto;}
    .mainPopslider li div.gradationBg19{width:94%; height:150px; position:absolute; bottom:10px; left:3%; z-index:2; box-sizing:border-box; padding:15px;}
    .mainPopslider li div.gradationBg19 p{font-size:19px; line-height:28px; color:#fff; height:90px;}
    .mainPopslider li div.gradationBg19 a{font-size:16px; font-weight:100; line-height:23px; display:inline-block; color:#bec5d8; padding:4px 0 0 30px; background:url(/images/egovframework/scourt/main/more.png) left center no-repeat; background-size:20px; transition-duration:0.5s;}    
    .btnPlay{position:absolute; bottom:25px; right:36px; width:24px; height:24px; background-size:contain;}  
    .btnPlay.paused{width:24px; height:24px; background-size:contain;}  
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager {position:absolute; bottom:25px; right:80px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{display:block; width:50px; right:0px; text-align:right; padding-top:0; bottom:-2px; font-size:18px; color:#ccc; font-weight:100; letter-spacing:4px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager::first-letter{font-size:26px; color:#fff; font-weight:600;}
    .mainPop .bx-wrapper .bx-prev{left:0; bottom:0;}
    .mainPop .bx-wrapper .bx-next{right:auto; left:40px; }
    .mainPop .bx-wrapper .bx-controls-direction a{width:24px; height:24px; bottom:0px; top:auto; background-size:contain;}  
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{right:auto; left:18px; bottom:18px;}        
    /*1단 슬라이더*/

    .mainShort li{width:45%; margin-bottom:20px;}
    .mainShort li:nth-of-type(2n+1){width:55%; margin-bottom:20px;}
    .mainShort li a{font-size:16px; padding-top:60px; background-size:40px !important; letter-spacing:-1px;}
    /*1단 바로가기*/
    
    .mainNotice{float:left; width:100%; margin-bottom:35px;}
    .mainNotice ul li{padding:12px 5px 7px 5px; }
    .mainNotice ul li a{padding-left:0px;}
    .mainNotice ul li a .mainNoticeBul{top:0px; left:0px; font-size:14px; }
    .mainNotice ul li a b{font-size:17px; line-height:22px; max-width:calc(100% - 25px); }
    .mainNotice ul li a span:nth-of-type(2){margin-bottom:4px; padding-left:35px;}
    .mainNew{ width:20px; line-height:18px; height:20px; padding-top:1px; font-size:13px; margin-left:3px;}
    /*2단 공지*/
    
    .mainMonth{float:left; width: 100%; box-sizing:border-box; margin-bottom:30px;} 
    .mainMonth > div{ padding:15px 10px 1px; height:auto;} 
    .monthM{text-align:center; margin-bottom:17px;}
    .monthM a{margin:0 20px; width:20px;}
    .monthM b span{font-size:35px; }
    /* .monthD {height:auto; margin-bottom:5px;} */
    .monthD {height:auto; margin-bottom:10px;}
    .monthD th{font-size:17px; height:22px;}
    .monthD td{height:38px; }
    .monthD td span{font-size:17px; line-height:30px; padding-top:0px; height:30px; width:30px;}
    /* 2025.06.09 웹접근성 처리 - span -> a 태그 변경 */
    .monthD td a{font-size:17px; line-height:30px; padding-top:0px; height:30px; width:30px;} 
    /* .monthDComment{ top:auto; right:10px; bottom:105px;} */
    .monthDComment{ top:auto; right:10px; bottom:75px;}
    .monthDComment li{padding-left:2px; font-size:12px;}
    .mainMBul {width:6px; height:6px; margin:0 3px 0px 0;}
    .monthDetail{ height:70px;}
    .monthDetail h3{ width:80px; font-size:18px; top:26px;}
    .monthCen{ left:85px; width:calc(100% - 85px)} 
    .monthDetail p{font-size:15px;}
    .monthDetail a:nth-of-type(2){margin-top:7px;}
    /*2단 도서관일정*/

    .mainShort2{float:left; width:100%; margin-left:0px; padding:7px 5px; box-sizing:border-box; }  
    .mainShort2 li{ padding:10px 0; height:auto;}
    .mainShort2 li a{font-size:17px; padding-top:57px; background-size:45px !important;}
    /*2단 바로가기*/
    
    .mainBookArea { float:left; width:100%; box-sizing:border-box; padding:15px 10px 0px 10px ; margin-bottom:30px;}     
    .mainTitleBox .mainBookMo, .mainNBookListBox{padding:0 20px;}
    .mainMBookList li{text-align:center; padding:20px 0px 30px 0px; margin-right:20px !important;}
    .mainNBookListBox {width:auto; padding:20px 0px; }
    .mainNBookList a img{ display:block; margin:0 auto;}    
    .mainNBookList a div{width:100%; margin-left:0px; padding:23px 0 0 0; height:150px;}
    .mainNBookList a div h3{font-size:18px; margin-bottom:10px;}
    .mainBookArea .bx-wrapper .bx-prev{left:-30px;}
    .mainBookArea .bx-wrapper .bx-next{right:-35px;}
    /*3단 책*/

    .mainThListBox section:first-of-type{margin-bottom:20px; }    
    .mainThListBox{margin-left:0px; width:100%; padding: 0px;}    
    .mainListB{padding:10px 0;}
    .mainListB li a{line-height:20px; padding-left:12px}
    .mainListB li a:before{position:absolute; display:block; width:4px; height:4px; content:''; border-radius:5px; top:8px; left:2px; background:#509bcf;}
    
    /*수정해야함*/
    .mainListB li a p{width: 100%; display:inline-block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; vertical-align:middle;}
    .mainListB li a span{ display:none;}
    /*.mainListB li a p{width: calc(100% - 110px); display:inline-block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; word-wrap:normal; vertical-align:middle;}
    .mainListB li a span{ text-align:right; width:105px; vertical-align:middle; display:inline-block;}*/
    /*수정해야함*/    

    .main_tab_nav{height:240px; padding:15px 0;}    
    .main_tab_nav > li {margin-bottom:15px; display:inline-block;}
    .main_tab_nav > li > a {font-size:17px; width:auto; padding:10px 20px; }
    .main_tab_nav > li > a span{display:none;}    
    .main_tab{left:0; top:50px; width:100%;}
    .main_tab .moreBtn{position:absolute; right:0; top:-80px;}
    /*3단 공지*/


}
/*mobile*/
@media all and (min-width:901px) and (max-width:1358px) { 
    
    #fullpage, .fp-section.fp-table, .fp-slide.fp-table, .fp-tableCell{height:auto !important;}
    .headerAreaMainTop{height:120px;}
    #fullpage .fullpagePBox{padding:60px 0;}

    #fullpage .mainO{padding-top:100px;}
    .scrollTop > div {width:calc(100% - 40px); }

    
    .mainSearchArea{margin-bottom:40px;}
    .mainSearchArea:after{content:''; display:block; visibility:hidden; clear:both;}    
    .mainSearchArea .mainSearchBar{background:#fff; border:4px solid #265ca8; padding:10px; box-sizing:border-box; width:100%;}
    .mainSearchArea .mainSearchBar span{display:inline-block; padding:10px 5px 10px 10px; border-right:1px solid #ccc;}
    .mainSearchArea .mainSearchBar span label{font-size:17px; margin:0 15px 0 5px; line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar span input{ line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar > input{width:calc(100% - 275px); border:none; padding-left:10px; height:30px; box-sizing:border-box; background:url(/images/egovframework/scourt/main/mainSearch.png) right center no-repeat;}
    .mainSearchArea .mainSearchBtn{color:#fff; text-align:center; height:65px; line-height:65px; font-size:17px; float:left; width:50%;} 
    /*1단 검색*/
    
    .mainShort li a{ font-size:16px; letter-spacing:-2px; display:block;}

    .mainPop {position:relative; margin-bottom:40px;}
    .mainPopslider li{position:relative; padding-left:350px;}
    .mainPopslider li img{width:100%; height:300px;}
    .mainPopslider li div.gradationBg19{width:380px; height:270px; position:absolute; top:15px; left:0; z-index:2; box-sizing:border-box; padding:25px;}
    .mainPopslider li div.gradationBg19 p{font-size:24px; font-weight:bold; line-height:35px; color:#fff; height:190px;}
    .mainPopslider li div.gradationBg19 a{font-size:17px; font-weight:100; line-height:27px; color:#bec5d8; padding:4px 0 0 38px; background:url(/images/egovframework/scourt/main/more.png) left center no-repeat; transition-duration:0.5s;}
    
    .btnPlay{position:absolute; bottom:45px; left:305px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager {position:absolute; bottom:45px; left:275px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{display:block; width:68px; right:0px; text-align:right; padding-top:0; bottom:-5px; font-size:20px; color:#ccc; font-weight:100; letter-spacing:10px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager::first-letter{font-size:34px; color:#fff; font-weight:600;}
    .mainPop .bx-wrapper .bx-prev{left:0; bottom:0;}
    .mainPop .bx-wrapper .bx-next{right:auto; left:60px; }
    .mainPop .bx-wrapper .bx-controls-direction a{width:28px; height:27px; bottom:0px; top:auto;}  
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{right:auto; left:18px; bottom:18px;}    
    /*1단 슬라이더*/
    
    .mainNotice{float:left; width:100%; margin-bottom:50px;}
    /*2단 공지*/
    
    .mainMonth{float:left; width: calc(100% - 320px); box-sizing:border-box; } 
    /*2단 도서관일정*/

    .mainShort2{float:left; width:280px; margin-left:40px; padding:10px 5px; box-sizing:border-box; }     
    /*2단 바로가기*/
    
    .mainBookArea { float:left; width:100%; box-sizing:border-box; padding:25px 10px; margin-bottom:40px;}        
    .mainThListBox section:first-of-type{margin-bottom:30px; }    
    .mainThListBox{margin-left:0px; width:100%; padding: 0px;}
    
    .main_tab_nav{height:240px;}
    .main_tab{ width: calc(100% - 165px);}
    /*3단 공지*/
    
}
/*tablet*/
@media all and (min-width:1359px) {  
    #fp-nav {position: fixed; top: 0; bottom: 0; margin: 0 !important; border-right: 1px solid #ddd; transition-duration:1s; transition-property:all; transition-timing-function:ease;}
    .fp-viewing-footer #fp-nav{bottom:165px;}
    .fp-right#fp-nav{right:20px;}
    #fp-nav ul {position: relative; top: 50%; text-align: right; transform: translateY(-60%);}
    #fp-nav ul li {position: relative; margin:50px 0 50px 0; height:14px;}
    #fp-nav ul li:last-of-type {display:none; }
    
    #fp-nav ul li a span, .fp-slidesNav ul li a span {display: block; overflow: hidden; width: 11px; height: 11px; background:rgba(0, 0, 0, 0.2); margin:-5px 0 0 2px;}
    #fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span, #fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span {background:rgba(0, 0, 0, 1);  margin:-5px 0 0 2px; width: 11px; height: 11px;}
    #fp-nav .active::after, #fp-nav li:hover a::after { position: absolute; right: -12px; width: 21px; height: 21px; margin-top: -4px; border-radius: 100%; content: '';  border:1px solid #ccc;}
    #fp-nav a::before { position: absolute; right: -22px; width: 21px; height: 1px; margin-top: 7px; content: ''; background:#ddd;}
    #fp-nav ul li .fp-tooltip { top: -6px; color: #333; font-size: 17px; line-height:28px; font-family: 'NanumSquare', '나눔스퀘어'; opacity: 1; width: auto; }
    #fp-nav ul li a.active + .fp-tooltip {background:#b50081; color:#fff; padding:0 10px; border-radius:50px;}
    /*사이드엥커*/

    .headerAreaMainTop{height:140px;}
    #fullpage .fullpagePBox{padding-top:80px;}
    #fullpage .mainO .fullpagePBox{padding-top:140px;}
    
    .mainSearchArea{margin-bottom:40px; opacity:0; transform:translateY(100px); -webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out; animation: animation1 0.6s;}
    .mainO.mainAnimation .mainSearchArea{transform:translateY(0);opacity:1; transition-delay:.5s}
    .mainSearchArea:after{content:''; display:block; visibility:hidden; clear:both;}
    .mainSearchArea .mainSearchBar{background:#fff; border:4px solid #265ca8; padding:16px; box-sizing:border-box; float:left; width:1039px;}
    .mainSearchArea .mainSearchBar span{display:inline-block; padding:10px 10px 10px 15px; border-right:1px solid #ccc;}
    .mainSearchArea .mainSearchBar span label{font-size:20px; margin:0 20px 0 10px; line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar span input{ line-height:20px; vertical-align:middle;}
    .mainSearchArea .mainSearchBar > input{width:670px; border:none; padding-left:20px; height:30px; box-sizing:border-box; background:url(/images/egovframework/scourt/main/mainSearch.png) right center no-repeat;}
    .mainSearchArea .mainSearchBtn{color:#fff; padding:22px 40px; box-sizing:border-box; float:left; height:80px; line-height:36px; font-size:22px;} 
    /*1단 검색*/
    
    .mainPop {position:relative; margin-bottom:40px; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out; animation: animation1 0.9s;}
    .mainO.mainAnimation .mainPop {transform:translateY(0);opacity:1;transition-delay:.7s}
    .mainPopslider li{position:relative; padding-left:520px;}
    .mainPopslider li img{width:800px; height:300px;}
    .mainPopslider li div.gradationBg19{width:543px; height:270px; position:absolute; top:15px; left:0; z-index:2; box-sizing:border-box; padding:30px;}
    .mainPopslider li div.gradationBg19 p{font-size:28px; font-weight:bold; line-height:40px; color:#fff; height: 135px;}
    .mainPopslider li div.gradationBg19 a{font-size:17px; font-weight:100; line-height:27px; color:#bec5d8; padding:4px 0 0 38px; background:url(/images/egovframework/scourt/main/more.png) left center no-repeat; transition-duration:0.5s;}

    
    .btnPlay{position:absolute; bottom:45px; left:455px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager {position:absolute; bottom:45px; left:425px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{display:block; width:68px; right:0px; text-align:right; padding-top:0; bottom:-5px; font-size:20px; color:#ccc; font-weight:100; letter-spacing:10px;}
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager::first-letter{font-size:34px; color:#fff; font-weight:600;}
    .mainPop .bx-wrapper .bx-prev{left:0; bottom:0;}
    .mainPop .bx-wrapper .bx-next{right:auto; left:60px; }
    .mainPop .bx-wrapper .bx-controls-direction a{width:28px; height:27px; bottom:0px; top:auto;}  
    .mainPop .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{right:auto; left:18px; bottom:18px;}    
    /*1단 슬라이더*/

    .mainShort{opacity:0;transform:translateY(100px) ;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out;  animation: animation1 1.2s;}
    .mainO.mainAnimation .mainShort{transform:translateY(0);opacity:1;transition-delay:.9s}
        
    .mainNotice{float:left; width:560px; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;}
    .mainTw.mainAnimation .mainNotice{transform:translateY(0);opacity:1;transition-delay:.5s}
    
    .mainMonth{float:left; width:400px; margin-left:40px; box-sizing:border-box; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;} 
    .mainTw.mainAnimation .mainMonth{transform:translateY(0);opacity:1;transition-delay:.7s} 
    
    .mainShort2{float:left; width:280px; margin-left:40px; padding:10px 5px; box-sizing:border-box; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;} 
    .mainTw.mainAnimation .mainShort2{transform:translateY(0);opacity:1;transition-delay:.9s}     
    
    .mainBookArea { float:left; width:580px; box-sizing:border-box; padding:25px 10px; height:620px; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;}
    .mainTh.mainAnimation .mainBookArea { transform:translateY(0);opacity:1;transition-delay:.5s}    
    
    .mainThListBox section:first-of-type{margin-bottom:30px; opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;}
    .mainTh.mainAnimation .mainThListBox section:first-of-type{transform:translateY(0);opacity:1;transition-delay:.7s}    
    
    .mainThListBox section:last-of-type{opacity:0;transform:translateY(100px);-webkit-transition:all 1s ease-in-out; transition:all 1s ease-in-out;}
    .mainTh.mainAnimation .mainThListBox section:last-of-type{transform:translateY(0);opacity:1;transition-delay:.9s}

}
/*pc*/
