/* Mirtech Co. */
/* mir_home_main 대진대학교 이용자용 메인 css - copyright all mirtech */

/* Bootstrap Tabs with Slick Hack */
.tab-content>.tab-pane {display: block;visibility: hidden;}
.tab-content>.tab-pane.active {visibility: visible;}
.tab-content{position: relative;}
.tab-pane:not(:first-child){position: absolute;width: 100%;height: 100%;top: 0;left: 0;}
/* Hack Ends */

/* 모바일 설정 =========================================================================== */

a:hover, a:focus{text-decoration:none;}

/* header 설정 ************************************************************************** */
/* main 전용 header */

/* main 설정 **************************************************************************** */

/* PC 설정 =============================================================================== */
    
/**** 검색창 ****/
#main_search{
    width: 100%; height: 400px;
    background: #f2e9e2;
    background-size: cover;
    position: relative;
}
#main_search .search_box{
    width: 100%; height: 170px;
    background: rgba(0,0,0,0.4);
    position: absolute;
    z-index: 10;
    bottom: 0;
    padding: 20px 0;
}
.search_content{
    width: 100%; height: auto;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    padding: 20px 0 0px 0;
}
/* 검색창 모양 설정 */
.search_container{
    width: 100%; height: 60px;
}
.search_container .search_title{
    width: 180px; height: inherit;
    background: #364db4;
    color: #ffffff;
    padding: 12px 0;
    font-size: 22px;
    float: left;
    letter-spacing: 0.15em;
    text-align: center;
}
.search_container .search_title .eng{
    display: block;
    font-size: 14px;
    color: #7c8fe1;
    letter-spacing: 0.49em;
    text-align: center;
}
.search_container input{
    width: calc(100% - 240px); height: inherit;
    padding: 17px 15px 15px 15px;
    border: 0;
    border-radius: 0;
    display: block;
    float: left;
    font-size: 24px;
    color: #584e4e;
}
.search_container input:focus{
	outline: none;
    border: 1px solid #39a0ff;
}
.search_container input::placeholder{       
    font-size: 24px;
    color: #584e4e;
}
.search_container input:-ms-input-placeholder{       
    font-size: 24px;
    color: #584e4e;
}
.search_container input::-ms-input-placeholder{       
    font-size: 24px;
    color: #584e4e;
}
.search_container .btn_search{
    width: 60px; height: inherit;
    background: #364db4 url(../../images/ko/page_main/search_btn.png) no-repeat;
    background-size: 36px 36px;
    background-position: 50% 50%;
    float: left;
    border: 0;
    display: block;
}
/* 인기 검색어 */
#best_keyword{
    width: 100%; height: auto;
    max-width: 1200px;
    margin: 0 auto;
    text-align:left;
    margin-top: 10px;
    color: #ffffff;
}
#best_keyword_title{
    display:inline-block;
    padding: 3px 8px;
    color:#ffffff;
    background: #a6b1e1;
    }
#best_keyword a{
    margin: 0 5px;
    font-size: 14px;
    color: #ffffff;
    }
/* 배경화면 슬라이드 */
#visual_img{
    width: 100%; height: 400px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
#visual_img li{
	width: 100%; height: 400px;
}
#visual_img li:first-child{
	background: url(../../images/ko/page_main/visual_img01.jpg) no-repeat top center;
    background-size: cover;
}
#visual_img li:nth-child(2){
	background: url(../../images/ko/page_main/visual_img02.jpg) no-repeat top center;
    background-size: cover;
}
#visual_img li:last-child{
	background: url(../../images/ko/page_main/visual_img03.jpg) no-repeat top center;
    background-size: cover;
}
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }
.rslides li {
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }


/**** 메인****/

/* 메인 레이아웃 */
#main{
    width: 100%; height: auto; 
    background: #edeef2;
}
#main .main_box{
    width: 100%; height: auto;
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0;
}
#main .main_box h3{
    font-size: 24px;
    font-weight: bold;
    color: #0b2e59;
    display: inline-block;
}
#main .main_box > article{
    padding: 20px;
}
#main .main_box article .more_btn{
    float: right;
    font-size: 30px;
    line-height: 1;
    color: #181816;
    margin: 0; padding: 0;
}
#main .main_box article .more_btn:hover{
    color: #364db4;
}

