/*** 공통 시작 ***/
.inner{width: 100%; height: 100%; /*max-width: 1914px;*/ max-width: 1720px; padding: 0px 70px; margin: 0 auto;}
#wrapper{position:relative;}
body.body_hidden{overflow:hidden;}
html.scroll_hidden{overflow:hidden;}

    /* 미디어쿼리 시작 */
    @media (max-width: 1920px){
        .inner{padding: 0 60px;}
    }
    @media (max-width: 1600px){
        .inner{padding: 0 50px;}
    }
    @media (max-width: 1440px){
        .inner{padding: 0 40px;}
    }
    @media (max-width: 1024px){
        .inner{padding: 0 30px;}
    }
    @media (max-width: 768px){
        .inner{padding: 0 20px;}
    }
    @media (max-width: 425px){
        .inner{padding: 0 16px;}
    }
    /* 미디어쿼리 끝 */

/*** 공통 끝 ***/


/* 스킵네비게이션 시작 */
#skip_navi{position: absolute; top: 0; left: 0; width:100%; font-size:0; z-index:9999; transition: top 0.3s;}
#skip_navi a{display:block; height:0; width:100%; overflow:hidden; text-align:center; color:#fff; white-space:nowrap; font-size:1.8rem; line-height:1; font-weight:300; background:#019c88;}
#skip_navi a:focus-visible,
#skip_navi a:active {top: 0; display:flex; align-items:center; justify-content:center; width:100%; height:4.5rem; line-height:4.5rem; background:#019c88; outline: 2px solid red; outline-offset: -2px;}
/* 스킵네비게이션 끝 */


/* 탑버튼 시작 */
.total_top_btn{
    position:fixed;
    bottom:40px;
    right:20px;
    width:56px;
    height:56px;
    box-shadow:10px 10px 40px 0px #0000001a;
    z-index:10;
    border-radius:16px;
    background:rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(5px);
    border:2px #bf9f17 solid;
    overflow:hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.total_top_btn.is_show{
    opacity: 1;
    visibility: visible;
}
.total_top_btn:focus:after{border-radius:16px;}
.total_top_btn img{display:block; width:100%; height:100%; object-fit:cover;}

    /* 미디어쿼리 시작 */
    @media (max-width: 1024px) {
        .total_top_btn{width:48px; height:48px; bottom:32px; right:32px; border-radius:14px;}
    }
    @media (max-width: 768px) {
        .total_top_btn{bottom:20px; right:20px; width:44px; height:44px; border-radius:12px;}
    }
    @media (max-width: 425px) {
        .total_top_btn{right:16px;}
    }
    /* 미디어쿼리 끝 */
/* 탑버튼 끝 */


/* 헤더 시작 */
#header{position: fixed; top: 0; left: 0; width: 100%;  z-index: 1000; transition: all 800ms; transition-delay:0s;}
#header.sub{border-bottom:1px rgba(255,255,255,0.2) solid;}
#header.hide{transform: translateY(-143px); transition-delay: 0.1s;}
#header .inner{max-width: 1914px;}
#header .h_wrap .inner{display:flex; align-items: center; justify-content: space-between; height:105px; padding-top:5px; padding-bottom:5px; transition: 0.3s ease;}
#header .h_wrap h1 a{width:200px; height:53px; display:inline-flex; align-items: center;  color:white; font-size:0; background: url(../images/layout/h1_logo.svg) center no-repeat; background-size: cover; margin-top:10px;}
#header .h_wrap h1 span{font-size:2.5rem; line-height:1; font-weight: 500; letter-spacing:-0.025rem;}
#header .h_wrap .util_btn_list .round_btn{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 0.3rem;
    position: relative;
    z-index: 0;
    padding: 1rem 1.6rem 1rem 1.6rem;
    border-radius: 4rem;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    line-height: 1;
    letter-spacing: -0.025rem;
    color: white;
    font-weight: 200;
    box-sizing: border-box;
    overflow: hidden;
}
#header .h_wrap .util_btn_list .round_btn:before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 1px; /* 테두리 두께 */
    background: linear-gradient(167deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, 0) 55%, rgba(255, 255, 255, 0.5));
    border-radius: inherit;
    -webkit-mask: linear-gradient(#fff, #fff) content-box, linear-gradient(#fff, #fff);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: 1;
}
#header .h_wrap .util_btn_list .round_btn:after{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:50%;
    height:100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.4),
        transparent
    );
    transform: skewX(-20deg);
    transition: all 0.6s ease;
}
#header .h_wrap .util_btn_list .round_btn:hover::after{left:120%;}
#header .h_wrap .util_btn_list .round_btn:hover{transform: translateY(-2px); background: rgba(0,0,0,0.18);}
#header .round_btn::after{
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.5),
        rgba(180,220,255,0.4), /* ← 이거 포인트 */
        transparent
    );
}
#header .h_wrap .util_btn_list .round_btn:active{transform:translateY(0); box-shadow:inset 0 2px 4px rgba(0,0,0,0.4);}
#header .h_wrap .util_btn_list .round_btn span{margin-top:0.2rem;}
#header .h_wrap .util_btn_list .round_btn .t_bold{font-weight:400;}
#header .h_wrap .util_btn_list .vr_btn{margin-top:10px;}
#header .h_wrap .util_btn_list .vr_btn:focus-visible{
    outline: none !important;
    box-shadow: inset 0 0 0 2px red !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
