/* BASIC css start */
body{_min-width: 1900px; background: #fef9f9; }

#dgnset_wrap { 
    padding: 1.4rem !important; 
    background: #fff !important; 
    width: 100% !important;
    margin: 0px auto;
    max-width: 1440px;
    min-width: 1240px;
    box-sizing: border-box;

}

/* brand grotesqueÆùÆ® */
@font-face {
	font-family: "BrandonGrotesque";
	src: url("/design/ddmnail/mochi/font/BrandonGrotesque.eot"); /* IE9 Compat Modes */
	src: url("/design/ddmnail/mochi/font/BrandonGrotesque.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */  url("/design/ddmnail/mochi/font/BrandonGrotesque.otf") format("opentype"), /* Open Type Font */  url("/design/ddmnail/mochi/font/BrandonGrotesque.svg") format("svg"), /* Legacy iOS */  url("/design/ddmnail/mochi/font/BrandonGrotesque.ttf") format("truetype"), /* Safari, Android, iOS */  url("/design/ddmnail/mochi/font/BrandonGrotesque.woff") format("woff"), /* Modern Browsers */  url("/design/ddmnail/mochi/font/BrandonGrotesque.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}
/* futura */
@font-face {
	font-family: 'FuturaBT';
	src: url('/design/ddmnail/mochi/font/FuturaBT.eot');
	src: url('/design/ddmnail/mochi/font/FuturaBT.eot?#iefix') format('embedded-opentype'),  url('/design/ddmnail/mochi/font/FuturaBT.woff2') format('woff2'),  url('/design/ddmnail/mochi/font/FuturaBT.woff') format('woff'),  url('/design/ddmnail/mochi/font/FuturaBT.ttf') format('truetype');
}
@font-face {
	font-family: 'FuturaBT';
	src: url('/design/ddmnail/mochi/font/FuturaBT.eot');
	src: url('/design/ddmnail/mochi/font/FuturaBT.eot?#iefix') format('embedded-opentype'),  url('/design/ddmnail/mochi/font/FuturaBT.woff2') format('woff2'),  url('/design/ddmnail/mochi/font/FuturaBT.woff') format('woff'),  url('/design/ddmnail/mochi/font/FuturaBT.ttf') format('truetype');
}



/*°øÅëcss*/
#loginWrap{
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}
#loginWrap .mlog-sign .sign{padding-left: 115px !important}

#loginWrap .mlog-sign .mlog{padding-left: 120px !important; width: 530px !important; padding:0; padding-left: 120px !important}

#loginWrap .mlog-sign .frm-list li{text-indent:0 !important}

.new-btn-area a{background:#000 !Important; border:1px solid #000 !Important;}

#passimg, #MSecure_layer1 {
	z-index: 90!important;
}

.prd-brand {
	color: #0d0d0d;
	font-size: 14px;
	font-family: 'lato','Noto sans KR';
	font-weight: 500;
}
.prd-soldout {
	font-size: 19px;
	padding-top: 10px;
	color: #94223e;
	font-weight: normal;
}
.prd-name {
	color: #0d0d0d;
	font-size: 13px;
	font-family: 'lato','Noto sans KR';
	font-weight: 500;
	padding: 7px 0 7px;
}
.prd-subname {
	font-size: 14px;
	padding: 7px 0;
	color: #aaa;
	font-weight: 100;
}
.prd-replace {
	font-size: 19px;
	color: #94223e !important;
	font-weight: normal;
}
.item-list:last-child {
	margin-right: 0 !important;
}
.item-list .thumb .dc {
	z-index: 9
}
.item-list .thumb a {
	display: block;
	margin: 0;
}

.four {
	margin-bottom: 28px;
	margin-right: 28px;
	position: relative;
	width: 306px;
	display: inline-block;
	vertical-align: top;
}
.three {
	position: relative;
	width: 420px;
	display: inline-block;
	vertical-align: top;
	margin-right: 25px;
}
.three:nth-child(3n), .four:nth-child(4n) {
	margin-right: 0
}

.MS_search_word {
	width: 210px;
	height: 34px;
	background: none;
	margin: 2px 10px;
	border: 0;
	text-indent: 5px;
}
a:focus {
	outline: none;
}
.dn {
	display: none !important;
}





