page {
  background-color: #f9f9f9;

  .container {
    width: 100%;

    .new__container {
      width: 100%;
      padding: 0 32rpx;
      box-sizing: border-box;


      .card {
        background-color: #fff;
        border-radius: 8rpx;
        width: 100%;
        padding: 0 32rpx;
        box-sizing: border-box;

        .select_box {
          position: relative;
          margin-right: 10rpx;

          .select {
            box-sizing: border-box;
            width: 100%;
            border: 0px solid #efefef;
            border-radius: 8rpx;
            display: flex;
            align-items: center;

            .select_text {
              font-size: 35rpx;
              flex: 1;
              color: #000;
              letter-spacing: .2em;
            }

            .colorHui {
              color: #BDC4CE;
              font-size: 28rpx;
            }

            .select_img {
              width: 28rpx;
              height: 28rpx;
              margin-left: 10rpx;
              display: block;
              transition: transform 0.3s;
            }

            .select_img_rotate {
              transform: rotate(180deg);
            }

          }

          .option_box {
            position: absolute;
            top: 52rpx;
            width: 100%;
            border: 0px solid #efefef;
            box-sizing: border-box;
            height: 0;
            overflow-y: auto;
            border-top: 0;
            background: #FFF;
            transition: height 0.3s;
            z-index: 5;

            .option {
              display: block;
              line-height: 40rpx;
              font-size: 30rpx;
              border-bottom: 1px solid #efefef;
              padding: 10rpx;
              color: black;
            }
          }
        }

        .card_logo,
        .card_time {

          .change_4S {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: space-between;

            // .pickeritem {
            //   width: 100%;

            .picker {
              width: 100%;
              display: flex;
              justify-content: space-between;
              align-items: center;

              .picker_1 {
                color: #000;
                width: 394rpx;
                box-sizing: border-box;
                font-size: 28rpx;
              }

              .picker_2 {

                width: 394rpx;
                box-sizing: border-box;
                font-size: 28rpx;
                color: #BDC4CE;
              }

              .rowimg {
                width: 48rpx;
                height: 48rpx;

                image {
                  width: 48rpx;
                  height: 48rpx;
                }
              }
            }

            .rowimg {

              width: 48rpx;
              height: 48rpx;

              image {
                width: 48rpx;
                height: 48rpx;
              }
            }

            // }
          }

        }

        .car {
          width: 100%;
          display: flex;
          align-items: center;
          height: 125rpx;
          flex: 1;
          border-bottom: 1rpx solid #f5f5f5;

          .labelsitem {
            width: 180rpx;
          }

          .inputitem {
            flex: 1;
          }

          .text_car {
            font-size: 28rpx;
            color: #BDC4CE;
            line-height: 48rpx;
          }
        }

        .card_km {
          display: flex;
          align-items: center;
          height: 125rpx;
          flex: 1;
          border-bottom: 1rpx solid #f5f5f5;

          .km {
            font-size: 28rpx;
            color: #06121E;
            width: 50rpx;
            text-align: right;
          }

          .labelsitem {
            width: 180rpx;
          }

          .flex_km {
            flex: 1;
          }

          .text_car {
            font-size: 28rpx;
            color: #BDC4CE;
            line-height: 48rpx;
          }
        }

        .car4S {
          border: none;
        }
      }

      .rules {
        margin-top: 14rpx;
        padding: 15rpx 30rpx 200rpx;
        box-sizing: border-box;
        background-color: #fff;
        height: 100%;

        .title {
          font-size: 24rpx;
          color: #06121E;

        }

        .rich_text {
          padding: 15rpx 0 32rpx;
          box-sizing: border-box;
          color: #8C9198;
          font-size: 24rpx;
          line-height: 50rpx;
        }
      }



      .downbtn {
        width: 100%;
        position: fixed;
        bottom: 0;
        left: 0;
        background-color: #fff;


        .books_change {
          margin: 10rpx 0;
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 32rpx;
          box-sizing: border-box;


          .radios {
            image:nth-child(2) {
              display: none;
              width: 60rpx;
              height: 60rpx;
            }

            image:nth-child(1) {
              width: 28rpx;
              height: 28rpx;
            }
          }

          .fuwuxie_t {
            font-size: 28rpx;
            line-height: 40rpx;
            margin-left: 10rpx;


          }

          .fuwuxieyi {
            display: inline;
            color: #12d1eb;
          }
        }

        .ben_tn {
          width: 100%;
          padding: 0 64rpx;
          box-sizing: border-box;


          .btn {
            width: 620rpx;
            height: 80rpx;
            margin: 10rpx 0;
            line-height: 80rpx;
            padding: 0;
            font-weight: 400;
            font-size: 28rpx;
            background-color: #E8370F;
            color: #fff
          }
        }
      }

      /*使屏幕变暗  */
      .commodity_screen {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        background: #000;
        opacity: 0.2;
        overflow: hidden;
        z-index: 1000;
        color: #fff;
      }

      /*对话框 */
      .commodity_attr_box {
        height: 400rpx;
        width: 100%;
        overflow: hidden;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2000;
        background: #f5f5f5;
        padding: 20rpx;
        box-sizing: border-box;

        .tent {
          width: 100%;
          display: flex;
          flex-wrap: wrap;

          .carText {
            padding: 15rpx;
            font-size: 31rpx;
            box-sizing: border-box;
            background-color: #Fff;
            margin: 11rpx;
          }

          .activedCar {
            background-color: #12d1eb;
            color: #fff;
          }
        }


      }

    }
  }
}