.staff-wrap{}
.staff-division{margin:0 0 8rem;}
.staff-division:last-of-type{margin:0;}
.staff-dept-title{font-family:"Roboto",Helvetica;font-weight:var(--font-weight-semibold);font-size:2.8rem;letter-spacing:-0.04rem;line-height:1.4;font-style:normal;color:var(--black100);margin-bottom:4rem}
.staff-dept-sub{font-size:1.8rem;font-weight:var(--font-weight-regular);color:var(--black06);margin-left:0.8rem}
.staff-box{width:100%;margin-bottom:4rem;border-radius:0.4rem;overflow:hidden}
.staff-box:last-of-type{margin:0;}
.staff-header{display:flex;justify-content:space-between;align-items:center;padding:2rem 3rem;background:linear-gradient(135deg,#1e4a8a 0%,#2d5fa8 100%);color:var(--white100);cursor:pointer;user-select:none}
.staff-title{font-family:"Roboto",Helvetica;font-weight:var(--font-weight-semibold);font-size:2rem;letter-spacing:-0.04rem;line-height:1.4;font-style:normal}
.staff-sub{font-size:1.6rem;font-weight:var(--font-weight-regular);margin-left:0.8rem}
.staff-arrow{width:2.4rem;height:2.4rem;object-fit:contain;transition:transform 0.3s ease}
.staff-box.is-active .staff-arrow{transform:rotate(180deg)}
.staff-box:not(.is-active) .staff-list{display:none}
.staff-list{display:flex;flex-wrap:wrap;gap:1.6rem;padding:4rem 0 0;}
.staff-item{position:relative;width:calc(100% / 3 - 1.2rem);height:auto;background-color:var(--white100);border-radius:0.4rem;box-shadow:0 0.2rem 0.4rem var(--black10);transition:all 0.3s ease;overflow:hidden;}
.staff-item.is-tbd{display:flex;align-items:center;justify-content:center;height:24.4rem;background-color:var(--color23)}
.staff-item.is-tbd .staff-name-ko{color:var(--black06);opacity:0.6}
.staff-item-inner{position:relative;z-index:2;padding:4rem;height:100%;display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box}
.staff-item::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;opacity:0;transition:opacity 0.3s ease;z-index:0}
.staff-item::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,69,167,0.6);opacity:0;transition:opacity 0.3s ease;z-index:1}
.staff-item:not(.is-tbd):hover::before{background-image:url("/_res/service/bcci/img/about-us/img-staff-list01.png");opacity:1}
.staff-item:not(.is-tbd):hover::after{opacity:1}
.staff-item:not(.is-tbd):hover .staff-name,.staff-item:not(.is-tbd):hover .staff-name-ko,.staff-item:not(.is-tbd):hover .staff-dept-path,.staff-item:not(.is-tbd):hover .staff-position,.staff-item:not(.is-tbd):hover .staff-link{color:var(--white100)}
.staff-item:not(.is-tbd):hover .staff-icon{filter:brightness(0) invert(1)}
.staff-name{font-family:"Roboto",Helvetica;font-weight:var(--font-weight-semibold);font-size:2.4rem;letter-spacing:-0.04rem;line-height:1.4;font-style:normal;margin-bottom:0.8rem;color:var(--black100);transition:color 0.3s ease}
.staff-name-ko{font-size:1.6rem;font-weight:var(--font-weight-regular);margin-left:0.6rem}
.staff-dept-path{font-size:1.4rem;color:var(--black06);margin-bottom:0.4rem;transition:color 0.3s ease}
.staff-position{font-size:1.4rem;color:var(--black06);margin-bottom:3.2rem;transition:color 0.3s ease}
.staff-contact{display:flex;flex-direction:column;gap:0.8rem;font-style:normal}
.staff-link{display:flex;align-items:center;gap:0.8rem;font-size:1.4rem;color:var(--black03);text-decoration:none;transition:color 0.3s ease}
.staff-icon{width:2.4rem;height:2.4rem;object-fit:contain;transition:filter 0.3s ease}

@media screen and (max-width: 1024.98px) {
    .staff-item{width:100%;}
    .staff-item-inner{padding:3.2rem;}
}