/* »çÀÌµå ¸Þ´º */
#scroll-right {
	position: fixed;
	z-index: 99999;
	top: 25%;
	right: 0px;
	background: #fff;
	width: 121px;
	border-left: solid 1px #eaeaea;
	border-top: 1px solid #eaeaea;
}
#scroll-right a {/*line-height: 23px;*/
}
#scroll-right .right_fix_content .topbot {
}
#scroll-right .right_fix_content .topbot a {
	text-align: left;
	width: 100%;
	border-right: 1px solid #e2e4e6;
	display: inline-block;
	text-align: center;
	height: 39px;
	line-height: 39px;
	border-bottom: 1px solid #e2e4e6;
	color: #757575;
	font-family: 'lato','Noto sans KR';
	vertical-align: middle;
	text-indent: 22px;
	text-align: left;
}
#scroll-right .right_fix_content .topbot a:last-child {
	height: 39px;
	line-height: 39px;
	border-bottom: 1px solid #e2e4e6;
}
#scroll-right .right_fix_content .topbot a img {
	padding-right: 13px
}
#scroll-right .right_fix_content .sns {
	text-align: left;
	padding: 0 20px;
}
#scroll-right .right_fix_content .sns img {
	margin-right: 5px;
}
#scroll-right .right_fix_content .cs_center {
	padding: 15px 20px;
}
#scroll-right .right_fix_content .cs_center .title {
	font-size: 12px;
	color: #000;
	font-weight: bold;
}
#scroll-right .right_fix_content .cs_center .num {
	font-size: 24px;
	margin: 10px 0;
	font-weight: 500;
	font-family: 'Heebo', sans-serif;
	color: #1c1c1c;
}
#scroll-right .right_fix_content .cs_center .des {
	color: #808080;
	margin-bottom: 3px;
	font-size: 11px;
	letter-spacing: 0.08em;
}
#scroll-right .right_fix_content .bank .imgbn .bx-wrapper {
	position: relative;
}
#scroll-right .right_fix_content .bank .imgbn .bx-pager {
	position: absolute;
	top: 10px;
	right: 10px;
	height: 6px;
	text-align: center;
}
#scroll-right .right_fix_content .bank .imgbn .bx-pager .bx-pager-item {
	display: inline-block;
	margin: 0 4px
}
*:first-child+html .imgbn .bx-pager .bx-pager-item {
	display: inline
} /* IE7 Hack */
#scroll-right .right_fix_content .bank .imgbn .bx-pager .bx-pager-item a {
	display: block;
	width: 6px;
	height: 6px;
	text-indent: -9999em;
	border: 1px solid #333;
	border-radius: 10px;
}
#scroll-right .right_fix_content .bank .imgbn .bx-pager .bx-pager-item a.active {
	background: #333;
}
#scroll-right .right_fix_content .bank {
	padding: 15px 20px;
	border-bottom: 1px solid #e6e6e6;
}
#scroll-right .right_fix_content .bank .imgbn .fix_bn_slide {
	width: 200px;
	height: 168px;
	overflow: hidden;
}
#scroll-right .right_fix_content .bank .bank_info {
	margin-bottom: 16px
}
#scroll-right .right_fix_content .bank .bank_info a {
	width: 94px;
	height: 30px;
	border: 1px solid #000;
	line-height: 30px;
	display: inline-block;
	text-align: center;
	font-size: 11px;
}
#scroll-right .right_fix_content .myinfo {
	padding: 15px 20px;
	border-bottom: 1px solid #e2e4e6;
}
#scroll-right .right_fix_content .myinfo ul {
	margin-bottom: 27px;
}
#scroll-right .right_fix_content .myinfo ul:last-child {
	margin-bottom: 0px;
}
#scroll-right .right_fix_content .myinfo ul:after {
	display: block;
	clear: both;
	content: ''
}
#scroll-right .right_fix_content .myinfo ul li {
	float: left;
	width: 33.3%;
	text-align: center;
	position: relative;
}
#scroll-right .right_fix_content .myinfo ul li #user_basket_quantity {
	position: absolute;
	top: 0px;
	right: 10px;
	color: #fff;
	background: #000;
	width: 17px;
	height: 17px;
	border-radius: 17px;
	font-size: 11px;
	line-height: 17px;
	text-align: center;
}
#scroll-right .right_fix_content .myinfo ul li a {
}
#scroll-right .right_fix_content .myinfo ul li a .img {
	height: 25px;
	display: block;
	line-height: 25px;
	margin-bottom: 7px;
}
#scroll-right .right_fix_content .myinfo ul li a .img img {
}
.right_fix {
	position: fixed;
	top: 0px;
	right: 0px;
	z-index: 9999;
	bottom: 0px;
	width: 0px;
	background: #fff;
	border-left: 1px solid #b3b3b3;
}
#scroll-right .right_fix_content {
	position: relative;
	z-index: 40;
	width: 121px;
	background: #fff;
	height: 100%;
}
#scroll-right .right_fix_content .login {
	padding: 15px 20px;
	border-bottom: 1px solid #ebebeb;
}
#scroll-right .right_fix_content .login ul {
}
#scroll-right .right_fix_content .login ul li {
	margin-bottom: 6px;
}
#scroll-right .right_fix_content .login ul li:after {
	display: block;
	clear: both;
	content: ''
}
#scroll-right .right_fix_content .login ul li .title {
	width: 32px;
	float: left;
	height: 30px;
	line-height: 30px;
}
#scroll-right .right_fix_content .login ul li .content {
	width: 167px;
	float: left;
	height: 30px;
	line-height: 30px;
}
#scroll-right .right_fix_content .login ul li .content .MS_login_id {
	width: 90%;
	padding: 0 4%;
	height: 28px;
	color: black;
	border: 1px solid #ccc;
}
#scroll-right .right_fix_content .login ul li .content .MS_login_pw {
	width: 90%;
	padding: 0 4%;
	height: 30px;
	color: black;
	border: 1px solid #ccc;
}
#scroll-right .right_fix_content .login .btn {
	margin-top: 13px;
}
#scroll-right .right_fix_content .login .btn a {
	color: #fff;
	width: 94px;
	height: 32px;
	line-height: 32px;
	background: #383838;
	display: inline-block;
	text-align: center;
	font-size: 11px;
}
#scroll-right .right_fix_content .login .btn:after {
	display: block;
	clear: both;
	content: ''
}
#scroll-right .right_fix_content .login .btn a.join {
	float: left;
	margin-right: 11px;
}
#scroll-right .right_fix_content .login .btn a.log {
	float: left;
}
#scroll-right .right_fix_content .right_fix_btn {
	width: 42px;
	position: absolute;
	top: 40%;
	left: -42px;
	z-index: 20;
	cursor: pointer;
}
#scroll-right .right_fix_content .right_fix_btn.close {
	background: url(/design/nubizio777/renewal/img/right_fix_close_btn.png) no-repeat;
}
#scroll-right .right_fix_content .right_fix_btn.close img {
	display: none;
}
#scroll-right .right_fix_content .login .user_info {
}
#scroll-right .right_fix_content .login .user_info .name {
	font-weight: bold;
	margin-bottom: 15px;
}
#scroll-right .right_fix_content .login .user_info .reserve {
}
#scroll-right .right_fix_content .login .user_info .deposit {
}
#scroll-right .right_fix_content .login .user_info .coupon {
}
#scroll-right .right_fix_content .login .user_info p {
	margin-bottom: 10px;
}
#scroll-right .right_fix_content .login .user_info p:after {
	display: block;
	clear: both;
	content: ''
}
#scroll-right .right_fix_content .login .user_info p .title {
	float: left;
	width: 50%;
	text-align: left;
	font-size: 11px;
	color: #000;
}
#scroll-right .right_fix_content .login .user_info p .con {
	float: left;
	width: 50%;
	text-align: right;
	font-size: 11px;
	color: #000;
	font-weight: bold;
}


