.banner-scaleUpDown {
	-webkit-animation: scaleUpDown 5s ease both;
	animation: scaleUpDown 5s ease both;
}

.banner-scaleDownUp {
	-webkit-animation: scaleDownUp .5s ease both;
	animation: scaleDownUp .5s ease both;
}

@-webkit-keyframes scaleUpDown {
	from { opacity: 1; 
		-webkit-transform: scale(1.2); 
	}
}
@keyframes scaleUpDown {
	from { opacity: 1;
	 -webkit-transform: scale(1.2);
	 transform: scale(1.2); 
	}
}


/* title動畫 */
.title-in{
	-webkit-animation: title-in 4s ease both;
	animation: title-in 4s ease both;
}

@-webkit-keyframes title-in {
	from { 
		 text-shadow: rgb(0, 0, 0)0px 0px 0px;
	}
	to{
		text-shadow: rgb(0, 0, 0)-11px 4px 15px;
	}
}
@keyframes title-in {
	from { 
		 text-shadow: rgb(0, 0, 0)0px 0px 0px;
	}
	to{
		text-shadow: rgb(0, 0, 0)-11px 4px 15px;
	}
}
.fade-in-2s{
	-webkit-animation: fadein 2s ease both;
	animation: fadein 2s ease both;
}

@-webkit-keyframes fadein {
	from { 
		opacity: 0.5;
	}
	to{
		opacity: 1;
	}
}
@keyframes fadein {
	from { 
		opacity: 0.5;
	}
	to{
		opacity: 1;
	}
}

.title2-in{
	position: relative;
	-webkit-animation: title2-in 2s ease both;
	animation: title2-in 2s ease both;
	
}

@-webkit-keyframes title2-in {
	from { 
		 top: -100px;

	}
	to{
		 top: 0;
	}
}
@keyframes title2-in {
from { 
		 top: -100px;

	}
	to{
		 top: 0;
	}
}
/* 文字動畫 */
.fade-in{
	-webkit-animation: fadein 4s ease both;
	animation: fadein 4s ease both;
}

@-webkit-keyframes fadein {
	from { 
		opacity: 0.3;
	}
	to{
		opacity: 1;
	}
}
@keyframes fadein {
	from { 
		opacity: 0.3;
	}
	to{
		opacity: 1;
	}
}

/* 文章動畫 */

.left-in{
	position: relative;
    -webkit-animation: fadeInUp 1s ease both;
	animation: fadeInUp 1s ease both;
}


@-webkit-keyframes left-in {
	from { 
		left: -300px;
	}
	to{
		left: 0;
	}
}
@keyframes left-in {
	from { 
		left: -300px;
	}
	to{
		left: 0;
	}
}

.right-in{
	position: relative;
    -webkit-animation: fadeInUp 1s ease both;
	animation: fadeInUp 1s ease both;
}


@-webkit-keyframes right-in {
	from { 
		right: -300px;
	}
	to{
		right: 0;
	}
}
@keyframes right-in {
	from { 
		right: -300px;
	}
	to{
		right: 0;
	}
}

/* 聯絡我們動畫 */

.fadeinup{
	 -webkit-animation: fadeInUp 1s ease both;
	animation: fadeInUp  1s ease both;
}


@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 30%, 0);
    transform: translate3d(0, 30%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 30%, 0);
    transform: translate3d(0, 30%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}


.fadeinup2{
	 -webkit-animation: fadeInUp2 1s ease both;
	animation: fadeInUp2  1s ease both;
}


@-webkit-keyframes fadeInUp2 {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp2 {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}


.index-cervice-big-box ul li{
	 -webkit-animation: fadeInLeftBig 1s ease both;
	animation: fadeInLeftBig  1s ease both;
}

.index-cervice-big-box ul li:nth-child(even){
	-webkit-animation: fadeInRightBig 1s ease both;
	animation: fadeInRightBig  1s ease both;
}


.index-cervice-big-box ul:nth-child(even) li{
	-webkit-animation: fadeInRightBig 1s ease both;
	animation: fadeInRightBig  1s ease both;
}
.index-cervice-big-box ul:nth-child(even) li:nth-child(even){
	 -webkit-animation: fadeInLeftBig 1s ease both;
	animation: fadeInLeftBig  1s ease both;
}