﻿/* Mirtech Co. */
/* mir_home_main 대진대학교 이용자용 메인 css - copyright all mirtech */

/* 인코딩 설정 */
@charset "utf-8";

/* 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 설정 =============================================================================== */
/**** TOP 이동버튼 ****/
body{
    position: relative;
}
#goTop{
    position: fixed;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #245bb6;
    bottom: 3%;
    z-index: 99;
    right: 3%;
    cursor: pointer;
    transition: all 0.3s ease;
}
.base{
    opacity: 0;
}
div.TopBtn{
    opacity: 1;
}
#goTop > p{
    color: #ffffff;
    padding: 18px 12px;
    font-size: 18px;
}
.TopBtn_off{
    opacity: 0;
}

/**** 검색창 ****/

#main_search {
    width: 100%;
    height: 380px;
    background: #f2e9e2;
    background-size: cover;
    position: relative;
}

#main_search .search_box {
    width: 100%;
    height: 165px;
    background: rgba(255,255,255,0.6);
    position: absolute;
    z-index: 10;
    bottom:0px;
    /*transform:translateY(-50%);*/
    padding: 30px 20px;
}

.search_content {
    width: 100%;
    height: auto;
    max-width: 1300px;
    margin: 0 auto;
    position: relative;
}

/* 검색창 모양 설정 */
.search_content .nav-tabs{
	width:70%;
	margin: 0 auto;
	border-bottom:0px;
}

.search_content .nav-tabs > li > a{
		background-color:rgba(0,0,0,0.8);
		border:1px solid rgba(0,0,0,0.7);
		color:#ffffff;
		margin-right:0px;
		/* font-family:'Noto Sans KR', sans-serif; */
		font-weight:bold;
		opacity:0.8;
		
	}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{
		background-color:#1a5099;
		border:1px solid #1a5099;
		color:#ffffff;
		opacity:1;
}

.search_container {
    width: 70%;
    height: 60px;
    margin: 0 auto;
    border: 2px solid #1a5099;
    background-color: #ffffff;
    position: relative;

}

.search_container .search_select {
    color: #ffffff;
    font-size: 20px;
    float: left;
    letter-spacing: 0.18em;
    text-align: center;
    background-color:#1a5099;   
}
    select {
	width: 20%;
    height: 100%;
    line-height:24px;
    display: inline-block;
	padding: 5px 15px 5px 30px;
	font-family: inherit;
	background: url('../../images/ko/page_main/select_arrow.jpg') no-repeat 95% 50%;
	border-radius: 0px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	float:left;
	border: 0px solid #ffffff;
	color:#cecece;
	}

	select::-ms-expand {
	display: none;
	}

.search_container input {
    width: 92%;
    height: 100%;
    line-height: 23px;
    padding: 7px 15px 5px 15px;
    border: 0;
    display: block;
    float: left;
    font-size: 15px;
    color: #565656;
}

.search_container input::placeholder {
    font-size: 18px;
    color: #b4b4b4;
}

.search_container input:-ms-input-placeholder {
    font-size: 18px;
    color: #b4b4b4;
}

.search_container input::-ms-input-placeholder {
    font-size: 18px;
    color: #b4b4b4;
}

.search_container button {
    width: 8%;
    height: 100%;
	background-color:#1a5099;
    border: 0;
    display: block;
    position: absolute;
    right: 0px;
    top:0px;
}

/* 인기 검색어 
#best_keyword{
    width: 90%; height: auto;
    max-width: 1300px;
    margin: 0 auto;
    text-align:left;
    margin-top: 10px;
    color: #41354d;
}
#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: 380px;
    position: relative;
    z-index: 1;
}

#visual_img li {
    width: 100%;
    height: 380px;
}

#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_quickmenu {
    width: 100%;
    height: 125px;
    margin: 0 auto;
    box-shadow: 4px 3px 5px 0px rgba(0, 0, 0, 0.1);
}

#main_quickmenu .quickmenu_list {
    width: 93%;
    height: auto;
    max-width: 1300px;
    padding: 10px 0;
    margin: 0 auto;
}

#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: 6px;
    transition: 0.3s all;
    word-break: keep-all;
    line-height: 16px;
    font-weight:bold;

}
#main_quickmenu .quickmenu_list li a .quickHover{
	display:none;
}
#main_quickmenu .quickmenu_list li:hover a {
    margin-top: 0px;
}
#main_quickmenu .quickmenu_list li:hover a .quickNone{
    margin-top: 0px;
    display:none;
}
#main_quickmenu .quickmenu_list li:hover a .quickHover{
    margin-top: 0px;
    display:block;
}
#main_quickmenu .quickmenu_list li a img {
    display: block;
   /*  width: 80px;
    height: 55px;*/
    margin: 0 auto;
    width:42%;
}

