html { background-color: #EEF2F5; } .project { width: 394px; margin: 50px auto; border-radius: 8px; background-color: #fff; padding-bottom: 14px; } .project * { padding: 0; margin: 0; box-sizing: border-box; text-decoration: auto; word-break: break-word; } .project .one-line-display { word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .project .flexflex { display: flex; } .project .flexcenter { display: flex; justify-content: center; align-items: center; } .project .flexjcenter { display: flex; justify-content: center; } .project .flexacenter { display: flex; align-items: center; } .project .flex1 { flex: 1; } .project .flexcolumn { display: flex; flex-direction: column; } .project .project-list { flex-wrap: wrap; justify-content: space-between; margin-bottom: 4px; } .project .project-list .project-item { width: 460px; width: 100%; background-color: #ffffff; padding: 20px 16px 10px; position: relative; } .project .project-list .project-item:not(:last-of-type) { border-bottom: 1px dotted rgba(215, 215, 215, 0.69); } .project .project-list .project-item .project-school { font-size: 14px; color: #333333; position: absolute; top: 20px; right: 16px; } .project .project-list .project-item .project-school .project-school-icon { height: 18px; margin-right: 8px; } .project .project-list .project-item .project-name { font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-weight: 650; font-style: normal; font-size: 16px; color: #000000; margin-bottom: 6px; padding-right: 80px; } .project .project-list .project-item .project-english { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; font-style: normal; font-size: 13px; margin-bottom: 10px; color: #7f7f7f; } .project .project-list .project-item .project-introduce { color: #555555; font-size: 14px; margin-bottom: 9px; flex-wrap: wrap; } .project .project-list .project-item .project-introduce .project-quantity { font-family: "Arial-Black", "Arial Black", sans-serif; font-weight: 900; color: #000000; margin-left: 8px; } .project .project-list .project-item .project-introduce .project-line { color: #d7d7d7; margin: 0 7px; } .project .project-list .project-item .project-word { background-color: #f9f8f8; border-radius: 5px; padding: 9px 10px; font-size: 14px; color: #7f7f7f; margin-bottom: 12px; } .project .project-list .project-item .project-word .project-img { width: 15px; height: 10px; } .project .project-btn { width: 361px; height: 40px; line-height: 40px; background-color: #333333; border-radius: 141px; font-size: 16px; color: #ffffff; display: flex; justify-content: center; align-items: center; cursor: pointer; margin: 0 auto; } .project .project-btn .project-btn-img { width: 18px; height: 18px; margin-left: 10px; } .project .project-tag { flex-wrap: wrap; } .project .project-tag .project-tag-item { width: fit-content; height: 20px; line-height: 20px; background-color: #f9f8f8; border: 1px solid #aaaaaa; border-radius: 6px; padding: 0 6px; font-size: 12px; color: #7f7f7f; margin-right: 10px; margin-bottom: 10px; display: flex; align-items: center; } .project .project-tag .project-tag-item.project-gray { background-color: #333333; color: #ffffff; border: none; } .project .project-tag .project-tag-item.project-semester { color: #ffffff; background-color: #f95d5d; border: none; } .project .project-tag .project-tag-item.project-admissions { background-color: #73d1e5; border: none; color: #fff; }