#sub{background-color: #000;}
#sub .sub_con{padding: 200px 0;}
#sub .sub_visual {width: 100%;height: 100vh;position: relative;overflow: hidden;}
#sub .sub_visual2 {height: 528px;}
#sub .sub_visual .loc{position: absolute;bottom: 60px;left: 50%;transform: translateX(-50%);z-index: 15}
#sub .sub_visual .loc ul{display: flex;gap: 60px;padding: 0 75px;background-color: #0D0D0D;border-radius: 6px;}
#sub .sub_visual .loc ul li a{display: flex;height: 80px;align-items: center;;}
#sub .sub_visual .loc ul li a{color: #999999;font-size: 20px;    font-family: "neulis-sans", sans-serif;display: flex;position: relative;}
#sub .sub_visual .loc ul li.on a{color: #00FFB1;}
#sub .sub_visual .loc ul li.on a:after{content: '';display: block;width: 6px;height: 6px;background-color: #00FFB1;position: absolute;bottom: -3px;left: 50%;transform: translateX(-50%);;}
#sub .sub_visual .sub_vis{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
#sub .sub_visual .sub_vis img{display: block;transform: scale(1.1)}
#sub .sub_visual.on .sub_vis img{display: block;transform: scale(1);transition: 3s}
#sub .sub_visual .vis_text{position: relative;z-index: 15;width: 100%;height: 100%;align-items: center;justify-content: center;display: flex;flex-direction: column;}
#sub .sub_visual2 .vis_text{padding-top: 100px;}
#sub .sub_visual .vis_text span{display: block;    font-family: "neulis-sans", sans-serif;font-size: 20px;color: #00FFB1;font-weight: 700;}
#sub .sub_visual .vis_text strong{font-size: 54px;color: #FFFFFF;line-height: 74px;font-weight: 500;letter-spacing: -0.7px;margin-top: 20px;text-align: center;}
#sub .sub_visual .vis_text p{display: block;font-size: 26px;color: ;line-height: 42px;letter-spacing: -0.5px;color: #FFFFFF80;text-align: center;margin-top: 30px;}
#sub .s_title{text-align: center;margin-bottom: 70px;}
#sub .s_title span{display: block;font-family: "neulis-sans", sans-serif;font-size: 16px;color: #00FFB1;}
#sub .s_title strong{font-size: 40px;color: #FFFFFF;font-weight: 700;line-height: 1.5;margin-top: 30px;display: block;}
#sub .s_title p{margin-top: 40px;color: #999999;line-height: 1.5;font-size: 20px;}
#sub .s_title.s_title_left{text-align: left;}
#sub.contact .con01 ul{display: flex;gap: 40px}
#sub.contact .con01 ul li{width: calc(33.33% - 26.66666666666667px);background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);padding: 50px 0;text-align: center;border-radius: 8px;}
#sub.contact .con01 ul li .txt{display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 20px;text-align: center;margin-top: 30px;}
#sub.contact .con01 ul li strong{display: block;font-size: 24px;color: #00FFB1;line-height: 30px;;;}
#sub.contact .con01 ul li span{display: flex;height: 40px;padding: 0 25px;border: 1px solid #FFFFFF20;font-weight: 500;color: #FFFFFF;border-radius: 50px;;font-size: 16px;align-items: center;;}
#sub.contact .con01 ul li p{font-size: 18px;color: #999999;line-height: 27px;;}
#sub.contact .con01 .number{display: flex;justify-content: center;margin-top: 70px;}
#sub.contact .con01 .number div{display: flex;align-items: center;background-color: #00BE84;height: 140px;border-radius: 80px;padding: 0 75px;gap: 60px}
#sub.contact .con01 .number div span{display: block;font-size: 22px;color: #FFFFFF;font-weight: 600;}
#sub.contact .con01 .number div strong{font-size: 50px;color: #FFFFFF;font-weight: 700; font-family: "neulis-sans", sans-serif;}

