zx_flk_app/pages/carIntroduce/carIntroduce.css

.container {
	
}

.top-box {
	margin-top: 100rpx;
}

.top-item {
	position: relative;
	height: 380rpx;
	/* margin-top: -118rpx; */
}

.top-item >img {
	width: 100%;
	height: 380rpx;
	/* background: url('https://qiniu.bms16.com/FguJzvAGtd4AdhDKXVLUo7XiMxWQ') no-repeat;
	background-size: cover; */
}

.top-content {
	position: absolute;
	right: 50rpx;
	bottom: 100rpx;
}

.content-upper {
	align-items: flex-start;
	margin-bottom: 24rpx;
}

.content-upper > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 36rpx;
	font-family: PingFangSC, PingFang SC;
	line-height: 36rpx;
	font-weight: 600;
	margin-bottom: 16rpx;
}

.plate-number {
	background-color: #F3F8FF;
	border-radius: 0rpx 24rpx 24rpx 0rpx;
	padding: 6rpx 24rpx 8rpx 16rpx;
}

.plate-number > view {
	color: #5E6F90;
	font-size: 26rpx;
	line-height: 26rpx;
	font-weight: 500;
}

.under-right {
	margin-left: 66rpx;
}

.under-left > view:nth-of-type(1),
.under-right > view:nth-of-type(1) {
	color: #0074FF;
	font-size: 72rpx;
	font-family: DIN, DIN;
	line-height: 80rpx;
	font-weight: bold;
	margin-bottom: 12rpx;
}

.under-left > view:nth-of-type(1) > text,
.under-right > view:nth-of-type(1) > text {
	font-size: 32rpx;
}

.content-under img {
	width: 128rpx;
	height: 30rpx;
}

.plan-info {
	padding: 48rpx 24rpx 40rpx 32rpx;
	background-color: #ffffff;
	margin-bottom: 16rpx;
}

.plan-info > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
	margin-bottom: 32rpx;
	height: 40rpx;
	line-height: 40rpx;
}

.plan-type{
	width: 700rpx;
	position: relative;
}
.plan-type-1 {
	margin-bottom: 40rpx;
	width: 700rpx;
	overflow-y: auto;
}
.plan-type-1::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 10rpx;
  background-image: radial-gradient(at  right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0) 70%);
  border-radius: 8rpx;
}

.plan-type > view:nth-of-type(3) {
	/* margin-right: 0rpx; */
}

.ptype-item {
	background-color: #E7F2FF;
	border-radius: 24rpx;
	border: 4rpx solid #E7F2FF;
	width: 204rpx;
	padding: 24rpx 12rpx;
	display: flex;
	width: 32%;
	margin-right: 10rpx;
	
}

.ptyped-item {
	background-color: #ffffff;
	border: 4rpx solid #0074FF;
	box-sizing: border-box;
	border-radius: 24rpx;
	/* width: 248rpx; */
	padding: 24rpx 12rpx;
	display: flex;
	align-items: center;
	width: 32%;
	margin-right: 10rpx;
}

.selectedPtype {
	/* width: 248rpx; */
	/* flex: 1; */
	height: 162rpx;
	/* display: flex;
	justify-content: space-between;
	align-items: flex-end; */
	background-color: #ffffff;
	border: 4rpx solid #0074FF;
	box-sizing: border-box;
	border-radius: 24rpx;
	padding: 20rpx 20rpx 32rpx;
	margin-right: 16rpx;
}

.selectptype {
	/* flex: 1; */
	/* width: 176rpx; */
	height: 162rpx;
	/* display: flex; */
	/* justify-content: space-between;
	align-items: flex-end; */
	background-color: #EEF6FF;
	border: 4rpx solid #EEF6FF;
	box-sizing: border-box;
	border-radius: 24rpx;
	padding: 20rpx 20rpx 32rpx;
	margin-right: 16rpx;
}

.ptype-title {
	font-weight: 500;
	font-size: 28rpx;
	text-align: center;
	color: #2A3A5A;
}

.ptype-text {
	color: #2A3A5A;
}

