/** Shopify CDN: Minification failed

Line 178:2 Unexpected "{"
Line 178:3 Expected identifier but found "%"
Line 185:4 Unexpected "{"
Line 185:5 Expected identifier but found "%"
Line 189:2 Unexpected "{"
Line 189:3 Expected identifier but found "%"
Line 196:4 Unexpected "{"
Line 196:5 Expected identifier but found "%"

**/
.sale-box .sec11 .imgs .img::after {
  color: #fff;
}
/*  */
.sale-box .sec1 .box{
    padding-right: 10%;
}
.sale-box .left-text{
   /* text-align:right !important; */
}
.sale-box .left-text h3{
  max-width:100% !important;
}

.sale-box .sec18 {
  backdrop-filter: blur(10px);
  /* 背景模糊 */
  -webkit-backdrop-filter: blur(10px);
  /* 兼容老版本 Safari */
  background-image: unset;
  background-color: rgba(255, 255, 255, 0.5);
}
.sale-box .sec5 .buttons {
  flex-direction: column;
  color: #fff;
}

.sale-box .sec5 .buttons button {
  color: #fff;
  border-bottom-left-radius: 15px;
  border-top-right-radius: 15px;
  overflow: hidden;
  padding: 4% 10%;
  width: fit-content;
  margin-top: 3%;
  outline: 0;
  border: 0;
}

.layui-layer-title {
  font-family: 'Metropolis';
}

.layui-layer-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: 'Metropolis';
}

.layui-layer-content form {
  width: 88%;
}

.layui-layer-content .email {
  width: 100%;
}

.layui-layer-content input {
  width: 96%;
  margin: 0 auto 2%;
  font-size: 16px;
  padding: 0% 0%;
  height: 50px;
  outline: 0;
  border: 1px solid #000;
  color: #000;
}

