/** 移动端公用css */
*{
  margin: 0;padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*::before,
*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body{
  -webkit-text-size-adjust: none;	/* 禁用Webkit内核浏览器的文字大小调整功能 */
	font-family: PingFangSC-Semibold, 'PingFang SC';
  font-size: 16px;
  color: #333;
  background-color: #F5F5F5;
}
a{
  text-decoration: none;outline: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;	/* 去除a标签的点击阴影 */
}
ul, ol, li{
  list-style: none;
}
form{
  border: 0 none;
  list-style: none;
}
img{
  border: 0 none;
  vertical-align: top;
  -ms-interpolation-mode: bicubic;
}
table{
  border-spacing: 0;
  border-collapse: collapse;
}
label, input,
button, select, textarea{
  outline:none;
}
button, input[type="button"],
input[type="reset"], input[type="submit"]{
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
       -o-appearance: none;
  		  	appearance: none;
}
textarea{
  resize: none;
}

/** 清除浮动 */
.clearfix::after{
  content: ".";display: block;
  height: 0;font-size: 0;
  clear: both;visibility: hidden;
}
.clearfix{
  display: block;
}
/** 超出文本处理 */
.ellipsis{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}
.break{
  word-break: break-all;
  word-wrap: break-word;
}
.left{
	float: left;
}
.right{
	float: right;
}

/** px和rem单位换算 */
@media screen and (max-width: 300px){
  html, body{
	font-size: 12.8px;
  }
}
@media screen and (max-width: 375px) and (min-width: 300px){
  html, body{
	font-size: calc(16px + 3.2 * (100vw - 375px) / 75);
  }
}
@media screen and (max-width: 750px) and (min-width: 375px){
  html, body{
	font-size: calc(16px + 16 * (100vw - 375px) / 375);
  }
}
@media screen and (min-width: 750px){
  html, body{
	font-size: 32px;
  }
}

/** 输入框placehold 和 error状态 */
::-webkit-input-placeholder{
	color: #C0C4CC;
}
:-moz-placeholder {
	color: #C0C4CC;
}
::-moz-placeholder {
	color: #C0C4CC;
}
:-ms-input-placeholder{
	color: #C0C4CC;
}
.error::-webkit-input-placeholder{
	color: #ff5b5b;
}
.error:-moz-placeholder {
	color: #ff5b5b;
}
.error::-moz-placeholder {
	color: #ff5b5b;
}
.error:-ms-input-placeholder{
	color: #ff5b5b;
}

/** 滚动条样式 */
body::-webkit-scrollbar,
.scrollbar::-webkit-scrollbar{
    width: 10px;
    height: 10px;
}
body::-webkit-scrollbar-thumb,
.scrollbar::-webkit-scrollbar-thumb{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: rgba(0,0,0,0.2);
}
body::-webkit-scrollbar-track,
.scrollbar::-webkit-scrollbar-track{
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    border-radius: 0;
    background: rgba(0,0,0,0.1);
}

/**
 * element-ui
 * */
.el-col{
	margin-bottom: 10px;
}
.el-select{
	width: 100%;
	height: 100%;
}
.el-select>.el-input{
	width: 100%;
	height: 100%;
}
.el-range-editor.el-input__inner{
	width: 100%;
}
.el-date-editor .el-range-separator{
	width: auto;
}
.el-radio{
	margin-bottom: 0.1rem;
}
.el-progress-bar__inner{
	background-color: #FF533D;
}
/** 消息提示框 */
.el-message{
	min-width: 20rem;
	padding: 0.625rem 0.9375rem;
}
/** 进度条优化 */
.el-progress-bar, .el-progress-bar__inner::after, .el-progress-bar__innerText, .el-spinner{
	vertical-align: top;
	margin-top: 1px;
	line-height: 12px;
	font-size: 12px;
}

/**
 * 页面公共内容
 * */
body{
	background-color: #F5F5F5;
}
.page-box{
	width: 100%;
	max-width: 750px;
	margin: 0 auto;
	background-color: #F5F5F5;
}
.page-head{
	width: 100%;
	height: 2.75rem;
	background-color: #FFF;
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.12);
	position: fixed;
	left: 0;top: 0;
	z-index: 49;
}
.page-head p{
	padding: 0.4375rem 2.5rem;
	line-height: 1.875rem;
	font-size: 1.125rem;
	font-family: serif;
	font-weight: bold;
	color: #000;
	text-align: center;
}
.page-head .head-back{
	display: block;
	width: 2.75rem;
	height: 100%;
	position: absolute;
	left: 0;top: 0;
	z-index: 55;
	background-size: auto 50%;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('https://dtbz.oss-cn-beijing.aliyuncs.com/icon_back.png');
}
.loading-box{
	width: 100%;
	height: 100%;
}

/**
 * 弹窗
 * */
