.part { padding-bottom: .6rem; margin-bottom: .4rem; } .part .title{ font-size: 1rem; font-weight: 700; color: #ffffff; align-items: flex-end; letter-spacing: .05rem; } .part .title span{ margin: 0 .3rem; } .part .title img{ width: 0.78rem; position: relative; top: -.15rem; } .part>p.sec_t{ font-size: 0.6rem; color: #ffffff; margin-top: .2rem; position: relative; z-index: 1; } .part1 ul{ flex-wrap: wrap; padding: 0 2.2rem; margin-top: .8rem; } .part1 li{ width: 2.7rem; height: 1.1rem; border-radius: 0.13rem; border: solid 0.04rem #f7afa8; font-size: 0.55rem; font-weight: 700; letter-spacing: -0.03rem; color: #ffffff; margin-bottom: .45rem; } .part1 .img{ width: 14.75rem; margin: .55rem auto 0; } .part .btn{ width: 6.4rem; height: 1.73rem; background-color: #fff600; border-radius: 0.26rem; margin: 1.25rem auto 0; font-size: 0.75rem; color: #4f0600; } .part2 .return{ font-size: 0.8rem; font-weight: 700; color: #ffffff; } .part2 .return i{ width: 0.9rem; height: 0.08rem; background-color: #ffffff; } .part2 .return span{ margin: 0 .33rem; } .part2 ul{ padding: 0 .63rem; align-items: flex-start; margin-top: .7rem; } .part2 ul li{ width: 4.3rem; flex-direction: column; font-size: 0.55rem; font-weight: 700; line-height: .8rem; color: #ffffff; } .part2 ul li span{ margin-top: .4rem; } .form_box form{ padding: .5rem .5rem .75rem; flex-wrap: wrap; } .form_box form .item{ width: 49%; margin-bottom: .23rem; } .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/zjximg/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% !important; height: 1.53rem!important; margin: 0 !important; font-size: 0.55rem; border-radius: 1rem; font-weight: 700; } .part3{ margin-top: 1rem; } .part3 .title,.part4 .title{ position: relative; z-index: 1; } .part3 .title::after, .part4 .title::after{ content: "get"; font-size: 3.41rem; font-weight: 700; letter-spacing: 0.28rem; color: #ea3c2b; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0); z-index: -1; } .part3 ul{ flex-wrap: wrap; padding: 0 .63rem; margin-top: .8rem; } .part3 li{ width: 4.5rem; height: 3.85rem; background: url(/uploads/image/zjximg/4_pic.png) no-repeat; background-size: 100%; border-radius: 0.13rem; margin-bottom: .8rem; flex-direction: column; padding: .4rem .38rem 0; } .part3 li:nth-child(2){ background: no-repeat; background-size: 100%; } .part3 li:nth-child(3){ background: url(/uploads/image/zjximg/6_pic.png) no-repeat; background-size: 100%; } .part3 li:nth-child(4){ background: url(/uploads/image/zjximg/7_pic.png) no-repeat; background-size: 100%; } .part3 li:nth-child(5){ background: url(/uploads/image/zjximg/8_pic.png) no-repeat; background-size: 100%; } .part3 li:nth-child(6){ background: no-repeat; background-size: 100%; } .part3 li b{ font-size: 0.75rem; color: #4f0600; width: 2.6rem; text-align: center; border-bottom: 1px solid #4f0600; padding-bottom: .3rem; margin-bottom: .35rem; } .part3 li p{ font-size: 0.5rem; line-height: 0.7rem; color: #4f0600; text-align: center; } .part3 .img,.part4 .img { width: 14.75rem; margin: 0.4rem auto 0; position: relative; } .part3 .img .self_btn, .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; padding: 0 .5rem; } .part4 li{ width: auto; margin-bottom:.4rem; /* transform: translatex(-100px); */ position: relative; flex-wrap: wrap; } .part4 li:last-child{ margin-bottom: 0; flex-wrap: nowrap; flex-direction: column; align-items: flex-start; padding: 0 1rem; } .part4 li span{ width: auto; height: 1.23rem; line-height: 1.23rem; text-align: center; background-color: #dc2415; border-radius: 0.59rem; font-size: 0.5rem; color: #ffffff; padding: 0 .2rem; flex-shrink: 0; margin-bottom:.4rem; } .part4 li:last-child span:nth-child(2n){ align-self: flex-end } .part4 .remark{ font-size: 0.75rem; color: #ffffff; } .part4 .img{ margin-top: .8rem; } .part5 ul{ padding: 0 1.27rem; margin-top: .5rem; } .part5 li{ width: 3rem; height: 1.3rem; border-radius: 0.63rem; border: solid 0.06rem #f7afa9; font-size: 0.55rem; color: #ffffff; } .part6{ padding: 0 0.63rem; } .part6 ul{ width: 100%; background-color: #ffffff; border-radius: 0.13rem; margin-top: .5rem; padding: 1.08rem .3rem .5rem; 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; } .part6 .btn{ margin: 0 ; } .part7{ padding: 0 0.63rem .3rem; } .part7 .content{ width: 100%; background-color: #ffffff; border-radius: 0.13rem; margin-top: .8rem; padding: .4rem .43rem; } .part7 .content>p{ font-size: 0.6rem; line-height: .9rem; color: #666666; } .part7 ul{ width: 100%; height: auto; margin-top: .4rem; flex-wrap: wrap; } .part7 ul video{ width: 100%;} .part7 li{ width: 49.8%; background-color: #f34e3e; 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(0, #fbe6b8 0%, #ffffff 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; } .part7 .img_box>div{ width: 49.8%; } .part7 .img_box p{ margin-top: .2rem; font-size: 0.5rem; line-height: 0.8rem; color: #000000; }