.box {
	background-color: #F9F9F9;
	min-height: 100vh;
}

.nav-box {
	box-sizing: border-box;
	width: 100%;
	z-index: 2;
	background: #F9F9F9;
	padding-bottom: 25rpx;
}

.nav-box .nav-bar {
	display: flex;
	align-items: center;
}

.nav-box .nav-bar .nav-bar-left,
.nav-box .nav-bar .nav-bar-right {
	padding: 0 20rpx;
	min-width: 36rpx;
}

.nav-box .nav-bar .nav-bar-left van-icon {
	vertical-align: sub;
	color: #333333;
}

.nav-box .nav-bar .nav-bar-title {
	flex: 1;
	text-align: center;
	font-weight: 400;
	font-size: 36rpx;
	color: #000000;
}


.tabItem {
	font-weight: 400;
	font-size: 28rpx;
	color: #555555;
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.active {
	position: relative;
	font-weight: bold;
	font-size: 32rpx;
	color: #222222;
}

.active::after {
	content: '';
	width: 130rpx;
	height: 10rpx;
	background: #FF512A;
	border-radius: 0rpx 0rpx 0rpx 0rpx;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -8rpx;
}

.active::before {
	content: '';
	width: 120rpx;
	height: 4rpx;
	background: #FF5D73;
	border-radius: 0rpx 0rpx 0rpx 0rpx;
	filter: blur(12rpx);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -18rpx;
}


.InfoMsg {
	background-color: #fff;
	margin-bottom: 20rpx;
}

.InfoMsg {
	padding-left: 20rpx;
	padding-right: 20rpx;
	padding-top: 30rpx;
	padding-bottom: 4rpx;
}

.InfoMsg_tit {
	font-weight: bold;
	font-size: 32rpx;
	color: #222222;
	margin-bottom: 40rpx;
}

.InfoMsg_info {
	display: flex;
	align-items: center;
	font-weight: 400;
	font-size: 26rpx;
	color: #999999;
	margin-bottom: 30rpx;
}

.InfoMsg_info text {
	color: #222222;
	margin-left: 30rpx;
}

.InfoItem {
	background-color: #fff;
	padding-top: 30rpx;
	padding-left: 20rpx;
	padding-right: 20rpx;
	padding-bottom: 30rpx;
}

.InfoItem_tit {
	font-weight: bold;
	font-size: 32rpx;
	color: #222222;
	margin-bottom: 40rpx;
}

.InfoItem_msg {
	display: flex;
	font-weight: 400;
	font-size: 26rpx;
	white-space: nowrap;
	margin-bottom: 30rpx;
	color: #222222;
}

.InfoItem_msg:last-child {
	margin-bottom: 0;
}

.InfoItem_msg text {
	color: #999999;
	width: 140rpx;
}

.maintenance_progress {
	background-color: #fff;
	padding: 60rpx 20rpx;
	box-sizing: border-box;
	box-sizing: border-box;
}

.progress {
	width: 100%;
	height: 100%;
	background: rgba(249, 249, 249, 0.6);
	border-radius: 30rpx 30rpx 30rpx 30rpx;
	margin: 0 auto;
	padding-left: 80rpx;
	padding-top: 60rpx;
	padding-bottom: 66rpx;
}


.progress_step_cir {
	width: 28rpx;
	height: 28rpx;
	background: rgba(255, 81, 42, 0.2);
	border-radius: 0rpx 0rpx 0rpx 0rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	margin-right: 30rpx;
}

.progress_step_cir2 {
	width: 18rpx;
	height: 18rpx;
	background: #FF512A;
	border-radius: 50%;
	box-sizing: border-box;
}

.progress_step_time {
	font-weight: 400;
	font-size: 28rpx;
	color: #222222;
	position: relative;
	display: flex;
	align-items: center;
}


.progress_step_msg {
	font-weight: 400;
	font-size: 24rpx;
	color: #FF512A;
	border-left: 2rpx dashed #C4C4C4;
	padding-left: 44rpx;
	box-sizing: border-box;
	margin-left: 14rpx;
	margin-top: 6rpx;
	margin-bottom: 12rpx;
	padding-top: 16rpx;
	padding-bottom: 45rpx;
}

.progress_step_msg2 {
	font-weight: 400;
	font-size: 24rpx;
	color: #555555;
	border-left: 2rpx dashed #C4C4C4;
	padding-left: 44rpx;
	box-sizing: border-box;
	margin-left: 14rpx;
	margin-top: 6rpx;
	margin-bottom: 12rpx;
	padding-top: 16rpx;
	padding-bottom: 45rpx;
}

.progress_step_person {
	width: 498rpx;
	height: 143rpx;
	background: #FFECE7;
	border-radius: 20rpx 20rpx 20rpx 20rpx;
	margin-top: 20rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: 30rpx;
	padding-left: 40rpx;
}


.personAva {
	width: 76rpx;
	height: 76rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	margin-right: 20rpx;
}

.personAva image {
	width: 59rpx;
	height: 59rpx;
}

.personCall {
	width: 36rpx;
	height: 36rpx;
}

.personCall image {
	width: 100%;
	height: 100%;
}

.personInfo_name {
	font-weight: 400;
	font-size: 28rpx;
	color: #222222;
	display: flex;
	align-items: center;
}

.personInfo_name text {
	margin-right: 10rpx;
}

.personInfo_name image {
	width: 20rpx;
	height: 20rpx;
	margin-right: 3rpx;
}

.personInfo_phone {
	font-weight: 400;
	font-size: 22rpx;
	color: #999999;
}

.progress_step_person_left {
	display: flex;
	align-items: center;
}

.imgList {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.imgList image {
	width: 120rpx !important;
	height: 120rpx !important;
	margin-right: 20rpx;
	margin-bottom: 20rpx;
}