﻿/*******************************************/
/* Default Style */
/******************************************/
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; font-size: 12px; color: #333; font-family: NanumGothic; } /*font-weight: 600;*//*font-family: Dotum;*/

html, body, form { width: 100%; height: 100%; }
/*body { }*/
header, footer, section, aside, nav, article { display: block; }
input, select, div, textarea { vertical-align: middle; }
img { vertical-align: middle; }
img, fieldset { border: none;  }
ul, ol, dl { list-style: none; }
strong { font-weight: 800; }
em { font-style: oblique; }

/* Link Style */
a { text-decoration: none; color: #333; /*font-weight: 800;*/ /*transition: color 0.2s ease-in-out;*/ }
/*a:link { text-decoration: none; color: #fff; }
a:visited { text-decoration: none; color: #fff; }
a:active { text-decoration: none; color: #fff; }*/
a:hover { text-decoration: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /* IE 5-7 */ filter: alpha(opacity=70); /* Netscape */ -moz-opacity: 0.7; /* Safari 1.x */ -khtml-opacity: 0.7; /* Good browsers */ opacity: 0.7; }
a.ck-none { cursor: default; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 5-7 */ filter: alpha(opacity=100); /* Netscape */ -moz-opacity: 1; /* Safari 1.x */ -khtml-opacity: 1; /* Good browsers */ opacity: 1; }

/* From Style */
input, select, textarea {
    border: 1px solid #cbcbcb;
    /*vertical-align: middle;*/
    /*box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;*/
    /*border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;*/
    width: 99.5%;
    color: #666;    
}
input, select {
    height: 27px;
}
textarea {
    padding: 5px;
    /*border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;*/
}
button, label { cursor: pointer; }
input[type=image] { width: auto; border: none; }
select { padding-left: 5px; }
input[type=checkbox], input[type=radio] { width: 15px; height: 15px; border: 1px solid #cbcbcb; }
input[type=text], input[type=password] { padding: 5px; }
/*input[type=text], input[type=password], textarea, select {  }*/
input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus { border: 1px solid #666; outline: none; }
input[type=button]:focus, input[type=image]:focus { outline: none; }
input[type=text]::-ms-clear { display:none; }
input[disabled], select[disabled] { background-color: #f2f2f2; cursor: not-allowed; }
input[readonly] { background-color: #f2f2f2; cursor: not-allowed; }
input[readonly].txtRight, input.txtRight, input[readonly].txtR, input.txtR, .txtR { text-align: right; }
input[readonly].txtC, input.txtC, .txtC { text-align: center; }
input::-webkit-input-placeholder { color: #ccc; }
textarea::-webkit-input-placeholder { color: #ccc; }
input:-moz-placeholder { color: #ccc; }
textarea:-moz-placeholder { color: #ccc; }
input::-moz-placeholder { color: #ccc; }
textarea::-moz-placeholder { color: #ccc; }
input:-ms-input-placeholder { color: #ccc; }
textarea:-ms-input-placeholder { color: #ccc; }
input:-mos-input-placeholder { color: #ccc; }
input::placeholder { color: #ccc; opacity: 1; } /* IE10 이상을 위한 css */

.required,
input.required,
select.required,
textarea.required {
    border: 2px solid #1e8fbe;
}

/* Table Style */
table { border-collapse: collapse; border-spacing: 0; width: 100%; text-align: center; }
table td img { vertical-align: middle; }
th { padding: 10px; white-space: nowrap; }
td { padding: 10px; word-break:break-all; }
td.nowrap { white-space:nowrap; }
th.thL, td.tdL { text-align: left; }
th.thR, td.tdR { text-align: right; }
th.thChk { padding: 0; }
td.tdC { text-align: center; }

/* font size */
.ftSize10 { font-size: 10px; }
.ftSize11 { font-size: 11px; }
.ftSize12 { font-size: 12px; }
.ftSize13 { font-size: 13px; }
.ftSize14 { font-size: 14px; }
.ftSize16 { font-size: 16px; }
.ftSize18 { font-size: 18px; }
.ftNormal { font-weight: normal; }
.ftBold { font-weight: 800; }

/*color*/
.colGray { color: #666; }
.colGray2 { color: #d7d7d7; }
.colBlue { color: #1d6fb5; }
.colBlue2 { color: #0266c1; }
.colWhite { color: #FFFFFF; }
.colRed { color: #e23321; }
.colGreen { color: #487A38; }
.colGreen2 { color: #1fd11f; }
.colOrange { color: #fa7d1b; }
.colOrange2 { color: #ff4800; }
.colBlack { color: #333; }
.colPink { color: #D66C7B; }
.colPurple { color: #7D2A8B; }
.colYellow { color: #abab13; }
.colWhite { color: #FFFFFF; }
.colBrown { color: #b75013; }
.colSky { color: #02a6a6; }

/* button */
.btn, a.btn { display: inline-block; width: auto; cursor: pointer; padding: 8px 17px; font-size: 12px; font-weight: bold; vertical-align: middle; border-radius: 100px; margin: 0 2px; }
.btnS, a.btnS { padding: 5px 8px; margin: 0; }

.btnIn { display: block; width: auto; cursor: pointer; padding: 3px 6px; font-size: 11px; font-weight: bold; vertical-align: middle; border-radius: 4px; margin: 0 2px; line-height: normal; }

.btnWhite, a.btnWhite { background: #fff; border: 1px solid #ccc; color: #003c76; }
.btnNavy, a.btnNavy { background: #003c76; border: none; color: #fff; }
.btnRed, a.btnRed { background: #ea6767; border: none; color: #fff; }
.btnGreen, a.btnGreen { background: #42843b; border: none; color: #fff; }
.btnBlue, a.btnBlue { background: #006fc1; border: none; color: #fff; }
.btnGray, a.btnGray { background: #838383; border: none; color: #fff; }
.btnBlack, a.btnBlack { background: #000; border: none; color: #fff; }

.btnGrdtSky, a.btnGrdtSky {
    border: 1px solid #002157;
    color: #001a4a;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,#bddeff+100 */
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #bddeff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #bddeff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #bddeff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bddeff',GradientType=0 ); /* IE6-9 */
}

.btnGrdtGray, a.btnGrdtGray {
    border: 1px solid #002157;
    color: #001a4a;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,#d0d0d0+100 */
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #d0d0d0 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #d0d0d0 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #d0d0d0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d0d0d0', GradientType=0 ); /* IE6-9 */
}

/* margin */
.mgT3 { margin-top: 3px; }
.mgT5 { margin-top: 5px; }
.mgT10 { margin-top: 10px; }
.mgT20 { margin-top: 20px; }
.mgB3 { margin-bottom: 3px; }
.mgB5 { margin-bottom: 5px; }
.mgB10 { margin-bottom: 10px; }
.mgTB10 { margin-top: 10px; margin-bottom: 10px; }

/* padding */
.pdT3 { padding-top: 3px; }
.pdT5 { padding-top: 5px; }
.pdT10 { padding-top: 20px; }
.pdT20 { padding-top: 20px; }
.pdB5 { padding-bottom: 5px; }
.pdB10 { padding-bottom: 10px;}
.pdTB10 { padding-top: 10px; padding-bottom: 10px; }
.pdR20 { padding-right: 20px; }
.pd10 { padding: 10px; }

.btnCenter { display: block; text-align: center; }
.btnRight { display: block; text-align: right; }
.btnPointer { cursor: pointer; }

.text-ellipsis { display: table; table-layout: fixed; width: 100%; white-space: nowrap; }
.text-ellipsis > * { display: table-cell; overflow: hidden; text-overflow: ellipsis; }