穿越第4倍后更改div颜色

我有一个scss文件，当它的奇数或偶数时使用nth-child更改颜色。

.e-schedule .e-timeline-month-view .e-work-cells {
  border-bottom: 0px solid $midnight-blue !important;
  &.border-custom {
    border-bottom: 2px solid $midnight-blue !important;
  }
  &:nth-child(odd) {
    background: $bg-gray;
  }
  &:nth-child(even) {
    background: $white;
    &:hover {
      background: $white; // may remove after event CRUD ops
    }
  }
}

我需要的是在4倍（4、8、12 ...）之后更改背景颜色

1,2,3,4-白色

5,6,7,8-灰色

9,10,11,12-白色

13,14,15,16-灰色

...等等

像上面的东西。有人可以帮忙吗？他们有办法使用nth-child吗？还是我需要其他东西。我正在使用Reactjs + SCSS。

注意：由于我正在使用第三方库，因此无法更改div结构。我只能覆盖样式。