#app {
    font-family: Avenir,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50
}

* {
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    font-family: San Francisco,Helvetica Neue,Arial,Segoe UI,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft Yahei,Microsoft JhengHei,Source Han Sans SC,Noto Sans CJK SC,Source Han Sans CN,Noto Sans SC,Source Han Sans TC,Noto Sans CJK TC,WenQuanYi Micro Hei,驿微米黑,SimSun,sans-serif
}

.scrollBox::-webkit-scrollbar {
    display: none
}

body {
    max-width: 650px;
    margin: 0 auto!important;
    min-width: 320px;
    background: #f7f7f7
}

@media only screen and (min-width: 650px) {
    html {
        font-size:30px!important
    }

    .mint-popup .mint-popup-bottom {
        max-width: 650px
    }
}

@media only screen and (max-width: 650px) {
    .mint-popup .mint-popup-bottom {
        max-width:650px
    }
}

@media screen and (min-width: 650px) {
    /*.unitsummary-nav {*/
    /*    max-width:650px;*/
    /*    left: 50%!important;*/
    /*    margin-left: -325px*/
    /*}*/

    /*.mint-popup-bottom {*/
    /*    max-width: 650px*/
    /*}*/

    /*.search-tab dl dd {*/
    /*    white-space: pre-line!important*/
    /*}*/
    
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
button {
    outline: none;
    border: none
}

button[disabled] {
    background: #eee!important;
    color: #333!important;
    cursor: not-allowed!important
}

input {
    background: none
}

input.error {
    border: 1px solid red
}

.error {
    color: #fff8dc
}

a {
    vertical-align: baseline;
    text-decoration: none;
    cursor: pointer
}

ul li {
    list-style: none
}

em,i {
    font-style: normal
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 400
}

select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none
}

input::-webkit-input-placeholder {
    color: #ccc
}

.mt5 {
    margin-top: .25rem
}

.mt10 {
    margin-top: .5rem
}

.f-r {
    float: right
}

.f-l {
    float: left
}

.f-n {
    overflow: hidden
}

.text-l {
    text-align: left!important
}

.text-c {
    text-align: center!important
}

.text-r {
    text-align: right!important
}

.vertical {
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%)
}

.ellipsis_two {
    -webkit-line-clamp: 2;
    -moz-line-clamp: 2
}

.ellipsis_one,.ellipsis_two {
    overflow: hidden;
    /*display: -webkit-box;*/
    /*display: -moz-box;*/
    -webkit-box-orient: vertical;
    word-break: break-all
}

.ellipsis_one {
    -webkit-line-clamp: 1;
    -moz-line-clamp: 1
}

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

