@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	src: url('../css/fonts/Pretendard/Pretendard-Black.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-ExtraBold.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-Bold.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-SemiBold.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-Medium.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-Light.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-ExtraLight.ttf') format('truetype');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: url('../css/fonts/Pretendard/Pretendard-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Lotteria';
    src: url('../css/fonts/ddag.ttf') format('truetype');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: 'YeogiOttaeJalnanGothic';
    src: url('../css/fonts/JalnanGothicTTF.ttf') format('truetype');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-1Thin.ttf') format('truetype');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-2ExtraLight.ttf') format('truetype');
	font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-3Light.ttf') format('truetype');
	font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-4Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-5Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-6SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-7Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-8ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Paperozi';
    src: url('../css/fonts/Paperlogy/Paperlogy-9Black.ttf') format('truetype');
    font-weight: 900;
    font-display: swap;
}

/* --------------------------------------------------------------------------------------------------- font --------------------------------------------------------------------------------------------------- */

* {
    margin:0 auto;
    padding:0;
    list-style:none;
    font-family:"Pretendard";
    color:#333333;
    letter-spacing: -0.025em;
}

a {
    text-decoration:none;
    color:inherit;
}

#wrap {
    width: 100%;
    height: 100%;
}


/* ---------------------------------------- header 시작 ---------------------------------------- */
header {
	width: 100%;
	height: 167px;
	box-shadow: 0px 2px 4px 0px rgba(25, 25, 25, 0.04);
}

#main_logo_box {
	width: 100%;
	height: 114px;
	display: flex;
    align-items: center;
}

.main_logo {
	width: 150px;
	height: 74px;
}

.main_logo a {
	width: 100%;
	height: 100%;
	display: block;
}

nav {
	width: 100%;
	height: 53px;
}

#nav_main_menu {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

#nav_main_menu p {
	font-size: 18px;
	font-weight: 500;
}

.nav_category, .nav_main_menu01, .nav_main_menu02, 
.nav_main_menu03, .nav_main_menu04, .nav_main_menu05 {
	margin: 0;
}

.nav_category > a, .nav_main_menu01 > a, .nav_main_menu02 > a, 
.nav_main_menu03 > a, .nav_main_menu04 > a, .nav_main_menu05 > a {
	display: flex;
    align-items: center;
	padding: 16px 60px;
}

.category_icon {
	position: relative;
  	width: 18px;
  	height: 18px;
}

.category_icon img {
	position: absolute;
	inset: 0;
	display: block;
}

#mobile_nav {
	display: none;
}


/* -------------------- 전체카테고리 동작 -------------------- */
.category_mouse_leave {
	opacity: 1;
	transition: opacity .25s ease;
}

.category_mouse_over {
	opacity: 0;
	transition: opacity .25s ease;
}

.category_text {
	transition: color .25s ease;
}

.nav_category:hover .category_mouse_leave {
  	opacity: 0;
}

.nav_category:hover .category_mouse_over {
  	opacity: 1;
}	

.nav_category:hover .category_text {
  	color: #f79a49;
}

.nav_category p {
	margin: 0;
	margin-left: 4px;
}

.nav_category_menu_box li > a {
	transform: translateX(0);
	transition: color 0.1s ease-out, transform 0.25s cubic-bezier(.215, .61, .355, 1);
}

.nav_category_menu_box li > a:hover {
	color: #F79A49;
	transform: translateX(4px);
}
/* -------------------- 전체카테고리 동작 -------------------- */


.nav_category_box {
	top: 167px;
    position: absolute;
    background-color: #fff;
    width: 100%;
    left: 0;
    padding: 40px 0;
	box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.04);
	z-index: 2;
	display: none;
}

.nav_category_menu_box {
	max-width: 1400px;
	display: flex;
}

.nav_category_box ul {
	width: 200px;
	margin-left: 40px;
}

.nav_category_box ul:nth-child(1) {
	margin-left: 0;
}

.nav_category_box ul li a {
	padding: 6px 0;
	display: block;
}

.nav_category_menu_box ul li:nth-of-type(1) a {
	font-weight: 500;
}

.nav_category_box ul li:nth-of-type(1) {
	margin-bottom: 8px;
}


