@charset "utf-8";
/**
* Description: Base style
* Developers: tianning <zuixinweilan@sina.com.cn>
**/

/*HTML5*/
article,
aside,
dialog,
footer,
header,
section,
footer,
nav,
figure,
menu {
  margin: 0;
  padding: 0;
  display: block
}

/*RESET
-------------------------------------------------------------- */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
pre,
code,
form,
button,
fieldset,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0
}

img {
  outline: none;
  border: none;
  vertical-align: top;
  max-width: 100%
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

fieldset {
  border: 0;
  vertical-align: middle;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal
}

ol,
ul,
li {
  list-style: none
}

del,
ins {
  text-decoration: none
}

caption,
th {
  text-align: left
}

input,
button,
textarea,
select {
  font-size: 100%;
  outline: none;
  padding: 0;
  resize: none;
}

::-webkit-input-placeholder {
  color: #999;
}

::-moz-placeholder {
  color: #999;
}

:-moz-placeholder {
  color: #999;
}

input::-ms-clear,
input::-ms-reveal {
  display: none;
}

.before:before,
.after:after {
  content: '';
  display: inline-block
}

addr,
acronym {
  border: 0;
  font-variant: normal
}

sup,
sub {
  vertical-align: baseline
}

a {
  color: #006eff;
  text-decoration: none;
  outline: none
}

a:hover {
  color: #005eff;
  text-decoration: underline
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden
}

.clearfix {
  min-height: 1%;
}

.clear {
  clear: both;
}

.chand {
  cursor: pointer;
}

/*FONT
-------------------------------------------------------------- */
body {
  font: 14px/1.5 'Microsoft YaHei UI', YaHei, tahoma, arial, "Hiragino Sans GB", \5b8b\4f53
}

@font-face {
  font-family: DinPro;
  src: url("../font/DINPro-Medium.otf");
}

.f10 {
  font-size: 10px !important;
}

.f12 {
  font-size: 12px !important;
}

.f13 {
  font-size: 13px !important;
}

.f14 {
  font-size: 14px !important;
}

.f15 {
  font-size: 15px !important;
}

.f16 {
  font-size: 16px !important;
}

.f18 {
  font-size: 18px !important;
}

.f20 {
  font-size: 20px !important;
}

.f22 {
  font-size: 22px !important;
}

.f24 {
  font-size: 24px !important;
}

.f26 {
  font-size: 26px !important;
}

.f28 {
  font-size: 28px !important;
}

.f30 {
  font-size: 30px
}

.f32 {
  font-size: 32px
}

.f35 {
  font-size: 35px
}

.f36 {
  font-size: 36px
}

.f40 {
  font-size: 40px
}

.f60 {
  font-size: 60px
}

.fb {
  font-weight: bold
}

.fn {
  font-weight: 400
}

.t0 {
  text-indent: 0
}

.t1 {
  text-indent: 1em
}

.t2 {
  text-indent: 2em
}

.lh20 {
  line-height: 20px
}

.lh22 {
  line-height: 22px
}

.lh24 {
  line-height: 24px
}

.lh30 {
  line-height: 30px
}

.lh32 {
  line-height: 32px
}

.lh35 {
  line-height: 35px
}

.lh36 {
  line-height: 36px
}

.lh150 {
  line-height: 150%
}

.lh180 {
  line-height: 180%
}

.lh200 {
  line-height: 200%
}

.unl {
  text-decoration: underline
}

.no_unl {
  text-decoration: none
}

/*POSITION ZOOM
-------------------------------------------------------------- */
.bc {
  margin-left: auto;
  margin-right: auto
}

.fl {
  float: left
}

.fr {
  float: right
}

.pr {
  position: relative;
  z-index: 3
}

.pa {
  position: absolute
}

.abs-right {
  position: absolute;
  right: 0
}

.abs-left {
  position: absolute;
  left: 0
}

.hidden {
  visibility: hidden
}

.none {
  display: none
}

.of {
  overflow: hidden
}

.dis-line {
  display: inline
}

.dib {
  display: inline-block
}

.dyb {
  display: block
}

.cf {
  zoom: 1
}

.cf:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0
}

