@media screen and (max-width: 320px) {
    html {
        font-size: 45.66px;
    }
}

@media screen and (min-width: 320px) {
    html {
        font-size: 45.66px;
    }
}

@media screen and (min-width: 360px) {
    html {
        font-size: 48px;
    }
}

@media screen and (min-width: 375px) {
    html {
        font-size: 50px;
    }
}

@media screen and (min-width: 400px) {
    html {
        font-size: 53.33px;
    }
}

@media screen and (min-width: 414px) {
    html {
        font-size: 55.19px;
    }
}

@media screen and (min-width: 440px) {
    html {
        font-size: 58.66px;
    }
}

@media screen and (min-width: 480px) {
    html {
        font-size: 64px;
    }
}

@media screen and (min-width: 520px) {
    html {
        font-size: 69.33px;
    }
}

@media screen and (min-width: 560px) {
    html {
        font-size: 74.66px;
    }
}

@media screen and (min-width: 600px) {
    html {
        font-size: 80px;
    }
}

@media screen and (min-width: 640px) {
    html {
        font-size: 85.33px;
    }
}

@media screen and (min-width: 680px) {
    html {
        font-size: 90.66px;
    }
}

@media screen and (min-width: 720px) {
    html {
        font-size: 96px;
    }
}

@media screen and (min-width: 750px) {
    html {
        font-size: 100px;
    }
}



* {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

li {
    list-style: none;
}

i {
    font-style: normal;
}

body {
    background-color: #ddd;
}

a.expect {
    position: relative;
    color: #888;
}

a.expect>img {
    width: .6rem;
    position: absolute;
    left: 0.4rem;
    top: -0.1rem;
}

a.expect>div {
    width: .9rem;
    text-align: center;
    color: #fff;
    height: .4rem;
    line-height: .3rem;
    position: absolute;
    left: 50%;
    top: -0.12rem;
    background-image: url(../img/expect1.png);
    background-size: 100% 100%;
    font-size: .1rem;
}

.share {
    position: fixed;
    right: 0;
    top: 80%;
    width: 2.4rem;
    height: .74rem;
    line-height: .74rem;
    border-radius: .37rem 0 0 .37rem;
    background: linear-gradient(-90deg, rgba(230, 39, 39, 1) 0%, rgba(237, 23, 23, 1) 100%);
    box-shadow: 0 .1rem .2rem 0 rgba(234, 31, 31, 0.5);
    z-index: 99;
    cursor: pointer;
    font-size: .24rem;
    color: #fff;
    text-indent: 2.8em;
}

.share::before {
    content: "";
    position: absolute;
    width: 0.4rem;
    height: 0.4rem;
    background: url(../img/share.png);
    background-size: 100%;
    top: 50%;
    transform: translateY(-50%);
    left: 8%;
}

.mShare {
    background-color: rgba(0, 0, 0, .8);
    position: fixed;
    width: 100%;
    height: 1000px;
    z-index: 20000;
}

.mShare img {
    position: absolute;
    top: .16rem;
    right: .42rem;
    width: 1.53rem;
    height: 1.62rem;
}

.mShare p {
    font-size: .24rem;
    color: #fff;
    position: absolute;
    top: 1.66rem;
    right: 1.57rem;
}

.pcShare {
    background-color: rgba(0, 0, 0, .8);
    position: fixed;
    width: 100%;
    height: 1000px;
    z-index: 20000;
}

.pcShare div {
    position: absolute;
    top: 20%;
    right: 50%;
    transform: translate(50%);
    width: 3rem;
    height: 3rem;
    text-align: center;
}

.pcShare div img {
    width: 100%;
    height: 100%;
}

.pcShare div::before {
    cursor: pointer;
    content: "";
    position: absolute;
    width: 0.4rem;
    height: 0.4rem;
    background-image: url(../img/sy_cont_icon6.png);
    top: 0;
    right: 0;
    transform: translate(0, -125%);

}

.pcShare p {
    box-sizing: border-box;
    padding-top: .1rem;
    width: 3rem;
    line-height: .25rem;
    height: .7rem;
    border-radius: .35rem;
    background: rgba(0, 0, 0, .9);
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%);
    color: #fff;
    font-size: .18rem;
    text-align: center;
}