#sub.careers .con01{margin-bottom: 200px;}
#sub.careers .con01 ul{display: flex;gap: 40px}
#sub.careers .con01 ul li{width: calc(33.33% - 26.66666666666667px);background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);padding: 50px 0;text-align: center;border-radius: 8px;}
#sub.careers .con01 ul li strong{font-size: 24px;color: #FFFFFF;display: block;text-align: center;margin-top: 40px;}
#sub.careers .con01 ul li p{font-size: 18px;color: #999999;line-height: 27px;;font-weight: 400;margin-top: 20px}
#sub.careers .con01 ul li img{display: block;margin: 0 auto;}
#sub.careers .con02 {margin-bottom: 200px;}
#sub.careers .con02 ul{display: flex;gap: 48px}
#sub.careers .con02 ul li{width: calc(33.33% - 32px);padding: 40px;background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);border-radius: 4px;position: relative;}
#sub.careers .con02 ul li span{display: block;font-family: "neulis-sans", sans-serif;font-size: 16px;color: #00FFB1;margin-bottom: 10px;}
#sub.careers .con02 ul li strong{display: block;font-size: 24px;color: #FFFFFF;font-weight: 600;}
#sub.careers .con02 ul li p{color: #999999;font-size: 18px;margin-top: 30px;}
#sub.careers .con02 ul li i svg{display: block;}
#sub.careers .con02 ul li i{position: absolute;right: 0;top: 50%;transform: translate(50%,-50%);}
#sub.careers .con02 ul li:last-child{border: 1px solid #00FFB1;background: none}
#sub.careers .con03 ul{flex-direction: column;display: flex;gap: 20px}
#sub.careers .con03 ul li{padding: 40px 50px;border-radius: 4px;background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);border: 1px solid #00FFB100;}
#sub.careers .con03 ul .title{display: flex;align-items: center;gap: 4px}
#sub.careers .con03 ul .title i{font-size: 20px;color: #00FFB1;font-weight: 600;font-size: 20px}
#sub.careers .con03 ul .title strong{color: #FFFFFF;font-weight: 600;font-size: 20px;}
#sub.careers .con03 ul .text{margin-top: 20px;padding-top: 20px;border-top: 1px solid #333333;display: none;}
#sub.careers .con03 ul .text p{font-size: 18px;color: #999999;line-height: 1.5;;}
#sub.careers .con03 ul li.on{background: linear-gradient(to top, #FFFFFF00,#FFFFFF00);border: 1px solid #00FFB1}
#sub .sub_con_cta{padding-bottom: 0;}
#sub .cta{padding: 300px 0;padding-top: 200px; position: relative;}
#sub .cta .bg_light{position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
#sub .cta .bg_light img{display: block;}
#sub .cta .inner{position: relative;z-index: 15;;}
#sub .cta .more_btn{margin-top: 80px;font-size: 17px;}
#sub .cta strong{font-size: 50px;color: #FFFFFF;line-height: 70px;display: block;text-align: center;;}
#sub.recruit .con01{margin-bottom: 465px;}
#sub.recruit .con01 .s_title{margin-bottom: 230px;}
#sub.recruit .con01 ul{display: flex;}
#sub.recruit .con01 ul li {text-align: center;flex: 1;position: relative;}
#sub.recruit .con01 ul li:after{content: '';display: block;width: 800px;height: 800px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);border-radius: 50%;border: 1px solid #333333;opacity: 0.4;}
#sub.recruit .con01 ul li i{display: block;width: 10px;height: 10px;background-color: #00FFB1;margin: 0 auto;margin-bottom: 30px;}
#sub.recruit .con01 ul li strong{font-size: 30px;color: #FFFFFF;line-height: 1.33;;}
#sub.recruit .con01 ul li p{font-size: 18px;color: #999999;line-height: 27px;margin-top: 30px;}
#sub.recruit .con02{margin-bottom: 200px;}
#sub.recruit .con02 ul li span{display: block;font-family: "neulis-sans", sans-serif;font-size: 16px;color: #00FFB1;margin-bottom: 14px;text-decoration: underline;}
#sub.recruit .con02 ul li strong{display: block;font-size: 24px;color: #FFFFFF;font-weight: 600;}
#sub.recruit .con02 ul{flex-wrap: wrap;display: flex;gap: 31px}
#sub.recruit .con02 ul li{width: calc(33.33% - 20.66666666666667px);padding: 45px;background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);border-radius: 4px;position: relative;}
#sub.recruit .con02 ul li p{color: #999999;font-size: 18px;margin-top: 20px;}
#sub.recruit .con03 img{width: 100%;}
#sub.recruit .con03 .mySwiper{overflow: visible;}

#sub.portfolio .list ul {display: flex;gap: 42px 36px;flex-wrap: wrap;}
#sub.portfolio .list ul li{width: calc(50% - 18px);}
#sub.portfolio .list ul li a{display: block;}
#sub.portfolio .list ul li a .img_w{overflow: hidden;border-radius: 4px;position: relative;}
#sub.portfolio .list ul li a .img_w .img{ aspect-ratio: 680 / 480;width: 100%;display: flex;align-items: center;justify-content: center;overflow: hidden}
#sub.portfolio .list ul li a .img_w .view{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);opacity: 0;transition: 0.5s;}
#sub.portfolio .list ul li a:hover .img_w .view{opacity: 1;}
#sub.portfolio .list ul li a .img_w .view:before{content: '';display: block;width: 90px;height: 90px;border-radius: 50%;background-color: #40BC96;position: absolute;top: 50%;left: 50%;margin-left: -45px;margin-top: -45px;transform: scale(1.5);opacity: 0;transition: 0.5s;}
#sub.portfolio .list ul li a:hover .img_w .view:before{opacity: 1;transform: scale(1);}
#sub.portfolio .list ul li a .img_w .view strong{display: block;position: relative;z-index: 15;font-size: 16px;color: #FFFFFF;font-family: "neulis-sans", sans-serif;}
#sub.portfolio .list ul li a .img_w .img img{filter: grayscale(100%);display: block;width: 100%;transition: 0.5s;}
#sub.portfolio .list ul li a:hover .img_w .img img{filter: grayscale(0%);transform: scale(1.05);}
#sub.portfolio .list ul li a .txt{display: flex;align-items: center;gap: 15px;margin-top: 20px;}
#sub.portfolio .list ul li a .txt strong{font-size: 22px;color: #FFFFFF;font-weight: 600;}
#sub.portfolio .list ul li a .txt i{overflow: hidden;position: relative;}
#sub.portfolio .list ul li a .txt i svg{width: auto;height: auto;display: block;}
#sub.portfolio .list ul li a .txt i svg:nth-child(1){position: absolute;top: 100%;left: -100%;}

#sub .sch_w{display: flex;justify-content: center;margin-bottom: 60px;}
#sub .sch_w div{position: relative;}
#sub .sch_w div button{width: 54px;height: 54px;position: absolute;right: 0;top: 0;}
#sub .sch_w div button svg{display: block;margin: 0 auto;}
#sub .sch_w input{width: 382px;height: 54px;border-radius: 6px;background-color: #101010;border: none;padding: 0 24px;font-size: 16px;color: #929292;;}

#sub .paging{margin-top: 80px;}
#sub .paging ul{display: flex;justify-content: center;gap: 10px}
#sub .paging ul li a{display: flex;width: 48px;height: 48px;align-items: center;justify-content: center;font-weight: 600;color: #949494;border-radius: 6px;}
#sub .paging ul li a svg{display: block;border-radius: 6px;}
#sub .paging ul li.on a{background-color: #141414;color: #fff;}


