.display-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex
}

.backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .7);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: .1s opacity linear;
  transition: .1s opacity linear
}

.backdrop.visible {
  visibility: visible
}

.backdrop.active {
  opacity: 1
}

.flex-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 5px;
  width: 100%;
  box-sizing: border-box
}

.flex-grid>.col {
  -webkit-box-flex: 1;
  -webkit-flex: 1 null null;
  -moz-flex: 1 null null;
  -ms-flex: 1 null null;
  flex: 1 null null;
  display: block;
  padding: 5px;
  width: 100%
}

.flex-grid.no-padding {
  padding: 0
}

.flex-grid.no-padding>.col {
  padding: 0
}

.flex-grid+.flex-grid {
  margin-top: -5px;
  padding-top: 0
}

.flex-grid-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

.flex-grid .col-two>.col-left {
  float: left
}

.flex-grid .col-two>.col-right {
  display: block;
  overflow: hidden
}

.col-offset-10 {
  margin-left: 10%
}

.col-offset-20 {
  margin-left: 20%
}

.col-offset-25 {
  margin-left: 25%
}

.col-offset-33,
.col-offset-34 {
  margin-left: 33.3333%
}

.col-offset-50 {
  margin-left: 50%
}

.col-offset-66,
.col-offset-67 {
  margin-left: 66.6666%
}

.col-offset-75 {
  margin-left: 75%
}

.col-offset-80 {
  margin-left: 80%
}

.col-offset-90 {
  margin-left: 90%
}

.col-10 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 10%;
  -moz-flex: 0 0 10%;
  -ms-flex: 0 0 10%;
  flex: 0 0 10%;
  max-width: 10%
}

.col-20 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 20%;
  -moz-flex: 0 0 20%;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%
}

.col-25 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 25%;
  -moz-flex: 0 0 25%;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%
}

.col-33,
.col-34 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 33.3333%;
  -moz-flex: 0 0 33.3333%;
  -ms-flex: 0 0 33.3333%;
  flex: 0 0 33.3333%;
  max-width: 33.3333%
}

.col-40 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 40%;
  -moz-flex: 0 0 40%;
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
  max-width: 40%
}

.col-50 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 50%;
  -moz-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%
}

.col-60 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -moz-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  max-width: 60%
}

.col-66,
.col-67 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 66.6666%;
  -moz-flex: 0 0 66.6666%;
  -ms-flex: 0 0 66.6666%;
  flex: 0 0 66.6666%;
  max-width: 66.6666%
}

.col-75 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 75%;
  -moz-flex: 0 0 75%;
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%
}

.col-80 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 80%;
  -moz-flex: 0 0 80%;
  -ms-flex: 0 0 80%;
  flex: 0 0 80%;
  max-width: 80%
}

.col-90 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 90%;
  -moz-flex: 0 0 90%;
  -ms-flex: 0 0 90%;
  flex: 0 0 90%;
  max-width: 90%
}

@media (max-width:567px) {
  '.responsive-sm' {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
  }

  '.responsive-sm'.col,
  '.responsive-sm'.col-10,
  '.responsive-sm'.col-20,
  '.responsive-sm'.col-25,
  '.responsive-sm'.col-33,
  '.responsive-sm'.col-34,
  '.responsive-sm'.col-50,
  '.responsive-sm'.col-66,
  '.responsive-sm'.col-67,
  '.responsive-sm'.col-75,
  '.responsive-sm'.col-80,
  '.responsive-sm'.col-90 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 null null;
    -moz-flex: 1 null null;
    -ms-flex: 1 null null;
    flex: 1 null null;
    margin-bottom: 15px;
    margin-left: 0;
    max-width: 100%;
    width: 100%
  }
}

@media (max-width:767px) {
  '.responsive-md' {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
  }

  '.responsive-md'.col,
  '.responsive-md'.col-10,
  '.responsive-md'.col-20,
  '.responsive-md'.col-25,
  '.responsive-md'.col-33,
  '.responsive-md'.col-34,
  '.responsive-md'.col-50,
  '.responsive-md'.col-66,
  '.responsive-md'.col-67,
  '.responsive-md'.col-75,
  '.responsive-md'.col-80,
  '.responsive-md'.col-90 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 null null;
    -moz-flex: 1 null null;
    -ms-flex: 1 null null;
    flex: 1 null null;
    margin-bottom: 15px;
    margin-left: 0;
    max-width: 100%;
    width: 100%
  }
}

@media (max-width:1023px) {
  '.responsive-lg' {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
  }

  '.responsive-lg'.col,
  '.responsive-lg'.col-10,
  '.responsive-lg'.col-20,
  '.responsive-lg'.col-25,
  '.responsive-lg'.col-33,
  '.responsive-lg'.col-34,
  '.responsive-lg'.col-50,
  '.responsive-lg'.col-66,
  '.responsive-lg'.col-67,
  '.responsive-lg'.col-75,
  '.responsive-lg'.col-80,
  '.responsive-lg'.col-90 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 null null;
    -moz-flex: 1 null null;
    -ms-flex: 1 null null;
    flex: 1 null null;
    margin-bottom: 15px;
    margin-left: 0;
    max-width: 100%;
    width: 100%
  }
}

.clearfix:after,
.clearfix:before {
  content: " ";
  display: table
}

.clearfix:after {
  clear: both
}

.pull-right {
  float: right !important
}

.pull-left {
  float: left !important
}

.hide {
  display: none !important
}

.show {
  display: block !important
}

.invisible {
  visibility: hidden
}

.none {
  display: none
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0
}

.block {
  display: block
}

.nowrap {
  white-space: nowrap
}

.text-right {
  text-align: right
}

.text-center {
  text-align: center
}

.text-link {
  color: #333
}

.text-link:hover {
  color: #333
}

.text-tips {
  color: #999
}

.cur-pointer {
  cursor: pointer
}

.cur-disabled {
  cursor: not-allowed
}

