.development {
	padding-bottom:58px
}
.development .swiper-container {
	padding-right:200px;
	padding-top:50px
}
.development .swiper-wrapper {
	margin-left:115px !important
}
.development .swiper-wrapper .swiper-slide {
	width:auto !important
}
.item {
	display:flex
}
.item .item-left {
	position:relative;
	margin-right:25px
}
.item .item-left .year {
	position:absolute;
	left:56px;
	top:-10px;
	font-family:myRegularFont;
	font-size:60px;
	line-height:62px;
	font-weight:500;
	color:#333;
	-webkit-text-stroke:1px #333
}
.item .item-left .dot {
	height:30px;
	width:30px;
	background-repeat:no-repeat;
	background-size:cover;
background-image:url(../../images/development/dot.pngg)
}
.item .item-left .item-line {
	margin-top:10px;
	margin-left:14px;
	width:1px;
	height:605px;
	background:#838181;
	opacity:.3
}
.item .item-right {
	display:flex;
	padding-top:130px;
	padding-right:5px
}
.item .item-right .development-item {
	padding-right:20px
}
.item .item-right .item-img {
	width:600px;
	height:400px;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center
}
.item .item-right .item-content {
	padding-top:15px
}
.item .item-right .item-content p {
	width:600px;
	height:120px;
	font-size:20px;
	font-weight:400;
	color:#333;
	line-height:30px;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
	overflow:hidden
}
.item .item-right .item-content .span {
	color:#c6a144
}
.development-year {
	position:relative;
	padding:0 185px;
	padding-right:170px;
	padding-bottom:120px
}
.development-year .swiper-container {
	padding-bottom:10px;
	position:relative
}
.development-year .swiper-container .swiper-slide {
	width:90px !important
}
.development-year .mask {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:40px;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url(/skin/dsj/mask.png);
	background-position:center center;
	z-index:2;
	pointer-events:none
}
.development-year .year-bg {
	width:100%;
	height:36px;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url(/skin/dsj/line.png);
	background-position:center center;
	box-sizing:border-box
}
.development-year .swiper-year {
	display:flex;
	justify-content:center;
	font-size:36px;
	font-family:myRegularFont;
	font-weight:bold;
	color:#333;
	line-height:40px;
	-webkit-text-stroke:1px #333;
	cursor:pointer
}
@media screen and (max-width:1600px) {
.development {
padding-bottom:5px
}
.item .item-left {
margin-right:25px
}
.item .item-left .year {
font-size:55px
}
.item .item-left .item-line {
height:530px
}
.item .item-right {
padding-top:100px
}
.item .item-right .item-img {
width:550px;
height:367px
}
.item .item-right .item-content p {
width:550px;
max-height:78px;
font-size:18px;
line-height:28px
}
.development-year {
position:relative;
padding:0 185px;
padding-right:170px;
padding-bottom:120px
}
.development-year .swiper-container {
padding-bottom:10px;
position:relative
}
.development-year .swiper-container .swiper-slide {
width:90px !important
}
.development-year .mask {
width:100%;
height:40px
}
.development-year .year-bg {
height:36px
}
.development-year .swiper-year {
font-size:32px;
line-height:36px
}
}
@media screen and (max-width:1440px) {
.development {
padding-bottom:20px
}
.item .item-left {
margin-right:25px
}
.item .item-left .year {
font-size:50px
}
.item .item-left .item-line {
height:480px
}
.item .item-right {
padding-top:100px
}
.item .item-right .item-img {
width:500px;
height:333px
}
.item .item-right .item-content p {
width:500px;
max-height:72px;
font-size:16px;
line-height:26px
}
.development-year {
position:relative;
padding:0 185px;
padding-right:170px;
padding-bottom:120px
}
.development-year .swiper-container {
padding-bottom:10px;
position:relative
}
.development-year .swiper-container .swiper-slide {
width:90px !important
}
.development-year .mask {
width:100%;
height:40px
}
.development-year .year-bg {
height:36px
}
.development-year .swiper-year {
font-size:32px;
line-height:36px
}
}
@media screen and (max-width:1400px) {
.development {
padding-bottom:15px
}
.item .item-left .year {
font-size:40px
}
.item .item-left .item-line {
height:450px
}
.item .item-right {
padding-top:90px
}
.item .item-right .item-img {
width:400px;
height:267px
}
.item .item-right .item-content {
padding-top:10px
}
.item .item-right .item-content p {
width:400px;
max-height:72px;
font-size:14px;
line-height:24px
}
}
@media screen and (max-width:1366px) {
.development {
padding-bottom:30px
}
.item .item-left .year {
top:-15px;
font-size:35px
}
.item .item-left .item-line {
height:350px
}
.item .item-right {
padding-top:60px
}
.item .item-right .item-img {
width:380px;
height:254px
}
.item .item-right .item-content {
padding-top:10px
}
.item .item-right .item-content p {
width:380px;
max-height:66px;
font-size:14px;
line-height:22px
}
.development-year {
position:relative;
padding:0 185px;
padding-right:170px;
padding-bottom:120px
}
.development-year .swiper-container {
padding-bottom:10px;
position:relative
}
.development-year .swiper-container .swiper-slide {
width:90px !important
}
.development-year .mask {
width:100%;
height:40px
}
.development-year .year-bg {
height:36px
}
.development-year .swiper-year {
font-size:28px;
line-height:32px
}
}
@media screen and (max-width:1200px) {
.development {
padding-bottom:0
}
.item .item-left .year {
top:-15px;
font-size:30px
}
.item .item-left .item-line {
height:330px
}
.item .item-right {
padding-top:60px
}
.item .item-right .item-img {
width:350px;
height:233px
}
.item .item-right .item-content {
padding-top:10px
}
.item .item-right .item-content p {
width:350px;
max-height:72px;
font-size:14px;
line-height:24px
}
.development-year {
position:relative;
padding:0 100px;
padding-right:100px;
padding-bottom:120px
}
.development-year .swiper-container {
padding-bottom:10px;
position:relative
}
.development-year .swiper-container .swiper-slide {
width:90px !important
}
.development-year .mask {
width:100%;
height:40px
}
.development-year .year-bg {
height:36px
}
.development-year .swiper-year {
font-size:24px;
line-height:28px
}
}