@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100..900&display=swap");
:root {
  --color-primary: #006738;
  --color-primary-light: #dcf0de;
  --color-secondary: #cb9c24;
  --color-secondary-light: #f9f0db;
  --color-secondary-dark: #957523;
  --color-success: #28a745;
  --color-info: #17a2b8;
  --color-warning: #ffc107;
  --color-danger: #c61429;
  --color-gray: #6c757d;
  --color-gray-100: #acb5bd;
  --color-gray-150: #eaecee;
  --color-gray-200: #f8f9fa;
  --color-light: #fff;
  --color-dark: #2b2b2b;
  --color-black: #000000;
  --color-default: #2b2b2b;
  --color-border: #eaecee;
  --fw-extra-light: 400;
  --fw-light: 400;
  --fw-normal: 400;
  --fw-medium: 600;
  --fw-bold: 700;
  --typo-xs: 12px;
  --typo-sm: 14px;
  --typo-md: 16px;
  --typo-lg: 18px;
  --typo-xl: 20px;
  --typo-xxl: 22px;
  --typo-default: 14px;
  --typo-biggest: 30px;
  --font-family-1: "Noto Serif Display", serif;
  --font-family-2: "Brush Script MT", cursive;
  --box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.15);
  --max-app-width: 640px;
}

.text-primary {
  color: var(--color-primary) !important;
}

.text-secondary {
  color: var(--color-secondary) !important;
}

.text-secondary-dark {
  color: var(--color-secondary-dark) !important;
}

.text-success {
  color: var(--color-success) !important;
}

.text-info {
  color: var(--color-info) !important;
}

.text-warning {
  color: var(--color-warning) !important;
}

.text-danger {
  color: var(--color-danger) !important;
}

.text-gray {
  color: var(--color-gray) !important;
}

.text-gray-100 {
  color: var(--color-gray-100) !important;
}

.text-light {
  color: var(--color-light) !important;
}

.text-dark {
  color: var(--color-dark) !important;
}

.text-default {
  color: var(--color-default) !important;
}

.text-border {
  color: var(--color-border) !important;
}

.fw-light {
  font-weight: var(--fw-light) !important;
}

.fw-normal {
  font-weight: var(--fw-normal) !important;
}

.fw-medium {
  font-weight: var(--fw-medium) !important;
}

.fw-bold {
  font-weight: var(--fw-bold) !important;
}

.typo-xs {
  font-size: var(--typo-xs);
}

.typo-sm {
  font-size: var(--typo-sm);
}

.typo-md {
  font-size: var(--typo-md);
}

.typo-lg {
  font-size: var(--typo-lg);
}

.typo-xl {
  font-size: var(--typo-xl);
}

.typo-xxl {
  font-size: var(--typo-xxl);
}

.typo-biggest {
  font-size: var(--typo-biggest);
}

.typo-default {
  font-size: var(--typo-default);
}

.bg-primary {
  background-color: var(--color-primary) !important;
}

.bg-primary-light {
  background-color: var(--color-primary-light) !important;
}

.bg-light {
  background-color: var(--color-light) !important;
}

.bg-gray-light {
  background-color: var(--color-gray-200) !important;
}

.bg-secondary {
  background-color: var(--color-secondary) !important;
}

.bg-secondary-light {
  background-color: var(--color-secondary-light) !important;
}

.bg-secondary-dark {
  background-color: var(--color-secondary-dark) !important;
}

.bg-graphic {
  background-image: url(../img/background/bg-graphic.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 180px;
}

.card-styled, .formula-item .card, .noti-list .card, .my-address .card, .redeem-item .card, .stock-total-box .card, .no-coupon .card, .order-product-list .card, .order-history-page .order-list .card, .product-credit-item .card, .credit-block .card, .profile-block .card, .wg-overview .card, .coupon-list .card, .bank-info .card, .product-item .card {
  border-radius: unset;
  border: none;
  -webkit-box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
}

html,
body {
  height: 100%;
}

body {
  font-family: "Noto Sans Thai", sans-serif;
  background-color: #fff;
  line-height: 1.2em;
  word-break: break-word;
  color: var(--color-default);
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.container {
  width: 1210px;
}

.gutters-5 {
  margin: 0 -2.5px;
}
.gutters-5 > div {
  padding: 0 2.5px;
}

.gutters-10 {
  margin: 0 -5px;
}
.gutters-10 > div {
  padding: 0 5px;
}

.gutters-15 {
  margin: 0 -7.5px;
}
.gutters-15 > div {
  padding: 0 7.5px;
}

.gutters-20 {
  margin: 0 -10px;
}
.gutters-20 > div {
  padding: 0 10px;
}

.gutters-30 {
  margin: 0 -15px;
}
.gutters-30 > div {
  padding: 0 15px;
}

.gutters-35 {
  margin: 0 -17.5px;
}
.gutters-35 > div {
  padding: 0 17.5px;
}

.gutters-40 {
  margin: 0 -20px;
}
.gutters-40 > div {
  padding: 0 20px;
}

.gutters-50 {
  margin: 0 -25px;
}
.gutters-50 > div {
  padding: 0 25px;
}

.gutters-60 {
  margin: 0 -30px;
}
.gutters-60 > div {
  padding: 0 30px;
}

@media (min-width: 576px) {
  .gutters-sm-35 {
    margin: 0 -17.5px;
  }
  .gutters-sm-35 > div {
    padding: 0 17.5px;
  }
}
@media (min-width: 992px) {
  .gutters-lg-30 {
    margin: 0 -15px;
  }
  .gutters-lg-30 > div {
    padding: 0 15px;
  }
  .gutters-lg-40 {
    margin: 0 -20px;
  }
  .gutters-lg-40 > div {
    padding: 0 20px;
  }
  .gutters-lg-50 {
    margin: 0 -25px;
  }
  .gutters-lg-50 > div {
    padding: 0 25px;
  }
  .gutters-lg-60 {
    margin: 0 -30px;
  }
  .gutters-lg-60 > div {
    padding: 0 30px;
  }
}
img {
  max-width: 100%;
}

.icon {
  position: relative;
}
.icon > img {
  display: block;
}

.btn,
.link {
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

.link:focus,
.link:hover {
  text-decoration: none;
}

a:focus {
  outline: none;
}

input,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.item-list {
  margin: 0;
  padding: 0;
}
.item-list > li {
  list-style: none;
  float: left;
}
.item-list.fluid > li {
  width: 100%;
}
.item-list:before, .item-list:after {
  content: " ";
  display: table;
}
.item-list:after {
  clear: both;
}
.item-list.bullet-list > li {
  position: relative;
  padding-left: 1rem;
}
.item-list.bullet-list > li::before {
  position: absolute;
  content: "";
  top: 0.5em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--color-primary);
}

.nav-list {
  margin: 0;
  padding: 0;
}
.nav-list > li {
  list-style: none;
  float: left;
}
.nav-list.fluid > li {
  width: 100%;
}

.nav-list:before,
.nav-list:after {
  content: " ";
  display: table;
}

.nav-list:after {
  clear: both;
}

.icon img {
  display: block;
}

.cover {
  position: relative;
  overflow: hidden;
  margin: 0;
}
.cover .img-cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.vdo-cover {
  position: relative;
  overflow: hidden;
  margin: 0;
}
.vdo-cover .vdo-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  text-align: center;
}
.vdo-cover .vdo-wrapper video {
  width: 100%;
  height: 100%;
}

.h-title {
  margin: 0;
}

.title {
  margin: 0;
}

.subtitle {
  margin: 0;
}

.desc {
  margin: 0;
  line-height: 1.2em;
}

.text-limit {
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-height: 1.4em;
  max-height: 1.4em;
  -webkit-line-clamp: 1;
}
.text-limit.-x2 {
  max-height: 2.8em;
  -webkit-line-clamp: 2;
}

.transition-speed {
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
}

.transition-delay {
  -webkit-transition-delay: 100ms;
          transition-delay: 100ms;
}

figure.cover {
  position: relative;
  overflow: hidden;
  margin: 0;
}
figure.cover img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
figure.contain {
  position: relative;
  overflow: hidden;
  margin: 0;
}
figure.contain img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
}

.hidden {
  display: none;
  visibility: hidden;
}

