@charset "UTF-8";

/*-------------------------------------------------------------------
    공통
-------------------------------------------------------------------*/
#header .header_wrap{background-color: rgba(255, 255, 255, 0.15); backdrop-filter: blur(10px);border-bottom:0}
.v-play-1 #header .header_wrap,
.v-play-2 #header .header_wrap{background:rgba(255, 255, 255, 0.8)}
.hd_white #header .header_wrap{background-color: #fff;}
#header.on .header_wrap{background-color: #fff;border: none;}
.hd_white #header #logo >a,
#header.on #logo >a{filter: none;}
#header #nav #blind{width: 100%;border-top: none;}
.hd_white #header #nav #blind,
#header.on #nav #blind{border-top: 1px solid #EEE;}
.hd_white #header #nav #gnb >ul >li >div:before,
/* #header #nav #gnb >ul >li >div:before{display: none;} */
.hd_white #header .toputil_control a[data-icon="1"],
.hd_white #header .toputil_control a,
.hd_white #header .toputil_control a:hover
#header .toputil_control a[data-icon="1"],
#header.on .toputil_control a,
#header .toputil_control a:hover{filter: none;}

.v-play-1 #sec01 .inner .w .b,
.v-play-2 #sec01 .inner .w .b{background:rgba(255, 255, 255, 0.7)}
.v-play-1 #sec01 .inner .w .t strong{opacity:0}
.v-play-2 #sec01 .inner .w .t strong{color:#fff;-webkit-text-fill-color:#fff;}

