JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="modal-body">
  <div>Срок абонимента</div>
  <div class="btn-group" role="radio">
    <label class="btn btn-default period_radio">
      <input type="radio" name="period" value="1" required>1 день
    </label>
    <label class="btn btn-default period_radio">
      <input type="radio" name="period" value="2" required>1 месяц
    </label>
    <label class="btn btn-default period_radio">
      <input type="radio" name="period" value="3" required>2 месяца
    </label>
    <label class="btn btn-default period_radio">
      <input type="radio" name="period" value="4" required>3 месяца
    </label>
  </div>
  <div class="form-group season_unlimit-hidden">
    <input type="checkbox" name="unlimited" id="unlimit">
    <label for="unlimit">Безлимитный</label>
  </div>
  <div class="form-group season_number">
    <input type="number" class="form-control" name="number" placeholder="Количество занятий" required>
  </div>
  <div class="form-group">
    <input type="number" class="form-control" name="sum" placeholder="Сумма абонимента" required>
  </div>
</div>

SCSS

.period_radio{
  input[type=radio]{
    opacity: 0;
  }
}
.season_unlimit-hidden{
  display: none;
}

.season_unlimit-disabled{
  display: block;
}

.season_number{
  display: none;
}

.season_number-hidden{
  display: block;
}

JavaScript

$('body').on('click', '.period_radio', function(){
  $('.period_radio.active').removeClass('active');
  $(this).addClass('active');

  if($(this).children().val() != 1){
    $('.season_unlimit-hidden').addClass('season_unlimit-disabled').removeClass('season_unlimit-hidden');
    $('.season_number').addClass('season_number-hidden').removeClass('season_number');
  }
  if($(this).children().val() == 1){
    $('.season_unlimit-disabled').addClass('season_unlimit-hidden').removeClass('season_unlimit-disabled');
    $('.season_number-hidden').addClass('season_number').removeClass('season_number-hidden');
  }
});
$('body').on('change', '#unlimit', function () {
  if($('#unlimit').is(':checked')){
    $('.season_number-hidden').addClass('season_number').removeClass('season_number-hidden');
  } else {
    $('.season_number').addClass('season_number-hidden').removeClass('season_number');
  }
})