@font-face {
  font-family: "Noto Sans JP Bold";
  src: url("../fonts/NotoSansJP-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Noto Sans JP Medium";
  src: url("../fonts/NotoSansJP-Medium.ttf") format("truetype");
}
@font-face {
  font-family: "Noto Sans JP Regular";
  src: url("../fonts/NotoSansJP-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "M Plus 1c";
  src: url("../fonts/MPLUSRounded1c-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Oswald";
  src: url("../fonts/Oswald-VariableFont_wght.ttf") format("truetype");
}
/*--------------------
vip
--------------------*/
.vip_title {
  color: transparent;
  font-size: 65px;
  -webkit-text-stroke: #feeb00 1px;
  background-image: url("../../assets/img/VIP/vip_top_background.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: 120px;
  padding-bottom: 145px;
  padding-top: 158px;
  position: relative;
  text-align: center;
  z-index: 10;
}

.tab_layout {
  justify-content: center;
  gap: 14px;
  margin-bottom: 58px;
  margin-top: 115px;
}

.tab-button {
  background-color: transparent;
  border: 1px solid #ffffff;
  border-radius: 5px;
  color: #ffffff;
  cursor: pointer;
  font-size: 22px;
  max-width: 240px;
  width: 100%;
  padding: 10px 0;
  text-align: center;
  transition: background-color 0.3s ease;
}

.tab-button.active {
  background-color: #1e90ff;
  color: #030319;
}

.tab-contents {
  margin-bottom: 90px;
}

.tab-content {
  display: none;
  text-align: center;
  color: #ffffff;
}

.tab-content.active {
  display: block;
}

.platinum.active {
  background-color: #2cb7ec;
  border: 1px solid #2cb7ec;
}

.gold.active {
  background-color: #e0d521;
  border: 1px solid #e0d521;
}

.silver.active {
  background-color: #ffffff;
  border: 1px solid #ffffff;
}

.royal.active {
  background-color: #f39801;
  border: 1px solid #f39801;
}

.vip_img {
  display: block;
  margin: 0 auto;
  max-width: 1000px;
  width: 100%;
}

.vip_img:first-of-type {
  margin-bottom: 50px;
}

@media (max-width: 500px) {
  .vip_title {
    font-size: 42px;
    margin-top: 0px;
    padding-bottom: 60px;
    padding-top: 60px;
  }
  .tab_layout {
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 26px;
    margin-top: 37px;
  }
  .tab-button {
    font-size: 18px;
    max-width: 170px;
    padding: 6px 0;
    width: 50%;
  }
  .tab-contents {
    margin-bottom: 28px;
  }
  .vip_img:first-of-type {
    margin-bottom: 17px;
  }
}

/*# sourceMappingURL=vip.css.map */