﻿/* Mirtech Co. */ 
/* mir_home_sub_information css - copyright all mirtech */

/* 인코딩 설정 */
@charset "utf-8";


/* 서브 이용안내  ********************************************************************************* */

/* 소개 & 연혁 */
/* 연혁 탭 */
.tab_history li a{font-size:18px; }
.tab_history li.active{font-weight:bold;}
.tab_history > li.active > a,
.tab_history > li.active > a:focus,
.tab_history > li.active > a:hover{
    background-color:#1949ac !important;
    color: #fff;
	}
@media screen and (max-width: 767px){
	.tab_history > li{border-bottom:0 none;}
	}

/* 연혁 내용 */
.info_history .history_year{
	background-color:#f9f9f9;
	margin-top:10px;
	border-top:1px solid #e8e8e8;
	padding:10px;
	}
.info_history .history_year h4{
	margin-bottom:10px;
	text-align:center; 
	font-size:25px;
	color:#23408f;
	font-weight:bold;
	}
.info_history .history_year dl dt,
.info_history .history_year dl dd{
	padding:5px;
	}

.info_history .history_year dl dt{
	coloar:#00a6da;
	font-weight:bold;
	float:left;
	}


@media all and (min-width:768px){
	.info_history .history_year{overflow:hidden;}
	.info_history .history_year h4{
		text-align:center; 
		float:left; 
		width:25%; 
		font-size:40px;
		}
	.info_history .history_year dl{
		float:left;
		margin-left:0;
		width:60%;
		}
}

/* 연혁 */
.history_list{
	overflow:hidden;
	padding:15px 0;
	}
		.history_list{
			border-top:2px solid #1d3461; 
		}
		/*.history_list:nth-child(2n){background-color:#f5f5f5;}*/
			.history_list dt{
				float:left;
				width:100%;
				margin-bottom: 15px;
				text-align:center;
				font-size:30px;
				font-weight:bold;
				color:#1d3461;
				}
			.history_list dt span{
				color: #c3c3c3;
				}
			.history_list dd{
				margin-left:0;
				padding: 15px 0 5px 0;
				}
			.history_list dd.border{
				border-bottom: 1px dotted #98aace;
				padding: 15px 0;
				}
				.history_list dd strong{
					margin-right:10px;
					font-size: 16px;
					color: #1949ac;
					}
					.history_list dd strong span{
						display: inline-block;
						margin-left: 10px;
						color: #bdbdbd;
						}
					.history_list dd.date strong span{margin-left: 49px;}
/* 병원용 설정 */
.history_med .history_list dd:after{
	content: "";
	display: block;
	clear: both;
}
	.history_med .history_list dd strong{
		float: left;
	}
	.history_med .history_list dd p{
		float: left;
	}

/* 모바일 사이즈 =========================================================================== */
@media all and (min-width:768px){

		.history_list{
			}
			.history_list:first-child{}
			.history_list:nth-child(2n){}
				.history_list dt{
					width:100px;
					margin-bottom: 0;
					font-size:25px;
					}
				.history_list dd{
					margin-left:150px;
					}
					.history_list dd strong{
						margin-right:10px;
						}
	/* 병원용 설정 */
	.history_med .history_list dd.line1{
		height: 55px;
	}
	.history_med .history_list dd.line2{
		height: 75px;
	}

}
@media all and (max-width:768px){
	.history_list dd strong{
		width: 90px; float: left;
	}
	.history_list dd p{
		width: calc(100% - 100px); float: left;
	}
}

/* 시설 & 자료현황 */
.sub_data i{
	width:100px; height:100px;
	margin-bottom:10px;
	font-size:30px;
	text-align:center;
	line-height:100px;
	border-radius:50px;
	background-color:#273b59;
	color:#fff;
	}
	.sub_data i.default-bg{
	    background-color: #838383;
	    color: #ffffff;
		}
		

/* 조직도 & 직원소개 */
.info_staff .info_staff_con{
    background-color: #f5f5f5;
    margin-bottom: 15px;
    min-height: 200px;
    padding: 30px 20px 30px 120px;
    position: relative;
	}
.info_staff h6 {
    font-size: 20px;
    padding: 0 0 10px;
    font-weight:bold;
    color:#00a0d3;
	}
