<div class="wrapper">
  <div class="round"><span>01</span></div>
  <div class="round"><span>02</span></div>
  <div class="round"><span>03</span></div>
  <div class="round"><span>04</span></div>
  <div class="round"><span>05</span></div>
</div>

.wrapper {
  display: flex;
  justify-content: flex-start;
  background: #fff;
  .round {
    position: relative;
    font-size: 48px;
    font-family: sans-serif;
    flex-shrink: 0;
    margin: 2rem 20px;
    span {
      position: relative;
      z-index: 3;
      width: 150px;
      height: 150px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0px 10px 25px rgba(145, 161, 171, 0.25);
    }
    &:before {
      content: "";
      position: absolute;
      top: -20px;
      bottom: -20px;
      right: -20px;
      left: -20px;
      display: block;
      border-radius: 50%;
      border: 3px dashed gray;
      z-index: 1;
    }
    &:after {
      content: "";
      position: absolute;
      top: 50%;
      bottom: -20px;
      right: -20px;
      left: -20px;
      display: block;
      background: #fff;
      z-index: 2;
    }
    &:nth-of-type(2n + 1) {
      &:after {
        top: -20px;
        bottom: 50%;
      }
    }
  }
}