/* 下面的html的font-size代表多少像素等于1rem（不过无论就算1rem小于20px，计算时也请以1rem=20px来） */
/* body里的font-size是指定body下所有DOM节点的默认字体大小 */
@media screen and (min-width:360px){html{font-size:18px}body{font-size:12px}}/*Android通用*/
@media screen and (min-width:375px){html{font-size:19px}body{font-size:12.5px}}/*iphone*/
@media screen and (min-width:393px){html{font-size:20px}body{font-size:13px}}/*Google Pixel Redmi*/
@media screen and (min-width:412px){html{font-size:20px}body{font-size:13.5px}}/*Pixel Samsung 1+*/
@media screen and (min-width:414px){html{font-size:20px}body{font-size:14px}}/*iphone plus*/
@media screen and (min-width:768px){html{font-size:30px}body{font-size:15.5px}}/* iPad */
@media screen and (min-width:1024px){html{font-size:32px}body{font-size:16px}}/* iPad Pro */
/* @media screen and (min-width:1280px){html{font-size:16px}body{font-size:15px}} *//* PC */
/*↑↑↑↑遇到大于最后一个min-width宽度的屏幕则使用最后一个min-width的配置*/

@media not all and (min-resolution:.001dpcm)
{ @media { /* 仅针对于Safari浏览器的外观样式 */
  input[type='date'],input[type='time'],input[type='datetime-local'],select{
    -webkit-appearance: none;
  }
}}
select{background: #fff;}/*修复安卓问题*/
*{margin:0;padding:0;} /* 不可以在这里设置字体，否则新增字体将无法应用！ */
*,*::before,*::after {box-sizing: border-box;}
html,body{
  padding: 0;margin: 0;
  width: 100%;/*若body添加了背景色并被超出的话会很难看，所以把height改为min-height会比较好*/
  height:100%;/*但是如果body使用min-height:100%的话就无法限制内容超出浏览器窗口了(即使用body内部容器限制也无效),所以特此改回;另外强烈建议不要给body加上背景色！*/
  color: var(--black);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Source Han Sans SC","Segoe UI",Arial,sans-serif;
  background:#fff;
}
a{text-decoration:none;color:#334;}
p{white-space: pre-wrap;} /* 让textarea保存的文字原样换行 */
img,video{border:0;vertical-align:middle;text-align:center;max-width:100%;border-style: none;}
ul,li{list-style: none;}
button{font-family: 'PingFangSC Semibold',"Microsoft YaHei";}
textarea{font-family: inherit;}
:root{	/* 定义颜色变量 */
  --tc: #0084ca; /* 通用的主题颜色 */
  --pale: #ececec;  /* 通用的浅灰色 */
  --red: #fe464e; /* 通用的红色 */
  --black: #232333; /* 标准黑色文字 */
  --second: #667; /* 灰色文字 */
  --yolk: #ff7444; /* 蛋黄色 */
  --red: #ef0000;
}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
    color: #bebebe;
}
input[type='radio']{width: 0.7rem;height: 0.7rem;vertical-align: middle;}
span{vertical-align: middle;}
.bg-full{ /* 常用于body加颜色的包裹 */
  min-height: 100%;
  height: initial;
}
.mh-100{
	min-height: 100%;
}
.center{/* 通用的居中子元素样式（父元素无需指定高度） */
    align-items: center;    /* 子元素垂直居中 */
    justify-content: center;/* 子元素水平居中 */
    display:flex;text-align: center;
}
.center>p{width: 100%;}/*使用父元素flex->center的方法会使子p元素宽度变为最小值，这里做修正*/
[class*=flx]{ display: flex;}/*当主元素用该样式时建议不要在其内的一级元素上再使用该样式了*/
[class*=flx-d]{ flex-direction: column;}
[class*=flx-vc]{ align-items: center;} /* vertical center */
[class*=flx-d-vc]{justify-content: center;} /* vertical center */
[class*=flx-d-b]{justify-content:flex-end;} /* vertical bottom */
[class*=flx-hc]{ justify-content: center;} /* horizontal center */
[class*=flx-d-hc]{ align-items: center;} /* horizontal center */
[class*=blo]{ display: block;}
[class*=fl-l]{ float: left;}
[class*=fl-r]{ float: right!important;}
.ps-rl{position: relative;}
.jc-sb{justify-content:space-between!important;}/* flex子元素两端分布 */
.cf{zoom:1}.cf:after{display:block;clear:both;content:"";visibility:hidden;height:0}
.cf>*[class*=wd]{float: left;}
.grow{ flex-grow: 1;}/*通用的自动撑大*/
.eq-wd,.wd-eq{flex: 1 1 0;}/* 元素等宽 */
.hidden{display: none!important;}
small{font-size: 75%;}
.nowrap{white-space:nowrap;}
.va-md{vertical-align: middle;}
.va-bl{vertical-align: baseline;}
/*以下样式类似boostrap4*/
.tx-l{text-align: left!important;}
.tx-c{text-align: center;justify-content: center;}
.tx-r{text-align: right;justify-content: flex-end;}

.ff{background: #fff;}
.fa{background: #fafafa;}
.ee{background: #eee;}
.bc{background-color: var(--tc)!important;color:#fff;}/*通用的主题背景色*/
.fc,.active{color: var(--tc)!important;} /*通用的主题字体色*/
.f-red,span.red,i.red,b.red{color: var(--red);}
.bg-red{background: var(--red);color: #fff;}

*[class*=wd-]>*{max-width: 100%;}/*不然会超出整个页面*/
.wd-2-1,.wd-50{width: 50%;}
.wd-3-1,.wd-33{width: 33.3%;}
.wd-3-2,.wd-66{width: 66.66%;}
.wd-4-1,.wd-25{width: 25%;}
.wd-4-3,.wd-75{width: 75%;}
.wd-5-1,.wd-20{width: 20%;}
.wd-15{width: 15%!important;}
.wd-40{width: 40%!important;}
.wd-45{width: 45%!important;}
.wd-55{width: 55%!important;}
.wd-60{width: 60%!important;}
.wd-90{width: 90%!important;}
.wd-100{width: 100%!important;}

.bt-1{border-top: 1px solid #bdbdbd;}
.bb-1{border-bottom: 1px solid #bdbdbd;}
.br-0{border-radius: 0!important;}
.pd-0{padding: 0 !important;}
.bd-0{border: 0!important;}
.mg-0{margin: 0!important;}
.br-0{border-radius:0!important;}

.pl-0{padding-left: 0 !important;}
.pl-i{padding-left: 0.16rem!important;}
.pl-s{padding-left: 0.3rem!important;}
.pl-a{padding-left: 0.57rem!important;}
.pl-b{padding-left: 0.83rem!important;}
.pl-1{padding-left: 1rem!important;}
.pl-2{padding-left: 2rem!important;}
.pl-6{padding-left: 6%;}
.pl-7{padding-left: 7%;}
.pl-8{padding-left: 8%;}
.pl-9{padding-left: 9%;}
.pl-10{padding-left:10%;}

.pr-0{padding-right: 0 !important;}
.pr-i{padding-right: 0.16rem!important;}
.pr-s{padding-right: 0.3rem!important;}
.pr-a{padding-right: 0.57rem!important;}
.pr-b{padding-right: 0.83rem!important;}
.pr-1{padding-right: 1rem!important;}
.pr-2{padding-right: 2rem!important;}
.pr-6{padding-right: 6%;}
.pr-7{padding-right: 7%;}
.pr-8{padding-right: 8%;}
.pr-9{padding-right: 9%;}
.pr-10{padding-right:10%;}

.pt-0{padding-top: 0 !important;}
.pt-i{padding-top: 0.16rem!important;}
.pt-s{padding-top: 0.3rem!important;}
.pt-a{padding-top: 0.57rem!important;}
.pt-b{padding-top: 0.83rem!important;}
.pt-1{padding-top: 1rem!important;}
.pt-2{padding-top: 2rem!important;}
.pt-6{padding-top: 6%!important;}
.pt-7{padding-top: 7%!important;}
.pt-8{padding-top: 8%!important;}
.pt-9{padding-top: 9%!important;}
.pt-10{padding-top:10%!important;}

.pb-0{padding-bottom: 0 !important;}
.pb-i{padding-bottom: 0.16rem!important;}
.pb-s{padding-bottom: 0.3rem!important;}
.pb-a{padding-bottom: 0.57rem!important;}
.pb-b{padding-bottom: 0.83rem!important;}
.pb-1{padding-bottom: 1rem!important;}
.pb-2{padding-bottom: 2rem!important;}
.pb-6{padding-bottom: 6%!important;}
.pb-7{padding-bottom: 7%!important;}
.pb-8{padding-bottom: 8%!important;}
.pb-9{padding-bottom: 9%!important;}
.pb-10{padding-bottom:10%!important;}

.ml-0{margin-left: 0 !important;}
.ml-i{margin-left: 0.16rem!important;}
.ml-s{margin-left: 0.3rem!important;}
.ml-a{margin-left: 0.57rem!important;}
.ml-b{margin-left: 0.83rem!important;}
.ml-1{margin-left: 1rem!important;}
.ml-2{margin-left: 2rem!important;}
.ml-6{margin-left: 6%;}
.ml-7{margin-left: 7%;}
.ml-8{margin-left: 8%;}
.ml-9{margin-left: 9%;}
.ml-10{margin-left:10%;}

.mt-0{margin-top: 0 !important;}
.mt-i{margin-top: 0.16rem!important;}
.mt-s{margin-top: 0.3rem!important;}
.mt-a{margin-top: 0.57rem!important;}
.mt-b{margin-top: 0.83rem!important;}
.mt-1{margin-top: 1rem!important;}
.mt-2{margin-top: 2rem!important;}
.mt-6{margin-top: 6%!important;}
.mt-7{margin-top: 7%!important;}
.mt-8{margin-top: 8%!important;}
.mt-9{margin-top: 9%!important;}
.mt-10{margin-top:10%!important;}

.mb-0{margin-bottom: 0 !important;}
.mb-i{margin-bottom: 0.16rem!important;}
.mb-s{margin-bottom: 0.3rem!important;}
.mb-a{margin-bottom: 0.57rem!important;}
.mb-b{margin-bottom: 0.83rem!important;}
.mb-1{margin-bottom: 1rem!important;}
.mb-2{margin-bottom: 2rem!important;}
.mb-6{margin-bottom: 6%;}
.mb-7{margin-bottom: 7%;}
.mb-8{margin-bottom: 8%;}
.mb-9{margin-bottom: 9%;}
.mb-10{margin-bottom:10%;}

.h-i,.sp-i{height: 0.16rem;}/*超小间隔*/
.h-s,.sp-s{height: 0.3rem;}/*小间隔*/
.h-a,.sp-a{height: 0.57rem;}/*间隔a*/
.h-b,.sp-b{height: 0.83rem;}/*间隔b*/
.h-1,.sp-1{height: 1rem;} /*1rem间隔*/
.h-2,.sp-2{height: 2rem;} /*1rem间隔*/
.h-auto{height: auto!important;}
.h-100{height: 100%!important;}
/*针对IOS图片的预览角度旋转*/
img[data-ort='6']{transform: rotate(90deg);}
img[data-ort='3']{transform: rotate(180deg);}
img[data-ort='8']{transform: rotate(-90deg);}

.list{overflow-y: auto;-webkit-overflow-scrolling: touch;}
.tab-flx>*{text-align: center;} /* 选项卡菜单默认居中 */
/*通用的行样式*/
.row-flx{
    border-bottom: 1px solid #c5c7d8;
    padding: 0.6rem 0;
}
.row-flx>a{width: 100%;}
/*通用的箭头样式*/
.arr{ /* 向右箭头 */
    border-top: 1px solid #6E6E6E;
    border-right: 1px solid #6E6E6E;
    margin-left: 0.2rem;
    width: 0.45rem;
    height: 0.45rem;
    transform: rotate(45deg);
    vertical-align: middle;
    display: inline-block;
}
.ard{ /* 向下箭头 */
    border-bottom: 1px solid #999;
    border-right: 1px solid #999;
    margin-left: 0.2rem;
    width: 0.45rem
    height: 0.45rem
    transform: rotate(45deg);
    vertical-align: middle;
    display: inline-block;
}
/*通用的提交按钮*/
.subtom{
  display: block;
  background: var(--tc);
  color: #fff;
  text-align: center;
  height: 2.25rem;
  line-height: 2.25rem;
  font-size: 0.83rem;
  border-radius: 0.3rem;
  border: 0;
  width: 57%;
  margin: 0 auto;
}
.subtom[disabled],.disabled>.subtom{
  background: grey;
}
.footer{
  border-top: 1px solid #e7e7e7;
}
/* 底部nav如果使用flex布局会有溢出整屏高度的问题 */
.flx-d .footer>a{
  text-align: center;
  height: 1.9rem;
  line-height: 1.9rem;
  float: left;
}
/*layer mobile 弹出底部选择项样式*/
.layui-m-layer-footer>.layui-m-layercont{
    background-color: #fff!important;
}
.layui-m-layer-footer>.h3{
    border-bottom: 1px solid #e9e9e9;
}
/*通用的暂无记录样式*/
center.empty{
    width: 100%;
    margin-top: 1.25rem;
    color: #c7cad0;
}
center.empty>i{
    padding: 0 0.35rem;
}
.g-line{
  height: 1px;
  background: #999;
  display: inline-block;
}
iframe{ max-width: 100%;}