How to change Group task background color?

The shape of the task group is created using :before and :after pseudo-elements.

In the default theme it looks like this:

.gantt_default_task_group .gantt_default_event_inner {
    position: absolute;
    top: 5px;
    left: 0px;
    right: 0px;
    bottom: 6px;
    overflow: hidden;
    background: #0b5394;
    filter: none;
    border: 0px none;
}

.gantt_default_task_group.gantt_default_event:before {
    content: '';
    border-color: transparent transparent transparent #0b5394;
    border-style: solid;
    border-width: 6px;
    position: absolute;
    bottom: 0px;
}

.gantt_default_task_group.gantt_default_event:after {
    content: '';
    border-color: transparent #0b5394 transparent transparent;
    border-style: solid;
    border-width: 6px;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

When you set the color using backColor property these styles are overridden using inline styles.

If you want to change the color using a custom CSS class, you need to define these pseudo-elements for your class in the global scope.