/* 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 ¼³Á¤ =============================================================================== */
    
/**** °Ë»öâ ****/
#main_search{
    width: 100%; height: 320px;
    background: #f2e9e2;
    background-size: cover;
    position: relative;
}
#main_search .search_box{
    width: 100%; height: 150px;
    max-width: 1000px;
    background: rgba(0,0,0,0.4);
    position: absolute;
    z-index: 10;
    left: 50%;
    top:90px;
    transform: translateX(-50%);
    padding: 20px 0;
}
.search_content{
    width: 100%; height: auto;
    max-width: 870px;
    margin: 0 auto;
    position: relative;
    /*padding: 10px 0 0px 0;*/
}
/* °Ë»öâ ¸ð¾ç ¼³Á¤ */
.search_container{
    width: 100%; height: 60px;
    background-color:#ffffff;
}
#main_search .search_box .search_content .nav-tabs{
    border: 0; 
    /*width: 440px;*/
    width:100%;
}
#main_search .search_box  .search_content .nav-tabs li{
	width:150px;
}
#main_search .search_box  .search_content .nav-tabs li a{
    /*width: 110px;*/
    height: 45px;
    border-radius: 0;
    background: #0d3370;
    color: #ffffff;
    font-size: 20px;
    text-align: center;
    margin: 0;
    border: 0;
    padding: 10px 0px;
    border-right:1px solid #154085;
}
#main_search .search_box  .search_content .nav-tabs li:last-child a{
	border: 0;
}
#main_search .search_box  .search_content .nav-tabs li a:hover{
    /*border: 0;*/
}
#main_search .search_box  .search_content .nav-tabs li.active a{
   /* font-weight: bold;*/
    border: 0;     padding: 10px 0px;
    color: #0d3370; background-color:#ffffff;
}
.search_container input{
    width: calc(100% - 60px); height: inherit;
    padding: 15px 15px 15px 30px;
    border: 0px solid #ffffff;
    display: block;
    float: left;
    font-size: 16px;
    color: #666666;
}
.search_container input:focus {outline:none;}
.search_container input::placeholder{       
    font-size: 16px;
    color: #666666;
}
.search_container input:-ms-input-placeholder{       
    font-size: 16px;
    color: #584e4e;
}
.search_container input::-ms-input-placeholder{       
    font-size: 16px;
    color: #584e4e;
}
.search_container .btn_search{
    width: 60px; height: inherit;
    background: #ffffff url(/web_img/search_btn.png) no-repeat;
    background-size: 36px 36px;
    background-position: 50% 50%;
    float: left;
    border: 0px solid #ffffff;
    display: block;
}


/* ¹è°æÈ­¸é ½½¶óÀ̵å */
#visual_img{
    width: 100%; height: 320px;
    position: relative;
    z-index: 1;
}
#visual_img li{
	width: 100%; height: 320px;
}
#visual_img li:first-child{
	background: url(/web_img/visual_img01.jpg) no-repeat top center;
    background-size: cover;
}
#visual_img li:nth-child(2){
	background: url(/web_img/visual_img02.jpg) no-repeat top center;
    background-size: cover;
}
#visual_img li:last-child{
	background: url(/web_img/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_journalmenu{
    width: 100%; 
    max-width: 1300px;
    padding: 10px 0;
    margin: 0 auto;
    position: relative;
}

/* ¹öÆ° °ø°£ È®º¸ */
#main_journalmenu .journal_wrap{
    position: relative;
    padding: 0 60px;
	
}

/* ¸®½ºÆ® */
#main_journalmenu .journalmenu_list{
    width: 100%;
}

/* slick »ç¿ë ½Ã float Á¦°Å Çʼö */
#main_journalmenu .journalmenu_list li{
    float: none;
    width: auto;
    position: relative;
    text-align: center;
}

/* ¸µÅ© ¿µ¿ª */
#main_journalmenu .journalmenu_list li a{
    display: block;
    padding: 15px 10px;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* hover È¿°ú */
#main_journalmenu .journalmenu_list li:hover a{
    transform: translateY(-10px);
}

