.head { height: 5.6rem; background-repeat: no-repeat; background-size: cover; } .head_d1 { width: 1200px; margin: 0 auto; padding-top: 1.35rem; padding-bottom: 1.3rem; } .head_p1 { font-size: 0.46rem; color: white; line-height: 1; margin-bottom: 0.17rem; letter-spacing: 1px; font-weight: 500; } .head_p2 { font-size: 0.2rem; color: white; line-height: 1; margin-bottom: 0.36rem; letter-spacing: 4px; text-indent: 4px; font-family: arial; } .head_p3 { font-size: 0.14rem; color: white; line-height: 0.3rem; } .head_d2 { display: flex; align-items: center; margin-top: 0.55rem; cursor: pointer; } .head_d2 img { width: 0.7rem; height: 0.7rem; object-fit: contain; display: block; margin-right: 0.16rem; } .head_d2 p { font-size: 0.22rem; color: white; border-bottom: 1px solid white; letter-spacing: 1px; } /* */ .cons_bg { background-color: #f0f3f7 } .cons { width: 1200px; margin: 0 auto; padding-top: 1rem; padding-bottom: 1rem; } .cons_list { width: 8.2rem; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; text-align: center; } .cons_item { border-radius: 50%; background-color: white; box-shadow: 0 4px 10px 1px rgba(102, 102, 102, 0.1); transition: 0.5s; } .cons_item a { width: 1.4rem; height: 1.4rem; display: flex; align-items: center; justify-content: center; text-align: center; color: #1b2a75; font-size: 18px; } .cons_item:hover { transform: scale(1.1); box-shadow: 0 4px 10px 5px rgba(102, 102, 102, 0.1); } /* */ .school { width: 1200px; margin: 0 auto; padding-top: 1rem; } .school_list { display: flex; justify-content: space-between; padding: 0 1rem; background-image: url('../img/skr97.png'); background-repeat: no-repeat; background-position: 142px 92px; } .school_item>div { margin-left: auto; margin-right: auto; text-align: center; } .school_p1 { font-size: 18px; color: white; line-height: 36px; text-align: center; width: 78px; height: 50px; background-image: url("../img/skr96.png"); background-repeat: no-repeat; background-size: 100% auto; background-position: center; margin-bottom: 0.2rem; } .school_item { width: 10%; } .school_item:last-of-type .school_p1 { width: 120px; background-image: url("../img/skr157.png"); transform: translateX(-0.1rem); } .school_p2 { width: 0.4rem; height: 0.4rem; box-sizing: content-box; border: 4px solid white; border-radius: 50%; box-shadow: 0 4px 10px 1px rgba(102, 102, 102, 0.15); margin-bottom: 0.26rem; } .school_p2 p { font-size: 22px; color: #619fd0; background-color: white; width: 0.4rem; height: 0.4rem; text-align: center; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 4px solid #619fd0; font-family: Arial, "Source Han Sans CN"; } .school_p3 { font-size: 16px; line-height: 30px; color: #464d61; } .school_p4 { width: 100%; text-align: center; font-size: 22px; color: #333947; line-height: 36px; margin-top: 0.8rem; margin-bottom: 0.7rem; } .school_p4 span { font-size: 18px; color: #333947; } .school_ul { position: relative; display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0 1.7rem; margin-bottom: 1.2rem; transform-style: preserve-3d; } .school_li { width: 3.2rem; height: 1.64rem; background-color: white; box-shadow: 0 0 10px 1px rgba(102, 102, 102, 0.15); padding-top: 0.4rem; padding-bottom: 0.4rem; border-radius: 8px; transition: 0.5s; transform: scale(1); position: relative; z-index: 1; } .school_li:hover { transform: scale(1.2); position: relative; z-index: 1; } .school_li:nth-of-type(even) { padding-left: 0.4rem; padding-right: 0.7rem; margin-right: 20%; } .school_li:nth-of-type(odd) { padding-right: 0.4rem; padding-left: 0.7rem; text-align: right; } .school_li:nth-of-type(1), .school_li:nth-of-type(2) { margin-bottom: 0.85rem; } .school_p5 { font-size: 18px; color: #333947; line-height: 1; margin-bottom: 0.17rem; } .school_p6 { font-size: 14px; color: #333947; text-align: left; } .school_img { position: absolute; z-index: 2; width: 4.2rem; height: 4.2rem; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-wrap: wrap; } .school_img p { position: relative; z-index: 4; } .school_img img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain; z-index: 3; } .school_p7 { font-size: 22px; color: white; width: 50%; height: 2.1rem; position: relative; } .school_p7:nth-of-type(odd) span { position: absolute; right: 0.4rem; } .school_p7:nth-of-type(even) span { position: absolute; left: 0.4rem; } .school_p7:nth-of-type(1) span, .school_p7:nth-of-type(2) span { bottom: 0.4rem; } .school_p7:nth-of-type(3) span, .school_p7:nth-of-type(4) span { top: 0.4rem; } .school_p8 { text-align: center; font-size: 18px; color: #333947; line-height: 1; margin-bottom: 0.22rem; } .school_p9 { text-align: center; font-size: 14px; color: #84879a; line-height: 1; margin-bottom: 1rem; } .school_p99 { margin-bottom: 0.5rem; } .school_form { display: flex; flex-wrap: wrap; justify-content: space-between; padding-bottom: 1rem; } .school_tb { width: 28%; text-align: center; margin-right: 0.8rem; margin-bottom: 0.8rem; } .school_tb:nth-of-type(3n) { margin-right: 0; } .school_tb:nth-of-type(n+4) { margin-bottom: 0; } .school_p10 { font-size: 30px; color: #619fd0; line-height: 1; margin-bottom: 0.3rem; } .school_tb:nth-of-type(5) .school_p10, .school_tb:nth-of-type(3) .school_p10, .school_tb:nth-of-type(4) .school_p10 { font-size: 16px; } .school_p10 span { font-size: 48px; font-weight: bold; color: #619fd0; letter-spacing: 3px; font-family: "Source Han Sans CN"; margin-right: 6px; } .school_p11 { font-size: 18px; color: #333947; line-height: 1; } /* */ .empl_bg { width: 100%; background-color: #f0f3f7; overflow: hidden; } .empl { width: 1200px; margin: 0 auto; padding-top: 1rem; } .empl_img { width: 7.8rem; height: 5.3rem; margin: 0 auto; background-image: url('../img/skr99.png'); background-repeat: no-repeat; background-position: center; background-size: 100% auto; padding-left: 2.83rem; padding-top: 8px; margin-bottom: 1rem; } .empl_item { display: flex; align-items: center; margin-bottom: 0.4rem; height: 0.97rem; } .empl_p1 { font-size: 18px; color: white; line-height: 24px; width: 0.86rem; height: 0.86rem; display: flex; align-items: center; justify-content: center; margin-right: 35px; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .empl_p1 { padding-top: 5px; } } .empl_p2 { font-size: 14px; color: #333947; } .empl_p3 { font-size: 22px; color: #333947; text-align: center; margin-bottom: 0.8rem; } .empl_p6 { font-size: 22px; color: #333947; text-align: center; margin-bottom: 0.24rem; } .empl_p7 { font-size: 22px; color: #333947; text-align: center; margin-bottom: 0.6rem; } .empl_ul { display: flex; justify-content: space-between; margin-bottom: 0.75rem; } .empl_li { width: 1.8rem; transition: 0.5s; } .empl_li:hover { transform: scale(1.1); } .empl_p4 { width: 1.22rem; height: 1.22rem; font-size: 16px; line-height: 24px; color: #333947; border: 3px solid #619fd0; background-color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; padding: 0 0.2rem; box-shadow: 0 0 10px 1px rgba(102, 102, 102, 0.1); text-align: center; margin: 0 auto; position: relative; z-index: 2; } .empl_p5 { font-size: 14px; height: 2rem; color: #333947; line-height: 30px; text-align: center; width: 100%; background-color: white; border-radius: 8px; box-shadow: 0 0 10px 1px rgba(102, 102, 102, 0.1); padding-top: 0.7rem; transform: translateY(-0.35rem); } .empl_imgs_bg { width: 100%; overflow: hidden; background-color: #f0f3f7; padding-bottom: 0.7rem; } .empl_imgs { width: 1250px; margin: 0 auto; transform: translateX(0.5rem); position: relative; } .empl_imgs img { object-fit: contain; } .empl_cont { width: 9rem; height: 3.1rem; position: absolute; right: 0.9rem; top: 1.68rem; } /* */ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .empl_p8, .empl_p11 span, .empl_p10 { padding-top: 4px; } } .empl_s:nth-of-type(1) .empl_p8, .empl_s:nth-of-type(6) .empl_p8 { background-color: #d71518; } .empl_s:nth-of-type(1) .empl_p8 { width: 1.23rem; margin-left: 2.6rem; } .empl_s:nth-of-type(2) .empl_p8 { width: 0.9rem; margin-left: 3.05rem; } .empl_s:nth-of-type(2) .empl_p9 { width: 4.8rem; left: 4.04rem; top: 0.2rem; } .empl_s:nth-of-type(3) .empl_p8 { width: 1.03rem; margin-left: 3.5rem; } .empl_s:nth-of-type(4) .empl_p8 { width: 1.25rem; margin-left: 4.38rem; } .empl_s:nth-of-type(4) .empl_p9 { width: 4.14rem; left: 0.17rem; top: 1.2rem; } .empl_s:nth-of-type(5) .empl_p8 { width: 2.16rem; margin-left: 5.45rem; } .empl_s:nth-of-type(5) .empl_p9 { width: 4.8rem; left: 0.6rem; top: 1.6rem; } .empl_s:nth-of-type(6) .empl_p8 { width: 1.42rem; margin-left: 5.84rem; } .empl_s:nth-of-type(7) .empl_p8 { width: 5.92rem; margin-left: 1.7rem; } .empl_s:nth-of-type(7) .empl_p9 { width: 3.7rem; left: 1.7rem; top: 1.8rem; } .empl_s:nth-of-type(8) .empl_p8 { width: 6.18rem; margin-left: 1.7rem; } .empl_s:nth-of-type(8) .empl_p9 { width: 6.2rem; left: 1.7rem; top: 3.19rem; } .empl_p8 { font-size: 14px; color: white; transition: 0.5s; height: 0.3rem; text-align: center; line-height: 0.3rem; border-radius: 4px; overflow: hidden; background-color: #b0cfe7; margin-bottom: 10px; cursor: pointer; } .empl_p8:hover { background-color: #1b2a75; } .empl_s .empl_p8:hover+.empl_p9 { opacity: 1; z-index: 9; } .empl_p9 { font-size: 13px; color: #84879a; line-height: 18px; background-color: #f0f3f7; position: absolute; z-index: -1; padding: 8px 5px 8px 16px; border-radius: 4px; overflow: hidden; transition: 0.5s; opacity: 0; } .empl_p10 { font-size: 14px; color: white; line-height: 0.3rem; position: absolute; right: 4.8rem; top: 0.74rem; } .empl_p11 { width: 6.44rem; color: white; position: absolute; left: 4.07rem; top: 1.24rem; display: flex; align-items: center; } .empl_p11 span { width: 0.5rem; height: 0.3rem; font-size: 16px; line-height: 0.3rem; text-align: center; margin-right: 4px; } .empl_p11 span:last-of-type { margin-right: 0; } /* */ .crop { width: 1200px; margin: 0 auto; padding-top: 1rem; padding-bottom: 1rem; } .crop_cont { display: flex; align-items: center; justify-content: space-between; padding-right: 0.12rem; margin-bottom: 1.2rem; } .crop_l { width: 4.8rem; } .crop_p1 { font-size: 18px; color: #333947; line-height: 36px; margin-bottom: 0.6rem; } .crop_p2 { font-size: 22px; color: #333947; margin-bottom: 0.3rem; line-height: 1; } .crop_p3 { font-size: 14px; color: #333947; line-height: 30px; position: relative; padding-left: 0.3rem; } .crop_p3:nth-of-type(3) { margin-bottom: 0.35rem; } .crop_p3::before { content: ""; display: block; position: absolute; left: 0; top: 12px; width: 8px; height: 8px; border-radius: 50%; background-color: #619fd0; } .crop_r { width: 6.08rem; position: relative; } .crop_r img { width: 100%; object-fit: contain; } .crop_list { display: flex; justify-content: space-between; padding: 0 1.9rem; } .crop_item { width: 2rem; background-color: white; transition: 0.35s; padding: 0.55rem 0 0.2rem; border-radius: 8px; } .crop_item:hover { box-shadow: 0 0 10px 1px rgba(102, 102, 102, 0.15); } .crop_img { width: 0.7rem; height: 0.8rem; margin-bottom: 0.4rem; margin: 0 auto 0.3rem; } .crop_img img { width: 100%; max-height: 100%; object-fit: contain; } .crop_p4 { font-size: 18px; color: #333947; margin-bottom: 0.2rem; text-align: center; } .crop_p5 { font-size: 14px; color: #464d61; line-height: 28px; text-align: center; } .crop_s { color: white; position: absolute; left: 0; top: 0; width: 100%; display: flex; flex-wrap: wrap; } .crop_s p { width: 1.7rem; min-width: 1.7rem; height: 0.6rem; display: flex; align-items: center; font-size: 18px; margin-right: 2.67rem; } .crop_s p:nth-of-type(1), .crop_s p:nth-of-type(2) { margin-bottom: 1.48rem; } .crop_s p:nth-of-type(2n) { margin-right: 0; padding-left: 0.7rem; } .crop_s p:nth-of-type(1), .crop_s p:nth-of-type(3) { padding-left: 0.24rem; } /* */ /* */ .money_bg { background-color: #f0f3f7; width: 100%; overflow: hidden; } .money { display: flex; width: 1200px; margin: 0 auto; padding: 0.86rem 0; } .money_img { margin-right: 2.2rem; } .money_r { padding-top: 0.56rem; } .money_p1 { font-size: 0.38rem; color: #333947; line-height: 1; margin-bottom: 0.34rem; font-family: Arial, "Source Han Sans CN"; } .money_p2 { font-size: 0.14rem; color: #464d61; line-height: 1.7; } .money_p3 { background-color: #619fd0; border-radius: 3px; width: 1.56rem; height: 0.5rem; display: flex; align-items: center; justify-content: center; font-size: 14px; color: white; margin-top: 40px; cursor: pointer; } .money_p3 img { margin-right: 10px; height: 18px; object-fit: contain; } @media screen and (min-width: 1200px) { .advan_item:nth-of-type(3n) { margin-right: 0; } .chall_list::-webkit-scrollbar { width: 8px; background-color: #f5f5f5; } .chall_list::-webkit-scrollbar-thumb { background-color: #caced4; border-radius: 30px; } } @media screen and (max-width: 1920px) {} @media screen and (max-width: 800px) { .track_l, .money_img, .empl_imgs, .crop_r { display: none; } .head_d1, .chall_l, .chall_r, .advan, .advan_p1, .money, .mapp, .solution, .cons_list, .empl, .crop_l, .crop_r, .crop_list { width: 90%; margin: 0 auto; } .head_p3, .chall, .chall_img1, .chall_img1 img, .chall_item, .advan_list, .track, .money_img, .money_img img, .money_p3, .zplc, .mapp_r img, .cons, .cons_ul, .school, .school_ul, .empl_img, .crop { width: 100%; min-width: 100%; } .chall, .money, .mapp, .solution_d2, .cons_ul, .school_ul, .crop_cont { display: block; } .chall_r { padding-left: 0; } .chall { padding-top: 0.5rem; padding-bottom: 0.5rem; } .advan_item { width: 47%; margin-right: 6%; } .advan_item:nth-of-type(2n) { margin-right: 0; } .track { padding: 0.5rem; } .money_img { margin-right: 0; } .money_p2 { font-size: 0.2rem; } .chall_p3 { font-size: 0.18rem; } .chall_p2 { font-size: 0.24rem; } .head_p3 { font-size: 0.18rem; } .chall_list { height: 7rem; margin: 0 auto; } .mapp_p1 { line-height: 1.4 } .solution_d2 { height: auto; } .solution_d6 div { margin-right: 30px !important; margin-bottom: 10px !important; } .solution_d6 div:nth-of-type(2n), .solution_d3 { margin-right: 0 !important; } .solution_d3 { margin-left: 0 !important; } .solution_d1 { background-color: #062678; background-image: none; } .solution_d3 { margin-bottom: 20px; } .solution_bg { padding: 0.5rem 0; } .cons_item a { width: 1.2rem; height: 1.2rem; font-size: 14px; } .cons_ul { background-image: none; } .cons_li { width: 100% !important; text-align: center; margin: 0.2rem 0; color: #062678; } .cons_list { margin-bottom: 0.5rem; } .mapp { padding: 0.5rem 0; } .cons_ul { height: auto; } .school_list { padding: 0 0.2rem; background-image: none; } .school_ul { padding: 0 0.2rem; } .school_list { flex-wrap: wrap; justify-content: flex-start; } .school_item { width: 30%; margin-right: 5%; margin-bottom: 0.5rem; } .school_item:last-of-type { width: 40%; } .school_item:nth-of-type(3n) { margin-right: 0; } .school_li { width: 90%; margin: 0 auto 0.2rem !important; padding: 0.5rem !important; position: initial; text-align: left !important; height: auto; } .school_img { width: 320px; height: 320px; position: relative; top: 0; transform: translateX(-50%); } .school_form { width: 90%; margin: 0 auto; } .school_tb { width: 50%; margin: 0 auto 0.5rem !important; padding: 0 !important; } .school_p10 span { font-size: 28px; } .school_p10 { font-size: 18px; } .school_p11 { font-size: 16px; } .school_p8, .school_p9 { width: 90%; margin: 0 auto 0.2rem; } .school_p9 { line-height: 1.5; margin-bottom: 0.5rem; } .empl_img { background-image: none; padding: 0; margin: 0; height: auto; } .empl_p1 { background-color: #619fd0; border-radius: 50%; margin: 0 auto 0.2rem; } .empl_item { display: block; text-align: center; height: auto; } .empl_p2 { width: 100%; } .empl_ul { flex-wrap: wrap; } .empl_li { width: 46%; margin-bottom: 0.3rem; } .empl_p5 { height: 2.2rem; } .empl_p3 { margin: 0.8rem auto 0.4rem; } .crop_r { margin-top: 0.4rem; } .crop_list { padding: 0; display: block; } .crop_p5 { font-size: 16px; line-height: 1.6; } .crop_item { width: 100%; padding: 0.3rem 0; } .crop_p4 { font-size: 22px; margin-top: 0.2rem; } .school_p3 { font-size: 14px; } .crop_p1 { font-size: 16px; } .school_p7 { height: 2rem; } .empl_wap { display: block; } .empl_imgs_bg .empl_wap .empl_s, .empl_imgs_bg .empl_wap .empl_p8, .empl_imgs_bg .empl_wap .empl_p9 { margin-left: auto; margin-right: auto; padding: 0; width: 95%; height: auto; transform: none; position: static; opacity: 1; } .empl_imgs_bg .empl_wap .empl_p8 { font-size: 18px; padding: 10px 0; } .empl_imgs_bg .empl_wap .empl_p9 { font-size: 16px; line-height: 1.6; } .empl_imgs_bg .empl_wap .empl_s { margin-bottom: 20px; margin-top: 10px; } .empl_imgs_bg .wap_pc_img { margin: 0 auto 20px; } .school_item:last-of-type .school_p1 { transform: none; } .empl_s:nth-of-type(1) .empl_p8, .empl_s:nth-of-type(6) .empl_p8 { background-color: #b0cfe7; } }