﻿/*
 * Overview: Home Style
 */

.slide-box { position: relative; width: 100%; overflow: hidden; background-color: #1a71b2; }
.slide-item { display: none; position: relative; width: 100%; height: 495px; overflow: hidden; }
.slide-item .width { position: relative; z-index: 200; }
.slide-item .banner { position: absolute; left: 50%; margin-left: -1000px; height: 495px; z-index: 100; }
.banner-img-box { position: relative; left: 0; margin-top: 95px; width: 465px; height: 299px; }
.banner-img-box img { position: absolute; }
.banner-img-box .banner-img { z-index: 100; left: 21px; top: 16px; }
.banner-img-box .banner-border { z-index: 200; left: 0; top: 0; }
.slide-item h2 { display: block; margin-bottom: 21px; color: #fff; font-size: 40px; }
.slide-item h3 { line-height: 28px; color: #c4f4f9; font-family: 'HelveticaNeueLTPro-ThEx'; font-size: 20px; }

.banner-border { animation: scale 1.2s 0s ease both; }
.banner-img { animation: scalerotate 1.2s 0s ease both; }

.banner-item-1 h2 { margin-top: 170px; font-size: 24px; color: #fff; }
.banner-item-1 h3 { font-weight: 400; }

.banner-item-2 h2 { margin-top: 170px; font-size: 18px; color: #c4f4f9; line-height: 40px; font-family: '微软雅黑'; }

.slide-item h2 { animation: slideLeft 2s 1s ease both; }
.slide-item h3 { animation: slideLeft 2s 1.2s ease both; }
.slide-item p { animation: slideLeft 2s 1.2s ease both; }

.banner-item-3 { background-color: #34ac9d; }
.banner-item-3 .banner-text { width: 100%; margin-top: 94px; text-align: center; }
.banner-item-3 h3 { width: 236px; display: block; margin: 0 auto; font-family: '微软雅黑'; font-size: 18px; overflow: hidden; color: #fff; animation: slideShow 0.2s 2s ease both; }
.banner-item-3 h3 span { display: inline; animation: slideShow 1.3s 2s ease both; }
.banner-item-3 h4 { display: block; width: 440px; margin: 26px auto; line-height: 30px; color: #befbf8; font-size: 16px; text-align: left; animation: slideShow 2.5s 2s ease both; }
.banner-item-3 h4 span { display: block; margin-left: 80px; }

.banner-item-4 h2 { margin-top: 90px; font-size: 24px; color: #fff; }
.banner-item-4 h3 { font-size: 16px; font-weight: 400; line-height: 22px; }
.banner-item-4 p { padding: 12px 0; padding-top: 5px; font-size: 16px; color: #c4f4f9; line-height: 24px; }
.banner-item-4 span { display: inline-block; *display: inline; *zoom: 1; margin: 0 20px; margin-left: 0; font-size: 14px; }

.slide-banner-btn { width: 100%; height: 2px; position: absolute; bottom: 44px; margin: 0 auto; z-index: 300; text-align: center; }
.slide-banner-btn span { display: inline-block; *display: inline; *zoom: 1; width: 100px; height: 2px; background-color: #598fb8; cursor: pointer; }
.slide-banner-btn .current { background-color: #fff; }

@keyframes scalerotate{

	0% { transform: scale(0.7) rotate(-10deg); opacity: 0.7; }
	100% { transform: scale(1) rotate(0deg); opacity: 1; }

}
@keyframes scale{

	0% { transform: scale(1.1); opacity: 0.7; }
	100% { transform: scale(1); opacity: 1; }

}

@keyframes slideLeft{

	0% { transform: translateX(5%); opacity: 0; }
	100% { transform: translateX(0); opacity: 1; }

}

@keyframes slideShow{

	0% { opacity: 0; }
	100% { opacity: 1; }

}

.banner-text { width: 514px; }

.news { margin-top: 60px; }
.news-list { width: 555px; float: left; }
.news-title { position: relative; line-height: 36px; }
.news-title h1 { display: inline-block; *display: inline; *zoom: 1; float: left; padding-bottom: 13px; font-weight: 400; font-size: 24px; color: #0e0e0e; border-bottom: 2px solid #8ebb42; }
.news-title h2 { display: inline-block; *display: inline; *zoom: 1; float: left; margin-left: 10px; padding-top: 2px; font-size: 28px; color: #dadcdd; font-weight: 400; font-family: 'HelveticaNeueLTPro-ThEx'; }
.news-title u { position: absolute; left: -35px; top: 3px; width: 32px; height: 32px; display: block; background: url(../images/ui-circle.png) center no-repeat; }
.news-title i { position: absolute; display: block; left: -2024px; top: 19px; width: 2000px; height: 1px; background-color: #efeeee; }

.news-list .list { width: 100%; height: 300px; float: left; overflow: hidden; }
.news-list .list dd { display: block; float: left; width: 100%; margin-top: 15px; margin-bottom: 6px; padding-bottom: 28px; border-bottom: 1px dotted #c1c1c1; }
.news-list .list h2 { display: block; width: 100%; height: 28px; line-height: 28px; overflow: hidden; font-size: 18px; color: #0b0b0b; }
.news-list .list a:hover h2 { color: #136aac; }
.news-list .list span { display: block; height: 24px; line-height: 24px; padding-left: 22px; font-size: 14px; color: #a8a8a8; background: url(../images/ui-time.png) left center no-repeat; font-family: 'HelveticaNeueLTPro-ThEx'; }
.news-list .list p { display: block; margin-top: 4px; font-size: 14px; color: #636363; line-height: 24px; }

.slide-news { float: right; position: relative; width: 476px; overflow: hidden; margin-top: 24px; padding-bottom: 20px; }
.news-img { width: 476px; height: 227px; overflow: hidden; position: relative; }
.news-img ul { position: absolute; left: 0; top: 0; width: 2000px; overflow: hidden; }
.news-img ul li { float: left; }
.news-img img { width: 476px; height: 227px; }
.news-text { overflow: hidden; width: 476px; height: 72px; }
.news-text li { float: left; width: 476px; height: 56px; margin-top: 18px; overflow: hidden; }
.news-text li a:hover h2 { color: #136aac; }
.news-text h2 { display: block; float: left; width: 365px; margin-left: 20px; font-size: 18px; line-height: 28px; color: #0b0b0b; }
.news-time { position: relative; float: left; height: 46px; padding-left: 10px; color: #a8a8a8; font-family: 'HelveticaNeueLTPro-ThEx'; }
.news-time h3 { font-size: 24px; line-height: 30px; display: block; margin-bottom: 4px; }
.news-time span { font-size: 14px; display: block; text-align: right; }
.news-time i { position: absolute; display: block; left: 0; top: 5px; width: 2px; height: 46px; background-color: #136aac; }

.news-slide-btn { position: absolute; z-index: 200; right: 12px; bottom: 0; width: 55px; height: 34px; }
.news-slide-btn span { display: block; float: left; width: 11px; height: 19px; cursor: pointer; }
.news-slide-btn .prev { background: url(../images/ui-direction-prev.png) center no-repeat; }
.news-slide-btn .next { float: right; background: url(../images/ui-direction-next.png) center no-repeat; }

.news-slide-btn .prev:hover { background: url(../images/ui-direction-prev-hover.png) center no-repeat; }
.news-slide-btn .next:hover { background: url(../images/ui-direction-next-hover.png) center no-repeat; }


/* .about { width: 100%; margin-top: 60px; padding-top: 140px; padding-bottom: 10px; overflow: hidden; background: url(../images/home-about-bg.jpg) top center no-repeat; }

.about-box { width: 1100px; height: 272px; padding-top: 33px; margin: 0 auto; background-color: #fff; box-shadow: 0 1px 8px #ccc; }
.about h2,
.about i,
.about h3 { display: block; text-align: center; margin: 0 auto; }
.about h2 { font-size: 24px; color: #0e0e0e; }
.about i { width: 95px; height: 2px; margin: 9px auto 7px ; background-color: #77ab10; }
.about h3 { color: #dadcdd; font-size: 24px; font-family: 'HelveticaNeueLTPro-ThEx'; text-transform: uppercase; }
.about p { width: 948px; margin: 8px auto; color: #333537; font-size: 14px; line-height: 28px; text-align: justify; }
.about a { display: block; margin: 0px auto; margin-top: 20px; width: 88px; height: 14px; background: url(../images/ui-enter.jpg) center no-repeat; }
.about a:hover { background: url(../images/ui-enter.png) center no-repeat; }
 */
.link-box { margin-top: 53px; }
.link-list { width: 315px; float: left; margin-right: 77px; }
.link-title { width: 100%; height: 46px; line-height: 46px; overflow: hidden; border-bottom: 2px solid #8ebb42; }
.link-title h2,
.link-title span { display: block; float: left; }

.link-title h2 { font-size: 18px; color: #0e0e0e; }
.link-title span { margin-left: 10px; font-size: 18px; color: #dadcdd; font-family: 'HelveticaNeueLTPro-ThEx'; text-transform: uppercase; }

.link-box .list ul { overflow: hidden; }
.link-box .list li { position: relative; float: left; width: 100%; height: 66px; line-height: 66px; overflow: hidden; border-bottom: 1px dotted #ccc; }
.link-box .list i { position: absolute; right: 14px; top: 0; z-index: 200; display: block; width: 54px; height: 14px; margin-top: 26px; background: url(../images/ui-enter-white.png) center no-repeat;}
.link-box .list img { display: none; position: absolute; left: 0; top: -1px; z-index: 100; }
.link-box .list a { display: block; color: #333537; font-size: 14px; height: 66px; line-height: 66px; }
.link-box .list span { position: relative; z-index: 200; margin-left: 17px; padding-left: 14px; background: url(../images/ui-dot-gray.png) center left no-repeat;  }
.link-box .list a:hover { color: #fff; }
.link-box .list a:hover img { display: block; }

.link-box .scientific {  }
.link-box .scientific a { width: 100%; margin-left: 5px; padding-left: 14px; background: url(../images/ui-dot-gray.png) center left no-repeat; }
.link-box .scientific a:hover { color: #136aac; }

.link-list {  }
.link-list .link-1 { margin-top: 46px; }
.link-list a { display: block; overflow: hidden; margin-bottom: 28px; }
.download a:hover { opacity: 0.8; }

.equipment { margin-top: 68px; overflow: hidden; }
.equipment-slide-box { position: relative; z-index: 100; width: 910px; overflow: hidden; float: right; height: 200px; }
.equipment-slide-box ul { width: 1000px; position: absolute; left: 0; top: 0; overflow: hidden; }
.equipment-slide-box li { position: relative; display: block; float: left; margin-right: 1px; width: 181px; height: 200px; text-align: center; overflow: hidden; }
.equipment-slide-box li span { position: relative; z-index: 200; display: none; width: 100%; height: 56px; margin-top: -3px; line-height: 22px; padding-top: 12px; font-size: 14px; color: #333537; text-align: center; }
.equipment-slide-box li img { position: relative; z-index: 100; width: 181px; height: 145px; object-fit: cover; }
.equipment-slide-box li i { display: block; position: absolute; left: 0; top: 0; z-index: 150; width: 181px; height: 145px; background: url(../images/equipment-shadow.png) center no-repeat; }

.equipment-slide-box li a:hover span { display: block; border-top: 3px solid #8ebb42; padding-top: 12px; }
.equipment-slide-box li a:hover i { display: none; }
.equipment-slide-box li span:hover { color: #136aac; }

.equipment-cover { position: relative; z-index: 300; float: left; width: 190px; height: 145px; background-color: #136aac; }
.equipment-cover i { position: absolute; right: -16px; top: 62px; display: block; width: 16px; height: 26px; background: url(../images/ui-triangle.png) center no-repeat; }
.equipment-cover h2 { display: block; margin-top: 26px; padding-left: 27px; font-size: 18px; color: #fff; margin-bottom: 6px; }
.equipment-cover h3 { display: block; padding-left: 27px; font-size: 14px; line-height: 20px; color: #87c2ef; text-transform: uppercase; font-family: 'HelveticaNeueLTPro-ThEx'; }
.equipment-btn { margin-top: 10px; margin-left: 27px; width: 54px; }
.equipment-btn span { display: block; width: 11px; height: 19px; cursor: pointer; }
.equipment-prev { float: left; background: url(../images/equipment-prev.png) center no-repeat; }
.equipment-next { float: right; background: url(../images/equipment-next.png) center no-repeat; }
.equipment-prev:hover { background: url(../images/equipment-prev-hover.png) center no-repeat; }
.equipment-next:hover { background: url(../images/equipment-next-hover.png) center no-repeat; }
