@import url("common.css");

/* @font-face {
    font-family: 'Recipekorea';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Recipekorea.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Cafe24Simplehae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Simplehae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


h4.sub_title{font-size:26px;line-height:1.5;letter-spacing:-1.5pt;color:#333;font-family:NotoKR-Bold;font-weight:100;text-align:center;}
h4.sub_title span.engt{font-family:NotoKR-Bold;font-weight:100;line-height:1.5;letter-spacing:0;text-align:center;}
h4.sub_stitle{font-size:19px;font-weight:400;line-height:26px;letter-spacing:-0.8pt;text-align:center;}
h4.sub_stitle2{font-size:19px;font-weight:400;line-height:28px;letter-spacing:-0.8pt;text-align:center;margin-top:20px;}
h4.engtitle{font-size:36px;font-weight:700;line-height:44px;color:#333;text-align:center;}
h4.engtitle span{color:#005dab;line-height:44px;}
.bold {color:#005dab;font-weight:700;}
.line{width:30px;height:1px;background:#999;margin:27px auto;}
.cts_wrap {position:relative;overflow:hidden;margin:0 auto 100px auto;max-width:1000px;}
 */



/*========================= default =========================*/

.p_title1 {margin:0 0 10px 0;font-size:24px;color:#000000;font-weight:bold;text-align:center;}
.p_title1 span {color:#ff0000;font-weight:bold;}

.Left {float:left;}
.Right {float:right;}
.red {color:red;}
.blue {color:blue;}
.textLeft {text-align:left !important;}
.textCenter {text-align:center !important;}
.textRight {text-align:right !important;}
.sub_cts {float:left;width:100%;margin-bottom:100px;font-size:1.2em;color:#000;}
.sub_cts h3 {float:left;width:100%;margin:60px 0 10px 0;font-size:1.6em;font-weight:700;color:#354860;letter-spacing:-0.05em;}
.sub_cts h4 {float:left;width:100%;margin:10px 0;font-size:1.4em;font-weight:500;color:#0C4DBD;letter-spacing:-0.05em;_text-align:center;}
.sub_cts h3:nth-child(1) {margin-top:0;}
.sub_cts table {border-top:2px solid #505050;border-collapse:collapse;}
.sub_cts table th,
.sub_cts table td {font-size:1.2em;border-bottom:1px solid #d7d7d7;}
.sub_cts table th {width:150px;padding:10px 0;text-align:center;}
.sub_cts table td {padding:8px;}
.sub_cts table thead th {background-color:#f2f5f7;}
.sub_cts table tbody th {border-right:1px solid #d7d7d7;}
.sub_cts p {display:block;margin:15px 0;line-height:1.8em;}
.sub_cts .link_open {padding-right:25px;color:#372c95;text-decoration:underline;background:url(/img/link_open.png) no-repeat right 50%;background-size:18px;}
.sub_cts input[type="radio"] {width:18px;height:18px;}
.sub_cts select {border:1px solid #d7d7d7;background:#fff;color:#000;vertical-align:middle;padding:0 10px;height:40px;}
.toy_state {display:inline-block;padding:0 8px;font-size:0.9em;color:#fff;line-height:30px;}
.toy_state0 {color:#000;border:1px solid #666;background-color:#fff;} /* 보유수량 */
.toy_state1 {color:#fff;border:1px solid #fa576c;background-color:#fa576c;} /* 대여중 */
.toy_state2 {color:#fff;border:1px solid #2c93de;background-color:#2c93de;} /* 예약중 */
.toy_state3 {color:#000;border:1px solid #666;background-color:#fff;} /* 반납완료 */
.toy_state4 {color:#fff;border:1px solid #44ab14;background-color:#44ab14;} /* 대여가능 */
.toy_state5 {color:#fff;border:1px solid #666;background-color:#666;} /* 준비중 */
.my_btn {display:inline-block;padding:0 8px 0 30px;font-size:0.9em;color:#000;letter-spacing:-0.05em;line-height:28px;border-radius:7px;box-shadow:rgba(0,0,0,0.2) 0px 2px 2px;}
.my_btn:hover {color:#fff;border:1px solid #000;background-color:#000;}
.btn_rserv {border:1px solid #c1c100;background:yellow url('/img/btn_ok.png') no-repeat 7px 50%;background-size:17px;} /* 예약하기 */
.btn_rserv2 {border:1px solid #c1c100;background:#40ff64 url('/img/btn_ok.png') no-repeat 7px 50%;background-size:17px;} /* 대기신청 */
.btn_rserv_cancel {border:1px solid #c9c9c9;background:#e9e9e9 url(/img/btn_cancel.png) no-repeat 7px 50%;background-size:17px;} /* 예약취소 */

/* 마이페이지 */
.mypage_sort {padding-bottom:50px;width:100%;text-align:center;}
.mypage_sort li {display:inline;padding-right:10px;margin-right:10px;border-right:2px solid #ddd;}
.mypage_sort li:last-child {padding-right:0;margin-right:0;border-right:0;}
.mypage_list {float:left;width:100%;}
.mypage_list table {width:100%;}
.mypage_list table th,
.mypage_list table td {text-align:center;}
.mypage_list table td img {float:left;width:70px;}
.mypage_list td.subj {text-align:left;}
.mypage_list .num,
.mypage_list .etc {width:90px;}

/* 마이페이지 > 대출 예약현황 */
.mypage_list.toy .subj {width:35%;}

/* 마이페이지 > 프로그램신청 */
.mypage_list.program .subj {width:calc(100% - 300px) !important;}
.mypage_list.program .num,
.mypage_list.program .etc {width:100px;}
.mypage_list.program .subj strong {display:block;padding:10px 0;}
.mypage_list.program .subj ul {clear:both;display:block;width:100%;margin:10px 0;}
.mypage_list.program .subj ul li {padding-left:16px;margin:2px 0;line-height:1.6em;background:url(/img/bullet_blue.png) no-repeat 0 10px;}

/* 마이페이지 > 모바일 회원증 */
.mypage .mycard {position:relative;width:90%;max-width:500px;margin:0 auto 100px auto;border-radius:10px;border:1px solid #ddd;background-color:#fff;box-shadow:rgba(0,0,0,0.1) 0px 5px 8px;}
.mycard_t {clear:both;display:block;width:100%;padding:15px 20px;color:#fff;border-top-left-radius:10px;border-top-right-radius:10px;background-color:#00a6c8;}
.mycard_t strong {display:inline;font-size:1.3em;font-weight:500;}
.mycard_t ul {float:right;}
.mycard_t ul li {display:inline;padding:2px 10px;font-size:0.8em;color:#000;border-radius:30px;background-color:#fff;}
.mycard_c {clear:both;display:block;width:100%;padding:20px 0;font-size:1.2em;font-weight:500;text-align:center;}
.mycard_c img {margin-bottom:10px;}
.mycard_b {clear:both;display:block;width:100%;padding:10px;height:70px;font-size:0.8em;line-height:26px;text-align:left;border-bottom-left-radius:10px;border-bottom-right-radius:10px;background:#ececec url(/img/logo.png) no-repeat 90% 50%;background-size:auto 50px;}
.card_sample {position:absolute;left:calc(50% - 77px);top:calc(50% - 50px);z-index:1;transform:rotate(-20deg);}

/* 도서관 소개 */
.library1 h5 {display:block;margin-bottom:20px;font-size:1.2em;font-weight:600;color:#354860;border-bottom:2px solid #354860;}
.library1 p {display:block;margin-bottom:50px;line-height:1.8em;}
.library1 p a {position:relative;z-index:10;display:inline-block;vertical-align:top;color:#000;}
.library1 p a:before {content:'';position:absolute;left:0;right:0;bottom:0;height:14px;background-color:#abeff0;z-index:-1; /* {display:inline;padding:0 2px;color:#fff;background-color:#70C8C9; */}
.library1 img {/* margin-bottom:50px; */}

/* CI소개 */
.library2 p.Left {width:230px;}
.library2 p.Left span {width:100px;padding:27px 0;margin:5px;text-align:center;font-size:13px;color:#fff;}
.library2 p.Left span:nth-child(1) {display:inline-block;background-color:#07A761;}
.library2 p.Left span:nth-child(2) {display:inline-block;background-color:#A6C86A;}
.library2 p.Left span:nth-child(3) {display:inline-block;background-color:#00A6C8;}
.library2 p.Left span:nth-child(4) {display:inline-block;background-color:#F1B248;}
.library2 p.Right {width:calc(100% - 260px);}

/* 시설안내 */
.library3 p {float:left;width:25%;text-align:center;}
.library3 p img {width:90%;margin-bottom:5px;cursor:pointer;}

/* 찾아오시는 길 */
.library4 {float:left;width:100%;}
.library4 p {margin-bottom:15px;line-height:32px;}
.root_daum_roughmap {width:100% !important;}
.root_daum_roughmap .wrap_map {height:500px !important;}

/* 대여안내 */
.lib_info li table {margin:10px 0;}
.lib_info table th,
.lib_info table td {text-align:center;}
.lib_info ul {clear:both;display:block;width:100%;margin:15px 0;}
.lib_info ul li {padding-left:16px;margin:6px 0;line-height:1.6em;background:url(/img/bullet_blue.png) no-repeat 0 10px;}
.lib_info ol {clear:both;display:block;width:100%;padding:0 0 0 25px;margin:15px 0;list-style:decimal;}
.lib_info ol li {margin:6px 0;line-height:1.6em;list-style:decimal;}
.lib_info ol li li {list-style:none;}
.lib_info .membership {display:inline-table;float:left;width:calc(50% - 10px);padding:20px 10px;margin:0 5px;text-align:center;border:1px solid #D2E2F2;border-radius:15px;}
.lib_info .membership dt {font-size:1.3em;font-weight:600;color:#0C4DBD;line-height:2.6em;}
.lib_info .joinUs {clear:both;display:block;float:left;width:100%;margin:10px 0;}
.lib_info .joinUs li {display:inline-block;float:left;width:calc(20% - 10px);padding:20px 10px;margin:5px;font-size:1.0em;font-weight:500;color:#0C4DBD;text-align:center;border:1px solid #D2E2F2;border-radius:15px;background:none;}

/* 세척/소독과정 */
.lib_info .cleaning {clear:both;display:block;float:left;width:100%;margin:10px 0;}
.lib_info .cleaning li {display:inline-block;float:left;width:calc(25% - 40px);padding:0;margin:0 20px;font-size:1.0em;/* font-weight:500;color:#0C4DBD; */background:none;}
.lib_info .cleaning li img {margin-bottom:20px;border-radius:15px;}

/* 장난감 검색/예약 > 리스트 */
.item_toy {float:left;width:100%;}
.item_info_txt {float:left;width:100%;padding:20px 0;border-top:2px solid #666;}
.item_toy .searchbox {float:left;width:100%;padding:20px;margin-bottom:30px;background-color:#F0F1F5;}
.item_toy .searchbox .search_block {display:inline-table;margin-right:50px;}
.item_toy .searchbox .search_block label {padding-left:16px;margin-right:10px;background:url(/img/bullet_blue.png) no-repeat 0 50%;}
.item_toy .searchbox .search_block select {background-color:#fff;}
.item_toy .searchbox .search_block select,
.item_toy .searchbox .search_block input {font-size:0.85em;}
.item_toy .searchbox .search_block .btn_submit {width:80px;height:38px;margin-left:3px;}
.item_sort {float:right;}
.item_sort a {display:inline-block;padding:2px 6px;font-size:0.8em;border-radius:7px;border:1px solid #999;}
.item_list {float:left;width:100%;}
.item_list .item_box {float:left;position:relative;width:calc(50% - 10px);margin:10px 0;border:1px solid #b8b8b8;}
.item_list .item_box:hover {border:1px solid #000;}
.item_list .item_box:nth-child(odd) {margin-right:20px;}
.item_list .item_box a {float:left;width:100%;}
.item_list .item_box img {float:left;width:100%;max-width:230px;max-height:230px;}
.item_list .item_box div.Right {width:calc(100% - 230px);height:230px;border-left:1px solid #e7e7e7;}
.item_box div.Right strong {display:block;padding:20px;font-weight:500;color:#000;}
.item_box div.Right p {padding-left:13px;margin:3px 0 3px 20px;font-size:0.85em;line-height:1.4em;background:url(/img/bullet_blue.png) no-repeat 0 50%;}
.item_box a ul {position:absolute;right:0;bottom:0;float:left;width:calc(100% - 231px);background-color:#ddd;}
.item_box a ul li {display:inline;float:left;width:calc(33.3% - 1px);margin-right:1px;font-size:0.9em;color:#000;line-height:2.0em;text-align:center;}
.item_box a ul li span {float:left;width:100%;font-size:0.85em;}
.item_box a ul li i {float:left;width:100%;font-style:normal;background-color:#fff;}
.item_box {float:left;position:relative;width:calc(50% - 10px);margin:10px 0;border:1px solid #b8b8b8;}


/* 장난감 검색/예약 > 뷰 */
.item_view {min-height:100px;margin-bottom:70px;}
.item_view .item_box {float:left;position:relative;width:100%;margin:10px 0;border:1px solid #b8b8b8;}
.item_view .item_box img {float:left;width:280px;}
.item_view .item_box div.Right {width:calc(100% - 280px);min-height:280px;padding-bottom:20px;border-left:1px solid #e7e7e7;}
.item_view .item_box div.Right strong {font-size:1.5em;font-weight:500;}
.item_view .item_box div.Right p {margin:7px 0 7px 20px;font-size:1.0em;}
.item_view .item_box div.Right div {margin:20px;line-height:1.6em;}
.item_view .item_box div.Right ul {display:inline-block;width:calc(100% - 20px);margin:10px 0 20px 20px;}
.item_view .item_box div.Right ul li {display:inline-block;width:130px;padding:10px 0;text-align:center;}
.item_view .item_box div.Right ul li:nth-child(1) {color:#fff;background:#888;}
.item_view .item_box div.Right ul li:nth-child(2) {color:#fff;background:#44ab14;}
.item_view .item_box div.Right ul li:nth-child(3) {color:#000;background:yellow;}
.item_view .item_box div.Right ul li h5 {margin:0;padding:0;font-size:18px;font-weight:normal;}
.item_view .item_box div.Right ul li h6 {margin:10px 0 0 0;padding:0;font-size:32px;font-weight:normal;}
.item_view table {width:100%;}
.item_view table th,
.item_view table td {text-align:center;}
.item_view table td span {padding:1px 7px;font-size:0.9em;}

/* 놀이터 이용 */
.info_box {float:left;width:calc(100% - 20px);padding:20px;margin:0 10px;border-radius:15px;background-color:#F0F1F5;}
.info_box h3 {margin-bottom:40px;color:#0C4DBD;text-align:center;}

/* 사이트맵 */
.sitemap {}
.sitemap dl {display:inline-table;width:20%;margin:0 2.3% 50px 2.3%;}
.sitemap dl dt {text-indent:50px;}
.sitemap dl dt a {font-size:1.3em;font-weight:500;color:#0C4DBD;line-height:70px;letter-spacing:-0.05em;}
.sitemap dl dd ul {padding:15px 0 15px 20px;border-radius:15px;background-color:#eff2f5;}
.sitemap dl dd ul li {padding-left:16px;margin:6px 0;line-height:1.6em;background:url(/img/bullet_blue.png) no-repeat 0 10px;}
.sitemap dl dd ul li a {color:#000;}
.sitemap dl.sitemap1 dt {background:url(/img/lib_info2_img3.jpg) no-repeat 0 50%;background-size:auto 45px;}
.sitemap dl.sitemap2 dt {background:url(/img/serivce_link3.png) no-repeat -13px 50%;background-size:auto 70px;}
.sitemap dl.sitemap3 dt {background:url(/img/serivce_link2.png) no-repeat -10px 50%;background-size:auto 70px;}
.sitemap dl.sitemap4 dt {background:url(/img/serivce_link4.png) no-repeat -13px 50%;background-size:auto 70px;}
.sitemap dl.sitemap5 dt {background:url(/img/serivce_link1.png) no-repeat -13px 50%;background-size:auto 70px;}
.sitemap dl.sitemap6 dt {background:url(/img/main_bottom.png) no-repeat 0 50%;background-size:auto 40px;}
.sitemap dl.sitemap7 dt {background:url(/img/serivce_link5.png) no-repeat -13px 50%;background-size:auto 70px;}
.sitemap dl.sitemap8 dt {background:url(/img/library1_img1.jpg) no-repeat 0px 50%;background-size:auto 40px;}

/* 자원봉사활동 */
dl.volunteer {display:inline-table;float:left;width:calc(33% - 10px);margin:0 5px;text-align:center;border:1px solid #D2E2F2;border-radius:15px;}
dl.volunteer dt {font-size:1.3em;font-weight:600;color:#fff;line-height:2.0em;border-top-left-radius:15px;border-top-right-radius:15px;background-color:#0C4DBD;}
dl.volunteer dd {padding:50px 0;font-size:1.1em;}
p.volunteer {float:left;width:100%;margin-top:50px;text-align:center;}

/* 테이블 가로 스크룰 문구는 모바일에서만 노출되도록 pc&tab 버전에서는 숨김 */
@media all and (min-width:641px){
	.mobile_view {display:none;}
}





/*========================= TAP =========================*/
@media all and (max-width:999px) {

/* 시설안내 */
.library3 p {width:33.3%;}

/* 마이페이지 */
.mypage_list .num {display:none;}
.mypage_list.toy .subj img {width:50px;}
.btn_rserv_cancel {padding:0 8px;background-image:none;}
.btn_rserv {padding:0 8px;background-image:none;}


/* 대여안내 */
.lib_info .joinUs li {width:calc(33.3% - 10px);padding:20px 10px;}

/* 세척/소독과정 */
.lib_info .cleaning li {width:calc(50% - 40px);margin-bottom:30px;}

/* 장난감 검색/예약 */
.item_toy .searchbox .search_block {display:block;margin:5px 0;}
.item_list .item_box img {max-width:120px;max-height:120px;}
.item_list .item_box ul {width:100%;}
.item_list .item_box ul li {font-size:0.75em;}
.item_list .item_box div.Right {width:calc(100% - 120px);height:230px;}

/* 사이트맵 */
.sitemap dl {width:30%;margin:0 1% 50px 1%;}


}






/*========================= MOBILE =========================*/
@media all and (max-width:640px){

.sub_cts {margin-bottom:50px;font-size:1.0em;}
.sub_cts h3 {margin:50px 0 5px 0;font-size:1.2em;}
.sub_cts table th,
.sub_cts table td {font-size:1.0em;}
.sub_cts table td {padding:8px 5px;}
.sub_cts table th {width:100px;padding:8px 0;}
.sub_cts p {line-height:1.6em;}
.my_btn {padding:0 8px;line-height:24px;}
.toy_state {padding:0 5px;line-height:24px;}
.mobile_view {float:left;width:100%;padding:5px 0;font-size:1.0em;color:#fff;text-align:center;background-color:#fc8974;}
.mobile_wrap {width:100%;overflow-x:auto;}

/* CI소개 */
.library2 p.Left,
.library2 p.Right {width:100%;}

/* 시설안내 */
.library3 p {width:50%;}

/* 찾아오시는 길 */
.root_daum_roughmap .wrap_map {height:400px !important;}

/* 세척/소독과정 */
.lib_info .cleaning li {width:calc(50% - 20px);margin:0 10px 30px 10px;}

/* 마이페이지 */
.mypage_list .date {width:100px;}
.mypage_list .subj {width:20%;}
.mypage_list .etc {width:90px !important;}
.mypage_list.toy table,
.mypage_list.play table,
.mypage_list.program table {width:700px;}
.mypage_list.toy td {width:14%;}
.mypage_list.program .date {width:150px;}

/* 마이페이지 > 프로그램신청 */
.mypage_list.program .subj {width:calc(100% - 160px) !important;}
.mypage_list.program .num,
.mypage_list.program .etc {width:80px;}
.mypage_list.program .subj ul li {;margin:0;line-height:1.6em;}

/* 마이페이지 > 모바일 회원증 */
.mypage .mycard {margin-bottom:50px;}
.mycard_t ul li {font-size:0.9em;}
.mycard_c {padding:10px 0;}
.mycard_c img {width:80%;margin-bottom:0;}
.mycard_b {height:60px;line-height:20px;background-size:auto 35px;}

/* 대여안내 */
.lib_info .joinUs li {width:calc(50% - 10px);padding:10px;}
.lib_info .cleaning li img {margin-bottom:10px;border-radius:10px;}

/* 장난감 검색/예약 */
.item_toy .searchbox .search_block .frm_input {width:150px;height:30px;}
.item_toy .searchbox .search_block .btn_submit {width:50px;height:30px;}
.item_list .item_box {width:100%;}
.item_list .item_box:nth-child(odd) {margin-right:0;}
.item_list .item_box img {max-width:120px;max-height:120px;}
.item_list .item_box ul li {font-size:1.0em !important;}
.item_list .item_box ul li span {font-size:0.9em !important;}
.item_list .item_box div.Right {width:calc(100% - 120px);height:200px;}
.item_view .item_box img {width:100%;}
.item_view table {width:650px;}
.item_view table tr th:nth-child(1),
.item_view table tr td:nth-child(1) {display:none;}
.item_view .item_box div.Right {width:100%;}
.item_view .item_box div.Right ul li {width:31%;}
.item_view .item_box div.Right ul li h5 {font-size:1.0em;}
.item_view .item_box div.Right ul li h6 {font-size:1.5em;}

.item_view .num {width:50px;}
.item_view .date {width:90px;}
.item_view .item_box img {float:none;display:block;position:relative;width:auto;max-width:280px;max-height:280px;margin:0 auto;}

/* 놀이터 이용 */
.info_box h3 {margin-bottom:20px;}

/* 사이트맵 */
.sitemap dl {width:47.5%;margin:0 1% 50px 1%;}
.sitemap dl dt {text-indent:35px;}
.sitemap dl.sitemap1 dt {background-size:auto 32px;}
.sitemap dl.sitemap2 dt {background-size:auto 60px;}
.sitemap dl.sitemap3 dt {background-size:auto 55px;}
.sitemap dl.sitemap4 dt {background-size:auto 55px;}
.sitemap dl.sitemap5 dt {background-size:auto 60px;}
.sitemap dl.sitemap6 dt {background-size:auto 30px;}
.sitemap dl.sitemap7 dt {background-size:auto 60px;}

/* 자원봉사활동 */
dl.volunteer {width:100%;margin:0 0 10px 0;}
dl.volunteer dd {padding:20px 0;}

}

/* 평생교육프로그램 */
table.tb_program {margin-bottom:20px;min-width:700px;}
table.tb_program th {background:#f2f5f7;}
table.tb_program2 {}
table.tb_program2 th {background:#f2f5f7;}
table.tb_program2 .input_s1 {max-width:130px;}
table.tb_program2 .s_tit {display:inline-block;margin-right:10px;}
table.tb_program2 .p_no {display:none;}
table.tb_program2 .not1 {font-size:16px;color:#ff0000;}

@media (max-width: 969px){
	table.tb_program {font-size:12px !important;}
    table.tb_program2 {font-size:12px !important;}
    table.tb_program2 .s_tit {margin-right:0;width:50px;}
    table.tb_program2 .input_s1 {margin-bottom:5px;}
    table.tb_program2 .p_no {display:block;}
    table.tb_program2 .not1 {font-size:12px;}
}