#main_quickmenu .quickmenu_list li a > p {
    display: block;
    width: auto;
    text-align: center;
    margin-top: 6px;
    color: #40368a;
    font-size: 16px;
    /* font-family:'Noto Sans KR', sans-serif; */
}

#main_quickmenu .quickmenu_list li a:hover p {
    text-decoration: none;
    font-weight: bold;
}




/**** 메인1- 공지사항,팝업슬라이드2 ****/

/* 메인 레이아웃 */
#main {
    width: 100%;
    height: auto;
    position: relative;
    /* font-family:'Noto Sans KR', sans-serif; */
}

#main::before {
    display: block;
    content: "";
    width: 100%;
    height: 250px;
    background: #e4ebf8;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

#main .main_box {
    width: 93%;
    height: auto;
    max-width: 1300px;
    margin: 0 auto;
}

#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_wrap {
    width: 93%;
    max-width: 1300px;
    margin: 0 auto;
    padding-top: 30px;
    padding-bottom: 30px;
    height: auto;

}

.main_wrap::after {
    content: "";
    display: block;
    clear: both;
}





/**** 개관시간 ***/
#main_time{
    width: 30%; height: 355px;
    float: right;
}

#main_time > div> h3 {
    padding-bottom: 8px;
    color: #383477;
    font-size: 24px;
    /* font-family: 'NanumSquare', sans-serif; */
    font-weight: 700;
    float: left;
}
.main_time_text{
	display:inline-block;
	padding-left:5px;
	line-height:28px;
	color:#1a5099; font-weight:bold;
}
.viewMore2{
    display: inline-block;
    padding: 0px 10px;
    background-color: #1a5099;
    color: #ffffff;
    font-size: 20px;
    font-weight: 100;
}
.viewMore2:hover{
    color: #ffffff;
}
.timeRight{
}

/* 셀렉트박스 */
#main_time .btn-group{
    margin-right: 5px;
    margin-top: -8px;
}
#main_time .btn-group > a{
    width: 70px; height: 28px;
    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{
    background-color: #ffffff;
    height: 316px;
    border:1px solid #bfcad9;
}
.time_list >  li {
	width:100%; height:90px;
}

.time_list > li:first-child {
	width:100%; height:45px;
}
.time_list >  li dl dt{
	float:left;
	width:20%; height:90px;
	background-color:#1a5099;
	text-align:center; color:#ffffff;
	padding:20px 10px; border-bottom:1px solid #ffffff;
}
.time_list >  li:nth-child(1)  dl dt{
	height:45px; border-bottom:1px solid #ffffff;
	padding:10px 10px;
}
.time_list >  li:last-child  dl dt{
	border-bottom:0px;
}

.time_list >  li dl dd{
	float:left;
	width:80%;
	height:auto;	
}
.time_list >  li dl  dd > div > ul,
.time_list >  li dl  dd > ul{
	float:left;
}
.time_list >  li dl  dd::after{
	content:"";
	display:block;
	clear:both;
}

.time_list_D_loaction{
	width:38%;
	text-align:center; font-weight:bold;
	background-color:#bfcad9; 
	border-bottom:1px solid #ffffff;
	height:45px; line-height:45px;
}

.time_list_D_time{
	width:62%;
	border-bottom:1px solid #bfcad9;
	height:45px; 
	/*padding:12px 10px;*/
	padding:2px 10px;
}
.time_list >  li:last-child  dl dd div:last-child .time_list_D_loaction,
.time_list >  li:last-child  dl dd div:last-child .time_list_D_time{
	border-bottom:0px;
}



.time_list dl dd .label{
    display: inline-block;
    min-width: 38px;
    background-color: #5f5f5f;
    vertical-align: middle;
    font-size: 10px;
    margin-left: 10px;
}
.time_list dl dd .holiday{
}
.time_list dl dd .holiday .label{
    background: #e45959;
}






/**** 공지사항 시작 ****/

#main_noticelist {
    width: 37%;
    float: left;
    margin-left: 1.5%;
    margin-right: 1.5%;
}

#main_noticelist > div> h3 {
    padding-bottom: 8px;
    color: #383477;
    font-size: 24px;
    /* font-family: 'NanumSquare', sans-serif; */
    font-weight: 700;
    float: left;
}

.piece {
    border: 1px solid #bfcad9;
    background-color: #ffffff;
}

.jq_tabonoff_auto {
    position: relative;
}

.jq_tabonoff_auto::after {
    content: "";
    display: block;
    clear: both;
}

.jqWrap {
    float: right;
}

.tab_menu {
    float: left;
}

