@charset "utf-8";

/* 변수설정 */
:root {
	--max-width: 1320px;
	--max-width-xl: calc(100% - 120px);
	--max-width-l: calc(100% - 100px);
	--max-width-m: calc(100% - 60px);
	--max-width-s: calc(100% - 60px);
	--max-width-xs: calc(100% - 30px);
}


/* Noto Sans KR */
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 300;
   src: url('../fonts/NotoSansKR-Light.woff2') format('woff2'),
        url('../fonts/NotoSansKR-Light.woff') format('woff'),
        url('../fonts/NotoSansKR-Light.otf') format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url('../fonts/NotoSansKR-Regular.woff2') format('woff2'),
        url('../fonts/NotoSansKR-Regular.woff') format('woff'),
        url('../fonts/NotoSansKR-Regular.otf') format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url('../fonts/NotoSansKR-Medium.woff2') format('woff2'),
        url('../fonts/NotoSansKR-Medium.woff') format('woff'),
        url('../fonts/NotoSansKR-Medium.otf') format('opentype');
 }
 @font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 600;
   src: url('../fonts/NotoSansKR-Bold.woff2') format('woff2'),
        url('../fonts/NotoSansKR-Bold.woff') format('woff'),
        url('../fonts/NotoSansKR-Bold.otf') format('opentype');
 }

/* Nanum Square */
@font-face {
  font-family: 'Nanum Square-b';
  font-style: bold;
  font-weight: 700;
  src: url('../fonts/nanumsquareb.eot'); /* IE9 Compat Modes */
  src: url('../fonts/nanumsquareb.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/nanumsquareb.woff2') format('woff2'),
       url('../fonts/nanumsquareb.woff') format('woff'), /* Modern Browsers */
       url('../fonts/nanumsquareb.ttf') format('truetype'); /* Safari, Android, iOS */
}
@font-face {
  font-family: 'Nanum Square-e';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/nanumsquaree.eot'); /* IE9 Compat Modes */
  src: url('../fonts/nanumsquaree.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/nanumsquaree.woff') format('woff'), /* Modern Browsers */
       url('../fonts/nanumsquaree.ttf') format('truetype'); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
	font-family: 'GmarketSansMedium';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.gBold { 
	font-family:"GmarketSansBold";
}

/* common */
* { margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }

html, body { width:100%; height:100%; } 
html { font-size:15px; color:#555; font-family:"GmarketSansMedium";
-webkit-font-smoothing: antialiased;
scroll-behavior: smooth; /* 부드럽게 */}


/* browser scroll bar */
body {
	scrollbar-face-color: #F2F2F2;
	scrollbar-shadow-color: #B7B7B7;
	scrollbar-highlight-color: #F2F2F2;
	scrollbar-3dlight-color: #F2F2F2;
	scrollbar-darkshadow-color: #E9E9E9;
	scrollbar-track-color: #E9E9E9;
	scrollbar-arrow-color: #999999;
	position:relative;
	overflow-y:scroll;
	overflow-x:hidden;
}

html, body {width:100%; line-height:150%}

a:link    { color: #555; text-decoration:none }
a:visited { color: #555; text-decoration:none}
a:hover   { color: #1961ae; text-decoration:none }

fieldset, img {border:0;vertical-align:middle;margin:0; padding:0;}
.test {border:1px solid red;}

h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight:400; line-height:1.5; }
pre {font-family:"Noto Sans KR"; overflow:hidden; white-space: pre-wrap}

input {vertical-align:middle;}
ol li { margin-left:20px;display:list-item; list-style-type:decimal}
ul, li {list-style:none;}
img, fieldset {border:none;}

hr, caption {display:none;}
.blind, legend {display:block; position:absolute; left:0; top:-5000px; overflow:hidden;}
legend {*width:0;}
address {font-style:normal}
.hidden {width:0; height:0; line-height:0; font-size:0px; float:left; visibility:hidden; overflow:hidden;}
table {border-collapse:separate;border-spacing:0;}
button {cursor:pointer;}

/***** skip ***********************************************************************************************************************/
.skip {position:absolute; width:100%; margin:0 auto; z-index:999999; background:#fff}
.skip a {display:block; height:1px; margin-bottom:-1px; overflow:hidden; white-space:nowrap; width:1px;}
.skip h2{ width:1px; height:1px; font-size:0px; visibility:hidden; float:left; position:absolute; text-indent:-9999px;}
.skip a:focus, .skip a:active {height:24px; line-height:24px; width:100%; color:#000; text-align:center; font-size:16px; font-weight:bold; margin:0;}
/**********************************************************************************************************************************/

.f_left {float:left;}
.f_right{float:right;}
.clear {clear:both;}

.cen {text-align:center;}
.left {text-align:left;}
.rig {text-align:right;}

.mb-20 { margin-bottom:20px; }
.mb-30 { margin-bottom:30px; }
.mb-40 { margin-bottom:40px; }

.color-red { color:#e72d2d; }

::-moz-selection { color:#fff; background:#224087; }
::-webkit-selection { color:#fff; background:#224087; }
::selection { color:#fff; background:#224087; }

input:-ms-input-placeholder {font-size:16px; color:#c3c3c3; font-family:"GmarketSansMedium";}
::-ms-input-placeholder {font-size:16px; color:#c3c3c3; font-family:"GmarketSansMedium";}
::-webkit-input-placeholder {font-size:16px; color:#c3c3c3; font-family:"GmarketSansMedium";}
::-moz-placeholder {font-size:16px; color:#c3c3c3; font-family:"GmarketSansMedium";}
::-moz-placeholder {font-size:16px; color:#c3c3c3; font-family:"GmarketSansMedium";}

.color-white { color:#fff!important; }
.colorGreen { color:#22943a!important; }
.colorOrange { color:#ed6d00!important; }

.font-s { font-size:16px; }
.text_uStyle{
   box-shadow:inset 0 -7px 0 rgba(255,246,143,0.8);
   padding:0 3px
}
.bg-light {
	background-color:#f7f7f7;
}
