@charset "utf-8";

img {max-width: 100%;}

/* 서브배너 */
.sub_banner {display: table; position: relative; width: 100%; height: 480px;}

.sub_banner.top_bg01 {background: url(../../resources/img/contents/sub/visual_1.jpg) repeat center center;}
.sub_banner.sharingStory {background: url(../../resources/img/contents/sharingStory/visual.jpg) repeat center center;}
.sub_banner.joinUs {background: url(../../resources/img/contents/joinUs/visual.jpg) repeat center center;}
.sub_banner.education {background: url(../../resources/img/contents/education/visual.jpg) repeat center center;}
.sub_banner.introduction {background: url(../../resources/img/contents/introduction/visual.jpg) repeat center center;}
.sub_banner.sharingNews {background: url(../../resources/img/contents/sharingNews/visual.jpg) repeat center center;}

.sub_banner .inner {display: block; width: 100%; margin: 0 auto; padding-top: 250px; text-align: center; vertical-align: middle;}
.sub_banner .inner .sub_title p {display: block; font-size: 42px; opacity: 0; color:#fff;}
.sub_banner.completed .inner em:after {opacity: 1;}
.load .sub_banner .inner p {opacity: 1;}

/* 서브 - 2depth */
.menu_area {}
.menu_area li a {display: block; font-size: 18px; font-weight: 300; color: #444; position: relative;}
.menu_area ul.w_tab {font-size: 0; margin: 0 auto; text-align: center; border-bottom: 1px solid #e0e0e0;}
.menu_area ul.w_tab li {display: inline-block; line-height: 83px; height: 83px; text-align:center; width: 250px;}
.menu_area ul.w_tab li a:hover {color: #239e82;}
.menu_area ul.w_tab li a:before {content: " "; display: inline-block; position: absolute; top: 80px; left: 50%; width: 0; height: 3px; background:#0d9173; -ms-transform: translate(-50%,0); -webkit-transform: translate(-50%,0); transform: translate(-50%,0); transition: .3s ease-in-out;}
.menu_area ul.w_tab li a:hover:before {width: 250px; text-align: center;}
.menu_area ul.w_tab li.on a {color: #239e82; position: relative;}
.menu_area ul.w_tab li.on a:before {content: ''; position: absolute; top: 80px; left: 50%; width: 250px; height: 3px; background-color: #239e82;}
.menu_area .w_tab {display: block;}
.menu_area .m_tab {display: none;}

/* 서브컨텐츠 - COMMON */
.mgbt_10 {margin-bottom: 10px;}
.img_C {text-align: center;}
.img_C img {width: 100%;}

.sub_contents {padding-bottom: 80px; border-bottom: 1px solid #f1f1f1; clear: both; }
.sub_article {position: relative; margin: 0 auto; text-align: center; width: 100%;}

.sub_article .h1 {color: #222; font-size: 36px; font-family: "NotoKrM", sans-serif; text-align: center; margin: 80px 20px 55px;}
.sub_article h2 {color: #222; font-size: 36px; font-family: "NotoKrM", sans-serif; text-align: center; margin: 80px 20px 55px;}
.sub_article .h2 {color: #222; font-size: 26px; font-family: "NotoKrM", sans-serif; margin-bottom: 20px;}
.sub_article h3 {color: #222; font-size: 26px; font-family: "NotoKrM", sans-serif; margin-bottom: 20px;}
.sub_article .h3 {color: #333; font-size: 16px; font-family: "NotoKrM", sans-serif; margin: 20px 0 10px;}
.sub_article h4 {color: #333; font-size: 16px; font-family: "NotoKrM", sans-serif; margin: 20px 0 10px;}
.sub_article .p1 {color: #666; font-size: 16px; font-family: "NotoKrL", sans-serif; margin-bottom: 40px;}
.sub_article .sub_box {max-width: 1160px; margin: 0 auto; text-align: left;}

.bg_text_area {width: 100%; margin: 0 auto; text-align: center;}
.bg_text_area .bg_tit {width: 135px; height: 40px; line-height: 40px; background-color: #239e82; text-align: center; color: #fff; font-family: "NotoKrM", sans-serif; font-size: 16px; margin: 0 auto; text-align: center; text-transform: uppercase; margin-bottom: 30px;}
.bg_text_area .text1 {font-family: "NotoKrL", sans-serif; font-size: 34px; color: #fff; margin-bottom: 15px;}
.bg_text_area .text2 {font-family: "NotoKrL", sans-serif; font-size: 16px; color: #fff;}
.bg_text_area .text3 {font-family: "NotoKrL", sans-serif; font-size: 30px; color: #fff;}

.li_dot {font-size: 0; line-height: 0;}
.li_dot li {font-size: 16px; color: #666; font-family: "NotoKrL", sans-serif; line-height: 140%; position: relative; padding-left: 10px; margin-bottom: 15px;}
.li_dot li:before {content: ''; width: 2px; height: 2px; background-color: #959595; top: 12px; left: 0; position: absolute;}

.sub_article.contact .h2 {margin-top: 50px; margin-bottom: 0;}
.sub_article.contact h2 {margin-top: 50px; margin-bottom: 0;}

.contact .li_dot li {margin-bottom: 0px; line-height: 180%}

/* 검색영역 */
.con_search_wrap {background-color: #f1f1f1; width: 100%; padding: 20px; margin-bottom: 70px;}
.con_search_wrap .con_search_box {max-width: 610px; text-align: center; margin: 0 auto;  height: 100%;}
.con_search_wrap .con_search_box .con_search_select {width: 175px; display: inline-block; vertical-align: top; margin-right: 37px;}
.con_search_wrap .con_search_box .con_search_select select {border-radius: 0; padding: 14px 10px; outline: none; vertical-align: middle; font-family: 'NotoKrL'; border: 0; box-sizing: border-box; font-size: 14px; color: #666; background: url(../img/common/ico_sel_arrow.png) no-repeat right 10px center; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-size: 14px 8px; width: 100%; border-bottom: 1px solid #666;}
.con_search_wrap .con_search_box .con_search_input {width: 390px; display: inline-block; vertical-align: top; position: relative;}
.con_search_wrap .con_search_box .con_search_input input[type="search"] {width: 100%; border: 1px solid #e0e0e0; padding: 14px 16px; background: #fff; position: absolute; left: 0; font-size: 14px; color: #999; font-family: 'NotoKrL';}
.con_search_wrap .con_search_box .con_search_input input[type="search"]::placeholder {color: #999;}
.con_search_wrap .con_search_box .con_search_input .search_icon {position: absolute; right: 14px; top: 12px;}
.con_search_wrap input[type=search]::-ms-clear {display: none; width : 0; height: 0;}
.con_search_wrap input[type=search]::-ms-reveal {display: none; width : 0; height: 0;}
.con_search_wrap input[type="search"]::-webkit-search-decoration,
.con_search_wrap input[type="search"]::-webkit-search-cancel-button,
.con_search_wrap input[type="search"]::-webkit-search-results-button,
.con_search_wrap input[type="search"]::-webkit-search-results-decoration {display: none;}
.con_search_wrap select::-ms-expand {display: none;}

/* 참여하기[자원봉사 안내] */
.vltInfo .bg_text_area {background: url(../../resources/img/contents/joinUs/vltInfo_img1.jpg) no-repeat center center; height: 460px; padding-top: 60px; margin-bottom: 55px;}
.symbol_ul_vltInfo {max-width: 1160px; margin: 0 auto; text-align: center; font-size: 0; line-height: 0;}
.symbol_ul_vltInfo li {display: inline-block; width: 25%; position: relative; min-height: 215px; text-align: center; line-height: 100%; vertical-align: top;}
.symbol_ul_vltInfo li:after {content: ''; width: 135px; height: 135px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px;}
.symbol_ul_vltInfo li:nth-child(1):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/joinUs/vltInfo_icon1.png) no-repeat center center;}
.symbol_ul_vltInfo li:nth-child(2):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/joinUs/vltInfo_icon2.png) no-repeat center center;}
.symbol_ul_vltInfo li:nth-child(3):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/joinUs/vltInfo_icon3.png) no-repeat center center;}
.symbol_ul_vltInfo li:nth-child(4):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/joinUs/vltInfo_icon4.png) no-repeat center center;}
.symbol_ul_vltInfo li p {color: #fff; text-align: center; margin: 0 auto;}
.symbol_ul_vltInfo li .title {position: absolute; top: 150px; width: 100%;  height: 50px; text-align: center; display: table;}
.symbol_ul_vltInfo li .title p {font-size: 16px; font-family: "NotoKrB", sans-serif; height: 50px; display: table-cell; vertical-align: bottom; min-width: 220px; text-align: center; line-height: 24px; }
.symbol_ul_vltInfo li p.text {font-size: 14px; word-wrap: break-word; word-break: keep-all; position: absolute; top: 215px; height: 40px; border-right: 1px solid #a09c97; min-width: 230px; padding: 0 35px; line-height: 23px;}
.symbol_ul_vltInfo li span.br {display: block;}
.vltInfo .alignL {display: inline-block; width: 60%; vertical-align: top;}
.vltInfo .alignR {display: inline-block; width: 39%; vertical-align: top; text-align: right;}
.vltInfo .box {padding: 30px; background: #f1f1f1;}
.vltInfo .box ul {display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center;}
.vltInfo .box li {flex: 1 1 auto; -webkit-flex: 1 1 auto; font-size: 16px; font-family: "NotoKrM"; color: #444444; text-align: center;}
.vltInfo ul.box-wrap {display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.vltInfo ul.box-wrap li {border: 1px solid #e0e0e0; padding: 10px 20px; margin: 6px 0; width: 49.5%; height: 178px; flex: 0 1 auto; -webkit-flex: 0 1 auto;}
.vltInfo ul.box-wrap li h4 {font-family: "NotoKrM"; font-size: 18px; color: #0d9173; font-weight: normal;}
.vltInfo ul.box-wrap li h4 + p {margin-top: 10px; font-size: 16px; font-family: "NotoKrL"; color: #666666; }
.vltInfo .bg_text_area.mission {background: url(../../resources/img/contents/introduction/img_1.jpg) repeat center center; height: 390px; padding-top: 120px; margin-bottom: 55px;}

/* 참여하기[자원봉사 신청] */
.board_wrap .box.box_text {padding-left: 40px;}
.box_text p {font-family: "NotoKrL", sans-serif;}
.box_text .textL {width: 25px; display: inline-block; vertical-align: top;}
.box_text .textR {width: 64%;  display: inline-block; vertical-align: top;}

/* 참여하기[개인소장도서 입력봉사 신청] */
.td-file .aL {display: inline-block; vertical-align: top; margin-right: 10px;}
.td-file .aR {display: inline-block; vertical-align: top; min-width: calc(100% - 120px)}

/* 참여하기[자원봉사 신청, 완료] */
.ico-find.vltAppComplete {background-image:url('../img/contents/joinUs/vltAppComplete.png')}

/* 나눔이야기 */
.con_list_wrap {line-height: 0; font-size: 0; max-width: 1205px; margin: 0 auto; text-align: center;}
.con_box {width: 33.3%; display: inline-block; vertical-align: top; text-align: center;}
.con_box a {display: inline-block; width: 90%;}
.con_box a > .img {margin-bottom: 25px;}
.con_box a > .title {margin-bottom: 20px; font-size: 18px; font-family: 'NotoKrM'; color: #222; line-height: 20px; text-align: left;}
.con_box a > .text {margin-bottom: 55px; font-size: 14px; font-family: 'NotoKrL'; color: #666; line-height: 22px; height: 42px; overflow: hidden; text-align: left;}

/* 미션 & 비전 */
.bg_text_area.mission {background: url(../../resources/img/contents/introduction/img_1.jpg) repeat center center; height: 390px; padding-top: 120px; margin-bottom: 55px;}
.bg_text_area.vision {background: url(../../resources/img/contents/introduction/img_2.jpg) repeat center center; height: 460px; padding-top: 75px; margin-bottom: 55px;}
.bg_text_area.vision .bg_tit {margin-bottom: 50px;}
.symbol_ul {max-width: 1160px; margin: 0 auto; text-align: center; font-size: 0; line-height: 0;}
.symbol_ul li {display: inline-block; width: 25%; position: relative; height: 215px; text-align: center;  vertical-align: top;}
.symbol_ul li:after {content: ''; width: 135px; height: 135px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px;}
.symbol_ul li:nth-child(1):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/introduction/vision_icon1.png) no-repeat center center;}
.symbol_ul li:nth-child(2):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/introduction/vision_icon2.png) no-repeat center center;}
.symbol_ul li:nth-child(3):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/introduction/vision_icon3.png) no-repeat center center;}
.symbol_ul li:nth-child(4):after {content: ''; background: rgb(53, 44, 28, 0.3) url(../../resources/img/contents/introduction/vision_icon4.png) no-repeat center center;}
.symbol_ul li p {font-size: 16px; color: #fff; line-height: 24px; width: 100%; word-wrap: break-word; word-break: keep-all; text-align: center; margin: 0 auto; position: absolute; top: 165px; padding-top: -10px; border-right: 1px solid #a09c97;}
.symbol_ul li p span.br {display: block;}
.symbol_ul li:nth-last-child(1) p {border-right: 0;}

/* 주요사업안내 */
.business_wrap {margin: 0 auto; text-align: center; max-width: 1232px; font-size: 0; line-height: 0;}
.business_wrap .business_box {max-width: 370px; display: inline-block; padding: 40px 30px 0; background-color: #f1f1f1; height: 445px; margin: 0 12px 24px; vertical-align: top;}
.business_wrap .business_box .tit {font-family: "NotoKrM", sans-serif; font-size: 22px; color: #222; margin-bottom: 25px; text-align: center; line-height: 100%;}
.business_wrap .business_box .text {font-family: "NotoKrL", sans-serif; font-size: 15px; color: #666; margin-bottom: 25px; text-align: left; line-height: 25px; min-width: 310px;}
.business_wrap .business_box .icon {position: relative; height: 130px; margin-bottom: 25px;}
.business_wrap .business_box:nth-child(1) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_1.png) no-repeat center center;}
.business_wrap .business_box:nth-child(2) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_2.png) no-repeat center center;}
.business_wrap .business_box:nth-child(3) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_3.png) no-repeat center center;}
.business_wrap .business_box:nth-child(4) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_4.png) no-repeat center center;}
.business_wrap .business_box:nth-child(5) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_5.png) no-repeat center center;}
.business_wrap .business_box:nth-child(6) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_6.png) no-repeat center center;}
.business_wrap .business_box:nth-child(7) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_7.png) no-repeat center center;}
.business_wrap .business_box:nth-child(8) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_8.png) no-repeat center center;}
.business_wrap .business_box:nth-child(9) .icon:after {content: ''; width: 130px; height: 130px; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-radius: 100px; background: #239e82 url(../../resources/img/contents/introduction/icon_9.png) no-repeat center center;}
.business_box .li_dot {font-size: 0; line-height: 0;}
.business_box .li_dot li {font-size: 15px; color: #666; font-family: "NotoKrL", sans-serif; line-height: 140%; position: relative; padding-left: 10px; margin-bottom: 5px; text-align: left;}

/* 교육안내 */
.education .board_wrap .bd-box.ptb80 {margin-top: 50px;}
.education .edu-info {padding: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center;}
.education .edu-info li {font-size: 16px; font-family: "NotoKrM"; color: #444444; text-align: left; margin-left: 50px;}
.education .edu-info li:first-child {margin-left: 0;}
.education .edu-info li strong {font-size: 22px;}
.education .edu-info li p {color: #666666; font-family: "NotoKrL"; line-height: 1.8; margin-top: 25px;}
.education .edu-info li p.years {font-family: "NotoKrM"; font-size: 18px; margin-top: 5px;}
.education .edu-info li .icon {width: 200px; height: 200px; border-radius: 50%; background-color: #0d9173; background-image: url('../../resources/img/contents/education/ico_0.png'); background-repeat: no-repeat; background-size: 97px 74px; background-position: center; font-size: 0; text-indent: -999px;}
.education .board_wrap .explain {background: #f1f1f1;padding: 25px 30px; margin-top: 40px;}
.education .board_wrap .explain p {position: relative; padding-left: 10px; color: #666666; font-family: "NotoKrL"; line-height: 1.8; text-align: left;}
.education .board_wrap .explain p:before {content:''; position: absolute; width: 2px; height: 2px; background: #919191; left: 0; top: 14px;}



/* 게시판 뷰 공통 */
.boardView {position: relative;}
.bbs_view {overflow: hidden; position: relative; border-top: 1px solid #666; border-bottom: 1px solid #666;}
.bbs_view > ul {overflow: hidden;}
.bbs_view > ul > li {display: inline-block; font-size: 18px; color: #666; vertical-align: middle;}
.bbs_view > ul > li > p.th {position: relative; float: left; min-height: 24px; text-align: center; line-height: 24px; box-sizing: border-box; margin-right: 12px; font-weight: 300; color: #222;}
.bbs_view > ul > li > p.td {position: relative; float: left; min-height: 24px; text-align: center; line-height: 24px; box-sizing: border-box; color: #747474; font-weight: 300;}
.bbs_view > ul.text_li {padding: 25px 40px; float: left; width: 100%; vertical-align: middle;}
.bbs_view > ul.text_li .subject {display: inline-block; max-width: 800px; padding-right: 200px;  width: calc(100% - 360px);}
.bbs_view > ul.text_li .subject p {text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; font-size: 18px; color: #666; height: 25px; line-height: 25px; width: 100%;}
.bbs_view > ul.text_li .hits {display: inline-block; max-width: 115px; height: 25px; line-height: 25px; font-size: 14px; color: #333; padding-right: 40px;}
.bbs_view > ul.text_li .date {display: inline-block; max-width: 170px; height: 25px; line-height: 25px; font-size: 14px; color: #333;}
.bbs_view > ul.text_li .subject strong {margin-top: -2px; display: inline-block; padding: 5px 10px; background: #0d9173; color: #fff; font-size: 14px; line-height: 14px; margin-right: 10px; font-family: "NotoKrL", sans-serif;}
.bbs_view.notice-row { background-color: #dcf6e5; }
.bbs_view.notice-row td { background-color: #dcf6e5; }

.boardView .cont {display: block; clear: both; border-top: 1px solid #ddd; border-bottom: 1px solid #666; font-size: 15px; font-family: "NotoKrL", sans-serif; color: #666; line-height: 140%; margin: 0 auto; text-align: left;}
.boardView .cont img {max-width: 100%; margin-bottom: 50px;}
.boardView .cont_area {padding: 60px 30px;}
.boardView .cont_area p {font-family: "NotoKrL", sans-serif; font-size: 15px; color: #666;}
.boardView .file_area {border-top: 1px solid #ddd; padding: 30px 30px 20px;}
.boardView .file_area .title {font-size: 14px; color: #333; display: inline-block; margin-right: 20px;}
.boardView .file_area > ul {display: inline-block; margin-right: 30px;}
.boardView .file_area > ul li { display: inline-block; font-size: 14px; color: #666; font-family: "NotoKrL", sans-serif;}
.boardView .file_area > ul li a { display: inline-block; font-size: 14px; color: #666; font-family: "NotoKrL", sans-serif;}
.boardView .file_area > ul li:nth-of-type(1) {background: url(../../resources/img/common/icon_file.png) no-repeat left top 5px; width: auto; height: 30px; padding-left: 20px;}
.boardView .file_area > ul li:nth-last-child(1) {display: inline-block; font-size: 14px; color: #969696;}
.boardNext {overflow: hidden; margin-top: 50px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.boardNext ul {overflow: hidden;}
.boardNext li {float: left; width: 100%; border-top: 1px solid #ddd; font-size: 16px;}
.boardNext li:first-child {border-top: none;}
.boardNext li > p {display: block; position: relative; float: left; width: 150px; padding: 20px 16px 18px 70px; font-size: 14px; font-weight: 400; color: #333; vertical-align: middle; line-height: 150%; box-sizing: border-box;}
.boardNext li > p.prev_txt {background: url(../../resources/img/common/arrow_prev_txt.png) no-repeat 40px 27px;}
.boardNext li > p.next_txt {background: url(../../resources/img/common/arrow_next_txt.png) no-repeat 40px 27px;}
.boardNext li > div {display: block; overflow: hidden; float: left; width: 50%; min-height: 20px; padding: 16px 0 16px 20px; vertical-align: middle; white-space: nowrap; text-overflow: ellipsis; word-wrap: normal; box-sizing: border-box; font-size: 16px; color: #666; font-family: "NotoKrL", sans-serif;}
.boardNext li > div.date {float: right; width: 20%; text-align: center; font-size: 14px; color: #666; padding-top: 20px;}
.boardNext li > div a {font-size: 16px; color: #666; font-family: "NotoKrL", sans-serif;}
.btn_both {margin: 40px 0 0; text-align: center;}
.btn_both button {width: 168px; height: 48px; border: 1px solid #0d9173; background: #0d9173; font-size: 16px; font-weight: 500; color: #fff;}


/* ========= 모바일 ========= */

@media (max-width: 1300px) {

    .sub_contents {padding: 0 0px 100px;}
    .sub_article {padding: 0 20px;}

    /* 나눔이야기 */
    .con_list_wrap {max-width: 1200px; text-align: center;}
    .con_box {width: 50%; padding: 0px;}
    .con_box a > .img img {width: 100%;}
    .con_box a {width: 100%;}

    /* 게시판 뷰 공통 */
    .bbs_view > ul.text_li {padding: 20px;}
    .bbs_view > ul.text_li .subject {max-width: initial; width: 90%; margin-bottom: 5px; padding-right: 0;}
    .boardView .cont {padding: 40px 0px 0;}

    /* 참여하기[자원봉사 신청] */
    .box_text .textR {width: 95%;}

} /* 1300 end */

@media (max-width: 1024px) {

	/* 서브 - 2depth */
	.menu_area .w_tab {display: none;}
	.menu_area .m_tab {display: block;}
	.menu_area .m_tab {position: relative; width: 100%; border-bottom:1px solid #e0e0e0; z-index:5; display: flex; border-top: 1px solid #e0e0e0}
    .menu_area .m_tab > li {position: relative; width: calc(100% - 70px); line-height: 50px; border-right: 1px solid #ccc; background:  url('../img/board/ico_selArr.png') no-repeat right 10px center; background-size: 15px 8px;}
    .menu_area .m_tab > li a {display: block; width: 100%; height: 100%; padding: 0px 20px;}
    .menu_area .m_tab > li ul {position: absolute; left: -1px; width:  calc(100% + 2px); margin: auto; top: 50px; display: none; }
    .menu_area .m_tab > li.on {background-image: url('../img/board/ico_selArrD.png');}
    .menu_area .m_tab > li:first-child {width: 70px; height: 50px; text-align: center; border-left: 1px solid #ccc; background: none; padding: 10px 20px; color: #777}
    .menu_area .m_tab > li:first-child a {padding: 0; }
    .menu_area .m_tab > li ul li {float: none; border: 1px solid #dcdcdc; margin-top: -1px; background: #fff}
    .menu_area .m_tab > li ul li:first-child {margin-top: 0; }
    .menu_area .m_tab > li ul li a {display: block; color: #999; width: 100%; height: 100%; padding: 0px 20px; background: none; line-height: 50px}
    .menu_area .m_tab > li ul li a:hover {color: #0c9172; }
    .menu_area .m_tab > li.on:active {background: #f3f3f3; color: #333; }
    .menu_area .m_tab > li:first-child a.ico-home {width: 100%; height: 100%; background: url('../img/board/ico_home.png') center no-repeat; background-size: 16px 13px; font-size: 0; text-indent: -999px}

    .menu_area li a {font-size: 16px;}

    /* 참여하기[자원봉사 안내] */
    .vltInfo .alignL {display: block; width: 100%;}
    .vltInfo .alignR {display: block; width: 100%; text-align: center}
    .symbol_ul_vltInfo li {width: 50%; min-height: 350px;}
    .symbol_ul_vltInfo li .title {top: 135px;}
    .symbol_ul_vltInfo li p.text {top: 195px;}
    .vltInfo .bg_text_area {background: url(../../resources/img/contents/joinUs/vltInfo_img1.jpg) no-repeat center center; height: 740px; background-size: 100% 740px;}

    /* 미션 & 비전 */
    .symbol_ul li {width: 50%; margin-bottom: 30px;}
    .symbol_ul li p {border-right: 0;}
    .bg_text_area.vision {background: url(../../resources/img/contents/sub/img_2_m.jpg) repeat center center; height: 750px; padding-top: 75px; margin-bottom: 55px;}

    /* 검색영역 */
    .con_search_wrap .con_search_box .con_search_select {margin-right: 15px;}

    /* 나눔이야기 */
    .con_search_wrap .con_search_box .con_search_input {width: 345px;}

	.bbs_view > ul.text_li .subject p {width: 100%;}

	.vltInfo .box {padding: 15px;}
	.vltInfo .box ul {flex-wrap: wrap; -webkit-flex-wrap: wrap;}
	.vltInfo .box ul li {width: 100%; text-align: left;}
	.vltInfo ul.box-wrap li h4 {margin-top: 0;}
	.vltInfo ul.box-wrap li {width: 100%; height: auto; padding: 20px;}



} /* 1024 end */

@media (max-width: 640px) {

    .sub_article .h1 {font-size: 34px;}
	.sub_article h2 {font-size: 34px;}


    /* 참여하기[자원봉사 안내] */
    .symbol_ul_vltInfo li {width: 100%; min-height: 330px;}
    .symbol_ul_vltInfo li p.text {border-right: 0;}
    .vltInfo .bg_text_area {height: 1380px; background-size: 100% 1380px;}
    .vltInfo .alignL {width: 100%;}
    .vltInfo .alignR {width: 100%; text-align: center; margin-bottom: 70px}
    .vltInfo .alignR img {width: 80%;}

    /* 참여하기[자원봉사 신청] */
    .box_text .textR {width: 91%;}
    .board_wrap .box.box_text {padding-left: 20px;}

    /* 미션 & 비전 */
    .symbol_ul {padding: 0 10px;}
    .symbol_ul li {margin-bottom: 20px;}
    .symbol_ul li p {font-size: 14px; letter-spacing: -1px; line-height: 20px; padding: 0 20px; top: 145px;}
    .symbol_ul li p span.br {display: inline-block;}
    .symbol_ul li:after {width: 120px; height: 120px;}

    /* 나눔이야기 */
    .con_search_wrap {padding: 10px 20px 70px;}
    .con_search_wrap .con_search_box .con_search_select {width: 100%;}
    .con_search_wrap .con_search_box .con_search_input {width: 100%; margin-top: 20px;}
    .con_box {width: 100%;}

    /* 게시판 뷰 공통 */
    .boardView .cont {padding: 10px 0 0;}
    .bbs_view > ul.text_li {padding: 20px 10px;}
    .boardView .file_area .title {width: 100%; margin-right: 0; margin-bottom: 10px;}
    .boardView .cont_area {padding: 30px 10px;}
    .boardView .cont img {margin-bottom: 30px;}
    .boardView .file_area {padding: 20px 10px 15px;}
    .boardView .file_area > ul {display: block; width: 100%;}
    .boardNext li > p {padding: 20px 16px 18px 35px;}
    .boardNext li > p.prev_txt {background: url(../../resources/img/common/arrow_prev_txt.png) no-repeat 10px 27px; width: 90px;}
    .boardNext li > p.next_txt {background: url(../../resources/img/common/arrow_next_txt.png) no-repeat 10px 27px; width: 90px;}
    .boardNext li > div {padding: 16px 0 16px 10px;}
    .btn_both {margin: 30px 0;}
    .boardNext {margin-top: 30px;}

	span.br640 {display: block;}
	.vltInfo .bg_text_area.mission {padding-top: 50px; height: 300px;}
	.vltInfo .box {padding: 15px;}
	.vltInfo .box ul {flex-wrap: wrap; -webkit-flex-wrap: wrap;}
	.vltInfo .box ul li {width: 100%; text-align: left;}
	.vltInfo ul.box-wrap li h4 {margin-top: 0;}
	.vltInfo ul.box-wrap li {width: 100%; height: auto; padding: 20px;}
	.vltInfo .bg_text_area .text3 {font-size: 24px;}


	.education .edu-info {flex-wrap: wrap; -webkit-flex-wrap: wrap;}
	.education .edu-info li {margin-left: 0;}
	.education .edu-info li .icon {width: 150px; height: 150px; background-size: 70px 53px;}
	.education .edu-info li strong {display: block; margin-top: 20px;}
	.education .edu-info li p {font-size: 15px;}
	.education .edu-info li strong, .education .edu-info li p.years {text-align: center;}
	.education .board_wrap .bd-box.ptb80 {padding: 50px 0px; font-size: 15px;}
	.education .board_wrap .explain p {font-size: 15px;}
	.education .board_wrap .explain p:before {top: 12px;}


} /* 640 end */