.ptype-text text {
	font-family: DIN, DIN;
	font-weight: bold;
	font-size: 64rpx;
	color: #2A3A5A;
}

.ptyped-text {
	font-family: DIN, DIN;
	font-weight: bold;
	font-size: 64rpx;
	/* color: #2A3A5A; */
	color: #F95151;
}

/* .ptyped-text text {
	font-size: 40rpx;
} */

.plan-time > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 32rpx;
	font-weight: bold;
}

.quantity-count > input {
  width: 88rpx;
  height: 48rpx;
  border-radius: 24rpx;
  background-color: #F3F8FF;
  text-align: center;
  color: #2A3A5A;
}

.count-btn {
  width: 48rpx;
  height: 48rpx;
  vertical-align: middle;
}

.fbtn {
	color: #9FA7B7;
	margin-right: 16rpx;
}
.sbtn {
	/* color: #9FA7B7; */
	margin-left: 16rpx;
}

.coupon-info {
	margin-top: 32rpx;
}

.coupon-info > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 32rpx;
	font-weight: bold;
}

.coupon-info > view:nth-of-type(2) {
	color: #F95151;
	font-size: 32rpx;
}

.coupon-info img {
	width: 28rpx;
	height: 28rpx;
	vertical-align: middle;
	margin-left: 8px;
}

.car-info {
	background-color: #ffffff;
	margin-top: 16rpx;
	padding: 48rpx 32rpx 40rpx;
}

.car-title > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}

.car-title > view:nth-of-type(2) {
	color: #9FA7B7;
	font-size: 32rpx;
}

.car-top {
	margin-top: 40rpx;
	margin-bottom: 32rpx;
}

.car-top > img {
	width: 144rpx;
	height: 144rpx;
	border-radius: 24rpx;
	margin-right: 24rpx;
}

.top-flex > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 36rpx;
	margin-bottom: 16rpx;
}

.top-flex > view:nth-of-type(2) {
	color: #9FA7B7;
	font-size: 28rpx;
	margin-bottom: 24rpx;
}

.top-flex > view:nth-of-type(3) {
	color: #828DA2;
	font-size: 28rpx;
}

.top-flex > view:nth-of-type(3) img {
	vertical-align: middle;
	width: 32rpx;
	height: 32rpx;
	margin-right: 4rpx;
}

.car-bottom {
	border-radius: 16rpx;
}

.c-bottom-left {
	padding: 16rpx 34rpx 16rpx 24rpx;
	/* background: linear-gradient( 90deg, #ffffff, #D4E8FF); */
	background-color: #D4E8FF;
	position: relative;
	overflow: hidden;
	border: none;
	border-radius: 16rpx 0 0 16rpx;
}

.c-bottom-left:before {
    position: absolute;
    top: 0;
    right: -35rpx;
    width: 35rpx; /* 锐角部分宽度 */
    height: 100%;
    background-color: #ffffff;
    transform-origin: 100% 0;
    transform: skewX(-30deg); /* 锐角大小 */
  }

.c-bottom-left img {
	vertical-align: middle;
	width: 32rpx;
	height: 32rpx;
	margin-right: 12rpx;
}

.car-bottom > view:nth-of-type(2) {
	width: 60%;
	color: #0074FF;
	font-size: 28rpx;
	border-radius: 0 16rpx 16rpx 0;
	display: flex;
	justify-content: flex-end;
	padding: 18rpx 16rpx 18rpx 0;
	background: linear-gradient( to right, #ffffff, #D4E8FF);
}

.car-bottom > view:nth-of-type(2) img {
	width: 28rpx;
	height: 28rpx;
	vertical-align: middle;
	margin-left: 12rpx;
}

.deposit-info {
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}

.deposit-info > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
	margin-bottom: 40rpx;
}

.select-deposit {
	background-color: #EEF6FF;
	border-radius: 16rpx;
	padding: 32rpx 24rpx;
	/* display: flex;
	justify-content: space-between; */
}

.selected-deposit {
	border: 4rpx solid #0074FF;
	box-sizing: border-box;
	border-radius: 16rpx;
	padding: 32rpx 24rpx;
	/* display: flex;
	justify-content: space-between; */
}
	