#port_pop{background: rgba(0,0,0,0.7);position: fixed;z-index: 999999;width: 100%;height: 100%;backdrop-filter: blur(20px);display: none}
#port_pop .pop_w{display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;}
#port_pop .pop_w .pop_in{background-color: #FFFFFF;padding: 20px;border-radius: 8px;position: relative;}
#port_pop .pop_w .pop_in .img img{display: block;max-width: 710px}
#port_pop .pop_w .pop_in .img{border-radius: 4px;overflow: hidden;;}
#port_pop .pop_w .pop_in button{right: -64px;top: 0;position: absolute;;}
/*#port_pop .pop_w .pop_in .txt{padding: 20px;padding-top: 40px;;}*/
/* #port_pop .pop_w .pop_in .txt strong{display: block;font-size: 26px;color: #000000;margin-bottom: 15px;} */
/* #port_pop .pop_w .pop_in .txt ul {display: flex;flex-direction: column;gap: 10px;} */
/* #port_pop .pop_w .pop_in .txt ul li{font-size: 18px;color: #5E5E5E;position: relative;padding-left: 11px;} */
#port_pop .pop_w .pop_in .txt ul li:before{content: '';display: block;width: 4px;height: 4px;position: absolute;left: 0;background-color: #5E5E5E;border-radius: 50%;top: 9px;}
#port_pop .pop_w .pop_in .txt{width: 100%}
#port_pop .pop_w .pop_in .txt .text_w{max-width: 80vw;max-height: 80vh;overflow-y: scroll;min-width: 300px}
#port_pop .pop_w .pop_in .txt .text_w img{max-width: 100%}

/*#port_pop .pop_w .pop_in .txt .text_w > div{width: 50%}*/
#port_pop .pop_w .pop_in .txt .text_w > div span{display: block;font-size: 20px;color: #383838;margin-bottom: 15px;font-weight: 600}
#port_pop .pop_w .pop_in .txt .text_w > div:nth-child(2){border-left: 1px solid #E2E2E2;padding-left: 20px}
#sub.kpi .con01{padding: 300px 0;position: relative;}
#sub.kpi .con01 .bg_txt{position: absolute;padding: 0 40px;}
#sub.kpi .con01 .bg_txt1{width: 100%;top: 0;display: flex;justify-content: space-between;}
#sub.kpi .con01 .bg_txt2{bottom: 0;right: 0;}
#sub.kpi .con01 .bg_txt3{left: 50%;top: 50%;transform: translate(-50%,-50%);}
#sub.kpi .con01 .bg_txt strong{font-size: 300px;font-weight: 700;font-family: "neulis-sans", sans-serif;color: #ffffff10;}
#sub.kpi .con01 .txt_wrap{position: relative;z-index: 15;text-align: center;display: flex;align-items: center;justify-content: center;gap: 70px}
#sub.kpi .con01 .txt_wrap span{display: block;font-size: 18px;color: #00FFB1;}
#sub.kpi .con01 .txt_wrap strong{font-size: 40px;color: #FFFFFF;line-height: 1.5;;margin-top: 40px;display: block;}
#sub.kpi .con02 ul {display: flex;gap: 30px;justify-content: center;}
#sub.kpi .con02 ul li{width: calc(25% - 15px);}
#sub.kpi .con02 .se_title{position: relative;margin-bottom: 70px;}
#sub.kpi .con02 .se_title:before{content: '';display: block;width: 100vw;height: 1px;background-color: #1A1A1A;top: 4px;left: 50%;transform: translateX(-50%);position: absolute;}
#sub.kpi .con02 .se_title i{display: block;width: 10px;height: 10px;position: relative;z-index: 15;background-color: #00FFB1;margin-bottom: 60px;}
#sub.kpi .con02 .se_title strong{font-size: 30px;color: #FFFFFF;;}
#sub.kpi .con02 ul li .wrap {background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);padding: 25px;padding-top: 45px;border-radius: 4px;position: relative;}
#sub.kpi .con02 ul li .wrap .tag{position: absolute;top: 0;transform: translate(-50%,-50%);left: 50%;}
#sub.kpi .con02 ul li .wrap .tag span{display: flex;height: 37px;border: 1px solid #00FFB1;border-radius: 50px;align-items: center;padding: 0 20px;font-size: 18px;color: #00FFB1;font-weight: 600;backdrop-filter: blur(20px);}
#sub.kpi .con02 ul li .wrap .div{border-radius: 4px;overflow: hidden}
#sub.kpi .con02 ul li .wrap img{width: 100%;display: block}
#sub.kpi .con02 ul li .wrap em{display: block;text-align: center;color: #FFFFFF;font-size: 16px;font-weight: 500;font-family: "neulis-sans", sans-serif;border-bottom: 1px solid #2E2E2E;padding-bottom: 15px;margin-bottom: 20px;}
#sub.kpi .con02 ul li .wrap .price{display: flex;justify-content: space-between;align-items: center;margin-bottom: 20px;}
#sub.kpi .con02 ul li .wrap .price p{font-size: 16px;color: #999999;;}
#sub.kpi .con02 ul li .wrap .price strong{font-size: 16px;color: #FFFFFF;font-weight: 500;}
#sub.kpi .con02 ul li .wrap .price strong b{font-size: 32px;color: #fff;font-family: "neulis-sans", sans-serif;}
#sub.kpi .con02 ul li .wrap .img{border-radius: 6px;overflow: hidden;;}
#sub.kpi .con02 ul li .wrap .img img{display: block;}
#sub.kpi .con02 .sec {margin-bottom: 100px;}
#sub.kpi .con02 .info_title{text-align: center;margin-bottom: 60px;}
#sub.kpi .con02 .info_title strong{display: block;font-size: 24px;color: #A1A1A1;font-weight: 500;margin-bottom: 10px;}
#sub.kpi .con02 .info_title p{color: #FFFFFF;font-weight: 600;font-size: 40px;margin-bottom: 40px;}
#sub.kpi .con02 .info_title p b{color: #00FFB1;}