/* À̹ÌÁö */
#main_journalmenu .journalmenu_list li a img{
    display: block;
    height: 62px;
    margin: 0 auto;
}

/* slick °£°Ý */
.journalmenu_list .slick-slide{
    padding: 0 10px;
}

/* hover À߸² ¹æÁö */
.journalmenu_list .slick-list{
    overflow: hidden;
}

/* ³ôÀÌ Á¤·Ä */
.journalmenu_list .slick-track{
    display: flex;
    align-items: stretch;
}

.journalmenu_list .slick-slide > div{
    height: 100%;
}

/* ¹öÆ° °øÅë */
.journalmenu_list button{
    background: none;
    border: none;
    z-index: 10;
    cursor: pointer;
}

/* ¹öÆ° À§Ä¡ (°ãÄ¡Áö ¾Ê°Ô) */
.journalmenu_list .prev_btn{
    position: absolute;
    top: 50%;
    left: -40px;
    transform: translateY(-50%);
}

.journalmenu_list .next_btn{
    position: absolute;
    top: 50%;
    right: -40px;
    transform: translateY(-50%);
}

  /**** Äü¸Þ´º ****/
#main_quickmenu{
    width: 100%; 
    max-width: 1300px;
    padding: 30px 0;
    margin: 0 auto;
}
#main_quickmenu .quickmenu_list{
    width: 100%; height: auto;
}
#main_quickmenu .quickmenu_list li{
    width: 12.5%;
    float: left;
    position: relative;
}

#main_quickmenu .quickmenu_list li a{
    display: block;
    transition: 0.3s all;
}
#main_quickmenu .quickmenu_list li:hover a{
    transform: translateY(-10px);
}
#main_quickmenu .quickmenu_list li a img{
    display: block;
    height: 63px;
    margin: 0 auto;
}
#main_quickmenu .quickmenu_list li a span{
    display: block;
    width: auto;
    text-align: center;
    margin-top: 8px;
    font-weight: bold;
}
#main_quickmenu .quickmenu_list li a:hover span{
    color: #364db4;
    text-decoration: none;
}

/**** ¸ÞÀÎ****/
/* ¸ÞÀÎ ·¹À̾ƿô */
#main{
    width: 100%; height: auto; 
    background: #ffffff;
}
#main .main_box{
    width: 100%; height: auto;
    max-width: 1300px;
    margin: 0 auto;
    padding: 15px 0 50px 0;
    display: flex;
    justify-content: space-between;
}
#main .main_box h3{
    font-size: 20px;
    font-weight: bold;
    color: #0b2e59;
    display: inline-block;
}

#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;
}

#main02{
    width: 100%; height: auto; 
    background: #ffffff;  
    position: relative;
    overflow:hidden;
}
#main02::after{
    content: "";
    display: block;
    width: 50%; height: 400px;
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #e8f0fd;
}
#main02::before{
	content: "";
    display: block;
    width:660px; height:463px;
    position: absolute;
    right: -100px; top: 0px; 
   	background: url('../web_img/book_bg.png')center no-repeat;
 	z-index:1;
}
#main02 .main_box{
    width: 100%; height: auto;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0px 0;
    overflow:hidden;
}