.flex_inside {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.videoback {
    max-width: 650px
}

.blian22 {
    height: 2.2rem
}

.blian5 {
    height: 2.6rem
}

.blian52 {
    height: 5.2rem
}

footer {
    position: fixed;
    bottom: 0;
    z-index: 3;
    max-width: 650px;
    width: 100%;
    border-top: 1px solid #dcdcdc;
    background: #fff
}

footer ul {
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: flex!important;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

footer ul li {
    -webkit-box-flex: 1;
    width: auto!important;
    -ms-flex: 1;
    flex: 1;
    width: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%;
    text-align: center
}

footer ul li a {
    display: block;
    text-align: center;
    font-size: .7rem;
    color: #666;
    margin-top: .2rem
}

footer ul li p {
    line-height: normal;
    margin: 0;
    font-size: .7rem
}

footer ul li span {
    display: block;
    margin: 0 auto
}

footer ul li img,footer ul li span {
    height: 1.3rem;
    width: 1.3rem
}

footer ul li a img.exact_on {
    display: none
}

footer ul li a.router-link-exact-active img.exact_on {
    display: block
}

footer ul li a.router-link-exact-active img.exact {
    display: none
}

.container {
    /*padding: 0 .75rem*/
}

.mt5 {
    padding: 0.35rem
}

.mt5 .demand-cont {
    padding: 0rem
}

.container,.home-header {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #f5f5f5;
    padding: 10px;

}

.home-header {
    display: table;
    max-width: 605px;
    padding: .45rem .75rem;
    z-index: 2;
    position: fixed;
    top: 0;
    background: #fff
}

.home-header .head-left {
    float: left;
    height: 1.3rem;
    line-height: 1.3rem;
    border-radius: 5px;
    width: 100%
}

.home-header .head-left span {
    font-size: .65rem;
    font-weight: 700;
    color: #303030
}

.home-header .head-left img {
    float: left;
    width: 1rem;
    height: 1rem;
    margin: .25rem .3rem 0 0
}

.home-header .head-right {
    float: right;
    height: 1.3rem
}

.home-header .head-right img {
    width: 1rem;
    height: 1rem;
    margin-top: .25rem
}

.swiper img {
    width: 100%;
    height: 100%
}

.nav {
    background: #fff;
    border-radius: 0.3rem;
    display: table;
    width: 100%;
    margin: 1rem 0 1.25rem
}

.nav ul li {
    width: 25%;
    text-align: center;
    float: left;
    padding: .5rem 0 .5rem 0;
    border-radius: .25rem
}

.nav ul li span {
    width: 2.2rem;
    height: 2.2rem
}

.nav ul li span img {
    width: 2.1rem;
    height: 2.1rem
}

.nav ul li p {
    font-size: .6rem;
    color: #303030;
    margin-top: .35rem
}

.home-cont:nth-child(n+10) {
    display: none
}

.home-cont {
    background: #fff;
    border-radius: 0.3rem;
    display: table;
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 1rem
}

.home-cont h3 {
    font-size: .9rem;
    color: #303030;
    font-weight: 700;
    text-align: left;
    margin-bottom: .75rem;
    margin-left: 1rem;
    margin-top: 0.5rem
}

.home-cont ul li {
    position: relative;
    margin: 1%;
}

.home-cont ul .showImg {
    height: 4.6rem
}

.home-cont ul li img {
    display: table
}

.incrementImg {
    width: 100%;
    margin-top: 1px
}

.hearImg {
    width: 100%;
    height: 100%
}

.home-cont ul li h4 {
    font-size: .7rem;
    color: #333
}

.books-list ul li {
    display: table;
    width: 100%;
    padding: .75rem 0;
    border-bottom: 1px solid #eee
}

.books-list ul li .left {
    width: 4rem;
    height: 5.3rem;
    float: left;
    margin-right: .5rem
}

.books-list ul li .left img {
    width: 4rem;
    height: 5.3rem;
    border-radius: 3px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 3px solid #eeeeed
}

.books-list ul li .right {
    height: 5.3rem;
    text-align: left;
    font-size: .8rem;
    color: #333;
    Justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box
}

.search-tab {
    margin-top: .75rem;
    border-bottom: .01rem solid #f7f7f7
}

.search-tab dl {
    display: table;
    width: 100%;
    margin-bottom: .5rem;
    line-height: 1.3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: .7rem;
    color: #232323
}

.search-tab dl dt {
    float: left
}

.search-tab dl dd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    white-space: nowrap;
    overflow: auto
}

.search-tab dl dd::-webkit-scrollbar {
    display: none
}

.search-tab dl dd span {
    margin-top: .03rem;
    display: inline-block;
    margin-bottom: .25rem;
    text-align: center;
    height: 1.3rem;
    line-height: 1.3rem;
    border-radius: 5px;
    padding: 0 .2rem;
    margin-right: .5rem;
    min-width: 2.6rem
}

.search-tab dl dd span.active {
    background: #40a5ff;
    color: #fff
}

.down-list {
    margin-top: .75rem
}

.down-list ul li {
    display: table;
    width: 100%;
    padding: .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1.5rem;
    margin-bottom: .25rem;
    background: #f7f7f7
}

.down-list ul li .zip {
    width: 1.5rem;
    height: 1.5rem;
    float: left;
    margin-right: .5rem
}

.down-list ul li span {
    font-size: .7rem;
    color: #232323;
    font-weight: 700;
    float: left;
    width: 93%;
    text-align: left
}

.down-list ul li .down {
    float: right;
    width: 1rem;
    height: 1rem;
    margin-top: .25rem
}

.user_head_infor {
    display: table;
    width: 100%;
    padding: 1rem .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    box-shadow: 0 0 7px 0 rgba(0,0,0,.1);
    margin-top: 10px;
    -webkit-box-shadow: 0 0 7px 0 rgba(0,0,0,.1);
    background: #fff
}

.user_head_infor .head_img {
    width: 3rem;
    height: 3rem;
    overflow: hidden;
    border-radius: 50px;
    float: left;
    margin-right: .5rem
}

.user_head_infor .head_img img {
    width: 3rem;
    height: 3rem
}

.user_infor {
    color: #2c2c2c;
    float: left;
    text-align: left
}

.user_infor .name {
    font-size: .9rem;
    font-weight: 700;
    margin: .5rem 0;
    height: 1rem;
    line-height: 1rem
}

.user_infor p {
    color: #555;
    font-size: .6rem;
    height: .6rem;
    line-height: .6rem
}

.user_right {
    float: right
}

.user_right img {
    width: .3rem;
    height: .5rem;
    margin-top: 1.25rem
}

.user-list {
    margin-top: 1rem;
    box-shadow: 0 0 7px 0 rgba(0,0,0,.1);
    -webkit-box-shadow: 0 0 7px 0 rgba(0,0,0,.1)
}

.user-list ul li {
    display: table;
    width: 100%;
    padding: 1rem .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1rem;
    border-bottom: 0.2rem solid #eee
}

.user-list ul {
    background: #fff
}

.user-list ul li .icon {
    width: 1rem;
    height: 1rem;
    float: left;
    margin-right: .3rem
}

.user-list ul li:first-child {
    display: none
}

.user-list ul li a {
    display: block;
    overflow: hidden
}

.user-list ul li span {
    font-size: .7rem;
    color: #333;
    font-weight: 700;
    float: left;
    width: 70%;
    text-align: left
}

.user-list ul li .right {
    float: right;
    width: .3rem;
    height: .5rem;
    margin-top: .25rem
}

.grade-list h3 {
    font-size: .8rem;
    color: #333;
    font-weight: 700;
    width: 100%;
    text-align: center;
    padding: 1.25rem 0
}

.grade-list .listcont {
    padding: 0 1rem;
    overflow: hidden
}

.grade-list .listcont.w33 span {
    width: 33.3%;
    float: left;
    text-align: center
}

.grade-list .listcont.w50 span {
    width: 50%;
    float: left;
    text-align: center
}

.grade-list .listcont span {
    font-size: .7rem;
    color: #333;
    margin-bottom: 1.5rem
}

.grade-list .listcont span img {
    width: .75rem;
    height: .75rem;
    margin-right: .25rem
}

.downImg {
    width: 16px;
    height: 16px;
    margin-top: 5px;
    margin-left: 8px
}

.commonbtn {
    background: #40a5ff;
    width: 100%;
    height: 2.2rem;
    line-height: 2.2rem;
    text-align: center;
    font-size: .8rem;
    color: #fff;
    font-weight: 700;
    border-radius: 5px;
    margin-top: 3rem
}

.message-list ul li {
    display: table;
    width: 100%;
    padding: .75rem 0
}

.message-list ul li h3 {
    font-size: .7rem;
    color: #333;
    margin-bottom: .75rem
}

.message-list ul li p {
    font-size: .6rem;
    color: #999
}

.home-list {
    display: table;
    width: 100%;
}

.home-list ul {
    overflow: hidden
}

.home-list ul li {
    width: 32%;
    float: left;
    margin-bottom: .75rem;
    text-align: center
}

/*li:nth-child(3n+1) {*/
/*    margin-left: calc(4%/2);*/
/*}*/
/*li:nth-child(3n) {*/
/*    margin-right:calc(4%/2);*/
/*}*/

.home-list ul li img {
    border-radius: 5px;
    /*height: 120px;*/
    border: 3px solid #eeeeed;
    -o-object-fit: cover;
    object-fit: cover;
    /*width: 85%;*/
    height: 9rem;
    /*max-width: 100%*/
}

.home-list ul li p {
    font-size: 12px;
    color: #232323;
    min-height: 36px
}

.conthead {
    overflow: hidden;
    width: 100%;
    padding: .75rem 0
}

.conthead .left {
    width: 5.25rem;
    height: 7rem;
    margin-right: .5rem
}

.conthead .left img {
    width: 5.25rem;
    border-radius: 5px;
    -o-object-fit: cover;
    object-fit: cover;
    height: 7rem;
    border: 3px solid #eeeeed
}

.conthead .right {
    position: relative;
    height: 7rem
}

.conthead .right h3 {
    font-size: .8rem;
    font-weight: 700;
    color: #333;
    margin: .5rem 0
}

.conthead .right button {
    position: absolute;
    background: #40a5ff;
    width: 4.5rem;
    height: 1.5rem;
    text-align: center;
    line-height: 1.5rem;
    font-size: .65rem;
    color: #fff;
    border-radius: 5px;
    bottom: .2rem
}

.demand-cont {
    padding: 0 .35rem .35rem;
    -webkit-animation-duration: .75rem;
    animation-duration: .75rem
}

.demand-cont .title {
    font-size: .9rem;
    font-weight: 700;
    color: #232323;
    padding: .35rem 0 .35rem .3rem;
    background-color: #fff
}

.directory {
    padding-top: .75rem
}

.directory ul li {
    background-color: #fff;
    padding: 0 .3rem;
    line-height: 2.5rem;
    overflow: hidden;
    margin-bottom: .25rem
}

.directory ul li:last-child {
    margin-bottom: 0
}

.directory ul li a {
    display: block;
    overflow: hidden
}

.directory ul li span {
    float: left;
    font-size: .7rem;
    font-weight: 700;
    color: #555
}

.directory ul li .imgl {
    float: left;
    width: .8rem;
    margin-top: .8rem;
    margin-right: .2rem
}

.directory ul li .rotates {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.unitsummary-nav {
    overflow: hidden;
    height: 2.5rem;
    line-height: 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #f7f7f7;
    position: fixed;
    width: 100%;
    background-color: #fff;
    /*left: 0;*/
    z-index: 2;
    /*border-top: .25rem solid #f7f7f7*/
}

.unitsummary-nav span {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: .65rem;
    color: #232323;
    font-weight: 700;
    position: relative;
    text-align: center
}

.unitsummary-nav span.active {
    color: #399ff4
}

.unitsummary-nav span.active:after {
    content: "";
    width: 100%;
    height: 2px;
    background: #399ff4;
    position: absolute;
    bottom: 0;
    left: 0
}

.unitsummary-list {
    padding-top: 2.5rem;
    min-height: calc(100vh - 5rem)
}

.unitsummary-list .list {
    overflow: hidden;
    width: 100%;
    padding: .75rem;
    border-bottom: 1px solid #eee;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.unitsummary-list .active {
    border-bottom: 1px solid #40a5ff!important;
    border-top: 1px solid #40a5ff!important
}

.unitsummary-list .list:last-child {
    border-bottom: none
}

.unitsummary-list .list .left {
    width: 2rem;
    height: 2rem;
    margin-right: .5rem;
    text-align: center
}

.unitsummary-list .list .left img {
    width: 100%;
    height: 100%
}

.unitsummary-list .list .right {
    position: relative;
    height: 2rem
}

.unitsummary-list .list .lh {
    line-height: 2rem
}

.unitsummary-list .list .right h3 {
    font-size: .7rem;
    color: #333
}

.unitsummary-list .list .lh h3 {
    margin-top: 0
}

.unitsummary-list .list .right .us-bottom {
    position: absolute;
    left: 0
}

.unitsummary-list .list .right .us-bottom span {
    float: left;
    margin-right: 1.4rem;
    height: 1rem
}

.unitsummary-list .list .right .us-bottom span img {
    width: .663rem;
    height: .663rem;
    float: left
}

.unitsummary-list .list .right .us-bottom span em {
    float: left;
    color: #555;
    font-size: .65rem;
    margin: 0 0 0 .2rem
}

.activity {
    overflow: hidden;
    margin-top: .25rem
}

.activity .activity-list img {
    width: 100%;
    height: 10rem
}

.downcont-head {
    overflow: hidden;
    margin: .5rem 0 .75rem
}

.downcont-head img {
    width: 100%
}

.downcont-head button {
    height: 2rem;
    line-height: 2rem;
    background: #40a5ff;
    font-size: .7rem;
    font-weight: 700;
    color: #fff;
    width: 100%;
    text-align: center;
    border-radius: 5px;
    margin-top: .5rem
}

.downcont-main h3 {
    font-size: .9rem;
    font-weight: 700;
    color: #232323;
    /*padding: .75rem 0*/
    padding-bottom:.75rem ;
}

.downcont-main p {
    font-size: .7rem;
    color: #666
}

.downcont-main button {
    height: 1.8rem;
    line-height: 1.8rem;
    text-align: center;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #40a5ff;
    color: #40a5ff;
    font-size: .7rem;
    background: #fff;
    margin-top: 1rem;
    margin-bottom: .75rem
}

.dcm-img {
    display: table;
    width: auto;
    margin: 1rem auto
}

.dcm-img img {
    float: left
}

.dcm-img .imgleft,.dcm-img .imgright {
    width: 2.5rem;
    height: 2.5rem
}

.dcm-img .imgcent {
    width: 4.2rem;
    height: .15rem;
    margin: 1.175rem .75rem
}

.dcm-http {
    overflow: hidden;
    margin: .75rem 0
}

.dcm-http .http {
    margin-right: .5rem;
    border: 1px solid #ddd;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 0 .5rem;
    color: #40a5ff
}

.dcm-http .copy,.dcm-http .http {
    height: 1.8rem;
    line-height: 1.8rem;
    font-size: .7rem
}

.dcm-http .copy {
    background: #40a5ff;
    border-radius: 5px;
    width: 7rem;
    text-align: center;
    color: #fff
}

.instructions {
    padding: .75rem;
    width: 100%;
    font-size: .65rem;
    color: #999;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.instructions h3 {
    margin-bottom: .5rem
}

.instructions p {
    margin-bottom: 1rem
}

.instructions p:last-child {
    margin-bottom: 0
}

.account-list {
    margin-top: .25rem
}

.account-list ul li {
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: .75rem;
    color: #222;
    background: #fff;
    padding: 0 .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1px
}

.account-list ul li:last-child {
    margin-bottom: 0
}

.account-list ul li a {
    color: #222;
    display: block;
    overflow: hidden
}

.account-list ul li span {
    color: #222;
    float: left
}

.account-list ul li .alright {
    float: right
}

.account-list ul li .alright em {
    float: left;
    color: #666;
    font-size: .7rem;
    position: relative
}

.account-list ul li .alright select {
    float: left;
    border: none;
    outline: none;
    height: 2.5rem;
    line-height: 2.5rem;
    background-color: #fff
}

.account-list ul li.person_head {
    height: 3rem;
    line-height: 3rem
}

.account-list ul li.person_head .alright {
    margin-top: .4rem;
    height: 2.2rem
}

.account-list ul li.person_head .alright em img {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 5px
}

.account-list ul li .rightImg {
    width: .3rem;
    height: .45rem;
    float: left;
    margin-top: 1rem;
    margin-left: .5rem
}

.account-list ul li input {
    font-size: .7rem;
    color: #666;
    text-align: right;
    background: none;
    border: none;
    outline: none;
    float: left;
    height: 1rem;
    margin-top: .75rem
}

.account-list .textarea {
    width: 100%;
    font-size: .7rem;
    padding: .5rem .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
    margin-top: -1px
}

.account-list .textarea textarea {
    width: 100%;
    border: none;
    outline: none;
    font-size: .7rem
}

.address-main {
    margin-top: .25rem
}

.address-infor {
    margin-bottom: .25rem;
    background: #fff
}

.address-infor .address-name {
    padding: .75rem;
    overflow: hidden
}

.address-infor .address-name span {
    font-size: .6rem;
    color: #555;
    float: left;
    line-height: 1rem
}

.address-infor .address-name span:first-child {
    font-size: .75rem;
    color: #171717;
    margin-right: .75rem
}

.address-infor .address-name img {
    float: right;
    width: 1rem;
    height: .85rem
}

.address-infor p {
    line-height: 1rem;
    padding: 0 .75rem .75rem .75rem;
    font-size: .6rem;
    color: #333
}

.cont_foot_btn {
    height: 2.2rem;
    line-height: 2.2rem;
    text-align: center;
    width: 100%;
    padding: 0 .75rem;
    margin: 1.25rem 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: fixed;
    bottom: 0;
    max-width: 640px
}

.cont_foot_btn a {
    display: block;
    border-radius: 5px;
    background: #40a5ff;
    color: #fff;
    font-size: .8rem;
    width: 100%
}

.popmask {
    top: 2.2rem
}

.popmask,.popmaskcode {
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    position: fixed;
    z-index: 97;
    width: 100%;
    background: rgba(0,0,0,.4);
    overflow: hidden
}

.popmaskcode {
    top: 0
}

.sh_city {
    border-radius: 5px 5px 0 0;
    background: #fff;
    width: 100%;
    left: 0;
    height: 60%;
    position: fixed;
    z-index: 99;
    bottom: 0
}

.sh_city h3 {
    text-align: left;
    padding: 0 .75rem;
    height: 2rem;
    line-height: 2rem;
    font-size: .8rem;
    color: #333
}

.sh_city #sh_cancel {
    position: absolute;
    right: .5rem;
    top: .6rem
}

.sh_city #sh_cancel,.sh_city #sh_cancel img {
    float: right;
    width: .8rem;
    height: .8rem
}

