
span {
	display: inline-block;
}


.project-body .project-list {
	position: relative;
	margin: 20px auto; /* 居中*/
	/*columns: 3;  默认列数*/
	/*column-gap: 30px;  列间距*/
}
.project-body .project-box {
	width: 100%;
	/*break-inside: avoid;*/
	margin-bottom: 50px;
}

 #gallery-wrapper {
		position: relative;
		 
		}
		img.thumb {
	 
		}
		.white-panel {
		position: absolute;
		 
		}
		.img-wrapper {
			opacity: 0;
			-webkit-animation: op10 .5s ease-in;
			    animation: op10 .5s ease-in;
			    animation-delay: 1s;
			    animation-fill-mode: forwards;
			    -moz-animation-fill-mode: forwards;
			    -webkit-animation-fill-mode: forwards;
			    -o-animation-fill-mode: forwards;
		}
		@-webkit-keyframes op10 {
		0% {
		  opacity: 0;
		}
		
		100% {opacity: 1;
		}
		}
		@keyframes op10 {
		   0% {
		     opacity: 0;
		   }
		   
		   100% {opacity: 1;
		   }
		}
		.project-img {
		overflow: hidden;
		position: absolute;
		
	}
	 .project-img img {
		width: 100%;
		-webkit-transition: all 0.7s ease;
	    transition: all 0.7s ease;
	}	
	#gallery-wrapper li a span b {
	    padding-top: 4px;
	    font-size: 14px;
	    line-height: 20px;
	    display: block;
	    font-weight: bold;
	    font-family: "Barlow-Bold";
	}
#gallery-wrapper li a span i {
    font-size: 12px;
    line-height: 20px;
    color: #999;
    font-family: "Barlow-Regular";
    font-weight: lighter;
    display: block;
    margin-bottom: 20px;
}
.project-more {
	width: 100%; 
	margin: 0 auto;
	margin-top: 0px;
	margin-bottom: 60px;
	z-index: 9999;
	    position: relative;height: 85px;
	    background: #fff;
}
.project-more a{
	width: 100%;
	height: 85px;
}
 .project-more .project-img{
	background: #212121;
	height: 85px;
	width: 100%;
	background-size: 30px;
	margin-top: 0px;
}
 .project-more .project-img i {
	display: block;
	/*background: url(/menu_down.png) center center no-repeat;
	background-size: 30px;*/
	width: 100%;
	height: 100%;
	color: #fff;
	text-align: center;
	line-height: 85px;
	font-family: "Barlow-Bold";
	/*-webkit-animation: arrow 1600ms 400ms linear infinite;
    -moz-animation: arrow 1600ms 400ms linear infinite;
    animation: arrow 1600ms 400ms linear infinite;*/
}
 .project-more p {
	text-align: center;
    font-size: 18px;
    padding-top: 50px;
    color: #666;
}





.trans3d0 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0)
}

