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

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

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

    .gapBox{display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px;}
        .gapBox.g07{gap: 7px;}
        .gapBox.g10{gap: 10px;}
        .gapBox.g15{gap: 15px;}
        .gapBox.g25{gap: 25px;}
        .gapBox.g30{gap: 30px;}
        .gapBox.g40{gap: 40px;}
        .gapBox.g50{gap: 50px;}
        .gapBox.g55{gap: 55px;}
        .gapBox.g60{gap: 60px;}
        .gapBox.g65{gap: 65px;}
        .gapBox.g70{gap: 70px;}
        .gapBox.g75{gap: 75px;}
        .gapBox.g80{gap: 80px;}

    @media (max-width:1300px){
        br.for_pc{display: none;}
    }
    @media (max-width:1023px){
        #container{padding-bottom:clamp(100px, 15vw, 180px);}
        .gapBox{gap: clamp(15px, 2vw, 20px);}
            .gapBox.g07{gap: clamp(5px, 0.7vw, 7px);}
            .gapBox.g10{gap: clamp(7px, 1vw, 10px);}
            .gapBox.g15{gap: clamp(10px, 1.5vw, 15px);}
            .gapBox.g25{gap: clamp(20px, 2.5vw, 25px);}
            .gapBox.g30{gap: clamp(20px, 3vw, 30px);}
            .gapBox.g40{gap: clamp(25px, 4vw, 40px);}
            .gapBox.g50{gap: clamp(30px, 5vw, 50px);}
            .gapBox.g55{gap: clamp(30px, 5.5vw, 55px);}
            .gapBox.g60{gap: clamp(35px, 6vw, 60px);}
            .gapBox.g65{gap: clamp(35px, 6.5vw, 65px);}
            .gapBox.g70{gap: clamp(40px, 7vw, 70px);}
            .gapBox.g75{gap: clamp(40px, 7.5vw, 75px);}
            .gapBox.g80{gap: clamp(45px, 8vw, 80px);}
    }
    @media (max-width:860px){
        .w_custom{width: calc(100% - 30px);}
    }
    @media (max-width:320px){
        .w_custom{width: calc(100% - 20px);}
    }


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

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