.app-width {
  position: relative;
  max-width: var(--max-app-width) !important;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.prevent-select {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  -moz-user-select: none;
       user-select: none; /* Standard syntax */
}

.grid-divider {
  position: relative;
}

.grid-divider > [class*=col]:nth-child(n+2):after {
  content: "";
  background-color: #eaecee;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  height: auto;
  left: -1px;
}

.divider {
  border-top-color: #eaecee;
}
.divider.-x2 {
  border-top-color: #f8f9fa;
  border-width: 4px;
}

.icon > span[class*=material-symbols] {
  position: relative;
  top: 2px;
  font-weight: 300;
}

.scroll-wrapper {
  padding-right: 1rem;
  margin-right: -1rem;
  padding-bottom: 3rem;
  overflow: scroll;
}

@media (min-width: 376px) {
  .flex-xs-row {
    -ms-flex-direction: row !important;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
            flex-direction: row !important;
  }
}
.opacity-0 {
  opacity: 0 !important;
}

.opacity-25 {
  opacity: 0.25 !important;
}

.opacity-50 {
  opacity: 0.5 !important;
}

.opacity-75 {
  opacity: 0.75 !important;
}

.opacity-100 {
  opacity: 1 !important;
}

.right-align {
  float: right;
  text-align: right;
}

.left-align {
  float: left;
  text-align: left;
}

[data-aos][data-aos][data-aos-duration="50"], body[data-aos-duration="50"] [data-aos] {
  -webkit-transition-duration: 50ms;
          transition-duration: 50ms;
}

[data-aos][data-aos][data-aos-delay="50"], body[data-aos-delay="50"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="50"].aos-animate, body[data-aos-delay="50"] [data-aos].aos-animate {
  -webkit-transition-delay: 50ms;
          transition-delay: 50ms;
}

[data-aos][data-aos][data-aos-duration="100"], body[data-aos-duration="100"] [data-aos] {
  -webkit-transition-duration: 0.1s;
          transition-duration: 0.1s;
}

[data-aos][data-aos][data-aos-delay="100"], body[data-aos-delay="100"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="100"].aos-animate, body[data-aos-delay="100"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}

[data-aos][data-aos][data-aos-duration="150"], body[data-aos-duration="150"] [data-aos] {
  -webkit-transition-duration: 0.15s;
          transition-duration: 0.15s;
}

[data-aos][data-aos][data-aos-delay="150"], body[data-aos-delay="150"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="150"].aos-animate, body[data-aos-delay="150"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.15s;
          transition-delay: 0.15s;
}

[data-aos][data-aos][data-aos-duration="200"], body[data-aos-duration="200"] [data-aos] {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

[data-aos][data-aos][data-aos-delay="200"], body[data-aos-delay="200"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="200"].aos-animate, body[data-aos-delay="200"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

[data-aos][data-aos][data-aos-duration="250"], body[data-aos-duration="250"] [data-aos] {
  -webkit-transition-duration: 0.25s;
          transition-duration: 0.25s;
}

[data-aos][data-aos][data-aos-delay="250"], body[data-aos-delay="250"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="250"].aos-animate, body[data-aos-delay="250"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.25s;
          transition-delay: 0.25s;
}

[data-aos][data-aos][data-aos-duration="300"], body[data-aos-duration="300"] [data-aos] {
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
}

[data-aos][data-aos][data-aos-delay="300"], body[data-aos-delay="300"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="300"].aos-animate, body[data-aos-delay="300"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

[data-aos][data-aos][data-aos-duration="350"], body[data-aos-duration="350"] [data-aos] {
  -webkit-transition-duration: 0.35s;
          transition-duration: 0.35s;
}

[data-aos][data-aos][data-aos-delay="350"], body[data-aos-delay="350"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="350"].aos-animate, body[data-aos-delay="350"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.35s;
          transition-delay: 0.35s;
}

[data-aos][data-aos][data-aos-duration="400"], body[data-aos-duration="400"] [data-aos] {
  -webkit-transition-duration: 0.4s;
          transition-duration: 0.4s;
}

[data-aos][data-aos][data-aos-delay="400"], body[data-aos-delay="400"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="400"].aos-animate, body[data-aos-delay="400"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

[data-aos][data-aos][data-aos-duration="450"], body[data-aos-duration="450"] [data-aos] {
  -webkit-transition-duration: 0.45s;
          transition-duration: 0.45s;
}

[data-aos][data-aos][data-aos-delay="450"], body[data-aos-delay="450"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="450"].aos-animate, body[data-aos-delay="450"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.45s;
          transition-delay: 0.45s;
}

[data-aos][data-aos][data-aos-duration="500"], body[data-aos-duration="500"] [data-aos] {
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
}

[data-aos][data-aos][data-aos-delay="500"], body[data-aos-delay="500"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="500"].aos-animate, body[data-aos-delay="500"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}

[data-aos][data-aos][data-aos-duration="550"], body[data-aos-duration="550"] [data-aos] {
  -webkit-transition-duration: 0.55s;
          transition-duration: 0.55s;
}

[data-aos][data-aos][data-aos-delay="550"], body[data-aos-delay="550"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="550"].aos-animate, body[data-aos-delay="550"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.55s;
          transition-delay: 0.55s;
}

[data-aos][data-aos][data-aos-duration="600"], body[data-aos-duration="600"] [data-aos] {
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
}

[data-aos][data-aos][data-aos-delay="600"], body[data-aos-delay="600"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="600"].aos-animate, body[data-aos-delay="600"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

[data-aos][data-aos][data-aos-duration="650"], body[data-aos-duration="650"] [data-aos] {
  -webkit-transition-duration: 0.65s;
          transition-duration: 0.65s;
}

[data-aos][data-aos][data-aos-delay="650"], body[data-aos-delay="650"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="650"].aos-animate, body[data-aos-delay="650"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.65s;
          transition-delay: 0.65s;
}

[data-aos][data-aos][data-aos-duration="700"], body[data-aos-duration="700"] [data-aos] {
  -webkit-transition-duration: 0.7s;
          transition-duration: 0.7s;
}

[data-aos][data-aos][data-aos-delay="700"], body[data-aos-delay="700"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="700"].aos-animate, body[data-aos-delay="700"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

[data-aos][data-aos][data-aos-duration="750"], body[data-aos-duration="750"] [data-aos] {
  -webkit-transition-duration: 0.75s;
          transition-duration: 0.75s;
}

[data-aos][data-aos][data-aos-delay="750"], body[data-aos-delay="750"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="750"].aos-animate, body[data-aos-delay="750"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.75s;
          transition-delay: 0.75s;
}

[data-aos][data-aos][data-aos-duration="800"], body[data-aos-duration="800"] [data-aos] {
  -webkit-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

[data-aos][data-aos][data-aos-delay="800"], body[data-aos-delay="800"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="800"].aos-animate, body[data-aos-delay="800"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}

[data-aos][data-aos][data-aos-duration="850"], body[data-aos-duration="850"] [data-aos] {
  -webkit-transition-duration: 0.85s;
          transition-duration: 0.85s;
}

[data-aos][data-aos][data-aos-delay="850"], body[data-aos-delay="850"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="850"].aos-animate, body[data-aos-delay="850"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.85s;
          transition-delay: 0.85s;
}

[data-aos][data-aos][data-aos-duration="900"], body[data-aos-duration="900"] [data-aos] {
  -webkit-transition-duration: 0.9s;
          transition-duration: 0.9s;
}

[data-aos][data-aos][data-aos-delay="900"], body[data-aos-delay="900"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="900"].aos-animate, body[data-aos-delay="900"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}

[data-aos][data-aos][data-aos-duration="950"], body[data-aos-duration="950"] [data-aos] {
  -webkit-transition-duration: 0.95s;
          transition-duration: 0.95s;
}

[data-aos][data-aos][data-aos-delay="950"], body[data-aos-delay="950"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="950"].aos-animate, body[data-aos-delay="950"] [data-aos].aos-animate {
  -webkit-transition-delay: 0.95s;
          transition-delay: 0.95s;
}

[data-aos][data-aos][data-aos-duration="1000"], body[data-aos-duration="1000"] [data-aos] {
  -webkit-transition-duration: 1s;
          transition-duration: 1s;
}

[data-aos][data-aos][data-aos-delay="1000"], body[data-aos-delay="1000"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1000"].aos-animate, body[data-aos-delay="1000"] [data-aos].aos-animate {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

[data-aos][data-aos][data-aos-duration="1050"], body[data-aos-duration="1050"] [data-aos] {
  -webkit-transition-duration: 1.05s;
          transition-duration: 1.05s;
}

[data-aos][data-aos][data-aos-delay="1050"], body[data-aos-delay="1050"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1050"].aos-animate, body[data-aos-delay="1050"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.05s;
          transition-delay: 1.05s;
}

[data-aos][data-aos][data-aos-duration="1100"], body[data-aos-duration="1100"] [data-aos] {
  -webkit-transition-duration: 1.1s;
          transition-duration: 1.1s;
}

[data-aos][data-aos][data-aos-delay="1100"], body[data-aos-delay="1100"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1100"].aos-animate, body[data-aos-delay="1100"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

[data-aos][data-aos][data-aos-duration="1150"], body[data-aos-duration="1150"] [data-aos] {
  -webkit-transition-duration: 1.15s;
          transition-duration: 1.15s;
}

[data-aos][data-aos][data-aos-delay="1150"], body[data-aos-delay="1150"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1150"].aos-animate, body[data-aos-delay="1150"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.15s;
          transition-delay: 1.15s;
}

[data-aos][data-aos][data-aos-duration="1200"], body[data-aos-duration="1200"] [data-aos] {
  -webkit-transition-duration: 1.2s;
          transition-duration: 1.2s;
}

[data-aos][data-aos][data-aos-delay="1200"], body[data-aos-delay="1200"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1200"].aos-animate, body[data-aos-delay="1200"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

[data-aos][data-aos][data-aos-duration="1250"], body[data-aos-duration="1250"] [data-aos] {
  -webkit-transition-duration: 1.25s;
          transition-duration: 1.25s;
}

[data-aos][data-aos][data-aos-delay="1250"], body[data-aos-delay="1250"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1250"].aos-animate, body[data-aos-delay="1250"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.25s;
          transition-delay: 1.25s;
}

[data-aos][data-aos][data-aos-duration="1300"], body[data-aos-duration="1300"] [data-aos] {
  -webkit-transition-duration: 1.3s;
          transition-duration: 1.3s;
}

[data-aos][data-aos][data-aos-delay="1300"], body[data-aos-delay="1300"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1300"].aos-animate, body[data-aos-delay="1300"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

[data-aos][data-aos][data-aos-duration="1350"], body[data-aos-duration="1350"] [data-aos] {
  -webkit-transition-duration: 1.35s;
          transition-duration: 1.35s;
}

[data-aos][data-aos][data-aos-delay="1350"], body[data-aos-delay="1350"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1350"].aos-animate, body[data-aos-delay="1350"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.35s;
          transition-delay: 1.35s;
}

[data-aos][data-aos][data-aos-duration="1400"], body[data-aos-duration="1400"] [data-aos] {
  -webkit-transition-duration: 1.4s;
          transition-duration: 1.4s;
}

[data-aos][data-aos][data-aos-delay="1400"], body[data-aos-delay="1400"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1400"].aos-animate, body[data-aos-delay="1400"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

[data-aos][data-aos][data-aos-duration="1450"], body[data-aos-duration="1450"] [data-aos] {
  -webkit-transition-duration: 1.45s;
          transition-duration: 1.45s;
}

[data-aos][data-aos][data-aos-delay="1450"], body[data-aos-delay="1450"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1450"].aos-animate, body[data-aos-delay="1450"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.45s;
          transition-delay: 1.45s;
}

[data-aos][data-aos][data-aos-duration="1500"], body[data-aos-duration="1500"] [data-aos] {
  -webkit-transition-duration: 1.5s;
          transition-duration: 1.5s;
}

[data-aos][data-aos][data-aos-delay="1500"], body[data-aos-delay="1500"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1500"].aos-animate, body[data-aos-delay="1500"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

[data-aos][data-aos][data-aos-duration="1550"], body[data-aos-duration="1550"] [data-aos] {
  -webkit-transition-duration: 1.55s;
          transition-duration: 1.55s;
}

[data-aos][data-aos][data-aos-delay="1550"], body[data-aos-delay="1550"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1550"].aos-animate, body[data-aos-delay="1550"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.55s;
          transition-delay: 1.55s;
}

[data-aos][data-aos][data-aos-duration="1600"], body[data-aos-duration="1600"] [data-aos] {
  -webkit-transition-duration: 1.6s;
          transition-duration: 1.6s;
}

[data-aos][data-aos][data-aos-delay="1600"], body[data-aos-delay="1600"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1600"].aos-animate, body[data-aos-delay="1600"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s;
}

[data-aos][data-aos][data-aos-duration="1650"], body[data-aos-duration="1650"] [data-aos] {
  -webkit-transition-duration: 1.65s;
          transition-duration: 1.65s;
}

[data-aos][data-aos][data-aos-delay="1650"], body[data-aos-delay="1650"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1650"].aos-animate, body[data-aos-delay="1650"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.65s;
          transition-delay: 1.65s;
}

[data-aos][data-aos][data-aos-duration="1700"], body[data-aos-duration="1700"] [data-aos] {
  -webkit-transition-duration: 1.7s;
          transition-duration: 1.7s;
}

[data-aos][data-aos][data-aos-delay="1700"], body[data-aos-delay="1700"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1700"].aos-animate, body[data-aos-delay="1700"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.7s;
          transition-delay: 1.7s;
}

[data-aos][data-aos][data-aos-duration="1750"], body[data-aos-duration="1750"] [data-aos] {
  -webkit-transition-duration: 1.75s;
          transition-duration: 1.75s;
}

[data-aos][data-aos][data-aos-delay="1750"], body[data-aos-delay="1750"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1750"].aos-animate, body[data-aos-delay="1750"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.75s;
          transition-delay: 1.75s;
}

[data-aos][data-aos][data-aos-duration="1800"], body[data-aos-duration="1800"] [data-aos] {
  -webkit-transition-duration: 1.8s;
          transition-duration: 1.8s;
}

[data-aos][data-aos][data-aos-delay="1800"], body[data-aos-delay="1800"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1800"].aos-animate, body[data-aos-delay="1800"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}

[data-aos][data-aos][data-aos-duration="1850"], body[data-aos-duration="1850"] [data-aos] {
  -webkit-transition-duration: 1.85s;
          transition-duration: 1.85s;
}

[data-aos][data-aos][data-aos-delay="1850"], body[data-aos-delay="1850"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1850"].aos-animate, body[data-aos-delay="1850"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.85s;
          transition-delay: 1.85s;
}

[data-aos][data-aos][data-aos-duration="1900"], body[data-aos-duration="1900"] [data-aos] {
  -webkit-transition-duration: 1.9s;
          transition-duration: 1.9s;
}

[data-aos][data-aos][data-aos-delay="1900"], body[data-aos-delay="1900"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1900"].aos-animate, body[data-aos-delay="1900"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.9s;
          transition-delay: 1.9s;
}

[data-aos][data-aos][data-aos-duration="1950"], body[data-aos-duration="1950"] [data-aos] {
  -webkit-transition-duration: 1.95s;
          transition-duration: 1.95s;
}

[data-aos][data-aos][data-aos-delay="1950"], body[data-aos-delay="1950"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="1950"].aos-animate, body[data-aos-delay="1950"] [data-aos].aos-animate {
  -webkit-transition-delay: 1.95s;
          transition-delay: 1.95s;
}

[data-aos][data-aos][data-aos-duration="2000"], body[data-aos-duration="2000"] [data-aos] {
  -webkit-transition-duration: 2s;
          transition-duration: 2s;
}

[data-aos][data-aos][data-aos-delay="2000"], body[data-aos-delay="2000"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2000"].aos-animate, body[data-aos-delay="2000"] [data-aos].aos-animate {
  -webkit-transition-delay: 2s;
          transition-delay: 2s;
}

[data-aos][data-aos][data-aos-duration="2050"], body[data-aos-duration="2050"] [data-aos] {
  -webkit-transition-duration: 2.05s;
          transition-duration: 2.05s;
}

[data-aos][data-aos][data-aos-delay="2050"], body[data-aos-delay="2050"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2050"].aos-animate, body[data-aos-delay="2050"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.05s;
          transition-delay: 2.05s;
}

[data-aos][data-aos][data-aos-duration="2100"], body[data-aos-duration="2100"] [data-aos] {
  -webkit-transition-duration: 2.1s;
          transition-duration: 2.1s;
}

[data-aos][data-aos][data-aos-delay="2100"], body[data-aos-delay="2100"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2100"].aos-animate, body[data-aos-delay="2100"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.1s;
          transition-delay: 2.1s;
}

[data-aos][data-aos][data-aos-duration="2150"], body[data-aos-duration="2150"] [data-aos] {
  -webkit-transition-duration: 2.15s;
          transition-duration: 2.15s;
}

[data-aos][data-aos][data-aos-delay="2150"], body[data-aos-delay="2150"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2150"].aos-animate, body[data-aos-delay="2150"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.15s;
          transition-delay: 2.15s;
}

[data-aos][data-aos][data-aos-duration="2200"], body[data-aos-duration="2200"] [data-aos] {
  -webkit-transition-duration: 2.2s;
          transition-duration: 2.2s;
}

[data-aos][data-aos][data-aos-delay="2200"], body[data-aos-delay="2200"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2200"].aos-animate, body[data-aos-delay="2200"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.2s;
          transition-delay: 2.2s;
}

[data-aos][data-aos][data-aos-duration="2250"], body[data-aos-duration="2250"] [data-aos] {
  -webkit-transition-duration: 2.25s;
          transition-duration: 2.25s;
}

[data-aos][data-aos][data-aos-delay="2250"], body[data-aos-delay="2250"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2250"].aos-animate, body[data-aos-delay="2250"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.25s;
          transition-delay: 2.25s;
}

[data-aos][data-aos][data-aos-duration="2300"], body[data-aos-duration="2300"] [data-aos] {
  -webkit-transition-duration: 2.3s;
          transition-duration: 2.3s;
}

[data-aos][data-aos][data-aos-delay="2300"], body[data-aos-delay="2300"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2300"].aos-animate, body[data-aos-delay="2300"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.3s;
          transition-delay: 2.3s;
}

[data-aos][data-aos][data-aos-duration="2350"], body[data-aos-duration="2350"] [data-aos] {
  -webkit-transition-duration: 2.35s;
          transition-duration: 2.35s;
}

[data-aos][data-aos][data-aos-delay="2350"], body[data-aos-delay="2350"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2350"].aos-animate, body[data-aos-delay="2350"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.35s;
          transition-delay: 2.35s;
}

[data-aos][data-aos][data-aos-duration="2400"], body[data-aos-duration="2400"] [data-aos] {
  -webkit-transition-duration: 2.4s;
          transition-duration: 2.4s;
}

[data-aos][data-aos][data-aos-delay="2400"], body[data-aos-delay="2400"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2400"].aos-animate, body[data-aos-delay="2400"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.4s;
          transition-delay: 2.4s;
}

[data-aos][data-aos][data-aos-duration="2450"], body[data-aos-duration="2450"] [data-aos] {
  -webkit-transition-duration: 2.45s;
          transition-duration: 2.45s;
}

[data-aos][data-aos][data-aos-delay="2450"], body[data-aos-delay="2450"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2450"].aos-animate, body[data-aos-delay="2450"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.45s;
          transition-delay: 2.45s;
}

[data-aos][data-aos][data-aos-duration="2500"], body[data-aos-duration="2500"] [data-aos] {
  -webkit-transition-duration: 2.5s;
          transition-duration: 2.5s;
}

[data-aos][data-aos][data-aos-delay="2500"], body[data-aos-delay="2500"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2500"].aos-animate, body[data-aos-delay="2500"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.5s;
          transition-delay: 2.5s;
}

[data-aos][data-aos][data-aos-duration="2550"], body[data-aos-duration="2550"] [data-aos] {
  -webkit-transition-duration: 2.55s;
          transition-duration: 2.55s;
}

[data-aos][data-aos][data-aos-delay="2550"], body[data-aos-delay="2550"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2550"].aos-animate, body[data-aos-delay="2550"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.55s;
          transition-delay: 2.55s;
}

[data-aos][data-aos][data-aos-duration="2600"], body[data-aos-duration="2600"] [data-aos] {
  -webkit-transition-duration: 2.6s;
          transition-duration: 2.6s;
}

[data-aos][data-aos][data-aos-delay="2600"], body[data-aos-delay="2600"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2600"].aos-animate, body[data-aos-delay="2600"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.6s;
          transition-delay: 2.6s;
}

[data-aos][data-aos][data-aos-duration="2650"], body[data-aos-duration="2650"] [data-aos] {
  -webkit-transition-duration: 2.65s;
          transition-duration: 2.65s;
}

[data-aos][data-aos][data-aos-delay="2650"], body[data-aos-delay="2650"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2650"].aos-animate, body[data-aos-delay="2650"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.65s;
          transition-delay: 2.65s;
}

[data-aos][data-aos][data-aos-duration="2700"], body[data-aos-duration="2700"] [data-aos] {
  -webkit-transition-duration: 2.7s;
          transition-duration: 2.7s;
}

[data-aos][data-aos][data-aos-delay="2700"], body[data-aos-delay="2700"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2700"].aos-animate, body[data-aos-delay="2700"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.7s;
          transition-delay: 2.7s;
}

[data-aos][data-aos][data-aos-duration="2750"], body[data-aos-duration="2750"] [data-aos] {
  -webkit-transition-duration: 2.75s;
          transition-duration: 2.75s;
}

[data-aos][data-aos][data-aos-delay="2750"], body[data-aos-delay="2750"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2750"].aos-animate, body[data-aos-delay="2750"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.75s;
          transition-delay: 2.75s;
}

[data-aos][data-aos][data-aos-duration="2800"], body[data-aos-duration="2800"] [data-aos] {
  -webkit-transition-duration: 2.8s;
          transition-duration: 2.8s;
}

[data-aos][data-aos][data-aos-delay="2800"], body[data-aos-delay="2800"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2800"].aos-animate, body[data-aos-delay="2800"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.8s;
          transition-delay: 2.8s;
}

[data-aos][data-aos][data-aos-duration="2850"], body[data-aos-duration="2850"] [data-aos] {
  -webkit-transition-duration: 2.85s;
          transition-duration: 2.85s;
}

[data-aos][data-aos][data-aos-delay="2850"], body[data-aos-delay="2850"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2850"].aos-animate, body[data-aos-delay="2850"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.85s;
          transition-delay: 2.85s;
}

[data-aos][data-aos][data-aos-duration="2900"], body[data-aos-duration="2900"] [data-aos] {
  -webkit-transition-duration: 2.9s;
          transition-duration: 2.9s;
}

[data-aos][data-aos][data-aos-delay="2900"], body[data-aos-delay="2900"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2900"].aos-animate, body[data-aos-delay="2900"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.9s;
          transition-delay: 2.9s;
}

[data-aos][data-aos][data-aos-duration="2950"], body[data-aos-duration="2950"] [data-aos] {
  -webkit-transition-duration: 2.95s;
          transition-duration: 2.95s;
}

[data-aos][data-aos][data-aos-delay="2950"], body[data-aos-delay="2950"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="2950"].aos-animate, body[data-aos-delay="2950"] [data-aos].aos-animate {
  -webkit-transition-delay: 2.95s;
          transition-delay: 2.95s;
}

[data-aos][data-aos][data-aos-duration="3000"], body[data-aos-duration="3000"] [data-aos] {
  -webkit-transition-duration: 3s;
          transition-duration: 3s;
}

[data-aos][data-aos][data-aos-delay="3000"], body[data-aos-delay="3000"] [data-aos] {
  -webkit-transition-delay: 0ms;
          transition-delay: 0ms;
}

[data-aos][data-aos][data-aos-delay="3000"].aos-animate, body[data-aos-delay="3000"] [data-aos].aos-animate {
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}

[data-aos][data-aos][data-aos-easing=linear], body[data-aos-easing=linear] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
          transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

[data-aos][data-aos][data-aos-easing=ease], body[data-aos-easing=ease] [data-aos] {
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
}

[data-aos][data-aos][data-aos-easing=ease-in], body[data-aos-easing=ease-in] [data-aos] {
  -webkit-transition-timing-function: ease-in;
          transition-timing-function: ease-in;
}

[data-aos][data-aos][data-aos-easing=ease-out], body[data-aos-easing=ease-out] [data-aos] {
  -webkit-transition-timing-function: ease-out;
          transition-timing-function: ease-out;
}

[data-aos][data-aos][data-aos-easing=ease-in-out], body[data-aos-easing=ease-in-out] [data-aos] {
  -webkit-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
}

[data-aos][data-aos][data-aos-easing=ease-in-back], body[data-aos-easing=ease-in-back] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
          transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
}

[data-aos][data-aos][data-aos-easing=ease-out-back], body[data-aos-easing=ease-out-back] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
          transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

[data-aos][data-aos][data-aos-easing=ease-in-out-back], body[data-aos-easing=ease-in-out-back] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
          transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

[data-aos][data-aos][data-aos-easing=ease-in-sine], body[data-aos-easing=ease-in-sine] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
          transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
}

[data-aos][data-aos][data-aos-easing=ease-out-sine], body[data-aos-easing=ease-out-sine] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
          transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
}

[data-aos][data-aos][data-aos-easing=ease-in-out-sine], body[data-aos-easing=ease-in-out-sine] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
          transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}

[data-aos][data-aos][data-aos-easing=ease-in-quad], body[data-aos-easing=ease-in-quad] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
          transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}

[data-aos][data-aos][data-aos-easing=ease-out-quad], body[data-aos-easing=ease-out-quad] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
          transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-aos][data-aos][data-aos-easing=ease-in-out-quad], body[data-aos-easing=ease-in-out-quad] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
          transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

[data-aos][data-aos][data-aos-easing=ease-in-cubic], body[data-aos-easing=ease-in-cubic] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
          transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}

[data-aos][data-aos][data-aos-easing=ease-out-cubic], body[data-aos-easing=ease-out-cubic] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
          transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-aos][data-aos][data-aos-easing=ease-in-out-cubic], body[data-aos-easing=ease-in-out-cubic] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
          transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

[data-aos][data-aos][data-aos-easing=ease-in-quart], body[data-aos-easing=ease-in-quart] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
          transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}

[data-aos][data-aos][data-aos-easing=ease-out-quart], body[data-aos-easing=ease-out-quart] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
          transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-aos][data-aos][data-aos-easing=ease-in-out-quart], body[data-aos-easing=ease-in-out-quart] [data-aos] {
  -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
          transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

[data-aos^=fade][data-aos^=fade] {
  opacity: 0;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
}

[data-aos^=fade][data-aos^=fade].aos-animate {
  opacity: 1;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

[data-aos=fade-up] {
  -webkit-transform: translate3d(0, 100px, 0);
          transform: translate3d(0, 100px, 0);
}

[data-aos=fade-down] {
  -webkit-transform: translate3d(0, -100px, 0);
          transform: translate3d(0, -100px, 0);
}

[data-aos=fade-right] {
  -webkit-transform: translate3d(-100px, 0, 0);
          transform: translate3d(-100px, 0, 0);
}

[data-aos=fade-left] {
  -webkit-transform: translate3d(100px, 0, 0);
          transform: translate3d(100px, 0, 0);
}

[data-aos=fade-up-right] {
  -webkit-transform: translate3d(-100px, 100px, 0);
          transform: translate3d(-100px, 100px, 0);
}

[data-aos=fade-up-left] {
  -webkit-transform: translate3d(100px, 100px, 0);
          transform: translate3d(100px, 100px, 0);
}

[data-aos=fade-down-right] {
  -webkit-transform: translate3d(-100px, -100px, 0);
          transform: translate3d(-100px, -100px, 0);
}

[data-aos=fade-down-left] {
  -webkit-transform: translate3d(100px, -100px, 0);
          transform: translate3d(100px, -100px, 0);
}

[data-aos^=zoom][data-aos^=zoom] {
  opacity: 0;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
}

[data-aos^=zoom][data-aos^=zoom].aos-animate {
  opacity: 1;
  -webkit-transform: translateZ(0) scale(1);
          transform: translateZ(0) scale(1);
}

[data-aos=zoom-in] {
  -webkit-transform: scale(0.6);
          transform: scale(0.6);
}

[data-aos=zoom-in-up] {
  -webkit-transform: translate3d(0, 100px, 0) scale(0.6);
          transform: translate3d(0, 100px, 0) scale(0.6);
}

[data-aos=zoom-in-down] {
  -webkit-transform: translate3d(0, -100px, 0) scale(0.6);
          transform: translate3d(0, -100px, 0) scale(0.6);
}

[data-aos=zoom-in-right] {
  -webkit-transform: translate3d(-100px, 0, 0) scale(0.6);
          transform: translate3d(-100px, 0, 0) scale(0.6);
}

[data-aos=zoom-in-left] {
  -webkit-transform: translate3d(100px, 0, 0) scale(0.6);
          transform: translate3d(100px, 0, 0) scale(0.6);
}

[data-aos=zoom-out] {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}

[data-aos=zoom-out-up] {
  -webkit-transform: translate3d(0, 100px, 0) scale(1.2);
          transform: translate3d(0, 100px, 0) scale(1.2);
}

[data-aos=zoom-out-down] {
  -webkit-transform: translate3d(0, -100px, 0) scale(1.2);
          transform: translate3d(0, -100px, 0) scale(1.2);
}

[data-aos=zoom-out-right] {
  -webkit-transform: translate3d(-100px, 0, 0) scale(1.2);
          transform: translate3d(-100px, 0, 0) scale(1.2);
}

[data-aos=zoom-out-left] {
  -webkit-transform: translate3d(100px, 0, 0) scale(1.2);
          transform: translate3d(100px, 0, 0) scale(1.2);
}

[data-aos^=slide][data-aos^=slide] {
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}

[data-aos^=slide][data-aos^=slide].aos-animate {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

[data-aos=slide-up] {
  -webkit-transform: translate3d(0, 100%, 0);
          transform: translate3d(0, 100%, 0);
}

[data-aos=slide-down] {
  -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0);
}

[data-aos=slide-right] {
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
}

[data-aos=slide-left] {
  -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);
}

[data-aos^=flip][data-aos^=flip] {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}

[data-aos=flip-left] {
  -webkit-transform: perspective(2500px) rotateY(-100deg);
          transform: perspective(2500px) rotateY(-100deg);
}

[data-aos=flip-left].aos-animate {
  -webkit-transform: perspective(2500px) rotateY(0);
          transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-right] {
  -webkit-transform: perspective(2500px) rotateY(100deg);
          transform: perspective(2500px) rotateY(100deg);
}

[data-aos=flip-right].aos-animate {
  -webkit-transform: perspective(2500px) rotateY(0);
          transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-up] {
  -webkit-transform: perspective(2500px) rotateX(-100deg);
          transform: perspective(2500px) rotateX(-100deg);
}

[data-aos=flip-up].aos-animate {
  -webkit-transform: perspective(2500px) rotateX(0);
          transform: perspective(2500px) rotateX(0);
}

[data-aos=flip-down] {
  -webkit-transform: perspective(2500px) rotateX(100deg);
          transform: perspective(2500px) rotateX(100deg);
}

[data-aos=flip-down].aos-animate {
  -webkit-transform: perspective(2500px) rotateX(0);
          transform: perspective(2500px) rotateX(0);
}

.fancybox-enabled {
  overflow: hidden;
}

.fancybox-enabled body {
  overflow: visible;
  height: 100%;
}

.fancybox-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99993;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.fancybox-container ~ .fancybox-container {
  z-index: 99992;
}

.fancybox-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #0f0f11;
  opacity: 0;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.06, 0.68, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.06, 0.68, 0.19);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.fancybox-container--ready .fancybox-bg {
  opacity: 0.87;
  -webkit-transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
          transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
}

.fancybox-controls {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  z-index: 99994;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  direction: ltr;
}

.fancybox-show-controls .fancybox-controls {
  opacity: 1;
}

.fancybox-infobar {
  display: none;
}

.fancybox-show-infobar .fancybox-infobar {
  display: inline-block;
  pointer-events: all;
}

.fancybox-infobar__body {
  display: inline-block;
  width: 70px;
  line-height: 44px;
  font-size: 13px;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  text-align: center;
  color: #ddd;
  background-color: rgba(30, 30, 30, 0.7);
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: subpixel-antialiased;
}

.fancybox-buttons {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
  pointer-events: all;
}

.fancybox-show-buttons .fancybox-buttons {
  display: block;
}

.fancybox-slider-wrap {
  overflow: hidden;
  direction: ltr;
}

.fancybox-slider, .fancybox-slider-wrap {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 0;
  margin: 0;
  z-index: 99993;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
}

.fancybox-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: auto;
  outline: none;
  white-space: normal;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  z-index: 99994;
  -webkit-overflow-scrolling: touch;
}

.fancybox-slide:before {
  content: "";
  height: 100%;
  width: 0;
}

.fancybox-slide:before, .fancybox-slide > * {
  display: inline-block;
  vertical-align: middle;
}

.fancybox-slide > * {
  position: relative;
  padding: 24px;
  margin: 44px 0;
  border-width: 0;
  text-align: left;
  background-color: #fff;
  overflow: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.fancybox-slide--image {
  overflow: hidden;
}

.fancybox-slide--image:before {
  display: none;
}

.fancybox-content {
  display: inline-block;
  position: relative;
  margin: 44px auto;
  padding: 0;
  border: 0;
  width: 80%;
  height: calc(100% - 88px);
  vertical-align: middle;
  line-height: normal;
  text-align: left;
  white-space: normal;
  outline: none;
  font-size: 16px;
  font-family: Arial, sans-serif;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  -webkit-overflow-scrolling: touch;
}

.fancybox-iframe {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.fancybox-slide--video .fancybox-content, .fancybox-slide--video .fancybox-iframe {
  background: transparent;
}

.fancybox-placeholder {
  z-index: 99995;
  background: transparent;
  cursor: default;
  overflow: visible;
  -webkit-transform-origin: top left;
  transform-origin: top left;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.fancybox-image, .fancybox-placeholder, .fancybox-spaceball {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.fancybox-image, .fancybox-spaceball {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  background: transparent;
  background-size: 100% 100%;
}

.fancybox-controls--canzoomOut .fancybox-placeholder {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

.fancybox-controls--canzoomIn .fancybox-placeholder {
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}

.fancybox-controls--canGrab .fancybox-placeholder {
  cursor: -webkit-grab;
  cursor: grab;
}

.fancybox-controls--isGrabbing .fancybox-placeholder {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.fancybox-spaceball {
  z-index: 1;
}

.fancybox-tmp {
  position: absolute;
  top: -9999px;
  left: -9999px;
  visibility: hidden;
}

.fancybox-error {
  position: absolute;
  margin: 0;
  padding: 40px;
  top: 50%;
  left: 50%;
  width: 380px;
  max-width: 100%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #fff;
  cursor: default;
}

.fancybox-error p {
  margin: 0;
  padding: 0;
  color: #444;
  font: 16px/20px Helvetica Neue, Helvetica, Arial, sans-serif;
}

.fancybox-close-small {
  position: absolute;
  top: 0;
  right: 0;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  outline: none;
  background: transparent;
  z-index: 10;
  cursor: pointer;
}

.fancybox-close-small:after {
  content: "×";
  position: absolute;
  top: 5px;
  right: 5px;
  width: 30px;
  height: 30px;
  font: 20px/30px Arial, Helvetica Neue, Helvetica, sans-serif;
  color: #888;
  font-weight: 300;
  text-align: center;
  border-radius: 50%;
  border-width: 0;
  background: #fff;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 2;
}

.fancybox-close-small:focus:after {
  outline: 1px dotted #888;
}

.fancybox-slide--video .fancybox-close-small {
  top: -36px;
  right: -36px;
  background: transparent;
}

.fancybox-close-small:hover:after {
  color: #555;
  background: #eee;
}

.fancybox-caption-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 60px 30px 0;
  z-index: 99998;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(20%, rgba(0, 0, 0, 0.1)), color-stop(40%, rgba(0, 0, 0, 0.2)), color-stop(80%, rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.8)));
  background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.6) 80%, rgba(0, 0, 0, 0.8));
  opacity: 0;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  pointer-events: none;
}

.fancybox-show-caption .fancybox-caption-wrap {
  opacity: 1;
}

.fancybox-caption {
  padding: 30px 0;
  border-top: 1px solid hsla(0, 0%, 100%, 0.4);
  font-size: 14px;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  color: #fff;
  line-height: 20px;
  -webkit-text-size-adjust: none;
}

.fancybox-caption a, .fancybox-caption button {
  pointer-events: all;
}

.fancybox-caption a {
  color: #fff;
  text-decoration: underline;
}

.fancybox-button {
  display: inline-block;
  position: relative;
  width: 44px;
  height: 44px;
  line-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  background: transparent;
  color: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  vertical-align: top;
  outline: none;
}

.fancybox-button--disabled {
  cursor: default;
  pointer-events: none;
}

.fancybox-button, .fancybox-infobar__body {
  background: rgba(30, 30, 30, 0.6);
}

.fancybox-button:hover {
  background: rgba(0, 0, 0, 0.8);
}

.fancybox-button:after, .fancybox-button:before {
  content: "";
  pointer-events: none;
  position: absolute;
  border-color: #fff;
  background-color: currentColor;
  color: currentColor;
  opacity: 0.9;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
}

.fancybox-button--disabled:after, .fancybox-button--disabled:before {
  opacity: 0.5;
}

.fancybox-button--left:after {
  left: 20px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.fancybox-button--left:after, .fancybox-button--right:after {
  top: 18px;
  width: 6px;
  height: 6px;
  background: transparent;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}

.fancybox-button--right:after {
  right: 20px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.fancybox-button--left {
  border-bottom-left-radius: 5px;
}

.fancybox-button--right {
  border-bottom-right-radius: 5px;
}

.fancybox-button--close {
  float: right;
}

.fancybox-button--close:after, .fancybox-button--close:before {
  content: "";
  display: inline-block;
  position: absolute;
  height: 2px;
  width: 16px;
  top: calc(50% - 1px);
  left: calc(50% - 8px);
}

.fancybox-button--close:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.fancybox-button--close:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.fancybox-loading {
  border: 6px solid hsla(0, 0%, 39%, 0.4);
  border-top: 6px solid hsla(0, 0%, 100%, 0.6);
  border-radius: 100%;
  height: 50px;
  width: 50px;
  -webkit-animation: a 0.8s infinite linear;
  animation: a 0.8s infinite linear;
  background: transparent;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -25px;
  margin-left: -25px;
  z-index: 99999;
}

@-webkit-keyframes a {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes a {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@media (max-width: 800px) {
  .fancybox-controls {
    text-align: left;
  }
  .fancybox-button--left, .fancybox-button--right, .fancybox-buttons button:not(.fancybox-button--close) {
    display: none !important;
  }
  .fancybox-caption {
    padding: 20px 0;
    margin: 0;
  }
}
.fancybox-button--fullscreen:before {
  width: 15px;
  height: 11px;
  left: 15px;
  top: 16px;
  border: 2px solid;
  background: none;
}

.fancybox-button--play:before {
  top: 16px;
  left: 18px;
  width: 0;
  height: 0;
  border-top: 6px inset transparent;
  border-bottom: 6px inset transparent;
  border-left: 10px solid;
  border-radius: 1px;
  background: transparent;
}

.fancybox-button--pause:before {
  top: 16px;
  left: 18px;
  width: 7px;
  height: 11px;
  border-style: solid;
  border-width: 0 2px;
  background: transparent;
}

.fancybox-button--thumbs span {
  font-size: 23px;
}

.fancybox-button--thumbs:before {
  top: 20px;
  left: 21px;
  width: 3px;
  height: 3px;
  -webkit-box-shadow: 0 -4px 0, -4px -4px 0, 4px -4px 0, inset 0 0 0 32px, -4px 0 0, 4px 0 0, 0 4px 0, -4px 4px 0, 4px 4px 0;
          box-shadow: 0 -4px 0, -4px -4px 0, 4px -4px 0, inset 0 0 0 32px, -4px 0 0, 4px 0 0, 0 4px 0, -4px 4px 0, 4px 4px 0;
}

.fancybox-container--thumbs .fancybox-caption-wrap, .fancybox-container--thumbs .fancybox-controls, .fancybox-container--thumbs .fancybox-slider-wrap {
  right: 220px;
}

.fancybox-thumbs {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  width: 220px;
  margin: 0;
  padding: 5px 5px 0 0;
  background: #fff;
  z-index: 99993;
  word-break: normal;
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: transparent;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.fancybox-thumbs > ul {
  list-style: none;
  position: absolute;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  font-size: 0;
}

.fancybox-thumbs > ul > li {
  float: left;
  overflow: hidden;
  max-width: 50%;
  padding: 0;
  margin: 0;
  width: 105px;
  height: 75px;
  position: relative;
  cursor: pointer;
  outline: none;
  border: 5px solid #fff;
  border-top-width: 0;
  border-right-width: 0;
  -webkit-tap-highlight-color: transparent;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

li.fancybox-thumbs-loading {
  background: rgba(0, 0, 0, 0.1);
}

.fancybox-thumbs > ul > li > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.fancybox-thumbs > ul > li:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 2px;
  border: 4px solid #4ea7f9;
  z-index: 99991;
  opacity: 0;
  -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.fancybox-thumbs > ul > li.fancybox-thumbs-active:before {
  opacity: 1;
}

@media (max-width: 800px) {
  .fancybox-thumbs {
    display: none !important;
  }
  .fancybox-container--thumbs .fancybox-caption-wrap, .fancybox-container--thumbs .fancybox-controls, .fancybox-container--thumbs .fancybox-slider-wrap {
    right: 0;
  }
}
@font-face {
  font-family: "feather";
  src: url("../font/feather.eot?t=1501841394106"); /* IE9*/
  src: url("../font/feather.eot?t=1501841394106#iefix") format("embedded-opentype"), url("../font/feather.woff?t=1501841394106") format("woff"), url("../font/feather.ttf?t=1501841394106") format("truetype"), url("../font/feather.svg?t=1501841394106#feather") format("svg"); /* iOS 4.1- */
}
.feather {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "feather" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-alert-octagon:before {
  content: "\e81b";
}

.icon-alert-circle:before {
  content: "\e81c";
}

.icon-activity:before {
  content: "\e81d";
}

.icon-alert-triangle:before {
  content: "\e81e";
}

.icon-align-center:before {
  content: "\e81f";
}

.icon-airplay:before {
  content: "\e820";
}

.icon-align-justify:before {
  content: "\e821";
}

.icon-align-left:before {
  content: "\e822";
}

.icon-align-right:before {
  content: "\e823";
}

.icon-arrow-down-left:before {
  content: "\e824";
}

.icon-arrow-down-right:before {
  content: "\e825";
}

.icon-anchor:before {
  content: "\e826";
}

.icon-aperture:before {
  content: "\e827";
}

.icon-arrow-left:before {
  content: "\e828";
}

.icon-arrow-right:before {
  content: "\e829";
}

.icon-arrow-down:before {
  content: "\e82a";
}

.icon-arrow-up-left:before {
  content: "\e82b";
}

.icon-arrow-up-right:before {
  content: "\e82c";
}

.icon-arrow-up:before {
  content: "\e82d";
}

.icon-award:before {
  content: "\e82e";
}

.icon-bar-chart:before {
  content: "\e82f";
}

.icon-at-sign:before {
  content: "\e830";
}

.icon-bar-chart-2:before {
  content: "\e831";
}

.icon-battery-charging:before {
  content: "\e832";
}

.icon-bell-off:before {
  content: "\e833";
}

.icon-battery:before {
  content: "\e834";
}

.icon-bluetooth:before {
  content: "\e835";
}

.icon-bell:before {
  content: "\e836";
}

.icon-book:before {
  content: "\e837";
}

.icon-briefcase:before {
  content: "\e838";
}

.icon-camera-off:before {
  content: "\e839";
}

.icon-calendar:before {
  content: "\e83a";
}

.icon-bookmark:before {
  content: "\e83b";
}

.icon-box:before {
  content: "\e83c";
}

.icon-camera:before {
  content: "\e83d";
}

.icon-check-circle:before {
  content: "\e83e";
}

.icon-check:before {
  content: "\e83f";
}

.icon-check-square:before {
  content: "\e840";
}

.icon-cast:before {
  content: "\e841";
}

.icon-chevron-down:before {
  content: "\e842";
}

.icon-chevron-left:before {
  content: "\e843";
}

.icon-chevron-right:before {
  content: "\e844";
}

.icon-chevron-up:before {
  content: "\e845";
}

.icon-chevrons-down:before {
  content: "\e846";
}

.icon-chevrons-right:before {
  content: "\e847";
}

.icon-chevrons-up:before {
  content: "\e848";
}

.icon-chevrons-left:before {
  content: "\e849";
}

.icon-circle:before {
  content: "\e84a";
}

.icon-clipboard:before {
  content: "\e84b";
}

.icon-chrome:before {
  content: "\e84c";
}

.icon-clock:before {
  content: "\e84d";
}

.icon-cloud-lightning:before {
  content: "\e84e";
}

.icon-cloud-drizzle:before {
  content: "\e84f";
}

.icon-cloud-rain:before {
  content: "\e850";
}

.icon-cloud-off:before {
  content: "\e851";
}

.icon-codepen:before {
  content: "\e852";
}

.icon-cloud-snow:before {
  content: "\e853";
}

.icon-compass:before {
  content: "\e854";
}

.icon-copy:before {
  content: "\e855";
}

.icon-corner-down-right:before {
  content: "\e856";
}

.icon-corner-down-left:before {
  content: "\e857";
}

.icon-corner-left-down:before {
  content: "\e858";
}

.icon-corner-left-up:before {
  content: "\e859";
}

.icon-corner-up-left:before {
  content: "\e85a";
}

.icon-corner-up-right:before {
  content: "\e85b";
}

.icon-corner-right-down:before {
  content: "\e85c";
}

.icon-corner-right-up:before {
  content: "\e85d";
}

.icon-cpu:before {
  content: "\e85e";
}

.icon-credit-card:before {
  content: "\e85f";
}

.icon-crosshair:before {
  content: "\e860";
}

.icon-disc:before {
  content: "\e861";
}

.icon-delete:before {
  content: "\e862";
}

.icon-download-cloud:before {
  content: "\e863";
}

.icon-download:before {
  content: "\e864";
}

.icon-droplet:before {
  content: "\e865";
}

.icon-edit-2:before {
  content: "\e866";
}

.icon-edit:before {
  content: "\e867";
}

.icon-edit-1:before {
  content: "\e868";
}

.icon-external-link:before {
  content: "\e869";
}

.icon-eye:before {
  content: "\e86a";
}

.icon-feather:before {
  content: "\e86b";
}

.icon-facebook:before {
  content: "\e86c";
}

.icon-file-minus:before {
  content: "\e86d";
}

.icon-eye-off:before {
  content: "\e86e";
}

.icon-fast-forward:before {
  content: "\e86f";
}

.icon-file-text:before {
  content: "\e870";
}

.icon-film:before {
  content: "\e871";
}

.icon-file:before {
  content: "\e872";
}

.icon-file-plus:before {
  content: "\e873";
}

.icon-folder:before {
  content: "\e874";
}

.icon-filter:before {
  content: "\e875";
}

.icon-flag:before {
  content: "\e876";
}

.icon-globe:before {
  content: "\e877";
}

.icon-grid:before {
  content: "\e878";
}

.icon-heart:before {
  content: "\e879";
}

.icon-home:before {
  content: "\e87a";
}

.icon-github:before {
  content: "\e87b";
}

.icon-image:before {
  content: "\e87c";
}

.icon-inbox:before {
  content: "\e87d";
}

.icon-layers:before {
  content: "\e87e";
}

.icon-info:before {
  content: "\e87f";
}

.icon-instagram:before {
  content: "\e880";
}

.icon-layout:before {
  content: "\e881";
}

.icon-link-2:before {
  content: "\e882";
}

.icon-life-buoy:before {
  content: "\e883";
}

.icon-link:before {
  content: "\e884";
}

.icon-log-in:before {
  content: "\e885";
}

.icon-list:before {
  content: "\e886";
}

.icon-lock:before {
  content: "\e887";
}

.icon-log-out:before {
  content: "\e888";
}

.icon-loader:before {
  content: "\e889";
}

.icon-mail:before {
  content: "\e88a";
}

.icon-maximize-2:before {
  content: "\e88b";
}

.icon-map:before {
  content: "\e88c";
}

.icon-map-pin:before {
  content: "\e88e";
}

.icon-menu:before {
  content: "\e88f";
}

.icon-message-circle:before {
  content: "\e890";
}

.icon-message-square:before {
  content: "\e891";
}

.icon-minimize-2:before {
  content: "\e892";
}

.icon-mic-off:before {
  content: "\e893";
}

.icon-minus-circle:before {
  content: "\e894";
}

.icon-mic:before {
  content: "\e895";
}

.icon-minus-square:before {
  content: "\e896";
}

.icon-minus:before {
  content: "\e897";
}

.icon-moon:before {
  content: "\e898";
}

.icon-monitor:before {
  content: "\e899";
}

.icon-more-vertical:before {
  content: "\e89a";
}

.icon-more-horizontal:before {
  content: "\e89b";
}

.icon-move:before {
  content: "\e89c";
}

.icon-music:before {
  content: "\e89d";
}

.icon-navigation-2:before {
  content: "\e89e";
}

.icon-navigation:before {
  content: "\e89f";
}

.icon-octagon:before {
  content: "\e8a0";
}

.icon-package:before {
  content: "\e8a1";
}

.icon-pause-circle:before {
  content: "\e8a2";
}

.icon-pause:before {
  content: "\e8a3";
}

.icon-percent:before {
  content: "\e8a4";
}

.icon-phone-call:before {
  content: "\e8a5";
}

.icon-phone-forwarded:before {
  content: "\e8a6";
}

.icon-phone-missed:before {
  content: "\e8a7";
}

.icon-phone-off:before {
  content: "\e8a8";
}

.icon-phone-incoming:before {
  content: "\e8a9";
}

.icon-phone:before {
  content: "\e8aa";
}

.icon-phone-outgoing:before {
  content: "\e8ab";
}

.icon-pie-chart:before {
  content: "\e8ac";
}

.icon-play-circle:before {
  content: "\e8ad";
}

.icon-play:before {
  content: "\e8ae";
}

.icon-plus-square:before {
  content: "\e8af";
}

.icon-plus-circle:before {
  content: "\e8b0";
}

.icon-plus:before {
  content: "\e8b1";
}

.icon-pocket:before {
  content: "\e8b2";
}

.icon-printer:before {
  content: "\e8b3";
}

.icon-power:before {
  content: "\e8b4";
}

.icon-radio:before {
  content: "\e8b5";
}

.icon-repeat:before {
  content: "\e8b6";
}

.icon-refresh-ccw:before {
  content: "\e8b7";
}

.icon-rewind:before {
  content: "\e8b8";
}

.icon-rotate-ccw:before {
  content: "\e8b9";
}

.icon-refresh-cw:before {
  content: "\e8ba";
}

.icon-rotate-cw:before {
  content: "\e8bb";
}

.icon-save:before {
  content: "\e8bc";
}

.icon-search:before {
  content: "\e8bd";
}

.icon-server:before {
  content: "\e8be";
}

.icon-scissors:before {
  content: "\e8bf";
}

.icon-share-2:before {
  content: "\e8c0";
}

.icon-share:before {
  content: "\e8c1";
}

.icon-shield:before {
  content: "\e8c2";
}

.icon-settings:before {
  content: "\e8c3";
}

.icon-skip-back:before {
  content: "\e8c4";
}

.icon-shuffle:before {
  content: "\e8c5";
}

.icon-sidebar:before {
  content: "\e8c6";
}

.icon-skip-forward:before {
  content: "\e8c7";
}

.icon-slack:before {
  content: "\e8c8";
}

.icon-slash:before {
  content: "\e8c9";
}

.icon-smartphone:before {
  content: "\e8ca";
}

.icon-square:before {
  content: "\e8cb";
}

.icon-speaker:before {
  content: "\e8cc";
}

.icon-star:before {
  content: "\e8cd";
}

.icon-stop-circle:before {
  content: "\e8ce";
}

.icon-sun:before {
  content: "\e8cf";
}

.icon-sunrise:before {
  content: "\e8d0";
}

.icon-tablet:before {
  content: "\e8d1";
}

.icon-tag:before {
  content: "\e8d2";
}

.icon-sunset:before {
  content: "\e8d3";
}

.icon-target:before {
  content: "\e8d4";
}

.icon-thermometer:before {
  content: "\e8d5";
}

.icon-thumbs-up:before {
  content: "\e8d6";
}

.icon-thumbs-down:before {
  content: "\e8d7";
}

.icon-toggle-left:before {
  content: "\e8d8";
}

.icon-toggle-right:before {
  content: "\e8d9";
}

.icon-trash-2:before {
  content: "\e8da";
}

.icon-trash:before {
  content: "\e8db";
}

.icon-trending-up:before {
  content: "\e8dc";
}

.icon-trending-down:before {
  content: "\e8dd";
}

.icon-triangle:before {
  content: "\e8de";
}

.icon-type:before {
  content: "\e8df";
}

.icon-twitter:before {
  content: "\e8e0";
}

.icon-upload:before {
  content: "\e8e1";
}

.icon-umbrella:before {
  content: "\e8e2";
}

.icon-upload-cloud:before {
  content: "\e8e3";
}

.icon-unlock:before {
  content: "\e8e4";
}

.icon-user-check:before {
  content: "\e8e5";
}

.icon-user-minus:before {
  content: "\e8e6";
}

.icon-user-plus:before {
  content: "\e8e7";
}

.icon-user-x:before {
  content: "\e8e8";
}

.icon-user:before {
  content: "\e8e9";
}

.icon-users:before {
  content: "\e8ea";
}

.icon-video-off:before {
  content: "\e8eb";
}

.icon-video:before {
  content: "\e8ec";
}

.icon-voicemail:before {
  content: "\e8ed";
}

.icon-volume-x:before {
  content: "\e8ee";
}

.icon-volume-2:before {
  content: "\e8ef";
}

.icon-volume-1:before {
  content: "\e8f0";
}

.icon-volume:before {
  content: "\e8f1";
}

.icon-watch:before {
  content: "\e8f2";
}

.icon-wifi:before {
  content: "\e8f3";
}

.icon-x-square:before {
  content: "\e8f4";
}

.icon-wind:before {
  content: "\e8f5";
}

.icon-x:before {
  content: "\e8f6";
}

.icon-x-circle:before {
  content: "\e8f7";
}

.icon-zap:before {
  content: "\e8f8";
}

.icon-zoom-in:before {
  content: "\e8f9";
}

.icon-zoom-out:before {
  content: "\e8fa";
}

.icon-command:before {
  content: "\e8fb";
}

.icon-cloud:before {
  content: "\e8fc";
}

.icon-hash:before {
  content: "\e8fd";
}

.icon-headphones:before {
  content: "\e8fe";
}

.icon-underline:before {
  content: "\e8ff";
}

.icon-italic:before {
  content: "\e900";
}

.icon-bold:before {
  content: "\e901";
}

.icon-crop:before {
  content: "\e902";
}

.icon-help-circle:before {
  content: "\e903";
}

.icon-paperclip:before {
  content: "\e904";
}

.icon-shopping-cart:before {
  content: "\e905";
}

.icon-tv:before {
  content: "\e906";
}

.icon-wifi-off:before {
  content: "\e907";
}

.icon-minimize:before {
  content: "\e88d";
}

.icon-maximize:before {
  content: "\e908";
}

.icon-gitlab:before {
  content: "\e909";
}

.icon-sliders:before {
  content: "\e90a";
}

.icon-star-on:before {
  content: "\e90b";
}

.icon-heart-on:before {
  content: "\e90c";
}

/* Slider */
.slick-loading .slick-list {
  background: #fff url("./ajax-loader.gif") center center no-repeat;
}

/* Icons */
@font-face {
  font-family: "slick";
  font-weight: normal;
  font-style: normal;
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
}
/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}

.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  opacity: 0.75;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}

[dir=rtl] .slick-prev {
  right: -25px;
  left: auto;
}

.slick-prev:before {
  content: "←";
}

[dir=rtl] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}

[dir=rtl] .slick-next {
  right: auto;
  left: -25px;
}

.slick-next:before {
  content: "→";
}

[dir=rtl] .slick-next:before {
  content: "←";
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: "•";
  text-align: center;
  opacity: 0.25;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  opacity: 0.75;
  color: black;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  /* cursor: hand; */
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.breadcrumb {
  background-color: transparent;
  margin: 5px 0 0 0;
  padding: 0;
  border-radius: 0;
}
.breadcrumb li + li:before {
  font-family: "feather";
  content: "\e844";
  padding: 0 6px;
  float: left;
  position: relative;
  top: 1px;
}
.breadcrumb .link {
  float: left;
  display: block;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.breadcrumb .link.-nolimit {
  max-width: inherit;
}
.breadcrumb .link.active {
  color: var(--color-primary);
}
.breadcrumb li,
.breadcrumb .link {
  color: var(--color-default);
}

.btn-link {
  background: none;
  border: 1px solid transparent;
  border-radius: 0;
  padding: 0;
  position: relative;
}
.btn-link:hover {
  text-decoration: none;
}
.btn-link:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
  outline: none;
  text-decoration: none;
}

.btn {
  background: none;
  position: relative;
  padding: 0 10px;
  min-width: 100px;
  height: 38px;
  line-height: 36px;
  border: 1px solid transparent;
  border-radius: 3px;
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
}
.btn.fluid {
  min-width: inherit;
  width: 100%;
}
.btn:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.btn .icon > span[class*=material-symbols] {
  top: 0;
}
.btn.btn-xs {
  font-size: var(--typo-xs);
  height: 20px;
  line-height: 18px;
  min-width: 50px;
}
.btn.btn-sm {
  font-size: var(--typo-xs);
  height: 24px;
  line-height: 22px;
  min-width: 60px;
}
.btn.btn-md {
  font-size: var(--typo-sm);
  height: 26px;
  line-height: 24px;
  min-width: 60px;
}
.btn.btn-lg {
  font-size: var(--typo-md);
  min-width: 120px;
  height: 44px;
  line-height: 42px;
}
.btn.btn-xl {
  font-size: var(--typo-md);
  font-weight: 500;
  min-width: 140px;
  height: 50px;
  line-height: 48px;
}
.btn.disabled {
  cursor: unset;
}

.btn:not(:disabled):not(.disabled).active:focus,
.btn:not(:disabled):not(.disabled):active:focus,
.show > .btn.dropdown-toggle:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-primary,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: var(--color-primary);
  border-color: transparent;
}

.btn-primary:hover,
.btn-primary:active:hover,
.btn-primary.active:hover,
.btn-primary:active:focus,
.btn-primary.actitve:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.btn-primary:focus:hover,
.btn-primary.focus:hover {
  color: #fff;
  background-color: var(--color-primary);
  border-color: transparent;
  -webkit-box-shadow: 0px 2px 10px #58b985;
          box-shadow: 0px 2px 10px #58b985;
}

.btn-primary.disabled,
.btn-primary.disabled:hover {
  color: #fff;
  background-color: var(--color-primary);
  border-color: transparent;
  opacity: 0.5;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-secondary,
.btn-secondary:focus,
.btn-secondary.focus,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle {
  color: var(--color-light);
  background-color: var(--color-secondary);
  border-color: transparent;
}

.btn-secondary:hover,
.btn-secondary:active:hover,
.btn-secondary.active:hover,
.btn-secondary:active:focus,
.btn-secondary.actitve:focus,
.btn-secondary:active.focus,
.btn-secondary.active.focus,
.btn-secondary:focus:hover,
.btn-secondary.focus:hover {
  color: var(--color-light);
  background-color: var(--color-secondary);
  border-color: transparent;
}

.btn-secondary.disabled,
.btn-secondary.disabled:hover {
  color: var(--color-gray-100);
  opacity: 0.5;
}

.btn-secondary-light,
.btn-secondary-light:focus,
.btn-secondary-light.focus,
.btn-secondary-light:not(:disabled):not(.disabled).active,
.btn-secondary-light:not(:disabled):not(.disabled):active,
.show > .btn-secondary-light.dropdown-toggle {
  color: var(--color-secondary);
  background-color: var(--color-secondary-light);
  border-color: transparent;
}

.btn-secondary-light:hover,
.btn-secondary-light:active:hover,
.btn-secondary-light.active:hover,
.btn-secondary-light:active:focus,
.btn-secondary-light.actitve:focus,
.btn-secondary-light:active.focus,
.btn-secondary-light.active.focus,
.btn-secondary-light:focus:hover,
.btn-secondary-light.focus:hover {
  color: var(--color-light);
  background-color: var(--color-secondary);
  border-color: transparent;
}

.btn-secondary-light.disabled,
.btn-secondary-light.disabled:hover {
  color: var(--color-gray-100);
  opacity: 0.5;
}

.btn-border-primary,
.btn-border-primary:focus,
.btn-border-primary.focus,
.btn-border-primary:not(:disabled):not(.disabled).active,
.btn-border-primary:not(:disabled):not(.disabled):active,
.show > .btn-border-primary.dropdown-toggle {
  color: var(--color-primary);
  background-color: transparent;
  border-color: var(--color-primary);
}

.btn-border-primary:hover,
.btn-border-primary:active:hover,
.btn-border-primary.active:hover,
.btn-border-primary:active:focus,
.btn-border-primary.actitve:focus,
.btn-border-primary:active.focus,
.btn-border-primary.active.focus,
.btn-border-primary:focus:hover,
.btn-border-primary.focus:hover {
  color: #fff;
  background-color: var(--color-primary);
  border-color: transparent;
}

.btn-border-primary.disabled,
.btn-border-primary.disabled:hover {
  color: #fff;
  background-color: var(--color-primary);
  border-color: transparent;
  opacity: 0.5;
}

.btn-delete,
.btn-delete:focus,
.btn-delete.focus,
.btn-delete:not(:disabled):not(.disabled).active,
.btn-delete:not(:disabled):not(.disabled):active,
.show > .btn-delete.dropdown-toggle {
  color: var(--color-gray-100);
  min-width: unset !important;
}

.btn-delete:hover,
.btn-delete:active:hover,
.btn-delete.active:hover,
.btn-delete:active:focus,
.btn-delete.actitve:focus,
.btn-delete:active.focus,
.btn-delete.active.focus,
.btn-delete:focus:hover,
.btn-delete.focus:hover {
  color: var(--color-danger);
}

.btn-delete.disabled,
.btn-delete.disabled:hover {
  color: var(--color-gray-100);
  opacity: 0.5;
}

.btn-light,
.btn-light:focus,
.btn-light.focus,
.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.show > .btn-light.dropdown-toggle {
  color: var(--color-primary);
  background-color: var(--color-light);
  border-color: transparent;
}

.btn-light:hover,
.btn-light:active:hover,
.btn-light.active:hover,
.btn-light:active:focus,
.btn-light.actitve:focus,
.btn-light:active.focus,
.btn-light.active.focus,
.btn-light:focus:hover,
.btn-light.focus:hover {
  color: var(--color-primary);
  background-color: var(--color-primary-light);
  border-color: transparent;
  -webkit-box-shadow: 0px 2px 10px #fff;
          box-shadow: 0px 2px 10px #fff;
}

.btn-light.disabled,
.btn-light.disabled:hover {
  color: var(--color-primary);
  background-color: var(--color-light);
  border-color: transparent;
  opacity: 0.5;
}

.guest-btn {
  font-size: var(--typo-md);
  padding: 0;
}
.guest-btn .icon {
  width: 50px;
}
.guest-btn .icon > img {
  width: 21px;
  margin: 0 auto;
}
.guest-btn .txt {
  width: calc(100% - 50px);
}
.guest-btn .icon ~ .txt {
  margin-left: 0 !important;
  border-left: 1px solid var(--color-border);
}

.editor-content {
  font-size: 16px;
  color: var(--color-default);
  line-height: 1.4em;
}
.editor-content p {
  line-height: 1.4em;
  margin-bottom: 15px;
}
.editor-content p:last-child {
  margin-bottom: 0;
}
.editor-content img {
  height: auto !important;
}
.editor-content .item-list.bullet-list > li::before {
  top: 0.6em;
}
.editor-content figure.contain img {
  height: 100% !important;
}

.input-height, .form-default .select2-container--default .select2-selection--single .select2-selection__arrow, .form-default .select2-container--default .select2-selection--single,
.form-default .select2-container--default .select2-selection--multiple {
  height: calc(1.5em + 0.75rem + 6px);
}

.input-line-height, .select2-container--default .select2-search--inline .select2-search__field {
  line-height: calc(1.5em + 0.75rem + 6px);
}

.form-default .form-group {
  position: relative;
  margin-bottom: 15px;
}

.form-default .control-label {
  margin-bottom: 6px;
  font-weight: var(--fw-normal);
  font-size: var(--typo-default);
  color: var(--color-default);
  line-height: 1.3em;
}
.form-default .control-label span {
  font-size: 0.8em;
}

.form-default .form-control {
  height: calc(1.5em + 0.75rem + 9px);
  line-height: 1.4em;
  padding: 10px 12px;
  background-color: #fff;
  border: 1px solid var(--color-border);
  border-radius: 3px;
  -webkit-box-shadow: none;
          box-shadow: none;
  font-size: var(--typo-default);
  color: var(--color-default);
  font-weight: var(--fw-default);
}
.form-default .form-control::-webkit-input-placeholder {
  color: var(--color-gray);
  opacity: 1;
}
.form-default .form-control:-ms-input-placeholder {
  color: var(--color-gray);
  opacity: 1;
}
.form-default .form-control::-moz-placeholder {
  color: var(--color-gray);
  opacity: 1;
}
.form-default .form-control::-ms-input-placeholder {
  color: var(--color-gray);
  opacity: 1;
}
.form-default .form-control::placeholder {
  color: var(--color-gray);
  opacity: 1;
}

.form-default textarea.form-control {
  line-height: 1.2em;
  height: auto;
  -webkit-transition: all 200ms;
  transition: all 200ms;
}

.form-default textarea::-webkit-scrollbar {
  width: 0px;
}

.form-default .form-note {
  position: absolute;
  top: 100%;
  left: 20px;
  margin-top: 4px;
  font-size: var(--typo-xs);
  color: var(--color-gray);
}

.form-default .form-control:focus {
  border-color: var(--color-primary);
  text-shadow: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.form-default .block-control {
  position: relative;
}

.form-default .has-error .form-control:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.form-default .has-success .form-control:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.form-default .floating-label {
  color: var(--color-default);
  font-size: var(--typo-xs);
  position: absolute;
  pointer-events: none;
  left: 15px;
  top: 9px;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

.form-default .form-control:focus ~ .floating-label,
.form-default .form-control:not(:focus):valid ~ .floating-label {
  color: var(--color-default);
  font-size: var(--typo-xs);
  left: 0;
  top: -22px;
}

.form-default .select2-container--default .select2-selection--single,
.form-default .select2-container--default .select2-selection--multiple {
  background-color: #fff;
  border-radius: 0;
  border: 1px solid var(--color-border);
  padding-left: 7px;
  padding-right: 7px;
}

.form-default .select2-container--default .select2-selection--single .select2-selection__rendered {
  font-size: var(--typo-md);
  line-height: calc(1.5em + 0.75rem + 4px);
}

.form-default .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: calc(1.5em + 0.75rem + 4px);
  right: 10px;
}

.select2-container--default .select2-search--inline .select2-search__field {
  margin-top: 0;
}

.select2-results__option {
  padding: 12px 8px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  font-family: "Material Symbols Outlined" !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow::after {
  position: absolute;
  content: "\e5cf";
  top: calc(50% - 12px);
  right: 0;
  font-size: 26px;
  font-weight: 200;
  color: var(--color-gray-100);
  width: 24px;
  height: 24px;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow::after {
  content: "\e5ce";
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  display: none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--color-primary);
}

.select2-dropdown {
  border-color: var(--color-border);
  border-radius: 0;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  padding: 7px;
  background-color: var(--color-primary-light);
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  margin-left: 5px;
  margin-right: 0;
}

.form-control-feedback::after {
  position: absolute;
  left: 0;
  bottom: -24px;
}

.form-control-feedback:before {
  display: none;
}

.form-control-feedback.glyphicon-ok {
  background: url("../img/icon/checked.png") center no-repeat;
  background-size: 16px;
}

.form-control-feedback.glyphicon-remove {
  padding-bottom: 1rem;
}
.form-control-feedback.glyphicon-remove::after {
  content: "This field cannot be empty.";
  color: var(--color-danger);
  font-size: 12px;
}

.radio-control {
  position: relative;
  display: inline-block;
}

.radio-control .icon {
  width: 20px;
  height: 20px;
  border: 1px solid var(--color-border);
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
}

.radio-control .title {
  margin: 0;
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
  color: var(--color-default);
  padding-left: 30px;
  line-height: 1.2em;
  display: block;
}

.radio-control input[type=radio] {
  margin-top: 0;
  position: absolute;
  z-index: 5;
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
}

.radio-control input[type=radio]:checked ~ .icon {
  border-color: transparent;
  border-color: var(--color-border);
}

.radio-control input[type=radio]:checked ~ .icon:before {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  background-color: var(--color-default);
  border-radius: 50%;
}

.checkbox-control {
  position: relative;
  display: inline-block;
}

.checkbox-control .icon {
  width: 20px;
  height: 20px;
  border: 1px solid var(--color-border);
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0;
}

.checkbox-control .title {
  margin: 0;
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
  color: var(--color-default);
  padding-left: 30px;
  line-height: 1.2em;
  display: block;
}

.checkbox-control input[type=checkbox] {
  margin-top: 0;
  position: absolute;
  z-index: 5;
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
}

.checkbox-control input[type=checkbox]:checked ~ .icon {
  border-color: transparent;
  background-color: var(--color-default);
}

.checkbox-control input[type=checkbox]:checked ~ .icon:before {
  font-family: "feahter";
  content: "\e83f";
}

.has-feedback {
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
.has-feedback.has-error .form-control {
  border-color: var(--color-danger);
}
.has-feedback.has-success .form-control {
  border-color: var(--color-primary);
}
.has-feedback.has-error {
  margin-bottom: 2.5rem;
}

.checkbox-control {
  /* Hide the browser's default checkbox */
  /* Create a custom checkbox */
  /* On mouse-over, add a grey background color */
  /* When the checkbox is checked, add a blue background */
  /* Create the checkmark/indicator (hidden when not checked) */
  /* Show the checkmark when checked */
  /* Style the checkmark/indicator */
}
.checkbox-control .checkbox-label {
  display: block;
  position: relative;
  padding-left: 28px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.checkbox-control .checkbox-label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkbox-control .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #eee;
  border-radius: 2px;
}
.checkbox-control .checkbox-label:hover input ~ .checkmark {
  background-color: #ccc;
}
.checkbox-control .checkbox-label input:checked ~ .checkmark {
  background-color: var(--color-primary);
}
.checkbox-control .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.checkbox-control .checkbox-label input:checked ~ .checkmark:after {
  display: block;
}
.checkbox-control .checkbox-label .checkmark:after {
  left: calc(50% - 3px);
  top: 2px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.radio-control {
  /* Hide the browser's default radio */
  /* Create a custom radio */
  /* On mouse-over, add a grey background color */
  /* When the checkbox is checked, add a priamry color */
  /* Create the checkmark/indicator (hidden when not checked) */
  /* Show the checkmark when checked */
  /* Style the checkmark/indicator */
}
.radio-control .radio-label {
  display: block;
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: var(--typo-md);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.radio-control .radio-label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.radio-control .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: transparent;
  border-radius: 50%;
  border: 1px solid var(--color-gray);
}
.radio-control .radio-label input:checked ~ .checkmark {
  border-color: var(--color-primary);
}
.radio-control .radio-label input:checked ~ .checkmark::after {
  background-color: var(--color-primary);
}
.radio-control .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.radio-control .radio-label input:checked ~ .checkmark:after {
  display: block;
}
.radio-control .radio-label .checkmark:after {
  left: calc(50% - 5px);
  top: calc(50% - 5px);
  border-radius: 50%;
  width: 10px;
  height: 10px;
}
.radio-control .txt {
  line-height: 1.2em;
}

.form-search {
  position: relative;
}
.form-search .control-label {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  left: 10px;
  height: auto;
  margin-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form-search .control-label > span {
  color: var(--color-gray-100);
}
.form-search .form-control {
  font-size: var(--typo-md);
  padding-left: 38px;
  border: 3px solid #f3f4f6;
  border-radius: unset;
  height: 44px;
}
.form-search .icon > span[class*=material-symbols] {
  top: 0;
  color: var(--color-gray-100);
}
.form-search .sorting {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #f3f4f6;
  padding-left: 10px;
  padding-right: 10px;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 1;
}
.form-search .sorting .dropdown-menu {
  margin-right: -10px !important;
  margin-top: 10px;
}
.form-search .sorting .btn-link {
  color: var(--color-default);
  text-decoration: none;
  min-width: unset;
  padding: 0;
  line-height: unset;
  height: unset;
}

.form-default input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  position: relative;
  right: -6px;
  content: "\e5cd";
  cursor: pointer;
  width: 24px;
  height: 24px;
  background-image: url(../img/icon/icon-close.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.datepicker {
  position: relative;
  margin-bottom: 0;
}
.datepicker::after {
  position: absolute;
  font-family: "Material Symbols Rounded";
  content: "\e935";
  color: transparent;
  font-weight: 200;
  font-size: 22px;
  height: 22px;
  top: calc(50% - 10px);
  right: 10px;
  color: var(--color-gray-100);
}
.datepicker > .form-control {
  padding-right: 3rem;
}

.ui-datepicker {
  width: 20em;
}

.ui-widget-header {
  color: var(--color-primary);
  border-color: transparent;
  background-color: var(--color-primary-light);
}

.ui-datepicker td span, .ui-datepicker td a {
  padding: 0.6em 0.4em;
}

.ui-widget-content {
  color: var(--color-dark);
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  border-radius: unset;
}

.ui-widget {
  font-size: 14px;
}

.ui-widget.ui-widget-content {
  border-color: var(--color-border);
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  border: 1px solid var(--color-border);
  background: var(--color-gray-200);
  color: var(--color-default);
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  border: 1px solid var(--color-primary);
  background: var(--color-primary);
  color: var(--color-light);
}

.ui-datepicker table {
  font-size: 0.95em;
}

.form-default .input-group .radio-control + .radio-control {
  margin-left: 1.5rem;
}

#copycode {
  line-height: 1.2em;
  margin-bottom: 10px;
  color: var(--color-primary);
}

.interest-health ul {
  padding-left: 0.7rem !important;
}
.interest-health ul li {
  margin-bottom: 5px;
}
.interest-health ul li p {
  margin: 0;
  font-size: var(--typo-md);
  line-height: 1.2em;
}

.pagination-block {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.pagination {
  margin: 0;
}
.pagination .link {
  display: block;
  min-width: 54px;
  height: 54px;
  padding: 0 5px;
  text-align: center;
  line-height: 54px;
  border-radius: 10px;
  background-color: var(--color-default);
  font-weight: var(--fw-normal);
  font-size: var(--typo-default);
  color: var(--color-light);
}
.pagination .link:hover {
  color: var(--color-primary);
}
.pagination .link span {
  position: relative;
  line-height: 54px;
}
.pagination .link.link-text {
  border-color: transparent;
  background-color: transparent;
}
.pagination .link.link-text:hover {
  border-color: transparent;
  background-color: transparent;
}
.pagination li {
  display: inline-block;
  vertical-align: middle;
}
.pagination li.active .link {
  color: var(--color-light);
  border-color: transparent;
  background: none;
  background-color: var(--color-primary);
}
.pagination li + li {
  margin-left: 10px;
}

.whead {
  margin-bottom: 1.25rem;
}
.whead .h-title {
  font-size: var(--typo-xl);
  font-weight: var(--fw-medium);
  line-height: 1.2em;
}
.whead .title {
  margin: 0;
  font-size: var(--typo-lg);
  font-weight: var(--fw-medium);
  line-height: 1.2em;
}
.whead .row {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.modal-dialog {
  margin: 0 auto;
}

.modal-lg,
.modal-xl {
  max-width: 640px;
}

.modal-default .modal-content {
  border: unset;
  border-radius: 0;
  overflow: hidden;
  height: 100dvh;
  min-height: -webkit-fill-available;
}
.modal-default .modal-title {
  color: var(--color-default);
}
.modal-default .close {
  opacity: 1;
  color: var(--color-default);
  -webkit-transition: all 200ms;
  transition: all 200ms;
}
.modal-default .close .icon {
  height: 24px;
}
.modal-default .close .icon > span[class*=material-symbols] {
  top: 0;
  font-size: 22px;
  font-weight: 400;
}
.modal-default .close:hover {
  color: var(--color-primary);
}
.modal-default .close:active, .modal-default .close:focus {
  outline: none;
}
.modal-default .back {
  margin-left: -1rem;
  margin-right: 0;
}
.modal-default .modal-header {
  border-bottom-color: var(--color-border);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.modal-default .modal-footer {
  border-top-color: var(--color-border);
}
.modal-default .modal-footer {
  background-color: var(--color-light);
}
.modal-default .scroll-wrapper {
  margin-right: 0;
  padding-bottom: 1.5rem;
}

.interest-health-modal .modal-header,
.interest-health-modal .modal-body {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.interest-health-modal .scroll-wrapper {
  max-height: calc(100vh - 75px - 77px - 3.5rem);
}

.my-coupon-modal .scroll-wrapper {
  max-height: calc(100vh - 75px - 3.5rem);
}

@media (max-width: 575px) {
  .coupon-modal .modal-dialog {
    margin: 0;
  }
  .coupon-modal .modal-body {
    height: calc(100vh - 75px - 77px);
  }
  .interest-health-modal .modal-body {
    max-height: calc(100vh - 75px - 77px - 1rem);
  }
}
div.swal2-popup {
  border-radius: 0;
  width: 26em;
  padding-bottom: 40px;
  color: var(--color-default);
  background-color: var(--color-light);
}

div.swal2-icon {
  margin-top: 40px;
  margin-bottom: 0;
}

h2.swal2-title {
  padding-top: 15px;
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
  color: var(--color-primary);
}

div.swal2-html-container {
  margin-top: 15px;
  margin-bottom: 10px;
  margin-left: 3em;
  margin-right: 3em;
  font-size: var(--typo-default);
  font-weight: var(--fw-normal);
  color: var(--color-primary);
  overflow: visible;
  line-height: 1.4em;
}

.swal2-actions .btn {
  margin: 0 5px;
}

.preload {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100vh;
  background-image: url(../img/background/bg-preload.jpg);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1040;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.preload .txt {
  font-family: var(--font-family-1);
  font-size: 24px;
  font-weight: var(--fw-normal);
  line-height: 1.4em;
  color: var(--color-light);
  margin-top: 3rem;
}
.preload .txt span {
  position: relative;
  top: -8px;
  font-family: var(--font-family-2);
  font-style: italic;
  font-size: 8px;
  letter-spacing: 0.02em;
}

.preload-wrapper {
  height: 100vh;
  width: 100%;
  padding: 3rem calc(3rem - 15px);
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@media (min-width: 768px) {
  .preload .txt {
    font-size: 32px;
    margin-top: 5rem;
  }
  .preload .txt span {
    font-size: 14px;
  }
}
@media (min-width: 992px) {
  .preload {
    background-size: var(--max-app-width);
  }
}
.swiper-pagination-bullet {
  width: 0.3em;
  height: 0.3em;
  opacity: 1;
  background-color: #d9d9d9;
}

.swiper-pagination-bullet-active {
  background-color: var(--color-warning) !important;
}

.thumb-swiper .swiper-pagination-fraction {
  font-size: var(--typo-md);
  left: unset;
  right: 10px;
  width: unset;
  text-align: right;
  color: var(--color-light);
  background: rgba(43, 43, 43, 0.5);
  border-radius: 50rem;
  padding: 2px 12px;
}

@media (min-width: 768px) {
  .swiper-pagination-bullet {
    width: 0.5em;
    height: 0.5em;
  }
}
.feed-block .feed-thumb .cover,
.feed-block .feed-thumb .contain,
.feed-block .feed-thumb .vdo-cover {
  padding-top: 88%;
  background-color: #f4f4f5;
}
.feed-block .feed-swiper {
  padding-bottom: 30px;
}
.feed-block .feed-swiper .swiper-horizontal > .swiper-pagination-bullets,
.feed-block .feed-swiper .swiper-pagination-bullets.swiper-pagination-horizontal,
.feed-block .feed-swiper .swiper-pagination-custom,
.feed-block .feed-swiper .swiper-pagination-fraction {
  bottom: 0px;
}
.feed-block .topbar {
  margin-top: -30px;
  margin-bottom: 0.5rem;
}
.feed-block .feed-content {
  padding: 1rem 0 0 0;
}
.feed-block .feed-content .title {
  color: var(--color-dark);
  font-weight: var(--fw-normal);
  font-size: 24px;
  line-height: 1em;
  margin-bottom: 5px;
}
.feed-block .feed-content .editor-content {
  position: relative;
}
.feed-block .feed-content .editor-content p {
  margin: 0;
}
.feed-block .feed-content .editor-content:not(.show-more) {
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-height: 1.1em;
  max-height: 2.2em;
  -webkit-line-clamp: 2;
}
.feed-block .feed-content .editor-content:not(.show-more) .more-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  background: var(--color-light);
}
.feed-block .feed-content .editor-content:not(.show-more) .less-btn {
  display: none;
}
.feed-block .feed-content .editor-content .more-btn {
  display: block;
  position: relative;
}
.feed-block .feed-content .editor-content .less-btn {
  display: block;
}
.feed-block .btn,
.feed-block .link {
  color: var(--color-default);
}
.feed-block .feed-item {
  margin-bottom: 1.5rem;
}
.feed-block .feed-item.-vdo .feed-thumb .link,
.feed-block .feed-item.-vdo .feed-thumb a {
  position: relative;
  display: block;
}
.feed-block .feed-item.-vdo .feed-thumb .link .icon,
.feed-block .feed-item.-vdo .feed-thumb a .icon {
  color: var(--color-light);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.feed-block .feed-item.-vdo .feed-thumb .link .icon span,
.feed-block .feed-item.-vdo .feed-thumb a .icon span {
  font-size: 2.64em;
}
.feed-block .feed-item.-vdo .feed-thumb .link:not(.play-vdo) .cover video,
.feed-block .feed-item.-vdo .feed-thumb a:not(.play-vdo) .cover video {
  opacity: 0;
  visibility: hidden;
}
.feed-block .feed-item.-vdo .feed-thumb .link:not(.play-vdo) .vdo-cover,
.feed-block .feed-item.-vdo .feed-thumb a:not(.play-vdo) .vdo-cover {
  padding-top: 0;
}
.feed-block .feed-item.-vdo .feed-thumb .link.play-vdo .cover,
.feed-block .feed-item.-vdo .feed-thumb a.play-vdo .cover {
  padding-top: 0;
  opacity: 0;
  visibility: hidden;
}
.feed-block .more-btn,
.feed-block .less-btn {
  color: var(--color-primary);
}
.feed-block .more-btn:hover span,
.feed-block .less-btn:hover span {
  text-decoration: underline;
}

.material-symbols-rounded-fill {
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
}

span[class*=material-symbols] {
  font-weight: 200;
}

.tags {
  padding: 0;
  margin: 0;
  margin-top: 1rem;
}
.tags li {
  float: left;
  list-style: none;
}

.tags:after {
  clear: both;
}

.tags:before,
.tags:after {
  content: " ";
  display: table;
}

.tag {
  background: var(--color-primary-light);
  border-radius: 50rem;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  display: inline-block;
  height: 28px;
  line-height: 26px;
  padding: 0 20px 0 23px;
  position: relative;
  margin: 0 10px 10px 0;
  text-decoration: none;
  -webkit-transition: color 0.2s;
}

.tag:hover {
  background-color: var(--color-primary);
  color: var(--color-light);
  text-decoration: none;
}

.default-dropdown .dropdown-menu {
  min-width: 12rem;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: unset;
  border: unset;
  -webkit-box-shadow: 0px 0.25rem 1.5rem rgba(0, 0, 0, 0.24);
          box-shadow: 0px 0.25rem 1.5rem rgba(0, 0, 0, 0.24);
}
.default-dropdown .dropdown-divider {
  margin: 0 1rem;
}
.default-dropdown .dropdown-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--typo-md);
  padding: 1rem 1rem;
}
.default-dropdown .dropdown-item .icon {
  width: 24px;
  height: 24px;
}
.default-dropdown .dropdown-item .dropdown-inner {
  margin-left: 0.5rem;
}
.default-dropdown .dropdown-item.active,
.default-dropdown .dropdown-item:active {
  color: var(--color-dark);
  background-color: var(--color-primary-light);
}

.cart-block .scroll-wrapper {
  height: calc(100vh - 240px);
  padding-bottom: 3rem;
}
.cart-block .cart-group + .cart-group {
  margin-top: 2rem;
}

.show-cart-list .whead {
  margin-bottom: 20px !important;
}

.cart-list .thumbnail {
  width: 60px;
  height: 60px;
}
.cart-list .thumbnail .cover {
  padding-top: 100%;
}
.cart-list .quantity {
  background-color: #fff;
}
.cart-list .product-item .checkbox-control {
  margin-top: 20px;
}
.cart-list .product-item .thumbnail {
  border: 1px solid var(--color-border);
  border-radius: 3px;
  overflow: hidden;
}
.cart-list .product-item .inner {
  padding: 0;
  margin-left: 10px;
}
.cart-list .product-item .inner .icon span {
  font-size: 22px;
}
.cart-list .product-item .title {
  color: var(--color-dark);
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  margin: 6px 0;
}
.cart-list .product-item .amount {
  margin-bottom: 0.5rem;
}
.cart-list .product-item .price {
  font-size: var(--typo-md) !important;
  font-weight: var(--fw-medium);
  padding: 3px 0;
}
.cart-list .product-item .price span {
  color: var(--color-primary);
  font-size: var(--typo-md) !important;
}
.cart-list .product-item .price span.discount {
  font-size: var(--typo-default) !important;
}
.cart-list .product-item .btn-delete {
  padding-right: 0;
}
.cart-list .product-item .badge-list {
  opacity: 0;
  height: 30px;
  margin: 1px 0 0 0;
  padding: 0;
}
.cart-list .product-group {
  padding-left: 0;
}
.cart-list .product-group .product-item {
  list-style: none;
}
.cart-list .product-group .product-item + .product-item {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px dashed var(--color-border);
}
.cart-list .product-group + .product-group {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}
.cart-list .product-item .qty-list {
  margin: 10px 0 0 -70px;
}
.cart-list .product-item .qty-item {
  margin-top: 5px;
  border: none !important;
  height: auto;
  padding: 5px 5px 5px 10px;
  background-color: #f3f4f6;
  border-radius: 3px;
}
.cart-list .product-item .qty-item > .row {
  margin: 0 !important;
}
.cart-list .product-item .qty-item > .row > div {
  padding: 0 !important;
}

.cart-summary {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 136px;
  padding: 1rem;
  background-color: var(--color-light);
  -webkit-box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
          box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
  z-index: 1;
}
.cart-summary .title {
  color: var(--color-dark);
  font-size: var(--typo-lg);
}
.cart-summary .total {
  font-size: var(--typo-xxl);
  font-weight: var(--fw-medium);
  color: var(--color-primary);
}
.cart-summary .total span {
  font-size: 16px;
}

.divider ~ .cart-block {
  margin-top: -1rem;
  padding-top: 1rem;
}

@media (max-width: 400px) {
  .cart-summary {
    height: 162px;
  }
  .cart-summary .whead {
    margin-bottom: 10px;
  }
  .cart-summary .action > .row > .col {
    -ms-flex-preferred-size: unset;
        flex-basis: unset;
    -webkit-box-flex: unset;
        -ms-flex-positive: unset;
            flex-grow: unset;
  }
  .cart-summary .action > .row > .col + .col .btn {
    margin-top: 10px;
  }
  .cart-summary .action .btn {
    font-size: var(--typo-md);
    height: 40px;
    line-height: 38px;
  }
  .cart-block .scroll-wrapper {
    height: calc(100vh - 266px);
    padding-bottom: 6rem;
  }
}
.wg-product .product-list .product-slide .swiper-slide {
  width: 168px;
}

.product-list .qty-list {
  min-height: auto;
}
.product-list .product-slide > .swiper {
  overflow: visible;
  margin-left: -15px;
  margin-right: -15px;
  padding-right: 30px;
}
.product-list .product-slide > .swiper > .swiper-wrapper {
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 15px;
}
.product-list .product-slide > .swiper > .swiper-wrapper > .swiper-slide {
  width: 245px;
}
.product-list .product-item .card {
  border-radius: 3px;
  overflow: hidden;
}
.product-list .product-item .quantity {
  padding: 0;
}
.product-list .product-item .quantity input[type=text] {
  max-width: 20px;
  padding: 1px 0 0 0;
  height: 28px;
  font-size: var(--typo-default);
  background-color: #fff;
}
.product-list .product-item .quantity .btn-number {
  width: 22px;
  height: 28px;
  line-height: 28px;
}
.product-list .product-item .quantity .btn-number span {
  line-height: 28px;
  font-size: 18px;
}
.product-list .product-item .topbar .fav-btn .icon > span {
  color: var(--color-dark);
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
  -webkit-text-fill-color: var(--color-light);
  -webkit-text-stroke: 1px;
}
.product-list .product-item .topbar .fav-btn .icon > span.material-symbols-rounded-fill {
  -webkit-text-fill-color: #e92038;
}
.product-list > .product-item {
  margin-bottom: 1rem;
}

.product-item .link {
  color: var(--color-default);
}
.product-item .cover,
.product-item .contain {
  padding-top: 100%;
}
.product-item .inner {
  padding-top: 0.8rem;
  padding: 0.9rem;
}
.product-item .title {
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-dark);
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-height: 1.2em;
  -webkit-line-clamp: 1;
  min-height: 1.2em;
}
.product-item .subtitle {
  font-size: var(--typo-sm);
  font-weight: var(--fw-normal);
}
.product-item .thumbnail {
  background-color: #f4f4f5;
}
.product-item .thumbnail .topbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.product-item .topbar {
  padding: 6px;
  padding-bottom: 0;
}
.product-item .qty-list > div {
  border-top: 1px solid #f2f2f2;
}
.product-item .qty-list > div:last-child {
  border-bottom: 1px solid #f2f2f2;
}
.product-item .qty-item {
  height: 45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.product-item .qty-item > .row {
  width: 100%;
}
.product-item .qty-item .txt-ml {
  font-size: var(--typo-xs);
  line-height: 1.2em;
  margin-bottom: 1px;
}
.product-item .qty-item .price {
  font-size: var(--typo-sm);
}
.product-item .qty-item .price span {
  font-size: var(--typo-default);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
}
.product-item .qty-item .price span.discount {
  font-size: var(--typo-xs);
  text-decoration: line-through;
  color: var(--color-gray-100);
  font-weight: var(--fw-normal);
}
.product-item .action {
  margin-top: 10px;
}
.product-item .action .row {
  margin: 0 -2px;
}
.product-item .action .row > div {
  padding: 0 2px;
}
.product-item .action .btn {
  height: 32px;
  line-height: 30px;
}

.badge-list {
  overflow: hidden;
  margin: 0 -1px;
  margin-top: 5px;
  margin-bottom: 10px;
  height: 30px;
}
.badge-list .badge-swiper .swiper-slide {
  padding: 0 1px;
  width: auto;
}
.badge-list .btn-group {
  background-color: transparent;
  padding: 0;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content;
}
.badge-list .btn-group img {
  width: 24px;
}
.badge-list .btn {
  height: auto;
}
.badge-list .btn img {
  width: 30px;
  height: 30px;
}

.alert-default .alert {
  border-radius: 0;
  border-color: transparent;
}
.alert-default .alert .icon.rounded-circle {
  font-size: 22px;
  width: 32px;
  height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.alert-default .alert .icon.rounded-circle > span[class*=material-symbols] {
  top: 0;
}
.alert-default .alert .alert-heading {
  font-size: var(--typo-xxl);
  font-weight: var(--fw-medium);
}
.alert-default .alert .desc {
  font-size: var(--typo-md);
  font-weight: var(--fw-light);
  line-height: 1.4em;
}
.alert-default .alert-success {
  color: var(--color-default);
  background-color: transparent;
}
.alert-default .alert-success .alert-heading {
  color: var(--color-primary);
}
.alert-default .alert-success .icon {
  color: var(--color-primary);
}
.alert-default .alert-success .desc {
  color: var(--color-dark);
}
.alert-default .alert-warning .icon.bg-secondary-light span {
  color: var(--color-secondary);
}

.default-filter {
  border-top: 1px solid var(--color-border);
}
.default-filter .form-group {
  margin-bottom: 15px;
}
.default-filter .nav-tabs {
  border-bottom-color: var(--color-border);
}
.default-filter .filter-box {
  font-size: var(--typo-md);
  padding: 1rem;
  background-color: var(--color-gray-200);
  margin-bottom: 1rem;
}
.default-filter .filter-box .icon img {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
.default-filter .filter-box .btn-link {
  color: var(--color-default);
  text-decoration: none;
  min-width: unset;
  padding: 0;
  line-height: unset;
  height: unset;
}
.default-filter .filter-box .btn .badge {
  font-size: var(--typo-md);
  padding: 0 0.3015em;
  margin-left: 0.25rem;
}
.default-filter .filter.active .btn-filter,
.default-filter .filter.active .btn-sorting,
.default-filter .sorting.active .btn-filter,
.default-filter .sorting.active .btn-sorting {
  color: var(--color-primary);
}
.default-filter .filter.active .btn-filter .icon img,
.default-filter .filter.active .btn-sorting .icon img,
.default-filter .sorting.active .btn-filter .icon img,
.default-filter .sorting.active .btn-sorting .icon img {
  -webkit-filter: none;
          filter: none;
}
.default-filter .filter:not(.active) .btn-filter .badge {
  display: none;
}
.default-filter .filter .checkbox-control .checkbox-label {
  padding-left: 18px;
}
.default-filter .filter .action {
  text-align: right;
}
.default-filter .filter .action .btn-link {
  color: var(--color-primary);
  text-decoration: none;
}
.default-filter .filter .topic {
  font-size: var(--typo-sm);
  line-height: 1.4em;
  opacity: 0.5;
}
.default-filter .sorting:not(.active) .sorted {
  display: none;
}
.default-filter .sorting .sorted:empty {
  display: none;
}
.default-filter .sorting .dropdown-menu {
  min-width: 8.5rem;
}

.filter-collapse .navbar-collapse {
  position: fixed;
  top: 0;
  left: 0;
  padding-top: 3rem;
  width: 88%;
  height: 100%;
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
  z-index: 1031;
}
.filter-collapse .navbar-collapse .scroll-wrapper {
  max-height: calc(100vh - 3rem - 60px - 92px);
  padding-top: 1rem;
  padding-bottom: 2rem;
}
.filter-collapse .navbar-collapse .navbar-toggler {
  position: relative;
  right: -6px;
}
.filter-collapse .navbar-collapse .navbar-toggler .icon {
  color: var(--color-secondary);
}
.filter-collapse .navbar-collapse .navbar-toggler .icon span {
  font-size: 32px;
  font-weight: 300;
}
.filter-collapse .navbar-collapse .navbar-wrapper {
  padding: 0 1.5rem;
}
.filter-collapse .navbar-collapse .whead .title {
  font-size: var(--typo-xl);
}
.filter-collapse .navbar-collapse .filler-search {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  border-top: 1px solid var(--color-border);
}
.filter-collapse .navbar-collapse .filler-search .action {
  padding: 1rem;
  padding-bottom: 2rem;
}
.filter-collapse .navbar-collapse.collapsing {
  left: -88%;
  -webkit-transition: height 0s ease;
  transition: height 0s ease;
}
.filter-collapse .navbar-collapse.show {
  left: 0;
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}
.filter-collapse .navbar-toggler.collapsed ~ .navbar-collapse {
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}

.filter-list {
  margin-top: 0.5rem;
}
.filter-list .btn {
  color: var(--color-dark);
  font-size: var(--typo-md);
  font-weight: var(--fw-light);
  border-radius: 50rem;
  background-color: var(--color-primary-light);
}
.filter-list .btn .icon > span[class*=material-symbols] {
  top: 6px;
}
.filter-list .filter-swiper {
  overflow: hidden;
  margin: 0 -1rem;
  padding: 0 1rem;
}
.filter-list .filter-swiper .swiper-slide {
  width: auto;
}
.filter-list .filter-swiper .swiper-scrollbar {
  bottom: -10px;
}

.filter-check .nav-tabs li {
  position: relative;
  min-height: 85px;
}
.filter-check .nav-tabs li + li {
  margin-left: 8px;
}
.filter-check .nav-tabs li:first-child {
  margin-left: 15px;
}
.filter-check .reset button {
  min-width: auto;
  height: auto;
  text-align: center;
  color: var(--color-default);
  opacity: 0.5;
  -webkit-transition: all 300ms;
  transition: all 300ms;
}
.filter-check .reset .icon {
  position: relative;
  top: -14px;
  width: 30px;
  height: 30px;
  margin: 0 auto;
}
.filter-check .reset .icon span {
  font-size: 30px;
}
.filter-check .reset .txt {
  height: auto;
  position: absolute;
  left: 0;
  right: 0;
  top: 24px;
  font-size: 12px;
}
.filter-check .checkbox-control .checkbox-label {
  padding: 0;
  margin: 0;
}
.filter-check .checkbox-control .checkbox-label .title {
  position: absolute;
  bottom: -30px;
  left: 0;
  right: 0;
  opacity: 0.5;
  font-size: 12px;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-height: 1.1em;
  -webkit-line-clamp: 2;
  min-height: 2.2em;
}
.filter-check .checkbox-control .checkbox-label .checkmark {
  border-radius: 50%;
  left: unset;
  z-index: 100;
  right: 0;
  width: 15px;
  height: 15px;
  opacity: 0;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.filter-check .checkbox-control .checkbox-label .checkmark:after {
  left: calc(50% - 3px);
  top: 3px;
  width: 5px;
  height: 8px;
}
.filter-check .checkbox-control .checkbox-label .checkicon {
  display: block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: transparent;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.filter-check .checkbox-control .checkbox-label img {
  border-radius: 50%;
  width: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}
.filter-check .checkbox-control .checkbox-label input:checked ~ .title {
  color: var(--color-primary);
  opacity: 1;
}
.filter-check .checkbox-control .checkbox-label input:checked ~ .checkmark {
  opacity: 1;
}
.filter-check .checkbox-control .checkbox-label input:checked ~ .checkicon {
  background-color: var(--color-primary-light);
}
.filter-check .checkbox-control .checkbox-label input:checked ~ img {
  -webkit-filter: unset;
          filter: unset;
}

@media (min-width: 576px) {
  .filter-collapse .navbar-collapse {
    width: 85%;
  }
  .filter-collapse .navbar-collapse.collapsing {
    left: -85%;
  }
}
@media (min-width: 768px) {
  .filter-collapse .navbar-collapse {
    width: 50%;
  }
  .filter-collapse .navbar-collapse.collapsing {
    left: -50%;
  }
  .filter-collapse .navbar-collapse .scroll-content {
    padding-right: 30px;
  }
}
@media (min-width: 992px) {
  .filter-collapse .navbar-collapse {
    width: 40%;
  }
  .filter-collapse .navbar-collapse.collapsing {
    left: -40%;
  }
}
@media (min-width: 1200px) {
  .filter-collapse .navbar-collapse {
    width: 30%;
  }
  .filter-collapse .navbar-collapse.collapsing {
    left: -30%;
  }
}
@media (min-width: 1600px) {
  .filter-collapse .navbar-collapse {
    width: 25%;
  }
  .filter-collapse .navbar-collapse.collapsing {
    left: -25%;
  }
}
.category {
  margin-bottom: 0.5rem;
}
.category .nav-tabs {
  border: none;
}
.category .nav-tabs .nav-link {
  text-align: center;
  color: var(--color-default);
  padding: 4px 8px;
  border-radius: 0;
  border: 1px solid transparent;
  opacity: 0.5;
  -webkit-transition: all 300ms;
  transition: all 300ms;
  font-size: var(--typo-sm);
  min-width: 60px;
  border-radius: 3px;
}
.category .nav-tabs .nav-link .icon {
  width: 24px;
  height: 24px;
  margin: 0 auto;
  margin-bottom: 0.25rem;
}
.category .nav-tabs .nav-link .icon img {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
.category .nav-tabs .nav-item.show .nav-link,
.category .nav-tabs .nav-link.active {
  color: var(--color-primary);
  background-color: var(--color-primary-light);
  border-color: var(--color-primary);
  opacity: 1;
}
.category .nav-tabs .nav-item.show .nav-link .icon img,
.category .nav-tabs .nav-link.active .icon img {
  -webkit-filter: none;
          filter: none;
}

.total-items {
  font-size: var(--typo-md);
  margin-bottom: 1.25rem;
  opacity: 0.5;
}

@media (min-width: 575px) {
  .category .nav-tabs .nav-link {
    padding-left: 2.35rem;
    padding-right: 2.35rem;
  }
}
@media (min-width: 640px) {
  .category .nav-tabs .nav-link {
    padding-left: 2.85rem;
    padding-right: 2.85rem;
  }
}
.cookie-tab .text {
  font-size: var(--typo-sm);
  line-height: 1.2em;
}
.cookie-tab .link {
  color: var(--color-primary);
  text-decoration: underline;
}
.cookie-tab .fixed-bottom .wrapper {
  padding: 1.5rem 1rem;
}
.cookie-tab .action {
  text-align: right;
  margin-top: 1rem;
}
.cookie-tab .action .btn {
  min-width: 60px;
}
.cookie-tab .action .btn + .btn {
  margin-left: 5px;
}

@media (max-width: 575px) {
  .cookie-tab .action .btn {
    line-height: 28px;
    height: 30px;
  }
}
@media (max-width: 320px) {
  .cookie-tab .action .btn {
    width: 100%;
  }
  .cookie-tab .action .btn + .btn {
    margin-bottom: 10px;
    margin-left: 0;
  }
  .cookie-tab .action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
.site-header .fixed-top {
  z-index: 1031;
}
.site-header .app-width > [class*=container] {
  background-color: var(--color-light);
  height: 60px;
  padding: 0 10px;
}
.site-header .navbar {
  padding: 0;
}
.site-header .navbar-collapse-left {
  background-image: url(../img/background/bg-graphic-header.svg);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 290px;
}
.site-header .bg-primary .navbar-toggler,
.site-header .bg-primary .navbar-nav .nav-link {
  color: var(--color-light);
}
.site-header .bg-primary .navbar-toggler .icon span[class*=material-symbols],
.site-header .bg-primary .navbar-nav .nav-link .icon span[class*=material-symbols] {
  top: 0;
}
.site-header .bg-primary .navbar-toggler .icon img,
.site-header .bg-primary .navbar-nav .nav-link .icon img {
  -webkit-filter: grayscale(1) invert(1) brightness(2);
          filter: grayscale(1) invert(1) brightness(2);
  width: 24px;
  height: 24px;
}
.site-header .bg-primary .navbar-toggler .icon span,
.site-header .bg-primary .navbar-nav .nav-link .icon span {
  color: var(--color-light);
}
.site-header .bg-primary .navbar-toggler .inner,
.site-header .bg-primary .navbar-nav .nav-link .inner {
  padding-left: 10px;
  font-size: var(--typo-md);
  font-weight: 400;
}
.site-header .bg-primary.navbar-collapse-left {
  color: var(--color-light);
}
.site-header .bg-primary.navbar-collapse-left hr {
  border-top-color: rgba(0, 0, 0, 0.2);
}
.site-header .navbar-toggler.btn,
.site-header .notification .btn {
  min-width: 38px;
  padding: 0;
}
.site-header .navbar-nav .nav-item:last-child {
  margin-bottom: 1rem;
}
.site-header .navbar-nav .nav-link {
  font-size: var(--typo-md);
  padding: 1rem 0;
}
.site-header .navbar-nav .nav-menu .menu-body {
  padding: 0 2.5rem;
}
.site-header .navbar-nav .dropdown-toggle {
  position: relative;
}
.site-header .navbar-nav .dropdown-toggle:after {
  font-family: "feather" !important;
  content: "\e842";
  position: absolute;
  right: 0;
  top: calc(50% - 11px);
  position: absolute;
  border: none;
  -webkit-transition: all 200ms;
  transition: all 200ms;
}
.site-header .navbar-nav .dropdown-toggle:not(.collapsed)::after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.site-header .navbar-toggler > div {
  position: relative;
  margin: 0 auto;
  width: 20px;
  height: 14px;
}
.site-header .navbar-collapse-left .navbar-toggler.close {
  position: absolute;
  top: 10px;
  right: 10px;
}
.site-header .navbar-collapse-left .navbar-toggler.close .bar {
  background-color: var(--color-light);
}
.site-header .navbar-collapse {
  z-index: 1;
  padding-top: 40px;
}
.site-header .navbar-collapse .navbar-toggler {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.site-header .nav-wrapper {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.site-header .navbar-brand {
  mix-blend-mode: multiply;
  margin: 0 auto;
  padding: 0;
}
.site-header .navbar-brand img {
  width: 70px;
}
.site-header .navbar-collapse-left {
  position: fixed;
  top: 0;
  left: 0;
  padding-left: 22px;
  padding-right: 22px;
  padding-bottom: 0;
  width: 88%;
  height: 100%;
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}
.site-header .navbar-collapse-left .scroll-content {
  margin-right: -15px;
  padding-right: 15px;
  max-height: calc(100vh - 5rem - 57px);
}
.site-header .navbar-collapse-left .scroll-wrapper {
  max-height: calc(100vh - 5rem - 57px);
  padding-bottom: 4rem;
}
.site-header .navbar-collapse-right {
  position: fixed;
  top: 0;
  right: 0;
  padding-top: 1.2rem;
  padding-bottom: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: right 300ms ease-in-out;
  transition: right 300ms ease-in-out;
}
.site-header .navbar-collapse-right .navbar-wrapper {
  padding: 0 1rem;
}
.site-header .navbar-collapse-right .navbar-wrapper .whead {
  margin-bottom: 0.75rem;
}
.site-header .navbar-collapse-right .navbar-wrapper .whead .h-title {
  font-size: var(--typo-xl);
}
.site-header .navbar-collapse-right .navbar-toggler {
  top: 1.2rem;
  right: 0.4rem;
}
.site-header .navbar-collapse-right .navbar-toggler > div {
  width: 24px;
  height: 24px;
}
.site-header .navbar-collapse-right .navbar-toggler .bar {
  background-color: var(--color-secondary);
}
.site-header .navbar-collapse-left.collapsing {
  left: -88%;
  -webkit-transition: height 0s ease;
  transition: height 0s ease;
}
.site-header .navbar-collapse-right.collapsing {
  right: -88%;
  -webkit-transition: height 0s ease;
  transition: height 0s ease;
}
.site-header .navbar-collapse-left.show {
  left: 0;
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}
.site-header .navbar-collapse-right.show {
  right: 0;
  -webkit-transition: right 300ms ease-in-out;
  transition: right 300ms ease-in-out;
}
.site-header .navbar-toggler.collapsed ~ .navbar-collapse-left {
  -webkit-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}
.site-header .navbar-toggler.collapsed ~ .navbar-collapse-right {
  -webkit-transition: right 300ms ease-in-out;
  transition: right 300ms ease-in-out;
}
.site-header .navbar-toggler {
  border-color: transparent;
}
.site-header .navbar-toggler:focus {
  outline: none;
}
.site-header .navbar-toggler .bar {
  position: absolute;
  width: 100%;
  height: 2px;
  left: 0;
  background-color: var(--color-black);
  margin: auto;
  border-radius: 2px;
  -webkit-transition: All 400ms ease;
  -moz-transition: All 400ms ease;
  -o-transition: All 400ms ease;
}
.site-header .navbar-toggler .bar:nth-child(1) {
  top: 0;
}
.site-header .navbar-toggler .bar:nth-child(2) {
  top: 0;
  bottom: 0;
  width: 75%;
}
.site-header .navbar-toggler .bar:nth-child(3) {
  top: 0;
  bottom: 0;
  width: 75%;
}
.site-header .navbar-toggler .bar:nth-child(4) {
  bottom: 0;
}
.site-header .navbar-toggler.collapsed,
.site-header .navbar-toggler.close {
  opacity: 1;
}
.site-header .navbar-toggler.close .bar:nth-child(1) {
  top: 0;
  opacity: 0;
}
.site-header .navbar-toggler.close .bar:nth-child(2) {
  top: 0;
  bottom: 0;
  width: 100%;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.site-header .navbar-toggler.close .bar:nth-child(3) {
  top: 0;
  bottom: 0;
  width: 100%;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
}
.site-header .navbar-toggler.close .bar:nth-child(4) {
  bottom: 0;
  opacity: 0;
}

.site-header .bg-drop::after {
  position: fixed;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 0;
}
.site-header .menu-mobile {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1029;
}
.site-header .menu-mobile > div {
  -webkit-box-shadow: 0px -0.14rem 1.4rem rgba(0, 0, 0, 0.1);
          box-shadow: 0px -0.14rem 1.4rem rgba(0, 0, 0, 0.1);
}
.site-header .menu-mobile .item {
  text-align: center;
}
.site-header .menu-mobile .item .icon {
  width: 24px;
  height: 24px;
  margin: 0 auto;
  margin-bottom: 0.4rem;
}
.site-header .menu-mobile .link {
  display: block;
  color: var(--color-dark);
  background-color: var(--color-light);
  padding: 6px 10px 16px 10px;
  font-size: 12px;
  font-weight: 500;
}
.site-header .menu-mobile .link.active {
  color: var(--color-primary);
  background-color: var(--color-primary-light);
}
.site-header .menu-mobile .link:not(.active) .icon {
  -webkit-filter: grayscale(1) brightness(0.4);
          filter: grayscale(1) brightness(0.4);
}
.site-header .header-line {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 15px;
}
.site-header .header-line .link {
  width: auto;
  height: 30px;
  border-radius: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-dark);
}
.site-header .header-line .link .icon {
  width: 20px;
  margin-right: 6px;
}
.site-header .header-line .link > img {
  width: 28px;
  height: 30px;
  -o-object-fit: cover;
     object-fit: cover;
}
.site-header .navbar-brand {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
          transform: translate(-50%, 0%);
}
.site-header .navbar-brand img {
  height: 60px;
}
.site-header .cart-btn {
  right: 45px;
}

@media (min-width: 576px) {
  .site-header .navbar-collapse-left,
  .site-header .navbar-collapse-right {
    width: 85%;
  }
  .site-header .navbar-collapse-left.collapsing {
    left: -85%;
  }
  .site-header .navbar-collapse-right.collapsing {
    right: -85%;
  }
}
@media (min-width: 768px) {
  .site-header .navbar-collapse-left,
  .site-header .navbar-collapse-right {
    width: 50%;
  }
  .site-header .navbar-collapse-left.collapsing {
    left: -50%;
  }
  .site-header .navbar-collapse-right.collapsing {
    right: -50%;
  }
  .site-header .navbar-collapse-left .scroll-content {
    padding-right: 30px;
  }
}
@media (min-width: 992px) {
  .site-header .navbar-collapse-left,
  .site-header .navbar-collapse-right {
    width: 40%;
  }
  .site-header .navbar-collapse-left.collapsing {
    left: -40%;
  }
  .site-header .navbar-collapse-right.collapsing {
    right: -40%;
  }
}
@media (min-width: 1200px) {
  .site-header .navbar-collapse-left,
  .site-header .navbar-collapse-right {
    width: 30%;
  }
  .site-header .navbar-collapse-left.collapsing {
    left: -30%;
  }
  .site-header .navbar-collapse-right.collapsing {
    right: -30%;
  }
}
@media (min-width: 1600px) {
  .site-header .navbar-collapse-left,
  .site-header .navbar-collapse-right {
    width: 25%;
  }
  .site-header .navbar-collapse-left.collapsing {
    left: -25%;
  }
  .site-header .navbar-collapse-right.collapsing {
    right: -25%;
  }
}
body,
.global-container {
  background-color: #f4f4f5;
}

.site-container {
  padding-top: 60px;
}

.default-page {
  padding-bottom: 74px;
  min-height: calc(100dvh - 60px);
}
.default-page .default-head .default-filter {
  padding-top: 1rem;
}

.default-body {
  overflow: hidden;
}

.badge-danger {
  background-color: var(--color-danger);
}

.badge-secondary {
  background-color: var(--color-secondary);
}

.badge-secondary-mycart {
  background-color: var(--color-secondary);
}

.noti-btn {
  position: relative;
}
.noti-btn .badge {
  position: absolute;
  top: 7px;
  right: calc(50% - 0.6rem);
  font-size: 0;
  padding: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}
.noti-btn .badge-danger {
  color: var(--color-danger);
}

.cart-btn {
  position: relative;
}
.cart-btn .badge {
  position: absolute;
  top: 0.25rem;
  right: 0;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  padding: 0 0.1rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.profile-block {
  margin-bottom: 1rem;
}
.profile-block .thumbnail {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 2px solid #124229;
  overflow: hidden;
}
.profile-block .thumbnail .cover {
  padding-top: 100%;
}
.profile-block .title {
  font-size: var(--typo-xl);
  line-height: 1em;
  margin-bottom: 0.3em;
}
.profile-block .point.badge {
  font-size: 68%;
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 500;
  line-height: 1em;
  padding: 4px 10px;
}

.bg-drop .navbar .header-bg-drop::after,
.bg-drop .filter-bg-drop::after {
  position: fixed;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 300ms;
  transition: all 300ms;
}

.bg-drop .filter-bg-drop::after {
  z-index: 1031;
}

.bg-drop.show-right, .bg-drop.show-left, .bg-drop.show-filter {
  height: 100vh;
  overflow: hidden;
}
.bg-drop.show-right .navbar .navbar-toggler-right.header-bg-drop::after, .bg-drop.show-left .navbar .navbar-toggler-left.header-bg-drop::after, .bg-drop.show-filter .filter-collapse .navbar-toggler.header-bg-drop::after {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}
.bg-drop.show-right .navbar .navbar-toggler-right.filter-bg-drop::after, .bg-drop.show-left .navbar .navbar-toggler-left.filter-bg-drop::after, .bg-drop.show-filter .filter-collapse .navbar-toggler.filter-bg-drop::after {
  opacity: 1;
  visibility: visible;
}

.headline .h-title {
  color: var(--color-dark);
  font-size: var(--typo-xxl);
  line-height: 1.1em;
}
.headline .title {
  font-size: var(--typo-lg);
}

.home-tab .tabbable {
  margin: 0 -15px;
}
.home-tab .tabbable .nav-tabs {
  padding: 0 15px;
  padding-bottom: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.home-tab .tabbable .nav-tabs .nav-link {
  white-space: nowrap;
}
.home-tab .nav-tabs {
  border: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  /* one item */
}
.home-tab .nav-tabs .nav-link:not(.active) {
  opacity: 0.6;
}
.home-tab .nav-tabs .nav-item,
.home-tab .nav-tabs .nav-link {
  color: var(--color-default);
  text-align: center;
  border: none;
}
.home-tab .nav-tabs .nav-item span,
.home-tab .nav-tabs .nav-link span {
  position: relative;
}
.home-tab .nav-tabs .nav-item span::after,
.home-tab .nav-tabs .nav-link span::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background-color: var(--color-primary);
  opacity: 0;
  visibility: hidden;
}
.home-tab .nav-tabs .nav-item.show .nav-link,
.home-tab .nav-tabs .nav-link.active {
  color: var(--color-primary);
}
.home-tab .nav-tabs .nav-item.show .nav-link span::after,
.home-tab .nav-tabs .nav-link.active span::after {
  opacity: 1;
  visibility: visible;
}
.home-tab .tab-content {
  padding-top: calc(1rem - 10px);
}

.tabbable {
  margin: 0 -15px;
}

.tabbable .nav-tabs {
  padding: 0 15px;
  padding-bottom: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
}
.tabbable .nav-tabs::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}

.tabbable .nav-tabs .nav-link {
  white-space: nowrap;
}

.default-tab .nav-tabs {
  border: none;
}
.default-tab .nav-tabs .nav-link {
  padding: 0.8rem 1rem;
}
.default-tab .nav-tabs .nav-link:not(.active) {
  opacity: 0.6;
}
.default-tab .nav-tabs .nav-item,
.default-tab .nav-tabs .nav-link {
  position: relative;
  font-size: var(--typo-md);
  font-weight: 500;
  color: var(--color-default);
  text-align: center;
  border: none;
}
.default-tab .nav-tabs .nav-item::after,
.default-tab .nav-tabs .nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background-color: var(--color-border);
  -webkit-transition: all 200ms;
  transition: all 200ms;
}
.default-tab .nav-tabs .nav-item.show .nav-link::after,
.default-tab .nav-tabs .nav-link.active::after {
  height: 3px;
  background-color: var(--color-primary);
}
.default-tab .tab-content {
  padding-top: calc(1rem - 10px);
}

.fav-btn {
  padding: 0;
  height: auto;
  line-height: 1;
}
.fav-btn .icon > span {
  color: var(--color-dark);
}
.fav-btn .icon > span.material-symbols-rounded-fill {
  color: #e92038;
}

.back-block {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  background-color: #f8f9fa;
}
.back-block .link {
  font-size: var(--typo-md);
  color: var(--color-default) !important;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.back-block .link .icon span {
  font-size: 20px;
  font-weight: 400;
}
.back-block .link .txt {
  margin-left: 0.5rem;
}

.topbar .favourite {
  left: -3px;
}
.topbar .favourite .btn .icon > span {
  color: var(--color-dark);
}
.topbar .favourite .btn .icon > span.material-symbols-rounded-fill {
  color: #e92038;
}
.topbar .favourite .txt {
  font-size: var(--typo-xs);
}
.topbar .share .btn {
  color: var(--color-primary);
}
.topbar .share .btn .txt {
  font-size: var(--typo-md);
}
.topbar .favourite,
.topbar .share {
  position: relative;
  z-index: 1020;
}
.topbar .favourite .btn,
.topbar .share .btn {
  font-size: var(--typo-xl);
  color: var(--color-default);
  padding: 0;
  height: auto;
  line-height: 1;
}
.topbar .dropdown.show .btn {
  color: var(--color-primary);
}

.quantity {
  padding: 0;
  border-radius: 3px;
  background-color: transparent;
  border: 1px solid var(--color-gray-150);
}
.quantity input {
  color: var(--color-default);
  background-color: transparent;
}
.quantity input[type=text] {
  color: var(--color-dark);
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  text-align: center;
  max-width: 30px;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  background-color: #fff;
}
.quantity input[type=text]:focus {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.quantity input,
.quantity button {
  width: 30px;
  height: 30px;
  line-height: 30px;
  border: none;
}
.quantity .btn-number {
  padding: 0;
  min-width: unset;
  color: var(--color-secondary);
}
.quantity .btn-number span {
  line-height: 30px;
  font-weight: 400;
  font-size: 20px;
}
.quantity .quantity-left-minus:hover,
.quantity .quantity-left-minus:active {
  color: var(--color-danger);
}
.quantity .quantity-right-plus:hover,
.quantity .quantity-right-plus:active {
  color: var(--color-primary);
}
.quantity .btn-number.disabled,
.quantity .btn-number:disabled {
  color: var(--color-gray);
}
.quantity.-lg {
  padding: 0;
}
.quantity.-lg input,
.quantity.-lg button {
  height: 40px;
}
.quantity.-lg button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.quantity.-lg .btn-number span {
  position: relative;
  top: -1px;
}
.quantity.-lg input[type=text] {
  font-size: var(--typo-xl);
  max-width: 50px;
}

.detail-page .whead .title {
  font-size: var(--typo-xl);
}

.collapse-default {
  border: none;
  border-radius: 0;
}
.collapse-default .card {
  border: none;
  border-radius: 0;
  border-bottom: 1px solid var(--color-border);
}
.collapse-default .card-header {
  background: transparent;
  padding: 0.5rem;
  border-radius: 0;
  border-bottom: none;
}
.collapse-default .card-header .link {
  display: block;
  padding: 0.5rem 0;
}
.collapse-default .card-header .btn {
  width: 100%;
  text-align: left;
  height: unset;
  text-decoration: none;
  color: var(--color-dark);
}
.collapse-default .card-header .btn > .row {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.collapse-default .card-header .link:not(.collapsed),
.collapse-default .card-header .btn:not(.collapsed) {
  color: var(--color-primary);
}
.collapse-default .card-header .link:after,
.collapse-default .card-header .btn:after {
  font-family: "Material Symbols Outlined";
  content: "\e5ce";
  float: right;
  font-weight: 200;
  font-size: 30px;
  position: relative;
  right: -8px;
}
.collapse-default .card-header .link.collapsed:after,
.collapse-default .card-header .btn.collapsed:after {
  /* symbol for "collapsed" panels */
  content: "\e5cf";
}
.collapse-default .card-body {
  padding-left: 1rem;
  padding-right: 1rem;
}

.total-payment .title,
.credit-summary .title {
  font-size: var(--typo-default);
  color: var(--color-dark);
}
.total-payment .total,
.credit-summary .total {
  margin-top: 8px;
  font-size: var(--typo-xxl);
  color: var(--color-primary);
  font-weight: var(--fw-medium);
}
.total-payment .wrapper,
.credit-summary .wrapper {
  padding: 1rem;
  -webkit-box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
          box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
}
.total-payment .wrapper .action,
.credit-summary .wrapper .action {
  -webkit-box-shadow: none;
          box-shadow: none;
  padding: 0;
}

.bank-info {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.bank-info .card {
  min-height: 250px;
  padding: 15px;
  -webkit-box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.05);
          box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.05);
}
.bank-info .whead {
  margin-bottom: 15px;
}
.bank-info .bank-img {
  width: 66px;
  height: 66px;
  border: 1px solid #ebebeb;
  border-radius: 3px;
  padding: 5px;
}
.bank-info .bank-img .contain {
  padding-top: 100%;
}
.bank-info .bank-title,
.bank-info .account-name,
.bank-info .account-number {
  font-size: var(--typo-md);
  font-weight: var(--fw-light);
  line-height: 1.4em;
}
.bank-info .btn-copy {
  margin-top: 10px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}
.bank-info .btn-copy div {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}

.btn-copy {
  color: var(--color-default);
  min-width: unset;
  padding: 0 15px;
  border: 1px solid #ebebeb;
  text-align: center;
}
.btn-copy .icon > span {
  font-size: 20px;
  position: relative;
}
.btn-copy:hover, .btn-copy:active {
  background-color: #f4f4f5;
}
.btn-copy .txt {
  font-weight: var(--fw-normal);
  margin-left: 0.25rem;
}

.attachment {
  padding-bottom: 0rem;
  margin-bottom: 0rem;
}
.attachment .btn {
  line-height: 40px;
  height: 42px;
  width: 100%;
  margin-bottom: 0;
}
.attachment .btn .icon > span {
  top: 0;
}
.attachment .btn-input {
  padding: 0 25px;
}
.attachment .txt {
  margin-left: 0.25rem;
}
.attachment .file-input {
  visibility: hidden;
  display: none;
}
.attachment .file-uploaded {
  margin-top: 10px;
  position: relative;
  width: 100%;
}
.attachment .file-uploaded button[type=reset] {
  position: absolute;
  right: 6px;
  top: 3px;
  min-width: unset;
  height: 20px;
  width: 20px;
  color: var(--color-primary);
  line-height: 20px;
  padding: 0;
}
.attachment .file-uploaded button[type=reset] span {
  font-size: 20px;
}
.attachment .file-uploaded .file-name {
  color: var(--color-primary);
  border-radius: 2px;
  padding: 5px 30px 5px 10px;
  background-color: var(--color-primary-light);
}

@media (max-width: 375px) {
  .bank-info .bank-img {
    margin-bottom: 0.5rem;
  }
  .bank-info .btn-copy {
    margin-top: 0.5rem;
  }
}
.option-default .item-list > li {
  margin-bottom: 8px;
}
.option-default .form-group {
  margin-bottom: 0;
}
.option-default .btn {
  color: var(--color-dark);
  text-align: unset;
  height: unset;
  line-height: 1.2em;
  border-color: var(--color-gray-150);
  padding: 12px;
  margin-bottom: 0;
}
.option-default .btn:hover {
  border-color: var(--color-primary);
  background-color: var(--color-primary-light);
}
.option-default .btn .d-flex {
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
}
.option-default .btn .txt .title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4em;
}
.option-default .btn .txt .desc {
  font-size: 13px;
  line-height: 1.2em;
  margin-bottom: 0;
  opacity: 0.8;
  margin-top: 2px;
}
.option-default .btn .price {
  font-size: var(--typo-md);
  font-weight: 500;
  margin-left: auto;
  white-space: nowrap;
  margin-top: 2px;
}
.option-default .btn-primary {
  margin-top: 6px;
  border-radius: 3px;
  border: none;
  text-align: center;
}
.option-default .btn-primary:hover {
  background-color: var(--color-primary);
}
.option-default input {
  display: none;
}
.option-default input:checked ~ .btn {
  color: var(--color-primary);
  border-color: #62aa84;
  background-color: var(--color-primary-light);
}
.option-default input:checked ~ .btn:hover {
  border-color: var(--color-primary);
}
.option-default .icon {
  width: 40px;
  height: 40px;
  border-radius: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.option-default .brand {
  width: 40px;
  height: 40px;
  background-color: #fff;
  border-radius: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.option-default .brand ~ .txt {
  margin-left: 0.6rem;
}

.btn .icon ~ .txt,
.btn-link .icon ~ .txt {
  margin-left: 0.4rem;
}

.link .icon ~ .txt {
  margin-left: 0.25rem;
}

.my-coupon {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.my-coupon .btn {
  text-align: left;
  border: 1px dashed #d4d5d7;
  padding: 0 5px 0 15px;
}
.my-coupon .btn .icon > span[class*=material-symbols] {
  top: 0;
  font-size: 20px;
}
.my-coupon .btn .title {
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
}
.my-coupon .btn .subtitle {
  font-size: var(--typo-md);
}
.my-coupon .btn .subtitle::after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  font-size: 26px;
  font-weight: 200;
  line-height: 1;
  color: var(--color-default);
  position: relative;
  top: 8px;
}
.my-coupon .btn .subtitle span[class*=material-symbols] {
  display: none;
}
.my-coupon .btn .subtitle.selected {
  color: var(--color-primary);
}
.my-coupon .btn .subtitle.selected::before {
  font-family: "Material Symbols Outlined";
  content: "\e5ca";
  font-size: 18px;
  font-weight: 300;
  color: var(--color-light);
  position: relative;
  top: 4px;
  left: -5px;
  width: 18px;
  height: 18px;
  line-height: 18px;
  display: inline-block;
  background-color: #62AA84;
  border-radius: 50%;
}

.coupon-list .thumbnail {
  width: 117px;
  height: 117px;
  background-repeat: no-repeat;
  background-size: contain;
}
.coupon-list .thumbnail .cover {
  padding-top: 100%;
}
.coupon-list .thumbnail .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.coupon-list .thumbnail .inner .title {
  font-size: 140%;
  color: var(--color-light);
}
.coupon-list .thumbnail .inner .subtitle {
  font-size: 160%;
  color: var(--color-light);
}
.coupon-list .discount .thumbnail {
  background-color: #62aa84;
  background-image: url(../img/background/bg-graphic-coupon-discount.svg);
  background-position: bottom left;
  background-size: 103px;
}
.coupon-list .free-delivery .thumbnail {
  background-color: #dbb344;
  background-image: url(../img/background/bg-graphic-coupon-discount.svg);
  background-position: bottom left;
  background-size: 103px;
}
.coupon-list .card {
  color: var(--color-default);
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  cursor: pointer;
  -webkit-box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.05);
          box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.05);
  margin-right: 1rem;
}
.coupon-list .card .styled-coupon {
  margin-right: -1rem;
}
.coupon-list .card-body {
  padding: 0;
}
.coupon-list .inner {
  padding: 0.5rem;
}
.coupon-list .inner .title {
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-dark);
  margin-bottom: 0.25rem;
}
.coupon-list .inner .desc {
  font-size: var(--typo-sm);
  line-height: 1.1em;
  height: 3.3em;
  max-height: unset;
  -webkit-line-clamp: 3;
}
.coupon-list .inner .period {
  font-size: var(--typo-xs);
  opacity: 0.45;
}
.coupon-list .checkbox {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  padding-left: 1.5rem;
}
.coupon-list .checkbox .icon {
  width: 24px;
  height: 24px;
  border: 1px solid var(--color-border);
}
.coupon-list .checkbox .icon > span[class*=material-symbols] {
  top: 1px;
  font-size: 22px;
  font-weight: 300;
  opacity: 0;
  visibility: hidden;
}
.coupon-list input {
  display: none;
}
.coupon-list input:checked ~ label .checkbox .icon {
  color: var(--color-light);
  border-color: var(--color-primary);
  background-color: var(--color-primary);
}
.coupon-list input:checked ~ label .checkbox .icon > span[class*=material-symbols] {
  opacity: 1;
  visibility: visible;
}
.coupon-list .styled-coupon {
  width: 1rem;
  height: 100%;
  padding: 0.25rem 0.25rem 0.5rem;
  -webkit-filter: drop-shadow(0.5rem 0 0.25rem rgba(0, 0, 0, 0.04));
          filter: drop-shadow(0.5rem 0 0.25rem rgba(0, 0, 0, 0.04)); /* update the shadow here */
  position: relative;
  z-index: 0;
}
.coupon-list .styled-coupon::before {
  position: absolute;
  content: "";
  top: 0;
  left: -3.75rem;
  bottom: 0;
  width: 3px;
  border-left: 3px dashed var(--color-border);
  opacity: 0.5;
}
.coupon-list .styled-coupon:after {
  content: "";
  position: absolute;
  right: 0;
  z-index: -1;
  inset: 0;
  background: var(--color-light);
  --mask: conic-gradient(from -135deg at right, #0000, #000 1deg 89deg, #0000 90deg) 50%/100% 14px;
  -webkit-mask: var(--mask);
  mask: var(--mask);
}

.file-input {
  display: none;
}

.checkbox-list .item-list > li {
  padding: 15px 0;
  border-bottom: 1px solid var(--color-border);
}
.checkbox-list .form-group .topic {
  font-size: var(--typo-sm);
  line-height: 1.4em;
  opacity: 0.5;
}
.checkbox-list .checkbox-control .checkbox-label {
  padding-left: 18px;
}

.fixed-bottom .wrapper {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-top: 1px solid var(--color-border);
  padding: 1rem 1rem 1.5rem 1rem;
}

.fixed-bottom .app-width > .action {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-top: 1px solid var(--color-border);
  padding: 1rem 1rem 1.5rem 1rem;
}

.progress-default {
  position: relative;
}
.progress-default .progress {
  background-color: #d9d9d9;
}
.progress-default .progress-label {
  font-size: var(--typo-xs);
  font-weight: var(--fw-light);
  color: var(--color-gray-100);
  margin-bottom: 0.5rem;
}
.progress-default .progress-bar {
  background: -webkit-gradient(linear, left top, right top, from(#cb9c24), color-stop(102.3%, #7dc71f));
  background: linear-gradient(90deg, #cb9c24 0%, #7dc71f 102.3%);
  border-radius: 50rem;
}
.progress-default .progress-bar[aria-valuenow="100"] ~ .progress-success::before {
  background-color: #84c31f;
}
.progress-default .progress-success::before {
  font-family: "Material Symbols Outlined";
  position: absolute;
  content: "\e876";
  font-size: 14px;
  color: var(--color-light);
  right: 0;
  line-height: 1;
  bottom: -4px;
  width: 14px;
  height: 14px;
  background-color: var(--color-gray-150);
  border-radius: 50%;
}

.user-mode {
  position: relative;
  z-index: 10000;
  min-height: 100dvh;
  padding: 40px 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background-color: #006738;
}

.user-mode .logo {
  max-width: 200px;
}

.user-mode .link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px 20px 10px 13px;
  border-radius: 50px;
  background-color: #fff;
  color: #444;
  font-size: 14px;
  font-weight: 500;
}

.user-mode .link .icon {
  margin-right: 15px;
}

.user-mode .action {
  margin-top: 20px;
  margin-bottom: 60px;
}

.user_mode .site-header .navbar-toggler.btn {
  display: none;
}
.user_mode .site-header .header-line {
  display: none;
}
.user_mode .site-header .menu-mobile {
  display: none;
}
.user_mode .menu-buttons {
  margin-bottom: 0;
}
.user_mode .menu-buttons > .container-fluid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.user_mode .menu-buttons > .container-fluid > div {
  width: 50%;
}

.recive-point-remark {
  background-color: var(--color-primary);
  border-radius: 3px;
  padding: 25px 15px;
  text-align: center;
  color: #fff;
}
.recive-point-remark .title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2em;
  margin-bottom: 0.5rem;
}
.recive-point-remark .desc {
  font-size: var(--typo-lg);
  font-weight: var(--fw-light);
  line-height: 1.4em;
}

.total-payment .help-block,
.credit-summary .help-block {
  text-align: center;
  margin-bottom: 0.75rem;
}

.option-default.-radio .btn {
  position: relative;
  padding-left: 40px;
}
.option-default.-radio .btn .checkmark {
  position: absolute;
  top: 50%;
  left: 10px;
  height: 18px;
  width: 18px;
  border: 1px solid var(--color-gray-150);
  border-radius: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.option-default.-radio .btn .checkmark::after {
  content: "";
  position: absolute;
  display: none;
  left: calc(50% - 5px);
  top: calc(50% - 5px);
  border-radius: 50%;
  width: 10px;
  height: 10px;
}
.option-default.-radio .btn:hover .checkmark {
  border-color: var(--color-primary);
}
.option-default.-radio input:checked ~ .btn .checkmark {
  border-color: var(--color-primary);
}
.option-default.-radio input:checked ~ .btn .checkmark::after {
  display: block;
  background-color: var(--color-primary);
}

.hero-banner .cover {
  padding-top: 184.6%;
}
.hero-banner .swiper-pagination-bullet {
  background-color: var(--color-light);
}

.banner-slide .swiper > .swiper-wrapper > .swiper-slide {
  width: 300px;
}
.banner-slide .cover {
  margin: 15px 0;
  padding-top: 90%;
  -webkit-box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
}

.vdo-slide .item-list > li {
  float: none;
}
.vdo-slide .iframe-vdo {
  position: relative;
  overflow: hidden;
  padding-top: 177.8%;
}
.vdo-slide .responsive-vdo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  border: none;
}

.review-slide .swiper > .swiper-wrapper > .swiper-slide {
  width: 300px;
}
.review-slide .cover {
  margin: 15px 0;
  padding-top: 92.8%;
  -webkit-box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
}

.wg-overview {
  padding: 1rem 0;
  margin-bottom: 1rem;
}
.wg-overview .link {
  color: var(--color-default);
}
.wg-overview .card {
  text-align: center;
  padding: 0.4rem 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  background-color: transparent;
}
.wg-overview .headline {
  font-size: 20px;
  font-weight: var(--fw-normal);
  line-height: 1.2em;
}
.wg-overview .coupon .btn {
  color: var(--color-primary);
  padding: 0 15px;
}
.wg-overview .row-2 .card {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.wg-overview .row-2 .card .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 20px;
  height: 20px;
  color: var(--color-primary);
}
.wg-overview .row-2 .card .icon img {
  width: 15px;
}
.wg-overview .row-2 .card .rounded-circle {
  background-color: var(--color-primary-light);
}
.wg-overview .row-2 .card .txt {
  font-size: var(--typo-md);
  margin-left: 0.4rem;
}
.wg-overview .row-2 .card .txt span {
  position: relative;
  font-size: var(--typo-md);
  color: var(--color-primary);
  padding-right: 4px;
}
.wg-overview .row-3 .card .icon {
  color: var(--color-primary);
  width: 36px;
  height: 36px;
  margin: 0 auto;
  margin-bottom: 0.4rem;
}
.wg-overview .row-3 .card .icon img {
  width: 36px;
  height: 36px;
}
.wg-overview .row-3 .card .icon span {
  font-size: 36px;
}
.wg-overview .row-3 .card .txt {
  font-size: var(--typo-sm);
  color: var(--color-dark);
}
.wg-overview [class*=row-] + [class*=row-] {
  margin-top: 1rem;
}
.wg-overview .grid-divider {
  border-bottom: 1px solid #eaecee;
  padding-bottom: 1rem;
  margin-left: 0;
  margin-right: 0;
}

.coupon .btn {
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
}

.wg-product {
  overflow: hidden;
  padding-bottom: 2rem;
  background-image: url(../img/background/bg-graphic.svg);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 180px;
}
.wg-product .headline {
  margin-bottom: 2rem;
}

.wg-qualification {
  padding-top: 1rem;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 1rem;
}
.wg-qualification .contain {
  padding-top: 100%;
}

.wg-quote {
  text-align: center;
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.wg-quote .quote {
  width: 16px;
  margin: 0 auto;
  margin-bottom: 1rem;
}
.wg-quote .txt {
  font-size: var(--typo-default);
  color: var(--color-dark);
  line-height: 1.2em;
  margin-bottom: 0;
}
.wg-quote .divider {
  width: 100px;
}

@media (min-width: 576px) {
  .wg-qualification {
    padding-left: 25px;
    padding-right: 25px;
  }
}
.product-page .default-tab .nav-tabs .nav-item {
  min-width: 120px;
}
.product-page .default-tab .nav-tabs {
  margin-bottom: 0.5rem;
}
.product-page .default-tab .nav-tabs .nav-item,
.product-page .default-tab .nav-tabs .nav-link {
  font-size: var(--typo-xxl);
}
.product-page .product-list {
  margin-bottom: 30px;
}
.product-page .product-item .topbar {
  margin-top: 0;
  margin-bottom: 0;
}
.product-page .product-item .subtitle {
  margin-bottom: 0.5rem;
}
.product-page.detail-page .product-detail .product-item .inner .title {
  font-size: var(--typo-xxl);
}
.product-page.detail-page .product-detail .product-item .inner .subtitle {
  font-size: var(--typo-lg);
}
.product-page.detail-page .product-detail .product-item .qty-item .price {
  font-size: var(--typo-md);
}
.product-page.detail-page .product-detail .product-item .qty-item .price span {
  font-size: var(--typo-xxl);
}
.product-page.detail-page .product-detail .product-item .qty-item .price span.discount {
  font-size: var(--typo-sm);
}
.product-page.detail-page .product-detail .product-item .qty-list .qty-item {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.product-page.detail-page .product-detail .product-item .qty-list .qty-item + .qty-item {
  border-top: 1px dashed var(--color-border);
}
.product-page.detail-page .product-detail .product-item .qty-list {
  margin-top: 0;
}
.product-page.detail-page .product-detail .product-item .qty-list .quantity.-lg {
  padding: 0;
}
.product-page.detail-page .product-detail .product-item .qty-list .quantity.-lg input[type=text] {
  max-width: 55px;
}
.product-page.detail-page .product-detail .product-item .qty-list .quantity.-lg .btn-number {
  width: 38px;
}
.product-page.detail-page .product-detail .product-item .inner {
  padding: 0 1rem;
}
.product-page.detail-page .product-detail .product-item .badge-list .btn {
  font-size: var(--typo-sm);
}
.product-page.detail-page .product-detail .tag {
  font-size: var(--typo-md);
  height: 32px;
  line-height: 30px;
}
.product-page.detail-page .product-detail .bullet-list > li {
  width: 50%;
}
.product-page.detail-page .other-product {
  padding-bottom: 1rem;
}
.product-page.detail-page .product-action .action {
  -webkit-box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
          box-shadow: 0px -0.18rem 1.8rem rgba(0, 0, 0, 0.1);
  padding: 1rem 1rem 1.5rem 1rem;
}

.product-content {
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-top: 1px solid var(--color-gray-150);
  border-bottom: 1px solid var(--color-gray-150);
  margin-bottom: 1rem;
}
.product-content .tags {
  margin: 0 -2.5px;
  margin-top: 0;
}
.product-content .tags a {
  display: block;
}
.product-content .tags li {
  width: 20%;
  padding: 2.5px;
}

.product-slide .product-item .inner {
  min-height: 83px;
}

@media (min-width: 575px) {
  .product-page .default-tab .nav-tabs .nav-item {
    min-width: 181px;
  }
}
@media (min-width: 640px) {
  .product-page .default-tab .nav-tabs .nav-item {
    min-width: 202px;
  }
}
.product-list .product-slide > .swiper {
  padding: 0 15px;
}

.product-list .product-slide > .swiper > .swiper-wrapper {
  padding: 0;
  display: grid;
  grid-gap: 0.3rem;
  grid-template-columns: 1fr 1fr;
  grid-auto-flow: dense;
}

.product-list .product-slide > .swiper > .swiper-wrapper > .swiper-slide {
  width: auto;
}

.product-item .title {
  font-size: var(--typo-default);
}

.category ~ .tab-content .whead .h-title {
  margin-top: 10px;
  font-size: var(--typo-lg);
  font-weight: 600;
  line-height: 1.2em;
}

.product-item .inner {
  padding: 10px;
}

.product-list .product-item .topbar .fav-btn .icon > span {
  font-size: 18px;
}

.product-item .topbar {
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 1rem;
  padding-bottom: 0.5rem;
}

.profile-block .head {
  color: var(--color-light);
  background-color: var(--color-primary);
  padding-top: 1.7rem;
  padding-bottom: 5rem;
  background-image: url(../img/background/bg-graphic-header.svg);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 290px;
}
.profile-block .head .link {
  color: var(--color-light);
}
.profile-block .point .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.profile-block .point .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--color-primary);
  background-color: var(--color-primary-light);
  font-size: 10px;
}
.profile-block .point .txt {
  font-size: 13px;
  margin-left: 0.4rem;
  font-weight: 500;
}
.profile-block .card {
  margin-bottom: 1rem;
}

.btn-level {
  border: none;
  height: 20px;
  line-height: 20px;
  border-radius: 10rem;
  min-width: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.btn-level .icon {
  width: 12px;
  height: 12px;
  margin-right: 0.25rem;
}
.btn-level.btn-silver {
  color: #7c7c7c;
  background: linear-gradient(101.07deg, #d9d9d9 5.26%, #fcfcfc 40.45%, #d9d9d9 79.77%, #f9f9f9 120.48%, #d9d9d9 137.73%);
}
.btn-level.btn-gold {
  color: #816a1c;
  background: linear-gradient(101.07deg, #d4af37 5.26%, #f1db96 40.45%, #d4af37 79.77%, #fef3cf 120.48%, #d4af37 137.73%);
}

.menu-buttons {
  margin-top: -55px;
  margin-bottom: 1.5rem;
}
.menu-buttons .btn {
  font-size: var(--typo-md);
  font-weight: var(--fw-normal);
  height: calc(50px + 2rem);
  padding: 1rem 0;
}
.menu-buttons .btn .icon {
  position: relative;
  color: var(--color-primary);
  width: 24px;
  height: 24px;
  margin: 0 auto;
}
.menu-buttons .btn .badge {
  position: absolute;
  top: -0.15rem;
  right: calc(50% - 18px);
  border-radius: 50%;
  width: 18px;
  height: 18px;
  padding: 0.1rem;
  line-height: 16px;
}
.menu-buttons .grid-divider > [class*=col]:nth-child(n+2):after {
  top: 23%;
  height: 54%;
}

.menu-list .item-list > li:not(:last-child) {
  border-bottom: 1px solid var(--color-border);
}
.menu-list .link {
  display: block;
  font-size: var(--typo-md);
  color: var(--color-dark);
  padding: 1rem;
  padding-left: 0;
}
.menu-list .link .icon span {
  top: 1px;
}
.menu-list .link .inner {
  margin-left: 0.5rem;
}

.edit-img label {
  cursor: pointer;
}

.interest-health .btn-link .icon > span[class*=material-symbols] {
  font-size: 20px;
  top: 1px;
}

.credit-page:not(.detail-page) .default-body {
  padding-top: 1.5rem;
}
.credit-page.detail-page .default-body {
  padding-bottom: 2rem;
}
.credit-page.detail-page .product-credit-item .inner {
  padding: 15px;
}
.credit-page.detail-page .whead .title {
  font-size: var(--typo-md);
  font-weight: 600;
}
.credit-page .nav-tabs .nav-item {
  width: 50%;
}
.credit-page .default-tab .tab-content {
  padding-bottom: 2rem;
}
.credit-page .other-product {
  display: none;
}
.credit-page .other-product .product-list .product-slide .swiper-slide {
  width: 308px;
}
.credit-page .default-tab {
  overflow: hidden;
}
.credit-page .alert-default {
  height: calc(100vh - 184px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.credit-page .alert-default .alert-heading {
  font-size: var(--typo-xxl);
}
.credit-page .alert-default .icon.rounded-circle {
  width: 60px;
  height: 60px;
  margin: 0 auto;
  margin-bottom: 1rem;
}
.credit-page .alert-default .icon.rounded-circle span {
  font-size: 40px;
}

.topup-page {
  min-height: calc(100vh - 150px);
}

.credit-block {
  margin-bottom: 1rem;
}
.credit-block .card {
  margin-bottom: 1rem;
  -webkit-box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.1);
}
.credit-block .link {
  color: var(--color-dark);
}
.credit-block .whead .title {
  color: var(--color-primary);
}
.credit-block .whead .title .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--color-primary-light);
  width: 32px;
  height: 32px;
}
.credit-block .whead .title .icon > img {
  width: 21px;
}
.credit-block .card {
  font-size: var(--typo-md);
  padding: 1.5rem 1rem;
}
.credit-block .card span {
  font-size: var(--typo-xl);
}
.credit-block .btn-primary .icon > img {
  width: 26px;
  height: 26px;
}
.credit-block .history {
  margin-top: 1.5rem;
  padding-bottom: 1rem;
}
.credit-block .history .whead {
  margin-bottom: 0.5rem;
}
.credit-block .history .whead .title {
  color: var(--color-dark);
}
.credit-block .history .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 36px;
  height: 36px;
}
.credit-block .history .icon > img {
  width: 26px;
}
.credit-block .history .pay .icon {
  color: var(--color-secondary);
  background-color: var(--color-secondary-light);
}
.credit-block .history .topup .icon {
  background-color: var(--color-primary-light);
}
.credit-block .history .item-wrapper {
  padding: 1rem 0;
}
.credit-block .history .item-wrapper .title,
.credit-block .history .item-wrapper .value {
  font-size: var(--typo-md);
  color: var(--color-dark);
  font-weight: var(--fw-medium);
}
.credit-block .history .item-wrapper .subtitle {
  font-size: var(--typo-sm);
}
.credit-block .history .item-wrapper .col > .row + .row {
  margin-top: 0.5rem;
}
.credit-block .history .status {
  font-size: var(--typo-sm);
}
.credit-block .history .status.pending {
  color: var(--color-secondary);
}
.credit-block .history .status.succeed {
  color: var(--color-primary);
}
.credit-block .history .status.cancel {
  color: var(--color-danger);
}
.credit-block .history .item-list > li + li .item-wrapper {
  border-top: 1px solid var(--color-border);
  margin-top: -1px;
}

.product-credit-list .item-list > li {
  margin-bottom: 15px;
}

.product-credit-item .card {
  border-radius: 3px;
  -webkit-box-shadow: none;
          box-shadow: none;
  overflow: hidden;
  border: 1px solid var(--color-gray-150);
}
.product-credit-item .inner {
  padding: 10px;
}
.product-credit-item .inner .title {
  font-size: var(--typo-xl);
  color: var(--color-dark);
  font-weight: 500;
}
.product-credit-item .thumbnail {
  background-color: #f4f4f5;
}
.product-credit-item .thumbnail .cover,
.product-credit-item .thumbnail .contain {
  padding-top: 100%;
}

.amount-topup {
  min-height: calc(100vh - 420px);
  /* When the checkbox is checked, add a blue background */
}
.amount-topup .item-list {
  margin: 0 -7.5px;
}
.amount-topup .item-list > li {
  width: 50%;
  padding: 0 7.5px;
  margin-bottom: 15px;
}
.amount-topup .form-group {
  margin-bottom: 0;
}
.amount-topup .btn {
  color: var(--color-dark);
  border-color: #62aa84;
  margin-bottom: 0;
}
.amount-topup .btn:hover {
  color: var(--color-light);
  border-color: var(--color-primary);
}
.amount-topup input {
  display: none;
}
.amount-topup input:checked ~ .btn {
  color: var(--color-dark);
  background-color: var(--color-primary-light);
}

.order-history-page {
  min-height: calc(100vh - 78px);
  padding-bottom: 2rem;
}
.order-history-page .default-body {
  padding-top: 1.5rem;
}
.order-history-page .default-tab {
  overflow: hidden;
}
.order-history-page .default-tab .nav-tabs .nav-item {
  width: 160px;
}
.order-history-page .default-tab .tab-content {
  padding-top: 1rem;
}
.order-history-page .alert-default .alert-success .card-header {
  padding: 0.719rem 0.5rem;
  background-color: var(--color-gray-200);
}
.order-history-page .alert-default .alert-success .card-header .btn {
  color: var(--color-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.order-history-page .alert-default .alert-success .card-header .btn:after {
  position: absolute;
  right: 0;
}
.order-history-page .alert-default .alert-success .card-header .btn .alert-heading {
  margin-left: 1rem;
  line-height: 1;
  position: relative;
  top: 0;
  font-weight: var(--fw-medium);
  font-size: var(--typo-xl);
}
.order-history-page .alert-default .alert-success .card-body {
  background-color: var(--color-gray-200);
}
.order-history-page .alert-default .alert-secondary {
  background-color: var(--color-gray-200);
}
.order-history-page .alert-default .tracking-no {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-right: 0.2rem;
}
.order-history-page .alert-default .tracking-no .btn-copy {
  height: 34px;
  line-height: 32px;
  border-color: transparent;
  background-color: var(--color-light);
}
.order-history-page .alert-default .tracking-no .btn-copy .icon {
  display: block;
  width: unset;
  height: unset;
}
.order-history-page .alert-default .tracking-no .btn-copy .icon > span {
  top: 5px;
}
.order-history-page .card-body {
  padding: 15px;
}
.order-history-page .card-body hr {
  margin: 15px 0;
}
.order-history-page .order-list {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.order-history-page .order-list .link {
  color: var(--color-default);
  font-size: var(--typo-sm);
  font-weight: var(--fw-light);
}
.order-history-page .order-list .item-list > li + li {
  margin-top: 10px;
}
.order-history-page .order-list .order-no {
  margin-top: 4px;
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-dark);
  white-space: nowrap;
}
.order-history-page .order-list .order-status.waiting .btn {
  color: var(--color-secondary-dark);
  background-color: var(--color-secondary-light);
}
.order-history-page .order-list .order-status.success .btn {
  color: var(--color-primary);
  background-color: var(--color-primary-light);
}
.order-history-page .order-list .order-status.cancelled .btn {
  color: var(--color-gray);
  background-color: var(--color-gray-200);
}
.order-history-page .order-list .order-total {
  font-size: var(--typo-md);
  font-weight: var(--fw-normal);
  white-space: nowrap;
}
.order-history-page .order-list .order-price {
  font-size: var(--typo-lg);
  font-weight: var(--fw-medium);
  color: var(--color-primary);
  white-space: nowrap;
}
.order-history-page .order-list .order-total {
  color: var(--color-dark);
}
.order-history-page .order-list .order-timestamp {
  padding-top: 2px;
  color: var(--color-gray);
  font-size: 12px;
}
.order-history-page .order-list .order-timestamp:before {
  content: "วันที่สั่ง :";
}
.order-history-page .order-list .icon span {
  font-size: 20px;
}
.order-history-page .order-list .icon img {
  width: 20px;
  -webkit-filter: grayscale(1) brightness(1.25);
          filter: grayscale(1) brightness(1.25);
}
.order-history-page .order-list .icon ~ .txt {
  margin-left: 0.25rem;
}
.order-history-page .wait2pay-alert .alert {
  border-radius: 3px;
  padding: 15px;
  margin-bottom: 10px;
}
.order-history-page .wait2pay-alert .alert .icon {
  width: 40px;
  height: 40px;
}
.order-history-page .wait2pay-alert .alert h4 {
  font-size: var(--typo-xl);
}
.order-history-page .wait2pay-alert .alert-heading {
  font-size: var(--typo-lg);
  font-weight: var(--fw-medium);
}
.order-history-page .wait2pay-alert .title {
  font-size: var(--typo-sm);
  text-align: right;
  margin-bottom: 4px;
}
.order-history-page .wait2pay-alert .desc {
  font-size: var(--typo-sm);
}
.order-history-page .wait2pay-alert .order-price {
  font-size: var(--typo-xl);
  font-weight: var(--fw-medium);
  text-align: right;
}
.order-history-page .alert-cancelled {
  background-color: var(--color-gray-200);
}
.order-history-page .alert-cancelled .icon {
  background: var(--color-gray-150);
}
.order-history-page .alert-cancelled .icon span {
  font-size: 22px;
}
.order-history-page .alert-cancelled .alert-heading {
  font-size: var(--typo-lg);
}
.order-history-page .alert-cancelled .timestamp {
  font-size: var(--typo-sm);
  font-weight: var(--fw-light);
}
.order-history-page .order-detail > div + div {
  margin-top: 5px;
}
.order-history-page .order-detail .icon span {
  font-size: 20px;
}
.order-history-page .order-detail .icon ~ .txt {
  margin-left: 0.5rem;
}
.order-history-page .order-detail .order-address {
  margin-bottom: 2rem;
}
.order-history-page .order-detail .order-address [class*=address-] {
  line-height: 1.4em;
  font-size: var(--typo-default);
}
.order-history-page .order-detail .action {
  text-align: center;
}
.order-history-page .order-detail .action .btn-link {
  font-size: var(--typo-md);
  color: var(--color-gray-100);
}
.order-history-page .order-detail .action .btn-primary {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.order-history-page .styled-receipt {
  width: 100%;
  padding: 1rem 1rem 2rem;
  -webkit-filter: drop-shadow(0 1rem 0.5rem rgba(0, 0, 0, 0.04));
          filter: drop-shadow(0 1rem 0.5rem rgba(0, 0, 0, 0.04)); /* update the shadow here */
  position: relative;
  z-index: 1;
}
.order-history-page .styled-receipt:before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: var(--color-light);
  --mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50%/25px 100%;
  -webkit-mask: var(--mask);
  mask: var(--mask);
}
.order-history-page .order-product-list {
  background-color: var(--color-gray-200);
  -webkit-box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.08);
          box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.08);
  padding-bottom: 1.5rem;
  margin-bottom: 3rem;
}

.order-history .order-timeline {
  padding-left: 14px;
}

.order-timeline .item {
  position: relative;
  padding-left: 1em;
}
.order-timeline .item .title {
  font-size: var(--typo-md);
  color: var(--color-primary);
  padding-left: 24px;
}
.order-timeline .item .desc {
  font-size: var(--typo-xs);
  font-weight: var(--fw-light);
}
.order-timeline .item::before {
  position: absolute;
  content: "";
  top: 0.24em;
  left: 0;
  width: 10px;
  height: 10px;
  background-color: var(--color-primary);
  border-radius: 50%;
  z-index: 1;
}
.order-timeline .item:not(:last-child) {
  padding-bottom: 1rem;
}
.order-timeline .item:not(:last-child)::after {
  position: absolute;
  content: "";
  top: 0.24em;
  left: 4px;
  bottom: -0.24em;
  width: 2px;
  background-color: var(--color-dark);
  opacity: 0.2;
}
.order-timeline .item:not(.active) .title {
  color: var(--color-dark);
  opacity: 0.35;
}
.order-timeline .item:not(.active) .timestamp {
  display: none;
}
.order-timeline .item:not(.active)::before {
  background-color: var(--color-dark);
  opacity: 0.35;
}

.earned-points {
  margin-top: 3rem;
  background-color: transparent;
}
.earned-points .card {
  background-color: transparent;
}
.earned-points .card-body {
  padding-top: 1.5rem;
  padding-bottom: 0;
}
.earned-points .icon {
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  background-color: var(--color-primary-light);
}
.earned-points .title {
  font-size: var(--typo-md);
}
.earned-points .points {
  font-size: var(--typo-xl);
  color: var(--color-primary);
}

.order-product-list .card {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.order-product-list .card-header {
  padding: 10px 15px;
  border-radius: 0;
  border-bottom: none;
}
.order-product-list .card-header .btn {
  padding: 0;
  border: none;
  line-height: 1.2em;
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-dark);
}
.order-product-list .card-header .btn:not(.collapsed) {
  color: var(--color-dark);
}
.order-product-list .card-body {
  padding: 15px;
}
.order-product-list .stock-product-list .card-header {
  background-color: var(--color-secondary-light);
}
.order-product-list .send-product-list .card-header {
  background-color: var(--color-primary-light);
}
.order-product-list .thumbnail {
  width: 58px;
  height: 58px;
}
.order-product-list .thumbnail .cover {
  padding-top: 100%;
}
.order-product-list .product-item .checkbox-control {
  margin-top: 1.2rem;
}
.order-product-list .product-item .inner {
  padding: 0;
  margin-left: 10px;
}
.order-product-list .product-item .title {
  color: var(--color-dark);
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  margin-top: 0.2rem;
  margin-bottom: 0.5rem;
}
.order-product-list .product-item .amount {
  margin-bottom: 0.5rem;
}
.order-product-list .product-item .price {
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-primary);
  padding: 3px 0;
}
.order-product-list .product-group {
  border-bottom: 1px solid var(--color-border);
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.order-product-list .product-group:last-child {
  margin-bottom: 0;
}
.order-product-list .product-group .product-item {
  list-style: none;
}
.order-product-list .product-group .product-item + .product-item {
  margin-top: 1rem;
}
.order-product-list .styled-receipt {
  margin-bottom: -3rem;
}
.order-product-list .order-summary .price {
  font-weight: var(--fw-medium);
}

.order-summary .card-body > .row + .row {
  margin-top: 1rem;
}
.order-summary .title,
.order-summary .price,
.order-summary .desc {
  font-size: var(--typo-md);
  color: var(--color-dark);
}
.order-summary .net-balance .title,
.order-summary .net-balance .price {
  font-size: var(--typo-lg);
  font-weight: var(--fw-medium);
  color: var(--color-primary);
}
.order-summary .payment .desc {
  font-weight: var(--fw-medium);
  padding-right: 15px;
}
.order-summary .payment .title,
.order-summary .transaction-date .title {
  font-weight: var(--fw-medium);
}

@media (max-width: 360px) {
  .wait2pay-alert .title {
    text-align: unset;
  }
}
.order-product-list .product-item .inner .swiper-slide {
  display: none;
}

.product-order-divide {
  padding: 1rem 0;
  margin-bottom: 1.5rem;
  background-color: var(--color-gray-200);
}
.product-order-divide .title {
  font-size: var(--typo-lg);
  font-weight: var(--fw-medium);
  line-height: 1.2em;
  margin-bottom: 0.5rem;
}
.product-order-divide .desc {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--typo-md);
}
.product-order-divide .desc img {
  margin-right: 0.25rem;
}

.container-fluid .product-order-divide {
  padding: 1rem;
  margin-left: -1rem;
  margin-right: -1rem;
}

.order-divide-step {
  margin-bottom: 1.5rem;
}
.order-divide-step .item {
  font-size: var(--typo-md);
  line-height: 1;
  text-align: center;
  padding: 1rem;
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: 0.25rem;
}
.order-divide-step .item.active {
  color: var(--color-light);
  background-color: var(--color-primary);
}
.order-divide-step .item strong {
  display: block;
  font-size: var(--typo-biggest);
  font-weight: var(--fw-bold);
  padding-top: 0.5rem;
}
.order-divide-step .item.checked {
  position: relative;
}
.order-divide-step .item.checked::after {
  content: "\e5ca";
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: "liga";
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  top: -10px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  width: 21px;
  height: 21px;
  line-height: 20px;
  border-radius: 50%;
  border: 1px solid var(--color-light);
  background: var(--color-secondary);
  color: var(--color-light);
  text-align: center;
  font-size: 16px;
}

.shipping-date {
  font-size: var(--typo-md);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.shipping-date .icon > span[class*=material-symbols] {
  top: 0;
}

.order-product-list .send-product-list + .send-product-list {
  margin-top: 0.75rem;
}

.search-product-page .card-body {
  padding: 1rem;
}
.search-product-page .product-item {
  margin-bottom: 1.25rem;
}
.search-product-page .product-item .qty-item .price {
  padding: 2px 0;
}
.search-product-page .product-item .card-body {
  padding: 1rem;
}
.search-product-page .quantity {
  padding: 0 5px;
}
.search-product-page .quantity input[type=text] {
  max-width: 40px;
  padding: 0 4px;
}

.checkout-page .default-body {
  padding-bottom: 2rem;
}
.checkout-page .order-product-list {
  margin-bottom: 1.5rem;
}
.checkout-page .link {
  color: var(--color-primary);
}
.checkout-page .alert-default .alert:not(.alert-secondary) .icon.rounded-circle {
  width: 60px;
  height: 60px;
  margin: 0 auto;
}
.checkout-page .alert-default .alert:not(.alert-secondary) .icon.rounded-circle > span[class*=material-symbols] {
  font-size: 40px;
}
.checkout-page .alert-default .alert-heading {
  margin-top: 1rem;
}
.checkout-page .alert-default .alert-secondary {
  background-color: var(--color-gray-200);
}
.checkout-page .alert-default .alert-warning {
  color: var(--color-default);
}

.shopping-status {
  text-align: center;
  padding: 2rem 0;
}
.shopping-status .item {
  position: relative;
}
.shopping-status .item .title {
  margin-top: 0.5rem;
  font-size: var(--typo-sm);
  font-weight: var(--fw-normal);
}
.shopping-status .item .icon {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  background-color: var(--color-light);
  border: 1px solid var(--color-primary);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 1;
}
.shopping-status .item .icon > img {
  height: 18px;
  margin: 0 auto;
}
.shopping-status .item .icon span {
  color: var(--color-primary);
}
.shopping-status .item .icon > span[class*=material-symbols] {
  font-size: 22px;
  top: 0;
}
.shopping-status .item + .item::before {
  position: absolute;
  content: "";
  top: 20px;
  left: -50%;
  height: 1px;
  width: 100%;
  background-color: var(--color-border);
  z-index: 0;
}
.shopping-status .item.active .icon {
  border-color: transparent;
  background-color: var(--color-primary);
}
.shopping-status .item.active .icon > img {
  -webkit-filter: grayscale(1) invert(1) brightness(2);
          filter: grayscale(1) invert(1) brightness(2);
}
.shopping-status .item.active .icon span {
  color: var(--color-light);
}

.htg-product {
  margin-bottom: 1.5rem;
}
.htg-product .option-default li {
  margin: 0 8px 0 0;
  width: 140px;
}
.htg-product .option-default .icon {
  width: auto;
  height: auto;
  margin-bottom: 8px;
}
.htg-product .option-default .d-flex {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: baseline !important;
      -ms-flex-align: baseline !important;
          align-items: baseline !important;
}
.htg-product .option-default .btn {
  height: 115px;
  padding: 12px;
  text-align: left;
}
.htg-product .option-default .btn .icon ~ .txt {
  margin-left: 0;
}
.htg-product .option-default .btn .title {
  line-height: 1.3em;
  font-size: 15px;
  font-weight: 500;
}
.htg-product .option-default .price {
  position: absolute;
  top: 12px;
  right: 8px;
  color: var(--color-primary);
  font-size: 12px;
  background-color: var(--color-primary-light);
  border: 1px solid #fff;
  padding: 0 8px;
  border-radius: 20px;
  min-width: 40px;
  text-align: center;
}

.delivery-address {
  margin-bottom: 1.5rem;
}
.delivery-address .add-address {
  font-size: 15px;
  color: var(--color-primary);
  border: 1px dashed #d4d5d7;
  border-radius: 3px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.delivery-address .add-address .btn {
  line-height: 1.2em;
}
.delivery-address .add-address .d-flex {
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
}
.delivery-address .add-address .icon > span[class*=material-symbols] {
  top: 0;
  font-size: 20px;
}
.delivery-address .add-address .txt {
  line-height: 1.2em;
}
.delivery-address .link {
  color: var(--color-primary);
}
.delivery-address .change-address {
  font-size: var(--typo-default);
}
.delivery-address .change-address .icon > span[class*=material-symbols] {
  font-size: 20px;
}
.delivery-address .address-detail {
  font-size: 15px;
  font-weight: var(--fw-normal);
  line-height: 1.3em;
  margin-bottom: 15px;
}
.delivery-address .address-detail .locate,
.delivery-address .address-detail .tel {
  font-size: 15px;
}

.type-transport {
  margin-bottom: 1.2rem;
}

.delivery-date {
  margin-bottom: 1.5rem;
}
.delivery-date .control-label {
  font-size: var(--typo-sm);
}

.add-address-modal .fixed-bottom .modal-footer {
  width: auto;
  margin: 0.5rem;
}
.add-address-modal .my-location {
  display: block;
  margin-bottom: 1rem;
  color: var(--color-primary);
  font-size: var(--typo-sm);
  font-weight: var(--fw-medium);
}
.add-address-modal .my-location .icon > span[class*=material-symbols] {
  font-size: 20px;
  font-weight: 400;
}
.add-address-modal .checkbox-control {
  top: -2px;
}

.change-address-modal .delivery-address .add-address {
  border: none;
  background-color: var(--color-gray-200);
  height: 42px;
  line-height: 42px;
}
.change-address-modal .modal-header {
  border-bottom: none;
}
.change-address-modal .modal-body .delivery-address {
  margin-top: -1rem;
  margin-left: -1rem;
  margin-right: -1rem;
}

.address-modal .scroll-wrapper {
  max-height: calc(100vh - 168px);
  padding-right: 1rem;
  padding-bottom: 1rem;
  margin-right: 0;
}

.map-modal .gmap_iframe {
  background-color: #000;
}
.map-modal .mapouter .map-text {
  padding: 1rem;
}
.map-modal .mapouter .map-text {
  position: relative;
  font-size: var(--typo-default);
  line-height: 1.4em;
  padding-left: 28px;
  margin: 0 1rem;
}
.map-modal .mapouter .map-text .icon {
  position: absolute;
  top: 14px;
  left: 0;
}
.map-modal .mapouter .map-text p {
  margin: 0;
}

.address-options input {
  display: none;
}
.address-options input:checked ~ label {
  color: var(--color-dark);
  background-color: var(--color-primary-light);
}
.address-options label {
  margin: 0;
}
.address-options .form-group {
  margin-bottom: 1rem;
}
.address-options .title {
  font-size: var(--typo-md);
}
.address-options label {
  font-size: var(--typo-md);
  color: var(--color-dark);
  text-align: unset;
  padding: 0;
  height: unset;
  line-height: 1.4em;
  border-color: #62aa84;
}
.address-options label .card {
  background-color: transparent;
}
.address-options label .card-body {
  padding: 1rem;
}
.address-options .address-detail {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.3em;
}
.address-options .edit-address {
  font-size: var(--typo-default);
  color: var(--color-primary);
  padding: 0 !important;
}
.address-options .edit-address .icon span {
  font-size: 18px;
}
.address-options input:not(:checked):hover ~ .btn {
  color: var(--color-light);
}
.address-options input:not(:checked):hover ~ .btn .icon img {
  -webkit-filter: grayscale(1) invert(1) brightness(2);
          filter: grayscale(1) invert(1) brightness(2);
}
.address-options input:not(:checked):hover ~ .btn .edit-address {
  color: var(--color-light);
}
.address-options .ad-btn {
  display: none;
  visibility: hidden;
  opacity: 0;
}
.address-options .address-default .ad-btn {
  display: block;
  visibility: visible;
  opacity: 1;
}

.delivery-information {
  padding: 15px;
  border-left: 4px solid var(--color-primary);
  padding-left: 11px !important;
}
.delivery-information .icon span {
  font-size: 20px;
}

.order-summary .delivery-information > .row + .row {
  border-top: 1px solid var(--color-border);
  padding-top: 15px;
  margin-top: 15px;
}

.payment-type .whead .title {
  font-size: var(--typo-xl);
}
.payment-type .link {
  font-size: var(--typo-md);
}
.payment-type .option-default .btn .txt .desc {
  margin-bottom: 0;
}
.payment-type .btn .txt {
  position: relative;
  line-height: 1em;
  padding: 4px 0;
}
.payment-type .btn .txt + .txt {
  margin-left: 1rem;
  padding-left: 1rem;
}
.payment-type .btn .txt + .txt::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em;
  bottom: 0.4em;
  width: 1px;
  background-color: var(--color-primary);
}
.payment-type .payment-credit .title {
  color: var(--color-dark);
}

.alert-point {
  font-size: var(--typo-md);
}

.pickup-at-hub {
  margin-bottom: 1.5rem;
}
.pickup-at-hub .hub-nearme .form-group {
  margin-bottom: 0.5rem;
}

.hub-address {
  margin-bottom: 0.5rem;
}
.hub-address .link {
  color: var(--color-primary);
}
.hub-address .address-detail {
  font-size: var(--typo-md);
  font-weight: var(--fw-light);
  line-height: 1.4em;
}
.hub-address .address-detail .title {
  font-weight: var(--fw-medium);
  color: var(--color-dark);
}

@media (min-width: 576px) {
  .add-address-modal .fixed-bottom .modal-footer {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .map-modal .gmap_iframe {
    height: calc(100vh - 340px);
  }
}
@media (min-width: 992px) {
  .add-address-modal .fixed-bottom .modal-footer {
    max-width: 800px;
  }
}
@media (max-width: 575px) {
  .add-address-modal .modal-body {
    min-height: calc(100vh - 168px);
  }
}
.shopping-status .item .icon > svg {
  color: var(--color-primary);
}

.shopping-status .item.active .icon > svg {
  color: #ffffff;
}

.my-coupon-page .default-body .container-fluid {
  min-height: calc(100vh - 220px);
}
.my-coupon-page .coupon-list .item-list > li {
  margin-bottom: 1rem;
}
.my-coupon-page .coupon-list .styled-coupon {
  width: 4.75rem;
}
.my-coupon-page .coupon-list .styled-coupon::before {
  left: 0;
}

.no-coupon {
  text-align: center;
}
.no-coupon .card {
  height: calc(100vh - 300px);
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.no-coupon .card .graphic img {
  width: 111px;
}
.no-coupon .card .desc {
  margin-top: 1.5rem;
}

@media (max-width: 375px) {
  .my-coupon-page .coupon-list .styled-coupon {
    width: 2.5rem;
  }
}
@media (min-width: 578px) {
  .no-coupon .card .graphic img {
    width: 140px;
  }
}
.my-stock-page .default-body {
  padding-top: 1rem;
  margin-bottom: 3rem;
}
.my-stock-page .product-item .card-body {
  padding: 1rem;
}
.my-stock-page .product-item .qty-item .price {
  padding: 2px 0;
}
.my-stock-page .product-item .stock-total {
  text-align: center;
  line-height: 0.8em;
}
.my-stock-page .product-list.not-specified .product-item .thumbnail img {
  -webkit-transform: scale(0.45);
          transform: scale(0.45);
}
.my-stock-page .product-list.not-specified .product-item .title {
  font-size: var(--typo-xl);
  font-weight: var(--fw-normal);
}
.my-stock-page .product-list.not-specified .qty-list.item-list {
  margin-top: 0.5rem;
  margin-bottom: 0;
}
.my-stock-page .product-list.not-specified .qty-list.item-list > li {
  padding-top: 0;
  padding-bottom: 0;
}
.my-stock-page .product-list.not-specified .qty-list.item-list > li + li {
  padding-left: 1rem;
  margin-left: 1rem;
  border-left: 1px solid var(--color-border);
}
.my-stock-page .product-list.not-specified .notify {
  min-width: 80px;
  margin-top: 0.5rem;
}
.my-stock-page .quantity {
  padding: 0 5px;
}
.my-stock-page .quantity input[type=text] {
  max-width: 40px;
  padding: 0 4px;
}
.my-stock-page .default-tab .nav-tabs .nav-item {
  min-width: 180px;
}
.my-stock-page .default-tab .tab-content {
  padding-top: 1rem;
}

.stock-total-box {
  margin-bottom: 1.25rem;
}
.stock-total-box .card {
  background-color: var(--color-gray-200);
}
.stock-total-box .card .stock-total {
  text-align: center;
}
.stock-total-box .card .title {
  font-size: var(--typo-lg);
}
.stock-total-box .card .icon img {
  width: 22px;
}
.stock-total-box .card-body {
  padding: 0.75rem 1rem;
}

@media (min-width: 390px) {
  .stock-total-box .card .stock-total {
    padding: 0 1rem;
  }
}
@media (min-width: 420px) {
  .my-stock-page .default-tab .nav-tabs .nav-item {
    min-width: 250px;
  }
}
@media (min-width: 578px) {
  .my-stock-page .default-tab .nav-tabs .nav-item {
    min-width: 305px;
  }
}
.payment-form-page .default-body {
  padding-top: 1rem;
  padding-bottom: 2rem;
}

.favorite-page .default-body {
  padding-top: 1rem;
  padding-bottom: 2rem;
}

.redeem-page.detail-page .redeem-item .btn.btn-primary {
  margin-top: 0;
}
.redeem-page.detail-page .redeem-item .topbar {
  margin-bottom: 1rem;
}
.redeem-page.detail-page .redeem-item .topbar .btn {
  font-size: var(--typo-lg);
  line-height: 28px;
  height: 30px;
  margin-top: 0;
}
.redeem-page.detail-page .redeem-item .card-body .title {
  font-size: var(--typo-xxl);
}
.redeem-page.detail-page .redeem-item .card-body .period {
  font-size: var(--typo-md);
}
.redeem-page.detail-page .progress-default .progress-success::before {
  font-size: 20px;
  bottom: -7px;
  width: 20px;
  height: 20px;
}
.redeem-page .whead .link {
  font-size: var(--typo-md);
  color: var(--color-primary);
}
.redeem-page .whead .link .icon > span[class*=material-symbols] {
  top: 3px;
  font-size: 22px;
}
.redeem-page .category .nav-tabs .nav-link {
  padding-left: 1.47rem;
  padding-right: 1.47rem;
}
.redeem-page .detail {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}
.redeem-page .detail .whead .title {
  font-size: var(--typo-lg);
  font-weight: var(--fw-nomal);
}

.redeem-topbar {
  color: var(--color-light);
  padding: 2rem;
  margin-bottom: 2rem;
  background-color: var(--color-primary);
  background-image: url(../img/background/bg-graphic-header.svg);
  background-repeat: no-repeat;
  background-position: 0 -20px;
  background-size: 80%;
  border-bottom-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
}
.redeem-topbar .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 24px;
  height: 24px;
}
.redeem-topbar .title {
  font-size: var(--typo-md);
}
.redeem-topbar .point {
  font-size: var(--typo-md);
}
.redeem-topbar .point span {
  font-size: 32px;
}

.redeem-list.item-list {
  margin: 0 -0.5rem;
}
.redeem-list.item-list > li {
  width: 50%;
  padding: 0 0.5rem;
}

.redeem-item {
  margin-bottom: 1.25rem;
}
.redeem-item .cover {
  padding-top: 80%;
}
.redeem-item .thumbnail {
  background-color: #f4f4f5;
}
.redeem-item .thumbnail .topbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.redeem-item .thumbnail .topbar {
  padding: 1rem;
  padding-bottom: 0;
}
.redeem-item .card-body {
  padding: 1rem;
}
.redeem-item .card-body .title {
  font-size: var(--typo-md);
  color: var(--color-dark);
  margin-bottom: 0.25rem;
}
.redeem-item .card-body .period {
  font-weight: var(--fw-light);
}
.redeem-item .card-body .progress-default {
  margin-top: 1rem;
}
.redeem-item .card-body .btn.btn-primary {
  margin-top: 1.25rem;
}

@media (max-width: 320px) {
  .redeem-list.item-list > li {
    width: 100%;
  }
}
@media (min-width: 390px) {
  .redeem-page .category .nav-tabs .nav-link {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 576px) {
  .redeem-page .category .nav-tabs .nav-link {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}
@media (min-width: 640px) {
  .redeem-page .category .nav-tabs .nav-link {
    padding-left: 3.42rem;
    padding-right: 3.42rem;
  }
}
.address-page .default-body {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.address-page .default-body .gmap_canvas,
.address-page .default-body .gmap_iframe {
  height: calc(100vh - 365px);
}
.address-page .my-address {
  margin-top: 1rem;
}

.no-address .alert {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: calc(100vh - 300px);
}
.no-address .alert-default .alert .icon.rounded-circle {
  color: var(--color-gray-100);
  width: 89px;
  height: 89px;
  margin: 0 auto;
}
.no-address .alert-default .alert .icon.rounded-circle > span[class*=material-symbols] {
  font-size: 50px;
  font-weight: 300;
}
.no-address .alert-default .alert-heading {
  font-size: var(--typo-md);
  font-weight: var(--fw-normal);
  color: var(--color-dark);
  margin-top: 1rem;
  margin-bottom: 0;
}
.no-address .alert-default .alert-heading ~ div {
  margin-top: 1.5rem;
}

.link.my-location {
  display: block;
  margin-bottom: 1rem;
  color: var(--color-primary);
  font-size: var(--typo-sm);
  font-weight: var(--fw-medium);
}
.link.my-location .icon > span[class*=material-symbols] {
  font-size: 20px;
  font-weight: 400;
}
.link.my-location:hover {
  opacity: 0.75;
}

.my-address .title {
  font-size: var(--typo-md);
}
.my-address .card {
  font-size: var(--typo-md);
  color: var(--color-dark);
  padding: 0;
  line-height: 1.4em;
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.my-address .card-body {
  padding: 1.25rem 1rem;
}
.my-address .edit-address {
  font-size: var(--typo-default);
  color: var(--color-primary);
}
.my-address .edit-address .icon span {
  top: 3px;
  font-size: 18px;
}
.my-address .address-detail {
  font-weight: var(--fw-normal);
}
.my-address .address-detail .name {
  margin-top: 6px;
  margin-bottom: 4px;
}
.my-address .address-detail .locate {
  margin-top: 8px;
  font-size: var(--typo-default);
}
.my-address .address-detail .tel {
  font-size: var(--typo-default);
}
.my-address .ad-btn {
  display: none;
  visibility: hidden;
  opacity: 0;
}
.my-address .address-default .title .icon {
  position: relative;
  top: -1px;
  margin-right: 5px;
}
.my-address .address-default .title .icon svg {
  width: 14px;
}
.my-address .address-default .title .txt {
  font-weight: 500;
}
.my-address .address-default .ad-btn {
  display: block;
  visibility: visible;
  opacity: 1;
}
.my-address .address-default .btn-secondary {
  height: 22px;
  line-height: inherit;
  padding: 0 6px;
}
.my-address .item-list > li {
  border-top: 1px solid var(--color-border);
}
.my-address .item-list > li .card-body {
  padding: 15px 0;
}
.my-address .item-list > li:last-child {
  border-bottom: 1px solid var(--color-border);
}

.select-address .btn {
  font-size: var(--typo-default);
  color: var(--color-primary);
  background-color: var(--color-primary-light);
  border-color: rgba(0, 0, 0, 0);
  font-weight: var(--fw-normal);
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  text-align: left;
  height: auto;
  min-height: 42px;
  border-radius: 3px;
  line-height: 1.4em;
  padding: 10px 10px;
}
.select-address .btn span {
  font-size: 20px;
  margin-right: 5px;
}

.mapouter {
  position: relative;
  width: 100%;
}
.mapouter .select-address {
  padding: 1rem;
}

.gmap_canvas {
  overflow: hidden;
  background-color: #f2f2f2;
  width: 100%;
  min-height: 400px;
  height: calc(100dvh - 320px);
}

.mapouter .map-text {
  font-size: var(--typo-md);
  padding: 1rem 0;
  line-height: 1.2em;
}
.mapouter .map-text .icon {
  width: 22px;
}

.faq-page .default-body {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.about-page .default-body {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.blog-page .home-tab .tabbable .nav-tabs {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.notification-page .default-body {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.noti-list .item-list > li + li {
  border-top: 1px solid var(--color-border);
}
.noti-list .link {
  color: var(--color-default);
}
.noti-list .noti-icon .badge {
  display: none;
  position: absolute;
  top: 0;
  right: calc(50% - 0.8rem);
  font-size: 0;
  padding: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}
.noti-list .icon {
  color: var(--color-primary);
  width: 34px;
  height: 34px;
  background-color: var(--color-gray-200);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.noti-list .icon > img {
  width: 20px;
}
.noti-list .icon span,
.noti-list .icon img {
  opacity: 0.55;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
.noti-list .title {
  font-size: var(--typo-md);
  color: var(--color-dark);
  margin-bottom: 0.5rem;
}
.noti-list .desc {
  font-size: var(--typo-sm);
  font-weight: var(--fw-light);
}
.noti-list .card {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.noti-list .card-body {
  padding: 0.75rem 0.5rem;
}
.noti-list .new-noti .icon {
  background-color: var(--color-primary-light);
}
.noti-list .new-noti .title {
  color: var(--color-primary);
}
.noti-list .new-noti span,
.noti-list .new-noti img {
  opacity: 1;
  -webkit-filter: none;
          filter: none;
}
.noti-list .new-noti .noti-icon .badge {
  display: block;
}

.pdpa-page .default-body {
  padding-top: 1rem;
}

.guest-block {
  margin-bottom: 1rem;
}

.test-page {
  padding-bottom: 124px;
}

.test-head {
  color: var(--color-light);
  padding: 1rem 0;
  min-height: 94px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--color-primary);
  background-image: url("../img/background/bg-graphic-test.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.test-head .title {
  font-size: var(--typo-xxl);
  line-height: 1.2em;
  margin-bottom: 0.5rem;
}
.test-head .title:only-child {
  margin-bottom: 0;
}
.test-head .desc {
  font-size: var(--typo-default);
}

.formula-test {
  margin-bottom: 1.2rem;
}
.formula-test .number {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--color-light);
  background: var(--color-primary);
  border-radius: 50%;
}
.formula-test .desc {
  font-size: var(--typo-md);
  margin-top: 0.4rem;
}

.formula-page .category {
  padding-top: 10px;
  margin: 0;
}
.formula-page .category .nav-tabs .nav-link {
  min-width: 120px;
}
.formula-page .default-body {
  padding-bottom: 1rem;
}
.formula-page .formula-list {
  padding-top: 1.5rem;
}
.formula-page .whead .title {
  font-size: var(--typo-xl);
}
.formula-page .whead .list-state {
  font-size: var(--typo-lg);
  font-weight: var(--fw-bold);
}
.formula-page .whead .list-state span {
  color: var(--color-secondary);
}

.formula-head {
  color: var(--color-primary);
  padding: 1rem 0;
  min-height: 120px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  background-image: url("../img/background/bg-formula-head.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.formula-head .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 44px;
  height: 44px;
  background-color: var(--color-light);
  border-radius: 50%;
}
.formula-head .icon img {
  width: 32px;
  max-height: 35px;
}
.formula-head .title {
  font-size: var(--typo-biggest);
  font-weight: var(--fw-bold);
  text-transform: uppercase;
  line-height: 1.4em;
}

.formula-list > .formula-item + .formula-item {
  margin-top: 0.5rem;
}
.formula-list > .item-list.fluid > li + li {
  margin-top: 0.5rem;
}

.formula-item .link {
  color: var(--color-default);
}
.formula-item .card .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
}
.formula-item .thumbnail {
  width: 120px;
}
.formula-item .thumbnail .cover,
.formula-item .thumbnail .contain {
  padding-top: 100%;
}
.formula-item .inner {
  padding: 0.9rem;
}
.formula-item .title {
  font-size: var(--typo-md);
  font-weight: var(--fw-medium);
  color: var(--color-dark);
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-height: 1.2em;
  -webkit-line-clamp: 1;
  min-height: 1.2em;
}
.formula-item .quantity input,
.formula-item .quantity button {
  width: 26px;
  height: 26px;
  line-height: 26px;
}
.formula-item .quantity .btn-number span {
  line-height: 26px;
}
.formula-item .badge-list {
  margin-bottom: 5px;
}

.collapse-formula {
  border: 1px solid var(--color-border);
  border-radius: 4px;
}
.collapse-formula .card-header .link span.unit,
.collapse-formula .card-header .btn span.unit {
  color: var(--color-secondary);
  position: absolute;
  top: 0;
  right: 40px;
}
.collapse-formula .card-body .action {
  margin-left: -1rem;
  margin-right: -1rem;
  margin-bottom: -1.25rem;
}
.collapse-formula .formula-item .card {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.collapse-formula .formula-item .thumbnail {
  width: 80px;
}
.collapse-formula .formula-item .card .inner {
  padding: 0;
  padding-left: 0.75rem;
}
.collapse-formula .formula-list > .item-list.fluid > li + li {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--color-border);
}
.collapse-formula + .collapse-formula {
  margin-top: 1.25rem;
}

.formula-modal .scroll-wrapper {
  max-height: calc(100vh - 70px);
}

.select-formula {
  margin-bottom: 1.5rem;
}
.select-formula .add-formula {
  font-size: 15px;
  color: var(--color-primary);
  border: 1px dashed #d4d5d7;
  border-radius: 3px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.select-formula .add-formula .btn {
  line-height: 1.2em;
}
.select-formula .add-formula .d-flex {
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
}
.select-formula .add-formula .icon > span[class*=material-symbols] {
  top: 0;
  font-size: 20px;
}
.select-formula .add-formula .txt {
  line-height: 1.2em;
}
.select-formula .add-formula.change-formula {
  font-size: 15px;
  border-style: solid;
}
.select-formula .link {
  color: var(--color-primary);
}
.select-formula .change-formula {
  font-size: var(--typo-default);
}
.select-formula .change-formula .icon > span[class*=material-symbols] {
  font-size: 20px;
}
.select-formula .formula-item .card {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.select-formula .formula-item .thumbnail {
  width: 80px;
}
.select-formula .formula-item .card .inner {
  padding: 0;
  padding-left: 0.75rem;
}
.select-formula .formula-list > .item-list.fluid > li + li {
  margin-top: 0;
}
.select-formula .formula-list > .item-list.fluid > li {
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--color-border);
}

@media (min-width: 1200px) {
  .container {
    max-width: inherit;
    width: 1210px;
  }
}
@media (max-width: 1600px) {
  .container {
    max-width: inherit;
    width: 1210px;
  }
}
@media (max-width: 1440px) {
  .container {
    max-width: inherit;
    width: 1210px;
  }
}
@media (max-width: 1199px) {
  .container {
    max-width: inherit;
    width: 970px;
  }
}
@media (max-width: 991px) {
  .container {
    max-width: inherit;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .container {
    max-width: inherit;
    width: 100%;
  }
}
@media (max-width: 575px) {
  .container {
    max-width: inherit;
    width: 100%;
  }
}/*# sourceMappingURL=style.css.map */