.Object2 { :global { .searchBox { padding: 20px 35px; display: flex; align-items: center; .row { margin-right: 50px; .cutShow { cursor: pointer; display: inline-block; width: 50px; height: 32px; border: 1px solid #ccc; border-radius: 4px 0 0 4px; font-size: 20px; text-align: center; } .cutShow2 { border-radius: 0 4px 4px 0; } .active { pointer-events: none; color: #d3b453; background-color: var(--themeColor); } } } .imgList { padding: 0 30px; width: 100%; height: calc(100% - 176px); overflow-y: auto; display: flex; flex-wrap: wrap; .imgListNone { color: var(--themeColor); font-size: 20px; margin: 0 auto; padding-top: 200px; } .imgListRow { cursor: pointer; transition: all 0.3s; width: 238px; height: 240px; border: 1px solid #ccc; margin: 0 20px 20px 0; &:nth-of-type(5n) { margin: 0 0 20px 0; } & > p { border-top: 1px solid #ccc; width: 100%; height: 40px; line-height: 40px; text-align: center; padding: 0 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } &:hover { box-shadow: 1px 1px 5px 1px #ccc; } } } .tableBox { padding: 0 30px; height: calc(100% - 176px); } .pageBox { width: 100%; display: flex; height: 60px; align-items: center; justify-content: center; } .downImgBox { position: fixed; z-index: 9999; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; font-size: 20px; letter-spacing: 3px; color: #fff; padding-bottom: 100px; } } }