전용관 수정 완료

kr/assets/css/promotion.css

@@ -47,13 +47,10 @@ html {
     transform: translateY(0);
   }
 }
-#promotion .hederWarp_n.sticky {
-  position: -webkit-sticky;
-  position: sticky;
+#promotion .hederWarp_n {
+  position: absolute;
   top: 0;
   left: 0;
-  width: 100%;
-  height: 100%;
   z-index: 100;
   background-color: #fff;
   transition: all 0.3s ease;
@@ -111,11 +108,11 @@ html {
   width: 100%;
 }
 #promotion .parallax-section.section1 {
-  height: calc(100vh - 5.6rem);
+  height: 100vh;
 }
 @media (min-width: 768px) {
   #promotion .parallax-section.section1 {
-    height: calc(100vh - 8rem);
+    height: 100vh;
   }
 }
 #promotion .parallax-section.section1 .parallax-bg {
@@ -159,6 +156,20 @@ html {
     height: 5rem;
   }
 }
+#promotion .parallax-section.section1 .logo-disney .copy {
+  display: block;
+  top: auto;
+  bottom: -2.4rem;
+  left: auto;
+  right: 0;
+  white-space: nowrap;
+  transform: none;
+}
+@media (min-width: 768px) {
+  #promotion .parallax-section.section1 .logo-disney .copy {
+    bottom: -5.4rem;
+  }
+}
 @media (min-width: 768px) {
   #promotion .parallax-section.section1 .logo-disney {
     right: 4rem;
@@ -406,7 +417,7 @@ html {
 }
 #promotion .section1 .section-content .content-item {
   position: absolute;
-  top: 40vw;
+  top: 44vw;
   left: 0;
   width: 100%;
   padding: 0 2rem;
@@ -417,7 +428,7 @@ html {
 @media (min-width: 768px) {
   #promotion .section1 .section-content .content-item {
     position: absolute;
-    top: 11vw;
+    top: 32rem;
     padding: 0;
     font-size: 2.8rem;
   }
@@ -455,7 +466,7 @@ html {
 #promotion .parallax-bg-wrap .parallax-bg.bg5 {
   background: url("../images/kia/promotion/section6.jpg") no-repeat center top/cover;
 }
-#promotion .section2 .section-content .content-item .copy {
+#promotion .parallax-section .section-content .content-item .copy {
   position: static;
   margin-top: 20rem;
   transform: none;
@@ -1387,10 +1398,12 @@ html {
   height: 100%;
 }
 #promotion .more-features .contentSection {
+  overflow: hidden;
   padding: 7.9rem 0;
 }
 @media (min-width: 768px) {
   #promotion .more-features .contentSection {
+    overflow: visible;
     max-width: 120rem;
     margin: 0 auto;
     padding: 7rem 0 12rem;

kr/assets/css/promotion.scss

@@ -39,16 +39,24 @@ html {
 }
 
 #promotion {
-  .hederWarp_n.sticky {
-    position: sticky;
+  .hederWarp_n {
+    position: absolute;
     top: 0;
     left: 0;
-    width: 100%;
-    height: 100%;
     z-index: 100;
     background-color: #fff;
     transition: all 0.3s ease;
   }
+  // .hederWarp_n.sticky {
+  //   position: sticky;
+  //   top: 0;
+  //   left: 0;
+  //   width: 100%;
+  //   height: 100%;
+  //   z-index: 100;
+  //   background-color: #fff;
+  //   transition: all 0.3s ease;
+  // }
   .contentWarp {
     max-width: 100%;
     margin-top: 0;
@@ -97,9 +105,9 @@ html {
     width: 100%;
 
     &.section1 {
-      height: calc(100vh - 5.6rem);
+      height: 100vh;
       @include tablet {
-        height: calc(100vh - 8rem);
+        height: 100vh;
       }
       .parallax-bg {
         position: relative;
@@ -135,6 +143,18 @@ html {
             height: 5rem;
           }
         }
+        .copy {
+          display: block;
+          top: auto;
+          bottom: -2.4rem;
+          left: auto;
+          right: 0;
+          white-space: nowrap;
+          transform: none;
+          @include tablet {
+            bottom: -5.4rem;
+          }
+        }
         @include tablet {
           right: 4rem;
           bottom: 6.6rem;
@@ -385,7 +405,7 @@ html {
       }
       .content-item {
         position: absolute;
-        top: 40vw;
+        top: 44vw;
         left: 0;
         width: 100%;
         padding: 0 2rem;
@@ -394,7 +414,7 @@ html {
         color: #fff;
         @include tablet {
           position: absolute;
-          top: 11vw;
+          top: 32rem;
           padding: 0;
           font-size: 2.8rem;
         }
@@ -440,7 +460,7 @@ html {
     }
   }
 
-  .section2 {
+  .parallax-section {
     .section-content {
       .content-item {
         .copy {
@@ -1407,8 +1427,10 @@ html {
   // More Features 탭 스타일
   .more-features {
     .contentSection {
+      overflow: hidden;
       padding: 7.9rem 0;
       @include tablet {
+        overflow: visible;
         max-width: 120rem;
         margin: 0 auto;
         padding: 7rem 0 12rem;