@CHARSET "UTF-8";

/* 사회사업안내 */
.public_serw{display:flex;flex-wrap:wrap;gap:20px;padding-bottom:50px;}
.public_serw li{position:relative;display:flex;flex-direction: column;justify-content: center;align-items: center;gap:5px;padding:10px;width:0;min-height:360px;flex-grow:1;font-size:2.3rem;line-height:1.3;font-weight:700;color:#fff;text-align:center;background:no-repeat center / cover;border-radius:15px;box-sizing:border-box;text-shadow:0 0 13px rgba(0, 0, 0, 0.5);}
.public_serw li.icon1{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sbg1.jpg);}
.public_serw li.icon2{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sbg2.jpg);}
.public_serw li.icon3{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sbg3.jpg);}
.public_serw li.icon4{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sbg4.jpg);}
.public_serw li:before{display:block;content:'';width:100%;height:71px;background:no-repeat center / contain;}
.public_serw li.icon1:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sicon1.png);}
.public_serw li.icon2:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sicon2.png);}
.public_serw li.icon3:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sicon3.png);}
.public_serw li.icon4:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/public_sicon4.png);}
.public_serw li:nth-child(even){top:50px;}


/* 자원봉사안내 */
.volunteer_info{display:flex;gap:40px;}
.volunteer_info > div{width:0;flex-grow:1;padding:40px 30px 30px;border:1px solid #ddd;box-sizing:border-box;border-radius:15px;}
.volunteer_info > div .tit{margin-bottom:15px;display:flex;gap:10px;align-items:center;font-size:3rem;line-height:1;font-weight:700;}
.volunteer_info > div .tit:before{content:'';display:block;width:25px;height:27px;background:no-repeat left center / contain}
.volunteer_info .icon1 .tit:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/volunteer_icon1.png);}
.volunteer_info .icon2 .tit:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/volunteer_icon2.png);}
.volunteer_info > div ul.list > li{font-size:2rem;}
.volunteer_info > div ul.list > li::after{top:11px}
.volunteer_info > div .cbox{display:flex;gap:20px;margin-top:15px}
.volunteer_info > div .cbox dl{position:relative;padding:17px 25px 17px 75px;width:0;flex-grow:1;font-size:1.7rem;line-height:1.4;background:#f1f2f7;box-sizing:border-box;border-radius:15px;}
.volunteer_info > div .cbox dl:before{content:'';position:absolute;top:50%;left:25px;width:31px;height:31px;background:no-repeat center / contain;transform: translateY(-50%);}
.volunteer_info > div .cbox dl.ticon1:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/volunteer_time1.png);}
.volunteer_info > div .cbox dl.ticon2:before{background-image:url(/nanum/site/builder/dir/main/img/menu5649/volunteer_time2.png);}
.volunteer_info > div .cbox dl dt{font-weight:800;}
.volunteer_info > div .cbox dl dd{margin-top:7px;}

