/* ==== QUICK MENU ==== */
.quick-floating {
    position: fixed;
    right: 24px;
    bottom: 120px;
    z-index: 9999;
}

/* Äü¸Þ´º µ¿±×¶õ ¹öÆ° (¾ÆÀÌÄÜ + ÅؽºÆ®) */
.quick-main-btn {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: none;
    padding: 0;
    background: #0C63E7;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    cursor: pointer;
    box-shadow: 0 6px 15px rgba(0,0,0,0.16);
    transition: all .25s ease;
    font-family: inherit;
}

.quick-main-btn:hover {
    background: #094db3;
    transform: translateY(-3px);
}

.quick-main-btn .quick-icon i {
    font-size: 20px;
}

.quick-main-btn .quick-label {
    font-size: 11px;
    font-weight: 600;
}

/* ÆîÃÄÁö´Â ÆгΠ*/
.quick-panel {
    position: absolute;
    right: 80px;
    bottom: 0;
    width: 210px;
    background: #fff;
    border-radius: 18px;
    padding: 18px 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.14);
    opacity: 0;
    pointer-events: none;
    transform: translateX(15px);
    transition: all .25s ease;
}

.quick-panel.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

.quick-panel ul {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
}

.quick-panel li {
    margin-bottom: 12px;
}

.quick-panel a {
    display: block;
    font-size: 14px;
    color: #333;
    padding: 8px 6px;
    border-radius: 10px;
    transition: all .2s ease;
}

.quick-panel a:hover {
    background: #f2f6ff;
    color: #0C63E7;
}

.quick-panel .center-info {
    border-top: 1px solid #eee;
    padding-top: 12px;
    text-align: center;
    font-size: 13px;
    color: #555;
}
.quick-panel .center-info strong {
    font-size: 17px;
    font-weight: 700;
    color: #222;
}

/* ==== TOP ¹öÆ° ==== */
.top-floating-btn {
    position: fixed;
    right: 24px;
    bottom: 40px;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: none;
    padding: 0;
    background: #333;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    cursor: pointer;
    z-index: 9999;
    box-shadow: 0 6px 15px rgba(0,0,0,0.16);
    transition: all .25s ease;
    font-family: inherit;
}

.top-floating-btn:hover {
    background: #000;
    transform: translateY(-4px);
}

.top-floating-btn .top-icon i {
    font-size: 20px;
}
.top-floating-btn .top-label {
    font-size: 11px;
    font-weight: 600;
}

/* ½ºÅ©·Ñ Àü¿¡´Â TOP ¹öÆ° ¼û±è (¿øÇÏ¸é »èÁ¦ °¡´É) */
.top-floating-btn.hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
}

/* ===== ¸ð¹ÙÀÏ¿¡¼­´Â QUICK MENU ¼û±è ===== */
@media (max-width: 768px) {
    .quick-floating {
        display: none;
    }
}
/* ¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡
       QUICK MENU NEW PREMIUM BUTTON
¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡ */

.quick-floating {
    position: fixed;
    right: 24px;
    bottom: 140px;
    z-index: 9999;
    text-align: center;
}

/* ¾ÆÀÌÄÜ Áß½ÉÀÇ ¿ø ¹öÆ° */
.quick-main-btn {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: linear-gradient(145deg, #0D6EFD, #0A58CA);
    box-shadow:
        4px 4px 12px rgba(0,0,0,0.22),
        -3px -3px 10px rgba(255,255,255,0.35),
        inset 2px 2px 6px rgba(255,255,255,0.3),
        inset -2px -2px 6px rgba(0,0,0,0.15);
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
}

.quick-main-btn:hover {
    transform: translateY(-4px);
    box-shadow:
        6px 6px 14px rgba(0,0,0,0.28),
        -3px -3px 12px rgba(255,255,255,0.45);
}

/* ¹öÆ° ¾Æ·¡ ¶óº§ */
.quick-label {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #333;
}

/* Æîħ ÆгΠ*/
.quick-panel {
    position: absolute;
    right: 85px;
    bottom: 0;
    width: 210px;
    background: #fff;
    border-radius: 18px;
    padding: 18px 15px;
    box-shadow: 0 10px 28px rgba(0,0,0,0.18);
    opacity: 0;
    pointer-events: none;
    transform: translateX(15px);
    transition: all .25s ease;
}

.quick-panel.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

/* ¸ð¹ÙÀÏ ¼û±è */
@media (max-width: 768px) {
    .quick-floating {
        display: none;
    }
}

/* ¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡
           TOP ¹öÆ° (¶óº§ Æ÷ÇÔ)
¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡¦¡ */

.top-floating-btn {
    position: fixed;
    right: 24px;
    bottom: 40px;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: #222;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 22px;
    box-shadow: 4px 4px 14px rgba(0,0,0,0.25);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: all .25s ease;
    opacity: 1;
}

.top-floating-btn:hover {
    transform: translateY(-4px);
    background: #000;
}

.top-label {
    font-size: 11px;
    font-weight: 600;
}

.quick-floating {
    position: fixed;
    right: 24px;
    bottom: 140px;
    z-index: 9999;
    text-align: center;
}

/* ¹Ù±ù ÆĶõ ¿ø */
.quick-main-btn {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 20%, #4da5ff, #0d6efd);
    border: none;
    cursor: pointer;
    box-shadow: 0 10px 25px rgba(0,0,0,0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: transform .2s ease, box-shadow .2s ease;
}

.quick-main-btn:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(0,0,0,0.3);
}

/* ¾ÈÂÊ »ì¦ ÀÛÀº ¿ø (±Û·Î½Ã ´À³¦) */
.quick-main-inner {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 20%, #ffffff, #dbe8ff);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        inset 0 2px 4px rgba(255,255,255,0.8),
        inset 0 -3px 6px rgba(0,0,0,0.12);
}

.quick-main-inner i {
    font-size: 22px;
    color: #0d6efd;
}

/* ¹öÆ° ¾Æ·¡ ¶óº§ */
.quick-label {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #333;
}

/* ¸ð¹ÙÀÏ¿¡¼­´Â Äü¸Þ´º ¼û±è (ÀÌ¹Ì Àû¿ëÇصμÌÀ¸¸é ±×´ë·Î) */
@media (max-width: 768px) {
    .quick-floating {
        display: none;
    }
}
/* ==============================
      TOP BUTTON (µ¶¸³Çü)
============================== */
.top-floating-btn {
    position: fixed;
    right: 24px;
    bottom: 40px;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #222;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 22px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.28);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: all .25s ease;
    z-index: 9999;
    opacity: 1; /* ¡ç ¹«Á¶°Ç º¸À̵µ·Ï °­Á¦ */
}

.top-floating-btn:hover {
    transform: translateY(-4px);
    background: #000;
}

.top-label {
    font-size: 11px;
    font-weight: 600;
}

/* ½ºÅ©·Ñ Àü¿¡´Â ¼û±è (¿øÇϸé À¯Áö) */
.top-floating-btn.hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
}