@charset "utf-8";

.howtoSteps, .tips {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  -ms-flex-direction:row;
  flex-direction:row;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}
.howtoSteps {
  justify-content: space-evenly;
}
.tips {
  justify-content: flex-start;
}
.eachStep, .eachTips {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  -ms-flex-direction:column;
  flex-direction:column;
}
.eachStep {
  width: 150px;
  margin: 10px 20px;
}
.eachStep .icon {
  position: relative;
  width: 150px;
  height: 160px;
  margin: 0 auto 20px;
}
.eachStep .txt {
  font-size: 16px;
  line-height: 20px;
  text-align: left;
}
.eachTips {
  width: 360px;
  margin: 10px 20px;
}
.eachSTips .icon {
  position: relative;
  width: 360px;
  margin: 0 auto 20px;
}
.eachTips .txt {
  font-size: 16px;
  line-height: 20px;
  text-align: left;
  padding: 0 8px;
}

@media only screen and (max-width: 640px) {
  .eachStep {
    width: 40vw;
    margin: 5vw 2vw;
  }
  .eachStep .icon {
    width: 40vw;
    height: 40vw;
    margin: 0 auto 5vw;
  }
  .tips {
    justify-content: initial;
  }
  .eachTips {
    width: 80vw;
    margin: 5vw 10vw;
  }
  .eachTips .icon {
    width: 80vw;
  }

}