@charset "utf-8";

/*콘텐츠 공통영역*/
.cont_area h2{font-size:20px; font-weight:500; padding-left:35px; position:relative; margin-bottom:15px; background:url(/images/contents/tit_bgicon.png)0px 7px no-repeat;}
.cont_area h3{font-size:18px; font-weight:500;  color:#4f6c8a; padding-left:15px; margin-bottom:10px;}
.cont_list{margin-left:15px;}
.cont_list > li{font-size:15px; padding-left:18px; background:url(/images/contents/li_bg.png)2px 5px no-repeat; margin:3px 0; line-height:1.5em; word-break:keep-all;}
.cont_list > li.witha{background:url(/images/contents/li_bg.png)2px 10px no-repeat;}
.cont_list2{margin-left:0;}
.cont_list2 li{font-size:15px; padding-left:15px; position:relative; margin:3px 0; line-height:1.5em; word-break:keep-all;}
.cont_list2 li:before{display:block; content:""; position:absolute; width:5px; height:5px; background-color:#ff725b; left:0; top:8px;}
.cont_list3{margin-left:0;}
.cont_list3 li{font-size:15px; padding-left:15px; position:relative; margin:3px 0; line-height:1.5em; word-break:keep-all;}
.cont_list3 li:before{display:block; content:""; position:absolute; width:5px; height:5px; background-color:#757575; left:0; top:8px;}
.cont_list li .bold{font-weight:500;}
.num_list{margin-left:18px;}
.num_list > li{font-size:15px; margin:3px 0; line-height:1.5em; word-break:keep-all;}
.num_list > li > span.num{font-size:16px;  color:#2e5c43;}
.t_box{width:98%; margin:0 auto 15px auto; overflow:auto;}
.t_box.w100{width:100%;}
a.down_btn{display:inline-block; vertical-align:middle; padding:8px 15px 8px 37px; border:1px solid #555; background:url(/images/contents/down_icon.png) no-repeat; background-position:left 15px center; transition:all 0.3s ease; margin: 2px 0;}
a.down_btn:hover{border: 1px solid #2853a0; background-color: #2853a0; color: #fff;}
a.go_now{display:inline-block; vertical-align:middle; padding:8px 15px 8px 37px; border:1px solid #555; background:url(/images/contents/go_now_icon.png) no-repeat; background-position:left 10px center; transition:all 0.3s ease; margin: 2px 0;}
a.go_now:hover{border:1px solid #197c7d; background-color:#197c7d; color: #fff;}

.emerg_box{border:1px solid #aaa; background:#f4f8fc; padding:15px; margin-top:20px; word-break:keep-all;}

/*탭메뉴*/
#board_tab{width:100%; margin-bottom:30px;}
#board_tab ul{font-size:0;}
#board_tab ul li{display:inline-block; vertical-align:bottom; text-align:center;  margin:5px 0;}
#board_tab ul li:first-child{margin-left:0;}
#board_tab ul li a{border: 1px solid #c7c7c7; font-size:15px; display:inline-block; padding:15px; font-weight:500;}
#board_tab ul li a:hover{color:#005baa;}
#board_tab ul li a.on{border: 2px solid #0076d8; border-bottom:none;}

/*테이블 좌우 스크롤*/
.drag_please{display:none;}
.drag_please span{font-size: 15px; font-weight: 300; margin-top: 11px; display: inline-block; color: darkblue;display: inline-block; vertical-align: bottom;}
.drag_please img{display: inline-block; vertical-align: bottom;}

/*콘텐츠 테이블*/
.t_box .table_exp{float:right; padding:0 5px 8px 0;}
.cont_table{width:99%; margin:4px auto 5px auto; border-collapse:separate; box-sizing:border-box; word-break:keep-all; font-size:15px; position:relative; border-bottom:2px solid #eee;}
.cont_table:before{display:block; position:absolute; content:""; width:100%; background:linear-gradient(90deg, #058cbc, #6bbc53); height:4px; top:-4px; left:0; z-index:1;}
.cont_table thead th{padding:13px 10px; font-size:16px; font-weight:500; position:relative; border-bottom:1px solid #585858;}
.cont_table thead th.sc_th{border-top:none !important; border-radius:0 !important;}
.cont_table thead th:after{display:block; content:""; position:absolute; width:1px; height:15px; background-color:#858585; right:0; top:50%; transform:translateY(-50%);}
.cont_table thead th:last-child:after{display:none;}
.cont_table tbody tr{border-left:2px solid #d6d6d6; border-right:2px solid #d6d6d6;}
.cont_table tbody th{background-color:#f9f9f9; padding:10px; border-left:1px solid #d6d6d6; border-bottom:1px solid #d6d6d6; font-weight:500; box-sizing:border-box; line-height:1.3em; font-size:16px; color:#5d5d5d;}
.cont_table tbody td{padding:10px; border-left:1px solid #d6d6d6; border-bottom:1px solid #d6d6d6; font-weight:300; box-sizing:border-box;}
.cont_table tbody td.last{border-right:1px solid #d6d6d6;}
.cont_table tbody td .cont_list{margin-left:0;}

.span_th thead th{padding:13px 0;}
.span_th thead th:after{display:none;}
.span_th thead th span{display:block; position:relative; padding:0 10px; width:100%; box-sizing:border-box;}
.span_th thead th span:after{display:block; content:""; position:absolute; width:1px; height:15px; background-color:#858585; right:0; top:50%; transform:translateY(-50%);}
.span_th thead th:last-child span:after{display:none;}
.span_th thead th.tophead span:after{top:150%;}

.t_cont_list li{font-size:15px; padding-left:15px; background:url(/images/contents/t_cont_libg.png)2px 7px no-repeat;}

/*상단 설명*/
.top_exp{width:100%; margin:0 auto 35px auto; border:1px solid #e3e3e3; box-sizing:border-box; padding:15px 15px 20px 15px; border-bottom:3px solid #0076d8;}
.top_exp img, .top_exp div{display:inline-block; vertical-align:top;}
.top_exp div{width:calc(100% - 80px); word-break:keep-all; line-height:1.3em; text-align:left; box-sizing:border-box; padding-left:5px;}
.top_exp div p{font-size:17px;  margin-bottom:8px; color: #0058a8; font-weight:500;}
.top_exp div .top_exp_list li{margin:5px 0; padding-left:15px; position:relative; width:100%; box-sizing:border-box;}
.top_exp div .top_exp_list li:before{display:block; width:5px; height:5px; border-radius:50%; background-color:#e6663f; position:absolute; content:""; top:7px; left:4px;}
.top_exp div .top_exp_list li.witha:before{top:17px;}
.top_exp div .top_exp_list li:last-child{margin-bottom:0;}
.top_exp img{margin-right:10px;}

.c_red{color:#de1146;}
.c_blue{color:#2645ff !important;}

.img_box{width:97%; text-align:center; margin-left:auto; margin-right:auto;}
.img_box img{width:100%;}

.gray_box{background-color:#f6f6f6; width:100%; box-sizing:border-box; padding:15px !important; margin-top:5px; border-radius:5px;}


/*로그인*/
#login_field{width:100%; text-align:center; margin-top:20px; padding-bottom: 50px; margin-bottom: 20px;}
#login_field .login_box{width:100%; height:430px; display:inline-block; background-color:white; overflow:hidden; box-shadow: 0px 10px 15px 0px rgba(218, 220, 228, 0.75); border: 2px solid #e3e3e3; background-color: #f9f9f9;}
#login_field .login_box p{width: 100%; padding: 15px 10px; box-sizing: border-box; background-color: #eee; border-bottom: 1px solid #e3e3e3; font-size: 16px;}
#login_field .login_in{width:90%; text-align:center; margin: 70px 45px 15px 45px; display:inline-block; box-sizing: border-box; overflow: hidden; padding-bottom: 22px;}
#login_field .login_in > div{display: inline-block; vertical-align:middle;}
#login_field .login_in .login_inimg{width: 200px; text-align: left;}
#login_field .login_in .login_inbox{max-width: 300px;}
#login_field .login_in .id_zone{display: inline-block; width: 100%;}
#login_field .login_in .pw_zone{display: inline-block; width: 100%; margin-top:5px;}
#login_field .login_in label{display:inline-block; float:left; width:80px; text-align:left; font-size: 17px;color: #2d458f; line-height: 40px; font-weight: 500;}
#login_field .login_in input{display:inline-block; float:right; width:-webkit-calc(100% - 80px); width: -webkit-calc(100% - 80px); width: -moz-calc(100% - 80px); width: calc(100% - 80px); height:40px; border:1px #c3c5d0 solid; box-sizing:border-box; padding: 3px 10px;}
#login_field .login_in .login_btn{width: 100%; display: inline-block; background-color: #1366ab; height: 50px; color: white; font-size: 17px; margin-top:15px; font-family: 'Noto Sans KR', sans-serif;}
#login_field .login_in .login_btn:hover{background-color:#1b96a8;}
#login_field .etc_zone{max-width: 300px; display: inline-block;}
#login_field .etc_zone .btn{display:inline-block;border: 1px #d6d7d9 solid; padding: 10px 15px; background-color: #fff; font-weight: 300; font-size:15px; box-sizing: border-box;}
#login_field .etc_zone .btn:hover{background-color: #5e5e5e; color:#fff; border: 1px #5e5e5e solid;}


/*인사말*/
.intro_top{width:100%; box-sizing:border-box; padding:20px; text-align:center; background:url(/images/contents/info1_1_backimg_.jpg)no-repeat; background-position: center center; height:300px;}
.intro_top .it_in{width:50%; box-sizing:border-box; padding:10px; background-color: rgba(0,110,255,0.8); word-break:keep-all; margin:0 auto;  position:relative; top:30%;}
.intro_top p.small_t{font-size:18px;  font-weight: 700; margin-bottom:7px; color:#dcf5be;}
.intro_top p.big{font-size:25px;  margin-bottom:5px; color:#fff;}
.intro_top span{font-size:17px; color:#dcf5be;}
.intro_bottom{width:100%; box-sizing:border-box; padding:20px; background-color:#fafafa;}
.intro_bottom .txt{font-size:16px; width:100%; box-sizing:border-box; padding:20px;  word-break:keep-all; }
.intro_bottom .from{text-align:right; font-size:19px;  margin-top:20px; letter-spacing:-1px;}


/*연혁*/
.history_box {width:100%; margin:20px 0 40px; font-size:0;}
.history_box .history_img{display:inline-block; width:50%; vertical-align:top; box-sizing:border-box; padding-left:40px;}
.history_box .history_img img{width:80%;}

.history_box .history_text{display:inline-block; width:44%; font-size:15px; position:relative; box-sizing:border-box; padding-left:30px;}
.history_box .history_text .his_d .his_p{font-size:20px; font-weight:500; padding:10px 0 5px; position:relative; color:#0a8db7;}
.history_box .history_text .his_d .his_p ul{margin-top:10px;}

.history_box .history_text .his_d .his_p:before{display:block; content:""; position:absolute; top:16px; left:-37px; border-radius:50%; background-color:#0a8db7; width:10px; height:10px;
border: 4px solid #fff; }
.history_box .history_text:before{display:block; content:""; position:absolute; top:0; left:0px; background-color:#ddf5cd; width:5px; height:100%;}


/*조직도*/
.clearFix{display:block; content:""; clear:both; height:100px;}
.chart_box{width:100%; position:relative; word-break:keep-all; margin: 0 auto 70px auto;}
.chart_box:before{display:block; content:""; position:absolute; width:400px; height:1px; background-color:#ccc; left:50%; top:138px; z-index:-1;}
.chart_box:after{display:block; content:""; position:absolute; width:400px; height:1px; background-color:#ccc; right:50%; top:107px; z-index:-1;}
.chart_box .topname{text-align:center; box-sizing:border-box; padding:13px; background-color:#c3dcff; margin-bottom:5px; border-radius:10px;} 
.chart_box .topname p.division{font-size:17px;}
.chart_box .boss{width:240px; background-color:#0a7ca0; margin:0 auto 30px auto; color:#fff; position:relative;}
.chart_box .boss p.division{}
.chart_box .boss:after{display:block; content:""; position:absolute; width:1px; height:240px; background-color:#ccc; top:35px; left:50%; transform:translateX(-50%); z-index:-1;}
.chart_box .side{ /*width:240px;*/ position:relative;}
.chart_box .side .another1{float:left;margin-left:80px;}
.chart_box .side .topname{background-color:#dde9ef;} 
.chart_box .side .another2{background-color:#e2ead6; float:right; position:relative; top:30px; margin-right:80px;} 
.chart_box .each{width:100%; margin-top:254px; position:relative; text-align:center; min-height: 160px;}
.chart_box .each:before{display:block; content:""; position:absolute; width:calc(100% - 360px); height:1px; background-color:#ccc; top:-30px; left:50%; transform:translateX(-50%);}
.chart_box .each > div{display:inline-block; vertical-align:top; position:absolute;}
.chart_box .each > div .cont_list li{text-align:left; padding-left: 15px;}
.chart_box .each > div .con_m{display: inline-block; margin-left: -10px;}
.chart_box .each .edustudy{left:80px;}
.chart_box .each .ypyj{right:80px;}
.chart_box .each > div:last-child{margin-right:0;}
.chart_box .each > div:before{display:block; content:""; position:absolute; width:1px; height:30px; background-color:#ccc; top:-30px; left:50%; transform:translateX(-50%);}
.chart_box .each > div .topname{background-color:#e8e8e8; width:200px;}
.chart_box .each > div .topname p.division{font-size:16px; font-family:"Noto Sans KR";}

/*자료검색*/
.scroll_type{width:100%; overflow-y:auto; min-height: 455px; box-sizing:border-box; border:1px solid #e3e3e3;}
.new_paper{min-height:3410px;}
.best_book{min-height:1850px;}

/*연속간행물*/
.periodical .cont_table .p_season{background-color: #f8fff9; color: #17693a;}
.periodical .cont_table .p_night{background-color: #f4f2ff; color: #6557af;}
.periodical .cont_table .p_smonth{background-color: #f8ffff; color: #187171;}
.periodical .cont_table .p_month{background-color: #fcf5ff; color: #7b1aa5;}
.periodical .cont_table .p_sweek{background-color: #fcfff8; color: #263c09;}
.periodical .cont_table .p_week{background-color: #fff8f8; color: #c50e41;}
.periodical .cont_table .p_day{background-color: #fffef6; color: #674802;}
.periodical .cont_table .p_bimonthly{background-color: #ffeffc; color: #da41a2;}




/*도서관현황*/
.libn_area{width:100%;}
.libn_info{width:100%; margin:0 auto;}
.libn_info .info_box{width:100%; box-sizing:border-box; font-size:0; margin:0 auto 20px auto; padding:15px; border: 2px solid #e6e6e6; border-bottom: 2px dashed #8aa23c; border-radius:0 15px 0 0;}
.libn_info .info_box h3{padding-left:0;}
.libn_info .info_box > div{display:inline-block; vertical-align:middle; box-sizing:border-box;}
.libn_info .info_box > div.libn_txt{font-size:15px; padding:10px 10px 10px 20px; width:calc(100% - 385px);}
.libn_info .info_box > div.libn_txt p{font-size:20px;  margin-bottom:15px;}

.plan_box{width:100%; margin:0 auto 25px auto; font-size:0; border:1px solid #ddd; box-sizing:border-box;}
.plan_box > div{display:inline-block; vertical-align:top; text-align:center; width:50%; box-sizing:border-box; padding:20px 15px; border:1px solid #eee; background-color: #fdfdfd;}
.plan_box > div.full{width:100%;}
.plan_box > div h3{text-align:left; }
.plan_box > div img{width:90%;}


/*오시는 길*/

element.style {
    overflow: hidden;
    background: url(http://t1.daumcdn.net/mapjsapi/images/bg_tile.png);
}

.root_daum_roughmap {
    width: 100% !important;
}

.root_daum_roughmap .map {
    position: relative;
    width: 100%;
    height: 100%;
}

.root_daum_roughmap_landing {
    overflow: hidden;
    margin: 0;
    background: transparent;
}



/*도서관이용안내*/
.join_way{width:97%; margin:0 auto 30px auto; box-sizing:border-box; border:1px solid #ccc;}
.join_way .jw_pro{width:100%; box-sizing:border-box; padding:15px;}
.join_way .jw_pro .precess{margin:0 auto;}
.join_way .jw_go{width:100%; box-sizing:border-box; padding:15px; background-color:#edf5fb; text-align:center;}
.join_way .jw_go a{display:block; width:200px; margin:0 auto 15px auto; box-sizing:border-box; padding:0 15px; line-height:50px; height:50px; background-color:#456077; text-align:center; color:#fff;  font-size:17px;}
 
.process{width:100%; font-size:0; margin:15px auto 20px auto; text-align:center;}
.process li{width:25%; display:inline-block; vertical-align:middle; background:url(/images/contents/road_next.png) 98% 50% no-repeat; padding-left:0; line-height:normal; position:relative; margin-bottom:20px;}
.pro3 li{width:33.3%;}
.process li span.lp_num{position:absolute; display:block; width:30px; height:30px; border-radius:50%; font-size:20px; text-align:center; line-height:30px; color:#fff; background-color:#456077; top:-2px; left:0; }
.process li span.lpnum_last{background-color:#ff513b;}
.process li:last-child{background:none;}
.process li div{width:90%; background-color:#f8fae7; padding: 20px 7px; box-sizing:border-box; border-radius:20px; box-sizing:border-box; border:2px solid #afc218;}
.process li div p{font-size:18px; color:#044A86; font-family:"NotoKrM"; text-align:center; margin-bottom:3px; word-break:keep-all;}
.process li div p.c_att{color:#ff513b;}
.process li div span{display:block; font-size:15px; text-align:center; word-break:keep-all; line-height: 1.3em;}

/*도서관 지도*/
span.gulib, span.netsmall {display:inline-block; vertical-align:middle; width:15px; height:15px; border-radius:50%;}
span.gulib {background-color:#8141c9;}
span.netsmall {background-color:#fff; border:2px solid #489c32; box-sizing:border-box;}
.lib_map{width:100%; font-size:0;}
.lib_map > div{display:inline-block; vertical-align:top;}
.lib_map > div.lm_img{width:350px;}
.lib_map > div.lm_info{width:calc(100% - 350px); box-sizing:border-box; padding-left:50px;}
.lib_map > div.lm_info .lm_infobox{width:100%; box-sizing:border-box; padding:20px; border: 1px solid #ddd; border-radius:5px;}
.lib_map > div.lm_info .lm_infobox a.mapgo{display:block; width:200px; height:45px; line-height:45px; background-color:#424b67; color:#fff; text-align:center;  font-size:17px; margin:0 auto; border-radius:5px;}


/*도서관 서비스 헌장*/
.libn_info .info_box .libn_txt .libn_txt_text1{font-size:15px; word-break:keep-all;}


/*울산교육기본방향*/
.operation_box .title_zone {width: 100%; text-align: center;}
.operation_box .title_zone .title_kor {display: block; font-size: 31px; font-weight: 300; line-height: 31px;}
.operation_box .title_zone .title_eng {font-weight: 300; color:#239aa0; font-size: 16px; line-height: 16px; margin-top: 5px; display: inline-block;}
.operation_box .box_zone {width: 100%; box-sizing: border-box; border: 1px solid #ccc; text-align: center; box-sizing: border-box; padding: 20px 25px; font-size: 21px; font-weight: 200; margin-top: 13px;}
.operation_box .box_zone .box_zoneimg img{width:29px;}
.operation_box .box_zone{position:relative;}
 .operation_box .box_zone .quotation_i1{position:absolute; top:50%; left:50%; transform:translate(-230px,-20px);}
 .operation_box .box_zone .quotation_i2{position:absolute; top:50%; right:50%; transform:translate(230px,-20px);}
 .operation_box .box_zone .quotation_i1_1{position:absolute; top:50%; left:50%; transform:translate(-300px,-20px);}
 .operation_box .box_zone .quotation_i2_2{position:absolute; top:50%; right:50%; transform:translate(300px,-20px);}
.arrow_box{width:100%; text-align: center; margin:20px 0;}
.arrow_box img{width:65px;}
.direction_margin{margin-bottom:5px;}


/*도서관운영기본방향*/
.operation_box_lib .title_zone_lib {width: 100%; text-align: center;}
.operation_box_lib .title_zone_lib .title_kor_lib {display: block; font-size: 31px; font-weight: 300; line-height: 31px;}
.operation_box_lib .title_zone_lib .title_eng_lib {font-weight: 300; color:#239aa0; font-size: 16px; line-height: 16px; margin-top: 5px; display: inline-block;}
.operation_box_lib .box_zone_lib {width: 100%; box-sizing: border-box; border: 1px solid #ccc; text-align: center; box-sizing: border-box; padding: 20px 25px; font-size: 21px; font-weight: 300; margin-top: 13px;}
.operation_box_lib .box_zone_lib{position:relative;}
.arrow_box_lib{width:100%; text-align: center; margin:20px 0;}
.arrow_box_lib img{width:65px;}
.operation_box_lib .info4_box1{border: 1px solid #a0c2e7; background-color:#e8f2fc;}
.operation_box_lib .info4_box2{border: 1px solid #85a4eb; background-color:#d2e0ff;}
.operation_box_lib .info4_box3{border: 1px solid #8386f2; background-color:#e0e1fb;}

/*전자책도서관*/
.cyber2 .cyber02_box img{margin-top:23px;}
.cyber2 .cyber02_box div a{margin: 10px 15px 0px 0px;}
.cyber2 .cyber02_box div .cyber02_list li{word-break:keep-all; font-weight:300;}
.cyber2 .cyber02_ul{font-size:0px; text-align:center;}
.cyber2 .cyber02_ul li{display:inline-block; font-size:15px; margin-right:10px; border:1px solid #ccc; border-radius:8px; width:calc((100% - 20px)/3); height:110px; 
padding-top: 13px; margin-bottom:15px;}
.cyber2 .cyber02_ul li a{display:block; width:100%; height:100%;}
.cyber2 .cyber02_ul li:nth-child(1){border-bottom: 3px solid #9ddfcb;}
.cyber2 .cyber02_ul li:nth-child(2){border-bottom: 3px solid #4fb096;}
.cyber2 .cyber02_ul li:nth-child(3){border-bottom: 3px solid #269fa0;}
.cyber2 .cyber02_ul li:last-child{margin-right:0px;}

/*비치희망자료신청*/
.search04_box{padding:15px; border:3px solid #efefef; margin-top:40px;}
.search04_box p{word-break:keep-all; font-weight:600;}

/*스마트도서관*/
.smart_lib_wrap{text-align:center;}
a.smart_lib_go{font-weight: 500; font-size: 19px; padding: 18px 5px 16px 5px;
 width: 380px; border: 2px solid #dedede; background: #fff; margin: 20px auto; display: inline-block;
 text-align: center; border-radius: 30px;}

a.smart_lib_go1{margin-right:10px;}
a.smart_lib_go img{margin-right:3px;}

a.smart_lib_go1:hover{background:#e3f9ff; border:2px solid #b5d5ff;}
a.smart_lib_go2:hover{background:#e3fff3; border:2px solid #6cd2c0;}


/*시설이용안내*/
.info2_wrap > p{margin-left:15px;}
.info2_wrap .info02_margin_left_1{margin-left:20px;}
.info2_wrap .info02_margin_left_2{margin-left:15px; line-height:1.7;}
.info2_wrap .info2_reading_room h2{ display:inline-block;}
.info2_wrap .info2_reading_room p{padding-left:15px; display:inline-block;}

/*도서관 둘러보기*/
.map_area {width: 100%; box-sizing: border-box; margin-top: 20px; margin-bottom: 40px;}
.map_area .img_box {width: 100%; padding: 20px; box-sizing: border-box; background-color: #ccc; border: 1px solid #666; height:400px;}

/*도서관 서비스헌장*/
.libn_info .info_box {width: 100%; box-sizing: border-box; font-size: 0; margin: 0 auto 20px auto; padding: 15px; border: 1px dashed #ccc; 
 border-radius: 0 0px 0 0;}
 .libn_info .info_box > div.libn_txt p {font-size: 20px; margin: 50px 0;}
 .libn_info .info_box .libn_txt .libn_txt_text1 {font-size: 18px; word-break: keep-all; text-align:center;}
.libn_txt .libn_txt11 .libn_txt_text1{font-weight:bold;}
.conlist_info6{margin-left:0px;}
.libn_info .info_box > div.libn_txt {font-size: 15px; padding: 10px 10px 10px 10px; width:100%;}
.libn_txt .libn_txt11{position:relative;}
.libn_txt .libn_txt11 img{width:29px}
.libn_txt .libn_txt11 .quotation1{position:absolute; top:-30px; left:-10px;} 
.libn_txt .libn_txt11 .quotation2{position:absolute; top:-30px; right:-10px;} 
.cont_area .info5_h3_p{padding-left:35px}
.cont_area .info5_p_p{padding-left:35px; padding-bottom:20px;}
.cont_area .info5_list{padding-left:35px; padding-bottom:20px;}


/*찾아오시는길*/
.ingf8_box{width:100%;}
.ingf8_box ul{font-size:15px;}
.ingf8_box ul li .info8_sub{ font-weight:300; display:inline-block; font-size:15px; width:80%;}
.ingf8_box ul li .info8_tit{font-size:18px; font-weight:500; display:inline-block; width:20%; padding-left:20px;}
.ingf8_box ul li{font-size:0; width:100%; padding:15px 0px; border-bottom: 1px solid #ccc; }
.ingf8_box ul li:nth-child(1){border-top:3px solid #1366ab;}
.ingf8_box ul li:last-child{margin-bottom:45px;}


.for_the_disabled_wrap{margin:45px 0 20px;}
.for_the_disabled_go{display:inline-block;}
.for_the_disabled_go a{position: relative;
    display: inline-block;
    text-align: center;
    padding: 13px;
    font-size: 17px;
    color: #114fff;
    background-color: #fff;
    border-radius: 50px;
    border: 2px solid #114fff;
    margin-left: 15px;
    font-weight: 600;
    transition: 0.3s;}

.for_the_disabled_go a:hover{background:#def3ff;}

.for_the_disabled_ago{display: inline-block;}

.for_the_disabled_wrap img{vertical-align: middle; margin-bottom: 3px;}



/*사이버학습*/
.cyber05 ul > li .list_QR li{float:left; text-align: center; padding-right: 10px; padding-top: 10px;}
.cyber05 .cyber05_float{width:100%}
.cyber_clear{font-size:0px;}
.cyber05 .cyber05_float .cyber05_con{display:inline-block; width:125px; vertical-align:top; margin:15px 10px;}
.cyber05 a{margin-top:10px;}
.cyber05 .cyber05_float > ul{display:inline-block; width:calc(100% - 160px); font-size:15px;}
.cyber05 .cyber05_float > ul .list_QR {min-height:110px;}

/*도서관 주요 사업*/
*{box-sizing:border-box;}
.info06_bundle{font-size:0px; width:100%; margin-bottom:20px;}
.info06_bundle .info06_text{display:inline-block; font-size:15px; width:80%;}
.info06_bundle .info06_text h3{margin-bottom:20px;}
.info06_bundle .info06_text .cont_list{position:relative;}
.info06_bundle .info06_text .cont_list:after{position:absolute; display:block; content:""; top:-10px; left:0; width:100%; height:1px; background-color:#ccc;}
.info06_bundle .info06_img{display:inline-block; width:20%; text-align:center;}

.info06_bundle .info06_img img{width:100px;}

.info06_bundle .info_img_last{vertical-align:bottom;}

/*장애인대출*/
.project08_box .project08_img{width:100%; box-sizing: border-box; height:300px; overflow:hidden;}
.project08_box .project08_img img{width:100%;}
.project08_box .project08_main_text{font-size:20px; text-align:center; color:#067b52; padding:40px; word-break:keep-all; font-weight:500;}
.project08_box .project08_line_box{width:100%; border:1px solid #ccc; padding:20px;}
.project08_box .project08_line_box .project08_text{font-size:18px;}

/*장애인대출(책나래) - 이용안내*/
.project0_flow{font-size:0px; text-align:center; margin-top:10px;}
.project0_flow li{display:inline-block; background:#f2f2f2; width:20%; font-size:16px; margin-right:6%; word-break:keep-all; padding:5px; border-radius:10px; position:relative;}
.project0_flow li:last-child{margin-right:0%;}
.project0_flow li p{padding:5px; color: #1e4dd1; border-bottom: 1px dashed #1e4dd1; font-size:18px;}
.project0_flow li div{padding:5px;}

.project0_flow li:after { display: block; width: 23px; height: 15px; content: ""; position: absolute; z-index: -1; top: 50%;
transform: translateY(-50%); right: -40px; background: url(/images/contents/project08_road_next.png) no-repeat;
background-size: 100%;}

.project0_flow li:last-child:after {display:none;}

/*순회문고*/
.project07_box .project07_img{width:100%; box-sizing:border-box; height:230px; overflow:hidden;}
.project07_box .project07_img img{width:100%}
.project07_box .project07_main_text{font-size:20px; text-align:center; color:#067b52; padding:30px 0px 20px; word-break:keep-all; font-weight:500;}
.project07_box .project07_sub_text{font-size:17px; text-align:center;  padding-bottom:25px; word-break:keep-all;}
.project07_box .project07_line_box{width:100%; border:1px solid #ccc; padding:13px;}
.project07_box .project07_line_box .project08_text{font-size:18px;}


/*모바일앱*/
.cyber03 .cyber03_box1{font-size:0px; margin-bottom: 20px;}
.cyber03 .cyber03_box1 img{display:inline-block;}
.cyber03 .cyber03_box1 p{display:inline-block; width:calc(100% - 65px); box-sizing:border-box; vertical-align:middle; padding-left:20px; font-size:18px;}
.cyber03 .cyber03_box1 p span{font-size:25px; color:#008588; font-weight:500;}

.cyber03 .cyber03_box2{font-size:0px; width:100%; box-sizing:border-box; padding:20px 15px; border-top:1px solid #ccc;  border-bottom:1px solid #ccc;}
.cyber03 .cyber03_box2 .cyber03_box2_1{display:block; width:100%; text-align:center; margin-bottom:20px;}
.cyber03 .cyber03_box2 .cyber03_box2_1 li{width:33.3%; display:inline-block; vertical-align:middle; margin:10px 0;}
.cyber03 .cyber03_box2 .cyber03_box2_3{display:block; font-size:16px;  width:100%; box-sizing:border-box; padding:10px; background-color:#f9f9f9; text-align:center;}
.cyber03 .cyber03_box2 .cyber03_box2_3 > p{color:#008588; font-weight:500; font-size:18px; display:inline-block; vertical-align:middle; margin-right:20px;}
.cyber03 .cyber03_box2 .cyber03_box2_3 > p span{font-size:20px; color:#036163;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake{border-radius:5px; display:inline-block; vertical-align:middle; width:50%; margin:0 auto; background-color:#23a8b9; box-sizing:border-box; padding:10px;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake > p{display:inline-block; vertical-align:middle; box-sizing:border-box;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake .inputbar{width:calc(100% - 100px); background-color:#fff; height:33px; color:#000; text-align:left; padding:0 10px; line-height:33px; margin-right:3px; font-size:15px;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake .btn_fake{color:#fff; background: linear-gradient(180deg, #196877, #0c343e); font-size: 15px; width: 65px; height:35px; line-height: 35px;}
.cyber03 .cyber03_box2 li{font-size:15px;}
.cyber03 .cyber03_box2 .cyber03_box2_1 img{margin-right:10px;}
.cyber03 .cyber03_box2 .cyber03_box2_2 img{margin-right:10px;}
.cyber03 .cyber03_process {margin: 15px auto 0px auto; text-align: center;}
.cyber03 .cyber03_process li img{margin-bottom:5px;}
.process li {width: 20%;}

/*채용정보*/
.job_banner{width:100%; padding-top:5px; margin:0; position:relative;}
.job_banner:before{width:100%; display:block; content:""; position:absolute; height:5px; background: linear-gradient(90deg, #8cd8dc, #3d9cbd); top:0; left:0;}
.job_banner ul{width:100%; font-size:0; display:flex; flex-wrap: wrap;}
.job_banner ul li{display: flex; flex-wrap: wrap; vertical-align:middle; width:50%; border-bottom:1px solid #ddd; font-size:0;}
.job_banner ul li div{display:inline-block; vertical-align:middle; font-size:15px; text-align:center; padding:10px 5px; border-right:1px solid #ddd; box-sizing:border-box; position:relative;}
.job_banner ul li div:before{display:inline-block; vertical-align:middle; position:relative; width:0; height:100%; content:"";}
.job_banner ul li div.name{width:50%; background-color:#f8f8f8;}
.job_banner ul li div.ban{width:50%;}


/*수강확인*/
.certibox{width:100%; margin:0 auto; font-size:0; text-align:center;}
.certibox ul li{width:48%; box-sizing:border-box; padding:20px; display:inline-block; vertical-align:top; font-size:14px; margin:0 5px; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
.certibox ul li h4{font-size:22px; margin-bottom:15px;  font-weight:normal;}
.certibox ul li img{margin:5px auto 20px auto;}
.certibox ul li .txt{font-size:15px; font-weight:300; text-align:center; margin-bottom:15px; word-break:keep-all;}
.certibox ul li a.chkbtn{display:block; width:150px; height:45px; line-height:45px; text-align:center; margin:10px auto 23px auto; font-size:16px; color:#fff;}
.certibox ul li .st1{text-align:center;font-weight:300;}
.certibox ul li .st1 strong{color:#4f5e8a;}
.certibox ul li.check_ipin{border:3px solid #e66057;}
.certibox ul li.check_ipin a.chkbtn{background-color:#d5204f;}
.certibox ul li.check_ipin a.chkbtn:hover{background-color:#4d5582;}
.certibox ul li.check_ph{border: 3px solid #77bfd8;}
.certibox ul li.check_ph .txt{margin:0 auto 36px auto;}
.certibox ul li.check_ph a.chkbtn{background-color:#3f51b5;}
.certibox ul li.check_ph a.chkbtn:hover{background-color:#6e884b;}
.certibox ul li.check_ipin a.chkbtn, .certibox ul li.check_ph a.chkbtn{transition:0.3s ease all;}


/*회원가입*/
.join_step{width:100%; border:1px solid #ccc; box-sizing:border-box; margin-bottom:20px; padding:10px;}
.join_step ul{font-size:0;}
.join_step ul li{display:inline-block; vertical-align:middle; text-align:center; position:relative;}
.js4 ul li{width:25%;}
.js5 ul li{width:20%;}
.join_step ul li img{opacity:0.5;}
.join_step ul li.on img{opacity:1;}
.join_step ul li:before{display:block; width:37px; height:37px; position:absolute; content:""; border-radius:50%; background-color:#ddd; top:15px; left:50%; z-index:-1;}
.join_step ul li.first.on:before{background-color:#9fdcfe;}
.join_step ul li.second.on:before{background-color:#c1ec8c;}
.join_step ul li:after{display:block; width:14px; height:20px; position:absolute; content:""; background:url(/images/contents/rs_next.png) no-repeat; top:50%; transform:translateY(-50%); right:0;}
.join_step ul li:last-child:after{display:none;}
.join_step ul li span{display:block; margin-top:7px; font-size:15px; font-weight:500; word-break:keep-all; line-height: 1.3em; letter-spacing:-1px;}

#choice_type{width:100%; font-size:0;}
#choice_type > div{display:inline-block; vertical-align:top; width:49%; box-sizing:border-box; border:3px solid #e3e3e3; transition:0.3s ease all;}
#choice_type > div:hover{border:3px solid #8cc44f;}
#choice_type > div.up14{margin-right:2%;}
#choice_type > div a{display:block; width:100%; box-sizing:border-box; padding:20px 60px 20px 20px; background:url(/images/main/libnow_drgo.png)no-repeat; background-position:right 20px center; word-break:keep-all;}
#choice_type > div a span.join{ font-size:18px; letter-spacing:-1px;}
#choice_type > div a span.join span.point{ font-size:20px; color:#06736b;}

.a_box{width:100%; border:3px solid #e3e3e3; box-sizing:border-box; padding:20px;}
.a_box .scroll{width:100%; word-break:keep-all;}
.a_box .scroll p{width:100%; box-sizing:border-box; padding:10px; background-color:#f7f7f7; margin-bottom:10px;}
.a_box .scroll h3{padding-left:0;}
#join_box .use_check{width:100%; margin:10px auto 30px auto; text-align:center; padding:0 10px 10px 10px; box-sizing:border-box; border-bottom:2px dashed #988171;}
#join_box .use_check .check_txt{display: block; margin-bottom: 5px;}
#join_box .bottom_btn_field{width:100%; text-align:center;}
#join_box .bottom_btn_field button{display:inline-block; vertical-align:top; width:150px; height:45px; line-height:45px; color:#fff;  font-size:17px; border-radius:0; border:none;}
#join_box .bottom_btn_field button.cancel_btn{background-color:#ce4f4f;}
#join_box .bottom_btn_field button.write_btn{background-color:#4f5e8a;}

.service_info{width:100%; box-sizing:border-box; padding:15px; overflow-y:auto; height:300px; margin-top:15px; border:1px solid #ccc;}
.service_info h3{font-size:18px; font-weight:700;  color:#077f87; margin-bottom:10px;}
#join_box .use_check.t_in{border-bottom:none; margin-bottom:0;}

.join_succ{width:100%; box-sizing:border-box; border:1px solid #e3e3e3; background-color:#fafafa; padding:20px; text-align:center; word-break:keep-all;}
.join_succ p{ font-size:20px; letter-spacing:-1px; margin-bottom:10px;}
.join_succ p .point{ font-size:22px; color:#175954}
.join_succ > span{ letter-spacing:-1px;}

/*자료대출 회원정보 수정*/
.modi_login_area{width:95%; padding:10px 10px 30px 10px; box-sizing:border-box; background-color:#fbfbfb; border: 1px solid #ccc; margin:20px auto 0 auto;}
.modi_login_area .write_here{width:275px; margin:0 auto; background:url(/images/board/board_password_icon.png)  no-repeat; background-position: left center; padding: 10px 0 10px 115px; background-size: 100px;}
.modi_login_area .write_here li{margin:10px 0; padding-left:15px; position:relative;}
.modi_login_area .write_here li:before{display:block; width:5px; height:5px; border-radius:50%; background-color:#8fc444; position:absolute; content:""; top:8px; left:4px;}
.modi_login_area .write_here li:first-child:before{top:9px;}
.modi_login_area input{color: #000; border: 1px solid #cccaca; background: #fff; vertical-align: middle; padding:1px 5px; font-size:15px; font-family:"Noto Sans Kr"; font-weight:300;}
.modi_login_area select{background-color: #fff;}
.modi_login_area #btn_here{text-align:center;}
.modi_login_area #btn_here button{width:180px; height:40px; line-height:40px; text-align:center; background-color:#2f50b1; color:#fff; font-family:"Noto Sans Kr"; font-weight:300; font-size:15px;}



/*사이트맵*/
.content_detail .stmbox:last-child{margin-bottom:30px;}
.stmbox{width:100%; margin-bottom:50px; padding:20px 0; box-sizing:border-box; font-size:0;}
.stmbox > div{display:block; vertical-align:top; box-sizing:border-box;}
.stmbox > div.stm_menu1{width:100%; font-size:23px; font-weight:500; text-align:center; color:black; position:relative; letter-spacing:-1px; padding:95px 0 15px 0; border-bottom:2px solid #e3e3e3; margin-bottom:20px;}
.stmbox > div.stm_menu1:before{width:85px; height:70px; display:block; content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:-1;}
.stmbox > div.stm_menu1:after{width:50px; height:3px;  border-radius:15px; display:block; content:""; position:absolute; top:80px; left:50%; transform:translateX(-50%); background-color:#3b94e2;}
.stm10{background:url(/images/contents/sitemap_icon1.png)50% 0 no-repeat;}
.stm20{background:url(/images/contents/sitemap_icon2.png)50% 0 no-repeat;}
.stm30{background:url(/images/contents/sitemap_icon3.png)50% 0 no-repeat;}
.stm40{background:url(/images/contents/sitemap_icon4.png)50% 0 no-repeat;}
.stm50{background:url(/images/contents/sitemap_icon5.png)50% 0 no-repeat;}
.stm60{background:url(/images/contents/sitemap_icon6.png)50% 0 no-repeat;}
.stm80{background:url(/images/contents/sitemap_icon7.png)50% 0 no-repeat;}
.stm90{background:url(/images/contents/sitemap_icon8.png)50% 0 no-repeat;}
.stm91{background:url(/images/contents/sitemap_icon9.png)50% 0 no-repeat;}
.stmbox > div.stm_menu2{width:100%;}
.stmbox > div.stm_menu2 > ul > li > span:hover {border: 1px solid #fff; box-shadow:none;}
.stmbox > div.stm_menu2 > ul > li > span:after{position: absolute; display:block; content:""; bottom: 0; left: 100%; background: #299c97; width: 100%; height: 3px; margin-left: -200%; transition-duration: 0.7s; transition-property: margin-left; transition-timing-function: ease;}
.stmbox > div.stm_menu2 > ul > li > span:hover:after{margin-left: -100%;}
.stmbox > div.stm_menu2 > ul > li > span:hover a{color:#299c97;}
.stmbox > div.stm_menu2 > ul{font-size:0; padding: 0 10px 0 20px;}
.stmbox > div.stm_menu2 > ul > li{display:inline-block; vertical-align:top; width:25%; box-sizing:border-box; padding:0 10px; margin-bottom: 20px;}
.stmbox > div.stm_menu2 > ul > li a{display: inline-block; width: 100%; height: 100%; cursor: pointer;}
.stmbox > div.stm_menu2 > ul > li .first_a{ padding:15px; box-sizing:border-box; font-weight: 500;}
.stmbox > div.stm_menu2 > ul > li > span{display:block; width:100%; box-sizing:border-box; border: 1px solid #d3d4d9; font-size:16.5px; text-align:center; word-break:keep-all; box-shadow: 0px 3px 0px 0px rgba(218, 220, 228, 0.41);  font-weight: 500; letter-spacing:-1px; position:relative; overflow:hidden; transition:0.5s all ease;}
.stmbox > div.stm_menu2 > ul > li > span img{margin-left:3px;}
.stmbox  ul.cont_list > li{position:relative; background:none; padding-left: 15px; margin:0;}
.stmbox  ul.cont_list > li:before{position:absolute; width:0; height:0; display:block; content:""; top:8px; left:0; border-left:6px solid #1366ab; border-bottom:6px solid transparent; border-top:6px solid transparent;}
.stmbox  ul.stm_menu3 > li a{font-size: 15px; position:relative; box-sizing:border-box; margin: 3px 0;}
.stm_menu3{font-size:15px; margin-top: 10px; width: 100%; box-sizing: border-box;}
.stm_menu3 li:hover a{color: #1366ab;}


/*개인정보처리방침*/
.cont_list4 > li{font-size:15px; padding-left:18px; background:url(/images/contents/li_bg.png)2px 5px no-repeat; margin:3px 0; line-height:1.5em; word-break:keep-all;}
.cont_list4 > li.witha{background:url(/images/contents/li_bg.png)2px 10px no-repeat;}
.cont_list5 > li{font-size:16px;margin:5px 0;line-height:1.6em;word-break:keep-all;padding-left: 31px;position:relative;}
.ul_num li i{display:block;position:absolute;top: 3px;left: 8px;width:18px;height:18px;border-radius:10px;background:#1366ab;color:#fff;font-size:11px;font-style:inherit;line-height:18px;text-align:center;}

.per_labeling{width:100%; margin-bottom:40px;}
.per_labeling img{margin-top:5px; margin-bottom:5px;}
.per_labeling img.plil:first-child{margin-right:13px;}
.per_labeling span{display:block; font-size:15px; word-break:break-all; line-height:1.3em;}
.per_labeling span span{font-size:14px;}
.per_labeling .cont_table thead tr{padding:20px 0; text-align:center; position:relative; background-color: #fbfbfb;}
.per_labeling .cont_table tbody td{padding:7px; font-weight:300; box-sizing:border-box;}
.per_labeling .cont_table tbody td.last{border-right:0;}

.labeling_wrap{width:100%; position:relative;}
.labeling_wrap .lali_h:before{display:block; position:absolute; content:""; width:100%; height:3px; top:-2px; left:0; z-index:1; background:linear-gradient(90deg, #058cbc, #6bbc53);}
.labeling_wrap .lali_h {width: 100%; text-align:center; font-size:17px; font-weight:500; position:relative; border-bottom: 1px solid #585858; background: #fbfbfb;s}
.labeling_list{display:flex; position:relative; flex-wrap:wrap; border-bottom: 1px solid #ccc; }
.labeling_list li{display:inline-block; width:50%; padding:10px 20px; box-sizing:border-box; font-size:16px; position:relative;line-height:1.5em;word-break:keep-all;}
.labeling_list li:nth-child(2n){border-right: 1px solid #ccc;}
.labeling_list li a:hover{color:#2682ce;}
.labeling_list img{width:28px;}

.labeling_list_mobile{border-bottom: 1px solid #d6d6d6;}
.labeling_list_mobile li{display:inline-block; width:100%; padding:10px 8px; box-sizing:border-box; font-size:15px; position:relative; word-break:keep-all; }
.labeling_list_mobile li:nth-child(2){background:url(/images/contents/nplabel01.png), url(/images/contents/nplabel02.png), url(/images/contents/nplabel03.png); background-position: 5px, 37px, 69px; background-size:28px; background-repeat: no-repeat; padding-left:105px;}
.labeling_list_mobile li + li + li{background:url(/images/contents/nplabel04.png)no-repeat; background-size:28px; padding-left:41px; background-position: 5px;}
.labeling_list_mobile li:nth-child(4){background:url(/images/contents/nplabel05.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(5){background:url(/images/contents/nplabel06.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(6){background:url(/images/contents/nplabel08.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(7){background:url(/images/contents/nplabel07.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(8){background:url(/images/contents/nplabel09.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(9){background:url(/images/contents/nplabel10.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(10){background:url(/images/contents/nplabel11.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(11){background:url(/images/contents/nplabel12.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(12){background:url(/images/contents/nplabel13.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(13){background:url(/images/contents/nplabel14.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(14){background:url(/images/contents/nplabel15.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(15){background:url(/images/contents/nplabel16.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile li:nth-child(16){background:url(/images/contents/nplabel17.png)no-repeat; background-size:28px; background-position: 5px;}
.labeling_list_mobile{display:none;}
.labeling_list_mobile li:nth-child(2n){background-color:#eef6fb;}
.labeling_list_mobile li a:hover{color:#2682ce;}

.lab_cont .la_img{width:31px; margin-top: -1px;}
.lab_cont .la_img:last-child{margin-right:4px;}
.lab_cont .la_img + img{margin-left: 1px;}

.label_txt{margin-top:10px; font-weight:400;}

/*에러 페이지 디자인*/
.error_box{width:600px; margin:0 auto; padding:30px; box-sizing:border-box; position:relative; top:60px; background-color: #fff; border:2px solid #e3e3e3;}
.error_box .logo{position:absolute; left:20px; top:20px; width:180px;}
.error_txt{width:100%; text-align:center; box-sizing: border-box;}
.error_txt img{margin-top:50px; margin-bottom:15px;}
.error_txt p{font-size:15px; margin-bottom:13px; word-break:keep-all;}
.error_txt a.backbtn{display:block; width:180px; height:45px; background-color:#323847; color:#fff; text-align:center; line-height:40px; font-size:16px; margin:20px auto; box-sizing:border-box;}


.banner_box{width:100%;}
.banner_box ul{ font-size:0;}
.banner_box ul li{display:inline-block; vertical-align:top; width:33.3%; padding:10px 30px; box-sizing:border-box;}
.banner_box ul li a{display:block; width:90%; margin:5px auto; border:1px solid #ccc;}
.banner_box ul li a img{width:100%;}


/* 국토정보플랫폼 지도  */
.map_wrap{position:relative;}

/* 버튼 */

.map_wrap #map {width:100%;height:530px;}
.map_wrap .map-btn{padding:0; position:absolute; top:5px; right:5px; z-index:9; width:50px; text-align:center; background:#fff; border-radius:0; border:1px solid #666; list-style:none;}
.map_wrap .map-btn li{background:none;}
.map_wrap .map-btn li{display:block; border-bottom:1px solid rgba(0,0,0,0.3); padding:0;}
.map_wrap .map-btn li.img-li{background:#666; border-bottom:1px solid rgba(255,255,255,0.5);}
.map_wrap .map-btn li.img-li:last-child {border-bottom: 0;}
.map_wrap .map-btn li:nth-child(3), .map-btn li:last-child{border-bottom:none;}
.map_wrap .map-btn li a{display:block; color:#000; padding:8px 0; font-size:12px; letter-spacing:-1px; font-weight:bold; text-decoration: none;}
.map_wrap .map-btn li.normal a:hover {background-color:#fee7dd;}
.map_wrap .map-btn li.sense a:hover {background-color:#dde8fe;}
.map_wrap .map-btn li.big a:hover {background-color:#f0fedd;}
.map_wrap .map-btn li.img-li a{color:#fff; font-size:16px; line-height: 1.2em;}



/*곰돌아 책 읽어줄게*/
.bear_book_img{width:700px; text-align:center; margin:0 auto;}
.bear_book_img img{display:inline-block; width:100%;}


/* 자료실 소개 */
.rfroom_cont li {display:inline-block;width:calc((100% / 3) - 20px);background: #f9f9f9;  margin-right:20px;margin-bottom:20px;padding:8px;border: 1px solid #d3d4d9; box-sizing:border-box;position:relative; box-shadow: 0px 3px 0px 0px rgba(218, 220, 228, 0.41);}
.rfroom_cont li:nth-child(3n) {margin-right:0;}
.rfroom_cont li .img {max-height:180px; overflow:hidden;}
.rfroom_cont li img {width:100%; height:auto;}

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

/*사이트맵*/
.stmbox > div{display:block;}
.stmbox > div.stm_menu1{margin: 0 auto 30px auto;}
.stmbox > div.stm_menu2{width:100%;}
}

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

/*조직도*/
.chart_box:before{width:295px;}
.chart_box:after{width:295px;}


/*모바일앱*/
.process li {width: 25%; display: inline-block; vertical-align: middle; background: url(/images/contents/road_next.png) 98% 50% no-repeat; padding-left: 0; line-height: normal;
position: relative; margin-bottom: 20px;}

/*채용정보*/
.job_banner ul li{width:100%;}

/*사이트맵*/
.stmbox > div.stm_menu2 > ul > li{width:33%;}

}



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

/*순회문고*/
.project07_box .project07_img {height:auto; overflow: hidden;}

 /*사이트맵*/
.stmbox > div.stm_menu2 > ul > li{width:50%;}

/*개인정보처리방침*/
.labeling_list{display:none;}
.labeling_list_mobile{display:block;}
}


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

/*연혁*/
.history_box .history_img{display:none;}
.history_box .history_text:before { left: 20px;}

.history_box .history_text {padding-left: 50px;  width:100%;}

}


@media  screen and (max-width:880px)
{
 /*도서관현황*/
.libn_info .info_box > div{display:block;}
.libn_info .info_box > div.libn_img{text-align:center;}
.libn_info .info_box > div.libn_txt{padding:10px; width:100%;}	

/*스마트도서관*/
.smart_lib_wrap{margin-bottom:20px;}
a.smart_lib_go{display:block; margin: 0 auto;}
a.smart_lib_go1{margin-bottom:10px;}

}

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

/*도서관현황*/
.plan_box{padding:5px 15px;}
.plan_box > div{display:block; width:100%; margin:10px 0;}
.plan_box > div img{width:100%;}


/*도서관 지도*/
.lib_map > div{display:block;}
.lib_map > div.lm_img{margin:0 auto 20px auto; overflow-x:auto; width:100%; text-align:center;}
.lib_map > div.lm_info{width:100%; padding-left:0;}


/*장애인대출(책나래) - 이용안내*/
.project0_flow li{width: 100%; margin-bottom: 30px; padding: 8px;}

.project0_flow li:after{position: relative; display: block; background: none; content: ""; top: 31px; width: 0; height: 0; border-top: 8px solid #333; border-left: 8px solid transparent; border-right: 8px solid transparent; left: 48%;}

}	



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

/*조직도*/
.chart_box .each{margin-top:224px;box-sizing:border-box; padding:15px; border:1px solid #ccc; min-height:185px;}
.chart_box .each:before{display:none;}
.chart_box .each > div:before{display:none;}


.chart_box .each .ypyj {right: 15px;}

.chart_box .each .edustudy {left: 15px;}


 /*도서관 주요사업*/
.info06_bundle .info06_text{width:100%;}
.info06_bundle .info06_img{display:none;} 
.info06_bundle {margin-bottom:45px;}
.info06_bundle_last{margin-bottom:10px;}
}

@media  screen and (max-width:775px)
{
  
 /*조직도*/
.chart_box .side .another1{margin-left:0;}
.chart_box .side .another2{margin-right:0;}
.chart_box:before{width:35%;}
.chart_box:after{width:35%;}

/*장애인대출*/
.project08_box .project08_main_text {font-size: 25px; padding: 30px;}

/*순회문고*/
.project07_box .project07_main_text {font-size: 23px; padding: 30px 0 20px;}
.project07_box .project07_sub_text {font-size: 15px; padding-bottom:20px;}

}
 

@media  screen and (max-width:750px)
{
/*곰돌아 책 읽어줄게*/
.bear_book_img{width:100%;}

/* 자료실 소개 */
.rfroom_cont li {width:calc((100% / 2) - 10px); margin-right:10px; margin-bottom:10px; padding:5px;}
.rfroom_cont li:nth-child(2n) {margin-right:0;}
.rfroom_cont li:nth-child(3n) {margin-right:10px;}
.rfroom_cont li:last-child {margin-right:0px;}

}



@media  screen and (max-width:700px)
{
	/*인사말*/
	.intro_top .it_in {width: 80%;}

	/*찾아오시는길*/
.ingf8_box ul li .info8_sub{width:70%;}

.ingf8_box ul li .info8_tit{width:30%; }

/*모바일앱*/
.process li:after {position: relative; display: block; content: ""; top: 13px; width: 0; height: 0; border-top: 15px solid #333; border-left: 15px solid transparent;
 border-right: 15px solid transparent; left: 48%;}
 .process li{width: 100%;}
 .process li div {width: 100%;}

}

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

/*인사말*/
.intro_top .it_in {border: 0px solid #fff;}

/*장애인대출*/
.project08_box .project08_main_text {font-size: 20px; font-weight:500;}
.project08_box .project08_img {width: 100%; box-sizing: border-box; height:auto; overflow: hidden;}

/*순회문고*/
.project07_box .project07_main_text {font-size: 18px;}

/*도서관운영기본방향 20210108*/
 .operation_box .box_zone .quotation_i1_1{transform:translate(-270px,-20px);}
 .operation_box .box_zone .quotation_i2_2{transform:translate(270px,-20px);}


}


@media  screen and (max-width:650px)
{
/*상단 설명*/
.top_exp img{display:none;}
.top_exp div{width:100%; padding-left:0;}

/*도서관 이용안내*/
.process li{width:100% !important; display:block;  background:none; margin-bottom:30px; line-height:normal;}
.process li:after{position:relative; display:block; content:""; top:13px; width:0; height:0; border-top:15px solid #333; border-left:15px solid transparent; border-right:15px solid transparent; left:48%;}
.process li:last-child:after{display:none;}
.process li div{width:100%; padding: 20px 15px 25px 15px; word-break:keep-all;}
.process li span.lp_num{width:40px; height:40px; font-size:28px; line-height:40px;}

/*조직도*/
.chart_box:before{display:none;}
.chart_box:after{display:none;}
.chart_box .boss{width:100%;}
.chart_box .boss:after {height: 180px;}
.chart_box .side{float:none; width:100%;}
.chart_box .each{margin-top:166px; height:auto;}
.chart_box .side .another1 {position: relative; left: 0px; width: 100%;}
.chart_box .side .another2 {position: relative; top: 0; right: 0; width: 100%;}

/*로그인*/
#login_field .login_box{height:auto; padding-bottom:50px;}
#login_field .login_in {margin: 50px auto 15px auto; padding-bottom:0;}
#login_field .login_in > div{display:block;}
#login_field .login_in .login_inimg{width:auto; text-align:center; margin-bottom:20px;}
#login_field .login_in .login_inimg img{width:130px;}
#login_field .login_in .login_inbox{margin:0 auto;}


/*사이트맵*/
.stmbox > div.stm_menu2 > ul > li{width:100%;}

/*에러 페이지 디자인*/
.error_box{width:95%; height:auto; padding:10px; text-align:center;}
.error_box:before{display:none;}
.error_box img{float:none;}
.error_txt{margin:0 auto; width:100%; padding:15px; height:auto;}


/*테이블 좌우 스크롤*/
.drag_please{display:block; text-align:right;}

/*사물함 신청*/
.locker_rent_step ul li img{height:40px;}
.locker_rent_step ul li:before{top:7px;}
#locker_rentgo a{display:block; width:90%; margin:5px auto;}
#locker_rentgo a.rent{margin:5px auto;}

/*수강확인*/
.certibox ul li{width:100%; display:block; margin:0 0 15px 0;}

/*회원가입*/
.join_step ul li img{width:40px;}


}




@media  screen and (max-width:635px)
{
/*개인정보처리방침*/
.per_labeling img{margin-top:5px; margin-bottom:5px; width:45%;}
.per_labeling img.plil:first-child{margin-right:6px;}

}

@media  screen and (max-width:631px)
{
/*모바일앱*/
.cyber03 .cyber03_box2 .cyber03_box2_1 li{width:50%; text-align:left;}
.cyber03 .cyber03_box2 .cyber03_box2_3 > p{margin-bottom:10px; display:block; margin-right:0;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake{display:block; width:90%;}
.cyber03 .cyber03_box2 .cyber03_box2_3 .search_fake > p{display:inline-block; vertical-align:middle; box-sizing:border-box;}

/*도서관운영기본방향 20210108*/
 .operation_box .box_zone .quotation_i1_1{transform:translate(-230px,-20px);}
 .operation_box .box_zone .quotation_i2_2{transform:translate(230px,-20px);}

}





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

/*장애인도서대출*/
.project08_box .project08_main_text { padding: 20px 10px 20px 0px;}

/*채용정보*/
.job_banner ul li div{display:block;}
.job_banner ul li div.name{width:100%; background-color:#f8f8f8;}
.job_banner ul li div.ban{width:100%; border-bottom:2px solid #ddd; padding: 15px 5px; margin-bottom: 15px;}

}


@media  screen and (max-width:520px)
{ 
/*울산교육기본방향*/
 .operation_box .box_zone .quotation_i1{display:none;}
 .operation_box .box_zone .quotation_i2{display:none;}

/*도서관운영기본방향 20210108*/
 .operation_box .box_zone .quotation_i1_1{display:none;}
 .operation_box .box_zone .quotation_i2_2{display:none;}

 /*스마트도서관*/
a.smart_lib_go{font-size:18px; padding: 18px 5px 15px 5px;width: 300px;}
}


@media  screen and (max-width:500px)
{ 
  .top_exp{padding:15px;}


  .year_tab ul li{width:20%; box-sizing:border-box;}

    /*도서관현황*/
	.libn_info .info_box > div.libn_img img{width:100%;}
	.litl_info .info_box > div.lit_img img{width:100%;}

	/*조직도*/
	.chart_box .each > div{position:relative; margin-bottom:10px; display:block;}
	.chart_box .each .edustudy{left:auto; margin-bottom:30px;}
	.chart_box .each .ypyj{right:auto;}
	.chart_box .each > div .topname {width: 80%; margin: 5px auto;}

  /*로그인*/
	#login_field .login_in{width: auto;}
	#login_field .login_in label{width: 70px; font-size: 16px;}
	#login_field .login_in input{width:-webkit-calc(100% - 70px); width: -webkit-calc(100% - 70px); width: -moz-calc(100% - 70px); width: calc(100% - 70px);}
	#login_field .login_in .login_btn{margin-top:10px;}
	#login_field .etc_zone .btn{width:100%; padding: 7px 10px;}
	#login_field .etc_zone .btn:nth-child(2){margin-top:7px;}


  /*사이트맵*/
  .stm10{background:none;}
  .stm20{background:none;}
  .stm30{background:none;}
  .stm40{background:none;}
  .stm50{background:none;}
  .stm60{background:none;}
  .stm80{background:none;}
  .stm90{background:none;}
  .stm91{background:none;}
  .stmbox > div.stm10:before, .stmbox > div.stm10:after{display:none;}
  .stmbox > div.stm20:before, .stmbox > div.stm20:after{display:none;}
  .stmbox > div.stm30:before, .stmbox > div.stm30:after{display:none;}
  .stmbox > div.stm40:before, .stmbox > div.stm40:after{display:none;}
  .stmbox > div.stm50:before, .stmbox > div.stm50:after{display:none;}
  .stmbox > div.stm60:before, .stmbox > div.stm60:after{display:none;}
  .stmbox > div.stm80:before, .stmbox > div.stm80:after{display:none;}
  .stmbox > div.stm90:before, .stmbox > div.stm90:after{display:none;}
  .stmbox > div.stm91:before, .stmbox > div.stm91:after{display:none;}
  .stmbox {margin-bottom: 10px;}
  .stmbox > div.stm_menu1{margin: 0 auto 18px auto; padding: 5px 10px 15px 10px; width: 100%;}
  .stmbox > div.stm_menu2 > ul > li{margin-bottom: 10px;}
  .stmbox ul.cont_list{margin-bottom:10px;}
  .stmbox ul.cont_list > li {margin: 5px 0;}
  .stmbox ul.stm_menu3 > li a{margin:0;}


  /*회원가입*/
  #choice_type > div{display:block; width:100%;}
  #choice_type > div.up14{margin-right:0; margin-bottom:10px;}
  
  /*전자도서관*/
  .cyber2 .cyber02_ul li{display:inline-block; position:relative; padding: 0; height:130px; vertical-align:middle;}
  .cyber2 .cyber02_ul li:before{content:""; display:inline-block; vertical-align:middle; height:100%;}
  .cyber2 .cyber02_ul li a{display: inline-block; height: auto; padding: 13px 10px; vertical-align: middle;}
  
}

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

/*찾아오시는길*/
.ingf8_box ul li .info8_sub{width:70%; font-size:15px;}

.ingf8_box ul li .info8_tit{width:30%; font-size:16px}

/*장애인대출*/
.project08_box .project08_main_text {font-size: 18px; font-weight:500;}


	/*안사말*/
	.intro_top .it_in {width: 100%;}
	.intro_top p.big {font-size: 20px;}
	.intro_top p.small_t {font-size: 15px;}

}



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

/*모바일앱*/
.cyber03 .cyber03_box2 .cyber03_box2_1 li{width:100%; margin:5px 0;}
.cyber03 .cyber03_box2 {padding: 20px 5px;}

/*장애인대출*/
.project08_box .project08_main_text {padding: 20px 10px 20px 0px;}

}






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

/*울산교육기본방향*/
.operation_box .box_zone {font-size: 16px;}
.operation_box .title_zone .title_kor {font-size:26px; line-height:26px;}
.arrow_box img{width:45px;}

/*도서관운영기본방향*/
.operation_box_lib .box_zone_lib {font-size: 16px;}
.operation_box_lib .title_zone_lib .title_kor_lib {font-size:26px; line-height:26px;}
.arrow_box_lib img{width:45px;}

}



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

/*사이버학습*/
.cyber05 .cyber05_float .cyber05_con { margin: 10px 30px 20px 110px;}  
.cyber05 .cyber05_float ul {width: 95%;}

}