.counter-style1 {
  margin-bottom: 22px;
  
  .counter-number {
    border-bottom: 5px solid $theme-color;
    display: block;
    width: max-content;

    &.h1 {
      margin-top: -0.3em;
    }
  }

  .counter-text {
    line-height: 26px;
    font-size: 16px;
    color: $title-color;
    margin-bottom: 0;
  }
}

.counter-wrap1 {
  background-color: #FAFAFA;
  position: relative;
  padding: 318px 20px 70px 20px;
  margin: -238px 0 30px 0;

  .shape-dotted {
    position: absolute;
    right: -30px;
    bottom: -33px;
    z-index: -1;
  }
}

@include ml {
  .counter-wrap1 {
    .shape-dotted {
      right: -20px;
    }
  }
}

@include lg {
  .counter-style1 {
    .counter-number {
      width: 100%;
    }
  }

  .counter-wrap1 {
    padding: 150px 30px 20px 30px;
    margin: -100px 0 30px 0;
  }
}

@include sm {
  .counter-wrap1 {
    padding: 40px 20px 10px 20px;
    margin: 0 0 30px 0;

    .shape-dotted {
      right: 0;
      bottom: -23px;
    }
  }
}