@charset "utf-8";


@font-face {
    font-family:'Pretendard';
    src:url('/font/Pretendard-Light.woff2') format('woff2');
    font-weight:300;
    font-style:normal;
}

@font-face {
    font-family:'Pretendard';
    src:url('/font/Pretendard-Regular.woff2') format('woff2');
    font-weight:400;
    font-style:normal;
}

@font-face {
    font-family:'Pretendard';
    src:url('/font/Pretendard-Medium.woff2') format('woff2');
    font-weight:500;
    font-style:normal;
}

@font-face {
    font-family:'Pretendard';
    src:url('/font/Pretendard-SemiBold.woff2') format('woff2');
    font-weight:600;
    font-style:normal;
}

@font-face {
    font-family:'Pretendard';
    src:url('/font/Pretendard-Bold.woff2') format('woff2');
    font-weight:700;
    font-style:normal;
}


/* 초기화 */
html{scroll-behavior: smooth;}
body {margin:0;padding:0;font-size:0.75em; font-family:'Pretendard', dotum, sans-serif; background:#fff; overflow-x:hidden; overflow:auto; }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:'Pretendard', dotum, sans-serif}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family:'Pretendard', dotum, sans-serif;font-size:1em}
input[type="submit"] {cursor:pointer}
button {cursor:pointer}

textarea, select {font-family:'Pretendard', dotum, sans-serif;font-size:1em}
select {margin:0}
select{appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

input[type=text],input[type=password], textarea {
-webkit-transition:all 0.05s ease-in-out;
-moz-transition:all 0.05s ease-in-out;
-ms-transition:all 0.05s ease-in-out;
-o-transition:all 0.05s ease-in-out;
outline:none;
all: unset;
}

input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
-webkit-box-shadow:0 0 5px #9ed4ff;
-moz-box-shadow:0 0 5px #9ed4ff;
box-shadow:0 0 5px #9ed4ff;
border:1px solid #558ab7 !important;
}


.hide{display:none !important;}
.hidden1024 {}
.visible1024 {display:none;}
.hidden768 {}
.visible768 {display:none;}
.hidden600 {}
.visible600 {display:none;}
.hidden570 {}
.visible570 {display:none;}
.hidden480 {}
.visible480 {display:none;}

@media screen and (max-width:1024px){
	.hidden1024 {display:none;}
	.visible1024 {display:block;}
}/*1024*/
@media screen and (max-width:800px){
}/*800*/
@media screen and (max-width:768px){
	.hidden768 {display:none;}
	.visible768 {display:block;}
}/*768*/
@media screen and (max-width:600px){
	.hidden600 {display:none;}
	.visible600 {display:block;}
}/*600*/
@media screen and (max-width:570px){
	.hidden570 {display:none;}
	.visible570 {display:block;}
}/*570*/
@media screen and (max-width:480px){
	.hidden480 {display:none;}
	.visible480 {display:block;}
}/*480*/




/* 
	center box style 
*/
.inner__box{position:relative; width:100%; margin: 0 auto;}
.inner__full{position:relative; width:100%; margin: 0 auto;}

.inner__cen780{position:relative; width:90%; max-width:780px; margin: 0 auto;}
.inner__cen860{position:relative; width:90%; max-width:860px; margin: 0 auto;}
.inner__cen980{position:relative; width:90%; max-width:980px; margin: 0 auto;}
.inner__cen1020{position:relative; width:90%; max-width:1020px; margin: 0 auto;}
.inner__cen1120{position:relative; width:90%; max-width:1120px; margin: 0 auto;}
.inner__cen1200{position:relative; width:90%; max-width:1200px; margin: 0 auto;}
.inner__cen1280{position:relative; width:90%; max-width:1280px; margin: 0 auto;}

.inner__cen1400{position:relative; width:90%; max-width:1400px; margin: 0 auto;}
.inner__cen1800{position:relative; width:100%; max-width:1800px; margin: 0 auto;}


@media screen and (max-width:1800px){
.inner__cen1800{width:90%;}
}/* 1024px */

@media screen and (max-width:1024px){
}/* 1024px */

@media screen and (max-width:820px){
}/* 820px */

@media screen and (max-width:768px){
}/* 768px */



:root {
	--background-login:#F9FAFB;

	--line01:#E5E5EC;
	--main-color01:#1A0A0B;
	--main-color02:#52555C;
	--main-color03:#7A7F8A;
	--main-color04:#8F929A;
	--btn-color01:#1A0A0B;
}


.talign__center{text-align: center;}
.talign__left{text-align: left;}
.talign__right{text-align: right;}
.img__wr > img{width:100%;}

.mt04{margin-top: 4px;}
.mt08{margin-top: 8px;}
.mt12{margin-top: 12px;}
.mt20{margin-top: 20px;}
.mt24{margin-top: 24px;}
.mt40{margin-top: 40px;}
.mt60{margin-top: 60px;}

.mb04{margin-bottom: 4px;}
.mb08{margin-bottom: 8px;}
.mb12{margin-bottom: 12px;}
.mb16{margin-bottom: 16px;}
.mt20{margin-top: 20px;}
.mb24{margin-bottom: 24px;}
.mb40{margin-bottom: 40px;}

.flex__style{display:flex; align-items:center; }
.flex__style.style01{justify-content: center;}
.flex__style.style02{justify-content:space-between;}
.flex__style.style03{align-items:initial;}
.flex__style.style04{ justify-content: flex-end;}
.flex__style.style05{align-items:flex-end;}

.flex__column{display: flex; flex-direction: column;}

.flex__style.w50 > div{width:50%;}
.flex__style.w33 > div{width:33.33%;}
.w100{width:100%;}
/******************************************************************************
******************************************************************************* 공통 {
*******************************************************************************/

#wrap{width:100%;}
.container{width:100%; height:100%;}
input[type="text"]::placeholder, input[type="password"]::placeholder{font-size:16px; color:#7A7F8A; }
select{background:url(/images/drop_down_icon.png) no-repeat; background-position:95% 50%;}

/* 로그인 */
.login__contents__wr{width:100%; height:100vh;}
.login__contents__wr .inner__box{position:relative; background:var(--background-login); padding:80px 0;}
.login__contents__wr .inner__box:after{content:''; display:block; width:1px; background:var(--line01); position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
height:450px;}
.input__value__box .sub__tit{color:var(--main-color01); font-size:18px; font-weight: 600; margin-bottom: 4px;}
input[type="text"], input[type="password"], input[type="number"]{font-size:16px; box-sizing: border-box; width:100%; border:1px solid #E5E5EC; border-radius:8px; background-color:#fff; height:40px; line-height: 40px; padding:0 12px;}
.login__contents__wr .right__wr{max-width:400px; width:100%; margin:0 auto;}
.contents__box__wr{background:#fff; padding:12px; border-radius:8px;}
.line{color:var(--line01);}
.login__contents__wr .text01{color:var(--main-color01); font-size:16px; font-weight: 400; line-height: 20px;}
.login__contents__wr .info__box .text01:nth-of-type(1){margin-bottom: 4px;}
.btn__wr .btn{display:inline-block; width:100%; border-radius:8px; background:var(--btn-color01); color:#fff; font-size:16px; font-weight: 600; height:40px; line-height: 40px;}
.login__contents__wr .flex__style{gap:8px;}
.login__info a{color:#52555C; font-size:16px; line-height: 1;}
.main__title__wr .title{color:var(--main-color01); font-size:30px; font-weight: 700; line-height: 1;}


.sub__title{color:var(--main-color01); font-size:24px; font-weight: 600; line-height: 34px;}
.sub__title02{color:var(--main-color01); font-size:20px; font-weight: 600; line-height: 28px;}
.main__btn{border:1px solid var(--line01); height:40px; line-height: 40px; padding:0 10px; text-align: center; border-radius:8px;
color:var(--main-color01); font-size:16px; font-weight: 500; display:inline-block;}
select{background: url(/images/drop_down_icon.png) no-repeat; background-position: 95% 50%; height:40px; line-height: 40px; font-weight: 500;
border:1px solid var(--line01); border-radius:8px; background-color:#fff; font-size:16px; color:var(--main-color01); padding:0 12px;}

.dayContainer .flatpickr-day.today{background:#1A0A0B; color:#fff;}

/* 회원가입 */
.input__value__box .btn__wr input{width:calc(100% - 88px);}
.input__value__box .btn__wr .btn{width:80px;}

.checkbox__group input[type="checkbox"] {position: absolute;opacity: 0;width: 0;height: 0;}
.checkbox__group label{font-size:16px; color:var(--main-color01); line-height: 1;}
.checkbox__group label::before { content:""; display:inline-block; vertical-align:middle; width:20px; height:20px; margin-right:8px; background-image:url('/images/cheak_box_icon.png'); background-size:cover; background-repeat:no-repeat; background-position:center; transition:background-image .2s; }
.checkbox__group input[type="checkbox"]:checked + label::before {background-image: url('/images/cheaked_box_icon.png');}


/* 대시보드 Home */
.fixed__menu__wr{width:260px; background:#fff; border-right: 1px solid var(--line01); position: fixed; left:0;
    top: 0; height:100vh; z-index:1000;}
.fixed__menu__wr .datepicker__wr{overflow:auto; height:100%; width:100%; padding:24px 0 120px;}
.menu__inbox__wr{width:100%; height:100%; overflow:auto; padding:24px 12px 60px 12px;}
.menu__inbox__wr .menu__hd{height:86px; line-height: 86px;}
	
.drop__menu__wr li{position:relative;}
.drop__menu__wr li a{position:relative; font-size:16px; color:var(--main-color02); font-weight: 500; line-height: 22px; display:block; width:100%; padding:16px; 
gap:8px; display:flex; align-items:center; border-radius:8px;}
.drop__menu__wr li a > img{transition:0.3s ease-out;}
.drop__menu__wr li a.on{background:#EAEEF1; color:var(--main-color01); font-weight: 600;}
.drop__menu__wr li a.on > img{filter: brightness(0) invert(0);}

@media (pointer: fine) {
	.drop__menu__wr li a:hover{background:#EAEEF1; color:var(--main-color01); font-weight: 600;}
	.drop__menu__wr li a:hover > img{filter: brightness(0) invert(0);}
}
.drop__menu__wr li .count{position:absolute; top:50%; right:0; transform:translateY(-50%); border-radius:4px; display:block; text-align: center; background:rgba(255, 246, 245, 1); width:32px; height:28px; color:#F44336; font-weight: 700; font-size:14px; line-height: 28px;}

.drop__down__icon{position:absolute; top:50%; right:16px; transform:translateY(-50%); width:20px; height:20px; text-align: center; transition: transform 0.2s ease;}
.drop__down__icon.open{transform:translateY(-50%) rotate(180deg);}
.dashboard__contents__wr{display:flex;}
.dashboard__contents__wr .inner__full{padding:40px; width:100%; margin:0; padding-left: 280px; padding-right: 320px;}



.path{margin-bottom: 24px;}
.path > *{font-size:16px; line-height: 20px;}
.path .tx01{font-weight: 700; color:var(--main-color02);}
.path .tx02{font-weight:500; color:var(--main-color01);}

.fixed__menu__wr.left .drop__menu__boxWr{flex-direction: column;justify-content: space-between; height: 100%;}
.drop__menu__boxWr .tit{color:var(--main-color03); font-size:18px; font-weight: 600; padding:16px;}


.drop__menu__boxWr02{border-top:1px solid var(--line01);}
.drop__menu__boxWr02 .profile__info .profile__image{width:40px;}
.profile__info p{font-size:16px; color:var(--main-color01); font-weight: 500; line-height: 1;}
.profile__info{padding:24px 0;}
.profile__info:last-child{padding-bottom: 0;}
.profile__link{cursor:pointer; text-decoration:none; transition:opacity 0.2s ease; border-radius:8px; padding:4px; margin:-4px;}
.profile__link:hover{opacity:0.8; background:rgba(0,0,0,0.05);}
.profile__link p{color:var(--main-color01); transition:color 0.2s ease;}
.profile__link:hover p{color:var(--main-color02, #0066cc);}

#datepicker{display:none;}
.flatpickr-calendar.inline{margin:0 auto;}

/* 우측 사이드바 달력 크기 조정 - 토/일 잘림 해결 */
.fixed__menu__wr.right .flatpickr-calendar.inline {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}
.fixed__menu__wr.right .flatpickr-innerContainer {
    width: 100%;
}
.fixed__menu__wr.right .flatpickr-rContainer {
    width: 100%;
}
.fixed__menu__wr.right .flatpickr-days {
    width: 100% !important;
}
.fixed__menu__wr.right .dayContainer {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between;
    padding: 0 8px;
}
.fixed__menu__wr.right .flatpickr-day {
    width: calc(100% / 7 - 2px);
    max-width: 38px;
    height: 36px;
    line-height: 36px;
    margin: 1px;
    flex-basis: calc(100% / 7 - 2px);
}
.fixed__menu__wr.right .flatpickr-weekdays {
    width: 100%;
    padding: 0 8px;
}
.fixed__menu__wr.right .flatpickr-weekday {
    flex: 1;
    font-size: 12px;
}

.picker__list__wr{border-top: 1px solid var(--line01);}
.picker__list__wr li{padding:12px 8px;}
.fixed__mnav__box{border-bottom: 1px solid var(--line01);}
.fixed__menu__wr.right{left:initial; right:0; padding: 0; background:var(--background-login); width:300px; border-left: 1px solid #E5E5EC;}
.fixed__menu__wr.right .left{border-right:1px solid var(--line01); margin-right: 12px; padding-right: 4px;}

.fixed__menu__wr .tx01{color:var(--main-color01); font-size:18px; font-weight: 600;}
.fixed__menu__wr .tx02{color:var(--main-color01); font-size:16px; font-weight: 500;}

.fixed__menu__wr .tx03{color:var(--main-color03); font-size:22px; font-weight: 700; line-height: 32px;}
.fixed__menu__wr .tx04{color:var(--main-color03); font-size:16px; font-weight: 500; line-height: 20px;}

.picker__list__wr li.on .tx03{color:var(--main-color01);}
.picker__list__wr li.on .tx04{color:var(--main-color01);}
.fixed__mnav__box{padding:40px 16px;}
.g8{gap:8px;}
.fixed__mnav__box02 .profile__text__content{padding-left: 45px; line-height: 1.5;}
.fixed__mnav__box02 .user-profile-card{padding:20px 0; border-bottom: 1px solid var(--line01);}
.fixed__mnav__box02 .profile__image__container .profile__image{margin-right: 0;}
.flatpickr-calendar{width:100%; max-width:100%;}
.flatpickr-innerContainer{justify-content: center;}



.fixed__mnav__box02, .fixed__mnav__box03{border:0;}
.fixed__mnav__box03{padding:0 16px; position:relative;}
.fixed__mnav__box03 textarea{box-sizing: border-box; border:1px solid var(--line01); border-radius:8px; background:#fff;padding:20px 12px; width:100%; height:118px; display:block; font-size:16px;}
.fixed__mnav__box03 textarea::placeholder{font-size:16px; color:var(--main-color02);}
.fixed__mnav__box03 .btn{width:120px;text-align: center;}
.fixed__mnav__box03 .btn__wr .btn{line-height: 30px;}
.fixed__mnav__box03 .btn__wr{position:absolute; bottom:16px; left:50%; transform:translateX(-50%); width:100%; padding:0 36px;}

.g04{gap:4px;}
.g08{gap:8px;}
.g12{gap:12px;}
.g16{gap:16px;}
.g40{gap:40px;}

.br08{border-radius: 8px;}
.br36{border-radius:36px;}

.con__box{border:1px solid var(--line01); padding:24px; border-radius:8px; margin: 12px 0 40px; width:100%;}
.con__box.bcolor{border:0; background:var(--background-login);}
.con__box ul > li{margin-bottom: 16px;}
.con__box ul > li:last-child{margin-bottom: 0;}
.con__box__wr .tx01{color:var(--main-color03); font-size:16px; line-height: 24px; font-weight: 600;}
.con__box__wr .tx02{color:var(--main-color01); font-size:16px; line-height: 24px; font-weight: 600;}

.tx01{color:var(--main-color03); font-size:16px; line-height: 24px; font-weight: 600; word-break:keep-all;}
.tx02{color:var(--main-color01); font-size:18px; line-height: 26px; font-weight: 600; word-break:keep-all;}
.tx03{color:var(--main-color01); font-size:22px; line-height: 35px; font-weight: 600; word-break:keep-all;}
.tx04{color:var(--main-color01); font-size:26px; line-height: 38px; font-weight: 600; word-break:keep-all;}
.tx05{color:var(--main-color01); font-size:14px; line-height: 22px; font-weight: 600; word-break:keep-all;}
.tx06{color:var(--main-color01); font-size:16px; line-height: 24px; font-weight: 500; word-break:keep-all;}



.progress-bar-container { width:100%; max-width:100%; height:8px; background-color:#f0f0f0; border-radius:10px; overflow:hidden; position:relative; }
.progress-bar-fill { height:100%; width:var(--progress,0%); transition:width .5s ease-in-out; border-top-right-radius:10px; border-bottom-right-radius:10px; position:relative; background:linear-gradient(to right,#ffae42,#ff4500); }
.progress-bar-fill:after { content:var(--progress,"0%"); position:absolute; top:-35px; right:0; padding:3px 8px; background-color:#ff4500; color:#fff; font-size:12px; font-weight:bold; border-radius:4px; white-space:nowrap; transform:translateX(50%); }
.progress-bar-fill:before { content:""; position:absolute; top:-10px; right:0; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #ff4500; transform:translateX(50%); }
.progress-bar-container-wr{position:relative;}

.bubble__wr{position: absolute; top:-20px; right:162px; transform: translateY(-100%);}
.bubble {
display: inline-block;
background: #F44336;
padding: 2px 8px;
border-radius: 4px;
position:relative;
color:#fff;
font-size: 14px;
font-weight: 600;
}

.bubble::after {
content: "";
position: absolute;
left: 13px; 
bottom: -7px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #F44336; 
}

.con__box__wr .list__wr li{border-bottom: 1px solid var(--line01); padding-bottom: 16px;}
.con__box__wr .list__wr li:last-child{border-bottom: 0;}

.more__btn{color:var(--main-color02); background:var(--background-login); font-size:16px; font-weight: 500; display:block; height:48px; line-height: 47px;
border-radius:8px; padding:0 18px;}


.con__box__wr03 .left{width:100%; max-width:940px;}
.con__box__wr03 .right{max-width:320px; width:calc(100% - 320px);}

/* 대시보드 홈: 최근대화/나의메모 영역 균등 배분 */
.mo__con__box__wr.con__box__wr03 .left,
.mo__con__box__wr.con__box__wr03 .right{max-width:none; width:50%;}

.profile__image__container { flex-shrink:0; }
.profile__image__container .profile__image{width:36px; height:36px; margin-right:15px;}
.profile__image { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.profile__text__content { display:flex; flex-direction:column; }

.con__box__wr03 .profile__text__content .tx01{color:var(--main-color04); font-weight: 400;}
.con__box__wr .tx02.tx03{font-weight: 400; line-height: 1.4; margin-top: 4px;}

.dashboard__contents__wr .comment{color:#0256E0;}
.con__box p{word-break:keep-all;}
.con__box__wr03 .line{width:100%; height:1px; display:block; margin:20px 0; background:var(--line01);}
.comment__icon{width:24px; height:24px;}
.con__box__wr03 .checkbox__group label::before{position:relative; top:-2px;}


/* 프로젝트 리스트 */
.con__box .profile__info{padding:0;}
.con__box .profile__image{width:40px;}
.project__con__box_wr .con__box.bcolor{ height:140px; background:var(--background-login);}

.popup__wr{display:none; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width: 100%;height: 100%; background: rgba(0,0,0,0.5);z-index: 99999;}
.popup__wr.active{display:block;}
.popup__wr .popup__inner{background:#fff; border-radius:16px; max-width:550px; width:90%; margin:0 auto; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); padding:24px;}
.popup__wr .pop__hd__wr{margin-bottom: 24px;}


/* 테이블 css */
.dashboard__project__list table tr th, .dashboard__project__list table tr td{padding:16px 10px; font-size:16px; color:var(--main-color01); text-align: left;}
.table__wr{border:1px solid #E5E5EC; border-radius:8px; overflow:hidden;}
table{border-color:transparent; border: 1px solid transparent;}
table tr{border-bottom: 1px solid #E5E5EC;}
table th, table td { border-right: 1px solid #E5E5EC; }
table th:last-child, table td:last-child { border-right: none; }
table tbody tr:last-child{border:0;}
.bb0{border-bottom: 0 !important;}
.border0{border:0 !important;}
table thead tr{border-bottom: 1px solid #E5E5EC;}

.table__progressbar{position:absolute; top:8px; left:30px; border-radius:12px;}
.table__progressbar.table__progressbar__c{z-index:90;}
input[type="checkbox"]{cursor: pointer;width:20px; height:20px; border-radius:4px;  -webkit-appearance: none;appearance: none; background-image: url(/images/cheak_box_icon.png);background-size: cover; background-repeat: no-repeat; background-position: center; transition: background-image .2s;}
input[type="checkbox"]:checked{background-image: url('/images/cheaked_box_icon.png');}

input[type="checkbox"].border__cheakbox{width:20px; height:20px; border-radius:4px; -webkit-appearance: none;appearance: none; background-image: url(/images/cheak_box_icon01.png);background-size: cover; background-repeat: no-repeat; background-position: center; transition: background-image .2s;}
input[type="checkbox"].border__cheakbox:checked{background-image: url('/images/cheaked_box_icon01.png');}

/* 완료 토글 버튼 (pill 형태) */
.complete-toggle-btn {
    display: inline-flex; align-items: center; gap: 2px;
    padding: 4px 10px; border-radius: 20px;
    font-size: 12px; font-weight: 500;
    border: 1px solid #ccc; background: #fff; color: #999;
    cursor: pointer; transition: all .2s;
    white-space: nowrap;
}
.complete-toggle-btn:hover { background: #f5f5f5; border-color: #999; }
.complete-toggle-btn.completed {
    background: var(--theme-color, #4CAF50); color: #fff;
    border-color: var(--theme-color, #4CAF50);
}
.complete-toggle-btn.completed:hover { opacity: 0.85; }
.complete-toggle-btn:disabled { opacity: 0.5; cursor: not-allowed; }

input[type="radio"]{cursor: pointer; width:20px; height:20px; border-radius:4px;  -webkit-appearance: none;appearance: none; background-image: url(/images/input_radio_icon.svg);background-size: cover; background-repeat: no-repeat; background-position: center; transition: background-image .2s;}
input[type="radio"]:checked{background-image: url('/images/cheaked_box_icon01.png');}


.left__menu__sub_mnav{display:none; padding-left: 32px;}


.achievement-bar-container { display:flex; align-items:center; justify-content:flex-start; gap:5px; }
.bar-line-container { width:100px; display:flex; }
.bar-line { height:5px; border-radius:2px; }
.bar-filled-20 { width:20%; background-color:#F5A536; }
.bar-remaining-80 { width:80%; background:var(--line01);}

.progressbar__wr{position:relative; width: 170px; height: 5px; margin:0 auto; }
.progressbar__wr .table__progressbar{width:100%; height:100%; position:absolute; left:0; top:0; background:var(--line01);}
.progressbar__wr .table__progressbar__c{width:20%; background:#F5A536;}


table td .toggle__btn{position:relative; top:-2px; margin-right: 4px; display:inline-block;}
table td .toggle__btn--placeholder{display:inline-block; width:20px; margin-right: 4px;}
.add__list{display:none;}
.add__list.open{display:table-row;}
.add__list td a{color:var(--main-color02); background:#f5f5f5; padding:16px 0; width:100%; }

.toggle__btn.on img{transform: rotate(-180deg);}
.table__btn__wr li > a{gap:4px; font-size:16px; font-weight: 600;border:1px solid var(--line01); height:42px; line-height: 41px; border-radius:8px; padding:0 12px; }
.table__btn__wr li.download > a{background:var(--background-login);}

.user-profile-card{position:relative;}
.user-profile-card .main__btn{position:absolute; top:50%; right:0; transform:translate(0,-50%);}
.fixed__menu__wr.right{transition:0.3s ease-in;}
.fixed__menu__wr.right.on{transform:translateX(100%);}


.project__detail__wr .fixed__menu__wr.right select{width:90px; font-weight: 700; background:url("/images/drop_down_icon.png") no-repeat 68px center; }
.project__detail__wr .fixed__menu__wr.right input{width:calc(100% - 100px);}
.project__detail__wr .fixed__menu__wr.right input { background:url("/images/search_icon.png") no-repeat 10px center;padding-left:36px;}

.profile__image__container{position:relative;}
.profile__image__container .comment__info{position:absolute; top:50%; right:0; transform:translateY(-50%);}

.img__file__box{max-width:160px; width:100%; border-radius:8px; overflow:hidden; margin-left: 45px; margin-top: 20px; position:relative;}
.img__file__box img{width:100%;}
.img__download__btn{position:absolute; left:12px; bottom:12px;}

.detail__right__mnav__btn{cursor: pointer; position:absolute; left:0; top:24px; transform: translateX(-100%);}
.fixed__mnav__box:last-child > div{border:0;}
.comment__info__wr{position:relative;}
.admin__btn__wr{position:absolute; top:30px; right:0; background:#fff; border-radius:8px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16); width:100px; display:none; }
.admin__btn__wr.on{display:block;}
.admin__btn__wr a{display:flex; align-items: center; gap:4px; height:36px; line-height: 36px; font-size:14px; color:#1A0A0B;}
.admin__btn__wr a > p{padding:0 16px; width:100%; gap:4px;}
.admin__btn__wr a:last-child{color:#F44336; border-top: 1px solid var(--line01);}

.title__box__bg{background:#F44336;}
.title__box{padding:24px; border-radius:8px; }
.title__box p{color:#fff;}
.dashboard__project__list .bubble__wr{right:102px;}
.dashboard__project__list table.left tr, .dashboard__project__list table.left td{text-align: left;}
.dashboard__project__list table.left td{font-weight: 600;}
.file__tx{color:var(--main-color02); border-bottom: 1px solid var(--main-color02); display: inline-block; font-size:16px;}
.dashboard__project__list table.left .main__btn{font-weight: 700;}
.main__btn.btn01{background:rgba(153,153,153,0.1); color:#999; border:0;}
.main__btn.btn02{background:rgba(19, 184, 46, 0.08); color:rgba(19, 184, 46, 1); border:0;}
.main__btn.btn03{background:rgba(255, 196, 34, 0.1); color:rgba(255, 196, 34, 1); border:0;}
.main__btn.btn04{background:rgba(244, 67, 54, 0.06); color:rgba(244, 67, 54, 1); border:0;}
.main__btn.btn05{background:rgba(54, 117, 244, 0.08); color:rgba(54, 117, 244, 1); border:0;}
.opa0{opacity:0.2;}




.calendar-container { width: 100%; margin: 20px auto; }
.calendar-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.calendar-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.calendar-table th, .calendar-table td { width:170px; border: 1px solid var(--line01); padding: 16px; height: 142px; vertical-align: top; font-size: 16px; }
.calendar-table th { text-align: center; font-weight: bold; padding: 10px 5px; }
.calendar-table th:first-child { color: #e74c3c; }
.calendar-table th:last-child { color: #3498db; }

.calendar-container .date-number { font-size: 16px; font-weight: 500; margin-bottom: 5px; display: block; }
.calendar-container .sunday { color: #e74c3c; }

.calendar-container .event { font-size: 13px; font-weight: 500; margin-top: 3px; padding: 4px 8px; border-radius: 6px; cursor: pointer; display:inline-block; position:relative; }
.calendar-container .event-green { color: rgba(5, 157, 53, 1); background:rgba(240, 251, 243, 1); margin-bottom: 2px; }
.calendar-container .event-blue { color: #2196F3; background: rgba(33, 150, 243, 0.1); margin-bottom: 2px; }
.calendar-container .event-orange { color: #FF9800; background: rgba(255, 152, 0, 0.1); margin-bottom: 2px; }
.calendar-container .event-more { color: #A5ACBA; font-weight: 500; font-size:14px; margin-top: 5px; display: block; }
.calendar-container .highlight-date { background: #1A0A0B; border-radius: 50%; width: 26px; height: 26px; line-height: 25px; text-align: center; display: inline-block; color:#fff;}

/* 뷰 전환 버튼 스타일 */
.view-switch-btns { display: flex; gap: 4px; }
.view-switch-btns .view-btn { padding: 8px 16px; border: 1px solid var(--line01); background: #fff; border-radius: 6px; font-size: 14px; font-weight: 500; color: var(--main-color03); cursor: pointer; transition: all 0.2s ease; }
.view-switch-btns .view-btn:hover { background: #f5f5f5; color: var(--main-color01); }
.view-switch-btns .view-btn.active { background: var(--btn-color01); color: #fff; border-color: var(--btn-color01); }
.today-btn-wrap .main__btn { padding: 0 12px; }

/* 캘린더 보라색 이벤트 (Activity) */
.calendar-container .event-purple { color: #9C27B0; background: rgba(156, 39, 176, 0.1); margin-bottom: 2px; }

/* 캘린더 청록색 이벤트 (Task) */
.calendar-container .event-teal { color: #00BCD4; background: rgba(0, 188, 212, 0.1); margin-bottom: 2px; }

/* 주간 뷰 스타일 */
.week-view-container { display: none; }
.week-view-container.active { display: block; }
.week-view-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.week-view-table th, .week-view-table td { border: 1px solid var(--line01); vertical-align: top; }
.week-view-table th { padding: 12px 8px; text-align: center; font-weight: 500; font-size: 14px; background: #fafafa; }
.week-view-table th.sunday { color: #e74c3c; }
.week-view-table th.saturday { color: #3498db; }
.week-view-table th.today { background: rgba(26, 10, 11, 0.05); }
.week-view-table th .date-num { display: block; font-size: 18px; font-weight: 600; margin-bottom: 2px; }
.week-view-table th .day-name { display: block; font-size: 12px; color: var(--main-color03); }
.week-view-table .time-col { width: 60px; padding: 8px 4px; text-align: center; font-size: 12px; color: var(--main-color03); background: #fafafa; }
.week-view-table .event-cell { padding: 4px; min-height: 40px; position: relative; }
.week-view-table .event-cell .event { display: block; margin-bottom: 2px; font-size: 12px; padding: 3px 6px; }

/* 일간 뷰 스타일 */
.day-view-container { display: none; }
.day-view-container.active { display: block; }
.day-view-header { text-align: center; padding: 20px; background: #fafafa; border-radius: 8px; margin-bottom: 16px; }
.day-view-header .day-date { font-size: 32px; font-weight: 600; color: var(--main-color01); }
.day-view-header .day-name { font-size: 16px; color: var(--main-color03); margin-top: 4px; }
.day-view-header.sunday .day-date { color: #e74c3c; }
.day-view-timeline { border: 1px solid var(--line01); border-radius: 8px; overflow: hidden; }
.day-view-row { display: flex; border-bottom: 1px solid var(--line01); min-height: 60px; }
.day-view-row:last-child { border-bottom: none; }
.day-view-time { width: 80px; padding: 8px 12px; text-align: right; font-size: 13px; color: var(--main-color03); background: #fafafa; flex-shrink: 0; }
.day-view-events { flex: 1; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.day-view-events .event { margin: 0; }
.day-view-events .no-events { color: var(--main-color04); font-size: 13px; }

/* 월간 뷰 스타일 - 다른 뷰와 동일하게 기본 display: none */
.month-view-container { display: none; }
.month-view-container.active { display: block; }

.tab__btn__wr{position:relative;}
.tab__btn__wr ul li .main__btn{border-radius:36px; padding:0 16px; background:#EAEEF1; color:#A5ACBA; border:1px solid #EAEEF1;}
.main__btn.b__color{color:#fff; background:#1A0A0B;}

/* 초록색 탭 (내 일정) */
.tab__btn__wr ul li .main__btn.tab-green { background: rgba(76, 175, 80, 0.15); color: #4CAF50; border-color: rgba(76, 175, 80, 0.3); }
.tab__btn__wr ul li .main__btn.tab-green.on { background: #4CAF50; color: #fff; border-color: #4CAF50; }

/* 주황색 탭 (보고서 일정) */
.tab__btn__wr ul li .main__btn.tab-orange { background: rgba(255, 152, 0, 0.15); color: #FF9800; border-color: rgba(255, 152, 0, 0.3); }
.tab__btn__wr ul li .main__btn.tab-orange.on { background: #FF9800; color: #fff; border-color: #FF9800; }

/* 파란색 탭 (회의 일정) */
.tab__btn__wr ul li .main__btn.tab-blue { background: rgba(33, 150, 243, 0.15); color: #2196F3; border-color: rgba(33, 150, 243, 0.3); }
.tab__btn__wr ul li .main__btn.tab-blue.on { background: #2196F3; color: #fff; border-color: #2196F3; }

/* 토글 버튼 스타일 */
.schedule-filter-toggles { display: flex; align-items: center; gap: 16px; }
.toggle-item { display: flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.toggle-item input[type="checkbox"] { display: none; }
.toggle-slider { position: relative; width: 44px; height: 24px; background: #ccc; border-radius: 12px; transition: all 0.3s ease; }
.toggle-slider::before { content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background: #fff; border-radius: 50%; transition: all 0.3s ease; }
.toggle-item input[type="checkbox"]:checked + .toggle-slider::before { transform: translateX(20px); }
.toggle-label { font-size: 14px; font-weight: 500; color: #666; transition: color 0.3s ease; }
.toggle-item input[type="checkbox"]:checked ~ .toggle-label { color: #333; }

/* 초록색 토글 (내 일정) */
.toggle-item.toggle-green input[type="checkbox"]:checked + .toggle-slider { background: #4CAF50; }
.toggle-item.toggle-green input[type="checkbox"]:checked ~ .toggle-label { color: #4CAF50; }

/* 주황색 토글 (보고서 일정) */
.toggle-item.toggle-orange input[type="checkbox"]:checked + .toggle-slider { background: #FF9800; }
.toggle-item.toggle-orange input[type="checkbox"]:checked ~ .toggle-label { color: #FF9800; }

/* 파란색 토글 (회의 일정) */
.toggle-item.toggle-blue input[type="checkbox"]:checked + .toggle-slider { background: #2196F3; }
.toggle-item.toggle-blue input[type="checkbox"]:checked ~ .toggle-label { color: #2196F3; }

/*@media (pointer: fine) {*/
/*.table__btn__wr li > a:hover{background:#E5E5EC;}*/
/*}*/

.popup{ display:none; position:absolute; top:22px; left:0; border-radius:8px; padding:16px; width:320px; z-index:100;
box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16); background:#fff;}
.calender__popup label{color:var(--main-color01);}

.pop__con .flex__style{display:flex;}
.calender__text__box{background:#FAFAFA; padding:8px; border-radius:8px; display:none;}
.event__sub__popup{width:100%;}
.event__sub__popup.on > img{transform: rotate(-180deg);}

.registration__popup{display:none; position: absolute; right:0; top:42px; width:690px; border-radius: 8px;padding: 16px;box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16); background: #fff; z-index:100;}
.schedule-form-container { position: relative; }
.schedule__wr .con__box__wr01 .con__box .list01{width:600px; margin-bottom: 0;}
.schedule__wr .con__box__wr01 .con__box .list02, .schedule__wr .con__box__wr01 .con__box .list03{width:calc(100% - 632px); margin-bottom: 0;}
.schedule__wr .con__box__wr02 .sub__title > img{ cursor: pointer;}
.schedule__wr .con__box__wr01 .con__box .list04 > a{width:80px; display:flex; gap:4px;}
.schedule__wr .con__box__wr01 .con__box .list05 > a{min-width:70px;}
.schedule__wr .con__box__wr01 .con__box ul > li{margin-bottom: 0;}


.form-title { display: inline-block; font-size: 18px; font-weight: bold; margin-bottom: 20px; color: #333; }
.form-close-button { position: absolute; top: 10px; right: 15px; font-size: 24px; cursor: pointer; color: #999; }
.form-group { margin-bottom: 15px; }
.form-group label { display: block; font-size: 14px; font-weight: bold; color: var(--main-color01); margin-bottom: 4px; }
.text-input, .text-area { width: calc(100% - 20px); padding: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; font-size: 14px; }
.text-area { resize: none; }
.date-time-group { display: flex; align-items: center; gap: 5px; width: calc(100% - 55px); }
.date-input { width: 90px; text-align: center; }
.time-input { width: 50px; text-align: center; }
.separator { padding: 0 5px; font-size: 18px; font-weight: bold; color: var(--main-color01); }
.full-day-checkbox {}
.file-path-input { width: calc(100% - 55px); }
.attachment-icon { padding-left: 10px; font-size: 18px; color: #999; cursor: pointer; }
.alert-settings { display: flex; flex-direction: column; gap: 10px; }
.alert-type { width: 80px; }
.alert-unit { width: 80px; }

.w33__box{width:calc(100% - 55px);}
.w33__box > *{width:calc(33.33% - 3px);}
.all__checkbox{width:55px;}

.title__box__bg > p{color:#fff !important;}
.schedule__wr .fixed__mnav__box01 .picker__list__wr li{border-bottom: 1px solid var(--line01);}
.schedule__wr .fixed__mnav__box01 .picker__list__wr li:last-child{border-bottom: 0; padding-bottom: 0;}

.point{display:inline-block; width:8px; height:8px; background:#F44336; border-radius:50%; vertical-align: super;}
.picker__noschedule{background:#EAEEF1;}
input[type="text"].search__input__icon{background:#fff url(/images/search_icon.png) no-repeat 10px center; padding-left: 36px;}

.lang__btn{display:inline-flex; border:1px solid var(--line01); border-radius:8px; overflow:hidden;}
.lang__btn li a{padding:0 11px; display:block; color:#1A0A0B; font-size:16px; font-weight: 600; height:40px; line-height: 40px; border-right: 1px solid var(--line01);}
.lang__btn li a.on{color:#fff; background:#1A0A0B;}
.more__img{margin-right: 4px; display:inline-block; position:relative; top:-2px;}
.privacypolicy__contents__wr{padding:80px 0 120px;}
.privacypolicy__contents__wr .con__box__wr{max-width:1280px; width:95%; margin:0 auto;}
.privacypolicy__contents__wr .con__box__wr p{font-size:16px; line-height: 1.5; color:var(--main-color01); word-break:keep-all;}





/* ========================================
   모바일 반응형 기본 스타일
   ======================================== */

/* 모바일 햄버거 메뉴 버튼 - 기본 숨김 */
.mobile-menu-toggle {
    display: none;
    position: fixed;
    top: 16px;
    left: 16px;
    z-index: 1100;
    width: 44px;
    height: 44px;
    background: #fff;
    border: 1px solid var(--line01);
    border-radius: 8px;
    cursor: pointer;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.hamburger-line {
    width: 20px;
    height: 2px;
    background: var(--main-color01);
    transition: 0.3s;
}
.mobile-menu-toggle.active .hamburger-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}
.mobile-menu-toggle.active .hamburger-line:nth-child(2) {
    opacity: 0;
}
.mobile-menu-toggle.active .hamburger-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* 사이드바 오버레이 */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1040;
}
.sidebar-overlay.active {
    display: block;
}
body.sidebar-open {
    overflow: hidden;
}

/* 좌측 사이드바 트랜지션 추가 */
.fixed__menu__wr.left {
    transition: transform 0.3s ease-in-out;
}

@media screen and (max-width:1480px){
.mo__con__box__wr{display:block;}
.flex__style.w33 > div{width:calc(33.33% - 10px);}

}/* 1440px */

@media screen and (max-width:1280px){

}/* 1280px */

@media screen and (max-width:1024px){
    /* 우측 사이드바 숨김 */
    .fixed__menu__wr.right {
        transform: translateX(100%);
    }

    /* 메인 콘텐츠 패딩 조정 */
    .dashboard__contents__wr .inner__full {
        padding-right: 40px;
    }

    /* 캘린더 셀 크기 조정 */
    .calendar-table th, .calendar-table td {
        min-width: 80px;
        min-height: 100px;
        padding: 8px;
    }
}/* 1024px */

@media screen and (max-width:820px){
}/* 820px */

@media screen and (max-width:768px){
    /* 햄버거 버튼 표시 */
    .mobile-menu-toggle {
        display: flex;
    }

    /* 좌측 사이드바 모바일 처리 */
    .fixed__menu__wr.left {
        transform: translateX(-100%);
        z-index: 1050;
    }
    .fixed__menu__wr.left.mobile-open {
        transform: translateX(0);
    }

    /* 우측 사이드바 기본 숨김 */
    .fixed__menu__wr.right {
        transform: translateX(100%);
    }

    /* 메인 콘텐츠 영역 - 스크롤 및 min-width 추가 */
    .dashboard__contents__wr {
        overflow-x: auto;
    }
    .dashboard__contents__wr .inner__full {
        padding: 70px 16px 40px 16px;
        min-width: 600px;
    }

    /* 콘텐츠 박스 min-width */
    .con__box {
        min-width: 0;
    }
    .con__box__wr {
        min-width: 560px;
    }

    /* 버튼 영역 줄바꿈 방지 */
    .table__btn__wr {
        white-space: nowrap;
    }
    .table__btn__wr ul {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
    }

    /* 캘린더 반응형 */
    .calendar-container {
        overflow-x: auto;
    }
    .calendar-table {
        min-width: 500px;
    }
    .calendar-table th, .calendar-table td {
        width: auto;
        min-width: 45px;
        height: auto;
        min-height: 60px;
        padding: 4px;
        font-size: 12px;
    }
    .calendar-container .event {
        font-size: 10px;
        padding: 1px 2px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .calendar-container .date-number {
        font-size: 12px;
    }

    /* 통계 카드 모바일 */
    .stats__wr {
        flex-direction: column;
    }
    .stat-card {
        min-width: auto;
    }

    /* 테이블 반응형 */
    .table__wr {
        overflow-x: auto;
    }
    .table__wr table {
        min-width: 800px;
    }

    /* 필터 영역 모바일 */
    .filter__wr {
        flex-wrap: nowrap;
        overflow-x: auto;
        min-width: 0;
    }

    /* 팝업 모바일 */
    .popup__wr .popup__inner {
        max-width: 95%;
        padding: 16px;
    }
    .registration__popup {
        width: 95%;
        max-width: none;
        right: 2.5%;
    }

    /* 상단 문서 헤더 박스 모바일 */
    .doc-header-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 12px 16px;
    }
    .doc-header-cell {
        width: 100%;
    }
    .doc-header-cell.right {
        justify-content: flex-start;
    }

    /* flex 영역 줄바꿈 방지 */
    .flex__style.style02 {
        flex-wrap: nowrap;
    }
}/* 768px */

/* ========================================
   즐겨찾기 기능 스타일
   ======================================== */

/* 메뉴 아이템 컨테이너 */
.left__menu__sub_mnav a.menu-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 10px;
}

/* 즐겨찾기 버튼 기본 스타일 */
.favorite-btn {
    background: transparent;
    border: none;
    padding: 4px;
    cursor: pointer;
    opacity: 0.3;
    transition: opacity 0.2s ease, transform 0.2s ease;
    flex-shrink: 0;
    margin-left: 8px;
}

.favorite-btn:hover {
    opacity: 0.7;
    transform: scale(1.1);
}

/* 즐겨찾기 활성화 상태 */
.favorite-btn.active {
    opacity: 1;
}

.favorite-btn.active .star-icon {
    filter: drop-shadow(0 0 2px rgba(255, 193, 7, 0.5));
}

/* 별 아이콘 */
.favorite-btn .star-icon {
    width: 16px;
    height: 16px;
    transition: filter 0.2s ease;
}

/* 즐겨찾기 메뉴 리스트 */
#favoriteMenuList {
    max-height: 200px;
    overflow-y: auto;
}

/* 빈 즐겨찾기 메시지 */
.empty-favorites {
    padding: 12px 16px;
    color: #999;
    font-size: 12px;
    text-align: center;
    margin: 0;
}

/* 즐겨찾기 섹션 */
.favorite-section {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 8px;
    padding-bottom: 8px;
}

/* 애니메이션 - 즐겨찾기 추가/제거 */
@keyframes favoriteAdd {
    0% { transform: scale(1); }
    50% { transform: scale(1.3); }
    100% { transform: scale(1); }
}

.favorite-btn.animating {
    animation: favoriteAdd 0.3s ease;
}

/* 로딩 상태 */
.favorite-btn.loading {
    pointer-events: none;
    opacity: 0.5;
}

/* 즐겨찾기 항목 (삭제 버튼 포함) */
.favorite-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
}

.favorite-item .favorite-link {
    flex: 1;
    padding: 8px 12px;
    color: inherit;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.favorite-item .favorite-link:hover {
    background: rgba(255, 255, 255, 0.05);
}

/* 즐겨찾기 삭제 버튼 */
.favorite-delete-btn {
    background: transparent;
    border: none;
    color: #999;
    font-size: 16px;
    font-weight: bold;
    width: 24px;
    height: 24px;
    line-height: 22px;
    text-align: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease, color 0.2s ease, background 0.2s ease;
    border-radius: 4px;
    margin-right: 8px;
    flex-shrink: 0;
}

.favorite-item:hover .favorite-delete-btn {
    opacity: 1;
}

.favorite-delete-btn:hover {
    color: #ff4444;
    background: rgba(255, 68, 68, 0.1);
}

.favorite-delete-btn.loading {
    pointer-events: none;
    opacity: 0.5;
}

/* ========================================
   상태 배지 스타일 (공통)
   ======================================== */
.status-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
}

.status-badge.not_started {
    background: rgba(153, 153, 153, 0.1);
    color: #999;
}

.status-badge.in_progress {
    background: rgba(33, 150, 243, 0.1);
    color: #2196F3;
}

.status-badge.completed {
    background: rgba(76, 175, 80, 0.1);
    color: #4CAF50;
}

.status-badge.delayed {
    background: rgba(244, 67, 54, 0.1);
    color: #F44336;
}

/* ========================================
   달성률 바 스타일 (공통)
   ======================================== */
.achievement-bar {
    flex: 1;
    height: 8px;
    background: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    min-width: 80px;
}

.achievement-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #4CAF50, #8BC34A);
    border-radius: 4px;
    transition: width 0.3s ease;
}

.achievement-text {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    min-width: 50px;
    text-align: right;
}

/* ========================================
   페이지네이션 스타일 (공통)
   ======================================== */
.pagination__wr {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 24px;
}

.pagination__wr a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #E5E5EC;
    border-radius: 4px;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    transition: all 0.2s ease;
}

.pagination__wr a:hover {
    background: #f5f5f5;
}

.pagination__wr a.active {
    background: #1A0A0B;
    color: #fff;
    border-color: #1A0A0B;
}

/* ========================================
   상태 통계 카드 (공통)
   ======================================== */
.stats__wr {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.stat-card {
    flex: 1;
    min-width: 140px;
    padding: 16px 20px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #E5E5EC;
}

.stat-card .stat-label {
    font-size: 13px;
    color: #7A7F8A;
    margin-bottom: 4px;
}

.stat-card .stat-value {
    font-size: 24px;
    font-weight: 700;
    color: #1A0A0B;
}

.stat-card.not-started .stat-value { color: #999; }
.stat-card.in-progress .stat-value { color: #2196F3; }
.stat-card.completed .stat-value { color: #4CAF50; }
.stat-card.delayed .stat-value { color: #F44336; }

/* ========================================
   필터 영역 스타일 (공통)
   ======================================== */
.filter__wr {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.filter__wr .search-btn {
    background: #1A0A0B;
    color: #fff;
    border: none;
    padding: 0 16px;
    height: 40px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
}

.filter__wr .search-btn:hover {
    background: #333;
}

/* ========================================
   모달 폼 그룹 스타일 (공통)
   ======================================== */
.form__group {
    margin-bottom: 16px;
}

.form__group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #333;
    font-size: 14px;
}

.form__group input[type="text"],
.form__group input[type="number"],
.form__group textarea,
.form__group input[type="date"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #E5E5EC;
    border-radius: 4px;
    font-size: 14px;
    box-sizing: border-box;
}

.form__group textarea {
    min-height: 80px;
    resize: vertical;
}

.btn__group {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 20px;
}

.btn__group .main__btn.cancel {
    background: #f5f5f5;
    color: #666;
}

/* ========================================
   지표 테이블 호버 하이라이트 스타일
   ======================================== */
#indicators-container .indicator-row {
    transition: background-color 0.2s ease;
}

#indicators-container .indicator-row:hover {
    background-color: #f5f8ff !important;
    cursor: pointer;
}

/* 수정 모드에서 행 호버 강조 */
.table__wr.edit-mode #indicators-container .indicator-row:hover {
    background-color: #e3f2fd !important;
}

/* 삭제 체크된 행은 호버 효과 약하게 */
#indicators-container .indicator-row.deleted-row:hover {
    background-color: #ffebee !important;
    cursor: default;
}

/* ========================================
   일정 목록 팝업 (Day Events Popup)
   ======================================== */
.day-events-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.day-events-popup .popup__inner {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-height: 500px;
    overflow-y: auto;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.day-events-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.day-event-item {
    display: flex;
    align-items: center;
    padding: 12px;
    border-bottom: 1px solid #E5E7EB;
    cursor: pointer;
    border-radius: 6px;
    margin-bottom: 4px;
    transition: background-color 0.2s ease;
}

.day-event-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.day-event-item:hover {
    background-color: #F9FAFB;
}

.day-event-item .event-time {
    min-width: 50px;
    font-size: 13px;
    color: #6B7280;
    font-weight: 500;
}

.day-event-item .event-title {
    flex: 1;
    font-size: 14px;
    color: #1F2937;
    margin-left: 12px;
}

/* 일정 유형별 색상 표시 (왼쪽 바) */
.day-event-item::before {
    content: '';
    width: 4px;
    height: 32px;
    margin-right: 8px;
    border-radius: 2px;
    flex-shrink: 0;
}

.day-event-item.report::before { background-color: #4ECDC4; }
.day-event-item.meeting::before { background-color: #9B59B6; }
.day-event-item.manual::before { background-color: #3B82F6; }
.day-event-item.outcome::before { background-color: #10B981; }
.day-event-item.output::before { background-color: #F59E0B; }
.day-event-item.activity::before { background-color: #EF4444; }

/* 지표 데이터 관리 섹션 - 달성도 프로그레스 바 */
.achievement-bar-container { display: flex; align-items: center; gap: 8px; }
.achievement-bar { flex: 1; height: 8px; background: #e9ecef; border-radius: 4px; overflow: hidden; }
.achievement-bar-fill { height: 100%; background: linear-gradient(90deg, #4CAF50, #8BC34A); transition: width 0.3s ease; }

/* ========================================
   다중 책임자 표시 스타일
   ======================================== */
/* 책임자 구분선 */
.responsible-divider {
    height: 1px;
    background: #e9ecef;
    margin: 12px 0;
}

/* 주 책임자 배지 */
.primary-badge {
    display: inline-block;
    background: #1976d2;
    color: #fff;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 4px;
    vertical-align: middle;
}

/* ========================================
   문서 상단 박스 공통 스타일 (PDM/POD/OD/지표정의서)
   ======================================== */
.doc-header-box {
    border: 1px solid var(--line01);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.doc-header-row {
    padding: 16px 24px;
    display: flex;
    align-items: center;
}

.doc-header-row.actions {
    padding: 12px 24px;
    gap: 8px;
    background: #F9FAFB;
}

.doc-header-divider {
    height: 1px;
    background: var(--line01);
}

.doc-header-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--main-color03);
    min-width: 100px;
}

.doc-header-value {
    font-size: 16px;
    font-weight: 600;
    color: var(--main-color01);
}

.doc-header-value.project-name {
    font-size: 18px;
}

.doc-header-cell {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
}

.doc-header-cell.right {
    justify-content: flex-end;
}

.doc-header-cell .doc-header-label {
    min-width: auto;
}

/* 파일 다운로드 링크 */
.file-download-link {
    color: #2196F3;
    text-decoration: underline;
    font-weight: 500;
    transition: color 0.2s ease;
}

.file-download-link:hover {
    color: #1976D2;
}

.no-file {
    color: var(--main-color04);
    font-style: italic;
    font-weight: 400;
}

/* 상단 박스 버튼 */
.doc-header-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: 1px solid var(--line01);
    border-radius: 6px;
    background: #fff;
    font-size: 14px;
    font-weight: 500;
    color: var(--main-color01);
    cursor: pointer;
    transition: all 0.2s ease;
}

.doc-header-btn:hover {
    background: #f5f5f5;
    border-color: #ccc;
}

.doc-header-btn img {
    width: 16px;
    height: 16px;
}

.doc-header-btn.upload-btn {
    background: var(--btn-color01);
    color: #fff;
    border-color: var(--btn-color01);
}

.doc-header-btn.upload-btn:hover {
    background: #333;
    border-color: #333;
}

.doc-header-btn.upload-btn img {
    filter: brightness(0) invert(1);
}

/* 달성도 설명 tooltip */
.info-tooltip {
    position: relative;
    display: inline-block;
    cursor: help;
    vertical-align: middle;
}
.info-tooltip::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(33, 33, 33, 0.92);
    color: #fff;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 12px;
    white-space: pre-line;
    min-width: 260px;
    max-width: 340px;
    text-align: left;
    line-height: 1.6;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.info-tooltip::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: rgba(33, 33, 33, 0.92);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s;
    z-index: 9999;
}
.info-tooltip:hover::after,
.info-tooltip:hover::before {
    opacity: 1;
}

