@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	header, footer, main 관련 작성 css 파일입니다.

	** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다.

───────────────────────────────────────────────────────────*/
    
/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
	#wrap {position:relative;width:100%; box-sizing: border-box; overflow: clip;}
    .w_custom{position: relative; width: calc(100% - 60px); max-width: 1500px; margin-inline: auto; box-sizing: border-box;}
    #container{position: relative; padding-bottom:160px; box-sizing: border-box;}

    @media (max-width:1500px){
        br.for_pc{display: none;}
    }
    @media (max-width:1023px){
        #container{padding-bottom:clamp(100px, 16vw, 160px);}
    }
    @media (max-width:860px){
        .w_custom{width: calc(100% - 30px);}
    }
    @media (max-width:320px){
        .w_custom{width: calc(100% - 20px);}
    }



/*───────────────────────────────────────────────────────────

    HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
	#header{position: fixed;top:0;left:0;width: 100%;height: 115px;box-sizing: border-box;transition: all 0.4s;z-index: 100; background: var(--point-white); box-shadow: inset 0 -1px 0 var(--border-color01);}
    #header .w_custom{max-width: 1720px;height: 100%;display: flex;justify-content: space-between;gap: 20px;}
    #header .logo{position: relative; height: 100%;}
    #header .logo a{display: flex;align-items: center;max-width: 230px;height: 100%;padding-block: 20px;box-sizing: border-box;}
    #header .gnb{position: absolute;top:0;left:50%;width: calc(100% - 450px);height: 100%;translate: -50%;display: flex;justify-content: center;text-align: center;font-size: var(--title-20);font-family: var(--font-type02);letter-spacing: -0.03em;box-sizing: border-box;}
    #header .gnb > li{position: relative;height: 100%;font-size: inherit;font-weight: 500;color: var(--black-color01);transition: all 0.4s;}
    #header .gnb > li > a{display: flex;align-items: center;height: 100%;box-sizing: border-box;padding-inline: clamp(15px, 2.1vw, 40px);}
    #header .gnb .dep02{position: absolute;top:100%;left:50%;translate: -50%;width: 180px;background: var(--point-white);padding-block: 15px;box-sizing: border-box;border: 1px solid var(--border-color01);opacity: 0;pointer-events: none;transition: inherit; }
    #header .gnb .dep02 > li{font-size: 85%;font-weight: 500;color: var(--black-color05);transition: inherit;}
    #header .gnb .dep02 > li > a{display: block;padding: 10px 25px;box-sizing: border-box;}
    #header .utility{display: flex;align-items: center;gap: clamp(18px, 2.1vw, 40px);flex-shrink: 0;}

    .lang_desc{position: relative; font-size: var(--title-20);}
    .lang_desc dt{font-size: 0; cursor: pointer;}
    .lang_desc dd{position: absolute;top:calc(100% + 10px);left:50%;translate: -50%;width: 60px;padding-block: 8px;border: 1px solid var(--border-color01);background: var(--point-white);opacity: 0;pointer-events: none;transition: all 0.4s;font-size: max(13px, 70%);font-weight: 500;color: var(--black-color01);text-align: center;box-sizing: border-box;}
        .lang_desc:has(dt.on) dd{opacity: 1; pointer-events: all;}
	.lang_desc dd a{display:block;padding: 5px 10px;box-sizing: border-box;}
        .lang_desc dd a.on{color: var(--point-color01);}

    .lang_list{display: flex;align-items: center;font-size: var(--title-20);gap: clamp(18px, 1.6vw, 30px);}
    .lang_list > li{font-size: 90%;font-weight: 500;opacity: 0.4;}
    .lang_list > li > a{display: block;}
        .lang_list > li.on{opacity: 1;}
        .lang_list > li.on > a{text-decoration: underline;text-underline-offset: 1px;text-decoration-thickness: 1px;}

        

        /* over */
            @media (hover:hover) and (pointer:fine){
                /* #wrap.main_index #header:hover{background: var(--point-white); box-shadow: inset 0 -1px 0 var(--border-color01);}
                #wrap.main_index #header:hover :where(.logo, .gnb > li > a, .lang_list > li, .allCate){filter: none;} */
                #header .gnb > li:hover{color: var(--point-color01);}
                #header .gnb > li:hover .dep02{opacity: 1;pointer-events: all;}
                #header .gnb .dep02 > li:hover{color: var(--point-color01);}
            }

        /* on */
            #header.on{background: var(--point-white); box-shadow: inset 0 -1px 0 var(--border-color01);}
            /* #wrap.main_index #header.on :where(.logo, .gnb > li > a, .lang_list > li, .allCate){filter: none;} */

        /* filter */
            /* #wrap.main_index #header :where(.logo, .gnb > li > a, .lang_list > li, .allCate){filter: var(--filter-white); transition: all 0.4s;} */
            #wrap.sub_page #header,
            #wrap.sub_board #header { background: var(--point-white); }

    @media (max-width:1100px){
        #header .gnb > li{font-size: 90%;}
    }
    @media (max-width:1041px) {
        #header .gnb > li > a { padding-inline: 15px; }
    }
    @media (max-width:1023px){
        #header{height: clamp(65px, 11.5vw, 115px);}
        #header .gnb{display: none;}
        #header .logo a{max-width: clamp(150px, 30vw, 230px);}
    }

