/*.mainText>*{visibility:visible !important;}*/

.polish-screen{overflow:hidden !important;} /**********************************/

.goTop{opacity:0; width:52px; height:52px; position:fixed; right:22px; bottom:35px; z-index:48; line-height:120%; mix-blend-mode: difference; transition:all 0.5s;}
.goTop img{width:48px; height:48px;}
.goTop a{transition:all 0.4s; display:inline-block; width:48px; height:48px;}
.goTop a:hover{transform:translateY(-5px);}
.goTop.is-active{opacity:1;}

.cms-floating{background-color:#00bff6; position:relative;
  position:fixed; right:20px; bottom:30px; z-index:48; border-radius:50px; text-align:center;
}
.cms-floating a{display:inline-block; width:95px; height:55px; color:#fff; font-family: 'GY-Regular'; display:flex; flex-direction:column; justify-content:center;}
.cms-floating a span{font-family: 'GY-Regular'; display:inline-block; padding-top:3px; }
.cms-floating a>div{opacity:0; position:absolute; border-radius:50px; left:2px; top:2px; background-color:#fff; width:91px; height:51px; overflow:hidden; word-break:keep-all; word-wrap:normal; transition:all 0.5s;}
.cms-floating a>div.is-active{opacity:1;}
.cms-floating a>div b{transform:translateX(100px); font-family: 'GY-Regular'; font-size:17px; word-break:keep-all; word-wrap:normal; width:400px; display:inline-block; text-align:left; box-sizing:border-box; padding-top:20px; transition:transform 2.5s cubic-bezier(.55,.44,.77,.99); color:#000}
.cms-floating a>div b.is-active{transform:translateX(-250px);}

.login-status-pc{position: absolute; right:40px; top:20px; z-index:50; overflow: hidden;}
.login-status-pc li{float:left; position: relative;}
.login-status-pc li+li{padding-left:22px;}
.login-status-pc li+li:after{content:""; position: absolute; width:1px; height:10px; left:10px; top:4px; background-color:#fff; opacity:0.7;}
.login-status-pc li a{color:#fff; font-family: 'GY-Regular'; font-size:14px; opacity:0.8;}
.login-status-pc li a:hover{text-decoration:underline;}

body {
  height: 100vh;
  background-color: #111;
  color: white;
  overflow-x: hidden;
  
}

* {
  margin: 0; padding: 0;
  box-sizing: border-box;
}
.loading-bg{width:100%;  background-color:#2a2c44; position:absolute; left:0; top:0; z-index:999999999;}
.cursor-circle {pointer-events:none; position: absolute;background-color:#fff;width: 22px; height: 22px; border-radius: 50%;  z-index:900;  mix-blend-mode:difference; 
  transition:transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);}
.scale{transform:scale(3.7);}  /*cursor효과*/
.scale-blur{transform:scale(4.2); filter: blur(3px);} /*cursor효과*/
.scale-big{transform:scale(5.0);}  /*cursor효과*/

h1, h2 {
  font-weight: 400;
  max-width: none;
}

/* galaxy */

canvas {
  height: 100%;
  width: 100%;
  position:absolute; left:0; top:0;
}
.dg.main{display:none;}

.space-image-for-mobile{ display:none; z-index:9;   width:100vw; height:100vh; background:url("../image/space-mobile.png") no-repeat 50% 50%; background-size:cover; position:absolute; }
.forCanvas{position:absolute; top:0; left:0; height:100vh; width:100%; overflow:hidden; z-index:10;}
.mouse-roll{visibility:hidden; position:absolute; transform:translateX(-50%); left:50%; bottom:70px; z-index:20;}
.mouse-roll img{width:40px; height:40px;}
.mouse-roll::before {position:absolute; top:5px; left:19px; content: ""; display:inline-block; width:2px; height:9px; background-color:#fff; border-radius:10px;
  animation-name: mouse-roll;
  animation-duration:1.5s;
  animation-fill-mode:both;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.mouse-roll p{font-family: 'Univers47-CondensedLight'; font-size:15px; top:-30px; position:absolute;}

.star-bg-image{position:absolute; left:0; top:0; width:100%; height:100vh; z-index:11; mix-blend-mode: lighten; opacity:0.4;}
.star-bg-image img{object-fit:cover;}
.star-min{visibility:hidden; position:absolute; z-index:2; left:0; top:0; width:100%; height:100%; object-fit:cover; display:inline-block; }
.mainText{height: 100vh; position:relative; z-index:12;}
.test2{height: 100vh; background-color:blue;}

/* .master-logo{width:150px; position:absolute; left:25px; top:20px; z-index:48; */
/*  animation-name: mainStart;
  animation-duration:1s;
  animation-fill-mode:both;
  animation-timing-function: ease-out;
  animation-delay:1.8s;*/

.master-logo{width:150px; position:absolute; left:25px; top:-20px; z-index:48;}
.master-logo a{cursor:none;}
.master-logo img{width:180px;}
/* .master-logo img{width:120px;} */
.mainText h2{visibility:hidden; font-family: 'Univers47-CondensedLight'; width:100%;color:#fff;  top:30%;  font-weight:100; line-height:118%; font-size:55px; position:absolute; text-align:center;left:0; }
.mainText h3{visibility:hidden; font-family:Pretendard, -apple-system;  width:100%; font-weight:300; font-size:18px; color:#fff;position:absolute; text-align:center;z-index:10; left:0;
  top:calc(30% + 143px);
}
.mainText span{visibility:hidden; position:absolute; top:calc(30% + 200px); left:50%; transform:translateX(-50%); z-index:20;}
.mainText span a{cursor:none; display:inline-block; width:180px; height:45px; font-family:Pretendard, -apple-system; font-weight:200;
  color:#fff; font-size:16px; text-align:center; box-sizing:border-box; text-decoration:none;
  padding-top:13px; border:1px solid #fff; border-radius:50px; transition:all 0.4s}
.mainText span a:hover{background-color:#fff; color:#000;}
.test2 h5{color:#fff; font-size:30px;}
.star-over-black{position:absolute; left:0; bottom:0; width:100%; background: linear-gradient(0deg, rgba(0,0,0,0.8244339972317052) 0%, rgba(0,0,0,0.513509627483806) 48%, rgba(0,0,0,0) 100%); 
  z-index:19; height:260px; opacity:0; transition:all 0.5s;}
.star-over-black.show{opacity:0.8;}

.nav-pc{z-index:19; font-family: 'Univers47-CondensedLight'; position:absolute; right:120px; top:70px; letter-spacing:1px; transition:all 0.5s; 
  animation-name: mainStart;
  animation-duration:1s;
  animation-fill-mode:both;
  animation-timing-function: ease-out;
  animation-delay:0.2s;
}
.nav-pc>li{float:left; position:relative;}
.nav-pc>li+li{margin-left:60px;}
.nav-pc>li>a{color:#fff; font-size:18px; position:relative; overflow:hidden; display:inline-block; padding-bottom:12px;}
.nav-pc>li>a::after{display: block; content: ''; height: 2px;background-color:#fff;position: absolute;bottom: 0;width: 100%;  transform: scaleX(0); transition:all 0.4s cubic-bezier(0.5, 0.7, 0.4, 1); transform-origin:center;}
.nav-pc>li>a.hovers::after{transition: transform 0.4s cubic-bezier(0.5, 0.7, 0.4, 1); transform: scaleX(1.0); transform-origin:center;}

.nav-pc>li>ul{position:absolute; z-index:100; width:240px; display:none;}
.nav-pc>li>ul.is-active{}
.nav-pc>li>ul>li{margin-top:20px;}
.nav-pc>li>ul>li>a{color:#fff; font-size:15px; transition:all 0.2s; display:inline-block; position:relative;}
.nav-pc>li>ul>li>a::before{display: block; content:''; height:2px; background-color:#fff; position: absolute;bottom:-3px; width: 100%;  transform:scaleX(0); transition:all 0.2s cubic-bezier(0.5, 0.7, 0.4, 1); transform-origin:left; opacity:0.5;}
.nav-pc>li>ul>li>a.hovers::before{transition: transform 0.2s cubic-bezier(0.5, 0.7, 0.4, 1); transform: scaleX(1.0); transform-origin:left; opacity:1;}

/* 더마쉴드 때문에 추가 */
.nav-pc>li> ul li a{color:#fff; display:inline-block;}
.nav-pc>li> ul>li ul li+li{margin-top:10px;}
.nav-pc>li> ul>li ul{margin-top:12px; margin-left:20px;}
.li_extra{height:40px;} /*height:67px;*/
.nav-pc>li>ul>li>ul>li>a{position: relative; display:inline-block;}
.nav-pc>li>ul>li>ul>li>a::after{display: block; content: ''; height: 2px;background-color:#fff;position: absolute; bottom:-3px; width: 100%;  transform: scaleX(0); transition:all 0.4s cubic-bezier(0.5, 0.7, 0.4, 1); transform-origin:left;}
.nav-pc>li>ul>li>ul>li>a:hover::after{transition: transform 0.3s cubic-bezier(0.5, 0.7, 0.4, 1); transform: scaleX(1.0); transform-origin:left;}


/* comparison */

.header-section{height:100vh; display:flex; justify-content:center; align-items:center;}

.comparisonSection {
  overflow:hidden;
  position: relative;
  padding-bottom: 56.25%; /* to maintain aspect ratio (responsive!) */
}
.comparisonImage {
  width: 100%;
  height: 100%;
}
.afterImage_1 {
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(100%, 0px);
}
.afterImage_1 img {
  transform: translate(-100%, 0px);
}

.afterImage_2 {
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(100%, 0px);
}
.afterImage_2 img {
  transform: translate(-100%, 0px);
}

.afterImage_3 {
  background-color:#000;
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(0px, 100%);
}
.afterImage_3 img {
  transform: translate(0px, -100%);
}

.comparisonImage img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  object-fit:cover;
}
@keyframes pulse3 {
    from{       
        box-shadow: 0 0 0 0 hsla(0, 0%, 95.3%, .6)
    }
    to{        
        box-shadow: 0 0 0 20px hsla(0, 0%, 95.3%, 0)
    }
}

.mile{position:absolute; left:50%; transform:translateX(-50%); top:36%; z-index:20;}
.miles-count{overflow:hidden; width:116px; height:30px; display:inline-block;}
.miles{font-family: 'GY-Regular'; color:#fff; font-size:27px; display:inline-block;}
.miles b{display:block; padding-top:4px; text-align:right;}
.miles b img{width:105px;}
#nuB{display:inline-block; transform:translate(7px, 8px);}
.dan-miles{display:inline-block; transform:translate(-7px, -7px); font-family: 'GY-Regular'; color:#fff; font-size:20px;}

.comparis-text{width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:15%; z-index:20; text-align:center;}
.comparis-text h2{font-size:70px; padding-bottom:10px;}
.comparis-text p{font-size:25px; font-family:'GY-Light';  text-align:center;}
.comparis-text span{display:block; width:100%; font-size:19px; font-family:Pretendard, -apple-system;   text-align:center; padding-top:30px; line-height:160%;}

.comparis-text2{width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:15%; z-index:20; text-align:center;}
.comparis-text2 h2{font-size:70px; padding-bottom:10px;}
.comparis-text2 p{font-size:25px; font-family:'GY-Light';  text-align:center;}
.comparis-text2 span{width:100%; font-size:19px; font-family:Pretendard, -apple-system;   text-align:center; padding-top:30px; line-height:160%;}

.comparis-text3{width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:15%; z-index:20; text-align:center;}
.comparis-text3 h2{font-size:70px; padding-bottom:10px;}
.comparis-text3 p{font-size:25px; font-family:'GY-Light';  text-align:center;}
.comparis-text3 span{width:100%; font-size:19px; font-family:Pretendard, -apple-system;   text-align:center; padding-top:30px; line-height:160%;}

/* .comparis-text2{ width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:15%; z-index:20; text-align:center;}
.comparis-text2 h2{font-size:70px; padding-bottom:10px;}
.comparis-text2 span{font-size:20px; font-family:'GY-Light';  text-align:center; padding-top:30px; display:inline-block; line-height:140%;}

.comparis-text3{ width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:43%; z-index:20; text-align:center;}
.comparis-text3 h2{font-size:70px; padding-bottom:10px;}
.comparis-text3 span{font-size:20px; font-family:'GY-Light';  text-align:center; padding-top:30px; display:inline-block; line-height:140%;} */

.arrow-script{position:absolute; width:60vw; left:50%; top:30%; transform:translateX(-50%); z-index:20; mix-blend-mode: screen; opacity:0;}
.arrow-script img{width: 100%; }

.cms-btn-pc{position: absolute; left:50%; top:84%; z-index:21; mix-blend-mode:difference;}
.cms-btn-pc a{width:200px; height:45px; cursor:none; border-radius:50px; border:1px solid #fff; text-align:center; box-sizing:border-box; padding-top:13px; font-family: 'GY-UltraLight', sans-serif;
  display:inline-block; font-weight:200; font-size:16px; transition:all 0.4s; color:#fff; transform:translateX(-50%); }
.cms-btn-pc a:hover{color:#000; background-color:#fff;}

.arrow-plus-1{position:absolute; left:48%; top:59%; z-index:20; width:50px; height:50px;}
.arrow-plus-1:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3 1s 0s infinite both;
}
.arrow-plus-1 a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-1 div{position: absolute; width:150px; top:-150px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-1 div:before{content:''; width:1px; height:100px; background-color:#fff; position: absolute; left:50%; top:50px;}
.plpTxt{font-family: 'GY-Light'; color:#fff; font-size:20px; text-align:center;}
.slpTxt{font-family:Pretendard, -apple-system;  color:#fff; font-size:14px; display:block; text-align:center; padding-top:5px; letter-spacing:1px;}


.arrow-plus-2{position:absolute; left:38%; top:63%; z-index:20; width:50px; height:50px;}
.arrow-plus-2:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3 1s 0s infinite both;
}
.arrow-plus-2 a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-2 div{position: absolute; width:150px; top:-180px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-2 div:before{content:''; width:1px; height:103px; background-color:#fff; position: absolute; left:50%; top:76px;}

.arrow-plus-3{position:absolute; left:57%; top:60%; z-index:20; width:50px; height:50px;}
.arrow-plus-3:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3 1s 0s infinite both;
}
.arrow-plus-3 a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-3 div{position: absolute; width: 150px; top:-130px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-3 div:before{content:''; width:1px; height:100px; background-color:#fff; position: absolute; left:50%; top:50px;}


.dust-1{mix-blend-mode:screen; position:absolute; }
.snow-1{mix-blend-mode:screen; position:absolute; overflow:hidden;}
.rain-1{mix-blend-mode:screen; position:absolute; opacity:0.7;}
.protect{position:absolute; left:50%; top:47.5%; transform:translateX(-50%);}

.year-1{position:absolute; opacity:0.5;}
.year-2{position:absolute; opacity:0.5;}
.year-3{position:absolute; opacity:0.5;}





/* =Reveal Gallery */
.rg__image {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #000000;
  pointer-events: none;
}
.rg__image img {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  object-position: 50% 50%;
  opacity: 0.8
}

.reveal-gallery {
  font-family:'GY-Light'; 
  background-color:#abb3ba;
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  color: #fff;
  position: relative;
  z-index: 1;
}
.rg__column {
  flex-grow: 1; /* equivalent to 33.33% */
  padding: 0 6.6vw;
  display: flex;
  justify-content: center;
  align-items:center;
  position: relative;
  overflow: hidden;
  height: 100vh;
}
.rg__text--heading{
  /*transform: translateY(20px);*/
  transition: transform 0.9s cubic-bezier(.02,.13,.02,.99);
}
.rg__text--heading.is-active{
  transform: translateY(-100px);
}

.rg__text--heading span {
  font-size: 2vw;
  opacity: 0.5;
}
.rg__text--heading h3,
.rg__text--heading span,
.chapter {
  font-family: 'Univers47-CondensedLight';
  font-weight: normal;
}
.rg__text {
  z-index: 1;
  position: relative;
}

.rg__text--heading h3{font-size:63px; line-height:115%; margin-bottom:0; margin-top:50px; transition: all 1s cubic-bezier(.02,.13,.02,.99);}
.rg__text--heading h3.is-active{opacity:0.9;}
.rg__text--heading i{font-style:normal; font-size:19px; font-family:Pretendard, -apple-system; font-weight:normal; }

.rg__text--copy {
  font-family:Pretendard, -apple-system; 
  font-weight: 300;
  letter-spacing: .03vw;
  overflow:hidden;
  transition: transform 1.2s cubic-bezier(.02,.13,.02,.99);
}
.rg__text--copy.is-active{
  transform:translateY(-70px);
}
.rg__text--mask {
  transition: transform 1.2s cubic-bezier(.02,.13,.02,.99);
  transform:translateY(-120%);
}
.rg__text--mask.is-active {
  transform:translateY(0%);
}
.rg__column::before {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  content: '';
  width: 1px;
  height: 20vh;
  transform: translateY(-50%);
  background-color: #fff;
  opacity: 0.4
}
.rg__image {
  width: 100%;
  height: 100%;
  overflow: hidden;
  transform: translateY(-100%);
  transition: transform 0.5s cubic-bezier(.1,.31,.45,.99);
  background-color: #000;
}
.rg__image--mask {
  height: 100%;
  overflow: hidden;
  transition: transform 0.5s cubic-bezier(.1,.31,.45,.99);
  transform: translateY(100%);
}
.rg__image img {
  opacity: 0.5;
  transform: scale( 1.3 );
  transition: all 1.2s cubic-bezier(.1,.31,.45,.99);
}
.rg__image--mask img.is-active{
  transform: scale( 1 );
  opacity: 0.7;
}
.rg__column.is-active .rg__image,
.rg__column.is-active .rg__image--mask {
  transform: translateY(0);
}
.rg__text--mask {
  overflow: hidden;
}

.fill-background {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
}

.rg__text--mask p{line-height:170%;}

.rev_btn{position:relative; top:-40px;}
.rev_btn a{cursor:none; display:inline-block; width:180px; height:45px; font-family:Pretendard, -apple-system;  font-weight:200;
  color:#fff; font-size:16px; text-align:center; box-sizing:border-box; text-decoration:none;
  padding-top:13px; border:1px solid #fff; border-radius:50px; transition:all 0.4s}
.rev_btn a:hover{background-color:#fff; color:#000;}


/* Construction */
.construction{background-color:#b4bbc2; height:100vh; font-family: 'Univers47-CondensedLight';}
.construction_in{position:relative; height:100%; width:100%; }
.constUl_btn{display:flex; gap:0 30px; top:15%; font-size:55px; position:absolute; left:50%; transform:translateX(-50%);}
.constUl_btn li a{color:#7e8c98; position:relative; display:inline-block; transition:all 0.4s;}
.constUl_btn li a.is-active::before{content:""; position:absolute; display:block; height:6px; bottom:-14px; width:100%; background: linear-gradient(-90deg, #0094d8, #686fc8, #ae2c8f); background-size: 300% 300%; animation: gradient 3s ease infinite;}
.constUl_btn li a.is-active{color:#2c353d;}
.constUl_btn li a:hover{color:#2c353d;}

.constUl_content{display:flex; gap:0 1vw; width:1440px; position:absolute; top:37%; left:50%; transform:translateX(-50%);}
.arrow-btn{position:absolute; top:40%; width: 100%;}
.arrow-btn img{width:58px;}
.arrow-btn .arr-m-left{position:absolute; left:-80px;}
.arrow-btn .arr-m-right{position:absolute; right:-80px;}
.constUl_content>a{position:relative; color:#fff; overflow:hidden; width:100%;}
.constUl_content>a>div{position:absolute; top:101%; opacity:0.2; background-color:rgba(0, 0, 0, 0.8); display:flex; flex-direction:column; position:absolute; text-align:center; width:100%; height:100%; justify-content:center; align-items:center; transition:all 0.4s cubic-bezier(.22,.03,.3,.99);}
.constUl_content>a>div p{font-size:30px; padding-bottom:30px;}
.constUl_content>a>div span{font-size:18px; line-height:150%;}
.constUl_content>a.is-active>div{top:0; opacity:0.9;}
.constUl_content>a img{max-width:100%;}
.dummy-navigator{position:absolute; left:50%; transform:translateX(-50%); bottom:-50px;}

.request{font-family: 'Univers47-CondensedLight'; background: url(../image/main-request-bg.jpg) no-repeat 50% 50%; background-size:cover; height:100vh;}
.request_in{position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; height:100%;}
.request span{position:absolute; left:5%; top:100px;}
.request span img{width:15vw;}
.request h3{font-size:55px; font-weight:normal;}
.request p{opacity:0.9; font-size:20px; line-height:160%; padding-top:70px; padding-bottom:50px; box-sizing:border-box;}

.request a{cursor:none; display:inline-block; width:240px; height:45px; font-family: 'GY-UltraLight', sans-serif; font-weight:200;
  color:#fff; font-size:16px; text-align:center; box-sizing:border-box; text-decoration:none;
  padding-top:13px; border:1px solid #fff; border-radius:50px; transition:all 0.4s}
.request a:hover{background-color:#fff; color:#000;}

.footer{background-color:#2c2c2c; font-family: 'Univers47-CondensedLight'; height:400px; display:flex; justify-content:center;}
.footer a{color:#fff;}
.footer_in{padding-top:100px; box-sizing:border-box; position:relative;}
.footerUl{display:flex; gap:0 4vw;}
.footerUl p{font-size:25px; padding-bottom:7px; position:relative; margin-bottom:10px; opacity:0.7;}
.footerUl p::before{content:''; position:absolute; background-color:#5a5a5a; height:2px; width:100%; display:block; bottom:0; left:0;}
.footerUl ul li{font-size:16px; padding-top:10px; opacity:0.7;}
.footer-text-1{font-size:12px; position:absolute; bottom:20px; font-family: 'GY-Regular'; width:100%; text-align:center; line-height:150%; color:#7b7b7b;}
.footerUl .f-t-kor{font-family:Pretendard, -apple-system; font-size:13px;}

/*십자 버튼 클릭시 출현 모달*/
.main-pop-1{transform:translateX(101%);position:fixed; z-index:100; background-color:#fff; width:100%; height:100vh; left:0; top:0; transition:transform 0.5s cubic-bezier(0,.11,.1,1);}
.main-pop-1.is-active{transform:translateX(0);}
.main-pop-1__in{display:flex; height:100%;}
.mp1-left{width:40%; background:url("../image/main-pop-1__bg.jpg") no-repeat 50% 50%; background-size:cover; height:100%;}
.mp1-left i{position:absolute; width:42vw; left:5vw; top:50%; transform:translateY(-50%);}
.mp1-left i img{width:100%;}
.mp1-right{width:60%; box-sizing:border-box; padding-left:12vw; color:#1c1e20; display:flex; flex-direction:column; justify-content:center;}
.mp1-right h2{font-family: 'Univers47-CondensedLight'; font-size:44px; line-height:120%; padding-bottom:30px;}
.mp1-right p{font-family: 'GY-Regular'; font-size:17px; line-height:150%;}
.mp1-right p i{font-style:normal; margin:0 3px 0 -12px;}
.mp-btn{padding-top:50px;}
.mp-btn a{width:200px; height:50px; font-family: 'GY-Regular'; background-color:#0e2542; color:#fff; box-sizing:border-box; padding-top:16px; display:inline-block; text-align:center; border-radius:3px; transition:all 0.3s;}
.mp-btn a:hover{background-color:#295389;}
.mp-close{position: absolute; right:50px; top:50px; width:43px; height:43px;}

.main-pop-2{transform:translateX(101%);position:fixed; z-index:100; background-color:#fff; width:100%; height:100vh; left:0; top:0; transition:transform 0.5s cubic-bezier(0,.11,.1,1);}
.main-pop-2.is-active{transform:translateX(0);}
.main-pop-2__in{display:flex; height:100%;}
.mp2-left{width:40%; background:url("../image/main-pop-2__bg.jpg") no-repeat 50% 50%; background-size:cover; height:100%;}
.mp2-left i{position:absolute; width:42vw; left:5vw; top:50%; transform:translateY(-50%);}
.mp2-left i img{width:100%;}
.mp2-right{width:60%; box-sizing:border-box; padding-left:12vw; color:#1c1e20; display:flex; flex-direction:column; justify-content:center;}
.mp2-right h2{font-family: 'Univers47-CondensedLight'; font-size:44px; line-height:120%; padding-bottom:30px;}
.mp2-right p{font-family: 'GY-Regular'; font-size:17px; line-height:150%;}
.mp2-right p i{font-style:normal; margin:0 3px 0 -12px;}


.main-pop-3{transform:translateX(101%);position:fixed; z-index:100; background-color:#fff; width:100%; height:100vh; left:0; top:0; transition:transform 0.5s cubic-bezier(0,.11,.1,1);}
.main-pop-3.is-active{transform:translateX(0);}
.main-pop-3__in{display:flex; height:100%;}
.mp3-left{width:40%; background:url("../image/main-pop-2__bg.jpg") no-repeat 50% 50%; background-size:cover; height:100%;}
.mp3-left i{position:absolute; width:42vw; left:5vw; top:50%; transform:translateY(-50%);}
.mp3-left i img{width:100%;}
.mp3-right{width:60%; box-sizing:border-box; padding-left:12vw; color:#1c1e20; display:flex; flex-direction:column; justify-content:center;}
.mp3-right h2{font-family: 'Univers47-CondensedLight'; font-size:44px; line-height:120%; padding-bottom:30px;}
.mp3-right p{font-family: 'GY-Regular'; font-size:17px; line-height:150%;}
.mp3-right p i{font-style:normal; margin:0 3px 0 -12px;}

.comparisonSection-mobile{display:none;}
.dot-menu{display:none;}
.mobile-gnb{display:none;}


@media all and (max-width: 1600px){
.comparis-text{top:12%;}
.comparis-text2{top:12%;}
.comparis-text h2{font-size:60px;}
.comparis-text span{font-size:18px; padding-top:0;}
.mile{top:32%;}

}



@media all and (max-width: 1400px){
.comparis-text{top:10%;}
.comparis-text2{top:10%;}
.comparis-text h2{font-size:58px;}
.comparis-text span{font-size:17px; padding-top:0;}
.mile{top:30%;}

}


@media all and (max-width: 1024px){ /******** 아이패드 프로 가로(wide) 시작 **********/
.non1024{display:none;}
/*.mile-mobile{display:none;}*/
.space-image-for-mobile{display:block;}
.comparisonSection{display:none;}
/* comparison - mobile */

.comparisonSection-mobile {
  display:block;
  overflow:hidden;
  position: relative;
  height: 100vh;
  /*padding-bottom: 56.25%; */
  /* to maintain aspect ratio (responsive!) */
}
.comparisonImage-mobile {
  width: 100%;
  height: 100%;
}
.afterImage-mobile {
  position: absolute;
  overflow: hidden;
  top: 0;
}
.afterImage-mobile img {
  transform: translate(-100%, 0px);
}

.afterImage_1-mobile {
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(100%, 0px);
}
.afterImage_1-mobile img {
  transform: translate(-100%, 0px);
}

.afterImage_2-mobile {
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(100%, 0px);
}
.afterImage_2-mobile img {
  transform: translate(-100%, 0px);
}

.afterImage_3-mobile {
  background-color:#000;
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(0px, 100%);
}
.afterImage_3-mobile img {
  transform: translate(0px, -100%);
}

.comparisonImage-mobile img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  object-fit:cover;
}
@keyframes pulse3-mobile {
    from{       
        box-shadow: 0 0 0 0 hsla(0, 0%, 95.3%, .6)
    }
    to{        
        box-shadow: 0 0 0 20px hsla(0, 0%, 95.3%, 0)
    }
}

.mile-mobile{position:absolute; left:50%; transform:translateX(-50%); top:28%; z-index:20;}
.miles-count-mobile{overflow:hidden; width:83px; height:22px; display:inline-block;}
.miles-mobile{font-family: 'GY-Regular'; color:#fff; font-size:19px; display:inline-block;}
.miles-mobile b{display:block; padding-top:4px; text-align:right;}

.miles-mobile b img{width:75px;}
#nuC{display:inline-block; transform:translate(7px, 6px);}

.dan-miles-mobile{display:inline-block; transform:translateY(-5px); font-family: 'GY-Regular'; color:#fff; font-size:15px;}


.comparis-text-mobile{width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:10%; z-index:20; text-align:center;}
.comparis-text-mobile h2{font-size:29px; padding-bottom:10px;}
.comparis-text-mobile p{font-size:17px; font-family:'GY-Light';  text-align:center;}
.comparis-text-mobile span{display:block; width:100%; font-size:15px; font-family:'GY-Light';  padding-top:30px; line-height:140%; text-align:left; padding-left:5vw; box-sizing:border-box; padding-right:5vw;}

.comparis-text2-mobile{ width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:23%; z-index:20; text-align:center;}
.comparis-text2-mobile h2{visibility:hidden; font-size:17px; padding-bottom:10px;}
.comparis-text2-mobile span{font-size:17px; font-family:'GY-Light'; padding-top:30px; display:inline-block; line-height:140%; text-align:left; padding-left:5vw; box-sizing:border-box; padding-right:5vw;}

.comparis-text3-mobile{ width:100%; font-family: 'Univers47-CondensedLight'; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:23%; z-index:20; text-align:center;}
.comparis-text3-mobile h2{visibility:hidden; font-size:15px; padding-bottom:10px;}
.comparis-text3-mobile span{font-size:12px; font-family:'GY-Light';  padding-top:30px; display:inline-block; line-height:140%; text-align:left; padding-left:5vw; box-sizing:border-box; padding-right:5vw;}

.arrow-script-mobile{position:absolute; width:60vw; left:50%; top:30%; transform:translateX(-50%); z-index:20; mix-blend-mode: screen; opacity:0;}
.arrow-script-mobile img{width: 100%; }

.cms-btn-mobile{position: absolute; left:50%; top:83%; z-index:21; mix-blend-mode:difference;}
.cms-btn-mobile a{width:200px; height:45px; cursor:none; border-radius:50px; border:1px solid #fff; text-align:center; box-sizing:border-box; padding-top:13px; font-family: 'GY-UltraLight', sans-serif;
  display:inline-block; font-weight:200; font-size:16px; transition:all 0.4s; color:#fff; transform:translateX(-50%); }

.arrow-plus-1-mobile{position:absolute; left:47%; top:56.5%; z-index:20; width:50px; height:50px;}
.arrow-plus-1-mobile:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3-mobile 1s 0s infinite both;
}
.arrow-plus-1-mobile a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-1-mobile div{position: absolute; top:-109px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-1-mobile div:before{content:''; width:1px; height:63px; background-color:#fff; position: absolute; left:50%; top:48px;}
.plpTxt-mobile{font-family: 'GY-Light'; color:#fff; font-size:16px; text-align:center;}
.slpTxt-mobile{font-family: 'GY-UltraLight'; color:#fff; font-size:12px; display:block; text-align:center; padding-top:5px; letter-spacing:1px;}

.arrow-plus-2-mobile{position:absolute; left:25%; top:60%; z-index:20; width:50px; height:50px;}
.arrow-plus-2-mobile:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3-mobile 1s 0s infinite both;
}
.arrow-plus-2-mobile a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-2-mobile div{position: absolute; top:-79px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-2-mobile div:before{content:''; width:1px; height:32px; background-color:#fff; position: absolute; left:50%; top:50px;}

.arrow-plus-3-mobile{position:absolute; left:60%; top:56%; z-index:20; width:50px; height:50px;}
.arrow-plus-3-mobile:after{
    z-index:19;
    position: absolute;
    display: block;
    content: "";
    width: 50%;
    height: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    animation: pulse3-mobile 1s 0s infinite both;
}
.arrow-plus-3-mobile a{position: absolute; z-index:20; width:50px; height:50px;}
.arrow-plus-3-mobile div{position: absolute; top:-192px; left:50%; transform:translateX(-50%); color:#fff; }
.arrow-plus-3-mobile div:before{content:''; width:1px; height:130px; background-color:#fff; position: absolute; left:50%; top:64px;}

.dust-1-mobile{mix-blend-mode:screen; position:absolute; }
.snow-1-mobile{mix-blend-mode:screen; position:absolute; overflow:hidden;}
.rain-1-mobile{mix-blend-mode:screen; position:absolute; opacity:0.7;}
.protect-mobile{position:absolute; left:50%; top:47.5%; transform:translateX(-50%);}

.year-1-mobile{position:absolute; opacity:0.5;}
.year-2-mobile{position:absolute; opacity:0.5;}
.year-3-mobile{position:absolute; opacity:0.5;}

  /*재조정*/
.arrow-plus-3-mobile{top:67%;}
.arrow-plus-1-mobile{top:57.5%;}
.plpTxt-mobile{font-size:27px;}
.slpTxt-mobile{font-size:19px;}
.arrow-plus-3-mobile div{top:-257px;}
.arrow-plus-3-mobile div:before{top:100px; height:151px;}
.arrow-plus-1-mobile div{top:-139px;}
.arrow-plus-1-mobile div:before{top:56px; height:118px;}
.arrow-plus-2-mobile div{top:-125px;}
.arrow-plus-2-mobile div:before{top:53px; height:68px;}

.comparis-text-mobile{top:15%;}
.comparis-text-mobile h2{font-size:45px;}
.comparis-text-mobile span{font-size: 17px;}
.comparis-text2-mobile{top:15%;}
.comparis-text2-mobile h2{font-size:45px;}
.comparis-text2-mobile span{font-size: 17px;}
.comparis-text3-mobile{top:15%;}
.comparis-text3-mobile h2{font-size:45px;}
.comparis-text3-mobile span{font-size: 17px;}

.comparis-text-mobile span{padding-top:0;}

body {
  cursor:default;
}
.cursor-circle{display:none;}
.comparisonSection{display:none;}
  /* =Reveal Gallery */
  .reveal-gallery {
    flex-direction: column;
    height: 900px;
  }
  .rg__column {
    height: 300px;
  }
  
  .rg__text {
    width:100%;
    text-align:center;
    height: 300px;
    display:flex;
    flex-direction: column;
    justify-content:center;
  }

  .rg__column .rg__image,
  .rg__column .rg__image--mask {
    transform: translateY(0);
  }

  .rg__text--copy {
    transform:translateY(0px);
  }
  
  .rg__text--mask {
    transform:translateY(0%);
  }  
  .rg__text--heading h3{margin:0; font-size:32px;}
  .rg__text--heading span{font-size:20px;}


/* comparison - mobile */

.arrow-plus-3-mobile{top:59%;}
.arrow-plus-1-mobile{top:59%;}
.plpTxt-mobile{font-size:16px;}
.slpTxt-mobile{font-size:12px; line-height:110%;}
.arrow-plus-3-mobile div{top:-192px; width:90px; line-height:110%;}
.arrow-plus-3-mobile div:before{height:130px; top:64px;}
.arrow-plus-1-mobile div{top:-177px;}
.arrow-plus-2-mobile div{top:-179px; width:100px;}
.arrow-plus-2-mobile div:before{height:124px; top:64px;}

.star-bg-image{overflow:hidden;}
.nav-pc{display:none;}
.rg__image img{filter: brightness(0.6);}
.rev_btn{position:static; top:auto; padding-top:15px;}
.master-logo{position:fixed;}

.dot-menu{position:fixed; right:20px; top:20px; z-index:60; display:inline-block; mix-blend-mode:difference;}
.dot-menu a{display:inline-block; position:relative; width:30px; height:30px; transition:all 0.3s;}
.dot-menu a.is-active{transform:rotate(-45deg);}
.dot-menu a.is-active .mobile-Menu__open{opacity:0;}
.dot-menu a.is-active .mobile-Menu__close{opacity:1;}
.dot-menu a img{width:30px; height:30px;}
.dot-menu .mobile-Menu__open{position:absolute; left:0; top:0; transition:all 0.3s;}
.dot-menu .mobile-Menu__close{position:absolute; left:0; top:0; opacity:0; transition:all 0.3s;}
.mobile-gnb{position:fixed; left:0; top:0; z-index:55; width:100%; height:100%; }
.mobile-gnb>p{content:''; position:absolute; width:100%; height:100%; left:0; top:0;  background-color:rgba(0, 0, 0, 1);}
.mobile-gnb__in{position:relative; height:100vh;}
.mobile-gnb__in>i{font-style:normal; color:#e5c7a9; font-size:12px; position:absolute; left:40px; top:175px; font-family: 'GY-Light';}
.mobile-gnb__in>b{font-weight:normal; color:#878787; font-size:11px; position:absolute; left:40px; bottom:130px; font-family:'Univers47-CondensedLight'; line-height:160%;}
.mbg-ul{position:absolute; left:40px; top:210px;}
.mbg-ul a{color:#fff;}
.mbg-ul>li>a{font-family:'Univers47-CondensedLight'; font-size:33px; transition:all 0.4s; position:relative; display:inline-block;}
.mbg-ul>li>a:before{position:absolute; content:""; left:0; bottom:-1px; background-color:#fff; height:2px; width:0%;  transition:all 0.4s cubic-bezier(0,.16,.05,.99);}
.mbg-ul>li>a.is-active:before{width:100%;}
.mbg-ul>li>ul{display:block; height:0; overflow:hidden; transition:all 0.4s cubic-bezier(0,.16,.05,.99);}
.mbg-ul>li>ul.mbul-1.is-active{height:137px;}
.mbg-ul>li>ul.mbul-2.is-active{height:223px;}
.mbg-ul>li>ul.mbul-3.is-active{height:100px;}
.mbg-ul>li>ul.mbul-4.is-active{height:65px;}
.mbg-ul>li>ul.mbul-5.is-active{height:60px;}
.mbg-ul>li>ul.mbul-6.is-active{height:152px;}
.mbg-ul>li>ul li{padding:20px 0 0;}
.mbg-ul>li>ul li:last-child{padding-bottom:25px;}
.mbg-ul>li>ul li a{font-family: Pretendard, -apple-system; font-size:16px; display:inline-block; opacity:0.8;}
.mbg-ul .mgnb-t-kor{font-family:Pretendard, -apple-system; font-size:15px; font-weight:300;}
.master-logo img{width:180px;}
.master-logo{top:8px; left:12px;}

.mDerUl{margin-left:20px; margin-top:2px;}
.derma_last_li{padding-bottom:10px !important;}

.login-status-pc{display:none;}
.login-status-mobile{position: absolute; left:40px; top:30px; z-index:50; overflow: hidden;}
.login-status-mobile li{float:left; position: relative;}
.login-status-mobile li+li{padding-left:22px;}
.login-status-mobile li+li:after{content:""; position: absolute; width:1px; height:13px; left:10px; top:2px; background-color:#fff;}
.login-status-mobile li a{color:#fff; font-family: 'GY-Regular'; font-size:15px; opacity:0.6;}












} /************************* 1024 - 아이패드 프로 세로(vertical) 끝 ****************************/

@media all and (max-width: 768px){  /************ 일반 아이패드 세로(vertical) 시작 ************/
.non768{display:none;}
.plpTxt-mobile{font-family: 'GY-Regular';}
.comparis-text-mobile{top:12%;}
.comparis-text-mobile h2{font-size:34px;}
.comparis-text-mobile span{font-size: 13px; padding-top:10px;}
.comparis-text2-mobile{top:14%;}
.comparis-text2-mobile h2{font-size:34px;}
.comparis-text2-mobile span{font-size: 15px; padding-top:10px;}
.comparis-text3-mobile{top:45%;}
.comparis-text3-mobile h2{font-size:22px; line-height:130%;}
.comparis-text3-mobile span{font-size: 12px; padding-top:10px;}
.arrow-plus-1-mobile div{top: -105px;}
.arrow-plus-1-mobile div:before{height:51px;}
.arrow-plus-3-mobile div{top:-165px;}
.arrow-plus-3-mobile div:before{height:94px;}
.arrow-plus-2-mobile div{top:-190px;}
.arrow-plus-2-mobile div:before{height:84px;}

.cms-floating{right:auto; left:20px;}
.goTop{width:32px; height:32px; opacity:1; bottom:112px;}

.mp-close{top:15px; right:15px; mix-blend-mode:screen;}
.mp-btn{position: absolute; bottom:100px; left:50%; transform:translateX(-50%);}
.main-pop-1__in{flex-direction:column;}
.main-pop-2__in{flex-direction:column;}
.main-pop-3__in{flex-direction:column;}
.mp1-left{width:100%; background:none; overflow:hidden; height:auto;}
.mp1-left i{position:static; width:100%;}
.mp1-left i img{filter: brightness(0.6);}
.mp2-left{width:100%; background:none; overflow:hidden; height:auto;}
.mp2-left i{position:static; width:100%;}
.mp2-left i img{filter: brightness(0.6);}
.mp1-right{width:100%; height:100%; padding-left:0; position: relative;}
.mp1-right h2{position: absolute; top:-140px; font-size:28px; color:#fff; box-sizing:border-box; padding-left:4vw;}
.mp1-right p{ position: absolute; top:20px;box-sizing:border-box; padding:0 10px 0 20px; font-size:14px;}
.mp2-right{width:100%; height:100%; padding-left:0; position: relative;}
.mp2-right h2{position: absolute; top:-140px; font-size:28px; color:#fff; box-sizing:border-box; padding-left:4vw;}
.mp2-right p{ position: absolute; top:20px;box-sizing:border-box; padding:0 10px 0 20px; font-size:14px;}
.mp3-right{width:100%; height:100%; padding-left:0; position: relative;}
.mp3-right h2{position: absolute; top:-140px; font-size:28px; color:#fff; box-sizing:border-box; padding-left:4vw;}
.mp3-right p{ position: absolute; top:20px;box-sizing:border-box; padding:0 10px 0 20px; font-size:14px;}

.mainText h2{font-size:30px;}
.mainText h3{font-size:15px;  top:calc(30% + 90px);}
.mainText span {top:calc(30% + 150px);}
.mainText h1 img{width:100px;}
.mainText h1{top:11px;}
.mouse-roll{display:none;}
.rg__text--mask p{font-size:14px; padding-top:20px; line-height:140%;}
.rg__text--heading span{display:none;}
.rg__column{border-top:1px solid rgba(135, 135, 135, 0.4);}
.rev_btn a{width:140px; padding-top:11px; font-size:15px; height:38px;}
.mainText span a{width:140px; padding-top:11px; font-size:15px; height:38px;}

.arrow-plus-3-mobile{top:55%;}
.arrow-plus-1-mobile{left:44%; top:56%;}

.constUl_btn{font-size:25px;top:12%;}
.arrow-btn img{width:47px;}
.arrow-btn .arr-m-left{left:-64px;}
.arrow-btn .arr-m-right{right:-64px;}
.constUl_content>a{width:50%;}

.request h3{font-size:40px;}
.footerUl{display:none;}
.footer-text-1{position:static;}
.footer{height:170px;}
.footer_in{padding-top:41px;}
.request{height:90vh;}
.request p{font-size:15px; padding-left:30px; padding-right:25px;}
.request h3{font-size:32px;}
.request a{width:190px; padding-top:11px;font-size:15px;height:38px;} 

.footer-text-1{font-size:10px;}
.goTop{width:32px; height:32px; opacity:1;}
.constUl_btn li a.is-active::before{height:4px; bottom:-4px;}
.rg__text--heading i{font-size:15px;}
.temp_popup{width:100%; top:100px !important;}
.temp_popup p iframe{width:100%;}
.temp_popup p iframe div{width:100% !important;}
.temp_popup p iframe div img{width:100% !important;}
.temp_popup span{width:100%;}
.temp_popup span a img{width:100%;}

} /************************** 768 - 일반 아이패드 세로(vertical) 끝  **************************/

@media all and (max-width: 480px){ /*************** 아이폰 세로(vertical) 시작 ***************/

.mainText h2{font-size:22px;}
.mainText h3{font-size:14px;}
} /***************************** 380 - 아이폰 세로(vertical) 끝 ******************************/


.temp_popup{position:absolute; left:-475px; top:135px; padding-bottom:20px; z-index:100; 
  display:flex; flex-direction:column; line-height:0; font-size:0; 
  animation: popTemp 1.25s cubic-bezier(.5,.2,0,1);
  animation-fill-mode: both;
  animation-delay: 1.7s;
}
.temp_popup p{font-size:0; line-height:0;}
@keyframes popTemp{
  from{left:-475px;}
  to{left:0px;}
}