

/*上往下速刷入(慢)*/
.animate_Down,.wow{-webkit-animation:fadeInDown 2s  ease both;
	animation:fadeInDown 2s  ease both;
}


/*下往上速刷入(慢)*/
.animate_Up{-webkit-animation:fadeInUp  2s  ease both;
animation:fadeInUp  2s  ease both;}


/*左邊刷入(慢)*/
.animate_Left,.index_smartbaby div div,.index_3 figure img,.index_3_pc img{-webkit-animation:bounceInLeft  2s  ease both;
animation:bounceInLeft  2s  ease both;}


/*右邊刷入(慢)*/
.animate_Right,.index_4 figure img{-webkit-animation:bounceInRight  2s  ease both;
animation:bounceInRight  2s  ease both;}

/*首頁動態*/
.icon_go,.icon_go2,.icon_go_m,.icon_go2_m{-webkit-animation: icon 1s infinite;
animation: icon 1s infinite;
	}

.icon_go,.icon_go2,.icon_go_m,.icon_go2_m{ position:absolute;  left:50%; margin-left:-25px; text-align:center}
@media (max-width: 800px){
	
	.index_4 figure img,.index_3 figure img{-webkit-animation:fadeInUp  2s  ease both;
animation:fadeInUp  2s  ease both;}
}
@media (max-width: 414px){
.icon_go,.icon_go2,.icon_go_m,.icon_go2_m{-webkit-animation: icon_m 1s infinite;
animation: icon_m 1s infinite;
	}	
}
@-webkit-keyframes icon{
0%{bottom:30px;}
50%{bottom:40px;}
100%{bottom:30px;}

}
@keyframes icon{
0%{bottom:30px;}
50%{bottom:40px;}
100%{bottom:30px;}
}

@-webkit-keyframes icon_m{
0%{bottom:20px;}
50%{bottom:30px;}
100%{bottom:20px;}

}
@keyframes icon{
0%{bottom:20px;}
50%{bottom:30px;}
100%{bottom:20px;}
}
.index_smartbaby div div:nth-of-type(1){animation-delay:0s;-webkit-animation-delay:0s;}
.index_smartbaby div div:nth-of-type(2){animation-delay:.5s;-webkit-animation-delay:.5s;}
.index_smartbaby div div:nth-of-type(3){animation-delay:1s;-webkit-animation-delay:1s;}
.index_smartbaby div div:nth-of-type(4){animation-delay:1.5s;-webkit-animation-delay:1.5s;}
.index_smartbaby div div:nth-of-type(5){animation-delay:2s;-webkit-animation-delay:2s;}
.index_smartbaby div div:nth-of-type(6){animation-delay:2.5s;-webkit-animation-delay:2.5s;}


