@charset "utf-8";


@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.cdnfonts.com/css/myriad-pro');
/********************************************
********************************************/
:root {
  --font-suit: font-family: "SUIT", sans-serif;
  --font-poppins: font-family: "Poppins", sans-serif;
  --font-myriad: 'Myriad Pro', sans-serif;
  --font-montserrat: "Montserrat", sans-serif;
}
body {
  min-height: 100vh;
  
  @supports (-webkit-touch-callout: none) {
    min-height: -webkit-fill-available;
  }
}

body.main {
   /* background-color: #000; */
}
.section1,
.section2,
.section6 {
  background-color: #000;
}
.main_container {
  /* overflow: hidden; */
  color: #fff;
}
.main_container * {
  font-family: var(--font-suit);
  /* color: #fff; */
}
/********************************************
      주석
********************************************/
.section1,  
.section2, 
.section3, 
.section4, 
.section5 
{
  width: 100%;  
  overflow: hidden;  
}
.typo_motion {
  position: relative;
  width: 100%;
  height: 100dvh;
  overflow: hidden;
}
.typo_motion .copy {
  position: absolute;
  top: 40%;
  left: 0px;
  width: 100%;
  height: min(calc(200/720 * 100vw), 200px);
  transform: translateY(-60%);
}
.typo_motion .t1 { 
  position: absolute;
  top: 0;
  left: 0px;
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-size: min(calc(30/720 * 100vw), 30px);
  overflow: hidden;
}
.typo_motion .t2 {
  position: absolute;
  bottom: 0;
  left: 0px;  
  width: 100%;   
  text-align: center;
  font-weight: 800;
  font-size: 64px; 
  font-size: min(calc(64/720 * 100vw), 64px); 
  overflow: hidden;
}
.typo_motion .t3 {
  position: absolute;
  bottom: 23%;
  left: 50%;
  width: 100%;
  text-align: center;
  transform: translateX(-50%);
  font-family: var(--font-poppins);
  line-height: 1;
  white-space: nowrap;
  font-size: min(calc(160/1920 * 100vw), 160px);
}
.typo_motion .t3 strong { font-weight: 800; }
.typo_motion .t3 span { font-weight: 200; }

@media screen and (max-width: 1024px) {
  .typo_motion .copy {
    top:55%;
  }
  .typo_motion .t3 { 
    bottom: 0;
    top:70%;
  }
}

/********************************************
      비주얼
********************************************/
.main_visual {
  /* margin: 200px 0; */
  margin: min(calc(0/1920 * 100vw), 200px) 0;
  position: relative;
  width: 100%;
  aspect-ratio: 1920/960;
}
@media screen and (max-width: 1024px) {
  .main_visual { 
    aspect-ratio: 1920/2600;
  }
}
.main_visual .bg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 110%;
  /* background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/main_visual_bg.jpg") no-repeat 0 0; */
  background: url("/resources/img/main/main_visual_bg.jpg") no-repeat ;
  background-size: 100% auto;
}

@media screen and (min-width: 1025px) {
  .main_visual .bg p.foot {
    position: absolute;
    bottom: 0px;
    left: 60px;
    color: #fff;
    font-family: var(--font-suit);
    font-size: min(calc(16/1920 * 100vw), 16px);  
  }
  .main_visual .bg p.foot br { display: none; }  
}
@media screen and (max-width: 1024px) {
  .main_visual .bg p.foot {
    position: absolute;
    bottom: min(calc(140/720 * -100vw), -180px);
    left: min(calc(60/720 * 100vw), 60px);
    color: #fff;
    font-family: var(--font-suit);
    font-size: min(calc(22/720 * 100vw), 22px);  
    opacity: 0.6;
    text-indent: min(calc(15/720 * -100vw), -15px);
    padding: 0 0 0 min(calc(15/720 * 100vw), 15px);
  }  
  .main_visual .bg p.foot br { display: block; }
}

.main_visual.m-only img { width: 100%;}
.main_visual .cloud_layer {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 118%;
}
.main_visual .cloud_layer .obj1 {
  position: absolute;
  /* top: 217px; */
  /* top: min(calc(217/1920 * 100vw), 217px); */
  right:150px;
  bottom: 5px;
  width: 394px;
  /* height: 640px; */
  aspect-ratio: 394/640;
  /* background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/main_visual_obj1.png") no-repeat 0 0; */
  background: url("/resources/img/main/main_visual_obj1.png") no-repeat 0 0;
  background-size: contain;  
  z-index: 10;
}
.main_visual .cloud_layer .obj2 {
  position: absolute;
  /* top: 540px; */
  /* top: min(calc(540/1920 * 100vw), 540px); */
  bottom:10%;
  /* left: 335px; */
  left: 335px;
  left: min(calc(120/1920 * 100vw), 120px);
  width: 543px;
  width: min(calc(543/1920 * 100vw), 543px);
  /* height: 272px;   */
  aspect-ratio: 543/272;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/main_visual_obj2.png") no-repeat 0 0;
  background-size: contain;  
}
.main_visual .cloud_layer .obj3 {
  position: absolute;
  /* top: 301px; */
  /* top: min(calc(301/1920 * 100vw), 301px);   */
  bottom:20%;
  right: 0px;
  /* width: 763px; */
  width: min(calc(763/1920 * 100vw), 763px);  
  /* height: 476px;   */
  aspect-ratio: 763/476;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/main_visual_obj3.png") no-repeat 0 0;
  background-size: contain;  
}

