/*!m4.css v4 author:cpbao.com*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
    margin:0;
    padding:0
}

button, input, optgroup, select, textarea{
    font-size:100%
}

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

fieldset, img{
    border:0
}

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

ol, ul{
    list-style:none
}

caption, th{
    text-align:left
}

h1, h2, h3, h4, h5, h6{
    font-size:100%;
    font-weight:500
}

a:hover{
    text-decoration:underline
}

ins, a{
    text-decoration:none
}

section, article, aside, header, footer, nav, dialog, figure{
    display:block
}

input[type="text"], input[type="number"], input[type="tel"], input[type="password"], input[type="submit"], input[type="rest"], input[type="button"], button, textarea{
    -webkit-border-radius:0;
    -webkit-appearance:none;
    -moz-appearance:none
}

audio, canvas, video{
    display:inline-block
}

a{
    color:#666;
    -webkit-tap-highlight-color:transparent
}

a:focus{
    outline:thin dotted #333;
    outline:5px auto -webkit-focus-ring-color;
    outline-offset:-2px
}

a:link{
    text-decoration:none
}

a img{
    border:0
}

img{
    max-width:100%;
    width:auto
}

html, body{
    min-height:100%;
    height:100%;
    position:relative
}

html{
    font-size:62.5%;
    -webkit-tap-highlight-color:transparent;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    -webkit-font-smoothing:antialiased
}

@media screen and (max-device-width:320px){
    html{
        font-size:42.667px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:321px) and (max-device-width:360px){
    html{
        font-size:48px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:361px) and (max-device-width:375px){
    html{
        font-size:50px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:376px) and (max-device-width:393px){
    html{
        font-size:52.4px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:394px) and (max-device-width:412px){
    html{
        font-size:54.93px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:413px) and (max-device-width:414px){
    html{
        font-size:55.2px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:415px) and (max-device-width:480px){
    html{
        font-size:64px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:481px) and (max-device-width:540px){
    html{
        font-size:72px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:541px) and (max-device-width:640px){
    html{
        font-size:85.33px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:641px) and (max-device-width:720px){
    html{
        font-size:96px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:721px) and (max-device-width:800px){
    html{
        font-size:106.667px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:801px) and (max-device-width:992px){
    html{
        font-size:132.267px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:993px) and (max-device-width:1080px){
    html{
        font-size:144px;
        font-size:-webkit-calc(13.33333333vw);
        font-size:-moz-calc(13.33333333vw);
        font-size:calc(13.33333333vw)
    }
}

@media screen and (min-device-width:1081px){
    html{
        font-size:144px
    }
}

body{
    background-color:#fff;
    font:14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, Noto Sans, sans-serif;
    color:#333;
    padding-bottom:constant(safe-area-inset-bottom);
    padding-bottom:env(safe-area-inset-bottom)
}

i.icon{
    display:inline-block;
    vertical-align:middle;
    background-size:100% auto;
    background-position:center;
    background-repeat:no-repeat;
    font-style:normal
}

i.icon.icon-back{
    width:.24rem;
    height:.4rem;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2012%2020'%3E%3Cpath%20d%3D'M10%2C0l2%2C2l-8%2C8l8%2C8l-2%2C2L0%2C10L10%2C0z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}

.nobar{
    padding-top:constant(safe-area-inset-top);
    padding-top:env(safe-area-inset-top)
}

.nobar .navbar{
    display:none
}

.nobar .navbar + .page{
    padding-top:0
}

.views, .view{
    width:100%;
    height:100%
}

.pages{
    overflow:hidden;
    width:100%;
    height:100%;
    position:relative;
    max-width:1080px;
    margin:0 auto
}

.navbar{
    height:.88rem;
    line-height:.88rem;
    position:absolute;
    top:0;
    background:#ff1d24;
    width:100%;
    z-index:2
}

.navbar h1{
    line-height:.88rem;
    text-align:center;
    width:100%;
    color:#fff;
    font-size:.36rem
}

.navbar a{
    height:100%;
    width:.8rem;
    text-align:center;
    display:block
}

.navbar > a{
    position:absolute;
    left:0;
    text-align:center
}

.navbar .left{
    position:absolute;
    left:0;
    top:0;
	width:.8rem;
}

.navbar .right{
    position:absolute;
    right:0;
    top:0
}

.navbar ~ .page .page-content{
    padding-top:.88rem
}

.page{
    position:relative;
    width:100%;
    height:100%;
    -webkit-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0)
}

.page-content{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    height:100%;
    overflow:auto;
    -webkit-overflow-scrolling:touch
}

.df{
    display:-webkit-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:flex
}

.fxw-w{
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap
}

.fxd-c{
    -webkit-box-orient:vertical;
    -webkit-flex-direction:column;
    flex-direction:column
}

.jc-fs{
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    -webkit-justify-content:flex-start;
    justify-content:flex-start
}

.jc-c{
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    -webkit-justify-content:center;
    justify-content:center
}

.jc-fe{
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    -webkit-justify-content:flex-end;
    justify-content:flex-end
}

.jc-sb{
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    -webkit-justify-content:space-between;
    justify-content:space-between
}

.jc-sa{
    -webkit-box-pack:space-around;
    -ms-flex-pack:space-around;
    -webkit-justify-content:space-around;
    justify-content:space-around
}

.ai-fs{
    -webkit-box-align:start;
    -ms-flex-align:start;
    -webkit-align-items:flex-start;
    align-items:flex-start
}

.ai-c{
    -webkit-box-align:center;
    -ms-flex-align:center;
    -webkit-align-items:center;
    align-items:center
}

.ai-fe{
    -webkit-box-align:end;
    -ms-flex-align:end;
    -webkit-align-items:flex-end;
    align-items:flex-end
}

.ai-s{
    -webkit-box-align:stretch;
    -ms-flex-align:stretch;
    -webkit-align-items:stretch;
    align-items:stretch
}

.ac-fs{
    -ms-flex-line-pack:flex-start;
    -webkit-align-content:flex-start;
    align-content:flex-start
}

.ac-c{
    -ms-flex-line-pack:center;
    -webkit-align-content:center;
    align-content:center
}

.ac-fe{
    -ms-flex-line-pack:flex-end;
    -webkit-align-content:flex-end;
    align-content:flex-end
}

.ac-sb{
    -ms-flex-line-pack:space-between;
    -webkit-align-content:space-between;
    align-content:space-between
}

.ac-sa{
    -ms-flex-line-pack:space-around;
    -webkit-align-content:space-around;
    align-content:space-around
}

.as-fs{
    -ms-flex-item-align:flex-start;
    -webkit-align-self:flex-start;
    align-self:flex-start
}

.as-c{
    -ms-flex-item-align:center;
    -webkit-align-self:center;
    align-self:center
}

.as-fe{
    -ms-flex-item-align:flex-end;
    -webkit-align-self:flex-end;
    align-self:flex-end
}

.as-s{
    -ms-flex-item-align:stretch;
    -webkit-align-self:stretch;
    align-self:stretch
}

.fx1{
    -moz-box-flex:1;
    -webkit-box-flex:1;
    box-flex:1;
    -moz-flex:1;
    -ms-flex:1;
    -webkit-flex:1;
    flex:1
}

.fx2{
    -moz-box-flex:2;
    -webkit-box-flex:2;
    box-flex:2;
    -moz-flex:2;
    -ms-flex:2;
    -webkit-flex:2;
    flex:2
}

@media screen and (min-device-width:768px) and (max-device-width:1080px){
    .navbar h1{
        font-size:.33231rem;
    }
}