common.css

@charset "utf-8";
/* 200, 300 */
@font-face{
  font-family: NtSansKR;
  font-weight: 200;
  font-style: normal;
  src: url("../fonts/NotoSansKR-Light.eot");
  src: url("../fonts/NotoSansKR-Light.eot#iefix") format("embedded-opentype"),
       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: NtSansKR;
  font-weight: 300;
  font-style: normal;
  src: url("../fonts/NotoSansKR-DemiLight.eot");
  src: url("../fonts/NotoSansKR-DemiLight.eot#iefix") format("embedded-opentype"),
       url("../fonts/NotoSansKR-DemiLight.woff2") format("woff2"),
       url("../fonts/NotoSansKR-DemiLight.woff") format("woff"),
       url("../fonts/NotoSansKR-DemiLight.otf") format("opentype");
}

태그초기화

body,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dd,p,th,td,form,figure,fieldset{
margin: 0;padding: 0;
} 

ul{list-style:none;} 

a:link,a:visited,a:hover,a:active{text-decoration: none;color: inherit;} 

img{border:0;vertical-align:top;} 

h1,h2,h3,h4,h5,h6{font-size: inherit;} 

header,footer,section,article,aside,nav,figure{display: block;} 

table{border-spacing:0;border-collapse: collapse;} 

fieldset,iframe{border: none;} 

 /*  
  주의점 caption은 absolute,테이블 영역 외부로 나가서도 안된다   
   - th와 td의 디자인에 영향을 끼침 ,따라서 position은 사용하지말것. 
 */ 
caption{width: 1px;height: 1px;overflow: hidden;border:none;margin: -1px; 
 clip:rect(1px, 1px, 1px, 1px);clip-path: inset(50%);} 

/* 폼컨트롤요소 모두 부모로부터 폰트 속성을 상속받지 못한다. */ 
input,select,textarea,button{font-size:inherit;font-weight:inherit;
font-family: inherit; color:inherit;} 

/*  
text,password, select 타입만 선택해서 테두리 초기화 
테두리가 두껍게 보이고 그림자가 있는 스타일이 있는 브라우저도 있어서  
크로스브라우징을 위해서 스타일을 통일시켜주어야한다. 
*/ 

input[type="text"],input[type="password"],select{border: 1px solid #aaa;} 

input[type="submit"],input[type="reset"],input[type="button"],button{
border:none;background:0;cursor:pointer;} 

address{font-style: normal;}

common css

.blind_i{width:1px;height:1px;border:none;overflow:hidden;display:inline-block;margin-left:-1px;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);}
.blind_b{width:1px;height:1px;border:none;overflow:hidden;position:absolute;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);}

.clearfix::after{content"";display:block;clear:both;}

.borderbox{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

.f_l{float:left;}
.f_r{float:right;}
.p_a{position:absolute;}
.p_r{position:relative;}

/* skip navigation  */
#skip a{position: absolute;top: 0;left: -9999px;z-index: 100;}
#skip a:focus{left: 0;background: #999999;width: 100%;height: 50px;line-height: 50px;text-align: center;font-weight: 700;color: #ffffff;}

/* #header */

/* #footer */