@charset "UTF-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Author : 사하구 보건소
/* Date : 2016-10-11 ~
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 서브 공통스타일
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */


.lightly { opacity:0.7!important;}
.red { color:#cc4634!important;}
.blue{ color:#2556D6!important;}
.navy{ color:#254294!important;}
.bold { font-weight: bold!important;}
.point { font-size: 17px!important;}
.under { text-decoration: underline!important; }
.pr { position:relative!important;}

/* Btn */
.btn_link { display: inline-block; height: 25px; padding: 5px 46px 5px 28px; margin-bottom: 1px; line-height: 25px; color: #fff!important; background: #2d6eb4 url(/health/images/sub/btn_link.png) 92% 50% no-repeat; }
.btn_link:hover { background-color: #0E4B8D; text-decoration: none; }
.btn_file { display: inline-block; height: 23px; padding: 5px 35px 5px 18px; margin-bottom: 1px; border: 1px solid #ddd; border-left: 2px solid #333C7D;  line-height: 23px; color: #333C7D!important; background: #fff url(/health/images/sub/btn_file.png) 100% 50% no-repeat; }
.btn_file:hover { background-color: #f9f9f9; text-decoration: none; }
.url_link { display: inline-block; height: 25px; padding: 5px 46px 5px 10px; margin-bottom: 1px; line-height: 25px; color: #1278DE!important; background: url(/health/images/sub/url_link.png) 90% 50% no-repeat; }
.url_link:hover { color: #2d6eb4; }
.url_link.txt { padding: 0 20px 0 0; background: url(/health/images/sub/url_link.png) 100% 50% no-repeat; margin: 0 5px; font-size: 13px }
.txt_link { display: inline-block; height: 25px; text-decoration: underline!important; margin-bottom: 1px; line-height: 25px; color: #1278DE!important; }
.txt_link:hover { color: #2d6eb4; }

.result .button_area { width: 20%; float: right; text-align: right; }
.button {display:inline-block; vertical-align:top; margin-top:5px; width: 180px; height:50px; box-sizing: border-box; border-radius:5px; background:#5485e0; font-size:17px; font-weight: 700; color:#fff; text-align: center; }
.button.bookOrder { padding-left: 40px; background: #5485e0 url(/dadaelib/images/sub/icon_bookorder.png) 20px 50% no-repeat; }
.button.deliveryOrder { padding-left: 40px; background: #4B505C url(/dadaelib/images/sub/icon_delivery.png) 20px 50% no-repeat; }

@media(max-width:640px){
	.button.bookOrder { background-position: 10px 50%; }
	.button.deliveryOrder { background-position: 10px 50%; }
}	
@media(max-width:480px){
	.button.bookOrder { background-position: 35% 50%; }
	.button.deliveryOrder { background-position: 35% 50%; }
}	
/* 서브 공통 해드 */
.dadae-header.sub .dadae-book-search.on::before{opacity:1;}

.dadae-header.sub .dadae-book-search{width:178px;}
.dadae-header.sub .dadae-book-search::before{opacity:0;} /* 서브 해더 bg 숨김 */

.dadae-header.sub .dadae-book-search button.toggle{width:178px; top:50%; margin-top:-30px;} /* 서브 해더 검색 버튼 스타일 변경 */

.dadae-header.sub .dadae-book-search button.toggle{height:60px; border-radius:60px; background-color:#5272cc;}
.dadae-header.sub .dadae-book-search button[type="submit"]{width:100px; top:0; margin-top:0;}

@media(max-width:1280px){
	.dadae-header.sub .dadae-book-search button{right:10px;}
}

@media(max-width:1024px){
	
	.dadae-header.sub .dadae-book-search button.toggle{width:80px; height:80px; border-radius:0; top:0; right:0; margin-top:0;}
	.dadae-header.sub .dadae-book-search button[type="submit"]{width:80px;}
}


.dadae-header.sub .dadae-book-search.on{width:100%;}



/* 서브 공통 콘테이터 */

.container[data-title="시설안내"]{background:url(/dadaelib/images/sub/bg_0102030000.jpg) no-repeat center top; background-size:1920px;}

.container[data-title="시설안내"] .dadae-library-sub-title h2,
.container[data-title="시설안내"] .dadae-library-sub-title sub{color:#fff;}



/* 서브 공통 풋터 */
#footer{margin-top:10px;}



/* 서브 공통 가이드 */

h3{margin-bottom:20px; font-size:24px; color:#000; font-weight:700; line-height:1;}
h3 mark.period{display:inline-block; vertical-align:middle; line-height:1; padding:5px 10px 5px 30px; border-radius:5px; font-size:15px; color:#5485e0; font-weight:300; background:#f5f6fa url(/dadaelib/images/ydk/icon_clock.png) no-repeat 10px center;}
h3 + ul > li {position:relative; padding-left:8px; font-size:16px; color:#333;}
h3 + ul > li::before {display:inline-block; top:15px; left:0; width:2px; height:2px; background-color:#636872;}
h3 + p{font-size:16px; line-height:1.35;}


h4{font-size:18px; color:#000;}

h4 + ul > li > ul{}
h4 + ul > li > ul li{font-size:14px; color:#333;}


h4.square{position:relative; padding-left:10px; }
h4.square::before{display:inline-block; width:4px; height:4px; top:15px; left:0; background-color:#254294;}

ul.square li {position:relative; padding-left:8px; font-size:16px; color:#333;}
ul.square li::before {display:inline-block; top:15px; left:0; width:2px; height:2px; background-color:#636872;}

ul.ul_list>li {position:relative; padding-left:15px!important; font-size:16px; color:#333; background: url(/dadaelib/images/sub/icon_list.gif) no-repeat left 9px; }
ul.ul_list ul li { background: none; }

h5{}
h6{}

@media(max-width:1024px){
	h3{font-size:21px;}
	h4{font-size:15px;}
}

/*게시판 본인인증 */
.confirm_form { }
.confirm_form h3 { font-size: 32px; color: #414286; margin-bottom: 15px; }
.confirm_form h4 { font-size: 24px; color: #414286; margin-bottom: 10px;  margin-top:0;}
.confirm_form .notice_box { padding: 4%; border: 1px solid #e2e5eb; margin-bottom: 30px; background: #f0f4fa url(/portal/images/sub/img_0103.png) 95% 50% no-repeat; }
.confirm_form .notice_box ul { padding-right: 130px; }
.confirm_form .notice_box ul li { padding: 0 0 3px 10px; background: url(/portal/images/sub/icon_arrow.gif) 0px 10px no-repeat; }

.confirm_form .confirm { border: 1px solid #D2D2DC; overflow: hidden; }
.confirm_form .confirm .confirm_box_mobile { width: 50%; padding: 4%; float: left; box-sizing: border-box; height: 420px;}
.confirm_form .confirm .confirm_box_ipin { width: 50%; padding: 4%; float: left; box-sizing: border-box; border-left: 1px solid #D2D2DC; height: 420px;}
.confirm_form .confirm .mobile {padding-top: 0; padding-left: 40px; margin-top: 20px; background-image: url(/reserve/images/common/icon_mobile.png); background-position: 26px 50%; background-repeat: no-repeat; }
.confirm_form .confirm .ipin {padding-top: 0;  padding-left: 30px; margin-top: 20px; background-image: url(/reserve/images/common/icon_ipin.png); background-position: 40px 50%; background-repeat: no-repeat; }

.button { display: inline-block; padding: 5px 10px; line-height: 18px; border-radius: 3px; border: 1px solid #CDD5DE; background: #fff; font-size: 13px; color: #4e5359; text-align: center; }
.button:hover { text-decoration: none; }

.large { width: 178px; height: 50px; line-height: 50px; font-size: 15px; background-color: #F0F4FA;  }
.large:hover { background-color: #DCE6F3; }



/* 공통 탭 */

.dadaelib-tab-box{position:relative; background:#f8faff; border:1px solid #c8cad0; border-bottom:0; text-align:center;}

.dadaelib-tab-box ul{display:inline-block; vertical-align:top; width:100%; font-size:0;}
.dadaelib-tab-box ul li{display:inline-block; vertical-align:top;}
.dadaelib-tab-box ul li a{position:relative; display:block; height:100px; line-height:100px; font-size:18px; color:#666; border-bottom:1px solid #c8cad0;}
.dadaelib-tab-box ul li a:hover{color:#333;}
.dadaelib-tab-box ul li a::before{display:inline-block; width:1px; height:20px; right:0; top:50%; margin-top:-10px; background:#dedfe1;}
.dadaelib-tab-box ul li:last-child a::before{display:none;}
.dadaelib-tab-box ul li a span{display:inline-block; line-height:1;}

.dadaelib-tab-box ul li.active a{color:#365bc6; font-weight:700;}
.dadaelib-tab-box ul li.active a::after{display:inline-block; width:50%; left:50%; bottom:-1px; height:4px; background:#5272cc; transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0); -ms-transform:translate(-50%, 0); -moz-transform:translate(-50%, 0);}


.dadaelib-tab-box.two li{width:50%;}
.dadaelib-tab-box.three li{width:33.3333333333%;}
.dadaelib-tab-box.for li{width:25%;}
.dadaelib-tab-box.five li{width:20%;}
.dadaelib-tab-box.six li{width:16.6666666666%;}

@media(max-width:1024px){
	.dadaelib-tab-box{overflow-x:auto; overflow-y:hidden; -ms-overflow-style: none;}
	.dadaelib-tab-box::-webkit-scrollbar{display:none;}
	.dadaelib-tab-box ul{white-space:nowrap;}
	.dadaelib-tab-box ul li{min-width:150px;}
	.dadaelib-tab-box ul li a{height:50px; line-height:50px; font-size:15px;}
	
	.dadaelib-tab-box ul li.active a::after{width:100%; left:0; transform:translate(0, 0); -webkit-transform:translate(0, 0); -ms-transform:translate(0, 0); -moz-transform:translate(0, 0); z-index:2;}
}






.responsive{}
.responsive p{padding:4px 8px; background:#222; font-size:13px; color:#fff;}
.responsive .scrl{overflow-x:auto;}
.responsive .scrl table{min-width:768px;}

@media(min-width:768px){
	.responsive p{display:none;}
}


table.tb{border-collapse:initial; border-top:2px solid #000000;}

table.tb thead {
	background-color:#eff2f5;
	vertical-align:middle;
	text-align:center;
}


table.tb thead tr th,
table.tb thead tr td {
	padding: 16px 8px;
	border-bottom:1px solid #dedede;
	border-right:1px solid #dedede;
	color: #000000;
	font-size:16px;
	font-weight:400;
	box-sizing:border-box;
}

table.tb thead tr th:last-child{border-right:0;}


table.tb tbody tr td {
	text-align:center;
	font-size: 16px;
	color:#666;
	border-right:1px solid #dedede;
	border-bottom:1px solid #dedede;
	padding:10px 0;
	
}

table.tb tbody tr td:last-child{border-right:0;}






table.tbw{border-collapse:initial; border-top:2px solid #000000; font-size:15px;}

table.tbw th,
table.tbw td{vertical-align:middle; height:50px; padding:0 10px; box-sizing:border-box; border-right:1px solid #dedede; border-bottom:1px solid #dedede;}

table.tbw th:last-child,
table.tbw td:last-child{border-right:0;}

table.tbw th{background:#eff2f5; font-weight:700;}
table.tbw td select{height:28px; border:1px solid #ccc;}







/* 문화강좌 비밀번호 확인 팝업 */
.dadaelib-password-pop-wrap{display:none; position:fixed; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,0.5); z-index:99; text-align:center;}
.dadaelib-password-pop-wrap .dadaelib-password-pop{position:absolute; width:300px; left:50%; top:50%; margin:-40px 0 0 -150px;  background:#fff; padding:15px; border-radius:3px; box-sizing:border-box; box-shadow:0 0 15px rgba(0,0,0,0.35);}
.dadaelib-password-pop-wrap .dadaelib-password-pop .field{display:inline-block; width:100%; vertical-align:top; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #dedede;}
.dadaelib-password-pop-wrap .dadaelib-password-pop .field label,
.dadaelib-password-pop-wrap .dadaelib-password-pop .field input{float:left; height:40px; box-sizing:border-box;}

.dadaelib-password-pop-wrap .dadaelib-password-pop .field label{width:100px; line-height:40px; font-size:15px; font-weight:700;}
.dadaelib-password-pop-wrap .dadaelib-password-pop .field input{width:calc(100% - 100px); border:1px solid #ddd; border-radius:3px; padding:0 5px; background:#fafafa;}
.dadaelib-password-pop-wrap .dadaelib-password-pop .field input::placeholder{color:#aaa; font-weight:300;}


.dadaelib-password-pop-wrap .dadaelib-password-pop button{width:80px; height:35px; margin:0 2px; background:#eee; border-radius:3px; font-size:13px;}
.dadaelib-password-pop-wrap .dadaelib-password-pop button.confirm{background:#5272cc; color:#fff; font-weight:700;}




/* 공지사항 전체 공통 게시판 스타일 */
.search_box,
.no_data,
.tableSt_list,
.confirm_form,
.h150_scroll,
.h150_scroll ~ p,
.title_poll,
.poll_list,
h4.mT_im0{max-width:1280px; margin:0 auto;}

@media(max-width:1280px){
	.search_box,
	.no_data,
	.tableSt_list{width:calc(100% - 20px); margin:0 10px;}
}

.tableSt_list{margin-top:25px; }
.search_box label{position:absolute; top:0; left:0; width:0; height:0; opacity:0; overflow:hidden;}
.search_box select{height:26px; border:1px solid #ccc;}


.board_head{border:0 !important; padding:0 !important;}

.no_data{margin-bottom:10px;}
.confirm_form{margin-bottom:10px;}


.tableSt_view,
.btnboxR{max-width:1280px; margin:0 auto;}

.tableSt_view{margin-bottom:20px;}

.list_gellery{max-width:1280px; margin:0 auto; margin-top:20px;}
.list_gellery ul{display:inline-block; width:100%; vertical-align:top;}


h4.hidden{display:none;}

.no-schedule{padding:100px 0; background:#fafafa; border:1px solid #eee; text-align:center;}
.no-schedule span{display:inline-block; width:300px; padding-top:100px; background:url(/dadaelib/images/common/logo.png) no-repeat center top; opacity:0.5; font-size:21px; line-height:1.35;}



/* 도서택 배서비스 */
.img0304000000{position:absolute; right:0; top:150px;}

@media(max-width:1024px){	
	.img0304000000{position:relative; right:auto; top:auto; display:block; margin:25px auto;}	
}


/* 비치희망 자료신청 */
.process{margin-top:50px; padding-top:50px; border-top:1px solid #dedede;}

.process strong{display:block; margin-bottom:10px; font-size:18px; color:#000; font-weight:500;}

.process ul{display:inline-block; width:100%; vertical-align:top;}
.process ul li{position:relative; float:left; width:25%; text-align:center; }
.process ul li::before{display:inline-block; width:22px; height:100%; right:-11px; top:0; background:url(/dadaelib/images/contents/icon_process_arrow.png) no-repeat center;}
.process ul li:last-child::before{display:none;}
.process ul li span{display:inline-block; width:188px; height:188px; border-radius:188px; padding-top:100px; box-sizing:border-box; border:1px solid #5272cc; background-color:#fff; background-position:center 35px; background-repeat:no-repeat; font-size:16px; color:#545454; font-weight:500; line-height:1.35;}

.process ul li:nth-child(1) span{background-image:url(/dadaelib/images/contents/icon_process01.png);}
.process ul li:nth-child(2) span{background-image:url(/dadaelib/images/contents/icon_process02.png);}
.process ul li:nth-child(3) span{background-image:url(/dadaelib/images/contents/icon_process03.png);}
.process ul li:nth-child(4) span{background-image:url(/dadaelib/images/contents/icon_process04.png);}

@media(max-width:1280px){
	.process ul li{width:50%; margin:10px 0;}
}


@media(max-width:640px){
	.process ul li{width:100%; margin:0 0 50px 0;}
	.process ul li::before{width:100%; height:50px; right:0; top:auto; bottom:-50px; background:url(/dadaelib/images/contents/icon_process_arrow_down.png) no-repeat center;}
	.process ul li span{width:100%; height:auto; border-radius:0; padding-bottom:30px;}
}



/* 통합검색 */
.dadaelib-total-search{}

.dadaelib-total-search .dadaelib-total-search-count{margin:25px 0 10px 0; font-size:17px;}
.dadaelib-total-search .dadaelib-total-search-count mark{font-weight:700; color:#5272cc;}




/* 모바일회원증 */
.mobile_member { width: 50%; min-width: 300px; padding: 60px 0px; margin: 20px auto 0; text-align: center; background: #F9F9FA; border: 1px solid #ddd; border-radius: 5px; }
.mobile_member .name { padding-top: 70px; font-size: 24px; font-weight: bold; color: #5272CC; background:url(/dadaelib/images/sub/icon_member.png) no-repeat center top; }
.mobile_member .barcode_no { font-size: 18px; color: #000; }
.mobile_member #barcard_img { margin-top: 10px; height: 55px; overflow: hidden!important; }


@media(max-width:480px){
	.mobile_member{ padding:25px 0; font-size:15px;}
	
}