.info_staff dl{margin-top:5px;}
.info_staff dl dt,
.info_staff dl dd {line-height: 16px;}
	.info_staff dl dt {
		width: 65px;
	    text-align:left;
	    font-weight:bold;
		}
	.info_staff dl dd{
		margin-left: 65px;
		word-break:break-all;
		}
	.info_staff dl dd span{   
	    display:inline-block;
	    width:60px;
	    font-weight:bold;
		}
.info_staff p{
    position: absolute;
    top: 30px; left: 35px;
	}
.info_staff i.fa {
    background-color: #273b59;
    border-radius: 10px;
    color: #fff;
    display: inline-block;
    font-size: 40px;
    line-height: 80px;
    text-align: center;
    width: 80px;
	}
	
/* 모바일 설정 */
@media (max-width: 767px) {
	.info_staff .info_staff_con {
	    padding: 30px 20px;
		}
	.info_staff p {top: 22px;}
	.info_staff i.fa {
	    border-radius: 5px;
	    color: #fff;
	    display: inline-block;
	    font-size: 20px;
	    line-height: 40px;
	    text-align: center;
	    width: 40px;
		}
		.info_staff dl{margin-top:17px;}
		.info_staff h6 {padding: 0 0 10px 62px;}
}

		
/* 층별 & 실별안내 */
.guide_floor{
	margin-top:50px;
	}
.guide_floor_box{
    color: #404040;
    font-size: 14px;
    line-height: 21px;
    padding: 20px 0;
	}

.guide_floor_content{
    border-bottom:1px dotted #e1e1e1;
    margin-bottom: 32px;
    overflow: hidden;
    padding-bottom: 32px;
	}


.guide_floor_content .floor_ico{
    bottom: 0;
    float: right;
    font-size: 8em;
    opacity: 0.05;
    position: relative;
    top: 10px;
	}
.guide_floor_content .floor_img{float: left;}

	.guide_floor_content .floor_img img{
	    width:277px; 
	    height:188px;
		}

.guide_floor_content dl{padding: 0 0 0 304px;}

	.guide_floor_content dl dt{
	    font-size: 22px;
	    font-weight: 600;
	    padding: 10px 0;
		}

		.guide_floor_content dl dd ul{padding-left: 5px;}


.floor_list{
    margin: 5px 0 10px;
    padding-left: 11px;
	}

	.floor_list li{
	    color: #404040;
	    font-size: 13px;
	    font-weight: normal;
	    line-height: 24px;
	    margin: 0;
	    padding: 0 0 0 0px;
	    text-indent: -11px;
		}


/* 대출반납 */
.guide_borrow{
	}
	
.guide_borrow ul.list{
    padding: 20px 0 0;
    }
	.guide_borrow ul.list li{
		padding: 0 0 0 15px;
		text-indent: -15px;
		line-height: 25px;
    	}	



/* 이용자준수사항 */
.guide_user{margin-bottom: 50px}
	
	.guide_user ul{
		}

		.guide_user ul li{
			padding: 15px 0 15px 0;
			line-height:33px;
			border-bottom: 1px dotted #e1e1e1;
			}
		.guide_user .bg{
			font-family: "Malgun Gothic","맑은 고딕",sans-serif;
			background:url(../../../share/images/kor/page/guide_user_bg.png) no-repeat 7px 0;
			color: #fff;
			display: inline-block;
		    height: 35px;
		    margin: 0;
		    padding: 0 0 0 15px;
		    text-align: left;
		    vertical-align: top;
		    width: 80px;
	    	}
			

	/* 이용자 준수사항 이미지 */
	#user_img{
		background:url(../../../share/images/kor/page/library-488671_1920.jpg) bottom;
		padding: 80px 0 60px;
		}
	.pad-top80{padding-top: 80px;}	
	.pad-bot80{padding-bottom: 80px;}		
	.user_img h2.section-heading{
	    font-size: 40px;
	    margin-bottom: 15px;
	    margin-top: 0;
		}


/* 모바일 설정 */	
@media (max-width: 767px){
	.guide_floor_content{
		border-bottom:1px dotted #e1e1e1;
		margin-bottom: 25px;
	    overflow: hidden;
	    padding-bottom: 25px;
		}

	.guide_floor_content .floor_ico{
		display: none;
		}	
	.guide_floor_content .floor_img{
	    border: 1px solid #dcdcdc;
	    float: none;
	    text-align: center;
		}

	.guide_floor_content .floor_img img{
	    display: block;
	    margin-left: auto;
	    margin-right: auto;
		}

	.guide_floor_content dl{
	    padding: 10px 0 0;
		}
	.guide_floor_content dl dt{
	    font-size: 22px;
	    font-weight: 600;
	    padding: 10px 0;
		}	

	.guide_user .bg{
		font-family: "Malgun Gothic","맑은 고딕",sans-serif;
		background:url(../../../share/images/kor/page/guide_user_bg.png) no-repeat 7px 0;
		color: #fff;
		display: inline-block;
	    height: 35px;
	    margin: 0;
	    padding: 0 0 0 15px;
	    text-align: left;
	    vertical-align: top;
	    display: flex;
		}

}



