/*
 * @Author: Your name
 * @Date:   2020-03-05 09:47:14
 * @Last Modified by: mikey.zhaopeng
 * @Last Modified time: 2021-06-Tu 11:27:52
 */
.fl {
  float: left;
  width: 100px;
  line-height: 32px;
}

.flTow {
  float: left;
}

.content-right {
  font-size: 14px;
  font-family: "微软雅黑";
  color: #535151;
}

.content-right .userinfo-top {
  width: 850px;
  margin: 50px auto 17px auto;
}

.content-right .userinfo-top dl {
  float: left;
}

.content-right .userinfo-top dl dt,
.content-right .userinfo-top dl dd {
  float: left;
}

.content-right .userinfo-top dl dt a,
.content-right .userinfo-top dl dd a {
  display: block;
  width: 61px;
  height: 60px;
}

.content-right .userinfo-top .choose dt,
.content-right .userinfo-top .write dt,
.content-right .userinfo-top .confirm dt,
.content-right .userinfo-top .validation dt {
  position: relative;
  left: 0;
  top: 27px;
}

.content-right .userinfo-top .choose dt {
  width: 112px;
  height: 6px;
  background: url(../img/choose.jpg);
}

.content-right .userinfo-top .choose a {
  background: url(../img/icon-3.png) no-repeat -283px -170px;
}

.content-right .userinfo-top .write dt {
  width: 127px;
  height: 6px;
  background: #c0a062;
}

.content-right .userinfo-top .write a {
  background: url(../img/icon-3.png) no-repeat -453px -170px;
}

.content-right .userinfo-top .confirm dt {
  width: 127px;
  height: 6px;
  background: #c0a062;
}

.content-right .userinfo-top .confirm a {
  background: url(../img/icon-3.png) no-repeat -283px -339px;
}

.content-right .userinfo-top .validation .dt-first {
  width: 127px;
  height: 6px;
  background: #dcdcdc;
}

.content-right .userinfo-top .validation .dt-last {
  width: 110px;
  height: 6px;
  background: url(../img/validation.jpg) no-repeat;
}

.content-right .userinfo-top .validation a {
  background: url(../img/icon-3.png) no-repeat -453px -680px;
}

.content-right .userinfo-bottom {
  width: 657px;
  margin: 0 auto;
}

.content-right .userinfo-bottom dl {
  float: left;
  margin-left: 110px;
}

.content-right .userinfo-bottom dl dt,
.content-right .userinfo-bottom dl dd {
  float: left;
}

.content-right .userinfo-bottom dl dd {
  margin-left: 5px;
}

.content-right .userinfo-bottom dl dt {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  color: #fff;
  text-align: center;
}

.content-right .userinfo-bottom .choose {
  margin-left: 0;
}

.content-right .userinfo-bottom .choose dt {
  background: #c0a062;
  border-radius: 50%;
}

.content-right .userinfo-bottom .write dt {
  background: #c0a062;
  border-radius: 50%;
}

.content-right .userinfo-bottom .confirm dt {
  background: #c0a062;
  border-radius: 50%;
}

.content-right .userinfo-bottom .validation dt {
  background: #dcdcdc;
  border-radius: 50%;
}

.content-right .fillIn p {
  margin: 0 10px 0 10px;
  padding: 20px 0;
  border-bottom: 1px dashed #d6c3a1;
  color: #c0a062;
  font-size: 18px;
}

.content-right .fillIn p span {
  display: inline-block;
  width: 6px;
  height: 18px;
  background: #c0a062;
  margin-right: 10px;
  position: relative;
  left: 0;
  top: 2px;
}

.content-right .tab {
  padding-bottom: 20px;
}

.content-right .tab p {
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid #d2d2d2;
  background: #ebdfc7;
  text-indent: 20px;
  font-size: 16px;
}

.content-right .tab div {
  margin: 25px 0 0 21px;
}

.content-right .tab div label {
  font-size: 16px;
  color: #333;
}

.content-right .tab div input,
.content-right .tab div select {
  height: 32px;
  line-height: 32px;
  width: 190px;
  border-color: #d2d2d2;
  padding-left: 10px;
  box-sizing: border-box;
}

