body {
    background: #061326;
}

.redclass {
    color: #55FF85 !important;
}

.greenclass {
    color: #FF5555 !important;
}

.sfqsClass {
    width: 100%;
    height: 29px;
    background: linear-gradient(0deg, #0060fe, #00ffff);
    background: url('../img/titlebg.png') no-repeat;
    padding-left: 0.52083333vw;
    line-height: 26px;
    font-size: 0.9375vw;
    color: #0ADBFF;
    font-weight: bold;
}

.sfqsClass span {
    font-size: 0.72916667vw;
    color: #0ADBFF;
    font-weight: normal;
    vertical-align: top;
}

li {
    list-style: none;
}

.page {
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    position: fixed;
}

.page .bg {
    width: 100vw;
    height: 100vh;
    background: url('../img/indexbg.png') no-repeat;
    background-size: 100% 100%;
}

.page .bg .content {
    height: 100%;
    box-sizing: border-box;
    padding-left: 2.34375vw;
    padding-right: 2.34375vw;
}

.page .bg .content .header {
    width: 100%;
    color: #F6FEFF;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    border-bottom: 1px solid #0ADBFF;
    padding-bottom: 2.31481481vh;
    padding-top: 2.31481481vh;
}

.page .bg .content .header .weather {
    margin-bottom: 1.75925926vh;
}

.page .bg .content .header .date {
    margin-right: 1.04166667vw;
    font-size: 0.72916667vw;
    color: #F6FEFF;
}

.page .bg .content .header .date .data_left {
    display: inline-block;
    text-align: right;
    padding-right: 0.98958333vw;
}

.page .bg .content .header .date .data_left #week {
    padding-bottom: 0.26041667vw;
}

.page .bg .content .header .date .data_right {
    display: inline-block;
    font-size: 1.77083333vw;
    color: #fff;
    font-weight: 400;
    vertical-align: bottom;
    width: 8vw;
}

.page .bg .content .header .logoimg {
    background: url('../img/logo.png') no-repeat;
    height: 4.62962963vh;
    line-height: 4.62962963vh;
    background-size: contain;
}

.page .bg .content .header .logoimg > span {
    font-size: 1.45833333vw;
    color: #F5FEFF;
    font-weight: bold;
    padding-left: 2.60416667vw;
}

.page .bg .content .header .title {
    position: absolute;
    left: 56%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.9375vw;
    color: #fff;
    width: 60%;
}

.page .bg .content .header .title ul {
    overflow: hidden;
    padding-left: 4.16666667vw;
}

.page .bg .content .header .title ul li {
    float: left;
    line-height: 10.64814815vh;
    cursor: pointer;
    width: 120px;
}

.page .bg .content .header .title ul li:first-child a {
    background: none;
}

.page .bg .content .header .active {
    background: url('../img/tab_pre.png') no-repeat !important;
    background-position: 0 bottom !important;
}

.page .bg .content .header .active a {
    color: #0ADBFF !important;
}

.page .bg .content .header .title ul li a {
    display: inline-block;
    width: 120px;
    text-align: center;
    font-weight: 600;
    line-height: 3.7037037vh;
    font-size: 0.9375vw;
    color: #F6FEFF;
    text-decoration-line: none;
    background: url('../img/circle.png') no-repeat;
    background-position: 0 center;
}

.page .bg .content .body {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 2.77777778vh;
}

.page .bg .content .body .bg_title {
    width: 7.8125vw;
    height: 2.77777778vh;
    line-height: 2.77777778vh;
    margin-top: 1.85185185vh;
    font-size: 0.83333333vw;
    color: #fff;
    font-weight: 400;
    background: url('../../assets/dvs/titlebg.png') no-repeat;
    background-size: 100% 100%;
}

.page .bg .content .body .bg_title span {
    display: inline-block;
    padding-left: 0.52083333vw;
}

.page .bg .content .body .left {
    width: 24.35416667vw;
    height: 94.44444444vh;
}

.page .bg .content .body .left .left_img {
    padding-left: 0.92592593vh;
    padding-right: 0.92592593vh;
    height: 84.25925926vh;
    margin-top: 1.85185185vh;
    overflow: hidden;
}

.page .bg .content .body .left .left_img ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.page .bg .content .body .left .left_img ul .hover {
    animation: move 5s ease-in-out infinite;
}

.page .bg .content .body .left .left_img ul li {
    z-index: 1;
    margin-bottom: 1.38888889vh;
    width: 12.5vw;
    height: 9.25925926vh;
    background: #002066;
    display: flex;
    align-items: center;
}

