<div class="header__menu">
<div class="mega-menu flex-container">
    <ul class="top-list flex-container">
    
           <li class="top-list__item">
               <a href="#">2 пункт</a>
            <ul class="top-list__sublist">
                 <li><a href="#">подпунк мегаменю</a></li>
                <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
                <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
            </ul>
        </li>
   
           <li class="top-list__item">
               <a href="#">5 пункт</a>
            <ul class="top-list__sublist">
                 <li><a href="#">подпунк мегаменю</a></li>
                <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
               <li><a href="#">подпунк мегаменю</a></li>
            </ul>
        </li>
    </ul>
</div>
</div>

<div class="container">
  <p>
  Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов. Lorem Ipsum не только успешно пережил без заметных изменений пять веков, но и перешагнул в электронный дизайн. Его популяризации в новое время послужили публикация листов Letraset с образцами Lorem Ipsum в 60-х годах и, в более недавнее время, программы электронной вёрстки типа Aldus PageMaker, в шаблонах которых используется Lorem Ipsum.
</p>
<p>
  Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов. Lorem Ipsum не только успешно пережил без заметных изменений пять веков, но и перешагнул в электронный дизайн. Его популяризации в новое время послужили публикация листов Letraset с образцами Lorem Ipsum в 60-х годах и, в более недавнее время, программы электронной вёрстки типа Aldus PageMaker, в шаблонах которых используется Lorem Ipsum.
</p>
</div>

.flex-container{
  display: flex;
  width:100%;
      padding: 0px;
      list-style: none;
}
.container{
max-width:1000px;
 width:100%;
  margin:0 auto;
}
.mega-menu{
  width: 1000px;
  height:100%;
      margin: 0 auto;
  border:1px #cc0000 solid;
}
.header__menu {
    z-index: 2;
    font-size: 18px;
    background-color: #333;
  color:#fff;
}
.top-list__item{
  flex:1;
  width:100%;
}
.top-list__item a{
  color:#fff;
      padding: 0 30px 0 0;
}

.top-list__item.active a{
  color:#cc0000;
}

.header__menu {
    position: relative;
}

.header__menu::febore{
  background:#000;
  height:100%;
  width:100%;
  content:'';
  position:absolute;
}

.top-list__sublist {
    display: none;
        top: 100%;
    padding-bottom: 54px;
  padding-right: 30px;
      position: absolute;
    background: #333;
}
.active .top-list__sublist {
    display: block;
}
.top-list__sublist a{
  padding:0px;
}

  //top-nav
  $('.mega-menu').on('click', '.top-list__item > a', function () {
    /*
    $('.mega-menu .top-list__item').removeClass('active');
    if ($(this).parent().hasClass('active')) {
     $(this).parent().removeClass('active');
   } else {
    $(this).parent().addClass('active');
    }
    */
      $(this).closest('li').toggleClass('active').siblings().removeClass('active');
    
  });