@charset "UTF-8";
.contact {
  background: #161615;
  padding-bottom: calc(10vw + 10px);
  position: relative;
  overflow: hidden;
}

.contact::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  border-bottom: 10vw solid #222220;
  border-right: 100vw solid transparent;
}

.contact__title {
  position: relative;
}

.contact__title::before {
  content: "";
  z-index: -1;
  bottom: 2rem;
  border-right: 50px solid transparent;
  border-bottom: 86.6025px solid #7E5F18;
  border-left: 50px solid transparent;
}

.contact__container {
  text-align: center;
}

.contact__container .contact__mail {
  margin-top: 40px;
  font-size: 1.7rem;
  font-weight: bold;
}

.contact__container .contact__mail p {
  margin-top: 40px;
  font-size: 0.8rem;
}

.base-btn {
  background: #7E5F18;
  /* 背景色 */
  padding: 4px 16px;
  /* 背景の余白（タテ：ヨコ） */
  font-size: 1.6rem;
  /* 文字サイズ */
  border-radius: 25px;
  /* 角の丸まり具合（０だと四角形） */
  color: #f4f4f4;
  /* 文字の色 */
  display: inline-block;
  text-decoration: none;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.base-btn:hover {
  /* マウスを乗せたときにフワッと半透明にする */
  opacity: .7;
}