.sh_city>ul {
    height: 10%;
    line-height: 10%;
    padding: 0 .8rem
}

.sh_city>ul li {
    float: left;
    margin-right: 1rem;
    font-size: .75rem;
    line-height: 2.1rem;
    height: 100%;
    position: relative
}

.sh_city>ul li.on:after {
    content: "";
    position: absolute;
    bottom: 0;
    width: .8rem;
    height: 2px;
    background: #3674ff;
    left: 50%;
    margin-left: -.4rem
}

.city_proj_list {
    overflow-x: auto;
    height: 89%;
    margin-top: 1%
}

.provinces ul {
    padding: 0 .8rem;
    margin-bottom: 2rem
}

.provinces ul li {
    height: 2rem;
    line-height: 2rem;
    width: 100%;
    font-size: .65rem;
    position: relative
}

.provinces ul li.on {
    color: #3674ff
}

.record-list ul li {
    width: 100%;
    font-size: .7rem;
    color: #232323;
    padding: .8rem .75rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1px;
    background: #fff;
    overflow: hidden
}

.record-list ul li span.text-l {
    width: 40%
}

.record-list ul li span.text-c {
    width: 20%
}

.record-list ul li span {
    float: left
}

.record-list ul li span a {
    color: #3674ff
}

.recordcont {
    padding: 1rem .75rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
    margin-bottom: .25rem
}

