:root {
    --color-white: #fff;
    --color-black: #000;
    --color-orange: #f37321;
    --color-typo1: #222;
    --color-typo2: #666;
    --color-typo3: #888;
    --color-disabled: rgba(0,0,0,.3);
}

.future-section video {
    width: 100%;
    height: 200vh;
    object-fit: cover;
}
.future-section-inner > .pin-spacer {
    position: relative;
    z-index: 10000;
}
/* main-headline-3 섹션 애니메이션 */
.future-section {
    background: #06111e;
    position: relative;
    z-index: 3;
    width: 100%;
    height: auto;
}
.future-section .main-headline-3 {
    position: relative;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    overflow: hidden;
    padding: 40px 20px;
    z-index: 1000;
    font-size: 40px;
    top: 0;
}
.__ani_fixed {
    position: fixed !important;
}
.future-section .__ani_fixed .__list {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 1000 !important;
}

.future-section .__ani_fixed .main-headline-3 .__sentence {
    overflow: unset;
}
.future-section .main-headline-3 .__txt {
}
.future-section .main-headline-3 .__txt.w100 {
    width: 100vw !important;
}

.future-section .main-headline-3 span,
.future-section .main-headline-3 strong {
    font-weight: 700;
    font-size: 70px;
    line-height: 1.5;
}
.future-section .main-headline-3 .__sentence {
    overflow: hidden;
    display: inline-flex;
}

/* __txt와 __list를 완벽하게 겹치게 배치 */
.future-section .main-headline-3 .__list,
.future-section .main-headline-3 .__txt {
    position: relative;
    text-align: center;
    width: 100%;
    padding: 0 20px;
    margin: 0;
}

.future-section .main-headline-3 span,
.future-section .main-headline-3 strong {
    font-size: 2.5vw;
}

.future-section .main-headline-3 .__txt {
    z-index: 2;
    opacity: 1;
    /* 초기 상태를 보이게 설정 */
    height: 22vw;
    width: 63vw;
    position: relative;
    transition: all 0.5s ease-in-out;
}

.future-section .main-headline-3 .__list {
    z-index: 1;
    opacity: 0;
    /* 초기에는 숨김 */
}
.future-section .main-headline-3 .__list.__active {
    opacity: 1;
}
/* fade-out 클래스의 opacity 제거 - 처음부터 보이게 */
.future-section .main-headline-3 .__sentence.fade-out {
    /* opacity: 0; 제거됨 - 이제 항상 보임 */
}

/* __txt 내부의 키워드 (data-dir="from") */
.future-section .main-headline-3 .__txt .__keyword {}
.future-section .__keywords {
    position: absolute;
    /*  width:100%;
    height:100vh;
    text-align:left;
    top:-50%;
    left:50%;
    transform: translate(-50%, -50%);
    display:flex;
    justify-content:center;
    align-items:center; */
}
.future-section .__keyword {
    position: relative;
    display: inline-flex;
}

.future-section .__keyword::after {
    transition: all 0.8s ease-out;
    content: '';
    width: 1px;
    height: 2px;
    position: absolute;
    bottom: 0;
    left: 0;
}
.future-section .__keyword.__addline::after {
    width: 100%;
    background: #fff;
}

.future-section .__keywords__inner {
    /* position:relative; */
}


.__visual__heightsafer{
    height:0;
    position:relative;
}
.__visual.__ani_fixed + .__visual__heightsafer{
    height:100vh;
}

