@charset "utf-8";

/* 프로그램리스트 모바일 버전 */
.all_m_btn {padding:10px; background:#323337;}
.all_m_btn img {position:absolute; top:28%; left:15px; width:10%; max-width:40px; cursor:pointer;}
.all_m_btn .mutit {text-align:center; font-weight:900; font-size:26px; color:#fff;}
.pro_m_wrap {display:none; font-family:'Nanum Gothic', sans-serif; transition:all 0.3s linear;}

.pro_m_wrap .m_menu {width:200px;}
.pro_m_wrap .bg_black {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:-1;}



.pro_m_wrap .subleftmenu {
	list-style:none;
	margin:0;
	padding:0;
}
.pro_m_wrap .subleftmenu li {
	border-bottom:1px solid #515155;
	background:#323337;
}
.pro_m_wrap .subleftmenu a {
	display:block;
	color:#b5b2b2;
	font-size:14px;
	padding:11px 5px 11px 15px;
	font-family:'Noto Sans KR';
}
.sub_title_m{
	font-size:28px !important;
	font-weight:bold;
	color:#fff !important;
	padding:12px 5px 12px 15px !important;
}
.pro_m_wrap .subleftmenu a:hover {
	background:#307dd4;
	color:#fff;
}
.sub_title_m:hover {
	background:#323337 !important;
	cursor:default;
}

@media all and (max-width:999px){
	.pro_m_wrap {display:block; position:absolute; left:-100%; top:0; z-index:999;}
	.pro_m_wrap.view {left:0;}
}


/* basic */
.main .inner {
	max-width: unset;
}
.main .inner.pd60 {
	padding: 0 60px;
}
.inner {
	width: 100%;
	max-width: 1800px;
	margin: 0 auto;
	position: relative;
}
.inner.w1850{max-width: 1850px;}
.inner.w1400{max-width: 1400px;}

@media all and (max-width:1850px){
	.inner.w1850{width:93.75%}
}

@media all and (max-width:1800px){
	.inner{width:93.75%}
	.main .inner,
	.main .inner.pd60 {
		width:93.75%;
		padding: unset;
	}
}

@media all and (max-width:1400px){
	.inner.w1400{width:93.75%}
}

/* 최근본 상품 퀵메뉴 */
.quick {overflow:hidden; z-index:110; position:fixed; right:20px; top:50%; width:113px;  -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%) ;}
.quick > ul {margin-bottom:0; border:1px solid #d9d9d9; box-sizing:border-box; background-color:#fff; border-radius:10px;  overflow:hidden;}
.quick ul li.recent_prod {}
.quick ul li.recent_prod p {height:30px; font-size:16px; color:#656565; letter-spacing:-0.025em; line-height:30px; background-color:#d9d9d9; text-align:center; }
.quick ul li.recent_prod ul {padding:14px; box-sizing:border-box; }
.quick ul li.recent_prod ul li {border:1px solid #d9d9d9; margin-bottom:12px; box-sizing:border-box; }
.quick ul li.recent_prod ul li:last-of-type {margin-bottom:0; }
.quick ul li.recent_prod ul li img {width:100%; height:auto; }
.quick ul li.recent_prod .quick_pager {margin-top:0; margin-bottom:30px; }
.quick ul li.recent_prod .quick_pager a {display:inline-block; vertical-align:middle; width:auto; height:auto; border:0 none; margin:0 3px; line-height:14px; font-size:14px; color:#b6b6b6; }
.quick ul li.recent_prod .quick_pager a.active {color:#666666; }
.quick ul li.recent_prod .quick_pager .page_prev,
.quick ul li.recent_prod .quick_pager .page_next {display:inline-block; vertical-align:middle; width:9px; height:11px; border:0 none; text-indent:-9999px; }
.quick ul li.recent_prod .quick_pager .page_prev {background:url('/img/theme/quick_prev_btn.png') no-repeat center center; }
.quick ul li.recent_prod .quick_pager .page_next {background:url('/img/theme/quick_next_btn.png') no-repeat center center; }
.quick ul.zzim{margin-top:30px;}

.quick ul li.top_btn {width:100%; height:48px; background-color:#666666; box-sizing:border-box; line-height:48px; text-align:center;}
.quick ul li.top_btn a {display:block; color:#fff; line-height:48px; font-size:16px; letter-spacing:-0.025em; }

.quick_top_btn {display:none; z-index:999; position:fixed; right:20px; bottom:-60px; width:57px; height:57px; background-color:#798ebb; border-radius:50%; text-align:center; cursor:pointer; transition:all 0.5s; }
.quick_top_btn.on {bottom:60px; }
.quick_top_btn img {padding-top:12px; }
.quick_top_btn p {font-size:16px; color:#ffffff; letter-spacing:-0.025em; }

@media all and (max-width:1000px){
	.quick {display:none; }
	.quick_top_btn {display:block; }
}
/* css 이 아래부터 가져가세요 */
#header .m_btn {display:none; width:24px; margin:0 auto; text-align:right; cursor:pointer; }
#header .m_btn i{display:inline-block; width:100%; height:2px; margin:3px 0; background:#000; transition:all 0.5s;}
#header .m_btn i:nth-of-type(2){width:100%;}
#header .m_btn.on i:nth-of-type(1){margin:11px 0 -2px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);}
#header .m_btn.on i:nth-of-type(2){width:0; margin:0;}
#header .m_btn.on i:nth-of-type(3){margin:0 0 11px; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg);}


@media all and (max-width:1200px){
	#header .gnb{display: none;}
	#header .m_btn{display: inline-block;}
}

.m_menu_bg {z-index:101; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.7); cursor:pointer; }
#m_menu {z-index:102; position:fixed; right:-100%; top:0; width:500px; max-width:80%; height:100%; background-color:#fff; box-sizing:Border-box; transition:all 0.5s; overfloW-y:auto;}
#m_menu.on {right:0; }
#m_menu .top_box {position:relative; padding:10px; box-sizing:border-box; }
#m_menu .top_box .close_btn {position:absolute; right:20px; top:calc(50% - 15px); width:30px; height:30px; }
#m_menu .top_box .close_btn i {display:block; width:100%; height:2px; background-color:#333; }
#m_menu .top_box .close_btn i:first-of-type {-webkit-transform:rotate(45deg) translate(9px,9px); -moz-transform:rotate(45deg) translate(9px,9px); -ms-transform:rotate(45deg) translate(9px,9px); -o-transform:rotate(45deg) translate(9px,9px); transform:rotate(45deg) translate(9px,9px); }
#m_menu .top_box .close_btn i:last-of-type {-webkit-transform:rotate(-45deg) translate(-7px,8px); -moz-transform:rotate(-45deg) translate(-7px,8px); -ms-transform:rotate(-45deg) translate(-7px,8px); -o-transform:rotate(-45deg) translate(-7px,8px); transform:rotate(-45deg) translate(-7px,8px); }
#m_menu .login_box {padding:20px 0; background-color:#292929; text-align:center; }
#m_menu .login_box a {position:relative; padding:0 30px; font-size:20px; color:#fff; letter-spacing:-0.04em; }
#m_menu .login_box a:first-of-type:before {content:''; position:absolute; right:-1px; top:calc(50% - 7px); width:2px; height:15px; background-color:#fff; }
#m_menu .gnb_box {border-top:1px solid #ddd; }
#m_menu .gnb_box > ul > li {border-bottom:1px solid #dddddd; }
#m_menu .gnb_box > ul > li > a {position:relative; display:block; padding:20px 20px; font-size:20px; font-weight:bold; color:#222222; letter-spacing:-0.04em; box-sizing:border-box; }
#m_menu .gnb_box .depth02 {display:none; padding:10px 0; background-color:#000; }
#m_menu .gnb_box .depth02 li a {position:relative; display:block; padding:7px 20px; font-size:16px; color:#fff; letter-spacing:-0.04em; box-sizing:border-box; }
#m_menu .gnb_box .left_box > div > a {
	position:relative;
	display:block;
	padding:7px 20px;
	font-size:22px;
	font-weight: 700;
	color:#fff;
	letter-spacing:-0.04em;
	box-sizing:border-box;
}
#m_menu .gnb_box .left_box > div + div {
	margin-top: 30px;
}

#m_menu .gnb_box .depth02_sub_box .img_box {
	margin-top: 20px;
}

/* header */
#header {
	background-color: #fff;
	z-index: 99;
	position: relative;
	border-bottom: 2px solid #e1e1e1;
}
#header .h_inner {
	display: flex;		
	justify-content: space-between;
	height: 80px;
	padding: 0 37px;
	border-bottom: 1px solid #777;
}
#header .h_inner > div {
	height: 100%;
}
#header .h_inner .h_left_box {
	display: flex;
	gap: 200px;
}
#header .h_inner .h_logo {
	display: flex;
	align-items: center;
	min-width: 0px;
	max-width: 150px;
}
#header .h_inner .gnb > ul {
	display: flex;
	height: 100%;	
}
#header .h_inner .gnb > ul > li > a {
	font-size: 27px;
	font-weight: 600;
	letter-spacing: -0.045em;
	color: #222222;	
	height: 100%;
	display: flex;
	align-items: center;
	position: relative;
	padding: 0 50px;
}
#header .h_inner .gnb > ul > li:first-child > a {
	padding-left: unset;
}

