.container1{ position: absolute; z-index: 10; top: 0; left: 0; right: 0; bottom: 0; } .main{ width: 100vw; height: 100vh; background-image: url("/admin/img/beijing_1.png"); background-repeat: no-repeat; background-size: 100% 100%; } .main .main1-header{ width: 100vw; height: 10.1vh; line-height: 10.1vh; background-image: url("/admin/img/top.png"); background-repeat: no-repeat; background-size: 100% 100%; text-align: center; font-size: 36px; font-weight: bold; color: #FFFFFF; } .main .main2{ width: 100vw; height: 89.9vh; padding: 0px 2.7vw; } .main .main2 .main2-left{ width: 22.1vw; height: 83.7vh; display: inline-block; float: left; background-image: url("/admin/img/zuo.png"); background-repeat: no-repeat; background-size: 100% 100%; } .main .main2 .main2-left .main2-left-top{ width: 100%; height: 41.8vh; } .main .main2 .main2-left .main2-left-top .work-type-mode{ width: 100%; text-align: right; padding-right: 10px; /*display: inline-block;*/ /*float: right;*/ margin-top: 5vh; } select{ background-color: #0E1E71; color: #A6D6FF; } select option{ border: 0; } .main2-left .main2-left-top-body{ width: 100%; height: 30vh; } .main .main2 .main2-left .main2-left-bottom{ width: 100%; height: 41.8vh; } .main2-left-bottom-header{ width: 100%; height: 4vh; line-height: 4vh; } .main2-left-bottom-header span{ font-size: 16px; /*font-weight: bold;*/ color: #0BE2DF; margin-left: 1vw; } .main2-left-bottom-header .work-type-mode{ width: auto; /*text-align: right;*/ padding-right: 10px; display: inline-block; float: right; } .main2-left-bottom .main2-left-bottom-body{ width: 100%; height: 30vh; text-align: center; padding-top: 8vh; } .main2-left-bottom .main2-left-bottom-body .response-time{ width: 100%; height: 20vh; position: relative; z-index: 20; } .main2-left-bottom .main2-left-bottom-body .response-time .img{ text-align: center; position: absolute; z-index: 10; } .main2-left-bottom .main2-left-bottom-body .response-time .img img{ width: 20vw; height: 20.8vh; } .main2-left-bottom .main2-left-bottom-body .response-time .min{ width: 100%; position: absolute; z-index: 8; font-size: 32px; font-weight: 500; color: #FFFFFF; text-align: center; top: -22px; } .main2-left-bottom .main2-left-bottom-body .response-time .min span{ font-size: 26px; } .main2-left-bottom .main2-left-bottom-body .response-time .comparison{ width: 100%; font-size: 15px; font-family: Source Han Sans CN; font-weight: bold; color: #0BE2DF; position: absolute; text-align: center; top: 22px; } .main2 .main2-content{ width: 48vw; height: 75vh; display: inline-block; float: left; margin-top: 4vh; background-image: url("/admin/img/zhongjian.png"); background-repeat: no-repeat; background-size: 100% 100%; margin-left: 1vw; margin-right: 1vw; } .main2-content .main2-content-one{ width: 24vw; height: 37.5vh; display: inline-block; float: left; padding-top: 1vh; } .main2-content .main2-content-one .main2-content-one-body{ width: 100%; height: 32.5vh; } .main2-content .main2-content-two{ width: 24vw; height: 37.5vh; display: inline-block; float: left; padding-top: 1vh; } .main2-content .main2-content-two .main2-content-two-body{ width: 100%; height: 32.5vh; padding-left: 1vw; } .main2-content .main2-content-three{ width: 24vw; height: 37.5vh; display: inline-block; float: left; padding-top: 1vh; } .main2-content .main2-content-three .main2-content-three-body{ width: 100%; height: 32.4vh; padding-left: 1vw; padding-right: 1vw; } .main2-content .main2-content-three .main2-content-three-body .type{ width: 100%; height: 5vh; line-height: 5vh; position: relative; } .main2-content .main2-content-three .main2-content-three-body .type span{ width: 5vw; font-size: 14px; /*font-weight: bold;*/ color: #0BE2DF; text-align: right; display: inline-block; overflow: hidden; } .main2-content .main2-content-three .main2-content-three-body .type .progress{ width: 14vw; display: inline-block !important; float: left; position: absolute; margin-left: 1vw; top: 0.8vh; background-color: #278DE4; } .main2-content .main2-content-three .main2-content-three-body .type .progress .progress-bar{ width: 14vw; overflow: hidden; background-color: #165B9F; } .main2-content-three-body text{ height: 5vh; line-height: 5vh; color: #72C5FF ; } .main2-content .main2-content-fore{ width: 24vw; height: 37.5vh; display: inline-block; float: left; padding-top: 1vh; } .main2-right{ width: 22.1vw; height: 83.7vh; display: inline-block; float: left; background-image: url(/admin/img/you.png); background-repeat: no-repeat; background-size: 100% 100%; } .main2-right .main2-right-one{ width: 22.1vw; height: 41.8vh; padding-top: 5vh; } .main2-right .main2-right-one .main2-right-one-body{ width: 22.1vw; height: 32.6vh; } .main2-right .main2-right-two{ width: 22.1vw; height: 41.8vh; padding-top: 1vh; } .main2-right .main2-right-two .main2-right-two-body{ width: 100%; height: 36vh; padding-left: 2vw; padding-right: 2vw; } .main2-right-two-body .waste{ width: 100%; height: 25vh; margin-top: 3vh; border: 2px solid #165B9F; border-radius: 4px; padding-left: 0.5vw; padding-right: 0.5vw; } .main2-right-two-body .waste .title{ width: 100%; font-size: 16px; font-weight: bold; color: #0BE2DF; text-align: center; margin-top: 3vh; } .main2-right-two-body .waste .kg{ width: 100%; font-size: 20px; font-weight: bold; color: #0BE2DF; margin-top: 1.5vh; text-align: center; } .main2-right-two-body .waste .line{ width: 100%; height: 2px; background-color: #165B9F; opacity: 0.6; margin-top: 2vh; } .main2-right-two-body .waste .hint{ width: 100%; font-weight: 400; color: #0BE2DF; margin-top: 1.5vh; text-align: center; font-size: 10px; } .main2-left-top-bottom{ width: 100%; height: 5vh; line-height: 5vh; margin-top: -2vh; } .main2-left-top-bottom .one{ width: auto; height: 5vh; display: inline-block; float: left; padding-left: 4%; } .main2-left-top-bottom .one .kuai{ width: 14px; height: 8px; display: inline-block; } .main2-left-top-bottom .one span{ font-size: 8px; font-family: Source Han Sans CN; font-weight: 400; color: #AAC9F7; } .main2-left-top-bottom .one .color1{ background: #0263FF; } .main2-left-top-bottom .one .color2{ background: #FFD131; } .main2-left-top-bottom .one .color3{ background: #F96E33; }