.step-schematic {
  margin: 0 auto 16px;
  padding-left: 0;
}

.step-schematic__item {
  text-align: center;
}

.step-schematic__item:not(:last-child)::after {
  content: '';
  display: block;
  background: url("../images/step-arrow.png") no-repeat center;
  background-size: contain;
  width: 76px;
  height: 38px;
  margin: 10px auto;
  text-align: center;
}

@media only screen and (max-width: 640px) {
  .step-schematic {
    margin: 0 auto 10px;
    padding-left: 0;
  }
  .step-schematic__item {
    text-align: center;
  }
  .step-schematic__item:not(:last-child)::after {
    content: '';
    width: calc(76 / 640 * 100%);
    height: 2em;
    margin: 0 auto;
    text-align: center;
  }
  .step-schematic__item img {
    width: 100%;
  }
}