/* BASIC css start */
footer {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto auto auto;
    margin-top:120px;
    padding:40px 100px;
    border-top:1px solid var(--cw-color-20);
    box-sizing:border-box;
}
.site-footer-info{display:contents;}
.footer-nav{
    grid-column:1/2; grid-row:1; display:flex; align-items:center; flex-wrap:wrap;
    gap:10px 32px; margin:0; padding:0; list-style:none;
}
.footer-nav a{font-size:.875rem;color:var(--cw-color-80);text-decoration:none;}

.footer-company{
    grid-column:1/2; grid-row:3; display:flex; flex-direction:column; gap:5px;
    padding-top:20px; font-size:.813rem; color:var(--cw-color-80); min-width:0;
}
.footer-company .name{display:none;}
.footer-company a{color:var(--cw-color-80);}
.footer-company .biz-info p{display:flex;flex-wrap:wrap;margin:0;line-height:1.65;}
.footer-company .biz-info p .udline{text-decoration:underline;color:var(--cw-point-color-pri);}
.footer-company .biz-info span{display:inline-block;padding-right:8px;}
.footer-company .biz-info .escrow{font-size:.813rem;padding:10px 0 6px;display:block;}
.footer-company .biz-info .copyright{padding-top:4px;color:var(--cw-color-60);}

.footer-support{
    grid-column:2/3; grid-row:1/4;
    display:grid; grid-template-columns:repeat(2,minmax(180px,1fr));
    align-content:start; gap:34px 60px; margin-left:80px;
    min-width:440px; max-width:620px; font-size:0;
}
.footer-support>div{min-width:0;}
.footer-support strong{
    display:block;padding-bottom:10px;font-size:.813rem;font-weight:600;
    color:var(--cw-heading-color);
}
.footer-support p{
    margin:0;padding-bottom:4px;font-size:.813rem;line-height:1.55;
    color:var(--cw-color-80);word-break:keep-all;overflow-wrap:anywhere;
}
.footer-support .cs-number{padding-bottom:4px;}
.footer-cs .cs-number{font-size:.875rem;color:var(--cw-heading-color);font-weight:700;}

.footer-contact-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.footer-contact-links a{
    display:inline-flex;align-items:center;justify-content:center;min-height:30px;
    padding:0 12px;border:1px solid var(--cw-color-30);border-radius:3px;
    box-sizing:border-box;font-size:.75rem;color:var(--cw-color-80);text-decoration:none;
}

.footer-sns{
    grid-column:1/2;grid-row:2;display:flex;align-items:center;gap:18px;padding-top:20px;
}
.footer-sns a{font-size:.75rem;color:var(--cw-color-60);text-decoration:none;}

/* 태블릿 */
@media (min-width:768px) and (max-width:991.98px){
    footer{
        grid-template-columns:minmax(0,1fr);
        grid-template-rows:auto auto auto auto;
        padding:40px 24px;margin:80px 0 60px;
    }
    .footer-nav{grid-column:1;grid-row:1;gap:10px 28px;}
    .footer-sns{grid-column:1;grid-row:2;padding-top:20px;}
    .footer-support{
        grid-column:1;grid-row:3;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:28px 40px;min-width:0;max-width:none;padding-top:28px;margin-left:0;
    }
    .footer-support strong{padding-bottom:6px;}
    .footer-support p{display:block;font-size:.75rem;}
    .footer-company{grid-column:1;grid-row:4;padding-top:28px;gap:0;}
    .footer-company .biz-info{display:none;font-size:.75rem;}
    .footer-company .biz-info .escrow{font-size:.75rem;line-height:18px;}
    .footer-company .name{
        display:flex;width:auto;max-width:360px;padding:0 20px 10px 0;
        color:var(--cw-heading-color);font-weight:600;cursor:pointer;
    }
    .footer-company .name .ico-arrow{
        width:12px;height:13px;padding-right:20px;
        background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M2.5 5.47559L6 8.97559L9.5 5.47559' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 3px;
    }
    .footer-company .name.on .ico-arrow{
        background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'><path d='M2.5 7.52441L6 4.02441L9.5 7.52441' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 3px;
    }
    .footer-company .name.on + .biz-info{display:block;}
}

