

/*--------------------------------------------------------------------------------*/

.staff-top-container {
    background-color: #5c9f55;

    display: flex;
    justify-content: center;
    align-items: center;

    padding: 20px 15px;

    height: 100px;
}

    .staff-top-content {
        display: flex;
        flex-direction: row;
        gap: 4px;
        justify-content: flex-start;

        height: 26px;
    }

        .staff-top-icon {
            margin-top: 2px;
            height: 26px;
        }
            .staff-top-icon img {
                height: 100%;
            }

        .staff-top-text {
            color: #fff;

            font-size: 20px;
            font-weight: 600;
        }




/*--------------------------------------------------------------------------------*/

.staff-white-container {
    background-color: #fff;
    
    display: block;
    
    padding: 10px 0px;
}



    .staff-item {
        background-color: #EBE4CE;

        display: flex;
        flex-direction: row;

        padding: 12px 21px;

        margin: 10px 10px;
        border-radius: 5px;
    }

        .staff-item .staff-image {
            min-width: 95px;
            max-width: 95px;

            margin-right: 20px;
        }
            .staff-image img {
                width: 100%;

                aspect-ratio: 1/1;
                object-fit: cover;
            }

        .staff-item .staff-profile {
            padding-top: 10px;

            flex-grow: 1;

            display: flex;
            flex-direction: column;
        }

            .staff-profile .staff-name {
                font-size: 20px;
                font-weight: 400;

                color: #333;
            }
            .staff-profile .staff-detail {

                font-size: 15px;
                padding-top: 10px;

                display: flex;
                flex-direction: row;

                color: #333;
            }

                .staff-birthday {
                    margin-right: 20px;
                }

                    .birthday-value {
                        font-size: 16px;
                        font-weight: 500;
                    }
                    .bloodtype-value {
                        font-size: 16px;
                        font-weight: 500;
                    }


/*--------------------------------------------------------------------------------*/
.pagination-container {
    background-color: #fff;
    
    display: flex;
    flex-direction: row;
    gap: 3px;
    justify-content: center;
    align-items: flex-start;
    
    padding: 10px 0px;
}

    .pagination-item {
        display: flex;
        flex-direction: row;

        padding: 0px 12px;
    }

        .pagination-item.active {
            color: #5A9F4E;
        }

        .pagination-item img {
            height: 14px;
            margin-top: 5px;
        }