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

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

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

/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
        body{overflow: visible;}
		#wrap {position:relative;width:100%; overflow: clip; box-sizing: border-box;}
		#contents_wrap, .w_custom {position: relative; width: calc(100% - 120px); max-width: 1400px; margin:0 auto; box-sizing: border-box;}
        #contents_wrap {padding-bottom: 150px; z-index: 5; background: var(--point-white);}

    @media screen and (max-width:1240px) {
        #contents_wrap, .w_custom{width: calc(100% - 80px);}
    }

	@media screen and (max-width:1023px) {
        #contents_wrap, .w_custom{width: calc(100% - 60px);}
	}
    @media screen and (max-width:860px) {
        #contents_wrap, .w_custom{width: calc(100% - 30px);}
	}
	@media screen and (max-width:320px) {
        #contents_wrap, .w_custom{width: calc(100% - 20px);}
	}

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

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

───────────────────────────────────────────────────────────*/
    .skip_nav {position:relative;z-index:9999;}
    .skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;}
    .skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;}

    #header{position: sticky; top:0; width: 100%; z-index: 99; background: var(--point-white); border-bottom: 1px solid var(--trans-color); transition: all 0.4s;}
        #wrap:has(.fixed_sec) #header{position: fixed; left:0; }
        #wrap:has(.fixed_sec) #header:not(.on){background: var(--trans-color); border-bottom-color: 1px solid rgba(255,255,255,0.2);}
    #header .w_custom{display: flex; align-items: center; justify-content: space-between; max-width: 1720px; height: 99px;}
    #header .logo{font-size: 0;height: 100%;display: inline-block;position: relative;}
    #header .logo a{position: relative; display: flex; align-items: center; height: 100%; padding:20px 0; box-sizing: border-box; transition: all 0.4s;}
    #header .logo .ov{position: absolute;top:0;left:0;opacity: 0;width: 100%;}
        #wrap:has(.fixed_sec) #header .logo a{opacity: 0;}
        #wrap:has(.fixed_sec) #header .logo .ov{ opacity: 1;}
    #header .gnb{position: absolute;top:0;left:50%;transform: translateX(-50%);height: 100%;display: flex;justify-content: center;width: calc(100% - 400px);}
    #header .gnb > li{position: relative;font-size: var(--title-20);height: calc(100% + 1px);text-align: center;}
    #header .gnb > li > a{display: flex;align-items: center;height: 100%;font-size: 90%;font-weight: 600;color: var(--black-color03);padding: 0 1.2vw; transition: all 0.4s;}
    #header .gnb > li > ul{position: absolute;top: calc(100% - 1px);left:50%;transform: translateX(-50%);width: max-content;min-width:120px;padding:15px 0;background: var(--point-white);opacity: 0;pointer-events: none;transition: all 0.4s;border:1px solid var(--border-color01)}
    #header .gnb > li > ul > li > a{display: block; padding:5px 25px; font-size: 80%; font-weight: 500; color: var(--black-color06); transition: all 0.4s;}
    #header .link_wrap{display: flex;align-items: center;gap: 50px;}
    #header .lang_list{display: flex; align-items: center; gap:16px;}
    #header .lang_list > li{font-size: var(--title-20);}
    #header .lang_list > li > a{font-size: 80%;font-weight: 500;color: rgba(0,0,0,0.4);}
    #header .lang_list > li.on > a{color: var(--black-color03);}
    #header .menu-trigger{display: flex;flex-direction: column;justify-content: space-between;width: 34px;height: 22px;}
    #header .menu-trigger span{width: 100%; height: 2px; background: var(--black-color03);}
    
    .quick_list{position: fixed;right:30px;bottom: 60px;z-index: 9;font-size: var(--title-20);letter-spacing: 0;}
    .quick_list > li + li{margin-top: 10px;} 
    .quick_list > li > a{display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 1px;width: 60px;height: 60px;border-radius: 100%;background: var(--point-color03); box-shadow: 1px 3px 3px rgba(0, 0, 0, 0.1);}
    .quick_list .scr_top a{background: var(--point-color01); font-size: 65%; font-weight: 500; color: var(--point-white);}
    .quick_list .scr_top a:before{display: flex;content:'';width: 8px;height: 8px;border:1px solid var(--trans-color);border-top-color: var(--point-white);border-right-color: var(--point-white);transform: rotate(-45deg);margin-top: 7px;}


        /* color */
            #wrap:has(.fixed_sec) #header :where(.gnb > li > a, .lang_list, .menu-trigger){filter: var(--filter-white);}

        /* over */
            @media screen and (min-width:1024px){
                #wrap:has(.fixed_sec) #header:hover{background: var(--point-white);}
                #wrap:has(.fixed_sec) #header:hover :where(.gnb > li > a, .lang_list, .menu-trigger){filter: none}
                #wrap:has(.fixed_sec) #header:hover .logo a{opacity: 1;}
                #wrap:has(.fixed_sec) #header:hover .logo .ov{ opacity: 0;}
                #header .gnb > li:hover > a{color: var(--point-color01);}
                #header .gnb > li:hover > ul{opacity: 1; pointer-events: all;}
                #header .gnb > li > ul > li > a:hover{color: var(--black-color00);}
            }
        
        /* on */
            #wrap:has(.fixed_sec) #header.on, #header.on{border-bottom-color: var(--border-color01);}
            #wrap:has(.fixed_sec) #header.on :where(.logo, .gnb > li > a, .lang_list, .menu-trigger){filter: none}
            #wrap:has(.fixed_sec) #header.on .logo a{opacity: 1;}
            #wrap:has(.fixed_sec) #header.on .logo .ov{ opacity: 0;}

    @media screen and (max-width: 1380px){
        #header .logo { max-width: 220px; }
        #header .gnb { width: calc(100% - 375px); }
    }

	@media screen and (max-width:1280px){
         #header .logo{max-width: 200px;}

         #header .gnb { width: calc(100% - 300px); }
         #header .gnb > li > a { font-size: 80%; }
         
    }
    @media screen and (max-width:1090px){
        #header .gnb{display:none;}
        #header .link_wrap{gap: 40px;}

        .quick_list{right:20px;bottom: 50px;}
        .quick_list > li > a{width: 60px;height: 60px;}
    }
    @media screen and (max-width:860px){
        #header .w_custom{height: 90px;}
        #header .link_wrap{gap: 30px;}
        #header .menu-trigger{width: 32px;}

        .quick_list{right:15px;bottom: 40px;}
        .quick_list > li > a{width: 55px;height: 55px;}
    }
    @media screen and (max-width:640px){
        #header .w_custom{height: 80px;}
        #header .link_wrap{gap: 25px;}
        #header .lang_list{gap: 12px;}
        #header .menu-trigger{width: 30px; }

        .quick_list{bottom: 30px;}
        .quick_list > li > a{width: 50px;height: 50px;}
    }
    @media screen and (max-width:479px){
        #header .w_custom{height: 75px;}
        #header .link_wrap{gap: 20px;}
        #header .lang_list{gap: 10px;}
        #header .menu-trigger{width: 28px; height: 20px;}

        .quick_list{bottom: 25px;}
        .quick_list > li > a{width: 45px;height: 45px;}
    }
