/* reset font */
html{
    font-size: 62.5% !important;
    scroll-behavior: smooth;
}

/* not draggable */
body{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-use-select: none;
    user-select: none;
}

/* <a> tag */
a, a:hover, a:focus{
    text-decoration: none;
    color: inherit;
}


/* placeholder */
input::placeholder{
    color: 210, 210, 210;
}


/* color setting */
:root {
    --color_1: #000000; 
    --color_2: #ffffff; 
    --color_3: #00091f;
    --color_4: #000d2e;
    --color_5: #00154a;
    --color_6: #2F508F; /* header top text */
    --color_7: #10328a;
    --color_8: #5A6B88; /* header top logo bg */
    --color_9: #E7E6E6; /* header top text bg */
    --color_10: #2a2a2a;
    --color_11: #18233f; /* header bg */
    --color_12: #334984; /* header active bg */
    --color_13: #5b6988; /* title text color */
    --color_14: #c1c9dc; /* header text color */
    --color_15: #5B6988; /* btn - available */
    --color_16: #ebecf0; /* point bg color */
    --color_17: #1d2b4d; /* header home bg */
    --color_18: #e8e8e8; /* display box bg */
    --color_19: #b5b5b5; /* btn - diable border */
    --color_20: #dbdbdb; /* btn - diable */ 
    --color_21: #d12323; /* color red */ 

    --f_12: 1.2rem;
    --f_15: 1.5rem;
    --f_17: 1.7rem;
    --f_20: 2rem;
    --f_25: 2.5rem;
}

.color_1{
    color: var(--color_1);
}
.color_2{
    color: var(--color_2);
}
.color_3{
    color: var(--color_3);
}
.color_4{
    color: var(--color_4);
}
.color_5{
    color: var(--color_5);
}
.color_6{
    color: var(--color_6);
}
.color_7{
    color: var(--color_7);
}
.color_8{
    color: var(--color_8);
}
.color_9{
    color: var(--color_9);
}
.color_10{
    color: var(--color_10);
}
.color_11{
    color: var(--color_11);
}
.color_12{
    color: var(--color_12);
}
.color_13{
    color: var(--color_13);
}
.color_14{
    color: var(--color_14);
}
.color_15{
    color: var(--color_15);
}
.color_16{
    color: var(--color_16);
}
.color_17{
    color: var(--color_17);
}

.bg_1{
    background: var(--color_1);
}
.bg_2{
    background: var(--color_2);
}
.bg_3{
    background: var(--color_3);
}
.bg_4{
    background: var(--color_4);
}
.bg_5{
    background: var(--color_5);
}
.bg_6{
    background: var(--color_6);
}
.bg_7{
    background: var(--color_7);
}
.bg_8{
    background: var(--color_8);
}
.bg_9{
    background: var(--color_9);
}
.bg_10{
    background: var(--color_10);
}
.bg_11{
    background: var(--color_11);
}
.bg_12{
    background: var(--color_12);
}
.bg_13{
    background: var(--color_13);
}
.bg_14{
    background: var(--color_14);
}
.bg_15{
    background: var(--color_15);
}
.bg_16{
    background: var(--color_16);
}
.bg_17{
    background: var(--color_17);
}
.bg_18{
    background: var(--color_18);
}
.bg_19{
    background: var(--color_19);
}
.bg_20{
    background: var(--color_20);
}



/* font-weight */
.fw-n{
    font-weight: normal;
}
.fw-b{
    font-weight: bold;
}


/* li style */
li{
    list-style-position : inside
}


/* input or input role dropdown */
/* disable input bg */
input:disabled{
    background-color: var(--color_20);
}
.inputDisabled{
    background-color: var(--color_20);
}

/* input focus */
input:focus, input:focus-visible{
    outline: none;
} 
textarea:focus {
    outline: none;
}