/* index */
.banner-box3-0{ width: 100%;}
.banner-box3-0 img{ width: 100%; display: block;}

/* pro */
.ct-banner{ width: 100%; position: relative;}
.ct-banner > img { width: 100%; display: block;}
.ct-banner-box{ width: 1240px; height: 100%; position: absolute; z-index: 2; top: 0; left: calc(50% - 620px); padding: 40px 0;}
.ct-banner-box .right h2{ margin-top: 15px; font-size: 60px; font-weight: 200; letter-spacing: 2px;}
.ct-banner-box h5{ margin-top: 20%; font-weight: normal; letter-spacing: 2px;}
.ct-banner-box .right p{ margin-top: 15px; color: #595757; letter-spacing: 2px;}
.ct-banner-box .font-red{ margin-top: 15%; color: #f75b9a;}
.ct-banner-box .font-red img{ vertical-align: middle; margin: -1px 10px 2px 0;}
.p-img > img{ margin-top: 20px;}

.ct-banner-box1{ margin-top: 50px;}
.ct-banner-box1 .left{ width: 45%; text-align: right; align-self: center;}
.ct-banner-box1 .left img{ width: 70%; display: block;}
.ct-banner-box1 .right{ width: 55%; text-align: right; align-self: center;}

.ct-banner-box2{ margin-top: 110px;}
.ct-banner-box2 .left{ width: 60%; align-self: center;}
.ct-banner-box2 .left img{ width: 75%; display: block; float: right;}
.ct-banner-box2 .right{ width: 40%; text-align: left; align-self: center;}

/* scene */
.ct-scene{ width: 100%; position: relative; background: url("../images/indexBg2-3.0.jpg") no-repeat top center; background-size: 100% auto;}
.ct-scene h3, .lb-h3{ width: 100%; text-align: center; color: #333333; font-weight: normal; letter-spacing: 2px;}
.ct-scene p, .lb-p{ width: 100%; text-align: center; color: #595757; font-size: 1.5rem; line-height: 24px; padding: 10px 0; margin-bottom: 30px; letter-spacing: 2px;}

#sceneCon .swiper-slide { text-align: center; font-size: 18px; background: #fff; position: relative;
	display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
	display: -moz-box; /* Firefox 17- */
	display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
	display: -moz-flex; /* Firefox 18+ */
	display: -ms-flexbox; /* IE 10 */
	display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
	-webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}
.swiper-container-horizontal > .swiper-pagination{ bottom: 50px;}
.swiper-pagination-bullet { width: 98px; height: 108px; text-align: center; line-height: 108px; font-size: 16px; font-size: 1.6rem; color:#ffffff; opacity: 1; background: url(../images/scene-page-bg2.png) no-repeat; background-size: cover; border-radius: 0;}
.swiper-pagination-bullet-active { color:#1a1a1a; background: url(../images/scene-page-bg1.png) no-repeat;}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 15px;}

.scene-bg{ width: 137px; height: 36px; position: absolute; z-index: 5; top: 0; left: calc(50% - 68.5px);}
.scene-bg > img { width: 100%; display: block;}
.ct-scene-sub{ width: 100%; position: absolute; z-index: 5; top: 100px; left: 0;}
.ct-scene-sub .title{ width: 90px; height: 88px; margin: 0 auto 60px; border-bottom: 1px solid #cccccc; border-top: 1px solid #cccccc; text-align: center; color: #ffffff; line-height: 88px; font-size: 3rem;}
.ct-scene-sub p{ width: 900px; margin: 0 auto; overflow: hidden; text-align: center; color: #eeeeee;}

/* news */
.ct-news{ width: 1240px; margin: 50px auto 80px;}
.ct-news h3{ width: 100%; padding: 30px 0; color: #333333; font-weight: normal;}
.ct-news h3 span{ float: right; color: #999999;}
.ct-news h3 span a{ text-decoration: none; color: #999999;}
.ct-news ul{ width: 100%;}
.ct-news ul li{ width: 398px; overflow: hidden; margin: 0 20px 20px 0; float: left; border: 1px solid #eeeeee;}
.ct-news ul li:last-child{ margin-right: 0;}
.ct-news ul li a{ text-decoration: none;}
.ct-news ul li a:focus, a:hover{ color: #333333;}

.ct-news .img{ position: relative;}
.ct-news .img img{ width: 396px; height: 223px;}
.ct-news .card:hover{ box-shadow:0 1px 15px rgba(0,0,0,.175);}
.ct-news .card .card-heading{ width: 100%; line-height: 30px; height: 80px; padding: 20px; display: -webkit-box; display: -moz-box; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp:2; white-space:normal;}
.ct-news .card .card-content{ width: 100%; padding: 10px 20px 20px;}
.ct-news-tit{ width: 100%; height: 60px; overflow: hidden; padding: 10px 20px; background-color: rgba(0,0,0,0.5); position: absolute; z-index: 5; left: 0; bottom: 0; -ms-transition: opacity .8s linear; -webkit-transition: opacity .8s linear; -o-transition: opacity .8s linear; transition: opacity .8s linear; opacity: 0;}
.ct-news-tit p{ width: 100%; height: 40px; overflow: hidden; line-height: 20px; color: #ffffff; display: -webkit-box; display: -moz-box; text-overflow: ellipsis; word-break: break-all; -webkit-box-orient: vertical; -webkit-line-clamp:2;}
.ct-news li a:hover .ct-news-tit{ opacity: 1;}

/*  轮播  */
.lb-h3{ margin-top: 50px;}
#certify { width: 1240px; position: relative; margin: 0 auto;}
#certify .swiper-container { padding-bottom: 60px;}
#certify .swiper-slide { width: 520px; height: 354px; background-color: #fff;}
#certify .swiper-slide img{ display:block; opacity: 0.5;}
#certify .swiper-slide h4{ width: 80%; height: 58px; overflow: hidden; margin: 0 auto; line-height: 24px; padding: 10px 0; text-align: center; color: #636363; font-size: 1.4rem; font-weight: normal; opacity: 0;}
#certify .swiper-slide-active img, #certify .swiper-slide-active h4{ opacity: 1;}

/* ----------------------- media ------------------------- */
@media screen and (max-width:1600px){
	.ct-banner-box.w1440{ width: 1150px; left: calc(50% - 575px); padding: 20px 0;}
	.ct-banner-box1{ margin-top: 30px;}
	.ct-banner-box2{ margin-top: 60px;}
	.ct-banner-box1 .left img{ width: 75%; display: block;}
	.ct-banner-box2 .left img{ width: 65%; display: block; float: right;}

	.scene-bg{ top: -1px;}
	.lb-h3{ margin-top: 10px;}
	.ct-scene h3{ padding-top: 50px;}
	.ct-scene p, .lb-p{ margin-bottom: 0;}
}

@media screen and (max-width:1440px){
	.ct-banner-box.w1440{ width: 1050px; left: calc(50% - 525px); padding: 20px 0;}
	.ct-banner-box1{ margin-top: 0;}
	.ct-banner-box2{ margin-top: 0;}
	.ct-banner-box1 .left img{ width: 75%; display: block;}
	.ct-banner-box2 .left img{ width: 65%; display: block; float: right;}

	.scene-bg{ top: -1px;}
	.lb-h3{ margin-top: 10px;}
	.ct-scene h3{ padding-top: 50px;}
	.ct-scene p, .lb-p{ margin-bottom: 0;}
}

@media screen and (max-width:1280px){
	.ct-banner-box.w1440{ width: 950px; left: calc(50% - 475px); padding: 20px 0;}
	.ct-banner-box .font-red{ margin-top: 5%;}
	.ct-banner-box1{ margin-top: 0;}
	.ct-banner-box2{ margin-top: 20px;}
	.ct-banner-box1 .left img{ width: 75%; display: block;}
	.ct-banner-box2 .left img{ width: 65%; display: block; float: right;}
	.p-img > img{ margin-top: 10px; width: 80%;}

	.lb-h3{ margin-top: 0;}
	.ct-scene p, .lb-p{ margin-bottom: 0; padding: 4px 0;}
	#certify { width: 1140px; position: relative; margin: 0 auto;}
	#certify .swiper-slide { width: 500px; height: 341px; background-color: #fff;}

	.ct-news{ width: 1140px; margin: 50px auto 80px;}
	.ct-news ul li{ width: 366px; overflow: hidden; margin: 0 20px 20px 0; float: left; border: 1px solid #eeeeee;}
	.ct-news .img img{ width: 364px; height: 205px;}
}

@media screen and (max-width:1024px){
	.ct-banner-box.w1440{ width: 800px; left: calc(50% - 400px); padding: 20px 0;}
	.ct-banner-box .font-red{ font-size: 12px;}
	.ct-banner-box h5{ margin-top: 5%;}
	.ct-banner-box .right h2{ font-size: 40px;}
	.ct-banner-box1{ margin-top: 0;}
	.ct-banner-box2{ margin-top: 0;}
	.ct-banner-box1 .left img{ width: 75%; display: block;}
	.ct-banner-box2 .left img{ width: 65%; display: block; float: right;}

	.ct-scene-sub{ top: 60px;}
	.ct-scene-sub .title{ margin: 0 auto 20px;}
	.lb-h3{ margin-top: 0;}
	.ct-scene h3{ padding-top: 20px;}
	.ct-scene p, .lb-p{ margin-bottom: 0; padding: 4px 0; font-size: 12px;}
	#certify { width: 1000px; position: relative; margin: 0 auto;}

	.ct-news{ width: 1000px; margin: 50px auto 80px;}
	.ct-news ul li{ width: 320px; overflow: hidden; margin: 0 20px 20px 0; float: left; border: 1px solid #eeeeee;}
	.ct-news .img img{ width: 318px; height: 179px;}
}