/* -------------------- 네비 메인 메뉴 동작 -------------------- */
#nav_main_menu > div[class^="nav_main_menu"] > a {
	position: relative;
	display: inline-block;
	padding: 16px 60px;
	color: #333;
	text-decoration: none;
	transition: color .25s ease-out;
}

#nav_main_menu > div[class^="nav_main_menu"] > a p {
	margin: 0;
  	display: inline-block;
  	position: relative;
  	color: #333;
  	transition: color .15s ease-out;
}

#nav_main_menu > div[class^="nav_main_menu"] > a p::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -16px;
	width: 100%;
	height: 2px;
	background: #f79a49;
	transform: translateX(-50%) scaleX(0);
	transform-origin: center;
	transition: transform .25s cubic-bezier(.215,.61,.355,1);
}

#nav_main_menu > div[class^="nav_main_menu"] > a:hover p {
	color: #F79A49;
}

#nav_main_menu > div[class^="nav_main_menu"] > a:hover p::after {
  	transform: translateX(-50%) scaleX(1);
}
/* -------------------- 네비 메인 메뉴 동작 -------------------- */


.nav_sub_menu01, .nav_sub_menu02 {
	top: 167px;
    position: absolute;
    background-color: #fff;
    width: 100%;
    left: 0;
    padding: 40px 0;
	box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.04);
	z-index: 2;
	display: none;
}

.nav_sub_menu01_box, .nav_sub_menu02_box {
	width: 100%;
	display: flex;
	justify-content: center;
}

.nav_sub_menu01_brand, .nav_sub_menu01_bi, .nav_sub_menu01_oem, .nav_sub_menu01_map, 
.nav_sub_menu02_01, .nav_sub_menu02_02, .nav_sub_menu02_03, .nav_sub_menu02_04, .nav_sub_menu02_05 {
	width: 248px;
	height: 200px;
	box-shadow: 0px 1px 4px rgba(25, 25, 25, 0.06);
	border-radius: 20px;
	margin: 0;
	margin-left: 40px;
}

.nav_sub_menu01_brand, .nav_sub_menu02_01 {
	margin-left: 0px;
}

#nav_main_menu .nav_sub_menu01_box p:nth-of-type(1), 
#nav_main_menu .nav_sub_menu02_box p:nth-of-type(1) {
	font-size: 20px;
	font-weight: 500;
}

#nav_main_menu .nav_sub_menu01_box p:nth-of-type(2),
#nav_main_menu .nav_sub_menu02_box p:nth-of-type(2) {
	color: #767676;
	margin-top: 4px;
	font-size: 16px;
}

.sub_menu01_brand_text_box, .sub_menu01_bi_text_box, 
.sub_menu01_oem_text_box, .sub_menu01_map_text_box,
.sub_menu02_01_text_box, .sub_menu02_02_text_box, 
.sub_menu02_03_text_box, .sub_menu02_04_text_box, .sub_menu02_05_text_box {
	margin-left: 24px;
	margin-top: 24px;
}

.sub_menu01_brand_icon_box, .sub_menu01_bi_icon_box, 
.sub_menu01_oem_icon_box, .sub_menu01_map_icon_box,
.sub_menu02_01_icon_box, .sub_menu02_02_icon_box, 
.sub_menu02_03_icon_box, .sub_menu02_04_icon_box, .sub_menu02_05_icon_box {
	width: 100px;
	height: 100px;
	margin-right: 20px;
	margin-top: 14px;
}


/* -------------------- 네비 BRAND 서브메뉴 동작 -------------------- */
.nav_card {
    display: flex;
	flex-direction: column;
	cursor: pointer;
	transition: box-shadow .2s ease, transform .2s ease;
}

.nav_sub_menu01_box > div {
    cursor: pointer;
    border-radius: 18px;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s ease, transform .2s ease;
}

.nav_sub_menu01_box > a p:first-child {
    color: #333;
    transition: color .25s ease;
}

.nav_sub_menu01_box > a:hover p:first-child, 
.nav_sub_menu01_box > a:hover p:last-child {
	color: #f79a49;
}

.nav_sub_menu01_box > a:hover {
    transform: translateY(-2px);
    box-shadow: 0px 1px 10px rgba(25, 25, 25, 12%);
}

.sub_menu01_brand_icon_box, .sub_menu01_bi_icon_box,
.sub_menu01_oem_icon_box, .sub_menu01_map_icon_box {
    position: relative;
}

