html,body{ color: #333; font-size: .18rem; background-color: #EDF1F7; }
*{ box-sizing: border-box; }

.flex-r{ display: flex; }
.flex-h{ display: flex; flex-flow: column; }
.flex-r-c{ display: flex; justify-content: center; }
.flex-r-e{ display: flex; justify-content: flex-end; }
.flex-r-s{ display: flex; justify-content: flex-start; }
.flex-h-c{ display: flex; align-items: center; }
.flex-h-e{ display: flex; align-items: flex-end; }
.flex-h-s{ display: flex; align-items: flex-start; }
.flex-all-c{ display: flex; justify-content: center; align-items: center; }
.flex-s-b{ display: flex; justify-content: space-between; }
.flex-full-area{ flex-grow: 1; }
.flex-no-zoom{ flex-shrink: 0; }
.flex-wrap{ flex-wrap: wrap; }
.flex-nowrap{ flex-wrap: nowrap; }

.fs12{ font-size: 0.12rem; }
.fs13{ font-size: 0.13rem; }
.fs14{ font-size: 0.14rem; }
.fs15{ font-size: 0.15rem; }
.fs16{ font-size: 0.16rem; }
.fs17{ font-size: 0.17rem; }
.fs18{ font-size: 0.18rem; }
.fs19{ font-size: 0.19rem; }
.fs20{ font-size: 0.20rem; }
.fs22{ font-size: 0.22rem; }
.fs24{ font-size: 0.24rem; }
.fs26{ font-size: 0.26rem; }
.fs28{ font-size: 0.28rem; }
.fs30{ font-size: 0.30rem; }
.fs32{ font-size: 0.32rem; }
.fs34{ font-size: 0.34rem; }

.f7{ font-weight: 700; }
.c-theme{ color: #ED6D00; }
.c-white{ color: #fff; }
.gray999{ color: #999; }
.gray-bf{ color: #bfbfbf; }
.text-c{ text-align: center; }

.mb8{ margin-bottom: 0.08rem; }
.mb12{ margin-bottom: 0.12rem; }
.mb14{ margin-bottom: 0.14rem; }
.mb16{ margin-bottom: 0.16rem; }
.mb18{ margin-bottom: 0.18rem; }
.mb20{ margin-bottom: 0.20rem; }
.mb22{ margin-bottom: 0.22rem; }
.mb24{ margin-bottom: 0.24rem; }
.mb26{ margin-bottom: 0.26rem; }
.mb28{ margin-bottom: 0.28rem; }
.mb30{ margin-bottom: 0.30rem; }
.mb32{ margin-bottom: 0.32rem; }
.mb34{ margin-bottom: 0.34rem; }
.mb36{ margin-bottom: 0.36rem; }
.mb38{ margin-bottom: 0.38rem; }
.mb40{ margin-bottom: 0.40rem; }
.mb42{ margin-bottom: 0.42rem; }
.mb44{ margin-bottom: 0.44rem; }
.mb46{ margin-bottom: 0.46rem; }
.mb48{ margin-bottom: 0.48rem; }
.mr8{ margin-right: 0.8rem; }
.mr12{ margin-right: 0.12rem; }
.mr14{ margin-right: 0.14rem; }
.mr16{ margin-right: 0.16rem; }
.mr18{ margin-right: 0.18rem; }
.mr20{ margin-right: 0.20rem; }
.mr22{ margin-right: 0.22rem; }
.mr24{ margin-right: 0.24rem; }
.mr26{ margin-right: 0.26rem; }
.mr28{ margin-right: 0.28rem; }
.mr30{ margin-right: 0.30rem; }
.mr32{ margin-right: 0.32rem; }
.mr34{ margin-right: 0.34rem; }
.mr36{ margin-right: 0.36rem; }
.mr38{ margin-right: 0.38rem; }
.mr40{ margin-right: 0.40rem; }
.mr42{ margin-right: 0.42rem; }
.pt32{ padding-top: 0.32rem; }
.pt55{ padding-top: 0.55rem; }
.pt64{ padding-top: 0.64rem; }
.pb32{ padding-bottom: 0.32rem; }
.pb40{ padding-bottom: 0.40rem; }
.pb55{ padding-bottom: 0.55rem; }
.pb64{ padding-bottom: 0.64rem; }

.has-horizontal-scrollerbar{ overflow:hidden; overflow-x:scroll; -webkit-overflow-scrolling:touch; }
.has-vertical-scrollerbar{ overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch; }
.has-horizontal-scrollerbar::-webkit-scrollbar-track-piece,
.has-horizontal-scrollerbar::-webkit-scrollbar,
.has-vertical-scrollerbar::-webkit-scrollbar-track-piece,
.has-vertical-scrollerbar::-webkit-scrollbar{ width: 0; height: 0; display: none;}


.hide-txt{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.clamp-txt{ -webkit-line-clamp: 2;  display: -webkit-box;  -webkit-box-orient: vertical; overflow: hidden;}
.break-all{ word-break:break-all; word-wrap:break-word; }

.hairline-in-pseudo-top,
.hairline-in-pseudo-bottom,
.hairline-in-pseudo-left,
.hairline-in-pseudo-right,
.hairline-in-pseudo-fouredges{ position: relative; }
.hairline-in-pseudo-top:before{ content:" "; position: absolute; left:0; top:0; width:100%; height:0;-webkit-transform:scaleY(0.5); transform:scaleY(0.5); border-top:1px solid #E0E0E0; }
.hairline-in-pseudo-bottom:after{ content:" "; position: absolute; left:0; bottom:0; width:100%; height:0; -webkit-transform:scaleY(0.5); transform:scaleY(0.5);  border-bottom:1px solid #E0E0E0;}
.hairline-in-pseudo-left:before{ content:" "; position: absolute; left:0; top:0; width:0; height:100%; -webkit-transform:scaleX(0.5); transform:scaleX(0.5); border-left:1px solid #E0E0E0; }
.hairline-in-pseudo-right:after{ content:" "; position: absolute; right:0; top:0; width:0; height:100%;  -webkit-transform:scaleX(0.5); transform:scaleX(0.5); border-right:1px solid #E0E0E0; }
.hairline-in-pseudo-fouredges:after{ content:" "; position: absolute; left:0; top:0; width:200%; height:200%;  -webkit-transform:scale(0.5); transform:scale(0.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; border:1px solid #E0E0E0; }
.hairline-in-pseudo-top.dashed:before{ border-top-style: dashed; }
.hairline-in-pseudo-bottom.dashed:before{ border-bottom-style: dashed; }

.in-iphonex{
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}

.gray-page{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #F5F5F5;
    overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch;
}
.gray-page::-webkit-scrollbar-track-piece,
.gray-page::-webkit-scrollbar{ width: 0; height: 0; display: none;}


body{
    padding-top: 1.2rem !important;
    background-color: #EDF1F7;
}
.header-wrap{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 8px 16px 0px rgba(4,0,0,0.1);
}
.header{
    height: 1.2rem;
    padding: 0 .32rem;
}
.header .logo{
    width: 0.72rem;
    height: 0.72rem;
    margin-right: 0.4rem;
}
.header .nav{
    width: 25%;
    line-height: 1.2;
    text-align: center;
}
.nav:hover{
    cursor: pointer;
    color: #ED6D00;
}
.footer{
    font-size: .14rem;
    text-align: center;
    padding: .24rem .20rem;
    line-height: 2;
}
.white-wrap{
    background-color: #fff;
}
.orange-wrap{
    background-color: #FDF9F8;
}
.black-wrap{
    background-color: #0D0D0D;
}
.blue-wrap{
    background-color: #F7FAFF;
}
.gray-wrap{
    background-color: #BEB6AD;
}