/*==============================================================个性化首页布局==============================================================*/

/*【轮播图】*/
#topBanner { width:100%; min-width:1180px; position: relative; }
#topBanner .swiper-container { width:100%; height: 500px; }
#topBanner .swiper-container .swiper-wrapper .swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	color: #000000;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
}
#topBanner .swiper-container .swiper-wrapper .swiper-slide .swiper-slide-content {
	width: 550px;
	height: 180px;
	padding: 20px;
	position: absolute;
	left: 260px;
	top: 150px;
	color: rgb(255,255,255);
	/* mix-blend-mode: difference; */
}
#topBanner .swiper-container .swiper-wrapper .swiper-slide .swiper-slide-content h3 {
	font-size: 28px;
	color: rgb(255,255,255);
	margin-bottom: 10px;
}
#topBanner .swiper-container .swiper-wrapper .swiper-slide .swiper-slide-content p {
	font-size: 14px;
	color: rgb(255,255,255);
	line-height: 25px;
}
#topBanner .swiper-arrow-left {
	background: url(../img/arrows.png) no-repeat left top;
	position: absolute;
	left: 20px;
	top: 50%;
	margin-top: -15px;
	width: 17px;
	height: 30px;
	cursor: pointer;
	z-index: 99;
}
#topBanner .swiper-arrow-right {
	background: url(../img/arrows.png) no-repeat left bottom;
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -15px;
	width: 17px;
	height: 30px;
	cursor: pointer;
	z-index: 99;
}
#topBanner .swiper-pagination {
	position: absolute;
	left: 0;
	text-align: center;
	bottom:5px;
	width: 100%;
	z-index: 99;
}
#topBanner .swiper-pagination .swiper-pagination-switch {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 20px;
	background: #fff;
	margin: 0 3px;
	cursor: pointer;
}
#topBanner .swiper-pagination .swiper-active-switch {
	background: #cd0000;
}