#sub.kpi .con02 ul li:last-child .wrap .price strong b{color: #00FFB1;}
#sub.kpi .con02 ul li:last-child .wrap .price strong{color: #00FFB1;}
#sub.kpi .con02 ul li:last-child .wrap .price p{color: #00FFB1;}


#sub.kpi .con06 {margin-top: 160px}
#sub.kpi .con03 ul{display: flex;gap: 40px;flex-wrap: wrap;}
#sub.kpi .con03 ul li{width: calc(33.33% - 26.66666666666667px);background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);padding: 50px 0;text-align: center;border-radius: 8px;}
#sub.kpi .con03 ul li strong{font-size: 24px;color: #FFFFFF;display: block;text-align: center;margin-top: 40px;}
#sub.kpi .con03 ul li p{font-size: 18px;color: #999999;line-height: 27px;;font-weight: 400;margin-top: 20px;white-space: pre-wrap}
#sub.kpi .con03 ul li img{display: block;margin: 0 auto;}
#sub.kpi .con04{margin-top: 200px;}
#sub.kpi .con04 .info p{font-size: 26px;color: #FFFFFF;font-weight: 500;text-align: center;line-height: 42px;;;}
#sub.kpi .con04 .txt_wrap{text-align: center;position: relative;}
#sub.kpi .con04 .txt_wrap .s_title{display: flex;width: 100%;height: 100%;position: absolute;align-items: center;justify-content: center;z-index: 15;top: 0;left: 0;margin-bottom: 0;}
#sub.kpi .con04 .txt_wrap .s_title strong{margin-top: 0;}
#sub.kpi .con04 .txt_wrap .s_title strong b{font-weight: inherit;color: #00FFB1}
#sub.kpi .cont_line{display: flex;align-items: center;justify-content: center;position: relative}
#sub.kpi .cont_line svg{max-width: 100%;height: auto}
#sub.kpi .cont_line:before{content: '';display: block;width: 100vw;height: 1px;background: #fff;opacity: 0.1;position: absolute;left: 50%;transform: translateX(-50%);top: 50%}
#sub.kpi .cont_line:after{content: '';display: block;height: 100%;width: 1px;background: #fff;opacity: 0.1;position: absolute;left: 50%;top: 0;background: linear-gradient(to top, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,0))}

#sub.inquiry .form_list ul{display: flex;gap: 44px;flex-wrap: wrap;}
#sub.inquiry .form_list ul li{width: calc(50% - 22px);}
#sub.inquiry .form_list ul li:last-child{width: calc(100%);}
#sub.inquiry .form_list ul li input{width: 100%;display: block;height: 60px;background-color: #111111;border-radius: 4px;border: none;color: #fff;font-size: 18px;padding: 0 30px;letter-spacing: -0.5px}
#sub.inquiry .form_list ul li textarea{width: 100%;display: block;height: 240px;background-color: #111111;border-radius: 4px;border: none;color: #fff;font-size: 18px;padding: 30px;letter-spacing: -0.5px}
#sub.inquiry .form_list ul li input::placeholder{color: #999999;}
#sub.inquiry .form_list ul li span{color: #FFFFFF;font-size: 20px;font-weight: 600;display: block;margin-bottom: 30px;}
#sub.inquiry .form_list ul li span i{color: #00FFB1;}
#sub.inquiry .form_list .priv {margin-top: 40px;margin-bottom: 60px;}
#sub.inquiry .form_list .priv input{width: 0;height: 0;}
#sub.inquiry .form_list .priv label{display: flex;align-items: center;justify-content: center;font-size: 18px;color: #999999;}
#sub.inquiry .form_list .priv label b{color: #fff;}
#sub.inquiry .form_list .priv label:before{content: '';display: block;width: 20px;height: 20px;background: url(/img/sub/chk.png);margin-right: 12px;}
#sub.inquiry .form_list .priv input:checked + label:before{background: url(/img/sub/chk_on.png);}


#sub.kpi .service ul{display: flex;gap: 38px;flex-wrap: wrap;}
#sub.kpi .service ul li{width: calc(33.33% - 25.33333333333333px);background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);flex-wrap: wrap;padding: 40px;border-radius: 4px;}
#sub.kpi .service ul li strong{font-size: 26px;color: #FFFFFF;display: block;margin-bottom: 60px;;}
#sub.kpi .service ul li .tag{display: flex;flex-wrap: wrap;gap: 10px}
#sub.kpi .service ul li .tag span{display: flex;padding: 0 25px;height: 40px;border: 1px solid #ffffff20;border-radius: 50px;font-size: 16px;align-items: center;color: #FFFFFF;}
#sub.kpi .service ul li:last-child .tag{padding-right: 50px;}
#sub.kpi .why{margin-top: 160px;margin-bottom: 160px;}
#sub.kpi .why .list ul li{padding-top: 75px;padding-bottom: 80px;border-bottom: 1px solid #202020;position: relative;background: #000}
#sub.kpi .why .list ul li .title{width: 1400px;margin: 0 auto;position: relative;z-index: 15;position: relative;max-width: 100%}
#sub.kpi .why .list ul li .title:before{content: '';display: block;width: 10px;height: 10px;background: #00FFB1;top: -80.5px;position: absolute;left: 0}
#sub.kpi .why .list ul li:nth-child(2) .title{transform: translateX(25%);;}
#sub.kpi .why .list ul li:nth-child(3) .title{transform: translateX(50%);;}
#sub.kpi .why .list ul li:nth-child(4) .title{transform: translateX(65%);;}
#sub.kpi .why .list ul li .title strong{display: block;font-size: 30px;color: #FFFFFF;font-weight: 600;}
#sub.kpi .why .list ul li .title p{font-size: 20px;color: #e6e5e5;line-height: 32px;font-weight: 300;margin-top: 30px;word-break: keep-all}
#sub.kpi .why .list ul li .bg_txt{position: absolute;bottom: -70px;}
#sub.kpi .why .list ul li .bg_txt strong{display: block;font-size: 190px;color: #1A1A1A;    font-family: "neulis-sans", sans-serif;}
#sub.kpi .why .list ul li:nth-child(1) .bg_txt{left: 40px;}
#sub.kpi .why .list ul li:nth-child(2) .bg_txt{right: 40px;}
#sub.kpi .why .list ul li:nth-child(3) .bg_txt{left: 140px;}
#sub.kpi .why .list ul li:nth-child(4) .bg_txt{right: 140px;}
#sub.kpi .why .list ul li:nth-child(4){border-bottom: none;overflow: visible;;}

