// ===========================================
// Tab タブ
// ===========================================

/* tab nav
--------------------------------- */
.com-tab {
  display: flex;
  position: relative;
  &::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-bottom: 1px solid #e5e5e5;
  }
}

.com-tab-item {
  position: relative;
  z-index: 1;
  padding: 0.8em 1.5em;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: 0.3s;
  text-decoration: none;
  &:hover {
    color: map-get($colors, main);
  }
  &.is-active {
    border-bottom-color: map-get($colors, main);
    color: map-get($colors, main);
    font-weight: bold;
  }
}

/* tab content
--------------------------------- */
.com-tab-content {
  display: none;
  &.is-active {
    display: block;
  }
}