¿Cómo dirigiría este div usando CSS?

En este caso particular, podría usar el combinador de hermanos adyacente , +.

EJEMPLO AQUÍ

.b + .b {
   color:red;
}

Lo anterior asume que no hay más de dos elementos .b adyacentes. Si este no fuera el caso, el combinador general de hermanos , ~, sería más útil suponiendo que todavía hay solo dos elementos .b.

EJEMPLO AQUÍ

.b ~ .b {
    color:red;
}

Como alternativa, también podría utilice lo siguiente, que funcionará con múltiples elementos .b, independientemente de la posición. Inicialmente, use .b ~ .b para establecer el estilo del segundo elemento objetivo. Entonces necesitará usar .b ~ .b ~ .b para restablecer el estilo de los elementos .b después del segundo elemento .b.

EJEMPLO AQUÍ

.b ~ .b {
    color:red;
}
.b ~ .b ~ .b {
    color:initial;
}

Esto debería funcionar teóricamente en todos los casos, por ejemplo:

<div class="a">1a</div>
<div class="a">2a</div>
<div class="a">3a</div>
<div class="b">1b</div>
<div class="a">4a</div>
<div class="b">2b</div> <!-- This would be styled red.. -->
<div class="b">3b</div>

También vale la pena señalar que el valor initial no se admite en IE. Por lo tanto, podría usar color:#000 para restablecer el color a los valores predeterminados. Alternativamente, inherit funcionaría también.

Como un ejemplo más práctico, podrías usar algo como esto:

EAXMPLE AQUÍ

.b ~ .b {
    width:200px;
    background:blue;
    color:#fff;
}
.b ~ .b ~ .b {
    width:auto;
    background:transparent;
    color:#000;
}