<ol class="number">
  <li>リスト1
    <ol>
      <li>入れ子のリスト</li>
      <li>入れ子のリスト</li>
    </ol>
  </li>
  <li>リスト2</li>
  <li>リスト3</li>
  <li>リスト4</li>
  <li>リスト5</li>
</ol>

.number {
  list-style: none;
  counter-reset: circle 0; /* カウンターの初期値を０にセット */
  margin:1em;
  padding:0 0 0 3em;
  & > li {
    position:relative;
    line-height:1.6;
    margin:0 0 1em;
  }
  & ol {
    margin:0.5em 0;
  }
  & > li:before {
    position: absolute;
    top: -3px;
    left:-3em;
    width:2em;
    height:2em;
    background:#0068b7;
    content:"";
    display:block;
    border-radius:50%;
    line-height:1;
  }
  & > li:after {
    content: counter(circle) "."; /* 表示形式を指定 */
    counter-increment: circle 1; /* カウンターの値を増加させる */
    display: block;
    color: #fff;
    position: absolute;
    top: 5px;
    left:-2.4em;
    line-height:1;
  }
}