/*【通知栏】*/
.HotBar { width:100%; padding:10px 0; background:#f5f5f5; margin-bottom: 30px; border-bottom: 1px solid #f1f1f1 }
.HotBar article { width:1180px; height:30px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }

.HotBar .PopBox { width:850px; display: flex; align-items: center; }
.HotBar .PopBox h3 { color:#004ea2; font-weight:bold; padding: 0 20px; margin: 0; }
.HotBar .PopBox #IntermittentRolling { flex: 1; padding: 0 10px; background: #ffffff; border-radius:30px; box-shadow: 0px 0px 1px 1px #f1f1f1 inset; }
.HotBar .PopBox #IntermittentRolling .swiper-container { width:100%; height:30px; line-height:30px; }
.HotBar .PopBox #IntermittentRolling .swiper-container .swiper-slide { width:100%; height:30px; line-height:30px; display: flex; }
.HotBar .PopBox #IntermittentRolling .swiper-container .swiper-slide a { font-size: 14px; color:#000000; flex: 1; overflow: hidden; }
.HotBar .PopBox #IntermittentRolling .swiper-container .swiper-slide span { font-size: 12px; padding-left: 20px; }

.HotBar .SearchBox { width:235px; height:30px;float:right;background: #fff; border-radius:30px; padding-left: 5px; position: relative; }
.HotBar .SearchBox input { width:200px; background:none; border: 0; color:#000; }
.HotBar .SearchBox input::-webkit-input-placeholder {color: #000;}
.HotBar .SearchBox i { height:30px; font-size:18px; line-height:30px; text-align:center; cursor:pointer; color:#000; position: absolute; right: 10px;}

/*【新闻中心、客户服务】*/
.F1 { width:100%; margin-bottom: 50px;}
.F1 article { width:1180px; margin: 0 auto; display: flex; }

.F1 article .news_area { width: 500px; flex: auto; margin-right: 20px; display: flex; }
.F1 article .news_area .news_left { width: 500px; margin-right: 20px; }
.F1 article .news_area .news_left #news_banner { position: relative; }
.F1 article .news_area .news_left #news_banner .swiper-container { width: 500px; height: 320px; }
.F1 article .news_area .news_left #news_banner .swiper-container .swiper-slide { display: flex; }
.F1 article .news_area .news_left #news_banner .swiper-container .swiper-slide a { display: flex; width: 100%; height: 100%; position: relative; }
.F1 article .news_area .news_left #news_banner .swiper-container .swiper-slide a img { width: 100%; height: 100%; }
.F1 article .news_area .news_left #news_banner .swiper-container .swiper-slide a p { padding: 0; margin: 0; width: 100%; height: 40px; line-height: 40px; color: #fff; font-size: 18px; background-color: rgba(0,0,0,0.6); padding: 0 10px; position: absolute; left: 0; bottom: 0; }
.F1 article .news_area .news_left #news_banner .swiper-arrow { background: url(../img/focus_btn.png) no-repeat; position: absolute; width: 40px; height: 74px; cursor: pointer; z-index: 99; display: none; }
.F1 article .news_area .news_left #news_banner:hover .swiper-arrow { display: block; }
.F1 article .news_area .news_left #news_banner .swiper-arrow-left { top: 50%; left: 0; margin-top: -37px; background-position: 0 -74px; }
.F1 article .news_area .news_left #news_banner .swiper-arrow-right { top: 50%; right: 0; margin-top: -37px; background-position: -40px -74px; }
.F1 article .news_area .news_left #news_banner .swiper-arrow-left:hover { background-position: 0 0; }
.F1 article .news_area .news_left #news_banner .swiper-arrow-right:hover { background-position: -40px 0; }

.F1 article .news_area .news_right { flex: auto; overflow-y: auto; }
.F1 article .news_area .news_right .news_tab { height: 30px; margin-bottom: 10px; border-bottom: 1px solid #f1f1f1; display: flex; }
.F1 article .news_area .news_right .news_tab-item { width: 100px; color: #797979; font-size: 16px; display: flex; justify-content: center; align-items: center; }
.F1 article .news_area .news_right .news_tab-item a { color: #666666; }
.F1 article .news_area .news_right .news_tab-item.active { color: #0665b6; font-weight: bold; border-bottom: 1px solid #0665b6; }
.F1 article .news_area .news_right .news_tab-item.active a { color: #0665b6; }

.F1 article .news_area .news_right .news_content { display: none; }
.F1 article .news_area .news_right .news_content.active { display: block; }
.F1 article .news_area .news_right .news_content ul { margin: 0; padding: 0; }
.F1 article .news_area .news_right .news_content ul li { height: 28px; line-height: 27px; border-bottom: 1px dashed #f1f1f1; display: flex; }
.F1 article .news_area .news_right .news_content ul li a { flex: 1; color: #666666; font-size: 12px; overflow: hidden; }
.F1 article .news_area .news_right .news_content ul li a:before { content: '\f105'; margin: 0 10px 0 0; color: #e8390e; }
.F1 article .news_area .news_right .news_content ul li span { padding: 0 10px; color: #666666; font-size: 12px; }

.F1 article .service_area { width: 230px; flex: none; }
.F1 article .service_area .service_title { height: 30px; line-height: 30px; border-bottom: 1px solid #f1f1f1; margin-bottom: 10px; display: flex; justify-content: space-between; }
.F1 article .service_area .service_title h3 { width: 100px; padding: 0; margin: 0; text-align: center; border-bottom: 1px solid #0665b6; color: #0665b6; font-size: 16px; }
.F1 article .service_area .service_title a { margin-right: 10px; color: #8e8e8e; font-size: 12px; }

.F1 article .service_area .service_content {  }
.F1 article .service_area .service_content ul { padding: 0; margin: 0; display: flex; flex-flow: row wrap; }
.F1 article .service_area .service_content ul li { width: 105px; height: 75px; margin: 0 5px 15px 5px; }
.F1 article .service_area .service_content ul li a { display: flex; width: 100%; height: 100%; position: relative; }
.F1 article .service_area .service_content ul li a img { width: 100%; height: 100%; }
.F1 article .service_area .service_content ul li a p { margin: 0; padding: 0; width: 100%; height: 20px; line-height: 20px; text-align: center; color: #fff; font-size: 12px; background-color: rgba(0,0,0,0.5); position: absolute; left: 0; bottom: 0; }


/* 【首页横幅】 */
#centerBanner { width:100%; margin-bottom: 20px;}
#centerBanner article { width:1180px; margin: 0 auto; display: flex; position: relative; }
#centerBanner article .swiper-container { width: 100%; height: 120px; }
#centerBanner article .swiper-container .swiper-slide { display: flex; }
#centerBanner article .swiper-container .swiper-slide a { display: flex; width: 100%; height: 100%; position: relative; }
#centerBanner article .swiper-container .swiper-slide a img { width: 100%; height: 100%; }
#centerBanner article .swiper-arrow { background: url(../img/focus_btn.png) no-repeat; position: absolute; width: 40px; height: 74px; cursor: pointer; z-index: 99; display: none; }
#centerBanner article:hover .swiper-arrow { display: block; }
#centerBanner article .swiper-arrow-left { top: 50%; left: 0; margin-top: -37px; background-position: 0 -74px; }
#centerBanner article .swiper-arrow-right { top: 50%; right: 0; margin-top: -37px; background-position: -40px -74px; }
#centerBanner article .swiper-arrow-left:hover { background-position: 0 0; }
#centerBanner article .swiper-arrow-right:hover { background-position: -40px 0; }


/* 【关于我们】 */
.about { width:100%; margin-bottom: 20px; background-image: url(../img/aboutbg.png); background-size: cover; background-position: center; }
.about article { width:1180px; margin: 0 auto; display: flex; padding: 50px 0; }
.about article .content { flex: auto; height: 300px; padding: 20px; margin-right: 50px; background-color: rgba(255,255,255,0.9); border-radius: 10px; box-shadow: 0px 0px 0px 1px #d9d9d9; }
.about article .content h3 { border-left: 5px solid #cd0000; text-indent: 10px; margin: 0 0 10px 0; color: #0665b6; }
.about article .content p { color: #333333; font-size: 12px; text-indent: 2em; line-height: 25px; }
.about article .videoBox { width: 540px; height: 300px; border: 1px solid #e2e2e2; }
.about article .videoBox video { width: 540px; height: 300px; background-color: #333333; }


/* 【图片跑马灯】 */
.groupphoto { width:100%; margin-bottom: 20px; }
.groupphoto article { width:1180px; margin: 0 auto; display: flex; flex-direction: column; }
.groupphoto article .header { height: 120px; padding-top: 30px; display: flex; flex-direction: column; align-items: center; }
.groupphoto article .header h3 { width: 200px; height: 30px; line-height: 30px; text-align: center; font-size: 24px; color: #0665b6; margin: 0; margin-bottom: 5px; position: relative; }
.groupphoto article .header h3:before { content: ''; width: 100px; height: 1px; border-bottom: 1px solid #cccccc; position: absolute; top: 15px; left: -70px; }
.groupphoto article .header h3:after { content: ''; width: 100px; height: 1px; border-bottom: 1px solid #cccccc; position: absolute; top: 15px; right: -70px; }
.groupphoto article .header h3 a { font-size: 16px; color: #8e8e8e; position: absolute; right: -140px; }
.groupphoto article .header p { width: 200px; text-align: center; font-size: 12px; color: #ffc74c; margin: 0; }
.groupphoto article .content {  }
.groupphoto article .content ul { display: flex; overflow: hidden; }
.groupphoto article .content ul li { width: 200px; height: 140px; margin: 0 5px; flex: none; }
.groupphoto article .content ul li a { display: flex; width: 100%; height: 100%; position: relative; }
.groupphoto article .content ul li a img { width: 100%; height: auto; object-fit: cover; object-position: 50% 0%; }
.groupphoto article .content ul li a p { width: 100%; height: 20px; line-height: 20px; text-align: center; color: #fff; font-size: 12px; background-color: rgba(0,0,0,0.5); position: absolute; left: 0; bottom: 0; margin: 0; }


/* 【友情链接】 */
.friendLink { width:100%; margin-bottom: 20px; }
.friendLink article { width:1180px; margin: 0 auto; display: flex; flex-direction: column; }
.friendLink article .header { margin-bottom: 20px; height: 30px; line-height: 30px; border-bottom: 1px solid #f1f1f1; display: flex; }
.friendLink article .header .title { width: 100px; text-align: center; font-size: 16px; font-weight: bold; color: #0665b6; border-bottom: 1px solid #0665b6; cursor: pointer; }
.friendLink article .content {  }
.friendLink article .content ul { margin: 0; padding: 0; display: flex; flex-flow: row wrap; }
.friendLink article .content ul li { width: 226px; height: 60px; margin: 0 5px 10px 5px; display: flex; }
.friendLink article .content ul li a { display: flex; width: 100%; height: 100%; }
.friendLink article .content ul li a img { width: 100%; height: 100%; }