@charset "UTF-8";
/*-------------------------------------------------
title       : BANDI 콘텐츠
Author      : YEONA CHOI
Create date : 2024-03
-------------------------------------------------*/
body{overscroll-behavior: none;}

.cursor{position: absolute; left: 0; top: 0; pointer-events: none;z-index:9999;width:2.1vw;height:2.1vw;display:none;background-color:#BDF61C;border-radius:50%;filter: blur(20px);transform: translate(-50%, -50%);background-image: radial-gradient(circle, #BDF61C, transparent);}

.shadow_bg{background: linear-gradient(142deg, #53FFEA 26.2%, #34F3FF 88.3%);filter: blur(250px);position:absolute;z-index: 1;width:50%;height:50%;border-radius:50%;opacity:0;transition:all .3s;}
.active .shadow_bg{opacity: 0.2;transition:all .3s;}

/*nav*/
nav{position:fixed;right:1%;color:#fff;z-index:99;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
nav a{position:relative;font-size:1.7rem;font-weight:500;color:#C4FF1C;display: block;padding:1.2rem 0;width:2rem;}
nav a:before{content:'';width:.8rem;height:.8rem;background:#fff;position:absolute;top:50%;left: 50%;-webkit-transform:translate(-50%, -50%);transform: translate(-50%, -50%);border-radius:50%;}
nav li.active a:before{background:#C4FF1C;}
nav a > span{opacity:0;visibility: hidden;position:absolute;right:100%;top:50%;transform: translateY(-50%);margin-right:0.8rem;}
nav li.active a > span{opacity:1;visibility: visible;}
nav a:hover:before,nav a:focus:before{background:#fff;}

/*section1*/
#bandi_logo img{height:5rem;}
#section1 .shadow_bg{top:-10%;left:-6%;}
#section1.active .shadow_bg{transition-delay: .5s;}
#section1{position:relative;height:100vh;display:flex;flex-direction:column;justify-content: flex-end;}
#section1:before{content:'';background-color:#111;width:100%;height:100%;position:absolute;top:0;left:0;transform: translateY(-101%) translateZ(0);z-index: -1;}
#section1.active:before{transform: translateY(0) translateZ(0);transition: transform 1s cubic-bezier(.76,.09,.215,1);}
#section1 .txt{display:flex;align-items: center;position:absolute;justify-content: space-between;width:100%;max-width:95%;top:5%;left:50%;transform:translateX(-50%);transition:all 1s;z-index: 1;}
#section1 .txt.active{top:50%}
#section1 .txt1{font-size:2.5rem;color:#fff;font-weight:500;line-height:1.3;}
#section1 .txt1 .split{margin-top:2rem;}
#section1 .txt1 .split span:nth-child(2),
#section1 .txt1 .split span:nth-child(4),
#section1 .txt1 .split span:nth-child(9){margin-right:0.7rem;}
#section1 .txt1 .split.eng span:nth-child(2),
#section1 .txt1 .split.eng span:nth-child(4),
#section1 .txt1 .split.eng span:nth-child(9){margin-right:0;}
#section1 .txt1 .split.eng span:nth-child(8),
#section1 .txt1 .split.eng span:nth-child(13),
#section1 .txt1 .split.eng span:nth-child(20),
#section1 .txt1 .split.eng span:nth-child(25),
#section1 .txt1 .split.eng span:nth-child(30),
#section1 .txt1 .split.eng span:nth-child(36),
#section1 .txt1 .split.eng span:nth-child(41),
#section1 .txt1 .split.eng span:nth-child(52){margin-right:0.7rem;}
#section1 .txt .txt2{opacity:0;visibility: hidden;transform: translateY(100%);transition:all .5s;transition-delay: .5s;}
#section1.active .txt .txt2{opacity:1;visibility: visible;transform: translateY(0);width:33.9vw;height:9.9vw;}
#section1 .txt .txt2 strong {color: #fff;font-size: 10.9vw;position: absolute;right:0;top:0;line-height:0.9;}
#section1 .txt .txt2 strong:nth-child(1) {color: transparent;-webkit-text-stroke: 2px #C4FF1C;;}
#section1 .txt .txt2 strong:nth-child(2) {color: #C4FF1C;;animation: animate 4s ease-in-out infinite;}
#section1 .view{height:calc(90% - 9.9vw);position:relative;transform: scaleX(0);opacity: 0;visibility: hidden;transition: all .5s;margin-bottom:1%;}
#section1 .view video{position:absolute;top:50%;left:50%;object-fit: cover;width:100%;height:100%;transform:translate(-50%, -50%);z-index: -1;}
#section1.active .view{transform: scaleX(.95);opacity: 1;visibility: visible;overflow:hidden;}
#section1 .split:first-child span:nth-child(5), #section1 .split:first-child span:nth-child(7),#section1 .split:first-child span:nth-child(9){margin-left:0.8vw;}
#section1 .view.active{transform: scaleX(1);z-index: -1;transition: all 1s;height:100%;margin-bottom:0;}
.scroll_down{text-align: center;position:absolute;bottom:9%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);}
.scroll_down .mouse{display: block;border-radius: 5rem;border: 3px solid #fff;height: 3.4rem;width: 2.3rem;position: relative;margin:auto;}
.scroll_down .move{position: absolute;background-color: #fff;height: .8rem;width: .3rem;border-radius: 5rem;left: 50%;transform: translateX(-50%);animation: move 2s linear infinite;}
.scroll_down h3{color:#fff;font-size:1.6rem;font-weight:400;margin-top:1.2rem;}

@keyframes move {
  0% {
    transform: translate(-50%,.2rem);
    opacity: 0;
  }
  50% {
    transform: translate(-50%,.6rem);
    opacity: 1;
  }
  100% {
    transform: translate(-50%,1.5rem);
    opacity: 0;
  }
}

@keyframes animate {
  0%,
  100% {
    clip-path: polygon(
            0% 45%,
            16% 44%,
            33% 50%,
            54% 60%,
            70% 61%,
            84% 59%,
            100% 52%,
            100% 100%,
            0% 100%
    );
  }

  50% {
    clip-path: polygon(
            0% 60%,
            15% 65%,
            34% 66%,
            51% 62%,
            67% 50%,
            84% 45%,
            100% 46%,
            100% 100%,
            0% 100%
    );
  }
}


/*section2*/
#section2{height:100vh;display:flex;align-items: center;justify-content: center;background-color:#111;}
.text_wrapper{text-align: center;}
.text_wrapper > *{display:block;}
.text_wrapper .text1{font-size:2.9vw;font-weight:700;letter-spacing: -1.12px;color:#C4FF1C;}
.text_wrapper .text2{font-size:9.9vw;font-weight:700;line-height:1;color:#fff;}
.split > span{display: inline-block;}

/*section3*/
#section3{background-color:#111;}
.list_cont > *{height:12.5vw;border-bottom: 1px solid #575757;display:flex;align-items: center;position: relative;z-index: 1;overflow:hidden;}
.list_cont > * > div{padding:1vw 6.61458333333%;height:100%;display:flex;flex-direction: column;justify-content: center;transition: all cubic-bezier(.1,.5,.5,1) 0.4s;}
.list_cont > *:first-child{border-top:1px solid #575757;}
.list_cont > * p{margin-top:0.8vw;font-size:1.1vw;font-weight:500;line-height:1.4;color:#111;}
.list_cont .title{font-size:3.1vw;font-weight:700;line-height:3.1vw;color: rgb(182, 182, 182, 0.2);background: linear-gradient(to right, #ffffff, #ffffff) no-repeat;-webkit-background-clip: text;background-clip: text;transition: background-size cubic-bezier(.1,.5,.5,1) 0.5s;}
.list_cont > * p{display: none;}
.list_cont .hovered-class p, .list_cont .hovered-class img{display: block;}
.list_cont .hovered-class img{display: block;box-shadow: 0 0 100px 5px rgba(0, 0, 0, 0.40);}
.list_cont .hovered-class .title{color:#111;}
.list_cont > *::before{width:100%;height:calc(100% + 2px);background: #C4FF1C;content:'';position:absolute;top:-1px;left:0;z-index: -1;clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%);transform-origin: center;transition: all cubic-bezier(.1,.5,.5,1) 0.8s;}
.item_img{position:absolute;top:2.4vw;right:6%;pointer-events: none;width:21.4vw;height:13.5vw;}
.item_img_wrap{transform: translate3d(0, 110%, 0) rotate(-30deg);transition: transform .6s cubic-bezier(0.895, 0.03, 0.685, 0.22);opacity:0;width:100%;height:100%;display:block;}
.item_img_wrap img{width:100%;height:100%;}
.list_cont .hovered-class .item_img_wrap{transform: translate3d(0, 0, 0) rotate(0deg);transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);opacity: 1;}
.list_cont .hovered-class:before{clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }
.list_cont .hovered-class .title{width:100%;}
.list_cont .hovered-class{overflow:visible}

/*section4*/
#section4{position:relative;}
#section4 .shadow_bg{right:-18%;bottom:0;z-index: -1;opacity: 0.2;transition-delay: .3s;}
.tech_wrap{display:flex;align-items: center;justify-content: center;background-color:#111;padding:8vw 0;}
.tech_wrap .tech_img{width:31.2rem;position:relative;margin:24rem 20rem 0 20rem;}
.tech_wrap .tech_img .item{position:absolute;display:block;right:0;font-size:2.2rem;color:#fff;font-weight:500;}
.tech_wrap .tech_img .item:nth-child(even):before{content:'';border-top:1px solid #b8b8b8;height:1px;width:15rem;display:inline-block;margin-right:1rem;vertical-align: middle;margin-top: -0.4rem;z-index: 1;}
.tech_wrap .tech_img .item:nth-child(odd):after{content:'';border-top:1px solid #b8b8b8;height:1px;width:15rem;display:inline-block;margin-left:1rem;vertical-align: middle;left:100%;margin-top:-0.4rem;z-index: 1;}
.tech_wrap .tech_img .item .circle_light{position:absolute;left:-6rem;top:-4.4rem;z-index: 1;}
.tech_wrap .tech_img .item:nth-child(odd) .circle_light{left:auto;right:-6rem;}
.tech_wrap .tech_img .item:nth-child(odd){left:0;right:auto;}
.tech_wrap .tech_img .item:nth-child(2){top:2rem;margin-right:2rem;}
.tech_wrap .tech_img .item:nth-child(3){top:22rem;margin-left:-13.3rem;}
.tech_wrap .tech_img .item:nth-child(3):after{width:9rem;}
.tech_wrap .tech_img .item:nth-child(4){top:34.3rem;margin-right:-19rem;}
.tech_wrap .tech_img .item:nth-child(4):before{width:13.8rem;}
.tech_wrap .tech_img .item:nth-child(5){top:43rem;margin-left:-18rem;}
.tech_wrap .tech_img .item:nth-child(5):after{width:9.5rem;}
.tech_wrap .tech_img .item:nth-child(6){top:51rem;margin-right:-8.5rem;}
.tech_wrap .tech_img .item:nth-child(6):before{width:9rem;}

.tech_wrap .tech_img .item.t6 .circle_light{left:-6rem;right:auto;}
.tech_wrap .tech_img .item.t6:after{display: none;}
.tech_wrap .tech_img .item.t6:before{content:'';border-top:1px solid #b8b8b8;height:1px;width:10rem;display:inline-block;margin-right:1rem;vertical-align: middle;margin-top: -0.4rem;z-index: 1;}
.tech_wrap .tech_img .item.t6{top:15rem;right:0;margin-right:-13rem;left:auto;}

.tech_wrap .tech_img a.item:hover, .tech_wrap .tech_img a.item:focus{text-decoration: underline;color:#C4FF1C;transition:all .3s;}
.tech_wrap .tech_info{font-size:1.3vw;font-weight:700;margin-left:10%;}
.tech_wrap .tech_info > *{white-space: nowrap;}
.tech_wrap .tech_info > *:before{content:'';background: rgba(196, 255, 28, 0.10);border: 1.5px solid #C4FF1C;width:calc(100% + 3rem);height:calc(100% + 1rem);position:absolute;left:-1.5rem;top:-0.5rem;z-index:-1;opacity:0;visibility: hidden;transition:all .3s;}
.tech_wrap .tech_info > .active:before{opacity:1;visibility: visible;}
.tech_wrap .tech_info strong{color:#C4FF1C;width:7.8125vw;display:inline-block;}
.tech_wrap .tech_info span{color:#fff;padding-left:1.0vw;display:inline-block;}
.tech_wrap .tech_info p + p{margin-top:1.2vw;}
:root {
  --w-size: 12.2rem;
  --w-c1: 1.6rem;
  --w-c23: calc(var(--w-size) / 1.8);
  --w-c1-margin: calc((var(--w-size) - var(--w-c1)) / 2);
  --w-c23-offset: calc((var(--w-c23) - var(--w-c1)) / -2);
  --color: #C4FF1C;
}
.circle_light {width: var(--w-c1);height: var(--w-c1);position: relative;border-radius: 50%;box-sizing: border-box;background: var(--color);margin: var(--w-c1-margin);}
.circle_light::before,
.circle_light::after {width: var(--w-c23);height: var(--w-c23);background: var(--color);display: block;position: absolute;content: "";border-radius: 50%;top: var(--w-c23-offset);left: var(--w-c23-offset);opacity: 0.5;}
.circle_light::before {animation: warn1 1.5s linear;animation-iteration-count: infinite;}
.circle_light::after {animation: warn2 1.5s linear;animation-iteration-count: infinite;}
.t1 .circle_light:before{display:none;}
.t1 .circle_light:after{animation: warn3 1.5s linear;animation-iteration-count: infinite;}

@keyframes warn1 {
  0% {
    transform: scale(1);
    opacity: 0.01;
  }

  25% {
    transform: scale(1.2);
    opacity: 0.1;
  }

  50% {
    transform: scale(1.4);
    opacity: 0.08;
  }

  75% {
    transform: scale(1.6);
    opacity: 0.04;
  }

  100% {
    transform: scale(1.8);
    opacity: 0.02;
  }
}

@keyframes warn2 {
  0% {
    transform: scale(0.6);
    opacity: 0.02;
  }

  25% {
    transform: scale(0.6);
    opacity: 0.13;
  }

  50% {
    transform: scale(0.8);
    opacity: 0.2;
  }

  75% {
    transform: scale(1);
    opacity: 0.09;
  }

  100% {
    transform: scale(1.2);
    opacity: 0.03;
  }
}


@keyframes warn3 {
  0% {
    transform: scale(0.4);
    opacity: 0.02;
  }

  25% {
    transform: scale(0.4);
    opacity: 0.13;
  }

  50% {
    transform: scale(0.6);
    opacity: 0.2;
  }

  75% {
    transform: scale(.8);
    opacity: 0.09;
  }

  100% {
    transform: scale(1);
    opacity: 0.03;
  }
}

/*section5*/
#section5{position:relative;background-color:#000;height:100vh;overflow:hidden;}
#section5 video{position:absolute;top:0;left:50%;transition: all 3s;height:100%;transform:translateX(-50%) scale(3);object-fit: cover;border-radius:50%;}

#section5.active.on video{transform:translateX(-50%) scale(1);}
#section5 .swiper-container{width:100%;height:100%;margin-left:auto;margin-right:auto;
  opacity: 0;visibility: hidden;}
#section5 .swiper-slide{text-align: center;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;flex-direction: column;}
#section5.active .swiper-container{opacity: 1;visibility: visible;transition-delay: .3s;transition-duration: 2s;}
#section5 .figure_txt .number{opacity: 0;visibility: hidden;transform: translateY(-50px);transition:all .3s}
#section5.active .figure_txt .number{opacity:1;visibility: visible;transform: translateY(0);}
#section5 .figure_txt .tt > span{opacity: 0;visibility: hidden;height: 0;transform: translateY(-50px);}
#section5.active .swiper-slide-active.figure_txt .tt > span{opacity:1;visibility: visible;transform: translateY(0);transition-duration: 1s;height: auto;transition-delay:.5s;}
#section5.active .swiper-slide-active.figure_txt .tt > span:last-child{transition-delay:.5s;}
#section5 .figure_txt .box{transform: scaleY(0);transition-duration: 1s;opacity:0;visibility: hidden;}
#section5 .swiper-slide-active.figure_txt .box{transform: scaleY(1);transition-delay:.5s;opacity:1;visibility: visible;}

.figure_txt{color:#fff;text-align: center;width:100%;}
.figure_txt .tt{font-size:2.9vw;font-weight:700;}
.figure_txt .tt > span{display: block;line-height: 1.4;}
.figure_txt .number{color:#fff;font-size: 2.1vw;font-weight:700;}
.figure_txt .number > b{color:#C4FF1C;font-size:10.9vw;line-height: 1.2;font-weight:800;}
.figure_txt .box{padding:0.9vw 1.5vw;border-radius:5.2vw;background: rgba(119, 119, 119, 0.20);-webkit-backdrop-filter: blur(50px);backdrop-filter: blur(50px);display: inline-flex;font-size:1.3vw;font-weight:700;}
.figure_txt .box strong{color: #C4FF1C;margin-right:1.9vw;}

/*section6*/
#section6{position:relative;height:100vh;overflow:hidden;background:#111;}
#section6 video{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%) scaleX(0);min-width: 100%;min-height: 100%;max-width: inherit;object-fit: cover;width:100%;transition:all 1s;}
#section6.active video{transform: translate(-50%, -50%) scaleX(1);}
#section6  .parallax_text{position:absolute;color:#fff;font-weight:700;white-space: nowrap;transition-duration:.4s;line-height:1;text-align: center;}
#section6  .parallax_text.t1{position:absolute;left:25%;letter-spacing: -1px;bottom:15%}
#section6  .parallax_text.t2{right:20%;top:75%;}
#section6  .parallax_text.t3{left:20%;top:20%;}
#section6  .parallax_text.t4{right:20%;top:13%}
#section6  .parallax_text.t5{top:50%;left:50%;transform:translate(-50%, -50%);}
#section6  .parallax_text > span{font-size:0.9rem;display: block;margin-top:0.4rem;}

/*section7*/
#section7{height:100vh;position:relative;display:flex;align-items: center;justify-content: center;background-color:#111;}
.bandi_card_text{position:absolute;transition-duration:.5s; }
.bandi_card_text svg + svg{margin-left:1vw;}
.box_lst{width:100%;display:flex;align-items: center;justify-content: space-between;padding:0 5%;position:absolute;left:100%;}
.box_lst [class*="box"]{border-radius: 1vw;background: rgba(119, 119, 119, 0.20);-webkit-backdrop-filter: blur(50px);backdrop-filter: blur(50px);padding:2.6vw;display:inline-block;}
.box_lst [class*="box"] i{display: block;text-align: right;}
.box_lst [class*="box"] .year{color:#C4FF1C;font-size:2.6vw;font-weight:800;margin-top:0.5vw;display: block;}
.box_lst [class*="box"] li{color:#fff;font-size:1.1vw;font-weight:500;white-space: nowrap;}
.box_lst [class*="box"] li + li{margin-top:0.4vw;}
.box_lst .box1{margin-top:15rem;}
.box_lst .box2{margin-top:-15rem;}

/*section8*/
#section8{position:relative;height:100vh;display: flex;align-items: center;justify-content: center;flex-direction: column;background-color:#111;gap:3vw;}
#section8 .figure_txt{position: static;transform: none;}
#section8 .shadow_bg{left:-40%}
.trl_wrap{display: flex;}
.trl_wrap .trl_info_box b{color:#C4FF1C;font-size:2.5rem;font-weight:700;}
.trl_wrap .trl_info_box .depth{color:#fff;font-size:2.2rem;font-weight:500;line-height:1.2;}
.trl_wrap .trl_info_box .year_cont{text-align: center;display:flex;justify-content: center;padding-bottom:10rem;position:relative;}

.trl_wrap .trl_info_box .year_cont .arrow{position:absolute;top:0;left:0;width:100%;}
.trl_wrap .trl_info_box .year_cont .arrow:before{content:'';background:#C4FF1C;width:calc(100% - 3.3rem);height:2.2rem;position:absolute;left:0;opacity:0.1;transition:all .3s;}
.trl_wrap .trl_info_box .year_cont .arrow:after{content:'';width: 0;height: 0;border-bottom: 2.8rem solid transparent;border-top: 2.8rem solid transparent;border-left: 3.3rem solid #C4FF1C;top:-1.7rem;position: absolute;right:0;opacity:0.1;transition:all .3s;}

.trl_wrap .trl_info_box.t1 .year_cont .arrow{top:13rem;}
.trl_wrap .trl_info_box.t2 .year_cont .arrow{top:11rem;}
.trl_wrap .trl_info_box.t3 .year_cont .arrow{top:7.5rem;}
.trl_wrap .trl_info_box.t4 .year_cont .arrow{top:3.8rem;}
.trl_wrap .trl_info_box.t5 .year_cont .arrow{top:2rem;}


.trl_wrap .trl_info_box .year_cont > div{width:23rem;height:36rem;display:flex;flex-direction: column;justify-content: flex-end;padding-bottom:7.5rem;border-left:1px dashed rgba(255,255,255,0.15);opacity:0.5;position:relative;overflow:hidden;}
.trl_wrap .trl_info_box .year_cont > div:before{background:linear-gradient(0deg, rgba(196,255,28,0.1) 0%, rgba(0,0,0,0) 100%);content:'';width:100%;transition:all 0.8s;position:absolute;top:0;left:0;opacity:0;visibility: hidden;height:100%;transform: translateY(-100%);z-index:-1;}
.trl_wrap .trl_info_box.active .year_cont > div:before{opacity:1;visibility: visible;transform:translateY(0);}

.trl_wrap .trl_info_box.t1 .year_cont > div:nth-of-type(2),
.trl_wrap .trl_info_box.t4 .year_cont > div:nth-of-type(2){border-right:0;}

.trl_wrap .trl_info_box:last-of-type .year_cont > div{border-right:1px dashed rgba(255,255,255,0.15);}
.trl_wrap .trl_info_box .year_cont b{display: block;}
.trl_wrap .trl_info_box .text_cont{border:2px solid rgba(255,255,255,0.15);width:calc(100% - 0.5rem);display:flex;align-items: center;justify-content:center;height:7rem;margin-top:4rem;margin-left: 0.2rem;position:relative;}
.trl_wrap .trl_info_box .text_cont b{font-size:2.2rem;margin-left:0.8rem;}
.trl_wrap .trl_info_box .step{position:absolute;color:#ccc;font-size:2rem;width:100%;padding-top:1rem;border-top:1px solid #767676;bottom:0;left:0;}
.trl_wrap .trl_info_box .step:before{content:'';top:-3.4rem;position:absolute;left:0;border-left:1px solid #767676;height:3.4rem;}
.trl_wrap .trl_info_box.t3 .step{width:calc(100% + 11.5rem);}
.trl_wrap .trl_info_box.t4 .step{width: calc(100% - 11.5rem);left:11.5rem;}
.trl_wrap .trl_info_box.t4 .step:after{content:'';top:-3.4rem;position:absolute;right:0;border-right:1px solid #767676;height:3.4rem;}
.trl_wrap .trl_info_box .step > span{position:absolute;left:-0.5rem;top:-4.4rem;height:1.1rem;}
.trl_wrap .trl_info_box .step > span:before{content: '▲';color: #767676;font-size: 1.1rem;vertical-align: top;}
.trl_wrap .trl_info_box .step > span.right{left:auto;right:-0.5rem;}
.trl_wrap .trl_info_box.t5 .year_cont > div{width:31.6rem;}
.trl_wrap .trl_info_box .text_cont .tip{color:#fff;opacity:0;visibility: hidden;width:0;transition:all .3s;}
.trl_wrap .trl_info_box .text_cont .tip > i{font-size:1.8rem;}
.trl_wrap .description{position:absolute;background: rgba(119, 119, 119, 0.20);-webkit-backdrop-filter: blur(50px);backdrop-filter: blur(50px);border-radius:2rem;width:auto;min-width:calc(100% + 1rem);padding:4rem 2.5rem;bottom:100%;margin-bottom:4rem;display:none;z-index:1;}
.trl_wrap .trl_info_box.t2 .description{width:300%;}

.trl_wrap .trl_info_box .text_cont .description > b{margin-left:0;line-height:1.3;white-space: nowrap;}
.trl_wrap .trl_info_box .text_cont .description > p{font-size:1.8rem;color:#fff;font-weight:500;margin-top:1.8rem;}
.trl_wrap .description:before{content: '';width: 0;height: 0;border-bottom: 2.5rem solid transparent;border-right: 3.2rem solid #272727;bottom: -2.4rem;position: absolute;right: 23%;}


.trl_wrap .trl_info_box.active .year_cont .arrow:before,
.trl_wrap .trl_info_box.active .year_cont .arrow:after{opacity:1;}
.trl_wrap .trl_info_box.active .year_cont > div{border-right:1px dashed rgba(255,255,255,0.15);}
.trl_wrap .trl_info_box.active .year_cont .arrow:before{background:linear-gradient(270deg, rgba(196,255,28,1) 0%, rgba(0,0,0,0) 100%);opacity:1;transition:all .3s;}
.trl_wrap .trl_info_box.active .year_cont > div,
.trl_wrap .trl_info_box.active .year_cont > .arrow{opacity:1;}

.trl_wrap .trl_info_box .text_cont:before{background: rgba(196, 255, 28, 0.10);    content: '';position: absolute;width: calc(100% + 4px);height: calc(100% + 4px);border: 2px solid #C4FF1C;transform:scaleX(0);transition:all .5s;
  z-index: -1;}
.trl_wrap .trl_info_box.active .text_cont:before{transform:scaleX(1);}
.trl_wrap .trl_info_box.active .tip{opacity:1;visibility: visible;width:auto;margin-left: 0.5rem;}
.wrap-hovered-class .cursor{width:3rem;height:3rem;filter: blur(4px);background-color:#0ACECE;}
.horizontal_scroll { display:none;position:sticky;left:0;margin-bottom:.5rem;}
.horizontal_scroll .xi-touch{position:relative;left:0;animation:h_move 1s infinite linear; margin-right: 1rem;}
.trl_wrap{min-width:102.4rem;}
@keyframes circle_ani{
  0%{
    transform:translate(-50%, -50%) rotate(0deg);
  }
  100%{
    transform:translate(-50%, -50%) rotate(360deg);
  }
}
#section8 .title{display: block;font-size:5.6rem;font-weight:700;color:#fff;}
#section8 .text2{font-size:2rem;font-weight:400;color:#fff;}
#section8 .text2 b{color:#C4FF1C;margin-right:2rem;}
#canvas{position:absolute;z-index: -1;filter: blur(1px);}

@media (max-width: 1750px){
  .trl_wrap .trl_info_box .year_cont > div,
  .trl_wrap .trl_info_box.t5 .year_cont > div{width:20rem;}
  .trl_wrap .trl_info_box .depth{font-size:1.9rem;}
  .trl_wrap .trl_info_box .text_cont b{font-size:2rem;}
  #section8{gap:2rem;}
  .trl_wrap .trl_info_box .text_cont{margin-top:2rem;}

  .tech_wrap{padding:20rem 0;}
  .tech_wrap .tech_img{margin-top:0;}
  .tech_wrap .tech_info{margin-left:6%;}

}
@media (max-width: 1400px){
  .bandi_card_text{width:100%;max-width:90%;text-align: center;}
  .bandi_card_text svg{height:24rem;width:auto;}

  .trl_wrap .trl_info_box .text_cont b{display: block;margin-left:0;line-height:1.1;font-size:1.8rem;}
  .trl_wrap .trl_info_box .depth{text-align: center;font-size:1.8rem;line-height:1.2;}
  .trl_wrap .trl_info_box .year_cont > div, .trl_wrap .trl_info_box.t5 .year_cont > div{width:16rem;}
  .trl_wrap .trl_info_box b{font-size:2rem;}



}
@media (max-width: 1280px){
  .trl_wrap .trl_info_box .year_cont .arrow:before{width:calc(100% - 3.2rem);}
  .tech_wrap .tech_info p + p{margin-top:1.2rem;}

}
@media (max-width: 1200px){
  :root{--w-size: 8.7rem;--w-c1: 1.1rem;}

  #section1 .txt{flex-direction: column;}

  #section1.active .txt .txt2{width: auto;height: auto;margin-top:2rem;}
  #section1 .txt .txt2 strong{right:auto;left:50%;transform: translateX(-50%);font-size:19rem;}

  .text_wrapper .text1{font-size:5rem;}
  .text_wrapper .text2{font-size:15rem;}

  .list_cont > *{height:21rem;padding:3rem;flex-direction: column;align-items: flex-start;}
  .list_cont > * > div{padding:0;width:100%;}
  .list_cont .title{font-size:5rem;line-height:1.2;}
  .list_cont > * p{font-size:2.2rem;margin-top:1.3rem;}
  .list_cont .hovered-class{height: auto;}
  .item_img{position:static;width:auto;height: 0;border-radius:5px;opacity:0;visibility: hidden;}
  .list_cont .hovered-class .item_img{opacity:1;visibility: visible;margin-top:2rem;height: auto;}
  .list_cont > * p br{display: none;}
  .list_cont > * p{word-break: keep-all;}
  .list_cont .hovered-class img{box-shadow:0 5px 22px 4px rgba(0, 0, 0, 0.40);}

  .tech_wrap .tech_img{transform: none !important;margin:0 12rem 0 14rem;width:20rem;}
  .tech_wrap .tech_info{font-size:2rem;margin-left:0;}
  .tech_wrap .tech_info strong{width:11rem;margin-left:0;}
  .tech_wrap .tech_info span{padding-left:2rem;width:calc(100% - 11rem);}
  .tech_wrap .tech_img .item{font-size:1.8rem;}
  .tech_wrap .tech_img .item:before,  .tech_wrap .tech_img .item:after{width:6rem !important;}
  .tech_wrap .tech_img .item .circle_light{top:-3rem;left:-4rem;}
  .tech_wrap .tech_img .item:nth-child(odd) .circle_light{right:-4rem;}
  .tech_wrap .tech_img .item:nth-child(2){top:1.5rem;margin-right:4rem;}
  .tech_wrap .tech_img .item:nth-child(3){top:12rem;margin-left:-11rem;}
  .tech_wrap .tech_img .item:nth-child(4){top:22.5rem;margin-right:-12rem;}
  .tech_wrap .tech_img .item:nth-child(5){top:27rem;margin-left:-10.8rem}
  .tech_wrap .tech_img .item:nth-child(5):after{width:4rem !important}
  .tech_wrap .tech_img .item:nth-child(6){top:32rem;margin-right:-6.8rem;}
  .tech_wrap{gap:0 10rem;}
  .tech_wrap .tech_img .item.t6 .circle_light{right:auto;left:-4rem;}
  .tech_wrap .tech_img .item.t6{margin-right:-9rem;top:11rem;}

  .figure_txt .tt{font-size:4.5rem;}
  .figure_txt .number{font-size:3rem;}
  .figure_txt .number > b{font-size:17rem;}
  .figure_txt .box{font-size:2.2rem;}
  .box_lst [class*="box"] .year{font-size:4rem;}
  .box_lst [class*="box"] li{font-size:2rem}

  .wrap-hovered-class .cursor{background:inherit;}

}

@media (max-width: 1024px){
  .tech_wrap{justify-content: space-around;flex-direction: column;height: auto;padding:13rem 3rem;}
  .bandi_card_text svg{height:15rem;}
  .tech_wrap .tech_img{opacity:0;visibility: hidden;}
  .tech_wrap .tech_info{margin-top:5rem;}
  .tech_wrap.active .tech_img{opacity:1;visibility: visible;transition: all 1s;}
  #section8 .shadow_bg{opacity:0.1;left:-42%;}
  #section8 .trl_info .info p{font-size:2.7rem;}
  #section8 .trl_info .info .year{font-size:2.4rem;}
  #section8 .trl_info .inner{width:46rem;height:34rem;}
  #section8 .trl_info .info{width:22rem;height:22rem;}

  #section7{height: inherit;padding:14rem 2rem;flex-direction: column;}
  .bandi_card_text svg{fill:#C4FF1C;}

  .bandi_card_text{position:static;}
  .box_lst{position:static;padding:0;flex-direction: column;margin-top:8.5rem;gap:2rem;}
  .box_lst [class*="box"]{width:100%;padding:2rem;display: block;margin-top:0 !important;opacity:0;visibility:hidden;transform: translateY(80px);}
  .box_lst [class*="box"] i{width:10rem;right:1rem;position:absolute;}
  .box_lst [class*="box"] .year{font-size:2.6rem;}
  .box_lst [class*="box"] li{font-size:1.75rem;}

  .active .box_lst [class*="box"]{opacity: 1;visibility: visible;transition:all .3s;transform: translateY(0);}
  .active .box_lst .box1{transition-delay: .1s;transition-duration:.8s;}
  .active .box_lst .box2{transition-delay: .5s;transition-duration:.8s;}
  .active .box_lst .box3{transition-delay: 1s;transition-duration:.8s;}

  #section8{padding:5rem 2rem 10rem;}
  #section8 .title{font-size:4rem;text-align: center;line-height:1.3;margin-bottom:5rem;}
  .scroll_x{overflow-x:auto;width:100%;}
  .horizontal_scroll { display:block;color:#fff;opacity:0.6;}
  .trl_wrap{min-width:102.4rem;}
  .trl_wrap .trl_info_box .text_cont .tip{opacity: 1;visibility: visible;width: auto;margin-left:0.5rem;}
  .trl_wrap .trl_info_box .year_cont > div:before{opacity:1;visibility: visible;transform:translateY(0);}
  .trl_wrap .trl_info_box .year_cont > div,
  .trl_wrap .trl_info_box .year_cont .arrow:before,
  .trl_wrap .trl_info_box .year_cont .arrow:after{opacity:1;}
  .trl_wrap .trl_info_box .description{right:0;}

  #section8{height: auto;}
}

@media (max-width: 768px){
  #section1 .txt .txt2 strong{font-size:15rem;}

  .bandi_card_text svg{height:11rem;}

  #section2{height:100%;padding:20rem 0;}
  #section5 video{transform:translateX(-50%) scale(1);}

  .figure_txt .tt{font-size:3rem;padding:0 2rem;}
  .figure_txt .number > b{font-size:12rem;}
  #section5 .figure_txt .box{font-size:2rem;}
  #section5 video{object-fit: contain;}
  #section5{height:100%;}

  #section5 .swiper-container,
  #section5 .figure_txt .number,
  .figure_txt .tt,
  #section5 .figure_txt .box{opacity:1;visibility: visible;transform:translateY(0);}
  #section5 .figure_txt .tt > span{height: auto;visibility: visible;opacity:1;transform:translateY(0);}
  #section5 .swiper-wrapper{display: block;padding:15rem 0;}
  #section5 .swiper-slide + .swiper-slide{margin-top:10rem;}



  #section6{height:70rem;}
  #section6 .parallax_text{font-size:3rem;opacity:0;visibility: hidden;transition:all .3s;}
  #section6 .parallax_text.t5{font-size:4rem;}

  #section6 .parallax_text.t1{left:12%;}
  #section6 .parallax_text.t2{right:7%;}
  #section6 .parallax_text.t2 br{display: none;}
  #section6 .parallax_text.t3{left:8%;}
  #section6 .parallax_text.t4{right:3%;}

  #section6.active .parallax_text{opacity:0.9;visibility: visible;}
  #section6.active .parallax_text.t1{transition-delay: 0.2s;}
  #section6.active .parallax_text.t2{transition-delay: 0.4s;}
  #section6.active .parallax_text.t3{transition-delay: 0.5s;}
  #section6.active .parallax_text.t4{transition-delay: 0.6s;}
  #section6.active .parallax_text.t5{transition-delay: 0.7s;opacity:1;}



}

@media (max-width: 530px){
  #section1 .txt .txt2 strong{font-size:12rem;}

  .text_wrapper .text1{font-size:3rem;}
  .text_wrapper .text2{font-size:10rem;}

  .figure_txt .box{flex-direction: column;padding:2rem;}
  .figure_txt .box strong{margin-right:0;}
  .figure_txt .tt{margin-bottom:1rem;}
  #section8 .trl_info .info img{box-shadow: none}
  #section8 .trl_info .inner{height:22rem;width:27rem;}
  #section8 .trl_info .info{width: inherit;height: 100%;margin-left:1rem;}
  #section8 .trl_info{padding-left:0;margin-top:2rem;}

  .list_cont .hovered-class{padding:3rem;}
  .list_cont > *{height:14rem;padding:0 3rem;}
  .list_cont .title{font-size:3.7rem;}

  #section6 .parallax_text.t1{left:5%;}
  #section6 .parallax_text.t2{right:5%;top:66%;}
  #section6 .parallax_text.t3{left:9%;top:8%;}
  #section6 .parallax_text.t4{top:26%;right:4%;}
  #section6.active .parallax_text{opacity:1;}

}

@media (max-width: 400px){
  .bandi_card_text svg{height:9rem;}

  .tech_wrap .tech_info > *{white-space: inherit;word-break:keep-all;}

  .tech_wrap .tech_info strong{vertical-align: top;line-height:1.2;}
  .tech_wrap .tech_info span{line-height:1.2;}

  #section8 .text2{text-align: center;}
  #section8 .text2 b{display: block;margin-right:0;}


}

@media (max-width: 340px){
  .tech_wrap .tech_img{width:16rem;}

  .tech_wrap .tech_img .item:nth-child(2){margin-right:0;}
  .tech_wrap .tech_img .item:nth-child(4){top:18.5rem;margin-right:-10rem;}
  .tech_wrap .tech_img .item:nth-child(5){top:22rem;margin-left:-12.8rem;}
  .tech_wrap .tech_img .item:nth-child(6){top:26rem;margin-right:-7.8rem;}
  .tech_wrap .tech_img .item:nth-child(4):before{width:3rem !important;}

  #section5 .figure_txt .tt > span{word-break:keep-all;}
}