/* ==== /css/common/tokens.css ==== */
:root {
--c-surface:          #fff;
--c-surface-alt:      #F9FAFB;
--c-surface-sunken:   #f5f5f5;
--c-surface-muted:    #fafafa;
--c-surface-hover:    #e8e8e8;
--c-surface-tint:     #EAEEF1;
--c-border:           #E5E5EC;
--c-border-strong:    #ddd;
--c-border-subtle:    #f0f0f0;
--c-text:             #1A0A0B;
--c-text-body:        #333;
--c-text-sub:         #52555C;
--c-text-muted:       #666;
--c-text-dim:         #666B75;
--c-text-faint:       #6E7278;
--c-text-disabled:    #8F929A;
--c-text-inverse:     #fff;
--c-primary:          #2196F3;
--c-primary-dark:     #1976D2;
--c-primary-light:    #e3f2fd;
--c-success:          #4CAF50;
--c-success-dark:     #388e3c;
--c-success-light:    #e8f5e9;
--c-warning:          #FF9800;
--c-warning-dark:     #f57c00;
--c-warning-light:    #fff3e0;
--c-danger:           #F44336;
--c-danger-dark:      #d32f2f;
--c-danger-light:     #ffebee;
--c-accent:           #9c27b0;
--c-accent-dark:      #7b1fa2;
--c-accent-light:     #f3e5f5;
--c-on-pending-tint:  #5F6368;
--c-on-progress-tint: #1565C0;
--c-on-imminent-tint: #8A5A00;
--c-on-success-tint:  #2E7D32;
--c-on-danger-tint:   #C62828;
--c-sunday:           #e74c3c;
--c-saturday:         #3498db;
--c-progress-start:   #ffae42;
--c-progress-end:     #ff4500;
--c-track:            #e0e0e0;
--c-changed:          #FFFDE7;
--c-changed-border:   #FFC107;
--sp-1:  4px;
--sp-2:  8px;
--sp-3:  12px;
--sp-4:  16px;
--sp-5:  20px;
--sp-6:  24px;
--sp-8:  32px;
--sp-10: 40px;
--sp-12: 48px;
--sp-15: 60px;
--sp-20: 80px;
--r-sm:    4px;
--r-md:    6px;
--r-lg:    8px;
--r-xl:    12px;
--r-pill:  999px;
--r-round: 50%;
--fs-xs:   11px;
--fs-sm:   12px;
--fs-base: 13px;
--fs-md:   14px;
--fs-lg:   16px;
--fs-xl:   18px;
--fs-2xl:  20px;
--fs-3xl:  24px;
--fs-4xl:  30px;
--fw-regular:  400;
--fw-medium:   500;
--fw-semibold: 600;
--fw-bold:     700;
--lh-tight:   1.25;
--lh-snug:    1.4;
--lh-normal:  1.5;
--lh-relaxed: 1.7;
--h-control:    40px;
--h-control-sm: 32px;
--h-control-xs: 24px;
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
--shadow-md: 0 0 8px 0 rgba(0, 0, 0, 0.16);
--shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.15);
--ring-focus: 0 0 5px #9ed4ff;
--t-fast: 0.15s;
--t-base: 0.2s;
--t-slow: 0.3s;
--ease:   ease;
--background-login: var(--c-surface-alt);
--line01:           var(--c-border);
--main-color01:     var(--c-text);
--main-color02:     var(--c-text-sub);
--main-color03:     var(--c-text-dim);
--main-color04:     var(--c-text-disabled);
--btn-color01:      var(--c-text);
}

/* ==== /css/common/view-transition.css ==== */
@view-transition {
navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
animation-duration: 0.18s;
}
@media (prefers-reduced-motion: reduce) {
::view-transition-old(root),
::view-transition-new(root) {
animation-duration: 0.01s;
}
}