.page .bg .content .body .left .left_img ul li img {
    width: 3.64583333vw;
    height: 6.48148148vh;
    margin-left: 0.52083333vw;
}

.page .bg .content .body .left .left_img ul li .msg {
    margin-left: 0.52083333vw;
}

.page .bg .content .body .left .left_img ul li .msg p {
    line-height: 1.85185185vh;
    font-size: 0.72916667vw;
    color: #cce6ff;
}

.page .bg .content .body .left .left_top {
    height: 30.77777778vh;
}

.page .bg .content .body .left .left_top .tablestyle {
    width: 100%;
    color: #fff;
    margin-top: 3.33333333vh;
}

.page .bg .content .body .left .left_top .qschartstyle {
    height: 25.77777778vh;
}

.page .bg .content .body .left .left_top .tablestyle tr {
    line-height: 3.61111111vh;
}

.page .bg .content .body .left .left_top .tablestyle tr td {
    white-space: nowrap;
    vertical-align: middle;
    color: #e6e6e6;
}

.page .bg .content .body .left .left_top .tablestyle tr td p {
    font-weight: 400;
}

.page .bg .content .body .left .left_top .tablestyle tr td span {
    background: #7fffff;
    border-radius: 50%;
    height: 2.12962963vh;
    width: 1.04166667vw;
    display: inline-block;
    text-align: center;
    line-height: 2.31481481vh;
    font-size: 0.625vw;
    color: #fff;
    vertical-align: middle;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(1) td:nth-of-type(1) span {
    background: #8f40ff !important;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(2) td:nth-of-type(1) span {
    background: #6666ff !important;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(3) td:nth-of-type(1) span {
    background: #00a8ff !important;
}

.page .bg .content .body .left .left_top .progressbar {
    width: 50%;
    background-color: #eeeeee;
    border-radius: 0px 3px 3px 0px;
    height: 0.92592593vh;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(1) td:nth-of-type(3) .progressbar {
    background-color: #8f40ff;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(2) td:nth-of-type(3) .progressbar {
    background-color: #6666ff;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(3) td:nth-of-type(3) .progressbar {
    background-color: #00a8ff;
}

.page .bg .content .body .left .left_top .progressbar {
    float: left;
}

.page .bg .content .body .left .left_top .totalnum {
    float: left;
}

.page .bg .content .body .left .left_top .totalnum {
    color: #00cccc;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(1) td:nth-of-type(4) .totalnum {
    color: #8f40ff;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(2) td:nth-of-type(4) .totalnum {
    color: #6666ff;
}

.page .bg .content .body .left .left_top .tablestyle tr:nth-of-type(3) td:nth-of-type(4) .totalnum {
    color: #00a8ff;
}

.page .bg .content .body .left .left_center {
    height: 20.92592593vh;
}

.page .bg .content .body .left .left_center .sfqsClass_person {
    width: 100%;
    height: 3.24074074vh;
    line-height: 2.87037037vh;
    background: linear-gradient(0deg, #0060fe, #00ffff);
    background: url('../img/titlebg.png') no-repeat;
    padding-left: 0.52083333vw;
    font-size: 0.9375vw;
    color: #0ADBFF;
    font-weight: bold;
}

.page .bg .content .body .left .left_center .sfqsClass_person span {
    font-size: 0.72916667vw;
    color: #0ADBFF;
    font-weight: normal;
    vertical-align: top;
}

.page .bg .content .body .left .left_center .myChart_attributestyle {
    height: 20.25925926vh;
}

.page .bg .content .body .left .left_center .myChart_attributestyle .sex_rate {
    height: 3.7037037vh;
    line-height: 3.7037037vh;
    background: url('../img/circle.png') no-repeat;
    font-size: 0.72916667vw;
    color: #0ADBFF;
    padding-left: 0.78125vw;
    background-position-x: 0vw;
    background-position-y: 0.78125vw;
}

.page .bg .content .body .left .left_center .myChart_attributestyle .chartdiv {
    height: 8.25925926vh;
}

.page .bg .content .body .left .left_center .myChart_agestyle {
    height: 25.88888889vh;
}

.page .bg .content .body .left .left_center .myChart_agestyle .sex_rate {
    height: 3.7037037vh;
    line-height: 3.7037037vh;
    background: url('../img/circle.png') no-repeat;
    font-size: 0.72916667vw;
    color: #0ADBFF;
    padding-left: 0.78125vw;
    background-position-x: 0vw;
    background-position-y: 0.78125vw;
}

.page .bg .content .body .left .left_center .myChart_agestyle .chartdiv {
    height: 25.88888889vh;
}

.page .bg .content .body .left .left_bottom {
    height: 31.48148148vh;
    margin-top: 1.85185185vh;
    /*.jctablestyle tr:nth-child(even){*/
    /*    background: #0633a5;*/
    /*}*/
}

.page .bg .content .body .left .left_bottom .selectli {
    height: 31.48148148vh;
}

.page .bg .content .body .left .left_bottom .videobox {
    height: 24.07407407vh;
    margin-top: 0.92592593vh;
    text-align: center;
}

.page .bg .content .body .left .left_bottom .videobox iframe {
    height: 78%;
    width: 100%;
}

.page .bg .content .body .left .left_bottom .selectli select {
    background: #081028;
    border: 1px solid #7FCDFF;
    color: #0ADBFF;
    padding-top: 0.27777778vh;
    padding-bottom: 0.27777778vh;
    width: 100%;
}

.page .bg .content .body .left .left_bottom .selectli_left {
    width: 84%;
    margin: 0 auto;
    margin-top: 1.85185185vh;
}

.page .bg .content .body .left .left_bottom .selectli_right {
    float: right;
    width: 40%;
    margin-top: 1.85185185vh;
}

.page .bg .content .body .left .left_bottom .caseranklist {
    display: flex;
}

.page .bg .content .body .left .left_bottom .jctablestyle {
    width: 100%;
}

.page .bg .content .body .left .left_bottom .jctablestyle tr:nth-of-type(1) td {
    color: #80e1ff;
    padding-left: 0.52083333vw;
    background: #002473;
}

.page .bg .content .body .left .left_bottom .jctablestyle tr td {
    line-height: 3.7037037vh;
    font-size: 0.72916667vw;
    color: #e5e5e5;
    padding-left: 0.52083333vw;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli {
    height: 37.59259259vh;
    width: 11.45833333vw;
    flex: 1;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli .caselititle {
    margin-top: 2.31481481vh;
    padding-left: 1.85185185vh;
    font-size: 0.83333333vw;
    color: #00ffff;
    height: 3.7037037vh;
    line-height: 3.7037037vh;
    background: #0635a6;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli .caselicont {
    height: 30.18518519vh;
    padding-left: 1.85185185vh;
    padding-right: 1.85185185vh;
    padding-top: 1.85185185vh;
    padding-bottom: 1.85185185vh;
    background: #092e93;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli .caselicont li {
    line-height: 3.33333333vh;
    overflow: hidden;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli .caselicont li span {
    float: left;
    font-size: 0.72916667vw;
    color: #e5e5e5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100px;
}

.page .bg .content .body .left .left_bottom .caseranklist .caseli .caselicont li i {
    float: right;
    font-size: 0.72916667vw;
    color: #00ffff;
}

.page .bg .content .body .center {
    width: 46.60416667vw;
    height: 94.44444444vh;
    display: flex;
    flex-direction: column;
    justify-content: sapce-between;
}

.page .bg .content .body .center .top {
    padding-left: 2vh;
    padding-right: 2vh;
    position: relative;
}

.page .bg .content .body .center .top .num_title {
    font-size: 1.25vw;
    color: #cce6ff;
    position: absolute;
    top: 14.35185185vh;
    left: 4.16666667vw;
}

.page .bg .content .body .center .top .TotalNumDay {
    display: flex;
    margin-top: 0.92592593vh;
    margin-bottom: 0.92592593vh;
}

.page .bg .content .body .center .top .tbstyle {
    text-align: left;
    display: inline-block;
    width: 45%;
    padding-left: 1.30208333vw;
    float: left;
    font-size: 0.72916667vw;
    color: #7fe1ff;
}

.page .bg .content .body .center .top .tbstyle i {
    font-size: 0.72916667vw;
    color: #ffffff;
}

.page .bg .content .body .center .top .hbstyle {
    text-align: center;
    display: block;
    font-size: 0.72916667vw;
    color: #7fe1ff;
}

.page .bg .content .body .center .top .hbstyle i {
    font-size: 0.72916667vw;
    color: #ffffff;
    padding-left: 0.36458333vw;
}

.page .bg .content .body .center .top .TotalNumDay .tableli:last-child {
    margin-right: 0vh;
}

.page .bg .content .body .center .top .TotalNumDay .tableli {
    background: url('../img/zbbx.png') no-repeat center center;
    background-size: 100% 100%;
    height: 13.88888889vh;
    width: 10.0625vw;
    margin-right: 2.31481481vh;
    flex: 1;
    display: table-cell;
    vertical-align: middle;
}

.page .bg .content .body .center .top .TotalNumDay .tableli > span {
    text-align: center;
    display: block;
    font-size: 0.72916667vw;
    color: #fff;
}

.page .bg .content .body .center .top .TotalNumDay .tableli .jcstyle {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1.85185185vh;
    margin-bottom: 1.38888889vh;
    font-size: 1.2625vw;
    color: #0ADBFF;
}

.page .bg .content .body .center .top .TotalNumDay .tableli .jcstyle i {
    font-size: 0.72916667vw;
    color: #D2D9DD;
    margin-top: 10px;
    display: inline-block;
    transform: scale(.8);
}

.page .bg .content .body .center .top .TotalNumDay .tableli .nostyle {
    text-align: center;
    display: block;
    /*<!--.vh(margin-top, 20);-->*/
    font-size: 1.875vw;
    color: #ffff2d;
}

.page .bg .content .body .center .top .TotalNumDay .tableli .nostyle i {
    font-size: 1.04166667vw;
    color: #fff;
}

.page .bg .content .body .center .top .TotalNumDay .tableli .ddstyle {
    text-align: center;
    display: block;
    /*<!--.vh(margin-top, 20);-->*/
    font-size: 1.875vw;
    color: #ff6868;
}

.page .bg .content .body .center .top .TotalNumDay .tableli .ddstyle i {
    font-size: 1.04166667vw;
    color: #fff;
}

.page .bg .content .body .center .top .flop {
    display: flex;
    justify-content: center;
    align-items: center;
}

.page .bg .content .body .center .top .flop .flop_bg {
    height: 22.03703704vh;
    width: 27.1875vw;
    display: flex;
    justify-content: center;
    background: url('../../assets/dvs/particle.png') no-repeat;
    background-size: 100% 100%;
}

.page .bg .content .body .center .top .flop li {
    height: 8.33333333vh;
    width: 2.60416667vw;
    background: linear-gradient(0deg, #09bbfe 0%, #5a42ec 100%);
}

.page .bg .content .body .center .top .yesterday {
    margin-top: 2.5vh;
}

.page .bg .content .body .center .top .yesterday div {
    line-heigth: 3.7037037vh;
    font-size: 1.25vw;
    color: #cce6ff;
}

.page .bg .content .body .center .top .yesterday .num {
    display: inline-block;
    margin-left: 1.09375vw;
    font-size: 2.5vw;
    color: #30b4ff;
    font-weight: bold;
}

.page .bg .content .body .center .top .yesterday .num span {
    font-size: 0.9375vw;
    color: #cce5ff;
    margin-left: 0.625vw;
    height: 100%;
    display: inline-block;
    font-weight: lighter;
}

.page .bg .content .body .center .bottom {
    width: 43.75vw;
    height: 74.07407407vh;
    position: relative;
    margin: 0 auto;
}

.page .bg .content .body .center .bottom .map_height {
    height: 71.07407407vh;
    position: relative;
}

.page .bg .content .body .right {
    width: 24.35416667vw;
    height: 94.44444444vh;
}

.page .bg .content .body .right .right_top {
    height: 42.59259259vh;
}

.page .bg .content .body .right .right_top .yjdj {
    background: url('../../assets/dvs/dj.png') no-repeat;
    height: 31.48148148vh;
    margin: 0 auto;
    margin-top: 4.62962963vh;
}

.page .bg .content .body .right .right_top .yjdj ul li {
    color: #fff;
    text-align: center;
    line-height: 5.09259259vh;
    padding-bottom: 2.59259259vh;
}

.page .bg .content .body .right .right_top .yjdj ul li i {
    display: inline-block;
    vertical-align: top;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(2) {
    padding-bottom: 3.51851852vh;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(3) {
    padding-bottom: 3.98148148vh;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(1) span {
    font-size: 1.5625vw;
    color: #b841ff;
    font-weight: 600;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(2) span {
    font-size: 1.5625vw;
    color: #8a7fff;
    font-weight: 600;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(3) span {
    font-size: 1.5625vw;
    color: #00a8ff;
    font-weight: 600;
}

.page .bg .content .body .right .right_top .yjdj ul li:nth-of-type(4) span {
    font-size: 1.5625vw;
    color: #00fde5;
    font-weight: 600;
}

.page .bg .content .body .right .right_top .tablestyle {
    width: 100%;
    color: #fff;
    margin-top: 1.38888889vh;
}

.page .bg .content .body .right .right_top .qschartstyle {
    height: 22.77777778vh;
}

.page .bg .content .body .right .right_top .tablestyle tr {
    line-height: 3.88888889vh;
}

.page .bg .content .body .right .right_top .tablestyle tr td {
    vertical-align: middle;
    line-height: 25px;
    font-size: 0.625vw;
    color: #D4DFEA;
}

.page .bg .content .body .right .right_top .tablestyle tr td p {
    font-weight: bold;
}

.page .bg .content .body .right .right_top .tablestyle tr td span {
    background: #118BAA;
    height: 1.75925926vh;
    width: 0.9375vw;
    color: #fff;
    border-radius: 100%;
    display: inline-block;
    text-align: center;
    line-height: 1.75925926vh;
    vertical-align: middle;
    margin-right: 0.41666667vw;
}

.page .bg .content .body .right .right_top .tablestyle tr:nth-of-type(1) td:nth-of-type(1) span,
.page .bg .content .body .right .right_top .tablestyle tr:nth-of-type(2) td:nth-of-type(1) span,
.page .bg .content .body .right .right_top .tablestyle tr:nth-of-type(3) td:nth-of-type(1) span {
    background: #FCC01D;
}

.page .bg .content .body .right .right_top .progressbar {
    width: 50%;
    background-color: #11A8CE;
    border-radius: 0px 3px 3px 0px;
    height: 0.92592593vh;
    margin-left: 0.52083333vw;
}

.page .bg .content .body .right .right_top .progressbar {
    float: left;
}

.page .bg .content .body .right .right_top .totalnum {
    float: right;
}

.page .bg .content .body .right .right_top .totalnum {
    color: #0ADBFF;
}

.page .bg .content .body .right .right_bottom {
    height: 41.66666667vh;
    margin-top: 1.85185185vh;
    margin-bottom: 1.38888889vh;
}

.page .bg .content .body .right .right_bottom .chartsytle {
    padding-top: 1.85185185vh;
    height: calc(23.14814815vh + 13.8888vh);
    padding-bottom: 1.38888889vh;
}

.page .bg .content .body .right .right_bottom .res_distri {
    height: 13.88888889vh;
}

.page .bg .content .body .right .right_bottom .res_distri .distri_list {
    overflow: hidden;
}

.page .bg .content .body .right .right_bottom .res_distri .distri_list li {
    float: left;
    width: 25%;
    line-height: 2.77777778vh;
    font-size: 0.625vw;
    color: #7FCDFF;
    text-align: center;
}

.page .bg .content .body .right .right_bottom .res_distri .distri_list li span {
    float: left;
}

.page .bg .content .body .right .right_bottom .res_distri .distri_list li i {
    width: 29%;
    float: right;
}

.footer {
    position: fixed;
    right: -1000px;
    bottom: 0;
    width: 560px;
    height: 30px;
    line-height: 30px;
    cursor: pointer;
    text-align: center;
    background-color: #122c54;
    transition: all 500ms;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #BDC6D2;
}

.footer #arrow {
    margin: 0 2px;
    width: 15px;
}

.footer .footer-msg {
    padding: 0 3px;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 15px);
}

.footer .footer-msg span:first-child {
    width: 73px;
}

.footer .footer-msg img {
    height: 20px;
    width: 87px;
    margin: 0 5px;
    margin-top: 1px;
}

.footer .footer-msg span:last-child {
    width: calc(100% - 160px);
}

.bottom .back {
    position: absolute;
    left: 50px;
    top: 30px;
    color: #cccccc;
    font-size: 15px;
    cursor: pointer;
    z-index: 100;
}

.back a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.quList {
    position: absolute;
    left: 4%;
    top: 6%;
    z-index: 999;
    color: #FFB569;
    cursor: pointer;
}

.quList > p {
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: bold;
    color: #dddddd;
    cursor: pointer;
}

.quList > p > span:first-child {
    border: 1px solid #dddddd;
    border-radius: 10px;
    width: 13px;
    height: 13px;
    display: inline-block;
    margin-right: 5px;
    text-align: center;
    line-height: 13px;
    font-weight: normal;
    cursor: pointer;
}

.page .bg .content .header .logoimg span span {
    font-size: 1.2vw;
    display: inline-block;
    width: 25vw;
    line-height: 22px;
}