@charset "utf-8";

:root {
	--IDTcolor:#0C61D5;
	--IDTcolor_dark:#1EBB5C;
	--IDTcolor_light:#0bee65;
	--IDTcolor_deep:#055424;
	--menu_color:#555;
	--iptbtnHeight:50px;
	--iptbtnHeight_Higher:60px;

	--FS-xx-small:0.563rem;	/* 9px (xx-small) */
	--FS-x-small:0.625rem;	/* 10px (x-small) */
	--FS-mm-small:0.688rem;	/* 11px - ADD. */
	--FS-m-small:0.750rem;	/* 12px - ADD. */
	--FS-small:0.813rem;	/* 13px (small) */
	--FS-mm-medium:0.875rem;/* 14px - ADD. */
	--FS-m-medium:0.938rem;	/* 15px - ADD. */
	--FS-medium:1.0rem;		/* 16px (medium)*/
	--FS-large:1.125rem;	/* 18px (large) */
	--FS-m-large:1.250rem;	/* 20px - ADD. */
	--FS-mm-large:1.375rem;	/* 22px - ADD. */
	--FS-x-large:1.500rem;	/* 24px (x-large) */
	--FS-xx-large:2.000rem;	/* 32px (xx-large) */
	--FS-big:2.500rem;		/* 40px - ADD. */

    --baseBackground:#FCFCFC;
	--FF:NanumSquareNeo;
	--max-width:1297px;
}

@media screen and (max-width:980px) {
	:root {
		--FS-mm-small:0.563rem;	/* 11 -> 9 */
		--FS-m-small:0.625rem;	/* 12 -> 10 */
		--FS-small:0.688rem;	/* 13 -> 11 */
		--FS-mm-medium:0.750rem;/* 14 -> 12 */
		--FS-m-medium:0.813rem;	/* 15 -> 13 */
		--FS-medium:0.875rem;	/* 16 -> 14 */
		--FS-large:1.0rem;		/* 18 -> 16 */
		--FS-m-large:1.125rem;	/* 20 -> 18 */
		--FS-mm-large:1.250rem;	/* 22 -> 20 */
		--FS-x-large:1.375rem;	/* 24 -> 22 */
		--FS-xx-large:1.500rem;	/* 32 -> 24 */
		--FS-big:2.000rem;		/* 40 -> 32 */

		--round-large:10px;

		--FW900:700;
		--FW800:700;
		--FW700:500;
		--FW600:500;
		--FW500:400;
		}
}

body					{font-family:var(--FF); font-size:medium}

/* LAYOUT */
#WRAP					{/*position:relative;*/ margin:0 auto; width:100%; min-height:100%; background-color:var(--baseBackground);}
#CONTAINER				{margin:0 auto; width:100%; height:100%; min-height:100%; padding:0;}
#CONTENTS				{margin:0px auto; padding:0 0 30px 0;}