.future-section .__keyword1,
.future-section .__keyword2,
.future-section .__keyword3 {
    display: block;
}
.future-section .__keyword1 {
    top: -11.25vw;
    left: 50.6vw;
}
.future-section .__keyword2 {
    top: -6.8vw;
    left: 42.6vw;
}
.future-section .__keyword3 {
    top: -6.75vw;
    left: 33.6vw;
}
.future-section .__visual {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.future-section .__visual-inner {
    position: relative;
}

.future-section .__desc {
    position: absolute;
    right: 0;
    bottom: 6.25vmax;
    color: #fff;
    z-index: 9;
    opacity: 1;
    transform: translate(-50%, -50%);
    left:50%;
    top:53%;
}
.future-section .desc__container.gutter-xl {
}
.future-section .desc__container {
    width: 100%;
    margin: 0 atuo;
    box-shadow: border-box;
}
.future-section .__desc p {
    line-height: 1.4615384615em;
    letter-spacing: -0.02em;
    width: 23.8461538462em;
    word-break: keep-all;
}
.future-section .__char {
    will-change: transform;
    font-size:1.0vw;
    position: relative;
    display: inline-block;
    translate: none;
    rotate: none;
    scale: none;
    transform: translate(0%, 105%);
    min-width: 0.5vw;
    font-weight:500;
	text-align:center; 
}
.future-section .__desc .__line {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.future-section .__desc .__line.title {
    position:relative;
	t
    top:-10px;
}
.future-section .__desc .__line.title .__char{
    font-size:3vw;
    font-weight:bold;
}

/* 선 그리기 애니메이션 */
.future-section .__keyword .__line::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #fff;
    transition: all 0.8s ease-out;
}

/* 애니메이션 트리거 클래스 */
.future-section .__keyword .__line.__draw-line::after {
    width: 100%;
}

.future-section .__motions {
    position: relative;
    padding-top:100vh;
   /* padding-bottom: 10vh; 20251125 수정*/
}
.future-section .__slogan-motion {
    padding: 0 40vh;
    position: relative;	
    margin:10% 0; 
	/*margin:20% 0; 20251125 수정*/
}
.future-section video {
    width: 100%;
    height: 100vh;
    border-radius: 10px;
	opacity:0.8;

}
.future-section .__motion-move-h {
    height: 10vh;
}

.future-section .__sentence {
    height: 3vw;
    position: relative;
    width: 100%;
}
.future-section .__keyword__basic {
    position: absolute;
    display: inline-block;
}
.future-section .__keyword__basic1-1 {
    width: 4.5vw;
    left: 1.5vw;
}
.future-section .__keyword__basic1-2 {
    width: 60vw;
    left: 15vw;
}
.future-section .__keyword__basic3-1 {
    width: 6vw;
    left: 7vw;
}
.future-section .__keyword__basic3-2 {
    width: 10vw;
    left: 40vw;
}
.future-section .__keyword__basic4-1 {
    width: 5vw;
    left: 0vw;
}
.future-section .__keyword__basic2 {
    width: 61.5vw;
    left: 0;
}
.future-section .__keyword__basic5 {
    width: 51vw;
    left: 0;
}

/*.future-section .__keyword01 {
    left: 0vw; 
}
.future-section .__keyword02 {
    left: 18vw;
}
.future-section .__keyword03 {
    left: 10vw;
}*/

.future-section .__ani_item01 {
    transform: translate(0%, 110%);
}

@media screen and (max-width: 768px) {
    body,
    html {
        overflow-x: hidden;
    }
    .future-section .__desc {
        bottom:auto;
        width:100%;
        top:calc(50% - 30px);
    }
    .future-section .main-headline-3 .__txt {
        height: auto;
        width: 100vw;
    }
    .future-section .__sentence {
        height: 6vw;
        letter-spacing: -0.2vw;
    }
    .future-section .main-headline-3 span,
    .future-section .main-headline-3 strong {
        font-size: 3.8vw;
        line-height: 9vw;
    }
    .future-section .main-headline-3 .__list,
    .future-section .main-headline-3 .__txt {
        padding: 0;
    }
    .future-section .__keyword__basic1-1 {
	  width: 4.5vw;
		 left: 4.0vw;
		}
		.future-section .__keyword__basic1-2 {
			width: 60vw;
			left: 35vw;
		}
		.future-section .__keyword__basic3-1 {
			width: 6vw;
			left: 8vw;
		}
		.future-section .__keyword__basic3-2 {
			width: 10vw;
			left: 40vw;
		}
		.future-section .__keyword__basic4-1 {
			width: 5vw;
			left: 5vw;
		}
		.future-section .__keyword__basic2 {
			width:90vw;
			left: 0;
		}
		.future-section .__keyword__basic5 {
			width: 51vw;
			left: 0;
}
    .future-section .__keyword03 {
        left: 20vw;
    }
    .future-section  .__line.title .__char{
        font-size: 5vw !important;
    }
    .future-section .__char {
        font-size: 3vw;
    }
    .future-section .desc__container.gutter-xl {
        padding-left: 0;
        padding-right: 0;
    }
}