unika-components 1.0.430 → 1.0.431

package/dist/unika-components.css

@@ -1,103 +1,3 @@
-
-.ele-shape {
-  position: absolute;
-  overflow: hidden;
-}
-
-.ani-wrap {
-  width: 100%;
-  height: 100%;
-  box-sizing: border-box;
-}
-
-.e-shape {
-  width: 100%;
-  height: 100%;
-}
-
-.svg-container :deep(svg) {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
-
-.svg-loading,
-.svg-error {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-  background: rgba(0,0,0,0.05);
-}
-
-.ele-text {
-  position: relative;
-}
-
-.ele-text .ani-wrap {
-  width: 100%;
-  height: 100%;
-}
-
-.text-common {
-  padding: 5px;
-  text-orientation: upright;
-  white-space: pre-wrap;
-}
-
-/* 文本动画类 */
-.text-fadeIn {
-  animation: fadeIn 1s ease-in-out;
-}
-
-.text-slideIn {
-  animation: slideIn 1s ease-in-out;
-}
-
-.text-bounceIn {
-  animation: bounceIn 1s ease-in-out;
-}
-
-/* 基础动画关键帧 */
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes slideIn {
-  from {
-    transform: translateY(20px);
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-@keyframes bounceIn {
-  0% {
-    transform: scale(0.3);
-    opacity: 0;
-  }
-  50% {
-    transform: scale(1.05);
-    opacity: 0.8;
-  }
-  70% {
-    transform: scale(0.9);
-    opacity: 0.9;
-  }
-  100% {
-    transform: scale(1);
-    opacity: 1;
-  }
-}
 
 #audio {
   position: absolute;
@@ -170,104 +70,6 @@
     height: 2px;
     background: #fff;
   }
-
-.ele-img {
-  position: absolute;
-  overflow: hidden;
-}
-
-.ele-img .ani-wrap {
-  width: 100%;
-  height: 100%;
-}
-
-.ele-img .ele-image {
-  position: relative;
-  display: block;
-}
-
-.ele-img .rotate-wrap {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-}
-
-.ele-img .ele-img-bg,
-.ele-img .rotate-wrap .img-wrap {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-
-.ele-img .ele-bg-wrap {
-  width: 100%;
-  height: 100%;
-  background-size: cover;
-  background-position: 50% 50%;
-  background-repeat: no-repeat;
-  background-clip: border-box;
-}
-
-/* 动画关键帧 */
-@keyframes zoomIn {
-  from {
-    opacity: 0;
-    transform: scale(0.5);
-  }
-  to {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-.element-video {
-  position: absolute;
-  overflow: hidden;
-  background-color: #000;
-}
-
-.element-video .ani-wrap, .element-video img {
-    display: block;
-    width: 100%;
-    height: 100%;
-}
-
-.video-container {
-  width: 100%;
-  height: 100%;
-}
-
-.video-container iframe {
-  width: 100%;
-  height: 100%;
-  border: none;
-}
-
-.video-cover {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  background-size: cover;
-  background-position: center;
-  cursor: pointer;
-}
-
-.video-cover .play-btn {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: 50px;
-  height: 50px;
-  opacity: 0.8;
-  transition: opacity 0.2s;
-}
-
-.video-cover:hover .play-btn {
-  opacity: 1;
-}
 
 .element-ditu .ani-wrap {
     width: 100%;
@@ -315,117 +117,171 @@
     height: 100%;
 }
 
-.effect-container {
-  will-change: transform;
+.element-video {
+  position: absolute;
+  overflow: hidden;
+  background-color: #000;
 }
 
-.particles-wrapper {
-  position: relative;
+.element-video .ani-wrap, .element-video img {
+    display: block;
+    width: 100%;
+    height: 100%;
+}
+
+.video-container {
   width: 100%;
   height: 100%;
 }
 
-.particle {
-  position: absolute;
-  background-repeat: no-repeat;
-  background-size: contain;
-  animation-name: falling;
-  animation-timing-function: linear;
-  animation-iteration-count: infinite;
-  will-change: transform;
+.video-container iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
 }
 
-@keyframes falling {
-  0% {
-    transform: translateY(0) rotate(0deg);
-    opacity: 1;
-  }
-  80% {
-    opacity: 0.8;
-  }
-  100% {
-    transform: translateY(100vh) rotate(360deg);
-    opacity: 0;
-  }
-}
-.ele-lottie .ele-lotwrap {
-    overflow: hidden
+.video-cover {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-size: cover;
+  background-position: center;
+  cursor: pointer;
 }
 
-.ele-effect .effect-wrap {
-    position: relative;
-    overflow: hidden;
-    width: 100%;
-    height: 100%
+.video-cover .play-btn {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 50px;
+  height: 50px;
+  opacity: 0.8;
+  transition: opacity 0.2s;
 }
 
-.ele-effect .e-small {
-    position: absolute;
-    width: 24px;
-    height: 24px;
-    background-image: url(http://cdn.h5ds.com/static/images/snow.png);
-    background-size: cover;
-    background-repeat: no-repeat;
-    -webkit-transform-origin: center;
-    transform-origin: center;
-    -webkit-animation: snow 5s linear infinite;
-    animation: snow 5s linear infinite
-}
-
-.like-button {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  cursor: pointer;
-}
-
-.icon-heart {
-  font-size: 24px;
-  color: #e74c3c;
-}
-
-.liked {
-  color: #f00; /* 更改颜色以示已赞 */
-}
-
-.like-count {
-  margin-top: 4px;
-  font-size: 16px;
-  color: #333;
-}
-
-.ele-lottie .ele-lotwrap {
-  overflow: hidden;
-}
-
-.ele-effect .effect-wrap {
-  position: relative;
-  overflow: hidden;
-  width: 100%;
-  height: 100%;
-}
-
-.ele-effect .e-small {
-  position: absolute;
-  width: 24px;
-  height: 24px;
-  background-image: url(http://cdn.h5ds.com/static/images/snow.png);
-  background-size: cover;
-  background-repeat: no-repeat;
-  transform-origin: center;
-  animation: snow 5s linear infinite;
-}
-
-@keyframes snow {
-  0% {
-    transform: translateY(0) rotate(0deg);
-    opacity: 1;
-  }
-  100% {
-    transform: translateY(100vh) rotate(360deg);
-    opacity: 0;
-  }
+.video-cover:hover .play-btn {
+  opacity: 1;
 }
+
+.ele-img {
+  position: absolute;
+  overflow: hidden;
+}
+
+.ele-img .ani-wrap {
+  width: 100%;
+  height: 100%;
+}
+
+.ele-img .ele-image {
+  position: relative;
+  display: block;
+}
+
+.ele-img .rotate-wrap {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+}
+
+.ele-img .ele-img-bg,
+.ele-img .rotate-wrap .img-wrap {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.ele-img .ele-bg-wrap {
+  width: 100%;
+  height: 100%;
+  background-size: cover;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  background-clip: border-box;
+}
+
+/* 动画关键帧 */
+@keyframes zoomIn {
+  from {
+    opacity: 0;
+    transform: scale(0.5);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+.ele-text {
+  position: relative;
+}
+
+.ele-text .ani-wrap {
+  width: 100%;
+  height: 100%;
+}
+
+.text-common {
+  padding: 5px;
+  text-orientation: upright;
+  white-space: pre-wrap;
+}
+
+/* 文本动画类 */
+.text-fadeIn {
+  animation: fadeIn 1s ease-in-out;
+}
+
+.text-slideIn {
+  animation: slideIn 1s ease-in-out;
+}
+
+.text-bounceIn {
+  animation: bounceIn 1s ease-in-out;
+}
+
+/* 基础动画关键帧 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes slideIn {
+  from {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+@keyframes bounceIn {
+  0% {
+    transform: scale(0.3);
+    opacity: 0;
+  }
+  50% {
+    transform: scale(1.05);
+    opacity: 0.8;
+  }
+  70% {
+    transform: scale(0.9);
+    opacity: 0.9;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
 
 .ant-input-number {
   box-sizing: border-box;
@@ -461,13 +317,223 @@
   margin-bottom: 0px;
   vertical-align: top;
 }
+
+.ele-shape {
+  position: absolute;
+  overflow: hidden;
+}
+
+.ani-wrap {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+}
+
+.e-shape {
+  width: 100%;
+  height: 100%;
+}
+
+.svg-container :deep(svg) {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.svg-loading,
+.svg-error {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.05);
+}
+
+.ele-lottie .ele-lotwrap {
+  overflow: hidden;
+}
 
-/* 设计稿尺寸（如375px下20px的按钮） */
-.btn {
-  width: 20px;  /* 直接写设计稿px */
-  height: 10px;
-  font-size: 14px;
+.ele-effect .effect-wrap {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+}
+
+.ele-effect .e-small {
+  position: absolute;
+  width: 24px;
+  height: 24px;
+  background-image: url(http://cdn.h5ds.com/static/images/snow.png);
+  background-size: cover;
+  background-repeat: no-repeat;
+  transform-origin: center;
+  animation: snow 5s linear infinite;
 }
+
+@keyframes snow {
+  0% {
+    transform: translateY(0) rotate(0deg);
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(100vh) rotate(360deg);
+    opacity: 0;
+  }
+}
+
+.form-input {
+  position: absolute;
+}
+
+.input-wrapper {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  padding: 0 10px;
+  box-sizing: border-box;
+  position: relative;
+  transition: border-color 0.3s;
+}
+
+.required-marker {
+  font-size: 12px;
+  padding: 0 5px 0 0;
+  color: red;
+  vertical-align: middle;
+}
+
+input {
+  flex: 1;
+  border: none;
+  outline: none;
+  background: transparent;
+  height: 100%;
+  padding: 0;
+  margin: 0;
+}
+/* 
+input::placeholder {
+  color: #ccc;
+  opacity: 1;
+} */
+
+ .dynamic-placeholder-input::placeholder {
+  color: var(--placeholder-color, #999);
+  opacity: 1;
+}
+.dynamic-placeholder-input::-webkit-input-placeholder {
+  color: var(--placeholder-color, #999);
+}
+.dynamic-placeholder-input::-moz-placeholder {
+  color: var(--placeholder-color, #999);
+  opacity: 1;
+}
+.dynamic-placeholder-input:-ms-input-placeholder {
+  color: var(--placeholder-color, #999);
+}
+
+.ele-form {
+  position: absolute;
+  user-select: none;
+}
+
+.f-single {
+  cursor: pointer;
+}
+
+.ani-wrap {
+  position: relative;
+}
+
+.fs-tit {
+  display: flex;
+  padding: 0 5px;
+  height: 40px;
+  align-items: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  border-bottom: 1px solid rgba(153, 153, 153, 1);
+}
+
+.require {
+  padding: 0 5px 0 0;
+  color: red;
+  vertical-align: middle;
+}
+
+.f-single ul {
+  padding: 15px;
+  margin: 0;
+  list-style: none;
+}
+
+.f-single ul li {
+  display: flex;
+  align-items: center;
+  margin-top: 12px;
+  font-size: 0;
+}
+
+.f-single ul li:first-child {
+  margin-top: 0;
+}
+
+.fs-circle {
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  position: relative;
+  transition: all 0.2s;
+}
+
+.fs-circle.selected {
+  background-color: #2687f1;
+  border-color: #2687f1 !important;
+}
+
+.fs-circle.selected::after {
+  content: "";
+  position: absolute;
+  top: 3px;
+  left: 3px;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background-color: white;
+}
+
+.fs-txt {
+  display: inline-block;
+  width: calc(100% - 16px);
+  padding-left: 8px;
+  vertical-align: top;
+  word-break: break-all;
+  font-size: 14px;
+  line-height: 1.2;
+}
+
+.has-error .fs-tit {
+  border-bottom-color: #ff4d4f;
+}
+
+/* 错误提示样式 */
+.error-tip {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1000;
+}
+
+.uni-svg-component {
+  display: inline-block;
+}
 
 .ele-form {
   position: absolute;
@@ -584,10 +650,6 @@
   z-index: 1000;
 }
 
-.uni-svg-component {
-  display: inline-block;
-}
-
 .form-submit {
   cursor: pointer;
   transition: all 0.2s;
@@ -647,181 +709,10 @@
   cursor: pointer;
 }
 
-.tip-content {
-  font-size: 14px;
-  padding-top: 30px;
-  text-align: center;
-}
-
-  .global.video {
-    width: 35px;
-    height: 55px;
-    border-radius: 50%;
-    text-align: center;
-    margin-bottom: 5px;
-    border: 2px solid #fff;
-    cursor: pointer;
-  }
-  .icon-shipin2:before { content: "\E611"; }
-  .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
-  .global.video > span { font-size: 12px; line-height: 20px; display: block; position: relative; top: -4px;}
-  
-.ele-form {
-  position: absolute;
-  user-select: none;
-}
-
-.f-multiple {
-  cursor: pointer;
-}
-
-.ani-wrap {
-  position: relative;
-}
-
-.fs-tit {
-  display: flex;
-  padding: 0 5px;
-  height: 40px;
-  align-items: center;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  border-bottom: 1px solid rgba(153, 153, 153, 1);
-}
-
-.require {
-  padding: 0 5px 0 0;
-  color: red;
-  vertical-align: middle;
-}
-
-.f-multiple ul {
-  padding: 15px;
-  margin: 0;
-  list-style: none;
-}
-
-.f-multiple ul li {
-  margin-top: 12px;
-  font-size: 0;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-}
-
-.f-multiple ul li:first-child {
-  margin-top: 0;
-}
-
-.fs-circle {
-  display: inline-block;
-  width: 16px;
-  height: 16px;
-  border-radius: 50%;
-  position: relative;
-  transition: all 0.2s;
-}
-
-.fs-circle.selected {
-  background-color: #2687f1;
-  border-color: #2687f1 !important;
-}
-
-.fs-circle.selected::after {
-  content: "";
-  position: absolute;
-  top: 3px;
-  left: 3px;
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background-color: white;
-}
-
-.fs-txt {
-  display: inline-block;
-  width: calc(100% - 16px);
-  padding-left: 8px;
-  vertical-align: top;
-  word-break: break-all;
-  font-size: 14px;
-  line-height: 1.2;
-}
-
-.has-error .fs-tit {
-  border-bottom-color: #ff4d4f;
-}
-
-.form-input {
-  position: absolute;
-}
-
-.input-wrapper {
-  display: flex;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  padding: 0 10px;
-  box-sizing: border-box;
-  position: relative;
-  transition: border-color 0.3s;
-}
-
-.required-marker {
-  font-size: 12px;
-  padding: 0 5px 0 0;
-  color: red;
-  vertical-align: middle;
-}
-
-input {
-  flex: 1;
-  border: none;
-  outline: none;
-  background: transparent;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-}
-/* 
-input::placeholder {
-  color: #ccc;
-  opacity: 1;
-} */
-
- .dynamic-placeholder-input::placeholder {
-  color: var(--placeholder-color, #999);
-  opacity: 1;
-}
-.dynamic-placeholder-input::-webkit-input-placeholder {
-  color: var(--placeholder-color, #999);
-}
-.dynamic-placeholder-input::-moz-placeholder {
-  color: var(--placeholder-color, #999);
-  opacity: 1;
-}
-.dynamic-placeholder-input:-ms-input-placeholder {
-  color: var(--placeholder-color, #999);
-}
-
-.global.receipt {
-  width: 35px;
-  height: 55px;
-  border-radius: 50%;
-  text-align: center;
-  margin-bottom: 5px;
-  border: 2px solid #fff;
-  cursor: pointer;
-}
-.icon-liuyan:before { content: "\E636"; }
-.iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
-.global.receipt > span { font-size: 12px; line-height: 20px; display: block; }
-
-.form-container {
-  position: relative;
-  width: 100%;
-  height: 100%;
+.tip-content {
+  font-size: 14px;
+  padding-top: 30px;
+  text-align: center;
 }
 
 .ele-form {
@@ -829,7 +720,7 @@ input::placeholder {
   user-select: none;
 }
 
-.f-single {
+.f-multiple {
   cursor: pointer;
 }
 
@@ -854,20 +745,21 @@ input::placeholder {
   vertical-align: middle;
 }
 
-.f-single ul {
+.f-multiple ul {
   padding: 15px;
   margin: 0;
   list-style: none;
 }
 
-.f-single ul li {
-  display: flex;
-  align-items: center;
+.f-multiple ul li {
   margin-top: 12px;
   font-size: 0;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
 }
 
-.f-single ul li:first-child {
+.f-multiple ul li:first-child {
   margin-top: 0;
 }
 
@@ -909,18 +801,15 @@ input::placeholder {
 .has-error .fs-tit {
   border-bottom-color: #ff4d4f;
 }
+
+/* 设计稿尺寸（如375px下20px的按钮） */
+.btn {
+  width: 20px;  /* 直接写设计稿px */
+  height: 10px;
+  font-size: 14px;
+}
 
-/* 错误提示样式 */
-.error-tip {
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 1000;
-}
-
-  .global.map {
+  .global.video {
     width: 35px;
     height: 55px;
     border-radius: 50%;
@@ -929,10 +818,58 @@ input::placeholder {
     border: 2px solid #fff;
     cursor: pointer;
   }
-  .icon-daohang1:before { content: "\E612"; }
+  .icon-shipin2:before { content: "\E611"; }
   .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
-  .global.map > span { font-size: 12px; line-height: 20px; display: block;}
+  .global.video > span { font-size: 12px; line-height: 20px; display: block; position: relative; top: -4px;}
+  
+.like-button {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  cursor: pointer;
+}
+
+.icon-heart {
+  font-size: 24px;
+  color: #e74c3c;
+}
+
+.liked {
+  color: #f00; /* 更改颜色以示已赞 */
+}
+
+.like-count {
+  margin-top: 4px;
+  font-size: 16px;
+  color: #333;
+}
+
+  .global.tel {
+    width: 35px;
+    height: 55px;
+    border-radius: 50%;
+    text-align: center;
+    margin-bottom: 15px;
+    border: 2px solid #fff;
+    cursor: pointer;
+  }
+  .icon-dianhua:before { content: "\E60E"; }
+  .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
+  .global.tel > span { font-size: 12px; line-height: 20px; display: block;}
   
+.global.receipt {
+  width: 35px;
+  height: 55px;
+  border-radius: 50%;
+  text-align: center;
+  margin-bottom: 5px;
+  border: 2px solid #fff;
+  cursor: pointer;
+}
+.icon-liuyan:before { content: "\E636"; }
+.iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
+.global.receipt > span { font-size: 12px; line-height: 20px; display: block; }
+
 /* 字体定义 */
 @font-face {
     font-family: iconfont;
@@ -1345,181 +1282,53 @@ input::placeholder {
 }
 
 
-  .global.tel {
+.form-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+  .global.map {
     width: 35px;
     height: 55px;
     border-radius: 50%;
     text-align: center;
-    margin-bottom: 15px;
+    margin-bottom: 5px;
     border: 2px solid #fff;
     cursor: pointer;
   }
-  .icon-dianhua:before { content: "\E60E"; }
+  .icon-daohang1:before { content: "\E612"; }
   .iconfont { font-family: iconfont !important; font-size: 30px; font-style: normal; }
-  .global.tel > span { font-size: 12px; line-height: 20px; display: block;}
-  .count-down .drag-point {
-  cursor: default!important
-}
-
-.count-down .ani-wrap {
-  width: 100%;
-  height: 100%
-}
-
-.count-down .count-text,.count-down .finish-cont {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  height: 100%;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center
-}
-
-.count-down .finish-cont {
-  width: 100%
-}
-
-.count-down .count-flip {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  height: 100%;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center
-}
-
-.count-down .count-flip .numscroll {
-  -webkit-animation: numscroll .4s ease-in-out;
-  animation: numscroll .4s ease-in-out;
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both
-}
-
-.count-down .count-flip .numscroll .curr-num {
-  -webkit-transition: all .3s ease-in-out;
-  transition: all .3s ease-in-out;
-  opacity: .6;
-  -webkit-transform: scale(.5)!important;
-  transform: scale(.5)!important
-}
-
-@-webkit-keyframes numscroll {
-  0% {
-      -webkit-transform: translateZ(0);
-      transform: translateZ(0)
-  }
-
-  to {
-      -webkit-transform: translate3d(0,100%,0);
-      transform: translate3d(0,100%,0)
-  }
-}
-
-@keyframes numscroll {
-  0% {
-      -webkit-transform: translateZ(0);
-      transform: translateZ(0)
-  }
-
-  to {
-      -webkit-transform: translate3d(0,100%,0);
-      transform: translate3d(0,100%,0)
-  }
-}
-
-.count-down .count-flip .c-com {
-  min-width: 50px;
-  height: auto;
-  margin: 6px;
-  padding: 5px 0 6px;
-  background-color: #111
-}
-
-.count-down .count-flip .c-com .flex-wrap {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  position: relative;
-  width: 100%;
-  height: 100%;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center
-}
-
-.count-down .count-flip .c-com .flex-wrap .curr-num,.count-down .count-flip .c-com .flex-wrap .next-num {
-  line-height: 27px
-}
-
-.count-down .count-flip .c-com .flex-wrap .next-num {
+  .global.map > span { font-size: 12px; line-height: 20px; display: block;}
+  .button {
   position: absolute;
-  top: -100%
-}
-
-.count-down .count-flip .c-com .flex-wrap .curr-num {
-  -webkit-transform: scale(1);
-  transform: scale(1)
-}
-
-.count-down .bottom-center,.count-down .left-bottom,.count-down .left-center,.count-down .left-top,.count-down .right-bottom,.count-down .right-center,.count-down .right-top,.count-down .top-center {
-  display: none!important
-}
-
-.c-wrap {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  font-size: 0
-}
-
-.c-wrap.c-day-wrap {
-  text-align: center
-}
-
-.c-wrap.c-day-wrap .c-num {
-  width: auto
+  cursor: pointer;
+  user-select: none;
 }
-
-.c-wrap .c-num {
-  display: inline-block;
-  width: 50%;
+  
+.button .ani-wrap {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
   overflow: hidden;
-  font-size: 20px;
-  color: #999
+  transition: opacity 0.2s;
 }
-
-.c-wrap .c-left .flex-wrap {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: end;
-  -ms-flex-pack: end;
-  justify-content: flex-end
+  
+.button .ani-wrap:hover {
+  opacity: 0.9;
 }
 
-.c-wrap .c-text {
-  display: -webkit-box;
-  display: -ms-flexbox;
+.button-content {
   display: flex;
-  width: 100%;
-  font-size: 12px;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
   align-items: center;
-  white-space: nowrap
+  justify-content: center;
 }
 
+.btn-text {
+  margin-left: 10px;
+}
 @keyframes jumpheart {
   to {
     -webkit-transform: scale(1.2);
@@ -1861,7 +1670,169 @@ input::placeholder {
 }
 .icon-xingzhuangjiehe:before {
   content: "\E6A6";
-}.call {
+}.count-down .drag-point {
+  cursor: default!important
+}
+
+.count-down .ani-wrap {
+  width: 100%;
+  height: 100%
+}
+
+.count-down .count-text,.count-down .finish-cont {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: 100%;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center
+}
+
+.count-down .finish-cont {
+  width: 100%
+}
+
+.count-down .count-flip {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: 100%;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center
+}
+
+.count-down .count-flip .numscroll {
+  -webkit-animation: numscroll .4s ease-in-out;
+  animation: numscroll .4s ease-in-out;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both
+}
+
+.count-down .count-flip .numscroll .curr-num {
+  -webkit-transition: all .3s ease-in-out;
+  transition: all .3s ease-in-out;
+  opacity: .6;
+  -webkit-transform: scale(.5)!important;
+  transform: scale(.5)!important
+}
+
+@-webkit-keyframes numscroll {
+  0% {
+      -webkit-transform: translateZ(0);
+      transform: translateZ(0)
+  }
+
+  to {
+      -webkit-transform: translate3d(0,100%,0);
+      transform: translate3d(0,100%,0)
+  }
+}
+
+@keyframes numscroll {
+  0% {
+      -webkit-transform: translateZ(0);
+      transform: translateZ(0)
+  }
+
+  to {
+      -webkit-transform: translate3d(0,100%,0);
+      transform: translate3d(0,100%,0)
+  }
+}
+
+.count-down .count-flip .c-com {
+  min-width: 50px;
+  height: auto;
+  margin: 6px;
+  padding: 5px 0 6px;
+  background-color: #111
+}
+
+.count-down .count-flip .c-com .flex-wrap {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center
+}
+
+.count-down .count-flip .c-com .flex-wrap .curr-num,.count-down .count-flip .c-com .flex-wrap .next-num {
+  line-height: 27px
+}
+
+.count-down .count-flip .c-com .flex-wrap .next-num {
+  position: absolute;
+  top: -100%
+}
+
+.count-down .count-flip .c-com .flex-wrap .curr-num {
+  -webkit-transform: scale(1);
+  transform: scale(1)
+}
+
+.count-down .bottom-center,.count-down .left-bottom,.count-down .left-center,.count-down .left-top,.count-down .right-bottom,.count-down .right-center,.count-down .right-top,.count-down .top-center {
+  display: none!important
+}
+
+.c-wrap {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  font-size: 0
+}
+
+.c-wrap.c-day-wrap {
+  text-align: center
+}
+
+.c-wrap.c-day-wrap .c-num {
+  width: auto
+}
+
+.c-wrap .c-num {
+  display: inline-block;
+  width: 50%;
+  overflow: hidden;
+  font-size: 20px;
+  color: #999
+}
+
+.c-wrap .c-left .flex-wrap {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  justify-content: flex-end
+}
+
+.c-wrap .c-text {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  width: 100%;
+  font-size: 12px;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  white-space: nowrap
+}
+.call {
   position: absolute;
   cursor: pointer;
   user-select: none;
@@ -1904,34 +1875,6 @@ input::placeholder {
 
 .hb-tel:before {
     content: "\E642";
-}.button {
-  position: absolute;
-  cursor: pointer;
-  user-select: none;
-}
-  
-.button .ani-wrap {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  transition: opacity 0.2s;
-}
-  
-.button .ani-wrap:hover {
-  opacity: 0.9;
-}
-
-.button-content {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.btn-text {
-  margin-left: 10px;
 }/* Iconfont definition */
 .icon-danmuliebiao1:before {
     content: "\E68A";
@@ -4299,4 +4242,59 @@ input::placeholder {
       -webkit-transform: none;
       transform: none
   }
+}.ele-effect {
+  will-change: transform;
+}
+
+.ele-effect .effect-wrap {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+.particle {
+  position: absolute;
+  background-repeat: no-repeat;
+  background-size: contain;
+  animation-name: falling;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+  will-change: transform;
+}
+
+@keyframes falling {
+  0% {
+    transform: translateY(0) rotate(0deg);
+    opacity: 1;
+  }
+  80% {
+    opacity: 0.8;
+  }
+  100% {
+    transform: translateY(100vh) rotate(360deg);
+    opacity: 0;
+  }
+}
+.ele-lottie .ele-lotwrap {
+    overflow: hidden
+}
+
+.ele-effect .effect-wrap {
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+    height: 100%
+}
+
+.ele-effect .e-small {
+    position: absolute;
+    width: 24px;
+    height: 24px;
+    background-image: url(http://cdn.h5ds.com/static/images/snow.png);
+    background-size: cover;
+    background-repeat: no-repeat;
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-animation: snow 5s linear infinite;
+    animation: snow 5s linear infinite
 }