/* ¹è³Ê */
/**** ¹è³Ê ****/
#data_banner{
    width: 235px; margin-right: 30px;
    height: 380px;
    text-align: center;
    background-color: #eff0f2;
    position: relative;
    border-radius: 5px;
}
.data_slider{
    position: relative;    
    height: 380px;
}
.data_slider .prev_btn{
    bottom: 8px;
    left: 35px;
    position: absolute;
    border: 0px;
    z-index: 1;
}
.data_slider .next_btn{
    bottom: 8px;
    position: absolute;
    right: 35px;
    border: 0px;
    z-index: 1;
}
#data_banner .slick-dots{
 bottom:0px;
 width:100%;
 position: absolute;
 left: 0;
 padding: 10px;
}
#data_banner .slick-dots li{
    width: auto; height: auto;
    transition: 0.3s;
    margin-right: 5px;
    transform: translateY(-5px);
}
#data_banner .slick-dots li button:before{
    display: none;
}
#data_banner .slick-dots li button{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background: rgba(0,0,0,0.3); 
    opacity: 1;
    vertical-align:top;
    transition:0.3s;
}
#data_banner .slick-dots li.slick-active button{
    background: #414141; 
    width: 40px;
    height: 10px;
    border-radius: 15px;    
    transition:0.3s; margin: 0 0px 0 0px;
}
/* slick banner img */
.data_slider .dataBox{
    padding-top:30px;
}
.data_slider .dataBox a{
    display: block;
    text-align: center;
    margin-top: 10px;
}
.data_slider .dataBox a img{
    width:165px; height: 55px;
    border: 1px solid #c1c1c1;
}
/*#data_banner .data_slider div.dataMo{
    display: none;
}*/


/**** °øÁö»çÇ× ****/
#main_notice{
    width: 100%; height: 380px;
    max-width: calc(100% - 380px);
    margin: 0 30px 0 30px;
    background: #ffffff;
}
#main_notice  .notice_list{
    width: 100%;
    margin: 16.5px 0 0 0;
    border-top: 2px solid #0d3371;
}
#main_notice  .notice_list li{
    width: 100%; height: 66px; 
    border-bottom:1px solid #c1c1c1;
    padding: 25.5px;
}
#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 .textNotice{
    font-weight: 300;
    font-size: 14px;
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;    
}
#main_notice  .notice_list li a:hover{
    color: #364db4;
}
#main_notice  .notice_list li .notice_date{
    float: left;
    width: 50px;
    font-size: 15px;
    color: #353535;
    text-align: center;
    margin-right: 10.5px;
}
.notice_date .day{
    display: block;
    font-weight: 700;
    font-size: 18px; line-height: 17px;
}
/* °øÁö»çÇ× Å±׺зù*/
.tagNormal{
    display: inline-block;
    padding: 2px 0px;
    color: #ffffff;
    background-color: #584e4e;
    font-size: 12px;  margin-right: 5px;
    vertical-align: middle;
    width:55px; text-align:center;
}
.colorP{
    background-color: crimson; 
}

/**** Æ˾÷ ****/
#main_quickbtn{
    width: 100%; height: 380px;
    max-width: 380px;
    position: relative;
    padding: 0 !important;
    overflow: hidden;
}
#main_quickbtn  .notice_list{
    width: 100%;
    margin: 16.5px 0 0 0;
    border-top: 2px solid #0d3371;
}
#main_quickbtn  .notice_list li{
    width: 100%; height: 66px; 
    padding-top: 12px;
	text-align: center;
}






/****** ¿ÞÂÊ °³°ü½Ã°ü+ÀÌ¿ë¹®ÀÇ  ******/
#main_time{
    width: 360px; margin-right: 20px;
    height: 400px;
    float: left;
}
/* »ç¼­¿¡°Ô ¹°¾îº¸±â ¹öÆ° */
.askLibrarian{
    width: 100%;
    margin-bottom: 1.5rem;
}
.askLibrarian a{
    width: 100%; height: 65px;
    display: inline-block;
    padding: 15px 20px;
    background: #0d3371;
    border-radius: 5px;
    color: #ffffff;
    position:relative;
    z-index:1;
}
.askLibrarian a::after{
	content:"";
	display:inline-block;
	width:300px; height:55px;
	position:absolute;
	right:0px; top:8px;
	background: url('../../images/ko/page_main/aalBtn.png')center no-repeat;
	z-index:-4;
	}
.askLibrarian i{
    display: inline-block;
    width: 35px; height: 35px;
    border-radius: 50%;
    background-color: #ffffff;
    color:#0d3370;
    text-align: center;
    font-size: 20px;
    line-height: 34px;
    margin-right: 1.2rem
}
.askLibrarian a img{
	position:absolute;
	right:20px;
	top:17px;
	z-index:3;
}