.sub_menu01_brand_icon_box img, .sub_menu01_bi_icon_box img,
.sub_menu01_oem_icon_box img, .sub_menu01_map_icon_box img {
    display: block;
}

.brand_icon_mouseover, .bi_icon_mouseover,
.oem_icon_mouseover, .map_icon_mouseover {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .25s ease;
}

.brand_icon_mouseleave, .sub_menu01_bi_icon_box img:first-child,
.sub_menu01_oem_icon_box img:first-child, .sub_menu01_map_icon_box img:first-child {
    transition: opacity .25s ease;
}

.nav_sub_menu01_brand:hover .brand_icon_mouseleave {
    opacity: 0;
}

.nav_sub_menu01_brand:hover .brand_icon_mouseover {
    opacity: 1;
}


.nav_sub_menu01_bi:hover .sub_menu01_bi_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu01_bi:hover .bi_icon_mouseover {
    opacity: 1;
}

.nav_sub_menu01_oem:hover .sub_menu01_oem_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu01_oem:hover .oem_icon_mouseover {
    opacity: 1;
}

.nav_sub_menu01_map:hover .sub_menu01_map_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu01_map:hover .map_icon_mouseover {
    opacity: 1;
}
/* -------------------- 네비 BRAND 서브메뉴 동작 -------------------- */


/* -------------------- 네비 제품소개 서브메뉴 동작 -------------------- */
.nav_sub_menu02_box > div {
    cursor: pointer;
    border-radius: 18px;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s ease, transform .2s ease;
}

.nav_sub_menu02_box > a p:first-child {
    color: #333;
    transition: color .25s ease;
}

.nav_sub_menu02_box > a:hover p:first-child, 
.nav_sub_menu02_box > a:hover p:last-child {
	color: #f79a49;
}

.nav_sub_menu02_box > a:hover {
    transform: translateY(-2px);
    box-shadow: 0px 1px 10px rgba(25, 25, 25, 12%);
}

.sub_menu02_01_icon_box, .sub_menu02_02_icon_box,
.sub_menu02_03_icon_box, .sub_menu02_04_icon_box, .sub_menu02_05_icon_box {
    position: relative;
}

.sub_menu02_01_icon_box img, .sub_menu02_02_icon_box img,
.sub_menu02_03_icon_box img, .sub_menu02_04_icon_box img, .sub_menu02_05_icon_box img {
    display: block;
}

.nav_fresh_icon_mouseover, .nav_smoked_icon_mouseover,
.nav_seasoning_icon_mouseover, .nav_process_icon_mouseover, .nav_oem_icon_mouseover {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .25s ease;
}

.nav_fresh_icon_mouseleave, .sub_menu02_02_icon_box img:first-child,
.sub_menu02_03_icon_box img:first-child, .sub_menu02_04_icon_box img:first-child,
.sub_menu02_05_icon_box img:first-child {
    transition: opacity .25s ease;
}

.nav_sub_menu02_01:hover .nav_fresh_icon_mouseleave {
    opacity: 0;
}

.nav_sub_menu02_01:hover .nav_fresh_icon_mouseover {
    opacity: 1;
}

.nav_sub_menu02_02:hover .sub_menu02_02_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu02_02:hover .nav_smoked_icon_mouseover {
    opacity: 1;
}

.nav_sub_menu02_03:hover .sub_menu02_03_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu02_03:hover .nav_seasoning_icon_mouseover {
    opacity: 1;
}

.nav_sub_menu02_04:hover .sub_menu02_04_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu02_04:hover .nav_process_icon_mouseover {
    opacity: 1;
}
.nav_sub_menu02_05:hover .sub_menu02_05_icon_box img:first-child {
    opacity: 0;
}

.nav_sub_menu02_05:hover .nav_oem_icon_mouseover {
    opacity: 1;
}
/* -------------------- 네비 제품소개 서브메뉴 동작 -------------------- */
#bottom_bar {
	display: none;
}

#side_menu {
	display: none;
}
/* ---------------------------------------- header 끝 ---------------------------------------- */


