@import url("common.css");

/* 서브→메인 해시 랜딩: 목표 섹션 안착 전 중간 영역 노출 방지 */
html.hash-landing:not(.is-hash-ready) body{opacity:0; pointer-events:none;}
html.hash-landing.is-hash-ready body{opacity:1;}

#contents{max-width:1920px; margin: 0 auto;}


/* visual */
#visual{position: relative; width: 100%; height: 100vh; min-height: var(--vh); overflow: hidden;}
#visual .v_video{position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; box-sizing: border-box; z-index: 2; overflow: hidden; background:var(--blackBg); }
#visual .v_video iframe{width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; z-index: 9;}
#visual .v_video video{width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; z-index: 9;}


#visual .v_video.mo{display: none;}
#vid-mo{display: none;}

#visual .scroll_down{display: block; width: 21px; height: 35px; border:1px solid rgba(255,255,255,.5); box-sizing:border-box; position:absolute; left:50%; bottom: 30px; transform:translateX(-50%); z-index: 99; font-size:0; transition:all .3s;}
#visual .scroll_down:hover{background:var(--white); border-color:var(--white);}
#visual .scroll_down::after{content:''; display: block; width:1px; height: 5px; background:var(--white); position: absolute; left:50%; top:8px; transition:all .3s;}
#visual .scroll_down:hover::after{background:var(--black);}



/* css 공통 */
#contents{overflow: hidden; padding: 100px 0 0; background:var(--black);}

.text_box{}
.text_box h2{overflow: hidden;}
.text_box h3{overflow: hidden;}
.text_box .txt_eff{overflow: hidden;}
.text_box .txt_eff p{padding: 20px 0 0; }
.text_box .txt_eff strong{display: block; font-weight: 600; color:var(--white); padding: 20px 0 0;}

.light_eff { position: absolute; top: 0; left: 50%; margin-left: -50px; width: 100px; height: 95%; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 100%); filter: blur(20px); mix-blend-mode: overlay; opacity: 0.7; transform: skewX(-20deg); pointer-events: none; z-index: 2; }

