@charset "UTF-8";
/* -----------------------------------------------
gift-nav
----------------------------------------------- */
.gift-nav {
  margin: 50px 0;
  display: flex;
  gap: 10px;
}
.gift-nav a {
  width: calc((100% - 10px * 2) / 3);
  background: #F5F5F5;
  padding: 16px;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  position: relative;
}
.gift-nav a.active {
  background: #B49266;
  color: #fff;
}
.gift-nav a.active::after {
  content: "";
  display: block;
  width: 20px;
  height: 15px;
  background: #B49266;
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
  position: absolute;
  left: calc(50% - 10px);
  bottom: -14px;
}

@media (max-width: 767px) {
  .gift-nav {
    margin: 20px -5.335%;
  }
  .gift-nav a {
    padding: 8px 0;
    font-size: 12px;
  }
  .gift-nav a.active::after {
    width: 10px;
    height: 8px;
    left: calc(50% - 5px);
    bottom: -7px;
  }
}