/********************************************
      HIGH-END WORK EDIION
********************************************/
.highend_edition {
  position: relative;
  width: min(calc(1720/1920 * 100vw), 1720px);  
  margin: 0 auto;
}
.highend_edition .contit {
  position: relative;
  width: 100%;
  aspect-ratio: 1720/380;
  margin: 0 auto 100px;
}
.highend_edition .contit strong {
  font-family: var(--font-poppins);
  font-weight: 900;
  font-size: 160px;  
  font-size: min(calc(250/1920 * 100vw), 100px);
  line-height: 1;
}
.highend_edition .contit strong.t1 {
  position: absolute;
  /* top: 68px; */
  top: min(calc(68/1920 * 100vw), 68px);  
  left: 0px;
  z-index: 2;
}
.highend_edition .contit strong.t2 {
  position: absolute;
  /* top: 68px; */
  top: min(calc(68/1920 * 100vw), 68px);  
  /* left: 990px; */
  left: min(calc(660/1920 * 100vw), 660px);  
  z-index: 4;
}
.highend_edition .contit strong.t3{
  position: absolute;
  /* top: 230px; */
  top: min(calc(175/1920 * 100vw), 175px);  
  left: 0px;
  z-index: 2;  
}
.highend_edition .contit strong.obj {
  position: absolute;
  top: min(calc(40/1920 * 100vw), 40px);
  left: min(calc(1302/1920 * 100vw), 502px);
  width: min(calc(600/1920 * 100vw), 240px);  
  /* height: 332px; */
  aspect-ratio: 352/332;
  z-index: 2;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/ovj1.png") no-repeat 0 0;
  background-size: contain;
}
.highend_edition.on .contit strong.obj {
  animation: objflip 2s ease-out infinite;
  transform-origin: 50% 50%;
}
@keyframes objflip {
  0% {
    transform: rotate(0);
    -webkit-transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
  }
}
.stairs {
  margin: 0 auto;
  position: relative;
  width: min(94vw, 1280px);
  aspect-ratio: 1280/1024;
  display: flex;
  z-index: 1;
  justify-content: space-between;
}
.stairs .stair_obj {
  position: relative;
  width: min(calc(800/1280 * 100vw), 800px);
  aspect-ratio: 780/1000;
  z-index: 1;
}
.stairs .text {
  text-align: right;
  position: absolute;
  top: 0px;
  right: 0px;
  width: min(calc(640/1080 * 100vw), 640px);
  /* height: 1000px; */
  aspect-ratio: 640/1000;
  z-index: 2;
  padding: min(calc(300/1080 * 100vw), 300px) min(calc(40/1080 * 100vw), 40px) 0 0; 
}
.stairs_box {
  position: absolute; 
  top:  min(calc(300/1920 * -100vw), -300px);  
  width: min(100vw, 1200px);  
  left: 0%;
}
.stairs_box ul {
  position: relative; 
  width: min(calc(781/1200 * 100vw), 781px);
  height: min(calc(1180/1200 * 100vw), 1180px);
}
.stairs_box ul li {position: absolute;}
.stairs_box ul li img { width: 100%;}
.stairs_box ul li:nth-child(1) {
  left: min(calc(24/1280 * 100vw), 24px); 
  top: min(calc(59/1280 * 100vw), 59px);   
  z-index: 11;
  background: rgb(67,60,52);
  background: radial-gradient(circle, rgba(67,60,52,1) 0%, rgba(0,0,0,1) 60%);
}
.stairs_box ul li:nth-child(2) {
  left: min(calc(40/1280 * 100vw), 40px); 
  top: min(calc(596/1280 * 100vw), 596px);    
  z-index: 12;
}
.stairs_box ul li:nth-child(3) {
  left: min(calc(7/1280 * 100vw), 7px);   
  top: min(calc(644/1280 * 100vw), 644px);
  z-index: 13;
}
.stairs_box ul li:nth-child(4) {
  left: 0; 
  top: min(calc(698/1280 * 100vw), 698px);
  z-index: 14; 
}
.stairs_box ul li:nth-child(5) {
  left: min(calc(10/1280 * 100vw), 10px);   
  top: min(calc(758/1280 * 100vw), 758px);
  z-index: 15;
}
.stairs_box ul li:nth-child(6) {
  left: min(calc(60/1280 * 100vw), 60px);   
  top: min(calc(834/1280 * 100vw), 834px);
  z-index: 16;
}
.stairs_box ul li:nth-child(7) {
  left: min(calc(165/1280 * 100vw), 165px);   
  top: min(calc(916/1280 * 100vw), 916px);
  z-index: 17;
}
.stairs_box ul li:nth-child(8) {
  left: min(calc(322/1280 * 100vw), 322px);   
  top: min(calc(1007/1280 * 100vw), 1007px);
  z-index: 17;
}
/* .stairs_box ul li:nth-child(8)::after {
  content: "";
  display: block;
  position: absolute;
  left: 30%;
  bottom: min(calc(25/1280 * 100vw), 25px); 
  width: min(calc(129/1280 * 100vw), 129px);
  aspect-ratio: 129/370;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/stairs_model.png") no-repeat 0 0;
  background-size: contain;
} */
.stairs_box ul li:nth-child(9) {
  left: min(calc(565/1280 * 100vw), 565px);
  top: min(calc(1108/1280 * 100vw), 1108px);  
  z-index: 17;
}
.stairs .text dt span { font-size: 28px; letter-spacing: -1px;}
.stairs .text dt strong { font-size: 50px; font-weight: 800; letter-spacing: -1px;}
.stairs .text dd:nth-of-type(1) {
  padding: 80px 0;
}
@media screen and (max-width: 1024px) {
  .highend_edition {
    width: 100%;
  }
  .highend_edition .contit {
    width: 90%;
    margin: 0 auto 250px;
    aspect-ratio: 1720/900;
  }
  .highend_edition .contit strong.t2 {
    top:35%;
  }
  .highend_edition .contit strong.t3 {
    top:62%;
  }
  .stairs {
    width: min(100vw, 910px);
    padding: 0 3vw;    
    aspect-ratio: 1280/1024;
    display: block;
  }
  .stairs .stair_obj {
    width: min(100vw, 910px);
    aspect-ratio: 1/0.7;
  }
  .stairs_box {
    position: absolute; 
    top:  min(calc(200/720 * -100vw), -200px);  
    width: min(100vw, 640px);  
    left: 10%;
  }
  .stairs .text {
    right: auto;
    position: relative;
    width: 100%;
    aspect-ratio: auto;
    padding: min(calc(200/720 * 100vw),200px) 0 0;
    margin: 0 auto;
  }
  .stairs .text dt span { 
    font-size: min(calc(30/720 * 100vw), 30px);
  }
  .stairs .text dt strong { 
    font-size: min(calc(62/720 * 100vw), 62px);
  }
  .stairs .text dd { 
    font-size: min(calc(24/720 * 100vw), 24px);
  }  
}
.features {
  position: relative;  
  width: 100%;
  margin: min(calc(200/1920 * 100vw), 200px) auto;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .features {
    position: relative;
    margin: min(calc(100/720 * 100vw), 100px) 0;
    width: 100%;
    z-index: 1;
  }
}
.features .copy {
  color: #fff;
  position: relative;
  z-index: 2;
  line-height: 1.4;
  font-size: min(calc(30/720 * 100vw), 30px);
  padding: 0 0 0 min(calc(100/1920 * 100vw), 100px);
  height: min(calc(220/1920 * 100vw), 220px);
  font-weight: 100;
}
@media screen and (max-width: 1024px) {
  .features .copy {
    color: #fff;
    position: relative;
    z-index: 2;
    line-height: 1.4;
    font-size: min(calc(24/720 * 100vw), 24px);
    padding: 0 0 0 min(calc(100/1920 * 100vw), 100px);
    height: min(calc(220/1920 * 100vw), 220px);
    font-weight: 100;
  }
}
.features .bg {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 365px;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/bg.jpg") no-repeat 50% 0;
  background-size: cover;
}
.features .f_listbox {
  position: relative;
  height: 320px;
  z-index: 2;
  display: flex;
  align-items: center;
}
.feature_swiper {
  position: relative;
  z-index: 2;
  height: 200px;
  width: 100%;
  overflow: hidden;
  font-weight: 800;
}
.feature_swiper strong {
  line-height: 1;
  letter-spacing: -2px;
  /* font-size: 150px; */
  font-size: min(calc(90/1920 * 100vw), 90px);
  font-stretch: condensed;
}
.feature_swiper .swiper-slide { 
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* .feature_swiper .swiper-slide:not(:first-child)::before { */
.feature_swiper .swiper-slide::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: min(calc(60/1920 * -100vw), -60px);
  width: min(calc(120/1920 * 100vw), 120px);
  height: clamp(3px, calc(10/1920 * 100vw), 10px);
  background: #fff;
  z-index: 22;
  transform: translateY(-50%);
}

@media screen and (max-width: 1024px) {
  /* .feature_swiper {
    height: min(calc(200/1024 * 100vw), 200px);
  }   */
  .features .f_listbox {
    height: min(calc(320/720 * 100vw), 320px);
  }     
  .feature_swiper .swiper-slide::before { display: none; }
  .feature_swiper strong {
    font-size: min(calc(110/1024 * 100vw), 110px);
  }  
}




.f_listbox::after {
  content: "";
  display: block;
  position: absolute;
  top: 15%;
  left: 40%;
  transform: translate(-50%,-50%);
  width: min(calc(355/1440 * 100vw), 355px);
  aspect-ratio: 355/256;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/main_premium_obj.png") no-repeat 0 0;
  background-size: contain;
  animation: rotateObj 10s ease-out infinite;
  transform-origin: 50% 50%;  
  transform-style : preserve-3D;
}
@media screen and (max-width: 1024px) {
  .f_listbox::after {
      top: 35%;
      left: 40%;
      transform: translate(-50%,-50%);
  }
}




@keyframes rotateObj {
  0% {
  transform: rotate(0);
  -webkit-transform: rotate(0);
  }
  100% {
  transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  }
}

/* navigation */
.f_indi {
  position: relative;
  bottom: 0px;
  left: min(calc(100/1920 * 100vw), 100px);
  z-index: 999;
}
.f_indi a { 
  color: #fff; 
  padding: 0 min(calc(70/1440 * 100vw), 70px); 
  position: relative; 
  display: block; 
  font-size: min(calc(25/1440 * 100vw), 25px); 
}
.f_indi a::before {
  opacity: 0;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0px;
  width: 12px;
  height: 12px;
  border-radius: 100%;
  background-color: #97aaae;
  transition: all 0.5s ease-out;
  z-index: 2;
}
.f_indi a.current::before {
  opacity: 1;
  transition: all 0.5s ease-out;
}
@media screen and (max-width: 1024px) {
  .f_indi {
    left: 10%;
  }
  .f_indi a { 
    padding: 0 min(calc(70/1024 * 100vw), 70px);  
    font-size: min(calc(36/720 * 100vw), 36px); 
  }
  .f_indi a::before {
    opacity: 0;
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    width: min(calc(12/720 * 100vw), 12px);
    height: min(calc(12/720 * 100vw), 12px);
    border-radius: 100%;
    background-color: #97aaae;
    transition: all 0.5s ease-out;
    z-index: 2;
  }
}
/********************************************
    section3 : LOCATION
********************************************/
.section3 {
  position: relative;
}
.section3 .bg {
  position: absolute;
  bottom: 0px;
  left: 50%;
  width: 100%;
  height: 100%;
  z-index: -1;
  transform: translateX(-50%);
  background: #000 url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/location_bg.jpg") no-repeat 0 100%;
  background-size: 100% auto;  
}
.main_location {
  position: relative;
  width: min(calc(1700/1920 * 100vw), 1700px);
  margin: 0 auto;  
  aspect-ratio: 1700/900;
  padding: 100px 0 min(calc(200/1440 * 100vw), 200px);
}
.main_location .contit {
  font-size: min(calc(70/1440 * 100vw), 70px);
  font-weight: 800;
  line-height: 1.1;
  position: relative;
  margin: 0 0 min(calc(120/1920 * 100vw), 120px);  
}
.main_location .contit:after {
  content: "";
  display: block;
  position: absolute;
  top: min(calc(90/1920 * -100vw), -80px);
  left: min(calc(715/1920 * 100vw), 345px);
  width: min(calc(650/1920 * 100vw), 327px);
  aspect-ratio: 327/319;
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/map_vector.png") no-repeat 0 0;
  background-size: contain;
}
.main_location .conbox {
  display: flex;
  justify-content: space-between;
}
.main_location .conbox span {
  display: block;
}
.main_location .text strong { font-weight: 800; }

.main_location .conbox .text {
  font-size: clamp(16px, calc(22/1440 * 100vw), 22px);
  padding: 15px 0 0;
  width: min(calc(440/1720 * 100vw), 440px);
}
.main_location .conbox .img {
  width: calc(100% - min(calc(440/1720 * 100vw), 440px));
}
.main_location .conbox .img img {
  width: calc(1062/1270 * 100%);
}
.main_location .link_btn {
  padding: min(calc(40/1440 * 100vw), 40px) 0 0;  
  width: min(calc(160/1440 * 100vw), 160px);
}
.main_location .link_btn a {
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  font-family: var(--font-montserrat);
  font-size: min(calc(14/720 * 100vw), 14px);
  color: #fff;
  text-align: center;
  line-height: min(calc(48/1440 * 100vw), 48px);
  font-weight: 600;
}
@media screen and (max-width: 1024px) {
  .main_location .contit {
    font-size: min(calc(70/720 * 100vw), 70px);
  }  
  .main_location .conbox {
    display: block;
  }
  .main_location .conbox .text {
    font-size: clamp(16px,calc(22/720 * 100vw), 22px);
    padding: 0 0 min(calc(40/720 * 100vw), 40px);
    width: 100%;
  }
  .main_location .conbox .img {
    width: 100%;
  }
  .main_location .conbox .img img {
    width: 100%;
  }
  .main_location .link_btn {
    padding: min(calc(40/720 * 100vw), 40px) 0 0;
    width: min(calc(160/720 * 100vw), 160px);
  }  
  .main_location .link_btn a {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #fff;
    font-family: var(--font-montserrat);
    font-size: min(calc(14/720 * 100vw), 14px);
    color: #fff;
    font-weight: 700;
    text-align: center;
    line-height: min(calc(48/720 * 100vw), 48px);
  }
}



/********************************************
    FLOOR PLAN
********************************************/
.section4 {
  background-color: #fff;
}
@media screen and (min-width: 1025px) {
  .main_floor {
    position: relative;
    width: min(100%, 1720px);
    aspect-ratio: 1920/1300;
    margin: 0 auto;
  }
  .floor_wrap {    
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
  }
  .floor_wrap .floor_img {
    position: relative;
    z-index: 9;
  }
  .floor_wrap .floor_img .img {
    position: absolute;
    top: min(calc(290/1920 * 100vw), 290px);
    /* left: min(calc(90/1920 * 100vw), 90px); */
    left: 0;
    width: min(calc(1100/1920 * 100vw), 1100px);
    aspect-ratio: 1100/700;  
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/floor_img.png") no-repeat 0 0;
    background-size: contain;
    z-index: 99;
  }
  .floor_wrap .obje_img {
    position: relative;
    /* top: min(calc(215/1920 * 100vw), 215px);
    right: min(calc(720/1920 * 100vw), 720px); */
    top: -60%;
    right: -54%;
    width: min(calc(327/1920 * 100vw), 327px);  
    aspect-ratio: 1060/650;
    z-index: 10;
    background: url("/resources/img/main/obje_img.png") no-repeat 100% 100%;
    background-size: contain;
  }
    .floor_wrap .obje_bg_img {
    position: absolute;
    bottom: 2%;
    /* left: -29%; */
    left: min(calc(-320/1920 * 100vw), -320px);
    width: min(calc(450/1920 * 100vw), 450px);  
    aspect-ratio: 393/380;
    z-index: 8;
    background: url("/resources/img/main/obje_bg_img.png") no-repeat 100% 100%;
    background-size: contain;
  }
  .floor_wrap .copy {
    position: absolute;
    bottom: min(calc(250/1920 * 100vw), 250px);
    right: min(calc(67/1920 * 100vw), 67px);
    width: min(calc(740/1920 * 100vw), 740);
    height: min(calc(190/1920 * 100vw), 190px);
    z-index: 99;
  }
  .floor_wrap .copy span {
    letter-spacing: -1px;
    font-stretch: condensed;
    display: block;
    color: #000;
    font-size: min(calc(28/1920 * 100vw), 28px);  
  }
  .floor_wrap .copy strong {
    letter-spacing: -1px;
    font-stretch: condensed;
    display: block;
    color: #000;
    font-size: min(calc(50/1920 * 100vw), 50px);
    font-weight: 800;
    font-stretch: condensed;
  }
  .main_floor .link_btn {
    position: absolute;
    top: min(calc(880/1920 * 100vw), 880px);
    right: min(calc(400/1920 * 100vw), 400px);  
    width: min(calc(160/1440 * 100vw), 160px);
    height: min(calc(48/1440 * 100vw), 48px);
    z-index: 99;
  }
  .main_floor .link_btn a {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #000;
    font-family: var(--font-montserrat);
    font-size: min(calc(14/720 * 100vw), 14px);
    color: #000;
    text-align: center;
    line-height: min(calc(48/1440 * 100vw), 48px);
    font-weight: 400;
  }
}
@media screen and (max-width: 1024px) {
  .main_floor {
    position: relative;
    width: 100%;
    margin: 0 auto;
    /* aspect-ratio: 720/1240; */
    aspect-ratio: 720/1000;
  }
  .floor_wrap {    
    position: relative;
    width: 100%;
    height: 100%;
  }
  .floor_wrap .floor_img { 
    margin: min(calc(75/720 * 100vw), 75px) 0 min(calc(50/720 * 100vw), 50px);
  }  
  .floor_wrap .floor_img .img {
    position: relative;
    width: 100%;
    aspect-ratio: 1144/744;  
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/floor_img.png") no-repeat 50% 0;
    background-size: contain;
    z-index: 99;
  }
  .floor_wrap .model_img {
    position: relative;
    width: 100%; 
    aspect-ratio: 720/510;
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/model_img.png") no-repeat 50% 0;
    background-size: 100% auto;
  }
  .floor_wrap .copy {
    padding: min(calc(150/1024 * 100vw), calc(150/1024 * 1024px)) 0 min(calc(100/1024 * 100vw), calc(100/1024 * 1024px));
    position: relative;
    width: min(calc(620/720 * 100vw), calc(620/720 * 1024px));
    margin: 0 auto;
    z-index: 9;
  }
  .floor_wrap .copy span {
    display: block;
    color: #000;
    font-size: min(calc(40/1024 * 100vw), 40px);  
  }
  .floor_wrap .copy strong {
    display: block;
    color: #000;
    font-size: min(calc(72/1024 * 100vw), 72px);
    font-weight: 800;
    font-stretch: condensed;
  }
  .main_floor .link_btn {
    position: absolute;
    top: 27%;
    left: min(calc(50/720 * 100vw), 50px);  
    width: min(calc(160/720 * 100vw), 160px);
    height: min(calc(48/720 * 100vw), 48px);
    z-index: 99;
  }
  .main_floor .link_btn a {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid #000;
    font-family: var(--font-montserrat);
    font-size: min(calc(14/720 * 100vw), 14px);
    color: #000;
    font-weight: 500;
    text-align: center;
    line-height: min(calc(48/720 * 100vw), 48px);
  }
    .floor_wrap .obje_img {
    position: relative;
    /* top: min(calc(215/1920 * 100vw), 215px);
    right: min(calc(720/1920 * 100vw), 720px); */
    top: -60%;
    right: -68%;
    width: min(calc(600/1920 * 100vw), 600px);  
    aspect-ratio: 1060/650;
    z-index: 10;
    background: url("/resources/img/main/obje_img.png") no-repeat 100% 100%;
    background-size: contain;
  }
    .floor_wrap .obje_bg_img {
    position: absolute;
    bottom: 2%;
    /* left: -29%; */
    left: min(calc(0/1920 * 100vw), 0px);
    width: min(calc(450/1920 * 100vw), 450px);  
    aspect-ratio: 393/380;
    z-index: 8;
    background: url("/resources/img/main/obje_bg_img.png") no-repeat 100% 100%;
    background-size: contain;
  }
}


/********************************************
    하이엔드
********************************************/
@media screen and (min-width: 1025px) {
  .highend_wrap {
    width: min(calc(1920/1920 * 100vw), 1920px);
    aspect-ratio: 1920/1160;
    position: relative;
    margin: 0 auto;
  }
  .highend_wrap .contit {
    position: absolute;
    top: min(calc(320/1920 * 100vw), 320px);
    left: min(calc(1096/1920 * 100vw), 1096px);
    width: min(calc(620/1920 * 100vw), 620px);
  }
  .highend_wrap .contit span {
    font-size: min(calc(28/1920 * 100vw), 28px);
    display: block;
    color: #000;  
    font-weight: 500;
  }
  .highend_wrap .contit strong {
    font-size: min(calc(50/1920 * 100vw), 50px);
    display: block;  
    color: #000;  
    font-weight: 800;
  }
  .highend_wrap .copy {
    font-size: min(calc(18/1024 * 100vw), 18px);  
    color: #000;  
    position: absolute;
    top: min(calc(520/1920 * 100vw), 520px);
    left: min(calc(1096/1920 * 100vw), 1096px);
    font-weight: 500;
    width: min(calc(500/1920 * 100vw), 500px);
  }
  .highend_wrap .slide-inner {  
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  } 
  .highend_wrap .slide-inner::after {
    content: "이미지컷";
    display: block;
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: #fff;
    font-size: 12px;
    z-index: 111;
  }
  .slide_wrap1 {
    position: absolute;
    top: min(calc(440/1920 * 100vw), 440px);
    left: 0px;
    width: min(calc(960/1920 * 100vw), 960px);
    height: min(calc(720/1920 * 100vw), 720px);
    overflow: hidden;
    z-index: 2;  
  }
  .slide_wrap1 .h_swiper1 {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 100%;
      overflow: hidden;
  }
  .highend_wrap .h_swiper1 .swiper-slide {
        overflow: hidden;
  }
  .slide_wrap2 {
    position: absolute;
    top: min(calc(780/1920 * 100vw), 780px);
    left: min(calc(1097/1920 * 100vw), 1097px);
    width: min(calc(504/1920 * 100vw), 504px);
    height: min(calc(377/1920 * 100vw), 377px);  
    overflow: hidden;
    z-index: 2;
  }
  .slide_wrap2 .h_swiper2 {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 100%;
      overflow: hidden;
  }
  .highend_wrap .h_swiper2 .swiper-slide {
        overflow: hidden;
  }
  .main_container .section5 {
    background: #fff;
  }
  .highend_wrap .txt_b  {
    position: absolute;
    top: min(calc(205/1920 * 100vw), 205px);
    left: min(calc(324/1920 * 100vw), 324px);
    width: min(calc(171/1920 * 100vw), 171px);
    height: min(calc(171/1920 * 100vw), 171px);    
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/txt_B.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .txt_g  {
    position: absolute;
    top: min(calc(315/1920 * 100vw), 315px);
    left: min(calc(572/1920 * 100vw), 572px);
    width: min(calc(227/1920 * 100vw), 227px);
    height: min(calc(59/1920 * 100vw), 59px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/txt_G.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .contit::after {  
    content: "";
    display: block;
    position: absolute;
    top: min(calc(64/1920 * -100vw), -64px);
    left: min(calc(428/1920 * 100vw), 428px);
    width: min(calc(227/1920 * 100vw), 164px);
    height: min(calc(177/1920 * 100vw), 177px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/highend_vector.png") no-repeat 0 0;
    background-size: contain;
    animation: vectorSize 10s ease-out infinite;
  }
  @keyframes vectorSize {
    0% {
      transform: scale(1);
      -webkit-transform: scale(1);
    }
    50% {
      transform: scale(1.2);
      -webkit-transform: scale(1.2);
    }  
    100% {
      transform: scale(1);
      -webkit-transform: scale(1);
    }
  }
  .highend_wrap .slide_control {
    position: absolute;
    top: min(calc(670/1920 * 100vw), 670px);
    left: min(calc(1095/1920 * 100vw), 1095px);
    width: min(calc(160/1440 * 100vw), 160px);
    height: min(calc(32/1920 * 100vw), 32px);
  }
  .highend_wrap .slide_control .prev_btn {
    position: absolute;
    top: 0px;
    left: 0px;
    width: min(calc(32/1920 * 100vw), 32px);
    height: min(calc(32/1920 * 100vw), 32px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/btn_prev_slide.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .slide_control .next_btn {
    position: absolute;
    top: 0px;
    left: min(calc(40/1920 * 100vw), 40px);
    width: min(calc(32/1920 * 100vw), 32px);
    height: min(calc(32/1920 * 100vw), 32px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/btn_next_slide.png") no-repeat 0 0;
    background-size: contain;  
  }
  .highend_wrap .slide_control .prev_btn span,
  .highend_wrap .slide_control .next_btn span { 
    display: none;
  }
  .highend_wrap .slide_control .counter { 
    display: flex; 
    position: absolute;
    top: 0px;
    right: 0px;
    width: min(calc(60/1024 * 100vw), 60px);
    height: min(calc(32/1920 * 100vw), 32px);
    
    color: #000;
    justify-content: space-between;
    align-items: center;
  }
  .highend_wrap .slide_control .counter .current {
    font-weight: 800;
  }
  .highend_wrap .slide_control .counter::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 1px;
    transform: translate(-50%, -50%);
    background-color: #000;
  }
  .highend_wrap .slide_control .counter * { color: #000; }
}


  .slide_wrap1 .slide_con1 .slide-inner {  
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_01.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap1 .slide_con2 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_02.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap1 .slide_con3 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_03.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap1 .slide_con4 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_04.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap1 .slide_con5 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_05.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap1 .slide_con6 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/b_06.jpg") no-repeat 0 0;
    background-size: cover;
  }  
  .slide_wrap2 .slide_con1 .slide-inner {  
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_01.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap2 .slide_con2 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_02.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap2 .slide_con3 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_03.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap2 .slide_con4 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_04.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap2 .slide_con5 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_05.jpg") no-repeat 0 0;
    background-size: cover;
  }
  .slide_wrap2 .slide_con6 .slide-inner {
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/s_06.jpg") no-repeat 0 0;
    background-size: cover;
  } 


@media screen and (max-width: 1024px) {
  .highend_wrap {
    aspect-ratio: 720/1620;
    position: relative;
    margin: 0 auto;
  }
  .highend_wrap .contit {
    position: absolute;
    top: min(calc(280/720 * 100vw), 280px);
    left: min(calc(40/720 * 100vw), 40px);
    width: min(calc(640/720 * 100vw), calc(640/720 * 1024px));
  }
  .highend_wrap .contit span {
    font-size: min(calc(30/720 * 100vw), 30px);
    display: block;
    color: #000;  
    font-weight: 500;
  }
  .highend_wrap .contit strong {
    font-size: min(calc(52/720 * 100vw), 52px);
    display: block;  
    color: #000;  
    font-weight: 800;
  }
  .highend_wrap .copy {
    font-size: min(calc(30/720 * 100vw), 30px);  
    color: #000;  
    position: absolute;
    top: min(calc(520/720 * 100vw), 520px);
    left: min(calc(40/720 * 100vw), 40px);
    width: min(calc(640/720 * 100vw), 640px);
    font-weight: 500;
  }
  .highend_wrap .slide-inner {  
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  .highend_wrap .slide-inner::after {
    content: "이미지컷";
    display: block;
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: #fff;
    font-size: 12px;
    z-index: 111;
  }
  .slide_wrap1 {
    position: absolute;
    top: min(calc(770/720 * 100vw), 770px);
    left: 0px;
    width: min(calc(640/720 * 100vw), 640px);
    height: min(calc(430/720 * 100vw), 430px);
    overflow: hidden;
    z-index: 2; 

  }
  .slide_wrap1 .h_swiper1 {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 100%;
      overflow: hidden;
  }
  .highend_wrap .h_swiper1 .swiper-slide {
        overflow: hidden;
  }
  .slide_wrap2 {
    position: absolute;
    top: min(calc(1240/720 * 100vw), 1240px);
    left: min(calc(140/720 * 100vw), 140px);
    width: min(calc(504/720 * 100vw), 504px);
    height: min(calc(377/720 * 100vw), 377px);
    overflow: hidden;
    z-index: 2;
  }
  .slide_wrap2 .h_swiper2 {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 100%;
      overflow: hidden;
  }
  .highend_wrap .h_swiper2 .swiper-slide {
        overflow: hidden;
  }
  .main_container .section5 {
    background: #fff;
  }
  .highend_wrap .txt_b  {
    display: none;
    position: absolute;
    top: min(calc(205/720 * 100vw), 205px);
    left: min(calc(324/720 * 100vw), 324px);
    width: min(calc(171/720 * 100vw), 171px);
    height: min(calc(171/720 * 100vw), 171px);    
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/txt_B.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .txt_g  {
    display: none;
    position: absolute;
    top: min(calc(315/720 * 100vw), 315px);
    left: min(calc(572/720 * 100vw), 572px);
width: min(calc(227/720 * 100vw), 227px);
    height: min(calc(59/720 * 100vw), 59px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/txt_G.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .contit::after {  
    content: "";
    display: block;
    position: absolute;
    top: min(calc(64/720 * -100vw), -64px);
    left: min(calc(428/720 * 100vw), 428px);
    width: min(calc(227/720 * 100vw), 164px);
    height: min(calc(177/720 * 100vw), 177px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/highend_vector.png") no-repeat 0 0;
    background-size: contain;
    animation: vectorSize 10s ease-out infinite;
  }
  @keyframes vectorSize {
    0% {
      transform: scale(1);
      -webkit-transform: scale(1);
    }
    50% {
      transform: scale(1.2);
      -webkit-transform: scale(1.2);
    }  
    100% {
      transform: scale(1);
      -webkit-transform: scale(1);
    }
  }
  .highend_wrap .slide_control {
    position: absolute;
    top: min(calc(670/720 * 100vw), 670px);
    left: min(calc(40/720 * 100vw), 40px);
    width: min(calc(300/720 * 100vw), 300px);
    height: min(calc(60/720 * 100vw), 60px);
  }
  .highend_wrap .slide_control .prev_btn {
    position: absolute;
    top: 0px;
    left: 0px;
    width: min(calc(60/720 * 100vw), 60px);
    height: min(calc(60/720 * 100vw), 60px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/btn_prev_slide.png") no-repeat 0 0;
    background-size: contain;
  }
  .highend_wrap .slide_control .next_btn {
    position: absolute;
    top: 0px;
    left: min(calc(80/720 * 100vw), 80px);
    width: min(calc(60/720 * 100vw), 60px);
    height: min(calc(60/720 * 100vw), 60px);
    background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/btn_next_slide.png") no-repeat 0 0;
    background-size: contain;  
  }
  .highend_wrap .slide_control .prev_btn span,
  .highend_wrap .slide_control .next_btn span { 
    display: none;
  }
  .highend_wrap .slide_control .counter { 
    display: flex; 
    position: absolute;
    top: 0px;
    right: 0px;
    width: min(calc(120/720 * 100vw), 120px);
    height: min(calc(60/720 * 100vw), 60px);    
    color: #000;
    justify-content: space-between;
    align-items: center;
  }
  .highend_wrap .slide_control .counter .current {
    font-weight: 800;
  }
  .highend_wrap .slide_control .counter::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 1px;
    transform: translate(-50%, -50%);
    background-color: #000;
  }
  .highend_wrap .slide_control .counter * { color: #000; }
}


/********************************************
      프리미엄
********************************************/
.section6 {
  background-color: #fff;
}
.premium_tit {
  padding: min(calc(200/1920 * 100vw), 200px) 0 0;    
  background-color: #fff;
  position: relative;
}
.premium_tit #tab_target1 {
  position: absolute;
  left: 0;
  top: 50%;
}
.premium_tit .tit_wrap {
  width: min(calc(1720/1920 * 100vw), 1720px);
  margin: 0 auto;
  position: relative;  
}
.premium_tit .contit {
  position: relative;
  padding-top: min(calc(80/1920 * 100vw), 80px);  
  left: 0px;
  line-height: 1.1;
  width: min(calc(950/1920 * 100vw), 950px);
  aspect-ratio: 1720/400;
}
.premium_tit .contit::before {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  width: min(calc(520/1920 * 100vw), 318px);
  height: min(calc(500/1920 * 100vw), 210px);
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium_obj1.png") no-repeat 0 0;
  background-size: contain;
}
.premium_tit .contit::after {
  content: "";
  display: block;
  position: absolute;
  top:60%;
  right: 0px;
  width: min(calc(500/1920 * 100vw), 290px);
  height: min(calc(520/1920 * 100vw), 220px);  
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium_obj2.png") no-repeat 0 0;
  background-size: contain;  
}
.premium_tit .contit strong {
  font-size: min(calc(70/1920 * 100vw), 70px);
  display: block;
  color: #000;
  font-weight: 900;
  position: relative;
  z-index: 2;
}
.premium_tit .contit strong:nth-of-type(1) {
  padding: 0 0 0 min(calc(110/1920 * 100vw), 110px);
}
.premium_tit .contit strong:nth-of-type(2) {
  padding: 0 0 0 min(calc(500/1920 * 100vw), 258px);
}
.premium_tit .copy {
  padding-top: min(calc(100/1920 * 100vw), 100px);  
  color: #000;
  font-weight: 600;
  font-size: min(calc(30/720 * 100vw), 20px);
}
.our-works-title {
  width: 45%;
}
.our-works-list {
  width: 55%;
  position: relative;
}
.our-works {
  z-index: 11;
  background-color: #fff;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 12rem 2rem 22rem;
  display: flex;
  position: relative;
}
#tab_target2 {
  position: absolute;
  /* top: 23%; */
  /* top: calc(640/1920 * 100vh); */
  top: 40vh;
  left: 0px;
  width: 100px;
  height: 2px; 
}
.our-works-item {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  color: #999;
  cursor: pointer;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  font-style: normal;
  text-decoration: none;
  transition: opacity .2s;
  display: flex;
  position: relative;
}
.our-works-item .t {
  letter-spacing: -.045rem;
  text-transform: uppercase;
  font-family: var(--font-montserrat);
  /* font-size: min(calc(50/1440 * 100vw), 50px); */
  /* font-size: 3.5rem; */
  font-size: min(calc(50/1440 * 100vw), 50px);
  font-weight: 500;
  line-height: 1.15;
  /* line-height: 1.8; */
  white-space: nowrap;
  height: min(calc(100/1440 * 100vw), 100px); 
}
.our-works-item:hover {
  opacity: 1;
}
.our-works-item.active {
  color: #000;
}
.draggable-wrapper {
    z-index: 0;
    /* pointer-events: none; */
    width: 100%;
    height: 100%;
    padding-top: 12rem;
    padding-bottom: 22rem;
    display: block;
    position: absolute;
    inset: 0%;
}
.container-draggable {
    z-index: 1;
    width: 100%;
    /* width: min(calc(1720/1920 * 100vw), 1720px); */
    padding: 0 min(calc(100/1920 * 100vw), 100px);
    margin: 0 auto;
    position: sticky;
    top: calc(50vh - 12rem);
}
@media screen and (max-width: 1024px) {
  .container-draggable {
      position: absolute;
      top: 5vh;
  }
}
.box-contain {
    justify-content: flex-start;
    /* align-items: center; */
    /* width: 400px;
    height: 530px; */
    /* margin-left: 5%; */
    width: min(calc(750/1920 * 100vw), 750px);
    display: flex;
    /* overflow: hidden;
    border-radius: 10px; */
}
.box-contain .slide_tab {
  position: sticky;
  top: 100px;
  width: min(calc(230/1920 * 100vw), 230px);  
}
.box-contain .slide_tab ul {
  position: relative;
  z-index: 99;
  width: min(calc(120/1920 * 100vw), 120px);  
}
.box-contain .slide_tab a {
  display: block;
  font-size: min(calc(16/1720 * 100vw), 16px);
  font-family: var(--font-montserrat);
  font-weight: 600;
  line-height: 2;
  opacity: 0.5;
}
.box-contain .slide_tab a.current {opacity: 1;}
.box-contain .slide_tab li:nth-of-type(1) {
  border-bottom: 2px solid #000;
}
.box {
    object-fit: fill;
    /* width: 100%;
    height: 100%; */
    /* width: 400px;
    height: 530px;     */
    width: min(calc(400/1920 * 100vw), 400px);
    aspect-ratio: 400/530;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
}
.box-inner {
    z-index: 0;
    width: 100%;
    height: 100%;
    position: relative;

}
.image-contain {
    z-index: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0%;
}
.image-contain .img { 
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.our-works .img[data-img="1"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/FITNESS CLUB.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="2"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/SEMINAR ROOM.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="3"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/MEETING ROOM.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="4"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/HEALING SPOT.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="5"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/CREATIVE STUDIO.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="6"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/GAME ROOM.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="7"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/RECEPTION LOUNGE.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="8"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/OFFICIAL ASSISTANT.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="9"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/HEALTH-CARE.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="10"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/G.X CLASS.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="11"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/LUNCH-DELIVERY.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="12"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/MEETING-ROOM-RESERVATION.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="13"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/TAX CONSULTING.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="14"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/VOUCHER.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="15"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/DELIVERY-RESERVATION.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="16"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/COMPANY-CAR-MGMT.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="17"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/CAR-SHARING.png") no-repeat 50% 50%; background-size: contain; }
.our-works .img[data-img="18"] { background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/premium/OFFICE-CLEANING.png") no-repeat 50% 50%; background-size: contain; }


@media screen and (max-width: 1024px) {
  .premium_tit .contit {
    width: min(calc(1720/1920 * 100vw), 900px);
    padding-top: min(calc(50/1024 * 100vw), 50px);
  }
  .premium_tit .contit strong {
    font-size: min(calc(100/1024 * 100vw), 100px); 
  }
  .our-works-title {
    width: 35%;
    display: none;
  }  
  .box-contain .slide_tab {
    position: sticky;
    top: 100px;
    width: min(calc(380/720 * 100vw), 720px);  
  }
  .box-contain .slide_tab ul {
    width: min(calc(130/720 * 100vw), 130px);
  }  
  .box-contain .slide_tab a {
    font-size: min(calc(20/720 * 100vw), 20px);
  }
  .box-contain {
      justify-content: flex-start;
      width: min(calc(640/720 * 100vw), 910px);
      display: flex;
  }  
  .box {
      width: min(calc(560/720 * 100vw), 560px);
      aspect-ratio: 400/530;
      position: relative;
      overflow: hidden;
      border-radius: 10px;
  }  
  .our-works {
      padding: min(calc(300/720 * 100vw), 300px) min(calc(40/720 * 100vw), 40px) min(calc(100/720 * 100vw), 100px);
  }  
  .our-works-item .t {
    letter-spacing: -.045rem;
    text-transform: uppercase;
    font-family: var(--font-montserrat);
    font-size: min(calc(40/720 * 100vw), 40px);
    font-weight: 500;
    line-height: 1.15;
  }  
  .our-works-list {
    width: 100%;
  }
  .container-draggable {
    width: min(calc(640/720 * 100vw), 910px);
  }
  .draggable-wrapper {
    padding-top: min(calc(100/720 * 100vw), 100px);
  }
}



/********************************************
      메인 퀵메뉴
********************************************/
.main_quick {
  position: fixed;
  right: 0;
  top: 50%;
  width: 110px;
  aspect-ratio: 110/286;  
  transform: translateY(-50%);
  z-index: 99999;
  /* background: url("/resources/img/main/quick_hover.png") no-repeat 0 0;
  background-size: contain; */
  overflow: hidden;
  transition: all 0.5s;
}
@media screen and (max-width: 1024px) {
  .main_quick { display: none; }
}
.main_quick .quick_top {  
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;    
  height: 70px;
  background: url("/resources/img/main/quick.png") no-repeat right 0;
}
.main_quick:hover .quick_top {  
    left: 100%;
}
.main_quick .quick_list {
  position: absolute;
  left: 100%;
  top: 0;
  width: 100%;  
  height: 100%;
  background: url("/resources/img/main/quick_hover.png") no-repeat 0 0;
  background-size: contain;  
  transition: all 0.5s;    
}
.main_quick .quick_list ul {
  position: absolute;
  left: 0;
  top: 70px;
  width: 100%;  
  height: calc(100% - 70px);
}
.main_quick .quick_list ul li {
  position: relative;
  height: 54px;
}
.main_quick .quick_list ul li a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.main_quick .quick_list ul li span { display: none; }


.main_quick:hover .quick_list {
  position: absolute;
  left: 0%;
}
.main_quick:hover .quick_top {
  opacity: 0;
  transition: all 0.5s;    
}

/********************************************
      인디게이터
********************************************/
.main_pager {
  position: fixed;
  height: 100%;
  right: 85px;
  top: 0;
  bottom: 0;
  width: 220px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99;
  mix-blend-mode: difference;
}

@media screen and (max-width: 1024px) {
  .main_pager { display: none; }
}

.main_pager a {
  padding: 5px 20px;
  font-family: var(--font-montserrat);
  font-size: 14px;
  font-weight: 400;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: right;
  position: relative;
  color: #fff;  
  line-height: 1.1;
  min-height: 40px;
}
.main_pager a::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0px;
  width: 5px;
  height: 5px;
  background-color: #fff;
  border-radius: 5px;
  mix-blend-mode: difference;  
  transform: translateY(-50%);
  opacity: 0.3;  
}
.main_pager a.current::after {
  opacity: 1;
}
.main_pager a span {
  opacity: 0;
  transition: opacity 0.5s ease-out;
}
.main_pager a:hover span,
.main_pager a.current span {
  opacity: 1;
  transition: opacity 0.5s ease-out;
}

/* 

.thum_img  {
    position: relative;
    z-index: 1;
    width: 400px;
    height: 530px;
    overflow: hidden;
}
.thum_swiper {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.thum_swiper .swiper-slide {
      overflow: hidden;
}
.thum_swiper .swiper-slide .slide-inner {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.thum_swiper .slide_con1 .slide-inner {  
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/01.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con2 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/02.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con3 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/03.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con4 .slide-inner {  
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/04.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con5 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/05.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con6 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/06.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con7 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/07.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con8 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/08.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con9 .slide-inner {  
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/09.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con10 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/10.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con11 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/11.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con12 .slide-inner {  
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/12.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con13 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/13.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con14 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/14.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con15 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/15.png") no-repeat 0 0;
  background-size: cover;
}
.thum_swiper .slide_con16 .slide-inner {
  background: url("https://bucket-apt.s3.ap-northeast-2.amazonaws.com/2024/sgg/resources/img/main/16.png") no-repeat 0 0;
  background-size: cover;
}
.txt_info  {
    position: relative;
    z-index: 1;
    width: 400px;
    height: 530px;
    overflow: hidden;
}
.txt_swiper {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.txt_swiper .swiper-slide {
  font-size: 20px;
  opacity: 0.5;
}
.txt_swiper .swiper-slide.swiper-slide-active {
  font-size: 20px;
  opacity: 1.0;
}
.slide_wrap {
  width: 1000px;
   display: flex;
   justify-content: space-between;
} */

/********************************************
      마우스 스크롤
********************************************/

/* mouse scroll */
.nectar-scroll-icon {
  width: 20px;
  height: 45px;
  text-align: center;
  position: relative;
  z-index: 100;
}
.mouse_scr {
  position: fixed; 
  left: 20px; 
  bottom: 20px;
  height: 135px;
  z-index: 30; 
  display: flex; 
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  mix-blend-mode: difference;  
}
.mouse_scr .txt {
  display:flex;
  justify-content: center;
  align-items: center;  
  padding-bottom: 5px;
  width: 100%;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .mouse_scr { display: none; }
}
.mouse_scr .ico {
  display: block;   
  position: relative;
  color: #fff !important;    
  text-align: center;
  border-radius: 100px;    
  -webkit-border-radius: 100px;
  transition: opacity 0.4s ease;
  -webkit-transition: opacity 0.4s ease;
  overflow: hidden;
  margin-left: 0px;
  left: 0;
  opacity: 0.6;    
  overflow: visible;
  opacity: 1;
  height: auto;
}

.mouse_scr .ico::before{ 
  position: absolute;
  content: '';
  display: block;
  left: 50%;
  margin-left: -1px;
  top: 22px;
  background-color: rgba(255,255,255,0.7);
  width: 2px;
  height: 6px;
  border-radius: 10px;
  transition: background-color .55s cubic-bezier(.5,.1,.07,1);
  -webkit-animation: trackBallSlide 2.4s cubic-bezier(0.000,0.000,0.725,1.000) infinite;
  animation: trackBallSlide 2.4s cubic-bezier(0.000,0.000,0.725,1.000) infinite;
}

@keyframes trackBallSlide{ 
  0%{opacity:1;  -webkit-transform:scaleY(1) translateY(-10px);  transform:scaleY(1) translateY(-10px)} 
  45%{ opacity:0;  -webkit-transform:scaleY(0.5) translateY(13px);  transform:scaleY(0.5) translateY(13px)}
  46%{ opacity:0;  -webkit-transform:scaleY(1) translateY(-10px);  transform:scaleY(1) translateY(-10px)}
  65%, 100%{ opacity:1;  -webkit-transform:scaleY(1) translateY(-10px);  transform:scaleY(1) translateY(-10px)}
}



/* 메인 동영상 */
.video_layer_wrap .movie_btn_skip {position:absolute; top: 15%; left:0%; width:100%; text-align:center; z-index:3;}
.video_layer_wrap .movie_btn_skip a {font-size: 80px; color: #fff;}

.video_layer_wrap {background:rgba(0,0,0,0.6); width:100%; height:100vh; position:fixed; top:0; left:0; z-index:1000;}
.video_layer_wrap .inner {position:relative; display:flex; flex-direction:column; align-items: center; justify-content: center; width:100%; height:100%;}
.video_layer_wrap .btn_skip {position:absolute; width:100%; left:0; bottom:30px; text-align:center; z-index:1001; }
.video_con {
      position:relative;
      max-width:1120px;
      width:90%;
      z-index: 2;

      /* height:0;  */
      /* padding-bottom:56.2%;  */
}
.video_con video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.video_con .movie_btn_sound {display:block; width:25px; height:25px; background-repeat:no-repeat; background-size:100% 100%; background-position:0 0; background-image:url("/resources/img/btn_sound_off.png"); position:absolute; top:50%; right:3%; margin-top:23%; z-index:1001; text-indent: -9999px; overflow:hidden;}
.video_con .movie_btn_sound.on {background-image:url("/resources/img/btn_sound_on.png");}

.mov_responsive {
  position: relative;
  padding-bottom: 56.2%;
  height: 0;
  overflow: hidden;
}
.mov_responsive iframe,
.mov_responsive object,
.mov_responsive embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 1024px) {
   .video_layer_wrap .btn_skip {padding-top:70%; bottom:inherit;}
   .video_con .movie_btn_sound {margin-top:20%;}

}

@media screen and (max-width: 478px) {
   .video_layer_wrap .btn_skip {padding-top:80%;}
   .video_con .movie_btn_sound {margin-top:17%; width:20px; height:20px;}
   /* .video_layer_wrap .movie_btn_skip {bottom:8rem;} */

}