.viewMore {
    padding: 0px 10px;
    background-color: #1a5099;
}

.viewMore > a {
    color: #ffffff;
    font-size: 20px;
    font-weight: 100;
    
    /* font-family: 'Noto Sans KR', sans-serif; */
}

.tab_menu li {
    display: inline-block;
    text-align: center;
    padding: 15px 20px;
    font-size: 18px;
    position: relative;
}

.tab_menu li:first-child {}

.tab_menu .tit {
    display: block;
    color: #bfcad9;
    background-color: #ffffff;
    cursor: pointer;
    font-weight: 400;
}

.tab_menu li span.titPoint {
    width: 68px;
    height: 4px;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #5ee0ef;
    transition: all 0.3s ease;
}


.tab_menu .on .tit {
    color: #1a5099;
    background-color: #ffffff;
    font-weight: 800;
    /* font-family: 'NanumSquare', sans-serif; */
}

.tab_cont::before {
    content: "";
    display: block;
    clear: both;
}

.tab_cont {
    padding: 25px 20px;
    background-color: #ffffff;
    height: 316px;
}


/* 내부 컨텐츠시작 */

#main_notice {
    width: 100%;
    height: 250px;
    max-width: calc(100% - 680px);
    margin: 0 20px 0 0;
    float: left;
    background: #ffffff;
}

.notice_list {
    width: 100%;
}

.notice_list li {
    width: 100%;
    margin-bottom: 18.5px;
}


.notice_list li:last-child {
    margin-bottom: 0;
}

.notice_list li:after {
    content: "";
    display: block;
    clear: both;
}

.notice_list li a {
    width: calc(100% - 160px);
    display: block;
    float: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 15px;
    font-weight: bold;
}

.notice_list li a:hover {
    color: #364db4;
}

.notice_list li .notice_date {
    float: right;
    width: 90px;
    font-size: 15px;
    color: #7a7a7a;
    text-align:right;
}

    /* 공지사항 태그 */
    .notice_tac{
        display: inline-block;
        float: left;
        padding: 1px 5px 1px 5px;
        background-color: #c1d8fd;
        margin-right: 3px;
        cursor: pointer;
    }
    /* 학술공지 태그 */    
    .hakTac{
        display: inline-block;
        float: left;
        padding: 1px 5px 1px 5px;
        background-color: #bcf0fb;
        margin-right: 3px;
        cursor: pointer;
    }
    /* 행사 태그 */    
    .event_tac{
        display: inline-block;
    	float: left;
    	padding: 1px 5px 1px 5px;
    	background-color: #fde2c1;
    	margin-right: 3px;
    	cursor: pointer;
    }






/**** 팝업 ****/
.popupWrap {
    float: left;
    width: 30%;
  /*  max-width: 500px;*/
   /* margin-top: 35px;*/
    height: 316px;
}
.popupWrap > h3{
	padding-bottom:8px;
	color:#383477;
	font-size:24px;
	font-weight:700;
	/* font-family:'NanumSquare', sans-serif; */
}


#main_popup {
    width: 100%;
    max-width: 500px;
    position: relative;
    padding: 0 !important;
    overflow: hidden;
    height: 316px;
}

.popupTwo {
    margin-top: 10px;
}

#main_popup .popup_slider a {
    display: block;
    width: auto;
    height: 316px;
    position: relative;
    overflow: hidden;
}

#main_popup .popup_slider a > img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 100%;
    max-width: none;
    width:100%; height:100%;
}

#main_popup .popup_slider .slick-dots {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 15px;
    text-align: center;
}

#main_popup .popup_slider .slick-dots li {
    width: 35px;
    height: 2px;
    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: 30px;
    height: 1px;
    background: #ffffff;
    opacity: 1;
    padding: 1px;
    border: 1px solid #3d4e91;
}

#main_popup .popup_slider .slick-dots li.slick-active button {
    background: #3d4e91;
}







/**** 메인2- 신착자료 ****/
#main_02 {
    width: 100%;
    height: auto;
    background: #dfe3e9;
    padding-top: 20px;
    padding-bottom: 15px;
}


#main_02 .main_box h3 {
    font-size: 24px;
    font-weight: bold;
    color: #0b2e59;
    display: inline-block;
}
#main_booklist .nav-tabs .tabNotdeco.active a{
}
/*
#main_booklist .nav-tabs .tabNotdeco.active a {
    border: 0;
    background-color: #dfe3e9;
    color: #383477;
    font-size: 24px;
}
#main_booklist ul.tabNotSpace {
    padding-bottom: 0px;
}
*/


/**** 메인3- 인기도서 분류 123 ****/
#main_03 {
    width: 100%;
    height: auto;
    background: #efeef7;
    padding-top: 30px;
    padding-bottom: 15px;
}