.mop-eff { position: absolute; top: 50%; left: 50%; width: 400px; height: 400px; margin-top: -200px; margin-left: -200px; border-radius: 50%; background: radial-gradient(150% 150% at 50% 50%, #ffffff 0%, #f1eef1 8%, #c5c3c5 10%, #9c9a9c 14%, #777577 17%, #565556 21%, #3b3a3b 25%, #252425 30%, #141414 35%, #080808 42%, #010101 52%, #000000 79%); filter: blur(20px); background-blend-mode: screen; mix-blend-mode: color-dodge; opacity: 0.5; pointer-events: none; z-index: 2; }




/*** G.O.U.R.I ***/

/* 전통과 과학, 아름다움을 엮다 */
#about{position: relative; background: var(--black); z-index: 3;}
#about svg {width: 100%; height: auto; overflow: visible;}
#about .about1{padding: 350px 0 135px; position: relative; background-color: var(--black); z-index: 5;}
#about .about1 .txt_area{display: flex; justify-content: flex-end; position: relative; z-index: 10;}
#about .about1 .txt_area .text_box{max-width:820px; width: 100%;}

#about .about1 .txt_area .text_box .logo_txt{overflow: hidden;}
#about .about1 .txt_area .text_box .logo_txt span{display: block; max-width:250px; position: relative;}
#about .about1 .txt_area .text_box .logo_txt img{width: 100%; height: auto; opacity: 0.3;}
#about .about1 .txt_area .text_box .logo_txt img.up{position: absolute; left: 0; top:0; opacity: 1; clip-path: inset(0 100% 0 0);}
#about .about1 .txt_area .text_box h2{overflow: hidden;}
#about .about1 .txt_area .text_box h2 span{-webkit-background-clip: text; background-image: -webkit-gradient(linear, left top, left bottom, from(var(--white)), to(var(--white))); background-image: -webkit-linear-gradient(var(--white), var(--white)); background-image: linear-gradient(var(--white), var(--white)); background-position: left bottom; background-repeat: no-repeat; background-size: 0% 100%; display: inline-block; -webkit-text-fill-color: rgba(255,255,255,.3);}
#about .about1 .txt_area .text_box h3{margin: 30px 0 0;}

#about .spray{position: absolute; top:0; right: 50%; margin-right: -795px; max-width: 552px; width: 100%;}
#about .spray p{position: absolute; left: 0; top:0; width: 100%; height: auto; margin: 0; overflow: hidden;}
#about .spray img, #about .spray svg {width: 100%; height: auto; display: block;}
#about .spray p.one{background:var(--black); z-index: 2;}
#about .spray p:not(.one) {z-index: 10; mix-blend-mode: screen;  pointer-events: none;}
#about .spray .mop-eff{width: 150px; height: 150px; margin-left: -75px;  margin-top: -75px;}

#about .binyeo_eff{position: absolute; left: 50%; margin-left: -960px; top:56px; display: block; max-width: 507px; width: 100%;}
#about .binyeo_eff img{width: 100%; height: auto;}
#about .binyeo{position: absolute; left: 50%; margin-left: -724px; top:440px; max-width: 427px; width: 100%; display: block; overflow: hidden; background:var(--black);}
#about .binyeo img{width: 100%; height: auto;}


.path-1, .path-2, .path-3,
.path2-1, .path2-2, .path3-2 { 
    visibility: hidden;
}


/* 본질을 완성하는 정교한 설계 */
#about .about2{padding: 400px 0 250px; position: relative; background-color: var(--black);}
#about .about2 .txt_area{max-width:1700px; width: 90%; margin: 0 auto; display: flex; justify-content: flex-end;}
#about .about2 .txt_area .text_box{text-align:left;}
#about .sun{position: absolute; left: 50%; margin-left: -736px; top:216px; max-width: 250px; width: 100%;}
#about .sun img{width: 100%; height: auto;}
#about .syringe_eff{position: absolute; left: 50%; margin-left: -234px; top:150px; max-width: 430px; width: 100%;}
#about .syringe_eff img{width: 100%; height: auto;}
#about .syringe{position: absolute; left: 50%; margin-left: -1020px; top:426px; max-width: 997px; width: 100%;}
#about .syringe img{width: 100%; height: auto;}







/* 처음 로드 시 노출 방지 */
.about1, .about2 {
    opacity: 0;
    visibility: hidden;
}

/* 텍스트 박스 내부 요소들도 초기 상태를 CSS로 미리 설정 */
.text_box h2 span, 
.text_box h3 span, 
.txt_eff p, 
.txt_eff strong {
    transform: translateY(100%);
    opacity: 0;
}

.syringe img {
    transform: translateY(50%);
    opacity: 0;
}








/* 차원이 다른 미학 액상형 PCL 과학 */
#tech{position: relative; z-index: 4;}
#tech .tech_wrap{position: relative; width: 100%; height: 100vh; display: flex; flex-direction: column; justify-content: center;}
#tech .tech_in{display: flex; position: relative; z-index: 5;}
#tech .tech_in .img_area{width: 915px;}
#tech .tech_in .img_area a{display:block; text-align:center; box-sizing:border-box; background:url('/img/technology_img.jpg') no-repeat center/cover; aspect-ratio: 915/597; border-radius:var(--borderR30); position: relative; overflow: hidden;}
#tech .tech_in .img_area a::after{content:''; display: block; width: 100%; height: 100%; box-sizing:border-box; border:4px solid rgba(255,255,255,.2); border-radius:var(--borderR30); position: absolute; left:0; top:0;}
#tech .tech_in .img_area a h3{line-height: 120%; position: relative; color: var(--white); text-shadow: 0 8px 20px rgba(0,0,0,0.5);}
#tech .tech_in .img_area a .more_btn{box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.50); margin: 40px auto 0;}
#tech .tech_in .img_area a:hover .more_btn{background: rgba(255, 255, 255, 0.3); box-shadow:0 0 30px rgba(255,255,255,.5); transition:all .3s linear;}

#tech .tech_in .txt_area{width: calc(100% - 915px); box-sizing:border-box; padding: 0 30px; text-align:left; display: flex; flex-direction: column; justify-content: center;}
#tech .tech_in .txt_area .text_box{ max-width: 340px; margin: 0 auto;}
#tech .tech_in .txt_area h3{overflow: hidden;}


#tech .tech_eff{position: absolute; left: -246px; top:151px; width: 100%; max-width:465px; transform-origin:left center;}
#tech .tech_eff p{position: absolute; left:0; top:0;}
#tech .tech_eff p.one{position: relative;}
#tech .tech_eff img{width: 100%; height: auto; mix-blend-mode: screen;}

#tech .pcl_eff{position: absolute; right: 0; bottom: -312px; width: 100%; max-width: 622px; transform-origin:right center;}
#tech .pcl_eff img{width: 100%; height: auto;}





/* 자연스러운 아름다움의 원천 */
#beauty{position: relative; width: 100%; z-index: 5;}
#beauty .beauty_wrap{position: relative; width: 100%;}

#beauty .beauty_eff{position: absolute; left:0; bottom: -80px; width: 100%; max-width:812px; transform-origin:left center; z-index: 2; mix-blend-mode: plus-lighter;}
#beauty .beauty_eff p{position: absolute; left:0; top:0;}
#beauty .beauty_eff p.one{position: relative;}
#beauty .beauty_eff img{width: 100%; height: auto;}


#beauty .txt_area{position: absolute; top:210px; left: 50%; transform:translateX(-50%); z-index: 5;}
#beauty .img_area{display: flex; justify-content: flex-end; padding: 0 40px 0 0; box-sizing:border-box;} 
#beauty .flower{max-width:866px; width: 100%; position: relative; overflow: hidden; top:-110px;} 
#beauty .flower p{position: absolute; left:0; top:0; width: 100%;}
#beauty .flower p img{width: 100%; height: auto;}
#beauty .flower p.one{z-index: 1;  position: relative; overflow: hidden; background:var(--black);}
#beauty .flower p.two{z-index: 3;} 
#beauty .flower p.three{z-index: 2; mix-blend-mode: plus-lighter;}
#beauty .flower p.four{z-index: 2; mix-blend-mode: plus-lighter;}
#beauty .flower p.five{z-index: 2; mix-blend-mode: plus-lighter;}


#beauty .text_box .txt_eff p{padding: 30px 0 0;}
#beauty .text_box .txt_eff p ~ p{padding: 20px 0 0;}

/* News Media */
#media{position: relative; z-index: 8; background-color:var(--black);}
#media .media_in{position: relative;}
#media .basic_in{position: relative;}
#media .media_eff{position: absolute; top:-175px; left: 253px; width: 100%; max-width:452px; transform-origin:center center;	background:var(--black);}
#media .media_eff p{position: absolute; left:0; top:0; width: 100%; height: auto;}
#media .media_eff p.one{position: relative; z-index: 1;	background:var(--black);}
#media .media_eff p.two{z-index: 2; mix-blend-mode: plus-lighter;}
#media .media_eff img{width: 100%; height: auto;}


#media .tit_area{padding: 0 0 60px; position: relative;}
#media .tit_area .gouri_logo{margin: 0 0 15px; overflow: hidden;}
#media .tit_area .gouri_logo svg{width: 100px; height: auto;}
#media .tit_area .gouri_logo path{fill:var(--white);}
#media .tit_area h3{overflow: hidden;}
#media .swiper-arrows{display: flex; gap:30px; align-items:center; position: absolute; right: 0; bottom: 70px;}
#media .swiper-arrows .swiper-arrow{width: 50px; height: 50px; cursor:pointer; padding: 0; border:0; background:none; font-size:0; position: relative; transition:all .3s; opacity: 0.5; transition:all .3s linear;}
#media .swiper-arrows .swiper-arrow:hover{opacity: 1; transition:all 1s linear;}
#media .swiper-arrows .swiper-arrow::after{display: block; width: 100%; height: 100%; line-height: 50px; font-size:50px; text-align:center; font-weight: 300; color:var(--white); position: absolute; left:0; top:0; font-family:var(--icon); transition:all .3s linear;}
#media .swiper-arrows .swiper-arrow:hover::after{text-shadow: 0 0 15px rgba(255,255,255, 0.9); transition:all .3s linear;}
#media .swiper-arrows .swiper-arrow.media-button-prev::after{content:'\e2ea';}
#media .swiper-arrows .swiper-arrow.media-button-next::after{content:'\e5e1';}
#media .media_swiper{overflow: hidden;}
#media .media_swiper .swiper-slide{width: auto; background:rgba(255,255,255,.1); border-radius:var(--borderR20); overflow: hidden;  transition:background .3s linear;}
#media .media_swiper .swiper-slide:hover{background:var(--white); transition:background .4s linear;}
#media .media_swiper .swiper-slide a{display: block;}
#media .media_swiper .swiper-slide a .thumb{aspect-ratio:3/2; overflow: hidden;}
#media .media_swiper .swiper-slide a .thumb img{display: block; width: 100%; height: 100%; object-fit:cover;  transition:all .3s linear;}
#media .media_swiper .swiper-slide a:hover .thumb img{transform:scale(1.1); transition:all .4s linear;}
#media .media_swiper .swiper-slide a .desc{padding: 30px 30px 40px; box-sizing:border-box;}
#media .media_swiper .swiper-slide a .desc h4{color:var(--white); font-weight: 400; line-height: 1.6em; height: 3.2em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  transition:all .3s linear; word-break:break-all;}
#media .media_swiper .swiper-slide a:hover .desc h4{color:var(--black); transition:all .6s linear;}
#media .media_swiper .swiper-slide a .desc .date{font-size:0.875rem; font-weight: 400; color:var(--white); font-family:var(--eng); letter-spacing: 0; line-height: 130%; display: block; margin: 10px 0 0; transition:all .3s linear;} 
#media .media_swiper .swiper-slide a:hover .desc .date{color:var(--basic); transition:all .6s linear;} 
#media .media_swiper .swiper-slide a .desc .date::before{content:'\ebcc'; display: inline-block; vertical-align: middle; font-size:18px; margin: -2px 5px 0 0; font-family:var(--icon); color:inherit;}





/*******************************************************************************
    @media 1740px
*******************************************************************************/
@media all and (max-width:1740px){

/* css 공통 */
#contents{padding: 10% 0 0;}


/* 전통과 과학, 아름다움을 엮다 */
#about{}
#about .about1{padding: 20vw 0 14vw;}
#about .about1 .txt_area .text_box{max-width:60%;}
#about .about1 .txt_area .text_box .logo_txt span{width: 14vw;}
#about .about1 .txt_area .text_box h3{margin: 20px 0 0;}

#about .spray{top:0; right: 5%; margin-right: 0; width: 34vw;}
#about .binyeo_eff{left: 0; margin-left: 0; top:10%; width: 32vw;}
#about .binyeo{left: 14%; margin-left: 0; top:55%; width: 27vw;}



/* 본질을 완성하는 정교한 설계 */
#about .about2{padding: 30vw 0 15vw;}
#about .sun{left: 15%; margin-left: 0; top:16%; width: 14vw;}
#about .syringe_eff{left: 42%; margin-left: 0; top:15%; width: 24vw;}
#about .syringe{left: -5%; margin-left: 0; top:37%; width: 57vw;}







/* 차원이 다른 미학 액상형 PCL 과학 */
#tech .tech_in{}
#tech .tech_in .img_area{width: 52%;}
#tech .tech_in .txt_area{width: 48%;}
#tech .tech_in .txt_area .fs80{font-size:4.375rem;}

#tech .tech_eff{left: -14vw; top:8vw; width: 26vw;}
#tech .pcl_eff{right: 0; bottom: -26vw; width: 35vw;}




/* 자연스러운 아름다움의 원천 */
#beauty{}
#beauty .img_area{padding:0;}
#beauty .flower{width: 49vw;} 
#beauty .beauty_eff{width: 46vw;}

/* News Media */
#media .media_eff{top:-10vw; left: 16vw; width: 25vw;}



}
/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){






/* 전통과 과학, 아름다움을 엮다 */
#about{}
#about .about1{padding: 26vw 0 23vw;}
#about .about1 .txt_area .text_box{max-width:55%;}
#about .about1 .txt_area .text_box .logo_txt span{width: 19vw;}
#about .about1 .txt_area .text_box h3{margin: 15px 0 0;}

#about .spray{top:0; right: 5%; width: 42vw;}
#about .binyeo_eff{left: -5%; top:0; width: 39vw;}
#about .binyeo{left: 12%; top:40%; width: 32vw;}



/* 본질을 완성하는 정교한 설계 */
#about .about2{padding: 36vw 0 0;}
#about .sun{left: 12%; top:10%; width: 19vw;}
#about .syringe_eff{left: 52%; top:6%; width: 33vw;}
#about .syringe{left: -7%; top:31%; width: 76vw;}





/* 차원이 다른 미학 액상형 PCL 과학 */
#tech .tech_in{}
#tech .tech_in .img_area a{padding: 100px 0;}
#tech .tech_in .img_area a .more_btn{margin: 30px auto 0;}
#tech .tech_in .img_area a h3{font-size:3.75rem;}
#tech .tech_in .txt_area{padding: 0 20px;}
#tech .tech_in .txt_area .fs80{font-size:3.75rem;}

#tech .tech_eff{left: -11vw; top:2vw; width: 35vw;}
#tech .pcl_eff{right: 0; bottom: -30vw; width: 47vw;}


/* 자연스러운 아름다움의 원천 */
#beauty{}
#beauty .txt_area{top:160px;}
#beauty .flower{width: 66vw;} 
#beauty .beauty_eff{width: 48vw; bottom: 30px;}





/* News Media */
#media .media_eff{width: 34vw;}


}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){


/* css 공통 */
.text_box{}
.text_box .txt_eff p{padding: 15px 0 0; }
.text_box .txt_eff strong{padding: 15px 0 0;}


/* visual */
#visual .v_video{}
#visual .v_video.pc{display: none;}
#visual #vid-pc{display: none;}
#visual .v_video.mo{display: block;}
#visual #vid-mo{display: block;}

#visual .v_video iframe{min-width:auto; min-height:auto; width: 130vw; height: 200vh;}
#visual .v_video video{min-width:auto; min-height:auto; width: 130vw; height: 200vh;}


/* 전통과 과학, 아름다움을 엮다 */
#about{}
#about .about1{padding: 0 0 25vw;}
#about .about1 .txt_area{padding: 20px 0 0;}
#about .about1 .txt_area .text_box{max-width:100%;}

#about .spray{position: relative; right: auto; top:auto; width: 50vw; margin-left: auto;}
#about .spray p.one{position: relative;}

#about .binyeo_eff{left: auto; right:0; top:30%; width: 35vw;}
#about .binyeo_eff svg{transform:scaleX(-1);}
#about .binyeo{left: auto; right: 15%; top:62%; width: 37vw;}
#about .binyeo svg{transform:scaleX(-1);}




/* 본질을 완성하는 정교한 설계 */
#about .about2{padding: 52vw 0 0;}
#about .syringe{top:28%;}




/* 차원이 다른 미학 액상형 PCL 과학 */
#tech .tech_wrap{height: auto; padding:160px 0;}
#tech .tech_in{flex-wrap:wrap; gap:80px;}
#tech .tech_in .img_area{width: 100%;}
#tech .tech_in .img_area a{padding: 80px 0;}
#tech .tech_in .img_area a .more_btn{margin: 20px auto 0;}
#tech .tech_in .img_area a h3{font-size:3.125rem;}
#tech .tech_in .txt_area{width: 100%; padding: 0;}
#tech .tech_in .txt_area .fs80{font-size:3.125rem;}


#tech .tech_eff{left: -32vw; top:22vw; width: 40vw;}
#tech .pcl_eff{right: 0; bottom: -23vw; width: 45vw;}


/* 자연스러운 아름다움의 원천 */
#beauty .txt_area{position: relative; top:auto; left: auto; transform:translateX(0);}
#beauty .img_area{padding:0 0 30vw; margin-top: -40vw;}
#beauty .flower{width: 70vw; top:0;} 
#beauty .beauty_eff{width: 50vw; bottom: 0;}

#beauty .text_box .txt_eff p{padding: 20px 0 0;}
#beauty .text_box .txt_eff p ~ p{padding: 15px 0 0;}

/* News Media */
#media .media_eff{top:-7vw; left: 35vw; width: 46vw;}

#media{}
#media .tit_area{padding: 0 0 40px;}
#media .tit_area .gouri_logo{margin: 0 0 10px;}
#media .tit_area .gouri_logo svg{width: 80px; height: auto;}
#media .tit_area h3{}
#media .swiper-arrows{gap:20px; bottom: 50px;}
#media .swiper-arrows .swiper-arrow{width: 40px; height: 40px;}
#media .swiper-arrows .swiper-arrow::after{line-height: 40px; font-size:40px;}
#media .media_swiper .swiper-slide a .desc{padding: 20px 20px 40px;}


}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/* css 공통 */
.text_box{}
.text_box h3 br{display: none;}
.text_box h3 span{display: block;}
.text_box .txt_eff p{padding: 10px 0 0; font-size:1rem;}
.text_box .txt_eff strong{padding: 10px 0 0; font-size:1rem;}

