@charset "UTF-8"; body { width: 100%; height: 100%; background-color: #040c30; } #all { width: 100%; min-width: 1800px; max-width: 1920px; min-height: 800px; max-height: 1080px; margin: 0 auto; background-color: #040c30; } #all h1 { height: 75px; background-image: url("../src/images/headimg1.png"); background-position: center; background-size: 100% 100%; text-align: center; line-height: 75px; font-size: 32px; color: #01c5f5; letter-spacing: 5px; font-family: 'Microsoft YaHei'; } #all > .top { margin-top: 60px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #all > .top > div { margin: 0 20px; } #all > .top > .left { width: 29%; height: 350px; background-color: #0e2039; border-radius: 20px; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; } #all > .top > .left > h2 { font-size: 18px; color: #01dbfc; background-image: url("../src/images/kuang_da.png"); width: 220px; height: 36px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 36px; position: absolute; left: 28%; top: -16px; vertical-align: baseline; } #all > .top > .left > h2 img { width: 20px; height: 20px; } #all > .top > .left .service { width: 90%; height: 110px; margin: 0 auto; margin-top: 40px; margin-bottom: 30px; position: relative; } #all > .top > .left .service .top { width: 100%; height: 4px; background-image: url("../src/images/line.png"); background-position: center; background-size: 100% 100%; } #all > .top > .left .service .bot { width: 100%; height: 4px; background-image: url("../src/images/line.png"); background-position: center; background-size: 100% 100%; position: absolute; bottom: 0; } #all > .top > .left .service h3 { font-family: 'Microsoft YaHei'; font-size: 12px; color: #02dafe; background-image: url("../src/images/kuang_xiao.png"); width: 95px; height: 24px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 24px; position: absolute; left: 40%; top: -10px; } #all > .top > .left .service .context { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; } #all > .top > .left .service .context p { text-align: center; margin-top: 24px; font-size: 24px; color: #a8b3e6; } #all > .top > .left .service .context p span { display: block; } #all > .top > .left .service .context p span b { font-size: 14px; color: #5280b6; } #all > .top > .left .service .context p span img { width: 16px; height: 16px; vertical-align: middle; } #all > .top > .left .settled { width: 90%; height: 110px; margin: 0 auto; margin-top: 40px; position: relative; } #all > .top > .left .settled .top { width: 100%; height: 4px; background-image: url("../src/images/line.png"); background-position: center; background-size: 100% 100%; } #all > .top > .left .settled .bot { width: 100%; height: 4px; background-image: url("../src/images/line.png"); background-position: center; background-size: 100% 100%; position: absolute; bottom: 0; } #all > .top > .left .settled h3 { font-family: 'Microsoft YaHei'; font-size: 12px; color: #02dafe; background-image: url("../src/images/kuang_xiao.png"); width: 95px; height: 24px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 24px; position: absolute; left: 40%; top: -10px; } #all > .top > .left .settled .context { padding: 0 10px; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } #all > .top > .left .settled .context p { text-align: center; margin-top: 24px; font-size: 24px; color: #a8b3e6; } #all > .top > .left .settled .context p > span { display: block; } #all > .top > .left .settled .context p > span b { font-size: 14px; color: #5280b6; } #all > .top > .left .settled .context p > span img { width: 16px; height: 16px; vertical-align: middle; } #all > .top > .left .settled .context p:nth-of-type(1) > span:last-child { color: #01f6ff; } #all > .top > .left .settled .context p:nth-of-type(2) > span:last-child { color: #22c223; } #all > .top > .left .settled .context p:nth-of-type(3) > span:last-child { color: #f8b01b; } #all > .top > .middle { width: 40%; height: 350px; background-color: #0e2039; border-radius: 20px; position: relative; padding: 0 20px; -webkit-box-sizing: border-box; box-sizing: border-box; } #all > .top > .middle > h2 { font-family: 'Microsoft YaHei'; font-size: 18px; color: #01dbfc; background-image: url("../src/images/kuang_zhong.png"); width: 320px; height: 36px; background-position: center; background-size: 100% 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; left: 32%; top: -15px; vertical-align: baseline; } #all > .top > .middle > h2 img { width: 20px; height: 20px; margin-right: 10px; } #all > .top > .middle #echarts1 { width: 90%; height: 150px; margin: 10px auto; margin-top: 20px; } #all > .top > .middle #echarts3 { width: 90%; height: 150px; margin: 10px auto; } #all > .top > .right { width: 29%; height: 350px; background-color: #0e2039; border-radius: 20px; position: relative; } #all > .top > .right > h2 { font-family: 'Microsoft YaHei'; font-size: 18px; color: #01dbfc; background-image: url("../src/images/kuang_da.png"); width: 220px; height: 36px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 36px; position: absolute; left: 30%; top: -16px; vertical-align: baseline; } #all > .top > .right > h2 img { width: 20px; height: 20px; } #all > .top > .right #echarts2 { width: 94%; height: 300px; margin: 30px auto; } #all > .bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 50px; padding-bottom: 31px; } #all > .bottom > div { margin: 0 20px; } #all > .bottom > .left { width: 49%; height: 480px; background-color: #0e2039; border-radius: 20px; position: relative; } #all > .bottom > .left > h2 { font-family: 'Microsoft YaHei'; font-size: 18px; color: #01dbfc; background-image: url("../src/images/kuang_da.png"); width: 220px; height: 36px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 36px; position: absolute; left: 36%; top: -16px; vertical-align: baseline; } #all > .bottom > .left > h2 img { width: 24px; height: 20px; } #all > .bottom > .left #echarts5 { width: 30%; height: 200px; margin-top: 20px; } #all > .bottom > .left #echarts6 { width: 94%; height: 230px; margin-top: 20px; } #all > .bottom > .left #echarts7 { width: 68%; height: 200px; margin-top: 20px; } #all > .bottom > .middle { width: 49%; height: 480px; background-color: #0e2039; border-radius: 20px; position: relative; } #all > .bottom > .middle > h2 { font-family: 'Microsoft YaHei'; font-size: 18px; color: #01dbfc; background-image: url("../src/images/kuang_zhong.png"); width: 280px; height: 36px; background-position: center; background-size: 100% 100%; text-align: center; line-height: 36px; position: absolute; left: 36%; top: -15px; vertical-align: baseline; } #all > .bottom > .middle > h2 img { width: 20px; height: 20px; } #all > .bottom > .middle #echarts4 { width: 96%; height: 460px; margin: 20px auto; margin-left: 40px; } /*# sourceMappingURL=wisdomMedic.css.map */