#header .h_wrap .util_btn_list .vr_btn span:first-child{position:relative; padding-left:30px;}
#header .h_wrap .util_btn_list .vr_btn span:first-child:before{
	content: '';
    display: block;
    position:absolute;
    top: calc(50% - 1px);
    left: 0;
    transform: translate(0, -50%);
    width: 22px;
    height: 17px;
	background: url(../images/layout/vr_icon.svg) no-repeat center;
	background-size:contain;
	pointer-events: none;
}
#header nav .mobile_only{display:flex; align-items:center;  gap:0 10px; height:75px; padding:0 15px; background-color:#f6faf9; border-bottom:1px solid #edf2f1; transition:border 0.2s;}
#header nav .mobile_only.bor_plus{border-bottom:1px #e5e5e5 solid;}
#header nav .mobile_only:before{
    content: "";
    width: 1px;
    height: 12px;
    background: #e2e2e2;
    position: absolute;
    top: 30px;
    right: 70px;
}
#header nav .mobile_only .mobile_goto_btn{display:inline-flex; align-items:center; justify-content:center; gap: 0 7px; height:33px; padding:1px 12px 0 9px; border:none; border-radius:6px; font-family:'Paperlogy'; font-size:1.45rem; font-weight:400; letter-spacing:-0.05rem; color:#fff; background:linear-gradient(135deg, #0ba39d 0%, #09847F 100%); box-shadow:0 4px 12px rgba(9, 132, 127, 0.25); transition:all 0.3s ease;}
#header nav .mobile_only .mobile_goto_btn:active{background-color:#fff; border-color:#09847F;}

#header .h_mobile_menu_btn{display:none;}
#header .h_mobile_menu_btn{z-index:9999;font-size:0rem;transition:all 0.3s ease 0s;width: 2.7rem; height: 1.8rem; position: relative;}
#header .h_mobile_menu_btn > span{display:block; position:absolute; left:0rem; width:100%; height:0.2rem; background:#fff;}
#header.open_m .h_mobile_menu_btn > span{background:black;}
#header .h_mobile_menu_btn > span:nth-of-type(1){top:0;}
#header .h_mobile_menu_btn > span:nth-of-type(2){top:50%; transition:background 0.3s ease 0s;}
#header .h_mobile_menu_btn > span:nth-of-type(3){top:1.8rem;}
#header .h_mobile_menu_btn > span:nth-of-type(1),
#header .h_mobile_menu_btn > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .h_mobile_menu_btn.active{position:fixed; transform:rotate(180deg); top: 28px; margin-left: 5px; right: 20px;}
#header .h_mobile_menu_btn.active > span:nth-of-type(1){top:1.0rem; transform:rotate(-45deg);}
#header .h_mobile_menu_btn.active > span:nth-of-type(2){background:transparent;}
#header .h_mobile_menu_btn.active > span:nth-of-type(3){top:1.0rem; transform:rotate(45deg);}
#header .h_mobile_menu_btn.active > span:nth-of-type(1),
#header .h_mobile_menu_btn.active > span:nth-of-type(3){transition-delay:0s, 0.3s;}

