<div class="wrap">
  <div class="circle"></div>
</div>

.wrap {
  overflow: hidden;
  position: relative;
  width: 200px;
  min-height: 150px;
  border: 1px solid #e8e8e8;
}

.circle {
  width: 150px;
  height: 150px;
  background: yellow;
  border-radius: 100%;
  transition: 0.4s;
  position: absolute;
  bottom: -150px;
  left: 50%;
  transform: translateX(-50%);
}

.wrap:hover .circle {
  bottom: -75px;
  transform: translateX(-50%) scale(1.3);
}