.left2 { margin-right: 12px; } .d-title { margin-top: 17px; margin-left: 36px; display: flex; align-items: center; > img { width: 26px; height: 26px; } > div { font-size: 18px; font-family: Alibaba PuHuiTi; font-weight: 400; color: #ffffff; margin-left: 2px; } } .grid-title { margin-top: 5px; height: 40px; } .frame { padding: 20px 20px 10px; &-row { width: 580px; height: 36px; background: #24bef1; border-radius: 1px; font-size: 20px; font-family: Alibaba PuHuiTi; font-weight: bold; color: #ffffff; text-shadow: 0px 2px 4px #007fa9; text-align: center; line-height: 36px; } &-onerow { position: relative; margin-top: 5px; width: 578px; height: 30px; background: rgba(36, 190, 241, 0.7); border-radius: 2px; text-align: center; line-height: 30px; .rowitem { font-size: 18px; font-family: Alibaba PuHuiTi; font-weight: 400; color: #ffffff; cursor: pointer; } } &-arrow { margin-top: 5px; display: flex; justify-content: center; > img { height: 34px; width: 34px; } } &-multirow { width: 580px; height: 60px; border: 2px dashed #92b5cd; border-radius: 2px; display: flex; justify-content: space-around; align-items: center; .multirowitem { position: relative; width: 174px; height: 30px; background-color: rgba(36, 190, 241, 0.7); border-radius: 2px; line-height: 30px; text-align: center; font-size: 18px; font-family: Alibaba PuHuiTi; font-weight: 400; color: rgb(255, 255, 255); cursor: pointer; } } } .grid { margin-top: 3px; display: flex; justify-content: space-between; .grid-item { text-align: center; .frame-arrow2 { > img { height: 24px; width: 24px; } } .grid-member { width: 285px; height: 254px; background: rgba(36, 190, 241, 0.3); border-radius: 4px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; padding: 14px 0 14px 14px; &-title { width: 100px; height: 26px; background: rgba(255, 255, 255, 0.8); border-radius: 2px; text-align: center; font-size: 16px; font-family: Alibaba PuHuiTi; font-weight: 500; color: #006fbd; line-height: 26px; } &-main { display: flex; justify-content: flex-start; align-content: flex-start; flex-wrap: wrap; overflow-y: auto; overflow-x: hidden; height: 200px; .memberitem { margin-top: 14px; margin-right: 12px; width: 76px; height: 26px; background: rgba(36, 190, 241, 0.8); border-radius: 2px; position: relative; font-size: 16px; font-family: Alibaba PuHuiTi; font-weight: 300; color: #ffffff; line-height: 26px; cursor: pointer; } &::-webkit-scrollbar { /*滚动条整体样式*/ width: 6px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } &::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ background: linear-gradient(-90deg, #09b8e5 0%, #09f0e3 99%); border-radius: 3px; } &::-webkit-scrollbar-track { /*滚动条里面轨道*/ // box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: #428ba2; border-radius: 3px; } } } } } .left2-static { margin-top: 10px 23px; display: flex; justify-content: space-around; .static-item { &-title { font-size: 16px; font-family: Alibaba PuHuiTi; font-weight: 400; color: #c1e8ff; } &-num { font-size: 24px; font-family: Microsoft YaHei; font-weight: bold; color: #ffffff; } } }