#header .h_inner .gnb > ul > li:last-child > a {
	padding-right: unset;
}

#header .depth02 {
	position: absolute;
	width: 100%;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	display: none;
	z-index: 99;
	max-width: 1920px;
}
#header .h_inner .gnb > ul > li:hover .depth02 {
	display: block;
}
body {
	overflow-x: hidden;
}
#header .h_inner .gnb > ul > li:hover .depth02::after {
	content: '';
	position: absolute;
	top: 0;
	left: -50vw;
	width: 150vw;
	height: 100%;
	background-color: #000000;
	z-index: -1;
}
#header .depth02_sub_box {
	display: flex;
}
#header .depth02_sub_box .left_box {
	width: 100%;
	padding: 60px 0;
	padding-left: calc((100% - 1800px) / 2);
	background-color: #000000;
	display: flex;
	gap: 10px;
}
#header .depth02_sub_box .img_box {
	width: 30%;
}
#header .depth02_sub_box .img_box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#header .depth02_sub_box .left_box .ri_an_yo {
	flex: 1;
}
#header .depth02_sub_box .left_box .depth03_bu_mo {
	font-size: 20px;
	letter-spacing: -0.045em;
	color: #fff;
	margin-bottom: 15px;
	display: block;
}
#header .depth02_sub_box .left_box .depth03_bu_mo:hover{
	text-decoration: underline;
	text-underline-offset: 5px;
	text-decoration-thickness: 1px; 
}
#header .depth02_sub_box .depth03 a {
	display: block;
	padding: 10px 0;
	font-size: 25px;
	letter-spacing: -0.045em;
	color: #999;
}
#header .depth02_sub_box .depth03 a:hover {
	color: #fff;
}
#header .h_right_box {
	display: flex;
	align-items: center;
	gap: 37px;
}
.com_search_box01 {
	min-width: 265px;
	max-width: 265px;
	width: 100%;
	height: 50px;
	position: relative;
	border-bottom: 2px solid #000;
	display: flex;
	padding-right: 45px;
}
.com_search_box01 .com_search_btn {
	position: absolute;
	right: 0px;
	top: 50%;
	transform: translateY(-50%);
}
.com_search_box01 input {
	outline: unset;
	border: unset;
	width: 100%;
	height: 100%;
	font-size: 24px;
	font-weight: 300;
	color: #4b4b4b;
}
.com_search_box01 input::placeholder{color: #4b4b4b;}
.h_cart_btn {
	min-width: 24px;
}

@media all and (max-width:1800px) {
	#header .depth02_sub_box .left_box {
		padding-left: 3.125%;
	}
	#header .h_inner .gnb > ul > li > a {
		padding: 0 25px;
	}
	#header .h_inner .gnb > ul > li:first-child > a {
		padding-left: unset;
	}
	
	#header .h_inner .gnb > ul > li:last-child > a {
		padding-right: unset;
	}
}

