html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; font-family: PingFangSC-Semibold, PingFang SC; vertical-align: baseline; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; } html{ font-size:62.5% } a[href^="javascript"] { -webkit-touch-callout: none; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ' '; content: none; } table { border-collapse: collapse; border-spacing: 0; } body { color:#353535; font: 13px/1.5 Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Noto Sans CJK SC, WenQuanYi Micro Hei, Arial, sans-serif; } h1, h2, h3, h4, h5, h6 { font-weight: normal; } input, button { outline: 0; outline: none; border: 0; background: rgba(0, 0, 0, 0); border-radius: 0px; } .none { display: none; } table { margin-left: 1px; } table td, table th { padding: 5px 10px; border: 1px solid #ccc; vertical-align: middle; } a { text-decoration: none; color: #444; } a:visited, a:hover { color: #444; } * { box-sizing: border-box; } /*层级关系 公共头部:3 内容:1 公共底部:3 搜索栏:2 全屏页:4 */ #app { /*position: absolute; width: 100%; height: 100%; overflow: hidden;*/ } #app.lock { position: absolute; width: 100%; height: 100%; overflow: hidden; } .outter { transition: 0.5s; position: absolute; top: 0; height: 100%; width: 100%; padding-bottom: 50px; /*overflow: hidden;*/ /*bottom: 0;*/ } /*iphonex 适配*/ .is-ipx .outter{ padding-bottom: 72px; } .is-ipx .doubleFooter .mt-footer-ct{ height: 52px !important; padding-bottom: 0 !important; bottom: 80px !important; } /*.outter.hideLeft::before { content: ""; z-index: 4; position: absolute; top: 0; width: 100%; bottom: 0; background: rgba(0, 0, 0, 0.3) }*/ .outter.hideLeft { opacity: 0.75; transform: translate3d(-100%, 0, 0); transition: 1.0s; overflow: hidden; } body { background: #FAFAFA;; color:#353535; font-size: 12px; } .icon-back{ position: absolute; width: 30px; height: 30px; top: 5px; left: 15px; } .icon-back:before { content: ""; position: absolute; width: 12px; height: 12px; -webkit-transform: rotate(315deg); transform: rotate(315deg); top: 8px; left: 7px; border: 1px solid #fff !important; border-width: 1px 0 0 1px !important; top: 50% !important; margin-top: -6px; } .app-header { /*position: absolute;*/ position: relative; transition: 0.3s; width: 100%; z-index: 3; height: 45px; line-height: 45px; font-size: 17px; background: linear-gradient(180deg, #303036, #3c3b40); color: #fff; text-align: center; } .app-header.header-hide { margin-top: -45px; } .app-content { /*overflow-x: hidden; overflow-y: auto;*/ z-index: 1; width: 100%; background: #f6f6f6; height:100%; } .app-footer { bottom: 0; left: 0 !important; width: 100%; position: fixed; z-index: 999; } .app-footer:not(:first-child)::before { content: ""; position: absolute; width: 200%; left: 0px; top: 0; transform: scale(.5); transform-origin: 0 0; -webkit-transform: scale(.5); -webkit-transform-origin: 0 0; background-color: #b7b7b7; height: 1px; z-index: 4; } .new-msg-count { position: absolute; font-style: normal; font-family: PingFang SC, Hiragino Sans GB, Arial, Microsoft YaHei, Helvetica; right: -9px; top: -5px; z-index: 2; padding: 0 4px; width: auto; min-width: 18px; height: 18px; line-height: 18px; border-radius: 9px; color: #fff; text-align: center; font-size: 14px; background-color: #f43531; } .new-msg-dot { position: absolute; right: -4px; top: -3px; width: 10px; height: 10px; z-index: 2; border-radius: 50%; color: #ffffff; text-align: center; background-color: red; background-color: #f43531; font-size: 0; } .sub-page { position: absolute; top: 0px; bottom: 0px; background: #f8f8f8; height: 100%; width: 100%; /* overflow: hidden; */ right: 0; left: 0; z-index: 5; } a { cursor: pointer; } .fl { float: left !important; } .fr { float: right !important; } .clearfloat:after { display: block; clear: both; content: ""; visibility: hidden; height: 0 } .clearfloat { zoom: 1 } /*border*/ /*底部 eee边框*/ .border-bottom-1 { position: relative; } .border-bottom-1:before { content: ''; width: 100%; height: 1px; background: #eee; position: absolute; left: 0; bottom: 0; transform: scale(1, .5); -webkit-transform: scale(1, .5); -o-transform: scale(1, .5); -moz-transform: scale(1, .5); z-index: 1; } /*底部 eee边框*/ .border-bottom-2 { position: relative; } .border-bottom-2:before { content: ''; width: 100%; height: 1px; background: #f6f6f6; position: absolute; left: 0; bottom: 0; transform: scale(1, .5); -webkit-transform: scale(1, .5); -o-transform: scale(1, .5); -moz-transform: scale(1, .5); z-index: 1; } /*顶部 eee边框*/ .border-top-1 { position: relative; } .border-top-1:before { content: ''; width: 100%; height: 1px; background: #eee; position: absolute; left: 0; top: 0; transform: scale(1, .5); -webkit-transform: scale(1, .5); -o-transform: scale(1, .5); -moz-transform: scale(1, .5); } /*顶部 #f6f6f6*/ .border-top-2 { position: relative; } .border-top-2:before { content: ''; width: 100%; height: 1px; background: #f6f6f6; position: absolute; left: 0; top: 0; transform: scale(1, .5); -webkit-transform: scale(1, .5); -o-transform: scale(1, .5); -moz-transform: scale(1, .5); } /*右边 eee边框*/ .border-right-1 { position: relative; } .border-right-1:before { content: ''; width: 1px; height: 100%; background: #eee; position: absolute; right: 0; top: 50%; transform: scale(0.5, 1) translate(0,-50%); -webkit-transform: scale(0.5, 1) translate(0,-50%); -o-transform: scale(0.5, 1) translate(0,-50%); -moz-transform: scale(0.5, 1) translate(0,-50%); z-index: 1; } /* 右边 aaa边框 */ .border-right-2 { position: relative; } .border-right-2:before { content: ''; width: 1px; height: 100%; background: #aaa; position: absolute; right: 0; top: 50%; transform: scale(0.5, 1) translate(0,-50%); -webkit-transform: scale(0.5, 1) translate(0,-50%); -o-transform: scale(0.5, 1) translate(0,-50%); -moz-transform: scale(0.5, 1) translate(0,-50%); z-index: 1; } /* 右边 f6f6f6边框 */ .border-right-3 { position: relative; } .border-right-3:before { content: ''; width: 1px; height: 100%; background: #f6f6f6; position: absolute; right: 0; top: 50%; transform: scale(0.5, 1) translate(0,-50%); -webkit-transform: scale(0.5, 1) translate(0,-50%); -o-transform: scale(0.5, 1) translate(0,-50%); -moz-transform: scale(0.5, 1) translate(0,-50%); z-index: 1; } /*font*/ .f12 { font-size: 12px !important; } .f14 { font-size: 14px !important; } .f16 { font-size: 16px !important; } .f18 { font-size: 18px !important; } .tl { text-align: left !important; } .tr { text-align: right !important; } .tc { text-align: center !important; } .gold { color: #ffae11 !important; } .black { color: #353535 !important; } .all-black{ color: #000000 !important; } .grey { color: #aaaaaa !important; } .line-gray { color: #888 !important; } .blue { color: #1690e0 !important; } .red { color: #f5222d !important; } .orange { color: #ff6a00 !important; } .bg-orange{ background-color: #ff6a00 !important; color: #fff !important; } .bg-grey{ background-color: #aaa !important; color: #fff !important; } .popup-content { width: 100%; background: #fff; min-height: 234px; } .grey-box{ background-color: #fff !important; color: #353535 !important; } .mt5 { margin-top: 5px !important; } .mb5 { margin-bottom: 5px !important; } .mt10{ margin-top: 10px !important; } .plr-20{ padding-left:20px !important; padding-right:20px !important; } .pl-20{ padding-left:20px !important; } .pr-20{ padding-left:20px !important; } .bold{ font-weight: 700; } .weight-default{ font-weight: 400 !important; } /*header里的icon*/ .default-shadow { -moz-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); } @media(max-width:360px){ .plr-20{ padding-left:15px !important; } } @media (min-width:360px) { html { font-size: 18px; } } @media (min-width:370px) { html { font-size: 18px; } } @media (min-width:384px) { html { font-size: 18px; } } @media (min-width:410px) { html { font-size: 20px; } } .is-ipx .home-wrap{ padding-bottom: 80px !important; } .is-ipx .car-wrap.noTab .mt-footer-ct{ height: 72px !important; padding-bottom: 20px !important; } /* 通用box */ .img-text{ display: flex; flex-direction: column; text-align: center; align-items: center; } .img-text p{ margin: 8px 0px 16px; font-size: 14px; white-space: nowrap; } .common-box{ padding:24px 16px; } .flex-row{ display:flex; flex-direction: row; } .blue-text{ color: #127BFF; font-size: 14px; } .card-icon{ width: 50px; height: 50px; border-radius: 100%; color:white; background-color: #127BFF; font-size: 16px; vertical-align: middle; text-align: center; margin-right: 14px; padding: 12px; }