#sub .number_count ul{display: flex;gap: 30px;flex-wrap: wrap;}

#sub .number_count ul li{width: calc(33.33% - 20px);background: linear-gradient(to top, #FFFFFF00,#FFFFFF10);flex-wrap: wrap;padding: 60px 0;border-radius: 4px;backdrop-filter: blur(20px)}
#sub .number_count ul li .num{display: flex;justify-content: center;;}
#sub .number_count ul li .num span{display: block;font-size: 40px;color: #00FFB1;font-weight: 500; font-family: "neulis-sans", sans-serif;margin-bottom: 20px;border-bottom: 2px solid #00FFB1;line-height: 1;}
#sub .number_count ul li strong{display: block;font-size: 24px;color: #FFFFFF;font-weight: 600;letter-spacing: -0.5px;text-align: center;margin-bottom: 20px;}
#sub .number_count ul li p{font-size: 18px;color: #999999;line-height: 27px;text-align: center;;}
#sub.gre .number_count ul li strong{line-height: 40px;color: #BEBEBE;font-weight: 400}
#sub.gre .number_count ul li strong b{color: #fff}
#sub.kpi.contents .why{margin-bottom: 0;}
#sub.kpi .con06 .mySwiper{overflow: visible;}
#sub.kpi .con06 .mySwiper a{display: block;}
#sub.kpi .con06 .mySwiper a .img_w{overflow: hidden;border-radius: 4px;position: relative;}
#sub.kpi .con06 .mySwiper a .img_w .img{    aspect-ratio: 680 / 480;width: 100%;overflow: hidden;display: flex;align-items: center;justify-content: center}
#sub.kpi .con06 .mySwiper a .img_w .view{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);opacity: 0;transition: 0.5s;}
#sub.kpi .con06 .mySwiper a:hover .img_w .view{opacity: 1;}
#sub.kpi .con06 .mySwiper a .img_w .view:before{content: '';display: block;width: 90px;height: 90px;border-radius: 50%;background-color: #40BC96;position: absolute;top: 50%;left: 50%;margin-left: -45px;margin-top: -45px;transform: scale(1.5);opacity: 0;transition: 0.5s;}
#sub.kpi .con06 .mySwiper a:hover .img_w .view:before{opacity: 1;transform: scale(1);}
#sub.kpi .con06 .mySwiper a .img_w .view strong{display: block;position: relative;z-index: 15;font-size: 16px;color: #FFFFFF;font-family: "neulis-sans", sans-serif;}
#sub.kpi .con06 .mySwiper a .img_w .img img{filter: grayscale(100%);display: block;width: 100%;transition: 0.5s;}
#sub.kpi .con06 .mySwiper a:hover .img_w .img img{filter: grayscale(0%);transform: scale(1.05);}
#sub.kpi .con06 .mySwiper a .txt{display: flex;align-items: center;gap: 15px;margin-top: 20px;}
#sub.kpi .con06 .mySwiper a .txt strong{font-size: 22px;color: #FFFFFF;font-weight: 600;}
#sub.kpi .con06 .mySwiper a .txt i{overflow: hidden;position: relative;}
#sub.kpi .con06 .mySwiper a .txt i svg{width: auto;height: auto;display: block;}
#sub.kpi .con06 .mySwiper a .txt i svg:nth-child(1){position: absolute;top: 100%;left: -100%;}
#sub.kpi .service  {margin-bottom: 200px}

#sub .sub_visual .vis_text span{transform: translateY(70px);opacity: 0}
#sub .sub_visual.on .vis_text span{transform: translateY(0px);opacity: 1;transition: 1.2s;transition-delay: 0s}
#sub .sub_visual .vis_text strong{transform: translateY(70px);opacity: 0}
#sub .sub_visual.on .vis_text strong{transform: translateY(0px);opacity: 1;transition: 1.2s;transition-delay: 0.3s}
#sub .sub_visual .vis_text p{transform: translateY(70px);opacity: 0}
#sub .sub_visual.on .vis_text p{transform: translateY(0px);opacity: 1;transition: 1.2s;transition-delay: 0.6s}

