.staff-wrapper *{-webkit-box-sizing:border-box;box-sizing:border-box}
.staff-wrapper .department-box{border:1px solid #e6e6e6;border-radius:5px;margin-bottom:25px}
.staff-wrapper .department-box:not(.active) .staff-box{display:none}
.staff-wrapper .department{font-size:20px;text-align:center;background-color:#f2f2f2;font-weight:700;color:#000;border-bottom:1px solid #e6e6e6;position:relative;cursor:pointer}
.staff-wrapper .department .drop{border:2px solid #000;border-color:#000 #000 transparent transparent;width:6px;height:6px;position:absolute;right:15px;top:10px;-webkit-transform:rotate(135deg);transform:rotate(135deg);-webkit-transition:.3s;transition:.3s}
.staff-wrapper .department.active .drop{top:15px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
.staff-wrapper .staff-box{padding:15px}
.staff-wrapper .staff-box .flex{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-8px;margin-right:-8px}
.staff-wrapper .staff-box .staff-box-item{width:25%;padding:0 8px;-webkit-box-sizing:border-box;box-sizing:border-box;margin-bottom:10px}
.staff-wrapper .staff-box .staff-box-item .staff-card{text-align:center}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-img{border:2px solid var(--color);border-radius:10px;overflow:hidden;cursor:pointer;position:relative;padding-bottom:145%;height:0}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-img img{width:100%;-webkit-transition:.3s;transition:.3s}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-img img:first-child{position:absolute;width:100%;height:100%!important;-o-object-fit:cover;object-fit:cover;left:0;top:0}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-img .hint{position:absolute;right:10px;bottom:10px;width:30px;height:30px}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-img:hover img{-webkit-transform:scale(1.1);transform:scale(1.1)}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-name{font-size:18px;font-weight:700;color:var(--color);line-height:1;margin-top:5px}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-email{font-size:15px}
.staff-wrapper .staff-box .staff-box-item .staff-detail{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);max-width:800px;width:100%;border:1px solid #e6e6e6;border-radius:5px;overflow:hidden;display:none;z-index:99999;background-color:#fff}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-title{background-color:#f2f2f2;padding:0 15px;font-size:20px;font-weight:700;position:relative}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-title .close{position:absolute;right:15px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:20px;height:20px;cursor:pointer}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-title .close div{width:10px;height:2px;-webkit-transform:rotate(45deg);transform:rotate(45deg);background:#000;-webkit-transform-origin:center center;transform-origin:center center;position:absolute;top:50%;left:50%;margin-left:-5px;margin-top:-1px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-title .close div:nth-child(2){-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap{background-color:#fff;padding:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-img{width:180px;border:2px solid var(--color);border-radius:10px;overflow:hidden}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-img img{width:100%}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con{padding-left:15px;width:calc(100% - 180px)}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con .staff-detail-name{font-size:21px;font-weight:700;color:var(--color);line-height:1;margin-bottom:15px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con p{font-size:15px;margin-bottom:5px;line-height:1.3}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con .staff-contact{font-size:16px;font-weight:700}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con .contact-btn{font-size:18px;text-transform:uppercase;background-color:var(--color);padding:0 10px;color:#fff;margin-left:auto;width:100px;text-align:center;margin-top:50px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con .contact-btn a{color:#fff}
@media (max-width:768px){
.staff-wrapper .staff-box .staff-box-item{width:50%}
.staff-wrapper .staff-box .staff-box-item .staff-detail{max-width:90%}
.staff-wrapper .staff-box .staff-box-item .staff-detail{top:70px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.staff-wrapper .department{font-size:18px}
}
@media (max-width:480px){
.staff-wrapper .staff-box .staff-box-item .staff-detail{max-width:90%;max-height:calc(100vh - 60px);overflow:auto}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-img{width:100px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con{width:100%}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con{padding-left:0;margin-top:15px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con p{font-size:12px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap .staff-detail-con .contact-btn{margin-top:20px}
}
.staff-wrapper .staff-box .staff-box-item .staff-card .staff-email a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;width:100%}
.staff-wrapper .staff-box{padding:15px 15px 0 15px}
.staff-wrapper .staff-box .staff-box-item .staff-detail .staff-detail-wrap{-ms-flex-wrap:wrap;flex-wrap:wrap}