/*Ãø¸é½ºÅ©·Ñ*/

#blk_scroll_wings {
	display: none!important;
}
.r_wing_wrap {
	margin: 0;
	padding: 0;
}
.r_wing_wrap .r_wing_content {
	width: 120px;
	background: #fff;
}
.r_wing_wrap .r_wing_content .today_wrap_c {
	width: 120px;
	text-align: center;
	border-bottom: 1px solid #e7e7e7;
}
.r_wing_wrap .r_wing_content .today_wrap_c h3 {
	padding: 10px;
	color: #000000;
	font-size: 13px;
	font-family: 'Spoqa Han Sans';
	font-weight: 500;
}
.r_wing_wrap .r_wing_content .today_wrap_c li {
	display: table;
	padding-bottom: 5px;
}
.r_wing_wrap .r_wing_content .today_wrap_c a {
	display: block;
}
.r_wing_wrap .r_wing_content .today_wrap_c a img {
	width: 85px;
}
.r_wing_wrap .r_wing_content .bnr_wrap {
	width: 120px;
	text-align: center;
	border-bottom: 0;
}
.r_wing_wrap .r_wing_content .bnr_wrap .scroll_event {
	display: block;
	text-align: center;
}
.r_wing_wrap .r_wing_content .bnr_wrap ul li a {
	display: block;
	text-align: center;
	border-bottom: 1px solid #eaeaea;
	padding: 12px 0;
	color: #585858;
	font-size: 13px;
	font-family: 'Spoqa Han Sans';
}
.r_wing_wrap .r_wing_content .bnr_wrap a.heassal p {
	display: block;
	height: 100px;
	vertical-align: bottom;
	line-height: 165px; /*font-weight: bold;*/
	color: #000;
}
.r_wing_wrap .r_wing_content .bnr_wrap .btn {
	display: table;
	width: 100%;
	margin-top: -1px;
	border-bottom: 1px solid #e7e7e7;
}
.r_wing_wrap .r_wing_content .bnr_wrap .btn a {
	width: 50%;
	height: 40px;
	line-height: 40px;
}
.r_wing_wrap .r_wing_content .bnr_wrap .btn a img {
	vertical-align: middle;
}
#go_top {
	float: left;
}
#go_bottom {
	float: right;
	border-left: 1px solid #e7e7e7;
	margin-right: -1px;
}
.clear_w:before, .clear_w:after {
	content: '';
	float: none;
	clear: both;
	display: table;
*zoom:1;
}




/*¶ì¹è³Ê*/
#topBnr {
max-width: none !important;
    margin:0 auto;

	text-align: center;
	line-height: 90px;
    overflow:hidden;
}
#topBnr .bnr {
	position: relative;
}
#topBnr .bnr a {vertical-align: top; display:block; width:100%;
}
#topBnr .bnr a img {
width:100%;
}
#topBnr p {
	position: absolute;
	right: 0;
	cursor: pointer;
	top:50%; 
    transform:translateY(-50%)
}