#header.scrolled{position:fixed; top:0; left:0; width:100%; background: rgba(20, 24, 28, 0.75); backdrop-filter:blur(15px) saturate(140%) brightness(1.05); -webkit-backdrop-filter:blur(15px) saturate(140%) brightness(1.05); border-bottom:1px solid rgba(255,255,255,0.08); box-shadow:0 8px 30px rgba(0, 0, 0, 0.4);}
#header.scrolled::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(255,255,255,0.15);
}
#header.scrolled .h_wrap .inner{height:95px; padding-top:0;}
#header.scrolled nav .gnb > li > a{color:#ffffff; transition:color 0.3s ease;}
#header.scrolled .h_wrap .util_btn_list .round_btn{background:rgba(255, 255, 255, 0.12); backdrop-filter:blur(20px) saturate(160%) brightness(1.1); -webkit-backdrop-filter:blur(20px) saturate(160%) brightness(1.1); border:1px solid rgba(255,255,255,0.12); box-shadow:inset 0 1px 2px rgba(255,255,255,0.2), 0 6px 25px rgba(0,0,0,0.45);}

	/* 미디어쿼리 시작 */
    @media all and (min-width: 1281px){
        #header nav, #header nav .gnb_in, #header nav .gnb{ height: 100%; }
        #header nav .gnb{display:flex;}
        #header nav .gnb > li{position:relative; margin:10px 35px 0 35px; }
        #header nav .gnb > li:last-child{margin-right:0;}
        #header.scrolled nav .gnb > li{padding-top:3px;}
        #header nav .gnb > li > a{display:inline-flex; align-items:center; height:100%;  font-size:2rem; font-weight:400; color:white; letter-spacing:-0.025rem; }
        #header nav .gnb > li > a:focus-visible::after{outline:none; border:none;}
        #header nav .gnb > li > a:focus-visible span{outline:2px solid red;}
        #header nav .gnb > li ul{
            position: absolute;
            top: 60px;
            left: 50%;
            min-width: 195px;
            padding: 13px 10px;
            z-index: 100;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transform: translateX(-50%) translateY(0);
            transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1);
            background: #ffffff;
            border-radius: 18px;
            border: 1px solid rgba(0, 0, 0, 0.06);
            box-shadow:
            0 15px 35px rgba(0, 0, 0, 0.1),
            inset 0 0 0 1px rgba(255, 255, 255, 1),
            0 0 0 1.5px rgba(255, 255, 255, 0.9),
            0 0 0 2px rgba(0, 0, 0, 0.02);
        }
        #header nav .gnb > li:hover ul,
        #header nav .gnb > li.active ul{opacity:1; visibility:visible;  pointer-events:auto;  transform:translateX(-50%) translateY(10px);}
        #header nav .gnb > li ul::before{
            content: '';
            position:absolute;
            top:-20px;
            left:0;
            width:100%;
            height:20px;
            background:transparent;
        }
        #header nav .gnb > li ul > li{margin:0; padding:0; line-height:1; }
        #header nav .gnb > li ul > li:not(:last-child){margin-bottom:2px; }
        #header nav .gnb > li ul > li > a{display:flex; align-items:center; height:40px; padding:0 16px; color:#333; font-size:1.7rem; font-weight:500; letter-spacing:-0.05rem; border-radius:10px; white-space:nowrap; transition:all 0.15s ease;}
        #header nav .gnb > li ul > li > a:hover{background:#edf3e9; color:#2d6010;}
        #header nav .gnb > li ul > li > a span{display:inline-block; transition:all 0.3s ease;}
        #header nav .gnb > li ul > li > a:hover span{transform:translateX(-3px); font-weight:600;}
        #header nav .gnb > li ul > li > a:focus-visible{background:#edf3e9; color:#2d6010;}
        #header nav .mobile_only{display:none;}
    }
	@media (min-width:1531px) and (max-width:1600px){
		#header nav .gnb > li{margin: 10px 28px 0 28px;}
	}
    @media (min-width:1451px) and (max-width:1530px){
        #header nav .gnb > li > a{font-size:1.95rem;}
        #header nav .gnb > li{margin: 10px 20px 0 20px;}
    }
	@media (min-width:1351px) and (max-width:1450px){
        #header nav .gnb > li > a{font-size:1.9rem;}
        #header nav .gnb > li{margin: 10px 18px 0 18px;}
    }
    @media (min-width:1281px) and (max-width:1350px){
        #header nav .gnb > li ul{min-width:185px;}
        #header nav .gnb > li > a{font-size:1.85rem;}
        #header nav .gnb > li{margin:10px 16px 0 16px;}
        #header .h_wrap .util_btn_list .vr_btn{font-size:1.5rem;}
        #header nav .gnb > li ul > li > a{height:35px; padding:0 12px; font-size: 1.65rem;}
	}
    @media (max-width: 1280px) {
		#header .h_wrap h1 a{width: 167px; height: 45px; margin-top:2px;}
        #header.scrolled .h_wrap h1 a{margin-top:7px;}
		#header .h_wrap .inner{height: 90px; padding-top: 0; padding-bottom: 0;}
        #header.scrolled .h_wrap .inner{height:77px; padding-top: 0; padding-bottom: 0;}
		#header .h_mobile_menu_btn{display:inline-block; position:fixed; top:35px; right:40px;}
        #header.scrolled .h_mobile_menu_btn{top:30px;}
        #header nav{position:fixed; top:0; right:-340px; width:320px; height:100vh; background:#fff; z-index:110; transition:right 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); box-shadow:-10px 0 30px rgba(0,0,0,0.05);}
        #header.open_m nav{right:0;}
        #header nav .mobile_only{width:100%; height:70px; display:flex; align-items:center; padding:0 15px; border-bottom:1px solid #f4f4f4;}
        #header nav .gnb_in{width:100%; height:calc(100vh - 70px); padding:25px 0; overflow-y:auto; scrollbar-width:none;}
        #header nav .gnb_in::-webkit-scrollbar{display:none;}
        #header nav .gnb{padding: 0 15px;}

        /* ★ 변경: position:relative 추가 (버튼 절대위치 기준점) */
        #header nav .gnb li.depth-1{position:relative; width:100%; margin:0; margin-bottom:8px;}

        /* ★ 변경: justify-content:flex-start 으로 변경, padding-right:58px 추가 (버튼 공간 확보) */
        #header nav .gnb li.depth-1 > a{display:flex; align-items:center; justify-content:flex-start; width:100%; height:58px; padding:0 20px; padding-right:58px; font-size:1.8rem; color:#555; font-weight:500; letter-spacing:-0.04rem; background:#fcfcfc; border:1px solid #f0f0f0; border-radius:10px; transition:all 0.3s ease; pointer-events:auto;}
        #header nav .gnb li.depth-1 > a span{font-family:'Paperlogy';}
        #header nav .gnb li.depth-1.on > a{color:#fff; border-color:#09847F; background:linear-gradient(135deg, #0ba39d 0%, #09847F 100%); box-shadow:0 4px 12px rgba(9, 132, 127, 0.25);}

        /* ★ 변경: a:after 화살표 숨김 (버튼으로 이동) */
        #header nav .gnb li.depth-1 > a:after{ display:none; }
        #header nav .gnb li.depth-1.on > a:after{ display:none; }

        /* ★ 추가: depth1-toggle 버튼 스타일 */
        #header nav .gnb li.depth-1 > .depth1-toggle{
            position:absolute; right:0; top:0;
            width:58px; height:58px;
            background:none; border:none; cursor:pointer;
            display:inline-flex; align-items:center; justify-content:center;
            z-index:1;
        }
        #header nav .gnb li.depth-1 > .depth1-toggle:after{
            content:'\e942';
            font-family:'xeicon';
            font-size:2.1rem; color:#bbb;
            transition:all 0.3s ease; line-height:1;
        }
        #header nav .gnb li.depth-1.on > .depth1-toggle:after{
            color:#fff; transform:rotate(180deg);
        }

        #header nav .gnb .depth-2{height:0; opacity:0; visibility:hidden; background:#f9fbfb; margin:0 5px; padding:0 15px; border-radius:0 0 10px 10px; overflow:hidden; transition:all 0.3s ease-out;}
        #header nav .gnb .depth-2.on{height:auto; opacity:1; visibility:visible; padding:12px 15px 15px 15px; margin-top:-5px; border:1px solid #eef1f1; border-top:none;}
        #header nav .gnb .depth-2 li{padding:0;}
        #header nav .gnb .depth-2 > li > a{display:block; padding:12px 10px; font-size:1.6rem; color:#2e2d39; font-weight:500; letter-spacing:-0.02rem; transition:all 0.2s ease; position:relative;}
        #header nav .gnb .depth-2 > li > a:hover{color:#09847F; padding-left:15px;}
        #header nav .gnb .depth-2 > li > a:before{
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            width: 4px;
            height: 4px;
            background: #09847F;
            border-radius: 50%;
            opacity: 0;
            transform: translateY(-50%);
            transition: all 0.2s;
        }
        #header nav .gnb .depth-2 > li > a:hover:before{opacity: 1;}
        #header nav .gnb .depth-2 > li > a:after,
        #header nav .gnb li.depth-1 > a:before{display:none;}
        #header nav .gnb .depth-2 > li > a span{font-family: 'Paperlogy';}
        #header .h_wrap .util_btn_list{margin-right:50px;}
        #header .h_wrap .util_btn_list .round_btn{font-size:1.5rem;}
        #header .h_wrap .util_btn_list .vr_btn{margin-top:2px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child{padding-left:27px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child:before{top:50%; width:21px; height:16px;}
        #header.open_m .mask{position: fixed; top:0; left:0; width:100%; height:100vh; background:rgba(0,0,0,0.6); z-index:100;}
    }
	@media (max-width: 1024px){
		#header .h_wrap h1 a{width:165px; height:44px;}
        #header.scrolled .h_wrap h1 a{margin-top:6px;}
		#header .h_wrap .inner{height:85px;}
        #header.scrolled .h_wrap .inner{height:70px;}
		#header .h_mobile_menu_btn{display:inline-block; position:fixed; top:36px; right:30px;}
        #header.scrolled .h_mobile_menu_btn{top:26px;}
        #header .h_wrap .util_btn_list{margin-right:45px;}
        #header .h_wrap .util_btn_list .round_btn{padding:0.9rem 1.6rem 0.9rem 1.6rem;}
        #header .h_wrap .util_btn_list .vr_btn{margin-top:3px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child:before{width:20px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child{padding-left:26px;}
	}
	@media (max-width: 768px){
		#header .h_mobile_menu_btn{right:20px;}
	}
	@media (max-width: 500px){
        #header .h_wrap h1 a{width:146px; height:40px; margin-top:5px;}
		#header .h_wrap .inner{height:75px;}
        #header.scrolled .h_wrap .inner{height:60px;}
		#header .h_wrap .util_btn_list{margin-right:35px;}
		#header .h_mobile_menu_btn{width: 2.2rem; height: 1.6rem; top:32px;}
        #header.scrolled .h_mobile_menu_btn{top:22px;}
		#header .h_mobile_menu_btn > span:nth-of-type(3){top:1.6rem;}
		#header .h_mobile_menu_btn.active{width: 2.7rem; height: 1.8rem; top: 28px;}
        #header .h_wrap .util_btn_list .round_btn{padding:0.8rem 1.6rem 0.8rem 1.6rem;}
        #header .h_wrap .util_btn_list .vr_btn{margin-top:3px;}
        #header .h_wrap .util_btn_list .vr_btn span:nth-child(2){display:none;}
	}
	@media (max-width: 425px){
		#header .h_mobile_menu_btn{right:16px;}
        #header .h_wrap .util_btn_list .round_btn{padding:0.7rem 1.6rem 0.7rem 1.6rem;}
        #header .h_wrap .util_btn_list .vr_btn{margin-top:2px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child{padding-left:24px;}
        #header .h_wrap .util_btn_list .vr_btn span:first-child:before{width:19px;}
	}
	/* 미디어쿼리 끝 */
