.baozhang { position: absolute; top: 73px; height: 720px; left: 20px; right: 240px; visibility: hidden; // display: none; background: #ffffff; padding: 10px 20px; h3 { text-align: left; padding: 10px; padding-left: 20px; // padding-left: 20px; border-bottom: 1px solid #e1e1e1; } b { font-size: 26px; margin-right: 10px; color: black; } .top { display: flex; justify-content: space-between; > div { width: 49%; box-shadow: 0 0 1px 1px #e1e1e1; } .flex { display: flex; justify-content: space-between; align-items: center; span { padding: 10px 20px; color: #797979; } } } .bottom { box-shadow: 0 0 1px 1px #e1e1e1; margin-top: 10px; > .flex { display: flex; justify-content: space-between; align-items: center; padding: 5px 20px 10px; .left { // height: 500px; width: 30%; color: #797979; > div { height: 150px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 10px 0; width: 100%; background: #ffffff; box-shadow: 0 0 1px 1px #e1e1e1; padding-bottom: 10px; span { // margin-top: 10px; } img { width: 40px; margin: 10px 0; } // img:nth-child(2) { // width: 18px; // } } } .right { width: 68%; height: 480px; box-shadow: 0 0 1px 1px #e1e1e1; padding-bottom: 20px; > :nth-child(1) { display: flex; justify-content: space-between; align-items: center; padding: 20px 40px 0px 20px; > :nth-child(1) { display: flex; align-items: center; font-weight: bold; font-size: 18px; img { height: 25px; } } > :nth-child(2) { span { padding: 5px 10px; border: 1px solid rgb(177, 175, 175); border-radius: 3px; margin-left: -4px; } } .mapButtonColor { color: #198eff; border: 1px solid #198eff !important; box-shadow: 0 0 1px 1px #c2e3ff; } } p { // text-align: right; margin-left: 70%; margin-top: 20px; margin-bottom: 5px; } .peizu { display: flex; justify-content: left; position: relative; .echart2 { width: 37%; height: 400px; margin-left: 20%; // max-width: 200px; // margin: 0 auto; } table { // width: 40%; position: absolute; left: 70%; text-align: left; // td { // width: 100px; // } tbody { td { padding: 7px 0; padding-right: 20px; } tr { // line-height: 20px; > :nth-child(2) { color: #198eff; } } } } } .zulin { display: flex; justify-content: left; display: none; position: relative; .echart3 { width: 37%; height: 400px; // max-width: 200px; // margin: 0 auto; margin-left: 20%; } table { position: absolute; left: 70%; text-align: left; tbody { td { padding: 7px 0; padding-right: 20px; } tr { // line-height: 20px; > :nth-child(2) { color: #198eff; } } } } } } } } }