/* ==== /css/default.css ==== */
@font-face {
font-family:'Pretendard';
src:url('/font/PretendardVariable.core.woff2?v=1788841224') format('woff2-variations');
font-weight:400 700;
font-style:normal;
font-display:swap;
}
html{scroll-behavior: smooth;}
body {margin:0;padding:0;font-size:0.75em; font-family:'Pretendard', dotum, sans-serif; background:var(--c-surface); 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}
[hidden] {display:none !important;}
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:var(--c-text);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] {
outline:none;
all: unset;
}
textarea {
box-sizing: border-box;
display: block;
width: 100%;
min-height: 80px;
margin: 0;
padding: var(--sp-2) var(--sp-3);
border: 1px solid var(--c-border);
border-radius: var(--r-lg);
background-color: var(--c-surface);
font-family: 'Pretendard', dotum, sans-serif;
font-size: var(--fs-lg);
line-height: 1.5;
color: var(--c-text);
outline: none;
resize: vertical;
}
textarea::placeholder {
color: var(--c-text-dim);
}
input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
box-shadow:var(--ring-focus, 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;}
}
@media screen and (max-width:800px){
}
@media screen and (max-width:768px){
.hidden768 {display:none;}
.visible768 {display:block;}
}
@media screen and (max-width:600px){
.hidden600 {display:none;}
.visible600 {display:block;}
}
@media screen and (max-width:570px){
.hidden570 {display:none;}
.visible570 {display:block;}
}
@media screen and (max-width:480px){
.hidden480 {display:none;}
.visible480 {display:block;}
}
.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%;}
}
@media screen and (max-width:1024px){
}
@media screen and (max-width:820px){
}
@media screen and (max-width:768px){
}
:root {
--background-login: var(--c-surface-alt, #F9FAFB);
--line01:       var(--c-border, #E5E5EC);
--main-color01: var(--c-text, #1A0A0B);
--main-color02: var(--c-text-sub, #52555C);
--main-color03: var(--c-text-dim, #666B75);
--main-color04: var(--c-text-disabled, #8F929A);
--btn-color01:  var(--c-text, #1A0A0B);
}
.talign__center{text-align: center;}
.talign__left{text-align: left;}
.talign__right{text-align: right;}
.img__wr > img{width:100%;}
.mt00{margin-top: 0;}
.mt04{margin-top: var(--sp-1);}
.mt08{margin-top: var(--sp-2);}
.mt12{margin-top: var(--sp-3);}
.mt16{margin-top: var(--sp-4);}
.mt20{margin-top: var(--sp-5);}
.mt24{margin-top: var(--sp-6);}
.mt32{margin-top: var(--sp-8);}
.mt40{margin-top: var(--sp-10);}
.mt60{margin-top: var(--sp-15);}
.mb00{margin-bottom: 0;}
.mb04{margin-bottom: var(--sp-1);}
.mb08{margin-bottom: var(--sp-2);}
.mb12{margin-bottom: var(--sp-3);}
.mb16{margin-bottom: var(--sp-4);}
.mb20{margin-bottom: var(--sp-5);}
.mb24{margin-bottom: var(--sp-6);}
.mb32{margin-bottom: var(--sp-8);}
.mb40{margin-bottom: var(--sp-10);}
.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;}
.f1{flex:1;}
.f1__min0{flex:1; min-width:0;}
.flex__style.w50 > div{width:50%;}
.w100{width:100%;}
#wrap{width:100%;}
.container{width:100%; height:100%;}
input[type="text"]::placeholder, input[type="password"]::placeholder{font-size:var(--fs-lg); color:var(--c-text-dim); }
select{background:url('/images/drop_down_icon.png?v=1776997724') 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:var(--fs-xl); font-weight: 600; margin-bottom: 4px;}
input[type="text"], input[type="password"], input[type="number"]{font-size:var(--fs-lg); box-sizing: border-box; width:100%; border:1px solid var(--c-border); border-radius:var(--r-lg); background-color:var(--c-surface); 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:var(--c-surface); padding:12px; border-radius:var(--r-lg);}
.line{color:var(--line01);}
.login__contents__wr .text01{color:var(--main-color01); font-size:var(--fs-lg); font-weight: 400; line-height: var(--lh-tight);}
.login__contents__wr .info__box .text01:nth-of-type(1){margin-bottom: 4px;}
.btn__wr .btn{display:inline-block; width:100%; border-radius:var(--r-lg); background:var(--btn-color01); color:var(--c-text-inverse); font-size:var(--fs-lg); font-weight: 600; height:40px; line-height: 40px;}
.login__contents__wr .flex__style{gap:8px;}
.login__info a{color:var(--c-text-sub); font-size:var(--fs-lg); line-height: var(--lh-tight);}
.main__title__wr .title{color:var(--main-color01); font-size:var(--fs-4xl); font-weight: 700; line-height: var(--lh-tight);}
.sub__title{color:var(--main-color01); font-size:var(--fs-3xl); font-weight: 600; line-height: var(--lh-snug);}
.sub__title02{color:var(--main-color01); font-size:var(--fs-2xl); font-weight: 600; line-height: var(--lh-snug);}
.main__btn{border:1px solid var(--line01); height:var(--h-control); line-height: var(--h-control); padding:0 var(--sp-3); text-align: center; border-radius:var(--r-lg);
color:var(--main-color01); font-size:var(--fs-lg); font-weight: 500; display:inline-block;}
select{background: url('/images/drop_down_icon.png?v=1776997724') no-repeat; background-position: 95% 50%; height:40px; line-height: 40px; font-weight: 500;
border:1px solid var(--line01); border-radius:var(--r-lg); background-color:var(--c-surface); font-size:var(--fs-lg); color:var(--main-color01); padding:0 12px;}
.dayContainer .flatpickr-day.today{background:var(--c-text); color:var(--c-text-inverse);}
.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:var(--fs-lg); color:var(--main-color01); line-height: var(--lh-snug);}
.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?v=1776997724'); 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?v=1776997724');}
.fixed__menu__wr{width:260px; background:var(--c-surface); border-right: 1px solid var(--line01); position: fixed; left:0;
top: 0; height:100vh; z-index:1000;}
.fixed__menu__wr .datepicker__wr{display:flex; flex-direction:column; overflow:auto; height:100%; width:100%; padding:24px 0;}
.fixed__menu__wr .datepicker__wr > *{flex-shrink:0;}
.fixed__menu__wr.right .datepicker__wr > .chat-box-component{flex:1 1 auto; min-height:0; height:auto;}
.fixed__menu__wr.right .chat-box-component > .fixed__mnav__box02{display:flex; flex-direction:column; flex:1 1 auto; min-height:0;}
.fixed__menu__wr.right .chat-messages-container{flex:1 1 auto; min-height:180px; max-height:none;}
.menu__inbox__wr{width:100%; height:100%; overflow:auto; padding:24px 12px 24px 12px; display:flex; flex-direction:column;}
.menu__inbox__wr > *{flex-shrink:0;}
.menu__inbox__wr .menu__hd{height:86px; display:flex; align-items:center; justify-content:center; position:relative;}
.drop__menu__wr li{position:relative;}
.drop__menu__wr li a,
.drop__menu__wr li.menu-disabled > span{position:relative; font-size:var(--fs-lg); 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:var(--r-lg);}
.drop__menu__wr li a > img,
.drop__menu__wr li a > .sic{transition:0.3s ease-out;}
.drop__menu__wr li.menu-disabled > span{color:var(--c-text-disabled); cursor:not-allowed;}
.drop__menu__wr li.menu-disabled > span > img,
.drop__menu__wr li.menu-disabled > span > .sic{opacity:0.4;}
.drop__menu__wr li a.on{background:var(--c-surface-tint); color:var(--main-color01); font-weight: 600;}
.drop__menu__wr li a.on > img,
.drop__menu__wr li a.on > .sic{filter: brightness(0) invert(0);}
@media (pointer: fine) {
.drop__menu__wr li a:hover{background:var(--c-surface-tint); color:var(--main-color01); font-weight: 600;}
.drop__menu__wr li a:hover > img,
.drop__menu__wr li a:hover > .sic{filter: brightness(0) invert(0);}
}
.drop__menu__wr li .count{position:absolute; top:50%; right:0; transform:translateY(-50%); border-radius:var(--r-sm); display:block; text-align: center; background:rgba(255, 246, 245, 1); width:32px; height:28px; color:var(--c-danger); font-weight: 700; font-size:var(--fs-md); 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: 40px;}
@media screen and (min-width:1025px){
body.has-aside .dashboard__contents__wr .inner__full{padding-right: 320px;}
body.has-aside.aside-collapsed .dashboard__contents__wr .inner__full{padding-right: 40px;}
}
.page-head__top{display:flex; align-items:center; gap:var(--sp-3); margin-bottom: var(--sp-2); min-height:28px;}
.page-head__top .lang__btn{margin-left:auto;}
.page-head__top .path{margin-bottom: 0;}
.path{margin-bottom: var(--sp-2);}
.path > *{font-size:var(--fs-lg); line-height: var(--lh-tight);}
.path .tx01{font-weight: 700; color:var(--main-color02);}
.path .tx02{font-weight:500; color:var(--main-color01);}
.path a{color:var(--main-color02); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px;}
.path a:hover{color:var(--c-primary-dark); text-decoration-thickness: 2px;}
.path a:focus-visible{outline:2px solid var(--c-primary); outline-offset:2px; border-radius:var(--r-sm);}
.page-actions{display:flex; gap:var(--sp-2); align-items:center;}
.project-switcher{position:relative; margin:4px 0 12px;}
.project-switcher__btn{display:flex; align-items:center; gap:8px; width:100%; padding:8px 12px; text-align:left;
background:var(--c-surface-alt); border:1px solid var(--line01); border-radius:var(--r-lg);
color:var(--main-color01); cursor:pointer; transition:border-color 0.2s ease, background 0.2s ease;
font-family:inherit; text-decoration:none;}
.project-switcher__btn:hover,
.project-switcher__btn[aria-expanded="true"]{background:var(--c-surface-tint); border-color:var(--c-border-strong);}
.project-switcher__btn:focus-visible{outline:2px solid var(--c-primary); outline-offset:1px;}
.project-switcher__text{display:flex; flex-direction:column; flex:1 1 auto; min-width:0;}
.project-switcher__label{font-size:var(--fs-xs); line-height:var(--lh-snug); color:var(--main-color03); font-weight:500; letter-spacing:0.02em;}
.project-switcher__name{font-size:var(--fs-md); line-height:var(--lh-snug); font-weight:600; color:var(--main-color01);
display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; overflow-wrap:anywhere;}
.project-switcher__caret{flex-shrink:0; color:var(--main-color03);}
.project-switcher__btn:hover .project-switcher__caret{color:var(--main-color01);}
.project-switcher__btn--empty{margin:4px 0 12px;}
.project-switcher__btn--empty .project-switcher__name{color:var(--main-color03); font-weight:500;}
.project-switcher__menu{position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:20;
background:var(--c-surface); border:1px solid var(--c-border); border-radius:var(--r-lg); box-shadow:var(--shadow-lg);
padding:4px 0; text-align:left;}
.project-switcher__menu[hidden]{display:none;}
.project-switcher__heading{padding:8px 12px 4px; margin:0; font-size:var(--fs-xs); font-weight:600; color:var(--main-color03); letter-spacing:0.02em;}
.project-switcher__list{max-height:280px; overflow-y:auto; padding:0 4px;}
.project-switcher__item{display:flex; align-items:flex-start; gap:8px; width:100%; padding:8px 8px; text-align:left;
background:none; border:0; border-radius:var(--r-md); color:var(--main-color01); font-family:inherit; font-size:var(--fs-md);
line-height:var(--lh-snug); cursor:pointer; word-break:keep-all; overflow-wrap:anywhere;}
.project-switcher__item:hover,
.project-switcher__item:focus-visible{background:var(--c-surface-tint); outline:none;}
.project-switcher__item[aria-selected="true"]{font-weight:600;}
.project-switcher__check{flex-shrink:0; width:16px; height:20px; color:var(--c-primary); visibility:hidden;}
.project-switcher__item[aria-selected="true"] .project-switcher__check{visibility:visible;}
.project-switcher__item:disabled{opacity:0.6; cursor:progress;}
.project-switcher__state{padding:12px; margin:0; font-size:var(--fs-sm); color:var(--c-text-faint); text-align:center;}
.project-switcher__state a{color:var(--c-primary-dark); text-decoration:underline; margin-left:4px;}
.project-switcher__all{display:block; margin:4px 4px 0; padding:8px 8px; border-top:1px solid var(--c-border-subtle);
border-radius:0 0 var(--r-md) var(--r-md); font-size:var(--fs-sm); font-weight:500; color:var(--main-color02);}
.project-switcher__all:hover{background:var(--c-surface-tint); color:var(--main-color01);}
.project-switcher__all::after{content:" \2192";}
.fixed__menu__wr.left .drop__menu__boxWr{flex:1 0 auto; flex-direction: column; justify-content: space-between;}
.drop__menu__boxWr .tit{color:var(--main-color03); font-size:var(--fs-xl); font-weight: 600; padding:16px;}
.drop__menu__boxWr02{border-top:1px solid var(--line01); margin-top:8px; padding-top:8px;}
.drop__menu__boxWr02 .profile__info{display:flex; align-items:center; gap:4px; padding:0;}
.drop__menu__boxWr02 .profile__info .profile__image{width:36px; height:36px; flex-shrink:0;}
.profile__info p{font-size:var(--fs-lg); color:var(--main-color01); font-weight: 500; line-height: var(--lh-tight);}
.profile__info{padding:24px 0;}
.profile__info:last-child{padding-bottom: 0;}
.profile__link{cursor:pointer; text-decoration:none; transition:background 0.2s ease; border-radius:var(--r-lg);
display:flex; align-items:center; gap:12px; flex:1 1 auto; min-width:0; padding:8px 12px 8px 8px;}
.profile__link:hover{background:var(--c-surface-tint);}
.profile__link p{color:var(--main-color01); transition:color 0.2s ease;}
.profile__text{display:flex; flex-direction:column; min-width:0;}
.profile__text p{font-size:var(--fs-md); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.profile__role{font-size:var(--fs-sm); color:var(--main-color03); line-height:var(--lh-snug);}
.profile__logout{display:flex; align-items:center; justify-content:center; flex-shrink:0;
width:40px; height:40px; border-radius:var(--r-lg); transition:background 0.2s ease;}
.profile__logout:hover{background:var(--c-surface-tint);}
.profile__logout:hover > .sic{filter: brightness(0) invert(0);}
#datepicker{display:none;}
.flatpickr-calendar.inline{margin:0 auto;}
.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 var(--c-border); display:flex; flex-direction:column;}
.fixed__menu__wr.right > .datepicker__wr{height:auto; flex:1 1 auto; min-height:0;}
.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:var(--fs-xl); font-weight: 600;}
.fixed__menu__wr .tx02{color:var(--main-color01); font-size:var(--fs-lg); font-weight: 500;}
.fixed__menu__wr .tx03{color:var(--main-color03); font-size:var(--fs-2xl); font-weight: 700; line-height: var(--lh-normal);}
.fixed__menu__wr .tx04{color:var(--main-color03); font-size:var(--fs-lg); font-weight: 500; line-height: var(--lh-tight);}
.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: var(--sp-12); 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:var(--r-lg); background:var(--c-surface);padding:20px 12px; width:100%; height:118px; display:block; font-size:var(--fs-lg);}
.fixed__mnav__box03 textarea::placeholder{font-size:var(--fs-lg); color:var(--main-color02);}
.fixed__mnav__box03 .btn{width:120px;text-align: center;}
.fixed__mnav__box03 .btn__wr{position:absolute; bottom:var(--sp-4); left:50%; transform:translateX(-50%); width:100%; padding:0 var(--sp-8);}
.g04{gap:var(--sp-1);}
.g08{gap:var(--sp-2);}
.g12{gap:var(--sp-3);}
.g16{gap:var(--sp-4);}
.g20{gap:var(--sp-5);}
.g24{gap:var(--sp-6);}
.g32{gap:var(--sp-8);}
.g40{gap:var(--sp-10);}
.br08{border-radius: var(--r-lg);}
.br36{border-radius:var(--r-pill);}
.con__box{border:1px solid var(--line01); padding:var(--sp-6); border-radius:var(--r-lg); margin: var(--sp-3) 0 var(--sp-10); width:100%;}
.con__box.bcolor{border:0; background:var(--background-login);}
.con__box ul > li{margin-bottom: var(--sp-4);}
.con__box ul > li:last-child{margin-bottom: 0;}
.con__box__wr .tx01{color:var(--main-color03); font-size:var(--fs-lg); line-height: var(--lh-normal); font-weight: 600;}
.con__box__wr .tx02{color:var(--main-color01); font-size:var(--fs-lg); line-height: var(--lh-normal); font-weight: 600;}
.tx01{color:var(--main-color03); font-size:var(--fs-lg); line-height: var(--lh-normal); font-weight: 600; word-break:keep-all;}
.tx02{color:var(--main-color01); font-size:var(--fs-xl); line-height: var(--lh-snug); font-weight: 600; word-break:keep-all;}
.tx03{color:var(--main-color01); font-size:var(--fs-2xl); line-height: var(--lh-relaxed); font-weight: 600; word-break:keep-all;}
.tx04{color:var(--main-color01); font-size:var(--fs-3xl); line-height: var(--lh-normal); font-weight: 600; word-break:keep-all;}
.tx05{color:var(--main-color01); font-size:var(--fs-md); line-height: var(--lh-normal); font-weight: 600; word-break:keep-all;}
.tx06{color:var(--main-color01); font-size:var(--fs-lg); line-height: var(--lh-normal); font-weight: 500; word-break:keep-all;}
.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:var(--fs-lg); font-weight: 500; display:block; height:var(--sp-12); line-height: var(--sp-12);
border-radius:var(--r-lg); padding:0 var(--sp-5);}
.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:var(--sp-3);}
.profile__image { width:100%; height:100%; object-fit:cover; border-radius:var(--r-round); }
.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:var(--c-primary-dark);}
.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 .pop__hd__wr{margin-bottom: 24px;}
.dashboard__project__list table tr th, .dashboard__project__list table tr td{padding:16px var(--sp-2); font-size:var(--fs-lg); color:var(--main-color01); text-align: left;}
.table__wr{border:1px solid var(--c-border); border-radius:var(--r-lg); overflow-x:auto; overflow-y:hidden;}
table{border-color:transparent; border: 1px solid transparent;}
table tr{border-bottom: 1px solid var(--c-border);}
table th, table td { border-right: 1px solid var(--c-border); }
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 var(--c-border);}
.table__progressbar{position:absolute; top:8px; left:30px; border-radius:var(--r-xl);}
.table__progressbar.table__progressbar__c{z-index:90;}
input[type="checkbox"]{cursor: pointer;width:20px; height:20px; border-radius:var(--r-sm);  -webkit-appearance: none;appearance: none; background-image: url('/images/cheak_box_icon.png?v=1776997724');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?v=1776997724');}
input[type="checkbox"].border__cheakbox{width:20px; height:20px; border-radius:var(--r-sm); -webkit-appearance: none;appearance: none; background-image: url('/images/cheak_box_icon01.png?v=1776997724');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?v=1776997724');}
input[type="checkbox"]:indeterminate{
background-image: linear-gradient(var(--main-color02), var(--main-color02)), url('/images/cheak_box_icon.png?v=1776997724');
background-size: 10px 2px, cover;
background-position: center, center;
background-repeat: no-repeat, no-repeat;
}
input[type="checkbox"].border__cheakbox:indeterminate{
background-image: linear-gradient(var(--main-color02), var(--main-color02)), url('/images/cheak_box_icon01.png?v=1776997724');
background-size: 10px 2px, cover;
background-position: center, center;
background-repeat: no-repeat, no-repeat;
}
.complete-toggle-btn {
display: inline-flex; align-items: center; gap: var(--sp-1);
padding: var(--sp-1) var(--sp-2); border-radius: var(--r-pill);
font-size: var(--fs-sm); font-weight: 500;
border: 1px solid var(--c-border-strong); background: var(--c-surface); color: var(--c-text-faint);
cursor: pointer; transition: all .2s;
white-space: nowrap;
}
.complete-toggle-btn:hover { background: var(--c-surface-sunken); border-color: var(--c-text-faint); }
.complete-toggle-btn.completed {
background: var(--theme-color, var(--c-success)); color: var(--c-text-inverse);
border-color: var(--theme-color, var(--c-success));
}
.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:var(--r-sm);  -webkit-appearance: none;appearance: none; background-image: url('/images/input_radio_icon.svg?v=1776997724');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?v=1776997724');}
.left__menu__sub_mnav{display:none; margin:0 0 4px 20px; padding-left:4px; border-left:2px solid var(--line01);}
.left__menu__sub_mnav.is-open{display:block;}
.achievement-bar-container { display:flex; align-items:center; justify-content:flex-start; gap:var(--sp-1); }
.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:var(--c-surface-sunken); padding:16px 0; width:100%; }
.toggle__btn.on img{transform: rotate(-180deg);}
.table__btn__wr li > a{display:inline-flex; align-items:center; justify-content:center;
gap:var(--sp-1); font-size:var(--fs-lg); font-weight: 600; border:1px solid var(--line01);
height:var(--h-control); line-height:1; border-radius:var(--r-lg); padding:0 var(--sp-3);
transition:background var(--t-base) var(--ease), border-color var(--t-base) var(--ease);}
.table__btn__wr li > a:hover{background:var(--c-surface-sunken);}
.table__btn__wr li.download > a{background:var(--background-login);}
.table__btn__wr li.download > a:hover{background:var(--c-surface-hover);}
.table__btn__wr li > a[id$="toggle-edit-btn"]{background:var(--c-primary-dark); border-color:var(--c-primary-dark); color:var(--c-text-inverse);}
.table__btn__wr li > a[id$="toggle-edit-btn"]:hover{background:var(--c-primary); border-color:var(--c-primary);}
.table__btn__wr li > a[id$="toggle-edit-btn"] img{filter:brightness(0) invert(1);}
.table__btn__wr li > a#editBtn,
.table__btn__wr li > a#saveBtn{background:var(--c-primary-dark); border-color:var(--c-primary-dark); color:var(--c-text-inverse);}
.table__btn__wr li > a#editBtn:hover,
.table__btn__wr li > a#saveBtn:hover{background:var(--c-primary); border-color:var(--c-primary);}
.table__btn__wr li > a#editBtn img,
.table__btn__wr li > a#saveBtn img{filter:brightness(0) invert(1);}
.table__btn__wr li > a.is-disabled{opacity:0.55;}
.table__btn__wr li > a.is-disabled:hover{background:var(--background-login);}
.table__btn__wr li.download > a.is-disabled:hover{background:var(--background-login);}
.table__btn__wr li > a[id$="toggle-edit-btn"].active{background:var(--c-primary); border-color:var(--c-primary);}
.table__btn__wr li > a[id$="delete-selected-btn"]{color:var(--c-danger); border-color:var(--c-danger);}
.table__btn__wr li > a[id$="delete-selected-btn"]:hover{background:var(--c-danger-light);}
.table__btn__wr li:has(> a[hidden]){display:none;}
.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;}
body.aside-collapsed .fixed__menu__wr.right{transform:translateX(100%);}
.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:var(--r-lg); overflow:hidden; margin-left: var(--sp-12); margin-top: var(--sp-5); position:relative;}
.img__file__box img{width:100%;}
.img__download__btn{position:absolute; left:12px; bottom:12px;}
.fixed__mnav__box:last-child > div{border:0;}
.comment__info__wr{position:relative;}
.title__box__bg{background:var(--c-danger);}
.title__box{padding:10px 20px; border-radius:var(--r-lg); }
.title__box p{color:var(--c-text-inverse);}
.title__box .tx04{font-size:var(--fs-4xl); font-weight:700; line-height: var(--lh-tight);}
.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:var(--fs-lg);}
.dashboard__project__list table.left .main__btn{font-weight: 700;}
.main__btn.btn01, .list-status-select.btn01{background:rgba(153,153,153,0.1); color:var(--c-on-pending-tint); border:0;}
.main__btn.btn02, .list-status-select.btn02{background:rgba(54, 117, 244, 0.08); color:var(--c-on-progress-tint); border:0;}
.main__btn.btn03, .list-status-select.btn03{background:rgba(255, 196, 34, 0.1); color:var(--c-on-imminent-tint); border:0;}
.main__btn.btn04, .list-status-select.btn04{background:rgba(244, 67, 54, 0.06); color:var(--c-on-danger-tint); border:0;}
.main__btn.btn05, .list-status-select.btn05{background:rgba(19, 184, 46, 0.08); color:var(--c-on-success-tint); border:0;}
.tab__btn__wr{position:relative;}
.tab__btn__wr ul li .main__btn{border-radius:var(--r-pill); padding:0 16px; background:var(--c-surface-tint); color:var(--c-text-disabled); border:1px solid var(--c-surface-tint);}
.popup{ display:none; position:absolute; top:22px; left:0; border-radius:var(--r-lg); padding:16px; width:320px; z-index:100;
box-shadow: var(--shadow-md); background:var(--c-surface);}
.pop__con .flex__style{display:flex;}
.form-title { display: inline-block; font-size: var(--fs-xl); font-weight: bold; margin-bottom: 20px; color: var(--c-text-body); }
.form-close-button { position: absolute; top: 10px; right: 15px; font-size: var(--fs-3xl); cursor: pointer; color: var(--c-text-faint); }
.form-group { margin-bottom: 15px; }
.form-group label { display: block; font-size: var(--fs-md); font-weight: bold; color: var(--main-color01); margin-bottom: 4px; }
.text-input, .text-area { width: calc(100% - 20px); padding: var(--sp-2); border: 1px solid var(--c-border-strong); border-radius: var(--r-sm); box-sizing: border-box; font-size: var(--fs-md); }
.text-area { resize: none; }
.date-time-group { display: flex; align-items: center; gap: var(--sp-1); width: calc(100% - 55px); }
.date-input { width: 90px; text-align: center; }
.time-input { width: 50px; text-align: center; }
.separator { padding: 0 var(--sp-1); font-size: var(--fs-xl); font-weight: bold; color: var(--main-color01); }
.full-day-checkbox {}
.file-path-input { width: calc(100% - 55px); }
.attachment-icon { padding-left: var(--sp-2); font-size: var(--fs-xl); color: var(--c-text-faint); cursor: pointer; }
.alert-settings { display: flex; flex-direction: column; gap: var(--sp-2); }
.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:var(--c-text-inverse) !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:var(--c-danger); border-radius:var(--r-round); vertical-align: super;}
.picker__noschedule{background:var(--c-surface-tint);}
input[type="text"].search__input__icon{background:var(--c-surface) url('/images/search_icon.png?v=1776997724') no-repeat 10px center; padding-left: var(--sp-8);}
.lang__btn{display:inline-flex; border:1px solid var(--line01); border-radius:var(--r-lg); overflow:hidden;}
.lang__btn li a,
.lang__btn li span,
.lang__btn li button{padding:0 var(--sp-3); display:block; color:var(--c-text); font-size:var(--fs-lg); font-weight: 600; height:40px; line-height: 40px; border:0; border-right: 1px solid var(--line01); background:transparent;}
.lang__btn li:last-child a,
.lang__btn li:last-child span,
.lang__btn li:last-child button{border-right:0;}
.lang__btn li a.on,
.lang__btn li span.on,
.lang__btn li button.on{color:var(--c-text-inverse); background:var(--c-text);}
.lang__btn li span.disabled,
.lang__btn li button:disabled{color:var(--c-text-disabled); background:#F7F7F8; cursor:not-allowed;}
.page-head__top .lang__btn li a,
.page-head__top .lang__btn li span,
.page-head__top .lang__btn li button{height:28px; line-height: 28px; font-size:var(--fs-md); padding:0 var(--sp-2);}
.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:var(--fs-lg); 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: var(--c-surface);
border: 1px solid var(--line01);
border-radius: var(--r-lg);
cursor: pointer;
flex-direction: column;
justify-content: center;
align-items: center;
gap: var(--sp-1);
box-shadow: var(--shadow-sm);
}
.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:1279px){
.mo__con__box__wr{display:block;}
}
@media screen and (max-width: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;
}
}
@media screen and (max-width: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%);
}
.dashboard__contents__wr {
overflow-x: auto;
}
.dashboard__contents__wr .inner__full {
padding: 70px 16px 40px 16px;
min-width: 600px;
}
.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;
}
.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;
}
.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__style.style02 {
flex-wrap: nowrap;
}
}
.left__menu__sub_mnav a.menu-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 4px 0 4px 8px;
gap: 0;
font-size: var(--fs-md);
line-height: var(--h-control-xs);
border-radius: var(--r-md);
word-break: keep-all;
}
.left__menu__sub_mnav a.menu-item .favorite-btn { margin-left: var(--sp-1); }
.favorite-btn {
background: transparent;
border: none;
width: var(--h-control-xs);
height: var(--h-control-xs);
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
cursor: pointer;
opacity: 0.3;
transition: opacity 0.2s ease, transform 0.2s ease;
flex-shrink: 0;
margin-left: var(--sp-2);
}
.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: 8px 12px;
color: var(--c-text-faint);
font-size: var(--fs-sm);
line-height: var(--lh-snug);
margin: 0;
}
.favorite-section {
border-bottom: 1px solid var(--line01);
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;
min-width: 0;
padding: 4px 12px;
font-size: var(--fs-md);
line-height: var(--h-control-xs);
border-radius: var(--r-md);
color: inherit;
text-decoration: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.favorite-delete-btn {
background: transparent;
border: none;
color: var(--c-text-faint);
font-size: var(--fs-lg);
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: var(--r-sm);
margin-right: 8px;
flex-shrink: 0;
}
.favorite-item:hover .favorite-delete-btn,
.favorite-item:focus-within .favorite-delete-btn,
.favorite-delete-btn:focus,
.favorite-delete-btn:focus-visible {
opacity: 1;
}
.favorite-delete-btn:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 1px;
}
.favorite-delete-btn:hover {
color: var(--c-danger);
background: rgba(255, 68, 68, 0.1);
}
@media (pointer: coarse) {
.favorite-delete-btn {
opacity: 1;
}
}
.favorite-delete-btn.loading {
pointer-events: none;
opacity: 0.5;
}
.filter__wr {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
#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: var(--c-primary-light) !important;
}
#indicators-container .indicator-row.deleted-row:hover {
background-color: var(--c-danger-light) !important;
cursor: default;
}
.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: var(--c-surface);
border-radius: var(--r-xl);
padding: 24px;
max-height: 500px;
overflow-y: auto;
box-shadow: var(--shadow-lg);
}
.day-events-list {
list-style: none;
padding: 0;
margin: 0;
}
.day-event-item {
display: flex;
align-items: center;
padding: 12px;
border-bottom: 1px solid var(--c-border);
cursor: pointer;
border-radius: var(--r-md);
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: var(--c-surface-alt);
}
.day-event-item .event-time {
min-width: 50px;
font-size: var(--fs-base);
color: var(--c-text-muted);
font-weight: 500;
}
.day-event-item .event-title {
flex: 1;
font-size: var(--fs-md);
color: var(--c-text-body);
margin-left: 12px;
}
.day-event-item::before {
content: '';
width: 4px;
height: 32px;
margin-right: 8px;
border-radius: var(--r-sm);
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; }
.responsible-divider {
height: 1px;
background: #e9ecef;
margin: 12px 0;
}
.primary-badge {
display: inline-block;
background: var(--c-primary-dark);
color: var(--c-text-inverse);
font-size: var(--fs-xs);
padding: 2px 6px;
border-radius: var(--r-pill);
margin-left: 4px;
vertical-align: middle;
}
.doc-header-box {
border: 1px solid var(--line01);
border-radius: var(--r-lg);
background: var(--c-surface);
overflow: hidden;
}
.doc-header-row {
padding: 16px 24px;
display: flex;
align-items: center;
}
.doc-header-row.actions {
padding: 12px 24px;
gap: 8px;
background: var(--c-surface-alt);
}
.doc-header-divider {
height: 1px;
background: var(--line01);
}
.doc-header-label {
font-size: var(--fs-md);
font-weight: 500;
color: var(--main-color03);
min-width: 100px;
}
.doc-header-value {
font-size: var(--fs-lg);
font-weight: 600;
color: var(--main-color01);
}
.doc-header-value.project-name {
font-size: var(--fs-xl);
}
.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: var(--c-primary);
text-decoration: underline;
font-weight: 500;
transition: color 0.2s ease;
}
.file-download-link:hover {
color: var(--c-primary-dark);
}
.no-file {
color: var(--main-color04);
font-style: italic;
font-weight: 400;
}
.doc-header-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--sp-2);
height: var(--h-control);
padding: 0 var(--sp-4);
border: 1px solid var(--line01);
border-radius: var(--r-md);
background: var(--c-surface);
font-size: var(--fs-md);
font-weight: 500;
color: var(--main-color01);
cursor: pointer;
transition: all 0.2s ease;
}
.doc-header-btn:hover {
background: var(--c-surface-sunken);
border-color: var(--c-border-strong);
}
.doc-header-btn img {
width: 16px;
height: 16px;
}
.doc-header-btn.upload-btn {
font-weight: var(--fw-semibold);
}
.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: var(--c-text-inverse);
padding: var(--sp-2) 14px;
border-radius: var(--r-lg);
font-size: var(--fs-sm);
white-space: pre-line;
min-width: 260px;
max-width: 340px;
text-align: left;
line-height: var(--lh-normal);
z-index: 9999;
opacity: 0;
pointer-events: none;
transition: opacity 0.18s;
box-shadow: var(--shadow-sm);
}
.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;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}