/* text-align */
.tc {
  text-align: center;
}

.tr {
  text-align: right;
}

.tl {
  text-align: left;
}

.tj {
  text-align: justify;
}

/* vertical-align */
.vm {
  vertical-align: middle;
}

.vtb {
  vertical-align: text-bottom;
}

.vb {
  vertical-align: bottom;
}

.vt {
  vertical-align: top;
}

.v2 {
  vertical-align: 2px;
}

.v1 {
  vertical-align: 1px;
}

.v-1 {
  vertical-align: -1px;
}

.v-2 {
  vertical-align: -2px;
}

.v-3 {
  vertical-align: -3px;
}

.v-4 {
  vertical-align: -4px;
}

.v-5 {
  vertical-align: -5px;
}

/*WIDTH / HEIGHT
-------------------------------------------------------------- */
.w10 {
  width: 10px
}

.w20 {
  width: 20px
}

.w30 {
  width: 30px
}

.w40 {
  width: 40px
}

.w50 {
  width: 50px
}

.w60 {
  width: 60px
}

.w70 {
  width: 70px
}

.w80 {
  width: 80px
}

.w90 {
  width: 90px
}

.w100 {
  width: 100px
}

.w120 {
  width: 120px
}

.w200 {
  width: 200px
}

.w250 {
  width: 250px
}

.w300 {
  width: 300px
}

.w400 {
  width: 400px
}

.w500 {
  width: 500px
}

.w600 {
  width: 600px
}

.w700 {
  width: 700px
}

.w800 {
  width: 800px
}

.w990 {
  width: 990px
}

.w1200 {
  width: 1200px;
  margin: 0 auto
}

.wp25 {
  width: 24.5%
}

.wp50 {
  width: 49.5%
}

.wp100 {
  width: 100%
}

.h24 {
  height: 24px
}

.h30 {
  height: 30px
}

.h50 {
  height: 50px
}

.h80 {
  height: 80px
}

.h100 {
  height: 100px
}

.h200 {
  height: 200px
}

.h {
  height: 100%
}

.lh16 {
  line-height: 16px
}

.lh20 {
  line-height: 20px
}

.lh22 {
  line-height: 22px
}

.lh24 {
  line-height: 24px
}

.lh50 {
  line-height: 50px
}

.lh100 {
  line-height: 100px
}

.lh150 {
  line-height: 150%
}

.lh180 {
  line-height: 180%
}

.lh200 {
  line-height: 200%
}

/*MARGIN / PADDING
-------------------------------------------------------------- */
.m0 {
  margin: 0
}

.m5 {
  margin: 5px
}

.m10 {
  margin: 10px
}

.m15 {
  margin: 15px
}

.m20 {
  margin: 20px
}

.m25 {
  margin: 25px
}

.m30 {
  margin: 30px
}

.m50 {
  margin: 50px
}

.mt0 {
  margin-top: 0
}