#sub .mot{transform: translateY(70px);opacity: 0}
#sub .mot.on{transform: translateY(0px);opacity: 1;transition: 1.2s}
#sub .greeting {display: flex;justify-content: space-between;margin-top: 60px}
#sub .greeting .s_title p b{color: #fff}
#sub .greeting .right{padding-top: 30px}
#sub .greeting .right div{position: relative}
#sub .greeting .right div svg{display: block;position: absolute;right: -140px;bottom: -80px}
#sub .orz .orz svg{width: 100%;height: auto}
#sub .orz .orz .pc{display: block}
#sub .orz .orz .mo{display: none}
#sub .direction{margin-top: 200px;}
#sub .direction .s_title{display: flex;justify-content: space-between;align-items: flex-end}
#sub .direction .direct{width: 100%;height: 600px;overflow: hidden;border-radius: 4px}
#sub .direction .direct .root_daum_roughmap{width: 100%;height: 100%}
#sub .direction .direct .root_daum_roughmap .wrap_map{width: 100%;height: 100%}
#sub .history {display: flex;justify-content: space-between;margin-bottom: 160px;margin-top: 140px}
#sub .history .his_list{display: flex;flex-direction: column;gap: 120px;width: 700px;border-left: 1px solid #1A1A1A;padding-bottom: 130px;position: relative;top: 65px}
#sub .history .his_list > div{display: flex}
#sub .history .his_list > div strong{font-size: 26px;color: #FFFFFF;width: 170px;padding-left: 40px;position: relative}
#sub .history .his_list > div strong:before{content: '';display: block;width: 7px;height: 7px;position: absolute;left: -4px;background: #686868;top: 7px;}
#sub .history .his_list > div ul{display: flex;gap: 10px;flex-wrap: wrap;flex-direction: column}
#sub .history .his_list > div ul li{font-size: 18px;color: #999999;position: relative;padding-left: 11px;}
#sub .history .his_list > div ul li:before{content: '';display: block;width: 4px;height: 4px;position: absolute;left: 0;background: #999999;top: 7px}
#sub .number_count .wrap{padding-top: 150px;padding-bottom: 170px;position: relative}
#sub .number_count .wrap ul{position: relative;z-index: 15}
#sub .number_count .wrap .arr{position: relative;z-index: 15;text-align: center}
#sub .number_count .wrap .total{position: relative;z-index: 15;margin-top: 70px}
#sub .number_count .wrap .total strong{font-size: 40px;color: #FFFFFF;line-height: 1.5;text-align: center;display: block}
#sub .number_count .wrap .total strong b{color: #00FFB1;font-weight: inherit}
#sub .number_count .wrap .bg_txt{position: absolute}
#sub .number_count .wrap .bg_txt1{left: -220px;top: 0}
#sub .number_count .wrap .bg_txt2{right: -220px;bottom: 0}
#sub .number_count .wrap .bg_txt strong{font-size: 300px;font-weight: 700;font-family: "neulis-sans", sans-serif;color: #ffffff10;line-height: 1}
@media (max-width: 1300px) {
    #sub .greeting{gap: 25px}
    #sub .greeting p{word-break: keep-all}
    #sub .greeting p br{display: none}
    #sub.kpi .why .list ul li .title{padding: 0 20px}
    #sub.kpi .why .list ul li:nth-child(2) .title{transform: none}
    #sub.kpi .why .list ul li:nth-child(3) .title{transform: none}
    #sub.kpi .why .list ul li:nth-child(4) .title{transform: none}
    #sub.kpi .con03 ul li{padding: 20px}
    #sub.kpi .con03 ul li strong{font-size: 22px;word-break: keep-all;line-height: 1.}
    #sub .s_title strong{font-size: 30px;line-height: 1.5}
    #sub.kpi .con02 ul li .wrap img{width: 100%}
    #sub.kpi .con01 .txt_wrap strong{font-size: 30px;line-height: 1.5}
    #sub.kpi .con01 .bg_txt strong{font-size: 200px}
    #sub.kpi .con02 ul{flex-wrap: wrap;gap: 20px}
    #sub.kpi .con03 ul li p br{display: none;}
    #sub.kpi .con03 ul li p{word-break: keep-all;line-height: 1.5;font-size: 16px;white-space: normal}
    #sub.kpi .con02 ul li {width: calc(50% - 10px)}
    #sub .sub_visual .sub_vis img{height: 100vh}
    #sub .sub_visual .vis_text span{font-size: 16px}
    #sub .sub_visual .vis_text p{font-size: 20px;line-height: 1.5}
    #sub .sub_visual .vis_text strong{font-size: 40px;line-height: 1.5;word-break: keep-all}
    #sub.kpi .con04 .txt_wrap img{max-width: 100%}
    #sub.kpi .service ul li{padding: 20px}
    #sub.kpi .service ul li strong{font-size: 24px;margin-bottom: 40px}
    #sub .history{margin: 60px 0}
    #sub .history .his_list{top: 0;gap: 25px}
    #sub .cta .bg_light img{width: 460px}
}
@media (max-width: 980px) {
    #sub.kpi .why .list ul li .title:before{top: -52.5px;width: 6px;height: 6px}
    #port_pop .pop_w .pop_in{padding: 10px}
    #port_pop .pop_w .pop_in button svg{width: 30px;height: auto}
    #port_pop .pop_w .pop_in button{right: 0;top: -40px}
    #port_pop .pop_w .pop_in .txt{padding: 15px;padding-top: 20px;}
    #port_pop .pop_w .pop_in .txt .text_w > div span{font-size: 13px}
    #port_pop .pop_w .pop_in .txt strong{font-size: 20px}
    #port_pop .pop_w .pop_in{max-width: 80%}
    #port_pop .pop_w .pop_in img{width: 100%}
    #port_pop .pop_w .pop_in .txt ul li{font-size: 13px}
    #sub.gre .number_count ul li strong{font-size: 14px;}
    #sub .history .his_list{gap: 30px;padding: 0 20px;}
    #sub .history .his_list > div {flex-direction: column;gap: 10px}
    #sub .history .his_list > div strong:before{display: none}
    #sub .history .his_list > div strong{font-size: 14px;padding-left: 10px;width: 100px}
    #sub .history .his_list > div ul li{font-size: 14px;}
    #sub .number_count .wrap .total strong{font-size: 22px;line-height: 1.5}
    #sub .history{flex-direction: column}
    #sub .greeting{flex-direction: column;justify-content: center}
    #sub .number_count .wrap .arr svg{width: 70%;height: auto}
    #sub .number_count ul li .num span{font-size: 24px;}
    #sub.gre .number_count ul li strong{font-size: 18px;line-height: 1.5}
    #sub .number_count .wrap .bg_txt strong{font-size: 150px;}
    #sub.kpi .service ul{gap: 10px}
    #sub.kpi .service ul li{width: calc(50% - 5px)}
    #sub.kpi .service ul li .tag span {
    padding: 0 15px;
    height: 30px;
    border-radius: 50px;
        font-size: 13px;}
    #sub.kpi .service ul li strong{font-size: 20px;margin-bottom: 10px}
    #sub.kpi .con06 .mySwiper a .txt i svg{width: 10px}
    #sub.kpi .con06 .mySwiper a .txt strong{font-size: 16px}
    #sub .s_title p{font-size: 14px;line-height: 1.5;margin-top: 20px}
    #sub.recruit .con02 ul li{padding: 15px}
    #sub.recruit .con02 ul{gap: 10px}
    #sub.recruit .con02 ul li{width: calc(33.33% - 6.66px)}
    #sub.recruit .con01{margin-bottom: 160px}
    #sub.recruit .con01 ul li i{width: 4px;height: 4px;margin-bottom: 20px}
    #sub.recruit .con01 ul li strong{font-size: 20px;line-height: 1.5}
    #sub.recruit .con01 ul li:after{width: 400px;height: 400px;pointer-events: none}
    #sub.recruit .con01 ul li p{font-size: 14px;line-height: 1.5;margin-top: 10px}
    #sub.careers .con03 ul{gap: 10px}
    #sub.careers .con03 ul .text{margin-top: 7px;padding-top: 7px}
    #sub.careers .con03 ul .text p{font-size: 13px;}
    #sub.careers .con03{position: relative;z-index: 15}
    #sub.careers .con03 ul .title strong{font-size: 15px;}
    #sub.careers .con03 ul li{padding: 10px 20px}
    #sub.careers .con02 ul li{padding: 20px}
    #sub.careers .con01, #sub.careers .con02{margin-bottom: 60px}
    #sub .s_title{margin-bottom: 30px}
    #sub.careers .con02 ul li span{font-size: 12px}
    #sub.careers .con02 ul li strong{font-size: 20px}
    #sub.careers .con02 ul li p{font-size: 14px;margin-top: 10px}
    #sub.careers .con01 ul li,#sub.careers .con02 ul li{width: calc(100% - 6.66px)}
    #sub.careers .con01 ul, #sub.careers .con02 ul{gap: 10px}
    #sub.careers .con01 ul li{padding: 30px}
    #sub.careers .con01 ul li img{height: 100px}
    #sub.careers .con01 ul li strong{font-size: 16px;margin-top: 15px}
    #sub.careers .con01 ul li p{font-size: 14px;line-height: 1.5;margin-top: 15px}
    #sub.inquiry .form_list .priv{margin-top: 20px;margin-bottom: 20px}
    #sub.inquiry .form_list .priv label{font-size: 14px}
    #sub .sub_visual2{height: 400px}
    #sub .sub_con{padding: 80px 0}
    #sub.inquiry .form_list ul li textarea{padding: 10px;font-size: 14px;}
    #sub.inquiry .form_list ul{gap: 20px;}
    #sub.inquiry .form_list ul li span{font-size: 14px;margin-bottom: 10px}
    #sub.inquiry .form_list ul li input{height: 40px;padding: 0 10px;font-size: 13px}
    #sub.inquiry .form_list ul li{width: 100%}
    #sub .sub_visual .vis_text strong{font-size: 26px}
    #sub .sub_visual .vis_text p{font-size: 14px;line-height: 1.5;margin-top: 20px}
    #sub .sub_visual .vis_text span{font-size: 13px}
    #sub.kpi .con01 .txt_wrap span, #sub.recruit .con02 ul li span{font-size: 13px}
    #sub.recruit .con02 ul li strong{font-size: 18px;}
    #sub.kpi .con01 .txt_wrap strong{font-size: 20px;margin-top: 10px}
    #sub.kpi .con01 .bg_txt strong{font-size: 100px}
    #sub.recruit .con02 ul li p{font-size: 13px;line-height: 1.5;margin-top: 15px;word-break: keep-all}
    #sub.kpi .con01 .txt_wrap svg{width: 17px;}
    #sub.kpi .con01 .txt_wrap{gap: 30px}
    #sub.kpi .con01{padding: 100px 0}
    #sub .s_title span{font-size: 13px;}
    #sub .s_title strong{font-size: 24px;margin-top: 10px}
    #sub.kpi .con02 .info_title p{font-size: 26px;margin-bottom: 20px}
    #sub.kpi .con02 .se_title strong{font-size: 18px;}
    #sub.kpi .con02 ul li .wrap .tag span{width: 100px;font-size: 14px;text-align: center;height: 40px;justify-content: center;padding: 0}
    #sub.kpi .con02 .info_title strong{font-size: 16px}
    #sub.kpi .con02 ul li .wrap em{font-size: 13px;padding-bottom: 15px;margin-bottom: 15px}
    #sub.kpi .con02 ul li .wrap .price{margin-bottom: 10px}
    #sub.kpi .con02 ul li .wrap .price strong b{font-size: 22px}
    #sub.kpi .con02 ul li .wrap .price strong{font-size: 11px}
    #sub.kpi .con02 .info_title svg{width: 50px;height: auto}
    #sub.kpi .con02 .se_title{margin-bottom: 20px}
    #sub.kpi .con02 .sec{margin-bottom: 45px}
    #sub.kpi .con02 .sec:last-child{margin-bottom: 0}
    #sub.kpi .con03 ul{gap: 10px}
    #sub.kpi .con03 ul li strong{margin-top: 20px;font-size: 16px;}
    #sub.kpi .con03 ul li img {height: 100px}
    #sub.kpi .con04{margin-top: 60px}
    #sub.kpi .con03 ul li p{font-size: 13px}
    #sub.kpi .con03 ul li{width: calc(50% - 5px)}
    #sub.kpi .con02 ul li .wrap{padding: 10px ;padding-top: 30px}
    #sub.kpi .con02 ul li .wrap .price p{font-size: 13px}
    #sub.kpi .con04 .info p{font-size: 14px;line-height: 1.5}
    #sub .cta{padding: 65px 0}
    #sub .cta .bg_light img{max-width: 100vw}
    #sub .cta .more_btn{margin-top: 25px}
    #sub .cta strong{font-size: 24px;line-height: 1.5}
    #sub.kpi .con02 .se_title i{width: 4px;height: 4px;margin-bottom: 10px}
    #sub.recruit .con02{margin-bottom: 60px}
    #sub .sub_visual .loc ul{gap:30px;padding: 0 30px}
    #sub .sub_visual .loc ul li a{height: 50px;font-size: 13px;}
    #sub .sch_w input{width: 240px;font-size: 13px;height: 40px;}
    #sub .sch_w div button{width: 40px;height: 40px;}
    #sub.portfolio .list ul li a .txt strong{font-size: 13px}
        #sub.portfolio .list ul li a .txt i svg{width: 10px;height: auto}
    #sub .paging ul li a{width: 30px;height: 30px;font-size: 13px}
    #sub .paging{margin-top: 20px;}
    #sub.kpi .service{margin-bottom: 60px}
    #sub.kpi .why{margin-top: 60px}
    #sub.kpi .why .list ul li{padding: 50px 0}
    #sub.kpi .why .list ul li .title p{font-size: 14px;line-height: 1.5;margin-top: 15px;}
    #sub.kpi .why .list ul li .title strong{font-size: 17px;line-height: 1.5}
    #sub.kpi .why .list ul li .bg_txt strong{font-size: 80px;}
    #sub.kpi .why .list ul li:nth-child(3) .bg_txt{left: 20px}
    #sub.kpi .why .list ul li .bg_txt{bottom: -30px}
    #sub.kpi .why .list ul li:nth-child(4) .bg_txt{right: 20px}
    #sub .direction{margin-top: 60px}
    #sub .sub_con_cta{padding-bottom: 0}
    #sub.contact .con01 ul li p{font-size: 14px;line-height: 1.5}
    #sub .direction .direct{height: 300px}
    #sub.contact .con01 ul li span{height: 30px;font-size: 13px}
    #sub.contact .con01 ul li strong{font-size: 16px}
    #sub.contact .con01 ul li img{width: 70px}
    #sub.contact .con01 ul li .txt{gap: 5px}
    #sub.contact .con01 ul li .txt{margin-top: 10px}
    #sub.contact .con01 .number div strong{font-size: 30px;line-height: 1}
    #sub.contact .con01 .number div span{font-size: 13px;}
    #sub.contact .con01 .number div{border-radius: 15px}
    #sub.contact .con01 .number{margin-top: 15px}
    #sub.contact .con01 .number div{flex-direction: column;gap: 15px;height: auto;padding: 20px;}
    #sub .number_count ul li strong{font-size: 17px;margin-bottom: 10px}
    #sub .number_count ul li p{font-size: 14px;line-height: 1.5}
    #port_pop .pop_w .pop_in .txt ul li:before{top: 4px}
    #sub.kpi .con06 {margin-top: 60px}
    #port_pop .pop_w .pop_in .txt .text_w{max-width: 100%;min-width: 200px}
    #port_pop .pop_w .pop_in .txt .text_w{max-height: 60vh}
    #port_pop .pop_w .pop_in .txt{padding: 0}
    #sub.kpi .con04 .txt_wrap .s_title strong i{display: block}

}
@media (max-width: 660px) {
    #sub .orz .orz .pc{display: none}
#sub .orz .orz .mo{display: block;width: 100%}
    #sub.careers .con01 ul{flex-wrap: wrap}
    #sub.careers .con01 ul li{width: 100%}
    #sub.contact .con01 ul{flex-wrap: wrap;gap: 10px}
    #sub.contact .con01 ul li{width: 100%}
    #sub .direction .s_title{flex-direction: column;justify-content: flex-start;align-items: flex-start}
    #sub .number_count ul li .num span{font-size: 16px;margin-bottom: 10px}
    #sub .number_count ul li{width: 100%;padding: 20px 0}
    #sub .number_count ul{flex-direction: column;gap: 10px}
    #sub.kpi .service ul li strong{font-size: 16px}
    #sub.kpi .service ul li .tag{gap: 5px}
    #sub.recruit .con02 ul li{width: calc(50% - 5px)}
    #sub.portfolio .list ul li{width: 100%}
    #sub.kpi .con02 ul li, #sub.kpi .con03 ul li{width: 100%}
    #sub.recruit .con01 ul{flex-wrap: wrap}
    #sub.recruit .con01 ul li{width: 100%}
    #sub.kpi .why .list ul li .bg_txt strong{font-size: 60px}
    #sub.recruit .con01 ul{flex-direction: column;gap: 70px}
    #sub.gre .number_count ul li strong{font-size: 14px;margin-bottom: 0}
    #sub .number_count .wrap .arr{display: none}
    #sub .number_count .wrap{padding: 50px 0}
    #sub .number_count .wrap .bg_txt1{left: 0}
    #sub .number_count .wrap .bg_txt2{right: 0}
    #sub .number_count .wrap .total{margin-top: 30px;}
    #sub .greeting .right div img{width: 100%}
    #sub .number_count .wrap .total strong{font-size: 16px;line-height: 1.5}
    #sub .number_count .wrap .bg_txt strong{font-size: 70px}
    #sub.kpi .service ul li{width: 100%}
    #sub .greeting .right{padding-top: 0}
    #sub .s_title strong{word-break: keep-all}
    #sub .s_title strong i{display: block}
}

.click_li {
    cursor: pointer;
}