香港大学
@@ -231,19 +214,64 @@
-
+
-
-
香港中文大学
-
+
香港中文大学
金融数学研究型硕士
Mphil in Financial Mathematics
-
- 专业排名 52
- | 学费HK$ 281,000
-
+
+
一句话描述独特之处，一句话描述独特之处。
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+
+
+ 已加入
+
+
+
+
-
+
+
+
+
搜索项目
+
+
+
+
+
项目对比
+
16
diff --git a/index/index.less b/index/index.less
index 5969510..e0bfe71 100644
--- a/index/index.less
+++ b/index/index.less
@@ -340,6 +340,7 @@ body {
// padding-top: 25px;
padding: 25px 24px;
align-items: flex-start;
+ position: relative;
.avatar {
width: 32px;
object-fit: contain;
@@ -386,6 +387,109 @@ body {
}
}
}
+
+ .operate {
+ // height: 80px;
+ position: relative;
+ position: absolute;
+ top: 24px;
+ right: 24px;
+ .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: rgba(219, 227, 253, 1);
+ border: 1px solid rgba(175, 181, 202, 1);
+ border-radius: 20px;
+ .img-add {
+ width: 12px;
+ height: 12px;
+ }
+ .img-dot {
+ width: 18px;
+ height: 8px;
+ }
+ }
+ .select {
+ position: absolute;
+ right: -24px;
+ top: -24px;
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ width: 300px;
+ &.show {
+ height: 180px;
+ opacity: 1;
+ }
+ flex-direction: column;
+ align-items: center;
+
+ // .top {
+ // flex-direction: column;
+ .title {
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid rgb(202, 177, 87);
+ background-color: rgb(253, 223, 109);
+ margin-right: 5px;
+ }
+
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-top: 75px;
+ margin-bottom: 19px;
+ }
+
+ .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.036243467926deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: -moz-linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ border-radius: 158px;
+
+ font-size: 14px;
+ color: #333333;
+
+ .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+ }
+ }
+ // }
+ }
+ .already {
+ font-size: 14px;
+ color: #7f7f7f;
+ .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: rgba(246, 246, 246, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 20px;
+ margin-right: 5px;
+
+ .img-tick {
+ width: 10px;
+ height: 8px;
+ }
+ }
+ }
+ }
}
}
@@ -410,12 +514,13 @@ body {
width: 285px;
display: block;
}
+
.item {
width: 285px;
- height: 332px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(235, 235, 235, 1);
border-radius: 12px;
+ padding: 21px 15px 0;
.school {
.img {
@@ -424,6 +529,7 @@ body {
}
font-size: 14px;
color: #333333;
+ margin-bottom: 12px;
}
.name {
@@ -432,6 +538,7 @@ body {
font-style: normal;
font-size: 16px;
color: #000000;
+ margin-bottom: 12px;
}
.name-en {
@@ -440,10 +547,12 @@ body {
font-style: normal;
font-size: 14px;
color: #555555;
+ margin-bottom: 12px;
}
.introduce {
color: #555555;
font-size: 14px;
+ margin-bottom: 12px;
.quantity {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
@@ -455,6 +564,197 @@ body {
margin: 0 10px;
}
}
+ .word {
+ background-color: rgba(249, 248, 248, 1);
+ border-radius: 3px;
+ padding: 10px 15px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 12px;
+ }
+ .tag {
+ .tag-item {
+ width: fit-content;
+ height: 24px;
+ line-height: 24px;
+ background-color: rgba(249, 248, 248, 1);
+ border: 1px solid rgba(170, 170, 170, 1);
+ border-radius: 6px;
+ padding: 0 9px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-right: 10px;
+
+ &.gray {
+ background-color: rgba(51, 51, 51, 1);
+ color: #ffffff;
+ }
+
+ &.semester {
+ color: #ffffff;
+ background-color: rgba(249, 93, 93, 1);
+ }
+ }
+ }
+ .operate {
+ height: 80px;
+ position: relative;
+ .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: rgba(219, 227, 253, 1);
+ border: 1px solid rgba(175, 181, 202, 1);
+ border-radius: 20px;
+ .img-add {
+ width: 12px;
+ height: 12px;
+ }
+ .img-dot {
+ width: 18px;
+ height: 8px;
+ }
+ }
+ .select {
+ position: absolute;
+ bottom: 0;
+ width: 285px;
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ &.show {
+ height: 211px;
+ opacity: 1;
+ }
+ .top {
+ flex-direction: column;
+ .title {
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid rgb(202, 177, 87);
+ background-color: rgb(253, 223, 109);
+ margin-right: 5px;
+ }
+
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 19px;
+ }
+
+ .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.036243467926deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: -moz-linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ border-radius: 158px;
+
+ font-size: 14px;
+ color: #333333;
+
+ .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+ }
+ }
+ }
+ .bottom {
+ border-top: 1px dotted #ebebeb;
+ height: 80px;
+ }
+ }
+ .already {
+ font-size: 14px;
+ color: #7f7f7f;
+ .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: rgba(246, 246, 246, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 20px;
+ margin-right: 5px;
+
+ .img-tick {
+ width: 10px;
+ height: 8px;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .base {
+ width: 640px;
+ height: 60px;
+ background-color: rgba(123, 140, 211, 1);
+ border-radius: 153px;
+ position: fixed;
+ bottom: 15px;
+ left: 50%;
+ transform: translateX(-50%);
+ .left {
+ width: 450px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 153px 15px 15px 153px;
+ margin-right: 5px;
+ padding: 0 20px;
+ .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: rgba(170, 170, 170, 0.901960784313726);
+ }
+
+ .img {
+ width: 20px;
+ height: 20px;
+ }
+ }
+
+ .rigth {
+ width: 175px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 15px 153px 153px 15px;
+ padding-left: 19px;
+
+ .img {
+ width: 25px;
+ height: 22px;
+ margin-right: 5px;
+ }
+
+ .text {
+ font-size: 16px;
+ color: #333333;
+ margin-right: 9px;
+ }
+
+ .number {
+ height: 20px;
+ line-height: 20px;
+ background-color: rgba(242, 242, 242, 1);
+ border-radius: 150px;
+ font-size: 13px;
+ color: #f95d5d;
+ padding: 0 8px;
+ }
}
}
}
diff --git a/school/school.css b/school/school.css
new file mode 100644
index 0000000..5f62b1a
--- /dev/null
+++ b/school/school.css
@@ -0,0 +1,699 @@
+* {
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+}
+.flexflex {
+ display: flex;
+}
+.flexcenter {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.flexjcenter {
+ display: flex;
+ justify-content: center;
+}
+.flexacenter {
+ display: flex;
+ align-items: center;
+}
+.flex1 {
+ flex: 1;
+}
+.flexcolumn {
+ display: flex;
+ flex-direction: column;
+}
+body {
+ background-color: #eef2f5;
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+}
+.main {
+ width: 1200px;
+ margin: 0 auto;
+}
+.main .index-icon {
+ width: 184px;
+ height: 42px;
+ margin-top: 37px;
+ margin-bottom: 40px;
+}
+.main .box {
+ width: 1200px;
+ height: 396px;
+ background-color: #fbfbfb;
+ border-radius: 12px;
+ position: relative;
+ margin-bottom: 20px;
+}
+.main .box::after {
+ content: "";
+ position: absolute;
+ top: -5px;
+ left: 0;
+ width: 100%;
+ height: 66px;
+ background: -webkit-linear-gradient(0deg, #7b8cd3 0%, #dae3fd 99%);
+ background: -moz-linear-gradient(90deg, #7b8cd3 0%, #dae3fd 99%);
+ background: linear-gradient(90deg, #7b8cd3 0%, #dae3fd 99%);
+ border-radius: 18px;
+ z-index: -1;
+}
+.main .box .tab {
+ height: 60px;
+ font-size: 14px;
+ color: #7f7f7f;
+ border-bottom: 1px dotted #ebebeb;
+ padding-left: 24px;
+}
+.main .box .tab .img {
+ width: 6px;
+ height: 10px;
+ margin: 0 15px;
+}
+.main .box .tab .current {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 14px;
+ color: #000000;
+}
+.main .box .details {
+ padding: 31px 60px;
+}
+.main .box .details .logo {
+ width: 120px;
+ height: 120px;
+ position: relative;
+ z-index: 1;
+ padding-right: 10px;
+ padding-bottom: 7px;
+ margin-right: 39px;
+ display: inline-flex;
+}
+.main .box .details .logo .bj {
+ width: 120px;
+ height: 120px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: -1;
+}
+.main .box .details .logo .img {
+ width: 65px;
+}
+.main .box .details .right .name {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 32px;
+ color: #000000;
+ margin-bottom: 6px;
+}
+.main .box .details .right .name-en {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #555555;
+ margin-bottom: 22px;
+}
+.main .box .details .right .world {
+ width: 423px;
+ padding-bottom: 15px;
+ margin-bottom: 27px;
+ border-bottom: 1px solid #ebebeb;
+}
+.main .box .details .right .world .head {
+ width: 100%;
+ position: relative;
+ margin-bottom: 9px;
+}
+.main .box .details .right .world .head::after {
+ content: "";
+ position: absolute;
+ top: 50%;
+ width: 100%;
+ height: 1px;
+ background-color: #ebebeb;
+}
+.main .box .details .right .world .head .icon {
+ width: 90px;
+ background-color: #fbfbfb;
+ position: relative;
+ z-index: 1;
+}
+.main .box .details .right .world .head .icon .img {
+ width: 64px;
+ height: 22px;
+}
+.main .box .details .right .world .list .item {
+ text-align: center;
+ flex-direction: column;
+}
+.main .box .details .right .world .list .item .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ font-style: normal;
+ font-size: 18px;
+ color: #000000;
+ margin-bottom: 9px;
+}
+.main .box .details .right .world .list .item .ranking-name {
+ font-family: "HelveticaNeue", "Helvetica Neue", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #555555;
+ position: relative;
+}
+.main .box .details .right .world .list .item .ranking-name .ranking-icon {
+ position: absolute;
+ right: -10px;
+ bottom: 0;
+ width: 8px;
+ height: 8px;
+ transform: rotate(270deg);
+}
+.main .box .details .right .brief {
+ height: 40px;
+ background-color: #f6f6f6;
+ border-radius: 6px;
+ font-size: 14px;
+ color: #7f7f7f;
+ line-height: 28px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 6px;
+}
+.main .box .details .right .brief .text {
+ margin-right: 15px;
+}
+.main .box .details .right .brief .img {
+ width: 16px;
+ height: 16px;
+ cursor: pointer;
+}
+.main .hot {
+ background-color: #ffffff;
+ border-radius: 12px;
+ padding: 24px;
+ margin-bottom: 20px;
+}
+.main .hot .header {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 18px;
+ color: #000000;
+ margin-bottom: 15px;
+}
+.main .hot .header .icon {
+ border-radius: 50%;
+ width: 40px;
+ height: 40px;
+ background-color: #fbe3ea;
+ margin-right: 13px;
+}
+.main .hot .header .icon .img {
+ width: 24px;
+ height: 24px;
+}
+.main .hot .list {
+ width: 1152px;
+ margin-bottom: 10px;
+}
+.main .hot .list .list-item {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+}
+.main .hot .list .list-item .item {
+ padding: 22px 0;
+ width: 510px;
+ margin-left: 20px;
+}
+.main .hot .list .list-item .item:not(:nth-last-child(-n + 2)) {
+ border-bottom: 1px dotted #ebebeb;
+}
+.main .hot .list .list-item .item .left .name {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #000000;
+ margin-bottom: 6px;
+ position: relative;
+}
+.main .hot .list .list-item .item .left .name::after {
+ content: "";
+ width: 8px;
+ height: 8px;
+ background-color: #f2f2f2;
+ border: 1px solid #d7d7d7;
+ border-radius: 39px;
+ position: absolute;
+ top: 50%;
+ left: -20px;
+ transform: translateY(-50%);
+ box-sizing: border-box;
+}
+.main .hot .list .list-item .item .left .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ color: #7f7f7f;
+ font-size: 14px;
+}
+.main .hot .list .list-item .item .left .text .ranking {
+ color: #555555;
+}
+.main .hot .list .list-item .item .left .text .vertical {
+ color: #d7d7d7;
+ margin: 0 8px;
+}
+.main .hot .list .list-item .item .left .text .number {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+}
+.main .hot .list .list-item .item .operate {
+ position: relative;
+}
+.main .hot .list .list-item .item .operate .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: #dbe3fd;
+ border: 1px solid #afb5ca;
+ border-radius: 20px;
+}
+.main .hot .list .list-item .item .operate .circle .img-add {
+ width: 12px;
+ height: 12px;
+}
+.main .hot .list .list-item .item .operate .circle .img-dot {
+ width: 18px;
+ height: 8px;
+}
+.main .hot .list .list-item .item .operate .select {
+ position: absolute;
+ right: 40px;
+ top: 50%;
+ transform: translateY(-50%);
+ background-color: #fbfbfb;
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ width: 324px;
+ padding-top: 10px;
+ flex-direction: column;
+ align-items: center;
+}
+.main .hot .list .list-item .item .operate .select.show {
+ height: 90px;
+ opacity: 1;
+}
+.main .hot .list .list-item .item .operate .select .title {
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 14px;
+}
+.main .hot .list .list-item .item .operate .select .title .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid #cab157;
+ background-color: #fddf6d;
+ margin-right: 5px;
+}
+.main .hot .list .list-item .item .operate .select .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.03624347deg, #dbe3fd 0%, #eef7f5 100%);
+ background: -moz-linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ background: linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ border-radius: 158px;
+ font-size: 14px;
+ color: #333333;
+}
+.main .hot .list .list-item .item .operate .select .btn .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+}
+.main .hot .list .list-item .item .operate .already {
+ font-size: 14px;
+ color: #7f7f7f;
+}
+.main .hot .list .list-item .item .operate .already .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: #f6f6f6;
+ border: 1px solid #d7d7d7;
+ border-radius: 20px;
+ margin-right: 5px;
+}
+.main .hot .list .list-item .item .operate .already .tick-box .img-tick {
+ width: 10px;
+ height: 8px;
+}
+.main .hot .indicate {
+ line-height: 12px;
+}
+.main .hot .indicate .icon {
+ width: 7px;
+ height: 12px;
+ cursor: pointer;
+}
+.main .hot .indicate .text {
+ color: #555555;
+ font-size: 13px;
+ margin: 0 12px;
+}
+.main .content {
+ height: 1214px;
+ background-color: #ffffff;
+ border: 1px solid #f2f2f2;
+ border-radius: 12px;
+}
+.main .content .header {
+ height: 88px;
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 24px;
+ color: #000000;
+ text-align: center;
+}
+.main .content .body .left {
+ width: 200px;
+ font-size: 16px;
+ color: #333333;
+ border-right: 1px solid #ebebeb;
+}
+.main .content .body .left .item {
+ height: 56px;
+ padding-left: 34px;
+}
+.main .content .body .left .item .img {
+ width: 18px;
+ height: 18px;
+ margin-right: 12px;
+}
+.main .content .body .left .item.pitch {
+ background-color: #fbfbfb;
+ border-top: 1px solid #ebebeb;
+ border-bottom: 1px solid #ebebeb;
+ width: 201px;
+ position: relative;
+ color: #000000;
+ font-weight: 650;
+}
+.main .content .body .left .item.pitch::after {
+ content: "";
+ width: 5px;
+ height: 56px;
+ background-color: #6fc16d;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+.main .content .body .right {
+ background-color: #fbfbfb;
+ border-top: 1px solid #ebebeb;
+ padding: 0 32px;
+}
+.main .content .body .right .screen .title {
+ font-size: 15px;
+ color: #555555;
+ padding-top: 27px;
+ margin-bottom: 20px;
+}
+.main .content .body .right .screen .list {
+ flex-wrap: wrap;
+}
+.main .content .body .right .screen .list .item {
+ width: fit-content;
+ height: 36px;
+ line-height: 36px;
+ padding: 0 17px;
+ background-color: rgba(251, 251, 251, 0);
+ border: 1px solid #ebebeb;
+ border-radius: 12px;
+ font-size: 14px;
+ color: #333333;
+ margin-bottom: 10px;
+ margin-right: 10px;
+}
+.main .content .body .right .screen .list .item.pitch {
+ background-color: #7b8cd3;
+ color: #ffffff;
+ border: none;
+}
+.main .content .body .right .h {
+ justify-content: space-between;
+ padding-top: 27px;
+ margin-bottom: 24px;
+}
+.main .content .body .right .h .total {
+ font-size: 14px;
+ color: #7f7f7f;
+}
+.main .content .body .right .h .sort {
+ font-size: 14px;
+ color: #000000;
+ cursor: pointer;
+}
+.main .content .body .right .h .sort .img {
+ width: 20px;
+ height: 20px;
+ margin-left: 8px;
+}
+.main .content .body .right .list {
+ flex-wrap: wrap;
+ justify-content: space-between;
+}
+.main .content .body .right .list .item {
+ width: 460px;
+ background-color: #ffffff;
+ border: 1px solid #f2f2f2;
+ border-radius: 12px;
+ padding: 21px 15px;
+ margin-bottom: 20px;
+ position: relative;
+}
+.main .content .body .right .list .item .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: 12px;
+}
+.main .content .body .right .list .item .english {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 14px;
+ color: #555555;
+ margin-bottom: 12px;
+}
+.main .content .body .right .list .item .introduce {
+ color: #555555;
+ font-size: 14px;
+ margin-bottom: 12px;
+}
+.main .content .body .right .list .item .introduce .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+}
+.main .content .body .right .list .item .introduce .line {
+ color: #d7d7d7;
+ margin: 0 10px;
+}
+.main .content .body .right .list .item .word {
+ background-color: #f9f8f8;
+ border-radius: 3px;
+ padding: 10px 15px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 12px;
+}
+.main .content .body .right .list .item .tag .tag-item {
+ width: fit-content;
+ height: 24px;
+ line-height: 24px;
+ background-color: #f9f8f8;
+ border: 1px solid #aaaaaa;
+ border-radius: 6px;
+ padding: 0 9px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-right: 10px;
+}
+.main .content .body .right .list .item .tag .tag-item.gray {
+ background-color: #333333;
+ color: #ffffff;
+}
+.main .content .body .right .list .item .tag .tag-item.semester {
+ color: #ffffff;
+ background-color: #f95d5d;
+}
+.main .content .body .right .list .item .operate {
+ position: absolute;
+ top: 18px;
+ right: 24px;
+}
+.main .content .body .right .list .item .operate .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: #dbe3fd;
+ border: 1px solid #afb5ca;
+ border-radius: 20px;
+}
+.main .content .body .right .list .item .operate .circle .img-add {
+ width: 12px;
+ height: 12px;
+}
+.main .content .body .right .list .item .operate .circle .img-dot {
+ width: 18px;
+ height: 8px;
+}
+.main .content .body .right .list .item .operate .select {
+ position: absolute;
+ top: -18px;
+ right: -24px;
+ width: 285px;
+ background-color: #fbfbfb;
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ align-items: center;
+ padding-top: 68px;
+}
+.main .content .body .right .list .item .operate .select.show {
+ height: 171px;
+ opacity: 1;
+}
+.main .content .body .right .list .item .operate .select .title {
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 19px;
+}
+.main .content .body .right .list .item .operate .select .title .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid #cab157;
+ background-color: #fddf6d;
+ margin-right: 5px;
+}
+.main .content .body .right .list .item .operate .select .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.03624347deg, #dbe3fd 0%, #eef7f5 100%);
+ background: -moz-linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ background: linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ border-radius: 158px;
+ font-size: 14px;
+ color: #333333;
+}
+.main .content .body .right .list .item .operate .select .btn .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+}
+.main .content .body .right .list .item .operate .already {
+ font-size: 14px;
+ color: #7f7f7f;
+}
+.main .content .body .right .list .item .operate .already .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: #f6f6f6;
+ border: 1px solid #d7d7d7;
+ border-radius: 20px;
+ margin-right: 5px;
+}
+.main .content .body .right .list .item .operate .already .tick-box .img-tick {
+ width: 10px;
+ height: 8px;
+}
+.main .base {
+ width: 640px;
+ height: 60px;
+ background-color: #7b8cd3;
+ border-radius: 153px;
+ position: fixed;
+ bottom: 15px;
+ left: 50%;
+ transform: translateX(-50%);
+}
+.main .base .left {
+ width: 450px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 153px 15px 15px 153px;
+ margin-right: 5px;
+ padding: 0 20px;
+}
+.main .base .left .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: rgba(170, 170, 170, 0.90196078);
+}
+.main .base .left .img {
+ width: 20px;
+ height: 20px;
+}
+.main .base .rigth {
+ width: 175px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 15px 153px 153px 15px;
+ padding-left: 19px;
+}
+.main .base .rigth .img {
+ width: 25px;
+ height: 22px;
+ margin-right: 5px;
+}
+.main .base .rigth .text {
+ font-size: 16px;
+ color: #333333;
+ margin-right: 9px;
+}
+.main .base .rigth .number {
+ height: 20px;
+ line-height: 20px;
+ background-color: #f2f2f2;
+ border-radius: 150px;
+ font-size: 13px;
+ color: #f95d5d;
+ padding: 0 8px;
+}
diff --git a/school/school.html b/school/school.html
new file mode 100644
index 0000000..242db72
--- /dev/null
+++ b/school/school.html
@@ -0,0 +1,313 @@
+
+
+
+
+
+
Document
+
+
+
+
+
+
+
+
+ 首页
+
+ 按学校查看
+
+
香港大学
+
+
+
+
+
+
+
+
香港大学
+
The University of Hong Kong
+
+
+
+
+
+
+
+
+
16
+
+ QS
+
+
+
+
+
+
+
+
香港大学简称为“港大”、“HKU”，是一所位处中华人民共和国香港特别行政区的公立研究型大学，其奠基于1910年3月16日，次年3月30日…
+
+
+
+
+
+
+
+
+
+
+
+
+
+
教育学硕士
+
+ Master of Education
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+ 已加入
+
+
+
+
+
+
教育学硕士
+
+ Master of Education
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+
+ 已加入
+
+
+
+
+
+
教育学硕士
+
+ Master of Education
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+
+ 已加入
+
+
+
+
+
+
教育学硕士
+
+ Master of Education
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+
+ 已加入
+
+
+
+
+
+
+
+
+
1/3
+
+
+
+
+
+
+
+
+
+
+
+
按学科查看：
+
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
+
+
+
+
共 113 个项目
+
+ 学费由低到高
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+ 已加入
+
+
+
建筑硕士
+
Master of Architecture
+
+
一句话描述独特之处，一句话描述独特之处。
+
+
+
+
+
+
+
+
+
+
+
搜索项目
+
+
+
+
+
项目对比
+
16
+
+
+
+
+
+
diff --git a/school/school.less b/school/school.less
new file mode 100644
index 0000000..2f20205
--- /dev/null
+++ b/school/school.less
@@ -0,0 +1,786 @@
+* {
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+}
+
+.flexflex {
+ display: flex;
+}
+
+.flexcenter {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.flexjcenter {
+ display: flex;
+ justify-content: center;
+}
+
+.flexacenter {
+ display: flex;
+ align-items: center;
+}
+
+.flex1 {
+ flex: 1;
+}
+
+.flexcolumn {
+ display: flex;
+ flex-direction: column;
+}
+
+body {
+ background-color: rgba(238, 242, 245, 1);
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+}
+
+.main {
+ width: 1200px;
+ margin: 0 auto;
+
+ .index-icon {
+ width: 184px;
+ height: 42px;
+ margin-top: 37px;
+ margin-bottom: 40px;
+ }
+
+ .box {
+ width: 1200px;
+ height: 396px;
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 12px;
+ position: relative;
+ margin-bottom: 20px;
+
+ &::after {
+ content: "";
+ position: absolute;
+ top: -5px;
+ left: 0;
+ width: 100%;
+ height: 66px;
+ background: -webkit-linear-gradient(0deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ background: -moz-linear-gradient(90deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ background: linear-gradient(90deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ border-radius: 18px;
+ z-index: -1;
+ }
+ .tab {
+ height: 60px;
+ font-size: 14px;
+ color: #7f7f7f;
+ border-bottom: 1px dotted rgb(235, 235, 235);
+ padding-left: 24px;
+ .img {
+ width: 6px;
+ height: 10px;
+ margin: 0 15px;
+ }
+
+ .current {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 14px;
+ color: #000000;
+ }
+ }
+ .details {
+ padding: 31px 60px;
+ .logo {
+ width: 120px;
+ height: 120px;
+ position: relative;
+ z-index: 1;
+ padding-right: 10px;
+ padding-bottom: 7px;
+ margin-right: 39px;
+ display: inline-flex;
+ .bj {
+ width: 120px;
+ height: 120px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: -1;
+ }
+ .img {
+ width: 65px;
+ }
+ }
+
+ .right {
+ .name {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 32px;
+ color: #000000;
+ margin-bottom: 6px;
+ }
+
+ .name-en {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #555555;
+ margin-bottom: 22px;
+ }
+
+ .world {
+ width: 423px;
+ padding-bottom: 15px;
+ margin-bottom: 27px;
+ border-bottom: 1px solid rgb(235, 235, 235);
+ .head {
+ width: 100%;
+ position: relative;
+ margin-bottom: 9px;
+
+ &::after {
+ content: "";
+ position: absolute;
+ top: 50%;
+ width: 100%;
+ height: 1px;
+ background-color: rgb(235, 235, 235);
+ }
+ .icon {
+ width: 90px;
+ background-color: #fbfbfb;
+ position: relative;
+ z-index: 1;
+ .img {
+ width: 64px;
+ height: 22px;
+ }
+ }
+ }
+
+ .list {
+ .item {
+ text-align: center;
+ flex-direction: column;
+
+ .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ font-style: normal;
+ font-size: 18px;
+ color: #000000;
+ margin-bottom: 9px;
+ }
+
+ .ranking-name {
+ font-family: "HelveticaNeue", "Helvetica Neue", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #555555;
+
+ position: relative;
+ .ranking-icon {
+ position: absolute;
+ right: -10px;
+ bottom: 0;
+ width: 8px;
+ height: 8px;
+ transform: rotate(270deg);
+ }
+ }
+ }
+ }
+ }
+
+ .brief {
+ // width: 946px;
+ height: 40px;
+ background-color: rgba(246, 246, 246, 1);
+ border-radius: 6px;
+ font-size: 14px;
+ color: #7f7f7f;
+ line-height: 28px;
+
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 6px;
+
+ .text {
+ margin-right: 15px;
+ }
+
+ .img {
+ width: 16px;
+ height: 16px;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+ }
+
+ .hot {
+ background-color: rgba(255, 255, 255, 1);
+ border-radius: 12px;
+ padding: 24px;
+ margin-bottom: 20px;
+ .header {
+ .icon {
+ border-radius: 50%;
+ width: 40px;
+ height: 40px;
+ background-color: rgb(251, 227, 234);
+ margin-right: 13px;
+ .img {
+ width: 24px;
+ height: 24px;
+ }
+ }
+
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 18px;
+ color: #000000;
+ margin-bottom: 15px;
+ }
+
+ .list {
+ width: 1152px;
+ margin-bottom: 10px;
+ .list-item {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ .item {
+ padding: 22px 0;
+ width: 510px;
+ margin-left: 20px;
+ &:not(:nth-last-child(-n + 2)) {
+ border-bottom: 1px dotted #ebebeb;
+ }
+
+ .left {
+ .name {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: #000000;
+ margin-bottom: 6px;
+ position: relative;
+ &::after {
+ content: "";
+ width: 8px;
+ height: 8px;
+ background-color: rgba(242, 242, 242, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 39px;
+ position: absolute;
+ top: 50%;
+ left: -20px;
+ transform: translateY(-50%);
+ box-sizing: border-box;
+ }
+ }
+
+ .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ color: #7f7f7f;
+ font-size: 14px;
+ .ranking {
+ color: #555555;
+ }
+
+ .vertical {
+ color: #d7d7d7;
+ margin: 0 8px;
+ }
+
+ .number {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+ }
+ }
+ }
+
+ .operate {
+ // height: 80px;
+ position: relative;
+ // position: absolute;
+ // top: 24px;
+ // right: 24px;
+ .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: rgba(219, 227, 253, 1);
+ border: 1px solid rgba(175, 181, 202, 1);
+ border-radius: 20px;
+ .img-add {
+ width: 12px;
+ height: 12px;
+ }
+ .img-dot {
+ width: 18px;
+ height: 8px;
+ }
+ }
+ .select {
+ position: absolute;
+ right: 40px;
+ top: 50%;
+ transform: translateY(-50%);
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ width: 324px;
+ padding-top: 10px;
+ &.show {
+ height: 90px;
+ opacity: 1;
+ }
+ flex-direction: column;
+ align-items: center;
+
+ .title {
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid rgb(202, 177, 87);
+ background-color: rgb(253, 223, 109);
+ margin-right: 5px;
+ }
+
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 14px;
+ }
+
+ .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.036243467926deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: -moz-linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ border-radius: 158px;
+
+ font-size: 14px;
+ color: #333333;
+
+ .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+ }
+ }
+ }
+ .already {
+ font-size: 14px;
+ color: #7f7f7f;
+ .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: rgba(246, 246, 246, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 20px;
+ margin-right: 5px;
+
+ .img-tick {
+ width: 10px;
+ height: 8px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .indicate {
+ line-height: 12px;
+
+ .icon {
+ width: 7px;
+ height: 12px;
+ cursor: pointer;
+ }
+ .text {
+ color: #555555;
+ font-size: 13px;
+ margin: 0 12px;
+ }
+ }
+ }
+
+ .content {
+ height: 1214px;
+ background-color: rgba(255, 255, 255, 1);
+ border: 1px solid rgba(242, 242, 242, 1);
+ border-radius: 12px;
+ .header {
+ height: 88px;
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 24px;
+ color: #000000;
+ text-align: center;
+ }
+ .body {
+ // align-items: flex-start;
+ .left {
+ width: 200px;
+ font-size: 16px;
+ color: #333333;
+ border-right: 1px solid rgba(235, 235, 235, 1);
+ .item {
+ height: 56px;
+ padding-left: 34px;
+ .img {
+ width: 18px;
+ height: 18px;
+ margin-right: 12px;
+ }
+
+ &.pitch {
+ background-color: rgba(251, 251, 251, 1);
+ border-top: 1px solid rgba(235, 235, 235, 1);
+ border-bottom: 1px solid rgba(235, 235, 235, 1);
+ width: 201px;
+ position: relative;
+ color: #000000;
+ font-weight: 650;
+ &::after {
+ content: "";
+ width: 5px;
+ height: 56px;
+ background-color: rgba(111, 193, 109, 1);
+ position: absolute;
+ top: 0;
+ left: 0;
+ }
+ }
+ }
+ }
+
+ .right {
+ background-color: rgba(251, 251, 251, 1);
+ border-top: 1px solid rgba(235, 235, 235, 1);
+ padding: 0 32px;
+
+ .screen {
+ .title {
+ font-size: 15px;
+ color: #555555;
+ padding-top: 27px;
+ margin-bottom: 20px;
+ }
+
+ .list {
+ flex-wrap: wrap;
+ .item {
+ width: fit-content;
+ height: 36px;
+ line-height: 36px;
+ padding: 0 17px;
+ background-color: rgba(251, 251, 251, 0);
+ border: 1px solid rgba(235, 235, 235, 1);
+ border-radius: 12px;
+ font-size: 14px;
+ color: #333333;
+ margin-bottom: 10px;
+ margin-right: 10px;
+
+ &.pitch {
+ background-color: rgba(123, 140, 211, 1);
+ color: #ffffff;
+ border: none;
+ }
+ }
+ }
+ }
+
+ .h {
+ justify-content: space-between;
+ padding-top: 27px;
+ margin-bottom: 24px;
+
+ .total {
+ font-size: 14px;
+ color: #7f7f7f;
+ }
+
+ .sort {
+ font-size: 14px;
+ color: #000000;
+ cursor: pointer;
+
+ .img {
+ width: 20px;
+ height: 20px;
+ margin-left: 8px;
+ }
+ }
+ }
+
+ .list {
+ flex-wrap: wrap;
+ justify-content: space-between;
+ .item {
+ width: 460px;
+ background-color: rgba(255, 255, 255, 1);
+ border: 1px solid rgba(242, 242, 242, 1);
+ border-radius: 12px;
+ padding: 21px 15px;
+ margin-bottom: 20px;
+ position: relative;
+ .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: 12px;
+ }
+
+ .english {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 14px;
+ color: #555555;
+ margin-bottom: 12px;
+ }
+ .introduce {
+ color: #555555;
+ font-size: 14px;
+ margin-bottom: 12px;
+ .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+ }
+ .line {
+ color: #d7d7d7;
+ margin: 0 10px;
+ }
+ }
+ .word {
+ background-color: rgba(249, 248, 248, 1);
+ border-radius: 3px;
+ padding: 10px 15px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 12px;
+ }
+ .tag {
+ .tag-item {
+ width: fit-content;
+ height: 24px;
+ line-height: 24px;
+ background-color: rgba(249, 248, 248, 1);
+ border: 1px solid rgba(170, 170, 170, 1);
+ border-radius: 6px;
+ padding: 0 9px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-right: 10px;
+
+ &.gray {
+ background-color: rgba(51, 51, 51, 1);
+ color: #ffffff;
+ }
+
+ &.semester {
+ color: #ffffff;
+ background-color: rgba(249, 93, 93, 1);
+ }
+ }
+ }
+ .operate {
+ position: absolute;
+ top: 18px;
+ right: 24px;
+ .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: rgba(219, 227, 253, 1);
+ border: 1px solid rgba(175, 181, 202, 1);
+ border-radius: 20px;
+ .img-add {
+ width: 12px;
+ height: 12px;
+ }
+ .img-dot {
+ width: 18px;
+ height: 8px;
+ }
+ }
+ .select {
+ position: absolute;
+ top: -18px;
+ right: -24px;
+ width: 285px;
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ align-items: center;
+ padding-top: 68px;
+ &.show {
+ height: 171px;
+ opacity: 1;
+ }
+ // .top {
+ // flex-direction: column;
+ .title {
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid rgb(202, 177, 87);
+ background-color: rgb(253, 223, 109);
+ margin-right: 5px;
+ }
+
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 19px;
+ }
+
+ .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.036243467926deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: -moz-linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ border-radius: 158px;
+
+ font-size: 14px;
+ color: #333333;
+
+ .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+ }
+ }
+ // }
+ }
+ .already {
+ font-size: 14px;
+ color: #7f7f7f;
+ .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: rgba(246, 246, 246, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 20px;
+ margin-right: 5px;
+
+ .img-tick {
+ width: 10px;
+ height: 8px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .base {
+ width: 640px;
+ height: 60px;
+ background-color: rgba(123, 140, 211, 1);
+ border-radius: 153px;
+ position: fixed;
+ bottom: 15px;
+ left: 50%;
+ transform: translateX(-50%);
+ .left {
+ width: 450px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 153px 15px 15px 153px;
+ margin-right: 5px;
+ padding: 0 20px;
+ .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: rgba(170, 170, 170, 0.901960784313726);
+ }
+
+ .img {
+ width: 20px;
+ height: 20px;
+ }
+ }
+
+ .rigth {
+ width: 175px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 15px 153px 153px 15px;
+ padding-left: 19px;
+
+ .img {
+ width: 25px;
+ height: 22px;
+ margin-right: 5px;
+ }
+
+ .text {
+ font-size: 16px;
+ color: #333333;
+ margin-right: 9px;
+ }
+
+ .number {
+ height: 20px;
+ line-height: 20px;
+ background-color: rgba(242, 242, 242, 1);
+ border-radius: 150px;
+ font-size: 13px;
+ color: #f95d5d;
+ padding: 0 8px;
+ }
+ }
+ }
+}
diff --git a/subject/subject.css b/subject/subject.css
new file mode 100644
index 0000000..54338ce
--- /dev/null
+++ b/subject/subject.css
@@ -0,0 +1,402 @@
+* {
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+}
+.flexflex {
+ display: flex;
+}
+.flexcenter {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.flexjcenter {
+ display: flex;
+ justify-content: center;
+}
+.flexacenter {
+ display: flex;
+ align-items: center;
+}
+.flex1 {
+ flex: 1;
+}
+.flexcolumn {
+ display: flex;
+ flex-direction: column;
+}
+body {
+ background-color: #eef2f5;
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+}
+.main {
+ width: 1200px;
+ margin: 0 auto;
+}
+.main .index-icon {
+ width: 184px;
+ height: 42px;
+ margin-top: 37px;
+ margin-bottom: 40px;
+}
+.main .box {
+ width: 1200px;
+ height: 396px;
+ background-color: #ffffff;
+ border-radius: 12px;
+ position: relative;
+ margin-bottom: 20px;
+}
+.main .box::after {
+ content: "";
+ position: absolute;
+ top: -5px;
+ left: 0;
+ width: 100%;
+ height: 66px;
+ background: -webkit-linear-gradient(0deg, #7b8cd3 0%, #dae3fd 99%);
+ background: -moz-linear-gradient(90deg, #7b8cd3 0%, #dae3fd 99%);
+ background: linear-gradient(90deg, #7b8cd3 0%, #dae3fd 99%);
+ border-radius: 18px;
+ z-index: -1;
+}
+.main .box .tab {
+ height: 60px;
+ font-size: 14px;
+ color: #7f7f7f;
+ border-bottom: 1px dotted #ebebeb;
+ padding-left: 24px;
+}
+.main .box .tab .img {
+ width: 6px;
+ height: 10px;
+ margin: 0 15px;
+}
+.main .box .tab .current {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 14px;
+ color: #000000;
+}
+.main .box .info {
+ padding: 41px 60px 0;
+ margin-bottom: 40px;
+}
+.main .box .info .img {
+ width: 120px;
+ height: 120px;
+ margin-right: 40px;
+}
+.main .box .info .title {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 24px;
+ color: #000000;
+ margin-bottom: 20px;
+}
+.main .box .info .list {
+ flex-wrap: wrap;
+}
+.main .box .info .list .item {
+ width: fit-content;
+ height: 36px;
+ line-height: 36px;
+ padding: 0 17px;
+ background-color: rgba(251, 251, 251, 0);
+ border: 1px solid #ebebeb;
+ border-radius: 12px;
+ font-size: 14px;
+ color: #333333;
+ margin-bottom: 10px;
+ margin-right: 10px;
+}
+.main .box .info .list .item.pitch {
+ background-color: #7b8cd3;
+ color: #ffffff;
+ border: none;
+}
+.main .body {
+ background-color: #ffffff;
+ border-radius: 12px;
+}
+.main .body .left {
+ width: 200px;
+ font-size: 16px;
+ color: #333333;
+ border-right: 1px solid #ebebeb;
+}
+.main .body .left .item {
+ height: 56px;
+ padding-left: 34px;
+}
+.main .body .left .item .img {
+ width: 18px;
+ margin-right: 12px;
+}
+.main .body .left .item.pitch {
+ background-color: #fbfbfb;
+ border-top: 1px solid #ebebeb;
+ border-bottom: 1px solid #ebebeb;
+ width: 201px;
+ position: relative;
+ color: #000000;
+ font-weight: 650;
+}
+.main .body .left .item.pitch::after {
+ content: "";
+ width: 5px;
+ height: 56px;
+ background-color: #6fc16d;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+.main .body .right {
+ background-color: #fbfbfb;
+ border-top: 1px solid #ebebeb;
+ padding: 0 32px;
+}
+.main .body .right .h {
+ justify-content: space-between;
+ padding-top: 27px;
+ margin-bottom: 24px;
+}
+.main .body .right .h .total {
+ font-size: 14px;
+ color: #7f7f7f;
+}
+.main .body .right .h .item {
+ font-size: 14px;
+ color: #000000;
+ cursor: pointer;
+}
+.main .body .right .h .item .img-sort {
+ width: 20px;
+ height: 20px;
+ margin-left: 8px;
+}
+.main .body .right .h .item .img-school {
+ width: 16px;
+ height: 16px;
+ margin-left: 8px;
+}
+.main .body .right .list {
+ flex-wrap: wrap;
+ justify-content: space-between;
+}
+.main .body .right .list .item {
+ width: 460px;
+ background-color: #ffffff;
+ border: 1px solid #f2f2f2;
+ border-radius: 12px;
+ padding: 21px 15px;
+ margin-bottom: 20px;
+ position: relative;
+}
+.main .body .right .list .item .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: 12px;
+}
+.main .body .right .list .item .english {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 14px;
+ color: #555555;
+ margin-bottom: 12px;
+}
+.main .body .right .list .item .introduce {
+ color: #555555;
+ font-size: 14px;
+ margin-bottom: 12px;
+}
+.main .body .right .list .item .introduce .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+}
+.main .body .right .list .item .introduce .line {
+ color: #d7d7d7;
+ margin: 0 10px;
+}
+.main .body .right .list .item .word {
+ background-color: #f9f8f8;
+ border-radius: 3px;
+ padding: 10px 15px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 12px;
+}
+.main .body .right .list .item .tag .tag-item {
+ width: fit-content;
+ height: 24px;
+ line-height: 24px;
+ background-color: #f9f8f8;
+ border: 1px solid #aaaaaa;
+ border-radius: 6px;
+ padding: 0 9px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-right: 10px;
+}
+.main .body .right .list .item .tag .tag-item.gray {
+ background-color: #333333;
+ color: #ffffff;
+}
+.main .body .right .list .item .tag .tag-item.semester {
+ color: #ffffff;
+ background-color: #f95d5d;
+}
+.main .body .right .list .item .operate {
+ position: absolute;
+ top: 18px;
+ right: 24px;
+}
+.main .body .right .list .item .operate .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: #dbe3fd;
+ border: 1px solid #afb5ca;
+ border-radius: 20px;
+}
+.main .body .right .list .item .operate .circle .img-add {
+ width: 12px;
+ height: 12px;
+}
+.main .body .right .list .item .operate .circle .img-dot {
+ width: 18px;
+ height: 8px;
+}
+.main .body .right .list .item .operate .select {
+ position: absolute;
+ top: -18px;
+ right: -24px;
+ width: 285px;
+ background-color: #fbfbfb;
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.18039216);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ align-items: center;
+ padding-top: 68px;
+}
+.main .body .right .list .item .operate .select.show {
+ height: 171px;
+ opacity: 1;
+}
+.main .body .right .list .item .operate .select .title {
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 19px;
+}
+.main .body .right .list .item .operate .select .title .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid #cab157;
+ background-color: #fddf6d;
+ margin-right: 5px;
+}
+.main .body .right .list .item .operate .select .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.03624347deg, #dbe3fd 0%, #eef7f5 100%);
+ background: -moz-linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ background: linear-gradient(255.96375653deg, #dbe3fd 0%, #eef7f5 100%);
+ border-radius: 158px;
+ font-size: 14px;
+ color: #333333;
+}
+.main .body .right .list .item .operate .select .btn .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+}
+.main .body .right .list .item .operate .already {
+ font-size: 14px;
+ color: #7f7f7f;
+}
+.main .body .right .list .item .operate .already .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: #f6f6f6;
+ border: 1px solid #d7d7d7;
+ border-radius: 20px;
+ margin-right: 5px;
+}
+.main .body .right .list .item .operate .already .tick-box .img-tick {
+ width: 10px;
+ height: 8px;
+}
+.main .base {
+ width: 640px;
+ height: 60px;
+ background-color: #7b8cd3;
+ border-radius: 153px;
+ position: fixed;
+ bottom: 15px;
+ left: 50%;
+ transform: translateX(-50%);
+}
+.main .base .left {
+ width: 450px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 153px 15px 15px 153px;
+ margin-right: 5px;
+ padding: 0 20px;
+}
+.main .base .left .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: rgba(170, 170, 170, 0.90196078);
+}
+.main .base .left .img {
+ width: 20px;
+ height: 20px;
+}
+.main .base .rigth {
+ width: 175px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 15px 153px 153px 15px;
+ padding-left: 19px;
+}
+.main .base .rigth .img {
+ width: 25px;
+ height: 22px;
+ margin-right: 5px;
+}
+.main .base .rigth .text {
+ font-size: 16px;
+ color: #333333;
+ margin-right: 9px;
+}
+.main .base .rigth .number {
+ height: 20px;
+ line-height: 20px;
+ background-color: #f2f2f2;
+ border-radius: 150px;
+ font-size: 13px;
+ color: #f95d5d;
+ padding: 0 8px;
+}
diff --git a/subject/subject.html b/subject/subject.html
new file mode 100644
index 0000000..fc6fefa
--- /dev/null
+++ b/subject/subject.html
@@ -0,0 +1,123 @@
+
+
+
+
+
+
Document
+
+
+
+
+
+
+
+
+ 首页
+
+ 按学科查看
+
+
建筑及城市规划
+
+
+
+
+
学科领域
+
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
建筑及城市规划
+
+
+
+
+
+
+
全部项目
+
香港大学
+
+
+
+
共 113 个项目
+
+ 学费由低到高
+
+
+
+
+ 学校主页
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
加入项目管理
+
+
+
+
+
+ 已加入
+
+
+
建筑硕士
+
Master of Architecture
+
+
一句话描述独特之处，一句话描述独特之处。
+
+
+
+
+
+
+
+
+
+
+
搜索项目
+
+
+
+
+
项目对比
+
16
+
+
+
+
+
+
diff --git a/subject/subject.less b/subject/subject.less
new file mode 100644
index 0000000..10e6388
--- /dev/null
+++ b/subject/subject.less
@@ -0,0 +1,447 @@
+* {
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+}
+
+.flexflex {
+ display: flex;
+}
+
+.flexcenter {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.flexjcenter {
+ display: flex;
+ justify-content: center;
+}
+
+.flexacenter {
+ display: flex;
+ align-items: center;
+}
+
+.flex1 {
+ flex: 1;
+}
+
+.flexcolumn {
+ display: flex;
+ flex-direction: column;
+}
+
+body {
+ background-color: rgba(238, 242, 245, 1);
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+}
+
+.main {
+ width: 1200px;
+ margin: 0 auto;
+
+ .index-icon {
+ width: 184px;
+ height: 42px;
+ margin-top: 37px;
+ margin-bottom: 40px;
+ }
+
+ .box {
+ width: 1200px;
+ height: 396px;
+ background-color: rgba(255, 255, 255, 1);
+ border-radius: 12px;
+ position: relative;
+ margin-bottom: 20px;
+
+ &::after {
+ content: "";
+ position: absolute;
+ top: -5px;
+ left: 0;
+ width: 100%;
+ height: 66px;
+ background: -webkit-linear-gradient(0deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ background: -moz-linear-gradient(90deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ background: linear-gradient(90deg, rgba(123, 140, 211, 1) 0%, rgba(218, 227, 253, 1) 99%);
+ border-radius: 18px;
+ z-index: -1;
+ }
+ .tab {
+ height: 60px;
+ font-size: 14px;
+ color: #7f7f7f;
+ border-bottom: 1px dotted rgb(235, 235, 235);
+ padding-left: 24px;
+ .img {
+ width: 6px;
+ height: 10px;
+ margin: 0 15px;
+ }
+
+ .current {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 14px;
+ color: #000000;
+ }
+ }
+
+ .info {
+ padding: 41px 60px 0;
+ margin-bottom: 40px;
+ .img {
+ width: 120px;
+ height: 120px;
+ margin-right: 40px;
+ }
+
+ .title {
+ font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
+ font-weight: 650;
+ font-style: normal;
+ font-size: 24px;
+ color: #000000;
+ margin-bottom: 20px;
+ }
+
+ .list {
+ flex-wrap: wrap;
+ .item {
+ width: fit-content;
+ height: 36px;
+ line-height: 36px;
+ padding: 0 17px;
+ background-color: rgba(251, 251, 251, 0);
+ border: 1px solid rgba(235, 235, 235, 1);
+ border-radius: 12px;
+ font-size: 14px;
+ color: #333333;
+ margin-bottom: 10px;
+ margin-right: 10px;
+
+ &.pitch {
+ background-color: rgba(123, 140, 211, 1);
+ color: #ffffff;
+ border: none;
+ }
+ }
+ }
+ }
+ }
+
+ .body {
+ background-color: rgba(255, 255, 255, 1);
+ border-radius: 12px;
+ // align-items: flex-start;
+ .left {
+ width: 200px;
+ font-size: 16px;
+ color: #333333;
+ border-right: 1px solid rgba(235, 235, 235, 1);
+ .item {
+ height: 56px;
+ padding-left: 34px;
+ .img {
+ width: 18px;
+ margin-right: 12px;
+ }
+
+ &.pitch {
+ background-color: rgba(251, 251, 251, 1);
+ border-top: 1px solid rgba(235, 235, 235, 1);
+ border-bottom: 1px solid rgba(235, 235, 235, 1);
+ width: 201px;
+ position: relative;
+ color: #000000;
+ font-weight: 650;
+ &::after {
+ content: "";
+ width: 5px;
+ height: 56px;
+ background-color: rgba(111, 193, 109, 1);
+ position: absolute;
+ top: 0;
+ left: 0;
+ }
+ }
+ }
+ }
+
+ .right {
+ background-color: rgba(251, 251, 251, 1);
+ border-top: 1px solid rgba(235, 235, 235, 1);
+ padding: 0 32px;
+
+ .h {
+ justify-content: space-between;
+ padding-top: 27px;
+ margin-bottom: 24px;
+
+ .total {
+ font-size: 14px;
+ color: #7f7f7f;
+ }
+
+ .item {
+ font-size: 14px;
+ color: #000000;
+ cursor: pointer;
+
+ .img-sort {
+ width: 20px;
+ height: 20px;
+ margin-left: 8px;
+ }
+
+ .img-school {
+ width: 16px;
+ height: 16px;
+ margin-left: 8px;
+ }
+ }
+ }
+
+ .list {
+ flex-wrap: wrap;
+ justify-content: space-between;
+ .item {
+ width: 460px;
+ background-color: rgba(255, 255, 255, 1);
+ border: 1px solid rgba(242, 242, 242, 1);
+ border-radius: 12px;
+ padding: 21px 15px;
+ margin-bottom: 20px;
+ position: relative;
+ .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: 12px;
+ }
+
+ .english {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 14px;
+ color: #555555;
+ margin-bottom: 12px;
+ }
+ .introduce {
+ color: #555555;
+ font-size: 14px;
+ margin-bottom: 12px;
+ .quantity {
+ font-family: "Arial-Black", "Arial Black", sans-serif;
+ font-weight: 900;
+ color: #000000;
+ margin-left: 8px;
+ }
+ .line {
+ color: #d7d7d7;
+ margin: 0 10px;
+ }
+ }
+ .word {
+ background-color: rgba(249, 248, 248, 1);
+ border-radius: 3px;
+ padding: 10px 15px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 12px;
+ }
+ .tag {
+ .tag-item {
+ width: fit-content;
+ height: 24px;
+ line-height: 24px;
+ background-color: rgba(249, 248, 248, 1);
+ border: 1px solid rgba(170, 170, 170, 1);
+ border-radius: 6px;
+ padding: 0 9px;
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-right: 10px;
+
+ &.gray {
+ background-color: rgba(51, 51, 51, 1);
+ color: #ffffff;
+ }
+
+ &.semester {
+ color: #ffffff;
+ background-color: rgba(249, 93, 93, 1);
+ }
+ }
+ }
+ .operate {
+ position: absolute;
+ top: 18px;
+ right: 24px;
+ .circle {
+ position: relative;
+ z-index: 1;
+ cursor: pointer;
+ width: 28px;
+ height: 28px;
+ background-color: rgba(219, 227, 253, 1);
+ border: 1px solid rgba(175, 181, 202, 1);
+ border-radius: 20px;
+ .img-add {
+ width: 12px;
+ height: 12px;
+ }
+ .img-dot {
+ width: 18px;
+ height: 8px;
+ }
+ }
+ .select {
+ position: absolute;
+ top: -18px;
+ right: -24px;
+ width: 285px;
+ background-color: rgba(251, 251, 251, 1);
+ border-radius: 8px;
+ -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.180392156862745);
+ flex-direction: column;
+ transition: all 0.3s;
+ overflow: hidden;
+ opacity: 0;
+ height: 0;
+ align-items: center;
+ padding-top: 68px;
+ &.show {
+ height: 171px;
+ opacity: 1;
+ }
+ // .top {
+ // flex-direction: column;
+ .title {
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ border: 1px solid rgb(202, 177, 87);
+ background-color: rgb(253, 223, 109);
+ margin-right: 5px;
+ }
+
+ font-size: 14px;
+ color: #7f7f7f;
+ margin-bottom: 19px;
+ }
+
+ .btn {
+ cursor: pointer;
+ width: 144px;
+ height: 36px;
+ background: -webkit-linear-gradient(194.036243467926deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: -moz-linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ background: linear-gradient(255.963756532074deg, rgba(219, 227, 253, 1) 0%, rgba(238, 247, 245, 1) 100%);
+ border-radius: 158px;
+
+ font-size: 14px;
+ color: #333333;
+
+ .img {
+ width: 16px;
+ height: 16px;
+ margin-right: 8px;
+ }
+ }
+ // }
+ }
+ .already {
+ font-size: 14px;
+ color: #7f7f7f;
+ .tick-box {
+ width: 20px;
+ height: 20px;
+ background-color: rgba(246, 246, 246, 1);
+ border: 1px solid rgba(215, 215, 215, 1);
+ border-radius: 20px;
+ margin-right: 5px;
+
+ .img-tick {
+ width: 10px;
+ height: 8px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .base {
+ width: 640px;
+ height: 60px;
+ background-color: rgba(123, 140, 211, 1);
+ border-radius: 153px;
+ position: fixed;
+ bottom: 15px;
+ left: 50%;
+ transform: translateX(-50%);
+ .left {
+ width: 450px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 153px 15px 15px 153px;
+ margin-right: 5px;
+ padding: 0 20px;
+ .text {
+ font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 16px;
+ color: rgba(170, 170, 170, 0.901960784313726);
+ }
+
+ .img {
+ width: 20px;
+ height: 20px;
+ }
+ }
+
+ .rigth {
+ width: 175px;
+ height: 50px;
+ background-color: #fff;
+ border-radius: 15px 153px 153px 15px;
+ padding-left: 19px;
+
+ .img {
+ width: 25px;
+ height: 22px;
+ margin-right: 5px;
+ }
+
+ .text {
+ font-size: 16px;
+ color: #333333;
+ margin-right: 9px;
+ }
+
+ .number {
+ height: 20px;
+ line-height: 20px;
+ background-color: rgba(242, 242, 242, 1);
+ border-radius: 150px;
+ font-size: 13px;
+ color: #f95d5d;
+ padding: 0 8px;
+ }
+ }
+ }
+}
+ 
+ 
全部项目
+ 
按学科
+ 
按学院
+