.main { width: 100%; // height: 600px; .header { position: relative; z-index: 1; height: 120px; background: rgb(221, 223, 229); border-radius: 20px 20px 0 0; .show { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; width: 100%; height: 120px; padding-left: 68px; .tileline { position: relative; display: flex; align-items: center; color: #000; font-weight: 600; font-size: 20px; .hasPerson { display: flex; align-items: center; justify-content: center; width: 50px; height: 20px; margin-left: 10px; padding: 0 6px; color: #626c78; font-size: 11px; white-space: nowrap; background-color: #edf1f5; border-radius: 10px; } .titleIcon { position: absolute; top: 0; left: -36px; } .edit { margin-left: 16px; color: #c4c4c4; font-size: 18px; cursor: pointer; } } .timeLine { margin-top: 9px; color: #4d5262; font-size: 15px; .pdr10 { padding-right: 10px; } } } .editShow { width: 100%; height: 120px; padding: 20px 40px 0 40px; background: #fff; } } .close { position: absolute; top: 15px; right: 15px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: #c4c4c4; font-size: 20px; border-radius: 100%; cursor: pointer; transition: background-color 0.1s cubic-bezier(0.075, 0.82, 0.165, 1); &:hover { background-color: #fff; } } .content { padding: 0 0 110px; background-color: #eceff4; border-radius: 0 0 20px 20px; .infoList { display: flex; justify-content: space-between; padding: 18px 150px; // align-items: center; // justify-content: center; .item { text-align: center; .title { color: #4d5262; font-size: 10px; line-height: 1; } .num { color: #140050; font-size: 24px; line-height: 34px; } .describe { color: #c4c4c4; font-size: 12px; line-height: 1; } } } .devices { padding: 0 36px; } } .foot { display: flex; margin-top: 40px; .l { width: 65px; height: 86px; color: #000; font-size: 18px; line-height: 86px; text-align: center; background: rgba(0, 220, 35, 0.2); border-radius: 5px; } .r { flex: 1; padding-left: 22px; color: #4d5262; line-height: 22px; } } }