#main_03 .bookTwo h3 {
    font-size: 28px;
    font-weight: bold;
    color: #0b2e59;
    display: block;
    /* font-family: 'NanumSquare', sans-serif; */
    padding-bottom: 12px;
    text-align: center;
}



/**** 신착자료 + 인기도서 공통 ****/
#main_booklist,
#main_booklist2 {
    width: 93%;
    max-width: 1300px;
    height: 350px;
    margin: 0 auto;

}

/* 탭 설정 */
#main_booklist .nav-tabs,
#main_booklist2 .nav-tabs {
    border: none;
    margin: 0 auto;
    text-align: center;
    position:relative;
}

#main_booklist .nav-tabs > li ,
#main_booklist2 .nav-tabs > li {
    display: inline-block;
    padding: 0px 10px 20px 10px;
    float: none;
}
#main_booklist .nav-tabs .bookLinkBtn,
#main_booklist2 .nav-tabs .bookLinkBtn{
	position:absolute;
	right:0px; top:0px;
}
#main_booklist .nav-tabs .bookLinkBtn a,
#main_booklist2 .nav-tabs .bookLinkBtn a{
	/* font-family:'Noto Sans KR', sans-serif; */
	font-weight:100; color:#ffffff;
	font-size:20px;
	border-radius:0px; border:0px;
	padding:2px 11px; background-color:#383477;
}

#main_booklist .nav-tabs li a,
#main_booklist2 .nav-tabs li a {
    background-color: #ffffff;
    border: none;
    padding: 4px 15px;
    margin: 0;
    color: #2d2798;
    font-size: 20px;
    /* font-family: 'NanumSquare', sans-serif; */
    font-weight: normal;
    line-height: 1.2;
    border: 1px solid #2d2798;
    border-radius: 50px;
}

#main_booklist .nav-tabs li.active a,
#main_booklist2 .nav-tabs li.active a  {
    background: #2d2798;
    border: none;
    font-size: 20px;
    color: #ffffff;
    font-weight: bold;
    line-height: 1.2;
}

#main_booklist .bookListTwo{
	
}

#main_booklist div .more_btn,
#main_booklist2 div .more_btn {
    font-size: 30px;
    color: #181816;
    position: absolute;
    top: -45px;
    right: 0;
}

#main_booklist div .more_btn:hover,
#main_booklist2 div .more_btn:hover  {
    color: #ffbc75;
}

#main_booklist .tab-content,
#main_booklist2 .tab-content  {
    margin: px 0 0 0;
}

/* 신착자료 - 추천자료 Slick 위치 및 버튼 설정 */
.booklist_slider {
    width: 100%;
    max-width: 1300px;
    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: 125px;
    left: -50px;
}

.booklist_slider .next_btn {
    position: absolute;
    top: 125px;
    right: -50px;
}

.booklist_box,
.slick-slide {}

div.booklist_box {
    margin-right: 20px;
    width: 4.3%;
    padding: 20px 0px 15px 0px;
    background-color: #ffffff;
}

.booklist_box img {
    width: 135px;
    height: 180px;
    display: block;
    margin: 0 auto;
}

.bookBack {
    background-color: #ffffff;
    padding: 20px 10px;
    margin-right: 4px;
}
.booklist_box img{
	box-shadow: 6px 6px 0px 0px rgba(130, 130, 130, 1);
}
.bookBack img {
    box-shadow: 6px 6px 0px 0px rgba(172, 169, 228, 1);
}

.booklist_box span {
    display: block;
    text-align: center;
    width: 100%;
    max-width: 140px;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.booklist_box a:hover span {
    text-decoration: underline;
}

.booklist_box .booktitle {
    font-size: 16px;
    color: #292929;
    margin-top: 10px;
    font-weight: 500;
}

.booklist_box .bookwriter {
    font-size: 13px;
    color: #7b7b7b;
}


/* Slick 인디게이터 설정 */
.slick-dots {
    text-align: right;
}

.slick-dots li {}

.slick-dots li button {}

ul.slick-dots li button:before {
    height: 2px;
    content: "";
    background-color: #2d2798;
    position: absolute;
    top: 10px;
    left: 0;
    opacity: .55;
    margin-right: 5px;
}

.slick-dots li.slick-active button:before {
    opacity: .99;
    color: black;
}




/*** Main 4st section  ***/
/****  이용자별안내   ****/
#user {
    width: 100%;
    padding: 30px 0px 40px 0px;
}

#user .userWrap {
    width: 93%;
    max-width: 1300px;
    margin: 0 auto;
}

