/* fonts */
@font-face {
  font-display: swap;
  font-family: "Noto Sans Thai";
  src: url("/fonts/NotoSansThai-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
}

@font-face {
  font-display: swap;
  font-family: "Inter";
  src: url("/fonts/Inter-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
}

/* header style */
body {
  font-family: PingFang-SC-Regular;
  padding-top: 163.84px;
  padding-right: unset !important;
}

body::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #f5f5f5;
}

body::-webkit-scrollbar {
  width: 8px;
  background-color: #f5f5f5;
}

body::-webkit-scrollbar-thumb {
  border-radius: 20px;
  background-color: #ff7a2c;
}

.pageLoading {
  overflow: hidden;
}

body.promo {
  padding-top: 243.84px;
}

.carousel-indicators {
  left: 0px;
  margin-left: 0px;
  width: 100%;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.datepicker {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
  font-size: 13px;
}

.container:before,
.container:after {
  content: unset;
}

@media (min-width: 1200px) {
  .container {
    width: 1110px;
  }
  .no-pdr {
    padding-right: unset !important;
  }
}

.dropdown-backdrop {
  display: none;
}

.wrap-center {
  display: flex;
  justify-content: center;
}

.header-top {
  padding: 8px 0px;
  background-color: #333333;
  font-size: 13px;
  color: #a5a5a5 !important;
}

.header-top a {
  color: #a5a5a5;
  text-decoration: unset;
}

.header-top a:hover {
  color: #f5851f;
}

.header-promotion {
  min-width: 1200px;
  /* min-width: 100%; */
  max-width: 1920px;
  margin: 0px auto;
  height: 80px;
}

.header-promotion a {
  cursor: pointer;
}

.header-promotion img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.header {
  border-bottom: 1px solid #e3e0e0;
}

.nav-top {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}

.nav-lang .lang-item {
  margin-right: 5px;
}

.nav-lang .active {
  color: #f5851f !important;
  border: 1px solid;
  padding: 3px 8px;
  border-radius: 5px;
}

.nav-list > ul {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin: 0;
}

.nav-list > ul > li {
  padding: 0px 12px;
  position: relative;
}

.nav-list > ul > li:last-child {
  padding-right: unset;
}

.nav-list > ul > li:not(:last-child):after {
  content: "|";
  position: absolute;
  right: -1.5px;
}

.nav-list .cart-num {
  font-size: 10px;
}

.nav-list .dropdown-menu {
  background-color: #333333;
  color: #a5a5a5;
  margin: 6px 0 0;
}

.nav-list .dropdown-menu > li > a {
  color: #a5a5a5;
}

.nav-list .dropdown-menu > li > a:focus,
.nav-list .dropdown-menu > li > a:hover {
  color: #f5851f;
  background-color: #333333;
}

.nav-list .dropdown-menu .dash {
  text-align: -webkit-center;
}

.nav-list .dropdown-menu .dash hr {
  margin: 5px 0px;
  border-color: #9d9d9d;
  width: 90%;
}

.drop-img {
  padding: unset;
  border: unset;
  min-width: 100px;
  right: -10px;
  left: unset;
}

.header-content {
  display: flex;
  justify-content: space-between;
  padding: 6px 0px;
}

.head-logo img {
  height: 45px;
}

.head-search {
  align-self: center;
  width: 650px;
}

.head-search .btn-search {
  padding: 9px 38px;
  color: #fff;
  background-color: #f5851f;
}

.head-search .input-search {
  padding: 19px 12px;
  border: 1px solid #eee;
}

.head-search .input-search:focus {
  border-color: #f5851f;
  box-shadow: unset;
  -webkit-box-shadow: unset;
}

.btn-default {
  background-color: #f7f7f7;
  border-color: #ccc;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
  outline: unset;
}

.menu-content {
  margin-top: 5px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

.menu-list > ul {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin: 0;
}

.menu-list > ul > li {
  position: relative;
  padding: 5px 14px;
  /* border: 1px solid #333333; */
}

.menu-list .active {
  background-color: #f5851f;
}

.menu-list .active a {
  color: #fff !important;
}

.header a {
  color: #000;
  text-decoration: unset;
}

.header a:hover {
  color: #f5851f;
}

.menu-cargo .dropdown-menu {
  right: 40px;
  left: unset;
  border: unset;
  margin-top: 7px;
}

.menu-cargo .dropdown-menu:after {
  content: "";
  display: block;
  position: absolute;
  left: 70%;
  top: -4px;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  width: 6px;
  height: 6px;
  background-color: #fff;
}

.menu-cargo .dropdown-menu > li > a {
  padding: 8px 20px;
}

.menu-cargo .dropdown-menu > li > a:hover {
  color: #f5851f;
}

.new-aleart {
  position: absolute;
  background-color: red;
  color: #fff;
  font-size: 11px;
  right: 25px;
  top: -20px;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}

.btn-vcb-cargo {
  background-color: #f5851f;
  padding: 2px 8px;
  margin-right: 40px;
  color: #000;
}

/* content style */
.banner {
  position: relative;
  display: flex;
  justify-content: center;
}

.banner .category-section {
  position: absolute;
}

.carousel-inner .banner-image {
  height: 360px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.banner .carousel-inner .banner-image img {
  width: 100%;
  height: 360px;
  object-fit: cover;
}

.banner .carousel-indicators li {
  border: unset;
  background-color: #000;
  opacity: 0.5;
}

.banner .carousel-indicators .active {
  background-color: #fff;
  width: 11px;
  height: 11px;
  margin: 1px;
  opacity: 1;
}

.banner .carousel-indicators {
  bottom: -5px;
}

.category-section .cat-menu {
  background-color: #0000009c;
  color: #fff;
  height: 360px;
  width: 255px;
  position: relative;
  z-index: 15;
}

.category-section .cat-menu > ul {
  list-style-type: none;
  padding: 5px 0px 0px 0px;
  margin: 0;
}

.category-section .cat-menu .cat-main {
  display: flex;
  justify-content: space-between;
  padding: 0px 20px;
  line-height: 35px;
  align-items: center;
  cursor: pointer;
}

.category-section .cat-menu .cat-main:hover {
  background-color: #fff;
  color: #ff6801;
}

.category-section .cat-menu .cat-main:hover .cat-sub {
  display: block;
}

.category-section .cat-menu .cat-sub {
  position: absolute;
  left: 255px;
  top: 2px;
  background: #fff;
  width: 825px;
  height: 358px;
  color: #333;
  display: none;
  padding: 5px 20px;
  z-index: 16;
}

.cat-sub .sub-list {
  display: flex;
  align-items: center;
}

.cat-sub .sub-list .sub-title {
  width: 250px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 10px;
}

.cat-sub .sub-list .sub-title .sub-name {
  line-height: 35px;
}

.cat-sub .sub-list .sub-menu {
  width: 564px;
  border-bottom: 1px dashed #ccc;
  display: flex;
  flex-wrap: wrap;
  padding: 3px 0;
}

.cat-sub .sub-list .sub-menu a {
  margin-left: 10px;
  color: #666;
  line-height: 20px;
  text-decoration: unset;
}

.cat-sub .sub-list .sub-menu a:hover {
  color: #f5851f;
}

.category-section .cat-menu > ul > li i {
  font-size: 20px;
}

.category-section .account-menu {
  position: absolute;
  top: 6%;
  right: 15px;
  width: 200px;
  height: 320px;
  border-radius: 3px;
  background-color: #fff;
  padding: 0px 8px;
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
}

.account-menu .acc-header {
  padding: 20px 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.account-menu .acc-header .txt-welcome {
  margin-left: 5px;
  line-height: 17px;
}

.account-menu .acc-header img {
  width: 40px;
}

.account-menu .acc-button {
  display: flex;
  justify-content: center;
}

.account-menu a {
  text-decoration: unset;
}

.acc-button .btn-acc1 {
  border: 1px solid #f5851f;
  color: #f5851f;
  min-width: 64px;
  padding: 0 5px;
  height: 24px;
  margin: 0 5px;
  border-radius: 3px;
}

.acc-button .btn-acc2 {
  background-color: #f5851f;
  border: 1px solid #f5851f;
  color: #fff;
  min-width: 64px;
  padding: 0 5px;
  height: 24px;
  margin: 0 5px;
  border-radius: 3px;
}

.acc-button .btn-acc3 {
  border: 1px solid #f5851f;
  color: #333;
  padding: 0 10px;
  height: 24px;
  width: 80%;
  border-radius: 3px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.acc-button .btn-acc3 > span {
  text-align: center;
  display: inline-block;
  width: 40px;
  border-radius: 2px;
  background: rgba(255, 188, 126, 0.5);
  color: #f5851f;
  margin-left: 5px;
  height: 15px;
}

.acc-body .acc-list {
  margin-top: 6px;
  padding: 5px 0px 9px;
  border-bottom: 1px solid #e8e8e8;
}

.acc-body .acc-list > ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.acc-body .acc-list a {
  color: #333;
}

.acc-body .acc-list a:hover .list-bar {
  background-color: #f2f2f2;
}

.acc-body .acc-list .list-bar {
  line-height: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.acc-list .list-title {
  display: flex;
  align-items: center;
}

.acc-list .list-title span {
  margin-left: 10px;
}

.acc-list .list-title img {
  width: 22px;
  height: 22px;
}

.acc-list .list-item {
  display: flex;
  align-items: center;
}

.acc-list .list-item span {
  color: #fff;
  padding: 1px 5px;
  background-color: #f5851f;
  border-radius: 8px;
  font-size: 12px;
  vertical-align: middle;
  line-height: normal;
  margin-right: 5px;
}

.acc-list .list-bar i {
  font-size: 18px;
  margin-right: 2px;
}

.account-menu .acc-ft-button {
  display: flex;
  justify-content: space-between;
  padding: 0 4px;
  align-items: center;
  margin-top: 9px;
}

.account-menu .acc-footer .cn-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 82px;
  height: 26px;
  line-height: 20px;
  background: #fff;
  border: 1px solid #f5851f;
  border-radius: 4px;
  color: #f5851f;
  font-size: 18px;
}

.account-menu .acc-footer .cn-btn:hover {
  background-color: #f5851f;
  color: #fff;
}

.normal-section {
  position: relative;
  background-color: #fafafa;
}

.page-section {
  background-color: #fff;
}

.custom-banner {
  width: 100%;
  height: 347px;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  position: relative;
}

.problem-container {
  text-align: right;
  color: #333;
}

.problem-container .pb-head {
  font-size: 48px;
}

.problem-container .pb-des {
  font-size: 14px;
}

.problem-container .head-search {
  float: right;
  width: 550px;
  margin-top: 40px;
}

.problem-container .head-search .btn-search {
  padding: 9px 31px;
}

.problem-content {
  padding: 50px 0px;
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
}

.problem-content .panel-body {
  padding: 0px 10px;
}

.problem-content .problem-title {
  font-weight: 700;
  font-size: 24px;
  padding-left: 10px;
  border-left: 8px solid #f5851f;
  line-height: 29px;
  margin-bottom: 20px;
}

.problem-content .problem-menu {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin: 0;
  flex-direction: column;
  text-align: center;
}

.problem-content .problem-menu > li {
  border-bottom: 1px solid #ddd;
}

.problem-content .problem-menu > li:last-child {
  border: unset;
}

.problem-content .problem-menu > li > a {
  line-height: 50px;
}

.problem-content .problem-menu a {
  text-decoration: unset;
  color: #333;
}

.problem-content .problem-menu a:hover {
  color: #f5851f;
}

.problem-content .problem-body {
  padding: 10px;
}

.problem-content .problem-list {
  line-height: 40px;
}

.problem-content .problem-list a {
  color: #333;
}

.problem-content .problem-list a:hover {
  color: #f5851f;
}

.problem-content .problem-box {
  margin-bottom: 40px;
}

.problem-content .contact-box {
  text-align: center;
  padding: 10px;
  height: 245px;
}

.problem-content .contact-box img {
  width: 85px;
  margin-top: 18px;
  margin-bottom: 12px;
}

.problem-content .contact-box .ct-title {
  font-size: 18px;
  color: #f38420;
  margin-bottom: 3px;
}

.problem-content .contact-box .ct-des {
  font-size: 12px;
  margin-bottom: 20px;
}

.news-content {
  padding: 20px 0px;
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
}

.news-content .news-title {
  font-weight: 700;
  font-size: 24px;
  padding-left: 10px;
  border-left: 8px solid #ff8f00;
  line-height: 29px;
  margin-bottom: 20px;
}

.btn-vcanbuy {
  color: #fff;
  background-color: #ff8f00;
  border-color: #ff8f00;
}

.btn-vcanbuy:hover,
.btn-vcanbuy:active,
.btn-vcanbuy:focus {
  color: #fff;
  background-color: #e77d1e;
}

.btn-vcanbuy-white {
  color: #ff8f00;
  background-color: #fff;
  border-color: #ff8f00;
}

.btn-vcanbuy-white:hover,
.btn-vcanbuy-white:active,
.btn-vcanbuy-white:focus {
  color: #fff;
  background-color: #ff8f00;
}

.btn-vcanbuy-default {
  color: #606266;
  background-color: #fff;
  border-color: #dcdfe6;
}

.btn-vcanbuy-default:hover,
.btn-vcanbuy-default:active,
.btn-vcanbuy-default:focus {
  color: #ff8f00;
  border-color: #ff8f00;
}

.news-content .panel-body {
  padding: 10px;
}

.news-content .news-box {
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-bottom: 25px;
}

.news-content .news-box img {
  width: 100%;
  border-radius: 4px 4px 0px 0px;
}

.news-content .news-box .news-body {
  padding: 12px 10px;
}

.news-box .news-body .n-modified {
  font-size: 12px;
  color: #aaa;
  margin-bottom: 8px;
}

.news-box .news-body .n-title {
  margin-bottom: 3px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.news-box .news-body .n-title a {
  font-size: 14px;
  color: #333;
  font-weight: 700;
}

.news-box .news-body .n-title a:hover {
  color: #f5851f;
}

.news-box .news-body .n-date {
  font-size: 12px;
  color: #333;
  height: 30px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.vcb-paging {
  text-align: center;
  padding-top: 15px;
  padding-bottom: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.paging-right {
  justify-content: right;
  padding-bottom: unset;
}

.vcb-paging > ul {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}

.vcb-paging > ul > li > a {
  padding: 5px 13px;
  margin-right: 5px;
  background-color: #f9f9f9;
  color: #000;
  font-size: 13px;
  font-weight: 600;
  border-radius: 4px;
  text-decoration: unset;
  cursor: pointer;
}

.vcb-paging > ul > li > .active {
  background-color: #f5851f !important;
  color: #fff !important;
}

.vcb-paging > ul > li > .disabled {
  color: #c0c4cc !important;
  pointer-events: none;
}

.vcb-paging > ul > li > .skip {
  background-color: unset !important;
  color: #000 !important;
}

.vcb-paging i {
  font-size: 16px !important;
}

.vcb-paging > ul > li > a:hover {
  color: #f5851f;
}

.vcb-paging .paging-go {
  margin-left: 20px;
  font-size: 13px;
}

.vcb-paging .paging-num {
  margin-right: 20px;
}

.vcb-paging .paging-num select {
  height: 28px;
  font-size: 13px;
}

.vcb-paging .paging-go input {
  display: inline-block;
  width: 50px;
  height: 28px;
  padding: 0px 3px;
  text-align: center;
  margin-left: 5px;
}

.news-content .detail-body {
  padding: 20px;
}

.news-content .news-toplink a {
  color: #000;
}

.news-content .news-toplink a:hover {
  color: #f5851f;
}

.news-content hr {
  border-color: #ccc;
}

.news-content .news-top-detail {
  font-size: 13px;
  margin-bottom: 15px;
}

.news-content .news-top-detail span {
  margin-right: 15px;
}

.news-content .news-top-detail span > a {
  margin-right: 5px;
}

.news-content .detail-body .news-date {
  background-color: #d7d7d7;
  padding: 10px 20px;
  margin-bottom: 20px;
}

.news-content .detail-body .news-date > span {
  font-size: 32px;
  font-weight: 700;
}

.news-content .detail-body .news-image {
  margin-bottom: 30px;
}

.news-content .detail-body .news-image img {
  width: 100%;
}

.news-content .detail-body .prev {
  margin-bottom: 10px;
}

.news-content .detail-body .prev a,
.news-content .detail-body .next a {
  color: #000;
  text-decoration: unset;
}

.news-content .detail-body .prev a:hover,
.news-content .detail-body .next a:hover {
  color: #f5851f;
}

.news-content .news-more {
  padding-left: 20px;
  margin: unset;
  font-size: 16px;
}

.news-content .news-more > li > a {
  font-size: 14px;
  color: #000;
  line-height: 30px;
}

.news-content .news-more > li > a:hover {
  color: #f5851f;
}

.freight-container,
.freight-content {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
}

.freight-banner {
  position: relative;
  width: 100%;
  height: 480px;
  background: linear-gradient(rgba(51, 51, 51, 0.6), rgba(51, 51, 51, 0.6)),
    url("/img/freight-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
}

.freight-banner .freight-container {
  color: #fff;
  margin-bottom: 140px;
}

.freight-banner .freight-container .fe-head {
  font-size: 50px;
  line-height: 50px;
}

.freight-banner .freight-container .fe-des {
  font-size: 30px;
  opacity: 0.5;
}

.freight-content {
  padding-bottom: 40px;
}

.freight-content .freight-box {
  background-color: #fff;
  padding: 17px 25px;
  position: relative;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
  margin-top: -125px;
  margin-bottom: 20px;
}

.freight-content .freight-box2 {
  background-color: #fff;
  padding: 22px 25px;
  position: relative;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
}

.freight-content .freight-head {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}

.freight-content button {
  width: 108px;
  font-size: 14px;
}

.freight-content .fr-title {
  border-left: 5px solid #f5851f;
  font-size: 18px;
  color: #f5851f;
  line-height: 20px;
  padding-left: 6px;
}

.freight-content .fr-des {
  margin-top: 5px;
  margin-bottom: 15px;
  font-size: 12px;
  color: #999;
  padding-left: 10px;
}

.freight-content hr {
  border-color: #ddd;
  margin: 15px 0px;
}

.freight-content .freight-body .fr-form-group {
  padding: 15px 0px;
}

.freight-body .fr-form-group label {
  font-weight: normal;
  margin: unset;
}

.freight-body .fr-form-group .radio {
  display: inline-block;
  margin: 0px 25px 0px 0px;
}

.freight-body .fr-form-group .lab-sec {
  margin-right: 10px;
}

.fr-form-group .lab-sec span {
  color: #f56c6c;
}

.fr-form-group .form-control {
  width: 200px;
  display: inline-block;
  padding: 0px 12px;
  margin-right: 13px;
}

.freight-content .fr-group {
  display: inline-block;
}

.freight-content .freight-footer {
  margin-top: 15px;
  text-align: center;
}

.freight-content .freight-footer span {
  color: #999;
  font-size: 12px;
}

.freight-content .result-box {
  position: relative;
  background-image: url("/img/estimationResultsTitlebg.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 80px;
  display: flex;
  align-items: center;
}

.freight-content .result-box .result-rank {
  border-right: 1px solid #fff;
  color: #fff;
  width: 17%;
  padding: 0px 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.freight-content .result-box .result-rank .rs-text {
  text-align: center;
  font-size: 11px;
}

.freight-content .result-box .result-rank .rs-more {
  font-size: 22px;
}

.freight-content .result-box .result-rankbar {
  width: 83%;
  padding-left: 45px;
  padding-top: 35px;
}

.freight-content .result-box .result-rankbar .progress-length {
  width: 610px;
  display: flex;
}

.freight-content .result-box .result-rankbar .rank-list {
  width: 610px;
  display: flex;
  margin-top: 3px;
}

.freight-content .result-box .result-rankbar .rank-list .active {
  opacity: 1;
}

.freight-content .result-box .result-rankbar .rank-name {
  width: 25%;
  font-size: 12px;
  opacity: 0.5;
  color: #fff;
}

.freight-content .result-box .result-rankbar .progress {
  margin: unset;
  box-shadow: unset;
  height: 10px;
  width: 25%;
  border-radius: unset;
}

.freight-content .result-box .result-rankbar .progress .pg-popover {
  position: absolute;
  display: flex;
  background: #fff;
  justify-content: center;
  align-items: center;
  color: #f5851f;
  min-width: 100px;
  max-width: 210px;
  height: 29px;
  font-size: 12px;
  top: 4px;
}

.freight-content .result-box .result-rankbar .progress .pg-popover:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: -3px;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  width: 5px;
  height: 5px;
  background-color: #fff;
}

.freight-content .result-box .result-rankbar .progress:first-child {
  border-radius: 4px 0px 0px 4px;
}

.freight-content .result-box .result-rankbar .progress:last-child {
  border-radius: 0px 4px 4px 0px;
}

.freight-content .result-box .result-rankbar .progress .progress-bar {
  box-shadow: unset;
}

.progress-bar-vcanbuy {
  background-color: #ffc400;
}

.freight-content .freight-result {
  margin: 30px 0px;
}

.freight-content .freight-result .fr-lab {
  margin-left: 60px;
}

.freight-content .freight-result .fr-badge {
  padding: 10px;
  height: 36px;
  line-height: 36px;
  color: #f5851f;
  text-align: center;
  background: #fff8f1;
  margin-left: 10px;
}

.freight-content .freight-remark .remark-title {
  margin-bottom: 10px;
}

.freight-content .freight-remark .remark-list {
  font-size: 12px;
  color: #999;
}

/* login style */
#myModalLogin.modal {
  position: absolute;
  left: 80%;
}
#myModalLogin > .modal-dialog > .modal-content > .modal-header {
  padding: 15px;
  border-bottom: none;
}

.promo-open .modal-backdrop {
  background-color: #000;
  opacity: 0.75 !important;
}

.modal-login {
  margin-top: 30%;
}

.modal-login .modal-content {
  box-shadow: unset;
  border-top: 4px solid #ff6801;
  border-radius: 4px;
}

.modal-login .login-close {
  position: absolute;
  font-size: 28px;
  padding-right: 12px;
  right: 0px;
  top: 1px;
  cursor: pointer;
  line-height: 30px;
  color: #aaa;
}

.modal-login .modal-body {
  padding: 40px 38px 25px;
}

.modal-login .login-logo {
  text-align: center;
  margin-bottom: 25px;
}

.modal-login .login-logo img {
  width: 110px;
}

.login-tab {
  display: flex;
  flex-wrap: nowrap;
  color: #ccc;
  margin-bottom: 20px;
}

.login-tab .active {
  color: #333;
}

.login-tab .tab-list {
  height: 25px;
  width: 50%;
  text-align: center;
  align-content: center;
  border-right: 2px solid #f2f2f2;
  cursor: pointer;
}

.login-tab .tab-list:last-child {
  border: unset;
}

.modal-login .form-group {
  margin-bottom: 20px;
}

.modal-login .form-control {
  font-size: 12px;
  height: 40px;
  padding: 0px 10px;
  border-color: #dcdfe6;
  box-shadow: unset;
}

.modal-login .password-group {
  position: relative;
}

.modal-login .form-password {
  padding-right: 30px;
}

.modal-login .password-eye {
  position: absolute;
  right: 10px;
  top: 12px;
  font-size: 14px;
  cursor: pointer;
}

.modal-login .form-control:hover {
  border-color: #c0c4cc;
}

.modal-login .form-control:focus {
  border-color: #f5861f;
  color: #f5861f;
}

.modal-login .checkbox {
  margin: unset;
}

.modal-login .remember-group {
  padding: 0px 10px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.modal-login .remember-group input[type="checkbox"] {
  accent-color: #f86500;
}

.modal-login .remember-group a {
  color: #ff6801;
}

.modal-login .btn-login {
  height: 40px;
  color: #fff;
  background-color: #ff6801;
  letter-spacing: 2px;
  font-size: 16px;
  padding: unset;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-login .btn-login:hover {
  background-color: #e25c00;
}

.modal-login .btn-login:active {
  background-color: #c75100;
}

.modal-login .btn-regis {
  height: 40px;
  color: #ff6801;
  background-color: #fff;
  letter-spacing: 2px;
  font-size: 16px;
  padding: unset;
}

.modal-login-new {
  font-family: "Noto Sans Thai", sans-serif;
  margin-top: 5%;
  color: #000;
}

.modal-login-new .modal-content {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  border-radius: 40px;
  height: 639px;
  position: relative;
}

.modal-login-new .modal-body {
  height: 100%;
  padding: 15px 50px;
}

.modal-login-new .loginNew {
  display: flex;
  align-items: center;
  height: 100%;
}

.modal-login-new .loginNew .loginNewImg {
  width: 50%;
  text-align: center;
}

.modal-login-new .loginNew .loginNewImg img {
  width: 480px;
  filter: drop-shadow(0px 8px 16.1px rgba(0, 0, 0, 0.25));
}

.modal-login-new .loginNew .loginNewContent {
  width: 50%;
  text-align: center;
}

.modal-login-new .loginNew .loginNewContent .logo {
  width: 283px;
  margin-bottom: 10px;
}

.modal-login-new .loginNew .loginNewContent .welcome {
  font-size: 39px;
  font-weight: 700;
  margin-bottom: 7px;
}

.modal-login-new .loginNew .loginNewContent .title {
  font-size: 30px;
  margin-bottom: 20px;
}

.modal-login-new .loginNew .loginNewContent .loginForm {
  padding: 0px 45px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .form-control {
  height: 50.86px;
  background: #f2f2f2;
  color: #000;
  padding-left: 55px;
  font-size: 14px;
  border-radius: 13px;
  border: unset;
  box-shadow: unset;
}

.modal-login-new .loginNew .loginNewContent .loginForm .form-group {
  position: relative;
}

.modal-login-new .loginNew .loginNewContent .loginForm .password-group {
  margin-bottom: 20px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .form-password {
  padding-right: 50px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .icn {
  position: absolute;
  left: 22px;
  top: 13px;
  width: 18px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .password-eye {
  position: absolute;
  right: 18px;
  top: 14px;
  color: #8a8e9b;
  font-size: 20px;
  cursor: pointer;
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .password-group.wrong
  .icn {
  content: url("/img/pass-wrong.png");
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .password-group.wrong
  .form-password {
  color: #e21d1d;
  outline: 1px solid #e21d1d;
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .password-group.wrong
  .form-password::placeholder {
  color: #e21d1d;
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .password-group.wrong
  .password-eye {
  color: #e21d1d;
}

.modal-login-new .loginNew .loginNewContent .loginForm .shortcut {
  display: flex;
  justify-content: space-between;
  padding-left: 5px;
  margin-bottom: 20px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .shortcut .remember {
  display: flex;
  align-items: center;
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .shortcut
  .remember
  input[type="checkbox"] {
  margin: unset;
  margin-right: 10px;
  width: 22px;
  height: 22px;
  accent-color: #575757;
  cursor: pointer;
}

.modal-login-new
  .loginNew
  .loginNewContent
  .loginForm
  .shortcut
  .remember
  label {
  margin: unset;
  font-size: 15px;
  color: #484848;
  font-weight: 400;
  cursor: pointer;
}

.modal-login-new .loginNew .loginNewContent .loginForm .shortcut .forgot {
  color: #ff8f00;
  text-decoration: unset;
  font-weight: 600;
  font-size: 17px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .button {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .button .btn-login-new {
  width: 171.97px;
  height: 50.86px;
  background: #ff9900;
  border-radius: 100px;
  color: #fff;
  border: unset;
  font-size: 20px;
  font-weight: 700;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.modal-login-new .loginNew .loginNewContent .loginForm .button .btn-regis-new {
  width: 171.97px;
  height: 50.86px;
  background: #fff;
  border: 1px solid #6d6d6d;
  border-radius: 100px;
  color: #6d6d6d;
  font-size: 20px;
  font-weight: 700;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.15));
}

.modal-login-new .loginNew .loginNewContent .loginForm .forgotbottom {
  font-size: 22px;
  color: #808080;
  font-weight: 500;
  margin-bottom: 50px;
}

.modal-login-new .loginNew .loginNewContent .loginForm .forgotbottom a {
  text-decoration: unset;
  font-size: 26px;
  color: #ff8f00;
  font-weight: 700;
}

.modal-login-new .loginNew .loginNewContent .loginForm .forgotbottom a:hover {
  color: #d17600;
}

.modal-login-new .login-close {
  position: absolute;
  right: -5px;
  top: -10px;
  width: 45px;
  height: 45px;
  cursor: pointer;
}

.modal-login-new .login-close:hover {
  opacity: 0.8;
}

.modal-login-new .login-close img {
  width: 100%;
}

.modal-login-new .bottomText {
  position: absolute;
  bottom: 15px;
  left: 0;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  width: 100%;
}

.modal-login-new .bottomText img {
  width: 24px;
  margin: 0px 8px 0px 15px;
}

@media (min-width: 768px) {
  .modal-login {
    width: 380px;
    margin: 95px auto;
  }

  .modal-login-new {
    width: 1009px;
  }
}

.no-padding {
  padding: unset !important;
}

.page-main {
  display: flex;
  padding-top: 12px;
  padding-bottom: 20px;
}

.page-menu {
  width: 18.7%;
  margin-right: 10px;
  margin-bottom: 10px;
  background-color: #fff;
  border: 1px solid #f2f2f2;
  overflow: auto;
  font-family: PingFangSC-Regular, PingFang SC;
}

.page-menu .menu-logo {
  width: 100%;
  height: 52px;
  background-color: #f38420;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #fff;
}

.page-menu .menu-logo .m-nav {
  display: none;
}

.page-menu .menu-tab {
  padding: 15px 20px;
}

.page-menu .menu-tab .menu-tab-item {
  margin-bottom: 20px;
  user-select: none;
}

.page-menu .menu-tab .menu-tab-item .tab-item-title {
  min-width: 64px;
  height: 22px;
  font-size: 16px;
  font-weight: 400;
  color: #000;
  line-height: 22px;
  margin-bottom: 10px;
}

.page-menu .menu-tab .menu-tab-item .tab-item-title .linenotify-button {
  font-family: "Noto Sans Thai", sans-serif;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  color: #5d5d5d;
  text-decoration: unset;
  transition: 0.15s;
}

.page-menu .menu-tab .menu-tab-item .tab-item-title .linenotify-button:hover {
  opacity: 0.7;
}

.page-menu .menu-tab .menu-tab-item .tab-item-title .linenotify-button img {
  width: 20px;
  margin-right: 5px;
}

.page-menu .menu-tab .menu-tab-item .tab-item-title .linenotify-button.success {
  opacity: 1 !important;
}

.page-menu
  .menu-tab
  .menu-tab-item
  .tab-item-title
  .linenotify-button.success
  span {
  color: #1c9e00;
}

.page-menu
  .menu-tab
  .menu-tab-item
  .tab-item-title
  .linenotify-button.success
  .line-cancel {
  margin-left: 10px;
  margin-top: -1px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  color: #fff;
  background: #f38420;
  padding: 2px 7px;
  border-radius: 20px;
  text-decoration: unset;
  cursor: pointer;
}

.page-menu
  .menu-tab
  .menu-tab-item
  .tab-item-title
  .linenotify-button.success
  .line-cancel:hover {
  background: #ce6f1c;
}

.page-menu .menu-tab .menu-tab-item .tab-item-subtitle {
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  margin-bottom: 10px;
  display: block;
  position: relative;
  color: #777;
  text-decoration: unset;
}

.page-menu .menu-tab .menu-tab-item .tab-item-subtitle:hover {
  color: #f38420;
}

.page-menu .menu-tab .menu-tab-item .tab-item-content > .active {
  color: #f38420;
  position: relative;
}

.page-menu .menu-tab .menu-tab-item .tab-item-content > .active:before {
  position: absolute;
  content: "";
  width: 2px;
  height: 16px;
  background-color: #f38420;
  left: -20px;
  top: 2px;
}

.tab-item-subtitle .bd {
  background-color: #f38420;
  border-radius: 10px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  height: 18px;
  line-height: 18px;
  padding: 0 6px;
  text-align: center;
  position: absolute;
  margin-left: 4px;
}

.page-content {
  width: 81.3%;
  font-family: PingFangSC-Regular, PingFang SC;
}

.app {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
}

.page-content .page-box {
  background-color: #fff;
  margin-bottom: 10px;
  border: 1px solid #ebeef5;
  position: relative;
}

.page-content .page-box > .page-head {
  padding: 10px 15px;
  border-bottom: 1px solid #ebeef5;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-head a {
  text-decoration: unset;
  color: #333;
}

.page-box .tab-head {
  justify-content: unset !important;
}

.page-box .tab-head li {
  margin-right: 20px;
}

.page-box .tab-head2 li {
  padding: 0px 10px;
  margin: unset;
}

.page-box .tab-head .nav-tabs {
  border: unset;
}

.page-box .tab-head .nav-tabs .bd {
  position: absolute;
  background-color: #ccc;
  border-radius: 10px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  height: 20px;
  line-height: 18px;
  padding: 0 6px;
  text-align: center;
  white-space: nowrap;
  border: 1px solid #fff;
  right: 1px;
  top: -8px;
}

.page-box .tab-head .nav-tabs li.active .bd {
  background-color: #f38420;
}

.page-box .tab-head .nav-tabs > li > a {
  padding: unset;
  border: unset;
  background-color: transparent;
}

.page-box .tab-head .nav-tabs > li.active > a,
.page-box .tab-head .nav-tabs > li.active > a:focus,
.page-box .tab-head .nav-tabs > li.active > a:hover {
  color: #f38420;
  border-left: none;
  border-right: none;
  border-top: none;
}

.page-head .head-link {
  font-size: 12px;
  font-weight: 400;
  color: #999;
  line-height: 22px;
}

.page-head .head-drop {
  display: flex;
  align-items: center;
  font-weight: 400;
  color: #f38420;
  white-space: nowrap;
  border: unset;
  background: unset;
  padding: unset;
}

.page-head .head-drop.cancel {
  color: #999;
}

.page-head .page-toplink a {
  font-size: 15px;
  margin-right: 5px;
}

.page-head .page-toplink a:hover {
  color: #f38420;
}

.page-head .page-toplink span {
  margin-left: 5px;
  color: #f38420;
}

.page-head .active {
  color: #f38420;
  position: relative;
}

.page-head .active:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  background-color: #f38420;
  top: 29.5px;
  left: 0;
}

.page-content .page-box > .page-body {
  padding: 15px;
}

.page-content .box-left,
.page-content .box-left-fix {
  padding-right: 5px;
}

.page-content .box-right,
.page-content .box-right-fix {
  padding-left: 5px;
}

.page-content .profile-content {
  display: flex;
}

.page-content .profile-img {
  width: 70px;
  height: 70px;
}

.page-content .profile-img img {
  width: 70px;
  height: 70px;
  border-radius: 50%;
}

.page-content .profile-detail {
  margin-left: 15px;
}

.profile-detail .p-user {
  display: flex;
  align-items: center;
}

.profile-detail .p-user .accout {
  font-size: 16px;
  height: 22px;
  line-height: 22px;
  font-weight: 400;
  color: #333;
}

.profile-detail .p-user .name {
  margin-left: 10px;
  color: #999;
  font-size: 12px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.profile-detail .p-contact {
  height: 17px;
  font-size: 12px;
  font-weight: 400;
  color: #999;
  line-height: 17px;
  margin: 5px 0;
  white-space: nowrap;
}

.profile-detail .level-lab {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
  font-size: 12px;
  display: flex;
  margin-bottom: 5px;
}

.profile-detail .level-lab img {
  width: 14px;
  height: 14px;
  margin-right: 2px;
}

.profile-detail .level-lab .rank-name {
  color: #f38420;
}

.profile-detail .consumption {
  width: 240px;
}

.profile-detail .consumption-lab {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 12px;
  color: #999;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.profile-detail .consumption .progress {
  height: 6px;
  margin-bottom: unset;
  box-shadow: unset;
  background-color: #ebeef5;
}

.progress-bar-profile {
  background-color: #f38420;
  box-shadow: unset;
}

.progress-bar-profile-new {
  background-color: #ff8f00;
  box-shadow: unset;
  border-radius: 50px;
}

.page-content .profile-assets {
  display: flex;
  align-items: center;
  height: 96px;
  font-weight: 400;
  color: #999;
  line-height: 20px;
}

.profile-assets .assets-item {
  width: 33.3%;
  text-align: center;
}

.assets-item .assets-item-title {
  margin-bottom: 5px;
}

.assets-item .recharge-withdraw {
  font-size: 12px;
}

.assets-item .recharge-withdraw a {
  cursor: pointer;
}

.assets-item .recharge-withdraw > .refill {
  color: #f38420;
}

.assets-item .recharge-withdraw > .withdraw {
  color: #999;
}

.assets-item .assets-item-number {
  color: #333;
  text-decoration: unset;
  display: block;
  font-size: 24px;
  height: 33px;
  line-height: 33px;
}

.box-card-content {
  display: flex;
  font-size: 14px;
  font-weight: 400;
  color: #999;
  flex-wrap: wrap;
}

.box-card-content .box-card-content-item {
  display: block;
  width: 50%;
  padding: 20px 0 20px 20px;
  box-sizing: border-box;
  position: relative;
  text-decoration: unset;
}

.box-card-content .card-full {
  width: 100%;
  padding: 15px 0px 15px 20px;
}

.box-card-content .box-card-content-item:after {
  content: "";
  width: 175px;
  height: 1px;
  background-color: #f2f2f2;
  position: absolute;
  bottom: 0;
}

.box-card-content .box-card-content-item:hover {
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16);
}

.box-card-content .box-card-content-item .item-inner {
  border-right: 1px solid #f2f2f2;
  display: flex;
  text-decoration: unset;
}

.item-inner img {
  width: 44px;
  height: 44px;
  margin-right: 5px;
}

.item-inner .item-status {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.item-inner .item-status .status-label {
  color: #333;
  line-height: normal;
}

.box-card-content-item:hover .status-label {
  color: #f38420;
}

.item-inner .item-status .status-number {
  color: #999;
  line-height: normal;
}

.box-card-content .box-card-content-vertical-item {
  width: 100%;
  height: 83px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  justify-content: space-between;
  position: relative;
}

.box-card-content .box-card-content-vertical-item .vertical-item-inner-left {
  display: flex;
  align-items: center;
}

.box-card-content .box-card-content-vertical-item:not(:last-child):after {
  position: absolute;
  content: "";
  width: 390px;
  height: 1px;
  background-color: #f2f2f2;
  bottom: 0;
}

.vertical-item-inner-left img {
  width: 36px;
  height: 36px;
  margin-right: 5px;
}

.vertical-item-inner-left .left-content {
  display: flex;
  flex-direction: column;
  width: 260px;
  font-weight: 400;
}

.left-content .left-title {
  color: #333;
  font-size: 14px;
}

.left-content .left-desc {
  color: #999;
  font-size: 12px;
}

.problem-list {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.problem-list > li {
  height: 40px;
  font-size: 14px;
  font-weight: 400;
  line-height: 40px;
  overflow: hidden;
}

.problem-list > li > a {
  color: #333;
}

.problem-list > li > a:hover {
  color: #f38420;
}

.ps-content {
  height: 320px;
  text-align: center;
  padding-top: 80px;
}

.ps-content .stepbar {
  font-size: 12px;
  margin: 0 auto;
  color: #999;
  height: 62px;
  width: 400px;
  display: flex;
  justify-content: space-between;
}

.ps-content .stepbar .stepbar-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width: 60px;
  user-select: none;
}

.stepbar .stepbar-item:not(:last-child):after {
  content: "";
  width: 106px;
  height: 2px;
  background-color: #ccc;
  position: absolute;
  right: -106px;
  top: 20px;
}

.stepbar .stepbar-item .stepbar-item-circle {
  width: 40px;
  height: 40px;
  background: #f2f2f2;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  margin-bottom: 5px;
}

.stepbar .stepbar-item .stepbar-item-label {
  white-space: nowrap;
}

/* step1 */
.step1 .stepbar-item:first-child .stepbar-item-circle {
  background-color: #f38420;
  color: #fff;
}

.step1 .stepbar-item:first-child .stepbar-item-label {
  color: #f38420;
}

.step1 .stepbar-item:first-child:first-child:before {
  content: "";
  width: 53px;
  height: 2px;
  background-color: #ccc;
  position: absolute;
  right: -106px;
  top: 20px;
}

.step1 .stepbar-item:first-child:first-child:after {
  content: "";
  width: 53px;
  height: 2px;
  background-color: #f38420;
  position: absolute;
  right: -53px;
  top: 20px;
}

/* step2 */
.step2 .stepbar-item:not(:last-child) .stepbar-item-circle {
  background-color: #f38420;
  color: #fff;
}

.step2 .stepbar-item:not(:last-child) .stepbar-item-label {
  color: #f38420;
}

.step2 .stepbar-item:first-child:after {
  content: "";
  width: 106px;
  height: 2px;
  background-color: #f38420;
  position: absolute;
  right: -106px;
  top: 20px;
}

.step2 .stepbar-item:nth-child(2):before {
  content: "";
  width: 53px;
  height: 2px;
  background-color: #ccc;
  position: absolute;
  right: -106px;
  top: 20px;
}

.step2 .stepbar-item:nth-child(2):after {
  content: "";
  width: 53px;
  height: 2px;
  background-color: #f38420;
  position: absolute;
  right: -53px;
  top: 20px;
}

/* step3 */
.step3 .stepbar-item .stepbar-item-circle {
  background-color: #f38420;
  color: #fff;
}

.step3 .stepbar-item .stepbar-item-label {
  color: #f38420;
}

.step3 .stepbar-item:not(:last-child):after {
  content: "";
  width: 106px;
  height: 2px;
  background-color: #f38420;
  position: absolute;
  right: -106px;
  top: 20px;
}

.ps-content .ps-form {
  margin: 60px auto 0;
  font-size: 14px;
  color: #f38420;
}

.ps-content .ps-form .email-normal-notify {
  font-size: 12px;
  color: #b4b4b4;
  margin-top: 10px;
}

.ps-content .ps-form-verify:first-child {
  margin-bottom: 20px;
}

.ps-content .ps-form-verify {
  width: 320px;
  height: 40px;
  border: 1px solid #f38420;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  cursor: pointer;
  user-select: none;
}

.ps-content .ps-form-verify img {
  width: 24px;
  height: 24px;
  margin-right: 5px;
}

.page-content .form-control {
  height: 40px;
  padding: 0px 15px;
  border-color: #dcdfe6;
  box-shadow: unset;
}

.page-content .form-control::placeholder {
  color: #ccc;
}

.page-content .form-control:hover {
  border-color: #c0c4cc;
}

.page-content .form-control:focus {
  border-color: #f5861f;
  color: #f5861f;
}

.form-control.success {
  border-color: #28cb00 !important;
  color: #21a600 !important;
}

.form-control.danger {
  border-color: #ff3e3e !important;
  color: #df0000 !important;
}

.form-control.info {
  border-color: #23afff !important;
  color: #23afff !important;
}

.ps-form .ps-form-group {
  width: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.ps-form .ps-form-group .form-control {
  margin-bottom: 22px;
}

.ps-form .ps-form-group .btn {
  height: 40px;
}

.el-row {
  margin-left: -6px;
  margin-right: -6px;
}

.el-col {
  padding-left: 6px;
  padding-right: 6px;
  margin-bottom: 15px;
}

.setting-card {
  padding: 20px;
  border-radius: 4px;
  border: 1px solid #ebeef5;
  background-color: #fff;
  overflow: hidden;
  color: #303133;
  transition: 0.3s;
}

.setting-card:hover {
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

.setting-card .settingItem {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  height: 190px;
}

.setting-card .settingItem img {
  width: 60px;
  height: 60px;
  margin-bottom: 10px;
}

.setting-card .settingItem .avatar-img {
  border-radius: 50%;
}

.setting-card .settingItem .pfs-label {
  margin-bottom: 5px;
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #333;
  line-height: 20px;
}

.setting-card .settingItem .pfs-value {
  margin-bottom: 20px;
  height: 17px;
  font-size: 12px;
  font-weight: 400;
  color: #999;
  line-height: 17px;
}

.setting-card .settingItem .pfs-value.avar-name {
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.setting-card .settingItem .pfs-value .form-control {
  height: 28px;
  line-height: 28px;
  font-size: 12px;
  text-align: center;
}

.setting-card .settingItem .pfs-none-value {
  color: #f5861f;
}

.setting-card .settingItem .btn {
  width: 137px;
  height: 36px;
  padding: 7px 0px;
  transition: 0.3s;
}

.setting-card .settingItem .name-change {
  width: 100%;
}

.address-content {
  padding: 30px !important;
  min-height: 745px;
}

.address-content .btn-address {
  color: #f38420;
  margin-bottom: 20px;
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #dcdfe6;
  text-align: center;
  box-sizing: border-box;
  outline: 0;
  transition: 0.1s;
  font-weight: 500;
  padding: 12px 20px;
  font-size: 14px;
  border-radius: 4px;
}

.address-content .btn-address:active {
  background-color: #f0f0f0;
}

.address-content .btn-address:hover {
  border-color: #f38420;
}

.address-content .addressDetail {
  width: 434px;
}

.address-content .addressDetail .tips {
  width: 100%;
  padding: 0px 12px;
  box-sizing: border-box;
  line-height: 31px;
  font-size: 12px;
  color: rgba(0, 0, 0, 0.4);
  background: #e2f2fd;
  margin-top: 12px;
}

.address-content .addressDetail .tips img {
  width: 12px;
  height: 12px;
  display: block;
  margin-top: 9px;
  margin-right: 6px;
  float: left;
}

.address-content .addressList {
  margin-top: 15px;
}

.address-content .address-table {
  color: #606266;
}

.address-table > tbody > tr > td,
.address-table > tbody > tr > th,
.address-table > tfoot > tr > td,
.address-table > tfoot > tr > th,
.address-table > thead > tr > td,
.address-table > thead > tr > th {
  padding: 15px 8px;
  border-top: 1px solid #ebeef5;
}

.address-content .address-table th,
.address-content .address-table td {
  text-align: center;
}

.address-content .address-table > thead > tr > th {
  border-bottom: 1px solid #ebeef5;
  color: #909399;
}

.address-table .address-detail {
  white-space: pre-wrap;
  width: 200px;
}

.address-table .ad-radio {
  cursor: pointer;
}

/* modal-style */
.modal-vcb {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
  margin-top: 15%;
  /* margin-top: 30%; */
}

.modal-vcb .modal-content {
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.modal-vcb .close {
  font-weight: normal;
}

.page-content label {
  font-weight: normal;
  padding-right: unset;
}

.page-content .form-required:before {
  content: "*";
  color: #f56c6c;
  margin-right: 4px;
}

.page-content .form-textarea {
  height: auto;
  padding: 8px 15px;
}

.modal-vcb .form-control {
  font-size: 13px;
}

.modal-vcb .form-control::placeholder {
  font-size: 12px;
}

.modal-alert {
  font-family: "Noto Sans Thai", sans-serif;
}

.modal-alert .modal-header {
  border: unset;
  padding: 15px 15px 0px 15px;
}

.modal-alert .modal-header .modal-title {
  font-weight: 600;
}

.modal-alert .modal-body {
  font-size: 16px;
}

.modal-alert .modal-footer {
  border: unset;
}

.modal-alert .modal-footer .btn {
  font-size: 16px;
  border-radius: 50px;
}

.modal-alert .modal-content {
  border-radius: 20px;
}

.vcbnew-arti .modal-vcb {
  font-family: "Noto Sans Thai", sans-serif;
}

@media (min-width: 768px) {
  .modal-vcb {
    margin: 138px auto;
  }

  .modal .qrcode {
    width: 400px;
  }

  .modal-alert {
    width: 500px;
  }
}

.index-content {
  font-family: Thonburi, Avenir, Helvetica, Arial, sans-serif;
  padding-bottom: 60px;
}

.advert-top {
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
}

.advert-top .addvert-box:hover {
  opacity: 0.7;
}

.advert-top .addvert-box img {
  width: 100%;
}

.floorList {
  padding-top: 30px;
}

.gl-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.gl-nav a {
  color: #000;
  text-decoration: unset;
}

.gl-nav a > i {
  font-size: 17px;
  margin-left: 7px;
}

.gl-nav .gl-title {
  display: flex;
  align-items: center;
}

.gl-nav .gl-title .gl-name {
  font-weight: 700;
  font-size: 18px;
}

.gl-nav .gl-title .gl-small {
  margin-left: 10px;
  color: #999;
  font-size: 14px;
}

.goodsList .gl-content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.goodsList .gl-content a {
  text-decoration: unset;
}

.goodsList .gl-content .activity {
  margin-top: 10px;
}

.goodsList .gl-content .activity:hover {
  opacity: 0.7;
}

.goodsList .gl-content .activity img {
  width: 534px;
  height: 100%;
}

.goodsList .gl-content .goods {
  display: flex;
  flex-direction: column;
  width: 262px;
  background-color: #fff;
  margin: 10px 0 0;
  padding: 5px 10px 10px;
  box-sizing: border-box;
  color: #999;
  border: 1px solid #f2f2f2;
}

.goodsList .gl-content .goods:hover {
  box-shadow: 0 2px 5px 5px rgba(0, 0, 0, 0.075);
}

.goodsList .gl-content .goods .images {
  position: relative;
  margin: auto;
  padding: 20px 0;
}

.goodsList .gl-content .goods .images img {
  width: 200px;
  height: 200px;
}

.goodsList .gl-content .goods .images .left-tags {
  position: absolute;
  top: 20px;
  left: 0;
  max-width: 90%;
  color: #fff;
  background-image: linear-gradient(229deg, #f5851f, #ff2121);
  border-radius: 0 0 10px 0;
  padding: 3px;
  padding-right: 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  z-index: 10;
}

.goodsList .gl-content .goods .images .left-tags img {
  width: 14px;
  height: 19px;
  padding-bottom: 1px;
  box-sizing: border-box;
}

.goodsList .gl-content .goods .gl-name {
  font-weight: 700;
  margin-bottom: 5px;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.goodsList .gl-content .goods .gl-des {
  color: #999;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.goodsList .gl-content .goods .priceBox {
  display: flex;
  margin: 5px 0;
}

.goodsList .gl-content .goods .priceBox .price {
  color: #f5851f;
}

.goodsList .gl-content .goods .priceBox .linePrice {
  margin-left: 10px;
  color: #999;
  text-decoration: line-through;
}

.goodsList .gl-content .goods .goods-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.goodsList .gl-content .goods .goods-bottom .buttons {
  display: flex;
}

.goodsList .gl-content .goods .goods-bottom .buttons .gl-bt {
  padding: 2px 10px;
  background-color: #f5851f;
  color: #fff;
}

.goodsList .gl-content .goods .goods-bottom .buttons .link {
  margin-left: 10px;
  background-color: #fff;
  border: 1px solid #e7e7e7;
  color: #999;
}

.dont-miss {
  padding-top: 30px;
}

.dont-miss .dm-content {
  margin-top: 10px;
  height: 350px;
  width: 100%;
  display: flex;
  background-color: #fff;
}

.dont-miss .dm-content .article {
  width: 19%;
}

.dont-miss .dm-content .article .article-left {
  position: relative;
  height: 350px;
}

.dont-miss .dm-content .article .article-left .options {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  background: hsla(0, 0%, 100%, 0.7);
}

.dont-miss .dm-content .article .article-left .options .option-item {
  cursor: pointer;
  width: 120px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  color: #333;
}

.dont-miss .dm-content .article .article-left .options .active {
  background-color: #333;
  color: #fff;
}

.dont-miss .dm-content .article .article-left img {
  max-width: 100%;
  height: 350px;
  -o-object-fit: cover;
  object-fit: cover;
}

.dont-miss .dm-content .aside {
  display: flex;
  width: 80%;
  margin: auto;
  text-align: center;
}

.dont-miss .dm-content .aside .aside-box {
  width: 25%;
  min-height: 350px;
  padding: 20px 0;
  margin: 0 11px;
}

.dont-miss .dm-content .aside .aside-box a {
  color: #000;
  text-decoration: unset;
}

.dont-miss .dm-content .aside .aside-box .childBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
}

.dont-miss .dm-content .aside .aside-box .childBox:hover {
  opacity: 0.7;
}

.dont-miss .dm-content .aside .aside-box .childBox img {
  width: 92px;
  height: 90px;
  margin-top: 30px;
}

.dont-miss .dm-content .aside .aside-box .childBox .name {
  font-weight: 700;
  font-size: 16px;
  padding: 20px 0 10px;
  line-height: normal;
}

.dont-miss .dm-content .aside .aside-box .childBox .introduce {
  text-align: start;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 10px;
  box-sizing: border-box;
  line-height: normal;
}

.promotionList {
  padding-top: 30px;
  padding-bottom: 20px;
}

.promotionList .pro-content {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  text-align: left;
}

.promotionList .pro-content .goodsBox {
  width: 49.5%;
  border: 1px solid #e7e7e7;
  border-radius: 1px;
  background-color: #fff;
  color: #999;
  box-sizing: border-box;
}

.promotionList .pro-content .goodsBox a {
  color: #999;
  text-decoration: unset;
}

.promotionList .pro-content .goodsBox .big {
  width: 100%;
  height: 266px;
}

.promotionList .pro-content .goodsBox .big:hover {
  opacity: 0.7;
}

.promotionList .pro-content .bigBox {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 30px;
  box-sizing: border-box;
}

.promotionList .pro-content .bigBox .goods-item {
  width: 31%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.promotionList .pro-content .bigBox .goods-item:hover {
  opacity: 0.7;
}

.promotionList .pro-content .bigBox .goods-item img {
  width: 145px;
  height: 145px;
}

.promotionList .pro-content .bigBox .goods-item .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 13px 0 5px;
  color: #333;
}

.promotionList .pro-content .bigBox .goods-item .price {
  color: #f5851f;
  margin-bottom: 3px;
}

.promotionList .pro-content .bigBox .goods-item .bottoms {
  display: flex;
  justify-content: space-between;
}

.promotionList .pro-content .bigBox .goods-item .bottoms .linePrice {
  text-decoration: line-through;
}

.conventional {
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
}

.conventional .image-item {
  width: 49.3%;
}

.conventional .image-item:hover {
  opacity: 0.7;
}

.conventional .image-item img {
  width: 100%;
  height: 300px;
}

.recommend {
  padding-top: 25px;
}

.recommend .rc-content {
  display: flex;
  box-sizing: border-box;
  margin-top: 10px;
  width: 100%;
  justify-content: space-between;
  text-align: left;
}

.recommend .rc-content a {
  color: #999;
  text-decoration: unset;
}

.recommend .rc-content .rc-goods {
  width: 49.5%;
  color: #999;
  border: 1px solid #e7e7e7;
  display: flex;
  box-sizing: border-box;
}

.recommend .rc-content .rc-goods .image-left {
  min-width: 175px;
  height: 530px;
  object-fit: cover;
}

.recommend .rc-content .rc-goods .image-left:hover {
  opacity: 0.7;
}

.recommend .rc-content .rc-goods .goodsBox {
  width: 66.8%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  background-color: #fff;
  padding: 30px 19px 0;
  box-sizing: border-box;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item {
  width: 47%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item:hover {
  opacity: 0.7;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item img {
  width: 100%;
  height: 145px;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 13px 0 5px;
  color: #333;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item .price {
  color: #f5851f;
  margin-bottom: 3px;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item .bottoms {
  display: flex;
  justify-content: space-between;
}

.recommend .rc-content .rc-goods .goodsBox .goods-item .bottoms .linePrice {
  text-decoration: line-through;
}

.page-content .page-search {
  padding: 15px 20px;
  box-sizing: border-box;
}

.page-content .order-search .search-title {
  font-size: 15px;
  color: #666;
  line-height: 45px;
  padding-left: 10px;
  border-bottom: 1px solid #f38420;
}

.page-content .order-search .search-content {
  padding: 20px 10px 0px;
  color: #666;
}

.page-content .input-mini {
  height: 28px;
  font-size: 12px;
}

.page-content select:focus {
  color: #666 !important;
}

.page-content select > option {
  font-size: 13px;
}

.alertError {
  background: #ffd9ba;
  color: #ff4a44;
  line-height: 40px;
  padding-left: 20px;
  font-weight: 600;
}

.order-table {
  color: #666;
}

.order-table > tbody > tr > td,
.order-table > tbody > tr > th,
.order-table > tfoot > tr > td,
.order-table > tfoot > tr > th,
.order-table > thead > tr > td,
.order-table > thead > tr > th {
  border: unset;
}

.order-table .group-head {
  background-color: #efefef;
}

.order-table .group-head .status {
  color: #f38420;
  width: max-content;
}

.order-table .group-head .order-head {
  display: flex;
}

.order-table .group-head .order-head .or-detail {
  margin-right: 10px;
}

.order-table .group-head .order-head .or-detail a {
  color: #f38420;
  text-decoration: unset;
}

.order-table .bottom-action {
  position: relative;
}

.order-table .ba {
  border: 1px solid #eee;
}

.order-table .bb {
  border-bottom: 1px solid #eee;
}

.order-table .be {
  border-right: 1px solid #eee;
}

.order-table .order-price,
.order-table .order-qty {
  font-size: 12px;
}

.order-table .order-title {
  width: 270px;
  box-sizing: border-box;
  font-size: 12px;
  white-space: normal;
}

.order-table .order-title .order-name {
  box-sizing: border-box;
  margin-bottom: 1px;
  line-height: normal;
}

.order-table .order-title .order-space {
  margin-bottom: 4px;
}

.order-table .order-title .order-sku {
  box-sizing: border-box;
  margin-bottom: 1px;
  color: rgb(156, 156, 156);
  line-height: normal;
  word-wrap: break-word;
}

.order-table .order-img {
  padding-top: 4px;
}

.order-table .order-img img {
  width: 90px;
  height: 90px;
}

.order-table .order-type {
  /* width: max-content; */
  text-align: right;
}

.order-table .order-action {
  position: absolute;
  bottom: 8px;
  width: 250px;
}

.order-table .order-action .btn {
  margin-right: 6px;
}

@media (min-width: 1024px) {
  .table-responsive {
    overflow-x: unset;
  }
}

.img-full {
  width: 100% !important;
  height: unset !important;
}

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

.highlight {
  color: #f38420;
}

.labelTag {
  background-color: #ffe9d7;
  border: 1px solid #f5851f;
  color: #f5851f;
  padding: 5px 10px;
  font-size: 12px;
}

.order-box .order-subject {
  color: #999;
}

.order-box .order-created {
  margin-bottom: 15px;
  position: relative;
}

.order-box .order-detail .od-item {
  margin-bottom: 7px;
}

.or-table {
  margin: unset;
  font-size: 12px;
}

.or-table tfoot {
  height: 64px;
}

.or-table tfoot tr > td {
  vertical-align: middle;
}

.or-table tbody > tr > td {
  border: 1px solid #e0dfdb;
  vertical-align: middle;
}

.or-table .orderTitle {
  background: #eeeeee;
  color: #565656;
}

.or-table .orderTitle img {
  height: 21px;
  margin-right: 5px;
}

.or-table .imgDetail {
  position: relative;
  height: 125px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.or-table .imgDetail img {
  width: 60px;
  height: 60px;
}

.or-table .imgDetail span {
  font-size: 10px;
  text-align: center;
  display: block;
  width: 120px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: normal;
}

.or-table .imgDetail .more-detail-bt {
  line-height: 20px;
  color: #00aeff;
  overflow: visible;
  cursor: pointer;
  position: relative;
}

.or-table .imgDetail .more-detail-bt:hover {
  color: #0089c8;
}

.or-table .imgDetail .more-detail-bt .detail-box {
  position: absolute;
  background-color: #fff;
  color: #a9a9a9;
  max-width: 300px;
  left: 70px;
  top: -40px;
  border: 1px solid #ececec;
  text-align: left;
  padding: 10px 30px;
  overflow: hidden;
  display: none;
  border-radius: 4px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
  z-index: 1;
}

.detail-box .timeline {
  display: flex;
  align-items: center;
}

.detail-box .timeline .tl-created {
  text-align: center;
  font-size: 10px;
  line-height: normal;
}

.detail-box .separate {
  clear: both;
  font-size: 22px;
  padding-left: 34px;
  color: rgba(0, 0, 0, 0.15);
  margin: 8px 0px;
}

.detail-box .timeline .tl-status {
  text-align: left;
  font-size: 12px;
  margin-left: 50px;
}

.detail-box .active .tl-time {
  color: #000;
}

.detail-box .active .tl-status {
  color: #f38420;
}

.or-table .imgDetail .more-detail-bt:hover .detail-box {
  display: block;
}

.or-table .fa-check {
  color: #f38420;
  font-size: 16px;
}

.page-content .text-remark {
  font-size: 12px;
  color: #f38420;
  text-align: center;
}

.promo-bd {
  background: #ffd9ba;
  color: #ff4a44;
  font-weight: 600;
  padding: 0px 17px;
  border-radius: 50px;
}

.order-created .order-action {
  position: absolute;
  right: 15px;
  top: 27px;
  z-index: 2;
}

.order-created .order-action a {
  display: block;
  margin-bottom: 8px;
}

.payment-content {
  padding: 20px 0px;
}

.payment-content .alertError {
  padding-left: 48px;
  font-size: 16px;
}

.payment-content .payment-body {
  padding: 15px 48px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.65);
}

.payment-content .payment-body .balance {
  margin-bottom: 15px;
}

.payment-content .payment-body .balance span {
  font-size: 18px;
}

.payment-content .payment-body .payPrice {
  margin-bottom: 15px;
}

.payment-content .payment-body .payPrice .price {
  font-size: 18px;
}

.payment-content .payment-body .payPrice span {
  color: #f38420;
}

.payment-content .payment-body .remark {
  display: flex;
  color: #ff4040;
}

.payment-content .payment-body .remark .remark-content {
  line-height: normal;
}

.payment-content .payment-body .couponData {
  margin-bottom: 20px;
}

.payment-content .payment-body .couponData .code-status {
  margin-left: 7px;
}

.payment-content .payment-body .couponData .code-status span {
  font-size: 14px;
}

.payment-content .payment-body .couponData .code-status i {
  margin-right: 6px;
}

.payment-content .payment-body .couponData .form-control {
  display: inline-block;
  width: 350px;
  height: 32px;
}

.payment-content .payment-paynow {
  background-color: #fff;
  padding: 15px 48px 0px;
  border-bottom: 1px solid #d0d0d0;
}

.payment-content .payment-paynow .actualPayment {
  line-height: 80px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.65);
}

.payment-content .payment-paynow .actualPayment span {
  font-size: 32px;
  color: #ff4040;
}

.payment-content .payment-paynow .actualPayment .notEnoughTip {
  line-height: 60px;
}

.payment-content
  .payment-paynow
  .actualPayment
  .notEnoughTip
  .notEnoughTip_text {
  font-size: 16px;
  margin-right: 10px;
}

.payment-content .payment-bottom {
  padding: 24px 48px;
  background-color: #fff;
}

.payment-content .bottom-wn {
  color: #ff0000;
  font-size: 17px;
  line-height: 20px;
  margin-top: 15px;
  margin-bottom: 25px;
}

.payment-content .btn-payment {
  background: #ff4040;
  border-radius: 2px;
  color: #fff;
  border: none;
  box-sizing: border-box;
  outline: 0;
  margin: 0;
  transition: 0.1s;
  font-weight: 500;
  padding: 12px 20px;
  font-size: 14px;
  text-align: center;
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.payment-content .btn-payment:hover {
  opacity: 0.7;
}

.modal-vcb .dialog-content {
  color: #606266;
  font-size: 14px;
  word-break: break-all;
  padding: 10px;
  line-height: normal;
}

.modal-vcb .dialog-content .main-item {
  margin-bottom: 20px;
}

.modal-vcb .dialog-content .main-item .main-titles {
  color: #f38420;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 15px;
}

.modal-vcb .dialog-content .main-item .main-content {
  font-size: 14px;
}

.modal-vcb .dialog-content .main-item .main-content ol {
  margin: 0;
  padding: 0;
}

.modal-vcb .dialog-content .main-item .main-content ol > li {
  list-style-type: decimal;
  margin-bottom: 5px;
  margin-left: 15px;
}

.modal-vcb .dialog-content .main-item .main-content {
  font-size: 14px;
}

.modal-vcb .dialog-content .main-item .main-content ul {
  margin: 0;
  padding: 0;
}

.modal-vcb .dialog-content .main-item .main-content ul > li {
  margin-bottom: 5px;
  margin-left: 15px;
}

.modal-vcb .modal-footer .checkbox {
  position: relative;
  display: block;
  float: left;
  margin: unset;
  margin-left: 10px;
}

.text-red {
  color: red;
}

.text-green {
  color: green;
}

.text-blue {
  color: blue;
}

.page-content .vcb-paging {
  padding: 15px 0px;
}

.nav-tabs > li > a {
  margin-right: unset;
}

.page-content .box-center,
.page-content .box-center-left,
.page-content .box-center-right {
  padding-right: 5px;
  padding-left: 5px;
}

.page-content .topBox {
  padding: 28px 0;
  position: relative;
  text-align: center;
}

.page-content .topBox .topBox_all {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.45);
  margin-bottom: 7px;
}

.page-content .topBox .topBox_balance {
  color: #f38420;
  font-size: 26px;
  line-height: 40px;
}

.page-content .topBox .topBox_btn {
  width: 100%;
  padding-top: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-content .topBox .topBox_btn .btn {
  font-size: 14px;
}

.page-content .topBox .tb-left {
  display: flex;
  align-items: center;
  justify-content: left;
}

.page-content .topBox .topBox_all span {
  color: #f38420;
  text-align: center;
  font-size: 26px;
  font-family: HelveticaNeue;
  line-height: normal;
}

.page-content .topBox .topBox_all .tb-lab {
  color: rgba(0, 0, 0, 0.45);
  font-size: 14px;
  margin-right: 10px;
}

.page-content .topBox .newLevel {
  color: rgb(102, 102, 102);
  padding-bottom: 12px;
  border-bottom: 1px dashed #e5e5e5;
  line-height: normal;
  text-align: left;
}

.page-content .topBox .levelDetail .levelMoney {
  display: flex;
  margin-bottom: 7px;
}

.page-content .topBox .levelDetail .levelMoney > div {
  text-align: center;
  color: #999;
  font-size: 12px;
  line-height: normal;
  flex: 1;
}

.page-content .topBox .levelDetail .levelIcon {
  display: flex;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6px;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel:first-child {
  padding-left: 45px;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel .box {
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: #ccc;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel:first-child .box {
  background: #f48421;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel .nowline {
  width: 90px;
  height: 2px;
  background: #ccc;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel .nowline div {
  height: 2px;
  background: #f48421;
  border-radius: 100px;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel:last-child {
  flex: none;
  width: 6px;
}

.page-content .topBox .levelDetail .levelIcon .nowLevel:last-child .box {
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: #ccc;
}

.page-content .topBox .levelDetail .levelTitle {
  display: flex;
  margin-top: 5px;
}

.page-content .topBox .levelDetail .levelTitle > div {
  text-align: center;
  color: #666;
  font-size: 12px;
  line-height: normal;
  flex: 1;
}

.page-box .tab-menu {
  display: block !important;
  padding: 15px 0px !important;
}

.page-box .tab-menu > ul {
  display: flex;
  align-items: center;
}

.page-box .tab-menu > ul > li {
  width: 20% !important;
  text-align: center;
  padding: unset;
  font-size: 16px;
}

.page-box .tab-menu .active:after {
  top: 37px;
}

.page-box .tab-menu2 {
  display: block !important;
  padding: 15px !important;
}

.page-box .tab-menu2 > ul {
  display: flex;
  align-items: center;
}

.page-box .tab-menu2 > ul > li {
  text-align: center;
  padding: 0px 20px;
  font-size: 16px;
}

.page-box .tab-menu2 .active:after {
  top: 37px;
}

.page-content .input-group .form-control,
.page-content .input-group .input-group-btn .btn {
  height: 32px !important;
}

.page-content .input-group .input-group-btn .btn {
  border-color: #dcdfe6;
  padding: 0px 10px;
}

.page-content .input-group .input-group-btn .btn i {
  color: #aeaeae;
}

.page-content .page-body .page-item {
  padding: 20px;
}

.page-content .table-box {
  height: 385px;
  overflow-x: auto;
}

.table-box .table-bordered {
  border: unset;
}

/* vcb-table */
.vcb-table {
  margin: unset;
  color: #606266;
}

.vcb-table a {
  color: #606266;
  text-decoration: unset;
}

.vcb-table a:hover {
  color: #f38420;
}

.vcb-table > thead {
  height: 55px;
}

.vcb-table > thead > tr {
  background-color: #fafafa;
  color: #909399;
}

.vcb-table > thead > tr > th {
  vertical-align: middle;
  text-align: center;
  border-bottom: unset;
  border-color: #ebeef5;
}

.vcb-table > tbody > tr > td {
  padding: 12px 8px;
  vertical-align: middle;
  text-align: center;
  border-color: #ebeef5;
  border-top: 1px solid #ebeef5;
  border-bottom: 1px solid #ebeef5;
}

/* end */

.page-content .withdraw-content {
  padding-top: 26px;
}

.withdraw-content .alert-bar {
  background-color: #fef0f0;
  color: #f56c6c;
  width: 100%;
  padding: 8px 20px;
  margin: 0;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}

.withdraw-content .alert-bar .title {
  font-size: 13px;
  margin-bottom: 5px;
}

.withdraw-content .alert-bar .des {
  font-size: 12px;
}

.withdraw-content .alert-bar ul {
  margin: unset;
  padding-left: 26px;
}

.withdraw-content .wd-form {
  padding: 40px 140px;
}

.withdraw-content .wd-form .deposite_payment {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  line-height: 22px;
  margin-bottom: 25px;
  text-align: left;
}

.withdraw-content .wd-form .deposite_payment span {
  font-family: Thonburi;
  font-size: 14px;
  color: #f38420;
  margin-left: 10px;
}

.withdraw-content .wd-form .deposite_alert {
  color: red;
  font-size: 12px;
  padding-left: 160px;
  margin-top: -20px;
  margin-bottom: 0px;
  display: none;
}

.withdraw-content .wd-form .deposite_input {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  line-height: 22px;
  text-align: left;
  margin-bottom: 25px;
  display: flex;
  align-items: center;
}

.withdraw-content .wd-form .deposite_input .form-control {
  margin-left: 10px;
  width: 211px;
  height: 33px;
}

.withdraw-content .wd-form .deposite_input .wd-wrap {
  position: relative;
}

.withdraw-content .wd-form .deposite_input .wd-alert {
  position: absolute;
  color: red;
  font-size: 12px;
  left: 10px;
  bottom: -22px;
}

.withdraw-content .wd-form .deposite_changeBank {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  line-height: 22px;
  text-align: left;
  display: flex;
}

.withdraw-content .wd-form .deposite_changeBank .bank-lab {
  width: 15%;
}

.withdraw-content .wd-form .deposite_changeBank .bank-list {
  width: 85%;
}

.withdraw-content .wd-form .deposite_changeBank .bank-list .bank-item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
}

.withdraw-content .wd-form .deposite_changeBank .bank-list .bank-item .radio {
  margin: unset;
}

.withdraw-content .wd-form .deposite_changeBank .bank-list .bank-item .radio {
  padding-left: 26px;
}

.withdraw-content
  .wd-form
  .deposite_changeBank
  .bank-list
  .bank-item
  .radio
  input[type="radio"] {
  margin-left: -40px;
}

.bank-action .edit,
.bank-action .delete {
  height: 19px;
  color: #f48421;
  border-bottom: 1px solid #f48421;
  cursor: pointer;
  display: inline;
}

.bank-action .delete {
  margin-left: 20px;
}

.withdraw-bottom {
  text-align: center;
  padding: 0px 40px 30px 40px;
}

.withdraw-bottom .addbank {
  width: 100%;
  height: 32px;
  border: 1px dashed #d9d9d9;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.65);
  letter-spacing: 0;
  line-height: 32px;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
}

.withdraw-bottom .addbank:hover {
  border-color: #f4933c;
}

.withdraw-bottom .addbank span {
  font-size: 21px;
  margin-right: 7px;
}

.withdraw-bottom .otp-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0px 25% 30px;
  position: relative;
  align-items: center;
}

.withdraw-bottom .otp-group .otp-button {
  position: absolute;
  top: 7px;
  right: 12px;
  color: #f38420;
  font-size: 13px;
  cursor: pointer;
}

.withdraw-bottom .otp-group .otp-button.cd {
  color: #b1b1b1;
}

.withdraw-bottom .otp-group .form-control {
  height: 34px;
  font-size: 13px;
}

.withdraw-bottom .btn:disabled {
  opacity: 1;
  background-color: #ccc;
  border-color: #ccc;
}

.form-trans {
  background-color: transparent !important;
  border: unset !important;
}

.refill-box .page-body {
  padding: 25px !important;
}

.refill-box .refill-topbar {
  margin-bottom: 25px;
}

.refill-box .refill-topbar .rtb-head {
  font-size: 18px;
  font-weight: bold;
}

.refill-box .refill-topbar .rtb-body {
  padding-left: 22%;
  font-size: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e9e9e9;
}

.refill-box .refill-topbar .rtb-body .radio {
  margin-bottom: 20px;
}

.refill-box .radio label {
  padding-left: 22px;
}

.refill-box .radio input[type="radio"] {
  width: 15px;
  height: 15px;
  margin: 3px 0px 0px -22px;
  accent-color: #ff5f00;
}

.refill-box .refill-body {
  display: none;
}

.refill-box .refill-body .rb-head {
  font-size: 16px;
  font-weight: bold;
}

.refill-box .refill-body .rb-body {
  padding-top: 25px;
  padding-bottom: 40px;
  display: flex;
  border-bottom: 1px solid #e9e9e9;
}

.refill-box .refill-body .rb-body .rb-lab {
  width: 22%;
  font-weight: bold;
}

.refill-box .refill-body .rb-body .rb-list {
  width: 78%;
  font-size: 16px;
}

.refill-box .refill-body .rb-body .rb-list .refill-item:not(:last-child) {
  margin-bottom: 40px;
}

.refill-box .refill-body .rb-body .rb-list .refill-item .radio {
  margin: unset;
}

.refill-box .refill-body .rb-body .rb-list .refill-item .radio label {
  padding: unset;
  display: flex;
  align-items: center;
}

.refill-box
  .refill-body
  .rb-body
  .rb-list
  .refill-item
  .radio
  label
  input[type="radio"] {
  margin: unset;
  position: unset;
}

.refill-box .refill-body .rb-body .rb-list .refill-item .bank-icon {
  height: 32px;
  margin: 0 8px;
}

.refill-box .refill-body .rb-body .rb-list .refill-item .bank-icon img {
  height: 100%;
}

.refill-box
  .refill-body
  .rb-body
  .rb-list
  .refill-item
  .bank-info
  .bank-name
  span {
  margin-left: 7px;
  font-size: 14px;
  color: rgb(153, 153, 153);
}

.refill-box
  .refill-body
  .rb-body
  .rb-list
  .refill-item
  .bank-info
  .bank-name
  .btn {
  margin-left: 25px;
}

.refill-box
  .refill-body
  .rb-body
  .rb-list
  .refill-item
  .bank-info
  .bank-des
  span {
  font-size: 14px;
  margin-right: 10px;
  color: rgb(153, 153, 153);
}

.refill-box .refill-body .rb-form {
  padding-top: 35px;
}

.refill-box .refill-body .rb-form .rf-form-group {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-lab {
  width: 40%;
  text-align: right;
  font-weight: bold;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input {
  width: 60%;
  padding-left: 20px;
  position: relative;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input .preview {
  position: absolute;
  bottom: 0px;
  color: rgb(255, 104, 1);
  text-decoration: unset;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input .form-control {
  width: 211px;
  height: 32px;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input .card-upload {
  background-color: #fbfdff;
  border: 1px dashed #c0ccda;
  border-radius: 6px;
  box-sizing: border-box;
  width: 148px;
  height: 148px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  margin: unset;
  float: left;
  margin-right: 10px;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input .card-upload:hover {
  color: #f5861f;
  border-color: #f5861f;
}

.refill-box .refill-body .rb-form .rf-form-group .rf-input .card-upload span {
  font-size: 34px;
  line-height: normal;
  color: #8c939d;
}

.refill-box
  .refill-body
  .rb-form
  .rf-form-group
  .rf-input
  .card-upload:hover
  span {
  color: #f5861f;
}

.refill-box
  .refill-body
  .rb-form
  .rf-form-group
  .rf-input
  .card-upload
  .uploadFile {
  display: none;
}

.refill-box .refill-body .rb-form .rf-remark {
  display: flex;
  justify-content: center;
}

.refill-box .refill-body .rb-form .rf-remark > ul {
  list-style-type: none;
  padding: unset;
  margin: 0;
  color: red;
  font-size: 12px;
}

.refill-box .refill-body .rb-form .rf-remark > ul > li {
  line-height: 24px;
  padding-left: 16px;
  position: relative;
}

.refill-box .refill-body .rb-form .rf-remark > ul > li:before {
  content: "-";
  position: absolute;
  left: 0px;
}

.refill-box .refill-footer {
  text-align: center;
  padding-top: 35px;
  padding-bottom: 20px;
}

.coupon-content {
  margin-top: 20px;
}

.coupon-content .nav-tabs {
  border-bottom: 1px solid #e6e6e6;
}

.coupon-content .nav-tabs > li.active > a,
.coupon-content .nav-tabs > li.active > a:focus,
.coupon-content .nav-tabs > li.active > a:hover {
  color: #f38420;
  border-left: none;
  border-right: none;
  border-top: none;
  border-bottom: 2px solid #f38420;
}

.coupon-content .nav-tabs > li > a {
  background-color: #fff !important;
  border: unset;
  padding: 15px;
}

.coupon-content .nav-tabs a {
  color: #909399;
}

.coupon-content .nav-tabs a span {
  margin-left: 10px;
}

.coupon-content .nav-tabs a:hover {
  color: #303133;
}

.coupon-content .vcb-table-coupon {
  font-size: 12px;
  margin-top: 20px;
  margin-bottom: 50px;
}

.vcb-table .bt-detail {
  color: #f38420;
  cursor: pointer;
}

.modal-vcb .header-colored {
  background-color: #f38420;
  color: #fff;
  padding: 10px 20px;
}

.modal-vcb .header-colored .close {
  color: #fff;
  opacity: 0.8;
}

.page-content .page-gray {
  background-color: #ededed;
}

.page-content .page-gray > .page-head {
  border-bottom: 1px solid #e0e0e0;
}

.page-box .tab-vcb-address {
  padding-top: 20px !important;
}

.page-box .tab-vcb-address li {
  margin-right: 30px;
}

.page-content .vcb-address .addressTitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #f38420;
  line-height: 22px;
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: bold;
}

.page-content .vcb-address .addressDesc > ul {
  padding: unset;
  font-size: 16px;
}

.page-content .vcb-address .addressDesc > ul > li {
  line-height: 22px;
  list-style: none;
  margin-bottom: 10px;
  padding-left: 20px;
  position: relative;
}

.page-content .vcb-address .addressDesc > ul > li::before {
  font-size: 1.4em;
  content: "•";
  position: absolute;
  left: 0;
}

.page-content .vcb-address .addressDesc > ul > li .copyicon {
  cursor: pointer;
}

.page-content .vcb-address .addressDesc > ul > li .copyicon img {
  vertical-align: middle;
  width: 16px;
  height: 16px;
  margin-left: 10px;
  margin-top: -3px;
}

.page-content .vcb-address .addressDesc > ul > li .copyicon:hover img {
  content: url("/img/copy-icn_hover.svg");
}

.page-content .vcb-address .addressInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.page-content .vcb-address .addressInfo .into-text {
  color: #666;
  display: flex;
  align-items: center;
}

.page-content .vcb-address .addressInfo .into-text i {
  color: #9f9f9f;
  font-size: 18px;
  margin-right: 7px;
}

.page-content .vcb-address .addressInfo .info-update {
  color: #f38420;
  font-size: 16px;
}

.page-content .goods-box .page-body:not(:last-child) {
  border-bottom: 1px solid #ebeef5;
}

.page-content .goods-box .page-body {
  padding: 16px 32px;
}

.page-content .goods-box .page-form {
  padding: 24px 32px;
}

.page-content .page-body > .title,
.page-content .page-form > .title {
  font-size: 16px;
  font-weight: bold;
}

.page-content .page-body > .title2,
.page-content .page-form > .title2 {
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.page-content .page-body > .des,
.page-content .page-form > .des {
  font-size: 12px;
  opacity: 0.65;
}

.page-content .page-form .title {
  margin-bottom: 25px;
}

.page-content .goods-box .goods-item {
  height: 72px;
  background: #fafafa;
  box-sizing: border-box;
  border: 1px solid #e9e9e9;
  line-height: 72px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
}

.page-content .goods-box .goods-item .goods-details {
  width: 45%;
  display: flex;
  align-items: center;
}

.page-content .goods-box .goods-item .form-textarea {
  height: 54px;
  padding: 5px 15px;
  width: 190px;
}

.page-content .goods-box .goods-item .goods-details img {
  width: 60px;
  margin: 0px 22px;
}

.page-content .goods-box .goods-item .goods-info {
  width: 55%;
  display: flex;
  align-items: center;
}

.page-content .goods-box .goods-item .goods-info .form-control {
  height: 32px;
}

.page-content .goods-box .goods-item .goods-info span {
  margin: 0px 15px;
  opacity: 0.25;
}

.page-content .goods-box .goods-item .goods-info .delete {
  color: #000;
  font-size: 16px;
  margin-left: 24px;
  margin-right: 35px;
  cursor: pointer;
}

.page-content .goods-box .goods-item .goods-info .delete:hover {
  opacity: 0.65;
}

.page-content .goods-box .goods-add {
  font-size: 14px;
  border: 1px dashed #d9d9d9;
  line-height: 32px;
  margin-bottom: 15px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-content .goods-box .goods-add span {
  font-size: 22px;
  margin-right: 7px;
}

.page-content .goods-box .goods-add:hover {
  border-color: #f38420;
}

.page-content .total-cost-box {
  text-align: right;
}

.page-content .total-cost-box .bottom-box {
  margin-bottom: 12px;
  line-height: normal;
}

.page-content .total-cost-box .bottom-box .total-cost {
  color: #f4933c;
}

.page-content .contract-form .cf-group {
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-content .contract-form .cf-group:not(:last-child) {
  margin-bottom: 30px;
}

.page-content .contract-form .cf-group span {
  width: 150px;
  text-align: right;
  padding-right: 12px;
}

.page-content .contract-form .cf-group .form-control {
  height: 32px;
  width: 222px;
  margin-right: 120px;
}

.page-content .contract-form .cf-group .form-textarea {
  height: auto;
  padding: 5px 15px;
}

.page-content .contract-form .cf-group .btn {
  width: 80px;
}

.rf-alert {
  text-align: center;
  padding-top: 30px;
  padding-bottom: 35px;
}

.rf-alert .icon-success {
  font-size: 52px;
  color: #56c300;
  line-height: normal;
}

.rf-alert .icon-danger {
  font-size: 52px;
  color: #ff4040;
  line-height: normal;
}

.rf-alert .rf-title {
  color: #f5851f;
  margin-top: 10px;
  margin-bottom: 15px;
  font-size: 20px;
  line-height: normal;
}

.rf-alert .rf-des {
  font-size: 18px;
  line-height: 28px;
  margin-bottom: 20px;
}

.no-margin {
  margin: unset !important;
}

.page-content .mb-content {
  margin-top: 20px;
  padding: unset;
  margin-right: unset;
  margin-left: unset;
}

.page-content .search-group {
  margin-bottom: 20px;
  display: flex;
  color: #6e6e6e;
}

.page-content .search-group .form-control {
  height: 36px;
  width: 280px;
}

.page-content .search-group span {
  line-height: 18px;
  height: 36px;
  display: flex;
  align-items: center;
  width: 56px;
  justify-content: flex-end;
  text-align: right;
  margin-right: 15px;
}

.notfound-box {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 350px;
}

.notfound-box .notfound-content {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.notfound-box .notfound-content img {
  width: 90px;
}

.notfound-box .notfound-content .notfound-text {
  margin-top: 10px;
  font-size: 16px;
}

.mbbox-topbar {
  background-color: #efefef;
  color: #6e6e6e;
  padding: 12px 8px !important;
}

.mbbox-topbar .mbbox {
  display: flex;
}

.mbbox-topbar .mbbox .mbbox-check {
  padding-left: 10px;
}

.mbbox-topbar .mbbox .mbbox-check input[type="checkbox"] {
  cursor: pointer;
}

.mbbox-topbar .mbbox .mbbox-head {
  width: 100%;
  padding: 0px 10px;
}

.mbbox-topbar .mbbox .mbbox-head .mbbox-top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
}

.mbbox-topbar .mbbox .mbbox-head .mbbox-detail {
  display: flex;
  justify-content: space-between;
}

.mbbox-topbar .mbbox .mbbox-head .mbbox-detail .mb-detail {
  display: flex;
}

.mbbox-topbar
  .mbbox
  .mbbox-head
  .mbbox-detail
  .mb-detail
  .detail-item:not(:last-child) {
  margin-right: 10px;
}

.mbbox-topbar .mbbox .mbbox-head .mbbox-detail .mb-detail .detail-item a {
  text-decoration: unset;
  color: #f5851f;
}

.mbbox-topbar .mbbox .mbbox-head .mbbox-detail .mb-status {
  color: #f5851f;
}

.mbbox-body {
  padding: 20px !important;
  color: #606266;
  border-bottom: 1px solid #ebeef5;
}

.mbbox-body .mbbox-doc {
  margin-bottom: 15px;
}

.mbbox-body .mbbox-list {
  display: flex;
}

.mbbox-body .mbbox-list > img {
  width: 60px;
  height: 60px;
  margin-right: 20px;
}

.mbbox-body .mbbox-list .tid-list .tid-item {
  margin-bottom: 15px;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-lab > img {
  margin-right: 14px;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-lab {
  margin-bottom: 10px;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-button {
  padding-left: 30px;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-button .mb-btn {
  height: 30px;
  padding: 0px 10px;
  border-radius: 4px;
  border: 1px solid #999;
  color: #999;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: unset;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-button .mb-btn:hover {
  background-color: #f5851f;
  color: #fff;
  border-color: #f5851f;
}

.mbbox-body .mbbox-list .tid-list .tid-item .tid-button .mb-btn > i {
  font-size: 17px;
  line-height: 20px;
  margin-left: 5px;
}

.mbbox-bottom {
  padding: 10px 20px !important;
  color: #333;
  text-align: right;
}

.mbbox-bottom .mb-param {
  margin-bottom: 8px;
}

.mbbox-bottom .mb-param span {
  margin-left: 15px;
}

.mbbox-bottom .mb-total .dropdown {
  display: inline;
}

.mbbox-bottom .mb-total .dropdown .dropdown-menu {
  padding: 10px 15px;
  width: 300px;
  right: 0px;
  left: auto;
  color: #606266;
  border: unset;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  margin-top: 8px;
  z-index: 99;
}

.mb-table tr:last-of-type .mbbox-bottom .mb-total .dropdown .dropdown-menu {
  margin: unset;
  top: -225px;
}

.mb-table
  tr:last-of-type
  .mbbox-bottom
  .mb-total.dis1
  .dropdown
  .dropdown-menu {
  top: -245px;
}

.mb-table
  tr:last-of-type
  .mbbox-bottom
  .mb-total.dis2
  .dropdown
  .dropdown-menu {
  top: -265px;
}

.mbbox-bottom .mb-total .dropdown .dropdown-menu > li {
  display: flex;
  justify-content: space-between;
}

.mbbox-bottom .mb-total .dropdown .dropdown-menu > li:not(:last-child) {
  margin-bottom: 15px;
}

.mbbox-bottom .mb-total .mb-moredetail {
  margin-left: 5px;
  color: #f5851f;
  cursor: pointer;
  display: inline;
}

.mb-table > tbody > tr > td,
.mb-table > tbody > tr > th,
.mb-table > tfoot > tr > td,
.mb-table > tfoot > tr > th,
.mb-table > thead > tr > td,
.mb-table > thead > tr > th {
  border-top: unset;
}

.mb-footer {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 52px;
  background-color: #efefef;
  padding-left: 10px;
  z-index: 99;
  margin-top: 5px;
  color: #606266;
}

.mb-footer .mb-ckbox {
  display: flex;
  align-items: center;
}

.mb-footer .mb-ckbox label {
  font-weight: normal;
  margin: unset;
  padding-left: 10px;
  cursor: pointer;
}

.mb-footer .mb-ckbox input[type="checkbox"],
.mb-footer .mb-ckbox input[type="radio"] {
  margin: unset;
  cursor: pointer;
}

.mb-footer .mb-gtotal span {
  margin-right: 20px;
  color: #6e6e6e;
}

.mb-footer .mb-gtotal .bt-gtotal {
  background-color: #f38420;
  color: #fff;
  height: 52px;
  width: 140px;
  cursor: pointer;
  border-radius: unset;
  border: unset;
}

.mb-footer .mb-gtotal .bt-gtotal:hover {
  background-color: #d9751b;
}

.mb-footer .mb-gtotal .bt-gtotal:active {
  background-color: #c76a16;
}

.channelType {
  margin: 0 0 10px;
  width: 100%;
  min-height: 39px;
  border: 1px solid #f2f2f2;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.85);
  background: #fff;
  padding: 0 10px;
  box-sizing: border-box;
}

.channelType .platform {
  width: 100%;
  display: flex;
}

.channelType .platform .name {
  color: #999;
  width: 70px;
  line-height: 39px;
  text-align: center;
  font-size: 12px;
}

.channelType .platform .itemDiv {
  cursor: pointer;
  width: 64px;
  line-height: 39px;
  text-align: center;
  font-size: 12px;
  color: #333;
}

.channelType .platform .itemDiv.loading {
  opacity: 0.6;
  pointer-events: none;
}

.channelType .platform .itemDiv.active,
.channelType .platform .itemDiv:hover {
  color: #f5851f;
}

.sortList {
  width: 100%;
  height: 40px;
  background: #f8f8f8;
  border: 1px solid #f2f2f2;
  font-size: 12px;
  color: #333;
  display: flex;
  margin-bottom: 10px;
  box-sizing: border-box;
  user-select: none;
}

.sortList a {
  color: #333;
  text-decoration: unset;
}

.sortList .active {
  background: #fff;
  color: #f5851f;
}

.sortList .sortType {
  width: 80px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
}

.product-content {
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
}

.product-content .listLi:nth-child(4n + 1) {
  margin-left: 0;
}

.product-content .listLi {
  height: 336px;
  width: 255px;
  margin-left: 20px;
  margin-bottom: 20px;
  border: 1px solid #f2f2f2;
  overflow: hidden;
  box-sizing: border-box;
  background-color: #fff;
}

.product-content .listLi:hover {
  opacity: 0.7;
}

.product-content .listLi a {
  text-decoration: unset;
  color: #333;
}

.product-content .listLi img {
  width: 253px;
  height: 253px;
}

.product-content .listLi .pannel {
  font-size: 14px;
  color: #333;
  text-align: center;
  padding: 10px;
  box-sizing: border-box;
  overflow: hidden;
}

.product-content .listLi .pannel .productName {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-align: left;
  line-height: 20px;
  height: 40px;
}

.product-content .listLi .pannel .bottomValue {
  font-size: 14px;
  color: #f5851f;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  line-height: normal;
}

.product-content .listLi .pannel .bottomValue .priceGrp {
  display: flex;
}

.product-content .listLi .pannel .bottomValue .priceGrp .linePrice {
  padding-left: 5px;
  color: #999;
  text-decoration: line-through;
}

.product-content .listLi .pannel .bottomValue .platform {
  font-size: 12px;
  color: #999;
}

.pageGoods {
  padding: 15px 0px;
}

.container .page-group {
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
}

.page-group .title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  padding: 10px;
  position: relative;
  display: inline-block;
  line-height: normal;
}

.page-group .title:after,
.page-group .title:before {
  content: "";
  border-bottom: 8px solid transparent;
  border-top: 8px solid transparent;
  position: absolute;
  width: 0;
  top: 54%;
  transform: translateY(-50%);
}

.page-group .title:before {
  border-right: 8px solid #f5851f;
  right: -6px;
}

.page-group .title:after {
  border-left: 8px solid #f5851f;
  left: -6px;
}

/* vcanbuy new style */
.loadingScreen {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}

.loadingScreen .loading-wrap {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.loadingScreen .loading-wrap .loading-content {
  text-align: center;
}

.loadingScreen .loading-wrap .loading-content img {
  width: 40px;
  height: 40px;
  margin-bottom: 7px;
}

.loadingScreen .loading-wrap .loading-content .text {
  font-family: "Noto Sans Thai", sans-serif;
  color: #fff;
  font-size: 18px;
}

.vcbnew-arti {
  font-family: "Noto Sans Thai", sans-serif;
  font-optical-sizing: auto;
  /* font-weight: <weight>; */
  font-style: normal;
  font-variation-settings: "wdth" 100;
  color: #000;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
  outline: unset;
}

.top-container {
  padding-left: 15px;
}

.vcb-menuleft {
  position: fixed;
  width: 98px;
  height: 420px;
  top: 180px;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 15px;
  z-index: 100;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(2px);
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 20px 0px 10px 0px;
  gap: 10px;
}

.vcb-menuright {
  position: fixed;
  top: 187px;
  right: 0px;
  width: 115px;
  height: 470px;
  background-color: #fff;
  border-radius: 20px;
  box-shadow: -3px 6px 4px rgba(0, 0, 0, 0.25);
  z-index: 101;
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: flex-start;
  padding: 10px 0px;
  gap: 10px;
}

.vcb-menuleft.promo {
  top: 255px;
}

.vcb-menuright.promo {
  top: 267px;
}

@media screen and (max-height: 820px) {
  .vcb-menuright,
  .vcb-menuleft,
  .vcb-menuquestion {
    scale: 0.7;
  }

  .vcb-addline {
    scale: 0.9;
  }

  .vcb-menuleft {
    top: 130px !important;
  }
  .vcb-menuright {
    top: 110px !important;
  }
  .vcb-menuquestion {
    top: 520px !important;
  }
  .vcb-addline {
    top: 500px !important;
  }

  .vcb-menuleft.promo {
    top: 210px !important;
  }
  .vcb-menuright.promo {
    top: 190px !important;
  }
  .vcb-menuquestion.promo {
    top: 600px !important;
  }
  .vcb-addline.promo {
    top: 590px !important;
  }
}

.vcb-menuquestion {
  position: fixed;
  box-sizing: border-box;
  height: 85px;
  width: 85px;
  right: 14px;
  top: 689px;
  background: #efefef;
  border: 0.3805px solid rgba(245, 239, 235, 0.4);
  box-shadow: 2px 6px 4px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(60.88px);
  border-radius: 100px;
  z-index: 102;
}

.vcb-menuquestion.promo {
  top: 760px;
}

.vcb-menuquestion .img-q {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.vcb-menuquestion .img-q img {
  width: 70px;
  height: 70px;
  margin-left: 5px;
}

.vcb-menuquestion .balloon {
  position: relative;
  display: none;
}

.vcb-menuquestion .balloon img {
  position: absolute;
  width: 258px;
  height: 60px;
  left: -208px;
  top: -122px;
}

.vcb-menuquestion:hover .balloon {
  display: block;
}

.mn-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  gap: 16px;
  width: 98px;
  height: 100%;
}

.mn-content .mn-item {
  width: 90px;
  height: 95px;
  text-align: center;
  position: relative;
  text-decoration: unset;
}

.mn-content .mn-item .mn-dash {
  position: absolute;
  bottom: -10px;
  left: 5px;
}

.mn-content .mn-item .mn-dash img {
  width: 80px;
}

.mn-content .mn-item .mn-title {
  font-family: "Noto Sans Thai";
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 14px;
  color: #000;
}

.mn-content .mn-item .mn-logo {
  width: 50px;
  height: 50px;
  margin-bottom: 12px;
}

.vcb-menuleft .mn-content .mn-item .mn-logo {
  width: 100%;
  height: 50px;
  margin-bottom: 12px;
  position: relative;
}

.vcb-menuleft .mn-content .mn-item .mn-logo img {
  width: 50px;
  height: 50px;
}

.vcb-menuleft .mn-content .mn-item .mn-logo:hover img {
  position: absolute;
  width: 70px;
  height: 70px;
  left: 10px;
  top: -13px;
}

.vcb-menuright .mn-content {
  width: 95px;
}

.vcb-menuright .mn-content .mn-item .mn-title {
  font-weight: normal;
  font-size: 15px;
}

.vcb-menuright .mn-content .mn-item .mn-logo {
  height: auto;
  width: 35px;
  margin-bottom: 10px;
}

.vcb-menuright .mn-content .mn-item {
  width: 100%;
  padding: 10px 0px;
  height: 80px;
}

.vcb-menuright .mn-content .mn-item:hover {
  opacity: 1;
  background-color: #e7e7e7;
  border-radius: 13px;
}

.vcb-menuright .mn-content .mn-item .mn-dash {
  bottom: -15px;
}

.vcb-menuright .mn-content .mn-item .mn-noti {
  position: absolute;
  color: #fff;
  background: #ff8f00;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 5px;
  min-width: 20px;
  height: 20px;
  font-size: 13px;
  font-weight: 500;
  line-height: 13px;
  border-radius: 50px;
  right: 0px;
  top: 0px;
}

.topbar-content {
  position: fixed;
  top: 0px;
  z-index: 100;
  background: #fff;
  width: 100%;
  padding: unset;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  /* box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); */
}

.topbar-content .vcb-logo {
  padding: 35px 0px 25px 0px;
}

.topbar-content .vcb-logo img {
  height: 42px;
}

.lang-content {
  margin-bottom: -20px;
  margin-top: 7px;
  z-index: 1;
}

.lang-content .lang-lab {
  margin: 7px;
  margin-right: 15px;
}

.lang-content .lang-icon {
  margin: 5px 8px;
}

.lang-content .lang-icon:first-child {
  margin-right: unset;
}

.lang-content .lang-icon img {
  width: 26px;
  height: 26px;
  border-radius: 50%;
}

.btn-link {
  font-weight: 400;
  color: #000;
  border-radius: 0;
}

.user-button .btn-primary {
  color: #fff;
  background-color: #ff9900;
  border-color: #ff9900;
}

.user-button .btn-primary:hover,
.user-button .btn-primary:active,
.user-button .btn-primary:focus {
  color: #fff;
  background-color: #333;
  border-color: #333;
}

.top-content {
  padding-left: 70px;
  z-index: 1;
}

.top-content > .btn-link {
  text-decoration: unset;
  color: #000;
  font-weight: 600;
}

.top-content > .btn-link:hover,
.top-content > .btn-link:active,
.top-content > .btn-link:focus {
  color: #ff9900;
}

.top-search-box .search-text {
  border-right: none;
  border-color: #636363;
  border-radius: 30px 0 0 30px;
  padding: 0px 0px 0px 20px;
  height: 42px;
}

.top-search-box .search-text:focus {
  border-color: #ff9900;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
    0 0 8px rgba(255, 153, 0, 0.6);
}

.top-search-box .search-btn {
  height: 42px;
  padding: unset;
  line-height: normal;
  border-radius: 0px 30px 30px 0px;
  font-size: 17px;
  padding-right: 5px;
  padding-top: 3px;
  background-color: #ff9900;
  border-color: #ff9900;
  color: #fff;
}

.user-action {
  padding-top: 40px;
}

.user-action .action-list {
  display: flex;
  align-items: center;
}

.user-action .action-list .action-item {
  position: relative;
  margin-right: 17px;
}

.user-action .action-list .action-item:last-child {
  margin-right: unset;
}

.user-action .action-list .action-item img {
  height: 14.14px;
}

.user-action .action-list .action-item .user-group {
  display: flex;
  align-items: center;
}

.user-action .action-list .action-item .user-group a {
  text-decoration: unset;
  color: #000;
}

.user-action .action-list .action-item .user-group .user-icon {
  background-color: #ff9900;
  width: 28.28px;
  height: 28.28px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
}

.user-action .action-list .action-item .user-group .user-code {
  line-height: normal;
  margin-right: 5px;
}

.user-action .action-list .action-item .user-group .user-menu .drop-bt {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50px;
  background-color: #fff;
  border: unset;
}

.user-action .action-list .action-item .user-group .user-menu.open .drop-bt {
  background-color: #e6e6e6;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu.open
  .drop-bt
  img {
  transform: rotate(180deg);
}

.user-action .action-list .action-item .user-group .user-menu .drop-bt img {
  width: 11px;
  height: 6px;
}

.user-action .action-list .action-item .user-group .user-menu .dropdown-menu {
  width: 256px;
  height: 508px;
  top: 65px;
  left: -85px;
  padding: 30px 20px 20px 20px;
  background: #ffffff;
  border: 0.5px solid rgba(245, 239, 235, 0.4);
  box-shadow: 0px 64px 64px -32px rgba(102, 37, 0, 0.56);
  border-radius: 28px;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu
  .dropdown-menu
  li
  > a {
  display: flex;
  align-items: center;
  padding: 16px 20px;
  background-color: #fff;
  border-radius: 15px;
  color: #848484;
  font-size: 16px;
  line-height: normal;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu
  .dropdown-menu
  .icon {
  width: 37px;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu
  .dropdown-menu
  .icon
  img {
  height: 19px;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu
  .dropdown-menu
  li
  > a:hover {
  background-color: #e8e8e8;
  color: #000;
}

.user-action
  .action-list
  .action-item
  .user-group
  .user-menu
  .dropdown-menu
  .logout {
  position: absolute;
  width: 214px;
  left: 20px;
  bottom: 20px;
}

.action-item .att-1 .tt-1,
.action-item .att-2 .tt-2,
.action-item .att-3 .tt-3,
.action-item .att-4 .tt-4 {
  display: none;
  position: absolute;
  height: 38px !important;
}

.action-item .att-1 .tt-1,
.action-item .att-2 .tt-2 {
  left: -5px;
}

.action-item .att-3 .tt-3,
.action-item .att-4 .tt-4 {
  right: -5px;
}

.action-item .att-1:hover .tt-1,
.action-item .att-2:hover .tt-2,
.action-item .att-3:hover .tt-3,
.action-item .att-4:hover .tt-4 {
  display: block;
}

.vcbcargo-dropdown {
  position: relative;
}

.vcbcargo-dropdown.open .vcb-cargo img {
  transform: rotate(180deg);
}

.vcbcargo-dropdown .dropdown-menu {
  top: 28px;
  left: -60px;
  padding: 18px 15px;
  background: #ffffff;
  border-color: #fff;
  box-shadow: 0px 64px 64px -32px rgba(102, 37, 0, 0.56);
  border-radius: 0px 0px 28px 28px;
}

.vcbcargo-dropdown .dropdown-menu li > a {
  display: flex;
  align-items: center;
  padding: 16px 20px;
  background-color: #fff;
  border-radius: 15px;
  color: #606060;
  font-weight: 500;
  line-height: normal;
}

.vcbcargo-dropdown .dropdown-menu li > a:hover {
  background-color: #e8e8e8;
  color: #000;
}

.user-button-right {
  padding-right: unset;
  text-align: right;
}

.user-button {
  padding-top: 40px;
}

.user-button .btn-user {
  border-radius: 30px;
  min-width: 110px;
  font-size: 15px;
  padding: 4px 12px;
}

.user-button .btn-user img {
  height: 17px;
  margin-bottom: 2px;
}

.index-menu {
  color: #333;
  margin-bottom: 2px;
  padding: unset;
}

.index-menu > .btn-link {
  color: #333;
  font-weight: 500;
  text-decoration: unset;
  font-size: 16px;
  padding-left: unset;
}

.index-menu .btn-link.active {
  color: #ff9900;
}

.index-menu > .btn-link:hover {
  color: #ff9900;
}

.index-menu .vcb-cargo {
  color: #000;
  font-weight: 700;
  background-color: #ff9900;
  border-color: #ff9900;
  border-radius: unset;
  line-height: normal;
  font-size: 16px;
  padding: 2px 8px;
}

.index-menu .vcb-cargo img {
  width: 13.31px;
}

.btn-default {
  color: #ff9900;
  background-color: #fff;
  border-color: #ff9900;
}

.button-line:hover {
  content: url("/img/line/btn_login_hover.png");
}

.button-line:active {
  content: url("/img/line/btn_login_press.png");
}

.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
  border: none;
}

.no-padding {
  padding: unset !important;
}

.banner-new {
  padding: unset;
  position: relative;
  display: flex;
  justify-content: center;
  padding-bottom: 45px;
  background-color: #fafafa;
}

.banner-new .item img {
  width: 100%;
}

.banner-new .carousel-inner .banner-wrap {
  height: 540px;
}

.banner-new .carousel-inner .banner-wrap img {
  width: 100%;
  height: 540px;
  object-fit: cover;
}

.banner-new .carousel-indicators {
  bottom: -52px;
}

.banner-new .carousel-indicators li {
  background-color: #646464;
  border: unset;
  width: 13px;
  height: 13px;
  margin: 1px 2px;
}

.banner-new .carousel-indicators .active {
  background-color: #ff9900;
  margin: 1px 2px;
}

.vm-banner .carousel-indicators {
  bottom: -50px;
}

.vm-banner .carousel-indicators li {
  background-color: #646464;
  border: unset;
  width: 13px;
  height: 13px;
  margin: 1px 2px;
}

.vm-banner .carousel-indicators .active {
  background-color: #ff9900;
  margin: 1px 2px;
}

.advert-content {
  background-color: #fafafa;
  padding: unset;
  padding-bottom: 40px;
}

.advert-content .advert-top {
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
}

.advert-content .advert-top .addvert-box:hover {
  opacity: 0.7;
}

.advert-content .advert-top .addvert-box img {
  width: 100%;
}

.service-content {
  background-color: #fafafa;
  padding: 60px 0px 40px 0px;
}

.section {
  text-align: center;
  font-size: 48px;
  font-weight: 700;
}

.section .concise {
  font-size: 24px;
  font-weight: 500;
  margin-top: 15px;
}

.service-content .service-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 10px;
}

.service-list .service-item {
  margin-right: 20px;
}

.service-list .service-item:last-child {
  margin-right: unset;
}

.service-list .service-item .service-card {
  background-color: #646464;
  background-size: cover;
  background-position: center;
  position: relative;
  width: 260px;
  height: 340px;
  border-radius: 20px;
}

.service-list .service-item .service-card .sv-bottom {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 12px;
  padding-top: 100px;
  color: #fff;
  background: linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.8) 15%,
    rgba(0, 0, 0, 0) 85%
  );
  border-radius: 0px 0px 20px 20px;
}

.service-list .service-item .service-card .sv-bottom .sv-subject {
  font-size: 19px;
  font-weight: 600;
}

.service-list .service-item .service-card .sv-bottom .sv-des {
  font-weight: 300;
  font-size: 15px;
}

.service-list .service-item .service-link {
  text-align: center;
  margin-top: 20px;
}

.service-list .service-item .service-link .sv-bt {
  background-image: linear-gradient(180deg, #ffc700 0%, #f90 100%);
  border: none;
  font-size: 24px;
  font-weight: 600;
  border-radius: 25px;
  padding: 10px 15px;
  width: 80%;
  color: #000;
}

.vcbshort-content {
  background: #f3f3f3;
  color: #000;
  padding: 70px 0px;
  overflow: hidden;
}

.vcbshort-content .main-img {
  width: 100%;
}

.vcbshort-content .vcbdes {
  padding-left: 55px;
  padding-top: 55px;
}

.vcbshort-content .vcbdes .vcb-name {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 56px;
  line-height: normal;
  color: #ff9900;
}

.vcbshort-content .vcbdes .vcb-tail {
  font-weight: 600;
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0.02em;
  color: #282828;
  padding-left: 8px;
}

.vcbshort-content .vcbdes .vcb-des {
  font-weight: 400;
  font-size: 20px;
  line-height: normal;
  color: #484848;
  padding-left: 8px;
  margin-top: 18px;
  margin-bottom: 38px;
}

.vcbshort-content .vcbdes .comp-group {
  display: flex;
  justify-content: space-between;
  padding-left: 8px;
  width: 430px;
}

.vcbshort-content .vcbdes .comp-group .comp-item {
  position: relative;
  text-align: center;
}

.vcbshort-content .vcbdes .comp-group .comp-item .comp-img {
  display: block;
  width: 104px;
  height: 104px;
}

.vcbshort-content .vcbdes .comp-group .comp-item .comp-img img {
  width: 100%;
  height: 100%;
}

.vcbshort-content .vcbdes .comp-group .comp-item .comp-img:hover img {
  position: absolute;
  width: 125px;
  height: 125px;
  left: -10px;
  top: -18px;
}

.vcbshort-content .vcbdes .comp-group .comp-item .comp-name {
  font-size: 20px;
  margin-top: 13px;
}

.cargoshort-content {
  background: #e7e7e7;
  color: #000;
  padding: 90px 0px;
  overflow: hidden;
}

.cargoshort-content .main-img {
  width: 100%;
  padding-top: 45px;
}

.cargoshort-content .vcbdes {
  padding-right: 30px;
  text-align: right;
}

.cargoshort-content .vcbdes .vcb-name {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 56px;
  line-height: normal;
  color: #ff9900;
}

.cargoshort-content .vcbdes .vcb-tail {
  font-weight: 600;
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0.02em;
  color: #282828;
  padding-left: 8px;
}

.cargoshort-content .vcbdes .vcb-des {
  font-weight: 400;
  font-size: 20px;
  line-height: normal;
  color: #484848;
  padding-left: 8px;
  margin-top: 18px;
  margin-bottom: 38px;
}

.cargoshort-content .vcbdes .vcb-svbox {
  display: flex;
  justify-content: right;
}

.cargoshort-content .vcbdes .vcb-svbox a {
  text-decoration: unset;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item {
  width: 242px;
  height: 165px;
  background: linear-gradient(180deg, #fcfcfc 0%, #e6e6e6 100%);
  box-shadow: inset 0px 0px 1.4px 3px rgba(0, 0, 0, 0.09);
  border-radius: 14px;
  margin-left: 10px;
  text-align: center;
  padding: 15px 0px;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item .sv-text {
  font-weight: 600;
  font-size: 20px;
  line-height: 25px;
  height: 90px;
  color: #484848;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item .sv-under {
  display: flex;
  justify-content: center;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item .sv-under .sv-click {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 17px;
  width: 159px;
  height: 43px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 28px;
  border: unset;
  font-weight: 600;
  font-size: 20px;
  color: #000;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item:hover {
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item:hover .sv-text {
  font-size: 22px;
  font-weight: 700;
  line-height: 28px;
}

.cargoshort-content .vcbdes .vcb-svbox .sv-item:hover .sv-under .sv-click {
  background: linear-gradient(180deg, #fcfcfc 0%, #e6e6e6 100%);
}

.contact-short {
  background: #f90;
  color: #000;
  padding: 40px 0px;
}

.contact-short a {
  text-decoration: unset;
}

.contact-short .section {
  line-height: 50px;
}

.contact-short .contact-des {
  text-align: center;
  margin-bottom: 25px;
  margin-top: 10px;
}

.contact-short .contact-des .des-item {
  position: relative;
  display: inline-block;
  margin-right: 20px;
}

.contact-short .contact-des .des-item:last-child {
  margin-right: unset;
}

.contact-short .contact-des .des-item span {
  font-size: 20px;
  font-weight: 600;
  padding-left: 31px;
}

.contact-short .contact-des .des-item span:before {
  content: "•";
  font-size: 75px;
  line-height: 35px;
  position: absolute;
  left: 0px;
}

.contact-short .scanMe-box {
  background: #000;
  padding: 5px;
  border-radius: 5px;
  width: fit-content;
  float: right;
  padding-bottom: unset;
}

.contact-short .scanMe-box .scanMe-text {
  color: #fff;
  font-size: 24px;
  margin: 0;
  font-weight: 600;
}

.contact-short .contact-bottom {
  padding-top: 30px;
}

.contact-short .contact-bottom .contact-bt {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  border-radius: 13px;
}

.contact-short .contact-bottom .bt-line {
  display: block;
}

.contact-short .contact-bottom .bt-tel {
  background: red;
  color: #fff;
  font-size: 20px;
  padding: 18px 0;
  margin-top: 15px;
  display: block;
}

.shipping-timing {
  background-color: #f2f2f2;
  color: #000;
  padding: 80px 0px 35px 0px;
}

.shipping-timing .sp-content {
  margin-top: 30px;
}

.shipping-timing .sp-content img {
  width: 100%;
}

.shipping-rate {
  background-color: #fafafa;
  color: #000;
  padding: 55px 0px 45px 0px;
}

.shipping-rate .section {
  margin-bottom: 20px;
}

.sr-content .sr-subject {
  display: flex;
}

.sr-content .sr-subject .subject-item {
  width: 50%;
  text-align: center;
  line-height: normal;
}

.sr-content .sr-subject .subject-item .name {
  font-weight: 700;
  font-size: 36px;
  line-height: 45px;
  color: #f6861f;
}

.sr-content .sr-subject .subject-item .des {
  font-weight: 500;
  font-size: 20px;
}

.sr-content .sr-subject .subject-item .name-fs {
  font-size: 20px;
  font-weight: 500;
}

.sr-content .sr-subject .subject-item .name-fs > span {
  font-size: 27px;
  font-weight: 600;
  color: #ff9900;
}

.sr-content .sr-subject .subject-item .des-fs {
  color: #787878;
  font-size: 16px;
}

.sr-content .sr-subject .subject-item .des-fs.hl {
  color: #ff9900;
}

.sr-content .sr-subject.bottom {
  margin-top: -10px;
}

.sr-content img {
  width: 100%;
}

.shipping-rate .sr-bottom {
  display: flex;
  justify-content: center;
}

.sr-content .sr-txt-bottom {
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 500;
  text-align: center;
}

.shipping-rate .sr-bottom .sr-bt {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 40px;
  width: 428px;
  height: 89px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  border: unset;
  font-weight: 700;
  font-size: 36px;
  color: #000;
  text-decoration: unset;
}

.shipping-rate .bullet-content {
  margin: 30px 0px;
}

.shipping-rate .bullet-content ul {
  padding-left: 50px;
  font-size: 17px;
  font-weight: 500;
  color: #000;
  margin: unset;
}

.shipping-rate .bullet-content ul > li:not(:last-child) {
  margin-bottom: 5px;
}

.product-exam {
  background-color: #fafafa;
  color: #000;
  padding: 55px 0;
}

.product-exam h3 {
  font-weight: 700;
}

.product-exam .section {
  margin-bottom: 25px;
}

.product-exam .exam-card {
  background: #d9d9d9;
  border-radius: 25px;
}

.product-exam .exam-card img {
  height: 150px;
}

.product-exam .pde-bottom {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.product-exam .pde-bottom .pde-bt {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 40px;
  width: 428px;
  height: 89px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  border: unset;
  font-weight: 700;
  font-size: 36px;
  color: #000;
  text-decoration: unset;
}

.shipping-cal {
  background: #fff;
  color: #000;
  padding: 50px 0px 70px 0px;
}

.shipping-cal .section {
  margin-bottom: 45px;
}

.shipping-cal .howto-content {
  text-align: center;
}

.shipping-cal .howto-content .title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 5px;
}

.shipping-cal .howto-content .subject-list {
  padding-left: 130px;
}

.shipping-cal .howto-content .subject-list .howto-item {
  font-size: 20px;
  font-weight: 500;
  text-align: left;
  margin-bottom: 5px;
}

.shipping-cal .howto-content .subject-list .howto-item span {
  display: inline-block;
  width: 26.5px;
  height: 26.5px;
  border-radius: 50px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border: unset;
  margin-right: 8px;
  font-weight: 600;
  padding-left: 7px;
  font-size: 19px;
}

.shipping-cal .howto-img {
  text-align: center;
  padding-right: 30px;
  margin: 35px 0px;
}

.shipping-cal .howto-img img {
  width: 345.59px;
}

.shipping-cal .howto-bottom {
  text-align: center;
}

.shipping-cal .howto-bottom .box-des {
  font-size: 20px;
  margin-bottom: 10px;
}

.shipping-cal .howto-bottom .box-des-box {
  font-size: 24px;
  font-weight: 600;
  padding: 10px;
  width: 507px;
  height: 88px;
  background: #969696;
  border-radius: 20px;
  color: #fff;
}

.shipping-cal .cal-content {
  border-radius: 30px;
  background: #969696;
  padding: 30px 35px 15px 35px;
  min-height: 613px;
}

.shipping-cal .cal-content .form-control {
  height: 35px;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: inset 1.46045px 2.92091px 2.92091px -0.730227px rgba(0, 0, 0, 0.25),
    inset 0px -0.730227px 0.730227px rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(71.5622px);
  border-radius: 10px;
  border: unset;
  font-weight: 300;
  color: #fff;
}

.shipping-cal .cal-content .form-control::placeholder {
  color: #fff;
  opacity: 0.6;
}

.shipping-cal .cal-content .cal-group {
  margin-bottom: 15px;
}

.shipping-cal .cal-content .cal-lab {
  text-align: center;
  font-weight: 300;
  font-size: 24px;
  color: #fff;
  margin-bottom: 15px;
}

.shipping-cal .cal-content .cal-ship {
  display: flex;
  margin-bottom: 30px;
}

.shipping-cal .cal-content .cal-ship .ship-item {
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.shipping-cal .cal-content .cal-ship .ship-item .ship-radio {
  margin-right: 12px;
}

.shipping-cal
  .cal-content
  .cal-ship
  .ship-item
  .ship-radio
  input[type="radio"] {
  width: 25px;
  height: 25px;
  cursor: pointer;
}

.shipping-cal .cal-content .cal-ship .ship-item .ship-img {
  position: relative;
  width: 55px;
}

.shipping-cal .cal-content .cal-ship .ship-item .ship-img span {
  position: absolute;
  left: -1px;
  bottom: -26px;
  color: #fff;
  font-size: 18px;
  font-weight: 300;
}

.shipping-cal .cal-content .cal-ship .ship-item .ship-img img {
  width: 48px;
}

.shipping-cal .cal-content .cal-50,
.shipping-cal .cal-content .cal-25 {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.shipping-cal .cal-content .cal-50 .cal-item {
  width: 48.5%;
}

.shipping-cal .cal-content .cal-25 .cal-item {
  width: 23%;
}

.shipping-cal .cal-content .cal-result {
  padding-top: 15px;
}

.shipping-cal .cal-content .cal-result .cal-button {
  display: flex;
  justify-content: center;
}

.shipping-cal .cal-content .cal-result .cal-button .checknow {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 50px;
  width: 182px;
  height: 76px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  border: unset;
  color: #000;
  font-weight: 700;
  font-size: 24px;
}

.shipping-cal .cal-content .cal-total .total-item {
  margin-top: 20px;
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
}

.shipping-cal .cal-content .cal-total .total-item span {
  font-weight: 300;
}

.shipping-cal .cal-content .cal-total .total-item .gold {
  font-weight: 600;
  color: #ffb300;
}

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-fade .carousel-inner > .item.next,
  .carousel-fade .carousel-inner > .item.active.right {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  .carousel-fade .carousel-inner > .item.prev,
  .carousel-fade .carousel-inner > .item.active.left {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  .carousel-fade .carousel-inner > .item.next.left,
  .carousel-fade .carousel-inner > .item.prev.right,
  .carousel-fade .carousel-inner > .item.active {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.whyvcb-content {
  background-color: #d9d9d9;
  color: #000;
  padding: 70px 0px 55px 0px;
  overflow: hidden;
}

.whyvcb-content .section {
  font-size: 50px;
  margin-bottom: 60px;
}

.whyvcb-content .wv-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-left: 90px;
}

.whyvcb-content .wv-list .wv-item {
  width: 31.5%;
  display: flex;
  align-items: center;
  margin-bottom: 32px;
}

.whyvcb-content .wv-list .wv-item img {
  width: 74px;
}

.whyvcb-content .wv-list .wv-item .wv-des {
  font-size: 16px;
  font-weight: 500;
  padding-left: 32px;
}

.flashsale-content {
  background-color: #f5f5f5;
  color: #000;
  padding: 0px 0px 25px 0px;
  position: relative;
  border-top: 3px solid #e21d1d;
  border-bottom: 3px solid #e21d1d;
}

.flashsale-content .con-nav {
  margin-bottom: 40px;
}

.con-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.con-nav a {
  color: #000;
  font-size: 24px;
  font-weight: 700;
  text-decoration: unset;
}

.flashsale-content .con-nav a {
  color: #e21d1d;
}

.con-nav .con-title {
  display: flex;
  align-items: center;
}

.con-nav .con-title .con-name {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 34px;
  color: #13101e;
}

.con-nav .con-title .con-name img {
  width: 40px;
}

.con-nav.cat {
  margin-bottom: 20px;
}

.con-nav.cat a {
  font-weight: 500;
}

.flashsale-content .con-nav .con-title .con-name {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 36px;
  line-height: 38px;
  color: #fff;
  display: flex;
  align-items: center;
  background-color: #e21d1d;
  padding: 15px 35px;
  border-radius: 0px 0px 20px 20px;
}

.flashsale-content .con-nav .con-title .con-name img {
  height: 53px;
  width: 29px;
  margin-left: 12px;
}

.flashsale-content .con-nav .con-title .con-name.con-pet img {
  height: 40px;
  width: auto;
  margin-left: 15px;
}

.vcbmall-page.home .con-nav {
  margin-bottom: 40px;
}

.vcbmall-page.home .con-nav a {
  color: #ff8f00;
}

.vcbmall-page.home .con-nav .con-title {
  padding-left: 39%;
}

.vcbmall-page.home .con-nav .con-name {
  font-family: "Noto Sans Thai", sans-serif;
  color: #ff8f00;
  font-size: 48px;
  line-height: 40px;
  font-weight: 600;
  display: flex;
  align-items: end;
}

.vcbmall-page.home .con-nav .con-name img {
  width: 66px;
  margin-left: 22px;
}

.goods-list {
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
}

.goods-list .goods-item {
  width: 282px;
  /* height: 430px; */
  height: 380px;
  margin-left: 30px;
  margin-bottom: 30px;
  text-decoration: unset;
  transition: all ease 0.2s;
}

.goods-list a:hover.goods-item {
  opacity: 0.8;
}

.goods-list .goods-item:nth-child(4n + 1) {
  margin-left: 0px;
}

.goods-list .goods-item .goods-img {
  width: 282px;
  height: 282px;
  border-radius: 10px;
}

.flashsale-content .goods-list .goods-item {
  margin-left: unset !important;
  width: 100%;
  background: #fff;
  height: 395px;
  padding: 10px;
  border-radius: 7px;
}

.flashsale-content .goods-list .goods-item .goods-img {
  width: 100%;
}

.flashsale-content .goods-list .goods-item a {
  text-decoration: unset;
  transition: all ease 0.2s;
}

.flashsale-content .goods-list .goods-item a:hover {
  opacity: 0.8;
}

.goods-list .goods-item .goods-textbox {
  padding-top: 7px;
}

.goods-list .goods-item .goods-textbox .name {
  font-size: 18px;
  font-weight: 700;
  color: #171520;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 3px;
}

.flashsale-page .goods-list .goods-item .goods-textbox .name {
  margin-bottom: unset;
}

.goods-list .goods-item .goods-textbox .des {
  color: #626262;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.goods-list .goods-item .goods-textbox .normal-price {
  font-size: 20px;
  font-weight: 700;
  color: #cf142b;
}

.goods-list .goods-item .goods-textbox .campaign-price {
  margin-bottom: 3px;
  white-space: nowrap;
}

.goods-list .goods-item .goods-textbox .campaign-price span:not(:last-child) {
  margin-right: 5px;
}

.goods-list .goods-item .goods-textbox .campaign-price .price {
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #cf142b;
}

.goods-list .goods-item .goods-textbox .campaign-price .dash {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 14px;
  text-decoration-line: line-through;
  color: #626262;
}

.goods-list .goods-item .goods-textbox .campaign-price .off {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #e21d1d;
}

.goods-list .goods-item .goods-textbox .button {
  margin-top: 10px;
  display: flex;
  justify-content: center;
}

.goods-list .goods-item .goods-textbox .button .goods-bt {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 15px;
  width: 156px;
  height: 36px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  border: unset;
  font-weight: 700;
  font-size: 20px;
  line-height: 60px;
  color: #000;
}

.vcbmall-content {
  background-color: #ff9900;
  color: #000;
  padding: 50px 0px 60px 0px;
}

.vcbmall-content .con-nav {
  margin-bottom: 50px;
}

.vcbmall-content .con-nav a {
  color: #fff;
}

.vcbmall-content .con-nav .con-title .con-name {
  color: #fff;
  display: flex;
  align-items: flex-end;
}

.vcbmall-content .con-nav .con-title .con-name img {
  width: 60px;
  margin-left: 15px;
}

.vcbmall-content .vcbm-grid {
  display: flex;
}

.vcbmall-content .vcbm-grid .vcbm-main {
  width: 45%;
}

.vcbmall-content .vcbm-grid .vcbm-sub {
  width: 55%;
  padding-left: 45px;
}

.vcbm-main .carousel-indicators {
  bottom: -52px;
}

.vcbm-main .carousel-indicators li {
  background-color: #646464;
  border: unset;
  width: 13px;
  height: 13px;
  margin: 1px 2px;
}

.vcbm-main .carousel-indicators .active {
  background-color: #fff;
  margin: 1px 2px;
}

.vcbm-main .product-slide {
  position: relative;
}

.vcbm-main .product-slide img {
  border-radius: 15px;
  width: 100%;
}

.vcbm-main .product-slide .des-box {
  position: absolute;
  display: flex;
  bottom: 0px;
  width: 100%;
  height: 130px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(45, 45, 45, 0.46) 100%
  );
  border-radius: 0px 0px 15px 15px;
  padding-left: 30px;
  padding-top: 50px;
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  color: #171520;
}

.vcbm-sub .goods-list .goods-item {
  width: 185px;
  height: 280px;
  margin-left: 35px;
  margin-bottom: 25px;
}

.vcbm-sub .goods-list .goods-item:nth-child(3n + 1) {
  margin-left: 0px;
}

.vcbm-sub .goods-list .goods-item .goods-img {
  width: 185px;
  height: 185px;
}

.vcbm-sub .goods-list .goods-item .goods-textbox .des {
  color: #fff;
}

.article-content {
  background: #e6e7e8;
  color: #000;
  padding: 50px 0px 30px 0px;
}

.article-content a {
  text-decoration: unset;
}

.article-content .section {
  font-size: 56px;
  margin-bottom: 30px;
}

.article-content .article-slide {
  position: relative;
}

.article-content .article-slide .bt-more {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0px;
  bottom: 25px;
  padding: 0px 17px;
  width: 119px;
  height: 44.03px;
  background: #484848;
  border-radius: 46px;
  border: unset;
  color: #fff;
  font-size: 16px;
  z-index: 1;
}

.article-content .article-slide .owl-nav {
  text-align: center;
  margin-top: 50px;
}

.article-content .article-slide .owl-nav .owl-prev {
  margin-right: 15px;
}

.article-content .article-slide .owl-nav .owl-prev,
.article-content .article-slide .owl-nav .owl-next {
  width: 54px;
  height: 54px;
  border: 1px solid #484848;
  border-radius: 50px;
  font-size: 24px;
  color: #484848;
}

.article-content .article-slide .owl-nav .owl-prev:hover,
.article-content .article-slide .owl-nav .owl-next:hover {
  background-color: #484848;
  color: #fff;
}

.article-content .article-slide .article-box {
  box-sizing: border-box;
  background: #faf8ed;
  border: 2px solid #ffffff;
  /* box-shadow: 0px 24px 90px rgba(192, 188, 161, 0.22); */
  border-radius: 16px;
  width: 100%;
  height: 235px;
  position: relative;
}

.article-content .article-slide .article-box .arti-img {
  padding: 5px;
}

.article-content .article-slide .article-box .arti-img img {
  border-radius: 16px;
  width: 100%;
  height: 130px;
}

.article-content .article-slide .article-box .arti-detail {
  padding: 0px 10px 10px 10px;
  height: 66px;
  overflow: hidden;
}

.article-content .article-slide .article-box .arti-detail .arti-name {
  font-weight: 700;
  font-size: 14px;
  line-height: 15px;
  color: #2d3134;
}

.article-content .article-slide .article-box .arti-detail .arti-des {
  color: #5b5f62;
  font-size: 12px;
  line-height: 15px;
  margin-top: 2px;
}

.article-content .article-slide .article-box .arti-detail .arti-button {
  display: flex;
  justify-content: center;
  width: 100%;
  position: absolute;
  bottom: 10px;
  left: 0px;
}

.article-content
  .article-slide
  .article-box
  .arti-detail
  .arti-button
  .arti-bt {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 75.24px;
  height: 21.34px;
  background: #2d3134;
  border-radius: 46px;
  font-weight: 300;
  color: #fff;
}

.article-content.art {
  background: #ff9900;
}

.article-content.art .section {
  color: #fff;
}

.article-content.art .article-slide .bt-more {
  font-weight: 700;
  background: #fff;
  color: #484848;
}

.article-content.art .article-slide .owl-nav .owl-prev,
.article-content.art .article-slide .owl-nav .owl-next {
  width: 54px;
  height: 54px;
  border: 1px solid #fff;
  border-radius: 50px;
  font-size: 24px;
  line-height: 26px;
  color: #fff;
}

.article-content.art .article-slide .owl-nav .owl-prev:hover,
.article-content.art .article-slide .owl-nav .owl-next:hover {
  background-color: #fff;
  color: #484848;
}

.article-content-more {
  background: #fff;
  color: #000;
  padding: 50px 0px 70px 0px;
}

.article-content-more a {
  text-decoration: unset;
}

.article-content-more .section {
  font-size: 42px;
  margin-bottom: 30px;
}

.article-content-more .article-slide {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}

.article-content-more .article-slide .bt-more {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0px;
  bottom: 25px;
  padding: 0px 17px;
  width: 119px;
  height: 44.03px;
  background: #484848;
  border-radius: 46px;
  border: unset;
  color: #fff;
  font-size: 16px;
  z-index: 1;
}

.article-content-more .article-slide .owl-nav {
  text-align: center;
  margin-top: 50px;
}

.article-content-more .article-slide .owl-nav .owl-prev {
  margin-right: 15px;
}

.article-content-more .article-slide .owl-nav .owl-prev,
.article-content-more .article-slide .owl-nav .owl-next {
  width: 54px;
  height: 54px;
  border: 1px solid #484848;
  border-radius: 50px;
  font-size: 24px;
  color: #484848;
}

.article-content-more .article-slide .owl-nav .owl-prev:hover,
.article-content-more .article-slide .owl-nav .owl-next:hover {
  background-color: #484848;
  color: #fff;
}

.article-content-more .article-slide .article-box {
  box-sizing: border-box;
  background: #e6e6e6;
  border: 2px solid #ffffff;
  /* box-shadow: 0px 24px 90px rgba(192, 188, 161, 0.22); */
  border-radius: 16px;
  width: 208px;
  height: 235px;
  position: relative;
  margin-bottom: 15px;
  margin-left: 10px;
}

.article-content-more .article-slide .article-box:nth-child(5n + 1) {
  margin-left: 0px;
}

.article-content-more .article-slide .article-box .arti-img {
  padding: 5px;
}

.article-content-more .article-slide .article-box .arti-img img {
  border-radius: 16px;
  width: 100%;
  height: 130px;
}

.article-content-more .article-slide .article-box .arti-detail {
  padding: 0px 10px 10px 10px;
  height: 66px;
  overflow: hidden;
}

.article-content-more .article-slide .article-box .arti-detail .arti-name {
  font-weight: 700;
  font-size: 14px;
  line-height: 15px;
  color: #2d3134;
}

.article-content-more .article-slide .article-box .arti-detail .arti-des {
  font-size: 13px;
  line-height: 16px;
  color: #5b5f62;
}

.article-content-more .article-slide .article-box .arti-detail .arti-button {
  display: flex;
  justify-content: right;
  width: 100%;
  position: absolute;
  bottom: 10px;
  left: -10px;
}

.article-content-more
  .article-slide
  .article-box
  .arti-detail
  .arti-button
  .arti-bt {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 75.24px;
  height: 21.34px;
  background: #2d3134;
  border-radius: 46px;
  font-weight: 300;
  color: #fff;
}

.article-content-more.art {
  background: #ff9900;
}

.article-content-more.art .section {
  color: #fff;
}

.article-content-more.art .article-slide .bt-more {
  font-weight: 700;
  background: #fff;
  color: #484848;
}

.article-content-more.art .article-slide .owl-nav .owl-prev,
.article-content-more.art .article-slide .owl-nav .owl-next {
  width: 54px;
  height: 54px;
  border: 1px solid #fff;
  border-radius: 50px;
  font-size: 24px;
  color: #fff;
}

.article-content-more.art .article-slide .owl-nav .owl-prev:hover,
.article-content-more.art .article-slide .owl-nav .owl-next:hover {
  background-color: #fff;
  color: #484848;
}

.svcargo-content {
  background-color: #fafafa;
  padding: 15px 0px 75px 0px;
}

.svcargo-content .section {
  margin-bottom: 30px;
}

.svcargo-content .svcargo-box {
  text-align: center;
}

.svcargo-content .svcargo-box .svcargo-body {
  height: 368px;
  overflow: hidden;
}

.svcargo-body img {
  width: 100%;
}

.svcargo-content .svcargo-box .svcargo-body .svcargo-rel {
  position: relative;
}

.svcargo-content .svcargo-box .svcargo-body .svcargo-text {
  height: 220px;
  text-align: left;
  position: absolute;
  top: 0;
  padding: 15px;
  color: #fff;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.8) 27%,
    rgba(0, 0, 0, 0) 100%
  );
}

.svcargo-content .svcargo-box .svcargo-body .svcargo-text .title {
  background: -webkit-linear-gradient(#ffc700, #f90);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 20px;
  font-weight: 700;
  margin: 15px 0px 7px 0px;
}

.svcargo-content .svcargo-box .svcargo-body .svcargo-text .timeline {
  font-size: 24px;
  font-weight: 300;
}

.svcargo-content .svcargo-box .svcargo-body .svcargo-text .des {
  font-weight: 300;
}

.svcargo-content .svcargo-box .svcargo-bottom {
  margin-top: 40px;
}

.svcargo-content .svcargo-box .svcargo-bottom .title {
  font-size: 24px;
  font-weight: 500;
}

.svcargo-content .svcargo-box .svcargo-bottom .svcargo-bt {
  background-image: linear-gradient(180deg, #ffc700 0%, #f90 100%);
  border: none;
  font-weight: 600;
  font-size: 36px;
  border-radius: 69px;
  width: 195px;
  height: 67px;
  color: #000;
}

.cargorate-content {
  background: #e9e9e9;
  color: #000;
  padding: 55px 0px 45px 0px;
}

.cargorate-content .rateleft {
  padding-top: 305px;
  padding-bottom: 15px;
  padding-right: unset;
  font-size: 18px;
}

.cargorate-content .rateleft th,
.cargorate-content .rateleft td {
  height: 43.14px;
}

.cargorate-content .ratebox {
  background: #fff;
  padding-bottom: 15px;
  border-radius: 25px;
  padding-left: 0;
  padding-right: 0;
  margin-top: 135px;
  padding-top: 75px;
  border: 1px solid #dadada;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  font-size: 19px;
}

.cargorate-content .ratebox .bur {
  font-size: 15px;
  color: #858ba0;
}

.cargorate-content .car {
  position: absolute;
  left: 50px;
  z-index: 1;
}

.cargorate-content .ship {
  position: absolute;
  left: 20px;
  z-index: 1;
}

.cargorate-content .rateWarning {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #ff0000;
  margin-top: 20px;
}

.cargorate-content .title {
  font-size: 36px;
  line-height: 34px;
  font-weight: 700;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 15px;
}

.trickcargo-content {
  padding: 60px 0px;
  color: #000;
}

.trickcargo-content .section {
  margin-bottom: 35px;
}

.trickcargo-content .typetable > tbody > tr > td,
.trickcargo-content .typetable > tbody > tr > th,
.trickcargo-content .typetable > tfoot > tr > td,
.trickcargo-content .typetable > tfoot > tr > th,
.trickcargo-content .typetable > thead > tr > td,
.trickcargo-content .typetable > thead > tr > th {
  vertical-align: middle;
  border: 1px solid #b8b8b8;
}

.trickcargo-content .typetable {
  margin-bottom: 20px;
}

.trickcargo-content .typetable .type-header {
  font-weight: 700;
  font-size: 20px;
  width: 290px;
  padding-left: 25px;
}

.trickcargo-content .typetable .type-body {
  padding: 20px 25px;
  font-size: 18px;
}

.trickcargo-content .typetable .type-header img {
  width: 118.14px;
}

.trickcargo-content .typetable .type-warning {
  font-size: 16px;
  color: #ff0000;
  margin-top: 5px;
}

.trickcargo-content .typetable .type-ban {
  color: #fff;
  background-color: #f5851f;
}

.trickcargo-content .text-warning {
  font-size: 18px;
  color: #ff0000;
}

.trickcal-content {
  padding: 40px 0px;
  color: #000;
}

.trickcal-content .countBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 40px 0px;
}

.trickcal-content .countBox .countItem {
  width: 420px;
}

.trickcal-content .countBox .countItem .imgBox {
  text-align: center;
}

.trickcal-content .countBox .countItem .imgBox img {
  height: 240px;
}

.trickcal-content .countBox .countItem .countBoxTopBox {
  border-radius: 10px;
  background-color: #eee;
  text-align: center;
  overflow: hidden;
  margin: 40px 0px;
}

.trickcal-content .countBox .countItem .countBoxTopBox .countBoxTopBoxTitle {
  background-color: #f38420;
  color: #fff;
  font-weight: 600;
  font-size: 20px;
  padding: 7px 0px;
}

.trickcal-content .formulaBox {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
  padding: 8px 0px;
}

.trickcal-content .formulaBox .buChuShu {
  text-align: center;
}

.trickcal-content .formulaBox .chuShu {
  border-bottom: 1px solid #000;
  padding: 0px 3px;
}

.trickcal-content .formulaBox .dunYuBox {
  padding-left: 12px;
}

.trickcal-content .formulaBox2 {
  height: 108.11px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
}

.trickcal-content .countBox .countItem .countBoxTopBox .countBoxTopBoxBottom {
  background-color: #bebebe;
  font-weight: 600;
  font-size: 18px;
  padding: 7px 0px;
}

.trickcal-content .countBox .countItem .countBoxBottomBox {
  border: 0.0625rem solid #535352;
  border-radius: 10px;
  overflow: hidden;
  padding: 48px 20px 20px 20px;
  position: relative;
  font-size: 18px;
}

.trickcal-content .countBox .countItem .countBoxBottomBox .tt-topleft {
  border-radius: 10px;
  position: absolute;
  left: -1px;
  top: -1px;
  background-color: #484848;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  padding: 5px 15px;
}

.trickcal-content .countBox .countItem .countBoxBottomBox .countBoxBottomBoxT1 {
  padding: 0px 20px;
  line-height: 30px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFormulaBox {
  background-color: #eee;
  box-sizing: border-box;
  padding: 15px 20px;
  margin: 10px 0px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFormulaBox
  .bbb-title {
  font-weight: 600;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFormulaBox
  .formulaBox {
  font-size: 16px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFillet {
  display: flex;
  align-items: center;
  line-height: normal;
  padding: 1px 20px;
  font-weight: 500;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFillet:before {
  content: "";
  display: inline-block;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background-color: gray;
  margin-right: 5px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFillet.cbb1:before {
  background-color: #ff0000;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFillet.cbb2:before {
  background-color: #f90;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxFillet.cbb3:before {
  background-color: #17a600;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxTitle1 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 35px;
  background: #ff9900;
  color: #fff;
  font-weight: 500;
  border-radius: 10px;
  margin-top: 20px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxTitle2 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 35px;
  background: #484848;
  color: #fff;
  font-weight: 500;
  border-radius: 10px;
  margin-top: 20px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxNum1 {
  text-align: center;
  font-weight: 600;
  padding-top: 20px;
}

.trickcal-content
  .countBox
  .countItem
  .countBoxBottomBox
  .countBoxBottomBoxNum2 {
  text-align: center;
  font-weight: 600;
}

.trickcal-content .trickcal-bottom {
  text-align: center;
}

.trickcal-content .trickcal-bottom .warning {
  width: 85%;
  background: #dcdcdc;
  color: red;
  font-size: 22px;
  font-weight: 600;
  border-radius: 10px;
  padding: 10px 0px;
  margin: 0 auto;
}

.trickcal-content .trickcal-bottom .warning-right {
  width: 85%;
  margin: 0 auto;
  padding-top: 20px;
  color: red;
  text-align: right;
  font-size: 16px;
  font-weight: 600;
}

.trickwood-content {
  padding: 50px 0px 70px 0px;
}

.trickwood-content .wood-box {
  display: flex;
  align-items: center;
  width: 75%;
  margin: 20px auto;
  padding: 20px;
  background-color: #eee;
  font-size: 24px;
  font-weight: 600;
}

.trickwood-content .wood-box img {
  width: 266px;
}

.trickwood-content .wood-box .wood-content {
  padding-left: 15px;
}

.trickwood-content .wood-box .wood-content div:last-child {
  margin-top: 24px;
}

.trickwood-content .wood-foot {
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  padding-top: 25px;
}

.vcbnew-arti .btnCargo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 50px;
  height: 120px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  border-radius: 100px;
  border: unset;
  font-size: 40px;
  font-weight: 700;
  color: #000;
}

.howto-cargo {
  padding: 50px 0px 30px 0px;
  color: #000;
}

.howto-cargo .section {
  margin-bottom: 30px;
}

.howto-cargo .howtoCargo {
  width: 100%;
}

.howto-cargo .howtoCargo-mb {
  display: none;
}

.howto-cargo .warningBottom {
  margin-top: 50px;
  display: flex;
  justify-content: center;
}

.howto-cargo .warningBottom .warning {
  color: #ff0000;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 5px;
}

.howto-cargo .warningBottom .warning .wn-icon {
  width: 45px;
  margin-right: 15px;
}

.howto-cargo .howtoBottom {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.howto-cargo .btnCargo {
  width: 478px;
  margin-bottom: 20px;
}

.howto-cnpay {
  padding: 40px 0px;
  color: #000;
}

.howto-cnpay .section {
  margin-bottom: 35px;
}

.howto-cnpay .cnpayList {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.howto-cnpay .cnpayList .cnpayItem {
  position: relative;
  width: 311px;
  height: 231px;
  background: #d9d9d9;
  border-radius: 24px;
  padding: 7px 10px;
  margin-bottom: 40px;
  text-align: center;
}

.howto-cnpay .cnpayList .cnpayItem .sec {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 36.69px;
  height: 36.69px;
  left: -8px;
  top: -8px;
  background: #ff9900;
  border-radius: 100px;

  font-weight: 600;
  font-size: 24px;
  color: #fff;
}

.howto-cnpay .cnpayList .cnpayItem img {
  height: 140px;
}

.howto-cnpay .cnpayList .cnpayItem .title {
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
  margin-bottom: 3px;
}

.howto-cnpay .cnpayList .cnpayItem .des {
  font-size: 15px;
  line-height: 17px;
}

.howto-cnpay .cnpayList .cnpayItem .des b {
  font-weight: 600;
}

.howto-cnpay .cnpayBottom {
  text-align: center;
  margin-top: 7px;
}

.howto-cnpay .cnpayBottom .warning {
  font-size: 20px;
  font-weight: 700;
  color: #ff0000;
  margin-bottom: 30px;
}

.howto-cnpay .cnpayBottom .warning-big {
  background: #484848;
  border-radius: 20px;
  color: #fff;
  font-size: 20px;
  line-height: 25px;
  font-weight: 600;
  padding: 25px 0px;
  margin: 0px 60px;
}

.howto-cnpay .cnpayBottom .buttonGroup {
  margin-top: 33px;
  display: flex;
  justify-content: center;
}

.howto-cnpay .cnpayBottom .buttonGroup .btnCargo {
  width: 478px;
  margin-bottom: 20px;
}

.navtop-mobile {
  display: none;
}

.menu-mobile {
  display: none;
}

.vcbnew-arti .shortlink {
  font-size: 16px;
  font-weight: 500;
  color: #a1a1a1;
  padding-left: 20px;
  margin-bottom: 20px;
  margin-top: 20px;
}

.vcbnew-arti .shortlink a {
  text-decoration: unset;
  color: #a1a1a1;
  transition: 0.2s;
}

.vcbnew-arti .shortlink a:hover {
  color: #666;
}

.vcbnew-arti .shortlink i {
  margin: 0px 10px;
}

.vcbnew-arti .shortlink .active {
  color: #000;
}

.flashsale-page {
  color: #000;
  padding: 50px 0px;
}

.flashsale-page .section {
  font-size: 64px;
  margin-bottom: 25px;
}

.flashsale-page .section img {
  height: 80px;
}

.vcbnew-arti .goods-content .dropsort {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin-bottom: 30px;
}

.vcbnew-arti .goods-content .dropsort .dropsort-bt {
  width: 320px;
  height: 56px;
  background: #f1f1f1;
  border-radius: 10px;
  border: unset;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 500;
  padding: 0px 18px;
  color: #000;
}

.vcbnew-arti .goods-content .dropsort .dropsort-bt i {
  font-size: 30px;
}

.vcbnew-arti .goods-content .dropsort .dropsort-bt:hover span {
  color: #f6861f;
}

.vcbnew-arti .goods-content .dropsort.open .dropsort-bt i {
  transform: rotate(180deg);
}

.vcbnew-arti .goods-content .dropsort .dropdown-menu {
  right: 0px;
  left: unset;
  padding: unset;
  border: unset;
  background: unset;
  box-shadow: unset;
  z-index: 99;
}

.vcbnew-arti .goods-content .dropsort .dropdown-menu > li:not(:last-child) {
  margin-bottom: 2px;
}

.vcbnew-arti .searchTop-mb {
  display: none;
}

.vcbnew-arti .productMenu-mobile {
  display: none;
}

.vcbmall-page {
  color: #000;
  padding: 40px 0px;
}

.vcbmall-page.home {
  padding: 60px 0px 20px 0px;
}

.vcbmall-page .vm-banner {
  margin-bottom: 45px;
}

.vcbmall-page .vm-banner img {
  width: 100%;
  border-radius: 20px;
}

.vcbmall-page .vm-catalog .title {
  font-size: 34px;
  font-weight: 600;
  color: #ff8f00;
  display: flex;
  align-items: end;
  margin-bottom: 40px;
  width: fit-content;
  text-decoration: unset;
}

.vcbmall-page .vm-catalog .title img {
  width: 56px;
  margin-left: 15px;
}

.vcbmall-page .vm-catalog .catalog-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 90px;
}

.vcbmall-page .vm-catalog .catalog-list .catalog-item {
  width: auto;
  position: relative;
}

.vcbmall-page .vm-catalog .catalog-list .catalog-item .catName {
  width: 100%;
  position: absolute;
  text-align: center;
  color: #6c6c6c;
  font-size: 14px;
  line-height: 17px;
  font-weight: 500;
  margin-top: 15px;
  transition: all ease 0.2s;
}

.vcbmall-page .vm-catalog .catalog-list .catalog-item img {
  height: 90px;
  width: 100%;
  transition: all ease 0.2s;
  border-radius: 100px;
}

.vcbmall-page .vm-catalog .catalog-list .catalog-item:hover img {
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

.vcbmall-page .vm-catalog .catalog-list .catalog-item:hover .catName,
.vcbmall-page .vm-catalog .catalog-list .catalog-item .catName.active {
  color: #ff8f00;
}

.sort-group {
  display: flex;
}

.sort-group .sortMenu-left {
  width: 25.7%;
  margin-top: 52px;
  padding-right: 25px;
}

.sort-group .sortMenu-left .title {
  font-size: 16px;
  border-bottom: 1px solid #d5d5d5;
  padding-bottom: 10px;
}

.sort-group .goods-content {
  width: 74.3%;
}

.sort-group .goods-content .goods-list .goods-item {
  margin-left: 30px;
}

.sort-group .goods-content .goods-list .goods-item:nth-child(3n + 1) {
  margin-left: 0px;
}

.filter-content .filter-item .filter-head .title {
  padding: 10px 0px;
  position: relative;
}

.filter-content .filter-item .filter-head .title > a {
  color: #000;
  text-decoration: unset;
  display: block;
}

.filter-content .filter-item .filter-head .title .filter-plus:after {
  content: "-";
  font-size: 22px;
  line-height: 22px;
  font-weight: 500;
  position: absolute;
  right: 3px;
}

.filter-content .filter-item .filter-head .title .filter-plus.collapsed:after {
  content: "+";
  line-height: 25px;
  right: 0px;
}

.filter-content .filter-item .filter-body .checkContent {
  font-size: 16px;
  margin: 20px 0px 30px 0px;
  color: #575757;
}

.filter-content .filter-item .filter-body .checkContent .checkItem {
  display: flex;
  align-items: center;
}

.filter-content
  .filter-item
  .filter-body
  .checkContent
  .checkItem:not(:last-child) {
  margin-bottom: 16px;
}

.filter-content
  .filter-item
  .filter-body
  .checkContent
  .checkItem
  input[type="checkbox"] {
  margin: unset;
  margin-bottom: 2px;
  width: 18px;
  height: 18px;
  accent-color: #575757;
  cursor: pointer;
}

.filter-content .filter-item .filter-body .checkContent .checkItem label {
  margin: unset;
  font-weight: 500;
  margin-left: 8px;
  cursor: pointer;
}

.filter-content .filter-item .filter-body .checkContent .showsub {
  cursor: pointer;
  color: #707070;
  margin-left: auto;
}

.filter-content .filter-item .filter-body .checkContent .showsub:after {
  content: "+";
  font-size: 20px;
  line-height: 22px;
  font-weight: 500;
}

.filter-content .filter-item .filter-body .checkContent .showsub.active:after {
  content: "-";
  font-size: 22px;
  margin-right: 3px;
}

.filter-content .filter-item .filter-body .checkContent .subgroup {
  display: none;
}

.filter-content .filter-item .filter-body .checkContent .subgroup.active {
  display: block;
}

.filter-content .filter-item .filter-body .checkContent .subgroup .checkItem {
  margin-bottom: 16px;
}

.filter-content
  .filter-item
  .filter-body
  .checkContent
  .subgroup
  .checkItem:last-child {
  margin-bottom: 22px;
}

.filter-content .filter-item .filter-body .filter-sortprice {
  display: flex;
  margin-top: 15px;
}

.filter-content .filter-item .filter-body .filter-sortprice .sortItem {
  width: 50%;
  padding: 0px 7px;
}

.filter-content .filter-item .filter-body .filter-sortprice .sortItem input {
  border: unset;
  border-bottom: 1px solid #d5d5d5;
  outline: unset;
  padding: unset;
  font-size: 14px;
  height: 35px;
  width: 100%;
}

.filter-content .filter-bottom {
  margin-top: 20px;
}

.filter-content .filter-bottom .btn {
  height: 40px;
  border: unset;
  font-weight: 700;
  /* background: linear-gradient(180deg, #fcfcfc 0%, #e6e6e6 100%); */
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 10px;
}

.profile-mb {
  color: #000;
  padding: 12px 0px 30px 0px;
}

.profile-mb .topacc {
  display: flex;
  margin-bottom: 13px;
}

.profile-mb .topacc .accimg {
  width: 28%;
  text-align: center;
}

.profile-mb .topacc .accimg img {
  width: 72px;
  height: 72px;
  border-radius: 100px;
}

.profile-mb .topacc .accinfo {
  width: 48%;
  font-family: "Inter", sans-serif;
}

.profile-mb .topacc .accinfo .code {
  font-size: 20px;
  font-weight: 700;
}

.profile-mb .topacc .accinfo .name {
  font-family: "Noto Sans Thai", sans-serif;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 4px;
}

.profile-mb .topacc .accinfo .contact {
  font-size: 10px;
  font-weight: 500;
  white-space: nowrap;
}

.profile-mb .topacc .acchref {
  width: 24%;
  display: flex;
  justify-content: space-around;
}

.profile-mb .topacc .acchref img {
  width: 27px;
}

.profile-mb .toprankacc {
  padding: 0px 15px;
  margin-bottom: 15px;
}

.profile-mb .toprankacc .rankname {
  display: flex;
  align-items: end;
  margin-left: 6px;
}

.profile-mb .toprankacc .rankname img {
  width: 22.03px;
  margin-right: 3px;
}

.profile-mb .toprankacc .rankname span {
  font-size: 15px;
  color: #ff8f00;
  font-weight: 700;
  line-height: 16px;
}

.profile-mb .toprankacc .progress {
  height: 8px;
  margin: 8px 0px;
  box-shadow: unset;
  background-color: #d1d1d1;
}

.profile-mb .toprankacc .ranklab {
  color: #d1d1d1;
  text-align: right;
  font-size: 14px;
  font-weight: 600;
}

.profile-mb .toprankacc .ranklab span {
  color: #ff8f00;
}

.profile-mb .balance-acc {
  background: #ffffff;
  box-shadow: inset 0px 0px 12.1px rgba(0, 0, 0, 0.09);
  border-radius: 10px;
  display: flex;
  justify-content: space-evenly;
  padding: 20px 10px;
}

.profile-mb .balance-acc .balance-item {
  width: 33.3%;
  text-align: center;
}

.profile-mb .balance-acc .balance-item .title {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 5px;
}

.profile-mb .balance-acc .balance-item .value {
  display: block;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: inherit;
  margin-bottom: 8px;
}

.profile-mb .balance-acc .balance-item .value span {
  font-weight: 500;
}

.profile-mb .balance-acc .balance-item .link {
  display: flex;
  justify-content: center;
}

.profile-mb .balance-acc .balance-item a {
  text-decoration: unset;
  display: block;
  font-size: 13px;
  line-height: 15px;
  font-weight: 600;
  cursor: pointer;
  color: #000;
}

.profile-mb .balance-acc .balance-item .link a:first-child {
  padding-right: 5px;
  border-right: 1px solid #959595;
  color: #ff8f00;
}

.profile-mb .balance-acc .balance-item .link a:last-child {
  padding-left: 5px;
}

.profile-mb .tools-acc {
  padding: 20px 5px;
}

.profile-mb .tools-acc.gray {
  background: #f8f8f8;
  margin: 0px -12px;
  padding: 20px 17px;
}

.profile-mb .tools-acc .title {
  display: flex;
  justify-content: space-between;
  font-size: 15px;
  margin-bottom: 35px;
}

.profile-mb .tools-acc .title a {
  color: #000;
  text-decoration: unset;
}

.profile-mb .tools-acc .title span {
  font-weight: 700;
}

.profile-mb .tools-acc .tools-list {
  display: flex;
  flex-wrap: wrap;
}

.profile-mb .tools-acc .tools-list a {
  color: #000;
  text-decoration: unset;
}

.profile-mb .tools-acc .tools-list .tools-item {
  width: 25%;
  display: block;
  text-align: center;
  position: relative;
}

.profile-mb .tools-acc .tools-list .tools-item img {
  height: 30px;
  margin-bottom: 10px;
}

.profile-mb .tools-acc .tools-list .tools-item .sec {
  font-size: 13px;
  line-height: 16px;
  font-weight: 600;
}

.profile-mb .tools-acc .tools-list .tools-item .noti {
  position: absolute;
  right: 15px;
  top: -13px;
  min-width: 23px;
  padding: 0px 5px;
  height: 23px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ff8f00;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  font-size: 12px;
  color: #fff;
}

.profile-mb .tools-duo {
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
  margin-bottom: 5px;
}

.profile-mb .tools-duo a {
  text-decoration: unset;
}

.profile-mb .tools-duo .tools-item {
  width: 48%;
  height: 90px;
  background: #f7f7f7;
  box-shadow: inset 0px 0px 18px -9px rgba(0, 0, 0, 0.48);
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.profile-mb .tools-duo .tools-item img {
  height: 32px;
  margin-bottom: 7px;
}

.profile-mb .tools-duo .tools-item .sec {
  color: #000;
  font-size: 15px;
  font-weight: 700;
}

.profile-mb .tools-acc.more .title {
  margin-bottom: 30px;
}

.profile-mb .tools-acc.more .tools-list .tools-item {
  margin-bottom: 25px;
}

.profile-mb .tools-acc.more .tools-list .tools-item img {
  height: 34px;
}

.profile-mb .help-acc {
  padding: 10px 5px 20px 5px;
}

.profile-mb .help-acc .title {
  display: flex;
  justify-content: space-between;
  font-size: 15px;
  margin-bottom: 10px;
}

.profile-mb .help-acc .title a {
  color: #000;
  text-decoration: unset;
}

.profile-mb .help-acc .title span {
  font-weight: 700;
}

.profile-mb .help-acc .help-content > a {
  color: #000;
  text-decoration: unset;
}

.profile-mb .help-acc .help-content .help-item {
  position: relative;
  background: #f7f7f7;
  box-shadow: inset 0px 0px 18px -9px rgba(0, 0, 0, 0.48);
  border-radius: 10px;
  margin-bottom: 10px;
  padding: 20px 0px;
  display: flex;
  align-items: center;
}

.profile-mb .help-acc .help-content .help-item:last-child {
  margin: unset;
}

.profile-mb .help-acc .help-content .help-item .help-image {
  width: 22%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.profile-mb .help-acc .help-content .help-item .help-detail {
  width: 78%;
}

.profile-mb .help-acc .help-content .help-item .help-detail .head {
  font-weight: 700;
  font-size: 15px;
}

.profile-mb .help-acc .help-content .help-item .help-detail .des {
  font-size: 12px;
  margin-top: 3px;
}

.profile-mb .help-acc .help-content .help-item .help-image img {
  height: 39px;
}

.profile-mb .help-acc .help-content .help-item .help-image .small {
  width: 24px;
  height: auto;
}

.profile-mb .help-acc .help-content .help-item .help-button {
  position: absolute;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  border-radius: 30px;
  color: #fff;
  text-decoration: unset;
  background: #ff8f00;
  border: unset;
  padding: 0px 7px;
  right: 8px;
  top: 8px;
  transition: 0.3s;
}

.profile-mb .help-acc .help-content .help-item .help-button:hover {
  background: #d27600;
}

.vcb-point {
  padding: 7px 45px 20px 45px;
}

.vcb-point .point-title {
  display: flex;
  align-items: center;
  font-size: 30px;
  color: #f38420;
  margin-bottom: 25px;
}

.vcb-point .point-title img {
  width: 120px;
  margin-right: 20px;
}

.vcb-point .point-now {
  margin-bottom: 50px;
}

.vcb-point .point-now .title {
  margin-right: 15px;
  font-size: 25px;
  color: #000;
}

.vcb-point .point-now .point {
  font-size: 34px;
  color: #f38420;
}

.vcb-point .point-redeem .des {
  font-size: 24px;
  color: #f38420;
}

.vcb-point .point-redeem .action {
  text-align: center;
  margin-top: 25px;
  margin-bottom: 81px;
}

.vcb-point .point-redeem .action .bt-redeem {
  border: unset;
  color: #fff;
  background: #f38420;
  border-radius: 12px;
  height: 60px;
  padding: 0px 30px;
  outline: unset;
  font-size: 28px;
  transition: 0.2s;
}

.vcb-point .point-redeem .action .bt-redeem:hover {
  background: #d0711b;
}

.vcb-point-terms {
  color: red;
  font-size: 15px;
  padding: 0px 15px 20px 15px;
}

.vcb-point-terms .title {
  margin-bottom: 6px;
}

.vcb-point-terms .terms-list {
  position: relative;
  padding-left: 15px;
}

.vcb-point-terms .terms-list > li {
  list-style: none;
  margin-bottom: 5px;
}

.vcb-point-terms .terms-list > li::before {
  content: "-";
  position: absolute;
  left: 0px;
}

.modal-rewards {
  margin-top: 25%;
}

@media (min-width: 768px) {
  .modal-rewards {
    margin: 140px auto;
  }
}

.modal-rewards .modal-content {
  border: unset;
  box-shadow: unset;
  background: transparent;
}

.modal-rewards .modal-content .modal-body {
  padding: unset;
  background-size: 100%;
  background-repeat: no-repeat;
  height: 530px;
}

.modal-rewards .reward-close {
  position: absolute;
  right: 20px;
  top: 0px;
  width: 35px;
  height: 35px;
  cursor: pointer;
}

.modal-rewards .reward-close:hover {
  opacity: 0.7;
}

.modal-rewards .reward-close img {
  width: 100%;
}

.modal-rewards .reward-button {
  position: absolute;
  bottom: 55px;
  left: 0px;
  display: flex;
  justify-content: center;
  width: 100%;
}

.modal-rewards .reward-button.failed-action {
  bottom: 90px;
  left: -20px;
}

.modal-rewards .reward-button.success-action {
  bottom: 75px;
  left: -5px;
}

.modal-rewards .reward-button .reward-bt {
  height: 83px;
  cursor: pointer;
}

.modal-rewards .reward-button.failed-action .reward-bt,
.modal-rewards .reward-button.success-action .reward-bt {
  height: 120px;
  cursor: pointer;
}

.modal-rewards .reward-button .reward-bt:hover {
  opacity: 0.7;
}

.loader {
  position: relative;
}

.contentLoader {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}

.boxLoader {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}

/* .contentLoader .spinner {
  border: 6px solid #e2e2e2;
  border-top: 6px solid #ff7e00;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 0.7s linear infinite;
} */

.contentLoader .spinner,
.boxLoader .spinner {
  content: url("/img/loading.gif");
  width: 40px;
  height: 40px;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.order-mobile .page-head {
  font-size: 16px;
}

.order-mobile .page-head span {
  padding-right: 5px;
}

.order-mobile .page-head .head-drop i {
  font-size: 22px;
  margin-left: 5px;
  line-height: 18px;
}

.order-mobile .order-slide {
  display: none;
}

.order-mobile .order-top {
  font-size: 16px;
  margin-bottom: 15px;
  display: flex;
}

.order-mobile .order-top .created {
  width: 70%;
}

.order-mobile .order-top .type {
  text-align: right;
  width: 30%;
}

.page-box.order-mobile > .page-body {
  padding: 13px 15px;
}

.order-mobile .order-group {
  padding-bottom: 15px;
}

.order-mobile .order-group .order-item {
  display: flex;
  align-items: center;
}

.order-mobile .order-group .order-item:not(:last-child) {
  margin-bottom: 18px;
}

.order-mobile .order-group .order-item .order-image {
  width: 21%;
  text-align: center;
}

.order-mobile .order-group .order-item .order-image img {
  max-width: 100%;
  width: 60px;
  height: 60px;
}

.order-mobile .order-group .order-item .order-details {
  width: 79%;
  font-size: 14px;
  padding-left: 7px;
  color: rgb(156, 156, 156);
}

.order-mobile .order-group .order-item .order-details > div {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.order-mobile .order-bottom {
  font-size: 16px;
  text-align: right;
}

/* .order-mobile .order-bottom .total {
  margin-bottom: 13px;
} */

.order-mobile .order-bottom .total .promo-bd {
  float: left;
}

.order-mobile .order-bottom .button-group .btn {
  font-size: 16px;
  border-radius: 50px;
  line-height: 23px;
  padding: 0px 14px;
  margin-top: 13px;
}

.back-history {
  display: none;
}

.aboutus-mobile {
  display: none;
}

.productvcb-page {
  padding: 50px 0px;
}

.productvcb-page .shortlink {
  margin-bottom: 35px;
  padding: unset;
}

.vmallpro-content {
  display: flex;
  margin-bottom: 60px;
}

.vmallpro-content .vmall-image {
  width: 42%;
}

.vmallpro-content .vmall-image .mainImg {
  width: 100%;
  border-radius: 16px;
}

.vmallpro-content .vmall-content {
  width: 58%;
  word-wrap: break-word;
  padding-left: 30px;
}

.vmallpro-content .vmall-image .imgslide {
  margin-top: 25px;
}

.vmallpro-content .vmall-image .imgslide .subImg {
  position: relative;
  padding: 0px 30px;
}

.vmallpro-content .vmall-image .imgslide .subImg .owl-nav {
  position: absolute;
  display: flex;
  justify-content: space-between;
  width: 100%;
  left: 0px;
  top: 26%;
  font-size: 30px;
  z-index: -1;
}

.vmallpro-content .vmall-image .imgslide .subImg .owl-nav button {
  transition: all 0.2s;
}

.vmallpro-content .vmall-image .imgslide .subImg .owl-nav button:hover {
  color: #8d8d8d;
}

.vmallpro-content .vmall-image .imgslide .subImg .owl-dots {
  display: none;
}

.vmallpro-content .vmall-image .imgslide .subImg .subImg-item {
  cursor: pointer;
  transition: all ease 0.2s;
}

.vmallpro-content .vmall-image .imgslide .subImg .subImg-item:hover {
  opacity: 0.75;
}

.vmallpro-content .vmall-image .imgslide .subImg .subImg-item img {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
}

.vmallpro-content .vmall-content .productName {
  margin-bottom: 10px;
}

.vmallpro-content .vmall-content .productName .title {
  font-size: 34px;
  font-weight: 700;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.vmallpro-content .vmall-content .productName .des {
  font-size: 20px;
  color: #666;
}

.vmallpro-content .vmall-content .normal-price,
.vmallpro-content .vmall-content .campaign-price {
  font-family: "Inter", sans-serif;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
}

.vmallpro-content .vmall-content .campaign-price span:not(:last-child) {
  margin-right: 7px;
}

.vmallpro-content .vmall-content .campaign-price .price {
  font-weight: 700;
  color: #e21d1d;
}

.vmallpro-content .vmall-content .campaign-price .dash {
  font-weight: 400;
  font-size: 28px;
  text-decoration-line: line-through;
  color: #828282;
}

.vmallpro-content .vmall-content .campaign-price .off {
  font-weight: 500;
  font-size: 28px;
  color: #e21d1d;
}

.vmallpro-content .vmall-content .skuList {
  margin-bottom: 20px;
  min-height: 134px;
  max-height: 200px;
  overflow-y: auto;
}

.vmallpro-content .vmall-content .skuList .skuItems {
  padding: 4px 8px;
  margin-bottom: 8px;
  margin-right: 5px;
  max-width: 240px;
}

.vmallpro-content .vmall-content .skuList .skuItems .inner {
  display: flex;
  align-items: center;
}

.vmallpro-content .vmall-content .skuList .skuItems:focus {
  background: #fff1e6;
}

.vmallpro-content .vmall-content .skuList .skuItems.active {
  box-shadow: unset;
  background: #fff1e6;
  color: #f5851f;
  border-color: #f5851f;
}

.vmallpro-content .vmall-content .skuList .skuItems span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.vmallpro-content .vmall-content .skuList .skuItems.active .inner span {
  max-width: 85%;
  overflow: unset;
  text-overflow: unset;
  white-space: normal;
  text-align: left;
}

.vmallpro-content .vmall-content .skuList .skuItems img {
  width: 24px;
  border-radius: 3px;
  margin-right: 6px;
}

.vmallpro-content .vmall-content .productAction .submitVmall {
  width: 417px;
  max-width: 100%;
  height: 79px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 20px;
  padding: unset;
  color: #000;
  font-size: 32px;
  font-weight: 700;
}

.vmallpro-content .vmall-content .productAction .qty-content {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}

.vmallpro-content .vmall-content .productAction .qty-content .lab {
  font-size: 20px;
  line-height: 22px;
  font-weight: 700;
  margin-right: 15px;
}

.vmallpro-content .vmall-content .productAction .qty-content .input-group {
  width: 110px;
}

.vmallpro-content .vmall-content .productAction .qty-content .total-show {
  font-weight: 500;
  margin-left: 15px;
  position: relative;
}

.vmallpro-content .vmall-content .productAction .qty-content .total-show.hidd {
  opacity: 0;
}

.vmallpro-content
  .vmall-content
  .productAction
  .qty-content
  .total-show
  .total-item:not(:last-child) {
  margin-right: 10px;
}

.vmallpro-content
  .vmall-content
  .productAction
  .qty-content
  .input-group
  .form-control {
  padding: unset;
  box-shadow: unset;
  font-size: 14px;
}

.vmallpro-content
  .vmall-content
  .productAction
  .qty-content
  .input-group
  .form-control:focus {
  color: #f5851f;
  border-color: #f5851f;
}

.vmall-description {
  font-size: 16px;
}

.vmall-description .des-header {
  font-weight: 500;
  padding: 10px 20px;
  background: #f1f1f1;
  border-radius: 10px;
}

.vmall-description .des-body {
  padding: 25px 0px 20px 0px;
}

.vmall-description .des-body > div {
  width: 100% !important;
}

.vmall-description .des-body img {
  width: 100%;
}

.vmall-recommend {
  margin-top: 45px;
}

.vmall-recommend .title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vmall-recommend .title a {
  color: #000;
  text-decoration: unset;
}

.vmall-recommend .title a:hover {
  opacity: 0.7;
}

.vmall-recommend .productRec a {
  color: #000;
  text-decoration: unset;
}

.vmall-recommend .productRec .recItems {
  transition: all ease 0.2s;
}

.vmall-recommend .productRec .recItems:hover {
  opacity: 0.7;
}

.vmall-recommend .productRec .recItems img {
  width: 100%;
  height: 167.5px;
  margin-bottom: 10px;
  border-radius: 8px;
}

.vmall-recommend .productRec .recItems .name {
  font-size: 16px;
  font-weight: 600;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.vmall-recommend .productRec .recItems .des {
  color: #626262;
  margin-bottom: 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.vmall-recommend .productRec .recItems .normal-price,
.vmall-recommend .productRec .recItems .campaign-price {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 700;
}

.vmall-recommend .productRec .recItems .campaign-price span:not(:last-child) {
  margin-right: 3px;
}

.vmall-recommend .productRec .recItems .campaign-price .price {
  font-weight: 700;
  color: #e21d1d;
}

.vmall-recommend .productRec .recItems .campaign-price .dash {
  font-weight: 400;
  font-size: 12px;
  text-decoration-line: line-through;
  color: #626262;
}

.vmall-recommend .productRec .recItems .campaign-price .off {
  font-weight: 500;
  font-size: 14px;
  color: #e21d1d;
}

.vmallpro-content
  .vmall-content
  .productAction
  .qty-content
  .total-show
  .drop-show {
  position: absolute;
  margin: unset;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  background: #ff9900;
  outline: unset;
  border: unset;
  color: #fff;
  font-size: 17px;
  width: 22px;
  height: 22px;
  right: -25px;
  top: -2px;
}

.vmallpro-content
  .vmall-content
  .productAction
  .qty-content
  .total-show
  .drop-show.active {
  transform: rotate(180deg);
}

.vmallpro-content .vmall-content .productAction .result-content {
  display: none;
}

.vmallpro-content .vmall-content .productAction .result-content .table {
  margin-bottom: 30px;
  text-align: left;
}

.vmallpro-content .vmall-content .productAction .result-content .table tbody {
  font-size: 15px;
}

.vmallpro-content .vmall-content .productAction .result-content .table th,
.vmallpro-content .vmall-content .productAction .result-content .table td {
  padding: 6px;
}

.vcbgif {
  position: fixed;
  right: 133px;
  /* right: 30px; */
  bottom: 30px;
  width: 140px;
  z-index: 101;
}

.vcbgif img {
  width: 100%;
}

.vcbgif .close-bt {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 27px;
  height: 27px;
  padding: unset;
  margin: unset;
  border: unset;
  background: unset;
}

.vcbgif .close-bt:hover {
  opacity: 0.6;
}

.selectcoupon-mb {
  display: none !important;
  justify-content: space-between;
  align-items: center;
  color: #999;
}

.selectcoupon-mb.active .cp-name {
  color: #000;
}

.selectcoupon-mb i {
  margin-left: 8px;
}

.selectcoupon-mb .cp-name {
  width: 82%;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.selectcoupon-mb .cp-select {
  width: 18%;
}

.couponitem-mb {
  color: #212121;
}

.couponitem-mb .radio {
  margin: unset;
  padding: 10px 0px;
}

.couponitem-mb .radio:first-child {
  padding-top: unset;
}

.couponitem-mb .radio:last-child {
  padding-bottom: unset;
}

.couponitem-mb .radio:not(:last-child) {
  border-bottom: 1px solid #e5e5e5;
}

.couponitem-mb .radio label {
  width: 100%;
  font-size: 15px;
}

.carousel-control {
  width: 18%;
  opacity: 0;
  transition: 0.4s;
}

.carousel-control.left,
.carousel-control.right {
  background-image: unset;
}

.paymentNew-content {
  padding: 40px 0px 20px 0px;
}

.paymentNew-content .pm-alert {
  background: #ffeace;
  color: #ff001f;
  font-size: 20px;
  text-align: center;
  font-weight: 700;
  height: 75px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.paymentNew-content .pm-alert.pay-order {
  height: auto;
  padding: 15px 30px;
  font-weight: 600;
  text-align: left;
}

/* .paymentNew-content .pm-alert {
  background: #ffeace;
  color: #ff001f;
  font-size: 16px;
  text-align: left;
  font-weight: 700;
  height: 120px;
  display: flex;
  padding: 15px;
} */

.paymentNew-content .pm-page {
  padding: 20px 60px 15px 60px;
}

.paymentNew-content .pm-page .topprice {
  margin-bottom: 22px;
  padding: 0px 15px;
}

.paymentNew-content .pm-page .topprice .price {
  font-size: 24px;
  font-weight: 700;
}

.paymentNew-content .pm-page .topprice .price:not(:last-child) {
  margin-bottom: 5px;
}

.paymentNew-content .pm-page .topprice .price span {
  font-family: "Inter", sans-serif;
}

.paymentNew-content .pm-page .topprice .price .hl {
  color: #ff001f;
}

.paymentNew-content .pm-page .paytable {
  background: #fff;
  box-shadow: -1px 1px 5.6px rgba(0, 0, 0, 0.25);
  border-radius: 13px;
  margin-bottom: 40px;
}

.paymentNew-content .pm-page .paytable thead {
  height: 52px;
  background: #f4f4f4;
}

.paymentNew-content .pm-page .paytable th {
  vertical-align: middle;
  font-size: 18px;
  font-weight: 600;
  color: #878787;
}

.paymentNew-content .pm-page .paytable tbody {
  font-family: "Inter", "Noto Sans Thai", sans-serif;
}

.paymentNew-content .pm-page .paytable td {
  padding: 5px;
  font-size: 16px;
  font-weight: 600;
}

.paymentNew-content .pm-page .paytable .pt-price {
  font-weight: 500;
}

.paymentNew-content .pm-page .paytable .pt-price .dash {
  text-decoration-line: line-through;
  margin-right: 5px;
}

.paymentNew-content .pm-page .paytable .pt-price .newprice {
  color: #ff8f00;
}

.paymentNew-content .pm-page .paytable .promo-lab {
  color: #ff8f00;
  background: #ffdabf;
  padding: 5px 40px;
  font-weight: 700;
  border-radius: 10px;
}

.paymentNew-content .pm-page .paytable td.slim {
  font-weight: 400;
}

.paymentNew-content .pm-page .payboxGroup {
  display: none;
}

.paymentNew-content .pm-page .resultprice {
  display: flex;
}

.paymentNew-content .pm-page .resultprice .payoptions {
  width: 60%;
  padding-right: 20px;
}

.paymentNew-content .pm-page .resultprice .payoptions .toptext {
  text-align: center;
  font-weight: 600;
  font-size: 18px;
  color: #f6861f;
  margin-bottom: 10px;
}

.paymentNew-content .pm-page .resultprice .payoptions .toptext .text-small {
  font-size: 16px;
  font-weight: 400;
  color: #ff9839;
}

.paymentNew-content .pm-page .resultprice .payoptions .optionBox {
  padding: 20px 50px;
  background: #f2f2f2;
  border-radius: 13px;
  font-size: 16px;
  margin-bottom: 15px;
}

.resultprice .payoptions .optionBox .optionGroup {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.resultprice .payoptions .optionBox .optionGroup:first-child {
  margin-bottom: 15px;
}

.resultprice .payoptions .optionBox .optionGroup .lab {
  width: 28%;
  font-weight: 500;
}

.resultprice .payoptions .optionBox .optionGroup .lab img {
  height: 15px;
  margin-right: 10px;
}

.resultprice .payoptions .optionBox .optionGroup .input {
  width: 68%;
  position: relative;
}

/* .resultprice .payoptions .optionBox .optionGroup .input select {
  font-size: 16px;
  font-weight: 400;
  color: #000 !important;
} */

.resultprice .payoptions .optionBox .form-control {
  height: 45px;
  background: #fff;
  border-color: #fff;
  box-shadow: unset;
  padding: 0px 20px;
  border-radius: 100px;
  font-size: 18px;
  font-weight: 500;
}

.resultprice .payoptions .optionBox .form-control:disabled {
  opacity: 0.5;
}

.resultprice .payoptions .optionBox .code-status {
  padding-left: 12px;
  font-size: 14px;
  font-weight: 500;
}

.resultprice .payoptions .optionBox .code-status .alertshow {
  margin-top: 10px;
}

.resultprice .payoptions .optionBox .code-status .alertshow i {
  margin-right: 6px;
}

.resultprice .payoptions .optionBox .form-control::placeholder {
  font-size: 16px;
  font-weight: 400;
}

.resultprice .payoptions .optionBox .form-control:focus,
.resultprice .payoptions .optionBox .form-control.active {
  border-color: #ff8f00;
  color: #ff8f00;
}

.resultprice .payoptions .optionBox .form-control.active-bg {
  border-color: #ff8f00;
  color: #ff8f00;
  font-weight: 600;
  font-size: 20px;
}

.resultprice .payoptions .optionBox .optionGroup .redeemBtn {
  height: 45px;
  width: 100%;
  padding: unset;
  display: flex;
  justify-content: center;
  align-items: center;
  border: unset;
  border-radius: 50px;
  background: #ff8f00;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  transition: all 0.1s;
}

.resultprice .payoptions .optionBox .optionGroup .redeemBtn:disabled {
  background: #d0d0d0 !important;
  cursor: not-allowed;
}

.resultprice .payoptions .optionBox .optionGroup .redeemBtn:hover {
  background: #e88200;
}

.resultprice .payoptions .optionBox .optionGroup .redeemBtn:active {
  background: #dd7c00;
}

.resultprice .payoptions .optionBox .optionGroup .redeemBtn.active {
  font-size: 18px;
  color: #ff8f00;
  background: #fff;
  border: 1px solid #ff8f00;
  cursor: unset;
}

.resultprice .payoptions .optionBox .redeempoint {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 15px;
}

.resultprice .payoptions .optionBox .redeemdes {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #878787;
  text-align: center;
}

.resultprice .payoptions .optionBox .redeemdes .des {
  color: #ff8f00;
  font-weight: 500;
}

.resultprice .payoptions .optionBox .redeempoint .mypoint {
  min-width: 30%;
  padding: 0px 15px;
  display: inline-block;
  font-size: 24px;
  font-weight: 600;
}

.resultprice .payoptions .optionBox .optionGroup .half {
  width: 48%;
}

.paymentNew-content .pm-page .resultprice .payresult {
  width: 40%;
  background: #f0f0f0;
  padding: 12px 30px 20px 30px;
  border-radius: 13px;
}

.paymentNew-content .pm-page .resultprice .payresult .title {
  font-size: 20px;
  font-weight: 600;
}

.paymentNew-content .pm-page .resultprice .payresult .resultList {
  margin: 0px 10px;
  padding: 10px 0px;
  font-size: 16px;
  border-bottom: 1px solid #c6c6c6;
}

.paymentNew-content .pm-page .resultprice .payresult .resultList .rs-item {
  display: flex;
  justify-content: space-between;
}

.paymentNew-content
  .pm-page
  .resultprice
  .payresult
  .resultList
  .rs-item:not(:last-child) {
  margin-bottom: 6px;
}

.payresult .resultList .rs-item .lab {
  color: #878787;
}

.payresult .resultList .rs-item .price {
  font-family: "Inter", "Noto Sans Thai", sans-serif;
  text-align: right;
}

.payresult .resultList .rs-item .price small {
  font-size: 80%;
  background: #ff001f;
  color: #fff;
  padding: 2px 5px;
  border-radius: 3px;
}

.payresult .resultList .rs-item .price.hl {
  color: #ff001f;
  font-weight: 700;
}

.payresult .resultList .rs-item .price .newprice {
  color: #ff001f;
  font-size: 18px;
  font-weight: 700;
  line-height: 16px;
}

.payresult .resultList .rs-item .price .normal:not(:last-child) {
  margin-right: 10px;
}

.payresult .resultList .rs-item .price .des {
  font-family: "Inter", "Noto Sans Thai", sans-serif;
  margin-right: 12px;
}

.payresult .resultList .rs-item .price .dash {
  text-decoration-line: line-through;
  margin-left: 5px;
}

.paymentNew-content .pm-page .resultprice .payresult .resultTotal {
  font-size: 20px;
  margin-top: 14px;
}

.paymentNew-content .pm-page .resultprice .payresult .resultTotal .rs-item {
  display: flex;
  justify-content: space-between;
}

.payresult .resultTotal .rs-item .lab {
  font-weight: 700;
}

.payresult .resultTotal .rs-item .price {
  font-family: "Inter", sans-serif;
  font-weight: 600;
}

.payresult .resultTotal .rs-item .price.hl {
  color: #ff001f;
  font-weight: 700;
}

.payresult .resultTotal .rs-button {
  padding-left: 10px;
  margin: 14px 0px;
}

.payresult .resultTotal .rs-button button {
  border: unset;
  padding: unset;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  background: #ff001f;
  color: #fff;
  border-radius: 50px;
  width: 100%;
  font-size: 24px;
  font-weight: 600;
  transition: all 0.1s;
}

.payresult .resultTotal .rs-button button:hover {
  background: #e3001c;
}

.payresult .resultTotal .rs-button button:active {
  background: #b90016;
}

.payresult .resultTotal .rs-warning {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 5px;
}

.payresult .resultTotal .rs-warning .text {
  font-size: 16px;
  color: #ff001f;
}

.payresult .resultTotal .rs-warning .text > span {
  font-family: "Inter", sans-serif;
  font-weight: 600;
}

.payresult .resultTotal .rs-warning .refill .refill-bt {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f6861f;
  width: 109px;
  height: 34px;
  color: #fff;
  font-size: 16px;
  text-decoration: unset;
  font-weight: 600;
  border-radius: 50px;
}

.paymentNew-content .pm-bottom {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: #ff001f;
  margin-top: 12px;
}

.resultprice .payoptions .optionBox .optionGroup .input .coupon-select {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 45px;
  background: #fff;
  color: #959595;
  border: unset;
  padding: 0px 20px;
  border-radius: 100px;
  font-size: 16px;
  width: 100%;
  transition: 0.1s;
  border: 1px solid #fff;
}

.resultprice
  .payoptions
  .optionBox
  .optionGroup
  .input
  .coupon-select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.resultprice .payoptions .optionBox .optionGroup .input .coupon-select span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.resultprice
  .payoptions
  .optionBox
  .optionGroup
  .input
  .coupon-select
  span
  > b {
  color: #ff8f00;
  font-weight: 600;
}

.resultprice .payoptions .optionBox .optionGroup .input .coupon-select i {
  color: #000;
  font-size: 22px;
}

.resultprice .payoptions .optionBox .optionGroup .input .coupon-select.active {
  border-color: #ff8f00;
}

.resultprice
  .payoptions
  .optionBox
  .optionGroup
  .input
  .coupon-select.active
  i {
  transform: rotate(180deg);
}

.resultprice .payoptions .optionBox .optionGroup .input .couponList {
  display: none;
  position: absolute;
  background: #fff;
  /* width: 405px; */
  width: 450px;
  max-height: 550px;
  overflow: auto;
  right: 0px;
  padding: 14px 16px;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  margin-top: 5px;
  z-index: 1;
}

.optionGroup .input .couponList::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  border-radius: 10px;
}

.optionGroup .input .couponList::-webkit-scrollbar {
  width: 5px;
  background-color: #fff;
}

.optionGroup .input .couponList::-webkit-scrollbar-thumb {
  border-radius: 3px;
  background-color: #d9d9d9;
}

.couponList .coupon-item {
  padding: 14px 16px;
  border: 1px solid #f5f5f5;
  border-radius: 8px;
}

.couponList .coupon-item:not(:last-child) {
  margin-bottom: 5px;
}

.couponList .coupon-item .radio-wrapper .no-coupon {
  font-size: 14px;
  font-weight: 600;
  color: #aeaeae;
}

.couponList .coupon-item .radio-wrapper .round {
  position: relative;
  height: 38px;
}

.couponList .coupon-item .radio-wrapper .round.first {
  height: unset;
}

.couponList .coupon-item .radio-wrapper .round label {
  background-color: #fff;
  border: 1px solid #ff8f00;
  border-radius: 50%;
  cursor: pointer;
  height: 18px;
  width: 18px;
  margin: unset;
  display: block;
}

.couponList .coupon-item .radio-wrapper .round label:after {
  content: "";
  border-radius: 50%;
  width: 14px;
  height: 14px;
  top: 2px;
  left: 2px;
  opacity: 0;
  background: #ff8f00;
  position: absolute;
}

.couponList .coupon-item .radio-wrapper .round label .coupon-name {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  padding-left: 30px;
  font-size: 14px;
  color: #606060;
  line-height: 19px;
  font-weight: 600;
  /* overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; */
}

.couponList .coupon-item .radio-wrapper .round input[type="radio"] {
  visibility: hidden;
  display: none;
  opacity: 0;
}

.couponList
  .coupon-item
  .radio-wrapper
  .round
  input[type="radio"]:checked
  + label
  .coupon-name {
  color: #ff8f00;
}

.couponList
  .coupon-item
  .radio-wrapper
  .round
  input[type="radio"]:checked
  + label:after {
  opacity: 1;
}

.couponList .coupon-item.active {
  border-color: #ff8f00;
}

.vcb-addline {
  position: fixed;
  top: 620px;
  left: 15px;
  z-index: 100;
}

.vcb-addline.promo {
  top: 695px;
}

.vcb-addline a {
  text-decoration: unset;
}

.vcb-addline .addline-box {
  position: relative;
}

.vcb-addline .addline-box .addline-logo {
  width: 71px;
}

.vcb-addline .addline-box .addline-text {
  position: absolute;
  opacity: 0;
  height: 65px;
  transition: all ease 0.4s;
  top: 7px;
  left: 65px;
}

.vcb-addline .addline-box:hover .addline-text {
  opacity: 1;
  left: 75px;
}

.recommend-content {
  padding: 60px 0px 50px 0px;
}

.recommend-content .section {
  margin-bottom: 40px;
}

.recommend-content .recwrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  height: 600px;
}

.recommend-content .recwrap-in {
  display: flex;
  justify-content: space-between;
  margin-top: 29px;
}

.recommend-content .recside {
  width: 48.8%;
}

.recommend-content .recwrap-in .recside {
  width: 47.7%;
}

.recommend-content .recbox {
  display: block;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 4px;
  position: relative;
}

.recommend-content .recbox.full {
  height: 100%;
}

.recommend-content .recbox.half {
  height: 285px;
}

.recommend-content .recbox .description {
  position: absolute;
  width: 100%;
  left: 0px;
  color: #fff;
  padding: 30px;
}

.recommend-content .recbox.half .description {
  padding: 20px;
}

.recommend-content .recbox .description.top {
  top: 0px;
  color: #000;
}

.recommend-content .recbox .description.bottom {
  bottom: 0px;
}

.recommend-content .recbox .description .title {
  font-size: 24px;
  line-height: 28px;
  font-weight: 600;
  margin-bottom: 15px;
}

.recommend-content .recbox.half .description .title {
  margin-bottom: 8px;
}

.recommend-content .recbox .description .des {
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 15px;
}

.recommend-content .recbox .description .link {
  font-size: 16px;
  line-height: 20px;
  cursor: pointer;
}

.recommend-content .recbox .description .link span {
  color: #fff;
  text-decoration: unset;
  border-bottom: 1px solid #b1b1b1;
}

.recommend-content .recbox .description.top .link span {
  color: #000;
  border-color: #666;
}

.recommend-content .recbox .description .link span:hover {
  opacity: 0.7;
}

.recproduct-content {
  padding-bottom: 60px;
}

.recproduct-content .rec-shomore {
  text-align: center;
}

.recproduct-content .rec-shomore a {
  font-size: 32px;
  line-height: 34px;
  font-weight: 600;
  color: #000;
  text-decoration: unset;
  cursor: pointer;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  padding: 10px 45px;
}

.recproduct-content .rec-shomore a > i {
  font-size: 24px;
  line-height: 26px;
  margin-left: 10px;
}

.recproduct-content .rec-shomore a:hover {
  opacity: 0.7;
}

.recproduct-content .rec-tags {
  margin-bottom: 45px;
  /* margin-left: -10px;
  margin-right: -40px; 
  white-space: nowrap;
  overflow: auto;
  text-align: center; */
  scrollbar-width: none;

  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.recproduct-content .rec-tags::-webkit-scrollbar {
  display: none;
}

.recproduct-content .rec-tags .tags-item {
  display: inline-block;
  text-decoration: unset;
  font-size: 16px;
  line-height: 18px;
  border-radius: 50px;
  padding: 5px 15px;
  color: #2d3134;
  border: 1px solid #2d3134;
  margin-bottom: 10px;
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -ms-user-drag: none;
  user-drag: none;
}

.recproduct-content .rec-tags.active .tags-item {
  cursor: grabbing;
}

.recproduct-content .rec-tags .tags-item:hover,
.recproduct-content .rec-tags .tags-item.active {
  color: #fff;
  background: #2d3134;
  border-color: #2d3134;
}

.recproduct-content .rec-tags .tags-item:not(:last-child) {
  margin-right: 7px;
}

.socialvideo-content {
  background: #f1f1f1;
  overflow: hidden;
  padding: 60px 0px;
}

.socialvideo-content .video-box .con-nav {
  margin-bottom: 20px;
}

.socialvideo-content .video-box .con-nav .sv-icon img {
  height: 35px;
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -ms-user-drag: none;
  user-drag: none;
}

.socialvideo-content .video-box .youtube .youtube-iframe {
  width: 100%;
  height: 395px;
  border-radius: 8px;
}

.socialvideo-content .video-box .tiktok {
  display: flex;
  justify-content: space-between;
}

.socialvideo-content .video-box .tiktok .tiktok-item {
  width: 32%;
}

.socialvideo-content .video-box .tiktok .tiktok-item .tiktok-iframe {
  height: 395px;
  width: 100%;
  border-radius: 8px;
  border: unset;
  outline: unset;
}

.service-new {
  background: #f3f3f3;
  color: #000;
  padding: 55px 0px 100px 0px;
  overflow: hidden;
}

.service-new .section {
  margin-bottom: 50px;
}

.service-new .contain-warp {
  display: flex;
  justify-content: center;
}

.service-new .serv .title {
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  color: #ff9900;
  margin-bottom: 10px;
}

.service-new .serv .des {
  font-size: 18px;
  color: #484848;
  margin-bottom: 16px;
}

.service-new .serv .des b {
  font-weight: 600;
}

.service-new .serv.online {
  text-align: right;
  align-self: center;
  padding-right: 50px;
}

.service-new .serv.online .des {
  margin-bottom: 30px;
}

.service-new .serv.online .comp-group {
  display: flex;
  justify-content: space-between;
}

.service-new .serv.online .comp-group .comp-item {
  position: relative;
  text-align: center;
}

.service-new .serv.online .comp-group .comp-item .comp-img {
  display: block;
  width: 80px;
  height: 80px;
}

.service-new .serv.online .comp-group .comp-item .comp-img img {
  width: 100%;
  height: 100%;
}

.service-new .serv.online .comp-group .comp-item .comp-img:hover img {
  position: absolute;
  width: 90px;
  height: 90px;
  left: -5px;
  top: -7px;
}

.service-new .serv.online .comp-group .comp-item .comp-name {
  font-size: 20px;
  margin-top: 10px;
}

.service-new .serv.img .picture {
  content: url("/img/cms/myservice.png");
  width: 579px;
}

.service-new .serv.service {
  padding-right: 50px;
}

.service-new .serv.service .item:first-child {
  margin-bottom: 200px;
}

.service-new .serv.service .serv-button {
  font-size: 22px;
  line-height: 24px;
  font-weight: 600;
  color: #000;
  text-decoration: unset;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 182px;
  height: 53px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 100px;
  margin-left: -10px;
  transition: 0.2s;
}

.service-new .serv.service .serv-button:active {
  opacity: 0.7;
}

.index-menu .vcb-vmall {
  position: relative;
  width: 134px;
  height: 31px;
  background: #ff9900;
  border-radius: 6px;
  color: #fff;
  font-size: 16px;
  line-height: 18px;
  font-weight: 600;
  padding: unset;
  padding-top: 6px;
  padding-right: 13px;
}

.index-menu .vcb-vmall:hover {
  background: #f49200;
}

.index-menu .vcb-vmall img {
  position: absolute;
  right: 13px;
  top: 6px;
  width: 18px;
}

.count-down {
  margin-left: -60px;
  scale: 0.6;
}

.count-down .flipdown {
  width: auto;
  height: auto;
}

.count-down .rotor-group-heading {
  display: none;
}

.flipdown.flipdown__theme-dark {
  font-family: "Inter", sans-serif !important;
}

.flipdown .rotor {
  font-size: 5rem !important;
  font-weight: 300 !important;
  border-radius: 10px !important;
  border-radius: 10px !important;
  margin: 0px 3px 0px 0px !important;
}

.flipdown.flipdown__theme-dark .rotor,
.flipdown.flipdown__theme-dark .rotor-top,
.flipdown.flipdown__theme-dark .rotor-leaf-front {
  color: #e0d7dd !important;
  background-color: #dc1205 !important;
}

.flipdown.flipdown__theme-dark .rotor-bottom,
.flipdown.flipdown__theme-dark .rotor-leaf-rear {
  color: #fff5fc !important;
  background-color: #f3372e !important;
}

.flipdown.flipdown__theme-dark
  .rotor-group:nth-child(n + 2):nth-child(-n + 3):before,
.flipdown.flipdown__theme-dark
  .rotor-group:nth-child(n + 2):nth-child(-n + 3):after {
  background-color: #f43329 !important;
}

.flipdown.flipdown__theme-dark .rotor:after {
  border: unset !important;
}

.flipdown .rotor:after {
  border-radius: 0px 0px 10px 10px !important;
}

.flipdown .rotor-leaf-front {
  border-radius: 10px 10px 0px 0px !important;
}

.flipdown .rotor-leaf-rear {
  border-radius: 0px 0px 10px 10px !important;
}

.flipdown .rotor-top {
  border-radius: 10px 10px 0px 0px !important;
}

.flipdown .rotor-bottom {
  border-radius: 0px 0px 10px 10px !important;
}

.flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):before,
.flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):after {
  left: 114px !important;
  width: 8px !important;
  height: 8px !important;
}

.flipdown .rotor-group {
  padding-right: 26px !important;
}

.flashsale-page .goods-content {
  position: relative;
}

.flashsale-page .goods-content .count-down {
  position: absolute;
  left: -91px;
  top: -114px;
  margin: unset;
  scale: 0.65;
}

.vmallpro-content .vmall-content .steps-price {
  background: #f9f9fa;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 20px;
}

.vmallpro-content .vmall-content .steps-price .steps-row {
  display: flex;
}

.vmallpro-content .vmall-content .steps-price .steps-row:first-child {
  margin-bottom: 15px;
}

.vmallpro-content .vmall-content .steps-price .steps-row .steps-item {
  font-family: "Inter", "Noto Sans Thai", sans-serif;
  width: 26.6%;
}

.vmallpro-content .vmall-content .steps-price .steps-row .steps-item.lab {
  width: 20%;
  font-size: 15px;
  font-weight: 600;
}

.vmallpro-content .vmall-content .steps-price .steps-row .steps-item .price {
  color: #ff7a00;
  font-size: 24px;
  line-height: 28px;
  font-weight: 600;
}

.vmallpro-content
  .vmall-content
  .steps-price
  .steps-row
  .steps-item
  .price-des {
  font-size: 13px;
  color: #8c8c8c;
  line-height: 16px;
  font-weight: 500;
}

.vmallpro-content .vmall-content .steps-price .steps-row .steps-item .qty {
  color: #646464;
  font-weight: 500;
}

.vmallpro-content .vmall-content .steps-price .warning-text {
  padding: 10px;
  border-radius: 10px;
  margin-top: 20px;
  font-size: 16px;
  line-height: 22px;
  color: #ff0000;
  background: #ffebe2;
  font-weight: 500;
  text-align: center;
}

.cat3paper {
  /* background: #f8f8f8; */
  background: #ffeed7;
  padding-top: 8px;
  padding-bottom: 8px;
  margin-top: -8px;
  margin-bottom: 8px;
  border-radius: 7px;
}

.scroll-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  padding: 0px;
  background-color: #ff9900;
  border: none;
  border-radius: 100%;
  display: none;
  color: #fff;
  font-size: 25px;
  line-height: 26px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  z-index: 1;
}

.vvic-warning {
  padding: 15px;
  background: #fff2e8;
  color: #df0000;
}

.vvic-warning .title {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 5px;
}

@keyframes newblink {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.top-content .new {
  background: red;
  border-radius: 50px;
  padding: 2px 4px;
  color: #fff;
  font-size: 10px;
  line-height: 12px;
  position: absolute;
  top: -2px;
  margin-left: 4px;
  animation: newblink ease 1.2s infinite;
}

.nav-left .new {
  background: red;
  border-radius: 50px;
  padding: 1px 4px;
  color: #fff;
  font-size: 10px;
  line-height: 12px;
  position: absolute;
  margin-left: 10px;
  margin-top: 2px;
  animation: newblink ease 1.2s infinite;
}

.hidden {
  display: none !important;
}

.flashsale-page .goods-content .goods-list .goods-item .goods-textbox .buynow {
  display: none;
}

.sortbox {
  font-size: 16px;
}

.sortbox input {
  height: 45px;
  width: 115px;
  border: 1px solid #d2d2d2;
  border-color: #d2d2d2;
  border-radius: 10px;
  padding: 0px 15px;
  outline: unset;
  transition: 0.15s;
}

.sortbox input:focus {
  border-color: #ff9900;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
    0 0 8px rgba(255, 153, 0, 0.6);
}

.sortbox input::placeholder {
  color: #b0b0b0;
  font-weight: 300;
}

.sortbox .btn {
  padding: 5px 20px;
  width: 78px;
  height: 45px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  border-radius: 10px;
  border: unset;
  color: #000;
  margin-left: 10px;
  font-size: 16px;
}

.howto-banner {
  position: relative;
  background: #636363;
  overflow: hidden;
}

.howto-banner .carousel-indicators {
  bottom: 175px;
}

.howto-banner .carousel-indicators li {
  background-color: #646464;
  border: unset;
  width: 13px;
  height: 13px;
  margin: 1px 2px;
}

.howto-banner .carousel-indicators .active {
  background-color: #ff9900;
  margin: 1px 2px;
}

.howto-banner .banner-content {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  height: 680px;
}

.howto-banner .banner-content .ad-group {
  position: relative;
  z-index: 1;
  padding-left: 160px;
  padding-top: 145px;
  color: #fff;
}

.howto-banner .banner-content .ad-group .title {
  font-size: 48px;
  line-height: 52px;
  font-weight: 700;
}

.howto-banner .banner-content .ad-group .button {
  padding-top: 23px;
  padding-bottom: 30px;
}

.howto-banner .banner-content .ad-group .readnow {
  height: 67px;
  width: 191px;
  background: #fff;
  color: #1a1d29;
  font-size: 32px;
  line-height: 34px;
  font-weight: 700;
  padding: unset;
  border: unset;
  outline: unset;
  border-radius: 4px;
  transition: 0.2s;
}

.howto-banner .banner-content .ad-group .readnow:hover {
  background: #ddd;
}

.howto-banner .banner-content .ad-group .readnow:active {
  background: #c8c9cb;
}

.howto-banner .banner-content .ad-group .description {
  font-size: 20px;
  line-height: 26px;
}

.howto-banner .banner-content .ad-group .description .storng {
  font-weight: 600;
  margin-bottom: 10px;
}

.howto-banner .banner-content .ad-group .description .des {
  color: #c8c9cb;
}

.howto-banner .banner-content .overlay {
  position: absolute;
  height: 523px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: linear-gradient(
    179.79deg,
    rgba(26, 29, 41, 0) 15.81%,
    rgba(26, 29, 41, 0.791667) 64.73%,
    #1a1d29 97.83%
  );
}

.howto-banner .banner-content.bg-1 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-1.png");
}

.howto-banner .banner-content.bg-2 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-2.png");
}

.howto-banner .banner-content.bg-3 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-3.png");
}

.howto-banner .banner-content.bg-4 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-4.png");
}

.howto-banner .banner-content.bg-5 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-5.png");
}

.howto-banner .banner-content.bg-6 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-6.png");
}

.howto-banner .banner-content.bg-7 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-7.png");
}

.howto-banner .banner-content.bg-8 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-8.png");
}

.howto-banner .banner-content.bg-9 {
  background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-9.png");
}

.howto-banner .card-slide {
  color: #fff;
  left: 235px;
  position: absolute;
  width: 100%;
  bottom: 20px;
}

.howto-banner .card-slide .cardbox {
  cursor: pointer;
  height: 126.5px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 5px;
  box-shadow: 0px 1px 7px rgba(189, 189, 189, 0.4);
}

.howto-banner .card-slide .cardbox.cover1 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-1.png");
}

.howto-banner .card-slide .cardbox.cover2 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-2.png");
}

.howto-banner .card-slide .cardbox.cover3 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-3.png");
}

.howto-banner .card-slide .cardbox.cover4 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-4.png");
}

.howto-banner .card-slide .cardbox.cover5 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-5.png");
}

.howto-banner .card-slide .cardbox.cover6 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-6.png");
}

.howto-banner .card-slide .cardbox.cover7 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-7.png");
}

.howto-banner .card-slide .cardbox.cover8 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-8.png");
}

.howto-banner .card-slide .cardbox.cover9 {
  background-image: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.2),
      rgba(0, 0, 0, 0.2)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 79%),
    url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-9.png");
}

.howto-banner .card-slide .owl-nav {
  position: absolute;
  top: 22%;
  left: -90px;
}

.howto-banner .card-slide .owl-nav button {
  padding: 0px 20px !important;
  opacity: 0.5;
}

.howto-banner .card-slide .owl-nav button:hover {
  opacity: 0.8;
}

.howto-banner .card-slide .owl-nav i {
  font-size: 80px;
  line-height: 55px;
}

.howto-banner .card-slide .owl-nav .owl-next {
  display: none;
}

.howto-banner .card-slide .cardbox .content {
  text-align: center;
  backdrop-filter: blur(1px);
  border-radius: 5px;
  height: 100%;
}

.howto-banner .card-slide .cardbox .content .title {
  font-size: 20px;
  font-weight: 600;
  line-height: 25px;
  padding-top: 27px;
  padding-bottom: 8px;
}

.howto-banner .card-slide .cardbox .content .action button {
  width: 60px;
  height: 25px;
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid #fff;
  border-radius: 5px;
  padding: unset;
  font-size: 14px;
  line-height: 16px;
  transition: 0.2s;
}

.howto-banner .card-slide .cardbox .content .action button:hover {
  background: #fff;
  color: #000;
  font-weight: 600;
}

.howto-section {
  background: #fafafa;
  padding: 10px 0px 80px 0px;
}

.howto-section .menuside-content {
  height: 670px;
  overflow: auto;
  background: #fff;
  border-radius: 7px;
  padding: 15px;
  font-size: 17px;
  font-weight: 500;
}

@media (min-width: 1024px) {
  .howto-section .menuside-content::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    border-radius: 10px;
  }

  .howto-section .menuside-content::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
  }

  .howto-section .menuside-content::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: #d9d9d9;
  }
}

.howto-section .menuside-content a {
  color: #000;
  text-decoration: none !important;
}

.howto-section .menuside-content .side-bar {
  padding: unset;
  margin: unset;
}

.menuside-content .menumain,
.menuside-content .mb-menumain,
.menuside-content .menusub {
  position: relative;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.menuside-content .menumain,
.menuside-content .mb-menumain {
  cursor: pointer;
  transition: all ease 0.2s;
}

.menuside-content .menumain .title,
.menuside-content .mb-menumain .title {
  padding: 15px;
  display: flex;
  align-items: center;
  border-radius: 10px 10px 0px 0px;
}

.menuside-content .menumain:hover,
.menuside-content .mb-menumain:hover {
  background: #efefef;
  border-radius: 10px;
}

.menuside-content .menumain .icon,
.menuside-content .mb-menumain .icon {
  width: 20px;
  margin-right: 20px;
  margin-left: 7px;
}

/* icon howto */
.menuside-content .menumain .icon.ic-1,
.menuside-content .mb-menumain .icon.ic-1 {
  content: url("/img/iconb-b.png");
}

.menuside-content .menumain .icon.ic-2,
.menuside-content .mb-menumain .icon.ic-2 {
  content: url("/img/iconvcb-b.png");
}

.menuside-content .menumain .icon.ic-3,
.menuside-content .mb-menumain .icon.ic-3 {
  content: url("/img/icone-b.png");
}

.menuside-content .menumain .icon.ic-4,
.menuside-content .mb-menumain .icon.ic-4 {
  content: url("/img/iconlcu-b.png");
}

.menuside-content .menumain .icon.ic-5,
.menuside-content .mb-menumain .icon.ic-5 {
  content: url("/img/iconlc-b.png");
}

.menuside-content .menumain .icon.ic-6,
.menuside-content .mb-menumain .icon.ic-6 {
  content: url("/img/iconmark-b.png");
}

.menuside-content .menumain .icon.ic-7,
.menuside-content .mb-menumain .icon.ic-7 {
  content: url("/img/icons-b.png");
}

.menuside-content .menumain .icon.ic-8,
.menuside-content .mb-menumain .icon.ic-8 {
  content: url("/img/iconmall-b.png");
}

.menuside-content .menumain .icon.ic-9,
.menuside-content .mb-menumain .icon.ic-9 {
  content: url("/img/iconc-b.png");
}

.menuside-content .menumain .icon.ic-10,
.menuside-content .mb-menumain .icon.ic-10 {
  content: url("/img/iconm-b.png");
}

.menuside-content .menumain .icon.ic-11,
.menuside-content .mb-menumain .icon.ic-11 {
  content: url("/img/iconbell-b.png");
}

.menuside-content .menumain .icon.ic-12,
.menuside-content .mb-menumain .icon.ic-12 {
  content: url("/img/iconp-b.png");
}

.menuside-content .menumain .icon.ic-13,
.menuside-content .mb-menumain .icon.ic-13 {
  content: url("/img/icont-b.png");
}

.menuside-content .menumain .icon.ic-14,
.menuside-content .mb-menumain .icon.ic-14 {
  content: url("/img/iconcal-b.png");
}

/* icon howto active */
.menuside-content .menumain.active .title .icon.ic-1,
.menuside-content .mb-menumain.active .title .icon.ic-1 {
  content: url("/img/iconb-w.png");
}

.menuside-content .menumain.active .title .icon.ic-7,
.menuside-content .mb-menumain.active .title .icon.ic-7 {
  content: url("/img/icons-w.png");
}

.menuside-content .menumain.active .title .icon.ic-8,
.menuside-content .mb-menumain.active .title .icon.ic-8 {
  content: url("/img/iconmall-w.png");
}

.menuside-content .menumain.active .title .icon.ic-9,
.menuside-content .mb-menumain.active .title .icon.ic-9 {
  content: url("/img/iconc-w.png");
}

.menuside-content .menumain.active .title .icon.ic-10,
.menuside-content .mb-menumain.active .title .icon.ic-10 {
  content: url("/img/iconm-w.png");
}

.menuside-content .menumain.active .title .icon.ic-12,
.menuside-content .mb-menumain.active .title .icon.ic-12 {
  content: url("/img/iconp-w.png");
}

.menuside-content .menumain.active .title .icon.ic-13,
.menuside-content .mb-menumain.active .title .icon.ic-13 {
  content: url("/img/icont-w.png");
}

.menuside-content .menumain.active .title,
.menuside-content .mb-menumain.active .title {
  background: #ff8f00;
  color: #fff;
}

.menuside-content .menumain .menusub,
.menuside-content .mb-menumain .menusub {
  display: none;
}

.menuside-content .menumain.active .menusub,
.menuside-content .mb-menumain.active .menusub {
  display: block;
}

.menuside-content .menumain .menusub a,
.menuside-content .mb-menumain .menusub a {
  padding: 15px 15px 15px 27px;
  display: flex;
  align-items: center;
  background: #e6e6e6;
}

.menuside-content .menumain .menusub i,
.menuside-content .mb-menumain .menusub i {
  margin-right: 10px;
}

.menuside-content .menumain.active .menusub .subitem,
.menuside-content .mb-menumain.active .menusub .subitem {
  transition: all ease 0.2s;
}

.menuside-content .menumain.active .menusub .subitem:hover,
.menuside-content .mb-menumain.active .menusub .subitem:hover {
  background: #dbdbdb;
}

.menuside-content .menumain.active .menusub .subitem.active,
.menuside-content .mb-menumain.active .menusub .subitem.active {
  background: #d1d1d1;
}

.menuside-content .menumain .menusub li:last-child a,
.menuside-content .mb-menumain .menusub li:last-child a {
  border-radius: 0px 0px 10px 10px;
}

.howto-section .howto-lp {
  display: none;
}

.howto-section .howto-lp img {
  width: 100%;
  margin-bottom: 30px;
}

.howto-section .howto-lp.active {
  display: block;
}

.menuside-stick {
  position: sticky;
  top: 173px;
}

.menuside-stick.promo {
  position: sticky;
  top: 248px;
}

.short-howto {
  background: #fff;
  border-radius: 10px;
  padding: 10px;
}

.short-howto .short-item {
  display: flex;
  align-items: center;
  cursor: pointer;
  border-radius: 10px;
  transition: all ease 0.15s;
}

.short-howto .short-item:hover {
  background: #f2f2f2;
}

.short-howto .short-item img {
  width: 170px;
}

.short-howto .short-item .title {
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
  padding: 0px 15px;
}

.short-howto .short-item:not(:last-child) {
  margin-bottom: 20px;
}

.mb-cmenu {
  display: none;
}

.mobile-control {
  color: #000;
  padding: 35px 0px;
}

.mobile-control .section-head {
  font-size: 22px;
  font-weight: 600;
  text-align: center;
  margin-top: -32px;
  margin-bottom: 15px;
}

.mobile-control .section-des {
  color: #9f9f9f;
  font-size: 14px;
  text-align: center;
  margin-bottom: 40px;
}

.mobile-control .mb-action {
  color: #9f9f9f;
  font-size: 14px;
  text-align: center;
  margin-bottom: 15px;
}

.mobile-control .mb-action .resend-otp {
  color: #ff8f00;
  text-decoration: unset;
  margin-top: 3px;
}

.mobile-control .mb-action .resend-otp.disabled {
  color: #9f9f9f;
}

.mobile-control .section-des .sec-hl {
  text-align: center;
  color: #ff8f00;
  font-weight: 500;
  font-size: 15px;
  margin-top: 5px;
}

.profile-info {
  text-align: center;
  margin-bottom: 40px;
}

.profile-info .profile-img {
  margin-bottom: 15px;
  display: flex;
  justify-content: center;
}

.profile-info .profile-img img {
  width: 128px;
  height: 128px;
  border-radius: 100%;
}

.profile-info .profile-img .img-avatar {
  border: 2px solid #d9d9d9;
}

.profile-info .profile-img .img-edit {
  position: absolute;
  bottom: 0px;
  right: 2px;
  width: 28px;
  height: 28px;
  transition: all ease 0.2s;
  cursor: pointer;
}

.profile-info .profile-img .img-edit:hover {
  opacity: 0.7;
}

.profile-info .pf-code {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 5px;
}

.profile-info .pf-text:not(:last-child) {
  margin-bottom: 5px;
}

.profile-menu {
  padding: 0px 30px;
}

.profile-menu ul {
  padding: unset;
}

.profile-menu ul > li {
  list-style: none;
  display: flex;
  align-items: center;
}

.profile-menu ul > li:not(:last-child) {
  margin-bottom: 15px;
}

.profile-menu .ic {
  width: 40px;
  margin-right: 15px;
}

.profile-menu ul > li a {
  font-size: 16px;
  color: #000;
  text-decoration: unset;
  width: 100%;
  transition: 0.15s;
}

.profile-menu ul > li a:hover {
  color: #ff8f00;
}

.profile-menu ul > li a i {
  float: right;
  color: #ff8f00;
  font-size: 24px;
  line-height: 18px;
  margin-right: 8px;
  transition: 0.15s;
}

.profile-menu ul > li a:hover i {
  margin-right: 0px;
}

.pf-wrap {
  position: relative;
  width: max-content;
}

.mobile-control .mb-form {
  padding: 0px 40px;
}

.mobile-control .mb-form label {
  font-size: 16px;
  font-weight: 500;
}

.mobile-control .mb-form .form-control {
  border-radius: 100px;
  border: 1px solid #ddd;
  height: 48px;
  padding: 0px 20px;
  outline: unset;
  box-shadow: unset;
}

.mobile-control .mb-form .form-control:focus {
  border-color: #ff8f00;
}

.mobile-control .mb-form .form-control.failed {
  border-color: #ff001f;
  color: #ff001f;
}

.mobile-control .mb-form .form-control:read-only {
  background: #fff;
}

.mobile-control .mb-form textarea {
  height: auto !important;
  padding: 15px 20px !important;
  border-radius: 20px !important;
}

.mobile-control .wm-text {
  text-align: center;
  font-size: 16px;
  color: #ff8f00;
  margin-top: 30px;
}

.mobile-control .mb-password {
  padding: 0px 30px;
}

.mobile-control .mb-password label {
  font-size: 15px;
}

.mobile-control .mb-password .form-group {
  margin-bottom: 20px;
}

.mobile-control .mb-password .form-control {
  height: 45px;
  font-size: 16px;
  color: #ff8f00;
}

.mobile-control .mb-password .password-group {
  position: relative;
}

.mobile-control .mb-password .password-group .password-eye {
  position: absolute;
  right: 18px;
  top: 39px;
  color: #c2c2c2;
  font-size: 17px;
}

.mb-form .btn-mbcon {
  width: 275px;
  padding: unset;
  height: 48px;
  border-radius: 50px;
  background-color: #ff8f00;
  color: #fff;
  font-size: 18px;
  line-height: 22px;
  font-weight: 600;
  align-content: center;
  place-content: center;
  transition: all ease 0.1s;
}

.mb-form .btn-mbcon i {
  margin-right: 5px;
}

.mb-form .btn-mbcon:active {
  background-color: #eb8400;
}

.mb-form .btn-mbcon:disabled {
  background-color: #979797;
}

.mobile-control .input-otp {
  display: flex;
  justify-content: space-evenly;
  margin-bottom: 15px;
}

.mobile-control .input-otp input {
  width: 50px;
  height: 54px;
  font-size: 22px;
  border-radius: 20px;
  text-align: center;
  padding: unset;
  box-shadow: unset;
  outline: unset;
  border: 1px solid #ddd;
}

.mobile-control .input-otp input:focus {
  border-color: #ff8f00;
}

.mobile-control .input-otp input:disabled {
  color: #cdcdcd;
}

.mobile-control .input-otp input.failed {
  border-color: #ff001f;
  color: #ff001f;
}

.mobile-control .otp-timer {
  text-align: center;
  font-size: 15px;
  color: #818181;
  margin-bottom: 50px;
}

.mb-form .success {
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 40px;
}

.mb-form .success .des {
  font-size: 12px;
  font-weight: 400;
  color: #818181;
}

.mb-form .success-img {
  width: 106px;
  margin: 60px 0px;
}

.mb-address {
  margin-left: -10px;
}

.mb-address .bt-card {
  display: block;
  margin-left: 14%;
  margin-bottom: 20px;
  height: 65px;
  box-shadow: -1px 1px 5.6px rgba(0, 0, 0, 0.25);
  border-radius: 13px;
  text-align: center;
  align-content: center;
  place-content: center;
  color: #000;
  font-weight: 500;
  text-decoration: unset;
  transition: all ease 0.15s;
}

.mb-address .bt-card:active {
  box-shadow: unset;
  background: #f2f2f2;
}

.mb-address .address-list .ad-items {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.mb-address .address-list .ad-items .ad-round {
  width: 14%;
  text-align: center;
}

.mb-address .address-list .ad-items .circle {
  display: flex;
  justify-content: center;
}

.mb-address .address-list .ad-items .status {
  color: #ff8f00;
  font-size: 10px;
  font-weight: 600;
  margin-top: 6px;
}

.mb-address .address-list .ad-items .ad-card {
  position: relative;
  width: 86%;
  box-shadow: -1px 1px 5.6px rgba(0, 0, 0, 0.25);
  font-size: 12px;
  border-radius: 13px;
  padding: 7px 10px;
}

.ad-card .card-detail {
  margin-bottom: 3px;
}

.ad-card .card-detail .lab {
  color: #7a7a7a;
}

.ad-card .card-detail .lab i {
  margin-right: 6px;
  font-size: 10px;
}

.ad-card .card-detail .ad-box {
  margin-top: 3px;
  padding-left: 10px;
}

.ad-card .card-action {
  position: absolute;
  right: 10px;
  top: 7px;
}

.ad-card .card-action .ad-icon {
  display: inline-block;
  margin-left: 4px;
  transition: all ease 0.15s;
}

.ad-card .card-action .ad-icon img {
  width: 21px;
  height: 21px;
}

.ad-card .card-action .ad-icon:hover {
  opacity: 0.7;
}

.ad-round .radio-wrapper .no-coupon {
  font-size: 14px;
  font-weight: 600;
  color: #aeaeae;
}

.ad-round .radio-wrapper .round {
  position: relative;
}

.ad-round .radio-wrapper .round.first {
  height: unset;
}

.ad-round .radio-wrapper .round label {
  background-color: #fff;
  border: 1px solid #ff8f00;
  border-radius: 50%;
  cursor: pointer;
  height: 18px;
  width: 18px;
  margin: unset;
  display: block;
}

.ad-round .radio-wrapper .round label:after {
  content: "";
  border-radius: 50%;
  width: 14px;
  height: 14px;
  top: 2px;
  left: 2px;
  opacity: 0;
  background: #ff8f00;
  position: absolute;
}

.ad-round .radio-wrapper .round input[type="radio"] {
  visibility: hidden;
  display: none;
  opacity: 0;
}

.ad-round
  .radio-wrapper
  .round
  input[type="radio"]:checked
  + label
  .coupon-name {
  color: #ff8f00;
}

.ad-round .radio-wrapper .round input[type="radio"]:checked + label:after {
  opacity: 1;
}

.btn-block {
  width: 100% !important;
}

.mobile-control .warp-center {
  display: flex;
  justify-content: center;
}

.mobile-control .wallet-card {
  width: 343px;
  height: 213px;
  background: linear-gradient(
      291.26deg,
      rgba(255, 255, 255, 0.17) 5.64%,
      #e1e1e1 204.86%
    ),
    #efefef;
  box-shadow: -10px -10px 30px rgba(255, 255, 255, 0.37),
    10px 2px 27.4px rgba(207, 190, 190, 0.6), inset -2px -2px 1px #d1bcbc,
    inset 2px 2px 2px #ffffff;
  border-radius: 30px;
  padding: 10px;
}

.wallet-card .card-content {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 25px;
  padding: 2px 7px 0px 7px;
}

.wallet-card .corner-wave {
  position: absolute;
  width: 200px;
  height: 210px;
  right: -105px;
  top: -115px;
  background: radial-gradient(circle, #ffd600, #f6461f);
  border-radius: 45%;
  animation: waving 15s linear infinite;
}

@keyframes waving {
  100% {
    transform: rotate(360deg);
  }
}

.wallet-card .card-content .corner-icon {
  position: absolute;
  right: 16px;
  top: 20px;
  width: 50px;
}

.wallet-card .card-content .rank {
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  background-clip: text;
  text-shadow: -2px -2px 2px #fff, 1px 1px 2.8px #a0a0a0;
}

.wallet-card .card-content .rank .lab {
  margin-right: 10px;
}

.wallet-card .card-content .rank .rankname img {
  width: 20px;
  margin-right: 2px;
  margin-bottom: 4px;
}

.wallet-card .card-content .balance {
  position: relative;
  z-index: 1;
  text-align: center;
  margin-top: 33px;
  margin-bottom: 34px;
}

.wallet-card .card-content .balance .lab {
  font-size: 12px;
  color: #979797;
  margin-bottom: 3px;
}

.wallet-card .card-content .balance .price {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 34px;
  color: #000;
  text-shadow: -2px -2px 2px #ffffff, 2px 3px 2.8px #bdbdbd;
}

.wallet-card .card-content .balance .price > span {
  font-size: 21px;
  margin-right: 10px;
}

.wallet-card .card-content .action {
  text-align: center;
}

.wallet-card .card-content .action .btn {
  padding: unset;
  width: 91px;
  height: 33px;
  background: #fff;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  border-radius: 20px;
  color: #000;
  font-size: 18px;
  font-weight: 600;
  align-content: center;
  transition: all ease 0.15s;
}

.wallet-card .card-content .action .btn:active {
  background: #e2e2e2;
  box-shadow: unset;
}

.wallet-card .card-content .action .rf {
  background: #ff8f00;
  color: #fff;
  margin-right: 15px;
}

.wallet-card .card-content .action .rf:active {
  background: #e58100;
}

.mobile-control .wl-history {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mobile-control .wl-history .lab {
  font-size: 13px;
  font-weight: 500;
}

.mobile-control .wl-history .point {
  font-size: 21px;
  font-weight: 600;
  color: #ff8f00;
}

.mobile-control .wl-history .point > span {
  font-size: 12px;
  font-weight: 400;
  color: #b9b9b9;
}

.mobile-control .wallet-content {
  padding: 0px 15px;
  margin-top: 30px;
}

.mobile-control .wl-bar {
  margin-top: 15px;
  margin-bottom: 70px;
  display: flex;
  justify-content: center;
}

.mobile-control .wl-bar .bar {
  position: relative;
  background: #989898;
  width: 95%;
  height: 4.6px;
  border-radius: 30px;
}

.mobile-control .wl-bar .bar .active-bar {
  position: absolute;
  max-width: 100%;
  height: 4.6px;
  background: #ff8f00;
}

.mobile-control .wl-bar .bar .bullet {
  position: absolute;
  width: 100%;
  top: -3px;
  left: 0px;
  display: flex;
  justify-content: space-between;
  z-index: 1;
}

.mobile-control .wl-bar .bar .bullet > span {
  display: block;
  width: 11px;
  height: 11px;
  border-radius: 30px;
  background: #989898;
}

.mobile-control .wl-bar .bar .bullet > span.active {
  background: #ff8f00;
}

.mobile-control .wl-bar .bar .level-text {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  line-height: 11px;
  color: #6d6d6d;
  margin: 17px -15px 0px -15px;
}

.mobile-control .wl-bar .bar .level-text .txt {
  text-align: center;
}

.mobile-control .wl-basetab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f2f2f2;
  padding: 15px 8px 15px 15px;
  border-radius: 13px;
  margin-bottom: 15px;
}

.mobile-control .wl-basetab .lab {
  font-size: 13px;
  font-weight: 500;
}

.mobile-control .wl-basetab .point {
  font-size: 18px;
  font-weight: 500;
}

.mobile-control .wl-basetab .act > .btn {
  background-color: #ff8f00;
  color: #fff;
  padding: unset;
  border-radius: 20px;
  height: 33px;
  width: 95px;
  font-size: 13px;
  font-weight: 600;
  align-content: center;
}

.mobile-control .wl-tabslide {
  padding: 0px 25px;
  margin: 0px -25px;
  white-space: nowrap;
  overflow: auto;
  scrollbar-width: none;
  margin-bottom: 20px;
}

.mobile-control .wl-tabslide.no-slide {
  padding: unset;
  margin: 0px 0px 20px 0px;
}

.mobile-control .wl-tabslide a {
  cursor: pointer;
  display: inline-block;
  background-color: #f2f2f2;
  border-radius: 10px;
  color: #000;
  font-size: 12px;
  height: 30px;
  padding: 0px 15px;
  align-content: center;
  text-decoration: unset;
}

.mobile-control .wl-tabslide a.active,
.mobile-control .wl-tabslide a:active {
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  background-color: #ff8f00;
}

.mobile-control .wl-tabslide a:not(:last-child) {
  margin-right: 12px;
}

.mobile-control .wallet-content .wl-detail {
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 15px;
}

.mobile-control .wallet-content .wl-detail .title {
  margin-bottom: 5px;
}

.mobile-control .wallet-content .wl-detail ul {
  padding: 0px 0px 0px 18px;
  margin: unset;
}

.mobile-control .wallet-content .wl-textnav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.mobile-control .wallet-content .wl-textnav .title {
  font-size: 15px;
  font-weight: 600;
}

.mobile-control .wallet-content .wl-textnav .drop label {
  font-size: 12px;
  font-weight: 400;
  color: #a7a7a7;
  margin-right: 5px;
}

.mobile-control .wallet-content .wl-textnav .drop .dropnav {
  font-size: 10px;
  height: 25px;
  color: #a7a7a7;
  background-color: transparent;
  border: 1px solid #979797;
  border-radius: 5px;
  padding: 0px 5px;
  outline: unset;
}

.mobile-control .wallet-content .wl-content {
  position: relative;
  display: none;
}

.mobile-control .wallet-content .wl-content.active {
  display: block;
}

.mobile-control .wallet-content .wl-content > .input-group {
  position: absolute;
  right: 0px;
  top: -5px;
  width: 182px;
}

.mobile-control .input-search {
  font-size: 11px;
  padding: 0px 10px;
  border: 1px solid #dfdfdf;
  border-radius: 50px 0px 0px 50px !important;
  height: 26px;
  box-shadow: unset;
}

.mobile-control .input-search::placeholder {
  color: #b9b9b9;
  font-weight: 300;
}

.mobile-control .btn-search {
  height: 26px;
  padding: 0px 12px 0px 9px;
  font-size: 10px;
  line-height: 12px;
  color: #fff;
  background: #9a9a9a;
  border-radius: 0px 50px 50px 0px;
  z-index: 1 !important;
}

.mobile-control .wl-content .wl-listing {
  margin-bottom: 20px;
}

.mobile-control .wl-content .wl-listing .date {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 5px;
}

.wl-listing .wallet-box {
  position: relative;
  display: flex;
  padding: 15px 0px;
  border-bottom: 1px solid #dfdfdf;
}

.wl-listing .wallet-box .imgs {
  width: 17%;
}

.wl-listing .wallet-box .imgs img {
  height: 25px;
}

.wl-listing .wallet-box .title {
  font-size: 14px;
  line-height: 16px;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  margin-bottom: 2px;
}

.wl-listing .wallet-box .title .price {
  font-weight: 600;
}

.wl-listing .wallet-box .title .price.red {
  color: #ff001f;
}

.wl-listing .wallet-box .title .price.green {
  color: #08c404;
}

.wl-listing .wallet-box .created {
  font-size: 12px;
  display: flex;
  justify-content: space-between;
}

.wl-listing .wallet-box .created > b {
  font-weight: 600;
}

.wl-listing .wallet-box .badge {
  height: 15px;
  font-size: 10px;
  font-weight: 500;
  align-content: center;
  padding: 0px 8px;
}

.wl-listing .wallet-box .badge.bg-success {
  background-color: #18af30;
}

.wl-listing .wallet-box .badge.bg-warning {
  background-color: #ffb400;
}

.wl-listing .wallet-box .badge.bg-danger {
  background-color: #ff001f;
}

.wl-listing .wallet-box .detail {
  font-size: 10px;
}

.wl-listing .wallet-box .imgs .img-warp {
  width: 46px;
  height: 50px;
  background-color: #f2f2f2;
  border-radius: 14px;
  text-align: center;
  align-content: center;
}

.wl-listing .wallet-box .boxs {
  width: 83%;
  align-content: center;
}

.mobile-control .vcb-paging > ul {
  margin: 0px -15px;
}

.mobile-control .vcb-paging > ul > li {
  margin-bottom: 12px;
}

.mobile-control .vcb-paging > ul > li > a {
  margin-right: unset !important;
  padding: 4px 9px;
  border-radius: 10px;
}

.mobile-control .vcb-paging > ul > li:not(:last-child) {
  margin-right: 7px;
}

.mobile-control .vcb-paging .paging-go {
  font-weight: 500;
  color: #ff8f00;
  margin-top: 5px;
}

.mobile-control .vcb-paging .paging-go input {
  padding: unset;
  box-shadow: unset;
  outline: unset;
  height: 23px;
  width: 42px;
  margin-left: 10px;
}

.mobile-control .vcb-paging .paging-go input::placeholder {
  font-weight: 300;
  color: #979797;
}

.mobile-control .vcb-paging .paging-go input:focus {
  border-color: #ff8f00;
}

.mobile-control .daterange {
  position: absolute;
  right: 0px;
  top: -5px;
  width: auto;
  display: flex;
  align-items: center;
}

.mobile-control .daterange span {
  font-size: 10px;
  margin: 0px 6px;
  color: #b9b9b9;
}

.mobile-control .daterange .form-control {
  font-size: 10px;
  padding: 0px 10px;
  border: 1px solid #dfdfdf;
  border-radius: 50px;
  height: 26px;
  box-shadow: unset;
}

.mobile-control .daterange .form-control::placeholder {
  color: #b9b9b9;
  font-weight: 300;
}

.cp-couponcard .coupon-detail ul .ov-hidden {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.warning-lab {
  text-align: center;
  color: red;
  font-size: 22px;
  line-height: 28px;
  margin-top: 20px;
}

.mobile-control .topform {
  padding: 0px 20px;
}

.mobile-control .topform .row {
  margin: unset;
}

.mobile-control .topform .wrap {
  padding: unset;
}

.mobile-control .topform .form-control {
  font-size: 11px;
  font-family: "Noto Sans Thai", sans-serif;
  padding: 0px 15px;
  border: 1px solid #dfdfdf;
  border-radius: 50px;
  height: 28px;
  box-shadow: unset;
}

.mobile-control .topform .form-control:focus {
  border-color: #ff8f00;
}

.mobile-control .topform .form-control::placeholder {
  color: #b9b9b9 !important;
  font-weight: 300 !important;
}

.mobile-control .topform .btn-search {
  height: 28px;
}

.mobile-control .topform .form-group {
  margin-bottom: 13px;
}

.mobile-control .topform .btn-vcanbuy {
  font-size: 12px;
  height: 28px;
  border-radius: 50px;
  padding: unset;
}

.mobile-control .order-card {
  box-shadow: -1px 1px 5.6px rgba(0, 0, 0, 0.25);
  border-radius: 13px;
  padding: 15px 20px;
  margin-bottom: 17px;
}

.mobile-control .order-card .title {
  display: flex;
  justify-content: space-between;
  align-items: end;
  font-weight: 600;
  margin-bottom: 3px;
}

.mobile-control .order-card .title .docno {
  font-size: 12px;
}

.mobile-control .order-card .title .status {
  font-size: 13px;
}

.mobile-control .order-card .title .status.success {
  color: #08c404;
}

.mobile-control .order-card .title .status.danger {
  color: #ff001f;
}

.mobile-control .order-card .title .status.warning {
  color: #ff8f00;
}

.mobile-control .order-card .title .status.thin {
  color: #7a7a7a;
  font-weight: 400;
  font-size: 11px;
}

.mobile-control .order-card .info {
  font-size: 11px;
  color: #7a7a7a;
  display: flex;
  justify-content: space-between;
  align-items: end;
}

.mobile-control .order-card .info .prolab {
  color: #ff8f00;
  font-size: 10px;
  font-weight: 700;
  height: 16px;
  padding: 0px 10px;
  background-color: #ffdabf;
  border-radius: 50px;
  align-content: center;
}

.mobile-control .order-card .listing {
  border-bottom: 1px solid #c6c6c6;
}

.mobile-control .order-card .detail {
  display: flex;
  flex-wrap: wrap;
  padding: 15px 0px;
}

.mobile-control .order-card .detail .img {
  width: 30%;
}

.mobile-control .order-card .detail .img img {
  width: 80px;
  border-radius: 12px;
  aspect-ratio: 1 / 1;
}

.mobile-control .order-card .detail .des {
  position: relative;
  width: 70%;
  font-size: 10px;
}

.mobile-control .order-card .detail .des .order-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mobile-control .order-card .detail .des .short {
  font-size: 9px;
  color: #a4a4a4;
  margin-top: 3px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mobile-control .order-card .detail .des .quantity {
  position: absolute !important;
  bottom: 0px;
  left: 0px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}

.mobile-control .order-card .detail .des .lab .price {
  font-family: "Inter";
}

.mobile-control .order-card .detail .des .lab .price:not(:last-child) {
  margin-right: 25px;
}

.mobile-control .order-card .result {
  text-align: right;
  margin-top: 13px;
}

.mobile-control .order-card .result .total {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 13px;
}

.mobile-control .order-card .result .total > span {
  font-family: "Inter";
  margin-left: 10px;
  color: #ff8f00;
}

.mobile-control .order-card .result .total .price > s {
  font-weight: 400;
  color: #a4a4a4;
  margin-right: 10px;
}

.mobile-control .order-card .result .action .btn {
  padding: unset;
  border-radius: 10px;
  height: 29px;
  min-width: 83px;
  font-size: 12px;
  font-weight: 500;
  align-content: center;
  transition: all ease 0.13s;
}

.mobile-control .order-card .result .action .btn:not(:last-child) {
  margin-right: 7px;
}

.btn-payment {
  background-color: #ff001f !important;
  border-color: #ff001f !important;
  color: #fff !important;
}

.btn-payment:hover {
  background-color: #e3001c !important;
  border-color: #e3001c !important;
  color: #fff !important;
}

.btn-payment:active,
.btn-payment:focus {
  background-color: #cd0019 !important;
  border-color: #cd0019 !important;
  color: #fff !important;
}

.mobile-control .order-card.m-transfer .detail img {
  width: 60px;
  aspect-ratio: unset;
}

.mobile-control .order-card.m-transfer .detail .des .quantity {
  top: 50%;
  transform: translateY(-50%);
  bottom: unset;
  margin: unset !important;
}

.mobile-control .order-card.m-forwarder {
  padding: 15px 17px;
}

.mobile-control .order-card.m-forwarder .detail .des {
  width: 75%;
  font-size: 12px;
}

.mobile-control .order-card.m-forwarder .detail .img {
  align-content: center;
  width: 25%;
}

.mobile-control .order-card.m-forwarder .detail .img > img {
  width: 65px;
  border-radius: unset;
  aspect-ratio: unset;
}

.mobile-control .order-card.m-forwarder .detail .des .lab {
  display: flex;
  justify-content: space-between;
}

.mobile-control .order-card.m-forwarder .listing {
  border: unset;
}

.order-card.m-forwarder .detail .des .lab .view-status {
  font-size: 13px;
  font-weight: 600;
  color: #00c2ff;
}

.order-card.m-forwarder .detail .des .lab i {
  font-size: 16px;
  line-height: 16px;
}

.order-card.m-forwarder .detail .des .lab i.success {
  color: #4fb800;
}

.order-card.m-forwarder .detail .des .lab i.danger {
  color: #ed0018;
}

.m-forwarder .detail .des .lab.stats .txt {
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}

.m-forwarder .detail .des .lab.stats .txt.warning {
  color: #ff8f00;
}

.m-forwarder .detail .des .lab.stats .txt.danger {
  color: #ff001f;
}

.m-forwarder .detail .des .lab.stats .txt.success {
  color: #08c404;
}

.mobile-control .order-card {
  padding: 12px 15px;
}

.mobile-control .order-card.detail {
  padding-bottom: 17px;
}

.mobile-control .order-card.detail .top-prolab {
  display: inline-block;
  color: #ff8f00;
  font-size: 12px;
  font-weight: 700;
  height: 18.8px;
  padding: 0px 18px;
  background-color: #ffdabf;
  border-radius: 50px;
  align-content: center;
  margin-bottom: 10px;
}

.mobile-control .order-card.detail .top-group {
  padding-bottom: 13px;
  border-bottom: 1px solid #c6c6c6;
  margin-bottom: 13px;
}

.mobile-control .order-card.detail .title .docno {
  font-size: 14px;
}

.mobile-control .order-card.detail .title .status {
  font-size: 14px;
}

.mobile-control .order-card.detail .mini-box {
  border-bottom: 1px solid;
  border-color: #c6c6c6;
  margin-bottom: 13px;
  padding-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}

.order-card.detail .mini-box .md-item {
  width: 33.3%;
  justify-items: center;
  display: grid;
}

.order-card.detail .mini-box .md-item:not(:last-child) {
  border-right: 1px solid #dedede;
}

.order-card.detail .mini-box .md-item .md-title {
  text-align: center;
  margin-bottom: 5px;
  font-size: 12px;
  color: #7a7a7a;
}

.order-card.detail .mini-box .md-item .md-card {
  width: 80%;
  height: 60px;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.23);
  border-radius: 8px;
  text-align: center;
  align-content: center;
}

.order-card.detail .mini-box .md-item .md-card b {
  font-weight: 600;
}

.order-card.detail .mini-box .md-item .md-card .icon {
  height: 30px;
  margin-top: 5px;
  margin-bottom: 3px;
}

.order-card.detail .mini-box .md-item .md-card .image {
  height: 47px;
}

.order-card.detail .mini-box .md-item .md-card .md-detail {
  font-size: 10px;
  padding: 0px 5px;
}

.order-card .md-content {
  width: 100%;
}

.order-card.detail .md-content {
  padding: 0px 7px;
}

.order-card .md-content .top-docno {
  font-size: 14px;
  color: #7a7a7a;
  margin-bottom: 13px;
  position: relative;
}

.order-card .md-content .top-docno .top-right {
  position: absolute;
  right: 0px;
  top: 0px;
}

.order-card .md-content .top-docno b {
  font-family: "Inter";
  font-size: 13px;
  font-weight: 600;
  color: #000;
}

.order-card .md-content .top-docno .btn {
  font-weight: 600;
  padding: 0px 10px;
  font-size: 10px;
  line-height: 12px;
  border-radius: 30px;
  height: 20px;
  color: #000;
}

.order-card .md-content .details-list {
  padding: unset;
  margin: unset;
}

.order-card .md-content .details-list > li {
  list-style: none;
  display: flex;
  justify-content: space-between;
  font-size: 14px;
}

.order-card .md-content .details-list > li:not(:last-child) {
  margin-bottom: 4px;
}

.md-content .details-list > li .lab {
  color: #7a7a7a;
}

.md-content .details-list > li .lab .name {
  margin-left: 10px;
  color: #000;
}

.md-content .details-list > li .money .cur:last-child {
  margin-left: 30px;
}

.md-content .details-list > li .money .hl {
  color: #ff8f00;
  margin-left: 5px;
}

.md-content .details-list > li .money .free {
  color: #ff001f;
  font-weight: 600;
}

.md-content .details-list > li .remark {
  max-width: 60%;
  text-align: right;
}

.order-card.detail .md-content .result {
  margin-top: 9px;
}

.order-card.detail .md-content .result .total {
  display: flex;
  justify-content: space-between;
  align-items: end;
  font-size: 20px;
  margin-bottom: 10px;
}

.order-card.detail .md-content .result .total > span {
  font-size: 18px;
  color: #ff001f;
}

.order-card.detail .md-content .result .total.paid,
.order-card.detail .md-content .result .total.paid > span {
  color: #08c404 !important;
}

.order-card.detail .md-content .result .btn {
  padding: unset;
  align-content: center;
  height: 30px;
  width: 81px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 10px;
  background: #f5f5f5;
  color: #000;
}

.order-card.detail .md-content .result .btn-payment {
  font-size: 15px;
  margin-right: 6px;
  margin-left: 6px;
}

.mobile-control .order-card .address-list {
  padding: unset;
  margin: unset;
}

.mobile-control .order-card .address-list > li {
  list-style: none;
}

.mobile-control .order-card .address-list > li:not(:last-child) {
  margin-bottom: 8px;
}

.order-card .address-list > li .lab {
  color: #7a7a7a;
  margin-right: 10px;
}

.order-card .address-list > li .lab i {
  margin-right: 10px;
}

.order-card .address-list > li .locate {
  margin-top: 3px;
  margin-left: 17px;
}

.order-card.seller {
  padding: unset;
}

.order-card.seller .card-header {
  border-radius: 13px 13px 0px 0px;
  background-color: #e9e9e9;
  padding: 12px 15px;
  display: flex;
  align-items: center;
}

.order-card.seller .card-header img {
  height: 24px;
  margin-right: 7px;
}

.order-card.seller .card-body {
  padding: 0px 15px 15px 15px;
}

.order-card.seller .listing:last-child {
  border: unset;
}

.order-card.seller .detail {
  padding: 15px 0px 10px 0px;
}

.order-card.seller .detail .des .quantity {
  position: unset;
  margin-top: 8px;
}

.order-card.seller .detail .d-action {
  width: 100%;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
}

.order-card.seller .detail .d-action .lab {
  color: #ff8f00;
  margin-right: 7px;
}

.order-card.seller .detail .d-action .link {
  color: #00c2ff;
}

.order-card.seller .detail .d-action .status.success {
  color: #4fb800;
}

.order-card.seller .detail .d-action .status.warning {
  color: #ff8f00;
}

.order-card.seller .detail .d-action .status.danger {
  color: #ff001f;
}

.order-card.seller .detail .line-detail {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 7px;
  padding-top: 10px;
  border-top: 1px solid #c6c6c6;
  font-weight: 600;
}

.order-card.seller .detail .line-detail .line-drop {
  cursor: pointer;
  color: #ff8f00;
}

.order-card.seller .detail .line-detail .line-drop > i {
  color: #000;
  margin-left: 5px;
  font-size: 12px;
}

.order-card.seller .detail .line-detail .line-drop .rotated {
  transform: rotate(180deg);
}

.order-card.seller .md-content {
  padding: 7px 0px;
}

.order-card .details-list .icon {
  font-size: 16px;
  line-height: 18px;
}

.order-card .details-list .icon .success {
  color: #4fb800;
}

.order-card .details-list .icon .danger {
  color: #ff001f;
}

.order-card.seller .list-slide {
  display: none;
}

.mobile-control.order-details {
  padding-bottom: unset;
}

.mobile-control.order-details .refund-bottom {
  background-color: #f4f4f4;
  margin: 0px -10px;
  padding: 15px 25px 50px;
  border-radius: 20px 20px 0px 0px;
}

.refund-bottom .title {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}

.refund-bottom .rf-list {
  padding: unset;
  margin: unset;
}

.refund-bottom .rf-list .lab {
  color: #878787;
}

.refund-bottom .rf-list > li {
  list-style: none;
  display: flex;
  justify-content: space-between;
}

.refund-bottom .rf-list > li > b {
  color: #ff001f;
  font-weight: 500;
}

.refund-bottom .rf-list > li:not(:last-child) {
  margin-bottom: 3px;
}

.upload-content {
  text-align: center;
}

.upload-content .avatar-preview {
  width: 120px;
  aspect-ratio: 1 / 1;
  border-radius: 100%;
  outline: 2px solid #d9d9d9;
  margin-bottom: 15px;
}

.upload-content .upload-button {
  font-weight: 400;
  font-size: 14px;
  border: 1px solid #d9d9d9;
  padding: 0px 16px;
  border-radius: 50px;
  color: #4d4d4d;
  height: 35px;
  margin: unset;
  align-content: center;
  cursor: pointer;
  transition: all ease 0.15s;
}

.upload-content .upload-button:hover {
  color: #ff8f00;
  border-color: #ff8f00;
}

.upload-content #file-name {
  text-align: left;
  display: inline-block;
  width: auto;
  max-width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #a8a8a8;
  margin-left: 7px;
  font-size: 13px;
}

.upload-content .avatar-status {
  margin-bottom: 10px;
  font-size: 13px;
  line-height: 17px;
  color: #ff8f00;
}

.upload-content .avatar-status.danger {
  color: #ff001f;
}

.upload-content .avatar-status.success {
  color: #08c404;
}

.upload-content .input-content {
  display: flex;
  justify-content: center;
  align-items: center;
}

.menuside-content .title i {
  display: none;
}

.modal-recheck {
  font-family: "Noto Sans Thai", sans-serif;
  margin-top: 5%;
  width: 950px;
}

.modal-recheck .modal-content {
  background-color: transparent;
  box-shadow: unset;
  border: unset;
  border-radius: unset;
}

.modal-recheck .modal-content .modal-body {
  background-size: 100%;
  background-repeat: no-repeat;
  position: relative;
  padding: 40px 15px;
}

.modal-recheck .recheck-bg {
  width: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1;
}

.modal-recheck .form-content {
  text-align: center;
}

.modal-recheck .form-content .logo {
  width: 210px;
  margin-bottom: 15px;
}

.modal-recheck .form-content .title {
  font-size: 32px;
  font-weight: 700;
  color: #ff8f00;
  margin-bottom: 10px;
}

.modal-recheck .form-content .tales {
  font-size: 24px;
  font-weight: 700;
}

.modal-recheck .form-content .recheck-form {
  margin-top: 20px;
  padding: 0px 65px;
}

.modal-recheck .form-content .recheck-form .form-group {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
  justify-content: center;
}

.modal-recheck .form-content .recheck-form .ic {
  width: 40px;
  margin-right: 10px;
}

.modal-recheck .form-content .recheck-form .form-control {
  border-radius: 50px;
  box-shadow: unset;
  padding: 0px 20px;
  font-size: 16px;
  background-color: #fbfbfb;
}

.modal-recheck .form-content .recheck-form .form-control.datepicker {
  font-family: "Noto Sans Thai", sans-serif !important;
}

.modal-recheck .form-content .recheck-form .form-control:focus {
  border-color: #ff8f00;
}

.modal-recheck .form-content .recheck-form .form-control::placeholder {
  font-weight: 300;
  font-size: 17px;
  color: #ccc;
}

.modal-recheck .form-content .recheck-form .form-control:disabled,
.modal-recheck .form-content .recheck-form input:read-only {
  background-color: #ededed;
  cursor: not-allowed;
  color: #9f9f9f;
}

.modal-recheck .form-content .recheck-form .btn {
  padding: unset;
  height: 34px;
  font-size: 17px;
  font-weight: 400;
  border-radius: 50px;
}

.modal-recheck .form-content .recheck-form .btn-vcanbuy {
  box-shadow: 4px 4px 5px rgb(255 119 0 / 30%);
}

.modal-recheck .form-content .recheck-form .otp-content {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: 20px;
}

.modal-recheck .form-content .recheck-form .otp-content input,
.modal-recheck .form-content .recheck-form .otp-content .btn {
  width: 170px;
  margin: 0px 10px;
}

.modal-recheck .form-content .recheck-form .recheck-bottom .btn {
  width: 170px;
}

.modal-recheck .form-content .recheck-form .otp-content .otp-button.cd {
  opacity: 0.6;
}

.modal-recheck .form-content .recheck-form .form-warp {
  position: relative;
}

.modal-recheck .tel-alert {
  left: 7px;
  position: absolute;
  font-size: 12px;
  color: #23afff;
  margin-top: 3px;
  display: none;
}

.modal-recheck .otp-alert {
  left: 15px;
  white-space: nowrap;
  position: absolute;
  font-size: 12px;
  color: red;
  margin-top: 3px;
  display: none;
}

.modal-recheck .pop-close {
  position: absolute;
  width: 40px;
  right: -35px;
  top: -20px;
  cursor: pointer;
  transition: 0.15s;
}

.modal-recheck .wn-text {
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
  color: #ff6a00;
}

.modal-recheck .pop-close:hover {
  opacity: 0.6;
}

.page-box .new-pf {
  font-family: "Noto Sans Thai", sans-serif;
  padding: 15px 30px !important;
}

.page-box .new-pf .title {
  font-size: 24px;
  padding: 15px 0px 6px 0px;
  font-weight: 600;
  border-bottom: 1px solid #ddd;
}

.page-box .new-pf .pf-content {
  padding: 40px 0px;
}

.page-box .new-pf .pf-content .b-right {
  border-right: 1px solid #ddd;
}

.page-box .new-pf .pf-content .pf-items {
  list-style: none;
  padding: unset;
  margin: unset;
  font-size: 17px;
}

.page-box .new-pf .pf-content .pf-items > li {
  display: flex;
}

.page-box .new-pf .pf-content .pf-items > li:not(:last-child) {
  margin-bottom: 20px;
}

.page-box .new-pf .pf-content .pf-items .subject {
  width: 40%;
  text-align: right;
  margin-right: 20px;
}

.page-box .new-pf .pf-content .pf-items .value {
  width: 60%;
}

.page-box .new-pf .pf-content .pf-profile {
  text-align: center;
}

.page-box .new-pf .pf-content .pf-profile .avatar-circle {
  border-radius: 100%;
  width: 100px;
  aspect-ratio: 1 / 1;
  margin-bottom: 10px;
  outline: 1px solid #ddd;
}

.page-box .new-pf .pf-content .pf-profile .code {
  font-size: 23px;
  font-weight: 700;
  margin-bottom: 15px;
}

.page-box .new-pf .pf-content .pf-profile .btn {
  padding: 0px 25px;
  height: 38px;
  font-size: 16px;
  align-content: center;
}

.page-box .new-pf .pf-content .pf-profile .img-wrap {
  position: relative;
}

.page-box .new-pf .pf-content .pf-profile .img-wrap .img-edit {
  position: absolute;
  bottom: 11px;
  right: 75px;
  width: 23px;
  height: 23px;
  transition: all ease 0.2s;
  cursor: pointer;
}

.page-box .new-pf .pf-content .pf-profile .img-wrap .img-edit:hover {
  opacity: 0.6;
}

.page-box .new-pf .pf-content .wm-text {
  font-size: 17px;
  text-align: center;
  color: #ff8f00;
  margin-top: 60px;
}

.cart-warning-bg {
  font-family: "Noto Sans Thai", sans-serif;
  background-color: #ff9900;
  color: #fff;
  text-align: center;
  padding: 15px 25px;
  font-size: 20px;
  font-weight: 500;
  border-radius: 7px;
  margin: 0px 12%;
  margin-bottom: 15px;
}
/* todo */

/* promotion */
.modal-promo {
  font-family: "Noto Sans Thai", sans-serif;
  margin-top: 25%;
}

@media (min-width: 768px) {
  .modal-promo {
    margin: 70px auto;
  }
}

.modal-promo .modal-content {
  border: unset;
  box-shadow: unset;
  background: transparent;
}

.modal-promo .modal-content .modal-body {
  padding: unset;
  background-size: 100%;
  background-repeat: no-repeat;
  height: 680px;
}

.modal-promo .pro-close {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 45px;
  height: 45px;
  cursor: pointer;
}

.modal-promo .pro-close img {
  width: 100%;
}

.modal-promo .pro-close:hover {
  opacity: 0.7;
}

.modal-promo .pro-button {
  position: absolute;
  bottom: -35px;
  left: 0px;
  display: flex;
  justify-content: center;
  width: 100%;
}

.modal-promo .pro-button .pro-bt {
  height: 83px;
  cursor: pointer;
}

.modal-promo .pro-button .pro-bt:hover {
  opacity: 0.8;
}

.modal-promo .pro-neverShow {
  position: absolute;
  bottom: -45px;
  left: 13px;
  display: flex;
  align-items: end;
  scale: 1.3;
}

.modal-promo .pro-neverShow input[type="checkbox"] {
  margin: unset;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.modal-promo .pro-neverShow label {
  padding-left: 10px;
  font-weight: 300;
  font-size: 22px;
  line-height: 20px;
  color: #fff;
  margin: unset;
  cursor: pointer;
}

.modal-enjoy .pro-neverShow {
  width: 100%;
  justify-content: center;
}

.modal-enjoy .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-enjoy .pro-close {
  right: 5px;
  top: 25px;
  width: 40px;
  height: 40px;
}

.modal-enjoy .pro-neverShow input[type="checkbox"] {
  accent-color: #29abe2;
  width: 26px;
  height: 26px;
}

.modal-enjoy2 {
  margin: 20px auto;
  width: 45%;
}

.modal-enjoy2 .pro-neverShow {
  width: 100%;
  justify-content: center;
}

.modal-enjoy2 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy2 .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy2 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-enjoy2 .pro-close {
  right: 13.5%;
  top: 17%;
  width: 4.7%;
  height: 4.7px;
}

.modal-enjoy2 .pro-neverShow input[type="checkbox"] {
  accent-color: #fcc1dc;
  width: 26px;
  height: 26px;
}

.model-12th .pro-close {
  right: 65px;
  top: 15px;
  width: 37px;
  height: 37px;
}

.model-12th .pro-neverShow {
  bottom: 10px;
  left: 90px;
}

.model-12th .pro-neverShow label {
  color: #ffff00;
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.model-12th .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0066;
  width: 26px;
  height: 26px;
}

.model-12th .popup-background {
  width: 80%;
}

.modal-99 {
  margin: 20px auto;
  width: 40%;
}

.modal-99 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -30px;
}

.modal-99 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-99 .pro-button .pro-bt {
  height: 75px;
}

.modal-99 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-99 .pro-close {
  right: 6%;
  top: 8%;
  width: 4.7%;
  height: 4.7%;
}

.modal-99 .pro-neverShow input[type="checkbox"] {
  accent-color: #009dd9;
  width: 26px;
  height: 26px;
}

.modal-congrate-99 {
  margin: 20px auto;
  width: 30%;
}

.modal-congrate-99 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -30px;
}

.modal-congrate-99 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-congrate-99 .pro-button .pro-bt {
  height: 75px;
}

.modal-congrate-99 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-congrate-99 .pro-close {
  right: 11.3%;
  top: 10.8%;
  width: 9%;
  height: 9%;
  opacity: 0 !important;
}

.modal-congrate-99 .pro-neverShow input[type="checkbox"] {
  accent-color: #009dd9;
  width: 26px;
  height: 26px;
}

.page-66 {
  position: relative;
  padding: unset !important;
}

.page-66 .background-66 {
  width: 100%;
}

.page-66 .couponGroup {
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
  top: 15.6%;
}

.page-66 .couponGroup .coupon-item {
  width: 50%;
  height: 295.06px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.page-66 .couponGroup .coupon-item img {
  width: 85%;
  transition: 0.1s;
}

.page-66 .couponGroup .coupon-item:hover img {
  width: 90%;
}

.page-66 .couponGroup .coupon-item:active img {
  width: 83%;
}

.page-66 .coupon1,
.page-66 .coupon2 {
  content: url("/image/promotion/coupon-6_0.png");
}

.page-66 .coupon3 {
  content: url("/image/promotion/coupon-16_0.png");
}

.page-66 .coupon4 {
  content: url("/image/promotion/coupon-66_0.png");
}

.page-66 .coupon-item.disabled .coupon1,
.page-66 .coupon-item.disabled .coupon2 {
  content: url("/image/promotion/coupon-6_1grey_0.png");
}

.page-66 .coupon-item.disabled .coupon3 {
  content: url("/image/promotion/coupon-16_grey_0.png");
}

.page-66 .coupon-item.disabled .coupon4 {
  content: url("/image/promotion/coupon-66_grey_0.png");
}

.page-66 .couponGroup .coupon-item.disabled {
  user-select: none;
  cursor: not-allowed;
}

.page-66 .couponGroup .coupon-item.disabled img {
  width: 85% !important;
}

.enjoy-coupon {
  position: relative;
  padding: unset !important;
}

.enjoy-coupon .bg-enjoy {
  width: 100%;
}

.enjoy-coupon .couponGroup {
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
  top: 29.5%;
}

.enjoy-coupon .couponGroup .coupon-item {
  width: 50%;
  height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.enjoy-coupon .couponGroup .coupon-item img {
  width: 85%;
  transition: 0.1s;
}

.enjoy-coupon .couponGroup .coupon-item:hover img {
  width: 90%;
}

.enjoy-coupon .couponGroup .coupon-item:active img {
  width: 83%;
}

.enjoy-coupon .coupon1 {
  content: url("/image/promotion/enjoy-5.png");
}

.enjoy-coupon .coupon2 {
  content: url("/image/promotion/enjoy-10.png");
}

.enjoy-coupon .coupon3 {
  content: url("/image/promotion/enjoy-20.png");
}

.enjoy-coupon .coupon4 {
  content: url("/image/promotion/enjoy-50.png");
}

.enjoy-coupon .coupon5 {
  content: url("/image/promotion/enjoy-100.png");
}

.enjoy-coupon .coupon6 {
  content: url("/image/promotion/enjoy-200.png");
}

.enjoy-coupon .coupon7 {
  content: url("/image/promotion/enjoy-5percen.png");
}

.enjoy-coupon .coupon8 {
  content: url("/image/promotion/enjoy-10percen.png");
}

.enjoy-coupon .coupon-item.disabled .coupon1 {
  content: url("/image/promotion/enjoy-5-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon2 {
  content: url("/image/promotion/enjoy-10-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon3 {
  content: url("/image/promotion/enjoy-20-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon4 {
  content: url("/image/promotion/enjoy-50-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon5 {
  content: url("/image/promotion/enjoy-100-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon6 {
  content: url("/image/promotion/enjoy-200-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon7 {
  content: url("/image/promotion/enjoy-5percen-done.png");
}

.enjoy-coupon .coupon-item.disabled .coupon8 {
  content: url("/image/promotion/enjoy-10percen-done.png");
}

.enjoy-coupon .couponGroup .coupon-item.disabled {
  user-select: none;
  cursor: not-allowed;
}

.enjoy-coupon .couponGroup .coupon-item.disabled img {
  width: 85% !important;
}

.enjoy-coupon2 {
  position: relative;
  padding: unset !important;
}

.enjoy-coupon2 .bg-enjoy {
  width: 100%;
}

.enjoy-coupon2 .couponGroup {
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
  top: 29.5%;
}

.enjoy-coupon2 .couponGroup .coupon-item {
  width: 50%;
  height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.enjoy-coupon2 .couponGroup .coupon-item img {
  width: 85%;
  transition: 0.1s;
}

.enjoy-coupon2 .couponGroup .coupon-item:hover img {
  width: 90%;
}

.enjoy-coupon2 .couponGroup .coupon-item:active img {
  width: 83%;
}

.enjoy-coupon2 .coupon1 {
  content: url("/image/promotion/enj2-5p.png");
}

.enjoy-coupon2 .coupon2 {
  content: url("/image/promotion/enj2-5.png");
}

.enjoy-coupon2 .coupon3 {
  content: url("/image/promotion/enj2-10p.png");
}

.enjoy-coupon2 .coupon4 {
  content: url("/image/promotion/enj2-10.png");
}

.enjoy-coupon2 .coupon5 {
  content: url("/image/promotion/enj2-20.png");
}

.enjoy-coupon2 .coupon6 {
  content: url("/image/promotion/enj2-50.png");
}

.enjoy-coupon2 .coupon7 {
  content: url("/image/promotion/enj2-100.png");
}

.enjoy-coupon2 .coupon8 {
  content: url("/image/promotion/enj2-200.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon1 {
  content: url("/image/promotion/enj2-5p-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon2 {
  content: url("/image/promotion/enj2-5-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon3 {
  content: url("/image/promotion/enj2-10p-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon4 {
  content: url("/image/promotion/enj2-10-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon5 {
  content: url("/image/promotion/enj2-20-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon6 {
  content: url("/image/promotion/enj2-50-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon7 {
  content: url("/image/promotion/enj2-100-done.png");
}

.enjoy-coupon2 .coupon-item.disabled .coupon8 {
  content: url("/image/promotion/enj2-200-done.png");
}

.enjoy-coupon2 .couponGroup .coupon-item.disabled {
  user-select: none;
  cursor: not-allowed;
}

.enjoy-coupon2 .couponGroup .coupon-item.disabled img {
  width: 85% !important;
}

.vcb12th {
  position: relative;
  padding: unset !important;
}

.vcb12th .bg-vcb12th {
  width: 100%;
}

.vcb12th .couponGroup {
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
  top: 25.6%;
  padding: 0px 50px;
}

.vcb12th .couponGroup .coupon-item {
  width: 50%;
  height: 530px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.vcb12th .couponGroup .coupon-item.full {
  width: 100%;
}

.vcb12th .couponGroup .coupon-item img {
  transition: 0.1s;
}

.vcb12th .couponGroup .coupon-item:hover img {
  scale: 1.04;
}

.vcb12th .couponGroup .coupon-item:active img {
  scale: 0.96;
}

.vcb12th .coupon1 {
  content: url("/image/promotion/12th-coupon-12.png");
}

.vcb12th .coupon2 {
  content: url("/image/promotion/12th-coupon-12.png");
}

.vcb12th .coupon3 {
  content: url("/image/promotion/12th-coupon-120.png");
}

.vcb12th .coupon4 {
  content: url("/image/promotion/12th-coupon-1200.png");
}

.vcb12th .coupon-item.disabled .coupon1 {
  content: url("/image/promotion/12th-coupon-12-drop.png");
}

.vcb12th .coupon-item.disabled .coupon2 {
  content: url("/image/promotion/12th-coupon-12-drop.png");
}

.vcb12th .coupon-item.disabled .coupon3 {
  content: url("/image/promotion/12th-coupon-120-drop.png");
}

.vcb12th .coupon-item.disabled .coupon4 {
  content: url("/image/promotion/12th-coupon-1200-drop.png");
}

.vcb12th .couponGroup .coupon-item.disabled {
  user-select: none;
  cursor: not-allowed;
}

.vcb12th .couponGroup .coupon-item.disabled img {
  scale: 1 !important;
}

.modal-halloween {
  margin: 45px auto;
  width: 35%;
}

.modal-halloween .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -40px;
  padding-right: 30px;
}

.modal-halloween .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-halloween .pro-button .pro-bt {
  height: 75px;
}

.modal-halloween .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-halloween .pro-close {
  right: 6%;
  top: 8%;
  width: 4.7%;
  height: 4.7%;
}

.modal-halloween .pro-neverShow input[type="checkbox"] {
  accent-color: #ff6200;
  width: 26px;
  height: 26px;
}

.modal-halloween {
  margin: 45px auto;
  width: 35%;
}

.modal-halloween .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -40px;
  padding-right: 30px;
}

.modal-11_11 {
  margin: 45px auto;
  width: 37%;
}

.modal-11_11 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -40px;
  padding-right: 30px;
}

.modal-11_11 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-11_11 .pro-button .pro-bt {
  height: 75px;
}

.modal-11_11 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-11_11 .pro-close {
  right: 12%;
  top: 8%;
  width: 5.4%;
  height: 5.4%;
}

.modal-11_11 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 26px;
  height: 26px;
}

.modal-11_11 {
  margin: 45px auto;
  width: 35%;
}

.modal-11_11 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: 0px;
  padding-right: 30px;
}

.modal-14_11 {
  margin: 45px auto;
  width: 35%;
}

.modal-14_11 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -40px;
  padding-right: 30px;
}

.modal-14_11 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-14_11 .pro-button .pro-bt {
  height: 75px;
}

.modal-14_11 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-14_11 .pro-close {
  right: -4%;
  top: 1%;
  width: 5.4%;
  height: 5.4%;
}

.modal-14_11 .pro-neverShow input[type="checkbox"] {
  accent-color: #ffa600;
  width: 26px;
  height: 26px;
}

.modal-14_11 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -30px;
  padding-right: 30px;
}

.modal-bf-24 {
  margin: 45px auto;
  width: 33%;
}

.modal-bf-24 .pro-neverShow {
  left: 6%;
  bottom: -15px;
}

.modal-bf-24 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-bf-24 .pro-button .pro-bt {
  height: 75px;
}

.modal-bf-24 .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-bf-24 .pro-close {
  right: 2%;
  top: 1%;
  width: 7%;
  height: 7%;
}

.modal-bf-24 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-funfair-24 {
  margin: 60px auto;
  width: 27%;
}

.modal-funfair-24 .popup-content {
  position: relative;
}

.modal-funfair-24 .pro-neverShow {
  left: 6%;
  bottom: 0px;
}

.modal-funfair-24 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-funfair-24 .pro-button .pro-bt {
  height: 75px;
}

.modal-funfair-24 .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 12px;
  line-height: 14px;
}

.modal-funfair-24 .pro-close {
  right: 0px;
  top: 1%;
  width: 7%;
  height: 7%;
}

.modal-funfair-24 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 16px;
  height: 16px;
}

.modal-xmas-24 {
  margin: 10px auto;
  width: 50%;
}

.modal-xmas-24 .pro-neverShow {
  left: 42%;
  bottom: 3%;
  scale: 1.1;
}

.modal-xmas-24 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-xmas-24 .pro-button .pro-bt {
  height: 75px;
}

.modal-xmas-24 .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-xmas-24 .pro-close {
  right: 17%;
  top: 19%;
  width: 4.5%;
  height: 4.5%;
}

.modal-xmas-24 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-cny25 {
  margin: 45px auto;
  width: 33%;
}

.modal-cny25 .pro-neverShow {
  left: 6%;
  bottom: 10px;
}

.modal-cny25 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-cny25 .pro-button .pro-bt {
  height: 75px;
}

.modal-cny25 .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-cny25 .pro-close {
  right: 2%;
  top: 1%;
  width: 7%;
  height: 7%;
}

.modal-cny25 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-newcus {
  margin: 4% auto;
  width: 40%;
}

.modal-newcus .pro-neverShow {
  left: 6%;
  bottom: 10px;
}

.modal-newcus .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-newcus .pro-button .pro-bt {
  height: 75px;
}

.modal-newcus .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-newcus .pro-close {
  right: 15%;
  top: 3%;
  width: 5%;
  height: 5%;
}

.modal-newcus .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-newcuspay {
  margin: 5% auto;
  width: 32%;
}

.modal-newcuspay .pro-neverShow {
  left: 6%;
  bottom: 10px;
}

.modal-newcuspay .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-newcuspay .pro-button .pro-bt {
  height: 75px;
}

.modal-newcuspay .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-newcuspay .pro-close {
  right: 4%;
  top: 2%;
  width: 7%;
  height: 7%;
}

.modal-newcuspay .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-vlt25 {
  margin: 80px auto;
  width: 33%;
}

.modal-vlt25 .pro-neverShow {
  left: 7%;
  bottom: 10px;
  scale: 1.1;
}

.modal-vlt25 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-vlt25 .pro-button .pro-bt {
  height: 75px;
}

.modal-vlt25 .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-vlt25 .pro-close {
  right: 5%;
  top: 3%;
  width: 4.5%;
  height: 4.5%;
}

.modal-vlt25 .pro-neverShow input[type="checkbox"] {
  accent-color: #e6264e;
  width: 23px;
  height: 23px;
}

.modal-vlt25-afterpay {
  margin: 80px auto;
  width: 30%;
}

.modal-vlt25-afterpay .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -30px;
}

.modal-vlt25-afterpay .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-vlt25-afterpay .pro-button .pro-bt {
  height: 75px;
}

.modal-vlt25-afterpay .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.modal-vlt25-afterpay .pro-close {
  right: 9%;
  top: 7%;
  width: 5%;
  height: 5%;
}

.modal-vlt25-afterpay .pro-neverShow input[type="checkbox"] {
  accent-color: #009dd9;
  width: 26px;
  height: 26px;
}

.modal-paydaymarch {
  margin: 7% auto;
  width: 25%;
}

.modal-paydaymarch .pro-neverShow {
  left: 6%;
  bottom: 10px;
}

.modal-paydaymarch .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-paydaymarch .pro-button .pro-bt {
  height: 75px;
}

.modal-paydaymarch .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-paydaymarch .pro-close {
  right: 4%;
  top: 2%;
  width: 7%;
  height: 7%;
}

.modal-paydaymarch .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.modal-4-afterpay {
  margin: 4% auto;
  width: 27%;
}

.modal-4-afterpay .pro-neverShow {
  left: 6%;
  bottom: 10px;
}

.modal-4-afterpay .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-4-afterpay .pro-button .pro-bt {
  height: 75px;
}

.modal-4-afterpay .pro-neverShow label {
  font-weight: 300;
  padding-left: 7px;
  font-size: 18px;
}

.modal-4-afterpay .pro-close {
  right: 4%;
  top: 2%;
  width: 7%;
  height: 7%;
}

.modal-4-afterpay .pro-neverShow input[type="checkbox"] {
  accent-color: #ff0000;
  width: 23px;
  height: 23px;
}

.double-after33 {
  margin: 80px auto;
  width: 30%;
}

.double-after33 .pro-neverShow {
  width: 100%;
  justify-content: center;
  bottom: -30px;
}

.double-after33 .pro-button {
  bottom: 35px;
  left: 13px;
}

.double-after33 .pro-button .pro-bt {
  height: 75px;
}

.double-after33 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 20px;
}

.double-after33 .pro-close {
  right: 10.5%;
  top: 4.5%;
  width: 6%;
  height: 6%;
}

.double-after33 .pro-neverShow input[type="checkbox"] {
  accent-color: #009dd9;
  width: 26px;
  height: 26px;
}

.modal-enjoy25 {
  margin: 80px auto;
  width: 33%;
}

.modal-enjoy25 .pro-neverShow {
  left: 39%;
  bottom: -10px;
}

.modal-enjoy25 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy25 .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy25 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-enjoy25 .pro-close {
  right: 4%;
  top: 4%;
  width: 7%;
  height: 7%;
}

.modal-enjoy25 .pro-neverShow input[type="checkbox"] {
  accent-color: #8900ff;
  width: 23px;
  height: 23px;
}

.modal-double33 {
  margin: 80px auto;
  width: 33%;
}

.modal-double33 .pro-neverShow {
  left: 37%;
  bottom: -20px;
  scale: 1.2;
}

.modal-double33 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-double33 .pro-button .pro-bt {
  height: 75px;
}

.modal-double33 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-double33 .pro-close {
  right: 17.5%;
  top: 3.5%;
  width: 6.2%;
  height: 6.2%;
}

.modal-double33 .pro-neverShow input[type="checkbox"] {
  accent-color: #d8147c;
  width: 23px;
  height: 23px;
}

.modal-enjoy-march {
  margin: 50px auto;
  width: 30%;
}

.modal-enjoy-march .pro-neverShow {
  left: 7%;
  bottom: 5px;
  scale: 1;
}

.modal-enjoy-march .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy-march .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy-march .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-enjoy-march .pro-close {
  right: 11%;
  top: 3.5%;
  width: 5%;
  height: 5%;
}

.modal-enjoy-march .pro-neverShow input[type="checkbox"] {
  accent-color: #ff3300;
  width: 23px;
  height: 23px;
}

.modal-enjoy-may {
  margin: 70px auto;
  width: 27%;
}

.modal-enjoy-may .pro-neverShow {
  left: 5%;
  bottom: -35px;
  scale: 1;
}

.modal-enjoy-may .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy-may .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy-may .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-enjoy-may .pro-close {
  right: 3%;
  top: 3.7%;
  width: 6%;
  height: 6%;
}

.modal-enjoy-may .pro-neverShow input[type="checkbox"] {
  accent-color: #ff5e0b;
  width: 23px;
  height: 23px;
}

.modal-mid-june {
  margin: 70px auto;
  width: 27%;
}

.modal-mid-june .pro-neverShow {
  left: 3%;
  bottom: 5px;
  scale: 0.9;
}

.modal-mid-june .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-mid-june .pro-button .pro-bt {
  height: 75px;
}

.modal-mid-june .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-mid-june .pro-close {
  right: 5%;
  top: 2%;
  width: 5.7%;
  height: 5.7%;
}

.modal-mid-june .pro-neverShow input[type="checkbox"] {
  accent-color: #a40000;
  width: 23px;
  height: 23px;
}

.modal-4-summer {
  margin: 80px auto;
  width: 35%;
}

.modal-4-summer .pro-neverShow {
  left: 7%;
  bottom: 5px;
  scale: 1;
}

.modal-4-summer .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-4-summer .pro-button .pro-bt {
  height: 75px;
}

.modal-4-summer .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-4-summer .pro-close {
  right: 7%;
  top: 4%;
  width: 4%;
  height: 4%;
}

.modal-4-summer .pro-neverShow input[type="checkbox"] {
  accent-color: #ff3300;
  width: 23px;
  height: 23px;
}

.modal-enjoy-apr {
  margin: 80px auto;
  width: 32%;
}

.modal-enjoy-apr .pro-neverShow {
  left: 0px;
  justify-content: center;
  width: 100%;
  bottom: 5px;
  scale: 1;
}

.modal-enjoy-apr .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy-apr .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy-apr .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-enjoy-apr .pro-close {
  right: 2%;
  top: 2%;
  width: 5%;
  height: 5%;
}

.modal-enjoy-apr .pro-neverShow input[type="checkbox"] {
  accent-color: #ff3300;
  width: 23px;
  height: 23px;
}

.modal-bigdeal55 {
  margin: 80px auto;
  width: 32%;
}

.modal-bigdeal55 .pro-neverShow {
  left: 0px;
  width: 100%;
  bottom: 5px;
  scale: 1;
}

.modal-bigdeal55 .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-bigdeal55 .pro-button .pro-bt {
  height: 75px;
}

.modal-bigdeal55 .pro-neverShow label {
  font-weight: 400;
  padding-left: 7px;
  font-size: 18px;
}

.modal-bigdeal55 .pro-close {
  right: 0px;
  top: 0px;
  width: 6.5%;
  height: 6.5%;
}

.modal-bigdeal55 .pro-neverShow input[type="checkbox"] {
  accent-color: #ff3300;
  width: 23px;
  height: 23px;
}

.modal-enjoy-jun {
  margin: 70px auto;
  width: 27%;
}

.modal-enjoy-jun .pro-neverShow {
  left: 15.5%;
  bottom: 10px;
  scale: 1;
}

.modal-enjoy-jun .pro-button {
  bottom: 35px;
  left: 13px;
}

.modal-enjoy-jun .pro-button .pro-bt {
  height: 75px;
}

.modal-enjoy-jun .pro-neverShow label {
  font-weight: 600;
  padding-left: 7px;
  font-size: 18px;
  color: #000;
}

.modal-enjoy-jun .pro-close {
  right: 6%;
  top: 3%;
  width: 6%;
  height: 6%;
}

.modal-enjoy-jun .pro-neverShow input[type="checkbox"] {
  accent-color: #3100f0;
  width: 23px;
  height: 23px;
}

/* footer new */
.vcbcargo-footer {
  background: #f8f8f8;
}

.vcbcargo-footer .footer-bar {
  height: 68px;
  background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 14px;
  color: #000000;
}

.vcbcargo-footer .main-footer {
  color: #000;
  padding: 50px 0px 40px 0px;
}

.vcbcargo-footer .main-footer .short-link {
  display: flex;
  flex-direction: column;
  padding: 10px 24px 10px 80px;
}

.vcbcargo-footer .main-footer .short-link a {
  text-decoration: unset;
  width: max-content;
  color: #000;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 20px;
}

.vcbcargo-footer .main-footer .short-link a:last-child {
  margin: unset;
}

.vcbcargo-footer .main-footer .short-box {
  height: 280px;
  padding: 10px 24px;
  display: flex;
  flex-direction: column;
}

.vcbcargo-footer .main-footer .short-box a {
  text-decoration: unset;
  width: max-content;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
  color: #000;
  margin-bottom: 20px;
}

.vcbcargo-footer .main-footer .short-box a:last-child {
  margin: unset;
}

.vcbcargo-footer .main-footer .short-link a:hover,
.vcbcargo-footer .main-footer .short-box a:hover {
  opacity: 0.7;
}

.vcbcargo-footer .main-footer .short-box.with-bl {
  border-left: 1px solid #000;
}

.vcbcargo-footer .main-footer .short-box .link-title {
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: #000;
  margin-bottom: 10px;
}

.vcbcargo-footer .main-footer .ft-about {
  color: #000;
}

.vcbcargo-footer .main-footer .ft-about img {
  width: 274.5px;
  margin-bottom: 20px;
}

.vcbcargo-footer .main-footer .ft-about .ft-title {
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 3px;
}

.vcbcargo-footer .main-footer .ft-about .ft-info {
  font-weight: 500;
  line-height: 18px;
  margin-bottom: 10px;
}

.vcbcargo-footer .main-footer .ft-about .ft-social a {
  margin-right: 8px;
}

.vcbcargo-footer .main-footer .ft-about .ft-social a:last-child {
  margin: unset;
}

.vcbcargo-footer .main-footer .ft-about .ft-social img {
  height: 23px;
  width: auto;
}

.vcbcargo-footer .contact-footer {
  background: #e9e9e9;
  color: #000;
  padding: 30px 0px;
  overflow: hidden;
}

.vcbcargo-footer .contact-footer .ft-contact {
  display: flex;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-qrcode {
  width: 40%;
  display: flex;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item {
  width: 50%;
  text-align: center;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item .title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 10px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item img {
  width: 110px;
  margin-bottom: 20px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item .des {
  font-size: 14px;
  font-weight: 500;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-tel {
  width: 35%;
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  justify-content: center;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-tel .phone {
  font-weight: 600;
  font-size: 48px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-tel img {
  width: 33px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-tel .des {
  font-size: 23px;
  font-weight: 500;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-app {
  width: 25%;
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  justify-content: center;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-app .title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 16px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-app a:hover {
  opacity: 0.7;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-app a img {
  width: 207px;
}

.vcbcargo-footer .contact-footer .ft-contact .ft-app a:not(:last-child) {
  margin-bottom: 10px;
}

.aboutus-cargo {
  background-image: url("/img/aboutbg.png");
  background-size: 100% 144rem;
  background-position: center;
  background-position-y: -10rem;
  background-repeat: no-repeat;
  position: relative;
  height: 1300px;
}

.aboutus-cargo .con-title {
  color: #fff;
  text-align: center;
  font-weight: 600;
  padding: 1.25rem 0 1.875rem;
  background-color: rgba(255, 153, 0, 0.9);
  width: 63%;
  height: 260px;
  position: absolute;
  top: 8%;
  left: 55.5%;
  transform: translateX(-50%);
  overflow: hidden;
}

.aboutus-cargo .con-boximage {
  position: absolute;
  right: 9.2rem;
  top: 35rem;
  z-index: 1;
}

.aboutus-cargo .con-boximage .img {
  height: 182px;
}

.aboutus-cargo .con-title .title {
  margin-top: 10px;
  font-size: 56px;
}

.aboutus-cargo .con-title .des {
  font-size: 22px;
}

.aboutus-cargo .sv-inner {
  background-color: transparent;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 2%;
}

.aboutus-cargo .sv-inner .section {
  color: #fff;
}

.aboutus-cargo .svcargo-bottom .title {
  color: #fff;
}

.versus-content {
  background-image: url("/img/versus-bg.png");
  /* background-size: 101%; */
  background-position: center -6rem;
  min-height: 1260px;
  background-repeat: no-repeat;
  position: relative;
  padding-top: 60px;
}

.versus-content ol,
.versus-content li,
.versus-content p {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

.versus-content .section {
  color: #fff;
  font-size: 42px;
}

.versus-content .phone-box {
  position: absolute;
  height: 100%;
  top: 42%;
  width: 1188px;
  left: 50%;
  transform: translateX(-50%);
}

.versus-content .phone-box .vcanbuy {
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 450px;
  background-position: center top;
  background-image: url("/img/phone-f.png");
  background-repeat: no-repeat;
  background-size: 100% 55%;
  top: -40px;
  bottom: 0;
  left: 3%;
}

.versus-content .phone-box .vcanbuy-cargo {
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 450px;
  background-position: center top;
  background-image: url("/img/phone-f.png");
  background-repeat: no-repeat;
  background-size: 100% 55%;
  top: -40px;
  bottom: 0;
  right: 7%;
  color: #fff;
}

.versus-content .phone-box .vcanbuy .hl {
  color: #ff5c00;
  font-weight: 600;
}

.versus-content .phone-box .vcanbuy-cargo .hl {
  color: #000;
  font-weight: 600;
}

.versus-content .phone-box .vcanbuy .bg,
.versus-content .phone-box .vcanbuy-cargo .bg {
  width: 86%;
  height: 49%;
  background-color: rgba(255, 255, 255, 0.5);
  position: absolute;
  border-radius: 40px;
  left: 50%;
  top: 3%;
  transform: translateX(-50%);
}

.versus-content .phone-box .vcanbuy-cargo .bg {
  background-color: rgba(229, 124, 53, 0.6);
}

.versus-content .phone-box .vcanbuy .title,
.versus-content .phone-box .vcanbuy-cargo .title {
  width: 84%;
  position: absolute;
  left: 50%;
  top: 47px;
  transform: translateX(-50%);
  height: 66px;
  background-color: #000;
  color: #fff;
  border-radius: 30px;
  font-size: 19px;
  /* padding: 0 24px; */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.versus-content .phone-box .vcanbuy .content,
.versus-content .phone-box .vcanbuy-cargo .content {
  position: relative;
  top: 11%;
  font-size: 18px;
}

.versus-content .phone-box .vcanbuy .content .item,
.versus-content .phone-box .vcanbuy-cargo .content .item {
  padding-bottom: 30px;
  position: relative;
  width: 78%;
  left: 51%;
  bottom: -5%;
  transform: translateX(-50%);
}

.versus-content .phone-box .vcanbuy .content .item:after,
.versus-content .phone-box .vcanbuy-cargo .content .item:after {
  position: absolute;
  width: 100%;
  height: 20px;
  left: 0;
  bottom: 0;
  content: "";
  background-image: url("/img/versus-bar.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.versus-content .phone-box .vcanbuy .content .item:last-of-type::after,
.versus-content .phone-box .vcanbuy-cargo .content .item:last-of-type::after {
  display: none;
}

.versus-content .phone-box .vcanbuy .content li,
.versus-content .phone-box .vcanbuy-cargo .content li {
  list-style: none;
  position: relative;
}

.versus-content .phone-box .vcanbuy .content li:not(:last-child),
.versus-content .phone-box .vcanbuy-cargo .content li:not(:last-child) {
  margin-bottom: 10px;
}

.versus-content .phone-box .vcanbuy .content li:before,
.versus-content .phone-box .vcanbuy-cargo .content li:before {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  background-color: #000;
  border-radius: 50%;
  left: -14px;
  top: 8px;
}

.versus-content .phone-box .vcanbuy-cargo .content li:before {
  background-color: #fff;
}

.versus-content .phone-box .title-box {
  position: absolute;
  color: #fff;
  left: 48%;
  top: 3%;
  height: 600px;
  width: 235px;
  transform: translateX(-50%);
  background-image: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.005),
    rgba(0, 0, 0, 0.9) 60%,
    rgba(0, 0, 0, 0.2) 100%
  );
  mix-blend-mode: color-dodge;
  font-size: 20px;
}

.versus-content .phone-box .title-box .title-box_item {
  white-space: nowrap;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.versus-content .phone-box .title-box .title-box_item:after {
  content: "";
  background-image: url("/img/versus-title-bar.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 90%;
  height: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
}

.versus-content .phone-box .title-box .title-box_item:last-of-type::after {
  display: none;
}

.mobile-control .cp-couponcard {
  position: relative;
  height: 104px;
  border-radius: 8px;
  background: #f5f5f5;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.25);
  margin-bottom: 15px;
  display: flex;
}

.cp-couponcard .coupon-value {
  position: relative;
  width: 35%;
  height: 100%;
  background: #ff8f00;
  border-radius: 8px 0px 0px 8px;
  text-align: center;
  align-content: center;
}

.cp-couponcard .coupon-value .value {
  font-family: "Inter";
  font-size: 33px;
  line-height: 35px;
  font-weight: 600;
  color: #fff;
  padding-left: 7px;
}

.cp-couponcard .coupon-value .value span {
  font-size: 15px;
  line-height: 17px;
  padding: 0px 3px;
}

.cp-couponcard .coupon-value .dotline {
  position: absolute;
  right: -1px;
  top: 8px;
  height: 89px;
}

.cp-couponcard::before,
.cp-couponcard::after {
  content: "";
  position: absolute;
  width: 32px;
  height: 32px;
  background: #fff;
  border-radius: 50%;
  z-index: 1;
}

.cp-couponcard::before {
  top: 50%;
  left: -16px;
  transform: translateY(-50%);
  box-shadow: inset -2px 0px 2px rgba(0, 0, 0, 0.2);
}

.cp-couponcard::after {
  top: 50%;
  right: -16px;
  transform: translateY(-50%);
  box-shadow: inset 2px 0px 2px rgba(0, 0, 0, 0.2);
}

.cp-couponcard .coupon-detail {
  position: relative;
  width: 65%;
  padding: 9px 23px 9px 12px;
}

.cp-couponcard .coupon-detail ul {
  list-style: none;
  padding: unset;
  margin: unset;
  font-size: 10px;
  line-height: 14px;
  font-weight: 500;
  margin-bottom: 10px;
}

.cp-couponcard .coupon-detail .date {
  font-size: 8px;
  color: #606060;
}

.cp-couponcard .coupon-detail .bt-coupon {
  position: absolute;
  top: 42px;
  right: 24px;
  height: 19px;
  background: #f6861f;
  border-radius: 30px;
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  padding: 0px 10px;
  z-index: 1;
}

.mobile-control .cp-condition {
  margin-bottom: 15px;
  display: none;
}

.mobile-control .cp-condition ul {
  font-size: 13px;
  padding-left: 25px;
  margin: unset;
}

.mobile-control .cp-couponcard.used .coupon-value {
  background: #979797;
}

.mobile-control .cp-couponcard.expired {
  background: #f8f4f4;
}

.mobile-control .cp-couponcard.expired .coupon-value {
  background: #d8d4d4;
}

.mobile-control .cp-couponcard.expired .coupon-detail {
  color: #ccc;
}

.mobile-control .cp-couponcard.expired .coupon-detail .date {
  color: #ccc;
}

.mobile-control .cp-couponcard.expired .expire-lab {
  position: absolute;
  z-index: 1;
  height: 62px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.vmallpro-content .vmall-content .productAction .imgpre-mb {
  display: none;
}

.dash-liststyle {
  list-style: none;
  padding-left: 20px;
  position: relative;
  margin: unset;
  font-size: 13px;
  line-height: normal;
}

.dash-liststyle > li {
  margin-bottom: 5px;
}

.dash-liststyle li::before {
  content: "-";
  position: absolute;
  left: 5px;
}

.dash-liststyle li.none-ls::before {
  content: "";
}

.terms-title {
  color: #f5851f;
  border-left: 2px solid #f5851f;
  padding-left: 10px;
  line-height: 1;
  margin-bottom: 10px;
}

.terms-list {
  font-size: 13px;
  list-style: none;
  padding-left: 15px;
  color: #636363;
  margin-bottom: 15px;
}

.terms-list > li {
  margin-bottom: 5px;
}

.terms-list .danger {
  font-size: 14px;
  color: #ff4a44;
  font-weight: bold;
}

.terms-date {
  text-align: right;
  color: #f5851f;
  margin-bottom: 10px;
}

.vcb-terms {
  font-family: "Noto Sans Thai", sans-serif;
  font-size: 16px;
  line-height: 26px;
  padding: 40px 0px;
}

.vcb-terms h1,
.vcb-terms h2,
.vcb-terms h3,
.vcb-terms h4 {
  color: #ff9900;
  margin-bottom: 15px;
}

.vcb-terms ul {
  list-style: none;
  padding: unset;
  margin-bottom: 40px;
}

.vcb-terms ul > li {
  margin-bottom: 10px;
}

.vcb-terms li:first-child {
  margin-top: 8px;
}

.vcb-terms ul > li > ul {
  padding-left: 20px;
  margin: unset;
}

/* containers */
@media (min-width: 1200px) {
  .vcbshort-content .container {
    width: 1450px;
  }

  .service-new .container {
    width: 1450px;
  }

  .cargoshort-content .container {
    width: 1600px;
  }

  .shipping-rate .container {
    width: 980px;
  }

  .whyvcb-content .container {
    width: 1320px;
  }

  .flashsale-content .container {
    width: 1250px;
  }

  .vcbmall-content .container {
    width: 1250px;
  }

  .svcargo-content .container {
    width: 1130px;
  }

  .trickcal-content .container {
    width: 990px;
  }

  .howto-cargo .container {
    width: 1200px;
  }

  .howto-cnpay .container {
    width: 1060px;
  }

  .contact-footer .container {
    width: 1160px;
  }

  .flashsale-page .container {
    width: 1250px;
  }

  .advert-content .container {
    /* width: 1180px; */
    width: 1550px;
    max-width: 100%;
  }

  .vcbmall-page .container {
    width: 1250px;
  }

  .recommend-content .container {
    width: 1250px;
  }

  .recproduct-content .container {
    width: 1250px;
  }

  .socialvideo-content .container {
    width: 1450px;
  }

  .howto-section .container {
    width: 1650px;
  }
}

@media (min-width: 768px) {
  .col-sm-2s {
    width: 25%;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
  }
}

/* footer style */
.vcb-footer {
  background-color: #fafafa;
  color: #999 !important;
  border-top: 1px solid #e3e0e0;
}

.vcb-footer .footer-body {
  display: flex;
  flex-wrap: nowrap;
  margin-top: 20px;
  margin-bottom: 40px;
}

.vcb-footer .footer-body .footer-item {
  width: 25%;
  border-right: 1px solid #e3e0e0;
}

.vcb-footer .footer-body .footer-item:last-child {
  border: unset;
}

.vcb-footer .footer-body .footer-item .ft-title {
  text-align: center;
  margin-bottom: 30px;
}

.vcb-footer .footer-body .footer-item .ft-box {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
}

.vcb-footer .footer-body .footer-item .ft-box .box-list {
  text-align: center;
}

.footer-item a {
  text-decoration: unset;
  color: #999;
}

.footer-item a:hover {
  color: #f5851f;
}

.box-list img {
  width: 41px;
  margin-bottom: 4px;
}

.vcb-footer .footer-body .footer-item .ft-app {
  display: flex;
  flex-wrap: nowrap;
}

.ft-app .ft-boxapp {
  padding: 5px;
  border-right: 1px solid #e3e0e0;
}

.ft-app .ft-boxapp img {
  width: 92px;
}

.ft-app .ft-description {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  padding: 0px 5px;
  align-items: center;
}

.vcb-footer .footer-body .footer-item .ft-body {
  padding-left: 20px;
}

.ft-body .ft-info span {
  color: #f5851f;
}

.ft-body .ft-timing {
  margin-top: 15px;
  font-size: 12px;
  font-weight: bold;
}

.vcb-footer .footer-word {
  font-size: 20px;
  margin-bottom: 30px;
}

.vcb-footer .footer-word img {
  width: 30px;
  margin-right: 3px;
}

.vcb-footer .footer-brands {
  padding: 17px 0px;
  border-top: 1px solid #e3e0e0;
}

.vcb-footer .footer-brands > ul {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin: 0;
  justify-content: center;
}

.vcb-footer .footer-brands > ul > li {
  padding: 0px 9px;
  position: relative;
}

.vcb-footer .footer-brands > ul > li:not(:last-child):after {
  content: "|";
  position: absolute;
  right: -2.5px;
}

.vcb-footer .footer-brands a {
  text-decoration: unset;
  color: #999 !important;
}

.vcb-footer .footer-copy {
  text-align: center;
}

.vcb-footer .footer-copy .other-image {
  padding-top: 15px;
  padding-bottom: 35px;
}

.vcb-footer .footer-copy .other-image img {
  height: 35px;
}

@media (max-width: 1200px) {
  .page-menu {
    width: 21%;
  }

  .page-content {
    width: 79%;
  }
}

@media (max-width: 992px) {
  .page-menu {
    width: 27%;
  }

  .page-content {
    width: 77%;
  }
}

/* mobile responsive */
@media (max-width: 767px) {
  body {
    padding-top: 98px !important;
  }

  /* header style */
  .container {
    padding-left: 10px;
    padding-right: 10px;
  }

  .header-promotion {
    display: none;
  }

  .head-logo {
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
  }

  .head-logo img {
    height: 35px;
  }

  .header-content {
    display: block;
    padding: 10px 0px;
  }

  .mobile-nav .mobile-menu {
    font-size: 19px;
    padding: 2px 10px;
    border: 1px solid #e2e2e2;
  }

  .mobile-nav .dropdown-menu {
    left: unset;
    right: 0;
  }

  .mobile-nav .dropdown-menu > li > a {
    padding: 5px 15px;
  }

  .head-search {
    width: 100%;
  }

  .head-search .input-search {
    padding: 5px 10px;
  }

  .head-search .btn-search {
    padding: 6px 20px;
  }

  .nav-top .nav-lang {
    font-size: 12px;
  }

  /* content style */
  .category-section {
    display: none;
  }

  .carousel-inner .banner-image {
    display: flex;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    height: unset;
  }

  .banner .carousel-inner .banner-image img {
    height: 200px;
  }

  .custom-banner {
    display: block;
    height: auto;
    background-position: right;
    padding: 20px 0px;
  }

  .problem-container .pb-head {
    font-size: 38px;
  }

  .problem-container .head-search {
    width: 100%;
    float: unset;
    margin-top: 30px;
  }

  .problem-container .head-search .btn-search {
    padding: 5.8px 15px;
  }

  .vcb-paging > ul > li > a {
    padding: 3px 8px;
    margin-right: 3px;
    font-size: 12px;
    border-radius: 3px;
  }

  .vcb-paging i {
    font-size: 13px !important;
  }

  .freight-banner {
    height: 180px;
  }

  .freight-banner .freight-container {
    margin: unset;
  }

  .freight-banner .freight-container .fe-head {
    font-size: 24px;
    line-height: 24px;
  }

  .freight-banner .freight-container .fe-des {
    font-size: 16px;
    opacity: 0.7;
  }

  .freight-content .freight-box {
    margin-top: 15px;
  }

  .freight-content .result-box {
    height: 60px;
  }

  .freight-content .result-box .result-rank {
    padding: 0px 5px;
  }

  .freight-content .result-box .result-rankbar {
    padding: 0px 10px;
  }

  .freight-content .result-box .result-rankbar .rank-name {
    font-size: 9px;
  }

  .freight-content .result-box .result-rank .rs-more {
    font-size: 16px;
  }

  .freight-content .result-box .result-rankbar .progress-length {
    width: 100%;
  }

  .freight-content .result-box .result-rankbar .progress .pg-popover {
    display: none;
  }

  .freight-content .result-box .result-rank .rs-text {
    font-size: 9px;
  }

  .freight-content .result-box .result-rank {
    width: 35%;
  }

  .freight-content .result-box .result-rankbar {
    width: 65%;
  }

  .freight-content .result-box .result-rankbar .rank-list {
    width: 100%;
  }

  .freight-content .freight-result {
    margin: 15px 0px;
  }

  .freight-content .freight-result .fr-lab {
    margin: unset;
  }

  .freight-content .freight-result .fr-name {
    display: none;
  }

  .freight-content .freight-result .fr-badge {
    margin: unset;
    padding: 0px 10px;
  }

  .freight-content .fr-group {
    display: flex;
    margin-bottom: 10px;
    justify-content: space-between;
    align-items: center;
  }

  .freight-content .freight-body .fr-form-group {
    padding-top: 0px;
  }

  .fr-form-group > .lab-sec {
    display: block;
    text-align: center;
    margin-bottom: 20px !important;
  }

  .normal-section {
    overflow: hidden;
  }

  .page-main {
    display: block;
  }

  .page-menu {
    width: 100%;
    margin-right: unset;
    border-radius: 5px;
    margin-bottom: 15px;
  }

  .page-menu .menu-tab {
    padding: 15px;
    display: none;
    overflow: hidden;
  }

  .page-menu .menu-logo {
    height: 40px;
    justify-content: space-between;
    padding: 0px 0px 0px 15px;
  }

  .page-menu .menu-logo .m-nav {
    display: block;
  }

  .page-content {
    width: 100%;
  }

  .page-content .box-left,
  .page-content .box-right {
    padding-left: 15px;
    padding-right: 15px;
  }

  .page-menu .menu-tab .menu-tab-item .tab-item-content > .active:before {
    left: -15px;
  }

  .page-content .profile-content {
    padding-bottom: 20px;
    border-bottom: 1px solid #ebeef5;
  }

  .ps-content {
    padding-top: 40px;
  }

  .ps-content .stepbar {
    width: unset;
  }

  .stepbar .stepbar-item:not(:last-child):after {
    width: 100px;
    right: -100px;
  }

  /* step1 */
  .step1 .stepbar-item:first-child:first-child:before {
    width: 50px;
    right: -100px;
  }

  .step1 .stepbar-item:first-child:first-child:after {
    width: 50px;
    right: -50px;
  }

  /* step2 */
  .step2 .stepbar-item:nth-child(2):after {
    width: 50px;
    right: -50px;
  }

  .step2 .stepbar-item:nth-child(2):before {
    width: 50px;
    right: -100px;
  }

  .address-content {
    padding: 15px !important;
  }

  .address-content .btn {
    margin-top: unset;
  }

  .address-content .addressDetail {
    width: 100%;
  }

  .address-content .addressDetail .tips {
    font-size: 10px;
  }

  .address-content .address-table {
    font-size: 12px;
  }

  .address-table .address-detail {
    width: 180px;
  }

  .advert-top {
    padding: 15px 0px;
    display: block;
  }

  .advert-top .addvert-box {
    margin-bottom: 15px;
  }

  .floorList {
    padding-top: 10px;
  }

  .goodsList .gl-content .activity img {
    width: 100%;
  }

  .goodsList .gl-content .goods {
    width: 49%;
  }

  .goodsList .gl-content .goods .images img {
    width: 100%;
    height: unset;
  }

  .goodsList .gl-content .goods .images {
    padding: 10px 0px;
  }

  .goodsList .gl-content .goods .images .left-tags {
    top: 10px;
    font-size: 12px;
  }

  .goodsList .gl-content .goods .goods-bottom {
    font-size: 12px;
  }

  .goodsList .gl-content .goods .goods-bottom .buttons .link {
    margin-left: 7px;
  }

  .goodsList .gl-content .goods .goods-bottom .buttons .gl-bt {
    padding: 2px 7px;
  }

  .dont-miss {
    display: none;
  }

  .promotionList {
    padding-bottom: unset;
  }

  .promotionList .pro-content {
    flex-wrap: wrap;
  }

  .promotionList .pro-content .goodsBox {
    width: 100%;
    margin-bottom: 20px;
  }

  .promotionList .pro-content .goodsBox .big {
    height: unset;
  }

  .promotionList .pro-content .bigBox {
    padding: 15px;
    font-size: 12px;
  }

  .promotionList .pro-content .bigBox .goods-item img {
    width: 100%;
    height: unset;
  }

  .conventional .image-item {
    width: 48.9%;
  }

  .conventional .image-item img {
    height: unset;
  }

  .recommend .rc-content {
    flex-wrap: wrap;
  }

  .recommend .rc-content .rc-goods {
    width: 100%;
    margin-bottom: 20px;
  }

  .recommend .rc-content .rc-goods .image-left {
    min-width: unset;
    width: 100%;
    height: 405px;
    object-fit: unset;
  }

  .recommend .rc-content .rc-goods .goodsBox {
    padding: 13px;
    font-size: 12px;
  }

  .recommend .rc-content .rc-goods .goodsBox .goods-item img {
    height: unset;
  }

  .table-responsive {
    border: unset;
    margin-bottom: unset;
    overflow-y: auto;
  }

  .alertError {
    font-size: 12px;
  }

  .page-box .head-column {
    display: block !important;
  }

  .page-box .head-column span,
  .page-box .head-column a {
    display: inline-block;
  }

  .pc-right {
    text-align: left;
  }

  .or-table .imgDetail {
    height: unset;
  }

  .or-table .imgDetail .more-detail-bt .detail-box {
    padding: 10px 15px;
    top: -55px;
  }

  .detail-box .timeline .tl-created {
    font-size: 12px;
  }

  .detail-box .timeline .tl-status {
    font-size: 14px;
  }

  .detail-box .separate {
    padding-left: 28px;
  }

  .order-created .order-action {
    top: 0px;
  }

  .modal-vcb .modal-footer .checkbox {
    float: unset;
    text-align: left;
    margin-bottom: 20px;
  }

  .payment-content .alertError {
    padding: unset;
    font-size: 12px;
    text-align: center;
  }

  .payment-content .payment-body {
    padding: 20px 10px;
  }

  .payment-content .payment-body .remark {
    display: block;
  }

  .payment-content .payment-body .remark .remark-title {
    margin-bottom: 5px;
  }

  .payment-content .payment-body .couponData .form-control {
    width: 100%;
    margin-top: 5px;
  }

  .payment-content .payment-body .couponData .code-status {
    margin-left: unset;
    display: block;
    margin-top: 5px;
  }

  .payment-content .payment-paynow {
    padding: 0px 20px 20px;
  }

  .payment-content .payment-bottom {
    padding: 20px;
  }

  .payment-content .payment-paynow .actualPayment {
    line-height: normal;
    padding-top: 10px;
  }

  .payment-content .payment-paynow .actualPayment .notEnoughTip {
    line-height: 40px;
  }

  .vertical-item-inner-left .left-content {
    width: auto;
  }

  .box-card-content .box-card-content-item {
    padding: 15px 0 15px 15px;
    font-size: 13px;
  }

  .box-card-content .box-card-content-vertical-item:not(:last-child):after {
    width: 90%;
  }

  .page-content .box-center-left {
    padding-left: 15px;
  }

  .page-content .box-center-right {
    padding-right: 15px;
  }

  .page-content .topBox .levelDetail .levelIcon .nowLevel:first-child {
    padding-left: 38px;
  }

  .page-content .topBox .levelDetail .levelIcon .nowLevel .nowline {
    width: 88px;
  }

  .page-box .tab-menu,
  .page-box .tab-menu2 {
    padding: 10px !important;
  }

  .page-box .tab-menu > ul > li,
  .page-box .tab-menu2 > ul > li {
    font-size: 12px;
    padding: 0px 10px;
  }

  .page-box .tab-menu .active:after {
    top: 43px !important;
  }

  .page-box .tab-menu2 .active:after {
    top: 26px;
  }

  .page-content .table-box {
    height: unset;
    overflow-x: auto;
  }

  /* vcb-table */
  .vcb-table {
    font-size: 12px;
  }

  .vcb-table > thead {
    height: unset;
  }

  .vcb-table > tbody > tr > td {
    padding: 8px;
  }

  /* end */

  .withdraw-content .wd-form {
    padding: 10px;
  }

  .withdraw-content .wd-form .deposite_input .form-control {
    width: 100%;
  }

  .page-content .withdraw-content {
    padding-top: 15px;
  }

  .addbank-box {
    margin-bottom: 120px !important;
  }

  .refill-box .page-body {
    padding: 15px !important;
  }

  .refill-box .refill-topbar {
    margin-bottom: 15px;
  }

  .refill-box .refill-topbar .rtb-body {
    padding: 10px 0px;
  }

  .refill-box .refill-body .rb-body {
    display: block;
    padding-top: 20px;
    padding-bottom: 30px;
  }

  .refill-box .refill-body .rb-body .rb-lab {
    margin-bottom: 20px;
    width: auto;
  }

  .refill-box .refill-body .rb-body .rb-list {
    width: auto;
  }

  .refill-box .refill-body .rb-body .rb-list .refill-item .bank-icon {
    height: 35px;
    margin: 0 10px;
  }

  .refill-box
    .refill-body
    .rb-body
    .rb-list
    .refill-item
    .bank-info
    .bank-name
    span {
    margin-left: 4px;
    font-size: 12px;
  }

  .refill-box .refill-body .rb-body .rb-list {
    font-size: 15px;
  }

  .refill-box
    .refill-body
    .rb-body
    .rb-list
    .refill-item
    .bank-info
    .bank-name
    .btn {
    margin: 4px 0px;
    display: block;
  }

  .refill-box .refill-body .rb-form .rf-form-group .rf-lab {
    width: 30%;
    font-size: 12px;
  }

  .refill-box .refill-body .rb-form .rf-form-group .rf-input {
    width: 70%;
  }

  .refill-box .refill-body .rb-form .rf-form-group .rf-input .form-control {
    width: 100%;
  }

  .refill-box .refill-body .rb-form .rf-form-group .rf-input .card-upload {
    width: 120px;
    height: 120px;
  }

  .refill-box .refill-body .rb-form .rf-form-group .rf-input .preview {
    font-size: 12px;
  }

  .coupon-content .nav-tabs > li > a {
    padding: 10px 5px;
    font-size: 11px;
  }

  .coupon-content .nav-tabs a span {
    margin-left: 5px;
  }

  .page-content .vcb-address .addressInfo {
    display: block;
  }

  .page-content .vcb-address .addressInfo .into-text {
    align-items: unset;
  }

  .page-content .vcb-address .addressInfo .into-text i {
    font-size: 14px;
    margin-top: 4px;
  }

  .page-content .vcb-address .addressInfo .info-update {
    text-align: right;
    font-size: 14px;
    margin-top: 20px;
  }

  .page-content .goods-box .page-body {
    padding: 10px;
  }

  .page-content .goods-box .goods-item {
    display: block;
    height: auto;
    padding: 10px;
    line-height: 55px;
  }

  .page-content .goods-box .goods-item .goods-details {
    width: 100%;
  }

  .page-content .goods-box .goods-item .goods-info {
    width: 100%;
  }

  .page-content .goods-box .goods-item .goods-info .delete {
    margin-left: 10px;
    margin-right: 10px;
  }

  .page-content .goods-box .goods-item .goods-info span {
    margin: 0px 8px;
  }

  .page-content .contract-form .cf-group .form-control {
    margin: unset;
  }

  .page-content .goods-box .page-form {
    padding: 10px;
  }

  .page-content .contract-form .cf-group span {
    width: 120px;
  }

  .page-content .contract-form .cf-group:not(:last-child) {
    margin-bottom: 20px;
  }

  .page-content .page-form .title {
    margin-bottom: 18px;
  }

  .page-content .page-body > .title2,
  .page-content .page-form > .title2 {
    display: block;
  }

  .goods-box .goods-action {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    overflow: auto;
    height: 32px;
  }

  .mbbox-topbar .mbbox .mbbox-check {
    padding-left: unset;
  }

  .mbbox-body {
    padding: 10px !important;
  }

  .mbbox-topbar .mbbox .mbbox-head {
    padding: 0px 5px;
  }

  .mbbox-topbar .mbbox .mbbox-head .mbbox-detail {
    display: block;
  }

  .mbbox-topbar .mbbox .mbbox-head .mbbox-detail .mb-status {
    text-align: right;
  }

  .mbbox-topbar .mbbox .mbbox-head .mbbox-detail .mb-detail {
    display: block;
  }

  .mbbox-bottom .mb-total .dropdown .dropdown-menu {
    padding: 10px;
    width: 240px;
    font-size: 12px;
    margin-top: 5px;
  }

  .mb-table tr:last-of-type .mbbox-bottom .mb-total .dropdown .dropdown-menu {
    top: -205px;
  }

  .mb-table
    tr:last-of-type
    .mbbox-bottom
    .mb-total.dis1
    .dropdown
    .dropdown-menu {
    top: -225px;
  }

  .mb-table
    tr:last-of-type
    .mbbox-bottom
    .mb-total.dis2
    .dropdown
    .dropdown-menu {
    top: -240px;
  }

  .mb-footer {
    font-size: 13px;
    height: 50px;
    padding-left: 7px;
    bottom: 83px;
  }

  .mb-footer .mb-ckbox label {
    padding-left: 7px;
  }

  .mb-footer .mb-gtotal {
    white-space: nowrap;
  }

  .mb-footer .mb-gtotal span {
    margin-right: 7px;
  }

  .mb-footer .mb-gtotal .bt-gtotal {
    width: auto;
    padding: 0px 10px;
    height: 50px;
  }

  .product-content {
    justify-content: space-between;
  }

  .product-content .listLi {
    margin-left: unset;
    width: 48.5%;
    height: 270px;
  }

  .product-content .listLi img {
    width: 100%;
    height: 190px;
  }

  .container .page-group {
    padding-bottom: unset;
  }

  /* vcanbuy new style */
  .vcb-menuleft,
  .vcb-menuright,
  .vcb-menuquestion {
    display: none;
  }

  .navtop-mobile {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0px;
    width: 100%;
    height: 98px;
    z-index: 100;
    background: #ff7e00;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  }

  .navtop-mobile .nav-search {
    padding: 3px 40px 10px 40px;
  }

  .navtop-mobile .nav-search .input-search {
    box-shadow: unset;
    border: unset;
    height: 30px;
    font-size: 11px;
    padding: 0px 12px 0px 15px;
    border-radius: 50px 0px 0px 50px;
  }

  .navtop-mobile .nav-search .btn-search {
    height: 30px;
    background-color: #9a9a9a;
    color: #fff;
    width: 41.23px;
    padding: unset;
    padding-right: 3px;
    border-radius: 0px 50px 50px 0px;
  }

  .navtop-mobile .nav-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    height: 100%;
  }

  .navtop-mobile .nav-content .nav-left {
    width: 64.5px;
    position: relative;
    text-align: center;
  }

  .navtop-mobile .nav-content .nav-left .dropdown-menu {
    margin-top: -1px;
    border-radius: 0px 24px 24px 24px;
    padding: 20px 15px;
    width: 245px;
    box-shadow: 0px 64px 64px -32px rgba(102, 37, 0, 0.56);
    border: unset;
    height: 530px;
  }

  .navtop-mobile .nav-content .nav-left .dropdown-menu.cargo-menu {
    padding: 20px 15px;
    width: 270px;
  }

  /* .navtop-mobile .nav-content .nav-left .dropdown-menu:before {
    content: "";
    width: 64.5px;
    height: 25px;
    position: absolute;
    background: #fff;
    left: 0;
    top: -22px;
  } */

  .navtop-mobile .nav-content .nav-left .dropdown-menu > li > a {
    padding: 12px 20px;
    border-radius: 10px;
  }

  .navtop-mobile .nav-content .nav-left .dropdown-menu > li > a.active,
  .navtop-mobile .nav-content .nav-left .dropdown-menu > li > a:hover {
    background: #e6e7e8;
    font-weight: 500;
    color: #000;
  }

  .navtop-mobile .nav-content .nav-left .menu-bt {
    width: 100%;
    height: 55px;
    background-color: transparent;
    padding: unset;
    border: unset;
    border-radius: 28px 28px 0px 0px;
  }

  .navtop-mobile .nav-content .nav-left .menu-bt img {
    content: url("/img/nav-white.svg");
    width: 28px;
  }

  .navtop-mobile .nav-content .nav-left.open .menu-bt {
    background-color: #fff;
  }

  .navtop-mobile .nav-content .nav-left.open .menu-bt img {
    content: url("/img/nav-dark.svg");
    width: 21.52px;
  }

  .navtop-mobile .nav-content .nav-left .dropdown-menu .addline-menu {
    position: absolute;
    width: 215px;
    bottom: 15px;
  }

  .navtop-mobile
    .nav-content
    .nav-left
    .dropdown-menu
    .addline-menu
    .addline-group {
    display: flex;
    align-items: center;
    padding: 5px 15px;
  }

  .navtop-mobile
    .nav-content
    .nav-left
    .dropdown-menu
    .addline-menu
    .addline-group
    .logo
    img {
    width: 36px;
  }

  .navtop-mobile
    .nav-content
    .nav-left
    .dropdown-menu
    .addline-menu
    .addline-group
    .des {
    white-space: normal;
    color: #818181;
    font-weight: 400;
    line-height: 18px;
    margin-left: 5px;
  }

  .navtop-mobile
    .nav-content
    .nav-left
    .dropdown-menu
    .addline-menu
    .addline-group
    .finger {
    position: absolute;
    right: 0px;
    top: 5px;
  }

  .navtop-mobile
    .nav-content
    .nav-left
    .dropdown-menu
    .addline-menu
    .addline-group
    .finger
    img {
    width: 42px;
  }

  .navtop-mobile .nav-content .vcbnew-logo {
    width: 100%;
    text-align: center;
    position: absolute;
    z-index: 0;
  }

  /* .navtop-mobile .nav-content .vcbnew-logo {
    left: 32.5%;
    text-align: center;
    position: absolute;
  } */

  .navtop-mobile .nav-content .vcbnew-logo img {
    width: 135px;
  }

  .navtop-mobile .nav-content .nav-right {
    display: flex;
    align-items: center;
    padding-right: 7px;
  }

  .navtop-mobile .nav-content .nav-right .menuLang {
    position: relative;
    width: 50px;
  }

  .navtop-mobile .nav-content .nav-right .menuLang .dropdown-menu {
    margin-top: -1px;
    border-radius: 28px 0px 28px 28px;
    padding: 20px 15px;
    width: 201px;
    box-shadow: 0px 64px 64px -32px rgba(102, 37, 0, 0.56);
    border: unset;
    left: -142px;
  }

  .navtop-mobile .nav-content .nav-right .menuLang .dropdown-menu > li > a {
    border-radius: 12px;
    height: 51px;
    padding: unset;
    display: flex;
    align-items: center;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuLang
    .dropdown-menu
    > li
    > a
    > img {
    width: 37.5px;
    margin: 0px 20px 0px 15px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuLang
    .dropdown-menu
    > li
    > a.active,
  .navtop-mobile
    .nav-content
    .nav-right
    .menuLang
    .dropdown-menu
    > li
    > a:hover {
    background: #e6e7e8;
    font-weight: 500;
    color: #000;
  }

  .navtop-mobile .nav-content .nav-right .menuLang .menulang-bt {
    width: 59px;
    height: 55px;
    background-color: transparent;
    border-radius: 28px 28px 0px 0px;
    padding: unset;
    border: unset;
  }

  .navtop-mobile .nav-content .nav-right .menuLang.open .menulang-bt {
    background-color: #fff;
  }

  .navtop-mobile .nav-content .nav-right .menuLang .menulang-bt img {
    content: url("/img/lang-white.svg");
    width: 31px;
  }

  .navtop-mobile .nav-content .nav-right .menuLang.open .menulang-bt img {
    content: url("/img/lang-dark.svg");
    width: 41px;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile {
    position: relative;
    width: 60px;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile .menuProfile-bt {
    width: 63px;
    height: 55px;
    background-color: transparent;
    border-radius: 28px 28px 0px 0px;
    padding: unset;
    border: unset;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile.open .menuProfile-bt {
    background-color: #fff;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile .dropdown-menu {
    margin-top: -1px;
    border-radius: 28px 0px 28px 28px;
    padding: 20px 25px;
    width: 260px;
    box-shadow: 0px 64px 64px -32px rgba(102, 37, 0, 0.56);
    border: unset;
    left: -197px;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile .dropdown-menu > li > a {
    border-radius: 12px;
    color: #676767;
    padding: 15px 20px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    > li
    > a
    > img {
    width: 37.5px;
    margin: 0px 20px 0px 15px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    > li
    > a.active,
  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    > li
    > a:hover {
    background: #e6e7e8;
    color: #000;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile .menuProfile-bt img {
    content: url("/img/user-white.svg");
    width: 41px;
  }

  .navtop-mobile .nav-content .nav-right .menuProfile.open .menuProfile-bt img {
    content: url("/img/user-dark.svg");
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    .login-action {
    text-align: center;
    padding: 10px 0px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    .login-action
    .bt-action {
    width: 160.63px;
    height: 41.68px;
    padding: unset;
    border: unset;
    color: #fff;
    background: #ff7e00;
    border-radius: 18.5px;
    font-size: 20px;
    font-weight: 300;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    .login-action
    .bt-action:hover {
    background: #e16f00;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu
    .login-action
    .bt-action
    img {
    width: 18.52px;
    margin-right: 10px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb {
    /* height: 587px; */
    height: auto;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    > li
    > a {
    display: flex;
    align-items: center;
    font-size: 16px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    > .logout {
    position: absolute;
    bottom: 20px;
    width: 210px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .icon {
    width: 38px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .icon
    img {
    height: 19px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 10px 20px 0px;
    position: relative;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-vector {
    width: 48px;
    height: 48px;
    background: #ff7e00;
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-vector
    img {
    width: 21px;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-vector
    .avatar-img {
    width: 42px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-info
    .ac-name {
    font-size: 20px;
    font-weight: 500;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-info
    .ac-name
    a {
    color: #000;
    text-decoration: unset;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-top
    .ac-info
    .ac-level {
    font-size: 13px;
    color: #808080;
  }

  .navtop-mobile
    .nav-content
    .nav-right
    .menuProfile
    .dropdown-menu.account-menu-mb
    .ac-dash
    img {
    width: 100%;
  }

  .menu-mobile {
    display: block;
    position: fixed;
    width: 100%;
    height: 83px;
    z-index: 100;
    background: #fff;
    bottom: -1px;
    overflow: hidden;
    padding: 0px 5px;
    box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.05);
  }

  .menu-mobile .mb-list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    height: 100%;
  }

  .menu-mobile .mb-list .mb-item {
    width: 20%;
    text-decoration: unset;
    text-align: center;
  }

  .menu-mobile .mb-list .mb-item .title {
    color: #808080;
    font-size: 12px;
  }

  .menu-mobile .mb-list .mb-item.active .title {
    color: #ff7e00;
  }

  .menu-mobile .mb-list .mb-item img {
    height: 32px;
    margin-bottom: 6px;
  }

  /* mb1 */
  .menu-mobile .mb-list .mb-item .mb1 {
    content: url("/image/icon/menu1a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb1 {
    content: url("/image/icon/menu1b.png");
  }

  /* mb2 */
  .menu-mobile .mb-list .mb-item .mb2 {
    content: url("/image/icon/menu2a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb2 {
    content: url("/image/icon/menu2b.png");
  }

  /* mb3 */
  .menu-mobile .mb-list .mb-item .mb3 {
    content: url("/image/icon/menu3a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb3 {
    content: url("/image/icon/menu3b.png");
  }

  /* mb4 */
  .menu-mobile .mb-list .mb-item .mb4 {
    content: url("/image/icon/menu4a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb4 {
    content: url("/image/icon/menu4b.png");
  }

  /* mb5 */
  .menu-mobile .mb-list .mb-item .mb5 {
    content: url("/image/icon/menu5a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb5 {
    content: url("/image/icon/menu5b.png");
  }

  /* mb6 */
  .menu-mobile .mb-list .mb-item .mb6 {
    content: url("/image/icon/menu6a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb6 {
    content: url("/image/icon/menu6b.png");
  }

  /* mb7 */
  .menu-mobile .mb-list .mb-item .mb7 {
    content: url("/image/icon/menu7a.png");
  }

  .menu-mobile .mb-list .mb-item.active .mb7 {
    content: url("/image/icon/menu7b.png");
  }

  .banner-new {
    display: block;
  }

  .section {
    font-size: 40px;
  }

  .service-content {
    padding: 20px 0px 40px 0px;
  }

  .service-list .service-item {
    margin-right: unset;
    margin-bottom: 50px;
  }

  .service-list .service-item:last-child {
    margin-bottom: unset;
  }

  .advert-content {
    padding: unset;
  }

  .advert-content .advert-top {
    padding: 15px 0px;
    display: block;
  }

  .advert-content .advert-top .addvert-box {
    margin-bottom: 15px;
  }

  .vcbshort-content {
    padding: 50px 0px 30px 0px;
    text-align: center;
  }

  .vcbshort-content .vcbdes {
    padding: unset;
  }

  .vcbshort-content .vcbdes .vcb-name {
    font-size: 40px;
  }

  .vcbshort-content .vcbdes .vcb-des {
    padding: unset;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .vcbshort-content .vcbdes .comp-group {
    padding: unset;
    width: 280px;
  }

  .vcbshort-content .vcbdes .comp-group .comp-item .comp-img {
    width: 70.7px;
    height: 70.7px;
  }

  .vcbshort-content .vcbdes .comp-group .comp-item .comp-img:hover img {
    width: 85px;
    height: 85px;
    left: -7px;
    top: -10px;
  }

  .vcbshort-content .vcbdes .comp-group .comp-item .comp-name {
    font-size: 16px;
    font-weight: 700;
  }

  .vcbshort-content.new {
    padding: 30px 0px 50px 0px;
  }

  .vcbshort-content.new .vcbdes .vcb-des {
    font-size: 18px;
  }

  .vcbshort-content.new .vcbdes .vcb-tail {
    font-size: 24px;
    line-height: 30px;
    color: #ff9900;
    font-weight: 600;
    padding-left: unset;
    margin-bottom: 10px;
  }

  .vcbshort-content.new .main-img {
    margin-bottom: 10px;
  }

  .vcbshort-content.new .serv-item {
    margin-top: 35px;
  }

  .tabline {
    height: 8px;
    background: radial-gradient(
      50% 50% at 50% 50%,
      #a5a5a5 0%,
      rgba(80, 28, 28, 0) 100%
    );
    opacity: 0.24;
    margin-bottom: 25px;
  }

  .vcbshort-content.new .serv-item img {
    height: 226px;
    margin-bottom: 20px;
  }

  .vcbshort-content.new .serv-item .title {
    font-size: 24px;
    font-weight: 700;
    color: #ff9900;
    margin-bottom: 10px;
  }

  .vcbshort-content.new .serv-item .des {
    font-size: 18px;
    line-height: 24px;
    color: #484848;
    margin-bottom: 17px;
  }

  .vcbshort-content.new .serv-item .des b {
    font-weight: 600;
  }

  .vcbshort-content.new .serv-item .action {
    display: flex;
    justify-content: center;
  }

  .vcbshort-content.new .serv-item .serv-button {
    font-size: 22px;
    line-height: 24px;
    font-weight: 700;
    color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 182px;
    height: 53px;
    background: linear-gradient(180deg, #ffc700 0%, #ff9900 100%);
    border-radius: 100px;
    text-decoration: unset;
    transition: 0.2s;
  }

  .vcbshort-content.new .serv-item .serv-button:active {
    opacity: 0.7;
  }

  .cargoshort-content {
    padding: 60px 0px 40px 0px;
  }

  .cargoshort-content .vcbdes {
    padding: unset;
    text-align: center;
  }

  .cargoshort-content .vcbdes .vcb-name {
    font-size: 40px;
  }

  .cargoshort-content .main-img {
    padding-top: 26px;
  }

  .cargoshort-content .vcbdes .vcb-des {
    margin: 18px 0px;
    padding: unset;
  }

  .cargoshort-content .vcbdes .vcb-svbox {
    justify-content: center;
  }

  .cargoshort-content .vcbdes .vcb-svbox .sv-item {
    width: 135.35px;
  }

  .cargoshort-content .vcbdes .vcb-svbox .sv-item .sv-text {
    font-size: 18px;
    height: 105px;
  }

  .cargoshort-content .vcbdes .vcb-svbox .sv-item:hover .sv-text {
    font-size: 20px;
  }

  .cargoshort-content .vcbdes .vcb-svbox .sv-item:first-child {
    margin-left: unset;
  }

  .cargoshort-content .vcbdes .vcb-svbox .sv-item .sv-under .sv-click {
    height: 27px;
    width: 70%;
  }

  .shipping-timing {
    padding: 40px 0px;
  }

  .shipping-timing .sp-content {
    margin: unset;
  }

  .shipping-timing .sp-content img {
    margin-top: -35px;
  }

  .shipping-rate {
    padding: 40px 0px 20px 0px;
  }

  .sr-content {
    text-align: center;
  }

  .sr-content img {
    width: 90%;
  }

  .sr-content .sr-subject .subject-item {
    width: 100%;
    margin-bottom: 15px;
  }

  .shipping-cal {
    padding: 40px 0px;
  }

  .shipping-cal .section {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .shipping-cal .howto-content .subject-list {
    padding-left: 20%;
  }

  .shipping-cal .howto-img {
    padding-right: unset;
    margin: 20px 0px 30px 0px;
  }

  .shipping-cal .howto-bottom .box-des {
    font-size: 18px;
    font-weight: 500;
  }

  .shipping-cal .howto-img img {
    width: 281.84px;
  }

  .shipping-cal .howto-bottom .box-des-box {
    width: 100%;
    font-size: 16px;
    height: 64px;
    margin-bottom: 20px;
  }

  .product-exam {
    padding: 30px 0px;
  }

  .product-exam .container {
    padding: unset;
  }

  .product-exam .section {
    font-size: 32px;
  }

  .product-exam .exam-card {
    scale: 0.8;
    width: 227px;
    height: 377px;
    background: #d9d9d9;
    border-radius: 18px;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    overflow: hidden;
    opacity: 0.5;
    transition: all ease 0.4s;
  }

  .product-exam .exam-card .panel-body {
    height: 100%;
  }

  .product-exam .owl-item.active .exam-card {
    scale: 1;
    opacity: 1;
  }

  .product-exam .slide-content {
    height: 420px;
  }

  .product-exam .exam-card img {
    margin: 30px 0px 20px 0px;
    width: 100%;
    height: auto;
  }

  .product-exam .exam-card h3 {
    font-size: 24px;
  }

  .product-exam .exam-card span {
    font-size: 16px;
  }

  .product-exam .pde-bottom {
    margin-top: unset;
  }

  .product-exam .pde-bottom .pde-bt {
    width: 317px;
    height: 66px;
    font-size: 24px;
  }

  .whyvcb-content {
    padding: 40px 0px 10px 0px;
  }

  .whyvcb-content .section {
    font-size: 36px;
    margin-bottom: 30px;
  }

  .whyvcb-content .section .concise {
    margin-top: 25px;
    font-size: 22px;
  }

  .whyvcb-content .wv-list {
    padding-left: unset;
  }

  .whyvcb-content .wv-list .wv-item {
    width: 50%;
    flex-direction: column;
  }

  .whyvcb-content .wv-list .wv-item img {
    margin-bottom: 5px;
  }

  .whyvcb-content .wv-list .wv-item .wv-des {
    padding-left: unset;
    text-align: center;
  }

  .flashsale-content {
    padding: 0px 0px 15px 0px;
    border-width: 2px;
  }

  .flashsale-content .container {
    padding-left: 10px;
    padding-right: 10px;
  }

  .con-nav .con-title .con-name {
    font-size: 24px;
  }

  .con-nav .con-title .con-name img {
    width: 20px;
  }

  .con-nav a {
    font-size: 20px;
  }

  .flashsale-content .con-nav .con-title .con-name {
    font-size: 24px;
    line-height: 26px;
    display: block;
    padding: 5px 15px;
    border-radius: 0px 0px 10px 0px;
  }

  .flashsale-content .con-nav .con-title .con-name img {
    height: 42px;
    width: 21px;
    height: auto;
    margin-left: 5px;
  }

  .flashsale-content .con-nav .con-title .con-name.con-pet img {
    height: 22px;
    margin-left: 5px;
    margin-bottom: 3px;
  }

  .flashsale-content .con-nav {
    margin-bottom: 25px;
    margin-left: -10px;
  }

  .flashsale-content .con-nav.fs-margin {
    margin-bottom: 70px;
  }

  .goods-list .goods-item {
    width: 100%;
    height: auto;
  }

  .goods-list .goods-item .goods-img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .flashsale-content .goods-list .goods-item {
    margin-bottom: unset;
    padding: 7px;
    height: 257px;
  }

  .goods-list .goods-item .goods-textbox .name {
    font-size: 14px;
  }

  .goods-list .goods-item .goods-textbox .des {
    font-size: 12px;
  }

  .goods-list .goods-item .goods-textbox .campaign-price span:not(:last-child) {
    margin-right: 4px;
  }

  .goods-list .goods-item .goods-textbox .campaign-price .price {
    font-size: 16px;
  }

  .goods-list .goods-item .goods-textbox .campaign-price .dash {
    font-size: 12px;
  }

  .goods-list .goods-item .goods-textbox .campaign-price .off {
    font-size: 12px;
    font-weight: 600;
  }

  .goods-list .goods-item .goods-textbox .button .goods-bt {
    width: 130px;
    font-size: 16px;
  }

  .vcbmall-content {
    padding: 35px 0px 25px 0px;
  }

  .vcbmall-content .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .vcbmall-content .con-nav .con-title .con-name {
    align-items: center;
  }

  .vcbmall-content .con-nav .con-title .con-name img {
    width: 33px;
    height: 32px;
    margin-left: 10px;
  }

  .vcbmall-content .con-nav {
    margin-bottom: 30px;
  }

  .vcbmall-content .vcbm-grid {
    display: block;
  }

  .vcbmall-content .vcbm-grid .vcbm-main {
    width: 100%;
  }

  .vcbmall-content .vcbm-grid .vcbm-sub {
    width: 100%;
    padding-left: unset;
  }

  .vcbm-main .carousel-indicators {
    bottom: -45px;
  }

  .vcbm-sub .goods-list {
    margin-top: 60px;
  }

  .vcbm-sub .goods-list .goods-item {
    margin: unset;
    width: 100%;
    height: auto;
  }

  .vcbm-sub .goods-list .goods-item .goods-img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .vcbm-sub .goods-list .goods-item .goods-textbox .button .goods-bt {
    background: #fff;
  }

  .article-content {
    padding: 50px 0px 40px 0px;
  }

  .article-content .container {
    padding: unset;
  }

  .article-content .section {
    font-size: 32px;
    margin-bottom: 40px;
  }

  .article-content .article-slide .article-box {
    width: 283.36px;
    height: 323px;
    opacity: 0.5;
    transition: all ease 0.4s;
  }

  .article-content .article-slide .owl-item.active .article-box {
    opacity: 1;
  }

  .article-content .article-slide .article-box .arti-img img {
    height: 185px;
  }

  .article-content .article-slide .article-box .arti-detail {
    height: auto;
    padding-top: 5px;
  }

  .article-content .article-slide .article-box .arti-detail .arti-name {
    font-size: 20px;
    line-height: 20px;
  }

  .article-content .article-slide .article-box .arti-detail .arti-des {
    font-size: 14px;
    line-height: 16px;
    line-height: unset;
  }

  .article-content .article-slide .article-box .arti-detail .arti-button {
    bottom: 13px;
  }

  .article-content
    .article-slide
    .article-box
    .arti-detail
    .arti-button.visible-xs,
  .article-content-more
    .article-slide
    .article-box
    .arti-detail
    .arti-button.visible-xs {
    display: flex !important;
  }

  .article-content
    .article-slide
    .article-box
    .arti-detail
    .arti-button
    .arti-bt {
    width: 102px;
    height: 27.16px;
    align-items: center;
  }

  .article-content .article-slide .owl-nav {
    margin-top: 40px;
  }

  .article-content .article-slide .bt-more {
    position: unset;
    background-color: #000;
  }

  #myModalLogin.modal {
    left: 40%;
  }

  .svcargo-content {
    padding: 30px 0px;
  }

  .svcargo-content .svcargo-box .svcargo-body {
    height: auto;
  }

  .svcargo-content .svcargo-box .svcargo-body .svcargo-text {
    height: 260px;
    width: 100%;
    padding: 15px 20px;
  }

  .svcargo-content .svcargo-box .svcargo-body .svcargo-text .title {
    margin: 7px 0px;
    font-size: 24px;
  }

  .svcargo-content .svcargo-box .svcargo-body .svcargo-text .timeline {
    font-weight: 400;
  }

  .svcargo-content .svcargo-box .svcargo-body .svcargo-text .des {
    font-size: 16px;
  }

  .svcargo-content .svcargo-box .svcargo-bottom {
    margin-top: 15px;
    margin-bottom: 45px;
  }

  .cargorate-content {
    overflow: hidden;
  }

  .cargorate-content .section {
    font-size: 36px;
    line-height: 42px;
  }

  .cargorate-content .title {
    margin-top: unset;
  }

  .cargorate-content .ratebox {
    margin-top: 90px;
    font-size: 13px;
  }

  .cargorate-content .ratebox b {
    font-size: 16px;
  }

  .cargorate-content .car {
    width: 230px;
  }

  .cargorate-content .ship {
    width: 267px;
    left: 25px;
  }

  .cargorate-content .rateleft {
    font-size: 13px;
    padding-top: 219px;
    padding-left: unset;
  }

  .cargorate-content .rateleft th,
  .cargorate-content .rateleft td {
    height: 38px;
    padding-right: unset;
    padding-left: unset;
  }

  .cargorate-content .col-xs-3 {
    padding-right: unset;
  }

  .aboutus-cargo .con-boximage {
    display: none;
  }

  .aboutus-cargo .con-title {
    width: 100%;
    left: unset;
    transform: unset;
    top: 215px;
    padding: unset;
    background-color: unset;
    font-weight: 400;
    height: auto;
  }

  .aboutus-cargo .con-title .des {
    font-size: 16px;
  }

  .aboutus-cargo {
    background-image: url("/img/aboutbg-mb.png");
    background-size: 430px auto;
    background-position-y: 0;
    height: 2400px;
  }

  .aboutus-cargo .sv-inner {
    left: unset;
    transform: translateY(3.5%);
    bottom: unset;
    top: 300px;
  }

  .versus-content {
    background-image: url("/img/versus_mb.png");
    background-size: 430px;
    background-position: center;
    min-height: 2260px;
  }

  .versus-content .section {
    font-size: 36px;
  }

  .versus-content .phone-box {
    top: 500px;
    width: 100%;
    left: 0px;
    transform: unset;
  }

  .versus-content .phone-box .vcanbuy,
  .versus-content .phone-box .vcanbuy-cargo {
    width: 100%;
    left: unset;
    right: unset;
    height: 46%;
  }

  .versus-content .phone-box .vcanbuy-cargo {
    top: 47%;
  }

  .versus-content .phone-box .vcanbuy .title,
  .versus-content .phone-box .vcanbuy-cargo .title {
    font-size: 16px;
    width: 80%;
    top: 37px;
  }

  .versus-content .phone-box .vcanbuy .title .head,
  .versus-content .phone-box .vcanbuy-cargo .title .head {
    font-size: 20px;
    font-weight: 600;
  }

  .versus-content .phone-box .vcanbuy .content,
  .versus-content .phone-box .vcanbuy-cargo .content {
    font-size: 17px;
    top: 12%;
  }

  .versus-content .phone-box .vcanbuy .content li:before,
  .versus-content .phone-box .vcanbuy-cargo .content li:before {
    width: 8px;
    height: 8px;
    left: -13px;
    top: 7px;
  }

  .setting-card .settingItem .btn {
    width: 100%;
  }

  .vcb-paging {
    display: block;
  }

  .vcb-paging > ul {
    justify-content: center;
  }

  .vcb-paging .paging-go {
    margin-left: unset;
    margin-top: 15px;
  }

  .vcb-paging .paging-go input {
    width: 70px;
  }

  .trickcargo-content {
    padding: 30px 0px 0px 0px;
  }

  .trickcargo-content .section {
    font-size: 32px;
    margin-bottom: unset;
  }

  .trickcargo-content .pd-type .pd-typeItem {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 0px 30px 0px;
  }

  .trickcargo-content .pd-type .pd-typeItem:not(:last-child):after {
    content: "";
    position: absolute;
    bottom: 0px;
    width: 80%;
    height: 3px;
    opacity: 0.24;
    background: radial-gradient(
      50% 50% at 50% 50%,
      #432c2c 0%,
      rgba(80, 28, 28, 0) 100%
    );
  }

  .trickcargo-content .pd-type .pd-typeItem img {
    width: 120px;
    margin-bottom: 15px;
  }

  .trickcargo-content .pd-type .pd-typeItem .title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
  }

  .trickcargo-content .pd-type .pd-typeItem .des {
    font-size: 15px;
    text-align: center;
    margin-bottom: 15px;
    padding: 0px 25px;
  }

  .trickcargo-content .pd-type .pd-typeItem .warning-text {
    color: #ff0000;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
  }

  .trickcal-content {
    padding: 25px 0px;
  }

  .trickcal-content .section {
    font-size: 24px;
    line-height: 28px;
  }

  .trickcal-content .countBox {
    display: block;
    margin: 40px 0px 30px 0px;
  }

  .trickcal-content .countBox .countItem {
    width: 100%;
  }

  .trickcal-content .countBox .countItem:not(:last-child) {
    margin-bottom: 50px;
  }

  .trickcal-content .countBox .countItem .imgBox img {
    height: 200px;
  }

  .trickcal-content .trickcal-bottom .warning {
    width: 97%;
    font-size: 16px;
    padding: 10px 40px;
    font-weight: 700;
  }

  .trickcal-content .trickcal-bottom .warning-right {
    width: 97%;
    font-size: 13px;
    padding-left: 18%;
  }

  .trickwood-content {
    padding: 30px 0px;
  }

  .trickwood-content .section {
    font-size: 32px;
  }

  .trickwood-content .wood-box {
    display: block;
    width: 97%;
    text-align: center;
    padding: 0px 20px 20px 20px;
    font-size: 16px;
  }

  .trickwood-content .wood-box img {
    width: 208px;
    margin-bottom: 10px;
  }

  .trickwood-content .wood-box .wood-content div {
    margin: unset !important;
  }

  .trickwood-content .wood-foot {
    padding: unset;
    font-size: 14px;
    font-weight: 400;
  }

  .trickcal-content .formulaBox {
    font-size: 16px;
  }

  .trickcal-content .countBox .countItem .countBoxBottomBox {
    padding: 48px 15px 20px 15px;
  }

  .trickcal-content
    .countBox
    .countItem
    .countBoxBottomBox
    .countBoxBottomBoxFormulaBox
    .formulaBox {
    font-size: 14px;
  }

  .howto-cargo {
    padding: 30px 0px 15px 0px;
  }

  .howto-cargo .section {
    font-size: 32px;
    line-height: 37px;
    margin-bottom: 10px;
  }

  .howto-cargo .warningBottom {
    padding: 0px 20px;
  }

  .howto-cargo .warningBottom .warning {
    display: flex;
    font-size: 12px;
  }

  .howto-cargo .warningBottom .warning .wn-icon {
    width: 18px;
    height: 15px;
    margin-right: 10px;
    margin-top: 3px;
  }

  .howto-cargo .howtoCargo {
    display: none;
  }

  .howto-cargo .howtoCargo-mb {
    display: block;
    width: 100%;
    padding: 0px 10px;
  }

  .howto-cargo .warningBottom {
    margin-top: 20px;
  }

  .vcbnew-arti .btnCargo {
    height: 53px;
    font-size: 20px;
  }

  .howto-cargo .howtoBottom {
    margin-top: 15px;
  }

  .howto-cargo .btnCargo {
    width: 206px;
    margin-bottom: 8px;
  }

  .howto-cnpay .cnpayBottom .buttonGroup .btnCargo {
    width: 253px;
    margin-bottom: 8px;
  }

  .howto-cnpay {
    padding: 20px 0px 35px 0px;
  }

  .howto-cnpay .section {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .howto-cnpay .cnpayList {
    padding: 0px 20px;
  }

  .howto-cnpay .cnpayList .cnpayItem {
    width: 47%;
    height: 143px;
    border-radius: 20px;
    padding: 10px 0px;
    margin-bottom: 25px;
  }

  .howto-cnpay .cnpayList .cnpayItem .sec {
    width: 18px;
    height: 18px;
    font-size: 14px;
    line-height: normal;
    top: -3px;
    left: -3px;
  }

  .howto-cnpay .cnpayList .cnpayItem img {
    height: 70px;
    margin-bottom: 3px;
  }

  .howto-cnpay .cnpayList .cnpayItem .title {
    font-size: 10px;
    line-height: 12px;
  }

  .howto-cnpay .cnpayList .cnpayItem .des {
    font-size: 10px;
    line-height: 12px;
  }

  .howto-cnpay .cnpayBottom .warning {
    font-size: 9px;
    margin-bottom: 12px;
  }

  .howto-cnpay .cnpayBottom {
    margin: unset;
  }

  .howto-cnpay .cnpayBottom .warning-big {
    font-size: 10px;
    line-height: 14px;
    margin: 0px 5px;
    padding: 10px 0px;
  }

  .howto-cnpay .cnpayBottom .buttonGroup {
    margin-top: 18px;
  }

  .vcbnew-arti .goods-content .dropsort {
    display: none;
  }

  .vcbnew-arti .shortlink {
    display: none;
  }

  .flashsale-page {
    background-color: #f5f5f5;
    padding: 30px 0px;
  }

  .flashsale-page .section {
    font-size: 36px;
    margin-left: 30px;
    margin-bottom: 15px;
  }

  .flashsale-page .section img {
    height: 51.36px;
  }

  .flashsale-page .goods-content .goods-list {
    flex-direction: column;
  }

  .flashsale-page .goods-content .goods-list .goods-item {
    width: 100%;
    display: flex;
    margin-left: unset;
    margin-bottom: 15px;
    background-color: #fff;
    padding: 10px;
    border-radius: 8px;
  }

  .flashsale-page .goods-content .goods-list .goods-item .goods-img {
    width: 30%;
  }

  .goods-list .goods-item .goods-textbox {
    padding: 7px 5px 0px 5px;
  }

  .flashsale-page .goods-content .goods-list .goods-item .goods-textbox {
    width: 70%;
    padding: 15px 5px 0px 15px;
  }

  .flashsale-page .goods-content .goods-list .goods-item .goods-textbox .des {
    margin-bottom: 15px;
  }

  .flashsale-page
    .goods-content
    .goods-list
    .goods-item
    .goods-textbox
    .button {
    display: block;
  }

  .flashsale-page
    .goods-content
    .goods-list
    .goods-item
    .goods-textbox
    .button
    .goods-bt {
    width: 151px;
  }

  .vcbnew-arti .searchTop-mb {
    display: flex;
    align-items: center;
    padding-right: 10px;
    margin-bottom: 30px;
    height: 40px;
    overflow: hidden;
  }

  .vcbnew-arti .searchTop-mb .searchTop-bt {
    width: 10%;
    background: unset;
    padding: unset;
    border: unset;
    font-size: 32px;
  }

  .vcbnew-arti .searchTop-mb .searchTop-fm {
    position: relative;
    width: 90%;
    padding-left: 7px;
  }

  .vcbnew-arti .searchTop-mb .searchTop-fm .form-control {
    background: #f1f1f1;
    border-radius: 4px;
    height: 40px;
    border: unset;
    box-shadow: unset;
    padding: 0px 40px 0px 10px;
    color: #000;
    font-size: 14px;
    font-weight: 500;
  }

  .vcbnew-arti .searchTop-mb .searchTop-fm .form-control::placeholder {
    color: #484848;
    font-weight: 600;
  }

  .vcbnew-arti .searchTop-mb .searchTop-fm .fm-submit {
    position: absolute;
    right: 10px;
    top: 0px;
    background: unset;
    border: unset;
    padding: unset;
    font-size: 22px;
    height: 100%;
    color: #414141;
  }

  .vcbnew-arti .productMenu-mobile {
    display: flex;
    margin-bottom: 30px;
  }

  .vcbnew-arti .productMenu-mobile .menuItem {
    width: 50%;
    text-align: center;
  }

  .vcbnew-arti .productMenu-mobile .menuItem .ic-bt {
    padding: unset;
    background: unset;
    border: unset;
    font-size: 20px;
    text-decoration: unset;
    color: #171520;
  }

  .vcbnew-arti .productMenu-mobile .menuItem .ic-bt > img {
    width: 24px;
    height: 24px;
    margin-right: 3px;
  }

  .vcbnew-arti .productMenu-mobile .menuItem .ic-bt .ic-sort {
    content: url("/img/ic-sort.png");
  }

  .vcbnew-arti .productMenu-mobile .menuItem .ic-bt .ic-sort.active {
    content: url("/img/ic-sort-up.png");
  }

  .vcbnew-arti .productMenu-mobile .menuItem .ic-bt .ic-cat {
    content: url("/img/ic-cat.png");
  }

  .modal-vcb.catSelect {
    margin: 0px;
  }

  .catSelect .modal-body {
    /* padding: 45px; */
    padding: 35px;
    position: relative;
  }

  .catSelect .title {
    font-size: 16px;
    color: #000;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
  }

  .catSelect .checkContent {
    margin-top: 20px;
    font-size: 16px;
    color: #575757;
  }

  .catSelect .checkContent .checkItem {
    display: flex;
    align-items: center;
    cursor: pointer;
  }

  .catSelect .checkContent .checkItem:not(:last-child) {
    margin-bottom: 10px;
  }

  .catSelect .checkContent .checkItem input[type="checkbox"] {
    margin: unset;
    margin-bottom: 2px;
    width: 18px;
    height: 18px;
    accent-color: #575757;
  }

  .catSelect .checkContent .checkItem label {
    margin: unset;
    font-weight: 500;
    margin-left: 12px;
  }

  .catSelect .checkContent .showsubmb {
    cursor: pointer;
    color: #707070;
    margin-left: auto;
  }

  .catSelect .checkContent .showsubmb:after {
    content: "+";
    font-size: 18px;
    line-height: 20px;
    font-weight: 500;
  }

  .catSelect .checkContent .showsubmb.active:after {
    content: "-";
    font-size: 20px;
    margin-right: 2px;
  }

  .catSelect .checkContent .subgroup {
    display: none;
  }

  .catSelect .checkContent .subgroup.active {
    display: block;
  }

  .catSelect .checkContent .subgroup .checkItem {
    margin-bottom: 16px;
  }

  .catSelect .checkContent .subgroup .checkItem:last-child {
    margin-bottom: 22px;
  }

  .catSelect .checkConfirm {
    margin-top: 42px;
  }

  .catSelect .checkConfirm .btn {
    height: 40px;
  }

  .vcbmall-page {
    padding: 30px 0px;
    background-color: #f5f5f5;
  }

  .vcbmall-page.home {
    padding: 20px 0px 5px 0px;
  }

  .vcbmall-page .vm-banner {
    margin-bottom: 40px;
  }

  .vcbmall-page .vm-catalog .title {
    font-size: 29px;
    font-weight: 700;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    width: auto;
  }

  .vcbmall-page .vm-catalog .title img {
    width: 36px;
    margin-left: 10px;
  }

  .vcbmall-page .vm-catalog .catalog-list {
    justify-content: unset;
    margin-bottom: 40px;
  }

  .vcbmall-page .vm-catalog .catalog-list .catalog-item {
    width: 20%;
    text-align: center;
    margin-bottom: 50px;
  }

  .vcbmall-page .vm-catalog .catalog-list .catalog-item .catName {
    font-size: 10px;
    line-height: 13px;
    margin-top: 8px;
    padding: 0px 7px;
  }

  .vcbmall-page .vm-catalog .catalog-list .catalog-item img {
    height: 62px;
    width: auto;
  }

  .sort-group {
    display: block;
  }

  .sort-group .sortMenu-left {
    display: none;
  }

  .sort-group .goods-content {
    width: auto;
  }

  .vcbmall-page .goods-content .goods-list {
    justify-content: space-around;
  }

  .vcbmall-page .goods-content .goods-list .goods-item {
    width: 170px;
    margin-left: unset !important;
    background-color: #fff;
    padding: 7px;
    border-radius: 7px;
  }

  .article-content-more {
    padding: 30px 0px 70px 0px;
  }

  .article-content-more .section {
    margin-bottom: 20px;
  }

  .article-content-more .article-slide .article-box {
    height: 240px;
    margin-left: auto;
    width: 49%;
  }

  .article-content-more .article-slide .article-box:nth-child(2n + 1) {
    margin-left: 0px;
  }

  .article-content-more .article-slide .article-box .arti-detail {
    height: 80px;
    padding-top: 5px;
  }

  .article-content-more .article-slide .article-box .arti-img img {
    height: auto;
  }

  .article-content-more .article-slide .article-box .arti-detail .arti-des {
    font-size: 13px;
    line-height: 16px;
  }

  .modal-login-new {
    margin: auto;
    margin-top: 35%;
    width: 313px;
  }

  .modal-login-new .modal-content {
    height: auto;
  }

  .modal-login-new .login-close {
    width: 32px;
    height: 32px;
    top: -10px;
    right: 0px;
    z-index: 1;
  }

  .modal-login-new .modal-body {
    padding: 68px 15px 15px 15px;
  }

  .modal-login-new .loginNew {
    display: block;
  }

  .modal-login-new .loginNew .loginNewImg {
    width: 100%;
    position: absolute;
    top: -90px;
    left: 0px;
  }

  .modal-login-new .loginNew .loginNewImg img {
    width: 180px;
  }

  .modal-login-new .loginNew .loginNewContent {
    width: 100%;
  }

  .modal-login-new .loginNew .loginNewContent .logo {
    width: 174px;
    margin-bottom: 5px;
  }

  .modal-login-new .loginNew .loginNewContent .welcome {
    font-size: 23px;
    margin-bottom: 5px;
  }

  .modal-login-new .loginNew .loginNewContent .title {
    font-size: 19px;
    margin-bottom: 15px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm {
    padding: 0px 20px 24px 20px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .form-control {
    height: 32.64px;
    padding-left: 35px;
    font-size: 11px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .form-password {
    padding-right: 35px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .icn {
    width: 11px;
    left: 13px;
    top: 9px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .password-eye {
    font-size: 13px;
    right: 13px;
    top: 9px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .password-group {
    margin-bottom: 15px;
  }

  .modal-login-new
    .loginNew
    .loginNewContent
    .loginForm
    .shortcut
    .remember
    input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }

  .modal-login-new
    .loginNew
    .loginNewContent
    .loginForm
    .shortcut
    .remember
    label {
    font-size: 12px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .shortcut .forgot {
    font-size: 12px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .shortcut {
    margin-bottom: 15px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .button .btn-login-new,
  .modal-login-new
    .loginNew
    .loginNewContent
    .loginForm
    .button
    .btn-regis-new {
    width: 112.15px;
    height: 33.17px;
    font-size: 16px;
    padding: unset;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .forgotbottom {
    margin: unset;
    font-size: 15px;
  }

  .modal-login-new .loginNew .loginNewContent .loginForm .forgotbottom a {
    font-size: 18px;
  }

  .modal-login-new .bottomText {
    position: unset;
    font-size: 12px;
    font-weight: 600;
    padding: 0px 45px;
  }

  .modal-login-new .bottomText img {
    width: 17px;
    margin: 0px 5px 0px 8px;
  }

  .shipping-cal .cal-content {
    height: auto;
  }

  .profile-mb .container {
    padding-left: 12px;
    padding-right: 12px;
    position: relative;
  }

  .vcb-point {
    padding: unset;
  }

  .vcb-point .point-title {
    flex-direction: column;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 30px;
  }

  .vcb-point .point-title img {
    width: 80px;
    margin-right: unset;
    margin-bottom: 15px;
  }

  .vcb-point-terms {
    padding: unset;
    font-size: 14px;
  }

  .vcb-point .point-now {
    text-align: center;
    margin-bottom: 30px;
  }

  .vcb-point .point-now .title {
    margin-right: 5px;
    font-size: 15px;
  }

  .vcb-point .point-now .point {
    font-weight: 600;
    font-size: 20px;
  }

  .vcb-point .point-redeem .des {
    text-align: center;
    font-size: 15px;
    font-weight: 600;
  }

  .vcb-point .point-redeem .action .bt-redeem {
    border-radius: 10px;
    height: 45px;
    font-size: 22px;
    padding: 0px 20px;
  }

  .vcb-point .point-redeem .action {
    margin: 15px 0px 40px 0px;
  }

  .modal-rewards {
    margin: auto;
    margin-top: 35%;
    width: 380px;
  }

  .modal-rewards .modal-content .modal-body {
    height: 330px;
  }

  .modal-rewards .reward-button {
    bottom: 30px;
  }

  .modal-rewards .reward-button .reward-bt {
    height: 57px;
  }

  .modal-rewards .reward-button.failed-action {
    bottom: 53px;
    left: -14px;
  }

  .modal-rewards .reward-button.success-action {
    bottom: 40px;
    left: -3px;
  }

  .modal-rewards .reward-button.failed-action .reward-bt,
  .modal-rewards .reward-button.success-action .reward-bt {
    height: 75px;
  }

  .contentLoader {
    position: fixed;
  }

  .page-head .active:after {
    top: 26px;
  }

  .page-content .page-search {
    padding: 5px 15px;
  }

  .page-content .order-search .search-content {
    padding: 10px 10px 0px;
  }

  .back-history {
    display: flex;
    font-family: "Noto Sans Thai", sans-serif;
    font-size: 16px;
    width: max-content;
    color: #ff8f00;
    background: transparent;
    border: unset;
    font-weight: 700;
    cursor: pointer;
    padding: unset;
    padding-left: 5px;
    margin-top: 10px;
    margin-bottom: 15px;
    transition: 0.25s;
  }

  .back-history:active,
  .back-history:hover {
    margin-left: -7px;
  }

  .back-history i {
    font-size: 30px;
    line-height: 18px;
    margin-right: 10px;
  }

  .aboutus-mobile {
    padding: 20px 0px;
    display: block;
  }

  .aboutus-mobile .back-history {
    margin-top: 2px;
    padding-left: 15px;
  }

  .aboutus-mobile .about-topcontent {
    padding: 20px 0px 7px 0px;
  }

  .aboutus-mobile .about-topcontent .text-logo {
    text-align: center;
    margin-bottom: 12px;
  }

  .aboutus-mobile .about-topcontent .text-logo .title {
    color: #ff8f00;
    font-size: 20px;
    line-height: 22px;
    font-weight: 600;
  }

  .aboutus-mobile .about-topcontent .text-logo img {
    width: 195px;
    max-width: 100%;
    margin-bottom: 12px;
  }

  .aboutus-mobile .about-topcontent .about-banner {
    text-align: center;
    margin-bottom: 15px;
  }

  .aboutus-mobile .about-topcontent .about-banner img {
    width: 265px;
    max-width: 100%;
    margin-right: 24px;
  }

  .aboutus-mobile .about-des {
    text-align: center;
    font-size: 16px;
    line-height: normal;
    margin-bottom: 6px;
  }

  .aboutus-mobile b {
    color: #ff9900;
  }

  .aboutus-mobile .about-topcontent .text-imgbox {
    text-align: center;
  }

  .aboutus-mobile .about-topcontent .text-imgbox img {
    width: 331px;
    max-width: 100%;
  }

  .aboutus-mobile .myservice-content {
    padding: 30px 0px 20px 0px;
    background: linear-gradient(
      146.35deg,
      #ffeed9 0%,
      #ffedd7 40.7%,
      #ffead0 54.59%,
      #ffe4c4 65.51%,
      #ffddb3 73.45%,
      #ffd39d 80.4%,
      #ffc782 87.35%,
      #ffb962 93.31%,
      #ffa93d 98.27%,
      #ffa533 99.26%
    );
  }

  .aboutus-mobile .myservice-content .section {
    font-size: 32px;
    color: #ff8f00;
  }

  .aboutus-mobile .myservice-content .text-imgbox {
    text-align: center;
  }

  .aboutus-mobile .myservice-content .text-imgbox img {
    width: 378px;
    max-width: 100%;
    margin-bottom: 7px;
  }

  .aboutus-mobile .myservice-content .ab-image {
    text-align: center;
    margin-bottom: 20px;
  }

  .aboutus-mobile .myservice-content .ab-image img {
    width: 200px;
    max-width: 100%;
  }

  .aboutus-mobile .myservice-content .about-des {
    margin-bottom: 23px;
  }

  .aboutus-mobile .myservice-content .cn-step {
    font-size: 16px;
    text-align: center;
    margin-bottom: 35px;
  }

  .aboutus-mobile .myservice-content .cn-step .title {
    margin-bottom: 15px;
  }

  .aboutus-mobile .myservice-content .cn-step .imglist {
    display: flex;
    justify-content: space-evenly;
    padding: 0px 6%;
  }

  .aboutus-mobile .myservice-content .cn-step .imglist .imgitem img {
    width: 70.7px;
    max-width: 100%;
    margin-bottom: 10px;
  }

  .aboutus-mobile .myservice-content .cn-step .imglist .imgitem .text {
    font-size: 18px;
    font-weight: 700;
  }

  /* ewafda */
  .aboutus-mobile .myservice-content .order-step {
    font-size: 16px;
    text-align: center;
  }

  .aboutus-mobile .myservice-content .order-step .title {
    margin-bottom: 20px;
  }

  .aboutus-mobile .myservice-content .order-step .stepImg {
    display: flex;
    justify-content: space-evenly;
  }

  .aboutus-mobile .myservice-content .order-step .stepImg img {
    width: 332px;
    max-width: 100%;
  }

  .aboutus-mobile .shipping-content {
    padding: 13px 0px 10px 0px;
    background: linear-gradient(
      173.42deg,
      #b7b7b7 0%,
      #c7c7c7 4%,
      #d8d8d8 9%,
      #e4e4e4 15%,
      #ededed 50%,
      #ebebeb 75%,
      #e4e4e4 85%,
      #d8d8d8 91%,
      #c7c7c7 96%,
      #b7b7b7 100%
    );
  }

  .aboutus-mobile .shipping-content .text-imgbox {
    text-align: center;
  }

  .aboutus-mobile .shipping-content .text-imgbox img {
    width: 378px;
    max-width: 100%;
    margin-bottom: 7px;
  }

  .aboutus-mobile .shipping-content .ab-image {
    text-align: center;
    margin-bottom: 17px;
  }

  .aboutus-mobile .shipping-content .ab-image img {
    width: 235px;
    max-width: 100%;
  }

  .aboutus-mobile .shipping-content .about-des {
    margin-bottom: 23px;
  }

  .aboutus-mobile .shipping-content .section {
    font-size: 24px;
    color: #ff9900;
    margin-bottom: 15px;
  }

  .aboutus-mobile .shipping-content .shipping-textBox {
    text-align: center;
    margin-bottom: 30px;
  }

  .aboutus-mobile .shipping-content .shipping-textBox img {
    height: 83px;
    max-width: 100%;
    margin-bottom: 15px;
  }

  .aboutus-mobile .shipping-content .shipping-textBox img:last-child {
    margin-bottom: unset;
  }

  .aboutus-mobile .shipping-content .shipping-step {
    text-align: center;
  }

  .aboutus-mobile .shipping-content .shipping-step .title {
    font-size: 16px;
    margin-bottom: 13px;
  }

  .aboutus-mobile .shipping-content .shipping-step .stepImg {
    margin-bottom: 30px;
  }

  .aboutus-mobile .shipping-content .shipping-step .stepImg img {
    width: 360px;
    max-width: 100%;
  }

  .aboutus-mobile .shipping-content .cn-stepImg {
    text-align: center;
    margin-bottom: 6px;
  }

  .aboutus-mobile .shipping-content .cn-stepImg img {
    width: 302px;
    max-width: 100%;
  }

  .aboutus-mobile .whycn-content {
    padding: 25px 0px;
  }

  .aboutus-mobile .whycn-content .text-imgbox {
    text-align: center;
  }

  .aboutus-mobile .whycn-content .text-imgbox img {
    width: 378px;
    max-width: 100%;
    margin-bottom: 23px;
  }

  .aboutus-mobile .whycn-content .wv-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0px 10px;
  }

  .aboutus-mobile .whycn-content .wv-list .wv-item {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 32px;
  }

  .aboutus-mobile .whycn-content .wv-list .wv-item img {
    width: 74px;
    margin-bottom: 5px;
  }

  .aboutus-mobile .whycn-content .wv-list .wv-item .wv-des {
    font-size: 16px;
    font-weight: 500;
    text-align: center;
  }

  .aboutus-mobile .whycn-content .whycn-image {
    text-align: center;
  }

  .aboutus-mobile .whycn-content .whycn-image img {
    width: 366px;
    max-width: 100%;
  }

  .page-head .promo-bd {
    margin-bottom: 10px;
    padding: 2px 17px;
  }

  .promo-bd {
    padding: 0px 15px;
    font-size: 14px;
  }

  .productvcb-page {
    padding: 12px 0px;
  }

  .productvcb-page .searchTop-mb {
    margin-bottom: 7px;
  }

  .vmallpro-content {
    display: block;
    margin-bottom: 35px;
  }

  .vmallpro-content .vmall-image {
    width: 100%;
    padding: 0px 15px;
  }

  .vmallpro-content .vmall-image .mainImg {
    border-radius: 8px;
  }

  .vmallpro-content .vmall-image .imgslide {
    margin-top: 17px;
    margin-bottom: 25px;
  }

  .vmallpro-content .vmall-image .imgslide .subImg {
    padding: 0px 20px;
  }

  .vmallpro-content .vmall-image .imgslide .subImg .owl-nav {
    width: 104%;
    left: -7px;
    top: 25%;
  }

  .vmallpro-content .vmall-image .imgslide .subImg .subImg-item img {
    border-radius: 4px;
  }

  .vmallpro-content .vmall-content {
    width: 100%;
    padding: 0px 15px;
  }

  .vmallpro-content .vmall-content .productName .title {
    font-size: 20px;
    font-weight: 600;
  }

  .vmallpro-content .vmall-content .productName .des {
    font-size: 16px;
  }

  .vmallpro-content .vmall-content .normal-price,
  .vmallpro-content .vmall-content .campaign-price {
    font-size: 20px;
    margin-bottom: 13px;
  }

  .vmallpro-content .vmall-content .campaign-price span:not(:last-child) {
    margin-right: 5px;
  }

  .vmallpro-content .vmall-content .campaign-price .dash {
    font-size: 16px;
  }

  .vmallpro-content .vmall-content .campaign-price .off {
    font-weight: 600;
    font-size: 16px;
  }

  .vmallpro-content .vmall-content .skuList {
    margin-bottom: 15px;
    min-height: unset;
    max-height: 175px;
  }

  .vmallpro-content .vmall-content .skuList .skuItems {
    font-size: 12px;
    padding: 2px 5px;
    max-width: 47%;
  }

  .vmallpro-content .vmall-content .productAction {
    text-align: center;
    position: relative;
  }

  .vmallpro-content .vmall-content .productAction .submitVmall {
    width: 272px;
    height: 44px;
    font-size: 16px;
  }

  .vmallpro-content .vmall-content .productAction .qty-content {
    flex-wrap: wrap;
    margin-bottom: 30px;
    padding-left: 30%;
  }

  .vmallpro-content .vmall-content .productAction .qty-content .lab {
    margin-right: 10px;
  }

  .vmallpro-content .vmall-content .productAction .qty-content .total-show {
    margin-left: unset;
    margin-top: 17px;
    text-align: left;
    width: 100%;
  }

  .vmallpro-content .vmall-content .productAction .imgpre-mb {
    display: block;
    position: absolute;
    left: 10px;
    top: 0px;
    width: 70px;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    /* box-shadow: 2px 4px 4px rgba(0, 0, 0, 0.1); */
  }

  .vmallpro-content
    .vmall-content
    .productAction
    .qty-content
    .total-show
    .drop-show {
    position: relative;
    display: inline-block;
    top: 1px;
    right: -2px;
  }

  .vmallpro-content
    .vmall-content
    .productAction
    .qty-content
    .total-show
    .total-item:not(:last-child) {
    margin-right: 5px;
  }

  .vmall-description {
    font-size: 14px;
    padding: 13px 10px;
    border-top: 8px solid #f1f1f1;
    border-bottom: 8px solid #f1f1f1;
  }

  .vmall-description .des-header {
    font-size: 16px;
    padding: unset;
    background: unset;
    border-radius: unset;
    margin-bottom: 10px;
    font-weight: 600;
  }

  .vmall-description .des-body {
    padding: unset;
    font-weight: 500;
  }

  .vmall-recommend {
    margin-top: 25px;
    padding: 0px 15px;
  }

  .vmall-recommend .productRec .recItems img {
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .vmallpro-content .vmall-content .skuList .skuItems.active .inner span {
    max-width: 78%;
  }

  .vmallpro-content .vmall-content .productAction .qty-content .input-group {
    width: 100px;
  }

  .vmallpro-content .vmall-content .productAction .result-content .table tbody {
    font-size: 13px;
  }

  .vcbgif {
    right: 5px;
    bottom: 95px;
    width: 130px;
  }

  .vcbgif .close-bt {
    width: 25px;
    height: 25px;
  }

  .selectcoupon-mb {
    display: flex !important;
  }

  .sr-content .sr-txt-bottom {
    margin: unset;
  }

  .paymentNew {
    background-color: #fff;
  }

  .paymentNew .container {
    padding: unset;
  }

  .paymentNew-content {
    padding: unset;
  }

  .paymentNew-content .pm-page .paytable {
    display: none;
  }

  .paymentNew-content .pm-alert {
    font-size: 15px;
  }

  .paymentNew-content .pm-alert.pay-order {
    height: auto;
    padding: 15px;
    text-align: unset;
    font-weight: 600;
  }

  .paymentNew-content .pm-page {
    padding: 20px 12px;
  }

  .paymentNew-content .pm-page .topprice .price {
    font-size: 20px;
  }

  .paymentNew-content .pm-page .topprice {
    padding: 0px 30px;
    margin-bottom: 20px;
  }

  .paymentNew-content .pm-page .resultprice {
    display: block;
  }

  .paymentNew-content .pm-page .resultprice .payoptions {
    width: auto;
    padding: unset;
  }

  .paymentNew-content .pm-page .resultprice .payresult {
    width: auto;
    border-radius: unset;
    margin: 0px -12px;
    padding: 20px 30px;
  }

  .paymentNew-content .pm-page .resultprice .payoptions .optionBox {
    padding: 15px;
  }

  .paymentNew-content .pm-page .resultprice .payoptions .toptext {
    font-size: 14px;
  }

  .paymentNew-content .pm-page .resultprice .payoptions .toptext .text-small {
    font-size: 13px;
  }

  .resultprice .payoptions .optionBox .optionGroup:first-child {
    margin-bottom: 12px;
  }

  .resultprice .payoptions .optionBox .optionGroup .lab {
    width: 40%;
    padding-left: 10px;
  }

  .resultprice .payoptions .optionBox .optionGroup .input {
    width: 57%;
  }

  .resultprice .payoptions .optionBox .optionGroup .input .coupon-select {
    height: 35px;
    padding: 0px 13px;
  }

  .resultprice .payoptions .optionBox .optionGroup .half {
    width: 48.5%;
  }

  .resultprice .payoptions .optionBox .optionGroup .redeemBtn {
    font-size: 15px;
    height: 35px;
  }

  .resultprice .payoptions .optionBox .optionGroup .redeemBtn.active {
    font-size: 15px;
  }

  .resultprice .payoptions .optionBox .form-control {
    height: 35px;
    font-size: 15px;
    font-weight: 600;
    padding: 0px 15px;
  }

  .resultprice .payoptions .optionBox .form-control::placeholder {
    font-size: 13px;
  }

  .resultprice .payoptions .optionBox .code-status {
    font-size: 12px;
    padding-left: 7px;
  }

  .resultprice .payoptions .optionBox .optionGroup .input .coupon-select {
    font-size: 13px;
  }

  .resultprice .payoptions .optionBox .optionGroup .codeleft {
    width: 65%;
  }

  .resultprice .payoptions .optionBox .optionGroup .coderight {
    padding: unset;
    width: 33%;
  }

  .resultprice .payoptions .optionBox .redeempoint {
    margin-bottom: 12px;
    font-size: 15px;
  }

  .resultprice .payoptions .optionBox .redeempoint .mypoint {
    min-width: 40%;
  }

  .paymentNew-content .pm-page .resultprice .payresult .title {
    font-size: 15px;
  }

  .paymentNew-content .pm-page .resultprice .payresult .resultList {
    font-size: 14px;
  }

  .payresult .resultList .rs-item .price .newprice {
    font-size: 14px;
  }

  .payresult .resultTotal .rs-button button {
    font-size: 20px;
    border-radius: 20px;
  }

  .paymentNew-content .pm-bottom {
    margin-top: unset;
    margin-bottom: 20px;
    font-size: 14px;
  }

  .resultprice .payoptions .optionBox .optionGroup .input .couponList {
    width: 320px;
    padding: 13px;
  }

  .couponList .coupon-item {
    padding: 10px 12px;
  }

  .paymentNew-content .pm-page .payboxGroup {
    display: block;
    margin-bottom: 20px;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox {
    box-shadow: -1px 1px 5.6px rgba(0, 0, 0, 0.25);
    border-radius: 13px;
    padding: 12px 20px;
    margin-bottom: 10px;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox:last-child {
    margin-bottom: unset;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .orderlist {
    font-size: 14px;
    color: #878787;
  }

  .paymentNew-content
    .pm-page
    .payboxGroup
    .paybox
    .orderlist:not(:last-child) {
    margin-bottom: 5px;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .orderlist span {
    font-family: "Inter", sans-serif;
    color: #000;
    font-weight: 600;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .price span {
    font-weight: 500;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .orderlist .dash {
    text-decoration-line: line-through;
    margin-right: 3px;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .orderlist .newprice {
    color: #ff8f00;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .paylist {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    color: #061023;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .paylist:not(:last-child) {
    margin-bottom: 9px;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .paylist .promo-lab {
    font-size: 12px;
    line-height: 14px;
    padding: 3px 20px;
    font-weight: 700;
    color: #ff8f00;
    border-radius: 50px;
    background-color: #ffdabf;
    display: flex;
    align-items: center;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .paylist .rate {
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    color: #7a7a7a;
  }

  .paymentNew-content .pm-page .payboxGroup .paybox .paylist .created {
    font-size: 11px;
    line-height: 13px;
    color: #7a7a7a;
  }

  .resultprice .payoptions .optionBox .code-status .alertshow {
    margin-top: 8px;
  }

  .resultprice .payoptions .optionBox .form-control.active-bg {
    font-size: 18px;
    font-weight: 700;
  }

  .vcb-addline {
    display: none;
  }

  .couponList .coupon-item .radio-wrapper .round {
    height: 57px;
  }

  .vm-banner .carousel-indicators {
    bottom: -40px;
  }

  .vm-banner .carousel-indicators li {
    width: 10px;
    height: 10px;
    margin: 1px 3px;
  }

  .recommend-content {
    padding: 30px 15px 15px 15px;
  }

  .recommend-content .section {
    font-size: 27px;
    line-height: 31px;
    margin-bottom: 15px;
  }

  .recommend-content .recwrap {
    height: auto;
  }

  .recommend-content .recside {
    width: 100%;
  }

  .recommend-content .recside:first-child {
    margin-bottom: 13px;
  }

  .recommend-content .recbox.full {
    height: 270px;
  }

  .recommend-content .recbox.half {
    height: 162px;
  }

  .recommend-content .recwrap-in {
    margin-top: 13px;
  }

  .recommend-content .recwrap-in .recside {
    width: 48%;
  }

  .recommend-content .recbox .description,
  .recommend-content .recbox.half .description {
    padding: 17px;
  }

  .recommend-content .recbox .description .title {
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 3px;
  }

  .recommend-content .recbox .description .des {
    font-size: 11px;
    line-height: 15px;
    margin-bottom: 7px;
  }

  .recommend-content .recbox.half .description .title {
    margin-bottom: 3px;
  }

  .recproduct-content {
    padding-bottom: 30px;
  }

  .recproduct-content .goods-content .goods-list {
    justify-content: space-around;
  }

  .recproduct-content .goods-content .goods-list .goods-item {
    width: 151px;
    margin-left: unset !important;
  }

  .recproduct-content .rec-shomore {
    margin-top: 5px;
  }

  .recproduct-content .rec-shomore a {
    font-size: 20px;
    line-height: 22px;
    padding: 7px 30px;
  }

  .recproduct-content .rec-shomore a > i {
    font-size: 17px;
    line-height: 19px;
    margin-left: 7px;
  }

  .recproduct-content .rec-tags {
    white-space: nowrap;
    overflow: auto;
    margin-bottom: 25px;
    margin-left: -25px;
    margin-right: -25px;
    padding: 0px 25px;
  }

  .recproduct-content .rec-tags .tags-item {
    margin-bottom: unset;
    font-size: 14px;
    line-height: 16px;
    padding: 3px 10px;
  }

  .recproduct-content .rec-tags .tags-item:not(:last-child) {
    margin-right: 4px;
  }

  .socialvideo-content {
    padding: 30px 0px;
  }

  .socialvideo-content .row {
    margin-left: -10px;
    margin-right: -10px;
  }

  .socialvideo-content .video-box {
    margin-bottom: 30px;
  }

  .socialvideo-content .video-box .con-nav {
    margin-bottom: 15px;
  }

  .socialvideo-content .video-box .con-nav .sv-icon img {
    height: 25px;
  }

  .socialvideo-content .video-box .youtube .youtube-iframe {
    height: 220px;
  }

  .socialvideo-content .video-box .video-wrap {
    overflow-y: hidden;
    overflow-x: auto;
    margin-left: -15px;
    margin-right: -15px;
    padding: 0px 15px;
  }

  .socialvideo-content .video-box .video-wrap::-webkit-scrollbar {
    display: none;
  }

  .socialvideo-content .video-box .tiktok .tiktok-item {
    width: 32.3%;
  }

  .socialvideo-content .video-box .video-wrap .tiktok {
    width: 147%;
  }

  .socialvideo-content .video-box .tiktok .tiktok-item .tiktok-iframe {
    height: 305px;
  }

  .model-12th .popup-background {
    width: 90%;
  }

  .vcbmall-page.home .con-nav {
    margin-bottom: 20px;
    padding: 0px 10px;
  }

  .vcbmall-page.home .con-nav .con-title {
    padding-left: unset;
  }

  .vcbmall-page.home .con-nav .con-name {
    font-size: 24px;
    line-height: 26px;
  }

  .vcbmall-page.home .con-nav .con-name img {
    width: 33px;
    margin-left: 7px;
  }

  .shipping-rate .section {
    margin-bottom: 15px;
  }

  .sr-content .sr-subject .subject-item .des-fs {
    font-size: 18px;
    font-weight: 500;
  }

  .shipping-rate .tabline {
    margin-top: 20px;
    margin-bottom: 15px;
  }

  .sr-content .bottom-text {
    margin-top: 5px;
    font-size: 16px;
    font-weight: 500;
    color: #ff9900;
  }

  .shipping-rate .bullet-content {
    margin: 15px 0px 20px 0px;
  }

  .shipping-rate .bullet-content ul {
    font-size: 15px;
    line-height: 28px;
    padding-left: 30px;
  }

  .shipping-rate .bullet-content ul > li {
    margin: unset !important;
  }

  .shipping-rate .sr-bottom .sr-bt {
    height: 62px;
    width: 312px;
    font-size: 24px;
    line-height: 26px;
  }

  .page-box .tab-head li {
    margin-right: 13px;
  }

  .count-down {
    position: absolute;
    left: -35px;
    top: 60px;
    scale: 0.7;
    margin: unset;
  }

  .flipdown .rotor {
    font-size: 3.3rem !important;
  }

  .flipdown .rotor:after {
    border-radius: 0px 0px 5px 5px !important;
  }

  .flipdown .rotor-leaf-front {
    border-radius: 5px 5px 0px 0px !important;
  }

  .flipdown .rotor-leaf-rear {
    border-radius: 0px 0px 5px 5px !important;
  }

  .flipdown .rotor-top {
    border-radius: 5px 5px 0px 0px !important;
  }

  .flipdown .rotor-bottom {
    border-radius: 0px 0px 5px 5px !important;
  }

  .flipdown .rotor-group {
    padding-right: 15px !important;
  }

  .flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):before,
  .flipdown .rotor-group:nth-child(n + 2):nth-child(-n + 3):after {
    left: 69px !important;
    width: 6px !important;
    height: 6px !important;
  }

  .flashsale-page .goods-content.fs-margin {
    margin-top: 75px;
  }

  .flashsale-page .goods-content .count-down {
    left: -8%;
    top: -60px;
  }

  .vmallpro-content .vmall-content .productAction .result-content {
    margin-left: -5px;
    margin-right: -5px;
    overflow: auto;
  }

  .vmallpro-content .vmall-content .steps-price {
    border-radius: unset;
    padding: 12px 10px 12px 30px;
    margin-left: -25px;
    margin-right: -25px;
  }

  .vmallpro-content .vmall-content .steps-price .steps-row .steps-item.lab {
    font-size: 14px;
    font-weight: 500;
  }

  .vmallpro-content
    .vmall-content
    .steps-price
    .steps-row
    .steps-item
    .price-des {
    font-size: 12px;
    line-height: 16px;
  }

  .vmallpro-content .vmall-content .steps-price .steps-row .steps-item .price {
    font-size: 18px;
    line-height: 22px;
  }

  .vmallpro-content
    .vmall-content
    .steps-price
    .steps-row
    .steps-item
    .price-des {
    font-size: 11px;
    line-height: 14px;
  }

  .vmallpro-content .vmall-content .steps-price .steps-row .steps-item .qty {
    font-size: 13px;
  }

  .vmallpro-content .vmall-content .steps-price .steps-row:first-child {
    margin-bottom: 10px;
  }

  .vmallpro-content .vmall-content .steps-price .warning-text {
    padding: 8px;
    border-radius: 7px;
    margin-top: 12px;
    margin-left: -20px;
    font-size: 13px;
    line-height: 18px;
  }

  .scroll-top {
    bottom: 95px;
    right: 10px;
    width: 30px;
    padding-bottom: 3px;
    height: 30px;
    font-size: 20px;
    line-height: 18px;
  }

  .page-box .tab-head .nav-tabs .bd {
    right: -8px;
  }

  .vvic-warning .title {
    font-size: 16px;
  }

  .con-nav.cat {
    justify-content: center;
  }

  .con-nav.cat a {
    font-size: 22px;
  }

  .goods-list .goods-item .goods-textbox .normal-price {
    font-size: 14px;
  }

  .flashsale-page
    .goods-content
    .goods-list
    .goods-item
    .goods-textbox
    .buynow {
    display: block;
    float: right;
    color: #fff;
    background-color: #e21d1d;
    padding: 3px 10px;
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    border-radius: 50px;
  }

  .flashsale-content .con-nav a {
    font-size: 18px;
  }

  .sortbox {
    display: none;
  }

  .page-box .tab-head .nav-tabs {
    font-size: 13px;
  }

  .howto-banner .banner-content {
    background-size: 102%;
    height: 539px;
  }

  .howto-banner .banner-content .ad-group {
    padding: 270px 10px 10px 10px !important;
  }

  .howto-banner .banner-content .ad-group .title {
    font-size: 20px;
    line-height: 24px;
  }

  .howto-banner .banner-content .ad-group .description {
    font-size: 15px;
    line-height: 20px;
  }

  .howto-banner .banner-content .ad-group .readnow {
    height: 45px;
    width: 128px;
    font-size: 24px;
    line-height: 24px;
  }

  .howto-banner .banner-content .ad-group .button {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .howto-banner .banner-content .ad-group .description .storng {
    margin-bottom: 5px;
  }

  .howto-banner .banner-content .overlay {
    position: absolute;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 6.48%, #1a1d29 60.13%);
  }

  .howto-banner .banner-content.bg-1 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-1.png");
  }

  .howto-banner .banner-content.bg-2 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-2.png");
  }

  .howto-banner .banner-content.bg-3 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-3.png");
  }

  .howto-banner .banner-content.bg-4 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-4.png");
  }

  .howto-banner .banner-content.bg-5 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-5.png");
  }

  .howto-banner .banner-content.bg-6 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-6.png");
  }

  .howto-banner .banner-content.bg-7 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-7.png");
  }

  .howto-banner .banner-content.bg-8 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-8.png");
  }

  .howto-banner .banner-content.bg-9 {
    background-image: url("https://www.vcanbuy.com/vvdc/how-to/banner/howto-mb-9.png");
  }

  .howto-banner .card-slide {
    width: 110%;
    left: 70px;
    bottom: 5px;
  }

  .howto-banner .card-slide .cardbox {
    height: 95px;
    border-radius: 15px;
  }

  .howto-banner .card-slide .cardbox .content {
    border-radius: 15px;
  }

  .howto-banner .card-slide .owl-nav i {
    font-size: 60px;
    line-height: 45px;
  }

  .howto-banner .card-slide .owl-nav {
    top: 21%;
    left: -65px;
  }

  .howto-banner .carousel-indicators {
    bottom: 265px;
  }

  .howto-banner .card-slide .cardbox .content .title {
    padding-top: 17px;
    font-size: 12px;
    line-height: 17px;
  }

  .howto-banner .carousel-indicators li {
    height: 10px;
    width: 10px;
  }

  .howto-banner .card-slide .cardbox .content .action button {
    height: 20px;
    font-size: 12px;
    line-height: 13px;
    border-radius: 50px;
  }

  .menuside-stick {
    padding: unset;
    position: fixed !important;
    z-index: 101;
    top: auto !important;
    left: -1%;
    bottom: 0px;
    width: 102%;
    display: none;
  }

  .howto-arti {
    overflow-x: hidden;
  }

  body.howto-menu {
    overflow: hidden;
  }

  .howto-section .menuside-content {
    font-size: 14px;
    height: 570px;
    max-height: 90%;
    border-radius: unset;
    padding-top: unset;
  }

  .howto-section .menuside-content.f-mb-menu {
    max-height: unset;
    height: auto;
  }

  .howto-section {
    padding-bottom: unset;
  }

  .mb-cmenu {
    display: block;
  }

  .mb-cmenu .menuside-content {
    height: auto;
    background: transparent;
    padding-top: 5px;
    box-shadow: unset;
    border-radius: unset;
  }

  .mb-cmenu .menuside-content .menumain .menusub {
    display: block !important;
  }

  .menuside-content .title i {
    display: inline-block;
    position: absolute;
    right: 18px;
    font-size: 19px;
    line-height: 18px;
  }

  .menuside-content .menumain .title i {
    position: unset;
    margin-left: 10px;
  }

  .menuside-content .menumain.active .title i {
    transform: rotate(180deg);
  }

  .menuside-content .menumain .title .lab {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }

  .mb-actionbar {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    height: 35px;
    border-radius: 25px 25px 0px 0px;
    box-shadow: 0px -4px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: -1px;
  }

  .mb-actionbar::after {
    content: "";
    display: block;
    background-color: #9b9b9b;
    width: 60px;
    height: 5.5px;
    border-radius: 100px;
  }

  .warning-lab {
    font-size: 16px;
    line-height: 23px;
  }

  .withdraw-bottom .otp-group {
    margin: unset;
    margin-bottom: 20px;
  }

  .withdraw-bottom .addbank {
    margin-bottom: 20px;
  }

  .withdraw-content .wd-form .deposite_input .wd-alert {
    bottom: -24px;
  }

  .modal-recheck .form-content .recheck-form .form-warp {
    width: 50%;
    margin: 0px 5px;
  }

  .modal-recheck .form-content .recheck-form .otp-content .form-warp input {
    width: 100%;
    margin: unset;
  }

  .modal-recheck .tel-alert {
    left: 5px;
    font-size: 10px;
  }

  .modal-recheck .otp-alert {
    left: 5px;
    font-size: 10px;
  }

  .cart-warning-bg {
    margin: 0px -10px;
    padding: 15px;
    border-radius: unset;
    font-size: 16px;
  }

  .vcb-terms {
    padding: 20px 0px;
    font-size: 14px;
    line-height: 22px;
  }

  .vcb-terms h2 {
    font-size: 20px;
  }

  .vcb-terms h3 {
    font-size: 17px;
  }

  /* todo */

  /* promotion */
  .modal-promo {
    margin: auto;
    margin-top: 30%;
    width: 375px;
    max-width: 100%;
  }

  .modal-promo .modal-content .modal-body {
    height: 431px;
  }

  .modal-promo .pro-close {
    width: 28px;
    height: 28px;
  }

  .modal-promo .pro-button {
    bottom: -16px;
  }

  .modal-promo .pro-button .pro-bt {
    height: 52px;
  }

  .modal-promo .pro-neverShow {
    left: 10px;
    bottom: -22px;
  }

  .modal-promo .pro-neverShow input[type="checkbox"] {
    width: 17px;
    height: 17px;
  }

  .modal-promo .pro-neverShow label {
    padding-left: 7px;
    font-size: 14px;
    line-height: 14px;
  }

  .modal-enjoy .pro-close {
    top: 10px;
    right: 0px;
  }

  .modal-enjoy .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy .pro-neverShow {
    left: 0px;
    bottom: -25px;
  }

  .modal-enjoy2 .pro-close {
    top: 50px;
    right: 15px;
  }

  .modal-enjoy2 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy2 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy2 .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
  }

  .modal-99 .pro-close {
    top: 30px;
    right: 15px;
    width: 24px;
    height: 24px;
  }

  .modal-99 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-99 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-99 .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
  }

  .modal-congrate-99 .pro-close {
    top: 50px;
    right: 43px;
    width: 33px;
    height: 33px;
  }

  .modal-congrate-99 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-congrate-99 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-congrate-99 .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
  }

  .model-12th .pro-close {
    right: 40px;
    top: 5px;
  }

  .model-12th .pro-neverShow {
    left: 50px;
    bottom: 0px;
  }

  .page-66 .couponGroup .coupon-item {
    height: 10%;
  }

  .page-66 .couponGroup .coupon-item img {
    width: 90%;
  }

  .page-66 .couponGroup .coupon-item.disabled img {
    width: 90% !important;
  }

  .enjoy-coupon .couponGroup {
    padding: 0px 20px;
    top: 29.2%;
  }

  .enjoy-coupon .couponGroup .coupon-item {
    height: 97px;
  }

  .enjoy-coupon .couponGroup .coupon-item img {
    width: 90%;
  }

  .enjoy-coupon .couponGroup .coupon-item.disabled img {
    width: 90% !important;
  }

  .enjoy-coupon2 .couponGroup {
    padding: 0px 20px;
    top: 29.2%;
  }

  .enjoy-coupon2 .couponGroup .coupon-item {
    height: 97px;
  }

  .enjoy-coupon2 .couponGroup .coupon-item img {
    width: 90%;
  }

  .enjoy-coupon2 .couponGroup .coupon-item.disabled img {
    width: 90% !important;
  }

  .vcb12th .couponGroup {
    padding: 0px 15px;
    top: 25.5%;
  }

  .vcb12th .couponGroup .coupon-item {
    height: 190px;
  }

  .vcb12th .couponGroup .coupon-item img {
    height: 90%;
  }

  .modal-halloween .pro-close {
    top: 30px;
    right: 15px;
    width: 24px;
    height: 24px;
  }

  .modal-halloween .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-halloween .pro-button .pro-bt {
    height: 50px;
  }

  .modal-halloween .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
    padding-right: 10px;
  }

  .modal-11_11 .pro-close {
    top: 30px;
    right: 35px;
    width: 24px;
    height: 24px;
  }

  .modal-11_11 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-11_11 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-11_11 .pro-neverShow {
    left: 0px;
    bottom: 0px;
    scale: 1.3;
    padding-right: 10px;
  }

  .modal-14_11 {
    margin-top: 35% !important;
    width: 330px !important;
  }

  .modal-14_11 .pro-close {
    top: 5px;
    right: -22px;
    width: 24px;
    height: 24px;
  }

  .modal-14_11 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-14_11 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-14_11 .pro-neverShow {
    left: 0px;
    bottom: -25px;
    scale: 1.3;
    padding-right: 10px;
  }

  .modal-bf-24 {
    margin-top: 35% !important;
    width: 330px !important;
  }

  .modal-bf-24 .pro-close {
    top: 3px;
    right: 10px;
    width: 24px;
    height: 24px;
  }

  .modal-bf-24 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-bf-24 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-bf-24 .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .modal-funfair-24 {
    margin-top: 30% !important;
    width: 330px !important;
  }

  .modal-funfair-24 .pro-close {
    top: 0px;
    right: 0px;
    width: 24px;
    height: 24px;
  }

  .modal-funfair-24 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-funfair-24 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-funfair-24 .pro-neverShow {
    bottom: -10px;
    scale: 1;
  }

  .modal-xmas-24 {
    margin-top: 35% !important;
    width: 350px !important;
  }

  .modal-xmas-24 .pro-close {
    top: 50px;
    right: 10px;
    width: 24px;
    height: 24px;
  }

  .modal-xmas-24 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-xmas-24 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-xmas-24 .pro-neverShow {
    left: 34%;
    bottom: -5px;
    scale: 1;
  }

  .modal-cny25 {
    margin-top: 45% !important;
    width: 330px !important;
  }

  .modal-cny25 .pro-close {
    top: 3px;
    right: 10px;
    width: 24px;
    height: 24px;
  }

  .modal-cny25 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-cny25 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-cny25 .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .modal-newcus {
    margin-top: 110px !important;
    width: 100% !important;
  }

  .modal-newcus .pro-close {
    top: 10px;
    right: 12px;
    width: 26px;
    height: 26px;
  }

  .modal-newcus .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-newcus .pro-button .pro-bt {
    height: 50px;
  }

  .modal-newcus .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .modal-newcuspay {
    margin-top: 45% !important;
    width: 100% !important;
  }

  .modal-newcuspay .pro-close {
    top: 10px;
    right: 12px;
    width: 26px;
    height: 26px;
  }

  .modal-newcuspay .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-newcuspay .pro-button .pro-bt {
    height: 50px;
  }

  .modal-newcuspay .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .modal-vlt25 {
    margin-top: 45% !important;
    width: 100%;
  }

  .modal-vlt25 .pro-close {
    top: 10px;
    right: 20px;
    width: 20px;
    height: 20px;
  }

  .modal-vlt25 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-vlt25 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-vlt25 .pro-neverShow {
    left: 5px;
    bottom: 5px;
    scale: 0.9;
  }

  .modal-vlt25-afterpay {
    margin-top: 35%;
    width: 98%;
  }

  .modal-vlt25-afterpay .pro-close {
    top: 35px;
    right: 35px;
    width: 23px;
    height: 23px;
  }

  .modal-vlt25-afterpay .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-vlt25-afterpay .pro-button .pro-bt {
    height: 50px;
  }

  .modal-vlt25-afterpay .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
  }

  .modal-paydaymarch {
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 80%;
    margin: unset;
  }

  .modal-paydaymarch .pro-close {
    top: 10px;
    right: 12px;
    width: 26px;
    height: 26px;
  }

  .modal-paydaymarch .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-paydaymarch .pro-button .pro-bt {
    height: 50px;
  }

  .modal-paydaymarch .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .modal-4-afterpay {
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 98%;
    margin: unset;
  }

  .modal-4-afterpay .pro-close {
    top: 10px;
    right: 12px;
    width: 26px;
    height: 26px;
  }

  .modal-4-afterpay .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-4-afterpay .pro-button .pro-bt {
    height: 50px;
  }

  .modal-4-afterpay .pro-neverShow {
    left: 22px;
    bottom: -20px;
    scale: 1.3;
  }

  .double-after33 {
    margin-top: 35%;
    width: 100%;
  }

  .double-after33 .pro-close {
    top: 3.5%;
    right: 11%;
    width: 7%;
    height: 7%;
  }

  .double-after33 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .double-after33 .pro-button .pro-bt {
    height: 50px;
  }

  .double-after33 .pro-neverShow {
    left: 0px;
    bottom: -30px;
    scale: 1.3;
  }

  .modal-enjoy25 {
    margin-top: 45% !important;
    width: 100% !important;
  }

  .modal-enjoy25 .pro-close {
    top: 15px;
    right: 13px;
    width: 27px;
    height: 27px;
  }

  .modal-enjoy25 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy25 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy25 .pro-neverShow {
    left: -5px;
    width: 100%;
    bottom: -10px;
    scale: 1;
    justify-content: center;
  }

  .modal-double33 {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-double33 .pro-close {
    top: 15px;
    right: 65px;
    width: 27px;
    height: 27px;
  }

  .modal-double33 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-double33 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-double33 .pro-neverShow {
    left: -5px;
    width: 100%;
    bottom: -20px;
    scale: 1.2;
    justify-content: center;
  }

  .modal-enjoy-march {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-enjoy-march .pro-close {
    top: 15px;
    right: 45px;
    width: 24px;
    height: 24px;
  }

  .modal-enjoy-march .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy-march .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy-march .pro-neverShow {
    left: 30px;
    width: 100%;
    bottom: 0px;
    scale: 1;
  }

  .modal-enjoy-may {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-enjoy-may .modal-content .modal-body {
    padding: 0px 20px;
  }

  .modal-enjoy-may .pro-close {
    top: 15px;
    right: 30px;
    width: 24px;
    height: 24px;
  }

  .modal-enjoy-may .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy-may .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy-may .pro-neverShow {
    left: 30px;
    width: 100%;
    bottom: -25px;
    scale: 1;
  }

  .modal-mid-june {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-mid-june .modal-content .modal-body {
    padding: 0px 20px;
  }

  .modal-mid-june .pro-close {
    top: 10px;
    right: 35px;
    width: 22px;
    height: 22px;
  }

  .modal-mid-june .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-mid-june .pro-button .pro-bt {
    height: 50px;
  }

  .modal-mid-june .pro-neverShow {
    left: -5px;
    width: 100%;
    bottom: 0px;
    scale: 0.8;
  }

  .modal-4-summer {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-4-summer .pro-close {
    top: 15px;
    right: 40px;
    width: 22px;
    height: 22px;
  }

  .modal-4-summer .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-4-summer .pro-button .pro-bt {
    height: 50px;
  }

  .modal-4-summer .pro-neverShow {
    left: 30px;
    width: 100%;
    bottom: -10px;
    scale: 1;
  }

  .modal-enjoy-apr {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 95%;
    margin: unset;
  }

  .modal-enjoy-apr .pro-close {
    top: 5px;
    right: 10px;
    width: 22px;
    height: 22px;
  }

  .modal-enjoy-apr .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy-apr .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy-apr .pro-neverShow {
    left: 0px;
    width: 100%;
    bottom: -5px;
    scale: 1;
  }

  .modal-bigdeal55 {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 95%;
    margin: unset;
  }

  .modal-bigdeal55 .pro-close {
    top: 0px;
    right: 0px;
    width: 25px;
    height: 25px;
  }

  .modal-bigdeal55 .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-bigdeal55 .pro-button .pro-bt {
    height: 50px;
  }

  .modal-bigdeal55 .pro-neverShow {
    left: 0px;
    width: 100%;
    bottom: -5px;
    scale: 1;
  }

  .modal-enjoy-jun {
    position: fixed !important;
    top: 47% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100%;
    margin: unset;
  }

  .modal-enjoy-jun .modal-content .modal-body {
    padding: 0px 20px;
  }

  .modal-enjoy-jun .pro-close {
    top: 7px;
    right: 35px;
    width: 24px;
    height: 24px;
  }

  .modal-enjoy-jun .pro-button {
    bottom: 19px;
    left: 8px;
  }

  .modal-enjoy-jun .pro-button .pro-bt {
    height: 50px;
  }

  .modal-enjoy-jun .pro-neverShow {
    left: 53px;
    width: 100%;
    bottom: 7px;
    scale: 0.9;
  }

  /* footer style */
  .vcb-footer {
    background-color: #f5851f;
  }

  .vcb-footer .footer-copy {
    color: #fff;
    padding: 12px 0px;
  }

  /* footer new */
  .vcbcargo-footer {
    margin-bottom: 83px;
  }

  .vcbcargo-footer.grab {
    margin-bottom: 128px;
  }

  .vcbcargo-footer .container {
    padding: 0px 40px;
  }

  .vcbcargo-footer .main-footer {
    padding: 35px 0px 25px 0px;
    background: #fff;
  }

  .vcbcargo-footer .main-footer .short-link {
    padding: unset;
    padding-bottom: 15px;
    border-bottom: 1px solid #000;
  }

  .vcbcargo-footer .main-footer .short-link a {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 15px;
  }

  .vcbcargo-footer .main-footer .short-box.with-bt:not(:last-child) {
    border-bottom: 1px solid #000;
  }

  .vcbcargo-footer .main-footer .short-box {
    padding: 20px 0px;
    height: auto;
  }

  .vcbcargo-footer .main-footer .short-box .link-title {
    font-size: 20px;
    line-height: 27px;
    font-weight: 700;
    margin-bottom: 17px;
  }

  .vcbcargo-footer .main-footer .short-box a {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 15px;
  }

  .vcbcargo-footer .contact-footer {
    background: #fafafa;
    padding: 30px 0px 20px 0px;
  }

  .vcbcargo-footer .contact-footer .ft-contact {
    flex-wrap: wrap;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-qrcode {
    width: 100%;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item .title {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 5px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item img {
    margin-bottom: 6px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-qrcode .qr-item .des {
    font-size: 20px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-tel {
    width: 100%;
    padding: 20px 0px 45px 0px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-tel .phone {
    font-size: 40px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-tel .phone img {
    width: 46px;
    height: 46px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-tel .des {
    font-size: 20px;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-app {
    width: 100%;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-app a img {
    width: 100%;
  }

  .vcbcargo-footer .contact-footer .ft-contact .ft-app a:not(:last-child) {
    margin-bottom: 20px;
  }

  .vcbcargo-footer .main-footer .ft-about .ft-info {
    text-align: left;
  }

  .vcbcargo-footer .main-footer .ft-about {
    text-align: center;
  }

  .modal-recheck {
    margin: 25% auto;
    width: 95%;
  }

  .modal-recheck .modal-content .modal-body {
    padding: 25px 10px 0px 10px;
  }

  .modal-recheck .form-content .logo {
    width: 150px;
    margin-bottom: 8px;
  }

  .modal-recheck .form-content .title {
    font-size: 16px;
    margin-bottom: 7px;
  }

  .modal-recheck .form-content .tales {
    font-size: 13px;
  }

  .modal-recheck .form-content .recheck-form {
    margin: 27px 0px 0px 0px;
    padding: 0px 23px;
  }

  .modal-recheck .form-content .recheck-form .ic {
    width: 30px;
    margin-right: 7px;
  }

  .modal-recheck .form-content .recheck-form .form-group {
    margin-bottom: 15px;
  }

  .modal-recheck .form-content .recheck-form .form-control {
    font-size: 14px;
    height: 26px;
    padding: 0px 15px;
  }

  .modal-recheck .form-content .recheck-form .form-control::placeholder {
    font-size: 14px;
  }

  .modal-recheck .form-content .recheck-form .otp-content {
    margin-top: 15px;
    margin-bottom: 20px;
  }

  .modal-recheck .form-content .recheck-form .otp-content input,
  .modal-recheck .form-content .recheck-form .otp-content .btn {
    width: 50%;
    margin: 0px 5px;
  }

  .modal-recheck .recheck-bg {
    height: 105%;
  }

  .modal-recheck .form-content .recheck-form .btn {
    height: 26px;
    font-size: 14px;
  }

  .modal-recheck .form-content .recheck-form .recheck-bottom .btn {
    font-size: 18px;
    height: 32px;
  }

  .modal-recheck .pop-close {
    width: 30px;
    right: -8px;
    top: -30px;
  }

  .modal-recheck .wn-text {
    font-size: 14px;
  }

  .article-content-more .article-slide .article-box:nth-child(5n + 1) {
    margin-left: auto;
  }

  .vmallpro-content .vmall-content .skuList .skuItems img {
    width: 37px;
  }
}