номер списка перемещается на вторую строку

Question

Можно ли сказать мне, почему в наших списках номеров номер помещается во второй строке копии, когда измеряется для мобильных устройств? Если код нужен, я могу это предоставить. Скриншот ниже вопроса. Я добавил больше кода к этому. Часть кода включает CSS, используемый для стилей ul li. Может быть, это мешает?

.tablecontents, .table-note {
    line-height: 1.75em;
    font-family: soleil, sans-serif;
    font-weight: 500;
 	color: #34393a;
    padding: 35px 40px 15px 30px;
	margin-bottom: 35px !important;
    background-color: rgba(240, 242, 245, 1);
	border-radius: 5px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.08);
  a{
    color: #34393a !important;
    line-height: 1.5em;
    border-bottom: 2px solid #bfccd0 !important;
  }
  a:hover{
        color: #00ba74 !important;
  }
  a:after {
      bottom: -2px !important;
      
}
}

.tablecontents-title {
	letter-spacing: 1px;
  	line-height: 1em;
    color: #34393a;
    font-family: soleil, sans-serif;
    font-weight: 600;
    margin: 0 0 15px;
}

ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #00ba74; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: .75em; /* Also needed for space (tweak if needed) */
  margin-left: -.5em; /* Also needed for space (tweak if needed) */
  vertical-align: middle;
  font-size: 26px;
  margin-top: -10px;
  @include media-query($medium-up) {
    font-size: 32px;
  }
} 

/*================ Partials | Lists ================*/
ul, ol {
  margin: 0 0 ($gutter / 2) ($gutter);
  padding: 0;
  text-rendering: optimizeLegibility;
}

ol ol {
  list-style: lower-alpha;
}

ol { list-style: decimal;}

ul ul, ul ol,
ol ol, ol ul { margin: 4px 0 5px 20px; }

li { margin-bottom: 0.25em; }

ul.square { list-style: square outside; }

ul.disc { list-style: disc outside; }

ol.alpha { list-style: lower-alpha outside; }

.no-bullets {
  list-style: none outside;
  margin-left: 0;
}

.inline-list {
  padding: 0;
  margin: 0;

  li {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
}

<div class="tablecontents">
<div class="tablecontents-title"><span>In this article</span></div>
<ol>
<li><a href="#1">The Science Behind Protein Absorption </a></li>
<li><a href="#2">How Long Does Protein Take to Absorb? </a></li>
<li><a href="#3">How Much Protein Can You Absorb Per Meal? </a></li>
<li><a href="#4">How Much Protein Can You Absorb Per Day? </a></li>
<li><a href="#5">Protein Absorption: Practical Takeaways </a></li>
<li><a href="#6">The Bottom Line </a></li>
</ol>
</div>