#user .userWrap h3 {
    color: #383477;
    font-size: 24px;
    /* font-family: 'NanumSquare', sans-serif; */
    font-weight: 600;
    padding-bottom: 8px;
}

/* 이용자별안내 박스 */
.userList {
    width: 100%;
    border-radius: 40px;
    text-align: center;
    /* font-family:'Noto Sans KR', sans-serif; */

}

.userList::after {
    content: "";
    display: block;
    clear: both;
}

.userList > li {
    float: left;
    width: 16.6%;
    border: 1px solid #383477;
    height: 70px;
    transition: all 0.3s ease;
    cursor: pointer;
}


.userList li:hover span {
    display: block;
}

.userList li:hover .User_box {
    height: 55%;
    padding-top: 10px;
    padding-bottom: 8px;
}

.userList li:hover .User_box span {
    font-weight: 700;
}

.userList li:hover .User_box img {
    display: none;
}


/* mouse hover */
ul.userList > li:first-child:hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:first-child {
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    border-right: none;
}

ul.userList > li:nth-child(2):hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:nth-child(2) {
    border-top-left-radius: 00px;
    border-bottom-left-radius: 0px;
    border-right: none;
}

ul.userList > li:nth-child(3):hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:nth-child(3) {
    border-top-left-radius: 00px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 0px;
    border-right: none;
}

ul.userList > li:nth-child(4):hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:nth-child(4) {
    border-top-left-radius: 00px;
    border-bottom-left-radius: 0px;
    border-right: none;
}

ul.userList > li:nth-child(5):hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:nth-child(5) {
    border-top-left-radius: 00px;
    border-bottom-left-radius: 0px;
    border-right: none;
}

ul.userList > li:last-child:hover {
    border: 7px solid #383477;
    border-right: 7px solid #383477;
}

ul.userList li:last-child {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
}

.userList li > span {
    display: none;
}


.User_box {
    width: 100%;
    display: inline-block;
    padding: 18px;
}

.User_box img {
    vertical-align: middle;
    padding-right: 3px;
}

.User_box span {
    font-size: 16px;
    display: inline-block;
    color: #383477;
    font-weight: 500;
}

.User_box::after {
    content: "";
    display: block;
    clear: both;
}






/* 배너 */
#main_banner {
    width: 100%;
    height: 70px;
    border-top: 1px solid #dddddd;
}

/* 20211025-142612-01 롤링배너 제거요청 SSE
.banner_slider {
    width: 100%;
    height: auto;
    max-width: 1300px;
    margin: 0 auto;
    padding-top: 14px;
}

.banner_slider .slick-list {
    max-width: 1300px;
}

.banner_slider .slick-slide {
    text-align: center;
   주석되야함 >  margin-left: 15px;
}
.banner_slider .slick-slide img{
    border:1px solid #c1c1c1;
}

.banner_slider button {
    border: none;
    background: transparent;
    position: absolute;
    width: 30px;
    height: 30px;
    padding: 0;
    z-index: 10;
}

.banner_slider .prev_btn {
    top: 20px;
    left: 0px;
}

.banner_slider .next_btn {
    top: 20px;
    right: 0px;
}
*/

.b_slider {
    width: 100%;
    height: auto;
    max-width: 1300px;
    margin: 0 auto;
    padding-top: 14px;
}
.b_slider div{ 
	 width:11.2%;  display:inline-block;
	margin-right:1%; text-align:center;
}
.b_slider div:last-child{ margin-right:0px;}

.b_slider  img{
    border:1px solid #c1c1c1;
}

/* 1280 PC 설정 =========================================================================== */
@media only screen and (max-width:1280px) {

    /*** 공지사항 ***/


    /*** 이달의 신착자료 ***/

    /*** 이달의 인기도서 ***/
    div.booklist_box {
        margin-right: 8px;
        width: 4.3%;
        padding: 30px 0px;
        background-color: #ffffff;
    }

    .booklist_box img {
        width: 160px;
        height: 200px;
        display: block;
        margin: 0 auto;
    }

    .booklist_box span {
        display: block;
        text-align: center;
        width: 100%;
        max-width: 170px;
        margin: 0 auto;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }


    /*** 이용자별 안내 ***/
    .User_box {
        width: 100%;
        display: inline-block;
        padding: 18px 0px;
    }

    .User_box img {
        padding-right: 0px;
    }

    .User_box span {
        font-size: 15px;
        display: inline-block;
        color: #383477;
    }


}

/* 태블릿 설정 =========================================================================== */
@media only screen and (max-width:1200px) {



    /**** 메인 레이아웃 ****/
    #main {
        width: 100%;
        height: auto;
        overflow:hidden;
    }

    #main .main_box {}

    /**** 검색창 ****/


