@charset "UTF-8";

.curtain {
    background-color: #000;
    transition-property: top;
    transition-duration: .75s;
    transition-timing-function: cubic-bezier(0.5, 0.4, 0.2, 1);
}

.curtain.complete .icon {transition: all .75s .25s;}

.mainBody .curtain.complete .icon {transition: all 1s .25s;}
.mainBody .curtain {transition-duration: .75s;}

.load .curtain {top: 100vh;transition-delay: 1.5s;}
.load .mainBody .curtain {top: 100vh;transition-delay: 2.25s;}
.load .curtain.complete .icon {opacity:1;} 

.curtain.complete .icon {opacity:0;} 
.curtain .curtain-text {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100%;
	height: 5rem;
	display: block;
	font-size: 2rem;
	color:#fff;
	transform: translate(-50%,-50%);
	font-size: 0;
	overflow: hidden;
}

.curtain .curtain-text span {position:relative;top: 0;display: inline-block;transition: top .1s;line-height: 5rem;letter-spacing: -1px;}
.curtain .curtain-text span.by {font-size:2rem;margin-right:1rem;}
.curtain .curtain-text span.by ~ span {font-size: 3rem;font-weight: 600;}

.load .curtain .curtain-text span {top: -5rem;}
.curtain .curtain-text span.by {transition-delay: .3s;}
.curtain .curtain-text span.b {transition-delay: .35s;}
.curtain .curtain-text span.l {transition-delay: .40s;}
.curtain .curtain-text span.a {transition-delay: .45s;}
.curtain .curtain-text span.c {transition-delay: .50s;}
.curtain .curtain-text span.k {transition-delay: .55s;}

/* 헤더 */
.c-logo {font-size: 1rem;}

.c-gnb_item > a:before {background-color:#000;}
.dark .c-gnb_item > a:before {background-color:#fff;}

.color-tone .c-header .c-aligner .c-logo {color: inherit;}
.c-header .c-aligner .c-logo span {transition: font-size .5s;}

.c-time > span {vertical-align:middle;}
.c-time .time > span {display:inline-block;width:17px;text-align:center;font-weight:500;}
.c-time .time > span.h, .c-time .time > span.a{width:auto;}
.c-footer-address .address--eng > p {font-weight:500;}

.color-tone .c-time > span {color: inherit;} 
.color-tone .c-gnb_item > a {color: inherit;}

.dark .color-tone .c-time > span {color: #fff;}
.dark .color-tone .c-gnb_item > a {color: #fff;}

/* 메인 */
.m-ideas_kv {padding-bottom:1px;}
.m-visual_banner:has(.video) a,
.m-visual_banner > a + .video {
	transition: opacity .5s;
}

.m-visual_banner:has(.video) a {position:relative;opacity: 0;z-index: 0;}
.m-visual_banner > a + .video {position:absolute;opacity: 1;z-index:1;}

.m-visual_banner:has(.video.stop) a {position:relative;opacity: 1;z-index:1;}
.m-visual_banner > a + .video.stop {position:absolute;opacity: 0;z-index:0;}

/* Experience List */
.v-titles .link:after {
	content: "→";
	background-image:none;
	font-size: 22px;
	text-align: center;
}


.list .l-listbox .l-list .l-item.aos-animate.added.complete {opacity:1 !important;}
.list .l-listbox .l-list .l-item.added {
	transition: all .7s;
	opacity:0 !important;
}

.list .l-listbox .l-list .l-item:nth-child(odd) {background-color:#bbb;}
.list .l-listbox .l-list .l-item:nth-child(even) {background-color:#ccc;}

.color-tone .v-title, .v-title span {color:inherit;}
.color-tone .v-titles .link {color:inherit;}
.color-tone .v-info_item .key,.v-info_item .value {color:inherit;}
.color-tone .v-info_item .value > a {color:inherit;}
.color-tone .v-info_txt {color:inherit;}
.color-tone .v-info_item .value .num {color:inherit;}
.color-tone .v-heading {color:inherit;}
.color-tone .v-heading + .v-txt {color:inherit;}

/* Experience View */
.v-font {flex-wrap: wrap;}
.v-site-bar_image img {width:100%;}
.color-tone .c-content {/* padding-bottom:0; */}
.monitor {height: 44.5%;}

@media (max-width: 1600px) {
	.v-font_box {width:50%;}
	.v-font_box img.mobile {width:50%;}
}

@media (max-width: 1279px) {
	.v-font_box {width:100%;}
	.v-font_box img.mobile {width:100%;}
}

@media (max-width: 768px) {
	.v-titles .link:after {position: absolute;top: -3px;}
}

/* 에러 */
.c-error {
	opacity: 1 !important;
	visibility: visible;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
	position: relative;
	padding: 200px;
}
.c-error:before {
	opacity: 0;
	visibility: hidden;
	content: "";
	display: block;
	position: absolute;
	top: 200px;
	left: 0;
	width: 0;
	height: 132px;
	background: url('../images/pages/c-error.png') no-repeat;
    -webkit-transition: all .6s;
    -ms-transition: all .6s;
    transition: all .6s;
}
.c-error.aos-animate:before {
	opacity: 1;
	visibility: visible;
	width: 160px;
}
.c-error_heading {
	margin-bottom: 40px;
	color: #fff;
	font-size: 44px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: -1.76px;
	word-break: keep-all;
}
.c-error_txt {
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: -0.64px;
	word-break: keep-all;
}
.c-error_txt + .c-error_txt {
	margin-top: 16px;
}
.c-error_links {
	margin-top: 40px;
	font-size: 0;
	text-align: left;
}
.c-error_link {
	display: inline-block;
	position: relative;
	padding: 15px 30px;
	border-radius: 30px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.75;
	letter-spacing: -0.64px;
	vertical-align: top;
	transition: all .3s;
}

.dark .c-error_link  {
	color: #000;
	background-color: #fff;
} 
.dark .c-error_link:hover {
	background-color: #333;
	color:#fff;
}

.c-popup_box {opacity:1;transition:opacity .3s, z-index .3s .3s;}
.c-popup_box.hide {opacity:0;z-index:0 !important;}

.c-popup_box .c-popup_txt .img {position:relative;display: inline-block;}
.c-popup_box .c-popup_txt .img a {position:absolute;top: 0;left: 0;width: 100%;height: 100%;}
.c-popup_box .c-popup_txt .txt {margin-top:15px;}

.hscroll {position:fixed;left: 0;top: 0;width:100%;height:5px;background-color: transparent;/* display: none; */z-index: 999;}
.hscroll .bar {
	display: block;
	height:100%;
	width:0;
	background-color: #252525;
	transition: all .25s;
}

.dark .c-wrap.color-tone + .hscroll .bar {background-color:#fff;filter: unset;}
.dark .hscroll .bar {
	background-color: #ffffff;
}

/* Hero 인트로 stagger: 헤드라인 컨테이너 fade-up (0ms 단계, 커튼 종료 시점 2.25s 기준) */
@keyframes heroFadeUp {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: translateY(0); }
}
.m-visual_txtbox {
	opacity: 0;
	transform: translateY(12px);
	animation: heroFadeUp .6s 2.25s ease-out forwards;
}