/* 헤더 끝 */


/* 푸터 시작 */
#footer{position:relative; width:100%; background-color:#111111; z-index:5; padding:70px 0 60px;}
#footer > .inner{position:relative; width:100%; display:flex; justify-content:space-between; align-items:flex-start;}
#footer .left_align_wrap{display:flex; flex-wrap:wrap; flex-direction: column; align-content:flex-start; margin-top:0;}
#footer .f_logo{width:197px; height:57px; background: url(../images/layout/h1_logo_gray.svg) center no-repeat; background-size:contain; margin-bottom:30px;}
#footer .center_info{width:100%; margin-top:0px; display:flex; gap:0 40px;}
#footer .center_info dl.f_item{display:inline-flex; align-items:flex-start;}
#footer .center_info dl.f_item dt, #footer .center_info dl.f_item dd{font-size:1.7rem; line-height:1.4; letter-spacing:-0.025rem;}
#footer .center_info dl.f_item dt{position:relative; color:rgb(255,255,255,0.8); font-weight:600; padding-right:9px;}
#footer .center_info dl.f_item dt:before{
    content: '';
    display: block;
    position:absolute;
    top: 5px;
    right: 0;
    width: 1px;
    height: 12px;
    background-color:#595959;
}
#footer .center_info dl.f_item dd{color:rgb(255,255,255,0.6); font-weight:200; padding-left:9px;}
#footer .copyright{width:100%; color:rgb(255,255,255,0.25); font-size:1.6rem; margin-top:20px; line-height:1.4; font-weight:300; letter-spacing:-0.025rem;}
#footer .right-align_wrap{display:flex; flex-direction:column; align-items:flex-end;  flex-wrap:wrap; justify-content:flex-end; gap:28px 0; margin-top:10px;}
#footer .f_menu{display:flex; flex-wrap:wrap; align-items:center; gap:27px;}
#footer .f_menu > li{position:relative; line-height:0;}
#footer .f_menu > li:last-child:before{display:none;}
#footer .f_menu > li > a{display:inline-block; font-size:1.7rem; line-height:1; font-weight:300; letter-spacing:-0.05rem; color:rgba(255,255,255,1); transition:color ease 0.3s;}
#footer .f_menu > li > a:hover{color: #abc5ff;}
#footer .f_menu > li.insta > a{position:relative; width:21px; height:21px;}
#footer .f_menu > li.insta > a:before{
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    width: 21px;
    height: 21px;
    background: url(../images/layout/instagram_icon.svg) center no-repeat;
    background-size: contain;
    transition: opacity 0.3s ease;
    opacity: 0.5;
}
#footer .f_menu > li.insta > a:hover:before{
    opacity: 1;
}
#footer .f_etc{display:flex; align-items:center; gap:20px;}
#footer .family_link{width: 210px; height: 50px; border:1px rgba(255,255,255,0.2) solid; position: relative; z-index: 100; background-color:#212225; border-radius:5px; pointer-events:auto;}
#footer .family_link:before{
    content: "";
    position: absolute;
    top: calc(50% + 1px);
    right: 13px;
    transform: translate(0, -50%);
    width: 22px;
    height: 22px;
    background: url(../images/layout/arrow_down.svg) center no-repeat;
    background-size: contain;
    transition: 0.3s;
    opacity: 0.7;
}
#footer .family_link.active::before{transform: translate(0, -50%) rotate(180deg);}
#footer .family_link .family_link_list_default{position:relative; font-size: 1.6rem; font-weight:300; color: #fff; display: inline-flex; align-items: center; width: 100%; height: 100%; padding: 0 20px; z-index:2;}
#footer .family_link .family_link_list_default > i{font-size: 1.9rem; margin-right:6px;}
#footer .family_link .family_link_list{display:none; position: absolute; width: 100%; left: 0; bottom: 49px; background: #111; overflow: auto; max-height: 229px; box-sizing: border-box; border: 1px #222325 solid; border-bottom: none; border-radius: 10px 10px 0 0;}
#footer .family_link .family_link_list li{border-bottom: 1px solid rgba(255,255,255,0.1);}
#footer .family_link .family_link_list li:last-child{border-bottom:none;}
#footer .family_link .family_link_list li a{position: relative; display: block; height: 48px; line-height: 48px; padding: 0 16px; font-family: 'Paperlogy'; font-size: 1.6rem; font-weight:300; color: rgba(255, 255, 255, 0.6); letter-spacing:-0.025rem; text-align: left; transition: 0.3s;}
#footer .family_link .family_link_list li a:focus-visible{outline: 2px solid red; outline-offset: -2px;}
#footer .family_link .family_link_list li a:hover{color:white;}
#footer .family_link .family_link_list{overflow-y:scroll; -ms-overflow-style: none; scrollbar-width: none; overflow-x: hidden;}
#footer .family_link .family_link_list::-webkit-scrollbar{display: block; width: 4px; height: 6px;}
#footer .family_link .family_link_list::-webkit-scrollbar-track{background-color: #eee;}
#footer .family_link .family_link_list::-webkit-scrollbar-thumb{border-radius: 3px; background-color:#9f9f9f;}
#footer .family_link .family_link_list::-webkit-scrollbar-button{width: 0; height: 0;}

    /* 미디어쿼리 시작 */
    @media (max-width: 1280px) {
        #footer{padding:50px 0; height:auto;}
        #footer > .inner{flex-wrap:wrap; flex-direction:column; box-sizing:border-box;}
        #footer .right-align_wrap{width:100%; flex-direction:row; justify-content:space-between; align-items:center; margin-top:0; margin-bottom:40px; order:1;}
        #footer .left_align_wrap{width:100%; order:2; margin-top:0;}
        #footer .f_logo{opacity:0.5;}
    }
    @media (max-width: 768px) {
        #footer{padding:40px 0;}
        #footer .right-align_wrap{width:100%; order:1; display:flex; flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:35px;}
        #footer .f_menu{width:100%; display:flex; justify-content:flex-start; gap:10px 20px;}
        #footer .f_menu > li > a{font-size:1.6rem;}
        #footer .f_etc{width:100%; display:flex; justify-content:space-between; align-items:center; gap:15px;}
        #footer .family_link{
            flex:1;
            max-width:100%;
            height:48px;
            margin-top:0;
        }
        #footer .left_align_wrap{width:100%; order:2; display:flex; flex-direction:column;}
        #footer .f_logo{width:150px; height:45px; margin-bottom:20px; background-position:left center;}
        #footer .center_info{display:flex; flex-direction:column; gap:10px; margin-top:0;}
        #footer .center_info dl.f_item{display:flex; flex-direction:row; align-items:flex-start;}
        #footer .center_info dl.f_item dt, #footer .center_info dl.f_item dd{font-size:1.6rem;}
        #footer .copyright{margin-top:25px; font-size:1.4rem; line-height:1.5; text-align:left;}
    }
    @media (max-width: 480px) {
        #footer .f_menu{gap:10px 15px;}
        #footer .f_menu > li > a{font-size:1.5rem;}
        #footer .f_etc{flex-direction:column; align-items:flex-start;}
        #footer .family_link{width:100%; flex:none;}
        #footer .center_info dl.f_item{flex-direction:column; gap:4px;}
        #footer .center_info dl.f_item dt:before{display:none;}
        #footer .center_info dl.f_item dt, #footer .center_info dl.f_item dd{padding:0; font-size:1.5rem;}
    }
    /* 미디어쿼리 끝 */
/* 푸터 끝 */