@-webkit-keyframes mk_scale {
	0% {
		-webkit-transform: scale(.8);
		transform: scale(.8);
		opacity: 0
	}

	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes mk_scale {
	0% {
		-webkit-transform: scale(.8);
		transform: scale(.8);
		opacity: 0
	}

	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@-webkit-keyframes mk_fade {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@keyframes mk_fade {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@-webkit-keyframes mk_left_to_right {
	0% {
		-webkit-transform: translate(-30px,0);
		transform: translate(-30px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}

@keyframes mk_left_to_right {
	0% {
		-webkit-transform: translate(-30px,0);
		transform: translate(-30px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}

@-webkit-keyframes mk_right_to_left {
	0% {
		-webkit-transform: translate(30px,0);
		transform: translate(30px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}





@keyframes mk_right_to_left {
	0% {
		-webkit-transform: translate(30px,0);
		transform: translate(30px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}

@-webkit-keyframes mk_bottom_to_top {
	0% {
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
		opacity: 0
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@keyframes mk_bottom_to_top {
	0% {
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
		opacity: 0
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@-webkit-keyframes mk_top_to_bottom {
	0% {
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px);
		opacity: 0
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@keyframes mk_top_to_bottom {
	0% {
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px);
		opacity: 0
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@-webkit-keyframes mk_thumb {
	0% {
		-webkit-transform: translate3d(0,40px,0);
		transform: translate3d(0,40px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1
	}
}

@keyframes mk_thumb {
	0% {
		-webkit-transform: translate3d(0,40px,0);
		transform: translate3d(0,40px,0);
		opacity: 0
	}

	100% {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1
	}
}

@-webkit-keyframes mk_thumb_img {
	0% {
		-webkit-transform: translate3d(0,-20px,0);
		transform: translate3d(0,-20px,0)
	}

	100% {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}
}

@keyframes mk_thumb_img {
	0% {
		-webkit-transform: translate3d(0,-20px,0);
		transform: translate3d(0,-20px,0)
	}

	100% {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}
}

 
  .cssanimations .anim_emt.visb {
	visibility: visible
}
.cssanimations .anim_emt {
	visibility: hidden
}

.cssanimations .anim_emt.visb {
	visibility: visible
}

.cssanimations .split {
	text-rendering: optimizeSpeed;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	visibility: hidden
}

.cssanimations .split.visb {
	visibility: visible
}

.cssanimations .split .spt.start {
	-webkit-transition: all 1.2s cubic-bezier(.77,0,.175,1);
	-o-transition: all 1.2s cubic-bezier(.77,0,.175,1);
	transition: all 1.2s cubic-bezier(.77,0,.175,1)
}

 


.anim_emt.start.scale_up {
	-webkit-animation: mk_scale .8s;
	animation: mk_scale .8s
}

.anim_emt.start.fade_in {
	-webkit-animation: mk_fade .8s;
	animation: mk_fade .8s
}

.anim_emt.start.t_to_b,.slide_anim_emt.start.t_to_b {
	-webkit-animation: mk_top_to_bottom .8s;
	animation: mk_top_to_bottom .8s
}

.anim_emt.start.b_to_t,.slide_anim_emt.start.b_to_t {
	-webkit-animation: mk_bottom_to_top .8s;
	animation: mk_bottom_to_top .8s
}

.anim_emt.start.thumb,.gallery-thumbs .item.anim_emt.start,.thumbs .item.anim_emt.start {
	-webkit-animation: mk_thumb 1.2s;
	animation: mk_thumb 1.2s
}

.anim_emt.start.thumb .img-wrap,.gallery-thumbs .item.anim_emt.start .img-wrap,.thumbs .item.anim_emt.start .img-wrap {
	-webkit-animation: mk_thumb_img 1.2s;
	animation: mk_thumb_img 1.2s
}


.visb {
	visibility: visible
}


@-webkit-keyframes scroll_tip_line {
	0% {
		-webkit-transform-origin: top;
		transform-origin: top;
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}

	50% {
		-webkit-transform-origin: top;
		transform-origin: top;
		-webkit-transform: scaleY(1);
		transform: scaleY(1)
	}

	51% {
		-webkit-transform-origin: bottom;
		transform-origin: bottom;
		-webkit-transform: scaleY(1);
		transform: scaleY(1)
	}

	100% {
		-webkit-transform-origin: bottom;
		transform-origin: bottom;
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}
}

@keyframes scroll_tip_line {
	0% {
		-webkit-transform-origin: top;
		transform-origin: top;
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}

	50% {
		-webkit-transform-origin: top;
		transform-origin: top;
		-webkit-transform: scaleY(1);
		transform: scaleY(1)
	}

	51% {
		-webkit-transform-origin: bottom;
		transform-origin: bottom;
		-webkit-transform: scaleY(1);
		transform: scaleY(1)
	}

	100% {
		-webkit-transform-origin: bottom;
		transform-origin: bottom;
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}
}




@-webkit-keyframes arrow {
    0% {-webkit-transform: translate(0px, -5px);opacity: .4;}
    50% {-webkit-transform: translate(0px, 5px);opacity: 1;}
    100% {-webkit-transform: translate(0px, -5px);opacity: .4;}
}
@-moz-keyframes arrow{
    0% {-moz-transform: translate(0px, -5px);opacity: .4;}
    50% {-moz-transform: translate(0px, 5px);opacity: 1;}
    100% {-moz-transform: translate(0px, -5px);opacity: .4;}
}
@keyframes arrow {
    0% {transform: translate(0px, -5px);opacity: .4;}
    50% {transform: translate(0px, 5px);opacity: 1;}
    100% {transform: translate(0px, -5px);opacity: .4;}
}    