#stack-container { position: relative; width: 100%; height: 100vh; z-index: 10; } 

.slide { position: absolute; top: 0; left: 0; width: 100%; height: 100dvh; color: white; display: flex; align-items: center; justify-content: center; z-index: 1; transition: transform 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); } 

.slide-2 { transform: translateY(100%); } 
.slide-3 { transform: translateY(200%); } 
.slide-4 { transform: translateY(300%); } 
.slide-5 { transform: translateY(400%); } 
.slide-6 { transform: translateY(500%); } 
.slide-7 { transform: translateY(600%); } 
.slide-8 { transform: translateY(700%); } 

.slide.active { z-index: 10; } 


.slide { text-align: center; display: flex; justify-content: center; align-items: center; font-family: 'Pretendard', sans-serif; color: #fff; height: calc(var(--vh, 1vh) * 100); } 
.slide > div { position: relative; width: 100%; height: calc(var(--vh, 1vh) * 100); display: flex; align-items: center; justify-content: center; } 
.slide > div::after { content: ''; display: block; position: absolute; } 

/* 각 섹션마다 배경색 다르게 */
.slide-1 { background: #0d1f13; } 
.slide-2 { background: #A072FB; } 
.slide-3 { background: rgba(236, 231, 223, 1); } 
.slide-4 { background: #182419; color: #111; } 
.slide-5 { background: #3b82f6; } 
.slide-6 { background: #E6FF82; } 
.slide-7 { background: #3b82f6; } 
.slide-8 { background: #000; } 

.slide .content-wrap .img-wrap .img { opacity: 0; transition: all 1s ease-in-out; transition-delay: 1000ms; } 
.slide-2.active .content-wrap .img-wrap .img-01 { opacity: 1; } 

.slide .title-wrap { display: flex; flex-direction: column; justify-content: start; align-items: start; justify-content: center; padding: 0; } 
.slide .title { width: auto; height: 50px; margin-top: 15px; } 
.slide .main-title { font-family: Paperlogy; font-weight: 700; font-size: 54px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: #fff; margin-top: 0; margin-bottom: 0; } 
.slide .title-rround { width: 91px; height: 15px; } 
.slide .content-wrap { display: flex; width: 1000px; justify-content: space-between; position: relative; z-index: 10; /* padding: 0 20px; */ } 
.slide .content-wrap .img-wrap { position: relative; right: -65px; } 
 .slide .content-wrap .img-wrap::after { content: ''; position: absolute; box-shadow: -3.71px 4.64px 13px 0px rgba(0, 0, 0, 0.1), -13.93px 18.57px 23.21px 0px rgba(0, 0, 0, 0.09), -31.57px 41.79px 31.57px 0px rgba(0, 0, 0, 0.05), -55.71px 74.29px 37.14px 0px rgba(0, 0, 0, 0.01), -87.29px 116.07px 40.86px 0px rgba(0, 0, 0, 0); width: 95%; height: 98%; top: 1px; left: 10px; right: 0; bottom: 0; border-radius: 50px; } 
.slide .content-wrap .img-wrap .img { position: absolute; } 
.slide .text-wrap { text-align: left; } 

.slide .title-wrap .title-box span { color: #080934; font-family: Paperlogy; font-weight: 700; font-size: 20px; line-height: 120%; letter-spacing: -1px; text-transform: capitalize; margin-left: 6px; } 
.slide .btn-wrap { display: flex; gap: 0 6px; margin-top: 100px; } 
.slide .btn-wrap .btn-down { position: relative; display: flex; align-items: center; justify-content: center; border-radius: 100px; background: rgba(255, 255, 255, 0.2); font-family: Poppins; font-weight: 500; font-size: 13px; line-height: 150%; letter-spacing: 0px; text-align: center; color: #fff; text-decoration: none; height: 50px; padding: 0 18px; } 
.slide .btn-wrap .btn-down::before { content: ''; display: block; margin-right: 8px; } 
.slide .btn-wrap .btn-down.apple::before { background: url(../images/common/icon-apple.png) no-repeat center / contain; width: 15px; height: 18px; } 
.slide .btn-wrap .btn-down.google::before { background: url(../images/common/icon-google.png) no-repeat center / contain; width: 18px; height: 18px; } 
.slide .img-wrap img { width: 260px; height: 523px; position: relative; z-index: 100; } 

.slide-1 .text-wrap { margin-top: 50px; } 
.slide-1 .logo-img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 19px;
}
.slide-1 .logo-img-wrap .beta {
  position: relative;
  top: -17px;
  margin-left: 6.75px;
  width: 46px;
  height: 28px;
}

.slide-2 > div::after { content: ''; display: block; position: absolute; right: 0; width: 50%; height: 100%; background: rgba(236, 231, 223, 1); } 
.slide-2 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: #080934; margin-top: 20px; margin-bottom: 40px; } 
.slide .title-wrap .title-box { display: flex; align-items: center; } 
.slide-2 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: #080934; text-align: left; margin: 0; } 
.slide-2 .content-wrap .img-wrap .img-01 { width: 128px; height: 121px; background: url(../images/common/mo-section-2-item-3.png) no-repeat center / contain; top: 27.63vw; left: 60px; z-index: 10; } 
.slide-2 .content-wrap .img-wrap .img-02 { width: 240px; height: 240px; background: url(../images/common/mo-section-2-item-2.png) no-repeat center / contain; top: 12.15vh; left: 0px; } 
.slide-2 .content-wrap .img-wrap .img-03 { width: 149px; height: 223px; background: url(../images/common/mo-section-2-item-1.png) no-repeat center / contain; top: 14.7vh; left: 40px; z-index: 10; } 
.slide-2.active .content-wrap .img-wrap .img-01 { top: 13.63vw; left: 270px; opacity: 1; } 
.slide-2.active .content-wrap .img-wrap .img-02 { top: 2.15vh; left: -130px; opacity: 1; z-index: -1; } 
.slide-2.active .content-wrap .img-wrap .img-03 { top: -12.3vh; left: 230px; opacity: 1; } 

.slide-3 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: #1A1A1A; margin-top: 20px; margin-bottom: 40px; } 
.slide-3 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: #080934; text-align: left; margin: 0; } 
.slide-3 .content-wrap .img-wrap .img { opacity: 1; } 
.slide-3 .content-wrap .img-wrap .img-01 { width: 184px; height: 184px; background: url(../images/common/pc-section-3-item-1.png) no-repeat center / contain; top: 66px; left: 126px; z-index: 1; } 
.slide-3 .content-wrap .img-wrap .img-02 { width: 184px; height: 184px; background: url(../images/common/pc-section-3-item-2.png) no-repeat center / contain; top: 174px; left: 0px; z-index: 200; } 
.slide-3 .content-wrap .img-wrap .img-03 { width: 150px; height: 150px; background: url(../images/common/pc-section-3-item-3.png) no-repeat center / contain; top: 320px; left: 40px; z-index: 1; } 
.slide-3.active .content-wrap .img-wrap .img-01 { top: 66px; left: 256px; opacity: 1; } 
.slide-3.active .content-wrap .img-wrap .img-02 { top: 174px; left: -117px; opacity: 1; } 
.slide-3.active .content-wrap .img-wrap .img-03 { top: 320px; left: 216px; opacity: 1; } 

.slide-4 .phoneFrame { position: relative; overflow: hidden; width: 260px; height: 523px; background: url(../images/common/phone.png) no-repeat center / contain; z-index: 111; /* 배경 프레임 */ } 
.slide-4 .imgFrame { position: absolute; top: 17px; left: 18px; width: 225px; height: 489px; overflow: hidden; } 
.phoneFrame .screen { position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 0; /* phone.png 보다 아래는 아님 */ } 

.slide-4 .imgFrame img { top: 100%; transition: 0.8s; transition-delay: 1s; position: absolute; left: 0; top: 0; transform: translateY(0); width: 100%; height: auto; transition: all 2s ease-in-out; } 
.slide-4.active .imgFrame img { width: 100%; transform: translateY(-50%); transition-delay: 1s; } 

.slide-4 > div::after { content: ''; display: block; position: absolute; right: 0; width: 50%; height: 100%; background: rgba(230, 255, 130, 1); } 
.slide-4 .title-wrap .title-box span { color: #E6FF82; } 
.slide-4 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: #E6FF82; margin-top: 20px; margin-bottom: 40px; } 
.slide-4 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: #EEF2EC; text-align: left; margin: 0; } 

.slide-5 .title-wrap .title-box span { color: rgba(230, 255, 130, 1); } 
.slide-5 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: rgba(230, 255, 130, 1); margin-top: 20px; margin-bottom: 40px; } 
.slide-5 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: rgba(238, 242, 236, 1); text-align: left; margin: 0; } 
.slide.slide-5 .content-wrap .img-wrap { display: flex; } 
.slide.slide-5 .content-wrap .img-wrap::after { display: none; } 
.slide.slide-5 .content-wrap .img-wrap img { opacity: 0; } 
.slide-5 .content-wrap .img-wrap .img { opacity: 1; display: none; } 
.slide-5 .content-wrap .img-wrap .img-01 { width: 184px; height: 184px; background: url(../images/common/pc-section-5-item-1.png) no-repeat center / contain; top: 125px; left: -170px; z-index: 100; } 
.slide-5 .content-wrap .img-wrap .img-02 { width: 316px; height: 172px; background: url(../images/common/pc-section-5-item-2.png) no-repeat center / contain; top: 306px; left: 210px; z-index: 100; } 
.slide-5.active .content-wrap .img-wrap .img-01 { left: -80px; opacity: 1; } 
.slide-5.active .content-wrap .img-wrap .img-02 { top: 396px; left: 130px; opacity: 1; } 

.slide-6 .title-wrap .title-box span { color: #1a1a1a; } 
.slide-6 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: #1a1a1a; margin-top: 20px; margin-bottom: 40px; } 
.slide-6 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: #1a1a1a; text-align: left; margin: 0; } 
.slide.slide-6 .content-wrap .img-wrap { display: flex; } 
.slide.slide-6 .content-wrap .img-wrap::after { display: none; } 
.slide.slide-6 .content-wrap .img-wrap img { opacity: 0; } 
.slide-6 .content-wrap .img-wrap .img { opacity: 1; display: none; } 
.slide-6 .content-wrap .img-wrap .img-01 { width: 111px; height: 111px; background: url(../images/common/pc-section-7-item-1.png) no-repeat center / contain; top: 40px; left: -170px; z-index: -1; opacity: 0; } 
.slide-6 .content-wrap .img-wrap .img-02 { width: 123px; height: 123px; background: url(../images/common/pc-section-7-item-2.png) no-repeat center / contain; top: 110px; left: -210px; z-index: 100; opacity: 0; } 
.slide-6 .content-wrap .img-wrap .img-03 { width: 168px; height: 191px; background: url(../images/common/pc-section-7-item-3.png) no-repeat center / contain; top: 241px; left: 200px; z-index: 100; opacity: 0; } 
.slide-6.active .content-wrap .img-wrap .img-01 { left: -160px;
  top: 40px; opacity: 1; } 
.slide-6.active .content-wrap .img-wrap .img-02 { left: -60px; opacity: 1; } 
.slide-6.active .content-wrap .img-wrap .img-03 { top: 396px; left: 130px; opacity: 1; } 

.slide-7 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 50px; line-height: 120%; letter-spacing: 0px; text-transform: capitalize; color: rgba(230, 255, 130, 1); margin-top: 20px; margin-bottom: 40px; } 
.slide-7 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 16px; line-height: 150%; letter-spacing: 0px; color: rgba(238, 242, 236, 1); text-align: left; margin: 0; } 
.slide.slide-7 .content-wrap .img-wrap { display: flex; justify-content: center; align-items: end; top: 50px; left: 50px; } 
.slide-7 .content-wrap .img-wrap .img { opacity: 1; } 
.slide-7 .img-wrap img { width: 349px; height: 300px; z-index: 1; } 
.slide-7 .content-wrap .img-wrap::after { display: none; } 
.slide-7 .content-wrap .img-wrap .img-01 { width: 332px; height: 332px; background: url(../images/common/pc-section-6-item-1.png) no-repeat center / contain; top: 0; left: 0; z-index: 100; } 
.slide-7 .content-wrap .img-wrap .img-02 { width: 171px; height: 171px; background: url(../images/common/pc-section-6-item-2.png) no-repeat center / contain; top: 50px; left: 50px; z-index: 101; } 
.slide-7 .content-wrap .img-wrap .img-04 { width: 183px; height: 176px; background: url(../images/common/pc-section-6-item-4.png) no-repeat center / contain; top: 50px; left: 50px; z-index: 101; } 
.slide-7 .content-wrap .img-wrap .img-05 { width: 93px; height: 93px; background: url(../images/common/pc-section-6-item-5.png) no-repeat center / contain; top: 50px; left: 50px; z-index: 101; } 
.slide-7 .content-wrap .img-wrap .img-06 { width: 165px; height: 165px; background: url(../images/common/pc-section-6-item-6.png) no-repeat center / contain; top: 50px; left: 50px; z-index: 101; } 
.slide-7.active .content-wrap .img-wrap .img-01 { top: -66px; left: 0; opacity: 1; } 
.slide-7.active .content-wrap .img-wrap .img-02 { top: -84px; left: -27px; opacity: 1; } 
.slide-7.active .content-wrap .img-wrap .img-03 { top: 30px; left: 212px; opacity: 1; } 
.slide-7.active .content-wrap .img-wrap .img-04 { top: -100px; left: 110px; opacity: 1; } 
.slide-7.active .content-wrap .img-wrap .img-05 { top: -80px; left: 290px; opacity: 1; } 
.slide-7.active .content-wrap .img-wrap .img-06 { top: -260px; left: 120px; opacity: 1; } 
.slide-7 > div::after { content: ''; display: block; position: absolute; right: 0; width: 50%; height: 100%; background: #1e1b4b; } 


.img-wrap.fixed .img { opacity: 0; visibility: hidden; transition: all 1s ease; /* transition-delay: 1000ms; */ position: absolute; } 
.img-wrap .img-02 { width: 240px; height: 240px; }

.img-wrap.slide-2-active .img-01 { width: 128px; height: 121px; background: url(../images/common/mo-section-2-item-3.png) no-repeat center / contain; top: 24.63vw; left: 60px; z-index: -10; } 
.img-wrap.slide-2-active .img-02 { width: 240px; height: 240px; background: url(../images/common/mo-section-2-item-2.png) no-repeat center / contain; top: 12.15vh; left: 10px; z-index: -10; } 
.img-wrap.slide-2-active .img-03 { width: 149px; height: 223px; background: url(../images/common/mo-section-2-item-1.png) no-repeat center / contain; top: 14.7vh; left: 40px; z-index: -10; } 
.img-wrap.slide-2-active.active.slide-2-active-move .img-01 { top: 13.63vw; left: 270px; opacity: 1; z-index: 10; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-2-active.active.slide-2-active-move .img-02 { top: 12.15vh; left: -150px; opacity: 1; z-index: -1; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-2-active.active.slide-2-active-move .img-03 { top: -12.3vh; left: 230px; opacity: 1; z-index: 10; visibility: visible; transition-delay: 100ms; } 
/* */

.img-wrap.slide-3-active .img-01 { width: 184px; height: 184px; background: url(../images/common/pc-section-3-item-1.png) no-repeat center / contain; top: 66px; left: 56px; opacity: 0; z-index: -10; } 
.img-wrap.slide-3-active .img-02 { width: 184px; height: 184px; background: url(../images/common/pc-section-3-item-2.png) no-repeat center / contain; top: 174px; left: 0px; z-index: 200; opacity: 0; z-index: -10; } 
.img-wrap.slide-3-active .img-03 { width: 150px; height: 150px; background: url(../images/common/pc-section-3-item-3.png) no-repeat center / contain; top: 320px; left: 40px; opacity: 0; z-index: -10; } 
.img-wrap.slide-3-active.active.slide-3-active-move .img-01 { top: 66px; left: 256px; opacity: 1; z-index: -1; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-3-active.active.slide-3-active-move .img-02 { top: 174px; left: -117px; opacity: 1; z-index: -1; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-3-active.active.slide-3-active-move .img-03 { top: 320px; left: 216px; opacity: 1; z-index: -1; visibility: visible; transition-delay: 100ms; } 

/* */
.img-wrap.slide-4-active .img-01 { width: 128px; height: 121px; background: url(../images/common/mo-section-2-item-3.png) no-repeat center / contain; top: 23.63vw; left: 60px; z-index: -10; } 
.img-wrap.slide-4-active .img-02 { width: 240px; height: 240px; background: url(../images/common/mo-section-2-item-2.png) no-repeat center / contain; top: 12.15vh; left: 0px; z-index: -10; } 
.img-wrap.slide-4-active .img-03 { width: 149px; height: 223px; background: url(../images/common/mo-section-2-item-1.png) no-repeat center / contain; top: 14.7vh; left: 40px; z-index: -10; } 
/* .img-wrap.slide-4-active.active.slide-4-active-move .img-01 { top: 13.63vw; left: 270px; opacity: 1; z-index: 10; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-4-active.active.slide-4-active-move .img-02 { top: 2.15vh; left: -130px; opacity: 1; z-index: -1; visibility: visible; transition-delay: 100ms; } 
.img-wrap.slide-4-active.active.slide-4-active-move .img-03 { top: -12.3vh; left: 230px; opacity: 1; z-index: 10; visibility: visible; transition-delay: 100ms; } */
/* */
.img-wrap.slide-4-active-move img.secreen {/*  transform: translateY(-76%); */  } 
.img-wrap.fixed.slide-4-active-move .imgFrame #change-img { transform: translateY(-50%); } 

.img-wrap.slide-5-active .img-01 { width: 184px; height: 184px; background: url(../images/common/pc-section-5-item-1.png) no-repeat center / contain; top: 125px; left: -170px; z-index: 1000; opacity: 0; z-index: 111; } 
.img-wrap.slide-5-active .img-02 { width: 316px; height: 172px; background: url(../images/common/pc-section-5-item-2.png) no-repeat center / contain; top: 306px; left: 210px; z-index: 1000; opacity: 0; z-index: 111; } 
.img-wrap.slide-5-active.active.slide-5-active-move .img-01 { opacity: 1; left: -80px; visibility: visible; z-index: 111; transition-delay: 100ms; } 
.img-wrap.slide-5-active.active.slide-5-active-move .img-02 { top: 396px; left: 130px; opacity: 1; visibility: visible; z-index: 111; transition-delay: 100ms; } 


/* fixed imgwrap */
.img-wrap.fixed { position: fixed; z-index: 11111; left: 50%; bottom: 180px; width: 260px; height: 527px; transform: translateX(-50%); margin-left: 390px; } 
.img-wrap.fixed .phoneFrame { position: relative; overflow: hidden; width: 260px; height: 523px; background: url(../images/common/phone.png) no-repeat center / contain; z-index: 111; } 
 .img-wrap.fixed .img-wrap { margin-bottom: 13.29vh; } 
.img-wrap.fixed .imgFrame { position: absolute; top: 17px; left: 17px; width: 226px; height: 489px; overflow: hidden; border-radius: 30px; } 
.img-wrap.fixed .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 2s ease; overflow: visible; position: absolute; left: 0; top: 0; opacity: 0; } 
.img-wrap.fixed .img-wrap::after { display: none; } 
.img-wrap .imgFrame .cover-img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  transition: all .1s ease-in-out;
  background-size: cover;
  background-position: top;
  opacity: 1;
}
/* .img-wrap.slide-2-active .imgFrame .cover-img {
  background: url(../images/section/section-2.png) no-repeat top center / cover;
}
.img-wrap.slide-3-active .imgFrame .cover-img {
  background: url(../images/section/section-3.png) no-repeat top center / cover;
}
.img-wrap.slide-4-active .imgFrame .cover-img {
  background: url(../images/section/section-4.png) no-repeat top center / cover;
}
.img-wrap.slide-5-active .imgFrame .cover-img {
  background: url(../images/section/section-5.png) no-repeat top center / cover;
} */
.img-wrap.fixed .imgFrame .cover-img {
  opacity: 0;
}
/* .img-wrap.fixed.active .imgFrame img { width: 100%; transform: translateY(-76%); } */
.slide-1.img-wrap.fixed.active .imgFrame img { transform: translateY(-76%); } 
/* .slide-3-active.img-wrap.fixed.active .imgFrame img { transform: translateY(-56%); } */
.slide .content-wrap .img-wrap { display: none; } 
.img-wrap.fixed { display: block; opacity: 1; visibility: visible; transition: all .5s ease-in-out; } 
.img-wrap.fixed.hide { /* display: none; */ opacity: 0; visibility: hidden; transition: 0s; } 
/* .img-wrap.fixed .imgFrame img.screen { visibility: hidden; transition: visibility .5s ease-in-out !important; } 
 .img-wrap.fixed .imgFrame img.screen.sec-img-1 { z-index: 10; visibility: visible; } 
 .img-wrap.fixed .imgFrame img.screen.sec-img-2 { z-index: 9; } 
 .img-wrap.fixed .imgFrame img.screen.sec-img-3 { z-index: 8; } 
 .img-wrap.fixed .imgFrame img.screen.sec-img-4 { z-index: 7; } 
 .img-wrap.slide-2-active.slide-2-active-move .imgFrame img.screen.sec-img-2 { visibility: visible; } */
/* fixed imgwrap */

.img-wrap.fixed .imgFrame #change-img { opacity: 1; } 
.img-wrap.active .imgFrame img { transform: translateY(-76%);  } 
.img-wrap .imgFrame img.sec-img-2 { z-index: 100; opacity: 1; }
.img-wrap.slide-1 .imgFrame img { transform: translateY(0%); transition-delay: 1000ms; } 
.img-wrap.slide-1.slide-1-active-move .imgFrame img { transform: translateY(-76%); transition-delay: 1000ms; } 
.img-wrap.slide-2-active .imgFrame img { transform: none !important; transition: none !important; } 
.img-wrap.slide-3-active .imgFrame img { transform: none !important; transition: none !important; } 
.img-wrap.slide-4-active .imgFrame img { transform: none !important; transition: none !important; } 
.img-wrap.slide-5-active .imgFrame img { transform: none !important; transition: none !important; } 
.img-wrap.slide-6-active .imgFrame img { transform: none !important; transition: none !important; } 
.img-wrap.slide-6-active .imgFrame { display: none; }
.img-wrap.slide-4-active.slide-4-active-move .imgFrame img { transform: translateY(-51%) !important;     transition: transform 2s ease !important; }


@media (max-width: 768px){
  body.main {
    overflow: visible;
    height: auto;
  }
.slide .content-wrap .img-wrap { display: block; margin-top: 57px; right: auto; opacity: 0; } 
.slide.active .content-wrap .img-wrap { opacity: 1;}
.img-wrap.fixed { display: none; } 
 #bullet-nav { display: none; } 
 .header { height: 64px; } 
 .header .menu { display: none; } 
 .header .menu-btn { display: flex; } 

 .slide > div { height: auto; padding-top: 102px; } 
 .slide { position: relative; flex-direction: column; padding: 0; overflow: hidden; transform: none !important; height: auto; } 
/* .slide-1 { padding-top: 164px; } */
 .slide .btn-wrap .btn-down { font-size: 13px; } 
 .slide .content-wrap { width: 100%; height: 100%; flex-direction: column; align-items: center; justify-content: start; } 
 .slide .img-wrap img { width: auto; height: auto; position: relative; z-index: 10; width: 200px; height: auto; background-size: contain; max-width: 179px; } 
 .slide .main-title { font-size: 32px; line-height: 130%; } 
 .slide .title-wrap { margin-top: 0 !important; align-items: center; padding: 0; } 
 .slide .text-wrap { text-align: center; margin-top: 20px; margin-bottom: 36px; font-size: 16px; } 
 .slide .btn-wrap { margin-top: 0; } 
 .slide .title { width: 100%; height: 7.2vw; } 
 .slide > div::after { width: 568px; height: 613px; display: none; } 
 .slide .title-wrap .title-box span { font-family: Paperlogy; font-weight: 700; font-size: 3.73vw; line-height: 120%; letter-spacing: -1px; text-transform: capitalize; } 

 .slide-1 .img-wrap { margin-top: 30px; margin-bottom: 50px; } 
 .slide-1 .title { margin-top: 0; width: 154px; } 
 .slide-1 .text-wrap { margin-top: 30px; margin-bottom: 50px; } 
 .slide-1 .content-wrap { justify-content: end; } 
 .slide-1 > div::after { display: block; top: 80px; } 
 .slide-1 .logo-img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 19px;
 }
 .slide-1 .logo-img-wrap .beta { position: relative; top: -17px; margin-left: 2.75px; width: 37px; height: 21px;}
 
.slide-1 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
 .slide-1 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-1 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
 .slide-1 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 4s ease; overflow: visible; } 
 .slide-1.active .imgFrame img { /* transform: translateY(-76%);transition-delay: 2s;  */} 
 .slide-1 .content-wrap .img-wrap::after { display: none; } 
 
 .slide-2 .content-wrap { position: relative; } 
 .slide-2 > div::after { display: none; } 
 .slide-2 .title-wrap { margin-top: auto; } 
 .slide-2 { background: rgba(160, 114, 251, 1); } 
 .slide-2 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 32px; line-height: 120%; letter-spacing: 0px; text-align: center; text-transform: capitalize; color: #1A1A1A; margin-top: 1.93vh; margin-bottom: 2.27vh; } 
 .slide-2 .sub-text-wrap { font-weight: 600; font-size: 16px; line-height: 140%; text-align: center; } 
 .slide-2 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-2 .content-wrap .img-wrap .img-01 { width: 84px; height: 79px; background: url(../images/common/mo-section-2-item-3.png) no-repeat center / contain; top: 116px; left: 60px; z-index: 10; } 
 .slide-2 .content-wrap .img-wrap .img-02 { width: 105px; height: 190px; background: url(../images/common/mo-section-2-item-2.png) no-repeat center / contain; top: 158px; left: 0px; } 
 .slide-2 .content-wrap .img-wrap .img-03 { width: 127px; height: 191px; background: url(../images/common/mo-section-2-item-1.png) no-repeat center / contain; top: 28px; left: 40px; z-index: 10; } 
 .slide-2.active .content-wrap .img-wrap .img-01 { top: 16px; left: 160px; opacity: 1; } 
 .slide-2.active .content-wrap .img-wrap .img-02 { top: 71px; left: -60px; opacity: 1; } 
 .slide-2.active .content-wrap .img-wrap .img-03 { top: 268px; left: 120px; opacity: 1; } 
 /* */
 
.slide-2 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
 .slide-2 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-2 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
 .slide-2 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 1s ease; overflow: visible; } 
 .slide-2.active .imgFrame img { height: auto; max-height: none; aspect-ratio:initial } 
 .slide-2 .content-wrap .img-wrap::after { display: none; } 
 /* */

 .slide-3 .content-wrap .img-wrap .img { opacity: 1; } 
 .slide-3 .content-wrap .img-wrap .img-01 { width: 130px; height: 130px; background: url(../images/common/pc-section-3-item-1.png) no-repeat center / contain; top: 2vh; left: 0px; z-index: 10; } 
 .slide-3 .content-wrap .img-wrap .img-02 { width: 130px; height: 130px; background: url(../images/common/pc-section-3-item-2.png) no-repeat center / contain; top: 174px; left: 0px; z-index: 11; } 
 .slide-3 .content-wrap .img-wrap .img-03 { width: 95px; height: 95px; background: url(../images/common/pc-section-3-item-3.png) no-repeat center / contain; top: 250px; left: 40px; z-index: -1; } 
 .slide-3.active .content-wrap .img-wrap .img-01 { top: 70px; left: 180px; opacity: 1; } 
 .slide-3.active .content-wrap .img-wrap .img-02 { top: 174px; left: -120px; opacity: 1; } 
 .slide-3.active .content-wrap .img-wrap .img-03 { top: 250px; left: 170px; opacity: 1; z-index: -1; } 
 .slide-3 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 32px; line-height: 120%; letter-spacing: 0px; text-align: center; text-transform: capitalize; color: #1A1A1A; margin-top: 1.93vh; margin-bottom: 2.27vh; } 
 .slide-3 .title-wrap { color: #1A1A1A; margin-top: auto; } 
 .slide-3 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 15px; line-height: 140%; letter-spacing: 0px; text-align: center; height: 105px; } 
 .slide-3 .img-wrap { margin-bottom: 13.29vh; } 
.slide-3 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
 .slide-3 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-3 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
 .slide-3 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 1s ease; overflow: visible; } 
 .slide-3.active .imgFrame img { height: auto; max-height: none; aspect-ratio:initial } 
 .slide-3 .content-wrap .img-wrap::after { display: none; } 
 /* */

 .slide-4 { background-color: rgba(24, 36, 25, 1); } 
 .slide-4 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 32px; line-height: 120%; letter-spacing: 0px; text-align: center; text-transform: capitalize; color: #E6FF82; } 
 .slide-4 .title-wrap { color: #1A1A1A; margin-top: auto; } 
 .slide-4 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 15px; line-height: 140%; letter-spacing: 0px; text-align: center; color: #fff; } 
 .slide-4 .title-wrap .title-box span { color: #E6FF82; } 
.slide-4 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
.slide-4 .img-wrap { margin-bottom: 13.29vh; } 
.slide-4 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
.slide-4 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 1s ease; overflow: visible; } 
.slide-4.active .imgFrame img { height: auto; max-height: none; transition: transform 3s ease; transition-delay: 2s;} 
.slide-4 .content-wrap .img-wrap::after { display: none; } 

.slide-5 .text-wrap { font-family: Paperlogy; font-weight: 700; font-size: 32px; line-height: 120%; letter-spacing: 0px; text-align: center; text-transform: capitalize; color: #E6FF82; } 
.slide-5 .title-wrap { color: #1A1A1A; } 
.slide-5 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 15px; line-height: 140%; letter-spacing: 0px; text-align: center; color: #fff; height: 105px; } 
.slide-5 .title-wrap .title-box span { color: #E6FF82; } 
.slide-5 .content-wrap .img-wrap .img-01 { width: 179px; height: 182px; top: 110px; left: -170px; } 
.slide-5 .content-wrap .img-wrap .img-02 { width: 231px; height: 125px; top: 330px; left: 210px; } 
.slide-5.active .content-wrap .img-wrap .img-01 { left: -110px; top: 110px; } 
.slide-5 .content-wrap .img-wrap .img-01 { display: block; } 
.slide-5 .content-wrap .img-wrap .img-02 { display: block; } 
.slide-5.active .content-wrap .img-wrap .img-02 { top: 330px; left: 50px; } 
.slide.slide-5.active .content-wrap .img-wrap img { opacity: 1; } 
/* */
.slide-5 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
 .slide-5 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-5 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
 .slide-5 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 1s ease; overflow: visible; } 
 .slide-5.active .imgFrame img { height: auto; max-height: none; aspect-ratio:initial } 
 .slide-5 .content-wrap .img-wrap::after { display: none; } 
/* */

.slide-6 .phoneFrame { position: relative; width: 200px; height: 402px; aspect-ratio: 200 / 402; background: url(../images/common/phone.png) no-repeat center / contain; background-size: contain; background-repeat: no-repeat; } 
 .slide-6 .img-wrap { margin-bottom: 13.29vh; } 
 .slide-6 .imgFrame { position: absolute; top: 3%; left: 5%; width: 90%; height: 94%; overflow: hidden; z-index: 1; border-radius: 30px; } 
 .slide-6 .imgFrame img { width: 100%; height: auto; object-fit: cover; position: relative; transform: translateY(0%); transition: transform 1s ease; overflow: visible; } 
 .slide-6.active .imgFrame img { height: auto; max-height: none; aspect-ratio:initial } 
 .slide-6 .content-wrap .img-wrap::after { display: none; } 
 .slide-6 .content-wrap .img-wrap .img-01 { background: url(../images/common/pc-section-7-item-1.png) no-repeat center / contain; }
 .slide-6 .content-wrap .img-wrap .img-02 { background: url(../images/common/pc-section-7-item-2.png) no-repeat center / contain; }
 .slide-6 .content-wrap .img-wrap .img-03 { background: url(../images/common/pc-section-7-item-3.png) no-repeat center / contain; }

 .slide-6 .content-wrap .img-wrap .img-01, .slide-6 .content-wrap .img-wrap .img-02, .slide-6 .content-wrap .img-wrap .img-03 { display: block; }
 .slide.slide-6.active .content-wrap .img-wrap img { opacity: 1; }
 .slide-6.active .content-wrap .img-wrap .img-01 {
  left: -60px;
  top: 40px;
  z-index: -1;
}
.slide-6.active .content-wrap .img-wrap .img-02 {
  left: -80px;
  top: 110px;
}
.slide-6.active .content-wrap .img-wrap .img-03 {
  left: 130px;
  top: 241px;
}
.slide-6 .text-wrap {
  font-family: Paperlogy;
  font-weight: 700;
  font-size: 32px;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  text-transform: capitalize;
  color: #1A1A1A;
}
.slide-6 .sub-text-wrap {
  font-family: Pretendard;
  font-weight: 600;
  font-size: 15px;
  line-height: 140%;
  letter-spacing: 0px;
  text-align: center;
  color: #1A1A1A;
  height: 84px;
  padding: 0 15px;
}

.slide-7 .content-wrap { flex-direction: column-reverse; } 
.slide-7 .content-wrap .img-wrap { left: 30px; top: 30px; margin-bottom: 32px !important; } 
.slide-7 { background: #080934; padding-bottom: 102px; } 
.slide-7 .text-wrap { font-weight: 700; font-size: 32px; line-height: 120%; } 
.slide-7 .sub-text-wrap { font-family: Pretendard; font-weight: 600; font-size: 15px; line-height: 140%; letter-spacing: 0px; text-align: center; color: #fff; margin-top: 3.40vh; margin-bottom: 5.68vh; } 
.slide-7 .img-wrap img { width: 207px; height: 178px; } 
.slide-7 .title-wrap { margin-top: 32px; } 
.slide.slide-7 .content-wrap .img-wrap { top: 30px; }
.slide-7 .content-wrap .img-wrap .img-01 { width: 153px; height: 153px; left: -30px; top: 0; } 
.slide-7 .content-wrap .img-wrap .img-02 { width: 102px; height: 102px; top: 6px; left: -7px; } 
.slide-7 .content-wrap .img-wrap .img-03 { width: 54px; height: 54px; top: 6px; left: -7px; } 
.slide-7 .content-wrap .img-wrap .img-04 { width: 91px; height: 86px; top: 6px; left: -7px; } 
.slide-7 .content-wrap .img-wrap .img-05 { width: 54px; height: 54px; top: 6px; left: -7px; } 
.slide-7 .content-wrap .img-wrap .img-06 { width: 85px; height: 85px; top: 6px; left: -7px; } 
.slide-7.active .content-wrap .img-wrap .img-01 { top: -50px; left: -20px; } 
.slide-7.active .content-wrap .img-wrap .img-02 { top: -44px; left: -67px; } 
.slide-7.active .content-wrap .img-wrap .img-03 { top: 10px; left: 62px; } 
.slide-7.active .content-wrap .img-wrap .img-04 { top: -60px; left: 2px; } 
.slide-7.active .content-wrap .img-wrap .img-05 { top: -30px; left: 82px; z-index: 11; } 
.slide-7.active .content-wrap .img-wrap .img-06 { top: -140px; left: 22px; } 

.slide-8 { height: auto; padding-top: 50px; padding-bottom: 60px; } 
}