.recordcont .title em {
    width: .2rem;
    height: 1rem;
    border-radius: 20px;
    background: #3674ff;
    margin: 0 .5rem 0 -.25rem;
    float: left
}

.recordcont .title {
    font-size: .8rem;
    font-weight: 700;
    color: #191c23;
    line-height: 1rem;
    margin: 0 0 .5rem 0
}

.recordcont .title span {
    float: right;
    color: #ff4200
}

.recordcont .prompt {
    color: #999;
    font-size: .6rem;
    margin-bottom: .75rem
}

.recordcont-books {
    margin-top: 1px
}

.recordcont-books ul li {
    margin-bottom: .5rem;
    background: #f7f7f7;
    border-radius: 5px;
    padding: .7rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: .75rem;
    color: #232323
}

.recordcont-books ul li h3 {
    height: 2rem;
    line-height: 1rem;
    margin-bottom: 1rem;
    font-size: .75rem
}

.recordcont-books ul li:last-child {
    margin-bottom: 0
}

.recordcont-evidence {
    overflow: hidden
}

.recordcont-evidence img,.recordcont-evidence span {
    width: 5rem;
    height: 5rem;
    border-radius: 5px;
    float: left;
    margin: 0 .5rem .5rem 0
}

.recordcont-evidence span {
    position: relative;
    background: #f7f7f7
}

