.paypay {
  &-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: fade_out(black, 0.5);
    z-index: 10;
  }
  &-modal {
    position: absolute;
    bottom: 0;
    z-index: 10;
    width: 100%;
    min-height: 150px;
    // height: 50%;
    background-color: $white;
    border-radius: 20px 20px 0px 0px;
  }
}

.test-modal-enter .paypay-modal {
  transform: translateX(-100%);
}
.test-modal-enter-active .paypay-modal {
  transition: transform 500ms;
  transform: translateX(0);
}
.test-modal-exit .paypay-modal {
  transform: translateX(0);
}
.test-modal-exit-active .paypay-modal {
  transition: transform 500ms;
  transform: translateX(-100%);
}