/* ===========================================================
   quick_bottom_menu.css
   - quick_bottom_menu.php (하단 빠른상담 바 #dbBar / 개인정보 모달 / 모바일 하단바) 전용 스타일
   - 큰 화면: #dbBar 표시 / 작은 화면(≤767px): #dbBar 숨김 + #footer_quick_reserve_mobile 표시
   =========================================================== */

/* 하단 빠른상담 바 (#dbBar) */
#dbBar {background: #36FEF3; overflow: visible; z-index: 999}
#dbBar .updownBtn {background: #36FEF3; color: #0F1015; position: absolute; left: 50%; transform: translateX(-50%); bottom: 100%; font-size: 1.8rem; padding: 1rem 2rem 0.4rem; border-radius: 2rem 2rem 0 0; font-weight: 600; cursor: pointer;}
#dbBar .inner {display: inline-block; left: 50%; transform: translateX(-50%);}
#dbBar .inner::before {content: ''; display: block; position: absolute; width: 8rem; height: 12.5rem;  bottom: 0; left: 102%}
#dbBar .cont {gap: 1.8rem; padding: 1.6rem 0; align-items: center;}
#dbBar .dbTit {font-size: 2.6rem; font-weight: 500; color: #0F1015; white-space: nowrap; letter-spacing: -0.05em;}
#dbBar .dbTit b {font-weight: 800;}
#dbBar .leftArea {display: flex; align-items: center; gap: 1.2rem;}
#dbBar .leftArea .inpArea {gap: 1rem; font-size: 1.6rem;}
#dbBar .leftArea .inpArea input {width: 16rem; background: #fff; height: 4.8rem; padding: 0 1.5rem; border: 1px solid #d5d5d5; border-radius: 0.5rem; font-size: inherit; color: #2C2C2C;}
#dbBar .leftArea .inpArea input::placeholder {color: #9a9a9a}
#dbBar .leftArea .inpArea input:focus {outline: 0;}
#dbBar .leftArea .inpArea select {width: 16rem; background-color: #fff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='9' viewBox='0 0 13 9'%3E%3Cpath d='M6.5 9L0 0h13z' fill='%2300BFB5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1.3rem center; background-size: 1.3rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 4.8rem; padding: 0 3.4rem 0 1.5rem; border: 1px solid #d5d5d5; border-radius: 0.5rem; font-size: inherit; color: #2C2C2C; cursor: pointer;}
#dbBar .leftArea .chkArea {gap: 0.8rem; font-size: 1.6rem; align-items: center; color: #0F1015;}
#dbBar .leftArea .chkArea input {width: 2rem; height: 2rem; border: 1px solid #707070; margin: 0; accent-color: #00BFB5;}
#dbBar .leftArea .chkArea a {text-decoration: underline; color: inherit;}
#dbBar .submitBtn {width: 16rem; height: 4.8rem; border: 0; background: #0F1015; color: #fff; padding: 0; border-radius: 0.6rem; display: flex; align-items: center; justify-content: center; cursor: pointer;}
#dbBar .submitBtn span {display: block; color: #fff; font-size: 2.2rem; font-weight: bold;}

#dbBar.down {bottom: auto; top: 100%;}
#dbBar.down .inner::before {display: none}

/* 개인정보취급방침 모달 (dbBar 보기) */
#dbPrivacyModal {display: none; position: fixed; inset: 0; z-index: 11000;}
#dbPrivacyModal.on {display: block;}
#dbPrivacyModal .dbpv_dim {position: absolute; inset: 0; background: rgba(0,0,0,0.5);}
#dbPrivacyModal .dbpv_box {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 92%; max-width: 80rem; height: 80vh; background: #fff; border-radius: 1rem; overflow: hidden; box-shadow: 0 1rem 3rem rgba(0,0,0,0.3);}
#dbPrivacyModal .dbpv_close {position: absolute; top: 0.8rem; right: 1.2rem; z-index: 2; width: 3.6rem; height: 3.6rem; border: 0; background: transparent; font-size: 3.2rem; line-height: 1; color: #333; cursor: pointer;}
#dbPrivacyModal iframe {width: 100%; height: 100%; border: 0; display: block;}

/* 모바일 하단 고정바 (#footer_quick_reserve_mobile): 기본 숨김 */
#footer_quick_reserve_mobile {display: none;}

@media all and (max-width: 880px){
    #dbBar {bottom: 0}
    #dbBar .updownBtn {font-size: 2rem;}
    #dbBar .inner {padding-left: 0; left: 40%; transform: translateX(-50%);}
    #dbBar .cont {padding: 1.4rem 0; align-items: flex-start;}
    #dbBar .dbTit {font-size: 2rem; padding-top: 0.6rem;}
    #dbBar .inner::before {width: 11.6rem; height: 17.5rem;}
    #dbBar .leftArea {align-items: flex-start; flex-direction: column;}
    #dbBar .leftArea .inpArea {gap: 0.2rem}
    #dbBar .leftArea .inpArea input {width: 15rem}
    #dbBar .leftArea .inpArea select {width: 15rem; line-height: 1;}
    #dbBar .leftArea .chkArea {gap: 0.6rem; padding-top: 0.8rem; font-size: 1.6rem;}
    #dbBar .leftArea .chkArea input {width: 2rem; height: 2rem;}
    #dbBar .submitBtn {height: auto; position: absolute; width: 15rem; bottom: 1rem; right: 0rem;}
    #dbBar .submitBtn span {display: block}
}

/* 작은 화면(≤1024px): #dbBar 숨기고 모바일 하단바 표시 */
@media screen and (max-width: 1024px){
    #dbBar {display: none;}

    #footer_quick_reserve_mobile {
        position: fixed;
        bottom: 0%;
        width: 100%;
        height: 55px;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 9999;
    }
    #footer_quick_reserve_mobile > div {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        padding: 15px 0;
        width: 50%;
    }
    #footer_quick_reserve_mobile > div:first-child {background-color: #36fef3;}
    #footer_quick_reserve_mobile > div:last-child {background-color: #000;}
    #footer_quick_reserve_mobile > div > span {
        color: #000;
        font-family: "S-Core Dream";
        font-size: 17.5px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        letter-spacing: -0.175px;
    }
    #footer_quick_reserve_mobile > div:last-child > span {color: #fff;}
}
