.tag-wrap {
    padding-top: 20px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.tag-wrap > a {
    background: #fff;
	border-radius: 10px;
	box-shadow: 0px 10px 15px 0px rgb(5 5 5 / 5%);
    box-sizing: border-box;
    background: #fafafa;
    text-align: center;
    line-height: 1.6;
    font-size: 1.5rem;
    padding: 10px 15px;
    font-weight: 500;
    cursor: pointer;
}
.tag-wrap > a:hover {
    color: #fff;
    background: #2c2c2c;
}
.tag-wrap > a.slctd {
    color: #fff;
    background: #2c2c2c;
}
.sub_title {
    font-size: 18px; color: #444;
    line-height: 1.5;
}
.main_title {
    font-size: 28px; line-height: 1.75;
}
.item_title {
    margin-top: 50px;
    font-size: 24px; line-height: 1.75;
    margin-bottom: 0;
    font-weight: 600;
    max-width: 100%;
    box-sizing: border-box;
    margin-right: auto;
    margin-left: auto;
    width: 1130px;
}
.introPage {
    padding: 50px 30px; 
    /* background: #f4f5f9; */
}
.stepAllWrapper {
    padding: 0 0 0 50px;
}

.pc-hidden {
    display: none;
}

@media screen and (max-width: 999px) {
    .inner {width: auto;}
    .introPage {
        padding: 30px 0px;
    }
    .stepAllWrapper {
        padding: 0 0 0 24px;
    }
    .pc-hidden {
        display: initial;
    }
}
@media screen and (max-width: 900px) {

    .item_title {
        margin-top: 35px;
        font-weight: 500;
    }
    .col_header h1 {font-size: 16px;}

    .sub_title {
        font-size: 16px;
        margin-top: 6px;
    }
    .main_title {
        font-size: 3.0rem;
    }
}
@media screen and (max-width: 500px) {
    .tag-wrap > a {
        font-size: 1.4rem;
        padding: 8px 12px;
    }
    .sub_title {
        /* font-size: 1.2rem; */
    }
    .main_title {
        font-size: 24px; line-height: 1.5;
    }
    .item_title { 
        font-size: 20px;
        margin-bottom: 0px;
    }
}


.how_button {
    background-color: #fff;
    background-image: url(/src/img/kakaolink_btn_small.png);
    background-position: left 30px center;
    background-repeat: no-repeat;
    background-size: auto 20px;
    margin-top: 25px;  border: 1px solid #fafafa; font-size: 16px;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    padding: 15px 30px;
    border-radius: 8px;
    padding-left: 55px;
}

.guide_how_bottom {
    display: flex; flex-direction: column; justify-content: center; align-items: center; text-align:center; margin-top: 20px;
    margin-top: 50px;
}
.guide_how_bottom p {
    font-size: 1.8rem; font-weight: 400;
    line-height: 1.6;
}

.stepWrap * {
    box-sizing: border-box;
}
.stepWrap::-webkit-scrollbar {
    display: none;
}
.stepWrap {
    user-select: none;
    min-height: 500px;
    padding: 20px 0 50px 0;
    font-family: Pretendard;
    font-weight: 400;
    display: grid;
    grid-template-columns: repeat(5, 440px);
    overflow: scroll;
    gap: 20px;
    -ms-overflow-style: none; /* 인터넷 익스플로러 */
    scrollbar-width: none; /* 파이어폭스 */
    line-height: 1.5;
}
.stepWrap.video {
    grid-template-columns: repeat(7, 440px);
}
.stepWrap .box {
    background: #fff;
    padding: 40px 40px 30px 40px;
    max-width: 440px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 826px;
    border-radius: 10px;

    box-shadow: 10px 10px 10px -12px rgba(0, 0, 0, 0.30);
}
.stepWrap .step-text {
    font-size: 16px; font-weight: bold;
    background: #f4f5f9;
    border-radius: 50px;
    padding: 5px 33px;
    text-align: center;
    width: fit-content;
    /* line-height: 1; */
    margin: 0 auto;
}
.stepWrap .title {
    font-size: 22px;
    text-align: center;
    margin-bottom: 20px;
}
.stepWrap .description {
    text-align: center;
    color: #7C7C7C;
    font-size: 18px;
}
.stepWrap .title a,
.stepWrap .description a {
    color: #9289FF;
    /* font-size: 18px; */
    /* font-weight: 500; */
}
.stepWrap .img-wrap {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #F4F5F9;
}
.stepWrap .img-wrap img {
    width: 100%;
}
.stepWrap .img-wrap > div {
    height: 500px;
    background-position: center;
    background-size: cover;
}
@media screen and (max-width: 999px) {

    .step-content {
        padding: 10px 0 15px 0;
    }
    .stepWrap .img-wrap {
        margin: 0 20px;
    }
    .stepWrap {
        min-height: auto;
        padding: 20px 0;
        grid-template-columns: repeat(5, minmax(310px, 1fr));
        gap: 10px;
    }
    .stepWrap.video {
        grid-template-columns: repeat(7, minmax(310px, 1fr));
    }
    .stepWrap .box {
        max-width: 290px;
        padding: 20px 15px;
        height: auto !important;
    }
    .stepWrap .step-text {
        font-size: 13px;
        padding: 4px 28px;
    }
    .stepWrap .title {
        font-size: 20px;
        /* margin-bottom: 10px; */
    }
    .stepWrap .description {
        font-size: 16px;
    }
}


.help-container {
    padding: 60px 0;
}
.help-container .banners {
    display: grid;
    grid-template-columns: auto 440px;
    gap: 20px;
}

.help-container .banners .bn01 {
    border-radius: 12px;
    background-color: #EAFF96;
    background-image: url("/app/help/images/frame01.png");
    background-size: cover; 
    background-position: 0 0;
    height: 210px; display: flex; padding: 24px 20px;
}
.help-container .banners .bn02 {
    height: 210px; 
    display: flex; padding: 24px 20px;
    border-radius: 12px; background: #FFEB3B;
}
.help-container .banners .bn02 .shape {
    position: absolute;
    top: 20px; right: 20px;
}


.help-container .banners .bn {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative; 

}
.help-container .banners .bn .title {
    font-size: var(--fs-22); line-height: var(--lh-22); letter-spacing: var(--ls-22);
    font-weight: 600; color: #020202; display: flex; flex-direction: column;
    gap: 12px;
}
.help-container .banners .bn .title .desc {
    font-size: var(--fs-14); line-height: var(--lh-14); letter-spacing: var(--ls-14);
    font-weight: 400; color: #000;
}
.help-container .banners .bn .btns {
    display: flex; gap: 12px;
    
}
.help-container .banners .bn .btns .btn {
    font-size: var(--fs-14); line-height: var(--lh-14); letter-spacing: var(--ls-14);
    font-weight: 600;
    padding: 12px 10px;
    border-radius: 8px;
    background: #000;
    color: #fff;
    width: 155px; display: flex; justify-content: center;
}
.help-container .banners .bn .btns .btn.white {
    background: #fff;
    color: #000;
}
.help-container .banners .bn.bn01 .btns {
    justify-content: right;
}
.help-container .banners .bn.bn02 .btns .btn {
    width: 118px;
}

/* .help-container {
    padding: 60px 0;
} */
.standard {
    width: 1130px; margin: 0 auto;
}

.h-line {
    padding-bottom: 60px;
}

@media only screen and (max-width: 1150px) {  

    .standard {
        width: auto; margin: 0 24px;
    }
}

@media only screen and (max-width: 1000px) {  

    .h-line {
        padding-bottom: 30px;
    }

    .help-container .banners {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .help-container .banners .bn .btns .btn {
        width: 100%;
    }
}