@charset "utf-8";
/* 기본셋팅된 요소 디자인 초기화 */

/* 마진, 패딩 초기화 */
html, body, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, figure, p, blockquote {
    margin: 0;
    padding: 0;
}
html {
    font-family: Arial, sans-serif;
}

/* ul, ol 블릿/숫자 없앰 */
ul, ol {
    list-style: none;
}

/* a요소 - 글자색, 밑줄없앰 */
a {
    color: black;
    text-decoration: none;
}

/* 이미지 관련 */
img {
    border: none;
    /* 이미지 링크시 기본보더 없앰 
    - 서버 배포시에 나올 수 있음 */

    vertical-align: top;
    /* 인라인 요소간 세로정렬 속성을 셋팅한 이유는?
        -> 블록박스 안에 이미지가 단독으로 들어간 경우
            하단에 4px공백이 생김. 이때 이것을 없애기 위해
            vaertical-align 속성을 top/middle/bottom 값을
            사용하면 공백이 없어진다. (단, 블록박스의 높이값은
            auto 이며 이미지에 의해 블록박스의 높이가 
            결정되는 경우에 한한다. */
}

/* 포커스 아웃라인 제거
모든 브라우저에 기본 포커스 아웃라인 셋팅됨 */
input:focus,
select:focus {
    outline: none;
}