@charset "utf-8";

/* ========== 모바일 푸터 (쇼핑몰형 컴팩트 UI) ========== */
@media screen and (max-width: 1090px) {
    #footer,
    #footer_wrap,
    #footer #footer,
    #footer_wrap #footer {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif !important;
        letter-spacing: -0.02em !important;
        -webkit-font-smoothing: antialiased;
    }

    /* --- 상단 링크바 --- */
    #footer .link {
        height: auto !important;
        min-height: 0 !important;
        background: #222 !important;
        border-top: none !important;
        padding: 0 !important;
    }
    #footer .link .container {
        position: relative !important;
        display: block !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        padding: 10px 12px 12px !important;
        box-sizing: border-box !important;
    }
    #footer .link .container > ul:not(.fsns) {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        overflow: visible !important;
    }
    #footer .link .container > ul:not(.fsns) li {
        position: relative !important;
        float: none !important;
        display: inline-block !important;
        margin: 0 !important;
        padding: 0 !important;
        background: none !important;
    }
    #footer .link .container > ul:not(.fsns) li:before {
        top: 50% !important;
        left: 0 !important;
        height: 10px !important;
        margin-top: -5px !important;
        background: rgba(255,255,255,.22) !important;
    }
    #footer .link .container > ul:not(.fsns) li a,
    #footer .link .container > ul:not(.fsns) li a.privacy {
        padding: 2px 8px !important;
        line-height: 24px !important;
        font-size: 11px !important;
        font-weight: 500 !important;
        color: #eee !important;
        letter-spacing: -0.03em !important;
    }

    /* SNS */
    #footer .link .fsns,
    #footer .fsns,
    .fsns {
        position: static !important;
        right: auto !important;
        top: auto !important;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        float: none !important;
        clear: both !important;
    }
    #footer .fsns li,
    .fsns li {
        float: none !important;
        display: inline-block !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #footer .fsns li:before,
    .fsns li:before {
        display: none !important;
        background: none !important;
    }
    #footer .fsns li a,
    .fsns li a {
        padding: 0 !important;
        line-height: 1 !important;
    }
    #footer .fsns img,
    .fsns img {
        width: 28px !important;
        height: 28px !important;
        border-radius: 8px !important;
        display: block !important;
    }

    /* --- 본문 정보 --- */
    #footer .bottom {
        padding: 0 !important;
        margin: 0 !important;
        background: #fff !important;
        border-top: none !important;
        border-bottom: none !important;
    }
    #footer .bottom .container {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #footer .bottom .cs-center,
    #footer .bottom .bank-info,
    #footer .bottom .notice,
    #footer .bottom .bottom-quick,
    #footer .bottom .about {
        display: block !important;
        float: none !important;
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 14px 16px !important;
        border-right: none !important;
        border-bottom: 1px solid #eee !important;
        box-sizing: border-box !important;
        text-align: left !important;
    }

    /* CS + Bank 2열 */
    #footer .bottom .cs-center,
    #footer .bottom .bank-info {
        width: 50% !important;
        padding: 14px 12px 14px 16px !important;
    }
    #footer .bottom .bank-info {
        padding-left: 12px !important;
        padding-right: 16px !important;
        border-left: 1px solid #eee !important;
    }

    #footer .bottom .container > div > h3,
    #footer .bottom .container > div > h3 a {
        padding: 0 0 6px !important;
        margin: 0 !important;
        border: none !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        letter-spacing: 0.04em !important;
        text-transform: uppercase !important;
        color: #111 !important;
        font-family: "Pretendard", "Noto Sans KR", sans-serif !important;
    }

    #footer .bottom .cs-center > strong {
        display: block !important;
        color: #111 !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        letter-spacing: -0.03em !important;
        font-family: "Pretendard", "Noto Sans KR", sans-serif !important;
    }
    #footer .bottom .container > div p,
    #footer .bottom .cs-center p {
        padding: 4px 0 0 !important;
        margin: 0 !important;
        color: #777 !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        line-height: 1.45 !important;
    }

    #footer .bottom .bank-info ul {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }
    #footer .bottom .bank-info ul p,
    #footer .bottom .bank-info p {
        margin: 0 !important;
        padding: 0 !important;
        color: #777 !important;
        font-size: 11px !important;
        line-height: 1.4 !important;
    }
    #footer .bottom .bank-info ul li {
        padding: 2px 0 0 !important;
        color: #222 !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        list-style: none !important;
    }
    #footer .bottom .bank-info ul li strong {
        display: block !important;
        padding: 2px 0 0 !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        color: #111 !important;
        letter-spacing: -0.02em !important;
        vertical-align: baseline !important;
    }

    /* Notice */
    #footer .bottom .notice {
        padding-top: 12px !important;
        padding-bottom: 10px !important;
    }
    #footer .bottom .notice ul {
        margin: 0 !important;
        padding: 0 !important;
    }
    #footer .bottom .notice ul li {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        overflow: hidden !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 5px 0 !important;
        line-height: 1.3 !important;
    }
    #footer .bottom .notice ul li a {
        position: relative !important;
        -webkit-box-flex: 1 !important;
        -ms-flex: 1 !important;
        flex: 1 !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        padding: 0 8px 0 8px !important;
        color: #444 !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        line-height: 1.35 !important;
        letter-spacing: -0.03em !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        vertical-align: middle !important;
        box-sizing: border-box !important;
    }
    #footer .bottom .notice ul li a:before {
        top: 50% !important;
        width: 3px !important;
        height: 3px !important;
        margin-top: -1.5px !important;
        border-radius: 50% !important;
        background: #bbb !important;
    }
    #footer .bottom .notice ul li .bottom-n-date {
        float: none !important;
        -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 auto !important;
        flex: 0 0 auto !important;
        width: auto !important;
        height: auto !important;
        padding-left: 6px !important;
        text-align: right !important;
        color: #aaa !important;
        font-size: 10px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
    }
    /* 모바일에서는 공지 2개만 노출 (컴팩트) */
    #footer .bottom .notice ul li:nth-child(n+3) {
        display: none !important;
    }

    /* Quick menu */
    #footer .bottom .bottom-quick {
        border-bottom: none !important;
        padding: 14px 16px 16px !important;
        background: #fafafa !important;
    }
    #footer .bottom .bottom-quick ul {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-pack: justify !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        overflow: visible !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #footer .bottom .bottom-quick ul li {
        float: none !important;
        -webkit-box-flex: 1 !important;
        -ms-flex: 1 !important;
        flex: 1 !important;
        margin: 0 !important;
        text-align: center !important;
    }
    #footer .bottom .bottom-quick ul li a {
        display: block !important;
        text-decoration: none !important;
    }
    #footer .bottom .bottom-quick ul li img {
        width: 44px !important;
        height: 44px !important;
        margin: 0 auto !important;
        display: block !important;
    }
    #footer .bottom .bottom-quick ul li span {
        display: block !important;
        padding: 6px 0 0 !important;
        color: #333 !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        letter-spacing: -0.03em !important;
        line-height: 1.2 !important;
    }

    /* --- 사업자정보 --- */
    #footer .footer {
        padding: 12px 0 10px !important;
        background: #f3f3f3 !important;
        border-top: 1px solid #e8e8e8 !important;
    }
    #footer .footer .container {
        display: block !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
    }
    #footer .footer .container .policy {
        position: static !important;
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        padding: 0 !important;
    }
    #footer .footer .container .policy ul {
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }
    #footer .footer .container .policy,
    #footer .footer .container .policy *,
    #footer .footer .container .policy ul,
    #footer .footer .container .policy ul li,
    #footer .footer .container .policy strong {
        color: #666 !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        line-height: 1.55 !important;
        letter-spacing: -0.02em !important;
    }
    #footer .footer .container .policy ul li {
        display: block !important;
        padding: 0 !important;
    }
    #footer .footer .container .policy strong {
        display: block !important;
        margin-top: 8px !important;
        color: #444 !important;
        font-weight: 600 !important;
    }
    #footer .footer .footermark {
        position: static !important;
        display: block !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        text-align: left !important;
        line-height: 0 !important;
        opacity: .9;
    }
    #footer .footer .footermark img {
        display: block !important;
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
        max-height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        vertical-align: top;
    }
}

@media screen and (max-width: 480px) {
    #footer .bottom .cs-center > strong {
        font-size: 16px !important;
    }
    #footer .bottom .bank-info ul li strong {
        font-size: 13px !important;
    }
    #footer .bottom .bottom-quick ul li img {
        width: 40px !important;
        height: 40px !important;
    }
}