.cd_box{ padding: 20px 0 30px; box-sizing: border-box; position: relative; min-height: 890px; color: #111111; background-size: 100% 100%; &.fdy{ background: url('@/assets/images/versionTwo/fdy_bg.png') no-repeat; background-size: 100% 100%; position: relative; .fdy-title{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 18px; color: #199C9C; line-height: 18px; margin-top: 30px; padding: 0 20px; } .fdy-p{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 12px; color: #002846; line-height: 18px; margin-top: 12px; padding: 0 20px; } .fdy-subtitle{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 12px; color: #009191; line-height: 18px; margin-top: 20px; padding: 0 20px; } .fdy-subtitle2{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 12px; color: #002846; line-height: 18px; margin-top: 12px; padding: 0 20px; } .fdy-code{ margin-top: 10px; img{ width: 128px; height: 128px; } } .fdy-code-team{ width: 128px; height: 128px; position: absolute; right: 30px; bottom: 9px; } } .cb_db{ .cb_db_l{ font-family: STSongti-SC, STSongti-SC; font-weight: 400; font-size: 10px; color: #FFFFFF; line-height: 16px; padding-left: 32px; &.cdl{ color: #111111; padding-left: 0; } } } .cd_page{ width: 100%; font-family: STSongti-SC, STSongti-SC; font-weight: 400; font-size: 10px; color: #111111; line-height: 16px; text-align: center; position: absolute; bottom: 20px; } p{ font-family: STSongti-SC, STSongti-SC; font-weight: 400; font-size: 10px; color: #252525; line-height: 14px; margin-top: 20px; &.p2{ font-size: 12px; line-height: 16px; } &.p3{ font-size: 12px; line-height: 16px; color: #33A7A7; } } .bp{ font-family: PingFangSC, PingFang SC; font-weight: 600; font-size: 20px; color: #111111; line-height: 24px; } .big_title{ font-family: STSongti-SC, STSongti-SC; font-weight: bold; font-size: 32px; color: #009191; line-height: 45px; margin-top: 20px; } &.fm2{ background: url('@/assets/images/versionTwo/fm_bg.png') no-repeat; background-size: 100% 100%; position: relative; justify-content: flex-end; padding: 0 40px 15px; box-sizing: border-box; } .fm2-logo{ width: 163px; height: 44px; position: absolute; top: 38px; left: 30px; } .fm2-logo2{ width: 116px; height: 46px; position: absolute; top: 38px; right: 31px; } .fm2-perill{ width: 308px; height: 58px; } .fm2-line{ width: calc(100% - 87px); height: 1px; background: rgba(255,255,255,0.12); margin-top: 12px; } .fm2-p{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 40px; color: #FFDF73; line-height: 48px; margin-top: 8px; } .fm2-texts{ margin-top: 4px; overflow: hidden; justify-content: space-between; flex-wrap: wrap; } .fm2-texts-pre{ width: 50%; margin-top: 11px; font-family: PingFang-SC, PingFang-SC; font-weight: 500; font-size: 12px; color: #FFFFFF; line-height: 12px; text-align: left; .fm2-texts-pre-val{ padding-right: 10px; box-sizing: border-box; } } .fm2-tip{ font-family: PingFang-SC, PingFang-SC; font-weight: 500; font-size: 10px; color: #C7E4E4; line-height: 12px; margin-top: 14px; } .v2-top{ width: 100%; height: 44px; background-repeat: no-repeat; background-size: 100% 100%; padding: 0 8px 0 32px; box-sizing: border-box; .vt-left{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 24px; color: #FFFFFF; line-height: 33px; text-align: left; &.black{ color: #002846; } } .vt-right{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 12px; color: #002846; line-height: 14px; text-align: right; } } .v2-box{ margin-top: 13px; background: #FFFFFF; border-radius: 10px; border: 1px solid #AEDADA; padding: 16px 16px 18px; position: relative; flex: 1; .vb-img1{ width: 48px; height: 6px; position: absolute; left: 12px; top: -3px; } .vb-img2{ width: 44px; height: 20px; position: absolute; left: 16px; bottom: -10px; } } .v2b-tip-title{ font-family: PingFang-SC, PingFang-SC; font-weight: 400; font-size: 10px; color: #667E90; line-height: 16px; } .v2b-tip-memo{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 9px; color: #667E90; line-height: 16px; margin-top: 1px; } .v2b-title{ font-family: PingFangSC, PingFang SC; font-weight: 600; font-size: 16px; color: #002846; line-height: 16px; margin-top: 16px; } .v2b-p{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 16px; margin-top: 8px; } .v2-title2{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 16px; color: #002846; line-height: 16px; margin-top: 20px; } .v2-p{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 20px; span{ font-family: DIN, DIN; font-weight: bold; font-size: 14px; color: #009191; line-height: 14px; margin: 0 10px; } } .v2-p2{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 20px; } .v2-subp{ font-family: PingFangSC, PingFang SC; font-weight: 600; font-size: 14px; color: #002846; line-height: 14px; margin-top: 16px; } .v2-p3{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 14px; color: #002846; line-height: 20px; } .v2-six{ flex: 1; margin-top: 29px; background: #F1F9F9; border-radius: 10px; position: relative; padding: 46px 16px 25px; .vsix-title{ width: 234px; height: 42px; background: url('@/assets/images/versionTwo/intro_box_title_bg.png') no-repeat; background-size: 100% 100%; font-family: PingFangSC, PingFang SC; font-weight: 600; font-size: 20px; color: #FFFFFF; line-height: 42px; text-align: center; position: absolute; left: 50%; margin-left: -117px; top: -10px; } .vsix-p{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 16px; } .vsix-boxs{ margin-top: 16px; overflow: hidden; .vsb{ margin-top: 2px; background: #FFFFFF; border-radius: 8px; padding: 12px 16px 12px 24px; .vsb-img{ width: 48px; height: 48px; } .vsb-right{ width: calc(100% - 77px); margin-left: 29px; padding-left: 24px; box-sizing: border-box; position: relative; &::before{ content: ''; width: 1px; height: 48px; background: #E6EAED; position: absolute; left: 0; top: 50%; margin-top: -24px; } .vsbr-top{ .vsbrt-type{ width: 24px; height: 24px; border-radius: 4px; font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 20px; color: #FFFFFF; line-height: 24px; text-align: center; } .vsbrt-title{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 14px; line-height: 16px; margin-left: 8px; } } .vsbr-desc{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 16px; margin-top: 10px; } } } } } .v2-data{ background: #FFFFFF; border-radius: 10px; border: 1px solid #AEDADA; width: calc(100% - 9px); min-height: 254px; padding: 46px 16px 16px; box-sizing: border-box; margin: 27px 0 0 8px; position: relative; .vd-title{ width: 134px; height: 44px; background-size: 100%; font-family: PingFangSC, PingFang SC; font-weight: 600; font-size: 18px; color: #FFFFFF; line-height: 30px; padding-left: 24px; box-sizing: border-box; position: absolute; top: -1px; left: -9px; &.vt2{ width: 224px; } &.vt3{ line-height: 36px; } &.black{ color: #002846; } } } .vb-table{ margin-top: 11px; border: 1px solid #FFE796; border-radius: 4px; .vbt-pre{ height: 44px; .vbtp-left{ width: 72px; height: 44px; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #FFFFFF; line-height: 14px; border-bottom: 1px solid #FFFFFF; box-sizing: border-box; &.black{ color: #002846; } } .vbtp-right{ width: calc(100% - 72px); height: 44px; padding: 0 18px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; .vbtpr-title{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 9px; color: #193D59; line-height: 10px; } .vbtpr-jd{ margin-top: 7px; width: 100%; height: 6px; background: #F0F2F8; border-radius: 3px; position: relative; .vj_num{ position: absolute; height: 6px; left: 0; top: 0; } .vj-val{ width: 24px; height: 20px; background: #FFFFFF; border-radius: 4px; font-family: DIN, DIN; font-weight: bold; font-size: 12px; color: #002846; line-height: 10px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; } } } &:last-child{ .vbtp-left,.vbtp-right{ border: none; } } } .vbt-th{ height: 26px; border-radius: 4px 4px 0px 0px; border-bottom: 1px solid #FFFFFF; &>div{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 10px; color: #FFFFFF; line-height: 26px; text-align: center; } &.black{ &>div{ color: #002846; } } } .vbtt-w1{ width: 72px !important; } .vbtt-w2{ width: 46px !important; } .vbtt-w3{ flex: 1 !important; } .vbtp-num{ font-family: DIN, DIN; font-weight: bold; font-size: 14px; color: #667E90; text-align: center; line-height: 44px; &.green{ color: #199C9C; } } .vbtp-desc{ height: 44px; flex: 1; display: flex; flex-direction: column; justify-content: center; .vbtpd-title{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 9px; color: #193D59; line-height: 10px; } .xr_tb{ width: calc(100% - 20px); height: 4px; margin-top: 9px; position: relative; .xt_pre{ width: calc(100% / 3); height: 100%; &.p1{ background: #BA8EB4; } &.p2{ background: #66BDBD; } &.p3{ background: #AFCDF5; } } .xt_score{ position: absolute; left: 14px; top: -9px; .xts_num{ width: 24px; height: 18px; padding: 0 4px; box-sizing: border-box; background: #FFFFFF; box-shadow: 0px 4px 10px 0px rgba(118,30,106,0.08); border-radius: 4px; border: 1px solid rgba(131,52,120,0.19); font-family: DIN, DIN; font-weight: bold; font-size: 12px; color: #904A87; white-space: nowrap; &.red{ color: #904A87; } &.green{ color: #199C9C; } } .xts_box{ flex: 1; height: 8px; background: #199C9C; } } } } } .vbt2-left{ flex: 1; .vbt2l-th{ height: 28px; border-radius: 4px 0 0 0; font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 10px; color: #FFFFFF; line-height: 20px; box-sizing: border-box; .vbt2l-th-title{ flex: 1; border-right: 1px solid rgba(255,255,255,.24); text-indent: 10px; } .vbt2l-th-score{ width: 56px; border-right: 1px solid rgba(255,255,255,.24); } } } .vbt2-right{ width: 308px; position: relative; .vbt2r-th{ border-radius: 0 4px 0 0; } .vbt2r-pre{ width: calc(50% - 0.5px); height: 28px; font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 10px; line-height: 20px; box-sizing: border-box; border-right: 1px solid rgba(255,255,255,.24); &:last-child{ border: none; border-radius: 0 4px 0 0; } } .vbt2r-tb{ flex: 1; } } .vbt2l-pre{ border-bottom: 1px solid #E6EAED; display: flex; align-items: stretch; height: 58px; box-sizing: border-box; &:last-child{ border: none !important; } .vbt2l-pre-l{ flex: 1; padding: 13px 10px; box-sizing: border-box; justify-content: center; .vbt2l-pre-l-title{ font-family: PingFang-SC, PingFang-SC; font-weight: bold; font-size: 10px; color: #761E6A; line-height: 14px; } .vbt2l-pre-l-tip{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 9px; color: #002846; line-height: 14px; margin-top: 4px; } } .vbt2l-pre-r{ width: 56px; font-family: DIN, DIN; font-weight: bold; font-size: 14px; color: #002846; line-height: 20px; } } .vbt2r-tb{ .vbt2r-tb-l{ width: calc(50% - 0.5px); justify-content: space-between; position: relative; .vbt2r-tb-l-pre{ width: 100%; height: 58px; box-sizing: border-box; position: relative; .vbt2r-tb-l-pre-bg{ width: calc(100% - 16px); height: 4px; background: #E6EAED; position: absolute; right: 0; top: 50%; margin-top: -2px; &.r{ left: 0; } } &.red{ justify-content: end; } .vbt2r-tb-l-pre-zzt{ height: 10px; position: relative; z-index: 11; box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.1); &.red{ background: #BA8EB4; border-radius: 2px 0px 0px 2px; } &.green{ background: #80C8C8; border-radius: 0px 2px 2px 0px; } .vbt2r-tb-l-pre-zzt-numl{ width: 16px; height: 20px; background: #FFFFFF; font-family: DIN, DIN; font-weight: bold; font-size: 12px; color: #904A87; line-height: 16px; text-align: center; box-shadow: 0px 4px 8px 0px rgba(118,30,106,0.1); border-radius: 4px; border: 1px solid rgba(131,52,120,0.19); position: absolute; top: 50%; margin-top: -10px; left: -8px; } .vbt2r-tb-l-pre-zzt-numr{ width: 16px; height: 20px; background: #FFFFFF; font-family: DIN, DIN; font-weight: bold; font-size: 12px; line-height: 16px; text-align: center; box-shadow: 0px 4px 8px 0px rgba(118,30,106,0.1); border-radius: 4px; border: 1px solid rgba(51,167,167,0.31); color: #199C9C; position: absolute; top: 50%; margin-top: -10px; right: -8px } } &:last-child{ border: none !important; } } } } .vb-category{ position: absolute; top: 70px; left: 16px; .vbc-pre{ margin-top: 16px; .vbcp-yuan{ width: 10px; height: 10px; border-radius: 5px; &.y1{ background: #9F6196; } &.y2{ background: #AFCDF5; } &.y3{ background: #FFD650; } &.y4{ background: #012846; } } .vbcp-text{ font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 10px; color: #002846; line-height: 10px; margin-left: 8px; } } } }