@charset "utf-8";
/* *******************************************************
 common.css
 공통적으로 사용되는 클래스 CSS

******************************************************** */


.cm-fl { float:left; }
.cm-fr { float:right; }

.cm-cb { clear:both; }
.cm-cf { clear:both; height:1px; }

.cm-pr { position:relative; }
.cm-pa { position:absolute; }

.cm-al { text-align:left !important; }
.cm-ac { text-align:center !important; }
.cm-ar { text-align:right !important; }
.cm-aj { text-align:justify !important; }

.cm-vt { vertical-align:top; }
.cm-vm { vertical-align:middle; }
.cm-vb { vertical-align:bottom; }

.cm-oh { overflow:hidden; }

.cm-cp { cursor:pointer; }

.cm-di { display:inline; }
.cm-db { display:block; }
.cm-dn { display:none; }

.cm-vv { visibility:visible; }
.cm-vh { visibility:hidden; }

.cm-bn { border:0 none; }
.cm-btn { border-top:0 none; }
.cm-brn { border-right:0 none; }
.cm-bbn { border-bottom:0 none; }
.cm-bln { border-left:0 none; }

.cm-bgn { background:none; }

.cm-fb { font-weight:bold; }
.cm-f600 { font-weight:600; }
.cm-f700 { font-weight:700; }
.cm-f800 { font-weight:800; }

