@charset "utf-8";
.sub_conts {margin-bottom:0}
.volun {
    gap: 7rem 5rem;
    margin-top: 1rem;
}
.volun strong {padding-left:0;padding: 0 0 1.5rem;margin-bottom: 1.5rem;}
.volun p {padding:0; font-size:17px; line-height:140%}
.volun li {}
.volun li span {right: 0;}

.boxp {background-color:#F8F8F8;padding:2rem;color:var(--color-main);margin-top: 2rem;text-align: center;font-weight: 500;border-radius: 1rem;}
.boxp span {vertical-align: middle;}

.dot li {font-size:20px}
.pocket {padding: 2rem 5rem;background-color:#EFF5EF;border:1px solid #BFDCCC;border-radius: 2rem;margin-top: 3rem;}
.pocket h5 {color:var(--color-main); font-size:30px; font-weight: 600;}
.download {margin-top:3rem; text-align: center;}
.download a .action {background-color:#333}
.download a .txt {color:#333}
.trainbox {background-color:#ffffff;padding: 3rem;border-radius: 1rem;border: 1px solid #ddd;}
.linebox {display:flex;flex-wrap:wrap;gap: 2rem;}
.bg_libox {background-color:#EFF5EF;padding: 2rem 3rem;border-radius: 1rem;display: flex;/* margin-bottom: 2rem; */position: relative;gap: 2rem;align-items: center;width: 48.85%;}
.bg_libox:last-child {width:100%}
.bg_libox span {width:60px;height:60px;background-color:#ffffff;border-radius: 10px;position: absolute;left: 0;top: 50%;transform: translateY(-50%);margin-left: 2rem;font-size: 40px;display: inline-flex;justify-content: center;align-items: center;color: var(--color-main);}
.bg_libox p {font-size: 18px;/* font-weight:500; */}
.bg_libox p:first-of-type {margin-left: 4rem;}
.bg_libox p strong {font-size:20px;margin-right:1rem;font-weight: 600;}
.step_st1:before {width: 82%;}

/* PC */ 
@media only screen and (min-width:1024px) and (max-width: 1500px)  {
    
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .volun {gap:5rem}
    .volun li {width:100%}
    .pocket {padding:2rem}
    .pocket h5 {font-size:1.5rem}
    .pocket .part {gap:1rem}
    .trainbox {padding:2rem}
   
    .bg_libox {flex-wrap:wrap;gap:.5rem;width: 100%;}
    .bg_libox p {margin-left:6rem;width: 90%;}
}
/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .volun {margin-top:0; gap:3rem}
    .volun li span {width:100px}
    .volun li span img {width:90%}
    .volun p, .dot li {font-size:15px}
    .pocket {padding: 1.5rem;border-radius: 1rem;margin-top: 2rem;}
    .pocket h5 {font-size:20px}
    .trainbox {padding:1rem}
    .download {margin-top:2rem}
    .linebox {gap:1rem}
    .bg_libox {padding:1.5rem;flex-wrap: wrap;width: 100%;}
    .bg_libox span {width:50px;height:50px;margin-left: 1.5rem;transform: unset;top: 0;margin-top: 1.5rem;}
    .bg_libox p {font-size:16px;margin-left: 70px;}
    .bg_libox p:first-of-type {margin-left:70px}
    .bg_libox p strong {width:100%;display: block;font-size:18px; padding-bottom:5px}    
}