/**** 퀵메뉴 ****/
#main_quickmenu {
    padding: 0 10px;
}

/*** 이달의 인기도서 ***/
div.booklist_box {
    margin-right: 8px;
    width: 4.3%;
    padding: 30px 0px;
    background-color: #ffffff;
}

.booklist_box img {
    width: 150px;
    height: 190px;
    display: block;
    margin: 0 auto;
}
.booklist_box span{
    width: 150px;
}

/**** 공지사항 ***/
#main_notice {
    max-width: calc(100% - 340px);
}


/**** 팝업존 ****/
#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:1024px) {


	
}
@media only screen and (max-width: 1080px) {
 

    .search_container > select.search_select{
        width: 30%;
        font-size: 24px;
        padding: 7px 10px 10px 15px;
    }
    .search_container {
        height: 50px;
    }
    .search_container > input {
        font-size: 18px;
        width: 64%;
        height: 100%;
        display: inline-block;
        padding: 7px 5px 5px 15px;
    }    
}

@media only screen and (max-width: 1050px) {
    /***  main top ***/
    .popupWrap{
        width:38%;
    }
    #main_noticelist{
        width:60%;
        margin-right: 0px;
        margin-left: 2%;
        padding-bottom: 30px;
    }
    #main_time{
        width:100%;
    }
}

@media only screen and (max-width: 988px) {

    
    
    
    /* Slick 인디게이터 설정 */
    

    /**** 이용자별 안내 ****/
    .userList > li {
        width: 33%;
    }

    ul.userList li:first-child {
        border-bottom-left-radius: 0px;
        border-bottom: 0px;
    }

    ul.userList li:nth-child(2) {
        border-bottom: 0px;
    }

    ul.userList li:nth-child(3) {
        border-top-right-radius: 30px;
        border-right: 1px solid;
        border-bottom: 0px;
    }

    ul.userList li:nth-child(4) {
        border-bottom-left-radius: 30px;
    }

    ul.userList li:last-child {
        border-top-right-radius: 0px;
        border-top-right-radius: 0px;
    }


 /**** 롤링 X 배너 ****/
 	#main_banner{  height: 115px;}
	.b_slider {
	    width: 100%; padding-top:0px;
	}
	.b_slider div{ 
		width:23%; 
		margin-right:1%; text-align:center;
		margin-top:8px;
	}
	.b_slider div:nth-child(4){ margin-right:0px; }

}


/* 모바일 설정 =========================================================================== */

@media only screen and (max-width: 768px) {

    /**** 검색창 ****/
    #main_search {
        height: 250px;
        overflow: hidden;
    }

    .search_content .nav-tabs{
    	width:100%;
    }
    .search_container > select.search_select{
        width: 35%;
        font-size: 15px;
        padding: 7px 6px 7px 15px;
    }
    .search_container {
        height: 50px;
    }
    .search_container input {
        font-size: 14px;
        width: 88%;
        height: 100%;
        display: inline-block;
        padding: 7px 7px 7px 15px;
    }
	.search_container button{
		width:12%;
	}
    .search_container input::placeholder {
        font-size: 14px;
    }

    .search_container input:-ms-input-placeholder {
        font-size: 14px;
    }

    .search_container input::-ms-input-placeholder {
        font-size: 14px;
    }

    .search_container .btn_search {
        background: url(../../images/ko/page_main/main_search_btn.png) no-repeat;
        background-size: 28px 28px;
        background-position: 50% 40%;
        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: 210px;
    }

    #main_quickmenu .quickmenu_list {}

    #main_quickmenu .quickmenu_list li {
        float: left;
        width: 25%;
        height: 100px;
    }

    #main_quickmenu .quickmenu_list li:nth-child(4):after {
        display: none;
    }

    #main_quickmenu .quickmenu_list li a {}
   
    article#main_quickmenu .quickmenu_list{
        width:100%;
    }     
    article#main_quickmenu .quickmenu_list li a > span {
        font-size: 14px;
    }
    

    /**** 개관시간 ****/
    #main_time{
        width:100%;
        float: none;
        height: 350px;
        margin-bottom:  30px;
    }
    
    
    /**** 도서 리스트 ****/
    #main_booklist,
    #main_booklist2 {
        width: 93%;
        margin: 0 auto;
        height: auto;
    }
    #main_02,#main_03 {
        padding-top: 30px;
        padding-bottom: 40px;
    }
    #main_booklist .nav-tabs li,
    #main_booklist2 .nav-tabs li {
        height: 25px;
        margin: 0 10px 0 0;
    }

    #main_booklist .nav-tabs li a,
    #main_booklist2 .nav-tabs li a {
        font-size: 16px;
    }

    #main_booklist .nav-tabs li.active a {}

    #main_booklist .nav-tabs li:not(:last-child) a::after,
    #main_booklist2 .nav-tabs li:not(:last-child) a::after {
        height: 18px;
        right: -6px;
    }

    div.booklist_box {
        width: 3%;
    }

    .booklist_slider .prev_btn {
        left: -20px;
    }

    .booklist_slider .next_btn {
        right: -20px;
    }


