body{
    width: 100%;
    margin: 0 auto;
    padding: 0rem;
}
main {
    position: relative;
    height: 100%;
}
::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
}
.swiper-slide {
    height: 100%; //这里是终点
width: 100%;
    position: relative;
    overflow: hidden;
}
body, html{
    width: 100%;
    height: 100%;
}
#swiper-container2 .swiper-slide {
    height: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display:block;
}

.swiper-container {
    width: 100%;
    height: 100%;
}
.page-adapt{
    max-width: 120rem;
    height: 100%;
    position: relative;
    margin: auto;
}
.page1{
    width: 100%;
    height: 43.9375rem;
    background: url("../../../img/ges/monitor/page1-back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
}
.page1content{
    /*width: 45.5rem;*/
    height: 17.375rem;
    background: #346DFF;
    opacity: 0.5;
    clip-path:
            polygon(10.4375rem 0,100% 0, 100% 100%, 0 100%,0 50%);
    position: absolute;
    left: 50%;
    bottom: 0;
    right: 0;
    margin-left: 14.5rem;
}
.page1-title1{
    width: 21rem;
    height: 3.3125rem;
    /*background: url("../../../img/ges/monitor/page1-title.png") no-repeat center;*/
    /*background-size: 100% 100%;*/
    font-size: 4.5rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #FFFFFF;
    line-height:3.3125rem;
    position: absolute;
    margin-top: 30.625rem;
    margin-left:89.125rem;
}
.page1-rectangle{
    width: 12.1875rem;
    height: 0.625rem;
    background: #FFC334;
    border-radius: 0.3125rem;
    position: absolute;
    margin-top: 35.1875rem;
    margin-left: 97.875rem;
}
.page1-title2{
    width: 25.625rem;
    height: 2.125rem;
    font-size: 2.25rem;
    font-family: Source Han Sans CN;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 1.25rem;
    position: absolute;
    margin-top: 37.6875rem;
    margin-left: 84.75rem;
}

.content1-pmd,.content2-pmd,.content3-pmd,.content4-pmd{
    display: none;
}

.page2{
    width: 100%;
    height: 91.125rem;
    position: relative;
    background: #F8F8F8;
}
.page2-title{
    width: 20.4375rem;
    height: 3.25rem;
    position: absolute;
    margin-top: 7.875rem;
    margin-left: 14.5rem;
}
.page2-t1{
    width: 18.25rem;
    height: 2.875rem;
    font-size: 4rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 2.875rem;
    white-space: nowrap;
    margin-left: 0;
    margin-top: 0;
}
.page2-t2{
    width: 18.25rem;
    height: 2.875rem;
    font-size: 4rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    opacity: 0.15;
    line-height: 2.875rem;
    white-space: nowrap;
    margin-left: 2.1875rem;
    margin-top: -2.5rem;
}
.page2-contents{
    width: 82.5rem;
    height: 71.25rem;
    position: absolute;
    margin-top: 14.875rem;
    margin-left: 18.75rem;
}
.content1{
    width: 40rem;
    height: 34.375rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
}
.c1-back{
    width: 40rem;
    height: 31.25rem;
    background: url("../../../img/ges/monitor/page2-c1back.png") no-repeat center;
    background-size: 100% 100%;
    border-radius: 1.25rem;
    margin-top: 0;
}
.c1-words{
    width: 31.25rem;
    height: 8.75rem;
    background: #FFFFFF;
    margin-top: -5.625rem;
}
.c1-title{
    width: 17.125rem;
    height: 1.375rem;
    font-size: 1.875rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 1.375rem;
    white-space: nowrap;
    margin-left: 2.5rem;
    margin-top: 2.9375rem;
}
.page2-rectangle{
    width: 1.625rem;
    height: 0.25rem;
    background: #FFC334;
    border-radius: 0.125rem;
    margin-top: 1.25rem;
    margin-left: 2.5rem;
}
.c-txt{
    width: 24.875rem;
    height: 3.375rem;
    font-size: 1.25rem;
    font-family: Source Han Sans CN;
    font-weight: 100;
    color: #FFFFFF;
    text-indent: 2em;
    display: none;
    margin-top: 1.1875rem;
    margin-left: 2.5625rem;
}
.c1-words:hover{
    height: 15rem;
    background: #346DFF;
    margin-top: -11.875rem;
}
.c1-words:hover .c1-title{
    color: #FFFFFF;
}
.c1-words:hover .c-txt{
   display: inline;
    position: absolute;
}
.content2{
    width: 40rem;
    height: 34.375rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    right: 0;
    top: 0;
}
.c2-back{
    width: 40rem;
    height: 31.25rem;
    background: url("../../../img/ges/monitor/page2-c2back.png") no-repeat center;
    background-size: 100% 100%;
    border-radius: 1.25rem;
    margin-top: 0;
}
.c2-words{
    width: 31.25rem;
    height: 8.75rem;
    background: #FFFFFF;
    margin-top: -5.625rem;
}
.c2-title{
    width: 17.125rem;
    height: 1.375rem;
    font-size: 1.875rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 1.375rem;
    white-space: nowrap;
    margin-left: 2.5rem;
    margin-top: 2.9375rem;
}
.c2-words:hover{
    height: 15rem;
    background: #346DFF;
    margin-top: -11.875rem;
}
.c2-words:hover .c2-title{
    color: #FFFFFF;
}
.c2-words:hover .c-txt{
    display: inline;
    position: absolute;
}
.content3{
    width: 40rem;
    height: 34.375rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 0;
    bottom: 0;
}
.c3-back{
    width: 40rem;
    height: 31.25rem;
    background: url("../../../img/ges/monitor/page2-c3back.png") no-repeat center;
    background-size: 100% 100%;
    border-radius: 1.25rem;
    margin-top: 0;
}
.c3-words{
    width: 31.25rem;
    height: 8.75rem;
    background: #FFFFFF;
    margin-top: -5.625rem;
}
.c3-title{
    width: 15.4375rem;
    height: 1.375rem;
    font-size: 1.875rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 1.375rem;
    white-space: nowrap;
    margin-left: 2.5rem;
    margin-top: 2.9375rem;
}
.c3-words:hover{
    height: 15rem;
    background: #346DFF;
    margin-top: -11.875rem;
}
.c3-words:hover .c3-title{
    color: #FFFFFF;
}
.c3-words:hover .c-txt{
    display: inline;
    position: absolute;
}
.content4{
    width: 40rem;
    height: 34.375rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    right: 0;
    bottom: 0;
}
.c4-back{
    width: 40rem;
    height: 31.25rem;
    background: url("../../../img/ges/monitor/page2-c4back.png") no-repeat center;
    background-size: 100% 100%;
    border-radius: 1.25rem;
    margin-top: 0;
}
.c4-words{
    width: 31.25rem;
    height: 8.75rem;
    background: #FFFFFF;
    margin-top: -5.625rem;
}
.c4-title{
    width: 17.25rem;
    height: 1.375rem;
    font-size: 1.875rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 1.375rem;
    white-space: nowrap;
    margin-left: 2.5rem;
    margin-top: 2.9375rem;
}
.c4-words:hover{
    height: 15rem;
    background: #346DFF;
    margin-top: -11.875rem;
}
.c4-words:hover .c4-title{
    color: #FFFFFF;
}
.c4-words:hover .c-txt{
    display: inline;
    position: absolute;
}

.cards-pmd{
    display: none;
}

.page3{
    width: 100%;
    height: 77.4375rem;
    background: url("../../../img/ges/monitor/page3back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
}
.page3-title{
    width: 14.75rem;
    height: 5.1875rem;
    font-size: 4rem;
    font-family: YouSheBiaoTiHei-Regular, YouSheBiaoTiHei;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 4.6875rem;
    text-shadow: 1.25rem 0.4375rem #323A42;
    position: absolute;
    left: 11.75rem;
    top: 8.1875rem;
}
.cards{
    width: 84.25rem;
    height: 37.5rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    position: absolute;
    left: 14.3125rem;
    top: 20.875rem;
}
.card1{
    width: 56.25rem;
    height: 37.5rem;
    background: url("../../../img/ges/monitor/page3-card1back.png") no-repeat center;
    background-size: 100% 100%;
    margin-left: 0;
    z-index: 1000;
    position: relative;
}
.card1 div{
    width: 6.4375rem;
    height: 1.8125rem;
    font-size: 1.5rem;
    font-family: PingFang SC-Bold, PingFang SC;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.75rem;
    position: absolute;
    right: 0;
    top: 37.5rem;
    display: none;
}
.card2{
    width: 49.3125rem;
    height: 32.875rem;
    background: url("../../../img/ges/monitor/page3-card2back.png") no-repeat center;
    background-size: 100% 100%;
    margin-left: -32.5rem;
    z-index: 100;
    position: relative;
}
.card2 div{
    width: 6.4375rem;
    height: 1.8125rem;
    font-size: 1.5rem;
    font-family: PingFang SC-Bold, PingFang SC;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.75rem;
    position: absolute;
    right: 0;
    top: 32.875rem;
    display: inline;
}
.card3{
    width: 34.125rem;
    height: 22.75rem;
    background: url("../../../img/ges/monitor/page3-card3back.png") no-repeat center;
    background-size: 100% 100%;
    margin-left: -22.9375rem;
    z-index: 10;
    position: relative;
}
.card3 div{
    width: 6.4375rem;
    height: 1.8125rem;
    font-size: 1.5rem;
    font-family: PingFang SC-Bold, PingFang SC;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.75rem;
    position: absolute;
    right: 0;
    top: 22.75rem;
    display: inline;
}
.page4{
    width: 100%;
    height: 52.1875rem;
    background:#FFFFFF;
    position: relative;
}
.page4-main{
    max-width: 120rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    margin: auto;
}
.page4-title{
    width: 16.875rem;
    height: 3.25rem;
    /*background: url("../../../img/ges/monitor/page4-title.png") no-repeat center;*/
    /*background-size: 100% 100%;*/
    position: absolute;
    margin-top: 5.0625rem;
}
.page4-t1{
    width: 14.6875rem;
    height: 2.875rem;
    font-size: 4rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    line-height: 2.875rem;
    white-space: nowrap;
    margin-top: 0;
    margin-left: 0;
}
.page4-t2{
    width: 14.6875rem;
    height: 2.875rem;
    font-size: 4rem;
    font-family: YouSheBiaoTiHei;
    font-weight: 400;
    color: #000000;
    opacity: 0.15;
    line-height: 2.875rem;
    white-space: nowrap;
    margin-top: -2.5rem;
    margin-left: 2.1875rem;
}
.indicator{
    width: 85rem;
    height: 11.25rem;
    position: absolute;
    margin-top: 12.0625rem;
}
.qiu1,.qiu2,.qiu3,.qiu4,.qiu5,.qiu6,.qiu02,.qiu03,.qiu04,.qiu05{
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    position: absolute;
}
.hengxian1,.hengxian5{
    width: 6.875rem;
    height: 0.25rem;
    position: absolute;
}
.hengxian2,.hengxian4{
    width: 21.375rem;
    height: 0.25rem;
    position: absolute;
}
.hengxian3{
    width: 21.625rem;
    height: 0.25rem;
    position: absolute;
}
.shuxian2,.shuxian3,.shuxian4,.shuxian5{
    width: 0.25rem;
    height: 8.75rem;
    position: absolute;
}
.qiu1{
    background: #0E235B;
    margin-top: 0;
    margin-left: 0;
}
.hengxian1{
    background: #0E235B;
    margin-top: 0.5rem;
    margin-left: 1.25rem;
}
.qiu2{
    background: #0D2974;
    margin-top: 0;
    margin-left: 8.125rem;
}
.hengxian2{
    background: #0D2974;
    margin-top: 0.5rem;
    margin-left: 9.375rem;
}
.shuxian2{
    background: #0D2974;
    margin-top: 1.25rem;
    margin-left: 8.625rem;
}
.qiu02{
    background: #0D2974;
    margin-top: 10rem;
    margin-left: 8.125rem;
}
.qiu3{
    background: #0E3497;
    margin-top: 0;
    margin-left: 30.75rem;
}
.hengxian3{
    background: #0E3497;
    margin-top: 0.5rem;
    margin-left: 32rem;
}
.shuxian3{
    background: #0E3497;
    margin-top: 1.25rem;
    margin-left: 31.25rem;
}
.qiu03{
    background: #0E3497;
    margin-top: 10rem;
    margin-left: 30.75rem;
}
.qiu4{
    background: #0F3DB6;
    margin-top: 0;
    margin-left: 53.625rem;
}
.hengxian4{
    background: #0F3DB6;
    margin-top: 0.5rem;
    margin-left: 54.875rem;
}
.shuxian4{
    background: #0F3DB6;
    margin-top: 1.25rem;
    margin-left: 54.125rem;
}
.qiu04{
    background: #0F3DB6;
    margin-top: 10rem;
    margin-left: 53.625rem;
}
.qiu5{
    background: #0E46D7;
    margin-top: 0;
    margin-left: 75.625rem;
}
.hengxian5{
    background: #0E46D7;
    margin-top: 0.5rem;
    margin-left: 76.875rem;
}
.shuxian5{
    background: #0E46D7;
    margin-top: 1.25rem;
    margin-left: 76.125rem;
}
.qiu05{
    background: #0E46D7;
    margin-top: 10rem;
    margin-left: 75.625rem;
}
.qiu6{
    background: #1758FF;
    margin-top: 0;
    margin-left: 83.75rem;
}
.page4-contents{
    width: 86.875rem;
    height: 19.375rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    position: absolute;
    margin-top: 26.5625rem;
}
.step1{
    width: 19.375rem;
    height: 19.375rem;
    background: url("../../../img/ges/monitor/step1-back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.step1-title{
    width: 9.375rem;
    height: 1.375rem;
    background: url("../../../img/ges/monitor/step1-title.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 2.5rem;
}
.step1-txt{
    width: 14.0625rem;
    height: 6.9375rem;
    font-size: 1.375rem;
    font-family: Source Han Sans CN;
    font-weight: 100;
    color: #000000;
    line-height: 1.875rem;
    letter-spacing: 0;
    margin-top: 1.875rem;
}
.step-txt{
    width: 14.0625rem;
    height: 6.9375rem;
    font-size: 1.375rem;
    font-family: Source Han Sans CN;
    font-weight: 100;
    color: #000000;
    line-height: 1.875rem;
    letter-spacing: 0.0625rem;
    margin-top: 1.875rem;
}
.step1-lable{
    width: 3.0625rem;
    height: 3.125rem;
    background: url("../../../img/ges/monitor/step1-lable.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 1.0625rem;
    margin-left: -10.8125rem;
}
.step2{
    width: 19.375rem;
    height: 19.375rem;
    background: url("../../../img/ges/monitor/step2-back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
    margin-left: 3.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.step2-title{
    width: 9.375rem;
    height: 1.375rem;
    background: url("../../../img/ges/monitor/step2-title.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 2.5rem;
}
.step2-lable{
    width: 3.0625rem;
    height: 3.125rem;
    background: url("../../../img/ges/monitor/step2-lable.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 1.0625rem;
    margin-left: -10.8125rem;
}
.step3{
    width: 19.375rem;
    height: 19.375rem;
    background: url("../../../img/ges/monitor/step3-back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
    margin-left: 3.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.step3-title{
    width: 9.375rem;
    height: 1.375rem;
    background: url("../../../img/ges/monitor/step3-title.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 2.5rem;
}
.step3-lable{
    width: 3.0625rem;
    height: 3.125rem;
    background: url("../../../img/ges/monitor/step3-lable.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 1.0625rem;
    margin-left: -10.8125rem;
}
.step4{
    width: 19.375rem;
    height: 19.375rem;
    background: url("../../../img/ges/monitor/step4-back.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;
    margin-left: 3.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.step4-title{
    width: 9.375rem;
    height: 1.375rem;
    background: url("../../../img/ges/monitor/step4-title.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 2.5rem;
}
.step4-lable{
    width: 3.0625rem;
    height: 3.125rem;
    background: url("../../../img/ges/monitor/step4-lable.png") no-repeat center;
    background-size: 100% 100%;
    margin-top: 1.0625rem;
    margin-left: -10.8125rem;
}
.footer {
    height: 35rem;
}
