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

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

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

/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
	/** PC 일반 **/
		#wrap {position:relative; overflow: clip; box-sizing: border-box; z-index: 5;}
		#contents_wrap, .w_custom {position: relative; width: calc(100% - 60px); max-width: 1400px; margin:0 auto; box-sizing: border-box;}
        #contents_wrap{padding-bottom: 150px;}

        @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

───────────────────────────────────────────────────────────*/
    #header{position: sticky; top:0; width: 100%; z-index: 100; background: var(--trans-color); height: 110px; transition: all 0.4s; transform: translateY(0);}
        #header.hid{transform: translateY(-100%); }
        #header.on{background: var(--point-white); box-shadow: 3px 3px 5px rgba(0,0,0,0.1);}
    #header .w_custom{max-width: 1760px;display: flex;align-items: center;justify-content: space-between;height: 100%;padding:17px 0;}
    #header .logo{font-size: 0;height: 100%;box-sizing: border-box;}
	#header .logo a{display: flex;align-items: center;height: 100%;box-sizing: border-box;}
    #header .cont{display: flex; gap: 80px;}
    #header .gnb{display: flex;gap: 70px;font-size: var(--title-20);letter-spacing: 0; text-align: center;}
    #header .gnb > li{position: relative;height: 100%; box-sizing: border-box;}
    #header .gnb > li > a{display: flex;align-items: center;font-weight: 600;color: var(--black-color03);height: 100%; transition: all 0.4s;}
    #header .gnb > li > ul{position: absolute;top:calc(100% + 17px);left:50%;transform: translateX(-50%);width: max-content;min-width: 150px;background: var(--point-color02);padding:15px 0;box-sizing: border-box;clip-path: circle(0 at 50% 50%);opacity: 0;transition: all 0.6s;}
    #header .gnb > li > ul > li > a{display: block;font-size: 85%;font-weight: 400;color: var(--point-white);padding:8px 20px;box-sizing: border-box;}
    #header .lang_list{display: inline-flex; gap:5px 18px;}
    #header .lang_list > li{font-size: var(--title-20);}
    #header .lang_list > li > a{font-size: 80%;transition: all 0.4s;display: flex;align-items: center;font-weight: 600;height: 100%;font-weight: 600;color: var(--black-color03);}
    #header .lang_list > li.on > a{color: var(--point-color01);}

    #header .menu-trigger{display: none;justify-content: center;flex-direction: column;width: 30px;gap: 8px;align-items: center;}
    #header .menu-trigger span{width: 100%; height: 2px; background: var(--black-color03);}

    .view_more{position: relative; display: inline-flex; align-items: center; justify-content: center; text-align: center; font-size: var(--title-20); color: var(--black-color03); font-weight: 500; width: 160px; height: 60px; box-sizing: border-box; border-radius: 10px; padding:0 10px; transition: all 0.4s;}
        .view_more:before{position: absolute; content:''; width: 100%; height: 100%; border:2px solid var(--black-color03); top:0; left:0; box-sizing: border-box; border-radius: inherit; transition: all 0.4s;}
        .view_more:after{position: absolute; content:''; width: 0; height: 0; top:50%; left:50%; transform: translate(-50%, -50%); border-radius: inherit; background: var(--point-color02); opacity: 0; transition: all 0.4s;}
    .view_more span{position: relative; z-index: 5; transition: all 0.4s;}

        .view_more.lg{width: 200px; height: 70px;}
        .view_more.lg span{font-size: 110%;}
        .view_more.auto{width: auto; padding:0 25px;}
        .view_more.wh:before{border-color: rgba(255,255,255,0.4);}
        .view_more.wh:after{background: var(--point-white);}
        .view_more.wh span{filter: var(--filter-white); color: var(--point-color02);}
        .view_more.gary:before{border-color: rgba(34, 34, 34, 0.5); opacity: 0.4;}
        .view_more.right_gary:before{border-color: rgba(204, 204, 204, 0.4);}
        .view_more.dwn span{display: flex; gap: 15px;}
        .view_more.dwn span:after{display: inline-flex; content:''; width: 19px; height: 21px; background: url('../images/skin/more_dwn.svg') no-repeat center / 100% auto;}

        /* main */
            #wrap:has(.main_visual, .goods_view) #header{margin-bottom: -110px;}
            #wrap:has(.main_visual, .goods_view) #header:not(.on) :where(.logo, .gnb > li > a, .view_more span, .menu-trigger span, .lang_list > li:not(.on) > a){filter: var(--filter-white);}
            #wrap:has(.main_visual, .goods_view) #header:not(.on) :where(.lang_list > li.on > a){filter: var(--point-color01);}
            #wrap:has(.main_visual, .goods_view) #header:not(.on) .view_more:not(:hover):before{border-color: var(--point-white);}

        /* over */
            @media screen and (min-width:1024px){
                #header .gnb > li:hover > a{color: var(--point-color01);}
                #header .lang_list > li:hover > a{color: var(--point-color01);}
                #header .gnb > li:hover > ul{clip-path: circle(100% at 50% 50%); opacity: 1;}
                #wrap:has(.main_visual) #header .view_more:hover span,
                #wrap.sub_board #header .view_more:hover span,
                #wrap.sub_goods #header .view_more:hover span {
                    filter: var(--filter-white);
                }
                .view_more:hover:before{border-color: var(--trans-color);}
                .view_more:hover:after{width: 100%; height: 100%; opacity: 1;}
                .view_more.wh:hover span{filter: none;}
                .view_more.gary:hover span, .view_more.right_gary:hover span{filter: var(--filter-white);}
            }

    @media screen and (max-width:1600px){
        #header .cont{gap: 5vw;}
        #header .gnb{gap: 4.2vw;}
    }
    @media screen and (max-width:1200px){
        #header .cont{gap: 4.5vw;}
        #header .gnb{gap: 3.7vw;}
        #header .gnb > li{font-size: 90%;}
    }
    @media screen and (max-width:1023px){
        #header .gnb{display: none;}
        #header .menu-trigger{display: flex;}

        .view_more{width: 140px; height: 55px;}
        .view_more.lg{width: 180px; height: 65px;}
    }
    @media screen and (max-width:860px){
        #header{height: 100px;}
            #wrap:has(.main_visual) #header{margin-bottom: -100px;}
    }
    @media screen and (max-width:640px){
        #header{height: 90px;}
            #wrap:has(.main_visual) #header{margin-bottom: -90px;}
        #header .w_custom{}
        #header .lang_list{gap:5px 15px;}
        #header .logo a{padding:5px 0;}
        #header .view_more{display: none;}
        .view_more{width: 120px; height: 50px; border-radius: 5px;}
        .view_more.lg{width: 160px; height: 60px;}
    }
    @media screen and (max-width:479px){
        #header{height: 80px;}
            #wrap:has(.main_visual) #header{margin-bottom: -80px;}
        #header .logo a{padding:0;}
        #header .menu-trigger{width: 28px; gap: 7px;}
        .view_more{width: 110px; height: 45px;}
        .view_more.lg{width: 140px; height: 55px;}
        .view_more span{font-size: 95%;}
    }


    /* 퀵메뉴 */
        .right_quick{position: fixed;top: 72%;right:-300px;transform: translateY(-50%);font-size: var(--title-20);transition: all 0.4s;display: flex;align-items: flex-start;z-index: 100;opacity: 0;pointer-events: none;}
            .right_quick:has(.toggle_btn.on){right:0;top: 50%;}
            .right_quick.on{opacity: 1; pointer-events: all;}
        .right_quick .btn_list > li{width: 60px;}
        .right_quick .toggle_btn{width: 100%;background: var(--point-color01);border-radius: 30px 0 0;padding:30px 0;font-size: 90%;font-weight: 500;color: var(--point-white);writing-mode: tb-rl;display: flex;align-items: center;justify-content: center; gap: 10px;}
            .right_quick .toggle_btn:before{display: inline-flex;content:'';width: 6px;height: 6px;border:2px solid var(--trans-color);border-top-color: var(--point-white);border-left-color: var(--point-white);border-radius: 2px;transform: rotate(-45deg) translate(2px, 2px); transition: all 0.4s;}
            .right_quick .toggle_btn.on:before{transform: rotate(-45deg) translate(0) scale(-1,-1);}
        .right_quick .scr_top{display: flex;align-items: center;justify-content: center;width: 100%;height: 60px;background: var(--black-color11);font-size: 0;}
        .right_quick .form_wrap{background: var(--black-color01); width: 300px; transition: all 0.4s; box-sizing: border-box; padding:30px; max-height: 75vh; overflow: hidden; overflow-y: auto;}
        .right_quick .form_wrap :where(table, tbody, tr, th, td){display: block; width: 100%;}
        .right_quick .form_wrap table{font-size: var(--title-20);}
        .right_quick .form_wrap table th{display: none;}
        .right_quick .form_wrap table td{font-size: 70%; font-weight: 400; color: var(--point-white); padding:5px 0;}
        .right_quick .form_wrap table strong{display: none;}
        .right_quick .form_wrap table :where(input[type="text"], input[type="password"]){width: 100%;height: 40px;padding:0 15px;box-sizing: border-box;font-size: inherit;background: var(--black-color02);color: inherit;border-radius: 6px; border:1px solid var(--black-color02);}
        .right_quick .form_wrap table :is(input[type="text"], input[type="password"], textarea):focus{border-color: var(--point-white);}
        .right_quick .form_wrap table textarea{width: 100%;resize: none;font-size: inherit;padding:15px;box-sizing: border-box;background: var(--black-color02);color: inherit;border: 1px solid var(--black-color02);min-height:120px;border-radius: 6px; line-height:1.5;}

        .right_quick .form_wrap table :where(input[type="text"], input[type="password"]):-webkit-autofill,.right_quick .form_wrap table :where(input[type="text"], input[type="password"]):-webkit-autofill:hover, input:-webkit-autofill:focus, .right_quick .form_wrap table :where(input[type="text"], input[type="password"]):-webkit-autofill:active{-webkit-text-fill-color:var(--point-white);}

        #wrap .right_quick .form_wrap table td:has(#password){display: none;}
        #wrap .right_quick .form_wrap table td .captcha_wrap{display: flex; flex-wrap: wrap; gap: 10px;}
        #wrap .right_quick .form_wrap #main-captcha-box{width: 180px;}
        #wrap .right_quick .form_wrap #main-refresh-code{position: relative; width: calc(100% - 190px); font-size: 0; background: var(--black-color02); border:0; cursor: pointer;padding:0;height:40px;}
        #wrap .right_quick .form_wrap #main-refresh-code:before{position: absolute; content:''; width:20px; height: 20px; top: 50%; left: 50%; transform: translate(-50%, -50%); background:url(../images/skin/icon_btn_reset.png) no-repeat center; background-size: 100% auto; filter: var(--filter-white);}
        #wrap .right_quick .form_wrap #main-captcha{margin-top:10px;}
        .right_quick .more_box{justify-content: center;}

        #wrap .right_quick .policy_cont{margin-top:15px;}
		.right_quick .policy_cont > div label{color: var(--point-white); margin:0;}
		#wrap .right_quick .policy_cont input[type="checkbox"] + label{color:#fff;font-weight:400;font-size:16px;}

        #wrap .right_quick .more_box{width:100%;margin-top:15px;}
        #wrap .right_quick .more_box .main_more{display: inline-flex;box-sizing:border-box;align-items: center;justify-content: center;height:50px;width:100%;background:var(--point-white);font-size:15px;color:var(--black-color03);font-weight:500;border-radius: 8px;}
        #wrap .right_quick .more_box .main_more span{display: block;font-size:inherit;color:inherit;font-weight:inherit;}

        @media screen and (max-width:1023px){
            .right_quick .btn_list > li{width: 55px;}
            .right_quick .scr_top{height: 55px;}
        }
        @media screen and (max-width:860px){
            .right_quick .btn_list > li{width: 50px;}
            .right_quick .toggle_btn{border-radius: 20px 0 0 0;}
            .right_quick .scr_top{height: 50px;}
        }
        @media screen and (max-width:640px){
            .right_quick{width: 100%; right: calc(-100% + 45px);}
                .right_quick:has(.toggle_btn.on){right: 0;}
                body:has(.toggle_btn.on){overflow: clip; touch-action: none;}
            .right_quick .btn_list > li{width: 45px;}
            .right_quick .toggle_btn{border-radius: 15px 0 0 0;}
            .right_quick .scr_top{height: 45px;}
            .right_quick .form_wrap{width: calc(100% - 45px);}
            #wrap .right_quick .form_wrap #main-refresh-code{width:40px;}
        }
        @media screen and (max-width:479px){
            .right_quick{right: calc(-100% + 40px);}
            .right_quick .btn_list > li{width: 40px;}
            .right_quick .scr_top{height: 40px;}
            .right_quick .form_wrap{width: calc(100% - 40px);}
        }

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

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