.more{position:relative;padding-right:2rem;line-height:1.2;color:#151515;font-size:2rem;font-weight:600;transition:all .2s}
.more::before{content:"";position:absolute;right:0;top:.4rem;width:.8rem;height:1.6rem;background:url(../../../images/site/kor/main/icon_more_arrow.svg) center/contain no-repeat}
.more:hover{color:#0073B1;text-decoration:underline}
.more:hover::before{animation:more_move .7s linear infinite;background-image:url(../../../images/site/kor/main/icon_more_arrow_blue.svg)}
@keyframes more_move{
    0%{right:0}
    50%{right:.3rem}
    100%{right:0}
}

/*-------------------------------------------------------------------
    #popup
-------------------------------------------------------------------*/
#popup{visibility: hidden; opacity: 0; position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.70); backdrop-filter: blur(5px); transform: translateY(2rem); transition: transform 0.4s linear, opacity 0.4s linear;}
#popup.active{visibility: visible; opacity: 1; transform: translateY(0);}
#popup .in{display: flex; flex-direction: column; align-content: center; justify-content: center; align-items: center; gap: 2rem; width: 100%; max-width: calc(1094px + 4rem); height: 100%; margin: 0 auto; padding: 2rem;}
#popup .in{}
#popup .in .swiper{width: 100%;}
#popup .in .swiper.one-slide{width: 50%;}
#popup .in .swiper .swiper-wrapper{width: 100%; height: auto;}
#popup .in .swiper.one-slide .swiper-wrapper{justify-content: center}
#popup .in .swiper .swiper-wrapper .swiper-slide{overflow: hidden; height: auto; border-radius: 2rem; border: 1px solid rgba(255, 255, 255, 0.20); box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.10); box-sizing: border-box;}
#popup .in .swiper .swiper-wrapper .swiper-slide img{display: block; width: 100%; object-fit: cover;}
#popup .in .swiper .ctrl{display: none;}
#popup .in .btns{display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.8rem; width: 100%;}
#popup .in .swiper.one-slide + .btns{justify-content: center; }
#popup .in .btns a{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.6rem; padding: 1.2rem 1.4rem; font-size: 1.8rem; font-weight: 600; color: #333; background-color: #fff; border: 1px solid #fff; border-radius: 0.8rem; transition: all 0.2s linear;}
#popup .in .btns a:before{content: ""; display: block; width: 2rem; height: 2rem; background: url(../../../images/site/kor/main/pop_img03.svg) no-repeat center center / 100% auto;}
#popup .in .btns a.todays{background-color: rgb(13,17,21); border-color: rgb(13,17,21); color: #fff; font-weight: 500;}
#popup .in .btns a.todays:hover{background-color: rgba(0, 0, 0, 1);}
#popup .in .btns a.todays:before{filter: brightness(10000%);}

@media all and (max-width:1024px){
    #popup .in .swiper .swiper-wrapper .swiper-slide{border-radius: 1.5rem;}
}
@media all and (max-width:640px){
    #popup .in .swiper .swiper-wrapper .swiper-slide{border-radius: 1rem;}
}

/*-------------------------------------------------------------------
    #sec01
-------------------------------------------------------------------*/
#sec01{position: relative; height:92vh;}
/* #sec01::before{content:"";position:absolute;width:100%;height:100%;left:0;top:0;background: url(../../../images/site/kor/main/sec01_img01.jpg) no-repeat center center / cover;z-index:-1;animation:mVisual ease-in-out 2s alternate} */
#sec01 .visual_video{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1}
#sec01 .visual_video video{position:absolute;left:50%;top:50%;padding-top:3.8rem;transform:translate(-50%,-50%);width:100%;height:100%;object-fit:cover;object-position:center center;opacity: 0;transition:opacity 0.5s ease}
#sec01 .visual_video video.active{opacity:1;z-index:1}
@keyframes mVisual{
	0%{transform:scale(1.2)}
	100%{transform:scale(1)}
}
#sec01 .inner{display: block; width: 100%; height: 100%; max-width: calc(1600px + 4rem); margin: 0 auto; padding: 0 2rem;}
#sec01 .inner .w{position:relative;display: flex; flex-direction: column;justify-content: flex-start; align-items: flex-start; gap: 2rem; width: 100%; height: 100%; padding: 23.8rem 0 8rem;}
#sec01 .inner .w .t{position:absolute;left:0;top:28.5%}
#sec01 .inner .w .t strong{display: block;font-size:5.5rem; font-weight:700; line-height: 1.3;background:url(../../../images/site/kor/main/bg_gradation.jpg) lightgray 50% / cover no-repeat;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:'suit','Pretendard',sans-serif;letter-spacing:-.072rem;opacity:1;transition:all .2s}
#sec01 .inner .w .t strong i{font-size:3.7rem;font-weight:600;letter-spacing:-.062rem}
/* #sec01 .inner .w .t strong:before{content: ""; display: inline-block; width: 5rem; height: 5rem; margin-right:1rem; background: url(../../../images/site/kor/main/sec01_img02.svg) no-repeat center center / 100% auto;} */
#sec01 .inner .w .t strong span{display: block; color: #fff; font-weight:700;}
#sec01 .inner .w .t p{margin-top: 1.2rem; color: #151515; font-size: 2.4rem; font-weight: 400;}
#sec01 .inner .w .b{display: flex;justify-content: center; align-items: stretch;margin: auto auto 0;padding:2rem 0;background: rgba(255, 255, 255, 0.40);backdrop-filter: blur(15px);border-radius:2rem;transition:background .3s}
#sec01 .inner .w .b li{padding:0 6rem;}
#sec01 .inner .w .b li:not(:last-child){border-right: 1px solid rgba(255, 255, 255, 0.40);}
#sec01 .inner .w .b li strong{display: block; position: relative; padding-left: 3.2rem; color:#151515; font-size: 2.2rem; font-weight: 500; line-height: 1.2;}
#sec01 .inner .w .b li strong:before{content: ""; display: block; position: absolute; top: 0;left: 0; width: 2.4rem; height: 2.4rem; background-repeat: no-repeat; background-position: center center; background-size: 100% auto;}
#sec01 .inner .w .b li strong[data-icon="1"]:before{background-image: url(../../../images/site/kor/main/sec01_img03.svg);}
#sec01 .inner .w .b li strong[data-icon="2"]:before{background-image: url(../../../images/site/kor/main/sec01_img04.svg);}
#sec01 .inner .w .b li strong[data-icon="3"]:before{background-image: url(../../../images/site/kor/main/sec01_img05.svg);}
#sec01 .inner .w .b li div{position:relative;display:flex;align-items:flex-end;margin-top: 3.2rem; color:#151515; font-size: 2rem; font-weight: 500; line-height: 1;}
#sec01 .inner .w .b li div em{display: inline-block; position: relative;font-size: 8rem; font-family: 'poppins'; font-weight: 700; color:#101C5C; font-variant-numeric: tabular-nums;letter-spacing:1rem;text-align:center}
#sec01 .inner .w .b li:nth-child(1) div em{width:19.5rem}
#sec01 .inner .w .b li:nth-child(2) div em{width:13rem}
#sec01 .inner .w .b li:nth-child(3) div em{width:13rem}
#sec01 .chat{display: block; position: fixed; bottom:2rem; right: 2rem; width: 6rem; height: 6rem; background: #0073B1 url(../../../images/site/kor/main/icon_chatbot.png) no-repeat center center / 100% auto; border-radius: 50%; text-indent: -9999px; transition:background 0.2s linear;border:1px solid transparent;z-index:2}
#sec01 .chat:hover{background-color: #fff;border-color:#0073B1}
#sec01 .chat.on{bottom:9rem}
#sec01 .chat.bot{transition:all 0.1s linear}

/*-------------------------------------------------------------------
    #sec02
-------------------------------------------------------------------*/
#sec02{position: relative; height: 80rem; background-color: #000;}
/* #sec02:before{content: ""; display: block; position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 15rem; background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);} */
#sec02 .swiper_bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#sec02 .swiper_bg,
#sec02 .swiper_bg .swiper-wrapper{z-index:auto}
#sec02 .swiper_bg .swiper-wrapper .swiper-slide{overflow: hidden; position: relative; }
#sec02 .swiper_bg .swiper-wrapper .swiper-slide .inner{display: block; position: relative; width: 100%; max-width: calc(1600px + 4rem); height: 100%; margin: 0 auto; padding: 0 2rem;}
#sec02 .swiper_bg .swiper-wrapper .swiper-slide .inner strong{position:relative;display: block; margin-top: 12rem; font-size: 5.6rem; font-weight:700; line-height: 1.1; color: #fff;font-family:'suit', 'Pretendard', sans-serif;z-index:1}
#sec02 .swiper_bg .swiper-wrapper .swiper-slide .inner strong em{display: block; margin-top: 2rem; padding-left: 6rem; font-weight: 700;}
#sec02 .swiper_bg .swiper-wrapper .swiper-slide img{opacity: 0; position: absolute; top: 50%; left: 50%; width: 120%; height: 120%; object-fit: cover; object-position: center center; transform: translate(-50%,-50%); transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1);}
#sec02 .swiper_bg .swiper-wrapper .swiper-slide.swiper-slide-active img{opacity: 1; width: 101%; height: 101%;}
#sec02 .swiper_bg .controls{display: block;width:auto;position:absolute;top:14rem;left:50%;max-width:calc(1600px + 4rem);padding:0 2rem;width:100%;transform:translateX(-50%);z-index:1;pointer-events:none;}
#sec02 .swiper_bg .controls .paging{display: flex; justify-content: flex-end; align-items: flex-start; gap:0; position: relative; font-size: 0; font-family: 'Poppins';}
#sec02 .swiper_bg .controls .paging:before{content: ""; display: block; position: absolute; top: 50%; right:-3rem; width: 8.4rem; height: 1px; background-color: rgba(235, 235, 235, 0.40); transform: translate(-50%,-50%) rotate(-45deg);}
#sec02 .swiper_bg .controls .paging span{display: inline-block; min-width: 6rem; text-align: center; margin-top: 7.4rem; line-height: 1; font-size: 10rem; font-weight: 100; letter-spacing: 0.02rem; color: rgba(238, 238, 238, 0.6);}
#sec02 .swiper_bg .controls .paging span.swiper-pagination-current{margin-top: 0; color: #fff; font-weight: 400;}

#sec02 >.inner{display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-end; width: 100%; height: 100%; max-width: calc(1600px + 4rem); margin: 0 auto; padding: 6rem 2rem;}
#sec02 .s_wrap{position: relative; width: 100%; max-width: 746px; margin-right: 0;}
#sec02 .s_wrap .swiper_text{width: 100%; padding: 4rem; background-color: rgba(0, 0, 0, 0.50); border-radius: 1.2rem;}
#sec02 .s_wrap .swiper_text .swiper-wrapper{}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide{display: block;}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide >*{opacity:0; position: relative; transform: translateY(1rem);}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide strong{display: block; font-size: 4.2rem; font-weight: 500; color: #fff; line-height: 1.2;}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide em{display: block; margin-top: 1.2rem; color: rgba(255, 255, 255, 0.90); font-size: 2.6rem; line-height: 1.2; font-weight: 400;}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide p{display: block; margin-top: 1.2rem; color: rgba(255, 255, 255, 0.80); font-size: 1.8rem; font-weight: 300; }
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide.swiper-slide-active >*{opacity: 1; transform: translateY(0); transition-delay: 0.2s; transition: all 0.5s;}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide.swiper-slide-active em{transition-delay: 0.4s;}
#sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide.swiper-slide-active p{transition-delay: 0.6s;}
#sec02 .s_wrap .swiper_text .controls{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 5rem; margin-top: 3.2rem;}
#sec02 .s_wrap .swiper_text .controls .paging{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 0.6rem; width: 100%; flex: 1;}
#sec02 .s_wrap .swiper_text .controls .paging span{opacity: 1; display: block; width: 100%; max-width: 13rem; height: 4px; margin: 0; background-color: rgba(255, 255, 255, 0.30); border-radius: 2rem; transition: all 0.2s linear;}
#sec02 .s_wrap .swiper_text .controls .paging span.swiper-pagination-bullet-active{background-color: #fff;}
#sec02 .s_wrap .swiper_text .controls .btns{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1.6rem; margin-left: auto; }
#sec02 .s_wrap .swiper_text .controls .btns button{opacity: 1; display: block; width: 2.6rem; height: 2.6rem; background: url(../../../images/site/kor/main/sec02_img02.svg) no-repeat center center / 100% auto; text-indent: -9999px; transition: all 0.2s linear;}
#sec02 .s_wrap .swiper_text .controls .btns button.swiper-button-disabled{opacity: 0.5;}
#sec02 .s_wrap .swiper_text .controls .btns .prev{transform: rotate(180deg);}
#sec02 .s_wrap .drag{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.5rem; position: absolute; top: 0; right: 5.6rem; z-index: 1; width: 10rem; height: 10rem; color: #FFF; font-size: 1.4rem; font-weight: 400; letter-spacing: 0.14rem; text-transform: uppercase; background-color: rgba(255, 255, 255, 0.15); backdrop-filter: blur(10px); border-radius: 50%; transform: translateY(-2.5rem);}
#sec02 .s_wrap .drag:before{content: ""; display: block; width: 1.2rem; height: 1.2rem; background: url(../../../images/site/kor/main/sec02_img03.svg) no-repeat center center / 100% auto;}
#sec02 .s_wrap .drag:after{content: ""; display: block; width: 1.2rem; height: 1.2rem; background: url(../../../images/site/kor/main/sec02_img03.svg) no-repeat center center / 100% auto; transform: rotate(180deg);}

/*-------------------------------------------------------------------
    #sec03 #sec04 공통
-------------------------------------------------------------------*/
.sec_34{position: relative; padding-top: 12rem; padding-bottom: 14rem; background: linear-gradient(180deg, #E6F4FF 0%, #F5F7FC 100%);}
/* .sec_34:before{content: ""; display: block; position: absolute; top: 0; right: 0; width: 132.6rem; height: 36rem; background: url(../../../images/site/kor/main/sec03_img01.png) no-repeat right top / 100% auto;} */
.sec_34 .inner{position:relative;width: 100%; height: 100%; max-width: calc(1600px + 4rem); margin: 0 auto; padding: 0 2rem;z-index:1}
.sec_34 .inner .titles{display: block; margin-bottom:4rem; font-size: 5.6rem; font-weight: 700; color: #101C5C;line-height:1;font-family:'suit','Pretendard',sans-serif}
.sec_34 .inner .titles b{font-weight: 700;}

/*-------------------------------------------------------------------
    #sec03
-------------------------------------------------------------------*/
#sec03{}
.mo_tab_btn{display:none;position:relative;width:100%;height:5.5rem;margin-bottom:.8rem;padding:1.4rem 4.5rem 1.4rem 1.6rem;background:#0073B1;border-radius:1.2rem;font-size:1.8rem;font-weight:600;text-align:left}
.mo_tab_btn::before{content:"";position:absolute;right:1.6rem;top:50%;width:2.4rem;height:2.4rem;transform:translateY(-50%);background:url(../../../images/site/kor/main/icon_wArr.svg) center/contain no-repeat}
#sec03 .w{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2.8rem; position: relative;}
#sec03 .w .l{overflow: hidden; width: calc(100% - 2.8rem - 44rem); height: 56rem; border-radius: 2rem; box-shadow: -1.4rem 1.4rem 4rem 0 rgba(0, 78, 121, 0.30);}
#sec03 .w .l .swiper{width: 100%; height: 100%;}
#sec03 .w .l .swiper .swiper-wrapper{width: 100%; height: 100%;}
#sec03 .w .l .swiper .swiper-wrapper .swiper-slide{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-end; align-items: flex-start; position: relative; width: 100%; height: 100%; padding: 4.8rem 6rem; box-sizing: border-box;}
#sec03 .w .l .swiper .swiper-wrapper .swiper-slide a{display:block}
#sec03 .w .l .swiper .swiper-wrapper .swiper-slide img{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
#sec03 .w .l .swiper .swiper-wrapper .swiper-slide strong{position: relative; width: 100%; color: #FFF; font-size: 2.8rem; font-weight: 500;}
#sec03 .w .l .swiper .swiper-wrapper .swiper-slide p{position: relative; width: 100%; margin-top: 1.6rem; color: rgba(255, 255, 255, 0.80); font-size: 2rem; font-weight: 300;}

#sec03 .w .r{position: absolute; top: 0; right: 0; width: 44rem; height: 100%;}
#sec03 .w .r .controls{display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 1.6rem; width: 100%; height: 4rem;}
#sec03 .w .r .controls .paging{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; width: auto; font-size: 0;}
#sec03 .w .r .controls .paging span{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; font-size: 2rem; font-weight: 400; line-height: 1; letter-spacing: 0.04rem; color: rgba(21, 21, 21, 0.50);}
#sec03 .w .r .controls .paging span.swiper-pagination-current{color: #151515; font-weight: 600;}
#sec03 .w .r .controls .paging span.swiper-pagination-current:after{content: ""; display: block; width: 4px; height: 4px; margin: 0 0.8rem; background-color: rgba(21, 21, 21, 0.20); border-radius: 50%;}
#sec03 .w .r .controls .prev,
#sec03 .w .r .controls .next{display: block; width: 2rem; height: 2rem; background: url(../../../images/site/kor/main/sec03_img02.svg) no-repeat center center / 100% auto; text-indent: -9999px;cursor:pointer}
#sec03 .w .r .controls .next{transform: rotate(180deg);}
#sec03 .w .r .s_wrap{position: relative; width: 100%; height: calc(100% - 4rem);}
#sec03 .w .r .s_wrap .swiper{position:relative; width: 100%; height: auto !important; max-height: 100%; padding-right: 1.2rem;}
#sec03 .w .r .s_wrap .swiper::before{content:"";position:absolute;left:0;bottom:0;}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper{position: static; height: auto !important;}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide{position: static; height: auto !important;}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide button{display: block; position: relative; width: calc(100% - 2rem); margin-left: auto;padding: 1.6rem 2rem; color: #000; font-size: 2rem; font-weight: 500; border: 1px solid rgba(0, 115, 177, 0.10); background-color: #fff; border-radius: 0.8rem; box-shadow: 0 0 20px 0 rgba(0, 115, 177, 0); box-sizing: border-box; transition: all 0.2s linear;text-align:left}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a:before,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide button:before{content: ""; opacity: 1; display: block; position: absolute; top: 50%; right: 2rem; width: 1.8rem; height: 1.8rem; background: url(../../../images/site/kor/main/sec03_img03.svg) no-repeat center center / 100% auto; transform: translateY(-50%); transition: all 0.2s linear;}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a:hover,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide button:hover,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active a{width: 100%; padding: 1.6rem 4rem 1.6rem 2rem; color: #fff; box-shadow: 0 0 20px 0 rgba(0, 115, 177, 0.30); background-color: #0073B1;}
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a:hover:before,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide button:hover:before,
#sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active a:before{opacity: 1;}
#sec03 .w .r .s_wrap .scrollbar{display: block; position: absolute; top: 0; right: 0; width: 4px; height: 100%; background-color: #CFDBE5; border-radius: 0.8rem;}
#sec03 .w .r .s_wrap .scrollbar .swiper-scrollbar-drag{display: block; background-color: #0073B1; border-radius: 0.8rem;}

.gTech_wrap{position:relative}
.gTech_slide{position:relative;width:100vw;overflow:hidden}
.gTech_slide .swiper-wrapper{align-items:flex-end}
.gTech_slide .swiper-slide{display:inline-flex;align-items:flex-end;height:100%;width:35rem;height:44rem;}
.gTech_slide .swiper-slide a{display:block;width:100%;height:100%}
.gTech_slide .swiper-slide:not(.swiper-slide-active) a{height:calc(100% - 3rem)}
.gTech_slide .swiper-slide .item{display:flex;flex-direction:column;justify-content:flex-end;position:relative;width:100%;height:100%;background:#fff;border-radius:1.2rem;overflow:hidden}
.gTech_slide .swiper-slide .item .tit{flex:auto;display:flex;align-items:center;padding:3rem}
.gTech_slide .swiper-slide .item .tit strong{font-size:2.4rem;color:#101C5C;font-weight:700}
.gTech_slide .swiper-slide .item .thumb{position:relative;height:23rem;overflow:hidden;background:#000}
.gTech_slide .swiper-slide .item .thumb::after{content:"";opacity:0;position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(180deg, rgba(0, 0, 0, 0.14) 0%, rgba(0, 0, 0, 0.70) 100%);transition:all .2s}
.gTech_slide .swiper-slide .item .thumb img{width:100%;height:100%;object-fit:cover;object-position:center center;}
.gTech_slide .swiper-slide .item .desc{visibility:hidden;opacity:0;position:absolute;left:0;bottom:0;width:100%;padding:0 4rem 6rem;color:#fff;box-sizing:border-box}
.gTech_slide .swiper-slide .item .desc strong{font-size:3rem;}
.gTech_slide .swiper-slide .item .desc p{margin-top:1.6rem;font-size:1.8rem;font-weight:400;line-height:1.5;letter-spacing:-.018rem}
.gTech_slide .swiper-slide.swiper-slide-active{transition:width .3s .3s;}
.gTech_slide .swiper-slide.swiper-slide-active{width:74.6rem !important;}
.gTech_slide .swiper-slide.swiper-slide-active .item .tit{display:none}
.gTech_slide .swiper-slide.swiper-slide-active .item .thumb{height:100%}
.gTech_slide .swiper-slide.swiper-slide-active .item .thumb::after{opacity:1}
.gTech_slide .swiper-slide.swiper-slide-active .item .desc{visibility:visible;opacity:1}
.gTech_slide .swiper-slide.swiper-slide-prev{opacity:0}
.gTech_wrap .controls{display:flex;align-items:center;gap:1rem;position:absolute;right:0;top:-8rem;z-index:1}
.gTech_wrap .controls .btn{width:2.6rem;height:2.6rem;background:url(../../../images/site/kor/main/icon_globalS_arrow.svg) center / contain no-repeat;transition:background .2s}
.gTech_wrap .controls .btn.next{transform:rotate(180deg)}
.gTech_wrap .controls .btn:hover{background-image:url(../../../images/site/kor/main/icon_globalS_arrow_ov.svg)}

.gTech_slide .swiper-slide .item .desc strong,
.gTech_slide .swiper-slide .item .desc p{position:relative;display:block;opacity:0;transform:translateY(1rem)}
.gTech_slide .swiper-slide .item .desc p{width:66.6rem}
.gTech_slide .swiper-slide.swiper-slide-active .item .desc strong,
.gTech_slide .swiper-slide.swiper-slide-active .item .desc p{opacity:1;transform:translateY(0);transition:all .3s .1s}
.gTech_slide .swiper-slide.swiper-slide-active .item .desc p{transition-delay:.8s}

.controls .autoBtn{width:3rem;height:3rem;background-color:transparent;border-radius:.3rem;background-size:150% auto;background-position:center;background-repeat:no-repeat;border:1px solid transparent;transition:all .2s}
.controls .autoBtn.stop{background-image:url(../../../images/site/kor/main/icon_slide_pause.svg)}
.controls .autoBtn.play{display:none;background-image:url(../../../images/site/kor/main/icon_slide_play.svg)}
.controls .autoBtn.stop:hover{background-image:url(../../../images/site/kor/main/icon_slide_pause_ov.svg)}
.controls .autoBtn.play:hover{background-image:url(../../../images/site/kor/main/icon_slide_play_ov.svg)}

/*-------------------------------------------------------------------
    #sec04
-------------------------------------------------------------------*/
#sec04{margin-top: 14rem;}
#sec04 .titles{font-size:4.6rem}
#sec04 .w{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items:flex-start; gap: 6rem;}
#sec04 .w .l{position:relative;width: calc((100% - 6rem) * 0.77);}
#sec04 .w .l .more{position:absolute;right:0;top:-5.6rem}
#sec04 .w .l .l_slide{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 3rem;overflow:visible}
#sec04 .w .l .l_slide .swiper-wrapper{gap:3rem}
#sec04 .w .l .l_slide .swiper-slide{width: calc((100% - 6rem) / 3);}
#sec04 .w .l .l_slide .swiper-slide a{display: block; width: 100%; height: 100%; background-color: #fff; border-radius: 1.2rem; box-shadow: -1.4rem 1.4rem 3rem 0 rgba(0, 78, 121, 0.10);overflow:hidden}
#sec04 .w .l .l_slide .swiper-slide a .imgs{overflow: hidden; display: block; position: relative; width: 100%; aspect-ratio:359 / 255;}
#sec04 .w .l .l_slide .swiper-slide a .imgs img{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; transform: scale(1); transition: all 0.2s linear;}
#sec04 .w .l .l_slide .swiper-slide a:hover .imgs img{transform: scale(1.15);}
#sec04 .w .l .l_slide .swiper-slide a .desc{padding: 3rem;}
#sec04 .w .l .l_slide .swiper-slide a .desc strong{overflow: hidden; display: block; display: -webkit-box;height:6.7rem; word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; font-size: 2.4rem; font-weight: 700; line-height: 1.4; color: #151515;}
#sec04 .w .l .l_slide .swiper-slide a .desc p{overflow: hidden; display: block; display: -webkit-box;height:5.1rem; margin-top: 1.2rem; word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; font-size: 1.7rem; font-weight: 400; line-height: 1.5; color: #555;}
#sec04 .w .l .l_slide .swiper-slide a:hover .desc p{text-decoration: underline; text-underline-position: under;}
#sec04 .w .l .l_slide .swiper-slide a span{display: inline-flex; justify-content: flex-start; align-items: center; gap: 0.4rem 0.8rem; margin-top: 3.2rem; color: #151515; font-size: 1.7rem; font-weight: 500; line-height: 1.5; transition: all 0.2s linear;}
#sec04 .w .l .l_slide .swiper-slide a span i{display: inline-block; position: relative;top:.2rem; width: 1.4rem; height: 1.2rem; text-indent: -9999px; background: url(../../../images/site/kor/main/sec04_img01.svg) no-repeat right center / 100% auto; transition: all 0.2s ease;}
#sec04 .w .l .l_slide .swiper-slide a:hover span{color:#0073B1}
#sec04 .w .l .l_slide .swiper-slide a:hover span i{width: 2.4rem; background-image: url(../../../images/site/kor/main/sec04_img02.svg);}
#sec04 .w .r{position: relative; width: calc((100% - 6rem) * 0.23); min-height:32rem; padding:4rem 4rem 10rem; border-radius:2rem 0 2rem 2rem;background:url(../../../images/site/kor/main/sec04_img06.jpg) center / cover no-repeat}
#sec04 .w .r > img{width:19.3rem}
/* #sec04 .w .r:before{content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: calc(100% + 5rem); background: #8DCDFF url(../../../images/site/kor/main/sec04_img03.png) no-repeat center center / cover; border-radius: 0 4rem 4rem 4rem;} */
#sec04 .w .r:after{content: ""; display: block; position: absolute; bottom:2rem; right:2rem; width: 6rem; height: 6rem; background: #fff url(../../../images/site/kor/main/sec04_img04.svg) no-repeat center center / 100% auto; border-radius: 50%; transition: all 0.2s linear;}
#sec04 .w .r:hover:after{background-color: #101C5C; background-image: url(../../../images/site/kor/main/sec04_img05.svg); }
#sec04 .w .r >*{position: relative;}
#sec04 .w .r strong{display: block; color: #fff; font-size: 3rem; font-weight: 700; line-height: 1.2;}
#sec04 .w .r span{display: block; margin-top: 1.2rem; color: #0073B1; font-size: 2rem; font-weight: 400; line-height: 1.5;}
#sec04 .w .r p{margin-top:2rem; color: #fff; font-size: 1.8rem; font-weight: 400; line-height: 1.3; letter-spacing: -0.018rem;}

/*-------------------------------------------------------------------
    Responsive
-------------------------------------------------------------------*/
@media all and (max-width:1200px){
    #sec04 .w{gap:3rem}
    #sec04 .w .r{flex:auto;padding:3rem 2rem 9rem}
}
@media all and (max-width:1024px){
    #sec01 .inner .w{padding-bottom:4rem}
    #sec01 .inner .w .t strong{font-size:6rem}
    #sec01 .inner .w .t strong i{font-size:5rem}
    #sec01 .inner .w .b li{padding:0 3rem}
    #sec01 .inner .w .b li strong{font-size:2rem}
    #sec01 .inner .w .b li div{margin-top:2rem}
    #sec01 .inner .w .b li div em{font-size:7rem}
    #sec01 .inner .w .b li:nth-child(1) div em{width:17rem}
    #sec01 .inner .w .b li:nth-child(2) div em{width:12.5rem}
    #sec01 .inner .w .b li:nth-child(2) div em{width:12.5rem}

    #sec02{height:60rem}
    #sec02 >.inner{padding:6rem 2rem 0}
    #sec02 .swiper_bg .swiper-wrapper .swiper-slide .inner strong{margin-top:4.8rem;font-size:4rem}
    #sec02 .swiper_bg .swiper-wrapper .swiper-slide .inner strong em{margin-top:1rem;padding-left:3rem}
    #sec02 .swiper_bg .controls{top:4.8rem}
    #sec02 .swiper_bg .controls .paging span{font-size:6rem;min-width:4rem;margin-top:6rem}
    #sec02 .swiper_bg .controls .paging:before{right:-4.8rem;}
    #sec02 .s_wrap{max-width:64.7rem;margin-right:-2rem}
    #sec02 .s_wrap .drag{display:none}
    #sec02 .s_wrap .swiper_text{padding:4rem 2.5rem;border-radius:1.2rem 0 0}
    #sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide strong{font-size:3.2rem}
    #sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide em{font-size:2.4rem}
    #sec02 .s_wrap .swiper_text .swiper-wrapper .swiper-slide p{margin-top:.8rem;font-size:1.6rem}
    #sec02 .s_wrap .swiper_text .controls{margin-top:2.4rem}
    #sec02 .s_wrap .swiper_text .controls .paging span{max-width:inherit}

    .sec_34{padding:8rem 0 12rem}
    .sec_34 .inner .titles{font-size:3.2rem}
    .mo_tab_btn{display:block}
    #sec03 .w .r{width:100%}
    #sec03 .w .r .controls{position:absolute;right:0;top:-13.3rem;width:auto}
    #sec03 .w .r .controls .prev{transform:rotate(-90deg)}
    #sec03 .w .r .controls .next{transform:rotate(90deg)}
    #sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide{margin-bottom:0 !important}
    #sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a{width:100%;margin-bottom:0;padding:1rem 2rem;font-size:1.6rem;border-radius:0}
    #sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide a:hover, 
    #sec03 .w .r .s_wrap .swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active a{padding:1rem 4rem 1rem 2rem}
    
    .gTech_wrap .controls{top:-7rem;gap:1.5rem}
    .gTech_slide .swiper-slide .item .tit strong{font-size:2.6rem}

    #sec04 .titles{font-size:3.2rem}
    #sec04 .w{gap:4.8rem}
    #sec04 .w .l,
    #sec04 .w .r{width:100%}
    #sec04 .w .l .l_slide{overflow:visible}
    #sec04 .w .l .l_slide .swiper-wrapper{gap:0}
    #sec04 .w .l .l_slide .swiper-slide{width:calc((100% - 15px - 3rem) / 2)}
    #sec04 .w .l .l_slide .swiper-slide a .desc{padding:2.6667rem}
    #sec04 .w .l .l_slide .swiper-slide a span{margin-top:2.6667rem}
    #sec04 .w .r{min-height:inherit;padding:3rem 3rem 9rem}
    #sec04 .w .r:before{height:100%;border-radius:0 2.4rem 2.4rem;background:#8DCDFF url(../../../images/site/kor/main/sec04_img03_tablet.png) center bottom/cover no-repeat}
    #sec04 .w .r strong{display:inline-block;margin-right:1.6rem;font-size:2.8rem}
    #sec04 .w .r span{display:inline-block;font-size:1.8rem}
    #sec04 .w .r p{margin-top:2rem}
}

@media all and (max-width:768px){
    .gTech_slide .swiper-slide {width: 32rem;}
    .gTech_slide{width:100%}
    .gTech_slide .swiper-slide.swiper-slide-active,
    .gTech_slide .swiper-slide.swiper-slide-active .item{width:100% !important}
    .gTech_slide .swiper-slide a,
    .gTech_slide .swiper-slide:not(.swiper-slide-active) a{height:100%}

    .gTech_slide .swiper-slide .item .tit{display:none}
    .gTech_slide .swiper-slide .item .thumb{height:100%}
    .gTech_slide .swiper-slide .item .desc{visibility: visible;opacity: 1;}
    .gTech_slide .swiper-slide .item .desc p{width:auto}
    .gTech_slide .swiper-slide.swiper-slide-active .item .desc p{transition-delay:.4s}
}

@media all and (max-width:640px){
    #sec01{height:100vh}
    #sec01 .visual_video{height:calc(100% - 25.8rem)}
    /* #sec01 .visual_video video:nth-child(1) {position: relative;object-position: center 7rem;transform: none;left: 0;top: 0} */
    #sec01 .visual_video video:nth-child(3) {position: relative;object-position: right 7rem;transform: none;left: 0;top: 0}
    #sec01 .inner .w{padding:0}
    #sec01 .inner .w .t{position:absolute;left:0;top:auto;bottom:34rem;max-width:100%;padding:1rem;border-radius:1rem;background:rgba(255,255,255,.3);backdrop-filter:blur(3px);transition:all .3s}
    .v-play-1 #sec01 .inner .w .t{opacity:0}
    .v-play-2 #sec01 .inner .w .t{background:rgba(255,255,255,.7);}
    #sec01 .inner .w .t strong{font-size:4rem}
    #sec01 .inner .w .t strong:before{width:3.2rem;height:3.2rem}
    #sec01 .inner .w .t strong i{font-size:3.7rem}
    #sec01 .inner .w .t p{font-size:2.25rem}
    #sec01 .inner .w .b{flex-wrap:wrap;width:calc(100% + 4rem);margin-left:-2rem;padding:0;border-radius:0}
    #sec01 .inner .w .b li{display:flex;align-items:center;justify-content:space-between;width:100%;padding:2.4rem 2rem}
    #sec01 .inner .w .b li + li{border-top:1px solid rgba(255,255,255,.4)}
    #sec01 .inner .w .b li div{margin-top:0}
    #sec01 .inner .w .b li div em{margin-right:-.8rem;font-size:4rem;letter-spacing:.5rem;text-align:right}
    #sec01 .inner .w .b li:nth-child(1) div em,
    #sec01 .inner .w .b li:nth-child(2) div em,
    #sec01 .inner .w .b li:nth-child(3) div em{width:10rem}
    #sec01 .inner .w .b li div{flex-wrap:wrap;justify-content:flex-end;text-align:right}
    #sec01 .inner .w .b li div i{display:inline-block;width:100%;font-size:1.5rem}
    #sec01 .chat{margin-bottom:0}
    #sec01 .chat.on{bottom:8rem}

    #sec02 .s_wrap{max-width:inherit;width:calc(100% + 4rem)}
    #sec02 .swiper_bg .controls .paging span{min-width:3rem;margin-top:5rem;font-size:5rem}
    #sec02 .swiper_bg .controls .paging:before{width:7.4rem;right:-4.3rem}
    #sec02 .s_wrap .swiper_text{padding:4rem 2rem;border-radius:0}

    .sec_34{padding:6.4rem 0 8.8rem}
    .sec_34 .inner .titles{font-size:3rem;margin-bottom:3rem}

    .gTech_wrap .controls{top:-5.8rem}

    #sec04{margin-top:4.8rem}
    #sec04 .titles{font-size:3rem}
    #sec04 .w .l .more{font-size:1.875rem;font-weight:500}
    .more::before{top:.2rem}
    #sec04 .w .l .l_slide .swiper-slide{width:100%;max-width:28.5rem}
    #sec04 .w .l .l_slide .swiper-slide a .desc{padding:2.5rem 2rem}
    #sec04 .w .l .l_slide .swiper-slide a .desc strong{height:auto;font-size:2.125rem;-webkit-line-clamp:1}
    #sec04 .w .l .l_slide .swiper-slide a .desc p{height:auto;margin-top:1rem;-webkit-line-clamp:1}
    #sec04 .w .l .l_slide .swiper-slide a span{margin-top:2.5rem}
    #sec04 .w .r{padding:3rem 2rem 9rem}
    #sec04 .w .r span{display:block;}
    #sec04 .w .r:after{width:5rem;height:5rem;right:3rem;bottom:3rem}
}

@media all and (max-width:400px){
	#sec01 .inner .w .t strong{font-size:3rem}
	#sec01 .inner .w .t strong i{font-size:2.7rem}
	#popup .in .swiper.one-slide{width:100%}
}