.hide {
    display: none;
}

.tool {
    padding: .18rem;
    font-size: .2rem;
    width: 1.2rem;
    z-index: 1000;
}

.tool .info {

    margin-top: .2rem;
    width: 1rem;
    height: 0.3rem;
    background-color: #1173F4;
    color: #fff;
    text-align: center;
}

.banner {
    box-sizing: border-box;
    margin: 0 auto;
    width: 7.5rem;
    height: 3rem;
    background: url(../img/banner.png);
    background-size: 100% 100%;
    padding: .2rem .2rem 0;
    color: #fff;
}

.banner .logo {
    display: block;
    width: 2.5rem;
    height: 0.5rem;
    margin-top: .1rem;
}

.banner p {
    /* transform: translateY(-.2rem); */
    font-size: .2rem;
    color: #78AAED;
}

main {
    box-sizing: border-box;
    width: 7.5rem;
    background-color: #eee;
    margin: 0 auto;
    padding: 0 .2rem;
}

main>div {
    background-color: #fff;
    margin-bottom: .2rem;
    border-radius: .1rem;
}

main .subtitle {
    /* color: #1173F4; */
    font-size: .3rem;
    font-weight: bold;
    height: .8rem;
    line-height: .78rem;
    position: relative;
    text-indent: .5em;
}

main .subtitle>i {
    width: 0.06rem;
    height: .3rem;
    background-color: #1173F4;
    position: absolute;
    left: 0;
    top: .25rem;

}

main>.publish::before {
    content: "";
    position: absolute;
    width: 0.21rem;
    height: 0.28rem;
    left: .2rem;
    top: .26rem;
    background: url(../img/trumpet.png) no-repeat;
    background-size: 100% 100%;
}

main>.publish {
    position: relative;
    height: .8rem;
    padding: 0 1.9rem 0 .5rem;
    background-color: #eee;
    margin: 0;
    box-sizing: border-box;
    margin-left: -.2rem;
    margin-right: -.2rem;
    /* width: 7.5rem; */
}

main>.publish>.button {
    height: .4rem;
    line-height: .4rem;
    font-size: .20rem;
    border-radius: .1rem;
    font-weight: normal;
    background-color: #1173F4;
    color: #fff;
    text-decoration: none;
    width: 1.2rem;
    text-align: center;
    position: absolute;
    right: .2rem;
    top: 50%;
    transform: translateY(-50%);
}