/*»ó´Ü¹Ì´Ïgnb*/
#topGnb {
	display: table;
	width: 100%;
}
.gnbwrap {
	/* width: 1310px; */
	/* width: 100%; */
	/* margin: 0 auto; */
}
.gnbwrap ul.sns {
	float: left;
}
.gnbwrap ul.sns li {
	display: inline-block;
	height: 40px;
	line-height: 40px;
}
.gnbwrap ul.sns li a {
	color: #fff;
	font-family: initial !important;
	padding: 0 4px;
}
.gnbwrap ul.info {
	float: right;
}
.gnbwrap ul.info li {
	display: inline-block;
	height: 40px;
	line-height: 40px;
}
.gnbwrap ul.info li.join {
	position: relative
}
.gnbwrap ul.info li.join #point {
	position: absolute;
	left: 5px;
	top: 28px;
	z-index: 999;
	background: url(/design/ddmnail/mochi/img/joinpoint.png) center no-repeat;
	background-size: 53px 21px;
	width: 53px;
	height: 21px;
	line-height: 23px;
	text-align: center;
	font-size: 11px;
	color: #ffffff;
	font-family: lato !important;
	font-family: normal;
}
.gnbwrap ul.info li.mp {
	position: relative;
}
.gnbwrap ul.info li.mp .arrow {
	background: url(/design/ddmnail/mochi/img/arrow.png) no-repeat;
	background-position: 73px 7px;
}
.gnbwrap ul.info li.mp .arrow.open {
	background-size: 8px 4px;
	background: url(/design/ddmnail/mochi/img/arrow_open.gif) no-repeat;
	background-position: 73px 7px;
}
.gnbwrap ul.info li.mp .mp-open {
	display: none;
	position: absolute;
	top: 34px;
	left: 0;
	z-index: 999;
	border: 1px solid #d5d5d5;
	padding: 9px 10px;
	background: #fff;
	text-align: center;
}
.gnbwrap ul.info li.mp .mp-open a {
	display: block;
	word-break: keep-all;
	padding: 5px 8px;
}
.gnbwrap ul.info li a {
	padding: 0 10px;
	font-family: 'Malgun Gothic' !important;
	font-size: 12px;
	color: #7b7b7b;
}
.gnbwrap ul.info li a img {
	padding: 0 4px;
}

/*»ó´Ü½ÃÀÛ*/

header{margin:0 !important}
.header_wrap {
	/* width: 1310px; */
	width: 100%;
	position: relative;
	margin: 0 auto;
}
.header_wrap .header_content {
	width: 100%;
	position: relative;
	z-index: 13;
}
.header_wrap .header_content .top_menu {
	/* width: 1310px; */
	width: 100%;
	height: 33px;
	margin: 0 auto;
}
.header_wrap .header_content .top_menu .book_mark {
	float: left;
	margin-top: 11px;
}
.header_wrap .header_content .top_menu .book_mark img {
	margin-right: 7px;
	position: relative;
	top: -2px;
}
.header_wrap .header_content .top_menu .logmenu {
	float: right;
}
.header_wrap .header_content .top_menu .logmenu li {
	width: 65px;
	display: inline-block;
*display:inline;
}
.header_wrap .header_content .top_menu .logmenu li.cate_01 {
	font-weight: bold;
	width: 60px;
	height: 33px;
}
.header_wrap .header_content .top_menu .logmenu li.cate_02 {
	width: 47px;
	height: 33px;
}
.header_wrap .header_content .top_menu .logmenu li.cate_03 {
	width: 55px;
	height: 33px;
	position: relative;
	z-index: 2;
}
.header_wrap .header_content .top_menu .logmenu li.cate_04 {
	width: 71px;
	height: 33px;
}
.header_wrap .header_content .top_menu .logmenu li.cate_05 {
	width: 77px;
	height: 33px;
}
.header_wrap .header_content .top_menu .logmenu a {
	display: block;
	font-size: 12px;
	color: #6c6c6c;
	line-height: 100%;
	height: 33px;
	width: 100%;
	text-align: center;
	line-height: 3em;
}
.header_wrap .header_content .top_menu .logmenu .logm_sub {
	display: none;
	position: absolute;
	top: 33px;
	left: -1px;
	z-index: 2;
	background: #efeeee;
	border: 1px solid #d4d4d4;
	width: 112px;
}
.header_wrap .logo_wrap {
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 12;
	overflow: hidden;
	background: #fff;
}
.header_wrap .logo_wrap .sub_logo {
	width: 228px;
	float: left;
	margin-top: 41px;
}
.header_wrap .logo_wrap .sub_logo span {
	display: block;
}
.header_wrap .logo_wrap .sub_logo span.sub_logo_etf {
	margin-bottom: 11px;
}
.header_wrap .logo_wrap .logo {
	margin: 0.6rem 0;
    margin-left: -0.6rem;
	z-index: 2;
	/* text-align: center; */
    display: flex;
    justify-content: space-between;
}
.header_wrap .logo_wrap .logo img {
	width: 8.7rem;
}

#side_search {
	display: inline-block;
	width: 100%;
	position: relative;
	background: #f4f4f4;
	/* position: absolute;*/
	right: 0;
	/* bottom: 15px; */
    border-radius: 0.5rem;
    max-width: 1200px;
    margin-bottom: 1.5rem;
}
#side_search .sch_btn {
	right: 15px;
	position: absolute;
	top: 6px;
}
#side_search .sch_btn {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 2;
}