/* 도서관 일정 설정 */
.calendar_content{
	margin:0 0 15px 0;
	}
.event_info{
    position: relative;
    margin: 14px 0 6px;
    overflow:hidden;
	}
	.event_info ul li{float:left; margin-right:5px;}
	.event_info ul li:first-child span{color:#fc6a6a;}
	.event_info ul li:last-child span{color:#eee;}
	
.calendar_select{
    margin: 10px 0; padding:0;
    position: relative;
    overflow:hidden;
    font-size:20px; font-weight:bold;
    text-align: center;
    color: #555555;
    vertical-align: middle; 
    background-color: #f5f5f5; 
    border: 1px solid #ccc;
	}
	.calendar_select span.date{
		margin:5px auto 0;
		display:inline-block;
		width:200px;
		font-size:20px; font-weight:bold;
		}
	.calendar_select .btn {
	    padding: 8px;
	    vertical-align: 3px;
	    border: 0 none;
	    border-radius: 0;
	    background-color:#dddddd;
		color:#555555;
		}
	.calendar_select .btn.btn_date_select{
	    width:35px;
		float:left;
		border-right: 1px solid #ccc !important;    
		}
	.calendar_select .btn.btn_date_today{
		width:70px;
		float:right;
		border-left: 1px solid #ccc !important;
		}
	.calendar_select span.date{
	    margin: 3px auto 0;
	    display: inline-block;
	    width: 200px;
	    font-size: 20px;
	    font-weight: bold;
		}
	.calendar_select .btn.btn_date_today{
	    width: 70px;
	    float: right;
	    border-left: 1px solid #ccc !important;
		}

.calendar_select2{
	font-size: 18px;
    margin: 0;
    padding: 25px 0 20px 20px;
    position: relative;
    text-align: center;
    color: #555555;
    border-bottom: 1px solid #CDCDCC;
	}

/* 그룹토의실 전체 리스트 */
#facility_container{
	position:relative;
	overflow:hidden;
	}


/* 그룹토의실 전체 리스트 - 상태 안내 */
#facility_info{
	margin-top:15px;
	height:30px;
	overflow:hidden;
	}
	#facility_info ul{
		float:right;
		overflow:hidden;
		}
		#facility_info ul li{
			float:left;
			margin-left:5px;
			}
			#facility_info ul li span{
				display: inline-block;
			    width: 20px;
			    height: 20px;
			    margin-right: 5px;
			    vertical-align:-5px;
			    border: 1px solid #ccc;
				}
				#facility_info ul li.state_reserve_y .info_icon{}
				#facility_info ul li.state_reserve_pending .info_icon{background-color:#155482;}
				#facility_info ul li.state_reserve_commit .info_icon{background-color:#b2b2b2;}
				#facility_info ul li.state_reserve_n .info_icon{background-color:#d90000;}
				

/* 그룹토의실 전체 리스트 - 전체 리스트 */				
#facility_content{
	clear:both;
	}
	#facility_box{
		float: left;
	    margin: 0;
	    width: 140px;
		}
	#facility_box2{
	    margin: 0 0 0 150px;
	    overflow-x: auto;
		}
				
.event_calendar{
	position: relative;
    width: 100%;
    margin: 0;
   }

.event_calendar tr{
	font-family:Malgun Gothic,"맑은 고딕",dotum,"돋움",sans-serif;
	font-size:13px;
	}