main>.publish .frame {
    overflow: hidden;
    width: 5.5rem;
    height: .4rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

main>.publish li {
    height: 0.4rem;
    line-height: 0.4rem;
}

main>.publish a {
    color: #333;
    display: block;
    font-size: .20rem;
    height: .4rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

main>nav.fixed {
    position: fixed;
    top: 0;
    z-index: 98;
    margin-bottom: .7rem;
}

main>.navFixed {
    background-color: #fff;
    height: .7rem;
    box-sizing: border-box;
    margin: 0 -.2rem;
    padding: 0;
    width: 7.5rem;
}

main>nav {
    background-color: #fff;
    height: .7rem;
    box-sizing: border-box;
    margin: 0 -.2rem;
    padding: 0;
    width: 7.5rem;
    display: flex;
    justify-content: space-around;
    border-bottom: .01rem solid #ccc;
}

main>nav>a {
    float: left;
    height: 0.7rem;
    line-height: .7rem;
    font-size: .2rem;
    /* padding: 0 .1rem; */
    text-decoration: none;
    font-weight: bold;
    color: black;
    position: relative;
    cursor: pointer;
}

main>nav>a>i {
    transition: width .3s linear;
    width: 2rem;
}

main>nav>a.active>i {
    background-color: #1173F4;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: .8rem;
    height: 0.06rem;
    border-radius: .06rem;
    z-index: 100;
}

main>.data {
    box-sizing: border-box;
    padding: .2rem .6rem;
    font-weight: bold;
    background-color: #eee;
}

main>.data>.subtitle {
    font-size: .2rem;
    color: #666;
    text-align: center;
}

main>.data>ul {
    display: flex;
    justify-content: space-between;
}

main>.data>ul>li>div {
    text-align: center;
    font-size: .12rem;
}

main>.data>ul>li>.num {
    font-size: .3rem;
    color: #1173F4;
}

main>.data>ul>li>.title {
    font-size: .22rem;
    color: #000;
}

main>.data>ul>li>.new {
    font-size: .20rem;
    color: #666;
    font-weight: normal;
}

main>.map {
    padding: .2rem;
    height: 8rem;
    position: relative;
}

main>.map>.subtitle>span {
    font-size: .15rem;
    color: #666;
    float: right;
}

main>.map>#map {
    height: 5rem;
}

main>.map>.search {
    /* margin-top: .5rem; */
    background-color: #1173F4;
    padding: .2rem;
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(-90deg, rgba(43, 125, 226, 1) 0%, rgba(36, 196, 246, 1) 100%);
    border-radius: 0 0 .1rem .1rem;
    width: 6.7rem;
}

main>.map>.search>.title {
    margin-bottom: .3rem;
    text-align: center;
    color: #fff;
    font-size: .24rem;
    font-weight: bold;
}

main>.map>.search>p {
    font-size: .18rem;
    color: #fff;
    margin-top: .1rem;
    line-height: .28rem;
}

main>.map>.search>.searchText span {
    color: #F20707;
}

main>.map>.search>.form {
    display: flex;
    justify-content: space-between;
}

main>.map>.search input {
    border: none;
    outline: none;
    height: 0.6rem;
    width: 5.2rem;
    text-indent: 1em;
    /* border-radius: .1rem; */
}

main>.map>.search button {
    cursor: pointer;
    color: #333;
    font-size: .24rem;
    height: 0.6rem;
    width: 1.4rem;
    background-color: #fff;
    outline: none;
    border: none;
    border-radius: .1rem;
}

main>.track {
    padding: .2rem;
}

main>.track .login {
    height: .4rem;
    line-height: .4rem;
    font-size: .20rem;
    transform: translateY(.2rem);
    border-radius: .1rem;
    font-weight: normal;
    background-color: #1173F4;
    color: #fff;
    text-decoration: none;
    float: right;
    width: 1.4rem;
    text-align: center;

}

main>.track ul {
    display: flex;
    justify-content: space-around;
}

main>.track ul>li {
    width: 1.5rem;
    height: 2.5rem;
    position: relative;
}

main>.track li>P.title {
    text-align: center;
    font-size: .22rem;
    color: #333;
}

main>.track li>P {
    text-align: center;
    font-size: .16rem;
    color: #666;
    margin-bottom: .2rem;
    position: absolute;
    width: 1.5rem;
    text-align: center;
}

main>.track li>P:first-child {
    top: 0;
}

main>.track li>P:last-child {
    top: 2rem;
}

main>.track li a {
    width: 1.5rem;
    height: 1.5rem;
}

main>.track li img {
    width: 100%;
    margin: 0 auto;
    position: absolute;
    top: .4rem;
}

main>.track li .message {
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../img/sy_cont_im_mfwxdz.png);
    background-size: 100% 100%;
    border: 1px solid #eee;
    position: absolute;
    top: .4rem;
    text-align: center;
}

main>.chart1 {
    height: 3.8rem;
    padding: .2rem;
    position: relative;
}

main #chart1 {
    position: absolute;
    left: .2rem;
    bottom: 0;
    height: 3rem;
    width: 6.6rem;
}

main>.chart2 {
    padding: .2rem;
    font-size: .18rem;
}

main>.chart2 .subtitle {
    margin-bottom: .2rem;
    border-bottom: 1px solid #E4E4E4;

}

main>.chart2>table {
    width: 100%;
    border-collapse: collapse;
}