.deposit-item-tip{
	font-size: 24rpx;
	color: #828DA2;
	margin-top: 20rpx;
}

.deposit-item >view {
	color: #2A3A5A;
	font-size: 32rpx;
	font-weight: bold;
}

.deposit-item >view > text {
	color: #828DA2;
	font-weight: 400;
}

.select-img {
	width: 40rpx;
	height: 40rpx;
	margin-right: 24rpx;
	vertical-align: middle;
}

.info-img {
	width: 28rpx;
	height: 28rpx;
	margin-left: 12rpx;
	vertical-align: middle;
}

.blue-text {
	color: #0074FF;
	font-size: 32rpx;
	font-weight: bold;
}

.black-text {
	color: #2A3A5A;
	font-size: 36rpx;
	font-weight: bold;
}

.guarantee-info {
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}

.guarantee-info > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
	margin-bottom: 40rpx;
}

.guarantee-title {
	margin-bottom: 40rpx;
}

.guarantee-title > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}

.guarantee-title > view:nth-of-type(2) {
	color: #9FA7B7;
	font-size: 32rpx;
	font-weight: 400;
}

.select-guarantee {
	background-color: #F3F8FF;
	border-radius: 24rpx;
}

.selected-guarantee {
	border: 4rpx solid #0074FF;
	box-sizing: border-box;
	border-radius: 24rpx;
}

.select-guarantee,
.selected-guarantee {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 32rpx 20rpx;
	box-sizing: border-box;
}

.guarantee-top {
	color: #2A3A5A;
	font-size: 28rpx;
	font-weight: bold;
	align-items: center;
}

.guarantee-top img {
	width: 62rpx;
	height: 56rpx;
	margin-bottom: 16rpx;
}

.guarantee-center {
	margin-top: 32rpx;
}

.center-item {
	font-size: 24rpx;
	width: 178rpx;
	margin-bottom: 16rpx;
}

.center-item > view:nth-of-type(1) {
	color: #828DA2;
	
}

.center-item > view:nth-of-type(2) {
	color: #0074FF;
}

.guarantee-border {
	border-bottom: 2rpx dashed #CFDCEF;
	width: 100%;
	margin-top: 24rpx;
	margin-bottom: 14rpx;
}

.guarantee-bottom {
	align-items: center;
}

.guarantee-bottom > view:nth-of-type(1) {
	color: #F95151;
	font-size: 38rpx;
	margin-bottom: 14rpx;
}

.blue-t {
	color: #0074FF;
	font-size: 24rpx;
}

.black-t {
	color: #2A3A5A;
	font-size: 24rpx;
}

.guarantee-bottom img {
	width: 24rpx;
	height: 24rpx;
}

.assort-info {
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}

.assort-info > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
	margin-bottom: 40rpx;
}

.assort-text view {
	display: flex;
	flex: 1;
	/* width: 342rpx; */
	padding: 24rpx;
	color: #2A3A5A;
	font-size: 32rpx;
	font-weight: bold;
	background-color: #F3F8FF;
}

.assort-text > view:nth-of-type(1) {
	border-radius: 16rpx 0 0 16rpx;
	margin-right: 4rpx;
}

.assort-text > view:nth-of-type(2) {
	border-radius: 0 16rpx 16rpx 0;
}

.payment-info {
	width: 100%;
	background-color: #ffffff;
	/* padding: 28rpx 32rpx 48rpx; */
	padding: 0 32rpx 48rpx;
	position: fixed;
	bottom: 0;
}

.modal-group {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.4);
}

