.Tab4Info { position: absolute; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; background-size: 100% 100%; :global { .t4ItoBack { cursor: pointer; position: absolute; z-index: 10; top: 30px; left: 36px; } // 顶部名字 .topName { position: absolute; z-index: 10; left: 50%; transform: translateX(-50%); top: 40px; font-weight: 700; font-size: 24px; color: var(--themeColor); letter-spacing: 4px; } // 顶部按钮 .R_typeCutBox { position: absolute; z-index: 10; left: 50%; transform: translateX(-50%); top: 86px; height: 36px; display: flex; .R_typeCutRow { margin: 0 10px; cursor: pointer; color: var(--themeColor); line-height: 36px; text-align: center; height: 36px; padding: 0 30px; border-radius: 0 10px 0 10px; border: 1px solid var(--themeColor); } .R_typeCutRowAc { background-color: var(--themeColor); color: #4A403D; } } // 主体模型 .t4IifrBox { position: absolute; top: 0; left: 0; width: 100%; height: 100%; iframe { width: 100%; height: 100%; } } // 其他附件 .t4IFileBox { width: 1252px; height: calc(100% - 230px); position: absolute; left: 50%; top: 140px; transform: translateX(-50%); z-index: 10; .R1_row { width: 100%; height: 100%; text-align: center; position: absolute; top: 0; left: 0; opacity: 0; pointer-events: none; video { max-width: 100%; max-height: 100%; } } .R1_rowAc { opacity: 1; pointer-events: auto; } .showIndBox { position: absolute; z-index: 10; bottom: 10px; left: 50%; transform: translateX(-50%); font-size: 16px; color: #4A403D; background-color: var(--themeColor); padding: 5px 10px; border-radius: 20px; } } // 左右按钮 .R_left { cursor: pointer; position: absolute; top: 50%; width: 50px; height: 50px; left: 30px; z-index: 12; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; } .R_right { cursor: pointer; position: absolute; top: 50%; width: 50px; height: 50px; right: 30px; z-index: 12; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; } .R_arrowNo { opacity: .5; pointer-events: none; } // 底部文字集合 .t4ITxts { position: absolute; padding: 0 10px; text-align: center; z-index: 10; bottom: 5px; left: 0; width: 100%; height: 80px; } } }