/* ====================================
                  Basic
   ==================================== */

html {
  scroll-behavior: smooth;
  width: 100%;
  height: 100%;
}

body {
  font-family: "Noto Sans", sans-serif;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  font-size: 16px;
  color: #666666;
  margin: 0 auto;
  background-image: url("../images/bg-light.png");
  background-repeat: repeat;
  background-position: center;
  background-size: 6%;
}

@media only screen and (max-width: 991px) {
  body {
    background-size: 12%;
  }
}

@media only screen and (max-width: 576px) {
  body {
    background-size: 18%;
  }
}

@media only screen and (max-width: 450px) {
  body {
    background-size: 24%;
  }
}

.siteStyle {

  /* ==== Text ==== */
  h1 {
    font-size: calc(1.375rem + 1.5vw);
  }

  @media only screen and (max-width: 450px) {
    h1 {
      font-size: calc(1.375rem + 1vw);
    }
  }

  h2 {
    font-size: calc(1.325rem + 0.9vw);
  }

  @media only screen and (max-width: 450px) {
    h2 {
      font-size: calc(1.325rem + 0.6vw);
    }
  }

  h3 {
    font-size: calc(1.3rem + 0.6vw);
  }

  @media only screen and (max-width: 450px) {
    h3 {
      font-size: calc(1.3rem + 0.3vw);
    }
  }

  h4 {
    font-size: calc(1.275rem + 0.3vw);
  }

  @media only screen and (max-width: 450px) {
    h4 {
      font-size: calc(1.275rem + 0.2vw);
    }
  }

  h5 {
    font-size: 1.25rem;
  }

  @media only screen and (max-width: 450px) {
    h5 {
      font-size: 1.125rem;
    }
  }

  p {
    line-height: 26px;
  }

  sup {
    color: #B94445;
  }

  .highlight {
    color: #B94445;
  }

  .green {
    color: #10833F;
  }

  .title h2 {
    font-family: "Klee One", cursive;
    color: #3A2A21;
  }

  .title h5 {
    color: #A78837;
    font-weight: 300;
    margin-left: 4px;
    text-transform: uppercase;
  }

  .title-center {
    margin: 0 auto;
    text-align: center;
    padding: 16px 20px !important;
    border-bottom: 1px solid #84746B;
    width: 91.66666667%;
  }

  @media only screen and (max-width: 450px) {
    .title-center {
      padding: 12px 4px !important;
    }
  }

  /* ==== Display ==== */
  .xl-show {
    display: none;
  }

  @media only screen and (max-width: 1200px) {
    .xl-show {
      display: block;
    }
  }

  .xl-hide {
    display: block;
  }

  @media only screen and (max-width: 1200px) {
    .xl-hide {
      display: none;
    }
  }

  .lg-show {
    display: none;
  }

  @media only screen and (max-width: 991px) {
    .lg-show {
      display: block;
    }
  }

  .lg-hide {
    display: block;
  }

  @media only screen and (max-width: 991px) {
    .lg-hide {
      display: none;
    }
  }

  .md-show {
    display: none;
  }

  @media only screen and (max-width: 767.98px) {
    .md-show {
      display: block;
    }
  }

  .md-hide {
    display: block;
  }

  @media only screen and (max-width: 767.98px) {
    .md-hide {
      display: none;
    }
  }

  .sm-show {
    display: none;
  }

  @media only screen and (max-width: 576px) {
    .sm-show {
      display: block;
    }
  }

  .sm-hide {
    display: block;
  }

  @media only screen and (max-width: 576px) {
    .sm-hide {
      display: none;
    }
  }

  .mob-show {
    display: none;
  }

  @media only screen and (max-width: 450px) {
    .mob-show {
      display: block;
    }
  }

  .mob-hide {
    display: block;
  }

  @media only screen and (max-width: 450px) {
    .mob-hide {
      display: none;
    }
  }

  .mob2-show {
    display: none;
  }

  @media only screen and (max-width: 400px) {
    .mob2-show {
      display: block;
    }
  }

  .mob2-hide {
    display: block;
  }

  @media only screen and (max-width: 400px) {
    .mob2-hide {
      display: none;
    }
  }

  .mob3-show {
    display: none;
  }

  @media only screen and (max-width: 350px) {
    .mob3-show {
      display: block;
    }
  }

  .mob3-hide {
    display: block;
  }

  @media only screen and (max-width: 350px) {
    .mob3-hide {
      display: none;
    }
  }

  .row>* {
    padding-right: 20px;
    padding-left: 20px;
  }

  .disabled {
    opacity: 0.6;
  }

  .disabled a {
    cursor: initial;
  }

  /* ==== Back ==== */
  #back {
    display: none;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    padding: 12px 6px;
    background: rgba(255, 255, 255, 0.25);
    border: 1px solid rgba(132, 116, 107, 0.6);
    border-radius: 50px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    color: #775746;
    line-height: 18px;
    z-index: 100;
  }

  #back:hover img,
  #back:active img,
  #back:focus img {
    margin-bottom: 12px;
  }

  @media only screen and (max-width: 576px) {
    #back {
      right: 20px;
      bottom: 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    #back {
      right: 10px;
      bottom: 10px;
    }
  }

  #back img {
    width: 18px;
    margin-bottom: 8px;
  }

  @media only screen and (max-width: 576px) {
    #back img {
      width: 15px;
    }
  }

  #back span {
    font-size: 15px;
  }

  @media only screen and (max-width: 576px) {
    #back span {
      font-size: 14px;
    }
  }

  /* ==== Page ==== */
  .page {
    margin: 0 auto 72px auto;
  }

  @media only screen and (max-width: 1440px) {
    .page {
      margin: 0 auto 56px auto;
    }
  }

  @media only screen and (max-width: 576px) {
    .page {
      margin: 0 auto 36px auto;
    }
  }

  @media only screen and (max-width: 450px) {
    .page {
      margin: 0 auto 24px auto;
    }
  }

  /* ==== Section ==== */
  section {
    margin: 52px auto 72px auto;
  }

  @media only screen and (max-width: 576px) {
    section {
      margin: 44px auto 56px auto;
    }
  }

  @media only screen and (max-width: 450px) {
    section {
      margin: 36px auto 50px auto;
    }
  }

  @media only screen and (max-width: 350px) {
    section {
      margin: 32px auto 48px auto;
    }
  }

  /* ==== a / Button ==== */
  a,
  button {
    text-decoration: none;
    cursor: pointer;
  }

  a:hover,
  button:hover {
    -webkit-filter: brightness(1.05);
    filter: brightness(1.05);
    text-decoration: none;
  }

  a:focus,
  button:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
  }

  a.btn,
  button.btn {
    padding: 4px 10px 4px 12px;
    background: none;
    border-radius: 0;
  }

  a.btn-primary,
  button.btn-primary {
    color: #775746;
    border: 1.25px solid rgba(132, 116, 107, 0.6);
  }

  a.btn-primary:hover,
  a.btn-primary:active,
  a.btn-primary:focus,
  button.btn-primary:hover,
  button.btn-primary:active,
  button.btn-primary:focus {
    color: #fff;
    background: #84746B;
    border: 1.25px solid rgba(132, 116, 107, 0.6);
  }

  a.btn-secodary,
  button.btn-secodary {
    color: #F6E0C6;
    border: 1.25px solid rgba(246, 224, 198, 0.6);
  }

  a.btn-secodary:hover,
  a.btn-secodary:active,
  a.btn-secodary:focus,
  button.btn-secodary:hover,
  button.btn-secodary:active,
  button.btn-secodary:focus {
    color: #775746;
    background: #F6E0C6;
    border: 1.25px solid rgba(246, 224, 198, 0.6);
  }

  a.btn-tertiary,
  button.btn-tertiary {
    padding: 4px 40px;
    background: #775746;
    color: #fff;
    border: 1.25px solid #775746;
  }

  a.btn-tertiary:hover,
  a.btn-tertiary:active,
  a.btn-tertiary:focus,
  button.btn-tertiary:hover,
  button.btn-tertiary:active,
  button.btn-tertiary:focus {
    color: #775746;
    background: rgba(255, 255, 255, 0.3);
    border: 1.25px solid rgba(132, 116, 107, 0.6);
  }

  a.btn-next,
  button.btn-next {
    width: 100%;
    padding: 12px;
    background: #fff;
    color: #9A5D3A;
    border: 1.25px solid rgba(154, 93, 58, 0.6);
  }

  a.btn-next:hover,
  a.btn-next:active,
  a.btn-next:focus,
  button.btn-next:hover,
  button.btn-next:active,
  button.btn-next:focus {
    color: #fff;
    background: #84746B;
    border: 1.25px solid rgba(132, 116, 107, 0.6);
  }

  a.btn-prev,
  button.btn-prev {
    width: 100%;
    color: #9A5D3A;
    border: 1.25px solid rgba(154, 93, 58, 0.6);
    padding: 12px;
  }

  a.btn-prev:hover,
  a.btn-prev:active,
  a.btn-prev:focus,
  button.btn-prev:hover,
  button.btn-prev:active,
  button.btn-prev:focus {
    background: rgba(255, 255, 255, 0.3);
    color: #9A5D3A;
    border: 1.25px solid rgba(154, 93, 58, 0.6);
  }

  a.btn-line,
  button.btn-line {
    width: 100%;
    background: #08BF5B;
    color: #fff;
    border: none;
    padding: 8px 12px;
  }

  a.btn-line:hover,
  a.btn-line:active,
  a.btn-line:focus,
  button.btn-line:hover,
  button.btn-line:active,
  button.btn-line:focus {
    -webkit-filter: brightness(1);
    filter: brightness(1);
  }

  /* ==== Modal ==== */
  .modal {
    --bs-modal-width: 100%;
    overflow-y: hidden;
  }

  .modal .modal-dialog {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    width: 50%;
  }

  @media only screen and (max-width: 991px) {
    .modal .modal-dialog {
      width: 70%;
    }
  }

  @media only screen and (max-width: 576px) {
    .modal .modal-dialog {
      width: 90%;
    }
  }

  @media only screen and (max-width: 450px) {
    .modal .modal-dialog {
      width: 95%;
    }
  }

  .modal .modal-dialog .modal-content {
    border: none;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.9);
    border: 1.5px solid #84746B;
  }

  .modal .modal-dialog .modal-content .modal-header {
    text-align: center;
    display: block;
    position: relative;
    letter-spacing: 1px;
    border-bottom: none;
    padding: 0;
  }

  .modal .modal-dialog .modal-content .modal-header .btn-close {
    background: #fff;
    color: #84746B;
    opacity: 1;
    position: absolute;
    right: -8px;
    top: -8px;
    padding: 0;
    margin: 0;
    width: 24px;
    height: 24px;
    border: 1.5px solid #84746B;
    border-radius: 0;
    z-index: 1;
  }

  .modal .modal-dialog .modal-content .modal-header .btn-close:hover {
    color: #84746B;
  }

  .modal .modal-dialog .modal-content .modal-body {
    text-align: center;
    padding: 20px;
    color: #666666;
  }

  .modal .modal-dialog .modal-content .modal-footer {
    border-top: none;
  }

  .modal .modal-dialog .modal-content .modal-footer .btn {
    width: 100%;
    padding: 8px 12px;
  }

  .modal-image .modal-dialog {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  @media only screen and (max-width: 576px) {
    .modal-image .modal-dialog {
      width: 95%;
    }
  }

  .modal-image .modal-dialog .modal-body img {
    width: 100%;
  }

  .modal-login .modal-dialog .modal-body h5 {
    color: #333333;
  }

  .modal-login .modal-dialog .modal-body p {
    margin-bottom: 0;
  }

  .modal-del p {
    margin-bottom: 0;
  }

  .modal-coupon .modal-dialog .modal-header {
    padding: 20px !important;
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-header .input-group {
      display: block;
    }
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-header .input-group input {
      width: 100%;
      margin-left: -0.5px;
    }
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-header .input-group button {
      width: 100%;
    }
  }

  .modal-coupon .modal-dialog .modal-body {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    max-height: 50vh;
    overflow-y: auto;
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body {
      padding: 8px 12px !important;
    }
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check {
      display: -ms-grid;
      display: grid;
      padding-left: 0;
    }
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check input {
      text-align: center;
      margin: 0 auto 8px auto;
    }
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon {
    width: 300px;
    padding: 12px 0 8px 0;
    position: relative;
    border: 1px solid rgba(119, 87, 70, 0.2);
    border-radius: 16px;
    overflow: hidden;
    text-align: left;
  }

  @media only screen and (max-width: 1200px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon {
      margin: 0 auto;
    }
  }

  @media only screen and (max-width: 991px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon {
      margin: 0;
    }
  }

  @media (max-width: 680px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon {
      margin: 0 auto;
    }
  }

  @media only screen and (max-width: 450px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon {
      width: 280px;
    }
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon {
      width: 260px;
    }
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon span {
    background: rgba(119, 87, 70, 0.2);
    color: #666666;
    padding: 2px 12px;
    border-radius: 50px;
    font-size: 90%;
    font-weight: 300;
    margin: 0 0 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon span {
      font-size: 85%;
    }
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon h4 {
    color: #333333;
    margin: 16px auto;
    position: relative;
    z-index: 1;
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon .deco {
    position: absolute;
    right: 4px;
    bottom: 36px;
    width: 40px;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon .deco {
      width: 30px;
    }
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon small {
    color: #666666;
    border-top: 1px dashed rgba(119, 87, 70, 0.4);
    width: 100%;
    display: block;
    padding: 4px 12px 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    .modal-coupon .modal-dialog .modal-body .form-check .coupon small {
      font-size: 85%;
      padding: 2px 12px 0 12px;
    }
  }

  .modal-coupon .modal-dialog .modal-body .form-check .coupon .bg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    display: block;
    z-index: 0;
  }

  .modal-privacy .modal-dialog {
    width: 70%;
    margin: 40px auto;
  }

  @media only screen and (max-width: 991px) {
    .modal-privacy .modal-dialog {
      width: 80%;
      margin: 30px auto;
    }
  }

  @media only screen and (max-width: 576px) {
    .modal-privacy .modal-dialog {
      width: 90%;
      margin: 20px auto;
    }
  }

  @media only screen and (max-width: 450px) {
    .modal-privacy .modal-dialog {
      width: 95%;
      margin: 10px auto;
    }
  }

  .modal-privacy .modal-dialog .modal-header {
    padding: 20px !important;
  }

  .modal-privacy .modal-dialog .modal-body {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    max-height: 70vh;
    overflow-y: auto;
    text-align: left !important;
  }

  @media only screen and (max-width: 350px) {
    .modal-privacy .modal-dialog .modal-body {
      padding: 8px 12px !important;
    }
  }

  .modal-privacy .modal-dialog .modal-body h4 {
    font-weight: bold;
    color: #333333;
  }

  .modal-privacy .modal-dialog .modal-body li,
  .modal-privacy .modal-dialog .modal-body p {
    line-height: 32px;
  }

  /* ==== Tag ==== */
  .tag {
    color: #fff;
    border-radius: 3px;
    padding: 4px 6px 4px 8px;
    margin-left: 14px;
    font-size: 80%;
  }

  @media only screen and (max-width: 1200px) {
    .tag {
      padding: 3px 5px 3px 7px;
      font-size: 70%;
    }
  }

  @media only screen and (max-width: 991px) {
    .tag {
      padding: 4px 6px 4px 8px;
      font-size: 80%;
    }
  }

  @media only screen and (max-width: 350px) {
    .tag {
      padding: 3px 5px 3px 7px;
      font-size: 70%;
    }
  }

  .tag::before {
    content: "";
    border-top: 13px solid transparent;
    border-bottom: 12px solid transparent;
    margin: 0px 0 -7.5px -21px;
    display: inline-block;
  }

  @media only screen and (max-width: 1200px) {
    .tag::before {
      border-top: 10px solid transparent;
      border-bottom: 11px solid transparent;
      margin: 0px 0 -6.2px -20px;
    }
  }

  @media only screen and (max-width: 991px) {
    .tag::before {
      border-top: 13px solid transparent;
      border-bottom: 12px solid transparent;
      margin: 0px 0 -7.5px -21px;
    }
  }

  @media only screen and (max-width: 350px) {
    .tag::before {
      border-top: 10px solid transparent;
      border-bottom: 11px solid transparent;
      margin: 0px 0 -6.2px -20px;
    }
  }

  .tag-all {
    background: #383838;
  }

  .tag-all::before {
    border-right: 14px solid #383838;
  }

  .tag-new {
    background: #9A5D3A;
  }

  .tag-new::before {
    border-right: 14px solid #9A5D3A;
  }

  .tag-notice {
    background: #B94445;
  }

  .tag-notice::before {
    border-right: 14px solid #B94445;
  }

  .tag-activity {
    background: #B5952C;
  }

  .tag-activity::before {
    border-right: 14px solid #B5952C;
  }

  /* ==== Pagination ==== */
  .pagination-nav {
    margin: 52px auto 0 auto;
    justify-items: center;
  }

  @media only screen and (max-width: 576px) {
    .pagination-nav {
      margin: 32px auto 0 auto;
    }
  }

  .pagination-nav .pagination {
    --bs-pagination-bg: none;
    --bs-pagination-active-bg: none;
    --bs-pagination-border-width: 0;
  }

  .pagination-nav .pagination .page-link {
    color: #B2B2B2;
    font-size: 20px;
    padding: 4px 16px;
  }

  .pagination-nav .pagination .page-link.active {
    color: #84746B;
  }

  .pagination-nav .pagination .page-link:hover,
  .pagination-nav .pagination .page-link:active,
  .pagination-nav .pagination .page-link:focus {
    background: none;
    color: #84746B;
  }

  .pagination-nav .pagination .page-link .material-symbols-outlined {
    vertical-align: middle;
  }

  /* ==== Submenu ==== */
  @media only screen and (max-width: 991px) {
    .sticky-submenu {
      padding: 0 8px;
    }
  }

  .sticky-submenu .submenu-wrapper {
    padding: 12px 15px 0 0;
  }

  @media only screen and (max-width: 1440px) {
    .sticky-submenu .submenu-wrapper {
      padding: 12px 0 0 0;
    }
  }

  @media only screen and (max-width: 991px) {
    .sticky-submenu .submenu-wrapper {
      padding: 0;
      width: 100%;
      white-space: nowrap;
      overflow-x: auto;
      margin-bottom: 32px;
    }
  }

  @media only screen and (max-width: 576px) {
    .sticky-submenu .submenu-wrapper {
      margin-bottom: 24px;
    }
  }

  .sticky-submenu .submenu-wrapper .submenu {
    list-style: none;
    margin: 0;
    border-radius: 0;
  }

  @media only screen and (max-width: 991px) {
    .sticky-submenu .submenu-wrapper .submenu {
      text-align: center;
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      padding: 20px 0;
    }
  }

  @media only screen and (max-width: 767.98px) {
    .sticky-submenu .submenu-wrapper .submenu {
      padding: 10px 0;
    }
  }

  @media only screen and (max-width: 450px) {
    .sticky-submenu .submenu-wrapper .submenu {
      padding: 5px 0;
    }
  }

  .sticky-submenu .submenu-wrapper .submenu a.list-group-item {
    color: #775746;
    font-weight: 300;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 0;
    border-top: 1px solid rgba(119, 87, 70, 0.4);
    border-right: 1px solid rgba(119, 87, 70, 0.4);
    border-left: 1px solid rgba(119, 87, 70, 0.4);
    border-bottom: none;
    padding: 16px;
  }

  @media only screen and (max-width: 1440px) {
    .sticky-submenu .submenu-wrapper .submenu a.list-group-item {
      padding: 12px 10px;
    }
  }

  @media only screen and (max-width: 991px) {
    .sticky-submenu .submenu-wrapper .submenu a.list-group-item {
      width: 150px;
      margin: 0 8px;
      border: 1px solid rgba(119, 87, 70, 0.4);
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding: 8px;
    }
  }

  @media only screen and (max-width: 991px) {
    .sticky-submenu .submenu-wrapper .submenu a.list-group-item:first-of-type {
      margin: 0 8px 0 0;
    }
  }

  .sticky-submenu .submenu-wrapper .submenu a.list-group-item:last-of-type {
    border-bottom: 1px solid rgba(119, 87, 70, 0.4);
  }

  .sticky-submenu .submenu-wrapper .submenu a.list-group-item.active {
    color: #fff;
    background: rgba(119, 87, 70, 0.6);
    border: none;
  }

  .sticky-submenu .submenu-wrapper .submenu a.list-group-item:hover,
  .sticky-submenu .submenu-wrapper .submenu a.list-group-item:active,
  .sticky-submenu .submenu-wrapper .submenu a.list-group-item:focus {
    color: #fff;
    background: rgba(119, 87, 70, 0.6);
  }

  .sticky-submenu .submenu-wrapper .submenu a.list-group-item h6 {
    margin-bottom: 0;
    font-weight: 400;
  }

  @media only screen and (max-width: 991px) {
    .sticky-submenu .submenu-wrapper .submenu a.list-group-item h6 {
      font-size: 90%;
    }
  }

  /* ==== Tab ==== */
  .tab .nav-tabs {
    border-bottom: 1px solid rgba(119, 87, 70, 0.4);
  }

  .tab .nav-tabs .nav-link {
    background: none;
    color: #666666;
    padding: 8px 20px;
    margin: 0 12px;
    border-radius: 0;
    border: none;
  }

  .tab .nav-tabs .nav-link:first-of-type {
    margin: 0 12px 0 0;
  }

  @media only screen and (max-width: 450px) {
    .tab .nav-tabs .nav-link:first-of-type {
      margin: 0 8px 0 0;
    }
  }

  @media only screen and (max-width: 350px) {
    .tab .nav-tabs .nav-link:first-of-type {
      margin: 0 4px 0 0;
    }
  }

  .tab .nav-tabs .nav-link.active {
    background: none;
    color: #333333;
    border-bottom: 1.5px solid rgba(119, 87, 70, 0.4);
  }

  @media only screen and (max-width: 450px) {
    .tab .nav-tabs .nav-link {
      margin: 0 8px;
      font-size: 90%;
    }
  }

  @media only screen and (max-width: 350px) {
    .tab .nav-tabs .nav-link {
      margin: 0 4px;
    }
  }

  /* ==== Steps ==== */
  .steps {
    padding-bottom: 32px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
  }

  .steps .block {
    opacity: 0.5;
    width: 31%;
    padding: 0 8px;
  }

  .steps .block.active,
  .steps .block.visited {
    opacity: 1;
  }

  .steps .block.active span,
  .steps .block.visited span {
    background: #9A5D3A;
  }

  .steps .block span {
    background: #775746;
    color: #fff;
    width: 18px;
    height: 18px;
    border-radius: 50px;
    font-size: 80%;
    padding: 2px 7.09px;
  }

  .steps .block small {
    color: #333333;
  }

  @media only screen and (max-width: 350px) {
    .steps .block small {
      font-size: 75%;
    }
  }

  .steps .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
    color: #775746;
    opacity: 0.5;
    width: 3%;
    padding: 0;
  }

  @media only screen and (max-width: 450px) {
    .steps .material-symbols-outlined {
      font-size: 22px;
    }
  }

  @media only screen and (max-width: 350px) {
    .steps .material-symbols-outlined {
      font-size: 20px;
    }
  }

  /* ==== Form ==== */
  form label {
    color: #333333;
    font-size: 90%;
  }

  form input,
  form textarea {
    border: 1px solid #775746 !important;
    color: #666666 !important;
    padding: 8px 10px !important;
    border-radius: 0 !important;
  }

  form input:focus,
  form textarea:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
  }

  form input::-webkit-input-placeholder,
  form textarea::-webkit-input-placeholder {
    color: #848484 !important;
  }

  form input::-moz-placeholder,
  form textarea::-moz-placeholder {
    color: #848484 !important;
  }

  form input:-ms-input-placeholder,
  form textarea:-ms-input-placeholder {
    color: #848484 !important;
  }

  form input::-ms-input-placeholder,
  form textarea::-ms-input-placeholder {
    color: #848484 !important;
  }

  form input::placeholder,
  form textarea::placeholder {
    color: #848484 !important;
  }

  form .form-select {
    border: none !important;
    border-radius: 0;
    color: #666666;
    background: rgba(255, 255, 255, 0.43);
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23333'%3e%3cpath stroke='none' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: 95% 50%;
    padding: 8px 28px 8px 10px !important;
  }

  form .form-select:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
  }

  form .form-select:disabled {
    background-color: rgba(255, 255, 255, 0.43);
    cursor: initial;
  }

  form .form-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto 16px auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  form .form-check .form-check-input {
    padding: 0 !important;
    margin-top: 0;
    border: 1px solid #9A5D3A !important;
    margin-right: 12px;
    background-color: rgba(255, 255, 255, 0.43);
  }

  form .form-check .form-check-input[type=radio] {
    border-radius: 50px !important;
    background-color: transparent;
  }

  form .form-check .form-check-input[type=radio]:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%239A5D3A'/%3e%3c/svg%3e");
  }

  form .form-check .form-check-input[type=checkbox]:checked {
    background-color: #9A5D3A !important;
  }

  form button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  form .form-grid .input-item {
    padding: 8px 12px;
  }

  @media only screen and (max-width: 450px) {
    form .form-grid .input-item {
      padding: 6px 10px;
    }
  }

  form .form-grid .input-item input {
    background: rgba(255, 255, 255, 0.43);
    border: none !important;
  }

  form .radio-grid .radio-item {
    padding: 8px 12px;
  }

  @media only screen and (max-width: 450px) {
    form .radio-grid .radio-item {
      padding: 6px 10px;
    }
  }

  form .radio-grid .radio-item .inner {
    background: rgba(255, 255, 255, 0.43);
    border: 1px solid rgba(132, 116, 107, 0.2);
    padding: 8px 10px;
  }

  form .radio-grid .radio-item .inner:has(.form-check-input[type=radio]:checked) {
    border: 1px solid #9A5D3A;
  }

  form .radio-grid .radio-item .inner .form-check {
    margin: 0;
  }

  form .radio-grid .radio-item .inner .form-check label {
    font-size: 100%;
  }

  /* ====================================
                   Header
     ==================================== */
  header {
    z-index: 100;
    width: 100%;
    text-align: center;
    position: relative;
  }

  header .head-logo {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: inline-block;
    margin: 40px auto 20px auto;
  }

  @media only screen and (max-width: 450px) {
    header .head-logo {
      margin: 20px auto;
    }
  }

  header .head-logo img {
    width: 130px;
  }

  header .head-logo img:hover {
    opacity: 0.85;
  }

  @media only screen and (max-width: 450px) {
    header .head-logo img {
      width: 100px;
    }
  }

  header nav {
    margin: 0 auto;
    padding: 0 20px !important;
    border-top: 1px solid #84746B;
    border-bottom: 1px solid #84746B;
    background: none;
    width: 91.66666667%;
  }

  @media only screen and (max-width: 991px) {
    header nav {
      padding: 8px 20px !important;
    }
  }

  @media only screen and (max-width: 450px) {
    header nav {
      padding: 0 4px !important;
    }
  }

  header nav .container-fluid {
    padding: 0;
  }

  header nav .container-fluid .navbar-toggler {
    border: none;
    padding: 0.25rem 0;
  }

  header nav .container-fluid .navbar-toggler .navbar-toggler-icon {
    width: 1.15em;
    height: 1.15em;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28119, 87, 70, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1.5' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }

  header nav .container-fluid .navbar-collapse {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item {
    text-align: center;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
    color: #775746;
    padding: 12px 24px;
  }

  @media only screen and (max-width: 1440px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
      padding: 12px 12px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
      padding: 12px 8px;
      font-size: 15px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
      font-size: 16px;
      padding: 8px;
    }
  }

  @media only screen and (max-width: 450px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
      padding: 8px 6px;
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link:hover {
    color: #9A5D3A;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active {
    color: #9A5D3A;
    border-top: 2px solid #9A5D3A;
    border-bottom: 2px solid #9A5D3A;
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active {
      border-top: none;
      border-bottom: none;
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active:hover .material-symbols-outlined {
    top: 25px;
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active:hover .material-symbols-outlined {
      top: 21px;
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active .material-symbols-outlined {
    top: 27px;
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.active .material-symbols-outlined {
      top: 21px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.dropdown-toggle {
      padding: 12px 16px 12px 8px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.dropdown-toggle {
      padding: 8px 20px 8px 18px;
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link.dropdown-toggle::after {
    display: none;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link .material-symbols-outlined {
    font-size: 20px;
    line-height: 0;
    top: 25px;
    position: absolute;
  }

  @media only screen and (max-width: 1440px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link .material-symbols-outlined {
      font-size: 18px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link .material-symbols-outlined {
      font-size: 16px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link .material-symbols-outlined {
      font-size: 20px;
      top: 21px;
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu {
    background: #eeeee7;
    border: 1px solid rgba(119, 87, 70, 0.4);
    border-radius: 0;
    padding: 0;
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu {
      background: rgba(255, 255, 255, 0.3);
    }
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu .dropdown-item {
    color: #775746;
    padding: 6px 16px;
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu .dropdown-item:hover {
    color: #fff;
    background: rgba(119, 87, 70, 0.6);
  }

  header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu[data-bs-popper] {
    margin-top: 8px;
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .navbar-collapse .navbar-nav .nav-item .dropdown-menu[data-bs-popper] {
      margin-top: 2px;
    }
  }

  header nav .container-fluid .icon-group {
    position: absolute;
    right: 20px;
  }

  @media only screen and (max-width: 1440px) {
    header nav .container-fluid .icon-group {
      right: 12px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .icon-group {
      right: 4px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .icon-group {
      right: 20px;
      top: 12px;
    }
  }

  @media only screen and (max-width: 450px) {
    header nav .container-fluid .icon-group {
      right: 4px;
      top: 4px;
    }
  }

  header nav .container-fluid .icon-group .icon-pack {
    padding: 0 8px;
    color: #775746;
    font-size: 15px;
  }

  @media only screen and (max-width: 1440px) {
    header nav .container-fluid .icon-group .icon-pack {
      padding: 0 4px;
      font-size: 14px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .icon-group .icon-pack {
      padding: 0 2px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .icon-group .icon-pack {
      font-size: 15px;
      padding: 0 8px;
    }
  }

  @media only screen and (max-width: 450px) {
    header nav .container-fluid .icon-group .icon-pack {
      padding: 0 4px;
    }
  }

  header nav .container-fluid .icon-group .icon-pack:not(:last-child) {
    border-right: 1px solid rgba(119, 87, 70, 0.4);
  }

  header nav .container-fluid .icon-group .icon-pack:hover,
  header nav .container-fluid .icon-group .icon-pack.active {
    color: #9A5D3A;
  }

  header nav .container-fluid .icon-group .icon-pack:hover img.normal,
  header nav .container-fluid .icon-group .icon-pack.active img.normal {
    display: none;
  }

  header nav .container-fluid .icon-group .icon-pack:hover img.hover,
  header nav .container-fluid .icon-group .icon-pack.active img.hover {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }

  header nav .container-fluid .icon-group .icon-pack img {
    width: 20px;
  }

  @media only screen and (max-width: 1440px) {
    header nav .container-fluid .icon-group .icon-pack img {
      width: 18px;
    }
  }

  @media only screen and (max-width: 1200px) {
    header nav .container-fluid .icon-group .icon-pack img {
      width: 16px;
    }
  }

  @media only screen and (max-width: 991px) {
    header nav .container-fluid .icon-group .icon-pack img {
      width: 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    header nav .container-fluid .icon-group .icon-pack img {
      width: 18px;
    }
  }

  header nav .container-fluid .icon-group .icon-pack img.normal {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }

  header nav .container-fluid .icon-group .icon-pack img.hover {
    display: none;
  }

  header nav .container-fluid .icon-group .icon-pack span {
    font-size: 70%;
    background: #9A5D3A;
    border-radius: 50%;
    color: #fff;
    width: 15px;
    height: 15px;
    line-height: 1px;
    display: inline-block;
    vertical-align: middle;
    -ms-flex-line-pack: center;
    align-content: center;
  }

  /* ====================================
                   Index
     ==================================== */
  #index {
    margin: 0 auto 160px auto;
  }

  @media only screen and (max-width: 1440px) {
    #index {
      margin: 0 auto 140px auto;
    }
  }

  @media only screen and (max-width: 576px) {
    #index {
      margin: 0 auto 100px auto;
    }
  }

  @media only screen and (max-width: 450px) {
    #index {
      margin: 0 auto 88px auto;
    }
  }

  #index .banner {
    margin-top: 0;
  }

  #index .banner .carousel-indicators {
    margin-bottom: -32px;
  }

  #index .banner .carousel-indicators.active {
    opacity: 1;
  }

  @media only screen and (max-width: 450px) {
    #index .banner .carousel-indicators {
      margin-bottom: -28px;
    }
  }

  @media only screen and (max-width: 350px) {
    #index .banner .carousel-indicators {
      margin-bottom: -24px;
    }
  }

  #index .banner .carousel-indicators [data-bs-target] {
    background-color: #84746B;
    width: 40px;
    margin: 0 6px;
  }

  @media only screen and (max-width: 576px) {
    #index .banner .carousel-indicators [data-bs-target] {
      width: 35px;
      margin: 0 4px;
    }
  }

  @media only screen and (max-width: 450px) {
    #index .banner .carousel-indicators [data-bs-target] {
      width: 30px;
    }
  }

  #index .banner .carousel-control-next,
  #index .banner .carousel-control-prev {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    opacity: 0.6;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
  }

  #index .banner .carousel-control-next:hover,
  #index .banner .carousel-control-prev:hover {
    opacity: 1;
  }

  #index .banner .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    margin-left: 16px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 576px) {
    #index .banner .carousel-control-prev-icon {
      margin-left: 12px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 450px) {
    #index .banner .carousel-control-prev-icon {
      margin-left: 8px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 350px) {
    #index .banner .carousel-control-prev-icon {
      margin-left: 4px;
      width: 25px;
      height: 25px;
    }
  }

  #index .banner .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    margin-right: 16px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 576px) {
    #index .banner .carousel-control-next-icon {
      margin-right: 12px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 450px) {
    #index .banner .carousel-control-next-icon {
      margin-right: 8px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 350px) {
    #index .banner .carousel-control-next-icon {
      margin-right: 4px;
      width: 25px;
      height: 25px;
    }
  }

  #index .news {
    position: relative;
  }

  #index .news .title {
    padding-right: 0;
  }

  @media only screen and (max-width: 991px) {
    #index .news .title {
      padding-right: 20px;
      text-align: center;
    }
  }

  #index .news .title h5 {
    margin-bottom: 72px;
  }

  @media only screen and (max-width: 991px) {
    #index .news .title h5 {
      margin-bottom: 20px;
    }
  }

  #index .news .title a {
    margin-left: 6px;
  }

  @media only screen and (max-width: 991px) {
    #index .news .title a {
      float: right;
      margin-left: 0;
    }
  }

  #index .news .content {
    padding-left: 0;
  }

  @media only screen and (max-width: 991px) {
    #index .news .content {
      padding-left: 20px;
      margin-top: 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    #index .news .content {
      padding: 0 16px;
    }
  }

  #index .news .content .card {
    background: none;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid rgba(132, 116, 107, 0.32);
    padding: 20px 0;
  }

  #index .news .content .card:last-of-type {
    border-bottom: none;
  }

  #index .news .content .card .card-body {
    padding: 12px 0 12px 40px;
  }

  @media only screen and (max-width: 1440px) {
    #index .news .content .card .card-body {
      padding: 0 0 0 32px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #index .news .content .card .card-body {
      padding: 0 0 0 28px;
    }
  }

  @media only screen and (max-width: 576px) {
    #index .news .content .card .card-body {
      padding: 0 0 0 16px;
    }
  }

  @media only screen and (max-width: 350px) {
    #index .news .content .card .card-body {
      padding: 0 0 0 10px;
    }
  }

  #index .news .content .card .card-body .card-title {
    color: #775746;
    font-weight: 300;
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  @media only screen and (max-width: 576px) {
    #index .news .content .card .card-body .card-title {
      margin-bottom: 12px;
    }
  }

  #index .news .content .card .card-body .card-text {
    color: #666666;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  @media only screen and (max-width: 1440px) {
    #index .news .content .card .card-body .card-text {
      -webkit-line-clamp: 2;
    }
  }

  @media only screen and (max-width: 991px) {
    #index .news .content .card .card-body .card-text {
      -webkit-line-clamp: 3;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #index .news .content .card .card-body .card-text {
      -webkit-line-clamp: 2;
    }
  }

  @media only screen and (max-width: 576px) {
    #index .news .content .card .card-body .card-text {
      margin-bottom: 12px;
    }
  }

  #index .news .content .card .card-body small {
    color: #848484;
    font-size: 85%;
  }

  @media only screen and (max-width: 1200px) {
    #index .news .content .card .card-body small {
      font-size: 76%;
    }
  }

  @media only screen and (max-width: 991px) {
    #index .news .content .card .card-body small {
      font-size: 85%;
    }
  }

  #index .news .deco {
    position: absolute;
    right: -250px;
    bottom: 0;
    width: 260px;
  }

  @media only screen and (max-width: 1440px) {
    #index .news .deco {
      right: -200px;
      width: 220px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #index .news .deco {
      right: -170px;
      width: 180px;
    }
  }

  @media only screen and (max-width: 991px) {
    #index .news .deco {
      right: -100px;
      width: 145px;
      bottom: -30px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #index .news .deco {
      display: none;
    }
  }

  #index .order {
    background-image: url("../images/bg-dark.png");
    background-repeat: repeat;
    background-position: center;
    background-size: 2%;
  }

  @media only screen and (max-width: 991px) {
    #index .order {
      background-size: 4%;
    }
  }

  @media only screen and (max-width: 576px) {
    #index .order {
      background-size: 6%;
    }
  }

  @media only screen and (max-width: 450px) {
    #index .order {
      background-size: 8%;
    }
  }

  #index .order .row {
    padding: 60px 0;
  }

  @media only screen and (max-width: 991px) {
    #index .order .row {
      padding: 40px 0 28px 0;
    }
  }

  #index .order .row .title {
    padding-right: 0;
  }

  @media only screen and (max-width: 991px) {
    #index .order .row .title {
      padding-right: 20px;
      text-align: center;
    }
  }

  #index .order .row .title h2 {
    color: #fff;
  }

  #index .order .row .title h5 {
    margin-bottom: 72px;
  }

  @media only screen and (max-width: 991px) {
    #index .order .row .title h5 {
      margin-bottom: 20px;
    }
  }

  #index .order .row .title a {
    margin-left: 6px;
  }

  @media only screen and (max-width: 991px) {
    #index .order .row .title a {
      float: right;
      margin-left: 0;
    }
  }

  #index .order .row .content {
    padding: 0 0 0 12px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  @media only screen and (max-width: 991px) {
    #index .order .row .content {
      padding: 0;
      margin: 20px auto 0 auto;
    }
  }

  #index .order .row .content .card {
    padding: 0 12px;
    background: none;
    border: none;
  }

  #index .order .row .content .card:hover .card-title,
  #index .order .row .content .card:active .card-title,
  #index .order .row .content .card:focus .card-title {
    padding: 0;
  }

  @media only screen and (max-width: 1200px) {
    #index .order .row .content .card {
      padding: 0 8px;
    }
  }

  @media only screen and (max-width: 991px) {
    #index .order .row .content .card {
      padding: 8px;
    }
  }

  #index .order .row .content .card img {
    padding: 8px;
    border: 1px solid rgba(246, 224, 198, 0.4);
  }

  #index .order .row .content .card .card-title {
    margin: 20px 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 8px;
  }

  #index .order .row .content .card .card-title h6 {
    color: #fff;
    font-weight: 300;
    margin-bottom: 0;
  }

  #index .order .row .content .card .card-title img {
    padding: 0;
    border: none;
  }

  @media only screen and (max-width: 450px) {
    #index .order .row .content .card .card-title img {
      width: 18px;
    }
  }

  #index .produce .row .title {
    padding-right: 0;
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .title {
      padding-right: 20px;
      text-align: center;
    }
  }

  #index .produce .row .title h5 {
    margin-bottom: 72px;
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .title h5 {
      margin-bottom: 20px;
    }
  }

  #index .produce .row .title ul {
    padding-left: 22px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .title ul {
      margin: 0 auto;
      padding-left: 0;
      text-align: center;
    }
  }

  #index .produce .row .title ul span {
    margin-left: -18px;
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .title ul span {
      margin-left: 0;
    }
  }

  #index .produce .row .title ul li {
    list-style: auto;
    line-height: 32px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .title ul li {
      margin-left: 38px;
    }
  }

  #index .produce .row .content {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    padding-top: 44.25%;
  }

  #index .produce .row .content::after {
    content: "";
    display: block;
    position: absolute;
    top: 40px;
    left: 60px;
    width: calc(100% - 1vw);
    height: 100%;
    background: #D7CEBD;
    z-index: -1;
  }

  @media only screen and (max-width: 576px) {
    #index .produce .row .content::after {
      top: 20px;
      left: 40px;
    }
  }

  @media only screen and (max-width: 991px) {
    #index .produce .row .content {
      padding-top: 59.25%;
      margin: 20px auto 0 auto;
    }
  }

  #index .produce .row .content iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  /* ====================================
                   About
     ==================================== */
  #about .about {
    color: #666666;
    text-align: center;
  }

  #about .about span {
    color: #9A5D3A;
  }

  #about .intro .list {
    margin: 40px auto 72px auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  @media only screen and (max-width: 576px) {
    #about .intro .list {
      margin: 40px auto 48px auto;
    }
  }

  #about .intro .list:nth-child(2) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }

  #about .intro .list:nth-child(2) .content {
    padding-left: 18%;
    padding-right: 40px;
  }

  @media only screen and (max-width: 991px) {
    #about .intro .list:nth-child(2) .content {
      padding: 0;
      margin-top: 20px;
    }
  }

  #about .intro .list:nth-child(2) .content p:last-of-type {
    margin-bottom: 0;
  }

  #about .intro .list .image {
    padding: 0;
  }

  #about .intro .list .image img {
    width: 100%;
  }

  #about .intro .list .content {
    padding-right: 18%;
    padding-left: 40px;
  }

  @media only screen and (max-width: 991px) {
    #about .intro .list .content {
      padding: 0;
      margin-top: 20px;
    }
  }

  #about .intro .list .content .subtitle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
  }

  #about .intro .list .content .subtitle h1 {
    color: #3A2A21;
    opacity: 0.24;
    font-weight: 400;
    font-style: italic;
    margin-right: 8px;
  }

  #about .intro .list .content .subtitle h4 {
    color: #3A2A21;
  }

  #about .intro .list .content p {
    text-align: left;
    margin-left: 36px;
  }

  @media only screen and (max-width: 1370px) {
    #about .intro .list .content p {
      margin-left: 32px;
    }
  }

  @media only screen and (max-width: 991px) {
    #about .intro .list .content p {
      margin-left: 28px;
    }
  }

  @media only screen and (max-width: 576px) {
    #about .intro .list .content p {
      margin-left: 24px;
    }
  }

  #about .intro .list .content p span {
    color: #9A5D3A;
  }

  #about .intro .list .content p small {
    color: #848484;
  }

  #about .intro .list .content .img-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 32px;
  }

  @media only screen and (max-width: 1370px) {
    #about .intro .list .content .img-group {
      margin-left: 28px;
    }
  }

  @media only screen and (max-width: 991px) {
    #about .intro .list .content .img-group {
      margin-left: 24px;
    }
  }

  @media only screen and (max-width: 576px) {
    #about .intro .list .content .img-group {
      margin-left: 20px;
    }
  }

  #about .intro .list .content .img-group a {
    padding: 0 4px;
  }

  #about .intro .list .content .img-group a img {
    width: 100%;
  }

  #about .information {
    text-align: center;
  }

  #about .information h1 {
    color: #3A2A21;
    opacity: 0.24;
    font-weight: 400;
    font-style: italic;
  }

  #about .information h4 {
    color: #3A2A21;
  }

  #about .information h5 {
    margin: 40px auto 20px auto;
    color: #9A5D3A;
    font-weight: 300;
  }

  @media only screen and (max-width: 576px) {
    #about .information h5 {
      margin: 28px auto 20px auto;
    }
  }

  #about .information p {
    color: #666666;
  }

  @media only screen and (max-width: 576px) {
    #about .information p {
      margin-bottom: 8px;
    }
  }

  #about .information a {
    color: #666666;
    text-decoration: underline;
  }

  #about .information .row {
    margin: 40px auto 0 auto;
  }

  @media only screen and (max-width: 576px) {
    #about .information .row {
      margin: 20px auto 0 auto;
    }
  }

  #about .information .row .item {
    padding: 0;
  }

  @media only screen and (max-width: 1440px) {
    #about .information .row .item:last-of-type {
      padding-left: 12px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #about .information .row .item:last-of-type {
      padding-left: 0;
    }
  }

  #about .information .row .item .image {
    padding: 0;
    width: 40%;
  }

  @media only screen and (max-width: 1650px) {
    #about .information .row .item .image {
      width: 45%;
    }
  }

  @media only screen and (max-width: 1440px) {
    #about .information .row .item .image {
      width: 55%;
    }
  }

  @media only screen and (max-width: 1200px) {
    #about .information .row .item .image {
      width: 40%;
    }
  }

  @media only screen and (max-width: 660px) {
    #about .information .row .item .image {
      width: 45%;
    }
  }

  @media only screen and (max-width: 576px) {
    #about .information .row .item .image {
      width: 80%;
      margin: 0 auto;
    }
  }

  #about .information .row .item .content {
    text-align: left;
    padding-right: 0;
    width: 60%;
  }

  @media only screen and (max-width: 1650px) {
    #about .information .row .item .content {
      width: 55%;
    }
  }

  @media only screen and (max-width: 1440px) {
    #about .information .row .item .content {
      width: 45%;
      padding-left: 12px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #about .information .row .item .content {
      width: 60%;
      padding-left: 20px;
    }
  }

  @media only screen and (max-width: 660px) {
    #about .information .row .item .content {
      width: 55%;
    }
  }

  @media only screen and (max-width: 576px) {
    #about .information .row .item .content {
      width: 100%;
      text-align: center;
      padding: 0;
    }
  }

  #about .information .row .item .content h4 {
    margin-bottom: 20px;
  }

  @media only screen and (max-width: 576px) {
    #about .information .row .item .content h4 {
      margin-top: 20px;
    }
  }

  #about .information .row .item .content .list:last-of-type .icon-group .material-symbols-outlined {
    font-variation-settings: "FILL" 0;
  }

  #about .information .row .item .content .list .icon-group {
    color: #666666;
    font-size: 80%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;
    padding: 2px 0;
  }

  @media only screen and (max-width: 576px) {
    #about .information .row .item .content .list .icon-group {
      width: 100%;
    }
  }

  #about .information .row .item .content .list .icon-group .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
    font-size: 18px;
    margin: 0 6px 1px 0;
    vertical-align: middle;
  }

  #about .information .row .item .content .list p {
    color: #3A2A21;
    font-size: 95%;
  }

  @media only screen and (max-width: 1440px) {
    #about .information .row .item .content .list p {
      font-size: 90%;
    }
  }

  @media only screen and (max-width: 1200px) {
    #about .information .row .item .content .list p {
      font-size: 16px;
    }
  }

  @media only screen and (max-width: 576px) {
    #about .information .row .item .content .list p {
      margin-bottom: 16px;
    }
  }

  #about .information .row .item .content .list p a {
    text-decoration: none;
    color: #3A2A21;
  }

  /* ====================================
                 News List
     ==================================== */
  #news-list .filter {
    justify-items: center;
  }

  #news-list .filter .filter-tag {
    margin-left: 12px;
  }

  #news-list .filter .filter-tag .tag {
    opacity: 0.4;
    padding: 5px 6px 4px 8px;
    margin: 0 40px;
  }

  @media only screen and (max-width: 1200px) {
    #news-list .filter .filter-tag .tag {
      padding: 5px 6px 4px 8px;
      font-size: 80%;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #news-list .filter .filter-tag .tag {
      margin: 0 24px;
    }
  }

  @media only screen and (max-width: 576px) {
    #news-list .filter .filter-tag .tag {
      margin: 0 16px;
    }
  }

  @media only screen and (max-width: 450px) {
    #news-list .filter .filter-tag .tag {
      margin: 0 12px;
    }
  }

  @media only screen and (max-width: 400px) {
    #news-list .filter .filter-tag .tag {
      padding: 5px 6px 4px 8px;
      font-size: 76%;
      margin: 0 10px;
    }
  }

  @media only screen and (max-width: 350px) {
    #news-list .filter .filter-tag .tag {
      padding: 3px 5px 2.395px 7px;
      font-size: 67%;
      margin: 0 8px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #news-list .filter .filter-tag .tag::before {
      border-top: 13px solid transparent;
      border-bottom: 12px solid transparent;
      margin: 0px 0 -7.5px -21px;
    }
  }

  @media only screen and (max-width: 350px) {
    #news-list .filter .filter-tag .tag::before {
      border-top: 10px solid transparent;
      border-bottom: 11px solid transparent;
      margin: 0px 0 -6.2px -20px;
    }
  }

  #news-list .filter .filter-tag .tag.active,
  #news-list .filter .filter-tag .tag:hover {
    opacity: 1;
  }

  #news-list .filter .filter-tag a:hover,
  #news-list .filter .filter-tag a:active,
  #news-list .filter .filter-tag a:focus {
    color: #fff;
  }

  #news-list .tab-content {
    margin-top: 40px;
  }

  #news-list .tab-content .tab-pane .card {
    background: none;
    border: none;
    border-radius: 0;
  }

  @media only screen and (max-width: 1200px) {
    #news-list .tab-content .tab-pane .card {
      padding: 0 12px;
    }
  }

  #news-list .tab-content .tab-pane .card:nth-last-child(-n+2) .row {
    border-bottom: none;
  }

  @media only screen and (max-width: 991px) {
    #news-list .tab-content .tab-pane .card:nth-last-child(-n+2) .row {
      border-bottom: 1px solid rgba(132, 116, 107, 0.32);
    }
  }

  #news-list .tab-content .tab-pane .card:last-of-type .row {
    border-bottom: none;
  }

  #news-list .tab-content .tab-pane .card .row {
    border-bottom: 1px solid rgba(132, 116, 107, 0.32);
    padding: 20px 0;
  }

  #news-list .tab-content .tab-pane .card .row .card-body {
    padding: 12px 0 12px 32px;
  }

  @media only screen and (max-width: 1440px) {
    #news-list .tab-content .tab-pane .card .row .card-body {
      padding: 0 0 0 28px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #news-list .tab-content .tab-pane .card .row .card-body {
      padding: 0 0 0 10px;
    }
  }

  @media only screen and (max-width: 991px) {
    #news-list .tab-content .tab-pane .card .row .card-body {
      padding: 0 0 0 28px;
    }
  }

  @media only screen and (max-width: 576px) {
    #news-list .tab-content .tab-pane .card .row .card-body {
      padding: 0 0 0 16px;
    }
  }

  @media only screen and (max-width: 350px) {
    #news-list .tab-content .tab-pane .card .row .card-body {
      padding: 0 0 0 10px;
    }
  }

  #news-list .tab-content .tab-pane .card .row .card-body .card-title {
    color: #775746;
    font-weight: 300;
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  @media only screen and (max-width: 576px) {
    #news-list .tab-content .tab-pane .card .row .card-body .card-title {
      margin-bottom: 12px;
    }
  }

  #news-list .tab-content .tab-pane .card .row .card-body .card-text {
    color: #666666;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  @media only screen and (max-width: 991px) {
    #news-list .tab-content .tab-pane .card .row .card-body .card-text {
      -webkit-line-clamp: 3;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #news-list .tab-content .tab-pane .card .row .card-body .card-text {
      -webkit-line-clamp: 2;
    }
  }

  @media only screen and (max-width: 576px) {
    #news-list .tab-content .tab-pane .card .row .card-body .card-text {
      margin-bottom: 12px;
    }
  }

  #news-list .tab-content .tab-pane .card .row .card-body small {
    color: #848484;
    font-size: 85%;
  }

  @media only screen and (max-width: 1200px) {
    #news-list .tab-content .tab-pane .card .row .card-body small {
      font-size: 76%;
    }
  }

  @media only screen and (max-width: 991px) {
    #news-list .tab-content .tab-pane .card .row .card-body small {
      font-size: 85%;
    }
  }

  @media only screen and (max-width: 350px) {
    #news-list .tab-content .tab-pane .card .row .card-body small {
      font-size: 76%;
    }
  }

  /* ====================================
                   News
     ==================================== */
  #news {
    text-align: center;
  }

  #news h3 {
    color: #775746;
    margin-bottom: 32px;
  }

  #news small {
    color: #848484;
    font-size: 85%;
  }

  #news .tag {
    padding: 4px 6px 4px 8px;
    font-size: 80%;
  }

  @media only screen and (max-width: 1200px) {
    #news .tag {
      padding: 4px 6px 4px 8px;
      font-size: 80%;
    }
  }

  @media only screen and (max-width: 350px) {
    #news .tag {
      padding: 3px 5px 3px 7px;
      font-size: 70%;
    }
  }

  #news .tag::before {
    border-top: 13px solid transparent;
    border-bottom: 12px solid transparent;
    margin: 0px 0 -7.5px -21px;
  }

  @media only screen and (max-width: 1200px) {
    #news .tag::before {
      border-top: 13px solid transparent;
      border-bottom: 12px solid transparent;
      margin: 0px 0 -7.5px -21px;
    }
  }

  @media only screen and (max-width: 350px) {
    #news .tag::before {
      border-top: 10px solid transparent;
      border-bottom: 11px solid transparent;
      margin: 0px 0 -6.2px -20px;
    }
  }

  #news .content {
    margin: 40px auto 0 auto;
  }

  #news .content .image {
    padding-right: 0;
  }

  @media only screen and (max-width: 576px) {
    #news .content .image {
      padding: 0 12px;
    }
  }

  #news .content .paragraph {
    text-align: left;
  }

  @media only screen and (max-width: 576px) {
    #news .content .paragraph {
      margin-top: 28px;
    }
  }

  #news .content .paragraph h5 {
    color: #9A5D3A;
  }

  /* ====================================
             Product Main List
     ==================================== */
  #product-main-list .banner .carousel-indicators [data-bs-target] {
    background-color: rgba(119, 87, 70, 0.4);
    border: 1.5px solid rgba(255, 255, 255, 0.38);
    width: 40px;
    margin: 0 6px;
  }

  @media only screen and (max-width: 576px) {
    #product-main-list .banner .carousel-indicators [data-bs-target] {
      width: 35px;
      margin: 0 4px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-main-list .banner .carousel-indicators [data-bs-target] {
      width: 30px;
    }
  }

  #product-main-list .banner .carousel-indicators [data-bs-target].active {
    background-color: rgb(180, 117, 81);
    opacity: 1;
  }

  #product-main-list .banner .carousel-control-next,
  #product-main-list .banner .carousel-control-prev {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    opacity: 0.6;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
  }

  #product-main-list .banner .carousel-control-next:hover,
  #product-main-list .banner .carousel-control-prev:hover {
    opacity: 1;
  }

  #product-main-list .banner .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    margin-left: 60px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 1440px) {
    #product-main-list .banner .carousel-control-prev-icon {
      margin-left: 44px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #product-main-list .banner .carousel-control-prev-icon {
      margin-left: 32px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #product-main-list .banner .carousel-control-prev-icon {
      margin-left: 20px;
      width: 25px;
      height: 25px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-main-list .banner .carousel-control-prev-icon {
      margin-left: 12px;
    }
  }

  #product-main-list .banner .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    margin-right: 60px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 1440px) {
    #product-main-list .banner .carousel-control-next-icon {
      margin-right: 44px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 1200px) {
    #product-main-list .banner .carousel-control-next-icon {
      margin-right: 32px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #product-main-list .banner .carousel-control-next-icon {
      margin-right: 20px;
      width: 25px;
      height: 25px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-main-list .banner .carousel-control-next-icon {
      margin-right: 12px;
    }
  }

  #product-main-list .title-center {
    margin: 0 auto;
    text-align: center;
    padding: 24px 20px 0 20px !important;
    border-bottom: none;
    width: 91.66666667%;
  }

  @media only screen and (max-width: 450px) {
    #product-main-list .title-center {
      padding: 20px 4px 0 4px !important;
    }
  }

  #product-main-list .list .row {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  #product-main-list .list .row .card {
    padding: 12px;
    background: none;
    border: none;
  }

  #product-main-list .list .row .card:hover .card-title,
  #product-main-list .list .row .card:active .card-title,
  #product-main-list .list .row .card:focus .card-title {
    padding: 0;
  }

  @media only screen and (max-width: 1200px) {
    #product-main-list .list .row .card {
      padding: 8px;
    }
  }

  #product-main-list .list .row .card img {
    padding: 8px;
    border: 1px solid rgba(119, 87, 70, 0.4);
  }

  #product-main-list .list .row .card .card-title {
    margin: 20px 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 8px;
  }

  #product-main-list .list .row .card .card-title h6 {
    color: #775746;
    font-weight: 300;
    margin-bottom: 0;
  }

  #product-main-list .list .row .card .card-title img {
    padding: 0;
    border: none;
  }

  @media only screen and (max-width: 450px) {
    #product-main-list .list .row .card .card-title img {
      width: 18px;
    }
  }

  /* ====================================
               Product List
     ==================================== */
  #product-list .banner {
    margin-top: 0;
  }

  #product-list .banner .carousel-indicators [data-bs-target] {
    background-color: rgba(119, 87, 70, 0.4);
    border: 1.5px solid rgba(255, 255, 255, 0.38);
    width: 40px;
    margin: 0 6px;
  }

  @media only screen and (max-width: 576px) {
    #product-list .banner .carousel-indicators [data-bs-target] {
      width: 35px;
      margin: 0 4px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-list .banner .carousel-indicators [data-bs-target] {
      width: 30px;
    }
  }

  #product-list .banner .carousel-indicators [data-bs-target].active {
    background-color: rgb(180, 117, 81);
    opacity: 1;
  }

  #product-list .banner .carousel-control-next,
  #product-list .banner .carousel-control-prev {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    opacity: 0.6;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
  }

  #product-list .banner .carousel-control-next:hover,
  #product-list .banner .carousel-control-prev:hover {
    opacity: 1;
  }

  #product-list .banner .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    margin-left: 16px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 576px) {
    #product-list .banner .carousel-control-prev-icon {
      margin-left: 12px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-list .banner .carousel-control-prev-icon {
      margin-left: 8px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 350px) {
    #product-list .banner .carousel-control-prev-icon {
      margin-left: 4px;
      width: 25px;
      height: 25px;
    }
  }

  #product-list .banner .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    margin-right: 16px;
    width: 40px;
    height: 40px;
  }

  @media only screen and (max-width: 576px) {
    #product-list .banner .carousel-control-next-icon {
      margin-right: 12px;
      width: 35px;
      height: 35px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product-list .banner .carousel-control-next-icon {
      margin-right: 8px;
      width: 30px;
      height: 30px;
    }
  }

  @media only screen and (max-width: 350px) {
    #product-list .banner .carousel-control-next-icon {
      margin-right: 4px;
      width: 25px;
      height: 25px;
    }
  }

  #product-list .title-center {
    margin: 0 auto;
    text-align: center;
    padding: 24px 20px 0 20px !important;
    border-bottom: none;
    width: 91.66666667%;
  }

  @media only screen and (max-width: 450px) {
    #product-list .title-center {
      padding: 20px 4px 0 4px !important;
    }
  }

  #product-list .list .tab-content {
    padding: 0;
  }

  #product-list .list .tab-content .card {
    background: none;
    border: none;
    padding: 8px 20px;
    position: relative;
  }

  @media only screen and (max-width: 1440px) {
    #product-list .list .tab-content .card {
      padding: 8px 16px;
    }
  }

  @media only screen and (max-width: 991px) {
    #product-list .list .tab-content .card {
      padding: 8px;
    }
  }

  #product-list .list .tab-content .card em {
    padding: 4px 8px;
    color: #9A5D3A;
    border: 1px solid #9A5D3A;
    background: #fff;
    position: absolute;
    top: 0;
    left: 12px;
    font-size: 80%;
    font-style: unset;
  }

  @media only screen and (max-width: 991px) {
    #product-list .list .tab-content .card em {
      left: 0;
    }
  }

  #product-list .list .tab-content .card .card-title {
    margin: 12px 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #product-list .list .tab-content .card .card-title h6 {
    color: #333333;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #product-list .list .tab-content .card .price small {
    font-size: 80%;
  }

  #product-list .list .tab-content .card .price span {
    color: #333333;
    margin-bottom: 16px;
  }

  #product-list .list .tab-content .card .price del {
    color: #848484;
  }

  #product-list .list .tab-content .card .price b {
    color: #9A5D3A;
    font-size: 110%;
  }

  /* ====================================
                 Product
     ==================================== */
  #product .product-img {
    height: -webkit-fit-content !important;
    height: -moz-fit-content !important;
    height: fit-content !important;
  }

  @media only screen and (max-width: 576px) {
    #product .product-img {
      padding: 0;
    }
  }

  #product .product-img img {
    width: 100%;
  }

  #product .product-img .js-slider-for {
    padding: 0 4px 0 6px;
  }

  #product .product-img .js-slider-for .slick-list {
    overflow: visible;
  }

  #product .product-img .js-slider-for .slick-list em {
    padding: 4px 8px;
    color: #9A5D3A;
    border: 1px solid #9A5D3A;
    background: #fff;
    position: absolute;
    top: -4px;
    left: -4px;
    font-size: 80%;
    font-style: unset;
  }

  #product .product-img .js-slider-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  #product .product-img .js-slider-nav .slick-list { width: 100% !important; }

  #product .product-img .js-slider-nav .slick-list .slick-track {
    margin: 12px auto 0 auto;
    min-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #product .product-img .js-slider-nav .slick-list .slick-track .slick-slide {
    padding: 0 6px;
  }

  #product .product-img .js-slider-nav .slick-list .slick-track .slick-slide .img-item {
    border: none !important;
    position: relative;
    display: block;
    cursor: pointer;
  }

  #product .product-info {
    z-index: 1;
    padding: 0 10px;
  }

  @media only screen and (max-width: 991px) {
    #product .product-info {
      margin-top: 30px;
    }
  }

  #product .product-info h2 {
    color: #333333;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 20px;
  }

  #product .product-info .specification {
    color: #333333;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  #product .product-info .specification p {
    margin-right: 16px;
  }

  #product .product-info .specification .radio-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #product .product-info .specification .radio-item .item {
    padding: 0 8px;
  }

  @media only screen and (max-width: 767.98px) {
    #product .product-info .specification .radio-item .item {
      padding: 0 8px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product .product-info .specification .radio-item .item {
      padding: 0 4px;
    }
  }

  #product .product-info .specification .radio-item .item:first-of-type {
    padding-left: 0;
  }

  #product .product-info .specification .radio-item .item .btn-check:checked+.btn {
    color: #9A5D3A;
    border: 1px solid #9A5D3A;
  }

  #product .product-info .specification .radio-item .item .btn-radio {
    padding: 4px 28px;
    background: rgba(255, 255, 255, 0.43) !important;
    border-radius: 0;
    font-size: 15px;
  }

  @media only screen and (max-width: 1200px) {
    #product .product-info .specification .radio-item .item .btn-radio {
      padding: 4px 20px;
    }
  }

  @media only screen and (max-width: 991px) {
    #product .product-info .specification .radio-item .item .btn-radio {
      padding: 4px 28px;
    }
  }

  @media only screen and (max-width: 576px) {
    #product .product-info .specification .radio-item .item .btn-radio {
      padding: 4px 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product .product-info .specification .radio-item .item .btn-radio {
      padding: 4px 16px;
    }
  }

  @media only screen and (max-width: 350px) {
    #product .product-info .specification .radio-item .item .btn-radio {
      padding: 4px 12px;
    }
  }

  #product .product-info .specification .radio-item .item .btn-radio.btn {
    color: #775746;
  }

  #product .product-info .price {
    color: #333333;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #product .product-info .price p {
    margin-right: 20px;
  }

  #product .product-info .price small {
    font-size: 80%;
  }

  #product .product-info .price span {
    color: #333333;
    margin-bottom: 16px;
  }

  #product .product-info .price del {
    color: #848484;
  }

  #product .product-info .price b {
    color: #9A5D3A;
    font-size: 110%;
  }

  #product .product-info .brief {
    margin: 28px 0 40px 0;
    color: #666666;
  }

  @media only screen and (max-width: 576px) {
    #product .product-info .brief {
      margin: 20px 0 32px 0;
    }
  }

  #product .product-info .cart-list {
    background: rgba(255, 255, 255, 0.32);
    margin-bottom: 32px;
  }

  #product .product-info .cart-list:last-of-type {
    margin-bottom: 0;
  }

  #product .product-info .cart-list h6 {
    color: #333333;
    background: rgba(132, 116, 107, 0.32);
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #product .product-info .cart-list .item {
    padding: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #product .product-info .cart-list .item:last-of-type {
    border-bottom: none;
  }

  #product .product-info .cart-list .item a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #product .product-info .cart-list .item a .product-img {
    padding: 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  #product .product-info .cart-list .item a .product-img img {
    width: 100px;
  }

  @media only screen and (max-width: 1200px) {
    #product .product-info .cart-list .item a .product-img img {
      width: 80px;
    }
  }

  @media only screen and (max-width: 991px) {
    #product .product-info .cart-list .item a .product-img img {
      width: 100px;
    }
  }

  @media only screen and (max-width: 450px) {
    #product .product-info .cart-list .item a .product-img img {
      width: 80px;
    }
  }

  #product .product-info .cart-list .item a .cart-spec {
    padding: 0 0 0 16px;
    width: 100%;
    -ms-flex-line-pack: center;
    align-content: center;
  }

  #product .product-info .cart-list .item a .cart-spec .product-name {
    width: 100%;
  }

  #product .product-info .cart-list .item a .cart-spec .product-name h6 {
    color: #333333;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    background: none;
    padding: 0;
  }

  #product .product-info .quantity {
    background: rgba(255, 255, 255, 0.43);
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  @media only screen and (max-width: 576px) {
    #product .product-info .quantity {
      width: 100%;
      padding: 8px 0;
    }
  }

  #product .product-info .quantity-input {
    border: none;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    background: transparent;
    color: #333333;
    text-align: center;
    font-size: 90%;
  }

  #product .product-info .quantity-input::-webkit-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #product .product-info .quantity-input::-moz-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #product .product-info .quantity-input:-ms-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #product .product-info .quantity-input::-ms-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #product .product-info .quantity-input::placeholder {
    color: #333333;
    font-weight: 300;
  }

  #product .product-info .quantity-input:hover,
  #product .product-info .quantity-input:active,
  #product .product-info .quantity-input:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
  }

  #product .product-info .quantity button {
    cursor: pointer;
    position: relative;
    width: 15%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    background: none;
    border: none;
    border-radius: 0;
    padding: 0 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #333333;
  }

  #product .product-info .quantity button span {
    font-size: 19px;
  }

  #product .product-info .cart-btn {
    padding: 0 0 0 16px;
  }

  @media only screen and (max-width: 576px) {
    #product .product-info .cart-btn {
      padding: 16px 0;
      width: 100%;
    }
  }

  #product .product-info .cart-btn .btn-tertiary {
    padding: 8px 32px;
  }

  #product .product-info .details {
    margin-top: 32px;
  }

  #product .product-info .details .tab-content {
    margin-top: 32px;
  }

  /* ====================================
                   Cart
     ==================================== */
  #cart .payment {
    font-size: 90%;
  }

  @media only screen and (max-width: 991px) {
    #cart .payment {
      padding: 0 8px;
    }
  }

  #cart .payment .sticky-top {
    padding-top: 12px;
  }

  @media only screen and (max-width: 991px) {
    #cart .payment .sticky-top {
      padding-top: 0;
    }
  }

  #cart .payment .sticky-top .inner {
    background: rgba(255, 255, 255, 0.32);
  }

  #cart .payment .sticky-top .inner h6 {
    color: #fff;
    background: #9A5D3A;
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #cart .payment .sticky-top .inner .group {
    padding: 12px 16px;
    color: #333333;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #cart .payment .sticky-top .inner .group:last-of-type {
    border-bottom: none;
  }

  #cart .payment .sticky-top .inner .group .row {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #cart .payment .sticky-top .inner .group .row p {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0;
  }

  #cart .payment .sticky-top .inner .group .row p mark {
    color: #9A5D3A;
    font-size: 16px;
    background: none;
  }

  #cart .payment .sticky-top .inner .group .row:last-of-type p {
    margin-bottom: 0;
  }

  #cart .payment .sticky-top .inner .group .total p {
    font-size: 115%;
  }

  #cart .payment .sticky-top .inner .group .total small {
    font-size: 90%;
  }

  #cart .payment .sticky-top .inner .group .total b {
    color: #9A5D3A;
  }

  #cart .list {
    padding: 12px 0 0 20px;
  }

  @media only screen and (max-width: 991px) {
    #cart .list {
      padding: 0 8px 0 8px;
      margin-top: 32px;
    }
  }

  #cart .list .cart-list {
    background: rgba(255, 255, 255, 0.32);
    margin-bottom: 32px;
  }

  #cart .list .cart-list:last-of-type {
    margin-bottom: 0;
  }

  #cart .list .cart-list h6 {
    color: #333333;
    background: rgba(132, 116, 107, 0.32);
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #cart .list .cart-list .item {
    padding: 16px 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #cart .list .cart-list .item .btn-del {
    border: none;
    background: none;
    color: #333333;
    padding: 0;
    width: 20px;
    height: 20px;
  }

  #cart .list .cart-list .item .btn-del span {
    font-size: 20px;
  }

  #cart .list .cart-list .item .product-link img {
    width: 120px;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .item .product-link img {
      width: 90px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .item .product-link img {
      width: 110px;
    }
  }

  @media only screen and (max-width: 450px) {
    #cart .list .cart-list .item .product-link img {
      width: 90px;
    }
  }

  #cart .list .cart-list .item .cart-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .item .cart-info {
      display: block;
    }
  }

  #cart .list .cart-list .item .cart-info .product-name {
    margin: 12px 0 8px 0;
    width: 65%;
    padding-left: 20px;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .item .cart-info .product-name {
      padding-left: 12px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .item .cart-info .product-name {
      width: 100%;
      display: block;
    }
  }

  #cart .list .cart-list .item .cart-info .product-name h6 {
    color: #333333;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    background: none;
    padding: 0;
  }

  #cart .list .cart-list .item .cart-info .product-name small {
    font-size: 80%;
    color: #848484;
  }

  #cart .list .cart-list .item .cart-info .cart-spec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 12px;
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .item .cart-info .cart-spec {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
    }
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity {
    background: rgba(255, 255, 255, 0.43);
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  @media only screen and (max-width: 576px) {
    #cart .list .cart-list .item .cart-info .cart-spec .quantity {
      width: 100%;
      padding: 8px 0;
    }
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input {
    border: none;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    background: transparent;
    color: #333333;
    text-align: center;
    font-size: 90%;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input::-webkit-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input::-moz-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input:-ms-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input::-ms-input-placeholder {
    color: #333333;
    font-weight: 300;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input::placeholder {
    color: #333333;
    font-weight: 300;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input:hover,
  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input:active,
  #cart .list .cart-list .item .cart-info .cart-spec .quantity-input:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity button {
    cursor: pointer;
    position: relative;
    width: 15%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    background: none;
    border: none;
    border-radius: 0;
    padding: 0 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #333333;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .quantity button span {
    font-size: 19px;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .price {
    min-width: 100px;
    text-align: right;
    color: #333333;
    display: -ms-grid;
    display: grid;
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .item .cart-info .cart-spec .price {
      text-align: left;
      margin-top: 12px;
    }
  }

  #cart .list .cart-list .item .cart-info .cart-spec .price del {
    color: #848484;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .price b {
    color: #9A5D3A;
    font-size: 110%;
  }

  #cart .list .cart-list .item .cart-info .cart-spec .price mark {
    background: none;
    font-size: 80%;
  }

  #cart .list .cart-list .notice {
    padding: 12px 16px;
  }

  #cart .list .cart-list .notice p {
    margin-bottom: 0;
  }

  #cart .list .cart-list .notice p mark {
    font-size: 16px;
    color: #9A5D3A;
    background: none;
  }

  #cart .list .cart-list .responsive-slick {
    padding: 0 40px;
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .responsive-slick {
      padding: 0 24px;
    }
  }

  #cart .list .cart-list .responsive-slick .slick-item {
    padding: 16px 12px;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .product-img {
    padding: 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .product-img img {
    width: 100px;
    height:100px;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .responsive-slick .slick-item .inner .product-img img {
      width: 80px;
      height:80px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .responsive-slick .slick-item .inner .product-img img {
      width: 90px;
      height:90px;
    }
  }

  @media only screen and (max-width: 450px) {
    #cart .list .cart-list .responsive-slick .slick-item .inner .product-img img {
      width: 80px;
      height:80px;
    }
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec {
    padding: 0 0 0 12px;
    width: 100%;
    -ms-flex-line-pack: center;
    align-content: center;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .product-name {
    width: 100%;
    /* margin-bottom: 20px; */
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .product-name h6 {
    color: #333333;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    background: none;
    padding: 0;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .price {
    min-width: 100px;
    color: #333333;
    display: -ms-grid;
    display: grid;
    margin-top: 20px;
  }

  @media only screen and (max-width: 767.98px) {
    #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .price {
      margin-top: 12px;
    }
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .price del {
    color: #848484;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .price b {
    color: #9A5D3A;
    font-size: 110%;
  }

  #cart .list .cart-list .responsive-slick .slick-item .inner .cart-spec .price mark {
    background: none;
    font-size: 80%;
    padding: 0;
  }

  #cart .list .cart-list .responsive-slick .slick-item .submit-btn {
    width: 100%;
    padding: 0;
    margin-top: 20px;
  }

  #cart .list .cart-list .responsive-slick .slick-item .submit-btn button {
    width: 100%;
  }

  #cart .list .cart-list .responsive-slick .slick-prev {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    left: 0;
    z-index: 1;
  }

  #cart .list .cart-list .responsive-slick .slick-prev::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    display: inline-block;
    width: 35px;
    height: 35px;
    content: "";
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .responsive-slick .slick-prev::before {
      width: 25px;
      height: 25px;
    }
  }

  #cart .list .cart-list .responsive-slick .slick-next {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    right: 0;
    z-index: 1;
  }

  #cart .list .cart-list .responsive-slick .slick-next::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2384746B'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    display: inline-block;
    width: 35px;
    height: 35px;
    content: "";
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .responsive-slick .slick-next::before {
      width: 25px;
      height: 25px;
    }
  }

  #cart .list .cart-list .coupon-block {
    padding: 16px 20px;
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .coupon-block {
      padding: 16px 8px;
    }
  }

  #cart .list .cart-list .coupon-block .not-select {
    text-align: center;
  }

  #cart .list .cart-list .coupon-block .selected {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .coupon-block .selected {
      display: block;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart .list .cart-list .coupon-block .selected {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: distribute;
      justify-content: space-around;
    }
  }

  @media (max-width: 680px) {
    #cart .list .cart-list .coupon-block .selected {
      display: block;
    }
  }

  #cart .list .cart-list .coupon-block .selected .coupon {
    width: 300px;
    padding: 12px 0 8px 0;
    position: relative;
    border: 1px solid rgba(119, 87, 70, 0.2);
    border-radius: 16px;
    overflow: hidden;
    text-align: left;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .coupon-block .selected .coupon {
      margin: 0 auto;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart .list .cart-list .coupon-block .selected .coupon {
      margin: 0;
    }
  }

  @media (max-width: 680px) {
    #cart .list .cart-list .coupon-block .selected .coupon {
      margin: 0 auto;
    }
  }

  @media only screen and (max-width: 450px) {
    #cart .list .cart-list .coupon-block .selected .coupon {
      width: 280px;
    }
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .coupon-block .selected .coupon {
      width: 260px;
    }
  }

  #cart .list .cart-list .coupon-block .selected .coupon span {
    background: rgba(119, 87, 70, 0.2);
    color: #666666;
    padding: 2px 12px;
    border-radius: 50px;
    font-size: 90%;
    font-weight: 300;
    margin: 0 0 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .coupon-block .selected .coupon span {
      font-size: 85%;
    }
  }

  #cart .list .cart-list .coupon-block .selected .coupon h4 {
    color: #333333;
    margin: 16px auto;
    position: relative;
    z-index: 1;
  }

  #cart .list .cart-list .coupon-block .selected .coupon .deco {
    position: absolute;
    right: 4px;
    bottom: 36px;
    width: 40px;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .coupon-block .selected .coupon .deco {
      width: 30px;
    }
  }

  #cart .list .cart-list .coupon-block .selected .coupon small {
    color: #666666;
    border-top: 1px dashed rgba(119, 87, 70, 0.4);
    width: 100%;
    display: block;
    padding: 4px 12px 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #cart .list .cart-list .coupon-block .selected .coupon small {
      font-size: 85%;
      padding: 2px 12px 0 12px;
    }
  }

  #cart .list .cart-list .coupon-block .selected .coupon .bg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    display: block;
    z-index: 0;
  }

  @media only screen and (max-width: 1200px) {
    #cart .list .cart-list .coupon-block .selected .coupon-btn {
      margin-top: 16px;
      text-align: center;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart .list .cart-list .coupon-block .selected .coupon-btn {
      margin-top: 0;
    }
  }

  @media (max-width: 680px) {
    #cart .list .cart-list .coupon-block .selected .coupon-btn {
      margin-top: 16px;
      text-align: center;
    }
  }

  #cart .list .cart-list.no-items {
    text-align: center;
  }

  #cart .list .cart-list.no-items p {
    color: #333333;
    padding: 32px 20px;
  }

  @media only screen and (max-width: 450px) {
    #cart .list .cart-list.no-items p {
      padding-top: 16px 20px;
    }
  }

  #cart .list .cart-list.no-items p a {
    color: #9A5D3A;
    text-decoration: underline;
  }

  /* ====================================
                 Cart Pay
     ==================================== */
  #cart-pay .payment {
    font-size: 90%;
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .payment {
      padding: 0 8px;
    }
  }

  #cart-pay .payment .sticky-top {
    padding-top: 12px;
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .payment .sticky-top {
      padding-top: 0;
    }
  }

  #cart-pay .payment .sticky-top .inner {
    background: rgba(255, 255, 255, 0.32);
  }

  #cart-pay .payment .sticky-top .inner h6 {
    color: #fff;
    background: #9A5D3A;
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #cart-pay .payment .sticky-top .inner .group {
    padding: 12px 16px;
    color: #333333;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #cart-pay .payment .sticky-top .inner .group:last-of-type {
    border-bottom: none;
  }

  #cart-pay .payment .sticky-top .inner .group .row {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #cart-pay .payment .sticky-top .inner .group .row p {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0;
  }

  #cart-pay .payment .sticky-top .inner .group .row p mark {
    color: #9A5D3A;
    font-size: 16px;
    background: none;
  }

  #cart-pay .payment .sticky-top .inner .group .row:last-of-type p {
    margin-bottom: 0;
  }

  #cart-pay .payment .sticky-top .inner .group .total p {
    font-size: 115%;
  }

  #cart-pay .payment .sticky-top .inner .group .total small {
    font-size: 90%;
  }

  #cart-pay .payment .sticky-top .inner .group .total b {
    color: #9A5D3A;
  }

  #cart-pay .list {
    padding: 12px 0 0 20px;
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .list {
      padding: 0 8px 0 8px;
      margin-top: 32px;
    }
  }

  #cart-pay .list .cart-list {
    background: rgba(255, 255, 255, 0.32);
    margin-bottom: 32px;
  }

  #cart-pay .list .cart-list:last-of-type {
    margin-bottom: 0;
  }

  #cart-pay .list .cart-list h6 {
    color: #333333;
    background: rgba(132, 116, 107, 0.32);
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #cart-pay .list .cart-list .login-info {
    padding: 16px;
  }

  #cart-pay .list .cart-list .login-info h5 {
    color: #333333;
    margin-bottom: 0;
  }

  #cart-pay .list .cart-list .personal-info {
    padding: 16px;
  }

  #cart-pay .list .cart-list .personal-info .img-block {
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  #cart-pay .list .cart-list .personal-info .img-block .account {
    border-radius: 100%;
    width: 70px;
  }

  #cart-pay .list .cart-list .personal-info .img-block .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
    color: #08BF5B;
    margin: 0 4px 0 16px;
  }

  #cart-pay .list .cart-list .personal-info .img-block small {
    color: #148347;
  }

  #cart-pay .list .cart-list .personal-info .form-grid {
    margin-top: 12px;
  }

  @media only screen and (max-width: 500px) {
    #cart-pay .list .cart-list .personal-info .form-grid {
      margin-top: 20px;
    }
  }

  #cart-pay .list .cart-list .personal-info .form-grid .form-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
  }

  @media only screen and (max-width: 1200px) {
    #cart-pay .list .cart-list .personal-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .list .cart-list .personal-info .form-grid .form-group {
      -ms-flex-wrap: no-wrap;
      flex-wrap: no-wrap;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart-pay .list .cart-list .personal-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  #cart-pay .list .cart-list .payment-info .radio-grid {
    padding: 16px 4px;
    margin: 0;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #cart-pay .list .cart-list .payment-info .radio-grid:last-of-type {
    border-bottom: none;
  }

  #cart-pay .list .cart-list .payment-info .radio-grid p {
    color: #333333;
    font-size: 90%;
    margin-bottom: 0;
    width: 100%;
    padding: 0 0 0 12px;
  }

  #cart-pay .list .cart-list .payment-info .radio-grid .input-item {
    padding: 8px 12px 12px 12px;
  }

  #cart-pay .list .cart-list .payment-info .radio-grid .input-item .form-select {
    background-position: 98% 50%;
  }

  #cart-pay .list .cart-list .recipients-info .form-grid {
    padding: 16px 4px;
    margin: 0;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #cart-pay .list .cart-list .recipients-info .form-grid:last-of-type {
    border-bottom: none;
    padding: 8px 4px 16px 4px;
  }

  #cart-pay .list .cart-list .recipients-info .form-grid .form-check {
    padding: 0 12px;
    margin-bottom: 0;
    width: 100%;
  }

  #cart-pay .list .cart-list .recipients-info .form-grid .form-check .form-check-input {
    margin: 0 12px 0 0;
  }

  #cart-pay .list .cart-list .recipients-info .form-grid .form-check label {
    color: #666666;
  }

  #cart-pay .list .cart-list .recipients-info .form-grid .form-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
  }

  @media only screen and (max-width: 1200px) {
    #cart-pay .list .cart-list .recipients-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .list .cart-list .recipients-info .form-grid .form-group {
      -ms-flex-wrap: no-wrap;
      flex-wrap: no-wrap;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart-pay .list .cart-list .recipients-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  #cart-pay .list .cart-list .receipt-info .radio-grid {
    padding: 16px 4px;
    margin: 0;
  }

  #cart-pay .list .cart-list .receipt-info .radio-grid p {
    color: #333333;
    font-size: 90%;
    margin-bottom: 0;
    width: 100%;
    padding: 0 0 0 12px;
  }

  #cart-pay .list .cart-list .receipt-info .radio-grid .radio-item .form-control {
    margin-top: 12px;
    background: rgba(255, 255, 255, 0.43);
    border: none !important;
  }

  #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:first-of-type {
    padding: 0 12px 0 0;
  }

  @media only screen and (max-width: 1200px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:first-of-type {
      padding: 0;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:first-of-type {
      padding: 0 12px 0 0;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:first-of-type {
      padding: 0;
    }
  }

  #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:last-of-type {
    padding: 0 0 0 12px;
  }

  @media only screen and (max-width: 1200px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:last-of-type {
      padding: 0;
    }
  }

  @media only screen and (max-width: 991px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:last-of-type {
      padding: 0 0 0 12px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #cart-pay .list .cart-list .receipt-info .radio-grid .input-group .input-item:last-of-type {
      padding: 0;
    }
  }

  #cart-pay .list .check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  #cart-pay .list .check a {
    color: #9A5D3A;
    text-decoration: underline;
  }

  #cart-pay .list .buttonn-group {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #cart-pay .list .buttonn-group .btn {
    width: 48%;
  }

  @media only screen and (max-width: 350px) {
    #cart-pay .list .buttonn-group .btn {
      width: 100%;
    }

    #cart-pay .list .buttonn-group .btn.btn-next {
      margin-top: 16px;
    }
  }

  /* ====================================
              Cart Confirm
     ==================================== */
  #cart-confirm p {
    color: #333333;
    margin-top: 32px;
  }

  @media only screen and (max-width: 450px) {
    #cart-confirm p {
      margin-top: 16px;
    }
  }

  #cart-confirm p a {
    color: #9A5D3A;
    text-decoration: underline;
  }

  /* ====================================
                   Member
     ==================================== */
  @media only screen and (max-width: 991px) {
    #member .submenu-wrapper {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #member .submenu-wrapper a.list-group-item {
      width: 120px;
    }
  }

  @media only screen and (max-width: 450px) {
    #member .submenu-wrapper a.list-group-item {
      width: 100px;
    }
  }

  @media only screen and (max-width: 400px) {
    #member .submenu-wrapper a.list-group-item {
      width: 90px;
    }
  }

  @media only screen and (max-width: 350px) {
    #member .submenu-wrapper a.list-group-item {
      width: 75px;
    }
  }

  #member .submenu-wrapper a.list-group-item.active {
    background-image: url("../images/arrow-w.svg");
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-size: 20px;
  }

  @media only screen and (max-width: 991px) {
    #member .submenu-wrapper a.list-group-item.active {
      background-image: none;
    }
  }

  #member .tab-content {
    padding: 0;
  }

  #member .tab-content .personal-info {
    padding: 12px 16px;
  }

  #member .tab-content .personal-info .img-block {
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  #member .tab-content .personal-info .img-block .account {
    border-radius: 100%;
    width: 70px;
  }

  #member .tab-content .personal-info .img-block .vip {
    width: 60px;
    margin-left: 12px;
  }

  #member .tab-content .personal-info .form-grid {
    margin-top: 12px;
  }

  @media only screen and (max-width: 500px) {
    #member .tab-content .personal-info .form-grid {
      margin-top: 20px;
    }
  }

  #member .tab-content .personal-info .form-grid .form-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
  }

  @media only screen and (max-width: 1200px) {
    #member .tab-content .personal-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  @media only screen and (max-width: 991px) {
    #member .tab-content .personal-info .form-grid .form-group {
      -ms-flex-wrap: no-wrap;
      flex-wrap: no-wrap;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .personal-info .form-grid .form-group {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
  }

  #member .tab-content .personal-info .buttonn-group {
    margin: 32px 0 0 0;
    text-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #member .tab-content .personal-info .buttonn-group button {
    width: 48%;
    padding: 12px;
  }

  #member .tab-content .order-list {
    padding: 12px 16px;
  }

  #member .tab-content .order-list .amount {
    text-align: center;
  }

  #member .tab-content .order-list .amount small {
    font-size: 80%;
  }

  #member .tab-content .order-list .amount span {
    color: #333333;
    margin-bottom: 16px;
  }

  #member .tab-content .order-list .amount b {
    color: #9A5D3A;
    font-size: 110%;
  }

  #member .tab-content .order-list table {
    font-size: 14px;
    width: 100%;
    text-align: center;
    margin: 32px 0 0 0;
    border-collapse: separate;
    border-spacing: 0 12px;
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table {
      font-size: 16px;
      margin-top: 12px;
    }
  }

  @media only screen and (max-width: 450px) {
    #member .tab-content .order-list table {
      font-size: 15px;
    }
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .order-list table {
      font-size: 14px;
    }
  }

  #member .tab-content .order-list table thead {
    color: #848484;
  }

  #member .tab-content .order-list table thead th {
    font-weight: 400;
    padding-bottom: 8px;
    border-bottom: 1px solid #84746B;
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table thead th {
      display: none;
    }
  }

  #member .tab-content .order-list table tbody tr {
    background-color: rgba(255, 255, 255, 0.43);
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table tbody tr {
      padding: 12px;
      margin-top: -1px;
      display: block;
      border: 0.9px solid #84746B;
    }
  }

  #member .tab-content .order-list table tbody tr td {
    color: #333333;
    padding: 8px 4px;
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table tbody tr td {
      padding: 4px;
      white-space: normal;
      text-align: left;
      display: block;
    }
  }

  #member .tab-content .order-list table tbody tr td .inline-cell {
    color: #848484;
    display: none;
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table tbody tr td .inline-cell {
      display: inline-block;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table tbody tr td .pay {
      margin-left: 8px;
    }
  }

  #member .tab-content .order-list table tbody tr td a.link-order {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .order-list table tbody tr td a.link-order {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: end;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
    }
  }

  #member .tab-content .order-list table tbody tr td a.link-order .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
    font-size: 24px;
    color: #84746B;
  }

  #member .tab-content .coupon-block .header {
    padding: 12px 16px;
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .header .input-group {
      display: block;
    }
  }

  #member .tab-content .coupon-block .header .input-group input {
    background: rgba(255, 255, 255, 0.43);
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .header .input-group input {
      width: 100%;
      margin-left: -1px;
    }
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .header .input-group button {
      width: 100%;
    }
  }

  #member .tab-content .coupon-block .body {
    padding: 12px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  #member .tab-content .coupon-block .body .item {
    margin: 16px auto;
    display: -ms-grid;
    display: grid;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  @media (max-width: 850px) {
    #member .tab-content .coupon-block .body .item {
      margin: 16px auto 8px auto;
    }
  }

  #member .tab-content .coupon-block .body .item .coupon {
    width: 300px;
    padding: 12px 0 8px 0;
    position: relative;
    border: 1px solid rgba(119, 87, 70, 0.2);
    border-radius: 16px;
    overflow: hidden;
    text-align: left;
  }

  @media only screen and (max-width: 1440px) {
    #member .tab-content .coupon-block .body .item .coupon {
      width: 280px;
    }
  }

  @media (max-width: 1199.98px) {
    #member .tab-content .coupon-block .body .item .coupon {
      width: 300px;
    }
  }

  @media only screen and (max-width: 991px) {
    #member .tab-content .coupon-block .body .item .coupon {
      width: 280px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #member .tab-content .coupon-block .body .item .coupon {
      width: 300px;
    }
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .body .item .coupon {
      width: 280px;
    }
  }

  #member .tab-content .coupon-block .body .item .coupon span {
    background: rgba(119, 87, 70, 0.2);
    color: #666666;
    padding: 2px 12px;
    border-radius: 50px;
    font-size: 90%;
    font-weight: 300;
    margin: 0 0 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .body .item .coupon span {
      font-size: 85%;
    }
  }

  #member .tab-content .coupon-block .body .item .coupon h4 {
    color: #333333;
    margin: 16px auto;
    position: relative;
    z-index: 1;
  }

  #member .tab-content .coupon-block .body .item .coupon .deco {
    position: absolute;
    right: 4px;
    bottom: 36px;
    width: 40px;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .body .item .coupon .deco {
      width: 30px;
    }
  }

  #member .tab-content .coupon-block .body .item .coupon small {
    color: #666666;
    border-top: 1px dashed rgba(119, 87, 70, 0.4);
    width: 100%;
    display: block;
    padding: 4px 12px 0 12px;
    position: relative;
    z-index: 1;
  }

  @media only screen and (max-width: 350px) {
    #member .tab-content .coupon-block .body .item .coupon small {
      font-size: 85%;
      padding: 2px 12px 0 12px;
    }
  }

  #member .tab-content .coupon-block .body .item .coupon .bg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    display: block;
    z-index: 0;
  }

  /* ====================================
                 Order Info
     ==================================== */
  @media only screen and (max-width: 991px) {
    #order-info .submenu-wrapper {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .submenu-wrapper a.list-group-item {
      width: 120px;
    }
  }

  @media only screen and (max-width: 450px) {
    #order-info .submenu-wrapper a.list-group-item {
      width: 100px;
    }
  }

  @media only screen and (max-width: 400px) {
    #order-info .submenu-wrapper a.list-group-item {
      width: 90px;
    }
  }

  @media only screen and (max-width: 350px) {
    #order-info .submenu-wrapper a.list-group-item {
      width: 75px;
    }
  }

  #order-info .submenu-wrapper a.list-group-item.active {
    background-image: url("../images/arrow-w.svg");
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-size: 20px;
  }

  @media only screen and (max-width: 991px) {
    #order-info .submenu-wrapper a.list-group-item.active {
      background-image: none;
    }
  }

  #order-info .list {
    padding: 0 0 0 20px;
  }

  @media only screen and (max-width: 991px) {
    #order-info .list {
      padding: 0 8px;
      margin-top: 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    #order-info .list {
      margin-top: 0;
    }
  }

  #order-info .list a.back {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    color: #333333;
    margin: 20px 0;
  }

  #order-info .list a.back .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
    font-size: 24px;
    color: #84746B;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-right: 8px;
  }

  #order-info .list .cart-list {
    background: rgba(255, 255, 255, 0.32);
    margin-bottom: 32px;
  }

  #order-info .list .cart-list:last-of-type {
    margin-bottom: 0;
  }

  #order-info .list .cart-list h6 {
    color: #333333;
    background: rgba(132, 116, 107, 0.32);
    padding: 12px;
    font-weight: 400;
    margin-bottom: 0;
  }

  #order-info .list .cart-list .info {
    font-size: 15px;
    padding: 16px 12px;
  }

  @media only screen and (max-width: 450px) {
    #order-info .list .cart-list .info {
      font-size: 14px;
    }
  }

  @media only screen and (max-width: 350px) {
    #order-info .list .cart-list .info {
      padding: 16px 8px;
    }
  }

  #order-info .list .cart-list .info .block {
    padding: 0 4px;
  }

  #order-info .list .cart-list .info .block:last-of-type p:last-of-type {
    margin-bottom: 0;
  }

  #order-info .list .cart-list .info .block p {
    color: #333333;
  }

  #order-info .list .cart-list .info .block p .inline-cell {
    color: #848484;
  }

  #order-info .list .cart-list .info .block p .pay {
    margin-left: 8px;
  }

  #order-info .list .cart-list .info .block p .drlivery-number,
  #order-info .list .cart-list .info .block p .deadline {
    margin-left: 83px;
  }

  @media only screen and (max-width: 450px) {

    #order-info .list .cart-list .info .block p .drlivery-number,
    #order-info .list .cart-list .info .block p .deadline {
      margin-left: 77px;
    }
  }

  @media only screen and (max-width: 350px) {

    #order-info .list .cart-list .info .block p .virtual-account,
    #order-info .list .cart-list .info .block p .deadline {
      display: block;
      margin-left: 0;
    }
  }

  #order-info .list .cart-list .info .block p a {
    color: #9A5D3A;
    text-decoration: underline;
    margin-left: 83px;
  }

  @media only screen and (max-width: 450px) {
    #order-info .list .cart-list .info .block p a {
      margin-left: 77px;
    }
  }

  #order-info .list .cart-list .detail {
    padding: 0 16px;
  }

  #order-info .list .cart-list .detail .group {
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #order-info .list .cart-list .detail .group:last-of-type {
    border-bottom: none;
  }

  #order-info .list .cart-list .detail .group p {
    color: #333333;
    margin-bottom: 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 16px 0 0 0;
  }

  #order-info .list .cart-list .detail .group .row {
    padding: 0 0 16px 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  #order-info .list .cart-list .detail .group .row p {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 16px 0 0 0;
  }

  #order-info .list .cart-list .detail .group .row p mark {
    color: #9A5D3A;
    font-size: 16px;
    background: none;
  }

  #order-info .list .cart-list .detail .group .row p small {
    font-size: 90%;
  }

  #order-info .list .cart-list .detail .group .row p b {
    color: #9A5D3A;
  }

  #order-info .list .cart-list .detail .group .item {
    padding: 16px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid rgba(132, 116, 107, 0.2);
  }

  #order-info .list .cart-list .detail .group .item:last-of-type {
    border-bottom: none;
  }

  #order-info .list .cart-list .detail .group .item .product-link img {
    width: 120px;
  }

  @media only screen and (max-width: 1200px) {
    #order-info .list .cart-list .detail .group .item .product-link img {
      width: 90px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .list .cart-list .detail .group .item .product-link img {
      width: 110px;
    }
  }

  @media only screen and (max-width: 450px) {
    #order-info .list .cart-list .detail .group .item .product-link img {
      width: 90px;
    }
  }

  #order-info .list .cart-list .detail .group .item .cart-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .list .cart-list .detail .group .item .cart-info {
      display: block;
    }
  }

  #order-info .list .cart-list .detail .group .item .cart-info .product-name {
    margin: 12px 0 8px 0;
    width: 65%;
    padding-left: 20px;
  }

  @media only screen and (max-width: 1200px) {
    #order-info .list .cart-list .detail .group .item .cart-info .product-name {
      padding-left: 12px;
    }
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .list .cart-list .detail .group .item .cart-info .product-name {
      width: 100%;
      display: block;
    }
  }

  #order-info .list .cart-list .detail .group .item .cart-info .product-name h6 {
    color: #333333;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    background: none;
    padding: 0;
  }

  #order-info .list .cart-list .detail .group .item .cart-info .product-name small {
    font-size: 80%;
    color: #848484;
  }

  #order-info .list .cart-list .detail .group .item .cart-info .cart-spec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 12px;
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .list .cart-list .detail .group .item .cart-info .cart-spec {
      padding: 0 0 0 12px;
      -webkit-box-pack: right;
      -ms-flex-pack: right;
      justify-content: right;
    }
  }

  #order-info .list .cart-list .detail .group .item .cart-info .cart-spec .quantity {
    width: 25%;
    color: #333333;
  }

  @media only screen and (max-width: 767.98px) {
    #order-info .list .cart-list .detail .group .item .cart-info .cart-spec .quantity {
      width: 15%;
    }
  }

  #order-info .list .cart-list .detail .group .item .cart-info .cart-spec .price {
    color: #333333;
    min-width: 80px;
    text-align: right;
  }

  /* ====================================
                 Download
     ==================================== */
  #download section {
    color: #666666;
    text-align: center;
  }

  #download section img {
    margin: 40px auto 0 auto;
    width: 100%;
    display: block;
  }

  /* ====================================
                   Tips
     ==================================== */
  #tips section {
    color: #666666;
  }

  #tips section a {
    color: #9A5D3A;
    text-decoration: underline;
  }

  #tips section h4 {
    font-weight: bold;
    color: #333333;
  }

  #tips section li,
  #tips section p {
    line-height: 32px;
  }

  #tips section code {
    color: #B94445;
    font-size: 16px;
    font-family: "Noto Sans", sans-serif;
  }

  /* ====================================
                   FAQ
     ==================================== */
  #faq section .accordion {
    --bs-accordion-bg: none;
    --bs-accordion-border-width: 32px;
    --bs-accordion-border-color: transparent;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23333333'%3e%3cpath fill-rule='evenodd' d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8'/%3e%3c/svg%3e");
  }

  #faq section .accordion .accordion-button {
    background-color: rgba(132, 116, 107, 0.32);
    color: #333333;
  }

  #faq section .accordion .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #9A5D3A;
  }

  #faq section .accordion .accordion-body {
    color: #666666;
    border: 1px solid #9A5D3A;
  }

  #faq section .accordion .accordion-body a {
    color: #9A5D3A;
    text-decoration: underline;
  }

  #faq section .accordion .accordion-body code {
    color: #B94445;
    font-size: 16px;
    font-family: "Noto Sans", sans-serif;
  }

  /* ====================================
                  Privacy
     ==================================== */
  #privacy section {
    color: #666666;
  }

  #privacy section h4 {
    font-weight: bold;
    color: #333333;
  }

  #privacy section li,
  #privacy section p {
    line-height: 32px;
  }

  /* ====================================
                   Footer
     ==================================== */
  footer {
    border: 1px solid #F6F6F2;
    padding: 8px 8px 0 8px;
    margin: 0 auto;
  }

  footer .row {
    background: #F6F6F2;
    margin: 0 auto;
  }

  footer .row .left {
    border-right: 3px solid #ebe9df;
    padding: 32px 12px;
    text-align: center;
    -ms-flex-line-pack: center;
    align-content: center;
  }

  @media only screen and (max-width: 1200px) {
    footer .row .left {
      padding: 32px 12px 20px 12px;
    }
  }

  @media only screen and (max-width: 991px) {
    footer .row .left {
      border-right: none;
      border-bottom: 3px solid #ebe9df;
    }
  }

  @media only screen and (max-width: 450px) {
    footer .row .left {
      padding: 20px 12px 12px 12px;
    }
  }

  footer .row .left img {
    width: 130px;
    margin-bottom: 20px;
  }

  footer .row .left img:hover {
    opacity: 0.85;
  }

  @media only screen and (max-width: 450px) {
    footer .row .left img {
      width: 100px;
    }
  }

  footer .row .left p {
    margin-bottom: 4px;
    color: #84746B;
    text-decoration: none;
  }

  footer .row .right {
    padding: 32px 12px;
    -ms-flex-line-pack: center;
    align-content: center;
  }

  @media only screen and (max-width: 1200px) {
    footer .row .right {
      padding: 32px 12px 20px 12px;
    }
  }

  @media only screen and (max-width: 450px) {
    footer .row .right {
      padding: 20px 12px 12px 12px;
    }
  }

  footer .row .right .contact,
  footer .row .right .social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-right: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  @media only screen and (max-width: 767.98px) {

    footer .row .right .contact,
    footer .row .right .social {
      padding-right: 20px;
      -webkit-box-pack: left;
      -ms-flex-pack: left;
      justify-content: left;
    }
  }

  @media only screen and (max-width: 450px) {

    footer .row .right .contact,
    footer .row .right .social {
      display: block;
    }
  }

  footer .row .right .contact p,
  footer .row .right .social p {
    margin-right: 12px;
    color: #84746B;
  }

  @media only screen and (max-width: 767.98px) {

    footer .row .right .contact p,
    footer .row .right .social p {
      width: 30%;
      text-align: right;
    }
  }

  @media only screen and (max-width: 576px) {

    footer .row .right .contact p,
    footer .row .right .social p {
      width: 20%;
    }
  }

  @media only screen and (max-width: 450px) {

    footer .row .right .contact p,
    footer .row .right .social p {
      font-weight: 700;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      margin-bottom: 12px;
    }
  }

  footer .row .right .contact .info .item,
  footer .row .right .social .info .item {
    color: #84746B;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 16px;
  }

  footer .row .right .contact .info .item:first-of-type .material-symbols-outlined,
  footer .row .right .contact .info .item:last-of-type .material-symbols-outlined,
  footer .row .right .social .info .item:first-of-type .material-symbols-outlined,
  footer .row .right .social .info .item:last-of-type .material-symbols-outlined {
    font-variation-settings: "FILL" 1;
  }

  footer .row .right .contact .info .item:last-of-type,
  footer .row .right .social .info .item:last-of-type {
    margin-bottom: 0;
  }

  @media only screen and (max-width: 450px) {

    footer .row .right .contact .info .item,
    footer .row .right .social .info .item {
      margin-bottom: 8px;
      font-size: 95%;
    }
  }

  @media only screen and (max-width: 350px) {

    footer .row .right .contact .info .item,
    footer .row .right .social .info .item {
      font-size: 90%;
    }
  }

  footer .row .right .contact .info .item a,
  footer .row .right .social .info .item a {
    color: #84746B;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  footer .row .right .contact .info .item .material-symbols-outlined,
  footer .row .right .social .info .item .material-symbols-outlined {
    color: #999;
    font-size: 22px;
    margin-right: 6px;
    margin-bottom: -3px;
  }

  footer .row .right .contact .info .item img,
  footer .row .right .social .info .item img {
    margin-right: 6px;
    width: 22px;
  }

  @media only screen and (max-width: 767.98px) {
    footer .row .right .social {
      margin-top: 28px;
    }

    footer .row .right .social .info {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }

    footer .row .right .social .info .item:last-of-type {
      margin-bottom: 16px;
    }
  }

  @media only screen and (max-width: 767.98px) and (max-width: 450px) {
    footer .row .right .social .info .item {
      margin-bottom: 16px;
    }
  }

  footer .row .right .float-right {
    text-align: right;
    font-size: 80%;
    padding-left: 0;
    -ms-flex-line-pack: end;
    align-content: end;
  }

  @media only screen and (max-width: 1200px) {
    footer .row .right .float-right {
      text-align: center;
      margin-top: 40px;
      padding-left: 20px;
    }
  }

  @media only screen and (max-width: 450px) {
    footer .row .right .float-right {
      margin-top: 20px;
    }
  }

  footer .row .right .float-right a {
    padding: 6px 12px;
    border: 1px solid #775746;
    color: #84746B;
  }

  footer .row .right .float-right a:hover,
  footer .row .right .float-right a:active,
  footer .row .right .float-right a:focus {
    background: #84746B;
    color: #fff;
  }

  footer .row .right .float-right p {
    margin-bottom: 0;
    margin-top: 16px;
    color: #84746B;
  }
}