.text-overflow {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.m-r-30 {
  margin-right: 30px
}

.m-t-30 {
  margin-top: 30px
}

.m-b-30 {
  margin-bottom: 30px
}

.m-l-30 {
  margin-left: 30px
}

.p-r-30 {
  padding-right: 30px
}

.p-t-30 {
  padding-top: 30px
}

.p-l-30 {
  padding-left: 30px
}

.p-b-30 {
  padding-bottom: 30px
}

.m-r-25 {
  margin-right: 25px
}

.m-t-25 {
  margin-top: 25px
}

.m-b-25 {
  margin-bottom: 25px
}

.m-l-25 {
  margin-left: 25px
}

.p-r-25 {
  padding-right: 25px
}

.p-t-25 {
  padding-top: 25px
}

.p-l-25 {
  padding-left: 25px
}

.p-b-25 {
  padding-bottom: 25px
}

.m-r-20 {
  margin-right: 20px
}

.m-t-20 {
  margin-top: 20px
}

.m-b-20 {
  margin-bottom: 20px
}

.m-l-20 {
  margin-left: 20px
}

.p-r-20 {
  padding-right: 20px
}

.p-t-20 {
  padding-top: 20px
}

.p-l-20 {
  padding-left: 20px
}

.p-b-20 {
  padding-bottom: 20px
}

.m-r-15 {
  margin-right: 15px
}

.m-t-15 {
  margin-top: 15px
}

.m-b-15 {
  margin-bottom: 15px
}

.m-l-15 {
  margin-left: 15px
}

.p-r-15 {
  padding-right: 15px
}

.p-t-15 {
  padding-top: 15px
}

.p-l-15 {
  padding-left: 15px
}

.p-b-15 {
  padding-bottom: 15px
}

.m-r-10 {
  margin-right: 10px
}

.m-t-10 {
  margin-top: 10px
}

.m-b-10 {
  margin-bottom: 10px
}

.m-l-10 {
  margin-left: 10px
}

.p-r-10 {
  padding-right: 10px
}

.p-t-10 {
  padding-top: 10px
}

.p-l-10 {
  padding-left: 10px
}

.p-b-10 {
  padding-bottom: 10px
}

.m-r-5 {
  margin-right: 5px
}

.m-t-5 {
  margin-top: 5px
}

.m-b-5 {
  margin-bottom: 5px
}

.m-l-5 {
  margin-left: 5px
}

.p-r-5 {
  padding-right: 5px
}

.p-t-5 {
  padding-top: 5px
}

.p-l-5 {
  padding-left: 5px
}

.p-b-5 {
  padding-bottom: 5px
}

.m-r-0 {
  margin-right: 0
}

.m-t-0 {
  margin-top: 0
}

.m-b-0 {
  margin-bottom: 0
}

.m-l-0 {
  margin-left: 0
}

.p-r-0 {
  padding-right: 0
}

.p-t-0 {
  padding-top: 0
}

.p-l-0 {
  padding-left: 0
}

.p-b-0 {
  padding-bottom: 0
}

.f-12 {
  font-size: 12px !important
}

.f-14 {
  font-size: 14px !important
}

.f-16 {
  font-size: 16px !important
}

.f-b {
  font-weight: 700 !important
}

.f-st {
  font-family: "宋体", Helvetica, sans-serif
}

.c-info {
  color: #e74c3c
}

.c-dark {
  color: #333
}

.c-success {
  color: #10c482
}

.c-warning {
  color: #f19149
}

.c-danger {
  color: #e60012
}

.border-size {
  box-sizing: border-box
}

.border-size * {
  box-sizing: border-box
}

/*!
 * Cropper v3.0.0-alpha.1
 * https://github.com/fengyuanchen/cropper
 *
 * Copyright (c) 2017 Fengyuan Chen
 * Released under the MIT license
 *
 * Date: 2017-01-21T11:58:14.219Z
 */
.cropper-container {
  font-size: 0;
  line-height: 0;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  direction: ltr;
  -ms-touch-action: none;
  touch-action: none
}

.cropper-container img {
  display: block;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  max-height: none !important;
  width: 100%;
  height: 100%;
  image-orientation: 0deg
}

.cropper-canvas,
.cropper-crop-box,
.cropper-drag-box,
.cropper-modal,
.cropper-wrap-box {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0
}

.cropper-wrap-box {
  overflow: hidden
}

.cropper-drag-box {
  opacity: 0;
  background-color: #fff
}

.cropper-modal {
  opacity: .5;
  background-color: #000
}

.cropper-view-box {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  outline: 1px solid #39f;
  outline-color: rgba(51, 153, 255, .75)
}

.cropper-dashed {
  position: absolute;
  display: block;
  opacity: .5;
  border: 0 dashed #eee
}

.cropper-dashed.dashed-h {
  top: 33.33333%;
  left: 0;
  width: 100%;
  height: 33.33333%;
  border-top-width: 1px;
  border-bottom-width: 1px
}

.cropper-dashed.dashed-v {
  top: 0;
  left: 33.33333%;
  width: 33.33333%;
  height: 100%;
  border-right-width: 1px;
  border-left-width: 1px
}

.cropper-center {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 0;
  height: 0;
  opacity: .75
}

.cropper-center:after,
.cropper-center:before {
  position: absolute;
  display: block;
  content: ' ';
  background-color: #eee
}

.cropper-center:before {
  top: 0;
  left: -3px;
  width: 7px;
  height: 1px
}

.cropper-center:after {
  top: -3px;
  left: 0;
  width: 1px;
  height: 7px
}

.cropper-face,
.cropper-line,
.cropper-point {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  opacity: .1
}

.cropper-face {
  top: 0;
  left: 0;
  background-color: #fff
}

.cropper-line {
  background-color: #39f
}

.cropper-line.line-e {
  top: 0;
  right: -3px;
  width: 5px;
  cursor: e-resize
}

.cropper-line.line-n {
  top: -3px;
  left: 0;
  height: 5px;
  cursor: n-resize
}

.cropper-line.line-w {
  top: 0;
  left: -3px;
  width: 5px;
  cursor: w-resize
}

.cropper-line.line-s {
  bottom: -3px;
  left: 0;
  height: 5px;
  cursor: s-resize
}

.cropper-point {
  width: 5px;
  height: 5px;
  opacity: .75;
  background-color: #39f
}

.cropper-point.point-e {
  top: 50%;
  right: -3px;
  margin-top: -3px;
  cursor: e-resize
}

.cropper-point.point-n {
  top: -3px;
  left: 50%;
  margin-left: -3px;
  cursor: n-resize
}

.cropper-point.point-w {
  top: 50%;
  left: -3px;
  margin-top: -3px;
  cursor: w-resize
}

.cropper-point.point-s {
  bottom: -3px;
  left: 50%;
  margin-left: -3px;
  cursor: s-resize
}

.cropper-point.point-ne {
  top: -3px;
  right: -3px;
  cursor: ne-resize
}

.cropper-point.point-nw {
  top: -3px;
  left: -3px;
  cursor: nw-resize
}

.cropper-point.point-sw {
  bottom: -3px;
  left: -3px;
  cursor: sw-resize
}

.cropper-point.point-se {
  right: -3px;
  bottom: -3px;
  width: 20px;
  height: 20px;
  cursor: se-resize;
  opacity: 1
}

@media (min-width:768px) {
  .cropper-point.point-se {
    width: 15px;
    height: 15px
  }
}

@media (min-width:992px) {
  .cropper-point.point-se {
    width: 10px;
    height: 10px
  }
}

@media (min-width:1200px) {
  .cropper-point.point-se {
    width: 5px;
    height: 5px;
    opacity: .75
  }
}

.cropper-point.point-se:before {
  position: absolute;
  right: -50%;
  bottom: -50%;
  display: block;
  width: 200%;
  height: 200%;
  content: ' ';
  opacity: 0;
  background-color: #39f
}

.cropper-invisible {
  opacity: 0
}

.cropper-bg {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)
}

.cropper-hide {
  position: absolute;
  display: block;
  width: 0;
  height: 0
}

.cropper-hidden {
  display: none !important
}

.cropper-move {
  cursor: move
}

.cropper-crop {
  cursor: crosshair
}

.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
  cursor: not-allowed
}

.index-img-upload-canvas {
  padding: 40px 20px;
  border-radius: 5px;
  background: #fff;
  min-width: 300px
}

.index-img-upload-canvas .h-icon-remove {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo3YjY4YTlkYy04YzA1LTY5NDctOTUyNy1lYmRjMzI2MDZlNzMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Nzk2NDY2NkFDMjhBMTFFNjlDRjU5QzU4NTRCMERCNEMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Nzk2NDY2NjlDMjhBMTFFNjlDRjU5QzU4NTRCMERCNEMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YzIyODY5ZDAtNjVlNS1hMjQxLThiNGQtNzFjNTY1NWU3OGUxIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6N2MxYWJhNzItYzFiMC0xMWU2LTlkNTAtYWQ4ZmU3OWRlMmYwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Y8qBeQAAAMtJREFUeNqsk0EKwjAQRVvNUo+gopV4h67UhXpioat6AFduhLgQC270EPEPZCAMMyC0Aw9Kkv+YDGkZYyz6VDmIIIRA31cwAQfQGedXoAFf731NCyMWpfAGXMDcCNPeGkx5kQV0jyN4gqUi4fAMPMBJCqheYKdIZJjOvDnkRJssaTOJs8KyA6sTM2wJqMaiO5fWin8E8s7WYFVBpQxMDnZhCao0PHlnOZM2l+QPqUnhoAxMSs7aQ/qAG9hr006SLbjTUx72Z+pTPwEGADDeRxSyfbv8AAAAAElFTkSuQmCC);
  width: 26px;
  height: 26px;
  text-indent: 999999px;
  text-indent: -999999px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute
}

.index-img-upload-canvas h3.title {
  margin-top: 0;
  font-size: 24px;
  font-weight: 500;
  color: #404040;
  text-align: center
}

.index-img-upload-canvas.img-upload-canvas .img-content {
  margin: 40px auto 30px;
  max-width: 800px;
  width: auto;
  height: auto
}

.index-img-upload-canvas.img-upload-canvas .img-content img {
  width: 100%;
  height: 100%
}

.index-img-upload-canvas.img-upload-canvas .sub-title {
  color: #666;
  padding: 0 24px;
  margin-top: 2px;
  font-size: 14px;
  line-height: 1.5;
  text-align: center
}

.index-img-upload-canvas .ac_upload {
  width: 100%;
  border: 1px solid #1ccdb9;
  background: #1ccdb9;
  margin-top: 36px;
  display: inline-block;
  border-radius: 2px;
  height: 33px;
  line-height: 34px;
  color: #fff;
  text-align: center
}

.index-img-upload-canvas .ac_upload:hover {
  background: #1ccdb9
}

.index-img-upload-canvas .tools {
  width: 256px;
  margin: 10px auto
}

.index-img-upload-canvas input[type=range].RangeInput {
  width: 195px;
  height: 12px;
  padding: 0;
  margin: 0 10px;
  vertical-align: middle;
  background: 0 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  appearance: none
}

.index-img-upload-canvas input[type=range].RangeInput {
  width: 195px;
  height: 12px;
  padding: 0;
  margin: 0 10px;
  vertical-align: middle;
  background: 0 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  appearance: none
}

.index-img-upload-canvas input[type=range].RangeInput:focus {
  outline: 0
}

.index-img-upload-canvas input[type=range].RangeInput::-webkit-slider-runnable-track {
  height: 5px;
  cursor: pointer;
  background: #f2f5fb;
  border-radius: 2px
}

.index-img-upload-canvas input[type=range].RangeInput::-webkit-slider-thumb {
  width: 12px;
  height: 12px;
  margin-top: -4px;
  cursor: pointer;
  background: #d2dbe8;
  border-radius: 50%;
  -webkit-appearance: none;
  appearance: none
}

.index-img-upload-canvas input[type=range].RangeInput::-moz-range-track {
  height: 5px;
  cursor: pointer;
  background: #f2f5fb;
  border-radius: 2px
}

.index-img-upload-canvas input[type=range].RangeInput::-moz-range-thumb {
  width: 12px;
  height: 12px;
  cursor: pointer;
  background: #d2dbe8;
  border: none;
  border-radius: 50%
}

.index-img-upload-canvas input[type=range].RangeInput::-ms-track {
  width: 100%;
  height: 5px;
  color: transparent;
  cursor: pointer;
  background: 0 0;
  border-color: transparent
}

