.tabBar {
  position: fixed;
  top: 4%;
  right: 4%;
  width: 40%;
  height: 50px;
  :global {
    .tabBarBox {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      gap: 3%;
      .tabItem {
        width: 30%;
        font-size: 18px;
        font-weight: 500;
        color: #fff;
        cursor: pointer;
      }
    }
    .underline {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 25%;
      height: 4px;
      background-color: #fff;
      transition: transform 0.3s ease-in-out;
    }
  }
}

@media screen and (max-width: 768px) {
  .tabBar {
    width: 90%;
    :global {
      .tabBarBox {
        .tabItem {
          font-size: 15px;
          width: 33%;
        }
      }
    }
  }
}