.mt5 {
  margin-top: 5px
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mt100 {
  margin-top: 100px
}

.mr0 {
  margin-right: 0
}

.mr5 {
  margin-right: 5px
}

.mr10 {
  margin-right: 10px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mr25 {
  margin-right: 25px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.mr40 {
  margin-right: 40px !important;
}

.mr50 {
  margin-right: 50px !important;
}

.mb0 {
  margin-bottom: 0
}

.mb5 {
  margin-bottom: 5px
}

.mb10 {
  margin-bottom: 10px
}

.mb15 {
  margin-bottom: 15px
}

.mb20 {
  margin-bottom: 20px
}

.mb25 {
  margin-bottom: 25px
}

.mb30 {
  margin-bottom: 30px
}

.mb50 {
  margin-bottom: 50px
}

.mb100 {
  margin-bottom: 100px
}

.ml0 {
  margin-left: 0
}

.ml5 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.ml30 {
  margin-left: 30px !important;
}

.ml50 {
  margin-left: 50px !important;
}

.ml100 {
  margin-left: 100px
}

.p0 {
  padding: 0
}

.p5 {
  padding: 5px
}

.p10 {
  padding: 10px
}

.p15 {
  padding: 15px
}

.p20 {
  padding: 20px
}

.p25 {
  padding: 25px
}

.p30 {
  padding: 30px
}

.p40 {
  padding: 40px
}

.p50 {
  padding: 50px
}

.pt0 {
  padding-top: 0
}

.pt5 {
  padding-top: 5px
}

.pt10 {
  padding-top: 10px
}

.pt15 {
  padding-top: 15px
}

.pt20 {
  padding-top: 20px
}

.pt25 {
  padding-top: 25px
}

.pt30 {
  padding-top: 30px
}

.pt40 {
  padding-top: 40px
}

.pt50 {
  padding-top: 50px
}

.pr0 {
  padding-right: 0
}

.pr5 {
  padding-right: 5px
}

.pr10 {
  padding-right: 10px
}

.pr15 {
  padding-right: 15px
}

.pr20 {
  padding-right: 20px
}

.pr25 {
  padding-right: 25px
}

.pr35 {
  padding-right: 35px
}

.pr30 {
  padding-right: 30px
}

.pr50 {
  padding-right: 50px
}

.pb0 {
  padding-bottom: 0
}

.pb5 {
  padding-bottom: 5px
}

.pb10 {
  padding-bottom: 10px
}

.pb15 {
  padding-bottom: 15px
}

.pb20 {
  padding-bottom: 20px
}

.pb25 {
  padding-bottom: 25px
}

.pb30 {
  padding-bottom: 30px
}

.pb40 {
  padding-bottom: 40px
}

.pb50 {
  padding-bottom: 50px
}

.pl0 {
  padding-left: 0
}

.pl5 {
  padding-left: 5px
}

.pl10 {
  padding-left: 10px
}

.pl15 {
  padding-left: 15px
}

.pl20 {
  padding-left: 20px
}

.pl25 {
  padding-left: 25px
}

.pl30 {
  padding-left: 30px
}

.pl35 {
  padding-left: 35px
}

.pl40 {
  padding-left: 40px
}

.pl50 {
  padding-left: 50px
}

.prbl40 {
  padding: 0 40px 40px 40px
}

.cursor {
  cursor: pointer;
}

/*BACKGROUND COLOR
-------------------------------------------------------------- */
.bk_white {
  background: #fff
}

.bk_gray {
  background: #F6F6F6
}

.bk_gray1 {
  background: #c7c7c7
}

.bk_red {
  background: #e54857
}

.bk_green {
  background: #78fa63
}

.bk_blue {
  background: #478afa
}

/*FONT COLOR
-------------------------------------------------------------- */
.fc_000 {
  color: #000
}

.fc_222 {
  color: #222
}

.fc_333 {
  color: #333
}

.fc_444 {
  color: #444
}

.fc_666 {
  color: #666
}

.fc_888 {
  color: #888
}

.fc_999 {
  color: #999
}

.fc_9e9 {
  color: #9e9e9e
}

.fc_a4a {
  color: #a4a4a4
}

.fc_ora {
  color: #ff9413
}

.fc_yellow {
  color: #d7a022
}

.fc_blue {
  color: #0081e2
}

a.fc_blue:hover {
  color: #48a3e7
}

.fc-red {
  color: #f74b4b
}

.fc-white {
  color: white
}

.fc-green {
  color: #61bb5a
}

.fc-blue-t {
  color: #0093FF
}

.fc-blue-baby {
  color: #8B99C5
}

.topUp-realName-tip {
  color: #f83
}

.svg-waves {
  position: absolute;
  width: 100%;
  bottom: 0;
  opacity: .1;
  z-index: 90
}

/*面包屑*/
#crumbs {
  width: 100%;
  margin: 0 auto;
  font-size: 14px;
  color: #222;
}

#crumbs ul {
  margin: 0 auto;
  width: 1200px;
  height: 44px;
  line-height: 44px;
}

#crumbs ul li {
  float: left;
  padding: 0 5px;
}

