.c-switch {
    display: inline-flex;
    align-items: center;
    background: var(--gray-100);
    border-radius: calc(var(--vw) * 4);
    padding: calc(var(--vw) * 4);
    gap: calc(var(--vw) * 4);
    height: 100%;
  }
 
  .c-switch__option {
    white-space: nowrap;
    appearance: none;
    -webkit-appearance: none;
    border: 2px solid transparent;
    background: transparent;
    border-radius: calc(var(--vw) * 4);
    padding: calc(var(--vw) * 4) calc(var(--vw) * 8);
    font-size: calc(var(--vw) * 11);
    font-weight: 700;
    color: var(--gray-600);
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
  }
 
 
  .c-switch__option.is-active {
    background: var(--white);
    border-color: var(--secondary-color);
    color: var(--black);
    box-shadow: 0px 2px 4px 0px #00000017;
  }