.slide-enter-active {
	-webkit-transition: all .5s ease;
	transition: all .5s ease
}

.slide-enter {
	-webkit-transform: translate(-100%);
	transform: translate(-100%)
}

.pc-about-container {
	background-color: #fff
}

.pc-about-container .fake-nav {
	height: 50px
}

.pc-about-container .content-wrap {
	margin: 0 auto
}

@media screen and (min-width:100px) and (max-width:1200px) {
	.pc-about-container .content-wrap {
		width: 94%
	}
}

@media screen and (min-width:1240px) {
    .pc-about-container .content-wrap {
        width: 1240px;
        background: url(../images/sm_en_name.png) no-repeat 0 0;
        background-size:100%;
    }
}

.pc-about-container .content-wrap .top-area {
	width: 72%;
	margin: 90px auto 0;
	padding-bottom: 30px;
	min-height: 300px;
	
	background-size: 100%;
	text-align: center
}

.pc-about-container .content-wrap .top-area .logo {
	width: 280px;
	margin: 0 auto
}

.pc-about-container .content-wrap .top-area .logo>img {
	width: 100%;
	margin-top: -20px
}

.pc-about-container .content-wrap .top-area .cn-title {
	font-size: 28px;
	font-weight: 500;
	color: #333;
	margin-top: 4px;
	line-height: 40px
}

.pc-about-container .content-wrap .top-area .en-title {
	font-size: 16px;
	color: #666;
	line-height: 22px;
	margin-bottom: 14px
}

.pc-about-container .content-wrap .top-area .line {
	width: 66px;
	height: 4px;
	margin: 0 auto;
	background-color: #333;
	margin-bottom: 14px
}

.pc-about-container .content-wrap .top-area .en-desc {
	margin-top: 13px;
	color: #666
}

.pc-about-container .content-wrap .top-area .desc {
	font-size: 14px;
	font-weight: 500;
	color: #333;
	line-height: 30px
}

.pc-about-container .main-info-wrap {
	padding-top: 140px;
	padding: 140px 0 40px 0;
	background-color: #fdfdfd
}

.pc-about-container .main-info-wrap .main-info {
	margin: 0 auto
}

@media screen and (min-width:100px) and (max-width:1140px) {
	.pc-about-container .main-info-wrap .main-info {
		width: 98%
	}
}

@media screen and (min-width:1140px) {
	.pc-about-container .main-info-wrap .main-info {
		width: 1140px
	}
}

.pc-about-container .main-info-wrap .year {
	width: 150px;
	text-align: center;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: pointer;
	padding-bottom: 15px;
	position: relative
}

.pc-about-container .main-info-wrap .time {
	font-size: 20px;
	color: #666;
	line-height: 33px;
	-webkit-transition: all .05s ease-in;
	transition: all .05s ease-in
}

.pc-about-container .main-info-wrap .active>.time {
	font-size: 24px;
	font-weight: 600;
	color: #333;
	line-height: 33px
}

.pc-about-container .main-info-wrap .time-line {
	position: relative;
	height: 48px;
	margin-bottom: 47px
}

.pc-about-container .main-info-wrap .progress-bar {
	position: absolute;
	z-index: 1;
	left: 0;
	right: 0;
	bottom: 0;
	height: 6px;
	border-radius: 4px;
	background-color: #f1f1f1
}

.pc-about-container .main-info-wrap .progress-bar-yellow {
	position: absolute;
	width: 6%;
	z-index: 2;
	left: 0;
	bottom: 0;
	height: 6px;
	border-radius: 4px;
	background-color: #fcc800;
	-webkit-transition: all .4s linear;
	transition: all .4s linear
}

.pc-about-container .main-info-wrap .banana {
	position: absolute;
	width: 31px;
	height: 25px;
	z-index: 3;
	right: -4px;
	bottom: -8px
}

.pc-about-container .main-info-wrap .active-2015 {
	width: 29%
}

.pc-about-container .main-info-wrap .active-2016 {
	width: 51%
}

.pc-about-container .main-info-wrap .active-2017 {
	width: 73%
}

.pc-about-container .main-info-wrap .active-2018 {
	width: 100%
}

.pc-about-container .main-info-wrap .active-2018 .banana {
	right: 48px
}

.pc-about-container .main-info-wrap .line {
	width: 4px;
	height: 160px;
	background-color: #fcc800
}

