@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0;padding:0;border:0;vertical-align:middle}

a,img,input,select { vertical-align:middle}

html, body {font-size:13px; line-height:1; background:#fff; display:block; width:100%; max-width:100%; height:100%; font-family: 'NotoKr','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
ol, ul {list-style: none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,
q:before, q:after {	content:'';content: none}
table {	border-collapse: collapse;border-spacing: 0;font-size:12px; background:#fff; vertical-align:middle; width: 100%}
table th { font-weight:600}
h1, h2, h3, h4, h5, h6 { font-weight:600; font-size:13px}

table { border-collapse:collapse}


/* 
.sL10 self Loan Return 1뎁스
.sL10 self Loan Return 1뎁스
.sL10 self Loan Return 1뎁스

*/

/*링크줄없애기*/
a {color:#686969; text-decoration:none; cursor:pointer}
a:link {}
a:active {}
a:visited {}
a:hover, a:focus {color:#ffc600}


/* 티몬소리 font */
@font-face { font-family: 'TmonMonsori';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/TmonMonsori.woff') format('woff');
    font-weight: normal; font-style: normal; }


/* Notosans font */
@font-face {
    font-family: 'NotoKr';
    font-style: normal;
    font-weight: 300;
    src: local('Noto Sans Regular'), local('NotoSans-Regular'), url('../font/NotoSansKR-Regular.eot');
    src: url('../font/NotoSansKR-Regular.eot?#iefix') format('embedded-opentype'),
    url('../font/NotoSansKR-Regular.woff2') format('woff2'),
    url('../font/NotoSansKR-Regular.woff') format('woff');
}

@font-face {
    font-family: 'NotoKr';
    font-style: normal;
    font-weight: 500;
    src: local('Noto Sans Medium'), local('NotoSans-Medium'), url('../font/NotoSansKR-Medium.eot');
    src: url('../font/NotoSansKR-Medium.eot?#iefix') format('embedded-opentype'),
    url('../font/NotoSansKR-Medium.woff2') format('woff2'),
    url('../font/NotoSansKR-Medium.woff') format('woff');
}

@font-face {
    font-family: 'NotoKr';
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('../font/NotoSansKR-Bold.eot');
    src: url('../font/NotoSansKR-Bold.eot?#iefix') format('embedded-opentype'),
    url('../font/NotoSansKR-Bold.woff2') format('woff2'),
    url('../font/NotoSansKR-Bold.woff') format('woff');
}


/*
@font-face{font-family:NB;src:url('../font/NanumBrush.eot');src:local(※),url('../font/NanumBrush.woff') format('woff'), url('../font/NanumBrush.ttf') format('truetype')}
 .NB{font-family:'나눔손글씨 붓',NB,Cursive}

@font-face{font-family:NP;src:url('../font/NanumPen.eot');src:local(※),url('../font/NanumPen.woff') format('woff'), url('../font/NanumPen.ttf') format('truetype')}
.NP{font-family:'나눔손글씨 펜',NP,Cursive}


@font-face{font-family:NM;src:url('../font/NanumMyeongjo.eot');src:local(※),url('../font/NanumMyeongjo.woff') format('woff')}
.NM{font-family:'나눔명조', NM, serif}


@font-face{font-family:SNM;src:url('../font/SeoulNamsanM.eot');src:local(※),url('../font/SeoulNamsanM.woff') format('woff')}
.snm{font-family:'나눔고딕 Light', NGL, sans-serif}
*/

@font-face{ font-family:'SeoulNamsanWeb'; font-style: normal; font-weight: normal; src: url('../font/SeoulNamsanM.eot'); src:local('☺'), url('../font/SeoulNamsanM.woff') format('woff') }


/* SKIP */
a.skip { display: block; width:100%; height:28px; padding:12px 0 0 0; font-size:14px; text-align:center; margin-top:-40px; background:#5f5c59; color:#fff; position: absolute; left:0; top:-50px; transition:top 0.15s ease 0s; }
a.skip:hover,
a.skip:focus {top:40px}



/* LAYOUT */

.header_wrap h1,
.header_wrap h1 a{ float:left; width:540px; height:55px; text-align: left;}
.header_wrap h1 a img { float:left}
h1 .h1_kcms { display:block; height:55px; width:100px; float:left; background:url(../images/h1.png) no-repeat 0 5px; overflow:hidden; text-indent:-9999px}
/* h1 a {width:180px} */

/* KCMS 표준(세종시 적용에는 아래 두줄 주석 후 세종시 부분 주석 해제) */
h1 .libname1 {float:left; display:block; height:50px; width:340px; padding:30px 0 0 85px; text-indent:3px; font-weight:normal; font-family:'SeoulNamsanWeb'; color:#fff; font-size:15px; background:url(../images/h1_libname.png) no-repeat 0 24px}
h1 .libname2 { display:block; padding:5px 0 0 3px;  font-size:24px; text-indent:0}

/* 세종시 KCMS 적용시에는 아래2줄 주석 해제 후 KCMS 표준 2줄 주석처리 */
/*
h1 .libname1 {float:left; display:inline-block; height:40px; max-width:300px; padding:24px 0 20px 140px; text-indent:3px; font-weight:normal; color:#ffc600; font-size:15px; background:url(../images/h1_libname_sejong.png) no-repeat 10px 16px !important; background-size:120px !important; border-left:1px solid #FFD84F !important; text-align:right;}
h1 .libname2 { display:block; padding:5px 0 0 3px;  font-size:25px; text-indent:0; color:#fff; font-weight:600; letter-spacing: -1px; font-weight:500 !important;}
*/


.vNav{ float:right; padding: 20px 0 0 0}
.vNav ul { text-align:right; margin:0 -20px 0 0}
.vNav li { display:inline-block;}
.vNav li a { display:block; width:80px; height:30px; padding:50px 0 0 0; background:url(../images/btn_m10.png)  no-repeat center -138px ; text-align:center; opacity:0.8; color:#333}
.vNav li.gnb_search a { background-position: center -13px}
.vNav li.gnb_login a,
.vNav li.gnb_logout a { background-position: center -260px}
.vNav li.gnb_join a { background-position: center -377px}
.vNav li.gnb_mypage a { background-position: center -138px}
.vNav li.gnb_statistics a { background-position: center -502px}


.vNav li a:hover, .vNav li a:focus{ color:#000; opacity:1}

.login_member a, .login_member strong, .login_member span {vertical-align:bottom}
.login_member { display:inline-block; text-align:right; position:absolute; right:0; top:-25px; background:#717171; height:19px; padding:6px 0 10px 20px ; color:#fff; line-height:1.2em}
.login_member a { vertical-align:middle; padding:9px 12px ; margin:0 0 0 -2px; background:#555; color:#fff;  }
.login_member a:hover,
.login_member a:focus { background:#333}

.status_loan_stap { background: #f60; padding:10px 12px 10px 15px; margin:0 5px 0 -20px}

.header_wrap { width:100%; height:110px; padding:25px 0 0;overflow:hidden; background:#ffc600}
.timeout_warning { padding:0 15px; color:#ededed}

.login_info { width:20%; float:right; text-align:right; margin:-20px 0 0 0}

.login_info a:hover, .login_info a:focus { background:#19a5c7}


.content_wrap { background:#fbfbfb; padding: 50px 0;  border-top: #efefef solid 1px; border-bottom: #efefef solid 1px}
body.fix2 .content_wrap {padding-bottom: 800px}

.content_wrap:after {content:" "; display:block; clear:both; height:0; visibility:hidden;}
.bestSearch .content_wrap {min-height:480px;}

.container { width:980px; padding:0 5px; margin:0 auto}

.header_wrap .container { position:relative}


.footer_wrap{ padding:30px 0 50px 0; overflow:hidden}
.footer_wrap .logo { width:135px; height:100px; background:url(../images/h6.png) no-repeat 0 0; overflow:hidden; text-indent:-9999px; float:left}
.footer_wrap .company { font-size:15px ; color:#d0d0d0; padding:0 0 17px 0}
.foot_info { float:left }
.president, .work_id, .f_address, .f_tel, .f_fax { color:#aeaeae; display:inline; padding: 0 7px 0 0; line-height:1.2em; vertical-align: baseline}
.president strong, .work_id strong, .f_tel strong, .f_fax strong { color:#33b3d3;display:inline; line-height:1.2em; vertical-align: baseline}
.president:before, .work_id:before, .f_tel:before, .f_fax:before { display:inline-block; content:""; width:1px; height:10px; background:#898989; margin:0 9px -1px 0}
.copyright { color:#959595; font-size:11px; padding:5px 0 0; float:left}

.termsofuse { float:right;}
.termsofuse a { display:inline-block; font-size:12px; color:#999; padding:0 6px 0 10px; position:relative;}
.termsofuse a:hover, .termsofuse a:focus { color:#333}
.termsofuse a:before { display:inline-block; content:""; width: 1px; height: 10px; background: #ddd; position: absolute; left: 1px; top:1px}
.termsofuse a:first-child:before { display: none}
.termsofuse a.pro_info:before { display:none}
.termsofuse a.pro_info { display:inline-block; width:9px; height:24px; border:1px solid #555; background: #f6f6f6 url(../images/icon_proinfo.png) no-repeat -1px -1px ; text-indent:-9999px; border-radius:6px; margin-left:10px; opacity:0.4}
.termsofuse a.pro_info:hover,
.termsofuse a.pro_info:focus { opacity:1}


/* main */
.comment { color:#717171; background:#fff; padding:30px 0 22px 0; line-height:1.4em;}
.comment:after { display:block; content:""; height:0; visibility:hidden; clear:both}
.comment p { padding:5px 0}
.main .comment h2 { padding:10px 0 5px }


.m_left { width:49%; float:left; }
.m_right { width:47%; float:right}

.bestSearch .m_left { width:45%; padding:0 15% 0 0; position:relative;}
.bestSearch .m_right { width:39%}

/* 기능추가 2017.0201 */
.member_view .m_right { float: left; width: 100%}
.member_view a.btn_m { font-size: 29px; padding-bottom: 70px}
.member_view .aside { padding:20px 0 0 0; border-top:#ddd dotted 1px}

/* test용
.search_view .m_right,
.member_view .m_left { display: none}
*/
.search_view .m_left { width: 100%; padding:0; border:none}
.search_view.bestSearch .m_left { width:68%; padding-right:32%}
.search_view .m_left a.btn_m {width:74%; padding-left:26%}
.search_view .m_left .aside { width: 100%}

.search_view .mbest_word { padding-right:0}

/*
a.btn_m { display:block; width:100%; overflow:hidden; float:left; background:url(../images/btn_b10.png) no-repeat 0 0; padding:130px 0 30px 0; font-size:26px; color:#666}
.m_left a.btn_m { background-image:url(../images/btn_a10.png)}
*/

a.btn_m { display:block; width:49%; overflow:hidden; float:left; background:url(../images/btn_b20.png) no-repeat 0 0; padding:0 0 100px 50%; font-size:25px; letter-spacing:-1px; color:#666; word-break:keep-all}
/* a.btn_m { display:block; width:59%; overflow:hidden; float:left; background:url(../images/btn_b20.png) no-repeat 0 0; padding:0 0 100px 40%; font-size:25px; letter-spacing:-1px; color:#666; word-break:keep-all} */
.bookium { background:url(../images/btn_b10.png) no-repeat 0 0 !important; }

.m_left a.btn_m {width:40%; background-image:url(../images/btn_a10.png)}
/* .m_left a.btn_m {width:50%; background-image:url(../images/btn_a10.png)} */

a.btn_m .en_bar { display:block; font-size:12px; background:#ffc600 url(../images/deco_arrow_10.gif) no-repeat 97% 7px; padding:5px 10px; margin:10px 0}
.member_view a.btn_m .en_bar { padding:10px 15px; background-position: 97% 12px}
a.btn_m:hover, a.btn_m:focus { color:#000}
a.btn_m .ment { font-size:11px; padding: 10px; color:#999}
.m_left a.btn_m:hover .en_bar, .m_left a.btn_m:focus .en_bar,
.m_right a.btn_m:hover .en_bar, .m_right a.btn_m:focus .en_bar { color:#ffc600; background:#333 url(../images/deco_arrow_10.gif) no-repeat 97% -7px /*; padding:5px 10px */}

input[type="button"]:hover { cursor:pointer }

input.btn_prt,
input.btn_reserve,
input.btn_prt_dis,
input.btn_reserve_dis { background:#1d89c0 url(../images/btn_prt.png) no-repeat -1px -2px; padding:5px 8px 6px 40px; color:#fff; border:none; font-size:12px; float:right; margin:0 0 -10px 3px; vertical-align:middle}
input.btn_prt:hover,
input.btn_prt:focus,
input.btn_reserve:hover,
input.btn_reserve:focus {background-color:#0d74a8 }

td > input.btn_reserve_dis{margin:0;}
input.btn_reserve { background:#1d89c0 url(../images/btn_reserve.png) no-repeat -1px -2px}

input.btn_prt_dis{ background-color:#ccc  }
input.btn_reserve_dis { background:#ccc url(../images/btn_reserve.png) no-repeat -1px -1px  }

input.btn_prt_dis:hover,
input.btn_prt_dis:focus,
input.btn_reserve_dis:hover,
input.btn_reserve_dis:focus {background-color:#ccc; cursor:default }

.m_left .aside { margin:10px 0; width:90%; font-size:12px; color:#717171; line-height:1.2; text-align:left}
.m_right .aside { margin:0 0 10px 0; padding-left:2%; font-size:12px; color:#717171; line-height:1.6em; text-align:left; overflow:hidden}
.m_right .aside span { margin:0 0 20px 0; float:left }

.m_left .aside { clear:both}

/* 170125 추가 */
.m_right .aside h4 { font-size: 14px; clear: both; color:#333}
.m_right .aside p { padding:5px 0 15px }
.m_right .aside h4::before { background: #ffc600;content: ""; display: block;height: 1px;margin: 0 0 10px;width: 20px;}
.m_right .aside h4:first-child:before { display: none}

/*
.m_left .aside #searchForm {padding:30px 0; border-top: solid #ddd 1px}
.m_left .aside form input { height:38px; padding:4px 10px; vertical-align:middle}
.m_left .aside form input[type=text] { border: #999 solid 3px; width:80%; height:23px}
.bestSearch .m_left .aside form input[type=text] {width:75%}
.m_left .aside form input[type=text]:hover,
.m_left .aside form input[type=text]:focus { border:#333 solid 3px}
.m_left .aside form input[type=submit] { width:60px; border:none; background:#717171 url(../images/icon_search_20.png) no-repeat center 5px; font-size:1px; color:#717171;}
.m_left .aside form input[type=submit]:focus,
.m_left .aside form input[type=submit]:hover { background:#333 url(../images/icon_search_20.png) no-repeat center 5px}

a.btn_search{ padding:17px 30px 18px 30px; margin:0 0 0 -5px; border:#717171 solid 1px; background:#717171 url(../images/icon_search_20.png) no-repeat center 4px; font-size:0; color:#717171; vertical-align:middle}
a.btn_search:hover,
a.btn_search:focus { background-color:#555}

*/

.m_left #searchForm { display:block; position:relative; padding:60px 0 30px 0; border-top: solid #ddd 1px}
.lib_search .m_left #searchForm {border-top:none}

.m_left .aside form input {  vertical-align:middle}
.m_left .aside form input[type=text] { border: #999 solid 3px; width:60%; height:23px;padding:4px 10px; margin-left: 140px; position:absolute; left:0; top:30px; }
.m_left .aside form input[type=text]:hover,
.m_left .aside form input[type=text]:focus { border:#333 solid 3px}
.m_left .aside form input[type=submit] { width:60px; border:none; background:#717171 url(../images/icon_search_20.png) no-repeat center 5px; font-size:1px; color:#717171;}
.m_left .aside form input[type=submit]:focus,
.m_left .aside form input[type=submit]:hover { background:#333 url(../images/icon_search_20.png) no-repeat center 5px}

/* 인기검색 노출시 검색창 위치 변경*/
.bestSearch .m_left .aside form input[type=text] {margin-left: 130px;}

a.btn_search{ position:absolute; right:0; top:30px; display:block; width:20%; height:37px; background:#717171 url(../images/icon_search_20.png) no-repeat center 4px; font-size:0; color:#717171; vertical-align:middle}
a.btn_search:hover,
a.btn_search:focus { background-color:#555}

.main .lib_select_wrap { border:#ededed solid 1px; background:#f6f6f6 url(../images/bg_map2.png) no-repeat 15px 15px; padding:13px 4% 13px 23%; position:relative}
.sub .lib_select_wrap {float:left; width:33%; background:url(../images/bg_map2.png) no-repeat 0 0; position:relative; padding: 0px 0 6px 80px; margin:0 0 -20px 0; z-index:100}

.lib_select_h3 { color:#2a8ec7; font-size:15px}
.main .lib_select_h3,
#main .lib_select_h3 { border-bottom: dotted 1px #d7d7d7; padding:0 0 12px 0; margin: 0 0 12px 0}
.sub .lib_select_h3 { border-bottom: dotted 1px #d7d7d7; padding:6px 0; margin: 0 0 6px 0}


/* .sub .lib_select_h3 { display:inline} */

.lib_check_label {margin-right:-20.5px;}
.lib_select { display:none; padding:12px; width:240px; border: solid 1px #ededed ; position:absolute;  background:#fff; box-shadow:#dedede 2px 2px 3px; max-height: 550px; overflow-y: auto;}
.main .lib_select {left:39%; bottom: 10px;}
.sub .lib_select {left:44.5%; top: 0px;}
/* .sub .lib_select {left:63.5%; top: 18px; z-index:300}*/
.lib_select li {padding:2px 0}
/* .sub #lib_all { margin-left:20px}

/* a.lib_list {padding:3px 10px 3px 35px ; margin: 0 0 0 20px ; background:#fff url(../images/icon_more_10.gif) no-repeat 0 0; color:#333; border: solid 1px #dadada; border-radius:4px } */
.main a.lib_list {padding:3px 10px 3px 35px ; margin: 0 0 0 20px ; background:#fff url(../images/icon_more_10.gif) no-repeat 0 0; color:#333; border: solid 1px #dadada; border-radius:4px }
.sub a.lib_list {padding:3px 10px 3px 35px ; margin: 0 0 0 20px ; background:#fff url(../images/icon_more_10.gif) no-repeat 0 0; color:#333; border: solid 1px #dadada; border-radius:4px }
/* .sub a.lib_list { display:block;  
width:70px;padding:1px 10px 1px 35px ; margin: 5px 0 0 143px ; background:#fff url(../images/icon_more_10.gif) no-repeat 0 0; color:#333; border: solid 1px #dadada; border-radius:4px } */
a.lib_list:hover,
a.lib_list:focus {}

.lib_list_close a,
a.lib_list_close {display:blcok; position:absolute; right: 12px; top:12px; width:19px; height:19px; overflow:hidden; text-indent:-9999px; font-size:0; background:#f6f6f6 url(../images/btn_close_10.gif) no-repeat 0 0; border:#ededed solid 1px}
.lib_list_close a:hover,.lib_list_close a:focus,
a.lib_list_close:hover,a.lib_list_close:focus {border: solid 1px #777; background:#777 url(../images/btn_close_10.gif) no-repeat 0 -21px }

/* 인기검색어 */
.mbest_word { position: absolute; width:22%; right: 0; top: 0; line-height: 1.6em; font-size:13px; padding:0 3% 0 4%; border-left:#ddd dotted 1px; border-right: solid 1px #ddd}
.mbest_word h3 { font-size: 25px; color: #666; height: 40px; letter-spacing: -1px; font-weight: normal; }
.mbest_word li { display: block;; width: 100% }
.mbest_word li a { display: block;; width: 100%; text-overflow:ellipsis; white-space:nowrap; overflow: hidden }
.mbest_word li span {vertical-align:middle; margin-top:-2px}
.mbest_word li span.lank {margin:-2px 2px 0 0}
.mbest_word li span.lank span { position:fixed; top:-9999px; left:-9999px}
span.lank{ color:#999 !important}
span.bdiv1, span.bdiv2, span.bdiv3, span.bdiv4, span.bdiv5, span.bdiv6, span.bdiv7, span.bdiv8, span.bdiv9 { display:inline-block; width: 17px; height: 17px;text-indent:-9999px; color:#60a4c3; font-size:1px; overflow: hidden; border-radius: 3px; background:#60a4c3 url(../images/icon_bdiv.png)no-repeat 0 0}
span.bdiv2 { background: #de9c2a url(../images/icon_bdiv.png)no-repeat 0 -23px;color:#de9c2a}
span.bdiv3 { background: #99b25e url(../images/icon_bdiv.png)no-repeat 0 -46px;color:#99b25e}
span.bdiv4 { background: #ffa100 url(../images/icon_bdiv.png)no-repeat 0 -69px;color:#ffa100}
span.bdiv5 { background: #f69292 url(../images/icon_bdiv.png)no-repeat 0 -92px;color:#f69292}
span.bdiv6 { background: #6e7fca url(../images/icon_bdiv.png)no-repeat 0px -108px;color:#6e7fca}
span.bdiv7 { background: #c584d5 url(../images/icon_bdiv.png)no-repeat 0px -124px;color:#c584d5  }
span.bdiv8 { background: #ec8363 url(../images/icon_bdiv.png)no-repeat 0px -140px;color:#ec8363}
span.bdiv9 { background: #74b591 url(../images/icon_bdiv.png)no-repeat 0px -156px;color:#74b591}

.bdiv_ex { border:1px solid #ddd; padding:8px 12px 12px 12px; margin:15px 0 0 0; border-radius:8px; background:#f9f9f9}
.bdiv_ex h4 { font-weight:600; color:#717171; border-bottom:1px dotted #ddd; padding:0 0 5px 0; margin:0 0 8px 0}

.sbest_word { width:50%; float:right; height:22px; overflow:hidden; margin:10px 0 0 0; padding-left:15px; border-left: solid 1px #ddd}
.sbest_word h3 { float:left;}
.sbest_word ul { float:left; width:100%; padding:2px 0 0 3%; text-align:left}
.sbest_word ul li {padding:0 0 3px 0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}

.sbest_word a.btn_more { display:block; width:19px; height:19px; border:solid 1px #ddd; font-size:1px; color:#ededed; float:right; text-indent:-9999px; overflow:hidden; background:#ededed url(../images/btn_more2.png) no-repeat 2px 2px}
.sbest_word a.btn_more:hover, .sbest_word a.btn_more:focus { color:#0d74a8; background:#0d74a8 url(../images/btn_more2.png) no-repeat -28px 2px;border: solid 1px #0d74a8}


.scroll-text { width:155px; padding-left:10px ; overflow:hidden; height:4.5em; float:left}


.scroll3 a.btn_close { display:block; width:19px; height:19px; border:solid 1px #ddd; font-size:1px; color:#ededed; float:right; text-indent:-9999px; overflow:hidden; background:#ededed url(../images/btn_more2.png) no-repeat 2px -12px; position:absolute; right:15px; top:15px}
.scroll3 a.btn_close:hover, .scroll3 a.btn_close:focus { color:#717171; background:#717171 url(../images/btn_more2.png) no-repeat -13px -12px;border: solid 1px #717171}


.sbest_word li span,
.sbest_word li a {vertical-align:top}

.scroll3 { width:240px; padding:15px; text-align:left; position:absolute; right:0; top:37px; display:none; border: solid #ddd 1px; border-radius:8px; box-shadow:#ddd 0 2px 3px; background:#fff}
.scroll3 li a { display:block; width:100%; padding:3px 0; vertical-align:top}
.scroll3 li span {vertical-align:top}


/* 자동완성 */
body.main ul.ui-autocomplete {width: 330px;}
body.sub ul.ui-autocomplete {width: 245px;}
a.auto-list{height: 22px; padding: 6px 0 0 6px;}
a.auto-list > span.highlight{color:red; vertical-align: top; line-height: 1.7;  }
li.ui-menu-item{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
li.ui-menu-item a.auto-list{width:100%; text-decoration: none; min-height: 0; font-weight: normal; vertical-align: top; line-height: 1.7; overflow: hidden;}
a.ui-state-focus > span.highlight{color:#fff;}

/* sub */
.snb { width:20%; float:left}
.content { width:75%; float:right}

/* a00 검색부분 */
.top_search { position:relative; width:57%; float:right; z-index:50; text-align:right}

/* .top_search ul { float:left; padding-bottom:20px;margin-bottom:-20px} */
.top_search form {}
.top_search input[type="text"] { border:#999 solid 3px;  font-size:14px; padding:7px; height:16px;line-height:1.2; position: static; z-index:100 }

.top_search form a { display:inline-block; padding:9px 20px; height:18px;line-height:1.2; background:#717171; border:none; color:#fff; font-size:14px;position: static; z-index:200 }
.top_search form a.btn_search2{font-size:0; background: #717171 url(../images/icon_search_20.png) no-repeat center 8px / 20px;}
.top_search form a.btn_reset { margin:0;  padding-left:40px; background:#717171 url(../images/btn_reset.png) no-repeat 8px 9px }
.top_search form a.btn_reset:hover, .top_search form a.btn_reset:focus { background:#333 url(../images/btn_reset.png) no-repeat 8px 9px }
.top_search form a:hover, .top_search form a:focus { background-color:#333}
.top_search input[type="text"] { width:35%; margin:0 -4px 0 129px}
.k00 .top_search input[type="text"] { width:90%}
.top_search input[type="text"]:hover,
.top_search input[type="text"]:focus { border:#333 solid 3px; }
.top_search input[type="submit"] { border:none; font-size:14px; background:#ddd; margin:0 0 0 -4px; padding:8px 20px}

.top_search .search_select{width:22.7%; top:0;}

.s_search_txt,
a.btn_search2  { float:left}
.top_search form a.btn_detail_search {*zoom:1; background:#1d89c0}
.top_search form a.btn_detail_search:hover,
.top_search form a.btn_detail_search:focus { background:#0d74a8}
.top_search form a.btn_detail_search:after { display:block; content:""}

/* a00 상세검색 부분 20200506 추가 */

.popup_content .search_select{position:inherit; border: solid 1px #ddd; width:180px; }
.popup_content .search_select:hover{border: solid 1px #ddd;}
.popup_content .search_div{display:none;}
.popup_content .selectSearch{display:flex;}

.table_82 tbody th.bgnone{background-color:inherit;}


.book_type_wrap { display:block ; clear:both; float:left; padding:10px 0;}

.book_info { border-top:#CCC solid 1px ; padding:15px 0; margin:-18px 0 0 0}
.book_info h4 { font-size:18px; font-weight:600px; line-height:1.3em; clear:both}
.book_info .h4_no { font-size: 18px; color:#777}
.a20 .book_info h4 { display:inline-block;}
.book_info h5 { color:#666; font-size:16px; font-weight: normal; line-height:1.3em; padding:3px 0 0 0}

.book_info>li { border-bottom:#ededed solid 1px; padding:20px 0; overflow:hidden}
.book_info > li input:nth-child(8) + .book_cover, .book_info > li > ul + .book_cover, .book_info2 > ul + .book_cover{margin-top:18px;}
/* 단행본,비도서/연속간행물/다른권호더보기 페이지 book_cover마진값 변경 */

.book_info ul { padding:5px 0; width:60%}
.book_info ul:after { content:""; display:block; clear:both; *zoom:1}
.book_info ul li { display:inline-block;  float:left; padding: 0 10px 2px 0; color:#999}
.book_info ul li.writer,
.book_info ul li.publisher { height:14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.book_info ul li.writer {max-width:40%; }
.book_info ul li.publisher {max-width:40%; }
.book_info ul li:first-child:before { display:none}
.book_info ul li:before { display:block; width:1px; height:10px; content:""; background:#ddd; margin:2px 10px 0 0; float:left }

.book_info ul.actor_info li{width:95%; display:block; height:20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.book_info dl { overflow:hidden; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; line-height:1.2; color:#717171; padding:10px 0; margin:10px 0 10px -1% ; border-top:#ededed dotted 1px; border-bottom:#ededed dotted 1px;}
.book_info dl dt:before { display:block; width:3px; height:3px; content:""; background:#85bfec; margin:4px 6px 0 0; float:left }
.book_info dl dt,
.book_info dl dd { float:left;width:11%; padding:4px 0.5%}
.book_info dl dt { font-weight: bold; color:#999; padding: 4px 1%; letter-spacing:-1px}
.book_info dl dd { width:18% }

.book_info p { color:#999; line-height:1.5em}
/* .book_cover { float:left; margin:48px 0 0 0;width:82px; border: 1px solid #ededed ; padding:4px; background:#fff; box-shadow:#dedede 0 2px 2px; border-radius:5px; background: #fff } */
.book_cover img { padding:0 0 5px 0; width:82px; height:120px;}
.subject_code_image {display:block; text-align:center; color:#1d89c0; padding:6px; font-size:12px; border-top: dotted 1px #eee}

.book_cover { float:left; margin:36px 0 0 0; width:82px; height:120px; border: 1px solid #ededed; padding:4px; background:#fff; border-radius:5px; box-shadow:#dedede 0 2px 2px; }
.a10 .table_80 { width:85%; float:right; margin-top:13px}
.a20 .table_80 { width:85%; float:right; margin-top:13px}
.book_info table.table_80 { margin-top:20px}

input.btn_abs,
input.btn_con { border:none; background:#888 url(../images/btn_more3.png) no-repeat right 9px; padding:6px 24px 7px 14px; float:right; color:#fff; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif; font-size:13px}
input.btn_abs:hover,
input.btn_abs:focus,
input.btn_con:hover,
input.btn_con:focus {background:#777 url(../images/btn_more3.png) no-repeat right -21px;}

input.btn_close2 { border:none; background:#888 url(../images/btn_more3.png) no-repeat right -50px; padding:6px 24px 7px 14px; float:right; color:#fff; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif; font-size:13px}
input.btn_close2:focus,
input.btn_close2:hover {background:#777 url(../images/btn_more3.png) no-repeat right -80px;}


span.textoverflow1 { display:block; width:510px; text-overflow:ellipsis;overflow:hidden;white-space:nowrap}

/* */
.book_info2 { margin:-40px 0 0 0}
.book_info2 h4 { font-size:18px; font-weight:600px; line-height:1.3em; clear:both}

.book_info2 ul { padding:5px 0; width:80%; overflow:hidden}
.book_info2 ul li { float:left; padding: 0 10px 0 0; color:#999}
.book_info2 ul li:first-child:before { display:none}
.book_info2 ul li:before { display:block; width:1px; height:10px; content:""; background:#ddd; margin:2px 10px 0 0; float:left }
.book_info2 .table_80 { width:82%; float:right; margin-top:20px}



/* music_info */

.music_info { border-top:#CCC solid 1px ; padding:15px 0; margin:-18px 0 0 0}
.music_info h4 { font-size:17px; font-weight:600px; line-height:1.3em; clear:both}
.music_info h5 { color:#666; font-size:16px; font-weight: normal; line-height:1.3em; padding:3px 0 0 0}

.music_info ul:after { content:""; display:block; clear:both; *zoom:1}
.music_info ul li { display:inline-block; color:#999}

.music_info ul li:first-child:before { display:none}
.music_info ul li:before { display:block; width:1px; height:10px; content:""; background:#ddd; margin:2px 10px 0 0; float:left }

.music_info > li{border:1px solid #ccc; padding:0; background-color:#fff; margin-bottom:6px;}
.music_info span{margin-left:13px; font-size:14px; color:#777;}
.music_info div ul li{ padding-bottom:5px;  font-size:13px;}
.music_info ul { width:80%; padding-bottom:5px; }
.music_info ul.maker li:before{ display: block; width: 1px;  height: 10px;  content: "";  background: #ddd;  margin: 2px 10px 0 0;  float: left;}
.music_info div ul.music_time > li:nth-child(3),.music_info div ul.music_time > li:nth-child(4){display: inline-block;}
#content ul:nth-child(3) div ul.music_time > li{display: block;}
.music_info div ul.music_tag li{padding-bottom:4px; padding-right:5px;}
.music_info div ul.music_time li{padding-bottom:0;}

.music_info > li > div{padding:0 0 0 10px; width:79%; display: inline-block;}
.music_info .music_tag, .music_info .music_time{ width:47%; float:left; padding:0;}
.music_info .music_tag{width:58%;}
.music_info .music_time{width:42%;}
.music_info .music_tag li a{text-decoration-line: underline; color:#1d89c0; cursor: pointer;}
.music_info .music_tag li a:hover, .music_info .music_tag li a:focus{font-weight: 500;}
.music_info .music_tag li:before, .music_info .music_time li:before {display:none;}
.music_info li img::before{display:block; content:""; width:auto; height:300px; }
.music_info li img{width:116px; border-right:1px solid #ccc; height: 110px; overflow: hidden;}
.music_info .music_time{position: relative; float: right; padding:0}
.music_info .music_time li{color:#333; font-weight: 700;}

.music_info div ul li.barimage{font-size: 0;}
.barimage:after{content:""; display:block; background:url(../images/barimage.png) no-repeat 0 5px / 120px; width:120px; height:10px;}

.music_time li:last-child{cursor: pointer; }
/* .play{background-color: inherit; font-size: 0; padding: 0; border:0;}
.play::after{content:""; display:block; cursor: pointer; width:30px; height:30px; background: url(../images/playbutton.png) no-repeat center / 17px; ;} */

.holder.touchOn .controls__current-time, .holder.touchOn .controls__slider.slider{display:block;}

.holder.touchOn .green-audio-player .controls span{position: inherit;}
.controls__current-time, .controls__slider.slider{display:none;}
.controls__total-time{position: absolute; right:30px;}
.displayBlock{display:block;}


/* video_info */
.video_info{border-top: #CCC solid 1px; padding: 15px 0; margin: -18px 0 0 0;}
.video_info > li{border: 1px solid #ccc;  cursor:pointer;  padding: 0; background-color: #fff; margin-bottom: 6px; overflow: hidden;}
.video_info > li:hover,.video_info > li:focus{border:1px solid #444;}
.video_info > li > a{display:inline-block; width:15%; height:110px; background-size: cover; background-position: top;}
.video_info li img::before{display:block; content:""; width:auto; height:300px; }
.video_info li img{width:116px; border-right:1px solid #ccc; height: 110px; overflow: hidden;}
.video_info > li > div{padding-left: 8px; width: 79%; display: inline-block;}
.video_info em{display:inline-block;background-color:#444; padding:3px 4px; color:#fff; font-style: unset; margin-bottom:3px; font-size:12px;}
.video_info h4{ font-size: 16px; padding-bottom:3px; line-height: 1.3em;}
.video_info  span{margin-left:13px; font-size:14px; color:#777;}
.video_info div ul li{  padding: 0 10px 5px 0;font-size:13px; color: #999; float: left; display: inline-block; }
.video_info div ul li:hover, .video_info div ul li:focus{color:#999;}
.video_info ul.maker li:before{    display: block; width: 1px;  height: 10px;  content: "";  background: #ddd;  margin: 2px 10px 0 0;  float: left;}
.video_info ul:after {content: "";  display: block;  clear: both; *zoom: 1;}
.video_info ul li:first-child:before{display:none;}
.video_info ul.video_tag{padding-top:7px;}
.video_info ul.video_tag li a{text-decoration-line: underline; color:#1d89c0; cursor: pointer;}
.video_info ul.video_tag li a:hover, .video_info ul.video_tag li a:focus{font-weight: 500;}
.video_open{width:100%; height:360px; border: 1px solid #efefef; background-color:#444; margin: 2px 0 10px 0; position: relative;}
.video_open video{position: absolute; left:15%;}
.video_openWrap{width:470px; padding:15px; background-color:#000; position: absolute; bottom:0; left:15%;}
.video_openWrap h5{color:#fff; font-size:16px; font-weigh:normal; line-height:1.3em; padding:3px 0 0 0;}
.video_open{display:none;}

a.btn_more2 { padding:4px 40px 4px 10px; margin-left:12px; color:#ededed;  background:#898989 url(../images/deco_arrow_10.gif) no-repeat 92% 8px;border: solid 1px #717171}
a.btn_more2:hover, a.btn_more2:focus { color:#fff; background-color:#717171;border: solid 1px #717171}


/* document_info */
.document_info{border-top: #CCC solid 1px; padding: 15px 0; margin: -18px 0 0 0;}
.document_info > li{ padding: 0; margin-bottom: 6px; border-bottom: 1px solid #ccc;  overflow: hidden;}
.document_info > li > div{padding: 10px 0; }
.document_info > li:last-child{border-bottom:0;}
.document_info em{display:inline-block;background-color:#444; padding:3px 4px; color:#fff; font-style: unset; margin-bottom:3px; font-size:12px;}
.document_info h4{ font-size: 16px; padding-bottom:3px; line-height: 1.3em;}
.document_info  span{margin-left:13px; font-size:14px; color:#777;}
.document_info div ul li{  padding: 0 10px 5px 0;font-size:13px; color: #999; float: left; display: inline-block; }
.document_info ul.maker li:before{    display: block; width: 1px;  height: 10px;  content: "";  background: #ddd;  margin: 2px 10px 0 0;  float: left;}
.document_info ul:after {content: "";  display: block;  clear: both; *zoom: 1;}
.document_info ul li:first-child:before{display:none;}
.document_info ul.document_tag{padding-top:7px;}
.document_info ul.document_tag li a{text-decoration-line: underline; color:#1d89c0; cursor: pointer;}
.document_info ul.document_tag li a:hover, .document_info ul.document_tag li a:focus{font-weight: 500;}
.document_info_open{width:100%; height:360px; border: 1px solid #efefef; background-color:#444; margin: 2px 0 10px 0; position: relative;}
.document_info_open video{position: absolute; left:15%;}
.document_info_openWrap{width:470px; padding:15px; background-color:#000; position: absolute; bottom:0; left:15%;}
.document_info_openWrap h5{color:#fff; font-size:16px; font-weight:normal; line-height:1.3em; padding:3px 0 0 0;}
.document_info_open{display:none;}

/* image_info */

body.imageSearch #content{width:100%;}
body.fix {overflow: hidden}
.imgSection {font-size: 0}
.imgSection .img_content{width:25%; vertical-align: top; display: inline-block; transition: all 0.2s ease 0.1s;}
.imgSection .img_content.on {margin-bottom: 540px}
.imgSection .img_content a{display:block;margin:5px; height:200px; position: relative; background:center; background-size: cover;  }
.imgSection .img_content a:hover, .imgSection .img_content a:focus{
    outline:2px solid #141518;
}
.imgSection .img_content a img{width:100%; background:url(http://172.16.31.134:3000/ca461cd0-c024-42be-a698-1ac47db4d45b/1111) no-repeat cover;}
.img_guide{display: none; position:absolute; bottom:0; width:100%; font-size:11px; padding:10px 0; letter-spacing: .2px; line-height:14px; color:#fff; background:#141518d6; }

.img_guide dt{padding:6px 0;}
.img_guide dt, .img_guide dd{padding-right:10px; padding-left: 10px;}
.img_guide dd{display:inline-block;}
.img_guide dd:last-child{float: right;}

.img_open{width:100%;position: fixed; left:0; top:210px; height:680px; background:#141518;z-index:1000; display:none; }
.img_open .closeBtn{position: absolute; top:20px; right:30px;}
.myImage{text-align: center; padding-top:20px; }
.myImage img{max-height: 540px; max-width: 100%}
.image_openGuide{width:100%; padding:20px; color:#fff; max-width:950px; margin:0 auto;}
.image_openGuide h5{font-size:20px; padding:6px 0 6px; font-weight: 500;}
.image_openGuide ul.openGuide_txt li{display: inline-block; margin-right: 4px;}
.image_openGuide ul.openGuide_txt li:before{display: block; width: 1px;  height: 10px;  content: "";  background: #909090;  margin: 3px 10px 0 0;  float: left;}
.image_openGuide ul.openGuide_txt li:first-child:before{display:none;}
.openGuide_txt{padding-bottom:6px; color:#909090;}
.image_tag{padding:6px 0 20px;}
.image_tag li{display: inline-block; padding-right: 10px; font-size:15px; }
.image_tag li a{text-decoration: underline; color:#f3f3f3}
.image_tag li a:hover, .image_tag li a:focus{color: #ffc600;}

.closeBtn a, a.closeBtn {display:block; position:absolute; right: 12px; top:12px; width:35px; height:35px; overflow:hidden; text-indent:-9999px; font-size:0; background:#f6f6f6 url(../images/btn_close_10.gif) no-repeat 8px 8px; border:#ededed solid 1px}
.closeBtn a:hover,.closeBtn a:focus,
a.closeBtn:hover,a.closeBtn:focus {border: solid 1px #777; background:#777 url(../images/btn_close_10.gif) no-repeat 8px -13px }

#detailSearchForm { display: none}
#detailSearch {width:735px; height:350px; margin-bottom:30px; background:#fff; border:solid 1px #0d74a8; position:absolute; top:160px; left:50%; margin-left:-245px; z-index:100;box-shadow:#e3e3e3 0 2px 2px;}
.popup_content h3 { font-size:17px; font-weight:normal; background:#0d74a8; color:#fff; padding:15px}

.search_div {  padding:15px}

.serch_in_search_wrap { margin: -40px 0 17px 0; background: #efefef; border:solid 1px #ccc; color: #717171; padding: 12px 3%; text-align:right}
.serch_in_search_wrap label { font-size:14px; padding:0 10px 0 0; color:#333}
.serch_in_search_wrap input[type="text"] { border:none; line-height:1.2em; padding:6px; background:#fff; width:200px; border: solid 1px #ddd }
.serch_in_search_wrap input[type="text"]:focus,
.serch_in_search_wrap input[type="text"]:hover { background:#fff; border: solid 1px #aaa}
.serch_in_search_wrap input[type="button"] { line-height:2em; border:none; background:#aaa; color:#fff}
.serch_in_search_wrap input[type="button"]:focus,
.serch_in_search_wrap input[type="button"]:hover {background:#777; color:#fff}

.serch_in_search_wrap input.btn_on { line-height:2em; border:none; background:#1d89c0; color:#fff}

.serch_in_search_wrap select { padding:5px; border:none}

#addressInput_div { line-height: 1.5em; font-size: 14px; padding:10px 5%}
#addressInput_div strong { font-weight: 600}
#addressInput_div label { color: #999}
#jibunAddr:after { display: block; content: ""; clear: both; height:4px}

.keyword_result { border: solid 1px #1d89c0; margin:-40px 0 50px 0; overflow:hidden; background:#fff; font-size:14px; position:relative}
.keyword_result:before { display:block; width:20%; height:100px; content:"";background:#1d89c0; position:absolute; top:0; left:0; z-index:90 }
.keyword_result h4 { width: 17%; padding:10px 0 10px 3%; float:left; font-weight:normal; color:#fff; font-size:16px; line-height:1.5em ; position:relative; z-index:91}
.keyword_result dl { width:78%; float:right; padding:10px 0; line-height:1.5em }
.keyword_result dt,
.keyword_result dd { float:left; padding:0 3px; color:#999}
.keyword_result dd { color:#2a8ec7; font-weight:600}
.keyword_result dt:before { padding: 0 4px 0 2px; display:inline; content:"/"; color:#ddd}
.keyword_result dt:first-child:before { display:none}

#print_status_alert p{ background:url(../images/print_ani.gif) no-repeat 10px 30px; padding:75px 0 60px 120px; line-height: 1.5em; font-size: 14px; color: #666 }

.serch_in_search { float:left; text-align:left}
.display:before { display:inline-block; content:""; width:1px; height:22px; background:#ccc; margin:0 10px -5px 10px  }

.result { color:red ; vertical-align:top; font-weight:600}

#login-dialog p { padding:20px 0 10px 0}
#login-dialog dl { outline:#ddd solid 1px; overflow:hidden; padding:10px 0 10px 32%; background: #f6f6f6 url(../images/icon_login1.png) no-repeat 15px 15px}
#login-dialog dt { width: 28%; height:22px; padding:10px 4.5% 5px 4.5%; float:left}
#login-dialog dd { width: 52%; height:27px; padding:5px 2% 5px 4.5%; float:left}
#login-dialog dd input { border:1px solid #aaa; padding:3px 5%; width: 90%}
#login-dialog dd .input_20 { border:1px solid #aaa; padding:3px 5%; width: 20%}
#login-dialog dd .input_15 { border:1px solid #aaa; padding:3px 5%; width: 15%}
#login-dialog dd input:hover,
#login-dialog dd input:focus {border:1px solid #ffc600}


.ui-widget-content a.btn_login2 { display:block; padding:15px 0; text-align:center; margin:15px 0; background: #717171; color:#fff}
.ui-widget-content a.btn_login2:hover,
.ui-widget-content a.btn_login2:focus { background: #555}

/* c00 회원가입 */

.login_wrap { background:#fff url(../images/bg_login.png) no-repeat 10% 40px; padding:40px 5% 30px 28%; overflow:hidden; border:#ededed solid 1px; box-shadow:#ededed 0 2px 2px; border-radius:10px; position:relative }
.login_wrap dl { overflow:hidden; padding:0 0 15px 0}
.login_wrap dt,
.login_wrap dd { float:left; width:21%; padding:8px 0 0 0}
.login_wrap dd  { width:58.8%; padding:0 0 8px 0}
.login_wrap.custom dt{ width:33%}
.login_wrap.custom dd{ width:46.5%}
.login_wrap dd input[type="text"],
.login_wrap dd input[type="password"] { border:#ddd solid 1px; background:#f9f9f9; padding:5px; width:100%; height:16px;}
.login_wrap dd input[type="text"][class="input_20"]  {width:20%}
.login_wrap dd input[type="text"]:hover, .login_wrap dd input[type="text"]:focus,
.login_wrap dd input[type="password"]:hover, .login_wrap dd input[type="password"]:focus { border:#aaa solid 1px}

a.btn_login { display:block; width:80px; height:39px; text-align:center; background:#717171; color:#fff; padding:25px 0 0 0; position:absolute; top:40px; right:5%}
a.btn_login:hover,
a.btn_login:focus { background:#333; color:#fff}

a.btn_login3 { display:block; width:80px; height:58px; text-align:center; background:#717171; color:#fff; padding:40px 0 0 0; position:absolute; top:40px; right:5%}
a.btn_login3:hover,
a.btn_login3:focus { background:#333; color:#fff}

.btn_join { border-top: dotted 1px #ccc; padding:25px 0 15px 0; clear:both; text-align:right}
.btn_join a { padding:7px 25px; background:#999; border-radius:4px; line-height:1.3em; color:#fff }
.btn_join a:hover, .btn_join a:focus { background:#666; color:#fff}

/* 미인증 약관동의 */

.agree_step_nocerti li { display:block; width:33%; float:left; color:#767676; padding:0 0 5px 0; line-height:1.4em; position:relative}
.agree_step_nocerti li span { display:block}
.agree_step_nocerti li .st:after { display:block; content:""; height:8px; background:#666; border-right:#fff solid 1px; margin:8px 0}

.agree_step_nocerti li.on { color:#000}
.agree_step_nocerti li.on .st:before { display:inline; content:"ON"; padding:0 7px; background:#ffc600; color:#fff; font-size:11px; position:absolute; left:55px; top:0 }
.agree_step_nocerti li.on .st:after { background:#ffc600}

/* 회원가입 */

.step li { display:block; width:20%; float:left; color:#767676; padding:0 0 5px 0; line-height:1.4em; position:relative}
.step li span { display:block}
.step li .st:after { display:block; content:""; height:8px; background:#666; border-right:#fff solid 1px; margin:8px 0}

.step li.on { color:#000}
.step li.on .st:before { display:inline; content:"ON"; padding:0 7px; background:#ffc600; color:#fff; font-size:11px; position:absolute; left:55px; top:0 }
.step li.on .st:after { background:#ffc600}

#step_newonly li {width:25%;}

.agree_step li { display:block; width:25%; float:left; color:#767676; padding:0 0 5px 0; line-height:1.4em; position:relative}
.agree_step li span { display:block}
.agree_step li .st:after { display:block; content:""; height:8px; background:#666; border-right:#fff solid 1px; margin:8px 0}

.agree_step li.on { color:#000}
.agree_step li.on .st:before { display:inline; content:"ON"; padding:0 7px; background:#ffc600; color:#fff; font-size:11px; position:absolute; left:55px; top:0 }
.agree_step li.on .st:after { background:#ffc600}

.b10_menu { overflow: hidden;}
.b10_menu div { width: 30%; padding:0 0 0 3%; margin:10px 0; float: left; border-left: solid 1px #ededed }
.b10_div1 div { width:95.5%}
.b10_div2 div { width:47%}
.b10_div4 div { width:24.5%}

.b10_menu div:first-child { border: none; padding:0}

.b10_menu a { display:block; width:100%; overflow:hidden; float:left; background:url(../images/btn_b20.png) no-repeat 0 0; padding:150px 0 20px 0; font-size:26px; color:#666}
.b10_menu a:hover {color:#ffc600; color:#000}
.b10_menu div:nth-child(2) a{background-image:url(../images/btn_b30.png)}
.b10_menu div:nth-child(3) a{background-image:url(../images/btn_b10.png)}
.b10_menu a span { display:block; width:65%; font-size:12px; color:#666; background:#ffc600 url(../images/deco_arrow_10.gif) no-repeat 95% 7px; padding:5px 10px; margin:10px 0 0 0 }

.b10_menu a:hover span, .b10_menu a:focus span { background:#333 url(../images/deco_arrow_10.gif) no-repeat 97% 7px; padding:5px 10px; color:#ffc600}

.b10_menu .aside { line-height:1.3em; padding:5px 0; color:#717171; font-size:12px}
.b10_menu .aside.en:before { display:block; content:""; width:20px; height:1px; background:#ffc600; margin: 3px 0 10px 0}

.select_during {}
.select_during input[type="button"] { border:none; background: #70a8bf; color: #fff; padding:8px 40px; font-size:13px; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
.select_during>input[type="button"] {width:16.5%; float:left; line-height: 2em; margin-right: 1px}
.select_during input[type="button"]:hover,
.select_during input[type="button"]:focus { background:#666; color:#ffe241}

.select_during form { display:block;  padding:15px 0; text-align: right; clear: both;}
.select_during form input[type=text] { border: solid 1px #ddd; background:#f6f6f6; padding:5px 10px ; vertical-align:middle; line-height:1.2em}
.select_during form input[type=button] { padding:5px 10px; font-size:13px; line-height:1.4em; background:#1d89c0}
.select_during form input[type=button]:hover,
.select_during form input[type=button]:focus {background:#0d74a8; color:#fff}
.select_during form button[type=button] {border: none; padding:5px 20px ; background:#717171 url(../images/icon_calendar.png) no-repeat center center; color:#717171; vertical-align:middle; font-size:13px; line-height:1.4em}
.select_during form button[type=button]:hover,
.select_during form button[type=button]:focus {background:#444 url(../images/icon_calendar.png) no-repeat center center}

.icon_check1 { display:inline-block; width:22px; height:16px; overflow:hidden; text-indent:-9999px; background:url(../images/icon_check1.png) no-repeat 0 0}
.member_id { width:20%}

#address_div { padding:10px 0 0 0}
.adress_keyword_wrap { border:#ddd solid 1px; position:relative; margin:5px 0; padding:14px 0 0 5%; background:#f9f9f9}
.adress_keyword_wrap:before { display:block; content:""; width:30px; height:3px; background:#ffc600; position:absolute; top:0; left:0}

.adress_keyword_wrap input { height:33px; color:#fff; background:#75777b;line-height:1.3em ; outline:#75777b solid 1px;border:none; font-size:16px; font-weight:normal; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
.adress_keyword_wrap input[type="text"] { width:44%; padding:0 0 0 4%; margin-left:3%; background:#bbb;font-weight:600}

.adress_keyword_wrap input[type="button"],
#addressInput_div input[type="button"] { width:13%; margin-left:-3px; border-left:#666 solid 1px}
.adress_keyword_wrap input[type="button"]:hover,
.adress_keyword_wrap input[type="button"]:focus,
#addressInput_div input[type="button"]:hover,
#addressInput_div input[type="button"]:focus { background:#000}

#addressInput_div input[type="button"] {width:15%; padding:4px 0 0 0;background:#bbb;height:26px; color:#fff; font-weight:bold; outline:#75777b solid 1px;border:none; vertical-align: middle; font-size: 12px}
.adress_keyword_ex { color: #999; padding: 14px 0; margin:14px 0 0; border-top: dotted 1px #ddd}

/* side navigation bar */

.limits {  color:#fff; overflow:hidden; padding:10px; margin:20px 0 0; border-radius:14px  0; box-shadow: #ddd 0px 2px 3px;
    background:#717171;
    background: -moz-linear-gradient(top,  #8a8a8a 0%, #717171 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a8a8a), color-stop(100%,#717171));
    background: -webkit-linear-gradient(top,  #8a8a8a 0%,#717171 100%);
    background: -o-linear-gradient(top,  #8a8a8a 0%,#717171 100%);
    background: -ms-linear-gradient(top,  #8a8a8a 0%,#717171 100%);
    background: linear-gradient(to bottom,  #8a8a8a 0%,#717171 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8a8a', endColorstr='#717171',GradientType=0 )
}
.limits h3 { padding:8px 0; font-size:16px; font-weight:normal; border-bottom: dotted 1px #999999}
.limits ul { padding:10px 0 0 0}
.limits li { padding:2px 0; color:#ddd; line-height:1.2em; overflow:hidden}
.limits li span { float:left}
.limits li a { float:right; color:#fff; display:block; width:12px; height:12px; text-indent:-9999px; overflow:hidden; background:url(../images/btn_del2.png) no-repeat -1px -1px; border:#c1c1c1 solid 1px
;border-radius:2px}
.limits li a:hover, .limits li a:focus { background-color:#333; border:#333 solid 1px }

.snb h2 { font-size:24px; font-weight:600; color:#000; padding:0 0 15px 0; line-height:1.1em}

.snb_menu {margin:20px 0 0; padding:12px 0 8px}
.snb_menu li {padding:5px 0}
.snb_menu li:before { display:block; content:""; width:4px; height:4px; background:#ffc600; float:left; margin:6px 7px 0 5px }
.snb_menu li a {font-size:14px}
.b10 .snb_menu li.snb_10 a,
.b20 .snb_menu li.snb_20 a,
.b30 .snb_menu li.snb_30 a,
.b40 .snb_menu li.snb_40 a,
.b50 .snb_menu li.snb_50 a,
.b60 .snb_menu li.snb_60 a,
.b70 .snb_menu li.snb_70 a,
.b80 .snb_menu li.snb_80 a,
.b90 .snb_menu li.snb_90 a,
.b100 .snb_menu li.snb_100 a,
.b110 .snb_menu li.snb_110 a { color:#ffc600}

.snb_li h3 { margin:20px 0 0; padding:12px 0 8px; font-size:16px; font-weight:normal; border-top:#ededed solid 1px}
.snb_li h3:first-child { border:none}
.snb_li li { padding:3px 0 3px 9px; text-indent:0;  line-height:1.3em}
.snb_li li:before { display:block; content:""; width:3px; height:3px; background:#ffc600; float:left; margin:8px 5px 0 -7px }

.snb_li li.all_view { padding:0 0 10px }
.snb_li li.all_view a{ display:block; float:right; width:15px; height:15px; text-indent:-9999px; border:#ddd solid 1px; background:#ededed url(../images/btn_more2.png) no-repeat 0 0; margin:0 0 0 7px; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; color:#888}
.snb_li li.all_view a:hover, .snb_li li.all_view a:focus {  background:#717171 url(../images/btn_more2.png) no-repeat -30px 0;border: solid 1px #717171}
.snb_li li.all_view:before { display:none}

.snb_li li.min_view { padding:0 0 10px }
.snb_li li.min_view a{ display:block; float:right; width:14px; height:14px; text-indent:-9999px; border:#ddd solid 1px; background:#ededed url(../images/btn_more2.png) no-repeat 0 -15px; margin:0 0 0 7px; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; color:#888}
.snb_li li.min_view a:hover, .snb_li li.min_view a:focus {background:#717171 url(../images/btn_more2.png) no-repeat -15px -15px;border: solid 1px #717171}
.snb_li li.min_view:before { display:none}


.snb_li a { color:#666}
.snb_li a:hover, .snb_li a:focus { color:#f60}


.h2_en { background:#ffc600; color:#666;  font-size:13px; padding:5px 3px 5px 6px; font-weight:normal; margin:15px 0}

.bg_10 {display:block; height:200px;}
.a00 .bg_10 { display:block; height:200px; background:url(../images/btn_a10.png) no-repeat 0 40px }
.b00 .bg_10 { display:block; height:200px; background:url(../images/btn_b30.png) no-repeat 0 40px }
.b00.b20 .bg_10 { background-image:url(../images/btn_b20.png) }
.b00.b30 .bg_10 { background-image:url(../images/btn_b30.png) }
.c00 .bg_10 { display:block; height:200px; background:url(../images/btn_c10.png) no-repeat 0 40px }
.d00 .bg_10 { display:block; height:200px; background:url(../images/btn_d10.png) no-repeat 0 40px }
.x00 .bg_10 { display:block; height:200px; background:url(../images/btn_x00.png) no-repeat 0 40px }


.snb p { color:#717171; line-height:1.3em; padding:5px 0}
.snb .en:before { display:block; content:""; width:20px; height:1px; background:#ffc600; margin: 3px 0 10px 0}

.content h3  { font-size:21px; font-weight:normal; margin:0 0 70px 0}
.content h3 strong{ font-weight:600; vertical-align:top }

/* .content h3 span { font-size:13px; color:#767676} */
.content h3 span { padding:0 0 0 15px;  vertical-align: baseline; color:#ffc600}
.content h3 span:before {}
.x00 .content h3 span { display:none}

.h_40 { font-size:16px; color:#000; margin:15px 0 5px; font-weight: normal}

.h_42_error {border:#ededed solid 1px; position:relative; margin:20px 0; padding:100px 0; text-align:center; background:#fff url(../images/bg_10_24.png) no-repeat 15% 30px; text-indent:15%}
.h_42_error:before {display:block; content:""; width:30px; height:3px; background:#ffc600; position:absolute; top:0; left:0}

.textarea_10 { width:95.5%; height:120px; padding:8px 2%; margin:8px 0; line-height:1.4em; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; color:#717171}

/* .agree { text-align:right; padding:0 0 10px 0 ; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; color:#717171} */
.agree { text-align:right; padding:0 0 10px 0 ; font-size:14px; color:#717171}
.agree_all { font-size:14px; color:#598db5; margin:40px 0 20px 0}

.b10_20_input { border:#ededed solid 1px; height:84px; position:relative; margin:20px 0; background:#fff}
.b10_20_input:before { display:block; content:""; width:30px; height:3px; background:#ffc600; position:absolute; top:0; left:0}
.b10_20_input input { position:absolute; top:24px; height:33px; color:#fff; background:#75777b;line-height:1.3em ; outline:#75777b solid 1px;border:none; font-size:16px; font-weight:normal; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
.b10_20_input input[type="text"],
.b10_20_input input[type="password"] { width:89%; padding:0 0 0 3%; left:4%;background:#bbb}
.b10_20_input input[type="text"] { font-weight:600}
.b10_20_input input[type="submit"] { width:20%;right:30px; border-left:#666 solid 1px}
.b10_20_input input[type="submit"]:hover,
.b10_20_input input[type="submit"]:focus { background:#000}

.b10_30_input { border:#ededed solid 1px; height:154px; position:relative; margin:20px 0; background:#fff}
.b10_30_input input {  width:79%; padding:0 0 0 3%; left:14%;background:#bbb; position:absolute;  color:#fff; background:#75777b;line-height:1.3em ; outline:#75777b solid 1px;border:none; font-size:16px; font-weight:normal; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
.b10_30_input span {  padding:0 0 0 3%; position:absolute; line-height:1.7em ; border:none; font-size:16px; font-weight:normal; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
.b10_30_input .in_01 {top:24px; height:33px;}
.b10_30_input .in_02 {top:90px; height:33px;}
.b10_30_input .tx_01 {top:24px; height:33px;}
.b10_30_input .tx_02 {top:90px; height:33px;}

/* 대출자번호 로그인후 정보수정 */
.b10_40_input { border:#ededed solid 1px; position:relative; padding:24px; margin:20px 0; background:#fff}
.b10_40_input:before { display:block; content:""; width:30px; height:3px; background:#ffc600; position:absolute; top:0; left:0}
.b10_40_input input { height:33px; color:#fff; background:#75777b;line-height:1.2em; font-size:16px; font-weight:normal; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}

.b10_40_input input[type="text"] { font-weight:600; background: #f9f9f9; padding-left:20px; padding-right:20px; text-align: center; color:#333; border:#ddd solid 1px}
.b10_40_input input[type="submit"] { width:20%; padding:6px 0; border:#333 solid 1px; height: 36px; float: right;}
.b10_40_input input[type="submit"]:hover,
.b10_40_input input[type="submit"]:focus { background:#000}



/* 본인인증 2가지 일 경우 */
.b10_22, .b10_23, .b10_24, #identity_class {margin:20px 0; *zoom:1;}
.b10_22:after, .b10_23:after, .b10_24:after,
#identity_class:after { display: block; content: ""; visibility: hidden; clear: both;}

.b10_22 a, .b10_23 a, .b10_24 a,
a.b10_d1, a.b10_d2, a.b10_d3, a.b10_d4  { display:block; margin:0 0 0 1%; float:left; padding:113px 0 20px 0; font-size:16px; background:#ffc600 url(../images/btn_bs30.png) no-repeat center 0; color:#fff; text-align:center}


.b10_22 a:first-child, .b10_23 a:first-child, .b10_24 a:first-child,
#identity_class a:first-child { margin:0}
.b10_22 a:hover, .b10_23 a:hover, .b10_24 a:hover,
#identity_class a:hover{ background-color:#333}

#identity_class.ceti_1Center { width: 50%; margin: 0 auto;} /* kdh 미적용 상태 : 개인 인증 페이지에서 하나의 인증 방법만 존재할 때, 버튼 사이즈 축소 및 가운데 정렬 요청 */

a.btn_ipin_confirm{background-position: center -150px}
a.btn_mobile_confirm{background-position: center -300px}
a.btn_mypin_confirm{background-position: center -450px}

a.b10_d1 { width:100%} /* 본인인증 2가지 일 경우 */
a.b10_d2 { width:49.5%} /* 본인인증 2가지 일 경우 */
a.b10_d3 { width:32.5%} /* 본인인증 3가지 일 경우 */
a.b10_d4 { width:24%} /* 본인인증 4가지 일 경우 */


.identity_class_comment { padding:10px 0}
.identity_class_comment li {color:#3a7caf; font-size:14px; line-height:1.5em}
.identity_class_comment li:before { display:inline-block;content:""; width:3px; height:3px; margin:0 5px 0 3px; vertical-align:middle; background-color:#3a7caf}
.identity_class_comment li strong { vertical-align:top; font-weight:600; font-size:15px; text-decoration:underline}

.identity_class_comment ul{ padding:0 0 10px 1em}
.identity_class_comment li li:before { display:none}
.identity_class_comment li li {color:#ee770e; font-size:13px}

.b10_complete { line-height:1.9em; font-size:14px; height:120px; vertical-align:middle; padding:20px 3% 20px 28%; border: #ddd solid 1px; box-shadow:#ededed 0 3px 3px; background:#fff url(../images/bg_login_complete.png) no-repeat 9% 24px;}
.b10_complete .comment01 strong{ color: #3289ad; font-size:16px; font-weight:600; vertical-align:top}
.b10_complete .comment02 { padding:8px 0; margin:14px 0 11px 0; color:#717171; border-top: dotted #ddd 1px ; border-bottom: dotted #ddd 1px; font-size:13px}
.b10_complete .comment03 { padding:8px 0; margin:14px 0 11px 0; color:#999; font-size:13px; border-top: dotted #ddd 1px ;}

.b10_fail { line-height:1.5em; font-size:14px; padding:30px 3% 20px 28%; min-height:90px; border: #ddd solid 1px; box-shadow:#ededed 0 3px 3px; background:#fff url(../images/bg_login_fail.png) no-repeat 9% 25px;}
.b10_fail .comment01 strong{ color: #3289ad; font-size:16px; font-weight:600}
.b10_fail .comment02 { padding:8px 0; margin:14px 0 11px 0; color:#717171; border-top: dotted #ddd 1px ; font-size:13px}


/* 통계 */

.content2 { color:#717171; background:#fff; padding:30px 0; line-height:1.4em; overflow:hidden; text-align:right}
.content2:after { display:block; content:""; height:0; visibility:hidden; clear:both}

.stastics_head { font-size:14px}
.stastics_head input[type="text"] { padding:7px 0 6px 1%; font-family:sans-serif; font-size:14px}

.stastics_org_select { display:inline-block; width:25%; float:left; text-align:left}
.stastics_org_select label { color:#000; font-weight:600; padding-right:10px}


.stastics_during_select a { background:#aeaeae; color:#fff; padding:8px 15px; margin:0 -2px 0 0}
.stastics_during_select a:hover,
.stastics_during_select a:focus { background:#666}

.stastics_during_btn { padding:0 0 0 10px}
.stastics_during_btn:before { display:inline-block; content:""; width:1px; height:32px; background:#ddd; margin: 0 11px -12px 3px}
.stastics_during_btn a { background:#d5d5d5; color:#717171; padding:8px 19px; margin:0 -2px 0 0}
.stastics_during_btn a:hover, .stastics_during_btn a:focus,
.stastics_during_btn a.on { background:#78746a; color:#fc6}

.stastics_table h4 { font-size:23px; font-weight:normal}
h4 span.org_div {}
h4 span.state_due:before {display:inline-block; margin:0 12px -2px 9px; content:""; width:1px; height:18px; background:#ddd;}
.d10 button.ui-datepicker-trigger{background:#6b9bc8 url(../images/btn_calendar.png) no-repeat center center; border:none;  font-size:1px; color:#4d83b5; width:45px; height:33px; vertical-align:middle }
.d10 button.ui-datepicker-trigger:hover,
.d10 button.ui-datepicker-trigger:focus {background-color:#4d83b5}

.sub .ui-datepicker td {padding:0; background: #ededed}
.sub .ui-datepicker td a{ line-height: 2em}
.sub .ui-widget-content .ui-datepicker-calendar .ui-state-default { background: #fff; color:#666}
.sub .ui-widget-content .ui-datepicker-calendar .ui-state-default:hover,
.sub .ui-widget-content .ui-datepicker-calendar .ui-state-default:focus,
.sub .ui-widget-content .ui-datepicker-calendar .ui-state-active { background: #777; color:#ffc600; border:none}
.sub table.ui-datepicker-calendar thead th { background: #ededed; color:#333}

/*
.stastics_table h4 { font-size:23px; font-weight:normal}
.stastics_table h4 span:before { display:inline-block; content:""; width:1px; height:18px; background:#ddd;}
.stastics_table li {display:block; width: 25%; float:left; border-bottom:#ddd solid 1px; background:#fff}
.stastics_table li span.no,
.stastics_table li strong.book_title,
.stastics_table li span.hit{ display:block; width:20%; float:left}

.stastics_table ol { border-top: #ccc solid 1px}
.stastics_table li span.no{ text-align:center; background:#f3f3f3; color:#888; padding:10px 0}
.stastics_table li strong.book_title { width:52%; padding:10px 0 10px 8%; font-weight:normal; text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.stastics_table li span.hit { width:15.5%; padding:10px 4% 10px 0; text-align:right; color:#5391ca }
 */

.stastics_table ol { border-top: #999 solid 1px; font-size:14px; margin:15px 0 0 0}

.stastics_table li {display:block; border-bottom:#ddd solid 1px; background:#fff; overflow:hidden}
.stastics_table li span.no, .stastics_table li span.type, .stastics_table li strong.book_title, .stastics_table li span.hit, .stastics_table li span.no_result
{ display:block; width:20%; float:left; padding:12px 0}

.stastics_table li span.no{ text-align:center; background:#f3f3f3; color:#888}
.stastics_table li span.type { width:10%; text-align:left; color:#888; padding-left:2%;}
.stastics_table li strong.book_title { width:45%; text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
/* .stastics_table li strong.book_title { width:35%; padding-left:8%; text-overflow:ellipsis;overflow:hidden;white-space:nowrap} */
.stastics_table li span.hit { width:15.5%; padding-right:4%; text-align:right; color:#5391ca }
.stastics_table li span.no_result { width:100%; text-align:center; color:#000; font-size: 17px;}



/* 기타 , 이용약관 등 */

.terms_page { line-height: 1.4em; color:#777}
.terms_page h4 { padding:25px 0 10px; font-size: 16px; color:#333}
.terms_page h5 { padding:15px 0 5px; font-size: 14px; color:#555}
.terms_page li h5 { padding:0 0 5px 0}
.terms_page p { padding:5px 0 10px 0 ; color:#666}
.x10 .terms_page p { padding:4px 0 4px 0 ; color:#666}

.terms_page ul { padding:5px 0}
.terms_page li { padding:3px 0 4px 10px; background: url(../images/deco_dot12.gif) no-repeat 2px 10px;}

.terms_page table { width:100%}
.terms_page table caption { position: fixed; left:-9999; top:-9999px; font-size: 0}
.terms_page table thead th{ padding:10px 6px;background: #eee; border: solid 1px #ddd ; border-bottom:none;border-top: solid 1px #aaa ;}
.terms_page table tbody th,
.terms_page table tbody td { padding:8px 6px; border: solid 1px #ddd; text-align: center}

.terms_intro { border: solid 1px #ededed; background: #efefef; padding:15px}
.terms_intro li { padding:5px; background: none}

.terms_page dl { overflow: hidden; border-top:solid 1px #aaa; background: #fff}
.terms_page dl dt { background: #eee}
.terms_page dl dt,
.terms_page dl dd { display: block; width:28%; float:left; padding:8px 2%; border-bottom:solid 1px #ddd;}
.terms_page dl dd { width:63%;}
.terms_page dl a { vertical-align: middle}



/* */
.tNo { width: 6%}
.tArea { width:12% }
.tLinName { font-weight: bold  }
.tRegno { width: 15%}

/* btn */
.btn_area_10 { padding:40px 0 30px 0; margin:50px 0 20px 0; overflow:hidden; border-top: solid 1px #ededed; text-align:right}
.btn_area_10 a { padding: 12px 50px; color:#ededed; box-shadow:#e3e3e3 0 2px 2px;
    background: #75777b;
    background: -moz-linear-gradient(top,  #75777b 0%, #46494e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#75777b), color-stop(100%,#46494e));
    background: -webkit-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -o-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -ms-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: linear-gradient(to bottom,  #75777b 0%,#46494e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75777b', endColorstr='#46494e',GradientType=0 );
}
.btn_area_10 a:hover, .btn_area_10 a:focus { background:#474a50; color:#fff}

.btn_area_20,
.btn_area_22,
.btn_area_24,
.btn_area_40
{ padding:10px 0 20px 0; margin:20px 0; overflow:hidden; text-align:right}
.btn_area_24 { padding:15px 0; margin:0}
.btn_area_40{text-align: center; margin-top:40px; }

.btn_area_20 a,
.btn_area_22 a,
.btn_area_24 a,
.btn_area_20 input[type=button],
.btn_area_22 input[type=button],
.btn_area_24 input[type=button]
{ padding: 12px 50px; color:#fff; box-shadow:#e3e3e3 0 2px 2px; border:none; line-heigh:1.2em; font-size:12px ;font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif;
    background: #75777b;
    background: -moz-linear-gradient(top,  #75777b 0%, #46494e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#75777b), color-stop(100%,#46494e));
    background: -webkit-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -o-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -ms-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: linear-gradient(to bottom,  #75777b 0%,#46494e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75777b', endColorstr='#46494e',GradientType=0 )}
.btn_area_22 a, .btn_area_22 input,
.btn_area_24 a, .btn_area_24 input
{ padding: 8px 30px; font-size:13px !important}

.btn_area_20 a:hover, .btn_area_20 a:focus,
.btn_area_20  input[type=button]:hover, .btn_area_20  input[type=button]:focus,
.btn_area_22 a:hover, .btn_area_22 a:focus,
.btn_area_24 a:hover, .btn_area_24 a:focus,
.btn_area_22  input[type=button]:hover, .btn_area_22  input[type=button]:focus,
.btn_area_24  input[type=button]:hover, .btn_area_24  input[type=button]:focus
{ background:#474a50; color:#fff}

.btn_area_30 { padding:20px 2%; overflow:hidden; text-align:right}
.btn_area_30 a,
.btn_area_30 input[type=button] { padding: 8px 40px; color:#fff; box-shadow:#e3e3e3 0 2px 2px; border:none; line-heigh:1.2em; font-size:12px ;font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif;
    background: #75777b;
    background: -moz-linear-gradient(top,  #75777b 0%, #46494e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#75777b), color-stop(100%,#46494e));
    background: -webkit-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -o-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: -ms-linear-gradient(top,  #75777b 0%,#46494e 100%);
    background: linear-gradient(to bottom,  #75777b 0%,#46494e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75777b', endColorstr='#46494e',GradientType=0 );
}
.btn_area_30 a:hover, .btn_area_30 a:focus,
.btn_area_30 input[type=button]:hover, .btn_area_30 input[type=button]:focus { background:#474a50; color:#fff}



a.btn_10 { border:#1d89c0 solid 1px; padding:6px 12px; border-radius:4px; color:#fff;
    background: #1d89c0}
a.btn_10:hover, a.btn_10:focus { background:#0d74a8}


.btn_20 { background:#f3f3f3; color:#717171; padding:5px 8px}

a.dft,
input.dft { background:#909aa0;color:#fff; border:none;font-size:12px; line-height:1.2em; margin:0; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
a.dft:hover, a.dft:focus,
input.dft:hover, input.dft:focus {background:#808c94}

a.pri,
input.pri { background:#1d89c0;color:#fff; border:none;font-size:12px; line-height:1.2em; margin:0; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
a.pri:hover, a.pri:focus,
input.pri:hover, input.pri:focus {background:#0d74a8}


a.pri2,
input.pri2 { background:#70a8bf;color:#fff; border:none;font-size:12px; line-height:1.2em; margin:0; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
a.pri2:hover, a.pri2:focus,
input.pri2:hover, input.pri2:focus {background:#4e97b5}

a.wrn,
input.wrn { background:#ef9e50;color:#fff; border:none;font-size:12px; line-height:1.2em; margin:0; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
a.wrn:hover, a.wrn:focus,
input.wrn:hover, input.wrn:focus {background:#da8432; color:#fff}

a.dis,
input.dis { background:#bcbcbc; color:#ededed; border:none;font-size:12px; line-height:1.2em; margin:0; font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif}
a.dis:focus, a.dis:hover,
input.dis:focus, input.dis:hover { cusor:defalt}





/* page_navi */
.page_navi { overflow:hidden; padding:20px; text-align:center}
.page_navi a { padding:6px 10px; margin:1px; border:#ddd solid 1px}
.page_navi a:hover, .page_navi a:focus,
.page_navi a.on,
.page_navi a.page_1st:focus, .page_navi a.page_1st:hover,
.page_navi a.page_before:focus, .page_navi a.page_before:hover,
.page_navi a.page_next:focus, .page_navi a.page_next:hover,
.page_navi a.page_last:focus, .page_navi a.page_last:hover { background:#717171; border:#717171 solid 1px; color:#fff}

.page_navi a.page_1st,
.page_navi a.page_before,
.page_navi a.page_next,
.page_navi a.page_last{ background:#d6d6d6; border:#d6d6d6 solid 1px}

.pageNav2 { text-align:center; margin: -12px 0 0 0; display:none;}
.pageNav2 a { padding: 0 4px 0 7px; text-align: center; background:url(../images/deco_dot14.gif) no-repeat 0 7px;}
.pageNav2 a:first-child { background: none}
.pageNav2 a:hover,
.pageNav2 a:focus,
.pageNav2 a.on {color:#e66506}
.pageNav2 a.on { text-decoration: underline;}


/* table */
table { border-collapse:collapse; font-size:13px; color:#717171}
table th,
table td { line-height:1.3em; }
th { word-break:keep-all}
table .sr_only { position:fixed; top:-9999px; left:-9999px}

/* 텍스트 정렬이 가운데 중심 */
div.table_10,
table.table_10 { width:100%; border-top: solid 1px #636363; margin:10px 0 20px 0}
.table_10 thead th { text-align: center}
.table_10 th,
.table_10 td { padding:12px 5px}
.table_10 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; }
.table_10 thead th,
.table_10 thead td { background:#e9e9e9; padding:18px 5px}
.table_10 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.table_10 tbody td { background:#fff; text-align:center; border-bottom: 1px solid #e9e9e9;}
.table_10 tbody td.title { text-align:left; font-weight:bold}

div.table_12,
table.table_12 { width:100%; border-top: solid 1px #bababa; margin:10px 0 20px 0}
.table_12 thead th { text-align: center}
.table_12 th,
.table_12 td { padding:12px 5px}
.table_12 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; }
.table_12 thead th,
.table_12 thead td { background:#f3f3f3; padding:18px 5px}
.table_12 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.table_12 tbody td { background:#fff; text-align:center; border-bottom: 1px solid #e9e9e9;}
.table_12 tbody td.title { text-align:left; font-weight:bold}

/* 텍스트 정렬이 왼쪽 */

.table_20 { width:100%; border-top: solid 1px #636363; margin:10px 0 20px 0}
.table_20 th,
.table_20 td { padding:12px 5px; line-heigh:1.3em}
.table_20 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px;color:#999 }
.table_20 thead th,
.table_20 thead td { background:#e9e9e9; padding:18px 5px}
.table_20 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.table_20 tbody td { background:#fff; text-align:center; border-bottom: 1px solid #e9e9e9; color:#999}
.table_20 tbody td.title { text-align:left; color:#717171}

/* 우편번호검색 */
.table_30 { width:100%; border-top: solid 1px #636363; margin:10px 0 20px 0}
.table_30 th,
.table_30 td { padding:8px 5px; line-heigh:1.3em}
.table_30 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px;color:#999 }
.table_30 thead th,
.table_30 thead td { background:#e9e9e9; padding:12px 5px}
.table_30 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.table_30 tbody td { background:#fff; border-bottom: 1px solid #e9e9e9; color:#999}
.table_30 tbody td.title{ text-align:left; color:#717171}
.table_30 tbody td.zipNo{ text-align:center}

.document_content {padding-top:10px; font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; line-height:1.5em}

.table_80 { width:100%; border-top: solid 1px #636363; margin:10px 0 20px 0}
.table_80 th { font-size: 12px}
.table_80 th,
.table_80 td { padding:12px 10px ; text-align:left}
.table_80 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; }
.table_80 thead th,
.table_80 thead td { background:#e9e9e9; padding:18px 5px}
.table_80 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede; letter-spacing: -1px}
.table_80 tbody td { background:#fff; border-bottom: 1px solid #e9e9e9;}
.table_80 tbody td.title { text-align:left; font-weight:bold}

.table_80 tbody td.code,
.table_80 tbody td.place,
.table_80 tbody td.room,
.table_80 tbody td.isbn,
.table_80 tbody td.s_title,
.table_80 tbody td.append { word-wrap: break-word; word-break: break-all;}

div.tableN85R,
table.tableN85R {border-top: solid 1px #636363;width:85%; float: right; margin:10px 0 20px 0}

.tableN85R thead th { text-align: center;}
.tableN85R th,
.tableN85R td { padding:12px 5px; line-heigh:1.3em}
.tableN85R td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px;color:#999 }
.tableN85R thead th,
.tableN85R thead td { background:#e9e9e9; padding:18px 5px}
.tableN85R tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.tableN85R tbody td { background:#fff; text-align:center; border-bottom: 1px solid #e9e9e9; color:#999}
.tableN85R tbody td.title { text-align:left; color:#717171}


.ui-dialog table.table_80  { font-size:12px}
.ui-dialog .table_80 th,
.ui-dialog .table_80 td { padding:6px 10px ; text-align:left}

.ui-dialog .table_82 {margin-top: 10px;}
.ui-dialog .table_82 th,
.ui-dialog .table_82 td {border-top: solid 1px #dedede; margin:10px 0 20px 0; }

.ui-dialog-titlebar-close {
    visibility: hidden;
}

.table_82 { width:100%}
.table_82 th,
.table_82 td { padding:8px 10px ; text-align:left}
.table_82 td { font-family:'굴림',Gulim,'돋움',Dotum,sans-serif; font-size:12px; }
.table_82 thead th,
.table_82 thead td { background:#e9e9e9; padding:18px 5px}
.table_82 tbody th { background:#f3f3f3; border-bottom: 1px solid #dedede;}
.table_82 tbody td { background:#fff; border-bottom: 1px solid #e9e9e9;}


.table_80 th.code { min-width:40px; letter-spacing: -1px; padding-right:0}
.table_80 th.room { width:30px}
.table_80 th.s_title { width:78px}
.table_80 td.shape { max-width:120px}

/* .table_80 td.code, */
/* .table_80 td.place, */
/* .table_80 td.room, */
/* .table_80 td.loan_o, */
/* .table_80 td.loan_x, */
/* .table_80 td.reg_no, */
/* .table_80 td.isbn, */
/* .table_80 td.reserve_o, */
/* .table_80 td.reserve_x, */
/* .table_80 td.s_title, */
/* .table_80 td.append {word-break:break-all;} */

th.loan_ox,
td.loan_o,
td.reserve_o { font-weight:600}
td.loan_o { color:#91b015 !important; letter-spacing: -1px; min-width:100px}
td.append { min-width: 85px}
td.loan_o span {display: inline-block; float: left}
td.loan_x,
td.reserve_x { !important; letter-spacing: -1px}
td.reserve_o { color:#17addf !important; letter-spacing: -1px}

/* common */
.none { display:none;}

.note_pri10 { color:#999; font-size:12px; line-height:1.5em }
table .note_pri10 {padding:6px 0 0 0}

.comment_10,

.memo_pri10,
.memo_pri12 { color:#3a7caf; font-size:14px; line-height:1.5em}
.memo_pri12 { font-size:13px}


.memo_wrn10,
.memo_wrn12 { color:#ee770e; font-size:14px; line-height:1.5em}
.memo_wrn12 { font-size:13px}

.identity_class_comment .memo_pri10 strong { vertical-align:top; font-weight:600; font-size:15px; text-decoration:underline}

.popup_comment1 {color:#598db5; font-size:12px; padding:10px 0 5px 0;}

.floatL {float:left;}



table input[type="text"], table input[type="password"],
table select { border:solid 1px #ddd; background:#fefefe; padding:5px; margin:2px}

.input { border: solid 1px #ddd; padding:5px 1%}
.input_95 { width:95%}
.input_90 { width:90%}
.input_85 { width:85%}
.input_80 { width:80%}
.input_70 { width:70%}
.input_63 { width:63%}
.input_60 { width:60%}
.input_50 { width:50%}
.input_42 { width:42%}
.input_40 { width:40%}
.input_30 { width:30%}
.input_20 { width:20%}
.input_15 { width:15%}
.input_10 { width:10%}
.input_08 { width:8%}
.input_05 { width:5%}
input[type="radio"]{vertical-align:middle}
#BookFurnish_Lib_Name { padding:5px 0 0 0; float:left}

.readonly {background:#f9f9f9 !important; color:#999}


#agreeConfirmDiv {padding-top : 1em; padding-left : 1em; padding-right : 1em; line-height: 140%;}



/* ERROR */
a.error span { font-size:12px; color:#333; background:#ffc600 url(../images/deco_arrow_10.gif) no-repeat 97% 8px; padding:5px 100px 5px 10px; margin:10px 0 0 0 }
a.error:hover span,
a.error:focus span { background:#717171 url(../images/deco_arrow_10.gif) no-repeat 97% 8px; color:#fff}

.error_page_wrap a.error { font-size:12px; background:#ffc600 url(../images/deco_arrow_10.gif) no-repeat 92% 8px; padding:5px 100px 5px 10px; margin:10px 0 0 0; color:#333}
.error_page_wrap a.error:hover,
.error_page_wrap a.error:focus { background:#717171 url(../images/deco_arrow_10.gif) no-repeat 95% 8px; color:#fff}

.error_page_wrap { padding:35px 0 35px 30% ; height:100px; background:url(../images/bg_error.png) no-repeat 0 0 }
.error_commnet01 { font-size:21px}
.error_commnet02 { font-size:18px; padding:10px 0 50px 0; color:#888}

/* loading */
#loading { width: 100%; height: 100%; top: 0px; left: 0px; position: fixed; display: none; z-index: 99; text-align: center;}
#viewLoading {position: fixed; top: 50%; left: 50%; z-index: 100; display: none;}

.alert-box {width: 100%; height: 100%; position: fixed; z-index: 4000; background:url(../images/bg_bk70.png); top:0; left:0; text-align: center }
.alert-box span { display:block; border: 1px solid red; border-radius: 4px; margin: 15% auto 1% auto; padding: 25px 50px; text-align: center; width:30%; font-size: 14px}
.alert-box input {osition:absolute;top: 45%;}
.success {color: #3c763d;display: none}
.failure {color: #a94442;display: none}
.warning {color: #8a6d3b;display: none}
.success span {background-color: #dff0d8;border-color: #d6e9c6;}
.failure span {background-color: #f2dede;border-color: #ebccd1;}
.warning span {background-color: #fcf8e3;border-color: #faebcc;}

/* admin */
.admin_header_wrap h1,
.admin_header_wrap h1 a{ float:left; width:620px; height:55px; text-align: left;}
.admin_header_wrap h1 a img { float:left}
.admin_header_wrap { width:100%; height:110px; padding:25px 0 0;overflow:hidden; background:#b9b9b9}
.admin_header_wrap .container { position:relative}

.admin_snb { width:15%; float:left}
.admin_content { width:84%; float:right}
.admin_snb h2 { font-size:20px; font-weight:600; color:#000; padding:0 0 15px 0; line-height:1.1em}
.admin_content h3  { font-size:21px; font-weight:normal; margin:0 0 70px 0}
.admin_content h3 strong{ font-weight:600; vertical-align:top }
.admin_content h3 span { padding:0 0 0 15px;  vertical-align: baseline; color:#ffc600}
.admin_content h3 span:before {}

.admin_container { width:1150px; padding:0 5px; margin:0 auto}
.table_80 td.centerbtn {text-align: center;}
.admin_member { display:inline-block; text-align:right; position:absolute; right:20%; top:0px; background:#717171; height:16px; padding:6px 15px 10px 20px ; color:#fff; line-height:1.2em}

.admin th, .admin td {border: 1px solid #dedede;}

/* OPEN API CI */
.linkSources { font-size: 12px; color: #8e8e8e; letter-spacing: -1px; line-height: 1.3em; float: right;}
.linkSources a,
.linkSources span { display: inline-block; font-size:0; }
.linkAladin { margin: 3px 5px -30px 0}
.linkAladin a { background: url(../images/iconAladin.png) no-repeat right 0; background-size:contain; width:62px; height:25px; margin:-8px 0 0 0}
.linkNaver { margin: 5px 5px -37px 0}
.linkNaver a,
.linkNaver span { background: url(../images/iconNaver.png) no-repeat right 2px; width:117px; height:30px; margin:-8px 0 0 0}
.linkKakao { margin: 13px 0 -37px 0}
.linkKakao a,
.linkKakao span { background: url(../images/iconKakao.png) no-repeat right center; width:146px; height:30px; margin:-8px 0 0 0}
.linkData4lib a,
.linkData4lib span { background: url(../images/iconData4lib.png) no-repeat right center;  background-size:contain;  width:150px; height:70px; margin:-8px 0 0 0}

audio {margin-top:15px}
/* 셀렉트타입 */
.btnSelectSearch{font-size:0;}
.search_select{position:absolute; top:30px; left:0; padding:7px; border: #999 solid 3px; width:32%;}
.search_select:hover{border:3px solid #333;}
.selectSearch > label{font-size:0;}
a.btn_search{width:11%; background-size:20px; background-position: center 9px
}

/* tooltip */
body .ui-tooltip{max-width:700px;}
.ui-tooltip, .arrow:after {}
.ui-tooltip {padding: 10px 14px;color: #666;border-radius: 2px; text-transform: uppercase; line-height: 1.7em; box-shadow:0 2px 3px rgba(0,0,0,0.15); border:solid 1px #ccc; border-radius: 3px}
.ui-tooltip-content {font-size:14px; width:650px;}
.arrow {width: 70px;height: 16px;overflow: hidden;position: absolute;left: 50%;margin-left: -35px;bottom: -16px;}
.arrow.top {top: -16px;bottom: auto}
.arrow.left {left: 20%}
.arrow:after {content: "";position: absolute;left: 20px;top: -20px;width: 25px;height: 25px;box-shadow: 6px 5px 9px -9px black;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg)}
.arrow.top:after {bottom: -20px;top: auto;}

/* 준비중입니다 */
.ready_wrap, .centerContent{ background: #fff;
    padding:80px;
    overflow: hidden;
    border: #ededed solid 1px;
    box-shadow: #ededed 0 2px 2px;
    border-radius: 10px;
    position: relative;
    text-align: center;
}
.ready_wrap h2{font-size: 22px;}

/*header*/
.vNav li.gnb_self a{background-position:center -606px; width:120px;}

/* 회원증 바코드 인증 */
.centerContent{text-align: center;}
.centerContent h2{font-size:25px; line-height: 1.2;}
.e10 h2{ background:url(../images/userCard.png) no-repeat bottom center; padding-bottom:180px; }
.centerBtn{width:100%;}
.centerBtn button{padding: 12px 50px;
    color: #fff;
    box-shadow: #e3e3e3 0 2px 2px;
    border: none;
    line-height: 1.2em;
    font-size: 12px;
    font-family: '나눔고딕','NanumGothic','NanumGothicWeb','NanumGothicWebB','맑은 고딕','Malgun Gothic','돋움','굴림',Dotum,Gulim,sans-serif;
    background: #75777b;
    background: -moz-linear-gradient(top, #75777b 0%, #46494e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#75777b), color-stop(100%,#46494e));
    background: -webkit-linear-gradient(top, #75777b 0%,#46494e 100%);
    background: -o-linear-gradient(top, #75777b 0%,#46494e 100%);
    background: -ms-linear-gradient(top, #75777b 0%,#46494e 100%);
    background: linear-gradient(to bottom, #75777b 0%,#46494e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75777b', endColorstr='#46494e',GradientType=0 );}


/* 셀프대출반납 키오스크 */
/* body 클래스값 화면정의
sL10 - 회원증 바코드
sL20 - 비밀번호 입력
sL30 - 대출내역 화면
sR10 - 반납내역 화면
selfMain - 셀프대출반납 메인
TTIsland - 티티섬
*/
.btnHome {position:absolute; right: 55px; top:74px; font-size:14px; font-family:'나눔고딕'; font-weight: 600;  text-align: center; background: transparent; border:0 none; color: #fff}
.btnHome:before { display: block; width: 74px; height: 74px;margin-bottom: 6px; background:url(../images/btnHome.png) no-repeat center -57px; content: ""; border: solid 1px #e5e148; border-radius: 50%; transition: border 0.15s ease 0s}
.btnHome:hover:before { background-position-y:15px; border-color:#fff}

.selfLoanReturn header{height:150px;}
/* .selfLoanReturn.sL30 header{height:110px;} */

.selfLoanReturn header h1{ color:#fff; font-size:44px; font-weight:800; letter-spacing:-0.02em; position:absolute; left: 76px; top: 130px; font-family: 'TmonMonsori'; text-shadow: 0 0 6px rgba(0,0,0,.5)}
.selfLoanReturn.sL30  header h1 {left: 104px; top:95px; font-size: 34px}
.selfLoanReturn header .loan_close_btn{    position: absolute; right: 78px;top: 100px;width: 94px;height: 94px;padding: 0;font-size: 0;border: solid 1px #fff; border-radius: 50%; background: url(../images/loan_close_btn.png) no-repeat center 23px; opacity: 0.7;transition: opacity 0.15s ease 0s;}

.selfLoanReturn .body_wrap { height:100%; width:100%}
.selfLoanReturn .footer_wrap { position: absolute; left: 0; bottom: 0; width:100% }

.selfLoanReturn{background-color:#bdbe1a; text-align: center; color:#fff; position: relative;}
.selfLoanReturn .container{width:1770px;}
.selfLoanReturn .content_wrap{background:none; padding:0; border:none; font-size:30px;}
.selfLoanReturn a{color:#fff; font-family: 'TmonMonsori';}
.selfLoanReturn h2{ font-size: 140px; line-height: 1.2; font-family: 'TmonMonsori'; text-shadow:0 0 9px #5d5d00;}
.selfLoanReturn h2 span{display: block;}
.selfLoanReturn p{font-family: 'NotoKr';}

.barcode_box { padding-top: 40px}

.selfLoanReturn .inner_box{font-family: 'TmonMonsori'; text-shadow:0 0 9px #5d5d00;}
.selfLoanReturn .inner_box .return_date{padding-bottom:40px; font-size: 43px; font-family: 'TmonMonsori';}
.selfLoanReturn .inner_box .return_date span{ font-size: 20px; vertical-align: top; margin-left: 30px;}

.selfLoanReturn .btn_box{font-family: 'TmonMonsori'; font-size:35px; text-shadow:0 0 9px #5d5d00; padding-top:50px;}
.selfLoanReturn .btn_box a{display: inline-block; width:300px; height:173px; padding-left:270px; padding-top:130px; font-size:50px; margin:0 50px;}
.selfLoanReturn .btn_box a.return{padding-left:0; padding-right:280px; }
.selfLoanReturn .btn_box a::after{content:""; display: block; height:40px; clear: both; margin-left:100px; background:url(../images/loan_arrow_btn.png) no-repeat left bottom;}

/* 220602 추가 도난방지확인 버튼 디자인 */
.selfLoanReturn .btn_box a.sec{ background-color:rgba(0,0,0,0.2); padding:0; margin:0; width:inherit; height:inherit; border-radius:40px; padding:25px 46px 20px 46px; font-size:34px;}
.selfLoanReturn .btn_box a.sec::after{content:none;}

.selfLoanReturn .footer_wrap h3{font-size:0; width:120px; height:55px; background:url(../images/cms_logo.png) no-repeat center center; margin:0 auto;}
.selfLoanReturn .copyright{text-align: center; float:inherit; color:#545454; font-weight: 700; opacity: .89;}

.borrow{background:url(../images/barrow_btn.png) no-repeat left top;}
.return{background:url(../images/return_btn.png) no-repeat right top;}

.sL10 h2{font-size:84px; padding-bottom:400px;}

.loginWrap, .idPwfindQR {padding: 36px 60px; position: relative; background: #fff; border-radius: 6px; max-width:900px; margin: 0 auto 8px auto }
.loginWrap label { display: block; width: 70% ;font-size: 0}
.loginWrap label span { font-size: 0}
.loginWrap input { height: 52px; border:solid 1px #ccc; width: 420px; border-radius: 4px; margin:4px 0; font-size: 21px; text-indent: 1em}
.btn_login4 { background: #3f3f3f url(../images/arrow.gif) no-repeat center 70px; color:#fff; position: absolute; right: 60px; top:40px; height:120px;padding-bottom: 32px; font-size: 30px; border: solid 1px #3f3f3f; border-radius: 4px; width: 166px; transition:background-color 0.15s ease 0s}
.btn_login4:hover, .btn_login2:focus { background-color: #222}

.idPwfindQR { min-width:64%; background-color:rgba(0,0,0,0.07); text-align: left; border:solid 1px rgba(0,0,0,0.1); margin-top: -30px }
.idPwfindQR h4, .idPwfindQR p { text-shadow:none;}
.idPwfindQR h4 { font-size: 24px; color:#5a5a5a;color:#fff; padding-bottom:20px;font-family: 'NotoKr'}
.idPwfindQR p {font-size: 16px; color: #858585;color:#fff; line-height: 1.34em}
.idPwfindQR img {padding:20px; border-radius: 6px; background-color:#fff; position: absolute;right: 60px; top: 17px}

/* .barcode_info{width:1113px; height:357px; margin:0 auto; border-radius: 10px; background-color:#e5e148;} */
.barcode_box{background:url(../images/loan_RFID.gif) no-repeat center bottom;}
.sec_box{padding-top: 40px; background:url(../images/sec_RFID.gif) no-repeat center bottom;}

.btnArea a{ background: url(../images/loan_cancel_btn.png) no-repeat center right; padding:50px 110px 0 0;margin: 0 10px; display: inline-block; height:109px; font-size: 60px; text-shadow:0 0 9px #5d5d00;}
.btnArea a.btnLogin,
.btnArea a.btnNext, .btnArea a.btn_barcode {background-image: url(../images/arrow.gif);}
.loan_cancel_btn{
    background: url(../images/loan_cancel_btn.png) no-repeat center right;
    padding:50px 110px 0 0; display: inline-block; height:109px; font-size: 60px;
    text-shadow:0 0 9px #5d5d00;
}
.font0{font-size:0;}
.card{background:url(../images/barcode_icon.png) no-repeat center center; width: 500px; height:272px; position:absolute; top:50px; left:130px;}

body.selfLoanReturn.login h2{font-size:80px; word-break: keep-all; white-space: break-spaces;}
.sL20 h2{font-size: 80px; display: inline;}
.sL20 h2 + h2 { display: block; font-size: 50px; padding:16px 0 60px 0}
.btn_barcode{}
.keboard_number_box{display:inline-block; width:360px; background-color:#e5e148; border-radius: 8px; padding:15px 40px; margin-left: 40px; }
.keboard_number_box input{border:0; color:#fff; font-family: 'TmonMonsori'; text-shadow:0 0 9px #5d5d00; font-size: 55px; width:55px; background: transparent; text-align:center;}
.keboard_number_btn_wrap{background-color: #70710f; width: 1128px; height: 376px; box-shadow:0 0 9px #5d5d00; margin: 40px auto 0 auto;}
.keboard_number_btn{font-size:0;}
.keboard_number_btn_wrap input{font-size:90px; color:#fff; border:1px solid #70710f;background-color: #aaa807; width:188px; height:188px; }
.keboard_number_btn_wrap input:focus{outline:0;}
.keboard_number_btn_wrap input:nth-child(n+1):nth-child(-n+6){border-top:0;}
.keboard_number_btn_wrap input:nth-child(n+7):nth-child(-n+12){border-bottom:0;}
.keboard_number_btn_wrap input:nth-child(1), .keboard_number_btn_wrap input:nth-child(7){border-left:0;}
.keboard_number_btn_wrap input:active{opacity: .3;}
.keboard_number_btn_wrap input.backspace{background:#aaa807 url(../images/keboard_backspace.png) no-repeat 35px center; font-size: 0;}
.keboard_number_btn_wrap input.done{font-size:60px; color:#c1c06a; cursor: inherit;}
.keboard_number_btn_wrap input.done:active{opacity: inherit;}
.keboard_number_btn_wrap input.done.on{color:#fff; cursor:pointer;}
/* .sL30{background:url(../images/loanPage.png) no-repeat 0 0;} */
.sR10 h2.return{background-position: left top;}

.sR10 article, .sL30 article{display:inline-block; position: relative;}
.sR10 h2, .sL30 h2{font-size:64px; position:absolute; left:0; min-width:300px; height:125px; padding-left:210px; z-index:10; margin-top: -13px;background-size:220px; padding-top:80px;}
.sR10 h2{background-position:left top;}

.title_info_box p,.title_info_box p{background:url(../images/RFID.gif) no-repeat center 160px; width:550px; padding-top:700px; font-family: 'NotoKr'; color:#333; font-weight: 600; font-size:43px; letter-spacing:-0.1em; text-shadow: none; margin-right:30px;}
.sec_p{background:url(../images/sec_RFID2.gif) no-repeat center 160px; width:550px; padding-top:700px; font-family: 'NotoKr'; color:#333; font-weight: 600; font-size:43px; letter-spacing:-0.1em; text-shadow: none; margin-right:30px;}

.sR10 dl, .sL30 dl{text-align: left;}
.sR10 dl dt, .sL30 dl dt{font-size:32px;}
.sR10 dl dt, .sL30 dl dt, .sR10 dl dd, .sL30 dl dd{display: inline-block; vertical-align:baseline; text-align:left; }
.sR10 dl dd, .sL30 dl dd{font-size:40px; padding-right:10px; }
.sL30 dl dd:nth-child(4){padding-right:30px;}
.sL30 dl dd:nth-child(n+6){padding-right:34px;}
.sL30 dl dd:last-child{margin-right: 0;}

.selfLoanReturn caption { position: fixed; left:-9999px; top:-9999px; font-size: 0}
.selfLoanReturn table{display: block; text-shadow: none; font-size:28px;font-family: 'NotoKr'; letter-spacing: -0.04em;}
.selfLoanReturn tbody { display: block; height: 431px; overflow: auto; }
.selfLoanReturn thead{display:block; background-color: #aaa807; color:#fff;  font-weight: 300;}
.selfLoanReturn thead th, .selfLoanReturn tbody td{float: left;}
.selfLoanReturn thead th{ display: block; padding:20px 0px;}
.selfLoanReturn th:nth-of-type(1), .selfLoanReturn td:nth-of-type(1) { width: 80px; }
.selfLoanReturn th:nth-of-type(2), .selfLoanReturn td:nth-of-type(2) { width: 210px; }
.selfLoanReturn th:nth-of-type(3), .selfLoanReturn td:nth-of-type(3) { width: 692px;  padding-right: 25px; padding-left: 25px;}
.selfLoanReturn th:nth-of-type(4), .selfLoanReturn td:nth-of-type(4) { width:115px;}
.selfLoanReturn tbody td{padding:10px 0; height:63px; color:#3e3e3e; font-weight: 500; display: inline-block; line-height: 2;}
.selfLoanReturn tbody td.book_desc_txt, .selfLoanReturn tbody span.result_noti{
    text-align: left; line-height: 1.35; word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.selfLoanReturn tbody span.result_noti{font-size:19px; font-weight: 500; color:#838383; display: block;}
.fail{color:#ff5a00;}
.selfLoanReturn tbody td.loan_status_fail{color:#ff7200;}
.selfLoanReturn tbody td.loan_status_success{color:#7a7a7a;}
.selfLoanReturn tbody tr{display: block;}
.selfLoanReturn tbody tr:last-child td{border-bottom:0;}

.loan_status_box{padding-top: 79px;}
.loan_status_box dl{padding:30px 0;}
.loan_status_box p{ font-weight:500; padding-top:43px; letter-spacing: -0.08em; text-shadow: none; font-size:18px; opacity: .75; text-align: center; float: left;}
.loan_done_btn{ padding:33px 0 18px 115px; font-size: 60px; text-shadow:0 0 9px #5d5d00; float: right;}
.loan_done_btn:after{content:""; clear: both;}
.sR10 table th, .sR10 table td, .sL30 table th, .sL30 table td{border-bottom:1px solid #cbcbcb;}

.delay{color:#ff2222; vertical-align: baseline;}
.selfLoanReturn tbody .w100{width:100%; padding-top:16%;}
.rfid_loan_done_btn{padding:33px 0 18px 70px; font-size: 30px; text-shadow:0 0 9px #5d5d00; float: right;}

.loginInput { background: rgba(255,255,255,0.3); margin: 50px auto; min-width: 64%; padding:50px 0}
.loginInput input[type="text"],
.loginInput input[type="password"] { height: 40px; font-size: 32px; width: 25%; padding:10px; border-radius: 4px;  border:#bdbe1a solid 1px }
.loginInput input:hover,
.loginInput input:focus {border:#bdbe1a solid 1px}
.loginInput label {padding:0 8px}
.loginInput input + label { padding-left: 80px}

button, input[type="button"] { cursor: pointer}

/* loading */
.loadingWrap { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); z-index: 1000; text-align: center;}
.loadingWrap p { margin-top: 35px; font-weight: 300; font-size: 16px; color: #fff; letter-spacing: 0;}
#loadingWrap #loading { left:auto; position:relative;
    margin-top: 23%; display: inline-block; width: 70px; height: 70px; border: 8px solid rgba(102, 169, 232, 0.534);
    border-radius: 50%; border-top-color: #fff; animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite;}
#loadingWrap  #loading p { font-size: 24px; font-weight: 600;}
@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

/* 다이얼로그 */
.dialog{ width:100%; height: 100%; position: fixed; top: 0; left: 0; right: 0; background:rgba(0,0,0,0.8); display: none; z-index: 10;}
.dialog_wrap{ width:90%; min-height: 200px; position:relative; transform: translate(-50%, -50%); top:50%; left:50%; background-color:#fff; border-radius: 10px; padding:8%; box-sizing: border-box;}
.dialog_wrap p{ text-align: center; font-size:32px; letter-spacing: -0.04em; word-break: break-all; line-height: 1.5; color:#333;}
.dialog.open{display: block;}

/* 에러페이지 */
.error{position: relative; line-height: 1.2; background-color: #eaeaea;}
.error_container{position: absolute; transform: translate(-50%, -50%); top:50%; left:50%; width:100%; padding:30px; box-sizing: border-box; text-align: center; }
.error_container h1{font-size:3.2em; padding-bottom: 30px; font-weight: 600; background:url(../images/error.png) no-repeat center 0; padding-top:455px;}
.error_container h1 + p{font-size:2em; padding-bottom: 30px; font-weight: 300;}
.error_container .btn{width:200px; height:64px; margin:10px 0; font-size: 1.5em; background-color:#2b3872; color:#fff; border-radius: 30px; }

/*이용약관*/
body.TTIsland.agreeTerms { background-color:#4545ff }
.TTIsland.agreeTerms .container{width:auto;}
.TTIsland.agreeTerms .content_wrap{ background-color: transparent; font-size: 17px; border:0;}
.TTIsland.agreeTerms .content{ float: inherit; margin:0 auto;}
.TTIsland.agreeTerms .content .innerBox{ max-height: 550px; overflow-y:auto; padding-right:50px;}
.TTIsland.agreeTerms .content h3{margin-top:40px; margin-bottom:30px; font-size: 50px; color:#fff; text-shadow: 0 0 7px rgba(0,0,0,.45); font-family: 'TmonMonsori';}
.TTIsland.agreeTerms .content .h_40{ text-shadow: 0 0 7px rgba(0,0,0,.45); text-align: left; font-size: 28px; color:#fff; margin-bottom: 20px;}
.TTIsland.agreeTerms .content .agree{color:#fff; font-size:20px; }
.TTIsland.agreeTerms .content h3 + .agree{ padding-right:50px;}
.TTIsland.agreeTerms .content input{width:38px; height:38px}

.TTIsland.agreeTerms table{font-size:17px; line-height: 1}
.TTIsland.agreeTerms .terms_page h4{font-size:22px;}
.TTIsland.agreeTerms .terms_page h5{font-size:18px;}
.TTIsland.agreeTerms .terms_page p{font-weight:300;}
.TTIsland.agreeTerms .btn_area_10{margin-right:50px;}
.TTIsland.agreeTerms .btn_area_10 a{font-size:24px; box-shadow:none;s}