@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lexend+Exa:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
* {
  font-family: "Lexend Exa", "Noto Sans TC", sans-serif;
  overflow-wrap: break-word;
  word-break: break-word;
}

:root {
  --theme-color-white: #ffffff;
  --theme-color-white-900: #efefef;
  --theme-color-white-800: #cccccc;
  --theme-color-white-700: #b4b4b4;
  --theme-color-white-500: #999999;
  --theme-color-white-400: #707070;
  --theme-color-white-200: #333333;
  --theme-color-light: #f6f6f6;
  --theme-color-dark: #231815;
  --theme-color-black: #000000;
  --theme-color-danger: #c80000;
  --theme-color-warning: #ff5700;
  --theme-color-border: #211e2d;
}

html {
  background: var(--theme-color-white);
  color: var(--theme-color-black);
  font-weight: 400;
}

body {
  overflow-x: hidden;
}

.container {
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
  width: 100%;
  max-width: 91.5rem;
  box-sizing: border-box;
}

@media screen and (min-width: 576px) {
  .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.col {
  flex: 1 0 0;
}

/* --- Page title --- */
.page-title {
  margin: 0;
  font-size: 2rem;
  font-weight: 200;
  line-height: 1.25;
}

@media screen and (min-width: 992px) {
  .page-title {
    font-size: 3.375rem;
    line-height: 1.2963;
  }
}
/* --- Table grid --- */
.table-grid {
  overflow: hidden;
}

.table-grid-wrap {
  --gutter-x: 1.25rem;
  --gutter-y: 1.875rem;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--gutter-y) * -1);
  margin-left: calc(var(--gutter-x) * -0.5);
  margin-right: calc(var(--gutter-x) * -0.5);
  margin-bottom: 0;
  padding: 0;
  list-style: none;
}

.table-grid-item {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-left: calc(var(--gutter-x) * 0.5);
  padding-right: calc(var(--gutter-x) * 0.5);
  margin-top: var(--gutter-y);
  box-sizing: border-box;
}

@media screen and (min-width: 992px) {
  .table-grid-wrap {
    --gutter-y: 4.375rem;
  }
}
/* --- Pagination --- */
.pagination {
  overflow: hidden;
}
.pagination * {
  font-family: "Roboto", sans-serif;
}
.pagination ul {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 -1rem;
  padding: 0;
  list-style: none;
}

.page-prev,
.page-next,
.page-link {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  color: var(--theme-color-white-400);
  border-radius: 99999px;
  box-sizing: border-box;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: background-color, color;
}
.page-prev:hover,
.page-next:hover,
.page-link:hover {
  color: var(--theme-color-white);
  background-color: var(--theme-color-white-400);
}

.page-prev,
.page-next {
  --btn-size: 2.25rem;
  width: var(--btn-size);
  height: var(--btn-size);
  color: var(--theme-color-black);
}
.page-prev svg,
.page-next svg {
  display: block;
  width: 0.84375rem;
  height: auto;
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.page-prev {
  margin-right: 0.234375rem;
}
.page-prev:hover svg {
  transform: scale(0.8);
}

.page-next {
  margin-left: 0.234375rem;
}
.page-next svg {
  transform: scaleX(-1);
}
.page-next:hover svg {
  transform: scale(-0.8, 0.8);
}

.page-link {
  --btn-size: 2.5625rem;
  width: var(--btn-size);
  height: var(--btn-size);
  padding-top: 1px;
}

.page-item {
  flex: 0 0 auto;
  padding: 0 0.34375rem;
}
.page-item.active .page-link {
  color: var(--theme-color-white);
  background-color: var(--theme-color-dark);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
}

/* --- Form group --- */
.form-group {
  position: relative;
  color: var(--theme-color-black);
  background-color: var(--theme-color-white);
  border-radius: 0.3125rem;
}
.form-group label {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  margin-left: 1.75rem;
  margin-top: 1.4375rem;
  vertical-align: text-bottom;
  text-transform: uppercase;
  font-size: 0.875rem;
  line-height: 1.1875rem;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: margin-top, font-size, line-height;
  pointer-events: none;
}
.form-group .required {
  margin-left: 0.3125rem;
  color: var(--theme-color-danger);
  font-size: 0.9375rem;
  line-height: 1.25rem;
}
.form-group input,
.form-group textarea {
  display: block;
  width: 100%;
  height: 4rem;
  padding: 1rem 1.75rem;
  font-size: 1rem;
  line-height: 1.25rem;
  background-color: transparent;
  border: none;
  border-radius: inherit;
  box-sizing: border-box;
  outline: none;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: box-shadow;
}
.form-group input:focus + label, .form-group input.inputted + label,
.form-group textarea:focus + label,
.form-group textarea.inputted + label {
  margin-top: 0.125rem;
  color: var(--theme-color-white-500);
  font-size: 0.625rem;
}
.form-group input:focus,.form-group textarea:focus {
  font-size: 1rem;
  box-shadow: 0 0 0.05rem 0.05rem var(--theme-color-white-200);
}
.form-group textarea {
  width: 100% !important;
  height: auto;
  min-height: 10.625rem;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  resize: vertical;
}

/* --- Modal --- */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  z-index: 1055;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}
.modal::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: var(--theme-color-black);
  opacity: 0;
  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.modal.show {
  display: block;
}
.modal.show::before {
  opacity: 0.4;
}

.modal-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.modal-dialog {
  --modal-dialog-mt: 9vh;
  --modal-dialog-smt: 9svh;
  position: relative;
  width: 100%;
  max-width: 28rem;
  margin: 0 auto;
  margin-top: var(--modal-dialog-mt);
  margin-top: var(--modal-dialog-smt);
  pointer-events: none;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: width, max-width;
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 2rem 1rem;
  color: var(--theme-color-black);
  background-color: var(--theme-color-white-900);
  background-clip: padding-box;
  pointer-events: auto;
  outline: none;
  box-sizing: border-box;
}

.modal-header {
  flex: 0 0 auto;
}

.modal-close {
  outline: none;
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 0.5rem;
  margin-right: 0.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.625rem;
  background-color: transparent;
  text-decoration: none;
  border: none;
  border-radius: 99999px;
  box-sizing: border-box;
  cursor: pointer;
  transition: background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.modal-close img {
  display: block;
  width: 1rem;
  height: auto;
}
.modal-close:hover {
  background-color: var(--theme-color-white-800);
}

.modal-title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-size: 1.75rem;
  font-weight: 300;
  line-height: 2.25rem;
  text-align: center;
}

.modal-body {
  flex: 1 0 auto;
  margin: 0 -1rem;
  margin-top: 0.625rem;
  padding: 0 1rem;
  padding-top: 0.5625rem;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}

@media screen and (min-width: 576px) {
  .modal-dialog {
    width: 91.666667%;
    max-width: 32rem;
  }
  .modal-close {
    margin-right: 0.625rem;
  }
  .modal-close img {
    width: 1.5rem;
  }
}
@media screen and (min-width: 992px) {
  .modal-dialog {
    max-width: 43.625rem;
  }
  .modal-content {
    padding: 3.125rem;
  }
  .modal-close {
    margin-right: 1.0625rem;
    padding: 1rem;
  }
  .modal-close img {
    width: 1.875rem;
  }
  .modal-title {
    font-size: 2rem;
    line-height: 2.5rem;
  }
}
@media screen and (min-width: 1200px) {
  .modal-dialog {
    --modal-dialog-mt: 11.538vh;
    --modal-dialog-smt: 11.538svh;
  }
}
/* --- Menu Drawer --- */
.drawer {
  position: absolute;
  top: 100%;
  left: 0;
  width: 0;
  overflow: hidden;
  height: calc(100vh - var(--header-top-h) - var(--header-bottom-h) + 1px);
  height: calc(100dvh - var(--header-top-h) - var(--header-bottom-h) + 1px);
  margin-top: -1px;
  transition: width 0ms 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.drawer::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: var(--theme-color-dark);
  opacity: 0.5;
}

.drawer-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 1.4375rem 0;
  background-color: var(--theme-color-black);
  transform: translateX(-100%);
  overflow: auto;
  box-sizing: border-box;
  transition: none 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform, visibility;
}
.drawer-wrap ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.drawer-wrap li {
  margin-top: 1.0625rem;
}