HEADER					{position:relative; width:100%; background-color:#FFF; z-index:2;}
HEADER.header_type1		{height:167px;}

NAV						{display:flex; align-items:center; justify-content:space-between; height:56px;}
MAIN					{display:inline-block; margin:0px auto 80px auto; padding:0px; min-height:100%; width:100%;}

@media screen and (max-width:980px) {
	HEADER				{height:56px;}
	HEADER.header_type1	{height:116px;}
	NAV					{height:56px;}
	MAIN				{margin:0px auto !important; padding:0px 0px 50px 0px;}
}

/* WRAPPER */
.wrapper				{margin:0px auto; width:100%; max-width:var(--max-width) !important;}
.contents_inSizeWrap	{width:100%; max-width:var(--max-width) !important;}
.inBox					{width:100%; margin:20px auto 30px auto; box-sizing:border-box;}
.inBox600				{width:100%; margin:30px auto; box-sizing:border-box; max-width:600px;}
.Box					{padding:25px; box-shadow:0 3px 12px 0 rgb(0 0 0 / 5%); border-radius:16px; border:1px solid rgba(0, 0, 0, 0.05); background-color:#FFF;}
.Box.p15				{padding:15px;}
.Box_terraced			{display:flex; flex-direction:column; text-align:left; margin-bottom:8px; padding:35px 25px !important; box-shadow:0px 7px 5px -4px rgb(0 0 0 / 4%); border-bottom:1px solid rgba(0, 0, 0, 0.08); background-color:#FFF;}

@media screen and (max-width:1240px) {
	.contents_inSizeWrap.on	{width:100%;max-width:calc(100% - 310px - 2px) !important;}
}

@media screen and (max-width:980px) {
	.wrapper				{padding:0px 10px;}
	.contents_inSizeWrap	{max-width:100% !important;}
	.contents_inSizeWrap.on	{max-width:100% !important;}
	.Box					{padding:20px;}
	.inBox					{margin:10px auto 30px auto;}
	.inBox600				{width:100%; margin:20px auto; max-width:100%; padding:0px 30px; box-sizing:border-box;}
}


@media screen and (max-width:500px) {
	.Box_terraced			{padding:25px 10px !important;}
}

@media screen and (max-width:320px) {
	.wrapper				{padding:0px 5px;}
}

/******************************************************************************************************************************************
*	Top DatMenu alarm
*******************************************************************************************************************************************/
em.alarm_getnum			{clear:both; position:absolute; margin-top:-8px; margin-left:-7px; display:inline-block; background:var(--IDTcolor); color:#FFF; text-align:center; border-radius:100%; font:10px/18px Roboto; font-weight:700; width:17px; height:17px; letter-spacing:0em; z-index:2}
em.alarm_getnum.white	{clear:both; position:absolute; margin-top:5px; margin-left:-12px; display:inline-block; background:#FFF; color:var(--IDTcolor); text-align:center; border-radius:100%; font:10px/18px Roboto; font-weight:700; width:17px; height:17px; letter-spacing:0em; z-index:2}
em.logged_on			{clear:both; position:absolute; top:8px; right:10px; display:inline-block; background:var(--IDTcolor); color:#FFF; text-align:center; border-radius:3px; font:10px/16px Roboto; font-weight:700; width:17px; height:15px; letter-spacing:0em; z-index:2}


/*******************************************************************************************************************************************
*	HEADER
*******************************************************************************************************************************************/
.TopWRAP					{width:100%; background-color:#FFF; border-bottom: 1px solid #F2F2F2; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
.TopWRAP.on					{position:fixed; top:0px; transition:transform 0.3s ease-in-out 0.1s; z-index:50; -webkit-box-shadow: 0px 15px 15px -8px rgb(0 0 0 / 15%) !important; -moz-box-shadow: 0px 15px 15px -8px rgba(0,0,0,0.15) !important; box-shadow: 0px 15px 15px -8px rgb(0 0 0 / 15%) !important;}
.TopWRAP.on.hideGo			{transform:translateY(-100%);}

HEADER.header_type1 .TopWRAP NAV{height:110px;}

NAV .leftArea				{width:150px;}
NAV .centerArea				{flex-grow:1; margin-right:20px;}
NAV .rightArea				{}

NAV .leftArea H1			{width:90px;}
NAV .leftArea H1 a.logo 	{display:block; width:90px; height:34px; background:url(/order/img/common/logo.png) no-repeat 0 0; background-size:90px auto;}

@media screen and (max-width:980px) {
	HEADER.header_type1 .TopWRAP NAV{height:56px;}

	.TopWRAP					{background-color:#FFFFFF; border-bottom:1px solid #F2F2F2;}
	.TopWRAP.on					{width:100%; background-color:#FFFFFF;}
	.TopWRAP.header_type1			{height:50px !important; background-color:#FFF;}
	.TopWRAP.on.header_type1		{width:100%; background-color:#FFF;}

	NAV .leftArea				{width:50px;}
	NAV .leftArea H1 a.logo		{width:34px; height:34px; background:url(/order/img/common/mlogo.png) no-repeat 0 0; background-size:34px auto;}
	NAV .rightArea				{}
}

/* Product View */
H2							{display:flex; align-items:center; font-size:1rem; font-weight:700; color:#111; letter-spacing:-1px;}
H2 a.backArea				{flex-shrink:0; display:block; width:30px; height:30px; text-align:left; padding:0 10px 0 5px;}
H2 .txtwrap_cut				{flex-grow:1; max-height:40px; word-wrap:break-word; display:block; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis; white-space:pre-wrap;}

/* Data Loading */
.loading		{position:fixed; width:100%; height:100%; text-align:center; top:0; left:0; background-color:#FFF; z-index: 99999;
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE8 */filter:Alpha(Opacity=100); /* IE7 */-moz-opacity:1.0; opacity:1.0; /* etc-browser */;}
.loadingWRAP	{position:absolute; text-align:center; z-index:100; top:25%; left:0; z-index:100; margin:0 auto; width:50%; margin:0 25%;}

/* No Data */
.nodata					{display:flex; align-items:center; justify-content:center; flex-direction:column; width:100%; margin:20px auto;}
.nodata.listType		{padding:70px 0; border-bottom:1px solid #DDD;}
.nodata	i.error			{display:block; width:40px; height:40px; background-image:url("/shop/img/svg/svg_bus_error.svg");}
.nodata	.error_ment		{padding:18px 0; color:var(--mygray); font-size:var(--FS-m-medium); font-weight:600; letter-spacing:-0.03rem}


/*******************************************************************************************************************************************
*	Main Menu : 2022.12.28
*******************************************************************************************************************************************/
.mainMenuWRAP								{margin:0 auto; width:100%; height:56px; line-height:56px; background-color:#FFFFFF; border-top:1px solid #F5F5F5;}

.mainMenu									{display:flex; justify-content:space-between; list-style:none; margin:0; padding:0;}
.mainMenu > li								{text-transform:uppercase; font-family:celmonHG; font-weight:800; letter-spacing:-0.03em; padding:0 5px;}
.mainMenu > li a 							{position:relative; color:var(--menu_color); z-index:0}
.mainMenu > li a:hover						{color:var(--IDTcolor);}
.mainMenu > li a:hover i.menu_icon			{fill:var(--IDTcolor); color:var(--IDTcolor);}
.mainMenu > li.on a							{color:var(--IDTcolor);}

.mainMenu > li a span						{visibility:hidden; position:absolute; left:20%; top:-18px; min-width:85px; height:30px; line-height:30px; padding-left:0; padding:0 10px; border-radius:15px; text-align:center; color:#fff; background-color:#222; opacity:0; transition:opacity 1s; z-index:10; font-size:13px; letter-spacing:-0.5px;}
.mainMenu > li a span::after				{position:absolute; content:''; bottom:-50%; right:10%; transform:translate(-50%, -50%); border-style:solid; border-width:6px; border-color:#222 transparent transparent transparent} 
.mainMenu > li a:hover span					{visibility:visible; opacity:1; z-index:2; transform:translateY(0px);}

.TopWRAP.on.hideGo .mainMenuWRAP			{position:fixed; width:100%; transition:top 0.3s ease-in-out 0.1s; z-index:1; -webkit-box-shadow: 0px 25px 15px -8px rgba(0,0,0,0.05) !important; -moz-box-shadow: 0px 25px 15px -8px rgba(0,0,0,0.05) !important; box-shadow: 0px 25px 15px -8px rgba(0,0,0,0.05) !important;}
.TopWRAP.on.hideGo .mainMenu > li a span			{visibility:hidden; position:absolute; left:0px; top:45px; opacity:0; transition:opacity 1s;}
.TopWRAP.on.hideGo .mainMenu > li a span::after		{bottom:22px; right:10%; transform:translate(-50%, -50%); border-style:solid; border-width:6px; border-color:transparent transparent #222 transparent} 
.TopWRAP.on.hideGo .mainMenu > li a:hover span		{visibility:visible; opacity:1; transform:rotate(-15deg)}


@media screen and (max-width:980px) {
	.mainMenuWRAP							{height:60px; line-height:60px;}
	.mainMenu								{display:grid; grid-template-columns:repeat(6, 1fr); column-gap:10px; margin:10px auto;}
	.mainMenu > li							{padding:0px;}
	.mainMenu > li a span					{display:none;}
	.mainMenu > li a						{display:flex; flex-direction:column; align-items:center; line-height:initial; font-size:var(--FS14);}
	.mainMenu > li a i						{display:flex; margin:0 0 5px 0; width:20px; height:20px;}
	.mainMenu > li a.hvr-underline-from-left		{transform:none; box-shadow:none}
	.mainMenu > li a.hvr-underline-from-left:before	{display:none;}
}


/* Search Area*/
.PCsrchWRAP							{position:relative; max-width:400px;}
.PCsrch								{width:100%; padding:0px 60px 0 20px; height:50px; border-radius:25px; color:#444; font-size:var(); font-weight:600; background:transparent;}
.PCsrch::placeholder				{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px;}
.PCsrch::-webkit-input-placeholder	{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:-2px;}
.PCsrch:-moz-placeholder			{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px;}
.PCsrch::-moz-placeholder			{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px;}
.PCsrch:-ms-input-placeholder		{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:0px;}
.PCsrch::-ms-input-placeholder		{font-size:var(--FS-mm-medium); color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:0px;}
.PCsrch:hover,
.PCsrch:focus						{border-width:2px; border-style:solid; border-color:var(--IDTcolor); -webkit-box-shadow:2px 2px 6px rgba(0, 0, 0, 0.15); box-shadow:2px 2px 6px rgba(0, 0, 0, 0.15);}

.PCsrchWRAP .PCbtn_srch				{position:absolute; top:50%; right:20px; width:20px; height:20px; text-indent:-1000em; padding:0px; background:url('/shop/img/common/icon_common.png') no-repeat 0px -40px; background-size:500px auto; border:0px;
									-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);}
.PCsrchWRAP a.icon					{position:absolute; z-index:9; top:50%; right:45px; width:20px; height:20px; text-indent:-1000em; background:url('/shop/img/common/icon_common.png') no-repeat -20px -40px; background-size:500px auto;
									-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);}
.PCsrchWRAP .icon.close				{opacity:0; -webkit-transition:.3s; transition:.3s;}
#PCsrch.active .icon.close			{opacity:1;}


@media screen and (max-width:980px) {
	.PCsrch								{height:38px; border-radius:19px; font-size:16px; line-height:36px; font-weight:500;}
	.PCsrch::placeholder				{color:#CCC; font-weight:400; letter-spacing:-0.5px;}
	.PCsrch::-webkit-input-placeholder	{color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:-1px;}
	.PCsrch:-moz-placeholder			{color:#CCC; font-weight:400; letter-spacing:-0.5px;}
	.PCsrch::-moz-placeholder			{color:#CCC; font-weight:400; letter-spacing:-0.5px;}
	.PCsrch:-ms-input-placeholder		{color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:0px;}
	.PCsrch::-ms-input-placeholder		{color:#CCC; font-weight:400; letter-spacing:-0.5px; position:relative; top:0px;}
	.PCsrch:hover,
	.PCsrch:focus						{border-width:1px;}

	.PCsrchWRAP .PCbtn_srch				{right:12px;}
	.PCsrchWRAP a.icon					{right:35px;}
}



/* Left Title Path Category */
.txtwrap_cut a i.path_arrow				{position:relative; margin-left:25px;; overflow:hidden;}
.txtwrap_cut a i.path_arrow:before		{content:''; position:absolute; right:-8px; top:50%; display:block; background:#DDD; width:20px; height:20px; margin-top:-9px; border-radius:4px;}
.txtwrap_cut a i.path_arrow:after		{content:''; position:absolute; left:-5px; top:calc(50% - 3px); width:6px; height:6px; border:2px solid #FFF; border-top:none; border-left:none; transform:rotate(45deg); -webkit-transform: rotate(45deg); transition:transform 0.2s;}
.txtwrap_cut a.on i.path_arrow:after	{left:-5px; top:calc(50% - 1px); transform:rotate(225deg); -webkit-transform: rotate(225deg);}

.path_category							{position:fixed; top:80px; right:; left:; bottom:0; width:100%;  box-sizing:border-box; display:none; overflow:hidden; z-index:20;}
.path_category .maskbg					{display:block; width:100%; position:absolute; top:0; right:0; bottom:0; left:0; background-color:#000; opacity:0; transition:opacity 0.4s;}
.path_category ul						{position:absolute; top:0; right:0; left:0; max-height:calc(100vh - 150px); padding:20px 20px; border-radius:0 0 8px 8px; box-sizing:border-box; background-color:var(--baseBackground); overflow:hidden; overflow-y:auto; transform:translateY(-100%); transition:transform 0.4s;}
.path_category ul						{display:flex; flex-wrap:wrap; flex-direction:row; justify-content:start; align-items:auto; align-content:start}
.path_category ul:after					{display: block; content: ""; margin:10px; flex:999 999 auto;}

.path_category ul li					{flex: 0 0 auto; margin:7px 20px;}
.path_category ul li a					{display:block; width:100%; font-size:14px; font-weight:500; line-height:1.5; color:#333; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.path_category.on .maskbg				{opacity:.6;}
.path_category.on ul					{transform:translateY(0);}

@media screen and (max-width:980px) {
	.path_category						{top:50px;}
}


/* If Use Search Page */
.PCsrchWRAP.inSRCHpage				{display:block; margin:0px auto; max-width:80%;}
.PCsrchWRAP.inSRCHpage .PCsrch		{height:60px; border-width:1px; border-color:#CCC; margin:50px auto; border-radius:30px; background-color:#FFF;}
.PCsrchWRAP.inSRCHpage .PCsrch:hover{border-color:var(--IDTcolor);}

.searchPage .searchHeader			{display:flex;}

.searchPage .searchHeader li		{width:50%;}

.searchPage .tab_search				{display:block; position:relative; padding:15px; font-weight:700; color:#777; text-align:center}
.searchPage .tab_search.on			{position:relative; font-weight:700; color:var(--IDTcolor)}
.searchPage .tab_search .bar		{position:absolute; left:0;bottom:0;width:100%; height:2px; background-color:#f4f4f4}
.searchPage .tab_search.on .bar		{height:2px; background-color:var(--IDTcolor)}

.searchPage .searchContent			{display:none; overflow:hidden}
.searchPage .searchContent.on		{display:block}

.searchResult						{padding:20px 0;}
.searchResult li					{position:relative;}
.searchResult li:nth-of-type(1n+4) .rank_num	{color:#222}
.searchResult li .rank_num			{display:inline-block; min-width:20px; margin-right:4px; font-weight:700; font-style:italic; font-size:var(--FS-medium); color:var(--IDTcolor);}
.searchResult li .rank_num::after	{padding-left:1px;content:"."}
.searchResult li a					{display:flex; overflow:hidden; padding:15px 10px; white-space:nowrap; text-overflow:ellipsis}
.searchResult li .keyword			{font-size:var(--FS-medium); line-height:17px; color:#151515}
.searchResult li .category			{margin-left:10px;font-size:11px; line-height:17px; color:#AAA; vertical-align:1px}
.searchResult li .date				{position:absolute; top:50%; right:50px; font-family:Roboto; font-size:12px; line-height:17px; color:#BBB; -webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}
.searchResult li .btn_del			{position:absolute; top:6px; right:5px; width:20px; height:20px; border:0; font-size:0; z-index:10}
.searchResult .no_data				{padding-top:70px;text-align:center;font-size:14px;color:#959da6;}

/* Right Area */
.GBM							{display:flex; flex-direction:row; justify-content:space-between; list-style:none; margin:0; padding:0;}
.GBM li							{position:relative; flex: 0 0 auto; margin-right:38px;}
.GBM li:last-child				{margin-right:0px;}

.GBM i.svg_icon.location		{width:26px; height:26px; position:relative;}

.GBM li > a						{display:block;}
.GBM li > a span				{visibility:hidden; min-width:85px; height:30px; line-height:30px; padding-left:0; padding:0 10px; border-radius:15px; text-align:center; color:#fff; background-color:#000; opacity:0; transition:opacity 1s; z-index:10; position:absolute; left:50%; top:25px; transform:translate(-50%, 40%); font-size:var(--FS-small); font-weight:600; letter-spacing:-0.5px; box-sizing:border-box;}
.GBM li > a span::after			{position:absolute; content:''; top:-4px; left:50%; transform:translate(-50%, -50%); border-style:solid; border-width:6px; border-color:transparent transparent #000 transparent} 
.GBM li > a:hover span			{visibility:visible; opacity:1;}

.GBM li:last-child > a span		{right:-55px !important; left:auto; top:25px; transform:translate(-50px, 40%);}				
.GBM li:last-child > a span::after	{position:absolute; content:''; top:-4px; left:auto; right:5px; transform:translate(-5px, -50%); border-style:solid; border-width:6px; border-color:transparent transparent #000 transparent} 

@media screen and (max-width:980px) {
	.GBM li						{margin-right:24px;}
}

/* View & Disappearance Animation (Only My Location) : 2024.01.26 */
.GBM li > a span.VDA			{visibility:hidden; opacity:0; transition: opacity 1s ease, visibility 1s ease; min-width:200px;}
.GBM li > a span.VDA .adrs_ellip{max-width:300px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.GBM li > a span.show-on-load	{visibility:visible; opacity:1; transition: opacity 1s ease;}
.GBM li > a:hover span.VDA		{visibility:visible; opacity:1;}


/* Recently Viewed Product */
.recently_viewed		{position:relative; width:24px; height:24px; overflow:hidden; border:2px solid #444; border-radius:4px;}
.recently_viewed img	{position:absolute; width:auto; height:24px; top:50%; left:50%; transform:translate(-50%, -50%);}

@media screen and (max-width:980px) {
	.recently_viewed		{width:22px; height:22px;}
	.recently_viewed img	{width:auto; height:22px;}
}

/*******************************************************************************************************************************************
*	Global Slide Menu
*******************************************************************************************************************************************/
.GSM								{position:fixed; top:0; bottom:0; padding:20px 20px; right:-350px; width:100%; max-width:350px; overflow-y:auto; transition:all .2s ease-in-out 0s; -webkit-transition:all .2s ease-in-out 0s; -moz-transition:all .2s ease-in-out 0s; z-index:9999;}
.GSM.on								{right:0; background:#FFF; text-align:left; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:Alpha(Opacity=100); -moz-opacity:1.0; opacity:1.0;}
.GSM.on ~ .dim						{display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.75); z-index:999;} /* GSM 활성화되었을 때 */
.GSM .btn_close						{position:absolute; filter:Alpha(Opacity=0); -moz-opacity:0; opacity:0; left: -252px;}
.GSM.on .btn_close					{position:absolute; top:20px; left:-42px; width:25px; height:25px; cursor:pointer; filter:Alpha(Opacity=100); -moz-opacity:1.0; opacity:1.0; z-index:9;}

.GSM.on .btn_close i.cssIcon				{position:fixed;}
.GSM.on .btn_close i.cssIcon.x:before		{background:#FFF; height:28px; width:2px; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}
.GSM.on .btn_close i.cssIcon.x:after		{background:#FFF; height:28px; width:2px; -moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}


@media screen and (max-width:500px) {
	.GSM								{right:-300px; max-width:300px;}
}

@media screen and (max-width:350px) {
	.GSM								{right:-280px; max-width:260px;}
}

/* GSM header */
.GSM .headerGSM							{display:inline-block; width:100%; margin:0px auto 0px auto; text-align:center; box-sizing:border-box}

.GSM .headerGSM	.loggedArea				{display:flex; align-items:center; justify-content:space-between; margin-bottom:20px;}
.GSM .headerGSM	.loggedArea .greeting	{font-size:0.875rem; font-weight:700; color:#111; letter-spacing:-1px;}
.GSM .headerGSM	.loggedArea .setico a	{padding-left:15px;}

.GSM .headerGSM li					{float:left; width:50%; text-align:left; box-sizing:border-box;}
.GSM .headerGSM li:last-child		{float:right; text-align:right;}
.GSM .headerGSM li a				{display:inline-block; width:calc(100% - 5px); border-radius:4px; padding:0px 10px; font-size:var(--FS-medium); font-weight:700; height:40px; line-height:40px; letter-spacing:-1.3px; text-align:center; vertical-align:middle; cursor:pointer; text-decoration:none;}
.GSM .headerGSM li a::after			{display:inline-block; content: "";} /* Because IE */

.GSM .headerGSM li a:hover			{-webkit-transition:.3s ease-out; -moz-transition:.3s ease-out; -o-transition:.3s ease-out; -ms-transition:.3s ease-out; transition:.3s ease-out; transform:translateY(-5px);}
.GSM .headerGSM li a.btnfull		{background:var(--IDTcolor) !important; border:1px solid var(--IDTcolor); color:#FFFFFF !important; text-decoration:none;}
.GSM .headerGSM li a.btnstroke		{background:#FFFFFF !important; border:1px solid var(--IDTcolor); color:var(--IDTcolor) !important; text-decoration:none;}

/* GSM mypage */
.GSM .mypageGSM						{display:grid; grid-template-columns:repeat(3, 1fr); gap:20%; margin-top:20px; width:100%; padding:18px 10px; border-top:1px solid #EAEAEA; border-bottom:1px solid #EAEAEA;}
.GSM .mypageGSM li					{display:flex; flex-direction:column; align-items:center; justify-content:flex-start; position:relative;}
.GSM .mypageGSM li:after			{position:absolute; content:""; top:0px; right:-50%; width:1px; height:100%; background-color:#F1F1F1;}
.GSM .mypageGSM li:last-child:after	{display:none;}

.GSM .mypageGSM .svg_iconBox		{height:24px;}
.GSM .mypageGSM .svgicon_txt		{font-size:var(--FS-small); color:#666; margin-top:10px;}

.GSM .mypageGSM .count_num			{font-size:vr(--FS-large); font-weight:700; color:var(--IDTcolor); letter-spacing:-0.03em; margin-top:8px;}
.GSM .mypageGSM i					{color:#666; width:20px !important; height:20px !important; text-align:center;}
.GSM .mypageGSM i.size24			{width:24px !important; height:24px !important;}


/* GSM Menu */
.GSM .GSM_list								{display:inline-block; width:100%; margin:15px 0px; text-align:left;}
.GSM .GSM_list li.depth1					{font-size:var(--FS-m-medium); padding:12px 12px; border-bottom:1px solid #EEE;}
.GSM .GSM_list li.depth1:first-child		{margin-top:0;}
.GSM .GSM_list li.depth1 a					{display:block; text-transform:uppercase; font-family:celmonHG; font-size:var(--FS-medium); font-weight:800; letter-spacing:0em; color:#444;}
.GSM .GSM_list li.depth1 a.current,
.GSM .GSM_list li.depth1 a:hover,
.GSM .GSM_list li.depth1 a:focus,
.GSM .GSM_list li.depth1 a:active			{color:var(--IDTcolor);}

.GSM .GSM_list li.depth1 em					{position:relative; float:right;}
.GSM .GSM_list li.depth1 em:after			{content:''; clear:both; position:absolute; transition:all 0.2s; top:5px; right:5px; width:9px; height:9px; border:2px solid #555; border-top:none; border-right:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';}
.GSM .GSM_list li.depth1.active em:after	{transform:rotate(135deg); top:10px; border:2px solid var(--IDTcolor); border-top:none; border-right:none;}

.GSM .GSM_list .depth1 ul.depth2			{margin:10px 0; padding:5px 10px; border:1px solid #EEE; border-radius:2px;}
.GSM .GSM_list .depth1 ul.depth2 li 		{width:calc(50% - 10px);  padding:5px 5px; display:inline-block;}
.GSM .GSM_list .depth1 ul.depth2 li a 		{font-family:Pretendard; font-size:13px !important; line-height:20px !important; color:#777 !important;}
.GSM .GSM_list .depth1 ul.depth2 li a:hover	{text-decoration:underline;}

/* GSM Add Menu */
.GSM .ADD_list						{display:inline-block; margin:20px auto; width:100%;}
.GSM .ADD_list li					{padding:14px 12px; border-bottom:1px solid #EEE;}
.GSM .ADD_list li a					{display:block; font-size:var(--FS-m-medium); font-weight:700; letter-spacing:-0.03em;}
.GSM .ADD_list li:hover				{-webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;}
.GSM .ADD_list li em				{position:relative; float:right;}
.GSM .ADD_list li em:after			{content:''; clear:both; position:absolute; transition:all 0.2s; top:5px; right:5px; width:9px; height:9px; border:2px solid #999; border-top:none; border-right:none; -webkit-transform:rotate(225deg); transform:rotate(225deg); content:'';}



/* GSM Type2 (주소, 배송주소록,) */
.GSM2								{position:fixed; top:0; bottom:0; padding:20px 20px; right:-500px; width:40%; max-width:500px; overflow-y:auto; transition:all .3s ease-in-out 0s; -webkit-transition:all .3s ease-in-out 0s; -moz-transition:all .3s ease-in-out 0s; z-index:4;}
.GSM2.on							{right:0; background:#FFF; text-align:left; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:Alpha(Opacity=100); -moz-opacity:1.0; opacity:1.0;}
.GSM2.on ~ .dim						{display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.75); z-index:2;} /* GSM 활성화되었을 때 */
.GSM2 .btn_close					{position:absolute; display:inline-block; width:25px; height:25px; top:14px; right:9px; cursor:pointer;}

@media screen and (max-width:980px) {
.GSM2								{width:100%;}
}

/* Right Layer Header Area */
.GSM2 .headerGSM2								{position:relative; border-bottom:1px solid #DDD}
.GSM2 .headerGSM2:before						{content: ""; position:absolute; left:0; bottom:0; z-index:2; width:100%; /*height:1px; background:rgba(0,0,0,0.15);*/}
.GSM2 .headerGSM2 button.btn_right_close		{display:block; position:absolute; right:0px; top:10px; z-index:1; width:34px; height:35px; border:2px solid #fff; background:rgba(0, 0, 0, 0.4); border-radius:100%;}
.GSM2 .headerGSM2 button.btn_right_close:before,
.GSM2 .headerGSM2 button.btn_right_close:after	{content: ""; position:absolute; left:7px; top:14px; width:16px; height:2px; background:#fff;}
.GSM2 .headerGSM2 button.btn_right_close:before	{transform:rotate(135deg);}
.GSM2 .headerGSM2 button.btn_right_close:after	{transform:rotate(45deg);}
.GSM2 .headerGSM2 button.btn_right_close:hover	{background:rgba(0, 0, 0, 0.7);}
.GSM2 .headerGSM2 H5							{font-size:1.125rem; font-weight:600; line-height:55px; color:#111; margin:0px;}

/* Right Layer Detail View */
.GSM2 .detailGSM2								{display:none;}
.GSM2.on .detailGSM2							{display:block; padding:0 0 20px 0; margin-bottom:50px;}
.GSM2 .detailGSM2 > ul							{padding:0px;}
.GSM2 .detailGSM2 > ul > li						{position:relative; padding:16px 0 15px 120px; border-bottom:1px solid #EEE;}
.GSM2 .detailGSM2 > ul > li strong				{position:absolute; left:13px; top:16px; color:#222;}
.GSM2 .detailGSM2 > ul > li span				{padding-right:2px; vertical-align:1px; color:#777;}
.GSM2 .detailGSM2 > ul > li span.bcount a		{color:#F58220; font-weight:bold;}
.GSM2 .detailGSM2 > ul img						{width:100%;}


/*******************************************************************************************************************************************
*	Slide Contents Menu - Only Mobile
*******************************************************************************************************************************************/
.SCM								{position:fixed; top:0; bottom:0; padding:0px; right:-350px; width:30%; max-width:350px; overflow-y:auto; transition:all .3s ease-in-out 0s; -webkit-transition:all .3s ease-in-out 0s; -moz-transition:all .3s ease-in-out 0s; z-index:9999;}
.SCM.on								{right:0; background:#F5F5F5; text-align:left; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:Alpha(Opacity=100); -moz-opacity:1.0; opacity:1.0;}
.SCM.on ~ .dim						{display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.75); z-index:999;} /* SCM 활성화되었을 때 */
.SCM .btn_close						{position:absolute; display:inline-block; width:25px; height:25px; top:14px; right:9px; cursor:pointer;}

@media screen and (max-width:980px) {
.SCM								{width:80%;}
}

.SCM H3			{text-align:center; width:100%; font-size:15px; line-height:48px !important; font-weight:700; color:#111; text-transform:uppercase; letter-spacing:-1px; background:#FFFFFF; border-top:1px solid #EEE; border-bottom:1px solid #EEE;}  /* Page Title */
.SCM H3	.CICC	{margin:12px 0 0 10px;}


.setmenu 					{display:inline-block; width:100%; margin:10px auto 0px auto;}
.setmenu li					{background-color:#FFFFFF; font-size:13px; padding:12px 12px; border-bottom:1px solid #EEE; font-weight:500; letter-spacing:-1px; color:#444;}
.setmenu li a				{display:block; color:#444;}
.setmenu li em				{position:relative; float:right; top:3px}
.setmenu li em:after		{content:''; clear:both; position:absolute; transition:all 0.2s; top:5px; right:5px; width:9px; height:9px; border:2px solid #999; border-top:none; border-right:none; -webkit-transform:rotate(225deg); transform:rotate(225deg);}
.setmenu li input[type="checkbox"]	{position:relative; float:right; top:-3px}

/*******************************************************************************************************************************************
* Head Line - 2019.07.12 : FUNNY
*******************************************************************************************************************************************/
/* H1 is LOGO */
.maintitWRAP				{display:inline-block; margin:0px auto 0px auto; width:100%; text-align:left;}
.maintitWRAP H1				{font-size:20px; font-weight:500; letter-spacing:-1.2px; color:#424242; text-align:left; margin-bottom:0;}
.maintitWRAP H1	a			{color:#424242;}
.actLine					{float:left; width:50px; text-align:left; height:0px; margin:10px auto 15px auto; border-top:1px solid #cecece; line-height:0; -webkit-transition: width 0.3s ease; -moz-transition: width 0.3s ease; transition: width 0.3s ease;}
.maintitWRAP:hover .actLine {width:150px; border-top:1px solid var(--IDTcolor); -webkit-transition: width 0.3s ease; -moz-transition: width 0.3s ease;transition: width 0.3s ease;}


H5				{font-size:22px; line-height:40px; color:#4d5758; letter-spacing:-1px; margin-bottom:15px;} /* Page Sub Title */
H6				{font-size:16px; line-height:20px; font-weight:500; color:#333; text-transform:uppercase; letter-spacing:-1.5px; margin:20px auto 5px auto;} /* Order Detail Title */
H6:after		{content:'●'; float:left; margin-right:5px; font-size:10px; color:#333;}

H8				{font-size:18px; font-weight:700; line-height:50px; color:#222; letter-spacing:-1px;} /* Page Section Title */

@media screen and (max-width:980px) {
	.maintitWRAP				{margin:0px auto; width:100%; text-align:center; padding:14px 5px;}
	.maintitWRAP H1				{font-size:17px; font-weight:500; letter-spacing:-1.2px; color:#000; text-align:left; margin-bottom:0;}
	.actLine					{display:none;}

}

@media screen and (max-width:500px) {
.maintitWRAP				{margin:0px auto; width:100%; text-align:center; padding:16px 5px 10px 5px;}
.maintitWRAP H1				{font-size:17px; font-weight:500; letter-spacing:-1.2px; color:#111; text-align:center; margin-bottom:0;}
}


/*************************************************************************************************************************
*	FOOTER : Last 2023.11.10
**************************************************************************************************************************/
/* SNS (footer와 상품상세의 공유하기와 연동) */
.sns						{display:flex; width:100%; margin:0 auto 15px auto; flex-wrap:wrap; flex-direction:row; justify-content:center; align-content:start;}
.footInfoWrap .sns			{display:flex; justify-content:flex-start; margin:15px auto 0px;}
.footInfoWrap .sns li		{margin:0 4px 0 0;}
.sns li						{flex:0 0 auto; margin:7px;}
.sns li:first-child			{margin-left:0px;}
.sns li a					{overflow:hidden; display:block; width:38px; height:38px; font-size:0px;}
.sns li a.instagram			{background:url('/shop/img/common/btn_sns.png') no-repeat 0px 0px;}
.sns li a.instagram:hover	{background-position:0px -38px;}
.sns li a.facebook			{background:url('/shop/img/common/btn_sns.png') no-repeat -38px 0px;}
.sns li a.facebook:hover	{background-position:-38px -38px;}
.sns li a.twitter			{background:url('/shop/img/common/btn_sns.png') no-repeat -76px 0px;}
.sns li a.twitter:hover		{background-position:-76px -38px;}
.sns li a.blog				{background:url('/shop/img/common/btn_sns.png') no-repeat -114px 0px;}
.sns li a.blog:hover		{background-position:-114px -38px;}
.sns li a.kakaotalk			{background:url('/shop/img/common/btn_sns.png') no-repeat -342px 0px;}
.sns li a.kakaotalk:hover	{background-position:-342px -38px;}
.sns li a.kakaostory		{background:url('/shop/img/common/btn_sns.png') no-repeat -152px 0px;}
.sns li a.kakaostory:hover	{background-position:-152px -38px;}
.sns li a.youtube			{background:url('/shop/img/common/btn_sns.png') no-repeat -190px 0px;}
.sns li a.youtube:hover		{background-position:-190px -38px;}
.sns li a.cafe				{background:url('/shop/img/common/btn_sns.png') no-repeat -228px 0px;}
.sns li a.cafe:hover		{background-position:-228px -38px;}
.sns li a.band				{background:url('/shop/img/common/btn_sns.png') no-repeat -380px 0px;}
.sns li a.band:hover		{background-position:-380px -38px;}
.sns li a.google			{background:url('/shop/img/common/btn_sns.png') no-repeat -418px 0px;}
.sns li a.google:hover		{background-position:-418px -38px;}

FOOTER					{width:100%; margin:0px auto 0px auto;}

/* Bottom Fixed Menu */
.BFM					{display:none;}

@media screen and (max-width:980px)		{
	.BFM				{display:flex; text-align:center; margin:0px auto;}
	.BFM ul				{position:fixed; bottom:0px; width:100%; height:60px; padding:0 10px; transition:top 0.3s ease-in-out 0.1s; border-top:1px solid #EDEDED; z-index:1; display:flex; flex-wrap:wrap; flex-direction:row; justify-content:space-between; align-items:center; align-content:center; background:#FFF;}
	.BFM li				{position:relative; flex: 0 0 auto; margin:0px 10px;}
	.BFM li a			{display:block;}
	.BFM li i			{width:20px !important; height:20px !important; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}

	/* TOP with View & Disappearance Animation (Only My Location) : 2024.01.29 */
	.BFM li > a						{display:block;}
	.BFM li > a span				{visibility:hidden; min-width:85px; height:30px; line-height:30px; padding-left:0; padding:0 10px; border-radius:15px; text-align:center; color:#fff; background-color:#000; opacity:0; transition:opacity 1s; z-index:10; position:absolute; left:-10px; bottom:40px; transform:translate(0%, 40%); font-size:var(--FS-small); font-weight:600; letter-spacing:-0.5px; box-sizing:border-box;}
	.BFM li > a span::after			{position:absolute; content:''; bottom:-11px; left:14px; border-style:solid; border-width:6px; border-color:#000 transparent transparent transparent } 
	.BFM li > a:hover span			{visibility:visible; opacity:1;}

	.BFM li > a span.VDA			{visibility:hidden; opacity:0; transition: opacity 1s ease, visibility 1s ease; min-width:200px;}
	.BFM li > a span.VDA .adrs_ellip{max-width:300px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
	.BFM li > a span.show-on-load	{visibility:visible; opacity:1; transition: opacity 1s ease;}
	.BFM li > a:hover span.VDA		{visibility:visible; opacity:1;}
}

/* Responsive Swiper Tab */
.gnbBottom									{width:100%; border-top:1px solid #E4E4E4; border-bottom:1px solid #E4E4E4; background-color:#FFF;}

.SW_footTabMenu								{display:flex; align-items:center; width:100%; padding:0px; position:relative; margin:0px auto;}
.SW_footTabMenu:after						{clear:both; display:block; content:"";}
.SW_footTabMenu li.swiper-slide				{width:auto !important;} /* flex 일정간격 원할시 본 라인 주석 */
.SW_footTabMenu .swiper-button-prev, 
.SW_footTabMenu .swiper-button-next			{margin:0px !important; opacity:0; top:0px; height:100% !important; cursor:pointer; outline:none; z-index:100;
											-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.SW_footTabMenu .swiper-button-prev			{left:0px; background-size:auto !important; background-image:linear-gradient(to left, rgba(255, 255, 255, 0), #FFFFFF 50%); background:-webkit-linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%);}
.SW_footTabMenu .swiper-button-prev:after	{position:absolute; top:calc(50% - 8px) !important; left:7px; width:15px; height:15px; border:2px solid #000; border-top:none; border-left:none; -webkit-transform:rotate(135deg); transform:rotate(135deg); -moz-transform:rotate(135deg); content:'';}

.SW_footTabMenu .swiper-button-next			{right:0px; background-size:auto !important; background-image:linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%); background:-webkit-linear-gradient(to left, #FFF, rgba(255, 255, 255, 0), #FFFFFF 50%);}
.SW_footTabMenu .swiper-button-next:after	{position:absolute; top:calc(50% - 8px) !important; right:7px; width:15px; height:15px; border:2px solid #000; border-top:none; border-left:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -moz-transform:rotate(-45deg); content:'';}

.SW_footTabMenu:hover .swiper-button-prev	{opacity:0.5;}
.SW_footTabMenu:hover .swiper-button-next	{opacity:0.5;}
.SW_footTabMenu .swiper-button-prev:hover,
.SW_footTabMenu .swiper-button-next:hover	{opacity:1; overflow:visible !important;}

.SW_footTabMenu .swiper-button-prev.swiper-button-disabled	{opacity:0 !important;}
.SW_footTabMenu .swiper-button-next.swiper-button-disabled	{opacity:0 !important;}

.SW_footTabMenu li[role=group]					{position:relative; display:inline-block; line-height:56px;}
.SW_footTabMenu li[role=group]:after			{content:""; display:inline-block; width:1px; height:11px; background:#E4E4E4; vertical-align:-1px; margin:0 20px;}
.SW_footTabMenu li[role=group]:last-child::after{background:none; margin:0px;}
.SW_footTabMenu li[role=group]>a				{text-align:left; font-size:var(--FS-small); font-weight:600; color:#777; letter-spacing:-1.2px;}

.SW_footTabMenu li[role=group]>a:focus,
.SW_footTabMenu li[role=group]>a:hover			{color:#222}
.SW_footTabMenu li[role=group]>a:hover>span		{display:inline-block; border-bottom:2px solid #888;}
.SW_footTabMenu li[role=group].selected			{border-bottom:none}
.SW_footTabMenu li[role=group].selected>a		{color:var(--IDTcolor);}
.SW_footTabMenu li[role=group].selected>a span	{display:inline-block; border-width:0 0 2px 0; border-style:solid; border-bottom:2px solid var(--IDTcolor);}

a.familysysBtn								{text-align:center; font-size:var(--FS13) !important; font-weight:600;  padding:6px 10px; color:#FFF !important; border-radius:20px;}
a.familysysBtn.seller						{background-color:var(--IDTcolor);}
a.familysysBtn.order						{background-color:var(--mygray);}

@media screen and (max-width:980px) {
	.SW_footTabMenu							{height:auto; text-align:center; padding:0px 10px; z-index:0;}
	.SW_footTabMenu li[role=group]			{line-height:40px;}
	.SW_footTabMenu li[role=group]:after	{margin:0 10px;}
	.sellsystemBTN a						{font-size:12px; line-height:20px; padding:3px 5px;}
}

/* Site Information */
.footInfoWrap					{display:flex; width:100%; padding:40px 0; font-size:var(--FS-m-small); color:#888; letter-spacing:-0.06em; line-height:1.75;}
.footInfoWrap em				{letter-spacing:0em;}

.hiddenFootInfo					{display:flex; align-items:flex-start; justify-content:space-between;}
.hiddenFootInfo.on				{display:flex !important;}

.footInfoWrap .footinfo			{display:flex; flex-direction:column; align-items:flex-start; width:45% !important;}
.footInfoWrap .footgap			{display:flex; width:10% !important;}
.footInfoWrap .footcscenter		{display:flex; flex-direction:column; align-items:flex-start; width:45% !important;}

.fgapline						{display:inline-block; width:1px; height:150px; text-align:center; background:#ECECEC; margin-left:50%;}
.footInfoWrap H8				{font-family:var(--FFH); font-size:var(--FS-medium); font-weight:700; color:#444; margin-bottom:20px; line-height:1.2; font-style:normal; letter-spacing:-0.03em;}

@media screen and (max-width:980px) {
	.footInfoWrap				{padding:0px;}
	.footInfoWrap .footinfo		{width:100% !important; margin-top:10px; margin-bottom:30px;}
	.footInfoWrap .footcscenter	{width:100% !important; padding-bottom:20px;}
	.footInfoWrap .footgap		{display:none;}
	.footInfoWrap .fgapline		{display:none;}

	.hiddenFootInfo				{display:none}
	.hiddenFootInfo.on			{display:flex; flex-direction:column;}
	.footInfoWrap H8			{margin-bottom:10px;}
}

address							{width:100%;}
address li						{display:inline-block; margin-right:10px;}
address li a					{font-weight:600;}
a.csTelNum						{font-size:var(--FS-large); font-weight:900; margin:13px 0;}

/* If Minimum Site Information Button View */
.see_infocenter					{display:none;}

@media screen and (max-width:980px) {
	.see_infocenter				{display:flex; height:40px; position:relative; margin:0 auto; padding:0px; font-size:var(--FS-small); font-weight:600; line-height:40px; color:#888; letter-spacing:-1px;}
	.see_infocenter:after		{content:''; clear:both; position:absolute; transition: all 0.4s; top:13px; right:5px; width:9px; height:9px; border:2px solid #888; border-top:none; border-right:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
	.see_infocenter.on:after	{transform:rotate(135deg); top:18px;}
}

/* Copyright */
.copyright					{padding:30px 0; border-top:1px solid #ECECEC; color:var(--mygray002); font-size:var(--FS-mm-small); line-height:1.5; font-weight:600; letter-spacing:-1px; background-color:#111;}
.copyright .wrapper			{display:flex; flex-direction:column;}
.copyright em				{font-family:var(--FFH); font-weight:800; letter-spacing:0px; margin-top:10px; text-transform:uppercase; color:var(--mygray);}
@media screen and (max-width:980px) {
	.copyright 				{padding:20px 0px 80px 0px;}
}


/*******************************************************************************************************************************************
* Top tab menu inside content : 2023.01.02
*******************************************************************************************************************************************/
.incntTabmenu ul				{display:flex; align-items:center; justify-content:center; width:100%; padding:0px; position:relative; margin:0px auto;}
.incntTabmenu ul li				{margin:0px 6px; width:auto !important;}
.incntTabmenu ul li a			{display:flex; align-items:center; padding:10px 15px; font-weight:700; font-size:0.875rem; border:1px solid #d7d7d7; border-radius:25px;}
.incntTabmenu ul li a.on		{color:#FFF; background-color:var(--IDTcolor); border:1px solid var(--IDTcolor); }

@media screen and (max-width:500px) {
	.incntTabmenu ul			{justify-content:flex-start}
}


/* Responsive Swiper Tab */
.gnbBottom									{width:100%; border-top:1px solid #E4E4E4; border-bottom:1px solid #E4E4E4; background-color:#FFF;}

.SW_footTabMenu								{display:flex; align-items:center; width:100%; padding:0px; position:relative; margin:0px auto;}
.SW_footTabMenu:after						{clear:both; display:block; content:"";}
.SW_footTabMenu li.swiper-slide				{width:auto !important;} /* flex 일정간격 원할시 본 라인 주석 */
.SW_footTabMenu .swiper-button-prev, 
.SW_footTabMenu .swiper-button-next			{margin:0px !important; opacity:0; top:0px; height:100% !important; cursor:pointer; outline:none; z-index:100;
											-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.SW_footTabMenu .swiper-button-prev			{left:0px; background-size:auto !important; background-image:linear-gradient(to left, rgba(255, 255, 255, 0), #FFFFFF 50%); background:-webkit-linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%);}
.SW_footTabMenu .swiper-button-prev:after	{position:absolute; top:calc(50% - 8px) !important; left:7px; width:15px; height:15px; border:2px solid #000; border-top:none; border-left:none; -webkit-transform:rotate(135deg); transform:rotate(135deg); -moz-transform:rotate(135deg); content:'';}

.SW_footTabMenu .swiper-button-next			{right:0px; background-size:auto !important; background-image:linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%); background:-webkit-linear-gradient(to left, #FFF, rgba(255, 255, 255, 0), #FFFFFF 50%);}
.SW_footTabMenu .swiper-button-next:after	{position:absolute; top:calc(50% - 8px) !important; right:7px; width:15px; height:15px; border:2px solid #000; border-top:none; border-left:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -moz-transform:rotate(-45deg); content:'';}

.SW_footTabMenu:hover .swiper-button-prev	{opacity:0.5;}
.SW_footTabMenu:hover .swiper-button-next	{opacity:0.5;}
.SW_footTabMenu .swiper-button-prev:hover,
.SW_footTabMenu .swiper-button-next:hover	{opacity:1; overflow:visible !important;}

.SW_footTabMenu .swiper-button-prev.swiper-button-disabled	{opacity:0 !important;}
.SW_footTabMenu .swiper-button-next.swiper-button-disabled	{opacity:0 !important;}

.SW_footTabMenu li[role=group]					{position:relative; display:inline-block; line-height:56px;}
.SW_footTabMenu li[role=group]:after			{content:""; display:inline-block; width:1px; height:11px; background:#E4E4E4; vertical-align:-1px; margin:0 20px;}
.SW_footTabMenu li[role=group]:last-child::after{background:none; margin:0px;}
.SW_footTabMenu li[role=group]>a				{text-align:left; font-size:var(--FS-small); font-weight:600; color:#777; letter-spacing:-1.2px;}

.SW_footTabMenu li[role=group]>a:focus,
.SW_footTabMenu li[role=group]>a:hover			{color:#222}
.SW_footTabMenu li[role=group]>a:hover>span		{display:inline-block; border-bottom:2px solid #888;}
.SW_footTabMenu li[role=group].selected			{border-bottom:none}
.SW_footTabMenu li[role=group].selected>a		{color:var(--IDTcolor);}
.SW_footTabMenu li[role=group].selected>a span	{display:inline-block; border-width:0 0 2px 0; border-style:solid; border-bottom:2px solid var(--IDTcolor);}

a.familysysBtn								{text-align:center; font-size:var(--FS13) !important; font-weight:600;  padding:6px 10px; color:#FFF !important; border-radius:20px;}
a.familysysBtn.seller						{background-color:var(--IDTcolor);}
a.familysysBtn.order						{background-color:var(--mygray);}

@media screen and (max-width:980px) {
	.SW_footTabMenu							{height:auto; text-align:center; padding:0px 10px; z-index:0;}
	.SW_footTabMenu li[role=group]			{line-height:40px;}
	.SW_footTabMenu li[role=group]:after	{margin:0 10px;}
	.sellsystemBTN a						{font-size:12px; line-height:20px; padding:3px 5px;}
}








/* COL TABLE */
.simcolBL						{width:100%; text-align:center; border-top:1px solid #BBB; border-collapse:collapse; padding:0px; border-spacing:0px;}
.simcolBL caption				{display:none;}
.simcolBL thead	th				{background:linear-gradient(to bottom,#FFFFFF 50%,#F4F4F4 50%); border:1px solid #D8D8D8; margin-bottom:3px; color:#757575; font-size:12px; line-height:34px; font-weight:500; letter-spacing:-0.10em; text-align:center;}

.simcolBL tbody th				{text-align:left; font-size:var(--FS-mm-medium); line-height:18px; font-weight:500; letter-spacing:-0.06em; color:#60666f; border-bottom:1px solid #e5e5e5; border-right:1px solid #EDEDED; padding:10px; background-color:#f5f7f9;}
.simcolBL tbody th:first-child	{border-left:none;}
.simcolBL tbody th.col2			{text-align:center; font-size:12px; color:#60666f; border-bottom:1px solid #e5e5e5; border-right:1px solid #EDEDED; border-left:1px solid #e5e5e5; padding:12px 15px; background-color:#f5f7f9;}
.simcolBL tbody td				{text-align:left; background:#FFF; font-size:var(--FS-mm-medium); line-height:20px; padding:10px 15px; border-bottom:1px solid #e5e5e5; color:#87949c; border-right:none;}
.simcolBL tbody td:first-child	{border-left:none;}
.simcolBL tbody td ul			{padding:3px 8px;}
.simcolBL tbody td li			{list-style-type:disc; font-size:12px; line-height:20px; color:#898989; letter-spacing:-1px;}
.simcolBL tbody td a:hover		{color:var(--IDTcolor); display:inline-block;}
.simcolBL tbody td img.pdimg	{display:block; width:100px;}
.simcolBL tbody td .emph		{display:block; padding:19px 0 12px; color:var(--IDTcolor)}

/* No Board COL TABLE */
.nobrdBL						{width:100%; text-align:center; border-top:1px solid #EDEDED; border-collapse:collapse; padding:0px; border-spacing:0px;}
.nobrdBL caption				{display:none;}
.nobrdBL tbody th				{text-align:left; font-size:12px; line-height:18px; font-weight:500; color:#60666f; border-right:1px solid #EDEDED; border-bottom:1px solid #EDEDED; padding:10px;}
.nobrdBL tbody td				{text-align:left; background:#FFF; font-size:12px; line-height:20px; padding:10px 15px; color:#87949c; border-bottom:1px solid #EDEDED;}


/* justify Border List */
.justBL							{width:100%; border:1px solid #DDD;}
.justBL	ul						{display:flex; flex-direction:column; padding:0px; font-size:var(--FS-mm-medium); font-weight:600;}
.justBL	ul li					{display:flex; justify-content:space-between; width:100%; padding:15px 15px; border-bottom:1px solid #DDD;}
.justBL	ul li:last-child		{border-bottom:none;}


/*******************************************************************************************************************************************
* Contents Page Bottom Description - 2016.10.20 : FUNNNY
*******************************************************************************************************************************************/
.page_description		{font-size:11px; line-height:14px; letter-spacing:-0.1em; margin:10px; padding:10px; position:relative;z-index:2; color:#959595; text-align:left; text-shadow:1px 1px 1px #FFF; !important;}
.page_description em	{color:#666;}
.page_description strong{font-size:12px; line-height:25px; font-weight:500; color:#1e252d; margin-left:-15px;}
.page_description ul	{list-style-position:outside; margin:0; padding:0; word-break:break-all;}
.page_description li	{list-style-type:disc; margin-bottom:0.3em;}


/*******************************************************************************************************************************************
* Help Ment Txt - 2019.04.18 : FUNNY
*******************************************************************************************************************************************/
.HMT					{font-size:12px; line-height:16px; margin:10px; padding:10px 0 10px 0; position:relative; z-index:2; color:#959595; text-align:left;}
.HMT strong				{display:block; font-size:13px; color:var(--IDTcolor); margin:0 0 10px -15px;}
.HMT ul					{list-style-position:outside; margin:0; padding:0; word-break:break-all;}
.HMT li					{list-style-type:disc; margin-bottom:10px;}

.HMT.border				{font-size:12px; line-height:12px; letter-spacing:0em; margin:10px 0; padding:0 10px; position:relative; z-index:2; color:#959595; text-align:left; border:1px solid #88c71a; border-radius:3px; background:#fefffa}
.HMT.border	ul			{list-style-position:inside; margin:5px 0px; padding:5px 15px; word-break:break-all;}
.HMT.border li			{list-style-type:disc; padding:5px 0; }

.DOT_linebreak 			{margin:5px 15px 20px;}
.DOT_linebreak li		{display:block; position:relative; padding-left:15px; font-size:0.813em; font-weight:600; line-height:18px; margin-bottom:5px; color:#666; text-align:left;}
.DOT_linebreak li:before{content:''; position:absolute; top:6px; left:0px; width:6px; height:4px; background-color:#666; border:1px solid #666; border-radius:2px;}

.DOT_linebreak li > ol				{list-style-position:outside; padding-left:10px; color:#808080; text-align:justify; margin:10px 0px;}
.DOT_linebreak li > ol > li			{list-style-type:Decimal; font-size:var(--FS-m-small); line-height:20px; letter-spacing:-1px;}

.DOT_linebreak li > ol > li:before{content:''; position:absolute; top:8px; left:0px; width:4px; height:2px; background-color:#666; border:1px solid #666; border-radius:2px;}


/*******************************************************************************************************************************************
*	UL BOARD : 2023.01.27
*******************************************************************************************************************************************/
/* Board Type UL List */
.BTUL 								{width:100%; margin:15px 0px;}
.BTUL > li							{padding:20px 10px; text-align:left; border-style:solid; border-width:1px; border-color:#F5F5F5 #FFF #EEE #FFF;}
.BTUL > li:first-child				{margin-top:0;}
.BTUL > li > a						{width:100%; display:flex; flex-direction:row; align-items:center; justify-content:space-between; padding:0px; font-size:var(--FS-medium); font-weight:500;}
.BTUL > li > a p.tit				{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-right:30px;}
.BTUL > li > a p.tit .update		{display:block; font-weight:500; font-size:var(--FS-m-small); margin-bottom:4px; color:var(--gray001);}
.BTUL > li > a .arrow				{transition:all 0.2s; width:10px; height:10px; border:2px solid #999; border-top:none; border-right:none; font-size:0px;}
.BTUL > li > a .arrow.downview		{-webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.BTUL > li > a .arrow.linkview		{-webkit-transform:rotate(225deg); transform:rotate(225deg);} /* Notice */
.BTUL > li > a:hover .arrow			{transition:all 0.2s; border:2px solid var(--IDTcolor); border-top:none; border-right:none;}
.BTUL > li.on > a p.tit				{color:var(--IDTcolor); font-weight:600;}
.BTUL > li.on > a .arrow.downview	{-webkit-transform:rotate(135deg); transform:rotate(135deg); border-color:var(--IDTcolor);}
.BTUL > li > .view					{display:none; width:100%; margin-top:20px; padding:24px 20px; background-color:#F2F2F2; border-radius:5px; font-size:0.875rem; color:#555; line-height: 1.73;}
.BTUL > li > .view img				{max-width:100%;}


/* FAQ TAB */
.faqTab						{font-weight:700; padding:20px; box-sizing:border-box; border-bottom:1px solid #EAEAEA; display:-webkit-box; display:-webkit-flex; display:-moz-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-justify-content:space-between; -moz-justify-content:space-between; justify-content:space-between;}
.faq_item a.on				{color:var(--IDTcolor);}

@media (max-width:980px) {
	.faqTab					{margin-top:20px; padding:0; -webkit-flex-flow:wrap; -moz-flex-flow:wrap; -ms-flex-flow:wrap; flex-flow:wrap}
	.faq_item				{flex:1 0 25%; text-align:center; border-top:1px solid #EAEAEA; border-right:1px solid #EAEAEA; box-sizing:border-box; padding:12px 0; font-size:12px}
	.faq_item:nth-child(4n) {border-right:none}
}


/* Board Type UL View */
.BTUV						{display:inline-block; width:100%; margin:15px 0px; text-align:left;}
.BTUV_header				{padding:20px 0px 20px 0; border-bottom:1px solid #eee;}
.BTUV_header > p.tit		{display:inline-block; max-width:calc(100% - 10px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:18px; color:#333; font-weight:700;}
.BTUV_content				{padding:20px; font-size:14px;} 
.BTUV_content img			{display:inline-block; margin-top:20px; max-width:100%; height:auto; text-align:center;}

.BTUV_addFile				{line-height:20px; border-bottom:1px solid #ddd; border-top:1px solid #ddd; background-color:#f9f9f9; padding:10px 20px; margin-bottom:10px;}
.BTUV_addFile .addFile_list	{width:100%;}
.BTUV_addFile .addFile_list>li	{line-height:26px;}
.BTUV_addFile .fidx			{display:inline-block; width:60px; margin-right:20px;}

@media (max-width:980px) {
	.BTUV_content	{padding:20px 0px; font-size:13px;} 
}

.view_add_file {margin-top:20px;}
.view_add_file ul li {margin-bottom:10px;}
.view_add_file ul li:last-child {margin-bottom:0;}
.view_add_file a {display:block;}
.view_add_file dl {display:table; table-layout:fixed; width:100%; height:46px; padding:0 12px; border-radius:8px; background-color:#f6f6f6; box-sizing:border-box;}
.view_add_file dl dt {display:table-cell; width:43px; font-size:12px; color:#333; font-weight:700; vertical-align:middle;}
.view_add_file dl dd {position:relative; display:table-cell; /*width:calc(100% - 43px);*/ padding-left:8px; padding-right:42px; font-size:12px; color:#555; font-weight:400; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle;}
.view_add_file dl dd:after {content:''; position:absolute; top:50%; right:0; transform:translate(0, -50%); display:block; width:26px; height:26px; border-radius:5px; background:url('../images/template/icon_arrow_down11.png') center center no-repeat; background-size:26px auto;}
.ie11 .view_add_file dl dd:after {margin-top:12px;}

/* Board Type UL Write */
.BTUW 							{display:inline-block; width:100%; margin:0px auto; font-size:0.875rem;}
.BTUW li						{padding:0px; text-align:left; margin:20px 0;}
.BTUW li:first-child			{margin-top:0;}


/********** 오픈소스 라이선스 **********/
.OLS								{position:fixed; top:0; bottom:0; padding:0px; right:-350px; width:30%; max-width:350px; overflow-y:auto; transition:all .3s ease-in-out 0s; -webkit-transition:all .3s ease-in-out 0s; -moz-transition:all .3s ease-in-out 0s; z-index:9999;}
.OLS.on								{right:0; background:#F5F5F5; text-align:left; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:Alpha(Opacity=100); -moz-opacity:1.0; opacity:1.0;}
.OLS.on ~ .dim						{display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.75); z-index:999;} /* OLS 활성화되었을 때 */
.OLS .btn_close						{position:absolute; display:inline-block; width:25px; height:25px; top:14px; right:9px; cursor:pointer;}

@media screen and (max-width:980px) {
.OLS								{width:80%;}
}

.OLS H3			{text-align:center; width:100%; font-size:15px; line-height:48px !important; font-weight:700; color:#111; text-transform:uppercase; letter-spacing:-1px; background:#FFFFFF; border-top:1px solid #EEE; border-bottom:1px solid #EEE;}  /* Page Title */
.OLS H3	.CICC	{margin:12px 0 0 10px;}


/* Setting Page */
.setPage		{width:100%; padding:20px;}
.setPage > ul	{margin-bottom:25px;}


/* List 더 보기 */
button.btn_list_more		{font-size:14px; font-weight:500; width:100%; height:36px; margin:15px 0px; background-color:var(--baseBackground);  border:1px solid #CCC; color:#444; line-height:34px; border-radius:2px}
.btn_list_more .page_count	{font-family:Roboto; font-weight:500; color:var(--IDTcolor)}
.btn_list_more .total_count	{font-family:Roboto; font-weight:500; color:#666}


/*******************************************************************************************************************************************
* Recent View Items - 2023.12.06
*******************************************************************************************************************************************/
.RVI												{position:relative; margin:10px auto; padding:10px 0;}		
.RVI:before											{content: ""; display:block; position:absolute; top:0px; left:15px; width:4px; height:100%; background:#E5E5E5; border-radius:2px;}
.RVI ul												{display:flex; flex-wrap:wrap; position:relative; width:100%; padding-left:50px; margin-bottom:26px;}
.RVI ul:before										{content: ""; display:block; position:absolute; top:30px; left:2px; width:30px; height:38px; background: url(/shop/img/good/icon_recent_notice.png) no-repeat; background-size:30px auto; z-index:2}
.RVI ul:after										{position:absolute; top:44px; left:10px; width:40px; border-top:4px solid #E5E5E5; content:''; z-index:1}
.RVI ul .rviDate									{position:absolute; background-color:var(--mygray500); color:#FFF; font-size:var(--FS-mm-small); top:65px; left:-10px; min-width:56px; padding:4px; border-radius:25px; text-align:center; content:''; z-index:3}
.RVI ul li											{margin:10px 10px 0px 0px;}
.RVI ul li a										{position:relative; display:block; width:105px; height:105px; border-radius:6px; border:1px solid rgba(0, 0, 0, 0.1); overflow:hidden;}
.RVI ul li img										{width:auto; height:105px; max-width:105px; max-height:105px;}

@media screen and (max-width:980px) {
	.RVI ul:before									{top:28px; left:4px; background-size:26px auto;}
	.RVI ul li a									{width:80px; height:80px;}
	.RVI ul .rviDate								{top:60px; left:-5px; min-width:44px;}
	.RVI ul li img									{height:80px; max-width:80px; max-height:80px;}
}



/* My Location */
.myLocation.on				{position:fixed; bottom:0px; transition:transform 0.3s ease-in-out 0.1s; z-index:1; display:flex !important; align-items:center;}
.myLocation.on.hideGo		{transform:translateY(100%); transition:transform 0.3s ease-in-out 0.1s; }

.myLocation			{display:none;position:fixed; text-align:center; width:100%; height:60px; padding:0 20px; bottom:0px; z-index:16; background:#000; color:#FFF; display:flex !important; align-items:center;
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:Alpha(Opacity=80); -moz-opacity:0.8; opacity:0.8;}
/*.myLocation:after	{content: ''; position:absolute; left:calc(50% - 6px); bottom:-5px; border-style:solid; border-width:5px 5px 0; border-color:#000 transparent ; display:block; width:0; z-index:1;}	*/

.myLocation a		{display:block !important; width:100%; height:60px; color:#FFF; font-size:13px; letter-spacing:-1px; font-weight:500; overflow:hidden; 
					word-wrap:break-word; word-break: break-all; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis; white-space:pre-wrap;}
.myLocation a:hover	{text-decoration:none;  color:#FFF !important;}

.myLocation i		{position:relative; top:8px; margin-right:8px; color:#FFF; width:24px !important; height:24px !important; text-align:center; z-index:21;}