新官网

css/base.css

+/*初始化  reset*/
+@charset "utf-8";
+body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,input,button,textarea,select,p,span,font,em,i,b,strong,button{margin:0;padding:0;}
+body{margin:0;font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体"; background:#fff; overflow:visible; color:#333333;}
+html, body { height: 100%;}
+input,select{font-size:12px;line-height:16px; border:0 none; vertical-align:middle;}
+button{ border:0 none;}
+.clear{clear:both;padding:0px;margin:0px;}
+img{border:0;}
+a {outline: none;}
+a:focus { outline:0; }
+input,button,select,textarea{outline:none}
+ul,li{list-style-type:none;_list-style:outside;}
+a{ text-decoration:none; color:#333;}
+a:hover{ color:#ff6600;}
+/* new clearfix清除浮动 */
+.clearfix:after {
+ visibility: hidden;
+ display: block;
+ font-size: 0;
+ content: " ";
+ clear: both;
+ height: 0;
+}
+.clearfix { display: block;zoom:1 }
+* html .clearfix {height: 1%; zoom: 1; } /* IE6 */
+*:first-child+html .clearfix { zoom: 1; } /* IE7 */
+html[xmlns] .clearfix { display: block; zoom:1}
+/*清除浮动-end*/
+h1,h2,h3,h4,h5,h6{font-weight: normal}
+
+/*这一句是用来解决在安卓上的点击出现篮框问题*/
+/* body{ -webkit-tap-highlight-color:rgba(0,0,0,0); } */
+/*下面是解决ios上去除微信点击蓝色边框 */
+/* a:focus,
+input:focus,
+p:focus{
+ -webkit-tap-highlight-color:rgba(0,0,0,0);
+ -webkit-user-modify:read-only;
+} */
+/*清除浮动*/
+.w{
+ width: 1200px;
+ margin: 0 auto;
+}
+button{
+ cursor: pointer;
+ outline:none;
+}
+input[type=number] {
+ -moz-appearance:textfield;
+}
+/* input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+} */
+/* ::-webkit-scrollbar{
+ display:none;
+} */
+/*版芯*/
\ No newline at end of file

css/city.css

+.city-picker-selector .selector-item {
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  width: 200px;
+  height: 36px;
+  line-height: 36px;
+  float: left;
+  margin-left: 20px;
+  position: relative
+}
+
+.city-picker-selector .selector-item:first-child {
+  margin-left: 0
+}
+
+.city-picker-selector .selector-item:after {
+  content: '';
+  border-right: 6px solid transparent;
+  border-left: 6px solid transparent;
+  border-top: 6px solid #ccc;
+  display: block;
+  width: 0;
+  height: 0;
+  position: absolute;
+  top: 15px;
+  right: 5px;
+}
+
+.city-picker-selector .selector-show .selector-list {
+  -webkit-transform: translateY(0);
+  transform: translateY(0);
+  opacity: 1;
+  visibility: visible
+}
+
+.city-picker-selector .selector-show:after {
+  -webkit-transform: rotate(180deg);
+  transform: rotate(180deg)
+}
+
+.city-picker-selector .selector-name {
+  border-radius: 5px;
+  color: #333;
+  font-size: 16px;
+  display: block;
+  text-indent: 5%;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap
+}
+
+.city-picker-selector .selector-name:hover {
+  background-color: #fdfdfd;
+  border-radius: 5px
+}
+
+.city-picker-selector .selector-name.df-color {
+  color: #999
+}
+
+.city-picker-selector .selector-name.forbid {
+  cursor: default
+}
+
+.city-picker-selector .selector-name.disabled {
+  background-color: #eef1f6;
+  cursor: not-allowed
+}
+
+.city-picker-selector .selector-list {
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  background: #fff;
+  width: 100%;
+  position: absolute;
+  top: 44px;
+  left: -1px;
+  z-index: 1;
+  -webkit-transition-duration: 400ms;
+  transition-duration: 400ms;
+  -webkit-transform: translateY(-2%);
+  transform: translateY(-2%);
+  opacity: 0;
+  visibility: hidden;
+  overflow: hidden
+}
+
+.city-picker-selector ul {
+  max-height: 160px;
+  overflow-x: hidden;
+  overflow-y: auto
+}
+
+.city-picker-selector li {
+  border-top: 1px solid #f7f7f7;
+  color: #333;
+  cursor: pointer;
+  font-size: 14px;
+  width: 90%;
+  padding: 0 5%;
+  height: 30px;
+  line-height: 30px;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap
+}
+
+.city-picker-selector li:first-child {
+  border-top: none
+}
+
+.city-picker-selector li.placeholder-li {
+  cursor: default
+}
+
+.city-picker-selector li strong {
+  color: #6ab9d8;
+  padding: 0 5px
+}
+
+.city-picker-selector li.caller:hover {
+  background: #f5f5f5
+}
+
+.city-picker-selector li.caller.active,
+.city-picker-selector li.caller.active:hover {
+  background: #6ab9d8;
+  color: #fff
+}
+
+.city-picker-selector li.forbid {
+  color: #999;
+  font-size: 14px;
+  cursor: not-allowed
+}
+
+.city-picker-selector .selector-search {
+  border: 1px solid #ececec;
+  border-top: none;
+  background: #f8f8f8;
+  font-size: 0;
+  padding: 10px;
+  height: 28px;
+  margin-left: -1px;
+  margin-right: -1px
+}
+
+.city-picker-selector .input-search {
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  color: #333;
+  font-size: 14px;
+  width: 100%;
+  height: 26px;
+  line-height: 26px\9;
+  padding: 0;
+  text-indent: 5px
+}
+
+.city-picker-selector .input-search:focus {
+  outline: none
+}
+
+.city-picker-selector .input-search::-webkit-input-placeholder {
+  color: #bababa
+}
+
+select {
+  border: 1px solid #ccc;
+  background: #fff;
+  border-radius: 5px;
+  color: #333;
+  font-size: 16px;
+  outline: none;
+  width: 160px;
+  height: 36px;
+  margin-right: 10px;
+  box-shadow: 0 0 5px #eee
+}
+
+select:disabled {
+  background-color: #eef1f6;
+  cursor: not-allowed
+}
\ No newline at end of file

css/headerSideNav.css

+body {
+  background: #F5F5F5;
+}
+.header {
+  width: 100%;
+  height: 66px;
+  background: url(../images/header-bg1.png);
+  background-size: 100% 100%;
+  position: relative;
+  top: 0;
+  left: 0;
+}
+.header .content {
+  width: 1308px;
+  height: 66px;
+  margin: 0 auto;
+  background: url(../images/header-bg2.png);
+  background-size: 100% 100%;
+  font-size: 0;
+  position: relative;
+}
+.header .content .header-logo {
+  display: inline-block;
+  vertical-align: top;
+  margin-left: 130px;
+  margin-top: 8px;
+}
+.header .content .nav {
+  height: 66px;
+  display: inline-block;
+  vertical-align: top;
+}
+.header .content .nav .nav-ul {
+  padding-left: 16px;
+}
+.header .content .nav .nav-ul .nav-li {
+  display: inline-block;
+  vertical-align: top;
+  height: 66px;
+  line-height: 66px;
+  margin-right: 70px;
+}
+.header .content .nav .nav-ul .nav-li a {
+  display: block;
+  font-size: 20px;
+}
+.header .content .nav .nav-ul .nav-li:last-child {
+  margin-right: 0;
+}
+.header .content .login-no {
+  float: right;
+  font-size: 16px;
+  height: 66px;
+  line-height: 66px;
+  position: relative;
+}
+.header .content .login-no .login {
+  display: inline-block;
+  margin-right: 20px;
+}
+.header .content .login-no .register {
+  display: inline-block;
+  margin-right: 120px;
+}
+.header .content .login-no .line {
+  position: absolute;
+  width: 1px;
+  height: 14px;
+  top: 50%;
+  margin-top: -5px;
+  left: 52px;
+  background: #ECECEC;
+}
+.header .content .lonin-yes {
+  display: none;
+  height: 66px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 3;
+}
+.header .content .lonin-yes .header-avatar {
+  display: inline-block;
+  vertical-align: top;
+  width: 45px;
+  height: 45px;
+  margin-top: 10.5px;
+  border-radius: 50%;
+}
+.header .content .lonin-yes .header-name {
+  display: inline-block;
+  color: #111111 !important;
+  vertical-align: top;
+  width: 265px;
+  height: 66px;
+  line-height: 66px;
+  font-size: 20px;
+  margin-left: 8px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+.header .content .lonin-yes .info-pop-box {
+  width: 278px;
+  height: 392px;
+  position: absolute;
+  top: 66px;
+  left: -25px;
+  display: none;
+}
+.header .content .lonin-yes .info-pop-box .info-pop {
+  margin-top: 14px;
+  float: left;
+  width: 278px;
+  height: 378px;
+  background: #FFFFFF;
+  border-radius: 7px;
+  box-shadow: 0px 2px 20px 2px #cecdcd;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .info-avatar {
+  display: block;
+  width: 75px;
+  height: 75px;
+  margin: 0 auto;
+  border-radius: 50%;
+  margin-top: 34px;
+  margin-bottom: 14px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .info-name {
+  font-size: 22px;
+  text-align: center;
+  color: #111111;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .info-uid {
+  font-size: 14px;
+  text-align: center;
+  color: #999999;
+  margin-top: 5px;
+  margin-bottom: 16px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .info-score {
+  font-size: 12px;
+  text-align: center;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .progress-box {
+  width: 180px;
+  height: 8px;
+  border: 1px solid #ff6600;
+  border-radius: 4px;
+  margin: 0 auto;
+  margin-top: 5px;
+  position: relative;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .progress-box .propress {
+  width: 50%;
+  height: 4px;
+  width: 172px;
+  background: linear-gradient(to right, #FF5102, #FE8D00);
+  margin-top: 2px;
+  margin-left: 4px;
+  border-radius: 2px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .progress-box .level {
+  width: 22px;
+  position: absolute;
+  top: -7px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .progress-box .level1 {
+  left: -30px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .progress-box .level2 {
+  right: -30px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .treasure-box {
+  width: 216px;
+  margin: 0 auto;
+  margin-top: 26px;
+  text-align: center;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .treasure-box .treasure {
+  display: inline-block;
+  vertical-align: top;
+  width: 50%;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .treasure-box .treasure .num {
+  font-size: 22px;
+  margin-bottom: 5px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .treasure-box .treasure .txt {
+  font-size: 16px;
+  color: #999999;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .personal {
+  width: 235px;
+  height: 55px;
+  line-height: 55px;
+  text-align: center;
+  border-top: 1px solid #ECECEC;
+  margin: 0 auto;
+  margin-top: 17px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .personal .per-center {
+  font-size: 15px;
+}
+.header .content .lonin-yes .info-pop-box .info-pop .personal img {
+  width: 6px;
+  margin-left: 5px;
+}
+.main {
+  width: 1240px;
+  height: 753px;
+  margin: 0 auto;
+  border-radius: 10px;
+  position: relative;
+  top: 40px;
+  background: #fff;
+}
+.main .info-nav {
+  width: 270px;
+  height: 753px;
+  float: left;
+  background: #ebebeb;
+  border-radius: 10px 0 0 10px;
+}
+.main .info-nav .info {
+  width: 270px;
+  height: 237px;
+  background: url(../images/info-nav-bg.png) no-repeat;
+  background-size: 100% 100%;
+  border-radius: 10px 0 0 0;
+}
+.main .info-nav .info .avatar-box {
+  width: 90px;
+  height: 90px;
+  margin: 0 auto;
+  position: relative;
+  padding-top: 35px;
+}
+.main .info-nav .info .avatar-box .avatar {
+  width: 90px;
+  height: 90px;
+  border-radius: 50%;
+}
+.main .info-nav .info .avatar-box .level {
+  width: 22px;
+  position: absolute;
+  right: 3px;
+  bottom: 0px;
+}
+.main .info-nav .info .name {
+  font-size: 22px;
+  color: #fff;
+  text-align: center;
+  margin-top: 5px;
+}
+.main .info-nav .info .name .level2 {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  font-size: 16px;
+  background: rgba(0, 0, 0, 0.1);
+  border-radius: 50%;
+}
+.main .info-nav .info .uid {
+  text-align: center;
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 14px;
+  margin: 3px auto 8px auto;
+}
+.main .info-nav .info .address-box {
+  text-align: center;
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 14px;
+}
+.main .info-nav .info .address-box img {
+  position: relative;
+  top: 2px;
+}
+.main .info-nav .side-nav .side-nav-li {
+  height: 47px;
+  line-height: 47px;
+  text-align: center;
+  position: relative;
+  font-size: 16px;
+}
+.main .info-nav .side-nav .side-nav-li .line {
+  width: 4px;
+  height: 47px;
+  position: absolute;
+  left: 0;
+  top: 0;
+  background: #ff6600;
+  display: none;
+}
+.main .info-nav .side-nav .side-nav-li a {
+  color: #111111;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin {
+  display: none;
+  width: 407px;
+  height: 222px;
+  background: #fff;
+  border-radius: 8px;
+  position: absolute;
+  left: 570px;
+  top: -270px;
+  z-index: 99;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin .close {
+  position: absolute;
+  right: 15px;
+  top: 18px;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin .close img {
+  display: block;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin .tureoutlogintxt {
+  font-size: 22px;
+  text-align: center;
+  color: #111;
+  margin-top: 55px;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin .canceloutlogin {
+  float: left;
+  width: 125px;
+  height: 46px;
+  line-height: 46px;
+  background: linear-gradient(to right, #FB8211, #FA6336);
+  color: #fff;
+  font-size: 18px;
+  border-radius: 23px;
+  margin-top: 41px;
+  margin-left: 60px;
+  box-shadow: 0px 2px 10px 2px #FFCCAF;
+}
+.main .info-nav .side-nav .side-nav-li .pop-outlogin .trueoutlogin {
+  float: right;
+  width: 125px;
+  height: 46px;
+  line-height: 46px;
+  background: linear-gradient(to right, #FB8211, #FA6336);
+  color: #fff;
+  font-size: 18px;
+  border-radius: 23px;
+  margin-top: 41px;
+  margin-right: 60px;
+  box-shadow: 0px 2px 10px 2px #FFCCAF;
+}
+.main .info-nav .side-nav .active {
+  background: #fff;
+}
+.main .info-nav .side-nav .active a {
+  color: #ff6600;
+}
+.main .info-nav .side-nav .active .line {
+  display: block;
+}
+.main .content {
+  width: 910px;
+  height: 753px;
+  float: left;
+  margin-left: 30px;
+}
+.main .content .common-title {
+  height: 66px;
+  line-height: 75px;
+  color: #111111;
+  font-size: 18px;
+  border-bottom: 1px solid #efefef;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.pitch a {
+  color: #ff6600 !important;
+}

css/headerSideNav.less

+body {
+  background: #F5F5F5;
+}
+.header {
+  width: 100%;
+  height: 66px;
+  background: url(../images/header-bg1.png);
+  background-size: 100% 100%;
+  position: relative;
+  top: 0;
+  left: 0;
+  .content {
+    width: 1308px;
+    height: 66px;
+    margin: 0 auto;
+    background: url(../images/header-bg2.png);
+    background-size: 100% 100%;
+    font-size: 0;
+    position: relative;
+    .header-logo {
+      display: inline-block;
+      vertical-align: top;
+      margin-left: 130px;
+      margin-top: 8px;
+    }
+    .nav {
+      height: 66px;
+      display: inline-block;
+      vertical-align: top;
+      .nav-ul {
+        padding-left: 16px;
+        .nav-li {
+          display: inline-block;
+          vertical-align: top;
+          height: 66px;
+          line-height: 66px;
+          margin-right: 70px;
+          a {
+            display: block;
+            font-size: 20px;
+          }
+          &:last-child {
+            margin-right: 0;
+          }
+        }
+      }
+    }
+    .login-no {
+      // display: none;
+      float: right;
+      font-size: 16px;
+      height: 66px;
+      line-height: 66px;
+      position: relative;
+      .login {
+        display: inline-block;
+        margin-right: 20px;
+      }
+      .register {
+        display: inline-block;
+        margin-right: 120px;
+      }
+      .line {
+        position: absolute;
+        width: 1px;
+        height: 14px;
+        top: 50%;
+        margin-top: -5px;
+        left: 52px;
+        background: #ECECEC;
+      }
+    }
+    .lonin-yes {
+      display: none;
+      height: 66px;
+      position: absolute;
+      right: 0;
+      top: 0;
+      z-index: 3;
+      .header-avatar {
+        display: inline-block;
+        vertical-align: top;
+        width: 45px;
+        height: 45px;
+        margin-top: 10.5px;
+        border-radius: 50%;
+      }
+      .header-name {
+        display: inline-block;
+        color: #111111 !important;
+        vertical-align: top;
+        width: 265px;
+        height: 66px;
+        line-height: 66px;
+        font-size: 20px;
+        margin-left: 8px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+      }
+      .info-pop-box {
+        width: 278px;
+        height: 392px;
+        position: absolute;
+        top: 66px;
+        left: -25px;
+        display: none;
+        .info-pop {
+          margin-top: 14px;
+          float: left;
+          width: 278px;
+          height: 378px;
+          background: #FFFFFF;
+          border-radius: 7px;
+          box-shadow: 0px 2px 20px 2px #cecdcd;
+          .info-avatar {
+            display: block;
+            width: 75px;
+            height: 75px;
+            margin: 0 auto;
+            border-radius: 50%;
+            margin-top: 34px;
+            margin-bottom: 14px;
+          }
+          .info-name {
+            font-size: 22px;
+            text-align: center;
+            color: #111111;
+          }
+          .info-uid {
+            font-size: 14px;
+            text-align: center;
+            color: #999999;
+            margin-top: 5px;
+            margin-bottom: 16px;
+          }
+          .info-score {
+            font-size: 12px;
+            text-align: center;
+          }
+          .progress-box {
+            width: 180px;
+            height: 8px;
+            border: 1px solid #ff6600;
+            border-radius: 4px;
+            margin: 0 auto;
+            margin-top: 5px;
+            position: relative;
+            .propress {
+              width: 50%;
+              height: 4px;
+              width: 172px;
+              background: linear-gradient(to right, #FF5102, #FE8D00);
+              margin-top: 2px;
+              margin-left: 4px;
+              border-radius: 2px;
+            }
+            .level {
+              width: 22px;
+              position: absolute;
+              top: -7px;
+            }
+            .level1 {
+              left: -30px;
+            }
+            .level2 {
+              right: -30px;
+            }
+          }
+          .treasure-box {
+            width: 216px;
+            margin: 0 auto;
+            margin-top: 26px;
+            text-align: center;
+            .treasure {
+              display: inline-block;
+              vertical-align: top;
+              width: 50%;
+              .num {
+                font-size: 22px;
+                margin-bottom: 5px;
+              }
+              .txt {
+                font-size: 16px;
+                color: #999999;
+              }
+            }
+          }
+          .personal {
+            width: 235px;
+            height: 55px;
+            line-height: 55px;
+            text-align: center;
+            border-top: 1px solid #ECECEC;
+            margin: 0 auto;
+            margin-top: 17px;
+            .per-center {
+              font-size: 15px;
+            }
+            img {
+              width: 6px;
+              margin-left: 5px;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+.main {
+  width: 1240px;
+  height: 753px;
+  margin: 0 auto;
+  border-radius: 10px;
+  position: relative;
+  top: 40px;
+  background: #fff;
+  .info-nav {
+    width: 270px;
+    height: 753px;
+    float: left;
+    background: #ebebeb;
+    border-radius: 10px 0 0 10px;
+    .info {
+      width: 270px;
+      height: 237px;
+      background: url(../images/info-nav-bg.png) no-repeat;
+      background-size: 100% 100%;
+      border-radius: 10px 0 0 0; 
+      .avatar-box {
+        width: 90px;
+        height: 90px;
+        margin: 0 auto;
+        position: relative;
+        padding-top: 35px;
+        .avatar {
+          width: 90px;
+          height: 90px;
+          border-radius: 50%;
+        }
+        .level {
+          width: 22px;
+          position: absolute;
+          right: 3px;
+          bottom: 0px;
+        }
+      }
+      .name {
+        font-size: 22px;
+        color: #fff;
+        text-align: center;
+        margin-top: 5px;
+        .level2 {
+          display: inline-block;
+          width: 20px;
+          height: 20px;
+          line-height: 20px;
+          text-align: center;
+          font-size: 16px;
+          background: rgba(0, 0, 0, 0.1);
+          border-radius: 50%;
+        }
+      }
+      .uid {
+        text-align: center;
+        color: rgba(255, 255, 255, 0.5);
+        font-size: 14px;
+        margin: 3px auto 8px auto;
+      }
+      .address-box {
+        text-align: center;
+        color: rgba(255, 255, 255, 0.5);
+        font-size: 14px;
+        img {
+          position: relative;
+          top: 2px;
+        }
+      }
+    }
+    .side-nav {
+      .side-nav-li {
+        height: 47px;
+        line-height: 47px;
+        text-align: center;
+        position: relative;
+        font-size: 16px;
+        .line {
+          width: 4px;
+          height: 47px;
+          position: absolute;
+          left: 0;
+          top: 0;
+          background: #ff6600;
+          display: none;
+        }
+        a {
+          color: #111111;
+        }
+        .pop-outlogin {
+          display: none;
+          width: 407px;
+          height: 222px;
+          background: #fff;
+          border-radius: 8px;
+          position: absolute;
+          left: 570px;
+          top: -270px;
+          z-index: 99;
+          .close {
+            position: absolute;
+            right: 15px;
+            top: 18px;
+            img {
+              display: block;
+            }
+          }
+          .tureoutlogintxt {
+            font-size: 22px;
+            text-align: center;
+            color: #111;
+            margin-top: 55px;
+          }
+          .canceloutlogin {
+            float: left;
+            width: 125px;
+            height: 46px;
+            line-height: 46px;
+            background: linear-gradient(to right, #FB8211, #FA6336);
+            color: #fff;
+            font-size: 18px;
+            border-radius: 23px;
+            margin-top: 41px;
+            margin-left: 60px;
+            box-shadow: 0px 2px 10px 2px #FFCCAF;
+          }
+          .trueoutlogin {
+            float: right;
+            width: 125px;
+            height: 46px;
+            line-height: 46px;
+            background: linear-gradient(to right, #FB8211, #FA6336);
+            color: #fff;
+            font-size: 18px;
+            border-radius: 23px;
+            margin-top: 41px;
+            margin-right: 60px;
+            box-shadow: 0px 2px 10px 2px #FFCCAF;
+          }
+        }
+      }
+      .active {
+        background: #fff;
+        a {
+          color: #ff6600;
+        }
+        .line {
+          display: block;
+        }
+      }
+    }
+  }
+  .content {
+    width: 910px;
+    height: 753px;
+    float: left;
+    margin-left: 30px;
+    .common-title {
+      height: 66px;
+      line-height: 75px;
+      color: #111111;
+      font-size: 18px;
+      border-bottom: 1px solid #efefef;
+      margin-top: 0;
+      margin-bottom: 0;
+    }
+  }
+}
+.pitch a{
+  color: #ff6600 !important;
+}
\ No newline at end of file

css/idangerous.swiper.css

+/*
+ * Swiper 2.7.0
+ * Mobile touch slider and framework with hardware accelerated transitions
+ *
+ * http://www.idangero.us/sliders/swiper/
+ *
+ * Copyright 2010-2014, Vladimir Kharlampidi
+ * The iDangero.us
+ * http://www.idangero.us/
+ *
+ * Licensed under GPL & MIT
+ *
+ * Released on: August 30, 2014
+*/
+/* ===============================================================
+Basic Swiper Styles 
+================================================================*/
+.swiper-container {
+	margin:0 auto;
+	position:relative;
+	overflow:hidden;
+	-webkit-backface-visibility:hidden;
+	-moz-backface-visibility:hidden;
+	-ms-backface-visibility:hidden;
+	-o-backface-visibility:hidden;
+	backface-visibility:hidden;
+	/* Fix of Webkit flickering */
+	z-index:1;
+}
+.swiper-wrapper {
+	position:relative;
+	width:100%;
+	-webkit-transition-property:-webkit-transform, left, top;
+	-webkit-transition-duration:0s;
+	-webkit-transform:translate3d(0px,0,0);
+	-webkit-transition-timing-function:ease;
+	
+	-moz-transition-property:-moz-transform, left, top;
+	-moz-transition-duration:0s;
+	-moz-transform:translate3d(0px,0,0);
+	-moz-transition-timing-function:ease;
+	
+	-o-transition-property:-o-transform, left, top;
+	-o-transition-duration:0s;
+	-o-transform:translate3d(0px,0,0);
+	-o-transition-timing-function:ease;
+	-o-transform:translate(0px,0px);
+	
+	-ms-transition-property:-ms-transform, left, top;
+	-ms-transition-duration:0s;
+	-ms-transform:translate3d(0px,0,0);
+	-ms-transition-timing-function:ease;
+	
+	transition-property:transform, left, top;
+	transition-duration:0s;
+	transform:translate3d(0px,0,0);
+	transition-timing-function:ease;
+
+	-webkit-box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	box-sizing: content-box;
+}
+.swiper-free-mode > .swiper-wrapper {
+	-webkit-transition-timing-function: ease-out;
+	-moz-transition-timing-function: ease-out;
+	-ms-transition-timing-function: ease-out;
+	-o-transition-timing-function: ease-out;
+	transition-timing-function: ease-out;
+	margin: 0 auto;
+}
+.swiper-slide {
+	float: left;
+	-webkit-box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	box-sizing: content-box;
+}
+
+/* IE10 Windows Phone 8 Fixes */
+.swiper-wp8-horizontal {
+	-ms-touch-action: pan-y;
+}
+.swiper-wp8-vertical {
+	-ms-touch-action: pan-x;
+}
+
+/* ===============================================================
+Your custom styles, here you need to specify container's and slide's
+sizes, pagination, etc.
+================================================================*/
+.swiper-container {
+	/* Specify Swiper's Size: */
+
+	/*width:200px;
+	height: 100px;*/
+}
+.swiper-slide {
+	/* Specify Slides's Size: */
+	
+	/*width: 100%;
+	height: 100%;*/
+}
+.swiper-slide-active {
+	/* Specific active slide styling: */
+	
+}
+.swiper-slide-visible {
+	/* Specific visible slide styling: */	
+
+}
+/* ===============================================================
+Pagination Styles
+================================================================*/
+.swiper-pagination-switch {
+	/* Stylize pagination button: */	
+
+}
+.swiper-active-switch {
+	/* Specific active button style: */	
+	
+}
+.swiper-visible-switch {
+	/* Specific visible button style: */	
+	
+}

css/layer.css

+.layui-m-layer{position:relative;z-index:19891014}.layui-m-layer *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.layui-m-layermain,.layui-m-layershade{position:fixed;left:0;top:0;width:100%;height:100%}.layui-m-layershade{background-color:rgba(0,0,0,.7);pointer-events:auto}.layui-m-layermain{display:table;font-family:Helvetica,arial,sans-serif;pointer-events:none}.layui-m-layermain .layui-m-layersection{display:table-cell;vertical-align:middle;text-align:center}.layui-m-layerchild{position:relative;display:inline-block;text-align:left;background-color:#fff;font-size:14px;border-radius:5px;box-shadow:0 0 8px rgba(0,0,0,.1);pointer-events:auto;-webkit-overflow-scrolling:touch;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@-webkit-keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.layui-m-anim-scale{animation-name:layui-m-anim-scale;-webkit-animation-name:layui-m-anim-scale}@-webkit-keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.layui-m-anim-up{-webkit-animation-name:layui-m-anim-up;animation-name:layui-m-anim-up}.layui-m-layer0 .layui-m-layerchild{width:90%;max-width:640px}.layui-m-layer1 .layui-m-layerchild{border:none;border-radius:0}.layui-m-layer2 .layui-m-layerchild{width:auto;max-width:260px;min-width:40px;border:none;background:0 0;box-shadow:none;color:#fff}.layui-m-layerchild h3{padding:0 10px;height:60px;line-height:60px;font-size:16px;font-weight:400;border-radius:5px 5px 0 0;text-align:center}.layui-m-layerbtn span,.layui-m-layerchild h3{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.layui-m-layercont{padding:50px 30px;line-height:22px;text-align:center}.layui-m-layer1 .layui-m-layercont{padding:0;text-align:left}.layui-m-layer2 .layui-m-layercont{text-align:center;padding:0;line-height:0}.layui-m-layer2 .layui-m-layercont i{width:25px;height:25px;margin-left:8px;display:inline-block;background-color:#fff;border-radius:100%;-webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out;animation:layui-m-anim-loading 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.layui-m-layerbtn,.layui-m-layerbtn span{position:relative;text-align:center;border-radius:0 0 5px 5px}.layui-m-layer2 .layui-m-layercont p{margin-top:20px}@-webkit-keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.layui-m-layer2 .layui-m-layercont i:first-child{margin-left:0;-webkit-animation-delay:-.32s;animation-delay:-.32s}.layui-m-layer2 .layui-m-layercont i.layui-m-layerload{-webkit-animation-delay:-.16s;animation-delay:-.16s}.layui-m-layer2 .layui-m-layercont>div{line-height:22px;padding-top:7px;margin-bottom:20px;font-size:14px}.layui-m-layerbtn{display:box;display:-moz-box;display:-webkit-box;width:100%;height:50px;line-height:50px;font-size:0;border-top:1px solid #D0D0D0;background-color:#F2F2F2}.layui-m-layerbtn span{display:block;-moz-box-flex:1;box-flex:1;-webkit-box-flex:1;font-size:14px;cursor:pointer}.layui-m-layerbtn span[yes]{color:#40AFFE}.layui-m-layerbtn span[no]{border-right:1px solid #D0D0D0;border-radius:0 0 0 5px}.layui-m-layerbtn span:active{background-color:#F6F6F6}.layui-m-layerend{position:absolute;right:7px;top:10px;width:30px;height:30px;border:0;font-weight:400;background:0 0;cursor:pointer;-webkit-appearance:none;font-size:30px}.layui-m-layerend::after,.layui-m-layerend::before{position:absolute;left:5px;top:15px;content:'';width:18px;height:1px;background-color:#999;transform:rotate(45deg);-webkit-transform:rotate(45deg);border-radius:3px}.layui-m-layerend::after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}body .layui-m-layer .layui-m-layer-footer{position:fixed;width:95%;max-width:100%;margin:0 auto;left:0;right:0;bottom:10px;background:0 0}.layui-m-layer-footer .layui-m-layercont{padding:20px;border-radius:5px 5px 0 0;background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn{display:block;height:auto;background:0 0;border-top:none}.layui-m-layer-footer .layui-m-layerbtn span{background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn span[no]{color:#FD482C;border-top:1px solid #c2c2c2;border-radius:0 0 5px 5px}.layui-m-layer-footer .layui-m-layerbtn span[yes]{margin-top:10px;border-radius:5px}body .layui-m-layer .layui-m-layer-msg{width:auto;max-width:90%;margin:0 auto;bottom:-150px;background-color:rgba(0,0,0,.7);color:#fff}.layui-m-layer-msg .layui-m-layercont{padding:10px 20px}
\ No newline at end of file

css/pop.css

+.pop-box {
+  width: 760px;
+  height: 600px;
+}
+.reg-pop-box {
+  width: 760px;
+  height: 786px;
+  overflow: hidden;
+}
+.reg-pop-box .pwd-box {
+  margin-top: 13px;
+}
+.pop-top {
+  width: 760px;
+  height: 148px;
+  background: url("../images/loginTop.png") no-repeat;
+}
+.reg-pop-top {
+  width: 760px;
+  height: 148px;
+  background: url("../images/registeredTop.png") no-repeat;
+}
+.pop-content {
+  width: 760px;
+  height: 452px;
+}
+.pop-content-box {
+  width: 679px;
+  height: 362px;
+  padding: 66px 37px 42px 44px;
+}
+.pop-content-box .pop-l {
+  width: 433px;
+  height: 362px;
+  border-right: 1px solid #E5E5E5;
+  float: left;
+}
+.pop-content-box .pop-r {
+  float: left;
+  width: 245px;
+  height: 362px;
+}
+.phone-box {
+  height: 64px;
+  width: 395px;
+  border-bottom: 1px solid #e5e5e5;
+}
+.phone-box label {
+  display: inline-block;
+  height: 59px;
+  margin-top: 5px;
+  line-height: 59px;
+  width: 85px;
+  font-size: 20px;
+  color: #111111;
+}
+.phone-box #phone-code {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.phone-box #phone-code2 {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.phone-box #new-pwd {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.phone-box #new-pwd2 {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.phone-box #phone-Verification {
+  height: 45px;
+  display: inline-block;
+  width: 190px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.get-code {
+  background: linear-gradient(to right, #ff8d00, #ff5200);
+  width: 110px;
+  height: 40px;
+  color: #ffffff;
+  border-radius: 30px;
+}
+.pwd-box {
+  height: 64px;
+  width: 395px;
+  border-bottom: 1px solid #e5e5e5;
+  margin-top: 15px;
+}
+.pwd-box label {
+  display: inline-block;
+  height: 59px;
+  margin-top: 5px;
+  line-height: 59px;
+  width: 85px;
+  font-size: 20px;
+  color: #111111;
+}
+.pwd-box #pwd-code {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.pop-l-bottom {
+  width: 395px;
+  height: 100px;
+}
+.pop-r-topText {
+  margin-top: 15px;
+  margin-right: 5px;
+}
+.pop-r-topText .Forgotten {
+  float: left;
+  text-decoration: underline;
+  cursor: pointer;
+}
+.pop-r-topText .No-account {
+  float: right;
+}
+.pop-r-topText .No-account .reg-text {
+  color: #ff6600;
+}
+.login-btn {
+  background: linear-gradient(to right, #ff8d00, #ff5200);
+  box-shadow: 0rem 4px 3px #FFDFCD;
+  color: #ffffff;
+  width: 235px;
+  height: 50px;
+  font-size: 22px;
+  margin-left: 80px;
+  margin-top: 35px;
+  border-radius: 30px;
+}
+.login-text {
+  text-align: center;
+  font-size: 16px;
+  color: #B1B1B1;
+  margin-top: 30px;
+}
+.login-text .protocol {
+  color: #111111;
+  text-decoration: underline;
+}
+.download-box {
+  margin-left: 25px;
+  position: relative;
+}
+.download-box .down-img {
+  width: 220px;
+}
+.download-box .down-ping {
+  position: absolute;
+  left: 84.5px;
+  top: 84.5px;
+}
+.down-text {
+  text-align: center;
+  margin-left: 25px;
+  margin-top: 18px;
+  color: #111111;
+}
+.more-login-box {
+  margin-top: 30px;
+  position: relative;
+  text-align: center;
+  margin-left: -25px;
+}
+.more-login-box img {
+  margin-left: 50px;
+}
+.more-login-box .qq-text {
+  position: absolute;
+  left: 87px;
+  color: #111111;
+  bottom: -22px;
+}
+.more-login-box .weixin-text {
+  position: absolute;
+  right: 30px;
+  color: #111111;
+  bottom: -22px;
+}
+.get-Verification {
+  position: relative;
+  width: 108px;
+  height: 38px;
+  border-radius: 14px;
+  background: #ffffff;
+  border: 1px solid #B1B1B1;
+  color: #B1B1B1;
+  cursor: pointer;
+  top: -5px;
+}
+#nick-input {
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.sex-box {
+  font-size: 20px;
+  display: inline-block;
+  color: #B1B1B1;
+}
+.sex-box #sex-input2 {
+  margin-left: 10px;
+}
+#Verification-code {
+  height: 45px;
+  display: inline-block;
+  width: 180px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+input::-webkit-input-placeholder {
+  color: #B1B1B1;
+}
+input::-moz-placeholder {
+  /* Mozilla Firefox 19+ */
+  color: #B1B1B1;
+}
+input:-moz-placeholder {
+  /* Mozilla Firefox 4 to 18 */
+  color: #B1B1B1;
+}
+input:-ms-input-placeholder {
+  /* Internet Explorer 10-11 */
+  color: #B1B1B1;
+}

css/pop.less

+.pop-box{
+  width: 760px;
+  height: 600px;
+}
+.reg-pop-box{
+  width: 760px;
+  height: 786px;
+  overflow: hidden;
+  .pwd-box{
+    margin-top: 13px;
+  }
+}
+.pop-top{
+  width: 760px;
+  height: 148px;
+  background: url("../images/loginTop.png")no-repeat;
+}
+.reg-pop-top{
+  width: 760px;
+  height: 148px;
+  background: url("../images/registeredTop.png")no-repeat;
+
+}
+.pop-content{
+  width: 760px;
+  height: 452px;
+}
+.pop-content-box{
+  width: 679px;
+  height: 362px;
+  padding: 66px 37px 42px 44px;
+  .pop-l{
+    width: 433px;
+    height: 362px;
+    border-right:1px solid #E5E5E5;
+    float: left;
+  }
+  .pop-r{
+    float: left;
+    width: 245px;
+    height: 362px;
+
+  }
+}
+.phone-box{
+  height: 64px;
+  width: 395px;
+  border-bottom:1px solid #e5e5e5;
+  label{
+    display: inline-block;
+    height: 59px;
+    margin-top: 5px;
+    line-height: 59px;
+    width: 85px;
+    font-size: 20px;
+    color: #111111;
+  }
+  #phone-code{
+    height: 45px;
+    display: inline-block;
+    width: 305px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+
+
+  #phone-code2{
+    height: 45px;
+    display: inline-block;
+    width: 305px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+  #new-pwd{
+    height: 45px;
+    display: inline-block;
+    width: 305px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+  #new-pwd2{
+    height: 45px;
+    display: inline-block;
+    width: 305px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+  #phone-Verification{
+    height: 45px;
+    display: inline-block;
+    width: 190px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+
+}
+.get-code{
+  background: linear-gradient(to right, #ff8d00, #ff5200);
+  width: 110px;
+  height: 40px;
+  color: #ffffff;
+  border-radius: 30px;
+}
+.pwd-box{
+  height: 64px;
+  width: 395px;
+  border-bottom:1px solid #e5e5e5;
+  margin-top:15px;
+  label{
+    display: inline-block;
+    height: 59px;
+    margin-top: 5px;
+    line-height: 59px;
+    width: 85px;
+    font-size: 20px;
+    color: #111111;
+  }
+  #pwd-code{
+    height: 45px;
+    display: inline-block;
+    width: 305px;
+    margin-top: -5px;
+    font-size: 20px;
+  }
+}
+.pop-l-bottom{
+  width: 395px;
+  height: 100px;
+}
+.pop-r-topText{
+  margin-top:15px;
+  margin-right:5px;
+  .Forgotten{
+    float: left;
+    text-decoration: underline;
+    cursor: pointer;
+  }
+  .No-account{
+    float: right;
+    .reg-text{
+      color: #ff6600;
+    }
+  }
+}
+.login-btn{
+  background: linear-gradient(to right, #ff8d00 , #ff5200);
+  box-shadow: 0rem 4px 3px #FFDFCD;
+  color: #ffffff;
+  width: 235px;
+  height: 50px;
+  font-size: 22px;
+  margin-left:80px;
+  margin-top: 35px;
+  border-radius: 30px;
+}
+.login-text{
+  text-align: center;
+  font-size: 16px;
+  color: #B1B1B1;
+  margin-top:30px;
+  .protocol{
+    color: #111111;
+    text-decoration: underline;
+  }
+}
+.download-box{
+  margin-left:25px;
+  position: relative;
+  .down-img{
+    width: 220px;
+  }
+  .down-ping{
+    position: absolute;
+    left: 84.5px;
+    top: 84.5px;
+  }
+}
+.down-text{
+  text-align: center;
+  margin-left:25px;
+  margin-top:18px;
+  color: #111111;
+}
+.more-login-box{
+  margin-top:30px;
+  position: relative;
+  text-align: center;
+  margin-left:-25px;
+  img{
+    margin-left:50px;
+  }
+
+  .qq-text{
+    position: absolute;
+    left: 87px;
+    color: #111111;
+    bottom: -22px;
+  }
+  .weixin-text{
+    position: absolute;
+    right: 30px;
+    color: #111111;
+    bottom: -22px;
+  }
+}
+.get-Verification{
+  position: relative;
+  width: 108px;
+  height: 38px;
+  border-radius: 14px;
+  background: #ffffff;
+  border: 1px solid #B1B1B1;
+  color: #B1B1B1;
+  cursor: pointer;
+  top:-5px;
+}
+#nick-input{
+  height: 45px;
+  display: inline-block;
+  width: 305px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+.sex-box{
+  font-size: 20px;
+  display: inline-block;
+  color: #B1B1B1;
+  #sex-input2{
+    margin-left:10px;
+  }
+}
+#Verification-code{
+  height: 45px;
+  display: inline-block;
+  width: 180px;
+  margin-top: -5px;
+  font-size: 20px;
+}
+input::-webkit-input-placeholder{
+  color:#B1B1B1;
+}
+input::-moz-placeholder{   /* Mozilla Firefox 19+ */
+  color:#B1B1B1;
+}
+input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
+  color:#B1B1B1;
+}
+input:-ms-input-placeholder{  /* Internet Explorer 10-11 */
+  color:#B1B1B1;
+}
\ No newline at end of file

css/rech.css

+.rech-box {
+  display: inline-block;
+  width: 760px;
+  height: 600px;
+}
+.layui-layer-setwin .layui-layer-close2 {
+  right: -12px;
+  top: -12px;
+}
+.rech-top img {
+  width: 760px;
+  height: 145px;
+}
+.rech-nav {
+  margin-top: 23px;
+  margin-left: 23px;
+}
+.rech-nav li {
+  float: left;
+  font-size: 20px;
+  color: #B8B8B8;
+}
+.rech-nav .navact {
+  color: #1D1D1D;
+}
+.rech-login {
+  margin-top: 40px;
+  margin-left: 165px;
+  margin-right: 165px;
+}
+.rech-login img {
+  width: 60px;
+  border-radius: 50%;
+}
+.rech-login input {
+  width: 420px;
+  height: 50px;
+  border-radius: 12px;
+  border: 1px solid #C0BFC7;
+  font-size: 20px;
+  text-indent: 1em;
+}
+.rech-nicheng {
+  line-height: 60px;
+  margin-top: 15px;
+  margin-bottom: 24px;
+}
+.rech-nicheng span {
+  margin-left: 15px;
+  font-size: 18px;
+}
+.rech-next {
+  height: 50px;
+  width: 420px;
+  border-radius: 64px;
+  border: none;
+  font-size: 22px;
+  background: #DFDFE1;
+  color: #ffffff;
+  line-height: 50px;
+}
+.rech-next2 {
+  height: 50px;
+  width: 310px;
+  border-radius: 64px;
+  border: none;
+  font-size: 22px;
+  background: #DFDFE1;
+  color: #ffffff;
+  line-height: 50px;
+}
+.rech-nextok {
+  height: 50px;
+  width: 420px;
+  border-radius: 64px;
+  border: none;
+  font-size: 22px;
+  background: linear-gradient(to right, #FE8D00, #FF5102);
+  color: #ffffff;
+  line-height: 50px;
+}
+.rech-back {
+  height: 50px;
+  width: 310px;
+  margin-right: 10px;
+  border-radius: 64px;
+  border: none;
+  font-size: 22px;
+  background: linear-gradient(to right, #FE8D00, #FF5102);
+  color: #ffffff;
+  line-height: 50px;
+}
+.pay-nextok {
+  height: 50px;
+  width: 310px;
+  border-radius: 64px;
+  border: none;
+  font-size: 22px;
+  background: linear-gradient(to right, #FE8D00, #FF5102);
+  color: #ffffff;
+  line-height: 50px;
+}
+.rech-tips {
+  text-align: center;
+  color: #FF6702;
+  margin-top: 10px;
+  font-size: 16px;
+}
+.rech-txt {
+  font-size: 18px;
+  margin-bottom: 18px;
+}
+.rech-sos {
+  color: red;
+  font-size: 16px;
+  height: 24px;
+}
+.rech-showtime ul {
+  margin-left: 60px;
+  margin-right: 60px;
+  margin-top: 20px;
+}
+.rech-showtime ul .pay-more {
+  width: 200px;
+  margin-right: 10px;
+  height: 60px;
+  margin-bottom: 10px;
+  float: left;
+  border: 1px solid #EBEBEB;
+  border-radius: 8px;
+  position: relative;
+  cursor: pointer;
+}
+.pay-more .pay-money {
+  height: 30px;
+  line-height: 30px;
+  text-align: center;
+  font-size: 18px;
+}
+.pay-more .pay-diamoad {
+  height: 30px;
+  line-height: 30px;
+  text-align: center;
+  color: #AEAEAE;
+  font-size: 14px;
+}
+.pay-ck {
+  margin-left: 60px;
+  margin-right: 60px;
+  margin-top: 10px;
+  margin-bottom: 35px;
+}
+.pay-ck div {
+  float: left;
+  height: 40px;
+  width: 110px;
+  margin-right: 15px;
+  border: 1px solid #EBEBEB;
+  text-align: center;
+  line-height: 40px;
+  border-radius: 8px;
+  cursor: pointer;
+}
+.pay-ck div img {
+  margin-top: -3px;
+  margin-right: 5px;
+  vertical-align: middle;
+}
+.pay-btn {
+  margin-left: 55px;
+  margin-top: 10px;
+  margin-right: 60px;
+}
+.tuijian {
+  position: absolute;
+  left: -15px;
+  top: -15px;
+}
+.rid {
+  float: left;
+  visibility: hidden;
+}
+.mk {
+  background: url("../images/moneyok.png");
+  background-size: 100% 100%;
+}
+.pk {
+  background: url("../images/payok.png");
+  background-size: 100% 100%;
+}
+.pay-xz {
+  position: absolute;
+  visibility: hidden;
+}
+#pay-erwei img {
+  margin: 0 auto;
+  margin-top: 40px;
+  display: block;
+  margin-bottom: 20px;
+  border-radius: 12px;
+}
+.pay-tips {
+  text-align: center;
+  font-size: 28px;
+  font-family: ΢���ź�;
+}
+.pay-p-end {
+  text-align: center;
+  margin-top: 30px;
+  font-size: 27px;
+  font-family: sans-serif;
+  margin-bottom: 80px;
+}
+.pay-img-end {
+  margin-left: 300px;
+  margin-top: 50px;
+}
+.ul-face {
+  position: relative;
+}
+.face-ck {
+  position: absolute;
+  top: -55px;
+  right: 0;
+}
+.face-ck img {
+  width: 50px;
+  border-radius: 50%;
+}
+.face-ck span {
+  line-height: 50px;
+  margin-left: 20px;
+  font-size: 16px;
+}
+.paybox {
+  display: none;
+}
+.paybox > p {
+  text-align: center;
+  margin-top: 20px;
+  margin-bottom: 20px;
+  font-size: 18px;
+}
+.paybox button {
+  position: absolute;
+  top: 140px;
+  left: 74px;
+  width: 174px;
+  border-radius: 6px;
+  font-size: 18px;
+  border: none;
+  background: linear-gradient(to right, #FF9607, #FF6A00);
+  color: #ffffff;
+  height: 35px;
+}
+.layer-face {
+  float: left;
+  width: 55px;
+  border-radius: 50%;
+  margin-left: 30px;
+}
+.layer-face img {
+  width: 55px;
+  border-radius: 50%;
+}
+.layer-uid {
+  float: left;
+  line-height: 26px;
+  font-size: 17px;
+  margin-left: 23px;
+}
+.rech-inp {
+  outline: none;
+}

css/scrollBar.css

+.zl-scrollBarBox{
+    height:100%;
+    position:absolute;
+    background:#f3f3f3;
+}
+.zl-scrollBar{
+    position:absolute;
+    left:0;
+    top:0;
+    background:#848484;
+    transition:background 0.3s;
+}
+.zl-scrollBar.zl-verticalBar{
+    min-height:10px;
+}
+
+.zl-scrollBar.zl-horizontalBar{
+    min-width:10px;
+}
+.zl-scrollBar:hover{
+    background:#000;
+}
+.zl-scrollContentDiv{
+    position:relative !important;
+    width:100% !important;
+    height:100% !important;
+    padding:0 !important;
+    margin:0 !important;
+    top:0;
+    left:0;
+}
\ No newline at end of file