@charset "UTF-8";
/**
 * Copyright (c) 2017~2022, OBCon Inc.
 * All rights reserved.
 */

/**
 * @file
 * @copyright 2017~2022, OBCon Inc.
 * @author gye hyun james kim [pnuskgh@gmail.com]
 */

/***************************************************************************************************
 *  전체 설정
 **************************************************************************************************/
/* Bootstrap Icons 1.9.0 : https://icons.getbootstrap.com/ */
@font-face {
    font-family: "bootstrap-icons";
    src: url(./fonts/bootstrap-icons.woff2) format("woff2"), url(./fonts/bootstrap-icons.woff) format("woff");
}

:root {                                                     /* 전역 변수 지정 */
    --container-width: 1080px;                              /* 화면의 최대 넓이 */
    --font-large: 18px;
    --font-normal: 16px;
    --font-small: 14px;
    --gap: 4px;                                             /* 항목간의 간격 */
}

* {
    font-family: 'Nanum Gothic', sans-serif;                /* Google의 Web Font 설정 */
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';

    box-sizing: border-box;
    line-height: 1.5;
}

html {
    height: 100%;
    font-size: var(--font-normal);
}

body {
    height: 100%;
    background-color: white;
    margin: 0px;
    border: 0px;
    padding: 0px;
    display: block;
}

.form-control[readonly] {
    background-color: #e9ecef;
}

/***************************************************************************************************
 *  Header 설정
 **************************************************************************************************/
header {
    font-size: var(--font-large);
} 

header > section:first-child > nav {
    max-width: var(--container-width);
}

header .material-icons-outlined {
    font-size: var(--font-large) !important;
}

header a[class=navbar-brand] {
    padding-top: 0px;
    padding-bottom: 0px;
}

header a[class=navbar-brand] > img {
    height: calc(2 * var(--font-large));
}

header form button {
    width: 70px;
}

/***************************************************************************************************
 *  Content 설정
 **************************************************************************************************/
main {
    font-size: var(--font-normal);
    margin-left: var(--gap);
    margin-right: var(--gap);
}

main a {
    text-decoration-line: none;
}

main section article {
    max-width: var(--container-width);
}

main ul {
    margin-top: calc(2 * var(--gap));
}

main li {
    margin-bottom: calc(2 * var(--gap));
}

main table {
    font-size: var(--font-small) !important;
}

/***************************************************************************************************
 *  Footer 설정
 **************************************************************************************************/
footer {
    font-size: var(--font-normal);
}

footer a {
    color: white;
    text-decoration-line: none;
    text-decoration-color: greenyellow;
    cursor: pointer;
}

footer > section > article {
    max-width: var(--container-width);
}

footer > section > article:first-child a:not(:nth-child(5))::after {
    content: '|'; 
    color: white;
    padding-left: calc(2 * var(--gap));
    padding-right: calc(2 * var(--gap));
}

footer > section > article:first-child select {
    padding-top: 0px;
    padding-bottom: 0px;
    width: 260px;
}

footer > section > article:nth-child(2) :not(:last-child)::after {
    content: '|';
    padding-left: calc(2 * var(--gap));
    padding-right: calc(2 * var(--gap));
}

/***************************************************************************************************
 *  Body 설정
 **************************************************************************************************/