/* 1. ¸ÞÀÌÅ©¼¥ÀÌ »ý¼ºÇÏ´Â form ű׸¦ ²Ë ä¿ì±â */
#side_search form {
    display: flex;         /* ³»ºÎ input°ú ¹öÆ°À» °¡·Î·Î Á¤·Ä */
    width: 100%;           /* ºÎ¸ð(#side_search)ÀÇ ³Êºñ¸¦ 100% »ç¿ë */
    height: 100%;          /* ³ôÀ̵µ ²Ë ä¿ò */
    align-items: center;   /* ¼¼·Î Áß¾Ó Á¤·Ä */
}

/* 2. ½ÇÁ¦ ±ÛÀÚ¸¦ ÀÔ·ÂÇϴ â(input)À» ²Ë ä¿ì±â */
#side_search .input-keyword {
    font-size: 0.85rem;
    text-align: center;
    flex: 1;               /* ¹öÆ°À» Á¦¿ÜÇÑ ³²Àº °ø°£À» ¸ðµÎ Â÷Áö */
    width: auto !important; /* ±âÁ¸¿¡ Ȥ½Ã ÀâÇôÀÖÀ»Áö ¸ð¸¦ °íÁ¤ ³Êºñ ÇØÁ¦ */
    height: 100%;
    border: none;          /* ¾ÈÂÊ Å׵θ® Á¦°Å */
    padding: 0 15px;       /* ÁÂ¿ì ¿©¹é */
    background: transparent; /* ¹è°æÀ» Åõ¸íÇÏ°Ô Çؼ­ ºÎ¸ð µðÀÚÀÎ À¯Áö */
}

/* 3. µ¸º¸±â ¹öÆ° À§Ä¡ Á¶Á¤ */
#side_search .btn_search {
    width: 22px;           /* ¹öÆ° Å©±â ÀûÀýÈ÷ Á¶Àý */
    margin: 6px 15px;    /* ¿À¸¥ÂÊ ³¡¿¡¼­ »ì¦ ¶ç¿ò */
}


/*»ó´Ü*/
header {
	/* border-bottom: 1px solid #eaeaef; */
}
.header_wrap .menu_wrap {
    width: 100%;
    height: 60px;
    line-height:60px
    
}
.header_wrap .menu_wrap.fixed {
	border-bottom: 1px solid #eaeaef;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	background: #fff
}
.header_wrap .menu_wrap.fixed .gnb_sub {
	top: 55px
}
#gnb.gnb_stop {
	position: fixed;
	z-index: 300;
	left: 0;
	top: 0;
	width: 100%
}
#gnb .gnb_view {
	position: relative;
	z-index: 300;
	min-width: 1050px;
	background-color: #fff;
	letter-spacing: -0.3px
}

/* °Ë»öâ */
#gnb .gnb_search {
	position: absolute;
	right: 0;
	top: 18px;
	width: 238px
}
#gnb .gnb_search .inp_search {
	width: 238px;
	height: 36px;
	padding: 0 50px 0 20px;
	border: 1px solid #f7f7f6;
	border-radius: 18px;
	background-color: #f7f7f7;
	font-weight: 400;
	font-size: 12px;
	color: #666;
	line-height: 16px;
	outline: none
}

#gnb .gnb_search .inp_search.focus {
	background-color: #fff;
	color: #333
}
#gnb .gnb_search .btn_search {
	position: absolute;
	right: 10px;
	top: 6px;
}

/* »ó´ÜGNB¸ÞÀÎ */
#gnb .gnb_main {
	/* width: 1310px; */
	width: 99.5%;
	margin: 0 auto;
	position: relative;
}
#gnb .gnb_main .gnb {
    width:100%;
    display:flex; 
    justify-content:space-between;
	/*float: left;
	width: 100%*/
}

#gnb .gnb_main .gnb li{margin-right: 42px; display: inline-block;}

#gnb .gnb_main .gnb li:nth-last-child(1){margin-right:0}

#gnb .gnb_main .gnb .lst {
	background: none
}
#gnb .gnb_main .gnb a {overflow: hidden;
    float: left;
    height: 60px;
    /* padding: 15px 0px 0 42px; */
    font-size: 16px;
    color: #333;
    line-height: 62px;
    font-family: 'lato','Noto sans KR';
}

#gnb .gnb_main .gnb a span{
    padding: 15px 0px 0 0px;}

