.slide_bottom {
	animation: slide_bottom .5s .8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.to_show {
	animation: to_show .5s .5s both;
}
.slide_top {
	animation: slide_top .5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.menu_list .item{
  animation: slide_bottom .5s  cubic-bezier(0.250, 0.460, 0.450, 0.940) both;   
}
.map{
  animation: to_show .5s  cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.detail_title{
  animation: slide_left .5s  cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.detail_swipe{
  animation: to_show .5s .2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.detail_info{
  animation: slide_bottom .5s .4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;   
}
.info_square {
  animation: slide_bottom .8s .6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.info_waitRentArea  {
  animation: slide_bottom .8s .7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.info_adress  {
  animation: slide_bottom .8s .9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.info_customize  {
  animation: slide_bottom .8s 1.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.message,.return  {
  animation: slide_bottom .8s 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@keyframes to_show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slide_bottom {
  0% {
    transform: translateY(100px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide_top {
  0% {
    transform: translateY(-100px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide_left {
  0% {
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}