﻿body {
	background-color: #d9ebf1;
}

.news {
	width: 100%;
	max-width: 1920px;
	min-width: 1300px;
	min-height: 400px;
	margin:0 auto;
	position: relative;
}

	.news .news-box {
		display: table;
		width: 1300px;
		height: auto;
		margin: 0 auto;
		position: relative;
	}

		.news .news-box .news-box-box {
			float: left;
			display: inline-block;
			width: 310px;
			height: auto;
			margin: 0 10px 20px;
			overflow: hidden;
			position: relative;
		}

			.news .news-box .news-box-box:nth-of-type(4n+1) {
				margin-left: 0;
			}

			.news .news-box .news-box-box:nth-of-type(4n+4) {
				margin-right: 0;
			}

			.news .news-box .news-box-box .news-box-r {
				position: absolute;
				bottom: 0;
				left: 0;
				content: '';
				z-index: 1;
				width: 0;
				height: 2px;
				background-color: #3971f6;
			}

			.news .news-box .news-box-box .news-box-r1 {
				display: flex;
				justify-content: center;
				align-items: center;
				position: relative;
				width: 310px;
				height: 233px;
				overflow: hidden;
				background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
			}

				.news .news-box .news-box-box .news-box-r1::after {
					position: absolute;
					top: 5px;
					left: -260px;
					z-index: 1;
					width: 400px;
					height: 320px;
					content: '';
					transform: rotate(-20deg);
					background-color: #3971f6;
				}

				.news .news-box .news-box-box .news-box-r1::before {
					position: absolute;
					top: 0;
					right: -0;
					z-index: 1;
					width: 50px;
					height: 233px;
					content: '';
					border-top: 3px solid #3971f6;
					border-right: 3px solid #3971f6;
					border-bottom: 3px solid #3971f6;
				}

				.news .news-box .news-box-box .news-box-r1 .news-img-box {
					position: relative;
					z-index: 2;
					width: 280px;
					height: 210px;
					overflow: hidden;
					background-color: #fff;
				}

					.news .news-box .news-box-box .news-box-r1 .news-img-box .news-img-img {
						position: relative;
						z-index: 3;
						width: 280px;
						height: 210px;
						transition: all 1s ease 0s;
					}

			.news .news-box .news-box-box:hover .news-box-r1 .news-img-box .news-img-img {
				position: relative;
				overflow: hidden;
				transform: scale(1.2);
				-webkit-transform: scale(1.2);
				-moz-transform: scale(1.2);
				-o-transform: scale(1.2);
				-ms-transform: scale(1.2);
			}

			.news .news-box .news-box-box .news-box-r2 {
				width: 100%;
				height: auto;
				padding: 30px 10px 0;
				overflow: hidden;
				background: rgba(255, 255, 255, .8);
			}

				.news .news-box .news-box-box .news-box-r2 .r2-box-box {
					display: block;
					width: 100%;
					height: 100%;
				}

					.news .news-box .news-box-box .news-box-r2 .r2-box-box .r2-box-h2 {
						height: 40px;
						font-size: 14px;
						color: #303030;
						margin-bottom: 20px;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}

					.news .news-box .news-box-box .news-box-r2 .r2-box-box .r2-box-p {
						height: 50px;
						font-size: 12px;
						color: #646566;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 3;
					}

			.news .news-box .news-box-box .news-box-r3 {
				width: 100%;
				height: auto;
				padding: 20px 10px 30px;
				overflow: hidden;
				font-size: 12px;
				color: #FF5500;
				text-align: right;
				background: rgba(255, 255, 255, .8);
			}

	.news .news-dox {
		display: table;
		width: 1300px;
		height: auto;
		margin: 0 auto;
		position: relative;
	}

.page_ctrl {
	text-align: center;
	margin: 10px auto;
	box-sizing: border-box
}

	.page_ctrl * {
		line-height: 26px
	}

	.page_ctrl button {
		margin: 0 3px;
		min-width: 30px;
		background: #fff;
		border: 1px solid #e5e5e5;
		color: #5e5e5e;
		cursor: pointer;
		outline: 0;
		text-align: center
	}

		.page_ctrl button:hover {
			background: #0eb0d2;
			color: #fff
		}

	.page_ctrl .btn_dis {
		cursor: default;
		opacity: .7;
		background: #eee;
		color: #5e5e5e
	}

		.page_ctrl .btn_dis:hover {
			background: #eee;
			color: #5e5e5e
		}

	.page_ctrl .current_page {
		background: #0eb0d2;
		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: 0
	}

	.page_ctrl .page_total,
	.page_ctrl .page_text {
		color: #2b2b2b;
		font-size: 13px
	}