/* ==== /css/common/list-common.css ==== */
.table-state-retry {
margin-left: var(--sp-2);
padding: var(--sp-1) var(--sp-3);
border: 1px solid var(--c-primary);
border-radius: var(--r-sm);
background: transparent;
color: var(--c-primary);
font-size: var(--fs-sm);
font-weight: var(--fw-semibold);
cursor: pointer;
}
.table-state-retry:hover {
background: var(--c-primary);
color: var(--c-text-inverse);
}
.table-state-retry:focus-visible {
outline: none;
box-shadow: var(--ring-focus);
}
.table-state-action {
margin-left: var(--sp-3);
vertical-align: baseline;
}
.dashboard__project__list table tr td.talign__center,
.dashboard__project__list table tr th.talign__center,
.dashboard__project__list table tr td.empty,
.dashboard__project__list table tr td.loading,
.dashboard__project__list table tr td.error {
text-align: center;
}
.dashboard__project__list table tr td.talign__left,
.dashboard__project__list table tr th.talign__left {
text-align: left;
}
.dashboard__project__list table tr td.talign__right,
.dashboard__project__list table tr th.talign__right {
text-align: right;
}
.list-link {
color: var(--entity-accent, var(--c-primary-dark));
text-decoration: underline;
text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
text-decoration-thickness: 1px;
text-underline-offset: 3px;
cursor: pointer;
}
.list-link:hover,
.list-link:focus-visible {
text-decoration-color: currentColor;
text-decoration-thickness: 2px;
}
.list-link:focus-visible {
outline: 2px solid var(--entity-accent, var(--c-primary));
outline-offset: 2px;
}
.cell-date {
white-space: nowrap;
min-width: 96px;
}
.col-select {
width: 48px;
}
.dashboard__project__list table th.col-no {
width: 100px;
}
.dashboard__project__list .table__wr.edit-mode table th.col-no {
width: 210px;
}
.col-select__label {
display: block;
font-size: var(--fs-xs);
font-weight: var(--fw-medium);
line-height: var(--lh-tight);
color: var(--c-text-muted);
margin-bottom: 2px;
}
tr.is-target:not(.new-row):not(.modified-row):not(.deleted-row) {
background-color: var(--c-primary-light, #e8f0fe) !important;
transition: background-color 0.2s ease-out;
}
@media (prefers-reduced-motion: reduce) {
tr.is-target:not(.new-row):not(.modified-row):not(.deleted-row) {
transition: none;
}
}
tr.is-chat-target:not(.new-row):not(.modified-row):not(.deleted-row) {
background-color: var(--c-surface-tint, #f5f7fa) !important;
}
.list-total {
margin-top: var(--sp-3);
text-align: center;
color: var(--c-text-muted);
font-size: var(--fs-sm);
}
.pagination__wr {
display: flex;
justify-content: center;
gap: 4px;
margin-top: 24px;
}
.pagination__wr a,
.pagination__wr span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 var(--sp-3);
border: 1px solid var(--c-border);
border-radius: var(--r-sm);
font-size: var(--fs-md);
color: var(--c-text-body);
text-decoration: none;
transition: background var(--t-base) var(--ease), color var(--t-base) var(--ease),
border-color var(--t-base) var(--ease);
}
.pagination__wr a:hover {
background: var(--c-surface-sunken);
}
.pagination__wr a:focus-visible {
outline: none;
box-shadow: var(--ring-focus);
}
.pagination__wr a.active,
.pagination__wr a[aria-current="page"] {
background: var(--c-text);
color: var(--c-text-inverse);
border-color: var(--c-text);
}
.pagination__wr .is-disabled {
color: var(--c-text-disabled);
background: var(--c-surface-muted);
}
.pagination__wr .pagination__gap {
border: 0;
background: none;
min-width: var(--sp-6);
padding: 0;
color: var(--c-text-faint);
}
.popup__wr {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
display: none;
align-items: center;
justify-content: center;
z-index: 2000;
transform: none;
padding: 24px 16px;
box-sizing: border-box;
}
.popup__wr.active {
display: flex;
}
body.modal-open {
overflow: hidden;
}
.popup__wr .popup__inner {
background: var(--c-surface);
border-radius: var(--r-lg);
max-width: 600px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
position: static;
top: auto;
left: auto;
transform: none;
}
.popup__wr .popup__inner--xs   { max-width: 400px; }
.popup__wr .popup__inner--sm   { max-width: 450px; }
.popup__wr .popup__inner--md   { max-width: 500px; }
.popup__wr .popup__inner--form { max-width: 550px; }
.popup__wr .popup__inner--wide { max-width: 620px; }
.popup__field {
width: 100%;
border: 1px solid var(--c-border);
}
input.popup__field,
select.popup__field,
textarea.popup__field {
border-radius: var(--r-sm);
}
input.popup__field,
textarea.popup__field {
padding: var(--sp-2) var(--sp-3);
}
textarea.popup__field {
min-height: 80px;
}
input.popup__field--sm {
padding: var(--sp-2) var(--sp-3);
border-color: var(--c-border-strong);
}
.popup__field:focus-visible {
outline: none;
box-shadow: var(--ring-focus);
}
.popup__actions {
justify-content: flex-end;
margin-top: var(--sp-5);
}
.popup__actions--between {
justify-content: space-between;
}
.file-select-btn:focus-visible { outline: none; box-shadow: var(--ring-focus); }
.file-name-display {
margin-left: var(--sp-3);
color: var(--c-text-muted);
font-size: var(--fs-base);
}
.file-name-display.has-file {
color: var(--c-text-body);
}
.visually-hidden-input {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.file-existing-label {
font-size: var(--fs-sm);
color: var(--c-text-muted);
}
.pop__hd__wr {
padding: 16px 20px;
border-bottom: 1px solid var(--c-border);
}
.pop__con {
padding: 20px;
}
.form__group label { font-size: var(--fs-md); }
.form__group input[type="text"],
.form__group input[type="number"],
.form__group textarea,
.form__group input[type="date"],
.form__group select {
width: 100%;
border: 1px solid var(--c-border);
border-radius: var(--r-sm);
font-size: var(--fs-md);
box-sizing: border-box;
}
.form__group input[type="text"],
.form__group input[type="number"],
.form__group textarea,
.form__group input[type="date"] {
padding: var(--sp-2) 12px;
}
.form__group textarea {
min-height: 80px;
resize: vertical;
}
.required::after {
content: " *";
color: var(--c-danger);
font-weight: var(--fw-bold);
}
.section-load-empty,
.section-load-loading,
.section-load-error {
padding: var(--sp-10) var(--sp-5);
text-align: center;
font-size: var(--fs-md);
}
.modal-loading {
display: inline-block;
padding: var(--sp-2) 0;
font-size: var(--fs-sm);
color: var(--c-text-faint);
}
.section-load-empty   { color: var(--c-text-faint); }
.section-load-loading { color: var(--c-text-muted); }
.section-load-error   { color: var(--c-danger); }
.section-empty-action {
margin-left: var(--sp-3);
vertical-align: middle;
}
.detail-load-error {
padding: var(--sp-10) var(--sp-5);
text-align: center;
font-size: var(--fs-md);
color: var(--c-danger);
}
.section-load-retry {
margin-left: var(--sp-2);
height: var(--h-control-xs);
padding: 0 var(--sp-2);
border: 1px solid var(--c-border);
border-radius: var(--r-sm);
background: var(--c-surface);
font-family: inherit;
font-size: var(--fs-sm);
color: var(--c-text-sub);
cursor: pointer;
}
.section-load-retry:hover {
background: var(--c-surface-sunken);
color: var(--c-text-body);
}
.form__row {
display: flex;
gap: 16px;
}
.form__row .form__group {
flex: 1;
}
.btn__group .main__btn {
padding: 0 20px;
}
.btn__group .main__btn:not(.cancel):not(.danger):not(.danger-ghost) {
background: var(--c-primary-dark);
border-color: var(--c-primary-dark);
color: var(--c-text-inverse);
}
.btn__group .main__btn:not(.cancel):not(.danger):not(.danger-ghost):hover {
background: var(--c-primary);
border-color: var(--c-primary);
}
.add__list {
opacity: 0;
height: 0;
overflow: hidden;
transition: opacity 0.2s ease, height 0.2s ease;
}
.add__list.open {
opacity: 1;
height: auto;
}
.add__list a {
padding: 8px 16px;
color: var(--c-text-muted);
font-size: var(--fs-base);
border-radius: var(--r-sm);
transition: background-color 0.2s ease;
}
.add__list a:hover {
background-color: var(--c-surface-sunken);
}
.indicator-subtable-row {
background: var(--c-surface-muted);
}
.indicator-subtable-row > td {
padding: 0 !important;
}
table tr:last-child {
border-bottom: 1px solid var(--c-border);
}
.od-attachments-container {
display: flex;
flex-direction: column;
gap: 4px;
}
.od-attachment-item {
display: flex;
align-items: center;
gap: 4px;
}
.od-attachment-item .file__tx {
max-width: 150px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.od-delete-attachment-btn {
background: none;
border: none;
color: var(--c-text-faint);
cursor: pointer;
font-size: var(--fs-md);
padding: 0 4px;
line-height: 1;
}
.od-delete-attachment-btn:hover {
color: var(--c-danger);
}
.od-file-upload-area {
margin-top: 4px;
}
.od-file-label {
font-size: var(--fs-sm);
color: var(--c-primary-dark);
cursor: pointer;
}
.od-file-label:hover {
text-decoration: underline;
}
.skeleton-row > td {
padding: 14px 8px;
}
.sk-bar {
display: block;
height: 12px;
border-radius: var(--r-md);
background: linear-gradient(90deg, #ececef 25%, #f6f6f8 37%, #ececef 63%);
background-size: 400% 100%;
animation: sk-shimmer 1.4s ease-in-out infinite;
}
.sk-lines {
display: flex;
flex-direction: column;
gap: var(--sp-2);
}
.sk-lines > .sk-bar:last-child {
width: 60%;
}
@keyframes sk-shimmer {
0%   { background-position: 100% 50%; }
100% { background-position: 0 50%; }
}
@media (prefers-reduced-motion: reduce) {
.sk-bar {
animation: none;
background: #ececef;
}
}
.common__contents__wr table thead th {
font-weight: var(--fw-semibold);
}
.common__contents__wr table:where(:not(.calendar-table)) thead th {
padding: var(--sp-3) var(--sp-4);
background: var(--c-surface-alt);
}
.edit-icon      { width: 16px; height: 16px; }
.edit-icon--sm  { width: 14px; height: 14px; }
.list-filters {
display: flex;
align-items: center;
gap: var(--sp-2);
flex-wrap: wrap;
margin: 0;
min-width: 0;
}
.list-filters__field {
display: inline-flex;
align-items: center;
gap: var(--sp-2);
min-width: 0;
}
.list-filters__label {
font-size: var(--fs-sm);
color: var(--c-text-muted);
white-space: nowrap;
}
input.list-filters__input,
select.list-filters__select {
height: var(--h-control-sm);
line-height: var(--h-control-sm);
padding: 0 var(--sp-3);
border: 1px solid var(--c-border-strong);
border-radius: var(--r-sm);
background: var(--c-surface);
font-size: var(--fs-md);
color: var(--c-text-body);
min-width: 0;
}
input.list-filters__input.search__input__icon {
padding-left: var(--sp-8);
}
.list-filters select.list-filters__select {
padding-right: var(--sp-6);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1.5L5 5l4-3.5' fill='none' stroke='%23666B75' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right var(--sp-2) center;
cursor: pointer;
}
.list-filters__input:focus-visible,
.list-filters__select:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 1px;
}
.list-filters__field--search .list-filters__input { min-width: 210px; }
.list-filters .main__btn {
height: var(--h-control-sm);
line-height: var(--h-control-sm);
flex-shrink: 0;
background: transparent;
}
.list-filters__reset {
height: var(--h-control-sm);
padding: 0 var(--sp-2);
border: 0;
background: none;
color: var(--c-text-muted);
font-size: var(--fs-sm);
text-decoration: underline;
text-underline-offset: 3px;
cursor: pointer;
}
.list-filters__reset:hover { color: var(--c-primary-dark); }
.list-filters__reset[hidden] { display: none; }
.list-filters__reset:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 2px;
border-radius: var(--r-sm);
}
.list-filters__count {
margin: 0;
font-size: var(--fs-sm);
color: var(--c-text-muted);
white-space: nowrap;
}
@media screen and (max-width: 1024px) {
.list-filters__field--search .list-filters__input { min-width: 140px; }
}

/* ==== /css/common/status-badge.css ==== */
.status-badge {
display: inline-block;
padding: var(--sp-1) var(--sp-3);
border-radius: var(--r-pill);
font-size: var(--fs-base);
font-weight: var(--fw-medium);
}
.status-badge.pending,
.status-badge.not_started {
background: rgba(153, 153, 153, 0.1);
color: var(--c-on-pending-tint);
}
.status-badge.in_progress {
background: rgba(33, 150, 243, 0.1);
color: var(--c-on-progress-tint);
}
.status-badge.imminent {
background: rgba(255, 196, 34, 0.14);
color: var(--c-on-imminent-tint);
}
.status-badge.completed {
background: rgba(76, 175, 80, 0.1);
color: var(--c-on-success-tint);
}
.status-badge.delayed {
background: rgba(244, 67, 54, 0.1);
color: var(--c-on-danger-tint);
}
.status-badge.approved {
background: rgba(33, 150, 243, 0.1);
color: var(--c-on-progress-tint);
}
.status-badge.rejected {
background: rgba(244, 67, 54, 0.1);
color: var(--c-on-danger-tint);
}
.category-badge {
display: inline-block;
padding: var(--sp-1) var(--sp-2);
border-radius: var(--r-sm);
font-size: var(--fs-sm);
font-weight: var(--fw-medium);
}
.category-badge.baseline {
background: var(--c-primary-light);
color: var(--c-primary-dark);
}
.category-badge.midline1,
.category-badge.midline2,
.category-badge.midline3,
.category-badge.midline4,
.category-badge.midline5,
.category-badge.midline6,
.category-badge.midline7,
.category-badge.midline8,
.category-badge.midline9,
.category-badge.midline10 {
background: var(--c-warning-light);
color: var(--c-warning-dark);
}
.category-badge.endline {
background: var(--c-success-light);
color: var(--c-success-dark);
}
.action-badge {
display: inline-block;
padding: var(--sp-1) var(--sp-2);
border-radius: var(--r-sm);
font-size: var(--fs-sm);
font-weight: var(--fw-medium);
}
.action-badge.create {
background: var(--c-success-light);
color: var(--c-success-dark);
}
.action-badge.update {
background: var(--c-warning-light);
color: var(--c-warning-dark);
}
.action-badge.delete {
background: var(--c-danger-light);
color: var(--c-danger-dark);
}

/* ==== /css/common/achievement-bar.css ==== */
.achievement-bar-container {
display: flex;
align-items: center;
gap: var(--sp-2);
}
.achievement-bar {
flex: 1;
height: 8px;
background: var(--c-track);
border-radius: var(--r-sm);
overflow: hidden;
min-width: 80px;
}
.achievement-bar-fill {
height: 100%;
background: var(--c-success);
border-radius: var(--r-sm);
transition: width var(--t-slow) var(--ease);
}
.achievement-bar-fill.level-low  { background: var(--c-warning); }
.achievement-bar-fill.level-mid  { background: var(--c-primary); }
.achievement-bar-fill.level-high { background: var(--c-success); }
.achievement-text {
font-size: var(--fs-base);
font-weight: var(--fw-semibold);
color: var(--c-text-body);
min-width: 50px;
text-align: right;
}
.achievement-progress {
margin-top: var(--sp-5);
padding: var(--sp-4);
background: var(--c-surface-alt);
border-radius: var(--r-lg);
}
.achievement-progress-bar {
height: 12px;
background: var(--c-track);
border-radius: var(--r-md);
overflow: hidden;
margin-top: var(--sp-3);
}
.achievement-progress-fill {
height: 100%;
background: linear-gradient(90deg, var(--c-success), #8BC34A);
border-radius: var(--r-md);
transition: width var(--t-slow) var(--ease);
}
.achievement-progress-fill.outcome {
background: linear-gradient(90deg, var(--c-accent), #e040fb);
}

/* ==== /css/common/edit-mode.css ==== */
.edit-mode-buttons {
display: none;
gap: var(--sp-2);
}
.edit-mode-buttons.show {
display: flex;
}
.edit-mode-buttons .main__btn.primary img {
filter: brightness(0) invert(1);
}
.dashboard__project__list table tr.activity-add-child-row > td {
padding-top: var(--sp-1);
padding-bottom: var(--sp-1);
border-bottom: 1px solid var(--c-border-subtle);
background-color: var(--c-surface);
text-align: left;
}
.add-child-row-btn {
display: inline-flex;
align-items: center;
gap: var(--sp-1);
height: 30px;
padding: 0 var(--sp-3);
border: 1px dashed var(--c-border-strong);
border-radius: var(--r-md);
background: transparent;
color: var(--entity-accent, var(--c-primary));
font-family: inherit;
font-size: var(--fs-md);
font-weight: var(--fw-medium);
line-height: 1;
white-space: nowrap;
cursor: pointer;
transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
}
.add-child-row-btn:hover {
border-style: solid;
border-color: var(--entity-accent, var(--c-primary));
background: var(--c-primary-light);
}
.add-child-row-btn:focus-visible {
outline: 2px solid var(--entity-accent, var(--c-primary));
outline-offset: 2px;
}
.activity-name-cell input.activity-name-input {
padding-right: 32px;
}
#toggle-edit-btn.active {
background: var(--c-primary);
color: var(--c-text-inverse);
}
.output-row.new-row,
.outcome-row.new-row {
background: var(--c-success-light) !important;
}
.output-row.deleted-row,
.outcome-row.deleted-row {
opacity: 0.4;
text-decoration: line-through;
background: var(--c-danger-light) !important;
}
.output-row.modified-row,
.outcome-row.modified-row {
background: var(--c-warning-light) !important;
}
.output-name-input,
.outcome-name-input {
width: 100%;
border: 1px solid var(--c-border);
border-radius: var(--r-sm);
background: var(--c-surface);
}
.output-name-input:focus {
border-color: var(--c-primary);
outline: none;
}
.outcome-name-input:focus {
border-color: var(--c-accent);
outline: none;
}

/* ==== /css/common/drag-drop.css ==== */
.drag-handle {
cursor: move;
color: var(--c-text-faint);
font-size: var(--fs-lg);
padding: var(--sp-1) var(--sp-2);
user-select: none;
display: none;
}
.drag-handle:hover {
color: var(--c-text-muted);
}
.table__wr.edit-mode .drag-handle {
display: inline-block;
}

/* ==== /css/common/notification.css ==== */
.notification-menu {
position: absolute;
top: 0;
bottom: 0;
right: 0;
display: flex;
align-items: center;
}
.notification-trigger {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: var(--r-lg);
transition: background var(--t-base) var(--ease);
}
.notification-trigger:hover,
.notification-trigger[aria-expanded="true"] {
background: var(--c-surface-tint);
}
.notification-trigger:hover > .sic,
.notification-trigger[aria-expanded="true"] > .sic {
filter: brightness(0) invert(0);
}
.notification-count {
position: absolute;
top: 2px;
right: 2px;
background: var(--c-danger);
color: var(--c-text-inverse);
font-size: var(--fs-xs);
font-weight: var(--fw-semibold);
min-width: 16px;
height: 16px;
border-radius: var(--r-pill);
display: flex;
align-items: center;
justify-content: center;
padding: 0 var(--sp-1);
box-shadow: 0 0 0 2px var(--c-surface);
}
.notification-dropdown {
display: none;
position: fixed;
top: 0;
left: 0;
width: 320px;
max-width: calc(100vw - 16px);
text-align: left;
background: var(--c-surface);
border: 1px solid var(--c-border);
border-radius: var(--r-lg);
box-shadow: var(--shadow-lg);
z-index: 1000;
}
.notification-dropdown.active {
display: block;
}
.notification-dropdown-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: var(--sp-3) var(--sp-4);
border-bottom: 1px solid var(--c-border);
font-weight: var(--fw-semibold);
}
.notification-dropdown-header a {
font-size: var(--fs-sm);
color: var(--c-primary-dark);
font-weight: var(--fw-regular);
}
.notification-dropdown-body {
max-height: 300px;
overflow-y: auto;
}
.notification-item {
padding: var(--sp-3) var(--sp-4);
border-bottom: 1px solid var(--c-surface-sunken);
cursor: pointer;
transition: background var(--t-base) var(--ease);
}
.notification-item:hover {
background: var(--c-surface-muted);
}
.notification-item.unread {
background: #fff8e1;
}
.notification-item.unread:hover {
background: #fff3cd;
}
.notification-item-message {
font-size: var(--fs-base);
color: var(--c-text-body);
line-height: 1.4;
margin-bottom: var(--sp-1);
}
.notification-item-time {
font-size: var(--fs-xs);
color: var(--c-text-faint);
}
.notification-dropdown-footer {
padding: var(--sp-3) var(--sp-4);
text-align: center;
border-top: 1px solid var(--c-border);
}
.notification-dropdown-footer a {
font-size: var(--fs-base);
color: var(--c-primary-dark);
}
.notification-item--approval_request {
border-left: 3px solid var(--c-warning);
}
.notification-item--approval_request.unread {
background: var(--c-warning-light);
}
.notification-item--approval_request.unread:hover {
background: #ffe0b2;
}
.notification-item--approval_result {
border-left: 3px solid var(--c-success);
}
#approval-notification-popup .pop__con {
padding: var(--sp-5);
}
.anp-info {
margin-bottom: var(--sp-5);
}
.anp-info-row {
display: flex;
padding: var(--sp-2) 0;
border-bottom: 1px solid var(--c-border-subtle);
}
.anp-info-row:last-child {
border-bottom: none;
}
.anp-label {
flex: 0 0 80px;
font-size: var(--fs-base);
color: var(--c-text-muted);
font-weight: var(--fw-medium);
}
.anp-value {
flex: 1;
font-size: var(--fs-base);
color: var(--c-text-body);
word-break: break-word;
}
.anp-status-approved {
color: var(--c-success);
font-weight: var(--fw-semibold);
}
.anp-status-rejected {
color: var(--c-danger);
font-weight: var(--fw-semibold);
}
.anp-actions {
display: flex;
gap: var(--sp-2);
justify-content: center;
padding: var(--sp-4) 0;
border-top: 1px solid var(--c-border);
}
.anp-actions .main__btn {
min-width: 100px;
}
.anp-reject-form {
padding: var(--sp-4) 0;
border-top: 1px solid var(--c-border);
}
.anp-reject-form label {
display: block;
font-size: var(--fs-base);
font-weight: var(--fw-medium);
color: var(--c-text-body);
margin-bottom: var(--sp-2);
}
.anp-reject-form textarea {
width: 100%;
padding: var(--sp-2);
border: 1px solid var(--c-border-strong);
border-radius: var(--r-sm);
font-size: var(--fs-base);
resize: vertical;
box-sizing: border-box;
}
.anp-reject-form textarea:focus {
outline: none;
border-color: var(--c-primary-dark);
}
.anp-reject-form-actions {
display: flex;
gap: var(--sp-2);
justify-content: center;
margin-top: var(--sp-5);
}
.anp-reject-form-actions .main__btn {
min-width: 100px;
}

/* ==== /css/detail-common.css ==== */
.output-detail-page { --theme-color: var(--c-primary); --theme-light: var(--c-primary-light); --theme-dark: var(--c-primary-dark); --theme-gradient-end: #64b5f6; }
.outcome-detail-page { --theme-color: var(--c-accent); --theme-light: var(--c-accent-light); --theme-dark: var(--c-accent-dark); --theme-gradient-end: #ba68c8; }
.activity-detail-page { --theme-color: var(--c-warning); --theme-light: var(--c-warning-light); --theme-dark: #ef6c00; --theme-gradient-end: #ffb74d; }
.popup__close__btn:not(.main__btn) {
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 32px;
height: 32px;
padding: 0;
border: 0;
border-radius: var(--r-round);
background: transparent;
color: var(--c-text-muted);
font-family: inherit;
font-size: var(--fs-3xl);
line-height: 1;
cursor: pointer;
transition: background var(--t-base) var(--ease), color var(--t-base) var(--ease);
}
.popup__close__btn:not(.main__btn):hover {
background: var(--c-surface-sunken);
color: var(--c-text);
}
.popup__close__btn:not(.main__btn) img {
display: block;
width: 24px;
height: 24px;
}
.title__box__bg .status-badge {
background: rgba(255, 255, 255, 0.92);
color: var(--c-text);
}
.detail-card {
background: var(--c-surface);
border: 1px solid var(--c-border);
border-radius: var(--r-lg);
padding: var(--sp-6);
margin-bottom: var(--sp-10);
}
.detail-card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: var(--sp-5);
padding-bottom: var(--sp-4);
border-bottom: 1px solid var(--c-border);
}
.detail-card-header h2 {
font-size: var(--fs-xl);
font-weight: var(--fw-semibold);
color: var(--c-text-body);
}
.pod-section {
margin-bottom: var(--sp-6);
}
.pod-section:last-child {
margin-bottom: 0;
}
.pod-header {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: var(--sp-4);
margin-bottom: var(--sp-3);
}
.pod-header .left {
display: flex;
align-items: center;
gap: var(--sp-4);
}
.pod-header .right {
display: flex;
align-items: center;
gap: var(--sp-4);
}
.pod-manager-input {
display: flex;
align-items: center;
gap: var(--sp-2);
}
.pod-manager-input label {
font-size: var(--fs-base);
color: var(--c-text-muted);
}
.pod-manager-input input[type="text"] {
width: 100px;
padding: 6px var(--sp-2);
border: 1px solid var(--c-border);
border-radius: var(--r-sm);
font-size: var(--fs-base);
}
.pod-btn-group {
display: flex;
gap: var(--sp-2);
flex-shrink: 0;
}
.pod-btn-group .main__btn {
font-size: var(--fs-base);
}
.manager-select-btn {
display: inline-flex;
align-items: center;
padding: var(--sp-1) var(--sp-3);
font-size: var(--fs-base);
background: var(--c-surface-sunken);
border: 1px solid var(--c-border-strong);
border-radius: var(--r-sm);
cursor: pointer;
text-decoration: none;
color: var(--c-text-body);
min-width: 80px;
justify-content: center;
transition: background var(--t-base) var(--ease);
}
.manager-select-btn:hover {
background: var(--c-surface-hover);
}
.manager-select-btn.has-selection {
background: var(--theme-light, var(--c-primary-light));
border-color: var(--theme-color, var(--c-primary-dark));
color: var(--theme-dark, var(--c-primary-dark));
}
.pod-table {
width: 100%;
border-collapse: collapse;
}
.pod-table th, .pod-table td {
padding: var(--sp-3);
text-align: center;
border: 1px solid var(--c-border);
font-size: var(--fs-base);
}
.pod-table td.left-align {
text-align: left;
}
.pod-action-btn {
padding: var(--sp-1) var(--sp-2);
font-size: var(--fs-sm);
border-radius: var(--r-sm);
cursor: pointer;
margin: 0 2px;
}
.pod-action-btn.pod-edit-item-btn {
background: var(--c-surface-sunken);
border: 1px solid var(--c-border-strong);
color: var(--c-text-body);
}
.pod-action-btn.pod-edit-item-btn:hover {
background: var(--c-surface-hover);
}
.pod-action-btn.pod-delete-item-btn {
background: var(--c-surface);
border: 1px solid var(--c-danger);
color: var(--c-danger);
}
.pod-action-btn.pod-delete-item-btn:hover {
background: var(--c-danger-light);
}
.responsible-card {
display: flex;
flex-direction: column;
align-items: center;
padding: var(--sp-5);
background: var(--c-surface-muted);
border-radius: var(--r-lg);
}
.responsible-card .profile-image {
width: 80px;
height: 80px;
border-radius: var(--r-round);
object-fit: cover;
margin-bottom: var(--sp-3);
border: 2px solid var(--c-border);
}
.responsible-card .org {
font-size: var(--fs-sm);
color: var(--c-text-faint);
margin-bottom: var(--sp-1);
}
.responsible-card .name {
font-size: var(--fs-lg);
font-weight: var(--fw-semibold);
color: var(--c-text-body);
margin-bottom: var(--sp-1);
}
.responsible-card .position {
font-size: var(--fs-base);
color: var(--c-text-muted);
}
.responsible-card.empty {
color: var(--c-text-faint);
font-size: var(--fs-md);
}
.progress__box {
margin-top: var(--sp-6);
}
.progress-bar-container-wr {
position: relative;
overflow: hidden;
}
.bubble__wr {
position: relative;
height: 32px;
overflow: visible;
}
.bubble {
position: absolute;
background: var(--theme-color, var(--c-primary));
color: var(--c-text-inverse);
padding: var(--sp-1) var(--sp-2);
border-radius: var(--r-sm);
font-size: var(--fs-sm);
font-weight: var(--fw-semibold);
white-space: nowrap;
}
.bubble::after {
content: '';
position: absolute;
bottom: -6px;
left: 50%;
transform: translateX(-50%);
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid var(--theme-color, var(--c-primary));
}
.bubble.is-capped { background: var(--c-warning); }
.bubble.is-capped::after { border-top-color: var(--c-warning); }
.progress-bar-container {
height: 12px;
background: var(--c-track);
border-radius: var(--r-md);
overflow: hidden;
}
.progress-bar-fill {
height: 100%;
background: linear-gradient(90deg, var(--theme-color, var(--c-primary)), var(--theme-gradient-end, #64b5f6));
border-radius: var(--r-md);
transition: width var(--t-slow) var(--ease);
width: var(--progress, 0%);
}
.progress-bar-fill.level-low  { background: var(--c-warning); }
.progress-bar-fill.level-mid  { background: var(--c-primary); }
.progress-bar-fill.level-high { background: var(--c-success); }
.progress-tx-container {
margin-top: var(--sp-2);
font-size: var(--fs-base);
color: var(--c-text-muted);
}
.indicator-type-badge {
display: inline-block;
padding: var(--sp-1) var(--sp-2);
border-radius: var(--r-sm);
font-size: var(--fs-xs);
font-weight: var(--fw-medium);
margin-right: var(--sp-1);
}
.indicator-type-badge.badge-quantitative,
.indicator-type-badge.quantitative { background: var(--c-success-light); color: var(--c-success-dark); }
.indicator-type-badge.badge-qualitative,
.indicator-type-badge.qualitative { background: #fce4ec; color: #c2185b; }
.table__wr.edit-mode table {
border: 2px solid var(--theme-color, var(--c-primary));
}
.table__wr.edit-mode tbody tr:not(.new-row):not(.modified-row):not(.deleted-row):not(.dragging):not(.drag-over-child) {
background-color: #fafbff !important;
}
.indicator-row.dragging {
opacity: 0.5;
background: var(--theme-light, var(--c-primary-light)) !important;
}
.indicator-row.drag-over {
border-top: 2px solid var(--theme-color, var(--c-primary));
}
.indicator-row.drag-over-bottom {
border-bottom: 2px solid var(--theme-color, var(--c-primary));
}
.indicator-row.deleted-row {
opacity: 0.4;
text-decoration: line-through;
}
.indicator-row.new-row {
background-color: var(--c-success-light) !important;
}
.drag-handle {
cursor: grab;
color: var(--c-text-faint);
margin-right: var(--sp-2);
user-select: none;
}
.drag-handle:active {
cursor: grabbing;
}
.indicator-name-cell {
display: flex;
flex-direction: column;
gap: var(--sp-1);
align-items: flex-start;
}
.indicator-name-input {
width: 100%;
padding: 6px var(--sp-2);
border: 1px solid var(--c-border-strong);
border-radius: var(--r-sm);
font-size: var(--fs-base);
background: var(--c-surface);
}
.indicator-name-input:focus {
border-color: var(--theme-color, var(--c-primary));
outline: none;
}
.add-row-btn {
display: none;
padding: 2px var(--sp-2);
font-size: var(--fs-xs);
color: var(--c-text-muted);
background: var(--c-surface-sunken);
border: 1px dashed var(--c-border-strong);
border-radius: var(--r-sm);
cursor: pointer;
}
.add-row-btn:hover {
background: var(--c-surface-hover);
color: var(--c-text-body);
}
.table__wr.edit-mode .add-row-btn {
display: inline-block;
}
.delete-indicator-btn {
padding: var(--sp-1) var(--sp-2);
font-size: var(--fs-sm);
color: var(--c-danger);
background: transparent;
border: 1px solid var(--c-danger);
border-radius: var(--r-sm);
cursor: pointer;
}
.delete-indicator-btn:hover {
background: var(--c-danger-light);
}
.btn-group {
display: flex;
gap: var(--sp-2);
}
.btn-group .main__btn {
padding: var(--sp-2) var(--sp-4);
border-radius: var(--r-sm);
font-size: var(--fs-base);
cursor: pointer;
}
.btn-group .main__btn.edit { background: var(--theme-color, var(--c-primary)); color: var(--c-text-inverse); }
.btn-group .main__btn.delete { background: var(--c-danger-dark); color: var(--c-text-inverse); }
.btn-group .main__btn.secondary { background: var(--c-surface-sunken); color: var(--c-text-muted); }
.btn__group {
display: flex;
gap: var(--sp-2);
justify-content: flex-end;
margin-top: var(--sp-5);
}
.attachment-link {
color: var(--c-primary-dark);
text-decoration: none;
font-size: var(--fs-sm);
}
.attachment-link:hover {
text-decoration: underline;
}
.no-attachment {
color: var(--c-text-faint);
font-size: var(--fs-sm);
}
.completion-checkbox {
width: 18px;
height: 18px;
cursor: pointer;
}
.download-btn {
display: inline-flex;
align-items: center;
gap: var(--sp-1);
padding: 6px var(--sp-3);
background: var(--c-surface-sunken);
border-radius: var(--r-sm);
color: var(--c-text-body);
text-decoration: none;
font-size: var(--fs-base);
}
.download-btn:hover {
background: var(--c-surface-hover);
}
.download-btn img {
width: 16px;
height: 16px;
}
.file-input-wrapper {
display: flex;
align-items: center;
gap: var(--sp-2);
}
.file-select-btn {
padding: var(--sp-1) var(--sp-3);
font-size: var(--fs-sm);
background: var(--c-surface-sunken);
border: 1px solid var(--c-border-strong);
border-radius: var(--r-sm);
cursor: pointer;
white-space: nowrap;
}
.file-select-btn:hover {
background: var(--c-surface-hover);
}
.file-name-display {
color: var(--c-text-faint);
font-size: var(--fs-sm);
}
.edit-responsible-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: var(--sp-1);
border-radius: var(--r-sm);
transition: background var(--t-base) var(--ease);
}
.edit-responsible-btn:hover {
background: var(--c-surface-sunken);
}
.member-item {
display: flex;
align-items: center;
padding: var(--sp-3);
border-bottom: 1px solid var(--c-border);
cursor: pointer;
transition: background var(--t-base) var(--ease);
}
.member-item:last-child {
border-bottom: none;
}
.member-item:hover {
background: var(--c-surface-sunken);
}
.member-item.selected {
background: var(--theme-light, var(--c-primary-light));
}
.member-item .profile-img {
width: 40px;
height: 40px;
border-radius: var(--r-round);
object-fit: cover;
margin-right: var(--sp-3);
}
.member-item .member-info {
flex: 1;
}
.member-item .member-name {
font-weight: var(--fw-semibold);
color: var(--c-text-body);
margin-bottom: 2px;
}
.member-item .member-org {
font-size: var(--fs-sm);
color: var(--c-text-faint);
}
.member-item .check-mark {
color: var(--theme-dark, var(--c-primary-dark));
font-size: var(--fs-xl);
display: none;
}
.member-item.selected .check-mark {
display: inline;
}
.history-list { max-height: 400px; overflow-y: auto; }
.history-item { padding: var(--sp-3); border-bottom: 1px solid var(--c-border); }
.history-item:last-child { border-bottom: none; }
.history-item .date { font-size: var(--fs-sm); color: var(--c-text-faint); }
.history-item .action { font-weight: var(--fw-semibold); margin: var(--sp-1) 0; }
.history-item .user { font-size: var(--fs-base); color: var(--c-text-muted); }
.history-item .target { font-size: var(--fs-base); color: var(--c-text-body); margin-top: var(--sp-1); }
.history-item__reason { margin-top: var(--sp-1); font-size: var(--fs-sm); color: var(--c-text-muted); }
.history-item__summary { margin-top: var(--sp-1); font-size: var(--fs-sm); color: var(--c-text-body); }
#edit-output-title-modal:not(.active),
#edit-outcome-title-modal:not(.active),
#edit-date-modal:not(.active),
#history-modal:not(.active) { display: none !important; }
.indicator-type-section {
margin-bottom: var(--sp-8);
}
.pod-section-indicator {
margin-bottom: var(--sp-6);
}
.pod-section-indicator:last-child {
margin-bottom: 0;
}
.linked-indicator-tag {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 6px var(--sp-3);
background: var(--theme-light, var(--c-primary-light));
border-radius: var(--r-pill);
font-size: var(--fs-base);
color: var(--theme-dark, var(--c-primary-dark));
}
.linked-indicator-tag .remove-btn {
background: none;
border: none;
color: var(--theme-dark, var(--c-primary-dark));
cursor: pointer;
font-size: var(--fs-lg);
line-height: 1;
}
.linked-indicator-tag .remove-btn:hover {
color: var(--c-danger-dark);
}
.available-indicator-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: var(--sp-3);
border-bottom: 1px solid var(--c-border);
cursor: pointer;
transition: background var(--t-base) var(--ease);
}
.available-indicator-item:last-child {
border-bottom: none;
}
.available-indicator-item:hover {
background: var(--c-surface-sunken);
}
.available-indicator-item .indicator-info {
flex: 1;
}
.available-indicator-item .indicator-name {
font-weight: var(--fw-medium);
color: var(--c-text-body);
margin-bottom: 2px;
}
.available-indicator-item .indicator-def {
font-size: var(--fs-sm);
color: var(--c-text-faint);
}
.loading, .error {
text-align: center;
padding: var(--sp-10) var(--sp-5);
color: var(--c-text-muted);
}
.error { color: var(--c-danger); }
.empty,
.chat-empty,
.no-history,
.day-list-empty,
.notification-empty-page,
.empty-row td,
.empty__project__row td {
padding: var(--sp-10) var(--sp-5);
text-align: center;
color: var(--c-text-faint);
font-size: var(--fs-base);
}
.notification-empty,
.empty-favorites,
.ss-no-result,
.pdm-live-empty {
padding: var(--sp-6) var(--sp-4);
text-align: center;
color: var(--c-text-faint);
font-size: var(--fs-base);
}
.responsible-card.empty {
padding: var(--sp-5);
}
:where(.output-detail-page, .outcome-detail-page, .activity-detail-page) .table__wr tbody tr,
:where(.output-detail-page, .outcome-detail-page, .activity-detail-page) .table__wr tbody tr.add__list,
:where(.output-detail-page, .outcome-detail-page, .activity-detail-page) .table__wr tbody tr.indicator-row {
background-color: var(--c-surface) !important;
}
.indicator-section {
margin-top: var(--sp-6);
}
.indicator-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: var(--sp-4);
}
.indicator-table {
width: 100%;
border-collapse: collapse;
}
.indicator-table th,
.indicator-table td {
padding: var(--sp-3);
text-align: center;
border: 1px solid var(--c-border);
}
.indicator-table th {
color: var(--c-text-body);
}
.indicator-table td {
color: var(--c-text-muted);
}
.indicator-table td.value {
font-weight: var(--fw-semibold);
color: var(--c-text-body);
}
.indicator-table td.left-align {
text-align: left;
}
.form__group { margin-bottom: var(--sp-4); }
.form__group label {
display: block;
margin-bottom: var(--sp-2);
font-weight: var(--fw-medium);
color: var(--c-text-body);
}
.detail-nav {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--sp-3);
flex-wrap: wrap;
margin-top: calc(var(--sp-4) * -1);
margin-bottom: var(--sp-2);
}
.detail-nav__siblings {
display: inline-flex;
align-items: center;
gap: var(--sp-2);
}
.detail-nav__back,
.detail-nav__step {
display: inline-flex;
align-items: center;
gap: var(--sp-1);
height: var(--h-control-sm);
padding: 0 var(--sp-3);
border-radius: var(--r-sm);
font-size: var(--fs-md);
line-height: var(--lh-tight);
color: var(--c-text-body);
text-decoration: none;
white-space: nowrap;
transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
}
.detail-nav__back[hidden],
.detail-nav__step[hidden] { display: none; }
.detail-nav__back {
padding-left: 0;
color: var(--main-color02);
text-decoration: underline;
text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
text-underline-offset: 3px;
}
.detail-nav__back:hover,
.detail-nav__back:focus-visible {
color: var(--c-primary-dark);
text-decoration-color: currentColor;
}
.detail-nav__step {
border: 1px solid var(--c-border-strong);
background: var(--c-surface);
color: var(--c-text-muted);
}
.detail-nav__step:hover {
border-color: var(--c-primary);
color: var(--c-primary-dark);
}
.detail-nav__back:focus-visible,
.detail-nav__step:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 2px;
}

/* ==== /css/common/button.css ==== */
.main__btn.primary {
background: var(--c-primary-dark);
border-color: var(--c-primary-dark);
color: var(--c-text-inverse);
font-weight: var(--fw-semibold);
}
.main__btn.primary:hover {
background: var(--c-primary);
border-color: var(--c-primary);
}
.main__btn.cancel {
background: var(--c-surface-sunken);
border-color: var(--c-surface-sunken);
color: var(--c-text-muted);
}
.main__btn.cancel:hover {
background: var(--c-surface-hover);
color: var(--c-text-body);
}
.main__btn.danger {
background: var(--c-danger);
border-color: var(--c-danger);
color: var(--c-text-inverse);
}
.main__btn.danger:hover {
background: var(--c-danger-dark);
border-color: var(--c-danger-dark);
}
.main__btn.danger-ghost {
background: var(--c-surface-sunken);
border-color: var(--c-surface-sunken);
color: var(--c-danger-dark);
}
.main__btn.danger-ghost:hover {
background: var(--c-danger-light);
}
.main__btn.sm {
height: var(--h-control-sm);
line-height: calc(var(--h-control-sm) - 2px);
padding: 0 var(--sp-3);
font-size: var(--fs-sm);
}
.main__btn:focus-visible,
.btn:focus-visible,
.popup__close__btn:focus-visible,
.delete-row-btn:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 2px;
}
.delete-row-btn {
display: none;
position: absolute;
right: 6px;
width: 20px;
height: 20px;
padding: 0;
border: none;
border-radius: var(--r-round);
background: transparent;
color: var(--c-text-faint);
font-family: inherit;
font-size: var(--fs-md);
font-weight: var(--fw-bold);
line-height: 1;
text-align: center;
cursor: pointer;
transition: background var(--t-base) var(--ease), color var(--t-base) var(--ease);
}
.delete-row-btn:hover {
background: var(--c-danger);
color: var(--c-text-inverse);
}
.edit-mode .delete-row-btn {
display: inline-flex;
align-items: center;
justify-content: center;
}