.index-img-upload-canvas input[type=range].RangeInput::-ms-fill-lower,
.index-img-upload-canvas input[type=range].RangeInput::-ms-fill-upper {
  background: #f2f5fb;
  border-radius: 2px
}

.index-img-upload-canvas input[type=range].RangeInput::-ms-thumb {
  width: 12px;
  height: 12px;
  cursor: pointer;
  background: #d2dbe8;
  border: none;
  border-radius: 50%
}

.index-img-upload-canvas input[type=range].RangeInput::-ms-tooltip {
  display: none
}

@-webkit-keyframes progress-run {
  0% {
    width: 0
  }

  10% {
    width: 0
  }

  20% {
    width: 0
  }

  30% {
    width: 33.33%
  }

  40% {
    width: 33.33%
  }

  50% {
    width: 33.33%
  }

  60% {
    width: 66.66%
  }

  70% {
    width: 66.66%
  }

  80% {
    width: 66.66%
  }

  90% {
    width: 100%
  }

  100% {
    width: 100%
  }
}

@keyframes progress-run {
  0% {
    width: 0
  }

  10% {
    width: 0
  }

  20% {
    width: 0
  }

  30% {
    width: 33.33%
  }

  40% {
    width: 33.33%
  }

  50% {
    width: 33.33%
  }

  60% {
    width: 66.66%
  }

  70% {
    width: 66.66%
  }

  80% {
    width: 66.66%
  }

  90% {
    width: 100%
  }

  100% {
    width: 100%
  }
}

header {
  position: absolute;
  z-index: 999;
  width: 100%;
  min-width: 1180px;
  background: #fff;
  border-bottom: 1px solid #e2e7eb
}

header .header-wrap {
  padding: 8px 20px
}

header .header-wrap:after,
header .header-wrap:before {
  content: " ";
  display: table
}

header .header-wrap:after {
  clear: both
}

header .header-wrap:after,
header .header-wrap:before {
  content: " ";
  display: table
}

header .header-wrap:after {
  clear: both
}

header .header-wrap .header-logo>.title {
  display: inline-block;
  margin-left: 18px;
  padding: 10px 20px;
  font-size: 16px;
  vertical-align: middle;
  border-left: 1px solid #e2e7eb
}

header .header-wrap .nav-list {
  position: absolute;
  top: 20px;
  margin-left: -290px;
  left: 50%
}

header .header-wrap .nav-list li {
  float: left
}

header .header-wrap .nav-list li.active a {
  background: #e60012;
  color: #fff
}

header .header-wrap .nav-list li:not(:first-child) {
  margin-left: 60px
}

header .header-wrap .nav-list li a {
  display: inline-block;
  width: 100px;
  text-align: center;
  padding: 6px 0;
  border-radius: 50px
}

header .header-wrap .login-logout {
  position: relative;
  cursor: pointer
}

header .header-wrap .login-logout .login {
  line-height: 74px;
  margin: -8px 0
}

header .header-wrap .login-logout .icon-people-wrap {
  display: inline-block;
  margin-right: 11px;
  top: 5px;
  padding: 0 10px
}

header .header-wrap .login-logout .icon-people {
  display: inline-block;
  width: 30px;
  height: 30px;
  background: #777272 url(../images/common/icon-people.png) no-repeat center;
  vertical-align: middle;
  -o-border-radius: 50%;
  border-radius: 50%
}

header .header-wrap .login-logout .icon-logout {
  display: inline-block;
  width: 30px;
  height: 30px;
  background: url(../images/common/icon-logout.png) no-repeat center;
  vertical-align: middle
}

header .header-wrap .login-logout .icon-triangle {
  position: relative;
  display: inline-block;
  width: 0;
  height: 0;
  overflow: hidden;
  border: 6px solid transparent;
  border-top-color: #666;
  vertical-align: middle
}

header .header-wrap .login-logout .logout {
  position: absolute;
  top: 66px;
  padding: 10px 15px;
  width: 100px;
  background: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, .2);
  display: none
}

header .header-wrap .login-logout.active .icon-people-wrap {
  box-shadow: 0 0 5px rgba(0, 0, 0, .2)
}

header .header-wrap .login-logout.active .icon-people-wrap:after {
  background-color: #fff;
  height: 5px;
  content: "";
  position: absolute;
  z-index: 2;
  bottom: -10px;
  left: 0;
  width: 50px
}

header .header-wrap .login-logout.active .logout {
  display: block
}

footer {
  background: #282b2d
}

footer .footer-wrap {
  padding: 45px 0;
  min-width: 1180px;
  height: 31px;
  margin-top: -121px;
  overflow: hidden
}

footer .footer-wrap .link-copyright {
  margin: 0 auto;
  color: #8a8a8a;
  font-size: 12px;
  line-height: 31px;
  height: 31px;
  position: relative
}

footer .footer-wrap .link-menu {
  position: absolute;
  right: 0;
  top: 0;
  color: #999
}

footer .footer-wrap .link-menu .link-item-one {
  position: relative;
  top: -8px
}

footer .footer-wrap .link-menu .link-item-two {
  position: relative;
  top: -20px
}

footer .footer-wrap .link-menu .link-item-three {
  position: relative;
  top: -32px
}

footer .footer-wrap .link-menu a {
  color: #999;
  text-decoration: none
}

footer .footer-wrap .link-menu a:hover {
  text-decoration: underline
}

/*!
 * jQuery UI Datepicker @VERSION
 * http://jqueryui.com
 *
 * Copyright jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 *
 * http://api.jqueryui.com/datepicker/#theming
 */
.ui-datepicker {
  width: 18em;
  padding: 0;
  display: none
}

.ui-datepicker .ui-datepicker-header {
  position: relative;
  padding: .2em 0
}

.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
  position: absolute;
  top: 2px;
  width: 1.8em;
  height: 1.8em
}

.ui-datepicker .ui-datepicker-next-hover,
.ui-datepicker .ui-datepicker-prev-hover {
  top: 1px
}

.ui-datepicker .ui-datepicker-prev {
  left: 2px
}

.ui-datepicker .ui-datepicker-next {
  right: 2px
}

.ui-datepicker .ui-datepicker-prev-hover {
  left: 1px
}

.ui-datepicker .ui-datepicker-next-hover {
  right: 1px
}

.ui-datepicker .ui-datepicker-next span,
.ui-datepicker .ui-datepicker-prev span {
  display: block;
  position: absolute;
  left: 50%;
  margin-left: -8px;
  top: 50%;
  margin-top: -8px
}

.ui-datepicker .ui-datepicker-title {
  margin: 0 2.3em;
  line-height: 1.8em;
  text-align: center
}

.ui-datepicker .ui-datepicker-title select {
  font-size: 1em;
  height: 29px;
  padding: 0 20px 0 6px;
  background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAHCAYAAADebrddAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDhGOThFQjJGNzQ0MTFFNkE5QTdERTJGRjc5M0MzNUUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDhGOThFQjNGNzQ0MTFFNkE5QTdERTJGRjc5M0MzNUUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0OEY5OEVCMEY3NDQxMUU2QTlBN0RFMkZGNzkzQzM1RSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0OEY5OEVCMUY3NDQxMUU2QTlBN0RFMkZGNzkzQzM1RSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PoOk3FoAAABrSURBVHjaYpy7aoMSAwPDQiCOA+L7DJhAAYgXA3ECE1ShDRDvB2JFLAoPQOUXMkFNfAjE8mgaYArlofKxTFCrHdE0OKIpBPHvM0FNQdewD10hSBETkvtgGh5D+Y+RFaIrRtZwDF0hCAAEGAD+lR8n5JB72AAAAABJRU5ErkJggg==) no-repeat 91% center
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 40%
}

.ui-datepicker table {
  width: 100%;
  font-size: .9em;
  border-collapse: collapse;
  margin: 0 0 .4em
}

.ui-datepicker th {
  padding: .7em .3em;
  text-align: center;
  font-weight: 700;
  border: 0
}

.ui-datepicker td {
  border: 0;
  padding: 1px
}

.ui-datepicker td a,
.ui-datepicker td span {
  display: block;
  padding: .2em;
  text-align: right;
  text-decoration: none
}

.ui-datepicker .ui-datepicker-buttonpane {
  background-image: none;
  margin: .7em 0 0 0;
  padding: 0 .2em;
  border-left: 0;
  border-right: 0;
  border-bottom: 0
}

.ui-datepicker .ui-datepicker-buttonpane button {
  float: right;
  margin: .5em .2em .4em;
  cursor: pointer;
  padding: .2em .6em .3em .6em;
  width: auto;
  overflow: visible
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left
}

.ui-datepicker.ui-datepicker-multi {
  width: auto
}

.ui-datepicker-multi .ui-datepicker-group {
  float: left
}

.ui-datepicker-multi .ui-datepicker-group table {
  width: 95%;
  margin: 0 auto .4em
}

.ui-datepicker-multi-2 .ui-datepicker-group {
  width: 50%
}

.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 33.3%
}

.ui-datepicker-multi-4 .ui-datepicker-group {
  width: 25%
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
  border-left-width: 0
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
  clear: left
}

.ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0
}

.ui-datepicker-rtl {
  direction: rtl
}

