戻る
#0101001 タップでプレビュー
<button class="c-btnPush"><span>PUSH!!</span></button>
.c-btnPush {
  display: block;
  max-width: 160px;
  width: 100%;
  padding: 8px 16px;
  background-color: #fff;
  border-radius: 100px;
  text-align: center;
  box-shadow: #ccc 0px 4px 0px;
  transition: 0.5s ease;
  color: #000;
}

.c-btnPush:hover {
  box-shadow: #ccc 0px 0px 0px;
  transform: translateY(4px);
}

.c-btnPush span {
  /* 文字を少し歪ませる */
  transform: scaleY(0.95);
}
.c {
  &-btnPush {
    display: block;
    max-width: 160px;
    width: 100%;
    padding: 8px 16px;
    background-color: #fff;
    border-radius: 100px;
    text-align: center;
    box-shadow: #ccc 0px 4px 0px;
    transition: 0.5s ease;
    color: #000;

    &:hover {
      box-shadow: #ccc 0px 0px 0px;
      transform: translateY(4px);
    }

    span {
      // 任意 文字を少し歪ませる
      transform: scaleY(0.9);
    }
  }
}
p