Merge branch 'master' of https://gogs.interscope.i234.me/mo0647/splas

# Conflicts:
#	assets/css/style.css
#	assets/css/style.css.map
#	assets/scss/style.scss

assets/css/style.css

@@ -1506,6 +1506,232 @@ img {
   color: #ffffff;
 }
 
+/*===============================================
+에니메이션
+===============================================*/
+.floating {
+  animation: floating 3s ease-in-out infinite;
+}
+
+@keyframes bobUp {
+  0% {
+    transform: translateY(120vh);
+    opacity: 0;
+  }
+  80% {
+    opacity: 1;
+  }
+  100% {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+@keyframes bubbleFloat {
+  0% {
+    transform: translateY(0) scale(1);
+  }
+  50% {
+    transform: translateY(-12px) scale(1.05);
+  }
+  100% {
+    transform: translateY(0) scale(1);
+  }
+}
+@keyframes floating {
+  0% {
+    transform: translateY(0px);
+  }
+  50% {
+    transform: translateY(-20px);
+  }
+  100% {
+    transform: translateY(0px);
+  }
+}
+@keyframes fadeUpLogo {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+@keyframes fadeInRightH1 {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+@keyframes fadeInLeftH2 {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+@keyframes fadeUpH3 {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+@keyframes waveInRight {
+  0% {
+    opacity: 0;
+    transform: translateX(-100px);
+  }
+  60% {
+    opacity: 1;
+    transform: translateX(20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+@keyframes cloudMoveLeftToRight {
+  0% {
+    opacity: 0;
+    transform: translateX(-100px);
+  }
+  10% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  90% {
+    opacity: 1;
+    transform: translateX(300px);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(400px);
+  }
+}
+@keyframes floating-diag-1 {
+  0% {
+    transform: translate(0, 0);
+  }
+  20% {
+    transform: translate(-10px, 10px);
+  }
+  40% {
+    transform: translate(10px, -10px);
+  }
+  60% {
+    transform: translate(-10px, -10px);
+  }
+  80% {
+    transform: translate(10px, 10px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
+}
+@keyframes floating-diag-2 {
+  0% {
+    transform: translate(0, 0);
+  }
+  25% {
+    transform: translate(12px, -8px);
+  }
+  50% {
+    transform: translate(-12px, 8px);
+  }
+  75% {
+    transform: translate(8px, 12px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
+}
+@keyframes floating-diag-3 {
+  0% {
+    transform: translate(0, 0);
+  }
+  30% {
+    transform: translate(-8px, 12px);
+  }
+  60% {
+    transform: translate(8px, -12px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
+}
+@keyframes floating-diag-4 {
+  0% {
+    transform: translate(0, 0);
+  }
+  20% {
+    transform: translate(10px, 10px);
+  }
+  40% {
+    transform: translate(-10px, -10px);
+  }
+  60% {
+    transform: translate(10px, -10px);
+  }
+  80% {
+    transform: translate(-10px, 10px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
+}
+@keyframes shakeX {
+  0% {
+    transform: translateY(-50%) translateX(0);
+  }
+  10%, 30%, 50%, 70%, 90% {
+    transform: translateY(-50%) translateX(-8px);
+  }
+  20%, 40%, 60%, 80% {
+    transform: translateY(-50%) translateX(8px);
+  }
+  100% {
+    transform: translateY(-50%) translateX(0);
+  }
+}
+@keyframes shakeX2 {
+  0% {
+    transform: rotate(180deg) translateY(-50%) translateX(0);
+  }
+  10%, 30%, 50%, 70%, 90% {
+    transform: rotate(180deg) translateY(-50%) translateX(-8px);
+  }
+  20%, 40%, 60%, 80% {
+    transform: rotate(180deg) translateY(-50%) translateX(8px);
+  }
+  100% {
+    transform: rotate(180deg) translateY(-50%) translateX(0);
+  }
+}
+@keyframes bellRing {
+  0% {
+    transform: rotate(0deg);
+  }
+  10% {
+    transform: rotate(-18deg);
+  }
+  20% {
+    transform: rotate(16deg);
+  }
+  30% {
+    transform: rotate(-12deg);
+  }
+  40% {
+    transform: rotate(10deg);
+  }
+  50% {
+    transform: rotate(-6deg);
+  }
+  60% {
+    transform: rotate(4deg);
+  }
+  70% {
+    transform: rotate(-2deg);
+  }
+  80%, 100% {
+    transform: rotate(0deg);
+  }
+}
 @media (max-width: 1660px) {
   .evt--section01 .section--container .swiper--wrap .swiper-button-next,
   .evt--section01 .section--container .swiper--wrap .swiper-button-prev {
@@ -1967,11 +2193,48 @@ img {
   .evt--section03 .section--container .count--wrap .count--txt > p {
     font-size: 20px;
   }
+  .evt--section03 .section--container .count--wrap .count--txt .img--wrap .wch--l {
+    top: -60px;
+    left: -30px;
+  }
+  .evt--section03 .section--container .count--wrap .count--txt .img--wrap .wch--r {
+    top: -60px;
+    right: -40px;
+  }
   .evt--section03 .section--container .count--wrap .count--num .number {
     font-size: 40px;
     width: 60px;
     height: 80px;
   }
+  @keyframes bellRing {
+    0% {
+      transform: scale(0.5) rotate(0deg);
+    }
+    10% {
+      transform: scale(0.5) rotate(-18deg);
+    }
+    20% {
+      transform: scale(0.5) rotate(16deg);
+    }
+    30% {
+      transform: scale(0.5) rotate(-12deg);
+    }
+    40% {
+      transform: scale(0.5) rotate(10deg);
+    }
+    50% {
+      transform: scale(0.5) rotate(-6deg);
+    }
+    60% {
+      transform: scale(0.5) rotate(4deg);
+    }
+    70% {
+      transform: scale(0.5) rotate(-2deg);
+    }
+    80%, 100% {
+      transform: scale(0.5) rotate(0deg);
+    }
+  }
 }
 @media (max-width: 500px) {
   .evt--section01 .section--container .swiper--wrap {
@@ -2076,230 +2339,4 @@ img {
   .evt--section03 .section--container .count--wrap .count--num .number:nth-child(5) {
     margin-right: 10px;
   }
-}
-/*===============================================
-에니메이션
-===============================================*/
-.floating {
-  animation: floating 3s ease-in-out infinite;
-}
-
-@keyframes bobUp {
-  0% {
-    transform: translateY(120vh);
-    opacity: 0;
-  }
-  80% {
-    opacity: 1;
-  }
-  100% {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-@keyframes bubbleFloat {
-  0% {
-    transform: translateY(0) scale(1);
-  }
-  50% {
-    transform: translateY(-12px) scale(1.05);
-  }
-  100% {
-    transform: translateY(0) scale(1);
-  }
-}
-@keyframes floating {
-  0% {
-    transform: translateY(0px);
-  }
-  50% {
-    transform: translateY(-20px);
-  }
-  100% {
-    transform: translateY(0px);
-  }
-}
-@keyframes fadeUpLogo {
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-@keyframes fadeInRightH1 {
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-@keyframes fadeInLeftH2 {
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-@keyframes fadeUpH3 {
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-@keyframes waveInRight {
-  0% {
-    opacity: 0;
-    transform: translateX(-100px);
-  }
-  60% {
-    opacity: 1;
-    transform: translateX(20px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-@keyframes cloudMoveLeftToRight {
-  0% {
-    opacity: 0;
-    transform: translateX(-100px);
-  }
-  10% {
-    opacity: 1;
-    transform: translateX(0px);
-  }
-  90% {
-    opacity: 1;
-    transform: translateX(300px);
-  }
-  100% {
-    opacity: 0;
-    transform: translateX(400px);
-  }
-}
-@keyframes floating-diag-1 {
-  0% {
-    transform: translate(0, 0);
-  }
-  20% {
-    transform: translate(-10px, 10px);
-  }
-  40% {
-    transform: translate(10px, -10px);
-  }
-  60% {
-    transform: translate(-10px, -10px);
-  }
-  80% {
-    transform: translate(10px, 10px);
-  }
-  100% {
-    transform: translate(0, 0);
-  }
-}
-@keyframes floating-diag-2 {
-  0% {
-    transform: translate(0, 0);
-  }
-  25% {
-    transform: translate(12px, -8px);
-  }
-  50% {
-    transform: translate(-12px, 8px);
-  }
-  75% {
-    transform: translate(8px, 12px);
-  }
-  100% {
-    transform: translate(0, 0);
-  }
-}
-@keyframes floating-diag-3 {
-  0% {
-    transform: translate(0, 0);
-  }
-  30% {
-    transform: translate(-8px, 12px);
-  }
-  60% {
-    transform: translate(8px, -12px);
-  }
-  100% {
-    transform: translate(0, 0);
-  }
-}
-@keyframes floating-diag-4 {
-  0% {
-    transform: translate(0, 0);
-  }
-  20% {
-    transform: translate(10px, 10px);
-  }
-  40% {
-    transform: translate(-10px, -10px);
-  }
-  60% {
-    transform: translate(10px, -10px);
-  }
-  80% {
-    transform: translate(-10px, 10px);
-  }
-  100% {
-    transform: translate(0, 0);
-  }
-}
-@keyframes shakeX {
-  0% {
-    transform: translateY(-50%) translateX(0);
-  }
-  10%, 30%, 50%, 70%, 90% {
-    transform: translateY(-50%) translateX(-8px);
-  }
-  20%, 40%, 60%, 80% {
-    transform: translateY(-50%) translateX(8px);
-  }
-  100% {
-    transform: translateY(-50%) translateX(0);
-  }
-}
-@keyframes shakeX2 {
-  0% {
-    transform: rotate(180deg) translateY(-50%) translateX(0);
-  }
-  10%, 30%, 50%, 70%, 90% {
-    transform: rotate(180deg) translateY(-50%) translateX(-8px);
-  }
-  20%, 40%, 60%, 80% {
-    transform: rotate(180deg) translateY(-50%) translateX(8px);
-  }
-  100% {
-    transform: rotate(180deg) translateY(-50%) translateX(0);
-  }
-}
-@keyframes bellRing {
-  0% {
-    transform: rotate(0deg);
-  }
-  10% {
-    transform: rotate(-18deg);
-  }
-  20% {
-    transform: rotate(16deg);
-  }
-  30% {
-    transform: rotate(-12deg);
-  }
-  40% {
-    transform: rotate(10deg);
-  }
-  50% {
-    transform: rotate(-6deg);
-  }
-  60% {
-    transform: rotate(4deg);
-  }
-  70% {
-    transform: rotate(-2deg);
-  }
-  80%, 100% {
-    transform: rotate(0deg);
-  }
 }/*# sourceMappingURL=style.css.map */

assets/scss/style.scss

@@ -1311,6 +1311,155 @@ img{
     }
   }
 }
+
+
+
+
+
+
+/*===============================================
+에니메이션
+===============================================*/
+.floating {
+  animation: floating 3s ease-in-out infinite;
+}
+
+
+@keyframes bobUp {
+  0% { transform: translateY(120vh); opacity: 0; }
+  80% { opacity: 1; }
+  100% { transform: translateY(0); opacity: 1; }
+}
+
+// 둥둥 떠있는 효과
+@keyframes bubbleFloat {
+  0%   { transform: translateY(0) scale(1);}
+  50%  { transform: translateY(-12px) scale(1.05);}
+  100% { transform: translateY(0) scale(1);}
+}
+
+@keyframes floating {
+  0%   { transform: translateY(0px); }
+  50%  { transform: translateY(-20px); }
+  100% { transform: translateY(0px); }
+}
+
+@keyframes fadeUpLogo {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes fadeInRightH1 {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes fadeInLeftH2 {
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+@keyframes fadeUpH3 {
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes waveInRight {
+  0% {
+    opacity: 0;
+    transform: translateX(-100px);
+  }
+  60% {
+    opacity: 1;
+    transform: translateX(20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes cloudMoveLeftToRight {
+  0% {
+    opacity: 0;
+    transform: translateX(-100px);
+  }
+  10% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  90% {
+    opacity: 1;
+    transform: translateX(300px);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(400px);
+  }
+}
+
+@keyframes floating-diag-1 {
+  0%   { transform: translate(0, 0); }
+  20%  { transform: translate(-10px, 10px);}
+  40%  { transform: translate(10px, -10px);}
+  60%  { transform: translate(-10px, -10px);}
+  80%  { transform: translate(10px, 10px);}
+  100% { transform: translate(0, 0);}
+}
+@keyframes floating-diag-2 {
+  0%   { transform: translate(0, 0); }
+  25%  { transform: translate(12px, -8px);}
+  50%  { transform: translate(-12px, 8px);}
+  75%  { transform: translate(8px, 12px);}
+  100% { transform: translate(0, 0);}
+}
+@keyframes floating-diag-3 {
+  0%   { transform: translate(0, 0);}
+  30%  { transform: translate(-8px, 12px);}
+  60%  { transform: translate(8px, -12px);}
+  100% { transform: translate(0, 0);}
+}
+@keyframes floating-diag-4 {
+  0%   { transform: translate(0, 0);}
+  20%  { transform: translate(10px, 10px);}
+  40%  { transform: translate(-10px, -10px);}
+  60%  { transform: translate(10px, -10px);}
+  80%  { transform: translate(-10px, 10px);}
+  100% { transform: translate(0, 0);}
+}
+@keyframes shakeX {
+  0% { transform: translateY(-50%) translateX(0); }
+  10%, 30%, 50%, 70%, 90% { transform: translateY(-50%) translateX(-8px); }
+  20%, 40%, 60%, 80% { transform: translateY(-50%) translateX(8px); }
+  100% { transform: translateY(-50%) translateX(0); }
+}
+@keyframes shakeX2 {
+  0% { transform: rotate(180deg) translateY(-50%) translateX(0); }
+  10%, 30%, 50%, 70%, 90% { transform: rotate(180deg) translateY(-50%) translateX(-8px); }
+  20%, 40%, 60%, 80% { transform: rotate(180deg) translateY(-50%) translateX(8px); }
+  100% { transform: rotate(180deg) translateY(-50%) translateX(0); }
+}
+@keyframes bellRing {
+  0%   { transform: rotate(0deg); }
+  10%  { transform: rotate(-18deg); }
+  20%  { transform: rotate(16deg); }
+  30%  { transform: rotate(-12deg); }
+  40%  { transform: rotate(10deg); }
+  50%  { transform: rotate(-6deg); }
+  60%  { transform: rotate(4deg); }
+  70%  { transform: rotate(-2deg); }
+  80%, 100% { transform: rotate(0deg); }
+}
+
+
+
 @media(max-width: 1660px){
   .evt--section01{
     .section--container{
@@ -1881,6 +2030,16 @@ img{
           >p{
             font-size: 20px;
           }
+          .img--wrap{
+            .wch--l{
+              top:-60px;
+              left:-30px;
+            }
+            .wch--r{
+              top:-60px;
+              right:-40px;
+            }
+          }
         }
         .count--num{
           .number{
@@ -1892,6 +2051,18 @@ img{
       }
     }
   }
+
+  @keyframes bellRing {
+  0%   { transform:scale(.5) rotate(0deg); }
+  10%  { transform:scale(.5) rotate(-18deg); }
+  20%  { transform:scale(.5) rotate(16deg); }
+  30%  { transform:scale(.5) rotate(-12deg); }
+  40%  { transform:scale(.5) rotate(10deg); }
+  50%  { transform:scale(.5) rotate(-6deg); }
+  60%  { transform:scale(.5) rotate(4deg); }
+  70%  { transform:scale(.5) rotate(-2deg); }
+  80%, 100% { transform:scale(.5) rotate(0deg); }
+}
 }
 @media(max-width: 500px){
   .evt--section01{
@@ -2025,146 +2196,3 @@ img{
 }
 
 
-
-
-
-/*===============================================
-에니메이션
-===============================================*/
-.floating {
-  animation: floating 3s ease-in-out infinite;
-}
-
-
-@keyframes bobUp {
-  0% { transform: translateY(120vh); opacity: 0; }
-  80% { opacity: 1; }
-  100% { transform: translateY(0); opacity: 1; }
-}
-
-// 둥둥 떠있는 효과
-@keyframes bubbleFloat {
-  0%   { transform: translateY(0) scale(1);}
-  50%  { transform: translateY(-12px) scale(1.05);}
-  100% { transform: translateY(0) scale(1);}
-}
-
-@keyframes floating {
-  0%   { transform: translateY(0px); }
-  50%  { transform: translateY(-20px); }
-  100% { transform: translateY(0px); }
-}
-
-@keyframes fadeUpLogo {
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes fadeInRightH1 {
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes fadeInLeftH2 {
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-@keyframes fadeUpH3 {
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes waveInRight {
-  0% {
-    opacity: 0;
-    transform: translateX(-100px);
-  }
-  60% {
-    opacity: 1;
-    transform: translateX(20px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-@keyframes cloudMoveLeftToRight {
-  0% {
-    opacity: 0;
-    transform: translateX(-100px);
-  }
-  10% {
-    opacity: 1;
-    transform: translateX(0px);
-  }
-  90% {
-    opacity: 1;
-    transform: translateX(300px);
-  }
-  100% {
-    opacity: 0;
-    transform: translateX(400px);
-  }
-}
-
-@keyframes floating-diag-1 {
-  0%   { transform: translate(0, 0); }
-  20%  { transform: translate(-10px, 10px);}
-  40%  { transform: translate(10px, -10px);}
-  60%  { transform: translate(-10px, -10px);}
-  80%  { transform: translate(10px, 10px);}
-  100% { transform: translate(0, 0);}
-}
-@keyframes floating-diag-2 {
-  0%   { transform: translate(0, 0); }
-  25%  { transform: translate(12px, -8px);}
-  50%  { transform: translate(-12px, 8px);}
-  75%  { transform: translate(8px, 12px);}
-  100% { transform: translate(0, 0);}
-}
-@keyframes floating-diag-3 {
-  0%   { transform: translate(0, 0);}
-  30%  { transform: translate(-8px, 12px);}
-  60%  { transform: translate(8px, -12px);}
-  100% { transform: translate(0, 0);}
-}
-@keyframes floating-diag-4 {
-  0%   { transform: translate(0, 0);}
-  20%  { transform: translate(10px, 10px);}
-  40%  { transform: translate(-10px, -10px);}
-  60%  { transform: translate(10px, -10px);}
-  80%  { transform: translate(-10px, 10px);}
-  100% { transform: translate(0, 0);}
-}
-@keyframes shakeX {
-  0% { transform: translateY(-50%) translateX(0); }
-  10%, 30%, 50%, 70%, 90% { transform: translateY(-50%) translateX(-8px); }
-  20%, 40%, 60%, 80% { transform: translateY(-50%) translateX(8px); }
-  100% { transform: translateY(-50%) translateX(0); }
-}
-@keyframes shakeX2 {
-  0% { transform: rotate(180deg) translateY(-50%) translateX(0); }
-  10%, 30%, 50%, 70%, 90% { transform: rotate(180deg) translateY(-50%) translateX(-8px); }
-  20%, 40%, 60%, 80% { transform: rotate(180deg) translateY(-50%) translateX(8px); }
-  100% { transform: rotate(180deg) translateY(-50%) translateX(0); }
-}
-@keyframes bellRing {
-  0%   { transform: rotate(0deg); }
-  10%  { transform: rotate(-18deg); }
-  20%  { transform: rotate(16deg); }
-  30%  { transform: rotate(-12deg); }
-  40%  { transform: rotate(10deg); }
-  50%  { transform: rotate(-6deg); }
-  60%  { transform: rotate(4deg); }
-  70%  { transform: rotate(-2deg); }
-  80%, 100% { transform: rotate(0deg); }
-}