.page_ctrl {
	text-align: center;
	margin: 10px auto;
	box-sizing: border-box
}

.page_ctrl * {
	line-height: 26px
}
.page_dot{
	padding:0px 5px;
	color: #4c67a7;
}
.page_total{
	margin-left:5px;
}
.page_ctrl button {
	margin: 0 5px;
	min-width: 30px;
	background: #fff;
	border: 1px solid #4c67a7;
	color: #4c67a7;
	cursor: pointer;
	outline: none;
	text-align: center;
	padding:5px 15px;
}

.page_ctrl button:hover {
	background: #4c67a7;
	color: #fff
}

.page_ctrl .btn_dis {
	cursor: default;
	opacity: .7;
	background: #eee;
	color: #5e5e5e;
	border:none;
}

.page_ctrl .btn_dis:hover {
	background: #eee;
	color: #5e5e5e
}

.page_ctrl .current_page {
	background: #4c67a7;
	color: #fff
}

.page_ctrl .input_page_num {
	width: 30px;
	height: 26px;
	margin: 0 3px;
	padding: 0;
	text-align: center;
	background: #fff;
	border: 1px solid #e5e5e5;
	color: #5e5e5e;
	outline: none
}

.page_ctrl .page_total,
.page_ctrl .page_text {
	color: #4c67a7;
	font-size: 16px
}
@media all and (min-width: 480px) and (max-width: 767px){
    .page_ctrl button,.page_ctrl span{
		padding:0px 5px;
		margin: 0 3px 10px;
	}
}
@media all and (max-width: 479px) {
    .page_ctrl button,.page_ctrl span{
		padding:0px 5px;
		margin: 0 3px 10px;
	} 
}
@media all and (max-width: 375px) {
	.page_ctrl button,.page_ctrl span{
		padding:0px 5px;
		margin: 0 3px 10px;
	}
}