body { margin: 0 auto; height: 100%; background: #F5F5F5; }

/* header */
.main-hd { height: 50px; background: #4A4A4A; }
.main-hd-in { position: relative; width: 90%; margin: 0 auto; height: 50px; display: flex; justify-content: center; align-items: center; }
.main-hd-in .hd-menu { cursor: pointer; position: absolute; left: 0; width: 24px; height: 24px; }
.main-hd-in .hd-nm { color: #FFF; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 600; line-height: normal; }

/* logo.html */
.logo-wrap { width: 100%; max-width: 1024px; margin: 0 auto; height: 100%; display: flex; justify-content: center; align-items: center; background-color: #FFF; } 
.logo-in { width: 100%; display: flex; justify-content: center; align-content: center; } 
.login-wrap { width: 90%; } 
.info-title { margin-bottom: 36px; text-align: center; color: var(--w-fontcolor, #5E5E71); font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; letter-spacing: -0.1px; } 
.login-info-in p { margin-top: 10px; margin-bottom: 6px; color: var(--w-fontcolor, #5E5E71); font-feature-settings: 'clig' off, 'liga' off; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 400; line-height: 22px; letter-spacing: -0.1px; } 
.login-info-in input { margin-top: 10px; padding-left: 10px; width: calc(100% - 10px); height: 46px; margin: 0 auto; border-radius: 3.5px; border: 0px solid #202224; background: var(--w-inputcolor, #F5F5F5); } 
.btn { cursor: pointer; display: flex; justify-content: center; align-items: center; margin-top: 30px; width: 100%; height: 46px; border-radius: 3.5px; border: 0px solid #202224; background: #254b86; color: #FFF; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 600; line-height: 22px; letter-spacing: -0.1px; } 

/* menu */
.menu { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.3); z-index: 1000; z-index: -1; opacity: 0; }
.show-use { opacity: 1; z-index: 999; transition: all 0.5s; } 
.window { position: relative; width: 100%; height: 100%; }  
.popup { position: absolute; top: 0; left: 0; background-color: #ffffff; box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3); width: 75%; height: 100vh; }
.popup-in { width: 90%; height: calc(100vh - 68px); padding: 34px 0 34px 0; margin: 0 auto; }
.popup-hd { position: relative; display: flex; align-items: center; margin-bottom: 24px; }
.popup-hd p { color: var(--main, #2F9BF2); font-family: Inter; font-size: 20px; font-style: normal; font-weight: 800; line-height: normal; padding-bottom: 4px; }
.popup-close { position: absolute; right: 0; cursor: pointer; width: 20px; height: 20px; }
.p-menu { height: 50px; display: flex; align-items: center; border-radius: 4px; padding: 10px; border-bottom: 1px solid #E8E8E8; margin-bottom: 13px; }
.p-menu img { width: 24px; height: 24px; margin-right: 10px; }
.p-menu p { margin-left: 34px; cursor: pointer; color: #3D3D3D; text-align: center; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 500; line-height: normal; }
.p-menu-on { background: #E9F0F5; }
.p-menu-on p { color: var(--main, #2F9BF2); }
.p-menu-inner { display: flex; }
.p-sub-menu { display: none; width: calc(100% - 80px); margin: 0 auto; margin-bottom: 13px; }
.p-sub-menu p { cursor: pointer; color: #3D3D3D; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 500; line-height: 180% }
.p-menu-schedule { background-image: url(../img/ico_menu_schedule.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-bcnc { background-image: url(../img/ico_work.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-item { background-image: url(../img/ico_menu_item.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-empl { background-image: url(../img/ico_menu_empl.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-schedule-on { background-image: url(../img/ico_menu_schedule_on.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-bcnc-on { background-image: url(../img/ico_work_on.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-item-on { background-image: url(../img/ico_menu_item_on.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-empl-on { background-image: url(../img/ico_menu_empl_on.png); background-repeat: no-repeat; background-size: 24px 24px; background-position: 10px 50%; }
.p-menu-schedule-on p, .p-menu-bcnc-on p, .p-menu-item-on p, .p-menu-empl-on p { color: var(--main, #2F9BF2); font-weight: 600; }

/* search */
.search-wrap { height: 45px; border-bottom: 1px solid #EFEFEF; background: #FFF; display: flex; justify-content: center; align-items: center; }
.search-in { width: 90%; margin: 0 auto; display: flex; justify-content: center; align-items: center; }
.search-in input { padding-left: 10px; padding-right: 10px; height: 30px; border-radius: 4px; border: 1px solid var(--line, #E2E8F0); background: #FFF; color: var(--font-color, #A7A7A7); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 500; line-height: 150%; }
.search-in .in-date { width: calc( (100% - 130px) / 2 ); }
.search-in .in-date-wave { margin-right: 0px; padding-left: 7px; padding-right: 7px; color: var(--font-color, #A7A7A7); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 500; line-height: 150%; } 
.search-btn { margin-left: 4px; cursor: pointer; display: flex; justify-content: center; align-items: center; width: 60px; height: 30px; border-radius: 4px; background: var(--main, #2F9BF2); color: #FFF; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 600; line-height: normal; }
.search-btn.clicked { background: var(--main, #2085d8); }
/* calendar 아이콘 변경 */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-inner-spin-button { display: none; appearance: none; }
input[type="date"]::-webkit-calendar-picker-indicator { color: rgba(0, 0, 0, 0); opacity: 1; display: block; background: url('../img/ico_calendar.png') no-repeat 99% 50%; background-size: 17px 17px; }

/* schedule_delivery.html */
.main { height: calc(100vh - 116px); overflow: scroll; margin: 10px 0 10px 0; }
.main-in { cursor: pointer; display: flex; align-items: center; width: calc(90% - 30px); height: 72px; margin: 0 auto; margin-bottom: 10px; padding: 0 15px 0 15px; background: #FFF; }
.main-in:nth-last-child(1) { margin-bottom: 0; } 
.main-in p { color: #3D3D3D; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 600; line-height: normal; white-space: pre-wrap; }
.main-in .list-no { color: #2F9BF2; margin-right: 36px; } 

/* schedule_delivery_dtl.html */
.main-sub { height: calc(107vh); position: relative; }
.main-dtl-in { width: calc(90% - 30px); margin: 0 auto; margin-bottom: 10px; padding: 20px 15px 20px 15px; background: #FFF; display: block; cursor: auto; }
.main-dtl-in-memo { height: calc(100vh - 290px); }
/* .main-dtl-in:nth-child(1) { margin-top: 20px; } */
.main-dtl-title { margin-bottom: 20px; color: #3D3D3D; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 700; line-height: normal; }
.main-dtl-in .in-date { width: calc(100% - 20px); padding-left: 10px; padding-right: 10px; height: 30px; border-radius: 4px; border: 1px solid var(--line, #E2E8F0); background: #FFF; color: var(--font-color, #A7A7A7); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 500; line-height: 150%; }
.main-dtl-inner { position: relative; height: 30px; display: flex; align-items: center; margin-bottom: 10px; }
.main-dtl-inner .inner-title { color: #3D3D3D; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 400; line-height: normal; }
.main-dtl-inner .inner-contents { position: absolute; right: 0; color: var(--text-color, #A7A7A7); }
.btn-wrap { width: 90%; margin: 0 auto; position: absolute; left: 5%; bottom: 10px; }
.btn-wrap .btn-save { cursor: pointer; margin-bottom: 10px; display: flex; justify-content: center; align-items: center; height: 45px; border-radius: 4px; background: var(--main, #2F9BF2); color: #FFF; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 600; line-height: normal; }
.btn-wrap .btn-cancel { cursor: pointer; margin-bottom: 10px; display: flex; justify-content: center; align-items: center; height: 45px; border-radius: 4px; background: var(--main, #A7A7A7); color: #FFF; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 600; line-height: normal; }
.btn-wrap .btn-save:hover { background: var(--main, #2085d8); }
.btn-wrap .btn-cancel:hover { background: var(--main, #858585); }
.main-dtl-inner textarea { position: absolute; right: 0; padding-left: 10px; padding-right: 10px; padding-top: 10px; border: none; resize: none; width: calc(100% - 80px); height: 313px; border-radius: 4px; border: 1px solid #E4E8EA; color: #676767; font-family: "Noto Sans KR"; font-size: 12px; font-style: normal; font-weight: 400; line-height: 1.5; }

/* schedule_site.html */
.search-wrap-double { width: 100%; height: 84px; }
.search-wrapper { width: 100%; }
.search-wrap-double .search-in:nth-child(1) { margin-bottom: 5px; }
.search-wrap-double .search-in .in-text { width: calc( 100% - 80px ); padding: 0 10px 0 10px; height: 30px; border-radius: 4px; border: 1px solid #E8E8E8; }
.search-wrap-double .in-date { width: calc( (100% - 68px) / 2 ); }

/* schedule_work.html */
.search-wrap-double .search-in .search-select {  width: calc( 100% - 4px ); padding: 0 10px 0 10px; height: 30px; border-radius: 4px; border: 1px solid #E8E8E8; color: var(--text-color, #A7A7A7); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 400; line-height: normal; }
.search-in .in-text-top { width: calc( 100% - 4px ); }
.main-list { padding: 15px; overflow: auto; }
.main-list:nth-child(1) { margin-top: 0px; }
.main-list .main-dtl-inner {  border-bottom: 1px solid var(--line-color, #E8E8E8); }
.main-list .main-dtl-inner .inner-contents { text-align: right; width: calc(100% - 80px); color: #3D3D3D; font-family: Inter; font-size: 12px;font-style: normal;font-weight: 700; line-height: normal; white-space: pre-wrap; }

/* ---------------- 2025.01.06 ---------------- */

/* memo.html */
.day-wrap { display: flex; justify-content: center; align-items: center; width: calc(100% - 64px); }
.day-arrow { width: 20px; height: 20px; }
.day-arrow img { width: 100%; cursor: pointer; }
.day-box { width: calc((100% - 64px) / 4); margin: 0 auto; text-align: center; }
.day-box .day { color: #3D3D3D; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 600; line-height: normal; }
.day-box .date { color: #3D3D3D; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
.day-dot { width: 6px; }  
.day-dot img { width: 100%; }

/* work.html */
.work-wrap { width: 100%; display: flex; justify-content: center; align-items: center; }
.work-box { cursor: pointer; width: calc((100% / 6) - 6px); margin: 0 auto; margin-right: 3px; margin-left: 3px; display: inline-flex; padding: 9px 10px 9px 9px; justify-content: center; align-items: center; border-radius: 4px; background: #E9E9E9; }
.work-box-on { border-radius: 4px; border: 2px solid var(--main, #2F9BF2); background: #FFF; }
.work-box p { color: #3D3D3D; text-align: center; font-family: Inter; font-size: 13px; font-style: normal; font-weight: 600; line-height: normal; }

/* work_dtl.html, memo_dtl.html */
.main-sub-dtl .main-dtl-in-scroll { overflow: scroll; height: calc(100vh - 415px); }
.main-sub-dtl .main-dtl-inner { height: auto; display: grid; }
.main-sub-dtl .main-dtl-inner .inner-contents { position: relative; margin-top: 13px; margin-bottom: 25px; }
.main-sub-dtl .main-dtl-inner .inner-contents-bcnc { margin-bottom: 0px; }
.search-btn { background: #E9E9E9; color: #3D3D3D; }

/* ---------------- 2025.02.05 ---------------- */

.search-wrap-b { border-bottom: none; }
.search-wrap-double { height: 45px; } 
.main-h { height: calc(100vh - 161px); }