───────────────────────────────────────────────────────────*/
	#header{position: sticky;top:0;width: 100%;height: 100px;z-index: 100; background: var(--point-white); transition: all 0.4s;}
        .main_index #header{margin-bottom: 10px;}
        body:not(:has(.sub_loca)) :not(.main_index) #header{box-shadow: inset 0 -1px 0 var(--border-color01);}
    #header .w_custom{display: flex;align-items: center;height: 100%;justify-content: space-between;}
    #header .logo{position: relative; height: 100%;}
    #header .logo a{display: flex;align-items: center;max-width: clamp(230px, 15.7vw, 300px);height: 100%;padding-block: 15px;}
    #header .gnb{position: relative;height: 100%;display: flex;justify-content: center;text-align: center;font-size: var(--title-20);}
    #header .gnb > li{position: relative;height: 100%;font-size: 110%;font-weight: 600;color: var(--black-color00);line-height: 1.3; transition: all 0.4s;}
    #header .gnb > li > a{display: flex;align-items: center;justify-content: center;height: 100%;padding-inline: clamp(20px, 1.41vw, 27px);}
        #header .gnb > li:after{position: absolute;content:'';width: 1px;height: 12px;background: var(--border-color04);top: 50%;right: 0;translate: 0 -50%;}
        #header .gnb > li:last-child:after{display: none;}
    #header .gnb .dep02{position: absolute;top: 85%;left: 50%;translate: -50%;width: 180px;padding-block: 20px;background: var(--point-white);border-radius: var(--radius-10);border: 1px solid var(--border-color01);opacity: 0;pointer-events: none;transition:inherit;}
    #header .gnb .dep02 > li{position: relative;font-size: 80%;font-weight: 400;color: var(--black-color06); transition:inherit;}
    #header .gnb .dep02 > li > a{display: block;padding: 8px 20px;}
    #header .utility{display: flex; align-items: center; gap:30px}
    #header .allCate{display: flex; flex-direction: column; justify-content: space-between; width: 23px; aspect-ratio: auto 1.15;}
    #header .allCate span{width: 100%; height: 2px; background: var(--black-color00);}
    #header .my_desc{position: relative;font-size: var(--title-20);text-align: center;padding-block: 15px;}
    #header .my_desc dd{position: absolute;top: 100%;left: 50%;width: 120px;translate: -50%;border: 1px solid var(--border-color01);background: var(--point-white);border-radius: var(--radius-10);padding-block: 12px;font-size: 75%;opacity: 0;pointer-events: none;transition: all 0.4s;}
	#header .my_desc dd a{display:block;padding: 7px 15px;}

    .iconBtn{display: flex; align-items: center; height: 24px;}
    .comBtn{font-size: var(--title-18);font-weight: 500;color: var(--black-color00);line-height: 1.3;padding: 9px 19px;border: 1px solid var(--black-color00);border-radius: var(--radius-10);text-align: center; transition: all 0.4s;}

        /* over */
        @media (hover:hover) and (pointer: fine) {
            #header:hover{box-shadow: inset 0 -1px 0 var(--border-color01);}
            #header .gnb > li:hover{color: var(--point-color01);}
            #header .gnb > li:hover .dep02{opacity: 1; pointer-events: all;}
            #header .gnb .dep02 > li:hover{color: var(--black-color00);}
            #header .my_desc:hover dd{opacity: 1; pointer-events: all;}

            .comBtn:hover{background: var(--point-color01); border-color: var(--point-color01); color: var(--point-white);}
        }

        /* on */
        #header.on{box-shadow: inset 0 -1px 0 var(--border-color01);}

    @media (max-width:1300px) {
        #header .gnb > li{font-size: 100%;}
    }
    @media (max-width:1160px) {
        #header .w_custom{gap: 30px;}
        #header .gnb{display: none;}
    }
    @media (max-width:1023px) {
        #header{height: clamp(65px, 10vw, 100px);}
        #header .logo a{max-width: clamp(180px, 25vw, 230px);}
        #header .utility{gap: clamp(20px, 3vw, 30px);}
        #header .allCate{width: clamp(19px, 2.8vw, 23px);}
        #header .my_desc dd{width: clamp(100px, 13vw, 120px);}
        .iconBtn{height: clamp(18px, 2.9vw, 24px);}
        .comBtn{padding: clamp(5px, 1.4vw, 9px) clamp(15px, 1.9vw, 19px);}
    }
    @media (max-width:479px) {
        #header .comBtn{display: none;}
    }

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

	Aside | outline/nav.html