.mop-eff {width: 200px; height: 200px; margin-top: -100px; margin-left: -100px;}

/* visual */
#visual .v_video{}
#visual .v_video.pc{display: none;}
#visual .v_video.mo{display: block;}
#visual .scroll_down{bottom: 20px;}


@keyframes v_tit {
	from { opacity: 0; filter: blur(10px); }
	to { opacity: 1; filter: blur(0); }
}


/* 전통과 과학, 아름다움을 엮다 */
#about{}
#about .about1{padding: 0;}

#about .about1 .txt_area{padding: 0;}
#about .about1 .txt_area .text_box{}
#about .about1 .txt_area .text_box .logo_txt span{width: 100px;}
#about .about1 .txt_area .text_box h3{margin: 10px 0 0;}
#about .about1 .txt_area .text_box .fs60 span{}
#about .spray{width: 60vw; transform:translateX(10px);}
#about .spray .mop-eff{width: 100px; height: 100px; margin-left: -50px;  margin-top: -50px;}

#about .binyeo_eff{position: relative; right: auto; top:auto; margin-left: auto; margin-top: -7%; width: 40vw;}
#about .binyeo{position: relative; right: 17%; top:auto; margin-left: auto; margin-top: -5%; width: 45vw;}


/* 본질을 완성하는 정교한 설계 */
#about .syringe_eff{left: 58%; top:6%;}
#about .syringe{left: -4%; top:26%;}