.full_gray{position:relative;margin-top:80px;padding:80px 0;background:#f5f5f5;box-sizing:border-box;}
.full_gray:before{position:absolute;top:0;left:50%;content:'';width:100vw;height:100%;background:#f5f5f5;transform: translateX(-50%);z-index:-1}
.full_gray .gray_b1{display:flex;gap:80px;}
.full_gray .gray_b1 .left {flex-shrink: 0;}
.full_gray .gray_b1 .left img{display: block;border-radius:25px;box-shadow:0 5px 10px rgba(0,0,0,0.2);}
.full_gray .gray_b1 .left a{display:inline-flex;gap:30px;align-items: center;margin-top:30px;padding:13px 20px;font-size:1.7rem;font-weight:700;border:1px solid #000;border-radius:10px;box-sizing:border-box;transition:all 0.3s}
.full_gray .gray_b1 .left a:after{content:'';display:block;width:30px;height:30px;background:#000 url(/nanum/site/builder/dir/main/img/menu5649/volun1365_go.png) no-repeat center / auto 12px;border-radius:50%;transition:all 0.3s}
.full_gray .gray_b1 .right{width:100%;}
.full_gray .gray_b1 .right dl{display:flex;gap:25px;align-items:center;padding:20px;font-weight:700;background:#fff;border-radius:50px;box-sizing:border-box;}
.full_gray .gray_b1 .right dl:nth-child(n+2){margin-top:30px;}
.full_gray .gray_b1 .right dl dt{flex-shrink: 0;width:65px;font-size:1.6rem;color:#41b5c0;text-transform: uppercase;letter-spacing:0;}
.full_gray .gray_b1 .right dl dd{font-size:2rem;}
.full_gray .gray_b1 .right dl dd span{color:#41b5c0;text-decoration: underline;text-underline-position: under;}

.full_gray .gray_b2{margin-top:40px;padding-top:40px;border-top:1px dashed #ccc}


/********************태블릿********************/
@media all and (max-width:1024px){

/* 사회사업안내 */
.public_serw li{min-height:250px;font-size:2rem;}


/* 자원봉사안내 */
.volunteer_info{gap:20px;}
.volunteer_info > div{padding: 25px 20px 20px;}
.volunteer_info > div .tit{font-size:2.4rem;}
.volunteer_info > div .tit:before{height:23px;}
.volunteer_info > div ul.list > li{font-size:1.8rem;}
.volunteer_info > div ul.list > li::after{top:10px}
.volunteer_info > div .cbox{gap:10px;}
.volunteer_info > div .cbox dl{padding:15px 17px 15px 55px;}
.volunteer_info > div .cbox dl:before{left:12px;}
.volunteer_info > div .cbox dl dd{margin-top:5px;line-height:1.3;}

.full_gray{margin-top:40px;padding:40px 0;}
.full_gray .gray_b1{gap:35px;}
.full_gray .gray_b1 .left{width:50%;}
.full_gray .gray_b1 .left a{gap:20px;padding:10px 15px;font-size:1.6rem}
.full_gray .gray_b1 .right dl{flex-direction: column;gap:3px;padding:10px 15px;}
.full_gray .gray_b1 .right dl:nth-child(n+2){margin-top:15px;}
.full_gray .gray_b1 .right dl dt{width:auto;font-size:1.5rem;}
.full_gray .gray_b1 .right dl dd{font-size:1.8rem;line-height:1.45;text-align:center;}

}

/********************모바일********************/
@media all and (max-width:767px){

/* 사회사업안내 */
.public_serw{gap:10px;padding-bottom:0;}
.public_serw li{position:static;width:calc(50% - 5px);flex-grow:0;min-height:150px;font-size:1.8rem;}
.public_serw li:before{height:50px;}


/* 자원봉사안내 */
.volunteer_info{flex-direction: column;}
.volunteer_info > div{padding:15px;width:100%;flex-grow:0;}
.volunteer_info > div .tit{margin-bottom:10px;font-size:2rem;}
.volunteer_info > div .tit:before{width:20px;height:19px;}
.volunteer_info > div ul.list > li{font-size:1.6rem;}
.volunteer_info > div ul.list > li::after{top:7px}
.volunteer_info > div .cbox{margin-top:10px}
.volunteer_info > div .cbox dl{padding:10px 15px 10px 45px;}
.volunteer_info > div .cbox dl:before{width:23px;height:23px;}

.full_gray{margin-top:30px;padding:30px 0}
.full_gray .gray_b1{flex-direction: column;gap: 20px;}
.full_gray .gray_b1 .left{width:auto;}
.full_gray .gray_b1 .left img{margin:0 auto}
.full_gray .gray_b1 .left a{gap:15px;padding:8px 15px;margin-top: 15px;}
.full_gray .gray_b1 .left a:after{width:25px;height:25px;background-size:auto 10px;}
.full_gray .gray_b1 .right dl{padding:8px 10px;}
.full_gray .gray_b1 .right dl:nth-child(n+2){margin-top:10px;}
.full_gray .gray_b1 .right dl dt{font-size:1.4rem;}
.full_gray .gray_b1 .right dl dd{font-size:1.6rem;}
.full_gray .gray_b2{margin-top:30px;padding-top:30px;}

}

/********************웹********************/
@media all and (min-width:1025px) {

.full_gray .gray_b1 .left a:hover{color:#fff;background:#000;}
.full_gray .gray_b1 .left a:hover:after{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(156deg) brightness(108%) contrast(101%);}
}