───────────────────────────────────────────────────────────*/
    #aside {position:fixed;inset: 0;display: flex;align-items: center;justify-content: center;z-index: 1000;opacity:0;pointer-events: none;transition: all 0.4s;}
		#aside.on {opacity:1; }

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

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

    #aside .cont{background: var(--point-white);padding: clamp(35px, 3vw, 40px);border-radius: 20px;overflow-y: auto;max-height: 75vh;box-sizing: border-box;}
		#aside.on .cont{pointer-events: all;}
    #aside .gnb{display: grid;grid-template: auto / repeat(6, 1fr);gap: clamp(15px, 1.6vw, 24px);font-size: var(--title-20);text-align: center;line-height: 1.5;}
    #aside .gnb > li{position: relative;}
    #aside .gnb > li > a{position:relative;font-size: 110%;font-weight: 600;color: var(--point-white);border-radius: var(--radius-10) var(--radius-10) 0 0;display: flex;align-items: center;justify-content: center;padding: 13px 10px;background: var(--point-color01);}
	#aside .gnb .dep02 > li{font-size: 90%;font-weight: 400;color: var(--black-color07);}
    #aside .gnb .dep02 > li > a{display: flex;align-items: center;justify-content: center;border:1px solid var(--border-color01);border-top:0;background: var(--point-white);padding: 13px 10px;transition: all 0.4s;}
        #aside .gnb .dep02 > li:last-child > a{border-radius: 0 0 var(--radius-10) var(--radius-10);}

    #aside .closeBtn{position:absolute;width:36px;aspect-ratio: auto 1;top:15px;left:calc(100% + 15px);}
		#aside.on .closeBtn{pointer-events: all;}
    #aside .closeBtn span{position:absolute;top:50%;left:50%;translate: -50% -50%;rotate: 45deg;background: var(--point-white);width: 100%;height:2px;border-radius: 3px;}
    #aside .closeBtn span + span{rotate: -45deg;}

        /* over */
        @media (hover:hover) and (pointer:fine) {
            #aside .gnb .dep02 > li:hover > a{background: var(--gray-bg01);color: var(--black-color03);}
        }
    @media (max-width:1560px){
        #aside .closeBtn{inset: auto;bottom:calc(100% + 15px);right:15px;}
    }
    @media (max-width:1023px){
        #aside .closeBtn{width:30px;right:10px;bottom:calc(100% + 10px);}
    }
    @media (max-width:860px){
        #aside{inset: auto;top:0;right:-100%;width:100%;}
        #aside.on{right:0;}
        #aside .closeBtn{top: 37px;right:20px;width: 25px;}
        #aside .closeBtn span{background: var(--black-color05);}
        #aside .w_custom{width:100%;}
        #aside .cont{border-radius: 0;min-height:100vh;padding: 20px 20px 150px;}
        #aside .logo{font-size:0;margin-bottom: 27px;}
        #aside .logo a{display: block;width: 70%;max-width: 200px;}
        #aside .gnb{display: block;border-top: 1px solid var(--black-color03);text-align: left;}
        #aside .gnb > li{width:100%;}
        #aside .gnb > li > a{height: auto;border-radius: 0;padding: 17px 40px 17px 0;background: none;border-bottom:1px solid var(--border-color01);color: var(--black-color03);justify-content:flex-start;}
            #aside .gnb > li > a:has(+ ul):before{position: absolute;content:'';width: 12px;aspect-ratio: auto 1;border: 2px solid var(--black-color08);top: 21px;right:10px;border-radius: 2px;clip-path: var(--clip-poly01);rotate: 45deg;transition: all 0.4s;}
            #aside .gnb > li > a.on:has(+ ul):before{top:26px;scale: -1 -1;border-color: var(--point-color01);}
        #aside .gnb .dep02{background: var(--gray-bg01);padding-block: 15px;display:none;}
        #aside .gnb .dep02 > li > a{border:0;background: none;justify-content:flex-start;padding: 8px 20px;}
        #aside .link_list{display:flex; justify-content: center; text-align: center;  gap:10px 30px; font-size: var(--title-20); margin-top:32px;}        
        #aside .link_list > li > a{font-weight: 400; color: var(--black-color07);}
    }
    @media (max-width:860px){
        #aside .gnb > li > a:has(+ ul):before{width: 11px;}
    }
    @media (min-width:861px){
        #aside .logo{display:none;}
        #aside .gnb .dep02{display: block !important;}
        #aside .link_list{display: none;}
    }

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

    MAIN | index.html