/*---- 공용코드 ----*/
#top_btn {
	background-color: rgba(255, 255, 255, 0.7);
	border: 0;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	box-shadow: 0 0 0 1.5px #eaeaea inset;
	bottom: 5%;
	right: 5%;
	cursor: pointer;
	display: none;
	z-index: 5;
	position: fixed;
	overflow: hidden;
}

#top_btn img {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 17px;
	height: 20px;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.top_btn_mouse_leave {
  	opacity: 1;
  	transition: opacity .25s ease;
}

.top_btn_mouse_over {
  	opacity: 0;
  	transition: opacity .25s ease;
}

#top_btn:hover {
  	background-color: rgba(247, 154, 73, 80%);
  	box-shadow: none;
}

#top_btn:hover .top_btn_mouse_leave {
  	opacity: 0;
}

#top_btn:hover .top_btn_mouse_over {
  	opacity: 1;
}

footer {
	width: 100%;
	height: 271px;
	background-color: #3B3738;
}

#footer_top_viewport {
	max-width: 1400px;
	padding: 20px 0;
}

.footer_top_box {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.footer_logo {
	width: 80px;
	height: 40px;
	margin: 0;
}

.mall_link {
	display: flex;
	gap: 16px;
	margin: 0;
}

.naver_link, .insta_link, .kakao_link {
	width: 40px;
	height: 40px;
	border: 1px solid #aeaeae;
	border-radius: 100%;
	box-sizing: border-box;
	margin: 0;
}

.mall_link a {
	display: block;
	width: 100%;
	height: 100%;
}

.mall_link img {
	display: block;
	width: 100%;
	height: 100%;
}

#footer_bottom {
	width: 100%;
	border-top: 1px solid #aeaeae;
	padding-bottom: 60px;
}

.footer_bottom_viewport {
	max-width: 1400px;
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
}

.footer_bottom_left_box {
	margin: 0;
}

.footer_bottom_left_box p {
	color: #f3f3f3;
	margin: 0;
}

.footer_line {
	width: 1px;
	height: 13px;
	background-color: #f3f3f3;
	margin: 0;
}

.footer_bottom_left_text01 {
	display: flex;
	align-items: center;
	gap: 20px;
}

.footer_bottom_left_text01 p:nth-of-type(3) {
	font-weight: 600;
}

.footer_bottom_left_text02 {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.footer_bottom_left_text02 p {
	font-size: 14px;
}

.footer_bottom_left_text02 > .left_text:nth-of-type(1) p:nth-of-type(3) {
	box-shadow: 0 -1px 0 0 #f3f3f3 inset;
}

.footer_bottom_left_text02 .footer_line {
	width: 1px;
	height: 11px;
}

.left_text {
	display: flex;
	align-items: center;
	margin: 0;
	gap: 20px;
}

.footer_bottom_right_box {
	display: flex;
	gap: 60px;
	margin: 0;
}

.footer_bottom_right_box p {
	color: #f3f3f3;
}

.footer_center_box, .footer_number_box {
	display: flex;
	flex-direction: column;
}

.footer_center_box p:nth-of-type(1), .footer_number_box p:nth-of-type(1) {
	margin-left: 0;
}

.footer_center_box p:nth-of-type(2), .footer_number_box p:nth-of-type(2) {
	font-weight: 600;
	font-size: 24px;
	margin-top: 10px;
	margin-left: 0;
}

.footer_center_box p:nth-of-type(3), .footer_number_box p:nth-of-type(3) {
	font-size: 13px;
	margin-top: 16px;
	margin-left: 0;
}

.footer_center_box p:nth-of-type(4) {
	font-size: 13px;
	margin-top: 4px;
	margin-left: 0;
}

#mobile_footer {
	display: none;
}
/*---- 공용코드 ----*/


