@charset "utf-8";

/*
* File       : layout.css
* Author     : B-WORKER
* Dependency : css/reset.css
*      
 * SUMMARY:
 * 1) MAIN animation
 * 2) MAIN CONTENTS
*/

/* **************************************** *
 * Main animation set
 * **************************************** */
[data-txt-motion]{}
[data-txt-motion="hidden"]{overflow:hidden;}
[data-txt-motion="hidden"] > span{display:block; opacity:0;}

.swiper-slide-active [data-txt-motion="hidden"] > span{animation:text_hidden_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="left"]{animation:text_left_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="right"]{animation:text_right_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="up"]{animation:text_up_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="down"]{animation:text_down_motion 1.6s ease 0.1s forwards;}

.main-visual__text [data-txt-motion="hidden"]{opacity: 1;}
.main-visual__bg i{transform: scale(1.2); transition:transform 15s ease;}
.swiper-slide-active .main-visual__bg i{transform: scale(1);}

@keyframes text_hidden_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateY(0);}
}
@keyframes text_left_motion {
 from{opacity:0; transform:translateX(70rem);}
 to{opacity:1; transform:translateX(0);}
}
@keyframes text_right_motion {
 from{opacity:0; transform:translateX(-70rem);}
 to{opacity:1; transform:translateX(0);}
}
@keyframes text_up_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateX(0);}    
}
@keyframes text_down_motion {
 from{opacity:0; transform:translateY(-70rem);}
 to{opacity:1; transform:translateX(0);}
}