───────────────────────────────────────────────────────────*/
    /* 레이아웃 */
        .main_flex{display: flex; gap: clamp(15px, 1.6vw, 20px);}
        .main_flex .item{width: 100%;}
        .main_flex .item.w60{width: 60.7%;flex-shrink: 0;}

        @media (max-width:1200px) {
            .main_flex{flex-wrap: wrap;}
            .main_flex .item.w60{width: 100%; flex-shrink: unset;}
        }

    /* 타이틀 */
        .main_title{position: relative; font-size: var(--title-20); display: flex; flex-direction: column; gap: 10px;}
            .main_title.hd{margin-bottom: 20px;}
        .main_title h3{font-size: 150%;font-weight: 700;color: var(--black-color00);line-height: 1.3;letter-spacing: -0.02em;}
        .main_title h4{font-size: 140%;font-weight: 600;color: var(--black-color00);line-height: 1.3;letter-spacing: -0.02em;}

        .btwnBox{display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 15px 30px;}
        .btwnBox.base{align-items: baseline;}

    /* 더보기 버튼 */  
        .moreArw{position: relative;display: inline-flex;align-items: center;justify-content: center;width: 30px;aspect-ratio: auto 1;border-radius: 100%;background: var(--gray-bg01);transition: all 0.4s;}
        .moreArw::before{position: relative;content:'';width: 30%;aspect-ratio: auto 1;border: 2px solid var(--black-color03);clip-path: var(--clip-poly01);rotate: -45deg;border-radius: 2px;translate: -2px;}

        .morePlus{position: relative; font-size: var(--title-20); display: inline-flex; align-items: center; gap: 10px; transition: all 0.4s;}
        .morePlus i{position: relative; width: 14px; aspect-ratio: auto 1;}
        .morePlus i{&::before, &::after{position: absolute;content:'';width: 100%;height: 2px;background: var(--black-color00);top:50%;left:0;translate: 0 -50%; transition: all 0.4s;}}
        .morePlus i:after{width: 2px;height: 100%;top: 0;left: 50%;translate: -50% 0;}

            /* over */
            @media (hover:hover) and (pointer:fine) {
                .morePlus:hover{color: var(--point-color01);}
                .morePlus:hover i{&::before, &::after{background: var(--point-color01); rotate: -180deg;}}
            }

        @media (max-width:1023px) {
			.morePlus{gap:8px;}
            .morePlus i{width: clamp(10px, 1.9vw, 14px);}
        }
		@media (max-width:479px) {
			.morePlus{gap:8px;font-size: var(--title-18);}

            .btwnBox{display: grid;justify-content: unset;}
        }

    /* 교육과정 */
        .curriExp{background: var(--point-color01);border-radius: var(--radius-20);padding: 22px 20px 18px 30px;display: flex;gap: 20px 30px;}
        .curriExp .main_title{width: clamp(150px, 22.7%, 170px);flex-shrink: 0;padding-top: 8px;}
        .curriExp .main_title h3{filter: var(--filter-white);}
        .curriExp .info_list{display: grid;grid-template: auto / repeat(3, 1fr);width: 100%;gap: 16px;}
        .curriExp .info_list > li{position: relative;background: var(--point-white);font-size: var(--title-20);font-weight: 600;color: var(--black-color00);line-height: 1.3;letter-spacing: -0.03em;border-radius: var(--radius-20);box-shadow: var(--shadow-01);overflow: hidden;padding:20px; transition: all 0.4s;}
        .curriExp .info_list .link{position: absolute; inset: 0; z-index: 3;}
        .curriExp .info_list .desc{display: flex;flex-direction: column;justify-content: space-between;gap: 34px;min-height: 100%;}
        .curriExp .info_list .desc dd{width: 100%;height: 60px;display: flex;align-items: flex-end;justify-content: flex-end;padding-left: 35px;}
		.curriExp .info_list .moreArw{position:absolute;left: 20px;bottom: 20px;opacity: 0;}

            /* over */
            @media (hover:hover) and (pointer:fine) {
                .curriExp .info_list > li:hover{translate: 0 -3px; color: var(--point-color01);}
                .curriExp .info_list > li:hover .moreArw{opacity: 1;}
            }

        @media (max-width:1023px) {
			.curriExp .info_list{gap:15px;}
            .curriExp .info_list .desc{gap: clamp(25px, 3.4vw, 34px);}
            .curriExp .info_list .desc dd{height: clamp(45px, 6.5vw, 65px);}
        }
        @media (max-width:860px) {
            .curriExp .info_list .desc dd{padding-left: 0;}
            .curriExp .info_list .moreArw{display: none;}
        }
        @media (max-width:640px) {
            .curriExp{flex-wrap: wrap;padding: 20px;}
            .curriExp .main_title{width: 100%; flex-shrink: unset;}
        }
        @media (max-width:479px) {
			.curriExp .info_list{gap:10px;}
            .curriExp .info_list > li{padding:15px;}
            .curriExp .info_list .desc dt{font-size: 95%;}
        }
        @media (max-width:300px) {
            .curriExp .info_list{grid-template: auto / repeat(1, 1fr);}
        }

    /* 벡터 리스트 */
        .vectorList{display: grid;grid-template: auto / repeat(3, 1fr);gap: 15px;border: 1px solid var(--point-color02);background: var(--point-color03);border-radius: var(--radius-20);padding: 19px;font-size: var(--title-20);}
        .vectorList > li{position: relative;padding: 20px 10px 18px;background: var(--point-white);box-shadow: var(--shadow-02);border-radius: var(--radius-20);text-align: center;border: 1px solid var(--border-color01);font-weight: 500;color: var(--black-color00);line-height: 1.4;letter-spacing: -0.03em;transition: all 0.4s;}
        .vectorList .link{position: absolute; inset: 0; z-index: 3; }
        .vectorList .desc{display: flex;flex-direction: column;gap: 9px;height: 100%;font-size: var(--title-20);}
		.vectorList .desc dt{display: flex; align-items: center; justify-content: center; height: 60px; flex-shrink:0;}
		.vectorList .desc dd{height:100%;display: flex;align-items: center;justify-content: center;flex-direction: column;gap: 5px;font-size: 90%;}
        .vectorList .desc dd small{font-size: 80%; color: var(--black-color06);}

            .vectorList.pt02{border-color: var(--point-color04); background: var(--point-color05);}
            .vectorList.pt03{border-color: var(--point-color06); background: var(--point-color07);}

            .vectorList.type02 > li{text-align: left;padding: 18px 20px;padding-left: clamp(20px, 1.6vw, 22px);line-height: 1.3;}
            .vectorList.type02 .desc{flex-direction: row-reverse;align-items: center;}
			.vectorList.type02 .desc dt{height:50px;}
            .vectorList.type02 .desc dd{width: 100%;height: auto;align-items: flex-start;justify-content: center;font-size: inherit;}

            /* over */
            @media (hover:hover) and (pointer:fine) {
                .vectorList > li:hover{border-color: var(--black-color08);}
            }

        @media (max-width:1300px) {
            .vectorList.type02 .desc dd{font-size: 90%;}
        }
        @media (max-width:1023px) {
            .vectorList .desc dt{height: clamp(45px, 6.5vw, 60px);}
            .vectorList.type02 .desc dt{height: clamp(40px, 5.5vw, 50px);}
        }
        @media (max-width:640px) {
            .vectorList.type02 > li{text-align: center;line-height: 1.4;padding-inline: 10px;}
            .vectorList.type02 .desc{flex-direction: column;align-items: unset;}
            .vectorList.type02 .desc dd{height: 100%;align-items: center;justify-content: center;}
        }
        @media (max-width:479px) {
			.vectorList{gap:10px;}
            .vectorList .desc dd{font-size: 85%;}
        }
        @media (max-width:300px) {
            .vectorList{grid-template: auto / repeat(1, 1fr);}
            .vectorList > li:nth-child(3){grid-column: unset;}
        }

    /* 게시글 */
        .noData{text-align: center; padding-block: 15px; font-size: var(--title-18); font-weight: 400; color: var(--black-color06); }
        .boardMata{border: 1px solid var(--point-color08); padding:30px; border-radius: var(--radius-20);}
        .boardMata .cont_list{display: grid; gap: 15px;}
        .boardMata .cont_list > li{position: relative; display: flex; align-items: baseline; gap: 10px;}
        .boardMata .cont_list > li:before{display: inline-flex;content:'';width: 3px;aspect-ratio: auto 1;background: var(--black-color03);flex-shrink: 0;translate: 0 -6px;}
        .boardMata .cont_list .link{position: absolute; inset:0; z-index: 3;}
        .boardMata .cont_list .desc{font-size: var(--title-20);display: flex;align-items: center;justify-content: space-between;gap: 30px;width: 100%;letter-spacing: -0.03em;}
        .boardMata .cont_list .desc dt{position: relative; font-size: inherit;font-weight: 400;color: var(--black-color03); transition: all 0.4s; white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
            .boardMata .cont_list .desc dt:before{position: absolute;content:'';width: 100%;height: 2px;background: var(--point-color01);left: 0;bottom: 0;opacity: 0;transition: inherit;}
        .boardMata .cont_list .desc dd{font-size: 90%;font-weight: 400;color: var(--black-color08);line-height: 1.3;font-family: var(--font-type02);flex-shrink: 0;letter-spacing: -0.025em;}

            /* over */
            @media (hover:hover) and (pointer:fine) {
                .boardMata .cont_list > li:hover .desc dt{color: var(--point-color01); }
				.boardMata .cont_list > li:hover .desc dt:before{opacity:1;}
            }

        @media (max-width:1023px) {
			.boardMata{padding: clamp(20px, 3vw, 30px);}
            .boardMata .cont_list{gap: clamp(12px, 2vw, 15px);}
        }
        @media (max-width:479px) {
			.boardMata .cont_list > li{gap:8px;}
            .boardMata .cont_list > li:before{width: 3px;translate: 0 -4px;}
            .boardMata .cont_list .desc dt{font-size: 95%;}
        }

    /* 파트너사 */
        .partnerSwiper{padding-block:20px 40px; overflow: hidden;}
        .partnerSwiper .swiper-slide{position: relative;border-radius: var(--radius-10);overflow: hidden;display: flex;align-items: center;justify-content: center; height: auto; aspect-ratio: 2.85; margin-right: 20px;}
            .partnerSwiper .swiper-slide:before,
			.partnerSwiper .swiper-slide a:before{position: absolute;content:'';inset: 0;border: 1px solid var(--border-color01);border-radius: inherit;}

        @media (max-width:1023px) {
            .partnerSwiper{padding-block:clamp(5px, 2vw, 20px) clamp(20px, 4vw, 40px);}
            .partnerSwiper .swiper-slide{width: clamp(140px, 20vw, 200px);}
        }

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

    FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
    /* 하단 */
        #footer{position: relative; background: var(--point-color09); color: var(--point-white); padding-block: 39px; font-size: var(--title-20);}
        #footer .w_custom{display: grid; gap: 20px; font-size: 90%;}
        #footer .link_list{display: flex; flex-wrap: wrap; gap:10px 30px; margin-bottom: 9px;}
        #footer .link_list > li{position: relative; color: rgb(255 255 255 / 80%);}
        #footer .link_list > li strong{font-weight: 500; color: var(--point-white);}
        #footer .addr_list{display: grid; gap: 14px;}
        #footer .addr_list > li{display: flex; align-items: baseline; flex-wrap: wrap; gap: 14px 0;}
        #footer .addr_list .desc{display: flex;align-items: baseline;}
            #footer .addr_list .desc::after{display: inline-flex;content: '';width: 1px;height: 12px;background: rgb(255 255 255 / 30%);margin-inline: 16px;}
            #footer .addr_list .desc:last-child::after{display: none;}
        #footer .addr_list .desc :where(dt, dd){font-weight: 200;line-height: 1.3;letter-spacing: -0.03em;}
        #footer .addr_list .desc dt{font-weight: 400;flex-shrink: 0;padding-right: 20px;}
        #footer .addr_list .desc dd{letter-spacing: -0.02em;}
        #footer .addr_list .desc:has(+ .bundle)::after{opacity: 0;margin-inline: 10px;}
        #footer .addr_list .bundle{background: var(--point-color10);border-radius: var(--radius-10);display: flex;flex-wrap: wrap;align-items: baseline;padding: 10px 20px;}
        #footer .addr_list .bundle .desc::after{margin-inline: 20px;}
        #footer .copy{display: flex; flex-wrap: wrap; gap: 10px 20px;}
        #footer .copy :where(dt, dd){font-weight: 300;color: rgb(255 255 255 / 50%);letter-spacing: -0.035em;}
        #footer .copy dd{letter-spacing:0;}

    @media (max-width:1023px) {
        #footer{padding-block: clamp(30px, 3.9vw, 39px);}
        #footer .w_custom{gap: clamp(15px, 2vw, 20px);}
        #footer .link_list{column-gap: clamp(20px, 3vw, 30px);margin-bottom: clamp(5px, 1vw, 9px);}
        #footer .addr_list{gap: clamp(12px, 1.4vw, 14px);}
        #footer .addr_list > li{row-gap: clamp(12px, 1.4vw, 14px);}
        #footer .addr_list .desc::after{margin-inline: clamp(12px, 1.6vw, 16px); opacity: 0;}
		#footer .addr_list .desc dt{padding-right:clamp(15px, 2vw, 20px);}
        #footer .addr_list .bundle .desc::after{margin-inline: clamp(15px, 2vw, 20px);}
        #footer .addr_list .bundle{padding: clamp(8px, 1.5vw, 15px) clamp(15px, 2vw, 20px);}
    }
    @media (max-width:479px) {
        #footer .w_custom{font-size: 85%;}
    }

     /* 퀵 */
    .quickBox{position: fixed;left:50%;translate: -50%;display: flex;flex-direction: column;align-items: flex-end;bottom: clamp(30px, 3.2vw, 51px);z-index: 50;max-width: 1810px; opacity: 0; pointer-events: none; transition: all 0.4s;}
    .scrTop{display: flex;align-items: center;justify-content: center;width: 50px;height: 50px;border-radius: 100%;background: var(--point-color01);padding: 11px;box-shadow: var(--shadow-03);pointer-events: all;}
        body:has(#header.on) .quickBox{opacity: 1;}
        body:has(#header.on) .scrTop{pointer-events: all;}

    @media (max-width:1023px) {
        .scrTop{width: clamp(40px, 5.5vw, 50px); height: clamp(40px, 5.5vw, 50px);}
        body:has(#header.end) .quickBox{opacity: 0;}
        body:has(#header.end) .scrTop{pointer-events: none;}
    }
    @media (max-width:860px) {
        .quickBox{bottom: 20px;}
    }