#crumbs ul li a {
  padding: 0 10px 0 0;
  color: #222;
}

#crumbs ul li a:hover {
  text-decoration: underline
}

.mz-layout-section {
  padding: 20px;
  padding-top: 10px;
  background: #fff;
  width: 100%;
  box-sizing: border-box;
  border-radius: 5px;
}

.panel-tips {
  color: #666;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
}

.flex-infos {
  width: 100%;
  padding-right: 0;
  display: flex;
}

.flex-infos .item {
  flex: 1;
  padding-right: 20px;
}

.flex-infos .item .item-header {
  display: flex;
  justify-content: space-between;
  font-weight: 500;
  font-size: 14px;
  height: 20px;
  line-height: 20px;
  color: #333;
  margin-bottom: 14px;
}

.flex-infos .item .item-main .money {
  font-weight: 500;
  font-size: 24px;
  line-height: 34px;
  margin-right: 20px;
  vertical-align: middle;
}

.flex-infos .item+.item {
  border-left: 1px solid #e2e5ed;
  padding-left: 20px;
}

.flex-c {
  display: flex;
  justify-content: center
}

.flex-e {
  display: flex;
  justify-content: flex-end
}

.flex-c-c {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-c-s {
  display: flex;
  justify-content: space-between
}

.tableList_title {
  color: #252b3a;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
}

.tableList_crud {
  margin-top: 50px;
}

.details-section {
  box-sizing: border-box;
  box-shadow: 0 0 5px rgba(0, 0, 0, .2);
  border: 1px solid #dfdfdf;
  border-radius: 5px;
}

.details-section-h3 {
  margin-bottom: 20px;
  height: 36px;
  font: 600 14px/36px "Microsoft YaHei";
  color: #333;
  border-bottom: 1px solid #dfdfdf;
  overflow: hidden;
}

.details-section-h3 span {
  margin-left: 10px;
  display: inline-block;
  /*border-bottom: 2px solid #0094ff;*/
}

.details-section-h3 span:before {
  content: '';
  display: inline-block;
  float: left;
  margin-top: 12px;
  margin-right: 5px;
  width: 3px;
  height: 12px;
  background-color: #0081e2;
  border-radius: 5px;
}

.selection-box {
  padding: 20px;
  background: #fff;
  box-sizing: border-box;
  border-radius: 5px;
}

.record-box {
  max-height: 500px;
  overflow: auto;
  padding: 20px 20px 0px;
  background: #fff;
  box-sizing: border-box;
  border-radius: 5px;

}

.record-card {
  border: 1px solid #f0f0f0;
  border-radius: 5px;
  padding: 20px 0;
}

.record-header {
  border-bottom: 1px solid #f0f0f0;
  padding: 0 20px 10px;
  font-size: 13px;
  color: #303133;
}

.record-content {
  padding: 15px 20px 0px;
  font-size: 13px;
  color: #303133;
}

::-webkit-scrollbar {
  width: 5px;
  /* 垂直滚动条的宽度 */
  height: 5px;
  /* 水平滚动条的高度 */
}

/* 滚动条轨道 */
::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* 轨道颜色 */
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
  background: #888;
  /* 滑块颜色 */
}

/* 滑块hover效果 */
::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* 滑块hover颜色 */
}

/*.title-divider {*/
/*  display: flex;*/
/*}*/

.title-divider.el-divider {
  margin-bottom: 30px;
  background: url("/img/bg/divider.png") 0 50%;
}

.title-divider .el-divider__text {
  display: flex;
  align-content: center;
}

.title-divider .el-divider__text.is-left {
  left: 0;
}

.title-divider .el-divider__text:before {
  margin-right: 15px;
  width: 4px;
  height: 16px;
  border-radius: 5px;
  background: #00a2ff;
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
}

.pub_dialog {
  border-radius: 5px !important;
}