/* 차원이 다른 미학 액상형 PCL 과학 */
#tech .tech_wrap{padding:100px 0;}
#tech .tech_in{gap:50px;}
#tech .tech_in .img_area a{padding: 50px 0;}
#tech .tech_in .img_area a .more_btn{margin: 15px auto 0;}
#tech .tech_in .img_area a h3{font-size:2.5rem;}
#tech .tech_in .txt_area .fs80{font-size:2.5rem;}

#tech .tech_eff{left: -16vw; top:24vw; width: 160px;}
#tech .pcl_eff{right: 0; bottom: -8vw; width: 200px;}


/* 자연스러운 아름다움의 원천 */
#beauty .img_area{padding:0 0 25vw;}
#beauty .text_box .txt_eff p{padding: 15px 0 0;}
#beauty .text_box .txt_eff p ~ p{padding: 10px 0 0;}

/* News Media */
#media .media_eff{top:-18vw; left: 30vw; width: 250px;}

#media .tit_area{padding: 0 0 30px;}
#media .tit_area .gouri_logo svg{width: 66px; height: auto;}
#media .tit_area h3{}
#media .swiper-arrows{gap:10px; bottom: 30px;}
#media .swiper-arrows .swiper-arrow{width: 35px; height: 35px;}
#media .swiper-arrows .swiper-arrow::after{line-height: 35px; font-size:35px;}
#media .media_swiper{overflow: visible;}
#media .media_swiper .swiper-slide{border-radius:var(--borderR15);}
#media .media_swiper .swiper-slide a .desc{padding: 20px 15px 30px;}
#media .media_swiper .swiper-slide a .desc .date::before{font-size:14px; margin: -2px 5px 0 0;}
#media .media_swiper .swiper-slide a .desc h4{font-size:1.143rem;}


}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:480px){

/* 차원이 다른 미학 액상형 PCL 과학 */
#tech .pcl_eff{bottom: -30vw; width: 200px;}


/* 자연스러운 아름다움의 원천 */
#beauty .img_area{margin-top: -25vw;}
}