/* -------------------------------- 모바일 -------------------------------- */
@media (max-width: 480px){
/*------------ 공용코드 ------------*/
	#wrap {
		overflow: hidden;
	}

	header {
		height: auto;
		box-shadow: none;
		position: relative;
        z-index: 2;
		box-shadow: 0px 1px 4px rgba(25, 25, 25, 8%);
	}

	#main_logo_box {
		display: none;
	}

	nav {
		display: none;
	}

	#mobile_nav {
		width: calc(100% - 40px);
		display: flex;
		align-items: center;
		padding: 20px 0;
	}

	.mobile_nav_left_box {
		display: flex;
		align-items: center;
		gap: 8px;
		margin: 0;
	}

	.mobile_nav_back_box {
		width: 24px;
		height: 24px;
		border: none;
		box-sizing: border-box;
		background-color: rgba(0, 0, 0, 0);
		display: flex;
		align-items: center;
        justify-content: center;
		cursor: pointer;
	}

	.mobile_back_btn {
		width: 8px;
		height: 8px;
		border-top: 1px solid #333;
		border-right: 1px solid #333;
		transform: rotate(-135deg);
		margin-left: 11px;
	}

	.mobile_nav_home_box {
		width: 24px;
		height: 24px;
	}

	.mobile_nav_home_box a {
		display: block;
		width: 100%;
		height: 100%;
	}

	#mobile_nav > p {
		font-size: 20px;
		font-weight: 700;
	}

	.mobile_nav_logo_box {
		width: 49px;
		height: 24px;
		margin: 0;
		margin-left: 7px;
	}

	.mobile_nav_logo_box a {
		display: block;
		width: 100%;
		height: 100%;
	}

	body.no-scroll {
		overflow: hidden;
		height: 100%;
	}

	#bottom_bar {
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		width: 100%;
		bottom: 0;
		background-color: #fff;
		box-shadow: 0px -2px 6px rgba(0, 0, 0, 6%);
		display: flex;
		z-index: 1000;
	}

	#bottom_bar_category_box, #bottom_bar_home_box, #bottom_bar_top_box {
		width: calc(100%/3);
	}

	.bottom_bar_category_icon_box, .bottom_bar_home_icon_box, .bottom_bar_top_icon_box {
		width: 25px;
		height: 25px;
		position: relative;
	}

	.bottom_bar_category_icon_mouseover,
	.bottom_bar_top_mouseover, .bottom_bar_home_mouseover {
		position: absolute;
		inset: 0;
		opacity: 0;
		transition: opacity .2s;
	}

	#bottom_bar_category_box.active .bottom_bar_category_icon {
		opacity: 0;
	}
	#bottom_bar_category_box.active .bottom_bar_category_icon_mouseover {
		opacity: 1;
	}

	#bottom_bar_top_box.active .bottom_bar_top_icon {
		opacity: 0;
	}
	
	#bottom_bar_top_box.active .bottom_bar_top_mouseover {
		opacity: 1;
	}

	#bottom_bar a {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
		padding: 15px 0;
	}

	#bottom_bar p {
		font-size: 11px;
		margin-top: 2px;
	}

	#bottom_bar_home_box p {
		color: #333;
	}

	#bottom_bar_category_box p,
	#bottom_bar_top_box p {
		color: #333;
		transition: color .2s;
	}
	
	#bottom_bar_category_box.active p,
	#bottom_bar_top_box.active p {
		color: #F79A49;
	}

	#side_menu {
		display: block;
		width: 100%;
		height: 100%;
		position: fixed;
		z-index: 999;
		inset: 0;
		margin-top: 100vh;
	}

	#side_menu_box {
		width: 100%;
		height: 100vh;
		padding-bottom: 32px;
		background-color: #fff;
		position: absolute;
		top: 0;
		right: 0;
		overflow-y: auto;
  		-webkit-overflow-scrolling: touch;
		padding-bottom: 102px;
		box-sizing: border-box;
	}

	.side_menu_close_box {
		width: 100%;
		padding: 20px 0;
		display: flex;
		justify-content: flex-end;
	}

	.side_menu_close_btn {
		width: 28px;
		height: 28px;
		margin: 0;
		margin-right: 20px;
		border: none;
		background: transparent;
		cursor: pointer;
		position: relative;
	}

	.side_menu_close_btn::before,
	.side_menu_close_btn::after {
		content: "";
		position: absolute;
		left: 50%;
		top: 50%;
		width: 23px;
		height: 2px;
		background-color: #333;
		transform-origin: center;
	}

	.side_menu_close_btn::before {
		transform: translate(-50%, -50%) rotate(45deg);
	}

	.side_menu_close_btn::after {
		transform: translate(-50%, -50%) rotate(-45deg);
	}

	.side_menu_text_box {
		width: calc(100% - 40px);
		display: flex;
		flex-direction: column;
		gap: 32px;
	}

	.side_main_menu01, .side_main_menu02, .side_main_menu03, 
	.side_main_menu04, .side_main_menu05, .side_main_menu06, 
	.side_main_menu07, .side_main_menu08, .side_main_menu09 {
		display: flex;
		align-items: flex-start;
		margin: 0;
	}

	.side_main_menu01 > p, .side_main_menu02 > p, .side_main_menu03 > p, 
	.side_main_menu04 > p, .side_main_menu05 > p, .side_main_menu06 > p, 
	.side_main_menu07 > p, .side_main_menu08 > p, .side_main_menu09 > p {
		width: 65px;
		margin-right: 12px;
		font-weight: 500;
		flex: 0 0 65px;
		white-space: nowrap;
	}

	.side_main_menu04 .side_sub_menu02, .side_main_menu08 .side_sub_menu, .side_main_menu09 .side_sub_menu {
		opacity: 0;
	}

	.disabled-link {
		pointer-events: none;
	}

	.side_menu_text_box a {
		display: block;
		padding: 12px 0;
	}

	.side_menu_text_box p {
		margin: 0;
		font-size: 14px;
		line-height: 20px;
	}

	.side_line {
		width: 1px;
		background-color: #dbdbdb;
		margin: 0 12px 0 0;
		align-self: stretch;
		flex: 0 0 1px; 
	}

	.side_sub_menu {
		flex: 1 1 auto;
		min-width: 0;
		display: flex;
		flex-direction: column;
		margin: 0;
	}

	.side_sub_menu p {
		color: #666;
	}

	.side_sub_menu01, .side_sub_menu02, .side_sub_menu03, .side_sub_menu04, 
	.side_sub_menu05, .side_sub_menu06, .side_sub_menu07 {
		display: flex;
		width: 100%;
		gap: 20px;
	}

	.side_sub_menu01 p, .side_sub_menu02 p, .side_sub_menu03 p, .side_sub_menu04 p, 
	.side_sub_menu05 p, .side_sub_menu06 p, .side_sub_menu07 p {
		width: calc(100%/2);
	}

	footer {
		display: none;
	}

	#mobile_footer {
		display: block;
		width: 100%;
		background-color: #3B3738;
		padding-bottom: 72px;
		box-sizing: border-box;
	}

	#footer_top_box {
		width: calc(100% - 40px);
		padding: 16px 0;
	}

	.footer_top_text {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.footer_top_text p {
		font-size: 15px;
		color: #f3f3f3;
		margin: 0;
	}

	.footer_top_text p:nth-of-type(3) {
		font-weight: 500;
	}

	#footer_link_box {
		width: calc(100% - 40px);
		padding-top: 12px;
		padding-bottom: 20px;
	}

	.footer_link {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	#footer_text_box {
		width: calc(100% - 40px);
		display: flex;
        flex-direction: column;
		gap: 12px;
	}

	#footer_text_box .footer_line {
		height: 11px;
	}

	.footer_text01, .footer_text02 {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	#footer_text_box p {
		font-size: 13px;
		color: #f3f3f3;
		margin: 0;
	}

	.footer_text02 > p:nth-of-type(1) {
		box-shadow: 0 -1px 0 0 #f3f3f3 inset;
	}

	#footer_line {
		width: calc(100% - 40px);
		height: 1px;
		background-color: #aeaeae;
		margin: 20px auto;
	}

	#footer_center_number_box {
		width: calc(100% - 40px);
		display: flex;
		justify-content: space-between;
	}

	.footer_center_box, .footer_number_box {
		width: calc(100%/2);
		margin: 0;
	}

	.footer_center_box p, .footer_number_box p {
		color: #f3f3f3;
	}

	.footer_center_box p:nth-of-type(2), .footer_number_box p:nth-of-type(2) {
		font-size: 18px;
	}

	.footer_center_box p:nth-of-type(3), .footer_number_box p:nth-of-type(3) {
		margin-top: 12px;
	}

	.footer_center_box p:nth-of-type(4) {
		margin: 0;
	}

	.footer_center_box p:nth-of-type(5) {
		font-size: 13px;
		margin: 0;
		margin-top: 6px;
	}

	#mobile_footer > p {
		width: calc(100% - 40px);
		color: #f3f3f3;
		font-size: 14px;
		padding: 20px 0;
	}
/*------------ 공용코드 ------------*/
}