.layui-layer-content .btn {
  background-image: linear-gradient(to right, #e6cba4, #a88257);
  cursor: pointer;
  color: #fff;
  border: 0;
  outline: 0;
  width: 100%;
  padding: 2% 2%;
}

.sale-box .sec3 .imgs .img:last-child .img- {
  transform: scale(1.2);
  transform-origin: center;
}

.sale-box .sec3 .imgs .img {
  padding: 0px;
  padding-bottom: 1%;
}

.sale-box .draw .sec6 .imgs .flex .img p span {
  font-size: 1.2em;
  vertical-align: baseline;
}

.s11 #comment-list .btns .btn {
  background-color: transparent;
  color: #fff;
  border: 0;
  background-image: linear-gradient(to right, #e6cba4, #a88257);
}

.sale-box .draw .sec5 .imgs {
  width: 80%;
}

.sale-box .draw .sec5 .imgs p {
  width: 50%;
}

.sale-box .draw .sec6 {
  margin-top: 6%;
  margin-bottom: 4%;
}

.sale-box .draw .sec6 .imgs .flex .img {
  padding-bottom: 1%;
}

.sale-box .draw .sec6 .imgs .flex .img .img- {
  width: 42%;
}

.sale-box .sec1 .page-pri-title {
  font-size: 120px;
  font-family: Metropolis;
}

.sale-box .sec1 .page-sub-title {
  font-size: 53px;
  font-family: Metropolis;
  padding-top: 0px;
}

@media screen and (min-width: 799px) {
.sale-box .sec1 .top {
  position: absolute;
  top: 200px;
  left: 45%  !important;
  width: 78%  !important; 
  z-index: 1;
  padding-top: 6%;
}
}

@media (max-width: 1900px) and (min-width: 801px) {
   .sale-box .left-text{
    padding-left: 0% !important;
  }
  .sale-box .sec1 .top .page-pri-title {
        font-size: calc(6.25vw + 30px) !important; 
    } 
    .sale-box .sec1 .top .page-sub-title {
      font-size: calc(3.25vw + 10px) !important; 
    }
    .sale-box .sec1 .top {
        top:10% !important;
        left: 55% !important;
    }
 }
@media screen and (max-width: 1680px) {
  .sale-box .draw .sec6 .imgs .flex .img .img- {
    width: 30%;
  }

  {% comment %} .sale-box .sec1 .top {
    position: absolute;
    top: 230px;
    left: 30px;
    width: 100%;
    z-index: 1;
    padding-top: 6%;
  } {% endcomment %}
}

@media screen and (max-width: 1440px) {
  {% comment %} .sale-box .sec1 .top {
    position: absolute;
    top: 150px;
    left: 30px;
    width: 100%;
    z-index: 1;
    padding-top: 6%;
  } {% endcomment %}
}

@media screen and (max-width: 1240px) {
  .sale-box .draw .sec5 .imgs button {
    border-bottom-left-radius: 10px;
    border-top-right-radius: 10px;
  }

  .sale-box .draw .sec6 .imgs .flex .img .img- {
    width: 40%;
  }
}

@media screen and (max-width: 800px) {
  .sale-box .draw .sec5 .imgs button {
    border-bottom-left-radius: 6px;
    border-top-right-radius: 6px;
  }

  .sale-box .sec8 {
    background-color: #4f4f4f;
    background-image: unset;
  }

  .layui-layer-content form {
    width: 80%;
  }
}

@media screen and (max-width: 660px) {
  .sale-box .draw .sec5 .imgs {
    width: 90%;
  }
}

@media screen and (max-width: 500px) {
}

/* .sale-box- .sec2 .imgs {
  padding: 0;
  background-color: #000;
} */

.sale-box- .sec2 .colors- {
  position: absolute;
  right: 10%;
  bottom: 15%;
  width: 50%;
  z-index: 2;
  text-align: right;
}

.sale-box- .sec2 .colors- .colors {
  position: static;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 4%;
}

.sale-box- .sec2 .colors .color {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-left: 4%;
  position: relative;
}

.sale-box- .sec2 .colors .color span {
  /* display: none; */
  border: 1px solid #fff;
  transform: scale(1.35);
  transform-origin: center;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  border-radius: 50%;
}

.sale-box- .sec2 .colors .color2 span {
  visibility: hidden;
}

.sale-box- .sec2 .img2 {
  clip-path: inset(0 0 100% 0);
}

.sale-box- .sec2 .p2 {
  opacity: 0.5;
}

.sale-box- .sec6 .box {
  padding-left: 0;
}

.sale-box- .sec6 .prev {
  left: 2%;
  color: #333;
}

.sale-box- .sec6 .next {
  right: 2%;
  color: #333;
}

.process-bar-img {
  margin: 10px 0;
}

.sale-box .sec2 .text1 {
  bottom: 65%;
}

.sale-box .sec2 .text2 {
  top: 65%;
}

.sale-box .sec4 .winners {
  width: 60%;
  margin: 0 auto;
  text-align:center;
}

.sale-box .sec4 .img1 {
  position: absolute;
  width: 25%;
  left: 5%;
  bottom: -5%;
}

.sale-box .sec4 .img2 {
  position: absolute;
  width: 30%;
  right: -2.7%;
  bottom: 0%;
}

.sale-box .sec4 .h {
  font-size: 32px;
  padding-bottom: 25px;
}

.sale-box .sec4 .p-mini {
  font-size: 19px;
  padding-bottom: 10px;
}

.sale-box .sec4 .please {
  width: max-content;
  background-color: rgba(163, 163, 163, 0.75);
  border-radius: 30px;
  overflow: hidden;
  margin: 0 auto;
  margin-top: 2%;
  padding: 1% 2%;
  margin-bottom: 4%;
}

.sale-box .sec4 .get {
  margin-top: 5%;
  padding-bottom: 25px;
}

@media screen and (min-width: 800px) {
  .sale-box- .page-header {
    display: flex;
    position: relative;
    justify-content: center;
  }

  .sale-box- .page-header .page-pri-title {
    position: absolute;
    top: 80px;
    font-size: 42px;
    font-family: Metropolis-Bold;
  }

  .sale-box- .page-header .page-sub-title {
    position: absolute;
    top: 140px;
    font-size: 27px;
    font-family: Metropolis;
  }

  .sale-box .sec2 .imgs {
    /*background-image: linear-gradient(to bottom, #afc0d7, #ebebeb);*/
  }

  .sale-box .draw .sec5 .imgs .early_bird_msg {
    text-align: left;
    position: absolute;
    width: 70%;
    left: 8%;
    color: #c9b07a;
    top: 21%;
    font-size: 13px;
  }

  .sale-box .draw .sec5 .imgs .early_bird_time {
    text-align: left;
    position: absolute;
    width: 70%;
    left: 8%;
    color: #c9b07a;
    top: 75%;
    font-size: 18px;
  }
}

@media screen and (max-width: 1680px) {
  .sale-box- .sec2 .colors .color {
    width: 30px;
    height: 30px;
  }
}

@media screen and (max-width: 1420px) {
  .sale-box- .sec2 .colors .color {
    width: 25px;
    height: 25px;
  }

  .sale-box- .sec6 .swiper-button-next:after,
  .sale-box- .sec6 .swiper-button-prev:after {
    font-size: 36px;
  }
}

@media screen and (max-width: 1040px) {
  .sale-box- .sec2 .colors .color {
    width: 20px;
    height: 20px;
  }
}

@media screen and (max-width: 799px) {
  .sale-box- .sec2 .colors- {
    top: 70%;
    left: 4%;
    text-align: left;
  }

  .sale-box- .sec2 .colors- .colors {
    display: block;
    margin-bottom: 12%;
  }

  .sale-box- .sec2 .colors- .colors p {
    color: #000;
    margin-bottom: 4%;
  }

  .sale-box- .sec6 .swiper-button-next:after,
  .sale-box- .sec6 .swiper-button-prev:after {
    font-size: 30px;
  }

  .sale-box- .page-header {
    display: flex;
    position: relative;
    justify-content: center;
  }

  .sale-box- .page-header .page-pri-title {
    position: absolute;
    top: 101px;
    font-size: 20px;
    font-family: Metropolis;
  }

  .sale-box- .page-header .page-sub-title {
    position: absolute;
    top: 134px;
    font-size: 15px;
    font-family: Metropolis;
  }

  .sec3 .gs_reveal,
  .sec6 .gs_reveal {
    font-weight: 500;
    font-size: 17px;
  }

  .sale-box .sec2 .text1 .black {
    font-weight: 500;
  }

  .sale-box .sec3 .imgs .img .text {
    padding: 0 10px;
  }

  .sale-box .sec3 .imgs .img .text p {
    font-size: 15px;
  }

  .sale-box .sec3 .imgs .img .text p .emphasize {
    font-size: 18px;
  }

  .sale-box .sec3 .imgs .img .text .p-mini {
    font-size: 10px;
    font-weight: 500;
  }

  .sale-box .draw .sec5 .imgs .early_bird_msg {
    text-align: left;
    position: absolute;
    width: 45%;
    left: 10%;
    color: #c9b07a;
    top: 15%;
    font-size: 10px;
  }

  .sale-box .draw .sec5 .imgs .early_bird_time {
    text-align: left;
    position: absolute;
    width: 68%;
    left: 10%;
    color: #c9b07a;
    top: 75%;
    font-size: 10px;
  }

  .sale-box .sec1 .left-text {
    text-align: center;
  }

  .sale-box .sec1 .top {
    position: absolute;
    width: 100%;
    z-index: 1;
    padding-top: 6%;
    top: 66%;
    left: 0;
  }

  .sale-box .sec1 .page-pri-title {
    font-size: 35px;
    font-family: Metropolis;
  }

  .sale-box .sec1 .page-sub-title {
    font-size: 18px;
    font-family: Metropolis;
    padding-top: 10px;
  }
}