#gnb .gnb_main .gnb li a em {
	display: inline-block;
	width: 1px;
	height: 14px;
	background: #dadadd;
	margin-left: 52px;
	margin-top: -1px;
	vertical-align: middle;
	margin-right: 19px;
}
#gnb .gnb_main .gnb a span.gray {
	color: #3b3b3b;
}
#gnb .gnb_main .gnb a span.red {
	color: #ff8e95;
	font-size: 15px;
	font-family: 'Spoqa Han Sans';
}
 #gnb .gnb_main .gnb a:hover, #gnb .gnb_main .gnb a.on
}
#gnb .gnb_main .gnb a:hover .txt {
	border-bottom: 1px solid #6b3590
}
#gnb .gnb_main .menu1 a {
	padding-left: 0
}
#gnb .gnb_main .menu1 .ico {
	float: left;
	width: 22px;
	height: 18px;
	margin: 23px 6px 0 0;
	background: url(/design/ddmnail/mochi/img/ico_gnb_all.png) no-repeat;
    padding: 0;
}
#gnb .gnb_main .menu1 a.on .ico,  #gnb .gnb_main .menu1 a.on .txt {
	_color: #bbb
}
#gnb .gnb_main .menu1 a.on .txt, #gnb .gnb_main .menu1 a:hover .txt, #gnb .gnb_main .menu1 .txt {
	float: left;
	border-bottom: 0;
    padding-top: 0;
}
/* GNB¼­ºê */
#gnb .gnb_sub {
	background: #fff;
	display: none;
	overflow: hidden;
	position: absolute;
	z-index: 301;
	left: -25px;
	top:60px;
	padding-top: 1px;
	border: 1px solid #ddd;
}
#gnb .gnb_sub .inner_sub {
	margin-top: -1px;
	padding-top: 45px;
    padding-bottom:50px;
	width: 1345px;
	margin: 0 auto;
	background: #fff;
	font-size: 0;
	border-top: 0;
	background-size: contain;
}

#gnb .gnb_sub .inner_sub .banner {
	display: inline-block;
	margin-left: 40px;
	margin-right: 60px;
}

#gnb .gnb_sub .inner_sub .menu_sub{
    width:90%;
    display: inline-block;
    vertical-align: top;
}

#gnb .gnb_sub .inner_sub .banner a {}

#gnb .gnb_sub .gnb_menu {
    width: 105px;
    display: inline-block;
    vertical-align: top;
    margin-right: 30px;
    margin-bottom: 80px;
}




#gnb .gnb_sub .gnb_menu li {
	width: 100%;
	text-align: left
}
#gnb .gnb_sub .gnb_menu li:first-child {
	padding-top: 0
}
#gnb .gnb_sub .menu {
	display: block;
	overflow: hidden;
	width: 100%;
	height: 40px;
	padding: 8px 0 10px 0;
	cursor: pointer
}
#gnb .gnb_sub .gnb_menu li:first-child .menu {
	height: unset;
	padding-top: 0;
}
#gnb .gnb_sub .current .menu {
	background: #f7f7f7
}
#gnb .gnb_sub .current .txt, #gnb .gnb_sub .menu.on.off:hover .txt, #gnb .gnb_sub .menu.on .txt {
	font-weight: 700;
	color: #94223e
}
#gnb .gnb_sub .ico {
	float: left;
	width: 24px;
	height: 24px
}
#gnb .gnb_sub .ico img {
	width: 24px;
	height: 24px
}
#gnb .gnb_sub .ico .ico_off {
	display: block
}
#gnb .gnb_sub .ico .ico_on {
	display: none
}
#gnb .gnb_sub .current .ico_off, #gnb .gnb_sub .menu.on .ico_off, #gnb .gnb_sub .menu:hover .ico_off {
	display: none
}
#gnb .gnb_sub .current .ico_on, #gnb .gnb_sub .menu.on .ico_on, #gnb .gnb_sub .menu:hover .ico_on {
	display: block
}
#gnb .gnb_sub .ico_arrow {
	display: none;
	float: right;
	width: 16px;
	height: 17px;
	padding: 6px 9px 0 0
}
#gnb .gnb_sub .ico_arrow img {
	width: 7px;
	height: 11px
}
#gnb .gnb_sub .current .ico_arrow {
	display: block
}
#gnb .gnb_sub .txt {
	float: left;
	padding: 0 4px 0 0px;
	font-size: 16px;
	color: #202020;
	font-family: 'Roboto Condensed', sans-serif;
	white-space: nowrap;
	font-weight: 500;
	letter-spacing: 0px;
}
#gnb .gnb_sub .ico_new {
	overflow: hidden;
	float: left;
	width: 14px;
	height: 14px;
	margin-top: 5px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: 14px 14px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999px
}
#gnb .gnb_sub .sub_menu {
}
#gnb .gnb_sub .sub_menu .box {
}
#gnb .gnb_sub .sub_menu .box a {
	display: block;
	border: 1px solid #eee;
	margin-bottom: 5px;
	text-align: center;
	height: 33px !important;
	line-height: 34px;
	padding: 0 7px;
	font-family: 'Lato', sans-serif;
	color: #989898;
	font-size: 13px;
	margin-top: 9px;
}
#gnb .gnb_sub .current .sub_menu {
	z-index: 1;
	opacity: 1;
	transition: opacity 0.5s
}
#gnb .gnb_sub .sub_menu .sub {
	display: block;
	overflow: hidden;
	padding: 7px 0;
	font-size: 14px;
	color: #989898;
	cursor: pointer;
	white-space: pre;
	text-overflow: ellipsis;
	font-family: 'Spoqa Han Sans'
}