.payment-info-main {
	background-color: #ffffff;
	/* padding: 28rpx 32rpx 48rpx; */
	position: fixed;
	width: 100%;
	bottom: 0;
	border-top-left-radius: 32rpx; /* 左上角圆角 */
	border-top-right-radius: 32rpx; /* 右上角圆角 */
	
}
.payment-info-top{
	padding: 28rpx 32rpx 0 32rpx;	
}
.detail-title-text{
	font-weight: 600;
	font-size: 40rpx;
	color: #2A3A5A;
	margin-bottom: 48rpx;
}
.detail-text{
	font-weight: 500;
	font-size: 36rpx;
	color: #2A3A5A;
	margin-bottom: 48rpx;
}
.detail-money-row{
	font-weight: 500;
	font-size: 36rpx;
	color: #2A3A5A;
	margin-bottom: 48rpx;
	display: flex;
	justify-content: flex-end;
}
.detail-text-money{
	font-weight: 500;
	font-size: 60rpx;
	color: #F95151;
}
.payment-main {
	padding: 28rpx 32rpx 48rpx;	
	box-shadow: 0rpx -2rpx 0rpx 0rpx #F4F5F6;
}

.payment-top {
	color: #2A3A5A;
	font-size: 28rpx;

}
.payment-blue-text {
	color: #0074FF;
	font-size: 28rpx;
}

.payment-top img {
	width: 32rpx;
	height: 32rpx;
	margin-right: 16rpx;
	vertical-align: middle;
}

.payment-bottom {
	margin-top: 42rpx;
	width: 100%;
}

.bottom-left {
	align-items: baseline;
}

.b-text {
	color: #0074FF;
	font-size: 28rpx;
	margin-left: 16rpx;
}

.bottom-left img {
	width: 49rpx;
	height: 49rpx;
	vertical-align: middle;
	margin-left: 4rpx;
}

.payment-bottom > view:nth-of-type(2) {
	color: #ffffff;
	font-size: 32rpx;
	font-weight: bold;
	/* padding: 28rpx 86rpx; */
	height: 88rpx;
	line-height: 88rpx;
	width: 380rpx;
	text-align: center;
	/* border-radius: 44rpx; */
	border-radius: 44rpx;
	background: linear-gradient( to right, #0074FF 0%, #00D7FF 100%);
}

.calendar-b {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.4);
}

.calendar-box {
	border-radius: 32rpx 32rpx 0rpx 0rpx;
	background-color: #ffffff;
	z-index: 100;
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 60%;
}

.store-title {
	padding: 40rpx 40rpx 0 32rpx;
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}

.store-title img {
	width: 48rpx;
	height: 48rpx;
	z-index: 1000;
}

.calendar-box > view:nth-of-type(2) {
	margin: 40rpx 32rpx 0 32rpx;
	color: #2A3A5A;
	font-size: 26rpx;
	background-color: #F3F8FF;
	border-radius: 16rpx;
	padding: 22rpx 0 22rpx 24rpx;
}

.store-info {
	padding: 48rpx 40rpx 0 32rpx;
}

.store-info > img {
	width: 144rpx;
	height: 144rpx;
	margin-right: 24rpx;
	border-radius: 16rpx;
}

.info-center > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 36rpx;
	margin-bottom: 16rpx;
}

.info-center > view:nth-of-type(2) {
	color: #9FA7B7;
	font-size: 28rpx;
	margin-bottom: 24rpx;
}

.info-center > view:nth-of-type(3) {
	color: #828DA2;
	font-size: 28rpx;
}

.info-center img {
	width: 26rpx;
	height: 26rpx;
	vertical-align: middle;
}

.info-bottom {
	color: #2A3A5A;
	font-size: 32rpx;
}

.info-bottom img {
	width: 36rpx;
	height: 36rpx;
	margin-bottom: 14rpx;
}

.info-border {
	margin-top: 80rpx;
	border-bottom: 2rpx solid #F4F5F6;
}

.sumbit {
	margin: 24rpx 32rpx 48rpx;
	color: #ffffff;
	font-size: 32rpx;
	background-color: #0074FF;
	border-radius: 40rpx;
	padding-top: 24rpx;
	padding-bottom: 24rpx;
	text-align: center;
}
.ride-info {
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}
.guarantee-title {
	margin-bottom: 40rpx;
}

.guarantee-title > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}

.guarantee-title > view:nth-of-type(2) {
	color: #9FA7B7;
	font-size: 32rpx;
	font-weight: 400;
}
.ride-border {
	border-radius: 24rpx;
	background: #F3F8FF;
	/* border: 4rpx solid #0074FF; */
	padding: 28rpx 32rpx 16rpx;
}
.top-left {
	color: #2A3A5A;
	font-size: 32rpx;
	font-weight: bold;
}

