@charset "utf-8";

@import url("base.css");

p, h1, h2, h3, h4, h5, h6, span{word-break: keep-all;}
.con_wrap h2{position: relative; padding-left: 30px; margin: 75px 0 30px 0; font-size: 30px; font-weight: 800;}
.con_wrap h2.first{margin-top:0;}
.con_wrap h2:before{position: absolute; top: 0px; left: 0; width: 24px; height: 24px; background: url('../img/sub/before.png') no-repeat; content: '';}
.con_wrap h3.first{margin-top: 0;}
/*.con_wrap h3{font-size: 25px; margin-top: 40px; margin-bottom: 20px; font-weight: 800;}*/
.con_wrap h3{font-size: 22px; padding: 10px; margin-bottom: 20px; background: #E7FBF3; color: #007964; font-weight: 800; border-radius: 5px; display: inline-block;}
li{word-break: keep-all;}
/*.con_wrap h2 {
    clear: both;
    position: relative;
    margin: 40px 0 30px 0;
    padding-left: 20px;
    font-size: 30px;
    color: #171616;
    font-weight: 800;
    line-height: 1.33;
    border-bottom: #e8e8e8 1px solid;
    padding-bottom: 15px;
}
.con_wrap h2.first {margin-top:0;}
.con_wrap h2:before {position: absolute;top: 6px;left: 0;width: 9px;height: 25px;border-radius: 4px;background: #1d55c4;content: '';}
.con_wrap h3 {clear:both;position:relative; margin: 50px 0 15px 0; padding-left:15px; font-size:28px; color:#171616; font-weight:800; line-height:1.33;}
.con_wrap h3.mb25{margin:40px 0 25px 0;}
.con_wrap h3.first {margin-top:0;}
.con_wrap h3:before {position:absolute; top:10px; left:0; width:5px; height:15px; background:#1d55c4; content:''; transform:rotate(35deg);}
.icon_skyblue:before {background:#108ad3 !important;}*/

/*인사말*/
#greetings .ceo_top{position: relative;}
#greetings .green_ceo{overflow: hidden; background: url('../img/sub/sub0101_border.jpg');}
#greetings .ceo_inner{padding: 50px; margin: 15px; background: #fff;}
#greetings .ceo_inner h2{font-size: 32px; color: #007964; font-weight: 600; margin: 0 0 20px 0; padding:0;}
#greetings .ceo_inner h2:before{display: none;}
#greetings .ceo_inner h4{font-size: 25px; font-weight: 500;}
#greetings .ceo_info{position: absolute; left: 90px; bottom: -90px; width: calc(100% - 90px);z-index: 9;}
#greetings .ceo_info img{position: absolute; right: 10%; bottom: 15%; width: 21%; z-index: 10;}
#greetings .ceo_info .txt{ padding: 35px; background: url('../img/sub/sub0101_gra02.jpg') no-repeat; background-size: cover;}
#greetings .ceo_info .txt p{color: #fff; font-size: 22px;}
#greetings .ceo_info .txt p span{font-weight: 600; font-size: 24px;}
#greetings .ceo_bottom{margin-top: 125px;margin-left: 90px;}
#greetings .ceo_bottom p{font-size: 18px; word-break: keep-all; margin-bottom: 30px;}
/*설립취지 및 목적*/
#purpose{padding: 0 170px 170px; background: url('../img/sub/purpose01.jpg') no-repeat; background-size: cover;}
#purpose > ul{padding: 80px 100px; text-align: center; border: 1px solid #ddd; background: #fff;}
#purpose > ul > li:first-child{padding-bottom: 80px;}
#purpose > ul > li h1{display: block; position: relative; margin-bottom: 30px; font-size:30px; font-weight: 600; color:#007964;}
#purpose > ul > li h1:before{content:''; position:absolute; top: -15px; left: 50%; transform: translateX(-50%); width: 30px; height: 6px; background: #007964;}
#purpose > ul > li p{font-size: 18px;}

#buis_intro > p{padding: 30px; background: #fafafa; border-radius: 0 20px 20px 20px; font-size: 18px;}
#buis_intro > ul{width: 100%; display: flex; flex-wrap: wrap; gap: 50px; margin: 30px 30px 0;}
#buis_intro > ul > li{width: calc((100% - 160px) / 3); border: 1px solid #ddd; border-radius: 30px; overflow: hidden;}
#buis_intro ol{height: 100%;}
#buis_intro ol > li.img{position: relative;}
#buis_intro ul > li:first-child ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico01.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(2) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico02.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(3) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico03.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(4) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico04.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(5) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico05.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(6) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico06.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(7) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico07.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(8) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico08.png') no-repeat; content: '';}
#buis_intro ul > li:nth-child(9) ol > li.img::before{position: absolute; bottom: -25%; left: 50%; transform: translateX(-50%); width: 140px; height: 140px; background: url('../img/sub/sub01_02_ico09.png') no-repeat; content: '';}
#buis_intro ol > li.img img{object-fit: cover; width: 100%;}
#buis_intro ol > li.img{border-bottom: 3px solid #007964}
#buis_intro ol > li.txt{padding: 90px 70px 40px; text-align: center; font-size: 18px; font-weight: 500; word-break: keep-all;}
#buis_intro ol > li.txt span{font-size: 16px; color: #666; word-break: keep-all;}

.explain > li{position: relative; padding-left: 20px; margin-bottom: 12px; font-size: 18px; font-weight: 700;}
.explain > li:before{position: absolute; top: 8px; left: 0; width: 8px; height: 8px; background: #007964; content: '';}
.explain > li:last-child{margin-bottom: 0px;}
.explain > li p{margin-top: 5px; font-weight: 400;}

#mem > div{display: flex; flex-wrap: wrap; width: 100%;}
#mem > div > img{width: 40%; border-radius:30px;}
#mem > div .right{width: 60%; margin-top: 160px;}
#mem > div .right > h4{font-size: 32px; font-weight: 800; margin-bottom: 30px; padding-left: 100px;}
#mem > div .right ul{display: flex; flex-wrap: wrap; width: 100%; gap: 50px; background: #f8fffe; padding: 40px 30px 40px 100px; border-radius: 20px;}
#mem > div .right ul li{width: calc((100% - 120px) / 2);}
#mem > div .right ul li h4{display: inline-block; position: relative; padding-bottom:15px; font-size:22px; color:#007964; font-weight: 700;}
#mem > div .right ul li h4:before{position: absolute; top: 0px; right: -16px; width: 8px; height: 8px; background: #f4a18f; content: '';}
#mem > div .right ul li p{padding-top:15px; font-size:20px; font-weight: 700; border-top: 2px solid #007964;}
#mem > div .right ul li i{font-size:16px; color:#666666; font-style: normal;}

#organ figure:last-child{display: none;}

/*#history > div{width: 100%; padding-bottom: 300px; background: url('../img/sub/history_bg.jpg') no-repeat; background-position: bottom 0 left 0;}*/
#history > div{width: 100%; background: url('../img/sub/history_bg.jpg') no-repeat center; background-size: cover;}
/*#history > div ul{display: flex; flex-wrap: wrap; padding: 40px; background: rgba(255,255,255,0.9);}*/
#history > div ul{display: flex; flex-wrap: wrap; padding: 40px; background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7));}
#history > div li{width: 50%;}
#history > div li strong{display: inline-block; font-size: 28px; color: #007964; margin-bottom: 30px;}
#history dl{margin-bottom: 30px;}
#history dl dt, #history dl dd{display: inline-block; vertical-align: top;}
#history dl dt{min-width: 115px; margin-right: 20px; font-size: 22px; font-weight: 500;}
#history dl dd{font-size: 18px; color: #333; margin-top: 3px}

/*오시는길*/
#map_wrap{border: 1px solid #ddd;}
#map_wrap ul{display: flex; gap: 40px; padding: 30px 60px; flex-wrap: wrap;}
#map_wrap ul li{font-size: 20px; word-break: keep-all;}
#map_wrap ul li:nth-child(1){position: relative; font-weight: 700;}
#map_wrap ul li:nth-child(1):before{position: absolute; top: 2px; left: -30px; width: 24px; height: 24px; background: url('../img/sub/sub01_04_ico01.png') no-repeat; content: '';}
#map_wrap .root_daum_roughmap .cont{display: none;}

/*위탁 및 교육사업*/
.buis_table table{width: 100%; border: 1px solid #ddd;}
.buis_table table tr{border-bottom: 1px solid #ddd;}
.buis_table table th{width: 15%; padding: 10px; background: #fafafa; text-align: center; border-right: 1px solid #ddd;}
.buis_table table td{width: 85%; padding: 10px 10px 10px 20px; word-break: keep-all;}
.buis_table table td p{padding-left: 10px; text-indent: -10px}

/*.buis_tab > ol{display: flex; border: 1px solid #ddd;}
.buis_tab > ol .tab{position: relative; width: 20%; border-right: 1px solid #ddd;}
.buis_tab > ol .tab:before{position:absolute; bottom:20px; right:50%; transform: translate(50%); width:250px; height:50px; background:url('../img/sub/buis_logo.jpg') no-repeat center;content:'';}
.buis_tab > ol .tab li {position:relative;margin:0 20px;padding:16px;border-bottom:1px solid #ddd;}
.buis_tab > ol .tab li::before {position:absolute;top:15px;right:0;width:24px;height:24px;background:url('../img/sub/arrow_right.png') no-repeat center;content:'';opacity:0;transition:opacity 0.4s ease;}
.buis_tab > ol .tab li:hover::before {opacity:1;}
.buis_tab > ol .tab li.on{padding: 24px; background: #339483; color: #fff; text-align: center; border-bottom: 0; margin: 0; font-size: 20px; font-weight: 600; border-radius: 0 12px 12px 0;}
.buis_tab > ol .tab li.on:hover:before{display: none;}

.buis_tab > ol .img{width: 80%; padding: 20px;}
.buis_tab > ol .img img{width: 100%; height: 520px;}
.buis_tab > ol .img dd{position: relative; padding: 20px 0 0px 15px;}
.buis_tab > ol .img dd:before{position: absolute; top: 25px; left: 0; width: 8px; height: 8px; background: #007964; content: '';}*/

.buis_tab > ul{display: flex; flex-wrap: wrap; width: 100%; gap: 20px; border-radius: 20px;}
.buis_tab > ul li{width: calc((100% - 40px) / 3); background: #f8fffe; padding: 30px; border-radius: 20px;}
.buis_tab > ul li a{width: 100%;}
.buis_tab > ul li figure img{width: 100%; object-fit: cover; border-radius: 20px; height: 192px;}
.buis_tab > ul li h4{display: inline-block; position: relative; margin-top: 20px; padding-bottom:15px; font-size:22px; color:#007964; font-weight: 700;}
.buis_tab > ul li h4:before{position: absolute; top: 0px; right: -16px; width: 8px; height: 8px; background: #f4a18f; content: '';}
.buis_tab > ul li p{padding-top:15px; font-size:17px; border-top: 2px solid #007964;}

/*컨소시엄 사업*/
.tab{display: flex; text-align: center; justify-content: center;}
.tab li{width: 50%; padding: 20px 0; background: #fff; border: 1px solid #ddd;}
.tab li.active{color: #fff; background: #007964;}

.explain .purpose{padding: 30px; margin-bottom: 20px; background: #fafafa; border-radius: 0 20px 20px 20px; font-size: 18px; font-weight: 400;}
/*.explain .purpose p span{font-weight: 700; color: #007964;}*/
.explain li.purpose:before{display: none;}
.mySwiper {width:100%;max-width:1400px;margin:30px auto 0;padding: 20px 0; position:relative; overflow: hidden; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.swiper-slide {text-align:center;display:flex;justify-content:center;align-items:center;}
.swiper-slide img {width:100%;height:160px;display:block;border-radius:10px; object-fit: cover;}
.swiper-button-prev, .swiper-button-next {color:#333;width:40px;height:40px;background:rgba(255,255,255,0.8);border-radius:50%;box-shadow:0 0 5px rgba(0,0,0,0.2);top:50%;transform:translateY(-50%);}
.swiper-button-prev::after, .swiper-button-next::after {font-size:12px;}

.purpose_txt{margin-top: 20px;}
.purpose_txt > ul{display: flex; flex-wrap: wrap; width: 100%; gap: 20px; border-radius: 20px;}
.purpose_txt > ul li{width: calc(50% - 10px); background: #f8fffe; padding: 30px; border-radius: 20px;}
.purpose_txt > ul li.wid100{width: 100%;}
.purpose_txt > ul li a{width: 100%;}
.purpose_txt > ul li h4{display: inline-block; position: relative; margin-top: 20px; padding-bottom:15px; font-size:22px; color:#007964; font-weight: 700;}
.purpose_txt > ul li h4:before{position: absolute; top: 0px; right: -16px; width: 8px; height: 8px; background: #f4a18f; content: '';}
.purpose_txt > ul li p{padding-top:15px; font-size:17px; border-top: 2px solid #007964;}

/*교육사업*/
.box{display: flex; flex-wrap: wrap; gap: 20px;}
.box.none_df{display: block;}
.box .box_inner{width: calc((100% - 20px) / 2); padding: 20px; border: 1px solid #007964; border-radius: 10px;}
.box .box_inner.width100{width: 100%;}
.box.box.none_df .box_inner{width: 100%;}

/*자원봉사안내*/
.process02{display: flex; gap: 70px; margin-bottom: 20px;}
.process02 li{position: relative; width: calc((100% - 140px) / 3); padding: 30px; border-radius: 20px; border: 1px solid #ddd; text-align: center; font-weight: 500; font-size: 18px;}
.process02 li:before{content:''; width: 40px; height: 40px; position: absolute; top: 50%; right: -55px; transform: translateY(-50%); background: url(../img/sub/arrow_right.png) no-repeat center;}
.process02 li:last-child:before{display: none;}
.process02 li a{background: #3b630f; color: #fff; padding: 5px 20px; border-radius: 10px;}
.process02 li img {display: block; margin: 0 auto 20px;}
.txt .lightgreen{margin-bottom: 10px;}

/*-----------------------------------------------------------------------------------------------------------
스킨 수정
-----------------------------------------------------------------------------------------------------------*/
a.btn02, .btn_submit, a.btn_submit, a.btn_b02, .btn_b02{align-content: center;}
#bo_list .td_datetime{width: 120px !important;}
.full_input{width: 100% !important;}