* { padding: 0; margin: 0; } body, html { margin: 0; padding: 0; min-width: 1500px; } .toplogo { display: flex; align-items: center; font-family: DOUYU; font-weight: normal; font-size: 30px; color: #186ff0; height: 66px; border-bottom: 1px solid #b7c7dc; cursor: pointer; } .toplogo img { margin: 0 20px; } .backbutton { width: 117px; height: 42px; background: #deedff; border-radius: 10px; font-family: Microsoft YaHei; font-weight: 400; font-size: 16px; color: #2474f1; display: flex; align-items: center; justify-content: center; margin-right: 10px; cursor: pointer; } .backbutton img { margin-right: 0.625rem; } .title { display: flex; align-items: center; margin-top: 20px; margin-bottom: 10px; } .title .more { color: #666; cursor: pointer; } .title span { font-size: 20px; color: #333; } .contentleft { width: 50%; height: 100%; min-width: 952px; background-color: #edf5ff; height: 1384px; padding: 0 10px; box-sizing: border-box; } @font-face { font-family: "DOUYU"; src: url("../fonts/DOUYUFONT-2.OTF"); font-weight: normal; font-style: normal; } .yqjj { height: 118px; background: #ffffff; font-size: 16px; color: #333333; line-height: 30px; padding: 15px 20px; box-sizing: border-box; text-indent: 40px; } .jbqk { display: flex; justify-content: space-between; } .jbqk .list { width: 32.8%; height: 134px; background-size: 100% 100%; display: flex; flex-direction: column; padding-top: 20px; font-family: Microsoft YaHei; padding-left: 96px; box-sizing: border-box; font-size: 20px; color: #ffffff; } .jbqk .list p { margin-bottom: 10px; } .jbqk .list p span:first-child { font-size: 26px; font-weight: bold; } .qwys { display: flex; justify-content: space-evenly; } .qwys .list { width: 19%; height: 179px; background: #ffffff; display: flex; flex-direction: column; font-size: 16px; color: #788da6; padding-left: 20px; box-sizing: border-box; justify-content: center; cursor: pointer; transition: background-color 2.5s; /* 背景色变化过渡时间 */ overflow: hidden; /* 隐藏超出部分 */ } .qwys .list:hover { filter: brightness(120%); background-color: #afb2b6; /* color: #fff; */ } .qwys ul { padding-left: 30px; margin-top: 10px; } .qwys .list li { height: 25px; } .qwys .list .name { font-size: 26px; color: #4b98f6; display: flex; align-items: center; } .qwys .list .name img { margin-right: 10px; } .contentleft .left { width: 58.5%; } .contentleft .title > img { margin-right: 5px; } .contentleft .right { width: 39%; } .yqhd { font-size: 16px; color: #333333; height: 179px; background: #ffffff; padding: 10px 0; box-sizing: border-box; overflow-y: scroll; } .yqhd::-webkit-scrollbar { width: 0px; height: 0px; } .yqhd > ul { height: 100%; display: flex; flex-direction: column; margin-left: 30px; } .yqhd ul li { cursor: pointer; margin-bottom: 20px; } .yqhd ul li span { display: block; word-break: break-all; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .mxqy { height: 81px; padding: 10px 5px; box-sizing: border-box; background: #ffffff; overflow: hidden; position: relative; } .mxqy > ul { height: 100%; display: flex; flex-wrap: wrap; list-style-type: none; align-content: flex-start; position: absolute; width: 100%; overflow-y: scroll; } .mxqy > ul::-webkit-scrollbar { width: 0px; height: 0px; } .mxqy > ul li { cursor: pointer; margin-left: 5px; margin-top: 5px; width: 71px; height: 45px; display: flex; align-items: center; } .mxqy ul img { width: 71px; max-height: 45px; } .zcwj { font-size: 16px; color: #333333; height: 179px; background: #ffffff; padding: 10px 0; box-sizing: border-box; overflow-y: scroll; } .zcwj::-webkit-scrollbar { width: 0px; height: 0px; } .zcwj > ul { height: 100%; display: flex; flex-direction: column; margin-left: 30px; } .zcwj li { margin-bottom: 10px; } .zcwj li > div { display: -webkit-box; line-height: 20px; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; word-break: break-all; padding: 0 10px; box-sizing: border-box; cursor: pointer; } .ztcr { height: 355px; background: #ffffff; display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: flex-start; } .ztcr .list { width: 32%; cursor: pointer; margin-left: 5px; margin-top: 10px; } .ztcr .list .bg { width: 100%; height: 96px; position: relative; } .ztcr .list .bg img { width: 100%; height: 100%; } .ztcr .list .number { width: 100%; height: 30px; line-height: 30px; background: #000000; opacity: 0.51; font-size: 20px; color: #fc6f03; position: absolute; bottom: 0; padding-left: 10px; box-sizing: border-box; } .ztcr .list .title { width: 100%; font-size: 20px; color: #333333; word-break: break-all; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; margin: 5px 0; } .ztcr .list .content { font-size: 16px; color: #333333; opacity: 0.6; word-break: break-all; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; } .tdcr { height: 355px; background: #ffffff; } .tdcr .top { display: flex; justify-content: space-between; border-bottom: 1px solid #b7c7dc; padding-top: 20px; padding-left: 30px; padding-bottom: 10px; box-sizing: border-box; } .tdcr .content { height: calc(100% - 52px); overflow-y: scroll; } .tdcr .content::-webkit-scrollbar { width: 0px; height: 0px; } .tdcr .left { width: 62%; } .tdcr .right { width: 34%; } .tdcr .list { display: flex; justify-content: space-between; padding-top: 20px; padding-left: 30px; box-sizing: border-box; cursor: pointer; } .tdcr .list .right { } .tsfw { height: 188px; background: #ffffff; display: flex; } .tsfw .list { display: flex; flex-direction: column; width: 25%; align-items: center; justify-content: center; font-size: 20px; color: #333333; cursor: pointer; } .tsfw .list img { margin-bottom: 20px; } .fwsxqd { height: 187px; background: #ffffff; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 10px; box-sizing: border-box; } .fwsxqd .list { height: 70px; background: #deedff; /* line-height: 26px; */ font-size: 20px; color: #4b98f6; cursor: pointer; margin-left: 6px; margin-top: 10px; width: 27.5%; display: flex; align-items: center; justify-content: center; flex-direction: column; white-space: nowrap; } .fwsxqd .list > div { width: 100%; height: 100%; border: 1px solid #4b98f6; padding: 0 5px; display: flex; align-items: center; justify-content: center; flex-direction: column; white-space: nowrap; } .fwsxqd .ather { padding: 0 22.5px; margin-left: 6px; margin-top: 10px; }