/*********** 반응형 float 맞춤 ***************/
/******  Main seaction01 ******/
    .main_wrap{
        padding-top:30px;
        padding-bottom: 30px;
    }
    .tab_cont{
        height: 260px;
    }
    /*** 공지사항 ***/
    #main_noticelist{
        width: 100%;
        float: none;
        margin-left: 0px;
        margin-top:30px;
    }
    .notice_list li{
        margin-bottom: 12px;
    }
    /* 1st Box */
    .first_text{
        float: none;
        width: 100%;
        border-right: none;
        padding-right: 0px;
        border-bottom: 1px dotted #e5e5e5;
        padding-bottom: 15px;
    }
    .first_text a{
        width: calc(100% - 50px);
    }
    .boxText{
        height: 62px;
    }
    .boxText p{
         font-size: 15px;        
    }    
    
    /* 2st Box */  
    .notice_list{
        float: none;
        width: 100%;
    }
    .notice_list li a{
        width: calc(80% - 80px);
        font-size: 15px;        
    }    
    .notice_list li .notice_date{
        font-size: 15px;
    }
    /**** 팝업 ****/
    .main_wrap article.popupWrap {
        width: 100%;
        max-height: auto;
        max-width: auto;
        height:auto;
        float: none;
        margin-top: 30px;
    }

    #main_popup {
        width: 100%;
        height: 301px;
        margin: 0px 0px 30px 0px;
        float: none; height:300px;
    }

    .popup_slider .slick-slide {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        background: transparent;
    }

    .popup_slider .slick-slide img {
        width: 100%;
        height: 100%;
    }


	 /****  인기도서    ****/
	 #main_booklist .nav-tabs,
	 #main_booklist2 .nav-tabs{
	 	margin-bottom:20px;
	 }
	#main_booklist .nav-tabs > li:last-child,
	#main_booklist2 .nav-tabs > li:last-child{
		margin:0px;
	}

	#main_booklist .nav-tabs li a,
	#main_booklist2 .nav-tabs li.active a{
		font-size:15px;
	}

    /*** Main 4st section  ***/
    /****  이용자별안내   ****/
    #user{
        padding:30px 0px 40px 0px;
    }
    .userList li {
        width: 50%;
    }

    ul.userList li:first-child {
        border-bottom-left-radius: 0px;
        border-bottom: 0px;

    }

    ul.userList li:nth-child(2) {
        border-top-right-radius: 30px;
        border-right: 1px solid #383477;
        border-bottom: 0px;        
    }

    ul.userList li:nth-child(3) {
        border-top-right-radius: 00px;
        border-right: 0px;
        border-bottom: 0px;        
    }

    ul.userList li:nth-child(4) {
        border-bottom-left-radius: 0px;
        border-right: 1px solid #383477;
        border-bottom: 0px;
    }

    ul.userList li:nth-child(5) {
        border-bottom-left-radius: 30px;
    }

    ul.userList li:last-child {
        border-top-right-radius: 0px;
    }



    /**** 배너 

    .banner_slider {
        padding: 10px 0;
    }

    .banner_slider .next_btn,
    .banner_slider .prev_btn {
        top: 17px;
    }
     ****/
     
     
     
     /**** 롤링X  배너    ****/
     #main_banner{
     	height:110px; padding:0px 10px;
     }
    
}


/* 작은 모바일 설정 =========================================================================== */
@media only screen and (max-width: 440px) {

    #main_booklist .nav-tabs {}

    #main_booklist div .more_btn,
    #main_booklist2 div .more_btn {
        top: -70px;
    }
    
    
    
    /**** 검색창 ****/
    #main_search {
        height: 200px;
        overflow: hidden;
    }

    div.search_content{
        width: 93%;
    }
    .search_container > select.search_select{
        width: 35%;
        font-size: 15px;
        line-height: 20px;
        padding: 7px 5px 5px 15px;
    }
    .search_container {
        height: 50px;
    }
    .search_container input {
        font-size: 14px;
        line-height: 15px;
       /* width: 54%;*/
        padding: 7px 5px 5px 8px;
    }

    .search_container input::placeholder {
        font-size: 14px;
    }

    .search_container input:-ms-input-placeholder {
        font-size: 14px;
    }

    .search_container input::-ms-input-placeholder {
        font-size: 14px;
    }

    .search_container .btn_search {
        background: url(../../images/ko/page_main/search_btn_mobile.png) no-repeat;
        background-size: 25px 25px;
        background-position: 50% 40%;
        width: 50px;
    } 
    
    
    
    /**** 퀵메뉴 ****/
    #main_quickmenu{
        height: 215px;
    }
    #main_quickmenu .quickmenu_list li{
        height: 95px;
    }
    #main_quickmenu .quickmenu_list li a img{
        width: 54px;
        height: auto;
    }    
    #main_quickmenu .quickmenu_list li a{
        margin-top: 10px;
    }
	#main_quickmenu .quickmenu_list li a > p{
		font-size:14px;
	}    
