/* basic.css */

@import url( "nanumsquare.css" );
@import url( "https://fonts.googleapis.com/earlyaccess/nanumgothic.css" );
@import url("https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&family=Noto+Serif+KR&display=swap");



*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font:14px/1.4 "NanumSquare","³ª´®°íµñ", "NanumGothic", "µ¸¿ò",Dotum,"Helvetica", "sans serif";font-weight:400;}
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}
body{position:relative;}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a{text-decoration:none;color:#777;}
a:hover{text-decoration:none;}
table{border-collapse:collapse}

header,section,article,footer,nav,address {display:block;}

/* skip */
#skip{position:relaitve;} 
#skip a{position:absolute;top:-30px;left:0;width:138px;text-align:center;outline:none;background-color:#000;} 
#skip a span{display:inline-block;padding:2px 6px 0 0;font-size:.92em;line-height:26px;color:#fff;letter-spacing:-1px;} 
#skip a:focus, #skip a:active{top:0;} 
/* skip end */

/* input form reset */
label{margin-left:0;}
img, input, button, select, textarea{vertical-align:middle;margin:0;padding:0;}
input, textarea, select{letter-spacing:normal;font-family:"Noto Sans KR";}
input, select, button{position:relative;-webkit-appearance:none;-moz-appearance:none;}
button{padding:7px 10px;vertical-align:middle;font-size:12px;border:1px solid #d3d3d3;background:#fff;color:#000;box-sizing:border-box;font-family:"³ª´®°íµñ", "NanumGothic";}
.button{display:inline-block;padding:5px 10px;vertical-align:middle;font-size:12px;border:1px solid #d3d3d3;background:#fff;color:#000;box-sizing:border-box;font-family:"³ª´®°íµñ", "NanumGothic";}
select{font-size:14px;color:#000;border:1px solid #d3d3d3;border-radius:0;padding:5px 30px 5px 10px;background:#fff url(../img/common/select_arrow.png) no-repeat right center;background-size:24px auto;box-sizing:border-box;font-family:"³ª´®°íµñ", "NanumGothic"}
select::-ms-expand{display: none;}
input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="number"], input[type="date"], input[type="datetime"], input[type="month"], input[type="seach"]{padding:5px 10px 5px 10px;border-radius:0;border:1px solid #d3d3d3;color:#000;font-size:1.0em;box-sizing:border-box;font-family:"³ª´®°íµñ", "NanumGothic";}
input[type='date']{position:relative;}
::-webkit-datetime-edit, ::-webkit-clear-button, ::-webkit-calendar-picker-indicator{position:absolute;}
::-webkit-clear-button{right:1.54em;}
::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
::-webkit-calendar-picker-indicator{right:0; padding:.539em .34em;}
::-webkit-inner-spin-button{display:none;}
input[type="checkbox"]{-webkit-appearance:none;-moz-appearance:none;width:20px;height:20px;padding:0;background:url(../img/common/checkbox_off.png);background-size:20px 20px;border:0;border-radius:0;cursor:pointer;}
input[type="checkbox"]:checked{background:url(../img/common/checkbox_on.png);background-size:20px;}
input[type="radio"]{-webkit-appearance:none;-moz-appearance:none;width:20px;height:20px;padding:0;background:url(../img/common/radio_off.png);background-size:20px 20px;border:0;border-radius:0;cursor:pointer;}
input[type="radio"]:checked{background:url(../img/common/radio_on.png);background-size:20px;border:0;}
input[type="tel"][disabled], input[type="tel"][readonly], input[type="text"][disabled], input[type="text"][readonly], input[type="password"][disabled], input[type="password"][readonly], input[type="email"][disabled], input[type="email"][readonly],input[type="number"][disabled], input[type="number"][readonly] {border: 1px solid #d3d3d3;background: #eaeaea;}
select, input, textarea, button{font-family:"³ª´®°íµñ", "Nanum Gothic", "sans serif";box-sizing:border-box;}


[class*="col-"]{float:left;}

.col-10	{width:10%;}
.col-11	{width:11%;}
.col-12	{width:12%;}
.col-13	{width:13%;}
.col-15	{width:15%;}
.col-20	{width:20%;}
.col-23	{width:23%;}
.col-25	{width:25%;}
.col-30	{width:30%;}
.col-40	{width:40%;}
.col-50	{width:50%;}


@media only screen and (min-width: 1025px) {
	
	.col-l-0{display:none;}
	.col-l-1{width:8.33%;}
	.col-l-2{width:16.66%;}
	.col-l-3{width:25%;}
	.col-l-4{width:33.33%;}
	.col-l-5{width:41.66%;}
	.col-l-6{width:50%;}
	.col-l-7{width:58.33%;}
	.col-l-8{width:66.66%;}
	.col-l-9{width:75%;}
	.col-l-10{width:83.33%;}
	.col-l-11{width:91.66%;}
	.col-l-12{width:100%;}
	.col-l-13{width:33.33%;}

}

@media only screen and (min-width: 769px) {
	
	.col-m-0{display:none;}
	.col-m-1{width:8.33%;}
	.col-m-2{width:16.66%;}
	.col-m-3{width:25%;}
	.col-m-4{width:33.33%;}
	.col-m-5{width:41.66%;}
	.col-m-6{width:50%;}
	.col-m-7{width:58.33%;}
	.col-m-8{width:66.66%;}
	.col-m-9{width:75%;}
	.col-m-10{width:83.33%;}
	.col-m-11{width:91.66%;}
	.col-m-12{width:100%;}
	.col-m-13{width:33.33%;}
}

@media only screen and (max-width: 768px) {

	.col-s-0{display:none;}
	.col-s-1{width:8.33%;}
	.col-s-2{width:16.66%;}
	.col-s-3{width:25%;}
	.col-s-4{width:33.33%;}
	.col-s-5{width:41.66%;}
	.col-s-6{width:50%;}
	.col-s-7{width:58.33%;}
	.col-s-8{width:66.66%;}
	.col-s-9{width:75%;}
	.col-s-10{width:83.33%;}
	.col-s-11{width:91.66%;}
	.col-s-12{width:100%;}
	.col-s-13{width:33.33%;}
	.col-s-14{width:21.66%;}
	.col-s-15{width:10%;}

	.col-10	{width:10%;}
	.col-11	{width:20%;}
	.col-12	{width:12%;}
	.col-13	{width:18%;}
	.col-15	{width:18%;}
	.col-20	{width:30%;}
	.col-23	{width:30%;}
	.col-25	{width:36%;}
	.col-30	{width:30%;}
	.col-40	{width:40%;}
	.col-50	{width:50%;}
}