───────────────────────────────────────────────────────────*/
	/* PC 일반 */
	#aside {overflow:hidden;top: -100%;right: 0;width:100%;transition:0.5s;height:100%;box-sizing:border-box;position:fixed;background: var(--point-color03);z-index:110;opacity: 0;pointer-events: none;}
    #aside .w_custom{max-width: 1800px;}
        #aside.on {top:0; opacity: 1; pointer-events: all;}
        body:has(#aside.on){overflow: clip; touch-action: none;}
	#aside .aside_box {height:100%; overflow:hidden; overflow-y:auto;position:relative;box-sizing:border-box;}

	#aside .aside_top {position: relative;display:flex;align-items:center;justify-content:space-between;height: 120px;}
	#aside .aside_right {display: flex; align-items: center; justify-content: center;}
	#aside .btn_aside_close {width: 27px;height: 27px;box-sizing: border-box;position:relative;}
	#aside .btn_aside_close .menu-trigger2 {width:100%;height:100%;display: block;}
	#aside .btn_aside_close .menu-trigger2 span {transition:0.3s;position:absolute;width:100%;height:2px;background:var(--point-white);left:0;top: 50%;transform: translateY(-50%);}
	#aside .btn_aside_close .menu-trigger2 span:nth-child(1) {transform:translateY(0) rotate(-45deg);}
	#aside .btn_aside_close .menu-trigger2 span:nth-child(2) {opacity:0;}
	#aside .btn_aside_close .menu-trigger2 span:nth-child(3) {transform:translateY(0) rotate(45deg);}
	#aside .aside_logo{filter: var(--filter-white);}
	#aside .aside_menu {width:100%;box-sizing:border-box;padding: 70px 10px;}
	#aside .aside_menu .slidemenu {width:100%;box-sizing:border-box;padding-left:40px;border-left: 1px solid rgba(255,255,255,0.2);}
	#aside .aside_menu .slidemenu a {position: relative;display: block;color: var(--point-white);opacity: 0.7;transition: all 0.4s;}
	#aside .aside_menu .slidemenu .icons {display: none; position:absolute; right: 0; top: 50%; transform: translateY(-50%); width: 30px; height: 30px;}
	#aside .aside_menu .slidemenu .icons:before, #aside .aside_menu .slidemenu .icons:after {content: "";position: absolute;left: 50%;top: 50%;transform: translate(calc(-50% + 0.5px),calc(-50% + 0.5px));background: var(--point-white);}
	#aside .aside_menu .slidemenu .icons:before {width: 70%; height: 1px;}
	#aside .aside_menu .slidemenu .icons:after {width: 1px; height: 70%;}
	#aside .aside_menu .slidemenu .on .icons:after {opacity: 0;}
	#aside .aside_menu .slidemenu > li {position: relative; display: flex; align-items: center; padding: 24px 0; font-size: var(--title-20);}
	#aside .aside_menu .slidemenu > li:before {content: "";position: absolute;left: -41px;top: 0;width: 1px;height: 0;background: var(--point-white);transition: all 0.3s;}
	#aside .aside_menu .slidemenu > li > a {width: 220px;font-size: 130%;}
	#aside .aside_menu .slidemenu .depth {display: flex; align-items: center; width: calc(100% - 220px);}
	#aside .aside_menu .slidemenu .depth > li + li {margin-left: 40px;}
	#aside .aside_menu .slidemenu .depth > li > a {font-size: 90%; font-weight: 300;}
	
	/* hover */
		@media only screen and (min-width:1024px) {
			#aside .aside_menu .slidemenu > li:hover:before {height: 100%;}
			#aside .aside_menu .slidemenu > li:hover > a {opacity: 1;}
			#aside .aside_menu .slidemenu > li:hover .depth > li > a {opacity: 1;}
			#aside .aside_menu .slidemenu > li .depth > li:hover > a {color: var(--point-color01);}
		}
		@media only screen and (min-width:641px) {
			#aside .aside_menu .slidemenu .depth {display: flex !important;}
		}
		
	@media only screen and (max-width:1023px) {
		#aside .aside_top {height: 110px;}
		#aside .aside_logo {}
		#aside .aside_link a {height: 38px;}
	
	}
	@media only screen and (max-width:860px) {
		#aside .aside_top {height: 100px;}
		#aside .aside_logo {width: 100px;}
		#aside .aside_link a {height: 36px;}
	
		
		#aside .aside_menu {padding: 55px 10px;}
		#aside .aside_menu .slidemenu {padding-left: 35px;}
		#aside .aside_menu .slidemenu > li {padding: 20px 0;}
		#aside .aside_menu .slidemenu > li > a {width: 200px;}
		#aside .aside_menu .slidemenu .depth {width: calc(100% - 200px);}
	}
	@media only screen and (max-width:640px) {
		#aside .w_custom{width: 100%; padding:0 15px;}
		
		#aside .aside_top {height: 90px;}
		#aside .aside_logo {width: 83px;}
		#aside .aside_link {position: absolute; left: 0; top: 93px; width: 100%; opacity: 0.8;}
		#aside .aside_link a {width: 100%; height: 38px;}
		#aside .aside_link a span {padding-top: 0;}
		
		#aside .aside_menu {padding: 75px 0 60px;}
		#aside .aside_menu .slidemenu {padding: 0; border: 0;}
		#aside .aside_menu .slidemenu a {opacity: 1;}
		#aside .aside_menu .slidemenu > li {display: block; padding: 0;}
		#aside .aside_menu .slidemenu > li > a {width: 100%; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,0.2); font-size: 120%;}
        #aside .aside_menu .slidemenu > li > a > .icons {display: block;}
		#aside .aside_menu .slidemenu .depth {display: none; width: 100%; box-sizing: border-box; padding: 15px 18px; background: rgba(255,255,255,0.2);}
		#aside .aside_menu .slidemenu .depth > li + li {margin-left: 0;}
		#aside .aside_menu .slidemenu .depth > li > a {padding: 12px 0;}
	}
	@media only screen and (max-width:479px) {
		#aside .aside_top {height: 80px;}
		#aside .aside_logo {}
		#aside .aside_link {top: 83px;}
		#aside .aside_link a {padding: 0 12px;}
		
		#aside .aside_menu {padding: 50px 0 60px;}
	}

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

	MAIN | index.html

───────────────────────────────────────────────────────────*/
    #wrap:has(.main_visual) #contents_wrap{width: 100%; max-width: 100%; padding: 0;}
    #wrap:has(.main_visual) .w_custom{max-width: 1680px;}

    /* 인트로 */
        body:has(.main_intro){overflow: hidden;}
        .main_intro{position: relative; width: 100%; height: 100vh; box-sizing: border-box; text-align: center;  z-index: 1; margin-bottom: inherit; transition: all 2s; transition-delay: 2s;}
        .main_intro .cont{position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: var(--title-20); background: var(--point-white); z-index: 9; clip-path: circle(0% at 50% 50%); transition: all 5s; transition-delay: 0.6s;}
        .main_intro .w_custom{transform: translateY(100px); opacity: 0; transition: all 1.5s; transition-delay: 1.2s;}
            .main_intro.on{margin-bottom: -32vh;}
            .main_intro.on .cont{clip-path: circle(100vmax at 50% 50%);}
            .main_intro.on .w_custom{transform: translate(0); opacity: 1;}
        .main_intro .cont h2{font-size: 400%; font-weight: 600; color: var(--black-color02); letter-spacing: 0.01em; line-height: 1.2;}
        .main_intro .cont h2 + h4{margin-top: 45px;}
        .main_intro .cont h2 em{font-weight: inherit; color: var(--point-color02);}
        .main_intro .cont h4{font-size: 160%; font-weight: 400; color: var(--black-color12); line-height: 1.3;}

        .btm_ani{position: relative; z-index: 7; opacity: 0; transition: all 0.6s; transition-delay: 3s;}
            #wrap:has(.main_intro.on) .btm_ani{opacity: 1; }
        .vis_wrap{position: relative; z-index: 6; opacity: 0; transform: translateY(70px); transition: all 0.6s; transition-delay: 3.5s;}
            #wrap:has(.main_intro.on) .vis_wrap{opacity: 1; transform: translateY(0);}

        .main_intro .intro_bg{position: absolute; top:0; left:0; width: 100%; height: 100%; background: var(--point-color04); z-index: 8; transition: all 0.4s;}

        .visual_wrapper{position: relative; width: 76%; border-radius: 500px; margin:0 auto; overflow: hidden; z-index: 3; height: 940px;}
        .scr_dwn{position: relative; display: flex; align-items: center; justify-content: center; width: 140px; height: 140px; border-radius: 100%; background: var(--point-color02); z-index: 5; margin: 0 auto -70px; z-index: 5;}
            .scr_dwn:before{position: absolute; content:''; width: 95%; height: 95%; background: url('../images/skin/intro_txt.svg') no-repeat center / 100% auto; top:50%; left:50%; transform: translate(-50%, -50%) rotate(0deg);}
            .scr_dwn:before{animation-name: scrDwn; animation-duration:160s; animation-iteration-count:infinite; transition-timing-function:linear;}
            @keyframes scrDwn {0% {transform: translate(-50%, -50%) rotate(0deg);}100% {transform: translate(-50%, -50%) rotate(3600deg);}}

        @media screen and (max-width:1023px){
            .main_intro.on{margin-bottom: -30vh;}
            .main_intro .cont h2{font-size: 380%;}
                .main_intro .cont h2 + h4{margin-top: 40px;}
            .main_intro .cont h4{font-size: 150%;}
            .scr_dwn{width: 130px; height: 130px; margin-bottom: -65px;}
        }
        @media screen and (max-width:860px){
            .main_intro.on{margin-bottom: -28vh;}
            .main_intro .cont h2{font-size: 360%;}
                .main_intro .cont h2 + h4{margin-top: 35px;}
            .main_intro .cont h4{font-size: 140%;}
            .scr_dwn{width: 120px; height: 120px; margin-bottom: -60px;}
        }
        @media screen and (max-width:640px){
            .main_intro.on{margin-bottom: -26vh;}
            .main_intro .cont h2{font-size: 320%;}
                .main_intro .cont h2 + h4{margin-top: 30px;}
            .main_intro .cont h4{font-size: 130%;}
            .scr_dwn{width: 110px; height: 110px; margin-bottom: -55px;}
            .visual_wrapper{border-radius: 150px; width: 90%;}
        }
        @media screen and (max-width:479px){
            .main_intro{ }
            .main_intro.on{height: 70vh; margin-bottom: -24vh;}
            .main_intro .w_custom{position: absolute; top:25vh; left:15px;}
            .main_intro .cont h2{font-size: 200%;}
                .main_intro .cont h2 + h4{margin-top: 25px;}
            .main_intro .cont h4{font-size: 120%;}
            .scr_dwn{width: 100px; height: 100px; margin-bottom: -50px;}
            .visual_wrapper{border-radius: 50px;}
            .visual_wrapper.aos-animate{width: 100% !important; border-radius: 0 !important;}
        }
        @media screen and (min-width:480px){
            .visual_wrapper[data-aos]{transition-duration:0s !important;}
        }

    /* 비주얼 */

        .main_visual {position:absolute; top:0; left:50%; transform: translateX(-50%); overflow: hidden; width: 100vw; }
        .main_visual .slick-slide {position: relative; height: 940px; box-sizing: border-box; overflow: hidden;}
        .main_visual .thumb{width: 100%; height: 100%; background: no-repeat center / cover; box-sizing: border-box; transition: all 8s;}
            .main_visual .active .thumb{transform: scale(1.1);}
        .main_visual .txt_box{position: absolute;left: 50%;bottom: 21%;transform: translateX(-50%);z-index: 3;display: flex;align-items: center;gap: 10px 60px;flex-wrap: wrap;font-size: var(--title-20);color: var(--point-white);}
        .main_visual .txt_box h2{font-size: 400%;font-weight: 500;letter-spacing: 0.045em;line-height: 1.1;}
        .main_visual .txt_box h6{font-size: 110%;font-weight: 300;line-height: 1.68;font-family: var(--font-type02);padding-top: 9px;}
        .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 .controller{position: absolute; left:50%; bottom:80px; transform: translateX(-50%); display: flex; align-items: center; z-index: 9; gap: 40px;}
        .main_visual .slideController{display: flex;align-items: center;font-size: var(--title-20);font-weight: 300;color: var(--point-white);gap: 4px;width: 64px;letter-spacing: 0;justify-content: space-between;}
        .main_visual .slideController .slideCountItem{font-weight: 600;}
        .main_visual .slick-dots{display: flex;gap: 30px;font-size: 0;}
        .main_visual .slick-dots li button{position: relative; font-size: inherit;width: 8px;height: 8px;border-radius: 100%;background: var(--point-white);opacity: 0.5;transition: all 0.4s;}
            .main_visual .slick-dots li button:before{position: absolute; content:''; width: 125%; height: 125%; background: var(--point-white); border-radius: inherit; top:50%; left:50%; transform: translate(-50%, -50%); opacity: 0; transition: all 0.4s;}
            .main_visual .slick-dots li.slick-active button{opacity: 1;}
            .main_visual .slick-dots li.slick-active button:before{opacity: 1;}
        .main_visual .arw_wrap{display: flex; align-items: center; gap: 30px;}
        .main_visual .slick-arrow{font-size: 0; width: 24px; height: 13px; background: url('../images/skin/main_arw.svg') no-repeat center / 100% auto; transition: all 0.4s;}
            .main_visual .slick-arrow.slick-prev{transform: scale(-1,-1);}

            /* over */
                @media screen and (min-width:1024px){
                    .main_visual .slick-dots li button:hover{opacity: 1;}
                    .main_visual .slick-arrow:hover{opacity: 0.5;}
                }
        
        @media screen and (max-width:1023px){
            .visual_wrapper, .main_visual .slick-slide{height: 91.5vw; min-height: 600px;}
            .main_visual .txt_box{gap: 10px 50px;}
            .main_visual .txt_box h2{font-size: 370%;}
            .main_visual .txt_box h6{font-size: 100%;}
        }
        @media screen and (max-width:860px){
            .main_visual .txt_box{display: block;}
            .main_visual .txt_box h2{font-size: 350%;}
            .main_visual .controller{bottom:70px; gap: 35px;}
            .main_visual .slick-dots{gap: 25px;}
            .main_visual .arw_wrap{gap: 25px;}
        }
        @media screen and (max-width:640px){
            .main_visual .txt_box h2{font-size: 320%;}
            .main_visual .controller{bottom:60px; gap: 30px;}
            .main_visual .slideController{width: 55px;}
            .main_visual .slideController span{font-size: 90%;}
            .main_visual .slick-dots{gap: 20px;}
            .main_visual .slick-dots li button{width: 7px; height: 7px;}
            .main_visual .arw_wrap{gap: 20px;}
            .main_visual .slick-arrow{width: 19px;}
        }
        @media screen and (max-width:479px){
            .main_visual .txt_box{bottom: 18%;}
            .main_visual .controller{bottom:50px; gap: 25px;}
            .main_visual .slick-dots{gap:15px;}
            .main_visual .slick-dots li button{width: 5px; height: 5px;}
            .main_visual .arw_wrap{gap: 15px;}
        }

    /* 공통 */
        .main_title{position: relative; font-size: var(--title-20);}
            .main_title.cen{text-align: center;}
        .main_title h2{font-size: 300%;font-weight: 600;color: var(--black-color02);line-height: 1.33;letter-spacing: -0.03em;}
            .main_title h2 + h5{margin-top: 40px;} 
            .main_title h2 + h6{margin-top: 20px;}  
        .main_title h3{font-size: 270%;font-weight: 500;color: var(--black-color02);line-height: 1.35;letter-spacing: 0.01em;}
        .main_title h4{font-size: 140%; font-weight: 400; color: var(--black-color02); line-height: 1.4;}
            .main_title h4 + h3{margin-top: 36px;}
        .main_title h4 em{font-weight: 500; color: var(--point-color01);}
        .main_title h5{font-size: 110%; font-weight: 400; color: var(--black-color02); line-height: 1.63;}
            .main_title h5 + .view_more{margin-top: 60px;}
        .main_title h6{font-size: 100%; font-weight: 400; color: var(--black-color03); line-height: 1.5;}
            .main_title h6 + .view_more{margin-top: 40px;}

        @media screen and (max-width:1023px){
            .main_title h2 + h5{margin-top: 35px;}
            .main_title h4 + h3{margin-top: 31px;}
            .main_title h5 + .view_more{margin-top: 55px;}
        }
        @media screen and (max-width:860px){
            .main_title h2 + h5{margin-top: 30px;}
            .main_title h5 + .view_more{margin-top: 50px;}
        }
        @media screen and (max-width:640px){
            .main_title h2{font-size: 270%;}
                .main_title h2 + h5{margin-top: 26px;}
                .main_title h2 + h6{margin-top: 15px;}  
            .main_title h3{font-size: 240%;}
            .main_title h4{font-size: 130%;}
                .main_title h4 + h3{margin-top: 26px;}
            .main_title h6 + .view_more{margin-top: 30px;}
            .main_title h5 + .view_more{margin-top: 45px;}
        }
        @media screen and (max-width:479px){
            .main_title h2{font-size: 200%;}
                .main_title h2 + h5{margin-top: 21px;}
            .main_title h3{font-size: 210%;}
            .main_title h4{font-size: 120%;}
                .main_title h4 + h3{margin-top: 21px;}
			.main_title h5{font-size:100%;}
            .main_title h5 + .view_more{margin-top: 40px;}
        }

    /* 포트폴리오 */
        .main_portfolio{position: relative;height: 1500px;background: var(--point-color03);box-sizing: border-box;overflow: clip;position: relative;}
            .main_portfolio:before{position: absolute;content:'';width: 800px;height: 800px;border-radius: 100%;background: radial-gradient(83.59% 91.84% at 51.71% 50%, #0C2387 0%, rgba(10, 12, 53, 0.00) 100%);background-blend-mode: multiply;filter:blur(120px);top:50%;left:50%;transform: translate(-50%, -50%);}
        .main_portfolio .w_custom{height: 100%;display: flex;align-items: center;justify-content: center;padding: 200px 0;}
        .main_portfolio .main_title{position: relative;}
        .main_portfolio .main_title :where(h2, h6){filter: var(--filter-white);}
        .main_portfolio .cont_list{position: absolute; top:0; left:0; display: inline-flex; flex-direction: column; gap: 0;width:460px;}
            .main_portfolio .cont_list.right{top:auto; bottom:0; left:auto; right:0;}
        .main_portfolio .cont_list > li{position: relative; box-sizing: border-box; overflow: hidden; width: auto; height: auto; padding: 20px 0;}
        .main_portfolio .cont_list .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
        .main_portfolio .cont_list .thumb{display: block; font-size: 0;width:100%;height:0;padding-bottom:65%;position: relative;overflow:hidden; border-radius: 20px;}
		.main_portfolio .cont_list .thumb img{width:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);max-height:initial;}
        .main_portfolio .cont_list .desc{position: absolute; top:20px; left:0; width: 100%; height: calc(100% - 40px); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 16px; background: rgba(0,0,0,0.7); font-size: var(--title-20); color: var(--point-white); font-family: var(--font-type02); opacity: 0; clip-path: circle(0 at 50% 50%); transition: all 0.6s;border-radius: 20px;}
        .main_portfolio .cont_list .desc dt{font-size: 150%; font-weight: 500; line-height: 1.33;}
        .main_portfolio .cont_list .desc dd{font-size: 90%; font-weight: 300; line-height: 1.78;}

            /* over */
                @media screen and (min-width:1024px){
                    .main_portfolio .cont_list > li:hover .desc{opacity: 1; clip-path: circle(100% at 50% 50%);}
                }

        @media screen and (max-width:1600px){
            .main_portfolio{height: 93vw;min-height: 700px;}
            .main_portfolio .cont_list{width: 28%;}
        }
        @media screen and (max-width:1300px){
            .main_portfolio .cont_list > li{padding:15px 0;}
        }
        @media screen and (max-width:1200px){
            .main_portfolio .cont_list > li{padding:10px 0;}
            .main_portfolio .cont_list .thumb{border-radius: 15px;}
        }
        @media screen and (max-width:1023px){
            .main_portfolio .w_custom{padding:0; align-items: center;}
            .main_portfolio .main_title{position: relative; top:auto;}
            .main_portfolio .cont_list{flex-direction: row;top: 30px;width:max-content;}
                .main_portfolio .cont_list.right{bottom: 29px;}
            .main_portfolio .cont_list > li{flex-shrink: 0;width: 30vw;min-width: 200px; padding:0 7.5px}
        }
        @media screen and (max-width:640px){
            .main_portfolio .cont_list > li{border-radius: 10px;}
        }
        @media screen and (max-width:640px){
            .main_portfolio:before{width: 500px; height: 500px; filter:blur(60px);}
        }

    /* 솔루션 */        
        .main_solution{position: relative;  box-sizing: border-box; height: 8000px;}
        .main_solution .sticky{position: sticky; top: 0; display: flex; align-items: center;width: 100%; height: 100vh; background: url('../images/skin/main_solution_bg.svg') no-repeat left bottom / cover; }
		.main_solution .w_custom{height:100%;}
        .main_solution .scroll_wrap{position: relative;display: flex;gap: 140px;width: max-content;height: 100%;}
        .main_solution .cont{position: relative;display: flex;gap: 170px;align-items: center;flex-shrink: 0;height: 100%;}
        .main_solution .cont .exp{display: none;}
        .main_solution .exp{position: absolute;left:0;bottom: -17px;font-size: var(--title-20);}
        .main_solution .exp h2{ font-size: 600%; font-weight: 500; color: var(--black-color02); line-height: 1; letter-spacing: -0.05em;}
        .main_solution .exp ul li{position: absolute; left:0; bottom:0; transform: translateX(300px); opacity: 0; transition: all 0.6s;}
            .main_solution .exp ul li.on{opacity: 1; transform: translateX(0);}
            .main_solution .exp ul li.on:has(+ li.on){opacity: 0; transform: translateX(-300px);}
        .main_solution .main_title{flex-shrink: 0;}
        .main_solution .info_list{display: flex; gap: 60px; flex-shrink: 0;}
        .main_solution .info_list > li{position: relative; width: 520px; border:1px solid var(--border-color01); border-radius: 20px; padding:40px; box-sizing: border-box; background: var(--point-white);}
        .main_solution .info_list .thumb{position: relative;display: block;padding-bottom: 300px;border-radius: 20px;overflow: hidden;}
            .main_solution .info_list .thumb + .desc{margin-top: 30px;}
        .main_solution .info_list .thumb img{position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: cover; transition: all 0.4s;}
        .main_solution .info_list .thumb .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
        .main_solution .info_list .thumb .link:before{position: absolute; content:''; width: 80px; height: 80px; background: var(--point-color04) url('../images/skin/plus.svg') no-repeat center; top:50%; left:50%; transform: translate(-50%, -50%); border-radius: 100%;}
        .main_solution .info_list .desc{font-size: var(--title-20);}
        .main_solution .info_list .desc dt{font-size: 210%; font-weight: 600; color: var(--black-color02); line-height: 1.3;}
            .main_solution .info_list .desc dt + dd{margin-top: 21px;}
        .main_solution .info_list .desc dd{font-size: 110%;font-weight: 400;color: var(--black-color06);line-height: 1.45;letter-spacing: -0.03em;}

            /* over */
                @media screen and (min-width:1024px){
                    .main_solution .info_list > li:hover .thumb img{transform: scale(1.05);}
                }            
        @media screen and (max-width:1600px){
            .main_solution .scroll_wrap{gap: 8.5vw;}
            .main_solution .cont{gap: 10.5vw;}
            .main_solution .info_list{gap: 50px;}
        }
        @media screen and (max-width:1500px){
            .main_solution .info_list{gap: 40px;}
        }
        @media screen and (max-width:1400px){
            .main_solution .info_list{gap: 30px;}
        }
        @media screen and (max-width:1200px){
            .main_solution .info_list{gap: 20px;}
        }
        @media screen and (max-width:1023px){
            .main_solution .exp h2{font-size: 560%;}
            .main_solution .info_list{gap: 15px;}
            .main_solution .info_list > li{padding: 35px; width: 50.5vw;}
            .main_solution .info_list .thumb{padding-bottom: 67.4%;}
                .main_solution .info_list .thumb + .desc{margin-top: 25px;}
            .main_solution .info_list .desc dt{font-size: 190%;}
            .main_solution .info_list .desc dt + dd{margin-top: 16px;}
        }
        @media screen and (max-width:860px){
            .main_solution .exp h2{font-size: 520%;}
            .main_solution .info_list > li{padding: 30px; border-radius: 15px;}
            .main_solution .info_list .thumb{border-radius: 15px;}
                .main_solution .info_list .thumb + .desc{margin-top: 20px;}
            .main_solution .info_list .desc dt{font-size: 170%;}
                .main_solution .info_list .desc dt + dd{margin-top: 11px;}
            .main_solution .info_list .desc dd{font-size: 100%;}
        }
        @media screen and (max-width:640px){
            .main_solution .exp h2{font-size: 480%;}
            .main_solution .scroll_wrap{gap: 50px;}
            .main_solution .cont{gap: 60px;}
            .main_solution .info_list > li{padding: 25px; border-radius: 10px;}
            .main_solution .info_list .thumb{border-radius: 10px;}
            .main_solution .info_list .desc dt{font-size: 150%;}
        }
        @media screen and (max-width:479px){
            .main_solution{height: auto;}
            .main_solution .exp{position: relative;left:auto;bottom:auto;width: 100%;}
            .main_solution .exp h2{font-size: 12vw;}
            .main_solution .cont .exp{display: block;}
            .main_solution .exp ul{display: none;}
            .main_solution .sticky{position: relative; top:auto; height: auto; padding: 70px 0; background-size: 100% auto;}
            .main_solution .scroll_wrap{width: auto;gap: 70px;flex-direction: column; transform: none !important;}
            .main_solution .cont{gap: 30px;flex-shrink: 1;flex-direction: column;}
            .main_solution .main_title{width: 100%;}
            .main_solution .main_title br{display: none;}
            .main_solution .info_list{width: calc(100% + 30px); padding:0 15px; box-sizing: border-box; overflow:hidden; overflow-x: auto;}
            .main_solution .info_list{-ms-overflow-style: none; /* IE, Edge */ scrollbar-width: none; /* Firefox */}
            .main_solution .info_listl::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera */}
            .main_solution .info_list > li{flex-shrink: 0; width: 70vw; padding:20px;}
            .main_solution .info_list .desc dt{font-size: 130%;}
            .main_solution .info_list .desc dd{font-size: 90%;}
        }


    /* 성과지표 */
        .main_performance{padding: 116px 0 130px;}
        .main_performance .line{position: relative;margin: 74px 0 83px;width: 100%;height: 2px;background: var(--border-color03);overflow: hidden;}
            .main_performance .line:before{position: absolute; content:''; top:0; left:0; width: 12%; height: 100%; background: linear-gradient(90deg, #D9D9D9 0%, #0014BA 62%, #000 100%);}
            .main_performance .line:before{animation-name: main_per; animation-duration:3s; animation-iteration-count:infinite; transition-timing-function:linear;}
            @keyframes main_per {0% {left:-12%;}100% {left:112%;}}

        .main_performance .his_list{display: flex; flex-wrap: wrap; gap: 20px;}
        .main_performance .his_list > li{position: relative;width: calc(100% / 4 - 15px);box-sizing: border-box;border-radius: 20px;padding: 126px 60px 55px;display: flex;align-items: flex-end;transition: all 0.4s;overflow: hidden;background: var(--point-color02);cursor: pointer;}
            .main_performance .his_list > li:before{position: absolute;content:'';top: 50%;left: 50%;transform: translate(-50%, -50%) rotate(0deg);width: 150%;height: 150%;background: linear-gradient(0deg, rgba(0, 20, 186, 1) 50%, rgba(0, 20, 186, 0) 100%); opacity: 0; transition: all 0.4s;}
            .main_performance .his_list > li:after{position: absolute;content:'';top: 1px;left: 1px;width: calc(100% - 2px);height: calc(100% - 2px);background: var(--point-white);border-radius: 18px;opacity: 0; transition: all 0.4s;}

        .main_performance .his_list :where(.icon, .desc){filter: var(--filter-white); transition: all 0.4s;}
        .main_performance .his_list .icon{position: absolute; top:40px; right:40px; font-size: 0; z-index: 3;}
        .main_performance .his_list .desc{font-size: var(--title-20); color: var(--black-color03); z-index: 3;}
        .main_performance .his_list .desc dt{font-size: 90px;font-weight: 600;letter-spacing: 0.02em;display: flex;align-items: flex-start;gap: 15px;line-height: 1;}
            .main_performance .his_list .desc dt + dd{margin-top: 40px;}
        .main_performance .his_list .desc dt em{font-weight: inherit;}
        .main_performance .his_list .desc dt sup{font-size: 70%;font-weight: 300;line-height: 1;transform: translateY(-7px);}
        .main_performance .his_list .desc dd{font-size: 110%; font-weight: 400; line-height: 1.3; letter-spacing: -0.03em;}
        .main_performance .his_list .count{position: relative;height: 90px;overflow: hidden;}
        .main_performance .his_list .count{opacity: 0;}
            .main_performance .his_list .count.aos-animate{opacity: 1;}
        .main_performance .his_list .count ul{display: flex; flex-direction: column; transition: 0s;}
        .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 90px)); transition: all 3s; transition-delay: 0.4s;}
        .main_performance .noti{font-size: var(--title-20);margin-top: 75px;}
        .main_performance .noti p{font-weight: 400; color: var(--black-color05); line-height: 1.5; letter-spacing: -0.03em;}

            /* over */
                @media screen and (min-width:1024px){
                    .main_performance .his_list > li:hover{background: var(--trans-color);}
                    .main_performance .his_list > li:hover:before{opacity: 1;}
                    .main_performance .his_list > li:before{animation-name: his_list; animation-duration:3s; animation-iteration-count:infinite;  transition-timing-function:linear; }
                    @keyframes his_list {0% {transform: translate(-50%, -50%) rotate(0deg);}100% {transform: translate(-50%, -50%) rotate(360deg);}}
                    .main_performance .his_list > li:hover:after{opacity: 1;}
                    
                    .main_performance .his_list > li:hover :where(.icon, .desc){filter:none;}
                }

        @media screen and (max-width:1600px){
            .main_performance .his_list > li{padding:126px 3.6vw 55px;}
        }
        @media screen and (max-width:1500px){
            .main_performance .his_list .desc dt{font-size: 80px;}
            .main_performance .his_list .count{height: 80px;}
            .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 85px));}
        }
        @media screen and (max-width:1400px){
            .main_performance .his_list .desc dt{font-size: 70px; gap: 10px;}
            .main_performance .his_list .count{height: 70px;}
            .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 75px));}
        }
        @media screen and (max-width:1200px){
            .main_performance .his_list > li{width: calc(100% / 2 - 10px); padding:115px 40px 50px;}
            .main_performance .his_list .desc dt + dd{margin-top: 30px;}
        }
        @media screen and (max-width:1023px){
            .main_performance .line{margin:64px 0 73px;}
            .main_performance .his_list{gap: 15px;}
            .main_performance .his_list > li{width: calc(100% / 2 - 7.5px); padding:110px 40px 45px;}
            .main_performance .his_list .desc dt + dd{margin-top: 20px;}
        }
        @media screen and (max-width:860px){
            .main_performance .line{margin:54px 0 63px;}
            .main_performance .his_list > li{padding:100px 35px 40px;}
            .main_performance .his_list .icon{top: 35px; right: 35px;}
        }
        @media screen and (max-width:640px){
            .main_performance{padding:100px 0;}
            .main_performance .line{margin:44px 0 53px;}
            .main_performance .his_list > li{padding:100px 35px 40px; border-radius: 10px;}
            .main_performance .his_list .desc dt{font-size: 60px;}
            .main_performance .his_list .count{height: 60px;}
            .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 65px));}
        }
        @media screen and (max-width:479px){
            .main_performance{padding:70px 0;}
            .main_performance .line{margin:39px 0 48px;}
            .main_performance .his_list > li{padding:100px 30px 35px;}
            .main_performance .his_list .icon{top: 30px;right: 30px;display: flex;justify-content: flex-end;width: 35px;height: 40px;}
            .main_performance .his_list .desc dt{font-size: 40px; gap: 5px;}
                .main_performance .his_list .desc dt + dd{margin-top: 15px;}
            .main_performance .his_list .desc dd{font-size: 100%;}
            .main_performance .his_list .count{height: 40px;}
            .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 42px));}
        }
        @media screen and (max-width:431px){
            .main_performance .his_list{gap: 10px;}
            .main_performance .his_list > li{padding:100px 25px 30px;}
            .main_performance .his_list .icon{top: 25px;right: 25px;}
            .main_performance .his_list .desc dt{font-size: 30px;}
            .main_performance .his_list .count{height: 30px;}
            .main_performance .his_list .count.aos-animate ul{transform: translateY(calc(-100% + 30px));}
        }

    /* 파트너 */
        .main_partner{padding-bottom: 200px;}
        .main_partner .logo_list{display: flex; width: max-content;}
        .main_partner .logo_list li{flex-direction: column; display: flex; align-items: center; justify-content: center; width: 280px; padding-right: 80px; height: 70px; flex-shrink: 0; box-sizing: border-box;}

        @media screen and (max-width:1200px){
            .main_partner .logo_list li{width: 270px; padding-right: 70px;}
        }
        @media screen and (max-width:1023px){
            .main_partner{padding-bottom: 150px;}
            .main_partner .logo_list li{width: 240px; height: 65px; padding-right: 60px;}
        }
        @media screen and (max-width:860px){
            .main_partner{padding-bottom: 120px;}
            .main_partner .logo_list li{width: 210px; padding-right: 50px;}
        }
        @media screen and (max-width:640px){
            .main_partner{padding-bottom: 100px;}
            .main_partner .logo_list li{width: 180px; height: 60px; padding-right: 40px;}
        }
        @media screen and (max-width:479px){
            .main_partner{padding-bottom: 70px;}
            .main_partner .logo_list li{width: 150px; height: 55px; padding-right: 30px;}
        }

    /* 장점 */
        .main_merit{position: relative; background: url('../images/skin/main_merit_bg.jpg') no-repeat center / cover; padding:160px 0;}
            .main_merit:before{position: absolute; content:''; top:0; left:0; width: 100%; height: 100%; background: rgba(0, 56, 118, 0.8);}
        .main_merit .info_list{display: flex; flex-wrap: wrap; gap: 30px;}
        .main_merit .info_list > li{position: relative; width: calc(100% / 3 - 20px); box-sizing: border-box; padding:50px; background: rgba(32, 84, 139, 0.8); border:2px solid rgba(32, 84, 139, 0.8); border-radius: 20px; overflow: hidden; cursor: pointer;}
            .main_merit .info_list > li:before{position: absolute; content:''; right:-30px; bottom:0; width: 436px; height: 321px; background: url('../images/skin/ci.svg') no-repeat center / 100% auto; opacity: 0; transition: all 0.6s; z-index: 3;}
            .main_merit .info_list > li:has(.main_title){background: none; border:0; padding:0;}
        .main_merit .info_list :where(.main_title, .icon, .desc){filter: var(--filter-white);}
		.main_merit .info_list .icon{position: relative; display:flex;align-items:center;height: 72px; transition: all 0.4s; z-index: 5;}
        .main_merit .info_list .icon + .desc{margin-top: 47px;}
        .main_merit .info_list .desc{position: relative; font-size: var(--title-20); transition: all 0.4s; z-index: 6;}
        .main_merit .info_list .desc dt{font-size: 160%; font-weight: 500; color: var(--point-color02); line-height: 1.4; letter-spacing: -0.03em;}
            .main_merit .info_list .desc dt + dd{margin-top: 20px;}
        .main_merit .info_list .desc dd{font-size: 100%; font-weight: 400; color: var(--black-color03); line-height: 1.6; letter-spacing: -0.03em;}

            /* over */
                @media screen and (min-width:1024px){
                    .main_merit .info_list > li:not(:has(.main_title)):hover{background: var(--point-white); border-color: var(--point-color01);}
                    .main_merit .info_list > li:not(:has(.main_title)):hover:before{opacity: 1; right:0;}
                    .main_merit .info_list > li:not(:has(.main_title)):hover :where(.icon, .desc){filter: none;}
                }
        @media screen and (max-width:1300px){
            .main_merit .main_title h5 br{display: none;}
            .main_merit .info_list .desc dd br{display: none;}
        }
        @media screen and (max-width:1200px){
            .main_merit .info_list{gap: 20px;}
            .main_merit .info_list > li{width: calc(100% / 3 - 13.34px); padding:45px;}
        }
        @media screen and (max-width:1023px){
            .main_merit{padding:120px 0;}
            .main_merit .info_list{gap: 15px;}
            .main_merit .info_list > li{width: calc(100% / 2 - 7.5px);}
            .main_merit .info_list .icon + .desc{margin-top: 42px;}
            .main_merit .info_list .desc dt + dd{margin-top: 15px;}
        }
        @media screen and (max-width:860px){
            .main_merit .info_list > li{width: calc(100% / 2 - 7.5px); padding:40px}
            .main_merit .info_list .icon{height: 65px;}
            .main_merit .info_list .icon + .desc{margin-top: 37px;}
            .main_merit .info_list .desc dt + dd{margin-top: 12px;}
        }
        @media screen and (max-width:640px){
            .main_merit{padding:100px 0;}
            .main_merit .info_list > li{width: 100%; padding:35px; border-radius: 10px;}
            .main_merit .info_list .icon{height: 60px;}
            .main_merit .info_list .icon + .desc{margin-top: 32px;}
        }
        @media screen and (max-width:479px){
            .main_merit{padding:70px 0;}
            .main_merit .info_list > li{padding:35px 30px;}
            .main_merit .info_list .icon{height: 55px;}
            .main_merit .info_list .icon + .desc{margin-top: 27px;}
        }

    /* 뉴스 */
        .main_news{padding: 159px 0;}
		.main_news .main_title h2:has(+ h5){margin-bottom: -0.5vw;}
        .main_news .noti_list{margin-top: 60px;border-top: 1px solid var(--black-color03);}
        .main_news .noti_list > li{position: relative; border-bottom: 1px solid var(--border-color01); box-sizing: border-box; display: flex; align-items: center; height: 210px; box-sizing: border-box; font-size: var(--title-20); padding-right: 180px;}
            .main_news .noti_list > li:before{position: absolute; content:''; width: 0; height: 1px; background: var(--point-color02); left:0; bottom:-1px; transition: all 0.6s;}
        .main_news .noti_list .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
        .main_news .noti_list .arw{position: absolute;top:50%;right:80px;transform: translateY(-50%);width: 60px;height: 60px;border-radius: 100%;transition: all 0.4s; overflow: hidden;}
            .main_news .noti_list .arw:before{position: absolute;content:'';width: 9px;height: 9px;border:2px solid var(--trans-color);border-top-color: var(--black-color06);border-right-color: var(--black-color06);top:50%;left: 44%;transform: translate(-50%, -50%) rotate(45deg);border-radius: 2px; z-index: 3;}
            .main_news .noti_list .arw:after{position: absolute; content:''; width: 100%; height: 100%; background: var(--point-color02); top:0; left:0; opacity: 0; clip-path: circle(0 at 50% 50%); transition: all 0.6s;}
        .main_news .noti_list .date{width: 17%;font-size: 110%;font-weight: 400;color: var(--point-color01);display: flex;align-items: center;height: 100%;box-sizing: border-box;justify-content: center;text-align: center;}
        .main_news .noti_list .desc{width: 83%;box-sizing: border-box;padding-left: 40px;}
        .main_news .noti_list .desc dt{font-size: 140%; font-weight: 400; color: var(--black-color00); letter-spacing: -0.03em; line-height: 1.35; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
            .main_news .noti_list .desc dt + dd{margin-top: 20px;}
        .main_news .noti_list .desc dd{font-size: 110%; font-weight: 300; color: var(--black-color07); letter-spacing: -0.03em; line-height: 1.5; font-family: var(--font-type02); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
        .main_news .more_wrap{margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: center;}

        /* over */
            @media screen and (min-width:1024px){
                .main_news .noti_list > li:hover:before{width: 100%;}
                .main_news .noti_list > li:hover .arw:before{filter: var(--filter-white);}
                .main_news .noti_list > li:hover .arw:after{opacity: 1; clip-path: circle(100% at 50% 50%);}
            }

        @media screen and (max-width:1023px){
            .main_news{padding:140px 0;}
            .main_news .noti_list{margin-top: 50px;}
            .main_news .noti_list > li{height: 190px;}
            .main_news .noti_list .arw{right:70px;}
            .main_news .more_wrap{margin-top: 50px;}
        }
        @media screen and (max-width:860px){
            .main_news{padding:120px 0;}
            .main_news .noti_list{margin-top: 45px;}
            .main_news .noti_list > li{height: 170px; padding-right: 120px;}
            .main_news .noti_list .date{font-size: 100%;}
            .main_news .noti_list .desc{padding-left: 30px;}
            .main_news .noti_list .desc dt{font-size: 130%;}
                .main_news .noti_list .desc dt + dd{margin-top: 15px;}
            .main_news .noti_list .desc dd{font-size: 100%;}
            .main_news .noti_list .arw{right:50px;}
            .main_news .more_wrap{margin-top: 45px;}
        }
        @media screen and (max-width:767px){
            .main_news .noti_list > li{flex-direction:column; gap: 20px; height: auto; padding:30px 90px 30px 30px;}
            .main_news .noti_list .date{width: 100%; justify-content: flex-start; text-align: left;}
            .main_news .noti_list .desc{width: 100%; padding-left:0;}
            .main_news .noti_list .desc dt{font-size: 120%;}
                .main_news .noti_list .desc dt + dd{margin-top: 12px;}
            .main_news .noti_list .arw{right:30px;}
        }
        @media screen and (max-width:640px){
            .main_news{padding:100px 0;}
            .main_news .noti_list{margin-top: 40px;}
            .main_news .noti_list > li{padding: 25px;}
            .main_news .more_wrap{margin-top: 40px;}
            .main_news .noti_list .arw{display: none;}
        }
        @media screen and (max-width:479px){
            .main_news{padding:70px 0;}
            .main_news .noti_list{margin-top: 35px;}
            .main_news .noti_list > li{gap: 15px;padding: 25px 20px;}
            .main_news .noti_list .date{font-size: 90%;}
            .main_news .noti_list .desc dt{font-size: 110%;}
                .main_news .noti_list .desc dt + dd{margin-top: 10px;}
            .main_news .noti_list .desc dd{font-size: 90%;}
            .main_news .noti_list .arw{right:15px;}
            .main_news .noti_list .arw:before{width: 8px; height: 8px;}
            .main_news .more_wrap{margin-top: 35px;}
        }

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

	FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
    #footer{position: relative; background: var(--point-color03); box-sizing: border-box;}
    #footer .top_sec{padding: 80px 0 70px;}
    #footer .top_sec .w_custom{display: flex; flex-wrap: wrap; justify-content: space-between; gap:40px;}
    #footer .info{display: flex;flex-direction: column;gap: 42px;align-items: flex-start;}
    #footer .logo_wrap{display: flex; flex-wrap: wrap; gap:40px;}
    #footer .logo{filter: var(--filter-white);}
    #footer .sns_list{display: flex; align-items: center; gap: 14px;}
    #footer .link_list{display: flex; align-items: center; gap: 15px 32px;}
    #footer .link_list li{font-size: var(--title-20);font-weight: 300;color: var(--point-white);opacity: 0.6;}
    #footer .link_list li:has(strong){opacity: 1;}
    #footer .link_list li strong{font-weight: inherit;}
	#footer .view_more{margin-top: 7px;}
    #footer .view_more:before{border-width: 1px;}
    #footer .gnb{display: flex;justify-content: flex-end;font-size: var(--title-20);color: var(--point-white);gap:40px 120px;letter-spacing: 0;}
    #footer .gnb > li{}
    #footer .gnb > li > a{display: block; font-weight: 500; }
    #footer .gnb > li > ul{padding: 24px 0 0;}
    #footer .gnb > li > ul > li > a{display: block; font-size: 90%; opacity: 0.8; font-weight: 300; padding:15px 0;}
    #footer .btm_sec{border-top: 1px solid rgba(2525,255,255,0.2); padding:60px 0;}
    #footer .exp_list{display: flex;flex-direction: column;gap: 18px;}
    #footer .exp_list > li{display: flex;flex-wrap:wrap;gap: 18px 30px;}
    #footer .exp_list .desc{display: flex; gap:10px; font-size: var(--title-20);}
    #footer .exp_list .desc :where(dt, dd){font-size: 90%;font-weight: 300;color: var(--point-white);line-height: 1.6;}
    #footer .exp_list .desc dd{opacity: 0.8;}
    #footer .copyright{display: flex;font-size: var(--title-20);gap: 10px 20px;margin-top: 35px;letter-spacing: 0; flex-wrap: wrap;}
    #footer .copyright :where(dt, dd){font-size: 80%;font-weight: 200;color: var(--point-white);opacity: 0.6;}

    @media screen and (max-width:1600px){
        #footer .gnb{gap: 40px 6vw;}
    }
    @media screen and (max-width:1023px){
        #footer .top_sec{padding:70px 0 60px;}
        #footer .logo_wrap{gap: 35px;}
        #footer .sns_list{gap: 10px;}
        #footer .link_list{gap: 15px 30px;}
        #footer .gnb{width: 100%; flex-wrap: wrap; justify-content: space-between; gap:20px 40px;}
        #footer .gnb > li > ul{padding-top: 20px;}
        #footer .gnb > li > ul > li > a{padding:12px 0;}
        #footer .btm_sec{padding:50px 0;}
    }
    @media screen and (max-width:860px){
        #footer .logo{width: 100px;}
        #footer .sns_list > li{width: 38px;}
        #footer .info{gap: 35px;}
        #footer .view_more{margin-top: 0;}
    }
    @media screen and (max-width:640px){
        #footer .logo{width: 84px;}
        #footer .sns_list > li{width: 34px;}
        #footer .top_sec{padding:50px 0;}
        #footer .logo_wrap{gap: 30px;}
        #footer .gnb{display: none;}
        #footer .btm_sec{padding:40px 0;}
        #footer .exp_list{gap: 13px;}
        #footer .exp_list > li{gap: 13px 25px;}
        #footer .copyright{margin-top: 30px;}
    }