* { padding: 0; margin: 0; box-sizing: border-box; } .admission-officer { min-height: 100vh; background-color: rgba(246, 246, 246, 1); .flexflex { display: flex; } .flexcenter { display: flex; justify-content: center; align-items: center; } .flexacenter { display: flex; align-items: center; } .flex1 { flex: 1; } .admission-head { width: 100%; height: 144px; background-color: rgba(60, 125, 233, 1); position: relative; .admission-head-logo { width: 223px; height: 50px; position: absolute; top: 60px; left: calc((100vw - 1200px) / 2); } .admission-head-box { min-width: 1200px; height: 216px; position: relative; top: 0; left: 50%; transform: translateX(-50%); overflow: hidden; } .admission-head-gray { position: absolute; top: 122px; left: 50%; transform: translateX(-50%); width: 1920px; height: 91px; &::after { content: ""; position: absolute; top: 0; right: 0; height: 91px; width: calc((100vw - 1920px) / 2); background-color: #f6f6f6; transform: translateX(100%); } &::before { content: ""; position: absolute; top: 0; left: 0; height: 91px; width: calc((100vw - 1920px) / 2); background-color: #f6f6f6; transform: translateX(-100%); } } .admission-head-1 { position: absolute; top: 122px; left: 50%; transform: translateX(-50%); width: 1920px; height: 68px; } .admission-head-2 { position: absolute; top: 122px; left: 50%; transform: translateX(-50%); width: 1920px; height: 91px; } } .admission-body { width: 1200px; margin: 0 auto; padding-top: 54px; position: relative; .interview-box { width: 100%; height: 435px; margin: 0 auto; position: relative; z-index: 1; .bj { width: 100%; height: 435px; position: absolute; top: 0; left: 0; z-index: -1; } .left { padding-top: 14px; padding-left: 20px; .head { margin-bottom: 11px; .icon { width: 38px; height: 50px; margin-right: 1px; } .name { width: 125px; height: 36px; } } .content { width: 592px; height: 333px; position: relative; border-radius: 10px; overflow: hidden; .img { width: 592px; height: 333px; } .play-btn { width: 50px; height: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .bottom { position: absolute; left: 0; bottom: 0; width: 100%; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.047) 0%, rgba(0, 0, 0, 1) 100%); padding: 17px 22px 13px; .title { font-weight: 650; font-style: normal; font-size: 16px; color: #ffffff; font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; margin-bottom: 5px; } .subtitle { font-size: 13px; color: #ffffff; font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; } } } } } } }