@charset "UTF-8";
/* @import : _base.scss */
/* CSS reset */

html { overflow: hidden; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, article, aside, hgroup, header, footer, figure, figcaption,
nav, section { margin: 0; padding: 0; border: 0; box-sizing: border-box; }

body,table,th,td,input,textarea,button,select { font-size: 14px; font-weight: 400; letter-spacing: -0.5px; font-family: 'Pretendard', Arial, sans-serif; color: #666; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; height: 0; }
audio, canvas, img, video { vertical-align: middle; }
ol, ul, li { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
img, fieldset { border: 0; }
input, select, textarea { line-height: 1.2; vertical-align: middle; }
button, select { text-transform: none; }
input { line-height: normal; }
textarea { resize: vertical; overflow: auto; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
label { cursor: pointer; }

/* For Screen Reader */
legend { display: none; visibility: hidden; }
caption { display: none; visibility: hidden; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
a { color: #666; text-decoration: none; }
a:active, a:hover, a:focus { text-decoration: none; }
button { margin: 0px; padding: 0px; border: 0px; background: none; font: inherit; color: inherit; background: transparent; overflow: visible; cursor: pointer; line-height: 1; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
button:hover { outline: 0; }
::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #999; }
::-moz-placeholder { /* Firefox 19+ */ color: #999; }
:-ms-input-placeholder { /* IE 10+ */ color: #999; }
:-moz-placeholder { /* Firefox 18- */ color: #999; }
/* @import : _variables.scss */
/* @import : _mixin.scss */
/* @import : _common.scss */

/* Layout */
.wrap { display: flex; flex-direction: column; align-items: flex-start; width: 100%; height: 100vh; min-height: 1080px; }
.container { display: flex; align-items: flex-start; align-self: stretch; flex: 1 0 0; width: 100%; height: calc(100vh - 64px); margin-top: 64px; overflow: hidden; }
.contents { display: flex; height: 100%; transition: margin-left 0.3s ease, width 0.3s ease; }
.contents.filter_contents { width: 100% !important; max-width: 100% !important; }
.side-nav.expanded + .contents { width: calc(100% - 264px); max-width: calc(1920px - 264px); min-width: calc(1280px - 264px); margin-left: 264px; }
.side-nav.collapsed + .contents { width: calc(100% - 48px); max-width: calc(1920px - 48px); min-width: calc(1280px - 48px); margin-left: 48px; }
.contents-inner { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; width: 100%; height: 100%; padding: 36px 40px; }
.common-style .container__inner { display: flex; max-width: 1640px; padding: 36px 40px; flex-direction: column; align-items: flex-start; gap: 20px; flex: 1 0 0; }
.common-style .container__inner .container-header-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.common-style .container__inner .container-header-wrap .container-header { display: flex; padding: 0; align-items: center; gap: 40px; align-self: stretch; border-bottom: 1px solid var(--clr-w300); }
.common-style .container__inner .container-header-wrap .container-header h2 { flex: 1 0 0; color: #151515; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); padding-bottom: 8px; }

/* Gnb */
.header { display: flex; height: 64px; padding: 16px 56px 16px 0; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; align-self: stretch; width: 100%; min-width: 1280px; background-color: var(--clr-w100); box-shadow: var(--ds-e200); z-index: 999; }
.header-inner { display: flex; align-items: center; align-self: stretch; }
.header-inner .header-nav-wrap { display: flex; height: 64px; align-items: center; flex: 1 0 auto; min-width: max-content; }
.header-logo { display: flex; width: 264px; height: 64px; padding: 0 56px; justify-content: center; align-items: center; flex-shrink: 0; }
.header-logo a { width: 175px; height: 20px; background: url("../../images/connectplace/common/cp_logo.svg"); text-indent: -9999px; flex-shrink: 0; aspect-ratio: 35 / 4; }
.header-logo a:hover { opacity: 1; }
.header-nav { height: 64px; flex: 0 0 auto; min-width: max-content; }
.header-nav ul { display: flex; height: 100%; flex-shrink: 0; }
.header-nav ul li:first-child { display: flex; height: 64px; padding: 0 8px; align-items: center; justify-content: center; flex-shrink: 0; }
.header-nav ul li { display: flex; height: 64px; padding: 0 8px 0 40px; align-items: center; justify-content: center; flex-shrink: 0; }
.header-nav ul li a { display: flex; align-items: center; justify-content: center; height: 100%; white-space: nowrap; text-align: center; line-height: var(--txt-line-height); font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); }
.header-nav ul li a.active { color: var(--txt-color-p600); border-bottom: 3px solid var(--clr-p600); box-sizing: border-box; }
.header-nav ul li a:hover { color: var(--txt-color-p600); opacity: 1; }
.header-icon { display: flex; height: 48px; justify-content: flex-end; align-items: center; gap: 16px; }
.header-icon .icon { position: relative; display: flex; align-items: center; }
.header-icon .icon .icon-admin { width: 24px; height: 24px; mask: url("/figma/svg/utility_admin_24.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/utility_admin_24.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.header-icon .icon .icon-infodesk { width: 24px; height: 24px; mask: url("/figma/svg/utility_infodesk_24.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/utility_infodesk_24.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.header-icon .icon .icon-alarm { width: 24px; height: 24px; mask: url("/figma/svg/utility_alarm_24.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/utility_alarm_24.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.header-icon .icon .icon-qna { width: 24px; height: 24px; mask: url("/figma/svg/utility_notice_24.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/utility_notice_24.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.header-icon .icon .icon-familysite { width: 24px; height: 24px; mask: url("/figma/svg/utility_familysite_24.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/utility_familysite_24.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.header-icon .icon a:hover { background-color: var(--clr-p600); opacity: 1; }
.header-icon .user { position: relative; display: flex; cursor: pointer; }
.header-icon .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.32px; background-color: var(--clr-n80); border-radius: 50%; }
.header-icon .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.header-icon .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.28px; }
.header-icon .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }

/* Gnb - Tooltip */
.header-icon .tooltip .tooltip-text { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-top: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.header-icon .tooltip .tooltip-text::after { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_up.svg") no-repeat center / contain; }
.header-icon .tooltip a:hover + .tooltip-text, .header-icon .user:hover .tooltip-text { visibility: visible; opacity: 1; }

/* GNB - Family Site Popover */
.family-site-popover { position: absolute; top: 65px; right: 96px; display: flex; flex-direction: column; align-items: center; gap: 16px; visibility: hidden; opacity: 0; transition: opacity 0.2s ease; padding: 20px; background-color: var(--clr-w100); border-radius: 12px; box-shadow: var(--ds-e500); box-sizing: border-box; }
.family-site-popover.active { visibility: visible; opacity: 1; }
.family-site-popover .title { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; text-align: center; }
.family-site-popover .site-area { display: flex; align-items: center; align-content: center; gap: 8px; flex-wrap: wrap; width: 256px; }
.family-site-popover .site-area a { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; width: 80px; height: 80px; padding: 4px 8px; flex-shrink: 0; aspect-ratio: 1/1; }
.family-site-popover .site-area a:hover { background-color: var(--clr-n30); border-radius: 6px; opacity: 1; }
.family-site-popover .site-area a .icon-docswave { width: 24px; height: 24px; background: url("/figma/svg/docswave.svg") no-repeat center / contain; flex-shrink: 0; aspect-ratio: 28/25; }
.family-site-popover .site-area a .icon-hostingkr { width: 24px; height: 24px; background: url("/figma/svg/hosting_kr.svg") no-repeat center / contain; flex-shrink: 0; aspect-ratio: 28/25; }
.family-site-popover .site-area a .icon-cloudplug { width: 41px; height: 24px; background: url("/figma/svg/cloudplug.svg") no-repeat center / contain; flex-shrink: 0; aspect-ratio: 28/25; }
.family-site-popover .site-area a .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; align-self: stretch; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.24px; text-align: center; overflow: hidden; text-overflow: ellipsis; }

/* Gnb - User Popover */
.user-popover { position: absolute; top: 65px; right: 56px; display: flex; flex-direction: column; align-items: center; gap: 16px; visibility: hidden; opacity: 0; transition: opacity 0.2s ease; width: 312px; padding: 20px 0 16px 0; background-color: var(--clr-w100); border-radius: 12px; box-shadow: var(--ds-e500); box-sizing: border-box; }
.user-popover.active { visibility: visible; opacity: 1; }
.user-popover .user-info { display: flex; width: 288px; flex-direction: column; align-items: center; gap: 8px; }
.user-popover .user-info .user { display: flex; }
.user-popover .user-info .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; font-family: var(--txt-font-family); font-size: var(--txt-size-36); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.user-popover .user-info .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.user-popover .user-info .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-36); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.72px; }
.user-popover .user-info .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.user-popover .user-info .name { display: flex; flex-direction: column; justify-content: center; align-self: stretch; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; text-align: center; }
.user-popover .user-info .email { display: flex; flex-direction: column; justify-content: center; align-self: stretch; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; text-align: center; }
.user-popover .btn-area { display: flex; width: 288px; align-items: center; gap: 4px; }
.user-popover .btn-area a { display: flex; flex-direction: column; align-items: center; padding: 4px 8px; gap: 4px; flex: 1 0 0; border-radius: 6px; }
.user-popover .btn-area a:hover { background-color: var(--clr-n30); opacity: 1; }
.user-popover .btn-area a .icon-settings { width: 24px; height: 24px; background: url("/figma/svg/utility_usersetting_24.svg") no-repeat center / contain; }
.user-popover .btn-area a .icon-logout { width: 24px; height: 24px; background: url("/figma/svg/logout_black_24.svg") no-repeat center / contain; }
.user-popover .btn-area a .name { font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.24px; text-align: center; }
.user-popover .admin-list { display: flex; flex-direction: column; align-self: stretch; border-top: 1px solid var(--clr-w300); box-sizing: border-box; }
.user-popover .admin-list ul { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 16px 12px 0 12px; }
.user-popover .admin-list ul li { display: flex; height: 44px; padding: 0 16px; align-items: center; align-self: stretch; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t700); letter-spacing: -0.28px; border-radius: 6px; cursor: pointer; }
.user-popover .admin-list ul li.active { color: var(--txt-color-t100); background-color: var(--clr-p600); }
.user-popover .admin-list ul li:not(.active):hover { color: var(--txt-color-t700); background-color: var(--clr-n30); }
.user-popover .site-area { display: flex; align-items: flex-start; align-content: flex-start; align-self: stretch; flex-wrap: wrap; gap: 4px; padding: 16px 12px 0 12px; border-top: 1px solid var(--clr-w300); box-sizing: border-box; }
.user-popover .site-area a { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 92px; padding: 4px 8px; }
.user-popover .site-area a:hover { background-color: var(--clr-n30); border-radius: 6px; opacity: 1; }
.user-popover .site-area a .icon-docswave { width: 33.45px; height: 30px; background: url("/figma/svg/docswave.svg") no-repeat center / contain; aspect-ratio: 33.45/30.00; }
.user-popover .site-area a .icon-hostingkr { width: 30px; height: 30px; background: url("/figma/svg/hosting_kr.svg") no-repeat center / contain; aspect-ratio: 3/3; }
.user-popover .site-area a .icon-cloudplug { width: 50px; height: 30px; background: url("/figma/svg/cloudplug.svg") no-repeat center / contain; aspect-ratio: 5/3; }
.user-popover .site-area a .name { font-family: var(--txt-font-family); font-size: var(--txt-size-10); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.2px; text-align: center; overflow: hidden; text-overflow: ellipsis; }

/* Lnb */
.side-nav { position: fixed; display: flex; flex-direction: column; align-items: flex-end; align-self: stretch; height: calc(100vh - 64px); padding-bottom: 36px; background-color: var(--clr-p90); border-right: 1px solid var(--clr-w300); box-sizing: border-box; transition: width 0.3s ease; z-index: 999; }
.side-nav.expanded { width: 264px; }
.side-nav.collapsed { width: 48px; }
.side-header { display: flex; width: 100%; height: 48px; padding: 0 16px; align-items: center; gap: 16px; background-color: var(--clr-n40); cursor: pointer; }
.side-nav.expanded .side-header .icon-side { width: 16px; height: 16px; mask: url("/figma/svg/sideclose_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/sideclose_16.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.side-nav.collapsed .side-header .icon-side { width: 16px; height: 16px; mask: url("/figma/svg/sideopen_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/sideopen_16.svg") no-repeat center / contain; background-color: var(--clr-w800); }
.side-nav .side-header:hover .icon-side { background-color: var(--clr-p600); }
.side-menu { width: 100%; }
.menu-group { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.menu-group .menu { width: 100%; }
.menu-group .menu > a { position: relative; display: flex; align-items: center; align-self: stretch; gap: 16px; height: 48px; padding: 0 16px; opacity: 1; }
.menu-group .menu.active > a { background-color: var(--clr-p200); }
.menu-group .menu > a i { aspect-ratio: 1/1; }
.menu-group .menu > a span { width: 172px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t700); letter-spacing: -0.32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-group .menu > a .side-menu__label { display: inline-flex; align-items: center; gap: 4px; width: auto; max-width: 172px; min-width: 0; box-sizing: border-box; }
.menu-group .menu > a .side-menu__label-text { flex: 0 1 auto; width: auto; min-width: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t700); letter-spacing: -0.32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-group .menu > a .side-menu__badge { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-width: 16px; height: 16px; padding: 0 6px; border-radius: 8px; background: var(--clr-p600); color: var(--clr-w100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); box-sizing: border-box; }
.menu-group .menu > a:hover i, .menu-group .menu.active > a i { background-color: var(--clr-p600); }
.menu-group .menu > a:hover span, .menu-group .menu.active > a span { color: var(--txt-color-p600); }
.menu-group .menu > a:hover .side-menu__label-text, .menu-group .menu.active > a .side-menu__label-text { color: var(--txt-color-p600); }
.menu-group .menu > a .icon-history { width: 16px; height: 16px; mask: url("/figma/svg/board_list_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/board_list_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-desk { width: 16px; height: 16px; mask: url("/figma/svg/seat_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/seat_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-room { width: 16px; height: 16px; mask: url("/figma/svg/room_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/room_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-visit { width: 16px; height: 16px; mask: url("/figma/svg/briefcase_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/briefcase_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-dashboard { width: 16px; height: 16px; mask: url("/figma/svg/graph_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/graph_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-schedule { width: 16px; height: 16px; mask: url("/figma/svg/attendance_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/attendance_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-approval { width: 16px; height: 16px; mask: url("/figma/svg/approval_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/approval_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-notice { width: 16px; height: 16px; mask: url("/figma/svg/notice_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/notice_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-faq { width: 16px; height: 16px; mask: url("/figma/svg/faq_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/faq_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-manual { width: 16px; height: 16px; mask: url("/figma/svg/manual_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/manual_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-preference { width: 16px; height: 16px; mask: url("/figma/svg/management_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/management_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }
.menu-group .menu > a .icon-password { width: 16px; height: 16px; mask: url("/figma/svg/license_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/license_16.svg") no-repeat center / contain; background-color: var(--clr-w600); }

/* Lnb - SubMenu */
.side-nav.expanded .menu > a.arrow::after { position: absolute; content: ""; right: 16px; width: 12px; height: 12px; background: url("/figma/svg/arrow_down_12.svg") no-repeat center / contain; }
.side-nav.expanded .menu > a.arrow.active::after { position: absolute; content: ""; right: 16px; width: 12px; height: 12px; background: url("/figma/svg/arrow_up_12.svg") no-repeat center / contain; }

.menu-group .sub-menu { display: none; flex-direction: column; align-items: flex-start; }
.side-nav.expanded .sub-menu.active { display: flex; }
.menu-group .sub-menu li { position: relative; width: 100%; height: 40px; padding-left: 38px; }
.menu-group .sub-menu li::before { position: absolute; content: ""; top: 0; left: 24px; width: 1px; height: 100%; background-color: var(--clr-w300); }
.menu-group .sub-menu li::after { position: absolute; content: ""; top: 20px; left: 24px; width: 14px; height: 1px; background-color: var(--clr-w300); }
.menu-group .sub-menu li:first-child { height: 48px; }
.menu-group .sub-menu li:first-child::after { top: 28px; }
.menu-group .sub-menu li:first-child a { margin-top: 8px; }
.menu-group .sub-menu li:last-child::before { height: 20px; }
.menu-group .sub-menu li a { display: flex; align-items: center; width: 210px; height: 40px; padding: 0 8px; opacity: 1; border-radius: 6px; box-sizing: border-box; }
.menu-group .sub-menu li a span { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t700); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-group .sub-menu li.active a { background-color: var(--clr-p200); }
.menu-group .sub-menu li a:hover span, .menu-group .sub-menu li.active a span { color: var(--txt-color-p600); }

footer { align-self: stretch; text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t300); }
footer>address { width:100%; height:20px; }
footer>address>h4 { font-size:13px; color:#a3a3a3; font-weight:500; text-align:center; line-height:20px; }

/* component */
.btn { height: 38px; line-height: 37px; font-size: 14px; color: #222; border: 1px solid #222; padding: 0 12px; }

.sp { height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd; border-radius: 0; }
.sp.on { border: 1px solid #1382f4; color: #1382f4; }
.sp.inline { width: auto; padding: 0 12px; }

.mt0 {margin-top: 0 !important;}

input { border: 1px solid rgba(0, 0, 0, 0.08); box-sizing: border-box; height: 44px; background-color: #fff; font-size: 16px; font-weight: 500; color: #333; }
input::-webkit-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; letter-spacing: -0.2px; }
input::-moz-placeholder { color: #aaa; font-size: 16px; font-weight: 400; letter-spacing: -0.2px; }
input:-ms-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; letter-spacing: -0.2px; }
input::-ms-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; letter-spacing: -0.2px; }
input::placeholder { color: #aaa; font-size: 16px; font-weight: 400; letter-spacing: -0.2px; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 500px #fff inset; }
input:focus { outline: 1px solid #1382f4; border: 0; }
input[type="radio"]:focus { outline: 0px; border: 0; }
input[readonly], input[readonly="readonly"] { background: #f9f9f9; color: #999; }

a:hover, button:hover { opacity: 0.8; }

/* ////////////////////////// */
/* ///////// 로그인 ///////// */
/* ////////////////////////// */
#login_wrap header { position: fixed; }
#login_wrap .maincontant.login { height: 100vh; margin-top: 0px;}

.maincontant.login { margin-top: 64px; width: 100vw; background: url(../../images/connectplace/common/main_bg.svg); background-size: cover; position: relative; min-width: 1400px; box-sizing: border-box; height: calc(100vh - 64px); min-height: 900px; padding-top: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0;}
.maincontant.login .maincontant__section { justify-content: space-between; gap: 100px; width: 1600px; max-width: 1920px; min-width: 1400px; margin: 0; display: flex; align-items: center; padding: 50px; box-sizing: border-box; }
.maincontant.login .maincontant__section .maincontant__section__info { width: auto; justify-content: center; padding-right: 0; height: 100%; display: flex; flex-flow: column; align-items: center; max-width: none; min-width: 0; gap: 0; flex: none; align-self: auto; }
.maincontant.login .maincontant__section .maincontant__section__info .logo {position: absolute; top: 20px; left: 30px; width: auto; height: 35px;}
.maincontant.login .maincontant__section .maincontant__section__info .logo img { display: block; height: 100%; }
.maincontant.login .maincontant__section .maincontant__section__info .login-txt p { font-size: 45px; color: #333; font-weight: 100; margin-bottom: 10px; }
.maincontant.login .maincontant__section .maincontant__section__info .login-txt h2 { font-size: 72px; color: #252525; font-weight: 600; }
.maincontant.login .maincontant__section .maincontant__section__list { width: 500px; border: 0; box-shadow: 1px 1px 10px #5a668120; -webkit-box-shadow:1px 1px 10px #5a668120; min-width: 0; display: block; align-items: stretch; flex: 0 0 auto; align-self: auto; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input { padding: 120px 75px; background-color: #fff; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input h3 { font-size: 42px; color: #222; font-weight: 600; margin-bottom: 35px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input h3 div{font-size: 18px; margin-top: 10px;}
.maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input { width: 100%; height: 60px; border: 1px solid #ddd; padding-left: 50px; font-size: 16px; box-sizing: border-box; outline: none; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input[type="text"] { background: url("../../images/connectplace/common/login_id_icon.png") no-repeat 20px 50%; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input[type="password"] { background: url("../../images/connectplace/common/login_pw_icon.png") no-repeat 20px 50%; margin-top: 20px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input:focus { outline: 0; border: 1px solid #59a7f7; box-sizing: border-box; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .idpw-link { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .idpw-link label { font-size: 14px; color: #666; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .idpw-link label input[type="checkbox"] { margin: 0 5px 0 0; vertical-align: -2px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .idpw-link a { font-size: 14px; color: #999; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .login-btn { width: 100%; height: 60px; font-size: 16px; font-weight: 600; color: #fff; margin-top: 35px; background-color: #1382f4; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .login-btn:hover { opacity: 1; background-color: none; background-image: linear-gradient(to top, #1382f5, #5aa7f7); }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .login-btn+.login-btn{ margin-top: 15px; background-color: #4c5266; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .login-btn+.login-btn:hover { background-image: linear-gradient(to top, #4c5266, #61677b); }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .or { text-align: center; position: relative; margin: 15px 0; height: 30px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .or::after { content: ""; width: 100%; height: 1px; position: absolute; top: 50%; left: 0; background: #ddd; z-index: -1; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .or span { display: inline-block; font-size: 14px; width: 90px; line-height: 30px; background: #fff; position: absolute; left: 50%; top: 50%; text-align: center; transform: translate(-50%, -50%); z-index: 1; color: #a3a3a3; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login {  margin-top: 10px; display: block; font-size: 16px; font-weight: 600; text-align: center; border: 0; background: #fff; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.15); }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login em { display: inline-block; line-height: 58px; font-size: 16px; font-weight: 600; color: #666; background: url(../../images/connectplace/common/login_google_icon.png) no-repeat 0 50%; padding-left: 25px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .microsoft-login { margin-top: 20px; display: block; font-size: 16px; font-weight: 600; text-align: center; border-radius: 0; border: 0; background: #fff; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.15);}
.maincontant.login .maincontant__section .maincontant__section__list .login-input .microsoft-login em { display: inline-block; line-height: 58px; font-size: 16px; font-weight: 600; color: #666; background: url(../../images/connectplace/common/login_microsoft_icon.svg) no-repeat 0 50%; background-size: 18px 18px; padding-left: 25px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login:hover,
.maincontant.login .maincontant__section .maincontant__section__list .login-input .microsoft-login:hover,
.maincontant.login .maincontant__section .maincontant__section__list .login-input .mz_isp_login:hover { cursor: pointer; opacity: 0.8; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login + div>a { display: inline-block; text-decoration:none !important; color: #999 !important; margin-top: 10px; }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .mz_isp_login {  margin-top: 10px; display: block; font-size: 16px; font-weight: 600; text-align: center; border: 0; background: #fff; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.15); }
.maincontant.login .maincontant__section .maincontant__section__list .login-input .mz_isp_login em { display: inline-block; line-height: 58px; font-size: 16px; font-weight: 600; color: #666; background: url(../../images/connectplace/common/login_workit_icon.svg) no-repeat 0 50%; padding-left: 25px; }

/* 로그인 - resetpassword */
.maincontant.login .maincontant__section .maincontant__section__list .login-input#div_login5{padding-top: 80px; padding-bottom: 80px;}
.maincontant.login .maincontant__section .maincontant__section__list .user_info{display: flex; flex-flow: column; align-items: center; justify-content: center;}
.maincontant.login .maincontant__section .maincontant__section__list .user_info p{color: #1382f4; width: 100%; text-align: center;}
.maincontant.login .maincontant__section .maincontant__section__list .user_info span{margin-top: 20px; font-size: 16px; line-height: 1.2; text-align: center; letter-spacing: -1.2px; font-weight: 500; color: #4c5266; white-space: nowrap;}

.maincontant.login .code_box .passcode-area {display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 25px;}
.maincontant.login .code_box .passcode-area > input {width: 40px; height: 50px; line-height: 50px; border: 1px solid rgba(0, 0, 0, .2);background-color: #fff; text-align: center; font-size: 32px;}
.maincontant.login .code_box .passcode-area > input:focus {border: 1px solid #1382f4; outline: 0; appearance: none;}
.maincontant.login .code_box>div:not(.passcode-area){display: none; font-size: 14px; font-weight: 600; width: 100%; text-align: center; letter-spacing: -0.88px; margin-top: 10px;}

.maincontant.login .resend_box{margin-top: 25px;}
.maincontant.login .resend_box ul{display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; gap: 5px;}
.maincontant.login .resend_box ul li{font-size: 14px; font-weight: 500; line-height: 1.5; white-space: nowrap;}
.maincontant.login .resend_box ul li span{color: #1382f4; margin-left: 2px;}
.maincontant.login .resend_box ul li.resendTxt{visibility: hidden;}
.maincontant.login .resend_box button{width: 100%; height: 30px; border: 1px solid rgba(0, 0, 0, .2);color: #333; font-size: 16px; font-weight: 600; background-color: #Fff;}
.maincontant.login .resend_box button:disabled{background-color: #f1f1f1; color: #777; border: 1px solid rgba(0, 0, 0, .05);}
.maincontant.login .resend_box button:disabled:hover{cursor: default; opacity: 1;}
.maincontant.login .maincontant__section .maincontant__section__list .login-input#div_login5 .login-btn{margin-top: 15px;}

/*로그인화면*/
@media (max-width: 1600px) and (min-width: 0px){
    #login_wrap .maincontant__section { width: 100%; margin: 0 auto; min-width: 1400px; max-width: 1400px; }
    .maincontant.login .maincontant__section { gap: 50px; }
    .maincontant.login .maincontant__section .maincontant__section__info .logo {height: 40px;margin-bottom: 20px; }
    .maincontant.login .maincontant__section .maincontant__section__info .login-txt p {font-size: 38px; }
    .maincontant.login .maincontant__section .maincontant__section__info .login-txt h2 {font-size: 60px; }
    .maincontant.login .maincontant__section .maincontant__section__list { width: 450px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input { padding: 80px 50px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input h3 {font-size: 35px;margin-bottom: 30px; text-align: center;}
    .maincontant.login .maincontant__section .maincontant__section__list .login-input h3 div{margin-top: 0px;}
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input {height: 60px;padding-left: 45px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input[type="text"] {background: url("../../images/connectplace/common/login_id_icon.png") no-repeat 15px 50%; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input[type="password"] {background: url("../../images/connectplace/common/login_pw_icon.png") no-repeat 15px 50%;margin-top: 15px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .input-idpw input {font-size: 15px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .login-btn {height: 60px;margin-top: 25px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login em {line-height: 60px;font-size: 15px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .microsoft-login {margin-top: 15px; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .microsoft-login em {line-height: 45px;font-size: 15px; }
    .login_section {padding: 0 210px 0 0; }
    .maincontant.login .maincontant__section .maincontant__section__list .login-input .google-login + div>a { font-size: 13px; }
    /* 로그인 - resetpassword */
    .maincontant.login .maincontant__section .maincontant__section__list .login-input#div_login5{padding-top: 60px; padding-bottom: 60px;}
}

/* 개인정보처리방침 */
.privacy-cont textarea { width: 100%; padding: 10px; box-sizing: border-box; border: 1px solid #ddd;font-size: 13px; color: #222; line-height: 24px; height: 300px; resize: none; }
.privacy-radio { margin: 10px 0 0; }
.privacy-radio .radio-design + .radio-design { margin-left: 20px; }
.radio-btn input[type="radio"] { display: none; }
.radio-btn input[type="radio"]:checked + label { color: #ff6e30; border-color: #ff6e30; }
.radio-btn label { display: inline-block; height: 36px; line-height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd; margin: 0; }

.privacy-wrap {width: 1100px;margin: 0 auto; }
.privacy-wrap .privacy-tit {font-size: 30px;color: #222;text-align: center;padding: 70px 0 20px; }
.privacy-wrap .privacy-cont {border-bottom: 1px solid #ddd;border-top: 3px solid #222;padding: 40px; }
.privacy-wrap .privacy-radio {background: #f5f5f5;padding: 20px 30px 23px;margin: 20px 0 0; }
.privacy-wrap .user-info {margin-top: 15px;text-align: right; }
.privacy-wrap .user-info span {font-size: 14px;color: #666; }
.privacy-wrap .user-info span strong {font-size: 14px;font-weight: 500;color: #222;padding-left: 20px; }
.privacy-wrap .user-info em {padding: 0 30px;color: #ddd; }

/* 메인화면 : 공지사항 팝업 */
.notice-popup-dialog.ui-dialog { padding: 0; border: 0; border-radius: 12px; overflow: hidden; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18); background: var(--clr-w100, #fff); }
.notice-popup-dialog.ui-dialog .ui-dialog-content.ui-widget-content { padding: 0; overflow: hidden; box-sizing: border-box; background: var(--clr-w100, #fff); display: flex; flex-direction: column; max-height: none !important; }
.notice-popup-dialog .notice-popup { display: flex; flex-direction: column; width: 100%; min-height: 0; background: var(--clr-w100, #fff); }
.notice-popup-dialog .ui-dialog-titlebar { display: none !important; }
.notice-popup-dialog .notice-popup__body { display: flex; padding: 28px; flex-direction: column; align-items: flex-start; gap: 24px; background: var(--clr-w100, #fff); }
.notice-popup-dialog .notice-popup__header .notice-popup__title { color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); line-height: var(--txt-line-height); }
.notice-popup-dialog .notice-popup__content { flex: 1 0 0; align-self: stretch; overflow: hidden; }
.notice-popup-dialog .notice-popup__content iframe { display: block; width: 100%; height: 100%; border: 0; background: var(--clr-w100, #fff); }
.notice-popup-dialog .notice-popup__footer { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 52px; padding: 0 20px; background: #222; box-sizing: border-box; }
.notice-popup-dialog .notice-popup__hide-today { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; font-size: var(--txt-size-14, 14px); font-weight: var(--txt-weight-regular, 400); line-height: 1; cursor: pointer; }
.notice-popup-dialog .notice-popup__hide-today-check { display: inline-block; width: 16px; height: 16px; border-radius: 4px; background: #fff; border: 1px solid #e6e9f0; box-sizing: border-box; flex-shrink: 0; }
.notice-popup-dialog .notice-popup__hide-today-text { color: var(--txt-color-t100, #FFF); font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.notice-popup-dialog .notice-popup__close { width: 24px; height: 24px; margin: 0; padding: 0; border: 0; background: transparent url("../../../figma/svg/close_white_16.svg") no-repeat center / 16px 16px; cursor: pointer; flex-shrink: 0; }
.notice-popup-dialog .notice-popup__close:hover { opacity: 0.85; }

.ui-dialog-content.ui-widget-content body{min-height: unset !important; height: 100%;}
#summernote {height: 100% !important; max-height: 550px !important; overflow: auto; padding: 10px 20px; box-sizing: border-box; color: var(--txt-color-t900, #1F1F1F); }
.notice-popup-dialog .ui-dialog-titlebar-close:hover .ui-icon, .notice-popup-dialog .ui-dialog-titlebar-close:focus .ui-icon { background-image: none; }

/* @import : _main.scss */
/* 메인 콘텐츠 */
.maincontant { position: relative; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; width: 100vw; height: calc(100vh - 64px); padding: 40px 40px 0; align-self: stretch; font-family: var(--txt-font-family); font-style: var(--txt-font-style); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); background: var(--clr-n30); gap: 80px; }
.maincontant__section { display: flex; flex-direction: column; align-items: flex-end; gap: 24px; width: 100%; max-width: 1440px; min-width: 1200px; }
.maincontant__section-content { display: flex; align-items: flex-start; gap: 24px; align-self: stretch; }
.maincontant__section__info { display: flex; flex-flow: column; align-items: flex-start;  max-width: 464px; min-width: 376px; gap: 24px; flex: 1 0 0; align-self: stretch; }

/* 매인 화면 : 사용자 로그인 정보 / 예약건수 안내 / 건물 선택 */
.maincontant__section__info--box { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; flex: 1 0 0; }
.maincontant__section__info--box .userBox { display: flex; flex-flow: column; align-items: center; justify-content: center; gap: 15px; min-width: 100px; height: 100%; }
.maincontant__section__info--box .userBox li.img {display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 100%; overflow: hidden; box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2);}
.maincontant__section__info--box .userBox li.img:hover{cursor: pointer; opacity: 0.85;}
.maincontant__section__info--box .userBox li.img img { display: block; width: 100%; height: 100%;}
.maincontant__section__info--box .userBox li.team { font-size: 15px; line-height: 28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130%; font-weight: 500; letter-spacing: -0.5px; color: #4c5266; padding: 0 10px; background-color: #eaebee; }
.maincontant__section__info--box .userBox li.name { font-size: 22px; color: #1382f4; font-weight: bold; text-align: center; }
.maincontant__section__info--box .userBox li.name span { display: block; font-size: 16px; color: #333; font-weight: 500; margin-top: 3px; text-align: center; white-space: nowrap; }
.maincontant__section__info--box .userBox2 { position: relative; width: 100%; min-width: 50%; height: 100%; padding-left: 30px; border-left: 1px dashed #b6b7bc; box-sizing: border-box; }
.maincontant__section__info--box .userBox2 .introTxt div { font-size: 24px; color: #333; font-weight: 400; letter-spacing: -1.5px; line-height: 1.4; white-space: nowrap; }
.maincontant__section__info--box .userBox2 .introTxt div span { font-size: 26px; color: #1382f4; font-weight: bold; white-space: nowrap; }
.maincontant__section__info--box .userBox2 .office_info { position: absolute; right: 0; bottom: -5px; display: flex; gap: 5px; align-items: center; }
.maincontant__section__info--box .userBox2 .office_info .ico_office { min-width: 15px; height: 15px; display: inline-block; background: url(../../images/connectplace/common/ico_office.png) no-repeat center/cover; }
.maincontant__section__info--box .userBox2 .select-box { border: 0; min-width: unset; width: auto; padding-left:5px; height: 30px; box-sizing:border-box; background-position: top 50% right 0; }
.maincontant__section__info--box .userBox2 .select-box .btn-select { min-width: 90px; box-sizing: border-box; cursor: pointer; font-size: 18px;}
.maincontant__section__info--box .userBox2 .select-box .select-list { top: 32px; left: 0; width: auto; }
.maincontant__section__info--box .userBox2 .select-box .select-list li:first-child { padding: 0 5px; height: 35px; line-height: 35px; background-color: #f0f6ff; color: #1382f4; font-size: 14px; text-align: center; }
.maincontant__section__info--box .userBox2 .select-box .select-list li:first-child:hover { cursor: default; }
.maincontant__section__info--box .userBox2 .select-box .select-list li.point button::before { display: inline-block; content: "★"; font-size: 14px; margin-right: 3px; color: #1382f4; }

.maincontant__section__info--box .userBox2 .office_info.eland{flex-flow: column; align-items: start; gap: 5px; left: 30px;}
.maincontant__section__info--box .userBox2 .office_info.eland > div:not(.select-box){display: flex; align-items: center; gap: 5px; margin-left: 5px;}
.maincontant__section__info--box .userBox2 .office_info.eland > div:not(.select-box) span{font-size: 16px; color: #4c5266; font-weight: 500; letter-spacing: -0.5px;}
.maincontant__section__info--box .userBox2 .office_info.eland .select-box{padding-left: 0; height: 40px; width: 100%; background-color: #f9f9f9; padding: 0 20px; box-sizing: border-box; background-position: right 20px top 50%;}
.maincontant__section__info--box .userBox2 .office_info.eland .select-box .btn-select{font-size: 18px; font-weight: 500; letter-spacing: 0;}
.maincontant__section__info--box .userBox2 .office_info.eland .select-box .select-list{top: 42px; width: 100%;}

.maincontant__section__info--menu { position: relative; margin: 30px 0 0; width: 100%; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; gap: 15px; min-height: 195px; box-sizing: border-box; z-index: -1; }
.maincontant__section__info--menu::after { content: ""; display: block; clear: both; }
.maincontant__section__info--menu li { float: left; width: calc((100% - 15px)/2); height: 100%; max-height: calc((100% - 15px)/2); cursor: pointer; background-image: linear-gradient(to bottom, #3695fa, #1382f4); box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1); float: unset; }
.maincontant__section__info--menu li a { display: flex; justify-content: start; align-items: center; gap: 15px; width: 100%; height: 100%; padding: 0 30px; box-sizing: border-box; font-size: 22px; font-weight: 500; color: #fff; text-align: center; word-break: keep-all; background-color: unset !important;}
.maincontant__section__info--menu li.nonBook {background-image: linear-gradient(to bottom, #30baf1, #1e9edd);}
.maincontant__section__info--menu li a.restaurantBtn { color: rgba(0, 0, 0); }

/* 메인화면 : 날씨 */
.maincontant__section__info--weather { background-color: var(--clr-w100); margin-top: 0; display: flex; justify-content: center; align-items: center; align-self: stretch; height: 120px; gap: 20px; border-radius: 12px; box-shadow: var(--ds-e200); }
.maincontant__section__info--weather dt { display: flex; align-items: center; min-height: auto; line-height: 1; gap: 3px; }
.maincontant__section__info--weather dt .weather-icon { display: block; width: 78px; height: 78px; background-repeat: no-repeat; background-position: center; background-size: contain; flex-shrink: 0; overflow: visible; }
.maincontant__section__info--weather dt .weather-icon.icon1 { background-image: url("../../images/connectplace/common/weather_icon01.png"); }
.maincontant__section__info--weather dt .weather-temp { font-size: var(--txt-size-36); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t700); letter-spacing: var(--txt-letter-spacing); }
.maincontant__section__info--weather dd { gap: 6px; }
.maincontant__section__info--weather dd p { font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); color: var(--txt-color-t700); letter-spacing: var(--txt-letter-spacing); }
.maincontant__section__info--weather dd span { font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); }
.maincontant__section__info--weather dd span strong { font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); padding-left: 8px;}

/* 메인화면 : 대시보드 head */
.maincontant__section__list { display: flex; flex-flow: column; align-items: flex-start; min-width: 800px; gap: 18px; flex: 1 0 0; align-self: stretch; }
.maincontant__section__list.line { background: none; border: 0;}

.maincontant__section__list--head .today { font-size: 24px; color: #fff; }
.maincontant__section__list--head .today strong { font-weight: 600; padding-right: 10px; }

.maincontant__section__list--head .date-btn { display: flex; justify-content: space-evenly; align-items: center; align-self: stretch; }
.maincontant__section__list--head .date-btn li button:hover{ opacity: 0.8; }
.maincontant__section__list--head .date-btn li button.on { background: #fff; color: #1382f4; border-color: #fff; font-weight: 700; cursor: default; }
.maincontant__section__list--head .date-btn li button.on:hover{opacity: 1;}
.maincontant__section__list--head .date-btn li:last-child button { min-width: 45px; }

/* 메인 화면 : 배지카운트 .badge_ct*/
/*.maincontant__section__list--head .date-btn li .badge_ct { position: absolute; cursor: pointer; right: -10px; top: -13px; height: 25px; min-width: 25px; max-width: 40px; line-height: 25px; border-radius: 12.5px; padding: 0 8px; box-sizing: border-box; text-align: center; font-size: 14px; font-weight: 600; color: #fff; background-color: #fd6e30; }*/
.maincontant__section__list--head .date-btn li .badge_ct { position: absolute; right: 16%; top: 4px; height: 5px; width: 5px; border-radius: 50%; background-color: var(--clr-p600); }
.maincontant__section__list--head.line { height: 85px; background-color: #fff;}

/* 메인 화면 : 대시보드 body */
.maincontant__section__list--body .scroll { height: 100%; padding: 0 50px; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; }
.maincontant__section__list--body.line { height:423px;}

.maincontant__section__list--body .no-data h3 { font-size: 26px; color: #222; font-weight: 500; }
.maincontant__section__list--body .no-data p { font-size: 20px; color: #666; }
.maincontant__section__list--body .no-data { height: 100%; padding-top: 330px; box-sizing:border-box; background: url("../../../figma/svg/result_empty_80.svg") no-repeat 50% 100px; background-size: 80px;}

.maincontant__section__list--body .apply-list > li .apply-info dt::after { content: ""; width: 30px; height: 30px; position: absolute; top: 50%; right: 0px; background: #fff; border-radius: 100%; z-index: 2; margin-top: -15px; background-repeat: no-repeat; border: 1px solid #59a7f7; box-sizing: border-box; background-position: center; }
.maincontant__section__list--body .apply-list > li .apply-info dt::before { content: ""; height: 80px; border-left: 1px dashed #ddd; position: absolute; bottom: 38px; right: 15px; z-index: 1; }
.maincontant__section__list--body .apply-list > li .apply-info dt strong { color: #222; font-weight: 600; white-space: nowrap;}
.maincontant__section__list--body .apply-list > li .apply-info dd .apply { flex: 1; display: flex; flex-flow: column;width: auto; gap: 7px; }
.maincontant__section__list--body .apply-list > li .apply-info dd .apply h4 { line-height: 1; color: #969CB0; font-size: 14px; font-weight: 400; }
.maincontant__section__list--body .apply-list > li .apply-info dd .apply h4 strong { margin-right: 10px; line-height: 1; color: #151515; font-size: 18px; font-weight: 600;}
.maincontant__section__list--body .apply-list > li .apply-info dd .state.checkout,
.maincontant__section__list--body .apply-list > li .apply-info dd .state.approval { background: #1382f4; color: #fff; border: 1px solid #1382f4; transition: all 0.3s; }
.maincontant__section__list--body .apply-list > li .apply-info dd .state.checkout:hover,
.maincontant__section__list--body .apply-list > li .apply-info dd .state.approval:hover { background-image: linear-gradient(to top, #1382f5, #3695fa); box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow:0px 8px 7px 0 rgba(0, 0, 0, 0.02); transition: all 0.1s; border-color: #3695fa; opacity: 1; }
.maincontant__section__list--body .apply-list > li .apply-info dd .state.checkin { background: #06315f; color: #fff; border: 1px solid #06315f; }
.maincontant__section__list--body .apply-list > li .apply-info dd .state.checkin:hover { background-image: linear-gradient(to top, #06315f, #0c4786); box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow:0px 8px 7px 0 rgba(0, 0, 0, 0.02); transition: all 0.1s; border-color: #0c4786; opacity: 1; }
.maincontant__section__list--body .apply-list > li .apply-info dd .btn-wrap { text-align: right; }
.maincontant__section__list--body .apply-list > li:first-child .apply-info dt::before { display: none; }
/*좌석*/.maincontant__section__list--body .apply-list > li.seat .apply-info dt::after { background-image: url(../../images/connectplace/common/bn_icon01_B.png); background-size:12px; }
/*반복 좌석*/.maincontant__section__list--body .apply-list > li.seat.recurring .apply-info dd .apply p { padding-left: 20px; box-sizing: border-box; background-image: url(../../images/connectplace/common/icon_recurring.png); background-repeat: no-repeat; background-position: left center; background-size: 16px; }
/*회의실*/.maincontant__section__list--body .apply-list > li.meet .apply-info dt::after { background-image: url(../../images/connectplace/common/bn_icon02_B.png); background-size: 17px }
/*반복 회의*/.maincontant__section__list--body .apply-list > li.meet.recurring .apply-info dd .apply p { padding-left: 20px; box-sizing: border-box; background-image: url(../../images/connectplace/common/icon_recurring.png); background-repeat: no-repeat; background-position: left center; background-size: 16px; }
/*방문*/.maincontant__section__list--body .apply-list > li.visit .apply-info dt::after { background-image: url(../../images/connectplace/common/bn_icon03_B.png); background-size: 18px; }
/*컨디셔닝*/.maincontant__section__list--body .apply-list > li.condition .apply-info dt::after { background-image: url(../../images/connectplace/common/bn_icon04_B.png); background-size:17px; }
/*수면캡슐*/.maincontant__section__list--body .apply-list > li.sleep .apply-info dt::after { background-image: url(../../images/connectplace/common/bn_icon05_B.png); background-size: 17px }

/* 메인 화면 : 대시보드 - 락커예약 표시 */
.locker-data {display: flex;flex-flow: row nowrap;align-items: center;justify-content: space-between;width: 100%;height: 60px;margin: 0 auto;padding: 0 50px;margin-top: 0;background-color: #f9f9f9; box-shadow: 1px 1px 5px #5a668140; -webkit-box-shadow:1px 1px 5px #5a668140;box-sizing: border-box; }
.locker-data .info-box { display: flex; flex-flow: row nowrap; align-items: center; justify-content: start; height: 100%;font-size: 18px; font-weight: 600; color: #353535; transform: skew(-0.1deg); white-space: nowrap;cursor: pointer; }
.locker-data .info-box .name { font-size: 22px; font-weight: bold; color: #008aff; margin-left: 10px; line-height: 60px; white-space: nowrap;font-weight: 600; }
.locker-data .info-box .location { display: inline-block; width: auto; min-width: 50px; max-width: 116px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 15px; font-weight: 500; color: #5a6681; margin-left: 5px; letter-spacing: -0.5px; transform: skew(-0.1deg); }
.locker-data .info-box .location::before { display: inline-block; content: "·"; margin: 0 5px 0 0; color: #5a6681; }
.locker-data .info-box .date { display: flex; flex-flow: row nowrap; align-items: center; white-space: nowrap; font-size: 15px; font-weight: 500; color: #5a6681; margin-left: 5px; letter-spacing: -0.5px; transform: skew(-0.1deg); }
.locker-data .info-box .date::before { display: inline-block; content: ""; width: 1px; height: 12px; margin: 0 7px 0 3px; background: #666; }
.locker-data .info-box .end { color: #353535; font-weight: 600; }
.locker-data .info-box .day {display: inline-block;margin-left: 5px;color: #353535;font-weight: 500;font-size: 15px; }
.locker-data .info-box .day.red {color: #f41c24;}
.locker-data .return-btn {width: 100px; height: 34px; background-color: #5a6681;text-align: center;line-height: 34px;font-size: 14px;color: #fff;cursor: pointer; font-weight: 500; }
.locker-data .return-btn:hover { opacity: 0.85; }

@media (max-width: 1600px) and (min-width: 0px) {
    /*전체크기 1600*/
    /* 매인 화면 : 사용자 로그인 정보 / 예약건수 안내 / 건물 선택 1600*/
    .maincontant__section__info--box .userBox { gap: 10px; min-width: 120px;}
    .maincontant__section__info--box .userBox li.img { width: 65px; height: 65px; }
    .maincontant__section__info--box .userBox li.name { font-size: 20px; }
    .maincontant__section__info--box .userBox2 { padding-left: 20px; }
    .maincontant__section__info--box .userBox2 .introTxt div { font-size: 20px; }
    .maincontant__section__info--box .userBox2 .introTxt div span { font-size: 24px; }
    .maincontant__section__info--box .userBox2 .select-box .btn-select{font-size: 17px;}
    .maincontant__section__info--box .userBox2 .select_area .select_box { font-size: 16px; }

    .maincontant__section__info--box .userBox2 .office_info.eland{ left: 20px;}
    .maincontant__section__info--box .userBox2 .office_info.eland > div:not(.select-box) span{font-size: 15px;}
    .maincontant__section__info--box .userBox2 .office_info.eland .select-box{height: 38px; padding: 0 15px;background-position: right 15px top 50%;}
    .maincontant__section__info--box .userBox2 .office_info.eland .select-box .btn-select{font-size: 17px; padding-right: 20px; box-sizing: border-box;}
    .maincontant__section__info--box .userBox2 .office_info.eland .select-box .select-list{top: 40px;}

    /*회의실 예약, 방문자 예약 버튼*/
    .maincontant__section__info--menu {margin: 25px -5px 0; }
    .maincontant__section__info--menu li a {padding: 0;font-size: 15px}

    /* 메인 화면 : 대시보드 1600 */
    .maincontant__section__list--head,
    .maincontant__section__list--head.line { height: 60px; padding: 0px 40px; }
    .maincontant__section__list--head .today,
    .maincontant__section__list--head.line .today { font-size: 18px; }

    .maincontant__section__list--body .apply-list > li .apply-info { justify-content: space-between; }
    .maincontant__section__list--body .apply-list > li .apply-info dd .apply h4 {font-size: 18px; font-weight: 500; }

    .maincontant__section__list--body {height: 490px; padding-bottom: 0;}
    .maincontant__section__list--body.line { height: 365px;}

    .maincontant__section__list--body.locker .scroll { height: calc(100% - 50px);}

    .maincontant__section__list--body.line .no-data { height: 100%; padding-top: 240px; box-sizing:border-box; background: url("../../images/connectplace/common/nodata_img.png") no-repeat 50% 50px/250px; }
    .maincontant__section__list--body.locker .no-data { height: 100%; padding-top: 280px; box-sizing:border-box; background: url("../../images/connectplace/common/nodata_img.png") no-repeat 50% 80px/250px; }
    .maincontant__section__list--body.line.locker .no-data { height: 100%; padding-top: 220px; box-sizing:border-box; background: url("../../images/connectplace/common/nodata_img.png") no-repeat 50% 30px/250px; }

    /* 메인 화면 : 대시보드 - 락커예약 표시 1600*/
    .locker-data { width: 100%; height: 50px; padding: 0 40px; margin-top: 0; }
    .locker-data .info-box { font-size: 18px; }
    .locker-data .info-box { font-size: 18px; }.maincontant__section__list--body .apply-list > li .apply-info dd 
    .locker-data .info-box .name { font-size: 18px; margin-left: 10px; line-height: 50px; }
    .locker-data .info-box .location, .locker-data .info-box .date, .locker-data .info-box .day { font-size: 14px; margin-left: 5px; max-width: unset; }
    .locker-data .info-box .location::before { margin: 0 3px 0 0; }
    .locker-data .info-box .date { letter-spacing: 0px; }
    .locker-data .info-box .date::before { margin: 0 5px 0 3px; }
    .locker-data .return-btn { width: 80px; height: 34px; line-height: 34px; font-size: 14px; }
}

@media (max-height: 760px) and (min-height: 0){
    .maincontant{ min-height: unset;}
    /* --- CSS4 설정(:not) 별도 분리 ---
    .maincontant__section:not(.maincontant.login .maincontant__section){min-height: unset; height: auto; margin-top: 95px;}*/
}
/* 서브메뉴 미오픈 디자인 */
.maincontant__section__list--submenu .submenu_inner li.unusable, .maincontant__section__list--submenu .submenu_inner li.unusable img, .maincontant__section__list--submenu .submenu_inner li.unusable span {opacity: 0.5 !important;cursor: inherit; }
.maincontant__section__list--submenu .submenu_inner li.unusable:hover, .maincontant__section__list--submenu .submenu_inner li.unusable img:hover, .maincontant__section__list--submenu .submenu_inner li.unusable span {opacity: 0.5 !important;cursor: inherit; }

/* 서비스 가입 */
.maincontant .maincontant__section .maincontant__section__list .subscription-input { position: relative; padding: 30px 40px; margin-top: 1%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input h3 { font-size: 32px; text-align: center; color: #222; font-weight: 600; margin-bottom: 15px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input h5 { font-size: 15px; text-align: center; color: #555; font-weight: 400; margin-bottom: 20px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info { display: flex; flex-flow: row nowrap; width: 100%; padding: 15px 40px; margin-bottom: 10px; box-sizing: border-box; border-top: 2px solid #f2f2f2; border-bottom: 2px solid #f2f2f2; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info .info { font-size: 14px; margin-left: 30px; line-height: 22px; color: #000; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info .info .company > span { color: red; font-weight: 500; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info .info .name { color: #000; font-weight: 500; font-size: 16px; }

.subscription-input, .subscription-input .input-dept { margin-top: 2%; }
.subscription-input, .subscription-input .input-title-job { margin-top: 3%; }
.subscription-input, .subscription-input .input-pw, .subscription-input .input-pw-box .pw-box:nth-child(2) { margin-top: 3%; }

.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title { display: inline-block; width: 15%; font-size: 15px; line-height: 40px; color: #000; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone select:nth-child(3) { width: 24%; margin-right: 2%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone input:nth-child(4) { width: 23%; height: 40px; margin-left: 1%; margin-right: 2%; border: 1px solid #ddd; border-radius: 5px; text-align: center; font-size: 15px; box-sizing: border-box; outline: none; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone input:nth-child(5) { width: 23%; height: 40px; margin-left: 1%; border: 1px solid #ddd; border-radius: 5px; text-align: center; font-size: 15px; box-sizing: border-box; outline: none; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input select { width: 80%; height: 40px; margin-left: 3%; border: 1px solid #ddd; border-radius: 5px; padding-left: 15px; padding-right: 15px; font-size: 16px; box-sizing: border-box; outline: none; background-image: url("../../images/connectplace/common/select_arrows.png"); background-repeat: no-repeat; background-position: right 10px top 50%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title-job .select-title { width: 39%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title-job .select-job { width: 39%; margin-left: 1%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw { display: flex; flex-flow: row nowrap; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .input-pw-box { width: 80%; margin-left: 3.8%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .pw-box { position: relative; width: 100%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .pw-box input { width: 100%; height: 40px; border: 1px solid #ddd; border-radius: 5px; padding-left: 15px; font-size: 16px; box-sizing: border-box; outline: none; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .input-pw-box .pw-box .display { position: absolute; top: 13px; right: 10px; width: 22px; height: 16px; background-image: url(../../images/connectplace/intro/display_off_btn.png); background-repeat: no-repeat; background-size: contain; background-position: center; cursor: pointer; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .msg_box { margin: 5px 0; font-size: 13px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .msg_box div { display: none; color: #00b200; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .msg_box div.wrong { color: #ea0000; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .input-pw-box .pw-box .display.on { background-image: url(../../images/connectplace/intro/display_on_btn.png); }
.maincontant .maincontant__section .maincontant__section__list .subscription-input input:focus { border: 1px solid #ff6e30; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .sebscription-btn { width: 100%; height: 60px; font-size: 16px; font-weight: 600; color: #fff; border-radius: 60px; background: #000; margin-top: 20px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree { margin-top: 10px; padding-top: 10px; border-top: 1px solid #efefef; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title { clear: both; display: flex; flex-flow: row nowrap; justify-content: space-between; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title .check_box { display: flex; flex-flow: row nowrap; justify-content: start; align-items: center; line-height: 20px; margin: 10px 0 5px; font-size: 15px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title .check_box input { display: none; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title .check_box input + label:before { content: ""; display: inline-block; width: 18px; height: 18px; margin-right: 10px; background-image: url(../../images/connectplace/intro/check_off_btn.png); background-repeat: no-repeat; background-size: contain; vertical-align: middle; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title .check_box input:checked + label:before { background-image: url(../../images/connectplace/intro/check_on_btn.png); }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title img { display: block; width: 8px; height: 13px; margin-top: 10px; padding-top: 3px; cursor: pointer; padding-left: 10px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail { position: absolute; display: none; top: 0; left: 0; width: 100%; height: 100%; padding: 30px 40px; box-sizing: border-box; background-color: #fff; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .back_btn { float: left; width: 20px; height: 30px; margin-bottom: 10px; cursor: pointer; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .back_btn > img { display: inline-block; height: 20px; margin-top: 5px; padding-top: 5px; padding-right: 10px; box-sizing: border-box; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .title { height: 30px; text-align: center; font-size: 18px; line-height: 30px; color: #222; font-weight: 600; margin-bottom: 10px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct { clear: both; width: 95%; height: 87%; font-size: 13px; padding: 10px; overflow: auto; border: 1px solid #efefef; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct::-webkit-scrollbar { width: 4px; height: 4px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct::-webkit-scrollbar-thumb { background-color: #ccc; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct::-webkit-scrollbar-track { background-color: #fff; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct p { line-height: 1.5em; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct p.bold { font-weight: bold; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct p.left10 { margin-left: 10px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table { margin: 5px 0; border: 1px solid #aaa; font-size: 12px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table thead tr { font-weight: 500; font-size: 12px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table tr { border-bottom: 1px solid #aaa; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table td { padding-left: 5px; border-right: 1px solid #aaa; font-size: 12px; }

/* 서비스 가입완료 */
.maincontant .maincontant__section .maincontant__section__list .subscription-input02 { padding: 50px 50px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input02 h3 { font-size: 40px; text-align: center; color: #222; font-weight: 600; line-height: 50px; margin-bottom: 50px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input02 h5 { font-size: 16px; text-align: center; color: #555; font-weight: 400; line-height:30px; margin-bottom:50px; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input02 .complete-img { width: 100%; }
.maincontant .maincontant__section .maincontant__section__list .subscription-input02 .sebscription-btn02 { width: 100%; height: 60px; font-size: 16px; font-weight: 600; color: #fff; border-radius: 60px; background: #000; margin-top: 45px; }


@media(max-width:1600px) and (min-width:0) {
    /* 서비스 가입 1600px */
    .maincontant__section.maincontant__section__join {min-width: 1250px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input {padding: 4.5% 7%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input h3 {font-size: 28px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input h5 {font-size: 14px;margin-bottom: 15px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info {padding: 12px 30px;border-top: 1px solid #F2F2F2;border-bottom: 1px solid #F2F2F2; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info .info {font-size: 13px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .user-info .info .name {font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title {width: 17%;margin-left: 5px;font-size: 14px;line-height: 30px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone select:nth-child(3) {width: 20%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone input:nth-child(4) {font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-phone input:nth-child(5) {font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input select {width: 77%;font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title-job .select-title {width: 37%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-title-job .select-job {width: 38%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .pw-box {width: 97%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .pw-box input {font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-pw .input-pw-box .pw-box .display {top: 12px;right: 12px;width: 20px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .sebscription-btn {width: 90%;height: 48px;font-size: 15px;margin-left: 5%;margin-top: 10px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree {margin-top: 7px;padding-top: 7px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .input-title2 {font-size: 15px;height: 20px;line-height: 20px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .input-title2 > span {font-size: 12px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .check_box {height: 20px;line-height: 20px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .check_box input + label:before {width: 16px;height: 16px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-title .title {font-size: 14px;margin: 7px 0 5px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail {max-width: 450px;padding: 4.5% 7%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .back_btn {height: 25px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .title {height: 25px;font-size: 16px;line-height: 25px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct {height: 88%; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table {font-size: 10px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table thead tr {font-size: 10px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input .input-agree .agree-detail .agree-ct table td {font-size: 10px; }

    /* 서비스 가입 완료 1600px */
    .maincontant .maincontant__section .maincontant__section__list .subscription-input02 {padding: 40px 40px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input02 h3 {font-size: 34px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input02 h5 {font-size: 14px; }
    .maincontant .maincontant__section .maincontant__section__list .subscription-input02 .complete-img > img {width: 100%; }
}

/* timepicker 위치 고정 */
.calendar-wrap .ui-datepicker,
.time-select-wrap .ui-timepicker-container { top: unset !important; left: unset !important;}

/* .unsetDatepicker 날짜 선택 불가능(당일예약) */
/* 팝업 날짜 선택 불가능 */
.unsetDatepicker .pop-desk-input.datepicker:disabled{width: 227px; opacity: 1; background-color: transparent !important; padding-left: 10px;}
.unsetDatepicker .pop-desk-date-box .calendar-wrap{margin-right: 0;}
.unsetDatepicker .time-select-wrap select + span{margin: 0 3px;}

/* 좌석예약 수정 팝업(시간단위 예약 수정) */
/* .layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box.unsetDatepicker {gap: 15px;} */
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box.unsetDatepicker .time-select-wrap,
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box.unsetDatepicker .ui-selectmenu-button.ui-button{ width: 100%; }
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box.unsetDatepicker .time-select-wrap select + span{margin: 0;}

/* 예약 내역 */
.booking-list-inner { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; width: 100%; height: 100%; padding: 36px 40px; }
.booking-list-header { display: flex; width: 100%; height: 38px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-list-header h1 { height: 30px; line-height: 30px; font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); letter-spacing: -0.4px; }

.booking-list-body { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; width: 100%; }
.booking-list-body .tab-menu { display: flex; align-items: center; gap: 8px; }
.booking-list-body .tab-menu li {  position: relative; display: flex; align-items: center; justify-content: center; min-width: 80px; height: 52px; padding: 15px 16px; }
.booking-list-body .tab-menu li a { font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70); letter-spacing: -0.32px; }
.booking-list-body .tab-menu li a:hover { color: var(--txt-color-p600); opacity: 1; }
.booking-list-body .tab-menu li.active a { color: var(--txt-color-p600); }
.booking-list-body .tab-menu li:not(:last-child)::after { position: absolute; right: -4.5px; content: ""; width: 1px; height: 14px; background: url("/figma/svg/tab_ghost_line.svg") no-repeat center / contain; flex-shrink: 0; pointer-events: none; }

/* 예약 내역 - 좌석/회의실/방문 예약 내역 */
.booking-list-wrap { display: flex; align-items: flex-start; align-self: stretch; gap: 24px; width: 100%; }
.booking-list-box { display: flex; flex-direction: column; align-items: center; flex: 1 0 0; min-width: 550px; border: 1px solid var(--clr-w300); border-radius: 12px; box-sizing: border-box; }
.booking-list-box.hidden { display: none; }
.booking-list-filter-box { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; width: 100%; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-list-filter-box .title-box { display: flex; align-items: center; min-width: 180px; gap: 12px; flex: 1 0 0; }
.booking-list-filter-box .title-box h1 { font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; }
.booking-list-filter-box .title-box .total-txt { display: flex; gap: 4px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-list-filter-box .title-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.booking-list-filter { display: flex; gap: 8px; flex-wrap: wrap; }
.booking-list-filter .cp-date-range-picker[cp-view-type="combined"] .cp-drp-inputs { width: 265px !important; }
.booking-list-filter .btn-reset { display: flex; gap: 4px; }
.booking-list-filter .btn-reset::before { content: ""; width: 16px; height: 16px; background: url("/figma/svg/refresh_black_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-list { display: table; width: 100%; table-layout: fixed; }
.booking-list thead th { height: 44px; padding: 0 12px; background-color: var(--clr-w200); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-list thead th:first-child, .booking-list tbody td:first-child { padding-left: 24px; text-align: center; }
.booking-list thead th:last-child, .booking-list tbody td:last-child { padding-right: 24px; }
.booking-list tbody tr:hover { background-color: var(--clr-p100); cursor: pointer; }
.booking-list tbody tr.active { background-color: var(--clr-p100); }
.booking-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-list tbody td .name { display: flex; gap: 4px; align-items: center; }
.booking-list tbody td .name .badge { display: inline-flex; align-items: center; justify-content: center; height: 20px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-t100); padding: 0 8px; background-color: var(--clr-w800); border-radius: 4px; }
.booking-list tbody td .name .title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-list tbody td .name .icon-recurring { width: 14px; height: 14px; background: url("/figma/svg/repeat_lightgray_14.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-list tbody td > .badge { display: inline-flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); letter-spacing: -0.24px; border-radius: 4px; box-sizing: border-box; }
.booking-list tbody td > .badge.use { color: var(--clr-g900); background-color: var(--clr-g000); }
.booking-list tbody td > .badge.resv { color: var(--clr-y900); background-color: var(--clr-y100); }
.booking-list tbody td > .badge.no-show { color: var(--clr-r900); background-color: var(--clr-r000); }
.booking-list tbody td > .badge.end { color: var(--clr-n400); background-color: var(--clr-n30); }

/* 예약 내역 - 좌석/회의실/방문 상세 정보 */
.booking-detailed-box { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; min-width: 0; height: calc(100vh - 242px); max-height: 850px; border-radius: 12px; border: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-detailed-box.hidden { display: none; }
.booking-detailed-box .title-box { display: flex; align-items: center; width: 100%; padding: 20px 24px; border-bottom: 1px solid var(--clr-w300); }
.booking-detailed-box .title-box h1 { line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; }
.booking-detailed-box .booking-info-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; flex: 1 0 0; width: 100%; padding: 24px 24px 0 24px; overflow-y: auto; }
.booking-detailed-box .booking-info-box .title { display: flex; align-items: center; align-self: stretch; gap: 12px; line-height: 30px; }
.booking-detailed-box .booking-info-box .title .name { font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.4px; }
.booking-detailed-box .booking-info-box .title .badge { display: inline-flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; line-height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); letter-spacing: -0.24px; border-radius: 4px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .title .badge.use { color: var(--clr-g900); background-color: var(--clr-g000); }
.booking-detailed-box .booking-info-box .title .badge.resv { color: var(--clr-y900); background-color: var(--clr-y100); }
.booking-detailed-box .booking-info-box .title .badge.no-show { color: var(--clr-r900); background-color: var(--clr-r000); }
.booking-detailed-box .booking-info-box .title .badge.end { color: var(--clr-n400); background-color: var(--clr-n30); }
.booking-detailed-box .booking-info-box .basic-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-detailed-box .booking-info-box .basic-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .basic-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding: 16px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-detailed-box .booking-info-box .basic-info .info .row { display: flex; align-items: flex-start; align-content: flex-start; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-detailed-box .booking-info-box .basic-info .info .row:nth-child(3) { align-items: center; align-content: center; }
.booking-detailed-box .booking-info-box .basic-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .basic-info .info .row .location { flex: 1 0 0; width: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .basic-info .info .row .type { display: flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; line-height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); letter-spacing: -0.24px; background-color: var(--clr-w100); border: 1px solid var(--txt-color-p600); border-radius: 4px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .basic-info .info .row .device { display: flex; align-items: center; align-content: center; flex: 1 0 0; flex-wrap: wrap; gap: 4px; }
.booking-detailed-box .booking-info-box .basic-info .info .row .device .badge { display: flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; line-height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t300); letter-spacing: -0.24px; border: 1px solid var(--clr-w400); border-radius: 4px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .booking-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-detailed-box .booking-info-box .booking-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .booking-info .info { position: relative; display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding: 16px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .booking-info .visit.info { gap: 8px; }
.booking-detailed-box .booking-info-box .booking-info .info .row { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .booking-info .info .row > .name { flex: 1 0 0; width: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .booking-info .info .row .datetime { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .memo { flex: 1 0 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; word-break: break-all; overflow-wrap: break-word; white-space: pre-wrap; }
.booking-detailed-box .booking-info-box .booking-info .info .row .btn-video-metting { display: flex; gap: 4px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .btn-video-metting.ms_teams::before { content: ""; width: 16px; height: 16px; background: url("/figma/svg/teams_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-detailed-box .booking-info-box .booking-info .info .row .btn-video-metting.webex::before { content: ""; width: 16px; height: 16px; background: url("/figma/svg/webex_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-detailed-box .booking-info-box .booking-info .info .row .btn-video-metting.g_meets::before { content: ""; width: 16px; height: 16px; background: url("/figma/svg/google_meet_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box { display: flex; align-items: center; align-content: center; gap: 8px 16px; flex: 1 0 0; flex-wrap: wrap; min-width: 250px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-info { display: flex; align-items: center; justify-content: center; gap: 8px; flex: 1 0 0; width: 0; height: 36px; padding: 12px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-info .icon-recurring { width: 16px; height: 16px; background: url("/figma/svg/repeat_lightgray_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-info span { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn { display: flex; align-items: center; gap: 8px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn .tooltip .btn-edit { display: flex; width: 36px; height: 36px; background: url("/figma/svg/edit_black_16.svg") no-repeat center / 16px 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn .tooltip .btn-delete { display: flex; width: 36px; height: 36px; background: url("/figma/svg/delete_black_16.svg") no-repeat center / 16px 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-detailed-box .booking-info-box .booking-info .info .row .recurring-info-box .recurring-btn .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user { display: flex; align-items: center; gap: 8px; flex: 1 0 0; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.28px; background-color: var(--clr-n80); border-radius: 50%; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .name { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .tooltip { position: absolute; right: 16px; bottom: 16px; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .tooltip .btn-detailed { display: flex; width: 36px; height: 36px; background: url("/figma/svg/viewdetail_black_16.svg") no-repeat center / 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-detailed-box .booking-info-box .booking-info .info .row .user .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-detailed-box .booking-info-box .applicant-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-detailed-box .booking-info-box .applicant-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .applicant-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; padding: 16px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-detailed-box .booking-info-box .applicant-info .info .row { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-detailed-box .booking-info-box .applicant-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .applicant-info .info .row .name { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .applicant-info .info .row .col { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.booking-detailed-box .booking-info-box .interviewer-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-detailed-box .booking-info-box .interviewer-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .interviewer-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; padding: 16px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .interviewer-info .info .row { display: flex; align-items: center; align-self: stretch; gap: 12px; line-height: 21px; }
.booking-detailed-box .booking-info-box .interviewer-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .interviewer-info .info .row .name { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .user-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-detailed-box .booking-info-box .user-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .user-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; padding: 16px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .user-info .info .row { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-detailed-box .booking-info-box .user-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .user-info .info .row .name { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-detailed-box .booking-info-box .user-info .info .row .col { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.booking-detailed-box .booking-info-box .map-img-box { display: flex; align-items: flex-start; align-content: flex-start; align-self: stretch; gap: 16px; flex-wrap: wrap; }
.booking-detailed-box .booking-info-box .map-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; min-width: 312px; }
.booking-detailed-box .booking-info-box .map-info .sub-title { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .map-info .info { display: flex; width: 100%; height: 282px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .map-info .info iframe { width: 100%; height: 100%; border-radius: 6px; }
.booking-detailed-box .booking-info-box .map-info .info-empty { display: flex; align-items: center; justify-content: center; width: 100%; height: 282px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .map-info .info-empty .map-empty-box { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.booking-detailed-box .booking-info-box .map-info .info-empty .map-empty-box div { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; padding: 20px; background-color: var(--clr-w400); aspect-ratio: 1/1; opacity: 0.6; border-radius: 12px; }
.booking-detailed-box .booking-info-box .map-info .info-empty .map-empty-box div .icon-map-empty { width: 40px; height: 40px; background: url("/figma/svg/subtract_white.svg") no-repeat center; opacity: 0.8; }
.booking-detailed-box .booking-info-box .map-info .info-empty .map-empty-box span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .img-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; min-width: 312px; }
.booking-detailed-box .booking-info-box .img-info .sub-title { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .img-info .info { display: flex; width: 100%; height: 282px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .img-info .info img { width: 100%; height: 100%; border-radius: 6px; }
.booking-detailed-box .booking-info-box .img-info .info-empty { display: flex; align-items: center; justify-content: center; width: 100%; height: 282px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .img-info .info-empty .img-empty-box { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.booking-detailed-box .booking-info-box .img-info .info-empty .img-empty-box div { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; padding: 20px; background-color: var(--clr-w400); aspect-ratio: 1/1; opacity: 0.6; border-radius: 12px; }
.booking-detailed-box .booking-info-box .img-info .info-empty .img-empty-box div .icon-img-empty { width: 40px; height: 40px; background: url("/figma/svg/img_white.svg") no-repeat center; opacity: 0.8; }
.booking-detailed-box .booking-info-box .img-info .info-empty .img-empty-box span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .visitor-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; width: 100%; }
.booking-detailed-box .booking-info-box .visitor-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box { display: flex; align-items: center; align-self: stretch; gap: 16px; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .total-txt { display: flex; align-items: center; gap: 4px; flex: 1 0 0; height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter > span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box { width: 100%; overflow-x: auto; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list { display: table; table-layout: fixed; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th { position: sticky; top: 0; height: 44px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; z-index: 10; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th:first-child, .booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td:first-child { padding-left: 24px; text-align: center; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th:last-child, .booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td:last-child { padding-right: 24px; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody tr:last-child td { border-bottom: 0; }
.booking-detailed-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list .custom-checkbox-wrap input[type="checkbox"] { display: none; }
.booking-detailed-box .booking-btn-box { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; align-self: stretch; padding: 24px; }
.booking-detailed-box .booking-btn-box .booking-btn { display: flex; align-items: center; justify-content: space-between; align-self: stretch; }
.booking-detailed-box .booking-btn-box .booking-btn > div { display: flex; align-items: center; gap: 8px; }
.booking-detailed-box .booking-btn-box .booking-btn button { min-width: 80px; }
.booking-detailed-box .booking-btn-box .booking-btn .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-detailed-box .booking-btn-box .booking-btn .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-detailed-box .booking-btn-box .booking-btn .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }

/* 예약 내역 - 참석자 정보 팝업 */
.layer-pop-area.attendeeInfo .pop-cont { border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.layer-pop-area.attendeeInfo .pop-cont .title-box { display: flex; align-items: center; align-self: stretch; gap: 12px; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-area.attendeeInfo .pop-cont .title-box h1 { flex: 1 0 0; line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.layer-pop-area.attendeeInfo .pop-cont .title-box .total-txt { display: flex; gap: 4px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.layer-pop-area.attendeeInfo .pop-cont .title-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.attendee-list { display: table; width: 100%; table-layout: fixed; }
.attendee-list thead th { position: sticky; top: 0; height: 44px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; z-index: 10; }
.attendee-list thead th:first-child, .attendee-list tbody td:first-child { padding-left: 24px; text-align: center; }
.attendee-list thead th:last-child, .attendee-list tbody td:last-child { padding-right: 24px; }
.attendee-list-box { max-height: 384px; overflow-y: auto; }
.attendee-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.attendee-list tbody tr:last-child td { border-bottom: 0; }
.attendee-list tbody td .icon-organizer { display: inline-block; width: 16px; height: 16px; background: url("/figma/svg/admin_yellow_16.svg") no-repeat center / contain; }
.attendee-list tbody td .user { display: flex; gap: 8px; }
.attendee-list tbody td .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.attendee-list tbody td .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.attendee-list tbody td .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); }
.attendee-list tbody td .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.attendee-list tbody td .user .name { line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 예약 수정 */
.booking-edit-box { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; min-width: 0; height: calc(100vh - 242px); max-height: 850px; border-radius: 12px; border: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-edit-box.hidden { display: none; }
.booking-edit-box .title-box { display: flex; align-items: center; width: 100%; padding: 20px 24px; border-bottom: 1px solid var(--clr-w300); }
.booking-edit-box .title-box h1 { line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; }
.booking-edit-box .booking-info-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; flex: 1 0 0; width: 100%; padding: 24px 24px 0 24px; overflow-y: auto; }
.booking-edit-box .booking-info-box .title { line-height: 30px; font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.4px; }
.booking-edit-box .booking-info-box .basic-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-info-box .basic-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-edit-box .booking-info-box .basic-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding: 16px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-edit-box .booking-info-box .basic-info .info .row { display: flex; align-items: flex-start; align-content: flex-start; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-edit-box .booking-info-box .basic-info .info .row:nth-child(3) { align-items: center; align-content: center; }
.booking-edit-box .booking-info-box .basic-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .basic-info .info .row .location { flex: 1 0 0; width: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-edit-box .booking-info-box .basic-info .info .row .type { display: flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; line-height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); letter-spacing: -0.24px; background-color: var(--clr-w100); border: 1px solid var(--txt-color-p600); border-radius: 4px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .basic-info .info .row .device { display: flex; align-items: center; align-content: center; flex: 1 0 0; flex-wrap: wrap; gap: 4px; }
.booking-edit-box .booking-info-box .basic-info .info .row .device .badge { display: flex; align-items: center; justify-content: center; min-width: 50px; height: 20px; line-height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t300); letter-spacing: -0.24px; border: 1px solid var(--clr-w400); border-radius: 4px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .booking-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-edit-box .booking-info-box .booking-info .info { position: relative; display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding: 16px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .booking-info .visit.info { gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .info .row { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-edit-box .booking-info-box .booking-info .info .row.two { align-items: flex-start; align-content: flex-start; line-height: 36px; }
@media (max-width: 1280px) { .booking-edit-box .booking-info-box .booking-info .info .row.two { line-height: 21px; } }
.booking-edit-box .booking-info-box .booking-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group { display: flex; align-items: flex-start; align-content: flex-start; flex: 1 0 0; flex-wrap: wrap; gap: 8px 12px; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group .name-box { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group .checkbox { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; flex: 1 0 0; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group .checkbox.tooltip .tooltip-text { position: absolute; bottom: 100%; display: flex; align-items: center; justify-content: center; width: 250px; line-height: 18px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group .checkbox.tooltip .tooltip-text::after { position: absolute; top: 100%; right: 12px; content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-edit-box .booking-info-box .booking-info .info .row .name-group .checkbox.tooltip input:disabled + label:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-edit-box .booking-info-box .booking-info .info .row .time { display: flex; align-items: center; width: 280px; }
.booking-edit-box .booking-info-box .booking-info .info .row .time .time-select-wrap { width: 132px; }
.booking-edit-box .booking-info-box .booking-info .info .row .tilde { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 16px; height: 36px; flex-shrink: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .return { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .datetime { display: flex; align-items: center; gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .info .row .datetime .time-select-wrap { width: 120px; }
.booking-edit-box .booking-info-box .booking-info .info .row .datetime .tilde { margin: 0 -8px; }
.booking-edit-box .booking-info-box .booking-info .info .row .location { display: flex; align-items: center; gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .info .row textarea { display: flex; align-items: flex-start; width: 280px; height: 100px; padding: 16px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; border: 1px solid var(--clr-w400); border-radius: 6px; box-sizing: border-box; resize: none; scrollbar-width: thin; scrollbar-color: var(--clr-w300) transparent; }
.booking-edit-box .booking-info-box .booking-info .info .row textarea:hover { border-color: var(--clr-w800); }
.booking-edit-box .booking-info-box .booking-info .info .row textarea:focus { outline: none; border-color: var(--clr-p600); }
.booking-edit-box .booking-info-box .booking-info .info .row textarea::-webkit-scrollbar { width: 6px; }
.booking-edit-box .booking-info-box .booking-info .info .row textarea::-webkit-scrollbar-track { background: transparent; }
.booking-edit-box .booking-info-box .booking-info .info .row textarea::-webkit-scrollbar-thumb { min-height: 52px; background-color: var(--clr-w300); border-radius: 50px; }
.booking-edit-box .booking-info-box .booking-info .info .row textarea::-webkit-scrollbar-thumb:hover, .booking-edit-box .booking-info-box .booking-info .info .row textarea::-webkit-scrollbar-thumb:active { background-color: var(--clr-w400); }
.booking-edit-box .booking-info-box .booking-info .info .row .purpose { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.booking-edit-box .booking-info-box .booking-info .info .row .recurring-step-box { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; width: 280px; }
.booking-edit-box .booking-info-box .booking-info .info .row .recurring-step-box .recurring-step { display: flex; align-items: center; align-self: stretch; gap: 16px; }
.booking-edit-box .booking-info-box .booking-info .info .row .recurring-step-box .dayOfWeek { display: flex; align-items: center; align-self: stretch; gap: 8px; height: 36px; }
.booking-edit-box .booking-info-box .booking-info .info .row .recurring-step-box .dayOfWeek li { display: flex; align-items: center; justify-content: center; flex: 1 0 0; gap: 4px; height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; background-color: var(--clr-w200); border-radius: 6px; box-sizing: border-box; cursor: pointer; }
.booking-edit-box .booking-info-box .booking-info .info .row .recurring-step-box .dayOfWeek li.active { color: var(--txt-color-p600); background-color: var(--clr-p200); }
.booking-edit-box .booking-info-box .booking-info .info .recurring-info { display: flex; align-items: center; justify-content: center; align-self: stretch; gap: 8px; padding: 12px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-edit-box .booking-info-box .booking-info .info .recurring-info .icon-recurring { width: 16px; height: 16px; background: url("/figma/svg/repeat_lightgray_16.svg") no-repeat center / contain; flex-shrink: 0; }
.booking-edit-box .booking-info-box .booking-info .info .recurring-info span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .user { display: flex; align-items: center; gap: 8px; flex: 1 0 0; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.28px; background-color: var(--clr-n80); border-radius: 50%; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .name { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .tooltip { position: absolute; right: 16px; bottom: 16px; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .tooltip .btn-edit { display: flex; width: 36px; height: 36px; background: url("/figma/svg/edit_black_16.svg") no-repeat center / 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-edit-box .booking-info-box .booking-info .info .row .user .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-edit-box .booking-info-box .applicant-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-info-box .applicant-info .sub-title { display: flex; align-items: center; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-info-box .applicant-info .sub-title .name { flex: 1 0 0; line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-edit-box .booking-info-box .applicant-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; padding: 16px; background-color: var(--clr-n30); border-radius: 6px; }
.booking-edit-box .booking-info-box .applicant-info .info .row { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px 12px; flex-wrap: wrap; line-height: 21px; }
.booking-edit-box .booking-info-box .applicant-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .applicant-info .info .row .name { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.booking-edit-box .booking-info-box .applicant-info .info .row .col { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.booking-edit-box .booking-info-box .interviewer-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-info-box .interviewer-info .sub-title { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-edit-box .booking-info-box .interviewer-info .info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; padding: 16px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .interviewer-info .info .row { display: flex; align-items: center; align-self: stretch; gap: 12px; line-height: 21px; }
.booking-edit-box .booking-info-box .interviewer-info .info .row .label { min-width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .interviewer-info .info .row .search-box { display:flex; align-items: center; width: 280px; gap: 8px; }
.booking-edit-box .booking-info-box .interviewer-info .email { display: flex; align-items: center; width: 280px; gap: 4px; }
.booking-edit-box .booking-info-box .interviewer-info .email p { width: 16px; line-height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.32px; text-align: center; }
.booking-edit-box .booking-info-box .interviewer-info .mobile { display: flex; align-items: center; width: 280px; }
.booking-edit-box .booking-info-box .interviewer-info .mobile p { width: 16px; line-height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.32px; text-align: center; }
.booking-edit-box .booking-info-box .visitor-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; width: 100%; }
.booking-edit-box .booking-info-box .visitor-info .sub-title { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px; flex-wrap: wrap; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .name { flex: 1 0 0; line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); letter-spacing: -0.32px; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box { display: flex; align-items: center; align-content: center; gap: 8px 16px; flex-wrap: wrap; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box .ex-btn-box { display: flex; align-items: center; gap: 8px; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box .ex-btn-box > input { display: none; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box .ex-btn-box > button { gap: 4px; border: 1px solid var(--clr-g900); box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box .ex-btn-box .ex-upload::before,
.booking-edit-box .booking-info-box .visitor-info .sub-title .visitor-info-btn-box .ex-btn-box .ex-download::before { content: ""; width: 18px; height: 18px; background: url("/figma/svg/exceldownload_36.svg") no-repeat center / 18px 18px; flex-shrink: 0; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box { display: flex; align-items: center; align-self: stretch; gap: 16px; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .total-txt { display: flex; align-items: center; gap: 4px; flex: 1 0 0; height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter > span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .btn-delete { display: flex; width: 36px; height: 36px; background: var(--clr-w100) url("/figma/svg/delete_black_16.svg") no-repeat center / 16px 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .btn-delete:disabled { background: var(--clr-n40) url("/figma/svg/delete_16.svg") no-repeat center / 16px 16px; border: 0; cursor: default; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .btn-delete:disabled:hover { opacity: 1; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .btn-add { display: flex; width: 36px; height: 36px; background: url("/figma/svg/add_black_16.svg") no-repeat center / 16px 16px; aspect-ratio: 1/1; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .tooltip-text { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-bottom: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip .tooltip-text::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-filter-box .visitor-list-filter .tooltip button:hover + .tooltip-text { visibility: visible; opacity: 1; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box { width: 100%; overflow-x: auto; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list { display: table; table-layout: fixed; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th { position: sticky; top: 0; height: 44px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; z-index: 10; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th:first-child, .booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td:first-child { padding-left: 24px; text-align: center; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list thead th:last-child, .booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td:last-child { padding-right: 24px; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody tr:last-child td { border-bottom: 0; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list .custom-checkbox-wrap input[type="checkbox"] { display: none; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td > input { width: 100%; height: 100%; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; background-color: transparent; border: 0; box-sizing: border-box; }
.booking-edit-box .booking-info-box .visitor-info .visitor-list-wrap .visitor-list-box .visitor-list tbody td > input::placeholder { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; }
.booking-edit-box .booking-btn-box { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; align-self: stretch; padding: 24px; }
.booking-edit-box .booking-btn-box .booking-btn { display: flex; align-items: center; justify-content: flex-end; align-self: stretch; gap: 8px; }
.booking-edit-box .booking-btn-box .booking-btn button { min-width: 80px; }

/* 참석자 수정/접견자 검색 팝업 */
/* 공통 */
.layer-pop-area.attendeeEdit.byOrg { max-width: 960px; }
.layer-pop-area.attendeeEdit .pop-cont { gap: 16px; }
.tab-container { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.tab-container .tab-nav { position: relative; display: inline-flex; align-items: center; gap: 4px; margin-bottom: -1px; z-index: 1; }
.tab-container .tab-nav button { display: flex; align-items: center; justify-content: center; gap: 16px; width: 128px; height: 44px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--clr-w500); letter-spacing: -0.28px; background-color: var(--clr-w200); border: 1px solid var(--clr-w300); border-radius: 6px 6px 0 0; box-sizing: border-box; }
.tab-container .tab-nav button.active { color: var(--txt-color-p600); background-color: var(--clr-w100); border-bottom-color: var(--clr-w100); }
.tab-container .tab-nav button:hover, .tab-container .tab-nav button.active:hover { background-color: var(--clr-w200); border-color: var(--clr-w200); opacity: 1; cursor: pointer; }
.tab-content-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 0 0; border: 1px solid var(--clr-w300); border-radius: 0 6px 6px 6px; box-sizing: border-box; }
.user-list-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 0 0; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.user-list { display: table; width: 100%; table-layout: fixed; }
.user-list thead th { position: sticky; top: 0; height: 44px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; z-index: 10; }
.user-list thead th:first-child, .user-list tbody td:first-child { padding-left: 24px; text-align: center; }
.user-list thead th:last-child, .user-list tbody td:last-child { padding-right: 24px; }
.user-list-box { overflow-y: auto; }
.user-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.user-list tbody td .user { display: flex; gap: 8px; }
.user-list tbody td .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.user-list tbody td .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.user-list tbody td .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); }
.user-list tbody td .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.user-list tbody td .user .name { line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-list tbody td button { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); letter-spacing: -0.28px; }
.user-list tbody td button:hover { color: var(--clr-p400); }
.user-list-box .empty-box div .icon-empty-box { background: url("/figma/svg/result_member_120.svg") no-repeat center / contain; }
.ext-attendee-box { display: flex; align-items: center; align-self: stretch; gap: 8px; padding: 16px 20px; background-color: var(--clr-n30); border-radius: 8px; box-sizing: border-box; }
.ext-attendee-box .label { display: flex; align-items: flex-start; width: 80px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.ext-attendee-box .input_text_wrapper { flex: 1 0 0; }
.add-attendee-box { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; align-self: stretch; gap: 12px; }
.add-attendee-box .title-box { display: flex; align-items: center; align-self: stretch; gap: 12px; }
.add-attendee-box .title-box h1 { flex: 1 0 0; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.add-attendee-box .title-box .total-txt { display: flex; gap: 4px; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.add-attendee-box .title-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.add-attendee-box .add-attendee-list { display: flex; align-items: center; align-content: center; align-self: stretch; gap: 8px; flex: 1 0 0; flex-wrap: wrap; padding: 16px 20px; background-color: var(--clr-n30); border-radius: 8px; box-sizing: border-box; }
.add-attendee-list .attendee { display: flex; align-items: center; justify-content: center; gap: 4px; min-width: 60px; height: 36px; padding: 0 12px; background-color: var(--clr-w100); border: 1px solid var(--clr-w400); border-radius: 6px; box-sizing: border-box; }
.add-attendee-list .attendee .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.add-attendee-list .attendee .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.add-attendee-list .attendee .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); }
.add-attendee-list .attendee .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.add-attendee-list .attendee .name { line-height: 24px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.add-attendee-list .attendee .icon-close { width: 12px; height: 12px; background: url("/figma/svg/close_12.svg") no-repeat center / contain; flex-shrink: 0; cursor: pointer; }

/* 조직원 목록(기본형) */
.tab-content-box .tab-content { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding: 16px; }
.tab-content .user-list-filter { display: flex; align-items: center; align-self: stretch; gap: 8px; padding: 16px 20px; background-color: var(--clr-n30); border-radius: 8px; box-sizing: border-box; }
.tab-content .user-list-filter .input_text_wrapper { flex: 1 0 0; }
.user-list-wrap .title-box { display: flex; align-items: center; align-self: stretch; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); }
.user-list-wrap .title-box .total-txt { display: flex; gap: 4px; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.user-list-wrap .title-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }

/* 조직원 목록(조직도형) */
.tab-content-box .tab-content2 { display: flex; align-items: flex-start; align-self: stretch; flex: 1 0 0; gap: 16px; padding: 16px; }
.org-chart-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; width: 300px; }
.org-chart-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 0 0; gap: 16px; min-height: 520px; padding: 16px 16px 0 16px; border: 1px solid var(--clr-w300); border-radius: 8px; box-sizing: border-box; }
.org-chart { width: calc(100% + 16px); flex: 1; min-height: 0; padding-right: 16px; margin-right: -16px; overflow-y: auto; box-sizing: border-box; }
.org-chart > li > div { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 8px; background-color: var(--clr-p100); border: 1px solid var(--clr-p600); border-radius: 3px; box-sizing: border-box; cursor: pointer; }
.org-chart > li > div .icon-toggle { width: 20px; height: 20px; mask: url("/figma/svg/tree_plus_20.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/tree_plus_20.svg") no-repeat center / contain; background-color: var(--clr-p600); flex-shrink: 0; }
.org-chart > li > div.active .icon-toggle { mask: url("/figma/svg/tree_minus_20.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/tree_minus_20.svg") no-repeat center / contain; }
.org-chart > li > div .name { line-height: 20px; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-p600); letter-spacing: -0.32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.org-group { display: none; }
.org-group li { position: relative; }
.org-group > li { padding-left: 30px; }
.org-group li::before { position: absolute; content: ""; top: 0; width: 1px; height: 100%; background-color: var(--clr-w300); }
.org-group li::after { position: absolute; content: ""; top: 20px; width: 14px; height: 1px; background-color: var(--clr-w300); }
.org-group li:last-child::before { height: 20px; }
.org-group > li::before, .org-group > li::after { left: 18px; }
.org-group li div { position: relative; display: flex; align-items: center; gap: 8px; height: 40px; cursor: pointer; z-index: 10; }
.org-group > li > div { margin-left: -12px; padding-left: 14px; }
.org-group li div:hover { background-color: var(--clr-p200); border-radius: 3px; }
.org-group li div.selected { background-color: var(--clr-p100); border: 1px solid var(--clr-p600); border-radius: 3px; box-sizing: border-box; }
/* --- CSS4 설정(:has) 별도 분리 ---
.org-group > li:has(> div:hover)::after { display: none; }*/
.org-group li div .icon-toggle { width: 20px; height: 20px; mask: url("/figma/svg/tree_plus_20.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/tree_plus_20.svg") no-repeat center / contain; background-color: var(--clr-w800); flex-shrink: 0; margin-left: -2px; }
.org-group li div.active .icon-toggle { mask: url("/figma/svg/tree_minus_20.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/tree_minus_20.svg") no-repeat center / contain; background-color: var(--clr-w400); }
.org-group li div .name { line-height: 20px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.org-chart li div > .name:first-child { padding-left: 4px; }
.org-sub-group { display: none; }
.org-sub-group li { padding-left: 23px; }
.org-sub-group li::before, .org-sub-group li::after { left: 9px; }
.org-sub-group li:first-child::before { top: -12px; height: 52px !important; }
.org-sub-group li:first-child:not(:last-child)::before { bottom: 0 !important; height: auto !important;  }
.org-sub-group li:only-child::before { bottom: auto !important; height: 32px !important; }
/* --- CSS4 설정(:has) 별도 분리 ---
.org-sub-group > li:has(> div:hover)::after { display: none; }*/
.org-sub-group li div { margin-left: -14px; padding-left: 14px; }

.user-list-container { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 0 0; gap: 12px; }
.user-list-container .title { display: flex; width: 100%; line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-list-filter-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 12px; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.user-list-filter-box .user-list-filter { display: flex; align-items: center; align-self: stretch; }
.user-list-filter-box .user-list-filter:first-child { gap: 10px; }
.user-list-filter-box .user-list-filter:last-child { gap: 16px; }
.user-list-filter-box .user-list-filter .total-txt { display: flex; align-items: center; gap: 4px; flex: 1 0 0; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.user-list-filter-box .user-list-filter .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.user-list-filter-box .user-list-filter .selection-group, .user-list-filter-box .user-list-filter .checkbox { display: flex; align-items: center; gap: 8px; }
.user-list-filter-box .user-list-filter .selection-group span, .user-list-filter-box .user-list-filter .checkbox label { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.user-list-filter-box .user-list-filter .input_text_wrapper { flex: 1 0 0; }
.user-list .check-user { display: none; }

/* 최근 회의 목록 */
.roomresv-history-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 0 0; }
.roomresv-history-wrap .title-box { display: flex; align-items: center; align-self: stretch; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.roomresv-history-wrap .title-box .total-txt { display: flex; gap: 4px; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.roomresv-history-wrap .title-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.roomresv-history { display: table; width: 100%; table-layout: fixed; }
.roomresv-history thead th { position: sticky; top: 0; height: 44px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; z-index: 10; }
.roomresv-history thead th:first-child, .roomresv-history tbody .history td:first-child { padding-left: 24px; }
.roomresv-history thead th:last-child, .roomresv-history tbody .history td:last-child { padding-right: 24px; }
.roomresv-history-box { height: 372px; overflow-y: auto; }
.roomresv-history tbody .history:hover { background-color: var(--clr-p100); cursor: pointer; }
.roomresv-history tbody .history.active { background-color: var(--clr-p100); }
.roomresv-history tbody .history td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.roomresv-history tbody tr:last-child td, .roomresv-history tbody tr:nth-child(n+15):nth-last-child(2) td, .roomresv-history tbody .history.active td { border-bottom: 0; }
.roomresv-history tbody .history td .icon-arrow { display: flex; width: 16px; height: 16px; background: url("/figma/svg/arrow_down_16.svg") no-repeat center / contain; flex-shrink: 0; }
.roomresv-history tbody .history.active td .icon-arrow { background: url("/figma/svg/arrow_up_16.svg") no-repeat center / contain; }
.roomresv-history tbody .history td button { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); letter-spacing: -0.28px; }
.roomresv-history tbody .history td button:hover { color: var(--clr-p400); }
.roomresv-history tbody .detailed { display: none; }
.roomresv-history tbody .history.active + .detailed { display: table-row; }
.roomresv-history tbody .detailed ul { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; border-top: 1px solid var(--clr-p400); border-left: 12px solid var(--clr-p400); border-bottom: 1px solid var(--clr-p400); box-sizing: border-box; }
.roomresv-history tbody .detailed ul li { display: flex; align-self: stretch; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.roomresv-history tbody .detailed ul li:last-child { border-bottom: 0; }
.roomresv-history tbody .detailed div { display: flex; align-items: center; height: 48px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; cursor: pointer; }
.roomresv-history tbody .detailed .user { gap: 8px; width: 200px; padding: 0 12px; }
.roomresv-history tbody .detailed .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.roomresv-history tbody .detailed .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.roomresv-history tbody .detailed .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); }
.roomresv-history tbody .detailed .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.roomresv-history tbody .detailed .user .name { flex: 1; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roomresv-history tbody .detailed .team { display: inline-block; flex: 1; min-width: 0; line-height: 48px; padding: 0 24px 0 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roomresv-history-box .empty-box { display: none; height: 372px; }

/* 접견자 검색 */
.searchIntv .pop-cont { gap: 16px; }
.searchIntv .user-list-filter { display: flex; align-items: center; align-self: stretch; gap: 8px; padding: 20px 24px; background-color: var(--clr-n30); border-radius: 8px; box-sizing: border-box; }
.searchIntv .user-list-filter .input_text_wrapper { flex: 1 0 0; }

/* 촤근 방문자 목록 */
.recentVisitors .pop-cont { gap: 16px; }
.recentVisitors .user-list-filter { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; align-self: stretch; gap: 8px; padding: 20px 24px; background-color: var(--clr-n30); border-radius: 8px; box-sizing: border-box; }
.recentVisitors .user-list-filter .input_text_wrapper { flex: 1 0 0; }
.recentVisitors .user-list-filter .search-box { display: flex; align-items: center; align-self: stretch; gap: 8px; }
.recentVisitors .user-list-filter .sub-txt { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; }
.recentVisitors .user-list-box .user-list .custom-checkbox-wrap input[type="checkbox"] { display: none; }

/* ///////////////////////////////////////////////// */
/* ------------------- 회의실 예약 ------------------- */
/* ///////////////////////////////////////////////// */
/* --- CSS4 설정(:not) 별도 분리 ---
.meetingroom, .sleep:not(.maincontant__section__list--body .apply-list > li.sleep),
.conditioning:not(.maincontant__section__list .conditioning), .smartlocker.list {position: relative; width: 100%; margin: 0 auto; box-sizing: border-box; padding: 50px 50px 20px;}*/
.meetingroom__head { display: flex; height: 60px; padding: 0 40px; align-items: center; gap: 12px; align-self: stretch; }
.meetingroom__head .date { position: relative; width: auto; margin: 0 auto; font-size: 22px; color: #222; font-weight: 600; text-align: center; vertical-align: middle; display: flex; align-items: center; justify-content: center; gap: 15px; }
.meetingroom__head .date input.datepicker { display: inline-block; height: 34px; width: auto; font-size: 22px; color: #5a6681; font-weight: 600; text-align: center; border: 0; padding: 0 20px; word-break: keep-all; white-space: -1px; vertical-align: middle; background-color: white; }
.meetingroom__head .date input.datepicker::-ms-clear { display: none; }
.meetingroom__head .date input.datepicker:focus { outline: 0px !important; }
.meetingroom__head .date input.datepicker:hover { opacity: 0.8; color: #000; }
.meetingroom__head .date .ui-datepicker-trigger { display: none; width: 34px; height: 34px; background: url(../../images/connectplace/common/calendar_icons_big.png) no-repeat 50% 67%; background-size: 24px auto; text-indent: -9999px; vertical-align: middle; margin-top: 0; }
.meetingroom__head .date #prevDate, .meetingroom__head .date .prevDate { display: inline-block; width: 36px; height: 36px; margin: 0 !important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_L_gr.png) no-repeat center/10px; }
.meetingroom__head .date #prevDate.disabled, .meetingroom__head .date .prevDate.disabled{opacity: 0.65;}
.meetingroom__head .date #nextDate, .meetingroom__head .date .nextDate { display: inline-block; width: 36px; height: 36px; margin: 0 !important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_R_gr.png) no-repeat center/10px; }
.meetingroom__head .date #nextDate.disabled, .meetingroom__head .date .nextDate.disabled{opacity: 0.65;}
.room_container .seat_header_filter_location .room_month_filter_select { display: inline-flex; align-items: center; }
.room_container .seat_header_filter_location .room_month_filter_select[hidden] { display: none !important; }
.room_container #roomDayWeekFilterPanel { display: contents; }
.room_container #roomDayWeekFilterPanel[hidden] { display: none !important; }
/* #room-selector { padding: 0 15px; font-weight: 400; border-radius: 0;} */
.meetingroom__head .legend { display: flex; align-items: center; gap: 10px; margin-left: 10px; }
.meetingroom__head .legend li { float: left; position: relative; font-size: 14px; font-weight: 500; white-space: nowrap; padding-left: 20px; margin: 0; }
.meetingroom__head .legend li::after { content: ""; width: 16px; height: 16px; background: #999; position: absolute; top: 50%; left: 0; margin-top: -7px; box-sizing: border-box; }
.meetingroom__head .legend li.st1::after { background: var(--clr-w100); border: 1px solid var(--clr-w700); border-radius: 4px; }
.meetingroom__head .legend li.st3::after { background: var(--clr-p100); border: 1px solid var(--clr-p500); border-radius: 4px; }

.meetingroom__body--list:first-child li{margin-top: 0;}
.meetingroom__body--list li .meetingroom__time table { display: table; width: 100%; table-layout: fixed; }
.meetingroom__body--list li .meetingroom__time table .time { text-align: right; font-size: 13px; color: #5f6b8b; text-indent: 10px; background-color: #e8f3ff; padding: 10px 0; border: 0; box-sizing: border-box; }
.meetingroom__body--list li .meetingroom__time table .time em { margin-right: -5px; }
.meetingroom__body--list li .meetingroom__time table tr td:first-child .time { background-color: #f5f5f5; }
.meetingroom__body--list li .meetingroom__time table tr td:first-child .time em { margin-right: -7px; }
.meetingroom__body--list li .meetingroom__time table tr td:last-child .time em { margin-right: 2px; }

.meetingroom__body--list li .meetingroom__item { display: table; width: 100%; table-layout: fixed; border-top: 0; }
.meetingroom__body--list li .meetingroom__item--info { position: relative; display: table-cell; width: 190px; vertical-align: top; padding: 0 20px 0; box-sizing: border-box; background-color: #f5f5f5; }
.meetingroom__body--list li .meetingroom__item--info .perfume { display: inline-block; background-image: url(../../images/connectplace/common/icon_perfume_off.png); width: 15px; height: 14px; margin-bottom: 0; box-sizing: border-box; background-position: center; background-repeat: no-repeat; background-size: contain; }
.meetingroom__body--list li .meetingroom__item--info .info-btn { display: inline-block; margin-top: 10px; margin-left: 10px; }
.meetingroom__body--list li .meetingroom__item--info .info-btn button { border: 1px solid #ddd; height: 26px; line-height: 25px; font-size: 12px; color: #666; }
.meetingroom__body--list li .meetingroom__item--info .info-btn button:hover { border: 1px solid #444; }
.meetingroom__body--list li .meetingroom__item--info .info-btn button.detail { background-color: #838eac; background-image: none; padding: 0 10px; border: 1px solid #898eac; color: #fff; font-size: 14px; font-weight: 600; position: absolute; right: 0; bottom: 0; }

.meetingroom__body--list li .meetingroom__item--cell { display: table-cell; vertical-align: middle; }
.meetingroom__body--list li .meetingroom__item--cell table { display: table; width: 100%; height: 100%; table-layout: fixed; border-right: 0; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell { background: var(--clr-w100); border-left: 1px solid #ddd; position: relative; height: 100%;display: flex; align-items: center; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell.notselectable { border-left: 0 !important; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell div {min-height: 90px; height: 100%; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell.border_none {border-left: none; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.border_add {border-left: 1px solid #ddd;border-right: 1px solid #ddd; box-sizing: border-box;}
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation { position: relative; width: 100%; display: flex; align-items: center; background: #fff; justify-content: center; box-sizing: border-box; position: relative; cursor: pointer; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation:hover { background: #f5f5f5; z-index: 19px; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; flex: 1 0 0; overflow: hidden; color: var(--clr-w700, #555); text-align: center; text-overflow: ellipsis; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.Impossible { background: #838EAC; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.passaway { background: #dcdfe6; cursor: default; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.my { background-color: #1a84f4; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.recurring { background-image: url("../../images/connectplace/common/ico_repeat-wh.png"); background-repeat: no-repeat; background-size: 12px; background-position: right 5px bottom 5px; }

/* --- CSS4 설정(:not) 별도 분리 ---
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell:not(
 .meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":30"] .meet_cell,
 .meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":15"] .meet_cell,
 .meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":45"] .meet_cell) { border-left: 1px solid #e7ebf7; }*/
.meetingroom__body--list li .meetingroom__item--cell table td:first-child .meet_cell { border-left: 0; }
.meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":30"] .meet_cell { border-left: 1px dashed #e7ebf7;}
.meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":15"] .meet_cell,
.meetingroom__body--list li .meetingroom__item--cell table td[starttm$=":45"] .meet_cell { border-left: 0;}
.meetingroom__body--list li .meetingroom__item--cell table.reservationTimeTable td.ui-selecting .meet_cell .reservation,
.meetingroom__body--list li .meetingroom__item--cell table.reservationTimeTable td.ui-selected .meet_cell .reservation { background-color: #1a84f4 !important }

.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.active { border: 1px solid #1382f4; background: #fff; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.active span { color: #1382f4;}
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.active button.add-btn,

#divReservationButtonArea{position: absolute; top: -9999px; left: -9999px; display: none;}
#divReservationButtonArea button.add-btn { position: absolute; width: 100px; height: 40px; background-color: #343f5b; color: #fff; border-radius: 3px; bottom: -20px; left: 50%; transform: translateX(-50%); z-index: 9; font-size: 14px; font-weight: 700; letter-spacing: -0.96px; }
.meetingroom__body--list li .meetingroom__item--cell table td .meet_cell .reservation.active button.add-btn:hover,
#divReservationButtonArea button.add-btn:hover { background-color: #26314b; opacity: 1; }

.meetingroom.type2 { display: flex; justify-content: center; align-items: center; height: calc(100vh - 50px); min-height: 700px; padding: 0 50px; }
.meetingroom.type2 .no-meetingroom { padding-top: 225px; text-align: center; background: url(../../images/connectplace/common/nomeetingroom_img.png) no-repeat top center; }
.meetingroom.type2 .no-meetingroom h3 { font-size: 30px; color: #222; line-height: 34px; }
.meetingroom.type2 .no-meetingroom p { font-size: 22px; color: #666; line-height: 34px; }

/* 회의실 사람 없음 */
span.peopleIcon {display: inline-block;width: 19px;height: 12px;margin-left: 5px;background-image: url(../../images/connectplace/common/people_zero.png);background-position: center; }
/* 회의실 사람 1명 */
span.peopleIcon.one {background-image: url(../../images/connectplace/common/people_one.png) !important; }
/* 회의실 사람 2명이상 */
span.peopleIcon.full {background-image: url(../../images/connectplace/common/people_full.png) !important; }
/* 주간 캘린더 */
#currPos {position: absolute; top: 95px; width: 1px !important; height: auto; background-color: #59a7f7; border-right: 0 !important;}
#currIndicator {position: absolute; width: 0; height: 0; top: 95px; border-right: 5px solid transparent; border-left: 5px solid transparent; border-top: 10px solid #59a7f7 !important }
.weekView-Date { position: relative; cursor:default; background-color: inherit !important; display: inline-block; border: 0; text-align: center; margin: 0 40px; font-size: 22px; font-weight: 600; }
.weekView-Date:focus { outline: 0;}

/* 월간 캘린더 */
.meetingroom-weekview-calendar-date { font-weight: 700; font-size: 16px; color: #5f6b8b; background-color: #e8f3ff }
.meetingroom-weekview-calendar .meetingroom-weekview-calendar-date:nth-child(2),
.meetingroom-monthview-calendar .meetingroom-weekview-calendar-date:first-child { background-color: #fed3d3; color: #d51f20 }
.meetingroom-weekview-calendar .meetingroom-weekview-calendar-date:nth-child(8),
.meetingroom-monthview-calendar .meetingroom-weekview-calendar-date:nth-child(7) { background-color: #c8e2fe; color: #1a84f4 }
.weekview_meetingroom_list div { font-size: 16px; color: #444; font-weight: 700 }
.WeekView-Basic-Component.passaway { background-color: #dcdfe6 }

/* 회의실 예약하기 */
.meeting-room-add .tit { font-size: 15px; font-weight: 300; padding-left: 25px; margin-bottom: 0; display: flex; flex-flow: row; align-items: center; justify-content: space-between; height: 45px; line-height: 45px; padding: 0 30px; background-color: #06315f; background-image: none; color: #fff; letter-spacing: -0.88px; }
.meeting-room-add .tit span { display: block; font-size: 20px; font-weight: 500; letter-spacing: -0.5px; }
.meeting-room-add .attendees { padding: 0 30px; margin: 20px 0 10px; border-top: 0; }
.meeting-room-add .attendees-tit { display: flex; align-items: center; justify-content: space-between; background-color: #06315f; box-sizing: border-box; height:40px; }
.meeting-room-add .attendees-tit span { font-size: 16px; color: #fff; font-weight: 600; margin-left: 20px; }
.meeting-room-add .attendees-tit button { height: 100%; color: #fff; font-size: 14px; font-weight: 500; padding: 0 15px 0 40px; background-image: url(../../images/connectplace/common/ico_addMember.png); background-repeat: no-repeat; background-position: left 17px center; background-size: 15px; background-color: #1c446f; border: 0; box-sizing: border-box; }
.meeting-room-add .attendees-tit button:hover { opacity: 1; background-color: #335a84; transition: all 0.3s;}

.meeting-room-add .attendees-cont { margin-top: 0; height: auto; border-top: 0; border: 1px solid #f0f0f0; }
.meeting-room-add .attendees-cont .attendees-list { min-height: 52px; max-height: 100px; overflow-y: auto; }
.meeting-room-add .attendees-cont .attendees-list li { border-bottom: 1px solid rgba(0, 0, 0, .1); display: flex; align-items: center; height: 50px; position: relative; padding: 0 40px 0 20px; box-sizing: border-box; font-size: 14px; color: #999; }
.meeting-room-add .attendees-cont .attendees-list li:last-child { border-bottom: 0; }
.meeting-room-add .attendees-cont .attendees-list li .name { font-size: 13px; font-weight: 500; color: #1382f4; width: auto; min-width: 80px; max-width: 200px; margin-right: 15px; padding: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.meeting-room-add .attendees-cont .attendees-list li .name strong { color:#222; font-weight: 600; font-size: 16px; margin-right: 10px; }
.meeting-room-add .attendees-cont .attendees-list li .team strong { margin-right: 6px; }
.meeting-room-add .attendees-cont .attendees-list li .team, .meeting-room-add .attendees-cont .attendees-list li .team strong { color: #4c5266; font-size: 14px; font-weight: 400; width: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.meeting-room-add .attendees-cont .attendees-list li button { position: absolute; top: 0; right: 0; width: 40px; height: 20px; margin-top: 0; background-repeat: no-repeat; background-position: 50%; background-image: unset; background-color: #A9B4C0; color: #fff; text-indent: 0; text-align: center; font-size: 12px; font-weight: 500; }
.meeting-room-add .attendees-cont .attendees-list li button:hover { opacity: 0.8; transition: all 0.2s; }

/*회의실예약 : 참석자 추가 */
.attendeesAdd-head { width: 100%; }
.attendeesAdd-cont { display: flex; min-height: 500px; max-height: 500px; }
.attendeesAdd-cont .addMember-wrap { width: calc(100% - 220px); }

.attendees-add { display: table; width: 100%; table-layout: fixed; }
.attendees-add-search { display: table-cell; vertical-align: top; width: 55%; padding: 30px 30px 0; box-sizing: border-box;}

.attendees-add-search-input { display: flex; align-items: center; position: relative; overflow: unset; background-color: #f0f6ff; padding: 10px 30px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.05); }
.attendees-add-search-input .title-btn{ font-size: 18px; color: #1382f4; font-weight: bold; white-space: nowrap; letter-spacing: -0.88px; margin-right: 20px; }
.attendees-add-search-input .title-btn li { display: none; }
.attendees-add-search-input .title-btn li.active { display: block;}

.attendees-add-search-input .inputsearch { position: relative; float: left; width: 65%; box-sizing: border-box; }
.attendees-add-search-input .inputsearch input {height: 40px; width: 100%; padding: 0 40px 0 10px; box-sizing: border-box;color: #222; font-size: 16px; font-weight: 500; letter-spacing: -0.2px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); }
.attendees-add-search-input .inputsearch button { position: absolute; right: 0; width: 34px; height: 40px; background: url("../../images/connectplace/common/search_icon_b.png") no-repeat 50%; text-indent: -9999px; }
/* --- CSS4 설정(:not) 별도 분리 ---
.attendees-add-search-input .inputsearch button:not(.inputsearch.type2 button) { position: absolute; right:0px; top: 50%; transform: translateY(-50%); display: block; width: 40px; height: 40px; background: url(../../images/connectplace/common/search_icon_b.png) no-repeat center/20px; text-indent: -9999px; }*/
.attendees-add-search-input .inputsearch input:focus { outline: 0; }
.attendees-add-search-input .inputsearch { width: 100%; margin-right: 20px; }
.attendees-add-search-input .inputsearch.type2 {display: none; position: relative; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; margin-top: 10px; width: 100%; box-sizing: border-box; }
.attendees-add-search-input .inputsearch.type2 input { display: block; height: 40px; width: 100%; padding: 0 15px; padding: 0 5px; font-size: 15px; color: #222; box-sizing: border-box; }
.attendees-add-search-input .inputsearch.type2 button {display: block; position: relative; top: 0; left: 0; right: 0; width: 80px; height: 40px; line-height: 40px; cursor: pointer; margin-left: 10px; border: 0; background-color: #59a7f7;text-indent: 0; text-align: center; background-image: none; color: #fff; font-weight: 600; font-size: 16px;}
.attendees-add-search-input .inputsearch.type2 button:hover { opacity: 1; background-color: #469bf3; transition: all 0.3s; }
.attendees-add-search-input .invite-btn { padding-left: 20px; border-left: 1px solid #1382f410; box-sizing: border-box; }
.attendees-add-search-input .invite-btn li {display: none; width: 125px; height: 40px; line-height: 40px; background-color: #59a7f7; color: #fff; font-weight: 600; font-size: 16px; text-align: center; text-indent: 20px; box-sizing: border-box; background-image: url(../../images/connectplace/common/ico_addMember.png); background-repeat: no-repeat; background-position: left 17px top 50%; background-size: 15px; }
.attendees-add-search-input .invite-btn li:hover {cursor: pointer; opacity: 1; background-color: #3695fa; transition: all 0.2s; }
.attendees-add-search-input .invite-btn li.active { display: block; }

.addMember-type1 #tbodySearchUser{overflow-y: auto; max-height: 390px; padding: 10px 0; box-sizing: border-box;}
.addMember-type1 .attendees-add-search-input .select-box.user-search-type-box { border: 0; min-width: 100px; margin-right: 10px; height: 40px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); }
.addMember-type1 .attendees-add-search-input .select-box.user-search-type-box .select-list { top: 42px; }
.addMember-type2 .attendees-add-search-input .inputsearch:not(.inputsearch.type2) { display: none; }
.addMember-type2 .attendees-add-search-input #companySelectType.select-box { border: 0; width: 100%; margin-right: 20px; height: 40px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow:  1px 1px 3px rgba(0, 0, 0, 0.05);}
.addMember-type2 .attendees-add-search-input #companySelectType.select-box .select-list { top: 42px; }

.addMember-type1 .staff-list {overflow: hidden;}
.addMember-type1 .staff-list li .user-item>button, .addMember-type2 .staff-list li .user-item>button,
.addMember-type1 .staff-list li .user-item>button.pick, .addMember-type2 .staff-list li .user-item>button.pick { min-width: 60px; width: 60px; }
.addMember-type2 #organizationChart .chart-list .head { padding-right: 0; }
.addMember-type2 #organizationChart .chart-list .head .listTotal { margin-left: auto; }
.addMember-type2 #organizationChart .chart-list .head .alladd { width: 80px; height: 30px; border:1px solid #828eac; color: #5a6681; font-size: 15px; font-weight: 600; letter-spacing: -0.88px; }
.addMember-type2 #organizationChart .chart-list .head .alladd:hover { opacity: 1; background-color: #fff; color: #fff; border: 1px solid #06315f; background-color: #06315f; transition: all 0.3s; }

/* 조직도 css (#organizationChart) - 회의실예약, 좌석예약 */
#organizationChart { display: flex; width: 360px; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 8px; border: 1px solid var(--clr-w300); }
#organizationChart .organization-search { width: 100%; height: 100%; }

#organizationChart .inputsearch { display: flex; padding: 16px 16px 0 16px; flex-direction: column; align-items: flex-start; align-self: stretch; background: var(--clr-w100); }
#organizationChart .inputsearch input { font-size: 15px; color: #222; font-weight: 500; width: 100%; height: 40px; border: 0; padding: 0 40px 0 15px; box-sizing:border-box; }
#organizationChart .inputsearch input:focus { outline: 0; }
#organizationChart .inputsearch input+ button { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: block; width: 48px; height: 16px; background: url(../../../figma/svg/search_black_16.svg) no-repeat center/16px; text-indent: -9999px; }

#organizationChart .organization-search .organization { width: 100%; height: calc(100% - 40px); border: 1px solid rgba(0, 0, 0, 0.08); border-top: 0; overflow: auto; padding: 16px; box-sizing: border-box; }
#organizationChart .organization-search .organization .company { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 600; color: #4c5266; letter-spacing: -0.88px; margin-bottom: 10px; cursor: pointer; }
/* --- CSS4 설정(:has) 별도 분리 ---
#organizationChart .organization-search .organization:has(> li.group) > .company { color: #1382f4; }*/
#organizationChart .organization-search .organization > .company .org-tree-toggle-icon { display: none; flex-shrink: 0; width: 20px; height: 20px; background: url(../../../figma/svg/tree_minus_20.svg) center / 20px 20px no-repeat; }
/* --- CSS4 설정(:has) 별도 분리 ---
#organizationChart .organization-search .organization:has(> li) > .company .org-tree-toggle-icon { display: block; }*/
#organizationChart .organization-search .organization li.group>div,
#organizationChart .organization-search .organization li.team>div { display: flex; align-items: center; gap: 8px; position: relative; height: 40px; }
#organizationChart .organization-search .organization li.group.on>div { color: #1382f4; transition: all 0.4s; }
#organizationChart .organization-search .organization li.group.on ul li.team.on>div { color: #1382f4; transition: all 0.2s; }
/* 자식이 있는 부서만 +/- 아이콘 (SVG). 펼침: minus, 접힘: plus */
#organizationChart .organization-search .organization li.group > div > .org-tree-toggle-icon,
#organizationChart .organization-search .organization li.team > div > .org-tree-toggle-icon { flex-shrink: 0; width: 20px; height: 20px; cursor: pointer; background: url(../../../figma/svg/tree_plus_20.svg) center / 20px 20px no-repeat; }
/* --- CSS4 설정(:has) 별도 분리 ---
#organizationChart .organization-search .organization li.group.on:has(> ul) > div > .org-tree-toggle-icon,
#organizationChart .organization-search .organization li.team.on:has(> ul.subTeam) > div > .org-tree-toggle-icon { background-image: url(../../../figma/svg/tree_minus_20.svg); }*/
/* 말단(하위 부서 없음): 아이콘 없음 — 텍스트 시작선 맞춤 */
/* --- CSS4 설정(:has) 별도 분리 ---
#organizationChart .organization-search .organization li.group:not(:has(> ul)) > div .org-tree-name,
#organizationChart .organization-search .organization li.team:not(:has(> ul.subTeam)) > div .org-tree-name { padding-left: 28px; }*/
#organizationChart .organization-search .organization li.group:last-child>ul { padding-bottom: 0; }
#organizationChart .organization-search .organization li.group>ul { margin-left: 6px; border-left: 1px solid #e5e5e5; }
#organizationChart .organization-search .organization li.group.on>ul { position:relative; border-left: 0; margin-left:20px; }
#organizationChart .organization-search .organization li.group.on>ul::before { position: absolute; left: -14px; top: 0; content: ""; width: 1px; height: 100%; background-color: #e5e5e5; }
#organizationChart .organization-search .organization li.group:last-child.on>ul::before { display: none; }
#organizationChart .organization-search .organization li.group:last-child ul { display: none; }
#organizationChart .organization-search .organization li.group.on:last-child ul { display: block; }
#organizationChart .organization-search .organization li.group.on:last-child ul:last-of-type:empty { display: none; }
#organizationChart .organization-search .organization li.group ul li,
#organizationChart .organization-search .organization li.group.on ul li.team>div+ul { display: none; }
#organizationChart .organization-search .organization li.group.on ul li.team { display: block; width:calc(100% - 15px); align-items: center; line-height: 1.8; font-size: 16px; color: #5f6b8b; font-weight: 500; letter-spacing: -0.88px; }
#organizationChart .organization-search .organization li.group.on ul li.team div .org-tree-name { position: relative; display: flex; align-items: center; white-space: nowrap; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#organizationChart .organization-search .organization li.group.on ul li.team div .org-tree-name::before { display: block; content: ""; min-width: 10px; height: 1px; margin-right: 5px; background-color: #e5e5e5; flex-shrink: 0; }
#organizationChart .organization-search .organization li.group.on ul li.team.on { transition: all 0.2s; color: #1382F4; }
#organizationChart .organization-search .organization li.group.on ul li.team.on>div+ul { padding-left: 15px; display: block; border-left: 1px solid #e5e5e5; padding-top: 0; padding-bottom: 0; }
#organizationChart .organization-search .organization li.group.on ul li.team.on:last-child>div+ul { border-left: 0; }

#organizationChart .organization-search .organization li.group.on ul li.team div::after { display: block; position: absolute; content: ""; left: 0; top: 0; width: 1px; height: 24px; border-left: 1px solid #e5e5e5; }
#organizationChart .organization-search .organization li.group.on ul li.team:last-child>div::after { height: 13px; }
#organizationChart .organization-search .organization li.group.on ul li.team:last-child ul.subTeam li:last-child>div::after { height: 13px; }

/* 조직도 ::after 부서 리스트 keyframes */
@-webkit-keyframes fadeInDown {
    0% { opacity: 0; transform: translate(0, -20px); }
    100% { opacity: 1 !important; transform: translate(0, 0); }
}
@keyframes fadeInDown {
    0% { opacity: 0; transform: translate(0, -20px); }
    100% { opacity: 1 !important; transform: translate(0, 0); }
}
#organizationChart .organization-search .organization li.group.on ul li.team { animation-name: fadeInDown; -webkit-animation-name: fadeInDown; animation-duration: 0.2s; -webkit-animation-duration: 0.3s; animation-fill-mode: both; -webkit-animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
#organizationChart .organization-search .organization li.group.on ul li.team + li { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }
#organizationChart .organization-search .organization li.group.on ul li.team + li + li { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }

#organizationChart .organization-search .organization li.group>div:hover, #organizationChart .organization-search .organization li.group ul li.team:hover { cursor: pointer; opacity: 0.85; }
#organizationChart .organization-search .organization li.group>div.on:hover, #organizationChart .organization-search .organization li.group ul li.team.on:hover { cursor: default; opacity: 1; }

#organizationChart .chart-list { width: 390px; height: 100%; }
#organizationChart .chart-list .head { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 30px; height: auto; box-sizing: border-box; margin-bottom: 10px; }
#organizationChart .chart-list .head h3 { display: flex; align-items: center; gap: 5px; font-size: 17px; font-weight: 600; letter-spacing: -1.2px; color: #151515; }
#organizationChart .chart-list .head h3 span { display: flex; align-items: center; gap: 3px; font-size: 15px; font-weight: 400; letter-spacing: -1.2px; color: #5a6681; }
#organizationChart .chart-list .head h3 span::before { display: block; width: 1px; height: 12px; content: ""; border-radius: 2px; background-color: #828eac; }
#organizationChart .chart-list .head .listTotal p { padding-left: 20px; color: #5a6681; font-size: 14px; font-weight: 500; background: url(../../images/connectplace/common/ico_Member_g.png) no-repeat left 50%/ 14px; }

#organizationChart .chart-list .searchBox { display:flex; align-items:center; justify-content: space-between; gap: 20px; width: 100%; height: 60px; background-color: #f1f2f6; border-top: 1px solid #828eac50; padding: 0 20px; box-sizing: border-box; }
#organizationChart .chart-list .searchBox .inputsearch { border: 0; }
#organizationChart .chart-list .searchBox .checkbox { position: relative; margin-left: 0; }
#organizationChart .chart-list .searchBox .checkbox input { display: none; }
#organizationChart .chart-list .searchBox .checkbox .txt { font-weight: 500; color: #5a6681; font-size: 13px; letter-spacing: -0.9px; white-space: nowrap; position: relative; padding-left: 20px; cursor: pointer; }
#organizationChart .chart-list .searchBox .checkbox input + label::before { position: absolute; content: ''; width: 14px; height: 14px; border-radius: 3px; background-image: url(../../images/connectplace/common/check_off.png); background-position: center; background-size: cover; background-repeat: no-repeat; left: 0; top: 50%; transform: translateY(-50%); }
#organizationChart .chart-list .searchBox .checkbox input:checked + label::before { background-image: url(../../images/connectplace/common/check_on.png); }

#organizationChart .chart-list .body { height: calc(100% - 100px); overflow-y: auto; }
#organizationChart .chart-list .body .staff-list { min-height: unset; max-height: unset; height: auto; padding: 0; }
#organizationChart .chart-list .body .staff-list li:first-child { margin-top: 0; }
#organizationChart .chart-list .body .staff-list li { padding: 0; }
#organizationChart .chart-list .body .staff-list li .user-item { padding: 0 10px 0 20px; height: 50px; }
#organizationChart .chart-list .body .staff-list li .user-item:first-child { border-top: 0; }
#organizationChart .chart-list .body .staff-list li .user-item .user-info { padding-left: 0; height: 50px !important; gap: 10px; }

/* 최근회의목록 - 회의실 예약 팝업 > 참석자 추가 팝업 > 최근회의목록 */
.attendeesAdd-cont .recentMeet-list { width: calc(100% - 220px); max-height: 480px; }
.recentMeet-list h3 { position: -webkit-sticky; position: sticky; top: 0; z-index: 1; height: 60px; line-height: 60px; padding: 0 10px 0 30px; font-size: 18px; font-weight: 600; letter-spacing: -0.88px; color: #1382f4; background-color: #f0f6ff; text-align: left; }
.recentMeet-list .conference-list-wrap {overflow-y: auto; height: calc(100% - 50px);}
.recentMeet-list .conference-list { position: relative; }
.recentMeet-list .conference-list dt { cursor: pointer; position: relative; display: flex; align-items: center; gap: 15px; padding: 0 10px 0 30px; height: 55px; box-sizing:border-box; border-bottom: 1px solid #f1f2f6; }
.recentMeet-list .conference-list dt .toggle-btn { text-indent: -9999px; width: 13px; height: 13px; border-radius: 2px; border: 1px solid #969cb0; background-color: #fff; }
.recentMeet-list .conference-list dt.active .toggle-btn { background-color: #1382f4; border: 0; }
.recentMeet-list .conference-list dt #titleName { float: unset; font-size: 16px; color: #222; font-weight: 600; letter-spacing: -0.88px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recentMeet-list .conference-list dt .conference-info { position: relative; margin-left: auto; display: flex; height: 100%; justify-content: end; align-items: center; gap: 10px; padding-top: 20px; box-sizing: border-box; }
.recentMeet-list .conference-list dt .conference-info .tt-text { display: none; }
.recentMeet-list .conference-list dt .conference-info>p { font-size: 14px; font-weight:400; letter-spacing: -0.5px; color:#9ba5c0; white-space: nowrap; }
.recentMeet-list .conference-list dt .conference-info .listTotal p { padding-left: 20px; line-height: 30px; color: #4c5266; font-size: 14px; font-weight: 500; background: url(../../images/connectplace/common/ico_Member_g.png) no-repeat left 50%/ 14px; }

.recentMeet-list .conference-list dd { display: none; background: #fff; border: 0; padding: 0; }
.recentMeet-list .conference-list dd .staff-list { padding: 0; min-height: unset; max-height: unset; height: auto; }
.recentMeet-list .conference-list dd .staff-list li { cursor: default !important; box-sizing: border-box; padding: 0; }
.recentMeet-list .conference-list dd .staff-list li:first-child { margin-top: 0; }
.recentMeet-list .conference-list dd .staff-list li:first-child .user-item { border-top: 0; }
.recentMeet-list .conference-list dd .staff-list li .user-item { height: 60px; box-sizing:border-box; border-left: 20px solid #f1f2f6; }

.recentMeet-list .conference-list dt .alladd { position: relative; opacity: 0.8; right: unset; top: unset; margin-top: 0; border-radius: 0; margin-right: 0px; min-width: 80px; height: 35px; border: 1px solid #1382f4; background-color: #fff; color: #1382f4; font-weight: 600; font-size: 15px; }
.recentMeet-list .conference-list dt .alladd:hover { cursor: default; opacity: 0.8; border: 1px solid #1382f4; background-color: #fff; color: #1382f4; }
.recentMeet-list .conference-list dt.active .alladd { opacity: 1; background-color: #1382f4; color: #fff; transition: all 0.2s; }
.recentMeet-list .conference-list dt.active .alladd:hover { opacity: 0.8; cursor: pointer; }

.recentMeet-list .data_blank { font-size: 15px; color: #999; font-weight: 500; text-align: center; padding: 20px; padding-top: 70px; background:url(../../images/connectplace/common/ico_noresult.png)no-repeat center top 20px/35px; }

/* 추가된 참석자 목록 - 회의실 예약 팝업 > 참석자 추가 팝업 > 추가된 참석자 목록 */
.attendeesAdd-cont .attendeesAdd-list { min-width: 220px; max-width: 220px; background-color: #f1f2f6; padding: 0; }
.attendeesAdd-list h3 { padding: 10px; text-align: center; color: #fff; font-weight: 600; font-size: 16px; background-color: #214368; }
.attendeesAdd-list-scroll { border-top: 0; height:auto; }
.attendeesAdd-list .staff-list { padding: 0; display: flex; flex-flow: column; gap: 5px; min-height: unset; max-height: unset; height: 470px; }
.attendeesAdd-list .staff-list li { padding: 0 10px; }
.attendeesAdd-list .staff-list li .user-item { height: 60px; box-sizing: border-box; padding: 10px 15px; background-color: #fff !important; border-bottom: 0 !important; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); }
.attendeesAdd-list .staff-list li .user-item .user-info { flex-flow: column; align-items: start; gap: 3px; height: auto; padding-left: 0; }
.attendeesAdd-list .staff-list li .user-item .user-info .name { width: 100%; padding-right: 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.attendeesAdd-list .staff-list li .user-item .user-info .team { border-left: 0; padding: 0; font-size: 13px; }
.attendeesAdd-list .staff-list li .user-item .user-info .team.visitor { color: #59a7f7; }
.attendeesAdd-list .staff-list li .user-item button.delt { background: none; text-indent: 0; width: 40px; min-width: unset; height:20px; position: absolute; right: 0; top: 0; color: #fff; background-color: #A9B4C0; font-weight: 500; font-size: 12px; transition: all 0.2s; }
.attendeesAdd-list .staff-list li .user-item button.delt:hover { opacity: 0.8; transition: all 0.2s; }
.attendeesAdd-list .user-info figure { display: none; }
.attendeesAdd-list .listTotal { display: flex; align-items: center; justify-content: end; padding: 10px; height: 30px; background-color: unset; }
.attendeesAdd-list .listTotal p { padding-left: 20px; line-height: 30px; color: #B9BFD0; font-size: 14px; font-weight: 500; background: url(../../images/connectplace/common/ico_Member_g.png) no-repeat left 50%/ 14px; }

/* layer popup */
.layer-pop-wrap .layer-pop-bg { display: none; position: fixed; left: 0; top: 0; z-index: 88888; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); transition: none; }

.layer-pop-wrap #deskResvPop.desk-resv-pop--recurring-overlay { transform: none !important; -webkit-transform: none !important; animation: none !important; -webkit-animation: none !important; z-index: 99999; }
.layer-pop-wrap #deskResvPop.desk-resv-pop--recurring-overlay .pop-desk-rsv__surface { position: relative; z-index: 1; }
.layer-pop-wrap .layer-pop-area { display: none; position: fixed; top: 50%; left: 50%; z-index: 99999; flex-direction: column; align-items: flex-start; width: auto; min-width: 400px; max-width: 640px; padding: 32px; border-radius: 12px; background: var(--clr-w100); box-sizing: border-box; box-shadow: var(--ds-e500); gap: 24px; }

.layer-pop-wrap .layer-pop-area:focus { outline: 0; }
.layer-pop-wrap .layer-pop-area.lg { width: 600px; }
.layer-pop-area.xlg { max-width: 700px; width: auto; }
.layer-pop-wrap .layer-pop-area.active { display: flex;}

.layer-pop-wrap .layer-pop-area .pop-head { display: flex; padding-bottom: 16px; justify-content: flex-end; align-items: flex-start; gap: 24px; align-self: stretch; border-bottom: 1px solid var(--clr-w300);}
.layer-pop-wrap .layer-pop-area .pop-head h2 { max-height: 62px; flex: 1 0 0; font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: #141414; line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area .pop-head .pop-close { width: 16px; height: 16px; background: url("../../images/connectplace/common/close_w.png") no-repeat 50%; position: absolute; top: 50%; right: 30px; margin-top: -8px; text-indent: -9999px; transition: all 0.4s; }
.layer-pop-wrap .layer-pop-area .pop-head .pop-close:hover { cursor: pointer; transform: rotate(180deg); transition: all 0.4s; opacity: 1;}

.layer-pop-wrap .layer-pop-area .pop-cont { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-wrap .layer-pop-area .pop-cont.type2 { padding: 0; }

/* ----- 팝업 내(상단) 탭버튼 메뉴 */
.pop-cont .tab-btn { display: flex; width: 100%; height: 45px; justify-content: space-between; gap: 1px; margin-top: -1px; background-color: #fff;}
.pop-cont .tab-btn li{ width: 100%; height: 100%;}
.pop-cont .tab-btn li button { width: 100%; height: 100%; background-color: #06315f; color: #fff; font-size: 18px; letter-spacing: -0.88px; font-weight:600; box-sizing: border-box;}
.pop-cont .tab-btn li:hover button { opacity: 1; background-color:#03274F; background-image: linear-gradient(to top, #06315f, #03274F); transition: all 0.3s; box-sizing: border-box; outline: 0;}
.pop-cont .tab-btn li button.on { opacity: 1; border: 0; color: #fff; background: #1382f4; font-weight: 600; box-sizing: border-box; }
.pop-cont .tab-btn li:hover button.on { opacity: 1; cursor: default; }

.pop-cont .tab-btn li button img { display: inline-block; width: 18px; margin-right: 5px; margin-top: -2px; }
.pop-cont .tab-btn>div { min-width: 220px;box-sizing: border-box; background-color: #f1f2f6; font-size: 17px; font-weight: 600; color: #4c5266; line-height: 45px; text-align: center; }

/* ----- 팝업 내(하단) 버튼 */
.pop-btn-area { display: flex; align-items: center; justify-content: flex-end; align-self: stretch; gap: 8px; }
.pop-btn-area button.popbtn.og.google { width: 165px; height: 50px; border: 1px solid #666; border-radius: 36px; background: #fff; }
.pop-btn-area button.popbtn.og.google span { display: inline-block; font-size: 16px; color: #666; background: url(../../images/mcc/login_google_icon.png) no-repeat 0 50%; padding-left: 25px; }

.layer-pop-wrap .layer-pop-area.first-login {position: absolute; top: 50%; left: 50%; width: 460px; padding: 50px 30px; margin-top: -250px; margin-left: -230px; box-sizing: border-box;background-color: #fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}
.first-login .close_btn { position: absolute; top: 30px; right: 30px; width: 16px; height: 16px; margin-top: -8px;}
.first-login .close_btn img{display: inline-block; width: 100%;}
.first-login .close_btn:hover{ cursor: pointer; transform: translateY(5.5px) rotate(180deg); transition: all 0.3s; opacity: 1;}
.first-login h2 { font-size: 24px; font-weight: 600; line-height:1.5; text-align: center; color: #1382f4; }
.first-login .complete_box { width: 60%; margin: 20px auto; }
.first-login .complete_box > img { width: 100%;}
.first-login h5 { margin-top: 20px; font-size: 16px; font-weight: 500; line-height: 1.4; text-align: center; color: #4c5266; }
.first-login .reg_btn { width: 80%; margin: 30px auto 0; height: 60px; background-color: #0f447c;}
.first-login .reg_btn > a { display: block; width: 100%; height: 100%; line-height: 60px; font-size: 16px; font-weight: 500; text-align: center; color: #fff; }

/* layer popup 회의실 예약 팝업 */
.layer-pop-wrap .layer-pop-area[data-role-popup="meetingRoomAdd"] { width: 580px;}
.layer-pop-wrap .layer-pop-area[data-role-popup="meetingRoomAdd"] .pop-cont { padding: 0 0 30px; }
.layer-pop-wrap .layer-pop-area[data-role-popup="meetingRoomAdd"] .ui-selectmenu-button.ui-button {border: 0; outline: 1px solid #ddd; }
.layer-pop-wrap .layer-pop-area[data-role-popup="meetingRoomAdd"] .ui-selectmenu-button.ui-button:focus { outline: 1px solid #59a7f7;  }
.layer-pop-wrap .layer-pop-area[data-role-popup="meetingRoomAdd"] .inputform__row__colm input[type="text"].datepicker { min-width: 255px; max-width: 255px; }

/* layer popup 회의실 예약 수정 팝업 */
.layer-pop-wrap .layer-pop-area.modify .meeting-room-add #recurringModify{display: flex; align-items: center; justify-content: start; gap: 10px;}
.layer-pop-wrap .layer-pop-area.modify .meeting-room-add #recurringModify button{width: auto; height: 35px; padding:0 15px 0 35px; white-space: nowrap;background-color: #f0f6ff; font-size: 15px; color: #59a7f7; font-weight:500;
    background-image: url(../../images/connectplace/common/ico_repeat-bl.png); background-repeat: no-repeat; background-position: left 15px center; background-size: 12px;}
.layer-pop-wrap .layer-pop-area.modify .meeting-room-add .summary{word-break: keep-all; letter-spacing: -0.88px; background-image: unset; padding-left: 0;}

/* layer popup 회의실 예약 팝업 > 참석자 추가 팝업 */
.layer-pop-wrap .layer-pop-area[data-role-popup="attendeesAdd"] { width: 900px; max-width: 900px;}
.layer-pop-area[data-role-popup="attendeesAdd"] .pop-btn-area { border-top: 1px solid #f4f5f8; }
.layer-pop-wrap .layer-pop-area[data-role-popup='imagesPop'] .pop-cont.p0 img { width: 100% !important; min-height: 410px; height: auto !important; }
.layer-pop-wrap .layer-pop-area[data-role-popup='viewMapPop'] .pop-cont.p0 img { display: inline-block; width: 100%; min-height: 460px; }

/* layer popup 상세보기 팝업 */
.layer-pop-area.roomDetail .pop-cont .room-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-area.roomDetail .pop-cont .room-info .scale { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); letter-spacing: -0.24px; border: 1px solid var(--clr-p600); border-radius: 4px; box-sizing: border-box; }
.layer-pop-area.roomDetail .pop-cont .room-info .title { line-height: 30px; font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.4px; }
.layer-pop-area.roomDetail .pop-cont .room-info .device { display: flex; align-items: flex-start; align-content: flex-start; align-self: stretch; gap: 6px; flex-wrap: wrap; }
.layer-pop-area.roomDetail .pop-cont .room-info .device .badge { display: flex; align-items: center; justify-content: center; min-width: 40px; height: 20px; padding: 0 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t300); letter-spacing: -0.24px; border: 1px solid var(--clr-w400); border-radius: 4px; box-sizing: border-box; }
.layer-pop-area.roomDetail .pop-cont .map-img-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; padding-top: 12px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .sub-title { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); letter-spacing: -0.28px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info { display: flex; width: 100%; height: 180px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info iframe { width: 100%; height: 100%; border-radius: 6px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info-empty { display: flex; align-items: center; justify-content: center; width: 100%; height: 180px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info-empty .map-empty-box { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info-empty .map-empty-box div { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; padding: 20px; background-color: var(--clr-w400); aspect-ratio: 1/1; opacity: 0.6; border-radius: 12px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info-empty .map-empty-box div .icon-map-empty { width: 40px; height: 40px; background: url("/figma/svg/subtract_white.svg") no-repeat center; opacity: 0.8; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .map-info .info-empty .map-empty-box span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: -0.28px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .img-info { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .img-info .sub-title { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); letter-spacing: -0.28px; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .img-info .info { display: flex; width: 100%; height: 180px; border: 1px solid var(--clr-w300); border-radius: 6px; box-sizing: border-box; }
.layer-pop-area.roomDetail .pop-cont .map-img-box .img-info .info img { width: 100%; height: 100%; border-radius: 6px; }

/* 위치보기 팝업, 이미지보기 팝업, alert */
.meeting-room-images img { width: 100%; }

/* 입력 필드 - 회의실예약, 회의실예약상세, 좌석예약 상세, 수면캡슐예약 */
.inputform { padding: 15px 30px 0; box-sizing: border-box; }
.inputform__tit { font-size: 18px; font-weight: 600; margin-bottom: 10px; text-align: left; color: #5a6681; }

.inputform > .inputform__row { margin: 0; width: 100%; overflow: unset; display: flex; align-items: center; justify-content: start; }
.inputform__row.time { overflow: initial; display: flex; align-items: center; justify-content: space-between; gap: 10px;}
/* .inputform__row.time > .inputform__row__colm { width: calc(50% - 5px) !important; }  */
.inputform__row.time .recurring-layout, .inputform__row.time .recurring-layout .recurring-select { width: 100%; }
.inputform__row.time .input-group { display: flex; align-items: center; gap: 5px; justify-content: space-between; position: relative; width: 100%; }
.inputform__row.time .input-group .time-select-wrap{width: 100%;}
.inputform__row.time .input-group input { display: inline-block; background-image: url(../../images/connectplace/common/ico_time.png); background-repeat: no-repeat; background-position-y: 50%; background-position-x: calc(100% - 10px); border: 1px solid rgba(0, 0, 0, 0.08); height: 44px; max-width: 115px; width: auto; font-size: 16px; color: #5f6b8b; padding: 0 15px; cursor: pointer; box-sizing: border-box; }
.inputform__row.time .input-group input:disabled{opacity: 0.5; cursor: default;}
.inputform__row.time .input-group input:focus { border: 1px solid #59a7f7; outline: 0; }
.inputform__row.time .input-group input:disabled { opacity: .5; cursor: default;}
.inputform__row.time .time-select-wrap{width: 100%;}

.inputform__row.video ul { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; }
.inputform__row.video ul li { display: flex; align-items: center; justify-content: center; min-width: 100px; width: 100%; height: 60px; background-color: #f5f6f8; }
.inputform__row.video ul li.on { background-color: #f0f6ff; }
.inputform__row.video ul li:hover { cursor: pointer; opacity: 0.8; }
.inputform__row.video ul li img { display: inline-block; height: 35px; width: auto; }

.inputform__row ~ .inputform__row { clear: both; padding-top: 15px; }

.inputform__row__colm { float: left; box-sizing: border-box; padding: 0; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; width: 100%; }
.inputform__row__colm > .inputform__row { margin: 0; width: 420px; margin-right: 10px; overflow: unset; }
.inputform__row__colm#divChangeTitle1 { position: relative; width: 190px; }
.inputform__row__colm#divChangeTitle1 .select-box { width: 100%; min-width: 190px }
.inputform__row__colm#divChangeTitle1 .select-box .select-list { max-height: 140px; top: 45px; }
.inputform__row__colm#divChangeTitle1.fix-title { position: relative; width: 100%; }
.inputform__row__colm#divChangeTitle2 { display: block; width: calc(100% - 200px); margin-left: 10px; }
.inputform__row__colm#divChangeTitle2.fix-title { display: none; }


.checkPrivateYn { float: right; margin-top: 5px; }
.checkPrivateYn label { font-size: 14px; color: #666; }
.checkPrivateYn label input { margin-top: -1px; cursor: pointer; }

.inputform__row__colm input[type="text"] { height: 44px; width: 100%; box-sizing: border-box; padding-left: 10px; font-size: 15px; color: #222; border: 1px solid rgba(0, 0, 0, 0.1); }
.inputform__row__colm input[type="text"].datepicker { width: 100%; height: 44px; border-radius: 0; border: 1px solid rgba(0, 0, 0, 0.1); min-width: 160px; max-width: 160px; font-size: 16px; color: #5f6b8b; padding: 0 15px; cursor: pointer; box-sizing: border-box; }
.inputform__row__colm input[type="text"]:focus { outline: 0; border: 1px solid #59a7f7; }

.inputform__row__colm textarea { height: 80px; width: 100%; box-sizing: border-box; padding: 10px 10px; font-size: 15px; color: #222; border: 1px solid rgba(0, 0, 0, 0.1); resize: none; }
.inputform__row__colm textarea:focus { outline: 0; border: 1px solid #59a7f7; }

.inputform__row__colm select { height: 44px; width: 100%; box-sizing: border-box; padding: 0 23px 0 10px; font-size: 15px; color: #5f6b8b; border: 1px solid #ddd; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: #fff; background: url(../../images/connectplace/common/ico_triangle_down_b.svg) no-repeat right 10px center / 8px; }
.inputform__row__colm select:focus { outline: 0; border: 1px solid #1382f4; background: url(../../images/connectplace/common/ico_triangle_up_b.svg) no-repeat right 10px center / 8px; }
.inputform__row__colm select::-ms-expand { display: none; }
.inputform__row__colm select.timepick { background-image: url("../../images/connectplace/common/time_icon.png"); background-repeat: no-repeat; background-position: right 10px top 50%; }

.inputform__row__colm .input-layout { overflow: hidden; margin: 0 -5px; }
.inputform__row__colm .input-layout li { float: left; padding: 0 5px; box-sizing: border-box; text-align: center; }
.inputform__row__colm .input-layout li .intxt {display: none;}

.inputform__row__colm .img-layout { margin-top: 8px; }
.inputform__row__colm .img-layout img { height: 45px; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; cursor: pointer; }
.inputform__row__colm .img-layout img:nth-child(1) { opacity: 0.3; margin-right: 22px; }
.inputform__row__colm .img-layout img:nth-child(2) { opacity: 0.3; margin-right: 15px; }
.inputform__row__colm .img-layout img:nth-child(3) { opacity: 0.3; margin-right: 12px; }
.inputform__row__colm .img-layout img:nth-child(4) { opacity: 0.3; }

.inputform__row__colm dl dt { display: block; font-size: 14px; color: #666; margin-bottom: 5px; }
.inputform__row__colm dl dd { font-size: 15px; color: #222; }

.inputform__row__colm.apply { width: 100%; padding: 10px 0; background-color: #e6f0ff; }
.inputform__row__colm.apply h4 { display: flex; flex-flow: column; align-items: center; justify-content: center; width: 100%; gap: 5px; color: #343f5b; font-weight: 500; font-size: 18px; }
.inputform__row__colm.apply strong { margin-right: 0; color: #1382f4; font-size: 22px; font-weight: 600; }
.inputform__row__colm.apply p { margin-top: 5px; font-size: 15px; width: 100%; text-align: center; font-weight: 400; color: #999; }

.inputform__row__colm label { display: block; font-size: 14px; color: #666; margin-bottom: 5px; cursor: default; }
.inputform__row__colm > label { width: 100%; font-weight: 600; color: #1382f4; font-size: 15px; }

.inputform__row.perfume { position: relative; }
.inputform__row.perfume .checkYn { position: absolute; right: 0; top: 20px; }
.inputform__row.perfume #perfumeTooltipImg img { display: inline-block; width: 15px; opacity: 0.8;}

.inputform__row.perfume .tab-menu-box { width: 100%; margin-top: 5px; padding-bottom: 10px; border-bottom: 1px solid rgba(0, 0, 0, 0.08); display: flex; flex-flow: row nowrap; }
.inputform__row.perfume .tab-menu-box li { font-size: 16px; font-weight: 500; color: #4c526680; line-height: 1; }
.inputform__row.perfume .tab-menu-box li.tab-menu01.click, .inputform__row.perfume .tab-menu-box li.tab-menu02.click { font-weight: 600; color: #4c5266; }
.inputform__row.perfume .tab-menu-box .tab-menu01 { cursor: pointer; margin-right: 10px; }
.inputform__row.perfume .tab-menu-box .tab-menu02 { cursor: pointer; border-left: 1px solid #4c526630; padding-left: 10px; }
.inputform__row.perfume .tab-menu-box .no-use { cursor: pointer; margin-left: 280px; font-size: 16px; color: #666; margin-bottom: 0; }

.inputform__row.perfume .tab-content01 { display: block; display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; margin-top: 10px; }
.inputform__row.perfume .tab-content02 { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; margin-top: 10px; }
.inputform__row.perfume .tab-content01 li { width: 18.5%; height: 35px; font-size: 15px; line-height: 35px; color: #5a6681; font-weight: 500; text-align: center; border: 1px solid rgba(0, 0, 0, 0.08); cursor: pointer; }
.inputform__row.perfume .tab-content02 li { width: 23%; height: 35px; font-size: 15px; line-height: 35px; color: #5a6681; font-weight: 500; text-align: center;border: 1px solid rgba(0, 0, 0, 0.08); cursor: pointer; }
.inputform__row.perfume .tab-content01 li.click, .inputform__row.perfume .tab-content02 li.click { background-color: #f0f6ff; border: 1px solid #1382f420; color: #1382f4; }
.inputform__row.perfume .tab-content01 li.no, .inputform__row.perfume .tab-content02 li.no { color: #aaa; border: 1px solid #ccc; /*background-color: #ededed; */}

.input-style { height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd; background-color: #fff; }
.input-style:disabled { background-color: #fafafa; opacity: 1; }
.input-style.inline { width: auto; }

.select-style { height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 12px; background-image: url("../../images/connectplace/common/select_arrows.png"); background-repeat: no-repeat; background-position: right 10px top 50%; background-color: #fff; }
.select-style::-ms-expand { display: none; }
.select-style:disabled { background-color: #fafafa; opacity: 1; }
.select-style.inline { width: auto; padding-right: 25px; }

.calendarInput:focus { cursor: pointer; border-color: #aaa; outline: none; min-width: 160px !important; box-shadow: 0 0 0 2px -moz-mac-focusring; -webkit-box-shadow: 0 0 0 2px -moz-mac-focusring; color: #222;}

.datepicker-style { display: inline-block; position: relative; }
.datepicker-style input[type="text"] { height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd;}
.datepicker-style input[type="text"]::-ms-clear { display: none; }
.datepicker-style .ui-datepicker-trigger { width: 35px; height: 35px; position: absolute; text-indent: -9999px; top: 50%; right: 0; transform: translateY(-50%); background: url("../../images/connectplace/common/ico_calendar.png") no-repeat 50%/18px; }

.ui-selectmenu-button.ui-selectmenu-button-closed{outline: 0;}
.ui-selectmenu-button.ui-button:focus,.ui-selectmenu-button.ui-button:active,
.ui-selectmenu-button.ui-selectmenu-button-open{ outline: 1px solid #59a7f7; background-color: #Fff !important; background-image: url(../../images/connectplace/common/ico_time.png) !important; background-repeat: no-repeat !important; background-position-y: 50% !important; background-position-x: calc(100% - 8px) !important; }
.ui-selectmenu-text { display: inline-block; width: 100%; height: 100%; font-size: 16px; padding: 0; margin-right: 0; color: #5f6b8b; cursor: pointer; height: 44px; line-height: 44px; box-sizing: border-box; }

.timepick { background-image: url("../../images/connectplace/common/time_icon.png"); background-repeat: no-repeat; background-position: right 10px top 50%; height: 36px; width: 100%; box-sizing: border-box; padding: 0 5px; font-size: 15px; color: #222; border: 1px solid #ddd;}

/* input 검색 */
.search-input { display: block; position: relative; }
.search-input input[type="text"] { padding-right: 35px; }
.search-input .search-icon { width: 35px; height: 35px; position: absolute; top: 50%; right: 5px; background: url(../../images/connectplace/common/ico_search.png) no-repeat center/20px; text-indent: -9999px; z-index: 9; transform: translateY(-50%); }

/* 밀집도 팝업 :회의실 예약 > 상세보기 팝업 > 밀집도 팝업*/
#bitsensingPop.active { display: block; }
#bitsensingPop .room-info { padding: 10px 0; background-color: #f5f5f5; }
#bitsensingPop .room-info p { font-size: 16px; font-weight: 500; color: #5b6884; text-align: center; }
#bitsensingPop .room-info>span { display: inline-block; width: 100%; font-size: 14px; font-weight: 400; color: #1382f4; text-align: center; }
#bitsensingPop .bitsensing { margin-top: 20px; display: flex; flex-flow: row nowrap; align-items: start; justify-content: start; }
#bitsensingPop .bitsensing .tit { width: 100%; font-size: 18px; font-weight: bold; color: #1382f4; margin-bottom: 10px; display: block; text-align: left; }
#bitsensingPop .bitsensing .tit span { font-size: 14px; font-weight: 400; color: #5b6884; margin-left: 10px; }
#bitsensingPop .bitsensing .detail-bitsensing01 { width: 40%; }
#bitsensingPop .bitsensing .bitsensing_box { border-radius: 0; height: auto; position: relative; width: 100%; min-height: 200px; max-height: 250px; background: url(../../images/img/test_densityRoom.PNG) no-repeat center / cover; overflow: hidden;box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2);}
#bitsensingPop .bitsensing .bitsensing_box .color_box { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; border-radius: 100px; -webkit-filter: blur(30px); filter: blur(30px); opacity: 0.75; }
#bitsensingPop .bitsensing .detail-bitsensing02 {display: flex; flex-flow: column nowrap;justify-content: start; height: auto; padding-top: 0; width: 60%; padding-left: 10px; box-sizing: border-box; }
#bitsensingPop .bitsensing .detail-bitsensing02 .title { font-size: 16px; font-weight: 500; color: #343f5b; margin-bottom: 0; }
#bitsensingPop .bitsensing .detail-bitsensing02>div { margin-bottom: 10px; margin-left: 5px; box-sizing: border-box; }
#bitsensingPop .bitsensing .section01 { position: relative; width: 100%; }
#bitsensingPop .bitsensing .section01 #time-range p { position: absolute; top: 0; right: 0; text-align: right; font-size: 14px; font-weight: 400; color: #5b6884; }
#bitsensingPop .ui-widget.ui-widget-content { border: 0px; height: 5px; margin-top: 10px; }
#bitsensingPop #slider-range { border-radius: 0; background-color: #f0f6ff; box-shadow: 1px 2px 2px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 2px 2px rgba(0, 0, 0, .1);}
#bitsensingPop .ui-slider-horizontal { background: #ddd; width: calc(100% - 40px); height: 5px; border-radius: 10px; background: #eee; }
#bitsensingPop .ui-slider-horizontal .ui-slider-range { height: 50%; overflow: hidden; }
#bitsensingPop .ui-slider-horizontal .ui-slider-handle { top: -.5em; margin-left: -.6em; border: 0px; margin-left: -2px !important; }

#bitsensingPop .ui-slider { position: relative; text-align: left; }
#bitsensingPop .ui-slider .ui-slider-handle { position: absolute; display: flex; align-items: center; justify-content: center; background: #fff; z-index: 2; width: 20px; height: 20px; border-radius: 50%; cursor: default; border: none; cursor: pointer; }
#bitsensingPop .ui-slider .ui-slider-handle:after { content: ""; position: relative; width: 7px; height: 7px; border-radius: 10px; background: #1382f4; top: unset; margin: 0; left: unset; }

#bitsensingPop .ui-slider-handle.ui-corner-all.ui-state-default:hover,
#bitsensingPop .ui-slider-handle.ui-corner-all.ui-state-default:active { transform: scale(1.2); border: 0px; }
#bitsensingPop .ui-slider-handle.ui-corner-all.ui-state-default:first-child { display: none; }
#bitsensingPop .ui-slider-handle.ui-corner-all.ui-state-default:nth-child(2) { position: absolute; top: -5px; width: 15px; height: 15px; -webkit-animation-name: handle; animation-name: handle; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-duration: 24s; animation-duration: 24s; -webkit-animation-timing-function: linear; animation-timing-function: linear; pointer-events: auto; }
#bitsensingPop .ui-state-default,
#bitsensingPop .ui-widget-content .ui-state-default { border: 0px !important; box-shadow: 1px 2px 2px rgba(0, 0, 0, .3); -webkit-box-shadow: 1px 2px 2px rgba(0, 0, 0, .3);}
#bitsensingPop .ui-state-hover,
#bitsensingPop .ui-slider-handle.ui-corner-all.ui-state-default:active,.ui-slider-handle { transform: scale(1) !important; cursor: pointer; outline: 0px; }
#bitsensingPop .ui-state-active,
#bitsensingPop .ui-widget-content .ui-state-actvie { background-color: #fff; border: 0px; }
#bitsensingPop .sliders_step1 { position: relative; }
#bitsensingPop .sliders_step1 #slider-bar { border-radius: 0; position: absolute; top: 0; left: 0; -webkit-animation-name: gauge; animation-name: gauge; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; height: 5px; background-color: #68b2fc; -webkit-animation-duration: 24s; animation-duration: 24s; -webkit-animation-timing-function: linear; animation-timing-function: linear; }
#bitsensingPop .detail-bitsensing02 .play_box { position: absolute; top: 32px; right: 0px; width: 35px; padding: 0 5px; box-sizing: border-box; display: flex; flex-flow: row nowrap; justify-content: space-between; }
#bitsensingPop .detail-bitsensing02 .play_box span { display: inline-block; cursor: pointer; width: 10px; height: 10px; }
#bitsensingPop .detail-bitsensing02 .play_box span.play { display: none; background: url(../../images/connectplace/common/ico_play.png) no-repeat center; }
#bitsensingPop .detail-bitsensing02 .play_box span.pause { background: url(../../images/connectplace/common/ico_pause.png) no-repeat center; }
#bitsensingPop .detail-bitsensing02 .play_box span.stop { background: url(../../images/connectplace/common/ico_stop.png) no-repeat center; }
#bitsensingPop .detail-bitsensing02 .play_box span:hover { opacity: 0.8; }

#bitsensingPop .bitsensing .timeLineDiv1 { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; height: 5px; background-color: #fff; overflow: hidden; box-shadow: 1px 2px 5px rgba(0, 0, 0, .1); -webkit-box-shadow:1px 2px 5px rgba(0, 0, 0, .1); margin-top: 15px; }
#bitsensingPop .bitsensing .timeLineDiv1>div { height: 100%; width: 100%; }
#bitsensingPop .bitsensing .timeLineDiv1 .timeline_0 { background-image: linear-gradient(to right, #DE3106, #F78B1F, #FDEF51, #F78B1F); }
#bitsensingPop .bitsensing .timeLineDiv1 .timeline_1 { background-image: linear-gradient(to right, #F78B1F, #FDEF51, #48EAF0, #FDEF51); }
#bitsensingPop .bitsensing .timeLineDiv1 .timeline_2 { background-image: linear-gradient(to right, #FDEF51, #5DD939, #FDEF51, #F78B1F); }
#bitsensingPop .bitsensing .timeLineDiv1 .timeline_3 { background-image: linear-gradient(to right, #F78B1F, #5DD939, #5DD939, #48EAF0); }

/* ///////// 밀집도 - keyframes ///////// */
:root { --handle-left: 0%; --gauge-width: 0%; }
@-webkit-keyframes handle {
    from { left: var(--handle-left); }
    to { left: 100%; }
}
@keyframes handle {
    from { left: var(--handle-left); }
    to { left: 100%; }
}
@-webkit-keyframes gauge {
    from { width: var(--gauge-width); }
    to { width: 235.45px; }
}
@keyframes gauge {
    from { width: var(--gauge-width); }
    to { width: 235.45px; }
}
#bitsensingPop .bitsensing .range-wrap { width: 100%; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; margin-top: 10px; }
#bitsensingPop .bitsensing .range-wrap li { font-size: 12px; font-weight: 500; color: #5b6884 }
#bitsensingPop .bitsensing .range-wrap>li { width: 100%; }
#bitsensingPop .bitsensing .range-wrap>li:first-child { width: -webkit-min-content; width: -moz-min-content; width: min-content; min-width: 25px; margin-right: 5px; text-align: left; }
#bitsensingPop .bitsensing .range-wrap>li:last-child { width: -webkit-min-content; width: -moz-min-content; width: min-content; min-width: 25px; margin-left: 5px; text-align: right; }
#bitsensingPop .bitsensing .range-wrap>ul { width: 100%; height: 20px; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding: 5px 10px; background-image: linear-gradient(to right, #DE3106, #F78B1F, #FDEF51, #5DD939, #48EAF0); }
#bitsensingPop .bitsensing .range-wrap>ul>li { color: #fff; font-size: 12px; font-weight: 500; }

#bitsensingPop .bitsensing .section02 { width: 100%; padding-top: 5px; border-top: 1px solid #f1f1f1; }

#bitsensingPop .bitsensing_info_box { display: flex; height: auto; flex-flow: row nowrap; align-items: start; justify-content: space-between; margin-top: 10px; gap: 10px; }
#bitsensingPop .bitsensing_info_box>li { display: block; height: auto; box-shadow: unset; -webkit-box-shadow: unset; overflow: unset; width: 100%; border-radius: 3px; background-color: #f0f6ff; padding: 10px 5px; box-sizing: unset; }
#bitsensingPop .bitsensing_info_box>li:last-child { min-width: 35%; }
#bitsensingPop .bitsensing_info_box .ko_tit { white-space: nowrap; width: 100%; font-size: 16px; font-weight: 500; color: #5b6884; text-align: center; margin-bottom: 10px; }
#bitsensingPop .bitsensing_info_box>li .time_info { width: 100%; display: unset; word-spacing: unset; line-height: unset; font-size: unset; font-weight: unset; }
#bitsensingPop .bitsensing_info_box>li .time_info span { display: inline-block; width: 100%; white-space: nowrap; color: #343f5b; font-weight: 600; font-size: 16px; text-align: center; }

/* 회의실 예약 :예약된 회의 목록 팝업 */
.pop_list_box { padding: 20px 40px 30px; }
.pop_list_box .meetingroom_info .tit { display: block; font-size: 20px; font-weight: 500; text-align: center; word-break: keep-all; color: #222; line-height: 1.5; }
.pop_list_box .meetingroom_info .tit span { display: block; color: #1382f4; font-weight: 600; }
.pop_list_box .rsv_list_box { margin-top: 0; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; }

/* 반복 예약 */
.inputform + div {clear: both; }
.recurring-layout li {display: flex;flex-flow: row nowrap;position: relative; }
.recurring-layout .recurring-img {display: none;position: absolute;left: 10px;top: 7px; }
.recurring-layout .recurring-img img { display: none; }

.recurring-layout .recurring-select {position: relative;min-width: 120px !important; width: auto; padding: 0; box-sizing: border-box; }
.recurring-select .selected {width: 100%; height: 100%;background-color: #fff;box-sizing: border-box;cursor: pointer;text-align: left; background: center right 8px no-repeat;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; border-radius: 0; font-size: 16px; color: #4c5266; font-weight: 400; border: 0; padding: 0 23px 0 15px; }
.recurring-select .selected.on { background: none; }
.recurring-select ul {display: none;width: 100%;border: 1px solid #ddd;background: #fff;box-sizing: border-box;box-shadow: 2px 0px 3px #33333310;border-radius: 5px; }
.recurring-select .selected.on + ul {display: block;position: absolute !important;z-index: 1 !important;top: 47px;right: 0; border: 0; }
.recurring-select ul li {height: 47px;box-sizing: border-box;overflow: hidden; }
.recurring-select ul button {width: 100%;padding: 7px 10px;border: none;font-size: 15px;background-color: #fff;border-radius: 0;cursor: pointer;text-align: center;color: #222;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }
.recurring-select ul li button:hover,.recurring-select ul li button:focus {background-color: #ededed; }

.recurring-wrap { position: absolute; display: none; top: 0; left: 0; min-width: 400px; max-width: 640px; padding: 32px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 12px; background-color: var(--clr-w100); box-shadow: var(--ds-e500); z-index: 2; }
.recurring-wrap.active { display: flex; }

/* 좌석 반복 예약: 크기는 기본 .recurring-wrap(min/max) + 콘텐츠 폭 유지, 위치만 뷰포트 중앙 */
#recurringDeskResv.recurring-wrap {
	position: fixed;
	inset: 0;
	width: fit-content;
	height: fit-content;
	max-height: min(90vh, calc(100vh - 48px));
	margin: auto;
	z-index: 100000;
}
/* popOpenLevel2가 top/left/margin 인라인 지정 — recurring는 inset + margin:auto 중앙 유지 */
#recurringDeskResv.recurring-wrap.active {
	margin: auto !important;
}

.recurring-wrap .head h2 { max-height: 62px; align-self: stretch; color: #141414; line-height: var(--txt-line-height); font-weight: var(--txt-weight-bold); font-size: var(--txt-size-18); }
.recurring-wrap .inputform { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; align-self: stretch; padding: 0; }
.recurring-wrap .recurring_inputform__row { display: flex; align-items: center; gap: 16px; align-self: stretch; }
.recurring-wrap .recurring_inputform__row.recurring_option { align-items: flex-start; }
.recurring-wrap .recurring_inputform__row .tit { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;  color: var(--txt-color-t900); text-overflow: ellipsis;  font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.recurring-wrap .recurring_inputform__row.recurring_option .tit { display: flex; height: 36px; align-items: center; }
.recurring-wrap .recurring_inputform__row .recurring-step-wrap { display: flex; width: 269px; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; }

.recurring-wrap .inputform .inputform__row__colm > span {display: inline-block;position: relative; }
.recurring-wrap .inputform .inputform__row__colm .datepicker {width: 100%;height: 40px;border-radius: 0;border: 1px solid #ddd;font-size: 16px;color: #353535;padding-left: 10px;cursor: pointer; }
.recurring-wrap .inputform .inputform__row__colm .ui-datepicker-trigger {position: absolute;width: 30px;height: 30px; top: 50%; right:5px;background: url("../../images/connectplace/common/ico_calendar.png") no-repeat 50%; background-size: 18px; text-indent: -9999px; transform: translateY(-50%); }

.recurring-step { display: flex; height: 36px; align-items: center; gap: 16px; align-self: stretch; }

.recurring-wrap .inputform__row__colm { justify-content: start; width: auto; }

.recurring-wrap .checkWeekend {display: none; min-width: 88px; align-items: center; align-self: stretch; }
.recurring-wrap .checkWeekend.on {display: flex; }
.recurring-wrap .checkWeekend label { display: flex; cursor: pointer; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; white-space: nowrap; padding: 10px; background-color: #f0f6ff; color: #1382f4; border-radius: 5px; margin-bottom: 0; }
.recurring-wrap .checkWeekend label input { cursor: pointer; margin: 0; height: auto; margin-right: 5px; padding: 0; box-sizing: border-box; }
.recurring-wrap .checkMonth {display: none; min-width: 88px; align-items: center; align-self: stretch; }
.recurring-wrap .checkMonth.on {display: flex; }
.recurring-wrap .checkMonth label { display: flex; cursor: pointer; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; white-space: nowrap; padding: 10px; background-color: #f0f6ff; color: #1382f4; border-radius: 5px; margin-bottom: 0; }
.recurring-wrap .checkMonth label input { cursor: pointer; margin: 0; height: auto; margin-right: 5px; padding: 0; box-sizing: border-box; }
/* Desk Index: 주말 포함 selectBox */
.recurring-wrap .checkWeekend > .time-select-wrap { width: 100%; max-width: 100%; }

/* 반복 예약: 네이티브 select — ui-selectmenu 미사용, cp 기본 폭(120px) 덮어씀 */
.recurring-wrap .recurring-desk-select-wrap { width: 100%; max-width: 100%; box-sizing: border-box; }
.recurring-wrap select.select_box.recurring-desk-select {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100%;
	box-sizing: border-box;
}

.recurring-wrap .recurring_inputform__row.week, .recurring-wrap .recurring_inputform__row.month {display: none; height: 36px; align-items: center; gap: 8px; align-self: stretch; }
.recurring-wrap .recurring_inputform__row.week ul, .recurring-wrap .recurring_inputform__row.month ul {display: none; }
.recurring-wrap .recurring_inputform__row.week.on { display: flex; }
.recurring-wrap .recurring_inputform__row.week.on ul { display: flex; height: 36px; align-items: center; gap: 8px; align-self: stretch; }
.recurring-wrap .recurring_inputform__row.week li { display: flex; height: 36px; padding: 14px 12px; justify-content: center; align-items: center; gap: 4px; flex: 1 0 0;  border-radius: 6px; background: var(--clr-w200); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
.recurring-wrap .recurring_inputform__row.week li.on { background: var(--clr-p200); color: var(--txt-color-p600); border: 0;cursor: pointer; }
.recurring-wrap .msg { display: flex; height: 44px; padding: 12px; justify-content: center; align-items: center; gap: 8px; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
#recurringDeskResv #recurringMsg::before { content: ""; flex-shrink: 0; width: 16px; height: 16px; background: url(../../../figma/svg/repeat_lightgray_16.svg) no-repeat center / 16px 16px; }

.recurring-wrap .pop-btn-area { display: flex; justify-content: flex-end; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; padding: 0; }
.recurring-wrap .pop-btn-area .popbtn { height: 50px; width: 180px; border-radius: 0; font-size: 17px; font-weight: 600; color: #5a6681; border: 1px solid #5a6681; outline: 0; }
.recurring-wrap .pop-btn-area .popbtn.og { background: #0f447c; border: 0; color: #fff; outline: 0; }
.recurring-wrap .pop-btn-area .popbtn.og:hover { background-color: #06315f; transition: all 0.4s ease; outline: 0px; border: 0px; opacity: 1; }

.meeting-room-add .summary {display: none;clear: both;width: 100%;padding: 5px 20px;box-sizing: border-box;font-size: 14px;text-overflow: ellipsis;background-image: url(../../images/connectplace/common/ico_repeat-bl.png);background-repeat: no-repeat; background-size: 13px; background-position: left 0 top 50%; color: #59a7f7; }
.meeting-room-add .summary .date {margin-right: 5px; }

.meeting-room-view .head .recurring {margin-top: 5px;font-size: 14px;font-weight: 500;color: #ccc;padding-left: 20px;box-sizing: border-box;background-image: url(../../images/connectplace/common/icon_recurring_w.png);background-repeat: no-repeat;background-position: left center;background-size: 16px; }

.recurring-layout .recurring-btn {position: relative;width: 105px; }
.recurring-layout .recurring-btn button {width: 100%;padding: 0 10px 0 30px;font-size: 15px;line-height: 36px;background-color: #fff;border: 1px solid #ddd;box-sizing: border-box;border-radius: 5px;cursor: pointer;text-align: center;color: #222;background: none;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }

/* 알림 팝업 */
.alert-message { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.alert-message span { font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); }

/* 예약 불가 알림 팝업 */
.layer-pop-area.unavailable { flex-direction: column; align-items: flex-start; gap: 24px; width: 400px; padding: 24px; }
.layer-pop-area.unavailable .alert-tit { line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); letter-spacing: -0.36px; }
.layer-pop-area.unavailable .alert-message-box { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; }
.layer-pop-area.unavailable .alert-message { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; align-self: stretch; gap: 8px; padding: 12px; background-color: var(--clr-r000); }
.layer-pop-area.unavailable .alert-message .icon-error { width: 16px; height: 16px; background: url("/figma/svg/error_red_16.svg") no-repeat center / contain; aspect-ratio: 1/1;}
.layer-pop-area.unavailable .alert-message p { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.duplicate-booking-box { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; width: 100%; }
.duplicate-booking-box .title {line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.duplicate-booking-txt { display: flex; align-items: center; justify-content: space-between; align-self: stretch; height: 44px; padding: 12px; background-color: var(--clr-n30); border-radius: 6px; box-sizing: border-box; }
.duplicate-booking-txt .booking-txt { display: flex; align-items: center; gap: 8px; }
.duplicate-booking-txt .booking-txt .icon-calendar { width: 16px; height: 16px; background: url("/figma/svg/calendar_16.svg") no-repeat center / contain; }
.duplicate-booking-txt .booking-txt span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.duplicate-booking-txt .more-txt { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.duplicate-booking-txt .more-txt strong { font-weight: var(--txt-weight-medium); color: var(--txt-color-p600);}

/* ///////////////////////////////////////////////// */
/* -------------------- 좌석 예약 -------------------- */
/* ///////////////////////////////////////////////// */
.seat_container { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; box-shadow: var(--ds-e200); }
.seat_container .container__inner { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; }
.seat_container .container__inner .seat_header_title { display: flex; padding: 20px 56px 16px 40px; align-items: center; gap: 40px; align-self: stretch; background: var(--clr-w100); }
.seat_container .container__inner .seat_header_title span { flex: 1 0 0; color: #151515; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); height: 30px; line-height: 30px; }
.seat_container .container__inner .seat_header_title .seat_header_btn { display: flex; height: 36px; justify-content: flex-end; align-items: center; gap: 16px; }
.seat_container .container__inner .seat_header_title .seat_header_btn .desk_policy_btn { display: flex; width: 36px; min-width: 0 !important; height: 36px; padding: 14px 10px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; }
.seat_container .container__inner .seat_header_title .seat_header_btn .desk_policy_btn::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/policy_black_16.svg) no-repeat center / 18px 18px; flex-shrink: 0; }

/* 우측 사이드 드로어 (공통) */
.side-drawer,
.desk-policy-drawer { position: fixed; inset: 0; z-index: 99999; pointer-events: none; visibility: hidden; letter-spacing: var(--txt-letter-spacing); line-height: var(--txt-line-height); }
.side-drawer.is-open,
.desk-policy-drawer.is-open { pointer-events: auto; visibility: visible; }
html.side-drawer-open,
html.desk-policy-drawer-open { overflow: hidden; }
.side-drawer__dim,
.desk-policy-drawer__dim { position: absolute; inset: 0; background: var(--dim-d60a); opacity: 0; transition: opacity 0.28s ease; pointer-events: none; }
.side-drawer.is-open .side-drawer__dim,
.desk-policy-drawer.is-open .desk-policy-drawer__dim { opacity: 1; }
.side-drawer__panel,
.desk-policy-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; background: var(--clr-w100); transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); box-sizing: border-box;  width: 592px; padding: 32px; }
.side-drawer.is-open .side-drawer__panel,
.desk-policy-drawer.is-open .desk-policy-drawer__panel { transform: translateX(0); }
.side-drawer__header,
.desk-policy-drawer__header { flex-shrink: 0; display: flex; padding-left: 512px; align-items: flex-start; gap: 10px; }
.side-drawer__title,
.desk-policy-drawer__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: #141414; }
.side-drawer__close,
.desk-policy-drawer__close { width: 16px; height: 16px; padding: 0; border: 0; border-radius: 8px; background: transparent url("../../../figma/svg/close_black_16.svg") no-repeat center / 16px 16px; cursor: pointer; }
.side-drawer__close:hover,
.desk-policy-drawer__close:hover { background-color: var(--clr-n30); }
.side-drawer__body,
.desk-policy-drawer__body { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; flex: 1 1 auto; align-self: stretch; min-height: 0; overflow: hidden; width: 100%; box-sizing: border-box; }
.side-drawer .policy__content-inner.policy__content-inner--desk,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; flex: 1 1 auto; min-height: 0; width: 100%; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #e0e3eb transparent; }
.side-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb { min-height: 36px; }
.side-drawer .policy__content-sub-tit.policy__content-sub-tit--desk,
.desk-policy-drawer .policy__content-sub-tit.policy__content-sub-tit--desk { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.side-drawer .policy__content-sub-tit--desk .policy__content-sub-tit-notice,
.desk-policy-drawer .policy__content-sub-tit--desk .policy__content-sub-tit-notice { display: -webkit-box; width: 485px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
/* 드로어 스크롤 영역(overflow-x) 안에서 툴팁이 가로로 잘리지 않도록 셀 기준 왼쪽 정렬, 테이블 보덤(::before)보다 위에 표시 */
.side-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext,
.desk-policy-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext { left: 0; right: auto; transform: none; z-index: 100056; }
.side-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::before,
.side-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::after,
.desk-policy-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::before,
.desk-policy-drawer .policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::after { left: 50%; transform: translateX(-50%); }
.side-drawer .policy__content-table table.policy-table--desk .tooltip:hover,
.desk-policy-drawer .policy__content-table table.policy-table--desk .tooltip:hover { z-index: 100055; }
.side-drawer__footer,
.desk-policy-drawer__footer { flex-shrink: 0; display: flex; justify-content: flex-end; align-items: center; align-self: stretch; gap: 8px; padding-top: 12px; border-top: 1px solid var(--clr-w300); background: var(--clr-w100); }
/* 좌석 예약 — 정책 우측 드로어 (Desk) */

/* 회의실 — 예약 우측 드로어 */
#roomResvDrawer .attendance-schedule-drawer__panel { width: 528px; }
#roomResvDrawer .room-title-box { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; }
#roomResvDrawer .drawer-room-info .name { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.28px; }
#roomResvDrawer .drawer-room-info .date { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70); letter-spacing: -0.28px; }
#roomResvDrawer .inputform__row { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; flex: 1 0 0; align-self: stretch; }
#roomResvDrawer .inputform__row .box { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
#roomResvDrawer .label-box { display: flex; align-items: flex-end; gap: 4px; align-self: stretch; }
#roomResvDrawer .label-box > label, #roomResvDrawer .box > label { display: flex; align-items: flex-start; flex: 1 0 0; line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.28px; cursor: default; }
#roomResvDrawer .name-box { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
#roomResvDrawer .drawer-room-info { display: flex; height: 44px; padding: 0 24px; align-items: center; gap: 12px; align-self: stretch; border-radius: 6px; background-color: var(--clr-n30); }
#roomResvDrawer .inputform__row .box .resv-time-box { display: flex; align-items: flex-start; align-self: stretch; }
#roomResvDrawer .inputform__row .box .resv-time-box .time-select-wrap { flex: 1 0 0; }
#roomResvDrawer .inputform__row .box .resv-time-box .tilde { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 16px; height: 36px; flex-shrink: 0; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
#roomResvDrawer .attendance-schedule-drawer__footer, .attendance-schedule-drawer__confirm-actions { padding-top: 12px; border-top: 1px solid var(--clr-w300); box-sizing: border-box; }
#roomResvDrawer textarea { display: flex; align-items: flex-start; width: 100%; height: 100px; padding: 16px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; border: 1px solid var(--clr-w400); border-radius: 6px; box-sizing: border-box; transition: border-color 0.3s ease-in-out; resize: none; scrollbar-width: thin; scrollbar-color: var(--clr-w300) transparent; }
#roomResvDrawer textarea:hover { border-color: var(--clr-w800); }
#roomResvDrawer textarea:focus { outline: none; border-color: var(--clr-p600); }
#roomResvDrawer textarea::-webkit-scrollbar { width: 6px; }
#roomResvDrawer textarea::-webkit-scrollbar-track { background: transparent; }
#roomResvDrawer textarea::-webkit-scrollbar-thumb { min-height: 52px; background-color: var(--clr-w300); border-radius: 50px; }
#roomResvDrawer textarea::-webkit-scrollbar-thumb:hover, #roomResvDrawer textarea::-webkit-scrollbar-thumb:active { background-color: var(--clr-w400); }
#roomResvDrawer .recurring-box { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; align-self: stretch; gap: 12px; }
#roomResvDrawer .recurring-box .row { display: flex; align-items: flex-start; align-self: stretch; gap: 16px; }
#roomResvDrawer .recurring-box .row > label { display: flex; align-items: center; min-width: 74px; height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
#roomResvDrawer .recurring-box .row .cp-date-range-picker { flex: 1 0 0; }
#roomResvDrawer .recurring-box .row .cp-date-range-picker[cp-view-type="combined"] .cp-drp-inputs { width: auto !important; }
#roomResvDrawer .recurring-step-box { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; }
#roomResvDrawer .recurring-step-box .recurring-step { display: flex; align-items: center; align-self: stretch; gap: 16px; flex: 1 0 0; }
#roomResvDrawer .recurring-step-box .dayOfWeek { display: flex; align-items: center; align-self: stretch; gap: 16px; height: 36px; }
#roomResvDrawer .recurring-step-box .dayOfWeek li { display: flex; align-items: center; justify-content: center; flex: 1 0 0; gap: 4px; height: 36px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; background-color: var(--clr-w200); border-radius: 6px; box-sizing: border-box; cursor: pointer; }
#roomResvDrawer .recurring-step-box .dayOfWeek li.active { color: var(--txt-color-p600); background-color: var(--clr-p200); }
#roomResvDrawer .recurring-info-box { display: flex; align-items: center; justify-content: center; align-self: stretch; gap: 8px; padding: 12px; background-color: var(--clr-n30); border-radius: 6px; }
#roomResvDrawer .recurring-info-box .icon-recurring { width: 16px; height: 16px; background: url("/figma/svg/repeat_lightgray_16.svg") no-repeat center / contain; flex-shrink: 0; }
#roomResvDrawer .recurring-info-box span { line-height: 21px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.custom-body-tooltip { position: absolute; display: block; width: max-content; max-width: 250px; line-height: 18px; padding: 10px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; text-align: left; background-color: var(--clr-w800); border-radius: 6px; pointer-events: none; transform: translateX(-100%); z-index: 9999; }
.custom-body-tooltip::after { position: absolute; top: 100%; right: 12px; content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_down.svg") no-repeat center / contain; }
#roomResvDrawer .attendee-drawer { display:flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 24px; flex: 1 0 0; }

/* 회의실 — 배치도 우측 드로어 */
.room-map-drawer.side-drawer .side-drawer__panel { gap: 24px; }
.room-map-drawer .room-map-drawer__header { display: flex; justify-content: space-between; align-items: center; align-self: stretch; width: 100%; padding-left: 0; gap: 16px; }
.room-map-drawer .room-map-drawer__header .side-drawer__title { flex: 1 1 auto; min-width: 0; -webkit-line-clamp: 2; }
.room-map-drawer .room-map-drawer__body { gap: 0; flex: 1 1 auto; min-height: 0; align-self: stretch; }
.room-map-drawer__map-wrap { display: flex; flex: 1 1 auto; align-self: stretch; min-height: 0; width: 100%; border: 1px solid var(--clr-w300); border-radius: 8px; overflow: hidden; background: var(--clr-w100); box-sizing: border-box; }
.room-map-drawer__map-wrap iframe { display: block; width: 100%; height: 100%; min-height: 0; border: 0; }
.room-map-drawer .side-drawer__footer { padding-top: 20px; margin-top: auto; }

/* 회의실 — 서비스 통계 우측 드로어 */
.room-stats-drawer .room-stats-drawer__header { display: flex; height: 16px; padding-left: 512px; justify-content: flex-end; align-items: center; flex-shrink: 0; align-self: stretch; }
.room-stats-drawer .room-stats-drawer__header .side-drawer__title { flex: 1 1 auto; min-width: 0; -webkit-line-clamp: 2; }
.room-stats-drawer .room-stats-drawer__body { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; flex: 1 0 0; align-self: stretch; min-height: 0; overflow: hidden; }
.room-stats-drawer .room-stats-drawer__body .room-stats-drawer__head_wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; }
.room-stats-drawer .room-stats-drawer__body .room-stats-drawer__head_wrap .room-stats-drawer__summary { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
.room-stats-drawer .room-stats-drawer__body .room-stats-drawer__contents_wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; flex: 1 0 0; align-self: stretch; min-height: 0; overflow: hidden; }
.room-stats-drawer__summary-title { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.room-stats-drawer__summary-cards { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
.room-stats-drawer__summary-card { display: flex; padding: 12px; justify-content: center; align-items: center; gap: 12px; flex: 1 0 0; border-radius: 6px; background: var(--clr-n30, #F6F6F8); }
.room-stats-drawer__summary-label { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); }
.room-stats-drawer__summary-value { margin: 0; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.room-stats-drawer__summary-value span { color: var(--txt-color-p600); font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); }
.room-stats-drawer__tabs-wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; align-self: stretch; }
.room-stats-drawer__tabs { display: flex; align-items: center; gap: 0; }
.room-stats-drawer .room_view_toggle .btn_calendar { display: flex; min-width: 100px; max-width: 160px; min-height: 36px; max-height: 36px; padding: 13px 16px; justify-content: center; align-items: center; gap: 10px; border: 1px solid var(--clr-w300); background: var(--clr-w200); color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); white-space: nowrap; box-sizing: border-box; }
.room-stats-drawer .room_view_toggle .btn_calendar + .btn_calendar { margin-left: -1px; }
.room-stats-drawer .room_view_toggle .btn_calendar:first-child { border-radius: 6px 0 0 6px; }
.room-stats-drawer .room_view_toggle .btn_calendar:last-child { border-radius: 0 6px 6px 0; }
.room-stats-drawer .room_view_toggle .btn_calendar.active_btn { position: relative; z-index: 1; background: var(--clr-w800); color: var(--txt-color-t100); border-color: var(--clr-w800); font-weight: var(--txt-weight-medium); font-size: var(--txt-size-14); }
.room-stats-drawer__bldg-select { flex-shrink: 0; }
.room-stats-drawer__panel { display: none; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; min-height: 0; overflow: hidden; border-radius: 6px; border: 1px solid var(--clr-w300, #E3E3E3);}
.room-stats-drawer__panel.is-active { display: flex; }
.room-stats-drawer__toolbar { display: flex; padding: 16px 20px; justify-content: space-between; align-items: center; gap: 16px; align-self: stretch; border-bottom: 1px solid var(--clr-w300, #E3E3E3); }
.room-stats-drawer .meetingroom__date-nav.calendar-wrap { display: flex; align-items: center; gap: 16px; }
.room-stats-drawer .meetingroom__date-nav.calendar-wrap > strong { display: flex; align-items: center; gap: 24px; width: 100%; justify-content: center; }
.room-stats-drawer .meetingroom__date-arrow { display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300); background-color: var(--clr-w100); background-repeat: no-repeat; background-position: center; background-size: 16px; cursor: pointer; padding: 0; font-size: 0; color: transparent; flex-shrink: 0; }
.room-stats-drawer .meetingroom__date-nav .prevDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_left_black_16.svg); }
.room-stats-drawer .meetingroom__date-nav .nextDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_right_black_16.svg); }
.room-stats-drawer .meetingroom__date-arrow:hover { background-color: #f5f5f5; border-color: #999; }
.room-stats-drawer .meetingroom__date-arrow.disabled { opacity: 0.4; cursor: default; pointer-events: none; }
.room-stats-drawer .meetingroom__date-input { width: auto !important; min-width: 0; padding: 0 !important; border: 0; background: transparent; text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); cursor: default; white-space: nowrap; }
.room-stats-drawer__weekly-toolbar { display: flex; padding: 16px 20px; justify-content: center; align-items: center; align-self: stretch; flex-shrink: 0; border-bottom: 1px solid var(--clr-w300, #E3E3E3); }
.room-stats-drawer__weekly-content { display: flex; padding: 20px; align-items: flex-start; gap: 16px; align-self: stretch; }
.room-stats-drawer__heatmap-column { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 12px; border-radius: 6px; background: var(--clr-p100, #F6FAFF); }
.room-stats-drawer__heatmap-box { display: flex; align-items: flex-start; gap: 6px; align-self: stretch; border-radius: 12px; }
.room-stats-drawer__heatmap-legend { display: flex; flex-direction: column; align-self: stretch; gap: 4px; align-items: flex-start; }
.room-stats-drawer__heatmap-legend-labels { display: flex; justify-content: space-between; align-items: center; align-self: stretch; color: var(--txt-color-t70); font-size: var(--txt-size-10); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__heatmap-legend-bar { width: 100%; height: 8px; border-radius: 4px; background: linear-gradient(to right, #f1f3f6, #ddebf9, #b3d3f3, #96c6f6, #469bf3, #1382f4); }
.room-stats-drawer__heatmap-content { display: flex; align-items: flex-start; gap: 6px; align-self: stretch; }
.room-stats-drawer__heatmap-content .timeList { display: flex; padding: 28px 0 6px 0; flex-direction: column; align-items: center; gap: 6px; align-self: stretch; }
.room-stats-drawer__heatmap-content .timeList li { display: flex; width: 7px; height: 16px; flex-direction: column; justify-content: center; color: var(--txt-color-t70, #999); text-align: right; font-size: var(--txt-size-10); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__heatmap-content .room-heatmap-wrap { display: flex; align-items: center; flex: 1 0 0; }
.room-stats-drawer__heatmap-content .dateTime { display: flex; min-width: 24px; padding: 6px 3px; flex-direction: column; align-items: center; gap: 6px; flex: 1 0 0; border-radius: 6px; }
.room-stats-drawer__heatmap-content .dateTime.on { background: var(--clr-o100); }
.room-stats-drawer__heatmap-content .dateTime.on .date { color: var(--clr-o900); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__heatmap-content .dateTime .date { width: 32px; height: 16px; line-height: 24px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t700, #444); text-align: center; }
.room-stats-drawer__heatmap-content .dateTime li { width: 24px; height: 16px; border-radius: 4px; list-style: none; box-shadow: var(--ds-e100); }
.room-stats-drawer__heatmap-content .dateTime li span { display: none; }
.room-stats-drawer__heatmap-content .dateTime li.value0 { background: var(--clr-p200); }
.room-stats-drawer__heatmap-content .dateTime li.value1 { background: var(--clr-p300); }
.room-stats-drawer__heatmap-content .dateTime li.value20 { background: var(--clr-p400); }
.room-stats-drawer__heatmap-content .dateTime li.value40 { background: var(--clr-p500); }
.room-stats-drawer__heatmap-content .dateTime li.value60 { background: var(--clr-p600); }
.room-stats-drawer__heatmap-content .dateTime li.value80 { background: var(--clr-p700); }
.room-stats-drawer__daily-wrap { display: flex; flex-direction: column; align-items: center; gap: 24px; flex: 1 0 0; align-self: stretch; }
.room-stats-drawer__daily-title { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; align-self: stretch; border-radius: 6px; background: var(--clr-n30, #F6F6F8); color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.room-stats-drawer__daily-chart { display: flex; flex-direction: column; align-items: center; gap: 20px; flex: 1 1 0; min-height: 0; width: 100%; position: relative; }
.room-stats-drawer__daily-empty { color: var(--txt-color-t500); font-size: var(--txt-size-14); text-align: center; padding: 24px 12px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 24px); }
.room-stats-drawer__pie-wrap { position: relative; width: 160px; height: 160px; flex-shrink: 0; }
#roomStatsPieChart { width: 160px; height: 160px; }
.room-stats-drawer__pie-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; pointer-events: none; text-align: center; padding: 0 12px; box-sizing: border-box; }
.room-stats-drawer__pie-date { color: var(--txt-color-t500, #777); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.3; }
.room-stats-drawer__pie-name { color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); line-height: 1.3; word-break: keep-all; }
.room-stats-drawer__daily-info { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.room-stats-drawer__daily-info-list { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
.room-stats-drawer__daily-info-list li { display: flex; justify-content: space-between; align-items: flex-start; align-content: flex-start; row-gap: 4px; align-self: stretch; flex-wrap: wrap; color: var(--txt-color-t500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__daily-info-list li span:last-child { color: var(--txt-color-t900, #1F1F1F); font-weight: var(--txt-weight-medium); }
.room-stats-drawer__metric-toggle { display: flex; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-n30, #F6F6F8);}
.room-stats-drawer__metric-toggle button { display: flex; height: 36px; min-width: 60px; max-width: 160px; padding: 0 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 6px; color: var(--txt-color-t300, #777); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.room-stats-drawer__metric-toggle button.is-active { background: var(--clr-w100); border: 1px solid var(--clr-w300); color: var(--txt-color-t900); }
.room-stats-drawer__rank-board { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; align-self: stretch; overflow-y: auto; background: var(--clr-w100); }
.room-stats-drawer__rank-board::-webkit-scrollbar { width: 8px; }
.room-stats-drawer__rank-board::-webkit-scrollbar-thumb { background-color: #e0e3eb; border-radius: 5px; min-height: 36px; }
.room-stats-drawer__rank-board::-webkit-scrollbar-track { background: transparent; }
.room-stats-drawer__rank-row { display: flex; flex: 0 0 auto; min-height: 180px; align-self: stretch; }
.room-stats-drawer__rank-row + .room-stats-drawer__rank-row { border-top: 1px solid var(--clr-w300); }
.room-stats-drawer__rank-cell { display: flex; flex-direction: column; flex: 1 0 0; background: var(--clr-w100); }
.room-stats-drawer__rank-cell + .room-stats-drawer__rank-cell { border-left: 1px solid var(--clr-w300); }
.room-stats-drawer__rank-head { display: flex; height: 44px; padding: 0 24px; align-items: center; justify-content: center; gap: 16px; align-self: stretch; background: var(--clr-n30, #F6F6F8); color: var(--txt-color-t500, #555); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); }
.room-stats-drawer__rank-body { display: flex; padding: 20px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; }
.room-stats-drawer__rank-body::-webkit-scrollbar { width: 8px; }
.room-stats-drawer__rank-body::-webkit-scrollbar-thumb { background-color: #e0e3eb; border-radius: 5px; min-height: 36px; }
.room-stats-drawer__rank-body::-webkit-scrollbar-track { background: transparent; }
.room-stats-drawer__rank-body .chart-rank { display: flex; flex-direction: column; gap: 8px; width: 100%; margin: 0; padding: 0; list-style: none; position: static; top: auto; height: auto; }
.room-stats-drawer__rank-body .chart-rank li { display: flex; align-items: center; gap: 8px; align-self: stretch; height: 39px; }
.room-stats-drawer__rank-body .chart-rank li .rank { display: flex; width: 20px; height: 20px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; border-radius: 30px; background: var(--clr-p500, #4D93FF); color: var(--txt-color-t100); font-size: var(--txt-size-12)}
.room-stats-drawer__rank-body--muted .chart-rank li .rank { background: var(--clr-n500); }
.room-stats-drawer__rank-body .chart-rank li .rankInfo { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; }
.room-stats-drawer__rank-body .chart-rank li .rankInfo > div:first-child { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; align-self: stretch; overflow: hidden; color: var(--txt-color-t900, #1F1F1F); text-overflow: ellipsis; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__rank-body .chart-rank li .rankInfo .location,
.room-stats-drawer__rank-body .chart-rank li .rankInfo .org-meta { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; align-self: stretch; overflow: hidden; color: var(--txt-color-t70, #999); text-overflow: ellipsis; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
.room-stats-drawer__rank-body .chart-rank li .rankInfo .location img { display: none; }
.room-stats-drawer__rank-body .chart-rank li .rankInfo .location span { margin: 0; }
.room-stats-drawer .side-drawer__footer { margin-top: auto; }

/* 근태 — 일정 신청 우측 드로어 */
.attendance-schedule-drawer { position: fixed; inset: 0; z-index: 1000; pointer-events: none; visibility: hidden; letter-spacing: var(--txt-letter-spacing); line-height: var(--txt-line-height); }
.attendance-schedule-drawer.is-open { pointer-events: auto; visibility: visible; }
html.attendance-schedule-drawer-open { overflow: hidden; }
.attendance-schedule-drawer__dim { position: absolute; inset: 0; background: var(--dim-d60a); opacity: 0; transition: opacity 0.28s ease; pointer-events: none; }
.attendance-schedule-drawer.is-open .attendance-schedule-drawer__dim { opacity: 1; }
.attendance-schedule-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; background: var(--clr-w100); transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1); box-sizing: border-box; width: min(592px, 100%); max-width: 100%; padding: 32px; gap: 20px; }
.attendance-schedule-drawer__panel:focus,
.attendance-schedule-drawer__panel:focus-visible { outline: none; }
.attendance-schedule-drawer.is-open .attendance-schedule-drawer__panel { transform: translateX(0); }
.attendance-schedule-drawer__header { display: flex; height: 16px; justify-content: flex-end; align-items: center; flex-shrink: 0; align-self: stretch; }
.attendance-schedule-drawer__title-row { display: flex; align-items: center; gap: 12px; align-self: stretch; flex-shrink: 0; }
.attendance-schedule-drawer__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; flex: 1 0 0; overflow: hidden;  text-overflow: ellipsis; font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); }
.attendance-schedule-drawer__steps { display: flex; align-items: center; gap: 12px; }
.attendance-schedule-drawer__step-item { display: flex; align-items: center; gap: 8px; line-height: 21px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70); letter-spacing: -0.24px; }
.attendance-schedule-drawer__step-num { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; line-height: 20px; border-radius: 10px; gap: 10px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); background: var(--clr-w400); color: var(--txt-color-t100); letter-spacing: -0.24px; }
.attendance-schedule-drawer__step-item.past { color: var(--txt-color-t900); }
.attendance-schedule-drawer__step-item.past .attendance-schedule-drawer__step-num { background: var(--txt-color-t700); color: var(--clr-w100); }
.attendance-schedule-drawer__step-item.is-active { color: var(--txt-color-p600); }
.attendance-schedule-drawer__step-item.is-active .attendance-schedule-drawer__step-num { background: var(--txt-color-p600); color: var(--clr-w100); }
.attendance-schedule-drawer__step-label { white-space: nowrap; }
.attendance-schedule-drawer__step-dash { width: 30px; height: 2px; background: var(--clr-w300); }
.attendance-schedule-drawer__close { width: 16px; height: 16px; mask: url("/figma/svg/close_black_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/close_black_16.svg") no-repeat center / contain; background-color: var(--clr-w800); flex-shrink: 0; cursor: pointer; }
.attendance-schedule-drawer__close:hover { background-color: var(--clr-n70); }
.attendance-schedule-drawer__body { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; min-height: 0; gap: 40px; align-self: stretch; }
.attendance-schedule-drawer__step { display: none; flex-direction: column; align-items: flex-start; gap: 24px; flex: 1 1 0; min-height: 0; align-self: stretch; }
.attendance-schedule-drawer__step.is-visible { display: flex; }
.attendance-schedule-drawer__step-scroll { flex: 1 1 0; min-height: 0; width: 100%; max-width: 100%; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; align-self: stretch; scrollbar-width: thin; scrollbar-color: var(--clr-w300) transparent; }
.attendance-schedule-drawer__step-scroll::-webkit-scrollbar { width: 6px; }
.attendance-schedule-drawer__step-scroll::-webkit-scrollbar-thumb { min-height: 52px; background-color: var(--clr-w300); border-radius: 50px; }
.attendance-schedule-drawer__step-scroll::-webkit-scrollbar-track { background: transparent; }
.attendance-schedule-drawer__step-scroll::-webkit-scrollbar-thumb:hover { cursor: pointer; }
.attendance-schedule-drawer__step-scroll--confirm { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.attendance-schedule-drawer__confirm-lead { align-self: stretch; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.attendance-schedule-drawer__confirm-list { display: flex; padding: 16px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
.attendance-schedule-drawer__confirm-list li { display: flex; align-items: center; align-content: center; gap: 8px 12px; align-self: stretch; flex-wrap: wrap; }
.attendance-schedule-drawer__confirm-list li span { width: 120px; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.attendance-schedule-drawer__confirm-list li small {  flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.attendance-schedule-drawer__confirm-list li sub { color: var(--clr-n70); font-size: var(--txt-size-14); }
.approval-comment-input-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
.approval-comment-input-wrap > label { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 10; overflow: hidden;  color: var(--txt-color-t900); text-overflow: ellipsis; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); }
.pop-action-btn-wrap { display: flex; justify-content: center; align-items: flex-start; gap: 16px; align-self: stretch; }
.pop-action-btn-wrap .pop-action-left-btn { display: flex; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.pop-action-btn-wrap .pop-action-btn-area { display: flex; justify-content: flex-end; align-items: flex-start; gap: 8px; flex: 1 0 0; }

/* 근태 정정 요청 상세 팝업 — Step3 확인 리스트와 동일 톤 */
.layer-pop-wrap .layer-pop-area[data-role-popup="attendanceRequestDetail"] .attendance-request-detail__body { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area[data-role-popup="attendanceRequestDetail"] .attendance-schedule-drawer__confirm-list li small .attendance-request-detail__applicant-name { flex: none; width: auto; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }

.attendance-schedule-drawer__confirm-actions { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding-top: 8px; }
.attendance-schedule-drawer__footer, .attendance-schedule-drawer__confirm-actions { padding-top: 12px; display: flex; justify-content: center; align-items: flex-start; gap: 16px; align-self: stretch; border-top: 1px solid var(--clr-w300); }
.attendance-schedule-drawer__footer .footer-btn-start, .attendance-schedule-drawer__confirm-actions .footer-btn-start { display: flex; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.attendance-schedule-drawer__footer .footer-btn-end, .attendance-schedule-drawer__confirm-actions .footer-btn-end { display: flex; justify-content: flex-end; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.attendance-schedule-drawer__footer.is-hidden { display: none !important; }
.attendance-schedule-drawer .is-hidden { display: none !important; }
.attendance-schedule-drawer__btn { display: inline-flex; align-items: center; justify-content: center; min-width: 72px; height: 36px; padding: 0 16px; border-radius: 6px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); cursor: pointer; border: 1px solid transparent; box-sizing: border-box; }
.attendance-schedule-drawer__btn--secondary { background: var(--clr-w100); border-color: var(--clr-w300); color: var(--txt-color-t900); }
.attendance-schedule-drawer__btn--secondary:hover { background: var(--clr-n30); }
.attendance-schedule-drawer__btn--primary { background: var(--txt-color-p600); border-color: var(--txt-color-p600); color: var(--clr-w100); }
.attendance-schedule-drawer__btn--primary:hover { filter: brightness(0.95); }

/* 부서원 근태 통합 사이드 패널 */
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__body { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tabbed { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 0; flex: 1 1 0; min-height: 0; width: 100%; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tabbed > .attendance-schedule-drawer__step.is-visible { flex: 1 1 0; min-height: 0; width: 100%; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tabbed > .attendance-schedule-drawer__step.is-visible > .attendance-schedule-drawer__step-scroll { flex: 1 1 0; min-height: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__title-row--profile { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .attendance-schedule-drawer__title { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile { display: flex; align-items: center; gap: 12px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile::before { width: 40px; height: 40px; content: attr(data-first); flex-shrink: 0; display: flex; justify-content: center; align-items: center; border-radius: 50%; background: var(--clr-n80); color: var(--txt-color-t100); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile dl { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1 0 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile dl dt { display: flex; align-items: flex-end; gap: 4px; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile dl dt span { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__profile .popobj-profile dl dd { font-size: var(--txt-size-14); color: var(--txt-color-t70); font-weight: var(--txt-weight-regular) }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__badges { display: flex; padding-left: 52px; align-items: center; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__badge { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px;  border-radius: 20px; border: 1px solid var(--clr-p600); background: var(--clr-w100); font-size: var(--txt-size-12); color: var(--txt-color-p600); font-weight: var(--txt-weight-medium); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__badge--grade { background: var(--clr-p600); color: var(--txt-color-t100); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tabs { display: flex; align-items: flex-end; align-self: stretch; gap: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tab + .attendance-schedule-drawer__tab { margin-left: 4px; position: relative; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tab + .attendance-schedule-drawer__tab::before { content: ''; position: absolute; left: -4px; top: 35px; width: 4px; height: 1px; background: var(--clr-w300); pointer-events: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tab + .attendance-schedule-drawer__tab::after { content: ''; position: absolute; left: 120px; top: 35px; width: 283px; height: 44px; background: transparent; border-top: 1px solid var(--clr-w300); border-right: 1px solid var(--clr-w300); border-top-right-radius: 6px; pointer-events: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tab { display: flex; width: 120px; height: 36px; min-width: 100px; min-height: 36px; max-height: 36px; padding: 13px 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 6px 6px 0 0; background: var(--clr-w200); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-w500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__tab.is-active {  border-top: 1px solid var(--clr-w300); border-right: 1px solid var(--clr-w300); border-left: 1px solid var(--clr-w300); background: var(--clr-w100); color: var(--txt-color-p600); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__step-scroll.workhours-detail-pane { display: flex; padding: 16px; flex-direction: column; align-items: flex-start; gap: 16px; flex: 1 0 0; border-radius: 0 6px 6px 6px; border-right: 1px solid var(--clr-w300, #E3E3E3); border-bottom: 1px solid var(--clr-w300, #E3E3E3); border-left: 1px solid var(--clr-w300, #E3E3E3); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailWeekNav { align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__step-scroll--placeholder { display: flex; align-items: center; justify-content: center; min-height: 200px; color: var(--txt-color-t500); font-size: var(--txt-size-14); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card { gap: 12px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .department-dept-trend-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; width: 100%; box-sizing: border-box; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .department-dept-trend-head-titles { flex: 1 1 auto; min-width: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .department-dept-trend-head-titles h3.workhours-detail-chart-title { margin: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); line-height: 1.3; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .workhours-detail-chart-container { flex: 1 1 0; min-height: 200px; height: auto; width: 100%; position: relative; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .workstatus-daily-chart-legend { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; align-self: stretch; flex-shrink: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card #workhoursDetailChart { width: 100% !important; height: 100% !important; min-height: 0 !important; }

/* 일별 근무 기록 — Vacation/출퇴근 기록 카드 레이아웃(페이징 없음) */
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-daily-records.attendance-request-history__body-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 12px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF);}
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-daily-records .workstatus-record-history__toolbar-strip { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-daily-records .attendance-request-history__title-row { display: flex; padding: 16px 24px; flex-direction: column; align-items: stretch; gap: 0; align-self: stretch; width: 100%; box-sizing: border-box; border-bottom: 1px solid var(--clr-w300); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-daily-records .attendance-request-history__section-title { margin: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-daily-records .attendance-request-history__table-wrap { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; gap: 0; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow-x: auto; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table { display: table; width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table thead { display: table-header-group; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table tbody { display: table-row-group; font-weight: var(--txt-weight-regular); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table thead tr,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table tbody tr { display: table-row; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table thead th,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table tbody td { display: table-cell; box-sizing: border-box; vertical-align: middle; border-bottom: 1px solid var(--clr-w300); word-break: break-word; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table tbody tr:last-child td { border-bottom: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table thead th { height: 44px; text-align: start; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable.workstatus-attendance-record-table tbody td { height: 48px; font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable .workstatus-record--date { padding: 0 12px 0 24px; min-width: 100px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable .workstatus-record--clock { padding: 0 12px; min-width: 60px; white-space: nowrap; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable .workstatus-record--hours { padding: 0 12px; min-width: 88px; white-space: nowrap; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable .workstatus-record--status { padding: 0 0 0 12px; min-width: 60px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable tbody td.workstatus-record--status.workhours-detail-status-cell { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable tbody td.saturday { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailDailyRecordTable tbody td.sunday { color: var(--clr-r900); font-weight: var(--txt-weight-semibold); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #workhoursDetailTableEmpty.workstatus-record-history__empty,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailTableEmpty.workstatus-record-history__empty { height: 200px; border-radius: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #employeeSidePanelVacationEmptyWrap.employee-side-panel-vacation-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1 1 0; align-self: stretch; min-height: 320px; width: 100%; border-radius: 12px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF); box-sizing: border-box; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee [data-panel-pane="vacation"] .employee-side-panel-vacation-section { align-self: stretch; width: 100%; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-section .employee-side-panel-vacation-table-wrap { overflow-x: hidden; overscroll-behavior-x: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-table-scroll { display: block; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow-x: auto; overflow-y: visible; -webkit-overflow-scrolling: touch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination { display: flex; padding: 20px 24px 16px; justify-content: center; align-items: flex-start; align-self: stretch; flex-wrap: wrap; overflow-x: hidden; max-width: 100%; min-width: 0; flex-shrink: 0; box-sizing: border-box; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging { display: flex; align-items: center; gap: 12px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon { flex: 0 0 auto; width: 32px; height: 32px; padding: 0; margin: 0; border: none; border-radius: 6px; background-color: transparent; cursor: pointer; box-sizing: border-box; -webkit-appearance: none; appearance: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon.first-page { mask: url("../../../figma/svg/pagenation_start_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_start_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon.prev-page { mask: url("../../../figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon.next-page { mask: url("../../../figma/svg/pagenation_next_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_next_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon.last-page { mask: url("../../../figma/svg/pagenation_end_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_end_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon:not(:disabled):hover { opacity: 0.75; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging__icon:disabled { cursor: default; background-color: var(--clr-w400); opacity: 1; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging .num-page { display: flex; align-items: center; gap: 4px; margin: 0 8px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging .num-page .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 6px; margin: 0; border: none; border-radius: 8px; background: transparent; box-sizing: border-box; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); line-height: 1; cursor: pointer; font-family: inherit; -webkit-appearance: none; appearance: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging .num-page .page-link.active { color: var(--txt-color-t100); background-color: var(--clr-w800); cursor: default; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .employee-side-panel-vacation-pagination .workstatus-attendance-paging .num-page button.page-link:hover:not(.active) { color: var(--txt-color-t700); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .vacation-pending-wrap .workhours-detail-summary-card__value.vacation-pending-text-wrap { display: flex; justify-content: space-between; flex-direction: column; align-items: flex-start; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .vacation-pending-wrap .workhours-detail-summary-card__value.vacation-pending-text-wrap > div { display: flex; align-items: center; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .vacation-detail-box-msg { font-size: var(--txt-size-12) !important; gap: 4px; display: flex; align-items: center; font-weight: var(--txt-weight-regular) !important; color: var(--txt-color-t700) !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .vacation-detail-box-msg--muted #employeeSidePanelVacationUpcomingNearestDate { color: var(--clr-g900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee [data-panel-pane="vacation"] .workhours-detail-summary-card--dept .workhours-detail-summary-card__label,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee [data-panel-pane="vacation"] .workhours-detail-summary-card--dept .workhours-detail-summary-card__value { justify-content: flex-start; text-align: left; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card #vacationDetailMonthlyChart { width: 100% !important; height: 100% !important; min-height: 0 !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .workstatus-monthly-vacation-legend-types { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 12px; max-width: 75%; min-width: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .workstatus-monthly-vacation-legend__item { display: inline-flex; align-items: center; gap: 4px; color: var(--txt-color-t500); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-side-panel-trend-card .workstatus-monthly-vacation-legend__swatch { display: block; width: 12px; height: 12px; border-radius: 4px; flex-shrink: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table { display: table; width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table thead { display: table-header-group; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody { display: table-row-group; font-weight: var(--txt-weight-regular); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table thead tr,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody tr { display: table-row; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table thead th,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td { display: table-cell; box-sizing: border-box; vertical-align: middle; border-bottom: 1px solid var(--clr-w300); word-break: break-word; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody tr:last-child td { border-bottom: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table thead th { height: 44px; text-align: start; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td { height: 48px; font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: normal; max-width: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-req { padding: 0 12px 0 24px; min-width: 195px; white-space: nowrap; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-days { padding: 0 12px; min-width: 55px; white-space: nowrap; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-reason { padding: 0 12px; min-width: 120px; max-width: 200px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-approver { padding: 0 12px; min-width: 60px; max-width: 100px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-type { padding: 0 12px; min-width: 85px; max-width: 120px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable .workstatus-record--vac-status { padding: 0 12px; min-width: 70px; max-width: 90px; overflow: visible; text-overflow: clip; white-space: nowrap; }
/* --- CSS4 설정(:has) 별도 분리 ---
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody tr:has(.attendance-request-history__reason-tooltip:hover) { position: relative; z-index: 100; }*/
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason { overflow: visible; white-space: normal; text-overflow: clip; max-width: 200px; display: flex; align-items: center; min-width: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason .tooltip.attendance-request-history__reason-tooltip { flex: 1 1 0; min-width: 0; align-self: stretch; position: relative; z-index: 2; overflow: visible; display: flex; align-items: center; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason .tooltip.attendance-request-history__reason-tooltip .attendance-request-history__cell-ellipsis { flex: 1 1 0; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason > .attendance-request-history__cell-ellipsis { align-self: center; flex: 1 1 0; min-width: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:hover { z-index: 120; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext { position: absolute; left: 50%; right: auto; top: 100%; bottom: auto; transform: translateX(-50%); margin-top: 8px; margin-bottom: 0; margin-right: 0; width: max-content; max-width: min(250px, calc(100vw - 48px)); min-width: 0; box-sizing: border-box; padding: 10px; border-radius: 6px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; letter-spacing: var(--txt-letter-spacing); box-shadow: var(--ds-e300); -webkit-box-shadow: var(--ds-e300); z-index: 130; pointer-events: none; word-break: break-word; overflow-wrap: break-word; display: block; align-items: unset; justify-content: unset; flex-flow: unset; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::before { content: ""; position: absolute; left: 50%; top: -6px; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; margin-top: 0; background-color: rgba(0, 0, 0, 0.27); clip-path: polygon(50% 0%, 0% 100%, 100% 100%); filter: blur(1.5px); -webkit-filter: blur(1.5px); opacity: 0.55; z-index: -2; transform: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::after { content: ""; position: absolute; left: 50%; top: -6px; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; background-color: var(--clr-w800); clip-path: polygon(50% 0%, 0% 100%, 100% 100%); z-index: -1; transform: none; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:hover .tooltiptext { transform: translateX(-50%); transition: opacity 0.2s ease, visibility 0.2s ease; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip.is-truncated:hover .tooltiptext { visibility: visible !important; opacity: 1 !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated) .tooltiptext,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee #vacationDetailSidePanelRecordTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated):hover .tooltiptext { visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .attendance-schedule-drawer__step { flex-direction: column; align-items: flex-start; align-self: stretch; gap: 0; }

/* 주간 근무 평균 요약 카드 (사이드 패널) */
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-cards-wrap--employee { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; width: 100%; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-cards-wrap__title { margin: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); line-height: 1.4; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-cards--employee { display: flex; align-items: flex-start; gap: 8px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-cards--employee .workhours-detail-summary-card { display: flex; align-items: center; border-radius: 4px; background: var(--clr-n30, #F6F6F8); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card--daily { padding: 12px; flex-direction: column; width: 100px; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card--split { padding: 12px 0; flex: 1 0 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card--split.overtime { border-radius: 4px; background: var(--clr-r000, #FFF3F3); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card--dept { min-width: 80px; height: 100%; padding: 12px; flex-direction: column; justify-content: center; align-items: flex-start !important; gap: 2px; flex: 1 0 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .vacation-pending-wrap { padding: 12px; flex-direction: column; align-items: flex-start !important; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card--alert { background: #FFF5F5; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__col { display: flex; width: 85px; padding: 0 12px; flex-direction: column; align-items: center; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__col.divider { border-right: 1px solid var(--clr-w300); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__col.overtime { width: 95px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__label { margin: 0; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70, #828EAC); text-align: center; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value.vacation-pending-text-wrap { display: flex; justify-content: space-between; align-items: flex-end; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value.vacation-pending-text-wrap > div { display: flex; align-items: center; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value > span:first-of-type { font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold, 600); color: var(--txt-color-t900, #4C5266); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value #employeeSidePanelVacationUpcomingCount { font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); color: var(--clr-g900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value small { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900, #4C5266); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value--primary > span:first-of-type { color: var(--txt-color-p600, #1382F4); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value--alert > span:first-of-type { color: var(--clr-r900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value--alert #vacationDetailRemainingLeave { color: var(--clr-n600); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-overtime-status { display: none !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value .workhours-detail-overtime-status:not(:empty) { display: none !important; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value.workhours-detail-summary-card__value--primary,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value.workhours-detail-summary-card__value--alert { display: flex; justify-content: center; align-items: center; height: 100%; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value.workhours-detail-summary-card__value--primary .vacation-total-leave-text-wrap { height: 25px; display: flex; align-items: flex-end; gap: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .dept-detail-chart-section { display: flex; padding: 16px 24px; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; border-radius: 12px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div { display: flex; min-width: 80px; padding: 8px 12px; align-items: center; gap: 8px; align-self: stretch; border-radius: 4px; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.workhours-ontime-checkin.is-above-average,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.workhours-avg-workhour.is-above-average { background: var(--clr-g000, #F1FBF5); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.workhours-ontime-checkin.is-below-average,
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.workhours-avg-workhour.is-below-average { background: var(--clr-y000, #FFFBEF); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.is-above-average::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/smile_green_16.svg) no-repeat center / 16px 16px; flex-shrink: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div.is-below-average::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/sad_yellow_16.svg) no-repeat center / 16px 16px; flex-shrink: 0; }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div .dept-avg-compare-label { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-dept-average-compare-wrap div span { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value--primary > span#employeeSidePanelOnTimeRateMine.is-above-average { color: var(--clr-g900); }
#employeeAttendanceSidePanel.attendance-schedule-drawer--employee .workhours-detail-summary-card__value--primary > span#employeeSidePanelOnTimeRateMine.is-below-average { color: var(--clr-y900); }
#scheduleAttendanceTypeSelectBox-menu > li.ui-menu-item[aria-disabled="true"],
#scheduleAttendanceTypeSelectBox-menu > li[aria-disabled="true"] { display: none !important; }

.attendance-schedule-approver-search__controls { display: flex; padding: 16px 20px; align-items: center; gap: 8px; align-self: stretch; border-radius: 8px; background: var(--clr-n30); }
.attendance-schedule-approver-search__keyword { flex:1 1 auto; min-width:0; }
.attendance-schedule-approver-search__btn { height:36px; min-width:100px; border:0; border-radius:10px; background:#8e98a8; color:#fff; font-size:16px; font-weight:500; }
.attendance-schedule-approver-search__result { margin-top:16px; border:1px solid #e3e4e8; border-radius:12px; overflow:hidden; background:#fff; }
.attendance-schedule-approver-search__result-head { display: flex; padding: 16px 24px; align-items: center; gap: 8px; align-self: stretch; }
.attendance-schedule-approver-search__result-head h4 { flex: 1 0 0; color: var(--txt-color-t900); font-weight: var(--txt-weight-semibold); font-size: var(--txt-size-18); }
.attendance-schedule-approver-search__result-head .listTotal { display:flex; align-items:center; gap:4px; padding-right: 12px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.attendance-schedule-approver-search__result-head .listTotal p { margin:0; color: var(--txt-color-p600); }
.attendance-schedule-approver-search__table { width:100%; table-layout:fixed; border-collapse:collapse; }
.attendance-schedule-approver-search__table th, .attendance-schedule-approver-search__table td { padding: 0 12px 0 24px; border-bottom: 1px solid var(--clr-w300); align-items: center; height: 44px; box-sizing: border-box; }
.attendance-schedule-approver-search__table th { height: 44px; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); font-size: var(--txt-size-14); color: var(--txt-color-t500); text-align:left; }
.attendance-schedule-approver-search__table td { height: 48px; background: var(--clr-w100); font-weight: var(--txt-weight-regular); font-size: var(--txt-size-14); color: var(--txt-color-t900); align-items: flex-start; }
.attendance-schedule-approver-search__table .col-no { width: 54px; align-items: center; }
.attendance-schedule-approver-search__table .col-action { width: 68px; text-align:center; padding: 0 24px 0 12px; }
.attendance-schedule-approver-search__table .col-name { width: 206px; padding: 0 12px; }
.attendance-schedule-approver-search__table .col-dept { padding: 0 12px; }
.attendance-schedule-approver-search__table .col-name-cell { width: 206px; gap: 4px; align-self: stretch; align-items: center; padding: 0 12px; }
.attendance-schedule-approver-search__table .col-dept-cell { gap: 4px; align-self: stretch; align-items: center; padding: 0 12px; overflow: hidden; white-space: nowrap; word-break: normal; max-width: 0; }
.attendance-schedule-approver-search__table .col-dept-cell .tooltip.attendance-schedule-approver-search__dept-tooltip { display: block; width: 100%; min-width: 0; overflow: hidden; }
.attendance-schedule-approver-search__table .col-dept-cell .attendance-schedule-approver-search__dept-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
.attendance-schedule-approver-search__table .no-cell { width: 54px; align-items: center; text-align: center; }
.attendance-schedule-approver-search__table .select-btn { border: 0; background: transparent; color: var(--txt-color-p600); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); cursor:pointer; }
.attendance-schedule-approver-search__table .empty-cell { text-align:center; color:#888; padding:24px 10px; }
.attendance-schedule-approver-search__table-scroll { max-height:280px; overflow-y:auto; }
.attendance-schedule-approver-search__avatar { display:inline-flex; align-items:center; justify-content:center; width: 24px !important; height: 24px; border-radius:50%; background: var(--clr-n80) !important; color: var(--txt-color-t100) !important; font-weight: var(--txt-weight-semibold); }
.attendance-schedule-approver-search__name-wrap { display: flex; align-items: center; gap: 8px; flex: 1 0 0; }
.attendance-schedule-approver-search__auth-badge { display: inline-flex; align-items: center; justify-content: center; height: 20px; padding: 0 8px; border: 1px solid var(--clr-w400); border-radius: 4px; background: var(--clr-w100); box-sizing: border-box; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-t300); letter-spacing: -0.24px; white-space: nowrap; flex-shrink: 0; }
.attendance-schedule-approver-search .popobj-attendees { margin-top:16px; }
/* 승인자 검색 부서 툴팁: 테이블 overflow와 분리해 body에 fixed로 표시 */
body > .tooltip.attendance-schedule-approver-dept-floating-tooltip-wrap { position: fixed !important; z-index: 100050 !important; pointer-events: none; overflow: visible; }
body > .tooltip.attendance-schedule-approver-dept-floating-tooltip-wrap .tooltiptext { position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; transform: none !important; opacity: 1 !important; visibility: visible !important; max-width: min(320px, calc(100vw - 40px)); }
body > .tooltip.attendance-schedule-approver-dept-floating-tooltip-wrap .tooltiptext::after { left: 50%; top: -6px; bottom: auto; transform: translateX(-50%); }

.policy__content-sub-tit--desk .policy__content-sub-tit-bldg { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.policy__content-sub-tit--desk .policy__content-sub-tit-bldg-name { display: flex; align-items: center; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); line-height: var(--txt-line-height); }

.policy__content-table.policy__content-table--desk { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }

.seat_container .container__inner .seat_header_filter { display: flex; padding: 12px 56px 12px 40px; align-items: center; gap: 16px; align-self: stretch; background: var(--clr-n700); color: var(--txt-color-t100); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.seat_container .container__inner .seat_header_filter.seat_header_filter--desk-nav { justify-content: flex-start; }
.seat_container .container__inner .seat_header_filter_desk_nav_inner { display: flex; align-items: center; gap: 16px; align-self: stretch; }
.seat_container .container__inner .seat_header_filter_back_btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background-color: var(--clr-w100); border: 1px solid var(--clr-w300); border-radius: 6px; cursor: pointer; }
.seat_container .container__inner .seat_header_filter_back_btn:before { content: ""; width: 16px; height: 16px; mask: url("/figma/svg/arrow_back_black_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/arrow_back_black_16.svg") no-repeat center / contain; background-color: var(--clr-w800); aspect-ratio: 1/1; }
.seat_container .container__inner .seat_header_filter_back_btn:hover { background-color: var(--clr-n30); }
.seat_container .container__inner .seat_header_filter_back_btn:hover:before { background-color: var(--clr-w600); }
.seat_container .container__inner .seat_header_filter_desk_nav_inner .title { font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); letter-spacing: -0.32px; }
.seat_container .container__inner .seat_header_filter_desk_nav_inner #seat_team_location { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; border-radius: 6px; background: var(--clr-w100); gap: 8px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_location { display: flex; align-items: center; gap: 8px; border-radius: 12px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_time { display: flex; align-items: center; gap: 8px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_time > div { display: flex; width: 200px; align-items: flex-start; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_time > div > span { display: flex; width: 16px; height: 36px; flex-direction: column; justify-content: center; flex-shrink: 0; align-items: center; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_bt n { gap: 4px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_btn::before { content: ""; width: 16px; height: 16px; mask: url("/figma/svg/filter_black_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/filter_black_16.svg") no-repeat center / contain; background-color: var(--clr-w800); flex-shrink: 0; margin-right: 4px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_btn:disabled::before { background-color: var(--clr-n70); }

/* 좌석 헤더 — Filter 팝오버 */
.seat_container .container__inner .seat_header_filter .seat_header_filter_btn_wrap { position: relative; flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.seat_container .container__inner .seat_header_filter .seat_header_filter_badge { display: inline-flex; position: absolute; align-items: center; justify-content: center; width: 16px; height: 16px; box-sizing: border-box; border-radius: 8px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--clr-w100); background: var(--txt-color-p600); }
.seat_container .container__inner .seat_header_filter .seat_header_filter_badge[hidden] { display: none !important; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover { display: none; position: absolute; top: calc(100% + 8px); right: calc(100% - 208px); z-index: 500; box-sizing: border-box; width: 340px; padding: 0; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e500); overflow: hidden; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover.filter_active { display: flex; flex-direction: column; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__head { display: flex; padding: 0 20px; height: 48px; align-items: center; align-self: stretch; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); line-height: var(--txt-line-height); border-bottom: 1px solid var(--clr-w300); }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__body { display: flex; padding: 16px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__section { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; align-self: stretch; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__label { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__segments { display: flex; align-items: center; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-n30); }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__seg { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; gap: 10px; flex: 1 0 0; border-radius: 6px; background: var(--clr-n30); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t300); text-align: center; white-space: nowrap; cursor: pointer; transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, font-weight 0.15s ease; -webkit-tap-highlight-color: transparent; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__seg.is-selected { position: relative; z-index: 1; background: var(--clr-w100); border: 1px solid var(--clr-w300); color: var(--txt-color-t900); font-weight: var(--txt-weight-medium); }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__foot { display: flex; justify-content: flex-end; align-items: center; gap: 10px; align-self: stretch; }
.seat_container .container__inner .seat_header_filter .seat_filter_popover__apply { display: flex; height: 36px; padding: 14px 4px; justify-content: center; align-items: center; background: transparent; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); cursor: pointer; transition: opacity 0.15s ease, color 0.15s ease; }

.side-nav.expanded + .contents .seat-reservation { display: flex; padding: 20px 40px; align-items: flex-start; gap: 10px; flex: 1 0 0; align-self: stretch; position: absolute; top: 196px; left: 0; bottom: 0; right: 0; width: calc(100% - 264px); max-width: 100%; min-width: calc(1280px - 264px); margin-left: 264px; }
.side-nav.collapsed + .contents .seat-reservation { display: flex; padding: 20px 40px; align-items: flex-start; gap: 10px; flex: 1 0 0; align-self: stretch; position: absolute; top: 196px; left: 0; bottom: 0; right: 0; width: calc(100% - 48px); max-width: 100%; min-width: calc(1280px - 48px); margin-left: 48px; }
.seat-reservation { display: flex; padding: 20px 40px; align-items: flex-start; gap: 10px; flex: 1 0 0; align-self: stretch; position: absolute; top: 132px; left: 0; bottom: 0; right: 0; transition: opacity 0.25s ease, transform 0.25s ease, filter 0.25s ease; transform-origin: center center; opacity: 1; transform: scale(1); filter: blur(0); }
.side-nav.nav-animating ~ .seat_container .seat-reservation { opacity: 0.85; filter: blur(3px); }

/* 회의실 예약 — 상단 필터 + 통합 타임라인 */
.room_container.seat_container { min-height: 0; height: calc(100vh - 64px); max-height: calc(100vh - 64px); overflow: hidden; }
.room_container .room_header_btn { gap: 12px; }
.room_container .room_header_map_btn { display: inline-flex; height: 36px; padding: 0 16px; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); cursor: pointer; white-space: nowrap; }
.room_container .room_header_map_btn:hover { opacity: 0.85; }
.room_container .room_view_toggle { display: flex; align-items: center; gap: -1px; }
.room_container .room_header_btn .room_header_icon_btn_wrap { display: flex; align-items: center; gap: 8px; }
.room_container .room_header_btn .room_stats_btn { display: flex; width: 36px; min-width: 0 !important; height: 36px; padding: 14px 10px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; }
.room_container .room_header_btn .room_stats_btn::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/graph_black_16.svg) no-repeat center / 16px 16px; flex-shrink: 0; }
.room_container .room_header_btn .room_policy_btn { display: flex; width: 36px; min-width: 0 !important; height: 36px; padding: 14px 10px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; }
.room_container .room_header_btn .room_policy_btn::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/policy_black_16.svg) no-repeat center / 18px 18px; flex-shrink: 0; }
.side-drawer .policy__content-inner.policy__content-inner--room,
.desk-policy-drawer .policy__content-inner.policy__content-inner--room { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; flex: 1 1 auto; min-height: 0; width: 100%; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #e0e3eb transparent; }
.side-drawer .policy__content-sub-tit.policy__content-sub-tit--room,
.desk-policy-drawer .policy__content-sub-tit.policy__content-sub-tit--room { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; max-width: none; height: auto; padding-top: 0; }
.side-drawer .policy__content-sub-tit--room .policy__content-sub-tit-bldg,
.desk-policy-drawer .policy__content-sub-tit--room .policy__content-sub-tit-bldg { width: auto; height: auto; }
.side-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext,
.desk-policy-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext { left: 0; right: auto; transform: none; z-index: 100056; }
.side-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::before,
.side-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::after,
.desk-policy-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::before,
.desk-policy-drawer .policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::after { left: 50%; transform: translateX(-50%); }
.side-drawer .policy__content-table table.policy-table--room .tooltip:hover,
.desk-policy-drawer .policy__content-table table.policy-table--room .tooltip:hover { z-index: 100055; }
.room_container .room_view_toggle .btn_calendar { display: flex; min-width: 100px; max-width: 160px; min-height: 36px; max-height: 36px; padding: 13px 16px; justify-content: center; align-items: center; gap: 10px; border: 1px solid var(--clr-w400, #C0C0C0); background: var(--clr-w100, #FFF);}
.room_container .room_view_toggle .btn_calendar:first-child { border-radius: 6px 0 0 6px; }
.room_container .room_view_toggle .btn_calendar:last-child { border-radius: 0 6px 6px 0; }
.room_container .room_view_toggle .btn_calendar.active_btn { background: var(--clr-w100); color: var(--txt-color-p600); border: 1px solid var(--clr-p600) }
.room_container .room_filter_date .date_input { display: inline-flex; height: 36px; min-width: 180px; padding: 0 12px; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); font-size: var(--txt-size-14); box-sizing: border-box; }
.room_container .room_scale_hidden { display: none !important; }
.room_container.seat_container .container__inner { min-height: 0; flex: 1 1 0; overflow: hidden; height: 100%; }
.room_container.seat_container .container__inner > .seat_header_title,
.room_container.seat_container .container__inner > #frmSearch { flex-shrink: 0; }
.room_container .meetingroom--daily { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; align-self: stretch; min-height: 0; width: 100%; overflow: hidden; }
.room_container .meetingroom--daily .meetingroom__head--daily { flex-shrink: 0; align-self: stretch; }
.room_container .meetingroom__date-nav.calendar-wrap { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.room_container .meetingroom__date-nav.calendar-wrap > strong { display: flex; align-items: center; gap: 24px; }
.room_container .meetingroom__date-nav.calendar-wrap > strong .cp-date-picker .cp-date-input-wrap > input:first-child { border: 0 !important; padding: 0 !important; color: var(--txt-color-t900, #1F1F1F) !important; text-align: center; font-family: var(--txt-font-family); font-size: var(--txt-size-16) !important; font-weight: var(--txt-weight-semibold) !important; line-height: var(--txt-line-height); } 
.room_container .meetingroom__date-arrow { display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300); background-color: var(--clr-w100); background-repeat: no-repeat; background-position: center; background-size: 16px; cursor: pointer; padding: 0; font-size: 0; color: transparent; }
.room_container .meetingroom__date-nav #prevDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_left_black_16.svg); }
.room_container .meetingroom__date-nav #nextDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_right_black_16.svg); }
.room_container .meetingroom__date-arrow:hover { background-color: #f5f5f5; border-color: #999; }
.room_container .meetingroom__date-nav .cp-date-picker { width: auto !important; min-width: 0; }
.room_container .meetingroom__date-nav .cp-date-input-wrap { display: inline-flex; }
.room_container .meetingroom__date-nav .cp-date-picker .cp-date-toggle { display: none !important; }
.room_container .meetingroom__date-nav .cp-date-picker .cp-date-input.meetingroom__date-input,
.room_container .meetingroom__date-input.cp-date-input { width: auto !important; min-width: 0 !important; height: auto !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center; font-size: var(--txt-size-16) !important; font-weight: var(--txt-weight-semibold) !important; color: var(--txt-color-t900) !important; cursor: pointer; }
.room_container .meetingroom__date-nav .cp-date-picker[status="hover"] .cp-date-input,
.room_container .meetingroom__date-nav .cp-date-picker[status="active"] .cp-date-input { border: 0 !important; background: transparent !important; }
.room_container .meetingroom__date-input { width: auto !important; min-width: 0; padding: 0 !important; border: 0; background: transparent; text-align: center; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); cursor: pointer; }
.room_container .meetingroom__head--daily .legend { display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; list-style: none; }
.room_container .meetingroom__head--daily .legend li { position: relative; margin: 0; padding-left: 20px; font-size: var(--txt-size-13); color: var(--txt-color-t500); white-space: nowrap; }
.room_container .meetingroom__head--daily .legend li::after { content: ""; position: absolute; top: 50%; left: 0; width: 12px; height: 12px; margin-top: -6px; border-radius: 2px; box-sizing: border-box; }
.room_container .meetingroom__head--daily .legend li.st1::after { background: var(--clr-w100); border: 1px solid var(--clr-w700); border-radius: 4px; }
.room_container .meetingroom__head--daily .legend li.st3::after { background: var(--clr-p100); border: 1px solid var(--clr-p500); border-radius: 4px; }
.room_container .meetingroom__body--unified { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; align-self: stretch; min-height: 0; width: 100%; position: relative; overflow: hidden; border-top: 1px solid var(--clr-w300); }
.room_container .meetingroom__timeline { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; align-self: stretch; width: 100%; position: relative; overflow: hidden; background: var(--clr-w100); }
.room_container .meetingroom__timeline-header { display: flex; flex-shrink: 0; height: 40px; align-items: center; gap: 1px; align-self: stretch; border-bottom: 1px solid var(--clr-w300); background: var(--clr-p200); }
.room_container .meetingroom__timeline-room-label { display: flex; height: 40px; width: 180px; max-width: 180px; padding: 0 16px; justify-content: center; align-items: center; align-self: stretch; border-right: 1px solid var(--clr-w300); border-bottom: 1px solid var(--clr-w300); background: var(--clr-w100); }
.room_container .meetingroom__timeline-hours { display: flex; flex: 1 0 0; height: 40px; align-items: center; gap: 1px; align-self: stretch; }
.room_container .meetingroom__timeline-hour { flex: 1 0 0; position: relative; color: var(--txt-color-t500, #555); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.room_container .meetingroom__timeline-hour--with-end .meetingroom__timeline-hour-end { position: absolute; right: 10px; top: 50%; transform: translate(50%, -50%); font-style: normal; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; letter-spacing: inherit; }
.room_container .meetingroom__timeline-hour:last-child { border-right: 0; }
.room_container .meetingroom--daily .meetingroom__body--list { display: flex; flex-direction: column; flex: 1 1 0; width: 100%; min-width: 100%; min-height: 0; height: 0; margin: 0; padding: 0; box-sizing: border-box; align-self: stretch; align-items: flex-start; list-style: none; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: none; -ms-overflow-style: none; }
.room_container .meetingroom--daily .meetingroom__body--list::-webkit-scrollbar { width: 0; height: 0; }
.room_container .meetingroom--daily .meetingroom__body--list li { width: 100%; margin-top: 0; min-height: 120px; height: auto; flex-shrink: 0; align-items: center; }
.room_container .meetingroom--daily .meetingroom__body--list li:last-child { border-bottom: 0; }
.room_container .meetingroom--daily .meetingroom__item { display: flex; width: 100%; border-top: 0; table-layout: unset; min-height: 72px; border-bottom: 1px solid var(--clr-w300); background: var(--clr-w100); }
.room_container .meetingroom--daily .meetingroom__item:last-child { border-bottom: 0; }
.room_container .meetingroom--daily .meetingroom__item--info { display: flex; height: 120px; width: 180px; max-width: 180px; padding: 16px; flex-direction: column; justify-content: space-between; align-items: flex-start; align-self: stretch; gap: 8px; border-right: 1px solid var(--clr-w300); border-bottom: 1px solid var(--clr-w300); background: var(--clr-w100); box-sizing: border-box; }
.room_container .meetingroom--daily .meetingroom__item--approval { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 6px; background: var(--clr-n30, #f5f5f5); flex-shrink: 0; }
.room_container .meetingroom--daily .meetingroom__item--approval-icon { display: block; width: 16px; height: 16px; background: url("/figma/svg/secret_lightgray_16.svg") no-repeat center / contain; }
.room_container .meetingroom--daily .meetingroom__item--info .name { display: -webkit-box; min-width: 120px; -webkit-box-orient: vertical; -webkit-line-clamp: 1; align-self: stretch; overflow: hidden; color: var(--txt-color-t900, #1F1F1F); text-overflow: ellipsis; font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.room_container .meetingroom--daily .meetingroom__item--footer { display: flex; justify-content: space-between; align-items: center; align-self: stretch; }
.room_container .meetingroom--daily .meetingroom__item--footer .tooltip .tooltiptext { left: -14px; }
.room_container .meetingroom--daily .meetingroom__item--footer-left { display: flex; align-items: center; gap: 6px; }
.room_container .meetingroom--daily .meetingroom__item--info .seat { color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.room_container .meetingroom--daily .meetingroom__item--icon { flex-shrink: 0; display: inline-block; width: 14px; height: 14px; margin: 0; background-repeat: no-repeat; background-position: center; background-size: contain; vertical-align: middle; }
.room_container .meetingroom--daily .meetingroom__item--icon-perfume { background-image: url("/figma/svg/perfume_lightgray_14.svg"); }
.room_container .meetingroom--daily .meetingroom__item--icon-people.peopleIcon { background-image: url("/figma/svg/usersensor_lightgray_14.svg"); }
.room_container .meetingroom--daily .meetingroom__item--icon-people.peopleIcon.one { background-image: url(../../images/connectplace/common/people_one.png) !important; background-size: contain; }
.room_container .meetingroom--daily .meetingroom__item--icon-people.peopleIcon.full { background-image: url(../../images/connectplace/common/people_full.png) !important; background-size: contain; }
.room_container .meetingroom--daily .meetingroom__item--detail-btn { flex-shrink: 0; width: 16px; height: 16px; padding: 0; border: 0; background: url("../../../figma/svg/viewdetail_lightgray_16.svg") no-repeat center / contain; cursor: pointer; }
.room_container .meetingroom--daily .meetingroom__item--detail-btn .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.room_container .meetingroom--daily .meetingroom__item--cell { flex: 1; min-width: 0; display: block; position: relative; border-bottom: 1px solid var(--clr-w300); background: var(--clr-w100);}
.room_container .meetingroom--daily .meetingroom__item--cell table { width: 100%; height: 100%; border-right: 0; }
.room_container .meetingroom--daily .meetingroom__item--cell table td .meet_cell .reservation.my { background: var(--clr-p100); border: 1px solid var(--clr-p500); color: var(--clr-p500); border-radius: 4px; }
.room_container .meetingroom--daily .meetingroom__item--cell table td .meet_cell .reservation.my > span { color: var(--clr-p500); }
.room_container .meetingroom--daily .meetingroom__item--cell table td .meet_cell .reservation.Impossible { background: var(--clr-w100); border: 1px solid var(--clr-w700); color: var(--txt-color-t700); border-radius: 4px; }
.room_container .meetingroom--daily .meetingroom__item--cell table td .meet_cell .reservation.passaway { background: var(--clr-n30); border-right: 1px solid var(--clr-w100); }
.room_container .meetingroom--daily .meetingroom__item--cell table.reservationTimeTable td.ui-selected .meet_cell .reservation,
.room_container .meetingroom--daily .meetingroom__item--cell table.reservationTimeTable td.ui-selecting .meet_cell .reservation { background-color: rgba(26, 132, 244, 0.14) !important; border-color: rgba(26, 132, 244, 0.35) !important; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.tooltip:not(.emptyTd) { position: relative; overflow: visible; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.tooltip:not(.emptyTd) .tooltiptext { left: 50%; right: auto; top: calc(100% + 10px); bottom: auto; transform: translateX(-50%); z-index: 10000; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.tooltip:not(.emptyTd) .tooltiptext::after { left: 50%; top: -6px; bottom: auto; transform: translateX(-50%); }
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip { position: relative; overflow: visible; z-index: 1; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip:hover,
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip.ui-selecting,
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip.ui-selected { z-index: 1; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip .tooltiptext { left: 50%; right: auto; top: calc(100% + 10px); bottom: auto; transform: translateX(-50%); z-index: 10000; }
.room_container .meetingroom--daily .meetingroom__item--cell table td.emptyTd.tooltip .tooltiptext::after { left: 50%; top: -6px; bottom: auto; transform: translateX(-50%); }
body > .tooltip.empty-td-floating-tooltip-wrap { position: fixed !important; z-index: 100000 !important; pointer-events: none; overflow: visible; }
body > .tooltip.empty-td-floating-tooltip-wrap .tooltiptext { position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; transform: none !important; opacity: 1 !important; visibility: visible !important; }
body > .tooltip.empty-td-floating-tooltip-wrap .tooltiptext.tooltip-middle::after { left: 50%; top: -6px; bottom: auto; transform: translateX(-50%); }
.room_container .meetingroom--daily .meetingroom__item--cell table td .meet_cell .reservation.active button.add-btn { border-radius: 6px; background: var(--txt-color-p600); }
.room_container .meetingroom__body--unified #divReservationButtonArea { position: absolute; z-index: 30; display: none; pointer-events: none; }
.room_container .meetingroom__body--unified #divReservationButtonArea button.add-btn { position: static; pointer-events: auto; display: inline-flex; min-width: 72px; height: 36px; padding: 0 16px; align-items: center; justify-content: center; border: 0; border-radius: 6px; background: var(--txt-color-p600); color: #fff; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); letter-spacing: -0.02em; box-shadow: 0 2px 6px rgba(26, 132, 244, 0.25); cursor: pointer; transform: none; bottom: auto; left: auto; }
.room_container .meetingroom__body--unified #divReservationButtonArea button.add-btn:hover { background: #1574db; opacity: 1; }
.room_container .meetingroom__timeline #currPos { display: none; position: absolute; width: 1px; background-color: #5F6B8B; border: 0; z-index: 25; pointer-events: none; }
.room_container .meetingroom__timeline #currPosTime { display: none; position: absolute; z-index: 26; pointer-events: none; min-width: 50px; height: 20px; padding: 1px 8px; border-radius: 4px; background: var(--clr-n600); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); text-align: center; box-sizing: border-box; white-space: nowrap; }
.room_container .meetingroom__body--unified #currIndicator { display: none !important; }
.room_container .meetingroom__head--daily .room_header_map_btn { margin-left: auto; flex-shrink: 0; }
.room_container .meetingroom__date-arrow.disabled { opacity: 0.4; cursor: default; pointer-events: none; }
.room_container #type3 .meetingroom__date-nav .prevDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_left_black_16.svg); }
.room_container #type3 .meetingroom__date-nav .nextDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_right_black_16.svg); }
.room_container #type3 #weekView-Date.meetingroom__date-input { width: auto !important; min-width: 0; margin: 0; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center; font-size: var(--txt-size-16) !important; font-weight: var(--txt-weight-semibold) !important; color: var(--txt-color-t900) !important; cursor: default; white-space: nowrap; }
.room_container #type3 #weekView-Date.meetingroom__date-input:focus { outline: 0; }
.room_container #type4 .meetingroom__date-nav .prevDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_left_black_16.svg); }
.room_container #type4 .meetingroom__date-nav .nextDate.meetingroom__date-arrow { background-image: url(../../../figma/svg/arrow_right_black_16.svg); }
.room_container #type4 #monthView-Date.meetingroom__date-input { width: auto !important; min-width: 0; margin: 0; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center; font-size: var(--txt-size-16) !important; font-weight: var(--txt-weight-semibold) !important; color: var(--txt-color-t900) !important; cursor: default; white-space: nowrap; }
.room_container .meetingroom--monthly { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; align-self: stretch; min-height: 0; width: 100%; overflow: hidden; }
.room_container .meetingroom--monthly .meetingroom__head--daily { flex-shrink: 0; align-self: stretch; }
.room_container .meetingroom--monthly .meetingroom-monthview { display: none; }
.room_container .meetingroom--monthly .meetingroom-monthview-calendar { flex: 1 1 0; min-height: 0; }

/* 회의실 예약 — 주간 뷰 */
.room_container .meetingroom--weekly { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; align-self: stretch; min-height: 0; width: 100%; overflow: hidden; }
.room_container .meetingroom--weekly .meetingroom__head--daily { flex-shrink: 0; align-self: stretch; }
.room_container .meetingroom--weekly .meetingroom-weekview { flex: 1 1 0; min-height: 0; overflow: hidden; margin-top: 0;}
.room_container .meetingroom-weekview-calendar { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; align-self: stretch; width: 100%; border-top: 1px solid var(--clr-w300); overflow: hidden; background: var(--clr-w100); }
.room_container .meetingroom-weekview-timeline-header { display: grid; grid-template-columns: 180px repeat(7, minmax(0, 1fr)); flex-shrink: 0; border-bottom: 1px solid var(--clr-w300); background: var(--clr-p200); position: relative; z-index: 1; }
.room_container .meetingroom-weekview-room-label,
.room_container .meetingroom-weekview-calendar-date { display: flex; height: 40px; align-items: center; justify-content: center; border-right: 1px solid var(--clr-w300); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); font-family: var(--txt-font-family); box-sizing: border-box; background: var(--clr-w100) !important; }
.room_container .meetingroom-weekview-room-label { background: var(--clr-w100); font-weight: var(--txt-weight-medium); }
.room_container .meetingroom-weekview-calendar-date:last-child { border-right: 0; }
.room_container .meetingroom-weekview-calendar-date.suncolor { color: var(--clr-r900); }
.room_container .meetingroom-weekview-calendar-date.satcolor { color: var(--txt-color-p600); }
.room_container .meetingroom-weekview-calendar-date.is-today { background: var(--clr-p100); }
.room_container .meetingroom-weekview-body { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: none !important; -ms-overflow-style: none !important; position: relative; z-index: 2; }
.room_container .meetingroom-weekview-body::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; background: transparent !important; }
.room_container .meetingroom-weekview-body::-webkit-scrollbar-thumb { display: none !important; background: transparent !important; }
.room_container .meetingroom-weekview-body::-webkit-scrollbar-track { display: none !important; background: transparent !important; }
.room_container .meetingroom-weekview-row { display: grid; grid-template-columns: 180px repeat(7, minmax(0, 1fr)); min-height: 140px; }
.room_container .meetingroom-weekview-row:last-child { border-bottom: 0; }
.room_container .meetingroom-weekview-room-info { display: flex; height: 140px; padding: 16px; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 8px; border-bottom: 1px solid var(--clr-w300); border-right: 1px solid var(--clr-w300); background: var(--clr-w100); box-sizing: border-box; }
.room_container .meetingroom-weekview-room-info .meetingroom__item--approval { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 6px; background: var(--clr-n30, #f5f5f5); flex-shrink: 0; }
.room_container .meetingroom-weekview-room-info .meetingroom__item--approval-icon { display: block; width: 16px; height: 16px; background: url("/figma/svg/secret_lightgray_16.svg") no-repeat center / contain; }
.room_container .meetingroom-weekview-room-info .name { display: -webkit-box; min-width: 0; width: 100%; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; color: var(--txt-color-t900); text-overflow: ellipsis; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.room_container .meetingroom-weekview-room-info .meetingroom__item--footer { display: flex; justify-content: space-between; align-items: center; align-self: stretch; }
.room_container .meetingroom-weekview-room-info .meetingroom__item--footer-left { display: flex; align-items: center; gap: 6px; }
.room_container .meetingroom-weekview-room-info .seat { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.room_container .meetingroom-weekview-room-info .meetingroom__item--icon { flex-shrink: 0; display: inline-block; width: 14px; height: 14px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.room_container .meetingroom-weekview-room-info .meetingroom__item--icon-perfume { background-image: url("/figma/svg/perfume_lightgray_14.svg"); }
.room_container .meetingroom-weekview-room-info .meetingroom__item--icon-people.peopleIcon { background-image: url("/figma/svg/usersensor_lightgray_14.svg"); }
.room_container .meetingroom-weekview-room-info .meetingroom__item--detail-btn { flex-shrink: 0; width: 16px; height: 16px; padding: 0; border: 0; background: url("../../../figma/svg/viewdetail_lightgray_16.svg") no-repeat center / contain; cursor: pointer; }
.room_container .WeekView-Basic-Component { display: flex; flex-direction: column; gap: 4px; min-height: 140px; height: 140px; padding: 8px; border-right: 1px solid var(--clr-w300) !important; border-bottom: 1px solid var(--clr-w300) !important; background: var(--clr-w100); box-sizing: border-box; overflow: hidden; position: relative; }
.room_container .WeekView-Basic-Component:last-child { border-right: 0; }
.room_container .WeekView-Basic-Component.is-today { background: var(--clr-p100); }
.room_container .WeekView-Basic-Component.passaway { background: var(--clr-n30); }
.room_container .WeekView-Basic-Component.passaway.is-today { background: var(--clr-p100); opacity: 0.85; }
.room_container .meetingroom-weekview-resv-list { display: flex; flex-direction: column; gap: 4px; flex: 1 1 0; min-height: 0; overflow: hidden; }
.room_container .meetingroom-weekview-resv { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px; padding: 4px 8px; border-radius: 4px; box-sizing: border-box; font-size: var(--txt-size-12); line-height: var(--txt-line-height); overflow: hidden; }
.room_container .meetingroom-weekview-resv--general { background: var(--clr-w100); border: 1px solid var(--clr-w700); color: var(--txt-color-t700); }
.room_container .meetingroom-weekview-resv--my { background: var(--clr-p100); border: 1px solid var(--clr-p500); color: var(--clr-p500); cursor: pointer; }
.room_container .meetingroom-weekview-resv__title { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--txt-weight-medium); }
.room_container .meetingroom-weekview-resv__time { flex-shrink: 0; white-space: nowrap; font-weight: var(--txt-weight-regular); }
.room_container .meetingroom-weekview-more { display: flex; height: 20px; min-width: 60px; align-items: center; gap: 4px; color: var(--txt-color-t70); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); cursor: pointer; white-space: nowrap; line-height: var(--txt-line-height); }
.room_container .meetingroom-weekview-resv.tooltip { overflow: visible; position: relative; z-index: 1; }
.room_container .meetingroom-weekview-resv.tooltip:hover { z-index: 30; }
.room_container .meetingroom-weekview-resv-list > .tooltip { display: flex; flex-shrink: 0; overflow: visible; position: relative; z-index: 1; }
.room_container .meetingroom-weekview-resv-list > .tooltip:hover { z-index: 30; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .meetingroom-weekview-resv-list:has(.tooltip:hover) { overflow: visible; }
.room_container .WeekView-Basic-Component:has(.tooltip:hover),
.room_container .WeekView-Basic-Component.tooltip:hover { overflow: visible; z-index: 20; }
.room_container .WeekView-Basic-Component.tooltip:hover > .meetingroom-weekview-resv-list { overflow: visible; }
.room_container .meetingroom-weekview-row:has(.tooltip:hover) { position: relative; z-index: 10; }*/
.room_container .meetingroom-weekview-resv-list .tooltip .tooltiptext,
.room_container .WeekView-Basic-Component.tooltip > .room-view-cell-tooltip .tooltiptext { top: auto; bottom: calc(100% + 10px); left: 50%; right: auto; transform: translateX(-50%); }
.room_container .meetingroom-weekview-resv-list .tooltip .tooltiptext::after,
.room_container .WeekView-Basic-Component.tooltip > .room-view-cell-tooltip .tooltiptext::after { top: auto; bottom: -6px; left: 50%; transform: translateX(-50%) rotate(180deg); }
.room_container .meetingroom-weekview-row:first-child .meetingroom-weekview-resv-list .tooltip .tooltiptext,
.room_container .meetingroom-weekview-row:first-child .WeekView-Basic-Component.tooltip > .room-view-cell-tooltip .tooltiptext { top: calc(100% + 10px); bottom: auto; }
.room_container .meetingroom-weekview-row:first-child .meetingroom-weekview-resv-list .tooltip .tooltiptext::after,
.room_container .meetingroom-weekview-row:first-child .WeekView-Basic-Component.tooltip > .room-view-cell-tooltip .tooltiptext::after { top: -6px; bottom: auto; transform: translateX(-50%); }
.room_container .WeekView-Basic-Component.tooltip:hover > .room-view-cell-tooltip .tooltiptext { opacity: 1; visibility: visible; }
.room_container .WeekView-Basic-Component.tooltip:hover .meetingroom-weekview-resv.tooltip .tooltiptext,
.room_container .WeekView-Basic-Component.tooltip:hover .meetingroom-weekview-resv-list > .tooltip .tooltiptext { opacity: 0; visibility: hidden; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .WeekView-Basic-Component.tooltip:has(.meetingroom-weekview-resv.tooltip:hover) > .room-view-cell-tooltip .tooltiptext,
.room_container .WeekView-Basic-Component.tooltip:has(.meetingroom-weekview-resv-list > .tooltip:hover) > .room-view-cell-tooltip .tooltiptext { opacity: 0 !important; visibility: hidden !important; }*/
.room_container .meetingroom-weekview-resv.tooltip:hover > .tooltiptext,
.room_container .meetingroom-weekview-resv-list > .tooltip:hover > .tooltiptext { opacity: 1 !important; visibility: visible !important; }
.room_container .room-view-cell-tooltip { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.calendar-wrap.room_filter_date { width: auto !important; }
.room_container .meetingroom-monthview-calendar { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 1 0; min-height: 0; margin-top: 0 !important; border-top: 1px solid var(--clr-w300); overflow: hidden; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar > div:nth-child(1) { display: flex; align-items: center; align-self: stretch; margin-bottom: 0 !important; flex-shrink: 0; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-monthview-body { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 1 0; min-height: 0; overflow-y: auto; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-week-row { display: flex; min-height: 165px; height: 165px; align-items: stretch; align-self: stretch; border-bottom: 1px solid var(--clr-w300); overflow: clip; overflow-clip-margin: 40px; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-week-row > .WeekView-Schedule-Component { flex: 1 1 0; min-width: 0; padding: 10px 6px 6px; border-color: var(--clr-w300); background-color: var(--clr-w100); border-top: 0; position: relative; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-week-row > .WeekView-Schedule-Component.passaway { background: var(--clr-n30) !important; background-color: var(--clr-n30) !important; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component > div:first-child { display: flex; height: 25px; align-items: center; gap: 4px; align-self: stretch; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component > div:first-child > span { display: flex; height: 16px; flex-direction: column; justify-content: center; flex: 1 0 0; color: var(--txt-color-t300); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component:not(.passaway) > div:first-child:not(.suncolor):not(.satcolor) > span:not(.today_highlight) { color: var(--txt-color-t900); }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component:not(.passaway) > div:first-child.suncolor > span:not(.today_highlight) { color: var(--clr-r900) !important; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component:not(.passaway) > div:first-child.satcolor > span:not(.today_highlight) { color: var(--txt-color-p600) !important; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component.passaway > div:first-child > span:not(.today_highlight) { color: var(--txt-color-t300) !important; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .WeekView-Schedule-Component > div:first-child > span.today_highlight { display: flex; width: auto; height: auto !important; padding: 3px 5px; flex: 0 !important; justify-content: center; align-items: center; align-self: stretch; border-radius: 30px; background: var(--clr-p600); color: var(--txt-color-t100) !important; font-weight: var(--txt-weight-medium) !important; }
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box { display: flex; max-height: 110px; flex-direction: column; align-items: stretch; gap: 6px; flex: 1 1 0; min-width: 0; width: 100%; align-self: stretch; position: relative; }
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box .room-monthview-resv-row { display: flex; padding: 4px 6px; align-items: center; gap: 4px; align-self: stretch; min-width: 0; width: 100%; max-width: 100%; box-sizing: border-box; border-radius: 4px; border: 1px solid transparent; background: transparent; }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-wrap { display: flex; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; width: 100%; max-width: 100%; }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-name { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-time { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 6px; flex-shrink: 0; overflow: hidden; max-width: 100%; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); text-align: right; white-space: nowrap; }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-time-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row--general { color: var(--clr-w700); border-color: var(--clr-w700) !important; background: var(--clr-w100); }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row--my { color: var(--clr-p500); border-color: var(--clr-p500) !important; background: var(--clr-p100); cursor: pointer; }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-more { display: flex; height: 20px; min-width: 60px; align-items: center; gap: 4px; color: var(--txt-color-t70); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); cursor: pointer; }
.room_container .meetingroom-monthview-calendar > div:nth-child(1) { position: relative; z-index: 1; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-monthview-body { position: relative; z-index: 2; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; touch-action: pan-y; overscroll-behavior: contain; }
.room_container .meetingroom-monthview-calendar.schedule-calendar-monthview-calendar .schedule-calendar-monthview-body::-webkit-scrollbar { display: none; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .meetingroom-monthview-calendar .schedule-calendar-week-row:has(.tooltip:hover),
.room_container .meetingroom-monthview-calendar .schedule-calendar-week-row:has(.WeekView-Schedule-Component.tooltip:hover) { position: relative; z-index: 2; overflow: visible; }*/
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component.tooltip,
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row.tooltip { overflow: visible; position: relative; z-index: 1; }
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component.tooltip:hover,
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row.tooltip:hover { z-index: 10000; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component:has(.tooltip:hover),
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component.tooltip:hover { overflow: visible; z-index: 3; }
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component:has(.list_hide_schedule_box .tooltip:hover) > .room-view-cell-tooltip { z-index: -1; }
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component.tooltip:hover > .list_hide_schedule_box,
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box:has(.tooltip:hover) { overflow: visible; position: relative; z-index: 10; }*/
.room_container .meetingroom-monthview-calendar.is-scrolling .tooltiptext { visibility: hidden !important; opacity: 0 !important; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .meetingroom-monthview-calendar.is-scrolling .WeekView-Schedule-Component.tooltip:hover,
.room_container .meetingroom-monthview-calendar.is-scrolling .WeekView-Schedule-Component:has(.tooltip:hover),
.room_container .meetingroom-monthview-calendar.is-scrolling .room-monthview-resv-row.tooltip:hover { z-index: 1; }
.room_container .meetingroom-monthview-calendar.is-scrolling .schedule-calendar-week-row:has(.tooltip:hover),
.room_container .meetingroom-monthview-calendar.is-scrolling .schedule-calendar-week-row:has(.WeekView-Schedule-Component.tooltip:hover) { z-index: auto; }
.room_container .meetingroom-monthview-calendar.is-scrolling .WeekView-Schedule-Component.tooltip:hover > .list_hide_schedule_box,
.room_container .meetingroom-monthview-calendar.is-scrolling .list_hide_schedule_box:has(.tooltip:hover) { overflow: hidden; }*/
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip { display: flex; flex-shrink: 0; overflow: visible; position: relative; z-index: 1; }
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip:hover { z-index: 9999; }
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component > .room-view-cell-tooltip > .tooltiptext { display: flex; flex-flow: column nowrap; justify-content: start; align-items: flex-start; width: max-content; height: fit-content; flex: none; position: absolute; max-width: min(320px, calc(100vw - 40px)); margin: 0; padding: 10px 12px; border-radius: 10px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; letter-spacing: var(--txt-letter-spacing); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24); -webkit-box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24); z-index: 9999; pointer-events: none; isolation: isolate; word-break: keep-all; opacity: 0; visibility: hidden; }
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component > .room-view-cell-tooltip > .tooltiptext::after { content: ""; position: absolute; left: 50%; top: -6px; width: 12px; height: 6px; background-color: var(--clr-w800); clip-path: polygon(50% 0, 0 100%, 100% 100%); z-index: 1; transform: translateX(-50%); }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row.tooltip .tooltiptext,
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip .tooltiptext,
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component > .room-view-cell-tooltip .tooltiptext { top: calc(100% + 10px); bottom: auto; left: 50%; right: auto; transform: translateX(-50%); }
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row.tooltip .tooltiptext::after,
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip .tooltiptext::after,
.room_container .meetingroom-monthview-calendar .WeekView-Schedule-Component > .room-view-cell-tooltip .tooltiptext::after { top: -6px; bottom: auto; left: 50%; transform: translateX(-50%); }
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip .tooltiptext.tooltip-left::after { top: -6px; bottom: auto; left: 15%; transform: translateX(-50%); }
.room_container .WeekView-Schedule-Component.tooltip:hover > .room-view-cell-tooltip .tooltiptext { opacity: 1; visibility: visible; }
.room_container .WeekView-Schedule-Component.tooltip:hover .room-monthview-resv-row.tooltip .tooltiptext,
.room_container .WeekView-Schedule-Component.tooltip:hover .list_hide_schedule_box > .tooltip .tooltiptext { opacity: 0; visibility: hidden; }
/* --- CSS4 설정(:has) 별도 분리 ---
.room_container .WeekView-Schedule-Component.tooltip:has(.room-monthview-resv-row.tooltip:hover) > .room-view-cell-tooltip .tooltiptext,
.room_container .WeekView-Schedule-Component.tooltip:has(.list_hide_schedule_box > .tooltip:hover) > .room-view-cell-tooltip .tooltiptext { opacity: 0 !important; visibility: hidden !important; }*/
.room_container .meetingroom-monthview-calendar .room-monthview-resv-row.tooltip:hover > .tooltiptext,
.room_container .meetingroom-monthview-calendar .list_hide_schedule_box > .tooltip:hover > .tooltiptext { opacity: 1 !important; visibility: visible !important; }
/* 공간 사용 현황 (Dashboard) - Desk 좌석예약 레이아웃 공통 */
.dashboard_container .dashboard_header_filter { flex-wrap: wrap; }
.dashboard_container .dashboard_header_subtext { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; margin-left: auto; border-radius: 6px; background: var(--clr-w100, #FFF); }
.dashboard_container .dashboard_header_subtext p { margin: 0; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.dashboard_container .dashboard_header_subtext p span { margin: 0; color: var(--txt-color-p600); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.dashboard_container .seat_header_title .dashboard_refresh_timer { display: flex; height: 36px; justify-content: flex-end; align-items: center; gap: 8px; color: var(--txt-color-t70, #999); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.dashboard_container .seat_header_title .dashboard_refresh_timer span { color: var(--txt-color-t70, #999); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); height: 36px; line-height: 36px; }
.dashboard_container .seat_header_title .dashboard_refresh_timer .refresh { cursor: pointer; display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300, #E3E3E3); background-color: var(--clr-w100, #FFF); background: url(../../../figma/svg/refresh_black_16.svg) no-repeat center;     }
.dashboard_container .seat_header_btn { flex-wrap: wrap; }
.seat-reservation .map-area { position: absolute; top: 0; left: 0; bottom: 0; right: 0; overflow: auto; z-index: 0; }
/* 메인 맵 iframe 로딩 전환(뒤로가기 등): 체감 대기 완화 */
.seat-reservation .map-area .map_frame_transition_overlay { position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 0.28s ease, visibility 0.28s ease; background: linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(248, 250, 252, 0.92) 100%); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.seat-reservation .map-area .map_frame_transition_overlay.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
	.seat-reservation .map-area .map_frame_transition_overlay { transition: opacity 0.12s ease; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
.seat-reservation .seat_filter_popover_backdrop { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 4; background: transparent; cursor: default; }
.seat-reservation .seat_filter_popover_backdrop:not([hidden]) { display: block; }
.seat-reservation .map-area .sample { position: absolute; top: 300px; left: 300px; background: #01bb66; width: 50px; height: 50px; }

/* 조직원검색 리스트 */
.staff-scroll { height: 325px; margin-top: 30px; }

.staff-list { position: relative; min-height: 420px; max-height: 420px; height: auto; overflow-y: auto; border-top: 0; padding-bottom: 25px; box-sizing: border-box; }
.staff-list li { padding: 0 30px; box-sizing: border-box; border-bottom: 0; }
.staff-list li .user-item { display: flex; align-items: center; justify-content: space-between; height: 60px; position: relative; border: 1px solid #f0f0f0; box-sizing: border-box; padding: 10px 20px; }
.staff-list li + li .user-item { border-top: 0; }
.staff-list li .user-item .user-info { position: relative; padding-left: 60px; overflow: hidden; height: 48px !important; box-sizing: border-box; display: flex; align-items: center; gap: 20px; }
.staff-list li .user-item .user-info .img { width: 40px; height: 40px; border: 0; position: absolute; top: 50% !important; left: 0; transform: translateY(-50%);}
.staff-list li .user-item .user-info .img img { display: block; width: 100%; height: 100%;overflow: hidden; border-radius: 40px;  -o-object-fit: cover; object-fit: cover; box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2);}
.staff-list li .user-item .user-info .name { color: #000; min-width: 100px; width: auto; white-space: nowrap; overflow: unset; font-size: 16px; font-weight: 500; text-overflow: unset; }
.staff-list li .user-item .user-info .name span { font-size: 12px; color: #59a7f7; font-weight: 500; margin-left: 10px; white-space: nowrap; }
.staff-list li .user-item .user-info .team { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: auto; color: #4c5266; font-size: 14px; font-weight: 500; border-left: 1px solid #ddd; padding:0 10px; line-height: 1; }
.staff-list li .user-item > button,
.staff-list li .user-item button.pick { min-width: 90px; width: 90px; height: 30px; border: 0; background-color: #06315f; color: #fff; font-size: 14px; font-weight: 600; }
.staff-list li .user-item button.delt { height: 16px; width: 16px; background: url("../../images/connectplace/common/delet_icons.png") no-repeat 50%; text-indent: -9999px; position: absolute; top: 22px; right: 0; }
.staff-list li .user-item.noRsv > button { background-color: #f1f2f6; color: #06315fcc; font-size: 13px; }
.staff-list li .user-item.noRsv > button:hover { cursor: default; opacity: 1; }

.staff-list .data_blank { font-size: 15px; color: #999; font-weight: 500; text-align: center; padding: 20px; padding-top: 70px; background:url(../../images/connectplace/common/ico_noresult.png)no-repeat center top 20px/35px; }

/* 조직원검색 리스트(기본,팀원보기) : 근무상태 */
.staff-list li .user-item.workPossible figure:hover, .staff-list li .user-item.workImpossible figure:hover{cursor: pointer;}
.staff-list li .user-item.workPossible figure::before{position: absolute; right: 0; bottom: 0; display: block; content: ""; width:10px; height:10px; background: #17b911 no-repeat center/ 12px; border-radius: 100%;box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3);}
.staff-list li .user-item.workImpossible figure::before{position: absolute; right: 0; bottom: 0; display: block; content: ""; width:10px; height:10px; background: #bfc9d5 no-repeat center/ 10px; border-radius: 100%;box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3);}
.staff-list li .user-item .workCondition{display: none; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #ffffffe0; padding: 0 5px; text-align: center; line-height: 1.8; font-size: 13px; letter-spacing: -0.5px; font-weight: 500; color: #4C5266;}
.staff-list li .user-item figure:hover + .workCondition, .staff-list li .user-item .workCondition:hover{display: block; cursor: pointer;}

/* 조직원검색 리스트(조직도) : 근무상태*/
#organizationChart .chart-list .body .staff-list li.workPossible .user-item .user-info .name, #organizationChart .chart-list .body .staff-list li.workImpossible .user-item .user-info .name{cursor: pointer; line-height: 50px;}
#organizationChart .chart-list .body .staff-list li.workPossible .user-item::before{position: absolute; left: 5px; top: 50%; transform: translateY(-50%); display: block; content: ""; width:8px; height:8px; background: #17b911 no-repeat center/ 12px; border-radius: 100%;box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3);}
#organizationChart .chart-list .body .staff-list li.workImpossible .user-item::before{position: absolute; left: 5px; top: 5   0%; transform: translateY(-50%); display: block; content: ""; width:8px; height:8px; background: #bfc9d5 no-repeat center/ 10px; border-radius: 100%;box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.3);}
#organizationChart .chart-list .body .staff-list li .workCondition{display: none; position: absolute; left: 0; bottom:0; transform: translateY(0); background-color: #ffffffe0; padding: 0 5px; text-align: center; line-height: 1.8; font-size: 13px; letter-spacing: -0.5px; font-weight: 500; color: #4C5266;}
#organizationChart .chart-list .body .staff-list li .workCondition.on, #organizationChart .chart-list .body .staff-list li .workCondition.on:hover{display: block; cursor: pointer; pointer-events: none;}

/* 좌석예약 : 직원 검색 팝업 */
.layer-pop-area[data-role-popup="staffSearch"].active { display: flex !important; }
.layer-pop-area[data-role-popup="staffSearch"] { width: 960px; max-width: 960px; height: 750px; padding: 32px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e500); }
.layer-pop-area[data-role-popup="staffSearch"].search_team_member_not_orgchart { width: 640px; height: 717px; }
.layer-pop-area[data-role-popup="staffSearch"] .pop-btn-area { border-top: 1px solid #f4f5f8; }
.layer-pop-wrap .layer-pop-area[data-role-popup="staffSearch"] .pop-head { display: flex; padding: 0 0 16px 0; justify-content: flex-end; align-items: flex-start; gap: 24px; align-self: stretch; background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300);}
.layer-pop-wrap .layer-pop-area[data-role-popup="staffSearch"] .pop-head > h2 { max-height: 62px; flex: 1 0 0; font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: #141414; line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area.search_team_member .pop-cont { display: flex; flex-direction: column; align-items: stretch; gap: 0; flex: 1 0 0; align-self: stretch; min-height: 0; box-shadow: none; -webkit-box-shadow: none; }
.layer-pop-wrap .layer-pop-area.search_team_member .staff-search-btn { display: flex; justify-content: flex-end; align-items: flex-start; gap: 8px; align-self: stretch; }
#firstDiv { border-top: 0 !important; padding: 0 !important; margin: 0 !important; }
.layer-pop-area[data-role-popup="staffSearch"] #firstDiv.staff-search-first-root { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100%; gap: 12px; }
.layer-pop-area[data-role-popup="staffSearch"] #firstDiv > #secondDiv { flex: 1 1 auto; min-height: 0; overflow: hidden; flex-direction: column; }
.layer-pop-area[data-role-popup="staffSearch"] .searchMember-type1 { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-layout { display: flex; align-items: flex-start; gap: 20px; flex: 1 0 0; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar { display: flex; width: 360px; flex-direction: column; align-items: flex-start; align-self: stretch; gap: 16px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar .staff-search-orgchart { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; overflow: hidden; border-radius: 8px; border: 1px solid var(--clr-w300);  }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-sidebar { display: none; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar__head { display: flex; padding: 8px 16px; align-items: center; gap: 8px; align-self: stretch; flex-shrink: 0; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar__head span { display: flex; height: 27px; flex-direction: column; justify-content: center; flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold);}
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar #organizationChart { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100% !important; max-width: none !important; border-width: 0 !important; border-radius: 0 !important; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar #organizationChart .organization-search { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; height: auto; overflow: hidden; width: 100%; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar #organizationChart .inputsearch { flex-shrink: 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-sidebar #organizationChart .organization-search .organization { flex: 1 1 auto; min-height: 0; overflow-y: auto; height: auto !important; max-height: none; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel { display: flex; flex: 1 1 auto; min-width: 0; min-height: 0; width: 516px; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 { display: flex; padding: 1px 0; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; overflow: hidden; border-radius: 0 6px 6px 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
/* 비조직도: 조직원검색 탭에서는 부서/총 n명(chart-list) 숨김 — 팀원보기 탭에서만 표시 */
.layer-pop-area[data-role-popup="staffSearch"].search_team_member_not_orgchart .searchMember-type2:not(.staff-search-mode-team) .staff-search-chart-list--team-tab-only { display: none !important; }
.layer-pop-area[data-role-popup="staffSearch"].search_team_member_not_orgchart .searchMember-type2.staff-search-mode-team .staff-search-chart-list--team-tab-only { display: flex !important; align-items: center; gap: 12px; align-self: stretch; }
/* 팀원보기 탭: 고정 팀 목록이므로 검색 입력만 숨김(부서명·총 n명은 chart-list 유지) */
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2.staff-search-mode-team .searchBox,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2.staff-search-mode-team .select-box.search-type,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2.staff-search-mode-team .searchMember-filter > span.inputsearch { display: none !important; }
/* 탭(.search-team-user)과 맞닿는 좌측 구간만 상단선 없음 — 오른쪽은 상단 테두리 유지(.team-tab-btn: 버튼 120px×2 + gap 4px) */
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel > .search-team-user + .searchMember-type2 {
	--staff-search-tabstrip-width: calc(120px + 4px + 119px);
	border-top: none;
	background-color: var(--clr-w100);
	background-image: linear-gradient(to right, transparent 0, transparent var(--staff-search-tabstrip-width), var(--clr-w300) var(--staff-search-tabstrip-width), var(--clr-w300) 100%);
	background-size: 100% 1px;
	background-position: left top;
	background-repeat: no-repeat;
}
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter { display: flex; padding: 16px 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter .chart-list { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter .chart-list h3 { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); line-height: var(--txt-line-height); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter .chart-list .listTotal { display: flex; align-items: center; gap: 4px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter .chart-list .listTotal p { color: var(--txt-color-p600); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchMember-filter .chart-list .listTotal span { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .inputsearch { display: flex; justify-content: center; align-items: center; flex: 1 0 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .inputsearch .input_text_wrapper { display: flex; justify-content: center; align-items: center; flex: 1 0 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .inputsearch #userKeyword { display: flex; justify-content: center; align-items: center; flex: 1 0 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .checkbox { display: flex; align-items: center; gap: 8px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .checkbox input { display: none; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .checkbox .txt { font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); font-size: var(--txt-size-14); line-height: var(--txt-line-height); white-space: nowrap; position: relative; cursor: pointer; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .checkbox input + label::before { position: absolute; content: ''; width: 14px; height: 14px; border-radius: 3px; background-image: url(../../images/connectplace/common/check_off.png); background-position: center; background-size: cover; background-repeat: no-repeat; left: 0; top: 50%; transform: translateY(-50%); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .searchBox .checkbox input:checked + label::before { background-image: url(../../images/connectplace/common/check_on.png); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body { display: flex; flex-direction: column; align-items: stretch; flex: 1 1 auto; min-height: 0; align-self: stretch; width: 100%; overflow: hidden; box-sizing: border-box; }
/* thead는 스크롤 밖, tbody만 스크롤(스크롤바가 헤더에 겹치지 않음) */
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table-stack { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; align-self: stretch; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table-head { flex-shrink: 0; width: 100%; box-sizing: border-box; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table-head .staff-search-user-table { margin: 0; }
/* 직원 테이블: 조직도 ul.organization 과 같이 tbody 영역만 세로 스크롤 */
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table-scroll,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll { flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; box-sizing: border-box; }
/* 직원 목록: 테이블 (No / 이름 / 부서 / 위치) */
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table thead th { text-align: left; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); background: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .staff-search-col-no { width: 54px; height: 44px; align-items: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table thead .staff-search-col-no { text-align: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table thead .staff-search-col-name { width: 116px; height: 44px; padding: 0 12px; align-items: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table thead .staff-search-col-dept { width: 244px; height: 44px; padding: 0 12px; align-items: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table thead .staff-search-col-loc { width: 24px; height: 44px; padding: 0 18px 0 12px; align-items: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody td { height: 48px; vertical-align: middle; border-bottom: 1px solid var(--clr-w300); color: var(--txt-color-t900); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody td.staff-search-col-no { height: 48px; justify-content: center; align-items: center; align-self: stretch; text-align: center; color: var(--txt-color-t900); font-weight: var(--txt-weight-regular); font-size: var(--txt-size-14); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody td.staff-search-col-name { width: 116px; padding: 0 12px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody td.staff-search-col-dept { width: 244px; padding: 0 12px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody td.staff-search-col-loc { width: 24px; padding: 0 18px 0 12px; align-items: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .staff-search-col-loc { width: 54px; text-align: center; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody tr.staff-search-user-row:hover { background: #fafafa; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .data_blank { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; box-sizing: border-box; width: 100%; padding: 24px 16px; text-align: center; vertical-align: middle; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody tr.staff-search-empty-row td.data_blank { min-height: 368px; border-bottom: 0 !important; }
.layer-pop-area[data-role-popup="staffSearch"].search_team_member_not_orgchart .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table tbody tr.staff-search-empty-row td.data_blank { min-height: 373px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .data_blank .data_blank_img { flex-shrink: 0; background: url("../../../figma/svg/result_member_120.svg") center / 80px 80px no-repeat; width: 80px; height: 80px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .data_blank span { max-width: 100%; color: var(--txt-color-t900); font-weight: var(--txt-weight-semibold); font-size: var(--txt-size-16); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-namecell { display: flex; align-items: center; align-self: stretch; gap: 8px; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-avatar { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clr-n80); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); flex-shrink: 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-nametext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-username { font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-title { font-size: 12px; font-weight: 500; color: var(--txt-color-t500, #6b7280); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-user-table .workCondition { font-size: 12px; color: var(--txt-color-p600, #1382f4); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-loc-btn { display: inline-flex; align-items: center; justify-content: center; height: 36px; margin: 0 auto; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-loc-btn:hover:not(.staff-search-loc-btn--disabled) { background: #f3f4f6; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-loc-btn--disabled { cursor: default; pointer-events: none; opacity: 0.45; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-loc-icon { display: block; width: 16px; height: 16px; background: url("../../../figma/svg/location_black_16.svg") center / 16px no-repeat; }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel .searchMember-type2 .body .staff-search-loc-btn--disabled .staff-search-loc-icon { filter: grayscale(1); opacity: 0.6; }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user { flex-shrink: 0; }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user .team-tab-btn { display: flex; align-items: center; gap: 4px; }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user .team-tab-btn li { width: auto; }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user .team-tab-btn li button { display: flex; width: 120px; height: 36px; min-width: 100px; min-height: 36px; max-height: 36px; padding: 13px 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 6px 6px 0 0; background: var(--clr-w200); color: var(--txt-color-t500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user .team-tab-btn li button.on { background: var(--clr-w100); color: var(--txt-color-p600); border-radius: 6px 6px 0 0; border-top: 1px solid var(--clr-w300); border-left: 1px solid var(--clr-w300); border-right: 1px solid var(--clr-w300); }
.layer-pop-area[data-role-popup="staffSearch"] .search-team-user .team-tab-btn li:hover button:not(.on) { opacity: 1; background: var(--clr-n30); }
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-orgchart-panel > .search-team-user {display: flex; align-items: center; gap: 4px; }
#firstDiv .attendees-add-search-input, #secondDiv .attendees-add-search-input { min-height: 62px; display: flex; align-items: center; border: 0; border-radius: 0; background-color: #f0f6ff; padding: 15px 30px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.05); }
#firstDiv .attendees-add-search-input>p, #secondDiv .attendees-add-search-input>p { font-size: 18px; color: #1382f4; font-weight: bold; white-space: nowrap; letter-spacing: -0.88px; margin-right: 20px; }
#firstDiv .attendees-add-search-input .inputsearch { margin-top: 0; }
#firstDiv .attendees-add-search-input .inputsearch input:focus { outline: 0; }

#firstDiv .attendees-add-search-input .inputsearch input { border: 0; padding: 0 40px 0 10px; box-sizing: border-box; font-size: 16px; font-weight: 500; letter-spacing: -0.2px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.05); }
/* --- CSS4 설정(:not) 별도 분리 ---
#firstDiv .attendees-add-search-input .inputsearch button:not(.inputsearch.type2 button) { position: absolute; right:0px; top: 50%; transform: translateY(-50%); display: block; width: 40px; height: 40px; background: url(../../images/connectplace/common/search_icon_b.png) no-repeat center/20px; text-indent: -9999px; }*/
#firstDiv .attendees-add-search-input .inputsearch input:focus { outline: 0; }
#firstDiv .attendees-add-search-input .inputsearch { width: 100%; }
#firstDiv .attendees-add-search-input .inputsearch.type2 { display: flex; align-items: center; }
#firstDiv .attendees-add-search-input .inputsearch.type2 input { width: 100%; padding: 0 15px; box-sizing: border-box; border: 0; }
#firstDiv .attendees-add-search-input .inputsearch.type2 button { width: 80px; height: 40px; border: 0; background-color: #59a7f7; color: #fff; font-weight: 600; font-size: 16px; }
#firstDiv .attendees-add-search-input .inputsearch.type2 button:hover { opacity: 1; background-color: #3695fa; transition: all 0.3s; }

.searchMember-type1 .attendees-add-search-input .select-box.search-type { border: 0; min-width: 100px; margin-right: 10px; height: 40px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); }
.searchMember-type1 .attendees-add-search-input .select-box.search-type .select-list { top: 42px; }
.searchMember-type2 .attendees-add-search-input .inputsearch:not(.inputsearch.type2) { display: none; }
.searchMember-type2 .attendees-add-search-input .select-box.select-company { border: 0; width: 100%; height: 40px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); }
.searchMember-type2 .attendees-add-search-input .select-box.select-company .select-list { top: 42px; }

/* 좌석예약 : 직원 검색 팝업 > 조직원검색(기본형)*/
.searchMember-type1 .staff-list{overflow: hidden;}
.addMember-type1 .staff-list .listTotal,
.searchMember-type1 .staff-list .listTotal { position:-webkit-sticky; position:sticky; z-index: 1; top: 0; width: 100%; background-color: #f1f2f6; padding: 0 30px; box-sizing: border-box;}
.addMember-type1 .staff-list .listTotal p,
.searchMember-type1 .staff-list .listTotal p { padding-left: 20px; line-height: 30px; color: #4c5266; font-size: 14px; font-weight: 500; background: url(../../images/connectplace/common/ico_Member_g.png) no-repeat left 50%/ 14px; }
.searchMember-type1 #tbodySearchUser{overflow-y: auto; max-height: 390px; padding: 10px 0; box-sizing: border-box;}

/* 좌석예약 : 직원 검색 팝업 > 팀원보기(#tbodySearchTeam) */
#secondDiv { border-top: 0 !important; padding: 0 !important; margin: 0 !important; }
#secondDiv .attendees-add-search-input { position: relative; }
#secondDiv .attendees-add-search-input .listTotal p { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); padding-left: 20px; line-height: 30px; color: #4c5266; font-size: 14px; font-weight: 500; background: url(../../images/connectplace/common/ico_Member_g.png) no-repeat left 50%/ 14px; }
#secondDiv .staff-list { min-height: 430px; max-height: 430px; padding: 20px 0; box-sizing: border-box; }
#secondDiv #tbodyGroupUserHistory .staff-list { padding: 0; min-height: unset; max-height: unset; }

/* 좌석예약 : 조직도 */
#firstDiv #organizationChart .organization-search .organization .company { cursor: pointer; color: #1382f4; }

/* 좌석 예약: 조직원 검색 팝업 */
.layer-pop-area.searchUser { height: 720px; }
.layer-pop-area.searchUser.byOrg { max-width: 960px; height: 750px; }
.searchUser .search-user-box { display: flex; align-items: flex-start; align-self: stretch; flex: 1 0 0; gap: 20px; min-height: 0; }
.searchUser .org-chart-wrap { flex-shrink: 0; width: 360px; }
.searchUser .org-chart-wrap .org-chart-box { min-height: 0;}
.searchUser .tab-container .tab-nav button { width: 120px; height: 36px; }
.searchUser .user-list-wrap { border-radius: 0 6px 6px 6px; }
.searchUser .user-list-filter { gap: 12px !important; }
.searchUser .user-list-filter .title { flex: 1 0 0; line-height: 27px; font-family: var(--txt-font-family); font-size: var(--txt-size-18); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.36px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.searchUser .user-list-filter .total-txt { flex: initial; }
.searchUser .user-list-box, .searchUser .user-list-box .empty-box { height: 377px; }
.searchUser.byOrg .user-list-box, .searchUser.byOrg .user-list-box .empty-box { height: 368px; }
.searchUser .user-list tbody td:last-child { overflow: visible; }
.searchUser .user-list tbody tr:nth-child(n+8):last-child td { border-bottom: 0; }
.searchUser .user-list tbody td .location-box { display: flex; gap: 8px; }
.searchUser .user-list tbody td .icon-location { display: flex; width: 16px; height: 16px; mask: url("/figma/svg/location_black_16.svg") no-repeat center / contain; -webkit-mask: url("/figma/svg/location_black_16.svg") no-repeat center / contain; background-color: var(--clr-w800); flex-shrink: 0; cursor: pointer; }
.searchUser .user-list tbody td .icon-location.disabled { background-color: var(--clr-w400); pointer-events: none; }
.searchUser .user-list tbody td .location-box .tooltip { z-index: initial; }
.searchUser .user-list tbody td .location-box .tooltip .tooltip-text { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-top: 11px; white-space: nowrap; background-color: var(--clr-w800); border-radius: 6px; z-index: 10; opacity: 0; visibility: hidden; transition: all 0.2s ease; }
.searchUser .user-list tbody td .location-box .tooltip .tooltip-text::after { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("/figma/svg/tooltip_arrow_up.svg") no-repeat center / contain; }
.searchUser .user-list tbody td .location-box .tooltip .icon-location:hover + .tooltip-text { visibility: visible; opacity: 1; }

/* 좌석 예약 팝업 */
.pop-desk-rsv, .pop-desk-use { display: none; position: absolute; max-width: 540px; top: 50%; left: 50%; background-color: rgba(255, 255, 255, 0.9) !important; box-shadow: 2px 8px 10px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow:2px 8px 10px 2px rgba(0, 0, 0, 0.2); z-index: 99; border-radius: 12px; }
.pop-desk-rsv.active, .pop-desk-use.active { display: block; }
.pop-desk-close { position: absolute; top: 0; right: 0; width: 40px; height: 40px;padding: 5px; box-sizing: border-box; font-size: 0; background-image: url(../../images/connectplace/common/ico_close.png); background-position: center; background-repeat: no-repeat; background-size: 16px; }
.pop-desk-close:hover{transform: rotate(180deg); transition: all 0.4s; opacity: 1;}
.pop-desk-info { padding: 25px; display: flex; }
.pop-desk-box { display: flex; align-items: center; padding-right: 15px; }
.pop-desk-img { position: relative; display: flex; flex-flow: column; justify-content: center; width: 140px; height: 100px; background-color: #d0e6fd; overflow: hidden; box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2);}
.pop-desk-rsv .pop-desk-img img { width: auto; height: 100%; margin: 0 auto; }
.pop-desk-img span { font-size: 14px; font-weight: 400; line-height: 23px; position: absolute; width: 100%; background-color: rgba(90, 102, 129, 0.77); color: #fff; text-align: center; bottom: 0; left: 0; }
.pop-desk-txt { margin-left: 20px; text-align: left;}
.pop-desk-txt span { display: inline-block; padding: 5px 10px; margin-bottom: 5px; background-color: #5a6681; font-size: 14px; font-weight: 600; color: #fff; }
.pop-desk-txt span.conditionType1{background-color: #EDFBEB; color: #17b911;}
.pop-desk-txt span.conditionType2{background-color: #eeeff2; color: #5a6681;}
.pop-desk-txt h5 { font-size: 24px; font-weight: 700; color: #333333; }
.pop-desk-txt p { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; color: #333333; }
.pop-desk-txt p em {font-size: 16px; font-weight: 500; color: #1382f4; }
.pop-desk-device { display: flex; padding-left: 15px; margin-left: auto; align-items: center; gap: 10px; border-left: 1px dashed #b6b7bc; }
.pop-desk-device li:not(.pop-desk-num:only-child) { text-align: center; }
.pop-desk-device li .ico_wrap { width: 40px; height: 40px; margin: 0 auto 5px; background-color: #d0e6fd; border-radius: 50%;background-repeat: no-repeat; background-position: center; background-size: 16px;}
.pop-desk-device li .ico_monitor {background-image: url(../../images/connectplace/common/ico_monitor.png);}
.pop-desk-device li .ico_IPphone {background-image: url(../../images/connectplace/common/ico_phone.png);}
.pop-desk-device li p { font-size: 14px; font-weight: 600; color: #1382f4; letter-spacing: -1.2px; white-space: nowrap; }
.pop-desk-date { display: flex; flex-flow: row nowrap; align-items: center; justify-content: start; gap: 10px; margin: 0 auto; width: 100%; }
.pop-desk-date-box { display: flex; align-items: center; }
.pop-desk-date-box:first-child { margin-bottom: 5px; }
.pop-desk-input { height: 38px; background-color: #fff !important; border: none; background-repeat: no-repeat; background-position: top 50% right 12px; background-size: 20px; padding: 0 15px; font-size: 16px; font-weight: 400; color: #5f6b8b !important; box-sizing: border-box; cursor: pointer; }
.pop-desk-input.datepicker { width: 170px; background: url(../../images/connectplace/common/ico_calendar.png) no-repeat top 50% right 12px/18px; }
.pop-desk-input .time-select-wrap{width: auto;}
.pop-desk-input .time-select-wrap .time_input { width: 100px; background: url(../../images/connectplace/common/ico_time.png) no-repeat top 50% right 12px; }
.pop-desk-input:disabled { opacity: .6; cursor: default; }
.pop-desk-date-box .calendar-wrap{margin-right: 10px;}
.pop-desk-date-box span { font-size: var(--txt-size-14); color: var(--txt-color-t900);}
.pop-desk-date-box p { display: flex; flex-flow: row nowrap; align-items: center; gap: 5px; line-height: 20px; color: #606c8c; font-size: 16px; }
.pop-desk-date-box p span { display: flex; align-items: center; gap: 5px; margin: 0; white-space: nowrap;}
.pop-desk-date-box p .date::before { display: inline-block; width: 13px; height: 15px; content: ""; background: url(../../images/connectplace/common/ico_calendar.png) no-repeat; background-size: contain; }
.pop-desk-date-box p .time::before { display: inline-block; width: 15px; height: 15px; content: ""; background: url(../../images/connectplace/common/ico_time.png) no-repeat; background-size: contain; }
.pop-desk-date-box .pop-desk-text { display: flex; flex-direction: column; flex: 1 0 0; height: 44px; padding: 12px; justify-content: center; align-items: center; gap: 8px; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
.pop-desk-date-box .ui-datepicker-trigger{text-indent: -9999px;}
.pop-desk-input+.ui-datepicker-trigger{text-indent: -9999px;}
.pop-desk-bottom .pop-btn { margin-left: 20px; }
.pop-desk-bottom .pop-btn button { width: 144px; height: 80px; border-radius: 4px; background-image: linear-gradient(to top, #1382f4, #82bffe); color: #fff; font-size: 18px; font-weight: bold; letter-spacing: -1.08px; }
.pop-desk-bottom .pop-btn button:hover { background-image: linear-gradient(to top, #1683f5, #1683f5) !important; transition: all 0.4s ease; }
.pop-desk-bottom .summary { text-align: center; }
.pop-desk-bottom .summary span { font-size: 16px; color: #5f6b8b; }

/* 좌석 예약 / 정보 팝업: 레이어 래퍼 기준 absolute 보정 → 뷰포트 기준 fixed */
.layer-pop-wrap #deskResvPop.pop-desk-rsv,
.layer-pop-wrap #deskResvInfoPop.pop-desk-use {
	position: fixed;
	margin: 0;
	right: auto;
	bottom: auto;
}

/* 좌석 예약 팝업 — 카드형(헤더·일러스트·입력·하단 버튼) */
.pop-desk-rsv { background: transparent !important; 
	box-shadow: none !important;
}
.pop-desk-rsv__surface {
    display: inline-flex;
    min-width: 400px;
    max-width: 640px;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border-radius: 12px;
    background: var(--clr-w100);
    box-shadow: var(--ds-e500);
}
.pop-desk-rsv__head { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.pop-desk-rsv__head-main { display: flex; align-items: center; gap: 8px; flex: 1 0 0; }
.pop-desk-rsv__badge { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; border: 1px solid var(--txt-color-p600); background: var(--clr-w100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); }
.pop-desk-rsv__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: #141414; font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); }
.pop-desk-rsv__device-list { display: flex; align-items: center; gap: 8px; }
.pop-desk-rsv__device { margin: 0; }
.pop-desk-rsv__device-icon { display: flex; width: 20px; height: 20px; justify-content: center; align-items: center; }
.pop-desk-rsv__device-icon.ico_wrap { border-radius: 4px; background-color: var(--clr-n60); background-size: 20px; }
.pop-desk-rsv__device-icon.ico_wrap.ico_monitor { background-image: url("../../../figma/svg/option_monitor_20.svg") }
.pop-desk-rsv__device-icon.ico_wrap.ico_IPphone { background-image: url("../../../figma/svg/option_ipphone_20.svg") }
.pop-desk-rsv__device-icon.ico_wrap.ico_IPphone { background-image: url("../../../figma/svg/option_ipphone_20.svg") }
.pop-desk-rsv__device-icon.ico_wrap.ico_dual_monitor { background-image: url("../../../figma/svg/option_dual_20.svg") }
.pop-desk-rsv__main { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
.pop-desk-rsv__illus-frame { display: flex; width: 96px; height: 96px; align-items: center; justify-content: center; gap: 10px; aspect-ratio: 1/1; background: #D0E6FD; border-radius: 6px; }
.pop-desk-rsv__illus-photo {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.pop-desk-rsv__illus-photo img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}
.pop-desk-rsv__fields { flex: 1; min-width: 0; }
.pop-desk-rsv__fields .pop-desk-bottom.pop-desk-bottom--rsv-card { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; align-self: stretch; }
.pop-desk-rsv__fields .pop-desk-bottom.pop-desk-bottom--rsv-card .unsetDatepicker { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; align-self: stretch; }
.pop-desk-rsv__fields .pop-desk-bottom.pop-desk-bottom--rsv-card #dateReservation { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.pop-desk-rsv__fields .pop-desk-date-box { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.pop-desk-rsv__fields .pop-desk-date-box:first-child { margin-bottom: 0; }
.pop-desk-rsv__fields .pop-desk-date-label { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 10; overflow: hidden; text-overflow: ellipsis; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.pop-desk-rsv__fields .calendar-wrap { flex: 1 0 0; margin-right: 0; box-sizing: border-box; }
.pop-desk-rsv__fields .pop-desk-date-wrap { display: flex; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.pop-desk-rsv__fields .pop-desk-date-wrap .calendar-wrap { display: flex; height: 44px; align-items: center; gap: 8px; align-self: stretch; }
.pop-desk-rsv__fields .pop-desk-date-wrap .time-select-wrap { display: flex; height: 44px; align-items: center; gap: 8px; align-self: stretch; }
/*.pop-desk-rsv__fields .calendar-wrap .cp-date-picker { width: 100% !important; max-width: 100%; min-width: 0 !important; }*/
.pop-desk-rsv__fields .calendar-wrap .cp-date-input-wrap,
.pop-desk-rsv__fields .calendar-wrap .cp-date-input { width: 100%; max-width: 100%; box-sizing: border-box; }
/* 시간 단위(10402): selectTime이 각각 time-select-wrap을 출력하므로 행 래퍼는 별도 클래스 */
.pop-desk-rsv__fields .pop-desk-time-row { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; width: 100%; box-sizing: border-box; gap: 3px; }
.pop-desk-rsv__fields .pop-desk-time-row > .time-select-wrap { flex: 1; min-width: 0; }
.pop-desk-rsv__fields .time-select-wrap { display: flex; height: 44px; align-items: center; gap: 16px; align-self: stretch; }
.pop-desk-rsv__fields .time-select-wrap .ui-selectmenu-button.ui-button { flex: 1; min-width: 0; width: auto !important; max-width: none; margin: 0; }
.pop-desk-rsv__footer { display: flex; justify-content: space-between; align-items: center; align-self: stretch; }
.pop-desk-rsv__footer > div{ display: flex; justify-content: flex-end; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; }
.pop-desk-rsv__btn { min-width: 80px; padding: 14px 12px; cursor: pointer; }
.pop-desk-rsv__btn--ghost {
	background: #fff;
	border: 1px solid #222;
	color: #222;
}
.pop-desk-rsv__btn--ghost:hover { background: #f7f7f7; }
.pop-desk-rsv__btn--primary {
	border: none;
	background: #1382f4;
	color: #fff;
}
.pop-desk-rsv__btn--primary:hover { background: #1178e0; }

/* 좌석 예약 팝업 - 예약 단위 변환(시간<->날짜) */
#dateReservation:not(.unsetDatepicker) .pop-desk-date-box:nth-child(2) .time-select-wrap span.time-sep {display: none;}
#dateReservation.unsetDatepicker .pop-desk-date-box:first-child .time-select-wrap {display: none;}
#dateReservation.unsetDatepicker .pop-desk-date-box:nth-child(2) .calendar-wrap {display: none;}
/* 당일 모드: 종료 행에 시작·종료 시간이 한 줄로 들어가도록 */
#dateReservation.unsetDatepicker .pop-desk-date-box:nth-child(2) .pop-desk-date-wrap { flex-wrap: wrap; align-items: center; }
#dateReservation.unsetDatepicker .pop-desk-date-box:nth-child(2) .time-select-wrap { flex: 1 1 100%; min-width: 0; width: 100%; max-width: 100%; }

/* 반복 예약 저장 후: 시작일 피커·시작 시간 영역 풀너비, calendar-wrap / 래퍼 gap 제거 */
#deskResvPop #dateReservation.dateReservation--recurring-wide .desk-resv-start-datewrap { gap: 0; }
#deskResvPop #dateReservation.dateReservation--recurring-wide .desk-resv-start-calendar-wrap .cp-date-picker,
#deskResvPop #dateReservation.dateReservation--recurring-wide .desk-resv-start-calendar-wrap .cp-date-input-wrap,
#deskResvPop #dateReservation.dateReservation--recurring-wide .desk-resv-start-calendar-wrap .cp-date-input { width: 100% !important; }
#dateReservation.unsetDatepicker .pop-desk-date-box:nth-child(2) .time-select-wrap.desk-resv-end-time-wrap > div:first-child { width: 100% !important; }

/* 좌석 예약 정보 팝업 — 단일 카드형 (#deskResvInfoPop) */
#deskResvInfoPop.pop-desk-use { background: transparent !important; box-shadow: none !important; border-radius: 0; }
#deskResvInfoPop .pop-desk-info-pop__surface { display: flex; width: 400px; padding: 24px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e500); }
#deskResvInfoPop .pop-desk-info-pop__head { display: flex; align-items: center; gap: 8px; align-self: stretch; }
#deskResvInfoPop .pop-desk-info-pop__head-main { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; flex: 1; min-width: 0; }
#deskResvInfoPop .pop-desk-info-pop__badge { display: inline-flex; align-items: center; padding: 0 8px; height: 20px; border-radius: 4px; border: 1px solid var(--txt-color-p600); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); background: var(--clr-w100); }
#deskResvInfoPop .pop-desk-info-pop__title { font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
#deskResvInfoPop .pop-desk-info-pop__pill {
	padding: 2px 8px;
	border-radius: 4px;
	border: 1px solid var(--clr-w300);
	font-size: var(--txt-size-12);
	color: var(--txt-color-t500);
}
#deskResvInfoPop .pop-desk-info-pop__device-list {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	flex-shrink: 0;
}
#deskResvInfoPop .pop-desk-info-pop__device { margin: 0; }
#deskResvInfoPop .pop-desk-info-pop__device-icon {
	display: flex;
	width: 20px;
	height: 20px;
	border-radius: 4px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px;
}
#deskResvInfoPop .pop-desk-info-pop__device-icon.ico_monitor { background-image: url("../../../figma/svg/option_monitor_20.svg"); }
#deskResvInfoPop .pop-desk-info-pop__device-icon.ico_IPphone { background-image: url("../../../figma/svg/option_ipphone_20.svg"); }
#deskResvInfoPop .pop-desk-info-pop-wrap { display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 16px; }
#deskResvInfoPop .pop-desk-info-pop__user { display: flex; width: 352px; height: 72px; align-items: center; gap: 16px; }
#deskResvInfoPop .pop-desk-info-pop__avatar { position: relative; width: 72px; height: 72px; flex-shrink: 0; border-radius: 50%; background: var(--clr-n80); overflow: hidden; display: flex; align-items: center; justify-content: center; }
#deskResvInfoPop .pop-desk-info-pop__avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: none; }
#deskResvInfoPop .pop-desk-info-pop__avatar-letter { position: relative; z-index: 1; font-size: var(--txt-size-36); font-weight: var(--txt-weight-semibold); color: var(--clr-w100); }
#deskResvInfoPop .pop-desk-info-pop__user-txt { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; flex: 1 0 0; }
#deskResvInfoPop .pop-desk-info-pop__user-name-line { display: flex; align-items: flex-end; gap: 4px; align-self: stretch; }
#deskResvInfoPop .pop-desk-info-pop__user-name-line #deskResvInfoPopUserNm { font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#deskResvInfoPop .pop-desk-info-pop__user-name-line #deskResvInfoPopUserTitle { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#deskResvInfoPop .pop-desk-info-pop__user-dept { display: flex; align-items: flex-start; gap: 8px; align-self: stretch; }
#deskResvInfoPop .pop-desk-info-pop__user-dept #deskResvInfoPopUserDept { flex: 1 0 0; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
#deskResvInfoPop .pop-desk-info-pop__status { flex-shrink: 0; padding: 4px 10px; border-radius: 6px; border: 1px solid var(--clr-w300); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); max-width: 120px; text-align: center; }
#deskResvInfoPop .pop-desk-info-pop__status--in {
	border-color: #17b911;
	color: #17b911;
	background: #edfbeb;
}
#deskResvInfoPop .pop-desk-info-pop__status--out { border-color: var(--clr-w300); color: var(--txt-color-t500); background: var(--clr-w100); }
#deskResvInfoPop .pop-desk-info-pop__time-wrap { align-self: stretch; }
#deskResvInfoPop .pop-desk-info-pop__time-bar { display: flex; width: 352px; height: 44px; padding: 12px; justify-content: center; align-items: center; gap: 8px; border-radius: 6px; background: var(--clr-n30); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#deskResvInfoPop .pop-desk-info-pop__time-ico { width: 16px; height: 16px; flex-shrink: 0; background: url(../../../figma/svg/calendar_16.svg) no-repeat center / 16px; }
#deskResvInfoPop .pop-desk-info-pop__summary-wrap { align-self: stretch; width: 100%; }
#deskResvInfoPop .pop-desk-info-pop__summary { margin: 0; padding: 12px 14px; border-radius: 8px; background: var(--clr-n30); font-size: var(--txt-size-14); color: var(--txt-color-t900); line-height: 1.5; text-align: center; }
#deskResvInfoPop .pop-desk-info-pop__footer { display: flex; justify-content: flex-end; align-self: stretch; padding-top: 4px; }
#deskResvInfoPop .pop-desk-info-pop__btn { min-width: 80px; }

#dashboardSpaceInfoPop .pop-desk-info-pop { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#dashboardSpaceInfoPop .pop-desk-info-pop__surface { display: flex; width: 400px; padding: 24px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e500); }
#dashboardSpaceInfoPop .pop-desk-info-pop__head { display: flex; align-items: center; gap: 8px; align-self: stretch; }
#dashboardSpaceInfoPop .pop-desk-info-pop__head-main { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; flex: 1; min-width: 0; }
#dashboardSpaceInfoPop .pop-desk-info-pop__badge { display: inline-flex; align-items: center; padding: 0 8px; height: 20px; border-radius: 4px; border: 1px solid var(--txt-color-p600); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); background: var(--clr-w100); }
#dashboardSpaceInfoPop .pop-desk-info-pop__title { font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
#dashboardSpaceInfoPop .pop-desk-info-pop-wrap { display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 16px; }
#dashboardSpaceInfoPop .pop-desk-info-pop__user { display: flex; width: 352px; height: 72px; align-items: center; gap: 16px; }
#dashboardSpaceInfoPop .pop-desk-info-pop__avatar { position: relative; width: 72px; height: 72px; flex-shrink: 0; border-radius: 50%; background: var(--clr-n80); overflow: hidden; display: flex; align-items: center; justify-content: center; }
#dashboardSpaceInfoPop .pop-desk-info-pop__avatar-letter { position: relative; z-index: 1; font-size: var(--txt-size-36); font-weight: var(--txt-weight-semibold); color: var(--clr-w100); }
#dashboardSpaceInfoPop .pop-desk-info-pop__user-txt { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; flex: 1 0 0; }
#dashboardSpaceInfoPop .pop-desk-info-pop__user-name-line { display: flex; align-items: flex-end; gap: 4px; align-self: stretch; }
#dashboardSpaceInfoPop .pop-desk-info-pop__user-name-line #dashboardSpaceInfoPopUserNm { font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#dashboardSpaceInfoPop .pop-desk-info-pop__user-dept { display: flex; align-items: flex-start; gap: 8px; align-self: stretch; }
#dashboardSpaceInfoPop .pop-desk-info-pop__user-dept #dashboardSpaceInfoPopUserDept { flex: 1 0 0; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
#dashboardSpaceInfoPop .pop-desk-info-pop__detail-wrap { align-self: stretch; width: 100%; padding: 16px; border-radius: 8px; background: var(--clr-n30); box-sizing: border-box; }
#dashboardSpaceInfoPop .pop-desk-info-pop__detail-list { display: flex; flex-direction: column; gap: 16px; margin: 0; }
#dashboardSpaceInfoPop .pop-desk-info-pop__detail-row { display: flex; align-items: center; gap: 12px; align-self: stretch; }
#dashboardSpaceInfoPop .pop-desk-info-pop__detail-row dt { width: 80px; margin: 0; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
#dashboardSpaceInfoPop .pop-desk-info-pop__detail-row dd { flex: 1 0 0; margin: 0; overflow: hidden; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); text-overflow: ellipsis; white-space: nowrap; }
#dashboardSpaceInfoPop .pop-desk-info-pop__time-wrap { align-self: stretch; }
#dashboardSpaceInfoPop .pop-desk-info-pop__time-bar { display: flex; width: 352px; height: 44px; padding: 12px; justify-content: center; align-items: center; gap: 8px; border-radius: 6px; background: var(--clr-n30); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); line-height: var(--txt-line-height); }
#dashboardSpaceInfoPop .pop-desk-info-pop__time-ico { width: 16px; height: 16px; flex-shrink: 0; background: url(../../../figma/svg/calendar_16.svg) no-repeat center / 16px; }
#dashboardSpaceInfoPop .pop-desk-info-pop__summary-wrap { align-self: stretch; width: 100%; }
#dashboardSpaceInfoPop .pop-desk-info-pop__summary { margin: 0; padding: 12px 14px; border-radius: 8px; background: var(--clr-n30); font-size: var(--txt-size-14); color: var(--txt-color-t900); line-height: 1.5; text-align: center; }
#dashboardSpaceInfoPop .pop-desk-info-pop__footer { display: flex; justify-content: flex-end; align-self: stretch; padding-top: 4px; }
#dashboardSpaceInfoPop .pop-desk-info-pop__btn { min-width: 80px; }

/* 좌석 예약 정보 팝업 (레거시 마크업용 — 타 화면 호환) */
.pop-desk-use .pop-desk-img { width: 100px; background-color: #B9BFD0; box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.2); }
.pop-desk-use .pop-desk-img img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-object-fit: cover; }
.pop-desk-use .pop-desk-txt h5 span { display: inline-block; background-color: transparent; padding: 0 5px; font-size: 14px; font-weight: 500; color: #5a6681; }
.pop-desk-use .pop-desk-device { flex-flow: row wrap; justify-content: center; max-width: 160px; gap: 0; }
.pop-desk-num { min-width:60px; width: 90%; line-height: 1; font-size: 16px; font-weight: 600; color: #606c8c; }
/* --- CSS4 설정(:has) 별도 분리 ---
.pop-desk-num:has(+ li) { padding-bottom: 10px; border-bottom: 1px dashed #b6b7bccc; }*/
.pop-desk-num span { display: block; line-height: 1; margin-top: 10px; font-size: 18px; font-weight: 600; color: #1382f4; }
.pop-desk-num ~ li { padding-top: 10px; padding-bottom: 0; border-bottom: 0; }
.pop-desk-num ~ li .ico_wrap { width: 40px; height: 40px; margin: 0 auto 5px; background-color: #d0e6fd; border-radius: 50%;background-repeat: no-repeat; background-position: center; background-size: 16px;}
.pop-desk-num ~ li > .ico_monitor {background-image: url(../../images/connectplace/common/ico_monitor.png);}
.pop-desk-num ~ li > .ico_IPphone {background-image: url(../../images/connectplace/common/ico_phone.png);}
.pop-desk-num ~ li > p { font-size: 14px; }
.pop-desk-num ~ li:nth-child(3) { padding-left: 10px; }
.pop-desk-use .pop-desk-bottom { padding: 15px 25px; background-color: #f0f0f0; }
.pop-desk-use .pop-desk-date-box { width: 50%; justify-content: start; gap: 10px; margin-bottom: 0; }
.pop-desk-use .pop-desk-date-label { color: #1382f4; margin-right: 0; }

/* 좌석 반복 예약 */
.pop-desk-recurring { display: flex; height: 44px; padding: 12px; justify-content: center; align-items: center; align-self: stretch; gap: 8px; border-radius: 6px; background: var(--clr-n30); }
/* 예약 팝업 반복 요약: 저장 전까지 숨김, 설정 후에만 표시 */
#deskResvPop #recurringDeskResvBtn.pop-desk-recurring.summary { display: none; }
#deskResvPop #recurringDeskResvBtn.pop-desk-recurring.summary.is-visible { display: flex; }
.pop-desk-recurring .close-btn{display: none; position: absolute; text-indent: -9999px; width: 15px; height: 15px; right: 5px; top: 5px; background: url(../../images/connectplace/common/close_b.png) no-repeat right top / 10px; opacity: 0.5; cursor: pointer;}
.pop-desk-recurring .recurring-delete-btn { display: none; text-indent: -9999px; width: 15px; height: 15px; right: 5px; top: 5px; background: url(../../images/connectplace/common/close_b.png) no-repeat right center/10px; opacity: 0.5; cursor: pointer;}
.pop-desk-recurring label{width: 100%; font-weight: 600; color: #1382f4; font-size: 15px;}
.pop-desk-recurring button.recurring{display: flex; align-items: center; gap: 10px; justify-content: center; padding:0 20px; box-sizing: border-box;  height: 34px; min-width: 140px; color: #fff; font-size: 15px; font-weight: 600; letter-spacing: -0.88px;}
.pop-desk-recurring button.recurring .icon{text-indent: -9999px; display: inline-block; width: 10px; height: 12px; background: url(../../images/connectplace/common/ico_repeat-wh.png) no-repeat center/10px;}
.pop-desk-recurring .summary{display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 2px 10px; box-sizing: border-box; background-color: #ececec;}
.pop-desk-recurring .summary>div{display: flex; flex-flow: row wrap; align-items: center; justify-content: center; width: 100%; max-width: 345px; min-height: 34px; text-align: center; font-size: 13px; font-weight: 400; letter-spacing: -1px; color: #5a6681; word-break: keep-all; line-height: 1;}
.pop-desk-recurring .summary>div span{display: inline-block; color: #59a7f7; letter-spacing: -0.88px;line-height: 1;}
#deskResvPop #recurringSummary {
	justify-content: flex-start;
	text-align: left;
	gap: 8px;
}
#deskResvPop #recurringSummary::before {
	content: "";
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	background: url(../../../figma/svg/repeat_lightgray_16.svg) no-repeat center / 16px 16px;
}

/* 잔여 좌석 없는 경우 팝업 */
#type2.no-deskbook { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -60%); max-width: 400px; text-align: center; padding: 30px 50px; background-color: #fff; box-shadow: 1px 3px 10px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 3px 10px rgba(0, 0, 0, 0.2);}
#type2.no-deskbook .imgBox { width: 100px; height: 100px; margin: 0 auto 10px; background: url(../../images/connectplace/common/nodata_img2.png) no-repeat center/contain; text-indent: -9999px; }
#type2.no-deskbook h3 { font-size: 20px; line-height: 2; font-weight: 600; color: #1382f4; }
#type2.no-deskbook p { font-size: 18px; line-height: 1.5; font-weight: 500; color: #4c5266; }

/* 좌석 예약 상세: 좌석 예약 수정 팝업(기간 예약) */
.layer-pop-area[data-role-popup = "deskTermAdd"] { width: auto; max-width: 415px; }
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-cont { padding: 20px 30px;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-cont .inputform { padding: 0;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-date-box .ui-selectmenu-button.ui-button,
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-date-box .ui-selectmenu-text{height: 44px; line-height: 44px; width: 100%; min-width: 100px;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-date-box .ui-selectmenu-button.ui-button{border: 1px solid rgba(0, 0, 0, 0.1);}

.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-recurring{width: 100%; flex-flow: row wrap;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-recurring label{background-color: #fff; padding-top: 10px; padding-bottom: 5px;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-recurring button.recurring{padding: 0 10px; min-width: 70px; font-size: 14px;}
.layer-pop-area[data-role-popup = "deskTermAdd"] .pop-desk-recurring .summary{background-color: #f5f5f5; width: calc(100% - 70px);}

/* 좌석 예약 상세: 좌석 예약 수정 팝업(기간 + 1일예약, 1일 예약(당일)) */
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box{justify-content: space-between; gap: 5px; width: 100%;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box .ui-selectmenu-button.ui-button,
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box .ui-selectmenu-text {height: 44px; line-height: 44px; width: 100%; min-width: 100px;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-date-box .ui-selectmenu-button.ui-button{border: 1px solid rgba(0, 0, 0, 0.1);}

.layer-pop-area[data-role-popup = "deskAdd"] { width: auto; max-width: 510px;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-cont { padding: 20px 30px;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-cont .inputform { padding: 0;}
.layer-pop-area[data-role-popup = "deskAdd"] .inputform__row__colm input[type="text"].datepicker{min-width: 160px; max-width: 160px;}
.layer-pop-area[data-role-popup = "deskAdd"] .inputform__row.time .inputform__row__colm input[type="text"].datepicker{max-width: unset;}

.layer-pop-area[data-role-popup = "deskAdd"] .inputform__row__colm.recurring{margin-top: 10px; max-width: 450px;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-recurring{width: 100%; flex-flow: row wrap;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-recurring button.recurring{padding: 0 10px; min-width: 70px; font-size: 14px;}
.layer-pop-area[data-role-popup = "deskAdd"] .pop-desk-recurring .summary{background-color: #f5f5f5; width: calc(100% - 70px);}

/* ///////////////////////////////////////////////// */
/* ------------------- 서브메뉴 ------------------- */
/* ///////////////////////////////////////////////// */
.maincontant__section__list--submenu { width: 100%; height: 115px; background-color: #fff; margin-top: 40px; padding: 10px 50px; box-sizing: border-box; box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);}
.maincontant__section__list--submenu .submenu_inner { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; height: 100%; }
.maincontant__section__list--submenu .submenu_inner>li { display: flex; flex-flow: column nowrap; cursor: pointer; align-items: center; justify-content: center; }
.maincontant__section__list--submenu .submenu_inner>li img { display: block; width: 50px; margin: 0 auto; }
.maincontant__section__list--submenu .submenu_inner>li span { display: block; text-align: center; font-weight: 500; font-size: 17px; color: #4c5266; margin-top: 5px; letter-spacing: -0.25px; }

/* 스마트화장실 */
.restroom-pop-wrap { display: none; position: absolute; z-index: 99999; top: 50%; left: 50%; }
.restroom-pop-wrap .restroom-pop-area { display: flex; flex-flow: column wrap; width: 100%; }

.pop-head .head_title { display: flex; justify-content: left; width: 61%; height: 100%; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; margin: 0 auto; justify-content: center; }
.head_title h1 { width: 4%; margin-top: 1%; margin-right: 7px;}
.head_title h1 a { display: block; width: 100%; pointer-events: none; }
.head_title h1 a img { display: block; width: 100%; }
.head_title .title { text-align: left; font-size: 26px; font-weight: 600; color: #fff; line-height: 60px; overflow: hidden; }
.head_title .title span { display: inline-block; margin-left: 1vw; }

.pop-head .head_refresh { z-index: 9; position: absolute; top: 50%; left: 40px; right: unset; transform: translateY(-50%); width: 65px; background-color: #6f779180; border-radius: 10px; }
.head_refresh:hover { opacity: 0.8;}
.head_refresh .icon_refresh { width: 40px; height: 40px; }
.head_refresh .icon_refresh a { width: 100%; height: 100%; display: flex; justify-content: start;padding: 11.5px; box-sizing: border-box; }
.head_refresh .icon_refresh a img { display: block; width: 100%; }
.head_refresh .txt_refresh { position: absolute; z-index: 10; top: 50%;left: 12px; right: unset; transform: translateY(-50%); font-size: 16px; color: #fff; font-weight: 500; cursor: pointer; width: 100%; text-align: center; }

.restroom-pop-container .pop-cont .cont-restroom-tutorial { float: left; overflow: hidden;box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1); height: auto; }
.cont-restroom-tutorial .tutorial { width: 260px; height: 100%; }
.cont-restroom-tutorial .tutorial.linebldg { width: 360px; height: 570px; }
.cont-restroom-tutorial .tutorial img { display: block; width: 100%; height: 100%; }

.restroom-pop-container .pop-cont .cont-restroom-info.linebldg,
.restroom-pop-container .pop-cont .cont-restroom-info {width: calc(100% - 410px); height: 100%; min-height: 570px; float: unset; }

.cont-restroom-info .total-restroom-info-wrap { width: 100%; height: auto; }
.total-restroom-info-wrap .total-restroom-info-area.linebldg, .total-restroom-info-wrap .total-restroom-info-area {position: relative; display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; padding: 0; box-sizing: border-box;  margin-top: 0; }

.total-restroom-info-area figure { float: left; width: auto; }
.total-restroom-info-area figure img { display: block; width: 40px; margin: 0 auto; }
.total-restroom-info-area figure img.linebldg { width: 50px; display: none; }
.total-restroom-info-area figure figcaption { text-align: center; }
.total-restroom-info-area figure figcaption.linebldg, .total-restroom-info-area figure figcaption { margin-top: 0; font-size: 24px; font-weight: 600; color: #4c5266; }

#useWomen { color: #eb5688;}
#useMen { color: #1382f4;}

.total-restroom-info-area .count .total span { display: inline-block; margin-left: 10px; }
.total-restroom-info-area .legend_info { width: 15%; height: auto; box-sizing: border-box; -webkit-box-sizing: border-box; margin-left: 50px; }
.total-restroom-info-area .legend_info.linebldg {position: absolute; top: -25px; right: 0; display: flex; align-items: center; gap: 10px; width: auto; padding-top: 0; margin-left: auto; }
.total-restroom-info-area .legend_info li { width: 100%; height: auto; }
.total-restroom-info-area .legend_info li img { display: none; width: 12px; margin-top: -3px; }
.total-restroom-info-area .legend_info li img.linebldg { width: 14px; }
.total-restroom-info-area .legend_info li span { height: 100%; }
.total-restroom-info-area .legend_info li span,.total-restroom-info-area .legend_info li span.linebldg { display: flex; flex-flow: row; align-items: center; margin-left: 0; gap: 5px; font-size: 15px; line-height: unset; width: 100%; color: #555; font-weight: 500; }
.total-restroom-info-area .legend_info li span::before,.total-restroom-info-area .legend_info li span.linebldg::before { display: inline-block; content: ""; width: 12px; height: 12px; background-color: #fff; border: 1px solid #ccc; }
.total-restroom-info-area .legend_info li:nth-child(2) span::before,.total-restroom-info-area .legend_info li:nth-child(2) span.linebldg::before { display: inline-block; content: ""; width: 12px; height: 12px; background-color: #e5e5e5; border: 1px solid #ccc; }

.cont-restroom-info .restroom-info-wrap { margin-top: 30px; margin-left: 20px; width: 100%; display: flex; flex-flow: row nowrap; justify-content: space-between;}
.cont-restroom-info .restroom-info-wrap.linebldg { margin-top: 0; margin-left: 0; height:570px; }
.cont-restroom-info .restroom-info-wrap.poscobldg { margin-top: 70px; margin-left: 0; }

.restroom-info-wrap .restroom-info-area { float: left; width: 50%; height: 460px; }
.restroom-info-wrap .restroom-info-area.linebldg { width: calc((100% - 80px)/2); height: auto; }

.restroom-info-wrap .floor-info-area { font-size: 40px; color: #fff; }
.restroom-info-wrap .floor-info-area.linebldg { text-align: center; display: flex; flex-flow: column nowrap; justify-content: start; align-items: center; padding-top: 50px; margin-top: 0; line-height: unset; }
.restroom-info-wrap .floor-info-area.linebldg .floor { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; max-height: 70px; font-size: 22px; font-weight: 400; text-align: center; color: #555; border-top: 1px solid #e5e5e5; }
.restroom-info-wrap .floor-info-area.linebldg .floor:last-child{border-bottom: 1px solid #e5e5e5;}
.restroom-info-wrap .floor-info-area.poscobldg { margin-top: 55px; line-height: 155px; }

.restroom-info-area .title { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; height: 5%; padding: 0 50px; box-sizing: border-box; -webkit-box-sizing: border-box; text-align: center; margin-bottom: 5px; }
.restroom-info-area .title.linebldg {display: flex; align-items: center; padding: 0; text-align: left; margin-bottom: 0; background-color: unset; height: 50px;}
.restroom-info-area .title.linebldg .count{display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 100%; border-top: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5;}
.restroom-info-area .title.linebldg .count .use{ font-size: 30px;}
.restroom-info-area .title.linebldg .count .total{margin-top: 5px; font-size: 20px; color: #555;}
.restroom-info-area .title.linebldg .count .total span{font-size: 20px; margin-left: 10px;}

.restroom-info-area .title.poscobldg { height: 42px; padding: 0; background-color: #111; border-radius: 50px; line-height: 42px; text-align: left; margin-bottom: 0; }
.restroom-info-area .title .floor { width: 22%; text-indent: -9999px; }
.restroom-info-area .title>span { width: 100%; height: 50px; line-height: 50px; white-space: nowrap; font-size: 20px; font-weight: 500; background-color: #eb5688; color: #fff; text-align: center; }
.restroom-info-area .title>span.men {background-color: #1382f4;}

.restroom-info-area .title .men.poscobldg { width: 100%; font-size: 23px; text-align: center; }

.restroom-info-area .restroom_info { width: 100%; height: 520px; max-height: 520px; display: flex; flex-flow: column nowrap; padding: 0 50px; box-sizing: border-box; -webkit-box-sizing: border-box; }
.restroom-info-area .restroom_info.linebldg { padding: 0; }

.restroom_info .restroom { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; height: 67px; border-bottom: 1px solid #707070; padding: 10px 0; box-sizing: border-box; -webkit-box-sizing: border-box; }
.restroom_info .restroom.linebldg { height: 100%; max-height: 70px; padding: 0; border-bottom: 0; }
.restroom_info .restroom.linebldg:first-child { margin-top: 0; }
.restroom_info .restroom.poscobldg { height: 155px; }
.restroom_info .restroom.poscobldg:first-child { margin-top: 10px; }
.restroom_info .restroom.poscobldg.women { padding: 50px 80px; }
.restroom_info .restroom.poscobldg.men { padding: 50px 20px; }
.restroom_info .restroom .floor { width: 100px; height: 100%; font-size: 33px; color: #fff; text-align: left; line-height: 45px; padding-left: 10px; box-sizing: border-box; }
.restroom_info .restroom .women { color: #eb5688; }
.restroom_info .restroom .men { color: #1382f4; }

.restroom_info .restroom .linebldg.women.off { background-size: 36px; }
.restroom_info .restroom .poscobldg.women.off { background-size: 50px; }
.restroom_info .restroom .women.off,.restroom_info .restroom .men.off { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 0; background: unset; font-size: 20px; font-weight: 600; box-sizing: border-box; border: 1px solid #e5e5e5; background-color: #fff; }
.restroom_info .restroom .linebldg.men.off { background-size: 40px; border-left: 1px solid #e5e5e5; }
.restroom_info .restroom .poscobldg.men.off { background-size: 54px; border-left: 0; }
.restroom_info .restroom .linebldg.women.on { background-size: 36px; }
.restroom_info .restroom .poscobldg.women.on { background-size: 50px; }

.restroom_info .restroom .women.on, .restroom_info .restroom .men.on { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: unset; padding: 0; font-size: 20px; font-weight: 600; box-sizing: border-box; border: 1px solid #e5e5e5; background-color: #f0f0f0; }
.restroom_info .restroom .linebldg.men.on { background-size: 40px; border-left: 1px solid #e5e5e5; }
.restroom_info .restroom .poscobldg.men.on { background-size: 54px; border-left: 0; }
.restroom_info .restroom .women:not(:last-child),
.restroom_info .restroom .men:not(:last-child) { border-right: 0; }
.restroom_info .restroom:not(:last-child) .women,
.restroom_info .restroom:not(:last-child) .men { border-bottom: 0; }

.restroom_info .restroom .unusable { width: 100% !important; border: 1px solid #e5e5e5; background-size: 15% !important; }
.restroom_info .restroom .women.unusable { width: 20%; height: 100%; background-image: url("../../images/icon/icon_unusable.png"); background-repeat: no-repeat; background-position: center; background-size: 32px; }
.restroom_info .restroom .men.unusable { width: 30%; height: 100%; background-image: url("../../images/icon/icon_unusable.png"); background-repeat: no-repeat; background-position: center; background-size: 32px; border-left: 1px solid #707070; padding-left: 5%; box-sizing: border-box; -webkit-box-sizing: border-box; }
.restroom_info .restroom .linebldg.women.unusable { background-size: 36px; }
.restroom_info .restroom .poscobldg.women.unusable { background-size: 50px; }

.restroom_info .restroom .linebldg.men.unusable { background-size: 36px; border-left: 0; }
.restroom_info .restroom .poscobldg.men.unusable { background-size: 50px; border-left: 0; }

.restroom-info-area.high .title { padding-left: 0; }
.restroom-info-area.high .restroom_info { padding-left: 0; }
.restroom-info-area.high .restroom_info .restroom:last-child { border-bottom: 0; margin-bottom: 0; }

.restroom-info-area.low .restroom_info { border-right: 0px; justify-content: start; }
.restroom-info-area.low .restroom_info .restroom:last-child { border-bottom: 0; margin-bottom: 0; }

.restroom-pop-wrap2 { display: none; position: absolute; z-index: 99999; top:50%; left: 50%; width: 1600px; margin: 0 auto; margin-left: -800px; margin-top: -350px; }
.restroom-pop-wrap2 .restroom-pop-area2 { display: flex; flex-flow: column wrap; width: 100%; }

.restroom-pop-area2 .pop-close img { display: inline-block; width: 20px; height: 20px; margin-left: 10px; margin-top: 5px; }

.restroom-pop-container2 .pop-head2 { position: relative; width: 100%; height: 75px; background: #000; }
.pop-head2 .head_title2 { display: flex; justify-content: left; width: 900px; height: 100%; margin: 0 auto; padding: 8px; box-sizing: border-box; -webkit-box-sizing: border-box; justify-content: center; }
.head_title2 h1 { width: 50px; margin-top: 5px; }
.head_title2 h1 a { display: block; width: 100%; pointer-events: none; }
.head_title2 h1 a img { display: block; width: 100%; }
.head_title2 .title { text-align: left; font-size: 38px; font-weight: 600; color: #fff; margin-left: 15px; overflow: hidden; white-space: nowrap; line-height: 60px; }
.head_title2 .title span { display: inline-block; margin-left: 15px; }

.pop-head2 .head_refresh2 { position: absolute; z-index: 9; top: 15px; right: 50px; }
.head_refresh2 .icon_refresh { width: 45px; }
.head_refresh2 .icon_refresh a { display: block; width: 100%; }
.head_refresh2 .icon_refresh a img { display: block; width: 100%; }
.head_refresh2 .txt_refresh { position: absolute; z-index: 10; top: 15px; right: 14px; font-size: 16px; color: #cccccc; }

.restroom-pop-container2 .pop-cont2 { width: 100%; height: 675px; display: flex; flex-flow: row nowrap; justify-content: space-between; position: relative; overflow: hidden; padding:30px 40px 25px; box-sizing: border-box; -webkit-box-sizing: border-box; }
.restroom-pop-container2 .pop-cont2 .cont-restroom-info_02 { width: 71%; height: 100%; display: flex; flex-flow: row nowrap; justify-content: space-between; overflow: hidden; }

.cont-restroom-info_02 .total-restroom-info-wrap2 { width:22%; height: 100%; display: flex; flex-flow: column nowrap; justify-content: space-between; }
.total-restroom-info-wrap2 .total-restroom-title-area { width: 100%; }
.total-restroom-title-area .icon_gender { width: 40px; margin: 0 auto; }
.total-restroom-title-area .icon_gender img { display: block; width: 100%; }
.total-restroom-title-area .title { margin-top: 20px; text-align: center; color: #fff; font-size: 36px; font-weight: bold; }

.total-restroom-info-wrap2 .total-restroom-info-area2 { display: flex; flex-flow: column nowrap; justify-content: space-between; width: 100%; }
.total-restroom-info-area2 li { display: block; overflow: hidden; width: 75%; padding: 20px 0; margin: 0px auto; box-sizing: border-box; text-align: center; color: #fff; font-weight: 500; }
.total-restroom-info-area2 li.total_info { width: 100%; margin-bottom: 0px; padding: 20px 0 10px; border-top: 1px solid #444; }
.total-restroom-info-area2 li.occupied_info { color: #74ff43; background-color: #3d3d3d;}
.total-restroom-info-area2 li.checking_info { color: #6085ff; background-color: #3d3d3d; margin-top: 10px; }
.total-restroom-info-area2 li .ko { width: 100%; font-size: 30px; }
.total-restroom-info-area2 li .en { width: 100%; font-size: 20px; }
.total-restroom-info-area2 li .count { width: 100%; font-size: 45px; margin-top: 5px; }

.cont-restroom-info_02 .restroom-info-wrap2 { width: 72%; height: 100%; overflow: hidden; }
.restroom-info-wrap2 .restroom-info-area2 { width: 100%; height: 100%; margin-top: 48px; }
.restroom-info-area2 .restroom-info-area-list { width: 100%; height: 60px; padding: 15px 0; border-bottom: 1px solid #333; }
.restroom-info-area2 .restroom-info-area-list:last-child { border-bottom: 0px; }
.restroom-info-area-list .restroom_info { float: left; width: 50%; padding-left: 15px; box-sizing: border-box; }
.restroom-info-area-list .restroom_info:nth-child(2) { border-left: 1px solid #333; padding-left: 30px; box-sizing: border-box; }
.restroom-info-area-list .restroom_info .floor { float: left; width: 25%; font-size: 35px; line-height: 60px; color: #fff; font-weight: 500; text-align: left; }
.restroom-info-area-list .restroom_info .icon_restroom { float: left; width: 44px; margin-top: 8px; }
.restroom-info-area-list .restroom_info .icon_restroom img { display: block; width: 100%; }
.restroom-info-area-list .restroom_info .count { float: right; font-size: 28px; font-weight: 500; padding: 5px 20px; margin-right: 30px; line-height: 45px; color: #fff; background-color: #3c3c3c; }
.restroom-info-area-list .restroom_info:nth-child(2) .count { margin-right: 15px; }
.restroom-info-area-list .restroom_info .count .occupied { color: #74ff43; }
.restroom-info-area-list .restroom_info .count .checking { color: #6085ff; }

.cont-restroom-tutorial2 { width: 368px; height: 100%; overflow: hidden; }
.cont-restroom-tutorial2 img { display: block; width: 100%; }

/* 포커스룸 */
.focusroom-map-wrap .map.f3 { background-image: url(../../images/img/linebldg_place_map_3f.png) !important; }
.focusroom-map-wrap .map.f5 { background-image: url(../../images/img/linebldg_place_map_5f.png) !important; }
.focusroom-map-wrap .map.f8 { background-image: url(../../images/img/linebldg_place_map_8f.png) !important; }

.focusroom-map-wrap .focusroom-map-area { display: flex; margin: -95px 0 0 35px; }
.focusroom-map-area > a:hover { opacity: 1; }
.focusroom-map-area div { margin-left: 7px; background-size: 60px; width: 60px; height: 60px; font-size: 0px; cursor: pointer; }
.focusroom-map-area div.use { background-image: url(../../images/icon/icon_place_use.png); }
.focusroom-map-area div.available { background-image: url(../../images/icon/icon_place_available.png); }
.focusroom-map-wrap .focusroom-info-area { display: none; position: absolute; top: 294px; background-color: #222; padding: 15px; }
.focusroom-map-wrap .focusroom-info-area.click { display: block; }

.focusroom-info-area.focusroom1 { left: 67px; }
.focusroom-info-area.focusroom2 { left: 134px; }
.focusroom-info-area.focusroom3 { left: 201px; }

.focusroom_info img { margin-right: 10px; width: 84px; height: 84px; }
.focusroom_info ul li:first-child { font-size: 26px; line-height: 34px; font-weight: 600; }
.focusroom_info ul li { font-size: 15px; line-height: 20px; font-weight: 500; color: #222; }
.focusroom_info ul li.use { color: #ff6e30; }

.focusroom-pop-container .pop-cont .cont-focusroom-floor {margin-left: 20px;}
.cont-focusroom-floor .focusroom-floor-wrap { display: flex; flex-flow: column nowrap; justify-content: space-between; width: 100%; height: 120px; }
.focusroom-floor-wrap .focusroom-floor-area { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; height: 60px; }
.focusroom-floor-area li { width: 30%; background-color: #555; font-size: 40px; font-weight: 500; color: #fff; text-align: center; cursor: pointer; }
.focusroom-floor-area li.click { background-color: #ff6e30; }
.focusroom-floor-wrap .title { width: 100%; height: 40px; font-size: 16px; font-weight: 500; color: #222; text-align: center; line-height: 38px; background-color: #e4e4e4; }

/* 안마의자/리클라이너 */
.chair-map-wrap .map.f5 { background-image: url(../../images/img/linebldg_place_map_5f.png) !important; }
.chair-map-wrap .map.f7 { background-image: url(../../images/img/linebldg_place_map_7f.png) !important; }
.chair-map-wrap .map.f8 { background-image: url(../../images/img/linebldg_place_map_8f.png) !important; }
.chair-map-wrap .chair-map-area { display: flex; flex-direction: column; margin: -110px 0 0 235px; width: 60px; position: absolute; }
.chair-map-area > a:hover { opacity: 1; }
.chair-map-area div { margin-left: 0; background-size: 60px; width: 30px; height: 30px; font-size: 0px; cursor: pointer; opacity: 0.85; border-radius: 30px; box-sizing: border-box; }
.chair-map-area div.use { background: url(../../images/icon/ico_massage_off.svg) no-repeat center/contain; }
.chair-map-area div.available { background: url(../../images/icon/ico_massage_on.svg) no-repeat center/contain; }
.chair-map-area div:hover,.chair-map-area div:active { opacity: 1; }
.chair-map-wrap .chair-info-area { display: none; position: absolute; left: 280px; background-color: #222; padding: 15px; }
.chair-map-wrap .chair-info-area.click { display: block; }
.chair-info-area.chair1 { top: 368px; }
.chair-info-area.chair2 { top: 411px; }
.chair_info img { margin-right: 10px; width: 50px; height: 50px; }
.chair_info ul li { font-size: 24px; line-height: 50px; font-weight: 600; color: #1381f4; }
.chair_info ul li.use { color: #5a6681; }

.chair-floor-select li { width: 100%; height: 50px; line-height: 50px; text-align: center; background-color: none; cursor: pointer; }
.chair-floor-select li:last-child { border-bottom: 0; }
.cont-chair .chair-manual-wrap { display: flex; flex-flow: column; justify-content: space-between; padding-top: 15px; box-sizing: border-box; }
.chair-manual-wrap .title { background-color: transparent; padding: 0; margin: 0 20px; text-align: center; }
.chair-manual-wrap .title .point span { font-size: 12px; }
.chair-manual-wrap .subtitle { font-size: 14px; line-height: 20px; margin: 10px 20px; font-weight: 500; text-align: center; color: #5a6681; }
.chair-manual-wrap .explain { text-align: center; padding: 10px; box-sizing: border-box; background-color: #f8f8fa; box-sizing: border-box; margin-top: auto; }
.chair-manual-wrap img { display: block; width: 100%; margin-top: 0; }

/* 공기질센서 */
.air-map-wrap .map.f3 { background-image: url(../../images/img/linebldg_place_map_3f.png) !important; }
.air-map-wrap .map.f5 { background-image: url(../../images/img/linebldg_place_map_5f.png) !important; }
.air-map-wrap .map.f7 { background-image: url(../../images/img/linebldg_place_map_7f.png) !important; }
.air-map-wrap .map.f8 { background-image: url(../../images/img/linebldg_place_map_8f.png) !important; }
.air-map-wrap .map.f11 {background-image: url(../../images/img/linebldg_place_map_11f.png) !important; }
.air-map-wrap .map.f12 {background-image: url(../../images/img/linebldg_place_map_12f.png) !important; }
.air-map-wrap .map.f16 { background-image: url(../../images/img/posco_place_map_16f.png) !important; }
.air-map-wrap .map.f17 {background-image: url(../../images/img/posco_place_map_17f.png) !important; }

.air-map-wrap .air-info-area { display: none; position: absolute; background-color: #222; padding: 15px; }
.air-map-wrap .air-info-area.click { display: block;}
.air-map-area > a:hover { opacity: 1; }

.air-map-area div { position: absolute; margin-left: 0; background-image: url(../../images/icon/ico_air-level_05.svg); background-size: contain; width: 30px; height: 30px; font-size: 0px; cursor: pointer; background-color: transparent; border-radius: 100%; opacity: 0.85; }
.air-map-area div.nice { background-image: url(../../images/icon/ico_air-level_01.svg); }
.air-map-area div.nice.click { background-image: url(../../images/icon/ico_air-level_01.svg); }
.air-map-area div.normal { background-image: url(../../images/icon/ico_air-level_02.svg); }
.air-map-area div.normal.click { background-image: url(../../images/icon/ico_air-level_02.svg); }
.air-map-area div.bad { background-image: url(../../images/icon/ico_air-level_03.svg); }
.air-map-area div.bad.click { background-image: url(../../images/icon/ico_air-level_03.svg); }
.air-map-area div.sobad { background-image: url(../../images/icon/ico_air-level_04.svg); }
.air-map-area div.sobad.click { background-image: url(../../images/icon/ico_air-level_04.svg); }
.air-map-area div.click { background-image: url(../../images/icon/ico_air-level_05.svg); }
.air-map-area div.click,.air-map-area div:hover { opacity: 1; }

.air-map-area div.air1 { top: 470px; left: 660px; }
.air-map-area div.air2 { top: 250px; left: 720px; }
.air-map-area div.air3 { top: 470px; left: 560px; }
.air-map-area div.air4 { top: 350px; left: 210px; }
.air-map-area div.air5 { top: 100px; left: 250px; }
.air-map-area div.air6 { top: 160px; left: 690px; }
.air-map-area div.air7 { top: 480px; left: 260px; }
.air-map-area div.air8 { top: 230px; left: 270px; }
.air-map-area div.air9 { top: 230px; left: 160px; }
.air-map-area div.air10 { top: 60px; left: 580px; }
.air-map-area div.air11 { top: 60px; left: 710px; }
.air-map-area div.f7.air4 { top: 75px; left: 185px; }
.air-map-area div.f7.air5 { top: 75px; left: 255px; }
.air-map-area div.f7.air6 { top: 75px; left: 325px; }
.air-map-area div.f7.air7 { top: 60px; left: 580px; }
.air-map-area div.f7.air8 { top: 60px; left: 710px; }
.air-map-area div.f7.air9 { top: 275px; left: 220px; }
.air-map-area div.f7.air10 { top: 170px; left: 705px; }
.air-map-area div.f7.air11 { top: 480px; left: 75px; }
.air-map-area div.f7.air12 { top: 480px; left: 135px; }
.air-map-area div.f7.air13 { top: 480px; left: 195px; }
.air-map-area div.f7.air14 { top: 245px; left: 540px; }
.air-map-area div.f7.air15 { top: 285px; left: 540px; }
.air-map-area div.f7.air16 { top: 325px; left: 540px; }
.air-map-area div.f7.air17 { top: 480px; left: 260px; }
.air-map-area div.f11.air1 { top: 350px; left: 210px; }
.air-map-area div.f11.air2 { top: 100px; left: 250px; }
.air-map-area div.f11.air3 { top: 230px; left: 270px; }
.air-map-area div.f11.air4 { top: 230px; left: 160px; }
.air-map-area div.f12.air1 { top: 160px; left: 230px; }
.air-map-area div.f12.air2 { top: 120px; left: 670px; }
.air-map-area div.f12.air3 { top: 470px; left: 560px; }
.air-map-area div.f12.air4 { top: 245px; left: 540px; }
.air-map-area div.f12.air5 { top: 285px; left: 540px; }
.air-map-area div.f12.air6 { top: 325px; left: 540px; }
.air-map-area div.f12.air7 { top: 470px; left: 660px; }
.air-map-area div.f12.air8 { top: 250px; left: 720px; }
.air-map-area div.f16.air1 { top: 260px; left: 507px; }
.air-map-area div.f16.air2 { top: 100px; left: 890px; }
.air-map-area div.f16.air3 { top: 330px; left: 507px; }
.air-map-area div.f16.air4 { top: 330px; left: 590px; }
.air-map-area div.f16.air5 { top: 185px; left: 536px; }
.air-map-area div.f16.air6 { top: 128px; left: 155px; }
.air-map-area div.f16.air7 { top: 85px; left: 398px; }
.air-map-area div.f16.air8 { top: 90px; left: 785px; }
.air-map-area div.f16.air9 { top: 185px; left: 772px; }
.air-map-area div.f16.air10 { top: 285px; left: 757px; }
.air-map-area div.f17.air1 { top: 272px; left: 765px; }
.air-map-area div.f17.air2 { top: 82px; left: 365px; }
.air-map-area div.f17.air3 { top: 119px; left: 820px; }
.air-map-area div.f17.air4 { top: 82px; left: 665px; }

.air-info-area.air1 { top: 240px; left: 550px; }
.air-info-area.air1.valueless { top: 265px}
.air-info-area.air2 { top: 170px; left: 416px; }
.air-info-area.air3 { top: 240px; left: 450px; }
.air-info-area.air3.valueless { top: 265px}
.air-info-area.air4 { top: 270px; left: 267px; }
.air-info-area.air5 { top: 40px; left: 307px; }
.air-info-area.air6 { top: 80px; left: 386px; }
.air-info-area.air7 { top: 250px; left: 150px; }
.air-info-area.air7.valueless { top: 275px}
.air-info-area.air8 { top: 278px; left: 150px; }
.air-info-area.air9 { top: 278px; left: 50px; }
.air-info-area.air10 { top: 108px; left: 460px; }
.air-info-area.air11 { top: 108px; left: 590px; }
.air-info-area.f7.air4 { top: 123px; left: 65px; }
.air-info-area.f7.air5 { top: 123px; left: 135px; }
.air-info-area.f7.air6 { top: 123px; left: 205px; }
.air-info-area.f7.air7 { top: 108px; left: 460px; }
.air-info-area.f7.air8 { top: 108px; left: 590px; }
.air-info-area.f7.air9 { top: 195px; left: 277px; }
.air-info-area.f7.air10 { top: 90px; left: 401px; }
.air-info-area.f7.air11 { top: 250px; left: 50px; }
.air-info-area.f7.air11.valueless { top: 275px; }
.air-info-area.f7.air12 { top: 250px; left: 85px; }
.air-info-area.f7.air12.valueless { top: 275px; }
.air-info-area.f7.air13 { top: 250px; left: 125px; }
.air-info-area.f7.air13.valueless { top: 275px; }
.air-info-area.f7.air14 { top: 165px; left: 597px; }
.air-info-area.f7.air15 { top: 205px; left: 597px; }
.air-info-area.f7.air16 { top: 245px; left: 597px; }
.air-info-area.f7.air17 { top: 250px; left: 165px; }
.air-info-area.f7.air17.valueless { top: 275px; }
.air-info-area.f11.air1 { top: 270px; left: 267px; }
.air-info-area.f11.air2 { top: 40px; left: 307px; }
.air-info-area.f11.air3 { top: 278px; left: 150px; }
.air-info-area.f11.air4 { top: 278px; left: 50px; }
.air-info-area.f12.air1 { top: 208px; left: 110px; }
.air-info-area.f12.air2 { top: 168px; left: 550px; }
.air-info-area.f12.air3 { top: 240px; left: 450px; }
.air-info-area.f12.air3.valueless { top: 265px}
.air-info-area.f12.air4 { top: 165px; left: 597px; }
.air-info-area.f12.air5 { top: 205px; left: 597px; }
.air-info-area.f12.air6 { top: 245px; left: 597px; }
.air-info-area.f12.air7 { top: 240px; left: 550px; }
.air-info-area.f12.air7.valueless { top: 265px}
.air-info-area.f12.air8 { top: 170px; left: 416px; }
.air-info-area.f16.air1 { top: 180px; left: 564px; }
.air-info-area.f16.air2 { top: 40px; left: 586px; }
.air-info-area.f16.air3 { top: 250px; left: 564px; }
.air-info-area.f16.air4 { top: 250px; left: 647px; }
.air-info-area.f16.air5 { top: 105px; left: 593px; }
.air-info-area.f16.air6 { top: 176px; left: 45px; }
.air-info-area.f16.air7 { top: 133px; left: 278px; }
.air-info-area.f16.air8 { top: 40px; left: 481px; }
.air-info-area.f16.air9 { top: 105px; left: 468px; }
.air-info-area.f16.air10 { top: 205px; left: 453px; }
.air-info-area.f17.air1 { top: 192px; left: 461px; }
.air-info-area.f17.air2 { top: 130px; left: 245px; }
.air-info-area.f17.air3 { top: 40px; left: 516px; }
.air-info-area.f17.air4 { top: 130px; left: 545px; }

.air-info-area .title { float: left;}
.air-info-area .title.valueless { float: none; }

.air-info-area .close { text-indent: -9999px; position: absolute; right: 15px; top: 15px; display: inline-block; width: 14px; height: 14px; background-image: url(../../images/icon/icon_close2.png); background-repeat: no-repeat; background-size: contain; cursor: pointer; }
.air-info-area .status { float: right; font-size: 16px; font-weight: 600; margin-right: 25px; margin-top: -6px; }
.air-info-area .status.valueless { display: none; }
.status.nice { color: #2eb7fe; }
.status.normal { color: #28ac22; }
.status.bad { color: #ff8a00; }
.status.sobad { color: #ec0606; }

.air-info-area .progressbar-wrap { clear: both; height: 25px; }
.air-info-area .progressbar-wrap.valueless { display: none; }
.progressbar-wrap .arrow { height: 7px; width: 212px; box-sizing: border-box; }
.progressbar-wrap .arrow img { display: inline-block; width: 7px; transition: all .3s; margin-bottom: 8px; }
.progressbar-wrap .progressbar-area { display: flex; flex-flow: row nowrap; }
.progressbar-area .progressbar-info { position: relative; max-width: 212px; width: 100%; margin: 5px 0; height: 10px; background: #fff; overflow: hidden;}
.progressbar-info .progressbar { position: absolute; left: 0; top: 0; bottom: 0; width: 0; transition: all .3s; background-color: #ccc; }
.progressbar.nice { background-color: #2eb7fe; }
.progressbar.normal { background-color: #28ac22; }
.progressbar.bad { background-color: #ff8a00; }
.progressbar.sobad { background-color: #ec0606; }
.progressbar-area .figure { width: 45px; text-align: right; color: #fff; font-size: 16px; font-weight: 600; margin-left: 10px; line-height: 16px; }

.air-info-area .air_info {max-width: 250px;}
.air_info ul li { width: 100%; display: flex; flex-flow: row nowrap; justify-content: space-between; font-size: 14px; line-height: 20px; font-weight: 500; color: #222; }
.air_info ul li .name > .dot { display: inline-block; width: 10px; height: 10px; background-color: #aaaaaa; border-radius: 10px; margin-right: 10px; }
.air_info ul li .name > .dot.nice { background-color: #2eb7fe; }
.air_info ul li .name > .dot.normal { background-color: #28ac22; }
.air_info ul li .name > .dot.bad { background-color: #ff8a00; }
.air_info ul li .name > .dot.sobad { background-color: #ec0606; }
.air_info ul li:nth-child(3) .name>.dot { background-color: #1285b3; }
.air_info ul li:nth-child(4) .name>.dot { background-color: #d24d4d; }
.air_info ul li:nth-child(5) .name>.dot { background-color: #99aa2f; }
.air_info ul li:nth-child(6) .name>.dot { background-color: #daa31d; }
.air_info ul li .value { margin-left: 45px; }
.air_info ul li .value .unit { display: inline-block; width: 37px; text-align: left; margin-left: 12px; }

.air-floor-select li { width: 100%; height: 50px; line-height: 50px; text-align: center; background-color: none; cursor: pointer; }
.air-floor-select li:last-child { border-bottom: 0; }
.air-manual-wrap .manual_bg { position: absolute; right: 0; top: 0; }
.air-manual-wrap ul { width: 100%; padding: 0; box-sizing: border-box; border-radius: 0; font-size: 14px; line-height: 22px; font-weight: 500; background-color: #fff; }
.air-manual-wrap ul.explain1 { margin-bottom: 0; }
.air-manual-wrap ul.explain1 li { display: flex; align-items: center; justify-content: start; background-color: #f8f8fa; gap: 20px; padding: 5px 80px; box-sizing: border-box; white-space: nowrap; }
.air-manual-wrap ul.explain1 li img { display: block; width: 40px; height: 40px; border-radius: 10px; padding: 8px; box-sizing: border-box; background-color: #fff; }
.air-manual-wrap ul.explain1 li:nth-child(2) { background-color: #fff; }
.air-manual-wrap ul.explain1 li:nth-child(2) img { background-color: #f8f8fa; }
.air-manual-wrap ul.explain1 li:last-child { background-color: #f8f8fa; color: #5a6681ca; padding: 0 80px 5px; }
.air-manual-wrap ul .blue { color: #00a8ff; }
.air-manual-wrap .subtitle { width: 100%; height: 25px; border-radius: 15px; line-height: 27px; background-color: #555555e9; font-size: 14px; text-align: center; font-weight: 100; display: none; }
.air-manual-wrap .subtitle-cont { font-size: 13px; margin-top: 10px; line-height: 20px; font-weight: 100; text-align: center; display: none; }
.air-manual-wrap ul.explain2 { margin-top: 0; display: flex; flex-flow: column; justify-content: start; align-items: center; }
.air-manual-wrap .explain2 li { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; }
.air-manual-wrap ul.explain2 li { display: flex; align-items: center; justify-content: space-between; gap: 10px; background-color: #f8f8fa; padding: 8px 30px; box-sizing: border-box; }
.air-manual-wrap ul.explain2 li:nth-child(1) { background-color: rgba(35, 145, 196, 0.1); }
.air-manual-wrap ul.explain2 li:nth-child(2) { background-color: rgba(238, 115, 115, 0.1); }
.air-manual-wrap ul.explain2 li:nth-child(3) { background-color: rgba(213, 222, 53, 0.1); }
.air-manual-wrap ul.explain2 li:nth-child(4) { background-color: rgba(248, 185, 27, 0.1); }
.air-manual-wrap ul.explain2 li:nth-child(1)>div:nth-child(1) { color: #1285b3; }
.air-manual-wrap ul.explain2 li:nth-child(2)>div:nth-child(1) { color: #d24d4d; }
.air-manual-wrap ul.explain2 li:nth-child(3)>div:nth-child(1) { color: #99aa2f; }
.air-manual-wrap ul.explain2 li:nth-child(4)>div:nth-child(1) { color: #daa31d; }
.air-manual-wrap ul.explain2 li>div:nth-child(2) { background-color: #fff; padding: 2px 10px; }
.air-manual-wrap ul .green { color: #28ac22; }
.air-manual-wrap .imp { font-size: 12px; margin: 2px 30px 0 0; color: #5a6681ca; line-height: 20px; font-weight: 400; text-align: right; }
.air-explain-wrap .air_sub_info01, .air-explain-wrap .air_sub_info02 { border-radius: 0; }
.air-explain-wrap .sub_tit_box, .perfume-explain-wrap .sub_tit_box, .locker-explain-wrap .sub_tit_box { border-radius: 0; }

/* 향기캡슐 */
.perfume-map-wrap .map.f3 { background-image: url(../../images/img/linebldg_place_map_3f.png) !important; }
.perfume-map-wrap .map.f5 { background-image: url(../../images/img/linebldg_place_map_5f.png) !important; }
.perfume-map-wrap .map.f7 { background-image: url(../../images/img/linebldg_place_map_7f.png) !important; }
.perfume-map-wrap .map.f8 { background-image: url(../../images/img/linebldg_place_map_8f.png) !important; }
.perfume-map-wrap .map.f11 { background-image: url(../../images/img/linebldg_place_map_11f.png) !important; }
.perfume-map-wrap .map.f12 { background-image: url(../../images/img/linebldg_place_map_12f.png) !important; }
.perfume-map-wrap .map.f16 { background-image: url(../../images/img/posco_place_map_16f.png) !important; }
.perfume-map-wrap .map.f17 { background-image: url(../../images/img/posco_place_map_17f.png) !important; }
.perfume-map-area div { position:absolute; font-size: 18px; font-weight: 600; color: #fff; cursor: pointer; background-color: rgba(19, 130, 244, 0.9); text-align: center; border-radius: 5px; line-height: 38px; width: auto !important; height: 40px !important; text-indent: 0 !important; background-image: none !important; padding: 0 20px; display: flex; gap: 3px; justify-content: center; align-items: center; letter-spacing: -1.08px; }
.perfume-map-area div::before { content: ""; width: 11px; height: 11px; margin-right: 5px; margin-bottom: 2px; background-color: #00d2ff; display: block; border-radius: 100%; }
.perfume-map-area div.perfume1 { top: 250px; left: 720px; }
.perfume-map-area div.perfume2 { top: 468px; left: 628px; }
.perfume-map-area div.perfume3 { top: 468px; left: 535px; }
.perfume-map-area div.perfume4 { top: 58px; left: 685px; }
.perfume-map-area div.f7.perfume3 { top: 468px; left: 530px; }
.perfume-map-area div.f7.perfume4 { top: 58px; left: 140px; }
.perfume-map-area div.f7.perfume5 { top: 58px; left: 228px; }
.perfume-map-area div.f7.perfume6 { top: 58px; left: 315px; }
.perfume-map-area div.f7.perfume7 { top: 58px; left: 558px; }
.perfume-map-area div.f7.perfume8 { top: 58px; left: 685px; }
.perfume-map-area div.f7.perfume9 { top: 220px; left: 380px; }
.perfume-map-area div.f7.perfume10 { top: 290px; left: 615px; }
.perfume-map-area div.f11.perfume1 { top: 220px; left: 100px; }
.perfume-map-area div.f11.perfume2 { top: 220px; left: 235px; }
.perfume-map-area div.f11.perfume3 { top: 480px; left: 340px; }
.perfume-map-area div.f11.perfume4 { top: 480px; left: 205px; }
.perfume-map-area div.f12.perfume4 { top: 220px; left: 380px; }
.perfume-map-area div.f12.perfume5 { top: 160px; left: 205px; }
.perfume-map-area div.f12.perfume6 { top: 120px; left: 630px; }
.perfume-map-area div.f16.perfume1 { top: 260px; left: 485px; }
.perfume-map-area div.f16.perfume2 { top: 103px; left: 822px; }
.perfume-map-area div.f16.perfume3 { top: 332px; left: 453px; }
.perfume-map-area div.f16.perfume4 { top: 332px; left: 573px; }
.perfume-map-area div.f16.perfume5 { top: 185px; left: 500px; }
.perfume-map-area div.f16.perfume6 { top: 128px; left: 115px; }
.perfume-map-area div.f17.perfume1 { top: 200px; left: 715px; }
.perfume-map-area div.f17.perfume2 { top: 270px; left: 740px; }
.perfume-map-area div.f17.perfume3 { top: 115px; left: 770px; }
.perfume-map-area div.f17.perfume4 { top: 85px; left: 620px; }
.perfume-map-area div.f17.perfume5 { top: 200px; left: 805px; }
.perfume-map-area div.f17.perfume6 { top: 410px; left: 510px; }

.perfume-info-area.perfume1 { top: 230px !important; left: 636px !important; }
.perfume-info-area.perfume2 { top: 394px !important; left: 623px !important; }
.perfume-info-area.perfume3 { top: 394px !important; left: 525px !important; }
.perfume-info-area.perfume4 { top: 58px !important; left: 611px !important; }
.perfume-info-area.f7.perfume4 { top: 58px !important; left: 140px !important; }
.perfume-info-area.f7.perfume5 { top: 58px !important; left: 228px !important; }
.perfume-info-area.f7.perfume6 { top: 58px !important; left: 315px !important; }
.perfume-info-area.f7.perfume7 { top: 58px !important; left: 558px !important; }
.perfume-info-area.f7.perfume8 { top: 58px !important; left: 611px !important; }
.perfume-info-area.f7.perfume9 { top: 200px !important; left: 380px !important; }
.perfume-info-area.f7.perfume10 { top: 270px !important; left: 605px !important; }
.perfume-info-area.f11.perfume1 { top: 190px !important; left: 100px !important; }
.perfume-info-area.f11.perfume2 { top: 190px !important; left: 235px !important; }
.perfume-info-area.f11.perfume3 { top: 394px !important; left: 340px !important; }
.perfume-info-area.f11.perfume4 { top: 394px !important; left: 205px !important; }
.perfume-info-area.f12.perfume4 { top: 200px !important; left: 380px !important; }
.perfume-info-area.f12.perfume5 { top: 140px !important; left: 205px !important; }
.perfume-info-area.f12.perfume6 { top: 90px !important; left: 611px !important; }
.perfume-info-area.f16.perfume1 { top: 255px !important; left: 485px !important; }
.perfume-info-area.f16.perfume2 { top: 100px !important; left: 630px !important; }
.perfume-info-area.f16.perfume3 { top: 325px !important; left: 450px !important; }
.perfume-info-area.f16.perfume4 { top: 325px !important; left: 570px !important; }
.perfume-info-area.f16.perfume5 { top: 175px !important; left: 500px !important; }
.perfume-info-area.f16.perfume6 { top: 120px !important; left: 115px !important; }
.perfume-info-area.f17.perfume1 { top: 200px !important; left: 630px !important; }
.perfume-info-area.f17.perfume2 { top: 270px !important; left: 630px !important; }
.perfume-info-area.f17.perfume3 { top: 115px !important; left: 630px !important; }
.perfume-info-area.f17.perfume4 { top: 85px !important; left: 611px !important; }
.perfume-info-area.f17.perfume5 { top: 200px !important; left: 630px !important; }
.perfume-info-area.f17.perfume6 { top: 394px !important; left: 510px !important; }

.perfume-map-wrap .perfume-info-area { display:none; position: absolute; background-color: #222; padding: 15px; }
.perfume-info-area.click { display: block; }
.perfume-info-area .perfume_info { margin-top: 5px; border-radius: 5px; background-color: #fff; padding: 10px 12px; flex-flow: column; justify-content: start; align-items: start;}
.perfume_info .name { display: inline-block; width: 70px; font-size: 14px; font-weight: 600; color: #1382f4; line-height: 20px; }
.perfume_info .value { display: inline-block; font-size: 14px; font-weight: 500; color: #5a6681; line-height: 20px; }

.perfume-floor-select li { width: 100%; height: 50px; line-height: 50px; text-align: center; background-color: none; cursor: pointer; }
.perfume-floor-select li:last-child { border-bottom: 0;}

.perfume-manual-wrap .title, .perfume-manual-wrap .perfume-img, .perfume-manual-wrap ul.explain1 li > div > img { display: none; }
.perfume-manual-wrap .title img { display: inline-block; width: 20px; margin-left: 7px; cursor: pointer; }
.perfume-manual-wrap .subtitle { width: 100%; height: auto; border-radius: 0; line-height: 25px; background-color: transparent; font-size: 18px; text-align: center; font-weight: 500; color: #1382f4; letter-spacing: -1px; padding: 10px; box-sizing: border-box; }
.perfume-manual-wrap ul { font-size: 12px; line-height: 24px; font-weight: 100; }
.perfume-manual-wrap ul.explain1 { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; margin: 0; height: auto; }
.perfume-manual-wrap ul.explain1 li { width: 50%; text-align: center; background-color: #F8F8Fa; color: #4c526666; font-weight: 400; background-repeat: no-repeat; background-size: 30px; padding: 5px 10px; box-sizing: border-box; }
.perfume-manual-wrap ul.explain1 li:nth-child(1) { background-color: #ddf7de; }
.perfume-manual-wrap ul.explain1 li:nth-child(2) { background-color: #f2f7dd; }
.perfume-manual-wrap ul.explain1 li:nth-child(3) { background-color: #f7eadd; }
.perfume-manual-wrap ul.explain1 li:nth-child(4) { background-color: #deddf7; }
.perfume-manual-wrap .explain1 li div:first-child { line-height: 20px; color: #ffc600; font-weight: 300; font-size: 14px; }
.perfume-manual-wrap .explain1 li:nth-child(1) div:first-child { color: #5a935c; font-weight: 500; font-size: 16px; }
.perfume-manual-wrap .explain1 li:nth-child(2) div:first-child { color: #9ea96e; font-weight: 500; font-size: 16px; }
.perfume-manual-wrap .explain1 li:nth-child(3) div:first-child { color: #a68666; font-weight: 500; font-size: 16px; }
.perfume-manual-wrap .explain1 li:nth-child(4) div:first-child { color: #8d8bbd; font-weight: 500; font-size: 16px; }
.perfume-manual-wrap .explain2_area {height: calc(100% - 190px); overflow-y: auto;}

.explain2_area .explain2 { width: 100%; height: 110px; margin-top: 0; display: flex; flex-flow: column; justify-content: start; align-items: start; }
.explain2_area .explain2 li { width: 100%; display: flex; align-items: center; gap: 15px; padding: 4px 30px; background-color: #F8F8FA; white-space: nowrap; }
.explain2_area .explain2 li:nth-child(2n) { background-color: #fff; }
.explain2_area .explain2 li span { font-size: 14px; font-weight: 400; }
.explain2_area .explain2 li::before { display: block; content: ""; width: 5px; height: 5px; background-color: #1382f4; }
.explain2_area li.swiper-slide { width: 100%; height: 110px; display: flex; flex-flow: column nowrap; align-items: start; background: #252525; border-radius: 5px; padding: 7px 20px; box-sizing: border-box; }
.explain2_area .swiper-pagination { height: 11px; }

.swiper-pagination-bullet-active { opacity: var(--swiper-pagination-bullet-opacity, 1); background: #444 !important; }
.perfume-manual-wrap .perfume-img { display: none; position: absolute; top: 50px; left: 30px; height: 385px; padding: 17px 20px; box-sizing: border-box; background-color: #555; border-radius: 10px; }
.perfume-manual-wrap .perfume-img img { display: block; width: 100%; margin: 0 auto; }

/* 사물함 */
.locker-map-wrap .map.f3 { background-image: url(../../images/img/linebldg_place_map_3f.png) !important; }
.locker-map-wrap .map.f5 { background-image: url(../../images/img/linebldg_place_map_5f.png) !important; }
.locker-map-wrap .map.f7 { background-image: url(../../images/img/linebldg_place_map_7f.png) !important; }
.locker-map-wrap .map.f8 { background-image: url(../../images/img/linebldg_place_map_8f.png) !important; }
.locker-map-wrap .map.f11 { background-image: url(../../images/img/linebldg_place_map_11f.png) !important; }
.locker-map-wrap .map.f12 { background-image: url(../../images/img/linebldg_place_map_12f.png) !important; }
.locker-map-area div { position:absolute; font-size: 18px; font-weight: 600; color: #fff; width: auto; height: 40px; cursor: pointer; background-color: rgba(19, 130, 244, 0.9); text-align: center; border-radius: 5px; line-height: 38px; padding: 0 20px; display: flex; gap: 3px; justify-content: center; align-items: center; letter-spacing: -1.08px; }
.locker-map-area div::before { display: block; content: ""; width: 11px; height: 11px; margin-right: 5px; margin-bottom: 2px; border-radius: 100%; background-color: #00d2ff; }
.locker-map-area div.locker1 { top: 310px; left: 330px; }
.locker-map-area div.locker2 { top: 65px; left: 365px; }
.locker-map-area div.locker3 { top: 210px; left: 650px; }
.locker-map-area div.f5.locker3 { top: 200px; left: 600px; }
.locker-map-area div.f7.locker1 { top: 320px; left: 330px; }
.locker-map-area div.f7.locker2 { top: 210px; left: 330px; }
.locker-map-area div.f7.locker3 { top: 65px; left: 365px; }
.locker-map-area div.f7.locker4 { top: 220px; left: 700px; }
.locker-map-area div.f12.locker1 { top: 200px; left: 350px; }
.locker-map-area div.f12.locker2 { top: 130px; left: 350px; }
.locker-map-area div.f12.locker3 { top: 65px; left: 350px; }
.locker-map-area div.f12.locker4 { top: 220px; left: 700px; }
.locker-map-wrap .locker-info-area { display:none; position: absolute; min-width: 130px; background-color: #222; padding: 15px; }
.locker-info-area.locker1 { top: 310px; left: 330px; }
.locker-info-area.locker2 { top: 65px; left: 365px; }
.locker-info-area.locker3 { top: 210px; left: 650px; }
.locker-info-area.f5.locker3 { top: 200px; left: 600px; }
.locker-info-area.f7.locker1 { top: 320px; left: 330px; }
.locker-info-area.f7.locker2 { top: 210px; left: 330px; }
.locker-info-area.f7.locker3 { top: 65px; left: 365px; }
.locker-info-area.f7.locker4 { top: 220px; left: 534px; }
.locker-info-area.f12.locker1 { top: 200px; left: 350px; }
.locker-info-area.f12.locker2 { top: 130px; left: 350px; }
.locker-info-area.f12.locker3 { top: 65px; left: 350px; }
.locker-info-area.f12.locker4 { top: 220px; left: 504px; }
.locker-info-area.click { display: block; }
.locker-info-area .locker_info { display: flex; flex-flow: column; align-items: start; margin-top: 5px; background-color: #fff; padding: 10px 12px; border-radius: 5px; }
.locker_info li { display: flex; flex-flow: row nowrap; margin-bottom: 5px; justify-content: center; }
.locker_info li:last-child { margin-bottom: 0px; }
.locker_info .value { display: inline-block; width: 25px; height: 25px; color: #5a6681; font-size: 14px; text-align: center; line-height: 25px; margin-right: 5px; font-weight: 500; border: 1px solid #5a668150; border-radius: 2px; }
.locker_info .value:last-child { margin-right: 0px; }

.locker-floor-select li { width: 100%; height: 50px; line-height: 50px; text-align: center; background-color: none; cursor: pointer; }
.locker-floor-select li:last-child { border-bottom: 0; }
.locker-manual-wrap .subtitle { width: 100%; height: auto; line-height: 25px; background-color: #f5f5f5; font-size: 16px; text-align: center; font-weight: 600; color: #5a6681; padding: 5px 30px; box-sizing: border-box; }
.locker-manual-wrap .subtitle span { margin-right: 10px; color: #1382f4; }
.locker-manual-wrap .locker-explain-area { display: flex; flex-flow: row nowrap; width: 100%; height: auto; margin-top: 0; padding: 10px 30px; box-sizing: border-box; }
.locker-explain-area .explain_img { margin-left: 0; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.02); -webkit-box-shadow:1px 1px 3px rgba(0, 0, 0, 0.02);}
.locker-explain-area .explain { margin-left: 20px; line-height: 20px; }
.locker-explain-area .explain .red { color: #ff3338; }
.locker-explain-area .explain .lightgreen { color: green; }
.cont-locker .locker-manual-wrap .explain { font-weight: 400; color: #5a6681; }

/* 구내식당 밀집도 */
.maincontant__section__info--menu2 {width: 100%; display: flex; align-items: center; justify-content: space-between;}
.maincontant__section__info--menu2 .maincontant__section__info--weather{width: calc(50% - 5px); flex-flow: column; align-items:center;}
.maincontant__section__info--menu2 .maincontant__section__info--weather dd p{display: none;}
.maincontant__section__info--menu2 .maincontant__section__info--heatmap{cursor: pointer; margin-top: 40px; width: calc(50% - 5px);background-color: #fff; padding: 0 20px; box-sizing:border-box; display: flex; align-items: center; justify-content: center; gap: 10px; height: 115px; min-height: 115px; box-shadow: 1px 1px 5px rgba(0, 0, 0, .08); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .08);}
.maincontant__section__info--heatmap span.icon{display: inline-block; min-width: 60px; height: 75px; text-indent: -9999px; background: url(../../images/connectplace/common/heatmapMenu.png) no-repeat center/contain;}
.maincontant__section__info--heatmap span{font-size: 22px; letter-spacing: -0.2px; line-height: 1.5; font-weight: 600; text-align: center; color: #5f6475; word-break: keep-all;}

.cont-heatmap {width: 100%; max-width: 445px; height: 100%; max-height: 580px;}
.cont-heatmap .heatmap-floor-wrap{
    display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center;
    width: 100%; height: 80px; padding: 20px 30px; margin-bottom: 0; box-sizing: border-box;
    background: unset;  background-image: linear-gradient(to top, #1382f5, #5aa7f7);}
.heatmap-floor-wrap .floor-area { width: auto; display: flex; align-items: center; gap: 20px; color: #fff;}
.heatmap-floor-wrap .floor-area .title{font-size: 18px;font-weight: 500; letter-spacing: -0.25px;}
.heatmap-floor-wrap .floor-area .floor{font-size: 45px;font-weight: 500; letter-spacing: -0.25px;}
.heatmap-floor-wrap .date-area {display: flex; flex-flow: column; align-items: center; justify-content: center; padding-left: 20px; border-left: 1px solid rgba(999, 999, 999, 0.2);}
.heatmap-floor-wrap .date-area span{ color: #fff; font-size: 14px; letter-spacing: -0.25px; font-weight: 300;}
.heatmap-floor-wrap .date-area span.time{font-size: 20px; line-height: 1.2; font-weight: 400;}

.heatmap-manual-wrap{background: #f3f9fe; height: calc(100% - 80px);}
.heatmap-manual-wrap .heatmap-realTime-area{width: 100%; padding: 20px 0 0; box-sizing:border-box;}
.heatmap-realTime-area h4{font-size: 20px; font-weight: 600; color: #010101; letter-spacing: -0.25px; margin-left: 20px;}
.heatmap-realTime-area .realTime-step{padding: 0 30px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; margin: 20px 0;}
.heatmap-realTime-area .realTime-step .stepImg{text-indent: -9999px; width: 234px; height: 80px;}
.heatmap-realTime-area .realTime-step.step01 .stepImg{background: url(../../images/connectplace/common/heatmap01.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step02 .stepImg{background: url(../../images/connectplace/common/heatmap02.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step03 .stepImg{background: url(../../images/connectplace/common/heatmap03.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step04 .stepImg{background: url(../../images/connectplace/common/heatmap04.png) no-repeat center/contain;}

.heatmap-realTime-area .realTime-step li{display: none; align-items: center; justify-content: center; width: 100px; height: 100px;}
.heatmap-realTime-area .realTime-step li span{width: auto; text-align: center; font-size: 40px; font-weight: 600; color: #fff; letter-spacing: -0.25px;}
.heatmap-realTime-area .realTime-step.step01>ul li:nth-child(1){display: flex; background: url(../../images/connectplace/common/heatmap01.1.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step02>ul li:nth-child(2){display: flex; background: url(../../images/connectplace/common/heatmap02.1.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step03>ul li:nth-child(3){display: flex; background: url(../../images/connectplace/common/heatmap03.1.png) no-repeat center/contain;}
.heatmap-realTime-area .realTime-step.step04>ul li:nth-child(4){display: flex; background: url(../../images/connectplace/common/heatmap04.1.png) no-repeat center/contain;}

.heatmap-realTime-area .stepGage{display: flex; align-items: center;padding-top: 5px; box-sizing:border-box;}
.heatmap-realTime-area .stepGage li{position: relative; width: 100%; text-align: center; height: 25px; line-height: 25px; opacity: 0.5;}
.heatmap-realTime-area .stepGage li.on{opacity: 1;}
.heatmap-realTime-area .stepGage li.on::before{display: inline-block;content: "";position: absolute; top: -12px; left: 50%; transform: translateX(-50%); width: 9px; height: 10px; background:url(../../images/connectplace/common/downArrow.png) no-repeat center/contain;}
.heatmap-realTime-area .stepGage li::after{display: inline-block;content: ""; position: absolute; opacity: 1; right: -1px; top: -5px; width: 1px; height: 4px; background-color: #aaa;}
.heatmap-realTime-area .stepGage li:last-child:after{display: none;}
.heatmap-realTime-area .stepGage li span{text-align: center; font-size: 14px; font-weight: 600; color: #fff; letter-spacing: -0.25px;}
.heatmap-realTime-area .stepGage li:nth-child(1){background:#00d369;}
.heatmap-realTime-area .stepGage li:nth-child(2){background:#ffb100;}
.heatmap-realTime-area .stepGage li:nth-child(3){background:#e76118;}
.heatmap-realTime-area .stepGage li:nth-child(4){background:#dd1f3d;}

.heatmap-manual-wrap .submenu-info-area{width: 100%; padding: 10px; box-sizing: border-box; display: flex; flex-flow: row wrap; align-items: start; gap: 10px;}
.submenu-info-area>span{font-size: 12px; letter-spacing: -0.88px; font-weight: 400; width: 100%; text-align: center;}
.submenu-info-area .heatmap-submenu{width: 180px; height: auto; display: flex; flex-flow: column; gap: 10px;}
.submenu-info-area .heatmap-submenu li{display: flex; flex-flow: column; gap: 10px; align-items: center; justify-content: center; width: 100%;height: 110px; padding: 20px; box-sizing: border-box; background: #fff; box-shadow: 1px 1px 3px rgba(0, 0, 0, .05);}
.submenu-info-area .heatmap-submenu li:hover{cursor: pointer; opacity: 0.85;}
.submenu-info-area .heatmap-submenu li img{display: inline-block;width: 45px;}
.submenu-info-area .heatmap-submenu li span{font-size: 16px; font-weight: 500; letter-spacing: -0.5px; color: #151515;text-align: center;}

.submenu-info-area .timetable{width: calc(100% - 190px); height: 100%; max-height: 240px; background-color: #fff; box-shadow: 1px 1px 3px rgba(0, 0, 0, .05);}
.submenu-info-area .timetable .title{font-size: 16px; font-weight: 500; letter-spacing: -0.5px; color: #151515;text-align: center; margin: 5px 0;}
.submenu-info-area .timetable>ul>li{display: flex; align-items: center; justify-content: center;}
.submenu-info-area .timetable>ul>li.none{display: block; line-height: 1.7; background-color: #e4e5e8; color: #4c5266; font-size: 14px; font-weight: 600; letter-spacing: -0.5px;text-align:center;}
.submenu-info-area .timetable>ul li>div{display: flex; align-items: center; justify-content: center; width: 40px; height: 74px; background-color: #4c5266;}
.submenu-info-area .timetable>ul li>div span{width: min-content; line-height: 1.2; text-align: center; color: #fff; font-size: 15px; font-weight: 500; word-break: break-all;}
.submenu-info-area .timetable>ul ul{width: calc(100% - 40px) ; padding: 5px 10px; box-sizing: border-box;display: flex; flex-flow: column; align-items: center; justify-content:center;}
.submenu-info-area .timetable>ul ul li{display: flex; align-items: center; justify-content: start;}
.submenu-info-area .timetable>ul ul li span{font-size: 14px; color: #2a2a2a; font-weight: 500;}
.submenu-info-area .timetable>ul ul li span.time{border-left: 1px solid #ccc; line-height: 1; padding-left: 15px; margin-left: 15px;}

.detail-heatmap{width: 975px; height: 100%; max-height: 580px;}
.detail-heatmap .cont-wrap{position: relative; width:100%; height: 100%; padding: 30px 40px 40px; box-sizing: border-box;}
.detail-heatmap .cont-wrap .detail-area{width: 100%; height: auto;}
.detail-heatmap .cont-wrap .detail-area .title-box{display: flex; align-items: center; justify-content: space-between;}
.detail-heatmap .cont-wrap .detail-area .title-box div{font-size: 20px; letter-spacing: -1px; font-weight: 600; color: #010101;}
.detail-heatmap .cont-wrap .detail-area .title-box div span{font-size: 14px; letter-spacing: -0.5px; font-weight: 500; color: #777;}
.detail-heatmap .cont-wrap .detail-area .close-btn{position: absolute; top: 30px; right: 40px; width: 16px; height: 16px; background: url(../../images/connectplace/common/close_b.png) no-repeat center/contain; text-indent: -9999px;}
.detail-heatmap .cont-wrap .cont-area{ width: 100%;height: 100%; max-height: 460px;margin-top: 20px;background-color: #fff;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);}
/* 밀집도현황추이 */
.detail-heatmap .cont-wrap.cont01{background-color: #f2f2f2; display: flex; align-items: start; gap: 30px;}
.cont-wrap.cont01 .cont-area .tabHeader{position: relative; display: flex; align-items: center;}
.cont-wrap.cont01 .cont-area .tabHeader li{width: 100%; height: 40px; background: #cdcfd4;}
.cont-wrap.cont01 .cont-area .tabHeader li.on{background-color: #4c5266;}
.cont-wrap.cont01 .cont-area .tabHeader li button{display: inline-block; width: 100%; height: 100%; text-align: center; font-size: 16px; font-weight: 500; letter-spacing: -0.5px; color: #4c5266; }
.cont-wrap.cont01 .cont-area .tabHeader li.on button{color: #fff;}
.cont-wrap.cont01 .cont-area .tabHeader .subTxt{margin-left: auto; font-size: 13px; font-weight: 500; letter-spacing: -0.88px; color: #999;}
.cont-wrap.cont01 .cont-area .chart-area{display: none;width: 100%; height: 425px; padding: 20px; box-sizing: border-box;}
.cont-wrap.cont01 .cont-area .chart-area.on{display: block;}
.cont-wrap.cont01 .cont-area .chart-area .tabHeader li{background-color: #e4e5e8;width: 80px; height: 30px;}
.cont-wrap.cont01 .cont-area .chart-area .tabHeader li button{font-size: 14px; line-height: -0.88px;}
.cont-wrap.cont01 .cont-area .chart-area .tabHeader li.on{background-color: #2287f5;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox{display: none; background-color:#f5f5f5; padding: 20px; box-sizing: border-box;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox.on{display: block;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox h4{display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 600; line-height: 1; color: #101010; letter-spacing: -0.88px;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox h4::before{display: block; content: ""; width: 8px; height: 8px; border-radius: 100%; background: #c9cbd1;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox h4 span{font-size: 14px; font-weight: 400; letter-spacing: -0.88px; color: #2287f5; line-height: 1;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chart{position: relative; width: 100%; height: 150px;}

.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary{margin-top: 30px;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div p{display: flex; align-items: center; justify-content: space-between;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div span{font-size: 16px; color: #333; font-weight: 600; letter-spacing: -0.88px;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div span em{color: #2287f5; font-weight: 600;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div span.subTxt{margin-left: auto; font-size: 13px; font-weight: 500; letter-spacing: -0.88px; color: #999;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary .table{margin-top: 5px; display: flex; align-items: start; gap: 5px;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary .table ul{display: flex;flex-flow: column; gap: 0; width: 50%;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary .table li{background: #dfe0e3; color: #333333; font-size: 16px; font-weight: 600; letter-spacing: -0.88px; text-align: center; line-height: 35px;}
.cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary .table li.tbody{background-color: #fff; letter-spacing: -0.25px;}

/* 대기열 히트맵 및 공간정보 */
.cont-wrap.cont01 .detail-area:nth-child(2){max-width: 400px;margin-left: auto;}
.cont-wrap.cont01 .detail-area:nth-child(2) .cont-area{display: flex; flex-flow: column; align-items: start; gap: 10px; justify-content: space-between; background-color: unset; box-shadow: unset;  height: 465px;}
.cont-wrap.cont01 .heatmap-wrap{position: relative; width: 100%; height: 265px; background: url(../../images/connectplace/common/map.png) no-repeat center/100% auto; box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.1);}
/* 히트맵 */
.cont-wrap.cont01 .heatmap-wrap .heatmap-box{position: absolute; width: 100%; height: 100%; z-index: 1;}
.cont-wrap.cont01 .heatmap-wrap .heatmap-box li.sensor{position: absolute;top: 0; left: 0; width:60px; height: 30px; filter: blur(5px); overflow: hidden;}
.cont-wrap.cont01 .heatmap-wrap .heatmap-box li.sensor div{text-indent: -9999px; width: 100%; height: calc(100% / 3);}
/* 공간 버튼 */
.cont-wrap.cont01 .heatmap-wrap .place-box{position: absolute; width: 100%; height: 100%; z-index: 2; }
.cont-wrap.cont01 .heatmap-wrap .place-box li{position: absolute; top: 0; left: 0; width: 25px; height: 25px; background:linear-gradient(to right, #535e82, #5a6681); border-radius: 3px; }
.cont-wrap.cont01 .heatmap-wrap .place-box li.on{background:linear-gradient(to right, #0f72de, #338ff3);}
.cont-wrap.cont01 .heatmap-wrap .place-box li button{text-indent: -9999px;width: 100%; height: 100%;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place01{top: 70px; left: 50px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place01 button,
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon.place01 button{background: url(../../images/connectplace/common/iconPlace01.png) no-repeat center/12px 12px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place02{top: 30px; left: 210px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place02 button,
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon.place02 button{background: url(../../images/connectplace/common/iconPlace02.png) no-repeat center/12px 8px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place03{top: 190px; left: 250px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place03 button,
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon.place03 button{background: url(../../images/connectplace/common/iconPlace03.png) no-repeat center/11px 13px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place04{top: 100px; left: 210px;}
.cont-wrap.cont01 .heatmap-wrap .place-box li.place04 button,
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon.place04 button{background: url(../../images/connectplace/common/iconPlace04.png) no-repeat center/11px 12px;}
.cont-wrap.cont01 .heatmap-wrap .label-box{position: absolute;z-index: 3; left: 0; bottom: 0; width: 100%; height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 10px; box-sizing: border-box; background-color: #ffffffcc;}
.cont-wrap.cont01 .heatmap-wrap .label-box span{font-size: 13px; letter-spacing: -0.5px;color: #555555; font-weight: 500; white-space: nowrap;}
.cont-wrap.cont01 .heatmap-wrap .label-box .label{width: 100%; height: 12px; border-radius: 100px; text-indent: -9999px; background-image: linear-gradient(to right, #00d369, #ffb100, #e76118, #dd1f3d);}
/* 공간 정보 */
.cont-wrap.cont01 .placeinfo-wrap{position: relative; width: 100%; height: auto; background-color: #fff; box-shadow: 1px 1px 3px rgba(0, 0, 0, .1); padding: 20px; box-sizing: border-box;}
.cont-wrap.cont01 .placeinfo-wrap .info-box{display: none; align-items: start; justify-content: start; gap: 20px;}
.cont-wrap.cont01 .placeinfo-wrap .info-box.on{display: flex;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeImg{display: flex; align-items: center; justify-content: center; overflow: hidden; width: 170px; min-width: 170px; height: 150px;  text-indent: -9999px;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeImg.noImg{text-indent: 0; border: 1px solid rgba(0, 0, 0, .1); color: #999; font-size: 13px; font-weight: 500; line-height: 1.2; letter-spacing: -0.5px; }
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeImg img{display: block; width: 100%;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail h5{font-size: 17px; font-weight: 600; letter-spacing: -0.5px; color: #000;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon{position: absolute; right: 20px; top: 20px; width: 25px; height: 25px; border-radius: 3px; background:linear-gradient(to right, #0f72de, #338ff3);}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon button{width: 100%; height: 100%; cursor: default; opacity: 1; text-indent: -9999px;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .sub01{font-size: 14px; letter-spacing: -0.88px; font-weight: 400; color: #1382f4; line-height: 1.2;}
.cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .sub02{position: absolute; left: 210px; bottom: 20px; font-size: 14px; font-weight: 400; color: #555; letter-spacing: -0.88px; line-height: 1.2;}
/* 식단표안내 */
.detail-heatmap .cont-wrap.cont02{display: none; background-color: #fffaee;}
.detail-heatmap .cont-wrap.cont02 .cont-area{overflow: auto; }
.detail-heatmap .cont-wrap.cont02 .cont-area img{width: 100%;}
/* 이용가이드 */
.detail-heatmap .cont-wrap.cont03{display: none; background-color: #fffaee;}
.detail-heatmap .cont-wrap.cont03 .cont-area{display: flex; align-items: start; justify-content: center;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box{position: relative; width: 50%; height: 100%; padding: 60px 30px 30px; box-sizing: border-box;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box:nth-child(2)::before{position: absolute; left: 0; display: block; content: ""; width: 1px; height: calc(100% - 90px); border-left: 1px dotted #face66;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box .title{position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 150px; padding: 0 30px 7px; box-sizing:border-box; text-align: center; font-size: 18px; letter-spacing: -1px; font-weight: 600; color:#ff9600; background-color: #fffaee; border-radius: 0 0 33px 33px;}

.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide{display: flex; flex-flow:column; align-items: start; justify-content: space-between; height: 100%;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li{display: flex; align-items: start; justify-content: start; gap: 25px;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .icon-box{display: flex; align-items:center; justify-content: center; width: 135px; height: 105px; border-radius: 10px; background-color: #eeeeee; padding: 12px; box-sizing:border-box;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .icon-box img{display: block; width: 70px;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .txt-box{padding: 5px 0; box-sizing: border-box;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .txt-box div{font-size: 18px; font-weight: 700; color: #5a6681; letter-spacing: -0.5px; margin-bottom: 10px;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .txt-box span{font-size: 16px; font-weight: 400; color: #858585; letter-spacing: -0.88px; word-break: keep-all;line-height: 1;}

.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.etiquette{display: flex; flex-flow: row wrap; align-items: center; justify-content:space-between; gap: 10px; height: 100%;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.etiquette li{width: calc((100% - 10px)/2); height: auto;}
.detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.etiquette li img{width: 100%;}

/* 서브메뉴 공통 */
.restroom-pop-bg, .headtmap-pop-bg,
.focusroom-pop-bg, .chair-pop-bg, .air-pop-bg,
.perfume-pop-bg, .locker-pop-bg {
    display: none; position: absolute; z-index: 88888; top: 0; left: 0; min-width: unset; width: 100vw; height: 100vh;
    min-height: 900px; text-indent: -9999px; background-color: rgba(0, 0, 0, 0.07);
}

.focusroom-pop-wrap, .restroom-pop-wrap, .heatmap-pop-wrap,
.locker-pop-wrap, .perfume-pop-wrap,
.air-pop-wrap, .chair-pop-wrap { width: auto; max-width: 1500px; min-width: 1200px; margin: 0 auto; transform: translate(-50%, -50%); }

.focusroom-pop-area .focusroom-pop-container,
.chair-pop-area .chair-pop-container,
.air-pop-area .air-pop-container,
.perfume-pop-area .perfume-pop-container,
.locker-pop-area .locker-pop-container,
.restroom-pop-area .restroom-pop-container,
.restroom-pop-area2 .restroom-pop-container2,
.heatmap-pop-area .heatmap-pop-container
{ position: relative; width: 100%; margin: 0 auto; overflow: hidden;
    border: 0; background-color: #fff; height: 720px;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
}

.restroom-pop-container .pop-cont.linebldg,
.restroom-pop-container .pop-cont,.heatmap-pop-container .pop-cont,
.focusroom-pop-container .pop-cont,
.chair-pop-container .pop-cont,
.air-pop-container .pop-cont,
.perfume-pop-container .pop-cont,
.locker-pop-container .pop-cont,
.restroom-pop-container2 .pop-cont {
    position: relative; width: 100%; overflow: hidden; box-sizing: border-box; -webkit-box-sizing: border-box;
    display: flex; justify-content: space-between; align-items: start;
    padding: 40px; height: calc(100% - 60px);
}
.focusroom-pop-container .pop-head,
.restroom-pop-container .pop-head,.heatmap-pop-container .pop-head,
.chair-pop-container .pop-head,
.air-pop-container .pop-head,
.perfume-pop-container .pop-head,
.locker-pop-container .pop-head { position: relative; background: #4c5266;width: 100%; height: 60px; }

.focusroom-pop-area .pop-close,
.chair-pop-area .pop-close,
.air-pop-area .pop-close,
.perfume-pop-area .pop-close,
.locker-pop-area .pop-close,
.restroom-pop-area .pop-close,
.restroom-pop-area2 .pop-close,
.heatmap-pop-area .pop-close {
    position: absolute; box-sizing: border-box; -webkit-box-sizing: border-box; font-size: 14px; font-weight: 500; line-height: 35px;
    z-index: 100; background-color: transparent; top: 10px; right: 30px; width: 40px; height: 40px; padding: 0; }

.focusroom-pop-area .pop-close a,
.chair-pop-area .pop-close a,
.air-pop-area .pop-close a,
.perfume-pop-area .pop-close a,
.locker-pop-area .pop-close a,
.restroom-pop-area .pop-close a,
.restroom-pop-area2 .pop-close a,
.heatmap-pop-area .pop-close a {
    display: flex; color: #fff; width: 100%; height: 100%;
    background: url(../../images/icon/icon_close2.png) no-repeat center/16px; transition: all .4s; transform: translateY(0); }

.focusroom-pop-area .pop-close:hover a,
.chair-pop-area .pop-close:hover a,
.air-pop-area .pop-close:hover a,
.perfume-pop-area .pop-close:hover a,
.locker-pop-area .pop-close:hover a,
.restroom-pop-area .pop-close:hover a,
.restroom-pop-area2 .pop-close:hover a,
.heatmap-pop-area .pop-close:hover a  { cursor: pointer; transform: translateY(0) rotate(180deg); transition: all .4s; }

.focusroom-pop-area .pop-close span,
.chair-pop-area .pop-close span,
.air-pop-area .pop-close span,
.perfume-pop-area .pop-close span,
.locker-pop-area .pop-close span,
.restroom-pop-area .pop-close span,
.restroom-pop-area2 .pop-close span,
.heatmap-pop-area .pop-close span { display: none;}

.focusroom-pop-area .pop-close img,
.chair-pop-area .pop-close img,
.air-pop-area .pop-close img,
.perfume-pop-area .pop-close img,
.locker-pop-area .pop-close img,
.restroom-pop-area .pop-close img,
.restroom-pop-area2 .pop-close img,
.heatmap-pop-area .pop-close img { width: 25px; height: 25px; margin: 0; display: none; }

.focusroom-pop-container .pop-cont .cont-focusroom-map,
.chair-pop-container .pop-cont .cont-chair-map,
.air-pop-container .pop-cont .cont-air-map,
.perfume-pop-container .pop-cont .cont-perfume-map,
.locker-pop-container .pop-cont .cont-locker-map {
    width: 980px; height: 100%; background-color: #fff; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; padding: 0; }

.cont-focusroom-map .focusroom-map-wrap,
.cont-chair-map .chair-map-wrap,
.cont-air-map .air-map-wrap,
.cont-perfume-map .perfume-map-wrap,
.cont-locker-map .locker-map-wrap{
    height: 100%;}

.focusroom-pop-wrap,
.chair-pop-wrap,
.perfume-pop-wrap,
.air-pop-wrap,
.locker-pop-wrap,
.heatmap-pop-wrap {
    display: none; position: absolute; z-index: 99999; top: 50%; left: 50%;}


.focusroom-pop-wrap .focusroom-pop-area,
.chair-pop-wrap .chair-pop-area,
.perfume-pop-wrap .perfume-pop-area,
.air-pop-wrap .air-pop-area,
.locker-pop-wrap .locker-pop-area { display: flex; flex-flow: column wrap; width: 100%}


.focusroom-map-wrap .floor.hide,
.chair-map-wrap .floor.hide,
.perfume-map-wrap .floor.hide,
.air-map-wrap .floor.hide,
.locker-map-wrap .floor.hide { display: none; }

.focusroom-map-wrap .map,
.chair-map-wrap .map,
.air-map-wrap .map,
.perfume-map-wrap .map,
.locker-map-wrap .map {
    width: 100%; height: 100%; padding: 30px; box-sizing: border-box; background-position: center; background-size: cover;
    text-align: right; font-size: 40px; font-weight: 500; color: #fff;
    position: relative; border: 1px solid rgba(0, 0, 0, 0.05); }

.focusroom-map-wrap .floor,
.chair-map-wrap .floor,
.air-map-wrap .floor,
.perfume-map-wrap .floor,
.locker-map-wrap .floor {
    position: absolute; right: 20px; top: 20px; z-index: 10; float: unset; padding: 0;
    width:42px; height: 42px; font-size: 20px; text-align: center; line-height: 42px; border-radius: 30px;
    font-weight: bold; letter-spacing: -0.88px; color: #1382f4; background-color: #E7F2FE; }

.focusroom-pop-container .pop-cont .cont-focusroom,
.chair-pop-container .pop-cont .cont-chair,
.air-pop-container .pop-cont .cont-air,
.perfume-pop-container .pop-cont .cont-perfume,
.locker-pop-container .pop-cont .cont-locker { margin-left: 0; }

.focusroom-map-wrap .focusroom-info-area,
.chair-map-wrap .chair-info-area,
.air-map-wrap .air-info-area,
.perfume-map-wrap .perfume-info-area,
.locker-map-wrap .locker-info-area { background-color: #00000075; border-radius: 10px; }

.focusroom-info-area .title,
.chair-info-area .title,
.air-info-area .title,
.perfume-info-area .title,
.locker-info-area .title { font-weight: 600; color: #fff; margin-top: -4px; font-size: 18px; }

.focusroom-info-area .title::before,
.chair-info-area .title::before,
.air-info-area .title::before,
.perfume-info-area .title::before,
.locker-info-area .title::before {display: none;}

.focusroom-info-area .focusroom_info,
.chair-info-area .chair_info,
.air-info-area .air_info{
    display: flex; align-items: center; margin-top: 5px; background-color: #fff; padding: 10px 12px; border-radius: 5px; }

.cont-focusroom .focusroom-floor-wrap,
.cont-chair .chair-floor-wrap,
.cont-air .air-floor-wrap,
.cont-perfume .perfume-floor-wrap,
.cont-locker .locker-floor-wrap {
    display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; width: 100%; padding: 20px 30px; box-sizing: border-box;
    background: unset; background-image: linear-gradient(to top, #1382f5, #5aa7f7); margin-bottom: 0; }

.focusroom-pop-container .pop-cont .cont-focusroom-floor,
.air-pop-container .pop-cont .cont-air,
.chair-pop-container .pop-cont .cont-chair,
.perfume-pop-container .pop-cont .cont-perfume,
.locker-pop-container .pop-cont .cont-locker {
    width: 445px; height: 100%; box-sizing: border-box; overflow: hidden;}

.chair-floor-wrap .chair-floor-area,
.air-floor-wrap .air-floor-area,
.perfume-floor-wrap .perfume-floor-area,
.locker-floor-wrap .locker-floor-area { width: 35%; border-right: 1px solid rgba(999, 999, 999, 0.2); }

.focusroom-floor-area .title,
.focusroom-floor-select-area .title,
.chair-floor-area .title,
.chair-floor-select-area .title,
.air-floor-area .title,
.air-floor-select-area .title,
.perfume-floor-area .title,
.perfume-floor-select-area .title,
.locker-floor-area .title,
.locker-floor-select-area .title {
    display: -webkit-box; -webkit-box-align: center; height: 20px; margin-top: 0; border: 0; font-size: 16px;
    color: #fff; font-weight: 500; }

.locker-floor-area .floor,
.air-floor-area .floor,
.chair-floor-area .floor,
.perfume-floor-area .floor{
    width: 100%; height: 50px; line-height: 55px; margin-top: 7px; text-align: center; font-size: 50px; font-weight: 600; color: #fff;
}
.chair-floor-wrap .chair-floor-select-area ,
.locker-floor-wrap .locker-floor-select-area,
.perfume-floor-wrap .perfume-floor-select-area,
.air-floor-wrap .air-floor-select-area {
    position: relative; display: flex; flex-flow: column wrap; justify-content: space-between; width: 60%; height: auto;
}

.focusroom-floor-select-area button,
.chair-floor-select-area button,
.air-floor-select-area button,
.perfume-floor-select-area button,
.locker-floor-select-area button {
    width: 100%; height: 50px; margin-top: 10px; font-size: 16px; text-align: center;
    background-image: url(../../images/connectplace/common/ico_triangle_down.svg); background-size: 8px; background-repeat: no-repeat; background-position: 92% center;
    background-color: transparent; color: #fff; border: 1px solid rgba(999, 999, 999, 0.5); outline: 0; }

.focusroom-floor-select-area button:active,
.chair-floor-select-area button:active,
.air-floor-select-area button:active,
.perfume-floor-select-area button:active,
.locker-floor-select-area button:active { outline: 0; }

.focusroom-floor-select-area button.click,
.perfume-floor-select-area button.click,
.air-floor-select-area button.click,
.locker-floor-select-area button.click,
.chair-floor-select-area button.click { background-image: url(../../images/connectplace/common/ico_triangle_up.svg); }

.focusroom-floor-select-area .focusroom-floor-select,
.chair-floor-select-area .chair-floor-select,
.air-floor-select-area .air-floor-select,
.perfume-floor-select-area .perfume-floor-select,
.locker-floor-select-area .locker-floor-select {
    position: absolute; width: 100%; height: auto; top: 80px; z-index: 1; margin-top: 7px;
    overflow-x: hidden; overflow-y: auto; box-sizing: border-box;
    box-shadow: 2px 5px 5px #33333350; -webkit-box-shadow: 2px 5px 5px #33333350;
    background-color: #fff; max-height: 180px; padding: 0; }

.focusroom-floor-select.hide,
.perfume-floor-select.hide,
.chair-floor-select.hide,
.air-floor-select.hide,
.locker-floor-select.hide{ display: none; }

.focusroom-floor-select::-webkit-scrollbar,
.chair-floor-select::-webkit-scrollbar,
.air-floor-select::-webkit-scrollbar,
.locker-floor-select::-webkit-scrollbar,
.perfume-floor-select::-webkit-scrollbar { width: 5px; }

.focusroom-floor-select::-webkit-scrollbar-thumb,
.chair-floor-select::-webkit-scrollbar-thumb,
.air-floor-select::-webkit-scrollbar-thumb,
.locker-floor-select::-webkit-scrollbar-thumb,
.perfume-floor-select::-webkit-scrollbar-thumb { background-color: #333; }

.focusroom-floor-select::-webkit-scrollbar-track,
.chair-floor-select::-webkit-scrollbar-track,
.air-floor-select::-webkit-scrollbar-track,
.locker-floor-select::-webkit-scrollbar-track,
.perfume-floor-select::-webkit-scrollbar-track { background-color: none; }

.focusroom-floor-select li,
.chair-floor-select li,
.air-floor-select li,
.perfume-floor-select li,
.locker-floor-select li { font-size: 22px; color: #4c5266; font-weight: 600; border-bottom: 0; }

.focusroom-floor-select li.click,
.chair-floor-select li.click,
.air-floor-select li.click,
.perfume-floor-select li.click,
.locker-floor-select li.click { color: #1382f4; }

.focusroom-floor-select li:hover,
.chair-floor-select li:hover,
.air-floor-select li:hover,
.perfume-floor-select li:hover,
.locker-floor-select li:hover { background-color: #F8F8FA; color: #1382f4; }

.cont-focusroom .focusroom-manual-wrap,
.cont-chair .chair-manual-wrap,
.cont-air .air-manual-wrap,
.cont-perfume .perfume-manual-wrap,
.cont-locker .locker-manual-wrap { font-family: 'Pretendard', Arial, sans-serif !important; font-weight: 500; color: #4c5266; background: unset; background-color: #fff; box-sizing: border-box; padding: 0; border-right: 1px solid rgba(0, 0, 0, 0.05); border-bottom: 1px solid rgba(0, 0, 0, 0.05); height: calc(100% - 120px); width: 100%; position: relative; }

.focusroom-manual-wrap .title,
.chair-manual-wrap .title,
.air-manual-wrap .title,
.perfume-manual-wrap .title,
.locker-manual-wrap .title { line-height: 25px; font-family: 'Pretendard', Arial, sans-serif !important; font-weight:600; color: #5a6681; letter-spacing: -1px; padding: 10px; box-sizing: border-box; text-align: center; margin-bottom: 0; font-size: 18px; }

.focusroom-manual-wrap .title .point,
.chair-manual-wrap .title .point,
.air-manual-wrap .title .point,
.perfume-manual-wrap .title .point,
.locker-manual-wrap .title .point { color: #1382f4; font-weight: 600; font-size: 18px; }

.focusroom-manual-wrap .explain,
.chair-manual-wrap .explain,
.cont-air .air-manual-wrap .explain,
.cont-perfume .perfume-manual-wrap .explain,
.cont-locker .locker-manual-wrap .explain { font-size: 13px; line-height: 1.5; font-weight: 400; }

.chair-info-area .close,
.air-info-area .close,
.perfume-info-area .close,
.locker-info-area .close {
    text-indent: -9999px; position: absolute; right: 15px; top: 15px; display: inline-block; width: 14px; height: 14px; background-image: url(../../images/icon/icon_close2.png);
    background-repeat: no-repeat; background-size: contain; cursor: pointer; transform: translateY(0); transition: all .4s; }

.chair-info-area .close:hover,
.air-info-area .close:hover,
.perfume-info-area .close:hover,
.locker-info-area .close:hover { transform: translateY(0) rotate(180deg); transition: all .4s; }

.manual_bg { display: none; }

@media(max-width:1600px) and (min-width:0) { /* 메인 화면 : 서브메뉴 */
    .maincontant__section__list--submenu {height: 90px; padding: 10px 40px; margin-top: 30px !important;box-sizing: border-box; }

    .maincontant__section__list--submenu .submenu_inner > li img {display: block;width: 40px;margin: 0 auto; }

    .maincontant__section__list--submenu .submenu_inner > li span {display: block;text-align: center;font-size: 15px;margin-top: 0; }

    .maincontant__section__list--submenu .submenu_inner li:hover {opacity: 0.8 !important; }

    /* 1600* 스마트화장실 */
    .restroom-pop-container .pop-cont .cont-restroom-tutorial{margin-top: 15px;}
    .cont-restroom-tutorial .tutorial.linebldg{width: 310px; height: 495px;}
    .restroom-pop-container .pop-cont .cont-restroom-info.linebldg, .restroom-pop-container .pop-cont .cont-restroom-info{width: calc(100% - 350px); min-height: 490px;}
    .total-restroom-info-area .legend_info.linebldg{top: -10px;}
    .total-restroom-info-area .legend_info li span, .total-restroom-info-area .legend_info li span.linebldg{font-size: 14px;}

    .restroom-info-area .restroom_info{height: 452px;}
    .cont-restroom-info .restroom-info-wrap.linebldg{margin-top: 15px; height: 490px;}
    .restroom-info-area .title.linebldg{height: 40px;}
    .restroom-info-area .title>span {height: 40px; line-height: 40px; font-size: 18px;}
    .restroom-info-area .title.linebldg .count .use{font-size: 26px;}
    .restroom-info-area .title.linebldg .count .total{font-size: 16px;}
    .restroom-info-area .title.linebldg .count .total span{font-size: 18px;}

    .restroom-info-wrap .floor-info-area.linebldg{padding-top: 40px;}
    .restroom-info-wrap .floor-info-area.linebldg .floor{font-size: 20px;}
    .restroom_info .restroom.linebldg, .restroom-info-wrap .floor-info-area.linebldg .floor{max-height: 55px;}
    .restroom_info .restroom .women.off, .restroom_info .restroom .men.off{font-size: 19px;}
    .restroom_info .restroom .women.on, .restroom_info .restroom .men.on{font-size: 19px;}

    /* 1600 포커스룸 */
    .focusroom-pop-area .pop-close {padding: 3px 15px;line-height: 30px; }

    .focusroom-pop-area .pop-close img {width: 20px;height: 20px;margin-left: 7px;margin-top: 5px; }

    .focusroom-pop-area .focusroom-pop-container {height: 570px; }

    .focusroom-pop-container .pop-head .head_title .title {font-size: 25px;line-height: 140%; }

    .focusroom-pop-container .pop-cont {padding: 20px; }

    .focusroom-pop-container .pop-cont .cont-focusroom-map {width: 860px;padding: 15px; }

    .focusroom-map-wrap .map {padding: 20px;background-repeat: no-repeat;font-size: 25px; }

    .focusroom-map-wrap .floor {padding: 20px 20px 0 0;font-size: 25px;line-height: 25px; }

    .focusroom-map-wrap .focusroom-map-area {margin: -72px 0 0 45px; }

    .focusroom-map-area div {margin-left: 6px;background-size: 50px;width: 50px;height: 50px; }

    .focusroom-map-wrap .focusroom-info-area {top: 246px;padding: 10px; }

    .focusroom-info-area.focusroom1 {left: 65px; }

    .focusroom-info-area.focusroom2 {left: 122px; }

    .focusroom-info-area.focusroom3 {left: 178px; }

    .focusroom_info img {width: 66px;height: 66px; }

    .focusroom_info ul li:first-child {font-size: 22px;line-height: 32px; }

    .focusroom_info ul li {font-size: 14px; }

    .focusroom-pop-container .pop-cont .cont-focusroom-floor {width: 290px;margin-left: 15px;padding: 15px 20px; }

    .cont-focusroom-floor .focusroom-floor-wrap {height: 90px; }

    .focusroom-floor-wrap .focusroom-floor-area {height: 50px; }

    .focusroom-floor-area li {font-size: 25px;line-height: 50px; }

    .focusroom-floor-wrap .title {height: 30px;font-size: 12px;line-height: 30px; }

    /* 1600 안마의자/리클라이너 */
    .chair-pop-area .pop-close {padding: 3px 15px;line-height: 30px; }

    .chair-pop-area .pop-close img {width: 20px;height: 20px;margin-left: 7px;margin-top: 5px; }

    .chair-pop-area .chair-pop-container {height: 570px; }

    .chair-pop-container .pop-head .head_title .title {font-size: 25px;line-height: 140%; }

    .chair-pop-container .pop-cont {padding: 20px; }

    .chair-pop-container .pop-cont .cont-chair-map {width: 860px; }

    .chair-map-wrap .map {padding: 20px;background-repeat: no-repeat;font-size: 25px; }

    .chair-map-wrap .chair-map-area {margin: -93px 0 0 187px;width: 36px; }

    .chair-map-area div {margin-left: 6px;background-size: 50px;width: 36px;height: 36px; }

    .chair-map-wrap .chair-info-area {left: 253px;padding: 10px; }

    .chair-info-area.chair1 {top: 298px; }

    .chair-info-area.chair2 {top: 334px; }

    .chair-info-area .title {font-size: 14px;margin-top: -2px; }

    .chair-info-area .close {right: 10px;top: 12px;width: 12px;height: 12px; }

    .chair_info img {width: 40px;height: 40px; }

    .chair_info ul li {font-size: 18px;line-height: 40px; }

    .cont-chair .chair-floor-wrap {padding: 10px 20px; }

    .chair-floor-area .title {height: 15px;font-size: 12px; }

    .chair-floor-area .floor {height: 40px;line-height: 40px;margin-top: 5px;font-size: 40px; }

    .chair-floor-select-area .title {height: 15px;font-size: 12px; }

    .chair-floor-select-area button {height: 40px;margin-top: 7px;font-size: 14px; }

    .chair-floor-select-area .chair-floor-select {max-height: 180px;top: 60px;z-index: 1;padding: 5px 20px;margin-top: 7px; }

    .chair-floor-select li {height: 40px;line-height: 40px;font-size: 20px; }

    .cont-chair .chair-manual-wrap {height: 383px; padding-top: 0; }

    .chair-manual-wrap .title {font-size: 14px;line-height: 23px;margin-bottom: 5px; padding: 20px 0 10px; }

    .chair-manual-wrap .title .point {font-size: 18px; }

    .chair-manual-wrap .title .point span {font-size: 11px; }

    .chair-manual-wrap .subtitle {font-size: 12px;line-height: 18px; margin: 0; }

    .chair-manual-wrap .explain { padding: 15px; font-size: 11px; line-height: 2; word-break: keep-all; margin-top: unset; }
    .chair-manual-wrap .explain br { display: none; }

    /* 1600 공기질센서 */
    .air-pop-area .pop-close {line-height: 30px; }

    .air-pop-area .pop-close img {width: 20px;height: 20px;margin-left: 7px;margin-top: 5px; }

    .air-pop-area .air-pop-container {height: 570px; }

    .air-pop-container .pop-head .head_title .title {font-size: 25px;line-height: 140%; }

    .air-pop-container .pop-cont {padding: 20px; }

    .air-pop-container .pop-cont .cont-air-map {width: 860px; }

    .air-map-wrap .map {padding: 20px;background-repeat: no-repeat;font-size: 25px; }

    .air-map-area div.air1 {top: 385px;left: 540px; }

    .air-map-area div.air2 {top: 200px;left: 590px; }

    .air-map-area div.air3 {top: 385px;left: 455px; }

    .air-map-area div.air4 {top: 285px;left: 160px; }

    .air-map-area div.air5 {top: 75px;left: 195px; }

    .air-map-area div.air6 {top: 125px;left: 560px; }

    .air-map-area div.air7 {top: 392px;left: 202px; }

    .air-map-area div.air8 {top: 183px;left: 210px; }

    .air-map-area div.air9 {top: 183px;left: 120px; }

    .air-map-area div.air10 {top: 40px;left: 470px; }

    .air-map-area div.air11 {top: 40px;left: 580px; }

    .air-map-area div.f7.air4 {top: 55px;left: 140px; }

    .air-map-area div.f7.air5 {top: 55px;left: 200px; }

    .air-map-area div.f7.air6 {top: 55px;left: 255px; }

    .air-map-area div.f7.air7 {top: 40px;left: 470px; }

    .air-map-area div.f7.air8 {top: 40px;left: 580px; }

    .air-map-area div.f7.air9 {top: 220px;left: 170px; }

    .air-map-area div.f7.air10 {top: 130px;left: 575px; }

    .air-map-area div.f7.air11 {top: 392px;left: 50px; }

    .air-map-area div.f7.air12 {top: 392px;left: 100px; }

    .air-map-area div.f7.air13 {top: 392px;left: 150px; }

    .air-map-area div.f7.air14 {top: 195px;left: 437px; }

    .air-map-area div.f7.air15 {top: 229px;left: 437px; }

    .air-map-area div.f7.air16 {top: 263px;left: 437px; }

    .air-map-area div.f7.air17 {top: 392px;left: 202px; }

    .air-map-area div.f11.air1 {top: 285px;left: 160px; }

    .air-map-area div.f11.air2 {top: 75px;left: 195px; }

    .air-map-area div.f11.air3 {top: 183px;left: 210px; }

    .air-map-area div.f11.air4 {top: 183px;left: 120px; }

    .air-map-area div.f12.air1 { top: 124px; left: 178px; }

    .air-map-area div.f12.air2 { top: 90px; left: 547px; }

    .air-map-area div.f12.air3 { top: 385px; left: 455px; }

    .air-map-area div.f12.air4 { top: 195px; left: 437px; }

    .air-map-area div.f12.air5 { top: 229px; left: 437px; }

    .air-map-area div.f12.air6 { top: 263px; left: 437px; }

    .air-map-area div.f12.air7 { top: 385px; left: 540px; }

    .air-map-area div.f12.air8 { top: 200px; left: 590px; }

    .air-map-area div.f16.air1 {top: 210px;left: 410px; }

    .air-map-area div.f16.air2 {top: 72px;left: 728px; }

    .air-map-area div.f16.air3 {top: 267px;left: 410px; }

    .air-map-area div.f16.air4 {top: 267px;left: 480px; }

    .air-map-area div.f16.air5 {top: 145px;left: 435px; }

    .air-map-area div.f16.air6 {top: 96px;left: 115px; }

    .air-map-area div.f16.air7 {top: 62px;left: 318px; }

    .air-map-area div.f16.air8 {top: 65px;left: 643px; }

    .air-map-area div.f16.air9 {top: 145px;left: 632px; }

    .air-map-area div.f16.air10 {top: 230px;left: 620px; }

    .air-map-area div.f17.air1 {top: 218px;left: 627px; }

    .air-map-area div.f17.air2 {top: 60px;left: 290px; }

    .air-map-area div.f17.air3 {top: 90px;left: 670px; }

    .air-map-area div.f17.air4 {top: 60px;left: 543px; }

    .air-map-wrap .air-info-area {padding: 10px 12px; }

    .air-info-area.air1 {top: 196px;left: 445px; }

    .air-info-area.air1.valueless {top: 216px; }

    .air-info-area.air2 {top: 125px;left: 342px; }

    .air-info-area.air3 {top: 196px;left: 360px; }

    .air-info-area.air3.valueless {top: 216px; }

    .air-info-area.air4 {top: 205px;left: 208px; }

    .air-info-area.air5 {top: 30px;left: 243px; }

    .air-info-area.air6 {top: 45px;left: 312px; }

    .air-info-area.air7 {top: 203px;left: 105px; }

    .air-info-area.air7.valueless {top: 223px; }

    .air-info-area.air8 {top: 225px;left: 120px; }

    .air-info-area.air9 {top: 225px;left: 30px; }

    .air-info-area.air10 {top: 82px;left: 370px; }

    .air-info-area.air11 {top: 82px;left: 485px; }

    .air-info-area.f7.air4 {top: 97px;left: 40px; }

    .air-info-area.f7.air5 {top: 97px;left: 100px; }

    .air-info-area.f7.air6 {top: 97px;left: 155px; }

    .air-info-area.f7.air7 {top: 82px;left: 370px; }

    .air-info-area.f7.air8 {top: 82px;left: 485px; }

    .air-info-area.f7.air9 {top: 140px;left: 218px; }

    .air-info-area.f7.air10 {top: 55px;left: 327px; }

    .air-info-area.f7.air11 {top: 203px;left: 30px; }

    .air-info-area.f7.air11.valueless {top: 223px; }

    .air-info-area.f7.air12 {top: 203px;left: 55px; }

    .air-info-area.f7.air12.valueless {top: 223px; }

    .air-info-area.f7.air13 {top: 203px;left: 80px; }

    .air-info-area.f7.air13.valueless {top: 223px; }

    .air-info-area.f7.air14 {top: 115px;left: 485px; }

    .air-info-area.f7.air15 {top: 149px;left: 485px; }

    .air-info-area.f7.air16 {top: 183px;left: 485px; }

    .air-info-area.f7.air17 {top: 203px;left: 105px; }

    .air-info-area.f7.air17.valueless {top: 223px; }

    .air-info-area.f11.air1 {top: 205px;left: 208px; }

    .air-info-area.f11.air2 {top: 30px;left: 243px; }

    .air-info-area.f11.air3 {top: 225px;left: 120px; }

    .air-info-area.f11.air4 {top: 225px;left: 30px; }

    .air-info-area.f12.air1 {top: 166px;left: 88px; }

    .air-info-area.f12.air2 {top: 132px;left: 457px; }

    .air-info-area.f12.air3 {top: 196px;left: 360px; }

    .air-info-area.f12.air3.valueless {top: 216px; }

    .air-info-area.f12.air4 {top: 115px;left: 485px; }

    .air-info-area.f12.air5 {top: 149px;left: 485px; }

    .air-info-area.f12.air6 {top: 183px;left: 485px; }

    .air-info-area.f12.air7 {top: 196px;left: 445px; }

    .air-info-area.f12.air7.valueless {top: 216px; }

    .air-info-area.f12.air8 {top: 125px;left: 342px; }

    .air-info-area.f16.air1 {top: 130px;left: 458px; }

    .air-info-area.f16.air2 {top: 30px;left: 480px; }

    .air-info-area.f16.air3 {top: 187px;left: 458px; }

    .air-info-area.f16.air4 {top: 187px;left: 528px; }

    .air-info-area.f16.air5 {top: 65px;left: 483px; }

    .air-info-area.f16.air6 {top: 138px;left: 35px; }

    .air-info-area.f16.air7 {top: 104px;left: 228px; }

    .air-info-area.f16.air8 {top: 30px;left: 395px; }

    .air-info-area.f16.air9 {top: 65px;left: 384px; }

    .air-info-area.f16.air10 {top: 150px;left: 372px; }

    .air-info-area.f17.air1 {top: 138px;left: 379px; }

    .air-info-area.f17.air2 {top: 102px;left: 200px; }

    .air-info-area.f17.air3 {top: 30px;left: 422px; }

    .air-info-area.f17.air4 {top: 102px;left: 453px; }

    .air-info-area .title {font-size: 15px;margin-top: -2px; }

    .air-info-area .close {right: 12px;top: 12px;width: 12px;height: 12px; }

    .air-info-area .status {font-size: 14px;margin-right: 21px;margin-top: -3px; }

    .air-info-area .progressbar-wrap {height: 20px; }

    .progressbar-wrap .arrow {height: 5px;width: 165px; }

    .progressbar-wrap .arrow img {width: 6px;margin-bottom: 16px; }

    .progressbar-area .progressbar-info {max-width: 165px;margin: 3px 0;height: 8px; }

    .progressbar-area .figure {width: 50px;font-size: 14px;margin-left: 5px;line-height: 11px; }

    .air-info-area .air_info {padding: 8px 10px;max-width: 210px;margin-top: 3px; }

    .air_info ul li {font-size: 12px;line-height: 17px; }

    .air_info ul li .name > .dot {width: 8px;height: 8px;margin-right: 8px; }

    .air_info ul li .value {margin-left: 30px; }

    .air_info ul li .value .unit {width: 30px; }

    .cont-air .air-floor-wrap {padding: 10px 20px; }

    .air-floor-area .title {height: 15px;font-size: 12px; }

    .air-floor-area .floor {height: 40px;line-height: 40px;margin-top: 5px;font-size: 40px; }

    .air-floor-select-area .title {height: 15px;font-size: 12px; }

    .air-floor-select-area button {height: 40px;margin-top: 7px;font-size: 14px; }

    .air-floor-select-area .air-floor-select {max-height: 180px;top: 60px;z-index: 1;padding: 5px 20px;margin-top: 7px; }

    .air-floor-select li {height: 40px;line-height: 40px;font-size: 20px; }

    .air-manual-wrap .manual_bg img {display: inline-block;width: 85%;/* float: right; */}

    .air-manual-wrap .title .point {font-size: 18px; }

    .air-manual-wrap ul {font-size: 13px;line-height: 20px; }

    .air-manual-wrap ul.explain1 li { padding: 7px 0; gap: 10px; justify-content: center; }
    .air-manual-wrap ul.explain1 li:last-child { padding: 5px 0; justify-content: center; font-size: 12px; }
    .air-manual-wrap ul.explain1 li img { display: none; }

    .air-manual-wrap .subtitle {height: 23px;line-height: 23px;font-size: 12px; }

    .air-manual-wrap .subtitle-cont {font-size: 11px;margin-top: 8px; }

    .air-manual-wrap ul.explain2 { margin-top: 5px; flex-flow: row wrap; justify-content: start; align-items: start; }
    .air-manual-wrap ul.explain2 li { flex-flow: column; padding: 10px 0; width: 50%; gap: 5px; }
    .air-manual-wrap ul.explain2 li>div:nth-child(2) { padding: 0 20px; background: unset; text-align: center; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; word-break: keep-all; }
    .air-manual-wrap .imp { font-size: 11px; margin-right: 10px; }

    /* 1600* 향기캡슐 */
    .perfume-pop-area .pop-close {padding: 3px 15px;line-height: 30px; }

    .perfume-pop-area .pop-close img {width: 20px;height: 20px;margin-left: 7px;margin-top: 5px; }

    .perfume-pop-area .perfume-pop-container {height: 570px; }

    .perfume-pop-container .pop-head .head_title .title {font-size: 25px;line-height: 140%; }

    .perfume-pop-container .pop-cont {padding: 20px; }

    .perfume-map-wrap .map {padding: 20px;background-repeat: no-repeat;font-size: 25px; }

    .perfume-map-area div {font-size: 15px;line-height: 35px;height: 35px !important; padding: 0 15px; white-space: nowrap; }

    .perfume-map-area div.perfume1 {top: 200px;left: 585px; }

    .perfume-map-area div.perfume2 {top: 382px;left: 511px; }

    .perfume-map-area div.perfume3 {top: 382px;left: 430px; }

    .perfume-map-area div.perfume4 {top: 37px;left: 556px; }

    .perfume-map-area div.f7.perfume3 {top: 382px;left: 423px; }

    .perfume-map-area div.f7.perfume4 {top: 37px;left: 100px; }

    .perfume-map-area div.f7.perfume5 {top: 37px;left: 175px; }

    .perfume-map-area div.f7.perfume6 {top: 37px;left: 250px; }

    .perfume-map-area div.f7.perfume7 {top: 37px;left: 450px; }

    .perfume-map-area div.f7.perfume8 {top: 37px;left: 555px; }

    .perfume-map-area div.f7.perfume9 {top: 175px;left: 305px; }

    .perfume-map-area div.f7.perfume10 {top: 235px;left: 495px; }

    .perfume-map-area div.f11.perfume1 {top: 180px;left: 60px; }

    .perfume-map-area div.f11.perfume2 {top: 180px;left: 180px; }

    .perfume-map-area div.f11.perfume3 {top: 390px;left: 260px; }

    .perfume-map-area div.f11.perfume4 {top: 390px;left: 140px; }

    .perfume-map-area div.f12.perfume4 {top: 175px;left: 305px; }

    .perfume-map-area div.f12.perfume5 {top: 125px;left: 150px; }

    .perfume-map-area div.f12.perfume6 {top: 90px;left: 510px; }

    .perfume-map-area div.f16.perfume1 {top: 210px;left: 390px; }

    .perfume-map-area div.f16.perfume2 {top: 70px;left: 658px; }

    .perfume-map-area div.f16.perfume3 {top: 268px;left: 360px; }

    .perfume-map-area div.f16.perfume4 {top: 268px;left: 465px; }

    .perfume-map-area div.f16.perfume5 {top: 145px;left: 400px; }

    .perfume-map-area div.f16.perfume6 {top: 96px;left: 80px; }

    .perfume-map-area div.f17.perfume1 {top: 158px;left: 585px; }

    .perfume-map-area div.f17.perfume2 {top: 217px;left: 605px; }

    .perfume-map-area div.f17.perfume3 {top: 88px;left: 625px; }

    .perfume-map-area div.f17.perfume4 {top: 60px;left: 495px; }

    .perfume-map-area div.f17.perfume5 {top: 158px;left: 656px; }

    .perfume-map-area div.f17.perfume6 {top: 330px;left: 410px; }

    .perfume-info-area.perfume1 {top: 173px !important;left: 474px !important; }

    .perfume-info-area.perfume2 {top: 308px !important;left: 462px !important; }

    .perfume-info-area.perfume3 {top: 308px !important;left: 415px !important; }

    .perfume-info-area.perfume4 {top: 37px !important;left: 449px !important; }

    .perfume-info-area.f7.perfume4 {top: 37px !important;left: 100px !important; }

    .perfume-info-area.f7.perfume5 {top: 37px !important;left: 175px !important; }

    .perfume-info-area.f7.perfume6 {top: 37px !important;left: 250px !important; }

    .perfume-info-area.f7.perfume7 {top: 37px !important;left: 428px !important; }

    .perfume-info-area.f7.perfume8 {top: 37px !important;left: 449px !important; }

    .perfume-info-area.f7.perfume9 {top: 145px !important;left: 305px !important; }

    .perfume-info-area.f7.perfume10 {top: 205px !important;left: 449px !important; }

    .perfume-info-area.f11.perfume1 {top: 150px !important;left: 60px !important; }

    .perfume-info-area.f11.perfume2 {top: 150px !important;left: 180px !important; }

    .perfume-info-area.f11.perfume3 {top: 308px !important;left: 260px !important; }

    .perfume-info-area.f11.perfume4 {top: 308px !important;left: 140px !important; }

    .perfume-info-area.f12.perfume4 {top: 145px !important;left: 305px !important; }

    .perfume-info-area.f12.perfume5 {top: 95px !important;left: 150px !important; }

    .perfume-info-area.f12.perfume6 {top: 55px !important;left: 449px !important; }

    .perfume-info-area.f16.perfume1 {top: 205px !important;left: 390px !important; }

    .perfume-info-area.f16.perfume2 {top: 70px !important;left: 468px !important; }

    .perfume-info-area.f16.perfume3 {top: 263px !important;left: 360px !important; }

    .perfume-info-area.f16.perfume4 {top: 263px !important;left: 465px !important; }

    .perfume-info-area.f16.perfume5 {top: 135px !important;left: 400px !important; }

    .perfume-info-area.f16.perfume6 {top: 90px !important;left: 80px !important; }

    .perfume-info-area.f17.perfume1 {top: 158px !important;left: 468px !important; }

    .perfume-info-area.f17.perfume2 {top: 217px !important;left: 468px !important; }

    .perfume-info-area.f17.perfume3 {top: 88px !important;left: 468px !important; }

    .perfume-info-area.f17.perfume4 {top: 60px !important;left: 468px !important; }

    .perfume-info-area.f17.perfume5 {top: 158px !important;left: 468px !important; }

    .perfume-info-area.f17.perfume6 {top: 308px !important;left: 410px !important; }

    .perfume-info-area .title {font-size: 15px; }

    .perfume-info-area .close {top: 15px;width: 14px;height: 14px; }

    .perfume-info-area .perfume_info {margin-top: 5px;padding: 10px 12px; }

    .perfume_info .name { width: 50px;font-size: 13px;font-weight: 500; }
    .perfume_info .value { font-size: 13px; letter-spacing: -1px; }

    .cont-perfume .perfume-floor-wrap {padding: 10px 20px; }

    .perfume-floor-area .title {height: 15px;font-size: 12px; }

    .perfume-floor-area .floor {height: 40px;line-height: 40px;margin-top: 5px;font-size: 40px; }

    .perfume-floor-select-area .title {height: 15px;font-size: 12px; }

    .perfume-floor-select-area button {height: 40px;margin-top: 7px;font-size: 14px; }

    .perfume-floor-select-area .perfume-floor-select {max-height: 180px;top: 60px;z-index: 1;padding: 5px 20px;margin-top: 7px; }

    .perfume-floor-select li {height: 40px;line-height: 40px;font-size: 20px; }

    .perfume-manual-wrap .title .point {font-size: 18px; }

    .perfume-manual-wrap .title img {display: inline-block;width: 17px;margin-left: 7px;cursor: pointer; }

    .perfume-manual-wrap .subtitle { font-size: 16px; padding: 5px 10px; line-height: 1.8; }

    .perfume-manual-wrap ul {font-size: 11px;line-height: 21px; }

    .perfume-manual-wrap ul.explain1 li { width: 100%; line-height: 1; }

    .perfume-manual-wrap .explain1 li div:first-child {font-size: 12px;line-height: 18px; }
    .perfume-manual-wrap .explain1 li:nth-child(1) div:first-child,
    .perfume-manual-wrap .explain1 li:nth-child(2) div:first-child,
    .perfume-manual-wrap .explain1 li:nth-child(3) div:first-child,
    .perfume-manual-wrap .explain1 li:nth-child(4) div:first-child { font-size: 14px; }
    .perfume-manual-wrap ul.explain1 li div:nth-child(2) { margin-top: 5px; }

    .perfume-manual-wrap .explain2_area {height: 145px; }

    .explain2_area .explain2 { height: auto; margin-top: 5px; overflow: hidden;}
    .explain2_area .explain2::-webkit-scrollbar { width: 5px; }
    .explain2_area .explain2::-webkit-scrollbar-track { background: transparent; }
    .explain2_area .explain2::-webkit-scrollbar-thumb { background: #dcdfe6; }
    .explain2_area .explain2::-webkit-scrollbar-thumb:hover { background: #e9e9e9; cursor: pointer; }
    .explain2_area .explain2 li { padding: 10px; box-sizing: border-box; justify-content: start; gap: 8px; }
    .explain2_area .explain2 li span { font-size: 13px; }
    .explain2_area .explain2 li::before { min-width: 5px; }

    .explain2_area li.swiper-slide {height: 93px;padding: 5px 20px; }

    .perfume-manual-wrap .perfume-img {display: none;position: absolute;top: 44px;left: 15px;height: 323px;padding: 14px 17px;box-sizing: border-box;background-color: #555;border-radius: 10px; }

    .perfume-manual-wrap .perfume-img img {display: block;height: 100%;margin: 0 auto; }

    /* 1600 사물함 */
    .locker-pop-area .pop-close {padding: 3px 15px;line-height: 30px; }

    .locker-pop-area .pop-close img {width: 20px;height: 20px;margin-left: 7px;margin-top: 5px; }

    .locker-pop-area .locker-pop-container {height: 570px; }

    .locker-pop-container .pop-head .head_title .title {font-size: 25px;line-height: 140%; }

    .locker-pop-container .pop-cont {padding: 20px; }

    .locker-map-wrap .map {padding: 20px;background-repeat: no-repeat;font-size: 25px; }

    .locker-map-area div {font-size: 15px;width: 120px;height: 35px;line-height: 35px; padding: 0 15px; white-space: nowrap; }

    .locker-map-area div.locker1 {top: 250px;left: 290px; }

    .locker-map-area div.locker2 {top: 35px;left: 320px; }

    .locker-map-area div.locker3 {top: 162px;left: 570px; }

    .locker-map-area div.f5.locker3 {top: 155px;left: 525px; }

    .locker-map-area div.f7.locker1 {top: 260px;left: 290px; }

    .locker-map-area div.f7.locker2 {top: 160px;left: 290px; }

    .locker-map-area div.f7.locker3 {top: 35px;left: 320px; }

    .locker-map-area div.f7.locker4 {top: 170px;left: 620px; }

    .locker-map-area div.f12.locker1 {top: 155px;left: 310px; }

    .locker-map-area div.f12.locker2 {top: 90px;left: 310px; }

    .locker-map-area div.f12.locker3 {top: 35px;left: 310px; }

    .locker-map-area div.f12.locker4 {top: 170px;left: 620px; }

    .locker-info-area.locker1 {top: 250px;left: 290px; }

    .locker-info-area.locker2 {top: 35px;left: 320px; }

    .locker-info-area.locker3 {top: 162px;left: 570px; }

    .locker-info-area.f5.locker3 {top: 155px;left: 525px; }

    .locker-info-area.f7.locker1 {top: 260px;left: 290px; }

    .locker-info-area.f7.locker2 {top: 160px;left: 290px; }

    .locker-info-area.f7.locker3 {top: 35px;left: 320px; }

    .locker-info-area.f7.locker4 {top: 170px;left: 469px; }

    .locker-info-area.f12.locker1 {top: 155px;left: 310px; }

    .locker-info-area.f12.locker2 {top: 90px;left: 310px; }

    .locker-info-area.f12.locker3 {top: 35px;left: 310px; }

    .locker-info-area.f12.locker4 {top: 170px;left: 440px; }

    .locker-info-area .title {font-size: 15px; }

    .locker-info-area .close {top: 15px;width: 14px;height: 14px; }

    .locker-info-area .locker_info {margin-top: 5px; }

    .locker_info li {margin-bottom: 3px; }

    .locker_info .value {width: 23px;height: 23px;font-size: 12px;line-height: 23px;margin-right: 3px; }

    .cont-locker .locker-floor-wrap {padding: 10px 20px; }

    .locker-floor-area .title {height: 15px;font-size: 12px; }

    .locker-floor-area .floor {height: 40px;line-height: 40px;margin-top: 5px;font-size: 40px; }

    .locker-floor-select-area .title {height: 15px;font-size: 12px; }

    .locker-floor-select-area button {height: 40px;margin-top: 7px;font-size: 12px; }

    .locker-floor-select-area .locker-floor-select {max-height: 180px;top: 60px;z-index: 1;padding: 5px 20px;margin-top: 7px; }

    .locker-floor-select li {height: 40px;line-height: 40px;font-size: 20px; }

    .locker-manual-wrap .title .point {font-size: 18px; }

    .locker-manual-wrap .subtitle { padding: 5px 10px; font-size: 14px; text-align: center; line-height: 1; }
    .locker-manual-wrap .subtitle span { margin-right: 5px; letter-spacing: -1.2px; }
    .locker-manual-wrap .locker-explain-area { padding: 10px 15px; gap: 10px; }

    .locker-explain-area .explain_img { width: 70px;margin-left: 0;padding: 0;box-sizing: border-box; }

    .locker-explain-area .explain_img img {width: 100%; }

    .locker-explain-area .explain {margin-left: 5px;line-height: 20px;font-size: 10px; }

    .cont-locker .locker-manual-wrap .explain { margin-left: 0; line-height: 1.4; }

    /* 메인화면 :서브 메뉴 팝업 공통*/
    .layer-pop-wrap { min-width: 1400px; }
    .focusroom-pop-bg, .restroom-pop-bg, .chair-pop-bg, .air-pop-bg, .perfume-pop-bg, .locker-pop-bg, .heatmap-pop-bg { min-width: 1400px; min-height: 100%; position: fixed; }
    .focusroom-pop-wrap, .restroom-pop-wrap, .locker-pop-wrap, .perfume-pop-wrap, .air-pop-wrap, .chair-pop-wrap, .heatmap-pop-wrap { max-width: 80%; min-width: 1100px; position: fixed; }
    .focusroom-pop-area .focusroom-pop-container, .chair-pop-area .chair-pop-container, .air-pop-area .air-pop-container, .perfume-pop-area .perfume-pop-container, .locker-pop-area .locker-pop-container, .restroom-pop-area .restroom-pop-container, .restroom-pop-area2 .restroom-pop-container2,.heatmap-pop-area .heatmap-pop-container { height: auto; }
    .restroom-pop-container .pop-cont.linebldg, .chair-pop-container .pop-cont, .air-pop-container .pop-cont, .perfume-pop-container .pop-cont, .restroom-pop-container .pop-cont, .restroom-pop-container2 .pop-cont, .locker-pop-container .pop-cont, .heatmap-pop-container .pop-cont { padding: 20px 30px 30px; }
    .restroom-pop-container .pop-head, .chair-pop-container .pop-head, .air-pop-container .pop-head, .perfume-pop-container .pop-head, .locker-pop-container .pop-head, .heatmap-pop-container .pop-head { height: 50px; }
    .pop-head .head_refresh { width: 55px; left: 30px; border-radius: 5px;}
    .head_refresh .icon_refresh { width: 35px; height: 30px; }
    .head_refresh .icon_refresh a{padding:0;}
    .head_refresh .icon_refresh a img { width: 30px; height: 30px; padding:8px; }
    .head_refresh .txt_refresh { font-size: 15px; left: 10px; }
    .restroom-pop-container .pop-head .head_title .title, .chair-pop-container .pop-head .head_title .title, .air-pop-container .pop-head .head_title .title, .perfume-pop-container .pop-head .head_title .title, .locker-pop-container .pop-head .head_title .title,.heatmap-pop-container .pop-head .head_title .title { line-height: 50px; font-size: 22px; }
    .focusroom-pop-area .pop-close, .chair-pop-area .pop-close, .air-pop-area .pop-close, .perfume-pop-area .pop-close, .locker-pop-area .pop-close, .restroom-pop-area .pop-close, .restroom-pop-area2 .pop-close,.heatmap-pop-area .pop-close { top: 5px; right: 20px; }
    .focusroom-pop-container .pop-cont .cont-focusroom-map, .chair-pop-container .pop-cont .cont-chair-map, .air-pop-container .pop-cont .cont-air-map, .perfume-pop-container .pop-cont .cont-perfume-map, .locker-pop-container .pop-cont .cont-locker-map { width: calc(100% - 320px); }
    .focusroom-map-wrap .map, .chair-map-wrap .map, .air-map-wrap .map, .perfume-map-wrap .map, .locker-map-wrap .map { padding: 0; height: 500px; }
    .focusroom-map-wrap .floor, .chair-map-wrap .floor, .air-map-wrap .floor, .perfume-map-wrap .floor, .locker-map-wrap .floor { top: 10px; right: 10px; line-height: 35px; font-size: 20px; width: 35px; height: 35px; box-sizing: border-box; }
    .focusroom-pop-container .pop-cont .cont-focusroom, .chair-pop-container .pop-cont .cont-chair, .air-pop-container .pop-cont .cont-air, .perfume-pop-container .pop-cont .cont-perfume, .locker-pop-container .pop-cont .cont-locker { width: 320px; height: 500px; }
    .cont-focusroom .focusroom-manual-wrap, .cont-chair .chair-manual-wrap, .cont-air .air-manual-wrap, .cont-perfume .perfume-manual-wrap, .cont-locker .locker-manual-wrap { height: calc( 100% - 82px); }
    .focusroom-floor-area .title, .focusroom-floor-select-area .title, .chair-floor-area .title, .chair-floor-select-area .title, .air-floor-area .title, .air-floor-select-area .title, .perfume-floor-area .title, .perfume-floor-select-area .title, .locker-floor-area .title, .locker-floor-select-area .title { font-size: 14px; }
    .chair-floor-area .floor, .air-floor-area .floor, .focusroom-floor-area .floor, .perfume-floor-area .floor, .locker-floor-area .floor { font-size: 35px; }
    .focusroom-floor-select-area button, .chair-floor-select-area button, .air-floor-select-area button, .perfume-floor-select-area button, .locker-floor-select-area button { text-align: left; text-indent: 10px; }
    .focusroom-floor-select-area .focusroom-floor-select, .chair-floor-select-area .chair-floor-select, .air-floor-select-area .air-floor-select, .perfume-floor-select-area .perfume-floor-select,.locker-floor-select-area .locker-floor-select { max-height: 150px; }
    .focusroom-floor-select li, .chair-floor-select li, .air-floor-select li, .perfume-floor-select li, .locker-floor-select li { font-size: 18px; }
    .focusroom-manual-wrap .title, .chair-manual-wrap .title, .air-manual-wrap .title, .perfume-manual-wrap .title, .locker-manual-wrap .title { font-size: 16px; letter-spacing: -1.5px; line-height: 1.4; padding: 10px; }
    .focusroom-manual-wrap .title .point, .chair-manual-wrap .title .point, .air-manual-wrap .title .point, .perfume-manual-wrap .title .point, .locker-manual-wrap .title .point { font-size: 16px; }
    .chair-map-wrap .chair-info-area, .air-map-wrap .air-info-area, .perfume-map-wrap .perfume-info-area, .locker-map-wrap .locker-info-area { padding: 10px 10px 10px; }
    .chair-info-area .close, .air-info-area .close, .perfume-info-area .close, .locker-info-area .close { top: 12px; }
    .chair-info-area .title, .air-info-area .title, .perfume-info-area .title, .locker-info-area .title { font-size: 16px; }

    /*구내식당 실시간 밀집도*/
    .maincontant__section__info--menu2 .maincontant__section__info--heatmap{min-height: 90px; margin-top: 30px; height: 75px;}
    .maincontant__section__info--heatmap span{font-size: 18px;}
    .maincontant__section__info--heatmap span.icon{height: 55px;}
    .cont-heatmap{max-width: 320px; max-height: 500px;}
    .cont-heatmap .heatmap-floor-wrap{padding: 10px 20px;}
    .heatmap-floor-wrap .floor-area{flex-flow: column; gap: 5px;}
    .heatmap-floor-wrap .floor-area .title{font-size: 16px; line-height: 1;}
    .heatmap-floor-wrap .floor-area .floor{font-size: 35px; line-height: 1;}
    .heatmap-floor-wrap .date-area{padding-left: 10px;}
    .heatmap-floor-wrap .date-area span.time{font-size: 18px;}

    .heatmap-manual-wrap .heatmap-realTime-area{padding: 10px 0 0;}
    .heatmap-realTime-area h4{font-size: 18px;}
    .heatmap-realTime-area .realTime-step{padding: 0 20px; margin: 10px 0;}
    .heatmap-realTime-area .realTime-step .stepImg{width:190px; height: 65px;}
    .heatmap-realTime-area .realTime-step li{width: 65px; height: 65px;}
    .heatmap-realTime-area .realTime-step li span{font-size: 28px;}
    .heatmap-realTime-area .stepGage li{height: 20px; line-height: 20px;}

    .submenu-info-area .heatmap-submenu{gap: 10px; width: 80px;}
    .submenu-info-area .heatmap-submenu li{padding: 20px 10px;height: 96px;}
    .submenu-info-area .heatmap-submenu li img{width: 50%;}
    .submenu-info-area .heatmap-submenu li span{font-size: 15px; letter-spacing: -0.88px; line-height: 1.4; word-break: keep-all;}

    .submenu-info-area .timetable{width: calc(100% - 90px); max-height: unset;}
    .submenu-info-area .timetable .title{font-size: 15px; margin:0; line-height: 1.8;}
    .submenu-info-area .timetable>ul>li{justify-content: space-between;}
    .submenu-info-area .timetable>ul li>div{width: 20px; height: 64px;}
    .submenu-info-area .timetable>ul li>div span{font-size: 14px;font-weight: 400;}
    .submenu-info-area .timetable>ul ul{width: 100%; padding: 5px;}
    .submenu-info-area .timetable>ul ul li span.time{padding-left: 10px;margin-left: 10px;}
    .submenu-info-area .timetable>ul ul li span{line-height: 1.3;}
    .submenu-info-area>span{word-break: keep-all;}

    .detail-heatmap{width: 100%; max-height: 500px;}
    .detail-heatmap .cont-wrap{padding: 15px 25px 25px;}
    .detail-heatmap .cont-wrap .detail-area .title-box div{font-size: 18px; letter-spacing: -1.2px;}
    .detail-heatmap .cont-wrap .detail-area .title-box span{font-size: 13px; letter-spacing: -0.88px;}
    .detail-heatmap .cont-wrap .cont-area{max-height: unset; margin-top: 10px;}

    .detail-heatmap .cont-wrap.cont01{gap: 20px;}
    .cont-wrap.cont01 .cont-area .tabHeader li{height: 35px;}
    .cont-wrap.cont01 .cont-area .chart-area{padding: 20px 15px; height: 385px;}
    .cont-wrap.cont01 .detail-area:nth-child(2){max-width: unset; min-width: 320px;}
    .cont-wrap.cont01 .detail-area:nth-child(2) .cont-area{height: 420px;}
    .cont-wrap.cont01 .cont-area .chart-area .chartBox{padding: 15px;}
    .cont-wrap.cont01 .cont-area .chart-area .chartBox h4{font-size: 17px;}

    .cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary{margin-top: 20px;}
    .cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary .table li{line-height: 30px; font-size: 15px;}
    .cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div span{font-size: 15px;}
    .cont-wrap.cont01 .cont-area .chart-area .chartBox .chartSummary>div span.subTxt{font-size: 12px;}

    .cont-wrap.cont01 .heatmap-wrap{height: 220px;}
    .cont-wrap.cont01 .heatmap-wrap .place-box li.place01 {top: 60px;left: 30px;}
    .cont-wrap.cont01 .heatmap-wrap .place-box li.place02 {top: 25px;left: 180px;}
    .cont-wrap.cont01 .heatmap-wrap .place-box li.place03 {top: 150px;left: 220px;}
    .cont-wrap.cont01 .heatmap-wrap .place-box li.place04 {top: 85px;left:165px;}
    .cont-wrap.cont01 .heatmap-wrap .heatmap-box li.sensor{width: 42px; max-height: 30px;}

    .cont-wrap.cont01 .placeinfo-wrap{padding: 15px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box{gap: 15px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeImg{width: 140px; min-width: 140px; height: 130px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeImg.noImg{width: 140px; min-width: 140px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .icon{width: 23px; height: 23px; top: 15px; right: 15px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail h5{font-size: 16px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .sub01{font-size: 13px;}
    .cont-wrap.cont01 .placeinfo-wrap .info-box .placeDetail .sub02{left: 175px;}

    .cont-wrap.cont01 .heatmap-wrap .label-box{bottom: -35px;}

    /* 이용가이드 */
    .detail-heatmap .cont-wrap.cont02,
    .detail-heatmap .cont-wrap.cont03{height: 495px; overflow: hidden; box-sizing: border-box;}
    .detail-heatmap .cont-wrap.cont02 .cont-area, .detail-heatmap .cont-wrap.cont03 .cont-area{height: 420px;}
    .detail-heatmap .cont-wrap .detail-area .close-btn{top: 20px; right: 25px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box{padding: 50px 20px 25px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box .title{width: 140px; font-size: 17px; padding: 0 25px 5px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide{gap: 5px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li{align-items: center; gap: 20px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .icon-box{width: 120px; height: 95px;padding: 10px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .txt-box div{font-size: 17px;}
    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.guide li .txt-box span{font-size: 14px; line-height: 1.2;}

    .detail-heatmap .cont-wrap.cont03 .cont-area .info-box ul.etiquette li{height: 100px; margin-bottom: 8px; display: flex; align-items: center; justify-content: center;}

}

/* ///////////-----------------/////////// */
/* ///////////-----컨디셔닝센터-----/////////// */
/* ///////////-----------------/////////// */
.conditioning .meetingroom__item--info .careMind, .conditioning .meetingroom__item--info .careBody{margin-bottom: 10px;}
.layer-pop-area.careroom_pop_wrap .pop_tit{margin: 0 !important; padding: 15px 0;}

/* ///////////-----------------/////////// */
/* ///////////-----수면캡슐-----/////////// */
/* ///////////-----------------/////////// */
.pop-cont-device li.sleep01.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon01_on.png); }
.pop-cont-device li.sleep02.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon02_on.png); min-width: 151px }
.pop-cont-device li.sleep03.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon03_on.png); }
.pop-cont-device li.sleep04.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon04_on.png); min-width: 171px }
.pop-cont-device li.sleep05.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon05_on.png); min-width: 131px }
.pop-cont-device li.sleep06.sleep_on { background-image: url(../../images/connectplace/common/sleep_icon06_on.png); }

.pop-cont-ct .location_box .sleep_location {width: 50px;height: 50px;background-image: url(../../images/connectplace/common/sleep_top.png);background-size: contain;position: absolute;bottom: 5px;left: 110px; }
.pop-cont-device li.device_on, .pop-cont-device li.sleep_on {float: left; min-width: 60px !important; max-width: 150px; width: auto;height: 30px; margin: 0; padding: 0 10px;box-sizing: border-box; border: 0;color: #5a6681; line-height: 30px;
    text-align: center;font-size: 14px; font-weight: 600;text-indent: 3px;background-repeat: no-repeat;background-position: 13px center; background-image: none !important; background-color: #fff; display: block; white-space: nowrap; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.05); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.05); }

.pop-cont-device li.sleep_on:first-child {margin-left: 0px; }

.pop-sleep-cont h5 { font-size: 18px; font-weight: 400; color: #5a6681; letter-spacing: -1.08px; margin-bottom: 15px; }
.pop-sleep-cont .txt-list { padding: 20px; background-color: #f5f5f5; }
.pop-sleep-cont .txt-list li { margin-bottom: 10px; position: relative; padding-left: 15px; }
.pop-sleep-cont .txt-list li:last-child { margin-bottom: 0px; }
.pop-sleep-cont .txt-list li::before { content: ''; position: absolute; width: 5px; height: 5px; background-color: #4c5266; border-radius: 100%; top: 50%; left: 0; transform: translateY(-50%); }
.pop-sleep-cont .txt-list li span { font-size: 16px; font-weight: 400; color: #4c5266; letter-spacing: -1.12px; display: inline-block; margin-right: 20px; }
.pop-sleep-cont .txt-list li p { display: inline-block; font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #5f6b8b; }
.pop-sleep-cont .txt-list li p b { font-weight: bold; }
.pop-sleep-cont .txt-list li p.blue { font-weight: bold; color: #1382f4; }

.pop-cont .sleep-add .tit { text-align: center; color: #1382f4; font-size: 22px; font-weight: 600; letter-spacing: -0.88px; background-color: #f0f6ff; padding: 10px 0; box-sizing: border-box; }
.pop-cont .sleep-add .tit span { display: block; margin-top: 5px; font-weight: 500; font-size: 18px; color: #343f5b; }
.pop-cont .sleep-add .inputform { padding: 0; }
.pop-cont .sleep-add .inputform__row__colm { width: 100% !important; margin-top: 10px; }
.pop-cont .sleep-add .inputform__row__colm .input-group { display: flex; width: 100%; align-items: center; justify-content:start; gap: 10px; box-sizing: border-box; }
.pop-cont .sleep-add .inputform__row__colm .ui-selectmenu-button.ui-button { border: 1px solid #ddd !important; border-radius: 0;}

/* ///////////-----------------/////////// */
/* //////////--PLACE 예약 정책--////////// */
/* ///////////-----------------/////////// */
.policy { display: flex; justify-content: start; align-items: start; gap: 0px; min-width: 1400px; margin:0 auto; padding-top: 64px; box-sizing: border-box; overflow: hidden; position: relative; }
/* PLACE 정책 바탕색 누락 추가: background-color: #f0f6ff */
.policy__lnb { width: 300px; height: calc(100vh - 64px); position: relative; background-color: #f0f6ff; }
.policy__lnb-tit { font-size: 28px; font-weight:700; color: #fff; line-height: 75px; white-space: nowrap; padding: 30px 40px; box-sizing: border-box; background-image: linear-gradient(to top, #1382f5, #5aa7f7); }
.policy__lnb-menu li a { display: block; line-height: 50px; font-size: 18px; color: #4c5266; font-weight:600; padding: 0 40px; box-sizing: border-box; background-color:#fff; border: 1px solid rgba(0, 0, 0, 0.08); border-right: 0; }
.policy__lnb-menu li.active a { background: #4c5266; color: #fff; font-weight: 600; border: 1px solid #4c5266; }
.policy__lnb-menu li.active a:hover { opacity: 1; cursor: default; }
.policy__content-inner.policy__content-inner--room { display: flex; flex-direction: column; gap: 20px; }
.policy__content-tit h3 { font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); color: #151515; border-bottom: 1px solid var(--clr-w300); height: 38px; }

.policy__content-sub-tit p { font-size: 18px; color: #333; font-weight: bold; white-space: nowrap; padding: 5px 20px; border-radius: 3px; background-color: #f0f6ff; letter-spacing: -1px; }
.policy__content-sub-tit p span { margin-left: 10px; color: #1382f4; font-weight: bold; letter-spacing: 0px; }

.policy__content-table table colgroup { width: calc(100vw - 400px); }
.policy__content-table table th { width: 130px; min-width: 130px; box-sizing: border-box; text-align: left; cursor: default; background-color: var(--clr-w200); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: var(--txt-letter-spacing); padding: 12px 12px 12px 24px; }
.policy__content-table table tr:last-child th { border-bottom: 1px solid var(--clr-w300); }
.policy__content-table .policy-table--room th { padding: 12px 12px 12px 15px !important; }
.policy__content-table table td { width: 134px; cursor: default; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t500); letter-spacing: var(--txt-letter-spacing); padding: 12px 12px 12px 24px;}
.policy__content-table table td:first-child { font-size: 18px; font-weight: 600; color: #4c5266; letter-spacing: -0.18px; text-align: center;}
.policy__content-table table td:first-child span { display: block; margin-top: 3px; font-size: 16px; font-weight: 500; color: #4c5266; letter-spacing: 0; }
.policy__content-table table th + td { text-align: left; box-sizing: border-box; }
.policy__content-table table td .subscription { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); letter-spacing: var(--txt-letter-spacing); margin: 3px 0; word-break: keep-all; }
.policy__content-table table td span { display: inline-block; color: var(--txt-color-p600); }

/* Desk policy table layout */
.policy__content-sub-tit.policy__content-sub-tit--room { max-width: 1560px; height: 44px; padding-top: 12px; gap: 16px; }
.policy__content-sub-tit--room .policy__content-sub-tit-bldg { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.policy__content-sub-tit--room .policy__content-sub-tit-bldg-name { display: inline-flex; align-items: center; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); }
.policy__content-sub-tit--desk .policy__content-sub-tit-bldg-name::before,
.policy__content-sub-tit--room .policy__content-sub-tit-bldg-name::before { content: ""; display: inline-block; width: 16px; height: 16px; margin-right: 8px; background: url("../../../figma/svg/company_black_16.svg") no-repeat center / 16px 16px; }
.policy__content-sub-tit--room .policy__content-sub-tit-notice { display: -webkit-box; width: 485px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.policy__content-tit { height: 38px; gap: 8px; }
.policy__content-table.policy__content-table--room { border-top: 0; display: flex; flex-direction: column; gap: 16px; }
.policy__content-table.policy__content-table--room:first-of-type { margin-top: 0; }
.policy__content-table.policy__content-table--desk .policy-section-tit,
.policy__content-table.policy__content-table--room .policy-section-tit { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: var(--txt-letter-spacing); }
.policy__content-table table.policy-table--desk { position: relative; border: 0; background-color: var(--clr-w100); border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: visible; display: flex; flex-direction: column; align-items: center; align-self: stretch; }
.policy__content-table table.policy-table--desk::before { content: ""; position: absolute; inset: 0; border: 1px solid var(--clr-w300); border-radius: 6px; pointer-events: none; z-index: 2; }
.policy__content-table table.policy-table--room { position: relative; border: 0; background-color: var(--clr-w100); border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: visible; }
.policy__content-table table.policy-table--room::before { content: ""; position: absolute; inset: 0; border: 1px solid var(--clr-w300); border-radius: 12px; pointer-events: none; z-index: 2; }
.policy__content-table table.policy-table--desk th,
.policy__content-table table.policy-table--desk td,
.policy__content-table table.policy-table--room th,
.policy__content-table table.policy-table--room td { border-top: 1px solid var(--clr-w300); border-left: 1px solid var(--clr-w300); background-clip: padding-box; }
.policy__content-table table.policy-table--desk tr:first-child > :first-child { border-top-left-radius: 6px; }
.policy__content-table table.policy-table--desk tr:first-child > :last-child { border-top-right-radius: 6px; }
.policy__content-table table.policy-table--desk tr:last-child > :first-child { border-bottom-left-radius: 6px; }
.policy__content-table table.policy-table--desk tr:last-child > :last-child { border-bottom-right-radius: 6px; }
.policy__content-table table.policy-table--room tr:first-child > :first-child { border-top-left-radius: 6px; }
.policy__content-table table.policy-table--room tr:first-child > :last-child { border-top-right-radius: 6px; }
.policy__content-table table.policy-table--room tr:last-child > :first-child { border-bottom-left-radius: 6px; }
.policy__content-table table.policy-table--room tr:last-child > :last-child { border-bottom-right-radius: 6px; }
.policy__content-table table.policy-table--desk td,
.policy__content-table table.policy-table--room td { vertical-align: middle; }
.policy__content-table table.policy-table--desk td p,
.policy__content-table table.policy-table--room td p { line-height: 1.5; }
.policy__content-table table.policy-table--desk td .subscription,
.policy__content-table table.policy-table--room td .subscription { margin-top: 4px; font-weight: var(--txt-weight-regular);}


/* ///////////////////////////////////////////////// */
/* --------------- 회의실/좌석 예약상세 --------------- */
/* ///////////////////////////////////////////////// */
.RsvDetail .head { position: relative; padding: 30px; box-sizing: border-box; background-image: linear-gradient(to top, #1382f5, #5aa7f7); }
.RsvDetail .head h1.tit { font-size: 32px; font-weight: 600; color: #fff; letter-spacing: -1.2px; margin-bottom: 20px; }
.detailInfo > div { display: flex; align-items: center; justify-content: start; height: auto;margin-top: 20px;}
.detailInfo > div.device { display: flex; flex-flow: row wrap; align-items: center; justify-content: start; margin-top: 15px; gap: 5px; }
.RsvDetail .head .name { font-size: 32px; font-weight: 500; margin: 0; color: #fff; }
.RsvDetail .head .imgview { background: rgba(255,255,255,.1) url(../../images/connectplace/common/icon_images.png) no-repeat 10px 50%; border: 1px solid rgba(255,255,255,0.2); text-indent: -9999px; position: relative; padding: 0; width: 30px; height: 30px; background-position: center; top: unset; right: unset; margin-left: auto; }
.RsvDetail .head .label { position: relative; top: 5px; left: unset; margin-left: 10px; background-color: unset; color: #fff; font-size: 15px; padding: 0; padding-left: 5px; line-height: unset; border-left: 1px solid rgba(255,255,255,.5); box-sizing: border-box; font-weight: 500; }
.RsvDetail .head .desc { color: #fff; font-size: 20px; font-weight: 400; letter-spacing: -0.5px;}
.RsvDetail .head .desc span:nth-child(2) {white-space: nowrap; font-size: 15px; margin-left: 5px; padding-left: 5px; border-left: 1px solid rgba(255,255,255,.5); line-height: 1; }
.RsvDetail .head .recurring {padding-left: 20px; margin-top: 5px; margin-left: auto; color: #fff; background: url(../../images/connectplace/common/ico_repeat-wh.png) no-repeat left 3px center/12px; white-space: nowrap; }
.RsvDetail .head .private{padding-left: 15px; margin-left: auto; color: #fff; background: url(../../images/connectplace/common/ico_lock_wh.png) no-repeat left center/11px; white-space: nowrap; }
.RsvDetail .head .recurring + .private{margin-left: 7px;margin-top: 5px;}
.RsvDetail .head .items{ display: flex; align-items: center; margin-top: 0; gap: 5px;}
.RsvDetail .head .conference {width: 100%; display: flex; flex-flow: column; align-items: start; margin-top: 0; gap: 5px;}
.RsvDetail .head .items + .conference{margin-top: 10px;}
.RsvDetail .head .items span{border: 1px solid #fff; color: #Fff; font-weight: 500; padding: 0 5px !important; line-height: 22px; background: none !important; margin-right: 0px; }
.RsvDetail .head .conference p{display: flex; cursor: default; align-items: center; font-size: 15px; letter-spacing: 0.2px; color:#fff; font-weight: 400; padding-left: 25px; background:url(../../images/connectplace/common/icon_videophone.png) no-repeat left 0 top 50% / 15px;}
.RsvDetail .head .conference p.call{background:url(../../images/connectplace/common/icon_conferencecall.png) no-repeat left 0 top 50% / 15px;}

.RsvDetail .rsvDetail-reset { padding-top: 20px; margin-top: 10px; border-top:1px solid rgba(999, 999, 999, 0.2); }
.rsvDetail-reset .reset-btn { position: relative; width: 100%; display: flex; flex-flow: row-reverse; align-items: center; justify-content: center; background-color: #fff; text-align: center; gap: 10px; height: 55px; padding: 0; transition: all 0.3s; box-sizing: border-box; cursor: pointer; }
.rsvDetail-reset .reset-btn:hover { border-radius: 30px; transition: all 0.3s;}
.rsvDetail-reset .reset-btn .btn-txt { color: #398bdf; font-size: 24px; font-weight: 700; letter-spacing: -1px;}

.RsvDetail .body { position: relative; top: unset; bottom: unset; padding: unset; }
.meetingroom-cancel-btnarea, .rsvDetail-btnWrap { display: flex; align-items: center; justify-content: space-between; }
.meetingroom-cancel-btnarea .recurring-btn {position: relative;width: 100%; height: 50px;}
.meetingroom-cancel-btnarea .recurring-btn > button {width: 100%;height: 50px;border: 0; margin: 0; box-sizing: border-box;font-size: 16px;font-weight: 600;color: #fff;background-image: url(../../images/connectplace/common/ico_triangle_down.svg); background-repeat: no-repeat; background-position: right 20px center; background-size: 8px;}
.meetingroom-cancel-btnarea .recurring-btn .recurring-meetingroom-cancel-btn{ background-color: #0f447c; }
.meetingroom-cancel-btnarea .recurring-btn .recurring-meetingroom-cancel-btn.line{background-color: #255181;}
.meetingroom-cancel-btnarea .recurring-btn:nth-child(3) .recurring-meetingroom-cancel-btn,
.meetingroom-cancel-btnarea .recurring-btn:nth-child(3) .recurring-meetingroom-cancel-btn.line{ background-color: #3A628D;}

.meetingroom-cancel-btnarea .recurring-btn .recurring-meetingroom-cancel-btn.on,
.meetingroom-cancel-btnarea .recurring-btn .recurring-meetingroom-cancel-btn.line.on {background-image: url(../../images/connectplace/common/ico_triangle_up.svg); }

.meetingroom-cancel-btnarea .recurring-btn ul {display: none;position: absolute;left: 0;top: 55px;z-index: 10;width: 100%;height: auto;min-height: 50px;background-color: #fff;border-radius: 10px;overflow: hidden; }
.meetingroom-cancel-btnarea .recurring-btn .recurring-meetingroom-cancel-btn.on + ul {display: block; }
.meetingroom-cancel-btnarea .recurring-btn ul button {width: 100%;height: 50px;text-align: center;font-size: 16px;color: #555;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;padding: 0 10px; }
.meetingroom-cancel-btnarea .recurring-btn ul button:hover,
.meetingroom-cancel-btnarea .recurring-btn ul button:active {background-color: #ededed;color: #222; }

.meetingroom-cancel-btnarea .recurring-btn:not([style*="display: none"]) + .recurring-btn,
.meetingroom-cancel-btnarea .recurring-btn:not([style*="display: none"]) + .meetingroom-cancel-btn.line {margin-left: 10px; }

.rsvDetail-btnWrap .btnSelectBox button.btnBox,
.rsvDetail-btnWrap .btnSelectBox button.btnBox.line {background-image: url(../../images/connectplace/common/ico_triangle_down.svg); background-repeat: no-repeat; background-position: right 20px center; background-size: 8px; }
.rsvDetail-btnWrap .btnSelectBox button.btnBox.on,
.rsvDetail-btnWrap .btnSelectBox button.btnBox.line.on {background-image: url(../../images/connectplace/common/ico_triangle_up.svg);}

.rsvDetail-btnWrap button.btnBox { width: 100%; height: 50px; font-size: 16px; font-weight: 600; color: #Fff; background-color: #0f447c; border-radius: 0; border: 0; margin: 0; box-sizing: border-box; }
.rsvDetail-btnWrap button.btnBox.line {background-color: #255181; }
.rsvDetail-btnWrap button.btnBox:nth-child(3) { background-color: #3A628D;}
.rsvDetail-btnWrap button.btnBox:hover { opacity: 0.9;}

.rsvDetail-btnWrap .btnSelectBox ul { box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); border-radius: 0; }
.rsvDetail-btnWrap .btnSelectBox ul button { font-weight: 600; letter-spacing: -0.5px; }
.rsvDetail-btnWrap .btnSelectBox ul button:hover { background-color: #f0f6ff; color: #1382f4;}
.RsvDetail-inner .rsvInfo-wrap {padding: 20px 30px; box-sizing: border-box; }
/* --- CSS4 설정(:not) 별도 분리 ---
.RsvDetail-inner .rsvInfo-wrap dl:not(.rsvInfo-wrap dl:first-child){ border-top: 1px solid #d8e9fe; margin-top: 15px; padding-top: 15px; }*/
.meeting-room-view .body .meetingroom-info dt,
.RsvDetail-inner .rsvInfo-wrap dl dt { color: #1382f4; font-size: 16px; font-weight: 600; margin-bottom: 10px; }
.meeting-room-view.RsvDetail-inner{background-color: #fff;height: 100vh; overflow-y: auto;}
.RsvDetail-inner .rsvInfo-wrap dl .tit{display: flex; align-items: center; font-size: 18px; font-weight: 600; color: #1382f4;letter-spacing: -1.2px; margin-bottom: 10px; white-space: nowrap;}
.RsvDetail-inner .rsvInfo-wrap dl .tit span{display: block; margin-left: 10px; padding-left: 10px; border-left: 1px solid #ccc; line-height: 1; font-size: 16px;letter-spacing: -1.2px; font-weight: 500; color: #5a6681; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.RsvDetail-inner .rsvInfo-wrap .meetingroom-info-txt .img-layout{display: flex; align-items: center; justify-content: center; gap: 10px; height: 50px; background:#EBF4FE; padding: 5px; box-sizing: border-box;}
.RsvDetail-inner .rsvInfo-wrap .meetingroom-info-txt .img-layout:hover{opacity: 0.85;}
.RsvDetail-inner .rsvInfo-wrap .meetingroom-info-txt .img-layout img{display: block; width: 35px; height: auto;}
.RsvDetail-inner .rsvInfo-wrap .meetingroom-info-txt .img-layout label{font-size: 15px; color: #4c5266; font-weight: 500; letter-spacing: -1.2px;}
.RsvDetail-inner .rsvInfo-wrap .meetingroom-info-txt .img-layout + .img-layout{margin-top: 10px;}

/* .RsvDetail-inner .rsvInfo-wrap dl .tit+dt{display: none;} */

/* 조직원검색-위치보기 : 좌석 정보 */
.RsvDetail-inner .rsvInfo-wrap:first-child{margin-top: 20px !important;}
.seat .RsvDetail-inner .rsvInfo-wrap dl{margin-top: 0 !important; padding: 15px 20px; box-sizing:border-box; background-color: #ffffff;}
.seat .RsvDetail-inner .rsvInfo-wrap div+dl{border-top: 0px !important; display: flex; align-items: center; justify-content: space-between;}
.seat .RsvDetail-inner .rsvInfo-wrap dt{margin-bottom: 0; font-size: 16px;}
.seat .RsvDetail-inner .rsvInfo-wrap dl dt, .seat .RsvDetail-inner .rsvInfo-wrap dl dd p{color: #788198;}
.seat .RsvDetail-inner .rsvInfo-wrap.selected dl dt{color: #1382f4;}
.seat .RsvDetail-inner .rsvInfo-wrap.selected dl dd p{color: #4c5266;}

.rsvDetail-listBox dl dt { color: #Fff !important; margin: 0 !important; background-color: #4c5266; padding: 0 30px; line-height: 45px; box-sizing: border-box; }
.RsvDetail-inner .body dd>div, .meeting-room-view .body .meetingroom-info dd .meetingroom-info-txt { position: relative; border-bottom: 0; padding-bottom: 0; }
.RsvDetail-inner .body dd>div p, .meeting-room-view .body .meetingroom-info dd .meetingroom-info-txt p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; line-height: 1.2; color: #4c5266; font-weight: 500; letter-spacing: -1.2px; }
.RsvDetail-inner .body dd>div p span { padding-top: 3px; margin-left: 10px; padding-left: 20px; background: url(../../images/connectplace/common/ico_time.png) no-repeat left 0 top calc(50% + 3px)/ 17px; }
.RsvDetail-inner .body dd>div br{ display: none;}
.rsvDetail-listBox #attendeeList { max-height: calc(100vh - 780px); min-height: 300px; box-sizing: border-box; overflow: hidden; overflow-y: auto; background-color: #fff; }
.rsvDetail-listBox .staff-list { border: 0; padding: 0; min-height: unset; max-height: unset; }
.meeting-room-view .body .meetingroom-info dd .staff-list{ min-height: 60px; }
.meeting-room-view .body .meetingroom-info dd .staff-list li,
.rsvDetail-listBox .staff-list li { border-bottom: 0; border: 0; padding: 0; margin-top: 0; }
.rsvDetail-listBox .staff-list li .user-item { padding: 0 10px 0 30px; border-right: 0; background-color: #fff; }
.rsvDetail-listBox .staff-list li:last-child .user-item { border-bottom: 0px; }
.rsvDetail-listBox .staff-list li .user-item:hover { opacity: 1 !important; }
.rsvDetail-listBox .staff-list li .user-item .user-info { width: 100%; height: 65px; padding:10px 0 10px 50px; border-bottom: 0; gap: 10px; }
.rsvDetail-listBox .staff-list li .user-item .img { top: 50%; transform: translateY(-50%); }
.rsvDetail-listBox .staff-list li .user-item .user-info .name span { font-size: 17px; font-weight: 600; color: #252525; }
.rsvDetail-listBox .staff-list li .user-item .user-info .name span:nth-child(2) { font-size: 14px; color: #59a7f7; margin-left: 5px; }
.rsvDetail-listBox .staff-list li .user-item .user-info .team { color: #838EAC; font-weight: 500; margin-top: 1px; }

/* 회의실 예약 상세 */
.recurring-layout .recurring-btn { width: auto; box-sizing: border-box; }
.recurring-layout .recurring-btn button { border-radius: 0; line-height: unset; height: 44px; color: #5f6b8b; font-weight: 500; font-size: 16px; text-align: left; padding: 0 10px 0 30px; box-sizing: border-box; }
.meeting-room-view .body .meetingroom-info { margin-top: 0; }
.meetingroom-cancel-btnarea .recurring-btn:not([style*="display: none"]) + .recurring-btn, .meetingroom-cancel-btnarea .recurring-btn:not([style*="display: none"]) + .meetingroom-cancel-btn.line { margin: 0; }
.layer-pop-wrap .layer-pop-area.modify .inputform__row.time { gap: 10px; }
.layer-pop-wrap .layer-pop-area.modify .inputform__row.time .input-group { gap: 5px; }
#recurringModify .recurring-btn button { padding: 0 10px; width: 90px; text-align: center; }

/* ///////////////////////////////////////////////// */
/* ///////////////////////////////////////////////// */
/* ------------------- 방문자 예약 ------------------- */
/* ///////////////////////////////////////////////// */
/* ///////////////////////////////////////////////// */
section.visit { display: flex; justify-content: start; align-items: start; gap: 0px; min-width: 1400px; margin: 0 auto; padding-top: 64px; box-sizing: border-box; position: relative;}
/* 방문자 예약 바탕색 누락 추가: background-color: #f0f6ff */
.visit__lnb { width: 300px; height: calc(100vh - 64px); position: relative; background-color: #f0f6ff; }
.visit__lnb-tit { font-size: 28px; font-weight:700; color: #fff; letter-spacing: -1.2px; line-height: 75px; white-space: nowrap; padding: 30px 40px; box-sizing: border-box; background-image: linear-gradient(to top, #1382f5, #5aa7f7); }
.visit__lnb-menu li a { display: block; line-height: 50px; font-size: 18px; color: #4c5266; font-weight:600; padding: 0 40px; box-sizing: border-box; background-color:#fff; border: 1px solid rgba(0, 0, 0, 0.08); border-right: 0; }
.visit__lnb-menu li +li a { border-top: 0; }
.visit__lnb-menu li.active a { background: #4c5266; color: #fff; font-weight: 600; border: 1px solid #4c5266; }
.visit__lnb-menu li.active a:hover { opacity: 1; cursor: default; }
.visit__content { display: flex; flex-direction: column; padding: 36px 40px; max-width: 1600px; align-items: flex-start; gap: 20px; flex: 1 0 0; height: calc(100vh - 64px); margin: 0 0; overflow-y: auto; overflow-x: hidden; -ms-overflow-style: none; scrollbar-width: none; box-sizing: border-box; }
.visit__content::-webkit-scrollbar { display: none; }
.visit__content-inner { display: flex; max-width: 1600px; flex-direction: column; align-items: flex-start; gap: 20px; }
.visit__content-tit.tit-wrap { align-self: stretch; border-bottom: 1px solid var(--clr-w300); height: 38px; }
.visit__content-tit.tit-wrap h1 { height: 30px; line-height: 30px; font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); letter-spacing: -0.4px; }
.visit__content .btn-wrap { display: flex; justify-content: center; align-items: center; gap: 12px; align-self: stretch; }
.visit__content .btn-wrap button { min-width: 100px; }
.visit__content .btn-wrap .btn-cancel { background-color: #5A6681; transition: all 0.2s; }
.visit__content .btn-wrap .btn-cancel:hover { background-color: #4c5266; transition: all 0.2s; opacity: 1; }
.visit__content .btn-wrap .btn-apply { background-color: #59a7f7; }
.visit__content .btn-wrap .btn-apply:hover { background-color: #469bf3; transition: all 0.2s; opacity: 1; }

/* 방문자 예약 */
.visit__content-reservation { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; }
.visit__content-reservation .info-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; }
.visit__content-reservation .sub-tit-wrap { display: flex; align-items: center; gap: 24px; align-self: stretch; }
.visit__content-reservation .sub-tit { flex: 1 0 0; font-family: var(--txt-font-family); font-size: var(--txt-size-18); color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.visit__content-reservation .checkYn { position: absolute; right: 0; }
.visit__content-reservation .sub-tit-wrap .visitor-info-title { display: inline-flex; align-items: center; gap: 4px; position: relative; }
.visit__content-reservation .sub-tit-wrap .talk { margin-left: 0; width: 24px; height: 24px; font-size: 0; line-height: 0; color: transparent; position: relative; cursor: pointer; }
.visit__content-reservation .sub-tit-wrap .talk::before { content: ''; width: 24px; height: 24px; position: absolute; left: 0; top: 0; background-image: url(../../../figma/svg/info_filled_bluegray_24.svg); background-position: center; background-repeat: no-repeat; background-size: cover; }
.visit__content-reservation .sub-tit-wrap .visitor-info-title:hover .alarm_talk { display: flex; }
.visit__content-reservation .sub-tit-wrap .alarm_talk { display: none; position: absolute; bottom: calc(100% + 10px); left: 89%; transform: translateX(-50%); width: 250px; min-width: 250px; max-width: 250px; padding: 10px; flex-direction: column; align-items: flex-start; gap: 8px; border-radius: 6px; background: var(--clr-w800); box-sizing: border-box; overflow: visible; z-index: 10; }
.visit__content-reservation .sub-tit-wrap .alarm_talk::before { content: ""; position: absolute; left: 50%; top: calc(100% + 2px); transform: translateX(-50%); width: 12px; height: 6px; background-color: rgba(0, 0, 0, 0.25); clip-path: polygon(50% 100%, 0 0, 100% 0); filter: blur(1.2px); z-index: -1; }
.visit__content-reservation .sub-tit-wrap .alarm_talk::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); width: 12px; height: 6px; background-color: var(--clr-w800); clip-path: polygon(50% 100%, 0 0, 100% 0); }
.visit__content-reservation .sub-tit-wrap .alarm_talk .alarm_talk_img { display: flex; width: 100%; max-width: 230px; height: 150px; padding: 0; justify-content: center; align-items: center; align-self: center; border-radius: 6px; background: url(../../images/connectplace/common/alarm_talk.png) var(--clr-w800) 50% / contain no-repeat; box-sizing: border-box; }
.visit__content-reservation .sub-tit-wrap .alarm_talk .text { color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }

.visitor-info-wrap .visitor-table-toolbar .visitor-table-btn button { display: flex; width: 36px; min-width: 36px; height: 36px; padding: 14px 10px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
.visitor-info-wrap .visitor-table-toolbar .visitor-table-btn button.visitors-delete { background-repeat: no-repeat; background-position: center; background-image: url("../../../figma/svg/delete_black_16.svg"); background-size: 14px; } 
.visitor-info-wrap .visitor-table-toolbar .visitor-table-btn button.visitors-add { background-repeat: no-repeat; background-position: center; background-image: url("../../../figma/svg/add_black_16.svg"); background-size: 14px; } 
.visitor-info-wrap .visitor-table-toolbar .visitor-table-btn button.visitors-alarm-btn { width: 60px; border: 1px solid var(--clr-w800); } 

.visit__content-reservation .input-box { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; padding-bottom: 24px; border-bottom: 1px solid rgba(0, 0, 0, 0.05); }
.visit__content-reservation .input-box .datepicker-style { display: flex; gap: 16px; align-items: center; }
.visit__content-reservation .input-box .datepicker-style input {width: 97px; height: 44px; background-repeat: no-repeat; background-position: right 12px top 50%; font-size: 16px; color: #4c5266; font-weight: 500; padding: 0 40px 0 15px; box-sizing: border-box; background-size: 18px; }
.visit__content-reservation .input-box .datepicker-style input.date_input { width: 175px; background-image: url(../../images/connectplace/common/ico_calendar.png); background-size: 18px; }
.visit__content-reservation .input-box .datepicker-style .time-select-wrap{width: auto;}
.visit__content-reservation .input-box .datepicker-style .time-select-wrap .ui-selectmenu-button.ui-button { width: 204px; }
.visit__content-reservation .input-box .select-box +.select-box { width: 95px !important; box-sizing: border-box; min-width: unset; }

.visit__content .input-style:focus { border: 0; }
.visit__content .input-style::placeholder{color: #aaa;}
.visit__content .state input:focus { outline: 0 !important; cursor: default; }
.visit__content .state input+button:hover{cursor: default; opacity: 1;}

.visit__content-reservation .input-box > ul { display: flex; align-items: flex-start; align-content: flex-start; gap: 16px 40px; align-self: stretch; flex-wrap: wrap; }
.visit__content-reservation .input-box > ul > li { display: flex; align-items: center; gap: 16px; }
.visit__content-reservation .input-box > ul > li .label { font-family: var(--txt-font-family); font-size: var(--txt-size-14); color: var(--txt-color-t900); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); white-space: nowrap; width: 120px; height: 21px; }
.visit__content-reservation .input-box > ul > li .label span { color: #1382f4; }
.visit__content-reservation .input-box > ul > li input:not(.date_input, .time_input) { width: 250px; box-sizing: border-box; }
.visit__content-reservation .input-box > ul > li .visit-interviewer-search { display: flex; width: 400px; align-items: center; gap: 16px; }
.visit__content-reservation .input-box.input-information > ul > li input[readonly="readonly"] { background: var(--clr-n40) !important; color: var(--clr-n70) !important; border: 1px solid var(--clr-n60) !important; }
.visit__content-reservation .input-box.input-information > ul > li input.interviewer-name { background: var(--clr-w100) !important; color: var(--txt-color-t900) !important; border: 1px solid var(--clr-w400) !important; }
.visit__content-reservation .input-box > ul > li input.visitor-name { width: 160px; padding-right: 15px;}
.visit__content-reservation .input-box input.double { width: 460px !important; }
.visit__content-reservation .input-box .select-box { width: 100%; }
.visit__content-reservation .input-box > ul > li input.etc { width: 565px; }
.visit__content-reservation .input-box > ul > li .visit-applicant-email { display: flex; align-items: center; gap: 4px; width: 400px; }

.visit__content-reservation .input-box.border .select-box { width:180px; min-width: unset; }
.visit__content-reservation .input-box.border .select-box+.select-box { width: 110px; }
.visit__content-reservation .input-box.border input,.visit__content-reservation .input-box.border .select-box { border: 0; background-color: #fff; }
.visit__content-reservation .input-box.border + .input-box.border { margin-top: 20px; }
.visit__content-reservation .input-box.carInfoAdd .input-style.carNumber { width: 460px !important; }
.visit__content-reservation .input-box.carInfoAdd .input-style.double { width: 815px !important; }

.visit__content-reservation .input-box.border .delete_wrap { position: absolute; bottom: 0; right: 0; }
.visit__content-reservation .input-box.border .delete-btn { color: #4c5266; background-color: #eff0f3; width: 60px; height: 30px; font-size: 14px; font-weight: 600; }
.visit__content-reservation .input-box > ul > li .inputNum span { display: inline-block; margin:0 5px }
.visit__content-reservation .input-box > ul > li .inputNum input { width: 160px; }
.visit__content-reservation .input-box > ul > li .inputNum input.fullnumber { width: 200px; }
.visit__content-reservation .input-box > ul > li input.visitor-name { width: 160px !important; }

.visit__content-reservation .btn-area { display: flex; justify-content: space-between; margin:10px 0 20px;}
.visit__content-reservation .btn-area button { font-size: 14px; letter-spacing: -0.84px; font-weight: 500; border-radius: 3px; color: #fff; height: 33px; padding-left: 34px; padding-right: 14px; background-repeat: no-repeat; background-position: top 50% left 12px; }
.visit__content-reservation .btn-area button:hover { opacity: 0.8; }
.visit__content-reservation .btn-area button.vistors-list { background-color: #fff; color: #1382f4; border: 1px solid #1382f4; background-image: url(../../images/connectplace/common/ico_list_bl.png); background-size: 12px; }
.visit__content-reservation .btn-area button.vistors-add { margin-left: 5px; background-color: #1382f4; background-image: url(../../images/connectplace/common/ico_addMember.png); background-size: 15px; }

/* Visitor info table layout */
.info-wrap.visitor-info-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
.visit__content-reservation .visitor-info-wrap .visitor-title-actions { margin-left: auto; }
.visit__content-reservation .visitor-info-wrap .visitor-title-actions .title-btn-group { display: flex; gap: 16px; }
.visit__content-reservation .visitor-info-wrap .visitor-title-actions .title-btn-group > div { display: flex; gap: 8px; }
.visit__content-reservation .visitor-info-wrap .visitor-title-actions button.ex-upload,
.visit__content-reservation .visitor-info-wrap .visitor-title-actions button.ex-download { gap: 4px;  border: 1px solid var(--clr-g900) !important;}
.visit__content-reservation .visitor-info-wrap .visitor-title-actions button.ex-upload::before,
.visit__content-reservation .visitor-info-wrap .visitor-title-actions button.ex-download::before { content: ""; width: 18px; height: 18px; background: url(../../../figma/svg/exceldownload_36.svg) no-repeat center / 18px 18px; flex-shrink: 0; }
.visit__content-reservation .visitor-info-wrap .visitor-title-actions button.vistors-list { width: 114px; background-color: var(--clr-w100); color: var(--txt-color-p600); border: 1px solid var(--clr-p600); background-image: none; }
.visit__content-reservation .visitor-info-wrap .visitor-table-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar { justify-content: space-between; display: flex; padding: 16px 24px; align-items: center; gap: 16px; align-self: stretch; border: 1px solid var(--clr-w300);  border-radius: 12px 12px 0 0; }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-total span { display: inline-flex; align-items: center; min-height: 36px; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-total #visitorTableTotalCount { color: var(--txt-color-p600); }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-btn { display: flex; align-items: center; gap: 8px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-btn .visitor-checkbox-wrap { display: flex; align-items: center; gap: 8px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-btn > input.visitor-check-all { margin-left: auto; }
.visit__content-reservation .visitor-info-wrap .visitor-table-toolbar .visitor-table-btn > span { display: flex; height: 36px; padding-right: 12px; align-items: center; gap: 4px; flex: 1 0 0; min-width: 0; }
.visit__content-reservation .visitor-info-wrap .visitor-table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--clr-w300) !important; background: var(--clr-w100); border-radius: 0 0 8px 8px; overflow: hidden; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header tr { height: 44px; background: var(--clr-w200); }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th { padding:12px; text-align: left; color: var(--txt-color-t500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); letter-spacing: var(--txt-letter-spacing); white-space: nowrap; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th.visitor-check-header { width: 34px; text-align: center; padding: 0; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th:nth-child(2) { width: 140px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th:nth-child(3) { width: 210px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th:nth-child(4) { width: 220px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th:nth-child(5) { width: 170px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th:nth-child(6) { width: 150px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header.has-car th:nth-child(7) { width: 120px; }
.visit__content-reservation .visitor-info-wrap .visitor-table-header th { border-bottom: 1px solid var(--clr-w300); }
.visit__content-reservation .visitor-info-wrap #visitors .visitor-row { height: 40px; background: var(--clr-w100); }
.visit__content-reservation .visitor-info-wrap #visitors .visitor-cell { vertical-align: middle; }
.visit__content-reservation .visitor-info-wrap #visitors .visitor-row + .visitor-row .visitor-cell { border-top: 1px solid var(--clr-w300); }
.visit__content-reservation .visitor-info-wrap #visitors .visitor-check-item { text-align: center; padding: 0; }
.visit__content-reservation .visitor-info-wrap .visitor-check-all,
.visit__content-reservation .visitor-info-wrap .visitor-row-check { width: 14px; height: 14px; accent-color: #8f95a4; cursor: pointer; }
.visit__content-reservation .visitor-info-wrap #visitors .input-style,
.visit__content-reservation .visitor-info-wrap #visitors .input-style.double,
.visit__content-reservation .visitor-info-wrap #visitors .input-style.carNumber,
.visit__content-reservation .visitor-info-wrap #visitors .search-input { width: 100% !important; }
.visit__content-reservation .visitor-info-wrap #visitors .input-style { height: 48px; border: 0; background: transparent; color: var(--txt-color-t900); font-size: var(--txt-size-14); padding:12px; }
.visit__content-reservation .visitor-info-wrap #visitors .input-style::placeholder { font-size: var(--txt-size-14); color: var(--txt-color-t70); }
.visit__content-reservation .visitor-info-wrap #visitors .inputNum { display: flex; align-items: center; width: 100%; }
.visit__content-reservation .visitor-info-wrap #visitors .inputNum input { width: 100%; }
.visit__content-reservation .visitor-info-wrap #visitors .visitor-row:not(.carInfoAdd) .visitor-car-item { display: none; }
.visitor-result-row-template { display: none !important; }

/*
.visit__content-reservation #chkSameUser.checkYn { position: static; display: inline-flex; align-items: center; margin: 0; width: auto; height: 28px; background: transparent; border-radius: 0; }
.visit__content-reservation #chkSameUser.checkYn .txt { position: relative; display: inline-flex; align-items: center; justify-content: flex-start; width: auto; padding-right: 56px; height: 24px; color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-regular); letter-spacing: var(--txt-letter-spacing); line-height: var(--txt-line-height); }
.visit__content-reservation #chkSameUser.checkYn .txt::before { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 48px; height: 28px; border-radius: 16px; background-color: var(--clr-w400); transition: background-color .24s ease; }
.visit__content-reservation #chkSameUser.checkYn .txt::after { content: ""; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 16px; background-color: var(--clr-w100); background-image: url(../../../figma/svg/minus_14.svg); background-repeat: no-repeat; background-position: center; background-size: 14px 14px; display: flex; align-items: center; justify-content: center; transition: right .24s cubic-bezier(.22, .61, .36, 1), background-color .24s ease, box-shadow .24s ease; }
.visit__content-reservation #chkSameUser.checkYn.on .txt::before { background-color: #2f7df6; }
.visit__content-reservation #chkSameUser.checkYn.on .txt::after { right: 3px; background-image: url(../../../figma/svg/check_14.svg); box-shadow: 0 1px 3px rgba(47, 125, 246, 0.25); }
*/

/* 방문 예약 레이어 팝업(#visitorList, #searchMember) — 중앙 정렬, opacity 페이드만(animate.css fadeInDown 미사용) */
@-webkit-keyframes layerPopFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes layerPopFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.layer-pop-wrap .layer-pop-area#visitorList.active,
.layer-pop-wrap .layer-pop-area#searchMember.active {
  top: 50% !important;
  left: 50% !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  transform: translate(-50%, -50%);
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  max-width: calc(100vw - 32px);
  -webkit-animation: layerPopFadeIn 0.25s ease both;
  animation: layerPopFadeIn 0.25s ease both;
}
.layer-pop-wrap .layer-pop-area .pop-cont .search-box-wrap { display: flex; padding: 20px 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; border-radius: 10px; background: var(--clr-n30); }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input { display: flex; align-items: center; gap: 8px; flex: 1 0 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input::-webkit-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input::-moz-placeholder { color: #aaa; font-size: 16px; font-weight: 400; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input:-ms-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input::-ms-input-placeholder { color: #aaa; font-size: 16px; font-weight: 400; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box input::placeholder { color: #aaa; font-size: 16px; font-weight: 400; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box button.search-btn { min-width: 80px; }
.layer-pop-wrap .layer-pop-area .pop-cont .search-box-wrap .sub_txt { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }

.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap { width: 100%; padding: 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result > div { display: flex; padding: 8px 16px; gap: 4px; align-items: center; border: 1px solid var(--clr-w300); border-bottom: 0; border-radius: 8px 8px 0 0; background: var(--clr-w100); }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result > div span { display: inline-flex; align-items: center; min-height: 28px; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result > div #visitorResultTotalCount { color: var(--txt-color-p600); }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; border: 1px solid var(--clr-w300); border-radius: 0 0 8px 8px; overflow: hidden; background: var(--clr-w100); }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table thead th { height: 44px; padding: 0 12px; background: var(--clr-w200); color: var(--txt-color-t500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); text-align: left; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table thead th:first-child { width: 46px; text-align: center; padding: 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table tbody td { height: 40px; padding: 0 12px; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); border-top: 1px solid var(--clr-w300); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table tbody tr:first-child td { border-top: 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table tbody td:first-child { text-align: center; padding: 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table tbody td input[type="checkbox"],
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table thead th input[type="checkbox"] { width: 18px; height: 18px; accent-color: #8f95a4; cursor: pointer; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap.result table #visitorNoResult .no-list{ display: table-row-group; align-items: center; align-self: stretch; gap: 20px; }

.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li { cursor: pointer; display: flex; flex-flow: row nowrap; align-items: center; justify-content: start; gap: 20px; padding: 5px 30px; box-sizing: border-box; border-bottom: 1px solid #f1f2f6; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li:hover { background-color: #f0f6ffcc; }

.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li.no-list { cursor: default; flex-flow: column nowrap; gap: 20px; padding: 50px 0; font-size: 16px; color: var(--txt-color-t900); text-align: center; border: 1px solid var(--clr-w300) !important; border-top: 0 !important; border-radius: 8px; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li.no-list .no-result-img { background: url(../../../figma/svg/result_empty_80.svg); background-repeat: no-repeat; background-size: 80px; background-position: center; width: 80px; height: 80px; }

.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .checkBox { min-width: 20px; height: 20px; border-radius: 10px; background-color: #bcc1ce; background-image:url(../../images/connectplace/common/ico_check_y.png); background-repeat: no-repeat; background-position: center; background-size: 10px; text-indent: -9999px; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .checkBox.active { background-color: #59a7f7; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li:first-child { border-top: 0; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li:last-child { border-bottom: 0px; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info-box { width: 100%; position: relative;}
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info { display: flex; align-items: end; gap: 5px; font-size: 18px; color: #222; font-weight: 600; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info > span { display: inline-block; color: #59a7f7; font-size: 14px; font-weight: 500; }
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info2 {display: flex; flex-flow: column; justify-content: start; align-items: start; margin-top: 3px;}
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info2 > span { display: inline-block; line-height: 1.3; font-size: 15px; color: #4c5266;}
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap li .list-info3 { position: absolute; right: 0; bottom: 0; font-size: 14px; color: #aaaaaa; font-weight: 400; letter-spacing: -0.88px;}
.layer-pop-wrap .layer-pop-area .pop-cont .visit-pop-btn-area { display: flex; justify-content: flex-end; align-items: flex-start; align-self: stretch; gap: 8px; flex: 1 0 0; }

.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont { gap: 16px; padding: 0; width: 100%; box-shadow: none; background: transparent; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .search-box-wrap { margin: 0; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap #searchMemberPopupTitle { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #searchMemberCount { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent { display: flex; height: 326px; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberResultTable { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .team-schedule-popup-table-head { flex-shrink: 0; width: 100%; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .team-schedule-popup-table-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow: hidden; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .team-schedule-popup-table-scroll { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle { width: 100%; border-collapse: collapse; table-layout: fixed; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle thead th { text-align: left; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); background: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle tbody td { font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle .table-col-no { width: 48px; height: 44px; padding: 0 12px 0 24px; text-align: center; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle .table-col-name { height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle .table-col-dept { height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle .table-col-action { width: 72px; height: 44px; padding: 0 24px 0 12px; text-align: center; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #searchMemberMorePopupContent .tableStyle .member_choice_btn { color: var(--txt-color-p600); cursor: pointer; font-weight: var(--txt-weight-medium); }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #memberNoResult.search-member-no-result { display: flex; flex: 1 1 auto; align-items: stretch; justify-content: center; width: 100%; margin: 0; padding: 0; border: 0; min-height: 0; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #memberNoResult.search-member-no-result li.no-list { width: 100%; border: 1px solid var(--clr-w300) !important; border-top: 0 !important; border-radius: 0 0 8px 8px; }
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont #memberNoResult.search-member-no-result li.no-list:hover { background-color: var(--clr-w100); }

.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont { gap: 16px; padding: 0; width: 100%; box-shadow: none; background: transparent; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .search-box-wrap { margin: 0; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap #visitorListPopupTitle { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #visitorResultTotalCount { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent { display: flex; height: 326px; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorResultTable { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .team-schedule-popup-table-head { flex-shrink: 0; width: 100%; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .team-schedule-popup-table-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow: hidden; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .team-schedule-popup-table-scroll { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle { width: 100%; border-collapse: collapse; table-layout: fixed; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle thead th { text-align: left; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); background: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle tbody td { font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle .table-col-check { width: 46px; height: 44px; padding: 0; text-align: center; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle .table-col-name { height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle .table-col-company { height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle .table-col-mobile { width: 120px; height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle .table-col-visit-time { width: 140px; height: 44px; padding: 0 24px 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle tbody td input[type="checkbox"],
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorListMorePopupContent .tableStyle thead th input[type="checkbox"] { width: 18px; height: 18px; accent-color: #8f95a4; cursor: pointer; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorNoResult.visitor-no-result { display: flex; flex: 1 1 auto; align-items: stretch; justify-content: center; width: 100%; margin: 0; padding: 0; border: 0; min-height: 0; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorNoResult.visitor-no-result li.no-list { width: 100%; border: 1px solid var(--clr-w300) !important; border-top: 0 !important; border-radius: 0 0 8px 8px; }
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont #visitorNoResult.visitor-no-result li.no-list:hover { background-color: var(--clr-w100); }

/* 접견자 선택 팝업 */
.layer-pop-wrap .layer-pop-area#searchMember { width: 640px; max-width: 640px; }
.layer-pop-wrap .layer-pop-area#visitorList { width: 640px; max-width: 640px; }
.layer-pop-wrap .layer-pop-area#visitorList .pop-cont .search-box { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area#visitorList .pop-cont .search-box button.search-btn { top: 50%; }
.layer-pop-wrap .layer-pop-area#searchMember .pop-cont .search-box { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area#searchMember .pop-cont .search-box .select-box { max-width: 100px; min-width: 85px; border: 0; }
.layer-pop-wrap .layer-pop-area#searchMember .pop-cont .search-box button.search-btn { top: 50%; }

/* 나의 방문 예약 현황 페이지 */
.tbl-origin { width: 100%; table-layout: fixed; word-break: keep-all; text-align: center; }
.tbl-origin th, .tbl-origin td { border: 1px solid #f0f0f0; }
.tbl-origin th { height: 50px; background-color:#e8f3ff; font-size: 17px; font-weight: 600; color: #5f6b8b; letter-spacing: -0.5px; }
.tbl-origin td { height: 90px; font-size: 16px; font-weight: 400; color: #4c5266; letter-spacing: -0.5px; }
.tbl-origin tbody tr:hover td { cursor: pointer; color:#1382f4; }

.visit__content-list .search-area { background: unset; display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 0; }
.visit__content-list .search-area .total { font-size: 22px; font-weight: 600; letter-spacing: -1.32px; color: #333333; }
.visit__content-list .search-area .total span { font-size: 30px; color: #1382f4; font-weight: 600; }
.visit__content-list .search-area select { width: 187px; height: 44px; background-color: #f5f5f5; padding:0 20px; border: none; background-image: url(../../images/connectplace/common/ico_triangle_down_b.svg); background-repeat: no-repeat; background-size: 10px; background-position: top 50% right 20px; font-size: 16px; font-weight: 400; color: #4c5266; }
.visit__content-list .search-area .search-box { position: relative; display: inline-block; }
.visit__content-list .search-area .search-box input { width: 298px; height: 44px; background-color: #fff; font-size: 16px; font-weight: 500; color: #333; padding: 0 20px; }
.visit__content-list .search-area .search-box input::placeholder{color: #aaa;}
.visit__content-list .search-area .search-box button { position: absolute; top: 50%; right: 20px; text-indent: -9999px; width: 17px; height: 17px; background: url(../../images/connectplace/common/ico_search.png) no-repeat center/cover; transform: translateY(-50%); }
.visit__content-list .tbl-wrap { border-top: 1px solid #4c5266; margin-top: 20px; }
.visit__content-list .tbl-wrap table td button { display: block; width: 144px; height: 33px; margin: 0 auto; }
.visit__content-list .tbl-wrap table td button + button { margin-top: 5px; }
.visit__content-list .tbl-wrap table td span.fc-red { color: #ff1515 !important; }
.visit__content-list .tbl-wrap table td span.fc-bl { color: #1382f4 !important; }
.visit__content-list .tbl-wrap table td span.fc-gy { color: #999999 !important; }
.visit__content-list .tbl-wrap tr.none-result:hover td { cursor: default; color: #4c5266; }

/* 방문 예약 상세 */
.visit__content-reservation.state .visitor-info-wrap .input-box.border{ padding-right: 120px;}

.visit__content-reservation .input-box.border .resend_box { text-align: center; position: absolute; top: 50%; transform: translateY(-50%); right: 20px; }
.send_btn { display: flex; justify-content: center; gap: 10px; margin-bottom: 20px; }
.send_btn li { width: 30px; height: 30px; border-radius: 100%; }
.send_btn li:nth-child(1) { background-color: #fae300; background-image: url(../../images/connectplace/common/ico_kakao.png); background-position: center; background-repeat: no-repeat; background-size: 18px; }
.send_btn li:nth-child(2) { background-color: #28a7e1; background-image: url(../../images/connectplace/common/ico_mail.png); background-position: center; background-repeat: no-repeat; background-size: 12px; }
.resend_btn { font-size: 16px; font-weight: 600; letter-spacing: 0.96px; border-radius: 3px; background-color: #06315f; width: 100px; height: 35px; color: #fff; margin: 0 auto; }

/* //////////----------////////// */
/* /////////--스마트락커--//////// */
/* 스마트락커 예약 */
.smartlocker{padding: 0;}
#lockerMap div {position: absolute;top: 0;left: 0;bottom: 0;right: 0;overflow: hidden; }
#lockerListByFloor {display: none; }
#lockerListByFloor .locker-list {padding: 50px;width: 1370px;margin: 0 auto; }
.locker-list .head {display: -ms-flexbox;width: 100%;display: flex;align-items: center;justify-content: center; }
.locker-list .head .legend {position: absolute;right: 70px;display: flex;flex-flow: row nowrap;align-items: center;justify-content: center; }
.locker-list .head .legend li {margin-left: 10px;font-size: 14px;font-weight: 500;color: #666; }
.locker-list .head .legend li img {margin-right: 5px; }
.locker-list-wrap > li {margin-top: 20px; }
.locker-list-area {width: 100%;display: flex;flex-flow: row nowrap;align-items: center;justify-content: start; }
.locker-list-area .info-box {position: relative;display: flex;flex-flow: column nowrap;align-items: start;justify-content: space-between;width: 170px;height: auto;padding: 15px 5px;box-sizing: border-box;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd; }
.locker-list-area .info-box h3 {font-size: 18px;color: #222; }
.locker-list-area .info-box p {font-size: 15px;display: block;margin-top: 10px;color: #008aff; }
.locker-list-area .info-box span {font-size: 15px; color: #222; display: block; margin-top: 5px; }
.locker-list-box {display: flex;align-items: end; }
.locker-list-box ul {display: flex;flex-flow: column nowrap; }
.locker-list-box ul li {position: relative;width: 95px;height: 70px;border: 1px solid #ddd;text-align: center;font-size: 16px;color: #222;padding: 10px 5px;box-sizing: border-box;background-color: #fff;cursor: default; }
.locker-list-box ul li.unavailable {background-image: url(../../images/connectplace/common/icon_locker_unavailable.png);background-size: 100% 100%;border: 0; }
.locker-list-box ul li.public,
.locker-list-box ul li.use {background-color: #666;color: #fff; }
.locker-list-box ul li.my {background-color: #008aff;color: #fff; }
.locker-list-box ul li.available:hover {background-color: #008aff;color: #fff; }
.locker-list-box ul li .name {width: 83px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; }
.locker-list-box ul li.available .book-btn {display: none;position: absolute;right: 0;bottom: 0;width: 100%;height: 28px;line-height: 28px;text-align: center;background-color: #222;color: #fff;font-size: 16px;cursor: pointer; }
.locker-list-box ul li.available:hover .book-btn {display: block; }

/* 스마트락커 맵보기 팝업 */
.layer-pop-area.lockerList {width: auto;min-width: 600px; }
.layer-pop-area.lockerList .pop-cont .title {display: flex;flex-flow: row nowrap;justify-content: start;align-items: center;padding-bottom: 0;box-sizing: border-box;gap: 10px; border-bottom: 0; }
.layer-pop-area.lockerList .pop-cont .title .bar {width: 5px; height: 20px;border-radius: 0;background: #59A7F7;margin-right: 0; }
.layer-pop-area.lockerList .pop-cont .title .name {font-size: 20px;font-weight: 600;color: #222; letter-spacing: -0.88px; }
.layer-pop-area.lockerList .pop-cont .title .total {color: #008aff;font-size: 16px;margin-left: 15px; }
.layer-pop-area.lockerList .pop-cont .legend {position: absolute; top: 25px;right: 25px;display: flex;flex-flow: row nowrap;align-items: center;justify-content: center; }
.layer-pop-area.lockerList .pop-cont .legend li {margin-left: 10px;font-size: 14px;font-weight: 500;color: #666; }
.layer-pop-area.lockerList .pop-cont .legend li img {margin-right: 5px; }
.layer-pop-area.lockerList .pop-cont .list {display: flex;align-items: end;justify-content: start;margin-top: 20px; }

.locker-box li {position: relative;width: 120px;height: 125px;border: 1px solid #d5d5d5;font-size: 16px;font-weight: 500;color: #222;padding: 0 10px;box-sizing: border-box;background-color: #fff;cursor: default; }
.locker-box li.unavailable {background-image: url(../../images/connectplace/common/icon_locker_unavailable.png);border: 0; }
.locker-box li.public,
.locker-box li.use {background-color: #666;color: #fff; }
.locker-box li.my {background-color: #008aff;color: #fff; }
.locker-box li div > span {font-size: 28px;font-weight: 600;margin-left: 10px; }
.locker-box li .name {position: absolute;width: 100px;right: 10px;bottom: 10px;text-align: right;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; }
.locker-box li.available:hover {background-color: #008aff;color: #fff; }
.locker-box li.available .book-btn {display: none;position: absolute;right: 0;bottom: 0;width: 100%;height: 33px;line-height: 33px;text-align: center;background-color: #222;color: #fff;font-size: 16px;font-weight: 500;cursor: pointer; }
.locker-box li.available:hover .book-btn {display: block; }
.layer-pop-area.lockerResv, .layer-pop-area.setting,
.layer-pop-area.cancel, .layer-pop-area.return,
.layer-pop-area.change-pin, .layer-pop-area.change-period {width: auto;min-width: unset; }
.layer-pop-area.mylocker {min-width: 500px; }
.layer-pop-area.alert, .layer-pop-area.complete, .layer-pop-area.confirm-period {width: auto;min-width: 450px; }
.layer-pop-area.lockerList .pop-cont, .layer-pop-area.lockerResv .pop-cont,
.layer-pop-area.setting .pop-cont, .layer-pop-area.mylocker .pop-cont,
.layer-pop-area.cancel .pop-cont, .layer-pop-area.return .pop-cont,
.layer-pop-area.change-pin .pop-cont {position: relative; padding: 20px 30px 30px; }

.layer-pop-area.lockerResv .pop-cont > .title,
.layer-pop-area.setting .pop-cont > .title,
.layer-pop-area.cancel .pop-cont > .title,
.layer-pop-area.return .pop-cont > .title,
.layer-pop-area.change-pin .pop-cont > .title,
.layer-pop-area.change-period .pop-cont > .title {color: #333; font-size: 17px;font-weight: 500;width: 100%;text-align: center; margin:0 0 10px; }

.layer-pop-area.alert .pop-cont .message p,
.layer-pop-area.complete .pop-cont .message p,
.layer-pop-area.confirm-period .pop-cont .message p {font-size: 18px;color: #222;font-weight: 500;width: 100%;text-align: center;line-height: 30px; }

.layer-pop-area.complete .pop-cont .message p.name,
.layer-pop-area.confirm-period .pop-cont .message p.period {color: #008aff; }

.layer-pop-area.complete .pop-cont .message p:nth-child(2),
.layer-pop-area.confirm-period .pop-cont .message p:nth-child(2) {margin: 10px auto 0; }

.layer-pop-area.mylocker .pop-cont > div {position: relative; }

.layer-pop-area.lockerResv .pop-cont .locker-info-box,
.layer-pop-area.setting .pop-cont .locker-info-box,
.layer-pop-area.mylocker .pop-cont .locker-info-box,
.layer-pop-area.cancel .pop-cont .locker-info-box,
.layer-pop-area.return .pop-cont .locker-info-box,
.layer-pop-area.change-pin .pop-cont .locker-info-box,
.layer-pop-area.change-period .pop-cont .locker-info-box {display: flex;flex-flow: column nowrap;width: 100%;margin: 0 auto;border: 1px solid rgba(0, 0, 0, 0.08); padding: 15px 20px;box-sizing: border-box; }

.layer-pop-area.mylocker .pop-cont .locker-info-box {width: 100%;padding-bottom: 45px; }
.layer-pop-area.change-pin .pop-cont .locker-info-box {padding: 10px 20px; }

.locker-info-box ul,
.password-info-box ul {display: flex;margin-bottom: 10px; }
.locker-info-box ul li { display: flex; flex-flow: row nowrap; align-items: center; }
.locker-info-box ul li.title,
.password-info-box ul li.title { color: #4C5266; font-size: 16px; font-weight: 600;transform: skew(-0.1deg);margin-right: 15px; white-space: nowrap; }
.password-info-box ul li.title {width: 100px;line-height: 44px; }
.password-info-box ul li.title.en {width: 146px; }

.layer-pop-area.change-period .pop-cont .locker-info-box ul li.title {width: 120px; }
.layer-pop-area.change-period .pop-cont .locker-info-box ul li.title.en {width: auto; }

.locker-info-box ul li.title::before {display: none;width: 3px;height: 12px;content: "";background-color: #ddd;border-radius: 1px;box-sizing: border-box;margin-right: 10px; }
.locker-info-box ul li.name { font-size: 18px;font-weight: 600;color: #008aff; }
.locker-info-box ul li div.period {position: relative;width: 120px; }
.locker-info-box ul li div.period .selected {width: 100%;height: 34px;text-align: left;padding: 0 23px 0 10px;border: 1px solid #ddd;box-sizing: border-box;font-size: 15px;color: #222;background: url("../../images/connectplace/common/select_arrows.png") center right 8px no-repeat;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }
.locker-info-box ul li div.period .selected.active {background: url("../../images/connectplace/common/select_arrows2.png") center right 8px no-repeat; }
.locker-info-box ul li div.period ul {display: none;width: 100%;border: 1px solid #ddd;background: #fff;box-sizing: border-box;box-shadow: 2px 0px 3px #33333310; }
.locker-info-box ul li div.period .selected.active + ul {display: block;position: absolute !important;z-index: 1 !important;top: 36px;right: 0; }
.locker-info-box ul li div.period ul button {width: 100%;height: 30px;font-size: 15px;color: #222;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }
.locker-info-box ul li div.period ul li button:hover,
.locker-info-box ul li div.period ul li button:focus {background-color: #ededed; }
.locker-info-box ul li.period,
.locker-info-box ul li.date {font-size: 16px; font-weight: 500; color:#151515; }
.locker-info-box ul li.date.og {color: #ff6e30; }
.locker-info-box ul li.date span {margin-left: 5px;color: #ff0000;font-weight: 600; }
.locker-info-box ul li > span {display: inline-block;position: relative; }
.locker-info-box ul li .datepicker {font-size: 15px;color: #222;border-radius: 0;cursor: pointer;caret-color: transparent; }
.locker-info-box ul li .datepicker, .mylocker .pop-cont-locker ul li .datepicker { width: 100%; height: 44px; border:1px solid rgba(0, 0, 0, 0.08); padding:0 15px; box-sizing: border-box; background:url(../../images/connectplace/common/ico_calendar.png) no-repeat right 12px top 50%/18px; }
.locker-info-box ul li .ui-datepicker-trigger {position: absolute;width: 30px;height: 30px;top: 2px;right: 0;background: url("../../images/connectplace/common/calendar_icons.png") no-repeat 50%; }
.locker-info-box #typeDay, .locker-info-box #settingTypeDay, .locker-info-box ul:last-child {margin-bottom: 0; }
.locker-info-box ul li.summary { color: #59A7F7; margin-left:75px; font-size: 14px; font-weight: 500; }
.layer-pop-area.change-period .pop-cont .locker-info-box ul li.summary {margin-left: 140px; }
.locker-info-box .change-box {position: absolute;left: 0;bottom: 0;width: 100%;height: 35px;margin-top: 20px; }
.change-box .change-pin,
.change-box .change-period {float: left;width: 50%;height: 35px;text-align: center;line-height: 35px;color: #fff;font-size: 16px;background-color: #656565;border-radius: 0px;box-sizing: border-box;cursor: pointer; }
.change-box .change-period {background-color: #454545; }
.change-box .change-period.disabled {background: #d5d5d5;color: #999;pointer-events: none; }

/* 스마트락커 비밀번호 설정 팝업 */
.password-info-box {display: flex;flex-flow: column nowrap;width: auto;margin: 0 auto;padding: 10px; padding-bottom: 0;box-sizing: border-box; }
.password-info-box ul:last-child {margin-bottom: 0; }
.password-info-box ul input { border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 0; width: 200px; height: 44px; line-height: 44px; padding: 0 15px; box-sizing: border-box; font-family: unset !important; text-align: center; font-size: 14px; }
.password-info-box ul span {display: none;font-size: 16px;margin-left: 5px; }
.password-info-box ul span.success {color: #58c302; }
.password-info-box ul span.fail {color: #ff0f31; }
.password-info-box ul span.active {display: inline-block; }

/* //////////--목록보기 / 맵보기---////////// */
.smartlocker-map iframe { position: relative; width: 100%; height: 100%; }
.smartlocker-map button { display: flex; align-items: center; justify-content: center; padding:10px 20px; gap: 10px; background-color: #59A7F7cc; border-radius: 5px; color: #fff; font-size: 18px; font-weight: 600; }
.smartlocker-map button:hover { background-color: #59A7F7; opacity: 1; }
.smartlocker-map button i { display: block; width: 30px; height: 30px; border-radius: 100%; background-image: url(../../images/connectplace/common/ico_locker.png); background-repeat: no-repeat; background-position: center; background-size: 20px 22px; background-color: #fff; }
.smartlocker-map button.my::before { position: absolute; right: 0; bottom: 0; content: "MY"; color: #fff; font-weight: 400; font-size: 10px; background-color: #0f447c; line-height: 15px; text-align: center; width: 22px; height: 15px; border-radius: 2px 2px 5px 2px; }

.smartlocker .smartlocker_head {position: absolute; top: 50px; right:50px; }
.smartlocker_head h1 { font-size: 36px; font-weight: 600; color: #4c5266; letter-spacing: -2.16px; padding-bottom: 20px; border-bottom: 1px solid #f0f0f0; }
.smartlocker_head .btn-area { position: absolute; z-index: 100; bottom: -70px; left: 0; display: flex; align-items: center; margin-top: 20px; width: 100%; }
.smartlocker_head .type_btn button { width: 100px; height: 40px; border-radius: 3px; color: #fff; box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.11); -webkit-box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.11); font-weight: 500; font-size: 20px; background-color: #606c8c; }
.smartlocker_head .type_btn button.active { background-color: #59a7f7; font-weight: bold; }
.smartlocker_head .type_btn button:hover { background-color: #343f5b; }
.smartlocker_head .type_btn button.active:hover { background-color: #3e95ec; }
.smartlocker_head .info_btn { margin-left: auto; }
.smartlocker_head .info_btn button { font-size: 16px; color: #4c5266; font-weight: bold; letter-spacing: -0.16px; background-color: #e8f3ff; border-radius: 3px; box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.02); width: 180px; height: 36px; }
.smartlocker_head .info_btn button i { display: inline-block; width: 16px; height: 16px; background: url(../../images/icon/ico_info.png) no-repeat center/cover; margin-bottom: -2px; margin-right: 5px; }
.smartlocker_head .info_btn button:hover { opacity: 0.8; }

.smartlocker_head ul.legend {display: none; display: flex; z-index: 10; }
.smartlocker_head ul.legend li, .layer-pop-area.lockerList .pop-cont .legend li { float: left; position: relative; margin-left: 0; margin-right: 10px; font-weight: 500; color: #606c8c; letter-spacing: -0.96px; padding-left: 22px; }
.smartlocker_head ul.legend li::before, .lockerList ul.legend li::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; }
.smartlocker_head ul.legend li:nth-child(1):before, .lockerList ul.legend li:nth-child(1):before { background-image: repeating-linear-gradient(135deg, #fff, #dcdfe6 3px); }
.smartlocker_head ul.legend li:nth-child(2):before, .lockerList ul.legend li:nth-child(2):before { background-color: #dcdfe6; }
.smartlocker_head ul.legend li:nth-child(3):before, .lockerList ul.legend li:nth-child(3):before { background-color: #fff; border: 1px solid #d9d9d9; }
.smartlocker_head ul.legend li:nth-child(4):before, .lockerList ul.legend li:nth-child(4):before { background-color: #1a84f4; }

.smartlocker .smartlocker_body { position: relative; width: 100%; overflow: hidden; }
.smartlocker .smartlocker_body .smartlocker-map { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; width: calc(100vw - 380px); height: calc(100vh - 64px); overflow: hidden; background-size: 200%;}
.smartlocker-location { display: flex; justify-content: space-between; align-items: center; }
.smartlocker-location h5 { font-size: 26px; font-weight: bold; color: #333; display: inline-block; margin-right: 10px; letter-spacing: -0.88px; }
.smartlocker-location span, .layer-pop-area.lockerList .pop-cont .title .total { font-size: 16px; font-weight: 500; color: #59A7F7; letter-spacing: -0.96px; margin-left: 0; }

.smartlocker-list-wrap { width: 100%; max-width: 100%; overflow-x: auto; margin: 20px 0 30px; border-top: 0; }
.smartlocker-list-wrap::-webkit-scrollbar { height: 12px; }
.smartlocker-list-wrap::-webkit-scrollbar-thumb { background-color: #dcdfe6; border-radius: 10px; }
.smartlocker-list-wrap::-webkit-scrollbar-track { background-color: #efefef; border-radius: 10px; }
.smartlocker-list { display: flex; flex-wrap: nowrap; }
.smartlocker-list .row { display: flex; flex-direction: column; flex: unset; }
.smartlocker-list .row, ul.locker-box { border-top: 1px solid #5a6681; max-width: 165px; min-width: 110px; width: 100%; }
.smartlocker-list .row+.row .box, ul.locker-box + ul.locker-box li { border-left: 0; }
.smartlocker-list .row .box,.locker-box li { width: 100%; height: 80px; border: 1px solid #f0f0f0; position: relative; padding: 10px 10px 10px 15px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; background-color: #fff; color: #5a6681; font-size: 14px; }
.smartlocker-list .row .box+.box, .smartlocker-list .row .box:first-child, .locker-box li + li, .locker-box li:first-child { border-top: 0; }
.smartlocker-list .row .box:not(.impossible, .using, .public), .locker-box li:not(.use, .public, .unavailable) { cursor: pointer; }
.smartlocker-list .row .box.active:not(.box.using,.box.public,.box.impossible,.box.mine), .smartlocker-list .row .box:hover:not(.box.using,.box.public,.box.impossible,.box.mine), .locker-box li.available:hover { color: unset; background-color: #f0f6ff; transition: all 0.3s; }
.smartlocker-list .row .box.impossible,.locker-box li.unavailable { background-image: repeating-linear-gradient(135deg, #fff, #dcdfe6 1px); }
.smartlocker-list .row .box.using,.smartlocker-list .row .box.public, .locker-box li.public,.locker-box li.use { background-color: #dcdfe6; color: #5a6681; }
.smartlocker-list .row .box.mine, .locker-box li.my { background-color: #1a84f4; }
.smartlocker-list .row .box.mine .number, .smartlocker-list .row .box.mine .number span, .smartlocker-list .row .box.mine .name, .locker-box li.my .name, .locker-box li.my, .locker-box li.my div > span { color: #fff; }
.smartlocker-list .row .box .number { font-size: 14px; font-weight: 500; color: #5a6681; }
.smartlocker-list .row .box .number span, .locker-box li div > span { font-size: 20px; font-weight: 600; color: #5a6681; margin-left: 3px; letter-spacing: -0.88px; }
.smartlocker-list .row .box .name, .locker-box li .name { font-size: 14px; font-weight: 500; color: #5a6681; letter-spacing: -1.08px; text-align: right; }
.smartlocker-list .row .box button, .locker-box li.available .book-btn { font-size: 16px; font-weight: bold; letter-spacing: -0.96px; color: #fff; background-color: #343f5b; border-radius: 3px; width: 100px; height: 40px; line-height: 40px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: none; }
.smartlocker-list .row .box.active button, .locker-box li.available:hover .book-btn { display: block; }
.smartlocker-list .row .box.active button:hover, .locker-box li.available .book-btn:hover { opacity: 1; background-color: #26314B; transition: all 0.2s; }
.smartlocker-list .row .box.mine button { background-color: #ffffff; color: #26304b; box-shadow: 1px 1px 10px rgba(0, 0, 0, .1); -webkit-box-shadow:1px 1px 10px rgba(0, 0, 0, .1);}
.pop-locker-rsv-cont { padding-bottom: 20px; border-bottom: 1px solid #f0f0f0; }
.pop-locker-rsv-cont.border-none { border: none !important; }
.pop-locker-rsv-cont h5 { font-size: 18px; font-weight: 400; color: #5a6681; letter-spacing: -1.08px; margin-bottom: 15px; }
.pop-locker-rsv-cont .txt-list { padding: 20px; background-color: #f5f5f5; }
.pop-locker-rsv-cont .txt-list li { margin-bottom: 10px; position: relative; padding-left: 15px; }
.pop-locker-rsv-cont .txt-list li:last-child { margin-bottom: 0px; }
.pop-locker-rsv-cont .txt-list li::before { content: ''; position: absolute; width: 5px; height: 5px; background-color: #4c5266; border-radius: 100%; top: 50%; left: 0; transform: translateY(-50%); }
.pop-locker-rsv-cont .txt-list li span { font-size: 16px; font-weight: 400; color: #4c5266; letter-spacing: -1.12px; display: inline-block; margin-right: 20px; }
.pop-locker-rsv-cont .txt-list li p { display: inline-block; font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #5f6b8b; }
.pop-locker-rsv-cont .txt-list li p b { font-weight: bold; }
.pop-locker-rsv-cont .txt-list li p.blue { font-weight: bold; color: #1382f4; }
.pop-locker-rsv-cont .locker-pass-input { padding: 20px 0; }
.pop-locker-rsv-cont .locker-pass-input .box { display: flex; align-items: center; margin-bottom: 10px; }
.pop-locker-rsv-cont .locker-pass-input .box:last-child { margin-bottom: 0px; }
.pop-locker-rsv-cont .locker-pass-input .label { font-size: 16px; font-weight: bold; color: #5a6681; letter-spacing: -0.16px; margin-right: 15px; }
.pop-locker-rsv-cont .locker-pass-input input { width: 197px; height: 44px; border: none; background-color: #f0f6ff; font-size: 16px; font-weight: 400; color: #4c5266; letter-spacing: -0.16px; padding: 0 20px; }
.pop-locker-rsv-cont .locker-pass-input .box span { font-size: 14px; font-weight: 400; letter-spacing: -0.84px; color: #59a7f7; margin-left: 10px; }
.pop-locker-rsv-cont .locker-pass-input .box span.success { display: none; }
.pop-locker-rsv-cont .locker-pass-input .box span.fail { display: none; color: #d51f20; }
.pop-locker-rsv-cont .img-wrap { width: 48px; margin: 0 auto 10px; }
.pop-locker-rsv-cont .img-wrap img { width: 100%; }
.pop-locker-rsv-cont .locker-txt { font-size: 18px; font-weight: 400; color: #5a6681; letter-spacing: -1.08px; text-align: center; }
.pop-locker-rsv-cont .smartlocker-location h5 { font-size: 26px; font-weight: bold; color: #333; display: inline-block; margin-right: 10px; margin-bottom: 0px; }
.pop-locker-rsv-cont .smartlocker-list-wrap { margin-bottom: 0px; }
.pop-locker-rsv-cont .smartlocker-list { margin-bottom: 30px; }
.pop-locker-rsv-cont .smartlocker-list-wrap::-webkit-scrollbar { height: 12px; }
.pop-locker-rsv-cont .smartlocker-list-wrap::-webkit-scrollbar-thumb { background-color: #dcdfe6; border-radius: 6.5px; }
.pop-locker-rsv-cont .smartlocker-list-wrap::-webkit-scrollbar-track { background-color: #efefef; border-radius: 6.5px; }
.pop-locker-rsv-cont .smartlocker-list .row .box { min-width: 120px; padding: 15px 10px; }
.pop-locker-rsv-cont .smartlocker-list .row .box .name { text-align: right; }

/* 스마트 락커 예약 팝업 */
.pop-locker-rsv { display: none; position: absolute; top: 50%; left: 50%; background-color: #fff; box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 1.9px 7.8px 7px 0 rgba(0, 0, 0, 0.08); min-width: 490px; width: 490px; }
.pop-locker-rsv.active { display: block; }
.pop-locker-rsv .pop-locker-head { position: relative; padding: 0px 40px; box-sizing: border-box; background-color: #4c5266; height: 60px; }
.pop-locker-rsv .pop-locker-head .pop-locker-tit { text-align: left; color: #fff; font-size: 20px; letter-spacing: -1.2px; font-weight: bold; line-height: 60px; }
.pop-locker-rsv .pop-locker-head .pop-close { width: 16px; height: 16px; background: url(../../images/icon/ico_close_w.png) no-repeat center/cover; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); text-indent: -99999px; font-size: 0; transition: all .4s; }
.pop-locker-rsv .pop-locker-head .pop-close:hover { cursor: pointer; transform: translateY(-50%) rotate(180deg); transition: all 0.4s; }
.pop-locker-rsv .pop-locker-info { padding: 25px; display: flex; align-items: center; }
.pop-locker-rsv .pop-locker-info .pop-locker-box { display: flex; align-items: center; margin-right: 40px; }
.pop-locker-rsv .pop-locker-info .pop-locker-box .pop-locker-img { position: relative; display: flex; flex-flow: column; justify-content: center; width: 140px; height: 100px; background-color: #d0e6fd; overflow: hidden; }
.pop-locker-rsv .pop-locker-info .pop-locker-box .pop-locker-img>img { height: 100%; width: auto; margin: 0 auto; }
.pop-locker-rsv .pop-locker-info .pop-locker-txt { margin-left: 25px; text-align: left; }
.pop-locker-rsv .pop-locker-info .pop-locker-txt>h5 { font-size: 24px; font-weight: 700; color: #333333; }
.pop-locker-rsv .pop-locker-info .pop-locker-txt>p { font-weight: 500; color: #333333; }
.pop-locker-rsv .pop-locker-info .pop-locker-txt>p>em { font-weight: 500; color: #1382f4; }
.pop-locker-rsv .pop-locker-bottom { padding: 12px 11px 23px 35px; background-color: #f5f5f5; display: flex; align-items: flex-end; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-notice { font-size: 14px; font-weight: 500; color: #59a7f7; letter-spacing: -0.84px; margin-bottom: 8px; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box { display: flex; align-items: center; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box.input_group { margin-bottom: 5px; position: relative; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-date-label { font-size: 16px; font-weight: 600; color: #606c8c; letter-spacing: -0.96px; margin-right: 15px; min-width: 30px; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box { position: relative; width: 210px; height: 38px; background-color: #fff; padding: 0 15px; border: none; background-image: url(../../images/icon/ico_triangle_down_b.svg); background-repeat: no-repeat; background-size: 10px; background-position: top 50% right 20px; font-size: 16px; font-weight: 400; color: #4c5266; display: inline-block; vertical-align: middle; box-sizing: border-box; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box .pop-locker-btn-select { width: 100%; height: 100%; text-align: left; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box .pop-locker-select-list { display: none; position: absolute; width: 100%; top: 40px; left: 0; padding: 0; box-sizing: border-box; box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.14); -webkit-box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.14); border-radius: 6px; background-color: #fff; overflow: hidden; z-index: 10; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box .pop-locker-select-list li { width: 100%; height: 47px; box-sizing: border-box; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box .pop-locker-select-list li>button { width: 100%; height: 100%; background-color: #fff; color: #333; font-size: 16px; font-weight: 500; cursor: pointer; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; text-align: center; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-select-box.active .pop-locker-select-list { display: block; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-input-group { position: relative; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-date .pop-locker-date-box .pop-locker-input-group .pop-locker-date-input { height: 38px; background-color: #fff; border: none; background-image: url(../../images/icon/ico_calendar.png); background-repeat: no-repeat; background-position: top 50% right 12px; background-size: 18px; padding: 0 15px; font-size: 16px; font-weight: 400; color: #5f6b8b; box-sizing: border-box; width: 210px; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-rsv-button { margin-left: 20px; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-rsv-button button { width: 144px; height: 80px; border-radius: 4px; background-image: linear-gradient(to top, #1382f5, #3695fa); color: #fff; font-size: 18px; font-weight: bold; letter-spacing: -1.08px; transition: all 0.2s ease; }
.pop-locker-rsv .pop-locker-bottom .pop-locker-rsv-button button:hover { background-image: linear-gradient(to top, #1683f5, #1683f5) !important; transition: all 0.4s ease; }

.layer-pop-area.lockerList #lockerListByGroup { max-width:750px; overflow-x: auto; }

.locker-info-box ul.select-list { max-height: 150px; }
.locker-info-box ul { margin-bottom: 0; }
.locker-info-box ul+ul { margin-top: 10px; }
.locker-info-box ul+#selectEndDt { margin-top: 10px; }

/* 스마트락커 예약수정 팝업 */
#locker-modify .pop-locker-bottom { flex-flow: wrap; }
#locker-modify .pop-locker-bottom .pop-locker-notice { width: 100%; font-size: 14px; font-weight: 500; color: #59a7f7; letter-spacing: -0.84px; margin-bottom: 8px; }
#locker-modify .pop-locker-info .pop-locker-txt>div.rsv-info { margin-top: 5px; width: 100%; background-color: #f0f6ff; padding: 5px 10px; }
#locker-modify .pop-locker-info .pop-locker-txt>div.rsv-info span { color: #4c5266; letter-spacing: -0.5px; font-size: 14px; }
#locker-modify .pop-locker-info .pop-locker-txt>div.rsv-info span>em { color: #1382f4; font-weight: 500; margin-right: 5px; }
#locker-modify .pop-locker-info .pop-locker-txt>div.rsv-info span:last-child { margin-left: 5px; }

/* MY락커 */
.mylocker { position: absolute; min-width: unset; }
.mylocker .pop-cont { position: relative; width: auto; height: auto; padding:30px; box-sizing: border-box; }
.mylocker .pop-cont .pop-cont-txt { margin:0 0 10px; color: #333; font-size: 17px; font-weight: 500; width: 100%; text-align: center; }
.mylocker .pop-cont-locker { display: flex; flex-flow: column nowrap; gap: 10px; align-items: start; justify-content: start; width: 100%; height: auto; margin: 0 auto; border: 1px solid rgba(0, 0, 0, 0.08); padding: 20px 0 0; box-sizing: border-box; }
.mylocker.my2 .pop-cont-locker { padding: 20px 0; }
.mylocker .pop-cont-locker ul { width: 100%; display: flex; flex-flow: row nowrap; align-items: center; justify-content: start; margin-bottom: 0; padding: 0 30px; box-sizing: border-box; font-size: 16px; color: #151515; font-weight: 500; letter-spacing: -0.88px; }
.mylocker .pop-cont-locker ul li { display: flex; flex-flow: row nowrap; align-items: center; justify-content: start; text-align: left; }
.mylocker .pop-cont-locker ul li.tit { font-size: 16px; transform: unset; font-weight: 600; color: #4C5266; margin-right: 20px; width: 80px; white-space: nowrap; }
.mylocker .pop-cont-locker ul li.tit::before { display: none; }
.mylocker .pop-cont-locker ul li.num { color: #008aff; font-weight: 600; font-size: 17px; }
.mylocker .pop-cont-locker ul li.alarm { color: #59A7F7; margin: -5px 0 15px 100px; font-size: 14px; font-weight: 500; }
.mylocker .change-box { position: relative; display: flex; align-items: center; width: 100%; height: 35px; margin-top: 10px; }
.mylocker .change-box>div { float: unset; width: 100%; height: 100%; text-align: center; line-height: 35px; color: #fff; font-size: 16px; font-weight:600; opacity: 0.8; background-color:#4c5266; border-radius: 0px; box-sizing: border-box; cursor: pointer; }
.mylocker .change-box .day-change { background-color:#5a6681; }
.mylocker .change-box>div:hover { opacity: 1; transition: all 0.2s; }
.mylocker .day-change.disabled { cursor: default; opacity: 1; background-color: #5a668150; }
.mylocker .day-change.disabled:hover { opacity: 1; cursor: default; }

/* //////////----------////////// */
/* //////////--마이페이지--////////// */
/* //////////----------////////// */
.mypageV2 { display: flex; justify-content: start; align-items: start; gap: 0px; min-width: 1400px; margin: 0 auto; padding-top: 64px; box-sizing: border-box; position: relative; }
.mypageV2__lnb { width: 300px; height: calc(100vh - 64px); position: relative;}
.mypageV2__lnb-tit { font-size: 28px; font-weight:700; color: #fff; line-height: 75px;letter-spacing: -1.2px; white-space: nowrap; padding: 30px 40px; box-sizing: border-box; background-image: linear-gradient(to top, #1382f5, #5aa7f7); }
.mypageV2__lnb-menu li a { display: block; line-height: 50px; font-size: 18px; color: #4c5266; font-weight:600; padding: 0 40px; box-sizing: border-box; background-color:#fff; border: 1px solid rgba(0, 0, 0, 0.08); border-right: 0; }
.mypageV2__lnb-menu li +li a { border-top: 0; }
.mypageV2__lnb-menu li.active a { background: #4c5266; color: #fff; font-weight: 600; border: 1px solid #4c5266; }
.mypageV2__lnb-menu li.active a:hover { opacity: 1; cursor: default; }
.mypageV2__content { position: relative; width:calc(100vw - 300px); height: 100vh; max-height: calc(100vh - 64px); min-height: 650px; overflow-y: auto; margin: 0 auto; padding: 20px 50px 50px; box-sizing: border-box; }
.mypageV2__content-inner{position: relative; max-width: 1600px; margin: 0 auto;}
.mypageV2__content-tit { margin-bottom: 20px; }
.mypageV2__content-tit h2 { flex: 1 0 0; color: #151515; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); padding-bottom: 8px; }
.mypageV2__content-list { border-top: 1px solid #4c5266; }

.mypageV2__content .btn-wrap { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 40px; padding-top: 40px; border-top: 1px solid #f0f0f0; }
.mypageV2__content .btn-wrap button { width: 180px; height: 50px; border-radius: 3px; font-size: 18px; font-weight: bold; color: #fff; letter-spacing: -1.08px; }
.mypageV2__content .btn-wrap .btn-cancel { background-color: #5A6681; transition: all 0.2s; }
.mypageV2__content .btn-wrap .btn-cancel:hover { background-color: #4c5266; transition: all 0.2s; opacity: 1; }
.mypageV2__content .btn-wrap .btn-apply { background-color: #59a7f7; }
.mypageV2__content .btn-wrap .btn-apply:hover { background-color: #469bf3; transition: all 0.2s; opacity: 1; }

/* 마이페이지 - 서비스 통계 */
.mypageV2__content-statistics .top_cont { width: 100%; display: flex; flex-flow: column; gap: 30px; }
.mypageV2__content-statistics .top_cont .calendar-wrap { display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 50px; background-image: linear-gradient(to top, #1382f5, #5aa7f7); box-shadow: 1px 2px 5px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, .1);}
.mypageV2__content-statistics .top_cont .calendar-wrap button { width: 36px; height: 36px; background-position: center; background-repeat: no-repeat; background-size: 10px;}
.mypageV2__content-statistics .top_cont .calendar-wrap button:hover { opacity: 0.8; }
.mypageV2__content-statistics .top_cont .calendar-wrap button.prevBtn { background-image:url(../../images/connectplace/common/ico_arrow_L_wh.png); text-indent: -9999px;}
.mypageV2__content-statistics .top_cont .calendar-wrap button.nextBtn { background-image:url(../../images/connectplace/common/ico_arrow_R_wh.png); text-indent: -9999px;}
.mypageV2__content-statistics .top_cont .calendar-wrap button.nextBtn:disabled { background-image:none; cursor:default; }
.mypageV2__content-statistics .top_cont .calendar-wrap .ui-datepicker { top: 50px !important; left: 50% !important; transform: translateX(-50%) !important; }
.mypageV2__content-statistics .weekView-Date { cursor: pointer; font-size: 20px; margin: 0; }
.mypageV2__content-statistics .weekView-Date::-webkit-input-placeholder { color: #5a6681; }
.mypageV2__content-statistics .weekView-Date::-moz-placeholder { color: #5a6681; }
.mypageV2__content-statistics .weekView-Date:-ms-input-placeholder { color: #5a6681; }
.mypageV2__content-statistics .weekView-Date::-ms-input-placeholder { color: #5a6681; }
.mypageV2__content-statistics .weekView-Date::placeholder { color: #5a6681; }
.mypageV2__content-statistics .top_cont .weekView-Date::-webkit-input-placeholder { color: #Fff; }
.mypageV2__content-statistics .top_cont .weekView-Date::-moz-placeholder { color: #Fff; }
.mypageV2__content-statistics .top_cont .weekView-Date:-ms-input-placeholder { color: #Fff; }
.mypageV2__content-statistics .top_cont .weekView-Date::-ms-input-placeholder { color: #Fff; }
.mypageV2__content-statistics .top_cont .weekView-Date, .mypageV2__content-statistics .top_cont .weekView-Date::placeholder { color: #Fff; }
.mypageV2__content-statistics .top_cont .myLevel-wrap { cursor: default; width:100%; height: 230px; overflow: hidden; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; gap: 20px; padding: 30px 40px; box-sizing: border-box; background-color: #f6f8fc; box-shadow: 1px 2px 5px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, .1);}
.mypageV2__content-statistics .top_cont .myLevel-info { width: calc((100% + 20px)/2); }
.mypageV2__content-statistics .top_cont .myLevel-info .tit { font-size: 24px; font-weight: bold; color: #2d90f5; letter-spacing: -1.2px; }
.mypageV2__content-statistics .top_cont .myLevel-info ul { display: flex; flex-flow: row nowrap; align-items: center; gap: 20px; margin-top: 20px; justify-content:start; }
.mypageV2__content-statistics .top_cont .myLevel-info li { width: 50%; padding: 15px; box-sizing: border-box; display: flex; flex-flow: column; justify-content: center; align-items:center; gap: 5px; background-color: #fff; box-shadow: 1px 2px 5px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, .1); }
.mypageV2__content-statistics .top_cont .myLevel-info li div { font-size: 16px; font-weight:500; color: #5c6883; letter-spacing: -0.88px; text-align: center; line-height: 1.2; white-space: nowrap; }
.mypageV2__content-statistics .top_cont .myLevel-info li div.info-tit span { font-size: 20px; font-weight: bold; line-height: 1.5; }
.mypageV2__content-statistics .top_cont .myLevel-info li div.info-txt span { display: inline-block; margin-right:3px; color: #2d90f5; font-size: 20px; font-weight: bold; letter-spacing: -0.88px; white-space: nowrap; }
.mypageV2__content-statistics .top_cont .myLevel-info li div.info-txt span:nth-child(2) { margin-left: 3px; color: #fc8452; }
.mypageV2__content-statistics .top_cont .myLevel-info li div.info-txt.noshow span:nth-child(2) { font-size: 16px; color: #999; font-weight: 500; }
.mypageV2__content-statistics #myLevelChart, .mypageV2__content-statistics #myLevelChart2 { position: relative; width: calc((100% - 40px)/3); height: 400px; box-sizing: border-box; font-size: 32px; }

.mypageV2__content-statistics .sub-tit { position: relative; display: flex; flex-flow: row nowrap; align-items: center; margin: 40px 0 20px; }
.mypageV2__content-statistics .sub-tit h5 { font-size: 22px; font-weight: bold; color: #4b5165; letter-spacing: -1.32px; }
.mypageV2__content-statistics .sub-tit h5>span { display: inline-block; margin-left: 10px; font-size: 24px; color: #1382f4; font-weight: bold; }
.mypageV2__content-statistics .sub-tit>ul { display: flex; flex-flow: row nowrap; align-items: baseline; width: auto; margin-left: 20px; }
.mypageV2__content-statistics .sub-tit>ul li { width: 110px; height: 35px; line-height: 35px; text-align: center; font-size: 18px; font-weight: 600; letter-spacing: -0.5px; color: #7e889e; border:1px solid #5a668150; background-image: linear-gradient(to top, #eeeff2, #f0f0f0); }
.mypageV2__content-statistics .sub-tit>ul li:hover { cursor: pointer; opacity: 0.8; }
.mypageV2__content-statistics .sub-tit>ul li.on { border: 1px solid transparent; background-image: linear-gradient(to top, #1382f4, #5aa7f7); color: #fff; }
.mypageV2__content-statistics .sub-tit>ul li.bottom { border-left: 0px; }
.mypageV2__content-statistics .sub-tit .select-box { position: absolute; right: 0; }
.mypageV2__content-statistics .statistics_cont { display: flex; }

.mypageV2__content-statistics .chart-box-wrap.type1 { width: 100%; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-box { flex-flow: row wrap; width: 50%; height: 450px; background-color: #fff; border: 1px solid rgba(0, 0, 0, .05); box-sizing: border-box; float: left; overflow: hidden; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-box+.chart-box { border-left: 0; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-tit { width: 100%; text-align: center; font-size: 18px; font-weight: bold; color: #5a6681; letter-spacing: -0.5px; height: 50px; line-height: 50px; background-color: #f6f8fc; box-shadow: 0px 1px 3px rgba(0, 0, 0, .08); -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, .08); }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-content { position: relative; display: flex; width: 100%; height: 100%; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-cont { width: 70%; height: calc(100% - 30px); position: relative; box-sizing: border-box; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-cont .chart-cont-none { display: none; position: absolute; top: 43%; left: 15%; width: 100%; height: 100%; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-loading-wrap { display: none; background: rgba(0, 0, 0, 0.3); z-index: 999999; width: 100%; height: 100%; position: absolute; }
.mypageV2__content-statistics .chart-box-wrap.type1 .chart-loading-wrap .chart-loading { position: absolute; width: 50px; top: 43%; left: 47%; padding: 8px; background: #747474; border-radius: 50%; aspect-ratio: 1; --m-grd: conic-gradient(#000 10%, #000), linear-gradient(#000 0 0) content-box; mask: var(--m-grd); -webkit-mask: var(--m-grd); -webkit-mask-composite: source-out; mask-composite: subtract; -webkit-animation: loading 1s infinite linear; animation: loading 1s infinite linear; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank { position: relative; width: 30%; height: calc(100% - 50px); padding-left: 30px; box-sizing: border-box; top: 15px; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li { width: 100%; display: flex; flex-flow: row nowrap; align-items: center; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rank { color: #24bbf6; font-size: 45px; width: 20px; text-align: left; font-weight: bold; line-height: 62px; margin-right: 20px; }
.mypageV2__content-statistics .chart-box-wrap .chart-content.part-room-top-2 .chart-rank li .rank { color: #3a92ff; }
.mypageV2__content-statistics .chart-box-wrap .chart-content.part-room-bottom-2 .chart-rank li .rank { color: #3a92ff; }
.mypageV2__content-statistics .chart-box-wrap .chart-content.part-dept-top-1 .chart-rank li .rank { color: #ffb30a; }
.mypageV2__content-statistics .chart-box-wrap .chart-content.part-dept-top-2 .chart-rank li .rank { color: #ff6a2c; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li:nth-child(2) .rank { font-size: 40px; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li:nth-child(3) .rank { font-size: 35px; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li:nth-child(4) .rank { font-size: 30px; color: #5a6681 !important; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li:nth-child(5) .rank { font-size: 30px; color: #5a6681 !important; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rankInfo { width: calc(100% - 40px); }
/* --- CSS4 설정(:not) 별도 분리 ---
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rankInfo>div:not(.rankInfo div.location) { font-size:18px; color: #5a6681; font-weight: 600; letter-spacing: -1px; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }*/
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rankInfo .location { cursor: pointer; display: flex; flex-flow: row; align-items: center; gap: 5px; font-size:16px; letter-spacing: -0.5px; color: #b8bfd0; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rankInfo .location img { width: 12px; height: 15px; }
.mypageV2__content-statistics .chart-box-wrap .chart-rank li .rankInfo .location:hover { opacity: 0.8; }

.mypageV2__content-statistics .chart-box-wrap.type2 { width: 100%; }
.mypageV2__content-statistics .chart-box-wrap.type2 .chart-box { display: flex; flex-flow: row wrap; width:100%; height: 460px; overflow: hidden; background-color: #fff; border: 1px solid rgba(0, 0, 0, .05); box-sizing: border-box; float: left; }
.mypageV2__content-statistics .heatmap-cont-wrap { width: 30%; text-align: center; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap { display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 50px; line-height: 50px; background-color: #f6f8fc; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap button { width: 36px; height: 36px; background-position: center; background-repeat: no-repeat; background-size: 10px; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap button:hover { opacity: 0.8; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap button.prevBtn { background-image:url(../../images/connectplace/common/ico_arrow_L_gr.png); text-indent: -9999px; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap button.nextBtn { background-image:url(../../images/connectplace/common/ico_arrow_R_gr.png); text-indent: -9999px; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap button.nextBtn:disabled { opacity: 0.5; cursor:default; }
.mypageV2__content-statistics .heatmap-cont-wrap .calendar-wrap .ui-datepicker { top: 50px !important; left: 50% !important; transform: translateX(-50%) !important; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap { display: flex; flex-flow: row nowrap; align-items: center; height: calc(100% - 50px); }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .legend-box { cursor: default; display:flex; align-items:center; justify-content: center; gap: 12px; width: 30%; min-width: 100px; height: 100%; background-color: #f6f8fc; padding: 30px 10px; box-sizing: border-box; border-top: 1px solid rgba(0, 0, 0, .03); }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .legend-box>div { width: 10px; height:100%; background-image: linear-gradient(to top, #1382f4, #469bf3, #96c6f6, #b3d3f3, #ddebf9, #f1f3f6); text-indent: -9999px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .legend-box>ul { height: 100%; display: flex; flex-flow: column; justify-content: space-between; align-items: start; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .legend-box>ul li { font-size: 14px; font-weight: 500; color: #606c8c; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-box { position: relative; width:70%; height: 100%; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-loading-wrap { display: none; position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.3); z-index: 99999; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-loading-wrap .heatmap-loading { position: absolute; width: 50px; top: 45%; left: 45%; padding: 8px; background: #747474; border-radius: 50%; aspect-ratio: 1; --m-grd: conic-gradient(#000 10%, #000), linear-gradient(#000 0 0) content-box; mask: var(--m-grd); -webkit-mask: var(--m-grd); -webkit-mask-composite: source-out; mask-composite: subtract; -webkit-animation: loading 1s infinite linear; animation: loading 1s infinite linear; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content { height: 100%; max-height: 410px; padding: 10px 10px; box-sizing: border-box; background-color: #fff; display: flex; justify-content:center; align-items: start; gap: 2px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar { width: 8px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar-thumb { border-radius:4.5px; background-color: #dcdfe6; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar-track { border-radius: 4.5px; background-color: #efefef; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .timeList { height: 100%; padding-top: 32px; margin-right: 5px; box-sizing: border-box; display: flex; flex-flow: column; align-items: center; justify-content: start; gap: 2.5px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .timeList li { width: auto; height: 30px; line-height: 30px; font-size: 14px; text-align: center; color: #8188a5; font-weight: 500; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime { position: relative; display: flex; flex-flow: column; align-items: center; justify-content: start; gap: 2px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime .date { width: 30px; height: 30px; line-height: 30px; font-size: 16px; text-align: center; color: #606c8c; font-weight: 600; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime .date.red { color: #d51f20; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime .date.blue { color: #1a84f4; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li { position: relative; text-indent: -9999px; cursor: pointer; width: 30px; height: 30px; background-color: #f1f3f6; border-radius: 2px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li span { text-indent: -9999px; position: absolute; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li:hover { opacity: 0.7; position: relative; text-indent: 0; z-index: 10; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li:hover span { position: absolute; text-indent: 0; display: block; left: 1em; top: 1em; width: -webkit-max-content; width: -moz-max-content; width: max-content; min-width: 30px; font-size: 14px; color: #fff; padding: 2px 5px; border-radius: 2px; background-color: #555; box-shadow: 1px 2px 3px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 2px 3px rgba(0, 0, 0, .1); }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.on { position: relative; z-index: 1; outline: 3px solid #ffab0c; -webkit-outline: 3px solid #ffab0c; box-sizing: border-box; border-radius: 0; opacity: 1 !important; } /*선택*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value0 { background-color: #f1f3f6; } /*기본:0*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value1 { background-color: #ddebf9; } /*1-20*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value20 { background-color: #b3d3f3; } /*20-40*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value40 { background-color: #96c6f6; } /*40-60*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value60 { background-color: #469bf3; } /*60-80*/
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime li.value80 { background-color: #1382f4; } /*80-100*/

.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime.on { padding: 2px 3px; border-radius: 5px; box-sizing:border-box; position: relative; background-color:#fff1d7; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime.on li { margin: 0 1px; box-shadow: 0 0 2px 0 rgba(0, 0, 0, .2); -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, .2);}
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime.on li:last-child { margin-bottom: 2px; }
.mypageV2__content-statistics .heatmap-cont-wrap .heatmap-wrap .heatmap-content .dateTime.on .date { color: #ff8300; }

.mypageV2__content-statistics .heatmap-detail-wrap { width: 70%; height: 100%; background-color: #f6f8fc; padding: 30px 50px; box-sizing:border-box; border-left:1px solid rgba(0, 0, 0, .05); }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-tit { width: 100%; border-bottom: 1px solid rgba(0, 0, 0, .05); height: 50px; line-height: 40px; padding-bottom: 10px; box-sizing: border-box; font-size: 22px; font-weight: bold; color: #0f447c; letter-spacing: -0.5px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-tit span { font-weight: bold; color: #1382f4; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart { position: relative; width: 100%; height:calc(100% -60px); display: flex; justify-content: start; align-items: center; gap: 30px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart #pieChart { position: relative; width: 300px; height:350px; box-sizing: border-box; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info { display: none; width: calc(100% - 280px); }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-tit .sub { display: inline-block; font-size: 16px; font-weight: 500; padding: 3px 10px; box-sizing: border-box; background-color: #0f447c; color: #fff; line-height: 1.5; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-tit .name { font-size: 30px; font-weight: 600; color: #0f447c; letter-spacing: -0.88px; margin-top: 10px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-detail { margin-top: 20px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-detail li { display: flex; align-items: center; gap: 20px; margin-bottom: 5px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-detail li span { font-size: 18px; font-weight: bold; color:#4b5165; letter-spacing: -0.5px; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-detail li span:first-child { min-width: 90px; font-size: 16px; font-weight: 400; color: #5a6681; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .chart-info .info-detail li:first-child span:first-child { font-size: 18px; font-weight:bold; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .heatmap-loading-wrap { display: none; background-color: #f8f8f840; position: absolute; width: 100%; height: 100%; z-index: 99999; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .heatmap-loading-wrap .heatmap-loading { display: none; position: absolute; width: 50px; top: 45%; left: 45%; padding: 8px; background: #747474; border-radius: 50%; aspect-ratio: 1; --m-grd: conic-gradient(#000 10%, #000), linear-gradient(#000 0 0) content-box; mask: var(--m-grd); -webkit-mask: var(--m-grd); -webkit-mask-composite: source-out; mask-composite: subtract; -webkit-animation: loading 1s infinite linear; animation: loading 1s infinite linear; }
.mypageV2__content-statistics .heatmap-detail-wrap .cont-chart .heatmap-detail-noselect { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 3px 10px; font-size: 16px; white-space: nowrap; }

#rankWeekPicker { color: #fff; }
#weeklyWeekPicker { color: #5a6681; }

/* 마이페이지 - 개인정보 수정 */
.mypageV2__content-preference .profile-wrap { position: relative; display: flex; gap: 30px; padding-bottom: 30px; border-bottom: 1px solid #f0f0f0; }
.mypageV2__content-preference .editInfo-wrap{border-bottom: 1px solid #f0f0f0;}
.mypageV2__content-preference form h5.sub-tit:last-of-type + .editInfo-wrap{border-bottom: 0; padding-bottom: 0px;}
.mypageV2__content-preference .profile-img .img-btn button { width: 80px; height: 30px; border-radius: 3px; font-size: 16px; font-weight: bold; letter-spacing: -0.96px; box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); box-sizing: border-box; }
.mypageV2__content-preference .profile-img .img-btn .btn-change { color: #5a6681; background-color: #fff; border: 1px solid #e5e5e5; }
.mypageV2__content-preference .profile-img .img-btn .btn-del { color: #fff; background-color: #4c5266; }
.mypageV2__content-preference .profile-img .img-btn button:hover { opacity: 0.8; }
.mypageV2__content-preference .profile-btn { margin-top: 5px; }
.mypageV2__content-preference .profile-btn button { width: 160px; height: 30px; border-radius: 3px; font-size: 16px; font-weight: bold; letter-spacing: -0.96px; box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); box-sizing: border-box; color: #5a6681; border: 1px solid #e5e5e5; background-color: #fff; }
.mypageV2__content-preference .profile-btn button:hover { opacity: 0.8; }
.mypageV2__content-preference .profile-info li .content.inputNum input { width: 120px; padding: 0 15px; box-sizing: border-box;}
.mypageV2__content-preference .profile-info li .content.inputNum input::placeholder{letter-spacing: 0.5px;}
.mypageV2__content-preference .profile-info li .content.inputNum input::-moz-placeholder{letter-spacing: 0.5px;}
.mypageV2__content-preference .profile-info li .content.inputNum input:-ms-input-placeholder{letter-spacing: 0.5px;}
.mypageV2__content-preference .profile-info li .content.inputNum input::-ms-input-placeholder{letter-spacing: 0.5px;}
.mypageV2__content-preference .profile-info li input { height: 44px; background-color: #f0f6ff; font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; border: none; box-sizing: border-box; }
.mypageV2__content-preference .profile-info li input::-webkit-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .profile-info li input::-moz-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .profile-info li input:-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .profile-info li input::-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .profile-info li input::placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .profile-info li input:focus { outline: 1px solid #1382f4; }
.mypageV2__content-preference .profile-info .select-box li { height: 47px; margin-bottom: 0; }
.mypageV2__content-preference .profile-info .list1 input { width: 266px; padding-left: 20px; }
.mypageV2__content-preference .profile-info .list1 #user-name { width: auto; padding-left: 0px; background-color: unset; }
.mypageV2__content-preference .profile-info .list1 #user-name::-webkit-input-placeholder { font-size: 18px; font-weight: 600; color: #222; }
.mypageV2__content-preference .profile-info .list1 #user-name::-moz-placeholder { font-size: 18px; font-weight: 600; color: #222; }
.mypageV2__content-preference .profile-info .list1 #user-name:-ms-input-placeholder { font-size: 18px; font-weight: 600; color: #222; }
.mypageV2__content-preference .profile-info .list1 #user-name::-ms-input-placeholder { font-size: 18px; font-weight: 600; color: #222; }
.mypageV2__content-preference .profile-info .list1 #user-name::placeholder { font-size: 18px; font-weight: 600; color: #222; }
.mypageV2__content-preference .profile-info .list2 input { width: 79px; padding-left: 15px; }
.mypageV2__content-preference .profile-info .list3 input { width: 172px; padding-left: 15px; }
.mypageV2__content-preference .profile-info .list3 .select-box { margin-left: 9px; }
.mypageV2__content-preference .profile-info .list5 .select-box + .select-box { margin-left: 9px; }
.mypageV2__content-preference .editInfo-wrap { display: flex; align-items: start; justify-content: start; gap: 50px; padding-bottom: 40px; }
.mypageV2__content-preference .editInfo-wrap > ul { width: auto;}
.mypageV2__content-preference .editInfo-wrap > ul > li:last-child { margin-bottom: 0px; }
.mypageV2__content-preference .editInfo-wrap > ul > li .title { width: 120px; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }

.mypageV2__content-preference .editInfo-wrap .edit-left .list1 .type1 { margin-right: 15px; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list1 .type2 { width: 125px; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list1 span { font-size: 16px; font-weight: bold; color: #59a7f7; letter-spacing: -0.16px; margin-right: 10px; }
.mypageV2__content-preference .datepicker-style { display: flex; align-items: flex-start; flex: 1 0 0; }
.mypageV2__content-preference .datepicker-style > span { display: flex; width: 16px; height: 44px; flex-direction: column; text-align: center; justify-content: center; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list2 input { width: 100%; box-sizing: border-box; height: 44px; background-image: url(../../images/connectplace/common/ico_time.png); background-repeat: no-repeat; background-position: top 50% right 10px; background-size: 20px; border: none; padding: 0 15px; font-size: 16px; color: #5f6b8b; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list2 input:focus { outline: 1px solid #59a7f7; border: 0; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list2 span { line-height: 44px; font-size: 16px; font-weight: 400; color: #5f6b8b; letter-spacing: -0.16px; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 { display: flex; align-items: center; width: 100%; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .content > button { cursor: pointer; width: 160px; height: 40px; border-radius: 3px; font-size: 16px; font-weight: bold; letter-spacing: -0.96px; box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); box-sizing: border-box; color: #5a6681; border: 1px solid #e5e5e5; background-color: #fff; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .content > button:hover { opacity: 0.8; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap { display: none; width: calc(100% -135px); align-items: center; gap: 15px; transform: all 0.2s; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input { width:210px; height: 44px; background-color: #f0f6ff; border: none; padding: 0 15px; font-size: 16px; color: #5f6b8b; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input::-webkit-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input::-moz-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #999; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input:-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input::-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap input::placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap .btn-wrap { width: auto; margin-top: 0; display: flex; gap: 5px; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap .btn-wrap button { width: 70px; height: 40px; border-radius: 3px; font-weight: bold; font-size: 16px; box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 7.4px 3px 7px 0 rgba(0, 0, 0, 0.02); box-sizing: border-box; color: #5a6681; border: 1px solid #e5e5e5; background-color: #fff; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap .btn-wrap button.btn-change { background-color: #4c5266; color: #fff; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .doorPassword-wrap .btn-wrap button:hover { opacity: 0.8; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .content { position: relative; width: calc(100% - 135px); }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .message-wrap { position: absolute; bottom: -30px; width: 100%; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .message-wrap span { display: none; font-weight: 400; font-size: 15px; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .message-wrap .complete { color: #1382f4; }
.mypageV2__content-preference .editInfo-wrap .edit-left .list3 .message-wrap .error { color: #777; }

/* 마이페이지 - 개인정보 수정 (Figma 레이아웃 v2) — Visit visit__content와 동일하게 container__inner 전체 스크롤 */
.contents.common-style.preference-page { display: flex; flex-direction: column; flex: 1 0 0; align-self: stretch; min-height: 0; height: calc(100vh - 64px); max-height: calc(100vh - 64px); overflow: hidden; }
.contents.common-style.preference-page > .container__inner { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; flex: 1 0 0; min-height: 0; width: 100%; max-width: 1640px; padding: 36px 40px; height: calc(100vh - 64px); margin: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; -ms-overflow-style: none; box-sizing: border-box; }
.mypageV2__content-preference.preference-layout-v2 { display: flex; align-items: flex-start; align-self: stretch; }
.mypageV2__content-preference.preference-layout-v2 form { width: 100%; }
.mypageV2__content-preference.preference-layout-v2 .preference-page-split { display: flex; align-items: flex-start; gap: 40px; align-self: stretch; }
.mypageV2__content-preference.preference-layout-v2 .btn-wrap.preference-actions { display: flex; justify-content: center; align-items: center; gap: 12px; align-self: stretch; padding-top: 20px; border-top: 1px solid var(--clr-w300) }
.mypageV2__content-preference.preference-layout-v2 .sub-tit { color: var(--txt-color-p600, #267BFF); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); }
.mypageV2__content-preference.preference-layout-v2 .preference-page-col--main { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; flex: 1 0 0; }
.mypageV2__content-preference.preference-layout-v2 .preference-section { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; padding-bottom: 24px; border-bottom: 1px solid  var(--clr-w300); }
.mypageV2__content-preference.preference-layout-v2 .preference-section ul .preference-form-row { display: flex; align-items: center; align-content: center; gap: 8px 12px; align-self: stretch; flex-wrap: wrap; }
.mypageV2__content-preference.preference-layout-v2 .preference-section.preference-section--basic ul .list1 { height: auto; }
.mypageV2__content-preference.preference-layout-v2 .preference-section ul .list1.preference-form-row .content { display: flex; width: 424px; align-items: center; gap: 16px; }
.mypageV2__content-preference.preference-layout-v2 .preference-section ul .list5.preference-form-row .content { display: flex; width: 424px; align-items: center; gap: 16px; }
.mypageV2__content-preference.preference-layout-v2 .preference-section ul li { align-self: stretch; }
.mypageV2__content-preference .profile-info li .title { width: 120px; color: var(--txt-color-t900, #1F1F1F);  font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.mypageV2__content-preference .profile-info li .email-content { display: flex; align-items: center; align-content: center; gap: 8px 16px; flex: 1 0 0; flex-wrap: wrap; }
.mypageV2__content-preference .profile-info li .email-content .email_domain_wrap { display: flex; align-items: center; gap: 4px; }
.mypageV2__content-preference .profile-info li .content > span { color: var(--txt-color-t900, #1F1F1F);  font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.mypageV2__content-preference.preference-layout-v2 .preference-page-col--main .preference-section--convenience { padding-bottom: 20px; border-bottom: 0; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box.profile-img { display: flex; padding: 24px 40px; flex-direction: column; justify-content: center; align-items: center; gap: 16px; border-radius: 12px; background: var(--clr-n30, #F6F6F8); }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .last-name { display: inline-flex; align-items: center; justify-content: center; width: 120px; height: 120px; font-family: var(--txt-font-family); font-size: var(--txt-size-56); font-style: var(--txt-font-style);font-weight: var(--txt-weight-bold); color: var(--txt-color-t100); letter-spacing: -0.32px; background-color: var(--clr-n80); border-radius: 50%; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .img-box { position: relative; width: 120px; height: 120px; border-radius: 50%; overflow: visible; cursor: default; border: none; box-shadow: none; display: flex; align-items: center; justify-content: center; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .img-box img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .profile-thumb { display: inline-flex; align-items: center; justify-content: center; width: 120px; height: 120px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .profile-thumb::after { position: absolute; content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-56); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t100); letter-spacing: -0.28px; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .profile-thumb img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-gear { position: absolute; right: 0; bottom: 0; width: 40px; height: 40px; border-radius: 20px; background: var(--clr-n200) url(../../../figma/svg/setting_white_24.svg) no-repeat center center; background-size: 24px 24px; border: 2px solid var(--clr-w100); box-sizing: border-box; justify-content: center; align-items: center; cursor: pointer; z-index: 2; }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .img-txt { color: var(--txt-color-t70, #999); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.mypageV2__content-preference.preference-layout-v2 .preference-profile-box .img-btn { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
.mypageV2__content-preference.preference-layout-v2 .preference-form-list {
	flex: 1;
	min-width: 0;
}
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-group { display: flex; align-items: center; }
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-group .preference-mobile-sep { width: 16px; text-align: center; }
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-prefix {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	height: 44px;
	padding: 0 12px;
	background: #f0f6ff;
	border-radius: 4px;
	font-size: 15px;
	font-weight: 500;
	color: #4c5266;
	box-sizing: border-box;
}
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-group .input_text_wrapper {
	width: 88px !important;
	max-width: 88px;
}
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-group input {	text-align: center; }
.mypageV2__content-preference.preference-layout-v2 .preference-mobile-sep {
	color: #8b95a5;
	font-weight: 500;
}
.mypageV2__content-preference.preference-layout-v2 #mobileNum {
	display: none !important;
}
.mypageV2__content-preference.preference-layout-v2 .profile-info .list1 #user-name,
.mypageV2__content-preference.preference-layout-v2 .profile-info .list1 > .content > .input_text_wrapper {
	display: none;
}
.mypageV2__content-preference.preference-layout-v2 .editInfo-wrap.preference-form-list {
	display: block;
	padding-bottom: 0;
	border-bottom: 0;
}
.mypageV2__content-preference.preference-layout-v2 .editInfo-wrap.preference-form-list > ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}
.mypageV2__content-preference.preference-layout-v2 .preference-section .editInfo-wrap ul .list1.preference-form-row .content, 
.mypageV2__content-preference.preference-layout-v2 .preference-section .editInfo-wrap ul .list2.preference-form-row .content { display: flex; align-items: center; } 
.mypageV2__content-preference.preference-layout-v2 .preference-page-col--main .preference-actions.btn-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin-top: 0;
	padding-top: 16px;
	width: 100%;
}
.mypageV2__content-preference.preference-layout-v2 .preference-actions .preference-btn-cancel {
	order: 1;
}
.mypageV2__content-preference.preference-layout-v2 .preference-actions .preference-btn-save {
	order: 2;
}

/* 마이페이지 - 비밀번호 변경 (Figma 레이아웃 v2) */
.mypageV2__content-password.password-layout-v2 { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; }
.mypageV2__content-password.password-layout-v2 .password-notice { display: flex; padding: 24px 40px; justify-content: center; align-items: center; gap: 16px; border-radius: 6px; background: var(--clr-n30, #F6F6F8); }
.mypageV2__content-password.password-layout-v2 .password-notice__icon { flex: 0 0 24px; width: 24px; height: 24px; background: url("../../../figma/svg/info_filled_bluegray_24.svg") no-repeat center / 24px 24px; }
.mypageV2__content-password.password-layout-v2 .password-notice__text { margin: 0; flex: 1 0 0; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height, 1.5); letter-spacing: var(--txt-letter-spacing); }
.mypageV2__content-password.password-layout-v2 .password-section { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; padding-bottom: 24px; border-bottom: 1px solid var(--clr-w300); }
.mypageV2__content-password.password-layout-v2 .editInfo-wrap.preference-form-list { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.mypageV2__content-password.password-layout-v2 .editInfo-wrap.preference-form-list > ul { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.mypageV2__content-password.password-layout-v2 .profile-info li.preference-form-row { display: flex; align-items: flex-start; gap: 12px; }
.mypageV2__content-password.password-layout-v2 .profile-info li.preference-form-row--stacked { align-items: flex-start; }
.mypageV2__content-password.password-layout-v2 .profile-info li:first-child .title { height: auto; }
.mypageV2__content-password.password-layout-v2 .profile-info li .title { display: flex; width: 120px; height: 44px; flex-direction: column; justify-content: center; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.mypageV2__content-password.password-layout-v2 .profile-info li .content { display: flex; width: 424px; max-width: calc(100% - 132px); align-items: center; gap: 16px; }
.mypageV2__content-password.password-layout-v2 .profile-info li .password-field-stack { flex-direction: column; align-items: flex-start; gap: 8px; }
.mypageV2__content-password.password-layout-v2 .profile-info li .content > span.preference-field-text { color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.mypageV2__content-password.password-layout-v2 .password-field-hint { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; width: 100%; }
.mypageV2__content-password.password-layout-v2 .password-field-hint li { color: var(--txt-color-t70, #999); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height, 1.5); }
.mypageV2__content-password.password-layout-v2 .password-field-msg { margin: 0; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height, 1.5); }
.mypageV2__content-password.password-layout-v2 .password-field-msg.password-field-msg--success { color: var(--clr-g900); }
.mypageV2__content-password.password-layout-v2 .password-field-msg.password-field-msg--error { color: var(--clr-r700); }
.contents.common-style .btn-wrap.preference-actions { display: flex; justify-content: center; align-items: center; gap: 12px; align-self: stretch; }

/* 마이페이지 - 비밀번호 변경(레거시), 출입문 비밀번호 변경 */
.mypageV2__content-password .box { width: 800px; height: auto; padding: 60px 0; display: flex; justify-content: center; align-items: center; background-color: #f0f6ff; margin: 0 auto 100px; box-sizing: border-box; }
.mypageV2__content-password .box ul li { height: 44px; margin-bottom: 20px; }
.mypageV2__content-password .box ul li:last-child { margin-bottom: 0px; }
.mypageV2__content-password .box ul li .title { width: 100px; white-space: nowrap; float: left; font-size: 16px; font-weight: bold; letter-spacing: -0.16px; color: #5a6681; line-height: 44px; }
.mypageV2__content-password .box ul li .content { float: left; }
.mypageV2__content-password .box ul li input { height: 44px; background-color: #fff; font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; border: none; box-sizing: border-box; padding-left: 20px; min-width: 266px; }
.mypageV2__content-password .box ul li input::-webkit-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-password .box ul li input::-moz-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-password .box ul li input:-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-password .box ul li input::-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999; }
.mypageV2__content-password .box ul li input::placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color:#999;}
.mypageV2__content-password .box ul li input:focus { outline: 1px solid #1382f4; }
.mypageV2__content-password .box ul li input#user-id { width: auto; min-width: 266px; padding-left: 0px; background-color: unset; white-space: nowrap; }
.mypageV2__content-password .box ul li input#user-id::-webkit-input-placeholder { font-size: 16px; font-weight: 600; color: #222; }
.mypageV2__content-password .box ul li input#user-id::-moz-placeholder { font-size: 16px; font-weight: 600; color: #222; }
.mypageV2__content-password .box ul li input#user-id:-ms-input-placeholder { font-size: 16px; font-weight: 600; color: #222; }
.mypageV2__content-password .box ul li input#user-id::-ms-input-placeholder { font-size: 16px; font-weight: 600; color: #222; }
.mypageV2__content-password .box ul li input#user-id::placeholder { font-size: 16px; font-weight: 600; color: #222; }
.mypageV2__content-password .box ul li input#user-id:focus { outline: none; }

/* 문의하기 */
/* 문의하기 - 공통 */
.contact-header { display: flex; width: 100%; height: 38px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.contact-header h1 { height: 38px; font-family: var(--txt-font-family); font-size: var(--txt-size-20); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); letter-spacing: -0.4px; }
.contact-body { display: flex; flex-direction: column; align-items: center; align-self: stretch; width: 100%; border: 1px solid var(--clr-w300); border-radius: 12px; box-shadow: var(--ds-e200); }
.contact-filter-box { display: flex; align-items: center; flex: 1 0 0; flex-wrap: wrap; gap: 12px; width: 100%; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); }
.contact-filter-box .total-txt { display: flex; flex: 1 0 0; gap: 4px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.contact-filter-box .total-txt strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.contact-filter { display: flex; gap: 12px; }

/* 문의하기 - 공지사항 */
.notice-list { display: table; width: 100%; table-layout: fixed; }
.notice-list thead th { height: 44px; padding: 0 12px; background-color: var(--clr-w200); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; text-align: left; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.notice-list thead th:first-child, .notice-list tbody td:first-child { padding-left: 24px; text-align: center; }
.notice-list thead th:last-child, .notice-list tbody td:last-child { padding-right: 24px; }
.notice-list tbody tr:hover { background-color: var(--clr-p100); cursor: pointer; }
.notice-list tbody td { height: 48px; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.notice-list tbody td .title { display: flex; align-items: center; gap: 8px; }
.notice-list tbody td .title .badge { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 20px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-t100); padding: 10px 8px; background-color: var(--clr-w800); border-radius: 20px; }
.notice-list tbody td .title .name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notice-list tbody td .title .icon-new { width: 14px; height: 14px; background: url("/figma/svg/newmark_yellow_14.svg") no-repeat; flex-shrink: 0; }
.notice-list tbody td .user { display: flex; gap: 8px; }
.notice-list tbody td .user .last-name { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); background-color: var(--clr-n80); border-radius: 50%; }
.notice-list tbody td .user .profile { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.notice-list tbody td .user .profile::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: attr(data-fallback); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); }
.notice-list tbody td .user .profile img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.notice-list tbody td .user .name { line-height: 24px; }

/* 문의하기 - 공지사항 상세 */
.notice-detail-body { display: flex; min-width: 750px; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 12px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF); overflow: hidden }
.notice-detail { display: flex; flex-direction: column; gap: 16px; width: 100%; }
.notice-detail__header { display: flex; padding: 24px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; border-bottom: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w200, #F3F3F3); }
.notice-detail__title { align-self: stretch; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-18); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); }
.notice-detail__meta { display: flex; align-items: center; gap: 8px; }
.notice-detail__avatar { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clr-n80, #E3E3E3); color: var(--txt-color-t100, #FFF); font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); flex-shrink: 0; overflow: hidden; }
.notice-detail__avatar--photo { position: relative; background: var(--clr-n80, #E3E3E3); }
.notice-detail__avatar--photo img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }
.notice-detail__avatar--photo::after { content: attr(data-fallback); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 0; color: var(--txt-color-t100, #FFF); font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); }
.notice-detail__author { color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.notice-detail__date { color: var(--txt-color-t70, #999); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.notice-detail__body { display: flex; padding: 36px 24px; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; border-bottom: 1px solid var(--clr-w300, #E3E3E3); }
.notice-detail__attach { display: flex; min-width: 316px; padding: 16px; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF); }
.notice-detail__attach-head { display: flex; width: 100%; align-items: center; gap: 8px; }
.notice-detail__attach-head .notice-detail_attach-btn-wrap { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.notice-detail__attach-toggle { display: flex; align-items: center; gap: 4px; }
.notice-detail__attach-icon { width: 16px; height: 16px; flex-shrink: 0; background: url("/figma/svg/form_file_24.svg") no-repeat center / contain; }
.notice-detail__attach-label { color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.notice-detail__attach-save { display: flex; height: 36px; padding: 0 4px; justify-content: center; align-items: center; gap: 10px; color: var(--txt-color-p600, #267BFF); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.notice-detail__attach-chevron { width: 16px; height: 16px; margin-left: auto; flex-shrink: 0; background: url("/figma/svg/arrow_up_16.svg") no-repeat center / contain; transition: transform 0.2s ease; }
.notice-detail__attach:not(.is-open) .notice-detail__attach-chevron { transform: rotate(180deg); }
.notice-detail__attach-panel { border-top: 1px solid var(--clr-w300, #E3E3E3); }
.notice-detail__attach-panel[hidden] { display: none !important; }
.notice-detail__file-list { margin: 0; padding: 8px 0; list-style: none; }
.notice-detail__file-item { display: flex; align-items: center; gap: 8px; padding: 8px 16px; }
.notice-detail__file-item + .notice-detail__file-item { border-top: 1px solid var(--clr-w200, #F0F0F0); }
.notice-detail__file-icon { width: 20px; height: 20px; border-radius: 4px; flex-shrink: 0; background: var(--clr-n80, #E3E3E3) url("/figma/svg/file_lightgray_16.svg") no-repeat center / 12px 12px; }
.notice-detail__file-icon--pdf { background-color: #FFEBEB; background-image: none; position: relative; }
.notice-detail__file-icon--pdf::after { content: "PDF"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #E53935; font-size: 8px; font-weight: 700; }
.notice-detail__file-icon--image { background-color: #F1EAFF; background-image: none; position: relative; }
.notice-detail__file-icon--image::after { content: "IMG"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #7B61FF; font-size: 8px; font-weight: 700; }
.notice-detail__file-name { flex: 1 1 auto; min-width: 0; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); text-decoration: none; word-break: break-all; }
.notice-detail__file-name:hover { text-decoration: underline; }
.notice-detail__file-size { color: var(--txt-color-t500, #777); }
.notice-detail__file-download { width: 24px; height: 24px; flex-shrink: 0; background: url("../../../figma/svg/download_black_24.svg") no-repeat center / 16px 16px; }
.notice-detail__content { color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.notice-detail__content p { margin: 0 0 12px; font-size: var(--txt-size-14); }
.notice-detail__content ul,
.notice-detail__content ol { margin: 0 0 12px; padding-left: 20px; }
.notice-detail__content img { max-width: 100%; height: auto; }
.notice-detail__nav { align-items: flex-start; align-self: stretch; border-radius: 12px; border: 1px solid var(--clr-w300, #E3E3E3); background: var(--clr-w100, #FFF); }
.notice-detail__nav-item { display: flex; align-items: center; gap: 12px; padding: 14px 24px; color: inherit; text-decoration: none; border-bottom: 1px solid var(--clr-w300, #E3E3E3); }
.notice-detail__nav-item:last-child { border-bottom: 0; }
.notice-detail__nav-item:hover { background: var(--clr-p100, #F3F8FF); }
.notice-detail__nav-icon { width: 16px; height: 16px; flex-shrink: 0; background-repeat: no-repeat; background-position: center; background-size: contain; }
.notice-detail__nav-icon--prev { background: url("../../../figma/svg/arrow_up_lightgray_12.svg") no-repeat center / 12px 12px; }
.notice-detail__nav-icon--next { background: url("../../../figma/svg/arrow_down_lightgray_12.svg") no-repeat center / 12px 12px; }
.notice-detail__nav-title { flex: 1 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--txt-color-t900, #1F1F1F); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.notice-detail__nav-date { fflex: 1 0 0; color: var(--txt-color-t70, #999); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.notice-detail__footer { display: flex; justify-content: flex-start; width: 100%; margin-top: 16px; }

.detail_cont { border: 1px solid #f0f0f0; margin-bottom: 40px; }
.detail_cont .cont-tit { padding: 25px 0; text-align: center; background-color: rgba(232, 243, 255, 0.3); }
.detail_cont .cont-tit h5 { font-size: 22px; font-weight: 600; letter-spacing: -1.54px; color: #4c5266; line-height: 2; }
.detail_cont .cont-tit span { font-size: 16px; font-weight: 500; letter-spacing: -0.16px; color: #5f6b8b; margin: 0 3px; }
.detail_cont .cont-txt { min-height: 300px; height: auto; padding: 30px; font-size: 16px; color: #222; line-height: 1.4; font-weight: 500; word-break: keep-all; }
.detail_cont .cont-txt p { font-size: 16px; color: #222; line-height: 1.4; font-weight: 500; word-break: keep-all; }
.contactV2__content .btn-area { display: flex; align-items: center; justify-content: space-between; margin: 0; }
.contactV2__content .btn-area button { width: 180px; height: 50px; border-radius: 3px; font-size: 18px; font-weight: bold; letter-spacing: -1.08px; }
.contactV2__content .btn-area button.btn-list { color: #fff; background-color: #59a7f7; }
.contactV2__content .btn-area button.btn-list:hover { opacity: 1; background-color: #469bf3; transition: all 0.2s; }
.contactV2__content .btn-area button.btn-post { border: 1px solid #e5e5e5; color: #5a6b8b; transition: all 0.2s; }
.contactV2__content .btn-area button.btn-post:hover { opacity:1; background-color: #5A668115; color: #4C5266; transition: all 0.2s; }

/* 문의하기 - FAQ */
.faq-list { width: 100%; }
.faq-header { display: flex; height: 44px; background-color: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.faq-header div { display: flex; align-items: center; align-self: stretch; height: 100%; padding: 0 12px; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); letter-spacing: -0.28px; }
.faq-header div:first-child, .faq-body li .question div:first-child { padding-left: 24px; }
.faq-header div:last-child { padding-right: 24px; }
.faq-body { width: 100%; }
.faq-body li .question { display: flex; height: 48px; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.faq-body li .question:hover { background-color: var(--clr-p100); cursor: pointer; }
.faq-body li .question.active { background-color: var(--clr-p100); }
.faq-body li:last-child .question { border-bottom: 0; }
.faq-body li .question div { display: flex; align-items: center; align-self: stretch; padding: 0 12px; }
.faq-body li .question div .icon-arrow { width: 16px; height: 16px; vertical-align: middle; background: url("/figma/svg/arrow_down_16.svg") no-repeat center / contain; flex-shrink: 0; }
.faq-body li .question.active div .icon-arrow { background: url("/figma/svg/arrow_up_16.svg") no-repeat center / contain; }
.faq-body li .question .category { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }
.faq-body li .question .title { display: flex; gap: 8px; align-items: center; padding: 0 24px 0 12px; }
.faq-body li .question .title span { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.faq-body li .question .title .icon-new { width: 14px; height: 14px; background: url("/figma/svg/newmark_yellow_14.svg") no-repeat; flex-shrink: 0; }
.faq-body li .answer { display: none; padding: 24px 24px 24px 54px; border: 1px solid var(--clr-p400); border-left: 12px solid var(--clr-p400); box-sizing: border-box; font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.faq-body li .answer.active { display: block; }
.faq-body li .answer p { font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); letter-spacing: -0.28px; }

/* 문의하기 - 매뉴얼 */
.contact-body .manual-filter-box { justify-content: space-between; }
.contact-body .manual-filter-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.contact-body .manual-select-all { display: inline-flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; }
.contact-body .manual-select-all span { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.contact-body .manual-download-btn { display: flex; width: 36px; min-width: 36px; height: 36px; padding: 0; justify-content: center; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100) url("../../../figma/svg/download_black_24.svg") no-repeat center / 16px 16px; cursor: pointer; }
.contact-body .manual-download-btn:hover { background-color: var(--clr-n30, #F6F6F8); }
.manual-table-wrap { width: 100%; overflow-x: auto; }
.manual-list { display: table; width: 100%; min-width: 720px; table-layout: fixed; }
.manual-list thead th { height: 44px; padding: 0 12px; background-color: var(--clr-w200); font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); text-align: left; border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; }
.manual-list thead th.manual-check-col,
.manual-list tbody td.manual-check-col { width: 60px; padding-left: 24px; padding-right: 0; text-align: left; }
.manual-list thead th:last-child,
.manual-list tbody td:last-child { padding-right: 24px; }
.manual-list tbody tr:hover { background-color: var(--clr-p100); }
.manual-list tbody td:not(.manual-check-col) { cursor: pointer; }
.manual-list tbody td { height: 48px; padding: 0 12px; font-size: var(--txt-size-14); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); border-bottom: 1px solid var(--clr-w300); box-sizing: border-box; vertical-align: middle; }
.manual-list tbody tr:last-child td { border-bottom: 0; }
.manual-list tbody td .title { display: flex; align-items: center; gap: 8px; }
.manual-list tbody td .title .name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.manual-list tbody td .title .icon-new { width: 14px; height: 14px; background: url("../../../figma/svg/newmark_yellow_14.svg") no-repeat; flex-shrink: 0; }
.manual-list tbody td .title .icon-link { width: 14px; height: 14px; background: url("../../../figma/svg/external_bluegray_14.svg") no-repeat; flex-shrink: 0; }
.manual-check-all,
.manual-row-check { width: 14px; height: 14px; accent-color: var(--clr-p600, #267BFF); cursor: pointer; }

/* ------ (공통)예약내역 없을 때 */
.empty-box { position: relative; width: 100%; height: 300px; background-color: var(--clr-w100); border-radius: 12px; }
.empty-box div { display: flex; flex-direction: column; align-items: center; justify-content: center; align-self: stretch; gap: 20px; height: 100%; }
.empty-box div .icon-empty-box { width: 80px; height: 80px; background: url("/figma/svg/result_empty_80.svg") no-repeat center / contain; flex-shrink: 0; }
.empty-box div p { font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-style: var(--txt-font-style); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); letter-spacing: -0.32px; text-align: center; }

/* jquery-ui select custom */
.ui-selectmenu-button.ui-button { width: 100%;  }
.ui-menu .ui-menu-item-wrapper { padding: 0; }
.ui-button .ui-icon { display: none; }
.ui-front { z-index: 100000; }
.ui-menu { max-height: 200px; }

.ui-autocomplete { max-height: 200px !important; overflow-x: hidden !important; overflow-y: auto !important; border: 1px solid var(--clr-p600) !important; border-radius: 6px !important; box-shadow: var(--ds-e400) !important; scrollbar-width: auto !important; scrollbar-color: var(--clr-w300) transparent !important; }
.ui-autocomplete .ui-menu-item-wrapper, .ui-autocomplete .ui-menu-item a {display: flex !important; height: 36px !important; line-height: 36px !important; padding: 14px 16px !important; color: var(--txt-color-t900) !important; font-size: var(--txt-size-14) !important; font-weight: var(--txt-weight-regular) !important; text-decoration: none !important; border: none !important; cursor: pointer !important; }
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active, .ui-autocomplete .ui-menu-item a.ui-state-active, .ui-autocomplete .ui-menu-item a:hover { background-color: var(--clr-p200) !important; }


/* check */
.checkYn { position: relative; cursor: pointer; float: unset; margin-top: 0; width:auto; height: 44px; box-sizing: border-box; background-color: #f5f6f8; border-radius: 2px; }
.checkYn input { display: none; }
.checkYn:not(#chkSameUser) label { display:flex; align-items: center; justify-content: center; gap: 5px; cursor:pointer; padding: 0 15px; width: 100%; height: 100%; line-height: 44px; color: #5a6681; white-space: nowrap; }
.checkYn:not(#chkSameUser) label::before { position: relative; display: block; content: ""; width: 18px; height: 18px; border-radius: 10px; background-color: #bcc1ce; background-image:url(../../images/connectplace/common/ico_check_y.png); background-repeat: no-repeat; background-position: center; background-size: 10px; }
.checkYn:not(#chkSameUser).on label { color: #59a7f7; }
.checkYn:not(#chkSameUser).on label::before { background-color: #59a7f7; }
.checkYn.on { background-color: #f0f6ff; }

/* button */
button.bg_blue { background-color: #1382f4 !important; color: #fff; font-weight: 700; border: 1px solid #1382f4; transition: all 0.3s; }
button.bg_blue:hover { opacity: 1; background-image: linear-gradient(to top, #1382f5, #3695fa); box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); -webkit-box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); transition: all 0.1s; border-color: #3695fa; }
button.bg_sky { background-color: #59a7f7 !important; color: #fff; font-weight: 700; transition: all 0.2s ease-in-out; }
button.bg_sky:hover { opacity: 1; background-image: linear-gradient(to top, #59a7f7, #68b2fc); transition: all 0.2s ease-in-out; }
button.bg_navy { background-color: #0f447c !important; color: #fff; font-weight: 700; transition: all 0.2s ease-in-out; }
button.bg_navy:hover { opacity: 1; background-image: linear-gradient(to top, #0f447c , #165293); transition: all 0.2s ease; }
button.bg_gray { background-color: #828eac !important; color: #fff; font-weight: 700; transition: all 0.2s ease-in-out; }
button.bg_gray:hover { opacity: 1; background-image: linear-gradient(to top, #828eac , #97a3c1); transition: all 0.2s ease; }
button.bg_dark { background-color: #4c5266 !important; color: #fff; font-weight: 700; transition: all 0.2s ease-in-out; }
button.bg_dark:hover { opacity: 1; background-image: linear-gradient(to top, #4c5266 , #61677b); transition: all 0.2s ease; }
button.line_blue { border: 1px solid #1382f4 !important; color: #1382f4; font-weight: 700; transition: all 0.2s ease-in-out; }
button.line_blue:hover { opacity: 0.8; transition: all 0.2s ease }
button.accordion-btn { float: right; text-indent: -9999px; background-image: url(../../images/connectplace/common/ico_arrow-down_gr.png); background-repeat: no-repeat; background-position: center; background-size: contain; width: 13px; }
button.accordion-btn.active { transform: rotate(180deg); }

/* tooltip */
body .ui-tooltip { background-color: #ffffffee; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); z-index: 9999;}
.ui-tooltip { word-break: break-all; color: #333 !important; font-size: 13px!important; padding: 5px 10px !important;}

button.tooltip:hover { opacity: 1; }
.tooltip, .tooltipV2 { position: relative; overflow: visible; z-index: 3; }
.tooltip:hover { z-index: 3; }
.tooltip .tooltiptext, .tooltipV2 .tooltiptext { opacity: 0; visibility: hidden; display: flex; flex-flow: column nowrap; justify-content: start; width: -webkit-max-content; width: -moz-max-content; width: max-content; height: fit-content; text-align: center; box-sizing: border-box; word-break: keep-all;
    position: absolute; left: 0; top: calc(100% + 10px); bottom: auto; transform: none; max-width: min(320px, calc(100vw - 40px)); margin: 0; padding: 10px 12px; border-radius: 10px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; align-items: flex-start; letter-spacing: var(--txt-letter-spacing); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24); -webkit-box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24); z-index: 9999; pointer-events: none; isolation: isolate; }
.tooltip:hover .tooltiptext, .tooltipV2:hover .tooltiptext { opacity: 1; visibility: visible; color: var(--txt-color-t100); font-size: var(--txt-size-12); letter-spacing: var(--txt-letter-spacing); transition: opacity 0.2s ease, visibility 0.2s ease; }
.tooltiptext::before { content: none; }
.tooltiptext::after { content: ""; position: absolute; left: 16px; top: -6px; width: 12px; height: 6px; background-color: var(--clr-w800); clip-path: polygon(50% 0, 0 100%, 100% 100%); z-index: 1; }
.tooltiptext em { font-size: 14px; font-weight: 400; margin: 0 2px; color: #555; letter-spacing: -0.88px; }

/* Desk policy tooltip style */
.policy__content-table table.policy-table--desk .tooltip .tooltiptext,
.policy__content-table table.policy-table--room .tooltip .tooltiptext { position: absolute; max-width: 320px; margin-bottom: 12px; padding: 10px; border-radius: 6px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; align-items: flex-start; letter-spacing: var(--txt-letter-spacing); box-shadow: var(--ds-e300); -webkit-box-shadow: var(--ds-e300); z-index: 3; pointer-events: none; isolation: isolate; }
.policy__content-table table.policy-table--room .tooltip .tooltiptext { left: -10px; right: auto; transform: none; }
.policy__content-table table.policy-table--desk .tooltip .tooltiptext::before,
.policy__content-table table.policy-table--room .tooltip .tooltiptext::before { content: ""; position: absolute; left: 14px; top: calc(-6px - 2px); width: 12px; height: 6px; background-color: rgba(0, 0, 0, 0.27); clip-path: polygon(50% 0%, 0 100%, 100% 100%); filter: blur(1.5px); -webkit-filter: blur(1.5px); opacity: 0.55; z-index: -2; }
.policy__content-table table.policy-table--desk .tooltip .tooltiptext::after,
.policy__content-table table.policy-table--room .tooltip .tooltiptext::after { content: ""; position: absolute; left: 14px; top: -6px; width: 12px; height: 6px; background-color: var(--clr-w800); clip-path: polygon(50% 0%, 0 100%, 100% 100%); z-index: -1; }
.policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::before,
.policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::before { left: 50%; transform: translateX(-50%); }
.policy__content-table table.policy-table--desk .tooltip .tooltiptext.tooltip-middle::after,
.policy__content-table table.policy-table--room .tooltip .tooltiptext.tooltip-middle::after { left: 50%; transform: translateX(-50%); }
.policy__content-table table.policy-table--desk .tooltip .tooltiptext em,
.policy__content-table table.policy-table--room .tooltip .tooltiptext em { font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); margin: 0; color: var(--txt-color-t100); letter-spacing: var(--txt-letter-spacing); }

.policy__content-table table.policy-table--desk .tooltip,
.policy__content-table table.policy-table--room .tooltip { z-index: 2; }


.reset-btn .tooltip { width: 24px; height: 24px; opacity: 1; position: unset; top: 50%; right: 20px; margin-top: -2px; background: url(../../images/connectplace/common/home-2-line-b.png) no-repeat left center/22px; font-style: normal; }
.reset-btn .tooltip .tooltip-box {display: none; width: 200px; position: absolute; z-index: 99; top: 35px; right: -10px; background:#ffffffee; padding: 15px; top: 58px; right: 50%; transform: translateX(50%); box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);}
.reset-btn .tooltip .tooltip-box::after { content: ""; width: 0px; height: 0px; border-top: 8px solid none; border-bottom: 8px solid #fff; border-right: 8px solid transparent; border-left: 8px solid transparent; position: absolute; top: -8px; right: 14px; }
.reset-btn .tooltip .tooltip-box h5 { font-size: 16px; font-weight: 600; color: #333; letter-spacing: -0.88px; }
.reset-btn .tooltip .tooltip-box p {word-break: keep-all; font-size: 14px; color: #999; margin-top: 5px; letter-spacing: -0.88px; }
.reset-btn:hover .tooltip .tooltip-box { display: block; }
.reset-btn .tooltip .tooltip-box:hover { display: none; }

.inputform__row.perfume .tooltip { margin-left: 5px; cursor: pointer; }
.inputform__row.perfume .tooltip-box { display: none; position: absolute; top: 15px; left: 75px; width: auto; padding: 10px 15px; background-color: #ffffffee;
    color: #333; font-size: 14px; font-weight: 400; letter-spacing: -0.88px; line-height: 1.5; z-index: 1; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);}

/* inputSearchBox 공통 */
.inputSearchBox { position: relative; }
input.inputSearch { width: 330px; height: 44px; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.08); font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; box-sizing: border-box; padding: 0 30px 0 10px; }
input.inputSearch::-webkit-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; }
input.inputSearch::-moz-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; }
input.inputSearch:-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; }
input.inputSearch::-ms-input-placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; }
input.inputSearch::placeholder { font-size: 16px; font-weight: 400; letter-spacing: -0.16px; color: #4c5266; }
input.inputSearch:focus { outline: 1px solid #1382f4; border: 0; }
input.inputSearch+.icoSearch { display: block; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 30px; height: 44px; cursor: pointer; background: url(../../images/connectplace/common/search_icon_b.png) no-repeat right 10px center/20px; text-indent: -9999px; }
input.inputSearch+.icoSearch:hover { opacity: 0.8; }

/* 정보 확인 페이지 input, select, daypicker, timepicker 색상/아이콘 제거 */
.state .select-style { background-color: #f5f6f8; background-image: none; }
.state input.time { background-image: none !important; }
.state .IOT-box-wrap .box, .state .img-layout li { cursor: default; }
.state .select-box, .state .select-box.active { background-color: #f5f6f8 !important; background-image: none; cursor: initial; }
.state .select-box:hover button, .state .select-box.active:hover button{opacity: 1;}
.state .select-box button, .state .select-box.active button { cursor: initial; }
.state .select-box .select-list, .state .select-box.active .select-list { display: none !important; }
.state .input-style { background-color: #f5f6f8; cursor: initial; }
.state .input-style:focus { outline: none; cursor: initial; outline: 0px; }
.state .select-style:focus { outline: none; cursor: initial; outline: 0px; }
.state .datepicker-style .time_input,
.state .datepicker-style .date_input { background-color: #f5f6f8; cursor: initial; }
.state .datepicker-style .time_input:hover,
.state .datepicker-style .date_input:hover{cursor: default;}
.state .datepicker-style .time_input:focus,
.state .datepicker-style .date_input:focus { outline: 0px; }
.state .datepicker-style .ui-timepicker-container.ui-timepicker-standard { display: none !important; outline: 0px; }
.state .datepicker-style #ui-datepicker-div { display: none !important; outline: 0px; }
.visit__content .state .input-box.border input, .visit__content .state .input-box.border .select-box{background-color: #f9f9f9 !important; box-shadow: 1px 1px 3px rgba(0, 0, 0, .01); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, .01); background-image: none !important;}

/* 에러 */
section.error { width: 800px; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 25px; line-height: 2;}
.error__inner h2 { font-size: 32px; color: #222; font-weight: 400; margin: 20px 0 50px; }
.error__inner p { font-size: 18px; color: #999; font-weight: 400; margin: 20px 0; }
section.error .pop-btn-area{margin-top: 50px;}

/* paging */
.paging { display: flex; align-items: center; justify-content: center; padding: 24px; }
.paging .first-page { width: 36px; height: 36px; mask: url("/figma/svg/pagenation_start_16.svg") no-repeat center / 16px; -webkit-mask: url("/figma/svg/pagenation_start_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.paging .prev-page { width: 36px; height: 36px; mask: url("/figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; -webkit-mask: url("/figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.paging .next-page { width: 36px; height: 36px; mask: url("/figma/svg/pagenation_next_16.svg") no-repeat center / 16px; -webkit-mask: url("/figma/svg/pagenation_next_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.paging .last-page { width: 36px; height: 36px; mask: url("/figma/svg/pagenation_end_16.svg") no-repeat center / 16px; -webkit-mask: url("/figma/svg/pagenation_end_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.paging > a:hover { background-color: var(--clr-w500); opacity: 1; }
.paging .num-page { display: flex; gap: 2px; margin: 0 12px; }
.paging .num-page .page-link { width: 36px; height: 36px; line-height: 36px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); text-align: center; background-color: var(--clr-w100); border-radius: 6px; opacity: 1; }
.paging .num-page .page-link.active { color: var(--txt-color-t100); background-color: var(--clr-w800); }
.paging .num-page .page-link:not(.active):hover { color: var(--txt-color-t70); }

/* 셀렉트 박스 공통 */
.select-box { position: relative; width: auto; min-width: 160px; height: 44px; background-color: #fff; padding-left: 10px; padding-right: 30px; border: 1px solid rgba(0, 0, 0, 0.08); background-image: url(../../images/connectplace/common/ico_triangle_down_b.svg); background-repeat: no-repeat; background-position:top 50% right 12px; background-size: 10px; font-size: 16px; font-weight: 600; color: #4c5266; display: inline-block; vertical-align: middle; cursor: pointer; }
.select-box.active { background-image: url(../../images/connectplace/common/ico_triangle_up_b.svg); background-size:9px; }
.select-box.no-select { background-image: none; }
.select-box .btn-select { width: 100%; height: 100% ; box-sizing: border-box; text-align: left; font-size: 16px; font-weight: 400; color: #4c5266; box-sizing: border-box; text-overflow: ellipsis; white-space: nowrap; }
.btn-select + .select-list.visible { display: block; }
.select-box.active .select-list { display: block; }
.select-box .select-list { display: none; position: absolute; z-index: 10; top: 47px; max-height: 200px; width: 100%; padding: 0; box-sizing: border-box; box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.14); -webkit-box-shadow:4px 4px 14px rgba(0, 0, 0, 0.14); border-radius: 6px; background-color: #fff; overflow: hidden; border-radius: 0; overflow-y: auto; }
.select-list { display: none; position: absolute; width: 100%; top: 60px; left: 0; padding: 0; box-sizing: border-box; box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.14); -webkit-box-shadow:4px 4px 14px rgba(0, 0, 0, 0.14); border-radius: 3px; background-color: #fff; overflow: hidden; z-index: 10; }
.select-list li { width: 100%; height: 45px; box-sizing: border-box; }
.select-list li button { padding: 0 10px; width: 100%; height: 100%; background-color: #fff; color: #333; font-size: 16px; font-weight: 500; cursor: pointer; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; text-align: center; }
.select-list li button:hover, .select-list li button:focus { background-color: rgba(0,0,0,0.05); color: #1382f4; }

/* 스크롤 */
.not_scroll{overflow: hidden !important;} /*팝업오픈시 스크롤 막기 class 추가*/
/* 스크롤: width 0 */
.meeting-room-view.RsvDetail-inner::-webkit-scrollbar,
.maincontant::-webkit-scrollbar,
aside + .container::-webkit-scrollbar,
.policy__content::-webkit-scrollbar,
.mypageV2__content::-webkit-scrollbar,
.contactV2__content::-webkit-scrollbar,
.visit__content::-webkit-scrollbar{ width: 0px;}

/* 스크롤: width 8 */
.meetingroom-user-list #attendeeList::-webkit-scrollbar,
.ui-dialog-content.ui-widget-content::-webkit-scrollbar,
.staff-list::-webkit-scrollbar,
.searchMember-type1 #tbodySearchUser::-webkit-scrollbar,
.addMember-type1 #tbodySearchUser::-webkit-scrollbar,
#organizationChart .organization-search .organization::-webkit-scrollbar,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar,
#organizationChart .chart-list .body::-webkit-scrollbar,
.attendeesAdd-cont .conference-list-wrap::-webkit-scrollbar,
.maincontant__section__list--body .scroll::-webkit-scrollbar,
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open.is-scrollable::-webkit-scrollbar,
#summernote::-webkit-scrollbar,
.perfume-manual-wrap .explain2_area::-webkit-scrollbar,
.detail-heatmap .cont-wrap.cont02 .cont-area::-webkit-scrollbar,
.side-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar{ width: 8px; }

.meetingroom-user-list #attendeeList::-webkit-scrollbar-thumb,
.ui-dialog-content.ui-widget-content::-webkit-scrollbar-thumb,
.staff-list::-webkit-scrollbar-thumb,
.searchMember-type1 #tbodySearchUser::-webkit-scrollbar-thumb,
.addMember-type1 #tbodySearchUser::-webkit-scrollbar-thumb,
#organizationChart .organization-search .organization::-webkit-scrollbar-thumb,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb,
#organizationChart .chart-list .body::-webkit-scrollbar-thumb,
.attendeesAdd-cont .conference-list-wrap::-webkit-scrollbar-thumb,
.maincontant__section__list--body .scroll::-webkit-scrollbar-thumb,
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open.is-scrollable::-webkit-scrollbar-thumb,
#summernote::-webkit-scrollbar-thumb,
.perfume-manual-wrap .explain2_area::-webkit-scrollbar-thumb,
.detail-heatmap .cont-wrap.cont02 .cont-area::-webkit-scrollbar-thumb,
.side-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb{ background-color: #e0e3eb; border-radius: 5px; }

/* 스크롤: width 5 */
.statistics__content .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar,
.focusroom-floor-select::-webkit-scrollbar,
.chair-floor-select::-webkit-scrollbar,
.air-floor-select::-webkit-scrollbar,
.perfume-floor-select::-webkit-scrollbar,
.locker-floor-select::-webkit-scrollbar,
.select-box .select-list::-webkit-scrollbar,
.maincontant__section__info--box .userBox2 .select_area ul::-webkit-scrollbar,
.rsv_list_box .rsv_list_body::-webkit-scrollbar,
.meeting-room-add .attendees-cont .attendees-list::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap::-webkit-scrollbar,
.list-work-request-history dd::-webkit-scrollbar,
.list-work-approval-history dd::-webkit-scrollbar,
.departmenetDetail .pop-cont .pop-cont-inner::-webkit-scrollbar,
#workhoursDetailContent::-webkit-scrollbar,
#vacationDetailContent::-webkit-scrollbar,
.maincontant__section__list--container .maincontant__section__list--aside::-webkit-scrollbar,
#teamListPopupContent::-webkit-scrollbar{ width: 5px; }

.focusroom-floor-select::-webkit-scrollbar-thumb,
.chair-floor-select::-webkit-scrollbar-thumb,
.air-floor-select::-webkit-scrollbar-thumb,
.perfume-floor-select::-webkit-scrollbar-thumb,
.locker-floor-select::-webkit-scrollbar-thumb,
.statistics__content .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar-thumb,
.select-box .select-list::-webkit-scrollbar-thumb,
.maincontant__section__info--box .userBox2 .select_area ul::-webkit-scrollbar-thumb,
.rsv_list_box .rsv_list_body::-webkit-scrollbar-thumb,
.meeting-room-add .attendees-cont .attendees-list::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap::-webkit-scrollbar-thumb,
.list-work-request-history dd::-webkit-scrollbar-thumb,
.list-work-approval-history dd::-webkit-scrollbar-thumb,
.departmenetDetail .pop-cont .pop-cont-inner::-webkit-scrollbar-thumb,
#workhoursDetailContent::-webkit-scrollbar-thumb,
#vacationDetailContent::-webkit-scrollbar-thumb,
.maincontant__section__list--container .maincontant__section__list--aside::-webkit-scrollbar-thumb,
#teamListPopupContent::-webkit-scrollbar-thumb{ background: #dcdfe6; border-radius: 3px; }

/* 스크롤: height 8 */
#organizationChart .organization-search .organization::-webkit-scrollbar,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar,
.layer-pop-area.lockerList #lockerListByGroup::-webkit-scrollbar,
#summernote::-webkit-scrollbar,
.pop-cont.p0 .pop-cont-ct .detail-images .img_box::-webkit-scrollbar{ height: 8px; border-radius: 4px; }

#organizationChart .organization-search .organization::-webkit-scrollbar-thumb,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb,
.layer-pop-area.lockerList #lockerListByGroup::-webkit-scrollbar-thumb,
#summernote::-webkit-scrollbar-thumb,
.pop-cont.p0 .pop-cont-ct .detail-images .img_box::-webkit-scrollbar-thumb  { background: #dcdfe6; height: 8px; border-radius: 4px; }

/* 스크롤: width 0/5/8, height 8 공통 */
.meetingroom-user-list #attendeeList::-webkit-scrollbar-track,
.focusroom-floor-select::-webkit-scrollbar-track,
.chair-floor-select::-webkit-scrollbar-track,
.air-floor-select::-webkit-scrollbar-track,
.perfume-floor-select::-webkit-scrollbar-track,
.locker-floor-select::-webkit-scrollbar-track,
.statistics__content .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar-track,
.select-box .select-list::-webkit-scrollbar-track,
.maincontant__section__info--box .userBox2 .select_area ul::-webkit-scrollbar-track,
.rsv_list_box .rsv_list_body::-webkit-scrollbar-track,
.meeting-room-add .attendees-cont .attendees-list::-webkit-scrollbar-track,
.list-work-request-history dd::-webkit-scrollbar-track,
.list-work-approval-history dd::-webkit-scrollbar-track,
.departmenetDetail .pop-cont .pop-cont-inner::-webkit-scrollbar-track,
#workhoursDetailContent::-webkit-scrollbar-track,
#vacationDetailContent::-webkit-scrollbar-track,
.maincontant__section__list--container .maincontant__section__list--aside::-webkit-scrollbar-track,
#teamListPopupContent::-webkit-scrollbar-track,
.ui-dialog-content.ui-widget-content::-webkit-scrollbar-track,
.staff-list::-webkit-scrollbar-track,
.searchMember-type1 #tbodySearchUser::-webkit-scrollbar-track,
.addhMember-type1 #tbodySearchUser::-webkit-scrollbar-track,
#organizationChart .organization-search .organization::-webkit-scrollbar-track,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar-track,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar-track,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-track,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-track,
#organizationChart .chart-list .body::-webkit-scrollbar-track,
.attendeesAdd-cont .conference-list-wrap::-webkit-scrollbar-track,
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap::-webkit-scrollbar-track,
.layer-pop-area.lockerList #lockerListByGroup::-webkit-scrollbar-track,
.maincontant__section__list--body .scroll::-webkit-scrollbar-track,
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open.is-scrollable::-webkit-scrollbar-track,
#summernote::-webkit-scrollbar-track,
.perfume-manual-wrap .explain2_area::-webkit-scrollbar-track,
.policy__content::-webkit-scrollbar-track,
.mypageV2__content::-webkit-scrollbar-track,
.contactV2__content::-webkit-scrollbar-track,
.visit__content::-webkit-scrollbar-track,
.pop-cont.p0 .pop-cont-ct .detail-images .img_box::-webkit-scrollbar-track,
.detail-heatmap .cont-wrap.cont02 .cont-area::-webkit-scrollbar-track,
.side-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-track,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-track{ background: transparent; }

.meetingroom-user-list #attendeeList::-webkit-scrollbar-thumb:hover,
.focusroom-floor-select::-webkit-scrollbar-thumb:hover,
.chair-floor-select::-webkit-scrollbar-thumb:hover,
.air-floor-select::-webkit-scrollbar-thumb:hover,
.perfume-floor-select::-webkit-scrollbar-thumb:hover,
.locker-floor-select::-webkit-scrollbar-thumb:hover,
.statistics__content .heatmap-cont-wrap .heatmap-wrap .heatmap-content::-webkit-scrollbar-thumb:hover,
.select-box .select-list::-webkit-scrollbar-thumb:hover,
.maincontant__section__info--box .userBox2 .select_area ul::-webkit-scrollbar-thumb:hover,
.rsv_list_box .rsv_list_body::-webkit-scrollbar-thumb:hover,
.meeting-room-add .attendees-cont .attendees-list::-webkit-scrollbar-thumb:hover,
.list-work-request-history dd::-webkit-scrollbar-thumb:hover,
.list-work-approval-history dd::-webkit-scrollbar-thumb:hover,
.departmenetDetail .pop-cont .pop-cont-inner::-webkit-scrollbar-thumb:hover,
#workhoursDetailContent::-webkit-scrollbar-thumb:hover,
#vacationDetailContent::-webkit-scrollbar-thumb:hover,
.maincontant__section__list--container .maincontant__section__list--aside::-webkit-scrollbar-thumb:hover,
#teamListPopupContent::-webkit-scrollbar-thumb:hover,
.ui-dialog-content.ui-widget-content::-webkit-scrollbar-thumb:hover,
.staff-list::-webkit-scrollbar-thumb:hover,
.searchMember-type1 #tbodySearchUser::-webkit-scrollbar-thumb:hover,
.addhMember-type1 #tbodySearchUser::-webkit-scrollbar-thumb:hover,
#organizationChart .organization-search .organization::-webkit-scrollbar-thumb:hover,
.layer-pop-area[data-role-popup="staffSearch"] .staff-search-user-table-scroll::-webkit-scrollbar-thumb:hover,
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-scroll::-webkit-scrollbar-thumb:hover,
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb:hover,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-scroll::-webkit-scrollbar-thumb:hover,
#organizationChart .chart-list .body::-webkit-scrollbar-thumb:hover,
.attendeesAdd-cont .conference-list-wrap::-webkit-scrollbar-thumb:hover,
.layer-pop-wrap .layer-pop-area .pop-cont .list-wrap::-webkit-scrollbar-thumb:hover,
.layer-pop-area.lockerList #lockerListByGroup::-webkit-scrollbar-thumb:hover,
.maincontant__section__list--body .scroll::-webkit-scrollbar-thumb:hover,
#summernote::-webkit-scrollbar-thumb:hover,
.perfume-manual-wrap .explain2_area::-webkit-scrollbar-thumb:hover,
.pop-cont.p0 .pop-cont-ct .detail-images .img_box::-webkit-scrollbar-thumb:hover,
.detail-heatmap .cont-wrap.cont02 .cont-area::-webkit-scrollbar-thumb:hover,
.side-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb:hover,
.desk-policy-drawer .policy__content-inner.policy__content-inner--desk::-webkit-scrollbar-thumb:hover { background: #e9e9e9; border-radius: 5px; cursor: pointer; }

/* 스크롤: width 10 */
html::-webkit-scrollbar,
.maincontant::-webkit-scrollbar {height: 10px;}

html::-webkit-scrollbar-thumb,
.maincontant::-webkit-scrollbar-thumb,
.policy__content::-webkit-scrollbar-thumb,
.mypageV2__content::-webkit-scrollbar-thumb,
.contactV2__content::-webkit-scrollbar-thumb,
.visit__content::-webkit-scrollbar-thumb,
aside + .container::-webkit-scrollbar-thumb { background: #dcdfe6; border-radius: 10px;}

html::-webkit-scrollbar-track,
.maincontant::-webkit-scrollbar-track,
.policy__content::-webkit-scrollbar-track,
.mypageV2__content::-webkit-scrollbar-track,
.contactV2__content::-webkit-scrollbar-track,
.visit__content::-webkit-scrollbar-track,
aside + .container::-webkit-scrollbar-track{ background: transparent; }

html::-webkit-scrollbar-thumb:hover,
.maincontant::-webkit-scrollbar-thumb:hover,
.policy__content::-webkit-scrollbar-thumb:hover,
.mypageV2__content::-webkit-scrollbar-thumb:hover,
.contactV2__content::-webkit-scrollbar-thumb:hover,
.visit__content::-webkit-scrollbar-thumb:hover,
aside + .container::-webkit-scrollbar-thumb:hover{ background: #e9e9e9; border-radius:10px; cursor: pointer;}

/* jquery autocomplete 커스텀 */
.orgchart-dept-autocomplete li.ui-menu-item .ui-menu-item-wrapper.ui-state-active { color: unset !important; border: none !important; background: unset !important; margin: 0 !important; }
.orgchart-dept-autocomplete li.ui-menu-item:hover { background-color: rgba(0, 0, 0, 0.05) !important; }
.orgchart-dept-autocomplete li.ui-menu-item:hover .ui-menu-item-wrapper { color: #1382f4 !important; border: none !important; background: none !important; }
.restaurant_crowded {position: absolute;display: block;margin-top: -85px;margin-left: -200px;width: 115px;height: 92px;border-radius: 100px;filter: blur(30px);opacity: 0.75;}

/* Floormap영역 css 수정 가능하다면 부탁드립니다! */
/* 맵 범례 영역 텍스트 */
#deskLegend{border-radius: 0; width: auto; box-shadow: 1px 1px 3px rgba(0, 0, 0, .1);}
p#p { font-family:'Pretendard', Arial, sans-serif; font-weight: 600; letter-spacing: -0.88px; padding-left: 0; width: auto; min-width: 500px;}
p#p .deskType{margin-left: 15px;}
#deskLegendMarker{background-color: #7b89a9; width: 15px; opacity: 0.5;}
/* 좌석 맵 층/좌석예약 정보 영역 텍스트 */
#searchUserDesk{background: #5a6681; font-size: 18px; font-weight: 500; padding: 15px; opacity: 0.5; border-radius: 5px; font-family: 'Pretendard', Arial, sans-serif;}

/* ============================================
   출퇴근 관리 영역 CSS (퍼블리싱 디자인)
   ============================================ */
/* 근무일정(Index) — 뷰포트 높이 고정 후 캘린더 본문 내부 스크롤 */
.contents.schedule.attendance-calendar-page {
	display: flex;
	flex-direction: column;
	flex: 1 0 0;
	align-self: stretch;
	min-height: 0;
	height: calc(100vh - 64px);
	max-height: calc(100vh - 64px);
	overflow: hidden;
}
.contents.schedule.attendance-calendar-page > .container__inner {
	flex: 1 0 0;
	min-height: 0;
	overflow: hidden;
	width: 100%;
}
.container > .contents.schedule.scroll {
	flex: 1 1 0;
	align-self: stretch;
	min-width: 0;
	min-height: 0;
	height: 100%;
	box-sizing: border-box;
}
.schedule .container__inner { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; align-self: stretch; min-height: 0; font-family: var(--txt-font-family); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.schedule .container__inner > .attendance-header-wrap { flex-shrink: 0; }
/* 근무시간/연차/부서 현황 — Visit 페이지와 동일하게 뷰포트 높이 고정 후 내부 스크롤 */
.contents-inner.attendance-work-stats-wrap {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 20px;
	width: 100%;
	max-width: 1600px;
	padding: 36px 40px;
	height: calc(100vh - 64px);
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: #e0e3eb transparent;
}
.contents-inner.attendance-work-stats-wrap::-webkit-scrollbar { width: 8px; }
.contents-inner.attendance-work-stats-wrap::-webkit-scrollbar-thumb {
	min-height: 36px;
	background-color: #e0e3eb;
	border-radius: 5px;
}
.contents-inner.attendance-work-stats-wrap::-webkit-scrollbar-track { background: transparent; }
.contents-inner.attendance-work-stats-wrap::-webkit-scrollbar-thumb:hover {
	background: #e9e9e9;
	border-radius: 5px;
	cursor: pointer;
}
.attendance-header-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.attendance-header-wrap .attendance-header { display: flex; padding: 0; align-items: center; gap: 40px; align-self: stretch; background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300); }
.attendance-header-wrap .attendance-header.attendance-header--status { padding-bottom: 8px; border-bottom: 1px solid var(--clr-w300); gap: 16px; }
.attendance-header-wrap .attendance-header.schedule-main-header { padding: 20px 56px 16px 40px; }
.attendance-header-wrap .attendance-header .attendance-header-title { flex: 1 0 0; color: #151515; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); }
.attendance-header-wrap .attendance-header .attendance-list-header-title { flex: 1 0 0; color: #151515; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); padding-bottom: 8px; }
.attendance-header-wrap .attendance-header.attendance-header--status .attendance-list-header-title { border-bottom: 0; padding-bottom: 0; min-width: 0; flex: 1 1 auto; }
.attendance-header-wrap .attendance-header .attendance-header-breadcrumb { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); white-space: nowrap; line-height: 1; }
.attendance-header-wrap .attendance-header .attendance-header-breadcrumb__home-icon { width: 16px; height: 16px; flex-shrink: 0; background: url(../../../figma/svg/breadcrumbs_lightgray_16.svg) no-repeat center / 16px 16px; }
.attendance-header-wrap .attendance-header .attendance-header-breadcrumb__sep { width: 12px; height: 12px; color: var(--clr-w500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); background: url(../../../figma/svg/arrow_right_lightgray_12.svg) no-repeat center / 12px 12px; }
.attendance-header-wrap .attendance-header .attendance-header-breadcrumb__item { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.attendance-header-wrap .attendance-header .attendance-header-breadcrumb__item.is-current { color: var(--txt-color-t900); font-weight: var(--txt-weight-semibold); }
.attendance-header-wrap .attendance-header .attendance-header-btn-wrap { display: flex; height: 36px; justify-content: flex-end; align-items: center; gap: 16px; }
.attendance-header-wrap .attendance-header .attendance-header-btn-wrap .attendance_policy_btn { display: flex; width: 36px; min-width: 0; height: 36px; padding: 14px 10px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1 / 1; }
.attendance-header-wrap .attendance-header .attendance-header-btn-wrap .attendance_policy_btn::before { content: ""; width: 16px; height: 16px; background: url(../../../figma/svg/policy_black_16.svg) no-repeat center / 18px 18px; flex-shrink: 0; }

/* 근태 — 신청 내역 전용 페이지 */
.attendance-request-page .attendance-request-history { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; }
.attendance-request-page .attendance-request-history__tabs { display: flex; align-items: center; gap: 8px; }
.attendance-request-page .attendance-request-history__tab { display: flex; position: relative; height: 52px; min-width: 80px; min-height: 52px; max-height: 52px; padding: 15px 16px; justify-content: center; align-items: center; gap: 4px; color: var(--txt-color-t70); font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); border: 0; background: transparent; cursor: pointer; }
.attendance-request-page .attendance-request-history__tab-inner { position: relative; display: inline-flex; align-items: center; justify-content: center; max-width: 100%; }
.attendance-request-page .attendance-request-history__tab-text { display: inline-block; }
.attendance-request-page .attendance-request-history__tab-badge { position: absolute; top: -15px; right: -29px; z-index: 1; box-sizing: border-box; min-width: 16px; height: 16px; border-radius: 8px; background: var(--clr-p600); color: var(--clr-w100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); text-align: center; display: flex; align-items: center; justify-content: center; }
.attendance-request-page .attendance-request-history__tab.is-active { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }
.attendance-request-page .attendance-request-history__tab[data-tab="vacation"]::before { content: ""; position: absolute; left: -5px; top: 50%; transform: translateY(-50%); width: 1px; height: 14px; background-color: var(--clr-w300); }
.attendance-request-page .attendance-request-history__title-row { display: flex; min-width: 180px; height: 100%; align-items: center; gap: 12px; flex: 1 0 0; }
.attendance-request-page .attendance-request-history__section-title { margin: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.attendance-request-page .attendance-request-history__title-row .listTotal { display: flex; align-items: center; gap: 4px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.attendance-request-page .attendance-request-history__title-row .listTotal p { margin: 0; color: var(--txt-color-p600); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); }
.attendance-request-page .attendance-request-history__filter { display: flex; min-width: 180px; align-items: center; gap: 12px; }
.attendance-request-page .attendance-request-history__filter .attendance-request-history-filter-date, 
.attendance-request-page .attendance-request-history__filter .attendance-request-history-filter-status { display: flex; align-items: center; gap: 8px; }
.attendance-request-page .attendance-request-history__select { min-width: 120px; height: 36px; padding: 0 32px 0 12px; border: 1px solid var(--clr-w300); border-radius: 6px; font-size: var(--txt-size-14); color: var(--txt-color-t900); background: var(--clr-w100); box-sizing: border-box; cursor: pointer; }
.attendance-request-page .attendance-request-history__body-wrap { display: flex; width: 100%; max-width: 100%; min-width: 550px; box-sizing: border-box; flex-direction: column; align-items: stretch; align-self: stretch; flex: 1 0 0; border-radius: 12px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
.attendance-request-page .attendance-request-history__table-wrap { display: flex; align-items: stretch; gap: 24px; align-self: stretch; flex-direction: column; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.attendance-request-page .attendance-request-history .attendance-request-history-filter-wrap { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.attendance-request-page .attendance-request-history .attendance-request-history-filter-form { display: flex; padding: 16px 24px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.attendance-request-page .attendance-request-history__toolbar { display: flex; align-items: flex-end; align-content: flex-end; gap: 8px 12px; align-self: stretch; flex-wrap: wrap; }
.attendance-request-page .attendance-request-history__toolbar .attendance-request-history__filter .attendance-request-history-filter-date .cp-date-range-picker #datepicker_popup { left: calc(0% - 63px) !important; }
.attendance-request-page .attendance-request-history__table { display: flex; width: 100%; max-width: 100%; min-width: 550px; box-sizing: border-box; flex-direction: column; align-items: stretch; flex: 1 0 0; align-self: stretch; }
.attendance-request-page .attendance-request-history__table thead { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; width: 100%; min-width: 0; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
.attendance-request-page .attendance-request-history__table thead tr { display: flex; align-items: center; align-self: stretch; width: 100%; min-width: 0; box-sizing: border-box; }
.attendance-request-page .attendance-request-history__table thead th { display: flex; align-items: center; align-self: stretch; height: 44px; border-bottom: 1px solid var(--clr-w300); background: var(--clr-w200); box-sizing: border-box; }
.attendance-request-page .attendance-request-history__table tbody { display: flex; align-items: stretch; align-self: stretch; width: 100%; min-width: 0; flex-direction: column; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.attendance-request-page .attendance-request-history__table tbody tr { display: flex; align-items: center; align-self: stretch; width: 100%; min-width: 0; box-sizing: border-box; border-bottom: 1px solid var(--clr-w300); }
.attendance-request-page .attendance-request-history__table tbody td { height: 48px; color: var(--txt-color-t900); vertical-align: middle; word-break: break-word; }
.attendance-request-page .attendance-request-history__table tbody tr:last-child td { border-bottom: 0; }
.attendance-request-page .attendance-request-history__col-no { display: flex; width: 54px; box-sizing: border-box; padding: 0 12px 0 12px; justify-content: center; align-items: center; gap: 12px; }
.attendance-request-page .attendance-request-history__col-requester { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 12px; width: 100px; flex-shrink: 0; word-break: break-all; }
.attendance-request-page--approval .attendance-request-history__toolbar { justify-content: space-between; align-items: center; }
.attendance-request-page--approval .attendance-request-history__filter { margin-left: auto; flex-wrap: wrap; justify-content: flex-end; }
.attendance-request-page--approval .attendance-request-history__col-action { width: 120px; min-width: 120px; }
.attendance-request-page .attendance-request-history__btn-process-approval { display: inline-flex; align-items: center; justify-content: center; height: 32px; padding: 0 14px; border: 0; border-radius: 6px; background: var(--txt-color-p600); color: var(--clr-w100); font-size: var(--txt-size-13); font-weight: var(--txt-weight-semibold); cursor: pointer; flex-shrink: 0; white-space: nowrap; box-sizing: border-box; }
.attendance-request-page .attendance-request-history__btn-process-approval:hover { filter: brightness(0.92); }
.attendance-request-page .attendance-request-history__col-content { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 12px; flex: 1 1 0; min-width: 0; }
.attendance-request-page .attendance-request-history__col-reason { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 12px; flex: 1 1 0; min-width: 0; max-width: 463px; overflow: visible; word-break: normal; }
.attendance-request-page .attendance-request-history__col-title,
.attendance-request-page .attendance-approval-history__col-title { display: flex; box-sizing: border-box; height: 44px; max-width: 160px; min-width: 0; padding: 0 12px; align-items: center; gap: 12px; flex: 1 0 0; }
.attendance-request-page .attendance-request-history__col-reason .tooltip.attendance-request-history__reason-tooltip { flex: 1 1 0; min-width: 0; align-self: stretch; position: relative; z-index: 2; overflow: visible; display: flex; align-items: center; }
.attendance-request-page .attendance-request-history__col-reason .tooltip.attendance-request-history__reason-tooltip .attendance-request-history__cell-ellipsis { flex: 1 1 0; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
.attendance-request-page .attendance-request-history__col-reason > .attendance-request-history__cell-ellipsis { align-self: center; flex: 1 1 0; min-width: 0; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip:hover { z-index: 4; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip .tooltiptext { position: absolute; left: 50%; right: auto; top: auto; bottom: 100%; transform: translateX(-50%); margin-bottom: 8px; margin-right: 0; width: max-content; max-width: min(250px, calc(100vw - 48px)); min-width: 0; box-sizing: border-box; padding: 10px; border-radius: 6px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; letter-spacing: var(--txt-letter-spacing); box-shadow: var(--ds-e300); -webkit-box-shadow: var(--ds-e300); z-index: 5; pointer-events: none; isolation: isolate; word-break: break-word; overflow-wrap: break-word; display: block; align-items: unset; justify-content: unset; flex-flow: unset; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::before { content: ""; position: absolute; left: 50%; top: 100%; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; margin-top: 0; background-color: rgba(0, 0, 0, 0.27); clip-path: polygon(50% 100%, 0 0, 100% 0); filter: blur(1.5px); -webkit-filter: blur(1.5px); opacity: 0.55; z-index: -2; transform: none; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::after { content: ""; position: absolute; left: 50%; top: 100%; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; background-color: var(--clr-w800); clip-path: polygon(50% 100%, 0 0, 100% 0); z-index: -1; transform: none; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip:hover .tooltiptext { transform: translateX(-50%); transition: opacity 0.2s ease, visibility 0.2s ease; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip.is-truncated:hover .tooltiptext { visibility: visible !important; opacity: 1 !important; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated) .tooltiptext,
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated):hover .tooltiptext { visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.attendance-request-page .attendance-request-history__col-date { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 12px; width: 170px; }
.attendance-request-page .attendance-request-history__col-user { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 12px; width: 100px; }
.attendance-request-page .attendance-request-history__col-action { display: flex; box-sizing: border-box; padding: 0 12px; align-items: center; gap: 8px; width: 105px; overflow: visible; }
.attendance-request-page .attendance-request-history__empty { text-align: center; padding: 40px 16px !important; color: var(--txt-color-t70); }
.attendance-request-history__table-wrap .paging { align-self: stretch; }
.attendance-request-page .attendance-request-history__status-text { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; font-weight: var(--txt-weight-medium); font-size: var(--txt-size-12); color: transparent; background: transparent;}
.attendance-request-page .attendance-request-history__status-text--approved { color: var(--clr-g900); background: var(--clr-g000); }
.attendance-request-page .attendance-request-history__status-text--rejected { color: var(--clr-r900); background: var(--clr-r000); }
.attendance-request-page .attendance-request-history__status-text--pending { color: var(--txt-color-t70); }
.attendance-request-page .attendance-request-history__col-status .attendance-request-history__info,
.attendance-request-page .attendance-request-history__col-action .tooltip .attendance-request-history__info { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; margin-left: 6px; padding: 0; border: 0; border-radius: 50%; background: var(--clr-n80); color: var(--clr-w100); font-size: 11px; font-weight: var(--txt-weight-bold); font-style: italic; cursor: default; vertical-align: middle; }
.attendance-request-page .attendance-request-history__col-action .tooltip.attendance-request-history__approval-tooltip { margin-left: 0; align-self: center; }
.attendance-request-page .attendance-request-history__col-action .tooltip.attendance-request-history__approval-tooltip .attendance-request-history__info { width: 16px; height: 16px; margin-left: 0; padding: 0; border: 0; border-radius: 0; background: transparent url("../../../figma/svg/info_filled_bluegray_24.svg") no-repeat center / 16px 16px; color: transparent; font-size: 0; line-height: 0; font-weight: unset; font-style: normal; cursor: default; flex-shrink: 0; align-self: center; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip { position: relative; z-index: 2; overflow: visible; display: inline-flex; align-items: center; justify-content: center; line-height: 0; vertical-align: middle; min-height: 16px; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip:hover { z-index: 3; }
/* 아이콘 왼쪽으로 가로 펼침(위로 올라가며 세로로 찌그러지는 현상 방지). 오른쪽 끝 = 아이콘 옆, 길어지면 왼쪽으로만 확장 */
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip .tooltiptext { position: absolute; left: auto; right: 100%; top: 50%; bottom: auto; transform: translateY(-50%); width: max-content; max-width: min(320px, calc(100vw - 48px)); min-width: 0; box-sizing: border-box; margin-right: 10px; margin-bottom: 0; padding: 10px; border-radius: 6px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; letter-spacing: var(--txt-letter-spacing); box-shadow: var(--ds-e300); -webkit-box-shadow: var(--ds-e300); z-index: 3; pointer-events: none; isolation: isolate; word-break: break-word; overflow-wrap: break-word; display: block; align-items: unset; justify-content: unset; flex-flow: unset; }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip .tooltiptext::before { content: ""; position: absolute; left: 100%; top: 50%; right: auto; bottom: auto; width: 6px; height: 12px; margin-top: 0; margin-left: 0; background-color: rgba(0, 0, 0, 0.27); clip-path: polygon(100% 50%, 0 0, 0 100%); filter: blur(1.5px); -webkit-filter: blur(1.5px); opacity: 0.55; z-index: -2; transform: translateY(-50%); }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip .tooltiptext::after { content: ""; position: absolute; left: 100%; top: 50%; right: auto; bottom: auto; width: 6px; height: 12px; background-color: var(--clr-w800); clip-path: polygon(100% 50%, 0 0, 0 100%); z-index: -1; transform: translateY(-50%); }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip .tooltiptext em { font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); margin: 0; color: var(--txt-color-t100); letter-spacing: var(--txt-letter-spacing); }
.attendance-request-page .attendance-request-history__table .tooltip.attendance-request-history__approval-tooltip:hover .tooltiptext { color: var(--txt-color-t100); font-size: var(--txt-size-12); letter-spacing: var(--txt-letter-spacing); transform: translateY(-50%); transition: opacity 0.2s ease, visibility 0.2s ease; }
.attendance-request-page .attendance-request-history__btn-cancel:not(.btn_ex) { height: 32px; padding: 0 14px; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); font-size: var(--txt-size-13); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); cursor: pointer; }
.attendance-request-page .attendance-request-history__btn-cancel:not(.btn_ex):hover { background: var(--clr-n30); }
.attendance-request-page .attendance-request-history__btn-cancel.btn_ex { align-self: center; flex-shrink: 0; height: 28px !important; font-weight: var(--txt-weight-medium) !important;}
.attendance-request-page .attendance-request-history__pager { display: flex; justify-content: center; padding: 16px 0 0; }
.attendance-request-page .attendance-request-history__pager-inner { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: center; }
.attendance-request-page .attendance-request-history__pager-btn { min-width: 32px; height: 32px; padding: 0 8px; border: 1px solid var(--clr-w300); border-radius: 4px; background: var(--clr-w100); font-size: var(--txt-size-13); color: var(--txt-color-t900); cursor: pointer; }
.attendance-request-page .attendance-request-history__pager-btn:hover:not(:disabled) { background: var(--clr-n30); }
.attendance-request-page .attendance-request-history__pager-btn:disabled { opacity: 0.45; cursor: default; }
.attendance-request-page .attendance-request-history__pager-btn.is-current { background: var(--txt-color-t900); border-color: var(--txt-color-t900); color: var(--clr-w100); font-weight: var(--txt-weight-semibold); }

.schedule .container__inner.attendance-request-page { display: flex; padding: 36px 40px; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.schedule .container__inner.attendance-request-page.attendance-request-page--approval { gap: 20px !important; }
.attendance-header-wrap .attendance-filter-wrap { display: flex; padding: 12px 56px 12px 40px; align-items: center; gap: 16px; align-self: stretch; background: var(--clr-n700); }
.maincontant__section__info--box .attendance_status { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; padding: 20px; gap: 12px; background: var(--clr-w100); border-radius: 12px; box-shadow: var(--ds-e200); }
.maincontant__section__info--box .attendance_status.leave { opacity: .5; pointer-events: none; }
.maincontant__section__info--box .attendance_status .attendance_status_dashboard { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_manage,
.maincontant__section__info--box .attendance_status .attendance_status_leave { border: 0; margin: 0; padding: 0; width: 100%; }
.maincontant__section__info--box .attendance_status .attendance_status_manage { gap: 16px; display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance-page-btn { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance-page-btn > span { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); }
.maincontant__section__info--box .attendance_status .attendance-page-btn .attendance_status_manage-link { padding: 8px 0 8px 16px; line-height: 0; }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 400; font-style: normal; }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i { display: flex; align-items: center; gap: 4px; font-style: normal; overflow: hidden; }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i.off { color: #969CB0; }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i::before { content: ''; display: block; width: 12px; height: 12px; background-repeat: no-repeat; background-size: cover; }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i:nth-child(1)::before { background-image: url('../../images/icon/ico_gps_blue.svg'); }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i:nth-child(2)::before { background-image: url('../../images/icon/ico_wifi_blue.svg'); }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i.off:nth-child(1)::before { background-image: url('../../images/icon/ico_gps_gray.svg'); }
.maincontant__section__info--box .attendance_status .attendance_status_manage h4 span i.off:nth-child(2)::before { background-image: url('../../images/icon/ico_wifi_gray.svg'); }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime { display: flex; flex-direction: column; gap: 16px; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info { display: flex; align-items: center; gap: 6px; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info::before { content: none; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_date { display: flex; align-items: center; gap: 6px; flex: 1 0 0; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_date img { width: 16px; height: 16px; display: block; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info small { display: flex; align-items: stretch; gap: 6px; margin-left: 6px; color: #969CB0; font-size: 12px; font-weight: 400; line-height: 1; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info small::before { content: ''; display: block; width: 1px; background-color: #969CB0; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul { display: flex; align-items: stretch; gap: 16px; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li { position: relative; display: flex; flex-direction: column; align-items: center; flex: 1 0 0; min-width: 80px; gap: 8px; padding: 16px; background-color: var(--clr-n30); border-radius: 6px; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li span{ font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li em span{ font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); text-align: center; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li .attendance-edit-trigger { position: absolute; right: 12px; bottom: 12px; width: 14px; height: 14px; display: none; align-items: center; justify-content: center; cursor: pointer; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li[data-has-time='true'] .attendance-edit-trigger { display: flex; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .workingtime ul li .attendance-edit-trigger img { width: 14px; height: 14px; }

.maincontant__section__info--box .attendance_status .attendance_status_leave { border: 0; margin: 0; padding: 0; width: 100%;}
.maincontant__section__info--box .attendance_status .attendance_status_leave ul { display: flex; align-items: stretch; gap: 16px; min-width: 0; }

.maincontant__section__info--box .attendance_status [class*='attendance_status-btn-'] { transition: all .3s ease; display: flex; align-items: center; justify-content: center; width: 100%; height: 38px; color: #FFF; font-size: 14px; font-weight: 600; line-height: 1.25; border: none; cursor: pointer; }
.maincontant__section__info--box .attendance_status [class*='attendance_status-btn-'].disabled { pointer-events: none; background-color: #EAEBEE; color: #4C5266; border-color: #EAEBEE; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-commute { background-color: #1382F4; border: 1px solid #1382f4; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-commute:not(:disabled):hover { background-image: linear-gradient(to top, #1382f5, #3695fa); -webkit-box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); border-color: #3695fa; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-commute:disabled { pointer-events: none; cursor: default; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-leave { background-color: #5a6681; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-leave:hover { opacity: .85; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-shift { background-color: #06315f; border: 1px solid #06315f; }
.maincontant__section__info--box .attendance_status .attendance_status-btn-shift:hover { background-image: linear-gradient(to top, #06315f, #0c4786); -webkit-box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); box-shadow: 0px 8px 7px 0 rgba(0, 0, 0, 0.02); border-color: #0c4786; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_date em { font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_flags { display: flex; align-items: center; gap: 4px; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_flags i { display: flex; align-items: center; justify-content: center; gap: 8px; width: 50px; min-width: 50px; max-height: 20px; min-height: 20px; height: 20px; padding: 0 8px; border-radius: 20px; border: 1px solid var(--clr-p600); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-p600); font-style: normal; text-align: center; }
.maincontant__section__info--box .attendance_status .attendance_status_manage .info .attendance_status_flags i.off { border: 1px solid var(--clr-w400); color: var(--txt-color-t300); }
.maincontant__section__info--box .attendance_status .attendance_status_actions { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_actions button { display: flex; flex: 1 0 0; }

.maincontant__section__info--box .attendance_status .attendance_status_leave { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-top: 20px; align-self: stretch; box-shadow: inset 0 1px 0 var(--clr-w300); }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-head { gap: 8px; display: flex; align-items: center; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-head h4 { color: var(--txt-color-t900); font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); flex: 1 0 0; }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-next { color: var(--clr-n70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }

.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary { display: flex; align-items: center; justify-content: center; align-self: stretch; }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric { display: flex; flex-direction: column; align-items: center; gap: 4px; border-radius: 6px; flex: 1 0 0; }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric > span { align-self: stretch; text-align: center; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric > em { display: flex; height: 52px; justify-content: center; align-items: center; gap: 2px; align-self: stretch; text-align: center; color: var(--txt-color-t900); font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); background: var(--clr-n30); border-radius: 6px; }
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric > em .daytext { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); margin-top: 4px; }
/* --- CSS4 설정(:has) 별도 분리 ---
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric > em .daytext:has(~ .daytext) { margin-right: 4px; }*/
.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status_leave-summary .leave-metric.is-highlight > em { color: var(--clr-p700); }

.maincontant__section__info--box .attendance_status .attendance_status_leave .attendance_status-request-btn {
	align-self: stretch;
}

/*@media (max-width: 1600px) and (min-width: 0px) {
    .maincontant__section__info--box .attendance_status { padding: 30px; }
    .maincontant__section__info--box .attendance_status [class*='attendance_status-btn-'] { height: 40px; }
}*/

/* ============================================
   대시보드 컨테이너 및 사이드바 스타일 (퍼블리싱)
   ============================================ */
.maincontant__section__list--container .maincontant__section__list--body.line { height: 363px; }
.maincontant__section__list--container .maincontant__section__list--body.locker.line { height: 363px; }

.maincontant__section__list--container .maincontant__section__list--body .list-head-status { position: relative; display: flex; justify-content: flex-start; align-items: center; gap: 10px; height: 40px; min-height: 40px; margin-right: 20px; padding: 0 20px; background-color: #F8F8FA; }
.maincontant__section__list--container .maincontant__section__list--body .list-head-status .status-light { display: block; width: 12px; height: 12px; border-radius: 50%; background-color: #969CB0; }
.maincontant__section__list--container .maincontant__section__list--body .list-head-status .status-title { color: #151515; font-size: 16px; font-weight: 600; line-height: 1; }
.maincontant__section__list--container .maincontant__section__list--body .list-head-status .status-desc { color: #5A6681; font-size: 14px; font-weight: 400; line-height: 18px; }
.maincontant__section__list--container .maincontant__section__list--body .list-head-status .btn-request { position: absolute; right: 0; top: 0; display: block; width: 40px; height: 40px; text-indent: -9999px; background-image: url(../../images/icon/ico_pencil-square.svg); background-repeat: no-repeat; background-position: center; background-size: auto; }
.maincontant__section__list--container .maincontant__section__list--body .list-head-status.active .status-light { background-color: #1382F4; }
.maincontant__section__list--container .maincontant__section__list--body .no-data { padding-top: 298px; background-position: 50% 35%; display: flex; flex-direction: column; align-items: center; align-self: stretch; }
.maincontant__section__list--container .maincontant__section__list--body .no-data h3 { color: var(--txt-color-t900); font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); }
.maincontant__section__list--container .maincontant__section__list--body .no-data p { margin-top: 15px; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.maincontant__section__list--container .maincontant__section__list--body .apply-list.leave { opacity: .5; pointer-events: none; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list > li .apply-info dt strong { color: #222; font-weight: 600; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list > li .apply-info dd .apply > h4 { line-height: 1; color: #969CB0; font-size: 14px; font-weight: 400; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list > li .apply-info dd .apply > h4 strong { line-height: 1; color: #151515; font-size: 18px; font-weight: 600; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list > li .apply-info dd .apply > p { line-height: 1; color: #151515; font-size: 14px; font-weight: 400; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list > li .apply-info dd .btn-wrap span { display: flex; align-items: center; justify-content: center; width: 120px; height: 40px; font-size: 16px; font-weight: 600; line-height: 1; }

/* maincontant__section__list--submenu가 있을 때 aside의 max-width 설정 - container 다음에 submenu가 바로 있을 때만 231px 적용 */
/*.maincontant__section__list--container:not(:last-child) .maincontant__section__list--aside { max-height: 363px; }*/
.maincontant__section__list--container .maincontant__section__list--aside.no-reservation { display: none; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt { position: relative; display: flex; gap: 4px; align-items: center; height: 44px; min-height: 44px; color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); cursor: pointer; transition: color .2s ease; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt::before { transition: all .3s ease; content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 12px; height: 7px; background-image: url(../../images/icon/ico_chevron_down.svg); background-repeat: no-repeat; background-position: center; background-size: contain; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt.active::before { transform: translateY(-50%) rotate(180deg); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item.approval dt::before { display: none; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item.approval dt .btn-more { display: block; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt .badge { transition: all .3s ease; display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; background-color: var(--clr-p600); border-radius: 8px; color: var(--txt-color-t100); text-align: center; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt .badge.warning,
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dt.active .badge.warning { background-color: #D24D4D; }

.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd { display: flex; max-height: 0; overflow: hidden; padding: 0 20px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; transition: max-height .28s ease, padding .28s ease; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open { max-height: 280px; padding: 0 0 12px; overflow-x: hidden; overflow-y: hidden; min-height: 0; -webkit-overflow-scrolling: touch; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open.is-scrollable { overflow-y: auto; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd.is-open > button { display: flex; height: 36px; min-width: 80px; padding: 0 12px; justify-content: center; align-items: center; gap: 4px; align-self: stretch; border-radius: 6px; background: var(--clr-n100, #8D96A6); color: var(--txt-colr-t100, #FFF); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd .btn-more { display: block; margin-top: 10px; color: #969CB0; text-align: right; font-size: 12px; font-weight: 400; line-height: 1; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul { display: flex; flex-flow: column; align-self: stretch; gap: 10px; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li { display: flex; padding: 12px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background-color: var(--clr-w100); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item #vacationContent > ul li { min-height:91px; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .box-title { width: 100%; display: flex; justify-content: space-between; align-items: center; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .box-title strong { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; border-radius: 4px; border: 1px solid var(--clr-p600); gap: 8px; color: var(--txt-color-p600); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .box-title strong.locker-day-over { color: var(--clr-r900); border: 1px solid var(--clr-r900);}
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .box-title a { color: #969CB0; text-align: right; font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: -0.5px; text-decoration: none; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item.warning dd ul li .box-title strong { color: #D24D4D; }

.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .box-body { width: 100%; display: flex; flex-flow: column; gap: 4px; align-items: flex-start; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .body-leave-date { display: flex; flex-direction: column; color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .body-reason { color: var(--txt-color-t70, #999); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .body-place { color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .body-space { color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd ul li .body-date { color: var(--txt-color-t70, #999); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }

.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dd .sidebar-card-loading { padding: 20px; text-align: center; color: #999; font-size: 14px; }
.attendance-status-bar { position: relative; display: flex; justify-content: flex-start; align-items: center; align-self: stretch; gap: 10px; height: 40px; min-height: 40px; margin: 10px 20px 0; padding: 0 20px; background-color: #F8F8FA; }

div[role='dialog'] .ui-button .ui-icon { display: inherit; }
.ui-dialog .ui-widget-content { background: #ffffff; }
.ui-dialog .ui-dialog-content { padding: 0; overflow: hidden; }
.maincontant__section__info--weather dt { min-height: auto; line-height: 1; }
.maincontant__section__info--box { position: relative; }
.maincontant__section__info--box #defaultBoxContent { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; border-radius: 12px; padding: 20px; background: var(--clr-w100); box-shadow: var(--ds-e200); }
.maincontant__section__info--box { position: relative !important; }
.attendance-management-section { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out; }
.attendance-management-section.active { opacity: 1; visibility: visible; pointer-events: auto; }
.maincontant__section__info--box-content.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.attendance-management-container { display: flex; gap: 16px; width: 100%; height: 100%; }
.commute-management { flex: 6; padding: 16px; background: transparent; min-width: 0; position: relative; }
.commute-management::after { content: ''; position: absolute; right: 0; top: 15%; bottom: 15%; width: 1px; border-left: 1px dashed #ddd; }
.commute-management-title { font-size: 16px; font-weight: 600; color: #1976d2; margin-bottom: 12px; }
.today-work-info { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; font-size: 13px; color: #666; }
.time-display-box { display: flex; gap: 12px; margin-bottom: 12px; }
.time-box { flex: 1; background: #f5f5f5; padding: 12px; border-radius: 4px; text-align: center; }
.time-box-label { font-size: 11px; color: #999; margin-bottom: 6px; }
.time-box { position: relative; }
.time-box-value { font-size: 20px; font-weight: 600; color: #1976d2; cursor: pointer; position: relative; transition: color 0.2s; }
.time-box-value:hover { color: #1565c0; }
.time-box-correction-overlay { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.95); border-radius: 4px; align-items: center; justify-content: center; font-size: 12px; color: #1976d2; font-weight: 600; cursor: pointer; z-index: 10; transition: opacity 0.2s; }
.time-box[data-has-time="true"]:hover .time-box-correction-overlay { display: flex; }
.time-box-value .time-display { transition: opacity 0.2s; }
.checkout-button { width: 100%; padding: 10px; background: #1976d2; color: white; border: none; border-radius: 4px; font-size: 14px; font-weight: 600; cursor: pointer; }
.checkout-button:hover { background: #1565c0; }
.checkout-button:disabled { background: #ccc; cursor: not-allowed; }
.status-indicators { display: flex; gap: 12px; justify-content: flex-end; margin-top: 12px; }
.status-indicator { font-size: 12px; color: #999; }
.annual-leave-details { flex: 4; padding: 16px; background: transparent; min-width: 0; }
.annual-leave-details-title { font-size: 16px; font-weight: 600; color: #1976d2; margin-bottom: 12px; }
.leave-summary { display: flex; gap: 12px; margin-bottom: 12px; }
.leave-summary-item { flex: 1; text-align: center; }
.leave-summary-label { font-size: 12px; color: #999; margin-bottom: 8px; }
.leave-summary-value { font-size: 18px; font-weight: 600; color: #1976d2; }
.action-buttons { display: flex; flex-direction: column; gap: 8px; }
.action-button { padding: 10px; border: none; border-radius: 4px; font-size: 13px; font-weight: 600; cursor: pointer; color: white; }
.action-button.leave { background: #424242; }
.action-button.schedule { background: #1976d2; }
.action-button:hover { opacity: 0.9; }
.attendance-dot-navigation { position: absolute; bottom: 10px; right: 10px; display: none; gap: 8px; z-index: 10; }
.attendance-dot { width: 8px; height: 8px; border-radius: 50%; background: #ccc; cursor: pointer; transition: background 0.3s; }
.attendance-dot.active { background: #1976d2; }
.maincontant__section__info--box { user-select: none; }
.reservation-card { flex: 1; padding: 5px 5px; background: #f5f5f5; border-radius: 0; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.maincontant__section__list--head .date-btn li:last-child button .ico_plus { display: block; width: 16px; height: 16px; background: url(../../../figma/svg/more_info_12.svg) no-repeat center; text-indent: -9999px; overflow: hidden; }
.maincontant__section__list--head .date-btn li:last-child button.on .ico_plus { background: url(../../images/icon/ico_plus-small-blue.svg) no-repeat center; }

.popobj-inputform { padding: 0; display: flex; flex-flow: column; gap: 20px; }
.popobj-inputform .inputform__row__colm { flex: 1; display: flex; gap: 10px; align-items: stretch; }
.popobj-inputform .input-group {flex: 1; display: flex; align-items: stretch; gap: 3px; }
.popobj-inputform .display-box-pop { flex: 1; display: flex; flex-direction: column; gap: 0; }
.popobj-inputform .display-box-pop dt { height: 25px; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; background-color: #F0F6FF; color: #1382F4; font-size: 14px; font-weight: 600; }
.popobj-inputform .display-box-pop dd { flex: 1; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; background-color: #EFF0F3; color: #5A6681; font-size: 16px; font-weight: 500; }
.popobj-inputform .inputform__row__colm.timeDateOn { min-width: 60%; }
.layer-pop-wrap .layer-pop-area .pop-cont .pop-cont-inner { display: flex; flex-flow: column; gap: 20px; }
.popobj-inputform .inputform__row { flex: 1; display: flex; gap: 10px; align-items: stretch; padding: 0; margin: 0; }
.popobj-inputform .inputform__row__colm label { margin: 0; line-height: 1; }
.popobj-inputform .select-box { flex: 1; min-width: 0; }
.popobj-inputform .inputform__row .input-group .inputform__row__colm > span { align-self: center; }
.popobj-inputform .inputform__row__colm input[type="text"] { color: #5a6681; }
.popobj-inputform .inputform__row__colm > span { display: inline-block; position: relative; flex: 1; }
.popobj-inputform .inputform__row__colm .ui-datepicker-trigger { position: absolute; width: 30px; height: 30px; top: 50%; right: 5px; background: url(../../images/connectplace/common/ico_calendar.png) no-repeat 50%; background-size: 18px; text-indent: -9999px; transform: translateY(-50%); }
.popobj-inputform .time-select-wrap { flex: 1; }
.layer-pop-wrap .ui-selectmenu-button.ui-button { border: 0; border: 1px solid #ddd; }
.popobj-attendees .attendees-tit { display: flex; align-items: center; justify-content: space-between; background-color: #06315f; box-sizing: border-box; height: 40px; }
.popobj-attendees .attendees-tit span { font-size: 16px; color: #fff; font-weight: 600; margin-left: 20px; }
.popobj-attendees .attendees-tit button { height: 100%; color: #fff; font-size: 14px; font-weight: 500; padding: 0 15px 0 40px; background-image: url(../../images/icon/ico_schedule_search.svg); background-repeat: no-repeat; background-position: left 17px center; background-size: 15px; background-color: #1c446f; border: 0; box-sizing: border-box; }
.popobj-attendees .attendees-cont { margin-top: 0; height: auto; border-top: 0; border: 1px solid #f0f0f0; }
.popobj-attendees .attendees-cont .attendees-list { min-height: 52px; max-height: 100px; overflow-y: auto; }
.popobj-attendees .attendees-cont .attendees-list li { border-bottom: 1px solid rgba(0, 0, 0, .1); display: flex; align-items: center; height: 50px; position: relative; padding: 0 40px 0 20px; box-sizing: border-box; font-size: 14px; color: #999; }
.popobj-attendees .attendees-cont .attendees-list li:last-child { border-bottom: 0; }
.popobj-attendees .attendees-cont .attendees-list li .name { font-size: 13px; font-weight: 500; color: #1382f4; width: auto; min-width: 80px; max-width: 200px; margin-right: 15px; padding: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.popobj-attendees .attendees-cont .attendees-list li .name strong { color: #222; font-weight: 600; font-size: 16px; margin-right: 10px; }
.popobj-attendees .attendees-cont .attendees-list li .team, .popobj-attendees .attendees-cont .attendees-list li .team strong { color: #4c5266; font-size: 14px; font-weight: 400; width: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.popobj-attendees .attendees-cont .attendees-list li .team, .popobj-attendees .attendees-cont .attendees-list li .team strong { color: #4c5266; font-size: 14px; font-weight: 400; width: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.popobj-attendees .attendees-cont .attendees-list li button { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); width: 40px; height: 20px; margin-top: 0; background-repeat: no-repeat; background-position: 50%; background-image: unset; background-color: #A9B4C0; color: #fff; text-indent: 0; text-align: center; font-size: 12px; font-weight: 500; }

.home-attendance-request .input_group select { width: auto; }

/* 근태 캘린더 스타일 */
.schedule-calendar-monthview-calendar { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.schedule-calendar-weekview-calendar-date { height: 40px; background-color: var(--clr-w100); display: flex; justify-content: center; align-items: center; flex: 1 0 0; font-weight: var(--txt-weight-semibold); font-size: var(--txt-size-14); color: var(--txt-color-t500); border-right: 1px solid var(--clr-w300); border-bottom: 1px solid var(--clr-w300); }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component { display: flex; padding: 12px; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1 0 0; align-self: stretch; border-right: 1px solid var(--clr-w300);  background: var(--clr-w100); }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component > div > span { display: flex; height: 16px; flex-direction: column; justify-content: center; flex: 1 0 0; color: var(--txt-color-t300); font-size: var(--txt-size-14);  font-weight: var(--txt-weight-medium);}
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component:not(.passaway) > div:nth-child(1) { color: #4C5266; font-weight: 500; }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component>div:first-child { display: flex; height: 25px; align-items: center; gap: 4px; align-self: stretch; }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component.passaway>div:first-child.suncolor { color: var(--clr-r900) !important; }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component.passaway>div:first-child.satcolor { color: var(--txt-color-p600) !important;}
.schedule-calendar-monthview-calendar .today_highlight { display: flex; width: auto; min-width: 25px; height: auto !important; padding: 3px 5px; flex: 0 !important; justify-content: center; align-items: center; align-self: stretch; border-radius: 30px; background: var(--clr-p600); color: var(--txt-color-t100) !important; }
.calendar-schedule-options { display: flex; align-items: center; gap: 16px; flex: 1 0 0; }
.schedule-checkbox-group { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; position: relative; }
.schedule-checkbox-group input, .fc-radio input { position: absolute; opacity: 0; pointer-events: none; }
.fc-checkbox-label { display: flex; align-items: center; gap: 3px; color: var(--txt-color-t100); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); }
.fc-checkbox-wrapper { display: flex; align-items: center; gap: 4px; }
.team-schedule-settings { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; position: relative; }
.team-schedule-settings input, .fc-radio input { position: absolute; opacity: 0; pointer-events: none; }
.select-box.team-setting { width: auto; min-width: 0; height: auto; padding: 0; background: none; border: 0; }
.select-box.team-setting > button { display: block; width: 16px; height: 16px; background: url(../../../figma/svg/setting_white_24.svg) no-repeat center/16px; }
.schedule-checkbox-group input[type="checkbox"]:disabled { cursor: not-allowed; opacity: 0.6; }
.schedule-checkbox-group label { display: flex; align-items: center; gap: 3px; color: #5A6681; font-size: 14px; font-weight: 600; line-height: 1; }
.schedule-checkbox-group input[type="checkbox"]:disabled + label { cursor: not-allowed; }
.team-schedule-settings-icon { width: 16px; height: 16px; cursor: pointer; color: #666; transition: color 0.2s; }
.team-schedule-settings-icon:hover { color: #1976d2; }
.calendar-navigation { display: flex; align-items: center; gap: 12px; }
.calendar-nav-button { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: #f5f5f5; border: 1px solid #e0e0e0; border-radius: 4px; cursor: pointer; font-size: 16px; color: #333; transition: background 0.2s; }
.calendar-nav-button:hover { background: #e0e0e0; }
.calendar-month-text { font-size: 16px; font-weight: 600; color: #333; }
.work-type-legend { display: flex; align-items: center; gap: 8px; }
.legend-item { display: flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 500; }
.legend-color { width: 12px; height: 12px; border-radius: 2px; }
.attendance-today { background-color: #e3f2fd !important; color: #000000 !important; }
.attendance-absent { background-color: #ffebee !important; color: #000000 !important; }
.attendance-partial { background-color: #fff3e0 !important; color: #000000 !important; }
.attendance-future { background-color: #e8f5e8 !important; color: #000000 !important; }
.schedule-block { display: flex; align-items: center; gap: 8px; padding: 4px 0; cursor: pointer; }
.schedule-block-color-bar { width: 4px; height: 20px; border-radius: 2px; flex-shrink: 0; }
.schedule-block-time { font-size: 13px; color: #333; white-space: nowrap; }
.schedule-block-type { display: flex; align-items: center; justify-content: center; height: 16px; width: 36px; border-radius: 1px; font-size: 10px; font-weight: 500; line-height: 1; letter-spacing: -0.5px; }
.list_hide_schedule_box ul { display: flex; align-items: center; gap: 8px; padding: 4px 0; margin: 0; list-style: none; cursor: pointer; }
.list_hide_schedule_box ul::before { content: ''; width: 4px; height: 20px; border-radius: 2px; flex-shrink: 0; }
.list_hide_schedule_box ul span { font-size: 13px; color: #333; white-space: nowrap; }
.schedule-type-office { background-color: #F0F4F8; color: #5A6681 !important; }
.schedule-type-remote { background-color: #E8F5E9; color: #0CB460 !important; }
.schedule-type-outwork { background-color: #FFEFD9; color: #FF9600 !important; }
.schedule-type-vacation { background-color: #E0E9F6; color: #6491D2 !important; }
.schedule-type-late { background-color: #FFEBEE; color: #D24D4D !important; }
.schedule-type-early { background-color: #F5F5F5; color: #828EAC !important; }
.schedule-type-absent { background-color: #FFEBEE; color: #C62828; }
.schedule-type-partial { background-color: #FFF3E0; color: #E65100; }
.schedule-type-holiday { background-color: #FFEBEE; color: #C62828; }
.schedule-bar-office { background-color: #828EAC; }
.schedule-bar-remote { background-color: #0CB460; }
.schedule-bar-outwork { background-color: #FF9600; }
.schedule-bar-vacation { background-color: #6491D2; }
.schedule-bar-late { background-color: #D24D4D; }
.schedule-bar-early { background-color: #9E9E9E; }
.schedule-bar-absent { background-color: #EF5350; }
.schedule-bar-partial { background-color: #FF9600; }
.schedule-bar-holiday { background-color: #EF5350; }
.attendance-sidebar-header { display:flex; box-sizing: border-box; background-image: linear-gradient(to top, #1382f5, #5aa7f7); color: #ffffff; padding: 30px; border-radius: 0; flex-flow: column; gap: 20px; }
.attendance-sidebar-title { font-size: 32px; font-weight: 600; margin: 0; line-height: 1; color: #fff; letter-spacing: -1.2px; }
.attendance-sidebar-subtitle { display: flex; justify-content: space-between; align-items: center; color: #FFF; font-size: 20px; font-weight: 500; line-height: 1; }
.policy-icon { width: 20px; height: 20px; cursor: pointer; opacity: 0.9; }
.policy-icon:hover { opacity: 1; }
.vacation-summary-wrap { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.vacation-summary-wrap .vacation-summary-label { color: var(--txt-color-t100); font-weight: var(--txt-weight-regular); font-size: var(--txt-size-14); }
.vacation-summary-wrap .vacation-summary { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; gap: 8px; border-radius: 6px; background: var(--clr-w100); font-weight: var(--txt-weight-regular); font-size: var(--txt-size-14); } 
.vacation-summary-wrap .vacation-summary .num { color: var(--txt-color-p600); }
.vacation-box { flex: 1; display: flex; flex-flow: column; align-items: stretch; min-width: 0; height: 85px; border: 1px solid rgba(255, 255, 255, 0.40); }
.schedule-request-btn { transition: all .3s ease; display: flex; align-items: center; background-color: #fff; width: 100%; height: 55px; justify-content: center; gap: 10px; font-size: 24px; color: #398bdf; font-weight: 700; }
.schedule-request-btn:hover { background: #f5f5f5; }
.attendance-tabs { display: flex; align-items: center; justify-content: center; width: 100%; height: 50px; }
.attendance-tab { display: flex; align-items: center; justify-content: center; background-color: #336090; width: 100%; height: 100%; font-size: 16px; font-weight: 600; color: #fff; letter-spacing: -0.88px; padding: 0 30px; box-sizing: border-box; }
.attendance-tab.active { background-color: #083463; cursor: default; opacity: 1; }
.attendance-sidebar-content { background: #ffffff; padding: 0; }
.request-history-header .toggle-icon { font-size: 12px; transition: transform 0.3s; color: #666; }
.request-history-header.expanded .toggle-icon { transform: rotate(180deg); }
.request-history-content { display: none; background: #ffffff; padding: 16px; }
.request-history-content.expanded { display: block; }
.request-item { margin-bottom: 12px; padding: 12px; border: 1px solid #e0e0e0; border-radius: 4px; background: #ffffff; }
.request-item:last-child { margin-bottom: 0; }
.request-type-header { font-size: 13px; font-weight: 600; color: #1976d2; margin-bottom: 6px; }
.request-date { font-weight: 500; color: #333333; font-size: 13px; margin-bottom: 4px; }
.request-detail { font-size: 12px; color: #666; margin-bottom: 8px; }
.request-detail.highlight { background-color: #FFEBEE !important; color: #D24D4D !important; }
.request-status { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: 500;}
.request-status.pending { background: #f5f5f5 !important; color: #666 !important; }
.request-status.approved { background: #E8F5E9 !important; color: #0CB460 !important; }
.request-status.rejected { background: #ffebee !important; color: #c62828 !important; }
.request-detail.approved { background: #E8F5E9 !important; color: #0CB460 !important; }

/* 출퇴근기록 테이블 상태별 색상 표시 */
.status-badge { display: inline-block; padding: 4px 6px; border-radius: 4px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); text-align: center; }
.status-badge.working { background-color: var(--clr-p200); color: var(--clr-p600); border: 1px solid var(--clr-p600); }
.status-badge.normal { background-color: var(--clr-w100); color: var(--clr-w700); border: 1px solid var(--clr-w700); }
.status-badge.urging { color: #D24D4D !important; background-color: #FFEBEE !important; }
.status-badge.late { background-color: var(--clr-r000); color: var(--clr-r900); border: 1px solid var(--clr-r900);  }
.status-badge.early-leave { background-color: var(--clr-n20); color: var(--clr-n60); border: 1px solid var(--clr-n60);  }
.request-cancel-link { display: block; margin-top: 8px; font-size: 12px; color: #1976d2; text-decoration: underline; cursor: pointer; }
.request-cancel-link:hover { color: #1565c0; text-decoration: underline !important; }
.request-loading { color: #999; font-style: italic; text-align: center; padding: 20px; }
.request-empty { color: #999; text-align: center; padding: 20px; font-size: 14px; }
.approval-history { background: #ffffff; border: none; border-radius: 0; padding: 0; margin: 0; min-height: auto; }
.approval-history-header { background: #424242; margin: 0; color: #ffffff; font-size: 14px; font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid #333; }
.approval-history-header:hover { background: #555; }
.approval-history-header .toggle-icon { font-size: 12px; transition: transform 0.3s; }
.approval-history-header.expanded .toggle-icon { transform: rotate(180deg); }
.approval-history-content { display: none; background: #ffffff; padding: 16px; }
.approval-history-content.expanded { display: block; }
.approval-item { margin-bottom: 12px; padding: 12px; border: 1px solid #e0e0e0; border-radius: 4px; background: #ffffff; }
.approval-item:last-child { margin-bottom: 0; }
.approval-type-header { font-size: 13px; font-weight: 600; color: #1976d2; margin-bottom: 6px; }
.approval-user { font-size: 12px; font-weight: 600; color: #000000; margin-bottom: 4px; }
.approval-type { color: #666; font-size: 12px; margin-bottom: 4px; }
.approval-detail { font-size: 12px; color: #666; margin-bottom: 8px; }
.approval-detail.highlight { background: #ffebee !important; padding: 4px 8px; border-radius: 4px; }
.approval-status { display: inline-block; padding: 3px 5px; border-radius: 1px; font-size: 12px; font-weight: 500; margin-top: 8px; }
.approval-status.approved { background: #e8f5e9; color: #2e7d32; }
.approval-status.rejected { background: #ffebee; color: #c62828; }
.approval-loading { color: #999; font-style: italic; text-align: center; padding: 20px; }
.approval-empty { color: #999; text-align: center; padding: 20px; font-size: 14px; }
.team-list-popup-content { padding: 0; }
.team-list-popup-content table { width: 100%; border-collapse: collapse; }
.team-list-popup-content thead th { background: #f5f5f5; padding: 10px; text-align: left; font-weight: 600; border-bottom: 1px solid #ddd; }
.team-list-popup-content tbody td { padding: 10px; border-bottom: 1px solid #eee; }
.team-list-popup-content tbody tr:hover { background: #f9f9f9; }
.team-member-checkbox,
.team-list-select-all-checkbox { width: 16px; height: 16px; cursor: pointer; margin: 0; }
.content-section { display: none; }
.content-section.active { display: block; }
.status-header-wrapper { display: flex; align-items: center; gap: 16px; align-self: stretch; }
.status-tabs-header { display: flex; align-items: center; gap: 10px; }
.status-tab-btn { font-size: 16px; font-weight: 700; border-radius: 0; width: auto; height: 38px; padding: 0 20px; box-sizing: border-box; white-space: nowrap; background-color: #606c8c; color: #fff; transition: all 0.2s; }
.status-tab-btn:hover { cursor: pointer; background-color: #343f5b; opacity: 1; }
.status-tab-btn.active { background-color: #59a7f7; cursor: default; transition: all 0.2s; }
.overtime-restriction-pop-cont { gap: 24px; }
.status-date-navigation { display: flex; align-items: center; gap: 24px; }
.date-nav-btn.pre-date-btn { display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300); background: url(../../../figma/svg/arrow_left_black_16.svg) no-repeat center / 16px; cursor:pointer;}
.date-nav-btn.next-date-btn { width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300); background: url(../../../figma/svg/arrow_right_black_16.svg) no-repeat center / 16px; cursor:pointer; }
.date-nav-btn:hover { background-color: #f5f5f5; border-color: #999; }
.date-nav-btn.disabled { opacity: 0.3; cursor: not-allowed !important; pointer-events: none; }
.date-nav-btn.disabled:hover { background-color: transparent !important; }
.year-nav-btn.pre-year-btn { display: inline-block; width: 36px; height: 36px; margin: 0 !important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_L_gr.png) no-repeat center / 10px; cursor:pointer; }
.year-nav-btn.next-year-btn { display: inline-block; width: 36px; height: 36px; margin: 0 !important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_R_gr.png) no-repeat center / 10px; cursor:pointer;  }
.year-nav-btn:hover { background-color: #f5f5f5; border-color: #999; }
.status-date-text { font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.status-year-text { font-size: 24px; display: inline-block; height: 34px; line-height: 34px; outline: 0; color: #5a6681; font-size: 22px; width: auto; padding: 0; word-break: keep-all; }
.status-year-navigation { margin: 0; gap: 58px; position: relative; width: auto; font-size: 22px; color: #222; font-weight: 600; text-align: center; vertical-align: middle; display: flex; align-items: center; justify-content: space-between; }
.status-tab-content { display: none; flex-flow: column; gap: 20px; align-items: stretch; }
.status-tab-content.active { display: flex; }
.status-summary-cards { display: flex; align-items: stretch; gap: 20px; }
.status-card { flex: 1; min-width: 0; display: flex; flex-flow: column; justify-content: space-between; gap: 12px; padding: 25px; border: 1px solid #E5E5E5; }
.status-card-label { display: flex; justify-content: space-between; align-items: baseline; color: #5A6681; font-size: 16px; font-weight: 700; line-height: 21px; }
.status-card-value { display: flex; gap: 4px; align-items: baseline; color: #4C5266; font-size: 32px; font-weight: 700; line-height: 1; }
.status-progress-bar { position: relative; width: 100%; height: 8px; border-radius: 500px; background-color: #E8F3FF; }
.status-progress-fill { height: 100%; transition: width 0.3s; border-radius: 500px; background-color: #0CB460; }
.status-progress-fill.safe { background-color: #0CB460; }
.status-progress-fill.warning { background-color: #FF9600; }
.status-progress-fill.danger { background-color: #EF4444; }
.status-card-percent { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 18px; }
.status-card-percent small { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 18px; }
.status-card-status { color: #828EAC; font-size: 14px; font-weight: 600; line-height: 18px; }
.status-card .status-card-status[class*="status-"] { display: flex; gap: 4px; align-items: baseline; }
.status-charts-row { display: flex; align-items: stretch; gap: 20px; }
.status-chart-container { gap: 20px; min-height: 420px; flex: 1; min-width: 0; display: flex; flex-flow: column; justify-content: space-between; padding: 25px; border: 1px solid #E5E5E5; }
.status-chart-container h3 { font-size: 20px; width: 100%; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.workhours-chart-header small{ font-size: 16px; font-weight: 500; }
.status-chart-container > div { display: flex; justify-content: space-between; flex-flow: wrap; align-items: baseline; color: #4C5266; font-size: 20px; font-weight: 700; line-height: 25px; gap: 8px; }
.status-table { width: 100%; border-collapse: collapse; }
.status-table thead { background: #f5f5f5; }
.status-table th:first-child { border-left: 0; }
.status-table th { padding: 10px; text-align: center; vertical-align: middle; color: #5A6681; font-size: 14px; font-weight: 600; background-color: #F8F9FA; border-left: 2px solid #fff; }
.status-table td:first-child { border-left: 1px solid #F0F0F0; }
.status-table td:last-child { border-right: 1px solid #F0F0F0; }
.status-table td { border-bottom: 1px solid #F0F0F0; font-weight: 500; padding: 10px; text-align: center; vertical-align: middle; color: #5A6681; font-size: 14px; }
.status-table tbody tr:hover { background: #f9f9f9; }
.correction-request-cell { display: inline-flex; justify-content: flex-start; align-items: center; gap: 8px; }
.correction-request-type { text-align: left; color: #333; font-size: 14px; }
.correction-status-badge { color: var(--clr-n90); background-color: var(--clr-n30); display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); border-radius: 12px; }
.correction-status-badge.pending { color: var(--clr-n90); background-color: var(--clr-n30); }
.correction-status-badge.approved { color: var(--clr-g900); background-color: var(--clr-g000); }
.correction-status-badge.rejected { color: var(--clr-r900); background-color: var(--clr-r000); }
/*.status-table td:has(.correction-request-cell) { text-align: center; width: 200px; }*/
.status-table td.correction-request-cell { text-align: center; width: 200px; }
.pagination-container { margin-top: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.pagination-info { color: #666; font-size: 14px; }
.pagination-controls { display: flex; gap: 5px; align-items: center; }
.pagination-btn { padding: 6px 12px; border: 1px solid #ddd; background: #fff; color: #333; cursor: pointer; border-radius: 4px; font-size: 14px; min-width: 40px; }
.pagination-btn:hover:not(.disabled):not(.active) { background: #f5f5f5; border-color: #999; }
.pagination-btn.active { background: #1976d2; color: #fff; border-color: #1976d2; cursor: default; }
.pagination-btn.disabled { opacity: 0.5; cursor: not-allowed; }
.pagination-ellipsis { padding: 0 5px; color: #999; }
.vacation-card-subtext { color: #828EAC; font-size: 14px; font-weight: 600; line-height: 18px; }
.vacation-card .vacation-card-value small { color: #828EAC; font-size: 16px; font-weight: 500; line-height: 1; }
.vacation-card .vacation-card-subtext[class*="status-"] { display: flex; gap: 4px; align-items: baseline; }
.vacation-card .vacation-card-subtext.status-normal::before { background-image: url(../../images/icon/ico_display_safe.svg); }
.vacation-card .vacation-card-subtext.status-date::before { background-image: url(../../images/icon/ico_display_date.svg); }
.vacation-card .vacation-card-subtext.status-insufficient::before { background-image: url(../../images/icon/ico_display_danger.svg); }
.vacation-card .vacation-card-subtext[class*="status-"]::before { content: ''; flex-shrink: 0; display: block; width: 14px; height: 14px; background-repeat: no-repeat; background-position: center; background-size: contain; transform: translateY(2px); }
.usage-rate-card { grid-column: span 1; }
.vacation-progress-bar { width: 100%; height: 8px; background: #f0f0f0; border-radius: 4px; overflow: hidden; margin-top: 8px; }
.vacation-progress-fill { height: 100%; transition: width 0.3s; }
.vacation-charts-row { display: flex; align-items: stretch; gap: 20px; }
.vacation-chart-container { gap: 20px; min-height: 420px; flex: 1; min-width: 0; display: flex; flex-flow: column; justify-content: space-between; padding: 25px; border: 1px solid #E5E5E5; }
.vacation-chart-container h3 { display: flex; flex-flow: wrap; align-items: baseline; color: #4C5266; font-size: 20px; font-weight: 700; line-height: 25px; gap: 8px; }
.vacation-chart-container small { font-size: 16px; font-weight: 500; }
.vacation-table-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.vacation-table-header h3 { font-size: 16px; font-weight: 600; color: #333; margin: 0; }
.vacation-filter-buttons { display: flex; gap: 8px; align-items: center; }
.vacation-filter-btn { padding: 6px 16px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; font-size: 14px; color: #666; transition: all 0.2s; }
.vacation-filter-btn:hover { background: #e0e0e0; }
.vacation-filter-btn.active, .vacation-filter-btn.active:hover {background: linear-gradient(357deg, #1382F4 16.59%, #5AA7F7 97.29%), #FFF; color: #fff !important; border-color: #1382F4 !important; cursor: default; }
.vacation-table { width: 100%; border-collapse: collapse; }
.vacation-table thead { background: #f5f5f5; }
.vacation-table th { background-color: #F8F9FA; border-left: 2px solid #fff; padding: 10px; text-align: center; vertical-align: middle; color: #5A6681; font-size: 14px; font-weight: 600; }
.vacation-table th:first-child { border-left: 0; }
.vacation-table td { border-bottom: 1px solid #F0F0F0; font-weight: 500; padding: 10px; text-align: center; vertical-align: middle; color: #5A6681; font-size: 14px; }
.vacation-table td:first-child { border-left: 1px solid #F0F0F0; }
.vacation-table td:last-child { border-right: 1px solid #F0F0F0; }
.vacation-table tbody tr:hover { background: #f9f9f9; }
.vacation-status-badge { display: flex; height: 20px; width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 12px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); }
.vacation-status-badge.pending { background-color: var(--clr-n30); color: var(--clr-n400); }
.vacation-status-badge.approved { background-color: var(--clr-g000); color: var(--clr-g900); }
.vacation-status-badge.rejected { background-color: var(--clr-r000); color: var(--clr-r900); }
@media (max-width: 1200px) { .vacation-summary-cards { grid-template-columns: repeat(3, 1fr); } .usage-rate-card { grid-column: span 3; } .vacation-charts-row { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .vacation-summary-cards { grid-template-columns: 1fr; } .usage-rate-card { grid-column: span 1; } }
@media (max-width: 1200px) { .status-summary-cards { grid-template-columns: repeat(2, 1fr); } .status-charts-row { grid-template-columns: 1fr; } .status-header-wrapper { flex-direction: column; align-items: flex-start; gap: 16px; } }
@media (max-width: 768px) { .status-summary-cards { grid-template-columns: 1fr; } .status-header-wrapper { flex-direction: column; align-items: stretch; } .status-date-navigation { align-self: stretch; justify-content: center; } }
#attendanceTypeSelectBox { min-width: 200px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .label { color: #59a7f7; font-size: 14px; font-weight: 500; margin-bottom: 8px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .inputform__row { margin-bottom: 20px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add #attendanceTypeSelect .input-group { display: flex; align-items: flex-start; gap: 20px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add #attendanceTypeSelect .select-box { width: 100%; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add #attendanceTypeSelect .input_group { width: 100%; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add #attendanceTypeSelect .date_input { width: 100%; max-width: 100%; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .inputform__row.time .input-group { display: flex; align-items: flex-start; gap: 20px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .box.end { flex: 1; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .input_group { margin-top: 0; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .time-select-wrap { font-size: 14px; color: #333; padding: 8px 0; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add select { height: 44px; border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 4px; padding: 0 15px; font-size: 16px; color: #5f6b8b; background-color: #fff; background-image: url(../images/connectplace/common/ico_time.png); background-repeat: no-repeat; background-position: right 10px center; background-size: 16px 16px; padding-right: 35px; cursor: pointer; min-width: 80px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add select:focus { border-color: #59a7f7; outline: none; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .input_group { display: flex; align-items: center; gap: 8px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add .input_group select + :not(select) { font-size: 16px; color: #333; margin: 0 4px; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add textarea { border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 4px; font-size: 14px; color: #333; }
[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add textarea:focus { border-color: #59a7f7; outline: none; }
[data-role-popup="attendanceCorrectionRequest"] .attendees { margin-top: 24px; }
/*[data-role-popup="attendanceCorrectionRequest"] .attendees-tit { background-color: #1976d2; color: #fff; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; border-radius: 4px 4px 0 0; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-tit span { font-size: 14px; font-weight: 500; color: #fff; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-tit button { background-color: transparent; border: none; color: #fff; font-size: 14px; cursor: pointer; display: block; padding: 4px 0; width: 96px; line-height: 8px; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-tit button:hover { opacity: 0.9; }*/
/*[data-role-popup="attendanceCorrectionRequest"] .attendees-cont { background-color: #fff; padding: 16px; border: 1px solid rgba(0, 0, 0, 0.08); border-top: none; border-radius: 0 0 4px 4px; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-list { list-style: none; padding: 0; margin: 0; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-list li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
[data-role-popup="attendanceCorrectionRequest"] .attendees-list li:last-child { border-bottom: none; }*/
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add label { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 10; overflow: hidden; text-overflow: ellipsis; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); font-size: var(--txt-size-14); cursor: default; }
[data-role-popup="attendanceScheduleRequest"] .schedule-vacation-title-wrap label { flex: 1 0 0; }
[data-role-popup="attendanceRequestDetail"] .attendance-schedule-add label { width: 100%; font-weight: 600; color: #1382f4; font-size: 15px; margin: 0; line-height: 1;}
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add #scheduleVacationDiv .input_group { margin-top: 0; }
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add select { height: 44px; border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 4px; padding: 0 15px; font-size: 16px; color: #5f6b8b; background-color: #fff; cursor: pointer; }
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add select:focus { border-color: #59a7f7; outline: none; }
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add textarea { border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 4px; font-size: 14px; color: #333; }
[data-role-popup="attendanceScheduleRequest"] .attendance-schedule-add textarea:focus { border-color: #59a7f7; outline: none; }
[data-role-popup="attendanceScheduleRequest"] .attendees { margin-top: 24px; }
/*[data-role-popup="attendanceScheduleRequest"] .attendees-tit { background-color: #1976d2; color: #fff; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; border-radius: 4px 4px 0 0; } 
[data-role-popup="attendanceScheduleRequest"] .attendees-tit span { font-size: 14px; font-weight: 500; color: #fff; }
[data-role-popup="attendanceScheduleRequest"] .attendees-tit button { background-color: transparent; border: none; color: #fff; font-size: 14px; cursor: pointer; display: block; padding: 4px 0; width: 96px; line-height: 8px; }
[data-role-popup="attendanceScheduleRequest"] .attendees-tit button:hover { opacity: 0.9; }*/
[data-role-popup="attendanceScheduleRequest"] .attendees-cont { background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.08); border-top: none; border-radius: 0 0 4px 4px; }
[data-role-popup="attendanceScheduleRequest"] .attendees-list { list-style: none; padding: 0; margin: 0; }
[data-role-popup="attendanceScheduleRequest"] .attendees-list li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
[data-role-popup="attendanceScheduleRequest"] .attendees-list li:last-child { border-bottom: none; }
.layer-pop-area { top: 50% !important; left: 50% !important; transition: margin-top 0.3s ease-out, margin-left 0.3s ease-out, top 0.3s ease-out, left 0.3s ease-out; }
@keyframes fadeInCenter { 0% { opacity: 0; transform: scale(0.9) translateY(-10px); } 100% { opacity: 1; transform: scale(1) translateY(0); } }
.layer-pop-area:not(.active) { opacity: 0; transform: scale(0.9) translateY(-10px); }
.layer-pop-area.active { animation: fadeInCenter 0.3s ease-out; }

aside + .container.schedule { max-height: calc(100vh - 64px); padding: 50px; }
aside + .container.schedule .container__inner { position: relative; max-width: 1600px; margin: 0 auto; }
aside + .container.schedule .container__inner .content-section { padding: 0; position: relative; width: 100%; margin: 0 auto; box-sizing: border-box; }
aside + .container.schedule .container__inner .content-section .schedule-calendar { padding: 0; }
.calendar-nav-wrap { display: flex; align-items: center; gap: 12px; flex: 1 0 0; }
.date-monthly { display: flex; align-items: center; gap: 24px; }
.date-monthly #prevDate.disabled, .date-monthly .prevDate.disabled { opacity: 0.65; }
.date-monthly .calendar-month-text { color: var(--txt-color-t900); font-size: var(--txt-size-16) !important; font-weight: var(--txt-weight-semibold); }
.date-monthly #prevDate, .date-monthly .prevDate { display: flex; width: 36px; height: 36px; margin: 0 !important; color: transparent !important; background: url(../../../figma/svg/arrow_left_black_16.svg) no-repeat center / 16px; border: 0; border-radius: 6px; border: 1px solid var(--clr-w300); }
.date-monthly #nextDate, .date-monthly .nextDate { display: flex; width: 36px; height: 36px; margin: 0 !important; color: transparent !important; background: url(../../../figma/svg/arrow_right_black_16.svg) no-repeat center / 16px; border: 0; border-radius: 6px; border: 1px solid var(--clr-w300); }
.schedule-calendar .calendar-header-controls > ul { justify-content: flex-end; gap: 10px; display: flex; align-items: center; margin-left: 10px; }
.schedule-calendar .calendar-header-controls > ul > li { padding: 0; }
.schedule-calendar .legend li { float: left; position: relative; font-size: 14px; font-weight: 500; white-space: nowrap; padding-left: 20px; margin: 0; }
.legend [class^="calendar-badge"] { height: 20px; width: 40px; }
[class^="calendar-badge"] { color: #5A6681; background-color: #F0F4F8; display: flex; align-items: center; justify-content: center; height: 16px; width: 36px; border-radius: 1px; font-size: 10px; font-weight: 500; line-height: 1; letter-spacing: -0.5px; }
.calendar-badge-office { color: #5A6681; background-color: #F0F4F8; }
.calendar-badge-remote { color: #0CB460; background-color: #E8F5E9; }
.calendar-badge-field { color: #FF9600; background-color: #FFEFD9; }
.calendar-badge-leave { color: #6491D2; background-color: #E0E9F6; }
.calendar-badge-late { color: #D24D4D; background-color: #FFEBEE; }
.calendar-badge-early { color: #828EAC; background-color: #F5F5F5; }
#calendar-section { display: flex; flex-direction: column; align-self: stretch; flex: 1 1 0; min-height: 0; width: 100%; overflow: hidden; }
#calendar-section .calendar-header-controls { display: flex; height: 60px; padding: 0 40px; align-items: center; gap: 24px; align-self: stretch; border-bottom: 1px solid var(--clr-w300); flex-shrink: 0; }
#calendar-section .schedule-calendar-monthview-calendar { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; align-self: stretch; width: 100%; overflow: hidden; }
#calendar-section .schedule-calendar-monthview-calendar > div:nth-child(1) { flex-shrink: 0; }
#calendar-section .schedule-calendar-monthview-calendar .schedule-calendar-monthview-body { flex: 1 1 0; min-height: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
#calendar-section .schedule-calendar-monthview-calendar .schedule-calendar-monthview-body::-webkit-scrollbar { display: none; }
#calendar-section .schedule-calendar-monthview-calendar .schedule-calendar-week-row { min-height: 165px; height: 165px; flex-shrink: 0; }

/* 근무일정 월 캘린더 범례: 가로 스와치 + 라벨 (Figma 범례형) */
#calendar-section .calendar-header-controls .legend.attendance-calendar-legend { display: flex; align-items: center; gap: 8px; }
#calendar-section .calendar-header-controls .legend.attendance-calendar-legend > li.attendance-legend-item { display: flex; align-items: center; gap: 4px; }
#calendar-section .attendance-legend-swatch { width: 12px; height: 12px; aspect-ratio: 1/1; border-radius: 2px; border: 1px solid transparent; background: transparent; }
#calendar-section .attendance-legend-swatch--office { border-color: var(--clr-w700); background: var(--clr-w100); }
#calendar-section .attendance-legend-swatch--remote { border-color: var(--clr-p500); background: var(--clr-p100); }
#calendar-section .attendance-legend-swatch--field { border-color: var(--clr-y900); background: var(--clr-y000); }
#calendar-section .attendance-legend-swatch--leave { border-color: var(--clr-v500); background: var(--clr-v000); }
#calendar-section .attendance-legend-swatch--absent { border-color: var(--clr-r900); background: var(--clr-r000); }
#calendar-section .attendance-legend-swatch--early { border-color: var(--clr-n60); background: var(--clr-n20); }
#calendar-section .attendance-legend-swatch--overtime { border-color: var(--clr-e900); background: var(--clr-e000); }
#calendar-section .attendance-legend-swatch--late { background: url("../../../figma/svg/error_red_16.svg") no-repeat center/ 16px 16px; border-radius: 30px; }
#calendar-section .attendance-legend-text { font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: var(--txt-line-height); color: var(--txt-color-t500); }

.schedule-calendar-monthview-calendar > div:nth-child(1) { display: flex; align-items: center; align-self: stretch; }
.schedule-calendar-monthview-calendar .schedule-calendar-monthview-body { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.schedule-calendar-monthview-calendar .schedule-calendar-week-row { display: flex; height: 165px; align-items: center; align-self: stretch; border-bottom: 1px solid var(--clr-w300); }
.schedule-calendar-monthview-calendar .schedule-calendar-weekview-calendar-date.suncolor { color: var(--clr-r900); }
.schedule-calendar-monthview-calendar .schedule-calendar-weekview-calendar-date.satcolor { color: var(--txt-color-p600); }
.schedule-calendar [class*="monthview-calendar"] > div:nth-child(2) .WeekView-Schedule-Component { padding: 10px 6px 6px; border-color: #F0F0F0; background-color: #fff; border-top: 0; border: 1px solid #f0f0f0; }
.schedule-calendar-monthview-calendar .schedule-calendar-week-row > .WeekView-Schedule-Component { flex: 1 1 0; min-width: 0; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box { display: flex; max-height: 110px; flex-direction: column; align-items: stretch; gap: 6px; flex: 1 1 0; min-width: 0; width: 100%; align-self: stretch; }
/* 월뷰 일정 행: 좌 근무유형명 · 우 시간, 테두리(구 색상 바 대체) */
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row { display: flex; padding: 4px 6px; align-items: center; gap: 4px; align-self: stretch; min-width: 0; width: 100%; max-width: 100%; box-sizing: border-box; border-radius: 4px; border: 1px solid transparent; background: transparent; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-wrap { display: flex; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; width: 100%; max-width: 100%; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-name { flex: 0 0 auto; white-space: nowrap; font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-time { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 6px; flex: 1 1 0; min-width: 0; overflow: hidden; max-width: 100%; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); text-align: right; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-time-text { display: block; flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-time-late { color: var(--clr-r900); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--late .attendance-monthview-schedule-time::after { content: ''; flex-shrink: 0; width: 16px; height: 16px; background: url(../../../figma/svg/error_red_16.svg) no-repeat center / 100%; }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--office { color: var(--clr-w700); border-color: var(--clr-w700); background: var(--clr-w100); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--remote { color: var(--clr-p500); border-color: var(--clr-p500); background: var(--clr-p100); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--outwork { color: var(--clr-y900); border-color: var(--clr-y900); background: var(--clr-y000); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--vacation { color: var(--clr-v500); border-color: var(--clr-v500); background: var(--clr-v000); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--absent { color: var(--clr-r900); border-color: var(--clr-r900); background: var(--clr-r000); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--early { color: var(--clr-n60); border-color: var(--clr-n60); background: var(--clr-n20); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--overtime { color: var(--clr-e900); border-color: var(--clr-e900); background: var(--clr-e000); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--late { color: var(--txt-color-t700); border-color: var(--clr-w700); background: var(--clr-w100); }
.schedule-calendar-monthview-calendar .list_hide_schedule_box .attendance-monthview-schedule-row.attendance-monthview-schedule-row--partial { border-color: #ff9600; }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component > div:first-child.attendance-monthview-day--holiday > span:not(.today_highlight) { color: var(--clr-r900); }
.schedule-calendar-monthview-calendar .WeekView-Schedule-Component.passaway > div:first-child.attendance-monthview-day--holiday > span:not(.today_highlight) { color: var(--clr-r900) !important; }
.schedule-calendar-monthview-calendar .attendance-monthview-day--holiday .attendance-monthview-schedule-name--holiday { color: var(--clr-r900); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }

.btn_workpolicy { display: block; width: 32px; height: 27px; border: 1px solid rgba(255, 255, 255, 0.50); background: url(../../images/icon/ico_book_open.svg) no-repeat center; background-color: rgba(255, 255, 255, 0.10); }

#approvalHistoryContent { margin: 0; gap: 0; }
#approvalHistoryContent > li { padding: 0; gap: 0; }

.popobj-txt-default { color: #5A6681; text-align: center; font-size: 16px; font-weight: 400; }
.popobj-listbox { display: flex; flex-flow: column; gap: 15px; padding: 20px 40px; background-color: #F5F5F5; }
.popobj-listbox li { position: relative; padding-left: 10px; display: flex; }
.popobj-listbox li::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background-color: #4c5266; border-radius: 50%; }
.popobj-listbox li span { color: #5A6681; font-size: 16px; font-weight: 600; line-height: 1; width: 130px; }
.popobj-listbox li small { color: #5F6B8B; font-size: 16px; font-weight: 400; line-height: 1; }
#scheduleAttendanceTypeSelectBox { padding-left:10px; flex: 1; display: flex; gap: 10px; align-items: stretch; float: left; box-sizing: border-box; display: flex; flex-flow: row wrap; justify-content: space-between; width: 100%; }
.attendance-schedule-add .inputform__row .box { flex:1; display: flex; gap: 10px; justify-content: space-between; flex-flow: row wrap; }
.attendance-schedule-add .inputform > .inputform__row__pop { overflow: initial; align-items: center; justify-content: space-between; gap: 10px; margin: 0; width: 100%; }
.inputform__row__pop.time .input-group { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
.inputform__row__pop .input-group .box .calendar-wrap input[type="text"] { color: #5a6681; height: 44px; width: 100%; box-sizing: border-box; padding-left: 10px; font-size: 15px; color: #222; border: 1px solid rgba(0, 0, 0, 0.1); }
.inputform__row__pop .inputform__row__colm .ui-datepicker-trigger { position: absolute; width: 30px; height: 30px; top: 50%; right: 5px; background: url(../../images/connectplace/common/ico_calendar.png) no-repeat 50%; background-size: 18px; text-indent: -9999px; transform: translateY(-50%); }
.inputform__row__pop .inputform__row__colm > span { display: inline-block; position: relative; flex: 1; }
.inputform__row__pop .input-group input { border: 1px solid rgba(0, 0, 0, 0.08); height: 44px; font-size: 16px; color: #5f6b8b; padding: 0 15px; cursor: pointer; box-sizing: border-box; }
.attendance-schedule-add .inputform__row__pop .box { flex: 1; display: flex; gap: 10px; justify-content: space-between; flex-flow: row wrap; }
#scheduleSearchInfo_CodeId { padding-left:10px; flex: 1; display: flex; gap: 10px; align-items: stretch; float: left; box-sizing: border-box; display: flex; flex-flow: row wrap; justify-content: space-between; width: 100%; }
.attendance-schedule-add .input-group { flex: 1; display: flex; align-items: stretch; gap: 3px; }

[data-role-popup="attendanceCorrectionRequest"] .attendance-schedule-add label { width: 100%; font-weight: 600; color: #1382f4; font-size: 15px; margin: 0; line-height: 1; }
.attendance-schedule-add .input-group input { border: 1px solid rgba(0, 0, 0, 0.08); height: 44px; font-size: 16px; color: #5f6b8b; padding: 0 15px; cursor: pointer; box-sizing: border-box; }

/* 일정 신청 — 휴가 섹션(카드 나열 + 하단 추가) */
.request-vacation-wrap { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.request-vacation-wrap > .schedule-vacation-actions { margin-top: 0; }

/* 일정 신청 — 휴가 블록 카드 */
.request-vacation-wrap .schedule-vacation-title-wrap { display: flex; align-items: center; gap: 16px; align-self: stretch; }
.request-vacation-wrap .schedule-vacation-title-wrap #scheduleVacationInfoBox .schedule-vacation-info-wrap { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 6px; background: var(--clr-n30); }
.request-vacation-wrap .schedule-vacation-title-wrap #scheduleVacationInfoBox .schedule-vacation-info-wrap > div { display: flex; align-items: center; gap: 4px; }
.request-vacation-wrap .schedule-vacation-title-wrap #scheduleVacationInfoBox .schedule-vacation-info-wrap > div > span { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.request-vacation-wrap .schedule-vacation-title-wrap #scheduleVacationInfoBox .schedule-vacation-info-wrap > div .vacation-info-val { color: var(--txt-color-p600); }
.schedule-vacation-card { display: flex; padding: 16px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); }
.schedule-vacation-card__row { display: flex; width: 100%; height: 36px; align-items: center; gap: 12px; }
.schedule-vacation-card__row--type { align-items: center; }
.schedule-vacation-card__label { display: -webkit-box; width: 80px; -webkit-box-orient: vertical; -webkit-line-clamp: 10; flex-shrink: 0; overflow: hidden; color: var(--txt-color-t900); text-overflow: ellipsis; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.schedule-vacation-card__row--type .schedule-vacation-card__label { padding-top: 0; align-self: center; }
.schedule-vacation-card__field {display: flex; align-items: center; gap: 16px; flex: 1 0 0; }
.schedule-vacation-card__field--type { display: flex; align-items: center; min-width: 0; }
.schedule-vacation-typebox { flex: 1; min-width: 88px; width: 194px; }
.schedule-vacation-card__delete { width: 36px; height: 36px; display: none; align-items: center; justify-content: center; aspect-ratio: 1/1; margin: 0; padding: 0; border: 1px solid var(--clr-w300); border-radius: 6px; background: url("../../../figma/svg/delete_16.svg") no-repeat center / 16px; color: #6b7280; cursor: pointer; box-sizing: border-box; }
.schedule-vacation-card__delete:hover { opacity: 0.8; }
.schedule-vacation-card__delete svg { display: block; }
.schedule-vacation-days-row { display: flex; flex: 1 0 0; align-items: center; gap: 16px; }
.schedule-vacation-days-row__main { display: none; flex-direction: row; align-items: center; gap: 6px; }
.schedule-vacation-days-row__main--grow { flex: 1; min-width: 120px; }
.schedule-vacation-days-select { width: 80px; }
.schedule-vacation-days-input { width: 80px; }
.schedule-vacation-days-suffix { font-size: 14px; color: #5f6b8b; }
.schedule-vacation-weekend-chk { display: flex !important; justify-content: flex-end; align-items: center; gap: 8px; flex: 1 0 0; }
.schedule-vacation-weekend-chk input { width: 16px; height: 16px; margin: 0; cursor: pointer; }
.schedule-vacation-weekend-chk > span { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.schedule-vacation-card__info { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; margin-left: 4px; font-size: 11px; font-weight: 700; font-style: normal; line-height: 1; color: #9aa3b5; border: 1px solid #d8dee8; border-radius: 50%; cursor: default; vertical-align: middle; }
.schedule-vacation-date-row { display: flex; gap: 8px; align-items: center; width: 100%; }
.schedule-vacation-date-row > span { display: block; position: relative; flex: 1; min-width: 0; }
.schedule-vacation-date-input { width: 100% !important; box-sizing: border-box; }
.schedule-vacation-time-inline { flex: 0 0 auto; min-width: 120px; }
.schedule-vacation-card__notice { font-size: var(--txt-size-14); color: var(--txt-color-t70); padding-left: 92px; }
.schedule-vacation-actions { display: flex; justify-content: flex-end; margin-top: 4px; margin-bottom: 4px; }
.schedule-vacation-actions__add { padding: 10px 20px; background: #273549; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 14px; font-weight: 600; }
.schedule-vacation-actions__add:hover { background: #1f2a3d; }

.popobj-confirm-msg { display: flex; justify-content: center; color: #000; font-size: 18px; font-weight: 500; line-height: 1; }
.popobj-confirm-list { display: flex; flex-flow: column; gap: 15px; padding: 20px 40px; background-color: #F0F6FF; }
.popobj-confirm-list li { position: relative; display: flex; align-items: center; }
.popobj-confirm-list li span { color: #1382F4; font-size: 14px; font-weight: 700; line-height: 1; min-width: 90px; max-width: 90px; }
.popobj-confirm-list li small { color: #222; font-size: 16px; font-weight: 500; display: flex; align-items: center; gap: 4px; }
.popobj-confirm-list li sub { color: #4C5266; font-size: 14px; font-weight: 400; }

#team-schedule-detail-pop { display: flex; height: 20px; min-width: 60px; align-items: center; gap: 4px; color: var(--txt-color-t70); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); cursor: pointer; }

.wst_pg-title { display: flex; justify-content: space-between; align-items: center; }
.wst_pg-title .title-set { display: flex; align-items: center; gap: 10px; }
.wst_pg-title .title-set-txt { color: #4B5165; font-size: 23px; font-weight: 700; }
.status-card .status-card-value small { color: #828EAC; font-size: 16px; font-weight: 500; line-height: 1; }
.status-card .status-card-value > span:nth-child(1) { line-height: 1; }

/* 근무시간 상태 색상 클래스 */
.status-normal { color: #0CB460 !important; }
.status-warning { color: #FF9600 !important; }
.status-insufficient { color: #EF4444 !important; }
.status-card .status-card-status.status-insufficient::before { background-image: url(../../images/icon/ico_display_danger.svg); }
.status-card .status-card-status.status-warning::before { background-image: url(../../images/icon/ico_display_warning.svg); }
.status-card .status-card-status.status-normal::before { background-image: url(../../images/icon/ico_display_safe.svg); }
.status-card .status-card-status[class*="status-"]::before { content: ''; flex-shrink: 0; display: block; width: 14px; height: 14px; background-repeat: no-repeat; background-position: center; background-size: contain; transform: translateY(2px); }
.wst_pg-title .title-date { display: flex; align-items: center; gap: 20px; height: 30px; padding: 0 20px; background-color: #F8F9FA; }
.wst_pg-title .title-date dt { color: #5A6681; font-size: 16px; font-weight: 700; }
.wst_pg-title .title-date dd { color: #4C5266; font-size: 16px; font-weight: 500; }

/* 부서 관리 스타일 */
.department-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 5px; border-bottom: 2px solid #E8F3FF; }
.department-header .title-set { display: flex; align-items: stretch; gap: 20px; }
.department-header .title-set-txt { color: #4B5165; font-size: 23px; font-weight: 700; }
.department-sub-nav { display: flex; align-items: center; gap: 4px; flex: 1 0 0; }
.department-sub-nav-btn { display: flex; height: 36px; min-width: 100px; max-width: 160px; min-height: 36px; max-height: 36px; padding: 13px 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 100px; background: var(--clr-w200); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70); }
.department-sub-nav-btn.active { background: var(--clr-p600); color: var(--txt-color-t100); }
.line-tab-contents, .line-tab-content { display: contents; }
.department-sub-content { display: none; align-items: stretch; justify-content: space-between; gap: 15px; }
.department-sub-content.active { display: flex; }
.department-left-section { flex: 1; display: flex; flex-flow: column; gap: 20px; align-items: stretch; }
.department-right-section { width: 50%; float: right; padding-left: 15px; box-sizing: border-box; }
.department-summary-cards { display: flex; align-items: stretch; justify-content: space-between; gap: 15px; height: 105px;}
.department-summary-card { justify-content: center; gap: 20px; padding: 15px; flex: 1; min-width: 0; display: flex; flex-flow: column; border: 1px solid #E5E5E5; }
.department-summary-card .department-summary-label { justify-content: center; display: flex; white-space: nowrap; align-items: baseline; color: #5A6681; font-size: 16px; font-weight: 700; line-height: 21px; margin: 0; }
.department-summary-card .department-summary-value { justify-content: center; display: flex; gap: 4px; align-items: baseline; color: #4C5266; font-size: 32px; font-weight: 700; line-height: 1; }
.department-summary-card .department-summary-value > span { line-height: 1; }
.department-summary-card .department-summary-unit { color: #828EAC; font-size: 16px; font-weight: 500; line-height: 1; }
.department-summary-card:nth-child(3) .department-summary-value { color: #4CAF50; }
.department-summary-card:nth-child(4) .department-summary-value { color: #FF9800; }
.department-summary-card:nth-child(5) .department-summary-value { color: #42A5F5; }
.department-charts-row { display: flex; gap: 20px; margin-bottom: 30px; }
.department-chart-container { min-height: 355px; gap: 20px; flex: 1; min-width: 0; display: flex; flex-flow: column; justify-content: space-between; padding: 25px; border: 1px solid #E5E5E5; }
.department-chart-container h3 { margin: 0 0 20px 0; font-size: 16px; font-weight: 600; color: #333; }
.department-chart-header { display: flex; justify-content: space-between; flex-flow: wrap; align-items: baseline; color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); gap: 8px; }
.department-chart-header h3 { margin: 0; flex: 0 0 auto; }
.department-week-navigation { position: relative; width: auto; font-size: 22px; color: #222; font-weight: 600; text-align: center; vertical-align: middle; display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 0; margin-left: auto; }
.department-chart-legend { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-left: auto; }
.department-chart-container .department-chart-header .department-chart-legend li { display: flex; align-items: center; gap: 4px; color: #5A6681; font-size: 14px; font-weight: 400; line-height: 1; }
.department-chart-container .department-chart-header .department-chart-legend li::before { content: ''; display: block; width: 14px; height: 14px; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(1)::before { background-color: #5A6681; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(2)::before { background-color: #0CB460; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(3)::before { background-color: #FF9600; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(4)::before { background-color: #6491D2; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(5)::before { background-color: #083463; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(6)::before { background-color: #D24D4D; }
.department-chart-container .department-chart-header .department-chart-legend li:nth-child(7)::before { background-color: #828EAC; }
.legend-item { display: flex; align-items: center; gap: 6px; }
.legend-color { width: 12px; height: 12px; border-radius: 2px; display: inline-block; }
.legend-text { font-size: 12px; color: #5A6681; }
.legend-line { display: inline-block; height: 0; margin-top: 2px; }
.week-nav-btn.prevDate { width: 20px; height: 20px; opacity: 0.65; display: inline-block; margin: 0 !important; -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_L_gr.png) no-repeat center / 6px; }
.week-nav-btn.nextDate { width: 20px; height: 20px; opacity: 0.65; display: inline-block; margin: 0 !important; -webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.30); color: transparent !important; background: url(../../images/connectplace/common/ico_arrow_R_gr.png) no-repeat center / 6px; }
.week-nav-btn:hover { background-color: #f5f5f5; cursor:pointer; }
.department-week-text { font-size: 14px; color: #5A6681; font-weight: 600; min-width: 80px; text-align: center; }
.department-excel-btn { display: flex; height: 30px; padding: 0 15px; align-items: center; justify-content: center; gap: 5px; border: 1px solid #F2F2F2; color: #4C5266; font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: -0.5px; transition: all .3s ease; }
.department-header .department-excel-btn::before { content: ''; display: block; width: 12px; height: 12px; background: url(../../images/icon/ico_download.svg) no-repeat center; }
.department-excel-btn:hover { background-color: #f5f5f5;  opacity: 0.8; }
.department-performance-summary { display: flex; align-items: stretch; gap: 10px; }
.department-performance-summary li dl { display: flex; flex-flow: column; gap: 6px; }
.performance-icon { display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.performance-icon svg { width: 24px; height: 24px; }
.department-performance-summary li dt::before { content: ''; display: block; width: 14px; height: 14px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.department-performance-summary .excellent dt::before { background-image: url(../../images/icon/ico_checked-circle-safe.svg); }
.department-performance-summary .normal dt::before { background-image: url(../../images/icon/ico_checked-circle-warning.svg); }
.department-performance-summary .caution dt::before { background-image: url(../../images/icon/ico_checked-circle-danger.svg); }
.performance-desc { color: #828EAC; font-size: 12px; font-weight: 500; line-height: 1; }
.performance-count-wrapper { display: flex; align-items: baseline; gap: 4px; justify-content: center; margin-top: 0; }
.performance-count.excellent { color: var(--clr-g900); }
.performance-count.normal { color: var(--clr-y900); }
.performance-count.caution { color: var(--clr-r900); }
.performance-unit { font-size: 14px; color: #828EAC; font-weight: 400; }
.department-schedule-section { margin-top: 30px; clear: both; width: 100%; }
.department-placeholder { padding: 40px; text-align: center; color: #999; font-size: 16px; }
.department-schedule-header { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; margin-bottom: 0; }
.department-schedule-controls { display: flex; align-items: stretch; gap: 20px; }
.department-search-wrapper { position: relative; display: inline-block; width: 200px; }
.department-search-input { padding: 8px 40px 8px 12px; border: 1px solid #E5E5E5; border-radius: 4px; font-size: 14px; width: 100%; box-sizing: border-box; }
.department-search-btn:hover { opacity: 0.7; }
.department-search-btn svg { display: block; }
.vacation-filter-buttons .search-set .inputform__row .department_option .department-search-btn {position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; background: url(../../images/icon/ico_search.svg) no-repeat center; text-indent: -9999px; overflow: hidden;}
.department-filter-select { font-size: 14px !important; height: 30px !important; padding-left: 10px; padding-right: 30px; }
.department-view-toggle { display: flex; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-n30); }
.department-view-btn { display: flex; height: 36px; min-width: 36px; max-width: 160px; padding: 0 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 6px; color: var(--txt-color-t70); font-size: var(--txt-size-14);   font-weight: var(--txt-weight-medium); }
.department-view-btn.active { background: var(--clr-w100); color: var(--txt-color-p600); border: 1px solid var(--clr-p600); cursor: default; }
.workhours-table .workhour-stats-daily-schedule { min-width: 183px !important; box-sizing: border-box; padding: 0 12px 0 24px; align-items: center; gap: 12px; text-align: left !important; }
.workhours-table .workhour-stats-daily-schedule.daily-schedule-wrap { min-height: 60px; padding: 12px 12px 12px 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px; align-self: stretch; }
/* 근무일정: 단일 테이블 — 가로 스크롤은 .department-schedule-table-unified-scroll 안에서만, 이름 열은 sticky로 고정 */
.department-schedule-table-wrap .department-schedule-table-split {
	--department-schedule-name-w: clamp(118px, calc(118px + (100vw - 1280px) * 74 / 640), 192px);
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.department-schedule-table-wrap .department-schedule-table-unified-scroll {
	width: 100%;
	min-width: 0;
	overflow-x: auto;
	overflow-y: visible;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: none;
}
.department-schedule-table-wrap .department-schedule-table--unified.workhours-table { display: table; width: 100%; max-width: 100%; min-width: 720px; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
.department-schedule-table-wrap .department-schedule-th-name,
.department-schedule-table-wrap .department-schedule-td-name {
	position: sticky;
	left: 0;
	width: var(--department-schedule-name-w);
	min-width: var(--department-schedule-name-w);
	max-width: var(--department-schedule-name-w);
	box-sizing: border-box;
	border-right: 1px solid var(--clr-w300);
	background-clip: padding-box;
}
.department-schedule-table-wrap .department-schedule-table--unified thead .department-schedule-th-name { z-index: 3; background: var(--clr-w200); padding: 0 12px 0 24px; align-items: center; gap: 4px; align-self: stretch; }
.department-schedule-table-wrap .department-schedule-table--unified tbody .department-schedule-td-name { display: flex; z-index: 2; background: var(--clr-w100); padding: 0 12px 0 24px; align-items: center; gap: 4px; align-self: stretch;}
/* 부서 근무일정 표 셀: 월뷰 캘린더(.list_hide_schedule_box)와 동일 일정 행 레이아웃·톤 */
.department-schedule-table-wrap .department-schedule-table--unified td.workhour-stats-daily-schedule .schedule-cell-wrapper { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 6px; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row { display: flex; padding: 4px 6px; align-items: center; gap: 4px; align-self: stretch; min-width: 0; width: 100%; max-width: 100%; box-sizing: border-box; border-radius: 4px; border: 1px solid transparent; background: transparent; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-wrap { display: flex; align-items: center; gap: 8px; flex: 1 1 0; min-width: 0; width: 100%; max-width: 100%; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-name { flex: 0 0 auto; white-space: nowrap; font-size: var(--txt-size-12); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-time { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 6px; flex: 1 1 0; min-width: 0; overflow: hidden; max-width: 100%; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); text-align: right; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-time-text { display: block; flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-time-late { color: var(--clr-r900); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--late .attendance-monthview-schedule-time::after { content: ''; flex-shrink: 0; width: 16px; height: 16px; background: url(../../../figma/svg/error_red_16.svg) no-repeat center / 100%; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--office { color: var(--clr-w700); border-color: var(--clr-w700); background: var(--clr-w100); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--remote { color: var(--clr-p500); border-color: var(--clr-p500); background: var(--clr-p100); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--outwork { color: var(--clr-y900); border-color: var(--clr-y900); background: var(--clr-y000); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--vacation { color: var(--clr-v500); border-color: var(--clr-v500); background: var(--clr-v000); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--absent { color: var(--clr-r900); border-color: var(--clr-r900); background: var(--clr-r000); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--early { color: var(--clr-n60); border-color: var(--clr-n60); background: var(--clr-n20); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--overtime { color: var(--clr-e900); border-color: var(--clr-e900); background: var(--clr-e000); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--late { color: var(--txt-color-t700); border-color: var(--clr-w700); background: var(--clr-w100); }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row.attendance-monthview-schedule-row--partial { border-color: #ff9600; }
.department-schedule-table-wrap .department-schedule-table--unified .schedule-cell-wrapper .attendance-monthview-schedule-row--holiday { color: var(--clr-r900); border-color: #FFCDD2; background: #FFEBEE; }
.schedule-office { background: #F5F5F5; color: #333; }
.schedule-wfh { background: #E8F5E9; color: #2E7D32; }
.schedule-field { background: #FFF3E0; color: #E65100; }
.schedule-leave { background: #E3F2FD; color: #1565C0; }
.schedule-late { position: relative; }
.schedule-late::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: #EF5350; }
.schedule-early { position: relative; }
.schedule-early::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: #FF7043; }
.department-detail-btn { display: inline-flex; padding: 0 8px; justify-content: center; align-items: center; gap: 10px; height: 24px; border: 1px solid #E5E5E5; color: #5A6681; font-size: 12px; font-weight: 500; }
.department-detail-btn:hover { outline: 0; opacity: 0.8; }

.department-chart-container .department-chart-header > span { display: flex; align-items: center; gap: 4px; width: 100%; white-space: nowrap; }
.department-chart-container-right .department-chart-header > span { display: flex; align-items: center; gap: 4px; width: 100%; white-space: nowrap; }
.department-schedule-controls .inputform__row__colm.department_option { position: relative; }
.department-schedule-controls .inputform__row__colm.department_option input { width: 170px; padding-right: 30px; font-size: 14px; height: 30px; color: #5a6681; box-sizing: border-box; padding-left: 10px; border: 1px solid rgba(0, 0, 0, 0.1); }
.department-schedule-controls .inputform__row__colm.department_option button { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; background: url(../../images/icon/ico_search.svg) no-repeat center; text-indent: -9999px; overflow: hidden; }
.department-schedule-table .schedule-block-type { width: 50px !important;}
.department-view-content .schedule-calendar-monthview-calendar .WeekView-Schedule-Component { padding: 10px 6px 6px; background-color: #fff; border: 1px solid #F0F0F0;}
.department-view-content .schedule-calendar-monthview-calendar { margin-top: 0; }

/* 팀원 스케줄 팝업 스타일 */
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop,
.layer-pop-wrap .layer-pop-area.search-member-pop,
.layer-pop-wrap .layer-pop-area.visitor-list-pop { width: 640px; }
.team-schedule-popup-cont { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; flex: 1 0 0; align-self: stretch; }
.team-schedule-popup-cont #teamScheduleMorePopupCard { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.team-schedule-popup-cont #teamScheduleMorePopupCard > div { display: flex; height: 36px; padding: 0 16px; justify-content: center; align-items: center; gap: 8px; flex: 1 0 0; border-radius: 6px; background: var(--clr-n30); }
.team-schedule-date { color: #000; font-size: 20px; font-weight: 600; display: flex; justify-content: center; line-height: 1; }
.team-schedule-summary-card .summary-label { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.team-schedule-summary-card .summary-count { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-p600); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap,
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap,
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap { display: flex; padding: 16px 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; align-self: stretch; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap .pop-cont-title,
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap .pop-cont-title,
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap .pop-cont-title { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap #teamSchedulePopupDay,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont .pop-cont-title-wrap #roomMeetingPopupDay { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count,
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count,
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count { display: flex; align-items: center; gap: 4px; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count > span,
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count > span,
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #teamCount,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #roomMeetingCount,
.layer-pop-wrap .layer-pop-area.search-member-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #searchMemberCount,
.layer-pop-wrap .layer-pop-area.visitor-list-pop .pop-cont .pop-cont-title-wrap .team-schedule-pop-count #visitorResultTotalCount { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }

.team-schedule-popup-cont .pop-cont-wrap { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent { display: flex; height: 400px; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-head,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-head { flex-shrink: 0; width: 100%; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle { width: 100%; border-collapse: collapse; table-layout: fixed; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle thead th,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle thead th { text-align: left; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); background: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle tbody td,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle tbody td { height: 48px; vertical-align: middle; font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle .table-col-no { width: 48px; height: 44px; padding: 0 12px 0 24px; text-align: center; align-items: center; align-self: stretch; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle .table-col-name { width: 116px; height: 44px; padding: 0 12px; align-items: center; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle .table-col-type { width: 76px; height: 44px; padding: 0 12px; align-items: center; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle .table-col-time { height: 44px; padding: 0 24px 0 12px; align-items: center; gap: 12px; flex: 1 0 0; }

.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-body,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .team-schedule-popup-table-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow: hidden; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .team-schedule-popup-table-scroll { flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle tbody td .team-member-avatar,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle tbody td .team-member-avatar { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clr-n80); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); flex-shrink: 0; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle tbody td .team-member-nametext,
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle tbody td .team-member-nametext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.layer-pop-wrap .layer-pop-area.team-schedule-more-pop .pop-cont #teamScheduleMorePopupContent .tableStyle #teamScheduleBody .team-member-namecell { display: flex; width: 116px; height: 48px; align-items: center; gap: 8px; align-self: stretch; }

/* 회의실 예약 목록 팝업 테이블 컬럼 */
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .table-col-no { width: 48px; height: 44px; padding: 0 12px 0 24px; text-align: center; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .table-col-title { height: 44px; padding: 0 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .table-col-time { width: 132px; height: 44px; padding: 0 12px; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .table-col-organizer { width: 140px; height: 44px; padding: 0 24px 0 12px; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle #roomMeetingBody .team-member-namecell { display: flex; align-items: center; gap: 8px; min-width: 0; height: 48px; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle #roomMeetingBody .team-member-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .room-meeting-popup-row--my td { background: var(--clr-p100); }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle .room-meeting-popup-title--recurring { background-image: url(../../images/connectplace/common/icon_recurring.png); background-repeat: no-repeat; background-position: left center; background-size: 16px; padding-left: 20px; }
.layer-pop-wrap .layer-pop-area.room-meeting-more-pop .pop-cont #roomMeetingMorePopupContent .tableStyle td.no-schedule { text-align: center; color: var(--txt-color-t500); padding: 30px 24px; }


.team-schedule-table { width: 100%; }
.team-schedule-table thead { background-color: #F8F9FA; }
.team-schedule-table th { height: 35px; padding: 0 10px; background: #EDF5FF; border: none; vertical-align: middle; color: #5A6B8B; font-size: 16px; font-weight: 600; }
.team-schedule-table td { height: 50px; padding: 0 10px; vertical-align: middle; color: #4C5266; text-align: center; font-size: 16px; font-weight: 500; border-bottom: 1px solid #F0F0F0; }
.team-schedule-table td:first-child { border-left: 1px solid #F0F0F0; }
.team-schedule-table td + td { border-left: 1px solid #F0F0F0; }
.team-schedule-table td:last-child { border-right: 1px solid #F0F0F0; }
.team-schedule-table td.no-schedule { text-align: center; color: #999; padding: 30px; }
.work-type-badge { display: inline-flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px;  border-radius: 4px;  border: 1px solid var(--clr-w700); background: var(--clr-w100); color: var(--txt-color-t700); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); }
#teamScheduleBody .schedule-type-office { color: var(--clr-w700) !important; border-color: var(--clr-w700) !important; background: var(--clr-w100) !important; }
#teamScheduleBody .schedule-type-remote { color: var(--clr-p500) !important; border-color: var(--clr-p500) !important; background: var(--clr-p100) !important; }
#teamScheduleBody .schedule-type-outwork { color: var(--clr-y900) !important; border-color: var(--clr-y900) !important; background: var(--clr-y000) !important; }
#teamScheduleBody .schedule-type-vacation { color: var(--clr-v500) !important; border-color: var(--clr-v500) !important; background: var(--clr-v000) !important; }
#teamScheduleBody .schedule-type-absent { color: var(--clr-r900) !important; border-color: var(--clr-r900) !important; background: var(--clr-r000) !important; }
#teamScheduleBody .schedule-type-early { color: var(--clr-n60) !important; border-color: var(--clr-n60) !important; background: var(--clr-n20) !important; }
#teamScheduleBody .schedule-type-overtime { color: var(--clr-e900) !important; border-color: var(--clr-e900) !important; background: var(--clr-e000) !important; }
#teamScheduleBody .schedule-type-late { color: var(--txt-color-t700) !important; border-color: var(--clr-w700) !important; background: var(--clr-w100) !important; }

.popobj-profile-container { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 30px 30px 0; }
.popobj-profile { flex: 1; display: flex; align-items: center; gap: 10px; }
.departmenetDetail .pop-cont .pop-cont-inner { overflow: hidden; overflow-y: auto; max-height: 70vh; display: flex; flex-flow: column; gap: 20px; padding: 20px 30px 0; }
.popobj-profile::before { content: attr(data-first); flex-shrink: 0; display: flex; width: 65px; height: 65px; justify-content: center; align-items: center; border-radius: 50%; background: linear-gradient(180deg, #59A7F7 0%, #4A96E6 100%); color: #FFF; font-size: 24px; font-weight: 700; }
.popobj-profile dl { display: flex; flex-flow: column; gap: 10px; }
.popobj-profile dl dt { color: #4C5266; font-size: 20px; font-weight: 700; }
.popobj-profile dl dd { display: flex; align-items: center; gap: 10px; }
.popobj-profile dl dd small { color: #828EAC; font-size: 14px; font-weight: 400; }
.popobj-profile dl dd ul { display: flex; align-items: center; gap: 5px; }
.popobj-profile dl dd li { display: flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 500px; background-color: #F0F4F8; color: #5A6681; text-align: center; font-size: 12px; font-weight: 600; }
.popobj-profile-container > button { display: flex; align-items: center; gap: 5px; height: 30px; padding: 0 15px; border: 1px solid #F2F2F2; color: #4C5266; font-size: 14px; font-weight: 600; }
.popobj-profile-container > button::before { content: ''; display: block; width: 12px; height: 12px; background: url(../../images/icon/ico_download.svg) no-repeat center 100%; }
.date-monthly.sm #employeeDetailWeekText { color: #5A6681; font-size: 16px; font-weight: 600; line-height: 1; height: fit-content; }
.popobj-lay-row { display: flex; align-items: stretch; justify-content: space-between; gap: 10px; }
.pg-schd-dtl-display01 { display: flex; flex-flow: column; border: 1px solid #E5E5E5; border-bottom: 0; }
.pg-schd-dtl-display01 dl { flex: 1; min-height: 0; display: flex; align-items: center; gap: 20px; padding: 20px 30px; border-bottom: 1px solid #E5E5E5; }
.pg-schd-dtl-display01 dl dt { color: #5A6681; font-size: 16px; font-weight: 700; }
.pg-schd-dtl-display01 dl dd { display: flex; align-items: center; gap: 6px; color: #828EAC; font-size: 14px; font-weight: 500; }
.pg-schd-dtl-display01 dl dd strong { color: #4C5266; font-size: 22px; font-weight: 700; }
.pg-schd-dtl-display02 { display: flex; flex-flow: column; align-items: center; justify-content: center; }
.pg-schd-dtl-display02 ul { width: 100%; flex: 1; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 10px; }
.pg-schd-dtl-display02 ul li { display: flex; padding: 10px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; flex: 1 0 0; align-self: stretch; border-radius: 3px; background: #F8F9FA; color: #4C5266; font-size: 22px; font-weight: 700; line-height: 1.1; }
.pg-schd-dtl-display02 ul li small { color: #828EAC; font-size: 14px; font-weight: 500; }
.badge-safe { color: #0CB460 !important; background-color: #E8F5E9 !important; }
.badge-warning { color: #FF9600 !important; background-color: #FFEFD9 !important; }
.popobj-lay-row > * { flex: 1; min-width: 0; }
#employeeDetailContent { display: flex; flex-flow: column; gap: 20px; }
.wst_tbl_info th { background: #F8F9FA; }
.wst_tbl_info th, .wst_tbl_info td { padding: 10px 10px; border: 1px solid #E5E5E5; color: #5A6681; text-align: center; font-size: 14px; font-weight: 600; }
[class*="wst_tbl"] { width: 100%; }
/*[class*="wst_tbl"] td strong:has(+ .wst-progress) { display: block; padding-bottom: 4px; color: #4C5266; text-align: center; font-size: 16px; font-weight: 600; line-height: 1; }*/
.wst-progress.sm { height: 4px; }
.wst-progress { position: relative; width: 100%; height: 8px; border-radius: 500px; background-color: #E8F3FF; }
.wst-progress span { position: absolute; left: 0; top: 0; background-color: #0CB460; border-radius: 500px; height: 100%; }
.wst-progress span.safe { background-color: #0CB460; }
.wst-progress span.warning { background-color: #FF9600; }
.wst-progress span.danger { background-color: #EF4444; }
.wst_list_info { display: flex; flex-flow: column; }
.wst_list_info > h5 { min-height: 41px; display: flex; align-items: center; justify-content: center; background-color: #5A6681; color: #FFF; text-align: center; font-size: 14px; font-weight: 600; }
.wst_list_info > ul { flex: 1; display: flex; flex-flow: column; }
.wst_list_info > ul > li > dl { display: flex; align-items: center; justify-content: space-between; padding: 8px 20px 8px 0; border: 1px solid #E5E5E5; border-width: 0 1px 1px; color: #4C5266; font-size: 14px; font-weight: 400; }
.wst_list_info > ul > li > dl dt { width: 140px; text-align: center; }
.wst_list_info > ul > li > dl dd { flex: 1; display: flex; flex-flow: column; gap: 5px; }
.wst_list_info > ul > li > dl dd > div { display: flex; justify-content: space-between; align-items: center; gap: 5px; }
.wst_list_info > ul > li > dl dd > div [class*='calendar-badge'] { height: 24px; min-width: 60px; }
.departmenetDetail .wst_pg-title .title-set-txt { font-size: 20px; }
.pg-schd-dtl-display03 { display: flex; align-items: stretch; }
.pg-schd-dtl-display03 ul { flex: 1; display: flex; justify-content: space-between; gap: 10px; align-items: stretch; }
.pg-schd-dtl-display03 ul li { flex: 1; display: flex; flex-flow: column; gap: 10px; justify-content: flex-start; align-items: center; padding: 14px 8px; border: 1px solid #E5E5E5; background: linear-gradient(180deg, #F8F9FA 0%, #FFF 100%); }
.pg-schd-dtl-display03 ul li h5 { color: #4C5266; text-align: center; font-size: 16px; font-weight: 700; }
.pg-schd-dtl-display03 ul li dl { flex: 1; display: flex; flex-flow: column; gap: 6px; justify-content: center; align-items: center; }
.pg-schd-dtl-display03 ul li dl dt { margin-bottom: -2px; color: #828EAC; text-align: center; font-size: 11px; font-weight: 400; }
.pg-schd-dtl-display03 ul li dl dd { color: #828EAC; text-align: center; font-size: 18px; font-weight: 700; line-height: 1.22; }
.wst_secondary { color: #59A7F7 !important; }
.wst_safe { color: #0CB460 !important; }
.pg-schd-dtl-display03.no-bg ul li { background: none; }
.pg-schd-dtl-display04 { display: flex; flex-flow: column; gap: 10px; }
.pg-schd-dtl-display04 dl { flex: 1; min-height: 0; display: flex; flex-flow: column; gap: 5px; padding: 15px 20px; }
.pg-schd-dtl-display04 dl dt { display: flex; justify-content: space-between; align-items: center; }
.pg-schd-dtl-display04 dl dt span { display: flex; gap: 10px; align-items: center; color: #4C5266; font-size: 15px; font-weight: 600; }
.pg-schd-dtl-display04 dl.badge-safe dt span::before { background-image: url(../../images/icon/ico_display_compare_safe.svg); }
.pg-schd-dtl-display04 dl.badge-warning dt span::before { background-image: url(../../images/icon/ico_display_compare_warning.svg); }
.pg-schd-dtl-display04 dl dt span::before { content: ''; display: block; width: 24px; height: 24px; background-repeat: no-repeat; background-position: center; background-size: cover; }
.pg-schd-dtl-display04 dl dt small { font-size: 14px; font-weight: 600; }
.pg-schd-dtl-display04 dl dd { color: #828EAC; font-size: 13px; font-weight: 400; }
.departmenetDetail .pop-cont .pop-btn-area { padding: 25px 30px; position: sticky; bottom: 0; background-color: #fff; }
.departmenetDetail .pop-btn-area button.popbtn.og { background-color: #0f447c; outline: 0px; border: 0px; font-size: 17px; font-weight: 600; color: #fff; }
.departmenetDetail .pop-close { position: absolute; top: 0; right: 0; width: 40px; height: 40px; padding: 5px; box-sizing: border-box; font-size: 0; background-image: url(../../images/connectplace/common/ico_close.png); background-position: center; background-repeat: no-repeat; background-size: 16px; }
.departmenetDetail .pop-close:hover { transform: rotate(180deg); transition: all 0.4s; opacity: 1; }
.pop-close.workhours_detail_close:hover { transform: rotate(180deg); transition: all 0.4s; opacity: 1; }

/* 근로 시간 관리 스타일 */
.workhours-summary-card.workhour_avg_box { max-width: calc((100% - 40px) / 4) !important; flex-basis: calc((100% - 40px) / 4) !important; }
.workhours-card-value small { color: #828EAC; font-size: 16px !important; font-weight: 500; line-height: 1; }
.workhours-progress-bar { position: relative; width: 100%; height: 8px; border-radius: 500px; background-color: #E8F3FF; }
.workhours-progress-fill { height: 100%; transition: width 0.3s; border-radius: 500px; background-color: #0CB460; }
.workhours-progress-fill.safe { background-color: #0CB460; }
.workhours-progress-fill.warning { background-color: #FF9600; }
.workhours-progress-fill.danger { background-color: #EF4444; }
.workhours-card-percent { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 18px; flex: 1; text-align: right; }
.workhours-card-percent small { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 18px; }
.workhours-summary-section { display: flex; align-items: stretch; justify-content: space-between; gap: 15px; }
.workhours-summary-cards { flex: 1; display: flex; align-items: stretch; gap: 20px; }
.workhours-action-buttons { display: flex; gap: 8px; justify-content: space-between; }
.workhours-action-btn { width: 16px; height: 16px; background: url(../../../figma/svg/viewdetail_black_16.svg) no-repeat center / 16px; flex-shrink: 0; }
.vacation-list-action-btn { width: 16px; height: 16px; background: url(../../../figma/svg/arrow_right_black_16.svg) no-repeat center / 16px; flex-shrink: 0; }
.workhours-action-btn:hover { opacity: 0.8; cursor: pointer  }

/* 초과 근무 제한 조치 팝업 */
.overtime-restriction-popup { border-radius: 8px; overflow: hidden; -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); }
/* 초과 근무자 목록: 내용 높이에 맞춰 뷰포트 안에서 중앙 정렬(스크롤은 팝업 내부) */
.layer-pop-wrap .layer-pop-area.overtime-restriction-popup.active {
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow-y: auto;
	box-sizing: border-box;
}
.overtime-restriction-popup-header { display: flex; align-items: center; overflow: hidden; position: relative; padding-left: 30px; padding-right: 70px; min-height: 50px; background: #4C5266; color: #fff; }
.overtime-restriction-popup-title { margin: 0; font-size: 18px; font-weight: 700; color: #fff; }
.overtime-restriction-notice { display: flex; gap: 12px; align-items: flex-start; padding: 16px 20px; border: 1px solid #FF9800; background: #FFF8E1; }
.overtime-restriction-notice-icon { flex-shrink: 0; width: 24px; height: 24px; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF9800"><path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"/></svg>') no-repeat center; background-size: contain; }
.overtime-restriction-notice-body { flex: 1; min-width: 0; }
.overtime-restriction-notice-title { display: block; margin: 0 0 6px; color: #E65100; font-size: 14px; font-weight: 700; }
.overtime-restriction-notice-desc { margin: 0; color: #5A6681; font-size: 13px; font-weight: 400; line-height: 1.5; }
.overtime-restriction-week-nav { margin: 16px 20px 0; padding: 8px 0; }
.overtime-restriction-week-nav .prevDate,
.overtime-restriction-week-nav .nextDate { cursor: pointer; padding: 4px 8px; }
.overtime-restriction-week-nav .prevDate.disabled,
.overtime-restriction-week-nav .nextDate.disabled { cursor: not-allowed; opacity: 0.45; pointer-events: none; }
.overtime-restriction-selection { padding: 20px; }
.overtime-restriction-selection-header { display: flex; justify-content: space-between; align-items: center; margin: 0; line-height: 1; pointer-events: none; width: 100%; font-weight: 600; color: #1382f4; font-size: 15px; }
.overtime-restriction-selection-header > span small { color: #828EAC; font-size: 14px; font-weight: 500; }
.overtime-restriction-selection-title { display: flex; align-items: baseline; gap: 6px; }
.overtime-restriction-select-all { display: inline-flex; align-items: center; gap: 6px; color: #5A6681; font-size: 14px; font-weight: 500; cursor: pointer; }
.overtime-restriction-select-all input { width: 18px; height: 18px; accent-color: #1382F4; cursor: pointer; }
.overtime-restriction-list { display: flex; flex-flow: column; align-items: stretch; gap: 5px; padding: 20px; background: #F8F9FA; }
.overtime-restriction-list .summary { display: flex; justify-content: space-between; align-items: center; align-self: stretch; margin-top: 10px; padding: 10px 0 0; border-top: 1px solid rgba(130, 142, 172, 0.20); background: none; box-shadow: none; }
.overtime-restriction-list .summary dl { display: contents; }
.overtime-restriction-list .summary dt { color: #4C5266; font-size: 14px; font-weight: 500; line-height: 1.5; margin-bottom: 5px; display: block; }
.overtime-restriction-list .summary dd { color: #1382F4; text-align: right; font-size: 22px; font-weight: 600; line-height: 1; }
.overtime-restriction-list-item { display: flex; padding: 7px 10px; justify-content: space-between; align-items: center; align-self: stretch; background: #FFF; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05); }
.overtime-restriction-list-item:last-child { border-bottom: none; }
.overtime-restriction-list-item.selected { background: #EEF0F3; }
.overtime-restriction-list-item input[type="checkbox"] { width: 18px; height: 18px; flex-shrink: 0; accent-color: #1382F4; cursor: pointer; }
.overtime-restriction-list-item-info { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.overtime-restriction-list-item-info-none { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.overtime-restriction-list-item-name { color: #4C5266; font-size: 14px; font-weight: 600; }
.overtime-restriction-list-item-hours { color: #828EAC; font-size: 13px; font-weight: 500; }
.overtime-restriction-list-item-badge { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 54px; padding: 0 8px; font-size: 12px; font-weight: 600; border-radius: 2px; }
.overtime-restriction-list-item-badge.risk { background: #FFEBEE; color: #EF5350; }
.overtime-restriction-list-item-badge.caution { background: #FFF3E0; color: #FF9800; }
.overtime-restriction-notice > div { flex: 1; display: flex; gap: 10px; align-items: stretch; padding: 0; margin: 0; width: 100%; overflow: unset; justify-content: start; }
.overtime-restriction-empty { padding: 24px 16px; text-align: center; color: #828EAC; font-size: 14px; }

/* 초과 근무자 목록 — 통합 테이블(주 40h 초과 + 보상휴가 + 상태) */
#overtimeRestrictionSelectionWrap,
#vacationUrgingSelectionWrap { display: flex; padding: 1px 0; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); } 
.overtime-restriction-popup .overtime-restriction-table-summary { display: flex; padding: 16px 24px; align-items: center; gap: 8px; align-self: stretch;  font-size: var(--txt-size-14);  font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.overtime-restriction-popup .overtime-restriction-table-summary strong { font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.overtime-restriction-popup .overtime-restriction-table-wrap { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; gap: 0; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow-x: auto; }
.overtime-restriction-popup .overtime-restriction-table { display: table-cell; width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
.overtime-restriction-popup .overtime-restriction-table thead th { box-sizing: border-box; height: 44px; text-align: start; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); border-bottom: 1px solid var(--clr-w300); }
.overtime-restriction-popup .overtime-restriction-table tbody td { box-sizing: border-box; height: 48px; font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); border-bottom: 1px solid var(--clr-w300); }
.overtime-restriction-popup .overtime-restriction-table tbody tr:last-child td { border-bottom: none; }
.overtime-restriction-popup .overtime-restriction-table__col-no { text-align: center !important; padding: 0 12px 0 12px; width: 54px; white-space: nowrap; }
.overtime-restriction-popup .overtime-restriction-table__col-name { padding: 0 12px; width: 122px; align-items: center; gap: 4px; }
.overtime-restriction-popup .overtime-restriction-table__col-total,
.overtime-restriction-popup .overtime-restriction-table__col-over { width: 100px; padding: 0 12px; align-items: center; gap: 12px; }
.overtime-restriction-popup .overtime-restriction-table__col-restriction { width: 120px; padding: 0 12px; align-items: center; gap: 12px; }
.overtime-restriction-popup .overtime-restriction-table__col-status { width: 80px; padding: 0 12px; align-items: center; gap: 12px; }
.overtime-restriction-popup .overtime-restriction-table-name { align-items: center; display: flex; gap: 8px; text-align: left; }
.overtime-restriction-popup .overtime-restriction-table-name .team-member-avatar { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clr-n80); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); flex-shrink: 0; }
.overtime-restriction-popup .overtime-restriction-table-name-text b { color: #4c5266; font-weight: 600; }
.overtime-restriction-popup .overtime-restriction-table-name-text small { color: #828eac; font-weight: 400; font-size: 12px; margin-left: 4px; }
.overtime-restriction-popup .overtime-restriction-table-badge,
.workhours-table .overtime-restriction-table-badge,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge { display: flex; height: 20px; min-height: 20px; max-height: 20px; padding: 0 8px; align-items: center; gap: 4px; border-radius: 12px; background: transparent; }
.workhours-table .overtime-restriction-table-badge--urging { width: 69px !important; }
.overtime-restriction-popup .overtime-restriction-table-badge::before,
.workhours-table .overtime-restriction-table-badge::before,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.overtime-restriction-popup .overtime-restriction-table-badge--risk,
.workhours-table .overtime-restriction-table-badge--risk,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--risk,
.overtime-restriction-table-badge--urging { background: var(--clr-r000) !important; color: var(--clr-r900); }
.overtime-restriction-popup .overtime-restriction-table-badge--risk::before,
.workhours-table .overtime-restriction-table-badge--risk::before,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--risk::before,
.overtime-restriction-table-badge--urging::before { background: var(--clr-r900); }
.overtime-restriction-popup .overtime-restriction-table-badge--caution,
.workhours-table .overtime-restriction-table-badge--caution,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--caution { background: var(--clr-y000); color: var(--clr-y900); }
.overtime-restriction-popup .overtime-restriction-table-badge--caution::before,
.workhours-table .overtime-restriction-table-badge--caution::before,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--caution::before { background: var(--clr-y900); }
.overtime-restriction-popup .overtime-restriction-table-badge--normal,
.workhours-table .overtime-restriction-table-badge--normal,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--normal { background: var(--clr-g000); color: var(--clr-g900); }
.overtime-restriction-popup .overtime-restriction-table-badge--normal::before,
.workhours-table .overtime-restriction-table-badge--normal::before,
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--normal::before { background: var(--clr-g900); }
.workhours-table .overtime-restriction-table-badge { width: 47px; font-size: var(--txt-size-12); }
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge { width: auto; min-width: 47px; font-size: var(--txt-size-12); white-space: nowrap; }
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--weekend { background: #E3F2FD !important; color: #2196F3; }
#employeeAttendanceSidePanel #workhoursDetailDailyRecordTable .overtime-restriction-table-badge--weekend::before { background: #2196F3; }

.popobj-alert { flex: 1; display: flex; flex-flow: column; gap: 5px; padding: 10px 20px; border: 1px solid #F59E0B; background: #FFF3E0; color: #5A6681; font-size: 13px; font-weight: 400; }
.popobj-alert dt { display: flex; align-items: center; gap: 4px; color: #F59E0B; font-size: 14px; font-weight: 600; }
.popobj-alert dt::before { content: ''; display: block; width: 16px; height: 16px; background: url(../../images/icon/ico_verification_info-warning.svg) no-repeat center; }

/* 초과 근무자 목록 팝업 — 안내 아코디언 */
.overtime-restriction-popup .overtime-notice-accordions { display: flex; flex-direction: column; gap: 24px; width: 100%; box-sizing: border-box; }
.overtime-restriction-popup .overtime-notice-accordion { display: flex; min-width: 316px; padding: 16px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100);}
.overtime-restriction-popup .overtime-notice-accordion__trigger-main { display: flex; align-items: center; justify-content: flex-start; gap: 8px; align-self: stretch; cursor: pointer; }
.overtime-restriction-popup .overtime-notice-accordion__info { width: 16px; height: 16px; aspect-ratio: 1/1; background: url(../../../figma/svg/info_filled_bluegray_24.svg) no-repeat center / 16px; }
.overtime-restriction-popup .overtime-notice-accordion__title { flex: 1 1 auto; min-width: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t700); }
.overtime-restriction-popup .overtime-notice-accordion__chevron { flex-shrink: 0; width: 22px; height: 22px; margin-left: auto; display: flex; align-items: center; justify-content: center; }
.overtime-restriction-popup .overtime-notice-accordion__chevron::after { content: ''; width: 8px; height: 8px; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: translateY(-2px) rotate(45deg); transition: transform 0.2s ease; }
.overtime-restriction-popup .overtime-notice-accordion--open .overtime-notice-accordion__chevron::after { transform: translateY(2px) rotate(-135deg); }
.overtime-restriction-popup .overtime-notice-accordion__panel { min-width: 80px; align-self: stretch; }
.overtime-restriction-popup .overtime-notice-accordion__panel[hidden] { display: none !important; }
.overtime-restriction-popup .overtime-notice-accordion__panel-inner { padding-top: 8px; box-sizing: border-box; }
.overtime-restriction-popup .overtime-notice-accordion__body { font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.overtime-restriction-popup .overtime-notice-accordion__emphasis { color: var(--clr-p600); }

/* 연차 촉진 안내(아코디언 본문) — 섹션 제목 볼드·하위 항목 들여쓰기·불릿 */
.overtime-restriction-popup .vacation-urging-notice { display: flex; flex-direction: column; gap: 0; }
.overtime-restriction-popup .vacation-urging-notice__intro { margin: 0 0 16px; line-height: 1.55; }
.overtime-restriction-popup .vacation-urging-notice__section { margin: 0 0 16px; }
.overtime-restriction-popup .vacation-urging-notice__section:last-child { margin-bottom: 0; }
.overtime-restriction-popup .vacation-urging-notice__heading { display: block; font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t700); margin: 0 0 8px; line-height: 1.5; }
.overtime-restriction-popup .vacation-urging-notice__list { margin: 0; padding: 0 0 0 1.15em; list-style-type: disc; list-style-position: outside; }
.overtime-restriction-popup .vacation-urging-notice__list li { margin: 0 0 6px; padding-left: 6px; line-height: 1.55; }
.overtime-restriction-popup .vacation-urging-notice__list li:last-child { margin-bottom: 0; }

/* 보상 휴가 산정 팝업 */
.compensatory-leave-popup .compensatory-leave-notice { margin-bottom: 0; }
.compensatory-leave-row { display: flex; align-items: center; gap: 12px; width: 100%; cursor: pointer; flex-wrap: wrap; justify-content: space-between; }
.compensatory-leave-row .compensatory-leave-check { flex-shrink: 0; width: 18px; height: 18px; accent-color: #1382F4; cursor: pointer; }
.compensatory-leave-row .compensatory-leave-name { display: flex; align-items: center; gap: 5px; color: #5A6681; font-size: 14px; font-weight: 500; line-height: 1; }
.compensatory-leave-row .compensatory-leave-overtime { color: #828EAC; font-size: 13px; font-weight: 500; }
.compensatory-leave-row .compensatory-leave-comp { display: flex; flex-flow: column; align-items: flex-end; gap: 0; color: #828EAC; text-align: right; font-size: 12px; font-weight: 400; line-height: 1.5; }
.compensatory-leave-row .compensatory-leave-comp > strong { color: #0F447C; text-align: right; font-size: 16px; font-weight: 600; line-height: 1.3; }
.compensatory-leave-row > label { display: inline-flex; align-items: center; gap: 5px; cursor: default; position: relative; margin: 0 !important; }
.compensatory-leave-row > label { display: inline-flex; align-items: center; gap: 5px; cursor: default; position: relative; margin: 0 !important; }
.compensatory-leave-row .compensatory-leave-name > b { color: #4C5266; font-size: 14px; font-weight: 600; line-height: 1.5; }
.compensatory-leave-row .compensatory-leave-name > small { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 1.5; }
.compensatory-leave-summary { margin-top: 12px; padding: 10px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #4C5266; font-size: 15px; font-weight: 700; border-top: 1px solid #E5E5E5; }
.compensatory-leave-summary-hours { color: #1382F4; font-weight: 700; }
.compensatory-leave-empty { padding: 24px 16px; text-align: center; color: #828EAC; font-size: 14px; }

.workhours-charts-row { display: flex; align-items: stretch; justify-content: space-between; gap: 15px; }
.workhours-chart-container { gap: 20px; min-height: 420px; flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 25px; border: 1px solid #E5E5E5; }
.workhours-chart-container h5 { display: flex; flex-flow: wrap; align-items: baseline; color: #4C5266; font-size: 20px; font-weight: 700; line-height: 25px; gap: 8px; width: 100%; }
.workhours-chart-container .workhours-chart-header { display: flex; justify-content: space-between; flex-flow: wrap; align-items: baseline; gap: 8px; }
.workhours-chart-container .workhours-chart-header h5 { margin: 0; }
.workhours-chart-container .workhours-chart-header small { font-size: 16px; font-weight: 500; }
.workhours-chart-container > div { max-height: 300px; }
.workhours-table-section { display: flex; flex-direction: column; gap: 15px; }
.workhours-table-title { margin-top: 10px; display: flex; justify-content: space-between; align-items: center; }
.workhours-filter-buttons { display: flex; align-items: center; gap: 8px; }
.workhours-filter-buttons button { color: #5A6681; font-size: 12px; font-weight: 600; border-radius: 0; width: auto; height: 28px; padding: 0 15px; box-sizing: border-box; white-space: nowrap; background-color: #fff; border: 1px solid #E5E5E5; transition: all 0.2s; }
.vacation-filter-buttons button:not(.department-search-btn) { color: #5A6681; font-size: 12px; font-weight: 600; border-radius: 0; width: auto; height: 28px; padding: 0 15px; box-sizing: border-box; white-space: nowrap; background-color: #fff; border: 1px solid #E5E5E5; transition: all 0.2s; }
.workhours-filter-btn.active { background-color: #fff; color: #5A6681; background: linear-gradient(357deg, #1382F4 16.59%, #5AA7F7 97.29%), #FFF; color: #fff; }
.workhours-filter-btn:hover:not(.active) { opacity: 1; border-color: #5A6681; cursor: pointer }
.workhours-table { display: table; width: 100%; max-width: 100%; min-width: 720px; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
.workhours-table thead { display: table-header-group; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
.workhours-table tr { display: table-row; }
.workhours-table thead th { height: 44px; text-align: start; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
.workhours-table tbody td { height: 60px; font-weight: var(--txt-weight-regular); }
.workhours-table tbody tr:last-child { border-bottom: 0; }
.workhours-table .workhour-stats-name { display: flex; padding: 0 12px 0 24px; align-items: center; gap: 4px; align-self: stretch; }
.workhours-table .workhour-stats-name > span,
.department-schedule-td-name > span { display: flex; align-items: center; gap: 4px; flex: 1 0 0; }
.workhours-table .workhour-stats-daily-avg { min-width: 140px; padding: 0 12px 0 24px; align-items: center; gap: 12px; align-self: stretch; }
.workhours-table .workhour-stats-monthly { min-width: 140px; padding: 0 12px; align-items: center; gap: 12px; align-self: stretch; }
.workhours-table .workhour-stats-overtime { min-width: 100px; padding: 0 12px; align-items: center; gap: 12px; align-self: stretch; }
.workhours-table .workhour-stats-weekly { min-width: 160px; padding: 0 12px; vertical-align: middle; }
.workhours-weekly-progress-stack { display: flex;flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px; align-self: stretch; }
.workhours-table .workhour-stats-weekly .workhours-weekly-progress-stack > strong { display: block; padding: 0; margin: 0; text-align: left; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.workhours-weekly-progress-row { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.workhours-weekly-progress-row .workhours-weekly-progress-bar { display: flex; height: 8px; min-width: 120px; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1 0 0; }
.workhours-weekly-progress-row .wst-progress.sm { height: 8px; }
.workhours-weekly-progress-pct { width: 40px; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.workhours-table .workhour-stats-text { padding: 0 0 0 12px; align-items: center; gap: 12px; align-self: stretch; }
.workhours-table tr { border-bottom: 1px solid var(--clr-w300); background: var(--clr-w100); }
.workhours-detail-btn { display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; aspect-ratio: 1/1; border-radius: 6px; border: 1px solid var(--clr-w300);  background: url(../../../figma/svg/graph_16.svg) no-repeat center / 16px; }
.workhours-detail-btn:hover { opacity: 0.8; cursor: pointer }
.workhours-detail-btn--no-vacation { opacity: 0.45; background-image: url(../../../figma/svg/graph_16.svg); cursor: not-allowed; }
.workhours-detail-btn--no-vacation:hover { opacity: 0.45; }
.department-vacation-table-row--no-data td { color: var(--txt-color-t500); }
.workhours-manual-action-btn:hover { background-color: #f5f5f5; border-color: #1382F4; color: #1382F4; }
.wst_pg-box { flex: 1; min-width: 0; display: flex; flex-flow: column; justify-content: space-between; gap: 12px; padding: 25px; border: 1px solid #E5E5E5; }
.wst_pg-box .box-tit { display: flex; justify-content: space-between; white-space: nowrap; align-items: baseline; color: #5A6681; font-size: 16px; font-weight: 700; line-height: 21px; }
.wst_pg-box .box-display { display: flex; gap: 4px; align-items: baseline; color: #4C5266; font-size: 32px; font-weight: 700; line-height: 1; }
.wst_pg-box.compound { flex-flow: row; justify-content: flex-start; gap: 25px; max-width: calc((100% - 20px) / 2) !important; flex-basis: calc((100% - 20px) / 2) !important; }
.wst_pg-box.compound > div:first-child { flex-basis: 30%; min-width: 30%; border-right: 1px solid #F0F1F3; }
.wst_pg-box.compound > div { display: flex; flex-flow: column; justify-content: space-between; }
.wst_pg-box.compound > div:last-child { flex: 1; }
.workhours-table-title .title-set { display: flex; align-items: stretch; gap: 20px; }
.workhours-table-title .title-set > span { color: #4B5165; font-size: 23px; font-weight: 700; }
.workhours-table td strong { display: block; padding-bottom: 4px; color: #4C5266; text-align: center; font-size: 16px; font-weight: 600; line-height: 1; }
.wst-progress { position: relative; width: 100%; height: 8px; border-radius: 500px; background-color: #E8F3FF; }
.wst-progress.sm { height: 4px; }
.workhours-manual-title { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; }
.workhours-manual-title span { max-height: 62px; align-self: stretch; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-bold); }
.workhours-manual-title small { color: var(--txt-color-t70); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.workhour-manual-pop-cont-inner { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; }
dl.workhours-manual-section { display: flex; min-width: 316px; padding: 16px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
dl.workhours-manual-section dt { display: flex; align-items: center; gap: 8px; align-self: stretch; }
dl.workhours-manual-section dt i { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 20px; background: var(--clr-p600, #267BFF); font-style: normal; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); color: var(--txt-color-t100); }
dl.workhours-manual-section dt span { flex: 1 0 0; color: var(--txt-color-t700); font-weight: var(--txt-weight-semibold); font-size: var(--txt-size-16); }
dl.workhours-manual-section dd { min-width: 80px; align-self: stretch; color: var(--txt-color-t500); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.workhour-manual-icon { width: 16px; height: 16px; background: url(../../../figma/svg/help_outline_black_16.svg) no-repeat center / 16px; flex-shrink: 0; }

/* 부서원 근무시간 현황 상세보기 팝업 */
.workhours-detail-popup { flex-flow: column; inset: 0; height: fit-content; max-height: calc(100vh - 40px); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); }
.workhours-detail-popup.active { display: flex !important; }
.workhours-detail-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid #E5E5E5; }
.workhours-detail-popup .pop-cont.workhours-detail-pop-cont { padding: 0; -webkit-box-shadow: none; }
.workhours-detail-employee-info { display: flex; align-items: center; gap: 16px; }
.workhours-detail-initial { position: relative; width: 48px; height: 48px; flex-shrink: 0; }
.workhours-detail-initial::before { content: attr(data-first); display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 50%; background: #1382F4; color: #FFF; font-size: 20px; font-weight: 600; }
.workhours-detail-employee-text { display: flex; flex-direction: column; gap: 4px; }
.workhours-detail-name { color: #4C5266; font-size: 18px; font-weight: 700; line-height: 1.4; }
.workhours-detail-position { color: #5A6681; font-size: 14px; font-weight: 400; line-height: 1.4; }
.workhours-detail-header-actions { display: flex; align-items: center; gap: 16px; }
.workhours-detail-pdf-link { color: #5A6681; font-size: 14px; font-weight: 500; text-decoration: none; display: flex; align-items: center; gap: 6px; }
.workhours-detail-pdf-link:hover { color: #1382F4; text-decoration: underline; }
.workhours-detail-pdf-icon { display: inline-block; width: 16px; height: 16px; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%235A6681"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>') no-repeat center; background-size: contain; }
.workhours-detail-tabs { display: flex; gap: 0; border-bottom: 1px solid #E5E5E5; background: #FFF; padding: 0 24px; }
.workhours-detail-tab:hover { color: #1382F4; }
.workhours-detail-tab.active { color: #59A7F7 !important; }
.workhours-detail-date-nav { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 16px 24px; background: #FFF; border-bottom: 1px solid #E5E5E5; }
.workhours-detail-nav-btn { width: 32px; height: 32px; border: 1px solid #E5E5E5; background: #FFF; color: #5A6681; font-size: 16px; font-weight: 600; cursor: pointer; border-radius: 4px; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
.workhours-detail-nav-btn:hover { background: #F5F5F5; border-color: #1382F4; color: #1382F4; }
.workhours-detail-month-text, .workhours-detail-week-text { color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); }
.workhours-detail-summary-cards-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch; }
.workhours-detail-summary-cards h3 { font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.workhours-detail-summary-cards { display: flex; align-items: flex-start; gap: 8px; align-self: stretch; }
.workhours-detail-card-label { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.workhours-detail-card-value { color: #4C5266; font-size: 24px; font-weight: 700; line-height: 1.2; }
.workhours-detail-card-value.overtime { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.box-display.overtime { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.workhours-detail-overtime-status { display: flex; justify-content: center; align-items: center; width: 100%; }
.box-display.overtime > div { display: flex; align-items: baseline; justify-content: center; gap: 4px; }
.box-display.overtime #workhoursDetailOvertimeHours { color: #EF5350; font-size: 32px; font-weight: 700; line-height: 1; }
.box-display.overtime small { color: #5A6681; font-size: 14px; font-weight: 400; }
.workhours-detail-progress-bar { width: 100%; height: 8px; background: #E8F3FF; border-radius: 500px; overflow: hidden; }
.workhours-detail-progress-fill { height: 100%; border-radius: 500px; transition: width 0.3s ease, background-color 0.3s ease; }
.workhours-detail-card-percent { flex: 1; text-align: right; font-size: 11px; font-weight: 400; color: #828EAC; line-height: 18px; }
.workhours-detail-status-badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 54px; padding: 0 8px; font-size: 12px; font-weight: 600; line-height: 1; letter-spacing: -0.5px; border-radius: 2px; }
.workhours-detail-status-badge.risk { background: #FFEBEE; color: #EF5350; }
.workhours-detail-status-badge.caution { background: #FFF3E0; color: #FF9800; }
.workhours-detail-status-badge.normal { background: #E8F5E9; color: #4CAF50; }
.workhours-detail-status-badge.weekend { background: #E3F2FD; color: #2196F3; }
.workhours-detail-status-badge.leave { background: #E3F2FD; color: #1976D2; }
.workhours-detail-table td.workhours-detail-status-cell { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 4px; flex-wrap: wrap; }
.workhours-detail-chart-section { gap: 20px; min-height: 420px; }
.workhours-detail-chart-header { display: flex; justify-content: space-between; flex-flow: wrap; align-items: baseline; color: #4C5266; font-size: 20px; font-weight: 700; line-height: 25px; gap: 8px; white-space: nowrap; }
.workhours-detail-chart-title { display: flex; align-items: center; gap: 4px; }
.workhours-detail-chart-title small { font-size: 16px; font-weight: 500; }
.workhours-detail-chart-legend { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-left: auto; }
.workhours-detail-legend-item { color: #5A6681; font-size: 14px; font-weight: 500; line-height: 1; }
.workhours-detail-legend-btn { color: #5A6681; font-size: 12px; font-weight: 600; border-radius: 0; width: auto; height: 28px; padding: 0 15px; box-sizing: border-box; white-space: nowrap; background-color: #fff; border: 1px solid #E5E5E5; transition: all 0.2s; }
.workhours-detail-legend-btn:hover { border-color: #1382F4; color: #1382F4; }
.workhours-detail-legend-btn.active { background: linear-gradient(357deg, #1382F4 16.59%, #5AA7F7 97.29%), #FFF; color: #fff; border-color: #1382F4; cursor: default; }
.workhours-detail-chart-container { width: 100%; height: 320px; position: relative; }
.workhours-detail-chart-container canvas { max-width: 100%; height: 100%; }
.workhours-detail-table-section { margin-bottom: 24px; }
.workhours-detail-table-title { margin-top: 10px; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; font-size: 20px; color: #4B5165; font-weight: 700; }
.workhours-detail-table { width: 100%; border-collapse: collapse; }
.workhours-detail-table th { background-color: #F8F9FA; border-left: 2px solid #fff; }
.workhours-detail-table th, .workhours-detail-table td { padding: 10px; text-align: center; vertical-align: middle; color: #5A6681; font-size: 14px; font-weight: 600; }
.workhours-detail-table th:first-child { border-left: 0; }
.workhours-detail-table td { border-bottom: 1px solid #F0F0F0; font-weight: 500; }
.workhours-detail-table td:first-child { border-left: 1px solid #F0F0F0; }
.workhours-detail-table td:last-child { border-right: 1px solid #F0F0F0; }
.workhours-detail-table tbody tr:last-child td { border-bottom: none; }
.workhours-detail-table tbody tr:hover { background: #F8F9FA; }
.workhours-detail-table td.saturday { color: #2196F3; font-weight: 600; }
.workhours-detail-table td.sunday { color: #EF5350; font-weight: 600; }
.workhours-detail-commute-placeholder { padding: 60px 20px; text-align: center; color: #5A6681; font-size: 14px; }
.workhours-detail-content { flex: 1; overflow-y: auto; overflow-x: hidden; min-height: 0; }
.workhours-detail-popup .pop-btn-area { flex-shrink: 0; padding: 20px; border-top: 1px solid #E5E5E5; background: #FFF; }
.workhours_detail_close { position: absolute; top: 0; right: 0; width: 40px; height: 40px; padding: 5px; box-sizing: border-box; font-size: 0; background-image: url(../../images/connectplace/common/ico_close.png); background-position: center; background-repeat: no-repeat; background-size: 16px; }
.workhours-manual-section .pop-btn-area { padding: 25px 30px; position: sticky; bottom: 0; background-color: #fff; }

.layer-pop-area.workhours-detail-popup .pop-cont .pop-cont-inner { display: flex; flex-flow: column; gap: 20px; padding: 20px 30px 0; }
.line-tab { padding-bottom: 5px; border-bottom: 2px solid #E8F3FF; }
.workhours-detail-title-set { align-items: stretch !important; gap: 20px !important; }
.line-tab .line-tab-btns { display: flex; align-items: stretch; }
.line-tab.workingtime .line-tab-btns button { height: 35px; flex-direction: row-reverse; gap: 5px; }
.line-tab .line-tab-btns button { position: relative; display: flex; align-items: center; padding: 0 20px; color: #5A6681; font-size: 16px; font-weight: 600; line-height: 22.5px; transition: all .3s ease; }
.line-tab .line-tab-btns button.active::before { visibility: visible; opacity: 1; }
.line-tab .line-tab-btns button::before { content: ''; position: absolute; left: 0; bottom: -7px; width: 100%; height: 2px; background-color: #59A7F7; visibility: hidden; opacity: 0; transition: all .3s ease; }
.line-tab.workingtime .line-tab-btns button.active:nth-child(1):after { background-image: url(../../images/icon/ico_workingdetail_pop_01_active.svg); }
.line-tab.workingtime .line-tab-btns button:nth-child(1):after { background-image: url(../../images/icon/ico_workingdetail_pop_01.svg); }
.line-tab.workingtime .line-tab-btns button:nth-child(2):after { background-image: url(../../images/icon/ico_workingdetail_pop_02.svg); }
.line-tab.workingtime .line-tab-btns button::after { content: ''; display: block; width: 15px; height: 15px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.workingtime .title-set { display: flex; align-items: stretch; gap: 20px; }
#workhoursDetailContent { display: flex; flex-flow: column; gap: 20px; overflow: hidden; overflow-y: auto; max-height: 65vh; }
#vacationDetailContent { display: flex; flex-flow: column; gap: 20px; overflow: hidden; overflow-y: auto; max-height: 65vh; }
.wst_pg-box.sm_pop { justify-content: space-between; gap: 10px; padding: 20px 15px; }
.wst_pg-box.sm_pop > * { justify-content: center; }
/*.wst_pg-box .box-display { display: flex; gap: 4px; align-items: baseline; color: #4C5266; font-size: 30px; font-weight: 700; line-height: 1; }*/
.wst_pg-box .box-display small { color: #828EAC; font-size: 14px; font-weight: 500; line-height: 1; }
.workhours-detail-legend-item { display: flex; align-items: center; gap: 4px; }
.workhours-detail-legend-item::before { content: ''; display: block; width: 14px; height: 14px; }
.workhours-detail-legend-item.weekly::before { background-color: #59A7F7; }
.workhours-detail-legend-item.monthly::before { border-radius: 50%; border: 2px solid #0CB460; background-color: transparent; }
#workhoursDetailOvertime .workhours-detail-status-badge { min-width: 36px !important; padding: 3px 8px !important; }

.wst_pg-boxgroup { display: flex; align-items: stretch; justify-content: space-between; gap: 15px; }
.wst_pg-box .box-msg { color: #828EAC; font-size: 14px; font-weight: 600; line-height: 18px; }
.wst_pg-box .box-msg small { color: #828EAC; font-size: 12px; font-weight: 400; line-height: 18px; }
.wst_pg-box .box-msg.wst_danger::before { background-image: url(../../images/icon/ico_display_danger.svg); }
.wst_pg-box .box-msg[class*="wst_"] { display: flex; gap: 4px; align-items: baseline; }
.wst_pg-box .box-msg[class*="wst_"]::before { content: ''; flex-shrink: 0; display: block; width: 14px; height: 14px; background-repeat: no-repeat; background-position: center; background-size: contain; transform: translateY(2px); }
.wst_danger { color: #EF4444 !important; }
.wst_warning { color: #FF9600 !important; }
.wst_pg-box.compound .btnset { display: flex; gap: 8px; justify-content: space-between; }
#department-dashboard-area { display: flex; padding: 20px; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; border-radius: 12px; background: var(--clr-p90); }
#department-dashboard-area .department-dashboard-panel { display: none; align-items: flex-start; align-content: flex-start; gap: 20px; align-self: stretch; flex-wrap: wrap; }
#department-dashboard-area .department-dashboard-panel.active { display: flex; }
.department-page-body.workstatus_container_wrap { gap: 24px; }
.attendance-work-stats-wrap .department-dept-page-head-card.attendance-request-history__body-wrap { overflow: visible; }
.attendance-work-stats-wrap .department-dept-page-head-card .attendance-request-history__title-row.department-dept-page-title-row { border-bottom: none; }
.attendance-work-stats-wrap .department-page-toolbar-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 20px; flex: 1 1 auto; min-width: 0; }
.attendance-work-stats-wrap #department-dashboard-shared-toolbar .workstatus-dashboard__summary-head { justify-content: stretch; width: 100%; }
.attendance-work-stats-wrap #department-dashboard-shared-toolbar .department-page-toolbar-actions { justify-content: space-between; width: 100%; max-width: 100%; }
.attendance-work-stats-wrap #department-dashboard-shared-toolbar.department-dept-dashboard--toolbar { display: flex; align-items: flex-start; gap: 16px; align-self: stretch; }
.attendance-work-stats-wrap .department-excel-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex-shrink: 0; }
.attendance-work-stats-wrap .department-excel-buttons button.department-excel-btn { gap: 4px; border: 1px solid var(--clr-g900) !important; }
.attendance-work-stats-wrap .department-excel-btn::before { content: ""; width: 18px; height: 18px; background: url(../../../figma/svg/exceldownload_36.svg) no-repeat center / 18px 18px; flex-shrink: 0; }
.attendance-work-stats-wrap .department-dept-dashboard--schedule { width: 100%; box-sizing: border-box; }
.attendance-work-stats-wrap .department-schedule-toolbar-row { align-items: flex-start; }
@media (min-width: 900px) {
	.attendance-work-stats-wrap .department-schedule-toolbar-row { align-items: center; }
}
.attendance-work-stats-wrap .department-schedule-table-wrap { min-width: 0; }
.attendance-work-stats-wrap .department-dept-workhours-risk-card { display: flex; padding: 0 12px; align-items: center; gap: 16px; flex: 1 0 0; align-self: stretch; border-radius: 6px; background: var(--clr-n30);  }
.attendance-work-stats-wrap .department-dept-workhours-risk-card .workhours-risk-card__value { display: flex; align-items: center; gap: 2px; flex: 1 0 0; }
.attendance-work-stats-wrap .department-dept-workhours-action-buttons { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.attendance-work-stats-wrap .department-dept-vacation-urging-wrap .department-dept-vacation-urging-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.attendance-work-stats-wrap .department-dept-trend-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; width: 100%; box-sizing: border-box; }
.attendance-work-stats-wrap .department-dept-trend-head .department-dept-trend-head-titles { flex: 1 1 auto; min-width: 0; }
.attendance-work-stats-wrap .department-dept-trend-head-titles h3 { margin: 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); line-height: 1.3; }
.attendance-work-stats-wrap .department-dept-trend-card .workstatus-daily-chart-legend { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours { display: flex; flex-direction: column; gap: 12px; min-height: 0; min-width: 0; flex: 1; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-header { margin-bottom: 0; flex-shrink: 0; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-dept-performance-head { align-items: center; width: 100%; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-dept-performance-head > span { width: auto; flex: 1 1 auto; min-width: 0; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-performance-summary--header { display: flex; height: 36px; padding: 0 12px; align-items: center; gap: 8px; border-radius: 4px; background: var(--clr-n30); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-performance-summary--header .performance-summary-item { display: flex; align-items: center; gap: 4px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-performance-summary--header .performance-desc { display: none; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-performance-summary--header dl { gap: 0; margin: 0; flex-direction: row; align-items: center; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-performance-summary--header li dt::before { display: none !important; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin: 0; padding: 0; list-style: none; flex: 1 1 auto; min-width: 0; }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li { display: flex; align-items: center; gap: 4px; color: var(--txt-color-t500); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li::before { content: ''; display: block; width: 12px; height: 12px; border-radius: 4px;}
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li:nth-child(1)::before { background-color: var(--clr-g900); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li:nth-child(2)::before { background-color: var(--clr-y900); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li:nth-child(3)::before { background-color: var(--clr-r900); }
.attendance-work-stats-wrap .department-dept-performance-in-workhours .department-chart-legend li:nth-child(4)::before { width: 12px; height: 2px; border-radius: 0; background-color: #1382F4; }
/* 부서 근무시간 대시보드: 개인 근무시간 현황(WorkHours)과 동일한 차트 카드 높이(348px) 고정 */
.attendance-work-stats-wrap #department-dashboard-workhours .department-dept-chart-wrap .workstatus-chart-card.workstatus-chart-card--daily,
.attendance-work-stats-wrap #department-dashboard-workhours .department-dept-chart-wrap .workstatus-chart-card.workstatus-chart-card--weekly { height: 348px; min-height: 348px; max-height: 348px; box-sizing: border-box; overflow: hidden; }
/* 부서 연차 대시보드: 카드 348px 안에서만 차트·범례가 보이도록(차트 영역은 flex로 남은 높이만 사용) */
.attendance-work-stats-wrap #department-dashboard-vacation .department-dept-chart-wrap .workstatus-chart-card.workstatus-chart-card--daily,
.attendance-work-stats-wrap #department-dashboard-vacation .department-dept-chart-wrap .workstatus-chart-card.workstatus-chart-card--weekly { height: 348px; min-height: 348px; max-height: 348px; box-sizing: border-box; overflow: hidden; }
.attendance-work-stats-wrap #department-dashboard-vacation .workstatus-chart-card .workstatus-chart-card__body { min-height: 0; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-dept-chart-wrap .workstatus-chart-card--daily .workstatus-daily-chart-legend { flex-shrink: 0; min-height: 0; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-body { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; flex: 1 1 0; min-height: 0; width: 100%; align-self: stretch; box-sizing: border-box; padding: 0; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-shell.home-reservation-card { min-width: 0; max-width: none; width: 100%; flex: 1 1 0; min-height: 0; box-shadow: none; border-radius: 0; background: transparent; align-self: stretch; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-shell .maincontant__section__list--body { flex: 1 1 0; min-height: 0; width: 100%; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-scroll { display: inline-block; max-height: 272px; overflow-y: auto; overflow-x: hidden; width: 100%; align-self: stretch; box-sizing: border-box; padding: 0; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-scroll .department-vacation-timeline-day dd { padding-bottom: 10px; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-shell .apply-list > li .apply-info dt strong { font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-shell .apply-list > li.resv-current .apply-info dt strong { color: var(--txt-color-p600); }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-item-card { background: var(--clr-n30); border: 0; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-item-card__row { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; width: 100%; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-item-card__row .department-vacation-timeline-item-card__main { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .department-vacation-timeline-item-card { display: flex; padding: 12px; align-items: center; gap: 8px; align-self: stretch; border-radius: 6px; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-name { color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-meta { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-empty-msg { margin: 0; padding: 12px 8px; color: var(--txt-color-t500); font-size: var(--txt-size-14); text-align: center; width: 100%; box-sizing: border-box; }
.attendance-work-stats-wrap #department-dashboard-vacation .department-vacation-timeline-empty .apply-info dd { padding-left: 0; align-items: center; }
.attendance-work-stats-wrap #department-dashboard-workhours .department-dept-trend-card .workstatus-chart-card__body--daily { min-height: 0; }
.attendance-work-stats-wrap #department-dashboard-workhours .department-dept-performance-in-workhours .department-dept-performance-chart { flex: 1 1 0; min-width: 0; min-height: 0; width: 100%; align-self: stretch; position: relative; box-sizing: border-box; }
.attendance-work-stats-wrap #department-dashboard-workhours #workhoursDeptTrendChart.workstatus-chart-card__body--daily > div:first-child,
.attendance-work-stats-wrap #department-dashboard-workhours .department-dept-performance-chart > div:first-child { width: 100% !important; height: 100% !important; min-height: 0 !important; }
.attendance-work-stats-wrap .department-vacation-timeline-scroll .department-vacation-timeline-day span { font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.department-table-section { display: flex; min-width: 900px; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 12px; background: var(--clr-w100); }

/* 테이블 패널 툴바: 탭(서브 네비) + 필터/검색 한 줄 */
.attendance-work-stats-wrap .department-table-toolbar-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; width: 100%; box-sizing: border-box; padding: 16px 24px; border-bottom: 1px solid var(--clr-w300); }
.attendance-work-stats-wrap .department-table-toolbar-row .department-table-toolbar-body { display: flex; align-items: center; gap: 8px; }
.attendance-work-stats-wrap .department-table-toolbar-row .attendance-request-history__title-row { padding: 0; border-bottom: none; }
.attendance-work-stats-wrap .department-table-toolbar-row .department-table-sub-nav { display: flex; justify-content: center; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-n30); margin-bottom: 0; padding-bottom: 0; }
.department-table-sub-nav { display: flex; justify-content: center; align-items: center; border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-n30); }
.department-table-sub-nav-btn { display: flex; height: 36px; min-width: 36px; max-width: 160px; padding: 0 16px; justify-content: center; align-items: center; gap: 10px; border-radius: 6px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t70);     }
.department-table-sub-nav-btn.active { color: var(--txt-color-p600); background: var(--clr-w100); border: 1px solid var(--clr-p600); }
#department-table-panels .department-table-panel { display: none; min-width: 900px; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 12px;  }
#department-table-panels .department-table-panel.active { display: flex; }
#department-table-panel-schedule .department-schedule-dashboard { display: flex; flex-direction: column; gap: 16px; }
.workhours-table .status-badge { min-width: 54px; }
.vacation-filter-buttons .inputform__row__colm.department_option input { width: 170px; padding-right: 30px; font-size: 14px; height: 30px; color: #5a6681; box-sizing: border-box; padding-left: 10px; border: 1px solid rgba(0, 0, 0, 0.1); }

#vacationDetailContent { display: flex; flex-flow: column; gap: 20px; overflow: hidden; overflow-y: auto; max-height: 65vh; }
.vacation-detail-badge { display: inline-flex; margin: 2px 6px; height: 24px; min-width: 54px; font-size: 12px; font-weight: 600; align-items: center; justify-content: center; padding: 0 4px; border-radius: 1px; line-height: 1; letter-spacing: -0.5px; color: #fff; opacity: 0.7; }
.vacation-detail-badge-type { background-color: #bdbdbd; }
.vacation-detail-badge-status.status-pending { background-color: #FF9800; }
.vacation-detail-badge-status.status-approved { background-color: #4CAF50; }
.vacation-detail-badge-status.status-rejected { background-color: #EF5350; }
.vacation-detail-badge-status.status-cancel { background-color: #9E9E9E; }
.vacation-detail-reason-cell { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; pointer-events: auto; position: relative; }

.overwork_pop_div { align-items: stretch; float: left; box-sizing: border-box; padding: 0; width: 100%; }
@media (max-width: 1600px) and (min-width: 0) {
    .attendance-sidebar-title { font-size: 28px; }
    .schedule-request-btn { font-size: 20px; }
}

.pop-close.workhoursActionManualPopupCloseBtn { position: absolute; top: 0; right: 0; width: 40px; height: 40px; padding: 5px; box-sizing: border-box; font-size: 0; background-image: url(../../images/connectplace/common/ico_close.png); background-position: center; background-repeat: no-repeat; background-size: 16px; }

/* Home layout */
.maincontant__section .maincontant__section-company { display: flex; justify-content: flex-end; align-items: flex-start; gap: 4px; align-self: stretch; color: var(--txt-color-t900); font-size: var(--txt-size-24); font-weight: var(--txt-weight-bold); }
.maincontant__section .maincontant__section-company .maincontant__section-company-icon { width: 40px; height: 40px; display: block; flex-shrink: 0; }

.profile-top { display: flex; align-items: center; align-self: stretch; gap: 16px; }
.maincontant__section__info--box-content .profile-top .last-name { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; font-family: var(--txt-font-family); font-size: var(--txt-size-40); font-style: var(--txt-font-style);font-weight: var(--txt-weight-bold); color: var(--txt-color-t100); letter-spacing: -0.32px; background-color: var(--clr-n80); border-radius: 50%; }
.profile-thumb { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; background-color: var(--clr-n80); border-radius: 50%; overflow: hidden; }
.profile-thumb::after { position: absolute; content: attr(data-fallback); font-family: var(--txt-font-family); font-size: var(--txt-size-40); font-style: var(--txt-font-style); font-weight: var(--txt-weight-bold); color: var(--txt-color-t100); letter-spacing: -0.28px; }
.profile-thumb img { width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.profile-right { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; flex: 1 0 0; min-width: 248px; }
.profile-right .profile-user-hello { display: flex; align-items: center; align-self: stretch; }
.profile-right strong { flex: 1 0 0; font-size: var(--txt-size-20); font-weight: var(--txt-weight-bold); color: var(--txt-color-t900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profile-right strong .profile-user-name { color: var(--txt-color-p600); }
.profile-right .profile-user-hello .profile-edit-btn { width: 24px; height: 24px; aspect-ratio: 1/1; background: url(../../../figma/svg/edit_bluegray_24.svg) no-repeat center; background-size: 24px 24px; cursor: pointer; }
.profile-right .profile-user-info { display: flex; flex-direction: column; gap: 8px; border-left: 2px solid var(--clr-n30); padding-left: 10px; flex: 1 0 0; }
.profile-right .profile-user-info-item { display: flex; align-items: center; gap: 6px; align-self: stretch; }
.profile-right .profile-user-info-icon { display: flex; align-items: center; flex-direction: column; justify-content: center; width: 24px; height: 24px; border-radius: 30px; background-color: var(--clr-n30); padding: 7px 6px; }
.profile-right .profile-user-info-icon-mail { background-image: url(../../../figma/svg/mail_bluegray_16.svg); background-repeat: no-repeat; background-position: center; background-size: 12px 12px; flex-shrink: 0; }
.profile-right .profile-user-info-icon-user { background-image: url(../../../figma/svg/user_single_bluegray_16.svg); background-repeat: no-repeat; background-position: center; background-size: 12px 12px; flex-shrink: 0; }
.profile-right .profile-user-email,
.profile-right .profile-user-title { flex: 1 0 0; color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profile-location { display: flex; align-items: center; align-self: stretch; gap: 8px; min-width: 88px; }

.maincontant__section__top-menu { display: flex; align-items: flex-start; gap: 22px; align-self: stretch; margin: -1px 0 0 -2px; justify-content: space-between; }
.home-quick-menu-viewport { position: relative; display: flex; flex: 1 1 0; overflow: hidden; min-width: 575px; max-width: 632px; }
.home-quick-slider-menu { display: flex; align-items: center; gap: 24px; flex: 1 0 0; overflow: visible; transform: translateX(0); transition: transform 0.28s ease; padding: 1px 2px 6px; }
.home-quick-slider-menu li { display: flex; width: 139px; height: 130px; flex-direction: column; justify-content: center; align-items: center; background: var(--clr-w100); border-radius: 12px; gap: 10px; box-shadow: var(--ds-e200); cursor: pointer; }
.home-quick-slider-menu li.is-disabled { opacity: .3; pointer-events: none; cursor: default; }
.home-quick-slider-menu li.is-disabled:hover { opacity: .3; }
.home-quick-slider-menu li.has-badge { position: relative; }
.home-quick-slider-menu li a { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-medium); text-align: center; width: 100%; padding: 13px 0; }
.home-quick-slider-menu li a .icon { display: flex; width: 60px; height: 60px; border-radius: 100px; padding: 16px 20px; background-color: var(--clr-n700); background-size: 32px 32px; justify-content: center; align-items: center; gap: 10px; flex-shrink: 0; aspect-ratio: 1/1; text-indent: -9999px; }
.home-quick-slider-menu li .menu-badge { display: none; position: absolute; right: 30px; top: 14px; width: 20px; height: 20px; aspect-ratio: 1/1; padding: 0 6px; border-radius: 999px; background-color: var(--clr-p600); color: var(--clr-w100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); text-align: center; box-sizing: border-box; z-index: 2; }
.home-quick-slider-menu li .menu-badge.show { display: flex; flex-direction: column; justify-content: center; }
.home-quick-slider-menu li a.menu .icon { background-image: url(../../images/connectplace/common/bn_icon00_R.png); }
.home-quick-slider-menu li a.menuDesk .icon { background-image: url(../../../figma/svg/mainmenu_seat_white_32.svg); }
.home-quick-slider-menu li a.menuRoom .icon { background-image: url(../../../figma/svg/mainmenu_meeting_white_32.svg); }
.home-quick-slider-menu li a.menuVisit .icon { background-image: url(../../../figma/svg/mainmenu_visit_white_32.svg); }
.home-quick-slider-menu li a.menuAttendance .icon { background-image: url(../../../figma/svg/mainmenu_schedule_white_32.svg); }
.home-quick-slider-menu li a.menuPlace .icon { background-image: url(../../../figma/svg/mainmenu_place_white_32.svg); }
.home-quick-slider-menu li a.menuConditioning .icon { background-image: url(../../../figma/svg/mainmenu_conditioning_white_32.svg); }
.home-quick-slider-menu li a.menuRest .icon { background-image: url(../../images/connectplace/common/bn_icon02_R.png); }
.home-quick-slider-menu li a.menuSleep .icon { background-image: url(../../images/connectplace/common/bn_icon02_R.png); }
.home-quick-slider-menu li a.menuPolicy .icon { background-image: url(../../../figma/svg/mainmenu_policy_white_32.svg); }
.home-quick-slider-menu li a.menuCrowded .icon { background-image: url(../../../figma/svg/mainmenu_schedule_white_32.svg); }
.home-quick-slider-menu li a.menuLocker .icon { background-image: url(../../../figma/svg/mainmenu_locker_white_32.svg); }
.home-quick-slider-menu-fade { position: absolute; top: 0; right: 0; width: 72px; height: 100%; background: linear-gradient(to right, rgba(248, 249, 252, 0), rgba(248, 249, 252, 0.6) 45%, #f8f9fb 100%); pointer-events: none; opacity: 0; transition: opacity 0.2s ease; }
.home-quick-slider-menu-fade.home-quick-slider-menu-fade-prev { left: 0; right: auto; background: linear-gradient(to left, rgba(248, 249, 252, 0), rgba(248, 249, 252, 0.6) 45%, #f8f9fb 100%); }

.home-quick-slider-menu-next { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 20px; background: var(--clr-w900a); box-shadow: var(--ds-e100); cursor: pointer; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; z-index: 3; }
.home-quick-slider-menu-prev { position: absolute; top: 50%; left: 10px; transform: translateY(-50%) rotate(180deg); display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 20px; background: var(--clr-w900a); box-shadow: var(--ds-e100); cursor: pointer; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; z-index: 3; }
.home-quick-slider-menu-prev img,
.home-quick-slider-menu-next img { width: 12px; height: 12px; display: block; }
.home-quick-menu-viewport.is-scrollable:not(.is-end) .home-quick-slider-menu-fade-next,
.home-quick-menu-viewport.is-scrollable:not(.is-end) .home-quick-slider-menu-next { opacity: 1; pointer-events: auto; }
.home-quick-menu-viewport.is-scrollable:not(.is-start) .home-quick-slider-menu-fade-prev,
.home-quick-menu-viewport.is-scrollable:not(.is-start) .home-quick-slider-menu-prev { opacity: 1; pointer-events: auto; }
.home-board-right-layout { display: flex; max-width: 302px; flex-flow: column; align-items: flex-start; gap: 16px; flex: 1 0 0; align-self: stretch; padding-right: 2px; }

.maincontant__section__list--container.home-board-layout { display: flex; justify-content: center; align-items: flex-start; gap: 24px; min-width: 0; flex: 1 0 0; align-self: stretch; }
.home-reservation-card { max-width: 950px; min-width: 575px; display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 1 0; background-color: var(--clr-w100); border-radius: 12px; box-shadow: var(--ds-e200); }

.home-reservation-card .maincontant__section__list--head { display: flex; height: 52px; padding: 0 10px; flex-direction: column; justify-content: center; align-items: center; gap: 8px; align-self: stretch; border-bottom: 1px solid var(--clr-w300) }
.home-reservation-card .maincontant__section__list--head .date-btn li { display: flex; position: relative; height: 36px; min-width: 80px; min-height: 36px; max-height: 36px; padding: 15px 16px; justify-content: center; align-items: center; gap: 4px; width: 100%; }
.home-reservation-card .maincontant__section__list--head .date-btn li + li::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 12px; border-left: 1px solid var(--clr-w300); }

.home-reservation-card .maincontant__section__list--head .date-btn li button { color: var(--txt-color-t70); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); padding: 11px 16px; text-wrap-mode: nowrap; }

.home-reservation-card .maincontant__section__list--head .date-btn li button.on {
	color: #1382f4;
	background: transparent;
}

.home-reservation-card .maincontant__section__list--head .date-btn li:last-child button {
	min-width: auto;
}

.home-reservation-card .maincontant__section__list--body { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .scroll { display: flex; padding: 0 20px; justify-content: center; align-items: flex-start; flex: 1 0 0; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list { position: relative; --home-timeline-end: 0px;  }
.home-reservation-card .maincontant__section__list--body .apply-list::before { content: ""; position: absolute; top: 0; bottom: 0; left: 4px; border-left: 2px dashed var(--clr-n50); z-index: 1; pointer-events: none; bottom: calc(100% - var(--home-timeline-end)); }
.home-reservation-card .maincontant__section__list--body .apply-list > li { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt { display: flex; position: relative; width: 120px; align-items: center; gap: 8px; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt span { padding-left: 18px; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt span { color: var(--txt-color-t900, #1F1F1F); font-family: var(--txt-font-family); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); line-height: var(--txt-line-height); letter-spacing: var(--txt-letter-spacing); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt::after { content: ""; position: absolute; left: 2px; top: 7px; width: 6px; height: 6px; margin: 0; border: 0; border-radius: 50%; background: var(--clr-w900); background-image: none !important; z-index: 2; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt::before { content: none !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-current .apply-info dt::after { background: var(--clr-p600) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-current .apply-info > dt > span { color: var(--txt-color-p600) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dt strong { font-size: 20px; font-weight: 600; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd { display: flex; padding-left: 16px; flex-direction: column; align-items: flex-start; gap: 10px; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply { display: flex; padding: 12px; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; border: 1px solid var(--clr-n100); border-radius: 6px; background: var(--clr-w100); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .apply-category { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 20px; border: 1px solid var(--clr-w800); color: var(--txt-color-t900); font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-category-row { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-wrap { position: relative; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-btn { display: flex; width: 20px; height: 20px; align-items: center; justify-content: center; background: transparent; border: 0; padding: 0; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-btn img { width: 16px; height: 16px; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-menu { display: none; position: absolute; top: 24px; right: 0; min-width: 80px; background: var(--clr-w100); border-radius: 6px; box-shadow: var(--ds-e400); overflow: hidden; z-index: 10; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-wrap.is-open .home-resv-more-menu { display: block; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-item { display: block; width: 130px; min-width: 80px; height: 36px; text-align: left; padding: 8px 16px; border: 0; gap: 8px; background: var(--clr-w100); color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-more-item.danger { color: var(--clr-r900); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .home-resv-inline-actions { display: flex; width: 100%; justify-content: flex-end; gap: 8px; }

.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply p { width: 281px; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply { background: var(--clr-n30) !important; border-color: var(--clr-n30) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply *,
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply h4 strong,
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply p,
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply h4 span { color: #8f95a4; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-past .apply .apply-category { border-color: var(--clr-w400) !important; color: var(--txt-color-t300) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-current .apply { border-color: var(--clr-p600) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li.resv-current .apply-info .apply-category { border-color: var(--clr-p600) !important; color: var(--txt-color-p600) !important; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .apply-content { display: flex; align-items: flex-end; gap: 8px; align-self: stretch; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .apply-content > div:first-child { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1 0 0; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .apply-content > div:first-child > div { display: flex; align-items: flex-start; gap: 4px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t70); }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .apply-content { position: relative; z-index: 1; }
.home-reservation-card .maincontant__section__list--body .apply-list > li .apply-info dd .apply .btn-wrap { position: relative; z-index: 2; }

.home-v2-sidebar-cards { display: flex; min-width: 0; max-width: 298px; flex-direction: column; align-items: flex-start; gap: 24px; flex: 1 1 0; align-self: stretch; margin-right: 2px; }
.reservation-summary-panel { display: flex; padding: 12px 0; align-items: center; align-self: stretch; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e200); }
.reservation-summary-panel dl { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; flex: 1 0 0; }
.reservation-summary-panel dl + dl { border-left: 1px solid var(--clr-w300); }
.reservation-summary-panel dt { font-size: var(--txt-size-14); color: var(--txt-color-t70); font-weight: var(--txt-weight-regular); }
.reservation-summary-panel dd { font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); color: var(--txt-color-p600); }
.reservation-summary-panel dd .tooltiptext { left: -16px !important; }
.period-reservation-card { display: flex; flex-direction: column; align-items: flex-start; flex: 1 0 0; align-self: stretch; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e200); max-height: 693px; }
.period-reservation-title { display: flex; height: 52px; padding: 0 20px; justify-content: flex-start; align-items: center; gap: 8px; align-self: stretch; color: var(--txt-color-t900); font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); border-bottom: 1px solid var(--clr-w300); }

.period-reservation-card .maincontant__section__list--aside { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item { display: flex; padding: 0 20px; flex-direction: column; align-items: flex-start; align-self: stretch; border-bottom: 1px solid var(--clr-w300); max-height: 300px; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item dl { display: flex; flex-direction: column; align-self: stretch; max-height: 44px; min-height: 44px; overflow: hidden; transition: max-height .28s ease; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item.active { max-height: 332px; }
.maincontant__section__list--container .maincontant__section__list--aside .sidebar-card-item.active dl { max-height: 332px; min-height: 0; }
.period-reservation-card .maincontant__section__list--aside .sidebar-card-item.active dl { max-height: none; flex: 1 1 auto; min-height: 0; }
.maincontant__section__list--container .maincontant__section__list--body .apply-list { display: flex; padding: 20px 0; flex-direction: column; align-items: flex-start; gap: 12px; flex: 1 0 0; align-self: stretch; }

.attendance_status_actions { overflow: visible; }
.attendance_status_actions #checkoutButton .tooltiptext { left: auto; right: 0; }
.attendance_status_actions #checkoutButton .tooltiptext::after { left: auto; right: 16px; }

.attendance_status_flags i .tooltiptext { left: auto; right: 0; }
.attendance_status_flags i .tooltiptext::after { left: auto; right: 16px; top: -5px; }

.maincontant__section__info--weather i .tooltiptext { max-width: 320px; z-index: 10002; }
.maincontant__section__info--weather span .tooltiptext { max-width: 320px; z-index: 10002; left: -50px; }
.maincontant__section__info--weather span .tooltiptext::after { left: 67px; top: -5px; }

.maincontant__section__list--body .scroll .apply-list .apply-info .apply .apply-content .tooltiptext { max-width: 320px; z-index: 10002; }

.home-v2-sidebar-cards .reservation-summary-panel .reservation-count .tooltiptext { left: -17px; max-width: 320px; z-index: 10002; }

.layer-pop-wrap .layer-pop-area.team-list-pop { width: 640px; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont { border-radius: 6px; border: 1px solid var(--clr-w300); background: var(--clr-w100); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap { display: flex; padding: 16px 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; align-self: stretch; border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap .pop-cont-title { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap #teamListPopupTitleNm { flex: 1 0 0; color: var(--txt-color-t900); font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); line-height: var(--txt-line-height); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap .team-list-pop-count { display: flex; align-items: center; gap: 4px; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap .team-list-pop-count > span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; color: var(--txt-color-t900); font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont .pop-cont-title-wrap .team-list-pop-count #teamListCount { color: var(--txt-color-p600); font-weight: var(--txt-weight-semibold); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent { display: flex; height: 466px; flex-direction: column; align-items: flex-start; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-head { flex-shrink: 0; width: 100%; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle { width: 100%; border-collapse: collapse; table-layout: fixed; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle thead th { text-align: left; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); background: var(--clr-w200); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle tbody td { font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); background: var(--clr-w100); border-bottom: 1px solid var(--clr-w300); }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle .table-col-chk { width: 18px; height: 44px; padding: 0 12px 0 24px; align-items: center; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle thead th.table-col-chk { text-align: center; vertical-align: middle; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle thead th.table-col-chk .team-list-select-all-checkbox { vertical-align: middle; cursor: pointer; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle .table-col-name { width: 116px; height: 44px; padding: 0 12px; align-items: center; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle .table-col-title { width: 96px; height: 44px; padding: 0 12px; align-items: center; gap: 12px; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle .table-col-dept { height: 44px; padding: 0 24px 0 12px; align-items: center; gap: 12px; flex: 1 0 0; }

.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .team-list-popup-table-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; min-width: 0; width: 100%; overflow: hidden; box-sizing: border-box; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle #teamListBody .team-member-namecell { display: flex; width: 116px; height: 48px; align-items: center; gap: 8px; align-self: stretch; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle tbody td .team-member-avatar { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--clr-n80); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t100); flex-shrink: 0; }
.layer-pop-wrap .layer-pop-area.team-list-pop .pop-cont #teamListPopupContent .tableStyle tbody td .team-member-nametext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

/* 근태 현황 공통 레이아웃 (근무시간·연차 등 페이지에서 공유, 클래스 접두사 workstatus-) */
.workstatus_container_wrap { display: flex; flex-direction: column; align-items: stretch; gap: 24px; align-self: stretch; width: 100%; min-width: 936px; box-sizing: border-box; flex-shrink: 0; }
.workstatus-dashboard { display: flex; padding: 20px; align-items: flex-start; align-content: flex-start; gap: 20px; align-self: stretch; flex-wrap: wrap; border-radius: 12px; background: var(--clr-p90); }

.workstatus-page-head { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; }

.workstatus-dashboard__summary_wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; flex: 1 0 0; }
.workstatus-dashboard__summary-head { display: flex; justify-content: center; align-items: center; gap: 16px; align-self: stretch; }
.workstatus-dashboard__title { height: 24px; flex: 1 0 0; font-size: var(--txt-size-16); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.workstatus-dashboard__summary { display: flex; padding: 20px; justify-content: center; align-items: flex-start; align-content: flex-start; gap: 24px 16px; align-self: stretch; flex-wrap: wrap; border-radius: 12px;  background: var(--clr-w100); box-shadow: var(--ds-e200); }
.workstatus-ov-badge { display: flex; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; align-items: center; gap: 4px;  border-radius: 12px; background: transparent; font-size: var(--txt-size-12); font-weight: var(--txt-weight-medium);  color: transparent; }
.workstatus-ov-badge__dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.workstatus-ov-badge--ok { background: var(--clr-g000); color: var(--clr-g900); }
.workstatus-ov-badge--ok .workstatus-ov-badge__dot { background: var(--clr-g900); }
.workstatus-ov-badge--caution { background: var(--clr-y000); color: var(--clr-y900); }
.workstatus-ov-badge--caution .workstatus-ov-badge__dot { background: var(--clr-y900); }
.workstatus-ov-badge--danger { background: var(--clr-r000); color: var(--clr-r900); }
.workstatus-ov-badge--danger .workstatus-ov-badge__dot { background: var(--clr-r900); }

.workstatus-dashboard__summary .workstatus-dashboard__summary_top { display: flex; align-items: flex-start; gap: 16px; }
.workstatus-dashboard__summary .workstatus-dashboard__summary_bottom { display: flex; width: 420px; height: 120px; align-items: flex-start; gap: 16px; }
.workstatus-dashboard__summary_top .workstatus-mini-card-wrap { display: flex; width: 200px; height: 120px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; }
.workstatus-dashboard__summary_bottom .workstatus-mini-card-wrap { display: flex; width: 200px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; align-self: stretch; }
.workstatus-dashboard__summary_top .workstatus-mini-card { display: flex; padding: 0 16px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; flex: 1 0 0; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
.workstatus-dashboard__summary_top .vacation-urging-card { display: flex; padding: 0 12px; align-items: center; gap: 16px; flex: 1 0 0; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
.workstatus-dashboard__summary_top .vacation-urging-card .vacation-urging-card__value-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; }
.workstatus-dashboard__summary_bottom .workstatus-mini-card { display: flex; padding: 0 16px; align-items: center; gap: 12px; flex: 1 0 0; align-self: stretch; border-radius: 6px; background: var(--clr-n30); }
.workstatus-mini-card__label-wrap { display: flex; align-items: center; gap: 12px; align-self: stretch; }
.workstatus-dashboard__summary_top .workstatus-mini-card__label { flex: 1 0 0; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.workstatus-dashboard__summary_bottom .workstatus-mini-card__label { font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.workstatus-mini-card__value { font-size: var(--txt-size-20); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
.workstatus-mini-card__value #remainingVacationDays { color: var(--clr-n600); }
.workstatus-mini-card__value #pendingApprovalCount { color: var(--clr-n600); }
.workstatus-mini-card__value small { font-size: var(--txt-size-16); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.workstatus-mini-card__value--accent { color: var(--txt-color-p600); }
.workstatus-mini-card__value--danger { color: var(--clr-r900); }
.workstatus-mini-card__value .workstatus-week-hours-value--ok { color: var(--txt-color-p600); }
.workstatus-mini-card__value .workstatus-week-hours-value--warn { color: var(--clr-y900); }
.workstatus-mini-card__value .workstatus-week-hours-value--danger { color: var(--clr-r900); }
.workstatus-mini-card__value .workstatus-month-hours-value--ok { color: var(--txt-color-p600); }
.workstatus-mini-card__value .workstatus-month-hours-value--warn { color: var(--clr-y900); }
.workstatus-mini-card__value .workstatus-month-hours-value--danger { color: var(--clr-r900); }
.workstatus-mini-card__value .workstatus-avg-daily-value--ok { color: var(--txt-color-p600); }
.workstatus-mini-card__value .workstatus-avg-daily-value--warn { color: var(--clr-y900); }
.workstatus-mini-card__value .workstatus-avg-daily-value--danger { color: var(--clr-r900); }
.workstatus-mini-card__value .workstatus-overtime-value--ok { color: var(--txt-color-p600); }
.workstatus-mini-card__value .workstatus-overtime-value--warn { color: var(--clr-y900); }
.workstatus-mini-card__value .workstatus-overtime-value--danger { color: var(--clr-r900); }
.workstatus-mini-card__bar_wrap { display: flex; height: 21px; align-items: center; gap: 8px; align-self: stretch; }
.workstatus-mini-card__bar { display: flex; height: 12px; min-width: 120px; flex-direction: column; align-items: flex-start; gap: 4px; flex: 1 0 0; border-radius: 10px; background: var(--clr-w300); }
.workstatus-mini-card__bar-fill { height: 100%; border-radius: 10px; transition: width 0.35s ease; }
.workstatus-mini-card__bar-fill--week.safe { background: var(--clr-p600); }
.workstatus-mini-card__bar-fill--week.warning { background: var(--clr-y900); }
.workstatus-mini-card__bar-fill--week.danger { background: var(--clr-r900); }
.workstatus-mini-card__bar-fill--month.safe { background: var(--clr-p600); }
.workstatus-mini-card__bar-fill--month.warning { background: var(--clr-y900); }
.workstatus-mini-card__bar-fill--month.danger { background: var(--clr-r900); }
.workstatus-mini-card__hint { font-size: var(--txt-size-14); color: var(--txt-color-t700); font-weight: var(--txt-weight-regular); display: flex; align-items: center; gap: 4px; margin-top: 2px; }
.workstatus-mini-card__hint #pendingApplicationDate { color: var(--txt-color-t70); }
.vacation-grant-date { display: flex;
    align-items: center;
    gap: 8px; color: var(--txt-color-t70); text-align: center; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); }
.vacation-remain-info-wrap { display: flex; justify-content: space-between; align-items: center; align-self: stretch; font-size: var(--txt-size-14); color: var(--txt-color-t700); font-weight: var(--txt-weight-regular); }
.vacation-remain-info-wrap #expirationDDay,
.vacation-remain-info-wrap #vacationExpirationDDay { display: flex; height: 20px; min-width: 50px; min-height: 20px; max-height: 20px; padding: 0 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: var(--clr-w800); font-size: var(--txt-size-12); color: var(--txt-color-t100); font-weight: var(--txt-weight-medium); }
.workstatus-mini-card__percent { font-size: var(--txt-size-12); color: var(--txt-color-t70); font-weight: var(--txt-weight-regular);  margin-top: 2px; }
.workstatus-info-icon { width: 16px; height: 16px; background: url("../../../figma/svg/info_filled_bluegray_24.svg") no-repeat center / 16px; flex-shrink: 0; }
/* GNB Header.cshtml 과 동일 클래스(.user.tooltip + .tooltip-text) — 근태 현황 카드에서만 표시·호버 (GNB는 .header-icon 범위) */
.attendance-work-stats-wrap .user.tooltip { position: relative; display: inline-flex; align-items: center; flex-shrink: 0; cursor: default; vertical-align: middle; overflow: visible; z-index: 4; }
.attendance-work-stats-wrap button.user.tooltip.department-dept-overtime-info-trigger { border: none; background: transparent; padding: 0; margin: 0; font: inherit; color: inherit; cursor: pointer; -webkit-appearance: none; appearance: none; }
.attendance-work-stats-wrap button.user.tooltip.department-dept-overtime-info-trigger:focus-visible { outline: 2px solid var(--clr-p600, #1382f4); outline-offset: 2px; }
.attendance-work-stats-wrap .user.tooltip .tooltip-text { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); display: flex; align-items: flex-start; justify-content: flex-start; box-sizing: border-box; min-height: auto; max-width: 280px; width: max-content; font-family: var(--txt-font-family); font-size: var(--txt-size-12); font-style: var(--txt-font-style); font-weight: var(--txt-weight-regular); color: var(--txt-color-t100); letter-spacing: -0.24px; padding: 10px; margin-top: 11px; white-space: normal; text-align: left; word-break: keep-all; line-height: 1.45; background-color: var(--clr-w800); border-radius: 6px; opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0.2s ease; z-index: 50; pointer-events: none; }
.attendance-work-stats-wrap .user.tooltip .tooltip-text::after { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); content: ""; width: 12px; height: 6px; background: url("../../../figma/svg/tooltip_arrow_up.svg") no-repeat center / contain; }
.attendance-work-stats-wrap .user.tooltip:hover .tooltip-text { visibility: visible; opacity: 1; }

.workstatus-chart-wrap { display: flex; flex: 1 0 0; align-items: stretch; gap: 20px; height: 348px; }
.workstatus-chart-card { display: flex; flex: 1 0 0; padding: 16px 24px; width: 480px; height: 348px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 12px; background: var(--clr-w100); box-shadow: var(--ds-e200); }
@media (max-width: 1400px) and (min-width: 0px) {
    .workstatus-chart-card { width: 438px; } 
}  
.workstatus-chart-card__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.workstatus-chart-card__head h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--txt-color-t900, #212121); letter-spacing: -0.02em; }
.workstatus-chart-card__head h3 small { font-size: 12px; font-weight: 500; color: var(--txt-color-t500, #757575); }
.workstatus-chart-card__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 11px; color: var(--txt-color-t500, #757575); }
.workstatus-chart-card__legend span { display: inline-flex; align-items: center; gap: 4px; }
.workstatus-chart-card__body { flex: 1; min-height: 280px; width: 100%; }
.workstatus-chart-card--daily,
.workstatus-chart-card--weekly { align-items: stretch; min-height: 348px; gap: 12px; max-height: 348px;
    box-sizing: border-box;
    overflow: hidden; }
.workstatus-chart-card__head--title-only { width: 100%; justify-content: flex-start; margin-bottom: 0; flex-shrink: 0; }
#weeklyWorkHoursChart.workstatus-chart-card__body--daily,
.workstatus-chart-card__body--daily,
.workstatus-chart-card__body--weekly,
#monthlyWorkHoursChart.workstatus-chart-card__body--weekly,
#monthlyVacationChart.workstatus-chart-card__body--daily,
#vacationMonthlyChart.workstatus-chart-card__body--daily,
#vacationTypeChart.workstatus-chart-card__body--weekly,
#vacationTypeDonutChart { flex: 1 1 0; min-height: 0; min-width: 0; width: 100%; max-width: 100%; height: 100%; align-self: stretch; position: relative; box-sizing: border-box; }
#weeklyWorkHoursChart.workstatus-chart-card__body--daily > div:first-child,
#monthlyWorkHoursChart.workstatus-chart-card__body--weekly > div:first-child,
#monthlyVacationChart.workstatus-chart-card__body--daily > div:first-child,
#vacationMonthlyChart.workstatus-chart-card__body--daily > div:first-child,
#vacationTypeChart.workstatus-chart-card__body--weekly > div:first-child,
#vacationTypeDonutChart > div:first-child { width: 100% !important; height: 100% !important; min-height: 0 !important; }
.workstatus-daily-chart-legend,
.workstatus-weekly-chart-legend { display: flex; justify-content: space-between; align-items: center; align-self: stretch; }
.workstatus-daily-chart-legend__item--ref { display: flex; align-items: center; gap: 8px; color: var(--clr-n70); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
.workstatus-daily-chart-legend__item--bar { display: flex; align-items: center; gap: 4px; color: var(--txt-color-t500); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
.workstatus-daily-chart-legend__icon--circle { width: 6px; height: 6px; border-radius: 50%; background: var(--clr-n70); }
.workstatus-weekly-chart-legend__icon--circle { width: 6px; height: 6px; border-radius: 50%; background: var(--clr-n70); }
.workstatus-daily-chart-legend__icon--rect { width: 12px; height: 12px; border-radius: 4px; background: var(--clr-n300); }
.workstatus-monthly-vacation-legend-types { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 12px; max-width: 75%; min-width: 0; }
.workstatus-monthly-vacation-legend__item { display: inline-flex; align-items: center; gap: 4px; color: var(--txt-color-t500); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); }
.workstatus-monthly-vacation-legend__swatch { display: block; width: 12px; height: 12px; border-radius: 4px; flex-shrink: 0; }
.workstatus-weekly-chart-legend__ref { display: inline-flex; align-items: center; gap: 8px; color: var(--clr-n70); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); flex-shrink: 0; }
.workstatus-month-chart-legend__icon--rect { width: 12px; height: 12px; border-radius: 4px; }
.wh-leg--ok .workstatus-month-chart-legend__icon--rect { background: var(--clr-g900); }
.wh-leg--warn .workstatus-month-chart-legend__icon--rect { background: var(--clr-y900); }
.wh-leg--danger .workstatus-month-chart-legend__icon--rect { background: var(--clr-r900); }
.workstatus-weekly-chart-legend .workstatus-chart-card__legend { display: flex; align-items: center; gap: 8px; }
.workstatus-weekly-chart-legend--vacation-type { flex-direction: column; align-items: stretch; gap: 12px; }
.workstatus-vacation-type-legend-grid { display: flex; flex-direction: row; align-items: flex-start; justify-content: stretch; gap: 16px 24px; width: 100%; }
.workstatus-vacation-type-legend__col { flex: 1 1 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.workstatus-vacation-type-legend__row { display: flex; flex-direction: row; align-items: center; gap: 8px; min-width: 0; font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); color: var(--txt-color-t500); }
.workstatus-vacation-type-legend__swatch { display: block; width: 12px; height: 12px; border-radius: 4px; flex-shrink: 0; }
.workstatus-vacation-type-legend__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workstatus-vacation-type-legend__value { flex-shrink: 0; margin-left: 8px; font-variant-numeric: tabular-nums; color: var(--txt-color-t900); font-weight: var(--txt-weight-medium); }

/* 근무시간 현황 — 출퇴근 기록 (카드 레이아웃은 신청내역과 유사, 테이블은 display:table 유지 — flex 행/셀은 rowspan/colspan 무시됨) */
.attendance-work-stats-wrap.attendance-request-history { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; width: 100%; max-width: 100%; margin-top: 20px; }
.attendance-work-stats-wrap .attendance-request-history__body-wrap { display: flex; width: 100%; max-width: 100%; min-width: 0; flex-direction: column; align-items: stretch; align-self: stretch; box-sizing: border-box; border-radius: 12px; border: 1px solid var(--clr-w300); background: var(--clr-w100); overflow: hidden; }
.attendance-work-stats-wrap .workstatus-record-history__toolbar-strip { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }
.attendance-work-stats-wrap .attendance-request-history__title-row { display: flex; padding: 16px 24px; flex-direction: column; align-items: stretch; gap: 16px; align-self: stretch; width: 100%; box-sizing: border-box; border-bottom: 1px solid var(--clr-w300); }
.attendance-work-stats-wrap .attendance-request-history__title-row--with-filter { flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 16px; }
.attendance-work-stats-wrap .vacation-table-title-group { display: flex; align-items: center; gap: 16px; min-width: 0; }
.attendance-work-stats-wrap .vacation-table-title-group .listTotal { display: inline-flex; align-items: center; gap: 4px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); }
.attendance-work-stats-wrap .vacation-table-title-group .listTotal p { margin: 0; color: var(--txt-color-p600); font-size: var(--txt-size-14); font-weight: var(--txt-weight-semibold); line-height: 1; }
.attendance-work-stats-wrap .attendance-request-history__filter.vacation-application-filter { display: flex; align-items: center; flex-shrink: 0; margin-left: auto; }
.attendance-work-stats-wrap .vacation-application-filter .attendance-request-history__select,
.attendance-work-stats-wrap .vacation-application-filter .vacation-application-filter__select { min-width: 148px; height: 36px; padding: 0 32px 0 12px; border: 1px solid var(--clr-w300); border-radius: 6px; font-size: var(--txt-size-14); font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); background: var(--clr-w100); box-sizing: border-box; cursor: pointer; -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235A6681' d='M3 4.5L6 7.5L9 4.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; }
.attendance-work-stats-wrap .attendance-request-history__section-title { margin: 0; font-size: var(--txt-size-18); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t900); }
/* rowspan/colspan: 표준 table 레이아웃(.workstatus-attendance-record-table) — 부모 flex에서 width 100% 필수 */
.attendance-work-stats-wrap .attendance-request-history__table-wrap { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; gap: 0; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow-x: auto; }
/* 근무일정: 바깥 table-wrap은 가로 스크롤 안 함 — 이중 스크롤·스크롤 끝에서 테이블 흔들림 방지 */
.attendance-work-stats-wrap .attendance-request-history__table-wrap.department-schedule-table-wrap { overflow-x: hidden; overscroll-behavior-x: none; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table { display: table; width: 100%; max-width: 100%; min-width: 720px; border-collapse: collapse; border-spacing: 0; table-layout: auto; box-sizing: border-box; font-size: var(--txt-size-14); color: var(--txt-color-t900); }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table thead,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table thead { display: table-header-group; font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table tbody,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody { display: table-row-group; font-weight: var(--txt-weight-regular); }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table thead tr,
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table tbody tr,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table thead tr,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody tr { display: table-row; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table thead th,
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table tbody td,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table thead th,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td { display: table-cell; box-sizing: border-box; vertical-align: middle; border-bottom: 1px solid var(--clr-w300); word-break: break-word; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table thead th,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table thead th { height: 44px; text-align: start; background: var(--clr-w200); font-weight: var(--txt-weight-semibold); color: var(--txt-color-t500); }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table tbody td,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td { height: 48px; font-weight: var(--txt-weight-regular); color: var(--txt-color-t900); }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: normal; max-width: 0; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--no { padding: 0 12px 0 24px; width: 48px; max-width: 56px; white-space: nowrap; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--date { padding: 0 12px; min-width: 120px; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--clock { padding: 0 12px; min-width: 100px; white-space: nowrap; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--hours { padding: 0 12px; min-width: 100px; white-space: nowrap; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--status { padding: 0 12px; min-width: 80px; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--type { padding: 0 12px; min-width: 100px; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--correction { padding: 0 24px 0 12px; min-width: 180px; }
.attendance-work-stats-wrap #statusAttendanceTable.workstatus-attendance-record-table .workstatus-record--correction .correction-request-cell { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--no { padding: 0 12px 0 12px; width: 48px; max-width: 56px; min-width: 48px; white-space: nowrap; text-align: center; font-variant-numeric: tabular-nums; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-req { padding: 0 12px; min-width: 100px; white-space: nowrap; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-start,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-end { padding: 0 12px; min-width: 120px; white-space: nowrap; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-days { padding: 0 12px; width: 65px; white-space: nowrap; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-type { padding: 0 12px; width: 100px; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-reason { padding: 0 12px; min-width: 120px; max-width: 240px; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-approver { padding: 0 12px; min-width: 80px; max-width: 120px; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-approval-dt { padding: 0 12px; min-width: 100px; white-space: nowrap; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .workstatus-record--vac-status { padding: 0 24px 0 12px; max-width: 100px; }
/* 연차 신청 — 사유 툴팁이 아래 행(td)에 가려짐 → 호버 시 해당 tr을 스택 상단으로 */
/* --- CSS4 설정(:has) 별도 분리 ---
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody tr:has(.attendance-request-history__reason-tooltip:hover) { position: relative; z-index: 100; }*/
/* 연차 신청 — 사유: Request 페이지와 동일 말줄임·툴팁(.is-truncated 시에만 표시) */
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason { overflow: visible; white-space: normal; text-overflow: clip; max-width: 290px; display: flex; align-items: center; min-width: 0; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason .tooltip.attendance-request-history__reason-tooltip { flex: 1 1 0; min-width: 0; align-self: stretch; position: relative; z-index: 2; overflow: visible; display: flex; align-items: center; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason .tooltip.attendance-request-history__reason-tooltip .attendance-request-history__cell-ellipsis { flex: 1 1 0; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table tbody td.workstatus-record--vac-reason > .attendance-request-history__cell-ellipsis { align-self: center; flex: 1 1 0; min-width: 0; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:hover { z-index: 120; }
/* 테이블 랩퍼 overflow-x: auto 가 세로로도 클리핑해, 위쪽(top/bottom:100%) 툴팁이 헤더에 잘림 → 셀 아래로 표시 */
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext { position: absolute; left: 50%; right: auto; top: 100%; bottom: auto; transform: translateX(-50%); margin-top: 8px; margin-bottom: 0; margin-right: 0; width: max-content; max-width: min(250px, calc(100vw - 48px)); min-width: 0; box-sizing: border-box; padding: 10px; border-radius: 6px; background-color: var(--clr-w800); color: var(--txt-color-t100); font-size: var(--txt-size-12); font-weight: var(--txt-weight-regular); line-height: 1.5; text-align: left; letter-spacing: var(--txt-letter-spacing); box-shadow: var(--ds-e300); -webkit-box-shadow: var(--ds-e300); z-index: 130; pointer-events: none; word-break: break-word; overflow-wrap: break-word; display: block; align-items: unset; justify-content: unset; flex-flow: unset; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::before { content: ""; position: absolute; left: 50%; top: -6px; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; margin-top: 0; background-color: rgba(0, 0, 0, 0.27); clip-path: polygon(50% 0%, 0% 100%, 100% 100%); filter: blur(1.5px); -webkit-filter: blur(1.5px); opacity: 0.55; z-index: -2; transform: none; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip .tooltiptext::after { content: ""; position: absolute; left: 50%; top: -6px; bottom: auto; right: auto; width: 12px; height: 6px; margin-left: -6px; background-color: var(--clr-w800); clip-path: polygon(50% 0%, 0% 100%, 100% 100%); z-index: -1; transform: none; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:hover .tooltiptext { transform: translateX(-50%); transition: opacity 0.2s ease, visibility 0.2s ease; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip.is-truncated:hover .tooltiptext { visibility: visible !important; opacity: 1 !important; }
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated) .tooltiptext,
.attendance-work-stats-wrap #vacationApplicationTable.workstatus-attendance-record-table .tooltip.attendance-request-history__reason-tooltip:not(.is-truncated):hover .tooltiptext { visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.attendance-work-stats-wrap #statusAttendancePagination,
.attendance-work-stats-wrap #vacationTablePagination { display: flex; padding: 20px 0; justify-content: center; align-items: flex-start; align-content: flex-start; align-self: stretch; flex-wrap: wrap; }
/* 근무시간 현황 — 출퇴근 기록 테이블 페이징 (우측 정렬, 첫/이전/번호/다음/끝) */
.attendance-work-stats-wrap .workstatus-attendance-paging { display: flex; align-items: center; gap: 12px; }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon { flex: 0 0 auto; width: 32px; height: 32px; padding: 0; margin: 0; border: none; border-radius: 6px; background-color: transparent; cursor: pointer; box-sizing: border-box; -webkit-appearance: none; appearance: none; }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon.first-page { mask: url("../../../figma/svg/pagenation_start_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_start_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon.prev-page { mask: url("../../../figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_previous_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon.next-page { mask: url("../../../figma/svg/pagenation_next_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_next_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon.last-page { mask: url("../../../figma/svg/pagenation_end_16.svg") no-repeat center / 16px; -webkit-mask: url("../../../figma/svg/pagenation_end_16.svg") no-repeat center / 16px; background-color: var(--clr-w800); }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon:not(:disabled):hover { opacity: 0.75; }
.attendance-work-stats-wrap .workstatus-attendance-paging .workstatus-attendance-paging__icon:disabled { cursor: default; background-color: var(--clr-w400); opacity: 1; }
.attendance-work-stats-wrap .workstatus-attendance-paging .num-page { display: flex; align-items: center; gap: 4px; margin: 0 8px; }
.attendance-work-stats-wrap .workstatus-attendance-paging .num-page .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 6px; margin: 0; border: none; border-radius: 8px; background: transparent; box-sizing: border-box; font-size: var(--txt-size-14); font-weight: var(--txt-weight-medium); color: var(--txt-color-t900); line-height: 1; cursor: pointer; font-family: inherit; -webkit-appearance: none; appearance: none; }
.attendance-work-stats-wrap .workstatus-attendance-paging .num-page .page-link.active { color: var(--txt-color-t100); background-color: var(--clr-w800); cursor: default; }
.attendance-work-stats-wrap .workstatus-attendance-paging .num-page button.page-link:hover:not(.active) { color: var(--txt-color-t700); }

/*공간사용현황*/
.dashboard-space-pop { display: none; position: fixed; inset: 0; z-index: 10000; }
.dashboard-space-pop.active { display: block; }