.event_calendar tr .saturday{color: blue;}
.event_calendar tr .sunday{color: #ff0000;}
	
.event_calendar tr th{
    text-align: center;
    vertical-align: middle;
    width: 400px;
    height: 30px;
    border: 1px solid #D0D0D0;
	background-color: #f8f8f8;
    color: #666666;
    font-weight: bold;
    font-size:14px;
	}
.event_calendar tr td{
    height: 85px;   
    text-align: left;
    vertical-align: top;
    border: 1px solid #D0D0D0;
    width: 400px;
	}
	.event_calendar tr td a{			
		display:inline-block;
		width:100%; height:100%;
		padding: 5px 0 0 5px;
		line-height:13px;
		color: #383838;
		}
	.event_calendar tr td a span{			
		display:block;
		font-size: 0.9em;
		word-break: break-all;
		}			
	
.event_calendar tr td.sundaybg{	
	background-color: #f8f8f8;
	color: red;
	 }

.event_calendar tr td.rest{
  	background-color: #fee5e5;
  	color: #ff0000;
  	font-weight: bold;
	 }
.event_calendar tr td.event{
  	background-color: #f0f7fc;
  	font-weight: bold;
	 }

/* 서브페이지 박스 *************************************************** */
.sub_box{
	background: #f3f8fb;
	padding: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 8px solid #d5dbe6;
	position: relative;
}
.sub_box:after{
	font-family: FontAwesome;
    content: "\f054";
    width: auto;
    height: auto;
    color: #cccccc;
    position: absolute;
}
.sub_box:last-child:after{
	display: none;
}
	.sub_box .content{
		width: 100%;
		text-align: center;
	}
/* 모바일 사이즈 */
@media only screen and (max-width: 768px){
	.sub_box{
		width: 80%;
	}
	.sub_box:after{
		content: "\f078";
	}
}

/* 대출/반납/연장/예약 안내 =========================================== */
.lend_wrap{
	width: 100%;
	display: flex;
	flex-direction: row;
	align-content: center;
	justify-content: center;
}
	.lend_wrap .sub_box{
		min-width: 140px;
		min-height: 80px;
		margin: 10px;
	}
	.lend_wrap .sub_box:after{
	    font-size: 14px;
	    top: 50%;
	    right: -25px;
	    margin-top: -7px;
	}
/* 타블렛 사이즈 */
@media only screen and (max-width: 1200px){
	.lend_wrap .sub_box{
		min-width: initial;
	}
}
/* 모바일 사이즈 */
@media only screen and (max-width: 768px){
	.lend_wrap{
		flex-direction: column;
		align-items: center;
		justify-content: center;
		}
			.lend_wrap .sub_box:after{
				top: auto;
				right: auto;
				top: initial;
				right: initial;
			    bottom: -27px;
			    left: 50%;
			    margin-left: -7px;
			}
}

/* 책나래 안내 =========================================== */
.booknarae_wrap{
	width: 100%;
	display: flex;
	flex-direction: row;
	align-content: center;
	justify-content: center;
}
	.booknarae_wrap .sub_box{
		min-width: 140px;
		min-height: 80px;
		margin: 10px;
		padding: 0px;
		border: 1px solid #dddddd;
		flex-direction: column;
		justify-content: space-between;
	}
		.booknarae_wrap .sub_box .step{
			width: 100%;
			text-align: center;
			background: #003777;
			color: #ffffff;
			padding: 5px;
		}
		.booknarae_wrap .sub_box .content{
			padding: 5px;
		}
		.booknarae_wrap .sub_box .subject{
			padding: 5px;
			text-align: center;
			background: #f1f0f0;
			width: 100%;
			margin-top: auto;
		}
	.booknarae_wrap .sub_box:after{
	    font-size: 14px;
	    top: 50%;
	    right: -17px;
	    margin-top: -7px;
	}
.booknarae_lend_wrap .sub_box{
	flex-direction: column;
	justify-content: flex-start;
}
/* 타블렛 사이즈 */
@media only screen and (max-width: 1200px){
	.booknarae_wrap .sub_box{
		min-width: none;
	}
}
/* 모바일 사이즈 */
@media only screen and (max-width: 768px){
	.booknarae_wrap{
		flex-direction: column;
		align-items: center;
		justify-content: center;
		}
			.booknarae_wrap .sub_box:after{
				top: auto;
				right: auto;
				top: initial;
				right: initial;
			    bottom: -17px;
			    left: 50%;
			    margin-left: -7px;
			}
}

/* 찾아오시는 길 *********************************************************************************** */
.intro_map #map{
	width:auto !important;
	}

