@charset "utf-8";
section + section {margin: 120px 0;}
.volun_sec2 {margin-top:120px}
.volun_info {display: flex;gap: 3rem;}
.volun_info li {width:100%; text-align:center; border:1px solid #ddd; border-radius:2rem}
.volun_info dl {}
.volun_info dt {background-color: #fef5f5;padding:2rem;font-size:22px;font-weight:600;border-radius:2rem 2rem 0 0;color: var(--color-main);}
.volun_info dd {padding:2rem;line-height: 1.5;}
.vl_category {
    display: flex;
    gap: 3rem;
}
.vl_category li {
    width: 100%;
    text-align: center;
    border: 1px solid #ddd;
    padding: 2rem 0 1rem;
    letter-spacing: -.5px;
    border-radius: 1rem;
}
.vl_category li div {margin-bottom:1.5rem}
.vl_category li p {font-weight:500}
.vl_category li p span {font-size:.95rem;font-weight:400}

.favor ul {
    display: flex;
    gap: 3rem;
}
.favor ul li {width:100%;border:1px solid #ddd;padding:2rem;text-align:center;display: flex;flex-direction: column;align-items: center;border-radius: 1rem;}
.favor ul li span {display: inline-flex;width: 36px;height: 36px;background-color:var(--color-main);color:#fff;border-radius:50%;align-items: center;justify-content: center;margin-bottom: 1rem;font-size: 16px;font-weight: 600;} 


/* PC */ 
@media only screen and (min-width:1025px) and (max-width: 1600px)  {
	.vl_category {gap:1rem}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .volun_info, .vl_category, .favor ul {gap:1rem}
	.volun_info dd {padding:1.5rem}
    .vl_category {flex-wrap:wrap}
    .vl_category li {width: 31.8%;}
	.favor ul li {padding:1.5rem;word-break: keep-all;}
    .favor ul li br {display:none;}

    
}
/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    section + section {margin: 4rem 0;} 
    section:last-of-type {margin-bottom:4rem;} 
    .volun_info {flex-wrap:wrap;}
    .volun_info dt {font-size:1.2rem; padding:1rem;}
    .vl_category li {width:47%;padding: 1rem;}
    .vl_category li div {margin-bottom:1rem}
    .favor ul {flex-wrap:wrap}
    .favor ul li {width:100%}
    .vl_category li div img {width:40%}
}