Снимите отметку с дочерних флажков в других группах при установке нескольких дочерних флажков в текущей группе

Я создал родительский дочерний флажок. Когда родительский флажок установлен, дочерние флажки будут видны, где можно установить несколько флажков.

Но я хочу снять флажки дочерних элементов в других группах. Таким образом, вам разрешено устанавливать несколько флажков только в определенной группе одновременно. Поскольку я хочу сохранить только подгруппу значений флажка.

См. настройку ниже для настройки флажка родительского дочернего элемента.

<ul class = "acf-checkbox-list acf-bl">
<li data-id = "354"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "354"> <span>topic 1</span></label><ul class = "children acf-bl" style = "display: block;">
<li data-id = "377"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "377"> <span>subtopic a </span></label></li>
<li data-id = "361"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "361"> <span>subtopic  b</span></label></li>
<li data-id = "366"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "366"> <span>subtopic  c</span></label></li>
</ul>
</li>
<li data-id = "372"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "372"> <span>topic 2</span></label><ul class = "children acf-bl">
<li data-id = "389"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "389"> <span>subtopic x</span></label></li>
<li data-id = "399"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "399"> <span>subtopic  y</span></label></li>
</ul>
</li>
<li data-id = "373"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "373"> <span>Topic 3</span></label><ul class = "children acf-bl">
<li data-id = "410"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "410"> <span>subtopic 1</span></label></li>
<li data-id = "412"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "412"> <span>subtopic 2 </span></label></li>
<li data-id = "409"><label><input type = "checkbox" name = "acf[field_63fb5f54847a5][]" value = "409"> <span>subtopic 3</span></label></li>
</ul>
</li>
</li>
</ul>

const checkbox = document.querySelectorAll('.acf-checkbox-list > li > label > input');
checkbox.forEach(function(checkitem){
var value = checkitem.value;
checkitem.addEventListener('click', (event) => {
const parentli = document.querySelector('[data-id = "'+value+'"]').querySelector('.children');
if (checkitem.checked) {
parentli.style.display = "block";
}
else {
parentli.style.display = "none";
}
})
});

.children {
  
  display:none;
}

Заранее спасибо!