.top-left img {
	width: 62rpx;
	height: 56rpx;
	margin-right: 12rpx;
	vertical-align: middle;
}
.top-right {
	color: #F95151;
	font-size: 38rpx;
	font-weight: bold;
	
}

.dashed-border {
	margin-bottom: 22rpx;
	border-bottom: 2rpx dashed #CFDCEF;
}

.content-top {
	color: #2A3A5A;
	font-size: 28rpx;
	margin-bottom: 24rpx;
}

.tab-item {
	margin-bottom: 16rpx;
}

.tab-title {
	color: #828DA2;
	font-size: 24rpx;
}

.tab-price {
	color: #0074FF;
	font-size: 24rpx;
	font-weight: bold;
}

.return-type{
	padding: 48rpx 32rpx 40rpx 30rpx;
	background-color: #fff;
	margin-bottom: 20rpx;
}
.tip-title-text{
	color: #828DA2;
	font-size: 32rpx;
	font-weight: 400;
}
.return-type-title{
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: 600;
	margin-bottom: 40rpx;
}
.store-icon{
	width: 40rpx;
	height: 40rpx;
}
.return-type-main{
	
}
.can-return-view{
	padding: 32rpx 16rpx 32rpx 24rpx;
	background-color: #EEF6FF;
	border-radius: 16rpx;
	width: 100%;
}
.can-return-text{
	margin-left: 16rpx;
	font-weight: 500;
	font-size: 32rpx;
	color: #2A3A5A;
}
.grey-text{
	color: #828DA2;
	font-size: 32rpx;
	font-weight: 400;
}
.store-num{
	font-weight: 500;
	font-size: 36rpx;
	color: #0074FF;
}
.to-store-icon{
	width: 28rpx;
	height: 28rpx;
}
.current-store{
	align-items: center;
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}
.current-store > view:nth-of-type(1) {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}

.current-store-text{
	font-weight: 500;
	font-size: 32rpx;
	color: #2A3A5A;
}
.pay-type {
	background-color: #ffffff;
	padding: 40rpx 32rpx 32rpx;
	margin-bottom: 16rpx;
}
.pay-type-tital {
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}
.pay-type-item {
	display: flex;
}

.change-info {
	background-color: #ffffff;
	padding: 48rpx 32rpx 40rpx;
	margin-bottom: 16rpx;
}
.change-title {
	margin-bottom: 40rpx;
	color: #2A3A5A;
	font-size: 40rpx;
	font-weight: bold;
}
.change-border {
	width: 686rpx;
	height: 156rpx;
	background: #EEF6FF;
	border-radius: 16rpx;
	padding: 32rpx 24rpx;
}
.change-top{
	font-family: PingFangSC, PingFang SC;
	font-weight: 500;
	font-size: 32rpx;
	color: #2A3A5A;
	line-height: 32rpx;
	text-align: left;
	font-style: normal;
}
.change-top > img{
	width: 40rpx;
	height: 40rpx;
	margin-right: 16rpx;
}
.change-num{
	font-family: DIN;
	font-weight: 500;
	font-size: 36rpx;
	color: #828DA2;
	line-height: 32rpx;
	text-align: right;
	font-style: normal;
}
	
.change-bottom{
	font-family: PingFangSC, PingFang SC;
	font-weight: 500;
	font-size: 32rpx;
	color: #0074FF;
	line-height: 32rpx;
	text-align: left;
	font-style: normal;
}
.change-bottom > text{
	font-family: DIN;
	font-weight: 500;
	font-size: 36rpx;
	color: #0074FF;
	line-height: 32rpx;
	text-align: right;
	font-style: normal;
	margin: 0 4rpx;
}

.change-dec{
	font-family: PingFangSC, PingFang SC;
	font-weight: 400;
	font-size: 24rpx;
	color: #828DA2;
	line-height: 36rpx;
	text-align: justify;
	font-style: normal;
}
.total-time{
	font-size: 32rpx;
	color: #2A3A5A;
	font-weight: 500;
	margin-right: 24rpx;
}