/**** 퀵메뉴 ****/
#main_quickmenu{
    width: 100%; height: 130px;
    max-width: 1200px;
    margin: 0 auto;
}
#main_quickmenu .quickmenu_list{
    width: 100%; height: auto;
    padding: 10px 0;
}
#main_quickmenu .quickmenu_list li{
    width: 12.5%;
    float: left;
    position: relative;
}
#main_quickmenu .quickmenu_list li::after{
    content: "";
    display: block;
    width: 1px; height: 26px;
    background: #c7c7c7;
    position: absolute;
    top: 50%; right: 0;
    margin-top: -13px;
}
#main_quickmenu .quickmenu_list li:last-child::after{
    display: none;
}
#main_quickmenu .quickmenu_list li a{
    display: block;
    margin-top: 15px;
    transition: 0.3s all;
}
#main_quickmenu .quickmenu_list li:hover a{
    margin-top: 5px;
}
#main_quickmenu .quickmenu_list li a img{
    display: block;
    width: 80px;
    height: 55px;
    margin: 0 auto;
}
#main_quickmenu .quickmenu_list li a span{
    display: block;
    width: auto;
    text-align: center;
    margin-top: 12px;
    font-size: 15px;
}
#main_quickmenu .quickmenu_list li a:hover span{
    color: #364db4;
    text-decoration: none;
    font-weight: bold;
}

/**** 신착자료 - 추천자료 ****/
#main_booklist{
    width: 100%; height: 300px;
    background: #ffffff;
    margin: 0 0 20px 0;
}

/* 탭 설정 */
#main_booklist .nav-tabs{
    border: none;
    padding: 0;
}
#main_booklist .nav-tabs li{
    margin: 0px 20px 0 0;
}
#main_booklist .nav-tabs li a{
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    display: block;
    color: #9d9d9d;
    font-size: 22px;
    font-weight: normal;
    line-height: 1.2;
}
#main_booklist .nav-tabs li.active a{
    background: none;
    border: none;
    font-size: 24px;
    color: #0b2e59;
    font-weight: bold;
    line-height: 1;
}
#main_booklist .nav-tabs li:not(:last-child) a::after{
    content: "";
    width: 1px;
    height: 20px;
    background: #d3d3d3;
    display: block;
    position: absolute;
    top: 1px;
    right: -11px;
}
#main_booklist div .more_btn{
    font-size: 30px;
    color: #181816;
    position: absolute;
    top: -45px; right: 0;
}
#main_booklist div .more_btn:hover{
    color: #ffbc75;
}
#main_booklist .tab-content{
    margin: 20px 0 0 0;
}
/* 신착자료 - 추천자료 Slick 위치 및 버튼 설정 */
.booklist_slider{
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding-top: 0px;
    position: relative;
}
.booklist_slider button{
    background: none;
    border: none;
    z-index: 7;
}
.booklist_slider .prev_btn{
    position: absolute;
    top: 65px;
    left: -30px;
}
.booklist_slider .next_btn{
    position: absolute;
    top: 65px;
    right: -30px;
}
.booklist_box, .slick-slide{
}
.booklist_box a{
}
.booklist_box img{
    width: 125px;
    height: 170px;
    display: block;
    margin: 0 auto;
    box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.13);
}
.booklist_box span{
    display: block;
    text-align: center;
    width: 100%;
    max-width: 125px;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.booklist_box a:hover span{
    text-decoration: underline;
}
.booklist_box .booktitle{
    font-size: 14px;
    color: #231f20;
    margin-top: 5px;
}
.booklist_box .bookwriter{
    font-size: 13px;
    color: #9d9d9d;
}


/**** 공지사항 ****/
#main_notice{
    width: 100%; height: 250px;
    max-width: calc(100% - 680px);
    margin: 0 20px 0 0;
    float: left;
    background: #ffffff;
}
#main_notice  .notice_list{
    width: 100%;
    margin: 20px 0 0 0;
}
#main_notice  .notice_list li{
    width: 100%;
    margin-bottom: 15px;
}
#main_notice .notice_list li:last-child{
    margin-bottom: 0;
}
#main_notice  .notice_list li:after{
    content:"";
    display: block;
    clear: both;
}
#main_notice  .notice_list li a{
    width: calc(100% - 110px);
    display: block;
    float: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 16px;
    font-weight: bold;
}
#main_notice  .notice_list li a:hover{
    color: #364db4;
}
#main_notice  .notice_list li .notice_date{
    float: right;
    width: 100px;
    font-size: 15px;
    color: #3d4e91;
}

