JSFiddle - React, Tailwind, and code Playground
HTML
<select name="ramal[]" id="ramal" multiple>
<option value="all" id="check-all" selected>Todas</option>
<option class="check-ramal" value="ramal1">$ramal1</option>
<option class="check-ramal" value="ramal2">$ramal2</option>
<option class="check-ramal" value="ramal3">$ramal3</option>
<option class="check-ramal" value="ramal4">$ramal4</option>
</select>
CSS
select,
option {
padding: 5px;
}
JavaScript
$('#ramal').change(function() {
var todas = this.querySelector('#check-all');
var todasAtivo = this.querySelectorAll('option:checked').length == 1 && todas.selected;
if (!todasAtivo) todas.selected = false;
});