@charset "utf-8";

/* =========================
   공통
========================= */
a {transition:all 200ms 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;}


/* =========================
   헤더영역
========================= */
/* HEADER */
#fs_header {position:fixed;z-index:100;width:100%;}
#fs_head {display:flex;align-items:center;position:absolute;width:100%;height:10rem;padding:0 10rem;border-bottom:1px solid rgba(255,255,255,.2);}
#fs_head.sub {position:relative;}
	@media only screen and (max-width:1399px) {
		#fs_head {padding:0 3rem;}
	}
	@media only screen and (max-width:1023px) {
		#fs_head {display:none;}
	}

/* 로고 */
#fs_head .logo {position:relative;z-index:20;}
#fs_head .logo a {display:flex;justify-content:center;align-items:center;filter:brightness(0) saturate(100%) invert(99%) sepia(49%) saturate(0%) hue-rotate(165deg) brightness(111%) contrast(100%);}

/* 헤더메뉴 */
#fs_head .fs_top_menu {position:absolute;left:50%;top:50%;transform:translateY(-50%);}
#fs_head .fs_top_menu .lnb > li {float:left;position:relative;line-height:10rem;transition:all .4s ease-in-out;color:#fff;margin-right:6rem;}
#fs_head .fs_top_menu .lnb > li:last-child {margin-right:0;}
#fs_head .fs_top_menu .lnb .lnb_title {position:relative;z-index:20;display:block;font-weight:600;font-size:1.8rem;}
#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:2.5rem;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.on .fs_top_menu .lnb .lnb_title {color:var(--black);}
    /* 2뎁스 */
	#fs_head .lnb_layer01 {display:none;position:absolute;left:0;min-width:100%;width:max-content;padding:1.5rem 1rem;background:var(--primary2);border-radius:0 0 1rem 1rem;}
	#fs_head .lnb_layer01 li a {display:block;font-size:1.6rem;font-weight:500;line-height:2.2;color:rgba(255,255,255,.5);padding:0 1rem;border-radius:.3rem;}
	#fs_head .fs_top_menu > ul > li.hov .lnb_layer01 a:hover {color:var(--primary);background:var(--wm10);}
		@media only screen and (max-width:1542px) {
			#fs_head .fs_top_menu {transform:translate(-30%,-50%);}
		}
		@media only screen and (max-width:1399px) {
			#fs_head .fs_top_menu .lnb > li {margin-right:4rem;}
		}
		@media only screen and (max-width:1199px) {
			#fs_head .fs_top_menu .lnb > li {margin-right:3rem;}
		}

/* 사이트맵 버튼 */
#pfBtn {display:flex;position:absolute;top:0;right:0;z-index:101;width:10rem;height:10rem;border-left:1px solid rgba(255,255,255,.2);}
#pfBtn span {display:block;position:relative;width:26px;height:3px;margin:auto;background:var(--primary);}
#pfBtn span:before, #pfBtn span:after {display:block;content:"";position:absolute;top:0;width:100%;height:3px;background:var(--primary);}
#pfBtn span:before  {top:-9px;}
#pfBtn span:after {top:9px;}
#pfBtn.active {background:#fff;}
#pfBtn.active span {border:none;background:transparent;}
#pfBtn.active span:before {top:0;transform:rotate(45deg);background:var(--primary2);}
#pfBtn.active span:after {top:0;transform:rotate(-45deg);background:var(--primary2);}

