body {
  max-width: 500px;
  margin: 0 auto; }

.f-modal__btn {
  width: 50%;
  line-height: 40px;
  margin: 10px auto;
  text-align: center;
  font-size: 12px;
  color: #fff;
  border-radius: 4px; }

.f-modal__title {
  text-align: center !important; }

a {
  outline: 0;
  text-decoration: none;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none;
  color: black; }

a:link {
  text-decoration: none;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none; }

a:visited {
  text-decoration: none;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none; }

a:hover {
  text-decoration: none;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none; }

a:active {
  text-decoration: none;
  color: inherit;
  -webkit-user-select: none;
  -moz-user-focus: none;
  -moz-user-select: none; }

.container {
  max-width: 500px;
  position: relative; }
  .container .banner-img {
    width: 100%; }
  .container .from-box {
    padding: 12% 0px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    width: 95%;
    background-color: white;
    border: 2px solid;
    border-radius: 5px;
    margin: 0 auto; }
    .container .from-box .from-head-img {
      width: 223px;
      height: 37px;
      position: absolute;
      top: -6px; }
    .container .from-box .form-head-txt {
      font-size: 14px;
      color: #1A1A1A;
      line-height: 18px; }
      .container .from-box .form-head-txt span {
        color: #FF0000; }
    .container .from-box .box-title {
      font-size: 16px;
      font-weight: bold;
      color: #165BF7;
      line-height: 16px;
      text-shadow: 0px 3px 3px rgba(84, 59, 210, 0.3);
      text-align: center; }
    .container .from-box .input-box {
      width: 82%;
      height: 40px;
      border-radius: 4px;
      font-size: 14px;
      color: #999999;
      line-height: 40px;
      outline: none;
      border: none;
      padding: 0px 4%;
      margin-top: 15px;
      border: 1px solid #DEE1E6; }
    .container .from-box .input-div {
      width: 90%;
      height: 40px;
      margin-top: 15px;
      display: flex;
      justify-content: space-between; }
      .container .from-box .input-div .input-code {
        width: 54%;
        height: 40px;
        border-radius: 4px;
        font-size: 14px;
        color: #999999;
        line-height: 40px;
        outline: none;
        border: none;
        padding: 0px 5%;
        border: 1px solid #DEE1E6; }
      .container .from-box .input-div .btn-code {
        width: 32%;
        height: 40px;
        border-radius: 4px;
        font-size: 13px;
        color: #FFFFFF;
        line-height: 40px;
        border: none;
        text-align: center; }
    .container .from-box .checkNum {
      width: 90%;
      display: flex;
      align-items: center;
      font-size: 14px;
      color: #1A1A1A;
      margin: 10px 0px; }
      .container .from-box .checkNum .checkBox {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-around; }
      .container .from-box .checkNum .checkBtn {
        font-size: 13px;
        width: 30%;
        height: 30px;
        margin: 0px 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        border: 1px solid #F5F5F5; }
      .container .from-box .checkNum .checkTip {
        font-size: 12px;
        color: #1A1A1A;
        line-height: 23px;
        display: flex;
        flex-direction: column;
        align-items: center; }
        .container .from-box .checkNum .checkTip .checkTip-spc {
          line-height: 23px; }
    .container .from-box .rule-box {
      display: flex;
      align-items: center;
      font-size: 14px;
      color: #1A1A1A;
      margin: 5px 0px 10px; }
      .container .from-box .rule-box .rule-color {
        text-decoration: underline; }
    .container .from-box .btn {
        width: 90%;
        height: 40px;
        border-radius: 4px;
        font-size: 13px;
        font-weight: bold;
        color: #FFFFFF;
        line-height: 40px;
        text-align: center;
        border-radius: 23px;
        cursor:pointer;
    }

.foot-txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 11px;
  line-height: 20px;
  padding: 10px 0px 20px; }

.all-container {
  background: linear-gradient(30deg, #FFE177, #FDAB2D, #FDAB2D); }
  .all-container .from-box {
    margin-top: -45px; }
    .all-container .from-box .btn {
      background: linear-gradient(-5deg, #FFA61C, #FF9F15, #FFB720, #FFC227); }
  .all-container .head-logo {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    left: 0;
    right: 0; }
    .all-container .head-logo .head-logo-box {
      width: 109px;
      height: 44px;
      background: #FFFFFF;
      display: flex;
      align-items: center;
      justify-content: center;
      border-top-left-radius: 22px;
      border-bottom-left-radius: 22px; }
      .all-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.all-color {
  color: #FF9F16; }

.all-bg {
  background-color: #FF9F16; }

.all-border {
  border-color: #FF9F16 !important; }

.all-check .checkActive {
  color: #FF9F16;
  border: 1px solid #FF9F16 !important; }

.ywx-container {
  background: linear-gradient(90deg, #B898FF, #8F89F1); }
  .ywx-container .from-box {
    margin: 20px auto 0px; }
    .ywx-container .from-box .btn {
      background: linear-gradient(0deg, #5556EC, #6F77F2);
      box-shadow: 0px 3px 3px 0px rgba(81, 82, 221, 0.19); }
  .ywx-container .banner-img {
    border-bottom-left-radius: 50%; }
  .ywx-container .head-logo {
    display: flex;
    justify-content: flex-start;
    position: absolute;
    left: 0;
    right: 0; }
    .ywx-container .head-logo .head-logo-box {
      width: 109px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-top-left-radius: 22px;
      border-bottom-left-radius: 22px; }
      .ywx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.ywx-color {
  color: #5657EC; }

.ywx-bg {
  background-color: #5657EC; }

.ywx-border {
  border-color: #5657EC !important; }

.ywx-check .checkActive {
  color: #5657EC;
  border: 1px solid #5657EC !important; }

.zjx-container {
  background: linear-gradient(0deg, #DAE1FB, #F0F6FE); }
  .zjx-container .from-box {
    margin: 20px auto 0px; }
    .zjx-container .from-box .btn {
      background: linear-gradient(0deg, #659EFF, #4A6CF4); }
  .zjx-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0; }
    .zjx-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .zjx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.zjx-color {
  color: #5F93F9; }

.zjx-bg {
  background-color: #5F93F9; }

.zjx-border {
  border-color: #5F93F9 !important; }

.zjx-check .checkActive {
  color: #5F93F9;
  border: 1px solid #5F93F9 !important; }

.lcx-container {
  background: #6F6FE7; }
  .lcx-container .from-box {
    margin: -25px auto 0px; }
    .lcx-container .from-box .btn {
      background: linear-gradient(0deg, #659EFF, #4A6CF4); }
  .lcx-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .lcx-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .lcx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.lcx-color {
  color: #5F93F9; }

.lcx-bg {
  background-color: #5F93F9; }

.lcx-border {
  border-color: #5F93F9 !important; }

.lcx-check .checkActive {
  color: #5F93F9;
  border: 1px solid #5F93F9 !important; }

.ccx-container {
  background: #C84A45; }
  .ccx-container .from-box {
    margin: -90px auto 0px; }
    .ccx-container .from-box .btn {
      background: linear-gradient(-5deg, #FFA61C, #FF9F15, #FFB720, #FFC227); }
  .ccx-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .ccx-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      display: flex;
      align-items: center;
      justify-content: center; }
      .ccx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.ccx-color {
  color: #FF9F16; }

.ccx-bg {
  background-color: #FF9F16; }

.ccx-border {
  border-color: #FF9F16 !important; }

.ccx-check .checkActive {
  color: #FF9F16;
  border: 1px solid #FF9F16 !important; }

.sex-container {
  background: #F2F9FE; }
  .sex-container .from-box {
    margin: 10px auto 0px; }
    .sex-container .from-box .btn {
      background: linear-gradient(0deg, #659EFF, #4A6CF4); }
  .sex-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .sex-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .sex-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.sex-color {
  color: #5F93F9; }

.sex-bg {
  background-color: #5F93F9; }

.sex-border {
  border-color: #5F93F9 !important; }

.sex-check .checkActive {
  color: #5F93F9;
  border: 1px solid #5F93F9 !important; }

.ylx-container {
  background: #FDF1E5; }
  .ylx-container .from-box {
    margin: 20px auto 0px; }
    .ylx-container .from-box .btn {
      background: linear-gradient(0deg, #FF725F, #FF794D); }
  .ylx-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .ylx-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .ylx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.ylx-color {
  color: #FF8665; }

.ylx-bg {
  background-color: #FF8665; }

.ylx-border {
  border-color: #FF8665 !important; }

.ylx-check .checkActive {
  color: #FF8665;
  border: 1px solid #FF8665 !important; }

.yl-container {
  background: #4F8EF5; }
  .yl-container .from-box {
    margin: 10px auto 0px; }
    .yl-container .from-box .btn {
      background: linear-gradient(0deg, #659EFF, #4A6CF4); }
  .yl-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .yl-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .yl-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }
  .yl-container .foot-txt {
    color: wheat; }

.yl-color {
  color: #5F93F9; }

.yl-bg {
  background-color: #5F93F9; }

.yl-border {
  border-color: #5F93F9 !important; }

.yl-check .checkActive {
  color: #5F93F9;
  border: 1px solid #5F93F9 !important; }

.rsx-container {
  background: #FAE1C6; }
  .rsx-container .from-box {
    margin: 20px auto 0px; }
    .rsx-container .from-box .btn {
      background: #FF9B3A; }
  .rsx-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .rsx-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .rsx-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }

.rsx-color {
  color: #FF9B3A; }

.rsx-bg {
  background-color: #FF9B3A; }

.rsx-border {
  border-color: #FF9B3A !important; }

.rsx-check .checkActive {
  color: #FF9B3A;
  border: 1px solid #FF9B3A !important; }

.gr-container {
  background: white; }
  .gr-container .from-box {
    margin: 20px auto 0px; }
    .gr-container .from-box .btn {
      background: linear-gradient(0deg, #45A3FA, #6ECFFC); }
  .gr-container .head-logo {
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .gr-container .head-logo .head-logo-box {
      width: 106px;
      height: 33px;
      background: linear-gradient(180deg, #5D97FB, #4663D9);
      display: flex;
      align-items: center;
      justify-content: center;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px; }
      .gr-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }
  .gr-container .foot-txt {
    color: black; }

.gr-color {
  color: #45A3FA; }

.gr-bg {
  background-color: #45A3FA; }

.gr-border {
  border-color: #45A3FA !important; }

.gr-check .checkActive {
  color: #45A3FA;
  border: 1px solid #45A3FA !important; }

.all2-container {
  background: white; }
  .all2-container .from-box {
    margin-top: -50px;
    width: 100%;
    border: none;
    background: #FFFFFF;
    border-radius: 50px 50px 5px 5px; }
    .all2-container .from-box .btn {
      background: linear-gradient(185deg, #1587D6, #2CB4F3); }
  .all2-container .head-logo {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    left: 0;
    right: 0;
    display: none; }
    .all2-container .head-logo .head-logo-box {
      width: 109px;
      height: 44px;
      background: #FFFFFF;
      display: flex;
      align-items: center;
      justify-content: center;
      border-top-left-radius: 22px;
      border-bottom-left-radius: 22px; }
      .all2-container .head-logo .head-logo-box .logo-img {
        width: 77px;
        height: 23px; }
  .all2-container .foot-txt {
    color: black !important;
    padding-top: 0px; }

.all2-color {
  color: #2CB4F3; }

.all2-bg {
  background-color: #2CB4F3; }

.all2-border {
  border-color: #2CB4F3 !important; }

.all2-check .checkActive {
  color: #2CB4F3;
  border: 1px solid #2CB4F3 !important; }