.part { padding-bottom: .6rem; margin-bottom: .4rem; } .part .title{ font-size: 1.1rem; font-weight: 700; color: #ffffff; } .part .title span{ margin: 0 .3rem; } .part .title img{ width: 1.2rem; position: relative; top: .1rem; } .part .btn{ width: 7.5rem; height: 1.73rem; background-image: linear-gradient(0deg, #ffd200 0%, #f9e14c 100%, #84ad65 100%, #0f797e 100%); border-radius: 0.84rem; color: #1a1a1a; font-weight: 700; } .part>p.sec_t{ font-size: 0.55rem; color: #c4cbff; margin-top: .2rem; position: relative; z-index: 1; line-height: .85rem; } .part2{ width: 100%; padding-top: 0.8rem; background: url(/uploads/image/zjuimg/part2_bg.png) no-repeat; background-size: 97.5%; padding-bottom: 1.4rem; } .part2 .lead{ width: 10.91rem; height: 5.4rem; font-size: 0.6rem; font-weight: 700; line-height: 1.2rem; color: #ffffff; background: url(/uploads/image/zjuimg/lead.png) no-repeat; background-size: 100%; margin-left: 1.13rem; padding-left: .45rem; padding-top: .3rem; margin-bottom: 0.5rem; } .part2 .lead span{ width: 0.28rem; height: 0.28rem; background-color: #fbb29d; border-radius: .28rem; margin-right: .25rem; } .part2 ul{ padding: 0 1.27rem; margin-top: .5rem; } .part2 li{ width: 3rem; height: 1.3rem; border-radius: 0.63rem; border: solid 0.06rem #a8a3ff; font-size: 0.55rem; color: #ffffff; } .part2 ul li span{ margin-top: .4rem; } .part3{ padding-left: .43rem; } .form_box form{ padding: .9rem .85rem .75rem; flex-wrap: wrap; } .form_box form .item{ width: 49%; margin-bottom: .4rem; } .form_box form input,select{ width: 100%; height: 1.53rem; background-color: #ffffff; font-size: 0.55rem; line-height: 1.53rem; color: #a1a1a1; padding-left: .43rem; } .form_box form input::placeholder{ color: #a1a1a1; } .form_box form select{ background: #ffffff url(/uploads/image/zjuimg/arrow.png) no-repeat; background-size: 7%; background-position: 95% center; } .form_box form .item.yzm span{ width: 50%; height: 1.53rem; background-color: #333333; flex-shrink: 0; font-size: 0.55rem; color: #ffffff; } .form_box form .btn{ width: 49%; height: 1.53rem; background-image: linear-gradient(0deg, #ffd200 0%, #f9e14c 100%, #84ad65 100%, #0f797e 100%); border-radius: 0.84rem; font-size: 0.6rem; border-radius: 1rem; font-weight: 700; margin-bottom: .4rem; } .part4 .title::after, .part9 .title::after{ content: "get"; font-size: 3.41rem; font-weight: 700; letter-spacing: 0.28rem; color: #3a2cae; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0); z-index: -1; } .part4 .img .self_btn{ position: absolute; left: 0.8rem; bottom: 0.5rem; width: 5rem; height: 2rem; border-radius: 0.09rem; } .part4{ margin-top: 2rem; } .part4 .title::after{ content: "pick"; } .part4 ul{ margin-top: .7rem; overflow: hidden; } .part4 li{ width: auto; margin-bottom:.4rem; /* transform: translatex(-100px); */ position: relative; padding: 0 1.5rem; } .part4 li:nth-child(2n){ justify-content: flex-end; } .part4 li:last-child{ margin-bottom: 0; } .part4 li span{ width: auto; height: 1.23rem; line-height: 1.23rem; text-align: center; background-color: #3a2cae; border-radius: 0.59rem; font-size: 0.5rem; color: #ffffff; padding: 0 .3rem; flex-shrink: 0; margin-right: .4rem; letter-spacing: 2px; } .part4 .remark{ font-size: 0.75rem; color: #ffffff; } .part4 .img{ margin-top: .8rem; padding: 0 0.65rem; position: relative; } .part5{ background: url(/uploads/image/zjuimg/part5_bg.png) no-repeat; background-size: 97.5%; padding-bottom: 1.6rem; } .part5>p{ font-size: 0.6rem; line-height: 1.1rem; letter-spacing: 0rem; color: #ffffff; padding-left: .95rem; padding-top: 1rem; margin-bottom: 2rem; } .part5 ul{ padding: 0 1.27rem; margin-top: .5rem; } .part5 li{ width: 3rem; height: 1.3rem; border-radius: 0.63rem; border: solid 0.06rem #a8a3ff; font-size: 0.55rem; color: #ffffff; } .part6{ padding: 0 0.63rem; margin-top: 1rem; } .part6>p.sec_t{ margin-top: .5rem; } .part6 ul{ width: 100%; background: url(/uploads/image/zjuimg/360_bg.png) no-repeat; background-size: 100%; margin-top: 1rem; padding: 1.08rem .3rem 1.4rem; flex-wrap: wrap; } .part6 ul li{ width: 25%; flex-direction: column; } .part6 ul li.mar_b{ margin-bottom: .5rem; } .part6 ul li img{ width: 2.17rem; } .part6 ul li p{ font-size: 0.65rem; line-height: .8rem; color: #333333; margin-top: .15rem; } .part6 .btn_box{ margin-top: 1rem; padding-left: 1rem; } .part6 .btn{ margin: 0 ; } .part6 .btn:nth-child(1){ width: 5.35rem; } .part6 .btn:nth-child(2){ width: 7.48rem; } .part6 .img_icon{ width: 4.13rem; position: absolute; top: -.3rem; right: 0; } .part7{ padding: 0 0.63rem .3rem; margin-top: 2rem; } .part7>p.sec_t{ margin-top: .5rem; } .part7 .content{ width: 100%; border-radius: 0.13rem; margin-top: 1rem; padding: 0 .43rem .4rem; } .part7 .content>p{ font-size: 0.6rem; line-height: .9rem; color: #666666; } .part7 ul{ width: 100%; flex-wrap: wrap; align-items: flex-start; } .part7 li{ width: 50%; border: solid 0.02rem #ffffff; height: 4.3rem; flex-direction: column; } .part7 li b{ font-size: 1.39rem; height: 1.5rem; line-height: 1.5rem; letter-spacing: -0.1rem; margin-bottom: .3rem; background: linear-gradient(180deg, #fffcf7 0%, #fbe5b6 100%); -webkit-background-clip: text; color: transparent; } .part7 li p{ font-size: 0.65rem; color: #ffffff; } .part7 .img_box{ align-items: flex-start; margin-top: .88rem; background: url(/uploads/image/zjuimg/part7_bg.png) no-repeat; background-position: bottom center; background-size: 100%; padding-bottom: 0.4rem; } .part7 .img_box>div{ width: 6.85rem; } .part7 .img_box p{ margin-top: .2rem; font-size: 0.5rem; line-height: 0.8rem; color: #ffffff; } .part7 .img_icon{ width: 3.43rem; position: absolute; top: -1rem; right: 0; } .same_part{ margin-top: 1.3rem; padding-left: .6rem; position: relative; } .same_part h2{ font-size: .9rem; color: #ffffff; margin: .4rem 0 0; } .same_part>.top span{ width: 0.33rem; height: 0.33rem; background-color: #ffffff; opacity: 0.6; flex-shrink: 0; } .same_part>.top em{ font-size: 0.51rem; color: #ffffff; opacity: 0.6; flex-shrink: 0; margin: 0 .38rem 0 .23rem; } .same_part>.top i{ width: 100%; height: 0.05rem; background-color: #ffffff; opacity: 0.6; } .part8>p.sec_t{ margin-top: .5rem; } .part8 ul{ flex-wrap: wrap; padding: 0 .5rem 0 0; margin-top: 1rem; position: relative; z-index: 1; } .part8 li{ width: 7.28rem; height: 3.4rem; background: url(/uploads/image/zjuimg/li_1_bg.png) no-repeat; background-size: 100%; padding-top: .3rem; padding-left: 3.4rem; } .part8 li:nth-child(2){ background: url(/uploads/image/zjuimg/li_2_bg.png) no-repeat; background-size: 100%; } .part8 li:nth-child(3){ background: url(/uploads/image/zjuimg/li_3_bg.png) no-repeat; background-size: 100%; } .part8 li:nth-child(4){ background: url(/uploads/image/zjuimg/li_4_bg.png) no-repeat; background-size: 100%; } .part8 li:nth-child(5){ background: url(/uploads/image/zjuimg/li_5_bg.png) no-repeat; background-size: 100%; } .part8 li:nth-child(6){ background: url(/uploads/image/zjuimg/li_6_bg.png) no-repeat; background-size: 100%; } .part8 li p{ font-size: .7rem; font-weight: 700; color: #4742f4; font-style: italic; } .part8 .btn_box{ padding: 0 1rem; } .part8 .btn_box .btn:first-child{ width: 5.3rem; } .part8 .btn_box .btn:last-child{ width: 7.48rem; } .part8 .img_icon{ width: 4.13rem; position: absolute; top: -.3rem; right: 0; } .part9 .content{ width: 14.75rem; margin: 1.5rem auto 0; padding-top: .98rem; } .part9 .content1{ height: 17rem; background-color: #332ba5; border-radius: 0.26rem; border: solid 0.13rem #7267c5; } .part9 .content img{ width: 6.2rem; position: relative; left: 1.58rem; } .part9 .content>p{ font-size: 0.68rem; letter-spacing: 0rem; color: #ffffff; text-shadow: 0.04rem 0.07rem 0.08rem rgba(12, 4, 7, 0.7); padding-left: 1.5rem; margin-top: .1rem; } .part9 .content ul{ flex-direction: column; padding: 0 .63rem 0 .53rem; margin-top: .5rem; } .part9 .content li{ width: 100%; height: 2.65rem; background: no-repeat; background-size: auto 100%; border-radius: 0.26rem; margin-bottom: .43rem; padding-left: 1.6rem; padding-top: .3rem; } .part9 .content li:nth-child(2){ background: no-repeat; background-size: auto 100%; } .part9 .content li:nth-child(3){ background: url(/uploads/image/zjuimg/3_part9.png) no-repeat; background-size: auto 100%; } .part9 .content li:nth-child(4){ background: no-repeat; background-size: auto 100%; } .part9 .content li b{ font-size: 0.77rem; letter-spacing: 0.08rem; color: #332ba5; } .part9 .content li p{ font-size: 0.64rem; color: #666666; margin-top: .1rem; } .part9 .content.content2{ width: 14.75rem; height: 9.43rem; background: no-repeat; background-size: 100%; margin-top: .83rem; } .part9 .content.content2 .spans{ justify-content: flex-end; padding-right: 1.25rem; } .part9 .content.content2 .spans span{ width: 2.35rem; height: 1.25rem; background-color: #4a44be; border-radius: 0.61rem; font-size: 0.68rem; font-weight: 700; color: #ffffff; margin-left: .28rem; } .part9 .content2>p{ margin-top: .3rem; margin-bottom: .5rem; } .part9 .content2>div.advan{ width: 13.08rem; height: 4.45rem; background-color: #ffffff; border-radius: 0.26rem; margin: 0 auto; padding-left: 1.2rem; } .part9 .content2>div.advan b{ font-size: 0.98rem; color: #332ba5; margin-right: 1rem; position: relative; z-index: 1; } .part9 .content2>div.advan b:after{ content: ""; width: 100%; height: 0.28rem; background-color: #ffe13f; border-radius: 0.12rem; position: absolute; left: 0; bottom: 0; z-index: -1; } .part9 .content2>div.advan p{ font-size: 0.68rem; line-height: 1.2rem; color: #000000; }