main>.chart2 tr {
    height: 0.3rem;
}

main>.chart2 thead {
    color: #fff;
}

main>.chart2 tbody>tr {
    border-bottom: 1px solid #E4E4E4;
}

main>.chart2 tr>th,
main>.chart2 tr>td {
    padding: .1rem .2rem;
    text-align: center;
}

main>.chart2 tr>th {
    color: #333;
    font-size: .22rem;
}

main>.chart2 tr>td {
    color: #333;
    font-size: .22rem;
}

main>.chart2 tr>th:nth-child(1) {
    background-color: #C3CDDD;
}

main>.chart2 tr>th:nth-child(2) {
    background-color: #66CC99;
}

main>.chart2 tr>th:nth-child(3) {
    background-color: #D6DCE5;
}

main>.chart2 tr>th:nth-child(4) {
    background-color: #F3BAB0;
}

main>.chart2 tr>th:nth-child(5) {
    background-color: #CBCDE9;
}

main>.outside {
    z-index: 100;
    position: fixed;
    top: 20%;
    width: 7.1rem;
    border-radius: 0;
    padding: .2rem;
    box-sizing: border-box;
}

main>.outside>h1 {
    font-size: .25rem;
    text-align: center;
    margin-bottom: .5rem;
}

main>.outside>h1>i {
    float: right;
    width: 0.3rem;
    cursor: pointer;
    height: 0.3rem;
    background-image: url(../img/sy_cont_icon6.png);
    background-size: 100% 100%;
}

main>.outside>img {
    width: 6.5rem;
}

main>.outside>p {
    font-size: .2rem;
    color: #F20707;
}

.cover {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .8);
    z-index: 99;
    position: fixed;
}

main>.history {
    /* height: 8rem; */
    padding: .2rem;
}

main>.history>.intro {
    border-top: 1px solid #E4E4E4;
    font-size: .2rem;
    color: #666;
    padding: .1rem 0;
}

main>.history>.intro>span {
    color: #1173F4;
    line-height: 1.5;
    cursor: pointer;
}

main>.history>ul {
    color: #333;
    margin: .2rem 0;
}

main>.history>ul li {
    border-bottom: 1px solid #e4e4e4;
    text-indent: 2.5em;
}

main>.history>ul>.head {
    /* padding-left: .4rem; */
    text-indent: 1.6em;
    font-size: .26rem;
    font-weight: bold;
    height: .68rem;
    line-height: .68rem;
    background-color: #C3CDDD;
}

main>.history>ul>.head>span {
    text-indent: 0;
    text-align: center;
    float: right;
    width: 1.3rem;
    background-color: #DEE3EA;
}

main>.history>ul>.body {
    font-weight: bold;
    background-color: #F1F1F1;
    text-indent: 1.6em;
    line-height: .58rem;
    font-size: .24rem;
    cursor: pointer;
    position: relative;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    position: relative;
}

main>.history>ul>.body>i {
    width: 0.1rem;
    height: 0.13rem;
    position: absolute;
    left: 0.21rem;
    top: 0.23rem;
    background: url(../img/delta.png);
    background-size: 100% 100%;
    transform: rotate(0deg);
}

main>.history>ul>.body.active>i {
    transform: rotate(90deg);

    /* transition: transform 1s linear; */
}

main>.history>ul>.body>span {
    text-indent: 0;
    /* float: right; */
    position: absolute;
    right: 0;
    width: 1.3rem;
    text-align: center;
}

main>.history>ul>.body>ul {
    background-color: #fff;
    cursor: default;
    font-weight: normal;
}

main>.history>ul>.body>ul>li {
    /* background-color: red; */
    text-indent: 2em;
    height: .45rem;
    line-height: .45rem;
    /* font-size: .18rem; */
}

main>.list {
    padding: .2rem;
    font-size: .18rem;
    font-weight: 550;
}

main>.list>ul {
    padding: .4rem 0 .5rem;
    border-top: 1px solid #E4E4E4;
    border-bottom: 1px solid #E4E4E4;

}

