JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
    <p><input type="checkbox" class="main">00</p>
    <input type="checkbox" data-price="100">01
    <input type="checkbox" data-price="150">02
    <input type="checkbox" data-price="180">03
</div>
<div class="block">
    <p><input type="checkbox" class="main">00</p>
    <input type="checkbox" data-price="250">01
    <input type="checkbox" data-price="55">02
    <input type="checkbox" data-price="75">03
</div>
<output></output>

CSS

.block {
    display: inline-block;
    padding: 10px;
    border: 1px solid #999;
}
output {
    display: block;
}

JavaScript

var allChbx = [],
    out = document.querySelector('output');
[].forEach.call(document.querySelectorAll('.block'), function(group){
    var main = group.querySelector('.main'),
        chbx = group.querySelectorAll('input[type=checkbox]:not(.main)');
    allChbx = allChbx.concat([].slice.call(chbx));
    main.addEventListener('change', function(){
        var stat = this.checked;
        [].forEach.call(chbx, function(el){
            el.checked = stat;
        });
        reCalc();
    });
    [].forEach.call(chbx, function(el){
        el.addEventListener('change',function(){
            var cnt = [].filter.call(chbx, function(el){
                return el.checked == true;
            }).length;
            main.checked = cnt > 0;
            reCalc();
        }, false);
    });
});
function reCalc(){
    var total = 0;
    allChbx.forEach(function(c){
        total += c.checked == true ? +c.dataset.price : 0;
    });
    out.innerHTML = 'Итого: <b>' + total + '</b> тугриков';
}