.index_3,.index_3_pc{ background-color:#fee4a7}
.kv_pc1,.index_kv5,.kv_2 span{position: relative;}
.kv0{position: absolute; bottom: 0px; left: 0px;width: 100%; z-index:7}
.kv_2 span{ z-index: -1}
.kv_pc1>div,.index_kv5_1,.index_kv5_2,.index_kv5_3,.index_kv2 figure{position: absolute; bottom: 0px; left: 0px;width: 100%;}
.kv_pc1_3 figure{position: absolute; left: 0px;width: 100%;}
.kv_pc1 img,.index_kv5_1 img,.index_kv5_2 img,.index_kv5_3 img,.index_kv2 img{display: block}
.kv_pc1_1,.kv_pc1_2,.kv_pc1_3,.index_kv2_3,.index_kv2_4,.index_kv2_5,.index_kv2_6{z-index: 2}
.kv_pc1_4{z-index: 3}
.kv_pc1_5,.index_kv2_2{z-index: 1}
.kv_pc1 div.kv_pc1_3{ left:-3%}

@media (max-width: 800px) {
	.kv_pc1 .kv_pc1_3{ top:-10px;}
	.kv_pc1 div.kv_pc1_3{ left:0px}
	 }

.kv_pc1_5,.index_kv2_2{
-webkit-animation:kv_pc1_5 4s infinite;
animation:kv_pc1_5 4s infinite;}

@keyframes kv_pc1_5 {

  0% {opacity: 0;}
  50%{opacity: 1;}
  100%{opacity: 0;}

}

@-webkit-keyframes kv_pc1_5 {

  0% {opacity: 0;}
  50%{opacity: 1;}
  100%{opacity: 0;}

}

.index_kv2,.index_kv2 span{ overflow:hidden;position: relative;
display: block;
}

.index_kv2 figure{
	background-repeat: no-repeat;
	background-position: center top;
	background-size:100%;
}
.index_kv2_3{
	-webkit-animation: index_kv2_3 6s infinite;
    animation: index_kv2_3 6s infinite;
	/*background-image: url(images/2018_img/index_2_3.png);*/
}

@-webkit-keyframes index_kv2_3{
0%{top: 0px;-webkit-transform : scale(1.1);}
50%{top: 20px;-webkit-transform : scale(1);}
100%{top: 0px;-webkit-transform : scale(1.1);}

}
@keyframes index_kv2_3{
0%{top: 0px;transform : scale(1.1);}
50%{top: 20px;transform : scale(1);}
100%{top: 0px;transform : scale(1.1);}

}


.index_kv2_4{
	-webkit-animation: index_kv2_4 8s infinite;
    animation: index_kv2_4 8s infinite;
	/*background-image: url(images/2018_img/index_2_4.png);*/
}

@-webkit-keyframes index_kv2_4{
0%{top: 0px;-webkit-transform : scale(1);}
50%{top: 30px;-webkit-transform : scale(1.1);}
100%{top: 0px;-webkit-transform : scale(1);}

}
@keyframes index_kv2_4{
0%{top: 0px;transform : scale(1);}
50%{top: 30px;transform : scale(1.1);}
100%{top: 0px;transform : scale(1);}
}

.index_kv2_5{
	-webkit-animation: index_kv2_5 8s infinite;
    animation: index_kv2_5 8s infinite;
	/*background-image: url(images/2018_img/index_2_5.png);*/
}

@-webkit-keyframes index_kv2_5{
0%{top: 0px;-webkit-transform : scale(1.1);}
50%{top: -30px;-webkit-transform : scale(1);}
100%{top: 0px;-webkit-transform : scale(1.1);}

}
@keyframes index_kv2_5{
0%{top: 0px;transform : scale(1.1);}
50%{top: -30px;transform : scale(1);}
100%{top: 0px;transform : scale(1.1);}
}

.index_kv2_6{
	-webkit-animation: index_kv2_6 6s infinite;
    animation: index_kv2_6 6s infinite;
/*	background-image: url(images/2018_img/index_2_6.png);*/
}
@-webkit-keyframes index_kv2_6{
0%{top: 0px;-webkit-transform : scale(1); }
50%{top: -20px;-webkit-transform : scale(1.1);}
100%{top: 0px;-webkit-transform : scale(1);}

}
@keyframes index_kv2_6{
0%{top: 0px;transform : scale(1); }
50%{top: -20px;transform : scale(1.1);}
100%{top: 0px;transform : scale(1);}
}



.kv_pc1_3 span
{
	-webkit-animation: kv_pc1_3 5s infinite;
    animation: kv_pc1_3 5s infinite;
	background-size:100%;
	width:100%;
	display:block;
	position:relative;}


@-webkit-keyframes kv_pc1_3{
0%{top: 0px;}
50%{top: 15px;}
100%{top: 0px;}

}
@keyframes kv_pc1_3{
0%{top: 0px;}
50%{top: 15px;}
100%{top: 0px;}
}



.index_kv5_1{
-webkit-animation:index_kv5_1 15s infinite;
animation:index_kv5_1 15s infinite;}

@keyframes index_kv5 {

  0% {opacity: 0;}
  5%{opacity: 1;}
  30%{opacity: 1;}
  35%{opacity: 0;}
  100%{opacity: 0;}

}

@-webkit-keyframes index_kv5 {

  0% {opacity: 0;}
  5%{opacity: 1;}
  30%{opacity: 1;}
  35%{opacity: 0;}
  100%{opacity: 0;}

}

.index_kv5_2{
	-webkit-animation:index_kv5_2 15s infinite;
animation:index_kv5_2 15s infinite;
	}


@keyframes index_kv5_2 {

  0% {opacity: 0;}
  30% {opacity: 0;}
  35%{opacity: 1;}
  60%{opacity: 1;}
  65%{opacity: 0;}
  100%{opacity: 0;}

}

@-webkit-keyframes index_kv5_2 {

  0% {opacity: 0;}
  30% {opacity: 0;}
  35%{opacity: 1;}
  60%{opacity: 1;}
  65%{opacity: 0;}
  100%{opacity: 0;}

}
.index_kv5_3{
	-webkit-animation:index_kv5_3 15s infinite;
animation:index_kv5_3 15s infinite;
	}


@keyframes index_kv5_3 {

  0% {opacity: 0;}
  60% {opacity: 0;}
  65%{opacity: 1;}
  95%{opacity: 1;}
  100%{opacity: 0;}

}

@-webkit-keyframes index_kv5_3 {

  0% {opacity: 0;}
  60% {opacity: 0;}
  65%{opacity: 1;}
  95%{opacity: 1;}
  100%{opacity: 0;}

}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}



@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}


@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}


@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}