/* **************************************** *
 * Site custom
 * **************************************** */
 /* main nav */
 #fp-nav {transform: translateY(-50%);}
 #fp-nav.fp-left {left: 40rem;}
 #fp-nav ul li a span,
 #fp-nav ul li a.active span,
 #fp-nav ul li:hover a span {opacity: 1; width: 12rem !important; height: 12rem !important; margin-top: -1px; background: transparent;}
 #fp-nav ul li {margin: 20rem 0;}
 #fp-nav ul li a span::before {opacity: 0; position: absolute;left:0; top:0; content:''; width: 100%; height: 100%; background: url(../img/main/ic-nav.svg) no-repeat center / contain; transition: .3s;}
 #fp-nav ul li a span::after {position: absolute; left:50%; top: 50%; content:''; width: 6rem; height: 6rem; margin-top: 0; border-radius: 100%; background: var(--op-w20); transform: translate(-50%, -50%); transition: .3s;}
 #fp-nav .nav-name {opacity: 0; visibility: hidden; margin: 0 10rem; font-family: var(--lang-en); font-size: var(--en-xs) !important; color: var(--op-w30); transition: .3s;}

 #fp-nav ul li a.active span::before {opacity: 1;}
 #fp-nav ul li a.active span::after {opacity: 0;}
 #fp-nav ul li:hover a span::after {background: var(--c-01);}
 #fp-nav ul li a.active .nav-name {opacity: 1; visibility: visible; color: var(--w);}
 #fp-nav ul li:hover .nav-name {opacity: 1; visibility: visible;}

 body:is(.fp-viewing-About, .fp-viewing-News) #fp-nav ul li a span::after {background: var(--op-b20);}
 body:is(.fp-viewing-About, .fp-viewing-News) #fp-nav .nav-name {color: var(--op-b20);}
 body:is(.fp-viewing-About, .fp-viewing-News) #fp-nav ul li a.active .nav-name {color: var(--c-01);}

 body:is(.fp-viewing-About, .fp-viewing-News) #logo a {background-image: url(../img/layout/logo.svg);}
 body:is(.fp-viewing-About, .fp-viewing-News) #gnb .gnb-item > a {color: var(--b-01);}
 body:is(.fp-viewing-About, .fp-viewing-News) .lnag-menu__icon {background-image: url(../img/common/ic-lang.svg);}
 body:is(.fp-viewing-About, .fp-viewing-News) .gnb-full-icon > span {background: var(--b-01);}

 @media (min-width: 1024px){
	body:is(.fp-viewing-About, .fp-viewing-News) #gnb .gnb-item .sub-menu {background: var(--bg-02); border: 1px solid rgba(0, 0, 0, .03); box-shadow: 10rem 10rem 20rem 0 rgba(0, 0, 0, .05);}
	body:is(.fp-viewing-About, .fp-viewing-News) #gnb .gnb-item .sub-menu > li > a {color: var(--op-b30);}
	body:is(.fp-viewing-About, .fp-viewing-News) #gnb .gnb-item .sub-menu > li > a:hover {color: var(--c-02);}
 }

 @media (max-width:1280px){
	.section {justify-content: flex-start; min-height: auto !important;}
	.section:not(:has(.main-visual, #footer)) {padding: var(--space180) 0 var(--space200);}
 }

 @media all and (max-width:1023px){
	.section .fp-overflow {max-height: none !important;}
 }

 @media (max-width:860px){
	.section:not(:has(.main-visual, #footer)) {padding: var(--space180) 0;}
 }

 @media (max-width:540px){
	.section:not(:has(.main-visual, #footer)) {padding: var(--space180) 0;}

 	#header:is(.color-on, .on) #logo a {background-image: url(../img/layout/logo_w.svg) !important;}
	#header:is(.color-on, .on) #gnb .gnb-item > a {color: var(--w) !important;}
	#header:is(.color-on, .on) .lnag-menu__icon {background-image: url(../img/common/ic-lang_w.svg) !important;}
	#header:is(.color-on, .on) .gnb-full-icon > span {background: var(--w) !important;}
 }

 /* main 공통 */
 h3 {margin-bottom: var(--space50); color: var(--b-01);}
 .main-dec {display: block; margin-bottom: 20rem; font-size: var(--kr-m); font-weight: 700; color: var(--c-02);}

  @media (max-width:540px){
	.main-dec {margin-bottom: 12rem; font-size: var(--kr-sm);}
 }

/* main visual */
.main-visual{height:var(--height-full);}
.main-visual-container,
.main-visual-wrapper,
.main-visual .swiper-slide{height:100% !important;}
.main-visual .swiper-slide::before{content:'';position:absolute;background-position:50% 50%;transition:all 1s ease;transform:scale(1);inset:0;background-repeat:no-repeat;background-size: cover;}
.main-visual .swiper-slide .wrap{width:100%;}
.main-visual__bg{position:absolute; top:0; left:0; width:100%; height:100%;}
.main-visual__bg i{display:block; height:100%; background-position:50% 50%; background-size: cover;}
.main-visual__btn{position:relative;width:30rem;height:30rem;cursor:pointer;display: flex;align-items: center;margin: 0 20rem;color: #fff;font-weight: 600; font-size: 0;}
.main-visual__btn::after{content:"";display:block;min-width: 100%;height: 100%;background:url(../img/main/slider-arrow_w.svg) no-repeat 50% 50%;background-size: contain;}
.main-visual__btn.button-prev{flex-direction: row-reverse;}
.main-visual__controls{position:absolute;bottom: 60rem;left:0;z-index:999;width:100%;}
.main-visual__controls > div{display:flex;align-items:center;justify-content: center;}
.main-visual__count{display:flex; align-items:center; gap:64rem;}
.main-visual__count *{display:flex; align-items:center; justify-self: center; position:relative; min-width: 12rem; font-family: var(--lang-en); font-size: var(--en-xs);}
.main-visual__count em {opacity: .3;}
.main-visual__btn.button-next::after{/* transform:rotate(-90deg); */}
.main-visual__btn.button-prev::after{transform: rotate(180deg);}

.main-visual .swiper-pagination{display:flex; gap:18rem;}
.main-visual .swiper-pagination-bullet{background: var(--w);}
.main-visual .swiper-pagination-bullet{opacity:0.4; width:14rem; height:14rem; background:#fff;}
.main-visual .swiper-pagination-bullet-active{opacity:1;}

.main-visual__text {position:absolute; bottom:154rem; width:100%; padding: 0 50rem; text-align:center; color:var(--w);}
.main-visual__text h2 span {font-size: var(--kr-5xl); font-weight: 700;}

.main-visual__bar{position:absolute; left: 50%; bottom:75rem; z-index:50; width:40rem; height:1px; background:var(--op-w20); transform:translateX(-50%);}
.main-visual__bar > i{position:absolute; left:0; width:0%; height:100%; background:var(--w);}
.main-visual .swiper-slide-active .main-visual__bar > i{ width: 100%; transition: var(--progress-duration) linear; }

/* 글자 나타나는 요소 */
.split-char {display: inline-block; opacity: 0; transition: opacity 0.8s ease-in-out; transition-delay: calc(var(--char-index) * 0.03s);}
.split-char.animate {opacity: 1;}

@media (max-width:1480px){
	.main-visual__text {padding: 0 20rem;}
}

@media (max-width:860px){
	.main-visual__text {padding: 0 40rem;}
	.main-visual__controls {bottom: 80rem;}
	.main-visual__bar {bottom: 94rem;}
	.split-break {display: none;}
	.line-2 .split-char {animation-delay: calc(0.6s + var(--char-index) * 0.03s);}

	.main-visual__text h2 {opacity: 0;}
	.swiper-slide-active h2 {overflow: hidden; animation:text_up_motion 1.6s ease 0.1s forwards;}
	.swiper-slide-active h2 br {display: none;}

	@keyframes text_up_motion {
		from{opacity:0; transform:translateY(50rem);}
		to{opacity:1; transform:translateX(0);}    
	}
}

@media (max-width:540px){
	.main-visual {height: 760rem;}
	.main-visual__bg::after {position: absolute; left:0; top:0; content:''; width: 100%; height: 100%; background: var(--op-b30);}
	.main-visual__text {bottom: 110rem; padding: 0 20rem;}
	.main-visual__text h2 p {line-height: 1.35;}
	.main-visual__text h2 span {font-weight: 700;}

	.main-visual__controls {bottom: 50rem;}
	.main-visual__count {gap: 70rem;}
	.main-visual__bar{bottom:65rem;}
	.main-visual__btn::after {background-size: 25rem;}
}

/* 제품소개 */
.main-product {display: flex; flex-direction: column; justify-content: flex-end; height: 100vh;}
.main-product__list {gap: 0; border-top: 1px solid var(--op-w10);}
.main-product__item a {overflow: hidden; position: relative; justify-content: flex-end; height: 600rem; padding: 80rem 40rem;}
.main-product__item a::before {opacity: 0; visibility: hidden; position: absolute; left:0; top:0; content:''; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; transition: var(--trans-01);}
.main-product__item + .main-product__item {border-left: 1px solid var(--op-w10);}
.main-product__item.main-product__item:nth-child(1) a::before {background-image: url(../img/main/product-item01.jpg);}
.main-product__item.main-product__item:nth-child(2) a::before {background-image: url(../img/main/product-item03.jpg);}
.main-product__item.main-product__item:nth-child(3) a::before {background-image: url(../img/main/product-item02.jpg);}

.main-product__num {position: absolute; left:-41rem; bottom:26rem; font-family: var(--caption); font-size: 200rem; color: var(--op-w03) !important;}
.main-product__item figure {opacity: 1; visibility: visible; position: relative; transition: var(--trans-01);}
.main-product__txt {position: relative; margin-top: 30rem;}
.main-product__txt em {display: block; margin-bottom: 13rem; color: var(--c-02) !important;}
.main-product__txt p {overflow: hidden; max-height: 0; margin-top: 0; line-height: 1.4; font-weight: 300; transition: var(--trans-01);}

 @media (min-width:1921px){
	.main-product__item a {height: 70vh;}
	.main-product__item figure {margin-bottom: 100rem;}
}
@media (hover: hover) and (pointer: fine){
	.main-product__item a:hover::before {opacity: 1; visibility: visible;}
	.main-product__item a:hover figure {opacity: 0; visibility: hidden;}
	.main-product__item a:hover .main-product__txt p {max-height: 85rem; margin-top: 20rem;}
}

 @media (max-width:1280px){
	#section02 {padding-bottom: 0 !important;}
	.main-product {height: auto;}
	.main-product__item figure {height: 100%;}
	.main-product__txt {margin-top: 0;}
	.main-product__txt p br {display: none;}
	.main-product__item a {padding-bottom: 100rem;}

	@media (hover: hover) and (pointer: fine){
		.main-product__item a:hover .main-product__txt p {max-height: 90rem;}
	}
 }

 @media all and (max-width:1023px){
	.main-product__item figure {height: 65%;}
	.main-product__item figure img {height: 100%; object-fit: contain;}
	.main-product__item a {justify-content: flex-start; padding: 80rem 20rem; padding-bottom: var(--space120);}
	.main-product__txt {margin-top: auto;}
	.main-product__txt h6 {font-size: var(--kr-2xl);}
	.main-product__num {left: -32rem; bottom: 68rem; font-size: 150rem;}
}

@media (max-width:860px){
	@media (hover: hover) and (pointer: fine){
		.main-product__item a:hover .main-product__txt p {max-height: 120rem;}
	}
}

@media (max-width:540px){
	.main-product__item + .main-product__item {border-left: 0; border-top: 1px solid var(--op-w10);}
	.main-product__item a {height: 460rem; padding: 0;}
	.main-product__item figure {height: 100%;}
	.main-product__txt h6 {font-size: var(--kr-4xl);}
	.main-product__txt {margin-top: 0; margin-bottom: 50rem; padding: 0 20rem;}
	.main-product__num {left: -25rem; bottom: -25rem; font-size: 120rem;}
}

/* 회사소개 */
.main-about__list {overflow: hidden; gap: 20rem;}
.main-about__item {position: relative; justify-content: space-between; height: 400rem; padding: 40rem; background: var(--bg-01); transition: var(--trans-01);}
.main-about__bg {opacity: 0; visibility: hidden; position: absolute; left:0; top:0; width: 100%; height: 100%;}
.main-about__bg img {height: 100%; object-position: 74% center;}
.main-about__item * {transition: var(--trans-01);}
.main-about__num {position: relative;}
.main-about__num strong {margin-bottom: 4rem; font-size: 46rem; font-weight: 700; color: var(--b-01);}
.main-about__num strong span {margin-top: 7rem; margin-right: 5rem; font-family: var(--caption); letter-spacing: -1px; font-size: 55rem;}
.main-about__num p {color: var(--b-02);}
.main-about__item > span {position: relative; line-height: 1.6; color: var(--b-03);}

@media (hover: hover) and (pointer: fine){
	.main-about__item:hover .main-about__bg {opacity: 1; visibility: visible;}
	.main-about__item:hover .main-about__num * {color: var(--w);}
	.main-about__item:hover > span {color: var(--op-w70);}
}

 @media all and (max-width:1023px){
	.main-about__item {height: 370rem; padding: 30rem;}
	.main-about__num strong {font-size: 43rem;}
	.main-about__num strong span {font-size: 50rem;}
}

@media (max-width:540px){
	.main-about__num * {color: var(--w) !important;}
	.main-about__num strong span {margin-top: 4rem; font-size: 36rem;}
	.main-about__num strong {font-size: 30rem;}
	.main-about__bg {opacity: 1; visibility: visible;}
	.main-about__item {height: 270rem; padding: 25rem;}
	.main-about__item > span {color: var(--op-w70);}
}

/* 글로벌 */
#section04 {background: url(../img/main/grobal-bg.jpg) no-repeat center / cover;}
.main-global__map {position: absolute; left: 50%; top: 50%; width: 34%; margin-top: -27rem; transform: translateX(-50%) translateY(-50%); transition: .8s ease-in-out; transition-delay: .1s;}
.main-global__map i {opacity: 0; visibility: hidden; position: absolute; width: 50rem; height: 50rem; background: url(../img/main/ic-global.svg) no-repeat center / contain; transition: .5s ease; transition-delay: .1s;}
.main-global__inr .wrap > h3 {position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); text-shadow: 0 0 50rem #000; transition: .5s ease-in-out; transition-delay: .15s;}
[data-global="korea"] {top: 37.5%; left: 55.5%;}
[data-global="vetnam"] {top: 55.5%; left: 44.5%;}
[data-global="china"] {top: 38%; left: 50.5%;}

.main-global__con {opacity: 0; visibility: hidden; width: 42%; margin-left: auto; margin-top: 45rem; transform: translateX(-50rem); transition-duration: .3s; transition: ease-in; transition-delay: .1s;}
.main-global__list li a {padding: 20rem; padding-left: 30rem; gap: 16rem; border-radius:max(1.0417vw, 10rem); border: 1px solid var(--op-w10); background: var(--op-w10); transition: var(--trans-01);}
.main-global__list li i {width: 30rem; height: 30rem; border-radius: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; background-image: url(../img/main/ic-korea.svg); background-color: #fff;}
.main-global__list li em {position: relative; padding-right: 16rem;}
.main-global__list li em::after {position: absolute; right: 0; top: 50%; content:''; width: 1px; height: 16rem; background: var(--op-w20); transform: translateY(-50%);}
.main-global__list li + li {margin-top: 10rem;}
/* .main-global__list li a {display: block; width: 43rem; height: 43rem; margin-left: auto; border-radius: 5rem; background: var(--bg-dark) url(../img/main/ic-gallery.svg) no-repeat center / 14rem; transition: var(--trans-01);} */
/* .main-global__list li a:hover {background-color: var(--c-01);} */
.main-global__list li:nth-child(3) i {background-image: url(../img/main/ic-vetnam.svg);}
.main-global__list li:nth-child(4) i {background-image: url(../img/main/ic-china.svg);}

#section04.active .main-global__inr .wrap > h3 {opacity: 0; visibility: hidden; width: 100%; margin-top: -30rem; transition-delay: .8s;}
#section04.active .main-global__map {width:50%; transform: translateX(-89%) translateY(-50%); transition-delay: 1.3s;}
#section04.active .main-global__map i {opacity: 1; visibility: visible; transition-delay: 1.8s;}
#section04.active .main-global__con {opacity: 1; visibility: visible; transform: translateX(0); transition-duration: .7s; transition-delay: 1.7s;}

@media (hover: hover) and (pointer: fine){
	.main-global__list li a:hover {background: var(--op-w30);}
}

@media (max-width:1280px){
	#section04 .fp-overflow {overflow: initial !important;}
	#section04.active .main-global__map {width: 75%;}
	#section04.active .main-global__inr .wrap > h3 {transition-delay: .5s;}
	#section04.active .main-global__map { margin-top: -50rem; transition-delay: 1s;}
	#section04.active .main-global__map i {transition-delay: 1.3s;}
	#section04.active .main-global__con {transition-delay: 1.5s;}
}

 @media all and (max-width:1023px){
	.main-global__inr .wrap > h3 {display: none;}
	.main-global__map {left: 50%; top: 15%; margin-top: -20rem; transform: translateX(-50%);}
	.main-global__con {width: 100%; padding-top: 62%; transform: translateY(50rem);}
	.main-global__con .main-dec,
	.main-global__con h3 {text-align: center;}

	#section04.active .main-global__map {width: 75%; top: 0; margin-top: -20rem; transform: translateX(-50%) translateY(0%); transition-delay: .1s;}
	#section04.active .main-global__map i {transition-delay: 0.3s;}
	#section04.active .main-global__con {transform: translateY(0); transition-delay: 0.1s;}

	[data-global="korea"] {top: 36.5%; left: 54.7%;}
	[data-global="vetnam"] {top: 54.5%; left: 44%;}
	[data-global="china"] {top: 36.5%; left: 50.5%;}

}

@media (max-width:540px){
	#section04 {padding-top: 0 !important;}
	.main-global__con {margin-top: 10rem; padding-top: 0;}
	.main-global__list li a {padding: 12rem; padding-left: 15rem; gap: 10rem;}
	.main-global__list li + li {margin-top: 5rem;}
	.main-global__list li i {width: 27rem; height: 27rem; margin-right: 0rem;}
	/* .main-global__list li a {width: 35rem; height: 35rem;} */

	.main-global__map i {width: 32rem; height: 32rem;}

	#section04 .fp-overflow {overflow: hidden;}
	#section04 .main-global__map {position: relative; left: 0 !important; top: 0 !important; width: 100% !important; transform: none !important; transition: none;}

	[data-global="korea"] {top: 34.5%; left: 53.9%;}
	[data-global="vetnam"] {top: 52.5%; left: 43%;}
	[data-global="china"] {top: 35.5%; left: 48.5%;}
}

/* 팝업 */
.popup-layer-inner {min-width: 520rem; padding: 20rem;}
.popup-business__txt {margin-bottom: 10rem; padding: 20rem;}
.popup-business__txt h6 {margin-bottom: 4rem;}
.popup-business__txt h6,
.popup-business__txt > p {color: var(--b-01);}
.popup-business__list {margin-top: 20rem; padding-top: 20rem; border-top: 1px solid var(--op-b10);}
.popup-business__list strong {display: block; margin-bottom: 10rem; color: var(--c-01);}
.popup-business__list [data-list] * {font-weight: 300; color: var(--b-02); margin-bottom: 8rem;}

.popup-layer-close {top: 20rem; right: 20rem;}
.popup-layer-close::after, .popup-layer-close::before {background: var(--b-01);}

@media (max-width:540px){
	.popup-business__txt {padding: 0;}
	.popup-layer-inner {min-width: auto; border-radius: 0;}
	.popup-layer-close {top: auto; right: 0;}
}

/* 뉴스룸 */
.main-news [data-grid="4"] {gap: 20rem;}
.gallery-list li {transition-delay: .1s;}

@media all and (max-width:1280px){

}


 @media all and (max-width:1023px){
	.main-news [data-grid="4"] {grid-template-columns: 1fr 1fr;}
}

@media (max-width:540px){
	#section05 {padding: var(--space150) 0;}
	.main-news [data-grid="4"] {grid-template-columns: 1fr;}
}


/* 온라인문의 */
#section06 {background: var(--bg-dark); transition: background 1s .1s;}
.main-bottom [data-font-en="4xl"] {font-weight: 400; gap: 10rem;}
.main-bottom h3 img {height: 39rem;}
.main-bottom a {opacity: 0; visibility: hidden; overflow: hidden; position: relative; display: flex; justify-content: center; align-items: center; width: 0; height: 0; transform: scale(0);}
.main-bottom a::before {position: absolute; left:0; top: 0; content:''; width: 100%; height: 100%; background: url(../img/main/bottom-txt.svg) no-repeat center / cover; transform-origin: 50% 50%; animation: rotate360 10s linear infinite;}
.main-bottom a div {position: absolute; left: 50%; top: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 200rem; height: 200rem; border-radius: 100%; border: 1px solid var(--op-w10); background:var(--op-w10);transform:translate(-50%, -50%) scale(0); transition: background .3s;}
.main-bottom a div span {font-weight: 700; transition: color 1s;}
.main-bottom a div i {display: block; width: 20rem; height: 20rem; margin-bottom: 17rem; background-repeat: no-repeat; background-size: contain; background-position: center center; background-image: url(../img/main/ic-contact.svg); transition: all 1s;}
.main-bottom [data-font-en="4xl"] > * {transition: all 1s 0.1s;}
.main-bottom a:hover div {background: var(--w); color: var(--c-01);}
.main-bottom a:hover div span {color:var(--c-01)}
.main-bottom a:hover div i {background-image: url(../img/main/ic-contact_c.svg);}

#section06.active {background: var(--c-01); transition-delay: .5s;}
#section06.active .main-bottom [data-font-en="4xl"] > * {transition: all 1s 0.8s;}
#section06.active .main-bottom [data-font-en="4xl"] > p {font-size: 72rem;}
#section06.active .main-bottom h3 img {height: 60rem;}
#section06.active a {opacity: 1; visibility: visible; width: 270rem; height: 270rem; margin: 0 30rem; transform: scale(1);}
#section06.active a div {transform: translate(-50%, -50%) scale(1); transition:transform 1s 1s;}

@keyframes rotate360 {
	0% {transform: rotate(0);}
	100% {transform: rotate(360deg);}
}

@media (max-width:1280px){
	#section06 {height: 100vh !important; justify-content: center;}
	.main-bottom a div {width: 160rem; height: 160rem;}
	#section06.active a {width: 210rem; height: 210rem;}
	#section06.active .main-bottom [data-font-en="4xl"] > p {font-size: 62rem;}

	#section06.active {transition-delay: .3s;}
	#section06.active .main-bottom [data-font-en="4xl"] > * {transition-delay: .6s;}
	#section06.active a div {transition-delay: 0.8s;}
}

@media all and (max-width:1200px){
	.main-bottom a div {width: 140rem; height: 140rem;}
	.main-bottom a div i {width: 17rem; height: 17rem; margin-bottom: 15rem;}
	.main-bottom a div span {font-size: var(--default);}
	#section06.active a {width: 190rem; height: 190rem;}
	#section06.active .main-bottom [data-font-en="4xl"] > p {font-size: 55rem;}
	#section06.active .main-bottom h3 img {height: 45rem;}
}

 @media all and (max-width:1023px){
	#section06 .main-bottom [data-font-en="4xl"] > p {font-size: var(--kr-2xl);}
	.main-bottom h3 img {height: 27rem;}
	#section06.active a {margin: 0 20rem;}
	#section06.active .main-bottom [data-font-en="4xl"] > p {font-size: var(--kr-4xl);}
	#section06.active .main-bottom h3 img {height: 35rem;}
}

@media (max-width:860px){
	#section06 .main-bottom [data-font-en="4xl"] > p {font-family: var(--lang-en); white-space: nowrap;}
	.main-bottom a div {width: 120rem; height: 120rem;}
	.main-bottom a div i {width: 15rem; height: 15rem; margin-bottom: 10rem;}
	#section06.active a {flex-shrink: 0; width: 160rem; height: 160rem;}
	#section06.active .main-bottom h3 img {height: 32rem;}
}

@media (max-width:540px){
	.main-bottom [data-font-en="4xl"] {flex-direction: column;}
	#section06.active .main-bottom [data-font-en="4xl"] > p {font-size: 28rem;}
	#section06.active a {margin: 25rem 0 35rem;}
	.main-bottom a div i {width: 12rem; height: 12rem; margin-bottom: 8rem;}
	.main-bottom a div span {font-size: var(--kr-xs);}
	#section06.active .main-bottom h3 img {height: 26rem;}
}

/* 낮은 노트북 대응 */
@media all and (min-width:1440px) and (max-width:1600px) and (max-height:700px) {
	.main-visual__bar{bottom:55rem;}
	.main-visual__controls{bottom:40rem;}
	.main-visual__bargauge{bottom:45rem;}
	.main-visual__text{bottom:124rem;}
	.main-product__item a{height:380rem;}
	.main-product__item a{padding:40rem 40rem;}
	.main-product__item figure{width:350rem; margin:0 auto;}
	.main-about__item{height:280rem; padding:40rem;}
	.main-dec{margin-bottom:8rem;}
	.main-about__num strong span{font-size:45rem;}
	.main-about__num strong{font-size:38rem;}
	.main-about{padding-top:7vh;}
	.popup-layer-inner figure{width:30vw;}
	.popup-layer-inner{min-width:auto;}
	.gallery-list li a{height:310rem; padding:25rem;}
	#section06.active .main-bottom [data-font-en="4xl"] > p{font-size:42rem;}
	#section06.active .main-bottom h3 img{height:40rem;}
	#section06.active a{width:230rem; height:230rem;}
}