@media all and (max-width:1600px) {
	#header .h_inner{padding: 0; width: 93.75%; margin: 0 auto;}
	#header .h_inner .h_left_box {
		gap: 40px;
	}
	#header .h_inner .gnb > ul > li > a {
		font-size: 18px;
	}
	.com_search_box01 {
		min-width: 300px;
	}
	#header .depth02_sub_box .left_box > div > a {
		font-size: 18px;
	}
	#header .depth02_sub_box .depth03 a {
		font-size: 16px;
	}
}

@media all and (max-width:1400px) {
	#header .h_inner .gnb > ul > li > a {
		padding: 0 15px;
	}
	#header .h_inner .gnb > ul > li:first-child > a {
		padding-left: unset;
	}
	
	#header .h_inner .gnb > ul > li:last-child > a {
		padding-right: unset;
	}
	#header .h_inner .h_logo {		
		min-width: unset;
	}
	#header .h_inner .h_logo img {
		height: 40px;
	}
}

@media all and (max-width:1024px) {
	.com_search_box01 {
		min-width: 200px;
	}
	#header .m_btn {
		min-width: 24px;
	}

	#header .h_right_box{gap: 10px;}
	/* #header .h_cart_btn{display: none;} */
	#header .h_inner .h_logo img {
		height: 26px;
	}
	.com_search_box01 {
		height: 30px;		
	}
	.com_search_box01 input {
		font-size: 15px;
	}
}

/* END header */

/* footer */
#footer {
	padding: 100px 0;
	background-color: #000000;
}
#footer .f_inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 40px;
	padding: 0 60px;
}
#footer .f_logo {
	margin-bottom: 90px;
}
#footer .f_inner .f_alt {
	font-size: 16px;
	letter-spacing: 0;
	font-weight: 300;
	line-height: 1.7em;
	color: #fff;
	margin-bottom: 20px;
}
#footer .f_inner .f_copy {
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 0;
	color: #c5c5c5;
}
#footer .f_right_box a {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0;
	color: #fff;
	display: block;
	padding: 5px 0;
}
#footer .f_right_box .f_link_box01 a:hover {
	text-decoration: underline;
}