.recordcont-evidence span img {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
    float: none;
    position: absolute
}

.recordcont-mail {
    background: #f7f7f7;
    border-radius: 5px;
    padding: .7rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: .75rem;
    color: #232323
}

.recordcont-mail p {
    margin-bottom: .75rem;
    line-height: 1rem
}

.recordcont-mail p:last-child {
    margin-bottom: 0
}

.recordcont-audit {
    font-size: .7rem;
    color: #666;
    margin: .75rem 0
}

.bottom-audit {
    font-size: .8rem;
    font-weight: 700;
    padding: 0 .75rem;
    text-align: right;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 3rem;
    line-height: 3rem
}

.color-54CD5A {
    color: #54cd5a!important
}

.color-FFAE00 {
    color: #ffae00!important
}

.color-3674FF {
    color: #3674ff!important
}

.recordedit {
    position: relative
}

.recordedit .delImg {
    position: absolute;
    right: -.3rem;
    top: -.5rem;
    width: 1rem;
    height: 1rem
}

.recordedit .recordcont-mail {
    margin-bottom: .5rem
}

.recordcont-mail span {
    float: right;
    color: #ccc;
    width: 80%;
    text-align: right
}

.recordcont-mail span.select:after {
    content: "";
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKCAYAAAC9vt6cAAAAXElEQVQoU2NkoBAwUqifAW6AlpYWz8+fPz+TaiDcAGVlZUcGBoZ9ZBsA0qisrPyfIgPIMQRrIBLrkv///1fijAVChoA037t3rwNvNOIyBKYZ5GWC6QDdEGTNIAMAPbsliSmDrhkAAAAASUVORK5CYII=);
    width: .4rem;
    height: .25rem;
    margin-left: .2rem;
    background-size: 100%;
    float: right;
    margin-top: .4rem
}