/* 사이트맵 오픈 */
#pfWrap {display:none;position:fixed;top:0;left:-100%;z-index:100;width:100%;height:100%;background-color:rgba(0,0,0,.6);backdrop-filter:blur(1rem);}
#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;}
.pf_cate {position:absolute;right:0;top:0;width:0;height:100%;background-color:var(--primary2);}
.pf_cate .pf_mn {position:absolute;top:50%;transform:translateY(-50%);width:100%;padding:0 15%;max-height:82%;overflow-y:auto;}
.pf_cate .pf_1dep {opacity:0;margin-left:10rem;padding-bottom:4rem;border-bottom:1px solid rgba(255,255,255,.25);}
.pf_cate .pf_1dep+li {margin-top:4rem;}
.pf_cate .pf_1dep > a {display:block;width:max-content;font-size:3.2rem;font-weight:600;color:var(--primary);}
.pf_cate .pf_1dep ul {display:flex;flex-wrap:wrap;margin-top:2rem;gap:.5rem 0;}
.pf_cate .pf_1dep ul li {margin-right:2.5rem;}
.pf_cate .pf_1dep ul a {opacity:0.4;font-size:1.8rem;font-weight:500;color:#fff;}
.pf_cate .pf_1dep ul a:hover {opacity:1;}

/* 헤더 스크롤 */
#fs_head.fix {background:#fff;border-color:#ddd;}
#fs_head.fix .fs_top_menu > ul > li > a {color:var(--black);}
#fs_head.fix .logo a {filter:none;}
#fs_head.fix #pfBtn {border-color:var(--primary);background:var(--primary);}
#fs_head.fix #pfBtn.active {border-color:#fff;background:#fff;}
#fs_head.fix #pfBtn span {background:#fff;}
#fs_head.fix #pfBtn span:before, #fs_head.fix #pfBtn span:after {background:#fff;}
#fs_head.fix #pfBtn.active span {background:transparent;}
#fs_head.fix #pfBtn.active span:before, #fs_head.fix #pfBtn.active span:after {background:var(--primary2);}

/* 반응형 메뉴 */
#topmenuM {display:none;}
	@media only screen and (max-width:1023px) {
		#topmenuM {display:flex;align-items:center;position:relative;width:100%;height:8rem;line-height:1.8;border-bottom:1px solid #ddd;background:#fff;padding:0 2rem;}
		/* 로고 */
		#m_logo {position:relative;}
		#m_logo a {display:flex;justify-content:center;align-items:center;}
		/* 모바일 메뉴버튼 */
		#m_navBtn {position:absolute;top:35px;right:2rem;transform:translateY(-50%);z-index:5;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;}
		#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);}
		#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;}
		#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;}
		#navWrap .inner .mo_hd_copy {position:fixed;right:0;bottom:15px;z-index:2;min-width:30rem;width:70%;font-size:12px;text-align:center;}
		/* 대분류 */
		#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 {padding:26rem 0 12rem;}
.con_header .snb_title {font-size:8rem;line-height:1;color:var(--black);}
.con_header .snb_menu .dep {display:flex;flex-wrap:wrap;margin-top:8rem;}
.con_header .snb_menu .dep li a {font-weight:600;font-size:2.4rem;color:#8c8c8c;margin:0 1.5rem;}
.con_header .snb_menu .dep li:first-child a {margin-left:0;}
.con_header .snb_menu .dep li a.on {color:var(--primary);position:relative;}
.con_header .snb_menu .dep li a.on::before {content:'';display:block;width:1.2rem;height:1.2rem;position:absolute;top:-2rem;left:50%;transform:translateX(-50%);background:url("../../images/fs/layout/VM.svg") no-repeat center;}
.con_body {overflow:hidden;padding-bottom:20rem;}
	@media only screen and (max-width:1199px){
		.con_header {padding:22rem 0 8rem;}
		.con_header .snb_menu .dep li a {font-size:2rem;}
		.con_body {padding-bottom:16rem;}
	}
	@media only screen and (max-width:1023px){
		.con_header {padding:16rem 0 6rem;}
		.con_header .snb_title {font-size:6rem;}
		.con_header .snb_menu .dep {margin-top:6rem;}
		.con_header .snb_menu .dep li a {padding:0 1rem;}
		.con_body {padding-bottom:10rem;}
	}
	@media only screen and (max-width:767px){
		.con_header {padding:14rem 0 5rem;}
		.con_header .snb_title {font-size:5rem;}
		.con_header .snb_menu .dep li a {padding:0 1rem 0 0;}
		.con_header .snb_menu .dep li a.on::before {display:none;}
		.con_body {padding-bottom:8rem;}
	}


/* =========================
   푸터영역
========================= */
#fs_footer {width:100%;padding:16.5rem 10rem 0;background:var(--primary2);}
#fs_footer .flex {justify-content:space-between;}
#fs_footer .flex .foot_logo {filter:brightness(0) saturate(100%) invert(99%) sepia(49%) saturate(0%) hue-rotate(165deg) brightness(111%) contrast(100%);}
#fs_footer .info ul {margin-top:7.5rem;font-size:1.5rem;}
#fs_footer .info ul li {display:flex;align-items:baseline;color:#fff;}
#fs_footer .info ul li+li {margin-top:1rem;}
#fs_footer .info ul li span {width:11rem;color:var(--primary);letter-spacing:0.02em;}
#fs_footer .ft_mn > li+li {margin-left:6rem;}
#fs_footer .ft_mn > li > a {font-size:1.8rem;}
#fs_footer .ft_mn li a {color:#fff;}
#fs_footer .ft_mn li ul li {margin-top:1rem;}
#fs_footer .ft_mn li ul a {opacity:.3;transition:all .3s;}
#fs_footer .ft_mn li ul a:hover {opacity:.6;}
#fs_footer .copy {display:flex;justify-content:space-between;margin-top:9rem;padding-top:4rem;border-top:1px solid rgba(255,255,255,.1);font-size:1.3rem;color:rgba(255,255,255,.3);}
#fs_footer .copy em {color:var(--primary);}
#fs_footer .toTop {display:flex;justify-content:center;align-items:center;width:7rem;height:7rem;color:rgba(255,255,255,.4);text-align:center;background:rgba(255,255,255,.1);transition:all .3s}
#fs_footer .toTop svg {width:3.2rem;height:3.2rem;}
#fs_footer .toTop:hover {color:#fff;background:var(--primary)}
	@media only screen and (max-width:1320px){
		#fs_footer{padding:14.5rem 5rem 0;}
		#fs_footer .ft_mn > li+li {margin-left:5rem;}
	}
	@media only screen and (max-width:1199px){
		#fs_footer{padding:14.5rem 3rem 0;}
		#fs_footer .ft_mn > li+li {margin-left:3rem;}
	}
	@media only screen and (max-width:1023px){
		#fs_footer {padding:11.5rem 2rem 0;}
		#fs_footer .info ul {margin:3rem 0;}
		#fs_footer .copy {margin-top:0;padding-top:3rem;}
		#fs_footer .ft_mn {display:none;}
	}
	@media only screen and (max-width:767px){
		#fs_footer {padding:9.5rem 2rem 0;}
		#fs_footer .info ul li span {flex-shrink:0;}
	}
	@media only screen and (max-width:480px){
		#fs_footer .copy {flex-direction:column;gap:2rem;}
		#fs_footer .toTop {margin-left:auto;width:6rem;height:6rem;}
	}








	@media only screen and (max-width:1199px){

	}
	@media only screen and (max-width:1023px){

	}
	@media only screen and (max-width:767px){

	}