.page-about .s1 .cont{display: flex; justify-content: space-between;}
.page-about .s1 .a1{width: 250px; box-sizing: border-box;}
.page-about .s1 .a1 .picBox{position: relative; overflow: hidden; height: 100%;}
.page-about .s1 .a1 .picBox::before{content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
.page-about .s1 .a1 .picBox img{width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.page-about .s1 .a1 .picBox:hover img{transform: scale(1.1);}
.page-about .s1 .a1 .picBox:hover::before{animation: gradient-rectangle 1.4s;animation-delay: 0s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96);}
.page-about .s1 .a2{width: calc(100% - 334px); box-sizing: border-box; background: #f8f9fb; padding: 4.895vw 7.6vw;}
.page-about .s1 .a2 .b1 .tit{font-size: 2.291vw; position: relative; padding-bottom: 13px;}
.page-about .s1 .a2 .b1 .tit::before{content: '\20'; position: absolute; left: 0; bottom: 0; width: 58px; height: 5px; background: #d0121b;}
.page-about .s1 .a2 .b1 .tip{font-size: 16px; color: #666666; line-height: 36px; margin-top: 1.875vw;;}
.page-about .s1 .a2 .b2{margin-top: 4.166vw;}
.page-about .s1 .a2 .b2 .item-wrap{display: flex; justify-content: space-between;}
.page-about .s1 .a2 .b2 .item .top{font-size: 3.75vw; line-height: 1; color: #d0121b;fill: #d0121b; font-weight: bold; font-family: Arial; text-align: center;}
.page-about .s1 .a2 .b2 .item .top i { display:inline-block; }
.page-about .s1 .a2 .b2 .item .top em { position:relative; top:-0.8vw; display:inline-block; font-size:1vw; }

.page-about .s1 .a2 .b2 .item .bot{font-size: 16px; color: #666666; text-align: center;}
.page-about .s2{padding: 132px 0 96px 0;}
.page-about .s2 .cont{display: flex; justify-content: space-between; align-items: flex-end;}
.page-about .s2 .a1{width: 65.625%; position: relative;}
.page-about .s2 .a1 .b1{position: relative; z-index: 5;}
.page-about .s2 .a1 .b1 .tit{font-size: 2.291vw; position: relative; padding-bottom: 13px;}
.page-about .s2 .a1 .b1 .tit::before{content: '\20'; position: absolute; left: 0; bottom: 0; width: 58px; height: 5px; background: #d0121b;}
.page-about .s2 .a1 .b1 .tip{font-size: 16px; color: #666666; line-height: 36px; margin-top: 5.208vw; text-align: justify;}
.page-about .s2 .a1 .b2{position: absolute; top: 0%; left: 23%; transform: translateY(-50%); width: 53.333%;}
.page-about .s2 .a1 .b2 img{width: 100%;}
.page-about .s2 .a2{width: 26.5%;}
.page-about .s3{background: #f8f8f8; padding: 10.416vw 0 5.833vw 0;}
.page-about .s3 .cont{display: flex; justify-content: space-between; align-items: center;}
.page-about .s3 .a1{width: 36.25%; box-sizing: border-box; position: relative;}
.page-about .s3 .a1::before{content: '\20'; position: absolute; right: 0%; bottom: -13%; width: 50%; height: 108%; background: #d0121b;}
.page-about .s3 .a1 .picBox{position: relative; width: 86.37%;}
.page-about .s3 .a1 .picBox img{width: 100%;}
.page-about .s3 .a2{width: 52.5%; box-sizing: border-box; position: relative;}
.page-about .s3 .a2 .tit{font-size: 2.291vw; color: #333333; position: relative; z-index: 4; line-height: 1;}
.page-about .s3 .a2 .tit span{color: #d0121b;}
.page-about .s3 .a2 .tip{width: 85.71%; margin-top: 36px; position: relative; z-index: 4;}
.page-about .s3 .a2 .tip img{width: 100%;}
.page-about .s3 .a2 .txt{font-size: 18px; color: #666666; line-height: 50px; margin-top: 3.854vw;}
.page-about .s3 .a2 .txt img{vertical-align: middle;}
.page-about .s3 .a2 .picBox{position: absolute; right: 0; top: -37px;}
.page-about .s4{background: url(about_7.jpg) no-repeat center bottom; background-size: 100% auto; padding: 8.333vw 0 10.9375vw 0;}
.page-about .s4 .a1 .b1{width: 75%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.page-about .s4 .a1 .b1 .c1{display: flex; align-items: center;}
.page-about .s4 .a1 .b1 .c1 .yy{font-family: Arial; font-size:4vw; font-weight: bold; color: #d0121b; border: 5px solid #d0121b; line-height: 1; padding: 0.6vw 1.77vw; margin-right: 40px;}
.page-about .s4 .a1 .b1 .c1 .line{width: 34px; height: 3px; background: #d0121b;}
.page-about .s4 .a1 .b1 .c2{width: 50%;}
.page-about .s4 .a1 .b1 .c2 .tit{font-size: 1.875vw; color: #333333;}
.page-about .s4 .a1 .b1 .c2 .tip{font-size: 18px; color: #666666; line-height: 36px;}
.page-about .s4 .a2{margin-top: 12.5vw;}
.page-about .s4 .a2 .s4-swiper-bot::before{content: '\20'; position: absolute; left: 0; top: 12px; width: 100%; height: 1px; border-top: 1px dashed #d0121b;}
.page-about .s4 .a2 .swiper-slide{cursor: pointer;}
.page-about .s4 .a2 .top{width: 11px; height: 11px; margin: 0 auto; box-sizing: border-box; background: #fff; border: 2px solid #d0121b; border-radius: 50%; margin-top: 7px; position: relative;}
.page-about .s4 .a2 .top::before{content: '\20'; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(0); width: 18px; height: 18px; border-radius: 50%; background: #d0121b; transition: all 0.3s; z-index: -1;}
.page-about .s4 .a2 .swiper-slide-thumb-active .top::before{transform: translate(-50%,-50%) scale(1);}
.page-about .s4 .a2 .bot{margin-top: 26px;}
.page-about .s4 .a2 .bot .yy{font-family: Arial; font-size: 34px; color: #666666; text-align: center; transition: all 0.3s;}
.page-about .s4 .a2 .swiper-slide-thumb-active .bot .yy{color: #d0121b;}
.page-about .s4 .a2 .s4-prev{position: absolute; top: 0; left: -12px; border: 12px solid transparent; border-right-color: #d0121b; z-index: 4; cursor: pointer;}
.page-about .s4 .a2 .s4-next{position: absolute; top: 0; right: -12px; border: 12px solid transparent; border-left-color: #d0121b; z-index: 4; cursor: pointer;}
.page-about .s5{padding: 7.6vw 0 0 0;}
.page-about .s5 .swiper-container-pz01{width:710px; margin:0 auto; overflow: initial;}
.page-about .s5 .swiper-container-pz01 .swiper-slide a{display: block; width: 350px;}
.page-about .s5 .swiper-container-pz01 .swiper-slide-prev a{margin-left: auto;}
.page-about .s5 .swiper-container-pz01 .swiper-slide-next a{margin-right: auto;}
.page-about .s5 .swiper-container-pz01 .swiper-slide{width:710px; text-align:center;}
.page-about .s5 .swiper-container-pz01 .swiper-slide .pic{position:relative; max-width:200px; margin:0 auto; padding-top:85px; z-index:2;}
.page-about .s5 .swiper-container-pz01 .swiper-slide .pic01{position:relative; margin-top:-15px; z-index:1; opacity: 0; visibility: hidden; transition: all 0.3s;}
.page-about .s5 .pzArea011{margin: 0 auto; max-width:1400px; overflow:hidden;}
.page-about .s5 .swiper-container-pz01 .swiper-slide.swiper-slide-active{width:710px;}
.page-about .s5 .swiper-container-pz01 .swiper-slide.swiper-slide-active a{padding:0 40px; width: 710px;}
.page-about .s5 .swiper-container-pz01 .swiper-slide.swiper-slide-active .pic{max-width:290px; padding-top:0;}
.page-about .s5 .swiper-container-pz01 .swiper-slide.swiper-slide-active .pic01{margin-top:-25px; opacity: 1; visibility: visible;}
.page-about .s5 .btn{text-align:center; margin-top:40px;}
.page-about .s5 .btn a{display:inline-block; width:60px; height:60px; margin:0 8px; border-radius:100%; box-sizing: border-box; border: 1px solid #ddd; transition: all 0.3s; position: relative;}
.page-about .s5 .btn a::before{content: '\20'; position: absolute; top: 50%; width: 12px; height: 12px; border-right: 2px solid #333; border-bottom: 2px solid #333; transition: all 0.3s;}
.page-about .s5 .btn a.prev-pz01::before{transform: translateY(-50%) rotate(135deg); left: 25px;}
.page-about .s5 .btn a.next-pz01::before{transform: translateY(-50%) rotate(-45deg); right: 25px;}
.page-about .s5 .btn a:hover{border-color: #d0121b;}
.page-about .s5 .btn a:hover::before{border-color: #d0121b;}

.page-about .s5 .a1{position: relative;}
.page-about .s5 .s5-swiper .picBox{text-align: center;position: relative;padding-bottom: 13%;}
.page-about .s5 .s5-swiper .picBox .top{position: relative; z-index: 4;padding: 0 12%;}
.page-about .s5 .s5-swiper .picBox .top img{transform: scale(0.8); transition: all 0.4s; max-width: 100%;}
.page-about .s5 .s5-swiper .picBox .bot{position: absolute; left: 0; bottom: 30px; width: 100%; z-index: 2; transform: scale(0.8); transition: all 0.4s;}
.page-about .s5 .s5-swiper .picBox .bot img{width: 100%;}
.page-about .s5 .s5-swiper .textBox{font-size: 24px;color: #333333; text-align: center; margin-top: 20px; transition: all 0.4s; opacity: 0; visibility: hidden;}
.page-about .s5 .s5-swiper .swiper-slide-active .textBox{opacity: 1; visibility: visible;}
.page-about .s5 .s5-swiper .swiper-slide-active .picBox .top img{transform: scale(1);}
.page-about .s5 .s5-swiper .swiper-slide-active .picBox .bot{transform: scale(1); bottom: 0;}
.page-about .s5 .a2{margin-top: 60px; display: flex;justify-content: center;}
.page-about .s5 .a2 .s5-prev,
.page-about .s5 .a2 .s5-next{position: relative; width: 60px; height: 60px; border-radius: 50%; box-sizing: border-box; border: 2px solid #ccc; transition: all 0.4s; cursor: pointer; margin: 0 7px;}
.page-about .s5 .a1 .s5-prev::before,
.page-about .s5 .a2 .s5-next::before{content: '\20'; position: absolute; width: 14px; height: 14px; border-right: 1px solid #333; border-bottom: 1px solid #333; transition: all 0.4s; top: 50%;}
.page-about .s5 .a2 .s5-prev::before{transform: translateY(-50%) rotate(135deg); left: 24px;}
.page-about .s5 .a2 .s5-next::before{transform: translateY(-50%) rotate(-45deg); right: 24px;}
.page-about .s5 .a2 .s5-prev:hover,
.page-about .s5 .a2 .s5-next:hover{border-color: #d0121b;}
.page-about .s5 .a2 .s5-prev:hover::before,
.page-about .s5 .a2 .s5-next:hover::before{border-color: #d0121b;}

@media screen and (max-width:1680px) {
	.page-about .s4 .a1 .b1 .c1 .yy{ font-size:3vw; padding:0.5vw 1vw; }
}
@media screen and (max-width: 1200px) {
    .page-about .s1 .a2{padding: 40px;}
}
@media screen and (max-width: 1000px) {
    .page-about .s1 .a1{display: none;}
    .page-about .s1 .a2{width: 100%;}
    .page-about .s1 .a2 .b1 .tit{font-size: 24px;}
    .page-about .s2{padding: 80px 0 60px;}
    .page-about .s2 .a1 .b1 .tit{font-size: 24px;}
    .page-about .s3 .a2 .tit{font-size: 24px;}
    .page-about .s3 .a2 .txt{font-size: 16px; line-height: 28px;}
    .page-about .s4 .a1 .b1 .c2 .tit{font-size: 22px;}
    .page-about .s4 .a1 .b1 .c2 .tip{font-size: 16px;line-height: 26px; margin-top: 10px;}
    .page-about .s5 .s5-swiper .textBox{font-size: 20px;}
    .page-about .s5 .a2{margin-top: 40px;}
}
@media screen and (max-width: 750px) {
    .page-about .s1 .a2{padding: 30px 20px;}
    .page-about .s1 .a2 .b1 .tit{font-size: 20px;}
    .page-about .s1 .a2 .b1 .tip{margin-top: 20px; line-height: 28px;}
    .page-about .s1 .a2 .b2 .item-wrap{flex-wrap: wrap;}
    .page-about .s1 .a2 .b2 .item-wrap .item {width: 50%; margin-top: 20px;}
    .page-about .s1 .a2 .b2 .item .top{font-size: 24px;}
	.page-about .s1 .a2 .b2 .item .top em { top:-5px; font-size:14px; }

	
    .page-about .s2 .a2{display: none;}
    .page-about .s2 .a1{width: 100%;}
    .page-about .s2 .a1 .b1 .tit{font-size: 20px;}
    .page-about .s2{padding: 60px 0 40px 0;}
    .page-about .s2 .a1 .b1 .tip{margin-top: 20px; line-height: 28px;}
    .page-about .s3{padding: 40px 0;}
    .page-about .s3 .cont{flex-wrap: wrap;}
    .page-about .s3 .a1{width: 100%;}
    .page-about .s3 .a2{width: 100%; margin-top: 80px;}
    .page-about .s3 .a2 .picBox{top: 0;}
    .page-about .s3 .a2 .picBox img {width: 60px;}
    .page-about .s3 .a2 .tit{font-size: 20px;}
    .page-about .s3 .a2 .tip{margin-top: 20px;}
	
    .page-about .s4 .a1 .b1{width: 100%; display:block; }
	.page-about .s4 .a1 .b1 .c1 { width:100%; }
	.page-about .s4 .a1 .b1 .c2 { width:100%; margin-top:20px; }
    .page-about .s4 .a1 .b1 .c1 .yy{border-width: 2px; padding: 5px;}
	.page-about .s4 .a2 { margin-top:15px; }
    .page-about .s4 .a2 .bot{margin-top: 14px;}
    .page-about .s4 .a2 .bot .yy{font-size: 20px;}
    .page-about .s4 .a1 .b1 .c2 .tit{font-size: 18px;}
    .page-about .s4 .a1 .b1 .c2 .tip{font-size: 14px; line-height: 24px;}
    .page-about .s5{padding: 40px 0 20px 0;}
    .page-about .s5 .s5-swiper .textBox{font-size: 16px; margin-top: 14px;}
    .page-about .s5 .a2 .s5-prev, .page-about .s5 .a2 .s5-next{width:40px; height: 40px;}
    .page-about .s5 .a2 .s5-prev::before{left: 15px; width:10px; height:10px; }
    .page-about .s5 .a2 .s5-next::before{right: 15px; width:10px; height:10px;}
}

.page-culture .s1{padding: 0 0 5.729vw 0;}
.page-culture .s1 .cont .a1{display: flex; justify-content: space-between; align-items: flex-end;}
.page-culture .s1 .a1 .b1{width: 84.4375%;}
.page-culture .s1 .a1 .b1 .picBox{position: relative; overflow: hidden;}
.page-culture .s1 .a1 .b1 .picBox::before{content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
.page-culture .s1 .a1 .b1 .picBox img{width: 100%; transition: all 0.4s;}
.page-culture .s1 .a1 .b1 .picBox:hover::before{animation: gradient-rectangle 1.4s;animation-delay: 0s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96);}
.page-culture .s1 .a1 .b1 .picBox:hover img{transform: scale(1.1);}
.page-culture .s1 .a1 .b1.sj-box{display: none;}
.page-culture .s1 .a2{display: flex; justify-content: space-between; margin-top: 3.95vw;}
.page-culture .s1 .a2 .b1{font-size: 2.291vw; color: #333333;}
.page-culture .s1 .a2 .b2{width: 69.125%; font-size: 16px; color: #666666; line-height: 36px;}
.page-culture .s2{background: url(culture_3.jpg) no-repeat center center; background-size: cover; padding: 5.9375vw 0 3.489vw 0;}
.page-culture .s2 .a1{display: flex; justify-content: space-between;}
.page-culture .s2 .a1 .b1,
.page-culture .s2 .a1 .b3{width: 19.125%; display: flex; align-items: center;}
.page-culture .s2 .a1 .b2{width: 55%; display: flex; align-items: center;}
.page-culture .s2 .a1 .b2.sj-box{display: none;}
.page-culture .s2 .a1 .b2 .picBox{overflow: hidden; position: relative;}
.page-culture .s2 .a1 .b2 .picBox::before{content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
.page-culture .s2 .a1 .b2 .picBox img{width: 100%; transition: all 0.4s;}
.page-culture .s2 .a1 .b2 .picBox:hover::before{animation: gradient-rectangle 1.4s;animation-delay: 0s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96);}
.page-culture .s2 .a1 .b2 .picBox:hover img{transform: scale(1.1);}
.page-culture .s2 .a1 .slide-hd .item{margin-bottom: 46%; cursor: pointer;}
.page-culture .s2 .a1 .slide-hd .item:last-child{margin-bottom: 0;}
.page-culture .s2 .a1 .slide-hd .item .c1{display: flex; align-items: center;}
.page-culture .s2 .a1 .slide-hd .item .c1 .tit{font-size: 20px; color: #666666; margin-left: 18px; transition: all 0.3s;}
.page-culture .s2 .a1 .slide-hd .item .c2{font-size: 24px; color: #333333; height: 72px; margin-top: 30px; transition: all 0.3s;}
.page-culture .s2 .a1 .slide-hd .item .c3{width: 100%; height: 1px; background: #d4d6da; position: relative;}
.page-culture .s2 .a1 .slide-hd .item .c3::before{content: '\20'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background: #d4d6da;}
.page-culture .s2 .a1 .b3 .slide-hd .item .c3::before{right: auto; left: 0;}
.page-culture .s2 .a1 .slide-hd .item.on .c1 .tit{color: #d0121b;}
.page-culture .s2 .a1 .slide-hd .item.on .c1 .tip img{animation: jello 1.4s;}
.page-culture .s2 .a1 .slide-hd .item.on .c2{color: #d0121b;}
.page-culture .s2 .a2{margin-top: 5.364vw; position: relative; transition: all 0.5s;}
.page-culture .s2 .a2 .slide-bd .item{width: 100%; position: absolute; left: 0; right: 0; top: 0;}
.page-culture .s2 .a2 .slide-bd .item .box{width: 89.5%; margin: 0 auto; background: #fff; box-shadow: 0 0 10px rgba(196,3,4,.2); box-sizing: border-box; padding: 2.604vw 2.343vw 3.75vw 2.343vw; opacity: 0; visibility: hidden; transition: all 1s; transform: translateY(50%);}
.page-culture .s2 .a2 .slide-bd .item.on .box{opacity: 1; visibility: visible; transform: translateY(0);}
.page-culture .s2 .a2 .slide-bd .item .b1{font-size: 20px; color: #d0121b; text-align: center;}
.page-culture .s2 .a2 .slide-bd .item .b2{font-size: 2.083vw; color: #333333; text-align: center; margin-top: 5px;}
.page-culture .s2 .a2 .slide-bd .item .b3{font-size: 16px; color: #666666; line-height: 36px; text-align: justify; margin-top: 1.5625vw;}
.page-culture .s3{padding:5vw 0 0 0;}
.page-culture .s3 .a1 .item{display: flex; justify-content: space-between; cursor: pointer;}
.page-culture .s3 .a1 .item:nth-child(even){flex-direction: row-reverse;}
.page-culture .s3 .a1 .item .picBox{width: 50%; position: relative; overflow: hidden;}
.page-culture .s3 .a1 .item .picBox::before{content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
.page-culture .s3 .a1 .item .picBox img{width: 100%; height: 100%; object-fit: cover; transition: all 0.4s;}
.page-culture .s3 .a1 .item:hover .picBox::before{animation: gradient-rectangle 1.4s;animation-delay: 0s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96);}
.page-culture .s3 .a1 .item:hover .picBox img{transform: scale(1.1);}
.page-culture .s3 .a1 .item .textBox{width: 50%; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 3% 5.6% 3% 5.88%; background: #f3f3f5; position: relative;}
.page-culture .s3 .a1 .item .textBox::before{content: '\20'; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(culture_7.jpg) no-repeat center center; background-size: cover; z-index: 2; opacity: 0; transition: all 0.5s; visibility: hidden;}
.page-culture .s3 .a1 .item .textBox .b1{font-size: 2.291vw; color: #333333; transition: all 0.4s; position: relative; z-index: 4;}
.page-culture .s3 .a1 .item .textBox .b2{font-size: 20px; color: #666666; transition: all 0.4s; position: relative; margin-top: 8px; padding-bottom: 1.5625vw; position: relative; z-index: 4;}
.page-culture .s3 .a1 .item .textBox .b2::before{content: '\20'; position: absolute; left: 0; bottom: 0; width: 40px; height: 3px; background: #d0121b; transition: all 0.4s; z-index: 4;}
.page-culture .s3 .a1 .item .textBox .b3{font-size: 16px; color: rgba(255,255,255,.55); line-height: 33px; margin-top: 1.718vw; opacity: 0; visibility: hidden; transition: all 0.4s; position: relative; z-index: 4;}
.page-culture .s3 .a1 .item:hover .textBox::before{opacity: 1; visibility: visible;}
.page-culture .s3 .a1 .item:hover .textBox .b1{color: #ffffff;}
.page-culture .s3 .a1 .item:hover .textBox .b2{color: rgba(255,255,255,.55);}
.page-culture .s3 .a1 .item:hover .textBox .b2::before{background: #fff;}
.page-culture .s3 .a1 .item:hover .textBox .b3{opacity: 1; visibility: visible;}
.page-culture .s4{padding: 5.9375vw 0 0 0;}
.page-culture .s4 .a1{display: flex; justify-content: space-between; align-items: flex-end;}
.page-culture .s4 .a1 .b2{width: 90.625%; background: url(culture_8.jpg) no-repeat center center; background-size: cover;}
.page-culture .s4 .a1 .b2 .slide-hd .item{width: 33.33%; height: 10.78vw; float: left; box-sizing: border-box; background: rgba(0,0,0,.35); cursor: pointer; transition: all 0.3s; display: flex; flex-direction: column; justify-content: center; padding: 0 0 0 6%; border-left: 1px solid rgba(255,255,255,.26); border-bottom: 1px solid rgba(255,255,255,.26);}
.page-culture .s4 .a1 .b2 .slide-hd .item:first-child{height: 21.56vw; border: none; justify-content: flex-start; padding-top: 6%;}
.page-culture .s4 .a1 .b2 .slide-hd .item:nth-child(4),
.page-culture .s4 .a1 .b2 .slide-hd .item:nth-child(5){border-bottom: none;}
.page-culture .s4 .a1 .b2 .slide-hd .item .c1{font-size: 18px; color: rgba(255,255,255,.57);}
.page-culture .s4 .a1 .b2 .slide-hd .item .c2{font-size: 24px; color: #fff;}
.page-culture .s4 .a1 .b2 .slide-hd .item .line{width: 0; height: 3px; background: #d0121b; margin-top: 22px; transition: all 0.4s;}
.page-culture .s4 .a1 .b2 .slide-hd .item.on{background: rgba(0,0,0,0.15);}
.page-culture .s4 .a1 .b2 .slide-hd .item.on .line{width: 42px;}
.page-culture .s4 .a2{margin-top: 6.25vw;}
.page-culture .s4 .a2 .slide-bd .item{display: flex; justify-content: space-between;animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99);}
.page-culture .s4 .a2 .slide-bd .item .c1 .d1{font-size: 20px; color: #d0121b;}
.page-culture .s4 .a2 .slide-bd .item .c1 .d2{font-size: 2.291vw; color: #333333;}
.page-culture .s4 .a2 .slide-bd .item .c2{width: 68.75%; text-align: justify; font-size: 16px; color: #666666; line-height: 36px;}

@media screen and (max-width: 1200px) {
    .page-culture .s2 .a1 .slide-hd .item{margin-bottom: 40%;}
    .page-culture .s2 .a1 .slide-hd .item .c1 .tit{font-size: 18px;}
    .page-culture .s2 .a1 .slide-hd .item .c2{font-size: 20px;}
    .page-culture .s4 .a1 .b2 .slide-hd .item{height: 20vw;}
    .page-culture .s4 .a1 .b2 .slide-hd .item:first-child{height: 40vw;}
    .page-culture .s4 .a2 .slide-bd .item .c1 .d1{font-size: 18px;}
}

@media screen and (max-width: 1000px) {
    .page-culture .s1 .a1 .b1{width: 100%;}
    .page-culture .s1 .a1 .b2{display: none;}
    .page-culture .s1 .a2 .b1{font-size: 24px;}
    .page-culture .s2 .a1 .slide-hd .item .c2{font-size: 18px;}
    .page-culture .s2 .a1 .slide-hd .item .c1 .tit{font-size: 16px;}
    .page-culture .s3 .a1 .item .textBox .b1{font-size: 24px;}
    .page-culture .s3 .a1 .item .textBox .b2{font-size: 18px;}
    .page-culture .s4 .a2 .slide-bd .item .c1 .d2{font-size: 24px;}
}

@media screen and (max-width: 750px) {
    .page-culture .s1{padding: 0 0 40px 0;}
    .page-culture .s1 .a1 .b1{display: none;}
    .page-culture .s1 .a1 .b1.sj-box{display: block;}
    .page-culture .s1 .a2{margin-top: 30px; flex-wrap: wrap;}
    .page-culture .s1 .a2 .b1{width: 100%; font-size: 20px;}
    .page-culture .s1 .a2 .b2{width: 100%; margin-top: 20px; line-height: 28px;}
    .page-culture .s2{padding: 40px 0;}
    .page-culture .s2 .a1{flex-wrap: wrap;}
    .page-culture .s2 .a1 .b1{margin-top: 30px;}
    .page-culture .s2 .a1 .b1, .page-culture .s2 .a1 .b3{width: 100%;}
    .page-culture .s2 .a1 .slide-hd{width: 100%; display: flex; justify-content: space-between;}
    .page-culture .s2 .a1 .slide-hd .item{width: 44%; margin-bottom: 30px;}
    .page-culture .s2 .a1 .slide-hd .item .c1 .tip img{width: 30px; height: 30px;}
    .page-culture .s2 .a1 .slide-hd .item .c1 .tit{margin-left: 12px;}
    .page-culture .s2 .a1 .slide-hd .item .c2{margin-top: 14px;}
    .page-culture .s2 .a1 .b2{width: 100%; display: none;}
    .page-culture .s2 .a1 .b2.sj-box{display: block;}
    .page-culture .s2 .a2 .slide-bd .item .box{width: 100%; padding: 20px;}
    .page-culture .s2 .a2 .slide-bd .item .b1{font-size: 18px;}
    .page-culture .s2 .a2 .slide-bd .item .b2{font-size: 14px;}
    .page-culture .s2 .a2 .slide-bd .item .b3{font-size: 14px; line-height: 24px;}
    .page-culture .s3 .a1 .item{flex-wrap: wrap; margin-bottom: 4vw;}
    .page-culture .s3 .a1 .item .picBox{width: 100%;}
    .page-culture .s3 .a1 .item .textBox{width: 100%; padding: 30px 20px;}
    .page-culture .s3 .a1 .item .textBox::before{opacity: 1; visibility: visible;}
    .page-culture .s3 .a1 .item .textBox .b1{color: #ffffff; font-size: 20px;}
    .page-culture .s3 .a1 .item .textBox .b2{color: rgba(255,255,255,.55);}
    .page-culture .s3 .a1 .item .textBox .b2::before{background: #fff;}
    .page-culture .s3 .a1 .item .textBox .b3{opacity: 1; visibility: visible; line-height: 28px; margin-top: 24px;}
    .page-culture .s4 .a1 .b1{display: none;}
    .page-culture .s4 .a1 .b2{width: 100%;}
    .page-culture .s4 .a2{margin-top: 30px;}
    .page-culture .s4 .a2 .slide-bd .item{flex-wrap: wrap;}
    .page-culture .s4 .a2 .slide-bd .item .c1{width: 100%;}
    .page-culture .s4 .a2 .slide-bd .item .c2{width: 100%; line-height: 28px; margin-top: 24px;}
    .page-culture .s4 .a2 .slide-bd .item .c1 .d2{font-size: 20px;}
    .page-culture .s4 .a2 .slide-bd .item .c1 .d1{font-size: 16px;}
    .page-culture .s4 .a1 .b2 .slide-hd .item{height: 30vw; padding-left: 10px;}
    .page-culture .s4 .a1 .b2 .slide-hd .item:first-child{height: 60vw;}
    .page-culture .s4 .a1 .b2 .slide-hd .item .c1{font-size: 14px;}
    .page-culture .s4 .a1 .b2 .slide-hd .item .c2{font-size: 16px;}
    .page-culture .s4 .a1 .b2 .slide-hd .item .line{margin-top: 4px; height: 2px;}
}

@keyframes gradient-rectangle {
    0% {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        background: linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        background: -webkit-linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        opacity: 1;
    }

    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        transform-origin: top;
        background: linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        background: -webkit-linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        opacity: 0;
    }
}

@-webkit-keyframes gradient-rectangle {
    0% {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        background: linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        background: -webkit-linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        opacity: 1;
    }

    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        transform-origin: top;
        background: linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        background: -webkit-linear-gradient(to top,rgba(255, 255, 255, 0),rgba(255, 255, 255, 0.6));
        opacity: 0;
    }
}

@keyframes jello {
    0%,11.1%,100% {
        transform: none;
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg);
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }

    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }

    77.7% {
        transform: skewX(0.390625deg) skewY(0.390625deg);
    }

    88.8% {
        transform: skewX(-0.195312deg) skewY(-0.195312deg);
    }
}



.page-clean .s1{padding: 0 0 118px 0;}
.page-clean .s1 .cont {display: flex; justify-content: space-between; align-items: center;}
.page-clean .s1 .a1{width: 52.18%;}
.page-clean .s1 .a1 .tit{font-size: 18px; color: #121212; font-weight: bold; line-height: 36px; position: relative; padding-bottom: 40px;}
.page-clean .s1 .a1 .tit::before{content: '\20'; position: absolute; left: 0; bottom: 0; width: 35px; height: 6px; background: #d0121b;}
.page-clean .s1 .a1 .tip{font-size: 15px; color: #121212; line-height: 36px; margin-top: 55px;}
.page-clean .s1 .a2{width: 45%;}
.page-clean .s1 .a2 .b1{padding: 40px; background: url(clean_2.jpg) no-repeat center center; background-size: cover;}
.page-clean .s1 .a2 .b1 .c1{font-size: 16px; color: #121212; line-height: 36px;}
.page-clean .s1 .a2 .b1 .c2{margin-top: 28px; display: inline-block;}
.page-clean .s1 .a2 .b1 .c2 .textBox{text-align: center; font-size: 14px; color: #121212; margin-top: 10px;}
.page-clean .s1 .a2 .b2{font-size: 16px; color: #fff; line-height: 36px; padding: 58px 50px; box-sizing: border-box; background: url(clean_3.jpg) no-repeat center center; background-size: cover; margin-top: 50px;}

.page-clean .s2{background: #f5f5f5; padding: 100px 0 73px 0;}
.page-clean .s2 .clean-title{font-size: 34px; font-weight: bold; color: #101010; text-align: center;}
.page-clean .s2 .w-48{width: 48%;}
.page-clean .s2 .w-100{width: 100%;}
.page-clean .s2 .a1 .b2{display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 54px;}
.page-clean .s2 .ipt{margin-bottom: 38px;}
.page-clean .s2 .ipt .top{font-size: 16px; color: #181818;}
.page-clean .s2 .ipt .top span{font-size: 18px; color: #d0121b; margin-left: 12px; vertical-align: text-top;}
.page-clean .s2 .ipt .bot{margin-top: 8px; position: relative;}
.page-clean .s2 .ipt .bot input{display: block; width: 100%; height: 60px; line-height: 60px; font-size: 16px; color: #333; box-sizing: border-box; padding: 0 24px; background: #fff; border: 1px solid #eeeeee; transition: all 0.3s;}
.page-clean .s2 .ipt .bot input:focus{border-color: #d0121b; box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);}
.page-clean .s2 .ipt select{-webkit-appearance: none; display: block; width: 100%; height: 60px; line-height: 60px; font-size: 16px; color: #333; box-sizing: border-box; padding: 0 24px; background-image: url(clean_4.jpg); background-repeat: no-repeat; background-position: right 24px center;border: 1px solid #eeeeee; background-color: #fff; transition: all 0.3s; }
.page-clean .s2 .ipt select:focus{background-color: #efefef; box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);}
.page-clean .s2 .ipt textarea{display: block; width: 100%; height: 126px; padding: 24px; box-sizing: border-box; resize: none; background: #fff; border: 1px solid #eee; font-size: 16px; color: #333; transition: all 0.3s;}
.page-clean .s2 .ipt textarea:focus{background: #efefef; box-shadow: 0 0 12px rgba(0, 0, 0, 0.2); }
.page-clean .s2 .ipt .bot input.file{width: 50%; cursor: pointer; opacity: 0; position: relative; z-index: 8;}
.page-clean .s2 .ipt .bot .file-title{position: absolute; width: 288px; height: 100%; box-sizing: border-box; top: 0; left: 0; cursor: pointer; z-index: 2; display: flex; justify-content: space-between; align-items: center;}
.page-clean .s2 .ipt .bot .file-title .file-txt{width: 155px; height: 52px; border-radius: 5px; background: #a2a2a2; color: #fff; font-size: 16px; display: flex; justify-content: center; align-items: center;}
.page-clean .s2 .ipt .bot .file-title .file-name{width: 112px; font-size: 16px; color: #474747;}
.page-clean .s2 .a1-person{margin-top: 32px;}
.page-clean .s2 .a3{display: flex; justify-content: center; margin-top: 47px;}
.page-clean .s2 .a3 input{display: block; cursor: pointer; width: 155px; height: 52px; border-radius: 10px; background: #a2a2a2; margin: 0 20px; color: #fff; font-size: 18px; transition: all 0.3s;}
.page-clean .s2 .a3 input:hover{background: #d0121b;}
.page-clean .s2 .a3 input.tijiao{background: #d0121b;}
 
@media screen and (max-width: 750px) {
    .page-clean .s1{padding: 0 0 40px 0;}
    .page-clean .s1 .cont{flex-wrap: wrap;}
    .page-clean .s1 .a1{width: 100%;}
    .page-clean .s1 .a1 .tit{font-size: 16px; line-height: 28px; padding-bottom: 20px;}
    .page-clean .s1 .a1 .tip{margin-top: 30px; font-size: 14px; line-height: 26px;}
    .page-clean .s1 .a2{width: 100%; margin-top: 30px;}
    .page-clean .s1 .a2 .b1{padding: 30px 20px;}
    .page-clean .s1 .a2 .b1 .c2{display: block; text-align: center;}
    .page-clean .s1 .a2 .b2{padding: 30px 20px;  margin-top: 30px;}
    .page-clean .s2{padding: 40px 0;}
    .page-clean .s2 .clean-title{font-size: 20px;}
    .page-clean .s2 .w-48{width: 100%;}
    .page-clean .s2 .ipt{margin-bottom: 28px;}
    .page-clean .s2 .ipt .bot input{font-size: 14px; line-height: 50px; height: 50px;}
    .page-clean .s2 .a1 .b2{margin-top: 30px;}
    .page-clean .s2 .a3{margin-top: 20px;}
    .page-clean .s2 .a3 input{margin: 0 6px; width: 120px; height: 50px;}
}
 
.page-job .job-title{text-align: center;}
.page-job .job-title .tit{font-size: 48px; font-weight: bold; color: #121212;}
.page-job .job-title .tip{font-size: 18px; color: #666666; margin-top: 10px;}
.page-job .job-title .line{width: 35px; height: 6px; background: #d0121b; margin: 0 auto; margin-top: 20px;}
.page-job .s1 .a2{margin-top: 66px;}
.page-job .s1 .a2 .item-wrap{display: flex; justify-content: center; width: 67vw; margin: 0 auto; flex-wrap: wrap;}
.page-job .s1 .a2 .item{ position:relative; border: 2px solid #d0121b; color: #d0121b; border-radius: 50%; width: 9vw; height: 9vw; box-sizing: border-box; margin: 0 1.875vw; text-align: center; margin-bottom: 25px; padding-top: 2.6vw; transition: all 0.5s; cursor: pointer; z-index:1; }
.page-job .s1 .a2 .item:before { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:5vw; height:5vw;  background:#d0121b; opacity:0; border-radius:50%; content:''; display:block; z-index: -1; transition: all 0.6s; }
.page-job .s1 .a2 .item:hover:before { transform:translate(-50%, -50%) scale(2.1)!important; opacity:0.5; }



.page-job .s1 .a2 .item .top{font-size: 1.5625vw; font-weight: bold;}
.page-job .s1 .a2 .item .bot{font-size: 0.833vw;}
.page-job .s1 .a2 .item.more{padding: 0; display: flex; justify-content: center; align-items: center;}
.page-job .s1 .a2 .item.more span{display: block; width: 7px; height: 7px; border-radius: 50%; background: #d0121b; margin: 0 2px;}
.page-job .s1 .a2 .item:hover{background: #d0121b; color: #fff;}
.page-job .s1 .a2 .item.more:hover span{background: #fff;}
.page-job .s2{margin-top: 38px;}
.page-job .s2 .page-about .s5{padding-top: 40px;}
.page-job .s3{margin-top: 80px;}
.page-job .s3 .a2{margin-top: 50px;}
.page-job .s3 .a2 .item-wrap{display: flex; justify-content: space-around;}
.page-job .s3 .a2 .item .bot{padding-left: 24px;}
.page-job .s3 .a2 .item .bot .tit{font-size: 22px; font-weight: bold; color: #121212;}
.page-job .s3 .a2 .item .bot .tip{font-size: 18px; color: #121212;}
.page-job .s4{margin-top: 90px;}

@media screen and (max-width: 750px) {
    .page-job .job-title .tit{font-size: 20px;}
    .page-job .job-title .tip{font-size: 14px;}
    .page-job .s1 .a2{margin-top: 30px;}
    .page-job .s1 .a2 .item-wrap{width: 100%; justify-content: center;}
    .page-job .s1 .a2 .item{width: 25vw; height: 25vw; padding-top: 4vw;}
    .page-job .s1 .a2 .item .top{font-size: 14px;}
    .page-job .s1 .a2 .item .bot{font-size: 13px;}
    .page-job .s3{margin-top: 40px;}
    .page-job .s3 .a2 .item-wrap{flex-wrap: wrap; justify-content: space-between;}
    .page-job .s3 .a2 .item-wrap .item{width: 48%; margin-bottom: 20px;}
    .page-job .s3 .a2 .item-wrap .item .top .picBox img{width: 80px; display: block;}
}

.wuye-title{text-align: center;}
.wuye-title .tit {display: inline-block; font-size: 44px; line-height: 1; color: #0b0b0b; text-align: center; position: relative;}
.wuye-title .tit::before{content: '\20'; position: absolute; right: 0; bottom: 0; width: 100%; height: 12px; transition: ease 2s; transition-delay: 0.2s; background: linear-gradient(to right,rgba(208,18,27,0.8),rgba(208,18,27,0.6),rgba(208,18,27,0))}
.wuye-title.animated .tit::before{width: 70%;}
.wuye-culture{background: #f5f5f5; padding: 100px 0 103px 0;}
.wuye-culture .a2{margin-top: 70px;}
.wuye-culture .a2 .slide-hd{border-top: 1px solid #e3e3e3;}
.wuye-culture .a2 .slide-hd .slide-hd-box{display: flex; justify-content: space-around;}
.wuye-culture .a2 .slide-hd .item{cursor: pointer;}
.wuye-culture .a2 .slide-hd .item .tit{padding: 30px 14px 20px 14px; font-size: 18px; color: #0b0b0b; position: relative; transition: all 0.4s;}
.wuye-culture .a2 .slide-hd .item .tit::before{content: '\20'; position: absolute; left: 50%; top: 0; width: 0; height: 4px; background: #d0121b; transform: translateX(-50%); transition: all 0.4s;}
.wuye-culture .a2 .slide-hd .item.on .tit{font-weight: bold; font-size: 20px;}
.wuye-culture .a2 .slide-hd .item.on .tit::before{width: 100%;}
.wuye-culture .a2 .slide-bd .item{display: flex; justify-content: space-between;animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99);-webkit-animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99);}
.wuye-culture .a2 .slide-bd .item .textBox{width: 50%;box-sizing: border-box;background: #fff;display: flex;flex-direction: column;justify-content: center;padding: 30px 5.63% 30px 6.5%;}
.wuye-culture .a2 .slide-bd .item .textBox .tit{font-size: 40px; font-weight: bold; color: #000000;}
.wuye-culture .a2 .slide-bd .item .textBox .tit span{color: #d0121b;}
.wuye-culture .a2 .slide-bd .item .textBox .tip{font-size: 20px; color: #000000; margin-top: 12px;}
.wuye-culture .a2 .slide-bd .item .textBox .txt{font-size: 16px;color: #666666;line-height: 30px;margin-top: 3.02vw;}
.wuye-culture .a2 .slide-bd .item .picBox{width: 50%; box-sizing: border-box; position: relative; overflow: hidden;}
.wuye-culture .a2 .slide-bd .item .picBox::before{content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
.wuye-culture .a2 .slide-bd .item .picBox img{width: 100%; height: 100%; object-fit: cover; transition: all 0.3s;}
.wuye-culture .a2 .slide-bd .item .picBox:hover::before{animation: gradient-rectangle 1.4s;animation-delay: 0s;-webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96);}
.wuye-culture .a2 .slide-bd .item .picBox:hover img{transform: scale(1.1);}
.wuye-community{padding: 100px 0 90px 0;}
.wuye-community .a2{margin-top: 54px;}
.wuye-community .a2 .swiper-slide{padding-bottom: 20px; cursor: pointer;}
.wuye-community .a2 .community-box{position: relative;}
.wuye-community .a2 .community-box .picBox img{width: 100%;}
.wuye-community .a2 .community-box .textBox{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(208,18,27,.76); display: flex; flex-direction: column; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: all 0.4s;}
.wuye-community .a2 .community-box .textBox::before{content: '\20'; position: absolute; left: 50%; transform: translateX(-50%); bottom: -27px; border: 14px solid transparent; border-top-color: rgba(208,18,27,.76);}
.wuye-community .a2 .community-box .textBox .p1{position: relative;width: 23px;height: 40px;cursor: pointer;background: url(banner_mouse_ico.png) no-repeat -23px 0px;-webkit-animation: nudgeMouse 1.6s linear infinite;animation: nudgeMouse 1.6s linear infinite;display: block;margin: 0 auto;}
.wuye-community .a2 .community-box .textBox .p1::before{content: '\20'; position: absolute; width: 23px;height: 40px;background: url(banner_mouse_ico.png) no-repeat 0px 0px;-webkit-animation: colorSlide 1.6s linear infinite;animation: colorSlide 1.6s linear infinite;top: 0;left: 0;}
.wuye-community .a2 .community-box .textBox .p1 img{display: none;}
.wuye-community .a2 .community-box .textBox .p1::after{content: '\20'; position: absolute; background-color: #ffffff;width: 4px;height: 4px;border-radius: 100%;-webkit-animation: trackBallSlide 1.6s linear infinite;animation: trackBallSlide 1.6s linear infinite;top: 0;right: 0;bottom: 0;left: 0;margin: auto;}
.wuye-community .a2 .community-box .textBox .p2{font-size: 18px; color: #fff; margin-top: 18px;}
.wuye-community .a2 .swiper-slide.on .community-box .textBox{opacity: 1; visibility: visible;}

.wuye-community .a3{font-size: 16px; color: #666666; text-align: center; margin-top: 80px;}
.wuye-community .a3 .item{animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99);-webkit-animation: fadeInUp 1s 0s cubic-bezier(0.4, 0.01, 0.165, 0.99);}

@media screen and (max-width: 750px) {
    .wuye-culture{padding: 40px 0;}
    .wuye-title .tit{font-size: 22px;}
    .wuye-culture .a2{margin-top: 30px;}
    .wuye-culture .a2 .slide-hd{overflow: auto;}
    .wuye-culture .a2 .slide-hd .slide-hd-box{width: 200vw;}
    .wuye-culture .a2 .slide-hd .item .tit{font-size: 16px; padding: 18px;}
    .wuye-culture .a2 .slide-hd .item.on .tit{font-size: 18px;}
    .wuye-culture .a2 .slide-bd .item{flex-wrap: wrap;}
    .wuye-culture .a2 .slide-bd .item .textBox{width: 100%;}
    .wuye-culture .a2 .slide-bd .item .textBox .tit{font-size: 20px;}
    .wuye-culture .a2 .slide-bd .item .textBox .tip{font-size: 16px;}
    .wuye-culture .a2 .slide-bd .item .textBox .txt{font-size: 14px; line-height: 24px;}
    .wuye-culture .a2 .slide-bd .item .picBox{width: 100%;}

    .wuye-community{padding: 40px 0;}
    .wuye-community .a2{margin-top: 30px;}
    .wuye-community .a2 .community-box .textBox .p2{font-size: 16px;}
    .wuye-community .a3{margin-top: 20px; font-size: 14px; line-height: 24px;}
}

@-webkit-keyframes nudgeMouse {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(8px);
        transform: translateY(8px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes nudgeMouse {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(8px);
        transform: translateY(8px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes colorSlide {
    0% {
        height: 0;
    }

    90% {
        height: 40px;
    }
}

@keyframes colorSlide {
    0% {
        height: 0;
    }

    90% {
        height: 40px;
    }
}



@-webkit-keyframes trackBallSlide {
    0% {
        opacity: 1;
        -webkit-transform: scale(1) translateY(-8px);
        transform: scale(1) translateY(-8px);
    }

    34% {
        opacity: 1;
        -webkit-transform: scale(0.9) translateY(4px);
        transform: scale(0.9) translateY(4px);
    }

    68% {
        opacity: 0;
        -webkit-transform: scale(0.4) translateY(16px);
        transform: scale(0.4) translateY(16px);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(0.4) translateY(-8px);
        transform: scale(0.4) translateY(-8px);
    }
}

@keyframes trackBallSlide {
    0% {
        opacity: 1;
        -webkit-transform: scale(1) translateY(-8px);
        transform: scale(1) translateY(-8px);
    }

    34% {
        opacity: 1;
        -webkit-transform: scale(0.9) translateY(4px);
        transform: scale(0.9) translateY(4px);
    }

    68% {
        opacity: 0;
        -webkit-transform: scale(0.4) translateY(16px);
        transform: scale(0.4) translateY(16px);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(0.4) translateY(-8px);
        transform: scale(0.4) translateY(-8px);
    }
}