/**** 개관시간 ***/
#main_time{
    width: 100%; height: 250px;
    max-width: 320px;
    background: #ffffff;
    margin: 0 20px 0 0;
    float: left;
}
/* 셀렉트박스 */
#main_time .btn-group{
    margin-right: 5px;
}
#main_time .btn-group > a{
    width: 70px; height: 23px;
    background: #5b72d7;
    font-size: 14px;
    color: #ffffff;
    line-height: 1;
    padding: 5px;
    border-radius: 0;
}
#main_time .btn-group > a .caret{
    margin-left: 5px;
}
#main_time .btn-group .dropdown-menu{
    min-width: 70px;
}
#main_time .btn-group .dropdown-menu li a{
    padding: 5px;
}
#main_time .dropdown-menu > .active > a, 
#main_time .dropdown-menu > .active > a:hover, 
#main_time .dropdown-menu > .active > a:focus{
    background-color: #364db4;
}
/* 내용 */
#main_time .tab-content{
    margin: 20px 0 0 0;
}
.time_list > li{
    width: 100%; height: 50px;
    margin: 0 0 7px 0;
}
.time_list dl dt{
    width: 85px; height: 50px;
    background: #364db4;
    color: #ffffff;
    text-align: center;
    font-size: 16px;
    padding: 13px 0;
    float: left;
}
.time_list dl dd{
    width: calc(100% - 85px); height: 50px;
    background: #edeef2;
    float: left;
    text-align: right;
    padding: 8px;
}
.time_list dl dd .label{
    display: inline-block;
    min-width: 45px;
    background-color: #5f5f5f;
    border-radius: 5px;
    vertical-align: middle;
    font-size: 13px;
    padding: 2px;
}
.time_list dl dd .holiday{
    font-size: 14px;
    padding: 5px 0;
}
.time_list dl dd .holiday .label{
    background: #e45959;
}

/**** 팝업 ****/
#main_popup{
    width: 100%; height: 250px;
    max-width: 320px;
    float: left;
    position: relative;
    padding: 0 !important;
    overflow: hidden;
}
#main_popup .popup_slider a{
    display: block;
    width: auto; height: auto;
}
#main_popup .popup_slider .slick-dots{
    width: 100%;
    position: absolute;
    left: 10px; bottom: 15px;
    text-align: left;
}
#main_popup .popup_slider .slick-dots li{
    width: 15px; height: 15px;
    margin: 0 5px 0 0;
}
#main_popup .popup_slider .slick-dots li button:before{
    display: none;
}
#main_popup .popup_slider .slick-dots li button{
    content: "";
    width: 15px;
    height: 15px;
    border-radius: 25px;
    background: #ffffff; 
    opacity: 1;
    border: 1px solid #3d4e91;
}
#main_popup .popup_slider .slick-dots li.slick-active button{
    background: #3d4e91; 
}

/* 배너 */
#main_banner{
    width: 100%; height: 70px;
}
.banner_slider{
    width: 100%; height: auto;
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 15px;
}
.banner_slider .slick-list{
    margin-left: -27px;
    max-width: 1200px;
}
.banner_slider .slick-slide{
    text-align: center;
    margin-left: 27px;
}
.banner_slider button{
    border: none;
    background: transparent;
    position: absolute;
    width: 30px; height: 30px;
    padding: 0;
    z-index: 10;
}

/* 태블릿 설정 =========================================================================== */

@media only screen and (max-width:1200px){


    
    /**** 메인 레이아웃 ****/
    #main{
        width: 100%;
        height: auto;
    }
    #main .main_box{
        padding: 50px 10px;
    }
    
    /**** 검색창 ****/
    #main_search .search_box{
        padding: 20px 10px;
    }
    
    /**** 퀵메뉴 ****/
    #main_quickmenu{
        padding: 0 10px;
    }
    
    /**** 도서리스트 ****/
    .booklist_slider .next_btn{
        right: -15px;
    }
    .booklist_slider .prev_btn{
        left: -15px;
    }
    
    /**** 공지사항 ***/
    #main_notice{
        max-width: calc(100% - 340px);
    }
    
    /*** 개관시간 ***/
    #main_time{
        margin: 0 0 20px 0;
    }
    
    /**** 팝업존 ****/
    #main_popup{
        max-width: 100%;
    }
    .popup_slider .slick-slide{
        text-align: center;
        background: #dddddd;
    }

    /**** 배너 ****/
    #main_banner{
    }
    #main_banner .banner_list{
        width: 100%;
        height: auto;
    }
    .banner_slider{
        width: calc(100% - 80px);
        position: relative;
    }
    .banner_slider .prev_btn{
        top: 20px; left: -25px;
    }
    .banner_slider .next_btn{
        top: 20px; right: -25px;
    }
    
    /**** 사이트맵 ****/
    #main_sitemap{
        display: none;
    }

}