.tc-box{
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;top: 0;
	z-index: 999;
	display: block;
}
.tc-box .dialogBg{
	z-index: 999;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
}
.tc-box .tc-con{
	margin: auto;
	left: 0;right: 0;
	top: 0;bottom: 0;
	z-index: 1000;
	color: #333;
	position: fixed;
}
.tc-box .tc-con .tc-head{
	width: 100%;
	height: 2.75rem;
	padding: 0.625rem;
	text-align: center;
	position: absolute;
	left: 0;top: 0;
	z-index: 1019;
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.12);
}
.tc-box .tc-con .tc-head .tc-head-close-btn{
	float: right;
	width: 1.5rem;
	height: 1.5rem;
	line-height: 1.5rem;
	font-size: 1.375rem;
	color: #999;
	text-align: center;
}
.tc-box .tc-con .tc-head p{
	width: 100%;
	padding: 0 1.8125rem;
	line-height: 1.5rem;
	font-size: 1rem;
	font-weight: bold;
	color: #333;
	text-align: center;
}
.tc-box .tc-con .tc-body{
	width: 100%;
	height: 100%;
	padding: 2.75rem 0 3.375rem;
}
.tc-box .tc-con .tc-foot{
	width: 100%;
	height: 3.375rem;
	padding: 0.625rem;
	text-align: center;
	position: absolute;
	left: 0;bottom: 0;
	z-index: 1019;
	box-shadow: 0 -0.125rem 0.25rem rgba(0, 0, 0, 0.12);
}
.tc-box .tc-con .tc-foot .tc-foot-submit-btn{
	display: block;
	width: 100%;
	height: 2.125rem;
	line-height: 2.125rem;
	font-size: 1rem;
	color: #FFF;
	text-align: center;
	background-color: rgba(248, 91, 35, 0.65);
	border-radius: 1.375rem;
}
.tc-box .tc-con .tc-foot .tc-foot-submit-btn.active{
	background-color: rgba(248, 91, 35, 1);
}


/** 协议声明 */
.statement .tc-con{
	height: 20.3125rem;
	text-align: center;
}
.statement-box{
	background: rgb(255, 255, 255);
	width: 20rem;
	height: 20.3125rem;
	padding-top: 1.5625rem;
	border-radius: 0.5rem;
	margin: 0 auto;
}
.statement-scroll{
	font-family: PingFangSC-Semibold, 'PingFang SC';
	font-weight: 400;
	overflow-y: scroll;
	width: 16.5625rem;
	height: 13.25rem;
	line-height: 1.25rem;
	font-size: 0.75rem;
	margin: 0 auto;
}
.statement-scroll .statement-title{
	line-height: 1.25rem;
	font-weight: bold;
	font-size: 0.875rem;
	text-align: center;
	padding-bottom: 0.9375rem;
}
.statement-scroll p{
	padding-bottom: 0.625rem;
	line-height: 1.25rem;
	font-size: 0.75rem;
	color: #333;
	text-align: justify;
}
.statement-scroll p:last-child{
	padding-bottom: 0;
}
.statement-scroll p.Fb{
	font-weight: bold;
}
.statement-agree{
	padding-top: 0.625rem;
	margin-bottom: 0.625rem;
	width: 100%;
	line-height: 1.25rem;
	font-size: 0.875rem;
	font-weight: bold;
	color: #333;
	text-align: center;
}
.statement-agree i{
	display: inline-block;
	vertical-align: top;
	line-height: 1.25rem;
	font-size: 1.25rem;
	color: #999;
}
.statement-agree.active i{
	color: #c00101;
}
.statement-btn{
	background: rgb(25, 137, 250);
	font-family: PingFangSC-Semibold, 'PingFang SC';
	font-weight: normal;
	color: #FFF;
	width: 10rem;
	line-height: 2.75rem;
	font-size: 0.875rem;
	border-radius: 0.5rem;
	margin: 1.5625rem auto 0;
}
.statement-btn2{
	background: rgb(25, 137, 250);
	font-family: PingFangSC-Semibold, 'PingFang SC';
	font-weight: normal;
	color: #FFF;
	width: 10rem;
	line-height: 2.25rem;
	font-size: 0.875rem;
	border-radius: 0.5rem;
	margin: 0 auto;
}
/** 未付款 */
.non-payment .tc-con{
	height: 18.8125rem;
	text-align: center;
}
.payment-box{
	width: 16.25rem;
	height: 18.8125rem;
	background-color: #FFF;
	border-radius: 0.5rem;
	padding: 1.875rem 0.9375rem 0.9375rem;
	margin: 0 auto;
	position: relative;
}
.payment-box.payment-choose{
	padding: 0.5rem 0.9375rem 0.9375rem;
}
.payment-box .icon-non-pay{
	display: inline-block;
	width: 8rem;
	height: 6.6875rem;
	margin-bottom: 1.25rem;
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('https://dtbz.oss-cn-beijing.aliyuncs.com/icon_non_pay.png');
}
.payment-box .payment-title{
	padding-bottom: 0.625rem;
	line-height: 1.5rem;
	font-size: 1rem;
	color: #c00101;
}
.payment-box.payment-choose .payment-title{
	padding-bottom: 2.875rem;
}
.payment-box .payment-text{
	line-height: 1.25rem;
	font-size: 0.875rem;
	color: #333;
}
.payment-box .payment-btn{
	display: block;
	width: 11.875rem;
	padding: 0.5rem 0.9375rem;
	margin: 0.9375rem auto 0;
	line-height: 1.25rem;
	font-size: 0.875rem;
	color: #FFF;
	background-color: #c00101;
	border-radius: 0.3125rem;
}
.payment-box .payment-btns{
	width: 100%;
	padding: 1.5625rem 0.3125rem 0;
}
.payment-box .payment-btns .payment-btn-half{
	display: block;
	float: left;
	width: 6.25rem;
	padding: 0.5rem 0.9375rem;
	line-height: 1.25rem;
	font-size: 0.875rem;
	color: #c00101;
	background-color: #FFF;
	border-radius: 0.625rem;
	border: 1px solid #c00101;
}
.payment-box .payment-btns .payment-btn-half.active{
	float: right;
	color: #FFF;
	background-color: #c00101;
}
.payment-box .payment-close-btn{
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	position: absolute;
	right: 0.625rem;
	top: 0.625rem;
}
.payment-box .payment-close-btn i{
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	font-size: 1.25rem;
	color: #999;
}

