.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%; z-index: 9; iframe { width: 100%; height: 100%; } } // 其他附件 .t4IFileBox { width: 1252px; height: calc(100% - 240px); position: absolute; left: 50%; top: 140px; transform: translateX(-50%); z-index: 8; .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%; } img{ object-fit: contain !important; } .lookImg{ background-color:transparent; // opacity: 0 !important; } } .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: 40px; height: 40px; left: -50px; z-index: 12; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; } .R_right { cursor: pointer; position: absolute; top: 50%; width: 40px; height: 40px; right: -50px; 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 40px; text-align: center; z-index: 10; bottom: 5px; left: 50%; transform: translateX(-50%); width: 80%; height: 80px; font-size: 16px; color: #fff; overflow-y: auto; span { font-weight: 700; } } .rightIconBox { position: absolute; z-index: 10; bottom: 20px; right: 30px; width: 40px; .rightIconRow { position: relative; cursor: pointer; margin-bottom: 15px; // 点赞 .moveImg { pointer-events: none; position: absolute; bottom: -10px; left: -20px; color: var(--themeColor); width: 60px; &>img { width: 40px; height: 40px; } } } } // 滚动弹幕 .barrMove { z-index: 11; pointer-events: none; position: absolute; right: -1300px; top: 130px; background-color: rgba(98, 82, 65, 0.6); backdrop-filter: blur(6px); padding: 8px 30px; border-radius: 36px; overflow: hidden; &>h3 { font-size: 18px; color: #fff; } &>P { font-size: 12px; color: #fff; opacity: .6; } } } }