.content-right .tab div .select-style {
  display: inline-block;
  position: relative;
  width: 192px;
  margin: 0;
}

.content-right .tab div select {
  width: 192px;
  cursor: pointer;
  margin-left: -4px;
  border: 1px solid #a9a9a9;
  -webkit-appearance: inherit;
  -moz-appearance: inherit;
  appearance: inherit;
  background: url("../img/down_gray1.png") no-repeat right top;
}

.content-right .tab div select option {
  line-height: 26px;
  padding: 0 0 0 10px;
}

.content-right .tab div select option:hover {
  background: #1fa0e0;
}

.content-right .tab div .getPhoneNum,
.content-right .tab div #msgAuth {
  display: inline-block;
  line-height: 31px;
  height: 31px;
  margin-left: 4px;
  vertical-align: bottom;
  margin-right: 10px;
}

.content-right .tab div #msgAuth {
  width: 100px;
  margin-left: 0;
  padding: 0;
  cursor: pointer;
  text-align: center;
  border: none;
}

.content-right .tab div #msgAuth:focus {
  outline: none;
}

.content-right .tab div #msgAuth:hover {
  border: none;
}

.content-right .tab div .validation {
  display: inline-block;
  height: 30px;
  width: 118px;
  line-height: 30px;
  text-align: center;
  border: 1px solid #d2d2d2;
  vertical-align: middle;
  font-size: 14px;
  cursor: pointer;
  margin-right: 10px;
}

.content-right .tab div .no-border {
  border: none;
}

.content-right .tab .phone-tip {
  padding-left: 96px;
}

.content-right .tab .policy-error {
  display: inline-block;
  width: 300px;
  margin-left: 14px;
}

body .tip-box .layui-layer-title {
  background: #1fa0e0;
  padding: 0 0 0 30px;
  height: 50px;
  line-height: 50px;
  color: #fff;
  text-align: left;
  font-size: 18px;
  border-bottom: none;
}

body .tip-box .layui-layer-content {
  padding: 18px 30px 0 30px;
  height: 65px;
  line-height: 30px;
  font-size: 16px;
  color: #484646;
}

body .tip-box .layui-layer-btn {
  padding: 0 0 20px 0;
  text-align: center;
}

body .tip-box .layui-layer-btn0 {
  display: block;
  width: 100px;
  height: 32px;
  padding: 0;
  border: none;
  margin: 0 auto;
  border-radius: 4px;
  font-size: 16px;
  text-align: center;
  line-height: 32px;
  background: #1fa0e0;
  color: #fff;
}

body .tip-box .layui-layer-btn0:hover {
  background: #008dd1;
}

body .tip-box .layui-layer-setwin .layui-layer-ico {
  background: url("../img/close.png") no-repeat;
}

.centers {
  text-align: center;
  margin-top: 50px;
}

.qrCode {
  display: inline-block;
  width: 258px;
  padding-right: 50px;
}

.qrImage {
  height: 258px;
  overflow: hidden;
}

.qrImageL{
  width: 258px;
  overflow: hidden;
}

.qrImageL img{
  width: 258px;
}

.qrCode_title {
  margin-top: 10px;
  font-size: 18px;
  font-weight: 700;
  color: #333;
}

.steps {
  display: flex;
  height: 45px;
  line-height: 45px;
  border-bottom: 1px solid #ebebeb;
}

.steps_item {
  width: 33%;
  position: relative;
  text-align: center;
  cursor: pointer;
}

.steps_item::before{
  position: absolute;
    bottom: 0;
    left: 50%;
    display: inline-block;
    width: 0;
    height: 3px;
    background-color: #1890ff;
    transition: width .3s,left .3s;
    transition-timing-function: ease-out;
    content: "";
}

.steps_item_active::before{
  left: 0;
  width: 100%;
}

.steps_item_icon::after {
  position: absolute;
  top: 70%;
  left: 100%;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-top: -14px;
  margin-left: -2px;
  border: 1px solid rgba(0, 0, 0, .25);
  border-bottom: none;
  border-left: none;
  transform: rotate(45deg);
  content: "";
}