.drawer-link {
  display: block;
  text-align: center;
  padding: 1rem 0.5rem;
  color: var(--theme-color-white);
  font-size: 1.125rem;
  line-height: 1.333;
  text-transform: uppercase;
  text-decoration: none;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.drawer-link:hover {
  color: var(--theme-color-white-800);
  background-color: var(--theme-color-dark);
}

@media not screen and (min-width: 992px) {
  .header.open .drawer {
    width: 100%;
    transition-delay: 0ms;
  }
  .header.open .drawer-wrap {
    transform: translateX(0%);
  }
}
@media screen and (min-width: 992px) {
  .header.scroll.open .drawer {
    width: 100%;
    transition-delay: 0ms;
  }
  .header.scroll.open .drawer-wrap {
    transform: translateX(0%);
  }
}

/* --- Header --- */
.header {
  --header-top-h: 3.75rem;
  --header-bottom-h: 0rem;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: var(--theme-color-white);
  z-index: 50;
}
.header + * {
  --header-top-h: 3.75rem;
  --header-bottom-h-fix: 0rem;
  margin-top: calc(var(--header-top-h) + var(--header-bottom-h-fix));
}

.header-hr {
  margin: 0 -1rem;
  border-top: 1px solid var(--theme-color-white-900);
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.header-top {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--header-top-h);
  box-sizing: border-box;
  transition: height 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.header-bottom {
  height: var(--header-bottom-h);
  overflow: hidden;
  box-sizing: border-box;
  transition: height 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.header-bottom + .header-hr {
  display: none;
}

.nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  height: 100%;
  margin: 0 -0.5rem;
  padding-left: 0;
  list-style: none;
}
.nav li {
  margin-right: 2.0625rem;
}

.nav-link {
  display: inline-flex;
  padding: 0.5rem;
  color: var(--theme-color-black);
  font-size: 0.9375rem;
  line-height: 2;
  text-transform: uppercase;
  text-decoration: none;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.nav-link:hover {
  color: var(--theme-color-white-400);
}

.logo-wrap {
  display: inline-flex;
  color: var(--theme-color-dark);
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.logo-wrap:hover {
  color: var(--theme-color-white-500);
}

.logo {
  display: block;
  width: auto;
  height: 1.5625rem;
}

.icon-menu,
.icon-close {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.icon-menu img,
.icon-close img {
  display: block;
  height: auto;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform, opacity;
}

.icon-menu img {
  width: 1.25rem;
}

.icon-close img {
  width: 0.975rem;
}

.btn-menu {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  background-color: transparent;
  border: none;
  width: 1.75rem;
  height: 1.75rem;
  margin-left: -0.25rem;
  font-size: var(--icon-width);
  cursor: pointer;
}
.btn-menu.open .icon-menu img, .btn-menu:not(.open) .icon-close img {
  visibility: hidden;
  opacity: 0;
  transform: scale(0.8);
}

.btn-menu-wrap {
  transition: flex-grow 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-bag {
  --icon-width: 1.425rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  background-color: transparent;
  border: none;
  width: 1em;
  font-size: var(--icon-width);
  border-radius: 0.25rem;
  cursor: pointer;
}
.btn-bag img {
  display: block;
  width: 1em;
  height: auto;
}

@media screen and (min-width: 992px) {
  .header {
    --header-top-h: 5.375rem;
    --header-bottom-h: 4.0625rem;
  }
  .header + * {
    --header-top-h: 5.375rem;
    --header-bottom-h-fix: 4.0625rem;
  }
  .header.scroll {
    --header-top-h: 3.75rem;
    --header-bottom-h: 0rem;
  }
  .header.scroll .header-top {
    padding-top: 0;
  }
  .header.scroll .header-top + .header-hr {
    position: relative;
    left: calc(50% + 1rem);
    width: 100vw;
    transform: translateX(-50%);
  }
  .header.scroll .header-bottom {
    padding-top: 0;
  }
  .header.scroll .header-bottom + .header-hr {
    display: none;
  }
  .header.scroll .header-hr {
    margin: 0 -1rem;
  }
  .header.scroll .btn-menu-wrap {
    flex-grow: 1;
  }
  .header-hr {
    margin: 0;
  }
  .header-top {
    padding-top: 0.3125rem;
  }
  .header-bottom {
    padding-top: 0.1875rem;
  }
  .header-bottom + .header-hr {
    display: block;
  }
  .btn-menu-wrap {
    overflow: hidden;
    flex-grow: 0;
  }
}
/* --- Footer --- */
.footer {
  padding-top: 5rem;
  padding-bottom: 1.8125rem;
  border-top: 1px solid var(--theme-color-white-900);
  color: var(--theme-color-black);
  overflow: hidden;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.footer-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: 1.375rem;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center left;
     object-position: center left;
}

.footer-wrap {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  margin-top: 2.875rem;
}

.footer-li {
  flex: 0 0 auto;
}
.footer-li:nth-child(2) {
  margin-top: 3.375rem;
}
.footer-li:nth-child(3) {
  margin-top: 3.6875rem;
}
.footer-li:nth-child(4) {
  margin-top: 4rem;
}

.footer-title {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.125;
  text-transform: uppercase;
}

.footer-text,
.footer-text-lg {
  margin-top: 1rem;
  font-size: 0.875rem;
  line-height: 1.375rem;
}
.footer-text p,
.footer-text-lg p {
  margin: 0;
}
.footer-text .lg,
.footer-text-lg .lg {
  display: none;
}

.footer-text-lg {
  line-height: 1.5625rem;
}
.footer-text-lg p {
  margin: -0.09375rem 0;
}

.footer-bottom {
  margin-top: 5.5625rem;
  text-transform: uppercase;
}

.copyright {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.308;
}

.media {
  display: block;
  margin-top: 1.5625rem;
  color: var(--theme-color-white-700);
  font-size: 0.6875rem;
  font-weight: 300;
  line-height: 0.9375rem;
}

@media not screen and (min-width: 992px) {
  .footer-text .sm,
  .footer-text-lg .sm {
    display: none;
  }
  .footer-text .lg,
  .footer-text-lg .lg {
    display: block;
  }
}
@media screen and (min-width: 992px) {
  .footer {
    padding-top: 7.5rem;
    padding-bottom: 3.375rem;
  }
  .footer-logo {
    height: 1.75rem;
  }
  .footer-wrap {
    flex-direction: row;
    justify-content: space-between;
    margin: 0 -2.625rem;
  }
  .footer-li {
    padding: 0 2.625rem;
  }
  .footer-li:nth-child(n) {
    width: 20rem;
    margin-top: 2.375rem;
  }
  .footer-title {
    font-size: 1.0625rem;
    line-height: 1.25rem;
  }
  .footer-text,
  .footer-text-lg {
    font-size: 1rem;
    line-height: 1.5625;
  }
  .footer-text-lg {
    line-height: 1.875;
  }
  .footer-text-lg p {
    margin: -0.15625rem 0;
  }
  .footer-bottom {
    margin-top: 8.4375rem;
  }
}
@media screen and (min-width: 1080px) {
  .footer-li:nth-child(n) {
    width: auto;
  }
}
@media screen and (min-width: 1440px) {
  .footer-wrap {
    justify-content: start;
  }
}
/* --- Float to top --- */
.btn-top-wrap {
  position: fixed;
  bottom: 5vh;
  right: 0;
  margin-right: 1rem;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: margin, bottom, z-index, opacity;
}
.btn-top-wrap.show {
  z-index: 30;
  pointer-events: auto;
  opacity: 1;
}

.btn-top {
  --btn-size: 3rem;
  outline: none;
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: var(--btn-size);
  height: var(--btn-size);
  padding: 0.25rem;
  color: var(--theme-color-white);
  background-color: transparent;
  font-size: 0.75rem;
  font-weight: bold;
  line-height: 1.25;
  text-align: center;
  text-transform: uppercase;
  border: none;
  border-radius: 99999px;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: width, height;
}
.btn-top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 0.4;
  transition-property: background-color, opacity;
  pointer-events: none;
}
.btn-top > * {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.btn-top span {
  display: block;
  width: 100%;
}
.btn-top img {
  display: block;
  width: 0.79375rem;
  height: auto;
  margin: 0.125rem auto 0 auto;
}
.btn-top:hover::before {
  background-color: var(--theme-color-dark);
  opacity: 0.95;
}

@media screen and (min-width: 992px) {
  .btn-top-wrap {
    bottom: 2vh;
    margin-right: 2rem;
  }
  .btn-top {
    --btn-size: 3.5rem;
  }
}
@media screen and (min-width: 1600px) {
  .btn-top-wrap {
    margin-right: 3.333%;
  }
  .btn-top {
    --btn-size: 4.125rem;
  }
}
/* --- Breadcrumb --- */
.breadcrumb {
  padding: 1.5rem 0;
  color: var(--theme-color-white-500);
  font-size: 0.75rem;
  font-weight: 300;
  line-height: 1rem;
  text-transform: uppercase;
}
.breadcrumb ol {
  margin: -0.5625rem 0 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.breadcrumb-item {
  margin-top: 0.5625rem;
  padding-right: 0.5625rem;
}
.breadcrumb-item::after {
  content: "/";
  float: right;
  padding-left: 0.5625rem;
}
.breadcrumb-item:last-child {
  padding-right: 0;
}
.breadcrumb-item:last-child::after {
  content: none;
}
.breadcrumb-item a {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.breadcrumb-item a:hover {
  color: var(--theme-color-white-400);
}
.breadcrumb-item.active {
  cursor: default;
}

@media screen and (min-width: 992px) {
  .breadcrumb {
    padding: 1.875rem 0;
    font-size: 0.875rem;
    line-height: 1.1875rem;
  }
}
/* --- Artists List --- */
.artists-container {
  margin-top: 3.0625rem;
}

.artists-row > * {
  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.artists-pagination {
  margin: 0 -0.5rem;
  padding: 6.25rem 0;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.card-artist {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.card-artist:hover .card-artist-title {
  color: var(--theme-color-white-400);
}

.card-artist-title {
  display: flex;
  align-items: center;
  padding: 1px 0;
  margin: 0;
  font-size: 1.625rem;
  font-weight: 600;
  line-height: 2rem;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.card-artist-content {
  margin-top: 0.875rem;
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.375rem;
  overflow: hidden;
}
.card-artist-content p {
  margin: -0.125rem 0;
}

.card-artist-header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  background-color: var(--theme-color-light);
	overflow: hidden;
}
.card-artist-header::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.card-artist-header img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
	 overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.card-artist:hover .card-artist-header img{
	-webkit-transform: scale3d(1.03, 1.03, 1);
    -moz-transform: scale3d(1.03, 1.03, 1);
    -ms-transform: scale3d(1.03, 1.03, 1);
    -o-transform: scale3d(1.03, 1.03, 1);
    transform: scale3d(1.03, 1.03, 1);
}
.card-artist-body {
  flex: 1 0 auto;
  padding: 1.875rem;
  padding-bottom: 1.75rem;
  min-height: 13.375rem;
  box-sizing: border-box;
}

@media screen and (min-width: 576px) {
  .artists-row > * {
    flex: 0 0 auto;
    width: 50%;
  }
	.card-artist-header img {
  height: 335px;
	}
	
}
@media screen and (min-width: 820px) {
  .artists-row > * {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
}
@media screen and (min-width: 992px) {
  .artists-container {
    margin-top: 3.375rem;
  }
  .artists-pagination {
    padding-top: 4.375rem;
    padding-bottom: 9.375rem;
  }
}
@media screen and (min-width: 1280px) {
  .artists-row > * {
    flex: 0 0 auto;
    width: 25%;
  }
	
}
/* --- All exhibitions List --- */
.exhibitions-tabs {
  margin-top: 1.5rem;
  text-transform: uppercase;
  overflow: hidden;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.exhibitions-tabs ul {
  --gutter-x: 0.625rem;
  --gutter-y: 0.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: calc(var(--gutter-y) * -1);
  margin-left: calc(var(--gutter-x) * -0.5);
  margin-right: calc(var(--gutter-x) * -0.5);
  margin-bottom: 0;
  padding: 0;
  list-style: none;
}
.exhibitions-tabs li {
  flex: 1 0 0;
  min-width: 8rem;
  width: 100%;
  max-width: 16.875rem;
  padding-left: calc(var(--gutter-x) * 0.5);
  padding-right: calc(var(--gutter-x) * 0.5);
  margin-top: var(--gutter-y);
  box-sizing: border-box;
}

.exhibitions-btn {
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 3.125rem;
  padding: 0.25rem 0.375rem;
  color: var(--theme-color-white-500);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.125rem;
  text-align: center;
  text-decoration: none;
  background-color: transparent;
  border: 1px solid var(--theme-color-white-900);
  border-radius: 0.3125rem;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: color, border-color, font-size, line-height;
}
.exhibitions-btn:hover {
  border-color: var(--theme-color-white-500);
}
.exhibitions-btn.active {
  color: var(--theme-color-black);
  border-color: var(--theme-color-black);
}

.exhibitions-container {
  margin-top: 3.125rem;
}

.exhibitions-row > * {
  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.exhibitions-pagination {
  margin: 0 -0.5rem;
  padding: 3.125rem 0 6.25rem 0;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 同.card-artist */
.card-exhibition {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.card-exhibition:hover .card-exhibition-title {
  color: var(--theme-color-white-400);
}
.card-exhibition:hover .card-exhibition-header img{
	-webkit-transform: scale3d(1.03, 1.03, 1);
    -moz-transform: scale3d(1.03, 1.03, 1);
    -ms-transform: scale3d(1.03, 1.03, 1);
    -o-transform: scale3d(1.03, 1.03, 1);
    transform: scale3d(1.03, 1.03, 1);
}
/* 同.card-artist-title */
.card-exhibition-title {
  display: flex;
  align-items: center;
  padding: 1px 0;
  margin: 0;
  font-size: 1.625rem;
  font-weight: 600;
  line-height: 2rem;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 同.card-artist-content */
.card-exhibition-content {
  margin-top: 0.875rem;
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.375rem;
  overflow: hidden;
}
.card-exhibition-content p {
  margin: -0.125rem 0;
}

.card-exhibition-status,
.card-exhibition-location {
  display: block;
  font-size: 0.875rem;
  line-height: 1.1875rem;
}

.card-exhibition-status {
  margin-bottom: 0.875rem;
  font-weight: 300;
  text-transform: uppercase;
}

.card-exhibition-location {
  margin-top: auto;
  color: var(--theme-color-white-500);
}
.card-exhibition-location span {
  display: block;
  margin-top: 1.8125rem;
}

.card-exhibition-header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  background-color: var(--theme-color-light);
	overflow: hidden;
}
.card-exhibition-header::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.card-exhibition-header img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
	overflow: hidden;
}

.card-exhibition-body {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  padding: 1.875rem 1.125rem 1.8125rem 1.25rem;
  min-height: 14.3125rem;
  background-color: var(--theme-color-white);
  box-sizing: border-box;
}

@media screen and (min-width: 576px) {
  .exhibitions-row > * {
    flex: 0 0 auto;
    width: 50%;
  }
}
@media screen and (min-width: 820px) {
  .exhibitions-row > * {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
}
@media screen and (min-width: 992px) {
  .exhibitions-tabs {
    margin-top: 1.8125rem;
  }
  .exhibitions-btn {
    font-size: 0.9375rem;
    line-height: 2rem;
  }
  .exhibitions-pagination {
    padding-top: 4.375rem;
    padding-bottom: 9.375rem;
  }
  .card-exhibition-body {
    padding-left: 1.875rem;
    padding-right: 1.625rem;
  }
}
/* --- About --- */
.about-container {
  padding-bottom: 6.25rem;
}

.about-imgs {
  overflow: hidden;
}
.about-imgs ul {
  --gutter-y: 0.625rem;
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  margin-top: calc(var(--gutter-y) * -1);
  padding: 0;
  list-style: none;
}
.about-imgs li {
  flex: 0 0 auto;
  width: 100%;
  margin-top: var(--gutter-y);
  box-sizing: border-box;
  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.about-img {
  position: relative;
  display: flex;
  background-color: var(--theme-color-light);
}
.about-img::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 75%;
}
.about-img img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.about-wrap {
  margin-top: 3.125rem;
  font-size: 1rem;
  line-height: 1.875;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.about-content {
  margin-top: 1.8125rem;
  overflow: hidden;
}
.about-content:first-child {
  margin-top: 0;
}
.about-content p {
  margin: -0.28125rem 0;
}

@media screen and (min-width: 992px) {
  .about-container {
    margin-top: 1.25rem;
    padding-bottom: 9.375rem;
  }
  .about-imgs li {
    width: 50%;
  }
  .about-wrap {
    margin-top: 4.375rem;
  }
}
/* --- Home --- */
.btn-view-all {
  outline: none;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 24rem;
  width: 100%;
  min-height: 3.125rem;
  margin: 0 auto;
  padding: 0.25rem 1rem;
  color: var(--theme-color-white);
  background-color: transparent;
  font-size: 0.9375rem;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 0.3125rem;
  box-sizing: border-box;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-width, min-height, font-size;
	cursor: pointer;
}
.btn-view-all::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  opacity: 0.3;
  transition: background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.btn-view-all span {
  position: relative;
  display: block;
  padding-top: 0.125rem;
}
.btn-view-all:hover::before {
  background-color: var(--theme-color-dark);
	opacity: 1;
}

.home-onview,
.home-past {
  padding-top: 3.125rem;
  padding-bottom: 6.25rem;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.home-past {
  background-color: var(--theme-color-white-900);
}

.home-onview-container,
.home-past-container {
  margin-top: 2.0625rem;
}

.home-onview-btns,
.home-past-btns {
  margin-top: 1.875rem;
}

.home-onview-row > *:nth-child(2n) .card-onview-body {
  right: auto;
  left: 0;
}

.card-onview {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.card-onview:hover .card-onview-title {
  color: var(--theme-color-white-700);
}

.card-onview-title {
  display: flex;
  align-items: center;
  padding: 0.125rem 0;
  margin: 0;
  font-size: 1.75rem;
  font-weight: 400;
  line-height: 2rem;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.card-onview-content {
  margin-top: 1.1875rem;
  font-size: 0.8125rem;
  font-weight: 300;
  line-height: 1.375rem;
  overflow: hidden;
}
.card-onview-content p {
  margin: -0.15625rem 0;
}

.card-onview-status {
  display: block;
  margin-bottom: 1.1875rem;
  font-size: 0.875rem;
  line-height: 1.1875rem;
  text-transform: uppercase;
}

.card-onview-location {
  display: block;
  margin-top: auto;
  font-size: 0.8125rem;
  line-height: 1.0625rem;
}
.card-onview-location span {
  display: block;
  margin-top: 2.4375rem;
}

.card-onview-header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  background-color: var(--theme-color-light);
	overflow: hidden;
}
.card-onview-header::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
  transition: padding-top 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.card-onview-header img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
	overflow: hidden;
-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.card-onview-body {
  position: relative;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  padding: 2.5rem 0.875rem 2.4375rem 1.25rem;
  min-height: 20.0625rem;
  width: 100%;
  max-width: 100%;
  color: var(--theme-color-white);
  box-sizing: border-box;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-width, width;
}
.card-onview-body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  opacity: 0.9;
  transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
.card-onview-body > div {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  height: 100%;
}
.card-onview:hover .card-onview-body::before{
	opacity: 1;
}
.card-onview:hover .card-onview-header img{
	-webkit-transform: scale3d(1.03, 1.03, 1);
    -moz-transform: scale3d(1.03, 1.03, 1);
    -ms-transform: scale3d(1.03, 1.03, 1);
    -o-transform: scale3d(1.03, 1.03, 1);
    transform: scale3d(1.03, 1.03, 1);
}
.home-contact {
  position: relative;
  padding-top: 6.4375rem;
  padding-bottom: 6.25rem;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.home-contact-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.home-contact-bg img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 59% center;
     object-position: 59% center;
  transition: object-position 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: object-position 280ms cubic-bezier(0.4, 0, 0.2, 1), -o-object-position 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.home-contact-bg ~ * {
  position: relative;
}

.home-contact-form {
  max-width: 44.375rem;
  margin: 1.5625rem auto 0 auto;
}
.home-contact-form .form-group {
  margin-top: 1.5625rem;
}
.home-contact-form .form-group:first-child {
  margin-top: 0;
}

.home-contact-form-btns {
  margin-top: 2.1875rem;
}

.home-banner {
  --header-top-h: 3.75rem;
  --header-bottom-h: 0rem;
  --swiper-pagination-bottom: 1.25rem;
  --swiper-pagination-bullet-size: 0.6125rem;
  --swiper-pagination-bullet-horizontal-gap: 0.46875rem;
  --swiper-pagination-bullet-inactive-color: var(--theme-color-white-800);
  --swiper-pagination-bullet-inactive-opacity: 0.7;
  --swiper-pagination-color: var(--theme-color-black);
  --swiper-pagination-bullet-opacity: 1;
  height: calc(100vh - var(--header-top-h) - var(--header-bottom-h));
  height: calc(100svh - var(--header-top-h) - var(--header-bottom-h));
  overflow: hidden;
}
.home-banner .swiper-pagination {
  display: flex;
  justify-content: center;
  max-width: 91.5rem;
  margin-left: 50%;
  transform: translateX(-50%);
  box-sizing: border-box;
}
.home-banner .swiper-pagination-bullet-active {
  border: 1px solid var(--theme-color-white);
}

.home-banner-item {
  position: relative;
  width: 100%;
  height: 100%;
}

.home-banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-light);
  overflow: hidden;
}
.home-banner-bg img {
  display: block;
  width: 100%;
  height: 100%;
  margin-left: 50%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  transform: translateX(-50%);
}

@media screen and (orientation: landscape) {
  .home-banner {
    min-height: 16rem;
  }
}
@media screen and (orientation: portrait) {
  .home-banner {
    min-height: 30rem;
  }
}
@media screen and (min-width: 576px) {
  .btn-view-all {
    min-height: 3.75rem;
    max-width: 17.5rem;
    font-size: 1.125rem;
  }
  .btn-view-all span {
    padding-top: 0.25rem;
  }
}
@media screen and (min-width: 768px) {
  .card-onview-title {
    padding: 0.15625rem 0;
    font-size: 2.375rem;
    line-height: 2.75rem;
  }
  .card-onview-status {
    font-size: 1rem;
    line-height: 1.3125rem;
  }
  .card-onview-location {
    font-size: 0.875rem;
    line-height: 1.1875rem;
  }
  .card-onview-body {
    position: absolute;
    padding: 5.625rem 2rem;
    width: 50%;
    max-width: 26.5625rem;
    height: 100%;
  }
  .card-onview-body::before {
    opacity: 0.7;
  }
  .home-contact-bg img {
    -o-object-position: center;
       object-position: center;
  }
}
@media screen and (min-width: 992px) {
  .home-onview,
  .home-past,
  .home-contact {
    padding-top: 6.25rem;
  }
  .home-onview-container,
  .home-past-container {
    margin-top: 3.0625rem;
  }
  .home-onview-btns,
  .home-past-btns {
    margin-top: 3.125rem;
  }
  .home-onview-row {
    --gutter-y: 3.125rem;
  }
  .home-onview-row > *:nth-child(2n+1) .card-onview {
    justify-content: flex-end;
  }
  .card-onview {
    flex-direction: row;
  }
  .card-onview-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
  .card-onview-body {
    position: relative;
    padding-left: 3.125rem;
    padding-right: 3.125rem;
  }
  .home-contact-form {
    margin-top: 1.625rem;
  }
  .home-banner {
    --header-top-h: 5.375rem;
    --header-bottom-h: 4.0625rem;
    --swiper-pagination-bottom: 1.875rem;
  }
  .home-banner .swiper-pagination {
    justify-content: flex-end;
    padding: 0 2rem;
  }
}
/* --- Exhibitions list 2 --- */
.exlist {
  position: relative;
}

.exlist-breadcrumb {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.exlist-breadcrumb .breadcrumb {
  color: var(--theme-color-white);
}

.exlist-banner {
  --header-top-h: 3.75rem;
  --header-bottom-h: 0rem;
  position: relative;
  height: calc(100vh - var(--header-top-h) - var(--header-bottom-h));
  height: calc(100svh - var(--header-top-h) - var(--header-bottom-h));
  overflow: hidden;
}

.exlist-banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-light);
  overflow: hidden;
}
.exlist-banner-bg img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.exlist-banner-mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  opacity: 0.3;
}

.exlist-banner-fg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  color: var(--theme-color-white);
}
.exlist-banner-fg::before {
  content: "";
  display: block;
  height: 38.148%;
  transition: height 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.exlist-banner-fg::after {
  content: "";
  display: block;
  height: 5%;
}

.exlist-banner-title,
.exlist-banner-subtitle {
  display: block;
  margin: 0;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  word-wrap: break-word;
  transition-property: font-size, line-height;
}

.exlist-banner-title {
  padding: 0.3125rem 0;
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1;
}

.exlist-banner-subtitle {
  margin-top: 1.1875rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  overflow: hidden;
}
.exlist-banner-subtitle > * {
  display: block;
  margin: -0.09375rem 0;
}

.exlist-highlight-container {
  margin-top: 3.0625rem;
  padding-bottom: 6.25rem;
}

.exlist-highlight-row {
  --gutter-y: 4.9375rem;
}

.card-exlist-highlight {
  display: flex;
  flex-direction: column;
}

.card-exlist-content {
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.875;
  overflow: hidden;
}
.card-exlist-content p {
  margin: -0.28125rem 0;
}

.card-exlist-header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  background-color: var(--theme-color-light);
}
.card-exlist-header::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.card-exlist-header img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: top;
     object-position: top;
}

.card-exlist-body {
  margin-top: 1.5625rem;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.exlist-sold-row > * {
  transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.exlist-sold-pagination {
  margin: 0 -0.5rem;
  padding: 3.125rem 0 8.125rem 0;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 同.card-artist */
.card-exlist-sold {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.card-exlist-sold:hover .card-exlist-sold-title {
  color: var(--theme-color-white-400);
}

/* 同.card-artist-title */
.card-exlist-sold-title {
  display: flex;
  align-items: center;
  padding: 1px 0;
  margin: 0;
  font-size: 1.625rem;
  font-weight: 400;
  line-height: 2rem;
  transition: color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.card-exlist-sold-content {
  margin-top: 0.875rem;
  font-size: 1rem;
  line-height: 1.25;
  overflow: hidden;
}
.card-exlist-sold-content p {
  margin: 0;
}

.card-exlist-sold-status {
  position: absolute;
  top: 0;
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0.5rem 0.625rem;
  font-size: 0.875rem;
  line-height: 1.1875rem;
  background-color: var(--theme-color-white);
  transform: translateY(-50%);
  box-shadow: inset 0 0 0 1px var(--theme-color-white-400);
  box-sizing: border-box;
}

.card-exlist-sold-currency {
  margin-top: 0.875rem;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.25;
  overflow: hidden;
}

.card-exlist-sold-header {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  background-color: var(--theme-color-light);
	overflow: hidden;
}
.card-exlist-sold-header::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.card-exlist-sold-header img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
	overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.card-exlist-sold:hover .card-exlist-sold-header img{
	-webkit-transform: scale3d(1.03, 1.03, 1);
    -moz-transform: scale3d(1.03, 1.03, 1);
    -ms-transform: scale3d(1.03, 1.03, 1);
    -o-transform: scale3d(1.03, 1.03, 1);
    transform: scale3d(1.03, 1.03, 1);
}
.card-exlist-sold-body {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  padding: 1.875rem 1.875rem 1.8125rem 1.875rem;
  min-height: 10.1875rem;
  box-sizing: border-box;
}

.exlist-info {
  margin-top: 3.75rem;
  margin-bottom: 6.25rem;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}
.exlist-info ul {
  --gutter-x: 0rem;
  --gutter-y: 3.6875rem;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--gutter-y) * -1);
  margin-left: calc(var(--gutter-x) * -0.5);
  margin-right: calc(var(--gutter-x) * -0.5);
  margin-bottom: 0;
  padding: 0;
  list-style: none;
}
.exlist-info li {
  flex: 0 0 auto;
  width: 100%;
  max-width: 100%;
  padding-left: calc(var(--gutter-x) * 0.5);
  padding-right: calc(var(--gutter-x) * 0.5);
  margin-top: var(--gutter-y);
  box-sizing: border-box;
}

.card-exlist-info {
  position: relative;
  height: 100%;
  transition: padding 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.card-exlist-info::before, .card-exlist-info::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  height: 100%;
  background-color: transparent;
  pointer-events: none;
  transition: background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.card-exlist-info::before {
  left: 0;
  transform: translateX(-50%);
}
.card-exlist-info::after {
  right: 0;
  transform: translateX(50%);
}
.card-exlist-info > * {
  position: relative;
}

.card-exlist-info-title {
  display: block;
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.3;
}

.card-exlist-info-subtitle {
  display: block;
  margin-top: 1.5rem;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25rem;
}

.card-exlist-info-content {
  margin-top: 1.1875rem;
  font-size: 1rem;
  line-height: 1.5625;
  overflow: hidden;
  word-wrap: break-word;
}
.card-exlist-info-content p {
  margin: -0.125rem 0;
}

@media screen and (min-width: 576px) {
  .exlist-sold-row > * {
    flex: 0 0 auto;
    width: 50%;
  }
}
@media screen and (min-width: 768px) {
  .exlist-highlight-row > *:nth-child(2n+1) .card-exlist-body {
    margin-left: 3rem;
  }
  .exlist-highlight-row > *:nth-child(2n) .card-exlist-highlight {
    flex-direction: row-reverse;
  }
  .exlist-highlight-row > *:nth-child(2n) .card-exlist-body {
    margin-right: 3rem;
  }
  .card-exlist-highlight {
    flex-direction: row;
  }
  .card-exlist-header {
    width: 50%;
  }
  .card-exlist-body {
    margin-top: 0;
    align-self: center;
  }
  .exlist-info li {
    width: 50%;
  }
  .card-exlist-info {
    min-height: 10rem;
    padding: 0 2rem;
  }
  .card-exlist-info::before, .card-exlist-info::after {
    background-color: var(--theme-color-white-800);
  }
}
@media screen and (min-width: 820px) {
  .exlist-sold-row > * {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
}
@media screen and (min-width: 992px) {
  .exlist-banner {
    height: 33.75rem;
  }
  .exlist-banner-fg::before {
    height: 43.333%;
  }
  .exlist-banner-title {
    padding: 0.1875rem 0;
    font-size: 3.75rem;
    line-height: 4.375rem;
  }
  .exlist-banner-subtitle {
    font-size: 1.25rem;
    line-height: 1.3;
  }
  .exlist-banner-subtitle > * {
    margin: 0;
  }
  .exlist-highlight-container {
    margin-top: 4.3125rem;
    padding-bottom: 9.375rem;
  }
  .exlist-highlight-row {
    --gutter-y: 6.25rem;
  }
  .exlist-highlight-row > *:nth-child(2n+1) .card-exlist-body {
    margin-left: 4.375rem;
  }
  .exlist-highlight-row > *:nth-child(2n) .card-exlist-highlight {
    flex-direction: row-reverse;
  }
  .exlist-highlight-row > *:nth-child(2n) .card-exlist-body {
    margin-right: 4.375rem;
  }
  .exlist-sold-pagination {
    padding-top: 4.375rem;
  }
  .exlist-info {
    margin-top: 6.25rem;
    margin-bottom: 9.0625rem;
  }
  .exlist-info li {
    width: 33.33333333%;
  }
}
@media screen and (min-width: 1920px) {
  .exlist-banner {
    height: 28.125vw;
    max-height: 44rem;
  }
}
/* --- Exhibitions detail --- */
.exdetail-container {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: 6.25rem;
}

.exdetail-swiper {
  --header-top-h: 3.75rem;
  --swiper-pagination-bottom: 0rem;
  --swiper-pagination-bullet-size: 0.6125rem;
  --swiper-pagination-bullet-horizontal-gap: 0.46875rem;
  --swiper-pagination-bullet-inactive-color: var(--theme-color-white-800);
  --swiper-pagination-bullet-inactive-opacity: 0.7;
  --swiper-pagination-color: var(--theme-color-black);
  --swiper-pagination-bullet-opacity: 1;
  position: relative;
  flex: 0 0 auto;
  align-self: flex-start;
  width: 100%;
  padding-bottom: 1.55rem;
}
.exdetail-swiper .swiper-pagination {
  display: flex;
  justify-content: center;
}

.exdetail-swiper-item {
  position: relative;
  cursor: pointer;
}
.exdetail-swiper-item:hover .btn-zoom {
  opacity: 1;
}

.exdetail-swiper-bg {
  display: flex;
  background-color: var(--theme-color-light);
}
.exdetail-swiper-bg::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.exdetail-swiper-bg img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
}

.btn-zoom-wrap {
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 0.625rem;
  margin-left: 0.625rem;
}

.btn-zoom {
  position: relative;
  outline: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  color: var(--theme-color-white);
  background-color: transparent;
  border: none;
  border-radius: 99999px;
  box-sizing: border-box;
  cursor: pointer;
  opacity: 0;
  transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-zoom::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  opacity: 0.25;
}
.btn-zoom img {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}

.exdetail-swiper-wrap {
  display: flex;
  background-color: var(--theme-color-light);
}
.exdetail-swiper-wrap::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.exdetail-swiper-wrap > * {
  width: 100%;
}

.exdetail-detail {
  margin-top: 2.6875rem;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.exdetail-detail-title {
  display: flex;
  align-items: center;
  padding: 0.1875rem 0;
  margin: 0;
  font-size: 2.25rem;
  font-weight: 600;
  line-height: 2.5rem;
}

.exdetail-detail-subtitle {
  display: block;
  margin-top: 0.75rem;
  margin-bottom: 0;
  font-size: 1.375rem;
  font-weight: 400;
  line-height: 1.8125rem;
}

.exdetail-detail-currency {
  padding: 0.09375rem 0;
  margin-top: 1.5rem;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.125;
}

.exdetail-detail-status-wrap {
  display: flex;
  margin-top: 0.75rem;
}

.exdetail-detail-status {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0.5rem 0.625rem;
  font-size: 0.875rem;
  line-height: 1.1875rem;
  background-color: var(--theme-color-white);
  box-shadow: inset 0 0 0 1px var(--theme-color-white-400);
  box-sizing: border-box;
}

.exdetail-detail-quantity {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1.5625rem;
  font-size: 1rem;
  line-height: 1.3125rem;
}
.exdetail-detail-quantity span {
  margin-right: 1.125rem;
}

.exdetail-detail-content {
  margin-top: 4.3125rem;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.875;
  overflow: hidden;
}
.exdetail-detail-content p {
  margin: -0.28125rem 0;
}

.exdetail-detail-btns-wrap {
  margin-top: 4.3125rem;
  overflow: hidden;
}

.exdetail-detail-btns {
  --gutter-x: 0.625rem;
  --gutter-y: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: calc(var(--gutter-y) * -1);
  margin-left: calc(var(--gutter-x) * -0.5);
  margin-right: calc(var(--gutter-x) * -0.5);
  transition: justify-content 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.exdetail-detail-btns > * {
  flex: 0 0 auto;
  width: 100%;
  max-width: 100%;
  padding-left: calc(var(--gutter-x) * 0.5);
  padding-right: calc(var(--gutter-x) * 0.5);
  margin-top: var(--gutter-y);
  box-sizing: border-box;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: width, max-width;
}

.exdetail-detail-btn-outline,
.exdetail-detail-btn {
  outline: none;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  width: 100%;
  min-height: 3.125rem;
  padding: 0.25rem 1rem;
  color: var(--theme-color-white);
  background-color: var(--theme-color-white);
  font-size: 0.9375rem;
  line-height: 1.25rem;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 0.3125rem;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-width, min-height, font-size;
}
.exdetail-detail-btn-outline::before,
.exdetail-detail-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: background-color, opacity;
  pointer-events: none;
}
.exdetail-detail-btn-outline span,
.exdetail-detail-btn span {
  position: relative;
  display: block;
  padding-top: 0.125rem;
}
.exdetail-detail-btn-outline:hover::before,
.exdetail-detail-btn:hover::before {
  background-color: var(--theme-color-dark);
  opacity: 0.95;
}

.exdetail-detail-btn-outline {
  color: var(--theme-color-black);
}
.exdetail-detail-btn-outline::before {
  background-color: transparent;
  border: 1px solid var(--theme-color-white-400);
}
.exdetail-detail-btn-outline:hover::before {
  background-color: var(--theme-color-white-900);
  opacity: 0.95;
}

.toast-cart {
  position: fixed;
  top: 46%;
  left: 50%;
  display: none;
  z-index: 40;
  opacity: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
  transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.toast-cart.show {
  display: block;
}
.toast-cart.fade {
  opacity: 1;
}

.toast-cart-wrap {
  --icon-size: 10rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--icon-size);
  height: var(--icon-size);
  color: var(--theme-color-white);
  font-size: 0.75rem;
  line-height: 1.1875rem;
  border-radius: 99999px;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: width, height;
}
.toast-cart-wrap::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  opacity: 0.8;
}
.toast-cart-wrap > * {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0.5rem;
  text-align: center;
}
.toast-cart-wrap img {
  display: block;
  width: 38.07%;
  height: auto;
  margin: 0 auto 0.625rem auto;
}

.exdetail-detail-modal .modal-body {
  max-height: 62vh;
  max-height: 62svh;
}

.exdetail-detail-modal-form {
  display: flex;
  flex-direction: column;
  max-width: 24rem;
  margin: 0 auto;
}
.exdetail-detail-modal-form .form-group {
  margin-bottom: 1.25rem;
}

.zoom-modal {
  height: 100vh;
}
.zoom-modal .modal-dialog {
  margin-top: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100%;
}
.zoom-modal .modal-wrap {
  height: 100vh;
}
.zoom-modal .modal-content {
  height: 100%;
  overflow: auto;
}
.zoom-modal .modal-content > img {
  display: block;
  width: 68.75rem;
  margin: 0 auto;
}
.zoom-modal .modal-content > img:not(.active) {
  display: none;
}
.zoom-modal .modal-close {
  position: fixed;
}

@media screen and (orientation: landscape) {
  .toast-cart {
    top: 50%;
  }
}
@media screen and (min-width: 576px) {
  .exdetail-detail-btns > * {
    width: 50%;
    max-width: 19rem;
  }
}
@media screen and (min-width: 768px) {
  .zoom-modal .modal-content > img {
    width: 100%;
  }
  .zoom-modal .modal-content > img:not(.active) {
    display: block;
  }
  .zoom-modal .modal-content > img + img {
    margin-top: 2rem;
  }
}
@media screen and (min-width: 992px) {
  .exdetail-container {
    flex-direction: row;
    margin-top: 1.1875rem;
    padding-bottom: 7.8125rem;
  }
  .exdetail-swiper {
    position: sticky;
    top: calc(var(--header-top-h) + 0.5rem);
    width: 48%;
  }
  .exdetail-detail {
    margin-top: 0;
    margin-left: 3.375rem;
  }
  .exdetail-detail-title {
    font-size: 2.8125rem;
    line-height: 3.1875rem;
  }
  .exdetail-detail-btns {
    justify-content: flex-start;
  }
  .exdetail-detail-btns > * {
    max-width: 13.125rem;
  }
  .toast-cart-wrap {
    --icon-size: 14.25rem;
    font-size: 0.875rem;
  }
  .toast-cart-wrap img {
    margin-bottom: 0.9375rem;
  }
  .exdetail-detail-modal-form {
    max-width: 31.75rem;
  }
}
@media screen and (min-width: 1200px) {
  .exdetail-swiper {
    width: 50%;
  }
  .exdetail-detail {
    margin-left: 4.375rem;
  }
  .zoom-modal .modal-content {
    padding-left: 10rem;
    padding-right: 10rem;
  }
}
/* --- Cart --- */
.btn-back {
  outline: none;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  color: var(--theme-color-white-200);
  font-size: 0.9375rem;
  background-color: #e5e5e5;
  border-radius: 0.3125rem;
  text-decoration: none;
  overflow: hidden;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: min-width, height, color, background-color, padding;
}
.btn-back svg {
  display: inline-block;
  width: 0.525rem;
  height: auto;
}
.btn-back:hover {
  color: var(--theme-color-white);
  background-color: var(--theme-color-white-700);
}

.btn-back-text {
  display: block;
  position: absolute;
  padding-top: 0.125rem;
  padding-left: 1.0625rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: none;
}

.cart-container {
  padding-bottom: 6.25rem;
}

.cart-breadcrumb {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 1.625rem;
  padding-bottom: 3.125rem;
}

.cart-breadcrumb-back {
  display: flex;
  align-items: center;
  margin-left: 1rem;
}

.cart-table {
  display: none;
  /* 同.visually-hidden */
}
.cart-table table {
  display: table;
  width: 100%;
  border-collapse: collapse;
}
.cart-table table > :not(caption) > * > * {
  border: 0px solid transparent;
}
.cart-table table > tbody > * > * {
  border-bottom-width: 1px;
  border-bottom-color: var(--theme-color-white-800);
}
.cart-table table > tbody > *:first-child > * {
  border-top-width: 1px;
  border-top-color: var(--theme-color-black);
}
.cart-table table > tbody > *:last-child > * {
  border-bottom-color: var(--theme-color-black);
}
.cart-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
}
.cart-table thead th:nth-child(1) {
  width: 10.25rem;
  min-width: 9rem;
}
.cart-table thead th:nth-child(2) {
  width: 31.428%;
}
.cart-table thead th:nth-child(3), .cart-table thead th:nth-child(5) {
  width: 15.714%;
}
.cart-table thead th:nth-child(4) {
  width: 14.571%;
}
.cart-table tbody td {
  text-align: center;
}
.cart-table tbody td:nth-child(2) {
  text-align: left;
}
.cart-table th {
  padding: 0 0.5rem 0.5rem 0.5rem;
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.0625rem;
  text-align: center;
}
.cart-table td {
  padding: 1.5625rem 0;
}

.cart-table-content {
  padding: 0 1.25rem;
}

.cart-list ul {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cart-list li {
  width: 100%;
}
.cart-list li:first-child .cart-item::before, .cart-list li:last-child .cart-item::after {
  background-color: var(--theme-color-black);
}

.cart-item {
  position: relative;
  padding: 1.5rem 0;
  box-sizing: border-box;
}
.cart-item::before, .cart-item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: var(--theme-color-white-800);
  pointer-events: none;
  transition: background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.cart-item::before {
  top: 0;
  transform: translateY(-50%);
}
.cart-item::after {
  bottom: 0;
  transform: translateY(50%);
}

.cart-item-wrap {
  position: relative;
  display: flex;
  align-items: flex-start;
}

.cart-item-header {
  flex: 0 0 auto;
  width: 26.239%;
}

.cart-item-img {
  position: relative;
  display: flex;
  background-color: var(--theme-color-light);
}
.cart-item-img::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.cart-item-img img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
}

.cart-item-body {
  flex: 1 0 0;
  width: 100%;
  max-width: 100%;
  margin-left: 1.25rem;
}

.cart-item-title {
  margin: 0;
  margin-bottom: 0.875rem;
  padding: 1px 0;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.375rem;
}

.cart-item-subtitle {
  margin: 0;
  margin-bottom: 2.5rem;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.25rem;
}

.cart-item-group {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}
.cart-item-group:last-child {
  margin-bottom: 0;
}
.cart-item-group label {
  flex: 0 0 auto;
  width: 34.5%;
  margin-right: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  text-transform: uppercase;
  word-wrap: break-word;
}
.cart-item-group > * {
  display: block;
  flex: 1 0 0;
}

.cart-item-text {
  font-size: 0.9375rem;
  line-height: 1.25rem;
}

.cart-number-group {
  --input-size: 2.5rem;
  display: inline-flex;
  align-items: center;
}
.cart-number-group > * {
  flex: 0 0 auto;
}

.cart-number-wrap {
  width: var(--input-size);
  height: var(--input-size);
  margin: 0 0.25rem;
}
.cart-number-wrap input {
  outline: none;
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.25;
  text-align: center;
  background-color: var(--theme-color-white);
  border-radius: 0.3125rem;
  border: none;
  box-sizing: border-box;
  transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.cart-number-wrap input[type=number]::-webkit-inner-spin-button, .cart-number-wrap input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
          appearance: none;
  margin: 0;
}
.cart-number-wrap input:focus {
  box-shadow: 0 0 0.05rem 0.1rem var(--theme-color-white-500);
}

.cart-number-btn {
  position: relative;
  outline: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: calc(var(--input-size) * 0.9);
  height: calc(var(--input-size) * 0.9);
  padding: 0;
  color: var(--theme-color-white-200);
  background-color: var(--theme-color-light);
  border: none;
  border-radius: 99999px;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: color, background-color;
}
.cart-number-btn span {
  position: relative;
  display: flex;
  align-items: center;
  width: 0.6875rem;
  height: 0.6875rem;
}
.cart-number-btn span::before, .cart-number-btn span::after {
  content: "";
  display: block;
  background-color: currentColor;
}
.cart-number-btn span::before {
  width: 100%;
  height: 0.1875rem;
}
.cart-number-btn span::after {
  position: absolute;
  top: 0;
  left: 50%;
  width: 0.1875rem;
  height: 100%;
  transform: translateX(-50%);
}
.cart-number-btn.minus span::after {
  display: none;
}
.cart-number-btn:hover {
  color: var(--theme-color-white);
  background-color: var(--theme-color-white-700);
}

.btn-remove {
  position: relative;
  outline: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2.625rem;
  height: 2.625rem;
  padding: 0;
  color: var(--theme-color-white-400);
  background-color: var(--theme-color-white);
  border: none;
  border-radius: 99999px;
  box-sizing: border-box;
  cursor: pointer;
}
.btn-remove::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: inherit;
  border: 1px solid var(--theme-color-white-900);
}
.btn-remove img {
  position: relative;
  display: block;
  width: 1.25rem;
  height: auto;
}
.btn-remove:hover::before {
  background-color: var(--theme-color-white-900);
}

.cart-subtotal {
  display: flex;
  flex-direction: column;
  margin-top: 2.5rem;
}

.cart-subtotal-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 2.4375rem;
  font-weight: 500;
}

.cart-subtotal-title,
.cart-subtotal-currency {
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: font-size, line-height;
}

.cart-subtotal-title {
  margin-right: 1.5rem;
  font-size: 0.9375rem;
  line-height: 1.375rem;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.cart-subtotal-currency {
  font-size: 1.25rem;
  line-height: 1.625rem;
}

.cart-subtotal-btns {
  display: flex;
  justify-content: center;
}

.cart-subtotal-btn {
  outline: none;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  width: 100%;
  min-height: 3.125rem;
  padding: 0.25rem 1rem;
  color: var(--theme-color-white);
  background-color: var(--theme-color-white);
  font-size: 0.9375rem;
  line-height: 1.25rem;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 0.3125rem;
  box-sizing: border-box;
  cursor: pointer;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-width, min-height, font-size;
}
.cart-subtotal-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--theme-color-black);
  border-radius: inherit;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: background-color, opacity;
  pointer-events: none;
}
.cart-subtotal-btn span {
  position: relative;
  display: block;
  padding-top: 0.125rem;
}
.cart-subtotal-btn:hover::before {
  background-color: var(--theme-color-dark);
  opacity: 0.95;
}

@media screen and (min-width: 576px) {
  .cart-subtotal-title {
    margin-left: auto;
  }
  .cart-subtotal-btns > * {
    max-width: 19rem;
  }
}
@media screen and (min-width: 768px) {
  .cart-subtotal-title {
    margin-right: 2.375rem;
    font-size: 1.125rem;
    line-height: 1.5rem;
  }
  .cart-subtotal-currency {
    font-size: 1.375rem;
    line-height: 1.8125rem;
  }
  .cart-subtotal-btns > * {
    max-width: 16.25rem;
  }
}
@media screen and (min-width: 992px) {
  .btn-back {
    justify-content: flex-start;
    min-width: 16.25rem;
    height: 3.125rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }
  .btn-back-text {
    position: static;
    opacity: 1;
    transition: opacity 280ms 150ms cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
  }
  .cart-container {
    padding-bottom: 9.375rem;
  }
  .cart-breadcrumb {
    padding-top: 3.125rem;
    padding-bottom: 4.375rem;
  }
  .cart-breadcrumb-back {
    min-height: 4.375rem;
  }
  .cart-table {
    display: block;
  }
  .cart-list {
    display: none;
  }
  .cart-item-title {
    padding: 0;
    font-size: 1.25rem;
    line-height: 1.875rem;
    overflow: hidden;
  }
  .cart-item-title > span {
    display: block;
    margin: -0.125rem 0;
  }
  .cart-item-subtitle {
    margin-bottom: 0.3125rem;
    font-size: 1rem;
  }
  .cart-item-text {
    font-size: 1rem;
  }
  .cart-subtotal-btns {
    justify-content: flex-end;
  }
}
@media screen and (min-width: 1200px) {
  .cart-table-content {
    padding-left: 1.875rem;
    padding-right: 1.875rem;
  }
}
/* --- Buyer information --- */
.info-container {
  padding-bottom: 6.25rem;
}

.info-breadcrumb {
  padding-top: 1.625rem;
  padding-bottom: 2.125rem;
}

.info-buy-info {
  margin-top: 2.75rem;
  padding: 3.125rem 0.9375rem;
  background-color: #f5f5f5;
}

/* 同.cart-table */
.info-table {
  display: none;
  /* 同.visually-hidden */
}
.info-table table {
  display: table;
  width: 100%;
  border-collapse: collapse;
}
.info-table table > :not(caption) > * > * {
  border: 0px solid transparent;
}
.info-table table > tbody > * > * {
  border-bottom-width: 1px;
  border-bottom-color: var(--theme-color-white-800);
}
.info-table table > tbody > *:first-child > * {
  border-top-width: 1px;
  border-top-color: var(--theme-color-black);
}
.info-table table > tbody > *:last-child > * {
  border-bottom-color: var(--theme-color-black);
}
.info-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
}
.info-table thead th:nth-child(1) {
  width: 10.25rem;
  min-width: 9rem;
}
.info-table thead th:nth-child(2) {
  width: 31.428%;
}
.info-table thead th:nth-child(3), .info-table thead th:nth-child(5) {
  width: 15.714%;
}
.info-table thead th:nth-child(4) {
  width: 14.571%;
}
.info-table tbody td {
  text-align: center;
}
.info-table tbody td:nth-child(2) {
  text-align: left;
}
.info-table th {
  padding: 0 0.5rem 0.5rem 0.5rem;
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.0625rem;
  text-align: center;
}
.info-table td {
  padding: 1.5625rem 0;
}

.info-table thead th:nth-child(1) {
  width: 10.25rem;
  min-width: 9rem;
}
.info-table thead th:nth-child(2) {
  width: auto;
}
.info-table thead th:nth-child(3), .info-table thead th:nth-child(5) {
  width: 17.46%;
}
.info-table thead th:nth-child(4) {
  width: 18.651%;
}

/* 同.cart-list */
.info-list ul {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.info-list li {
  width: 100%;
}
.info-list li:first-child .info-item::before, .info-list li:last-child .info-item::after {
  background-color: var(--theme-color-black);
}

/* 同.cart-item */
.info-item {
  position: relative;
  padding: 1.5rem 0;
  box-sizing: border-box;
}
.info-item::before, .info-item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: var(--theme-color-white-800);
  pointer-events: none;
  transition: background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}
.info-item::before {
  top: 0;
  transform: translateY(-50%);
}
.info-item::after {
  bottom: 0;
  transform: translateY(50%);
}

/* 同.cart-item-wrap */
.info-item-wrap {
  position: relative;
  display: flex;
  align-items: flex-start;
}

.info-item-header {
  flex: 0 0 auto;
  width: 28.754%;
}

.info-item-img {
  position: relative;
  display: flex;
  background-color: var(--theme-color-white);
}
.info-item-img::before {
  content: "";
  display: block;
  width: 0;
  padding-top: 100%;
}
.info-item-img img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
}

.info-item-body {
  flex: 1 0 0;
  width: 100%;
  max-width: 100%;
  margin-left: 0.625rem;
}

/* 同.cart-item-title */
.info-item-title {
  margin: 0;
  margin-bottom: 0.875rem;
  padding: 1px 0;
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.375rem;
}

/* 同.cart-item-subtitle */
.info-item-subtitle {
  margin: 0;
  margin-bottom: 2.5rem;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.25rem;
}

/* 同.cart-item-group */
.info-item-group {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}
.info-item-group:last-child {
  margin-bottom: 0;
}
.info-item-group label {
  flex: 0 0 auto;
  width: 34.5%;
  margin-right: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  text-transform: uppercase;
  word-wrap: break-word;
}
.info-item-group > * {
  display: block;
  flex: 1 0 0;
}

.info-item-group label {
  width: 41.314%;
}

/* 同.cart-item-text */
.info-item-text {
  font-size: 0.9375rem;
  line-height: 1.25rem;
}

/* 同.cart-subtotal */
.info-subtotal {
  display: flex;
  flex-direction: column;
  margin-top: 2.5rem;
}

/* 同.cart-subtotal-content */
.info-subtotal-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  font-weight: 500;
  margin-bottom: 0.625rem;
}

/* 同.cart-subtotal-title, .cart-subtotal-currency */
.info-subtotal-title,
.info-subtotal-currency {
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: font-size, line-height;
}

/* 同.cart-subtotal-title */
.info-subtotal-title {
  margin-right: 1.5rem;
  font-size: 0.9375rem;
  line-height: 1.375rem;
  transition: margin 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 同.cart-subtotal-currency */
.info-subtotal-currency {
  font-size: 1.25rem;
  line-height: 1.625rem;
}

.info-subtotal-note {
  display: flex;
  justify-content: flex-end;
  color: var(--theme-color-warning);
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.25rem;
}
.info-subtotal-note p {
  max-width: 100%;
  margin: 0;
}

/* 同.cart-subtotal-btns */
.info-subtotal-btns {
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
}

.info-form {
  width: 100%;
  max-width: 100%;
}

.info-form-note {
  display: flex;
  margin-bottom: 1.1875rem;
  color: var(--theme-color-warning);
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.25rem;
}
.info-form-note p {
  max-width: 100%;
  margin: 0;
}

.info-form-group,
.info-form-cml-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 0.9375rem;
  color: var(--theme-color-black);
}
.info-form-group label,
.info-form-cml-group label {
  flex: 0 0 auto;
  display: inline-block;
  width: 100%;
  margin-bottom: 0.24rem;
  vertical-align: text-bottom;
  text-transform: uppercase;
  font-size: 0.9375rem;
  line-height: 1.25rem;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: margin;
}
.info-form-group .required,
.info-form-cml-group .required {
  margin-left: 0.3125rem;
  color: var(--theme-color-danger);
}
.info-form-group:last-child,
.info-form-cml-group:last-child {
  margin-bottom: 0;
}

.info-form-cml-group {
  margin-bottom: 1.25rem;
}
.info-form-cml-group label {
  margin-bottom: 0.375rem;
  text-transform: none;
  font-size: 0.875rem;
  line-height: 1.1875rem;
}

.info-form-input,
.info-form-cml-input {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 3.125rem;
  background-color: var(--theme-color-white);
  border-radius: 0.3125rem;
}
.info-form-input input,
.info-form-input select,
.info-form-cml-input input,
.info-form-cml-input select {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0.5rem 1.75rem;
  font-size: 1rem;
  line-height: 1.25rem;
  background-color: transparent;
  border: 1px solid #c6c6c6;
  border-radius: inherit;
  box-sizing: border-box;
  outline: none;
  transition: none 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: box-shadow;
}
.info-form-input input:focus,
.info-form-input select:focus,
.info-form-cml-input input:focus,
.info-form-cml-input select:focus {
  font-size: 1rem;
  box-shadow: 0 0 0.05rem 0.05rem var(--theme-color-black);
}
.info-form-input select,
.info-form-cml-input select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding-right: 2.25rem;
}
.info-form-input select + .info-form-select-arrow,
.info-form-cml-input select + .info-form-select-arrow {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 0.78125rem;
  height: auto;
  margin-right: 0.875rem;
  transform: translateY(-50%);
}
.info-form-input select:focus,
.info-form-cml-input select:focus {
  font-size: 0.875rem;
  box-shadow: none;
}
.info-form-input select:hover,
.info-form-cml-input select:hover {
  box-shadow: 0 0 0.05rem 0.05rem var(--theme-color-black);
}

.info-form-radios {
  display: flex;
  flex-direction: column;
  max-width: 34.375rem;
  margin-top: 3.125rem;
}
.info-form-radios > * {
  margin-top: 1.25rem;
}
.info-form-radios > *:first-child {
  margin-top: 0;
}

.info-form-radio {
  --radio-size: 2.25rem;
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.info-form-radio > input {
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  overflow: hidden;
}
.info-form-radio > input:checked + label .info-radio-icon::after {
  opacity: 1;
}
.info-form-radio > input:checked ~ .info-form-commercial {
  display: block;
}
.info-form-radio > label {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
}

.info-radio-icon {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1em;
  height: 1em;
  font-size: var(--radio-size);
  border-radius: 99999px;
  color: inherit;
  background-color: var(--theme-color-white);
}
.info-radio-icon::before, .info-radio-icon::after {
  content: "";
  display: inline-block;
  border-radius: inherit;
  box-sizing: border-box;
}
.info-radio-icon::before {
  width: 100%;
  height: 100%;
  border: 1px solid currentColor;
}
.info-radio-icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1em;
  height: 1em;
  font-size: 0.611em;
  background-color: currentColor;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.info-radio-text {
  display: block;
  margin-left: 0.9375rem;
  padding: 1px 0;
}

.info-form-commercial {
  display: none;
  width: 100%;
  margin-top: 0.625rem;
  padding-left: calc(var(--radio-size) + 0.9375rem);
}

@media screen and (min-width: 576px) {
  /* 同.cart-subtotal-title */
  .info-subtotal-title {
    margin-left: auto;
  }
  /* 同.cart-subtotal-btns */
  .info-subtotal-btns > * {
    max-width: 19rem;
  }
  .info-subtotal-btns {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media screen and (min-width: 768px) {
  /* 同.cart-subtotal-title */
  .info-subtotal-title {
    margin-right: 2.375rem;
    font-size: 1.125rem;
    line-height: 1.5rem;
  }
  /* 同.cart-subtotal-currency */
  .info-subtotal-currency {
    font-size: 1.375rem;
    line-height: 1.8125rem;
  }
  /* 同.cart-subtotal-btns */
  .info-subtotal-btns > * {
    max-width: 16.25rem;
  }
}
@media screen and (min-width: 992px) {
  .info-container {
    padding-bottom: 9.6875rem;
  }
  .info-breadcrumb {
    padding-top: 3.125rem;
    padding-bottom: 3.125rem;
  }
  .info-buy-info {
    margin-top: 4.375rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .info-table {
    display: block;
  }
  .info-list {
    display: none;
  }
  /* 同.cart-item-title */
  .info-item-title {
    padding: 0;
    font-size: 1.25rem;
    line-height: 1.875rem;
    overflow: hidden;
  }
  .info-item-title > span {
    display: block;
    margin: -0.125rem 0;
  }
  /* 同.cart-item-subtitle */
  .info-item-subtitle {
    margin-bottom: 0.3125rem;
    font-size: 1rem;
  }
  /* 同.cart-item-text */
  .info-item-text {
    font-size: 1rem;
  }
  /* 同.cart-subtotal-btns */
  .info-subtotal-btns {
    justify-content: flex-end;
  }
  .info-form {
    max-width: 51.0625rem;
  }
  .info-form-group {
    flex-direction: row;
    align-items: center;
  }
  .info-form-group label {
    width: 12.485%;
    margin-right: 0.9375rem;
    margin-bottom: 0;
    padding-top: 0.125rem;
  }
  .info-form-radios {
    margin-top: 3.75rem;
  }
}
@media screen and (min-width: 1200px) {
  .info-buy-info,
  .info-subtotal-btns {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media screen and (min-width: 1600px) {
  .info-buy-info {
    padding: 4.375rem;
  }
  .info-subtotal-btns {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
/* --- 通用樣式 --- */
.block{
  display: block;
}
.flex{
  display: flex;
}
.table{
  display: table;
}
.hidden{
  display: none;
}
.h-full{
  height: 100%;
}
.justify-end{
  justify-content: flex-end;
}
.text-center{
  text-align: center;
}
.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
@media (min-width: 992px){
  .lg\:mt-5{
    margin-top: 1.25rem;
  }
}
/*tg1206*/
.btn-bag{
	position: relative;
	margin-right: 20px;
}
.cart-count-container {
    display: flex;
    white-space: nowrap;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 12px;
    border-radius: 50%;
    font-weight: 700;
    background: #000000;
    color: #fff;
    align-items: center;
    justify-content: center;
    width: 2.8ch;
    height: 2.8ch;
    position: absolute;
    top: -0.5rem;
    right: 1rem;
    left: 80% !important;
}
.cart-count-container span {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    font-weight: bold;
    letter-spacing: 0;
}
.artists-detail .exdetail-detail-currency a{
	color: #000000;
	text-decoration: none;
}
.artists-detail .exdetail-detail-currency a:hover{
	text-decoration: underline;
}
.result{
	padding-top: 5px;
}
.result-info{
	text-align: center;
}
.result-info h1{
	font-size: 54px;
	font-weight: 200;
	color: #0088FF;
}
.result-info p{
	font-size: 15px;
}
.result-info.fail h1{
	color: #FF5700;
}