JSFiddle - React, Tailwind, and code Playground

HTML

<div class="howjob">
        <div class="text-center jstep jstep-1">
                <p>Вы оставляете заявку</p>
                <div class="icon-step istep-1"></div>
        </div>
        <div class="text-center jstep jstep-2">
                <p>Связываемся с Вами и подключаем Вас к системе</p>
                <div class="icon-step istep-2"></div>
        </div>
        <div class="text-center jstep jstep-3">
                <p>Вы просматриваете заявки (стоимость просмотра заявки - 5 рублей)</p>
               <div class="icon-step istep-3"></div>
       </div>
       <div class="text-center jstep jstep-4">
               <p>Выкупаете интересные Вам заявки (стоимость получения УНИКАЛЬНОЙ заявки - 150 рублей)</p>
               <div class="icon-step istep-4"></div>
       </div>
       <div class="text-center jstep jstep-5">
               <p>Обрабатываете заявки (связываетесь с клиентами и доводите их до сделки)</p>
               <div class="icon-step istep-5"></div>
       </div>
</div>

CSS

.jstep {
  float: left;
    width: 19%;
    height: 300px;
}
.jstep-1 {
  
}
.jstep-2 {
 margin-top: 20px;
}
.jstep-3 {
  margin-top: 40px;
}
.jstep-4 {
 margin-top: 60px;
}
.jstep-5 {
 margin-top: 120px;
}
.icon-step {
  width: 127px;
    height: 127px;
    border-radius: 100%;
    border: solid 8px rgb(228, 224, 224);
    margin: auto;
}
.istep-1,.istep-2,.istep-3,.istep-4,.istep-5 {
  background-position: center center;      
  background-repeat: no-repeat;      
  background-size: inherit;
}
.istep-1 {
  background-image: url(images/icon/step-1.png);
}
.istep-2 {
  background-image: url(images/icon/step-2.png);
}
.istep-3 {
  background-image: url(images/icon/step-3.png);
}
.istep-4 {
  background-image: url(images/icon/step-4.png);
}
.istep-5 {
  background-image: url(images/icon/step-5.png);
}