.ui-datepicker-rtl .ui-datepicker-prev {
  right: 2px;
  left: auto
}

.ui-datepicker-rtl .ui-datepicker-next {
  left: 2px;
  right: auto
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
  right: 1px;
  left: auto
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
  left: 1px;
  right: auto
}

.ui-datepicker-rtl .ui-datepicker-buttonpane {
  clear: right
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button {
  float: left
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
  float: right
}

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
  border-right-width: 0;
  border-left-width: 1px
}

.ui-datepicker .ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
  left: .5em;
  top: .3em
}

.ui-state-disabled {
  cursor: default !important;
  pointer-events: none;
  opacity: .35;
  background-image: none
}

.ui-datepicker-other-month {
  opacity: .5;
  background-image: none
}

.ui-widget-content {
  background: #fff;
  border: 0 none;
  border-radius: 0;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, .4)
}

.ui-datepicker .ui-datepicker-header {
  padding: 2px 0;
  line-height: 30px;
  height: 30px;
  background: #ccc;
  border: 0 none;
  border-radius: 0
}

.ui-datepicker .ui-datepicker-title {
  margin: 0;
  padding: 0 34px;
  color: #fff;
  line-height: 28px
}

.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
  top: 2px;
  width: 18px;
  height: 28px;
  border-radius: 0
}

.ui-datepicker .ui-datepicker-next-hover,
.ui-datepicker .ui-datepicker-prev-hover {
  background: 0 0;
  border: 0 none
}

.ui-datepicker .ui-datepicker-prev {
  left: 10px
}

.ui-datepicker .ui-datepicker-next {
  right: 10px
}

.ui-datepicker .ui-datepicker-next span,
.ui-datepicker .ui-datepicker-prev span {
  margin: -14px 0 0 -9px;
  cursor: pointer;
  width: 18px;
  height: 28px;
  background-image: url(../images/module/oa_calendar_icon.png);
  background-repeat: no-repeat
}

.ui-datepicker .ui-datepicker-prev span {
  background-position: 0 0
}

.ui-datepicker .ui-datepicker-prev-hover span {
  background-position: 0 -50px
}

.ui-datepicker .ui-datepicker-next span {
  background-position: 0 -100px
}

.ui-datepicker .ui-datepicker-next-hover span {
  background-position: 0 -150px
}

.ui-widget-content .ui-datepicker-calendar .ui-state-default {
  padding: 2px;
  background: 0 0;
  line-height: 20px;
  text-align: center;
  width: 30px;
  height: 20px;
  border: 0 none
}

.ui-widget-content .ui-datepicker-calendar .ui-state-highlight {
  color: #e60012;
  font-weight: 700
}

.ui-widget-content .ui-datepicker-calendar .ui-state-active,
.ui-widget-content .ui-datepicker-calendar .ui-state-hover {
  color: #fff;
  font-weight: 700;
  background: url(../images/module/oa_calendar_icon.png) no-repeat 5px -200px
}

body,
html {
  height: 100%
}

body {
  background: #f4f7f9
}

body .required-tag {
  color: red
}

body .main-wrapper {
  min-width: 1180px;
  min-height: 100%;
  width: 100%
}

body .width-center {
  width: 1180px;
  margin: 0 auto
}

body .image-viewer {
  background: #fff;
  padding: 10px;
  max-width: 900px;
  max-height: 900px
}

body .image-viewer img {
  width: 100%
}

body .image-viewer .close-bg {
  background: #5a5a5a;
  width: 25px;
  height: 25px;
  position: absolute;
  top: 1px;
  border-radius: 100%;
  text-align: center;
  line-height: 24px;
  right: 1px;
  display: block;
  z-index: 10
}

body .icon-radio {
  cursor: pointer;
  display: inline-block;
  width: 16px;
  height: 18px;
  vertical-align: middle;
  background: url(../images/common/icon-radio.png) no-repeat -30px 0
}

body .icon-radio.active {
  background-position: 0 0
}

body .radio-button label {
  margin-right: 20px
}

body .radio-button label .icon-radio {
  margin-left: 30px;
  margin-right: 10px
}

body .radio-button label .icon-radio:first-child {
  margin-left: 0;
  margin-right: 10px
}

body .radio-button label.active .icon-radio {
  background-position: 0 0
}

.index-wrap {
  padding: 120px 0 171px
}

.index-wrap .index-title {
  font-size: 24px;
  color: #000
}

.index-wrap .job-progress {
  margin-top: 50px;
  padding-bottom: 420px;
  -webkit-transition: background .6s ease;
  transition: background .6s ease
}

.index-wrap .job-progress .base-line {
  background: #e2e7eb;
  height: 6px;
  -o-border-radius: 3px;
  border-radius: 3px;
  position: relative;
  margin-top: 10px
}

.index-wrap .job-progress .base-line i {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  -o-border-radius: 3px;
  border-radius: 3px;
  background: #e60012;
  -webkit-transition: all .6s ease;
  transition: all .6s ease
}

.index-wrap .job-progress .progress-phase:after,
.index-wrap .job-progress .progress-phase:before {
  content: " ";
  display: table
}

.index-wrap .job-progress .progress-phase:after {
  clear: both
}

.index-wrap .job-progress .progress-phase:after,
.index-wrap .job-progress .progress-phase:before {
  content: " ";
  display: table
}

.index-wrap .job-progress .progress-phase:after {
  clear: both
}

.index-wrap .job-progress .progress-phase li {
  width: 33.33%;
  float: left
}

.index-wrap .job-progress .progress-phase li .item-phase {
  display: inline-block;
  width: 150px;
  text-align: center;
  margin-left: -75px;
  margin-top: -11px;
  font-weight: 700;
  color: #999
}

.index-wrap .job-progress .progress-phase li .item-phase>p {
  margin-top: 10px
}

.index-wrap .job-progress .progress-phase li .item-phase .dot {
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #d2d2d2;
  position: relative;
  z-index: 99
}

.index-wrap .job-progress .progress-phase li .item-phase.active {
  color: #000
}

.index-wrap .job-progress .progress-phase li .item-phase.active .dot {
  background: #e60012
}

.index-wrap .job-progress .progress-phase li .item-phase.pull-right {
  margin-left: 0;
  margin-right: -75px
}

.index-wrap .job-progress.phase-0 {
  background: url(../images/index/phase-0.png) no-repeat center bottom
}