/* 모바일 */
@media (max-width:767.98px){
    footer{
        grid-template-columns:minmax(0,1fr);
        grid-template-rows:auto auto auto auto;
        width:100%;min-width:0;padding:30px 16px;margin:60px 0;
        box-sizing:border-box;overflow:hidden;
    }
    .footer-nav{grid-column:1;grid-row:1;gap:8px 20px;min-width:0;}
    .footer-nav a{font-size:.813rem;white-space:nowrap;}
    .footer-sns{grid-column:1;grid-row:2;gap:16px;padding-top:20px;}
    .footer-support{
        grid-column:1;grid-row:3;grid-template-columns:minmax(0,1fr);
        gap:26px;width:100%;min-width:0;max-width:none;padding-top:28px;margin-left:0;
    }
    .footer-support>div{width:100%;min-width:0;}
    .footer-support .cs-number{display:block;font-size:.813rem;}
    .footer-support strong{padding-bottom:6px;}
    .footer-support p{
        display:block;width:100%;padding-bottom:4px;font-size:.75rem;
        line-height:1.6;word-break:keep-all;overflow-wrap:anywhere;
    }
    .footer-support p::after{content:none!important;display:none!important;}
    .footer-company{grid-column:1;grid-row:4;width:100%;min-width:0;padding-top:28px;gap:0;}
    .footer-company .biz-info{display:none;width:100%;min-width:0;font-size:.75rem;}
    .footer-company .biz-info p{display:block;width:100%;line-height:1.65;}
    .footer-company .biz-info span{
        display:block;width:100%;padding-right:0;padding-bottom:3px;
        word-break:keep-all;overflow-wrap:anywhere;
    }
    .footer-company .biz-info .escrow{font-size:.75rem;line-height:18px;}
    .footer-company .name{
        display:flex;align-items:center;width:fit-content;max-width:100%;
        padding:0 20px 10px 0;color:var(--cw-heading-color);font-weight:600;cursor:pointer;
    }
    .footer-company .name .ico-arrow{
        width:12px;height:13px;padding-right:20px;flex:0 0 auto;
        background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M2.5 5.47559L6 8.97559L9.5 5.47559' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 3px;
    }
    .footer-company .name.on .ico-arrow{
        background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'><path d='M2.5 7.52441L6 4.02441L9.5 7.52441' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 3px;
    }
    .footer-company .name.on + .biz-info{display:block;}
}


/* 계좌안내 */
.footer-account {
    min-width: 360px;
}

.footer-account strong {
    display: block;
    padding-bottom: 12px;
    font-size: .813rem;
    font-weight: 600;
    color: var(--cw-heading-color);
}

.footer-account .bank-info-line {
    display: flex;
    align-items: center;
    gap: 40px;
    font-size: .813rem;
    color: var(--cw-color-80);
    white-space: nowrap;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .footer-account {
        min-width: 0;
    }

    .footer-account .bank-info-line {
        flex-wrap: wrap;
        gap: 4px 24px;
        white-space: normal;
    }
}

@media (max-width: 767.98px) {
    .footer-account {
        width: 100%;
        min-width: 0;
    }

    .footer-account .bank-info-line {
        display: block;
        white-space: normal;
        line-height: 1.8;
    }

    .footer-account .bank-info-line span {
        display: block;
    }
}


/* =========================================
   FOOTER SUPPORT RE-LAYOUT
   PC: 왼쪽 오프라인매장 / 오른쪽 고객센터 / 하단 계좌안내
   ========================================= */
.footer-support {
    grid-column: 2 / 3;
    grid-row: 1 / 4;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(220px, 1fr);
    grid-template-areas:
        "offline cs"
        "account account";
    align-content: start;
    column-gap: 70px;
    row-gap: 34px;
    margin-left: 80px;
    min-width: 600px;
    max-width: 760px;
}

.footer-offline {
    grid-area: offline;
    min-width: 0;
}

.footer-cs {
    grid-area: cs;
    min-width: 0;
}

.footer-account {
    grid-area: account;
    min-width: 0;
    width: 100%;
    padding-top: 4px;
    border-top: 1px solid var(--cw-color-20);
}

.footer-support strong,
.footer-account strong {
    display: block;
    padding: 0 0 10px;
    font-size: .813rem;
    font-weight: 600;
    color: var(--cw-heading-color);
}

.footer-offline p,
.footer-cs p {
    display: block;
    margin: 0;
    padding-bottom: 4px;
    font-size: .813rem;
    line-height: 1.55;
    color: var(--cw-color-80);
}

.footer-cs .cs-number {
    padding-bottom: 6px;
    font-size: .875rem;
    font-weight: 700;
    color: var(--cw-heading-color);
}

.footer-account .bank-info-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 40px;
    font-size: .813rem;
    line-height: 1.55;
    color: var(--cw-color-80);
    white-space: normal;
}

/* 기존 계좌안내 왼쪽 세로바 제거 */
.footer-account strong::before {
    content: none !important;
    display: none !important;
}

/* 태블릿 */
@media (min-width: 768px) and (max-width: 991.98px) {
    .footer-support {
        grid-column: 1;
        grid-row: 3;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "offline cs"
            "account account";
        gap: 28px 40px;
        width: 100%;
        min-width: 0;
        max-width: none;
        padding-top: 28px;
        margin-left: 0;
    }

    .footer-account {
        padding-top: 20px;
    }

    .footer-account .bank-info-line {
        gap: 4px 24px;
        font-size: .75rem;
    }

    .footer-offline p,
    .footer-cs p {
        font-size: .75rem;
    }
}

/* 모바일 */
@media (max-width: 767.98px) {
    .footer-support {
        grid-column: 1;
        grid-row: 3;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "offline"
            "cs"
            "account";
        gap: 26px;
        width: 100%;
        min-width: 0;
        max-width: none;
        padding-top: 28px;
        margin-left: 0;
    }

    .footer-account {
        width: 100%;
        min-width: 0;
        padding-top: 20px;
    }

    .footer-account .bank-info-line {
        display: block;
        font-size: .75rem;
        line-height: 1.8;
    }

    .footer-account .bank-info-line span {
        display: block;
    }

    .footer-offline p,
    .footer-cs p {
        display: block;
        width: 100%;
        font-size: .75rem;
        line-height: 1.6;
    }

    .footer-support p::after {
        content: none !important;
        display: none !important;
    }
}

/* BASIC css end */

