@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	" board｜errors｜goods｜service｜layout/board｜layout/display｜layout/goods "
	" layout/popup.html "

	위 폴더 및 페이지 커스텀 및 layout, navigation, button, company 관련 편집 css 파일 입니다.

	** header, footer, main 관련은 /css/skin.css 에 있습니다.

───────────────────────────────────────────────────────────*/
/*───────────────────────────────────────────────────────────
	공통
───────────────────────────────────────────────────────────*/
    .sub_visual{position: relative;width: 100%;background: no-repeat center / cover;box-sizing: border-box; z-index: 9;}
    .sub_visual .thumb{position: absolute; width: 100%; height: 100%; overflow: hidden;}
    .sub_visual .thumb img{width: 100%; height: 100%; object-fit: cover; transform: scale(1.05); transition: all 5s;}
        .sub_visual.on .thumb img{transform: scale(1);}
    .sub_visual .w_custom{min-height: 620px; padding-block: 230px 50px; box-sizing: border-box; z-index: 3;}
    .sub_visual .txt_wrap{position: relative;font-size: var(--title-20);color: var(--point-white);box-sizing: border-box;display: flex;flex-direction: column;align-items: flex-start;gap: 19px;}
    .sub_visual .txt_wrap h2{font-size: 370%;font-weight: 600;line-height: 1.2;letter-spacing: -0.04em;}
    .sub_visual .txt_wrap h6{font-size: 110%;font-weight: 400;color: rgba(255,255,255,0.6);letter-spacing: 0.01em;}
    .sub_visual .nav_wrap{position: absolute; left:0; bottom:80px; display: flex; background: rgba(0,0,0,0.3); height: 56px;}
    .sub_visual .nav_wrap .home{display: flex; align-items: center; justify-content: center; aspect-ratio: 1 auto; height: 100%;}
    .sub_visual .nav_wrap .desc{position: relative;font-size: var(--title-20);color: var(--point-color01);width: 280px;}
        .sub_visual .nav_wrap .desc:before{position: absolute;content:'';width: 1px;height: 14px;background: rgba(255,255,255,0.3);top: 50%;left: 0;translate: 0 -50%;}
    .sub_visual .nav_wrap .desc dt{position: relative;width: 100%;font-size: 85%;font-weight: 500;padding-inline: 21px 50px;height: 100%;display: flex;align-items: center;box-sizing: border-box;cursor: pointer;}
    .sub_visual .nav_wrap .desc dt span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break: break-all;filter: var(--filter-white);}
    .sub_visual .nav_wrap .desc dt:before{position: absolute;content:'';width: 9px;height: 6px;background: var(--point-white);top:50%;right: 23px;translate: 0 -50%;clip-path: polygon(100% 0, 0 0, 50% 100%); transition: all 0.4s;}
        .sub_visual .nav_wrap .desc dt.on:before{transform: scale(-1,-1);}
    .sub_visual .nav_wrap .desc dd{position: absolute;top:100%;left:0;background: rgba(0,0,0,0.6);padding-block: 13px;width: 100%;box-sizing: border-box;font-size: 80%;font-weight: 500;opacity: 0;pointer-events: none;transition: all 0.4s;}
        .sub_visual .nav_wrap .desc:has(dt.on) dd{opacity: 1; pointer-events: all;}
    .sub_visual .nav_wrap .desc dd a{display: block;padding:8px 20px;filter: var(--filter-white);}
    .sub_visual .nav_wrap .desc dd a.on{filter: none;}

    .sub_title{position: relative; font-size: var(--title-20); box-sizing: border-box; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 50px;}
        .sub_title.hd{margin-block: 122px 81px;gap: 26px;}
        .sub_title.hd h2 + h6{margin-top: 6px;}
		.sub_title.hd h5{line-height:1.1;font-family: var(--font-type02);}
		.sub_title.hd h6{font-family: var(--font-type02);}
        .sub_title.hd_l{margin-bottom: 100px;}
        .sub_title.hd_m{margin-bottom: 79px;}
        .sub_title.hd_s{margin-bottom: 34px;}
        .sub_title.hd_xs{margin-bottom: 28px;}
        .sub_title.hd_xxs{margin-bottom: 18px;}
        .sub_title.line:before{display: block;content:'';width: 1px;height: 100px;background: var(--border-color01);margin-bottom: 10px;}
        .sub_title.left{align-items: flex-start; text-align: left;}
    .sub_title h2{font-size: 280%;font-weight: 700;color: var(--black-color01);line-height: 1.2;letter-spacing: -0.03em;}
    .sub_title h2 big{font-size: 107%;}
    .sub_title h2 small{font-size: 96.4%; line-height: 1.25;}
    .sub_title h3{font-size: 190%;font-weight: 700;color: var(--black-color01);line-height: 1.31;letter-spacing: -0.03em; font-family: var(--font-type02);}
        .sub_title h3.icon{font-weight: 500;}
        .sub_title h3.icon:before{width: 8px;height: 8px;translate: 0 -10px;}
    .sub_title h4{font-size: 150%;font-weight: 600;color: var(--black-color03);line-height: 1.53;letter-spacing: -0.03em; font-family: var(--font-type02);}
        .sub_title .icon{display: flex;align-items: baseline;gap: 16px;font-weight: 400;color: var(--black-color01);font-family: inherit;}
        .sub_title .icon:before{display: inline-flex;content:'';width: 6px;height: 6px;background: var(--point-color01);translate: 0 -8px;}
	.sub_title h4 + p{margin-top: -21px;}
    .sub_title h4 em{font-weight: inherit; color: var(--point-color02);}
    .sub_title h5{font-size: 110%;font-weight: 400;color: var(--black-color03);line-height: 1.53;letter-spacing: -0.03em;}
    .sub_title h5 em{font-weight: 600; color: var(--point-color02);}
    .sub_title h6{font-size: 100%;font-weight: 400;color: var(--black-color03);line-height: 1.8;letter-spacing: -0.03em;}
    .sub_title h6 em{font-weight: 500;color: var(--point-color02);letter-spacing: 0;}
    .sub_title p{font-size: 95%;font-weight: 400;color: var(--black-color05);line-height: 1.84;letter-spacing: -0.03em;font-family: var(--font-type02);}
    .sub_title .tag_list + h3{margin-top: -28px;}

    .tag_list{position: relative; font-size: var(--title-20); display: flex; flex-wrap: wrap; box-sizing: border-box;}
    .tag_list > li{font-size: 100%; font-weight: 500; color: var(--point-color02); box-sizing: border-box;}
    .tag_list > li:not(:last-child):after{display: inline-flex; content:''; width: 1px; height: 12px; background: var(--border-color01); margin-inline: 20px;}
    

    .sub_content{font-family: var(--font-type01);}
    .sub_content.mmgt{margin-top: -28px;}
    .sub_content.mmgt_m{margin-top: -21px;}

    .scrTop{position: fixed;right:30px;bottom: 30px;z-index: 9;background: var(--point-color01);width: 54px;aspect-ratio: auto 1; opacity: 0; pointer-events: none; transition: all 0.4s;}
        .scrTop:before{position: absolute;content:'';width: 14px;height: 14px;border: 2px solid var(--point-white);top: 60%;left: 50%;translate: -50% -50%;transform: rotate(45deg);clip-path: polygon(0 100%, 0 0, 100% 0);box-sizing: border-box;}
        body:has(#header.on) .scrTop{opacity: 1; pointer-events: all;}

    .btn_wrap{display: flex;flex-wrap: wrap;justify-content: center;gap: 15px;margin: 60px 0 0;padding: 0;font-size: var(--title-20);}
    .btn_wrap .icon_btn{display: inline-flex;align-items: center;justify-content: center;min-width: 220px;font-size: inherit;box-sizing: border-box;border:1px solid var(--point-color02);padding: 17px 25px;gap: 24px;transition: all 0.4s;}
    .btn_wrap .icon_btn span{font-size: 90%; font-weight: 500; color: var(--point-color02); box-sizing: border-box; transition: inherit;}
    .btn_wrap .icon_btn img{transition: inherit;}

        /* over */
            .btn_wrap .icon_btn:hover{background: var(--point-color02);}
            .btn_wrap .icon_btn:hover :where(img, span){filter: var(--filter-white);}

/*───────────────────────────────────────────────────────────
	company
───────────────────────────────────────────────────────────*/
    /* about.html */
        .wide_bnr{position: relative;width: calc(100% + 240px);margin-left: -120px;min-height: 460px;font-size: var(--title-20);padding: 70px;box-sizing: border-box;display: flex;align-items: center;justify-content: center; margin-bottom: 80px;}
        .wide_bnr .thumb{position: absolute; top:0; left:0; width: 100%; height: 100%;}
            
		.wide_bnr .thumb img{width:100%;height: 100%;object-fit: cover;}
        .wide_bnr .bg_txt{position: absolute;left: 50%;bottom: -15px;translate: -50%;font-size: 600%;font-weight: 500;color: var(--trans-color);-webkit-text-stroke: 1px rgba(255,255,255,0.3);line-height: 1;letter-spacing: -0.03em;}
        .wide_bnr .txt_wrap{position: relative;display: flex;flex-direction: column;gap: 22px;align-items: center;text-align: center;color: var(--point-white);z-index: 3;}
        .wide_bnr .txt_wrap h3{font-size: 250%;font-weight: 500;line-height: 1.2;letter-spacing: -0.03em;}
        .wide_bnr .txt_wrap h3 em{font-weight: inherit; color: var(--point-color01);}
        .wide_bnr .txt_wrap h6{font-size: 120%;font-weight: 300;line-height: 1.55;letter-spacing: -0.03em;}

        .wide_bnr.clip_box{margin-bottom: 99px;}
            .wide_bnr.clip_box .thumb{&:before, &:after{position: absolute; content:''; width: 120px; height: 120px; background: var(--point-white); left:0; bottom:0;}}
            .wide_bnr.clip_box .thumb:after{inset: auto; top:0; right:0;}

        .his_cont{max-width: 1300px;margin-inline: auto;padding-bottom: 80px;}
        .his_list{position: relative;background: url('../images/sub/his_bg.png') no-repeat left top;display: flex;}   
        .his_list > li{position: relative;width: calc(100% / 4 + 24px);box-sizing: border-box;}
        .his_list > li:not(:first-child){margin-left: -32px;}
        .his_list .circle{width: 100%; aspect-ratio: auto 1; text-align: center;}
        .his_list .info_desc{width: 100%;height: 100%;padding: 60px;padding-bottom: 65px;font-size: var(--title-20);box-sizing: border-box;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 6px;}
        .his_list .info_desc dt{font-size: 100%; font-weight: 500; color: var(--point-color05);}
            .his_list > li:nth-child(2) .info_desc dt{color: var(--point-color06);}
            .his_list > li:nth-child(3) .info_desc dt{color: var(--point-color02 );}
            .his_list > li:nth-child(4) .info_desc dt{color: var(--point-color07);}
        .his_list .info_desc dd{font-size: 180%;font-weight: 500;color:var(--black-color01);letter-spacing: -0.03em;}
        .his_exp{margin-top: 40px;display: flex;gap: 10px;}
        .his_exp > li{width: calc(100% / 4 - 7.5px);box-sizing: border-box;}
        
        .bullet_list{position: relative;font-size: var(--title-20);display: flex;flex-direction: column;align-items: flex-start;gap: 8px;box-sizing: border-box;}
        .bullet_list > li{font-size: 90%;font-weight: 400;color: var(--black-color03);line-height: 1.55;font-family: var(--font-type02);display: flex;align-items: baseline;gap: 8px;}
            .bullet_list > li:before{display: inline-flex;content:'';width: 4px;height: 4px;background: var(--black-color08);translate: 0 -3px;flex-shrink: 0;}

            .bullet_list .arw{font-family:math, sans-serif;}

        .sub_content .main_sol{padding-top: 0;}
        .sub_content .main_sol .cont_list{padding-top: 0;gap: 140px;}
		.sub_content .main_sol .cont_list .thumb{height:460px;}
        .sub_content .main_sol .cont_list .thumb span{width: calc(100% + 120px);margin-left: -120px;}
        .sub_content .main_sol .cont_list .main_title{gap: 9px;}
        .sub_content .main_sol .cont_list .main_title h4{font-size: 190%;width: 100%;font-family: var(--font-type02);font-weight: 600;}
            .sub_content .main_sol .cont_list .main_title h4:before{font-family: var(--font-type01);}
            .sub_content:not(.talent) .main_sol .cont_list .main_title h4:before{bottom: 27px;right: 35px;font-family: var(--font-type01);}
        .sub_content .main_sol .cont_list .main_title h6 em{font-family: inherit;font-weight: 500;}


        .organ_wrap .chart_list{position: relative; display: flex; justify-content: center; gap: 240px;}
        .organ_wrap .chart_list > li{position: relative;width: calc(100% / 3 - 160px);box-sizing: border-box;text-align: center;font-size: var(--title-20);font-weight: 400;color: var(--black-color03);}
        .organ_wrap .chart_list .desc{position: relative;font-size: var(--title-20);color: var(--point-white);background: var(--point-color08);box-shadow: var(--shadow-02), 0 0 0 20px rgba(5, 37, 86, 0.1);padding: 20px 30px;box-sizing: border-box;width: calc(100% - 20px);min-height: 170px;margin-inline: auto;display: flex;flex-direction: column;justify-content: center;box-sizing: border-box;}
        .organ_wrap .chart_list .desc dt{font-size: 180%; font-weight: 500;}
        .organ_wrap .chart_list .desc dt + dd{margin-top: 16px;padding-top: 19px;border-top: 1px solid rgba(255,255,255,0.2);}
        .organ_wrap .chart_list .desc dd{font-size: inherit;font-weight: 300;color: rgba(255,255,255,0.8);}

        .organ_wrap .chart_list:not(:first-child){padding-top: 180px;}
        .organ_wrap .chart_list:nth-child(2) .desc{background: var(--point-color02);width: 100%;box-shadow: none;}
		.organ_wrap .chart_list:nth-child(2) .desc dt{font-size:150%;}

        .organ_wrap .chart_list .element_item{position: relative; padding-top: 60px; display: flex; flex-direction: column; gap: 10px;}
        .organ_wrap .chart_list .element_item > li{background: var(--point-color03);}
        .organ_wrap .chart_list .element_item > li:not(:has(.desc)){display: flex;align-items: center;justify-content: center;padding: 20px;}
        .organ_wrap .chart_list .element_item .desc{background: var(--point-white);border: 1px solid var(--point-color09);min-height: 150px;}
        .organ_wrap .chart_list .element_item .desc dt{font-size: 120%;color: var(--point-color09);}
        .organ_wrap .chart_list .element_item .desc dt + dd{border-top-color: var(--border-color01);}
        .organ_wrap .chart_list .element_item .desc dd{font-size: 90%;font-weight: 400;color: var(--black-color08);}


            .organ_wrap .chart_list:not(:first-child):before{position: absolute; content:''; width: 1px; height: 160px; background: var(--border-color01); top:20px; left:50%;}
            .organ_wrap .chart_list:not(:first-child) > li:before{position: absolute; content:''; width: 1px; height: 80px; bottom:100%; left:50%; background: var(--border-color01);}
            .organ_wrap .chart_list:not(:first-child) > li:after{position: absolute;content:'';width: calc(100% + 241px);height: 1px;bottom:calc(100% + 80px);left:50%;background: var(--border-color01);}
            .organ_wrap .chart_list:not(:first-child) > li:last-child:after{display: none;}
            .organ_wrap .chart_list:not(:first-child) .desc:before{position: absolute;content:'';width: 14px;height: 14px;border: 4px solid var(--point-color01);border-radius: 100%;background: var(--point-white);box-sizing: border-box;top:-7px;left:50%;translate: -50%;}

            .organ_wrap .chart_list .element_item:before{position: absolute;content:'';width: 1px;height: 60px;background: var(--border-color01);top: 0;left:50%;}

    /* work.html */
        
        .chart_graph{position: relative;border-bottom: 1px solid var(--black-color03);background: url('../images/sub/top05_bg.png') no-repeat center bottom / 100% auto;width: calc(100% + 240px);margin-left: -120px;padding-inline: 120px;box-sizing: border-box;}
        .chart_graph .item_list{display: flex;align-items: self-end;justify-content: center;gap: 100px;}
        .chart_graph .item_list > li{position: relative; font-size: var(--title-20); text-align: center;}
        .chart_graph .item_list .desc{position: relative;}
        .chart_graph .item_list .desc dt{position: relative;width: 100px;height: 500px; background: var(--point-color03); }
        .chart_graph .item_list .desc dd{position: absolute;top:calc(100% + 30px);left:50%;translate: -50%;font-size: 120%;font-weight: 400;color: var(--black-color08);width: max-content;}
        .chart_graph .item_list .exp{font-size: 120%; font-weight: 500; color: var(--black-color01);}
        .chart_graph .item_list .exp:after{display: block;content:'';width: 5px;height: 5px;background: var(--point-color01);border-radius: 100%;margin: 14px auto 0;}

        .chart_graph .item_list > li:nth-child(2) .desc dt{height: 260px;}
        .chart_graph .item_list > li:nth-child(3) .desc dt{height: 470px;}
        
        .chart_graph .item_list > li:nth-child(5) .desc dt{height: 450px;}
        .chart_graph .item_list > li:nth-child(6) .desc dt{height: 140px;}
        .chart_graph .item_list > li:nth-child(7) .desc dt{height: 420px;}
        .chart_graph .item_list .point .desc:before{display: block;content:'';width: 0;height: 45px;border-left: 1px dashed var(--point-color01);margin-inline: auto; display: none;}
        .chart_graph .item_list .point .desc:after{position: absolute;content:'';width: 22px;height: 22px;border: 6px solid var(--point-color01);border-radius: 100%;background: var(--point-white);top: -11px;left: 50%;translate: -50%;box-sizing: border-box;}
        .chart_graph .item_list .point .desc dt{background: var(--point-color10); height: 0;}
        .chart_graph.aos-animate .item_list .point .desc dt{height: 380px; transition: all 2s; transition-delay: 0.2s;}
        .chart_graph .item_list .point .desc dd{color: var(--point-color10); font-weight: 500;}

    /* ci.html */
        .logo_box{display: flex;align-items: center;justify-content: center;text-align: center;padding: 80px;background: var(--point-color03);box-sizing: border-box;}
        .logo_box span{width: 227px;}
        .logo_box span img{width: 100%;}
        .logo_box + .sub_title{margin-top: 40px;}
        
        .logo_type{border-block: 1px solid var(--border-color03);margin-top: 120px;}
        .logo_type .info_list{display: flex;flex-wrap: wrap;box-sizing: border-box;margin-bottom: -1px; padding-left: 1px;}
        .logo_type .info_list > li{padding: 60px 40px 126px;border: 1px solid var(--border-color03);box-sizing: border-box;margin: -1px 0 0 -1px;width: calc(100% / 3 + 1px);}
        .logo_type .info_list .desc{font-size: var(--title-20);}
        .logo_type .info_list .desc > dt{width: 100%;height: 230px;border:1px solid var(--border-color01);background:url('../images/sub/logo_bg.png') repeat center;box-sizing: border-box;display: flex;align-items: center;justify-content: center;padding: 30px;}
            .logo_type .info_list .desc > dt + dd{margin-top: 27px;}
        .logo_type .info_list .desc > dd{text-align: center; font-size: 140%; font-weight: 500; color: var(--black-color03);}
        .logo_type .info_list .colors{display: flex;flex-direction: column;gap: 9px;background: var(--point-color11);padding: 22px 30px;box-sizing: border-box;}
        .logo_type .info_list .colors .exp{display: flex; font-size: var(--title-20);}
        .logo_type .info_list .colors .exp :where(dt, dd){font-size: 80%;}
        .logo_type .info_list .colors .exp dt{width: 120px;flex-shrink: 0;font-weight: 400;color: var(--point-white);}
        .logo_type .info_list .colors .exp dd{display: flex;gap: 10px;font-weight: 300;color: rgba(255,255,255,0.8);}

    /* partnership.html */
        .partner_list{display: flex;flex-wrap: wrap;box-shadow: var(--shadow-03);overflow: hidden;}
        .partner_list > li{position: relative;width: calc(100% / 6);padding: 40px 30px 100px;box-sizing: border-box;min-height: 240px;box-shadow: 1px 0 0 var(--border-color01);}
        .partner_list .desc{font-size: var(--title-20);}
        .partner_list .desc dt{display: flex; align-items: center; height: 30px;}
			.partner_list .desc dt + dd{margin-top:15px;}
        .partner_list .desc dd{font-size: 80%; font-weight: 400; color: var(--black-color08);}
        .partner_list .plus_box{position: absolute; right:30px; bottom:30px;}

    /* location.html */
        .location_info{display: flex; gap: 40px;}
            .location_info + .location_info{margin-top: 115px;}
        .location_info > li{width: 440px;box-sizing: border-box;display: flex;flex-direction: column;justify-content: space-between;gap: 23px;}
        .location_info > li:nth-child(2){width: calc(100% - 480px);}
        .location_info .thumb{font-size: 0; height: 440px; overflow: hidden;}
        .location_info .thumb :where(img, iframe){width: 100%; height: 100%; object-fit: cover;}
        .location_info .exp{display: flex;justify-content: flex-end;flex-wrap: wrap;gap: 15px 40px;padding-top: 10px;}
        .location_info .icon_desc{display: inline-flex;align-items: baseline;font-size: var(--title-20);gap: 8px;}
        .location_info .icon_desc dt{flex-shrink: 0;font-size: 0;translate: 0 -6px;}
        .location_info .icon_desc dd{font-size: 90%;font-weight: 400;color: var(--black-color05);}
        .loca_sec + .loca_sec{margin-top: 140px;}

    /* greetings.html */
        .greetings{display: flex;}
        .greetings .thumb{position: relative;width: 44.2%;box-sizing: border-box;z-index: 2;}
        .greetings .thumb span{position: relative;display: block;width: calc(100% + 184px);margin-left: -240px;box-shadow: var(--shadow-04);z-index: 3;}
        .greetings .thumb span{&:before, &:after{position: absolute;content:'';top:40px;left:40px;width: 100%;height: 100%;border: 4px solid var(--border-color01);box-sizing: border-box; z-index: 1;}}
        .greetings .thumb span:after{border-color: var(--point-color01);clip-path: inset(calc(100% - 40px) 0 0 calc(100% - 40px));}
        .greetings .thumb img{position: relative; z-index: 2;}
        .greetings .sub_title{width: 55.8%;gap: 3px;padding: 54px 0 0 80px;}
            .greetings .sub_title:before{position: absolute;content:'';top: 31%;left: -20%;width: 190%;height: 59.8%;background: var(--point-color03);}
            .greetings .sub_title *{position: relative;}
        .greetings .sub_title h2 + h5{margin-top: 116px;}
		.greetings .sub_title h6 + h4{margin-top: 23px;}
        .greetings .sub_title h5{line-height: 1.72;font-weight: 500;font-family: var(--font-type02);}
        .greetings .sub_title h5 + p{margin-top: 20px;}
        .greetings .sub_title p + p{margin-top: 22px;}
        .greetings .sub_title .sign{display: flex;flex-wrap: wrap;align-items: center;gap: 18px;margin-top: 105px;} 
        .greetings .sub_title .sign dt{font-size: 110%; font-weight: 500; color: var(--black-color03);}
        .greetings .sub_title .sign dd{font-size: 140%; font-weight: 600; color: var(--black-color01);}

/*───────────────────────────────────────────────────────────
	technical
───────────────────────────────────────────────────────────*/

    /* soc.html */
        .flow_sec{counter-reset: flow_sec; display: flex; flex-direction: column; gap: 60px;}
        .flow_sec .sub_title h4{font-size: 130%;font-weight: 500;color: var(--point-color02);display: flex;align-items: baseline;gap: 12px;font-family: inherit;line-height: 1.3;}
        .flow_sec .sub_title h4:before{display: inline-flex;content:'';width: 3px;height: 18px;background: var(--point-color02);flex-shrink: 0;}
        .flow_sec .sub_title h4 span:after{display: inline-flex;content: counter(flow_sec);counter-increment: flow_sec;}
        .flow_item section + section{margin-top: 80px; padding-top: 80px; border-top: 1px solid var(--border-color03);}
        .flow_sec .step_list{overflow: hidden;font-size: var(--title-20);counter-reset: flowStep;}
        .flow_sec .step_list > li{position: relative;float:left;font-size: 85%;font-weight: 400;color: var(--black-color03);line-height: 1.53;border: 1px solid var(--border-color01);width: calc(100% / 6 - 30px);min-height: 120px;padding: 15px;text-align: center;box-sizing: border-box;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 6px; margin-inline:0 36px;}
            .flow_sec .step_list > li:before{content:'Step ' counter(flowStep, decimal-leading-zero);counter-increment: flowStep;font-size: 90%;font-weight: 500;color: var(--point-color02);}
            .flow_sec .step_list > li:not(:last-child):after{position: absolute;content:'';width: 13px;height: 13px;background: url('../images/sub/flow_arw.svg') no-repeat center / 100% auto;top: 50%;left: calc(100% + 20px);translate: -50% -50%;}
            .flow_sec .step_list > li:last-child{border-color: var(--point-color03); background: var(--point-color03);}
            .flow_sec .step_list > li:nth-child(6):after{top: calc(100% + 23px);left: 50%;transform: rotate(90deg);}
            .flow_sec .step_list > li:nth-child(n+7){float: right;margin-top: 45px;}
            .flow_sec .step_list > li:nth-child(n+7){margin-inline: 36px 0;}
            .flow_sec .step_list > li:nth-child(n+7):after{left: auto;right: calc(100% + 20px);transform: scale(-1,-1);translate: 50% -50%;}
            .flow_sec .step_list > li:nth-child(6n){margin-inline: 0;}

        .flow_table table tr{font-size: var(--title-20);}
        .flow_table table :where(th, td){font-size: 85%;font-weight: 500;text-align: center;padding-inline: 10px;line-height: 1.41;}
        .flow_table table thead th{color: var(--point-white);background: var(--point-color02);font-weight: 400;padding-block: 14px;}
        .flow_table table thead th:not(:last-child){border-right: 1px solid rgba(255,255,255,0.2);}
        .flow_table table tbody :where(th, td){border-bottom: 1px solid var(--border-color01);}
        .flow_table table tbody :where(th, td):not(:last-child){border-right: 1px solid var(--border-color01); padding-block: 23px;}
        .flow_table table tbody th{color: var(--black-color03); background: var(--point-color03);}
        .flow_table .circle{display: inline-flex; width: 14px; height: 14px; border: 3px solid var(--point-color01); border-radius: 100%; box-sizing: border-box;}
        .flow_table .circle.red{border-color: #fb0000;}

        .perfor_sec{counter-reset: perfor_sec;display: flex;flex-wrap: wrap;flex-direction: column;gap: 40px;}
        .perfor_sec .sub_title h4{font-size: 130%;font-weight: 500;display: flex;align-items: baseline;gap: 14px;line-height: 1.3;}
        .perfor_sec .sub_title h4:before{display: inline-flex;content: counter(perfor_sec, decimal-leading-zero) '.'; counter-increment: perfor_sec;color: var(--point-color02);flex-shrink: 0;font-size: 84%;font-family: var(--font-type01);translate: 0 -1px;}
        .perfor_sec .bg_list{display: flex; flex-wrap: wrap; gap: 30px;}
        .perfor_sec .bg_list > li{position: relative; width: calc(100% / 2 - 15px); background: var(--gray-bg03); padding:30px; box-sizing: border-box;}
        .perfor_sec .bg_list .info_desc{font-size: var(--title-20);}
        .perfor_sec .bg_list .info_desc dt{font-size: 110%; font-weight: 600; color: var(--point-color02); line-height: 1.27; font-family: var(--font-type02);}
        .perfor_sec .bg_list .info_desc dt + dd{margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--border-color01);}
        .perfor_sec .bg_list .bullet_list > li{color: var(--black-color06);}

            .perfor_sec.row{flex-direction: row; gap: 30px;}
            .perfor_sec.row .cont{width: calc(100% / 2 - 15px);display: flex;flex-direction: column;}
			.perfor_sec.row .cont .sub_title{flex-shrink:0;}
            .perfor_sec.row .bg_list{height: 100%;}
            .perfor_sec.row .bg_list > li{width: 100%;}

    /* solution.html */
        .sol_sec{display: flex;}
        .sol_sec .sub_title{width: 34.7%; padding-right: 30px;}
        .sol_sec .cont{width: 65.3%;box-sizing: border-box;}
        .sol_sec .setp_list{counter-reset: sol_sec;display: flex;flex-direction: column;gap: 27px;}
        .sol_sec .setp_list .desc{font-size: var(--title-20);}
        .sol_sec .setp_list .desc dt{display: flex;align-items: baseline;gap: 15px;font-size: 110%;font-weight: 600;color: var(--black-color03);letter-spacing: -0.03em;line-height: 1.5;}
            .sol_sec .setp_list .desc dt:before{display: inline-flex;content: counter(sol_sec, decimal-leading-zero) '.';counter-increment: sol_sec;color: var(--point-color02);flex-shrink: 0;font-size: 91%;font-weight: 500;translate: 0 -2px;}
			.sol_sec .setp_list .desc dt + dd{margin-top: 9px;}
        .sol_sec .setp_list .desc dd{font-size: 95%;font-weight: 400;color: var(--black-color06);line-height: 1.84;font-family: var(--font-type02);letter-spacing: -0.03em;}
        .sol_sec .chk_list{display: flex;flex-wrap: wrap;gap: 20px;font-size: var(--title-20);}
        .sol_sec .chk_list > li{position: relative;width: calc(100% / 3 - 13.34px);background: var(--point-color03);box-sizing: border-box;display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;gap: 15px;padding: 49px 30px 45px;font-size: 110%;font-weight: 400;color: var(--black-color03);letter-spacing: -0.03em;}
            .sol_sec .chk_list > li:before{display: flex;content:'';width: 17px;height: 13px;background: url('../images/sub/chk_icon.svg') no-repeat center / 100% auto;}

    /* progress.html */
        .progress_wrap{display: flex; align-items: flex-start; }
        .progress_wrap .sticky_box{ position: sticky; top:130px; width: 41.6%; box-sizing: border-box; display: flex; flex-direction: column; gap: 60px;}
        .progress_wrap .sub_title{gap: 24px;}
        .progress_wrap .sub_title h2{font-size: 250%;font-weight: 500;}
        .progress_wrap .sub_title h5{font-size: 120%;}
		.progress_wrap .sub_title h5 em{font-weight:500;}
        .progress_wrap .sub_title p{color: var(--black-color03);line-height: 1.73;}
        .progress_wrap .cont{width: 58.4%; padding-left: 108px; box-sizing: border-box;}
        .progress_wrap .pro_list{position: relative;}
        .progress_wrap .pro_list > li{position: relative;padding: 0 0 80px 132px;box-sizing: border-box;}
            .progress_wrap .pro_list > li:before{position: absolute;content:'';width: 10px;height: 10px;background: var(--black-color08);box-shadow: 0 0 0 6px var(--border-color01);top: 19px;left: 7px;border-radius: 100%;z-index: 2;transition: all 0.4s; overflow: hidden;}
            .progress_wrap .pro_list > li:not(:last-child):after{position: absolute;content:'';top: 24px;left: 12px;width: 1px;height: 100%;background: var(--border-color01);}
        .progress_wrap .pro_list > li:not(:last-child) .line{position: absolute;top: 24px;left: 12px;width: 1px;height: 0;background: var(--point-color01);z-index: 1;}
        .progress_wrap .pro_list .desc{font-size: var(--title-20);}
        .progress_wrap .pro_list .desc dt{font-size: 210%;font-weight: 500;color: var(--black-color03);letter-spacing: -0.03em;line-height: 1.2; transition: all 0.4s;}
			.progress_wrap .pro_list .desc dt + dd{margin-top: 20px;}
        .progress_wrap .pro_list .desc dd{font-size: 100%;font-weight: 600;font-family: var(--font-type02);color: var(--black-color04);line-height: 1.4;display: flex;flex-direction: column;gap: 14px;}
        .progress_wrap .pro_list .desc dd strong{font-weight: inherit;}
        .progress_wrap .bullet_list > li{color: var(--black-color06);}

            .progress_wrap .pro_list > li.on:before{background: var(--point-color01); box-shadow: 0 0 0 6px var(--point-color12);}
            .progress_wrap .pro_list > li.on .desc dt{color: var(--point-color01);}


/*───────────────────────────────────────────────────────────
	career
───────────────────────────────────────────────────────────*/

    /* talent.html */
        .talent_wrap{padding-bottom: 80px;}
        .talent_list{display: flex; flex-wrap: wrap; box-shadow: var(--shadow-03); overflow: hidden; }
        .talent_list > li{position: relative;box-shadow:1px 0 0 var(--border-color01);font-size: var(--title-20);width: calc(100% / 5);padding: 40px 30px 41px;box-sizing: border-box;display: flex;flex-direction: column;gap: 78px;}
        .talent_list .point{display: block;font-size: 550%;font-weight: 700;line-height: 1;color: var(--point-color07);}
        .talent_list .desc dt{font-size: 120%;font-weight: 500;color: var(--point-color07);line-height: 1.41;letter-spacing: -0.03em;}
            .talent_list .desc dt + dd{margin-top: 7px;}
        .talent_list .desc dd{font-size: 85%; font-weight: 400; color: var(--black-color06); line-height: 1.64;}

            .talent_list > li:nth-child(2) :is(.point, .desc dt){color: var(--point-color02);}
            .talent_list > li:nth-child(3) :is(.point, .desc dt){color: var(--point-color06);}
            .talent_list > li:nth-child(4) :is(.point, .desc dt){color: var(--point-color05);}
            .talent_list > li:nth-child(5) :is(.point, .desc dt){color: var(--point-color13);}

        .sub_content.talent .main_sol .cont_list .main_title h4{width: fit-content;}

    /* systems.html */
        .systems_sec{display: flex; flex-direction: column; gap: 118px;}
        .systems_sec .sub_title h3.icon{font-family: var(--font-type02); font-weight: 600;}
        .benefit_list{display: flex;flex-wrap: wrap;box-sizing: border-box;padding: 5px 0 0 1px;}
        .benefit_list > li{position: relative;width: calc(100% / 3 + 1px);border: 1px solid var(--border-color01);padding:50px 40px;box-sizing: border-box;display: flex;align-items: center;gap: 30px;margin: -1px 0 0 -1px;}
        .benefit_list .icon{display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 100%; background: var(--gray-bg02); padding:15px; box-sizing: border-box; flex-shrink: 0;}
        .benefit_list .desc{font-size: var(--title-20);}
        .benefit_list .desc :where(dt, dd){font-family: var(--font-type02);}
        .benefit_list .desc dt{font-size: 110%; font-weight: 600; color: var(--black-color03); line-height: 1.45;}
            .benefit_list .desc dt + dd{margin-top: 8px;}
        .benefit_list .desc dd{font-size: 85%; font-weight: 400; color: var(--black-color06); line-height: 1.64;}

/*───────────────────────────────────────────────────────────
	board
───────────────────────────────────────────────────────────*/
    /* 검색 */
        .search_wrap{position: relative;background: var(--point-color03);padding:35px;box-sizing: border-box;font-size: var(--title-20); margin-bottom: 60px;}
        .search_wrap fieldset{display: flex; justify-content: center;}
        .search_wrap select{width: 160px;height: 60px;border:0;font-size: 90%;font-weight: 500;color: var(--black-color03);letter-spacing: -0.03em;}
        .search_wrap .inp_box{position: relative;width: 100%;max-width: 400px;}
            .search_wrap .inp_box{&:before, &:after{position: absolute;content: '';width: 1px;height: 14px;background: var(--border-color01);top: 50%;left: 0;translate: 0 -50%;}}
            .search_wrap .inp_box:after{left:auto; right:0;}
        .search_wrap [type="text"]{border:0;background: var(--point-white);width: 100%;height: 60px;padding-inline: 20px;font-size: 90%;font-weight: 400;color: var(--black-color03);letter-spacing: -0.03em;}
        .search_wrap [type="text"]::placeholder{color: var(--black-color10);}
        .search_wrap [type="submit"]{width: 60px;height: 60px;font-size: 0;background: var(--point-white) url('../images/sub/search_icon.svg') no-repeat center;}

        .preface_list{display: flex;align-items: center;justify-content: center;flex-wrap: wrap;font-size: var(--title-20);gap: 15px 40px;margin-block: -20px 80px;}
        .preface_list > li{position: relative; font-size: inherit; font-weight: 600; color: var(--black-color10); transition: all 0.4s;}
        .preface_list > li > a{display: flex; align-items: center; flex-wrap: wrap; gap: 20px;}

            .preface_list > li > a:before{display: none; content:''; width: 40px; height: 1px; background: var(--point-color02);}
            .preface_list > li[selected="selected"], .preface_list:not(:has(li[selected="selected"])) > li:first-child{color: var(--point-color02);}
            .preface_list > li[selected="selected"] > a:before, .preface_list:not(:has(li[selected="selected"])) > li:first-child > a:before{display: inline-flex;}

            /* over */
            .preface_list > li:hover{color: var(--point-color02);}
        

    /* 일반 */
        .list_default{border-top: 1px solid var(--border-color03);}
        .list_default tr{font-size: var(--title-20);}
        .list_default :where(th, td){font-size: 85%;font-weight: 400;color: var(--black-color08);text-align: center;border-bottom: 1px solid var(--border-color03);padding: 25px 10px;line-height: 1.6;letter-spacing: -0.015em;}
        .list_default .left{text-align: left;font-size: 95%;font-weight: 400;color: var(--black-color03);overflow: hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline: 20px;font-family: var(--font-type02);word-break: break-all;}
        .list_default .left strong{font-weight: 600;}
        .list_default .icon{display: inline-flex;align-items: center;justify-content: center;text-align: center;padding: 4px 16px 2px;background: var(--point-color02);font-size: 94%;font-weight: 400;color: var(--point-white);}
        .nodata{font-size: var(--title-17);font-weight: 500;color: var(--black-color06);text-align: center;}

        #wrap .paging {text-align:center;padding:0;line-height:normal;margin: 60px 0 0;box-sizing:border-box;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;font-size: var(--title-20);gap: 8px;}
		#wrap .paging span {display:inline-block;}
		#wrap .paging a {display:inline-flex;align-items:center;justify-content:center;font-size: 80%;font-weight: 400;color: var(--black-color06);padding: 0 5px;margin: 0;border:0;box-sizing:border-box;width: auto;height: 40px;min-width: 40px;text-align:center;font-family: inherit;line-height: 1.2;}
		#wrap .paging :is(.on a, a.on){color: var(--point-color02);font-weight: 500;border-bottom: 1px solid var(--point-color02);}
        #wrap .paging .arrow a {font-size:0;background:var(--border-color03) no-repeat center;}
        #wrap .paging .arrow:is(.first, .last) a{background-image: url('../images/sub/paging_first.svg');}
        #wrap .paging .arrow:is(.prev, .next) a{background-image: url('../images/sub/paging_prev.svg');}
        #wrap .paging .arrow:is(.next, .last) a{transform: scale(-1,-1);}
        #wrap .paging .arrow.next a{margin-right: 16px;}
        #wrap .paging .arrow.prev a{margin-left: 16px;}

    /* 뷰 */
        #wrap .bbs_view{position: relative;font-size: var(--title-20);}
        #wrap .bbs_view .preface_list{position: relative;margin-block: 0 27px;}
        #wrap .bbs_view .icon{display: flex;align-items: center;justify-content: center;text-align: center;padding: 4px 16px;background: var(--point-color02);font-size: 94%;font-weight: 400;color: var(--point-white);width: fit-content;margin-inline: auto;margin-bottom: 20px;}
        #wrap .bbs_view .view_tit{position: relative;padding: 0 0 55px;border: 0;border-bottom: 1px solid var(--border-color01);margin: 0;width: 100%;box-sizing: border-box;font-size: inherit;text-align: center;background: none;}
        #wrap .bbs_view .view_tit h3{display: block;font-size: 190%;font-weight: 600;color: var(--black-color03);text-align: inherit;line-height: 1.3;font-family: var(--font-type02);letter-spacing: -0.03em;width: 100%;box-sizing: border-box;}
        #wrap .bbs_view .view_tit .info{display: flex;justify-content: center;flex-wrap: wrap;margin-top: 33px;}
        #wrap .bbs_view .view_tit .info .desc{display: inline-flex;align-items: center;}
            #wrap .bbs_view .view_tit .info .desc:not(:last-child):after{display: inline-flex; content:''; width: 1px; height: 12px; background: var(--border-color01); margin-inline: 20px;}
        #wrap .bbs_view .view_tit .info .desc :where(dt, dd){font-size: 90%;}
        #wrap .bbs_view .view_tit .info .desc dt{flex-shrink: 0;font-weight: 500;color: var(--black-color06);padding-right: 14px;}
        #wrap .bbs_view .view_tit .info .desc dd{font-weight: 400;color: var(--black-color08);}
        #wrap .bbs_view .view_cont{font-size: 95%;font-weight: 400;color: var(--black-color03);line-height: 1.84;letter-spacing: -0.03em;padding: 60px 0 140px;border-bottom: 1px solid var(--border-color01);margin: 0;width: 100%;box-sizing: border-box;text-align: unset;word-break: keep-all;}

        #wrap .extra_editor_wrap{position: relative;display: flex;align-items: center;border: 0;width: 100%;box-sizing: border-box;margin: -1px 0 0;background: var(--point-color03);font-size: var(--title-20);font-family: var(--font-type02);padding: 28px 0;}
        #wrap .extra_editor_wrap h4{position: relative; font-size: 90%;font-weight: 500;color: var(--black-color04);background: none;width: 180px;box-sizing: border-box;text-align: center;flex-shrink: 0; padding:0 20px;}
            #wrap .extra_editor_wrap h4:before{position: absolute; content:''; width: 1px; height: 14px; background: var(--border-color01); top:50%; right:0; translate: 0 -50%;}
        #wrap .extra_cont{display: block;width: auto;padding: 0 0 0 50px;display: flex;flex-wrap: wrap;}
        #wrap .extra_cont span{font-size: inherit;margin: 0;font-size: 90%;font-weight: 400;color: var(--black-color06);}
            #wrap .extra_cont span:not(:first-child):before{display: inline-flex;content:', ';margin-right: 4px;}
        #wrap .extra_cont span a{color: inherit !important;}