

.create {
	font-size: 0;
	position: relative;
	border-top: 1px solid #c6c6c6
}
.create .title {
	margin-top: 0;
	margin-bottom: 50px;
	font-weight: lighter
}
.create .more {
	text-align: right;
	margin-top: 50px
}
.create .more a {
	text-align: center
}
.create .left {
	width: 50%
}
.create .left .swiper-container {
	width: 62%;
	margin-right:0;
}
.create .left .desc {
	font-size: 14px;
	color: #666;
	line-height: 24px
}
.create .right {
	float: right;
	width: 50%
}
.create .right .swiper-pagination-bullet {
	opacity: 1;
	margin: 0 2px
}
.create .right .swiper-pagination-bullet:after {
	border-width: 2px
}
.create .right .swiper-pagination {
	position: absolute;
	text-align: left;
	bottom: 70px;
	left: 40px
}
.right-list {
height:500px;
}
.right-list .pic {
	opacity: 1;
	background-size: cover;
	/*transition: opacity 1s;
	-ms-transition: opacity 1s;
	-o-transition: opacity 1s;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;*/
	background-position: center
}
.left-page {
	position: absolute;
	bottom: 88px;
	left: 18.8%
}
.left-page .swiper-pagination-bullet {
	opacity: 1;
	width: auto;
	height: auto;
	background: #fff;
	border-radius: 0;
	margin: 0;
	padding: 0 8px;
	border-right: 1px solid #dfdfdf
}
.left-page .swiper-pagination-bullet:before {
	display: none
}
.left-page .swiper-pagination-bullet a {
	display: inline-block;
	transition: .4s;
	-ms-transition: .4s;
	-o-transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s
}
.left-page .swiper-pagination-bullet:last-child {
	border-right: 0
}
.left-page .swiper-pagination-bullet:after {
	display: none
}
.left-page .swiper-pagination-bullet.swiper-pagination-bullet-active a {
	color: #8ec31f;
	font-size: 16px
}
.left-page a {
	font-size: 14px;
	color: #666
}
@media (max-width:1600px) {
	.create .left .swiper-container {
	width: 78%;
	padding: 1rem 0 0;
	margin-right:0;
}
.left-page {
	position: absolute;
	bottom: 88px;
	left: 10.8%
}}
	}

@media (max-width:1200px) {
.create .left {
	width: 100%;
	position: static;
	transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0)
}
.create .left .swiper-container {
	width: 77%;
	padding: 1rem 0 0;
	margin-right:0;
}
.create .right {
	width: 100%;
	float: none
}
.create .right .swiper-pagination {
	bottom: 30px;
	left: 0;
	text-align: center
}
.left-page {
	position: static;
	width: 80%;
margin:.4rem auto 1rem
}
}
@media (max-width:780px) {
.create .right .swiper-pagination {
	bottom: 15px
}
}
@media (max-width:640px) {

.create .left .swiper-container {
	width: 90%;
	padding: 1.5rem 0 1rem
}
.create .left .desc {
	font-size: 13px;
	line-height: 24px
}
.create .title {
margin-bottom:.6rem
}
.create .more {
margin-top:.5rem;
	text-align: center
}
.right-list {
height:calc(.6 * 100vw)
}
.left-page {
	position: absolute;
	top: calc(60vw);
	bottom: auto;
	width: 90%;
margin:.5rem auto .5rem
}

}
@media (max-width:480px) {
.title {
	font-size: 18px
}
.title i {
	margin-right: 10px;
	width: 30px;
	height: 21px
}
.create .left .swiper-container {
	padding: 1.8rem 0 1rem
}
}
@media (max-width:360px) {
.left-page a {
	font-size: 12px
}
.left-page .swiper-pagination-bullet.swiper-pagination-bullet-active a {
	font-size: 14px
}
}
