@charset "UTF-8";
/*-------------------------------------------------------------------
    File Name : main.scss
    Date : 2020.06.23. Lee Hye Jin
    Summary : Main Style
-------------------------------------------------------------------*/
/* [s] all */
.notice__wrap { position: relative; padding: 45px 0 65px; float: left; width: calc(50% - 26px); }
.notice__wrap + .notice__wrap { float: right; }
@media screen and (max-width: 1024px) { .notice__wrap { float: none !important; width: 100%; padding-top: 20px; padding-bottom: 20px; } }
.title { font-size: 30px; font-weight: 700; color: #000; margin-bottom: 30px; }
@media screen and (max-width: 768px) { .title { font-size: 24px; margin-bottom: 15px; } }
.btn-more { position: absolute; top: 55px; right: 0; display: inline-block; min-width: 90px; height: 32px; line-height: 30px; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 32px; text-align: center; }
.btn-more span { padding-right: 15px; background: url("../img/main/btn_more.png") no-repeat right center; color: #fff; font-size: 17px; }
/*-- [e] all */
/* [s] slideset */
.slideset__wrap { position: relative; }
.slideset__wrap .slick-prev, .slideset__wrap .slick-next { text-indent: 100%; white-space: nowrap; overflow: hidden; position: absolute; top: 50%; z-index: 1; transform: translateY(-50%); width: 77px; height: 77px; background: url("../img/main/slick_prev.png") no-repeat 0 0; background-size: 100% auto; }
.slideset__wrap .slick-prev { left: 50px; }
.slideset__wrap .slick-next { right: 50px; background-image: url("../img/main/slick_next.png"); }
.slideset__wrap .slick-control { position: absolute; bottom: 60px; width: 100%; text-align: center; vertical-align: middle; font-size: 0; }
.slideset__wrap .slick-control:after { content: ''; display: block; clear: both; }
.slideset__wrap .slick-control button { text-indent: 100%; white-space: nowrap; overflow: hidden; }
.slideset__wrap .slick-control > * { display: inline-block; vertical-align: middle; }
.slideset__wrap .paging li { display: inline-block; line-height: 29px; margin: 0 10px; }
.slideset__wrap .paging button { width: 14px; height: 14px; background: url("../img/main/slick_off.png") no-repeat 0 0; background-size: 100% auto; vertical-align: sub; }
.slideset__wrap .paging .slick-active button { width: 41px; background-image: url("../img/main/slick_on.png"); }
.slideset__wrap .slick-pause, .slideset__wrap .slick-play { width: 10px; height: 12px; background: url("../img/main/slick_pause.png") no-repeat 0 0; background-size: 100% auto; margin: 0 10px; }
.slideset__wrap .slick-play { background-image: url("../img/main/slick_play.png"); }
.slideset__wrap .num { color: #fff; font-size: 20px; font-weight: 300; padding-left: 15px; vertical-align: middle; }
@-webkit-keyframes text-animation { 0% { transform: translateY(-50px);
    -webkit-transform: translateY(-50px);
    opacity: 0; }
  50% { opacity: 0.2; }
  100% { transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1; } }
@keyframes text-animation { 0% { transform: translateY(-50px);
    -webkit-transform: translateY(-50px);
    opacity: 0; }
  50% { opacity: 0.2; }
  100% { transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1; } }
.slideset__list img.mhide { max-width: none; width: auto; height: 100%; }
.slideset__list img.mblock { width: 100%; height: auto; }
.slideset__list .slick-slide { position: relative; height: 626px; }
.slideset__list .txt__wrap { position: absolute; top: 68px; left: 0; display: table-cell; width: 100%; text-align: center; }
.slideset__list .txt__wrap > p { display: inline-block; width: 100%; color: #fff; word-break: keep-all; word-wrap: break-word; }
.slideset__list .sub-tit { font-size: 52px; font-weight: 300; letter-spacing: -0.3px; -webkit-animation: text-animation 1s both; animation: text-animation 1s both; }
.slideset__list .tit { font-size: 70px; font-weight: 700; letter-spacing: -0.7px; -webkit-animation: text-animation 1s ease-out 1s both; animation: text-animation 1s ease-out 1s both; }
.slideset__list .txt { font-size: 30px; font-weight: 300; letter-spacing: -0.4px; margin-top: 30px; -webkit-animation: text-animation 1s ease-out 2s both; animation: text-animation 1s ease-out 2s both; }
.slideset__list .btn-detail { margin-top: 65px; display: inline-block; height: 45px; line-height: 43px; border-radius: 45px; text-align: center; padding: 0 17px 0 27px; border: 1px solid rgba(255, 255, 255, 0.7); }
.slideset__list .btn-detail > span { display: inline-block; padding-right: 28px; color: #fff; font-weight: 300; background: url("../img/main/btn_deatil.png") no-repeat right center; }
@media screen and (max-width: 1024px) { .slideset__wrap .slick-prev, .slideset__wrap .slick-next { width: 45px; height: 45px; }
  .slideset__wrap .slick-prev { left: 30px; }
  .slideset__wrap .slick-next { right: 30px; }
  .slideset__list .slick-slide { height: 550px; }
  .slideset__list .txt__wrap { position: absolute; top: 68px; left: 0; display: table-cell; width: 100%; text-align: center; }
  .slideset__list .txt__wrap > p { display: inline-block; width: 100%; color: #fff; }
  .slideset__list .sub-tit { font-size: 32px; }
  .slideset__list .tit { font-size: 55px; }
  .slideset__list .txt { font-size: 18px; margin-top: 20px; }
  .slideset__list .btn-detail { margin-top: 30px; } }
@media screen and (max-width: 768px) { .slideset__wrap .slick-slide { height: auto; }
  .slideset__wrap .slick-prev, .slideset__wrap .slick-next { display: none !important; }
  .slideset__wrap .slick-control { bottom: 15%; }
  .slideset__wrap .paging li { line-height: 20px; margin: 0 5px; vertical-align: middle; }
  .slideset__wrap .paging button { width: 10px; height: 10px; }
  .slideset__wrap .paging .slick-active button { width: 29px; }
  .slideset__wrap .slick-pause, .slideset__wrap .slick-play { width: 8px; height: 10px; margin: 0 5px; }
  .slideset__wrap .num { font-size: 16px; line-height: 20px; padding-left: 10px; }
  .slideset__list .txt__wrap { top: 20%; }
  .slideset__list .sub-tit { font-size: 25px; }
  .slideset__list .tit { font-size: 40px; }
  .slideset__list .txt { font-size: 16px; }
  .slideset__list .btn-detail { margin-top: 10%; height: 35px; line-height: 33px; border-radius: 35px; padding: 0 17px 0 27px; }
  .slideset__list .btn-detail > span { font-size: 13px; padding-right: 15px; background-size: auto 10px; } }
/*-- [e] slideset */
/* [s] 새소식 */
.main__content { background: url("../img/main/bg1.png") no-repeat right bottom; padding: 50px 0; }
.main__content > div { position: relative; }
.main__content > div:after { content: ''; display: block; clear: both; }
.main__content .tit__wrap { float: left; width: 310px; }
.main__content .sub-tit { color: #000; font-size: 21px; font-weight: 700; }
.main__content .tit { color: #00ac97; font-size: 46px; font-weight: 700; }
.main__content .txt__wrap { float: right; width: calc(100% - 310px); padding-left: 77px; border-left: 1px solid #ddd; }
.main__content .txt__wrap li { margin-top: 18px; background: url("../img/main/blt.png") no-repeat 0 12px; padding-left: 18px; font-size: 18px; color: #636363; }
.main__content .txt__wrap li:after { content: ''; display: block; clear: both; }
.main__content .txt__wrap li:first-child { margin-top: 0; }
.main__content .txt__wrap li.notice a { color: #00ac97; }
.main__content .txt__wrap a { overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; -moz-binding: url("ellipsis.xml#ellipsis"); display: inline-block; width: calc(100% - 105px); font-size: 18px; line-height: 31px; color: #636363; vertical-align: top; }
.main__content .txt__wrap .date { float: right; display: block; line-height: 31px; }
.main__content .btn-more2 { position: absolute; bottom: 0; left: 0; color: #000; font-size: 16px; padding-right: 40px; background: url("../img/main/btn_more2.png") no-repeat right 70%; }
@media screen and (max-width: 1024px) { .main__content { background-size: 50% auto; }
  .main__content .tit__wrap { width: 200px; }
  .main__content .tit { font-size: 40px; }
  .main__content .txt__wrap { width: calc(100% - 200px); padding-left: 30px; }
  .main__content .btn-more2 { left: 30px; } }
@media screen and (max-width: 768px) { .main__content { padding: 20px 0; }
  .main__content .tit__wrap { float: none; width: 100%; }
  .main__content .tit { font-size: 24px; }
  .main__content .sub-tit { display: none; }
  .main__content .txt__wrap { float: none; width: 100%; padding-left: 0; border-left: none; margin-top: 20px; }
  .main__content .txt__wrap li { margin-top: 10px; padding-left: 10px; font-size: 15px; background-size: 3px auto; background-position: 0 8px; }
  .main__content .txt__wrap a { overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; -moz-binding: url("ellipsis.xml#ellipsis"); width: 100%; font-size: 15px; line-height: 18px; }
  .main__content .txt__wrap .date { display: none; }
  .main__content .btn-more2 { text-indent: 100%; white-space: nowrap; overflow: hidden; top: 5px; left: auto; right: 15px; width: 27px; height: 27px; background: url("../img/main/btn_more2_m.png") no-repeat 0 0; background-size: 100% auto; padding-right: 0; } }
/*-- [e] 새소식 */
/* [s] 교육/행사신청 / 알림소식 */
.main__content2 { position: relative; background: url("../img/main/bg.png") center top; }
.main__content2:before { content: ''; position: absolute; left: 136px; width: 311px; height: 282px; background: url("../img/main/bg2.png") no-repeat 0 0; background-size: 100% auto; }
.main__content2:after { content: ''; position: absolute; right: 0; bottom: 0; width: 388px; height: 396px; background: url("../img/main/bg3.png") no-repeat 0 0; background-size: 100% auto; }
.main__content2 > div { position: relative; z-index: 1; }
.main__content2 > div:after { content: ''; display: block; clear: both; }
.main__content2 .title { color: #fff; }
@media screen and (max-width: 1024px) { .main__content2 { background: #0068b7; }
  .main__content2:before { left: -50px; width: 350px; height: 382px; background-image: url("../img/main/bg4.png"); background-size: 100% auto; background-position: -100px 0; }
  .main__content2:after { display: none; }
  .main__content2 .notice__wrap { margin-left: -30px; margin-right: -30px; padding-left: 30px; padding-right: 30px; width: calc(100% + 60px); }
  .main__content2 .notice__wrap.notice { background: url("../img/main/bg3_m.png") no-repeat right bottom #00ac97; background-size: 100% auto; }
  .main__content2 .btn-more { top: 22px; right: 30px; } }
@media screen and (max-width: 768px) { .main__content2 .notice__wrap { margin-left: -15px; margin-right: -15px; padding-left: 15px; padding-right: 15px; width: calc(100% + 30px); }
  .main__content2 .btn-more { top: 22px; right: 15px; } }
/*-- [e] 교육/행사신청 / 알림소식 */
/* [s] 교육/행사신청 */
/*-------------------------------------------------------------------
    File Name : _icon.scss
    Date : 2020.07.09. Lee Hye Jin
    Summary : 아이콘 모음 (접수중 / 마감 / 사회적기업 ~~  )
-------------------------------------------------------------------*/
.icon-type, .icon-stat { display: inline-block; height: 40px; line-height: 40px; padding: 0 10px; text-align: center; color: #fff; font-size: 16px; }
@media screen and (max-width: 768px) { .icon-type, .icon-stat { height: 30px; line-height: 30px; font-size: 13px; padding: 0 5px; } }
.icon-type { min-width: 110px; background-color: #444; }
.icon-type.type2 { background-color: #0061ac; }
.icon-type.type3 { background-color: #00ac97; }
.icon-type.type4 { background-color: #974cd1; }
.icon-type.type5 { background-color: #7cb322; }
@media screen and (max-width: 768px) { .icon-type { min-width: 90px; } }
.gubun { color: #444; }
.gubun.type2 { color: #0061ac; }
.gubun.type3 { color: #00ac97; }
.gubun.type4 { color: #974cd1; }
.gubun.type5 { color: #7cb322; }
.icon-stat { min-width: 93px; line-height: 34px; background-color: #fff; color: #c85738; border: 3px solid #c85738; box-sizing: border-box; }
.icon-stat.fin { background-color: #c85738; color: #fff; }
@media screen and (max-width: 768px) { .icon-stat { min-width: 50px; line-height: 25px; } }
.icon-notice { display: inline-block; width: 62px; height: 29px; line-height: 29px; color: #00ac97; border: 1px solid #00ac97; font-weight: 700; font-size: 18px; text-align: center; margin-right: 16px; }
@media screen and (max-width: 1024px) { .icon-notice { width: 48px; height: 22px; line-height: 20px; font-size: 15px; margin-right: 10px; } }
.icon-file { display: inline-block; width: 24px; height: 23px; background: url("../img/sub/icon_file.png") no-repeat 0 0; text-indent: 100%; white-space: nowrap; overflow: hidden; }
/*-------------------------------------------------------------------
    File Name : _gallery2.scss
    Date : 2020.07.09. Lee Hye Jin
    Summary : 교육/행사신청 리스트
-------------------------------------------------------------------*/
.gallery__list2 { margin: -40px 0 0 -25px; }
@media screen and (max-width: 768px) { .gallery__list2 { margin: -20px 0 0 -20px; } }
.gallery__list2 > li { float: left; width: 25%; padding: 40px 0 0 25px; }
@media screen and (max-width: 1024px) { .gallery__list2 > li { width: 50% !important; } }
@media screen and (max-width: 768px) { .gallery__list2 > li { width: 100% !important; padding: 20px 0 0 20px; } }
.gallery__list2 > li > a { position: relative; display: block; background: #fff; padding: 35px 20px 25px; border: 1px solid #dcdcdc; }
.gallery__list2 > li > a > span { display: block; }
.gallery__list2 > a > span { display: block; }
.gallery__list2 .img__wrap { text-align: center; }
.gallery__list2 .tit { line-clamp: 2; -webkit-line-clamp: 2; height: 2.4em; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -moz-binding: url(ellipsis.xml#ellipsis); margin-top: 25px; color: #000; font-size: 20px; line-height: 1.2em; }
.gallery__list2 .icon-stat { position: absolute; top: 0; right: 0; }
.gallery__list2.main > li { width: 50%; }
.gallery__list2.main > li > a { border: none; }
.gallery__list2.main li .lineborder { position: absolute; background: #00ac97; z-index: 1; }
.gallery__list2.main li .brline-top { left: 0; top: 0; width: 100%; height: 5px; transform-origin: 0 0; transform: scaleX(0); transition: transform 0.1s ease-in-out 0.3s; }
.gallery__list2.main li .brline-right { right: 0; top: 0; width: 5px; height: 100%; transform-origin: 0 0; transform: scaleY(0); transition: transform 0.1s ease-in-out 0.2s; }
.gallery__list2.main li .brline-btm { right: 0; bottom: 0; width: 100%; height: 5px; transform-origin: 100% 100%; transform: scaleX(0); transition: transform 0.1s ease-in-out 0.1s; }
.gallery__list2.main li .brline-left { left: 0; bottom: 0; width: 5px; height: 100%; transform-origin: 100% 100%; transform: scaleY(0); transition: transform 0.1s ease-in-out 0s; }
.gallery__list2.main li a:focus + span, .gallery__list2.main li:hover .brline-left { transform-origin: 100% 100%; transform: scaleY(1); transition: transform 0.1s ease-in-out 0.3s; }
.gallery__list2.main li a:focus + span + span, .gallery__list2.main li:hover .brline-btm { transform-origin: 100% 100%; transform: scaleX(1); transition: transform 0.1s ease-in-out 0.2s; }
.gallery__list2.main li a:focus + span + span + span, .gallery__list2.main li:hover .brline-right { transform-origin: 0 0; transform: scaleY(1); transition: transform 0.1s ease-in-out 0.1s; }
.gallery__list2.main li a:focus + span + span + span + span, .gallery__list2.main li:hover .brline-top { transform-origin: 0 0; transform: scaleX(1); transition: transform 0.1s ease-in-out 0s; }
.info { margin-top: 30px; }
.info > span { overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; -moz-binding: url("ellipsis.xml#ellipsis"); position: relative; display: block; color: #000; min-height: 31px; margin-top: 8px; padding-left: 90px; line-height: 29px; }
.info > span:first-child { margin-top: 0; }
.info > span .info-tit { position: absolute; top: 0; left: 0; width: 75px; height: 31px; line-height: 29px; border: 1px solid #bfbfbf; text-align: center; box-sizing: border-box; }
/*-- [e] 교육/행사신청 */
/* [s] 열린소식 */
.gallery__list4 { margin: -40px 0 0 -25px; }
.gallery__list4 > li { float: left; width: 50%; padding: 40px 0 0 25px; }
.gallery__list4 > li a { position: relative; display: block; height: 388px; }
.gallery__list4.main li .lineborder { position: absolute; background: #0068b7; z-index: 1; }
.gallery__list4.main li .brline-top { left: 0; top: 0; width: 100%; height: 5px; transform-origin: 0 0; transform: scaleX(0); transition: transform 0.1s ease-in-out 0.3s; }
.gallery__list4.main li .brline-right { right: 0; top: 0; width: 5px; height: 100%; transform-origin: 0 0; transform: scaleY(0); transition: transform 0.1s ease-in-out 0.2s; }
.gallery__list4.main li .brline-btm { right: 0; bottom: 0; width: 100%; height: 5px; transform-origin: 100% 100%; transform: scaleX(0); transition: transform 0.1s ease-in-out 0.1s; }
.gallery__list4.main li .brline-left { left: 0; bottom: 0; width: 5px; height: 100%; transform-origin: 100% 100%; transform: scaleY(0); transition: transform 0.1s ease-in-out 0s; }
.gallery__list4.main li a:focus + span, .gallery__list4.main li:hover .brline-left { transform-origin: 100% 100%; transform: scaleY(1); transition: transform 0.1s ease-in-out 0.3s; }
.gallery__list4.main li a:focus + span + span, .gallery__list4.main li:hover .brline-btm { transform-origin: 100% 100%; transform: scaleX(1); transition: transform 0.1s ease-in-out 0.2s; }
.gallery__list4.main li a:focus + span + span + span, .gallery__list4.main li:hover .brline-right { transform-origin: 0 0; transform: scaleY(1); transition: transform 0.1s ease-in-out 0.1s; }
.gallery__list4.main li a:focus + span + span + span + span, .gallery__list4.main li:hover .brline-top { transform-origin: 0 0; transform: scaleX(1); transition: transform 0.1s ease-in-out 0s; }
.gallery__list4 > li img { width: 100%; height: 100%; vertical-align: top; }
@media screen and (max-width: 768px) { .gallery__list4 { margin: -20px 0 0 -20px; }
  .gallery__list4 > li { width: 100%; padding: 20px 0 0 20px; } }
/*-- [e] 열린소식 */
/* [s] 사회적경제기업 / 마을공동체사업 */
.main__content3 { position: relative; }
.main__content3:before { content: ''; position: absolute; top: -205px; left: 50px; width: 460px; height: 460px; background: url("../img/main/bg4.png") no-repeat 0 0; background-size: 100% auto; }
@media screen and (max-width: 768px) { .main__content3:before { display: none; } }
.main__content3 > div { position: relative; z-index: 1; }
.main__content3 > div:after { content: ''; display: block; clear: both; }
/*-------------------------------------------------------------------
    File Name : _gallery.scss
    Date : 2020.07.09. Lee Hye Jin
    Summary : 메인 - 사회적경제기업 / 마을공동체활동현황
-------------------------------------------------------------------*/
.gallery__list { margin-left: -25px; }
.gallery__list .slick-slide { padding-left: 25px; }
.gallery__list a { position: relative; display: block; }
.gallery__list a .img__wrap { display: block; height: 243px; overflow: hidden; }
.gallery__list a .img__wrap img { width: 100%; min-height: 100%; transition: all ease 1s; }
.gallery__list a:hover .img__wrap img { transform: scale(1.2); }
.gallery__list .tit { overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; -moz-binding: url("ellipsis.xml#ellipsis"); display: block; height: 67px; line-height: 67px; background-color: #f1f1f1; text-align: center; color: #000; }
.gallery__list .icon-type { position: absolute; top: 0; right: 0; }
.notice__wrap.social .slick-control, .notice__wrap.village .slick-control { position: absolute; top: 55px; right: 0; vertical-align: middle; font-size: 0; }
.notice__wrap.social .slick-control:after, .notice__wrap.village .slick-control:after { content: ''; display: block; clear: both; }
.notice__wrap.social .slick-control button, .notice__wrap.village .slick-control button { text-indent: 100%; white-space: nowrap; overflow: hidden; }
.notice__wrap.social .slick-control > *, .notice__wrap.village .slick-control > * { display: inline-block; vertical-align: middle; }
.notice__wrap.social .slick-pause, .notice__wrap.social .slick-play, .notice__wrap.village .slick-pause, .notice__wrap.village .slick-play { width: 10px; height: 12px; background: url("../img/main/slick2_pause.png") no-repeat 0 0; background-size: 100% auto; margin: 0 10px; }
.notice__wrap.social .slick-play, .notice__wrap.village .slick-play { background-image: url("../img/main/slick2_play.png"); }
.notice__wrap.social .slick-prev, .notice__wrap.social .slick-next, .notice__wrap.village .slick-prev, .notice__wrap.village .slick-next { width: 29px; height: 29px; background: url("../img/main/slick2_prev.png") no-repeat 0 0; background-size: 100% auto; }
.notice__wrap.social .slick-prev, .notice__wrap.village .slick-prev { margin-left: 10px; }
.notice__wrap.social .slick-next, .notice__wrap.village .slick-next { margin-left: 5px; background-image: url("../img/main/slick2_next.png"); }
.notice__wrap.social .paging li, .notice__wrap.village .paging li { display: inline-block; line-height: 29px; margin: 0 10px; }
.notice__wrap.social .paging button, .notice__wrap.village .paging button { width: 14px; height: 14px; background: url("../img/main/slick2_off.png") no-repeat 0 0; background-size: 100% auto; vertical-align: sub; }
.notice__wrap.social .paging .slick-active button, .notice__wrap.village .paging .slick-active button { width: 41px; background-image: url("../img/main/slick2_on.png"); }
@media screen and (max-width: 768px) { .notice__wrap.social .title, .notice__wrap.village .title { margin-bottom: 45px; }
  .notice__wrap.social .slick-control, .notice__wrap.village .slick-control { top: 65px; }
  .notice__wrap.social .slick-pause, .notice__wrap.social .slick-play, .notice__wrap.village .slick-pause, .notice__wrap.village .slick-play { width: 8px; height: 10px; margin: 0 5px;padding-right:4px; color:#797979; }
  .notice__wrap.social .slick-prev, .notice__wrap.social .slick-next, .notice__wrap.village .slick-prev, .notice__wrap.village .slick-next { width: 20px; height: 20px; }
  .notice__wrap.social .slick-prev, .notice__wrap.village .slick-prev { margin-left: 10px; }
  .notice__wrap.social .slick-next, .notice__wrap.village .slick-next { margin-left: 5px; background-image: url("../img/main/slick2_next.png"); }
  .notice__wrap.social .paging li, .notice__wrap.village .paging li { line-height: 20px; margin: 0 5px; vertical-align: middle;  padding-right:4px;}
  .notice__wrap.social .paging button, .notice__wrap.village .paging button { width: 10px; height: 10px; }
  .notice__wrap.social .paging .slick-active button, .notice__wrap.village .paging .slick-active button { width: 29px; } }
/*-- [e] 사회적경제기업 / 마을공동체사업 */
