@charset "utf-8";


:root {
    /* --mainIn: max(184rem, 1680px); /* = --in*/
    --mainIn: clamp(1680px, calc(25vw + 1040px), 1840px);
    --mainPd:10rem;

    --mainTit: 7rem;

    --mainSectPd: 30rem;
    --mainContMt: 10rem;
    --mainContMt2: 5rem;
}


.main .header:not(.hedaer_down){background-color: transparent; color: #fff; }
.main .header .logo svg path{ fill: #fff; transition: fill 0.3s ease-in-out;}
.main .header .util_wrap .ico_btn svg path {stroke: #fff; }
.main .header .util_wrap .ico_btn.ham_btn svg path {stroke: none; fill: #fff;}
.main .header .util_wrap .util_btn:not(.ico_btn) {color: #fff;}

.main .header.header_fill{background-color: #fff; color: #000;}
.main .header.header_fill .util_wrap .util_btn:not(.ico_btn) {color: #000;}

.main .header.header_fill .util_wrap .util_btn:not(.ico_btn):hover {color: #fff;}

.main .header.header_fill .logo svg path{ fill: #0515D8;}
.main .header.header_fill .logo svg path:nth-child(n+4):nth-child(-n+8) {fill: #222;}
.main .header.header_fill .logo svg path:last-child {fill: #222;}
.main .header.header_fill .util_wrap .util_btn { border-color: #181818; color: #181818;}
.main .header.header_fill .util_wrap .ico_btn svg path {stroke: #181818; }
.main .header.header_fill .util_wrap .ico_btn.ham_btn svg path {stroke: none; fill: #181818;}




/* ---------- common ---------- */
.main .in {width: var(--mainIn);}
.main .main_in {position: relative; width: 100%; max-width: 100%; padding: 0 var(--mainPd); margin: 0 auto;}
.main .footer .in{width: var(--in2);}

.main_tit_box > *{opacity: 0; transform: translateY(5rem); transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out ;}
.main_tit_box.txt_c{text-align: center;}
.main_tit_box.flex_box{display: flex; align-items: flex-end; justify-content: space-between;}
.main_tit_box .tit{font-size: var(--mainTit); font-weight: 700; line-height: 1.5; transition:  opacity 0.6s ease-in-out, transform 0.6s ease-in-out ;}
.main_tit_box .tit.en{line-height: 1.5;}
.main_tit_box .txt{font-size:var(--p2); font-weight: 500; margin-top: 2.5rem ; transition:  opacity 0.6s ease-in-out 0.4s, transform 0.6s ease-in-out 0.4s;}
.main_tit_box .round_btn{margin-top: 7rem; opacity: 0; transform: translateY(5rem); transition:  opacity 0.6s ease-in-out 0.6s, transform 0.6s ease-in-out 0.6s;}
.main_tit_box.active > *{transform: unset; opacity:1;}

.com_plus_btn .btn{position: relative; display: inline-flex; align-items: center; padding: 0.8em 1.5em; font-size:var(--p4); font-weight: 600; color: var(--black); border:1px solid var(--black); border-radius: 1rem; transition: 0.3s ease;}
.com_plus_btn .btn:after{content: ''; position: relative; display: inline-block; width: 1em; height: 1em; margin-left: 3rem; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.5 0C8.05228 2.41411e-08 8.5 0.447715 8.5 1V6.5H14C14.5523 6.5 15 6.94772 15 7.5C15 8.05228 14.5523 8.5 14 8.5H8.5V14C8.5 14.5523 8.05228 15 7.5 15C6.94772 15 6.5 14.5523 6.5 14V8.5H1C0.447715 8.5 0 8.05229 0 7.5C0 6.94772 0.447715 6.5 1 6.5H6.5V1C6.5 0.447715 6.94772 -2.41411e-08 7.5 0Z" fill="black"/></svg>') no-repeat center / contain; filter: none; transition: filter 0.3s ease;}
.com_plus_btn .btn:hover{background-color: var(--black); color: #fff; border-color: var(--black);}
.com_plus_btn .btn:hover:after{filter: invert(1);}

.com_plus_btn .btn.wh{color: #fff; background: rgba(255, 255, 255, 0.20); backdrop-filter: blur(10px);  border: none;}
.com_plus_btn .btn.wh:after{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.5 0C8.05228 2.41411e-08 8.5 0.447715 8.5 1V6.5H14C14.5523 6.5 15 6.94772 15 7.5C15 8.05228 14.5523 8.5 14 8.5H8.5V14C8.5 14.5523 8.05228 15 7.5 15C6.94772 15 6.5 14.5523 6.5 14V8.5H1C0.447715 8.5 0 8.05229 0 7.5C0 6.94772 0.447715 6.5 1 6.5H6.5V1C6.5 0.447715 6.94772 -2.41411e-08 7.5 0Z" fill="white"/></svg>') no-repeat center / contain;}
.com_plus_btn .btn.wh:hover{background-color: #fff; color: var(--black);}
.com_plus_btn .btn.wh:hover:after{filter: invert(1);}

.com_plus_btn .btn.blue{color: #fff; background: var(--blue); border-color: var(--blue);}
.com_plus_btn .btn.blue:after{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.5 0C8.05228 2.41411e-08 8.5 0.447715 8.5 1V6.5H14C14.5523 6.5 15 6.94772 15 7.5C15 8.05228 14.5523 8.5 14 8.5H8.5V14C8.5 14.5523 8.05228 15 7.5 15C6.94772 15 6.5 14.5523 6.5 14V8.5H1C0.447715 8.5 0 8.05229 0 7.5C0 6.94772 0.447715 6.5 1 6.5H6.5V1C6.5 0.447715 6.94772 -2.41411e-08 7.5 0Z" fill="white"/></svg>') no-repeat center / contain;}
.com_plus_btn .btn.blue:hover{background-color: var(--black); color: #fff; border-color: var(--black);}
.com_plus_btn .btn.blue:hover::after {filter: none;}

/* ---------- Contents ---------- */
/* Visual */
.visual_sect{position: relative; width: 100%; height: 550svh;}
.visual_sect .bg{position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; --bg-overlay-opacity: 0; background: linear-gradient(180deg, #00053E 3.25%, #0B0D22 64.9%, #000865 94.2%);}
.visual_sect .bg img{width: 100%; height: 100%; object-fit: cover;}

.visual_sect .scroll_area{position: sticky; top: 0; width: 100%; height: 100svh; overflow: hidden; z-index: 3;}

.visual_sect .cont{position: relative; display: flex; flex-direction: column; color: #fff; width: 100%; height: 100%; z-index: 2; min-height: 108rem;}
.visual_sect .cont > *{position: absolute;}
/* 1번 contents */
.visual_sect .cont .main_txt{display: flex; font-size: 50rem; font-weight: 600; line-height: 0.85; overflow: visible;}
/* .visual_sect .cont .right_box .main_txt{font-size: 40rem;} */
.visual_sect .cont .main_txt span{display: inline-block; overflow: hidden;}
.visual_sect .cont .main_txt span .ch{display: block; font-style: normal; transform: translateY(100%); transition: none;}
.visual_sect .i_ch{position: relative; display: inline-block; color: transparent; background: none;}
.visual_sect .i_ch::before{content: ''; position: absolute; left: 51%; top: 0; width: 0.22em; height: 0.22em; transform: translateX(-50%); background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M10.8898 6.43972C8.47164 7.35515 7.35514 8.47165 6.43972 10.8898C6.18573 11.5672 5.2121 11.5672 4.95811 10.8898C4.04269 8.47165 2.92618 7.35515 0.507981 6.43972C-0.169327 6.18573 -0.169327 5.2121 0.507981 4.95811C2.92618 4.04268 4.04269 2.92618 4.95811 0.507981C5.2121 -0.169327 6.18573 -0.169327 6.43972 0.507981C7.35514 2.92618 8.47164 4.04268 10.8898 4.95811C11.5672 5.2121 11.5672 6.18573 10.8898 6.43972Z" fill="white"/></svg>') no-repeat center / contain; pointer-events: none;}
.visual_sect .i_ch::after{content: ''; position: absolute; left: 50%; bottom: 0.065em; width: 0.13em; height: 0.53em; transform: translateX(-50%); background: #fff; pointer-events: none;}

.visual_sect .cont .left_box .txt,
.visual_sect .cont .right_box .txt{font-size: var(--h5); font-weight: 700; overflow-y: hidden; }
.visual_sect .cont .right_box .txt {margin-right: 0.5em;}
.visual_sect .cont .left_box .txt span,
.visual_sect .cont .right_box .txt span,
.visual_sect .cont .subtit_box .txt span{display: inline-block; transform: translateY(100%); transition: transform 1s ease-in-out 0.8s;}


.visual_sect .cont .subtit_box{font-size: 9rem; font-weight: 300; line-height: 1.2;} 
.visual_sect .cont .subtit_box .txt{overflow-y: hidden;}
.visual_sect .cont .subtit_box .txt:nth-child(1) span{transition-delay: 1.2s;}
.visual_sect .cont .subtit_box .txt:nth-child(2) span{transition-delay: 1.4s;}

.visual_sect .cont .left_box{ top:20%; left: 18vw; margin-bottom: 5vw; z-index: 1;}
.visual_sect .cont .right_box{right: 6vw; bottom: 14vh; z-index: 3; text-align: right;}
.visual_sect .cont .subtit_box{left: 13vw; bottom: 10vh; z-index: 3;}
.visual_sect .cont .brain_box{width: 100%; height: 100%; z-index: 2; opacity: 0; transform: translateY(50px); transition: opacity 1s ease-in-out, transform 1s ease-in-out;}
.visual_sect .cont .brain_box .brain_video_box{position: absolute; left: 48%; top: 46%; width: 48%; transform: translate(-50%, -50%); object-fit: contain; z-index: 2;}
.visual_sect .cont .brain_box .brain_video_box .brain_video {object-fit: contain; width: 100%; position: relative; z-index: 3;}
.visual_sect .cont .brain_box .brain_video_box::after{content: ''; position: absolute; left: 45%; top: 50svh; top: 50%; width: 35.3vw; height: 25vw; transform: translate(-50%, -50%); background: radial-gradient(ellipse at 52% 50%, rgba(150, 172, 204, 0.55) 0%, rgba(102, 130, 169, 0.42) 34%, rgba(49, 67, 112, 0.22) 58%, rgba(5, 8, 54, 0) 76%); filter: blur(18px); opacity: 0.9; pointer-events: none; z-index: 1;}

.visual_sect .cont .brain_box.test1 .brain_video_box{left: 0%; top:0; width: 33.33%; transform: unset;}
.visual_sect .cont .brain_box.test2 .brain_video_box{left: 33%; top:0; width: 33.33%; transform: unset;}
.visual_sect .cont .brain_box.test3 .brain_video_box{right: 0%; top:0; width: 33.33%; transform: unset;}


.visual_sect .cont .scroll{position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 3; color:#fff; display: flex; flex-direction: column; align-items: center; z-index: 4; opacity: 0; transition: opacity 1s ease-in-out 1.2s;}
.visual_sect .cont .scroll .txt{font-weight: 700; font-size: var(--p4); margin-bottom: 0.8rem ;}
.visual_sect .scroll .line{ position: relative; width: 1px; height: 13rem;  background-color: rgba(255, 255, 255, 0.3); overflow: hidden;}
.visual_sect .scroll .line::after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; /* 움직이는 라인 */ transform: scaleY(0); transform-origin: top; animation: growLine 1.5s ease-in-out infinite;}

.visual_sect.active .cont .main_txt span .ch{transform: translateY(0); transition: transform 1s ease-in-out;}
.visual_sect.active .cont .main_txt span:nth-child(2) .ch{transition-delay: 0.2s;}
.visual_sect.active .cont .main_txt span:nth-child(3) .ch{transition-delay: 0.3s;}
.visual_sect.active .cont .main_txt span:nth-child(4) .ch{transition-delay: 0.4s;}
.visual_sect.active .cont .main_txt span:nth-child(5) .ch{transition-delay: 0.5s;}

.visual_sect.active .cont .left_box .txt span,
.visual_sect.active .cont .right_box .txt span,
.visual_sect.active .cont .subtit_box .txt span{transform: translateY(0);}

.visual_sect.active .cont .brain_box{opacity: 1;}

.visual_sect.active .cont .scroll{opacity: 1;}


/* 2번 contents */
.visual_sect .center_txt_box{position: relative; display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: 100%; z-index: 5; overflow: hidden;}
.visual_sect .center_txt_box .tit{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); letter-spacing: 10vw; white-space: nowrap; font-size: 38rem; opacity: 0; font-weight: 600; will-change: transform, opacity; transition: letter-spacing 0.8s ease-in-out;}
.visual_sect .center_txt_box .tit.active {letter-spacing: 0;}
.visual_sect .center_txt_box .tit .i_ch{vertical-align: bottom;}
.visual_sect .center_txt_box .fill_txt{ font-size: 8rem; font-weight: 700; line-height: 1.5; transform: translateY(120%); opacity: 0; }
.visual_sect .center_txt_box .fill_txt span {color: rgba(255,255,255,.2);background: linear-gradient(90deg, #fff 0%, #fff 100%);background-clip: text;-webkit-background-clip: text;background-size: 0% 100%;background-repeat: no-repeat;transition: background-size 1s linear;}

.visual_sect .center_txt_box .tit{line-height: 0.85;} /* i 때문에 .left_box 와 동일 line-height 값 */

.visual_sect .center_txt_box .fill_txt span.active {
    background-size: 100% 100%;
}

/* .visual_sect .center_txt_box .fill_txt span{display: inline; background: linear-gradient(to right, rgb(255,255,255) 50%, rgba(255,255,255,0.2) 50%); background-size: 200% 100%; background-position-x: 100%;color: transparent;background-clip: text;-webkit-background-clip: text; will-change:background-position; transition: 1s none} */



@keyframes growLine {
    0% {
        transform: scaleY(0);
        opacity: 1;
    }
    80% {
        transform: scaleY(1);
        opacity: 1;
    }
    100% {
        transform: scaleY(1);
        opacity: 0;
    }
}

/* Highlights */
.highlight_sect {padding: calc(var(--mainSectPd) - 10rem) 0; position: relative; color: #fff;}
.highlight_sect .bg{content: ''; position: absolute; inset: 0; background:linear-gradient(0deg, #000865 3.25%, #0B0D22 4.9%, #000865 94.2%); }  
.highlight_sect .slide{position: relative; width: calc(100% - 30rem); margin-left: 30rem; overflow: hidden;}
.highlight_sect .slide{display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 58%); justify-content: space-between; align-items: flex-start; gap: 0;}
.highlight_sect .slide .txt_slide{width: 100%; height: 100%; overflow: hidden;}
.highlight_sect .slide .txt_slide .item{}
.highlight_sect .slide .txt_slide .txt_box{padding-right: 3rem;}
.highlight_sect .slide .txt_slide .txt_box > *{opacity: 0; transform: translateY(10rem); transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;}
.highlight_sect.active .slide .txt_slide .txt_box > *{opacity: 1; transform: unset;}
.highlight_sect .slide .txt_slide .txt_box .tit{font-size: 8rem; font-weight: 700; line-height: 1.2;}
.highlight_sect .slide .txt_slide .txt_box .txt{font-size: var(--h7); line-height: 1.5; font-weight: 700; margin-top: 4rem; transition-delay: 0.3s;}
.highlight_sect .slide .txt_slide .txt_box .com_plus_btn{margin-top: 6rem; transition-delay: 0.6s;}

.highlight_sect .slide .img_slide{position: relative; width: 100%; max-width: 100%; overflow: hidden; cursor: grab; touch-action: pan-y;}
.highlight_sect .slide .img_slide:active{cursor: grabbing;}
.highlight_sect .slide .img_slide .slide_wrap{position: relative; display: block; width: 100%; height: auto; transform: none !important; transition: none !important;}
.highlight_sect .slide .img_slide .slide_wrap::before{content: ""; display: block; width: 100%; padding-top: 64%;}
.highlight_sect .slide .img_slide .item{position: absolute; inset: 0; width: 100% !important; height: 100%; opacity: 0 !important; z-index: 1 !important; pointer-events: none; transform: none !important; transition: none !important;}
.highlight_sect .slide .img_slide .item.is-current{opacity: 1 !important; z-index: 2 !important;}
.highlight_sect .slide .img_slide .item.is-enter{opacity: 1 !important; z-index: 3 !important;}
.highlight_sect .slide .img_slide .item.is-leave{opacity: 1 !important; z-index: 2 !important;}
.highlight_sect .slide .img_slide .item .img{position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; background: var(--bg); opacity: 0; transform: translateY(4rem); -webkit-clip-path: inset(0 0 0 100%); clip-path: inset(0 0 0 100%); transition: opacity 0.8s ease-in-out 0.3s, transform 0.8s ease-in-out 0.3s, -webkit-clip-path 1s cubic-bezier(0.76, 0, 0.24, 1), clip-path 1s cubic-bezier(0.76, 0, 0.24, 1); will-change: clip-path;}
.highlight_sect .slide .img_slide .item.is-current .img,
.highlight_sect .slide .img_slide .item.is-enter .img,
.highlight_sect .slide .img_slide .item.is-leave .img{-webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0);}
.highlight_sect.active .slide .img_slide .item .img{opacity: 1; transform: translateY(0);}
.highlight_sect .slide .img_slide .item .img > *{position: absolute; inset: 0; width: 100%; height:100%; object-fit: cover;}
/*페이징*/
.highlight_sect .slide .pagination{position: absolute; display: flex; left: 0; bottom: 0; gap: 0.8rem; z-index: 2;}
.highlight_sect .slide .pagination .swiper-pagination-bullet{display: block; position: relative; width: 10rem; height: 0.8rem; margin: 0 !important; padding: 0; border: 0; border-radius: 0; background: #EBEBEB; opacity: 1; overflow: hidden; cursor: pointer;}
.highlight_sect .slide .pagination .swiper-pagination-bullet .bar{display: block; width: 100%; height: 100%; background: var(--black); transform: scaleX(0); transform-origin: left center; transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);}
.highlight_sect .slide .pagination .swiper-pagination-bullet-active .bar{transform: scaleX(1);}

/* marquee */
.marquee_sect{padding: 8rem 0; background: linear-gradient(90deg, #1823A9 0%, #000759 100%); color: #fff; overflow: hidden; opacity: 0; transform: translateY(5rem); transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;}
.marquee_sect.active{opacity: 1; transform: unset;}
.marquee_sect .marquee_cont{display: flex; align-items: center; width: max-content; min-width: 100%; font-size: 8rem; line-height: 1;}
.marquee_sect .marquee_cont .marquee_track{display: flex; align-items: center; flex-shrink: 0; animation: marqueeFlow 80s linear infinite;}
.marquee_sect .marquee_cont .logo{height: 10.4rem;}
.marquee_sect .marquee_cont .logo img{height: 100%;}
.marquee_sect .marquee_cont .item{flex-shrink: 0; padding-right: 15rem;}

@keyframes marqueeFlow {
    from {transform: translateX(0);}
    to {transform: translateX(-100%);}
}


/* One Stop Solution */
.solution_sect{position: relative; display: flex; flex-direction: column; width: 100%; overflow: hidden; padding: calc(var(--mainSectPd) - 5rem) 0;} /* min-height: 100dvh; */
.solution_sect .main_tit_box{ text-align: center;}
.solution_sect .cont{display: flex; flex-direction: column; height: 100%; width: var(--mainIn); max-width: 100%; padding: 0 var(--inPd); margin: var(--mainContMt2) auto 0;}
/* 탭 */
.solution_sect .solution_tab_wrap{position: relative; z-index: 10; overflow-x: auto; margin-top: 0;}
.solution_sect .solution_tab_wrap::-webkit-scrollbar { display: none;}
.solution_sect .solution_tab_wrap .solution_tab_box{display: flex; justify-content: center; width: 100%;}
.solution_sect .solution_tab_wrap .tab{position: relative; display: inline-flex; flex: 1; justify-content: center; font-size: var(--h5); min-width: fit-content; padding: 2rem 0; white-space: nowrap; text-align: center; color: rgba(0,0,0,0.2); border-bottom: 3px solid rgba(0,0,0,0.2); font-weight: 700; transition: all 0.3s ease;}
.solution_sect .solution_tab_wrap .tab.active{color: var(--blue);}
.solution_sect .solution_tab_wrap .tab:before { content: ''; position: absolute; left: 50%; bottom: -3px; width: 0; border-bottom: 3px solid transparent; border-radius: 2em; transform: translateX(-50%); transition: width 0.5s; }
.solution_sect .solution_tab_wrap .tab.active:before { width: 100%; border-color: var(--blue); }


.solution_sect .tab_cont{position: relative; margin-top: 6rem;}
.solution_sect .tab_cont .swiper-container{overflow: visible;}
.solution_sect .tab_cont .item{position: relative; z-index: 2; transform: scale(0.8); transition: opacity 0.45s ease, transform 0.45s ease;}
.solution_sect .tab_cont .item.swiper-slide-active,
.solution_sect .tab_cont .item.swiper-slide-duplicate-active{opacity: 1; transform: scale(1);}

.solution_sect .tab_cont .item .slide_card{ width: 110rem; max-width: 100%; margin: 0 auto; display: block;}
.solution_sect .tab_cont .item .img_box{position: relative; width: 100%; padding-top: 68%; border-radius: 3rem; overflow: hidden; background: #ddd;}
.solution_sect .tab_cont .item .img_box img{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}

.solution_sect .tab_cont .item .txt_wrap{width: 100%; margin-top: 5rem; color: #101010; opacity: 0; transition: opacity 0.3s ease;}
.solution_sect .tab_cont .item.swiper-slide-active .txt_wrap{opacity: 1;}
.solution_sect .tab_cont .item .txt_box{display: flex; align-items: flex-start; }
.solution_sect .tab_cont .item .txt_box .tit{font-size: 4.5rem; font-weight: 700; line-height: 1;}
.solution_sect .tab_cont .item .txt_box .txt{font-size: var(--p1); margin-left: 5rem; line-height: 1.65;}
/* tag */
.solution_sect .tab_cont .item .tag_box{display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5rem;}
.solution_sect .tab_cont .item .tag_box .tag{font-size: var(--p4); padding: 0.625em 2em; background: var(--gray1); border-radius: 10rem; font-weight: 500;}
/* <> */
.swiper_btn{position: relative; top: 0; left: inherit; right: inherit; width: 8rem; height: 8rem; margin-top: 0; flex-shrink: 0; background-color: #F6F6F6; border-radius: 50%; transition: 0.3s ease; }
.swiper_btn::after{content: ''; position: absolute; top: 50%; left: 50%; width: 40%; height: 40%; transform: translate(-50%, -50%);  transition: 0.3s ease; background: url('data:image/svg+xml,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="0.5"><path d="M23.75 15H6.25" stroke="%23373847" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M15 6.25L6.25 15L15 23.75" stroke="%23373847" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></g></svg>') no-repeat center / contain;}

.swiper_btn:hover {background-color: var(--blue);}
.swiper_btn:hover:after{background: url('data:image/svg+xml,<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="1"><path d="M23.75 15H6.25" stroke="%23fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M15 6.25L6.25 15L15 23.75" stroke="%23fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></g></svg>') no-repeat center / contain;}

.swiper_btn.next:after{transform: translate(-50%, -50%) rotate(180deg);}

.solution_sect .swiper_btn{position: absolute; top: 34%; z-index: 5;}
.solution_sect .swiper_btn.prev{left: 9%;}
.solution_sect .swiper_btn.next{right: 9%;}

/* .solution_sect .slide_btn{position: absolute; top: 34%; z-index: 5; width: 8rem; height: 8rem; border: 0; border-radius: 50%; background: var(--gray1); transition: background 0.3s ease, transform 0.3s ease;}
.solution_sect .slide_btn::after{content: ''; position: absolute; top: 50%; left: 50%; width: 30%; height: 30%; transform: translate(-50%, -50%);  transition: 0.3s ease; background: url('data:image/svg+xml,<svg width="20" height="18" viewBox="0 0 20 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.0332 9.52344L7.50195 15.9922L8.49023 17.0254L10.5566 14.959L9.52344 13.9707L5.52539 9.92773L18.5527 9.92773H19.9902L19.9902 7.05273H18.5527L5.52539 7.05273L9.52344 3.05469L10.5566 2.02148L8.49023 0L7.50195 1.0332L1.0332 7.50195L0 8.49023L1.0332 9.52344Z" fill="%23969696"/></svg>') no-repeat center / contain;}
.solution_sect .slide_btn.next::after{transform: translate(-50%, -50%) rotate(180deg); }
.solution_sect .slide_btn:hover{background: var(--blue);}
.solution_sect .slide_btn:hover::after{filter: brightness(0) invert(1);} */




/* 제품 라인업 */
.lineup_sect{padding-top: 10rem; overflow: hidden;}
.lineup_sect .main_tit_box {text-align: center;}
.lineup_sect .main_tit_box .txt{font-weight: 500;}

.lineup_sect .slide{position: relative; width: 100%; margin-top: var(--mainContMt); color: #fff; opacity: 0; transform: translateY(5rem); transition: opacity 0.8s ease, transform 0.8s ease-in-out;}
.lineup_sect.active .slide {opacity: 1; transform: none; overflow: hidden;}
.lineup_sect .slide .swiper-container{padding: 0;}
.lineup_sect .slide .swiper-wrapper{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5rem; padding: 0 6.5rem; width: calc(100% - 6.5rem * 2);}
.lineup_sect .slide .item{width: 100%; border-radius: 4rem; overflow: hidden; opacity: 0; transition-property: transform, opacity, filter; transition-duration: 1.7s; transition-timing-function: cubic-bezier(0.45, 0, 0, 1);}
.lineup_sect .slide .item:nth-child(2) {transition-delay: 0.1s;}
.lineup_sect .slide .item:nth-child(3) {transition-delay: 0.2s;}
.lineup_sect .slide .item:nth-child(4) {transition-delay: 0.3s;}
.lineup_sect .slide .item{transform: translateX(150%); filter: blur(15px);}
.lineup_sect.active .slide .item{opacity: 1 !important; transform: none !important; filter: blur(0) !important;}

/* 4개이상 */ 
.lineup_sect.has_slide .slide{width: calc(100% + 6.5rem * 2); margin-left: calc(6.5rem * -1); padding: 0 6.5rem;}
.lineup_sect.has_slide .slide .swiper-container{padding: 0 6.5rem;}
.lineup_sect.has_slide .slide .swiper-wrapper{display: flex; gap: 0; padding: 0;}
.lineup_sect.has_slide .slide .item{width: auto;}
.lineup_sect.has_slide .slide .item:not(.swiper-slide-duplicate){transform: translateX(150%); filter: blur(15px);}
.lineup_sect.has_slide.active .slide .item.swiper-slide-duplicate-active {transition-delay: 0s;}
.lineup_sect.has_slide.active .slide .item.swiper-slide-next {transition-delay: 0.1s;}
.lineup_sect.has_slide.active .slide .item.swiper-slide-next + .swiper-slide {transition-delay: 0.2s;}
.lineup_sect.has_slide.active .slide .item.swiper-slide-next + .swiper-slide + .swiper-slide {transition-delay: 0.3s;}
.lineup_sect.has_slide.active .slide .item.swiper-slide-prev{opacity: 0 !important; transition-duration: 0.8s;}


.lineup_sect .slide .item .txt_wrap{position: absolute; display: flex; flex-direction: column; width: 100%; height: 100%; padding: 5rem 8rem; z-index: 2;}
.lineup_sect .slide .item .txt_wrap .top_box{position: relative; padding-bottom: 3rem; border-bottom: 1px solid rgba(255, 255, 255, 0.30);}
/* .lineup_sect .slide .item .txt_wrap .top_box:before{content: ''; position: absolute; bottom: 0; width: calc(100% + 7rem); left: -3.5rem; height: 1px; background-color: rgba(255, 255, 255, 0.50);} */
.lineup_sect .slide .item .bg{position: relative; padding-top: 125%;}
.lineup_sect .slide .item .bg:before{content: ''; position: absolute; inset: 0; width: 100%; height: 100%;background: linear-gradient(180deg, rgba(0, 0, 0, 0.16) 40%, rgba(5, 21, 216, 0.40) 100%); z-index: 1;}
.lineup_sect .slide .item .bg img{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}
.lineup_sect .slide .item .desc{font-size: var(--p4); font-weight: 400; margin-bottom: 1rem; line-height: 1.65;}
.lineup_sect .slide .item .tit{font-size: var(--h3); font-weight: 700; line-height: 1;}
.lineup_sect .slide .item .txt{font-size: var(--p1); margin-top: auto; }



/* 새로운 기준 */
.data_sect{padding-top: var(--mainSectPd);}
.data_sect .cont{margin-top: var(--mainContMt);}

.data_sect .data_grid{display: grid; grid-template-columns: minmax(0, 898fr) minmax(0, 297fr) minmax(0, 898fr) minmax(0, 587fr); grid-template-rows: repeat(2, minmax(21rem, auto)); gap: 4rem;}
.data_sect .data_card{position: relative; padding: 7rem 7rem 16rem 7rem; overflow: hidden;}
.data_sect .data_card:before{content: ''; position: absolute; inset: 0; border-radius: 1.8rem; background: #f6f8fb; width: 0; transition: width 0.8s ease-in-out;}
.data_sect.active .data_card:before{width: 100%;}
.data_sect .data_card:nth-child(1){grid-column: 1; grid-row: 1;}
.data_sect .data_card:nth-child(2){grid-column: 2 / span 2; grid-row: 1;}
.data_sect .data_card.tall{grid-column: 4; grid-row: 1 / span 2;}
.data_sect .data_card:nth-child(4){grid-column: 1 / span 2; grid-row: 2;}
.data_sect .data_card:nth-child(5){grid-column: 3; grid-row: 2;}
.data_sect .data_card .txt_box{position: relative; z-index: 2; max-width: 70%;}
.data_sect .data_card.tall .txt_box{max-width: 100%;}
.data_sect .data_card .num{font-size: 12rem; font-weight: 600; line-height: 1;}
.data_sect .data_card .desc{font-size: var(--p1); margin-top: 1rem; font-weight: 500; color: #222; word-break: keep-all;}
/* .data_sect .data_card .sub{margin-top: 0.6rem; font-size: 1.2rem; color: #444;} */
.data_sect .data_card .desc + .desc{margin-top: 0;}

.data_sect .data_card .img{position: absolute; right: 2rem; bottom: 1.6rem; z-index: 1; width: 25rem;}
/* .data_sect .data_card:nth-child(2) .img{width: 28.4rem;} */
.data_sect .data_card:nth-child(3) .img{width: 35rem;}
/* .data_sect .data_card:nth-child(4) .img{width: 22.6rem;}
.data_sect .data_card:nth-child(5) .img{width: 28.6rem;} */


.data_sect .data_card .txt_box,
.data_sect .data_card .img{opacity: 0; transition: 0.8s opacity 0.8s ease-in-out;}
.data_sect.active .data_card .txt_box,
.data_sect.active .data_card .img{opacity: 1;}



/* Global */
.global_sect{padding-top: var(--mainSectPd);}
.global_sect .global_cont{display: flex; justify-content: space-between; align-items: center;}
.global_sect .global_cont .txt_box{max-width: 31.5%;}
.global_sect .global_cont .txt_box > *{opacity: 0; transform: translateX(-5rem); transition: 0.8s ease-in-out;}
.global_sect.active .global_cont .txt_box > *{opacity: 1; transform: unset;}
.global_sect .global_cont .txt_box .txt{font-size: var(--h5); font-weight: 500; margin-bottom: 5rem;} 
.global_sect .global_cont .txt_box .tit{font-size: var(--h2); font-weight: 700; line-height: 1.5; transition-delay: 0.4s;}
.global_sect .global_cont .earth{width:102.4rem; max-width: 36.5%; padding: 1%; opacity: 0; transform: translateY(5rem); transition: 0.8s ease-in-out;}
.global_sect.active .global_cont .earth{opacity: 1; transform: unset;}
.global_sect .global_cont .earth .video{width: 100%; }
.global_sect .global_cont .earth .video video{width: 100%; }
.global_sect .global_cont .year{font-size: 12.5vw; width: 83.4rem; font-size: 40rem; color: var(--navy); line-height: 1; letter-spacing: -4rem; white-space: nowrap;}
.global_sect .global_cont .year .odometer{letter-spacing: 0;}
.global_sect .global_cont .year .odometer.odometer-auto-theme,
.global_sect .global_cont .year .odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer{vertical-align: bottom;}

.global_sect .partner_cont{margin-top: 5rem; padding-bottom: calc(var(--mainSectPd) - 10rem); overflow: hidden;}
.global_sect .partner_cont .fill_txt{text-align: center; font-size: 12rem; font-weight: 700; line-height: 1.5;}
.global_sect .partner_cont .fill_txt .txt{display: inline; background: linear-gradient(to right, rgb(0,0,0) 50%, rgba(0,0,0,0.1) 50%); background-size: 200% 100%; background-position-x: 100%;color: transparent;background-clip: text;-webkit-background-clip: text; will-change:background-position; transition: 1s none}

.global_sect .partner_cont .partner_logo_wrap{width: 100%; margin-top: 8rem; opacity: 0; transition: opacity 0.8s ease-in-out 0.4s;}
.global_sect .partner_cont.active .partner_logo_wrap{opacity: 1;}
.global_sect .partner_cont .logo_slide{display: flex; width: max-content; min-width: 100%;}
.global_sect .partner_cont .logo_slide + .logo_slide{margin-top: 5rem;}
.global_sect .partner_cont .logo_track{display: flex; align-items: center; flex-shrink: 0; animation: partnerLogoFlow 150s linear infinite;}
.global_sect .partner_cont .logo_slide.reverse .logo_track{animation-name: partnerLogoFlowReverse;}
.global_sect .partner_cont .logo{position: relative; flex-shrink: 0; width: 30rem; background-color: #fff; margin-right: 3rem; border-radius: 2rem; overflow: hidden; background: #fff;box-shadow: 0 0 30px 0 rgba(203, 203, 218, 0.50);}
.global_sect .partner_cont .logo a{position: relative; width: 100%; padding-top: 40%; display: flex;align-items: center; justify-content: center;}
.global_sect .partner_cont .logo img{position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover;}


@keyframes partnerLogoFlow {
    from {transform: translateX(0);}
    to {transform: translateX(-100%);}
}

@keyframes partnerLogoFlowReverse {
    from {transform: translateX(-100%);}
    to {transform: translateX(0);}
}

.global_sect .partner_cont .slide {display: flex; align-items: center; width: 181rem; max-width: 100%; margin: calc(var(--mainContMt) * 0.8) auto 0; opacity: 0; transform: translateY(5rem); transition: opacity 0.8s ease-in-out 0.4s, transform 0.8s ease-in-out 0.4s;}
.global_sect .partner_cont.active .slide{opacity: 1; transform: unset;}



/* Family site */
.family_sect{padding: 10rem 0; overflow: hidden; background-color: #F9F9FB;}
.family_sect .slide{margin-top: calc(var(--mainContMt) * 0.8); width: 105%; margin-left: -2.5%; opacity: 0; transform: translateY(5rem); transition: opacity 0.8s ease-in-out 0.8s, transform 0.8s ease-in-out 0.8s;}
.family_sect.active .slide{opacity: 1; transform: unset;}
.family_sect .slide .item a{display: flex; align-items: center; justify-content: space-between; background-color: #fff; padding: 5rem 5rem 5rem 8rem; border-radius: 100rem; position: relative; overflow: hidden;}
.family_sect .slide .item a .img{position: relative; width: 20rem; height: 20rem; flex-shrink: 0; margin-left: 1rem;}
.family_sect .slide .item a .img img{position: absolute; width: 100%; height: 100%; top:0; left:0;}
.family_sect .slide .item a::before {content: ''; position: absolute; inset: 0; background-color: rgba(5,21,216,0.7); backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px); z-index: 3; transition: 0.3s ease-in-out; opacity: 0; pointer-events: none;}
/* .family_sect .slide .item a::after {content: ''; position: absolute;left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 4; width: 6rem; height: 6rem; opacity: 0; filter: none; transition:  0.3s ease; filter: invert(1);
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.5 0C8.05228 2.41411e-08 8.5 0.447715 8.5 1V6.5H14C14.5523 6.5 15 6.94772 15 7.5C15 8.05228 14.5523 8.5 14 8.5H8.5V14C8.5 14.5523 8.05228 15 7.5 15C6.94772 15 6.5 14.5523 6.5 14V8.5H1C0.447715 8.5 0 8.05229 0 7.5C0 6.94772 0.447715 6.5 1 6.5H6.5V1C6.5 0.447715 6.94772 -2.41411e-08 7.5 0Z" fill="black"/></svg>') no-repeat center / contain; } */

.family_sect .slide .item a .link_btn {position:absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: 0; filter: invert(1); transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; z-index: 3; pointer-events: none; border: none; padding: 0; }
.family_sect .slide .item a .link_btn .txt {margin-top: 0;}


.family_sect .slide .item .tit{font-size: var(--h4); font-weight: 700; line-height: 1;}
.family_sect .slide .item .txt{font-size: var(--p3); line-height: 1.5; margin-top: 2rem; font-weight: 500;}


/* 미디어룸 */
.media_sect{padding: calc(var(--mainSectPd) - 10rem) 0;}
.media_sect .cont{margin-top: var(--mainContMt); opacity: 0; transform: translateY(5rem); transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;}
.media_sect.active .cont{opacity: 1; transform: unset;}

.media_sect .cont .media_list .item{border-bottom: 1px solid var(--line);}
.media_sect .cont .media_list .item a{display: flex; align-items: center; padding: 3.7rem 0; gap: 8rem;}
.media_sect .cont .media_list .item .badge{display: inline-flex; align-items: center; justify-content: center; text-align: center; font-size: var(--p3); font-weight: 700; padding: 0.3em 0.8em; background: var(--gray1); border-radius: 10rem; min-width: 15rem; flex-shrink: 0; transition: background 0.3s ease-in-out;}
.media_sect .cont .media_list .item .tit{font-size: var(--h7); font-weight: 700; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid transparent;}
.media_sect .cont .media_list .item .date{font-size: var(--p3); color: var(--gray); font-weight: 600; margin-left: auto; flex-shrink: 0;}










/* Hover event */
@media screen and (min-width: 1241px) {


.family_sect .slide .item a:hover::before {opacity: 1;}
.family_sect .slide .item a:hover .link_btn {opacity: 1;}

.media_sect .cont .media_list .item a:hover .tit{border-bottom: 1px solid var(--black); transition: 0.3s ease-in-out;}

.family_sect .slide .item a:hover::before {opacity: 1;}
.family_sect .slide .item a:hover::after {opacity: 1; transform: translate(-50%, -50%) rotate(180deg);}


}





/* 3000px 기준 메인 only */
@media screen and (min-width:2001px) {
    html {  font-size: clamp(8.5px, 0.3333vw, 10px);}
}

@media screen and (max-width: 2000px) and (min-width:1241px) {
    html { font-size: 6.5px;}
}
/* // 3000px 기준 메인 only */




/* 반응형 */
@media screen and (max-width: 2000px) {
    
    :root {
        --mainIn: max(168rem, 1240px);
        --mainTit: 45px;
        /* --mainPd: 6rem; */

    }



    .visual_sect .cont .main_txt{font-size: 15.2vw;}
    .visual_sect .cont .subtit_box{font-size: 2.35vw;}
    
    .visual_sect .scroll .line{height: 9rem;}


    .lineup_sect .slide .item .txt{font-size: var(--p3);}
    .lineup_sect .slide .item .txt_wrap{padding: 5rem;}
    .lineup_sect .slide .item .desc.sm_txt{font-size: var(--p6);}


    .data_sect .data_card{padding: 5rem 5rem 16rem 5rem;}
    .data_sect .data_card .desc{font-size: var(--p3);}

    .family_sect .slide{width: 120%; margin-left: -10%;}

    .lineup_sect .slide .item .desc {font-size: var(--p5);}
    .lineup_sect .slide .item .tit {font-size: var(--h5);} 
    .lineup_sect .slide .item .txt br {display: none;}
 
    .visual_sect .cont .brain_box .brain_video_box {width: 52%;}
    .highlight_sect .slide .txt_slide .txt_box .tit {font-size: var(--h2);}

    .marquee_sect{padding: 7rem 0;}
    .marquee_sect .marquee_cont{font-size:var(--h2); }
    .marquee_sect .marquee_cont .logo{height: 1.5em;}

    .global_sect .partner_cont .fill_txt {font-size: 70px;}
    .global_sect .global_cont .year {font-size: 32rem; letter-spacing: -0.1em;}


    .solution_sect .tab_cont .item .tag_box .tag {font-size: var(--p5);}
    .solution_sect .tab_cont .item .img_box {padding-top: 62%;}


    .solution_sect .solution_tab_wrap .solution_tab_box {width: 90%; margin: 0 auto;}



}


@media screen and (max-width: 1840px) {

    .global_sect .global_cont .txt_box .txt{font-size: var(--h7);}
    .global_sect .global_cont .txt_box .tit {font-size: var(--h3);}
    .global_sect .global_cont .txt_box .tit br {display: none;}

    
}




@media screen and (max-width: 1640px) {




    .visual_sect .scroll .line{height: 8rem;}
    .visual_sect .center_txt_box .fill_txt{font-size:7rem}
    .visual_sect .center_txt_box .tit{font-size: 32rem;}

    .highlight_sect .slide .txt_slide .txt_box .txt{font-size: var(--p1);}

    .marquee_sect .marquee_cont{font-size: var(--h3);}
    .marquee_sect{padding: 5rem 0;}

    .solution_sect .solution_tab_wrap .tab{font-size: var(--h6);}
    .solution_sect .tab_cont .item .txt_box .tit{font-size: var(--h4);}
    .solution_sect .tab_cont .item .txt_box .txt {font-size: var(--p2);}

    .solution_sect .tab_cont .item .slide_card{width: 160rem;}
    .data_sect .data_card .num{font-size: 10rem;}
    .solution_sect .swiper_btn.prev{left: 5%;}
    .solution_sect .swiper_btn.next{right: 5%;}

    .family_sect .slide { width: 140%;  margin-left: -20%;}
    .family_sect .slide .item .tit{font-size: var(--h5);}


}


@media screen and (max-width: 1440px) {

    :root {
        --mainPd:6.5rem;
        --mainSectPd: 25rem;
        --mainContMt: 8rem;
    }

    .visual_sect .cont .subtit_box{ bottom: 13vh; left: 9vw;}

    .highlight_sect .slide{margin-left: var(--mainPd); width: calc(100% - var(--mainPd));}

    .global_sect .partner_cont .partner_logo_wrap{margin-top: 6rem;}

    .global_sect .global_cont .txt_box .txt br{display: none;}
    .global_sect .global_cont .year{font-size:28rem;}
    .global_sect .global_cont .txt_box .txt{margin-bottom: 4rem;}

    .lineup_sect.has_slide .slide{width: calc(100% + var(--mainPd) * 2); margin-left: calc(var(--mainPd) * -1); padding: 0 var(--mainPd);}
    .lineup_sect.has_slide .slide .swiper-container{padding: 0 var(--mainPd);}

    .data_sect .data_grid{gap: 3rem; }
    .data_sect .data_card {padding: 4rem 4rem 13rem 4rem;}
    .data_sect .data_card .img{width: 22rem;}
    .data_sect .data_card:nth-child(3) .img{width: 30rem;}

    
}


@media screen and (max-width: 1240px) {

    :root {
        --mainTit: 42px;
        --mainPd: 20px;
    }

    .visual_sect .cont .left_box{ left: 15vw;}
    .visual_sect .cont .brain_box .brain_video_box{ width: 55%; }
    .visual_sect .cont .right_box{bottom: 16vh;}

    .visual_sect .cont .main_txt{font-size: 18vw;}
    .visual_sect .cont .subtit_box{font-size: 3.5vw; left: 6vw;}

    .solution_sect .cont{margin-top: 5rem;}
    .solution_sect .tab_cont .item .img_box{border-radius: 2rem;}

    .data_sect .data_grid{grid-template-columns: 1fr 1fr; grid-template-rows: auto;}
    .data_sect .data_card:nth-child(1),
    .data_sect .data_card:nth-child(2),
    .data_sect .data_card:nth-child(4),
    .data_sect .data_card:nth-child(5){grid-column: auto; grid-row: auto;}
    .data_sect .data_card.tall{grid-column: 1 / -1; grid-row: auto;}
    .data_sect .data_card .num { font-size: 8rem;}
    .data_sect .data_card:nth-child(3) .img{width: 25rem;}

    .global_sect .partner_cont .fill_txt {font-size: 50px;}


    .family_sect .slide .item a .link_btn {filter: none; position: absolute; left: 10rem; bottom: 5rem ; transform: unset; opacity: 1; margin-left: 0; padding: 0.9em 1.8em; margin-top: 1rem; background-color: var(--bg); color: var(--gray);  pointer-events: all; top: auto; border-radius: 10em;}
    .family_sect .slide .item a .link_btn .ico { background: url('data:image/svg+xml,<svg width="18" height="15" viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.7578 7.96875L10.7813 13.9844L10.1172 14.6484L8.78906 13.3203L9.45313 12.6562L13.8281 8.24219L0.9375 8.24219H0L0 6.36719H0.9375L13.8281 6.36719L9.45312 1.99219L8.78906 1.32812L10.1172 0L10.7812 0.664062L16.7578 6.64062L17.4219 7.30469L16.7578 7.96875Z" fill="%23a4a4a4"/></svg>') no-repeat center / contain;}

    .family_sect .slide .item a {padding: 5rem 5rem 12rem 10rem;}

}



@media screen and (max-width: 1024px) {


    .visual_sect .cont .left_box { top: 40%; transform: translateY(-85%); left: 12vw; margin-bottom: 0;}
    .visual_sect .cont .right_box{ top: 40%; transform: translateY(85%); bottom: unset;} 
    .visual_sect .cont .brain_box .brain_video_box{top: 40%; transform: translate(-50%, -50%); width: 60%; } 
    .visual_sect .cont .brain_box .brain_video_box::after{top: 65%;}

    .visual_sect .cont .subtit_box { bottom: 13vh; }
    .visual_sect .cont .left_box .txt,
    .visual_sect .cont .right_box .txt{font-size: var(--h6);}
    .visual_sect .center_txt_box .tit{font-size: 25rem;}
    .visual_sect .center_txt_box .fill_txt { font-size:5rem; }

    .highlight_sect .slide .txt_slide .txt_box .txt{font-size: var(--p2);}

    .marquee_sect { padding: 25px 0;}

    .global_sect .global_cont{display: flex; flex-wrap: wrap;}
    .global_sect .global_cont .txt_box{max-width: 100%;}
    .global_sect .global_cont .txt_box .txt br{display: block;}
    .global_sect .global_cont .earth{max-width: 100%; width: 55%; padding:0; }
    .global_sect .global_cont .year{width: 45%;}

    .media_sect .cont .media_list .item a{gap: 20px;}


}



@media screen and (max-width: 768px) {
    :root{
        --mainTit: 32px;
        --mainSectPd: 100px;
        --mainContMt: 40px;
        --mainPd: 15px;
    }


    .main_tit_box .txt{margin-top: 12px;}
    /* 이미지 + 텍스트 */
    .highlight_sect .slide .txt_slide .txt_box .com_plus_btn,
    .solution_sect .tab_cont .item .txt_wrap{margin-top: 25px;}


    .visual_sect{height: 450svh;}
    .visual_sect .cont .left_box { top: 38%; }
    .visual_sect .cont .right_box{ top: 38%; } 
    .visual_sect .cont .brain_box .brain_video_box{top: 38%;}

    .visual_sect .cont .main_txt{font-size: 20vw;}
    .visual_sect .center_txt_box .tit { font-size: 90px;}
    .visual_sect .center_txt_box .fill_txt { font-size: 28px;}

    .visual_sect .cont .scroll.hide{opacity: 0; transition:opacity 0.5s ease-in-out 0s}

    .highlight_sect {padding-bottom: var(--mainSectPd);}
    .highlight_sect .slide .pagination .swiper-pagination-bullet{height: 2px;}
    .highlight_sect .slide .txt_slide .txt_box{margin-right: 10px;}
    .highlight_sect .slide .txt_slide .txt_box .txt{margin-top: 15px;}
    .highlight_sect .slide .txt_slide .txt_box .txt br{display: none;}
    
    .marquee_sect { padding: 20px 0;}
    .marquee_sect .marquee_cont .item {padding-right: 50px;}

    .swiper_btn{width: 35px; height: 35px;}
    .solution_sect{padding: var(--mainSectPd) 0;}
    .solution_sect .solution_tab_wrap .tab{border-width: 2px;}
    /* .solution_sect .swiper_btn.prev {left: 5%;}
    .solution_sect .swiper_btn.next {right: 5%;} */

    .solution_sect .tab_cont .item .txt_box .tit{white-space: nowrap;}
    .solution_sect .tab_cont .item .tag_box{margin-top: 18px;}

    .lineup_sect{padding-top: 0;}
    .lineup_sect.has_slide.active .slide .item.swiper-slide-prev{opacity: 1 !important;}

    .data_sect .data_grid {  gap: 20px;}
    .data_sect .data_card { padding: 20px 20px 100px 20px; }
    .data_sect .data_card .num{font-size: 42px;}
    .data_sect .data_card .img{width: 110px;}
    .data_sect .data_card:nth-child(3) .img{width: 130px;}

    .global_sect .global_cont .txt_box .txt { margin-bottom: 15px;}
    .global_sect .global_cont .year{font-size: 120px;}
    .global_sect .partner_cont .partner_logo_wrap { margin-top: 25px;}

    .global_sect .partner_cont{padding-bottom: var(--mainSectPd);}
    .global_sect .partner_cont .fill_txt {font-size: 34px;}
    .global_sect .partner_cont .logo{width: 140px; border-radius: 5px; margin-right: 10px;}
    .global_sect .partner_cont .logo_slide + .logo_slide{margin-top: 20px;}

    .media_sect{padding:var(--mainSectPd) 0;}
    .media_sect .cont .media_list .item .badge{font-size: var(--p3);}
    .media_sect .cont .media_list .item .tit{font-size: var(--p1);}

    .family_sect .slide {width: 100%;margin-left: 0;}
    .family_sect .slide .item a{padding: 20px 20px 60px 45px;}
    .family_sect .slide .item a .link_btn {left: 45px;}

    .family_sect .slide .item a .link_btn {border-radius: 10em;padding: 0.6em 1.5em;font-size: var(--p5);}
    .family_sect .slide .item a .link_btn .txt {font-size: var(--p5);}



}



@media screen and (max-width: 600px) {

    :root{

        --mainTit: 26px;
        --mainSectPd: 80px;
        --mainContMt: 30px;
        
    }

    /* 이미지 + 텍스트 */
    .highlight_sect .slide .txt_slide,
    .highlight_sect .slide .txt_slide .txt_box .com_plus_btn,
    .solution_sect .tab_cont .item .txt_wrap {margin-top: 20px;}

    
    .lineup_sect .slide .item .txt,
    .data_sect .data_card .desc,
    .family_sect .slide .item .txt{font-size: 12px;}

    .visual_sect{height:350svh;}
    .visual_sect .cont .left_box{top: 38%; transform: translateY(-110%); left: 5vw; display: flex; flex-direction: column;}
    .visual_sect .cont .right_box{top: 38%; transform: translateY(110%);}
    .visual_sect .cont .brain_box .brain_video_box{top: 38%;}
    .visual_sect .cont .left_box .main_txt{order: 2;}
    .visual_sect .cont .left_box .txt{order: 1; margin-left: 10px;}
    .visual_sect .cont .left_box .txt, 
    .visual_sect .cont .right_box .txt{font-size: 14px;}
    .visual_sect .cont .brain_box {transform: translateY(30px); }
    .visual_sect .cont .brain_box .brain_video_box{width: 80%;}
    .visual_sect .cont .right_box .txt{margin-right: 0.2em; margin-top: 5px;}

    .visual_sect .center_txt_box .fill_txt{font-size: 20px; padding: var(--mainPd);}
    .visual_sect .center_txt_box .fill_txt span br{display: none;}
    .visual_sect .cont .subtit_box{bottom: 20vh; font-size: 22px; left: var(--mainPd);}
    .visual_sect .cont .scroll .txt{font-size: 10px;}
    .visual_sect .scroll .line{height: 30px;}

    .visual_sect .center_txt_box .tit{font-size: 70px;}

    .highlight_sect{padding-top: 0; }
    .highlight_sect .slide {width: 100%; grid-template-columns: 1fr; margin: 0; padding: 0 var(--mainPd);}
    .highlight_sect .slide .txt_slide{order:2;}
    .highlight_sect .slide .txt_slide .txt_box .txt{margin-top: 8px;}
    .highlight_sect .slide .pagination{left: var(--mainPd);}
    .com_plus_btn .btn{font-size: 11px; padding: 0.8em 1.2em;}
    .highlight_sect .slide .pagination .swiper-pagination-bullet{width: 40px; height: 2px;}
    .highlight_sect .slide .txt_slide .txt_box{padding-bottom: 40px;}

    .highlight_sect .slide .img_slide .item .img {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0;
    }

    .marquee_sect .marquee_cont{font-size: var(--h4);}
    .marquee_sect .marquee_cont .item {padding-right: 40px;}

    .solution_sect .tab_cont .item{transform: scale(0.9);}
    .solution_sect .tab_cont .item .txt_box{flex-direction: column; align-items: flex-start;}
    .solution_sect .tab_cont .item .txt_box .txt{margin-left: 0; margin-top: 8px;}
    .solution_sect .tab_cont .item .tag_box { margin-top: 15px;}
    .solution_sect .tab_cont .item .tag_box .tag{font-size: 11px; padding: 0.5em 1em;}
    .solution_sect .solution_tab_wrap .solution_tab_box{width: 100%;}
    .solution_sect .solution_tab_wrap .tab{font-size: 14px; border-width: 2px; padding: 10px 0;}
    .solution_sect .cont{margin-top: 20px; }
    .solution_sect .swiper_btn{display: none;}

    .lineup_sect .slide .item{border-radius: 15px;}
    .lineup_sect .slide .item .txt_wrap{padding: 25px;}

    .data_sect .data_grid { gap: 15px;}
    .data_sect .data_card { padding: 15px 15px 110px 15px;}
    .data_sect .data_card .img {width: 90px;}
    .data_sect .data_card:nth-child(3) .img { width: 100px;}
    .data_sect .data_card .txt_box{max-width: 90%;}
    .data_sect .data_card .num { font-size: 32px;}
    .data_sect .data_card .desc{ line-height: 1.6; margin-top: 4px;}

    .global_sect .global_cont .txt_box .txt {font-size: 15px;}
    .global_sect .global_cont .earth{width: 60%; max-width: 100%;}
    .global_sect .global_cont .year{width: 40%; font-size: min(17vw, 70px);}

    .global_sect .partner_cont .logo{width: 120px;}
    .global_sect .partner_cont .logo_slide + .logo_slide{margin-top: 15px;}
    .global_sect .partner_cont .fill_txt { font-size: 22px;}
    .global_sect .partner_cont .partner_logo_wrap{margin-top: 20px;}


    .family_sect .slide .item{height: auto;}
    .family_sect .slide .item a{padding: 25px 20px 35px; flex-direction: column; border-radius: 20px; height: 100%; align-items: flex-start; justify-content: flex-start;}
    .family_sect .slide .item a .img{ width: 100px; height: 100px; margin-left: auto; margin-top: 0; position: absolute; right: 10px; bottom: 10px;}
    .family_sect .slide .item a .link_btn {position: static; left: 20px; transform: unset; margin-top: 35px;}
    .family_sect .slide .item .txt{margin-top: 5px;}
    .family_sect .slide .item .txt_box {width: 100%;}
    

    

    .main_tit_box.flex_box{display: block;}
    .main_tit_box.flex_box .right_box{margin-top: 15px;}

    .media_sect .cont .media_list .item a{ flex-direction: column; align-items: flex-start; gap:0; padding: 15px 0;}
    .media_sect .cont .media_list .item .badge{font-size: 12px;}
    .media_sect .cont .media_list .item .tit{font-size: var(--p1); margin-top: 5px;}
    .media_sect .cont .media_list .item .badge{font-size: var(--p5); padding: 0.2em 1em; min-width: 0;}
    .media_sect .cont .media_list .item .date{margin-left: 0; font-size: 12px;}

    



}

@media screen and (max-width:350px) {
    .global_sect .global_cont .txt_box .tit br,
    .global_sect .global_cont .txt_box .txt br{display: none;}

}