/* ==== /css/pages/sidebar-calendar-chat.css ==== */
.aside-head {
position: relative;
height: 0;
z-index: 3;
}
.aside-head__btn,
.aside-reopen-tab {
display: flex;
align-items: center;
justify-content: center;
border: none;
background: var(--c-surface-muted);
border-radius: var(--r-sm);
color: var(--main-color01);
cursor: pointer;
transition: background 0.2s;
}
.aside-head__btn {
position: absolute;
right: 8px;
width: var(--h-control-xs);
height: var(--h-control-xs);
flex-shrink: 0;
}
.aside-head--calendar .aside-head__btn { top: 36px; }
.aside-head--widget .aside-head__btn { top: 66px; }
.entity-detail-sidebar > .chat-box-component > .fixed__mnav__box:first-child > .sub__title02,
.activity-datepicker > .chat-box-component > .fixed__mnav__box:first-child > .sub__title02,
.schedule-side__wr > .fixed__mnav__box:first-child > .sub__title02 {
padding-right: 40px;
}
.aside-head__btn:hover,
.aside-reopen-tab:hover {
background: #e5e5e5;
}
.aside-head__btn:focus-visible,
.aside-reopen-tab:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 2px;
}
.aside-reopen-tab {
display: none;
position: absolute;
left: calc(-40px - 1px);
top: 24px;
width: 40px;
height: 40px;
border: 1px solid var(--c-border);
border-right: 0;
border-radius: var(--r-sm) 0 0 var(--r-sm);
background: var(--c-surface);
}
body.aside-collapsed .aside-reopen-tab {
display: flex;
}
@media screen and (max-width: 1024px) {
body.aside-collapsed .aside-reopen-tab {
display: none;
}
}
.calendar-toggle-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 48px 12px 16px;
border-bottom: 1px solid var(--line01);
background: #fff;
}
.calendar-toggle-title {
font-size: 14px;
font-weight: 600;
color: var(--main-color02);
text-decoration: underline;
text-underline-offset: 3px;
text-decoration-thickness: 1px;
}
.calendar-toggle-title:hover {
color: var(--c-primary-dark);
text-decoration-thickness: 2px;
}
.calendar-toggle-title:focus-visible {
outline: 2px solid var(--c-primary);
outline-offset: 2px;
border-radius: var(--r-sm);
}
.calendar-toggle-btn {
display: flex;
align-items: center;
justify-content: center;
width: var(--h-control-xs);
height: var(--h-control-xs);
border: none;
background: var(--c-surface-muted);
border-radius: var(--r-sm);
cursor: pointer;
transition: background 0.2s, transform 0.3s;
}
.calendar-toggle-btn:hover {
background: #e5e5e5;
}
.calendar-toggle-btn.collapsed svg {
transform: rotate(180deg);
}
.calendar-section {
overflow: hidden;
transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
max-height: 600px;
opacity: 1;
}
.calendar-section.collapsed {
max-height: 0;
opacity: 0;
border-bottom: none;
}
.fixed__menu__wr.right .flatpickr-calendar.inline {
max-width: 100% !important;
width: 100% !important;
box-sizing: border-box;
}
.fixed__menu__wr.right .flatpickr-innerContainer {
width: 100%;
justify-content: center;
}
.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) !important;
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;
}
.sidebar-event-list {
max-height: 200px;
overflow-y: auto;
border: 0;
}
.sidebar-event-list li.flex__style {
padding: 12px 16px;
border-bottom: 1px solid var(--line01);
cursor: pointer;
transition: background 0.2s;
}
.sidebar-event-list li.flex__style:hover {
background: #f9f9f9;
}
.sidebar-event-list li.flex__style:last-child {
border-bottom: none;
}
.sidebar-event-list .event-empty,
.sidebar-event-list .event-loading {
text-align: center;
padding: var(--sp-5);
color: var(--c-text-faint);
font-size: 13px;
}
.sidebar-event-list .event-list__head {
padding: var(--sp-2) 0 var(--sp-1);
border-bottom: 1px solid var(--line01);
margin-bottom: var(--sp-1);
}
.sidebar-event-list .event-empty__date {
font-size: var(--fs-base);
color: var(--c-text-muted);
}
.sidebar-event-list .event-empty__text {
margin-top: var(--sp-1);
}
.sidebar-event-list .event-retry {
display: inline-block;
margin-top: 6px;
color: var(--c-primary-dark);
}
.sidebar-event-list .event-color-dot {
width: 8px;
height: 8px;
border-radius: 50%;
margin-right: 8px;
flex-shrink: 0;
background: var(--c-primary-dark);
}
.fixed__menu__wr.right .flatpickr-day {
position: relative;
}
.fixed__menu__wr.right .flatpickr-day .event-dot {
position: absolute;
bottom: 2px;
left: 50%;
transform: translateX(-50%);
width: 4px;
height: 4px;
border-radius: var(--r-round);
background: var(--c-primary-dark);
}
.sidebar-event-list .event-info {
flex: 1;
min-width: 0;
}
.sidebar-event-list .event-title {
font-size: 13px;
color: var(--main-color01);
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sidebar-event-list .event-time {
font-size: 12px;
color: var(--main-color03);
margin-top: 2px;
}
.sidebar-event-list .event-type-badge {
font-size: 10px;
padding: 2px 6px;
border-radius: 10px;
background: #f0f0f0;
color: #666;
margin-left: 8px;
flex-shrink: 0;
}
.chat-target-name {
margin-left: var(--sp-2);
font-size: var(--fs-base);
font-weight: 500;
color: var(--c-text-muted);
display: inline-block;
max-width: 170px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: bottom;
}
.chat-target-name:empty {
display: none;
}
.aside-recent-chats {
display: flex;
flex-direction: column;
flex: 1 1 auto;
min-height: 0;
padding: 16px;
}
.aside-recent-chats .recent-chats-list {
flex: 1 1 auto;
min-height: 0;
max-height: none;
overflow-y: auto;
}

/* ==== /css/pages/business-tabs.css ==== */
.business-tabs {
display: flex;
gap: var(--sp-2);
margin-bottom: var(--sp-5);
padding: 0;
}
.business-tabs .tab-item {
display: inline-flex;
align-items: center;
height: var(--h-control);
padding: 0 var(--sp-6);
font-size: var(--fs-lg);
font-weight: var(--fw-medium);
color: var(--c-text-muted);
text-decoration: none;
border-radius: var(--r-sm);
transition: background 0.2s ease, color 0.2s ease;
}
.business-tabs .tab-item:hover {
background: var(--c-surface-sunken);
color: var(--c-text);
}
.business-tabs .tab-item.active {
background: var(--main-color01);
color: var(--c-text-inverse);
}

/* ==== /css/common/icon-box.css ==== */
.sic {
display: inline-block;
flex-shrink: 0;
width: 24px;
height: 24px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
vertical-align: middle;
}
.sic-star-sm { width: 16px; height: 16px; }
.sic-logo { width: 70px; height: 70px; }