@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------
	File : Base.CSS
	Company : The Webstyle co.,ltd
 	Author :
 	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, color/font, align, etc
--------------------------------------------------------------------------------------------------------------------------------------------*/

*, *:before, *:after {box-sizing:border-box; margin:0; padding:0; border:0;}
html,
body {min-width:320px; height:100%; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; -webkit-overflow-scrolling:touch;}
html {font-family:"NanumBarunGothic", "NotoSansKR", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial"; font-weight:400;}
body {font-size:14px; font-family:"NanumBarunGothic"; line-height:1;}
address, article, aside, canvas, details, figure, figcaption, footer, header, menu, nav, section {display:block;}
h1, h2, h3, h4, h5, h6 {font-size:100%; font-weight:normal;}
img {width:100%; vertical-align:top;}
ol, ul, li, dl, dt, dd {list-style:none;}
table {width:100%; table-layout:fixed; border-spacing:0px; border-collapse:collapse;}
th, td {word-break:break-all; font-weight:normal;}
fieldset, iframe {width:100%;}
em, address {font-style:normal;}
button {font-family:"NanumBarunGothic", "NotoSansKR", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial"; vertical-align:middle; cursor:pointer;}
select, input, label {font-family:"NanumBarunGothic", "NotoSansKR", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial"; vertical-align:middle;}
hr {display:none;}
legend {position:absolute; left:-9999em; top:-9999em;}
caption {visibility:hidden; height:0; line-height:0; font-size:0;}
a {text-decoration:none;}

::-webkit-input-placeholder {color:#aaa;}
::-moz-placeholder {color:#aaa;}
:-ms-input-placeholder {color:#aaa;}
:-moz-placeholder {color:#aaa;}

.w69 {width:69px;}
.w86 {width:86px;}
.w90 {width:90px;}
.w100 {width:100px;}
.w112 {width:112px;}
.w110 {width:110px;}
.w120 {width:120px;}
.w140 {width:140px;}
.w150 {width:150px;}
.w169 {width:169px;}
.w180 {width:180px;}
.w192 {width:192px;}
.w200 {width:200px;}
.w202 {width:202px;}
.w210 {width:210px;}
.w224 {width:224px;}
.w260 {width:260px;}
.w280 {width:280px;}
.w300 {width:300px;}
.w430 {width:430px;}
.w460 {width:460px;}
.w463 {width:463px;}

.w100p {width:100%;}

.mar-t5 {margin-top:5px !important;}
.mar-t10 {margin-top:10px !important;}
.mar-t20 {margin-top:20px !important;}
.mar-t30 {margin-top:30px !important;}
.mar-t40 {margin-top:40px !important;}
.mar-t50 {margin-top:50px !important;}
.mar-t60 {margin-top:60px !important;}
.mar-t70 {margin-top:70px !important;}
.mar-t80 {margin-top:80px !important;}
.mar-t90 {margin-top:90px !important;}
.mar-t100 {margin-top:100px !important;}

.mar-r5 {margin-right:5px !important;}
.mar-r10 {margin-right:10px !important;}
.mar-r20 {margin-right:20px !important;}
.mar-r30 {margin-right:30px !important;}
.mar-r40 {margin-right:40px !important;}
.mar-r50 {margin-right:50px !important;}
.mar-r60 {margin-right:60px !important;}
.mar-r70 {margin-right:70px !important;}
.mar-r80 {margin-right:80px !important;}
.mar-r90 {margin-right:90px !important;}
.mar-r100 {margin-right:100px !important;}

.mar-b5 {margin-bottom:5px !important;}
.mar-b10 {margin-bottom:10px !important;}
.mar-b20 {margin-bottom:20px !important;}
.mar-b30 {margin-bottom:30px !important;}
.mar-b40 {margin-bottom:40px !important;}
.mar-b50 {margin-bottom:50px !important;}
.mar-b60 {margin-bottom:60px !important;}
.mar-b70 {margin-bottom:70px !important;}
.mar-b80 {margin-bottom:80px !important;}
.mar-b90 {margin-bottom:90px !important;}
.mar-b100 {margin-bottom:100px !important;}

.mar-l5 {margin-left:5px !important;}
.mar-l10 {margin-left:10px !important;}
.mar-l11 {margin-left:11px !important;}
.mar-l20 {margin-left:20px !important;}
.mar-l30 {margin-left:30px !important;}
.mar-l40 {margin-left:40px !important;}
.mar-l50 {margin-left:50px !important;}
.mar-l60 {margin-left:60px !important;}
.mar-l70 {margin-left:70px !important;}
.mar-l80 {margin-left:80px !important;}
.mar-l90 {margin-left:90px !important;}
.mar-l100 {margin-left:100px !important;}

.pd-t5 {padding-top:5px !important;}
.pd-t10 {padding-top:10px !important;}
.pd-t20 {padding-top:20px !important;}
.pd-t30 {padding-top:30px !important;}
.pd-t40 {padding-top:40px !important;}
.pd-t50 {padding-top:50px !important;}
.pd-t60 {padding-top:60px !important;}
.pd-t70 {padding-top:70px !important;}
.pd-t80 {padding-top:80px !important;}
.pd-t90 {padding-top:90px !important;}
.pd-t100 {padding-top:100px !important;}

.pd-r5 {padding-right:5px !important;}
.pd-r10 {padding-right:10px !important;}
.pd-r20 {padding-right:20px !important;}
.pd-r30 {padding-right:30px !important;}
.pd-r40 {padding-right:40px !important;}
.pd-r50 {padding-right:50px !important;}
.pd-r60 {padding-right:60px !important;}
.pd-r70 {padding-right:70px !important;}
.pd-r80 {padding-right:80px !important;}
.pd-r90 {padding-right:90px !important;}
.pd-r100 {padding-right:100px !important;}

.pd-b5 {padding-bottom:5px !important;}
.pd-b10 {padding-bottom:10px !important;}
.pd-b20 {padding-bottom:20px !important;}
.pd-b30 {padding-bottom:30px !important;}
.pd-b40 {padding-bottom:40px !important;}
.pd-b50 {padding-bottom:50px !important;}
.pd-b60 {padding-bottom:60px !important;}
.pd-b70 {padding-bottom:70px !important;}
.pd-b80 {padding-bottom:80px !important;}
.pd-b90 {padding-bottom:90px !important;}
.pd-b100 {padding-bottom:100px !important;}

.pd-l5 {padding-left:5px !important;}
.pd-l10 {padding-left:10px !important;}
.pd-l20 {padding-left:20px !important;}
.pd-l30 {padding-left:30px !important;}
.pd-l40 {padding-left:40px !important;}
.pd-l50 {padding-left:50px !important;}
.pd-l60 {padding-left:60px !important;}
.pd-l70 {padding-left:70px !important;}
.pd-l80 {padding-left:80px !important;}
.pd-l90 {padding-left:90px !important;}
.pd-l100 {padding-left:100px !important;}

/* Font */
/* @font-face {
    font-family:"NanumGothic";
    src:url('/microsite/Common/Fonts/NanumGothic.eot');
	src:local('※'),
		url('/microsite/Common/Fonts/NanumGothic.eot?#iefix') format('embedded-opentype'),
	    url('/microsite/Common/Fonts/NanumGothic.woff') format('woff');
	font-style:normal;
    font-weight:normal;
}

@font-face {
  font-family:'NanumGothicBold';
  font-style: normal;
  font-weight: 700;
  src: url('/microsite/Common/Fonts/NanumGothic-Bold.eot');
  src: url('/microsite/Common/Fonts/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'),
       url('/microsite/Common/Fonts/NanumGothic-Bold.woff') format('woff'),
	   url('/microsite/Common/Fonts/NanumGothic-Bold.woff2') format('woff2');
}

@font-face {
  font-family:'NanumGothicExtraBold';
  font-style: normal;
  font-weight: 700;
  src: url('/microsite/Common/Fonts/NanumGothic-ExtraBold.eot');
  src: url('/microsite/Common/Fonts/NanumGothic-ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('/microsite/Common/Fonts/NanumGothic-ExtraBold.woff') format('woff');
}

@font-face {
  font-family:'malgun';
  font-style: normal;
  font-weight: 700;
  src: url('/microsite/Common/Fonts/malgun.eot');
  src: url('/microsite/Common/Fonts/malgun.eot?#iefix') format('embedded-opentype'),
       url('/microsite/Common/Fonts/malgun.woff') format('woff'); */
}
/* NotoSansKR */
@font-face {
	font-family:"NotoSansKR"; font-weight:100;
	src: url("../fonts/NotoSans-Thin.eot");
  src: local("※"),
  url("../fonts/NotoSans-Thin.eot?#iefix") format("embedded-opentype"),
  url("../fonts/NotoSans-Thin.woff") format("woff");
}

@font-face {
	font-family:"NotoSansKR"; font-weight:300;
	src: url("../fonts/NotoSans-Light.eot");
  src: local("※"), url("../fonts/NotoSans-Light.eot?#iefix") format("embedded-opentype"),
  url("../fonts/NotoSans-Light.woff") format("woff");
}

@font-face {
	font-family:"NotoSansKR"; font-weight:400;
	src: url("../fonts/NotoSans-Regular.eot");
  src: local("※"), url("../fonts/NotoSans-Regular.eot?#iefix") format("embedded-opentype"),
  url("../fonts/NotoSans-Regular.woff") format("woff");
}

@font-face {
	font-family:"NotoSansKR"; font-weight:500;
	src: url("../fonts/NotoSans-Medium.eot");
  src: local("※"), url("../fonts/NotoSans-Medium.eot?#iefix") format("embedded-opentype"),
  url("../fonts/NotoSans-Medium.woff") format("woff");
}

@font-face {
	font-family:"NotoSansKR"; font-weight:700;
	src: url("../fonts/NotoSans-Bold.eot");
  src: local("※"), url("../fonts/NotoSans-Bold.eot?#iefix") format("embedded-opentype"),
  url("../fonts/NotoSans-Bold.woff") format("woff");
}

@font-face { /* 즐거운이야기체 */
  font-family: 'OTEnjoystoriesBA';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/OTEnjoystoriesBA.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face { /* 더페이스샵체 */
  font-family: 'InkLipquid';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family:"NanumGothic";
    src:url('/Admin/Common/Font/NanumGothic.eot');
	src:local('※'),
		url('/Admin/Common/Font/NanumGothic.eot?#iefix') format('embedded-opentype'),
	    url('/Admin/Common/Font/NanumGothic.woff') format('woff');/*,
	    url('/Admin/Common/Font/NanumGothic.ttf') format('truetype');*/

	font-style:normal;
    font-weight:normal;
}
@font-face {
  	font-family:"NanumGothicBold";
    src: url('/Admin/Common/Font/NanumGothic-Bold.eot');
    src: local('※'),
	     url('/Admin/Common/Font/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'),
		 url('/Admin/Common/Font/NanumGothic-Bold.woff') format('woff');/*,
	     url('/Admin/Common/Font/NanumGothicBold.ttf') format('truetype');*/

	font-style:normal;
    font-weight:normal;
}

@font-face {
    font-family:"NanumBarunGothic";
    src:url('/microsite/Common/Fonts/NanumBarunGothic.eot');
	src:local('※'),
		url('/microsite/Common/Fonts/NanumBarunGothic.eot?#iefix') format('embedded-opentype'),
	    url('/microsite/Common/Fonts/NanumBarunGothic.woff') format('woff');
	font-style:normal;
    font-weight:normal;
}

@font-face {
  font-family:'NanumBarunGothicBold';
  font-style: normal;
  font-weight: 600;
  src: url('/microsite/Common/Fonts/NanumBarunGothicBold.eot');
  src: url('/microsite/Common/Fonts/NanumBarunGothicBold.eot?#iefix') format('embedded-opentype'),
       url('/microsite/Common/Fonts/NanumBarunGothicBold.woff') format('woff');
}


@media all and (max-width:768px) {
  html {font-size:10px;}
  body {font-size:1.4rem;}
}