@charset "utf-8";

@font-face {
	font-family: 'NotoSansKR';
	font-style: normal;
	font-weight: 100;
	font-display: swap;
	src: url('./Fonts/Noto/notokr-thin.eot'),
		 url('./Fonts/Noto/notokr-thin.eot?#iefix') format('embedded-opentype'),
		 url('./Fonts/Noto/notokr-thin.woff2') format('woff2'),
		 url('./Fonts/Noto/notokr-thin.woff') format('woff'),
		 url('./Fonts/Noto/notokr-thin.ttf') format('truetype'),
		 url('./Fonts/Noto/notokr-thin.svg#notokr-thin') format('svg');
}
@font-face {
	font-family: 'NotoSansKR';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('./Fonts/Noto/notokr-demilight.eot'),
		 url('./Fonts/Noto/notokr-demilight.eot?#iefix') format('embedded-opentype'),
		 url('./Fonts/Noto/notokr-demilight.woff2') format('woff2'),
		 url('./Fonts/Noto/notokr-demilight.woff') format('woff'),
		 url('./Fonts/Noto/notokr-demilight.ttf') format('truetype'),
		 url('./Fonts/Noto/notokr-demilight.svg#notokr-demilight') format('svg');
}
@font-face {
	font-family: 'NotoSansKR';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('./Fonts/Noto/notokr-regular.eot'),
		 url('./Fonts/Noto/notokr-regular.eot?#iefix') format('embedded-opentype'),
		 url('./Fonts/Noto/notokr-regular.woff2') format('woff2'),
		 url('./Fonts/Noto/notokr-regular.woff') format('woff'),
		 url('./Fonts/Noto/notokr-regular.ttf') format('truetype'),
		 url('./Fonts/Noto/notokr-regular.svg#notokr-regular') format('svg');
}
@font-face {
	font-family: 'NotoSansKR';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('./Fonts/Noto/notokr-medium.eot'),
		 url('./Fonts/Noto/notokr-medium.eot?#iefix') format('embedded-opentype'),
		 url('./Fonts/Noto/notokr-medium.woff2') format('woff2'),
		 url('./Fonts/Noto/notokr-medium.woff') format('woff'),
		 url('./Fonts/Noto/notokr-medium.ttf') format('truetype'),
		 url('./Fonts/Noto/notokr-medium.svg#notokr-medium') format('svg');
}
@font-face {
	font-family: 'NotoSansKR';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('./Fonts/Noto/notokr-bold.eot'),
		 url('./Fonts/Noto/notokr-bold.eot?#iefix') format('embedded-opentype'),
		 url('./Fonts/Noto/notokr-bold.woff2') format('woff2'),
		 url('./Fonts/Noto/notokr-bold.woff') format('woff'),
		 url('./Fonts/Noto/notokr-bold.ttf') format('truetype'),
		 url('./Fonts/Noto/notokr-bold.svg#notokr-bold') format('svg');
}
@font-face {
	font-family: 'SpoqaHanSans';
	font-style: normal;
	font-weight: 100;
	font-display: swap;
	src: url('./Fonts/Spoqa/Spoqa Han Sans Thin.woff2') format('woff2'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Thin.woff') format('woff'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Thin.ttf') format('truetype');
}
@font-face {
	font-family: 'SpoqaHanSans';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('./Fonts/Spoqa/Spoqa Han Sans Light.woff2') format('woff2'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Light.woff') format('woff'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Light.ttf') format('truetype');
}
@font-face {
	font-family: 'SpoqaHanSans';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('./Fonts/Spoqa/Spoqa Han Sans Regular.woff2') format('woff2'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Regular.woff') format('woff'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'SpoqaHanSans';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('./Fonts/Spoqa/Spoqa Han Sans Bold.woff2') format('woff2'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Bold.woff') format('woff'),
		 url('./Fonts/Spoqa/Spoqa Han Sans Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Tahoma';
	font-style: normal;
	font-display: swap;
    unicode-range: U+0030-0039;
	src: url('./Fonts/Tahoma/TAHOMAB0.TTF') format('truetype');
}

:root{
	--MainColor: #2d68df; /*#2d68df;*/
	--CommonPurple: #5f2bf4;
	--BgColor: #fafafa;
}

*{box-sizing:border-box}
body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,select,table,td,textarea,th,ul{margin:0;padding:0;}
body,button,input,select,table,textarea{font-size:12px;color:#202020;font-family:-apple-system,BlinkMacSystemFont,"NotoSansKR","Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",sans-serif}
h1,h2,h3,h4,h5,h6{font-size:inherit;line-height:inherit}
textarea{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:transparent;border:0;word-break:keep-all;word-wrap:break-word;vertical-align:middle}
button,input,select{-webkit-border-radius:0;border-radius:0;border:0;vertical-align:middle}
button{background-color:transparent}
img{border:0;vertical-align:middle}
ol,ul{list-style:none}
address,em{font-style:normal}
a{color:inherit;text-decoration:none}
iframe{overflow:hidden;margin:0;border:0;padding:0;vertical-align:middle}
mark{background-color:transparent}
i{font-style:normal}
button:focus, input:focus, select:focus, option:focus, textarea:focus, span:focus, div:focus {outline:none}
input:-webkit-autofill{padding:none;-webkit-box-shadow: 0 0 0px 1000px white inset}
label{cursor:pointer}

/* 공통 클래스 */
.blind{position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;overflow:hidden}
.txr{text-align:right}
.txc{text-align:center}
.vm{vertical-align:middle}
.None{display:none !important}
.Flex{display:flex}

/* 아이콘 */
.IcoSp{background:url('../Img/IconSprite.png') no-repeat}

/*말줄임표 처리 */
.ellipsis{overflow: hidden;text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;/*-webkit-line-clamp: 2; //라인 수 지정*/}
/* 폼 필수값 표기 */
.RequiredIcon:after {content: '*';margin-left: 3px;color: red;}
/* 검색어 강조 */
.KeywordHighlight{font-weight:bold; background-color:#fff8b2;}
.KeywordHighlight2{color:var(--MainColor); font-weight:bold}

/* Loading */
#LodingWrap{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0 0 0 / 0.5);z-index:999;opacity:0}
#LodingWrap > i{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;display:block;height:50px;width:50px;background-repeat:no-repeat}
#LodingWrap > i:after{content:"";display:block;height:50px;width:50px;background-image:url("../Img/SpinnerLoading.svg");background-size:50px 50px;animation:SlSpin 1s infinite linear}
@keyframes SlSpin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/* PartLoading */
.PartLoading{position:absolute;top:0;left:0;width:100%; height:100%; display:flex; align-items:center;justify-content:center;z-index:100;background:rgba(0,0,0,0.2);}
.PartLoading span{display:inline-block; width:8px; height:8px; background-color:#202020; border-radius:50%;animation: PartsLoading 1s ease-in-out infinite;}
.PartLoading span:nth-child(1){margin-right:10px;}
.PartLoading span:nth-child(2){animation-delay: 0.2s;;margin-right:10px;}
.PartLoading span:nth-child(3){animation-delay: 0.4s;}
@keyframes PartsLoading{0%{opacity:0;transform:scale(0.2);}50%{opacity:1;transform:scale(1.2);}100%{opacity:0;transform:scale(0.2);}}

/* 기본설정 */
.DeWrap{margin:0 auto;width:1200px}
.DeTitle {padding-top: 40px;padding-bottom: 10px;font-size: 30px;font-weight: 700;color: #1b1b1b;}

/*Margin*/
.Mtb4{margin:4px 0;}
.Ml10{margin-left:10px}
.Mr10{margin-right:10px}
.Mt2{margin-top:2px}
.Mt5{margin-top:5px}
.Mt10{margin-top:10px;}
.Mb22{margin-bottom:22px;}
.Mb30{margin-bottom:30px;}
.Mlr5{margin:0 5px}

/* 페이징 */
.PagingWrap{display:table;padding:20px 0;margin:0 auto}
.PagingWrap > li{float:left;margin:0 1px;padding:3px 9px;cursor:pointer;font-size:14px;font-weight:bold;border-radius:5px;color:#a1a1a1;border: 1px solid transparent}
.PagingWrap > li > i{display:inline-block;vertical-align:2px;width:8px; height:8px; border-left:2px solid #d0d0d0; border-bottom:2px solid #d0d0d0;}
.PagingWrap > li > .LeftAngle{transform: rotate(45deg)}
.PagingWrap > li > .RightAngle{transform: rotate(-135deg)}
.PagingWrap > .PgBtnNow{border:1px solid #9a9a9a;color:#9a9a9a}
.PagingWrap > .PgArrow{padding:4px 5px;border:0}
/* .PagingWrap > .PgBtnStart > i:nth-child(2), .PagingWrap .PgBtnEnd > i:nth-child(2){margin-left:-2px;} */
.PagingWrap > .PgBtnPrev{margin-right:5px}
.PagingWrap > .PgBtnNext{margin-left:5px}

/* ToolTip */
.TooltipIcon,.TooltipIcon2{display:inline-block;width:18px;height:18px;line-height:18px;font-size:15px;text-align:center;border-radius:20px;font-weight:700;background-color:#b7b7b7;color:#fff}
.TooltipIcon:before{content:'?';display:block}
.TooltipIcon2{background-color:red; color:#fff;}
.TooltipIcon2:before{content:'!';display:block}
[tooltipUp]:hover {position:relative}
[tooltipUp]:hover:after {content:attr(tooltipUp);position:absolute;white-space:pre;bottom:100%;left:105%;background-color:rgba(0,0,0,0.8);border-radius:5px 5px 5px 0;color:#fff;font-size:12px;font-weight:normal;text-align:left;z-index:10;padding:5px 5px !important;}
[tooltipDown]:hover {position:relative}
[tooltipDown]:hover:after {content:attr(tooltipDown);position:absolute;white-space:pre;top:100%;left:105%;background-color:rgba(0,0,0,0.8);border-radius:0 5px 5px 5px;color:#fff;font-size:12px;font-weight:normal;text-align:left;z-index:10;padding:5px 5px !important;}

/* 이미지 미리보기 */
.cPrevDfImg{display:inline-block;width:50px;height:50px;background-image:url('../Img/NoImageIcon.png');background-position:center;background-repeat:no-repeat;background-size:contain;border:1px solid #ccc;background-color:#eee;vertical-align:middle;cursor:pointer}
.cPrevDfImg.De{background-size:auto}
.cPrevImg{margin-right:3px;width:50px;height:50px;cursor:pointer}
#cPrevImgLayer{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0 0 0 / 0.6);z-index:900;cursor:pointer}
#cPrevImgLayer > img{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;max-width:100%;max-height:100%}

/* 리스트 없음 */
.NoRegistration{font-size: 20px;color: #a8a8a8;padding: 150px 0;text-align: center;}

/*이벤트*/
.EventBox{position:relative;margin-right:5px;}
.EventIcon, .EvLink{display:inline-block;max-width:75px;min-width:55px;padding:1px 3px;vertical-align:middle;font-weight:normal; border-radius:5px; transition: all .3s ease-in-out;}
.EvLink{width:100%;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;display:flex; align-items:center;justify-content:center;}
.EventBox:hover .EventIcon{opacity:0}
.EventBox:hover .EvLink{opacity:1}

/* 상품리스트 정렬순서 아이콘 */
.ItSortWrap{margin:60px 0 10px 0;display:table;width:1200px;}
.ItSortWrap > *{display:table-cell;}
.ItemTotalCntBox{display:inline-block;width:120px;color:#1b1b1b;font-size:18px; font-weight:700;}
.ItemSortList{width:980px;display:flex;gap:14px;justify-content: flex-end; font-size: 12px;color: #818181;padding-right:15px;}
.ItemSortList > li{cursor:pointer;position:relative;}
.ItemSortList > li span{margin-left:15px;}
.ItemSortList > li:hover span{text-decoration:underline;}
.ItemSortList > li.Act{color:#1b1b1b;}
.ItemSortList > li > .SortActIcon::after{display:inline-block;content:'\2022';width:17px;height:17px;position:absolute; left:0;top:42%;transform:translateY(-50%);text-align:center;font-size:16px;padding-bottom: 1px;}
.ItemSortList > li.Act > .SortActIcon::after{content:'';width: 4px;height: 8px;border: solid var(--MainColor);border-width: 0 2px 2px 0;transform: translateY(-50%) rotate(45deg);}
.SoldOutChkWrap{display:block;width:100px;vertical-align: middle;position:relative;text-align:right;}
.SoldOutChkWrap > .SoldOutText{margin-left:25px;color:#818181;vertical-align: middle;}
.SoldOutChkWrap > .SoldOutChk{width:20px;height:20px;position:absolute;left:0; border:1px solid #e9e9e9; border-radius:2px; vertical-align:middle;}
.SoldOutChk:after {width: 5px;height: 10px;border: solid var(--MainColor);border-width: 0 2px 2px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);position: absolute;left: 6px;top:1px;display:none; content:'';}
.SoldOutChkWrap input[type="checkbox"]:checked ~ .SoldOutChk {border:1px solid var(--MainColor);}
.SoldOutChkWrap input[type="checkbox"]:checked ~ .SoldOutChk:after { display: block;}


/* 메인 플로팅 배너 ============================================================ */
	#MFloatingWrap{width:1200px;height:0;margin:0 auto;z-index:30}
	.MFloatingBannerBox{display:block;text-align:center}
	.MFloatingBannerBox > img{max-width:100px}
	/* 좌측 배너 */
	#MFloatingLContainer{position:absolute;top:240px;margin-left:-120px}
	/* 우측 배너 */
	#MFloatingRContainer{position:absolute;top:240px;margin-left:1220px}
	#MFloatingRHistoryWrap{width:100px;border:1px solid #f0f0f0;background-color:#fff}
	#MFloatingRHistoryContainer{padding:10px;text-align:center}
	#MFloatingRHistoryTitle{font-size:14px;color:#626262}
	#MFloatingRHistoryItemListContainer{margin-top:10px;border-top:1px solid #e8e8e8}
	#MFloatingRHistoryItemListBox{height:260px;overflow:hidden}
	#MFloatingRHistoryItemListBox > .swiper-wrapper{align-items:center}
	.MFloatingRHistoryItemImg{display:block;margin:10px 0}
	.MFloatingRHistoryItemImg > img{padding:5px}
	#MFloatingRHistoryItemPagingBox{display:flex;justify-content:space-between;align-items:center}
	#HIP_PBtn, #HIP_NBtn{position:relative;width:23px;height:23px;border:1px solid #f0f0f0}
	#HIP_PBtn > i, #HIP_NBtn > i{margin-top:5px;color:#cfcfcf;font-weight:bold}
	#HIP_NBtn > i{margin-left:2px}
	#HIP_Cnt{color:#818181}
	#MFloatingRIconBtnContainer{display:flex;border-top:1px solid #f0f0f0}
	#MFloatingRIconBtnContainer > a{flex:1 1 0;height:50px;align-self: center;}
	#MFloatingRIconBtnContainer > a:nth-child(1){border-right:1px solid #f0f0f0}
	#MFloatingRIconCart{margin:10px 0 0 8px;width:35px;height:31px;background-position:-18px -39px}
	#MFloatingRIconWish{margin:15px 0 0 13px;width:24px;height:19px;background-position:-70px -52px}
	#MFloatingRIconCart > span{float:right;width:18px;height:18px;line-height:17px;font-size:10px;color:#fff;text-align:center}
	#MFloatingOnTop{border-top:1px solid #f0f0f0;padding: 5px;font-size:13px;color:#424242;cursor: pointer;font-weight:600;text-align:center}