.ab_header { width: 100%; height: 3.9rem; position: relative; padding-top: 0.8rem; } .ab_header img { width: 100%; height: 100%; } .suspension { position: absolute; left: 2rem; top: 1.3rem; color: white; } .suspension div { font-weight: bold; font-size: 0.4rem; margin-bottom: 0.4rem; } .suspension p { font-size: 0.16rem; } .piece { width: 100%; background-color: white; } .piece_color { background-color: #f5f6f9ff; position: relative; } .piece_item { width: 13rem; margin: 0 auto; padding: 1rem 0 0.2rem; } .area_title { color: #000000; letter-spacing: 0.01rem; font-size: 0.4rem; font-weight: bold; text-align: center; margin-bottom: 0.4rem; } .area_client{ margin-top:1rem ; } .area_comm p { color: #000000; font-size: 0.16rem; text-align: left; letter-spacing: 0.02rem; line-height: 0.3rem; margin: 0; text-indent: 2em; margin-bottom: 0.3rem; } .area_top { display: flex; } .area_left { flex: 3; text-align: right; } .area_num { color: #2d8cf0; font-weight: bold; font-size: 0.48rem; } .area_tit { color: #333333; font-weight: bold; font-size: 0.18rem; line-height: 0.6rem; } .area_jia { color: #2d8cf0; font-weight: bold; font-size: 0.36rem; margin-top: -0.1rem; } .area_com { color: #666666; font-size: 0.14rem; line-height: 0.3rem; } .area_right { flex: 3; text-align: left; } .area_spacing { height: 2.5rem; display: flex; flex-direction: column-reverse; } .area_top img { width: 5rem; height: 5rem; margin: 0 1rem; } .area_approve { position: absolute; left: 50%; transform: translate(-50%, 0); } .area_bot { margin-top: 0.3rem; } .ab_minsin { width: 100%; height: 3.2rem; position: absolute; } .piece_items { width: 13rem; padding: 0.8rem 0 0.2rem; position: absolute; left: 50%; transform: translateX(-50%); } .area_four { display: flex; justify-content: space-between; } .area_fs { width: 2.8rem; background-color: white; color: #333333; text-align: center; padding: 0 0.1rem; box-sizing: border-box; } .area_fs:hover{ cursor: pointer; border-radius: 0.04rem; box-shadow: 0 0 0.12rem #0000001a; transform: translate(0, -4px); } .area_fs img { width: 0.88rem; height: 0.88rem; margin: 0.4rem auto 0.2rem; } .area_fs div { font-size: 0.18rem; line-height: 0.5rem; margin-bottom: 0.4rem; } .develop_container { height: 1.6rem; position: relative; } .jt { position: absolute; top: 50%; transform: translateY(-50%); width: 0.15rem; height: 0.26rem; cursor: pointer; z-index: 1000; } .leftjt { left: 0.2rem; } .rightjt { right: 0.2rem; } .showdata { width: 90%; height: 1.6rem; margin: 0 auto; position: relative; overflow: hidden; } .line { width: 100%; height: 0.04rem; background-color: #f3f4f8ff; position: absolute; top: 50%; transform: translateY(-50%); } .rounds { width: 100%; height: 1.6rem; position: absolute; top: 44%; left: 0; white-space: nowrap; } .round_q { display: inline-block; width: 2.34rem; height: 100%; } .round_item { margin: 0 auto; width: 0.18rem; height: 0.18rem; line-height: 0.18rem; background-color: white; border-radius: 50%; border: 1px solid #e4e4e4ff; position: relative; cursor: pointer; } .round_i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 0.12rem; height: 0.12rem; background-color: #e4e4e4ff; border-radius: 50%; } .round_d { width: 0.9rem; text-align: center; font-size: 0.18rem; color: #cccccc; position: absolute; top: 0.4rem; left: -0.35rem; } .active .round_item { border-color: #016cff; } .active .round_i { background-color: #016cff; } .active .round_d { color: #016cff; font-size: 0.36rem; font-weight: bold; } .develop_data{ padding: 0 5%; margin: 0.4rem 0 0.2rem; display: flex; justify-content: space-between; } .dev_list{ width: 33%; height: 2rem; } .dev_item{ color: #666666; font-size: 0.14rem; line-height: 0.5rem; padding-right: 0.2rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .dev_item span{ color: #016cff; } .bot_fs img{ margin-bottom: 0; } .wan{ padding-top: 0.06rem; font-size: 0.42rem; color: #2d8cf0; font-weight: 600; }