@charset "utf-8";
.sub_conts {padding-top: 0; margin-bottom:0}
.boxlist {display: flex;gap: 3rem;padding-top: var(--sub_pd_half);}
.boxlist li {width: 100%;padding:3rem 2rem;border-radius:2rem;background-color: #EFF5EF;border: 1px solid #C2DDCE;}
.boxlist li h5 {font-size:20px;font-weight:600;margin-bottom:1rem;word-break: keep-all;}
.boxlist li p {word-break:keep-all; display:flex; gap:.5rem; padding:.3rem 0}
.boxlist li p span {display:block;font-weight:500; color:var(--color-main)}
.talelist {}
.tb_li {padding: 1rem 0;}
.tb_li:first-child {padding-top:0}
.tb_li h5 {font-size:1.5rem;padding: 0 1rem 1.5rem;border-bottom: 2px solid #404040;/* margin-bottom:2rem; */font-weight: 600;}
.tb_li > div {display:flex;gap: 4rem;align-items: center;padding: 1.5rem 1rem;}
.tb_li > div > span {background-color:#fff;width:160px;height:160px;border-radius:2rem;display: inline-flex;align-items: center;justify-content: center;}
.tb_li .in_step {display: inline-flex;gap: 2.5rem;margin-bottom: 1rem;}
.in_step li {border: 1px solid var(--color-main);background-color: #EFF5EF;padding: .5rem 2rem;border-radius:10px;position:relative}
.in_step li:after {content: "\e5cc";font-family: 'Material Symbols Outlined';position:absolute;right: 0;top:50%;transform:translateY(-50%);margin-right: -2rem;font-size: 1.5rem;font-weight: 400;color: #898989;}
.in_step li:last-child::after {display:none}
.tb_li:nth-child(3) .glist > li {padding-left:0}
.box_wrap {position:relative}
.stepbox .step6:nth-child(2) {margin-top: 4rem;}
.step6 li {width:25%}
.step_st1.step6:before {width: 88%;left: 56%;}
.step_st1.step6:nth-child(2)::before {left: 0;width: 37%;transform: unset;}
.consbox {background-color:#f8f8f8;padding:3rem;position:absolute;right:0;bottom:0;border-radius: 2rem;text-align: center;}
.consbox p {
    margin-bottom: 1.5rem;
    font-size: 22px;
}
.consbox span {background-color:var(--color-main);color: #fff;padding: 1.5rem;display: block;border-radius: 1rem;font-size: 20px;font-weight: 500;}
.tablebox ul {display: flex;flex-wrap: wrap;gap: 3rem 5%;}
.tablebox li {border-bottom: 1px solid #ddd;width: 30%;padding-bottom: 1rem;transition: .4s}
.tablebox li:hover .top strong {color:var(--color-main)}
.tablebox li div {display:flex;justify-content: space-between;}
.tablebox ul .top {}
.tablebox ul .top strong {font-size:20px; font-weight:500}
.tablebox ul .top button {width: 33px;height: 33px;background-color:var(--color-main);border-radius:50%;}
.tablebox ul .top span {font-size:16px;color: #fff;}
.tablebox ul .bottom {
    padding: 1rem 0;
    display: block;
}

/* PC */ 
@media only screen and (min-width:1025px) and (max-width: 1500px)  {
    
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/ 
@media all and (max-width:1024px) {
    .sub_conts .title_txt {padding:0}
	.boxlist {flex-wrap: wrap;gap: 1rem;}
    .boxlist li {padding:2rem}
    .tb_li h5 {padding: 0 0 1.5rem;}
    .tb_li > div {gap: 2rem;padding: 1.5rem 0;}
    .tb_li > div > span {width:120px; height:120px}
    .tb_li > div ul {width: calc(100% - 150px);}
    .tb_li .in_step {flex-wrap:wrap;width: 100%;}
    .in_step li {width: 22%;padding: .5rem 1rem;display: inline-flex;align-items: center;justify-content: center;text-align: center;}
    .in_step li:nth-child(2) {width:40%}
    .consbox {/* position:relative; */padding: 1.5rem;width: 50%;}
    .consbox p {font-size:18px;margin-bottom: 1rem;}
    .consbox p br {display:none}
    .consbox span {padding:1rem; font-size:18px}
    .tablebox ul {}
    .tablebox li {width: 47%;}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .boxlist li {padding:1.5rem; border-radius:1rem}
    .boxlist li h5 {margin-bottom:.5rem;font-size: 18px;}
    .tb_li > div {flex-wrap:wrap;padding: 1.5rem 0 0;}
    .tb_li > div ul {width:100%}
    .tb_li > div > span {width: 100px;height: 100px;text-align: center;margin: auto;}
    .tb_li .in_step {gap: 1.5rem;}
    .in_step li, .in_step li:nth-child(2) {width:100%}
    .in_step li:after {right: unset;left: 50%;top: 100%;margin: 0;margin-top: 1rem;transform: rotate(90deg) translate(-50%, 1rem);}
    .tb_li h5 {font-size:20px}
    .tb_li {padding: 2rem 0 0;}
    .step6 li {width:100%}
    .consbox {position:relative;width: 100%;margin-top: 2rem;}
    .consbox p {font-size:16px}
    .consbox span {font-size:18px}
    .tablebox ul {gap:1.5rem}
    .tablebox li {width:100%;padding-bottom: 0;}
    .tablebox ul .bottom {padding-top:0}
    .tablebox ul .top strong {font-size:18px}
}