@media all and (max-width:1024px) {
	#footer {
		padding: 60px 0;
	}
	#footer .f_logo {
		margin-bottom: 40px;
	}
	#footer .f_inner .f_alt {
		font-size: 14px;
	}
	#footer .f_inner .f_copy {
		font-size: 12px;
	}
}
/* END footer */

#header .header_tb{font-size: 20px; color: #fff; background-color: #000; text-align: center; height: 60px; display: flex; align-items: center; justify-content: center;}
#header .header_tb:hover{background-color: #999;}
#header .h_inner .gnb > ul > li:hover > a{text-underline-offset: 6px; text-decoration: underline;  text-decoration-thickness: 4px; }
#header .cus_head{max-width: 1920px; margin: 0 auto; width: 100%; transition: transform 0.3s ease, position 0.3s ease;}

#header .depth02_sub_box .left_box .le_new_yo{width: 350px; border-right: 1px solid #575757;}
#header .depth02_sub_box .left_box .ri_new_yo{display: flex; width: calc(100% - 350px); padding-left: 100px; box-sizing: border-box;}

#m_menu .m_lo_gin{display: flex; justify-content: center; gap: 20px; padding-top: 20px;}

@media all and (max-width:1024px){
	#header .header_tb{font-size: 16px;}
}

@media all and (max-width:700px) {
	#header .header_tb {
		height: 40px;
	}
	#header .header_tb {
		font-size: 17px;
	}
	#header .h_inner {
		height: 68px;
	}
	#footer .f_logo {
		text-align: center;		
		margin-bottom: 32px;
	}
	#footer .f_logo img {
		height: 29px;
	}
	#footer .f_inner .f_alt {
		font-size: 11px;
		margin-bottom: 35px;
		text-align: center;
	}
	#footer .f_inner .f_copy {
		font-size: 10px;
	}
	#footer .f_inner{
		padding: unset;
		text-align: center;
		margin: unset;
	}
	#footer {
		padding: 50px 55px;
	}
}

/* 2024.12.26 추가 */
.f_left_box {
	width: 40%;
}
.f_right_box {
	width: calc(60% - 40px);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 40px 0;
}
.f_link_box_wrap01 {
	display: flex;
	flex-wrap: wrap;
	width: calc(100% - 500px);	
	gap: 40px 80px;
}
#footer .f_link_box_wrap01 .tit {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0;
    color: #fff;
    display: block;    
	margin-bottom: 30px;
}
#footer .f_right_box a {
}

#footer .f_link_box01 .alt_box + .alt_box {
	margin-top: 30px;
}

.f_last_box01 {
	width: 500px;
}
.f_insta {
	filter: brightness(0) invert(1);
	max-width: 32px;
	margin-left: auto;
	display: block;
}
.f_input_box01 {
	display: block;
	padding: 0 20px;
	height: 50px;
	font-size: 20px;
	width: 100%;
	margin-top: 50px;
}
#footer .f_right_box .f_input_submit_btn {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	height: 50px;
	font-size: 20px;
	width: 100%;
	border: 1px solid #fff;
	text-align: center;
	text-decoration: unset;
}

@media all and (max-width:1800px) {
	.f_left_box,
	.f_right_box {
		width: 100%;
	}
}

@media all and (max-width:1024px) {
	.f_link_box_wrap01,
	.f_last_box01 {
		width: 100%;
	}
	.f_input_box01 {
		margin-top: 30px;
	}
}
/* END 2024.12.26 추가 */

/* 2025.02.07 추가 */
#ge_ss769_0 {
	margin: unset !important;
}
#ge_ss769_0 img {
	margin-right: unset !important;
}
.m_only {
	display: none;
}
@media all and (max-width:1200px) {
	#header * {
		box-sizing: border-box;
	}
	#header .com_search_box01 {
		position: fixed;
		transition: all 0.3s ease;
		top: -100%;
		z-index: 100;
		height: 68px;
		left: 0;
		background-color: #fff;
		max-width: unset;
		padding: 0 20px;
		padding-right: 45px;
	}
	#header .com_search_box01 .com_search_btn {
		right: 20px;
	}
	#header .com_search_box01.active {		
		top: 40px;
	}
	#header .h_inner {
		position: relative;
	}
	#header .m_btn{
		width: 28px;
		margin: unset;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.h_cart_btn {
		order: 2;
		display: flex;
		align-items: center;
		padding: 0 8px;
	}
	.h_cart_btn img {
		min-width: 24px;
	}
	.h_type02 {
		display: flex;
		align-items: center;
		padding: 0 8px;
	}
	#header .h_right_box {
		align-items: unset;
		gap: unset;
	}
	.booox {
		position: relative;
	}
	#ge_ss769_0 {
		padding: 8px;
	}
}
/* END 2025.02.07 추가 */