.pc-about-container .main-info-wrap .num {
	font-size: 207px;
	font-weight: 500;
	color: #4e4e4e;
	opacity: .08;
	width: 249px;
	height: 240px;
	position: relative;
	z-index: 0
}

.pc-about-container .main-info-wrap .img {
	position: relative;
	z-index: 1
}

.pc-about-container .main-info-wrap .img>img {
	display: block;
	width: 100%
}

.pc-about-container .main-info-wrap .year-info .cn-info {
	font-size: 16px;
	font-weight: 500;
	color: #4e4e4e;
	line-height: 30px
}

.pc-about-container .main-info-wrap .year-info .en-info {
	font-size: 14px;
	font-weight: 500;
	color: #666;
	line-height: 22px
}

.pc-about-container .main-info-wrap .year-info .z-index-2 {
	position: relative;
	z-index: 2
}

.pc-about-container .main-info-wrap .year-info .z-index-3 {
	position: relative;
	z-index: 3
}

.pc-about-container .main-info-wrap .year-info .info {
	position: relative;
	z-index: 5
}

.pc-about-container .main-info-wrap .year-2014 {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start
}

.pc-about-container .main-info-wrap .year-2014 .left-area {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2014 .left-area .info {
	position: relative;
	padding-left: 6%
}

.pc-about-container .main-info-wrap .year-2014 .left-area .line {
	margin-top: -80px
}

.pc-about-container .main-info-wrap .year-2014 .left-area .cn-info {
	margin-top: 30px
}

.pc-about-container .main-info-wrap .year-2014 .left-area .en-info {
	padding-right: 22%;
	margin-top: 18px
}

.pc-about-container .main-info-wrap .year-2014 .right-area {
	width: 43%;
	margin-left: -10%
}

.pc-about-container .main-info-wrap .year-2014 .right-area .num {
	margin-left: 14%
}

.pc-about-container .main-info-wrap .year-2014 .right-area .img {
	margin-top: -23%
}

.pc-about-container .main-info-wrap .year-2014 .img>img {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2015 .img {
	position: relative
}

.pc-about-container .main-info-wrap .year-2015 .img>img {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2015 .line {
	margin: -120px 0 14px 5%;
	position: relative;
	z-index: 5
}

.pc-about-container .main-info-wrap .year-2015 .cn-info {
	margin-top: 18px;
	margin-left: 5%
}

.pc-about-container .main-info-wrap .year-2015 .en-info {
	margin-top: 20px;
	margin-left: 5%
}

.pc-about-container .main-info-wrap .year-2015 .num {
	position: absolute;
	right: -2%;
	bottom: -22%
}

.pc-about-container .main-info-wrap .year-2016 {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-bottom: 132px
}

.pc-about-container .main-info-wrap .year-2016 .left-area {
	width: 58.5%;
	position: relative;
	z-index: 2
}

.pc-about-container .main-info-wrap .year-2016 .left-area .img {
	margin-top: 5%
}

.pc-about-container .main-info-wrap .year-2016 .left-area .num {
	width: 40%;
	position: absolute;
	left: 0;
	bottom: -26%;
	text-align: left
}

.pc-about-container .main-info-wrap .year-2016 .right-area {
	width: 58.5%;
	margin-left: -15%
}

.pc-about-container .main-info-wrap .year-2016 .right-area .info {
	position: relative;
	padding-left: 35%
}

.pc-about-container .main-info-wrap .year-2016 .right-area .line {
	margin-top: -80px
}

.pc-about-container .main-info-wrap .year-2016 .right-area .cn-info {
	margin-top: 43px
}

.pc-about-container .main-info-wrap .year-2016 .right-area .en-info {
	padding-right: 10%;
	margin-top: 18px
}

.pc-about-container .main-info-wrap .year-2016 .right-area .img {
	position: relative
}

.pc-about-container .main-info-wrap .year-2016 .img>img {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2017 {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-bottom: 132px
}

.pc-about-container .main-info-wrap .year-2017 .left-area {
	width: 58.5%;
	position: relative;
	z-index: 2
}

.pc-about-container .main-info-wrap .year-2017 .left-area .info {
	position: relative;
	padding-left: 5%
}

.pc-about-container .main-info-wrap .year-2017 .left-area .line {
	margin-top: -30px
}

.pc-about-container .main-info-wrap .year-2017 .left-area .cn-info {
	margin-top: 23px
}

.pc-about-container .main-info-wrap .year-2017 .left-area .en-info {
	padding-right: 10%;
	margin-top: 18px
}

.pc-about-container .main-info-wrap .year-2017 .right-area {
	width: 58.5%;
	margin-left: -15%
}

.pc-about-container .main-info-wrap .year-2017 .right-area .num {
	width: 40%;
	position: absolute;
	right: 0;
	bottom: -26%;
	text-align: right
}

.pc-about-container .main-info-wrap .year-2017 .right-area .img {
	margin-top: 5%;
	position: relative
}

.pc-about-container .main-info-wrap .year-2017 .img>img {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2018 {
	padding-bottom: 46px
}

.pc-about-container .main-info-wrap .year-2018 .year-wrap {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start
}

.pc-about-container .main-info-wrap .year-2018 .left-area {
	width: 68.5%;
	position: relative;
	z-index: 2
}

.pc-about-container .main-info-wrap .year-2018 .left-area .info {
	position: relative;
	padding-left: 5%
}

.pc-about-container .main-info-wrap .year-2018 .left-area .line {
	margin-top: -140px
}

.pc-about-container .main-info-wrap .year-2018 .left-area .cn-info {
	margin-top: 8px
}

.pc-about-container .main-info-wrap .year-2018 .left-area .en-info {
	padding-right: 10%;
	margin-top: 11px
}

.pc-about-container .main-info-wrap .year-2018 .right-area {
	width: 43.6%;
	margin-left: -10%
}

.pc-about-container .main-info-wrap .year-2018 .right-area .num {
	margin-left: 10%
}

.pc-about-container .main-info-wrap .year-2018 .right-area .img {
	margin-top: -24%;
	position: relative
}

.pc-about-container .main-info-wrap .year-2018 .img>img {
	width: 100%
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom {
	margin-top: 20px;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-left: 3%
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom .left-content {
	width: 49.5%
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom .left-content .detail-1,
.pc-about-container .main-info-wrap .year-2018 .year-bottom .left-content .detail-2 {
	font-size: 20px;
	font-weight: 500;
	color: #4e4e4e;
	line-height: 30px
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom .left-content .detail-2 {
	margin-top: 30px
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom .right-content {
	width: 53%
}

.pc-about-container .main-info-wrap .year-2018 .year-bottom .right-content .en-desc {
	font-size: 16px;
	font-weight: 500;
	color: #666;
	line-height: 30px
}

.pc-about-container .bottom-info {
	min-height: 1332px;
	background: #f1ce4b;
	position: relative
}

.pc-about-container .bottom-info .bg {
	position: absolute;
	z-index: 0;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, .84);
	background: url(../images/about_us_bottom_bg.png) no-repeat;
	background-size: cover
}

.pc-about-container .bottom-info .shop-introduce {
	position: relative;
	z-index: 2;
	margin: 0 auto;
	color: #fff;
	text-align: center
}

@media screen and (min-width:100px) and (max-width:1000px) {
	.pc-about-container .bottom-info .shop-introduce {
		width: 98%
	}
}

@media screen and (min-width:1000px) {
	.pc-about-container .bottom-info .shop-introduce {
		width: 1000px
	}
}

.pc-about-container .bottom-info .shop-introduce .main-title {
	font-size: 24px;
	font-weight: 600;
	line-height: 33px;
	color: #fcc800;
	padding-top: 40px
}

.pc-about-container .bottom-info .shop-introduce .line {
	width: 120px;
	height: 4px;
	background-color: #fcc800;
	margin: 14px auto 30px
}

.pc-about-container .bottom-info .shop-introduce .m-en-title,
.pc-about-container .bottom-info .shop-introduce .sub-title {
	font-size: 16px;
	line-height: 22px;
	color: #fcc800
}

.pc-about-container .bottom-info .shop-introduce .en-title {
	font-size: 14px;
	color: #cbcbcb;
	line-height: 20px;
	margin-bottom: 14px
}

.pc-about-container .bottom-info .shop-introduce .cn-detail,
.pc-about-container .bottom-info .shop-introduce .detail,
.pc-about-container .bottom-info .shop-introduce .en-detail {
	font-size: 14px;
	line-height: 20px
}

.pc-about-container .bottom-info .shop-introduce .cn-detail>p,
.pc-about-container .bottom-info .shop-introduce .detail>p,
.pc-about-container .bottom-info .shop-introduce .en-detail>p {
	margin-bottom: 30px
}

.pc-about-container .bottom-info .shop-introduce .en-detail {
	color: #a3a3a3
}