/* °³°ü½Ã°£ + ÀÌ¿ë¹®ÀÇ ¾È³» */
.operateTime, .inquiry{
    width: 100%; height: 125px;
    padding: 20px 30px;
    position: relative;
    z-index: 1;
    margin-bottom: 1.5rem;
}
.operateTime::after, .inquiry::after{
    content: "";
    display: block;
    width:40px; height:125px;
    position: absolute;
    top:0px; left: 0px;
    background: url('../../images/ko/page_main/top_left_con.png')center no-repeat;
    z-index: -1;
}
.operateTime::before, .inquiry::before{
    content: "";
    display: block;
    width: 40px; height:125px;
    position: absolute;
    top:0px; right: 0px;
    background: url('../../images/ko/page_main/top_right_con.png')center no-repeat;
    z-index: -1;   
}
.operateTime h3, .inquiry h3{
    font-size:25px; font-weight: bold;
    color: #0d3370; padding-bottom: 8px;
}
.labelTag{
    display: inline-block;
    color:#ffffff; padding: 0px 8px;
    background-color: #787878;
    font-size: 12px; margin-right: 8px;
    width:55px; text-align:center;
}
.holiDay{
	display: inline-block;
    color:#ffffff; padding: 0px 8px;
    background-color: #961212;
    font-size: 12px; margin-right: 8px;
    width:55px; text-align:center;
}

/**** ½ÅÂøÀÚ·á - ÃßõÀÚ·á ****/
#main_booklist{
    width: calc(100% - 380px); height: 400px;
    background: transparent;
    margin: 0 0 0px 0;
    padding: 30px;
    float: left; position: relative;
    z-index: 1;
}
#main_booklist::after{
    content: "";
    display: block;
    position: absolute;
    left: 0px; top: 0px;
    width: 30%;height: 400px;
    background-color: #e8f0fd;
    border-top-left-radius: 25px;
    z-index: -2;
}

/* ÅÇ ¼³Á¤ */
#main_booklist .nav-tabs{
    border: none;
    padding: 0 0 0 16px;
}
#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;
}
#main_booklist .nav-tabs li.active a{
    background: none;
    border: none;
    font-size: 25px;
    color: #0b2e59;
    font-weight: bold;
}
#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: -65px; right: 0;
}
#main_booklist div .more_btn:hover{
    color: #ffbc75;
}
#main_booklist .tab-content{
    margin: 30px 0 0 0;
}
/* ½ÅÂøÀÚ·á - ÃßõÀÚ·á Slick À§Ä¡ ¹× ¹öÆ° ¼³Á¤ */
.booklist_slider{
    width: 100%;
    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: 0px;
}
.booklist_slider .next_btn{
    position: absolute;
    top: 65px;
    right: 0px;
}
.booklist_box, .slick-slide{
}
.booklist_box a{
}
.booklist_box img{
    width: 130px;
    height: 170px;
    display: block;
    margin: 0 auto;
    box-shadow: 1px 5px 12px 1px rgba(0,0,0,0.4);
}
.booklist_box span{
    display: block;
    text-align: center;
    width: 100%;
    max-width: 130px;
    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;
    font-weight: 600;
    color: #000000;
    margin-top: 10px;
}
.booklist_box .bookwriter{
    font-size: 13px;
    color: #353535;
}



/* ÅÂºí¸´ ¼³Á¤ =========================================================================== */

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

    
    /**** ¸ÞÀÎ ·¹À̾ƿô ****/
    #main{
        width: 100%;
        height: auto;
    }
    #main .main_box{
        padding: 0px 20px 30px 20px;
    }
    #main02 .main_box{
        padding: 0px 20px;
    }   
    /**** °Ë»öâ ****/
    #main_search .search_box{
        width: 95%;
        padding: 20px;
    }
    
    /**** Äü¸Þ´º ****/
    #main_quickmenu{    
    }
    
    /**** µµ¼­¸®½ºÆ® ****/
    .booklist_slider .next_btn{
        right: -15px;
    }
    .booklist_slider .prev_btn{
        left: -15px;
    }
    
    /**** °øÁö»çÇ× ***/
    #main_notice{
        
    }
    

    /**** Æ˾÷Á¸ ****/
    #main_quickbtn{
        max-width: 100%;
    }
    
 
    /**** ¹è³Ê ****/




}

