/*.banner-------------------------------------------------------------*/
html,
body,
.warp {
	min-height: 100%;
}

.banner {
	width: 100%;
	height: 175px;
	background: url("../img/tracking-banner-s.jpg") no-repeat center;
	padding: 100px 47px 0px;
	position: fixed;
	z-index: -1;
	top: 0;
}

	.banner .b-title {
		font-size: 2.4rem;
	}

	.banner .b-txt {
		font-size: 0.9rem;
	}
/*search-content*/
.search-content {
	width: 100%;
	margin-top: 175px;
	background: #fff;
	/*number-content*/
}

	.search-content .sc-title {
		font-size: 2.4rem;
		padding: 40px 0 30px;
		text-align: center;
	}

	.search-content .inp-outer {
		position: relative;
		padding: 0 20px;
	}

		.search-content .inp-outer .io-inp {
			width: 100%;
			height: 30px;
			border: 1px solid #666;
			padding: 0 10px;
			line-height: 30px;
			color: #333;
			font-size: 0.9rem;
		}

		.search-content .inp-outer .search-btn {
			display: block;
			width: 10px;
			height: 11px;
			background: url("../img/tracking-icon-search.png") no-repeat;
			background-size: 100%;
			position: absolute;
			right: 30px;
			top: 10px;
		}

	.search-content .number-content {
		padding: 20px 12.5px;
		overflow: hidden;
	}

		.search-content .number-content .nc-item {
			width: 33.333%;
			padding: 7.5px;
			float: left;
		}

			.search-content .number-content .nc-item .nci-number {
				width: 100%;
				height: 25px;
				text-align: center;
				line-height: 25px;
				border: 1px solid #259df6;
				font-size: 1rem;
				border-radius: 3px;
				cursor: position;
			}

				.search-content .number-content .nc-item .nci-number:hover {
					background: #259df6;
					color: #fff;
				}

			.search-content .number-content .nc-item .nci-number-error {
				border: 1px solid #f84848;
				color: #f84848;
			}

				.search-content .number-content .nc-item .nci-number-error:hover {
					border: none;
					background: #f84848;
				}
