/*ボタンベース*/
.btnBase {
   position:relative;
}
.btnBase .wp-block-button__link{
    display: block;
    position: relative;
    z-index: 0;
    margin: 0 auto;
    padding:0;
    line-height: 3.8;
    width: 300px;
    height: 60px;
    color: #FFF;
    letter-spacing: 0.2em;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    transition: 0.3s;
    text-align: center;
}
.btnBase::before {
    content:"";
    width: 310px;
    height: 69px;
    display: inline-block;
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-48%);
}
.btnBase .wp-block-button__link::before {
  content:"";
  display:inline-block;
  width:30px;
  height:8px;
  border-bottom:solid 1px #fff;
  position: absolute;
  top: 45%;
  right: 25px;
}
.btnBase .wp-block-button__link::after {
  content:"";
  display:inline-block;
  width:30px;
  height:10px;
  border-right:solid 1px #fff;
  position: absolute;
  top: 44%;
  right: 28px;
  transform: rotate(-40deg);
  transform-origin: right;
}
.btnBase::after {
    content:"";
    width: 308px;
    height: 69px;
    display: inline-block;
    position: absolute;
    z-index:-1;
    top: 0;
    left: 50%;
    transform: translateX(-52%);
}
.btnBase .wp-block-button__link:hover {
   background-color:transparent ;
}

@media only screen and (max-width: 576px){
  .btnBase .wp-block-button__link{
    width: 280px;
    height: 60px;
  }
  .btnBase::after {
    width: 290px;
  }
  .btnBase::before {
    width: 290px;
  }
}

/*赤いボタン*/
.btnRed .wp-block-button__link {
   background: #ba2636;
}
.btnRed::before {
    border: solid 1px #ba2636;
}
.btnRed::after {
    border: solid 1px #ba2636;
}
.btnRed .wp-block-button__link:hover {
   color: #ba2636;
}
.btnRed .wp-block-button__link:hover::before{
  border-bottom: solid 1px #ba2636;
}
.btnRed .wp-block-button__link:hover::after {
   border-right: solid 1px #ba2636;
}


/*茶色のボタン*/
.btnBrown .wp-block-button__link  {
    background-color:#664c00;
}
.btnBrown::before {
    border: solid 1px #664c00;
}
.btnBrown::after {
    border: solid 1px #664c00;
}

.btnBrown .wp-block-button__link:hover {
   color: #664c00;
}

.btnBrown .wp-block-button__link:hover::before{
  border-bottom: solid 1px #664c00;
}
.btnBrown .wp-block-button__link:hover::after {
   border-right: solid 1px #664c00;
}