.red {
  color: #ff0000;
}
.green {
  color: #129142;
}
.blue {
  color: #10416b;
}
.s22bx-btnbx {
  width: 440px;
  margin: 20px 0 0 0;
  display: block;
}
.s22btn {
  width: 100%;
  height: 70px;
  background: #3acc0e;
  font-weight: bold;
  font-size: 32px;
  line-height: 70px;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  margin: 0 auto;
  display: block;
  border: none;
  outline: none;
  text-shadow: 1px 1px #32b10c;
}
@media only screen and (max-width: 1000px) {
  .s22bx-btnbx {
    width: 100%;
    margin: 16px 0 0 0;
  }
  .s22btn {
    height: 60px;
    font-size: 26px;
    line-height: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .s22bx-btnbx {
    width: 400px;
    margin: 16px auto 0 auto;
  }
}
@media only screen and (max-width: 479px) {
  .s22bx-btnbx {
    width: 100%;
    margin: 12px auto 0 auto;
  }
}
@media only screen and (max-width: 400px) {
  .s22btn {
    height: 54px;
    font-size: 22px;
    line-height: 54px;
  }
}
/*===============================*/
.show-479,
.show-tab,
.show-767,
.show-400,
.show-340,
.show-359,
.show-389 {
  display: none;
}
@media only screen and (max-width: 1000px) {
  .show-tab {
    display: block;
  }
  .hide-tab {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .hide-767 {
    display: none;
  }
  .show-767 {
    display: block;
  }
}
@media only screen and (max-width: 479px) {
  .show-479 {
    display: block;
  }
  .hide-479 {
    display: none;
  }
}
@media only screen and (max-width: 400px) {
  .show-400 {
    display: block;
  }
  .hide-400 {
    display: none;
  }
}
@media only screen and (max-width: 389px) {
  .hide-389 {
    display: none;
  }
  .show-389 {
    display: block;
  }
}
@media only screen and (max-width: 359px) {
  .hide-359 {
    display: none;
  }
  .show-359 {
    display: block;
  }
}