/*data-container*/
.data-container {
	padding: 10px 0;
	background: #ecf2f5;
	/*state-content*/
	/*show-more*/
	/*error-txt*/
}

	.data-container .dcc-item {
		padding: 20px;
		background: #fff;
		margin-bottom: 10px;
		/*tracking-content*/
	}

		.data-container .dcc-item .dcci-number {
			height: 16px;
			line-height: 16px;
			padding-left: 36px;
			background: url("../img/tracking-icon-number.png") no-repeat left center;
			background-size: 16px 16px;
		}

		.data-container .dcc-item .tracking-content {
			overflow: hidden;
			width: 100%;
			padding: 20px 30px 0 0;
			position: relative;
		}

			.data-container .dcc-item .tracking-content .tc-item {
				width: 33.333%;
				text-align: left;
				color: #b5b5b5;
				font-size: 1rem;
				float: left;
				position: relative;
			}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon {
					width: 30px;
					height: 30px;
					display: block;
					border: 1px solid #b5b5b5;
					border-radius: 50%;
					margin-bottom: 10px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon-show {
					border: none;
					background: #259df6;
				}

				.data-container .dcc-item .tracking-content .tc-item::before {
					content: "";
					display: block;
					width: 20.5px;
					height: 6px;
					position: absolute;
					background: url("../img/tracking-icon5.png") no-repeat;
					background-size: 20.5px 6px;
					top: 10px;
					right: 50%;
					margin-right: -21px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon1 {
					background: url('../img/tracking-icon1.png') no-repeat center;
					background-size: 13px 9px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon1-show {
					background: url('../img/tracking-icon12.png') no-repeat center;
					background-size: 13px 9px;
					border: none;
					background-color: #259df6;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon2 {
					background: url('../img/tracking-icon2.png') no-repeat center;
					background-size: 12.5px 12.5px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon2-show {
					background: url('../img/tracking-icon22.png') no-repeat center;
					background-size: 13px 9px;
					border: none;
					background-color: #259df6;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon3 {
					background: url('../img/tracking-icon3.png') no-repeat center;
					background-size: 12.5px 12.5px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon3-show {
					background: url('../img/tracking-icon32.png') no-repeat center;
					background-size: 13px 9px;
					border: none;
					background-color: #259df6;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon4 {
					background: url('../img/tracking-icon4.png') no-repeat center;
					background-size: 12.5px 12.5px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon4-show {
					background: url('../img/tracking-icon42.png') no-repeat center;
					background-size: 13px 9px;
					border: none;
					background-color: #259df6;
				}

				.data-container .dcc-item .tracking-content .tc-item:last-child {
					width: 40px;
					position: absolute;
					right: 0;
				}

					.data-container .dcc-item .tracking-content .tc-item:last-child::before {
						display: none;
					}

			.data-container .dcc-item .tracking-content .tc-item-show1 {
				color: #259df6;
			}

			.data-container .dcc-item .tracking-content .tc-item-show2 {
				color: #259df6;
			}

				.data-container .dcc-item .tracking-content .tc-item-show2::before {
					content: "";
					display: block;
					width: 20.5px;
					height: 6px;
					position: absolute;
					background: url("../img/tracking-icon6.png") no-repeat;
					background-size: 20.5px 6px;
					top: 10px;
					right: 50%;
					margin-right: -21px;
				}

	.data-container .dcc-item-show {
		height: auto;
	}

	.data-container .dcc-item:last-child {
		margin-bottom: 0;
	}

	.data-container .state-content {
		padding: 30px 0 15px;
	}

		.data-container .state-content .sc-list {
			position: relative;
		}

			.data-container .state-content .sc-list .scl-line {
				width: 1px;
				height: calc(100% - 70px);
				position: absolute;
				top: 27px;
				left: 26.9%;
				background: #b5b5b5;
				z-index: 1;
			}

			.data-container .state-content .sc-list .scl-item {
				padding: 20px 0;
				overflow: hidden;
				color: #999999;
				position: relative;
				z-index: 2;
			}

				.data-container .state-content .sc-list .scl-item .create-time {
					width: 17%;
					text-align: right;
					font-size: 1rem;
				}

				.data-container .state-content .sc-list .scl-item .state-icon {
					width: 20%;
				}

					.data-container .state-content .sc-list .scl-item .state-icon::before {
						content: '';
						display: block;
						width: 6px;
						height: 6px;
						border: 1px solid #999999;
						border-radius: 50%;
						margin: 10px auto 0;
						background: #fff;
					}

				.data-container .state-content .sc-list .scl-item .state-txt {
					width: 63%;
					font-size: 1rem;
				}

				.data-container .state-content .sc-list .scl-item:first-child {
					color: #2596fd;
				}

					.data-container .state-content .sc-list .scl-item:first-child .state-icon::before {
						content: '';
						display: block;
						width: 11px;
						height: 11px;
						background: url("../img/tracking-icon-state.png") no-repeat;
						background-size: 100%;
						margin: 7px auto 0;
						border: none;
					}

	.data-container .show-more {
		padding-top: 20px;
	}

		.data-container .show-more .icon-more {
			display: block;
			width: 9px;
			height: 4.5px;
			background: url("../img/tracking-icon-more.png") no-repeat;
			background-size: 100%;
			margin: 0 auto;
			transition: all .7s ease;
		}

		.data-container .show-more .icon-more-rotate {
			transform: rotate(180deg);
			transform-origin: center;
			transition: all .7s ease;
		}

	.data-container .error-content {
		height: 14px;
		line-height: 14px;
		display: table;
		margin: 0 auto;
		overflow: hidden;
		display: none;
	}

		.data-container .error-content .error-icon {
			width: 14px;
			height: 14px;
			background: url("../img/tracking-icon-error.png") no-repeat;
			background-size: 100%;
			margin-right: 10px;
		}

		.data-container .error-content .error-txt {
			text-align: center;
			color: #f84848;
			font-size: 0.9rem;
		}
/*-----------------------------------------------------------------------------------------------*/
@media (min-width: 768px) {
	.banner {
		height: 480px;
		background: url("../img/tracking-banner-b.jpg") no-repeat;
		position: relative;
	}

		.banner .b-content {
			width: 100%;
			padding: 200px 5% 0;
			margin: 0 auto;
		}

			.banner .b-content .b-title {
				font-size: 4.8rem;
			}

	.search-content {
		margin-top: 0;
	}

		.search-content .sc-title {
			padding: 80px 0 40px;
			font-size: 4rem;
		}

		.search-content .inp-outer {
			width: 100%;
			padding: 0 10%;
		}

			.search-content .inp-outer .io-inp {
				width: 100%;
				height: 60px;
				line-height: 60px;
				padding: 0 20px;
				font-size: 1.6rem;
			}

			.search-content .inp-outer .search-btn {
				width: 20px;
				height: 21px;
				background-size: 20px 21px;
				right: calc(10% + 20px);
				top: 20px;
			}

		.search-content .number-content {
			width: 100%;
			margin: 0 auto;
			padding: 40px 5%;
		}

			.search-content .number-content .nc-item {
				width: 25%;
				padding: 10px 15px;
			}

				.search-content .number-content .nc-item .nci-number {
					height: 40px;
					line-height: 40px;
					cursor: pointer;
					font-size: 1.2rem;
				}

	.data-container {
		width: 100%;
		padding: 60px 70px 40px;
		/*dcc-item*/
	}

		.data-container .dcc-item {
			padding: 40px 60px;
			box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
			overflow: hidden;
			margin-bottom: 20px !important;
			/*tracking-content*/
			/*state-content*/
			/*show-more*/
			/*error-content*/
		}

			.data-container .dcc-item .dcci-number {
				height: 22px;
				line-height: 22px;
				font-size: 1.8rem;
				background-size: 22px 22px;
			}

			.data-container .dcc-item .dcci-number-error {
				float: left;
			}

			.data-container .dcc-item .tracking-content {
				padding: 50px 60px 0 0;
			}

				.data-container .dcc-item .tracking-content .tc-item:last-child {
					width: 60px;
				}

				.data-container .dcc-item .tracking-content .tc-item::before {
					width: 42px;
					height: 12px;
					background-size: 100%;
					margin-right: -42px;
					top: 20px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon {
					width: 60px !important;
					height: 60px !important;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-name {
					padding-left: 10px;
					font-size: 1.4rem;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon1 {
					background-size: 24px 17px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon2 {
					background-size: 28px 28px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon3 {
					background-size: 24px 22px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon4 {
					background-size: 21px 23px;
				}

				.data-container .dcc-item .tracking-content .tc-item-show2::before {
					width: 42px;
					height: 12px;
					background: url("../img/tracking-icon6.png") no-repeat;
					background-size: 100%;
					top: 20px;
					margin-right: -42px;
				}

			.data-container .dcc-item .state-content {
				padding-top: 65px;
				font-size: 1.4rem;
			}

				.data-container .dcc-item .state-content .sc-list {
					padding-top: 10px;
				}

					.data-container .dcc-item .state-content .sc-list .scl-item {
						padding: 10px 0;
					}

						.data-container .dcc-item .state-content .sc-list .scl-item .create-time {
							width: 20%;
							text-align: left;
							font-size: 1.4rem;
						}

						.data-container .dcc-item .state-content .sc-list .scl-item .state-icon {
							width: 10%;
						}

							.data-container .dcc-item .state-content .sc-list .scl-item .state-icon::before {
								margin-top: 0;
								width: 14px;
								height: 14px;
							}

						.data-container .dcc-item .state-content .sc-list .scl-item .state-txt {
							width: 70%;
							font-size: 1.4rem;
						}

						.data-container .dcc-item .state-content .sc-list .scl-item:first-child .state-icon::before {
							width: 16px;
							height: 16px;
							background-size: 100%;
						}

					.data-container .dcc-item .state-content .sc-list .scl-line {
						top: 34px;
						left: 25%;
						height: calc(100% - 70px);
					}

			.data-container .dcc-item .show-more .icon-more {
				width: 18px;
				height: 9px;
				background-size: 100%;
			}

			.data-container .dcc-item .error-content {
				height: 22px;
				line-height: 22px;
				float: left;
				padding-left: 100px;
			}

				.data-container .dcc-item .error-content .error-icon {
					width: 22px;
					height: 22px;
					background-size: 100%;
				}
}
/*-----------------------------------------------------------------------------------------------*/
@media (min-width: 1200px) {
	.banner {
		height: 480px;
		background: url("../img/tracking-banner-b.jpg") no-repeat;
		position: relative;
	}

		.banner .b-content {
			width: 1170px;
			padding-top: 200px;
			margin: 0 auto;
		}

			.banner .b-content .b-title {
				font-size: 4.8rem;
			}

	.search-content {
		margin-top: 0;
	}

		.search-content .sc-title {
			padding: 30px 30px;
			font-size: 4rem;
		}

		.search-content .inp-outer {
			width: 650px;
			height:220px;
			margin: 0 auto;
			padding: 0;
		}

			.search-content .inp-outer .left {
				width: 310px;
				margin: 0 auto;
				padding: 0;
				float: left;
			}

			.search-content .inp-outer .right {
				width: 310px;
				margin: 0 auto;
				padding: 0;
				float: right;
			}

			.search-content .inp-outer .io-inp {
				width: 800px;
				height: 60px;
				line-height: 60px;
				padding: 0 20px;
				font-size: 1.6rem;
			}

			.search-content .inp-outer .io-inp-textarea {
				width: 265px;
				height: 200px;
				line-height: 20px;
				padding: 5px 20px;
				font-size: 2rem;
				margin: 0px auto;
				position: relative;
			}

			.search-content .inp-outer .search-btn {
				width: 20px;
				height: 21px;
				background-size: 20px 21px;
				right: 20px;
				top: 20px;
			}

		.search-content .searchLoading {
			width: 650px;
			margin: 0 auto;
			text-align: center;
			display: none;
			color: #259df6;
			padding-top: 2px
		}
		.search-content .number-content {
			width: 1170px;
			margin: 0 auto;
			padding: 40px 55px;
		}

			.search-content .number-content .nc-item {
				width: 25%;
				padding: 10px 15px;
			}

				.search-content .number-content .nc-item .nci-number {
					height: 40px;
					line-height: 40px;
					cursor: pointer;
				}

	.data-container {
		width: 1170px;
		margin: 0 auto;
		padding: 60px 70px 40px;
		/*dcc-item*/
	}

		.data-container .dcc-item {
			padding: 40px 60px;
			box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
			overflow: hidden;
			margin-bottom: 20px !important;
			/*tracking-content*/
			/*state-content*/
			/*show-more*/
			/*error-content*/
		}

			.data-container .dcc-item .dcci-number {
				height: 22px;
				line-height: 22px;
				font-size: 1.8rem;
				background-size: 22px 22px;
			}

			.data-container .dcc-item .dcci-number-error {
				float: left;
			}

			.data-container .dcc-item .tracking-content {
				padding: 50px 60px 0 0;
			}

				.data-container .dcc-item .tracking-content .tc-item:last-child {
					width: 60px;
				}

				.data-container .dcc-item .tracking-content .tc-item::before {
					width: 42px;
					height: 12px;
					background-size: 100%;
					margin-right: -42px;
					top: 20px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon {
					width: 60px !important;
					height: 60px !important;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-name {
					padding-left: 10px;
					font-size: 1.4rem;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon1 {
					background-size: 24px 17px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon2 {
					background-size: 28px 28px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon3 {
					background-size: 24px 22px;
				}

				.data-container .dcc-item .tracking-content .tc-item .tci-icon4 {
					background-size: 21px 23px;
				}

				.data-container .dcc-item .tracking-content .tc-item-show2::before {
					width: 42px;
					height: 12px;
					background: url("../img/tracking-icon6.png") no-repeat;
					background-size: 100%;
					top: 20px;
					margin-right: -42px;
				}

			.data-container .dcc-item .state-content {
				padding-top: 65px;
				font-size: 1.4rem;
			}

				.data-container .dcc-item .state-content .sc-list {
					padding-top: 10px;
				}

					.data-container .dcc-item .state-content .sc-list .scl-item {
						padding: 10px 0;
					}

						.data-container .dcc-item .state-content .sc-list .scl-item .create-time {
							width: 20%;
							text-align: left;
							font-size: 1.4rem;
						}

						.data-container .dcc-item .state-content .sc-list .scl-item .state-icon {
							width: 10%;
						}

							.data-container .dcc-item .state-content .sc-list .scl-item .state-icon::before {
								margin-top: 0;
								width: 14px;
								height: 14px;
							}

						.data-container .dcc-item .state-content .sc-list .scl-item .state-txt {
							width: 70%;
							font-size: 1.4rem;
						}

						.data-container .dcc-item .state-content .sc-list .scl-item:first-child .state-icon::before {
							width: 16px;
							height: 16px;
							background-size: 100%;
						}

					.data-container .dcc-item .state-content .sc-list .scl-line {
						top: 34px;
						left: 25%;
						height: calc(100% - 50px);
					}

			.data-container .dcc-item .show-more .icon-more {
				width: 18px;
				height: 9px;
				background-size: 100%;
			}

			.data-container .dcc-item .error-content {
				height: 22px;
				line-height: 22px;
				float: left;
				padding-left: 100px;
			}

				.data-container .dcc-item .error-content .error-icon {
					width: 22px;
					height: 22px;
					background-size: 100%;
				}
}