@charset "utf-8";

/* =========================
   공통
========================= */
a, button {transition:all 350ms cubic-bezier(.16,1,.64,1);transition-timing-function:cubic-bezier(.16,1,.64,1);}
img {max-width:100%;}
.wrap {width:clamp(0px,96%,1542px);margin:0 auto;}
.main_wrap {width:clamp(0px,96%,1720px);margin:0 auto;}


/* =========================
   헤더영역
========================= */
/* HEADER */
#fs_header {position:fixed;top:0;left:0;z-index:100;width:100%;}
#fs_head {display:flex;justify-content:space-between;align-items:center;height:10rem;}

/* 로고 */
#fs_head .logo a {display:flex;justify-content:center;align-items:center;}
#fs_head .logo img {filter:brightness(0) invert(1);transition:filter 0.3s;}
#fs_head:is(.fix, .sub) .logo img,
body.sub #fs_head .logo img {filter:none;}

/* 헤더메뉴 */
#fs_head {position:relative;}
#fs_head .head_right {display:flex;align-items:center;justify-content:flex-end;gap:8rem;}
#fs_head .fs_top_menu .lnb {display:flex;gap:6rem;}
#fs_head .fs_top_menu .lnb > li {position:relative;line-height:10rem;transition:all .4s ease-in-out;color:#fff;}
#fs_head .fs_top_menu .lnb .lnb_title {position:relative;z-index:20;display:block;font-weight:600;font-size:2.2rem;letter-spacing:0.04em;}
#fs_head .fs_top_menu .lnb .lnb_title.hov {color:var(--primary) !important;}
#fs_head .fs_top_menu .lnb .lnb_title::before {position:absolute;top:3rem;left:0;content:"";width:0;height:2px;background:var(--primary);transition:width .4s ease-in-out;}
#fs_head .fs_top_menu .lnb .lnb_title.hov::before {width:50%;}
#fs_head:is(.fix, .sub) .fs_top_menu .lnb > li,
body.sub #fs_head .fs_top_menu .lnb > li {color:var(--black);}
#fs_head:is(.fix, .sub) .fs_top_menu .lnb .lnb_title,
body.sub #fs_head .fs_top_menu .lnb .lnb_title {color:var(--black);}

    /* 2뎁스 */
	#fs_head .lnb_layer01 {display:none;position:absolute;left:0;z-index:10;min-width:100%;width:max-content;padding:1.5rem 1rem;background:var(--bm50);border-radius:0 0 1rem 1rem;}
	#fs_head .lnb_layer01 li a {display:block;font-size:1.8rem;font-weight:500;line-height:2.2;color:rgba(255,255,255,.7);padding:0 1rem;border-radius:.3rem;}
	#fs_head .fs_top_menu > ul > li.hov .lnb_layer01 a:hover {color:var(--primary);background:var(--wm10);}
    
    /* fix, sub 상태 2뎁스 */
    #fs_head:is(.fix, .sub) .lnb_layer01,
    body.sub #fs_head .lnb_layer01 {background:#fff;box-shadow:0 10px 15px rgba(0,0,0,0.05);}
    #fs_head:is(.fix, .sub) .lnb_layer01 li a,
    body.sub #fs_head .lnb_layer01 li a {color:var(--black);}
    #fs_head:is(.fix, .sub) .fs_top_menu > ul > li.hov .lnb_layer01 a:hover,
    body.sub #fs_head .fs_top_menu > ul > li.hov .lnb_layer01 a:hover {color:var(--primary);background:#f5f5f5;}

/* 글로벌 */
.global_box {display:flex;align-items:center;gap:.5rem;}

/* 사이트맵 버튼 */
#pfBtn {display:flex;width:5.3rem;height:5rem;position:relative;top:0;right:0;z-index:101;background:transparent;}
#pfBtn span {display:block;position:relative;width:5.3rem;height:2px;margin:auto;background:transparent;}
#pfBtn span::before, #pfBtn span::after {display:block;content:"";position:absolute;top:0;width:100%;height:2px;background:var(--primary);transition:all 0.3s;}
#pfBtn span::before  {top:-0.5rem;}
#pfBtn span::after {display:block; top:0.5rem;}
#pfBtn.active {background:transparent;}
#pfBtn.active span {border:none;background:transparent;}
#pfBtn.active span::before {top:0;transform:rotate(45deg);background:#fff;}
#pfBtn.active span::after {display:block;top:0;transform:rotate(-45deg);background:#fff;}
#pfBtn.active:hover span::before, #pfBtn.active:hover span::after {background:#fff;}