.recordcont-mail span input,.recordcont-mail span select {
    background: none;
    border: none;
    outline: none;
    text-align: right;
    height: 1rem;
    line-height: 1rem;
    font-size: .75rem
}

.recordcont-mail span input {
    margin-right: .25rem
}

.recordcont-mail span img {
    width: .4rem;
    height: .25rem;
    margin-left: .2rem;
    float: right;
    margin-top: .4rem
}

.addbooks {
    width: 6.5rem;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    border-radius: 20px;
    font-size: .75rem;
    color: #999;
    margin-top: 1.2rem;
    background: #f4f4f4
}

.video-js {
    width: 100%;
    height: 13rem
}

.videomain {
    background: #fff
}

.videomain .title {
    padding: .75rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden
}

.videomain .title h3 {
    font-size: .8rem;
    color: #333;
    font-weight: 700;
    float: left;
    width: 80%
}

.videomain .title img {
    width: 1rem;
    height: 1rem;
    float: right;
    margin-top: -.1rem;
    padding-right: .2rem
}

.qrcode-cont {
    background: #fff;
    border-radius: 5px;
    position: fixed;
    z-index: 100;
    width: 80%;
    text-align: center;
    padding: 1rem 0
}

.qrcode-cont .codeclose {
    position: absolute;
    right: .5rem;
    top: .5rem
}

.qrcode-cont .codeclose img {
    width: 1rem;
    height: 1rem
}

.qrcode-cont h3 {
    font-size: .8rem;
    color: #232323;
    font-weight: 700
}

.qrcode-cont .codeImg {
    margin: 1rem auto
}

.qrcode-cont .codeImg,.qrcode-cont .codeImg img {
    width: 5.5rem;
    height: 5.5rem
}

.qrcode-cont p {
    font-size: .65rem;
    color: #999
}

.audioInfo {
    margin: 0 auto;
    text-align: center
}

.audioInfo img {
    width: 10rem
}

.audioInfo div {
    font-size: .8rem;
    font-weight: 700;
    color: #333;
    margin-top: 1.3rem
}

.progress {
    padding: 0 1.1rem;
    margin-top: 1rem
}

.progress span {
    font-size: .6rem
}

.audioOption {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1rem;
    padding-bottom: .5rem
}

.audioOption div {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center
}

.audioOption img {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: middle
}

.bottomOption {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    background-color: #fff
}

.bottomOption div {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center;
    margin-top: .2rem
}

.bottomOption div img {
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem
}