/*───────────────────────────────────────────────────────────

	Aside | outline/nav.html

───────────────────────────────────────────────────────────*/
    #aside{position: fixed;top: 0;left:0;width: 100%;height: 100%;z-index: 999;background: rgba(0,0,0,0.8);backdrop-filter:blur(10px);display: flex;flex-direction: column;overflow: hidden;overflow-y: auto;padding-block: 10vh;box-sizing: border-box;opacity: 0;transition: all 0.6s;clip-path: inset(0 0 100% 0);}
        #aside.on{opacity: 1;clip-path: inset(0);}
    body:has(#aside.on){overflow: clip; touch-action: none;}
    #aside .w_custom{flex-shrink: 0;max-width: 1720px;min-height: 100%;display: flex;align-items: center;}
    #aside .gnb{width: 100%;font-size: var(--title-20);letter-spacing: 0;display: grid;align-items: start;justify-content: center;grid-template: auto / repeat(5, 1fr);gap: clamp(15px, 2.2vw, 40px);}
    #aside .gnb > li{color: var(--point-white);font-size:var(--title-20);text-align: center;opacity:0;transform:translateY(100px);transition:all 0.8s;}
        #aside.on .gnb > li{opacity:1;transform:translateY(0);}
        #aside.on .gnb > li:nth-child(1){transition-delay:0.3s;}
        #aside.on .gnb > li:nth-child(2){transition-delay:0.4s;}
        #aside.on .gnb > li:nth-child(3){transition-delay:0.5s;}
        #aside.on .gnb > li:nth-child(4){transition-delay:0.6s;}
        #aside.on .gnb > li:nth-child(5){transition-delay:0.7s;}
        #aside.on .gnb > li:nth-child(6){transition-delay:0.8s;}
    #aside .gnb > li > a{display: block;font-size: 180%;color:inherit;font-weight: 500;line-height: 1.2;padding: 30px 0;transition: all 0.4s;position: relative;}
	#aside .gnb > li > a:before{width:12px;height:0;opacity:0;content:"";box-sizing:border-box;border-radius:100%;background: var(--point-color01);position: absolute;left:50%;top:0;transform:translate(-50%);transition:all 0.3s;}
    #aside .gnb .dep02{margin-top:8px;}
    #aside .gnb .dep02 > li{font-size:var(--title-20);}
    #aside .gnb .dep02 > li > a{display: inline-block;font-size:110%;font-weight:400;padding: 15px 0;transition: all 0.4s;color: var(--black-color08);}
    #aside .utility{position: absolute;top: clamp(30px, 2.8vw, 50px);right: clamp(30px, 2.8vw, 50px);display: flex;align-items: center;gap: 30px; z-index: 2;}
    #aside :where(.lang_desc dt, .lang_list > li){filter: var(--filter-white);}
    #aside .close_btn{position: relative;width: 40px;height: 40px;z-index: 9;}
    #aside .close_btn span{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%) rotate(45deg); width: 100%; height: 2px; background: var(--point-white);}
    #aside .close_btn span + span{transform: translate(-50%, -50%) rotate(-45deg);}
    
        /* over */
            @media (hover:hover) and (pointer:fine){
                #aside .gnb > li:hover > a:before{height:12px;opacity:1;}
                #aside .gnb .dep02 > li:hover a{color:var(--point-white);}
            }

    @media (max-width:1600px){
        #aside .gnb{grid-template: auto / repeat(3, 1fr)}
    }
    @media (max-width:1023px){
        #aside{padding-block: clamp(80px, 12vw, 120px);}
        #aside .close_btn{width: clamp(30px, 4vw, 40px);height: clamp(30px, 4vw, 40px);}
		#aside .utility{gap:20px;}
    }
    @media (max-width:860px){
		#aside{display: block;}
		#aside .w_custom{align-items:flex-start;}
		#aside .gnb{grid-template: auto / repeat(1, 1fr);gap:0;}
        #aside .gnb > li{display: block;padding: 25px 0;width:100%;text-align:left;box-sizing:border-box;border-bottom:1px solid rgba(255,255,255,0.5);}
        #aside .gnb > li > a{width: 100%; padding:0;}
		#aside .gnb > li > a:before{display: none;}
        #aside .gnb .dep02{display: flex;flex-wrap:wrap;margin-top: 15px;justify-content: flex-start;gap:0 12px;}
		#aside .gnb .dep02 li{width:calc(100% / 3 - 8px);}
		#aside .gnb .dep02 > li > a{padding:12px 0;}
		#aside .utility{top:15px; right: 15px; }
    }
    @media (max-width:640px){
        #aside .gnb > li > a{font-size: 200%;}
		#aside .gnb .dep02 li{width:calc(50% - 6px);}
        #aside .gnb .dep02 > li > a{padding:7px 0;font-size:100%;}
        #aside .gnb .dep02 > li:not(:last-child):after{margin:0 15px;}
    }
    @media (max-width:479px){
        #aside .gnb > li > a{font-size: 170%;}
        #aside .gnb .dep02{margin-top: 10px;}
        #aside .gnb .dep02 li{width: 100%;}
        #aside .gnb .dep02 > li > a{font-size: 95%;}
    }

/*───────────────────────────────────────────────────────────

    MAIN | index.html

───────────────────────────────────────────────────────────*/
    /* 비주얼 */
        .visual_wrapper{position: sticky; top:0;}
        .main_visual .visual_vd { width: 100%; height: 100%; }
        .main_visual .visual_vd iframe { position: absolute; top: 50%; left: 50%; width: 125%; height: 125%; translate: -50% -50%; pointer-events: none; }
        .main_visual {position:relative;box-sizing: border-box; background: var(--black-color01); height: 920px}
        .main_visual .slick-slide {position: relative; height: 920px; box-sizing: border-box; overflow: hidden;}
        .main_visual .link{position: absolute; inset: 0; z-index: 5;}
        .main_visual .thumb{position: absolute; inset: 0; background: no-repeat center / cover;}
            .main_visual .active .thumb{scale: 1.05;transition: all 8s;}
        .main_visual .txt_box{position: absolute; left: 50%; top: 0; translate: -50%; display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 26px;text-align: center;height: 100%;z-index: 2;font-size: var(--title-20);color: var(--point-white);padding-bottom: 84px;text-wrap: balance;}
        .main_visual h2{font-size: 110px;font-weight: 800;line-height: 1.1;letter-spacing: 0;}
        .main_visual h4{font-size: 60px;font-weight: 200;line-height: 1.2;letter-spacing: 0.01em;}
			.main_visual h4 + p{margin-top: 35px;}
        .main_visual p{font-size: max(16px, 90%);font-weight: 200;line-height: 1.6; color: rgba(255,255,255,0.7); letter-spacing: -0.03em;}
        .main_visual .txtAni{translate: 0 70px; scale: 0.9; opacity: 1;}
            .main_visual .active .txtAni{translate: 0; scale: 1; opacity: 1; transition: all 1.5s 0.2s;}
            .main_visual .active .txtAni:nth-child(2){transition-delay: 0.4s;}
            .main_visual .active .txtAni:nth-child(3){transition-delay: 0.6s;}
        .main_visual .scr_dwn{position: absolute;left:50%;translate: -50%;bottom: 146px;font-size: var(--title-20);color: var(--point-white);text-align: center;display: flex;flex-direction: column;align-items: center;gap: 7px; cursor: pointer;}
        .main_visual .scr_dwn dt{font-size: 80%;font-weight: 300;letter-spacing: 0.02em;}
        .main_visual .scr_dwn dd{position: relative; width: 24px;aspect-ratio: auto 0.6;box-shadow: inset 0 0 0 2px rgba(255,255,255,0.4);border-radius: 40px;box-sizing: border-box;}
            .main_visual .scr_dwn dd:before{position: absolute; content:''; width: 4px; aspect-ratio: auto 1; background: var(--point-color02); border-radius: 100%; top:8px; left:50%; translate: -50%;}

            .main_visual .scr_dwn dd:before{animation-name: scrDwn; animation-duration:1.5s; animation-iteration-count:infinite; animation-direction:alternate;  animation-fill-mode: forwards; transition-timing-function:linear;}
            @keyframes scrDwn {0% {top:8px;}100% {top:calc(100% - 12px);}}

        @media (max-width: 1310px){
            .main_visual .visual_vd iframe { width: 180%; height: 180%; }
        }

        @media (max-width:1023px){
            .main_visual { height: clamp(600px, 92vw, 920px); }
            .main_visual .slick-slide{height: clamp(600px, 92vw, 920px);}
            .main_visual .txt_box{gap: clamp(20px, 2.6vw, 26px);padding-bottom: clamp(50px, 8.4vw, 84px);}
            .main_visual h2{font-size: clamp(50px, 11vw, 110px);}
            .main_visual h4{font-size: clamp(20px, 6vw, 60px);}
			.main_visual h4 + p{margin-top: clamp(17px, 3.5vw, 35px);}
            .main_visual .scr_dwn{bottom: clamp(75px, 14.6vw, 146px);}
            .main_visual .scr_dwn dd{width: clamp(20px, 2.9vw, 24px);}
        }
        @media (max-width:640px){
            .main_visual .scr_dwn dd:before{width: 3px;}
        }

    /* 공통 */
        .main_cont{position: relative;background: var(--point-white);z-index: 2;padding-top: 176px;border-radius: clamp(40px, 8.4vw, 160px) clamp(40px, 8.4vw, 160px) 0 0;margin-top: -113px;}

        .more_btn{position: relative;display: block;width: fit-content;font-size: var(--title-20);color: var(--point-white);box-sizing: border-box;transition: all 0.4s;}
        .more_btn span{position: relative; font-size: max(15px, 90%);font-weight: 400;display: flex;align-items: center;justify-content: center;padding: 19px 25px;min-width: 200px;box-sizing: border-box;background: var(--point-gradi01);border-radius: 50px;letter-spacing: 0;transition: all 0.4s;box-sizing: border-box;}
            .more_btn.wh span{background: none;box-shadow: inset 0 0 0 2px var(--point-white);}
            .more_btn.sm span{font-size: max(13px, 70%);min-width: 140px;padding-block: 13px;}
            .more_btn.lg span{font-size: 110%;padding-block: 21px;letter-spacing: -0.03em;}

        .main_title{position: relative;font-size: var(--title-20);box-sizing: border-box;display: flex;align-items: center;flex-direction: column;text-align: center;gap: 20px;}
            .main_title.hd{padding-block: 132px 65px;}
        .main_title h3{font-size: 200%; font-weight: 500; color: var(--black-color01); line-height: 1.5;}
        .main_title h4{position: relative;font-size: 150%;font-weight: 700;color: var(--black-color01);font-family: var(--font-type03);letter-spacing: 0;box-sizing: border-box;}

        .more_plus{position: relative;display: inline-block;width: 40px;aspect-ratio: auto 1;border: 1px solid var(--border-color01);border-radius: var(--radius-10);background: var(--point-white);box-sizing: border-box; transition: all 0.4s;}
            .more_plus{&:before, &:after{position: absolute;content:'';width: 2px;height: 37%;background: var(--black-color01);top:50%;left:50%;translate: -50% -50%;transition: inherit;}}
            .more_plus:after{width: 37%;height: 2px;}

            /* over */
                @media (hover:hover) and (pointer:fine){
                    .more_btn:hover span{translate: 0 -10px;box-shadow: 3px 3px 10px rgba(0,0,0,0.2);}
                    .more_btn.wh:hover span{background: var(--point-white); color: var(--black-color01); -webkit-text-stroke: var(--black-color01); -webkit-text-stroke-width: 0.2px;}
                    .more_plus:hover{border-color: var(--point-color01);}
                    .more_plus:hover{&:before, &:after{background: var(--point-color01);}}
                }
        @media (max-width:1023px){
            .main_cont{padding-top: clamp(100px, 17.6vw, 176px);margin-top: clamp(-113px, -11.3vw, -50px);}
            .more_btn span{min-width: clamp(150px, 20vw, 200px);padding-block: clamp(15px, 2.3vw, 19px);}
                .more_btn.sm span{min-width: clamp(110px, 14vw, 140px);padding-block: clamp(12px, 1.8vw, 13px);}
                .more_btn.lg span{padding-block: clamp(15px, 2.6vw, 21px);}
            .more_plus{width: clamp(34px, 4.5vw, 40px);}

            .main_title{gap: clamp(12px, 2vw, 20px);}
            .main_title.hd{padding-block: clamp(80px, 13.2vw, 132px) clamp(25px, 6.5vw, 65px);}
            .main_title h3{font-size: 190%;}
        }
        @media (max-width:640px){
            .main_title h3{font-size: 180%;}
            .main_visual .visual_vd iframe { width: 220%; height: 220%; }
        }
        @media (max-width:479px){
            .main_title h3{font-size: 160%;line-height: 1.3;}
            .main_visual .visual_vd iframe { width: 300%; height: 300%; }
        }

        @media (max-width: 300px) {
            .main_visual .visual_vd iframe { width: 400%; height: 400%; }
        }

    /* 인트로 */
        .main_intro{position: sticky;top: -210px;padding-bottom:194px;}
        .main_intro .cont{font-size: var(--title-20);text-align: center;display: flex;flex-direction: column;align-items: center;gap: 28px;text-wrap: balance; opacity: 0; translate: 0 -70px;}
            .main_intro.on .cont{opacity: 1; translate: 0; transition: all 1.5s 0.2s;}
        .main_intro .cont h2{font-size: 120px;font-weight: 700;line-height: 1.1;letter-spacing: 0;}
			.main_intro .cont h2 + h4{margin-top: 14px;}
        .main_intro .cont h2 em{font-weight: inherit;background: var(--point-gradi01);background-clip: text;-webkit-text-fill-color: transparent;}
        .main_intro .cont h4{font-size: 60px;font-weight: 400;line-height: 1.2;color: var(--black-color01);letter-spacing: 0;}
        .main_intro .cont h6{font-size: 110%;font-weight: 400;line-height: 1.5;color: var(--black-color06);letter-spacing: 0;}
            .main_intro .cont h6:after{display: block;content:'';width: 1px;height: 100px;background: var(--black-color01);margin: 36px auto 13px;}
        .main_intro .cont .logo{width: 80%; max-width: 400px;}
        .main_intro .cont .logo img{width: 100%;}
        .main_intro .more_btn{margin-top: 71px;margin-inline: auto; opacity: 0; translate: 0 70px; }
            .main_intro.on .more_btn{opacity: 1; translate: 0; transition: all 1.5s 0.2s;}
        

        @media (max-width:1023px){
			.main_intro{padding-bottom: clamp(80px, 19.4vw, 194px);}
            .main_intro .cont{gap: clamp(15px, 2.8vw, 28px);}
            .main_intro .cont h2{font-size: clamp(46px, 12vw, 120px);}
            .main_intro .cont h4{font-size: clamp(20px, 6vw, 60px);}
            .main_intro .cont h6:after{height: clamp(50px, 10vw, 100px);margin-block: clamp(25px, 3.6vw, 36px) clamp(10px, 1.3vw, 13px);}
            .main_intro .cont .logo{max-width: clamp(200px, 40vw, 400px);}
            .main_intro .more_btn{margin-top: clamp(40px, 7.1vw, 71px);}
        }
        @media (max-width:479px){
            .main_intro .cont h6{font-size: 100%;}
        }

    /* 비즈니스 */
        .main_biz{position: relative;background: var(--point-color03);padding-block: 87px 93px; z-index:2;}
        .main_biz .w_custom{max-width: 1800px;}
        .main_biz .bnr_list{display: grid; grid-template: auto / repeat(3, 1fr); gap: clamp(15px, 1vw, 19px);}
        .main_biz .bnr_list > li{position: relative;border-radius: var(--radius-30);overflow: hidden;box-sizing: border-box;min-height: 780px;}
        .main_biz .bnr_list .thumb{position: absolute; inset: 0; overflow: hidden;}
        .main_biz .bnr_list .thumb{&:before, &:after{position: absolute; content:''; inset: 0; transition: all 0.4s;}}
        .main_biz .bnr_list .thumb:before{background: rgba(0,0,0,0.4);}
        .main_biz .bnr_list .thumb:after{background: rgba(26, 90, 168, 0.9); opacity: 0;}
        .main_biz .bnr_list .thumb img{width: 100%; height: 100%; object-fit: cover;}
        .main_biz .bnr_list .cont{position: relative;font-size: var(--title-20);color: var(--point-white);display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 34px;text-align: center;width: 100%;height: 100%;padding: 100px clamp(30px, 2.7vw, 50px);padding-bottom: 107px;box-sizing: border-box;text-wrap: balance;transition: all 0.4s;}
        .main_biz .bnr_list .cont h4{font-size: 200%;font-weight: 600;line-height: 1.3;letter-spacing: 0.01em;}
        .main_biz .bnr_list .cont p{font-size: 90%;font-weight: 300;line-height: 1.66;letter-spacing: 0;}
        .main_biz .bnr_list .cont .more_btn{margin-top: 45px;}
        .main_biz .bnr_list .cont :where(p, .more_btn){transition: inherit;}

            /* over */
                @media (min-width:1024px){
                    .main_biz .bnr_list .cont{translate: 0 150px;}
                    .main_biz .bnr_list .cont :where(p, .more_btn){opacity: 0; transition: inherit;}
                    .main_biz .bnr_list > li:hover .thumb:after{opacity: 1;}
                    .main_biz .bnr_list > li:hover .cont{translate: 0;}
                    .main_biz .bnr_list > li:hover .cont :where(p, .more_btn){opacity: 1;}
                }

        @media (max-width:1023px){
            .main_biz{padding-block: clamp(70px, 8.7vw, 87px) clamp(70px, 9.3vw, 93px);}
            .main_biz .bnr_list{grid-template: auto / repeat(1, 1fr);}
            .main_biz .bnr_list > li{min-height: auto;}
            .main_biz .bnr_list .cont{padding: clamp(75px, 10.5vw, 100px) clamp(20px, 3.5vw, 30px);gap: clamp(16px, 3.4vw, 34px);}
            .main_biz .bnr_list .cont .more_btn{margin-top: clamp(25px, 4.5vw, 45px);}
        }
        @media (max-width:640px){
            .main_biz .bnr_list .cont h4{font-size: 190%;}
        }
        @media (max-width:479px){
            .main_biz .bnr_list .cont h4{font-size: 180%;}
        }

    /* Products */
        .main_pord{position: relative;background: var(--gray-bg01);padding-bottom: 74px;overflow: hidden; z-index:2;}
            .main_pord:before{position: absolute;content:'EZMEDIBOT';left: 50%;bottom: 0;translate: -50% 28%;font-size: clamp(50px, 18.75vw, 360px);font-weight: 700;font-family: var(--font-type03);color: var(--point-white);line-height: 1;width: max-content;}
        .main_pord .prodSwiper{position: relative;padding-inline: min(320px, 17vw);box-sizing: border-box;}
        .main_pord .prodSwiper .swiper-slide{position: relative;min-height: 520px;height: auto;background: var(--point-white);border-radius: var(--radius-30);display: flex;justify-content: center;flex-direction: column;gap: 60px;padding: clamp(50px, 4.2vw, 80px);padding-bottom: clamp(50px, 5vw, 96px);box-sizing: border-box;overflow: hidden;transition: 0.4s;transition-property: box-shadow;}
            .main_pord .prodSwiper .swiper-slide.on{box-shadow: var(--shadow-01);}
            .main_pord .prodSwiper .swiper-slide:before{position: absolute;content:'';inset: 0;background: rgba(17, 17, 17, 0.2);transition: all 0.4s;}
            .main_pord .prodSwiper .swiper-slide.on:before{opacity: 0; pointer-events: none;}
        .main_pord .prodSwiper .desc{font-size: var(--title-20);box-sizing: border-box;display: grid;gap: 24px;text-wrap: balance;}
        .main_pord .prodSwiper .desc dt{font-size: 80px; font-weight: 700; color: var(--black-color00); line-height: 1.1; white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
        .main_pord .prodSwiper .desc dd{font-size: inherit;font-weight: 400;color: var(--black-color01);line-height: 1.3;letter-spacing: 0; white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
        .main_pord .prodSwiper .thumb{position: absolute;font-size: 0;z-index: -1;top: 47%;right: 10px;translate: 0 -50%;width: auto;aspect-ratio: auto 1;display: flex;align-items: center;justify-content: flex-end;}
        .main_pord .prodSwiper .slide01 .thumb { right: 77px; }
        .main_pord .prodSwiper .slide02 .thumb { right: 65px; }
        .main_pord .prodSwiper .slide03 .thumb { right: 31px; }
        .main_pord .prodSwiper .swiper-slide:not(.on) .more_btn{opacity: 0;margin-top: -82px;}
        .main_pord .w_custom .swiper-pagination{position: relative;inset: auto;display: flex;flex-wrap: wrap;justify-content: center;gap: clamp(15px, 1.6vw, 28px);width: 100%;margin-top: 80px;box-sizing: border-box;}
        .main_pord .w_custom .swiper-pagination span{margin:0;width: 12px;height: auto;aspect-ratio: auto 1;opacity: 1;background: var(--gray-bg04);}
        .main_pord .w_custom .swiper-pagination [class*="active"]{background: var(--point-color01);}

        @media (max-width: 1320px) {
            .main_pord .prodSwiper .thumb { width: 59%; justify-content: flex-end; }
        }

        @media (max-width:1023px){
            .main_pord .prodSwiper{padding-inline: 0 12vw;}
            .main_pord .prodSwiper .swiper-slide{gap: clamp(30px, 6vw, 60px);min-height: clamp(350px, 52vw, 520px);padding-inline: clamp(30px, 5vw, 50px);}
            .main_pord .prodSwiper .slide01 .thumb { right: clamp(31px, 6vw, 77px); }
            .main_pord .prodSwiper .slide02 .thumb { right: clamp(31px, 6vw, 65px); }
            .main_pord .prodSwiper .slide03 .thumb { right: 31px; }
            .main_pord .prodSwiper .desc{gap: clamp(15px, 2.4vw, 24px);}
            .main_pord .prodSwiper .desc dt{font-size: clamp(36px, 8vw, 80px);}
            .main_pord .w_custom .swiper-pagination{margin-top: clamp(25px, 8vw, 80px);}
            .main_pord .w_custom .swiper-pagination span{width: clamp(8px, 1.7vw, 12px);}
        }
        @media (max-width:860px){
            .main_pord .prodSwiper .swiper-slide{justify-content: flex-start;padding-top: 35px;}
            .main_pord .prodSwiper .thumb{top:auto;bottom:10px;translate: 0; width: 50%; }
        }
        @media (max-width: 640px) {
            .main_pord .prodSwiper .slide03 .thumb { width: 70%; }
        }
        @media (max-width:479px){
            .main_pord .prodSwiper .desc dd{font-size: max(15px, 90%);}
            .main_pord .prodSwiper .desc dd br{display: none;}
            
        }

    /* NOTICE */
        .main_notice{position: relative; padding-bottom: 123px; background: var(--point-white); z-index:2;}
		.main_notice .main_title h4{width: 100%;padding-inline: 80px;}
        .main_notice .more_plus{position: absolute; top:50%; right:0; translate: 0 -50%;}
        .main_notice .notiSwiper{position: relative;box-sizing: border-box;clip-path: inset(-25px);margin-top: -15px;}
        .main_notice .notiSwiper .swiper-slide{border: 1px solid var(--border-color01);height: auto;padding: clamp(35px, 2.7vw, 50px);padding-bottom: clamp(30px, 2.4vw, 45px);box-sizing: border-box;font-size: var(--title-20);border-radius: var(--radius-10);overflow: hidden;transition: all 0.4s;display: flex;flex-direction: column;justify-content: space-between;gap: 55px;}
        .main_notice .notiSwiper .link{position: absolute; inset: 0; z-index: 3;}
        .main_notice .notiSwiper .desc{display: grid;gap: 20px;}
        .main_notice .notiSwiper .desc dt{font-size: 120%;font-weight: 500;color: var(--black-color02);line-height: 1.42;letter-spacing: -0.03em;white-space: normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
        .main_notice .notiSwiper .desc dd{font-size: 90%;font-weight: 400;color: var(--black-color06);line-height: 1.67;white-space: normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
        .main_notice .notiSwiper .regdate{font-size: 80%;font-weight: 300;color: var(--black-color10);}
        .main_notice .w_custom .swiper-pagination{position: relative; inset: auto; width: 100%; height: 3px; background: var(--gray-bg04); margin-top: 60px;}
        .main_notice .w_custom .swiper-pagination span{background: var(--point-color04);}
        

            /* over */
                @media (hover:hover) and (pointer:fine){
                    .main_notice .notiSwiper .swiper-slide:hover{box-shadow: var(--shadow-01); border-color: var(--point-color01);}
                }

        @media (max-width:1023px){
            .main_notice{padding-bottom: clamp(80px, 12.3vw, 123px);}
            .main_notice .notiSwiper{padding-inline: 0 55vw;margin-top: clamp(-15px, -1.5vw, 0px);}
            .main_notice .main_title h4{padding-inline: clamp(50px, 8.5vw, 80px);}
            .main_notice .notiSwiper .swiper-slide{gap: clamp(30px, 5.5vw, 55px);padding: clamp(25px, 3.5vw, 35px);padding-bottom: clamp(20px, 3vw, 30px);}
            .main_notice .notiSwiper .desc{gap: clamp(13px, 2vw, 20px);}
            .main_notice .w_custom .swiper-pagination{margin-top: clamp(20px, 6vw, 60px);}
        }
        @media (max-width:640px){
            .main_notice .notiSwiper{padding-inline: 0 12vw;}
            .main_notice .w_custom .swiper-pagination{height: 2px;}
        }
        @media (max-width:479px){
            .main_notice .notiSwiper .desc dt{font-size: 110%;}
        }
    /* 인재 */
        .main_talent{position: relative;padding-block: 155px;background: url('../images/skin/main_talent.jpg') no-repeat center / cover;box-sizing: border-box; z-index:2;}
            .main_talent:before{position: absolute; content:''; inset: 0; background: rgba(0,0,0,0.4);}
        .main_talent .main_title h3{filter: var(--filter-white);}
        .main_talent .main_title .more_btn{margin-top: 19px;}
        .main_talent .main_title .more_btn span{box-shadow: inset 0 0 0 2px rgba(255,255,255,0.4);}

        @media (max-width:1023px){
            .main_talent{padding-block: clamp(80px, 15.5vw, 155px);}
            .main_talent .main_title .more_btn{margin-top: clamp(10px, 2vw, 19px);}
        }

/*───────────────────────────────────────────────────────────

    FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
	#footer{position: relative;background: var(--black-color00);box-sizing: border-box;padding-block: 60px 45px;color: rgba(255,255,255,0.6);font-weight: 200;line-height: 1.6;letter-spacing: 0; z-index:3;}
	#footer .w_custom{display:grid;gap: 45px;}
    #footer .top_sec{display: flex;align-items: center;flex-wrap: wrap;gap: 15px 80px;}
    #footer .logo{max-width: 230px;}
    #footer .link_list{display: flex;flex-wrap: wrap;gap: 10px 40px;font-size: var(--title-20);padding-top: 15px;}
    #footer .link_list > li{position: relative;font-size: max(13px, 70%);}
    #footer .link_list strong{color: var(--point-white); font-weight: inherit;}
    #footer .cont{font-size: var(--title-20);display: flex;flex-wrap: wrap;gap: 40px 80px;}
    #footer .cont .item{font-size: max(13px, 80%);font-weight: 400;color: var(--point-white);letter-spacing: 0;display: flex;flex-direction: column;gap: 17px;}
    #footer .cont em{font-weight: inherit;}
	#footer .cont address{display:grid;gap: 5px;}
    #footer .cont .desc{display: flex;}
    #footer .cont .desc dt{flex-shrink: 0;width: 100px;padding-right: 20px;box-sizing: border-box;font-weight: 400;}
    #footer .cont .desc dd{color: rgba(255,255,255,0.6);font-weight: 200;}
    #footer .copy{display: flex;flex-wrap: wrap;gap: 5px 20px;font-size: var(--title-20);margin-top: 30px;}
    #footer .copy :where(dt, dd){font-size: max(13px, 70%);font-weight: 200;letter-spacing: -0.01em;color: rgba(255,255,255,0.5);}

    .scr_top{position: fixed;right: clamp(30px, 2.7vw, 50px);bottom: clamp(30px, 2.7vw, 50px);width: 60px;height: 60px;display: flex;align-items: center;justify-content: center;padding: 12px;box-sizing: border-box;border-radius: 100%;background: var(--point-gradi02);box-shadow: var(--shadow-02);z-index: 50; opacity: 0; pointer-events: none; transition: all 0.4s;}
        body:has(#header.on) .scr_top{opacity: 1; pointer-events: all;}

    @media (max-width:1023px){
        #footer{padding-top: clamp(45px, 6vw, 60px);}
        #footer .w_custom{gap: clamp(30px, 4.5vw, 45px);}
        #footer .top_sec{gap: clamp(10px, 2vw, 15px) clamp(40px, 8vw, 80px);}
        #footer .logo{max-width: clamp(150px, 23vw, 230px);}
        #footer .link_list{column-gap: clamp(20px, 4vw, 40px);}
        #footer .cont{gap: clamp(30px, 4.5vw, 40px);}
        #footer .cont .item{width: 100%; gap: clamp(12px, 1.7vw, 17px);}
        #footer .cont .desc dt{width: clamp(85px, 10.5vw, 100px);padding-right: clamp(15px, 2vw, 20px);}
        #footer .copy{margin-top: clamp(10px, 3vw, 30px);}

        .scr_top{width: clamp(42px, 6.5vw, 60px);height: clamp(42px, 6.5vw, 60px);}
    }
    @media (max-width:860px){
        .scr_top{right: 15px; bottom:15px;}
    }