@charset "utf-8";
/*** 공통 ***/
.content_Wrap{width: 1200px; margin: 0 auto; padding:90px 0; line-height: 1.2em; overflow:hidden; font-weight: 300;}
.content_Wrap .bold{font-weight: 500;}
.pc{display: block;}
.mo{display: none;}
.word{word-break: keep-all;}

/* tableMode */
.tableMode {display:table; clear:both; float:none !important; width:100%; max-width:100%; padding:0; margin:0; border-bottom:0;}
.tableMode>* {display:table-cell; float:none !important; padding:0; margin:0;}
.tableMode>*:first-child {border-left:0;}
.tableMode .middle {vertical-align:middle;}

/* 타이틀 */
.buh4 {padding-left:25px; background:url(../img/layout/buh4.png) no-repeat 0 6px; font-size:18px; margin-bottom:20px; line-height:normal;}
.h4_in {margin-left:25px !important;}

/* deco */
.point_dot2 li {padding-left:10px; background:url(../img/layout/dot_point.png) no-repeat 0 12px;}


/*** 센터소개 ***/
/* 인사말 */
.greeting{position: relative; padding:0 0 0 0; line-height: 1.9em ;  /*background:url(../img/sub/greeting_bg2.png) no-repeat ;  */ background-position: top 90px right 0; font-size: 18px; color: #666; box-sizing: border-box;}
.greeting .align_c{display: block;  margin-top: 50px;}
.greeting h2{font-size: 25px; color: #444; margin-bottom: 34px; line-height: 1.6em;}
.greeting h2 span{font-size: 40px; color: #111; }
.greeting .center_img{text-align: right;}
.greeting .name{ text-align: right; margin-top: 10px;}
.greeting .name span{display: inline-block; width: 168px; height: 62px; font-size: 28px; color: #222; font-weight: 600; background:url(../img/sub/greeting_name.jpg) no-repeat ; }
.greeting .after:after{content: ""; display: block; clear: both;}
.greeting .after{position: absolute; top: 0; right: 0;}


/* 주요사업 */
.business li:after{content: ""; display: block; clear: both;}
.business li{margin-bottom: 20px;}

.business li:nth-child(1) .L{background-image: url(../img/sub/business01.png); margin-top: 25px;}
.business li:nth-child(2) .L{background-image: url(../img/sub/business02.png); margin-top: 40px;}
.business li:nth-child(3) .L{background-image: url(../img/sub/business03.png); margin-top: 15px;}

.business .L{position: relative; float: left; width: 304px; height: 96px; padding-left: 43px; color: #fff;  line-height: 96px; font-size: 25px; background-repeat: no-repeat;}
.business .L span{display: inline-block;margin-right: 10px; font-style: italic; font-weight: 500; font-size: 40px;}
.business .L:after{content: ""; display: block; clear: both; position: absolute; top: 50%; right: -25px; width: 25px; height: 2px; background-color: #e1e1e1;}

.business .R{float: right; width: calc(100% - 329px); padding: 30px 40px; border: 2px solid #e1e1e1; border-radius: 10px;}
.business .R li{position: relative; margin-bottom: 0; padding-left: 25px; line-height: 1.7em; font-weight: 18px;}
.business .R li:before{content: ""; display: block; clear: both; position: absolute; top: 7px; left: 0; width: 15px; height: 15px; border: 3px solid #95b2b2; border-radius: 50%;}


/* 연혁 */
.list_1st{float:left;position:relative;width:100%;padding-left:14px;}
.list_1st:before{content:"";display:block;position:absolute;left:20px;top:10px;width:1px;height:calc(100% - 60px);background:#ddd;}
.list_1st li{position:relative;padding-top:20px;padding-bottom:35px;background:none;overflow:hidden}
.list_1st li:first-child {padding-top:0;}
.list_1st li:last-child:after{display:none;}
.list_1st li:after{display:block;position:absolute;left:6px;bottom:0; content:"";width:100%;height:1px;border-bottom:1px dashed #ddd}
.list_1st li span{float:left; display:inline-block; width:20%;}
.list_1st li span.year_st{font-size:24px;color:#46982b; font-weight:500; padding-top:20px;}
.list_1st li span.year_st:before{display:inline-block;content:""; width:15px; height:15px; border:4px solid #46982b; background:#fff; border-radius:50%; vertical-align:unset; margin-right:10px;}
.list_1st li:first-child span.year_st{padding-top:0;}
.list_1st li .dl_wrap {display:inline-block;width:80%;vertical-align:top;margin-top:10px;}
.list_1st li:first-child .dl_wrap {margin-top:0;}
.list_1st li dl{overflow:hidden; margin-right:10px; padding-left:5%;display:block;}
.list_1st li dl>*{display:inline-block; margin-top:10px; min-height:25px;line-height:1.4em;}
.list_1st li dl dt{float:left; font-weight:500; width:90px;}
.list_1st li dl dd{width:calc(100% - 90px);}

/* 조직도 */
.organ_wrap {margin:0 0 80px; font-size:19px; line-height:normal; font-weight: 500;}
.organ_wrap > .organ_area_top {position:relative; text-align:center; width:100%; margin:0 auto; }
.organ_wrap > .organ_area_top > .contab_v1 {display:block; width:20%; margin:0 auto;}
.organ_wrap > .organ_area_top > .contab_v1 > li {display:block;width:100%;}
.organ_wrap > .organ_area_top > .contab_v1 > li > span, .organ_wrap > .organ_area_top > .contab_v1 > li > span a {color:#fff;}
.organ_wrap > .organ_area_top > .contab_v1 > li:first-child {margin-bottom:30px;}
.organ_wrap > .organ_area_top > .contab_v1 > li:first-child > span {background:#0c77bb; width:100%; padding:18px 0;display:block; border-radius: 63px;}
.organ_wrap > .organ_area_top > .contab_v1 > li:first-child:after{content:""; position:absolute;  width:1px; height:160px;left:50%; background:#ddd; display:block;/*  z-index: -1; */}
.organ_wrap > .organ_area_top > .contab_v2 {display:block; width: 70%; margin: 0 auto;}
.organ_wrap > .organ_area_top > .contab_v2 > li {display:block;width:33.3%; float:left;  z-index:100;position:relative; padding-top:30px;}
.organ_wrap > .organ_area_top > .contab_v2 > li > p, .organ_wrap > .organ_area_top > .contab_v2 > li > p a {color:#fff;}
.organ_wrap > .organ_area_top > .contab_v2 > li:before {content:""; position:absolute; top:0; width:1px; height:30px;left:50%; background:#ddd; display:block;}
.organ_wrap > .organ_area_top > .contab_v2 > li:nth-child(2):before {display:none;}
.organ_wrap > .organ_area_top > .contab_v2 > li:after{display:inline-block; content:''; width:50%; height:1px; background:#ddd; position:absolute;top:0;left:0;}
.organ_wrap > .organ_area_top > .contab_v2 > li:first-child:after{right:0; left:auto;}
.organ_wrap > .organ_area_top > .contab_v2 > li:nth-child(2):after{width:100%;}
.organ_wrap > .organ_area_top > .contab_v2 > li > p {position:relative; background:#e21361; width:90%; height:70px; padding:10px 0;display:table; margin:0 auto; z-index:99; line-height:1.2; border-radius: 63px;}
.organ_wrap > .organ_area_top > .contab_v2 > li > p > span {display:table-cell; vertical-align:middle;}
.organ_wrap > .organ_area_top > .contab_v3 {clear:both; display:block; width: 100%; margin: 0 auto;}
.organ_wrap > .organ_area_top > .contab_v3 > li {display:block;width:25%; margin:30px auto;}
.organ_wrap > .organ_area_top > .contab_v3 > li:after{content:""; position:absolute;  width:1px; height:30px;left:50%; background:#ddd; display:block;/*  z-index: -1; */}
.organ_wrap > .organ_area_top > .contab_v3 > li > span, .organ_wrap > .organ_area_top > .contab_v1 > li > span a {color:#fff;}
.organ_wrap > .organ_area_top > .contab_v3 > li > span {background:#06a24c;  width:100%; padding:20px 0;display:block;}
.organ_wrap > .organ_area_top > .contab_v4 {clear:both; display:block; width: 100%; margin: 0 auto;}
.organ_wrap > .organ_area_top > .contab_v4 > li {display:block;width:25%; margin:30px auto;}
.organ_wrap > .organ_area_top > .contab_v4 > li:after{content:""; position:absolute;  width:1px; height:30px;left:50%; background:#ddd; display:block;/*  z-index: -1; */}
.organ_wrap > .organ_area_top > .contab_v4 > li > span, .organ_wrap > .organ_area_top > .contab_v1 > li > span a {color:#fff;}
.organ_wrap > .organ_area_top > .contab_v4 > li > span {background:#e21361; width:84%; padding:20px 0;display:block;margin:0 auto; border-radius: 63px;}
.organ_wrap > .organ_area_under {position:relative; overflow:hidden; margin: 20px auto 0 auto; width:50%;}
.organ_wrap > .organ_area_under:before {content:""; position:absolute; left: 50%; transform: translateX(-50%); width:50%; height:1px; background:#ddd; display:block;}
.organ_wrap > .organ_area_under > ul > li {float:left; margin-top:30px; position:relative; width:50%;}
.organ_wrap > .organ_area_under > ul > li > p {background: #fff; width:90%; display:block;margin:0 auto; padding:20px 0; text-align:center; color:#e21361; border:2px solid #e21361; border-radius: 63px;}
.organ_wrap > .organ_area_under > ul > li._line:before {content:""; position:absolute; width:1px; height:30px; background:#ddd; top:-30px; left:50%; display:block;}

/* 오시는길 */
.map_wrap {width:100% !important; height:550px;}
.root_daum_roughmap .wrap_map {height:100% !important;}
.root_daum_roughmap_landing .border2 {display:block !important;}
.map_info {padding:30px; border:1px solid #ddd; border-top:0;}
.map_info>dl {margin-bottom:10px;}
.map_info>dl:last-child {margin-bottom:0;}
.map_info>dl>* {display:inline-block; float:left;}
.map_info dt {width:100px; color:#000;}


/*** 자원봉사 ***/
/* 자원봉사란? */
.definition_wrap {padding:40px; background:url(../img/sub/bg_definition.jpg);}
.definition_wrap>div:last-child {position:relative; }
.definition_wrap>div:last-child img {position:absolute; right:40px; bottom:-40px;}
.definition_wrap .defp {margin-bottom:10px; font-size:18px; color:#666; font-weight:500;}

.characte_wrap>div {width:50%; overflow:hidden;}
.characte_con {padding:30px 0 20px; border-bottom:1px solid #eee;}
.characte_con dt {font-size:18px; font-weight:500; margin-bottom:10px;}
.characte_con dd {color:#666; line-height:1.6;}
.characte_con i {display:inline-block; height:90px; background-repeat:no-repeat; background-position:center top;}
.characte_01 {background-image:url(../img/sub/character_i_01.png);}
.characte_02 {background-image:url(../img/sub/character_i_02.png);}
.characte_03 {background-image:url(../img/sub/character_i_03.png);}
.characte_04 {background-image:url(../img/sub/character_i_04.png);}
.characte_05 {background-image:url(../img/sub/character_i_05.png);}

.mind_list>li {margin-top:5px;}
.mind_list>li>* {display:inline-block;}
.mind_list>li>span {color:#13aa22; font-weight:500;}
.mind_list>li>p::before {content:":"; display:inline-block; clear:both; padding:0 4px;}

/* 자원봉사 참여안내 */
.process ul:after{content:""; display: block; clear: both;}
.process li{float: left; width: 17%; min-height: 180px; vertical-align: middle; text-align: center; padding: 20px 7px; border-top: 2px solid #0c9e1a; border-right: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.process li img{margin: 10px;}
.process span.moVer{display: none;}
.process span.pcVer{float: left; display: inline-block; font-size: 1.5em; padding: 70px 10px;}
.c_box{background-color: #f7f6f2; padding: 25px 35px; line-height: 1.7em;}
.c_box li .nb{color: #13aa22;}
.lh_16{line-height: 1.6em;}
.btn1{display: inline-block; height:40px; padding: 0 40px 0 20px; margin-top: 10px; line-height: 40px; color: #fff;background-image:url(../img/sub/btn1.png); background-repeat: no-repeat; background-position: right 20px center; background-color: #0a9918; box-sizing: border-box;}
.c_table table{ border-collapse:collapse; border: 1px solid #e3e2dc;}
.c_table table caption{display: none;}
.c_table table{width: 100%;}
.c_table table tr{ border-bottom: 1px solid #e3e2dc;}
.c_table table tr:last-child{border-bottom: 0;}
.c_table table th{border-right: 1px solid #e3e2dc; font-weight: 500; line-height: 40px; background-color: #f7f6f2;}
.c_table table td{border-right: 1px solid #e3e2dc; padding: 20px 25px; word-break: keep-all; line-height: 1.7em;}
.red{color: #e70c0c;}	

/* 자원봉사증 발급안내 */
.c_box2{padding: 30px 50px; line-height: 1.6em; border-top: 2px solid #0c9e1a; border-right: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.ft18{margin-bottom: 5px; color: #121212; font-size: 18px; font-weight: 500; }

/* 자원봉사 상해보험 안내 */
.insurance ul:after{content:""; display: block; clear: both;}
.insurance li{float: left; width: 24.25%; min-height: 210px; margin-right: 1%; text-align: center; border: 1px solid #ddd;}
.insurance li:last-child{margin-right: 0;}
.insurance li .step{display: block; width: 115px; margin: -15px auto 0 auto; border-radius: 30px;; line-height: 30px; color: #fff; text-align: center; background: #58b23d;}
.insurance li  img{margin: 10px 0;}
.insurance li .bold{color: #121212; }

/* 재능나눔 */
.talent_01 {background-image:url(../img/sub/icon_talent01.png);}
.talent_02 {background-image:url(../img/sub/icon_talent02.png);}
.talent_03 {background-image:url(../img/sub/icon_talent03.png);}
.talent_04 {background-image:url(../img/sub/icon_talent04.png);}
.talent_05 {background-image:url(../img/sub/icon_talent05.png);}
.talent_06 {background-image:url(../img/sub/icon_talent06.png);}

.way li:after{content: ""; display: block; clear: both;}
.way li {height: 70px; border: 1px solid #ddd;}
.way li p{line-height: 70px;}
.way li .tit{float: left; width:25%; height: 100%; padding-left: 30px; color: #333;font-weight: 500; font-size: 21px; background-color: #f7f6f2; border-left:2px solid  #13aa22;}
.way li .tit .nb{ margin-right: 40px;}
.way li .txt{float: left; width: 75%; padding-left: 30px;}
.way li .txt.lh{line-height: 1.4em;}
.way li .txt span{display: inline-block;line-height: 25px; margin-top: 10px;}
.way .arrow{display: block; color: #666; font-size: 30px; margin: 15px 0; text-align: center;}
.last_box{width: 466px; height: 105px; margin: 0 auto; line-height: 85px;  background-image:url(../img/sub/talent_last_bg.png);}

.last_box2{padding: 40px; font-size: 17px; background-color: #f7f6f2;  background-image:url(../img/sub/talent_last_bg2.png); }



/* 자원봉사 활동처 안내 */
.c_table2 table{width: 100%;}

/*** 북구푸드뱅크 ***/
/* 북구푸드뱅크 */
.txt_fb{display: inline-block; padding: 50px 100px; margin-left: 50%; transform: translateX(-50%); text-align: center; font-size: 23px; line-height: 1.4em; background-image:url(../img/sub/foodbank_bg.png); background-repeat: no-repeat; background-position: left top;}
.fb_box{position: relative; padding: 40px 140px; font-size: 21px; font-weight: 400; background-color: #f7f6f2;}
.fb_bg{position: absolute; bottom: 0; right: 50px;}
.fb_box .ft24{font-size: 24px;}

.fb_01{background-image:url(../img/sub/icon_fb01.png);}
.fb_02{background-image:url(../img/sub/icon_fb02.png);}
.fb_03{background-image:url(../img/sub/icon_fb03.png);}
.fb_04{background-image:url(../img/sub/icon_fb04.png);}
.fb_05{background-image:url(../img/sub/icon_fb05.png);}
.fb_06{background-image:url(../img/sub/icon_fb06.png);}
.break{word-break: break-all;}

.process2 ul:after{content:""; display: block; clear: both;}
.process2 li{float: left; width: 30.8%; min-height: 180px; vertical-align: middle; text-align: center; padding: 20px; border-top: 2px solid #0c9e1a; border-right: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.process2 li img{margin: 10px;}
.process2 span.moVer{display: none;}
.process2 span.pcVer{float: left; display: inline-block; font-size: 1.5em; padding: 70px 10px;}


/* 명예의 전당 */
.page3_1_Wrap{background-image: url(../img/sub/page3_1_bg.jpg);background-size: cover;}
.honor_top:after{content:""; display: block; clear: both;}
.honor_top .image{float: left; width: 34%;}
.honor_top .image img{width: 100%;}
.honor_top .txt{float: right; width: 66%;  padding: 40px; margin-top: 20px; font-size: 19px; line-height: 1.5em; word-break: keep-all; background-color: #fff; box-shadow: 5px 3px 10px 10px rgba(0,0,0,0.1);}
.honor_top .txt .L_txt{font-size: 23px; font-weight: 500; line-height: 1.5em;}
.honor_top .txt .s_txt{display: block;margin-top: 70px; text-align: right; font-size: 16px;}
.honor h2{padding-left: 40px; font-size: 25px; line-height: 26px; color: #333; background-image: url(../img/sub/honor_h2.png); background-repeat: no-repeat; background-position: left center;}
.honor ul:after{content:""; display: block; clear: both;}
.honor li{float: left; width: calc((100% - 20px) / 3); min-height: 139px; margin-right: 5px; padding: 15px;  border: 1px solid #c29262; border-radius: 10px; box-sizing: border-box; background-color: #fff;}
.honor li:nth-child(3){margin-right: 0;}
.honor li:after{content:""; display: block; clear: both;}
.honor li .photo{width: 35%; float: left;}
.honor li .photo img{width: 100%;}
.honor li .name{width: 60%; float: right; margin-top: 10%; font-size: 17px;}
.honor li .name span{display: block; font-size: 24px; }

.honor3 h2{padding-left: 40px; font-size: 25px; line-height: 26px; color: #333; background-image: url(../img/sub/honor_h2.png); background-repeat: no-repeat; background-position: left center;}
/*.honor3 ul:after{content:""; display: block; clear: both;}
.honor3 li{float: left; width: calc((100% - 40px) / 5); min-height: 110px; margin-right: 10px; padding: 20px; text-align: center;  border: 1px solid #c29262; border-radius: 10px; box-sizing: border-box; background-color: #fff;}
.honor3 li:nth-child(5){margin-right: 0;}
.honor3 li:nth-child(10){margin-right: 0;}*/
.honor3 ul{display: flex; flex-wrap: wrap; gap: 10px;}
.honor3 li{display: flex; flex-direction: column; justify-content: center; width: calc(25% - (30px / 4)); min-height: 110px; padding: 20px; text-align: center;  border: 1px solid #c29262; border-radius: 10px; box-sizing: border-box; background-color: #fff;}
.honor3 li .name{display: inline-block; font-size: 19px; margin-bottom: 10px;}

/* 지역나눔기업체 */
.Enterprise ul:after{content: ""; display: block; clear: both;}
.Enterprise li{float: left; width: 24.25%; margin-right: 1%; margin-bottom: 10px; padding: 10px; box-sizing: border-box; border: 1px solid #ddd; box-sizing: border-box;}
.Enterprise li:nth-child(4n){margin-right: 0;}
.Enterprise li img{width: 100%;}


/* 자원봉사 활동처 안내 */
.searchbox{background-color: #f7f6f2; border-top: 2px solid #0c9e1a; padding: 30px;}
.searchbox .sch_tit{ margin-bottom: 15px; font-size: 19px; color: #444; padding-left: 25px; background-image:url(../img/sub/icon_check.png); background-repeat: no-repeat; background-position: left center;}
.searchbox ul:after{content: ""; display: block; clear: both;}
.searchbox li{float:left; margin-right: 10px; margin-bottom: 5px; font-size: 17px; color: #555;}
.receiver_name{width: 472px; height: 35px; border: 1px solid #ddd;}
.btnA{display: block; width: 180px; margin: 30px auto 0 auto; border: none; font-size: 20px; color: #fff; text-align: center; line-height: 50px; background-color: #229a18;}
.btnA:hover{background-color: #14830b;}


/* 테이블 */
table.typeB{display:table; table-layout:fixed; margin: -1px; margin-bottom:10px; width:100%; border-top:2px solid #5b5b5b; border-bottom:1px solid #5b5b5b; border-collapse:separate; border-collapse:collapse}
table.typeB th{padding:14px 20px; font-size:17px; color:#555; border-bottom:1px solid #ddd; word-wrap:break-word; word-break:keep-all;background:#f8f8f9; color:#111; font-weight:400; text-align:center;}
table.typeB td{padding:14px 20px; text-align: center; font-size:16px; color:#666; border-bottom:1px solid #ddd; word-wrap:break-word; word-break:keep-all;}
table.typeB td .dash li {text-align:left; padding-left:15px; font-size:16px; background:url(../img/layout/dash.jpg) no-repeat 0 14px; line-height:1.7;}
table.typeB .tbl_b_right {border-right:1px solid #ddd;}
table.typeC{display:table; table-layout:fixed; margin: -1px; margin-bottom:10px; width:100%; border-top:2px solid #5b5b5b; border-bottom:1px solid #5b5b5b; border-collapse:separate; border-collapse:collapse}
table.typeC th{padding:14px 20px; font-size:17px; color:#555; border-bottom:1px solid #ddd; word-wrap:break-word; word-break:keep-all;background:#f8f8f9; color:#111; font-weight:400; text-align:center;}
table.typeC td{padding:14px 20px; text-align: left; font-size:16px; color:#666; border-bottom:1px solid #ddd; word-wrap:break-word; word-break:keep-all;}
table.typeC td .dash li {text-align:left; padding-left:15px; font-size:16px; background:url(../img/layout/dash.jpg) no-repeat 0 14px; line-height:1.7;}
table.typeC .tbl_b_right {border-right:1px solid #ddd;}

/* 재능기부 글쓰기 */
.red_btn{color: #fff !important; background: #e83046; border: 0 !important;}
.red_btn:hover{background: #ba1f31 !important;}
.green_btn{color: #fff !important; background: #487f21; border: 0 !important;}
.green_btn:hover{background: #2a530c !important;}
.board-info{ padding:0 0 7px 0; text-align:right; }
.board-info .required{ padding:0 0 0 10px; background:url(../img/bul_start_red.png) no-repeat left center; }

.board-type-4{ width:100%; border-top:2px solid #13aa22; border-bottom:2px solid #cccccc;}
.board-type-4 th{ width:115px; padding-left:12px; text-align:left; background:#fbfbfb; letter-spacing:-1px; font-family:"NanumGothicBold"; }
.board-type-4 td{ width:auto; color:#555; padding-left:10px; padding-right:10px; }
.board-type-4 th *, .board-type-4 td *{ vertical-align:middle; }
.board-type-4 td #edu_title{width:580px;}
.board-type-4 th, .board-type-4 td{ border-bottom:1px solid #ccc; height:41px; }
.board-type-4 th .required, .board-type-4 td .required{ background:url(../img/bul_start_red.png) no-repeat left 2px; }
.board-type-4 th label, .board-type-4 td .required label{ padding:0 0 0 10px; }
.board-type-4 th .txt-break{ line-height:15px; }
.board-type-4 td .security{ margin:0 6px 0 3px; }
.board-type-4 td .day_area{ margin-right:13px; }
.board-type-4 td .required{ font-size:13px; }
.board-type-4 td .security input{ margin-right:10px; }
.board-type-4 td .security .reflesh{ margin-left:5px; width:30px; }
.board-type-4 td .reflesh2{ margin:0 5px; width:87px; }
.board-type-4 td .pass_info{ font-size:13px; letter-spacing:-1px; margin-left:10px; }
.board-type-4 td .dash{ margin:0 3px; }
.board-type-4 tr.last td{ padding:10px 0; }
.board-type-4 caption{display: none;}
.board-type-4 input{border: 1px solid #c1c1c1; height: 30px; line-height: 30px;border-radius: 0px;}
.board-type-4 input.title_input{width: calc(100% - 133px);}
.board-type-4 textarea{width: 100%; height: 180px; border: 1px solid #c1c1c1;}
.board-type-4 .btn_frmline{height: 30px;}
.board-type-4 th .required{padding-right: 15px;}
.line_select{border: 1px solid #777 !important;}

#bo_gall .gall_li.type2{height: auto;}

/*재능기부 뷰페이지*/
.talent-list { margin: 30px 0 7px; overflow: hidden; }
.talent-list ul { margin:0px; padding:0px; }
.talent-list ul li { float: left; margin: 0px 7px 30px 8px; width:226px; position: relative;  }
.talent-list ul li a { display: block; width: 226px; /*height: 119px;*/ overflow:hidden;  }
.talent-list ul li a img { border: 1px solid #dfdfdf; /*float: left;*/ margin:0px;  width: 224px; height: 224px; text-align:left; padding:0px;}
.talent-list ul li .edu { display: block; height:20px; text-align:left; margin:0px; font-size:120%; color:#000; width:200px; padding:5px 0px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.talent-list ul li .date,
.talent-list ul li .name {isplay: block; height:18px; line-height:18px; text-align:left; margin:0px; font-size:95%; width:200px; padding:0px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.talent-list ul li .ing { position:absolute; background:#e83046; font-size:85%; color:#fff; z-index:10; top:10px; left:10px; width:60px; text-align:center; }
.talent-list ul li .end { position:absolute; background:#595959; font-size:85%; color:#fff; z-index:10; top:10px; left:10px; width:60px; text-align:center; }


.talent_view{display:block; position:relative; overflow:hidden; padding:0px; margin-bottom:20px;}

.talent_view .talent_con { padding:0px; background:#fff; overflow:hidden; position:relative; }	 
.talent_view .talent_con:after{content:""; display: block; clear: both;}
.talent_con h4 { padding-left: 40px;; float:right; width:70%;; text-align:left; color:#000; display:inline; font-size:140%; font-weight:600; vertical-align:top; line-height:40px; background:none; }
.talent_con .lecture_thm {float:left; margin:0px; padding:0px; width:30%; position:relative;  }
.talent_con .lecture_thm img { width:100%; border:1px solid #dadada; margin:7px 0 0 0; padding:0px;}

.lecture_thm .ing { position:absolute; background:#e83046; font-size:85%; color:#fff; z-index:10; top:17px; left:10px; width:60px; text-align:center; }
.lecture_thm .end { position:absolute; background:#595959; font-size:85%; color:#fff; z-index:10; top:17px; left:10px; width:60px; text-align:center; }
.lecture_thm .wait { position:absolute; background:#487f21; font-size:85%; color:#fff; z-index:10; top:17px; left:10px; width:60px; text-align:center; }
.lecture_thm_02 .ing{top: 10px; left: calc(100% - 70px);}
.lecture_thm_02 .end{top: 10px; left: calc(100% - 70px);}
.lecture_thm_02 .wait{top: 10px; left: calc(100% - 70px);}


.talent_con ul {margin:0px; padding:0px; float:right; width:70%;}
.talent_con ul li { margin:0px; padding:0px 0 0 13px; color:#000; line-height:32px; border-bottom:1px dashed #ccc; display: block; width:100%; background:url(/wp-content/plugins/hwm_board/img/list_type1_bulit2.gif) no-repeat left 13px;}
.talent_con ul li span { padding-right:10px; margin-right:10px; width:80px; float:left; color:#666;  }

.lecture_device { border:1px solid #ccc; padding:20px; margin:0px 0 30px 0; }
.lecture_device h4 { background:none; font-size:110%; font-weight:600; margin:0px 0 15px 0; padding:0px 0 10px 0; border-bottom:1px dashed #ccc; }

.t_btn{display: inline-block; padding: 0px 20px;color: #fff !important; text-decoration: none !important; line-height: 45px;}
.btn-type-1{ background-color: #1565a0;}
.btn-type-2{ background-color: #487f21;}
.btn-type-3{ background-color: #686868;}

/* 레이어팝업 */
.pop-wrap{ position:absolute; display:none; bottom: 70px; left:50%; transform: translateX(-50%); width:60%; height:490px; box-shadow: 5px 5px 11px 2px rgb(0 0 0 / 20%); border-radius: 10px;}
.pop-wrap .pop-pwd{ z-index:9999; border:2px solid #aaaaaa; background:#fff; border-radius:10px; width:100%; height:100%; overflow: hidden; }
.pop-wrap .pop-pwd.pwd02 {}
.pop-wrap .pop-pwd .pop-top{ border-bottom:1px solid #d8d8d8; padding:3px 0 0 10px; height:45px; line-height:41px; font-size:20px;background:#fff; font-family:"NanumGothicBold"; color:#333; }
.pop-wrap .pop-pwd .pop-cnt { height:159px; background:#fff; text-align:center; }
.pop-wrap .pop-pwd .pop-cnt02 {width:100%;  height:calc(100% - 41px); background:#fff; text-align:center; padding:10px 10px 0px 10px; margin-bottom:20px;overflow-y:scroll; }
.pop-wrap .pop-pwd .pop-cnt02 th,
.pop-wrap .pop-pwd .pop-cnt02 td {font-size:14px; }
.pop-wrap .pop-pwd .pop-cnt .pop-txt{ padding: 17px 0 8px 0; font-size:16px; }
.pop-wrap .pop-pwd .pop-cnt .pop-txt2{ padding: 17px 0 8px 0; font-size:14px; }
.pop-wrap .pop-pwd .pop-cnt .pwd{ margin-bottom:17px; }
.pop-wrap .pop-pwd .pop-cnt .btn-wrap button:first-child{ margin:0 10px 0 0; }
.pop-wrap .pop-pwd a{ overflow:hidden; position:absolute; top:16px; right:16px; width:16px; height:16px; background:url("../img/sub/btn_close_pop.png") no-repeat; text-indent:-9999px; }

.pop-pwd2{     
	z-index: 9999;
    position: absolute;
    top: 25%;
    left: 50%;
    margin-left: -140px;
    margin-top: -89px;
    border: 1px solid #ccc;
    width: 310px;
    height: 178px;
    overflow: hidden;
	display:none;
}
.pop-pwd2 .pop-top{    
	padding: 0 0 0 10px;
    height: 39px;
    line-height: 39px;
    font-size: 14px;
    font-weight: 700;
    background: #dfdfdf;
}
.pop-pwd2 .pop-cnt { height:139px; background:#fff; text-align:center; }
.pop-pwd2 .pop-cnt .pop-txt1{ padding: 20px 0 5px 0; color:#000; }
.pop-pwd2 .pop-cnt .pop-txt2{ padding: 2px 0 3px 0; color:#000; }
.pop-pwd2.pop-cnt .pwd{ margin: 0px 0 8px 0; }
.pop-pwd2 .pop-cnt .btn-wrap button:first-child{ margin:0 10px 0 0; }
.pop-pwd2 a{ 
	position: absolute;
    top: 10px;
    right: 11px;
    border: 1px solid #ccc;
    width: 16px;
    height: 16px;
    line-height: 14px;
    text-align: center;
    background: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #777;
	vertical-align: middle;
}
.close{cursor: pointer;}

/* 테이블1 */
table{table-layout:fixed;}
caption{display: none;}
.board-type-1{ width:100%; border-top:2px solid #ff8500; text-align:center; table-layout:fixed; font-family: "NanumGothicBold";}
.board-type-1 th{ background:#e9e9e9; font-family:"NanumGothicBold"; }
.board-type-1 td{ color:#555; }
.board-type-1 th, .board-type-1 td{ border-bottom:1px solid #ccc; height:40px; }
.board-type-1 td *{ vertical-align:middle; }
.board-type-1 td p { white-space: inherit; text-overflow: ellipsis; overflow: hidden; padding-top: 6px; padding-bottom: 6px; }
.board-type-1 .flag-notice td{ background:#f5f5f5; }


.board-type-11{ width:100%; border-top:2px solid #68b333; text-align:center; table-layout:fixed; font-family: "NanumGothicBold";}
.board-type-11 th{ background:#e9e9e9; font-family:"NanumGothicBold"; }
.board-type-11 td{ color:#555; }
.board-type-11 th, .board-type-11 td{ border-bottom:1px solid #ccc; height:40px; }
.board-type-11 td *{ vertical-align:middle; }
.board-type-11 td p { white-space: inherit; text-overflow: ellipsis; overflow: hidden; padding-top: 6px; padding-bottom: 6px; }
.board-type-11 .flag-notice td{ background:#f5f5f5; }

/* 신청페이지 글쓰기 */
.talent_write input{width: 32.66666666666667%; margin-right: 1%; margin-left: 0 !important; min-width: 200px; margin-bottom: 0 !important;}
.talent_write input:last-child{margin-right: 0;}
.talent_write2 input{width: 20%;padding-right: 0 !important; min-width: 200px;}
.talent_write2 input:first-child{width: 32.66666666666667%;}
.number{margin:0 5px;}

/*개인정보처리방침*/
.personal_data h2{
    font-size: 23px;
}
.personal_data h3{
    padding-top: 20px;
    margin: 30px 0 20px 0;
    font-size: 21px;
    border-top: 1px solid #ddd;
    border-style: dashed;
}
.personal_data p{
    margin: 10px 0;
}

/* ************************ 1180px 이하(~1180) ************************ */
@media screen and (max-width: 1180px){
	.content_Wrap{width: 100%; margin: 0 auto; padding: 30px 15px;}
	/* 인사말 */
	.greeting{background: none; padding: 0;}
	.greeting .pc{display: none;}
    .greeting .after{position: inherit;}
	/* 자원봉사참여안내 */
	.process li{width: 28%;}

	/* 재능나눔 */
	.way li{height: 100px;}
	
	/* 북구푸드뱅크 */
	.txt_fb{width: 100%;}
    .fb_bg{width: 450px;}
    .fb_bg img{width: 100%;}
    .process2 li{width: 29%;}

	/* 명예의 전당 */
    .honor_top .image{float: none; margin: 0 auto;}
    .honor_top .txt{float: none; width: 80%; margin: 0 auto;}
    .honor_top .txt .s_txt{margin-top: 20px;}

.honor li {    width: calc((100% - 20px) / 2);}
.honor li:nth-child(3) {margin-top:10px; margin-right:5px;}
}



/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
	/*** 자원봉사 ***/
	/* 자원봉사란? */
	.definition_wrap>div:last-child img {position:relative; right:0;}
	
	/* 재능나눔 */
	.way li{height: auto;}
	.way li .tit{width:100%;}
	.way li .txt{width: 100%;}
	.way li .txt{line-height:  25px;padding: 20px;}
	.way li .txt span{margin-top: 0;}
    
    /* 북구푸드뱅크 */
    .fb_box{padding: 40px;}
    .fb_bg{width: 310px;}

	/* 레이어팝업 */
	.pop-wrap{width: 90%;}
}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	/*** 공통 ***/
    .pc{display: none;}
    .mo{display: block;}
    
	/* tableMode */
	.tableMode, .tableMode>* {display:block;}
	
	/* deco */
	.point_dot2 li {background-position:0 7px;}
		
	
	/*** 센터소개 ***/
    /* 인사말 */
    .greeting h2{font-size: 22px;}
    .greeting h2 span{font-size: 24px;}
    
    /* 주요사업 */
    .business .L:after{display: none;}
    .business .L{width: 220px; height: 70px; padding-left: 18px; line-height: 70px; background-size: 100%; font-size: 20px;}
    .business .R{width: 100%; padding: 15px; margin-top: 5px;}
    .business li{margin-top: 0; }
    .business li:nth-child(1) .L{margin-top: 0px;}
    .business li:nth-child(2) .L{margin-top: 0px;}
    .business li:nth-child(3) .L{margin-top: 0px;}
    
    
	/* 연혁 */
	.list_1st {padding-left:0;}
	.list_1st:before{left:6px;}
	.list_1st li span {float:none; display:block; width:100%;}
	.list_1st li span.year_st {font-size:20px;}
	.list_1st li .dl_wrap {display:block;width:100%;margin-top:0;}
	.list_1st li dl dt{width:60px; padding-left:10px;}
	.list_1st li dl dd{width:calc(100% - 60px);}
	
	/* 조직도 */
	.organ_wrap {font-size:16px;}
	.organ_wrap > .organ_area_top > .contab_v1 {width:60%;}
	.organ_wrap > .organ_area_top > .contab_v1 > li:first-child:after {height:160px;}
	.organ_wrap > .organ_area_top > .contab_v2,
	.organ_wrap > .organ_area_top > .contab_v4 > li > span {width:100%;}
	.organ_wrap > .organ_area_top > .contab_v2 > li > span {width:95%;}
	.organ_wrap > .organ_area_top > .contab_v4 > li {width:30%;}
    .organ_wrap > .organ_area_under{width: 100%;}
	.organ_wrap > .organ_area_under > ul > li > span {width:90%;}	
	.organ_wrap > .organ_area_top > .contab_v2 > li > p > span {line-height:1.2;}	
	.organ_wrap > .organ_area_top > .contab_v2 > li > p,
	.organ_wrap > .organ_area_top > .contab_v4 > li > p {padding:10px 3px;}	
	.organ_wrap > .organ_area_under > ul > li > p {width:90%; height:60px; display:table; padding:0 3px;}
	.organ_wrap > .organ_area_under > ul > li > p > span {display:table-cell; vertical-align:middle; line-height:1.2;}
    .organ_wrap > .organ_area_under > ul > li{width: 50%;}
    
	/*** 자원봉사 ***/
	/* 자원봉사란? */
	.definition_wrap {padding:20px;}
	.definition_wrap>div:last-child {text-align:center;}
	.definition_wrap>div:last-child img {width:230px; bottom:0; margin-top:10px;}
	
	.characte_wrap>div {width:100%;}
	.characte_con dt {text-align:center; margin-top:10px;}
	.characte_con i {height:40px; background-size:contain;}
	
	.mind_list>li {margin-top:20px;}
	.mind_list>li>* {display:block;}
	.mind_list>li>p::before {display:none;}
	
	/* 자원봉사참여안내 */
	.process li{width: 100%;}
	.process span.pcVer{display: none;}
	.process span.moVer{display: inline-block; visibility: visible; width: 100%; text-align: center; margin: 5px 0;}
	.c_table{width: 100%; overflow-x: scroll;}
	.c_table table td{min-width: 150px; padding: 10px 5px;}

	/* 자원봉사 상해보험 안내 */
	.insurance ul{width: 70%; margin: 0 auto;}
	.insurance li{float: none; width: 100%;}

	/* 재능나눔 */
	.c_box2{padding: 20px;}
	.last_box{width: 100%; height: auto; line-height: 1.4em; padding: 15px; border: 5px solid #ddd; background-image: none;}
    .last_box2{padding: 30px;}
    
	/* 북구푸드뱅크 */
	.txt_fb{padding: 50px 0;}
    .fb_box{padding: 15px; font-size: 18px;}
    .fb_bg{display: none; }
    .fb_box .ft24{font-size: 20px;}
    .process2 li{width: 100%;}
	.process2 span.pcVer{display: none;}
	.process2 span.moVer{display: inline-block; visibility: visible; width: 100%; text-align: center; margin: 5px 0;}
	
	/* 명예의 전당 */
	.honor_top .image{float: none; width: 70%; margin: 0 auto;}
	.honor_top .txt{width:100%; padding: 25px; margin-top: 10px; font-size: 17px;}
	.honor li{width: 100%; margin-top: 10px;}
	.honor li:first-child{margin-top: 0;}
	.honor3 li{width: calc(50% - 5px);}
    .honor li .name{margin-top: 2%;}

	/* 지역나눔기업체 */
	.Enterprise li{width: 100%;}

    /* 자원봉사 활동처 안내 */
    .searchbox{padding: 20px;}
    .receiver_name{width: 100%;}
    table.typeB{width: 768px;}

	/*재능기부 뷰페이지*/
	.talent_con h4{widtH: 100%; padding-left: 0;}
	.talent_con .lecture_thm{width: 100%;}
	.talent_con ul{width: 100%; padding-left: 0 !important;}

	/* 레이어팝업 */
	.pop-wrap{width: 100%;}

}