/* Àüü Çì´õ ·¡ÆÛ */
.header_wrap {
    display: flex;
    justify-content: space-between; /* ·Î°í ¿ÞÂÊ, ¸Þ´º ¿À¸¥ÂÊ */
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0;
    font-family: 'Pretendard', sans-serif;
    position: relative;
}

/* ·Î°í »çÀÌÁî Á¶Àý */
.logo_area img {
    height: 2.5rem; /* ·Î°í Å©±â¿¡ ¸Â°Ô Á¶ÀýÇϼ¼¿ä */
}

/* ¸Þ´º ¸®½ºÆ® Á¤·Ä */
.gnb-icons {
    display: flex;
    align-items: center;
    gap: 25px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.gnb-icons li {
    position: relative; /* µå·Ó´Ù¿î ±âÁØÁ¡ */
}

.gnb-icons li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #333;
}

/* ¾ÆÀÌÄÜ ½ºÅ¸ÀÏ (Lucide) */
.gnb-icons i {
    width: 26px;
    height: 26px;
    stroke-width: 2.2; /* ¹«°Ô°¨ ÀÖ°Ô Á¶Á¤ */
    stroke: #222;
    margin-bottom: 4px;
    transition: stroke 0.2s;
}

.gnb-icons span {
    font-size: 11px;
    font-weight: 600;
}

/* È£¹ö È¿°ú */
.gnb-icons li:hover i {
    stroke: #ff8a8a;
}

/* Àå¹Ù±¸´Ï ¹èÁö */
.icon-wrap {
    position: relative;
}

.cart-badge {
    position: absolute;
    top: -5px;
    right: -8px;
    background: #ff8a8a;
    color: #fff;
    font-size: 10px;
    min-width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    border: 1.5px solid #fff;
}

/* ¸¶ÀÌÆäÀÌÁö µå·Ó´Ù¿î (±úÁü ÇØ°á ÇÙ½É) */
.dropdown-content {
    display: none; /* Æò¼Ò¿£ ¼û±è */
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    min-width: 150px; /* ¾ÆÀÌÄÜ Æ÷ÇÔÀ» °í·ÁÇØ ³Êºñ »ì¦ È®Àå */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 10px 0;
    z-index: 9999; /* ÇÏ´Ü Ä«Å×°í¸®¿¡ °¡·ÁÁöÁö ¾Ê°Ô ÃÖ»ó´Ü ¹èÄ¡ */
    margin-top: 10px;
}

.dropdown-my:hover .dropdown-content {
    display: block; /* ¸¶¿ì½º ¿Ã¸®¸é Ç¥½Ã */
}

/* µå·Ó´Ù¿î ³»ºÎ ¸µÅ© ½ºÅ¸ÀÏ º¸Á¤ */
.dropdown-content a {
    padding: 12px 20px;
    display: flex !important; /* ¾ÆÀÌÄÜ°ú ÅؽºÆ® Á¤·ÄÀ» À§ÇØ flex·Î º¯°æ */
    align-items: center;
    gap: 10px; /* ¾ÆÀÌÄÜ°ú ±ÛÀÚ »çÀÌ °£°Ý */
    font-size: 13px !important;
    color: #555 !important;
    text-align: left;
}

/* µå·Ó´Ù¿î ³»ºÎ Lucide ¾ÆÀÌÄÜ Å©±â */
.dropdown-content a svg {
    width: 16px;
    height: 16px;
    color: #888;
}

.dropdown-content a:hover svg {
    color: #ff8a8a; /* È£¹ö ½Ã ¾ÆÀÌÄÜ »ö»óµµ º¯°æ */
}

.dropdown-content a:hover {
    background: #f9f9f9;
    color: #ff8a8a !important;
}

/* ·Î±×ÀÎ ¹öÆ° */
.btn-auth {
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fdfdfd;
}

.dropdown-content::before {
    content: "";
    position: absolute;
    top: -15px; /* ¸Þ´º À§ÂÊÀ¸·Î 15px¸¸Å­ Åõ¸í ¿µ¿ª È®Àå */
    left: 0;
    width: 100%;
    height: 15px;
    background: transparent; /* ´«¿¡´Â ¾È º¸ÀÌÁö¸¸ ¸¶¿ì½º´Â ÀνÄÇÔ */
}

/* 3. È£¹ö ½Ã À¯Áö */
.dropdown-my:hover .dropdown-content {
    display: block;
}


/* µå·Ó´Ù¿î ºÎ¸ð °øÅë ¼³Á¤ */
.dropdown-my, .dropdown-comm {
    position: relative; /* ±âÁØÁ¡ ¼³Á¤ */
}
/* ¸¶ÀÌÆäÀÌÁö & Ä¿¹Â´ÏƼ È£¹ö ½Ã µå·Ó´Ù¿î ³ëÃâ */
.dropdown-my:hover .dropdown-content,
.dropdown-comm:hover .dropdown-content {
    display: block !important;
}













.logo-cube-group {
    display: flex;
    align-items: center;
    /* gap: 12px;  ·Î°í¿Í Å¥ºê »çÀÌ °£°Ý */
}

.badge-cube-wrapper {
    width: 26px;
    height: 26px;
    perspective: 1000px; /* 3D ±íÀÌ°¨ */
}

