/*发展历程*/

/*$$

{"color":[{"val":"#ffffff","title":"默认文字颜色"},

{"val":"#00306a","title":"日期文字颜色"},

{"val":"#666666","title":"内容文字颜色"}],

"background":[{"val":"#ffffff","title":"栏目边框线背景颜色"},

{"val":"#0053b6","title":"编号背景颜色"},

{"val":"rgba(255,255,255,.15)","title":"左右按钮背景颜色"}],

"border":[{"val":"#e3e3e3","title":"日期右侧边框线"}]}

$$*/

#develop_152 {

	background: url(./../../../static/images/CP00014_01.jpg) no-repeat;

	width: 100%;

	background-position: 100%;

	background-attachment: fixed;

	height: 830px;

}

#develop_152 .developBox {

	width: 1200px;

	margin: 0 auto;

	padding: 70px 0 0;

}



#develop_152 .column {

	width: 100%;

	color: #ffffff;

	position: relative;

	padding-bottom: 10px;

	margin: 20px 0 30px 0;

}



#develop_152 .column::after {

	content: '';

	position: absolute;

	bottom: 0;

	width: 46px;

	height: 3px;

	background: #ffffff;

	left: 50%;

	transform: translateX(-50%);

}



#develop_152 .column .tit-1 {

	font-size: 32px;

	line-height: 40px;

	text-align: center;

}



#develop_152 .column .tit-2 {

	font-size: 15px;

	line-height: 24px;

	text-align: center;

}



#develop_152 .deveCon {

	margin: 50px 0;

}



#develop_152 .deveItem {

	width: 745px;

	height: 360px;

	background: #ffffff;

	border-radius: 20px;

	margin: 0 auto;

	padding: 40px 20px;

}



#develop_152 .deveItem .timeL {

	width: 140px;

	display: flex;

	flex-direction: column;

	align-items: center;

	height: 100%;

	border-right: #e3e3e3 solid 1px;

	float: left;

}



#develop_152 .deveItem .timeL .num {

	width: 60px;

	height: 60px;

	background: #0053b6;

	text-align: center;

	line-height: 60px;

	color: #ffffff;

	font-size: 36px;

}



#develop_152 .deveItem .timeL .year {

	line-height: 80px;

	text-align: center;

	font-size: 20px;

	color: #00306a;

}



#develop_152 .deveItem .conR {

	font-size: 14px;

	color: #666666;

	width: calc(100% - 140px);

	float: left;

	padding: 0 40px;

	line-height: 36px;

	height: 100%;

	overflow-y: scroll;

}



#develop_152 .deveTimeSwiper {

	width: 100%;

	font-size: 16px;

	color: #ffffff;

	height: 140px;

	position: relative;

}

#develop_152 .deveTimeSwiper .btnPrev,

#develop_152 .deveTimeSwiper .btnNext{

	position: absolute;

	width: 30px;

	height: 30px;

	border-radius: 50%;

	top:50%;

	margin-top: -15px;

	z-index: 100;

	cursor: pointer;

}

#develop_152 .deveTimeSwiper .btnPrev{

	left:0;

	background:rgba(255,255,255,.15) url(./../../../static/images/CP00014_03.png) no-repeat center center;

	background-size: 10px 19px;

}

#develop_152 .deveTimeSwiper .btnNext{

	right: 0;

	background:rgba(255,255,255,.15) url(./../../../static/images/CP00014_02.png) no-repeat center center;

	background-size: 10px 19px;

}

#develop_152 .timeItem {

	width: 100%;

	height: 100%;

	position: relative;

	cursor: pointer;

	transition: all .3s;

}



#develop_152 .timeItem .year {

	line-height: 40px;

	text-align: center;

}

#develop_152 .timeItem .objectList{

	position: absolute;

	left: 50%;

	top: 40px;

	height: 100px;

	width: 8px;

	margin-left: -4px;

}

#develop_152 .timeItem .object{

	width: 8px;

	height: 8px;

	background: #ffffff;

	float: left;

	margin-top: 10px;

	-moz-border-radius: 50% 50% 50% 50%;

	-webkit-border-radius: 50% 50% 50% 50%;

	border-radius: 50% 50% 50% 50%;

}

#develop_152 .timeItem .object_one{

	opacity: 1;

}

#develop_152 .timeItem .object_two{

	opacity: 0.8;

}

#develop_152 .timeItem .object_three{

	opacity: 0.6;

}

#develop_152 .timeItem .object_four{

	opacity: 0.4;

}

#develop_152 .timeItem .object_five{

	opacity: 0.2;

}

#develop_152 .timeItem .object_six{

	opacity: 0.06;

}



#develop_152 .swiper-slide-thumb-active .timeItem{

	margin-top: -8px;

}

#develop_152 .timeItem:hover{

	margin-top: -8px;

}



#develop_152 .swiper-slide-thumb-active .object{

	width: 10px;

	height: 10px;

	margin-top: 8px;

	/* opacity: 1; */

}



#develop_152 .swiper-slide-thumb-active .object_one{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

}



#develop_152 .swiper-slide-thumb-active .object_two{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

	-webkit-animation-delay: 0.25s;

	animation-delay: 0.25s;

}



#develop_152 .swiper-slide-thumb-active .object_three{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

	-webkit-animation-delay: 0.5s;

	animation-delay: 0.5s;

}



#develop_152 .swiper-slide-thumb-active .object_four{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

	-webkit-animation-delay: 0.75s;

	animation-delay: 0.75s;

}



#develop_152 .swiper-slide-thumb-active .object_five{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

	-webkit-animation-delay: 1s;

	animation-delay: 1s;

}



#develop_152 .swiper-slide-thumb-active .object_six{

	-webkit-animation: objectScale 1.5s infinite;

	animation: objectScale 1.5s infinite;

	-webkit-animation-delay: 1.25s;

	animation-delay: 1.25s;

}

@-webkit-keyframes objectScale{

	75% {

		-webkit-transform: scale(0.6);

	}

}

@keyframes objectScale{



	75% {

		transform: scale(0.6);

		-webkit-transform: scale(0.6);

	}

}

@media screen and (max-width: 1200px) {

	#develop_152 .developBox{

		width: 100%;

	}

}

@media screen and (max-width: 768px) {

	#develop_152{

		height: 600px;

	}

	#develop_152 .deveTimeSwiper{

		width: calc(100% - 30px);

		margin: 0 15px;

	}

	#develop_152 .deveTimeSwiper .btnPrev,

	#develop_152 .deveTimeSwiper .btnNext{

		width: 20px;

		height: 20px;

		background-size: 8px auto;

	}

	#develop_152 .developBox{

		width: 100%;

		padding: 20px 0;

	}

	#develop_152 .column{

		margin: 0 0 20px 0;

	}

	#develop_152 .column .tit-1{

		font-size: 24px;

		line-height: 30px;

	}

	#develop_152 .column .tit-2{

		font-size: 14px;

	}

	#develop_152 .deveCon{

		width: calc(100% - 20px);

		margin: 30px 10px;

		overflow: hidden;

	}

	#develop_152 .deveItem{

		width: 100%;

		padding: 20px 10px;

		height: 280px;

	}

	#develop_152 .deveItem .timeL{

		width: 100px;

	}

	#develop_152 .deveItem .conR{

		width: calc(100% - 100px);

		padding: 0 20px;

	}

}