/* 모바일 설정 =========================================================================== */

@media only screen and (max-width: 768px){

    /**** 검색창 ****/
    #main_search{
        height: 250px;
    }
    #main_search .search_box{
        width: calc(100% - 20px); height: 130px;
        top: 50%; bottom: initial;
        left: 10px;
        margin-top: -65px;
        padding: 5px 10px;
    }
    .search_container{
        height: 50px;
    }
    .search_container .search_title{
        width: 120px;
        font-size: 18px;
    }
    .search_container .search_title .eng{
        font-size: 13px;
        letter-spacing: 0.35em;
    }
    .search_container input{
        width: calc(100% - 170px);
        font-size: 18px;
    }
    .search_container input::placeholder{       
        font-size: 18px;
    }
    .search_container input:-ms-input-placeholder{       
        font-size: 18px;
    }
    .search_container input::-ms-input-placeholder{       
        font-size: 18px;
    }
    .search_container .btn_search{
        background: #ffffff url(../../images/ko/page_main/search_btn_mobile.png) no-repeat;
        background-size: 36px 36px;
        background-position: 50% 50%;
        width: 50px;
    }
    /* 메인 슬라이더 */
    #visual_img{
        height: 250px;
    }
    #visual_img li{
        height: 250px;
    }

    /**** 메인 레이아웃 ****/
    #main{
    }
    #main .main_box h2{
        font-size: 18px !important;
    }
    #main .main_box h3{
        font-size: 21px;
    }
    #main .main_box h2 .more_btn{
        font-size: 24px;
    }

    /**** 퀵메뉴 ****/
    #main_quickmenu{
        width: 100%; height: 260px;
    }
    #main_quickmenu .quickmenu_list{
    }
    #main_quickmenu .quickmenu_list li{
        float: left; 
        width: 25%; height: 120px;
    }
    #main_quickmenu .quickmenu_list li:nth-child(4):after{
        display: none;
    }
    #main_quickmenu .quickmenu_list li a{
    }
    #main_quickmenu .quickmenu_list li a span{
    	font-size: 13px;
    }

    /**** 도서 리스트 ****/
    #main_booklist{
        width: 100%;
        margin: 0;
    }
    #main_booklist .nav-tabs li{
        height: 25px;
        margin: 0 10px 0 0;
    }
    #main_booklist .nav-tabs li a{
        font-size: 16px;
    }
    #main_booklist .nav-tabs li.active a{
        font-size: 21px;
    }
    #main_booklist .nav-tabs li:not(:last-child) a::after{
        height: 18px;
        right: -6px;
    }
    
    /**** 공지사항 ****/
    #main_notice{
        max-width: inherit;
        margin: 20px 0 20px 0;
    }
    
    /**** 개관시간 ****/
    #main_time{
        max-width: inherit;
    }

    /**** 팝업 ****/
    #main_popup{
        width: 100%;
        height: auto;
        margin: 0 0 0 0;
        float: none;
    }
    .popup_slider .slick-slide{
        width: 100%; height: auto;
        box-sizing: border-box;
        background: transparent;
    }
    .popup_slider .slick-slide img{
        width: 100%;
        height: 100%;
    }

    /**** 배너 ****/
    #main_banner{
        width: 100%;
        height: auto;
    }
    .banner_slider{
        padding: 10px 0;
    }
    .banner_slider .next_btn,
    .banner_slider .prev_btn{
        top: 17px;
    }
}


/* 작은 모바일 설정 =========================================================================== */
@media only screen and (max-width: 440px){
     
    #main_booklist{
    	height: 320px;
    }
    #main_booklist .nav-tabs{
        width: calc(100% - 15px);
    }
    #main_booklist div .more_btn{
        top: -70px;
    }
}

@media only screen and (max-width: 420px){

    /**** 퀵메뉴 ****/
    #main_quickmenu{
        height: 230px;
    }
    #main_quickmenu .quickmenu_list li{
        width: 25%; height: 105px;
        padding: 0 10px;
    }
    #main_quickmenu .quickmenu_list li::after{
    	margin-top: -18px;
    }
    #main_quickmenu .quickmenu_list li a{
    	font-size: 12px;
    }
     #main_quickmenu .quickmenu_list li a img{
    	 width: 60px; height: auto;
     }
    
    /**** 배너 ****/
    #main_banner{
        width: 100%;
    }
    #main_banner .banner_slider .slick-slide a img{
        width: 100%; height: 40px;
    }
}