.badge-cube {
    width: 100%;
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.face {
    position: absolute;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 900;
    color: #fff;
    border-radius: 6px;
    backface-visibility: hidden; /* µÞ¸éÀº ¾È º¸ÀÌ°Ô */
}

/* 4°³ ¸éÀÇ 3D °ø°£ ¹èÄ¡ (Á¤À°¸éü ÇüÅÂ) */
.f1 { transform: rotateX(0deg) translateZ(13px); }
.f2 { transform: rotateX(90deg) translateZ(13px); }
.f3 { transform: rotateX(180deg) translateZ(13px); }
.f4 { transform: rotateX(270deg) translateZ(13px); }










/* Çܹö°Å ¹öÆ° ½ºÅ¸ÀÏ */
.hamburger-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
    display: flex;
    align-items: center;
}

/* ¸ð´Þ ¿À¹ö·¹ÀÌ */
.category-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal-content {
    background: #fff;
    width: 90%;
    max-width: 1000px;
    height: 80vh;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.modal-header {
    padding: 20px 30px;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h2 { font-weight: 800; font-size: 20px; }

/* ¹Ùµð ·¹À̾ƿô */
.modal-body {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* ÁÂÃø ´ëºÐ·ù */
.side-category {
    width: 200px;
    background: #f9f9f9;
    border-right: 1px solid #eee;
    overflow-y: auto;
    overflow-x: hidden;
}

.side-category ul li a {
    display: block;
    padding: 15px 25px;
    font-size: 15px;
    font-weight: 600;
    color: #666;
}

.side-category ul li.active a {
    background: #fff;
    color: #000;
    font-weight: 800;
}

/* ¿ìÃø ±×¸®µå ¿µ¿ª */
.main-category {
    flex: 1;
    padding: 30px;
    overflow-y: auto;
}

.sub-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.grid-item a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
}

.img-box {
    width: 80px;
    height: 80px;
    background: #f2f2f2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-box img { width: 50%; height: auto; }

.grid-item span { font-size: 13px; font-weight: 500; }


/* ¸ð´Þ ³»ºÎ ½ºÅ©·Ñ ¼³Á¤ */
.modal-body {
    display: flex;
    height: calc(80vh - 60px); /* Çì´õ Á¦¿Ü ³ôÀÌ */
}

.side-category {
    width: 180px;
    background: #f8f8f8;
    overflow-y: auto;
}

.main-category {
    flex: 1;
    overflow-y: scroll; /* ¿ìÃø Àüü ½ºÅ©·Ñ */
    scroll-behavior: smooth;
    padding: 30px;
}

/* ´ëºÐ·ù ŸÀÌƲ */
.cate1-title {
    border-bottom: 2px solid #000;
    padding-bottom: 10px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

/* Áߺзù 2¿­ ±×¸®µå */
.category-2-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2¿­ ¹èÄ¡ */
    gap: 30px 20px;
    margin-bottom: 60px; /* ¼½¼Ç °£ °£°Ý */
}

.cate2-box {
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.cate2-name {
    font-size: 16px;
    font-weight: 800;
    color: #000;
    display: block;
    margin-bottom: 10px;
}

/* ¼ÒºÐ·ù ¸®½ºÆ® */
.cate3-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
}

.cate3-list li a {
    font-size: 13px;
    color: #777;
    white-space: nowrap;
}

.cate3-list li a:hover {
    text-decoration: underline;
    color: #000;
}

/* ¿ÞÂÊ ¸Þ´º È°¼ºÈ­ ½ºÅ¸ÀÏ */
.cate1-item.active {
    background: #fff;
    border-left: 4px solid #000;
}
.cate1-item.active a {
    color: #000;
    font-weight: 800;
}




/* Áߺзù Á¦¸ñ ¹× À̹ÌÁö Á¤·Ä */
.cate2-title-wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 12px;
    text-decoration: none;
}

.cate2-img {
    width: 4rem; /* ¾ÆÀÌÄÜ Å©±â Á¶Àý */
    height: 4rem;
    object-fit: contain;
    background: #f4f4f4; /* À̹ÌÁö ¾øÀ» ¶§ ´ëºñÇÑ ¿¬ÇÑ ¹è°æ */
    border-radius: 4px;
}

.cate2-name {
    font-size: 15px;
    font-weight: 800;
    color: #000;
}

/* ¼ÒºÐ·ù: ¼¼·Î·Î È帣´Â 2¿­ ±×¸®µå */
.cate3-list-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2ÁÙ·Î ³ª´©±â */
    gap: 7px 11px;
}

.cate3-list-grid li a {
    font-size: 13px;
    color: #888;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; /* ±ÛÀÚ°¡ ±æ¸é ... ó¸® */
    line-height: 1.4;
}

.cate3-list-grid li a:hover {
    color: #000;
    text-decoration: underline;
}

/* ¼½¼Ç °£ ±¸ºÐ °­È­ */
.sub-category-group {
    padding-bottom: 40px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 40px;
}

.sub-category-group:last-child {
    border-bottom: none;
}

.cate1-title h3 {
    font-size: 1.5rem;
    font-weight: bold;
    color: #333;
}
/* BASIC css end */