@charset "UTF-8";
/* ------------------------------------------------------------------------
@ Font & Import Css 
------------------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

@import url('common.css?d=250501');
@import url('layout.css?d=241231');
@import url('pages.css?d=250501');
@import url('product.css?d=250221');
@import url('cart.css?d=250501');
@import url('mypage.css?d=250501');
@import url('ordermade.css?d=240605');

/* ------------------------------------------------------------------------
@ Basic Color 
------------------------------------------------------------------------ */
:root { 
--mainc:#16181A; 	/* main text color */
--point1:#f36b20;	/* point color  */
--linec:#e3e5e8;	/* line color */
}


/* ------------------------------------------------------------------------
@ Default Css 
------------------------------------------------------------------------ */

html {font-size:10px; scroll-behavior:revert !important; }
@media screen and (max-width: 1024px){ 
}
@media screen and (max-width: 768px){
	html { font-size:9px; }
}
@media screen and (max-width: 640px){
}
@media screen and (max-width: 414px){
} 


* {outline:none;}
html,body{ position: relative;}
body {font-size:1.4rem; overflow-x:hidden; }
body.hidden {overflow:hidden;}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0;padding:0;font-family:"Noto Sans KR","맑은 고딕","malgun gothic","nanumgothic","AppleSDGothcNeo","AppleGothic", sans-serif; letter-spacing:-0.05em; }
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,time,figure,article,nav,header,footer,hgroup,video,audio,aside,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { 
	 -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  
}

th,td {border-spacing:0;}
img,fieldset,iframe {border:0;}
img {max-width:100%; height:auto;}
em {font-style:none;}
ul,li,ol {list-style:none;}
a {text-decoration:none;}

body::-webkit-scrollbar { width: 0.6rem; } 
body::-webkit-scrollbar-track { background:#f1f1f1;} 
body::-webkit-scrollbar-thumb { background:rgba(0,0,0, 0.2); border-radius:10px; } 
body::-webkit-scrollbar-thumb:hover {background:var(--menu); } 
body::-webkit-scrollbar-button { display: none;  } 


/* Skip Nav */
#skip {position:relative;z-index:99999999999;}
#skip a {display:block;overflow:hidden;width:1px;height:1px;margin-bottom:-1px;background:#151c2d;font-weight:500;font-size:16px;color:#fff;white-space:nowrap;text-align:center;}
#skip a:focus,
#skip a:active {position:absolute;width:100%;height:auto;margin-bottom:10px;padding:5px;left:0;top:0;box-sizing:border-box;}


#wrap {position:relative;max-width:2560px; height:auto;font-family:"Noto Sans KR","맑은 고딕","malgun gothic","나눔 고딕","Nanum Gothic","nanumgothic","AppleSDGothcNeo","AppleGothic", sans-serif;font-smoothing: antialiased;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size:1.4rem;color:#16181A;font-weight:400;letter-spacing:-0.05em; }


button { border: 0; cursor: pointer; }
button:focus { outline: none;  }
select::-ms-expand { display: none; }
select { appearance: none; -webkit-appearance: none; -moz-appearance: none; }

.maxWidth {max-width:1280px;margin:0 auto;}
.maxWidth1440 {max-width:1440px;margin:0 auto;}
.blind {visibility:hidden;overflow:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0}
@media screen and (max-width: 1470px){
	 .maxWidth1440 {margin:0 15px;}
} 
@media screen and (max-width: 1310px){
    .maxWidth {margin:0 15px;}
	.maxWidth.full { margin:0 15px; } 
	.maxWidth.inner { margin:0 auto; } 

}
@media screen and (max-width: 1024px){
	.maxWidth.full { margin:0 auto; } 
	.maxWidth.inner { margin:0 15px; } 
} 
@media screen and (max-width: 768px){
	
}
@media screen and (max-width: 300px){
	body{min-width:360px;}
} 

::-webkit-input-placeholder { color: #bbb;  } /* Chrome/Opera/Safari */
::-moz-placeholder { color: #bbb;   }  /* Firefox 19+ */
:-ms-input-placeholder { color: #bbb;  } /* IE 10+ */
:-moz-placeholder { color: #bbb;  } /* Firefox 18- */






@media screen and (max-width: 1280px){
	.no1280 {display:none;} 
} 
@media screen and (max-width: 1024px){
	.no1024 {display:none;} 
}
@media screen and (max-width: 768px){
	.no768 {display:none;} 
}
@media screen and (max-width: 640px){
	.no640 {display:none;} 
}
@media screen and (max-width: 540px){
	.no540 {display:none;} 
}
@media screen and (max-width: 414px){
	.no414 {display:none;} 
}


/* ALERTBOX*/
.alertbox { z-index:9999; position:fixed; display:flex; border:1px solid #ccc; border-radius:10px; display:none; background:#fff; -webkit-overflow-scrolling:touch; box-shadow: 4.769px 7.632px 16px 0px rgba(0, 0, 0, 0.2); padding:30px; text-align:center; font-size:20px; } 
.alertbox .inner { height:100%; display:flex; justify-content: center;  align-items: center; line-height:1.6; }


/* MARGIN */
.mt10 { margin-top:1rem !important; }
.mt20 { margin-top:2rem !important; }
.mt30 { margin-top:3rem !important; }
.mt40 { margin-top:4rem !important; }
.mt50 { margin-top:5rem !important; }
.mt60 { margin-top:6rem !important; }
.mt70 { margin-top:7rem !important; }
.mt80 { margin-top:8rem !important; }
.mt90 { margin-top:9rem !important; }
.mt100 { margin-top:10rem !important; }