/******  Main seaction01 ******/
    .main_wrap{
        padding-top:10px;
        padding-bottom: 30px;
    }
    .tab_cont{
        height: 270px;
    }
    /*** 공지사항 ***/
    #main_noticelist > h3{
        font-size: 26px;
    }
    /* 1st Box */
    .first_text{
        float: none;
        width: 100%;
        border-right: none;
        padding-right: 0px;
        border-bottom: 1px dotted #e5e5e5;
        padding-bottom: 15px;
    }
    .first_text a{
        width: calc(100% - 50px);
    }
    .boxText{
        height: 62px;
    }
    .boxText p{
         font-size: 14px;        
    }    
    
    /* 2st Box */  
    .notice_list{
        float: none;
        width: 100%;
    }
    .notice_list li a{
        font-size: 14px;        
    }    
    .notice_list li .notice_date{
        font-size: 13px;
        width: 70px;
    }
    
    /*** 이달의 신착자료 ***/
    #main_booklist .nav-tabs .tabNotdeco.active a,
    #main_booklist2 .nav-tabs .tabNotdeco.active a{
        font-size: 26px;
    }
    /*** 이달의 인기도서 ***/
    #main_03 .bookTwo h3{
        font-size: 26px;
    }
    #main_booklist,
    #main_booklist2{
        height: auto;
    }
    #main_booklist .nav-tabs > li,
    #main_booklist2 .nav-tabs > li{
        padding: 0px;
    }
    
    #main_03 .bookTwo h3{
        padding-bottom: 15px;
    }
    #main_booklist .nav-tabs li.active a,
    #main_booklist2 .nav-tabs li.active a{
        font-size: 15px;
    }
    
    #main_booklist .nav-tabs li a,
    #main_booklist2 .nav-tabs li a{
        font-size: 15px;
    }
    div.booklist_box {
        margin-right: 8px;
        width: 4.3%;
        padding: 15px 0px;
        background-color: #ffffff;
    }

    .booklist_box img {
        width: 110px;
        height: 150px;
        display: block;
        margin: 0 auto;
    }


    .booklist_box span {
        display: block;
        text-align: center;
        width: 100%;
        max-width: 110px;
        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: #292929;
        margin-top: 10px;
        font-weight: 500;
    }

    .booklist_box .bookwriter {
        font-size: 12px;
        color: #7b7b7b;
    }
    .booklist_slider .prev_btn {
        top:85px;
    }

    .booklist_slider .next_btn {
        top:85px;
    }
    
    
    /*** Main 4st section  ***/
    /****  이용자별안내   ****/   
    #user .userWrap h3{
       font-size: 26px; 
    }
    .User_box img{
    }
    
    
    
     /**** 롤링X  배너    ****/
     #main_banner{
     	height:90px; padding:0px 10px;
     }

    
    
    
    /*** Main Footer***/      
    .footer_list li a{
        font-size: 12px;
    }
    .bottom_box .address{
        font-size: 12px;
    }
    .bottom_box .copyright{
        font-size: 12px;
    }
    .footerLogo img{
        width: 200px;
    }
}

@media only screen and (max-width: 420px) {

    /**** 퀵메뉴 ****/


    #main_quickmenu .quickmenu_list li:nth-child(even):after {
        display: none;
    }

    /**** 배너 
    #main_banner {
        width: 100%;
    }

    #main_banner .banner_list {
        height: 140px;
    }

    #main_banner .banner_list li {
        float: left;
        width: 25%;
        margin-top: 20px;
    }

    #main_banner .banner_list li:nth-child(5) {
        clear: both;
    }

    #main_banner .banner_list li a {
        display: block;
        margin: 5px;
    }

    #main_banner .banner_list li a img {
        width: 100%;
        height: 30px;
    }
****/

}
@media only screen and (max-width: 375px) {
     /**** 롤링X  배너    ****/
     #main_banner{
     	height:85px; padding:0px 0px 0px 12px;
     }

    	
	
}