@media only screen and (max-width:1200px){
    /**** main01 ****/
    #main .main_box{
        flex-flow:row wrap;
    }
    #main_notice{
        order:1;
        max-width:100%;
        margin-bottom: 30px;
    }
    #main_booklist::after{
    	width:25%;
    }
      /**** Æ˾÷Á¸ ****/
    #main_quickbtn{
        order: 3;
        max-width: 100%;
    }
    
    #data_banner{
        order: 2;
        margin-left: 0px;
        margin-right: 0px;
    }

}
@media only screen and (max-width:1150px){
		#main02::before{
		    top:inherit;
    		bottom:-80px;
    		right:-200px;
			background: url('../web_img/book_bg_mo.png')center no-repeat;
		}
	}	
/* ¸ð¹ÙÀÏ ¼³Á¤ =========================================================================== */

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

    /**** °Ë»öâ ****/
    #main_search{
        height: 260px;
    }
    .search_content{
        padding: 0px;
    }
    #main_search .search_box{
        top: 65px; height: auto;
    }
    .search_container{
        height: 50px;
    }
    .search_container .search_title{
        width: 120px;
        font-size: 16px;
    }
    #main_search .search_box .search_content .nav-tabs li{
    	width:25%;
    }
	#main_search .search_box .search_content .nav-tabs li a{
		font-size:15px;
	}
    
    .search_container .search_title .eng{
        font-size: 13px;
        letter-spacing: 0.35em;
    }
    .search_container input{
        font-size: 16px;
    }
    .search_container input::placeholder{       
        font-size: 16px;
    }
    .search_container input:-ms-input-placeholder{       
        font-size: 16px;
    }
    .search_container input::-ms-input-placeholder{       
        font-size: 16px;
    }
   /* .search_container .btn_search{
        background-size: 36px 36px;
        background-position: 50% 50%;
   }*/
    /* ¸ÞÀÎ ½½¶óÀÌ´õ */
    #visual_img{
        height: 260px;
    }
    #visual_img li{
        height: 260px;
    }

    /**** ¸ÞÀÎ ·¹À̾ƿô ****/
    #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: 270px;
    }
    #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_booklist{
        width: 100%;
        margin: 0;
        padding:30px 0px 0px 0px;
    }
    #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;
    }
    #main02::before{
    	top:inherit;
    	bottom:-80px;
    	right:-200px;
    }
    .booklist_box img{
    	width:145px; height:185px;
    }
    
    /**** °øÁö»çÇ× ****/
    #main_notice{
        max-width: inherit;
        margin-top: 10px;
    }
    /**** Æ˾÷ ****/
    #main_quickbtn{
        width: 100%;
        height: auto;
        margin: 0 0 0px 0;
        float: none;
    }

    /**** ¹è³Ê ****/
    
    #data_banner{
        width: 100%;
        height:120px;
        margin-bottom: 30px;
    }
    .data_slider{
        padding: 10px 0;
        height:120px;
    }
    .data_slider .dataBox{
        padding: 0px;
        display: flex;
        justify-content: space-around;
    }
    .data_slider .dataBox a{
    	margin:0px 10px;
    }

/******* main02  ********/

#main_time{
    width:100%;
    margin-right: 0px;
    height:375px;
}
#main02::after{
    top: inherit;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
	}

}


/* ÀÛÀº ¸ð¹ÙÀÏ ¼³Á¤ =========================================================================== */
@media only screen and (max-width: 440px){
     
    #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: 500px;
    }
    #main_quickmenu .quickmenu_list li{
        width: 50%;
    }
    #main_quickmenu .quickmenu_list li:nth-child(even):after{
        display: none;
    }
    /**** ¹è³Ê ****/
    #main_banner{
        width: 100%;
        height: 140px;
    }
    #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;
    }
}