@media screen and (min-width:1920px) {
    .content {
        width: 1342px;
        margin: auto;
        margin-top: 100px;
        padding-bottom: 580px
    }
    .content .title {
        color: #005bac;
        font-size: 30px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 25px;
        padding-bottom: 100px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 958px;
        height: 960px;
        color: #fff;
        font-size: 24px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 479px;
        height: 320px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 320px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 195px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 320px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 35px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 160px;
        left: -480px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 320px;
        height: 320px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 21px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 1280px;
        position: absolute;
        right: 160px;
        bottom: -580px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 320px;
        height: 320px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 640px;
        height: 320px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1800px) and (max-width:1920px) {
    .content {
        width: 1342px;
        margin: auto;
        margin-top: 100px;
        padding-bottom: 580px
    }
    .content .title {
        color: #005bac;
        font-size: 30px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 25px;
        padding-bottom: 100px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 958px;
        height: 960px;
        color: #fff;
        font-size: 24px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 479px;
        height: 320px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 320px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 195px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 320px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 35px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 160px;
        left: -480px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 320px;
        height: 320px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 21px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 1280px;
        position: absolute;
        right: 160px;
        bottom: -580px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 320px;
        height: 320px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 640px;
        height: 320px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 20px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1600px) and (max-width:1800px) {
    .content {
        width: 1258.125px;
        margin: auto;
        margin-top: 93.75px;
        padding-bottom: 543.75px
    }
    .content .title {
        color: #005bac;
        font-size: 28.125px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 23.4375px;
        padding-bottom: 93.75px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 898.125px;
        height: 900px;
        color: #fff;
        font-size: 22.5px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 449.0625px;
        height: 300px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 300px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 182.8125px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 300px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 32.8125px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 150px;
        left: -450px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 300px;
        height: 300px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 19.6875px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 1200px;
        position: absolute;
        right: 150px;
        bottom: -543.75px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 300px;
        height: 300px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 600px;
        height: 300px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
      
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 18.75px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 18.75px;
        left: 0;
        color: #fff;
        z-index: 10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 18.75px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1400px) and (max-width:1600px) {
    .content {
        width: 1118.33333px;
        margin: auto;
        margin-top: 83.33333px;
        padding-bottom: 483.33333px
    }
    .content .title {
        color: #005bac;
        font-size: 25px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 20.83333px;
        padding-bottom: 83.33333px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 798.33333px;
        height: 800px;
        color: #fff;
        font-size: 20px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 399.16667px;
        height: 266.66667px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 266.66667px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 162.5px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 266.66667px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 29.16667px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 133.33333px;
        left: -400px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 266.66667px;
        height: 266.66667px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 17.5px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 1066.66667px;
        position: absolute;
        right: 133.33333px;
        bottom: -483.33333px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 266.66667px;
        height: 266.66667px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 533.33333px;
        height: 266.66667px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 16.66667px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 16.66667px;
        left: 0;
        color: #fff;
        z-index:10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 16.66667px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1300px) and (max-width:1400px) {
    .content {
        width: 978.54167px;
        margin: auto;
        margin-top: 72.91667px;
        padding-bottom: 422.91667px
    }
    .content .title {
        color: #005bac;
        font-size: 21.875px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 18.22917px;
        padding-bottom: 72.91667px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 698.54167px;
        height: 700px;
        color: #fff;
        font-size: 17.5px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 349.27083px;
        height: 233.33333px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 233.33333px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 142.1875px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 233.33333px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 25.52083px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 116.66667px;
        left: -350px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 233.33333px;
        height: 233.33333px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 15.3125px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 933.33333px;
        position: absolute;
        right: 116.66667px;
        bottom: -422.91667px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 233.33333px;
        height: 233.33333px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 466.66667px;
        height: 233.33333px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 14.58333px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 14.58333px;
        left: 0;
        color: #fff;
        z-index: 10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 14.58333px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1200px) and (max-width:1300px) {
    .content {
        width: 908.64583px;
        margin: auto;
        margin-top: 67.70833px;
        padding-bottom: 392.70833px
    }
    .content .title {
        color: #005bac;
        font-size: 20.3125px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 16.92708px;
        padding-bottom: 67.70833px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 648.64583px;
        height: 650px;
        color: #fff;
        font-size: 16.25px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 324.32292px;
        height: 216.66667px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 216.66667px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 132.03125px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 216.66667px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 23.69792px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 108.33333px;
        left: -325px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 216.66667px;
        height: 216.66667px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 14.21875px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 866.66667px;
        position: absolute;
        right: 108.33333px;
        bottom: -392.70833px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 216.66667px;
        height: 216.66667px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 433.33333px;
        height: 216.66667px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 13.54167px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 13.54167px;
        left: 0;
        color: #fff;
        z-index: 10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 13.54167px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (min-width:1024px) and (max-width:1200px) {
    .content {
        width: 838.75px;
        margin: auto;
        margin-top: 62.5px;
        padding-bottom: 362.5px
    }
    .content .title {
        color: #005bac;
        font-size: 18.75px;
        text-align: center;
        font-weight: 700
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        margin-top: 15.625px;
        padding-bottom: 62.5px;
        font-size: 16px
    }
    .content .historydes p {
        margin-bottom: 25px
    }
    .content .zindexs {
        text-align: end
    }
    .content .zindexs:after,
    .content .zindexs:before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 {
        width: 598.75px;
        height: 600px;
        color: #fff;
        font-size: 15px;
        display: inline-block;
        position: relative;
        float: right
    }
    .content .zindex-1 .row>div {
        width: 299.375px;
        height: 200px
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 200px;
        text-align: justify;
        text-justify: inter-ideograph
    }
    .content .zindex-1 .row .activeblue span {
        width: 100%;
        display: inline;
        padding-left: 121.875px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 200px;
        text-align: start
    }
    .content .zindex-1 .row .activeorange span {
        padding-left: 21.875px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        position: absolute;
        top: 100px;
        left: -300px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 200px;
        height: 200px
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        bottom: 13.125px;
        left: 0;
        width: 100%;
        text-align: center
    }
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):after,
    .content .zindex-1 .zindexpos1 .zindexposrow:nth-child(1):before {
        content: "\0020";
        display: block;
        height: 0;
        overflow: hidden;
        clear: both
    }
    .content .zindex-1 .zindexpos2 {
        width: 800px;
        position: absolute;
        right: 100px;
        bottom: -362.5px
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 200px;
        height: 200px
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 400px;
        height: 200px;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 12.5px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 12.5px;
        left: 0;
        color: #fff;
        z-index: 10
    }
    .content .zindex-1 .zindexpos2>div .right {
        float: right;
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        position: absolute;
        bottom: 12.5px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
}

@media screen and (max-width:1023px) {
    .content {
        width: 100%
    }
    .content .title {
        color: #005bac;
        font-size: 16px;
        text-align: center;
        font-weight: 700;
        margin-top: .6rem
    }
    .content .historydes {
        text-align: justify;
        color: #333;
        line-height: 22px;
        text-indent: 2em;
        padding: .25rem;
        font-size: 14px;
        width: 100%
    }
    .content .historydes p {
        margin-bottom: .15rem
    }
    .content .zindexs {
        width: 100%
    }
    .content .zindex-1 {
        width: 100%;
        color: #fff;
        font-size: 14px;
        height: 30.2rem
    }
    .content .zindex-1 .row {
        width: 100%
    }
    .content .zindex-1 .row>div {
        width: 50%;
        height: 3.2rem;
        display: inline-block
    }
    .content .zindex-1 .row .left {
        float: left
    }
    .content .zindex-1 .row .right {
        float: right
    }
    .content .zindex-1 .row .activeblue {
        background-color: #3569b4;
        line-height: 3.2rem;
        text-align: right;
        padding-right: 15px
    }
    .content .zindex-1 .row .activeorange {
        background-color: #c26b36;
        line-height: 3.2rem;
        text-align: left;
        padding-left: 15px
    }
    .content .zindex-1 .row img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos1 {
        width: 100%;
        font-size: 14px;
        margin-top: 3rem;
        clear: both
    }
    .content .zindex-1 .zindexpos1 .zindexposrow>div {
        width: 100%;
        height: 3.2rem;
        text-align: center;
        position: relative
    }
    .content .zindex-1 .zindexpos1 .zindexposrow span {
        position: absolute;
        width: 100%;
        bottom: 5px;
        left: 0
    }
    .content .zindex-1 .zindexpos1 .zindexposrow img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2 {
        width: 100%;
        clear: both
    }
    .content .zindex-1 .zindexpos2>div .zuo,
    .content .zindex-1 .zindexpos2>div .zuoone {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .you {
        float: right
    }
    .content .zindex-1 .zindexpos2>div .left {
        position: relative
    }
    .content .zindex-1 .zindexpos2>div .right {
        position: relative
    }
    .content .zindex-1 .zindexpos2>div span {
        position: absolute;
        width: 100%;
        bottom: 5px;
        left: 0
    }
    .content .zindex-1 .zindexpos2>div .you>div,
    .content .zindex-1 .zindexpos2>div .zuo>div {
        width: 50%;
        height: 3.2rem;
        display: inline-block
    }
    .content .zindex-1 .zindexpos2>div .you img,
    .content .zindex-1 .zindexpos2>div .zuo img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one {
        width: 100%;
        height: 3.2rem;
        position: relative;
        text-align: center
    }
    .content .zindex-1 .zindexpos2>div .one img {
        width: 100%;
        height: 100%;
        
    }
    .content .zindex-1 .zindexpos2>div .one span {
        width: 100%;
        position: absolute;
        width: 100%;
        bottom: 5px;
        left: 0;
        color: #fff;
        z-index: 9999
    }
    .content .zindex-1 .zindexpos2>div .left {
        float: left
    }
    .content .zindex-1 .zindexpos2>div .left span {
        width: 100%;
        text-align: center;
        color: #fff;
        z-index:10
    }
    .content .zindex-1 .zindexpos2>div .right span {
        width: 100%;
        text-align: center;
        color: #fff;
        z-index: 9999
    }
}


/*# sourceMappingURL=Why-Select-BH.min.css.map */