:root {
    --bs-blue: #0d6efd;
    --bs-dark-blue: #004a80;
    --bs-lower-blue: #8194d9;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #E00700;
    --bg-red: #E00700;
    --txt-red: #E00700;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-primary: #f2a100;
    --bs-secondary: #252c51;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #E00700;
    --bs-light: #f8f9fa;
    --bs-dark: #494949;
    --font-noto: 'Noto Sans Thai', sans-serif;
    --character-disable: rgba(153, 153, 153, 0.4);
    --character-secondary: rgba(102, 102, 102, 1);
    --light-light-30: rgba(233, 233, 233, 1);
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-btn-active-bg: #E00700;
  }
  
  /* ==================== Custom Container ============================= */
  @media (min-width: 1200px) {
  .container, .container-lg, .container-md, .container-sm {max-width: 1140px!important;}
  
  }
  
  .w-8{width: 8%!important;}
  .w-10{width: 10%!important;}
  .w-20{width: 20%!important;}
  .w-30{width: 30%!important;}
  .w-40{width: 40%!important;}
  .w-50{width: 50%!important;}
  .w-60{width: 60%!important;}
  .w-70{width: 70%!important;}
  .w-80{width: 80%!important;}
  
  .h-500{height: 500px;}
  
  .mgt-5 {margin-top: 5rem;}
  .mgt-6 {margin-top: 6rem;}
  .pd-xy {}
  .py-100{padding: 100px 0px!important;}
  .text-danger-2{color: #E00700!important;}
  .tabs-cart{}
  
  .flex-between-center{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .text-align-end{
    text-align: right;
  }
  .font-normal{
    color: var(--character-primary, #222);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .font-secondary{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }
  .btn-cart-status{
    width: 240px;
    height: 50px;
    border-bottom: 2px solid var(--character-disable);
    margin: 8px 8px;
    text-align: center;
    color: var(--character-disable,#999);
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .btn-cart-status-active{
    width: 240px;
    height: 50px;
    border-bottom: 2px solid #E00700!important;
    margin: 8px 8px;
    text-align: center;
    color: #E00700;
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .btn-cart-status-active span{
    color: #000;
  }
  .ic-payment{
      width: 24px;
      height: 24px;
      background-image: url(../images/ic-cart-payment.svg);
      margin: 0px 8px;
      background-repeat: no-repeat;
      background-size: contain;
  }
  .ic-location{
      width: 24px;
      height: 24px;
      background-image: url(../images/ic-cart-location.svg);
      margin: 0px 8px;
      background-repeat: no-repeat;
      background-size: contain;
  }
  .ic-bag{
      width: 24px;
      height: 24px;
      background-image: url(../images/ic-cart-bag.svg);
      margin: 0px 8px;
      background-repeat: no-repeat;
      background-size: contain;
  }
  .ic-bag-active{
    width: 24px;
    height: 24px;
    background-image: url(../images/ic-cart-bag-hover.svg)!important;
    margin: 0px 8px;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .ic-location-active{
    width: 24px;
    height: 24px;
    background-image: url(../images/ic-cart-location-hover.svg)!important;
    margin: 0px 8px;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .ic-payment-active{
    width: 24px;
    height: 24px;
    background-image: url(../images/ic-cart-payment-hover.svg)!important;
    margin: 0px 8px;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .payment-warning{
      padding: 8px;
      gap: 8px;
      align-self: stretch;
      border-radius: 4px;
      background: rgba(12, 193, 117, 0.07);
  }
  .payment-warning .title{
      color: var(--character-primary, #222);
      font-family: var(--font-noto);
      font-size: 14px;
      font-style: normal;
      font-weight: 700;
      line-height: 22px;
      padding: 4px 0px;
  }
  .payment-warning .desc{
      color: var(--character-secondary, #666);
      font-family: var(--font-noto);
      font-size: 12px;
      font-style: normal;
      font-weight: 400;
      line-height: 18px;
      padding: 0px 26px;
  }
  .form-creditcard {
      border-radius: 8px;
      border: 1px solid var(--light-light-30, #E9E9E9);
      background: var(--light-light-10, #FFF);
      margin: 8px 0px;
  }
  .form-creditcard::placeholder{
      color: var(--dark-dark-10, #999);
      font-family: var(--font-noto);
      font-size: 16px;
      font-style: normal;
      font-weight: 300;
      line-height: 24px;
  }
  .bi-question-circle::before{
      font-weight: 700!important;
      font-size: 22px!important;
      vertical-align: middle!important;
  }
  .notice{
      color: var(--character-secondary, #666);
      font-family: var(--font-noto);
      font-size: 14px;
      font-style: normal;
      font-weight: 300;
      line-height: 22px;
  }
  .form-me11{
      margin-right: 11rem!important;
  }
  .btn-agent{
  
  }
  .btn-agent .radio{
      left: 0px!important;
      margin-right: 8px;
  }
  .btn-agent .name{
      display: inline-grid;
      align-items: center;
      padding-left: 8px;
  }
  .btn-agent .name .sub{
      color: var(--character-secondary, #666);
      font-family: var(--font-noto);
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: 18px;
  }
  .btn-agent .name .type{
      color: #000;
      font-family: var(--font-noto);
      font-size: 16px;
      font-style: normal;
      font-weight: 400;
      line-height: 24px;
  }
  .row-grid{
      display: grid;
      grid-template-columns: auto auto auto;
  }
  
  .data-row{
    font-family: var(--font-noto);
    display: flex;
    padding: 16px 0px;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    border-radius: 4px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
  }
  .data-row .row-1{
    display: flex;
    padding: 0px 16px;
    align-items: center;
    gap: 16px;
    align-self: stretch;
  }
  .header-table-data{
    display: flex;
    padding: 12px 12px;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
    border-radius: 4px;
    background: rgba(241, 241, 241, 0.50);
    margin-bottom: 16px;
  }
  .header-table-data span{
    font-family: var(--font-noto);
    color: rgba(102, 102, 102, 1);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .header-table-data .data-col-4{
    text-align: center;
  }
  .header-table-data .data-col-3{
    text-align: center;
  }
  
  .body-table-data{
    font-family: var(--font-noto);
    border-radius: 4px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
    margin: 16px 0px;
  }
  .data-col-1 input[type="checkbox"] {
    width: 18px;
    height: 18px;
    background-color: #F1F1F1!important;
    border: 1px solid #e9e9e9;
    border-radius: 4px;
    vertical-align: middle;
  }
  input[type='checkbox'] {
      accent-color: #E00700;
  }
  .data-col-1{
    display: flex;
    align-items: center;
  }
  .data-col-2{
    width: 50%;
    text-align: left;
  }
  .data-col-3{
    width: 13%;
  }
  .data-col-4{
    width: 20%;
  }
  .data-col-5{
    width: 10%;
    text-align: right;
    font-weight: 700;
  }
  .data-col-6{
    width: 4%;
    text-align: center;
  }
  .row-shop{
    display: flex;
    gap: 10px;
    padding: 12px 12px;
  }
  .row-detail{
    padding: 12px 12px;
  }
  .row-checked{
    background-color: rgba(255, 73, 73, 0.2)!important;
    border-radius: 4px;
  }
  
  .product-empty{
    color: currentColor;
    cursor: not-allowed;
    opacity: 0.3;
    text-decoration: none;
  }
  .empty{
    background-color: #e9e9e9!important;
  }
  
  .row-product{
    display: flex;
    gap: 10px;
    border-bottom: 1px solid #E9E9E9;
    padding: 12px 12px;
  }
  
  .row-product:first-child {
    border-top: none;
  }
  .row-product:last-child {
    border-bottom: none;
  }
  .cart-item .note{
    padding: 12px 12px;
    display: flex;
    justify-content: space-between;
  }
  .cart-item .note .form-control{
    width: 83%;
    padding: 7px 7px;
  }
  .cart-item .note .form-control::placeholder{
    color: var(--character-disable, #ff0000);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
  }
  .cart-item .data-col-3 span{
    color: var(--character-secondary, #666);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  .cart-item .total-price span{
    color: var(--character-primary, #222);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
  }
  
  .cart-item .col-details .details .status-size .option-attributes{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }
  .cart-item .col-details .details span{
    color: #000;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .cart-item .data-col-2 {
    width: 60%;
  }
  .cart-item .col-details .note .span{
    color: var(--dark-dark-30, #222);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
  }
  
  .row-detail .row-product .data-col-3{
    text-align: right;
    font-weight: 400;
  }
  .col-details{
    display: flex;
  }
  
  .col-details .img{
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 8px;
  }
  .col-details .details{
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    word-wrap: break-word;
    min-width: 0;
    padding: 0 0 0 12px;
  }
  .col-details .details span{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    letter-spacing: 1px;
  }
  
  .line-dive{
    height: 1px;
    align-self: stretch;
    background: var(--light-light-30, #E9E9E9);
  }
  .col-details .details .delivery-free{
    display: flex;
    padding: 0px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 3px;
    background: var(--system-green-10, rgba(12, 193, 117, 0.20));
  }
  .col-details .details .delivery-free span{
  color: var(--system-green-20, #0CC175);
  font-family: var(--font-noto);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  }
  .status-size{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    text-align: left;
    margin-top: 5px;
  }
  .status-size a{color: #666666!important;}
  
  .status-limit{
    color: var(--system-red-20, #FF4949);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
    margin-top: 10px;
  }
  .status-stock{
    color: #999;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
  }
  
  .details-attributes .product-quantity{
    position: relative;
    border-radius: 5px;
    border: 1px solid #dbdbdb;
    max-width: 83px;
    background-color: #fff;
  }
  
  .details-attributes .product-quantity button {
      background: none;
      color: #494949;
      border: 0;
      font-weight: 300;
      font-size: 16px;
  }
  .details-attributes .product-quantity > *:first-child {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
      padding-left: 8px;
      padding-right: 8px;
  }
  .details-attributes .product-quantity > *:last-child {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
      padding-right: 8px;
      padding-left: 8px;
  }
  .details-attributes .product-quantity input {
      width: 26px;
      height: 24px;
      border: 0;
      padding: 0 3px;
      background: none;
      font-size: 14px;
      font-weight: 300;
      outline: none;
      color: #494949;
      text-align: center;
      border-right: 1px solid #dbdbdb;
      border-left: 1px solid #dbdbdb;
      background-color: #fff;
  }
  
  .cart-pl-0{
    padding-left: 0px!important;
  }
  .cart-empty{
    text-align: center;
    margin: 150px 0px;
  }
  .total-price, .total-price span {font-weight: 700!important;}
  
  .cart-address {
    border-radius: 4px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
    padding: 16px 16px;
    overflow: hidden;
  }
  .b-name{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px;
  }
  .c-btn-r a{
    color: var(--character-link, #0C5CD4);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration-line: underline!important;
    margin: 0px 8px;
  }
  .c-add {
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 8px;
  }
  .c-btn-l span{
    font-size: 14px!important;
    border-radius: 16px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: transparent;
    padding: 5px 14px;
  }
  .c-btn-l{
    padding: 8px;
  }
  .c-btn-l .active{
    color: #E00700!important;
    font-size: 14px!important;
    border-radius: 16px;
    background: var(--primary-primary-10, rgba(224, 7, 0, 0.10));
    padding: 5px 14px;
  }
  
  .b-name .c-name {
    display: flex;
    gap: 10px;
  }
  .modal-form-register .c-add {
   padding: 0px 40px;
  }
  .modal-form-register .c-btn-l{
    margin-left: 26px;
  }
  .address-invoice{
    border-top: 1px solid #E9E9E9;
    padding: 8px 0px;
  }
  .address-invoice:first-child{
    border-top: none;
  }
  .address-invoice .b-name .c-name .l1{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    padding-right: 8px;
    border-right: 1px solid #e9e9e9;
  }
  .cart-address .c-name .l1{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    padding-right: 8px;
    border-right: 1px solid #e9e9e9;
  }
  .cart-address .c-name .l2{
    color: var(--character-primary, #222);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding-left: 8px;
  }
  .box-cart-address {
    width: 110%;
    height: 3px;
    background: url(../images/row-dive-cart.svg) repeat-x;
    position: relative;
    left: -22px;
    top: -16px;
  }
  
  .select-address{
    color: var(--dark-dark-30, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-left: 4px;
  }
  
  .cart-address span{
    color: var(--character-disable, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .locate{
    font-family: var(--font-noto);
    color: var(--character-primary, #222);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }
  .btn-add-locate {
    margin: 20px 0px 0px 6px;
    color: var(--primary-primary-30, #E00700);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }
  .form-check-input:checked{
    background-color: #E00700!important;
    border-color: #E00700!important;
  }
  .form-check-input:checked[type=radio]{
    --bs-form-check-bg-image: unset!important;
  /*  position: relative;*/
    top: 7px;
    left: 36px;
  }
  .form-check-input{
    /*--bs-form-check-bg-image: unset!important;
    position: relative;*/
    top: 7px;
    left: 36px;
  }
  
  
  .form-check-input:focus {
      box-shadow: none!important;
      outline: 1px solid #E00700!important;
      outline-offset: 3px;
  }
  .note-invoice{
    color: var(--dark-dark-30, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 8px;
  }
  .note-invoice .form-control{
    width: 55%;
    margin-top: 6px;
  }
  .note-invoice .form-control::placeholder{
    color: var(--dark-dark-10, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
  }
  
  
  .radio {
    font-size: inherit;
    margin: 0;
    position: relative;
    left: 24px;
    accent-color: #E00700;
    width: 16px;
  }
  .radio:checked ~ .plan-details {
    border-radius: 8px;
    border: 1px solid var(--primary-primary-30, #E00700);
    background: #FFF;
  }
  
  .radio:focus ~ .plan-details {
    box-shadow: none;
  }
  
  .plan-details {
      border-radius: 8px;
      border: 1px solid var(--light-light-30, #E9E9E9);
      background: #FFF;
      cursor: pointer;
      transition: border-color 0.2s ease-out;
      display: flex;
      width: 190px;
      padding: 12px 12px 12px 32px;
  }
  
  .plan-type {
      color: var(--dark-dark-30, #222);
      font-family: var(--font-noto);
      font-size: 16px;
      font-style: normal;
      font-weight: 400;
      line-height: 24px;
  }
  .cart-payment {
    border-radius: 4px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
    overflow: hidden;
  }
  .cart-payment .title{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    padding: 0px 0px;
  }
  .cart-payment-table{
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    gap: 9%;
  }
  .cart-payment-table .title span{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    text-wrap: nowrap;
  }
  .cart-payment-table .title img{
    max-width: unset;
  }
  .cart-payment-table .form-check .form-check-input{
    float: unset;
    margin-left: unset;
    margin-right: 6px;
  }
  .cart-payment-table .form-check{
    border-radius: 8px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
    padding: 10px 10px;
    width: 31%;
    margin-bottom: 12px;
  }
  .cart-payment-table .form-check active{
    border: 1px solid var(--primary-primary-30, #E00700);
  }
  .btn-select-payment{
    display: inline-flex;
    margin-right: 0px!important;
    margin-bottom: 16px;
  }
  .btn-select-payment .form-check-label{
    color: var(--dark-dark-30, #222);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  .luminosity{
    mix-blend-mode: luminosity;
  }
  
  .cart-payment-table .row-btn{
    text-align: right;
    padding-right: 16px;
  }
  .table-select .th-l{
    width: 20%;
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    padding: 0px 0px 0px 16px;
  }
  .table-select .td-r{
    width: 80%;
  }
  .bg-qr-payment{
  
  }
  .bg-qr-payment .btn-footer{
    text-align: center;
    padding: 0px 50px 28px 50px;
    display: flex;
    justify-content: center;
    gap: 50px;
  }
  .bg-qr-payment .text-desc{
    text-align: center;
    display: grid;
    padding: 24px 0px;
    gap: 10px;
  }
  .bg-qr-payment .text-desc .price{
    color: var(--primary-primary-30, #E00700);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
  }
  
  .bg-qr-payment .text-desc .agent{
    color: var(--character-secondary, #666);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
  }
  .bg-qr-payment .text-desc .note{
  color: var(--character-secondary, #666);
  text-align: center;
  font-family: var(--font-noto);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  }
  
  
  
  .qr-row{
    display: flex;
    justify-content: space-between;
    padding: 0px 16px;
  }
  .qr-row .right{
   display: grid; 
  }
  .qr-row .right .line1{
    color: var(--character-danger, #FF4949);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }
  .qr-row .right .line2{
    color: var(--character-secondary, #666);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
  }
  .qr-row .txt-l{
    color: var(--dark-dark-30, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .qr-row .txt-r{
    color: var(--dark-dark-30, #222);
    text-align: right;
    font-family: var(--font-noto);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
  }
  
  
  
  
  .dropdown-item {
    font-family: 'Noto Sans Thai', sans-serif;
  }
  /* ================= Nav Bar ======================= */
  .bg-red-2 {
    background-color: #C80500;
  }
  .bg-grey {
    background-color: #F1F1F1;
  }
  .topnav {
    background-color: #C80500;
  }
  hr {
    color: #f1f1f1!important;
    opacity: 1!important;
    margin: 20px 0px!important;
  }
  
  .topnav ul li{
  
  }
  .nav {
    --bs-nav-link-padding-x: 0rem!important;
    --bs-nav-link-padding-y: 0rem!important;
  }
  .navbar {
    padding-bottom: 2px!important;
  }
  
  .navbar>.container-xl {
    display: unset!important;
  }
  
  .navbar>.container-xl ul{
    float: right;
    /*  display: flex;*/
    margin-top: 0px;
    margin-bottom: 0px;
  }
  
  .navbar>.container-xl ul li{
    color: #fff;
    display: flex;
    align-items: center;
  }
  
  .navbar>.container-xl ul li a{
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 12px;
    font-weight: 300;
    display: flex;
    align-items: center;
  }
  
  .navbar>.container-xl ul li a:hover{
    color: #f2a100;
  }
  
  .navbar>.container-xl ul li a::before{
    
  }
  .d-content {
    display: contents;
  }
  .alerts {
    position: relative;
    display: inline-flex;
  }
  
  .alerts span{
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    background-color: #fff;
    color: #e00700;
    font-size: 12px;
    font-weight: 400;
    display: block;
    position: absolute;
    top: -6px;
    left: 12px;
    border-radius: 50%;
  }
  
  .bi-bell{
    font-size: 18px;
    color: #fff;
  }
  
  
  .top-menu, .drop-menu {
      list-style-type: none;
      padding: 0;
      margin: 0;
  }
  
  .top-menu-item {
      position: relative;
  }
  
  .top-menu-item a {
      text-decoration: none;
      color: #fff;
      display: flex;
      align-items: center;
  }
  
  .drop-menu {
      display: none;
      position: absolute;
      background-color: #fff;
      min-width: 100px;
      box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
  }
  
  .drop-menu-item {
      width: 100%;
      padding: 5px 5px;
  }
  
  .drop-menu-item:hover {
      background-color: #eee;
  }
  
  .drop-menu-item a {
      color: #555;
  
  }
  
  .top-menu-item:hover .drop-menu {
      display: block;
      position: absolute;
      margin-top: 20px;
      border: 1px solid #f0f0f0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px);
      -webkit-transition: all 300ms linear;
      -ms-transition: all 300ms linear;
      transition: all 300ms linear;
      z-index: 999;
  }
  
  .fav-icon {
      color: #fff;
      font-size: 24px;
  }
  /* ================= Nav Bar ======================= */
  
  *,
  *::before,
  *::after {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  
  body {
    margin: 0;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6d707f;
    background-color: #F1F1F1!important;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  
  [tabindex="-1"]:focus:not(:focus-visible) {
    outline: 0 !important;
  }
  
  .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: 'Noto Sans Thai', sans-serif;
  }
  
  a {
    color: #f2a100;
    text-decoration: unset!important;
  }
  
  a:hover {
    color: #c28100;
  }
  
  
  /*----------------------------------------*/
  /*  01. Template default CSS
  /*----------------------------------------*/
  /*-- Google Font --*/
  /*-- Common Style --*/
  *,
  *::after,
  *::before {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  
  html,
  body {
    height: 100%;
  }
  
  body {
    position: relative;
    outline: none;
    visibility: visible;
    overflow-X: hidden;
    color: "";
  }
  
  body[dir="rtl"] {
    text-align: right;
  }
  
  a,
  button {
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: 0;
  }
  
  a:focus,
  button:focus {
    outline: 0;
  }
  
  a {
    text-decoration: none;
    color: inherit;
  }
  
  p {
    font-size: 15px;
    line-height: 1.8;
  }
  
  p:last-child {
    margin-bottom: 0;
  }
  
  ul, ol {
    padding: 0;
    list-style: none;
    margin: 0;
  }
  
  img {
    max-width: 100%;
  }
  
  span {
    font-family: 'Noto Sans Thai', sans-serif;
  }
  .btn {
    font-family: 'Noto Sans Thai', sans-serif!important;
  }
  .btn-outline-secondary {
    border: 2px solid #E9E9E9!important;
    color: #666!important;
  }
  /*.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    border-color: unset!important;
    border: unset!important;
  }*/
  
  
  /* Section Style */
  .row-style-01 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  
  .row-divider-top {
      width: 100%;
      height: 12px;
      background: url(../images/row-divide-03.svg) repeat-x;
      position: relative;
      background-size: auto 12px;
  }
  .row-divider-bottom {
      width: 100%;
      height: 12px;
      background: url(../images/row-divide-04.svg) repeat-x;
      position: relative;
      background-size: auto 12px;
  }
  .row-divider-middle {
      width: 100%;
      height: 6px;
      background: url(../images/row-divide-05.svg) repeat-x;
      position: relative;
  }
  
  .row-divider-dashed {
      height: 6px;
      background: url(../images/row-divide-010.svg) repeat-x;
      position: relative;
  }
  
  .row-divider-top-red {
      width: 100%;
      height: 12px;
      background: url(../images/row-divide-03.svg) repeat-x;
      position: relative;
      background-size: auto 12px;
  }
  .row-divider-bottom-red {
      width: 100%;
      height: 12px;
      background: url(../images/row-divide-04.svg) repeat-x;
      position: relative;
      background-size: auto 12px;
  }
  
  .py-50 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .pb-100 {
    padding-bottom: 100px;
  }
  .pb-6 {
    padding-bottom: 6rem;
  }
  .basket-label {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 13px;
    font-weight: 300;
    margin-left: 6px;
  }
  .register-label {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 13px;
    font-weight: 300;
    margin-left: 6px;
  }
  .register-label:before {
    
  }
  .row-divider-register {
      rotate: 180deg;
      width: 100%;
      height: 12px;
      background: url(../images/row-divide-10.svg) repeat-x;
      position: relative;
      background-size: auto 16px;
  }
  
  .header-logo {
    display: flex;
    align-items: center;
  }
  .login-label {
    font-size: 13px;
    font-weight: 300;
  }
  .login-label::before {
    content: '|';
    color: #fff;
    margin-right: 10px;
  }
  .label-storage {
    color: #999;
    padding: 7px 0px;
  }
  .btn-small {
    padding: 0.1rem 0.3rem!important;
    font-size: 0.6rem!important;
  }
  
  .form-inline {
    display: flex;
  }
  .form-inline .fa-search {
    padding: 10px;
    color: #fff;
  }
  
  .form-inline .form-control {
    font-family: 'Noto Sans Thai', sans-serif;
    background-color: transparent;
    color: #fff;
  }
  
  .bg-search {
    background-color: transparent;
    padding-left: 12px;
    padding-right: 12px;
  }
  .bar-home-search {
    width: 40%;
  }
  
  .bar-home-search .input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    background-color: #fff;
    border-radius: 6px;
    padding: 2px 2px;
  }
  .bar-home-search .input-group .form-control {
    border: none;
  }
  .bar-home-search .input-group .form-control::placeholder {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 14px;
    color: #999;
    opacity: 1;
    font-weight: 300;
  }
  
  .bar-home-search .form-inline .form-control {
    font-family: 'Noto Sans Thai', sans-serif;
    background-color: #fff;
    color: #000;
  }
  
  .bar-home-search .form-inline {
    display: flex;
  }
  .bar-home-search .form-inline .fa-search {
    padding: 10px;
    color: #fff;
  }
  
  
  .form-inline .form-control::placeholder {font-size: 14px;color: #999;opacity: 1;font-weight: 300;}
  .form-inline .form-control:-ms-input-placeholder {font-size: 14px;color: #000;font-weight: 300;}
  .form-inline .form-control::-ms-input-placeholder {font-size: 14px;color: #000;font-weight: 300;}
  
  .header-meta .dropdown::hover {
    color: #f2a100;
  }
  .label-menu {
      font-family: 'Noto Sans Thai', sans-serif;
      padding-left: 6px;
      color: #fff;
      font-size: 12px;
      font-weight: 300;
  }
      
  .header-meta .action p:hover {
        font-family: 'Noto Sans Thai', sans-serif;
        color: #f2a100!important;
    }
  .btn-outline-secondary {
        font-size: 14px;
    }
  
  .header-meta .register {
    display: flex;
  }
  .header-meta .register a{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    display: flex;
    align-items: center;
    padding: 0px 5px;
  }
  .header-meta .register a:hover {
    color: #c28100;
  }
  .vr {
    opacity: 0.5!important;
    min-height: 1.5em;
  }
  .section,
  .main-wrapper {
    float: left;
    width: 100%;
    /*background-color: #fff;*/
  }
  
  /* Section Padding */
  .section-padding {
    padding-top: 50px;
    padding-bottom: 100px;
  }
  
  .section-padding-02 {
    padding-top: 100px;
  }
  
  /* Section Padding */
  .section-title-shop .shop .label{
    font-size: 24px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
  }
  .section-title-shop {
    display: flex;
    align-items: center;
  }
  .section-title-shop .title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0;
  }
  
  .section-title .title {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 0;
  }
  
  .section-title span {
    font-size: 1.4rem;
    color: #aaa;
  }
  .section-title-shop span {
    font-size: 1.4rem;
    color: #aaa;
  }
  
  .section-title-02 .title {
    font-size: 36px;
    font-weight: 700;
    color: #131313;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 3px;
  }
  
  .section-title-03 .sub-title {
    font-size: 18px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    color: #8b8b8b;
    margin-bottom: 0;
  }
  
  .section-title-03 .title {
    font-size: 48px;
    font-weight: 600;
    color: #4c5c76;
    margin-bottom: 0;
    margin-top: 5px;
    text-transform: uppercase;
  }
  
  /* tab Content */
  .tab-content .tab-pane {
    display: flex!important;
    justify-content: space-between;
    overflow: hidden;
    height: auto;
    position: absolute;
    /*  visibility: hidden;*/
    max-width: 100%;
    opacity: 0;
    transform: translateZ(0);
    transition-duration: 1s;
    transition-property: opacity,transform;
    transition-timing-function: cubic-bezier(.175,.885,.32,1.275);
  }
  
  .tab-content .tab-pane.active {
    height: auto;
    visibility: visible;
    opacity: 1;
    overflow: visible;
    /*  position: relative;*/
    transform: translateZ(0);
    transition-duration: 1s;
    transition-property: opacity,transform;
    transition-timing-function: cubic-bezier(.175,.885,.32,1.275);
  }
  
  
  
  
  .tab-content .active {
    display: flex!important;
  }
  
  .btn-product-more{
    display: flex;
    align-items: center;
    color: #666;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
  }
  .btn-product-more i{
    font-size: 24px;
  }
  .product-filter {
    display: flex;
    justify-content: space-between;
  }
  .filter-left {
    max-width: 900px;
  }
  .filter-left .nav {
    display: flex;
    padding: 8px 4px;
    justify-content: center;
    align-items: center;
    gap: 20px;
  }
  .filter-left .nav .nav-link {
    color: #222;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .filter-left .nav .nav-link.active {
    color: #E00700;
    border-bottom: 2px solid #E00700;
  }
  .filter-right {
    display: flex;
    gap: 20px;
  }
  
  
  .swiper-slide-container {
    text-align: center;
    font-size: 18px;
    background: #fff;
    height:100%;
  /*  max-width: 600px;*/
    margin:auto;
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
  }
  
  .gallery-top {
      height: 80%;
      width: 100%;
  }
  .gallery-thumbs {
      /* height: 20%;*/
      box-sizing: border-box;
      /* padding: 33px 0px;*/
      border-bottom: 2px solid #efefef;
  }
  .gallery-thumbs .swiper-slide {
      width: 20%;
      height: 100%;
      opacity: 0.4;
  }
  .gallery-thumbs .swiper-slide-active {
      opacity: 1;
      border-bottom: 2px solid #ff0000;
      padding-bottom: 30px;
  }
  
  
  .swiper-arrows {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .swiper-arrows .swiper-button-next,
  .swiper-arrows .swiper-button-prev {
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      border: 1px solid #ebebeb;
      background: #fff;
      display: block;
      color: #606060;
      border-radius: 50%;
      font-size: 40px;
      -webkit-transition: all 0.3s ease 0s;
      -o-transition: all 0.3s ease 0s;
      transition: all 0.3s ease 0s;
      outline: none;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  }
  
  .swiper-arrows .swiper-button-next {
    right: -20px;
    left: auto;
  }
  .swiper-arrows .swiper-button-prev {
    left: -20px;
    right: auto;
  }
  
  
  .swiper-arrows .swiper-button-next:hover,
  .swiper-arrows .swiper-button-prev:hover {
    color: #fff;
    background-color: #f2a100;
    border-color: #f2a100;
  }
  
  .swiper-arrows .swiper-button-next::after,
  .swiper-arrows .swiper-button-prev::after {
    display: none;
  }
  
  .bg-color-01 {
    background-color: #f6f6f6;
  }
  
  .bg-color-02 {
    background-color: #eaeaea;
  }
  
  .pagination {
    margin-top: 60px;
  }
  
  .pagination .page-item {
    margin: 0 6px;
  }
  
  .pagination .page-item .page-link {
    font-weight: 400;
    color: #000;
    padding: 0;
    width: 36px;
    height: 36px;
    line-height: 36px;
    background: #f6f6f6;
    font-size: 14px;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    border: 0;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .pagination .page-item .page-link:hover, .pagination .page-item .page-link.active {
    background-color: #f2a100;
    color: #fff;
  }
  
  /*----------------------------------------*/
  /*  02. Component CSS
  /*----------------------------------------*/
  /*--
  /*  2.1 - Button CSS
  /*----------------------------------------*/
  .btn {
    position: relative;
    z-index: 2;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 0px;
  }
  
  .btn::before {
    width: 100%;
    height: 100%;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    z-index: -1;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
            transform: scaleX(0);
  }
  
  .btn i {
    margin-left: 8px;
  }
  
  .btn:hover::before {
    -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
            transform: scaleX(1);
  }
  
  .btn-primary {
    color: #fff;
  }
  
  .btn-hover-primary:hover {
    border-color: #f2a100;
    color: #fff;
  }
  
  .btn-hover-primary:hover::before {
    background-color: #f2a100;
  }
  
  .btn-outline-primary {
    border: 1px solid #f2a100;
    color: #f2a100;
  }
  
  .btn-outline-primary:hover {
    background: #f2a100;
  }
  
  .btn-secondary {
    color: #fff;
  }
  
  .btn-hover-secondary:hover {
    border-color: #252c51;
    color: #fff;
  }
  
  .btn-hover-secondary:hover::before {
    background-color: #252c51;
  }
  
  .btn-outline-secondary {
    border: 2px solid #252c51;
    color: #252c51;
  }
  
  .btn-outline-secondary:hover {
    background: #252c51;
  }
  
  .btn-success {
    color: #fff;
  }
  
  .btn-hover-success:hover {
    border-color: #198754;
    color: #fff;
  }
  
  .btn-hover-success:hover::before {
    background-color: #198754;
  }
  
  .btn-outline-success {
    border: 1px solid #198754;
    color: #198754;
  }
  
  .btn-outline-success:hover {
    background: #198754;
  }
  
  .btn-info {
    color: #494949;
  }
  
  .btn-hover-info:hover {
    border-color: #0dcaf0;
    color: #fff;
  }
  
  .btn-hover-info:hover::before {
    background-color: #0dcaf0;
  }
  
  .btn-outline-info {
    border: 1px solid #0dcaf0;
    color: #0dcaf0;
  }
  
  .btn-outline-info:hover {
    background: #0dcaf0;
  }
  
  .btn-warning {
    color: #494949;
  }
  
  .btn-hover-warning:hover {
    border-color: #ffc107;
    color: #494949;
  }
  
  .btn-hover-warning:hover::before {
    background-color: #ffc107;
  }
  
  .btn-outline-warning {
    border: 1px solid #ffc107;
    color: #ffc107;
  }
  
  .btn-outline-warning:hover {
    background: #ffc107;
  }
  
  .btn-danger {
    color: #fff;
    background: #E00700!important;
  }
  
  
  .btn-hover-danger:hover {
    border-color: #e00700;
    color: #fff;
  }
  
  .btn-hover-danger:hover::before {
    background-color: #e00700;
  }
  
  .btn-outline-danger {
    border: 2px solid #e00700;
    color: #e00700;
    border-radius: 60px;
    --bs-btn-active-bg: #E00700!important;
  }
  
  .btn-outline-danger:hover {
    background: #e00700;
    background-color: #e00700!important;
  }
  
  .btn-light {
    color: #494949;
  }
  
  .btn-hover-light:hover {
    border-color: #f8f9fa;
    color: #494949;
  }
  
  .btn-hover-light:hover::before {
    background-color: #f8f9fa;
  }
  
  .btn-outline-light {
    border: 1px solid #f8f9fa;
    color: #f8f9fa;
  }
  
  .btn-outline-light:hover {
    background: #f8f9fa;
  }
  
  .btn-dark {
    color: #fff;
  }
  
  .btn-hover-dark:hover {
    border-color: #E00700!important;
    color: #fff!important;
  }
  
  .btn-hover-dark:hover::before {
    background-color: #E00700!important;
  }
  
  .btn-outline-dark {
    border: 1px solid #E00700!important;
    color: #E00700!important;
  }
  
  .btn-outline-dark:hover {
    background: #E00700!important;
  }
  
  /*--
  /*  2.2 - Blockquote CSS
  /*----------------------------------------*/
  blockquote {
    position: relative;
    margin-bottom: 0;
    padding-left: 35px;
    margin-top: 40px;
  }
  
  blockquote::before {
    position: absolute;
    content: '';
    width: 2px;
    height: 100%;
    background-color: #f2a100;
    top: 0;
    left: 0;
  }
  
  blockquote p {
    font-size: 18px;
    font-style: italic;
    font-weight: 400 !important;
    line-height: 1.83;
    color: #6c788c;
    margin-bottom: 0;
    margin-top: 0 !important;
  }
  
  blockquote .blockquote-name {
    font-size: 20px;
    font-weight: 600;
    color: #6c788c;
    padding-left: 40px;
    position: relative;
    margin-top: 22px;
  }
  
  blockquote .blockquote-name::before {
    position: absolute;
    content: '';
    width: 30px;
    height: 2px;
    background-color: #f2a100;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  /*--
  /*  2.3 - Form CSS
  /*----------------------------------------*/
  .single-form {
    margin-top: 0px;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"]),
  .single-form textarea {
    width: 100%;
    height: 40px;
    padding: 0px 10px 0px 10px;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    color: #999999;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    border: 1px solid #d7d7d7;
    border-radius: 8px;
    background-color: #fff;
    font-family: var(--font-noto);
    min-width: 240px;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"])::-webkit-input-placeholder,
  .single-form textarea::-webkit-input-placeholder {
    opacity: 1;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"]):-moz-placeholder,
  .single-form textarea:-moz-placeholder {
    opacity: 1;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"])::-moz-placeholder,
  .single-form textarea::-moz-placeholder {
    opacity: 1;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"]):-ms-input-placeholder,
  .single-form textarea:-ms-input-placeholder {
    opacity: 1;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"]) + input,
  .single-form textarea + input {
    margin-top: 15px;
  }
  
  .single-form input:not([type="checkbox"]):not([type="radio"]):focus,
  .single-form textarea:focus {
    border-color: #f2a100;
    outline: none;
  }
  
  .single-form label {
    font-size: 15px;
    color: #252c51;
    margin-bottom: 12px;
  }
  
  .single-form input[type="checkbox"] {
    display: none;
  }
  
  .single-form input[type="checkbox"] + label {
    padding-left: 22px;
    position: relative;
    cursor: pointer;
    margin-bottom: 0;
    font-size: 15px;
  }
  
  .single-form input[type="checkbox"] + label span {
    width: 14px;
    height: 14px;
    border: 1px solid #e1e1e1;
    position: absolute;
    display: block;
    top: 4px;
    left: 0;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-form input[type="checkbox"] + label span::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 14px;
    line-height: 12px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    color: #fff;
    text-align: center;
  }
  
  .single-form input[type="checkbox"]:checked + label span {
    background-color: #f2a100;
    border-color: #f2a100;
  }
  
  .single-form input[type="checkbox"]:checked + label span::before {
    opacity: 1;
    visibility: visible;
  }
  
  .single-form textarea {
    padding-top: 10px;
    height: 250px;
    resize: none;
  }
  
  .single-form .btn {
    height: 40px;
    line-height: 40px;
    padding: 0px 10px;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0px;
  }
  
  .radio input[type="radio"] {
    display: none;
  }
  
  .radio input[type="radio"] + label {
    padding-left: 20px;
    position: relative;
    font-size: 14px;
    line-height: 27px;
  }
  
  .radio input[type="radio"] + label span {
    width: 13px;
    height: 13px;
    border-radius: 50%;
    border: 1px solid #494949;
    display: block;
    position: absolute;
    top: 6px;
    left: 0;
  }
  
  .radio input[type="radio"] + label span::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #494949;
    top: 0;
    left: 0;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .radio input[type="radio"]:checked + label span::before {
    -webkit-transform: scale(0.7);
        -ms-transform: scale(0.7);
            transform: scale(0.7);
  }
  
  .nice_select {
    border: none;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #666;
  }
  .single-select2 {
    margin-top: 20px;
  }
  
  .single-select2 span {
    display: block;
  }
  
  .single-select2 span:focus {
    outline: none;
  }
  
  .single-select2 .form-select2 .select2 {
    width: 100% !important;
  }
  
  .single-select2 .form-select2 .select2-container--default .select2-selection--single {
    height: 50px;
    border-color: #d7d7d7;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    border-radius: 0;
    outline: none;
  }
  
  .single-select2 .form-select2 .select2-container--default .select2-selection--single .select2-selection__rendered {
    width: 100%;
    line-height: 48px;
    border-radius: 0px;
    padding-left: 20px;
    padding-right: 28px;
    font-style: italic;
    font-size: 14px;
    color: #999999;
  }
  
  
  .single-select2 .form-select2 .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 48px;
    width: 36px;
  }
  
  .single-select2 .form-select2 .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #f2a100;
  }
  
  .select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
  }
  
  .select2-container--default .select2-search--dropdown .select2-search__field {
    border-color: #ebebeb;
  }
  
  .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    outline: none;
  }
  
  .select2-dropdown {
    border-color: #ebebeb;
  }
  
  .select2-results__option {
    font-size: 14px;
  }
  
  .gj-picker {
    border: 1px solid #eeecec;
    padding: 10px;
  }
  
  .gj-picker div[role="navigator"] div:first-child,
  .gj-picker div[role="navigator"] div:last-child {
    max-width: 42px;
  }
  
  .gj-picker table tr td.selected.gj-cursor-pointer div {
    color: #fff;
    background: #f2a100;
  }
  
  .gj-picker table tr td.today div {
    color: #f2a100;
  }
  
  .gj-picker table tr td div,
  .gj-picker table tr th div {
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 12px;
  }
  
  /*--
  /*  2.4 - Quick View CSS
  /*----------------------------------------*/
  .modal.fade {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .modal.fade.show {
    display: block !important;
    opacity: 1;
    visibility: visible;
  }
  
  .modal .modal-dialog {
    width: calc(100% - 30px);
    max-width: 35rem;
  }
  
  .modal .modal-dialog .modal-content {
    position: relative;
    border: 0;
  }
  
  .modal .modal-dialog .modal-content .btn-close {
    position: inherit;
    z-index: 7;
  }
  
  .modal .modal-dialog .modal-content .btn-close:focus {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  
  .modal .modal-dialog .modal-content .modal-body {
    padding: 20px;
  }
  
  
  .quick-view-images {
    margin-top: 30px;
  }
  
  .quick-gallery-images .single-img img {
    width: 100%;
  }
  
  .quick-gallery-thumbs {
    position: relative;
  }
  
  
  .quick-gallery-thumbs .swiper-container {
    max-width: 380px;
    margin: 20px auto 0;
  }
  
  .quick-gallery-thumbs .swiper-container img {
    width: 100%;
  }
  
  .quick-gallery-thumbs .swiper-slide {
    opacity: 0.2;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .quick-gallery-thumbs .swiper-slide.swiper-slide-thumb-active {
    opacity: 1;
  }
  
  .quick-gallery-thumbs .swiper-button-next,
  .quick-gallery-thumbs .swiper-button-prev {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid #e7e7e7;
    background-color: #f8f8f8;
    display: block;
    color: #e6e6e6;
    border-radius: 50%;
    font-size: 28px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: none;
    opacity: 1;
    margin-top: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .quick-gallery-thumbs .swiper-button-next:hover,
  .quick-gallery-thumbs .swiper-button-prev:hover {
    color: #fff;
    background-color: #f2a100;
    border-color: #f2a100;
  }
  
  .quick-gallery-thumbs .swiper-button-next::after,
  .quick-gallery-thumbs .swiper-button-prev::after {
    display: none;
  }
  
  .quick-gallery-thumbs .swiper-button-next {
    right: 0;
  }
  
  .quick-gallery-thumbs .swiper-button-prev {
    left: 0;
  }
  
  .quick-view-description {
    margin-top: 25px;
  }
  
  .quick-view-description .product-name {
    font-size: 24px;
    font-weight: 600;
    color: #000;
    margin-bottom: 0;
  }
  
  .quick-view-description .price {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .quick-view-description .price .sale-price {
    font-size: 20px;
    color: #f2a100;
    margin-top: 5px;
  }
  
  
  .quick-view-description .price .old-price {
    font-size: 18px;
    color: #a4a4a4;
    margin-top: 5px;
    margin-left: 10px;
    text-decoration: line-through;
  }
  
  .quick-view-description .review-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .quick-view-description .review-wrapper .review-star {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  
  .quick-view-description .review-wrapper .review-star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 5px;
  }
  
  .quick-view-description .review-wrapper .review-star .star {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  
  .quick-view-description .review-wrapper .review-star .star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 5px;
  }
  
  
  .quick-view-description .review-wrapper p {
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    color: #9f9e9e;
    margin-top: 0;
    margin-bottom: 0;
  }
  
  .quick-view-description .label {
    color: #3f3d3d;
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    margin-right: 5px;
  }
  
  .quick-view-description .value {
    color: #9f9e9e;
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
  }
  
  .quick-view-description .product-color {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 25px;
  }
  
  .quick-view-description .product-color ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .quick-view-description .product-color ul li {
    margin-left: 15px;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"],
  .quick-view-description .product-color ul li input[type="radio"] {
    display: none;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"] + label,
  .quick-view-description .product-color ul li input[type="radio"] + label {
    margin-bottom: 0;
    font-weight: 600;
    font-size: 16px;
    color: #666666;
    font-family: 'Noto Sans Thai', sans-serif;
    cursor: pointer;
    display: block;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"] + label span,
  .quick-view-description .product-color ul li input[type="radio"] + label span {
    width: 15px;
    height: 15px;
    border-radius: 3px;
    border: 2px solid #888888;
    display: inline-block;
    position: relative;
    top: 2px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"] + label span::before,
  .quick-view-description .product-color ul li input[type="radio"] + label span::before {
    position: absolute;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 14px;
    width: 15px;
    height: 15px;
    line-height: 15px;
    top: -3px;
    left: -2px;
    text-align: center;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"]:checked + label span,
  .quick-view-description .product-color ul li input[type="radio"]:checked + label span {
    background-color: #ffb300;
    border-color: #ffb300;
  }
  
  .quick-view-description .product-color ul li input[type="checkbox"]:checked + label span::before,
  .quick-view-description .product-color ul li input[type="radio"]:checked + label span::before {
    opacity: 1;
    visibility: visible;
  }
  
  .quick-view-description p {
    line-height: 1.8;
    color: #6c788c;
    margin-bottom: 0;
    margin-top: 25px;
  }
  
  .quick-view-description .product-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 30px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .quick-view-description .product-meta > * {
    margin-right: 10px;
  }
  
  .quick-view-description .product-quantity {
    position: relative;
    margin-top: 10px;
    background-color: #494949;
    border-radius: 5px;
  }
  
  .quick-view-description .product-quantity button {
    background: none;
    color: #fff;
    height: 40px;
    border: 0;
    font-weight: 500;
    font-size: 16px;
    padding: 0;
  }
  
  .quick-view-description .product-quantity input {
    width: 35px;
    height: 40px;
    border: 0;
    padding: 0 5px;
    background: none;
    font-size: 14px;
    font-weight: 500;
    outline: none;
    color: #fff;
    text-align: center;
  }
  
  .quick-view-description .product-quantity > *:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding-left: 16px;
  }
  
  .quick-view-description .product-quantity > *:last-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding-right: 16px;
  }
  
  .quick-view-description .meta-action .btn {
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    font-weight: 500;
    font-size: 14px;
    margin-top: 10px;
    letter-spacing: 0;
  }
  
  .quick-view-description .meta-action .action {
    width: 40px;
    height: 40px;
    line-height: 44px;
    text-align: center;
    font-size: 23px;
    color: #fff;
    background-color: #494949;
    display: block;
    border-radius: 5px;
    margin-top: 10px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .quick-view-description .meta-action .action:hover {
    background-color: #f2a100;
  }
  
  .quick-view-description .product-info {
    padding-top: 33px;
  }
  
  .quick-view-description .product-info .single-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin-top: 8px;
  }
  
  .quick-view-description .social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 10px;
  }
  
  .quick-view-description .social li {
    margin-right: 25px;
  }
  
  .quick-view-description .social li a {
    font-size: 16px;
    color: #9f9e9e;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .quick-view-description .social li a:hover {
    color: #f2a100;
  }
  
  /*----------------------------------------*/
  /*  03. Header CSS
  /*----------------------------------------*/
  /*--
  /*  3.1 - Header Main CSS
  /*----------------------------------------*/
  
  .logo-brand {
    max-width: 120px;
  }
  .header-menu-2 {
    
  }
  .header-menu-2 ul{
  
  }
  .header-menu-2 ul li{
    padding: 0 15px;
    color: #fff;
    position: relative;
    float: left;
    text-decoration: none;
  }
  
  /* TEST */
  
  .mega-menu-promotions {
  
  }
  .mega-menu-promotions img{
    max-width: 270px;
  
  }
  .mega-menu-promotions h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 28px;
    font-style: normal;
    font-weight: 500;
    border-bottom: 2px dashed #666666;
  }
  .mega-menu-promotions .sub-title {
    color: #666;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    margin-bottom: 10px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .sub-menu-level-1 {
  
  }
  .sub-menu-level-1 li a{
    color: #222;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .sub-menu-level-1 li a:hover {
    color: #c28100;
  }
  .sub-menu-level-1 li{
    margin-bottom: 20px;
  }
  
  /* TEST */
  .menu-bar {
  
  }
  
  .header-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    padding: 35px 0;
  }
  
  .header-area.header-white {
    background-color: #e00700;
    padding: 3px 0px;
  }
  
  .header-menu ul {
    display: flex;
    margin-bottom: 0px;
    align-items: center;
    justify-content: flex-end;
    padding-right: 1rem;
  }
  
  .header-menu ul li {
    margin: 20px 17px;
    position: relative;
  }
  
  .header-menu ul li a {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    color: #FFF;
    text-align: center;
    font-style: normal;
    font-weight: 400;
  /*  line-height: 24px;*/
  
    text-transform: uppercase;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    display: block;
  }
  
  .header-menu ul li.active > a, .header-menu ul li:hover > a {
    color: #f2a100;
  }
  
  .header-menu ul li ul {
    display: block;
  }
  
  .header-menu ul li:hover > .sub-menu,
  .header-menu ul li:hover > .mega-sub-menu {
    top: 100%;
    opacity: 1;
    visibility: visible;
  }
  
  .header-menu .sub-menu {
    position: absolute;
    width: 255px;
    background-color: #fff;
    border-top: 2px solid #494949;
    padding: 10px 0px;
    -webkit-box-shadow: 2px 2px 20px rgba(73, 73, 73, 0.1);
            box-shadow: 2px 2px 20px rgba(73, 73, 73, 0.1);
    top: 110%;
    left: 0;
    z-index: 9;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
  }
  
  .header-menu .sub-menu li {
    padding: 0;
  }
  
  .header-menu .sub-menu li a {
    padding: 7px 20px;
  }
  
  .header-menu .sub-menu li .sub-menu {
    top: 0px;
    left: 100%;
    opacity: 0;
    visibility: hidden;
  }
  
  .header-menu .sub-menu li.menu-item-has-children > a::after {
    content: "\e684";
    font-family: 'Pe-icon-7-stroke';
    margin-left: 5px;
    font-size: 24px;
    line-height: 20px;
    display: block;
    float: right;
  }
  
  .header-menu .sub-menu li:hover > a {
    padding-left: 25px;
  }
  
  .header-menu .sub-menu li:hover .sub-menu {
    top: -12px;
    opacity: 1;
    visibility: visible;
  }
  
  .header-menu .mega-sub-menu {
    position: absolute;
    top: 110%;
    left: 0;
    right: 0;
    width: 100%;
    -webkit-box-shadow: 2px 2px 20px rgba(73, 73, 73, 0.1);
            box-shadow: 2px 2px 20px rgba(73, 73, 73, 0.1);
    background-color: #fff;
    z-index: 9;
    padding: 30px 15px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .header-menu .mega-sub-menu > li {
    width: 25%;
    padding: 0 15px;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner {
    width: 50%;
    margin-top: 20px;
    position: relative;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner img {
    width: 100%;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner a::before {
    content: "";
    background: rgba(255, 255, 255, 0.3);
    bottom: 50%;
    top: 50%;
    left: 0;
    right: 0;
    pointer-events: none;
    -webkit-transition: all 900ms linear;
    -o-transition: all 900ms linear;
    transition: all 900ms linear;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner a::after {
    content: "";
    background: rgba(255, 255, 255, 0.3);
    left: 51%;
    right: 50%;
    top: 0;
    bottom: 0;
    pointer-events: none;
    -webkit-transition: all 900ms linear;
    -o-transition: all 900ms linear;
    transition: all 900ms linear;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner a:hover::before {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: all 900ms linear;
    -o-transition: all 900ms linear;
    transition: all 900ms linear;
    opacity: 0;
  }
  
  .header-menu .mega-sub-menu > li.manu-banner a:hover::after {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: all 900ms linear;
    -o-transition: all 900ms linear;
    transition: all 900ms linear;
    opacity: 0;
  }
  
  .header-menu .mega-sub-menu > li .menu-title {
    color: #494949;
    line-height: 1;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    display: block;
    padding-bottom: 20px;
    border-bottom: 1px solid #ebebeb;
  }
  
  .header-menu .mega-sub-menu > li .menu-title::after {
    display: none;
  }
  
  .header-menu .mega-sub-menu > li:hover > a {
    color: #f2a100;
  }
  
  .header-menu .mega-sub-menu > li .menu-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 20px;
  }
  
  .header-menu .mega-sub-menu > li .menu-item > li {
    padding: 0;
  }
  
  .header-menu .mega-sub-menu > li .menu-item > li > a {
    color: #6d707f;
    text-transform: capitalize;
    line-height: 32px;
    font-weight: 400;
    font-size: 14px;
    display: block;
  }
  
  .header-menu .mega-sub-menu > li .menu-item > li:hover > a {
    padding-left: 5px;
    color: #f2a100;
  }
  
  .header-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
        -ms-flex-pack: space-between;
            justify-content: space-between;
    align-items: center;
  }
  
  .header-meta > * {
    padding: 0 10px;
  }
  
  .header-meta .action {
    font-size: 24px;
    color: #fff;
    position: relative;
    display: block;
    align-items: center;
    display: flex;
  }
  .header-meta .action img{
    max-width: unset!important;
  }
  
  .header-meta .action:hover {
    color: #f2a100;
  }
  
  .header-meta nav{
    width: 60%;
  }
  
  
  
  .header-meta .action .number {
    position: absolute;
    right: -8px;
    top: -6px;
    border-radius: 24px;
    border: 1px solid var(--primary-primary-30, #E00700);
    text-align: center;
    font-family: Noto Sans Thai;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 25px;
    background-color: #fff;
    color: #e00700;
    display: block;
  }
  
  .header-meta .dropdown .dropdown-menu {
    border-radius: 0;
    border: 0;
    -webkit-box-shadow: 0px 3px 25.5px 4.5px rgba(0, 0, 0, 0.06);
            box-shadow: 0px 3px 25.5px 4.5px rgba(0, 0, 0, 0.06);
    -webkit-transform: translate(0, 0) !important;
        -ms-transform: translate(0, 0) !important;
            transform: translate(0, 0) !important;
    top: 125% !important;
    left: 0 !important;
  }
  
  .header-meta .dropdown .dropdown-profile {
    min-width: 160px;
    padding: 8px 0;
  }
  
  .nav-menu a{
    font-family: 'Noto Sans Thai', sans-serif;
  }
  .ic-menu{
    width: 40px;
    height: 40px;
    max-width: 40px;
    max-height: 40px;
    margin-right: 10px;
  }
  
  .header-meta .dropdown .dropdown-profile li {
    line-height: 25px;
    font-size: 13px;
  }
  
  .header-meta .dropdown .dropdown-profile li a {
    display: block;
    width: 100%;
    padding: 3px 1.5rem;
    clear: both;
    font-weight: 400;
    color: #373a3c;
    text-align: inherit;
    white-space: nowrap;
    background: none;
    border: 0;
  }
  
  .header-meta .dropdown .dropdown-profile li a:hover {
    color: #f2a100;
  }
  
  .header-meta .dropdown .dropdown-cart {
    left: auto !important;
    right: -15px !important;
    width: 350px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content {
    max-height: 292px;
    overflow-y: scroll;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content::-webkit-scrollbar-track {
    background-color: #ebebeb;
    border-radius: 10px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content::-webkit-scrollbar {
    width: 5px;
    background-color: #ebebeb;
    border-radius: 10px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content::-webkit-scrollbar-thumb {
    background-color: #f2a100;
    border-radius: 10px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content ul {
    padding: 0 30px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-content ul li {
    padding: 30px 0;
    border-bottom: 1px solid #e6e6e6;
    overflow: hidden;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price {
    overflow: hidden;
    padding: 30px;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price .price-inline {
    overflow: hidden;
    line-height: 25px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price .price-inline .label {
    font-weight: 400;
    color: #a7a7a7;
    font-size: 14px;
    text-transform: uppercase;
    display: block;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price .price-inline .value {
    font-weight: 300;
    color: #a7a7a7;
    font-size: 14px;
    display: block;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price .cart-total .price-inline .label {
    font-weight: 600;
    color: #494949;
  }
  
  .header-meta .dropdown .dropdown-cart .cart-price .cart-total .price-inline .value {
    font-weight: 600;
    color: #494949;
  }
  
  .header-meta .dropdown .dropdown-cart .checkout-btn {
    padding: 0 30px 30px 30px;
  }
  
  .header-meta .dropdown .dropdown-cart .checkout-btn .btn {
    height: 50px;
    line-height: 50px;
    font-size: 16px;
  }
  
  .header-meta .dropdown .dropdown-search {
    left: 50% !important;
    right: auto !important;
    -webkit-transform: translateX(-50%) !important;
        -ms-transform: translateX(-50%) !important;
            transform: translateX(-50%) !important;
    background: #fff;
    width: 360px;
    border-radius: 5px;
    padding: 15px;
  }
  
  .single-cart-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .single-cart-item .cart-thumb {
    position: relative;
  }
  
  .single-cart-item .cart-thumb img {
    width: 85px;
  }
  
  .single-cart-item .cart-thumb .product-quantity {
    position: absolute;
    top: 5px;
    left: 5px;
    min-width: 20px;
    line-height: 20px;
    border-radius: 100%;
    padding: 0;
    text-align: center;
    color: #fff;
    font-size: 12px;
    display: inline-block;
    background-color: #f2a100;
  }
  
  .single-cart-item .cart-item-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding-left: 10px;
    padding-right: 20px;
    overflow: hidden;
    position: relative;
  }
  
  .single-cart-item .cart-item-content .product-name {
    display: block;
    text-transform: capitalize;
    font-size: 14px;
    line-height: 20px;
    color: #4c4c4c;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    margin-bottom: 0;
  }
  
  .single-cart-item .cart-item-content .product-price {
    display: block;
    margin: 5px 0 0;
    font-size: 14px;
    font-weight: 400;
    color: #f2a100;
  }
  
  .single-cart-item .cart-item-content .attributes-content {
    margin-top: 5px;
  }
  
  .single-cart-item .cart-item-content .attributes-content span {
    font-size: 14px;
    line-height: 20px;
    color: #a7a7a7;
    display: block;
    font-weight: 400;
  }
  
  .single-cart-item .cart-item-content .attributes-content span strong {
    font-weight: 400;
  }
  
  .single-cart-item .cart-item-content .cart-remove {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    color: #494949;
    font-size: 18px;
    line-height: 1.2;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .single-cart-item .cart-item-content .cart-remove:hover {
    color: #f2a100;
  }
  
  .header-search {
    position: relative;
    border-radius: 30px;
  }
  
  .header-search input {
    color: #999;
    font-family: Noto Sans Thai;
    font-weight: 300;
    border-radius: 4px;
    border: 1px solid rgba(0, 33, 105, 0.10);
    background: var(--light-light-10, #FFF);
    padding: 10px 45px 10px 20px;
    width: 100%;
    height: 40px;
    font-size: 14px;
    outline: none;
  }
  
  .header-search button {
    position: absolute;
    top: 0;
    right: 0;
    height: 46px;
    line-height: 46px;
    text-align: center;
    width: 46px;
    background: none;
    text-align: center;
    color: #494949;
    padding: 0;
    border: 0;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .header-search button i {
    font-size: 24px;
    display: block;
    line-height: 46px;
  }
  
  .header-mobile {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 93;
    background-color: #e00700;
  }
  
  .header-mobile-bottom {
    padding: 10px 0px;
    background-color: #F1F1F1;
  }
  
  .header-mobile-top {
    padding: 20px 0;
  }
  
  .header-toggle .mobile-menu-open {
    display: inline-block;
    background: none;
    border: 0;
    padding: 6px;
  }
  
  .header-toggle .mobile-menu-open span {
    width: 28px;
    height: 2px;
    background-color: #fff;
    display: block;
  
  }
  
  .header-toggle .mobile-menu-open span:nth-of-type(2) {
    margin: 6px 0;
  }
  
  .sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    -webkit-animation: sticky 1s;
            animation: sticky 1s;
    -webkit-box-shadow: 2px 4px 8px rgba(73, 73, 73, 0.15);
            box-shadow: 2px 4px 8px rgba(73, 73, 73, 0.15);
    background-color: #e00700;
    padding: 0 !important;
  }
  
  @-webkit-keyframes sticky {
    0% {
      -webkit-transform: translateY(-100%);
              transform: translateY(-100%);
    }
    100% {
      -webkit-transform: translateY(0%);
              transform: translateY(0%);
    }
  }
  
  @keyframes sticky {
    0% {
      -webkit-transform: translateY(-100%);
              transform: translateY(-100%);
    }
    100% {
      -webkit-transform: translateY(0%);
              transform: translateY(0%);
    }
  }
  
  /*--
  /*  3.4 - Off Canvas CSS
  /*----------------------------------------*/
  .off-canvas-box {
    position: fixed;
    top: 0;
    left: -320px;
    width: 320px;
    height: 100%;
    background-color: #fff;
    z-index: 999;
    overflow-y: auto;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .off-canvas-box.open {
    left: 0;
  }
  
  .canvas-action {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 12px 20px;
    border-bottom: 1px solid #ebebeb;
  }
  
  .canvas-action .action {
    font-weight: 400;
    color: #000;
    background: transparent;
    text-shadow: none;
    cursor: pointer;
    line-height: 20px;
    font-size: 13px;
    display: inline-block;
    text-transform: capitalize;
    text-decoration: none;
    margin: 0 15px;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .canvas-action .action:hover {
    color: #f2a100;
  }
  
  .canvas-close-bar {
    background-color: #e00700;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 400;
    text-transform: uppercase;
    height: 40px;
    line-height: 40px;
  }
  
  .canvas-close-bar a {
    text-decoration: none;
    color: #fff;
    font-size: 30px;
  }
  
  .canvas-close-bar a i {
    line-height: 40px;
  }
  
  .canvas-menu {
    padding-bottom: 30px;
  }
  
  .canvas-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .canvas-menu ul li {
    position: relative !important;
    display: block;
    line-height: 1;
  }
  
  .canvas-menu ul li a {
    display: block;
    color: #383838;
    font-size: 16px;
    font-weight: 400;
    padding: 5px 20px;
    padding-right: 50px;
    line-height: 30px;
    text-transform: capitalize;
    border-top: 1px solid #ebebeb;
    text-decoration: none;
  }
  
  .canvas-menu ul li a img {
    margin-right: 10px;
  }
  
  .canvas-menu ul li .mobile-menu-expand {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 13px;
    right: 21px;
    cursor: pointer;
  }
  
  .canvas-menu ul li .mobile-menu-expand::before {
    position: absolute;
    content: '';
    width: 12px;
    height: 2px;
    background-color: #383838;
    top: 7px;
    left: 2px;
  }
  
  .canvas-menu ul li .mobile-menu-expand::after {
    position: absolute;
    content: '';
    width: 2px;
    height: 12px;
    background-color: #383838;
    left: 7px;
    bottom: 2px;
    -webkit-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    transition: all 0.1s linear;
  }
  
  .canvas-menu ul li.active-expand > .mobile-menu-expand::after {
    height: 0;
  }
  
  .canvas-menu ul li ul li a {
    padding-left: 11%;
  }
  
  .canvas-menu ul li ul li ul li a {
    padding-left: 16%;
  }
  
  .canvas-menu ul li ul li ul li ul li a {
    padding-left: 21%;
  }
  
  .canvas-menu ul li ul li ul li ul li ul li a {
    padding-left: 26%;
  }
  
  .menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
  }
  
  .menu-overlay.open {
    opacity: 0.6;
    visibility: visible;
  }
  
  /*----------------------------------------*/
  /*  04. Page CSS
  /*----------------------------------------*/
  /*--
  /*  4.1 - Slider CSS
  /*----------------------------------------*/
  .carousel-control-next-icon, .carousel-control-prev-icon {
    width: 40px!important;
    height: 120px!important;
  }
  .carousel-control-next-icon {;
    background-image: url(../images/arrow-right-01.svg)!important;
  }
  .carousel-control-prev-icon {
    background-image: url(../images/arrow-left-01.svg)!important;
  }
  
  .slider-section {
    position: relative;
    overflow: hidden;
    margin-top: 45px;
  }
  
  
  .slider-section .slider-shape {
    width: 700px;
    height: 700px;
    border-radius: 50px;
    background-color: #eee5ff;
    position: absolute;
    top: -150px;
    right: -90px;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  
  .slider-section-02 {
    background-color: #f8f6ec;
    position: relative;
    overflow: hidden;
  }
  
  .single-slider {
    height: 950px;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .single-slider.slider-02 {
    background-size: cover;
    background-position: center center;
    height: 940px;
  }
  
  .slider-images {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    right: 0;
    z-index: -1;
  }
  
  .slider-content {
    max-width: 570px;
  }
  
  .slider-content .title {
    font-size: 80px;
    font-weight: 700;
    color: #313131;
    line-height: 1.15;
    margin-bottom: 0;
  }
  
  .slider-content p {
    font-size: 24px;
    color: #313131;
    margin-bottom: 0;
    margin-top: 12px;
  }
  
  .slider-content .btn {
    margin-top: 40px;
    font-weight: 500;
  }
  
  .slider-content-02 .title {
    font-size: 80px;
    font-weight: 700;
    color: #313131;
    line-height: 1.15;
    margin-bottom: 0;
  }
  
  .slider-content-02 p {
    font-size: 24px;
    color: #313131;
    margin-bottom: 0;
    margin-top: 12px;
  }
  
  .slider-content-02 .btn {
    margin-top: 40px;
    font-weight: 500;
  }
  
  .animation-style-01 .slider-images,
  .animation-style-01 .slider-content,
  .animation-style-01 .slider-content-02 {
    opacity: 0;
  }
  
  .animation-style-01.swiper-slide-active .slider-content,
  .animation-style-01.swiper-slide-active .slider-content-02 {
    opacity: 1;
  }
  
  .animation-style-01.swiper-slide-active .slider-content .title,
  .animation-style-01.swiper-slide-active .slider-content-02 .title {
    -webkit-animation-name: fadeInUpBig;
            animation-name: fadeInUpBig;
    -webkit-animation-delay: 0.4s;
            animation-delay: 0.4s;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
  }
  
  .animation-style-01.swiper-slide-active .slider-content p,
  .animation-style-01.swiper-slide-active .slider-content-02 p {
    -webkit-animation-name: fadeInUpBig;
            animation-name: fadeInUpBig;
    -webkit-animation-delay: 0.8s;
            animation-delay: 0.8s;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
  }
  
  .animation-style-01.swiper-slide-active .slider-content .btn,
  .animation-style-01.swiper-slide-active .slider-content-02 .btn {
    -webkit-animation-name: fadeInUpBig;
            animation-name: fadeInUpBig;
    -webkit-animation-delay: 1.2s;
            animation-delay: 1.2s;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
  }
  
  .animation-style-01.swiper-slide-active .slider-images {
    opacity: 1;
  }
  
  .animation-style-01.swiper-slide-active .slider-images img {
    -webkit-animation-name: fadeInRightBig;
            animation-name: fadeInRightBig;
    -webkit-animation-delay: 1.2s;
            animation-delay: 1.2s;
    -webkit-animation-duration: 1.3s;
            animation-duration: 1.3s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
  }
  
  .slider-active .swiper-pagination {
    text-align: left;
    bottom: 70px;
  }
  
  .slider-active .swiper-pagination .swiper-pagination-bullet {
    outline: none;
    background-color: #212121;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 1;
    width: 10px;
    height: 10px;
    display: inline-block;
    position: relative;
    margin: 0 8px;
  }
  
  .slider-active .swiper-pagination .swiper-pagination-bullet::before {
    position: absolute;
    content: '';
    width: 16px;
    height: 16px;
    border: 1px solid transparent;
    top: -3px;
    left: -3px;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .slider-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #f2a100;
  }
  
  .slider-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
    border-color: #f2a100;
  }
  
  .slider-active .swiper-button-next,
  .slider-active .swiper-button-prev {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #373737;
    text-transform: uppercase;
    outline: none;
    line-height: 1.2;
    width: auto;
    height: auto;
    padding-bottom: 8px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .slider-active .swiper-button-next::before,
  .slider-active .swiper-button-prev::before {
    position: absolute;
    bottom: 0;
    content: '';
    width: 100px;
    height: 2px;
    background-color: #373737;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .slider-active .swiper-button-next::after,
  .slider-active .swiper-button-prev::after {
    display: none;
  }
  
  .slider-active .swiper-button-next:hover,
  .slider-active .swiper-button-prev:hover {
    color: #f2a100;
  }
  
  .slider-active .swiper-button-next:hover::before,
  .slider-active .swiper-button-prev:hover::before {
    background-color: #f2a100;
  }
  
  .slider-active .swiper-button-prev {
    left: calc((100% - 1400px) / 2);
  }
  
  .slider-active .swiper-button-prev::before {
    left: 0;
  }
  
  .slider-active .swiper-button-next {
    right: calc((100% - 1400px) / 2);
  }
  
  .slider-active .swiper-button-next::before {
    right: 0;
  }
  
  /*--
  /*  4.2 - Banner CSS
  /*----------------------------------------*/
  
  .single-brand-02 {
      text-align: center;
  }
  .single-brand-02 img {
      -webkit-transition: all .3s linear;
      -o-transition: all .3s linear;
      transition: all .3s linear;
      max-width: 300px;
      margin-bottom: 22px;
  }
  .single-brand-02 span {
      font-size: 26px;
      font-weight: 300;
      color: #7F8083;
      -webkit-transition: all 0.3s ease 0s;
      -o-transition: all 0.3s ease 0s;
      transition: all 0.3s ease 0s;
  }
  .home-tag {
      text-align: center;
  }
  .home-tag a {
      display: inline-block;
      border-radius: 25px;
      padding: 10px 36px;
      margin: 6px;
      font-size: 16px;
      font-family: 'Noto Sans Thai', sans-serif;
      font-weight: 300;
      color: #222;
      line-height: 16px;
      border: 1px solid #aaa;
      transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  .home-tag a:hover {
      background-color: #e00700;
      color: #fff;
  }
  .home-search{
  
  }
  .home-search .home{
      padding-bottom: 1.5rem;
      border-bottom: 4px dashed #494949;
  }
  .home-section-title {}
  .home-section-title .title{
      font-size: 32px;
      font-weight: 400;
      color: #E00700!important;
      margin-bottom: 0;
  }
  .home-search .widget-search input {
    background-color: #f8f9fa!important;
    font-size: 20px;
    font-weight: 300;
    color: #999;
  }
  .home-search .widget-search input::placeholder {
    color: #aaa;
    opacity: 1;
  }
  .home-cate-bar {
    /*margin-top: -115px;*/
  }
  .single-banner {
    position: relative;
    overflow: hidden;
    margin-top: 30px;
  }
  .single-banner-home {
    position: relative;
    overflow: inherit;
    margin-top: 15px;
    text-align: center;
  }
  
  .single-banner img {
    width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  .single-banner-home img {
    width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    max-width: 170px;
  }
  
  .single-banner .banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 40px;
    padding-top: 35px;
  }
  .single-banner-home .banner-content {
    /*position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;*/
    padding: 5px;
    padding-top: 15px;
    text-align: center;
  }
  /*.single-banner-home .banner-content .title {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
  }*/
  
  .single-banner .banner-content .title {
    margin-bottom: 0;
  }
  .single-banner-home .banner-content .title {
    margin-bottom: 0;
    line-height: 1;
    text-align: center;
  }
  
  .single-banner .banner-content .title a {
    font-size: 30px;
    font-weight: 400;
    color: #1c1c1c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  .single-banner-home .banner-content .title a {
    font-size: 20px;
    font-weight: 300;
    color: #7F8083;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-banner .banner-content .title a:hover {
    color: #f2a100;
  }
  .single-banner-home .banner-content .title a:hover {
    color: #f2a100;
  }
  
  .single-banner .banner-content .discount {
    font-size: 34px;
    line-height: 1.3;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #f2a100;
    display: block;
    margin-top: 10px;
  }
  
  .single-banner .banner-content .btn {
    margin-top: 16px;
  }
  
  .single-banner .banner-content.content-02 .title a {
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-banner .banner-content.content-02 .title a:hover {
    color: #f2a100;
  }
  
  .single-banner .banner-content.content-02 .discount {
    color: #444444;
  }
  
  .single-banner:hover img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .single-banner-home:hover img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  
  .single-banner-02 {
    position: relative;
    overflow: hidden;
  }
  
  .single-banner-02 img {
    width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-banner-02 .banner-content {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 40px;
    padding-top: 35px;
  }
  
  .single-banner-02 .banner-content .title {
    margin-bottom: 0;
  }
  
  .single-banner-02 .banner-content .title a {
    font-size: 36px;
    font-weight: 400;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-banner-02 .banner-content .title a:hover {
    color: #f2a100;
  }
  
  .single-banner-02 .banner-content .discount {
    font-size: 54px;
    line-height: 1.3;
    font-weight: 700;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #f2a100;
    display: block;
    margin-top: 6px;
    color: #fff;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #fff;
  }
  
  .single-banner-02 .banner-content .btn {
    margin-top: 20px;
  }
  
  .single-banner-02:hover img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  
  .single-banner-03 {
    position: relative;
    overflow: hidden;
    margin-top: 30px;
  }
  
  .single-banner-03 img {
    width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-banner-03 .banner-content {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding: 60px;
    padding-top: 55px;
  }
  
  .single-banner-03 .banner-content .sub-title {
    font-size: 20px;
    font-weight: 500;
    color: #1c1c1c;
    margin-bottom: 0;
  }
  
  .single-banner-03 .banner-content .title {
    margin-bottom: 0;
  }
  
  .single-banner-03 .banner-content .title a {
    font-size: 40px;
    font-weight: 600;
    color: #f2a100;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    margin-top: 5px;
    display: inline-block;
  }
  
  .single-banner-03 .banner-content .title a:hover {
    color: #f2a100;
  }
  
  .single-banner-03 .banner-content .btn {
    margin-top: 25px;
  }
  
  .single-banner-03:hover img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  
  /* ------------ Promotions --------------- */
  .promotions {
  
  }
  .promotions-store {
  
  }
  .promotions-store a{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #494949;
    font-size: 16px;
    font-weight: 300;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 2;
  }
  .promotions-store a:hover{
    color: #ff0000;
    border-bottom: 3px solid #ff0000;
    padding-bottom: 2px;
    transition: all 0.3s ease 0s;
    line-height: 2;
  }
  
  .header-mobile-top {
    padding: 5px 0;
  }
  
  .pro-box {
    display: flex;
    overflow: hidden;
  }
  .bpp-left {
    width: 50%;
    padding: 10px;
  }
  .bpp-right {
    width: 50%;
  }
  .promotion-box-left img {
    border-radius: 10px;
    overflow: hidden;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s ease 0s;
      -o-transition: all 0.3s ease 0s;
      transition: all 0.3s ease 0s;
  }
  .promotion-box-left img:hover {
    transform: scale(1.02);
  }
  .promotion-box-right img {
    border-radius: 20px;
    padding: 10px;
    -webkit-transition: all 0.3s ease 0s;
      -o-transition: all 0.3s ease 0s;
      transition: all 0.3s ease 0s;
  }
  .promotion-box-right img:hover {
    transform: scale(1.02);
  }
  .promotion-box-left {
    width: 50%;
    padding: 10px 5px;
  }
  .promotion-box-right {
    width: 50%;
  }
  
  .swiper-pagination-bullet {
    margin-left: 7px;
    margin-right: 7px;
  }
  .swiper-pagination-bullet-active {
    width: 20px;
    height: 10px;
    border-radius: 10px;
    background: #DC1017!important;
  }
  .home-Preferred-wrapper .swiper-pagination-bullet-active {
    background: #fff!important;
  }
  
  /* ---------------- Home Lover Section ------------ */
  .home-lover-section {
    background-color: #B99CCF;
    position: relative;
  }
  
  .home-lover-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-lover.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-lover-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-lover-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-lover-tab .nav{
  
  }
  .home-lover-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-lover-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-lover-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-lover-tab .nav .nav-item .nav-link:active, .home-lover-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  .home-lover-section .head-box-center {
    text-align: center;
    width: unset;
    padding: unset;
  }
  .home-lover-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-lover-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .bg-lover{
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .home-lover-wrapper {
    position: relative;
  }
  .home-lover-wrapper .position-relative .swiper-container {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  
  .box-lover {
      display: flex;
  }
  .box-lover .box-top{
      
  }
  .box-lover .box-bottom{
      
  }
  
  .box-lover .box-left .top-left, .box-lover .box-left .bottom-left {
    background-image: url(../images/group-1122.png);
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    filter: drop-shadow(1px 1px 1px #ccc);
        -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
    width: 200px;
    height: 226px;
    display: flex;
    justify-content: center;
  }
  .box-lover .box-left .top-left:hover {
    
  }
  .box-lover .box-left .top-left img {
    width: 70%;
    margin: auto;
  }
  .box-lover .box-left .bottom-left h2{
    font-size: 32px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    margin: auto;
  }
  
  
  .box-lover .box-right .top-right {
    background-image: url(../images/group-1123.png);
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    filter: drop-shadow(1px 1px 1px #ccc);
        -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
    width: 200px;
    height: 226px;
    display: flex;
    justify-content: center;
  }
  .box-lover .box-right .top-right img {
    /*width: 193px;
    height: 232px;*/
    -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .box-lover .box-right .top-right img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .box-lover .box-right .card-inner {
    padding: 25px;
    overflow: hidden;
  }
  .box-lover .box-right .card-inner .price {
    position: absolute;
    bottom: 15px;
    font-size: 26px;
    font-weight: 400;
  }
  .box-lover .box-right a{
  color: #000;
  }
  .box-lover .box-right a:hover{
    color: #E00A17;
  }
  .box-lover .box-right .bottom-right {
    background-image: url(../images/group-1121.png);
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    filter: drop-shadow(1px 1px 1px #ccc);
        -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
    width: 200px;
    height: 226px;
  }
  
  .box-lover .box-right .bottom-right h2 {
    font-size: 20px;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    font-weight: 700;
    line-height: 1.3;
      display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .box-lover .box-right .bottom-right h2:hover {
    
  }
  .box-lover .box-right .bottom-right span:hover {
    
  }
  
  .box-lover .box-right .bottom-right span {
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.2;
      display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  
  .bg-lover .arrow-wrapper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -5%;
    right: auto;
    color: #000;
  }
  .bg-lover .arrow-wrapper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -5%;
    left: auto;
    color: #000;
  }
  
  
  
  .card {
    background-color: unset!important;
    border: unset!important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    padding:unset;
    transition: transform 400ms;
    opacity: 0.1;
    box-shadow: none;
  }
  
  .swiper {
    overflow: hidden;
    padding: 100px 0px;
  }
  
  .swiper-slide {
    
  }
  
  .swiper-slide-active {
    z-index: 1;
  }
  
  .swiper-slide-active .card {
    opacity: 1;
    transform: scale(1.3);
  }
  .swiper-container {
    /*padding-top: 100px;
    padding-bottom: 100px;*/
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  /* ----------------- warranty Section Start -------------------- */
  .home-warranty-section {
    background-color: #fff;
    position: relative;
    padding-bottom: 60px;
  }
  
  .home-warranty-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-08.svg) no-repeat;
      background-size: contain;
      height: 240px;
  }
  .home-warranty-section .divider-shape-bottom {
      position: absolute;
      top: 4.5rem;
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  .home-warranty-section .head-box-center {
    width: unset;
    padding: 15px 15px;
    margin-top: 3rem;
  }
  .home-warranty-section .tt-box{
    position: relative;
    z-index: 9;
  }
  .home-warranty-section .head-box-center .title h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 3.5rem;
    font-weight: 600;
    text-align: left;
    position: relative;
    line-height: 1;
    text-align: center;
    margin-bottom: 60px;
  }
  
  .home-warranty-section .head-box-center .title h5{
    font-size: 4.5rem;
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    line-height: 1;
    text-align: right;
    margin-bottom: 10px;
    position: relative;
    padding-right: 10%;
  }
  
  .home-warranty-section .head-box-center .title p{
    font-size: 24px;
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.3;
    text-align: left;
    margin-bottom: 5px;
  }
  
  .home-warranty-wrapper {
  
  }
  
  .home-warranty-wrapper h1 {
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: 70px;
  }
  
  .home-warranty-wrapper span {
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.3;
    font-size: 22px;
  }
  
  .bg-warranty{
    position: relative;
  }
  
  .tt-04 {
    position: relative;
    bottom: 6rem;
    text-align: center;
  }
  .tt-04-01 {
    width: 400px;
    z-index: 99;
    position: relative;
  }
  
  .warranty-icon {
    display: flex;
    justify-content: space-between;
  }
  
  .warranty-icon .wrt-left{
    width: 33%;
    text-align: center;
  }
  
  .warranty-icon .wrt-center{
    width: 33%;
    text-align: center;
  }
  
  .warranty-icon .wrt-right{
    width: 33%;
    text-align: center;
  }
  
  .warranty-icon .wrt-left p, .warranty-icon .wrt-center p, .warranty-icon .wrt-right p{
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 22px;
    font-weight: 500;
  }
  .warranty-icon .wrt-left img, .warranty-icon .wrt-center img, .warranty-icon .wrt-right img{
    max-width: 120px;
  
  }
  
  /* ----------------- warranty Section End ---------------------- */
  /* ----------------- warranty2 Section Start -------------------- */
  .home-warranty2-section {
    background-color: #E9E9E9;
    position: relative;
  }
  
  .home-warranty2-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-news.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-warranty2-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-warranty2-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  
  .bg-warranty2{
    
  }
  
  .wt2-box-left{
    display: flex;
    /*margin-bottom: 30px;*/
    align-items: center;
  }
  .wt2-box-left .title{
    font-size: 24px;
    color: #7D7D7D;
    padding: 10px;
  }
  .wt2-box-left .title h2{
    font-size: 30px;
    color: #222;
    margin-bottom: 0px;
    text-align: left;
  }
  .wt2-box-left img{
    width: 64px;
    height: 64px;
  
  }
  
  /* ----------------- warranty2 Section End ---------------------- */
  
  
  /* ----------------- Preferred Section Start -------------------- */
  .home-Preferred-section {
    background-color: #e00700;
    position: relative;
  }
  
  .home-Preferred-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-02.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-Preferred-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-Preferred-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-Preferred-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-Preferred-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-Preferred-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-Preferred-tab .nav{
  
  }
  .home-Preferred-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-Preferred-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-Preferred-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-Preferred-tab .nav .nav-item .nav-link:active, .home-Preferred-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-Preferred-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-Preferred-single-product .card-inner{
    max-width: 200px;
  }
    
  .home-Preferred-single-product a img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .home-Preferred-single-product a {
    /*display: block;
    overflow: hidden;*/
  }
  
  .home-Preferred-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-Preferred-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-Preferred-single-product .product-content {
    padding: 0px 18px;
  /*  height: 150px;*/
  }
  
  .home-Preferred-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-Preferred-single-product .product-content .review-wrapper .province span{
    font-size: 16px;
    display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
      color: #fff;
      line-height: 1.4;
      text-align: center;
  }
  
  .home-Preferred-single-product .product-content .title {
    margin-bottom: 6px;
    padding-top: 10px;
  }
  
  .home-Preferred-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-align: center;
  }
  
  .home-Preferred-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .Preferred-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .Preferred-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-Preferred{
    
  }
  
  .stamp_photo {
    z-index: 10;
    transition: all 0.2s;
    outline-offset: 2rem;
     -webkit-mask-box-image: url(../images/stampTiles.svg) 40 repeat;
      mask-box-image: url(../images/stampTiles.svg) 40 repeat;
  }
  .stamp_photo_square {
    
  }
  
  .bg-Preferred .arrow-wrapper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -5%;
    right: auto;
    color: #fff;
  }
  .bg-Preferred .arrow-wrapper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -5%;
    left: auto;
    color: #fff;
  }
  
  /* ----------------- Preferred Section End ---------------------- */
  
  
  /* ----------------- news Section Start -------------------- */
  .home-news-section {
    background-color: #E9E9E9;
    position: relative;
  }
  
  .home-news-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-news.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-news-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-news-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-news-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-news-section .head-box-center .title h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 40px;
    font-weight: 600;
  }
  
  .home-news-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-news-tab .nav{
  
  }
  .home-news-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-news-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-news-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-news-tab .nav .nav-item .nav-link:active, .home-news-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-news-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-news-single-product .card-inner{
    max-width: 300px;
  }
    
  .home-news-single-product a img:hover {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
    filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .home-news-single-product a {
    /*display: block;
    overflow: hidden;*/
  }
  
  .home-news-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
    border-radius: 8px;
  }
  
  .home-news-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-news-single-product .product-content {
    padding: 0px 18px;
  /*  height: 150px;*/
  }
  
  .home-news-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-news-single-product .product-content .review-wrapper .province span{
    font-size: 16px;
    display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
      color: #000;
      line-height: 1.4;
      text-align: center;
  }
  
  .home-news-single-product .product-content .title {
    margin-bottom: 6px;
    padding-top: 10px;
  }
  
  .home-news-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-align: center;
  }
  
  .home-news-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .news-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .news-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-news{
    
  }
  
  .stamp_photo {
    z-index: 10;
    transition: all 0.2s;
    outline-offset: 2rem;
     -webkit-mask-box-image: url(../images/stampTiles.svg) 40 repeat;
      mask-box-image: url(../images/stampTiles.svg) 40 repeat;
  }
  .stamp_photo_square {
    
  }
  
  .bg-news .arrow-wrapper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -5%;
    right: auto;
    color: #fff;
  }
  .bg-news .arrow-wrapper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -5%;
    left: auto;
    color: #fff;
  }
  
  .home-news-section .head-box-center .title {
  /*  text-align: left;*/
  }
  
  .home-news-wrapper .arrow-wrapper .swiper-button-next:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-prev:after {
    font-size: 45px;
    color: #999999;
  }
  .home-news-wrapper .arrow-wrapper .swiper-button-prev:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-next:after {
    font-size: 45px;
    color: #999999;
  }
  .tt-03 {
    margin-top: 30px;
  }
  
  
  /* ----------------- news Section End ---------------------- */
  
  /* ----------------- tuatop Section Start -------------------- */
  .home-tuatop-section {
    background-color: #fff;
    position: relative;
    padding-bottom: 60px;
  }
  
  .home-tuatop-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-07.svg) repeat-x;
      background-size: contain;
      height: 240px;
  }
  .home-tuatop-section .divider-shape-bottom {
      position: relative;
      bottom: 15px;
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  .home-tuatop-section .head-box-center {
    width: unset;
    padding: 15px 15px;
  }
  .home-tuatop-section .zz-box{
    padding-bottom: 44px;
  }
  .home-tuatop-section .head-box-center .title h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 5rem;
    font-weight: 600;
    text-align: left;
    position: relative;
    line-height: 1;
  }
  
  .home-tuatop-section .head-box-center .title h5{
    font-size: 4.5rem;
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    line-height: 1;
    text-align: right;
    margin-bottom: 10px;
    position: relative;
    padding-right: 10%;
  }
  
  .home-tuatop-section .head-box-center .title p{
    font-size: 24px;
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.3;
    text-align: left;
    margin-bottom: 5px;
  }
  
  .home-tuatop-wrapper {
  
  }
  
  .home-tuatop-wrapper h1 {
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    line-height: 1;
    font-size: 70px;
  }
  
  .home-tuatop-wrapper span {
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.3;
    font-size: 22px;
  }
  
  .home-tuatop-tab .nav{
  
  }
  .home-tuatop-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-tuatop-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-tuatop-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-tuatop-tab .nav .nav-item .nav-link:active, .home-tuatop-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-tuatop-single-product .product-content .title {
    margin-bottom: 6px;
    padding-top: 10px;
    position: relative;
    z-index: 9;
  }
  
  .home-tuatop-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #DC1017;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-align: center;
  }
  
  .home-tuatop-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .tuatop-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .tuatop-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-tuatop{
    position: relative;
  }
  
  .bg-tuatop:before {
    background-image: url(../images/hidden-gem-001.png);
    width: 50%;
    top: -15%;
    right: 20%;
    animation: drift-up 5s ease-in-out infinite;
  }
  
  .bg-tuatop:after {
    
  }
  
  .bg-tuatop:before, .bg-tuatop-gem:after{
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 40%;
  }
  
  
  .tt-02 {
    position: absolute;
    margin-top: 30px;
  }
  .tt-02-01 {
    width: 330px;
    z-index: 99;
    position: relative;
  }
  .tt-02-02 {
    width: 160px;
    position: relative;
    left: -45px;
  }
  
  /* ----------------- tuatop Section End ---------------------- */
  
  /* ----------------- zogzag Section Start -------------------- */
  .home-zogzag-section {
    background-color: #fff;
    position: relative;
  }
  
  .home-zogzag-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-06.svg) repeat-x;
      background-size: auto 10px;
  }
  .home-zogzag-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-zogzag-section .divider-shape-bottom {
      position: relative;
      bottom: 0px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-zogzag-section .head-box-center {
    width: unset;
    padding: 15px 80px 15px 0px;
  }
  .home-zogzag-section .zz-box{
    padding-bottom: 44px;
  }
  .home-zogzag-section .head-box-center .title h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 65px;
    font-weight: 600;
    text-align: left;
    margin-bottom: 10px;
  }
  
  .home-zogzag-section .head-box-center .title h5{
    font-size: 40px;
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    line-height: 1;
    text-align: left;
    margin-bottom: 0px;
  }
  
  .home-zogzag-section .head-box-center .title span{
    font-size: 29px;
    color: #000;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    margin-bottom: 5px;
  }
  
  .home-zogzag-tab .nav{
  
  }
  .home-zogzag-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-zogzag-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-zogzag-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-zogzag-tab .nav .nav-item .nav-link:active, .home-zogzag-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-zogzag-single-product {
    position: relative;
    margin-top: 15px;
  }
  .home-zogzag-single-product .card-inner{
  /*  max-width: 350px;*/
  }
    
  .home-zogzag-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);
    filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;*/
  }
  .home-zogzag-single-product a {
    /*display: block;
    overflow: hidden;*/
  }
  
  .home-zogzag-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-zogzag-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-zogzag-single-product .product-content {
    position: absolute;
    bottom: 0px;
    padding: 20px;
  }
  .home-zogzag-single-product .product-content:after {
    content: '';
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 100%;
    background-image: url(../images/zogzag-34.png);
    width: 100%;
    top: 10%;
    left: 0%;
    opacity: 0.9;
  /*  animation: drift-up 5s ease-in-out infinite;*/
  }
  
  .home-zogzag-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-zogzag-single-product .product-content .review-wrapper .province span{
    font-size: 16px;
    display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
      color: #000;
      line-height: 1.4;
      text-align: center;
      position: relative;
      z-index: 9;
  }
  
  .home-zogzag-single-product .product-content .title {
    margin-bottom: 6px;
    padding-top: 10px;
    position: relative;
    z-index: 9;
  }
  
  .home-zogzag-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #DC1017;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-align: center;
  }
  
  .home-zogzag-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .zogzag-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .zogzag-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-zogzag{
    
  }
  
  .stamp_photo {
    z-index: 10;
    transition: all 0.2s;
    outline-offset: 2rem;
     -webkit-mask-box-image: url(../images/stampTiles.svg) 40 repeat;
      mask-box-image: url(../images/stampTiles.svg) 40 repeat;
  }
  .stamp_photo_square {
    
  }
  
  .bg-zogzag .arrow-wrapper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -5%;
    right: auto;
    width: 40px;
    height: 40px;
    line-height: 44px;
    text-align: center;
    border: 1px solid #ebebeb;
    background: #fff;
    display: block;
    color: #606060;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: none;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .bg-zogzag .arrow-wrapper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -5%;
    left: auto;
    width: 40px;
    height: 40px;
    line-height: 44px;
    text-align: center;
    border: 1px solid #ebebeb;
    background: #fff;
    display: block;
    color: #606060;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: none;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .zz-02 {
    position: absolute;
    /*  margin-top: 33px;*/
    bottom: 0;
  
  }
  .zz-02-01 {
    width: 128px;
    top: 33px;
    z-index: 99;
    position: relative;
  }
  .zz-02-02 {
    width: 140px;
    position: relative;
  /*  left: -45px;*/
  }
  .home-zogzag-wrapper .arrow-wrapper .swiper-button-next:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-prev:after {
    font-size: 22px;
  }
  .home-zogzag-wrapper .arrow-wrapper .swiper-button-prev:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-next:after {
    font-size: 22px;
  }
  
  }
  
  .zz-box .head-box-center .title {
    padding-right: 15%;
  }
  
  /* ----------------- Zogzag Section End ---------------------- */
  
  /* ----------------- Hit Items Section Start -------------------- */
  .home-hit-items-wrapper {
  
  }
  .home-hit-items-section {
    background-color: #fff;
    position: relative;
  }
  
  .home-hit-items-section .head-box-center {
    text-align: center;
  }
  .home-hit-items-section .head-box-center h2{
    color: #E00700;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 62px;
    font-weight: 700;
  }
  
  .home-hit-items-tab .nav{
  
  }
  .home-hit-items-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-hit-items-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-hit-items-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-hit-items-tab .nav .nav-item .nav-link:active, .home-hit-items-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-hit-items-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-hit-items-single-product .card-inner{
  /*  padding: 20px;*/
    max-width: 130px;
  }
    
  .home-hit-items-single-product a img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .home-hit-items-single-product a {
    /*display: block;
    overflow: hidden;*/
  }
  
  .home-hit-items-single-product a img {
    width: 100%;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-hit-items-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-hit-items-single-product .product-content {
    /*padding: 0px 20px;
    height: 150px;*/
  }
  
  .home-hit-items-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-hit-items-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-hit-items-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 15px;
  }
  
  .home-hit-items-single-product .product-content .title a {
    font-size: 18px;
    font-weight: 400;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #707070;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.3;
    display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-align: center;
  }
  
  .home-hit-items-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .bg-hit-items{
    padding-bottom: 50px;
  }
  
  
  .bg-hit-items .arrow-wrapper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -5%;
    right: auto;
    color: #aaa;
  }
  .bg-hit-items .arrow-wrapper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -5%;
    left: auto;
    color: #aaa;
  }
  
  /* ----------------- Hit Items Section End ---------------------- */
  
  
  /* ----------------- Innovation Section Start -------------------- */
  .home-innovation-section {
    background-color: #327FEF;
    position: relative;
  }
  
  .home-innovation-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-innovation.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-innovation-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-innovation-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-innovation-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-innovation-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-innovation-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-innovation-tab .nav{
  
  }
  .home-innovation-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-innovation-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-innovation-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-innovation-tab .nav .nav-item .nav-link:active, .home-innovation-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-innovation-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-innovation-single-product .card-inner{
    padding: 26px;
  }
    
  .home-innovation-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-innovation-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-innovation-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-innovation-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-innovation-single-product .product-content {
    /*padding: 0px 20px;
    height: 150px;*/
  }
  
  .home-innovation-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-innovation-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-innovation-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-innovation-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-innovation-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .innovation-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .innovation-symbol img{
    width: 250px;
    height: auto;
  }
  
  .animate-drift-up {animation: drift-up 4s ease-in-out infinite;}
  
  @keyframes drift-up {
    0% {
      transform: translate(0%);
    }
    50% {
      transform: translate(0%, 10%);
    }
    100% {
      transform: translate(0%);
    }
  }
  .bg-innovation{
    position: relative;
    margin-top: -160px;
  }
  
  /* ----------------- Innovation Section End ---------------------- */
  
  /* ---------------- Home Creative Hand Section ------------ */
  
  .home-creative-hand-section {
    background-color: #1C8276;
    position: relative;
  }
  
  .home-creative-hand-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-creative-hand.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-creative-hand-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-creative-hand-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-creative-hand-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-creative-hand-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-creative-hand-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-creativehand-tab .nav{
  
  }
  .home-creativehand-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-creativehand-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    padding: 6px 16px;
  }
  .home-creativehand-tab .nav .nav-item .nav-link:hover{
    background-color: #14736E;
  }
  .home-creativehand-tab .nav .nav-item .nav-link:active, .home-creativehand-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-creativehand-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-creativehand-single-product .card-inner {
    padding: 20px;
  }
    
  .home-creativehand-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-creativehand-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-creativehand-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-creativehand-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-creativehand-single-product .product-content {
    /*padding: 0px 20px;
    height: 120px;*/
  }
  
  .home-creativehand-single-product .product-content .review-wrapper{
    justify-content: space-between;
    margin-top: -6px;
  }
  .home-creativehand-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-creativehand-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-creativehand-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-creativehand-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .bg-creative-hand {
    position: relative;
  }
  
  .bg-creative-hand:after {
    background-image: url(../images/creative-hand-001.png);
    width: 18%;
    bottom: 9%;
    right: 5%;
    animation: drift-up 5s ease-in-out infinite;
  }
  
  .bg-creative-hand:before, .bg-creative-hand:after{
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 20%;
  }
  
  /* ---------------- Home Taste Section ------------ */
  .home-taste-section {
    background-color: #DF7D42;
    position: relative;
  }
  
  .home-taste-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-taste.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-taste-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-taste-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-taste-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-taste-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-taste-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-taste-tab .nav{
  
  }
  .home-taste-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-taste-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  }
  .home-taste-tab .nav .nav-item .nav-link:hover{
    background-color: #CDC04B;
  }
  .home-taste-tab .nav .nav-item .nav-link:active, .home-taste-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-taste-single-product {
    position: relative;
    margin-top: 15px;  
  }
  /*    */
  
  map area.nav-link{visibility: hidden;cursor: pointer;}
  
  .tab-pane {
  }
  .list-product:nth-child(2n+1){
    float: left;
    left:- 0px;
    clear: both;
    opacity: 0;
  }
  .list-product:nth-child(2n+2){
    float: right;
    right: 0px;
    opacity: 0;
  }
  .list-product.show{
    opacity: 1;
  }
  .list-product.show:nth-child(2n+1){
    left: 0px;
  }
  .list-product.show:nth-child(2n+2){
    right: 0px;
  }
  
  
  /*    */
  .home-taste-single-product .card-inner{
    padding: 20px;
  }
    
  .home-taste-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-taste-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-taste-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-taste-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-taste-single-product .product-content {
    /*padding: 0px 20px;
    height: 120px;*/
  }
  
  .home-taste-single-product .product-content .review-wrapper{
    justify-content: space-between;
    margin-top: -6px;
  }
  .home-taste-single-product .product-content .review-wrapper .province span{
    font-size: 16px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-taste-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-taste-single-product .product-content .title a {
    font-size: 18px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-taste-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .taste-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .taste-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-taste {
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  
  .bg-taste:before {
    background-image: url(../images/taste-001.png);
    width: 17%;
    top: 2%;
    left: 6%;
    animation: drift-up 5s ease-in-out infinite;
  }
  
  
  .bg-taste:before, .bg-taste:after{
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 20%;
  }
  .map-taste{
    display: flex;
    justify-content: center;
    padding-top: 30px;
    padding-bottom: 50px;
    position: relative;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
  .dropdown-taste {
    display: flex;
    justify-content: center;
  }
  .dropdown-taste .dropdown{
    margin: 2px 30px;
  }
  
  .form-select-lg {
    padding: 8px 50px!important;
  }
  /* The container must be positioned relative: */
  .custom-select {
    position: relative;
  }
  
  .custom-select select {
    display: none; /*hide original SELECT element: */
  }
  
  .select-selected {
    background-color: #fff;
  }
  
  /* Style the arrow inside the select element: */
  .select-selected:after {
    position: absolute;
    content: "";
    top: 22px;
    right: 25px;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-color: #CF601C transparent transparent transparent;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 20px;
    font-weight: 500;
  }
  
  /* Point the arrow upwards when the select box is open (active): */
  .select-selected.select-arrow-active:after {
    border-color: #CF601C transparent transparent transparent;
    top: 10px;
    rotate: 180deg;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 20px;
    font-weight: 500;
  }
  
  /* style the items (options), including the selected item: */
  .select-items div,.select-selected {
    color: #000;
    padding: 10px 80px;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    border-radius: 50px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 22px;
    font-weight: 500;
  }
  
  /* Style items (options): */
  .select-items {
    position: absolute;
    background-color: #fff;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    box-shadow: 0 0 6px 0 rgba(0,0,0,.09);
  }
  
  /* Hide the items when the select box is closed: */
  .select-hide {
    display: none;
  }
  
  .select-items div:hover, .same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
  }
  
  
  /* ---------------- Home Hidden Gem Section ------------ */
  .home-hidden-gem-section {
    background-color: #DAC961;
    position: relative;
  }
  
  .home-hidden-gem-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-hidden-gem.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-hidden-gem-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-hidden-gem-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-hidden-gem-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-hidden-gem-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-hidden-gem-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-hiddengem-tab .nav{
  
  }
  .home-hiddengem-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-hiddengem-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    padding: 6px 16px;
  }
  .home-hiddengem-tab .nav .nav-item .nav-link:hover{
    background-color: #CDC04B;
  }
  .home-hiddengem-tab .nav .nav-item .nav-link:active, .home-hiddengem-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-hiddengem-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-hiddengem-single-product .card-inner{
    padding: 20px;
  }
    
  .home-hiddengem-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-hiddengem-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-hiddengem-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-hiddengem-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-hiddengem-single-product .product-content {
    /*padding: 0px 20px;
    height: 120px;*/
  }
  
  .home-hiddengem-single-product .product-content .review-wrapper{
    justify-content: space-between;
    margin-top: -6px;
  }
  .home-hiddengem-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-hiddengem-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-hiddengem-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-hiddengem-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .hiddengem-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .hiddengem-symbol img{
    width: 250px;
    height: auto;
  }
  
  .bg-hidden-gem {
    position: relative;
  }
  
  .bg-hidden-gem:before {
    background-image: url(../images/hidden-gem-001.png);
    width: 17%;
    top: 2%;
    left: 6%;
    animation: drift-up 5s ease-in-out infinite;
  }
  
  .bg-hidden-gem:after {
    background-image: url(../images/hidden-gem-002.png);
    width: 16%;
    bottom: 6%;
    right: 7%;
    animation: drift-up 7s ease-in-out infinite;
  }
  
  .bg-hidden-gem:before, .bg-hidden-gem:after{
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 20%;
  }
  
  
  
  /* ---------------- Home Season Play Section ------------ */
  .home-season-play-section {
    background-color: #78C6E0;
    position: relative;
  }
  
  .home-season-play-section .divider-shape {
      width: 100%;
      background: url(../images/row-divide-season.svg) repeat-x;
      background-size: auto 12px;
  }
  .home-season-play-section .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .home-season-play-section .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  .home-season-play-section .head-box-center {
    width: unset;
    text-align: center;
    padding: 15px 0px;
  }
  .home-season-play-section .head-box-center .title h2{
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 56px;
    font-weight: 500;
  }
  
  .home-season-play-section .head-box-center .title h5{
    font-size: 20px;
    color: #fff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    line-height: 1.5;
  }
  
  .home-season-tab .nav{
  
  }
  .home-season-tab .nav .nav-item{
    margin: 5px 10px;
  }
  .home-season-tab .nav .nav-item .nav-link{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #fff;
    border: 1px solid #fff;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    padding: 6px 16px;
  }
  .home-season-tab .nav .nav-item .nav-link:hover{
    background-color: #74BBE0;
  }
  .home-season-tab .nav .nav-item .nav-link:active, .home-season-tab .nav .nav-item .nav-link:focus{
    background-color: #E00700;
    border: 1px solid #E00700;
  }
  
  .home-season-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-season-single-product .card-inner{
    padding: 26px;
  }
    
  .home-season-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-season-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-season-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-season-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #E00700;
    font-size: 26px;
    font-weight: 400;
  }
  
  .home-season-single-product .product-content {
    /*padding: 0px 20px;
    height: 150px;*/
  }
  
  .home-season-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-season-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-season-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-season-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-season-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .season-symbol {
    position: absolute;
    bottom: 0%;
    left: 10%;
  }
  .season-symbol img{
    width: 250px;
    height: auto;
  }
  
  .animate-drift-up {animation: drift-up 4s ease-in-out infinite;}
  
  @keyframes drift-up {
    0% {
      transform: translate(0%);
    }
    50% {
      transform: translate(0%, 5%);
    }
    100% {
      transform: translate(0%);
    }
  }
  .bg-season-play{
    position: relative;
  }
  .bg-season-play:before {
    background-image: url(../images/season-001.png);
    width: 18%;
    top: 22%;
    left: 6%;
    animation: drift-up 5s ease-in-out infinite;
  }
  
  .bg-season-play:before, .bg-season-play:after{
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 100%;
  }
  
  /* ---------------- home-recommended-section ------------*/
  .home-recommended .arrow-wrapper .swiper-button-next{
    right: -60px;
    left: auto;
    color: #999;
  }
  
  .home-recommended .arrow-wrapper .swiper-button-prev{
    left: -60px;
    right: auto;
    color: #999;
  }
  .home-recommended-section {
    background-color: #e00700;
  }
  
  .home-recommended-wrapper .arrow-wrapper{
    
  }
  
  .home-recommended-wrapper .arrow-wrapper .swiper-button-next:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-prev:after{
    font-size: 3.2rem!important;
    color: #aaa!important;
  }
  
  .home-recommended-wrapper .arrow-wrapper .swiper-button-prev{
    left: -6%;
  }
  .home-recommended-wrapper .arrow-wrapper .swiper-button-next{
    right: -6%;
  }
  .home-recommended-wrapper .swiper-container .swiper-wrapper .swiper-slide {
    padding: 10px;
  }
  .head-rec-section {
    display: flex;
    justify-content: space-between;
    padding: 10px 0px;
  }
  .head-box-left{
    width: 30%;
    text-align: center;
  }
  .head-box-center {
    width: 50%;
  }
  .head-box-center .title h2 {
    color: #fff;
    font-size: 56px;
    font-weight: 500;
  }
  .head-box-center .title h4 {
    color: #fff;
    font-size: 48px;
    font-weight: 200;
    text-align: right;
  }
  .head-box-center .title h5 {
    font-size: 20px;
    color: #fff;
    font-weight: 300;
    line-height: 1.5;
  }
  .head-box-right {
    width: 30%;
  }
  .border-card-product {
    background-image: url(../images/bg-card-product.svg);
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    filter: drop-shadow(1px 1px 1px #ccc);
        -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  .border-card-product:hover {
    -webkit-transform: scale(1.02);
      transform: scale(1.02);
      filter: drop-shadow(4px 4px 0px red);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  
  .home-recommended-single-product {
    position: relative;
    margin-top: 15px;  
  }
  .home-recommended-single-product .card-inner{
    padding: 26px;
  }
    
  .home-recommended-single-product a img:hover {
    /*-webkit-transform: scale(1.05);
    transform: scale(1.05);*/
  }
  .home-recommended-single-product a {
    display: block;
    overflow: hidden;
  }
  
  .home-recommended-single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-recommended-single-product .province a {
    font-family: 'Noto Sans Thai', sans-serif;
    color: #aaa;
    font-size: 16px;
    font-weight: 300;
  }
  
  .home-recommended-single-product .product-content {
    /*padding: 0px 20px;
    height: 150px;*/
  }
  
  .home-recommended-single-product .product-content .review-wrapper{
    justify-content: space-between;
  }
  .home-recommended-single-product .product-content .review-wrapper .province span{
    font-size: 18px;
  }
  
  .home-recommended-single-product .product-content .review-wrapper .cate-symbol img{
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .home-recommended-single-product .product-content .review-wrapper .cate-symbol img:hover{
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .cate-symbol {
    position: fixed;
    bottom: 10px;
    right: 20px;
  }
  
  .home-recommended-single-product .product-content .title {
    margin-bottom: 0;
    padding-top: 10px;
  }
  
  .home-recommended-single-product .product-content .title a {
    font-size: 20px;
    font-weight: 500;
    font-family: 'IBM Plex Sans Thai Looped', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    line-height: 1.8;
    display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .home-recommended-single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /*--
  /*  4.3 - Product CSS
  /*----------------------------------------*/
  .product-bottom-panel-wrapper {
  
  }
  .product-bottom-panel {
    background-color: #fff;
    border: solid rgba(0,0,0,.09)!important;
    border-width: 1px 0 0!important;
    box-shadow: 0 0 6px 0 rgba(0,0,0,.09);
    position: fixed;
    bottom: 0;
    height: 55px;
    width: 100%;
    display: flex;
    z-index: 101;
  }
  .product-bottom-panel__chat-now {
    background-color: #00bfa5;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: .625rem;
    max-height: 3rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }
  .product-bottom-panel__separator {
    flex: 0;
    background-color: #00bfa5;
    display: flex;
    align-items: center;
    max-height: 3rem;
  }
  .product-bottom-panel__separator-real {
    border: solid rgba(0,0,0,.09)!important;
    border-width: 0 0 0 1px!important;
    height: 1.75rem;
    flex: 0;
  }
  .product-cart-and-buy-buttons {
    display: flex;
    flex-direction: row;
    flex: auto;
  }
  .product-bottom-panel__add-to-cart, .product-bottom-panel__buy-now, .product-bottom-panel__chat-now {
    background-color: #00bfa5;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: .625rem;
    max-height: 4rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 50%;
  }
  .product-bottom-panel__add-to-cart .stardust-icon, .product-bottom-panel__chat-now .stardust-icon {
    flex: 0 1 auto;
    width: 1.5rem;
    height: 1.5rem;
    margin-bottom: 0.25rem;
  }
  .product-bottom-panel__add-to-cart-text {
    flex: 0 1 auto;
    white-space: nowrap;
  }
  .product-bottom-panel__add-to-cart-text i {
    font-size: 20px;
    color: #fff;
    font-weight: 700;
    padding-right: 5px;
  }
  .product-bottom-panel__add-to-cart-text span,.product-bottom-panel__buy-now span {
    font-size: 18px;
    color: #fff;
  }
  .product-bottom-panel__buy-now{
    background-color: #E00700;
    width: 50%;
  }
  
  .share-products {
    max-width: 40px;
    margin: 10px 10px;
  }
  .share-products:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  .bi-check-circle-fill {
    color: #2E926E;
  }
  
  
  
  
  
  
  
  
  .product-top-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  
  .product-menu .nav li {
    margin: 0 16px;
  }
  
  .product-menu .nav li:first-child {
    margin-left: 0;
  }
  
  .product-menu .nav li:last-child {
    margin-right: 0;
  }
  
  .product-menu .nav li button {
    padding: 0;
    border: 0;
    background: none;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    color: #a7a7a7;
  }
  
  .product-menu .nav li button.active, .product-menu .nav li button:hover {
    color: #f2a100;
  }
  
  .single-product {
    position: relative;
    margin-top: 15px;
    border: 1px solid #ececec;
    border-radius: 5px;
    background-color: #fff;
  }
    
  .single-product a img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  .single-product a {
    display: block;
    overflow: hidden;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  
  .single-product a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  
  .single-product .product-content {
    padding: 10px 10px;
    height: 130px;
  }
  
  .single-product .product-content .title {
    margin-bottom: 0;
  }
  
  .single-product .product-content .title a {
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #222;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
  
  .single-product .product-content .title a:hover {
    color: #f2a100;
  }
  
  .single-product .product-content .price {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    bottom: 0;
  }
  
  .single-product .product-content .price .sale-price {
    font-size: 20px;
    color: #e00700;
    margin-top: 3px;
  }
  
  .single-product .product-content .price .old-price {
    font-size: 15px;
    color: #aaa;
    margin-top: 3px;
    margin-left: 10px;
    text-decoration: line-through;
  }
  
  .single-product .product-meta {
    position: absolute;
    bottom: 0;
    right: 0;
  }
  
  .single-product .product-meta li {
    overflow: hidden;
  }
  
  .single-product .product-meta li + li {
    margin-top: 15px;
  }
  
  .single-product .product-meta li .action {
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    font-size: 23px;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #fff;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    display: block;
    position: relative;
  }
  
  .single-product .product-meta li:last-child a {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
    visibility: visible;
    background-color: transparent;
  }
  
  .single-product:hover .product-meta li .action {
    border-color: #3d3d3d;
    background-color: #3d3d3d;
    color: #fff;
    position: relative;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  
  .single-product:hover .product-meta li .action:nth-last-of-type(1) {
    -webkit-transition-delay: 0;
         -o-transition-delay: 0;
            transition-delay: 0;
  }
  
  .single-product:hover .product-meta li .action:nth-last-of-type(2) {
    -webkit-transition-delay: 0.3;
         -o-transition-delay: 0.3;
            transition-delay: 0.3;
  }
  
  .single-product:hover .product-meta li .action:nth-last-of-type(3) {
    -webkit-transition-delay: 0.6;
         -o-transition-delay: 0.6;
            transition-delay: 0.6;
  }
  
  .single-product:hover .product-meta li .action:nth-last-of-type(4) {
    -webkit-transition-delay: 0.9;
         -o-transition-delay: 0.9;
            transition-delay: 0.9;
  }
  
  .single-product:hover .product-meta li .action:hover {
    border-color: #f2a100;
    background-color: #f2a100;
    color: #fff;
  }
  
  .single-product-02 {
    position: relative;
    margin-top: 30px;
  }
  
  .single-product-02 .product-images {
    position: relative;
  }
  
  .single-product-02 .product-images a {
    display: block;
  }
  
  .single-product-02 .product-images a img {
    width: 100%;
  }
  
  .single-product-02 .product-images .product-meta {
    position: absolute;
    bottom: 5px;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  
  .single-product-02 .product-images .product-meta li {
    overflow: hidden;
  }
  
  .single-product-02 .product-images .product-meta li + li {
    margin-left: 5px;
  }
  
  .single-product-02 .product-images .product-meta li .action {
    width: 44px;
    height: 44px;
    line-height: 44px;
    border: 1px solid #ededed;
    text-align: center;
    font-size: 23px;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #fff;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    display: block;
    position: relative;
  }
  
  .single-product-02 .product-images .discount {
    position: absolute;
    top: 17px;
    right: 20px;
    font-size: 16px;
    color: #f2a100;
  }
  
  .single-product-02 .product-content {
    padding-top: 18px;
    text-align: center;
  }
  
  .single-product-02 .product-content .title {
    margin-bottom: 0;
  }
  
  .single-product-02 .product-content .title a {
    font-size: 16px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-product-02 .product-content .title a:hover {
    color: #f2a100;
  }
  
  .single-product-02 .product-content .price {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .single-product-02 .product-content .price .sale-price {
    font-size: 18px;
    color: #f2a100;
    margin-top: 3px;
  }
  
  .single-product-02 .product-content .price .old-price {
    font-size: 16px;
    color: #a4a4a4;
    margin-top: 3px;
    margin-left: 10px;
    text-decoration: line-through;
  }
  
  
  .product-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .product-list .product-images {
    position: relative;
    width: 320px;
  }
  
  .product-list .product-content {
    padding-top: 0;
    padding-left: 30px;
    text-align: left;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    max-width: 570px;
    margin-top: -4px;
  }
  
  .product-list .product-content .title a {
    font-size: 20px;
  }
  
  .product-list .product-content .price {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 5px;
  }
  
  .product-list .product-content p {
    margin-bottom: 0;
    margin-top: 15px;
  }
  
  .product-wrapper-02 {
    padding-top: 20px;
  }
  
  .product-wrapper-02 .product-tabs-content {
    padding-top: 20px;
  }
  
  /*--
  /*  4.4 - Call to Action CSS
  /*----------------------------------------*/
  .call-to-action {
    background: #f1eee5;
    height: 696px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  
  .call-to-action-content .title {
    color: #ffb300;
    font-size: 72px;
    font-weight: 400;
    font-family: "Great Vibes", cursive;
  }
  
  .call-to-action-content p {
    font-size: 24px;
    font-weight: 400;
    color: #313131;
  }
  
  .call-to-action-content .btn {
    margin-top: 40px;
    font-weight: 500;
  }
  
  /*--
  /*  4.5 - Call to Action CSS
  /*----------------------------------------*/
  .single-benefit {
    text-align: center;
    border: 1px solid #f2a100;
    padding: 60px 50px 55px;
    margin-top: 30px;
  }
  
  .single-benefit .title {
    font-size: 30px;
    font-weight: 400;
    color: #303030;
    margin-top: 20px;
    margin-bottom: 0;
  }
  
  .single-benefit p {
    font-size: 14px;
    color: #6a6a69;
    line-height: 1.8;
    margin-bottom: 0;
    margin-top: 12px;
  }
  
  /*--
  /*  4.6 - Products Banner CSS
  /*----------------------------------------*/
  .single-products-banner {
    position: relative;
    overflow: hidden;
  }
  
  .single-products-banner img {
    width: 100%;
  }
  
  .single-products-banner .products-banner-content {
    position: absolute;
    padding: 10px;
    bottom: 0;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 20px 30px;
    padding-right: 50px;
    position: relative;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .title {
    margin-bottom: 0;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .title a {
    font-size: 30px;
    font-weight: 700;
    color: #343434;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .title a:hover {
    color: #f2a100;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .products-count {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 24px;
    color: #343434;
    display: block;
    line-height: 1.2;
    margin-top: 3px;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .arrow {
    width: 40px;
    height: 40px;
    line-height: 43px;
    text-align: center;
    border-radius: 50%;
    background-color: #f2a100;
    display: inline-block;
    font-size: 36px;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    right: 30px;
  }
  
  .single-products-banner .products-banner-content .banner-content-wrapper .arrow:hover {
    background-color: #494949;
    color: #fff;
  }
  
  .single-products-banner:hover .products-banner-content {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  
  /*--
  /*  4.7 - Blog CSS
  /*----------------------------------------*/
  .blog-top-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding-bottom: 5px;
    border-bottom: 1px solid #e6e6e6;
  }
  
  .single-blog {
    margin-top: 50px;
  }
  
  .single-blog > a {
    display: block;
  }
  
  .single-blog > a img {
    width: 100%;
  }
  
  .single-blog .gallery-active {
    position: relative;
  }
  
  .single-blog .gallery-active a {
    display: block;
  }
  
  .single-blog .gallery-active a img {
    width: 100%;
  }
  
  .single-blog .gallery-active .swiper-button-next,
  .single-blog .gallery-active .swiper-button-prev {
    margin-top: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #606060;
    display: block;
    color: #606060;
    border-radius: 50%;
    font-size: 40px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: none;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .single-blog .gallery-active .swiper-button-next:hover,
  .single-blog .gallery-active .swiper-button-prev:hover {
    color: #fff;
    background-color: #f2a100;
    border-color: #f2a100;
  }
  
  .single-blog .gallery-active .swiper-button-next::after,
  .single-blog .gallery-active .swiper-button-prev::after {
    display: none;
  }
  
  .single-blog .blog-embed {
    height: 100%;
  }
  
  .single-blog .blog-embed .ratio-16x9 {
    --bs-aspect-ratio: calc(9.35 / 15 * 100%);
  }
  
  .single-blog .blog-content {
    padding-top: 28px;
  }
  
  .single-blog .blog-content .blog-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .single-blog .blog-content .blog-meta li {
    font-size: 15px;
    font-weight: 500;
    color: #545454;
    font-family: 'Noto Sans Thai', sans-serif;
    display: inherit;
  }
  
  .single-blog .blog-content .blog-meta li i {
    font-size: 18px;
    color: #000;
    margin-right: 8px;
  }
  
  .single-blog .blog-content .blog-meta li + li {
    margin-left: 20px;
  }
  
  .single-blog .blog-content .title {
    margin-bottom: 0;
  }
  
  .single-blog .blog-content .title a {
    margin-top: 10px;
    display: inline-block;
    color: #383838;
    font-weight: 600;
    font-size: 24px;
    line-height: 1.4;
  }
  
  .single-blog .blog-content .title a:hover {
    color: #f2a100;
  }
  
  .single-blog .blog-content p {
    margin-top: 15px;
    margin-bottom: 0;
  }
  
  .single-blog .blog-content .btn {
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    margin-top: 30px;
  }
  
  /*--
  /*  4.8 - Countdown CSS
  /*----------------------------------------*/
  .countdown-content {
    margin-top: 45px;
  }
  
  .countdown-content .title {
    font-weight: 700;
    font-size: 48px;
    color: #303030;
    margin-bottom: 0;
  }
  
  .countdown-content .title span {
    color: #f2a100;
  }
  
  .countdown-content p {
    max-width: 470px;
    color: #6a6a69;
    font-size: 14px;
    padding-top: 15px;
  }
  
  .countdown-content .btn {
    padding: 0 40px;
    height: 50px;
    line-height: 50px;
    font-weight: 500;
    margin-top: 40px;
  }
  
  .countdown-wrapper .countdown {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .countdown-wrapper .countdown .single-countdown {
    text-align: center;
    position: relative;
    margin-top: 5px;
  }
  
  .countdown-wrapper .countdown .single-countdown + .single-countdown {
    margin-left: 70px;
  }
  
  .countdown-wrapper .countdown .single-countdown + .single-countdown::before {
    position: absolute;
    top: 0;
    left: -40px;
    content: ':';
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 700;
    color: #303030;
    font-size: 60px;
    line-height: 1.3;
  }
  
  .countdown-wrapper .countdown .single-countdown .count {
    font-size: 60px;
    font-weight: 700;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #303030;
    display: block;
    line-height: 1.3;
  }
  
  .countdown-wrapper .countdown .single-countdown .value {
    font-size: 16px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    text-transform: uppercase;
    color: #303030;
    display: block;
  }
  
  .countdown-images {
    position: relative;
    z-index: 1;
    text-align: right;
    margin-top: 50px;
  }
  
  .countdown-images .shape-1 {
    border-radius: 50%;
    background-color: #ffb300;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 327px;
    height: 327px;
    z-index: -1;
  }
  
  .countdown-images .shape-2 {
    background: -webkit-linear-gradient(0deg, #f8a324 0%, #ef4923 100%);
    background: -ms-linear-gradient(0deg, #f8a324 0%, #ef4923 100%);
    -webkit-box-shadow: 0px 0px 24px 6px rgba(104, 104, 104, 0.16);
            box-shadow: 0px 0px 24px 6px rgba(104, 104, 104, 0.16);
    position: absolute;
    left: 140px;
    top: 55px;
    width: 58px;
    height: 58px;
    z-index: -1;
    border-radius: 50%;
  }
  
  .countdown-images .shape-3 {
    border-radius: 50%;
    background-color: #ffa987;
    position: absolute;
    right: 50px;
    bottom: -176px;
    width: 278px;
    height: 278px;
    z-index: -1;
  }
  
  /*--
  /*  4.9 - Marker CSS
  /*----------------------------------------*/
  .marker-wrapper {
    height: 300px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
  }
  
  .marker-wrapper .marker-content {
    padding: 50px 100px;
  }
  
  .marker-wrapper .marker-content .sub-title {
    color: #4a4f52;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0;
  }
  
  .marker-wrapper .marker-content .title {
    color: #4a4f52;
    font-size: 48px;
    font-weight: 700;
    margin-top: 15px;
  }
  
  .marker-wrapper .image-pointer {
    position: absolute;
    cursor: pointer;
  }
  
  .marker-wrapper .image-pointer.pointer-01 {
    top: 50%;
    left: 44%;
  }
  
  .marker-wrapper .image-pointer.pointer-02 {
    top: 58px;
    left: 55.5%;
  }
  
  .marker-wrapper .image-pointer.pointer-03 {
    top: 40%;
    left: 67%;
  }
  
  .marker-wrapper .image-pointer.pointer-04 {
    top: 39%;
    left: 80.5%;
  }
  
  .marker-wrapper .image-pointer i {
    width: 30px;
    height: 30px;
    line-height: 26px;
    border: 2px solid #fff;
    text-align: center;
    font-size: 12px;
    display: inline-block;
    color: #fff;
    border-radius: 50%;
    background-color: rgba(255, 179, 0, 0.81);
  }
  
  .marker-wrapper .image-pointer .pointer-box {
    width: 200px;
    padding: 15px 20px;
    background-color: #fff;
    position: absolute;
    bottom: 40px;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    text-align: center;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-box-shadow: 2px 4px 8px rgba(73, 73, 73, 0.15);
            box-shadow: 2px 4px 8px rgba(73, 73, 73, 0.15);
    z-index: 5;
  }
  
  .marker-wrapper .image-pointer .pointer-box .name {
    margin-bottom: 0;
  }
  
  .marker-wrapper .image-pointer .pointer-box .name a {
    font-size: 16px;
    font-weight: 400;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .marker-wrapper .image-pointer .pointer-box .name a:hover {
    color: #f2a100;
  }
  
  .marker-wrapper .image-pointer .pointer-box .price {
    font-size: 18px;
    color: #f2a100;
    margin-top: 3px;
    display: block;
  }
  
  .marker-wrapper .image-pointer:hover .pointer-box {
    opacity: 1;
    visibility: visible;
  }
  
  /*--
  /*  4.10 - Brand CSS
  /*----------------------------------------*/
  .brand-row {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    justify-self: center;
  }
  
  .brand-row .brand-col .single-brand {
    margin-left: -1px;
  }
  
  .single-brand {
    height: 200px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: 1px solid #e1e1e1;
    padding: 20px;
  }
  
  /*--
  /*  4.11 - Page Banner CSS
  /*----------------------------------------*/
  .page-banner-section-top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 150px 0px 40px 0px;
  }
  .page-banner-section-top .page-banner-content {
    text-align: center;
    padding-bottom: 10px;
    /*border-bottom: 2px dashed;*/
    color: #666;
  }
  .page-banner-section-top .page-banner-content h1{
    color: #E00700;
    font-size: 4.5rem;
    text-decoration-line: underline;
    text-decoration-style: dashed;
    text-decoration-thickness: from-font;
    text-underline-offset: 12px;
    margin-bottom: 22px;
    line-height: 1.3;
  }
  
  
  
  .page-banner-section-top .page-banner-content h2{
    color: #E00700;
    font-size: 33px;
    line-height: 1.5;
    font-weight: 400;
  }
  
  .page-banner-section-cate {
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    height: 400px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: -130px;
    margin-top: 100px;
  }
  
  .page-banner-section {
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    height: 240px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 30px;
  }
  .search-result{
    background-image: url(../images/bg-header-rearch.png);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    height: 350px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 30px;
  }
  
  .search-result-tab {
  
  }
  
  .search-result-tab .tab-content .tab-pane {
    position: relative;
    display: block;
    overflow: hidden;
    height: 0;
    visibility: hidden;
    max-width: 100%;
    opacity: 0;
  }
  
  
  .result-product-02 {
    position: relative;
    margin-top: 10px;
  }
  
  .result-product-02 .product-images {
    position: relative;
  }
  
  .result-product-02 .product-images a {
    display: block;
  }
  
  .result-product-02 .product-images a img {
    width: 100%;
  }
  
  .result-product-02 .product-images .product-meta {
    position: absolute;
    bottom: 5px;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  
  .result-product-02 .product-images .product-meta li {
    overflow: hidden;
  }
  
  .result-product-02 .product-images .product-meta li + li {
    margin-left: 5px;
  }
  
  .result-product-02 .product-images .product-meta li .action {
    width: 44px;
    height: 44px;
    line-height: 44px;
    border: 1px solid #ededed;
    text-align: center;
    font-size: 23px;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #fff;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    display: block;
    position: relative;
  }
  
  .result-product-02 .product-images .discount {
    position: absolute;
    top: 17px;
    right: 20px;
    font-size: 16px;
    color: #f2a100;
  }
  
  .result-product-02 .product-content {
    padding-top: 18px;
    text-align: center;
  }
  
  .result-product-02 .product-content .title {
    margin-bottom: 0;
  }
  
  .result-product-02 .product-content .title a {
    font-size: 16px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #4c4c4c;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    border: none;
  }
  
  .result-product-02 .product-content .title a:hover {
    color: #f2a100;
  }
  
  .result-product-02:hover .product-meta li .action {
    border-color: #3d3d3d;
    background-color: #3d3d3d;
    color: #fff;
    position: relative;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  
  .result-product-02:hover .product-meta li .action:nth-last-of-type(1) {
    -webkit-transition-delay: 0;
         -o-transition-delay: 0;
            transition-delay: 0;
  }
  
  .result-product-02:hover .product-meta li .action:nth-last-of-type(2) {
    -webkit-transition-delay: 0.3;
         -o-transition-delay: 0.3;
            transition-delay: 0.3;
  }
  
  .result-product-02:hover .product-meta li .action:nth-last-of-type(3) {
    -webkit-transition-delay: 0.6;
         -o-transition-delay: 0.6;
            transition-delay: 0.6;
  }
  
  .result-product-02:hover .product-meta li .action:nth-last-of-type(4) {
    -webkit-transition-delay: 0.9;
         -o-transition-delay: 0.9;
            transition-delay: 0.9;
  }
  
  .result-product-02:hover .product-meta li .action:hover {
    border-color: #f2a100;
    background-color: #f2a100;
    color: #fff;
  }
  .result-product-02 a img:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    overflow: hidden;
  }
  .result-product-02 a {
    display: block;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid #999;
  }
  
  .result-product-02 a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  .result-product-02 .single-product{
    
  }
  .result-product-02 .single-product a{
    border: none;
  }
  
  
  .result-product-03 {
    position: relative;
    margin-top: 10px;
  }
  
  .result-product-03 .product-images {
    position: relative;
  }
  
  .result-product-03 .product-images a {
    display: block;
  }
  
  .result-product-03 .product-images a img {
    width: 100%;
  }
  
  .result-product-03 .product-images .product-meta {
    position: absolute;
    bottom: 5px;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  
  .result-product-03 .product-images .product-meta li {
    overflow: hidden;
  }
  
  .result-product-03 .product-images .product-meta li + li {
    margin-left: 5px;
  }
  
  .result-product-03 .product-images .product-meta li .action {
    width: 44px;
    height: 44px;
    line-height: 44px;
    border: 1px solid #ededed;
    text-align: center;
    font-size: 23px;
    color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #fff;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%);
    opacity: 0;
    visibility: hidden;
    display: block;
    position: relative;
  }
  
  .result-product-03 .product-images .discount {
    position: absolute;
    top: 17px;
    right: 20px;
    font-size: 16px;
    color: #f2a100;
  }
  
  .result-product-03 .product-content {
    
  }
  
  .result-product-03 .product-content .title {
    margin-bottom: 0;
  }
  
  .result-product-03 .product-content .title a {
  
  }
  
  .result-product-03 .product-content .title a:hover {
    color: #f2a100;
  }
  
  .result-product-03:hover .product-meta li .action {
    border-color: #3d3d3d;
    background-color: #3d3d3d;
    color: #fff;
    position: relative;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
    visibility: visible;
  }
  
  .result-product-03:hover .product-meta li .action:nth-last-of-type(1) {
    -webkit-transition-delay: 0;
         -o-transition-delay: 0;
            transition-delay: 0;
  }
  
  .result-product-03:hover .product-meta li .action:nth-last-of-type(2) {
    -webkit-transition-delay: 0.3;
         -o-transition-delay: 0.3;
            transition-delay: 0.3;
  }
  
  .result-product-03:hover .product-meta li .action:nth-last-of-type(3) {
    -webkit-transition-delay: 0.6;
         -o-transition-delay: 0.6;
            transition-delay: 0.6;
  }
  
  .result-product-03:hover .product-meta li .action:nth-last-of-type(4) {
    -webkit-transition-delay: 0.9;
         -o-transition-delay: 0.9;
            transition-delay: 0.9;
  }
  
  .result-product-03:hover .product-meta li .action:hover {
    border-color: #f2a100;
    background-color: #f2a100;
    color: #fff;
  }
  .result-product-03 a img:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    overflow: hidden;
  }
  .result-product-03 a {
    display: block;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid #999;
  }
  
  .result-product-03 a img {
    width: 100%;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
  }
  .result-product-03 .single-product{
    
  }
  .result-product-03 .single-product a{
    border: none;
  }
  /* ------------------------------------- */
  .bg_grey_1{
  
  }
  .bg_grey_2{
    background: #F8F8F8;
  }
  .img-thumb-review {
    max-width: 120px!important;
  }
  .page_border_stamp {
    background-color: #f8f9fa;
    padding: 40px;
    box-shadow: 0 0.3rem 1rem rgba(0, 0, 0, 0.8);
    z-index: 10;
    transition: all 0.2s;
    outline-offset: 2rem;
     -webkit-mask-box-image: url(../images/page_stampTiles.svg) 40 repeat;
      mask-box-image: url(../images/page_stampTiles.svg) 40 repeat;
  }
  .page_border_stamp_2 {
    border: 20px solid transparent;
    padding: 0px;
    border-image: url(../images/page_stampTiles.svg) 30 round;
  }
  .page_border_stamp_2 .bg_grey {
    background-color: #f8f9fa;
    padding: 20px;
  }
  .page_border_stamp_3 {
    background: #FFFFFF;
    /*box-shadow: 0px 0px 4px rgba(50, 50, 62, 0.12);*/
    border-radius: 16px;
    padding-top: 15px;
    padding-bottom: 15px;
  }
  
  
  .reviews .bg_grey {
    background-color: #f8f9fa;
  }
  
  .swiper-slide .single-img {
    border-radius: 15px;
  }
  
  /* ------------------------------------- */
  .page-banner-content {
    text-align: right;
    width: 403px;
    float: right;
  /*  margin-top: 8%;*/
  }
  .page-banner-content-2 {
    padding-top: 60px;
  }
  
  .page-banner-content h1{
    font-family: 'Noto Sans Thai', sans-serif;
    color: #d71f27;
    font-size: 72px;
    text-decoration-line: underline;
    text-decoration-style: dashed;
    text-decoration-thickness: from-font;
    text-underline-offset: 12px;
    margin-bottom: 22px;
    line-height: 100px;
    font-weight: 700;
  }
  
  .page-banner-content h2{
    font-family: var(--font-noto);
    color: var(--character-primary, #222);
    font-size: 26px;
    font-style: normal;
    font-weight: 400;
    line-height: 38px;
  }
  
  .page-banner-content .title {
    
  
  }
  
  .page-banner-content .breadcrumb {
    margin-bottom: 0;
  }
  
  .page-banner-content .breadcrumb li {
    font-size: 14px;
    color: #262c52;
    text-transform: uppercase;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .page-banner-content .breadcrumb li.active {
    color: #fff;
  }
  
  .page-banner-content .breadcrumb li + li::before {
    content: "\e684";
    font-family: 'Pe-icon-7-stroke';
    font-size: 22px;
    line-height: 0.8;
  }
  .page-banner-content-2 .title {
    font-size: 36px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
  }
  
  .page-banner-content-2 .breadcrumb {
    margin-bottom: 0;
  }
  
  .page-banner-content-2 .breadcrumb li {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #002169;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .page-banner-content-2 .breadcrumb li a{
    color: #002169;
  }
  
  .page-banner-content-2 .breadcrumb li.active {
    color: #000;
    font-weight: 400;
  }
  
  .page-banner-content-2 .breadcrumb li + li::before {
    content: "\e684";
    font-family: 'Pe-icon-7-stroke';
    font-size: 22px;
    line-height: 1;
  }
  .product-relate {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  /*--
  /*  4.12 - History CSS
  /*----------------------------------------*/
  .history-content p {
    font-size: 16px;
    margin-top: 25px;
  }
  
  .history-icon {
    margin-top: 40px;
    position: relative;
    z-index: 1;
  }
  
  .history-icon::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 1px;
    background-color: #fcdd93;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .history-icon img {
    border-radius: 50%;
    position: relative;
  }
  
  /*--
  /*  4.13 - Gallery CSS
  /*----------------------------------------*/
  .image-gallery {
    margin-top: 30px;
  }
  
  .image-gallery img {
    width: 100%;
  }
  
  /*--
  /*  4.13 - Counter CSS
  /*----------------------------------------*/
  .single-counter {
    text-align: center;
    border: 1px solid #e1e1e1;
    padding: 30px;
    padding-top: 35px;
    margin-top: 30px;
  }
  
  .single-counter .count {
    color: #ffb300;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    display: block;
  }
  
  .single-counter .count span {
    font-size: 60px;
    line-height: 0.8;
    font-family: 'Noto Sans Thai', sans-serif;
  }
  
  .single-counter .count sub {
    font-size: 30px;
    bottom: -11px;
  }
  
  .single-counter p {
    color: #565656;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
  }
  
  /*--
  /*  4.14 - Testimonial CSS
  /*----------------------------------------*/
  
  /*--
  /*  4.14 - Team CSS
  /*----------------------------------------*/
  .team-wrapper {
    padding-top: 14px;
  }
  
  .single-team {
    margin-top: 30px;
  }
  
  .single-team .team-images {
    overflow: hidden;
  }
  
  .single-team .team-images img {
    width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .single-team .team-content {
    text-align: center;
    padding-top: 22px;
  }
  
  .single-team .team-content .name {
    font-size: 24px;
    font-weight: 600;
    color: #4c5c76;
    text-transform: uppercase;
    margin-bottom: 0;
  }
  
  .single-team .team-content .designation {
    font-size: 18px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #656565;
    text-transform: uppercase;
  }
  
  .single-team:hover .team-images img {
    -webkit-transform: scale(1.1) rotate(3deg);
        -ms-transform: scale(1.1) rotate(3deg);
            transform: scale(1.1) rotate(3deg);
  }
  
  /*--
  /*  4.15 - Shop CSS
  /*----------------------------------------*/
  .results {
    font-size: 18px;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #666;
    font-weight: 300;
    margin-bottom: 0rem;
    line-height: 1.2;
  }
  
  .shop-top-bar-1 {
    display: flex;
    margin-top: 0px;
    align-items: center;
    justify-content: flex-start;
  }
  .shop-top-bar-2 {
    font-family: 'Noto Sans Thai', sans-serif;
    display: flex;
    align-items: center;
  }
  .shop-top-bar-2 .form-select {
    width: 30%;
    color: #212529;
  }
  .form-select select{
    color: #ff0000!important;
  }
  
  .form-select option{
    color: #ff0000!important;
    background-color: #000!important;
  }
  
  .shop-top-bar-1 .shop-text p span {
    color: #E00700;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
  }
  
  .shop-top-bar-1 .shop-tabs .nav li {
    padding: 6px 6px;
  }
  
  .shop-top-bar-1 .shop-tabs .nav li button {
    border: 0;
    padding: 0;
    background: none;
    color: #9e9e9e;
    font-size: 24px;
  }
  
  .shop-top-bar-1 .shop-tabs .nav li button:hover, .shop-top-bar-1 .shop-tabs .nav li button.active {
    color: #000;
  }
  .btn-sort {
    color: #666!important;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    border: 1px solid #E9E9E9!important;
    overflow: unset;
  }
  .btn-sort:hover {
    border-color: #ff0000!important;
    color: #ff0000!important;
  }
  .results-search {
    display: flex;
    justify-content: center;
  }
  .not-found {
    text-align: center;
    margin: 150px auto;
  }
  .not-found p {
    color: #999;
    text-align: center;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  .page-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 15px;
  }
  .page-pagination .btn{
    font-size: 16px;
  }
  
  .page-pagination .btn.active {
    background-color: #E00700;
    border-color: #E00700;
    color: #fff!important;
  }
  
  .page-pagination .btn-outline-danger:hover {
    background-color: #E00700;
    color: #fff!important;
  }
  .page-pagination .btn-outline-danger {
    border-color: #E00700!important;
    color: #E00700!important;
  }
  
  .shop-sort {
    background-color: #fff;
    padding: 5px 8px;
    border-radius: 6px;
    color: #222;
    font-size: 16px;
    height: 40px;
  }
  .shop-top-bar-1 .shop-sort .title {
    white-space: nowrap;
    font-size: 18px;
    font-weight: 300;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #6c6c6c;
  }
  
  .shop-top-bar-1 .shop-sort .nice-select {
    border-radius: 0;
    border: 0;
    display: inline-block;
    float: none;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-weight: 300;
    height: 28px;
    line-height: 26px;
    outline: none;
    padding-left: 0;
    padding-right: 15px;
    color: #222;
  }
  .filter-cate {
    text-align: right;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #494949;
    font-size: 16px;
    font-weight: 300;
  }
  .filter-cate .shop-sort .nice-select {
      border-radius: 3px;
      border: 1px solid #dbdbdb;
      display: inline-block;
      float: none;
      font-family: 'Noto Sans Thai', sans-serif;
      font-size: 16px;
      font-weight: 300;
      height: 28px;
      line-height: 26px;
      outline: none;
      padding-left: 18px;
      padding-right: 26px;
      color: #222;
      margin-left: 6px;
  }
  
  .shop-top-bar-1 .shop-sort .nice-select::after {
    display: none;
  }
  
  .shop-top-bar-1.shop-sort .nice-select .list {
    border-radius: 0;
  }
  
  .shop-top-bar-1 .shop-sort .nice-select .list .option {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 14px;
    line-height: 28px;
    list-style: none;
    min-height: 28px;
    outline: none;
    padding-left: 15px;
    padding-right: 15px;
    color: #222;
    font-weight: 400;
  }
  
  /*--
  /*  4.16 - Product Details CSS
  /*----------------------------------------*/
  .shop-product-wrapper {
  
  }
  .shop-product-wrapper .row .px-5{
    padding-left: 5px!important;
    padding-right: 5px!important;
  }
  .product-details-images {
    
  }
  
  .details-gallery-images .single-img img {
    width: 100%;
  }
  
  .details-gallery-thumbs {
    position: relative;
  }
  
  .details-gallery-thumbs .swiper-container {
    max-width: 410px;
    margin: 20px auto 0;
  }
  
  .details-gallery-thumbs .swiper-container img {
    width: 100%;
    border-radius: 8px;
  }
  
  .details-gallery-thumbs .swiper-slide {
    opacity: 1;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .details-gallery-thumbs .swiper-slide.swiper-slide-thumb-active {
    opacity: 1;
  }
  
  .details-gallery-thumbs .swiper-button-next,
  .details-gallery-thumbs .swiper-button-prev {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid #e7e7e7;
    background-color: #000;
    display: block;
    color: #e6e6e6;
    border-radius: 50%;
    font-size: 28px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    outline: none;
    opacity: 0.6;
    margin-top: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .details-gallery-thumbs .swiper-button-next:hover,
  .details-gallery-thumbs .swiper-button-prev:hover {
    color: #fff;
    background-color: #f2a100;
    border-color: #f2a100;
  }
  
  .details-gallery-thumbs .swiper-button-next::after,
  .details-gallery-thumbs .swiper-button-prev::after {
    display: none;
  }
  
  .details-gallery-thumbs .swiper-button-next {
    right: 0;
  }
  
  .details-gallery-thumbs .swiper-button-prev {
    left: 0;
  }
  
  .product-details-description {
    
  }
  
  .product-details-description.product-details-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 130px;
    left: 0;
    width: 100%;
  }
  
  .product-details-description .product-name {
    font-size: 22px;
    font-weight: 400;
    color: #000;
    margin-bottom: 0;
  }
  
  .product-details-description .shop {
    padding: 10px 0px;
  }
  
  .product-details-description .shop .label{
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-weight: 300;
    margin-left: 6px;
  }
  .product-details-description .shop a{
    color: #666;
  }
  .product-details-description .shop a:hover {
    color: #c28100;
  }
  
  .bi-shop-window {
    font-size: 20px;
  }
  
  .product-details-description .delivery .free{
      display: inline-block;
      padding: 2px 10px;
      border-radius: 6px;
      margin-right: 10px;
      background: rgba(46, 146, 110, 0.1);
  }
  
  .product-details-description .delivery .free i{
      color: #2e926e;
  }
  
  .product-details-description .delivery span{
    font-size: 14px;
    color: #222;
  }
  
  .product-details-description .delivery span::before {
  
  }
  
  .product-details-description .delivery .free span{
    color: var(--system-green-20, #0CC175);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
  }
  
  
  
  
  
  
  
  
  
  
  
  .product-details-description .price {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .product-details-description .price .sale-price {
    font-size: 26px;
    color: #e00700;
    margin-top: 5px;
    font-weight: 500;
  }
  
  .product-details-description .price .old-price {
    font-size: 20px;
    color: #a4a4a4;
    margin-top: 5px;
    margin-left: 10px;
    text-decoration: line-through;
  }
  
  .product-details-description .review-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    padding-top: 2px;
  }
  .review-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .review-wrapper .province {
    color: #aaa;
    font-weight: 300;
  }
  
  .product-details-description .review-wrapper .review-star {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  .review-wrapper-detail .review-detail {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  
  .product-details-description .review-wrapper .review-star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 10px;
  }
  
  .review-star {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  
  .review-star span{
    color: #9f9e9e;
    font-size: 14px;
    font-weight: 300;
  }
  
  .star-detail {
    position: relative;
    display: inline-block;
    margin-right: 8px;
  }
  .star-detail::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 24px;
    letter-spacing: 10px;
  }
  .review-wrapper-detail .review-detail .star-detail {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  .review-wrapper-detail .review-detail .star-detail::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 24px;
    letter-spacing: 10px;
  }
  
  .review-detail::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 24px;
    letter-spacing: 10px;
  }
  
  
  
  
  
  
  .review-star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 10px;
  }
  
  .product-details-description .review-wrapper .review-star .star {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  
  .product-details-description .review-wrapper .review-star .star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 10px;
  }
  
  .review-wrapper .review-star .star {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  
  
  .review-wrapper .review-star .star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
    letter-spacing: 10px;
  }
  
  .product-details-description .review-wrapper p {
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    color: #9f9e9e;
    margin-top: 0;
    margin-bottom: 0;
  }
  .review-wrapper p {
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 300;
    color: #aaa;
    margin-top: 0;
    margin-bottom: 0;
  }
  
  .product-details-description .label {
    color: #3f3d3d;
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 500;
    margin-right: 5px;
    padding: 3px 0px;
  }
  
  .product-details-description .value {
    color: #9f9e9e;
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 400;
    margin: 10px 10px;
  }
  
  
  
  
  /* ====================== Product Color ============================== */
  .product-details-description .product-color {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 25px;
  }
  
  .product-details-description .product-color ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .product-details-description .product-color ul li {
    margin-left: 15px;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"],
  .product-details-description .product-color ul li input[type="radio"] {
    display: none;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"] + label,
  .product-details-description .product-color ul li input[type="radio"] + label {
    margin-bottom: 0;
    font-weight: 600;
    font-size: 16px;
    color: #666666;
    font-family: 'Noto Sans Thai', sans-serif;
    cursor: pointer;
    display: block;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"] + label span,
  .product-details-description .product-color ul li input[type="radio"] + label span {
    width: 15px;
    height: 15px;
    border-radius: 3px;
    border: 2px solid #888888;
    display: inline-block;
    position: relative;
    top: 2px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"] + label span::before,
  .product-details-description .product-color ul li input[type="radio"] + label span::before {
    position: absolute;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 14px;
    width: 15px;
    height: 15px;
    line-height: 15px;
    top: -3px;
    left: -2px;
    text-align: center;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"]:checked + label span,
  .product-details-description .product-color ul li input[type="radio"]:checked + label span {
    background-color: #ffb300;
    border-color: #ffb300;
  }
  
  .product-details-description .product-color ul li input[type="checkbox"]:checked + label span::before,
  .product-details-description .product-color ul li input[type="radio"]:checked + label span::before {
    opacity: 1;
    visibility: visible;
  }
  /* ====================== Product Color ============================== */
  
  /* ====================== Product Size ============================== */
  .btn-outline-secondary:hover {
    background: #2E926E1A!important;
  }
  .btn-outline-primary {
    color: #aaa;
      border: 1px solid #dbdbdb;
  }
  .btn-outline {
    background-color: #fff!important;
  }
  .btn-outline-primary:hover {
    color: #aaa;
      border: 1px solid #dbdbdb;
  }
  .product-details-description .product-quantity > *:first-child {
        border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
      padding-left: 16px;
      padding-right: 16px;
  }
  .btn-outline-secondary:active {
    background: #e00700!important;
    color: #fff!important;
  }
  .btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
    color: #fff;
    background-color: #e00700;
    border-color: unset;  
  }
  .btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
    background: #e00700!important;
    color: #fff!important;
  }
  .product-attributes-1 {
  
  }
  .product-attributes-1 .btn-outline-secondary {
    font-size: 12px;
    padding: 4px 12px;
  }
  .product-details-description .product-attributes-1 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 15px;
  }
  
  .product-details-description .product-attributes-1 ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    padding-left: 0rem;
  }
  
  .product-details-description .product-attributes-1 ul li {
    margin: 6px 10px;
    /*background-color: #e9ecef;
    padding: 5px 20px;
    border-radius: 20px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    margin: 0 8px 8px 15px;*/
  }
  
  .product-details-description .product-attributes-1 ul li a:visited {
    background-color: #ff0000;
  }
  
  .product-details-description .product-attributes-1 ul li:visited {
    background-color: #e00700!important;
  }
  
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"],
  .product-details-description .product-attributes-1 ul li input[type="radio"] {
    display: none;
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label,
  .product-details-description .product-attributes-1 ul li input[type="radio"] + label {
    margin-bottom: 0;
    font-weight: 300;
    font-size: 14px;
    color: #aaa;
    font-family: 'Noto Sans Thai', sans-serif;
    cursor: pointer;
    display: block;
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label,
  .product-details-description .product-attributes-1 ul li input[type="radio"] + label:hover {
    color: #aaa;
    border: 1px solid #dbdbdb;
  }
  .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label,
  .product-details-description .product-attributes-1 ul li input[type="radio"] + label:visited {
    /*color: #fff!important;
    background-color: #ff0000!important;*/
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label span,
  .product-details-description .product-attributes-1 ul li input[type="radio"] + label span {
    width: 15px;
    height: 15px;
    border-radius: 3px;
    border: 2px solid #888888;
    display: inline-block;
    position: relative;
    top: 2px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label span::before,
  .product-details-description .product-attributes-1 ul li input[type="radio"] + label span::before {
    position: absolute;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 14px;
    width: 15px;
    height: 15px;
    line-height: 15px;
    top: -3px;
    left: -2px;
    text-align: center;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"]:checked + label span,
  .product-details-description .product-attributes-1 ul li input[type="radio"]:checked + label span {
    background-color: #ffb300;
    border-color: #ffb300;
  }
  
  .product-details-description .product-attributes-1 ul li input[type="checkbox"]:checked + label span::before,
  .product-details-description .product-attributes-1 ul li input[type="radio"]:checked + label span::before {
    opacity: 1;
    visibility: visible;
  }
  /* ====================== Product Size ============================== */
  
  .product-details-description p {
    line-height: 1.5;
    color: #6c788c;
    margin-bottom: 0;
    margin-top: 25px;
    font-size: 16px;
    font-weight: 400;
  }
  
  .product-details-description .product-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .product-details-description .product-meta > * {
    margin-right: 10px;
  }
  
  .product-details-description .product-quantity {
    position: relative;
    border-radius: 5px;
    border: 1px solid #dbdbdb;
  }
  
  .product-details-description .product-quantity button {
    background: none;
    color: #494949;
    height: 40px;
    border: 0;
    font-weight: 300;
    font-size: 24px;
  }
  
  .product-details-description .product-quantity input {
    width: 60px;
    height: 40px;
    border: 0;
    padding: 0 5px;
    background: none;
    font-size: 18px;
    font-weight: 300;
    outline: none;
    color: #494949;
    text-align: center;
    border-right: 1px solid #dbdbdb;
    border-left: 1px solid #dbdbdb;
  }
  
  .product-details-description .product-quantity > *:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding-left: 16px;
  }
  
  .product-details-description .product-quantity > *:last-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding-right: 16px;
    padding-left: 16px;
  }
  
  .product-details-description .meta-action .btn {
    padding: 16px 20px;
    font-weight: 400;
    font-size: 16px;
    margin-top: 10px;
  }
  
  .btn-danger {.product-details-description .meta-action .action
    background-color: #e00700;
    border-color: #e00700;
  }
  .product-details-description .meta-action .action {
    font-size: 28px;
    color: #dc3545;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-description .meta-action .action:hover {
    color: #f2a100;
  }
  
  .product-details-description .product-info {
    padding-top: 10px;
  }
  
  .product-details-description .product-info .single-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin-top: 8px;
  }
  .product-details-description .product-info .single-info .value a{
    color: #666;
    padding: 4px 15px;
    background: #FFFFFF;
    border: 1px solid #E9E9E9;
    border-radius: 24px;
    font-weight: 300;
  }
  .product-details-description .product-info .single-info .value a:hover{
    color: ;
    background: #eee;
  }
  .product-details-description .social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 10px;
  }
  
  .product-details-description .social li {
    margin-right: 25px;
  }
  
  .product-details-description .social li a {
    font-size: 16px;
    color: #9f9e9e;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    padding: 10px 10px;
    background-color: #e9ecef;
    border-radius: 50%;
  }
  
  .product-details-description .social li a:hover {
    color: #f2a100;
    background-color: #dee2e6;
  }
  .fav-product {
    display: flex;
  }
  .fav-product::before {
      content: '|';
      color: #dbdbdb;
      margin-right: 10px;
      font-size: 28px;
      font-weight: 100;
  }
  .fav-product span{
    font-size: 18px;
    padding-left: 6px;
  }
  .product-details-description .product-table {
    margin-top: 40px;
  }
  
  .product-details-description .product-table .table {
    margin-bottom: 0;
  }
  
  .product-details-description .product-table .table tbody tr td {
    border: 1px solid #e1e1e1;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    color: #6d707f;
    width: 33.33%;
  }
  
  .product-details-description .product-table .table tbody tr td .product-quantity {
    margin-top: 0;
  }
  
  .product-details-description .product-table .table tbody tr td .amount {
    font-weight: 500;
    color: #f2a100;
  }
  
  .product-details-tabs .nav {
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 8px;
  }
  
  .product-details-tabs .nav li {
    margin: 0 5px;
  }
  
  .product-details-tabs .nav li button {
    color: #cccccc;
    font-size: 24px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    border: 0;
    background: none;
    padding: 0 10px;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-tabs .nav li button::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 2px;
    background-color: #f2a100;
    bottom: -9px;
    left: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .product-details-tabs .nav li button.active {
    color: #f2a100;
  }
  
  .product-details-tabs .nav li button.active::before {
    opacity: 1;
    visibility: visible;
  }
  
  .product-details-tabs .tab-content {
    max-width: 1000px;
    margin: 0 auto;
  }
  .product-details-tabs .expand-button{
    position: relative;
    bottom: 0;
    left: 0;
    background: #fff;
    font-size: 13px;
    line-height: 14px;
    padding: 12px 0 18px;
    text-align: center;
    width: 100%;
    margin: 0!important;
  }
  
  /* ================== Swipe Tabs ===================== */
  .slick-initialized .slick-slide {
    display: flex!important;
  }
  .slick-initialized .swipe-tab-content {
    position: relative;
    margin: 5px 0px;
  }
  @media screen and (min-width: 767px) {
    .slick-initialized .swipe-tab-content {
  
    }
  }
  .slick-initialized .swipe-tab {
    display: flex;
    justify-content: center;
    height: 50px;
    background: none;
    border: 0;
    cursor: pointer;
    text-align: center;
    border-bottom: 2px solid transparent;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    color: #222;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    width: 127px!important;
  }
  .slick-initialized .swipe-tab:hover {
    color: #000;
  }
  .slick-initialized .swipe-tab.active-tab {
    border-bottom-color: #E00700!important;
    color: #E00700!important;
    font-weight: bold!important;
  }
  
  .main-container {
    padding: 5px;
  }
  /* ================== Swipe Tabs ===================== */
  .height-limit{
    height: 600px;
    overflow: hidden;
  }
  .height-limit-none{
    height: auto;
  }
  .information-content {
    padding-top: 35px;
  }
  .height-limit:after {
      content: "";
      height: 100px;
      position: absolute;
      bottom: 66px;
      width: 100%;
      left: 0;
      background: linear-gradient(-180deg,hsla(0,0%,100%,0) 6%,#fff 83%);
  }
  .information-content img {
    padding: 0.25rem;
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    max-width: 100%;
    height: auto;
  }
  
  .information-content .title {
    font-size: 20px;
    font-weight: 600;
    color: #000;
  }
  
  .information-content ul {
    list-style: disc;
    list-style-position: inside;
    margin-bottom: 1rem;
  }
  
  .information-content ul li {
    font-size: 15px;
    line-height: 1.8;
  }
  
  .information-content > *:last-child {
    margin-bottom: 0;
  }
  
  .description-content {
    text-align: center;
    margin-top: 35px;
  }
  
  .reviews-content {
    padding-top: 0px;
  }
  
  .reviews-content .reviews-title {
    font-weight: 700;
    font-size: 24px;
    color: #000;
  }
  
  .single-reviews {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 20px;
    background-color: #fff;
    padding: 15px 15px;
    border-radius: 15px;
  }
  .display-7 {
    font-size: 1.2rem;
  } 
  
  .comment-author {
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 50px;
  }
  .single-reviews .comment-author img {
    
  }
  
  .single-reviews .comment-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding-left: 30px;
  }
  
  .author-name-rating .name {
  
  }
  .author-name-rating .label {
    margin-left: 6px;
    font-size: 16px;
    color: #2E926E;
    font-family: 'Noto Sans Thai', sans-serif;
  }
  .single-reviews .comment-content .author-name-rating {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .single-reviews .comment-content .author-name-rating .name {
    font-weight: 600;
    text-transform: capitalize;
    font-size: 18px;
    color: #333333;
    margin-bottom: 0;
    line-height: 1;
    margin-right: 20px;
  }
  
  .single-reviews .comment-content .author-name-rating .review-star {
    position: relative;
    display: inline-block;
  }
  
  .single-reviews .comment-content .review-star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 16px;
    letter-spacing: 2px;
  }
  
  .single-reviews .comment-content .review-star .star {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  
  .single-reviews .comment-content .review-star .star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 16px;
    letter-spacing: 2px;
  }
  
  .single-reviews .comment-content .date {
    color: #adadad;
    font-size: 16px;
    margin-top: 5px;
    border-left: solid;
    border-color: #eee;
    padding-left: 15px;
  }
  
  .single-reviews .comment-content p {
    margin-top: 6px;
    line-height: 1.3;
  }
  
  .reviews-form {
    margin-top: 85px;
  }
  
  .reviews-form .review-rating {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 35px;
  }
  
  .reviews-form .review-rating .title {
    font-weight: 600;
    font-size: 16px;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #494949;
    margin-bottom: 0;
    display: inline-block;
    white-space: nowrap;
    margin-right: 10px;
  }
  
  .reviews-form .review-rating ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
  }
  
  .reviews-form .review-rating ul li {
    margin: 0 2px;
    font-size: 16px;
    cursor: pointer;
  }
  
  .reviews-form .review-rating ul li i {
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    color: #ffc600;
  }
  
  .reviews-form .review-rating ul li i.hover::before {
    content: "\f005" !important;
  }
  
  .reviews-form .form-title {
    font-size: 24px;
    font-weight: 400;
    color: #494949;
  }
  
  .reviews-form .form-check {
    margin-top: 30px;
  }
  
  .reviews-form .form-check .form-check-input {
    margin-top: 3px;
  }
  
  /*--
  /*  4.17 - Cart CSS
  /*----------------------------------------*/
  
  
  .cart-btn {
    border: 1px solid #ebebeb;
    padding: 10px 20px 20px;
    border-top: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .cart-btn .btn {
    margin-top: 10px;
    margin-right: 15px;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    font-weight: 400;
    font-size: 14px;
  }
  
  .cart-btn .btn:last-child {
    margin-right: 0;
  }
  
  .cart-adddress {
    margin-top: 20px;
  }
  
  .cart-shipping {
    margin-top: 20px;
    background-color: #fff;
    padding: 20px 20px;
    border-radius: 4px;
  }
  
  .cart-totals {
    background-color: #fff;
    padding: 16px;
    border-radius: 4px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: #FFF;
  }
  
  .cart-form .coupon {
    display: flex;
    justify-content: space-between;
    gap: 16px;
  }
  
  .cart-total-list {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin: 8px 0px;
  }
  .cart-total-list .list-l {
    color: var(--dark-dark-10, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .cart-total-list .list-r {
  color: #222;
  text-align: right;
  }
  .cart-total .list-r {
  color: #222;
  text-align: right;
  font-family: var(--font-noto);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  }
  
  .btn-chk-coupon {
    font-size: 24px;
    color: #0CC175;
    display: flex;
    align-items: center;
    position: absolute;
    z-index: 9;
    height: 100%;
    top: 0;
    right: 10px;
    padding: 0 0px;
    cursor: pointer;
    -webkit-transition: background .4s;
    -o-transition: background .4s;
    -moz-transition: background .4s;
    transition: background .4s;
  }
  .chk-coupon {
    font-family: var(--font-noto);
    font-size: 24px;
    text-transform: uppercase;
    color: #222;
  }
  
  .cart-title .title {
    color: #222;
    font-family: var(--font-noto);
    font-size: 16px;
    font-weight: 700;
    text-transform: none;
    margin-bottom: 15px;
  }
  .cart-title .title-2 {
    color: #666;
    font-family: var(--font-noto);
    font-size: 14px;
    font-weight: 700;
    text-transform: none;
    margin-bottom: 15px;
  }
  
  
  .cart-totals .cart-total-table {
    background-color: #eaeaea;
    padding: 10px 25px;
  }
  
  .cart-totals .cart-total-table .table {
    margin-bottom: 0;
  }
  
  .cart-totals .cart-total-table .table tbody tr td {
    padding: 5px 0;
    border-top: 0;
  }
  
  .cart-totals .cart-total-table .table tbody tr:last-child td {
    border-bottom: 1px;
  }
  
  .cart-totals .cart-total-table .shipping-list {
    padding: 0;
    margin: 0;
    list-style: none;
  }
  
  .cart-totals .cart-total-table .value {
    font-size: 14px;
    font: 400px;
    color: #000;
    text-transform: capitalize;
  }
  
  .cart-totals .cart-total-table .price {
    font-size: 14px;
    font: 400px;
    color: #000;
  }
  
  .cart-totals .cart-total-btn {
    margin-top: 25px;
  }
  
  .cart-total-btn .btn .active {
    background-color: #E00700!important;
  }
  
  .cart-totals .cart-total-btn .btn {
    height: 48px;
    line-height: 48px;
    padding: 0 30px;
    font-weight: 400;
    font-size: 20px;
    letter-spacing: 0px;
    background-color: #E00700;
  }
  
  
  .empty-cart .empty-cart-title {
    color: #494949;
    font-size: 35px;
  }
  
  .empty-cart .empty-cart-img {
    width: 110px;
    margin: 0 auto;
    padding-top: 25px;
  }
  
  .empty-cart p {
    font-size: 16px;
    text-transform: capitalize;
    margin-top: 30px;
    color: #494949;
  }
  
  .empty-cart .btn {
    height: 50px;
    line-height: 50px;
    padding: 0 30px;
    font-weight: 500;
  }
  
  .table-action thead{
    padding: 12px 16px;
    gap: 16px;
    border-radius: 4px;
    background: rgba(241, 241, 241, 0.50);
  }
  .table-action thead tr th{
  }
  .table-action, thead, tr, th{
    
  }
  
  .data-col-2 .text-start{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  
  /*--
  /*  4.18 - Compare CSS
  /*----------------------------------------*/
  .compare-wrapper .table {
    margin-bottom: 0;
  }
  
  .compare-wrapper .table.table-striped > tbody > tr:nth-of-type(2n+1) {
    --bs-table-accent-bg: none;
    color: #333333;
  }
  
  .compare-wrapper .table.table-striped > tbody > tr:nth-of-type(2n+2) {
    background-color: #eeeeee;
  }
  
  .compare-wrapper .table tbody tr th,
  .compare-wrapper .table tbody tr td {
    -webkit-box-flex: 0;
    color: #333333;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    border: 0;
    padding: 15px;
    min-width: 270px;
  }
  
  .compare-wrapper .table tbody tr th {
    white-space: nowrap;
  }
  
  .compare-wrapper .table tbody tr td {
    font-weight: 500;
    font-size: 14px;
  }
  
  .compare-product {
    position: relative;
    display: inline-block;
    padding-top: 2.0rem;
    margin-bottom: 30px;
  }
  
  .compare-product .pack-product-container .thumb-mask {
    margin-bottom: 20px;
  }
  
  .compare-product .pack-product-container .thumb-mask a {
    display: block;
  }
  
  .compare-product .pack-product-container .desc-box .product-name {
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: 500;
    display: block;
  }
  
  .compare-product .pack-product-container .desc-box .product-reviews {
    margin-bottom: 10px;
  }
  
  .compare-product .pack-product-container .desc-box .product-reviews .review-star {
    position: relative;
    display: inline-block;
  }
  
  .compare-product .pack-product-container .desc-box .product-reviews .review-star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #dbdbdb;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
  }
  
  .compare-product .pack-product-container .desc-box .product-reviews .review-star .star {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    overflow: hidden;
  }
  
  .compare-product .pack-product-container .desc-box .product-reviews .review-star .star::before {
    content: "\f005" "\f005" "\f005" "\f005" "\f005";
    font-family: FontAwesome;
    display: inline-block;
    color: #ffc600;
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    font-size: 14px;
  }
  
  .compare-product .pack-product-container .desc-box .product-prices {
    margin-top: 15px;
  }
  
  .compare-product .pack-product-container .desc-box .product-prices .old-price {
    font-size: 16px;
    color: #666666;
    font-weight: 400;
    text-decoration: line-through;
    margin-right: 5px;
  }
  
  .compare-product .pack-product-container .desc-box .product-prices .sale-price {
    color: #f2a100;
    font-size: 18px;
    font-weight: 400;
    display: inline-block;
    margin-right: 13px;
  }
  
  .compare-product .pack-product-container .desc-box .product-cart {
    padding-top: 15px;
  }
  
  .compare-product .pack-product-container .desc-box .product-cart .btn {
    height: 45px;
    line-height: 45px;
    padding: 0 40px;
    font-weight: 500;
  }
  
  .compare-product .compare-remove {
    padding-right: 20px;
    font-size: 14px;
    font-weight: 500;
    position: absolute;
    top: 0;
    right: 0;
    color: #555555;
  }
  
  .compare-product .compare-remove::after, .compare-product .compare-remove::before {
    content: " ";
    position: absolute;
    right: 0;
    top: 50%;
    width: 15px;
    height: 2px;
    display: inline-block;
    -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
            transform: rotate(0);
    background-color: currentColor;
    -webkit-transition: background-color .2s ease-in-out,transform .2s ease-in-out,width .2s ease-in-out;
    -webkit-transition: background-color .2s ease-in-out,width .2s ease-in-out,-webkit-transform .2s ease-in-out;
    transition: background-color .2s ease-in-out,width .2s ease-in-out,-webkit-transform .2s ease-in-out;
    -o-transition: background-color .2s ease-in-out,transform .2s ease-in-out,width .2s ease-in-out;
    transition: background-color .2s ease-in-out,transform .2s ease-in-out,width .2s ease-in-out;
    transition: background-color .2s ease-in-out,transform .2s ease-in-out,width .2s ease-in-out,-webkit-transform .2s ease-in-out;
  }
  
  .compare-product .compare-remove:hover {
    color: #f2a100;
  }
  
  .compare-product .compare-remove:hover::before {
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    background-color: #f2a100;
  }
  
  .compare-product .compare-remove:hover::after {
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    background-color: #f2a100;
  }
  
  /*--
  /*  4.19 - Checkout CSS
  /*----------------------------------------*/
  .checkout-info {
    margin-top: 30px;
  }
  
  .checkout-info .info-header {
    padding: 14px 30px;
    margin: 0;
    position: relative;
    background-color: #eeeff2;
    list-style: none outside !important;
    width: auto;
    word-wrap: break-word;
    color: #000;
    font-size: 14px;
  }
  
  .checkout-info .info-header strong {
    font-weight: 700;
    color: #000;
  }
  
  .checkout-info .info-header i {
    font-size: 12px;
    color: #6dde6d;
    margin-right: 10px;
  }
  
  .checkout-info .info-header a {
    color: #000;
  }
  
  .checkout-info .info-header a:hover {
    color: #f2a100;
  }
  
  .checkout-info .info-header.error i {
    color: #c43002;
  }
  
  .checkout-info .card-body {
    padding: 0;
    padding-top: 20px;
  }
  
  .checkout-info .card-body p {
    font-size: 14px;
    color: #6d707f;
    margin-bottom: 0;
  }
  
  .checkout-info .card-body .single-form {
    margin-top: 15px;
  }
  
  .checkout-info .card-body .single-form .form-checkbox {
    margin-left: 20px;
  }
  
  .checkout-info .card-body .forget {
    margin-top: 15px;
  }
  
  .checkout-info .card-body .forget a {
    color: #6d707f;
    font-size: 15px;
  }
  
  .checkout-info .card-body .forget a:hover {
    color: #f2a100;
  }
  
  .checkout-title .title {
    font-size: 24px;
    color: #131313;
    position: relative;
  }
  
  .checkout-title .title::after {
    content: "";
    width: 50px;
    display: block;
    margin-top: 10px;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-color: inherit;
  }
  
  .checkout-form {
    margin-top: 48px;
  }
  
  .checkout-account {
    display: none;
  }
  
  .checkout-shipping {
    display: none;
  }
  
  .checkout-note textarea {
    border: 0;
    background-color: #f7f7f7;
    height: 150px;
  }
  
  .checkout-order {
    border: 2px solid #e1e1e1;
    padding: 40px;
    margin-top: 50px;
  }
  
  .checkout-order ul {
    padding: 0;
    margin: 0;
    list-style: none;
  }
  
  .checkout-order .table {
    margin-bottom: 0;
  }
  
  .checkout-order .table thead tr th {
    padding: 10px 0;
    border-top: 0;
    border-bottom: 1px solid #e1e1e1;
    font-weight: 400;
    font-size: 14px;
    color: #000;
    vertical-align: middle;
  }
  
  .checkout-order .table thead tr th.Product-price {
    text-align: right;
  }
  
  .checkout-order .table tbody tr td {
    padding: 5px 0;
    border-top: 0;
    vertical-align: middle;
  }
  
  .checkout-order .table tbody tr td p {
    font-weight: 400;
    font-size: 14px;
    color: #000;
  }
  
  .checkout-order .table tbody tr td.Product-price {
    text-align: right;
  }
  
  .checkout-order .table tbody tr:first-child td {
    padding-top: 20px;
  }
  
  .checkout-order .table tbody tr:last-child td {
    padding-bottom: 20px;
  }
  
  .checkout-order .table tfoot tr td {
    padding: 10px 0;
    vertical-align: middle;
  }
  
  .checkout-order .table tfoot tr td p {
    font-weight: 400;
    font-size: 14px;
    color: #000;
  }
  
  .checkout-order .table tfoot tr td.Product-price {
    text-align: right;
  }
  
  .checkout-order .table tfoot tr td.total-price {
    text-align: right;
  }
  
  .checkout-order .table tfoot tr td.total-price p {
    font-size: 18px;
  }
  
  .checkout-order .table tfoot tr td .radio label {
    white-space: nowrap;
    color: #252c51;
  }
  
  .checkout-payment {
    margin-top: 30px;
  }
  
  .checkout-payment ul li {
    margin-bottom: 3px;
  }
  
  .checkout-payment ul li :last-child {
    margin-bottom: 0;
  }
  
  .checkout-payment .single-payment .payment-radio [type="radio"] {
    position: relative;
    top: 2px;
    margin-right: 4px;
  }
  
  .checkout-payment .single-payment .payment-radio label {
    color: #252c51;
  }
  
  .checkout-payment .single-payment .payment-radio label .payment {
    width: 100px;
    padding: 0 2px;
  }
  
  .checkout-payment .single-payment .payment-radio label a {
    color: #000;
    text-decoration: underline;
    text-transform: capitalize;
  }
  
  .checkout-payment .single-payment .payment-radio .payment-details {
    display: none;
    padding: 10px 0;
  }
  
  .checkout-payment .single-payment .payment-radio .payment-details p {
    font-size: 14px;
  }
  
  .checkout-payment .checkout-btn {
    margin-top: 20px;
  }
  
  /*--
  /*  4.20 - My Account CSS
  /*----------------------------------------*/
  .btn-language {
    
  }
  .btn-small {
    padding: 0.2rem 0.5rem;
    font-size: 0.8rem;
    border-radius: 0.2rem;
    line-height: 1.2rem;
  }
  .btn-outline-primary.active {
    color: #e00700!important;
    background-color: #fff!important;
    border-color: #fff!important;
  }
  .author-member {
  
  }
  .author-member img{
    -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
      border-radius: 50px;
      height: 25px;
      width: 25px;
  }
  
  .accordion-button:not(.collapsed){
      background-color: transparent;
  }
  .my-account .accordion-button {
      padding: 12px 12px;
      gap: 10px;
      font-weight: 700!important;
      font-size: 16px!important;
  }
  .my-account .sidebar .sidebar-widget .profile .avatar{
      display: flex;
      width: 40px;
      height: 40px;
      justify-content: center;
      align-items: center;
      flex-shrink: 0;
  }
  .my-account .sidebar .sidebar-widget .profile .avatar img{
      border-radius: 40px;
  }
  .my-account .sidebar .sidebar-widget .profile .name span{
      color: var(--character-primary, #222);
      font-family: var(--font-noto);
      font-size: 16px;
      font-style: normal;
      font-weight: 700;
      line-height: 18px;
  }
  .my-account .sidebar .sidebar-widget .profile{
      display: flex;
      padding: 10px;
      align-items: center;
      gap: 10px;
      border-radius: 8px;
      background: #FFF;
      margin-bottom: 8px;
  }
  .my-account .accordion .accordion-item{
      border: unset!important;
      border-radius: 8px;
  }
  .my-account .accordion .accordion-item .accordion-button:not(.collapsed){
      color: var(--character-primary, #222);
      box-shadow: unset;
      background-color: transparent;
      font-size: 16px!important;
      font-weight: 700!important;
  }
  .my-account .accordion-item h2{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700!important;
    line-height: 24px;
  }
  .accordion-item .accordion-button{
      border-radius: 8px;
  }
  .my-account .accordion-button-2{
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    color: var(--bs-accordion-btn-color);
    text-align: left;
    background-color: var(--bs-accordion-btn-bg);
    border: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
    padding: 12px 12px;
    gap: 10px;
    font-weight: 700!important;
    font-size: 16px!important;
    border-radius: 8px;
    cursor: pointer;
  }
  .my-account .accordion-button-2:active, .my-account .accordion-button-2:focus{
    color: var(--primary-primary-30, #E00700)!important;
  }
  .my-account .accordion-button:not(.collapsed)::after{
        background-image: url(../images/account/chevron-up.svg);
  }
  .my-account .accordion-button::after{
    background-image: url(../images/account/chevron-up.svg);
  }
  .my-account .accordion-button:focus{
    border-color: unset;
    box-shadow: unset;
  }
  .my-account .accordion-item .li-item{
    display: flex;
    padding: 8px 0px 8px 30px;
    align-items: flex-start;
    gap: 10px;
    background-color: #fff;
  }
  .my-account .accordion-item .li-item:hover{
    border-radius: 4px;
    background: var(--primary-primary-10, rgba(224, 7, 0, 0.10));
  }
  
  .my-account .accordion-item .li-item a{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .li-item a:active, a:focus{
    color: var(--primary-primary-30, #E00700)!important;
    font-weight: 700!important;
  }
  .my-account .accordion-item .accordion-body{
    padding: 0px 16px 6px 16px;
  }
  .my-account-detail .avatar .img-avatar{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 16px;
  }
  .my-account-detail .avatar .desc{
    color: var(--character-disable, #999);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
  }
  .my-account-detail .avatar .img-avatar .img{
    position: relative;
  }
  .my-account-detail .avatar .img-avatar .img img{
    border-radius: 100px;
  }
  .my-account-detail .avatar .img-avatar .edit{
    position: absolute;
    right: 0px;
    bottom: 0px;
    display: flex;
    padding: 6px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    border: 1px solid var(--light-light-20, #F1F1F1);
    background: var(--light-light-10, #FFF);      
  }
  .my-account-detail .avatar .img-avatar .edit img{
    
  }
  .my-account-detail .account-form{
    display: flex;
    padding: 0px 150px;
    align-items: flex-start;
    align-self: stretch;
  }
  .account-form .name .form-label{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
  }
  .account-form .name{
    margin-bottom: 10px;
    margin-top: 10px;
  }
  .name .form-control:disabled{
    color: var(--dark-dark-10, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    opacity: 0.5;
  }
  
  .name .form-control::placeholder{
    color: var(--character-disable, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
  }
  .name .tel2{
    display: flex;
    gap: 32px;
  }
  .name .tel2 a{
    color: var(--character-link, #0C5CD4);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration-line: underline!important;
  }
  .name .delete-bin{
    color: var(--character-secondary, #666);
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .ic-verified-check{
    color: var(--character-success, #0CC175);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  .account-form .text-align-end{
    text-align: right;
  }
  .name .ref{
    color: var(--dark-dark-20, #666);
    font-family: var(--font-noto);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    padding-left: 10px;
  }
  .ic-security{
    width: 80px;
    height: 80px;
    display: flex;
    padding: 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 56px;
    border: 2px solid var(--system-green-20, #0CC175);
  }
  .account-form .btn-next{
    display: flex;
    gap: 10px;
    align-items: center;
    color: #666;
    border-color: #999!important;
    fill: #666;
  }
  .account-form .btn-next:hover{
      fill: #fff;
      border-color: #dc3545!important;
  }
  .svg-evenodd{
  }
  .svg-evenodd svg{
      width: 25px;
      height: 24px;
  }
  .account-address{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .account-address .btn-address{
    display: flex;
    gap: 8px;
  }
  .account-address .btn-address a{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 8px 16px;
    border-bottom: 2px solid #fff;
  }
  .account-address .btn-address a:hover, .account-address .btn-address a:active, .account-address .btn-address a:focus{
    color: var(--primary-primary-30, #E00700);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400!important;
    line-height: 24px;
    border-bottom: 2px solid #E00700;
  }
  .account-address .btn-add-locate{
    margin: 0px 0px;
  }
  .my-account-detail .cart-address{
    all: unset;
  }
  .cart-address .btn-add-locate .btn-outline-secondary{
    color: var(--dark-dark-20, #666)!important;
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    border-radius: 16px;
    border: 1px solid var(--dark-dark-20, #666)!important;
    background: var(--light-light-10, #FFF);
  }
  .cart-address .c-btn-r span{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }
  
  
  
  
  .my-account-menu .account-menu-list {
    background-color: #f7f7f7;
  }
  
  .my-account-menu .account-menu-list li a {
    width: 100%;
    padding: 10px 30px;
    font-size: 14px;
    color: #6d707f;
    margin-top: -1px;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    display: block;
    text-decoration: none;
  }
  
  .my-account-menu .account-menu-list li a i {
    margin-right: 5px;
  }
  
  .my-account-menu .account-menu-list li a:hover, .my-account-menu .account-menu-list li a.active {
    background-color: #f2a100;
    color: #fff;
  }
  
  .my-account-tab .account-title {
    font-size: 24px;
    font-weight: 500;
    color: #000;
  }
  
  .account-table .table thead tr th {
    border: 1px solid #ECECEC;
    border-bottom-color: #ECECEC !important;
    font-size: 14px;
    font-weight: 400;
    color: #000;
    padding: 8px 15px;
  }
  
  .account-table .table thead tr th.name {
    min-width: 140px;
  }
  
  .account-table .table thead tr th.date {
    min-width: 130px;
  }
  
  .account-table .table tbody tr td {
    font-size: 14px;
    color: #000;
    font-weight: 400;
    vertical-align: middle;
    border: 1px solid #ECECEC;
    padding: 0;
  }
  
  .account-table .table tbody tr td a {
    padding: 0 15px;
    height: 45px;
    line-height: 45px;
    color: #000;
  }
  
  .my-account-dashboard .welcome-dashboard {
    margin-top: 10px;
  }
  
  .my-account-dashboard .welcome-dashboard p {
    font-size: 14px;
  }
  
  .my-account-dashboard .welcome-dashboard p strong {
    font-weight: 500;
  }
  
  .my-account-dashboard .welcome-dashboard p a {
    color: #000;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
  }
  
  @media (prefers-reduced-motion: reduce) {
    .my-account-dashboard .welcome-dashboard p a {
      -webkit-transition: none;
      -o-transition: none;
      transition: none;
    }
  }
  
  .my-account-dashboard .welcome-dashboard p a:hover {
    color: #f2a100;
  }
  
  .my-account-payment p {
    font-weight: 500;
    font-size: 14px;
  }
  
  .my-account-address .account-address .name {
    font-size: 16px;
    color: #000;
    font-weight: 500;
  }
  
  .my-account-address .account-address p {
    margin-top: 20px;
    font-size: 14px;
  }
  
  .my-account-address .account-address .btn {
    margin-top: 20px;
    height: 45px;
    line-height: 45px;
  }
  
  .my-account-details .account-details {
    margin-top: -15px;
  }
  
  .my-account-details .account-details .title {
    font-size: 20px;
    font-weight: 500;
    color: #000;
  }
  
  /*--
  /*  4.21 - Login & Register CSS
  /*----------------------------------------*/
  .login-register-wrapper .title {
    font-size: 24px;
    font-weight: 600;
    color: #494949;
  }
  
  .login-register-wrapper .form-check {
    margin-bottom: 0;
    min-height: inherit;
    margin-top: 30px;
  }
  
  .login-register-wrapper .form-check .form-check-input {
    margin-top: 4px;
  }
  
  .login-register-wrapper .single-form .btn {
    width: 160px;
  }
  
  .login-register-wrapper p {
    margin-bottom: 0;
    margin-top: 15px;
  }
  
  .login-register-wrapper p a {
    text-decoration: none;
  }
  
  #pills-login {
    width: 420px;
    margin: 20px auto;
  }
  
  .btn-show-pass{
    font-size: 15px;
      color: #aaa;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      align-items: center;
      position: absolute;
      z-index: 9;
      height: 100%;
      top: 0;
      right: 10px;
      padding: 0 5px;
      cursor: pointer;
      -webkit-transition: background .4s;
      -o-transition: background .4s;
      -moz-transition: background .4s;
      transition: background .4s;
  }
  .btn-show-pass:hover{
    color: #111;
  }
  .btn-register {
    background-color: #E00700!important;
    color: #FFF!important;
    display: block!important;
    padding-left: 3.5rem!important;
    padding-right: 3.5rem!important;
  }
  .suggestion-alert {
    color: #ff0000;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 18px;
  }
  
  #pills-login form {
    font-family: var(--font-noto);
  }
  #pills-login form .line-or p{
    position: relative;
    font-family: var(--font-noto);
    color: #666;
  }
  .line-or p::before {
    position: absolute;
    background: #F1F1F1;
    content: "";
    width: 120px;
    height: 1px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  .line-or p::after {
    position: absolute;
    background: #F1F1F1;
    content: "";
    width: 120px;
    height: 1px;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  .btn-social {
    text-transform: inherit;
  
  }
  
  .hover-up:hover,
  .hover-up:focus {
    box-shadow: 0 0.5em 0.5em -0.4em #666;
    transform: translateY(-0.25em);
    transition: all 100ms linear;
  }
  
  
  .btn-social .facebook {
    background-color: #0C5CD4!important;
    color: #fff!important;
    text-transform: inherit;
    width: 152px;
    margin-right: 8px!important;
    margin-left: 8px!important;
  }
  .btn-social .google {
    background-color: #e9e9e9!important;
    color: #666!important;
    text-transform: inherit;
    width: 150px;
    margin-right: 8px!important;
    margin-left: 8px!important;
  }
  .btn-social .line {
    background-color: #06C755!important;
    color: #fff!important;
    text-transform: inherit;
    width: 150px;
    margin-right: 8px!important;
    margin-left: 8px!important;
  }
  .fa-facebook-official {
    margin-right: 8px;
  }
  .modal-register {
  
  }
  .modal-register .modal-footer{
    border-top: unset;
    padding: 10px 16px;
  }
  .modal-register .modal-header{
    border-bottom: unset;
    padding: 10px 16px;
  }
  
  .modal-cart {
    max-width: 415px!important;
  }
  .modal-cart .modal-content{
    padding: 24px;
  }
  .modal-cart .modal-content .modal-footer{
    border-top: unset;
    justify-content: center;
  }
  .modal-cart .modal-content .modal-footer .btn-prev,
  .modal-cart .modal-content .modal-footer .btn-next{
    width: 120px;
    height: 40px;
    min-width: 120px;
    margin-left: 8px;
    margin-right: 8px;
  }
  .modal-cart .modal-content .modal-footer {
    
  }
  
  .modal-cart .modal-content .header{
   text-align: center;
  }
  #cart-add-address-modal .modal-cart .modal-content .header .modal-title{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    text-align: left;
  }
  #cart-add-address-modal .modal-cart .modal-content{
    padding: 0px;
  }
  #cart-add-address-modal .modal-cart .modal-content .header{
    padding: 16px;
  }
  #cart-add-address-modal .modal-cart .modal-content .modal-body{
    padding: 16px!important;
    text-align: left;
  }
  #cart-add-address-modal .modal-cart .modal-content .modal-body .name .form-label{
   
    
  }
  #cart-add-address-modal .modal-cart, #cart-chg-add-modal .modal-cart{
    max-width: 640px!important;
  }
  
  #cart-chg-add-modal .modal-cart .modal-content .header .modal-title{
    text-align: left;
  }
  #cart-chg-add-modal .modal-cart .modal-content .modal-body{
    text-align: left;
  }
  #cart-chg-add-modal .modal-cart .modal-content .modal-footer{
    margin-top: 28px;
    justify-content: flex-end;
  }
  .modal-form-register {
  
  }
  .modal-form-register .name, .province, .tel, .address, .zip-code{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
  }
  .rules .form-check{
    margin-bottom: 8px;
  }
  .rules .form-check .form-check-input{
    margin-right: 10px;
    width: 20px;
    height: 20px;
    color: #fff;
  }
  
  .modal-form-register .province .form-province select{
    border: none;
    width: 100%;
    color: #999;
  }
  .modal-form-register .province .form-province::placeholder{
    color: var(--character-disable, #999);
  }
  .modal-form-register .province .form-province select:focus-visible {
      outline: -webkit-focus-ring-color auto 0px;
  }
  .modal-form-register .province .form-province{
    display: flex;
    padding: 8px 12px;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: var(--light-light-10, #FFF);
  }
  
  .modal-form-register .name .form-control::placeholder {
    color: var(--character-disable, #999);
    font-size: 16px;
  }
  .modal-form-register .tel .form-control::placeholder{
    color: var(--character-disable, #999);
    font-size: 16px;
  }
  .modal-form-register .address .form-control::placeholder{
    color: var(--character-disable, #999);
    font-size: 16px;
  }
  .modal-form-register .province .form-control::placeholder{
    color: var(--character-disable, #999);
    font-size: 16px;
  }
  .modal-form-register .zip-code .form-control::placeholder{
    color: var(--character-disable, #999);
    font-size: 16px;
  } 
  
  
  
  .modal-cart .modal-content .header .modal-title{
    color: #222;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }
  .modal-cart .modal-content .modal-body{
    padding: 10px 0px!important;
    text-align: center;
  }
  .modal-cart .modal-content .modal-body span{
    color: #666;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  #cart-add-address-modal .modal-cart .modal-content .modal-footer{
    border-top: var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);
    justify-content: flex-end;
  }
  .ic-warning {
    border-radius: 40px;
    background: rgba(253, 134, 63, 0.20);
    padding: 10px 10px;
  }
  .bg-cart{
    border-radius: 16px;
    background: #FFF;
  }
  
  
  
  
  .modal-cart-mobile {
    width: 100%!important;
    max-width: 100%!important;
    margin: 0px!important;
    position: fixed!important;
    bottom: 0;
  }
  .modal-cart-mobile .modal-content{
    padding: 0px;
    border-top-right-radius: 16px;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
  }
  .modal-cart-mobile .modal-content .modal-footer{
    border-top: unset;
    justify-content: center;
  }
  .modal-cart-mobile .modal-content .modal-footer .btn-prev,
  .modal-cart-mobile .modal-content .modal-footer .btn-next{
    width: 120px;
    height: 40px;
    min-width: 120px;
    margin-left: 8px;
    margin-right: 8px;
  }
  .modal-cart-mobile .modal-content .modal-footer {
    
  }
  
  .modal-cart-mobile .modal-content .header{
   text-align: center;
  }
  .modal-cart-mobile .modal-content .header .modal-title{
    color: #222;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
  }
  .modal-cart-mobile .modal-content .modal-body{
    padding: 10px 0px!important;
    text-align: center;
  }
  .modal-cart-mobile .modal-content .modal-body span{
    color: #666;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  .animate-bottom {
    position: relative;
    animation: animatebottom 0.4s;
  }
  
  @keyframes animatebottom {
    from {
      bottom: -300px;
      opacity: 0;
    }
  
    to {
      bottom: 0;
      opacity: 1;
    }
  }
  
  
  .verify-email {
  
  }
  .verify-email .line-01 {
    color: #222;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 5px;
  }
  .verify-email .line-01 a {
    color: #E00700;
    font-weight: 400;
    text-decoration: underline!important;
  }
  .verify-email .line-02 {
    color: #222;
    text-align: center;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 20px;
  }
  .verify-email .line-03 {
  color: #666;
  text-align: center;
  font-family: var(--font-noto);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  margin-top: 10px;
  }
  .verify-email .line-04 {
  color: #666;
  text-align: center;
  font-family: var(--font-noto);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  margin-top: 10px;
  }
  .verify-email .ref-code {
    display: flex;
    justify-content: center;
    gap: 12px;
  }
  .verify-email .ref-code .form-control {
    font-family: var(--font-noto);
    font-size: 24px;
    text-align: center;
    text-transform: uppercase;
  }
  .verify-email .icon img {
    width: 22%;
    max-width: 100px;
  }
  .verify-email .form-control {
  }
  .btn-prev {
  
  }
  .btn-next {
  
  }
  .btn-next img {
    width: 30px;
    margin-right: 8px;
  }
  .btn-forgot-pass {
    margin-top: 8px;
    display: flex;
    justify-content: flex-end;
  }
  .btn-forgot-pass a {
    color: #666;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration-line: underline!important;
  }
  
  
  /*--
  /*  4.22 - Blog Details CSS
  /*----------------------------------------*/
  .blog-details-wrapper {
    margin-top: 50px;
  }
  
  .blog-details-wrapper img {
    width: 100%;
  }
  
  .blog-details-wrapper .blog-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 47px;
  }
  
  .blog-details-wrapper .blog-meta li {
    font-size: 15px;
    font-weight: 500;
    color: #545454;
    font-family: 'Noto Sans Thai', sans-serif;
    display: inherit;
  }
  
  .blog-details-wrapper .blog-meta li i {
    font-size: 18px;
    color: #000;
    margin-right: 8px;
  }
  
  .blog-details-wrapper .blog-meta li + li {
    margin-left: 20px;
  }
  
  .blog-details-wrapper .title {
    margin-bottom: 0;
    margin-top: 10px;
    display: inline-block;
    color: #383838;
    font-weight: 600;
    font-size: 36px;
    line-height: 1.4;
  }
  
  .blog-details-wrapper p {
    margin-top: 25px;
    margin-bottom: 0;
  }
  
  .blog-details-wrapper .blog-dec-images {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin-left: -15px;
    margin-left: -15px;
    padding-top: 20px;
    padding-bottom: 25px;
  }
  
  .blog-details-wrapper .blog-dec-images .dec-col-1 {
    padding: 0 15px;
    width: 62.4%;
  }
  
  .blog-details-wrapper .blog-dec-images .dec-col-2 {
    padding: 0 15px;
    width: 37.6%;
  }
  
  .blog-details-wrapper .blog-dec-images .single-dec-img {
    margin-top: 30px;
  }
  
  .blog-details-wrapper .blog-dec-images .single-dec-img img {
    width: 100%;
  }
  
  .blog-auhtor-social {
    padding: 0px 20px 7px;
    background-color: #f2f2f2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 50px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  
  .blog-auhtor-social .blog-auhtor {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 7px;
  }
  
  .blog-auhtor-social .blog-auhtor .auhtor-thumb img {
    width: 36px;
    border-radius: 50%;
    border: 1px solid #f2a100;
  }
  
  .blog-auhtor-social .blog-auhtor .auhtor-content {
    padding-left: 15px;
  }
  
  .blog-auhtor-social .blog-auhtor .auhtor-content p {
    color: #777777;
    font-size: 14px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
  }
  
  .blog-auhtor-social .blog-social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 4px;
  }
  
  .blog-auhtor-social .blog-social .social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .blog-auhtor-social .blog-social .social li + li {
    margin-left: 20px;
  }
  
  .blog-auhtor-social .blog-social .social li a {
    font-size: 14px;
    color: #000;
  }
  
  .blog-auhtor-social .blog-social .social li a:hover {
    color: #f2a100;
  }
  
  .blog-auhtor-social .blog-social .share-count {
    font-size: 14px;
    color: #000;
    margin-left: 40px;
  }
  
  .blog-auhtor-social .blog-social .share-count:hover {
    color: #f2a100;
  }
  
  .blog-next-previous-post {
    padding-top: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  
  .blog-next-previous-post .blog-previous-post,
  .blog-next-previous-post .blog-next-post {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 30px;
  }
  
  .blog-next-previous-post .blog-previous-post .post-arrow a,
  .blog-next-previous-post .blog-next-post .post-arrow a {
    width: 85px;
    height: 85px;
    line-height: 85px;
    text-align: center;
    font-size: 30px;
    color: #f2a100;
    display: block;
    background-color: #f6f6f6;
  }
  
  .blog-next-previous-post .blog-previous-post .post-content,
  .blog-next-previous-post .blog-next-post .post-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding: 0 30px;
    max-width: 280px;
  }
  
  .blog-next-previous-post .blog-previous-post .post-content .title,
  .blog-next-previous-post .blog-next-post .post-content .title {
    margin-bottom: 0;
  }
  
  .blog-next-previous-post .blog-previous-post .post-content .title a,
  .blog-next-previous-post .blog-next-post .post-content .title a {
    font-size: 24px;
    font-weight: 700;
    color: #4a4a4a;
  }
  
  .blog-next-previous-post .blog-previous-post .post-content .date,
  .blog-next-previous-post .blog-next-post .post-content .date {
    font-size: 18px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #545454;
    text-transform: uppercase;
    display: block;
    margin-top: 7px;
  }
  
  .blog-next-previous-post .blog-previous-post:hover .post-arrow a,
  .blog-next-previous-post .blog-next-post:hover .post-arrow a {
    color: #fff;
    background-color: #f2a100;
  }
  
  .blog-next-previous-post .blog-previous-post:hover .post-content .title a,
  .blog-next-previous-post .blog-next-post:hover .post-content .title a {
    color: #f2a100;
  }
  
  .blog-next-previous-post .blog-next-post .post-content {
    text-align: right;
  }
  
  .blog-comment-form .comment-title {
    font-size: 24px;
    font-weight: 700;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #000;
    margin-bottom: 0;
  }
  
  .blog-comment .comments-items {
    margin-top: -10px;
  }
  
  .blog-comment .comments-items > li:last-child .single-comment {
    padding-bottom: 0;
  }
  
  .blog-comment .single-comment {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 40px 0;
  }
  
  
  .blog-comment .single-comment .comment-author img {
    
  }
  
  .blog-comment .single-comment .comment-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding-left: 30px;
    position: relative;
  }
  
  .blog-comment .single-comment .comment-content .comment-name-date {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .blog-comment .single-comment .comment-content .comment-name-date .name {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 0;
  }
  
  .blog-comment .single-comment .comment-content .comment-name-date .date {
    font-size: 14px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #666;
    text-transform: uppercase;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: block;
    padding-left: 15px;
    position: relative;
  }
  
  .blog-comment .single-comment .comment-content .comment-name-date .date::before {
    position: absolute;
    content: '-';
    font-size: 18px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    color: #333;
    left: 5px;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .blog-comment .single-comment .comment-content p {
    margin-top: 15px;
    margin-bottom: 0;
  }
  
  .blog-comment .single-comment .comment-content .reply {
    position: absolute;
    top: 0;
    right: 0;
    color: #f2a100;
    font-size: 18px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    display: inline-block;
  }
  
  .blog-comment .comments-reply {
    padding-left: 130px;
  }
  
  .blog-comment .comments-reply .single-comment {
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
  }
  
  /*--
  /*  4.23 - Contact CSS
  /*----------------------------------------*/
  .contact-wrapper {
    background-color: #f5f5f5;
  }
  
  .contact-info {
    background-color: #fff9ed;
    padding: 55px 40px 60px;
    height: 100%;
    position: relative;
  }
  
  .contact-info .title {
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    position: relative;
    color: #383838;
    margin-bottom: 0;
    padding-left: 1rem;
  }
  
  .contact-info .title::before {
    position: absolute;
    content: '';
    width: 4px;
    height: 22px;
    background-color: #f2a100;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .contact-info > p {
    margin-bottom: 0;
    font-weight: 300;
    margin-top: 10px;
  }
  
  .contact-info .social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 25px;
  }
  
  .contact-info .social li + li {
    margin-left: 10px;
  }
  
  .contact-info .social li a {
    display: block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 16px;
    background-color: #ffedc8;
    color: #6c788c;
    border-radius: 50%;
  }
  
  .contact-info .social li a:hover {
    background-color: #f2a100;
    color: #fff;
  }
  
  .contact-info img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }
  
  .contact-info-items {
    padding-top: 15px;
  }
  
  .contact-info-items .single-contact-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    border: 1px solid transparent;
    padding: 8px 20px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .contact-info-items .single-contact-info .info-icon i {
    font-size: 30px;
    color: #f2a100;
  }
  
  .contact-info-items .single-contact-info .info-content {
    padding-left: 15px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
  
  .contact-info-items .single-contact-info .info-content p {
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #6c788c;
    margin-bottom: 0;
  }
  
  .contact-info-items .single-contact-info:hover {
    border-color: #ffedc8;
  }
  
  .contact-form {
    padding: 60px;
    padding-top: 30px;
  }
  
  .contact-form .single-form input:not([type="checkbox"]):not([type="radio"]),
  .contact-form .single-form textarea {
    background-color: transparent;
  }
  
  .contact-form .single-form textarea {
    height: 145px;
  }
  
  .contact-form .single-form .btn {
    height: 60px;
    line-height: 60px;
    padding: 0 50px;
    font-size: 14px;
    font-weight: 500;
  }
  
  .form-message {
    margin-bottom: 0;
  }
  
  .form-message.error, .form-message.success {
    font-size: 16px;
    color: #07294d;
    background: #ddd;
    padding: 10px 15px;
    margin: 15px 0 0 15px;
  }
  
  .form-message.error {
    color: #ff0000;
  }
  
  .contact-map iframe {
    width: 100%;
    height: 490px;
    display: block;
  }
  
  .map-taste .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    color: unset;
    background-color: unset;
  }
  .contact-box{}
  .cb-r .form-control::placeholder{
    color: var(--character-disable, #999);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
  }
  .contact-box .cb-l{
    background-color: var(--bg-red);
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    padding: 24px;
    box-shadow: 0px 8px 12px 0px rgba(50, 50, 62, 0.12);
    height: 100%;
  }
  .contact-box .cb-r{
    background-color: var(--bs-white);
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
    padding: 24px;
    box-shadow: 0px 8px 12px 0px rgba(50, 50, 62, 0.12);
  }
  .cb-l span{
    color: var(--light-light-10, #FFF);
    font-family: var(--font-noto);
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
  }
  .cb-l .ic-mail{
    margin-bottom: 16px;
  }
  .cb-r label{
    color: var(--dark-dark-30, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
  }
  .cb-r .br-name{
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
  }
  .form-topic-contact{
    padding-right: 8px;
  }
  .form-topic-contact select{
      font-family: var(--font-noto);
      font-size: 16px;
      font-style: normal;
      font-weight: 300;
      line-height: 24px;
      width: 100%;
      display: flex;
      padding: 8px 12px;
      align-items: center;
      gap: 16px;
      align-self: stretch;
      border-radius: 8px;
      border: 1px solid var(--light-light-30, #E9E9E9);
      background: var(--light-light-10, #FFF);
  }
  .form-topic-contact select::placeholder{
    color: #ff0000!important;
  }
  
  .cb-r textarea{
    display: flex;
    height: 100px;
    padding: 8px 12px;
    align-items: flex-start;
    gap: 16px;
    border-radius: 8px;
    border: 1px solid var(--light-light-30, #E9E9E9);
    background: var(--light-light-10, #FFF);
  }
  .cb-r textarea::placeholder{
    color: var(--dark-dark-10, #999);
    text-overflow: ellipsis;
    whitespace: nowrap;
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
  }
  
  .help-box{}
  .hb-r{
    padding: 16px 16px 60px 16px;
    border-radius: 8px;
    background: #FFF;
  }
  .hb-r ol li{
    list-style: decimal;
  }
  .hb-l{
    display: flex;
    padding: 8px 0px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 1px 4px 0px rgba(50, 50, 62, 0.12);
  }
  .hb-l .h-item{
    display: flex;
    padding: 12px;
    gap: 16px;
    justify-content: space-between;
  }
  .hb-l a::after{
    
  }
  .hb-l a{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    cursor: pointer;
    }
    .hb-l a:hover{
      color: var(--bs-red);
      background-color: #F8F8F8!important;
    }
    .h-item{
      width: 100%;
    }
    .hb-r .text-base{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    }
    .hb-r .text-xl{
    color: var(--character-primary, #222);
    font-family: var(--font-noto);
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    }
    .hb-r p{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    }
    .hb-r ol li{
    color: var(--character-secondary, #666);
    font-family: var(--font-noto);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    }
    .hb-r ol li{
      padding-bottom: 16px;
    }
    .hb-r ol{
      padding-left: 18px;
    }
  /*----------------------------------------*/
  /*  05. Widget CSS
  /*----------------------------------------*/
  /*--
  /*  5.1 - Footer Widget CSS
  /*----------------------------------------*/
  .footer-widget img{
    max-width: 260px;
  }
  .widget-about h5{
    color: #fff;
  }
  
  .divider-shape {
      width: 100%;
      background: url(../images/row-divide-02.svg) repeat-x;
      background-size: auto 12px;*/
  }
  .divider-shape-top {
      top: -10px;
      position: relative;
  }
  .divider-shape-bottom {
      position: relative;
      bottom: -10px;
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg);
  }
  
  
  .footer-widget-section {
    background-color: #e00700;
    padding-bottom: 10px;
  
  }
  
  .footer-widget-section:after {
    height:100px;
    width:100%;
    background: -webkit-gradient(radial, 50% 100%, 10, 50% 100%, 40, from(#369A7E), color-stop(0.49, #369A7E), color-stop(0.51, #fff), to(white));
  -webkit-background-size: 49px 100%;
  }
  
  
  .footer-widget-title {
    color: #fff;
    font-weight: 400;
    font-size: 20px;
    font-family: 'Noto Sans Thai', sans-serif;
    margin-bottom: 0px;
    padding-bottom: 10px;
  }
  
  .footer-widget {
    margin-top: 45px;
  }
  
  .footer-widget .widget-about p {
    font-family: 'Noto Sans Thai', sans-serif;
    padding-top: 3px;
    color: #fff;
    opacity: 0.6;
  }
  
  .footer-widget .widget-about p a {
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 500;
    font-size: 22px;
    color: #fff;
  }
  
  .footer-widget .widget-about p a:hover {
    color: #f2a100;
  }
  
  .footer-widget .widget-social {
    padding-top: 20px;
  }
  
  .footer-widget .widget-social ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .footer-widget .widget-social ul li + li {
    margin-left: 30px;
  }
  
  .footer-widget .widget-social ul li a {
    font-size: 16px;
    color: #252c51;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .footer-widget .widget-social ul li a:hover {
    color: #f2a100;
  }
  
  .footer-widget .footer-link li {
    font-family: 'Noto Sans Thai', sans-serif;
    margin-top: 3px;
  }
  
  .footer-widget .footer-link li a {
    font-size: 16px;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0.6;
    font-weight: 200;
  }
  
  .footer-widget .footer-link li a:hover {
    color: #fff;
    opacity: 1;
  }
  
  .footer-widget-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
  }
  
  /*--
  /*  5.2 - Sidebar Widget CSS
  /*----------------------------------------*/
  .sidebar-widget {
    margin-top: 0px;
    margin-bottom: 20px;
  }
  
  .widget-title {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 24px;
    font-weight: 500;
    color: #000;
    margin-bottom: 0;
    text-align: left;
  }
  .widget-title-3 {
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 18px;
    font-weight: 300;
    color: #E00700;
    margin-bottom: 0;
  }
  
  .widget-search {
    position: relative;
  }
  
  .widget-search input {
    width: 100%;
    height: 55px;
    padding: 0 15px;
    padding-right: 60px;
    border: 1px solid #ececec;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #222;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    border-radius: 12px;
    background-color: #fff;
  }
  
  .widget-search input:focus {
    outline: none;
    border-color: #f2a100;
  }
  
  .widget-search input::-webkit-input-placeholder {
    opacity: 1;
  }
  
  .widget-search input:-moz-placeholder {
    opacity: 1;
  }
  
  .widget-search input::-moz-placeholder {
    opacity: 1;
  }
  
  .widget-search input:-ms-input-placeholder {
    opacity: 1;
  }
  
  .widget-search button {
    position: absolute;
    top: 0px;
    right: 0px;
    border: 0;
    padding: 0;
    width: 50px;
    height: 55px;
    color: #fff;
    text-align: center;
    background: none;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background: #D71F27;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    font-size: 20px;
  }
  
  .widget-search button::before {
    /*position: absolute;
    content: '';
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 1px;
    height: 25px;
    background-color: #ececec;*/
  }
  
  .widget-checkbox {
    margin-top: 17px;
  }
  
  .widget-checkbox .checkbox-items li + li {
    margin-top: 12px;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"],
  .widget-checkbox .checkbox-items li input[type="radio"] {
    display: none;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"] + label,
  .widget-checkbox .checkbox-items li input[type="radio"] + label {
    margin-bottom: 0;
    font-weight: 300;
    font-size: 16px;
    color: #666666;
    font-family: 'Noto Sans Thai', sans-serif;
    cursor: pointer;
    line-height: 1.3;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"] + label span,
  .widget-checkbox .checkbox-items li input[type="radio"] + label span {
    width: 20px;
    height: 20px;
    border-radius: 3px;
    border: 2px solid #888888;
    display: inline-block;
    position: relative;
    top: 2px;
    margin-right: 13px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"] + label span::before,
  .widget-checkbox .checkbox-items li input[type="radio"] + label span::before {
    position: absolute;
    content: "\f107";
    font-family: FontAwesome;
    font-size: 14px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    top: -2px;
    left: -2px;
    text-align: center;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"]:checked + label span,
  .widget-checkbox .checkbox-items li input[type="radio"]:checked + label span {
    background-color: #ffb300;
    border-color: #ffb300;
  }
  
  .widget-checkbox .checkbox-items li input[type="checkbox"]:checked + label span::before,
  .widget-checkbox .checkbox-items li input[type="radio"]:checked + label span::before {
    opacity: 1;
    visibility: visible;
  }
  
  .widget-categories {
    height: unset;
    overflow-y: unset;
  }
  
  .widget-categories::-webkit-scrollbar-track {
    background-color: #ebebeb;
    border-radius: 10px;
  }
  
  .widget-categories::-webkit-scrollbar {
    width: 5px;
    background-color: #ebebeb;
    border-radius: 10px;
  }
  
  .widget-categories::-webkit-scrollbar-thumb {
    background-color: #f2a100;
    border-radius: 10px;
  }
  
  .widget-price {
    margin-top: 20px;
  }
  
  .widget-price .irs .irs-min,
  .widget-price .irs .irs-max {
    display: none;
  }
  
  .widget-price .irs .irs-from,
  .widget-price .irs .irs-to,
  .widget-price .irs .irs-single {
    color: #656565;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    padding: 0;
    background: none;
    border-radius: 0;
    top: -5px;
  }
  
  .widget-price .irs .irs-from::before,
  .widget-price .irs .irs-to::before,
  .widget-price .irs .irs-single::before {
    display: none;
  }
  
  .widget-price .irs .irs-line {
    height: 4px;
    background-color: #ebebeb;
  }
  
  .widget-price .irs .irs-bar {
    height: 4px;
    background-color: #ffb300;
  }
  
  .widget-price .irs .irs-handle {
    width: 15px;
    height: 15px;
    background-color: #fff;
    border: 3px solid #ffb300;
    border-radius: 50%;
    top: 19px;
    cursor: pointer;
  }
  
  .widget-price .irs .irs-handle i {
    display: none;
  }
  
  .accordion-item:first-of-type {
      border-top-left-radius: unset;
      border-top-right-radius: unset;
  }
  .accordion-button {
    font-size: 18px!important;
    font-weight: 300;
  }
  .accordion-item {
    margin-bottom: 8px;
  }
  
  
  
  
  
  
  
  
  .color-blue {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
  }
  
  .color-blue::before {
    border-color: #0d6efd;
    color: #fff;
  }
  
  .color-dark-blue {
    background-color: #004a80 !important;
    border-color: #004a80 !important;
  }
  
  .color-dark-blue::before {
    border-color: #004a80;
    color: #fff;
  }
  
  .color-lower-blue {
    background-color: #8194d9 !important;
    border-color: #8194d9 !important;
  }
  
  .color-lower-blue::before {
    border-color: #8194d9;
    color: #fff;
  }
  
  .color-indigo {
    background-color: #6610f2 !important;
    border-color: #6610f2 !important;
  }
  
  .color-indigo::before {
    border-color: #6610f2;
    color: #fff;
  }
  
  .color-purple {
    background-color: #6f42c1 !important;
    border-color: #6f42c1 !important;
  }
  
  .color-purple::before {
    border-color: #6f42c1;
    color: #fff;
  }
  
  .color-pink {
    background-color: #d63384 !important;
    border-color: #d63384 !important;
  }
  
  .color-pink::before {
    border-color: #d63384;
    color: #fff;
  }
  
  .color-red {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
  }
  
  .color-red::before {
    border-color: #dc3545;
    color: #fff;
  }
  
  .color-orange {
    background-color: #fd7e14 !important;
    border-color: #fd7e14 !important;
  }
  
  .color-orange::before {
    border-color: #fd7e14;
    color: #fff;
  }
  
  .color-yellow {
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
  }
  
  .color-yellow::before {
    border-color: #ffc107;
    color: #fff;
  }
  
  .color-green {
    background-color: #198754 !important;
    border-color: #198754 !important;
  }
  
  .color-green::before {
    border-color: #198754;
    color: #fff;
  }
  
  .color-teal {
    background-color: #20c997 !important;
    border-color: #20c997 !important;
  }
  
  .color-teal::before {
    border-color: #20c997;
    color: #fff;
  }
  
  .color-cyan {
    background-color: #0dcaf0 !important;
    border-color: #0dcaf0 !important;
  }
  
  .color-cyan::before {
    border-color: #0dcaf0;
    color: #fff;
  }
  
  .color-white {
    background-color: #fff !important;
    border-color: #fff !important;
  }
  
  .color-white::before {
    border-color: #fff;
    color: #fff;
  }
  
  .color-gray {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
  }
  
  .color-gray::before {
    border-color: #6c757d;
    color: #fff;
  }
  
  .color-gray-dark {
    background-color: #343a40 !important;
    border-color: #343a40 !important;
  }
  
  .color-gray-dark::before {
    border-color: #343a40;
    color: #fff;
  }
  
  .widget-tags .tags-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin-left: -7px;
    margin-right: -7px;
    padding-top: 5px;
  }
  
  .widget-tags .tags-list li {
    padding: 15px 7px 0;
  }
  
  .widget-tags .tags-list li a {
    height: 35px;
    line-height: 35px;
    padding: 0 22px;
    font-size: 14px;
    font-weight: 300;
    font-family: 'Noto Sans Thai', sans-serif;
    background-color: #f6f6f6;
    display: block;
    color: #7e7e7e;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    border-radius: 50px;
  }
  
  .widget-tags .tags-list li a:hover {
    background-color: #f2a100;
    color: #fff;
  }
  
  .sidebar-widget-02 {
    margin-top: 50px;
    padding: 30px;
    border: 1px solid #f1f1f1;
  }
  
  .widget-title-02 {
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
    color: #383838;
    margin-bottom: 0;
    padding-left: 1rem;
  }
  
  .widget-title-02::before {
    position: absolute;
    content: '';
    width: 2px;
    height: 14px;
    background-color: #f2a100;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  
  .widget-search-02 {
    position: relative;
  }
  
  .widget-search-02 input {
    width: 100%;
    height: 50px;
    padding: 0 15px;
    padding-right: 75px;
    border: 1px solid #d9d9d9;
    font-size: 14px;
    font-weight: 500;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #919090;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    border-radius: 0;
    background-color: #fff;
  }
  
  .widget-search-02 input:focus {
    outline: none;
    border-color: #f2a100;
  }
  
  .widget-search-02 input::-webkit-input-placeholder {
    opacity: 1;
  }
  
  .widget-search-02 input:-moz-placeholder {
    opacity: 1;
  }
  
  .widget-search-02 input::-moz-placeholder {
    opacity: 1;
  }
  
  .widget-search-02 input:-ms-input-placeholder {
    opacity: 1;
  }
  
  .widget-search-02 button {
    position: absolute;
    top: 0px;
    right: 0px;
    border: 0;
    padding: 0;
    width: 64px;
    height: 50px;
    color: #fff;
    text-align: center;
    background: none;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #f2a100;
  }
  
  .widget-recent-post {
    padding-top: 5px;
  }
  
  .single-recent-post {
    padding: 25px 0;
    border-bottom: 1px dashed #f1f1f1;
  }
  
  .single-recent-post:last-child {
    padding-bottom: 0;
    border-bottom: 0;
  }
  
  .single-recent-post .blog-meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  
  .single-recent-post .blog-meta li {
    font-size: 15px;
    font-weight: 500;
    color: #545454;
    font-family: 'Noto Sans Thai', sans-serif;
    display: inherit;
  }
  
  .single-recent-post .blog-meta li i {
    font-size: 18px;
    color: #000;
    margin-right: 8px;
  }
  
  .single-recent-post .blog-meta li + li {
    margin-left: 20px;
  }
  
  .single-recent-post .title {
    margin-bottom: 0;
  }
  
  .single-recent-post .title a {
    margin-top: 8px;
    display: inline-block;
    color: #383838;
    font-weight: 600;
    font-size: 20px;
  }
  
  .single-recent-post .title a:hover {
    color: #f2a100;
  }
  
  .widget-link {
    padding-top: 12px;
  }
  
  .widget-link li {
    padding: 10px 0;
    border-bottom: 1px dashed #f1f1f1;
  }
  
  .widget-link li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
  }
  
  .widget-link li a {
    font-size: 18px;
    font-weight: 500;
    color: #545454;
    font-family: 'Noto Sans Thai', sans-serif;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .widget-link li a:hover {
    color: #f2a100;
  }
  
  .widget-subscribe {
    margin-top: 30px;
  }
  
  .widget-subscribe input {
    width: 100%;
    height: 50px;
    padding: 0 20px;
    font-size: 14px;
    font-family: 'Noto Sans Thai', sans-serif;
    font-weight: 600;
    color: #c0c0c0;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    border: 1px solid #d7d7d7;
    border-radius: 0;
    background-color: #fff;
    text-align: center;
  }
  
  .widget-subscribe input::-webkit-input-placeholder {
    opacity: 1;
  }
  
  .widget-subscribe input:-moz-placeholder {
    opacity: 1;
  }
  
  .widget-subscribe input::-moz-placeholder {
    opacity: 1;
  }
  
  .widget-subscribe input:-ms-input-placeholder {
    opacity: 1;
  }
  
  .widget-subscribe input:focus {
    border-color: #f2a100;
    outline: none;
  }
  
  .widget-subscribe .btn {
    height: 50px;
    line-height: 50px;
    padding: 0 40px;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    border-radius: 0;
    margin-top: 1rem;
    width: 100%;
  }
  
  .widget-admin {
    text-align: center;
  }
  
  .widget-admin img {
    width: 100%;
  }
  
  .widget-admin .admin-name {
    font-size: 18px;
    font-weight: 600;
    color: #2e2a31;
    margin-bottom: 0;
    margin-top: 22px;
  }
  
  .widget-admin .designation {
    font-size: 16px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #5f5f5f;
    display: block;
  }
  
  .widget-admin .signechar {
    width: auto;
  }
  
  /*----------------------------------------*/
  /*  06. Footer CSS
  /*----------------------------------------*/
  .footer-top {
    background-color: #e9e1f7;
    padding-top: 10px;
    padding-bottom: 40px;
  }
  
  .footer-logo {
    margin-top: 30px;
  }
  
  .footer-contact-payment {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .footer-contact-payment .footer-contact {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 30px;
  }
  
  .footer-contact-payment .footer-contact .contact-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding-left: 20px;
    margin-bottom: -5px;
  }
  
  .footer-contact-payment .footer-contact .contact-content .title {
    font-size: 24px;
    color: #252c51;
    font-weight: 600;
    line-height: 1.1;
    margin-bottom: 0;
  }
  
  .footer-contact-payment .footer-contact .contact-content p {
    font-size: 24px;
    color: #252c51;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    line-height: 1.1;
  }
  
  .footer-contact-payment .footer-payment {
    margin-top: 30px;
  }
  
  .footer-subscribe {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin-top: 30px;
  }
  
  .footer-subscribe .title {
    font-size: 24px;
    font-weight: 600;
    font-family: 'Noto Sans Thai', sans-serif;
    color: #252c51;
    white-space: nowrap;
    padding-right: 15px;
  }
  
  .footer-subscribe .subscribe-form {
    position: relative;
    max-width: 276px;
    width: 100%;
  }
  
  .footer-subscribe .subscribe-form input {
    width: 100%;
    height: 46px;
    padding: 0 15px;
    padding-right: 60px;
    background-color: #f4edff;
    font-family: 'Noto Sans Thai', sans-serif;
    font-size: 14px;
    color: #919090;
    border: 1px solid #f4edff;
    font-weight: 600;
    outline: none;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .footer-subscribe .subscribe-form input::-webkit-input-placeholder {
    opacity: 1;
    color: #919090;
  }
  
  .footer-subscribe .subscribe-form input:-moz-placeholder {
    opacity: 1;
    color: #919090;
  }
  
  .footer-subscribe .subscribe-form input::-moz-placeholder {
    opacity: 1;
    color: #919090;
  }
  
  .footer-subscribe .subscribe-form input:-ms-input-placeholder {
    opacity: 1;
    color: #919090;
  }
  
  .footer-subscribe .subscribe-form input:focus {
    border-color: #f2a100;
  }
  
  .footer-subscribe .subscribe-form button {
    width: 46px;
    height: 46px;
    line-height: 50px;
    padding: 0;
    border: 0;
    background-color: #f2a100;
    color: #fff;
    font-size: 26px;
    text-align: center;
    position: absolute;
    top: 0;
    right: 0;
  }
  
  .copyright {
    background-color: #e00700;
  }
  
  .copyright-text {
    padding: 15px 0px 60px 0px;
    border-top: 0.5px solid #fff;
    opacity: 0.6;
  }
  
  .copyright-text p {
    color: #fff;
    font-size: 16px;
    font-weight: 300;
  }
  
  .copyright-text p span {
    color: #f2a100;
    text-transform: uppercase;
  }
  
  .copyright-text p i {
    color: #ff0000;
  }
  
  .copyright-text p a {
    color: #f2a100;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    font-weight: 500;
  }
  
  .copyright-text p a:hover {
    color: #f2a100;
  }
  
  .back-to-top {
    position: fixed;
    bottom: 70px;
    right: 20px;
    font-size: 30px;
    width: 40px;
    height: 40px;
    line-height: 45px;
    border-radius: 50%;
    z-index: 99;
    text-align: center;
    display: none;
    -webkit-box-shadow: 0px 0px 30px 0px rgba(156, 156, 156, 0.25);
            box-shadow: 0px 0px 30px 0px rgba(156, 156, 156, 0.25);
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    color: #fff;
    background-color: #f2a100;
  }
  
  .back-to-top:hover {
    color: #fff;
    background-color: #494949;
  }
  
  /* ////////////////////////////// Responsive /////////////////////////////////// */
  
  /* ----------- iPhone ----------- */
  @media only screen and (max-width: 575px) {
    .section-title-03 .title {font-size: 26px;}
    .pagination .page-item .page-link {width: 30px;height: 30px;line-height: 30px;}
    .swiper-arrows {width: 100%;padding-bottom: 10px;}
    .modal .modal-dialog .modal-content .modal-body {padding: 20px;padding-bottom: 50px;}
    .page_border_stamp_2 .bg_grey {padding: 0px!important;}
    .product-details-description {margin-top: 30px;}
    .btn {text-align: left;}
    .btn-outline-primary {margin-bottom: 8px;padding: 10px 30px;margin-top: 8px;}
    .quick-gallery-thumbs {padding: 0 30px;}
    .quick-gallery-thumbs .swiper-container {max-width: 100%;}
    .quick-gallery-thumbs .swiper-button-next,
    .quick-gallery-thumbs .swiper-button-prev {width: 25px;height: 25px;line-height: 25px;font-size: 20px;}
    .quick-view-description .product-name {font-size: 20px;}
    .quick-view-description .review-wrapper .review-star .star::before {letter-spacing: 2px;}
    .quick-view-description .review-wrapper .review-star::before {letter-spacing: 2px;}
    .quick-view-description .price .sale-price {font-size: 18px;}
    .quick-view-description .price .old-price {font-size: 16px;}
    .single-slider.slider-02 {padding-top: 215px;padding-bottom: 80px;}
    .single-slider {padding-top: 195px;}
    .slider-section .slider-shape {width: 300px;height: 300px;}
    .header-meta .action {font-size: 24px;}
    .header-meta .action .number {left: 20px;top: -6px;}
    .slider-active .swiper-button-next {right: 15px;}
    .slider-active .swiper-button-prev {left: 15px;}
    .slider-active .swiper-button-next,
    .slider-active .swiper-button-prev {top: auto;bottom: 20px;}
    .slider-active .swiper-pagination {bottom: 20px;}
    .slider-content-02 .title {font-size: 36px;}
    .slider-content .title {font-size: 36px;}
    .slider-images {width: 100%;}
    .head-box-center {width: 90%;margin: 0px auto;}
    .home-recommended-single-product .product-content .title a {font-size: 26px;}
    .cate-symbol {bottom: 15px;}
    .home-recommended-wrapper .arrow-wrapper {display: none;}
    .single-product .product-content .title a {font-size: 18px;}
    .single-product .product-content {}
    .product-menu .nav li button {font-size: 13px;}
    .product-menu .nav li {margin-bottom: 10px;}
    .product-top-wrapper > *:first-child {width: 100%;}
    .section-title-shop {display: block;margin-bottom: 20px;}
    .author-member img {width: 35px;height: 35px;}
    .home-recommended-single-product .product-content {}
    .slider-section{margin-top: 40px;}
    .pro-box {display: block;}
    .bpp-left {width: 100%;padding: 6px;}
    .bpp-right {width: 100%;}
    .single-banner-03 .banner-content .btn {margin-top: 15px;}
    .single-banner-03 .banner-content .title a {font-size: 24px;}
    .single-banner-03 .banner-content .sub-title {font-size: 16px;}
    .single-banner-03 .banner-content {padding: 20px;padding-top: 15px;}
    .marker-wrapper .image-pointer.pointer-02 {left: 27%;}
    .marker-wrapper .image-pointer.pointer-01 .pointer-box {
      left: -30px;
      -webkit-transform: translateX(0);
          -ms-transform: translateX(0);
              transform: translateX(0);
    }
    .marker-wrapper .image-pointer.pointer-01 {left: 10%;}
    .marker-wrapper .marker-content {display: none;}
    .marker-wrapper {background-size: 160% 100%;background-position: center right;}
    .countdown-wrapper .countdown .single-countdown .count {font-size: 30px;}
    .countdown-wrapper .countdown .single-countdown + .single-countdown::before {font-size: 30px;left: -24px;}
    .countdown-wrapper .countdown .single-countdown + .single-countdown {margin-left: 40px;}
    .countdown-content .title {font-size: 28px;}
    .call-to-action-content p {font-size: 16px;}
    .call-to-action-content .title {font-size: 32px;}
    .single-product .product-meta li .action {width: 44px;height: 44px;line-height: 44px;font-size: 23px;}
    .single-product .product-content .price .old-price {font-size: 16px;}
    .single-product .product-content .price .sale-price {font-size: 18px;}
    .marker-wrapper .image-pointer.pointer-03 {left: 46%;}
    .marker-wrapper .image-pointer.pointer-04 {left: 67%;}
    .shop-top-bar-1 .shop-tabs .nav {
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
    .shop-top-bar-1 > * {width: 100%;text-align: left;}
    .single-team .team-content .designation {font-size: 16px;}
    .single-team .team-content .name {font-size: 20px;}
    .single-counter p {font-size: 14px;line-height: 1.3;margin-top: 5px;}
    .single-counter .count sub {font-size: 18px;bottom: -2px;}
    .single-counter .count span {font-size: 30px;}
    .single-counter {padding: 25px;}
    .brand-row {grid-template-columns: 1fr 1fr;}
    .product-details-tabs .nav li button::before {display: none;}
    .product-details-tabs .nav {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
    }
    .product-details-description .review-wrapper .review-star .star::before {letter-spacing: 5px;}
    .review-wrapper .review-star .star::before {letter-spacing: 5px;}
    .product-details-description .review-wrapper .review-star::before {letter-spacing: 5px;}
    .review-wrapper .review-star::before {letter-spacing: 5px;}
    .product-details-description .price .old-price {font-size: 16px;}
    .product-details-description .price .sale-price {font-size: 20px;}
    .product-details-description .product-name {font-size: 24px;}
    .details-gallery-thumbs .swiper-button-next,
    .details-gallery-thumbs .swiper-button-prev {width: 25px;height: 25px;line-height: 25px;font-size: 20px;}
    .details-gallery-thumbs .swiper-container {max-width: 100%;}
    .details-gallery-thumbs {padding: 0 30px;}
    .blog-next-previous-post {
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
    }
    .blog-auhtor-social .blog-social .share-count {margin-left: 20px;}
    .author-member img {width: 35px;height: 35px;}
    .checkout-order {padding: 20px;}
    .compare-product .pack-product-container .desc-box .product-prices .sale-price {font-size: 24px;}
    .compare-product .pack-product-container .desc-box .product-prices .old-price {font-size: 18px;}
    .cart-totals .cart-total-btn .btn {margin-right: 5px;}
    .cart-title .title {font-size: 20px;}
    .cart-btn .right-btn .btn {width: 48%;}
    .cart-btn .right-btn {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
    }
    .cart-btn .left-btn .btn {width: 100%;}
    .cart-btn {display: block;}
    .single-reviews .comment-content {padding-top: 25px;padding-left: 0;}
    .single-reviews {display: block;}
    .footer-subscribe {display: block;}
    .product-details-description .product-attributes-1 ul li input[type="checkbox"] + label {font-size: 18px;}
    .footer-contact-payment {display: block;}
    .widget-tags .tags-list li a {padding: 0 20px;}
    .footer-widget-link .footer-widget {width: 100%;}
    .contact-form .single-form .btn {height: 50px;line-height: 50px;padding: 0 30px;}
    .contact-form {padding: 30px;padding-top: 0px;}
    .contact-info-items .single-contact-info .info-content p {font-size: 14px;}
    .contact-info-items .single-contact-info {padding: 8px 15px;}
    .contact-info .title {font-size: 24px;}
    .contact-info {padding: 55px 25px 150px;}
    .blog-comment .comments-reply {padding-left: 0;}
    .blog-comment .single-comment .comment-content .reply {position: relative;margin-top: 8px;}
    .blog-comment .single-comment .comment-content {padding-left: 0;padding-top: 25px;}
    .blog-comment .single-comment {display: block;}
    .blog-next-previous-post .blog-next-post {margin-left: auto;}
    .season-symbol {bottom: 0%;left: 0%;}
    .bg-hidden-gem:before {width: 30%;top: -5%;left: 2%;}
    .bg-hidden-gem:after{display: none;}
    .home-hiddengem-single-product .product-content .title a {font-size: 18px;}
    .home-hiddengem-single-product .product-content .review-wrapper .province span {font-size: 18px;}
  /*  .home-hiddengem-single-product .product-content {height: 100px;}*/
    .bg-creative-hand:after {display: none;}
    .card-inner {padding: 20px;}
    .arrow-wrapper {display: none;}
    .home-hit-items-single-product .card-inner {max-width: unset;}
    .home-hit-items-section .head-box-center h2{font-size: 50px;}
    .bg-hit-items .product-relate {padding-top: 0px;padding-bottom: 50px;}
    .home-Preferred-single-product .card-inner {max-width: unset;}
    .home-Preferred-single-product .product-content .review-wrapper .province span {font-size: 24px;}
    .home-Preferred-single-product .product-content .title a {font-size: 28px;}
    .home-Preferred-section .head-box-center .title h5 {font-size: 26px;}
    .zz-02-01 {display: none;}
    .zz-02 {bottom: 0;}
    .zz-box .head-box-center .title {padding-right: unset;}
    .home-zogzag-single-product .product-content .review-wrapper .province span {font-size: 24px;}
    .home-zogzag-single-product .product-content .title {padding-top: 25px;}
    .tt-02-01 {width: 280px;}
    .tt-02 {margin-top: 0px;bottom: 6%;}
    .home-tuatop-section .divider-shape-bottom {bottom: -100px;}
    .home-tuatop-section {padding-bottom: 0px;}
    .home-news-section .head-box-center .title{text-align: center;}
    .tt-04-01{width: 350px;}
    .tt-04{bottom: 0rem;}
    .warranty-icon .wrt-left img, .warranty-icon .wrt-center img, .warranty-icon .wrt-right img{max-width: 100px;}
    .home-warranty-section .divider-shape-bottom{bottom: -5rem;top: unset;}
    .swiper-slide-active .card {transform: scale(1);}
    .home-lover-wrapper .position-relative .swiper-container {padding-top: 0px;padding-bottom: 20px;}
    .bg-lover .product-relate {padding-top: 0px;padding-bottom: 0px;}
    .header-meta {justify-content: flex-end;}
    .filter-right {justify-content: center;margin: 30px 0px 0px 0px;}
    .slick-track {display: flex!important;}
    .product-filter {display: block;}
    .dropdown-toggle {padding: 15px 20px!important;}
    .slick-initialized .swipe-tab {font-size: 18px;height: 60px;}
    .slick-slider .slick-track {width: 700!important;}
    .gallery-thumbs .swiper-slide {width: 30%;}
    .shop-top-bar-1 {}
    .bg-search {background-color: #fff;padding-top: 12px;}
    .shop-top-bar-2 {display: block;}
    .page-pagination {display: block;}
    .page-pagination .gap-4 {justify-content: space-between;margin: 0px 10px;}
    .page-pagination .gap-3 {justify-content: center!important;margin-top: 10px;}
    .widget-checkbox .ps-3 {padding-left: 0rem!important;}
    .widget-checkbox .checkbox-items li input[type="checkbox"] + label, .widget-checkbox .checkbox-items li input[type="radio"] + label{
      align-items: center;display: flex;}
    .widget-checkbox .checkbox-items li input[type="checkbox"] + label span, .widget-checkbox .checkbox-items li input[type="radio"] + label span{
      width: 25px;height: 25px;top: 0px;border: 1px solid #E9E9E9;}
    .widget-checkbox .checkbox-items li input[type="checkbox"] + label span::before, .widget-checkbox .checkbox-items li input[type="radio"] + label span::before {
      width: 25px;height: 25px;}
    .widget-checkbox .checkbox-items li input[type="checkbox"] + label, .widget-checkbox .checkbox-items li input[type="radio"] + label {
      font-size: 18px;}
    .widget-checkbox ul li{margin-bottom: 20px;display: flex;justify-content: space-between;align-items: center;}
    .widget-checkbox ul li .badge{background-color: #e9e9e9;background-color: #e9e9e9;
      color: #666;text-align: center;font-family: 'Noto Sans Thai', sans-serif;font-size: 14px;line-height: 20px;}
    .accordion-item {border: unset!important;border-bottom: 1px solid #e9e9e9!important;}
    .modal-footer {justify-content: space-between!important;}
    .modal-footer .btn-lg {padding-left: 50px;padding-right: 50px;}
    .modal .modal-dialog .modal-content .btn-close {position: inherit;font-size: 24px}
    .verify-email .icon img {width: 26%;}
    .verify-email .ref-code .w-8 {width: 13%!important;}
    #pills-login {width: 100%;}
    .btn-register {padding-left: 4.5rem!important;padding-right: 4.5rem!important;}
    .page-banner-section-top {padding: 150px 0px 10px 0px;}
    .header-table-data {padding: 8px 8px;background: #fff;margin-bottom: 0px;}
    .body-table-data {margin: 10px 0px;}
    .bg-cart {background: transparent!important;}
    .bg-cart .p-3 {padding: 5px!important;}
    .row-shop .data-col-2 {
      width: 100%;
    }
    .cart-pl-0{padding-right: 0px!important}
    .row-product{padding: 12px 12px;}
    .row-detail {padding: 0px 0px;}
    .row-product .data-col-2 {width: 100%;}
    .data-col-4 {width: 100%;}
    .data-col-5 {width: 100%;text-align: left;}
    .total-price, .total-price span {margin: 4px 0px;}
    .data-col-1{align-items: baseline;}
    .b-name {display: block;}
    .cart-address .b-name{display: flex;}
    .b-name .c-name{display: grid;}
    .c-btn-r{margin-top: 16px;}
    .cart-address .c-btn-r{margin-top: 0px;}
    .cart-address .c-name .l1{border-right: none;padding-left: 0px;}
    .cart-address .c-name .l2{text-align: left;padding-left: 0px;}
    .c-btn-r a{margin: 0px;padding-left: 16px;}
    .address-invoice .b-name .c-name {display: flex;}
    .modal-form-register .address-invoice .b-name{padding: 0px;}
    .modal-form-register .c-add {padding: 12px 0px;}
    .modal-form-register .c-btn-l{margin-left: 0px;margin-bottom: 28px;padding: 0px;}
    .address-invoice .b-name .c-name .l1{border-right: none;}
    .page-banner-section-cate{margin-bottom: -100px;margin-top: 60px;}
    .page-banner-content{width: 100%;}
    .table-select tbody tr{display: grid;}
    .table-select .th-l{width: 100%;}
    .table-select .td-r{width: 100%;}
    .btn-select-payment {display: flex;}
    .plan-details{width: 100%;}
    .form-me11{margin-right: 0px!important;}
    .row-grid{grid-template-columns: unset;padding-left: 16px;}
    .bg-qr-payment .btn-footer{padding: 0px 20px 28px 20px; gap: 20px;}
    .contact-box .cb-l{border-bottom-left-radius: 0px;border-top-right-radius: 16px;display: flex;gap: 14px;align-items: center;}
    .contact-box .cb-r{border-top-right-radius: 0px;border-bottom-left-radius: 16px;}
    .cb-l span{font-size: 20px;line-height: 20px;}
    .cb-l .ic-mail {margin-bottom: 0px;width: 26px;}
    .cb-r .w-50{width: 100%!important;}
    .contact-box .cb-r{padding: 16px;}
    .cb-r .br-name{display: grid;}
    .form-topic-contact{padding-right: 0px;}
    #topic-contact{width: 100%;}
    #topic-contact option{width: 100%;max-width: 370px;}
    .hb-l a::after{
    content: "";
    background-image: url(../images/help/right.svg);
    width: 24px;
    height: 24px;
    }
    .wt2-box-left .title span {font-size: 20px!important;}
    .my-account-detail .account-form {padding: 0px 0px;}
    .name .tel2 {display: flex;gap: 10px;flex-flow: column;}
    .account-form .text-align-end{text-align: center;}
    .hb-r{border-radius: 0px;}
  
  
  
  /* ----------- iPhone ----------- */
  
  /* ----------- iPad ----------- */
  @media only screen 
    and (min-device-width: 768px) 
    and (max-device-width: 1024px) 
    and (-webkit-min-device-pixel-ratio: 1) {
      .product-relate {padding-top: 20px;padding-bottom: 20px;}
      /* .border-card-product {background-size: cover;}*/
      .home-recommended-single-product .product-content .title a{font-size: 20px;}
      .cate-symbol {bottom: 7px;right: 10px;width: 30%;}
  /*    .home-recommended-single-product a img {padding: 15px;}*/
  /*    .home-recommended-single-product .product-content {padding: 0px 15px;}*/
      .home-recommended-single-product .product-content .review-wrapper .province span {font-size: 14px;}
      .home-recommended-single-product .province a {font-size: 14px;}
      .season-symbol {position: absolute;bottom: 33%;left: 0%;}
      .bg-hidden-gem:before {width: 18%;top: -3%;left: 1%;}
      .bg-hidden-gem:after {width: 40%;bottom: 14%;right: 7%;}
      .home-hiddengem-single-product .product-content .title a {font-size: 20px;}
      .bg-creative-hand:after {width: 50%;bottom: 14%;right: 5%;}
      .border-card-product {background-image: url(../images/bg-card-product-2.svg);}
  /*    .home-season-single-product a img {padding: 14px;}*/
      .home-recommended-wrapper .arrow-wrapper .swiper-button-next:after, .home-recommended-wrapper .arrow-wrapper .swiper-button-prev:after {
      font-size: 3rem!important;}
      .home-recommended-wrapper .arrow-wrapper .swiper-button-next {right: -4%;}
  /*    .home-season-single-product .product-content {padding: 0px 14px;height: 115px;}*/
      .home-season-single-product .product-content .title a {font-size: 20px;}
      .home-season-single-product .product-content .review-wrapper .province span {font-size: 18px;}
      .home-season-single-product .province a {font-size: 20px;}
      .home-creativehand-single-product .product-content .title a {font-size: 20px;}
      .arrow-wrapper {display: none;}
      .home-Preferred-single-product .product-content {padding: 0px 10px;}
      .home-zogzag-section .head-box-center .title span {font-size: 20px;}
      .home-zogzag-section .head-box-center .title h5 {font-size: 30px;}
      .home-zogzag-section .head-box-center .title h2 {font-size: 56px;}
      .zz-02{margin-top: 26px;}
      .zz-02-01 {width: 210px;}
      .zz-02-02 {width: 110px;left: -30px;}
      .zz-box .head-box-center .title {padding-right: unset;}
      .home-tuatop-section .divider-shape-bottom {bottom: -55px;}
      .tt-02-01 {width: 280px;}
      .tt-02 {margin-top: 0px;right: 34%;}
      .home-tuatop-section {padding-bottom: 0px;}
      .home-news-section .head-box-center .title {text-align: center;}
      .tt-04-01 {width: 300px;}
      .home-warranty-section .head-box-center{margin-top: 2.5rem;}
      .warranty-icon .wrt-left img, .warranty-icon .wrt-center img, .warranty-icon .wrt-right img{max-width: 90px;}
      .home-warranty-section .head-box-center .title h2{font-size: 2.5rem;margin-bottom: 10px;}
      .home-warranty-section .divider-shape-bottom{top: 6.5rem;}
      .home-warranty-section {margin-bottom: -40px;}
      .wt2-box-left {display: block;}
      .filter-right {justify-content: center;margin: 30px 0px 0px 0px;}
      .slick-track {display: flex!important;width: 1000px}
      .product-filter {display: block;}
      .dropdown-toggle {padding: 20px 40px!important;}
      .slick-initialized .swipe-tab {font-size: 18px;height: 60px;}
      .section-padding {padding-top: 90px;}
      .contact-box .cb-l{border-bottom-left-radius: 0px;border-top-right-radius: 16px;display: flex;gap: 26px;}
      .contact-box .cb-r{border-top-right-radius: 0px;border-bottom-left-radius: 16px;}
  }
  /* ----------- iPad ----------- */
  
  
  /* ----------- Laptop ----------- */
  
  
  
  
  /* ----------- Laptop ----------- */
  @media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .single-slider {height: 880px;}
    .season-symbol {bottom: 2%;left: 2%;}
    .bg-season-play:before {width: 16%;top: 26%;left: 1%;}
    .bg-hidden-gem:before {width: 12%;top: 0%;left: 1%;}
    .bg-hidden-gem:after {width: 16%;bottom: 18%;;right: 1%;}
    .bg-creative-hand:after {width: 16%;bottom: 9%;right: 0%;}
    .home-tuatop-wrapper span {font-size: 18px;}
    .home-tuatop-section .head-box-center .title p {font-size: 20px;}
    .home-tuatop-section .head-box-center .title h2 {font-size: 4rem;}
    .home-tuatop-section .head-box-center .title h5 {font-size: 4rem;}
    .tt-02 {margin-top: 0px;}
    .home-tuatop-section .divider-shape-bottom {bottom: 5px;}
    .home-tuatop-section {padding-bottom: 10px;}
    .tt-04-01 {width: 335px;}
    .home-warranty-section .head-box-center {margin-top: 0rem;}
    .warranty-icon .wrt-left img, .warranty-icon .wrt-center img, .warranty-icon .wrt-right img{max-width: 100px;}
    .home-warranty-section {margin-bottom: 0px;}
  
  /* ----------- Laptop ----------- */
  
  
  @media only screen and (max-width: 767px) {
    .section-padding {padding-top: 60px;padding-bottom: 60px;}
    .section-padding-02 {padding-top: 60px;}
    .call-to-action-content p {font-size: 20px;}
    .call-to-action-content .title {font-size: 52px;}
    .call-to-action {height: 526px;}
    .product-wrapper-02 .product-tabs-content {padding-top: 0;}
    .product-list .product-content {margin-top: 0;padding-top: 25px;padding-left: 0;}
    .product-list .product-images {width: 100%;}
    .product-list {display: block;}
    .product-top-wrapper {
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
    }
    .slider-active .swiper-button-next {right: calc((100% - 540px) / 2);}
    .slider-active .swiper-button-prev {left: calc((100% - 540px) / 2);}
    .slider-images {
      position: relative;padding-bottom: 50px;margin-top: 50px;
      -webkit-transform: translateY(0);
          -ms-transform: translateY(0);
              transform: translateY(0);
      width: 90%;margin-left: auto;margin-right: auto;top: 0;}
    .single-slider {height: auto;padding-top: 245px;display: block;}
    .slider-section .slider-shape {width: 350px;height: 350px;top: 0;}
    .modal .modal-dialog {max-width: 30rem;}
    .single-select2 .form-select2 .select2-container--default .select2-selection--single .select2-selection__rendered {line-height: 38px;}
    .single-select2 .form-select2 .select2-container--default .select2-selection--single {height: 40px;}
    .btn {font-size: 14px;}
    .section-title-03 .title {font-size: 36px;}
    .section-title-03 .sub-title {font-size: 16px;}
    .blog-details-wrapper .title {font-size: 28px;}
    .checkout-order {padding: 40px;}
    .compare-wrapper .table tbody tr th {display: none;}
    .empty-cart .empty-cart-title {font-size: 24px;}
    .cart-btn {padding: 10px 10px 20px;}
    .page-banner-section-top .page-banner-content {padding-top: 50px;margin-bottom: unset;}
    .page-banner-content {padding-top: 145px;width: 50%;margin-right: 0%;margin-top: 0px;margin-bottom: -110px;}
    .page-banner-content h1 {font-size: 3rem;color: #fff;}
    .page-banner-content-2 {padding-top: 20px;}
    .page-banner-section {height: 400px;}
    .page-banner-section-top {height: 300px;}
    .brand-row {grid-template-columns: 1fr 1fr 1fr;}
    .marker-wrapper .image-pointer.pointer-02 {top: 40px;}
    .marker-wrapper .image-pointer.pointer-01 {top: 48%;}
    .marker-wrapper .marker-content {padding: 35px;}
    .marker-wrapper {height: 230px;}
    .brand-row .brand-col .single-brand {margin-top: -1px;}
    .cart-btn .btn {padding: 0 13px;margin-right: 5px;font-size: 13px;}
    .contact-info {padding: 55px 40px 150px;}
    .blog-next-previous-post .blog-previous-post .post-content .title a,
    .blog-next-previous-post .blog-next-post .post-content .title a {font-size: 16px;}
    .blog-next-previous-post .blog-previous-post .post-arrow a,
    .blog-next-previous-post .blog-next-post .post-arrow a {width: 75px;height: 75px;line-height: 75px;}
  
    .container{
          max-width: 970px!important;
      }
  
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-section {padding-top: 150px;}
    .modal .modal-dialog {max-width: 45rem;}
    .section-padding-02 {padding-top: 80px;}
    .section-padding {padding-top: 40px;padding-bottom: 40px;}
    .contact-info {padding: 55px 40px 200px;}
    .page-banner-section-cate {height: 670px!important;}
    .page-banner-content h1 {font-size: 5.5rem}
    .page-banner-content h2 {font-size: 28px;}
    .blog-next-previous-post .blog-previous-post .post-content,
    .blog-next-previous-post .blog-next-post .post-content {max-width: 230px;}
    .page-banner-content {padding-top: 50px;width: 50%;margin-right: 0%;}
    .page-banner-content-2 {padding-top: 140px;}
    .marker-wrapper .marker-content {padding: 50px;}
    .product-list .product-images {width: 270px;}
    .single-banner .banner-content {padding: 25px;padding-top: 20px;}
    .single-banner-home .banner-content {padding: 25px;padding-top: 20px;}
    .slider-active .swiper-button-next {right: calc((100% - 720px) / 2);}
    .slider-active .swiper-button-prev {left: calc((100% - 720px) / 2);}
    .slider-content {max-width: 370px;}
    .slider-images {width: 65%;}
    .single-slider {height: auto;padding-top: 115px;padding-bottom: 130px;display: block;}
  
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 575px) {
    .slider-content p {font-size: 14px;}
    .slider-content p br {display: none;}
    .slider-content-02 p {font-size: 14px;}
    .slider-content-02 p br {display: none;}
  }
  
  
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
    .slider-active .swiper-button-next,
    .slider-active .swiper-button-prev {margin-top: 50px;font-size: 16px;}
    .footer-widget-link .footer-widget {width: 50%;}
    .footer-widget-link {
      -webkit-box-pack: end;
      -webkit-justify-content: flex-end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
    }
    .single-brand {height: 150px;}
    .marker-wrapper .marker-content .title {font-size: 38px;}
    .slider-active .swiper-button-next::before,
    .slider-active .swiper-button-prev::before {width: 150%;}
    .slider-content-02 .title {font-size: 50px;}
    .slider-content .title {font-size: 50px;}
    .single-slider.slider-02 {height: auto;padding-top: 275px;padding-bottom: 130px;}
    .sticky {padding: 12px 0 !important;}
    .header-search {margin-bottom: 20px;}
    .header-meta .dropdown .dropdown-profile {left: auto !important;right: 0 !important;top: 100% !important;}
    .header-meta .action .number {right: 0;}
  
  }
  
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .slider-section .slider-shape {width: 550px;height: 550px;}
  
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .single-banner-03 .banner-content .title a {font-size: 30px;}
    .single-banner-02 .banner-content .discount {font-size: 34px;}
    .single-banner-02 .banner-content .title a {font-size: 30px;}
    .single-banner-02 .banner-content {padding: 20px;padding-top: 15px;}
    .slider-active .swiper-button-next {right: calc((100% - 920px) / 2);}
    .slider-active .swiper-button-prev {left: calc((100% - 920px) / 2);}
    .slider-content-02 .title {font-size: 70px;}
    .slider-content .title {font-size: 70px;}
    .slider-images img {width: 507px;}
    .single-slider.slider-02 {height: 750px;}
    .single-slider {height: 750px;}
    .header-menu ul li:nth-last-of-type(2) .sub-menu li .sub-menu {left: auto;right: 100%;}
    .header-menu ul li {padding: 18px 10px;}
    .section-title-03 .title {font-size: 40px;}
    .section-title-02 .title {font-size: 24px;}
    .section-title .title {font-size: 24px;}
    .section-title-shop .title {font-size: 24px;}
    .countdown-wrapper .countdown .single-countdown .count {font-size: 50px;}
    .countdown-wrapper .countdown .single-countdown + .single-countdown::before {font-size: 50px;left: -37px;}
    .countdown-wrapper .countdown .single-countdown + .single-countdown {margin-left: 60px;}
    .countdown-content .title {font-size: 42px;}
    .single-product-02 .product-content .price .old-price {font-size: 14px;}
    .single-product-02 .product-content .price .sale-price {font-size: 16px;}
    .single-product-02 .product-content .title a {font-size: 15px;}
    .single-product-02 .product-images .product-meta li .action {width: 34px;height: 34px;line-height: 34px;font-size: 20px;}
    .single-recent-post .title a {font-size: 16px;}
    .widget-tags .tags-list li a {padding: 0 15px;}
    .widget-title {font-size: 22px;}
    .contact-info-items .single-contact-info .info-content p {font-size: 16px;}
    .contact-info .title {font-size: 30px;}
    .contact-info {padding: 55px 30px 60px;}
    .marker-wrapper .image-pointer .pointer-box .price {font-size: 16px;}
    .marker-wrapper .image-pointer .pointer-box .name a {font-size: 15px;}
  
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (max-width: 767px) {
    .home-recommended-single-product .product-content {}
    .blog-next-previous-post .blog-previous-post .post-content,
    .blog-next-previous-post .blog-next-post .post-content {padding: 0 15px;}
    .single-products-banner .products-banner-content .banner-content-wrapper .arrow {width: 35px;height: 35px;line-height: 38px;right: 15px;font-size: 30px;}
    .single-products-banner .products-banner-content .banner-content-wrapper .products-count {font-size: 20px;}
    .single-products-banner .products-banner-content .banner-content-wrapper .title a {font-size: 26px;}
    .single-products-banner .products-banner-content .banner-content-wrapper {padding: 10px 15px;}
    .single-product .product-meta li .action {width: 34px;height: 34px;line-height: 34px;font-size: 20px;}
    .single-product .product-content .price .old-price {font-size: 14px;}
    .single-product .product-content .price .sale-price {font-size: 18px;}
    .single-product .product-content .title a {font-size: 15px;}
    .single-product .product-content {}
    .home-recommended-single-product .product-content .title a {font-size: 15px;}
    .single-banner-03 .banner-content {padding: 40px;padding-top: 35px;}
  
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (max-width: 575px) {
    .single-banner .banner-content {padding: 20px;padding-top: 15px;}
    .single-banner-home .banner-content {padding: 20px;padding-top: 15px;}
    .contact-info-items .single-contact-info .info-icon i {font-size: 24px;}
    .single-blog .blog-content .title a {font-size: 20px;}
    .single-benefit .title {font-size: 24px;}
    .single-benefit {padding: 40px 30px 35px;}
    .single-banner .banner-content .discount {font-size: 26px;}
    .single-banner .banner-content .title a {font-size: 24px;}
    .single-banner-home .banner-content .title a {font-size: 22px;}
  
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .blog-next-previous-post .blog-previous-post .post-content .title a,
    .blog-next-previous-post .blog-next-post .post-content .title a {
      font-size: 20px;
    }
  
  }
  
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (max-width: 767px) {
    .slider-content .btn {height: 50px;line-height: 48px;padding: 0 25px;font-size: 14px;}
    .slider-content-02 p {font-size: 16px;}
    .slider-content-02 .btn {height: 50px;line-height: 48px;padding: 0 25px;font-size: 14px;}
    .slider-content p {font-size: 16px;}
    .footer-subscribe .subscribe-form {max-width: 100%;}
    .call-to-action-content .btn {height: 50px;line-height: 48px;padding: 0 25px;font-size: 14px;}
  
  }
  
  @media only screen and (min-width: 1600px), only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slider-content .btn {height: 60px;line-height: 58px;padding: 0 48px;font-size: 16px;}
    .slider-content-02 .btn {height: 60px;line-height: 58px;padding: 0 48px;font-size: 16px;}
    .call-to-action-content .btn {height: 60px;line-height: 58px;padding: 0 48px;font-size: 16px;}
  
  }