#loading, #enter {
  font-family: "Noto Sans TC", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  z-index: 999999;
}
#loading .inner, #enter .inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  overflow: hidden;
}
#loading .countdown, #enter .countdown {
  position: absolute;
  width: 13.8666666667%;
  top: 38%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
@media (min-width: 768px) {
  #loading .countdown, #enter .countdown {
    width: 9.9047619048%;
    top: 44.6759259259%;
  }
}
#loading .countdown img, #enter .countdown img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
}
#loading .countdown img:nth-child(1), #enter .countdown img:nth-child(1) {
  position: static;
}
#loading .countdown img.show, #enter .countdown img.show {
  opacity: 1;
}
#loading .per, #enter .per {
  position: absolute;
  top: 48.5%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #FFE7C5;
  font-size: 47px;
  font-family: "parfumerie-script";
}
@media (min-width: 768px) {
  #loading .per, #enter .per {
    top: 62%;
    font-size: 76px;
  }
}
#loading .hint, #enter .hint {
  position: absolute;
  top: 53%;
  left: 50%;
  transform: translate(-50%, 0);
  height: 6%;
}
@media (min-width: 768px) {
  #loading .hint, #enter .hint {
    top: 69%;
    height: 8%;
  }
}
#loading .hint img, #enter .hint img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  width: auto;
  height: 100%;
}
#loading .wine, #loading .wine img,
#loading .wine-m, #loading .wine-m img,
#loading .liquid, #loading .liquid img,
#loading .liquid-m, #loading .liquid-m img, #enter .wine, #enter .wine img,
#enter .wine-m, #enter .wine-m img,
#enter .liquid, #enter .liquid img,
#enter .liquid-m, #enter .liquid-m img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#loading .wine-m, #loading .wine,
#loading .liquid-m, #loading .liquid, #enter .wine-m, #enter .wine,
#enter .liquid-m, #enter .liquid {
  visibility: hidden;
}
#loading .wine-m img, #loading .wine img,
#loading .liquid-m img, #loading .liquid img, #enter .wine-m img, #enter .wine img,
#enter .liquid-m img, #enter .liquid img {
  opacity: 0;
}
#loading .wine-m img.show, #loading .wine img.show,
#loading .liquid-m img.show, #loading .liquid img.show, #enter .wine-m img.show, #enter .wine img.show,
#enter .liquid-m img.show, #enter .liquid img.show {
  opacity: 1;
}
#loading .wine-m, #loading .liquid-m, #enter .wine-m, #enter .liquid-m {
  display: block;
}
@media (min-width: 768px) {
  #loading .wine-m, #loading .liquid-m, #enter .wine-m, #enter .liquid-m {
    display: none;
  }
}
#loading .wine, #loading .liquid, #enter .wine, #enter .liquid {
  display: none;
}
@media (min-width: 768px) {
  #loading .wine, #loading .liquid, #enter .wine, #enter .liquid {
    display: block;
  }
}
#loading .btn, #enter .btn {
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform: translate(-50%, 50%);
  opacity: 0;
  display: none;
  padding: 6px 30px;
  color: #b2aa80;
  border: 1px solid #b2aa80;
  border-radius: 50px;
  cursor: pointer;
  transition: 0.2s;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: 0.1em;
  transition: background 0.2s, color 0.2s;
}
@media (min-width: 768px) {
  #loading .btn, #enter .btn {
    font-size: 18px;
  }
}
#loading .btn:hover, #enter .btn:hover {
  background: #b2aa80;
  color: #000;
}
#loading .question, #enter .question {
  display: none;
  position: absolute;
  width: 35%;
  bottom: 34%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
}
@media (min-width: 768px) {
  #loading .question, #enter .question {
    width: 16%;
    bottom: 22%;
  }
}
#loading .logo, #enter .logo {
  display: none;
  position: absolute;
  width: 30.2666666667%;
  top: 4.2708333333%;
  left: 50%;
  transform: translate(-50%, 0);
  opacity: 0;
}
@media (min-width: 768px) {
  #loading .logo, #enter .logo {
    width: 15.8571428571%;
    top: 6.2037037037%;
  }
}
#loading .mask, #enter .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#loading .btn1, #enter .btn1 {
  bottom: 31%;
}
@media (min-width: 768px) {
  #loading .btn1, #enter .btn1 {
    bottom: 18%;
  }
}
#loading .btn2, #enter .btn2 {
  bottom: 10%;
  border: none;
  font-family: "Montserrat", sans-serif;
  cursor: default;
}
@media (min-width: 768px) {
  #loading .btn2, #enter .btn2 {
    bottom: 11%;
  }
}
#loading .btn2:hover, #enter .btn2:hover {
  background: none;
  color: #b2aa80;
}
#loading .output, #enter .output {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}

#enter {
  position: relative;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}
#enter .liquid, #enter .liquid-m {
  visibility: visible;
}
#enter .liquid img, #enter .liquid-m img {
  opacity: 1;
}
#enter .logo, #enter .btn2 {
  display: block;
  opacity: 1;
}/*# sourceMappingURL=loading.css.map */