main>.list li {
    /* height: 1.8rem; */
    font-size: .16rem;
    color: #333;
    padding-left: 5.2em;
    position: relative;
    line-height: .45rem;
    font-weight: lighter;
    overflow: hidden;
    margin-top: .2rem;
}

main>.list li>i {
    position: absolute;
    left: .18rem;
}

main>.list li>span {
    cursor: pointer;
    display: inline-block;
    margin-right: .2rem;
    /* float: left; */
}

main>.list li>span:hover {
    color: #1173F4;
}

main>.list li:nth-child(1) {
    padding-right: .3rem;
}

main>.list li:nth-child(1)::after {
    content: "";
    position: absolute;
    right: .2rem;
    top: .245rem;
    transform: translateY(-50%);
    height: .2rem;
    width: 0.17rem;
    background-image: url(../img/sy_cont_icon4.png);
    background-size: 100%;
}

main>.list li::before {
    content: "";
    position: absolute;
    left: 0;
    /* top: 50%; */
    top: .245rem;
    transform: translateY(-50%);
    width: 0.16rem;
    height: 0.16rem;
    background-image: url(../img/sy_cont_icon5.png);
    background-size: 100% 100%;
}

main>.list .more {
    text-align: center;
    display: block;
    height: 0.35rem;
    line-height: 0.5rem;
    font-size: .2rem;
    color: #1173F4;
    text-decoration: none;
    position: relative;
}

main>.list .more>span {
    width: 0.11rem;
    height: 0.18rem;
    background-image: url(../img/ju.png);
    background-size: 100% 100%;
    display: inline-block;
    margin-left: .1rem;
    position: absolute;
    bottom: 0;
}

.finance {
    height: 9.46rem;
    background-image: url(../img/finance.png);
    background-size: 100% 100%;
    box-sizing: border-box;
    padding: 1.5rem .20rem .30rem;
}

.finance .info1 {
    font-size: .2rem;
    color: #fff;
    line-height: .32rem;
    text-indent: 2em;
}

.finance .info2 {
    font-size: .26rem;
    color: #0857DD;
    width: 4.57rem;
    height: .48rem;
    line-height: .48rem;
    text-align: center;
    margin: .2rem auto;
    font-weight: 600;
    background-image: url(../img/finance2.png);
}

.finance .f-content {
    display: flex;
    justify-content: space-between;
}

.finance .f-content .item {
    background-color: #fff;
    width: 3.2rem;
    box-sizing: border-box;
    padding: .15rem;
    position: relative;
    height: 5.6rem;
}

.finance .f-content .item img {
    width: 2.9rem;
    height: 2.2rem;
    display: block;
}

.finance .f-content .item .f-type {
    color: #333;
    font-weight: bold;
    line-height: .55rem;
    font-size: .26rem;
    text-align: center;
    position: relative;
}

.finance .f-content .item .f-type::before {
    content: '';
    width: 1.25rem;
    height: .02rem;
    background-color: #333;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
}

.finance .f-content .item p {
    font-size: .2rem;
    color: #666;
    line-height: .32rem;
    margin-top: .2rem;
}

.finance .f-content .item span {
    color: #333;
    font-weight: bold;
}

.finance .f-content .item .reg {
    width: 1.56rem;
    height: .44rem;
    line-height: .44rem;
    background: linear-gradient(0deg, rgba(251, 42, 42, 1) 0%, rgba(251, 126, 42, 1) 100%);
    border-radius: .22rem;
    color: #fff;
    font-size: .24rem;
    bottom: .17rem;
    left: 50%;
    transform: translate(-50%);
    position: absolute;
    text-align: center;
}

.anchor6 {
    position: relative;
}

.anchor6::before {
    content: 'NEW';
    position: absolute;
    width: 0.53rem;
    height: .36rem;
    line-height: .3rem;
    left: 50%;
    transform: translateY(-45%);
    color: #fff;
    background-image: url(../img/new.png);
    background-size: 100% 100%;
    text-align: center;
    font-weight: .14rem;
    padding: .05rem .1rem;
    
}