/** 投诉建议 */
.contact-box{
	margin-top: 0.9375rem;
	border-radius: 0.5rem;
	box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.18);
}
.contact-title{
	padding: 0.9375rem 0.75rem 0.3125rem;
	line-height: 1.25rem;
	font-size: 1rem;
	font-weight: bold;
	color: #333;
}
.contact-body{
	padding: 0.3125rem 1.25rem 0.9375rem;
}
.complain-title-sub{
	padding-bottom: 0.25rem;
	line-height: 1.25rem;
	font-size: 0.875rem;
	color: #333;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
.complain-title{
	padding-bottom: 0.625rem;
}
.complain-title p{
	display: inline-block;
	vertical-align: top;
	line-height: 1.5rem;
	font-size: 0.875rem;
	color: #333;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
.complain-title a{
	display: block;
	float: right;
	padding: 0 0.75rem;
	line-height: 1.5rem;
	font-size: 0.75rem;
	color: #c00101;
	text-align: center;
	border: 1px solid #c00101;
	border-radius: 0.25rem;
}
.complain-content{
	width: 100%;
	margin-bottom: 0.625rem;
}
.complain-content input{
	width: 100%;
}
.complain-btn{
	padding: 0 0.5rem;
}
.complain-btn a{
	display: block;
	width: 100%;
	height: 2.5rem;
	padding: 0.5rem 0.9375rem;
	line-height: 1.5rem;
	font-size: 1rem;
	color: #FFF;
	text-align: center;
	background-color: #c00101;
	border-radius: 0.375rem;
}
.contact-customer .customer-wx{
	padding-bottom: 0.9375rem;
}
.contact-customer .customer-wx .customer-wx-tip{
	padding: 0.3125rem 0;
	line-height: 1.25rem;
	font-size: 0.75rem;
	color: #999;
}
.contact-customer .customer-wx p{
	border: 1px solid transparent;
	line-height: 1.5rem;
	font-size: 0.875rem;
	color: #333;
}
.contact-customer .customer-wx a.copy-btn{
	float: right;
	display: block;
	padding: 0 0.75rem;
	line-height: 1.5rem;
	font-size: 0.875rem;
	color: #c00101;
	text-align: center;
	border-radius: 0.3125rem;
	border: 1px solid #c00101;
}
.contact-customer .customer-time{
	line-height: 1.125rem;
	font-size: 0.75rem;
	color: #999;
	text-align: center;
}
.contact-customer .customer-title{
	padding: 0.625rem 0;
	line-height: 1.25rem;
	font-size: 0.875rem;
	font-weight: bold;
	color: #333;
	text-align: left;
}
.contact-customer .customer-wx{
	padding-left: 0.625rem;
}
.contact-customer .customer-code{
	width: 100%;
	padding: 0.625rem 0 0;
}
.contact-customer .customer-code img{
	display: block;
	width: 8rem;
	height: 8rem;
	margin: 0 auto;
}
.contact-customer .customer-code p{
	line-height: 1.25rem;
	font-size: 0.75rem;
	color: #999;
	text-align: center;
}
.contact-customer .customer-tip{
	line-height: 1.25rem;
	font-size: 0.75rem;
	color: #999;
	text-align: center;
}
.contact-customer .contact-wechat-btn{
	display: block;
	width: 100%;
	height: 2.5rem;
	padding: 0.5rem 0.9375rem;
	line-height: 1.5rem;
	font-size: 1rem;
	color: #FFF;
	text-align: center;
	background-color: #c00101;
	border-radius: 0.375rem;
	margin-top: 0.3125rem;
}

/** 状态色 */
.state-blue{
	color: #409EFF !important;
}
.state-green{
	color: #67C23A !important;
}
.state-red{
	color: #F56C6C !important;
}
.state-black{
	color: #333 !important;
}
.state-grey{
	color: #999 !important;
}
.state-yellow{
	color: #c00101 !important;
}