
.mainPage{
  div.centerLabel{
    width: 420px;
    position: relative;
    overflow: hidden;
    .title{
      display: block;
      margin: 0 auto;
    }
    ul{
      width: 100%;
      position: relative;
      overflow: hidden;
      margin: 25px auto 0;
      li{
        width: 100%;
        position: relative;
        overflow: hidden;
        border-radius: 5px;
        background: #fff;
        margin: 15px auto 0;
        >div{
          &:first-child{
            width: 40px;
            position: relative;
            &::after{
              content: '';
              width: 1px;
              height: 70%;
              background: #ccc;
              position: absolute;
              right: 0;
              top: 50%;
              transform: translateY(-50%);
              -webkit-transform: translateY(-50%);
            }
            i{
              font-size: 20px;
              color: #666;
            }
          }
          input{
            width: 100%;
            display: block;
            line-height: 20px;
            padding: 12px 0;
            border: none;
            background: none;
            text-indent: 10px;
            &:-webkit-autofill{
              background: #fff !important;
              -webkit-box-shadow: 0 0 0px 1000px white inset;
            }
          }
        }
      }
    }
    .remberAccount{
      width: 100%;
      position: relative;
      overflow: hidden;
      white-space: nowrap;
      font-size: 0;
      margin: 10px auto 0;
      *{
        color: #fff;
        line-height: 30px;
        display: inline-block;
        margin-right: 10px;
        -webkit-user-select: none;
        user-select: none;
      }
      i{
        &:hover{
          cursor: pointer;
        }
        &.active{
          color: #FF421C;
        }
      }
    }
    .btn{
      width: 260px;
      display: block;
      text-align: center;
      background: #FF421C;
      border-radius: 6px;
      color: #fff;
      line-height: 46px;
      margin: 15px auto 0;
    }
  }
  // .top{
  //   text-align: center;
  //   padding: 10px 0;
  //   border-bottom: 1px solid #eee;
  //   margin-bottom: 10px;
  //   *{
  //     vertical-align: middle;
  //   }
  //   i{
  //     font-size: 30px;
  //     color: red;
  //   }
  // }
  // .login{
  //   width: calc(100% - 40px);
  //   margin: 0 auto;
  //   position: relative;
  //   overflow: hidden;
  //   input{
  //     width: 100%;
  //     box-sizing: border-box;
  //     border: 1px solid #ccc;
  //     line-height: 20px;
  //     padding: 5px 0;
  //     border-radius: 5px;
  //     font-size: 13px;
  //     text-indent: 10px;
  //     margin: 15px auto 0;
  //   }
  //   div{
  //     font-size: 0;
  //     white-space: nowrap;
  //     padding: 5px 0;
  //     margin-top: 5px;
  //     &>*{
  //       font-size: 0;
  //       white-space: nowrap;
  //       &>*{
  //         display: inline-block;
  //         vertical-align: middle;
  //         font-size: 13px;
  //         line-height: 20px;
  //         margin-right: 5px;
  //       }
  //       i{
  //         font-size: 16px;
  //         color: #666;
  //       }
  //     }
  //     &>*.active{
  //       i{
  //         color: red;
  //       }
  //     }
  //     &>*:hover{
  //       cursor: pointer;
  //     }
  //     span{

  //     }
  //   }
  // }
  // .btn{
  //   width: 100%;
  //   display: block;
  //   margin: 10px auto 30px;
  //   line-height: 40px;
  //   background: red;
  //   text-align: center;
  //   font-size: 13px;
  //   color: #fff;
  //   border-radius: 5px;
  //   transition: all .1s linear;
  //   -webkit-transition: all .1s linear;
  // }
  // .btn:hover{
  //   background: #d01414;
  // }
}





