/*───────────────────────────────────────────────────────────

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

───────────────────────────────────────────────────────────*/
    #aside {position:fixed; top:0; right: -100%;width: 80%;max-width: 420px;transition: all 0.8s;height:100%;background:var(--point-white);z-index: 102; box-sizing:border-box;}
        #aside.on {right:0;}

    .aside_bg {position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.6);opacity:0;pointer-events:none;transition: 0.8s;z-index: 100;}

    body:has(#aside.on){overflow:hidden; touch-action:none;}
    body:has(#aside.on) .aside_bg {opacity:1; pointer-events:auto;}

    #aside .aside_box {position:relative;width:100%;height:100%;margin:0;padding: 0 25px 20px;overflow-y:auto;box-sizing:border-box;}
    #aside .aside_box .btn_aside_close {position:absolute;right:60px;top:30px;width:32px;height:32px;cursor:pointer;}
    #aside .aside_box .btn_aside_close .menu-trigger2 {width:100%;height:100%;display: block;}
    #aside .aside_box .btn_aside_close .menu-trigger2 span {transition:all 0.4s;position:absolute;width:100%;height: 1px;background: var(--black-color01);left:0;top:14px;}
    #aside .aside_box .btn_aside_close .menu-trigger2 span:nth-child(1) {transform:translateY(0) rotate(-45deg);}
    #aside .aside_box .btn_aside_close .menu-trigger2 span:nth-child(2) {opacity:0;}
    #aside .aside_box .btn_aside_close .menu-trigger2 span:nth-child(3) {transform:translateY(0) rotate(45deg);}
    #aside .aside_box .btn_aside_close {right:15px;top:15px;width:25px;height:25px;}
    #aside .aside_box .aside_logo {margin-bottom:22px;height: 99px;display: flex;align-items: center;justify-content: flex-start;box-sizing: border-box;}
    #aside .aside_box .aside_logo a {display: flex;font-size:0;height: 100%;align-items: center;padding: 20px 0;box-sizing: border-box;}
    #aside ul.slidemenu {padding:0 0 50px 0;}
    #aside ul.slidemenu li.on > .icons {background: linear-gradient(var(--point-color01),var(--point-color01)),linear-gradient(var(--point-color01),var(--point-color01)),transparent;background-position:center;background-size:100% 1px,0 100%;background-repeat:no-repeat;}
    #aside ul.slidemenu .depth1_li {text-align:left;display:block;vertical-align:top;font-size:0;border-bottom:1px solid rgba(255,255,255,0.2);position:relative;font-size: var(--title-20);}
    #aside ul.slidemenu .depth1_li + .depth1_li {margin-top:0;margin-left:0;}
    #aside ul.slidemenu .depth1_li a,
    #aside ul.slidemenu .depth1_li .icons {display:inline-block;vertical-align:middle;}
    #aside ul.slidemenu .depth1_li a {width:calc(100% - 20px);}
    #aside ul.slidemenu .depth1_li .depth1_a {transition:0.2s;padding:0;line-height: 1.5;color: var(--black-color01);padding: 15px 0;}
    #aside ul.slidemenu .depth1_li .icons {width:20px;height:20px;background: linear-gradient(var(--black-color01),var(--black-color01)),linear-gradient(var(--black-color01),var(--black-color01)),transparent;background-position:center;background-size:100% 1px,1px 100%;background-repeat:no-repeat;cursor:pointer;transition: all 0.4s;}
    #aside ul.slidemenu .depth1_li .depth {padding: 25px 15px;display:none;border:0;background: var(--gray-bg01);margin-bottom: 10px;}
    #aside ul.slidemenu .depth1_li .depth li {padding-left:0;position:relative;}
    #aside ul.slidemenu .depth1_li .depth li + li {margin-top: 10px;}
    #aside ul.slidemenu .depth1_li .depth li a {font-size: 80%;color: var(--black-color06);position:relative;padding-left: 0;font-weight: 400;}

    #aside ul.slidemenu .depth3{display:none; padding:15px 20px; background: var(--point-white); margin:15px 0; box-sizing: border-box;}
    #aside ul.slidemenu .depth1_li .depth .depth3 li a{font-size: 70%;}

    #aside .gall_desc{position: relative; display: flex; align-items: center; gap: 12px; font-size: var(--title-20); cursor: pointer; width: fit-content; margin:0 auto;}
    #aside .gall_desc dt{font-size: 0;}
    #aside .gall_desc dd{font-size: 90%; font-weight: 600; color: var(--black-color01); font-family: var(--font-type02);}

    @media screen and (max-width:1023px) { 
        #aside .aside_box .aside_logo{height:100px;}
    }
    @media screen and (max-width:860px) { 
        #aside .aside_box .aside_logo{height:90px;}
    }
    @media screen and (max-width:640px) { 
        #aside .aside_box .aside_logo{height:80px;}
    }
    @media screen and (max-width:479px) { 
        #aside .aside_box .aside_logo{height: 75px;}
    }


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

	MAIN | index.html

───────────────────────────────────────────────────────────*/
    #wrap:has(.main_visual) #contents_wrap{width: 100%; max-width: 100%; padding-bottom: 0;}
    .main_content{overflow: hidden;}
    
    /* 비주얼 */
        .main_visual {position:relative;}
        #wrap .main_visual .slick-slide {position: relative;display: flex;align-items: center;aspect-ratio: auto 1.77;overflow: hidden;background: var(--black-color00);float: none;}
        .main_visual .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
        .main_visual .thumb{position: absolute;top:0;left:0;width: 100%;height: 100%;background: no-repeat center / cover;filter: blur(10px); transform: scale(1.1); transition: all 2.5s;}
            .main_visual .active .thumb{filter: blur(0); transform: scale(1);}
        .main_visual .txt_box{font-size: var(--title-20); z-index: 3;}
        .main_visual .txt_box h2{font-size: 400%; font-weight: 600; color: var(--point-white); line-height: 1.25;}
        .main_visual .txt_box h2 + h6{margin-top: 12px;}
        .main_visual .txt_box h6{font-size: inherit; font-weight: 300; color: rgba(255,255,255,0.8); line-height: 1.4;}
        .main_visual .txtAni{transform: translateX(-70px); opacity: 0; transition: all 1.2s; transition-delay: 0.2s;}
            .main_visual .txtAni:nth-child(2){transition-delay: 0.4s;}
            .main_visual .active .txtAni{transform: translate(0); opacity: 1;}
		.main_visual video{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width: 100%;height: 100%;min-width: 1920px;}

        .main_visual .controller{position: absolute;left:50%;bottom: 27.1%;transform: translateX(-50%);z-index: 9;display: flex;align-items: center;font-size: var(--title-20);gap: 15px;}
        .main_visual .count{font-size: 80%;font-weight: 400;color: var(--point-white);width: 10px;line-height: 1;}
        .main_visual .slider-progress{position: relative; width: 160px; height: 2px; background: rgba(255,255,255,0.4);}
        .main_visual .progress{position: absolute; top:0; left:0; height: 100%; background: var(--point-white);}
        .main_visual .slickBtn{position: relative;font-size: 0;width: 6px;height: 8px;padding: 0 4px;cursor: pointer;}
            .main_visual .slickBtn:before, .main_visual .slickBtn:after{position: absolute;content:'';width: 2px;height: 100%;top:0;left: 4px;background: var(--point-white);}
            .main_visual .slickBtn:after{left:auto;right: 4px;}
            .main_visual .slickBtn.play:before{width: auto; height: auto; background: none; border:4px solid var(--trans-color); border-left: 5px solid var(--point-white);}
            .main_visual .slickBtn.play:after{opacity: 0;}

        @media screen and (max-width:860px){
            .main_visual .txt_box h2{font-size: 350%;}
                .main_visual .txt_box h2 + h6{margin-top: 8px;}
            .main_visual .slider-progress{width: 140px;}
        }
        @media screen and (max-width:767px){
            .main_visual .txt_box h2{font-size: 320%;}
            .main_visual .slider-progress{width: 120px;}
        }
        @media screen and (max-width:640px){
            .main_visual .txt_box h2{font-size: 300%;}
            .main_visual .txt_box h6{font-size: 90%;}
            .main_visual .controller{bottom: 25%;}
            .main_visual .slider-progress{width: 100px;}
        }
        @media screen and (max-width:479px){
            .main_visual .slickBtn{height: 7px; padding:0 2px;}
                .main_visual .slickBtn:before{left:2px;}
                .main_visual .slickBtn:after{right:2px;}
            .main_visual .txt_box h2{font-size: 270%;}

        }
        @media screen and (max-width:360px){
            .main_visual .txt_box h2{font-size: 240%;}
        }

    /* 공통 */
        .main_title{position: relative; font-size: var(--title-20); box-sizing: border-box;}
        .main_title .desc{position: relative;}
            .main_title .desc + h6{margin-top: 22px;}
        .main_title .desc dt{position: relative;font-size: 400%;font-weight: 700;color: var(--black-color01);line-height: 1.2;z-index: 3;letter-spacing: -0.03em;}
        .main_title .desc dd{position: absolute; top:-30px; left:-30px; font-size: 300%; font-weight: 200; color: var(--border-color03); line-height: 1.2; z-index: 1;}
        .main_title h2{font-size: 320%; font-weight: 700; color: var(--black-color00); line-height: 1.2;}
            .main_title h2 + h5{margin-top: 25px;}
        .main_title h3{font-size: 250%; font-weight: 700; color: var(--black-color00); line-height: 1.2;}
            .main_title h3 + p{margin-top: 18px;}
        .main_title h5{font-size: 130%;font-weight: 500;color: var(--black-color03);line-height: 1.35;letter-spacing: 0;}
            .main_title h5 + p{margin-top: 26px;}
        .main_title h6{font-size: inherit; font-weight: 400; color: var(--black-color03); line-height: 1.5;}
        .main_title h6 small{font-size: 90%;letter-spacing: 0;}
        .main_title p{font-size: 80%;font-weight: 500;color: var(--black-color06);line-height: 1.75;letter-spacing: 0;}
        .main_title .more_arw{margin-top: 70px;}
        .more_arw{display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; background: var(--point-color01); border:1px solid var(--point-color01); padding:15px; box-sizing: border-box; transition: all 0.4s;}
            .more_arw.wh{border-color:var(--point-white); background: var(--trans-color); }
        .more_arw img{filter: var(--filter-white);}

            /* over */
                @media (hover:hover){
                    .more_arw:hover{background: var(--point-white);}
                    .more_arw:hover img{filter: none;}
                    .more_arw.wh:hover{background: var(--point-color01); border-color: var(--point-color01);}
                    .more_arw.wh:hover img{filter: var(--filter-white);}
                }

        @media screen and (max-width:1023px){
            .main_title .desc dd{left:-20px;}
            .main_title .desc + h6{margin-top: 17px;}
            .main_title h2 + h5{margin-top: 20px;}
            .main_title h5 + p{margin-top: 21px;}
            .main_title .more_arw{margin-top: 60px;}
            .more_arw{width: 55px; height: 55px;}

            .main_title h2 { font-size: 280%; }
        }
        @media screen and (max-width:860px){
            .main_title .desc dt{font-size: 380%;}
            .main_title .desc dd{top:-20px; left:-10px; font-size: 280%;}
            .main_title .desc + h6{margin-top: 12px;}
                .main_title h2 + h5{margin-top: 15px;}
                .main_title h5 + p{margin-top: 16px;}
            .main_title .more_arw{margin-top: 50px;}
            .more_arw{width: 50px; height: 50px;}

            .main_title h2 { font-size: 240%; }
            .main_title h5{font-size: 110%;}
        }
        @media screen and (max-width:640px){
            .main_title .desc dt{font-size: 350%;}
            .main_title .desc dd{font-size: 250%;}
            
            .main_title h6 small{font-size: inherit;}
            .main_title .more_arw{margin-top: 40px;}
            .more_arw{width: 45px; height: 45px;}

            .main_title h2{font-size: 220%;}
            .main_title h5{font-size: 100%;}
            
        }
        @media screen and (max-width:479px){
            .main_title .desc dt{font-size: 330%;}
            .main_title .desc dd{font-size: 230%;}
            .main_title .desc + h6{margin-top: 7px;}
            
                .main_title h2 + h5{margin-top: 10px;}
            
                .main_title h5 + p{margin-top: 11px;}
            .main_title h6{font-size: 90%;}
            .main_title .more_arw{margin-top: 30px;}

            .main_title h2{font-size: 200%;}
            
        }
        @media screen and (max-width:360px){
            .main_title .desc dt{font-size: 310%;}
            .main_title .desc dd{font-size: 210%;}
            
        }

    /* about */
        .main_about{position: relative;padding: 170px 0 200px;box-sizing: border-box;overflow: hidden;}
            .main_about:before{position: absolute;content:'';width: 98vw;height: 53.5vw;background: url('../images/skin/main_about_bg.svg') no-repeat center / 100% auto;left: 1.5%;bottom: -8.5vw;}
        .main_about .w_custom{display: flex; flex-wrap: wrap;}
        .main_about .main_title{width: 48%;padding: 20px 30px 0 0;}
        .main_about .cont{width:52%;}
        .main_about .info_list{display: flex;flex-wrap: wrap;gap:75px 8.4vw;}
        .main_about .info_list > li{width: calc(100% / 2 - 4.2vw);box-sizing: border-box;}
        .main_about .info_list .icon{display: flex; font-size: 0;}
            .main_about .info_list .icon + .desc{margin-top: 26px;}
        .main_about .info_list .desc{font-size: var(--title-20);}
        .main_about .info_list .desc dt{font-size: inherit; font-weight: 400; color: var(--black-color06); line-height: 1.4;}
        .main_about .info_list .desc dt + dd{margin-top: 11px;}
        .main_about .info_list .desc dd{font-size: 250%; font-weight: 700; color: var(--black-color01); line-height: 1.2;}

        @media screen and (max-width:1023px){
            .main_about{padding:120px 0 150px}
            .main_about .info_list .icon{height: 68px;}
            .main_about .info_list .icon + .desc{margin-top: 21px;}
            .main_about .info_list .desc dt + dd{margin-top: 7px;}
        }
        @media screen and (max-width:860px){
            .main_about:before{bottom:0;}
            .main_about .main_title{width: 100%; padding:0 0 40px;}
            .main_about .cont{width: 100%;}
        }
        @media screen and (max-width:640px){
            .main_about{padding:100px 0}
            .main_about .info_list{row-gap: 60px;}
            .main_about .info_list .icon{height: 62px;}
            .main_about .info_list .icon + .desc{margin-top: 16px;}
        }
        @media screen and (max-width:479px){
            .main_about{padding:70px 0}
            .main_about .info_list{row-gap: 50px;}
            .main_about .info_list .icon{height: 58px;}
            .main_about .info_list .icon + .desc{margin-top: 12px;}
            .main_about .info_list .desc dt{font-size: 90%;}
            .main_about .info_list .desc dd{font-size: 220%;}
        }
        @media screen and (max-width:360px){
            .main_about .info_list{row-gap: 40px;}
            .main_about .info_list .icon{height: 52px;}
            .main_about .info_list .desc dt{font-size: 85%;}
            .main_about .info_list .desc dd{font-size: 200%;}
        }

    /* Business */
        .main_business{position: relative;}
        .main_business .main_title.fixed{position: absolute;top: 7.3vw;left: 5.6vw; width: calc(50% - 11.2vw);  z-index: 5;}
        .main_business .main_title *{filter: var(--filter-white);}
        .main_business .main_title .desc dd{opacity: 0.4;}
        .main_business .main_title h6{opacity: 0.6;}
        .main_business .main_title p{opacity: 0.6;}
        .main_business .tab_cont {position: relative; width: 100%; height: 940px; box-sizing: border-box;}
        .main_business .item{position: absolute; top:0; left:0; background: url('../images/skin/main_business_bg01.jpg') no-repeat center / cover; width: 100%; height:100%; opacity: 0 !important; pointer-events: none; transition: all 0.4s;}
            .main_business .item.on{opacity: 1 !important; pointer-events: all;}
            .main_business .item:nth-child(2){background-image: url('../images/skin/main_business_bg02.jpg');}
            .main_business .item:nth-child(3){background-image: url('../images/skin/main_business_bg03.jpg');}
            .main_business .item:nth-child(4){background-image: url('../images/skin/main_business_bg04.jpg');}
            .main_business .item:nth-child(5){background-image: url('../images/skin/main_business_bg05.jpg');}
        .main_business .item .main_title{width: 50%;height: 100%;padding: 4.35vw 4.17vw;box-sizing: border-box;display: flex;flex-direction: column;justify-content: flex-end;}
        .main_business .item .main_title *{filter: var(--filter-white);}
        .main_business .tab_list{position: absolute; top:0; right:0; display: flex; flex-wrap: wrap; width: 50%; height: 100%; z-index: 5;}
        .main_business .tab_list > li{position: relative;width: 50%;height: 50%;display: flex;align-items: flex-end;padding: 2.9vw 2.6vw;box-sizing: border-box;border-left: 1px solid rgba(255,255,255,0.3);cursor: pointer;}
            .main_business .tab_list > li:nth-child(n+3){border-top: 1px solid rgba(255,255,255,0.3);}
            .main_business .tab_list > li:before{position: absolute; content:''; width: 100%; height: 100%; background:var(--black-color00); top:50%; left:50%; transform: translate(-50%, -50%); backdrop-filter: blur(20px); opacity: 0.3; transition: all 0.4s;}
        .main_business .tab_list .desc{position: relative; font-size: var(--title-20);}
        .main_business .tab_list .desc dt{font-size: 180%; font-weight: 600; color: var(--point-white); line-height: 1.3;}
            .main_business .tab_list .desc dt + dd{margin-top: 9px;}
        .main_business .tab_list .desc dd{font-size: 90%;font-weight: 300;color: var(--point-white);line-height: 1.5;}
        
            /* over */
                @media (hover:hover){
                    .main_business .tab_list > li:hover:before{width: calc(100% - 2.6vw);height: calc(100% - 2.6vw);background: var(--point-color01);opacity: 0.8;border-radius: 20px;}
                }
        @media screen and (min-width:861px){
            .main_business .main_title .desc + h6{margin-top: 14px;}
        }
        @media screen and (max-width:1300px){
            .main_business .main_title p br{display: none;}
        }
        @media screen and (max-width:1023px){
            .main_business .main_title.fixed{left:40px; width: 100%; }
            .main_business .item .main_title{width: 100%; padding:30px 30px calc(35% + 5px);}
            .main_business .tab_cont{height: 91.8vw;}
            .main_business .tab_list{width: 100%; height: 35%; top:auto; bottom:0;}
            .main_business .tab_list > li{border-top: 1px solid rgba(255,255,255,0.3); padding:30px;}
            .main_business .tab_list > li:nth-child(2n+1){border-left: 0;}
        }
        @media screen and (max-width:860px){
			.main_business .main_title.fixed{left:25px;}
            .main_business .item .main_title{padding:30px 20px 330px;}
            .main_business .tab_cont{height: 900px;}
			.main_business .tab_list > li {padding: 30px 30px;}
            .main_business .tab_list .desc dt{font-size: 160%;}
            .main_business .tab_list .desc dd{font-size: 85%;}
        }
        @media screen and (max-width:767px){
            .main_business .tab_list > li{padding:30px 25px;}
        }
        @media screen and (max-width:640px){
            /* .main_business{padding-top:100px;}
            .main_business .main_title.fixed{position: relative; top:auto; left:auto; width: calc(100% - 30px); margin:0 auto 40px;}
            .main_business .main_title.fixed *{filter: none;}
            .main_business .tab_cont{height: auto;}
            .main_business .item{position: relative;top:auto; left:auto; height: auto; opacity: 1 !important; pointer-events: all;}
            .main_business .item .main_title{padding:100px 30px;}
            .main_business .tab_list{display:none;} */

            .main_business .main_title.fixed{top:45px; left:25px; width: calc(100% - 25px); }
            .main_business .tab_cont{height: 930px;}
            .main_business .item .main_title{padding-bottom: 450px;}
            .main_business .tab_list{height: 420px;}
            .main_business .tab_list > li{width: 100%; border-left: 0; height: calc(100% / 4); padding:0 20px; align-items: center;}  
            .main_business .tab_list .desc dt{font-size: 150%;}
            .main_business .tab_list .desc dt + dd{margin-top: 5px;}
        }
        @media screen and (max-width:479px){
        }
    
    /* 채용 */
        .main_employment{padding: 120px 0 115px;}
        .main_employment .cont{position: relative;height: 560px;display: flex;align-items: center;padding: 30px 6.3vw 35px;box-sizing: border-box;} 
        .main_employment .thumb{position: absolute; top:0; left:0; width: 100%; height: 100%; border-radius: 30px; overflow: hidden;}
        .main_employment .thumb:before{position: absolute; content:''; width: 100%; height: 100%; background: linear-gradient(90deg, #1F2329 16%, rgba(0, 0, 0, 0.00) 100%); top:0; left:0;}
        .main_employment .thumb img{width: 100%; height: 100%; object-fit: cover;}
        .main_employment .main_title{z-index: 3;}
        .main_employment .main_title :where(h3, p){filter: var(--filter-white);}
        .main_employment .main_title p{line-height: 1.5;}

        @media screen and (min-width:861px){
            .main_employment .main_title h3 + p{margin-top: 16px;}
            .main_employment .main_title .more_arw{margin-top: 60px;}
        }
        @media screen and (max-width:1023px){
            .main_employment .cont{height: auto; padding:16vw 6.3vw;}
        }
        @media screen and (max-width:640px){
            .main_employment{padding:100px 0;}
            .main_employment .thumb{border-radius: 15px;}
        }
        @media screen and (max-width:479px){
            .main_employment{padding:70px 0;}
            .main_employment .cont{padding:70px 30px;}
        }

        
    
    /* Notice */
        .main_notice{padding-bottom: 140px;}
        .main_notice .main_title{padding-right: 100px;}
        .main_notice .controller{position: absolute; bottom:0; right:0; display: flex; align-items: center; gap:20px;}
        .main_notice .controller .swiper_arw{position: relative; top:auto; left:auto; right:auto; bottom:auto; margin:0; width: 40px; height: 40px; background: url('../images/skin/swiper_arw.svg') no-repeat center;}
            .main_notice .controller .swiper_arw.swiper-button-next{transform: scale(-1, -1);}
            .main_notice .controller .swiper_arw:after{display: none;}

        .main_notice .notiSwiper {margin-top: 30px; overflow: hidden; box-sizing: border-box;}
        .main_notice .notiSwiper .swiper-wrapper{display: flex;}
        .main_notice .notiSwiper .swiper-slide{position: relative;border-top: 2px solid var(--black-color01);border-bottom: 1px solid var(--border-color01);width: calc(100% / 3 - 26.67px);padding: 31px 0 126px;font-size: var(--title-20);box-sizing: border-box;}
        .main_notice .notiSwiper .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;} 
        .main_notice .notiSwiper .desc dt{font-size: 120%; font-weight: 600; color: var(--black-color01); line-height: 1.34; white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.4s;}
            .main_notice .notiSwiper .desc dt + dd{margin-top: 30px;}
        .main_notice .notiSwiper .desc dd{font-size: 80%; font-weight: 400; color: var(--black-color08); line-height: 1.625; white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
        .main_notice .notiSwiper .date{position: absolute;left: 0;bottom:30px;font-size: 75%;font-weight: 200;color: var(--black-color08);line-height: 1;}
        .main_notice .notiSwiper .more_arw{position: absolute; right:0; bottom:20px; width: 30px; height: 30px; padding:8px; transform: translateX(30px); opacity: 0;}
        
            /* over */
                @media (hover:hover){
                    .main_notice .notiSwiper .swiper-slide:hover .desc dt{color: var(--point-color01);}
                    .main_notice .notiSwiper .swiper-slide:hover .more_arw{transform: translate(0); opacity: 1;}
                }

        @media screen and (max-width:1023px){
            .main_notice{padding-bottom: 120px;}
        }
        @media screen and (max-width:860px){
            .main_notice .controller{gap: 15px;}
            .main_notice .controller .swiper_arw{width: 35px;background-size: 28px auto;}
            .main_notice .notiSwiper{margin-top: 25px;}
            .main_notice .notiSwiper .swiper-slide{padding:25px 0 100px;}
            .main_notice .notiSwiper .desc dt + dd{margin-top: 25px;}
            .main_notice .notiSwiper .date{bottom:25px;}
        }
        @media screen and (max-width:640px){
            .main_notice{padding-bottom: 100px;}
            .main_notice .controller{gap: 10px;}
            .main_notice .controller .swiper_arw{width: 30px;background-size: 26px auto;}
            .main_notice .notiSwiper{margin-top: 20px;}
            .main_notice .notiSwiper .swiper-slide{padding:25px 0 80px;}
            .main_notice .notiSwiper .desc dt + dd{margin-top: 20px;}
            .main_notice .notiSwiper .date{bottom:20px;}
        }
        @media screen and (max-width:479px){
            .main_notice{padding-bottom: 70px;}
            .main_notice .controller .swiper_arw{width: 28px;background-size: 24px auto;}
            .main_notice .notiSwiper{width: calc(100% + 30px); margin:15px 0 0 -15px; padding:0 20vw 0 15px;}
            .main_notice .notiSwiper .swiper-slide{padding:25px 0 70px;}
            .main_notice .notiSwiper .desc dt + dd{margin-top: 15px;}
        }
        @media screen and (max-width:320px){
            .main_notice .notiSwiper{width: calc(100% + 20px); margin-left:-10px; padding:0 20vw 0 10px;}
        }

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

	FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
    #footer{position: relative; background: var(--point-color02); box-sizing: border-box;} 
    #footer .link_list{display: flex; flex-wrap: wrap; gap: 10px 40px; border-bottom: 1px solid rgba(255,255,255,0.1);}
    #footer .link_list > li{font-size: var(--title-20);}
    #footer .link_list > li > a{display: block; font-size: 14px; font-weight: 300; color: var(--black-color08); padding:20px 0;}
    #footer .link_list > li > a strong{color: var(--point-white); font-weight: inherit;}
    #footer .cont{display: flex;flex-wrap: wrap;gap: 40px 0;padding: 77px 0 60px;box-sizing: border-box;}
    #footer .info{width: 52%;padding-right: 30px;box-sizing: border-box;}
    #footer .logo{font-size: 0; max-width: 60%; margin-bottom: 33px;}
    #footer .exp_list > li{display: flex;flex-wrap: wrap;}
    #footer .exp_list .desc:not(:last-child):after{display: inline-flex;content:'';width: 1px;height: 10px;background: var(--border-color03);margin:0 15px;opacity: 0.2;transform: translateY(100%);}
    #footer .exp_list .desc dt{flex-shrink:0;}
    #footer .desc{font-size: var(--title-20);line-height: 2.3;display: flex; gap:0 4px;}
    #footer .desc :where(dt, dd){font-size: 13px; font-weight: 400; color: var(--black-color10);}
    #footer .desc.copy{gap:0 20px;margin-top: 50px;letter-spacing: 0; flex-wrap: wrap;}
    #footer .gnb{display: flex;gap: 20px;width: 48%;}
    #footer .gnb > li{width: 100%; font-size: var(--title-20); padding-right: 15px; box-sizing: border-box;}
    #footer .gnb > li > a{font-size: 15px; font-weight: 500; color: var(--point-white);}
    #footer .gnb > li > ul{padding:15px 0 0;}
    #footer .gnb > li > ul > li > a{display: block; font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.6); padding:5px 0;}

    @media screen and (max-width: 1330px){
        #footer .exp_list > li:nth-of-type(2) .desc::after { background: transparent; }
        #footer .exp_list > li:nth-of-type(3) .desc:nth-of-type(2)::after { background: transparent; }
    }

    @media screen and (max-width: 1100px){
        #footer .exp_list > li:nth-of-type(3) .desc::after { background: transparent; }
    }

    @media screen and (max-width:1023px){
        #footer .link_list{column-gap: 35px;}
        #footer .cont{padding:60px 0;}
        #footer .logo{margin-bottom: 28px;}
        #footer .info{width: 100%; padding-right: 0;}
        #footer .desc.copy{margin-top: 45px;}
        #footer .gnb{width: 100%;}

        #footer .exp_list > li:nth-of-type(2) .desc::after { background: var(--border-color03); }
        #footer .exp_list > li:nth-of-type(3) .desc:nth-of-type(2)::after { background: var(--border-color03); }
        #footer .exp_list > li:nth-of-type(3) .desc::after { background: var(--border-color03); }
    }
    @media screen and (max-width:860px){
        #footer .link_list{column-gap: 30px;}
        #footer .cont{padding:50px 0;}
        #footer .logo{margin-bottom: 23px;}
        #footer .desc.copy{margin-top: 40px;}
    }
    @media screen and (max-width:640px){
        #footer .link_list{column-gap: 25px;}
        #footer .link_list > li > a{font-size: 13px;}
        #footer .cont{padding:40px 0;}
        #footer .logo{margin-bottom: 18px;}
        #footer .exp_list .desc:not(:last-child):after{height: 8px;}
        #footer .desc.copy{margin-top: 35px;}
        #footer .desc :where(dt, dd){font-size: 12px;}
        #footer .gnb{display: none;}
    }
    @media screen and (max-width:479px){
        #footer .link_list{column-gap: 20px;}
        #footer .link_list > li > a{padding:15px 0;}
        #footer .logo{margin-bottom: 13px;}
        #footer .exp_list .desc:not(:last-child):after{margin:0 8px; background: none;}
        #footer .desc.copy{margin-top: 30px;}
    }