/* 사이트맵 오픈 */
#pfWrap {display:none;position:fixed;top:0;left:-100%;z-index:100;width:100%;height:100%;background-color:rgba(6,24,48,.45);backdrop-filter:blur(1.2rem);}
#pfWrap .bg_wrap {position:absolute;z-index:1;width:30%;margin:0 auto;}
#pfWrap .bg {position:absolute;left:0;top:0;width:0;max-height:98rem;height:100vh;margin-left:0;background:url('../../images/fs/layout/sitemap_bg.jpg') no-repeat center/cover;box-shadow:5px 0 25px rgba(0,0,0,0.15);}
.pf_cate {position:absolute;right:0;top:0;width:0;height:100%;background:radial-gradient(circle at 85% 15%, rgba(34,226,255,.12) 0%, transparent 45%), linear-gradient(135deg, #10599a 0%, #0a3d6b 100%);box-shadow:-15px 0 35px rgba(0,0,0,.2);}
.pf_cate .pf_mn {position:absolute;top:50%;transform:translateY(-50%);width:100%;padding:0 10%;max-height:90%;overflow-y:auto;display:grid;grid-template-columns:repeat(3, 1fr);row-gap:6rem;column-gap:3rem;}
.pf_cate .pf_1dep {opacity:0;margin-left:10rem;padding-bottom:0;border-bottom:none;}
.pf_cate .pf_1dep+li {margin-top:0;}
.pf_cate .pf_1dep > a {display:inline-block;width:max-content;font-size:2.8rem;font-weight:700;color:#fff;margin-bottom:1.8rem;padding-bottom:.6rem;position:relative;letter-spacing:-0.02em;transition:color .3s ease;}
.pf_cate .pf_1dep > a::after {content:'';position:absolute;left:0;bottom:0;width:2.4rem;height:2px;background:rgba(255,255,255,.35);transition:width .3s ease, background .3s ease;}
.pf_cate .pf_1dep > a:hover {color:#22e2ff;}
.pf_cate .pf_1dep > a:hover::after {width:100%;background:#22e2ff;}
.pf_cate .pf_1dep ul {display:flex;flex-direction:column;gap:1.2rem;margin-top:0;}
.pf_cate .pf_1dep ul li {margin-right:0;}
.pf_cate .pf_1dep ul a {display:inline-block;opacity:0.88;font-size:1.8rem;font-weight:400;color:#e5f1fb;transition:all .25s ease;}
.pf_cate .pf_1dep ul a:hover {opacity:1;color:#22e2ff;transform:translateX(5px);}

/* 헤더 스크롤 & 서브 */
#fs_header:is(.sub, :has(#fs_head:is(.fix, .sub))),
body.sub #fs_header {background:#fff;border-bottom:1px solid rgba(217,217,217,.2);}

/* 반응형 메뉴 */
#topmenuM {display:none;}

	@media only screen and (max-width:1699px){
		#fs_head .fs_top_menu .lnb {gap:5rem;}
	}
	@media only screen and (max-width:1299px){
		#fs_head .fs_top_menu .lnb {gap:4rem;}
	}
    @media only screen and (max-width:1199px){
        #fs_head .logo img {height:4.5rem;}
		#fs_head .fs_top_menu .lnb {gap:2.5rem;}
        #fs_head .fs_top_menu .lnb .lnb_title {font-size:2rem;}
	}
	@media only screen and (max-width:1023px) {
		#fs_head {display:none;}
		#topmenuM {display:flex;align-items:center;position:relative;width:100%;height:8rem;line-height:1.8;background:#fff;padding:0 2rem;}
		/* 로고 */
		#m_logo {position:relative;display:flex;align-items:flex-end;gap:.5rem;}
		#m_logo a {display:flex;justify-content:center;align-items:center;}
        #m_logo a img {height:4rem;}
		/* 모바일 메뉴버튼 */
		#m_navBtn {position:absolute;top:35px;right:2rem;transform:translateY(-50%);z-index:10;width:30px;height:30px;cursor:pointer;}
		#m_navBtn span {display:block;position:relative;top:50%;transform:translateY(-50%);width:100%;height:2px;}
		#m_navBtn span:before, #m_navBtn span:after {display:block;content:"";position:absolute;top:-6px;width:30px;height:2px;background-color:var(--black);-webkit-transition:all .1s;transition:all .1s;}
		#m_navBtn span:after {top:6px;width:16px;right:0;background-color:var(--primary);}
		#m_navBtn.on {position:fixed;z-index:10;}
		#m_navBtn.on span:before {top:0;right:-4px;transform:rotate(45deg);}
		#m_navBtn.on span:after {top:0;right:-4px;width:30px;transform:rotate(-45deg);background-color:var(--black);}
		/* 모바일 메뉴 */
		#navWrap {display:none;position:fixed;left:0;top:0;z-index:4;width:100%;height:100%;background-color:rgba(0,0,0,.7);overscroll-behavior:contain;touch-action:none;}
		#navWrap .inner {overflow-y:scroll;opacity:0;position:fixed;right:-40px;top:0;z-index:6;min-width:30rem;width:75%;height:100%;padding:6rem 0;background-color:#fff;-webkit-transition:all .1s;transition:all .1s;overscroll-behavior:contain;touch-action:pan-y;}
		#navWrap.on .inner {opacity:1;right:0;-webkit-transition:all .4s;transition:all .4s;}
		#navWrap .inner:before, #navWrap .inner:after {opacity:0;display:block;position:fixed;top:0;right:-40px;z-index:1;content:"";min-width:30rem;width:70%;height:60px;background-color:#fff;-webkit-transition:all .1s;transition:all .1s;}
		#navWrap .inner:after {top:auto;bottom:0;}
		#navWrap.on .inner:before, #navWrap.on .inner:after {opacity:1;right:0;-webkit-transition:all .4s;transition:all .4s;}
		/* 대분류 */
		#topmenuM .m_lnb .m_bmenu {display:block;position:relative;width:100%;height:7rem;font-weight:600;font-size:1.8rem;color:var(--primary);line-height:7rem;padding:0 1rem 0 3rem;border:none;border-bottom:1px solid #ddd;background:none;}
		#topmenuM .m_lnb li:has(.m_smenu) .m_bmenu:after {float:right;content:"\ea4e";font-family:'remixicon';font-size:2rem;}
		#topmenuM .m_lnb li:has(.m_smenu) .m_bmenu.on:after {content:"\ea78";}
		/* 소분류 */
		#topmenuM .m_smenu {display:none;padding:2rem 2rem 2rem 3rem;border-bottom:1px solid #ddd;background-color:var(--wm10);}
		#topmenuM .m_smenu li a {font-weight:500;font-size:1.6rem;}
	}


/* =========================
   컨텐츠 영역
========================= */
/* 컨텐츠 상단 */
.con_header {position:relative;z-index:50;padding:17rem 0 3rem;margin-bottom:8rem;border-bottom:1px dashed #ddd;}
.con_header .snb_title {font-family:var(--tit_font);font-weight:800;font-size:7rem;line-height:1.2;color:var(--black);letter-spacing:-0.02em;padding-bottom:5rem;text-wrap:balance;}
.con_header .con_info {display:flex;gap:2rem;justify-content:space-between;align-items:center;flex-wrap:wrap;}
.con_header .location {display:flex;align-items:center;gap:2.2rem;line-height:1.2;}
.con_header .location > li {position:relative;}
.con_header .location > li:nth-child(n + 2)::before {content:'';position:absolute;top:50%;left:-1rem;width:2px;height:2px;background-color:#606060;border-radius:50%;transform:translateY(-50%);}
.con_header .location li a.home {font-size:2rem;}
.con_header .snb_menu .dep {display:flex;gap:1rem;}
.con_header .snb_menu .dep > li {position:relative;}
.con_header .snb_menu .dep li .depth_p {width:100%;font-weight:600;font-size:1.8rem;color:var(--black);min-width:25rem;padding:1.5rem 5rem 1.5rem 2.5rem;background-color:#f1f1f1;border-radius:10rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;position:relative;}
.con_header .snb_menu .dep li .depth_p::after {content:"\ea4e";font-family:"remixicon";display:block;position:absolute;top:50%;right:2.5rem;transform:translateY(-50%);transition: .3s;}
.con_header .snb_menu .dep li .depth_p.on::after {transform:translateY(-50%) rotate(180deg);}
.con_header .snb_menu .dep li:not(:has(.drop_menu li)) .depth_p,
.con_header .snb_menu .dep li.no_sub .depth_p,
.con_header .snb_menu .dep li .depth_p.no_sub {cursor:default;padding:1.5rem 2.5rem;}
.con_header .snb_menu .dep li:not(:has(.drop_menu li)) .depth_p::after,
.con_header .snb_menu .dep li.no_sub .depth_p::after,
.con_header .snb_menu .dep li .depth_p.no_sub::after,
.con_header .snb_menu .dep li .drop_menu:not(:has(li)),
.con_header .snb_menu .dep li .drop_menu:empty {display:none !important;}
.con_header .snb_menu .dep li .drop_menu {display:none;width:calc(100% + 2px);background:#fff;border:1px solid #ddd;border-radius:1rem;position:absolute;top:calc(100% + 5px);left:-1px;z-index:10;}
.con_header .snb_menu .dep li .drop_menu li + li {border-top:1px solid #ddd;}
.con_header .snb_menu .dep li .drop_menu li a {display:block;font-weight:500;font-size:1.7rem;padding:1rem 1.5rem;word-break:keep-all;transition:.2s;}
.con_body {overflow:hidden;padding-bottom:6rem;}
	@media only screen and (max-width:1199px){
		.con_header {padding:16rem 0 3rem;}
		.con_body {padding-bottom:4rem;}
	}
	@media only screen and (max-width:1023px){
		.con_header {padding:15rem 0 3rem;margin-bottom:6rem;z-index:1;}
		.con_header .snb_title {font-size:5rem;padding-bottom:4.5rem;}
	}
	@media only screen and (max-width:767px){
		.con_header {padding:14rem 0 3rem;margin-bottom:4rem;}
		.con_header .snb_title {font-size:4rem;}
		.con_header .con_info {flex-direction:column;align-items:flex-start;}
		.con_header .snb_menu {width:100%;}
        .con_header .snb_menu .dep {max-width:100%;}
		.con_header .snb_menu .dep > li {flex:1 1 auto;max-width:calc(100% - 17rem);}
		.con_header .snb_menu .dep > li .depth_p {min-width:100%;padding:1rem 4rem 1rem 1.5rem;}
        .con_header .snb_menu .dep li .depth_p::after {right:1.5rem;}
		.con_header .snb_menu .dep > li:not(:has(.drop_menu li)) .depth_p,
		.con_header .snb_menu .dep > li.no_sub .depth_p,
		.con_header .snb_menu .dep > li .depth_p.no_sub {padding:1rem 1.5rem;}
		.con_header .snb_menu .dep li .drop_menu li a {font-size:1.5rem;}
	}


/* =========================
   푸터영역
========================= */
/* 협력업체 */
.banner_wrap {border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:2.5rem 0;}
.banner_wrap .wrap {display:flex;align-items:center;justify-content:space-between;gap:5rem;}
.banner_list {flex:1;overflow:hidden;}
.banner_list .swiper-slide {display:flex;align-items:center;justify-content:center;height:3.5rem;}
.banner_list .swiper-slide a {display:flex;align-items:center;justify-content:center;width:100%;height:100%;}
.banner_list .swiper-slide img {max-width:100%;max-height:100%;object-fit:contain;transition:opacity 0.2s;}
.banner_list .swiper-slide a:hover img {opacity:0.8;}
.banner_ctrl {display:flex;align-items:center;gap:.5rem;flex-shrink:0;}
.banner_ctrl button {background:none;border:none;font-size:2rem;color:var(--black);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.banner_ctrl button:hover {color:var(--primary);}

#fs_footer {--foot-logo-w:14rem;--foot-gap:9rem;padding:4rem 0 6rem;}
#fs_footer .foot_menu {display:flex;align-items:center;gap:3.5rem;border-bottom:1px solid var(--black);padding:0 0 2rem calc(var(--foot-logo-w) + var(--foot-gap));margin-bottom:2.5rem;}
#fs_footer .foot_menu a {font-family:var(--tit_font);font-weight:500;font-size:1.6rem;color:var(--black);transition:color .3s ease;}
#fs_footer .foot_menu a:is(:hover,:focus,:active) {color:var(--primary);}
#fs_footer .info_wrap {display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;}
#fs_footer .info_wrap .left {display:flex;gap:var(--foot-gap);min-width:0;}
#fs_footer .info_wrap .foot_logo {width:var(--foot-logo-w);flex-shrink:0;}
#fs_footer .info_wrap .foot_logo img {width:100%;display:block;}
#fs_footer .info_wrap .info {display:flex;flex-wrap:wrap;gap:0 4rem;}
#fs_footer .info_wrap .info li {font-family:var(--tit_font);font-weight:300;font-size:1.6rem;color:var(--black);line-height:1.8;position:relative;}
#fs_footer .info_wrap .info li::after {display:block;content:'';position:absolute;left:-2rem;top:50%;transform:translateY(-50%);width:1px;height:1.1rem;background:var(--black);}
#fs_footer .info_wrap .info li.address {width:100%;}
#fs_footer .info_wrap .info li:is(.address,.tel,.copy)::after {display:none;}
#fs_footer .info_wrap .info li.copy {font-family:"Paperlogy";width:100%;font-weight:200;color:#818181;margin-top:1rem;}
#fs_footer .info_wrap .info li.copy em {font-weight:600;color:var(--primary);}
#fs_footer .toTop {display:flex;justify-content:center;align-items:center;width:8.4rem;height:8.4rem;border-radius:50%;background:var(--primary);color:#fff;}
#fs_footer .toTop i {font-size:3.2rem;color:#fff;line-height:1;}
#fs_footer .toTop:is(:hover,:focus,:active) {background:var(--bm80);transform:translateY(-4px);}
#fs_footer .toTop:is(:hover,:focus,:active) i {transform:translateY(-2px);}
	@media only screen and (max-width:1199px){
        #fs_footer {--foot-gap:5rem;}
        #fs_footer .info_wrap .info {gap:0 3rem;}
        #fs_footer .info_wrap .info li:is(:nth-child(3), :nth-child(4))::after {left:-1.5rem;}
	}
	@media only screen and (max-width:1023px){
        #fs_footer {--foot-gap:3rem;padding:4rem 0;}
        #fs_footer .foot_menu {padding-left:0;}
        #fs_footer .info_wrap .left {flex-direction:column;}
        #fs_footer .toTop {width:6.4rem;height:6.4rem;}
        #fs_footer .toTop i {font-size:2.6rem;}
	}
	@media only screen and (max-width:767px){
        #fs_footer {--foot-gap:2.5rem;padding:3rem 0;}
        #fs_footer .foot_menu {display:none;}
        #fs_footer .info_wrap {flex-direction:column;align-items:flex-start;position:relative;}
        #fs_footer .info_wrap .info li.copy {font-size:1.5rem;}
        #fs_footer .info_wrap .right {position:absolute;right:0;top:0;}
        #fs_footer .toTop {width:5.2rem;height:5.2rem;}
        #fs_footer .toTop i {font-size:2.2rem;}
	}
/* language switch (KOR / ENG) */
.global_box .lang_box {display:flex;align-items:center;gap:1.2rem;margin-right:2rem;font-size:1.6rem;font-weight:600;letter-spacing:0.04em;}
.global_box .lang_box a {color:rgba(255,255,255,.6);transition:color .3s;}
.global_box .lang_box a.on,
.global_box .lang_box a:hover {color:#fff;}
.global_box .lang_box a + a::before {content:"";display:inline-block;width:1px;height:1.2rem;margin-right:1.2rem;background:currentColor;opacity:.4;vertical-align:middle;}
#fs_head:is(.fix, .sub) .global_box .lang_box a {color:#999;}
#fs_head:is(.fix, .sub) .global_box .lang_box a.on,
#fs_head:is(.fix, .sub) .global_box .lang_box a:hover {color:var(--primary);}
/* mobile language switch (shown in the mobile header bar, left of the menu button) */
#topmenuM .m_lang_box {position:absolute;top:35px;right:calc(2rem + 30px + 2.4rem);transform:translateY(-50%);z-index:3;display:flex;align-items:center;gap:1rem;font-size:1.4rem;font-weight:600;letter-spacing:0.04em;line-height:1;}
#topmenuM .m_lang_box a {color:#999;transition:color .3s;}
#topmenuM .m_lang_box a.on,
#topmenuM .m_lang_box a:hover {color:var(--primary);}
#topmenuM .m_lang_box a + a::before {content:"";display:inline-block;width:1px;height:1.1rem;margin-right:1rem;background:#ccc;vertical-align:-0.1rem;}
