select only two checkbox at a time

Question

I have checkbox and I want user to select only two checkbox from each main div. If 2 checkbox are already selected and user tries to select 3rd then first one should be unselected so that we will have only 2 checkbox selected. In below code I have two div class="ps-field col-sm-6" from each div user should only select two checkbox maximum

<div
      class="ps-field col-sm-6"
      data-column="1"
      data-fieldname="course entree maximum 2 choices"
      data-fieldlabel="course entree maximum 2 choices"
    >
    <div class="matrix">
        <div class="matrix-group">
            <div class="radio-group">
                <span
                  class="radio custom-radio custom-radio-primary"
                  style="display: inline-block"
                  >
                  <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                    name="matrix_field_16605982_0"/>
                  <label class="radio-label" for="matrix_field_16605982_0_29936836">Main1</label
                  >
                </span>
              </div>
              <div class="radio-group">
                <span
                  class="radio custom-radio custom-radio-primary"
                  style="display: inline-block"
                  >
                  <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                    name="matrix_field_16605982_0"/>
                  <label class="radio-label" for="matrix_field_16605982_0_29936836">Main2</label
                  >
                </span>
              </div>
              <div class="radio-group">
                <span
                  class="radio custom-radio custom-radio-primary"
                  style="display: inline-block"
                  >
                  <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                    name="matrix_field_16605982_0"/>
                  <label class="radio-label" for="matrix_field_16605982_0_29936836">Main3</label
                  >
                </span>
              </div>
        </div>
    </div>


</div>

<div
      class="ps-field col-sm-6"
      data-column="1"
      data-fieldname="course entree maximum 2 choices"
      data-fieldlabel="course entree maximum 2 choices"
    >
    <div class="matrix">
        <div class="matrix-group">
            <div class="matrix-group">
                <div class="radio-group">
                    <span
                      class="radio custom-radio custom-radio-primary"
                      style="display: inline-block"
                      >
                      <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                        name="matrix_field_16605982_0"/>
                      <label class="radio-label" for="matrix_field_16605982_0_29936836">Main1</label
                      >
                    </span>
                  </div>
                  <div class="radio-group">
                    <span
                      class="radio custom-radio custom-radio-primary"
                      style="display: inline-block"
                      >
                      <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                        name="matrix_field_16605982_0"/>
                      <label class="radio-label" for="matrix_field_16605982_0_29936836">Main2</label
                      >
                    </span>
                  </div>
                  <div class="radio-group">
                    <span
                      class="radio custom-radio custom-radio-primary"
                      style="display: inline-block"
                      >
                      <input id="matrix_field_16605982_0_29936836" type="checkbox" value="Main"
                        name="matrix_field_16605982_0"/>
                      <label class="radio-label" for="matrix_field_16605982_0_29936836">Main3</label
                      >
                    </span>
                  </div>
            </div>
        </div>
    </div>

</div>

js: tried something like this

 $('.matrix').each(function() {
            $('.matrix-group').each(function() {
               
                var count = 0;
                if($('.custom-check-box').is(':checked')) {  }

            });
        });