.cm-alert-ie { margin:0; padding:1em; font-size:12px; letter-spacing:-1px; color:#ebebeb; background:#808080; }
.cm-alert-ie a { color:#ffd6c2; }
.cm-alert-ie a:hover { color:#ffd6c2; }
.cm-alert-ie a:focus { color:#ffd6c2; }
.cm-alert-ie a:active { color:#ffd6c2; }

.cm-accessibility a { position:absolute; text-align:center; width:200px; display:block; background:#c52227; color:#fff; left:-9999px; }
.cm-accessibility a:hover { z-index:999999; margin-left:-100px; left:50%; }
.cm-accessibility a:focus { z-index:999999; margin-left:-100px; left:50%; }
.cm-accessibility a:active { z-index:999999; margin-left:-100px; left:50%; }


/* 공통 :: 가로값지정 */
.width10{width:10% !important;}
.width20{width:20% !important;}
.width30{width:30% !important;}
.width40{width:40% !important;}
.width50{width:50% !important;}
.width60{width:60% !important;}
.width70{width:70% !important;}
.width80{width:80% !important;}
.width90{width:90% !important;}
.width100{width:100% !important;}


/* 공통 ::간격 */
.mt0{margin-top:0px !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt25{margin-top:25px !important}
.mt30{margin-top:30px !important}
.mt35{margin-top:35px !important}
.mt40{margin-top:40px !important}
.mt45{margin-top:45px !important}
.mt50{margin-top:50px !important}
.mt55{margin-top:55px !important}
.mt60{margin-top:60px !important}
.mt65{margin-top:65px !important}
.mt70{margin-top:70px !important}
.mt75{margin-top:75px !important}
.mt80{margin-top:80px !important}
.mt85{margin-top:85px !important}
.mt90{margin-top:90px !important}
.mt95{margin-top:95px !important}
.mt100{margin-top:100px !important}
.mt110{margin-top:110px !important}
.mb5{ margin-bottom:5px !important}
.mb10{ margin-bottom:10px !important}
.mb15{ margin-bottom:15px !important}
.mb20{ margin-bottom:20px !important}
.mb30{ margin-bottom:30px !important}
.mb40{ margin-bottom:40px !important}
.mb50{ margin-bottom:50px !important}
.mb100{ margin-bottom:100px !important}

.ml0{margin-left:0px !important;}
.ml5{margin-left:5px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px !important;}
.ml30{margin-left:30px !important;}
.ml35{margin-left:35px !important;}
.ml40{margin-left:40px !important;}

.mr0{ margin-right:0px !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mr25{margin-right:25px !important;}
.mr30{margin-right:30px !important;}
.mr35{margin-right:35px !important;}
.mr40{margin-right:40px !important;}


.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pl20{padding-left:20px !important;}
.pl25{padding-left:25px !important;}
.pl30{padding-left:30px !important;}

.vm{ vertical-align:middle}


.form-control:focus {
    border-color: rgba(0, 0, 0, 0.3);
    outline: 0;
    /* -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); */
}

.form-control::-moz-placeholder {
    color: #aaa;
    opacity: 1;
}

.form-control:-ms-input-placeholder {
    color: #aaa;
}

.form-control::-webkit-input-placeholder {
    color: #aaa;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    /* cursor: not-allowed; */
    /* background-color: #eee; */
    opacity: 1;
}

textarea.form-control {
    height: auto;
}

input[type="search"] {
    -webkit-appearance: none;
}


input[type="text"] {padding:3px 15px; width:100%; font-family:'NotoSans-Light', '맑은 고딕', 'Malgun Gothic', sans-serif; color:#000; background:#fff; -webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; outline: none;}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 0;
}
.input-group-addon,
.input-group-btn,
.input-group .form-control {
    display: table-cell;
}

.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0;
}


.input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

.input-group[class*="col-"] {
    float: none;
    padding-right: 0;
    padding-left: 0;
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
}
.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap;
}

.input-group-btn > .btn {
    position: relative;
}

.input-group-btn > .btn + .btn {
    margin-left: -1px;
}

.input-group-btn > .btn:hover,
.input-group-btn > .btn:focus,
.input-group-btn > .btn:active {
    z-index: 2;
}

.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group {
    margin-right: -1px;
}

.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group {
    margin-left: -1px;
}

.input-group-addon,
.input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.input-group-addon.input-sm {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px;
}

.input-group-addon.input-lg {
    padding: 10px 16px;
    font-size: 18px;
    border-radius: 6px;
}

.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
    margin-top: 0;
}


.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #aaa;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
}
*{margin:0; padding:0; box-sizing:border-box}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


.gray.btn{background:#444444; border-color:#444444; color:#FFFFFF}/* FORMS&셀렉트박스 */

 /* FORMS&셀렉트박스 */
.form-control {}
select.form-control {background:#fff url(../images/sub/arr_select_board.gif) no-repeat 100% 50%;padding-top: 0;padding-bottom: 0;padding-right:30px; -webkit-appearance:none;-moz-appearance:none;appearance:none;line-height: normal; position: relative;}
select::-ms-expand {display:none;}
input.calendar {background:#fff url(/images/ico_cal.png) no-repeat 95% 50%;padding-right: 40px;}
.radio label, .checkbox label, .radio-inline, .checkbox-inline {padding-left: 1.5em;}
.radio-inline label, .checkbox-inline label {padding-left: 0;}
.checkbox {}
.checkbox label:before {content: ""; display: inline-block; position: absolute; width: 1.3em; height: 1.3em; left: 0; border: 1px solid #ccc; border-radius: 3px; background-color: #fff;}
.checkbox label:after {display: inline-block; position: absolute; width: 1.3em; height: 1.3em; text-align: center; left: 0; top: 0; line-height: 1.3; color: #555;font-family: 'LineAwesome'; font-weight: bold}
.checkbox input[type="checkbox"] {opacity: 0;}
.checkbox input[type="checkbox"]:checked + label:after {content: "\f17b";}
.checkbox input[type="checkbox"]:disabled + label {opacity: 0.65;}
.checkbox input[type="checkbox"]:disabled + label:before {background-color: #eeeeee; cursor: not-allowed;}
.checkbox.checkbox-circle label:before {border-radius: 50%;width: 1.3em; height: 1.4em;}
.checkbox.checkbox-toggle label {padding-left: 3.5em;}
.checkbox.checkbox-toggle label:before {content: "";width: 3em;height: 1.5em; border-radius: 20px;border: 1px solid #ddd; background: none; z-index: 1}
.checkbox.checkbox-toggle label:after {content: "";width: 1.5em;height: 1.5em; left: 0; top: 0;border: 2px solid #fff; border-radius: 50%; background: #bbb; transition: left 0.3s;}
.checkbox.checkbox-toggle input[type="checkbox"]:checked + label:before {}
.checkbox.checkbox-toggle input[type="checkbox"]:checked + label:after {content: ""; left: 1.5em; background: #555; transition: left 0.3s;}
.checkbox.checkbox-xs label {font-size: 0.9em}
.checkbox.checkbox-lg label {font-size: 1.23999em}