*{box-sizing: border-box;}
html {font-size: 62.5%;box-sizing: border-box; scroll-behavior: smooth;}

html {font-size: 62.5%; font-family: Pretendard; color:#222;}
body{background:#fff;}
div {box-sizing:border-box; transition:all 0.3s ease-in-out;}
.mo_only, .mo_br {display:none!important;}

@media (max-width:1400px) and (min-width:1301px) {
	html {font-size:53%;}
}

@media (max-width:1300px) and (min-width:992px) {html {font-size:51%;}}
@media (max-width:991px) {
	.pc_only, .pc_br {display:none!important;}
	.mo_only, .mo_br {display:block!important;}
}

@font-face {
	font-family: 'Pretendard-ExtraLight';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
@font-face {
	font-family: 'Pretendard-Light';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
	font-family: Pretendard;
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard-Medium';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
	}
@font-face {
    font-family: 'Pretendard-SemiBold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard-Bold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard-ExtraBold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard-Black';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap');

/* :::::::::::: ====== header START ~ ====== ::::::::::::*/

#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #F5F1E8;
    z-index: 100;
	Wtransition: all 0.8s;
}
.headerTop {width:100%; height:auto; background: linear-gradient(90deg, #0481D8 0%, #21B14F 100%);} 
.headerInner {width:100%; max-width:136rem; margin:0 auto; padding:1.4rem 2rem;}



/*header*/
.header_inner {width:100%; max-width:164rem; margin:0 auto; padding:10rem 2rem 10rem; display: flex; justify-content: space-between; align-items: center;}
.logo {width:100%; max-width:19.2rem;}
.s_logoImg {display:none;}


.gnb {display: flex; align-items: center;}
.hMenu {display:flex;}
.hMenu_list {padding: 0rem 2.5rem; position:relative;}


.hMenu_list a {
	color: #221E1F;
	text-align: center;
	font-family: FreightTextProMedium-Regular;
	font-family: 'Palatino Linotype','serif';
	
	font-size: 2.3rem;
	line-height: 4rem;
	letter-spacing: 1.38px;
	position:relative;
	display: inline-block;
}

.hMenu_list a::before {
	content:'';
	width:0%;
	height:1px;
	position:absolute;
	left:0;
	bottom:0;
	background: linear-gradient(90deg, #A76841 0%, #E3C39D 100%);
	transition:all 0.3s;
}
.hMenu_list:hover a::before {width:100%;}

nav:hover .sub-wrap {background:#FFF; display:block; z-index:10; border-top: 1px solid #EEE;}


#main-header .sub-wrap.on {height: 250px; opacity: 1}

ul.sns {padding-left: 2.5rem;}
.sns_list {padding:1rem; width:4rem; height:4rem;}
.sns_list img {width:100%; height:auto;}

.logo {width:19rem; height:auto;}
.logo img {width:100%; height:auto;}


.headDim {
	background: rgba(0, 0, 0, 0.40);
	position:fixed;
	width:100%;
	height:100%;
	left:0;
	top:0;
	opacity:0;
	z-index:-1;
}

.hamBtn {
    width: 2rem;
    height: auto;
}

.hamBtn img {
    width: 100%;
    height: auto;
}
.hamBtn, .hamBtnClose {display:none;}
#header.down_header {background: rgba(245, 241, 232, 0.75); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px)}

header.down_header .header_inner {padding:5rem 2rem;}
header.down_header .logo {width:9.6rem;}
header.down_header .s_logoImg {display:block;}
header.down_header .logoImg {display:none;}
#header.down_header .header_inner {padding: 2.4rem 2rem;  transition: all 0.8s;}

@media (max-width:991px) {
	.header_inner {padding: 1.6rem 2rem;}
	#header.down_header .header_inner {padding: 1.6rem 2rem;}
	
	.logo {width: 7.8rem; height: auto;}
	header.down_header .logo {width: 6.3rem;}
	
	nav {
		display: none;
		position: absolute;
		width: 100%;
		height: 100vh;
		top: 0;
		left: 0;
		background: #F9F5EC;
		padding: 2rem;
	}
	
	nav.active {display: block; padding:1.6rem 2rem;}
	
	.gnb {
		display: flex;
		padding-top:4rem;
		align-items: flex-start;
		flex-direction: column;
	}
	ul.sns {padding-left: 0rem;}
	.sns_list {
		padding: 0;
		width: 2rem;
		height: 2rem;
		margin-top: 1.5rem;
	}
	.hMenu {display: flex; flex-direction: column; } 
	
	.hamBtn, .hamBtnClose {display:block;}
	.hamBtn {width: 2rem; height: auto;}
	.hamBtnClose {width: 2rem; height: auto; margin: 0 0 0 auto; padding-top: 0.3rem;}
	.hamBtnClose img {width:100%; height:auto;}
	.hMenu_list {
		padding: 1.3rem 0rem;
		position: relative;
	}
	.hMenu_list a {
		font-size: 2.3rem;
		line-height: 3rem;
		letter-spacing: 1.38px;
	}
}
/* :::::::::::: ====== // ~ header END ====== ::::::::::::*/




/* :::::::::::: ====== Footer START ~ ====== ::::::::::::*/
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@600;700&display=swap');

footer {background: #221E1F;}
.f_inner {width: 100%; max-width: 164rem; margin: 0 auto; padding: 0 2rem;}
.footerBox{width:100%;position:relative;padding:4rem 2rem 4rem 2rem;}
.f_infobox {display: flex; align-items: center; justify-content: space-between;}
.f_logobox {width:17.2rem; height:auto;}
.f_logobox img {width:100%; height:auto;}

.f_infolist {
    width: 70%;
    display: flex;
    justify-content: space-between;
}
.f_infolistBox {overflow: hidden;}
.f_infoliTitle {
	color: #FFF;
	font-family: "Pretendard-Semibold";
	font-size: 1.6rem;
	line-height: 2rem;
	letter-spacing: 0.32px;
	padding-bottom:0.9rem;
}
.sitemapList {
	padding:0.9rem 0;
	color: #FFF;
	font-family: "Pretendard-Light";
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: 0.3px;
}
.sitemapList:last-child {padding-bottom:0;}

.snslist {display: flex; align-items: center;}
.f_snsicon {width:2rem; height:2rem; margin-right:0.6rem;}
.f_snsicon img {width:100%; height:auto;}

.f_botm {margin-top: 6.9rem; display: flex; justify-content: space-between; align-items: center;}
.copy {color: #FFF; font-family: Pretendard; font-size: 1.4rem; line-height: 3.4rem; opacity:0.5;}
.top {color: #FFF; font-family: "Pretendard-SemiBold"; font-size: 1.6rem; line-height: 2rem; letter-spacing: 0.32px; cursor: pointer;}


.fGroup {
    display: flex;
    position: relative;
    background: #F5F1E8;
}

.s_top_menu_txt {
    height: auto;
    display: flex;
    width: 21.3rem;
    position: relative;
    align-items: center;
    padding: 1.6rem 2.4rem;
    justify-content: space-between;
}

.fsite {
	color: #FFF;
	font-family: Pretendard;
	font-size: 1.6rem;
	line-height: 2.2rem;
}

.fsiteIcon {width:2rem; height:auto;}
.fsiteIcon img {width:100%; height:auto;}

.depth_sub.depth01 ul {
    top: 100%;
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    justify-content: center;
    border: 1px solid #f6f6f6;
}
.fintext ul {
    display: flex;
    padding: 0;
    margin: 0;
    width: 80%;
    position: relative;
    flex-wrap: wrap;
}
.sub_top_menu.depth01 a {width: 100%; text-align: center;}
.depth_sub {
    position: absolute;
    width: 100%;
    z-index: 0;
    left: 0;
    top: 0;
    -webkit-transform-origin-y: top;
    transform: translateY(-100%);
}
.depth_sub.down {
    transform: translateY(0);
    top: 100%;
}
.depth_sub ul li {
    width: 100%;
    padding: 1.4rem 1rem;
    border-top: none;
    background: #fff;
    position: relative;
    box-sizing: border-box;
    color: #221E1F;
    font-family: Pretendard;
    font-size: 1.5rem;
    line-height: 2rem;
    justify-content: center;
    text-align: left;
}
.fintext ul li:last-child {margin-right: 0rem;}
.sub_top_menu.depth01 {z-index: 10; background: #221E1F; border: 1px solid #FFF;}

.frbcopy {
    display: block;
    color: #888;
    font-size: 1.5rem;
    font-family: 'Pretendard-Light';
    line-height: 3.4rem;
}

@media (max-width:1200px) {
	.f_inner {padding:0;}
	.footerBox {padding: 5rem 2rem 3rem 2rem;}
	.f_infobox {align-items: flex-start; flex-direction: column;}
	.f_logobox {width: 12.2rem;}
	
	.f_infolistBox {padding: 0 0 2rem 0;}
	
	.sitemapList {font-size: 1.4rem; padding: 0 0 1rem 0; line-height: 1.8rem;}
	.f_infolist {width: 100%; flex-direction: column; padding-top: 3rem;}
	.f_infoliTitle {padding-bottom: 0.5rem; font-size: 1.5rem; line-height: 1.8rem;}
	.f_sitemapFlex {display:flex;}
	.f_sitemapFlex .sitemapList {padding: 0 1.5rem 0 0;}
	
	.f_botm {margin-top:1rem;}
	.copy {font-size: 1.2rem; line-height: 2.5rem;}
	
	.fGroup {display: flex; position: relative; background: #221E1F; display: inline-flex;}
	.fGroup.show {overflow: unset;}
	
	.depth_sub {
		position: absolute;
		width: 100%;
		z-index: 0;
		left: 0;
		top: -290%;
		-webkit-transform-origin-y: top;
		transform: unset;
		height: 0px;
		overflow: hidden;
	}
	.f_infolistBox {overflow: unset;}
	.depth_sub.down {
		position: absolute;
		width: 100%;
		z-index: 0;
		left: 0;
		top: -300%!important;
		transform: unset;
		height: auto;
		overflow: hidden;
	}
	
	.f_snsicon {
		width: 1.6rem;
		height: 1.6rem;
		margin-right: 0.6rem;
	}
}

@media (max-width:767px) {
	.footerBox {padding: 3rem 2rem 10rem 2rem;}
	.f_logobox {width: 10.2rem;}
	.f_botm {
		margin-top: 0;
		position: absolute;
		right: 2rem;
		bottom: 2.5rem;
	}
	.s_top_menu_txt {padding:1.2rem 2rem;}
	.fsite {font-size:1.4rem;}
	
	.frbcopy {
		font-size: 1.3rem;
		line-height: 2rem;
	}
}
@media (max-width:600px) {
	.f_sitemapFlex {
		display: block;
	}
	.f_sitemapFlex .sitemapList {
		padding: 0 0rem 0.8rem 0;
	}
	.f_sitemap li:last-child{
		padding: 0 0rem 0rem 0;
	}
}


/* :::::::::::: ====== // ~ Footer END ====== ::::::::::::*/