/* 导航栏 */
			#navbox {
				width: 100%;
				height: 90px;
				position: absolute;
				z-index: 1;
			}

			/* 导航背景 */
			#nav_bg {
				width: 100%;
				height: 90px;
				background: #93a7bd;
				opacity: 0.8;
				position: absolute;
				z-index: 1;
			}

			#nav {
				position: relative;
				z-index: 2;
				width: 1200px;
				height: 90px;
				margin: 0 auto;
				/* logo */
				background: url(../images/logo.png) no-repeat 17px 0px;
			}

			#nav ul {
				margin-left: 107px;
			}

			#nav li {
				font-family: 微软雅黑;
				font-size: 29px;
				margin-top: 25px;
				margin-left: 87px;
				float: left;
			}

			.lineOfResponse {
				border-color: #fff;
				margin-top: -1px;
				display: none;
				animation: response 1s;
			}

			#nav1 li:hover .lineOfResponse {
				display: block;
			}

			@keyframes response {
				0% {
					width: 0px;
				}

				100% {
					width: 116px;
				}
			}

			/* 二级导航 */
			#nav1 ul li {
				width: 116px;
				height: 40px;
				background: #4CC3FF;
				border-radius: 10px;
				line-height: 40px;
				font-family: 微软雅黑;
				font-size: 24px;
				margin-top: 3px;
				margin-left: 0;
			}

			#nav1 a {
				color: #000;
			}

			#nav1 a:hover {
				color: #fff;
			}

			/* #nav1 ul li:hover{
	background-color: #4CC3FF;
	opacity: 0.3;
}

#nav1 ul a:hover{
	color: #000;
} */

			#nav1 a {
				width: 120px;
				height: 40px;
				text-align: center;
			}

			/* 在哪个分页就把哪个分页的用thisPage的id  并且把这个的hr改为class="lineOfResponse" 并且a的id删掉*/
			#thisPage {
				color: #fff;
			}

			#thisPage .lineOfResponse {
				margin-top: -1px;
			}

			#nav1 ul {
				width: 120px;
				height: 250px;
				margin-left: 0;
				display: none;
			}

			#nav1 li:hover ul {
				display: block;
			}

			#bannerbox {
				width: 100%;
				height: 781px;
				position: relative;
			}

			#bgbanner {
				position: absolute;
				width: 100%;
				height: 600px;
				left: 0;
				top: 0;
				z-index: -1;
			}

			#textbox {
				position: absolute;
				margin-top: 100px;
				margin-left: 80px;
			}

			#photobox {
				position: absolute;
				margin-top: 250px;
				margin-left: 800px;
			}

			#zhuangshi1 {
				width: 357px;
				height: 73px;
				
				position: absolute;
				margin-left: 640px;
				margin-top: 20px;
			}

			.clear {
				clear: both;
			}

			#TeamDesign1 {
				width: 100%;
				height: 50px;
			}
			
			#TeamDesign1 h2 {
				width: 120px;
				height: 50px;
				background: #ccc;
				color: #fff;
				line-height: 50px;
				text-align: center;
				margin: 0% auto;
				margin-top: 25px;
				margin-bottom: 25px;
				border-radius: 20px;
			}
			
			#art {
				width: 100%;
				height: 275px;
				margin-top: 30px;
				margin-bottom: 30px;
			}
			
			.container {
				width: 1300px;
				height: 275px;
				margin: 0 auto;
			}
			
			.container .box {
				position: relative;
				width: 275px;
				height: 275px;
				margin-right: 50px;
				float: left;
				/* 溢出隐藏 */
				overflow: hidden;
				/* 动画过渡 */
				transition: 0.5s;
			}
			
			/* 鼠标移入，盒子变大 */
			.container .box:hover {
				transform: scale(1.15);
				box-shadow: 0 25px 40px rgba(0, 0, 0, 0.5);/* 下拉阴影框 *//* 盒子阴影box-shadow */
				z-index: 1;
			}
			
			.container .box .img-box {
				/* 绝对定位 */
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
			
			}
			
			/* 渐变遮罩（黑色——透明） 默认隐藏 */
			.container .box .img-box::before {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				/* transparent属性通常用于设置元素的透明度或透明状态。 */
				background: linear-gradient(to top, #222, transparent);/* 创建线性渐变效果。 */
				z-index: 1;
				opacity: 0;
				transition: 0.5s;
			}
			
			/* 鼠标移入，渐变遮罩显示 */
			.container .box:hover .img-box:before {
				opacity: 1;
			}
			
			.container .box .img-box img {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				/* 保持原有尺寸比例，裁切长边 */
				object-fit: cover; /* cover值强制图像完全覆盖容器区域 */
			}
			
			.container .box .text-box {
				position: absolute;
				left: 0;
				bottom: 50px;
				width: 100%;
				height: 100%;
				padding: 5px;
				/* 弹性布局 元素位于容器的结尾 */
				display: flex;
				align-items: flex-end;/* 用于设置轴侧上的子元素排列方式单行 */
				color: #fff;
				z-index: 2;
			}
			
			.container .box .text-box h2 {
				font-size: 12px;
				color: #000;
				background:rgba(51,51,51,0.5);
				width: 275px;
				height: 20px;
				margin-bottom: 5px;
				/* 默认移出可视范围 */
				transform: translateY(200px);
				transition: 0.5s;
			}
			
			.container .box:hover .text-box h2 {
				/* 鼠标移入，移入可视范围 */
				transform: translateY(0);
				/* 设置动画延迟时间 */
				transition-delay: 0.5s;
			}
			
			.container .box .text-box p {
				font-size: 12px;
				line-height: 15px;
				color: #000;
				background:rgba(204,204,204,0.5);
				width: 275px;
				height: 60px;
				/* 默认移出可视范围 */
				transform: translateY(200px);
				transition: 0.5s;
			}
			
			.container .box:hover .text-box p {
				/* 鼠标移入，移入可视范围 */
				transform: translateY(0);
				/* 设置动画延迟时间 */
				transition-delay: 0.5s;
			}
			.clear {
				clear: both;
			}

			#zhuangshi2 {
				width: 357px;
				height: 73px;
				margin-left: 640px;
				margin-top: 20px;
				position: absolute;

			}

			#TeamDesign2 {
				width: 100%;
				height: 50px;
			}

			#TeamDesign2 div {
				width: 120px;
				height: 50px;
				color: #fff;
				line-height: 50px;
				text-align: center;
				margin: 0 auto;
				margin-top: 25px;
				margin-bottom: 25px;
				font-size: 16px;
			}

			#TeamDesign2 h2 {
				margin: 0 auto;
				background: #ccc;
				border-radius: 20px;
				width: 120px;
				height: 50px;
			}

			.shell {
				width: 950px;
				height: 350px;
				display: flex;
				/*定义弹性布局的一种方式*/
				margin: 0% auto;
				margin-bottom: 30px;
				margin-top: 50px;
			}

			.box9 {
				flex: 1;
				overflow: hidden;
				transition: 0.5s;
				margin: 0 20px;

				box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.5);
				/*添加阴影*/
				border-radius: 20px;
				border: 10px solid #fff;
				background-color: #fff;
			}

			.box9>img {
				width: 200%;
				height: 100%;
				object-fit: cover;
				/*将图像缩放填满整个图像*/
				transition: 0.5s;
			}

			.box9>span {
				font: 400 30px '优设标题黑';
				text-align: center;
				height: 15%;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.box9:hover {
				flex-basis: 40%;
			}

			.box9:hover>img {
				width: 100%;
				height: 100%;
			}

			#copyright {
				width: 100%;
				background: #7891ad;

			}

			#copyright_banner {
				width: 200px;
				height: 20px;
				margin: 0 auto;
			}

			#copyright a {
				width: 200px;
				height: 20px;
				background: url(../images/jinghui.png) no-repeat;
				padding-left: 20px;
				color: #ababab;
				font-size: 13px;
			}

			#copyright a:hover {
				color: #fff;
			}

			#copyright p {
				height: 20px;
				color: #ababab;
				font-size: 13px;
				text-align: center;
			}