$M1: #36434d;
$M2: #66757f;
$M5: #f5f8fa;
$font-family-H: 'Helvetica Neue', Tahoma, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', STHeitiSC, sans-serif;
$font-family-A: "Helvetica Neue", Tahoma, "PingFang SC", "Hiragino Sans GB", SimSun, STHeitiSC, sans-serif;
$Spring: cubic-bezier(.66, 1.65, .23, .87);
$Fs-1: 12px;
$S1: rgb(0, 79, 158);
$S2: rgb(16, 110, 204);
$S3: rgb(29, 134, 240);
$S4: rgb(92, 173, 255);
$S5: rgb(133, 194, 255);
$S6: rgb(194, 224, 255);
$M1: rgb(14, 17, 20);
$M2: rgb(51, 56, 61);
$M3: rgb(86, 94, 102);
$M4: rgb(131, 137, 143);
$M5: rgb(191, 195, 199);
$M6: rgb(230, 232, 235);
$M7: rgb(240, 242, 245);
$M8: rgb(250, 251, 252);
$M9: rgb(255, 255, 255);
$M10: rgb(0, 0, 0);
$Ra-1: 1px;
$Ra-2: 3px;
$Ra-3: 6px;
$Ra-4: 10px;
$Ra-5: 100px;
$Sp-1: 2px;
$Sp-2: 4px;
$Sp-3: 8px;
$Sp-4: 10px;
$Sp-5: 12px;
$Sp-6: 16px;
$Sp-7: 20px;
$Sp-8: 24px;
$Sp-9: 30px;
$Sp-10: 32px;
$Sp-11: 40px;
.paging {
	display: inline-block;
	width: 100%;
	direction: rtl;
	box-sizing: border-box;
	padding-right: 12px;
	margin: 10px 0;
	height: 26px;
	.sumcount{
		display: inline-block;
		font-size: 12px;
		color: #83898F;
		height: 33px;
		font-family: $font-family-H;
		position: relative;
		top:-10px;
	}
	.page-total-count{
		display: inline-block;
		color: #667580;
		font-size: 12px;
	}
	.drop-down-button{
		display: inline-block;
    margin-right: 12px;
	}
	.feild {
		direction: ltr;
		margin-left: $Sp-6;
		&.drop-down-button {
      display: inline-block;
      &:hover{
        .drop-btns-bgc-small {
          border: 1px solid #85C2FF;
          color: #106ECC;
        }
      }
			.drop-btns-bgc-small {
        padding: 3px 10px;
        background: #FFFFFF;
        box-shadow: none;
        border: 1px solid #E6E8EB;
        border-radius: 3px;
        &.drop-down-button-active{
          border: 1px solid #85C2FF;
          color: #106ECC;
        }
			}
			.drop-down-btn-list {
				margin: 0 0;
			}
		}
	}
	&:after {
		content: '';
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;
		overflow: hidden;
	}
	a {
		text-decoration: none;
		display: inline-block;
		min-width: 26px;
		font-size: $Fs-1;
		line-height: 20px;
		padding: 3px 0;
		font-family: $font-family-H;
		background-color: $M9;
		color: $M2;
		border-radius: $Ra-2;
		border: solid 1px $M6;
		box-sizing: border-box;
		text-align: center;
		&:hover {
			color: $S2;
		}
	}
	.page-content {
		float: right;
		.page-tp {
			margin-right: 14px;
		}
		.page-ps {
			margin-right: 16px;
		}
		.page-ellipsis {
			float: right;
			line-height: 12px;
			border: none;
		}
		.notAllowed_prev {
			&:hover {
				cursor: not-allowed;
				transition: none;
			}
		}
		&.content-box {
			a:nth-child(2) {
				box-sizing: content-box;
			}
		}
		.pc-sys-backward-active-svg{
			height: 28px;
			width: 28px;
			background-position: 50% 50%;
			// background: rgba(133, 194, 255,0.15);
			&:hover{
				border:1px solid $S5;
			}
		
		}
		.pc-sys-Forward-active-svg{
			height: 28px;
			width: 28px;
			background-position: 50% 50%;
			// background: rgba(133, 194, 255,0.15);
			&:hover{
				border:1px solid $S5;
			}
		}


	}
	.page-container {
		float: right;
		// margin-left: 1px;
		ul {
			overflow: hidden;
			height: 28px;
		}
		li {
			float: left;
			// margin-bottom: 2px;
			list-style: none;
			&:first-child {
				border-left: solid 1px $M6;
				border-top-left-radius: $Ra-2;
				border-bottom-left-radius: $Ra-2;
			}
			&:last-child {
				margin-right: 0;
				border-top-right-radius: $Ra-2;
				border-bottom-right-radius: $Ra-2;
			}
			border-top: solid 1px $M6;
			border-right: solid 1px $M6;
			border-bottom: solid 1px $M6;
			a {
				border: none;
				margin-right: 0px;
				border-radius: none;
			}
			&.active {
				a {
          border-radius: 0;
					color: $S2;
					background-color: rgba($S5, 0.15);
				}
			}
		}
		&.remove_left_radius {
			li {
				&:first-child {
					border-radius: initial;
				}
			}
		}
		&.add_left_radius {
			li {
				&:first-child {
					border-left: none;
				}
				&:nth-child(2) {
					border-left: solid 1px #e6e8eb;
					border-radius: 3px 0px 0px 3px;
				}
			}
		}
	}
	.page-next {
		
		
		.pc-sys-backward-active-svg{
			height: 28px;
			width: 28px;
			background-position: 50% 50%;
			// background: rgba(133, 194, 255,0.15);
			&:hover{
				border:1px solid $S5;
			}
		
		}
		.pc-sys-Forward-active-svg{
			height: 28px;
			width: 28px;
			background-position: 50% 50%;
			// background: rgba(133, 194, 255,0.15);
			&:hover{
				border:1px solid $S5;
			}
		}


		float: right;
		.next_page {
			margin-left: 5px;
		}
		.goAnyWhere {
			float: right;
		}
		.page-ellipsis {
			float: left;
			line-height: 12px;
			border: none;
		}
		.notAllowed_next {
			&:hover {
				cursor: not-allowed;
				transition: none;
			}
		}
		.auto-form-input {
			float: right;
			width: 46px;
			height: 26px;
			position: relative;
			display: inline-block;
			margin: 0 5px 0 10px;
			&:after {
				display: block;
				position: absolute;
				content: "";
				left: 50%;
				top: 23px;
				width: 0;
				height: 2px;
				background-color: #1b85d6;
				transition: left cubic-bezier(0.25, 0.1, 0.25, 1) .15s, width cubic-bezier(0.25, 0.1, 0.25, 1) .15s;
			}
			input {
				direction: ltr;
				margin-top: 0;
				width: 100%;
				height: 24px;
				font-size: 12px;
				line-height: 24px;
				border: 0;
				outline: 0;
				border: 1px solid #e4ebf0;
				font-family: $font-family-H;
				text-align: center;
			}
			input::input-placeholder {
				color: #acb7bf;
				margin: 0 auto 5px;
				font-size: 12px;
				line-height: 1.7;
			}
			input::-webkit-input-placeholder {
				/* WebKit browsers */
				color: #acb7bf;
				margin: 0 auto 5px;
				font-size: 12px;
				line-height: 1.7;
			}
			input:-moz-placeholder {
				/* Mozilla Firefox 4 to 18 */
				color: #acb7bf;
				margin: 0 auto 5px;
				font-size: 12px;
				line-height: 1.7;
			}
			input::-moz-placeholder {
				/* Mozilla Firefox 19+ */
				color: #acb7bf;
				margin: 0 auto 5px;
				font-size: 12px;
				line-height: 1.7;
			}
			input:-ms-input-placeholder {
				/* Internet Explorer 10+ */
				color: #acb7bf;
				margin: 0 auto 5px;
				font-size: 12px;
				line-height: 1.7;
			}
		}
		.auto-form-input-active {
			&:after {
				width: 100%;
				left: 0;
				transition: left $Spring .35s, width $Spring .35s;
			}
		}
		.go {
			display: inline-block;
		}
	}
	.page_start,
	.page_end {
		&.active {
			color: $S2;
			background-color: rgba($S5, 0.15);
		}
	}
	.page_start {
		float: right;
		&.remove_right_border {
			border-right: none;
			box-sizing: content-box;
		}
		&.remove_right_radius {
			border-radius: 3px 0px 0px 3px;
		}
	}
	.page_end {
		float: left;
		margin-right: 4px;
	}
	.page-ellipsis {
		transition: all 0.28s cubic-bezier(0.25, 0.1, 0.25, 1), background-color 0.3s;
		cursor: default;
	}
	.pc-sys-backward-nomal-svg,
	.pc-sys-backward-active-svg,
	.pc-sys-Forward-active-svg,
	.pc-sys-Forward-nomal-svg,
	.pc-sys-backward-disabled-svg,
	.pc-sys-Forward-disabled-svg {
		height: 28px;
		width: 28px;
		background-position: 50% 50%;
		margin: 0 5px 0 5px;
	}

	.pc-sys-Forward-nomal-svg {
		margin-left: 5px;
	
	}

	.paging-icon {
		display: inline-block;
		padding: 3px $Sp-5;
		margin: 0px 4px;
		&.notAllowed_prev,
		&.notAllowed_next {
			color: #e4ebf0;
		}
		&.paging__btn__next {
			margin-left: 0px;
			margin-right: 0px;
			float: left;
		}
	}
}
/*wuzhe----去除选中状态的box-shadow*/
.paging .page-content .feild.drop-down-button .drop-down-list-active .drop-btns-weaken:hover {
	box-shadow: none;
}
/*wuzhe----去除选中状态的box-shadow*/
.paging a.page_large {
	padding: 3px;
	width: 34px;
}

.paging .pag-sum {
	font-family: PingFangSC-Regular;
	font-size: 12px;
	display: inline-block;
	color: #83898F;
	line-height: 20px;
	position: relative;
	top: -10px;
	right: -4px;
	direction: ltr;
  }
.paging .pag-mat{
	display: inline-block;
	height:3px;
}

/* 解决safari下分页器错位 */
_:lang(x)+_:-webkit-full-screen-document, .paging .pag-dropdown { vertical-align: top; }