@charset "utf-8";
section + section {margin:120px 0}
section:last-of-type {margin-bottom:120px}
.check_list {
    margin-bottom: 3rem;
}
.check_list li {position: relative;padding-left: 2rem;margin-bottom: 1rem;}
.check_list li:before {content:"";position:absolute;background-image:url(/img/page/guide/check.svg);width: 22px;height: 28px;background-repeat: no-repeat;left: 0;top: 0;margin-top: -5px;background-size: contain;}
.info_list {
    display: flex;
    gap: 4rem;
}
.info_list li {
    background-color: #fff;
    width: 31%;
    border: 1px solid #ddd;
    padding: 3rem;
    border-radius: 2rem;
    display: flex;
    align-items: center;
}

.info_list .li_ico {
    background-color: #FEF5F5;
    padding: 1rem;
    border-radius: 1rem;
    margin-right: 2rem;
}
.info_list dl {}
.info_list dt {
    color: var(--color-main);
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 1rem;
}
.info_list dd {}
.boder_box {border:1px solid #ddd;padding: 2rem;border-radius: 2rem;}
.step_list {display:flex;gap: 6rem;}
.step_list li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    width: 100%;
}
.step_list .st_ico {
    background-color: #f7f7f7;);
    padding: 2rem;
    border-radius: 50%;
    margin-bottom: 1rem;
    position: relative;
}
.step_list .st_ico:after {content:"···";position:absolute;right:0;top:50%;/* background-image: url(/img/page/guide/dot.png); *//* width: 30px; *//* height: 6px; */font-size: 50px;color: #ddd;transform: translateY(-50%);margin-right: -5.5rem;}
.step_list li:last-child .st_ico:after {display:none}
.step_list li span {
    color: var(--color-main);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.step_list li strong {
    background-color: var(--color-main);
    color: #fff;
    border-radius: 50%;
    font-size: 15px;
    display: inline-flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
}
.step_list li p {font-weight:500}
.step_txt {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid var(--color-main);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.step_txt dt {
    width: 15%;
    font-size: 20px;
    font-weight: 500;
    margin: .5rem 0;
    position: relative;
}
.step_txt dt:before {content:"01";background-color:#f7f7f7;width:35px;height:35px;color:var(--color-main);border-radius:50%;font-size:16px;display: inline-flex;align-items: center;justify-content: center;margin-right: 1rem;font-weight: 700;}
.step_txt dt:nth-of-type(2):before {content:"02"}
.step_txt dt:nth-of-type(3):before {content:"03"}
.step_txt dt:nth-of-type(4):before {content:"04"}
.step_txt dt:nth-of-type(5):before {content:"05"}

.step_txt dd {
    width: 85%;
    margin: .5rem 0;
}

/* PC */ 
@media only screen and (min-width:1024px) and (max-width: 1500px)  {
    .info_list {gap: 2rem;}
    .info_list li {padding:1rem;}
    .info_list .li_ico {margin-right:1rem}
    .step_list .st_ico {padding:1rem}
	.step_list .st_ico img {width:60px}
    .step_txt dt {width:19%}
    .step_txt dd {width:75%}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/ 
@media all and (max-width:1023px) {
    .info_list {gap: 1rem;flex-wrap: wrap;}
    .info_list li {padding:1rem;display:flex;/* flex-wrap: wrap; *//* justify-content: center; */width: 48.85%;}
    .info_list li:last-child {/* width: 35%; */width: 100%;}
	.step_list {flex-wrap: wrap;gap: 2rem 5rem;}
	.step_list li {width: 23%;}
    .step_list .st_ico img {width:70px}
    .step_list .st_ico:after {margin-right: -4rem;}
    .step_txt {flex-wrap:wrap}
    .step_txt dt, .step_txt dd {width:100%;}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
	section + section {margin:4rem 0}
    section:last-of-type {margin-bottom:4rem}
    .check_list {margin-bottom:2rem}
    .info_list li {width:100%;}
    .info_list .li_ico {margin-right:1rem}
    .info_list dt, .step_txt dt {font-size: 1.15rem;margin-bottom:.5rem}
    .info_list dd, .step_txt dd {font-size:1rem}
    .boder_box {padding: 2rem 1rem;}
    .step_list {gap: 2.5rem;}
    .step_list li {width:24%}
    .step_list .st_ico {padding:1rem}
    .step_list .st_ico img {width: 55px;}
    .step_list .st_ico:after {content: "··";margin-right: -1.2rem;font-size: 1.5rem;letter-spacing: -.5px;}
    .step_list li span {font-size: .9rem;gap: 5px;}
    .step_list li strong {font-size: .8rem;width: 24px;height: 24px;}
    .step_list li p {font-size:1rem;letter-spacing: -1px;}
    .step_txt dt:before {width: 30px;height: 30px;font-size: .8rem;margin-right: .5rem;}
    .step_txt dd {margin-top:0;line-height:1.4;margin-bottom: 1rem;}
}