/* 사이트맵 ************************************************************************************** */
.sitemap_box{}
	.sitemap_box .panel{
		border:0 none;
		border-radius:0;
		box-shadow:0 0 0 rgba(0,0,0,0);
		}
		.sitemap_box .panel	.panel-heading{
			text-align:center;
			font-weight:bold;
			background-color:#004b88;
			color:#fff;
			font-size:20px;
			}
		.sitemap_box .panel	.panel-body{
			padding:0;
			}
			
	.sitemap_box .site_list{
		}
	.sitemap_box .site_list:after{
		content: "";
		display: block;
		clear: both;
		}
		.site_list dt{
			padding:2px 0;
			font-weight:bold;
			font-size:13px;
			}
			.site_list dt a{
				display:inline-block;
				width:100%;
				padding: 5px 15px;
				background-color:#eee;
				font-family:'NanumSquare', 'NanumBarunGothic', sans-serif;
				}
			.site_list dt a:before{
				font-family: FontAwesome;
				content: "\f101";
				margin-right: 5px;
				}
				.site_list dd{
					padding:2px 0;
					}	
					.site_list dd a{
						display: inline-block;
						padding:5px 0 0 15px;
						font-weight:normal;
						font-size:13px;
						}
						.site_list dd a:before{content: "- ";}
/* PC 메뉴를 위한 CSS를 삭제하기 위한 설정 */
.site_list .height_half{
	height: auto !important;
}
.site_list .depth3_half{
	width: 100% !important;
	height: auto !important;
}
	.site_list .depth3_half dd{
		width: 100%;
		float: none;
	}
		.site_list .depth3_half dd ul li{
			margin: 2px 0 2px 0;
		}
		.site_list .depth3_half dd ul li:before{
			display: none !important;
		}

/* 모바일 설정 ======================================================================================= */		
@media (max-width: 767px){
	
	/* 사이트맵 */
	.sitemap_box .panel{
		height:auto;
		border-bottom:0 none;
		}
		.sitemap_box .panel .panel-heading{
		    font-size: 18px;
		    padding: 3px 15px;
		    font-family:'NanumSquare', 'NanumBarunGothic', sans-serif;
			}
			.site_list li{
				padding: 2px 0;
				font-size: 13px;
				}

}

/* 태블릿 설정 • =================================================================================== */	
@media only screen and (min-width:768px){
	
	/* 사이트맵 */
	.sitemap_box{
		}
		/*.sitemap_box .panel {
		    height: 380px;
			}*/
				
}

/* PC 설정 ========================================================================================== */	
@media only screen and (min-width:992px){
	
	/* 사이트맵 */
	.sitemap_box{
		}
		/*.sitemap_box .panel {
		    height:410px;
			}*/
}


/* 개인정보처리방침 */
.rule_link_box{
	width: 100%;
	padding: 15px;
	border: 3px solid #dddddd;
}
.rule_link_box:after{
	content:"";
	display: block;
	clear: both;
}
.rule_link_list{
	width: 100%;
}
.rule_link_list li{
	width: calc((100% - 100px) / 5);
	float: left;
	margin: 5px 10px;
}
.rule_link_list li a{
	display: inline-block;
	width: 100%; height: 100%;
	padding: 5px 10px;
	background: #f5f1ec;
}
.rule_link_list li a:hover{
	text-decoration: none;
	background: #f1e3d4;
	color: #aa5616;
}

.rule_date{
	text-align: right;
	margin: 15px 0;
}
.rule_main_title{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	padding: 10px;
	margin: 20px 0;
	word-break: keep-all;
}
.rule_title{
	padding: 10px 0;
	background: #f5f1ec;
	color: #50453d;
	text-align: center;
	font-weight: bold;
}
.rule_additional_title{
	text-align: center;
	padding: 10px 0;
	font-size: 16px;
}
.rule_box{
	padding-bottom: 20px;
}
.rule_sub_list{
	padding: 0 15px 15px 15px;
}
.rule_sub_box{
	width: 100%; padding: 15px;
	margin-bottom: 0;
	background: #f1f0f0;
	border: 1px dotted #dddddd;
}
.rule_sub_box ul.list3 li{
	margin-bottom: 10px;
}
.rule_sub_box ul.list3 li:last-child{
	margin-bottom: 0px; 
}
/* 태블릿 설정 • =================================================================================== */	
@media only screen and (max-width:1200px){

.rule_link_list li{
	width: calc((100% - 60px) / 3);
	float: left;
	margin: 5px 10px;
}

}

@media only screen and (max-width:768px){

.rule_link_list li{
	width: 100%;
	float: none;
	margin: 5px 0;
}

}