@import url(https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;600&display=swap);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i&display=swap);
@font-face {
  font-family: "MKGAA";
  src: url(/fonts/Mkgaa-Regular.woff2?d7edb1c986b3a45551caa81bf45496af);
}
#app {
  padding-bottom: 80px;
}

.fa {
  color: #2DBECD;
}

.catsub1 i {
  color: #000000;
  transition: 0.2s ease-in-out;
}
.catsub1:hover i {
  color: #2DBECD;
}

#breadcrumb {
  margin-top: 20px;
}
#breadcrumb i.fa {
  margin-left: 10px;
  margin-right: 10px;
  font-size: 10px;
}

.productnavigate {
  margin-top: 0;
  border-bottom: 2px solid white;
}

.productbox {
  padding-top: 40px;
}
.productbox a {
  text-decoration: none;
}
.productbox .btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 10px 14px;
  border-radius: 20px;
}
.productbox .btn .stockcode,
.productbox .btn .brand {
  font-weight: 500;
}

.menushare {
  display: inline-flex;
  position: relative;
  min-width: 200px;
}
.menushare a:nth-child(2),
.menushare a:nth-child(3),
.menushare a:nth-child(4) {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(0);
  transition: 0.2s ease-in-out;
}
.menushare a:nth-child(1) {
  position: relative;
  z-index: 100;
}
.menushare.active a:nth-child(2) {
  left: 52px;
}
.menushare.active a:nth-child(3) {
  left: 104px;
}
.menushare.active a:nth-child(4) {
  left: 156px;
}
