.main{overflow:hidden;}
.animation_left{position: relative;display:inline-block;opacity:0; animation:move 1.5s forwards; animation-play-state:paused;}
.animation_right{position:relative;display:inline-block;opacity:0; animation:rmove 1.5s forwards; animation-play-state:paused;}

.a_product_l{position: relative;display:inline-block;opacity:0; animation:move 1.5s forwards; animation-play-state:paused;float:left;margin-right:-21%;margin-top:1.4%;width:80.8%;}
.a_product_r{position:relative;display:inline-block;opacity:0; animation:rmove 1.5s forwards; animation-play-state:paused;float:left;width:40%;}

.back.animation_left{ opacity:1; animation:back 1s forwards; }
.move.animation_left{ animation-play-state:running;}
@keyframes move{
  from{ opacity:0; left:-200px;}
  to{ opacity:1;left:0;}
}
@keyframes back{
  from{ opacity:1;left:0;}
  to{ opacity:0;left:-200px;}
}
.back.animation_right{ opacity:1; animation:rback 1s forwards; }
.move.animation_right{ animation-play-state:running;}
@keyframes rmove{
  from{ opacity:0; right:-200px;}
  to{ opacity:1;right:0;}
}
@keyframes rback{
  from{ opacity:1;right:0;}
  to{ opacity:0;right:-200px;}
}