.index-wrap .job-progress.phase-0 .base-line>i {
  width: -33.33%
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) {
  color: #000
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-0 .progress-phase>li:nth-of-type(0) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.index-wrap .job-progress.phase-1 {
  background: url(../images/index/phase-1.png) no-repeat center bottom
}

.index-wrap .job-progress.phase-1 .base-line>i {
  width: 0
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) {
  color: #000
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-1 .progress-phase>li:nth-of-type(1) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.index-wrap .job-progress.phase-2 {
  background: url(../images/index/phase-2.png) no-repeat center bottom
}

.index-wrap .job-progress.phase-2 .base-line>i {
  width: 33.33%
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) {
  color: #000
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-2 .progress-phase>li:nth-of-type(2) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.index-wrap .job-progress.phase-3 {
  background: url(../images/index/phase-3.png) no-repeat center bottom
}

.index-wrap .job-progress.phase-3 .base-line>i {
  width: 66.66%
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) {
  color: #000
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-3 .progress-phase>li:nth-of-type(3) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.index-wrap .job-progress.phase-4 {
  background: url(../images/index/phase-4.png) no-repeat center bottom
}

.index-wrap .job-progress.phase-4 .base-line>i {
  width: 99.99%
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) {
  color: #000
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-4 .progress-phase>li:nth-of-type(4) .item-phase:not(.pull-right) .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right {
  color: #000
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .dot {
  background: #e60012
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap {
  position: relative;
  height: 16px;
  display: inline-block
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap .wave {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  margin-left: -30px;
  margin-top: -30px
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap .wave .wave-1,
.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap .wave .wave-2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 5px solid #e60012;
  border-radius: 50%
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap .wave .wave-1 {
  -webkit-animation: animation_wave 2s linear infinite;
  animation: animation_wave 2s linear infinite
}

.index-wrap .job-progress.phase-4 .item-phase.pull-right .wave-wrap .wave .wave-2 {
  -webkit-animation: animation_wave 3s linear infinite;
  animation: animation_wave 3s linear infinite
}

.offer-wrap {
  padding: 110px 0 171px
}

.offer-wrap .index-title {
  font-size: 20px;
  font-weight: 700
}

.offer-wrap .line-title {
  padding: 20px 0;
  position: relative;
  text-align: center
}

.offer-wrap .line-title>.line {
  position: absolute;
  top: 50%;
  width: 100%;
  border-top: 1px solid #e2e7eb
}

.offer-wrap .line-title>.title {
  position: relative;
  background: #fff;
  padding: 6px 15px;
  font-size: 16px;
  display: inline-block
}

.offer-wrap .form-fill-wrap {
  padding: 20px 40px;
  background: #fff;
  box-shadow: 0 0 20px #ddd
}

.offer-wrap .form-fill-wrap .form-set>li {
  margin-bottom: 30px
}

.offer-wrap .form-items {
  width: 500px;
  position: relative;
  left: -60px
}

.offer-wrap .offer-type-box {
  background: #fff;
  width: 1020px;
  text-align: center
}

.offer-wrap .offer-type-box h3 {
  font-size: 20px;
  font-weight: 700;
  padding-top: 30px
}

.offer-wrap .offer-type-box .type-btn-wpr {
  margin-top: 50px
}

.offer-wrap .offer-type-box .offer-type-btn {
  width: 290px;
  height: 160px;
  display: inline-block;
  position: relative;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  cursor: pointer
}

.offer-wrap .offer-type-box .offer-type-btn:hover {
  border-color: #d92828
}

.offer-wrap .offer-type-box .offer-type-btn.society {
  background: url(../images/common/she-icon.png) no-repeat center 40%;
  margin-left: 40px
}

.offer-wrap .offer-type-box .offer-type-btn.school {
  background: url(../images/common/xiao-icon.png) no-repeat center 40%
}

.offer-wrap .offer-type-box .offer-type-btn.yunyin {
  margin-left: 40px;
  background: url(../images/common/yun-icon.png) no-repeat center 40%
}

.offer-wrap .offer-type-box .offer-type-btn .type-name {
  position: absolute;
  width: 100%;
  color: #333;
  font-weight: 700;
  bottom: 10px
}

.offer-wrap .offer-type-box .offer-type-btn.active {
  border-color: #d92828
}

.offer-wrap .offer-type-box .offer-type-btn.active .check-icon {
  display: block
}

.offer-wrap .offer-type-box .offer-type-btn .check-icon {
  width: 34px;
  height: 34px;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  display: none;
  background: url(../images/common/check-icon.png)
}

.guide-wrap {
  padding: 100px 0 171px
}

.guide-wrap .guide-content {
  background: #fff;
  padding: 50px 100px
}

.guide-wrap .guide-content .paragraph {
  margin-top: 30px
}

.guide-wrap .guide-content .paragraph .text-link {
  color: #0190ff;
  text-decoration: underline;
  padding-right: 25px;
  background: url(../images/common/icon-guide-title.png?20170912) no-repeat right -244px
}

.guide-wrap .guide-content .paragraph-title {
  font-size: 16px;
  font-weight: 700;
  padding-left: 30px;
  margin-bottom: 15px;
  background: url(../images/common/icon-guide-title.png?20170912) no-repeat
}

.guide-wrap .guide-content .paragraph-title.list {
  background-position: 0 -40px
}

.guide-wrap .guide-content .paragraph-title.check {
  background-position: 0 -81px
}

.guide-wrap .guide-content .paragraph-title.contact {
  background-position: 0 -121px
}

.guide-wrap .guide-content .paragraph-title.hudd {
  background-position: 0 -163px
}

.guide-wrap .guide-content .paragraph-title.lend {
  background-position: 0 -203px
}

.ios-guide-wrap {
  background: #ececec
}

.ios-guide-wrap .guide-content .paragraph {
  padding: 15px;
  margin-bottom: 10px;
  background: #fff
}

.ios-guide-wrap .guide-content .paragraph .text-link {
  color: #51a0e3;
  text-decoration: underline
}

.ios-guide-wrap .guide-content .paragraph-title {
  font-size: 15px;
  font-weight: 700;
  padding-left: 24px;
  padding-bottom: 8px;
  border-bottom: 1px solid #ececec;
  margin-bottom: 10px;
  background: url(../images/common/icon-guide-title-ios.png?20170912) no-repeat;
  background-size: 15px auto
}

.ios-guide-wrap .guide-content .paragraph-title.location {
  background-position: 0 4px
}

.ios-guide-wrap .guide-content .paragraph-title.list {
  background-position: 0 -26px
}

.ios-guide-wrap .guide-content .paragraph-title.check {
  background-position: 0 -55px
}

.ios-guide-wrap .guide-content .paragraph-title.contact {
  background-position: 0 -84px
}

.ios-guide-wrap .guide-content .paragraph-title.hudd {
  background-position: 0 -112px
}

.ios-guide-wrap .guide-content .paragraph-title.lend {
  background-position: 0 -142px
}

.ios-guide-wrap .guide-content .paragraph-title.pay {
  font-size: 16px;
  font-weight: 700;
  padding-left: 30px;
  margin-bottom: 15px;
  background: url(../images/common/pay-dot.png?20170912) no-repeat;
  background-size: 16px auto;
  background-position: 0 4px;
}

.ios-guide-wrap .guide-content .location-button-group {
  padding: 15px 0
}

.ios-guide-wrap .guide-content .location-button-group>li {
  float: left;
  text-align: center;
  padding: 6px 0;
  width: 25%;
  border: 1px solid #e60012;
  box-sizing: border-box
}

.ios-guide-wrap .guide-content .location-button-group>li:first-child {
  border-radius: 5px 0 0 5px
}

.ios-guide-wrap .guide-content .location-button-group>li:last-child {
  border-radius: 0 5px 5px 0;
  margin-left: -1px;
}

.ios-guide-wrap .guide-content .location-button-group>li:nth-of-type(2) {
  margin: 0 -1px
}

.ios-guide-wrap .guide-content .location-button-group>li.active {
  background: #e60012;
  color: #fff
}

.ios-guide-wrap .guide-content .item-title {
  border-left: 3px solid #e60012;
  margin: 15px 0 10px;
  padding-left: 6px;
  color: #222;
  font-size: 15px;
  font-weight: 700
}

.information-wrap {
  padding: 100px 0 171px
}

.information-wrap .icon-op {
  cursor: pointer;
  display: inline-block;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url(../images/common/icon-op.png) no-repeat
}

.information-wrap .icon-op.add {
  background-position: 0 0
}

.information-wrap .icon-op.trash {
  background-position: 0 -34px
}

.information-wrap .icon-op.edit {
  height: 20px;
  background-position: 0 -66px
}

.information-wrap .require-tag {
  color: #e60012;
  margin-right: 4px;
  vertical-align: middle
}

.information-wrap .reject-box {
  width: 1140px;
  margin: 0 auto;
  border: 1px solid #e2e7eb;
  padding: 20px;
  margin-bottom: 20px;
  background: #fff;
  line-height: 25px
}

.information-wrap .reject-box i {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: url(../images/info/stamp.png) no-repeat;
  vertical-align: middle
}

.information-wrap .reject-box div {
  margin-left: 20px;
  display: inline-block;
  vertical-align: middle
}

.information-wrap .reject-box div .txt-label {
  color: #c3c3c3
}

.information-wrap .reject-box div .txt-tip {
  color: #d92828
}

.information-wrap .info-progress {
  border: 1px solid #e2e7eb;
  padding: 10px 20px 10px 10px;
  margin-bottom: 20px;
  background: #fff
}

.information-wrap .info-progress:after,
.information-wrap .info-progress:before {
  content: " ";
  display: table
}

.information-wrap .info-progress:after {
  clear: both
}

.information-wrap .info-progress:after,
.information-wrap .info-progress:before {
  content: " ";
  display: table
}

.information-wrap .info-progress:after {
  clear: both
}

.information-wrap .info-progress .progress-show {
  float: left;
  width: 170px
}

.information-wrap .info-progress .progress-show .indicator {
  background: #e2e7eb;
  height: 6px;
  -o-border-radius: 3px;
  border-radius: 3px;
  position: relative;
  margin-top: 10px
}

.information-wrap .info-progress .progress-show .indicator i {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  -o-border-radius: 3px;
  border-radius: 3px;
  background: #e60012
}

.information-wrap .info-progress .progress-text {
  float: left;
  margin-left: 20px
}

.information-wrap .nav-info-item {
  float: left;
  width: 160px;
  margin-top: 1px;
  background: #fff;
  border: 1px solid #e2e7eb
}

.information-wrap .nav-info-item li .item-target {
  padding: 18px 10px 18px 50px;
  position: relative
}

.information-wrap .nav-info-item li .icon-title {
  content: '';
  position: absolute;
  left: 15px;
  width: 22px;
  height: 22px;
  background: url(../images/common/icon-title.png) no-repeat
}

.information-wrap .nav-info-item li .icon-title.education {
  background-position: 0 -60px
}

.information-wrap .nav-info-item li .icon-title.work {
  background-position: 0 -119px
}

.information-wrap .nav-info-item li .icon-title.family {
  background-position: 0 -182px
}

.information-wrap .nav-info-item li .icon-title.others {
  background-position: 0 -244px
}

.information-wrap .nav-info-item li .icon-title.certificate {
  background-position: 0 -303px
}

.information-wrap .nav-info-item li .icon-title.report {
  background-position: 0 -350px
}

.information-wrap .nav-info-item li .icon-title.health {
  background-position: 0 -403px
}

.information-wrap .nav-info-item li .icon-title.prepare {
  background-position: 0 -501px
}

.information-wrap .nav-info-item li .icon-title.contract {
  background-position: 0 -451px
}

.information-wrap .nav-info-item li .icon-status {
  display: inline-block;
  margin-left: 10px;
  width: 16px;
  height: 16px;
  background: url(../images/common/icon-status.png) no-repeat;
  vertical-align: middle
}

.information-wrap .nav-info-item li .icon-status.yes {
  background-position: 0 -60px
}

.information-wrap .nav-info-item li.active {
  background: #fff;
  color: #e60012
}

.information-wrap .nav-info-item li.active .item-target {
  color: #e60012
}

.information-wrap .nav-info-item li.active .icon-title {
  background-position-x: -30px
}

.information-wrap .form-fill-wrap:after,
.information-wrap .form-fill-wrap:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap:after {
  clear: both
}

.information-wrap .form-fill-wrap:after,
.information-wrap .form-fill-wrap:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap:after {
  clear: both
}

.information-wrap .form-fill-wrap .form-fill-item {
  background: #fff;
  padding-bottom: 20px;
  border-left: 1px solid #e2e7eb;
  margin-left: 180px;
  min-height: 400px
}

.information-wrap .form-fill-wrap .form-fill-item .table.table-center {
  table-layout: fixed
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail>li {
  padding: 15px 20px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail h2 {
  margin: 1px 0 18px;
  border-left: 4px solid #e60012;
  padding-left: 8px;
  font-size: 16px;
  font-weight: 700
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .hover-tooltip {
  position: relative;
  cursor: pointer
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .hover-tooltip .area-tooltip {
  background: #fff;
  position: absolute;
  z-index: 10;
  top: 0;
  right: 80px;
  padding: 15px 20px;
  box-shadow: 0 0 5px 5px #ddd;
  border-radius: 5px;
  display: none
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .hover-tooltip .area-tooltip>h4 {
  font-size: 16px;
  color: #333;
  margin-bottom: 15px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .hover-tooltip:hover .area-tooltip {
  display: block
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .text-success {
  color: #10c482;
  text-decoration: underline
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set-item {
  display: inline-block;
  width: 100%;
  padding-top: 10px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap {
  position: relative;
  border-radius: 5px;
  overflow: hidden
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img {
  cursor: pointer
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap .uploader {
  cursor: pointer;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: url(../images/common/add-attach.png) no-repeat center center
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap .uploader.bigger {
  background: url(../images/common/add-attach.png) no-repeat center center
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img.has-holder+.uploader,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img[src^="/entry"]+.uploader,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img[src^="data:"]+.uploader {
  background: url(../images/common/re-attach.png) no-repeat center center
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img.has-holder+.uploader.bigger,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img[src^="/entry"]+.uploader.bigger,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .upload-wrap img[src^="data:"]+.uploader.bigger {
  background: url(../images/common/re-attach.png) no-repeat center center
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:after,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:after {
  clear: both
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:after,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set:after {
  clear: both
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col li {
  min-height: 40px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field {
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-text {
  width: 111px;
  box-sizing: border-box
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-text.w140 {
  width: 160px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content {
  width: 100%
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content>input {
  width: 100%;
  box-sizing: border-box
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:after,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:after {
  clear: both
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:after,
.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:before {
  content: " ";
  display: table
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set:after {
  clear: both
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set>figure {
  color: #666;
  display: inline-block
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set>figure:not(:first-child) {
  margin-left: 50px
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.one-col .form-field .field-content .figure-set>figure>figcaption {
  text-align: center
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.three-col>li {
  float: left;
  width: 32.38%;
  min-height: 40px;
  padding-right: 20px;
  box-sizing: border-box
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.three-col>li:nth-of-type(3n+3) {
  width: 35.23%;
  padding-right: 0
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.three-col.average li {
  width: 33.33%;
  box-sizing: border-box
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.three-col.average li:nth-of-type(3n+3) {
  width: 33.33%
}

.information-wrap .form-fill-wrap .form-fill-item .info-detail .form-set.radio-area>li {
  padding: 15px 0;
  display: inline-block;
  width: 100%
}
.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask{
  background-color: rgba(0, 0, 0,.2);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog {
  position: absolute;
  top:180px;
  left: 50%;
  transform: translateX(-50%);
  width: 700px;
  background: #fff;
  opacity: 1;
  border-radius: 8px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  transition: all 2s;
  animation: slidedown .5s;
}
@keyframes slidedown{
  from{
    top: 140px
  };
  to{
    top:180px
  }
}
.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_header{
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
  border-radius: 8px 8px 0 0;
  height: 52px;
  line-height: 52px;
  padding: 0 24px;
  box-sizing: border-box;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_header .edit-nickname-dialog_title{
  color: #000;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_header .edit-nickname-dialog_close{
  width: 26px;
  height: 26px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo5YTgxNTNiOC01MmZkLTdiNGEtYTUzMS1iOGZhYTgyNjUwNmMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6M0EwN0YyNDhERDhBMTFFODlDNkRGQTUzOTJGMTI3MkUiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6M0EwN0YyNDdERDhBMTFFODlDNkRGQTUzOTJGMTI3MkUiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZiNWQ4MWEtNjljNS1mNDQ0LWE3ZDgtNTZmNGUzNzA0NDRkIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZDc2YWE1ZTQtZGJlZC0xMWU4LWFjYjItZGMxMWRlZDM3ZDg1Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+3Ma1ewAAAORJREFUeNrs1rsKwjAUBuA2VdeCb6JUnVwrKg6+qkPByyK4KJl8ErUPEP9ACiXkdoIUhwZ+OrTNd5KcQlMhRNLFYElHo4f+HxrYbhRF8cTlheyQt2eeMVIhGed8Rl3RB1kiRyT3IGdk4SrIBW2Rh5rAhjXIFLkh+xhIVlc6MB3ZIHVsM9gwEuJsBgN2amFDChIKmbCEglC/o0wrbER5P/RBeSaX1nbJM5urFea/ghpk0tqukoqxCKTWujEIYxGIqfW9mAuqHIiO3RV2iIGYWtHa08ISWyFX1ZnGkfb/DD3UOfQVYABElUgHhtWjxgAAAABJRU5ErkJggg==) no-repeat;
  top: 13px;
  right: 13px;
  position: absolute;
  text-indent: -999px;
  overflow: hidden;
  opacity: 0.6;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body{
  width:100%;
  box-sizing: border-box;
  padding: 24px 24px 33px 24px;
  border-bottom: 1px solid #e5e5e5;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_title{
  border-left:3px solid #e60012;
  font-size: 16px;
  font-weight: bold;
  padding-left: 5px;
}
.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_item{
  display: flex;
  align-items: center;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content{
  display: flex;
  align-items: center;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_label{
  width: 80px;
  flex-shrink: 0;
  color:#999999;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body  .checkNickName-tips{
  border: 1px solid #FFE1B0;
  color: #FF5C59;
  background: #FFF9EA;
  box-sizing: border-box;
  padding: 8px 12px;
  margin-bottom: 16px;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .common-message{
  border: 1px solid #CAFFEC ;
  background: #F2FFFA;
  border-radius: 4px;
  height: 36px;
  line-height: 36px;
  box-sizing: border-box;
  padding:0 8px;
  color: #0CC482 ;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .error-message{
  border:1px solid #FFE1B0;
  background: #FFF9EA ;
  border-radius: 4px;
  height: 36px;
  line-height: 36px;
  box-sizing: border-box;
  padding:0 8px;
  color:#FF5C59
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .success-message{
  border: 1px solid #CAFFEC;
  background:  #F2FFFA;
  border-radius: 4px;
  height: 36px;
  line-height: 36px;
  box-sizing: border-box;
  padding:0 8px;
  color: #0CC482;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .common-message .checkNickName-icon{
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: url(../images/icos/info-roading.png) no-repeat center;
  background-size: 100% 100%;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .error-message .checkNickName-icon{
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: url(../images/icos/info-warning.png) no-repeat center;
  background-size: 100% 100%;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .success-message .checkNickName-icon{
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: url(../images/icos/circle-check.png) no-repeat center;
  background-size: 100% 100%;
  vertical-align: middle;
  display: inline-block;
  margin-right: 6px;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content .checkNickName-messagebox{
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .edit-nickname-dialog_body_form_content textarea{
  width: 414px;
  resize: none;
  height: 54px;
  border: 1px solid #e2e7eb;
  border-radius: 4px;
  padding: 5px;
  display: block;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.canedit .edit-nickname-dialog .edit-nickname-dialog_body .f-edit{
  display: flex;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.canedit .edit-nickname-dialog .edit-nickname-dialog_body .f-view{
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.cantedit .edit-nickname-dialog .edit-nickname-dialog_body .f-edit{
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.cantedit .edit-nickname-dialog .edit-nickname-dialog_body .f-view{
  display: flex;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.canedit  .edit-nickname-dialog .edit-nickname-dialog_body  .nickNameExplain-label{
  margin-top:-45px
}
.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_body .nickNameExplain{
  white-space: pre-wrap;
  word-break: break-all;
  max-height: 200px;
  overflow-y: auto;
  width:575px;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.canedit .edit-nickname-dialog  .edit-nickname-dialog_footer.f-edit{
  display: block;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.canedit .edit-nickname-dialog  .edit-nickname-dialog_footer.f-view{
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.cantedit .edit-nickname-dialog  .edit-nickname-dialog_footer.f-edit{
  display: none;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask.cantedit .edit-nickname-dialog  .edit-nickname-dialog_footer.f-view{
  display: block;
}

.information-wrap .form-fill-wrap .form-fill-item .edit-nickname-mask .edit-nickname-dialog .edit-nickname-dialog_footer{
  margin: 0 auto;
  box-sizing: border-box;
  padding: 16px 24px;
  text-align: right;
  min-width: 300px;
  overflow: hidden;
  border-radius: 0 0 8px 8px;
}
.information-wrap .form-fill-wrap .form-switch .button-edit,
.information-wrap .form-fill-wrap .form-switch .f-view {
  display: none
}

.information-wrap .form-fill-wrap .form-switch.form-view .button-edit {
  display: inherit;
  font-size: 14px
}

.information-wrap .form-fill-wrap .form-switch.form-view .form-field {
  cursor: default
}

.information-wrap .form-fill-wrap .form-switch.form-view .form-field:after {
  display: none
}

.information-wrap .form-fill-wrap .form-switch.form-view .f-view {
  display: inherit
}

.information-wrap .form-fill-wrap .form-switch.form-view .f-view.break-all-word {
  word-break: break-all
}

.information-wrap .form-fill-wrap .form-switch.form-view .f-view.initial {
  display: initial
}

.information-wrap .form-fill-wrap .form-switch.form-view .table-center span.f-view {
  display: block;
  text-align: center;
  padding: 6px
}

.information-wrap .form-fill-wrap .form-switch.form-view .bottom-button-group,
.information-wrap .form-fill-wrap .form-switch.form-view .f-edit,
.information-wrap .form-fill-wrap .form-switch.form-view .uploader,
.information-wrap .form-fill-wrap .form-switch.form-view .uploader+.moxie-shim {
  display: none
}

.information-wrap.photo-wrap .card-upload>figure {
  display: inline-block
}

.information-wrap.photo-wrap .card-upload>figure:last-child {
  margin-left: 140px
}

.information-wrap.disabled-edit-info .button-edit,
.information-wrap.disabled-edit-info button[type=submit].btn-success {
  display: none !important
}

.information-wrap .common-outer {
  height: 56px
}

.information-wrap .info-progress-wpr {
  position: absolute;
  left: 0;
  width: 100%;
  top: 70px;
  background: #2a2d2e
}

.information-wrap .info-progress-wpr .info-progress {
  width: 1150px;
  margin: 0 auto;
  background: 0 0;
  color: #fff;
  border: none
}

.information-wrap .btn[disabled] {
  background: #999;
  border-color: #7a7a7a;
  opacity: 1
}

.login-body {
  background: url(../images/login/login-bg.jpg) no-repeat center
}

.login-body .main-wrapper {
  height: 100%
}

.login-wrap {
  position: relative;
  height: 100%
}

.login-wrap>article {
  position: absolute;
  width: 820px;
  min-height: 460px;
  top: 50%;
  left: 50%;
  margin-top: -280px;
  margin-left: -410px;
  background: #fff;
  box-shadow: 0 0 12px rgba(0, 0, 0, .2)
}

.login-wrap>article .image-show {
  float: left;
  margin-top: 50px;
  margin-left: 40px;
  margin-right: 27px
}

.login-wrap .form-wrap {
  float: left;
  width: 390px;
  min-height: 420px;
  margin-top: 20px;
  border-left: 1px solid #efefef
}

.login-wrap .form-wrap .form-detail {
  margin: 0 auto;
  width: 300px
}

.login-wrap .form-wrap .form-detail h1 {
  font-size: 20px;
  color: #333
}

.login-wrap .form-wrap .form-detail .icon-field {
  background: url(../images/login/icon-field.png) no-repeat 12px 0
}

.login-wrap .form-wrap .form-detail .icon-field.card {
  background-position: 12px 12px
}

.login-wrap .form-wrap .form-detail .icon-field.phone {
  background-position: 12px -28px
}

.login-wrap .form-wrap .form-detail .icon-field.code {
  background-position: 12px -70px
}

.login-wrap .form-wrap .form-detail .icon-field.email {
  background-position: 12px -110px
}

.login-wrap .form-wrap .form-group {
  margin-bottom: 30px
}

.login-wrap .form-wrap .form-group input {
  padding-left: 44px;
  box-sizing: border-box
}

.login-wrap .form-wrap .form-group input:focus {
  border-color: #e60012
}

.login-wrap .form-wrap .form-group .field-block {
  width: 100%
}

.login-wrap .form-wrap .form-group .submit-btn {
  padding: 10px
}

.login-wrap .form-switch-target {
  display: none
}

.login-wrap .form-switch-trigger {
  position: relative;
  top: -10px;
  text-align: center;
  color: #d92828;
  cursor: pointer
}

.login-wrap .form-switch-engine .form-switch-origin {
  display: none
}

.login-wrap .form-switch-engine .form-switch-target {
  display: block
}

.ux-input-text em textarea {
  width: 100%
}

.prepare-wrap .fr {
  float: right
}

.prepare-wrap .bg-gray {
  background: #999
}

.prepare-wrap .bg-blue {
  background: #87cefa
}

.prepare-wrap .bg-green {
  background: #10c482
}

.prepare-wrap .bg-red {
  background: red
}

.prepare-wrap .strong {
  font-weight: 700;
  color: #000
}

.prepare-wrap .red {
  color: #e60012
}

.prepare-wrap .prepare-content {
  display: inline-block;
  width: 990px
}

.prepare-wrap .prepare-content a.btn {
  color: #fff
}

.prepare-wrap .prepare-detail>li {
  padding: 15px 20px;
  clear: both
}

.prepare-wrap .prepare-detail h2 {
  margin: 1px 0 18px;
  border-left: 4px solid #e60012;
  padding-left: 8px;
  font-size: 16px;
  font-weight: 700
}

.prepare-wrap .prepare-detail .person-photo {
  float: left;
  padding-top: 20px;
  margin-right: 20px
}

.prepare-wrap .prepare-detail .person-photo img {
  width: 80px
}

.prepare-wrap .prepare-detail .person-info {
  float: left;
  color: #b6b6b6;
  padding-top: 40px;
  line-height: 40px
}

.prepare-wrap .prepare-detail .entry-status {
  float: left;
  margin-left: 30px
}

.prepare-wrap .prepare-detail .entry-status ul li {
  float: left;
  margin-left: 30px;
  padding: 15px 20px;
  line-height: 25px;
  text-align: center;
  border: 1px solid #e5e5e5;
  border-radius: 5px
}

.prepare-wrap .prepare-detail .entry-status ul li .icon-entry {
  display: inline-block;
  width: 66px;
  height: 46px;
  background: url(../images/prepare/pre-entry.png) no-repeat 0 0
}

.prepare-wrap .prepare-detail .entry-status ul li .icon-entry.icon-IC {
  background-position: 0 0
}

.prepare-wrap .prepare-detail .entry-status ul li .icon-entry.icon-meal {
  width: 68px;
  background-position: 0 -256px
}

.prepare-wrap .prepare-detail .entry-status ul li .icon-entry.icon-IT {
  width: 73px;
  background-position: 0 -468px
}

.prepare-wrap .prepare-detail .entry-status ul li .status-txt {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  color: #fff
}

.prepare-wrap .prepare-detail .tip-txt {
  border-top: 1px solid #e5e5e5;
  margin: 20px 0 30px 0;
  padding-top: 20px
}

.prepare-wrap .prepare-detail .IT-detail {
  position: relative;
  min-height: 400px
}

.prepare-wrap .prepare-detail .IT-detail .icon-self-service {
  position: absolute;
  bottom: 0;
  right: 0;
  display: inline-block;
  width: 220px;
  height: 195px;
  background: url(../images/prepare/pre-entry.png) no-repeat 0 -690px
}

.prepare-wrap .prepare-detail .asset-detail {
  position: relative
}

.prepare-wrap .prepare-detail .asset-detail .tip-txt {
  color: #de5454
}

.prepare-wrap .prepare-detail .asset-detail .ac_reback {
  color: #fff
}

.prepare-wrap .prepare-detail .asset-detail table {
  width: 100%
}

.prepare-wrap .prepare-detail .asset-detail table div {
  margin: 5px 10px;
  padding: 10px 15px
}

.prepare-wrap .prepare-detail .asset-detail table td,
.prepare-wrap .prepare-detail .asset-detail table th {
  text-align: center
}

.prepare-wrap .prepare-detail .asset-detail table th div {
  background: #d7acac;
  color: #fff
}

#YSF-BTN-HOLDER{
  display: none;
}
.YSF-BTN-HOLDER{
  position: fixed;
  bottom: 140px;
  right: 24px;
  width:48px;
  height: 48px;
  z-index: 9990;
}
.YSF-BTN-HOLDER .inner{
  position: relative;
  height: 48px;
  display: flex;
  align-items: center;
}
.YSF-BTN-HOLDER:hover{
  cursor: pointer;
}
.YSF-BTN-HOLDER .inner .flex{
  height: 36px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
  border-radius: 24px;
  padding-right: 60px;
  background: #FFFFFF;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 18px;
  transition: width 1s;
  white-space: nowrap;
  overflow: hidden;
}

.YSF-BTN-HOLDER .inner .hrlogo{
  height: 16px;
  width: 16px;
  margin-right: 4px;
  margin-left: 12px;
  vertical-align: sub;
}
.YSF-BTN-HOLDER .inner .circle{
  width: 48px;
  height: 48px;
  background: #FFFFFF;
  box-shadow: 0px 10px 32px rgba(0, 0, 0, 0.1);
  position: absolute;
  right:0;
  top:0;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 50%;
  z-index:2
}
.YSF-BTN-HOLDER .inner .circle .cs{
  height: 32px;
  width: 32px;
}

.YSF-BTN-HOLDER .inner .circle .red{
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCAxMkMxMCA4LjY4NjI5IDEyLjY4NjMgNiAxNiA2QzE5LjMxMzcgNiAyMiA4LjY4NjI5IDIyIDEyVjEyLjVWMjAuMzMzM0MyMiAyMy42NDcgMTkuMzEzNyAyNi4zMzMzIDE2IDI2LjMzMzNDMTUuNDQ3NyAyNi4zMzMzIDE1IDI2Ljc4MTEgMTUgMjcuMzMzM0MxNSAyNy44ODU2IDE1LjQ0NzcgMjguMzMzMyAxNiAyOC4zMzMzQzIwLjA1MTcgMjguMzMzMyAyMy40IDI1LjMyMTIgMjMuOTI3NiAyMS40MTQxQzI2LjI0NTggMjAuOTc5MiAyOCAxOC45NDQ1IDI4IDE2LjVDMjggMTQuMDc3NSAyNi4yNzczIDEyLjA1NzQgMjMuOTkwMSAxMS41OThDMjMuNzgwNyA3LjM2NjUgMjAuMjgzNSA0IDE2IDRDMTEuNzE2NSA0IDguMjE5MzMgNy4zNjY1IDguMDA5OTIgMTEuNTk4QzUuNzIyNzQgMTIuMDU3NCA0IDE0LjA3NzUgNCAxNi41QzQgMTkuMjYxNCA2LjIzODU4IDIxLjUgOSAyMS41QzkuNTUyMjggMjEuNSAxMCAyMS4wNTIzIDEwIDIwLjVWMjAuMzEyNVYxMi41VjEyWk04IDE5LjMyOTNWMTMuNjcwN0M2LjgzNDgxIDE0LjA4MjUgNiAxNS4xOTM4IDYgMTYuNUM2IDE3LjgwNjIgNi44MzQ4MSAxOC45MTc1IDggMTkuMzI5M1pNMjQgMTMuNjcwN1YxOS4zMjkzQzI1LjE2NTIgMTguOTE3NSAyNiAxNy44MDYyIDI2IDE2LjVDMjYgMTUuMTkzOCAyNS4xNjUyIDE0LjA4MjUgMjQgMTMuNjcwN1oiIGZpbGw9IiNlNjAxMTUiLz4KPC9zdmc+Cg==');
  display: none
}

.YSF-BTN-HOLDER .inner .circle .grey{
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCAxMkMxMCA4LjY4NjI5IDEyLjY4NjMgNiAxNiA2QzE5LjMxMzcgNiAyMiA4LjY4NjI5IDIyIDEyVjEyLjVWMjAuMzMzM0MyMiAyMy42NDcgMTkuMzEzNyAyNi4zMzMzIDE2IDI2LjMzMzNDMTUuNDQ3NyAyNi4zMzMzIDE1IDI2Ljc4MTEgMTUgMjcuMzMzM0MxNSAyNy44ODU2IDE1LjQ0NzcgMjguMzMzMyAxNiAyOC4zMzMzQzIwLjA1MTcgMjguMzMzMyAyMy40IDI1LjMyMTIgMjMuOTI3NiAyMS40MTQxQzI2LjI0NTggMjAuOTc5MiAyOCAxOC45NDQ1IDI4IDE2LjVDMjggMTQuMDc3NSAyNi4yNzczIDEyLjA1NzQgMjMuOTkwMSAxMS41OThDMjMuNzgwNyA3LjM2NjUgMjAuMjgzNSA0IDE2IDRDMTEuNzE2NSA0IDguMjE5MzMgNy4zNjY1IDguMDA5OTIgMTEuNTk4QzUuNzIyNzQgMTIuMDU3NCA0IDE0LjA3NzUgNCAxNi41QzQgMTkuMjYxNCA2LjIzODU4IDIxLjUgOSAyMS41QzkuNTUyMjggMjEuNSAxMCAyMS4wNTIzIDEwIDIwLjVWMjAuMzEyNVYxMi41VjEyWk04IDE5LjMyOTNWMTMuNjcwN0M2LjgzNDgxIDE0LjA4MjUgNiAxNS4xOTM4IDYgMTYuNUM2IDE3LjgwNjIgNi44MzQ4MSAxOC45MTc1IDggMTkuMzI5M1pNMjQgMTMuNjcwN1YxOS4zMjkzQzI1LjE2NTIgMTguOTE3NSAyNiAxNy44MDYyIDI2IDE2LjVDMjYgMTUuMTkzOCAyNS4xNjUyIDE0LjA4MjUgMjQgMTMuNjcwN1oiIGZpbGw9IiM2NjY2NjYiLz4KPC9zdmc+Cg==');
}

.YSF-BTN-HOLDER:hover{
  width: auto
}
.YSF-BTN-HOLDER:hover .inner .circle .grey{
  display: none
}
.YSF-BTN-HOLDER:hover .inner .circle .red{
  display: block
}

@media screen and (max-width: 1790px) {
  .YSF-BTN-HOLDER .inner .flex{
    width: 0;
    padding: 0;
  }
  .YSF-BTN-HOLDER:hover .inner .flex{
    width: 284px;
    padding-right: 60px;
  }
}
@media screen and (min-width: 1740px){
  .YSF-BTN-HOLDER .inner{
    position: absolute;
    right: 0;
    top: 0;
  }
  .YSF-BTN-HOLDER .inner .flex{
    width: 284px;
    padding-right: 60px;
  }
}

.tooltip-ques {
  /* display: inline-block;
  border-radius: 50%;
  color: white;
  background: #dddddd;
  min-width: 12px;
  line-height:12px;
  font-size: 12px;
  padding: 2px;
  text-align: center;
  cursor: pointer; */
  color: #dddddd;
  font-size: 18px;
}

.h-40px {
  height: 40px;
}
.h-40px .rock-select .rock-select-selector {
  min-height: 40px;
}

.flex-items-center {
  align-items: center!important;
}

.label-special {
  display: flex;
  width: 115px!important;
  margin-left: -5px;
  /* position: relative;
  right: 10px; */
}

/* .label-special br-tooltip {
  margin-left: 5px;
} */

.border-silent .rock-select-selector {
  border-color: #e2e7eb!important;
  box-shadow: none!important;
  border-radius: 4px!important;
}

.form-set.multi {
  margin-top: -10px;
  margin-right: -20px;
}
.form-set.multi li {
  margin-top: 10px;
  padding-right: 20px!important;
}

.fix-width-266 {
  width: 266px!important;
  box-sizing: border-box!important;
}

.relative {
  position: relative;
}

.hidden-to-tips {
  position: absolute;
  z-index:-2;
  top: 2px;
  left: 0;
  opacity: 0;
}

.offer-confirm-item-tips {
  margin-top: -20px;
  font-size: 14px;
  color: var(--n60);
  line-height: 1.2;
}

.offer-confirm-item-tips .tips-detail {
  cursor: auto;
  width: 100%
}

.rock-select-selection-placeholder,
input.rock-input::placeholder,
::part(input)::placeholder,
.rock-picker-input input::placeholder {
  color: #757575!important;
}

.align-old .rock-select-lg .rock-select-selector {
  padding: 0px!important;
  padding-left: 8px!important;
}

.align-old .rock-select-lg .rock-select-arrow {
  right: 4px !important;
}

.flex-auto {
  flex: 0 0 auto;
}

.field-text.w120 {
  width: 120px
}

.warp-for-upload {
  width: 500px;
}

.form-view .warp-for-upload .rock-icon.rock-icon-delete {
  display: none;
}

.political-status label.form-field {
  align-items: flex-start;
}

.border-box {
  box-sizing: border-box;
}

.form-fill-item.photo .upload-wrap, .form-fill-item.photo .photo-demo{
  border-radius: 8px!important;
}

.form-fill-item.photo .upload-wrap.circle, .form-fill-item.photo .photo-demo.circle {
  border-radius: 50% !important;
}

.form-fill-item.photo h2 {
  margin-bottom: 0!important;
}

.form-fill-item.photo .photo-demo {
  box-sizing: border-box;
  border: 1px solid #E5E5E5;
  width: 120px;
  height: 166px;
  position: relative;
}

.form-fill-item.photo .photo-right {
  margin-left: 50px;
}

.form-fill-item.photo .photo-images {
  background: url(../images/info/wordcard-upload.png) no-repeat border-box top center / 110% auto;
  background-position-y: -3px;
}
.form-fill-item.photo .photo-demo.square {
  height: 120px;
  overflow: hidden;
}

.form-fill-item.photo .photo-demo.square .images {
  height: 100%;
  width: 90px;
  margin: 0 auto;
  position: relative;
  background-position-y: -6px;
}

.ac_radio.disabled {
  opacity: 0.5;
  pointer-events: none;
}