@charset "utf-8"; 
/*
  Project _ CSS Init
  FileName _ sub.css - (서브레이아웃)
  Author _ 쮸양~★
  Date _ 2023. 07. 07
  Last _ 2023. 07. 07
*/


/******************************************************************************************************************************************
    subVisual CSS (서브비주얼 스타일 설정) - 쮸양~★
*******************************************************************************************************************************************/
.subVisual {position:relative; height:190px; background:#f2fcf4;}
.subVisual > .inner {position:relative; height:150px; background:url('../images/sub/subV_01.png') no-repeat 50% bottom;}


@media all and (max-width:640px) {
    .subVisual {height:150px;}
    .subVisual > .inner {background:url('../images/sub/subV_01.png') no-repeat 50% top; background-size:contain;}
}

@media all and (max-width:470px) {
    .subVisual > .inner {background:url('../images/sub/subV_01_m.png') no-repeat 50% -25px; background-size:auto;}
}

/******************************************************************************************************************************************
    locationBox CSS (로테이션(위치) 스타일 설정) - 쮸양~★
*******************************************************************************************************************************************/
#location {position:relative; width:100%; margin:auto auto; background:#826441;}
#location .snb > li {position:relative; display:inline-block}
#location .snb > li::before {position:absolute; top:6px; right:0; content:''; display:block; width:27px; height:27px; background:transparent; border-left:1px solid rgba(232, 232, 232, 0.3); border-bottom:1px solid rgba(232, 232, 232, 0.3); transform:rotate(-135deg); transition:all .3s ease-in-out}
#location .snb > li:first-child::before{display:none;}

#location .snb > li:last-child::before {display:none}
#location .snb > li > a {display:block; line-height:40px; height:40px; color:#fff; font-weight:400; font-size:1em}
#location .snb > li.home {width:50px; text-indent:-9999px; background:#826441 url('../images/sub/ico_home_wh.png') no-repeat center center; background-size:40%;}
#location .snb > li.home a {padding: 0 20px 0 20px;}
#location .snb > li > a:hover {text-decoration:none}
#location .snb > li.has_sub > a {padding:0 50px 0 20px}
#location .snb > li.has_sub > a::after {position:absolute; right:20px; top:17px; z-index:1; display:block; height:8px; width:2px; background:#fff; content:""; transition:all 0.1s ease-out; transform:rotate(45deg)}
#location .snb > li.has_sub > a::before {position:absolute; right:22px; top:20px; display:block; width:8px; height:2px; background:#fff; content:""; transition:all 0.1s ease-out; transform:rotate(225deg)}
#location .snb > li.has_sub > a.dsnone::after, #location .snb > li.has_sub > a.dsnone::before {display:none}
#location .snb > li.has_sub > a.open {color:#00ffff;}
#location .snb > li.has_sub > a.open::after {transform:rotate(90deg); background:#00ffff;}
#location .snb > li.has_sub > a.open::before {transform:rotate(180deg); background:#00ffff;}

/*
#location .snb > li > ul {display:none; position:absolute; top:50px; left:-20px; min-width:182px; box-shadow:0 1px 2px 0 #555; background:#fff}
#location .snb > li > ul > li {border-bottom:#ccc dashed 1px}
#location .snb > li > ul > li:last-child {border:none}
#location .snb > li > ul > li > a {display:block; padding:10px; line-height:1.2; color:#333; font-size:1.15em}
#location .snb > li > ul > li > a:hover {color:#00479d}
*/

#location .snb > li > ul {display:none;position:absolute;top:50px;left:0;width:100%; background:#fff; z-index:10;border:1px solid #dedede;border-top:none;padding: 10px 0;}
#location .snb > li > ul > li > a {display:block;padding: 10px 20px;color:#333;font-size:1.25em;}
#location .snb > li > ul > li > a:hover {color:#09419b; text-decoration:none}
#location .snb > li > ul > li.on > a {background:#007d77; color:#fff}

/* 모바일 로테이션 */
#location_m {background:#826441; text-align:center;}
#location_m .snb > li {position:relative; display:inline-block}
#location_m .snb > li::before {position:absolute; top:17px; right:-3px; content:''; display:block; width:7px; height:7px; background:transparent; border-left:1px solid #fff; border-bottom:1px solid #fff; transform:rotate(-135deg); transition:all .3s ease-in-out}
#location_m .snb > li:last-child::before {display:none}
#location_m .snb > li > a {display:block; line-height:40px; height:40px; color:#fff; font-weight:400; font-size:1.25em}
#location_m .snb > li > a.home {display:block; width:45px; padding:0; text-indent:-9999px; background:url('../images/sub/ico_home_wh.png') no-repeat 10px center; background-size:50%;}
#location_m .snb > li > a:hover {text-decoration:none}
#location_m .snb > li > a {padding:0 10px}


/* 로테이션 버튼배너 */
.snbBn {position:absolute; top:0px; right:0px; height:100%;}
.snbBn li {position:relative; float:left; height:100%; display:inline-block; padding:10px 0px;}
.snbBn li::before {position:absolute; top:0px; left:0px; content:''; display:block; width:1px; height:100%; border-left:1px solid rgba(255, 255, 255, 0.2);}


.snbBn li .snb_bn1 {width:27px; height:27px; margin:0px 15px; display:block; background:url('../images/sub/snb_bn1.png') no-repeat center center; background-size:100%;}
.snbBn li .snb_bn2 {width:27px; height:27px; margin:0px 15px; display:block; background:url('../images/sub/snb_bn2.png') no-repeat center center; background-size:100%;}
.snbBn li .snb_bn3 {width:27px; height:27px; margin:0px 15px; display:block; background:url('../images/sub/snb_bn3.png') no-repeat center center; background-size:100%;}

.snbBn > li > a {color:#fff; text-indent:-1000em;}


/* 텍스트 글씨크기 */
.setup_list {position: absolute; right:0px; top:50px; width: 167px; height: 191px; z-index: 100; background-color: #fff; display: none; outline: medium none; overflow: hidden; border: 2px solid #225e95; background-color: #fff; border-radius: 20px}

.setup_list .opt_box_hg {margin: 16px;}
.setup_list .opt_box_htxt {font-size: 17px; font-weight: 500; margin: 0 0 16px;}
.setup_list .opt_box_bd {font-size: 15px;}
.setup_list .opt_box_bd .opt_line1 {padding: 15px 0 0 11px;}
.setup_list .opt_box_bd .opt_line2 {padding: 8px 0 0 11px;}
.setup_list .opt_box_bd .opt_line2 .opt_lb {border-top: 1px solid #d2d2d2; padding-top: 10px;}
.setup_list .opt_lb {margin: 8px;}
.setup_list .opt_sl {display: inline-block; list-style: outside none none; margin: 0 2px 0 8px; padding: 0; position: relative; text-decoration: none; vertical-align: middle;}
.setup_list .opt_line_height {margin-bottom: 23px;}
.setup_list .opt_sl .opt_btn {border: 1px solid #d2d2d2; box-sizing: border-box; display: inline-block; float: left; margin-right: 4px; padding: 4px 0; position: relative; width: 43px;}
.setup_list .opt_sl .opt_img_low {width: 71px;}
.setup_list .opt_sl .opt_img_low a {width: 71px !important;}
.setup_list .opt_device .opt_btn {width: 51px; padding: 5px 0;}

.setup_list .opt_device .select {
    padding: 4px 0 !important;
}

.setup_list .opt_sl .select {
    border: 2px solid #225e95;
    padding: 3px 0;
}

.setup_list .opt_sl .opt_btn a {
    color: #444;
    cursor: pointer;
    display: block;
    font-size:15px;
    font-weight: 500;
    height: 20px;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
    width: 43px;
    line-height: 20px;
}

.setup_list .opt_sl .opt_btn_select {
    border: 2px solid #36c;
}

.setup_list .opt_close {
    display: block;
    width: 22px;
    height: 22px;
    background: #676767 url("/images/www2020/sub/content_tool_close.png") no-repeat;
    border-radius: 11px;
    text-indent: -99999px;
    position: absolute;
    top: 9px;
    right: 9px;
}

/* sns 리스트 */
.sns_list {display:none; position:absolute; top:50px; right:0; z-index:11; width:228px; height:50px; padding:0px 10px 0px 10px; border:1px solid #000; text-align:center; background:#fff;}
.sns_list li {margin-right:4px;}
.sns_list li:last-child {margin-right:0px;}
.sns_list a {display:inline-block; width:26px; height:26px; text-indent:-9999px; background-image:url('../images/common/ico_sns.png');}
.sns_list .facebook {background-position:0 0;}
.sns_list .kakao {background-position:-33px 0;}
.sns_list .twiter {background-position:-66px 0;}
.sns_list .insta {background-position:-99px 0;}
.sns_list .youtube {background-position:-132px 0;}
.sns_list .linkcopy {background-position:-165px 0;}
.sns_list .kakaotalk {background-position:-198px 0;}



@media all and (min-width:641px) {
    #location_m {display:none}
}

@media all and (max-width:800px) {
    #location .snb > li > a {height:40px; line-height:40px}
    #location .snb > li > ul {top:40px}
    #location .snb > li::before {top:6px; width:27px; height:27px}
    #location .snb > li.has_sub > a::after {top:17px}
    #location .snb > li.has_sub > a::before {top:20px}
}

@media all and (max-width:640px) {
    #location {display:none}
}

@media all and (max-width:280px) {
    #location_m .snb > li > a {font-size:13px;}
}


/******************************************************************************************************************************************
    leftMenu CSS (서브메뉴 스타일 설정) - 쮸양~★
*******************************************************************************************************************************************/
.subContents {position:relative; width:100%; min-height:400px; padding:50px 0px;}

.leftMenu {width:25%; min-width:200px; padding-right:50px;}
.leftMenu > h2.title {position:relative; width:100%; display:inline-block; border-radius:10px; background:#f9f9f9 url(../images/sub/leftTi_bg_01.png) no-repeat center bottom; color:#000; font-size:2.2em; font-weight:500; text-align:center; padding:40px 50px; margin-bottom:30px;}
/*
.leftMenu > h2.title:before {content:""; background:url(../images/sub/left_ti.png) no-repeat center top; width:31px; height:53px; display:block; margin:0px auto;}
*/

.leftMenu > .leftList {position:relative;}
.leftMenu > .leftList > li {position:relative; width:100%; border-bottom:2px dotted #eee; display:inline-block;}
/*
.leftMenu > .leftList > li:before {content:""; position:absolute; top:10px; left:0px; width:22px; height:25px; display:block; background:url(../images/sub/b_dot01.png) no-repeat 0px 0px; background-size:contain;}
*/

.leftMenu > .leftList > li.on {}
.leftMenu > .leftList > li.on > a {width:100%; background:#826441; color:#fff; padding-left:20px; border-radius:10px;}
.leftMenu > .leftList > li.on:before {content:""; position:absolute; top:10px; right:20px; width:22px; height:25px; display:block; background:url(../images/sub/b_dot01.png) no-repeat 0px 0px; background-size:contain;}

.leftMenu > .leftList > li:last-child {border-bottom:none;}
.leftMenu > .leftList > li > a {padding:10px 0px; font-size:19px; display:inline-block; color:#000;}
.leftMenu > .leftList > li > ul {background:#f9f9f9; padding:10px 20px; border-top:2px dotted #eee; border-radius:10px;}
.leftMenu > .leftList > li > ul > li {line-height:25px; position:relative; padding-left:10px;}
.leftMenu > .leftList > li > ul > li a {color:#333; font-size:16px;}
.leftMenu > .leftList > li > ul > li:before {content:""; position:absolute; top:10px; left:0px; width:3px; height:3px; display:block; background:#826441; border-radius:10px;}

.subContents .contents {position:relative; width:75%; margin:0px auto; padding:0px 0px;}

.titleBox {position:relative; display:block; margin-bottom:30px; border-bottom:1px solid #eee; padding-bottom:10px;}
.titleBox > h2.title {color:#000; display:block; font-size:2.2em; font-weight:500;}


@media all and (max-width:1170px) {
    .leftMenu {display:none;}
    .subContents .contents {width:100%;}
    
}


@charset "utf-8";

/* 01 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.greeting {overflow:hidden}
.greeting .ceo_title {}
.greeting .con_left {}
.greeting .con_left p {color:#555;line-height:1.8;text-align:justify}
.greeting .con_left strong {color:#222}
.greeting .con_right {text-align:right}
.greeting .con_right .gree_sign {margin-top:30px;color:#333;font-size:16px}
.greeting .con_right .gree_sign strong {display:block;color:#343434;font-size:46px;font-family:'NanumBrush';letter-spacing:5px}

/* quicklink */
.quicklink {padding:15px 0;background:#eee}
.quicklink h3 {font-size:14px;color:#444;margin:0 0 20px 20px;font-weight:400;font-family:'NanumMyeongjoBold'}
.quicklink ul {overflow:hidden;text-align:center}
.quicklink ul li {display:inline-block;width:32%}
.quicklink ul li a {text-decoration:none;display:block;padding-top:54px;padding-bottom:10px;font-size:12px;letter-spacing:-0.5px}
.q01 {background:url('/groups/library/images/main/guicklink_01.png') no-repeat 50% 0}
.q02 {background:url('/groups/library/images/main/guicklink_02.png') no-repeat 50% 0}
.q03 {background:url('/groups/library/images/main/guicklink_03.png') no-repeat 50% 0}
.q04 {background:url('/groups/library/images/main/guicklink_04.png') no-repeat 50% 0}
.q05 {background:url('/groups/library/images/main/guicklink_05.png') no-repeat 50% 0}
.q06 {background:url('/groups/library/images/main/guicklink_06.png') no-repeat 50% 0}
.q07 {background:url('/groups/library/images/main/guicklink_07.png') no-repeat 50% 0}
.q08 {background:url('/groups/library/images/main/guicklink_08.png') no-repeat 50% 0}
.q09 {background:url('/groups/library/images/main/guicklink_09.png') no-repeat 50% 0}
.q010 {background:url('/groups/library/images/main/guicklink_010.png') no-repeat 50% 0}
.q011 {background:url('/groups/library/images/main/guicklink_011.png') no-repeat 50% 0}
.q012 {background:url('/groups/library/images/main/guicklink_012.png') no-repeat 50% 0} 
.q013 {background:url('/groups/library/images/main/guicklink_013.png') no-repeat 50% 0} 
.q01,.q02,.q03,.q04,.q05,.q06,.q07,.q08, .q09, .q012{background-size:48px 48px}
@media all and (max-width:1007px) {
.quicklink {display:none}   
}

.sub-head {position:relative;margin-bottom:30px;padding-top:50px}
.sub-head h3#page-title {position:relative;padding-left:15px;font-size:30px;color:#111;letter-spacing:0}
.sub-head h3::before {position:absolute;top:0;left:0;content:"";display:block;width:4px;height:100%;background:#026B42}  
@media all and (max-width:480px) {
.sub-head h3#page-title {font-size:20px}
}

/* comm */
h4 {position:relative;margin:15px 0 10px 0;padding-left:20px;font-size:20px;line-height:1;color:#222;letter-spacing:-0.5px}
h4::before {position:absolute;top:0;left:0;content:"";display:block;width:4px;height:20px;background:#026B42}  
h5 {position:relative;margin:15px 0 10px 0;padding-left:20px;font-size:18px;line-height:1;color:#222;letter-spacing:0}
h5::before {position:absolute;top:2px;left:0;content:"";display:block;width:8px;height:8px;border:3px solid #026B42;border-radius:10px}  
h6 {position:relative;margin:15px 0 10px 0;padding-left:20px;font-size:16px;line-height:1;color:#222;letter-spacing:0}
h6::before {position:absolute;top:4px;left:4px;content:"";display:block;width:7px;height:7px;background:#888;border-radius:7px}  
p {margin-bottom:30px;font-size:15px;line-height:1.6}
.p-line {border-bottom:1px solid #ededed;padding-bottom:30px;margin-bottom:50px}
.p-line2 {border-bottom:1px dashed #bcbdc0;padding-bottom:30px }
.exp {color:#4d4d4d;font-size:14px;line-height:1.25;padding-left:16px;background:url('/groups/library/images/comm/board/ico_pool.gif') no-repeat 0 5px}
.p_check {margin-bottom:10px;line-height:24px;padding-left:20px;background:url('/groups/library/images/comm/board/bu_check.png') no-repeat left 6px}
.p_help {margin-bottom:10px;line-height:24px;padding-left:30px;background:url('/groups/library/images/comm/i_help.png') no-repeat}
.p_info {margin-bottom:10px;line-height:24px;padding-left:30px;background:url('/groups/library/images/comm/i_info.png') no-repeat}
pre {white-space:pre-wrap;white-space:pre-line}
.unit {float:right;margin-top:15px;font-size:13px;font-weight:400;letter-spacing:0}
.fr-unit {float:right;margin-top:-30px;margin-bottom:5px}
.nolist {text-align:center;font-size:16px;padding:120px 0 20px 0 !important;background:url('/groups/library/images/comm/board/no_nodata.png') no-repeat center 10px}
.num, .date, .views, .hit, time {font-family:Georgia, serif;font-size:1em;color:#71747b}
.new {display:inline-block;width:30px;height:15px;vertical-align:middle;text-indent:-99999px;background:url('/groups/library/images/comm/board/ico_new.gif') no-repeat; margin-left: 6px;}
.hit {display:inline-block;width:30px;height:15px;vertical-align:middle;text-indent:-99999px;background:url('/groups/library/images/comm/board/ico_hit.png') no-repeat;margin-left: 6px;}
.must {display:inline-block;width:5px;height:5px;text-indent:-99999px;vertical-align:middle;margin:0 5px;background:url('/groups/library/images/comm/board/bu_must.gif') no-repeat}
.ellipsis {display:inline-block;overflow:hidden;width:auto;max-width:90% !important;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;-ms-text-overflow:ellipsis}
.scroll {overflow:scroll;overflow-x:hidden}
.border {border:1px solid #d3d3d3}
.st_none::before {display:none}


@media (max-width:640px) {
.fr-unit {float:none;margin-top:0;margin-bottom:5px}  
}

/* tab_btn */
.tabmenu {margin-bottom:20px;border-top:2px solid #111;border-bottom:1px solid #c5c5c5;border-left:1px solid #c5c5c5}
.tabmenu ul {overflow:hidden;background:#fff;margin-right:-1px;margin-bottom:-1px}
.tabmenu ul li {float:left;width:25%;position:relative;vertical-align:top;border-right:1px solid #c5c5c5}
.tabmenu ul li::before {position:absolute;top:12px;right:10px;content:'';display:block;width:8px;height:8px;background:transparent;border-left:1px solid #aaa;border-bottom:1px solid #aaa;transform:rotate(-45deg);transition:all .3s ease-in-out}
.tabmenu ul li:first-child {border-top:0;margin-left:0}
.tabmenu ul li a {display:block;padding:12px 20px 12px 15px;border-bottom:solid 1px #c5c5c5;font-size:14px;line-height:1.2;color:#444}
.tabmenu ul li a:hover {text-decoration:none}
.tabmenu ul li.on::before {border-color:#fff;border-width:2px}
.tabmenu ul li.on a {color:#fff;font-weight:600;background:#60BB46;}
@media all and (max-width:640px) {
.tabmenu ul li {width:50%}
}

/* tab_btn */
.tab_btn {overflow:hidden;margin-bottom:20px}
.tab_btn::after {content:"";display:block;clear:both}
.tab_btn li {float:left;width:20%;border:1px solid #c5c5c5;background:#e6e6e6;margin-right:-1px}
.tab_btn li a {display:block;padding:12px 0;font-size:15px;text-align:center;color:#444;line-height:1.2}
.tab_btn li.on a {font-weight:600;color:#fff;background:#60BB46}
.tab_btn li a:hover{text-decoration:none}
@media all and (max-width:640px) {
.tab_btn li {width:50%; margin-top:-1px}
.tab_btn li:nth-child(1), .tab_btn li:nth-child(2) {margin-top:0}
}

/* tab_list */
.tab_list {overflow:hidden;margin-bottom:20px;border-top:1px solid #c5c5c5;border-bottom:1px solid #c5c5c5; text-align:center}
.tab_list::after {content:"";display:block;clear:both}
.tab_list li {position:relative;display:inline-block}
.tab_list li::before{position:absolute;top:15px;right:0;content:'';display:block;width:1px;height:10px;background:#aaa}
.tab_list li:last-child::before {display:none}
.tab_list li a {display:block;padding:15px;font-size:15px;color:#444;line-height:1.2}
.tab_list li.active a {color:#60BB46;font-weight:600}
.tab_list li.on a {color:#60BB46;font-weight:600}
.tab_list li a:hover{text-decoration:none}
.tab_list2 {overflow:hidden;margin-bottom:20px; border-bottom:1px solid #c5c5c5}
.tab_list2 li {position:relative;float: left;margin-right: 1px;border: 1px solid #ccc;border-width: 1px 1px 0 1px;border-radius: 5px 5px 0 0;letter-spacing: 0;}
.tab_list2 li.active {background:#026B42}
.tab_list2 li.active a {color:#fff}
.tab_list2 li a {display:block;padding:15px 20px;font-size:15px;color:#444;line-height:1.2}
.tab_list2 li.on a {color:#60BB46;font-weight:600}
.tab_list2 li a:hover{text-decoration:none}
@media all and (max-width:600px) {
    .tab_list2 {border-bottom:none; text-align:center}    
    .tab_list2 li {width: 50%;margin-right: 0;border-radius:unset;border-width:1px;}
}
@media all and (max-width:480px) {
.tab_list{text-align:left}
}

/* list-style */
ul.ma {overflow:hidden;margin:0 0 20px 0}
ul.ma::after {display:block;clear:both;content:''}
ul.ma li {position:relative;padding-left:18px;font-size:15px;line-height:1.4;margin-bottom:5px}
ul.ma li::before{ content:"";position:absolute;left:4px;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
ul.ma li ul {margin-top:5px}
ul.ma li ul li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
ul.ma li ul li::before {content:"";position:absolute;left:0;top:10px;width:8px;height:1px;background:#999}

/* year_box */
.year_box select {width: 90px;}

dl.ma {display:table;width:100%;margin-bottom:20px; border:1px solid #d0d0d0; border-radius:5px}
dl.ma::after {display:block;clear:both;content:''}
dl.ma dt {display:table-cell;width:25%;padding:20px 0;text-align:center;font-size:16px;font-weight:400;vertical-align:middle;color:#60BB46; background:#fff; border-radius:5px 0 0 5px}
dl.ma dd {display:table-cell;width:75%;padding:20px 2%;font-size:15px;line-height:1.4; border-left:1px solid #eee}
dl.ma dd li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
dl.ma dd li::before{ content:"";position:absolute;left:0;top:10px;width:3px;height:3px;background:#999;border-radius:3px}
dl.ma dd li ul {margin-top:5px}
dl.ma dd li li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
dl.ma dd li li::before {content:"";position:absolute;left:0;top:10px;width:8px;height:1px;background:#999}

dl.ma2 {overflow:hidden;margin-bottom:20px}
dl.ma2::after {display:block;clear:both;content:''}
dl.ma2 dt {float:left;width:25%;padding:20px 2%;display:inline-block;text-align:center;font-size:16px;letter-spacing:-0.5px;color:#60BB46;font-weight:400;border:1px dashed #60BB46;border-radius:5px}
dl.ma2 dd {float:left;width:75%;padding:10px 2%;font-size:15px;line-height:1.4 }
dl.ma2 dd li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
dl.ma2 dd li::before{ content:"";position:absolute;left:0;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
dl.ma2 dd li ul {margin-top:10px}
dl.ma2 dd li li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
dl.ma2 dd li li::before {content:"";position:absolute;left:0;top:10px;width:8px;height:1px;background:#999}
@media (max-width:640px) {
dl.ma dt {display:block;width:100%;padding:15px 10px;border-radius:5px 5px 0 0} 
dl.ma dd {display:block;width:100%;padding:15px 20px}
dl.ma2 {padding:10px 0}
dl.ma2 dt {float:none;width:100%;padding-left:15px;text-align:left} 
dl.ma2 dd {float:none;width:100%;padding:15px 20px}
}

/* box design */
.box_guide {overflow:hidden;position:relative;margin-bottom:30px;padding:25px 25px 25px 140px;border:1px solid #ddd;border-radius:5px;background-color:#fbfbfb}
.box_guide dt {font-size:18px;font-weight:600;margin:0 0 10px 0;color:#333}
.box_guide dd {font-size:14px;line-height:1.6}
.box_guide li {position:relative;padding-left:15px;font-size:15px;line-height:1.4;margin-bottom:5px}
.box_guide li::before{ content:"";position:absolute;left:0;top:10px;width:3px;height:3px;background:#999;border-radius:3px}
.box_guide p {margin-bottom:0;font-size:15px;line-height:1.4}

.box {position:relative;margin-bottom:30px;padding:20px 25px;color:#444;background:#fffef8;border-radius:5px; border:10px solid #fde17c;}
.box ul {margin-bottom:10px}
.box dt {font-size:18px;font-weight:600;margin-bottom:10px}
.box dd {font-size:15px;line-height:1.4;margin-bottom:5px}
.box p {margin-bottom:0;font-size:15px;line-height:24px}

.s00 {background-image:url('/groups/library/images/img/info.png') }
.s01 {background-image:url('/groups/library/images/img/help.png') }
.s02 {background-image:url('/groups/library/images/img/notice.png') }
.s03 {background-image:url('/groups/library/images/img/comment.png') }
.s04 {background-image:url('/groups/library/images/img/history.png') }
.video {background-image:url('/groups/library/images/img/video.png') }
.join {background-image:url('/groups/library/images/img/join.png') }
.lib01 {background-image:url('/groups/library/images/sub01/libropia_01.png')}
.s00,.s01,.s02,.s03,.video, .join, .s04, .lib01{ background-position:40px 15px; background-repeat:no-repeat}
.box_guide.q01, .box_guide.q02, .box_guide.q03, .box_guide.q04, .box_guide.q05, .box_guide.q06, .box_guide.q07, .box_guide.q08, .box_guide.q09, .box_guide.q010, .box_guide.q011, .box_guide.lib01, .box_guide.q012, .box_guide.q013  {background-size:88px 88px;background-position:25px 15px;min-height:120px}
@media all and (max-width:480px) {
.box_guide {padding:85px 20px 20px 20px}    
.box_guide dt {text-align:center}
.s00,.s01,.s02,.s03,.video, .join, .s04 {background-size:64px 64px;background-position:50% 10px}
.box_guide.q01, .box_guide.q02, .box_guide.q03, .box_guide.q04, .box_guide.q05, .box_guide.q06, .box_guide.q07, .box_guide.q08, .box_guide.q09, .box_guide.q010, .box_guide.q011, .box_guide.lib01, .box_guide.q012, box_guide.q013 {background-size:64px 64px;background-position:50% 10px}
}

/* table */
.table {margin-bottom:50px;font-size:16px;border-bottom:1px solid #bfeec3}
.table thead th {padding:10px 0;background:#effcf1; color:#60BB46;font-weight:400;border-left:solid 1px #d4d5d9;border-bottom:1px solid #bfeec3}
.table thead tr:first-child th:first-child {border-left:none}
.table tr:first-child {border-top:1px solid #bfeec3}
.table tr {border-top:1px solid #bfeec3}
.table tbody th {padding:10px 0;background:#effcf1;color:#6c6e6f;font-weight:400}
.table tbody td {padding:12px 10px;text-align:center;border-left:solid 1px #d4d5d9;vertical-align:middle;background:#fff}
.table tfoot th {padding:12px 0;background:#c8d0e7;color:#333}
.table tfoot td {padding:10px 10px;text-align:center;background:#f7f7f7;border-left:solid 1px #d4d5d9}
.table td li {position:relative;padding-left:12px;margin-bottom:5px}
.table td li::before {content:"";position:absolute;left:0;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
.table td.nolist {color:#666;font-size:16px;line-height:148px;text-align:center}
@media all and (max-width:640px) {
.table_guide {display:block;position:relative;overflow:hidden;overflow-x:auto;padding-bottom:30px;margin-bottom:50px}
.table_guide::before {content:'iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A??i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¡? i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¤i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¡A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¤i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¡A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¼i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸i??!';display:block;position:absolute;right:10px;bottom:0;width:29px;height:23px;z-index:10;
background:url("/groups/library/images/comm/table_scroll_hint.png") no-repeat left top;background-size:cover;text-indent:-9999px}
.table_guide table {width:1000px;margin-bottom:0}
}

.tbg {background:#ebf4fb}
.table tbody tr:nth-child(1){border:none;}
.table_bN td:nth-child(1){border-left: none!important;}

/* table1 eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?Ai?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´e?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A° i ?e A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠ */
.table1 {margin-bottom:30px;font-size:16px;border-bottom:1px solid #bfeec3}
.table1 thead th {padding:12px 0;background:#effcf1;color:#026B42;font-weight:400;border-top:1px solid #bfeec3}
.table1 tr:first-child {border-top:1px solid #bfeec3}
.table1 tr {border-top:1px solid #e0e0e0}
.table1 tbody th {padding:10px 0;background:#fafafa;color:#6c6e6f;font-weight:400; /*border-right:1px solid #d4d5d9 */}
.table1 tbody td {padding:10px 10px;text-align:center;background:#fff}
.table1 tfoot th {padding:12px 0;background:#c8d0e7;color:#333}
.table1 tfoot td {padding:10px 10px;text-align:center;background:#f7f7f7;border-left:solid 1px #d4d5d9}
.table1 td li {position:relative;padding-left:12px;margin-bottom:8px;text-align:left}
.table1 td li::before{ content:"";position:absolute;left:0;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
.table1 td.nolist {color:#666;font-size:16px;line-height:148px;text-align:center}
@media (max-width:640px) {
.table1 colgroup {display:none}
.table1 thead th {display:none}
.table1 tbody th {display:block;text-align:left; padding:10px}
.table1 tbody th br {display:none}
.table1 tbody td {display:block;text-align:left; border-top:1px solid #e0e0e0}
}

/* table2 i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¼iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A½i ?e A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠ */
.table2 {margin-bottom:30px;font-size:16px;border-bottom:1px solid #bfeec3}
.table2 tr:first-child {border-top:1px solid #bfeec3}
.table2 thead th {padding:12px 0;background:#effcf1;color:#60BB46;font-weight:400;border-top:2px solid #bfeec3}
.table2 tbody tr {border-top:1px solid #e0e0e0}
.table2 tbody th {padding:10px 0;background:#effcf1;color:#6c6e6f;font-weight:400;border-right:1px solid #d4d5d9}
.table2 tbody td {padding:10px 10px;text-align:left;background:#fff}
.table2 tfoot th {padding:12px 0;background:#f0f0f0;color:#333}
.table2 tfoot td {padding:10px 10px;text-align:center;background:#f7f7f7;border-left:solid 1px #d4d5d9}
.table2 td li {position:relative;padding-left:12px;margin-bottom:5px;text-align:left}
.table2 td li::before{ content:"";position:absolute;left:0;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
.table2 td.nolist {color:#666;font-size:16px;line-height:148px;text-align:center}
@media (max-width:640px) {
.table2 colgroup {display:none}
.table2 thead th {display:none}
.table2 tbody th {display:block;text-align:left}
.table2 tbody th br {display:none}
.table2 tbody td {display:block;text-align:left}
}

/* row-style */
.row {overflow:hidden;position:relative}
.row::after, .row::before {content:'';display:block;clear:both}
.left_box {float:left;width:48%}
.right_box {float:right;width:48%}
@media all and (max-width:1007px) {
.left_box, .right_box {float:none;width:100%}   
.right_box {margin-top:50px}    
}

/* tooltip */
.tooltip {display:block;position:absolute;z-index:999;padding:7px 10px;text-align:center;letter-spacing:.5px;white-space:nowrap;font-size:0.92em;background:#454545;color:#fff;opacity:0}
.tooltip::after {content:"";display:block;position:absolute;left:50%;bottom:-3px;margin-left:-3px;width:0;height:0;text-align:center;border-style:solid;border-width:3px 3px 0 3px;border-color:#454545 transparent transparent transparent}

/* 08 eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°?i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸i ?eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A³A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²?e|A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¹A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¨ */
.privacy p{margin-bottom:20px;font-size:16px;line-height:1.5}
.privacy ol, .privacy ul{overflow:hidden;margin:0 0 10px 0}
.privacy ol::after , .privacy ul::after {display:block;clear:both;content:''}
.privacy li {position:relative;padding-left:15px;margin-bottom:5px;font-size:16px;line-height:1.5}
.privacy li::before{ content:"";position:absolute;left:0;top:10px;width:3px;height:3px;background:#999;border-radius:3px}
.privacy li ul li {position:relative;padding-left:15px;font-size:16px;line-height:1.5}
.privacy li ul li::before {content:"";position:absolute;left:0;top:10px;width:8px;height:1px;background:#999}

/* 08  i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A??i?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¼eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¿A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￠A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´e?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¨i??iA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§?eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A±A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°eA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¶A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A */
.bg_email {margin-bottom:40px;border:1px solid #e9e9e9;padding:160px 55px 10px 55px;background:#f8f8f8 url('/groups/library/images/img/bg_email.png') no-repeat 50% 10%}
.bg_email .tit {text-align:center;font-size:24px;color:#222}
.bg_email .point {color:#e95b1c}
.bg_email p {font-size:1.5em;color:#333}

.img_c {text-align:center; margin-bottom:30px}

.bln{border-left:none!important}



/* 01 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.history_top {overflow:hidden; width:100%; padding:20px 0 10px 0; background:url('/groups/library/images/sub01/his_bg.png') no-repeat bottom -0 right 10px; }
.history_top h3 { font-size:2.8em; letter-spacing:-1px; font-weight:600; color:#60BB46}
.history_top p {line-height:1.6; font-size:16px; color:#444; letter-spacing:-1px; margin-top:10px}

.history {margin:0; line-height:1.6}
.history li {position:relative;padding-left:29%;overflow:hidden}
.history .year {display:block;position:absolute;left:0;top:0;width:29%;padding-top:15px;border-top:1px solid #026B42;color:#026B42; font-size:23px}
.history .details {border-top:1px solid #d9d9d9}
.history .details li {position:relative;overflow:hidden; font-size:14px; padding:13px 0 10px 70px; border-top:1px dashed #ccc}
.history .details li:first-child{border-top:none}
.history .details li .month {display:block;position:absolute;left:0;top:0;width:10%;color:#222;text-align:center; padding-top:25px; }
.history .details li ul li {margin-top:10px; position:relative}
.history .details li ul li:first-child {margin-top:0}
.history .details li ul li .date{background:#aaa; color:#fff; padding:5px 10px; border-radius:15px; position:absolute; top:7px; left:0px}
.history .details li ul li img{display:block; margin-top:10px}
@media all and (max-width:800px) {
.history li{padding-left:18%}
.history .year{width:18%}
.history .details li .month{padding-top:22px}
}
@media all and (max-width:640px) {
.history_top {background-size:25%; }
}
@media all and (max-width:480px) {
.history_top{text-align:center; background:none}
.history .year {font-size:18px}
.history .details li{padding:10px 0 10px 50px}
.history .details li .month{width:15%}
.history .details li ul li{padding-left:60px}
.history .details li ul li .date{left:3px}
}
@media all and (max-width:360px) {
.history .details li{padding:10px 0 10px 41px}
}

.tabcnt {display:none }
.tabcnt.active {display:block }


/* 01 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
/* A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.intro_top {position:relative; width:100%; height:260px;  margin-bottom:40px; margin-top:30px; border-radius:40px 0 40px 0}
.intro_top01{background:url('/groups/library/images/sub01/intro_bg.jpg') no-repeat right 0 top 0}
.intro_top02{background:url('/groups/library/images/sub01/intro_bg02.jpg') no-repeat right 0 top 0}
.intro_top03{background:url('/groups/library/images/sub01/intro_bg03.jpg') no-repeat right 0 top 0}
.intro_top div {width:46%; height:260px; position:absolute; bottom:0; left:0; box-sizing:border-box; padding:45px 0 30px 45px; border-radius:40px 0 0 0;  }
.intro_top div *{color:#fff}

.intro_top div.library_01 {background:#60BB46 url('/groups/library/images/comm/bg/dot.png') repeat;}
.intro_top div.library_02 {background:#ffc200 url('/groups/library/images/comm/bg/dot.png') repeat}
.intro_top div.library_03 {background:#F58245 url('/groups/library/images/comm/bg/dot.png') repeat}
.intro_top div.library_04 {background:#7570B3 url('/groups/library/images/comm/bg/dot.png') repeat}

.intro_top div em{display:inline-block; font-size:25px; padding-bottom:10px; margin-bottom:10px}
.intro_top div ul li{font-size:14px; padding:5px 0}
.intro_top div ul li dl dt, .intro_top div ul li dl dd{display:inline-block; letter-spacing:-0.1px}
.intro_top div ul li dl dt{border:1px dotted #fff; border-radius:10px; padding:5px 7px; margin-right:10px}

.intro_time {margin:15px 0;   padding:40px 0; border-top:1px solid #60BB46; border-bottom:1px solid #ccc}
.intro_time ul {display:table; width:100%; margin:0 auto}
.intro_time ul li {display:table-cell; width:25%; vertical-align:top; border-left:1px dashed #ccc; min-height:265px;  text-align:center;}
.intro_time ul li:first-child {border-left:none}
.intro_time ul li .icon{margin-bottom:20px}
.intro_time ul li .icon span {display:inline-block;vertical-align:top;width: 135px;height: 135px;text-align:center;border:1px solid #60BB46;font-size:16px;color:#60BB46;border-radius:50%;padding-top:80px;}
.intro_time ul li .icon01 span{background:url('/groups/library/images/sub01/icon_intro01.png') no-repeat top 25px center}
.intro_time ul li .icon02 span{background:url('/groups/library/images/sub01/icon_intro02.png') no-repeat top 25px center}
.intro_time ul li .time ul{display:block}
.intro_time ul li .time ul li{display:block; min-height:inherit; border-left:none; font-size:14px; padding:5px; width:100%}
.intro_time ul li .time ul li span{display:inline-block; width:30%;  margin-right:15px; padding-right:15px; box-sizing:border-box; font-weight:600; border-right:1px solid #aaa; }

.map{margin-bottom:30px; margin-top:15px; text-align:center;padding:2px;border:solid 1px #C8C8C8;width:100%;height:400px; background:url('/groups/library/images/sub01/map.jpg') no-repeat 0 0}
.map2{margin-bottom:30px; margin-top:15px; text-align:center;padding:2px;border:solid 1px #C8C8C8;width:100%;height:400px; background:url('/groups/library/images/sub01/map2.jpg') no-repeat 0 0}
.map3{margin-bottom:30px; margin-top:15px; text-align:center;padding:2px;border:solid 1px #C8C8C8;width:100%;height:400px; background:url('/groups/library/images/sub01/map3.jpg') no-repeat 0 0}
/*.map4{margin-bottom:30px; margin-top:15px; text-align:center;padding:2px;border:solid 1px #C8C8C8;width:100%;height:400px; background:url('/groups/library/images/sub01/map4.jpg') no-repeat 0 0;}*/
#ma > li{float:left; margin-right:140px;}
.map5{margin-bottom:30px; margin-top:15px; text-align:center;padding:2px; width:100%;height:400px; background:url('/groups/library/images/sub01/map5.jpg') no-repeat 0 0}
@media all and (max-width:480px) {.map4 {background:url('/groups/library/images/sub01/map4_2.jpg') no-repeat 35% 0; height:330px}}  
http://design.wekm.co.kr:8006/groups/library/search2.php


/*02 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AμA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?Aⓒ A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.selbox2 { overflow:hidden; position: relative; padding:10px 20px; background:#f5f5f5;}
.selbox2 dt {position:relative;padding:0 0 10px 20px;font-size:16px;font-weight:600;color:#0d8f1f}
.selbox2 dt::before {position:absolute;top:3px;left:0;content:"";display:block;width:6px;height:6px;border:3px solid #0d8f1f;border-radius:6px} 
.selbox2 dd {padding:5px 10px;font-size:15px;}
.selbox2 .lib_list2 {overflow:hidden;margin-bottom:0}
.selbox2 .lib_list2 li {float:left;position:relative;padding:3px 30px 3px 0}
.selbox2 .allcheck{position:absolute;top:10px;right:20px}
.search_detail2 {overflow:hidden;position:relative;margin-bottom:30px;padding:10px;background:#f5f5f5}
.search_detail2 dl {display:inline-table;width:33%}
.search_detail2 dl::after {display:block;clear:both;content:''}
.search_detail2 dl dt {display:table-cell;width:30%;padding:2px;font-size:15px;font-weight:400;text-align:right}
.search_detail2 dl dd {display:table-cell;width:70%;padding:2px;font-size:15px;text-align:left}
.search_detail2 dl dd input[type="text"], .search_detail2 dl dd input[type="date"] {width:100%;margin-top:5px}
@media all and (max-width:768px) {
.selbox2 .lib_list li {float:none;width:100%}
.search_detail2 dl {float:none;width:100%}
.search_detail2 .right {margin-top:20px}
}

@media all and (max-width:1007px) {

}

@media all and (max-width:800px) {
.intro_top{background-position:right -30px top 0}
.intro_top div { padding:45px 0 30px 30px}
}
@media all and (max-width:700px) {
.intro_top div{width:50%}
}

@media all and (max-width:640px) {
.intro_top {height:220px}
.intro_top div{height:220px; opacity:0.93; width:100%; text-align:center; border-radius:40px 0 40px 0; padding:30px 0 30px 0}
.intro_top div em{border-bottom:1px dashed #eee}
.intro_time ul li .time ul li span{width:37%;margin-right:10px; padding-right:10px}
}
@media all and (max-width:480px){
.intro_time{padding:20px 0}
.intro_time ul li .time ul li span{display:block; width:100%; border-right:none; padding-right:0; margin-right:0; margin-bottom:10px}
}

/* A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¤A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A³A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´ */
.intro_room{float:left; width:50%; margin-bottom:40px; padding:0 1.8%}
.intro_room .left, .intro_room .right{vertical-align:top}
.intro_room .left{width:100%}
.intro_room .left img{ border:1px solid #dedede;  border-radius:25px 0 25px 0}
.intro_room .right h5{margin-top:25px; border-bottom:1px solid #60BB46; padding-bottom:15px; padding-left:0}
.intro_room .right h5:before{width:0; height:0; border:none}
.intro_room .right h5 span{font-size:14px; font-weight:normal; background:#60BB46; color:#fff; padding:2px 5px; margin-right:10px; border-radius:5px 0 5px 0}
.intro_room .right p{background:#f8f8f8; border-top:1px dashed #dedede; border-bottom:1px dashed #dedede; padding:10px 8px; margin:20px 0 15px 0}
.intro_room .right dl{overflow:hidden}
.intro_room .right dl dt, .intro_room .right dl dd{font-size:14px; float:left; padding:6px 0; letter-spacing:-0.1px; line-height:1.6}
.intro_room .right dl dt{font-weight:600; clear:both; width:19%; position:relative; padding-left:15px}
.intro_room .right dl dt:before{content:"";position:absolute;left:4px;top:12px;width:3px;height:3px;background:#999;border-radius:3px}

.intro_room2{float:left; width:50%; margin-bottom:40px; padding:0 1.8%}
.intro_room2 .left, .intro_room .right{vertical-align: top;}
.intro_room2 .left{width:100%;}
.intro_room2 .left img{ border:1px solid #dedede;  border-radius:25px 0 25px 0;}
.intro_room2 .right h5{margin-top:25px; border-bottom:1px solid #60BB46; padding-bottom:15px; padding-left:0;}
.intro_room2 .right h5:before{width:0; height:0; border:none;}
.intro_room2 .right h5 span{font-size:14px; font-weight:normal; background:#60BB46; color:#fff; padding:2px 5px; margin-right:10px; border-radius:5px 0 5px 0;}
.intro_room2 .right p{background:#f8f8f8; border-top:1px dashed #dedede; border-bottom:1px dashed #dedede; padding:10px 8px; margin:20px 0 15px 0;}
.intro_room2 .right dl{overflow:hidden;min-height: 240px;}
.intro_room2 .right dl dt, .intro_room2 .right dl dd{font-size:14px; float:left; padding:6px 0; letter-spacing:-0.1px; line-height:1.6;}
.intro_room2 .right dl dt{font-weight:600; clear:both; width:19%; position:relative; padding-left:15px;}
.intro_room2 .right dl dt:before{content:"";position:absolute;left:4px;top:12px;width:3px;height:3px;background:#999;border-radius:3px}

@media all and (max-width:1180px){
.intro_room .right dl dt{width:25%;}
.intro_room2 .right dl dt{width:25%;}
}
@media all and (max-width:640px){
.intro_room{float:inherit; width:100%;}
.intro_room .right dl dt{width: 100%; border-bottom:1px dashed #ccc; border-top:1px dashed #ccc; background:#effcf1;}
.intro_room .right dl dd{width:100%; padding-left:20px;}
.intro_room .right dl dt:first-child{margin-top:10px;}
.intro_room .right dl dd:last-child{border-bottom:1px dashed #ccc;}
.intro_room2{float:inherit; width:100%;}
.intro_room2 .right dl dt{width: 100%; border-bottom:1px dashed #ccc; border-top:1px dashed #ccc; background:#effcf1;}
.intro_room2 .right dl dd{width:100%; padding-left:20px;}
.intro_room2 .right dl dt:first-child{margin-top:10px;}
.intro_room2 .right dl dd:last-child{border-bottom:1px dashed #ccc;}

}
@media all and (max-width:480px){
}

/*01 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¼ */
.btns.big.icon.search::before{background:url('/groups/library/images/comm/btn_icon/search.png') no-repeat 0 center}
.btns.big.icon.check::before{background:url('/groups/library/images/comm/btn_icon/check.png') no-repeat 0 center}
.btns.big.icon.close::before{background:url('/groups/library/images/comm/btn_icon/close.png') no-repeat 0 center}
.btns.big.icon.book::before{background:url('/groups/library/images/comm/btn_icon/book.png') no-repeat 0 center}

/* 01 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AⓒA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´ */
.service{position:relative; border:10px solid #eee; padding:25px 40px 40px 40px}
.service:before{content:''; position:absolute; top:-10px; left:-10px; width:25px; height:25px; border-top:10px solid #026B42; border-left:10px solid #60BB46; }
.service:after{content:''; position:absolute; bottom:-10px; right:-10px; width:25px; height:25px; border-bottom:10px solid #026B42; border-right:10px solid #60BB46; }
.service h6{text-align:center; font-family:'NanumBrush'; font-size:45px; margin-bottom:30px; color:#60BB46; padding-left:0; font-weight:500}
.service h6:before{width:0px; height:0px}
.service div {font-size:14px; background:#f8f8f8; border:1px dashed #ccc; padding:20px; line-height:1.7; margin:20px 0; border-radius:15px 0 15px 0}
.service ul li{font-size:14px; padding:10px 0 10px 35px; line-height:1.7; background:url('/groups/library/images/sub01/bul_check.gif') no-repeat 8px 12px}
.service+p {text-align:center; margin-top:25px; font-weight:600; }

/* 02 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¨A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¤A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?*/
.lib_list{overflow:hidden; margin-bottom:20px}
.lib_list li{float:left;width:20%;position:relative;padding:10px 0}
.lib_list.last li{width:33.3%}
.lib_list.last li:last-child{width:66.6%}
#libMapImg{width:100%;max-height:390px;overflow:hidden}

/* 04 KOCW */
.search_box02 .search01 select{width:14%}
.search_box02 .search01 input{width:50%}
.search_box02 .search02{margin-top:15px}
.search_box02 .search02 label{font-size:0}
.search_box02 .search02 input{width:22%}
.search_box02 .search02 button{margin-left:7px}

.result_part{position:relative; overflow:hidden; border:1px solid #ccc; margin-bottom:10px}
.result_left p{margin-bottom:0}
.result_left p span{display:inline-block; padding:20px 30px;  font-weight:700; margin-right:20px; background:#60BB46; color:#fff}
.result_right{position:absolute; top:16px; right:20px}
.result_right select{display:inline-block;vertical-align:middle}
.result_right dl{overflow:hidden; display:inline-block;vertical-align:middle; margin-left:15px}
.result_right dl dt{float:left; font-size:14px; }
.result_right dl dd{float:left}
.result_right dl dd a.asc{overflow:hidden; float:left; width:21px; height:20px; margin:0 0 0 5px; border:0; font-size:0; text-indent:-9999px; background:url(/groups/library/images/comm/board/off_btn.gif) no-repeat; cursor:pointer}
.result_right dl dd a.asc.on{overflow:hidden; float:left; width:21px; height:20px; margin:0 0 0 5px; border:0; font-size:0; text-indent:-9999px; background:url(/groups/library/images/comm/board/on_btn.gif) no-repeat; cursor:pointer}
.result_right dl dd a.des{overflow:hidden; float:left; width:21px; height:20px; margin:0 0 0 5px; border:0; font-size:0; text-indent:-9999px; background:url(/groups/library/images/comm/board/off01_btn.gif) no-repeat; cursor:pointer}
.result_right dl dd a.des.on{overflow:hidden; float:left; width:21px; height:20px; margin:0 0 0 5px; border:0; font-size:0; text-indent:-9999px; background:url(/groups/library/images/comm/board/on01_btn.gif) no-repeat; cursor:pointer}

.search_list{padding:25px 10px;  border-bottom:1px dashed #ccc; }
.search_list dt{font-size:16px; font-weight:600; margin-bottom:10px}
.search_list dd{font-size:14px; padding:3px 0}
.search_list dd strong{margin-right:10px}
.search_list dd.info{background:#f5f5f5; padding:10px; margin-top:7px; line-height:1.5}

@media all and (max-width:800px){
.search_box02 .search01 select{vertical-align:top}
.search_box02 .search02{margin-top:8px}
}

@media all and (max-width:550px){
.search_box02 .search01 select{width:20%}
.search_box02 .search01 input{width:70%}
.search_box02 .search02 input{width:35%}
.result_left p{padding:20px 17px}
.result_left p span{display:none}
}

@media all and (max-width:430px){
.result_right{position:static; margin-top:-10px; margin-left:17px; padding-bottom:20px}
}

/* 03 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AμA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¤A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.movie{overflow:hidden}
.movie{position:relative;float:left;width:47%;margin:1.5%;border:1px solid #ccc;border-radius:15px 0 15px 0;padding:3% 3% 7% 3%;box-sizing:border-box}
.movie dt{position:relative;display:inline-block;vertical-align:top;width:28%;margin-bottom:20px;margin-right:5px}
.movie dt img{width:80px; height:114px}
.movie dd{display:inline-block;font-size:14px;vertical-align:top;width:68%}
.movie dd strong{display:inline-block;font-size:20px;font-family:'NanumMyeongjoBold';font-weight:500;letter-spacing:-0.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
.movie dd strong span {font-size:16px;vertical-align:top}
.movie dd ul li{padding:3px 0}
.movie dd ul li:first-child{color:#888}
.movie dd ul li em{margin-bottom:0;line-height:1.6;margin-right:8px;padding:1px 10px;background:#f0f0f0;border-radius:5px 0 5px 0;border:1px solid #e0e0e0;box-sizing:border-box;font-weight:500}
.movie dd ul li:last-child{position:absolute;bottom:15px;left:5%;width:86%;border:1px solid #ccc;text-align:center;padding:7px 0;margin-top:8px;border-radius:25px;background:#026B42;padding:8px 0}
.movie dd ul li:last-child a{display:block; color:#fff}
@media all and (max-width:667px){
.movie {padding:3% 3% 15% 3%;height:330px}
.movie dt {display:block; width:100%;text-align:center}
.movie dd {display:block; width:100%}
.movie dd ul li:last-child {width:90%}
}
@media all and (max-width:414px){
.movie {height:360px}
}

/*05 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢ */
.volunteer ul{padding:10px 0}
.volunteer ul li::before{width:0px; height:0px}
.btn_homepage .home{padding-left:40px; background:url('/groups/library/images/comm/btn_icon/home.png') no-repeat 8px center; }
.btn_apply{text-align:center}
.btn_apply .apply{color:#fff; padding-left:30px;  background:#026B42 url('/groups/library/images/comm/btn_icon/write_wh.png') no-repeat 20px center}

.calendar_table tbody tr td .apply{margin:0 5px}
.calendar_table tbody tr td .apply li{position:relative; padding-left:10px}
.calendar_table tbody tr td .apply li:before{content:"";position:absolute;left:0;top:8px;width:5px;height:1px;background:#999; transform:none; border-left:none; border-top:none}
.calendar_table tbody tr td .apply li.btn{padding-left:0}
.calendar_table tbody tr td .apply li.btn:before{width:0; height:0}
.calendar_table tbody tr td .apply li a{display:block; text-align:center; background:#60BB46; color:#fff; border-radius:5px 0 5px 0; margin-top:5px}
.calendar_table tbody tr td .rest{display:block; color:#dc372b; text-align:center}

.board_list tbody tr td.state span{display:inline-block; padding:3px; margin-left:5px; background:#60BB46; }
.board_list tbody tr td.state span a{display:block; color:#fff}

/*06 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­ */
.step_list{overflow:hidden}
.step_list li{display:block;float:left;position:relative;width:23.5%;min-height:76px; margin:0 0.75%}
.step_list li div{position:absolute;top:0;left:0;width:70px;height:70px}
.step_list li .step1{background:url('/groups/library/images/sub06/icon_step01.png') no-repeat 0 center}
.step_list li .step2{background:url('/groups/library/images/sub06/icon_step02.png') no-repeat 0 center}
.step_list li .step3{background:url('/groups/library/images/sub06/icon_step03.png') no-repeat 0 center}
.step_list li .step4{background:url('/groups/library/images/sub06/icon_step04.png') no-repeat 0 center}
.step_list strong{display:inline-block;margin:8px 0 10px 85px; padding:0 48px 5px 0; font-family:'NanumMyeongjoBold'; background:url('../images/program/join_bul.png') no-repeat right 3px;border-bottom:1px solid #026B42;color:#666;font-size:16px;line-height:18px; position:relative}
.step_list strong:before{position:absolute;right:2px;bottom:-7px;display:block;transform:rotate(225deg);width:13px;height:13px;background:transparent;border-bottom:1px solid #026B42;content:""}
.step_list p{margin:5px 0 15px 85px;color:#666}
@media all and (max-width:800px) {
.step_list li .step1, .step_list li .step2, .step_list li .step3, .step_list li .step4{background-size:70%}
.step_list strong{margin:8px 0 10px 58px}
.step_list p{margin:5px 0 15px 58px}
}
@media all and (max-width:640px) {
.step_list li{width:48%}
.step_list strong, .step_list p{width:70%}
}
@media all and (max-width:480px) {
.step_list li{float:none; width:99%; text-align:center; min-height:auto; background:#026B42; margin-bottom:30px; padding:10px; border-radius:20px}
.step_list li:before {position:absolute;top:-5px;left:0;margin-top:-10px;content:'';display:block;width:10px;height:10px;background:transparent;border-left:2px solid #ccc;border-bottom:2px solid #ccc;transform:rotate(-135deg);transition:all .3s ease-in-out; left:50%;margin:-20px 0 0 -10px;transform:rotate(-45deg)}
.step_list li .step1, .step_list li .step2, .step_list li .step3, .step_list li .step4{background:none; width:0; height:0}
.step_list strong{margin:0; width:99%; padding:0; border-bottom:none;color:#fff}
.step_list strong:before{width:0; height:0}
.step_list p{margin:0; width:99%;color:#fff}
}
/*step_list2*/
.step_list2{overflow:hidden;margin: 25px 0;}
.step_list2 li{display:block;float:left;position:relative;width: 20.5%;min-height: 145px;border: 1px solid #026B42;border-radius: 5px;text-align: center;margin-right: 6%;}
.step_list2 li:before{position:absolute;right: -28px;top: 50%;margin-top:-10px;content:'';display:block;width:10px;height:10px;background:transparent;border-left:2px solid #ccc;border-bottom:2px solid #ccc;transform:rotate(-135deg);transition:all .3s ease-in-out;}
.step_list2 li:last-child {margin-right:0}
.step_list2 li:last-child:before {display:none}
.step_list2 strong{display: block;font-family:'NanumMyeongjoBold';color: #fff;font-size:16px;background: #026B42;padding: 10px 0;}
.step_list2 p{color:#666;margin-bottom: 0;padding: 13px 5px;} 
.step_list2.smart li {width:27%; min-height:140px; margin-bottom:15px}
@media all and (max-width:720px) {
.step_list2 li {min-height:170px}
}

@media all and (max-width:640px) {
.step_list2 li {width: 43%;margin: 0 5% 10px 1%;%;}
.step_list2 li:before {right: -21px;}
.step_list2 li p {padding: 13px 15px;}
}

@media all and (max-width:480px) {
.step_list2 li{float:none; width:99%; text-align:center; min-height:auto; background:#026B42; margin-bottom:30px; padding:10px; border-radius:20px;}
.step_list2 li:before {position:absolute;top:-5px;left:0;margin-top:-10px;content:'';display:block;width:10px;height:10px;background:transparent;border-left:2px solid #ccc;border-bottom:2px solid #ccc;transform:rotate(-135deg);transition:all .3s ease-in-out; left:50%;margin:-20px 0 0 -10px;transform:rotate(-45deg)}
.step_list2.smart li{float:none; width:99%; text-align:center; min-height:auto; background:#026B42; margin-bottom:30px; padding:10px; border-radius:20px;} 
.step_list2 li:last-child:before {display:block}
.step_list2 strong{margin:0; width:99%; padding:0; border-bottom:none;color:#fff;}
.step_list2 p{width:99%;color:#fff;}
}



/* 06 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­_A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A²A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­*/
.total_articles.article{padding-bottom:15px; border-bottom:2px solid #151515; margin-bottom:0}
.search_list01{padding:25px 10px;  border-bottom:1px dashed #ccc; }
.search_list01 dt, .search_list01 dd{display:inline-block}
.search_list01 dt{width:15%; vertical-align:top}
.search_list01 dt .image{display:block;position:relative;width:100px;height:131px;background:url('/groups/library/images/sub06/img_book_b.png') no-repeat 0 0}
.search_list01 dt .image img {position:absolute;top:4px;left:5px; width:91px; height:125px}
.search_list01 dt p{margin-bottom:0; margin-top:10px; padding:5px; background:#60BB46; text-align:center; width:98px; border-radius:15px 0 15px 0}
.search_list01 dt p a{display:block; color:#fff}
.search_list01 dd{width:84%; vertical-align:top}
.search_list01 dd strong{display:inline-block; font-size:16px; font-weight:600; margin-bottom:4px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; width:100%; }
.search_list01 dd ul li{font-size:14px;  padding:3px 0; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; width:100%}
.search_list01 dd ul li:first-child{padding:3px 0 5px 0; color:#888}
.search_list01 dd ul li em{font-size:14px; margin-bottom:0; line-height:1.6; margin-right:8px; padding:1px 10px; background:#f0f0f0; border-radius:5px 0 5px 0; border:1px solid #e0e0e0; box-sizing:border-box; font-weight:500}
.search_list01 dd ul li:last-child{height:51px; overflow:hidden; margin-top:5px; white-space:normal; overflow:hidden}
.search_list01 dt ul{margin-top:10px}
.search_list01 dt ul li{display:inline-block; width:40%; border:1px solid #ccc; padding:7px 0; text-align:center; border-radius:10px 0 10px 0; }
.search_list01 dt ul li a{color:#fff}
.search_list01 dt ul li:first-child{background:#60BB46}
.search_list01 dt ul li:last-child{background:#353535}
.search_list01 dt ul li a{display:block}
.search_list01 dd.user_info{background:#f7f7f7; width:100%; margin-top:20px; padding:20px; box-sizing:border-box; border-radius:10px}
.search_list01 dd.user_info strong{position:relative; padding-left:20px}
.search_list01 dd.user_info strong:before{position:absolute;top:4px;left:4px;content:"";display:block;width:7px;height:7px;background:#888;border-radius:7px}
.search_list01 dd.user_info ul{overflow:hidden}
.search_list01 dd.user_info ul li{ float:left; width:50%; padding:7px 0; }
.search_list01 dd.user_info ul li em{padding:5px 10px; font-weight:500; background:#fff; text-align:center}
.search_list01 dd.user_info ul li:last-child{height:auto; width:100%; margin-top:-0.3px}
.search_list01 dd.user_info ul li:last-child em, .search_list01 dd.user_info ul li:last-child span{display:table-cell; vertical-align:top}
.search_list01 dd.user_info ul li:last-child em{width:16%}
.search_list01 dd.user_info ul li:last-child span{width:80%; padding-left:15px; box-sizing:border-box}

.mask01, .mask02, .mask03 {position:absolute;top:-5px;left:-10px;display:block;z-index:1;width:43px;height:30px; text-align:center; color:#fff; padding-top:5px; }
.mask01 {background:url('/groups/library/images/sub06/mask01.png') no-repeat 0 50%; background-size:100%}
.mask02 {background:url('/groups/library/images/sub06/mask02.png') no-repeat 0 50%;  background-size:100%}
.mask03 {background:url('/groups/library/images/sub06/mask03.png') no-repeat 0 50%;  background-size:100%}

@media all and (max-width:768px) {
.search_list01 dt{width:19%; }
.search_list01 dd{width:80%}
}
@media all and (max-width:600px) {
.search_list01 dt ul li{width:90%; display:block}
.search_list01 dt{width:24%; }
.search_list01 dd{width:75%}
.search_list01 dd.user_info ul li{float:inherit; width:100%; padding:5px 0}
.search_list01 dd.user_info ul li:last-child em, .search_list01 dd.user_info ul li:last-child span{display:inline-block}
.search_list01 dd.user_info ul li:last-child em{width:inherit}
.search_list01 dd.user_info ul li:last-child span{width:100%; padding-left:0; margin-top:10px}
.search_list01 dd.user_info ul li:last-child{margin-top:-3px}
}
@media all and (max-width:450px) {
.search_list01 dt .image{width:70px;height:92px; background-size:100%}
.search_list01 dt .image img {width:62px; height:85px}
.search_list01 dt p{width:70px}
.search_list01 dt{width:23%; }
.search_list01 dd{width:75%}
}
@media all and (max-width:380px) {
.search_list01 dt{width:25%}
.search_list01 dd{width:73%}
.search_list01 dt .image{width:60px; height:79px}
.search_list01 dt .image img{width:52px; height:73px}
.search_list01 dt p{width:60px; font-size:12.5px}
}

/* 07 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?AªA?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A */
.sm_lib_box{position:relative; overflow:hidden}
.sm_lib{float:left; width:47%; margin:1.5%; padding:3.5% 3.8%; background:#fff; box-sizing:border-box; border:1px solid #ccc; border-radius:25px 0 25px 0}
.sm_lib dl dt{position:relative;font-size:20px; font-family:'NanumMyeongjoBold'; text-align:center; letter-spacing:-0.5px; padding-top:13px; margin-bottom:15px}
.sm_lib dl dt:before{content:""; position:absolute; width:30px; height:2px; background:#60BB46; top:0; left:50%; margin-left:-15px}
.sm_lib dl dd{display:table; width:100%;font-size:15px;  line-height:1.7; }
/*.sm_lib dl dd.thumb{margin:20px auto; width:82.5%; height:190px;  box-sizing:border-box;text-align:center; border-radius:25px 0 25px 0; } 
.sm_lib dl dd.thumb img{height:190px; width:auto; max-width:100%; border-radius:25px 0 25px 0}
.sm_lib dl dd.thumb span{height:190px; width:100%; border:1px solid #dedede; line-height:190px; background:#f8f8f8; border-radius:25px 0 25px 0}*/
.sm_lib dl dd strong{display:table-cell; width:25%; color:#60BB46;vertical-align:top}
.sm_lib dl dd span{display:table-cell; vertical-align:top; }
.sm_lib dl dd.add span{display:inline-block; height:51px; overflow:hidden}
.sm_lib dl dd.btn{display:inline-block; width:100%; border:1px solid #ccc; text-align:center; padding:7px 0; margin-top:15px; border-radius:25px; background:#026B42 }
.sm_lib dl dd.btn a{display:block; color:#fff}
.sm_lib dl dd.btn:hover{border:1px solid #60BB46; -webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out}

@media all and (max-width:640px) {
.sm_lib{padding:3.5% 2.5%}
.sm_lib dl dt{height:57px; overflow:hidden}
.sm_lib dl dd{font-size:14px}
.sm_lib dl dd.thumb{margin:5px auto 15px auto}
.sm_lib dl dd strong{width:34%}
.sm_lib dl dd.add span{display:inline-block; height:43px; overflow:hidden}
.sm_lib dl dd.thumb span{max-height:inherit}
.sm_lib dl dd.btn{margin-top:7px}
}

@media all and (max-width:480px) {
.sm_lib{width:100%}
.sm_lib dl dt{height:auto; margin-bottom:10px; overflow:visible}
.sm_lib dl dd.thumb{margin:5px auto 15px auto}
.sm_lib dl dd strong{width:32%; text-align:right; padding-right:15px}
.sm_lib dl dd.add span{height:auto; overflow:visible}
}


.layer{position:absolute; top:0; left:0; width:70%; left:50%; margin-left:-35%; top:20%;background:#fff; padding:20px;  z-index:2}
.layer h2{text-align:center; margin:-20px -20px 0 -20px; padding:20px; color:#fff; margin-bottom:20px; background:#60BB46 url('/groups/library/images/comm/bg/dot.png') repeat} 
.layer .txt{overflow:hidden}
/*.layer .txt .thumb{float:left; margin-right:30px}*/
.layer .txt dl {overflow:hidden}
.layer .txt dl dt, .layer .txt dl dd{font-size:14px; float:left; line-height:1.7; margin:5px 0; }
.layer .txt dl dt{width:16%; border:1px dotted #026B42; text-align:center; margin-right:15px; border-radius:10px 0 10px 0; color:#60BB46}
.layer .txt dl dt:nth-child(5){clear:both; }
.layer .txt dl dd{width:31%}
.layer h6{margin-top:7px}
.layer .map_box{clear:both; position:relative} 
.layer .map_box .info{position:absolute;  top:10px; left:10px; width:45%; border:1px solid #ddd; background:rgba(255,255,255,0.9); z-index:100; border-radius:25px 0 25px 0}
.layer .map_box .info dl{padding:0 10px 10px 10px}
.layer .map_box .info dl dt{margin:15px 5px 5px 5px; color:#333; line-height:19px; font-size:15px; font-weight:bold; text-align:left}
.layer .map_box .info dl dd{font-size:13px; line-height:1.6; text-align:left}
.layer .btn_close {position:absolute;top:10px;right:10px;z-index:10}
.layer .btn_close a {display:block;width:36px;height:36px;text-indent:-999em;background:url('/groups/library/images/comm/btn_icon/btn_close.png') no-repeat 50% 50%}


.layer01{width:46%; border:1px solid #ccc; margin-left:-23%;  height:65%;overflow:auto}
.layer01 .txt .thumb{float:left; margin-right:20px; border:1px solid #ccc; padding:7px; border-radius:5px; margin-bottom:15px}
.layer01 .txt .thumb img{width:110px; height:157px}
.layer01 .txt dl dt{clear:both; width:31%}
.layer01 .txt dl dd{width:auto}
.layer01 h6{background:#f8f8f8; padding:15px 0 15px 20px; border-top:1px solid #dedede; border-bottom:1px solid #dedede}
.layer01 h6::before{top:18px}
.layer01 .movie_detail dl{overflow:hidden}
.layer01 .movie_detail dl dt, .layer01 .movie_detail dl dd{font-size:14px; float:left; line-height:1.7; margin:5px 0; }
.layer01 .movie_detail dl dt{clear:both; width:20%; border:1px dotted #026B42; text-align:center; margin-right:15px; border-radius:10px 0 10px 0; color:#60BB46}
.layer01 .movie_detail p{clear:both; padding:10px; margin-bottom:0; border-top:1px dashed #ccc; margin-top:7px}

@media all and (max-width:800px) {
.layer{width:84%; margin-left:-42%}
.layer .txt .thumb{margin-right:15px}
.layer .txt dl dt{width:16%; }
.layer .txt dl dd{width:26%}
.layer01 .txt dl dt{width:22%}
.layer01 .txt dl dd{width:auto}
}
@media all and (max-width:640px) {
.layer h2{margin-bottom:5px}
.layer .txt dl{margin-top:15px}
.layer .txt dl dt{width:18%; }
.layer .txt dl dd{width:25%}
.layer .map_box .info{position:static; width:100%; padding:5px }
.layer .map_box .map{margin-bottom:0; height:330px}
.layer01 h2{margin-bottom:20px}
.layer01 .txt dl{margin-top:0}
.layer01 .txt dl dt{width:32%; margin-right:7px}
.layer01 .txt dl dd{width:auto}
}
@media all and (max-width:480px) {
.layer h2{text-align:left; padding:20px 50px 20px 20px}
.layer .txt dl dt:nth-child(7){clear:both; width:26% }
.layer .txt dl dd:nth-child(8){width:60%}
.layer01{height:40%}
.layer01 .txt .thumb img{width:80px; height:114px}
}
@media all and (max-width:400px) {
.layer .txt .thumb{float:none; text-align:center}
.layer01 .movie_detail dl dt{width:33%}
}

/* 08 A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A´A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A­A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A¸A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A§A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?Aμ */
.site_map{overflow:hidden; border-top:2px solid #60BB46; border-bottom:1px solid #dedede}
.site_map li{border-top:1px solid #dedede; padding:20px 0}
.site_map li p{display:inline-block; width:20%; vertical-align:top; font-weight:600; color:#60BB46; font-size:20px}
.site_map li .sub_menu{display:inline-block; overflow:hidden; width:79.5%}
.site_map li .sub_menu li{float:left;  width:23%; margin:0 1% 1.8% 1%;  padding:0; font-size:13px;  font-weight:500;  border-top:none; position:relative}
.site_map li .sub_menu li:before{position:absolute;top:12px;right:10px;content:'';display:block;width:8px;height:8px;background:transparent;border-left:1px solid #888;border-top:1px solid #888;transform:rotate(130deg)}
.site_map li .sub_menu li a{display:block; background:#f5f5f5; border:1px solid #e8e8e8; line-height:30px; border-radius:15px 0 15px 0; padding-left:8px; box-sizing:border-box; letter-spacing:-0.1px; font-weight:500} 
.site_map li .sub_menu li:nth-child(4n+1){clear:both}
.site_map li .sub_menu li ul{margin-top:10px}
.site_map li .sub_menu li ul li{ float:inherit; width:100%;  border:none; padding-left:15px; position:relative}
.site_map li .sub_menu li ul li:before{content:"";position:absolute;left:0;top:15px;width:6px;height:1px;background:#999; transform:none; border-left:none; border-top:none}
.site_map li .sub_menu li ul li a{background:#fff; margin:0; border:none; padding-left:0}

@media all and (max-width:768px) {
.site_map li p{width:100%; text-align:center}
.site_map li .sub_menu{width:100%}
}

@media all and (max-width:600px) {
.site_map li .sub_menu li{width:31.3%}
.site_map li .sub_menu li:nth-child(3n+1){clear:both}
.site_map li .sub_menu li:nth-child(4n+1){clear:none}
}

@media all and (max-width:380px) {
.site_map li .sub_menu li{width:48%}
.site_map li .sub_menu li:nth-child(2n+1){clear:both}
.site_map li .sub_menu li:nth-child(3n+1){clear:none}
}

/* A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A°A?A?A?A?A?A?A?AⓒA?A?A?A?A?A?A?A≪A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A￢A?A?A?A?A?A?A?A?A?A?A?A?A?A?A?A? */
.book_item {position:relative; border-bottom:1px solid #dedede; padding:20px 0}
.book_item p {margin-bottom:5px}
.book_info span {color:#999; display:inline-block; padding:0 10px; border-right:1px solid #dedede; font-size:0.9em}
.book_info span:first-child {padding-left:0px}
.book_info span:last-child {border:none}
.book_box2 {overflow:hidden}
.book_box2:after {content:''; display:table; clear:both}
.book_box2 .left {float:left; width:15%}
.book_box2 .left .book_img img {border:1px solid #dedede; box-shadow:3px 3px 8px #ccc; padding:3px; margin:5px auto; width:90px}
.book_box2 .right {float:right; width:85%}
.book_box2 table {width:100%; border-left:1px solid #dedede; margin:5px 0}
.book_box2 table tr:first-child {border-top:1px solid #dedede}
.book_box2 table tbody th {font-weight:600; background:#ebe7e3; text-align:center; border-right:1px solid #dedede; border-bottom:1px solid #dedede; vertical-align:middle; padding:4px 8px}
.book_box2 table tbody td {border-right:1px solid #dedede; border-bottom:1px solid #dedede; vertical-align:middle; padding:4px 8px}

@media all and (max-width:768px) {
.book_item h2 {width:80%}
.book_img {position:absolute; right:0; top:10px; background-color:#fff}
.book_box2 .right {float:none; width:100%}
.book_box2 table {display:block}
.book_box2 table tbody th {width:25%;float:left;clear:left;display:block;min-height:23px}
.book_box2 table tbody td {width:75%;float:left;clear:right;display:block;min-height:23px}
.book_info span {display:block; border:none; padding:0}
}

@media all and (max-width:480px) {
.book_item h2 {width:100%}
.book_box2 .left .book_img {display:none}
}

.libropia_img ul {display:table; width:100%; margin:0 auto}
.libropia_img ul li {display:table-cell;width:50%; text-align:center}
.libropia_img ul li p {padding:10px 0; margin:0}

/* 컨텐츠 준비중 */
.no_contents2 {width:100%; text-align:center; margin:0 auto;}
/* 참여마당 > 독서동아리 > 독서동아리 활동게시판 */
.club_list {overflow:hidden; margin-top:30px}
.club_list li {position:relative; float:left; width:32.2%; margin:0 1.5% 12px 0; border:2px solid #eee; font-size: 14px}
.club_list li:before {content:'';position:absolute; top:13px;left: 10px;width: 4px;height: 18px;background: #026B42}
.club_list li:after {content:'';position:absolute; top:26px; left:10px; width:4px; height:5px; background: #ccc}
.club_list li a {display:block; padding:14px 5px 14px 26px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.club_list li:nth-child(3n) {margin-right:0}
.td_pd tbody td {padding:9px 0} 
.hr {display:block; width:100%; margin:35px 0; border-bottom:1px dashed #ccc}
.club_box {width:100%; padding:15px 20px; margin-bottom:30px; border:1px solid #dedede}
@media all and (max-width:640px) {
    .club_list li {margin-bottom:10px}
}
@media all and (max-width:600px) {
    .club_list li {width: 49%}
    .club_list li:nth-child(3n) {margin-right:1.6%}
    .club_list li:nth-child(2n) {margin-right:0}
}
@media all and (max-width:414px) {
    .club_list li {width:100%; margin-right:0}
}
.font-size {font-size:15px!important}

/* 20200806 북큐레이션 photo_list */
.photo_list {overflow:hidden;border-top:2px solid #151515;border-bottom:1px solid #ddd;font-size:15px;}
.photo_list ul {position:relative;padding:30px 0 10px 0;height:100%;overflow:hidden}
.photo_list ul li {float:left;margin-bottom:30px;width:25%}
.photo_list ul li a {overflow:hidden;position:relative;display:block;margin:5px;text-align:center}
.photo_list ul li .thumb {display:block;height:200px;transition:all 0.5s}
.photo_list ul li .thumb img {height:100%}
.photo_list ul li .con {position:absolute;left:0;bottom:0;width:100%;height:100%;text-align:center;line-height:21px;background:rgba(0,0,0,0);transition:all 0.5s}
.photo_list ul li > a > .con > .tit {position:absolute;top:75%;left:0;width:98%;padding-left:2%;color:#fff;font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all 0.2s;z-index:2}
.photo_list ul li > a > .con > .date {position:absolute;left:0;bottom:4%;width:100%;transition:all 0.2s;z-index:2;color:#fff}
.photo_list ul li > a > .con::after {position:absolute;left:0;bottom:0;padding:10px;width:100%;height:20%;content:'';background:rgba(0,0,0,0.5);transition:all 0.2s;z-index:1}
.photo_list ul li > a:hover > .con::after {background:rgba(0,0,0,0.8)}
@media all and (max-width:1007px) {
.photo_list ul li .thumb {height:160px}
}
@media all and (max-width:800px) {
.photo_list ul li {width:33.3%}
.photo_list ul li .thumb {height:140px}
}
@media all and (max-width:480px) {
.photo_list ul {padding-top:15px}
.photo_list ul li {width:50%;margin-bottom:10px}
.photo_list ul li > a > .con > .tit {padding:0 5px}
.photo_list ul li > a > .con > .date {bottom:2%}
}
@media all and (max-width:360px) {
.photo_list ul li .thumb {height:110px}
}

/*20200811 북큐레이션 슬라이드*/
/* 겔러리형 슬라이드 */
.photo_slide {position:relative;margin:30px 0}
.photo_slide .loading {position:absolute;top:0;left:0;width:100%;height:100%;background:#fff url('/groups/common/images/loading.gif') no-repeat center center;z-index:1}
.photo_slide .photo_bigview {position:relative;max-height:853px;overflow:hidden;text-align:center;}
.photo_slide .photo_bigview li {height:853px}
.photo_slide .photo_bigview img {height:100%}
.photo_slide .loading + .photo_bigview {max-height:853px}
.photo_slide .photo_bigview .flex-direction-nav a {position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;text-indent:-999px;overflow:hidden;background-repeat:no-repeat;background-position:center center;transition:all 0.2s ease}
.photo_slide .photo_bigview .flex-direction-nav .flex-prev {left:10px;background-image:url('/groups/common/images/board/btn_move_prev.png')}
.photo_slide .photo_bigview .flex-direction-nav .flex-next {right:10px;background-image:url('/groups/common/images/board/btn_move_next.png')}
.photo_slide .photo_bigview:hover .flex-direction-nav .flex-prev {left:10px}
.photo_slide .photo_bigview:hover .flex-direction-nav .flex-next {right:10px}
.photo_slide .photo_thumb {position:relative;margin-top:20px;width:100%;height:100px;overflow:hidden}
.photo_slide .photo_thumb .slides::after {display:block;clear:both;content:''}
.photo_slide .photo_thumb li {background:#999;text-align:center}
.photo_slide .photo_thumb li a {display:block;height:100px}
.photo_slide .photo_thumb li a img {height:100%}
.photo_slide .photo_thumb .flex-active-slide img {opacity:0.5}
.photo_slide .photo_thumb .flex-direction-nav a {position:absolute;top:50%;margin-top:-35px;width:36px;height:70px;text-indent:-999px;overflow:hidden;background-repeat:no-repeat;background-position:center center;transition:all 0.2s ease}
.photo_slide .photo_thumb .flex-direction-nav .flex-prev {left:-50px;background-image:url('/groups/common/images/board/btn_move_left_arrow.png')}
.photo_slide .photo_thumb .flex-direction-nav .flex-next {right:-50px;background-image:url('/groups/common/images/board/btn_move_right_arrow.png')}
.photo_slide .photo_thumb:hover .flex-direction-nav .flex-prev {left:0}
.photo_slide .photo_thumb:hover .flex-direction-nav .flex-next {right:0}
.photo_slide .flex-direction-nav .flex-disabled {cursor:default;opacity:0;z-index:-1}

/* 20201008 전자책서비스 버튼 */
.blue_btns {background-color: #026B42; color: #fff; padding: 0 30px; border-radius: 25px;line-height: 45px;height: 45px; font-size: 16px; font-weight: 600;
}

/*댓글 창*/
.petitionsReply_area {margin:30px 0;}
.Reply_area_head {margin-bottom:8px;}
.Reply_area_agree span{color:#005fac;}
.Reply_area_sns{
    float:right;
    padding:0;
}

.Reply_area_write{
    text-align:left;
    background-color:#F8F8F8;
    border:1px solid #dedede;
    margin-bottom:40px;
}
.Reply_area_write_pg{
    padding:20px;
    overflow:hidden;
}
.petitionsReply_write{
    float:left;
    width:80%;
    border:0;
    height:59px;
    padding:8px;
}
.Reply_area_write button{
    float:right;
    width:16%;
    background-color:#005fac;
    height:60px;
    font-size:16px;
    font-weight:500;
    color:#fff;
}
.reply-list-open a {
    width: 100%;
    display: inline-block;
    padding: 15px 30px;
    color: #333;
    background-color: #F8F8F8;
    border: 1px solid #dedede;
    font-size: 16px;
    letter-spacing: normal;
    cursor: pointer;
    text-align:center;
}


/* 공감 리스트 */
.petitionsReply_Reply ul .Reply_Reply_list{ position: relative; overflow:hidden; border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb; padding:15px 0; margin-top:-1px; }
.Reply_Reply_contents{text-align:left;}
.pv3_R_contents_head { margin-bottom:5px;}
.R_R_contents_head{ font-size:15px; display: inline-block; margin-bottom:5px; }
.R_R_contents_head h4{ float:left; margin-right:15px; }
.R_R_contents_head p{float:left;}
.R_R_contents_Good_Bad{ font-size:14px; position: absolute; top:20px; right:5px;; }
.R_R_contents_Good_Bad ul{width:80px;}
.R_R_contents_Good_Bad ul li{line-height:26px;}
.R_R_contents_Good_Bad ul li a{ margin-right:5px; color:#333; }
.R_R_contents_Good_Bad ul li.rr_good a{ color:#f31414; display: block; width:100%; }
.R_R_contents_Good_Bad ul li.rr_good a span{ text-align:right; float:right; font-weight:500; color:#777; }
.R_R_contents_Good_Bad ul li.rr_bad a{ color:#777; display: block; width:100%; }
.R_R_contents_Good_Bad ul li.rr_bad a span{ text-align:right; float:right; font-weight:500; color:#777; }
.R_R_contents_txt{ width:90%; display: inline-block; font-size:14px; margin-bottom:15px; }


/* 설문조사 */
.question ul{padding: 10px;}
.question_wp .question ul li {display: inline-block; margin: 0 5px 6px 0; font-size: 1.25em; line-height: 1.6; width: 100%;}
.question_wp h4 {padding-bottom: 10px; border-bottom: 1px solid #e8e8e8; line-height: 1.2; font-size: 1.5em;}

.question_wp .question_ex textarea {min-height: 150px; font-size: 1.25em; margin-top: 12px; width: 100%;}
#exX{border: 1px solid #D5D5D5; height: 26px;}
/* table */
.table_guide {}
.table {margin-bottom:50px;font-size:16px;border-top:2px solid #60BB46;border-bottom:1px solid #60BB46;}
.table thead th {padding:12px 0;color:#026B42;background:#effcf1;/* border-right:solid 1px #99ccff; */border-top:1px solid #60BB46;}
.table thead th:last-child {border-right:none}
.table thead th.last {border-right:solid 1px #99ccff}
.table tbody tr {border-top:1px solid #e0e0e0}
.table tbody th {padding:10px 10px;background:#f7f7f7;color:#6c6e6f;font-weight:400}
.table tbody th.first {border-right:1px solid #e0e0e0}
.table tbody td {padding:10px 5px;text-align:center;vertical-align:middle;/* border-left:1px solid #e0e0e0; */background:#fff;}
.table tbody td.first {border-left:none}
.table tfoot  tr {border-top:1px solid #e0e0e0}
.table tfoot th {padding:10px 0;background:#f9f9f9;color:#333}
.table tfoot td {padding:10px 10px;text-align:center;background:#f9f9f9}
.table td li {position:relative;padding-left:12px;margin-bottom:5px;text-align:left}
.table td li::before {content:"";position:absolute;left:0;top:8px;width:3px;height:3px;background:#999;border-radius:3px}
.table td li ul li {position:relative;padding-left:15px;font-size:1em;line-height:1.4;margin-bottom:5px}
.table td li ul li::before {content:"";position:absolute;left:0;top:10px;width:8px;height:1px;background:#999}
.table td.nolist {color:#666;font-size:19px;line-height:148px;text-align:center}
@media all and (max-width:640px) {
.table_guide {display:block;position:relative;overflow:hidden;overflow-x:auto;padding-bottom:45px;margin-bottom:50px}
.table_guide::before {content:'좌우로 스크롤해주세요!'; display:block; position:absolute; right:50px; bottom:10px; font-size:16px;}
.table_guide::after {content:''; display:block; position:absolute; right:0; bottom:3px; width:39px; height:33px; z-index:10; background:url('/groups/www/images/comm/table_scroll_hint2.png') no-repeat left top; background-size:cover; text-indent:-157px; font-size:15px}
.table_guide table {width:1000px;margin-bottom:0}
}


.btnAreaRight {display:block; margin: 30px 0;}
.btnAreaRight ul li {display:block; text-align: right;}
.btnAreaRight ul li a {padding: 10px 38px; box-shadow:1px 2px 3px 0px #d4d3d3; background: #026B42; color: #fff; border-radius: 30px;font-size: 16px;font-family: "Noto400", sans-serif; text-decoration: none;}


/* 설문조사 결과 */
.question { margin-bottom:30px; border: 1px solid #ddd; padding: 20px 25px 10px 25px; background: #fafafa; line-height: 1.8em; overflow: hidden ;position:relative }
.question .whole{ background:url('/groups/home/images/survey/b02.gif') no-repeat 0 5px; padding-left:15px; font-weight:bold; margin-bottom:10px}
.question .opnion li{ background:url('/groups/home/images/survey/bul_d.gif') no-repeat 0 10px; padding-left:8px ;}
.question .opnion_s{ margin-left:15px; border-top:1px dashed #ddd; padding-top:10px; color:#666}
.question input[type=radio] { margin: 0 5px 0 0; background: #f9f9f9 }
.question input[type=text]{ width:630px; text-indent:5px}
.question .exe textarea { display: block; margin: 5px 0 0 20px; width: 92%; height: 40px; overflow: auto }
.question_ex textarea { width: 98%; height: 60px; overflow: auto; border:1px solid #c5c5c5 ;text-indent:5px}
.question_ex ul { overflow: hidden; width: 98% }
.question_ex ul li { padding: 5px 0 5px 10px; line-height: 1.5em; background: url("/groups/home/images/survey/bul_list4.png") no-repeat 0 13px }
.question_ex ul li.boli { border-bottom: 1px dotted #999; }

.ratio { overflow:hidden; margin-bottom:10px; line-height:1.4em;}
.ratio dt dd { float: left }
.ratio dt { width: 400px; background:url('/groups/home/images/survey/bul_d.gif') no-repeat 0 7px; padding-left:8px ; margin-left:7px; float:left; margin-right:10px; font-size:16px; letter-spacing:0; font-weight: 600;}
.ratio p { width: 98%; height: 14px; margin: 2px 5px 0 0;padding:0; background: #e2e2e2; font-size: 0 }
.ratio p span { display: block; height: 14px; border: 1px solid #026B42; background: #026B42; font-size: 0 }
.ratio span.number { margin: 0 0 0 10px }
.ratio .ex { padding: 0 10px 0 10px }
.ratio dd.bar { width:200px; float: left }
.ratio dd.txt_s { width: 80px; float: right; text-align: right }
.ratio dd .rail { padding: 5px 0 5px 10px; line-height: 1.6em; width: 100%; display: block; /*background: url("/groups/home/images/survey/bul_list4.png") no-repeat 0 13px*/ }
.ratio dd .rail01 { padding: 5px 0 5px 10px; line-height: 1.6em; border-top: 1px dotted #999; width: 98%; display: block; background: url("/groups/home/images/survey/bul_list4.png") no-repeat 0 13px }

.ex_ct{margin-top: 25px; border: 1px solid #ccc; width: 100%; padding: 20px !important;}
.ex_ct p{background-color: inherit; font-size: 12px; background:url('/groups/home/images/survey/bul_d.gif') no-repeat 0 7px; padding-left: 10px; margin-bottom: 10px;}
.question_ex span{background-color: inherit; font-size: 16px; background:url('/groups/home/images/survey/bul_d.gif') no-repeat 0 5px; padding-left: 10px;}
.question_ex div{margin-bottom: 5px;}

/* 문화마당 > 문화강좌 캘린더 - 221207 */
.dalmacalendar .calender_type ul {margin: 24px 0 6px;}
.dalmacalendar .calender_type ul::after {display:block; content:""; clear:both;}
.dalmacalendar .calender_type ul li {float: right;margin-right:15px;margin-bottom: 5px;font-size: 16px;padding-left:22px;position:relative;}
.dalmacalendar .calender_type ul li.c_type01:before {display:block; width:15px; height:15px; background:#e05d1b; position:absolute; top:2px; left:0; content:""; border-radius:50%;}
.dalmacalendar .calender_type ul li.c_type02:before {display:block; width:15px; height:15px; background:#195dae; position:absolute; top:2px; left:0; content:""; border-radius:50%;}
.dalmacalendar .calender_type ul li.c_type03:before {display:block; width:15px; height:15px; background:#00903e; position:absolute; top:2px; left:0; content:""; border-radius:50%;}
.dalmacalendar .calender_type ul li.c_type04:before {display:block; width:15px; height:15px; background:#bc1be0; position:absolute; top:2px; left:0; content:""; border-radius:50%;}

.dalmacalendar table {border-bottom:1px solid #e0e0e0;border-top:1px solid #777;margin-bottom:10px;clear: both;}
.dalmacalendar table th {padding:12px 0; background:#f9f9f9; font-size:1.25em; font-weight:500; color:#232323; border-left:1px solid #dedede; border-bottom:1px solid #dedede}
.dalmacalendar table th.sun, .dalmacalendar table td.sun, .dalmacalendar table td.event.sun a {color:#dc372b !important}
.dalmacalendar table th.sat, .dalmacalendar table td.sat, .dalmacalendar table td.event.sat a {color:#195dae !important}
.dalmacalendar table th:first-child, .dalmacalendar table td:first-child {border-left:none;}
.dalmacalendar table td {padding:0; border-bottom:1px solid #dedede; border-left:1px solid #dedede; line-height:1.4; color:#666; vertical-align:top; font-size:14px;}
.dalmacalendar table td div {overflow-y:auto;min-height: 125px;padding:10px 8px;}
.dalmacalendar table td div em {display:block;margin-bottom: 3px;}
.dalmacalendar table td div a {text-decoration: none;}
.dalmacalendar table td div span {display:block;}
.dalmacalendar table td.event.sun a span, .dalmacalendar table td.event.sat a span {color:#555;}
.dalmacalendar table td div.event01 {background:#f1f5fb;}
.dalmacalendar table td div.event02 {background:#f2f9fb;}
.dalmacalendar table td div.event03 {background:#f1fbf0;}
.dalmacalendar table td div.event04 {background:#fbfbf0;}
.dalmacalendar table td div.event05 {background:#fbf5f0;}

.dalmacalendar table.cal1 td div span {margin-bottom:3px;position: relative;padding-left: 20px;display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: 20px;letter-spacing: -1px;}
.dalmacalendar table.cal1 td div span.c_type01:before {display:block; width:15px; height:15px; background:#e05d1b;position:absolute;top:2px;left:0;content:"";border-radius: 100px;}
.dalmacalendar table.cal1 td div span.c_type02:before {display:block; width:15px; height:15px; background:#195dae; position:absolute; top:2px; left:0; content:""; border-radius: 100px;}
.dalmacalendar table.cal1 td div span.c_type03:before {display:block; width:15px; height:15px; background:#00903e; position:absolute; top:2px; left:0; content:""; border-radius: 100px;}
.dalmacalendar table.cal1 td div span.c_type04:before {display:block; width:15px; height:15px; background:#bc1be0; position:absolute; top:2px; left:0; content:""; border-radius: 100px;}

@media all and (max-width:640px) {
    .dalmacalendar table td {font-size:13px}
    .dalmacalendar table td div {min-height:100px; padding:10px 4px}
    .dalmacalendar table td div em {margin-bottom:5px}
    .dalmacalendar table td div span {overflow:hidden; text-overflow:ellipsis; white-space:normal; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; font-size:0.9em}
}
@media all and (max-width:340px) {
    .dalmacalendar table.cal1 td div span {padding-left:0;padding-top:20px;line-height: 12px;}
}


/* 상록무인예약대출 2022. 12 .23 추가*/
.resv_box {display: inline-block; width: 300px; vertical-align: text-top; padding: 0 10px 40px;}
.resv_box p {margin: 10px; text-indent: -21px; padding-left: 21px; line-height: 20px; font-size: 12px;}
.resv_box p span {display: inline-block; width: 18px; height: 18px; line-height: 20px; background-color: #026B42; color: #fff; text-align: center; border-radius: 9px; text-indent: 0;}
.resv_box img{border:5px solid #efefef;}

@media all and (max-width:823px) {
.resv_box {width: 390px;}
}

@media all and (max-width:803px) {
.resv_box {width: 380px;}
}

@media all and (max-width:783px) {
.resv_box {width: 370px;}
}

@media all and (max-width:763px) {
.resv_box {width: 360px;}
}

@media all and (max-width:743px) {
.resv_box {width: 350px;}
}

@media all and (max-width:723px) {
.resv_box {width: 100%;}
}

/* 책배달 도서관 설정 */
.btn_wd {width: 66%}

/* 북피크닉 수정 2023. 03. 21 */
.tabcnt table td {height: 100px;}

/*서브 페이지 로고 추가 - 도서관 소개*/
.library_logo_Box01 {width: 100%; height: 90px; background: url('../images/sub/library_logo01.png')no-repeat center; background-size: contain; margin-top: 50px;}
.library_logo_Box02 {width: 100%; height: 90px; background: url('../images/sub/library_logo02.png')no-repeat center; background-size: contain; margin-top: 50px;}
.library_logo_Box03 {width: 100%; height: 90px; background: url('../images/sub/library_logo03.png')no-repeat center; background-size: contain; margin-top: 50px;}
.library_logo_Box04 {width: 100%; height: 90px; background: url('../images/sub/library_logo04.png')no-repeat center; background-size: contain; margin-top: 50px;}



/*도서관 BI 소개*/
.brand_slogan {padding-top: 20px; border-bottom: 1px dashed #AEAEB0; padding-bottom: 10px;}
  .brand_slogan h3 {font-size: 2.8em; font-weight: 600; margin-bottom : 30px;}
  .brand_slogan p {font-size:20px;}
  
  .two_out_Box {margin-top: 20px;}
  .two_out_Box .two_inner { display: flex; flex-wrap: wrap; }
  .two_out_Box .two_inner div { padding:20px;}
  .two_out_Box .two_inner .left {width:40%;}
  .two_out_Box .two_inner .right {width:55%; font-size: 16px;}
  .img_Box {padding: 20px 20px 40px 20px;}
  .green6 {color : #517F51;}


  /*회원가입 안내*/
  .table1 td ol.step_list3 {    overflow: hidden;
    margin: 25px 0;} 
  .table1 td ol.step_list3 li {padding-left: 0px; text-align: center;  float: left; display: block; position: relative; width: 28.5%;  min-height: 0;  border: 1px solid #026B42;  border-radius: 5px;  margin-right: 6%;}
  .table1 td ol.step_list3 li::before {    content: ""; position: absolute; left: -36px;  top: 50%; margin-top: -10px; content: ''; display: block; width: 10px; height: 10px; background: transparent;  border-left: 2px solid #ccc; border-bottom: 2px solid #ccc;  transform: rotate(-135deg); transition: all .3s ease-in-out;}
  
  .table1 td ol.step_list3 li:last-child {margin-right:0;}
  
  .table1 td ol.step_list3 strong {display: block; font-family: 'NanumMyeongjoBold'; color: #fff; font-size: 16px; background: #026B42;  padding: 10px 0;
}
  .table1 td ol.step_list3 p { color: #666; margin-bottom: 0; padding: 13px 5px;}

  @media all and (max-width:720px) {
    .table1 td ol.step_list3 li {min-height:170px}
    }
    
    @media all and (max-width:640px) {
    .table1 td ol.step_list3 li {width: 43%;margin: 0 5% 10px 1%;}
    .table1 td ol.step_list3 li::before {right: -21px;}
    .table1 td ol.step_list3 li p {padding: 13px 15px;}
    }
    
    @media all and (max-width:480px) {
    .table1 td ol.step_list3 li{float:none; width:99%; text-align:center; min-height:auto; background:#026B42; margin-bottom:30px; padding:10px; border-radius:20px;}
    .table1 td ol.step_list3 li::before {position:absolute;top:-5px;left:0;margin-top:-10px;content:'';display:block;width:10px;height:10px;background:transparent;border-left:2px solid #ccc;border-bottom:2px solid #ccc;transform:rotate(-135deg);transition:all .3s ease-in-out; left:50%;margin:-20px 0 0 -10px;transform:rotate(-45deg)}
    .table1 td ol.step_list3.smart li{float:none; width:99%; text-align:center; min-height:auto; background:#026B42; margin-bottom:30px; padding:10px; border-radius:20px;} 
    .table1 td ol.step_list3 li:last-child::before {display:block}
    .table1 td ol.step_list3 strong{margin:0; width:99%; padding:0; border-bottom:none;color:#fff;}
    .table1 td ol.step_list3 p{width:99%;color:#fff;}
    }
