/* border color */
.bd-primary { border-color:#007bff !important;}
.bd-secondary { border-color:#868e96 !important;}
.bd-success { border-color:#28a745 !important;}
.bd-info { border-color:#17a2b8 !important;}
.bd-warning { border-color:#ffc107 !important;}
.bd-danger { border-color:#dc3545 !important;}
.bd-light { border-color:#f8f9fa !important;}
.bd-dark { border-color:#343a40 !important;}

.bd-blue { border-color:#007bff !important;}
.bd-indigo { border-color:#6610f2 !important;}
.bd-purple { border-color:#6f42c1 !important;}
.bd-pink { border-color:#e83e8c !important;}
.bd-red { border-color:#dc3545 !important;}
.bd-orange { border-color:#fd7e14 !important;}
.bd-yellow { border-color:#ffc107 !important;}
.bd-green { border-color:#28a745 !important;}
.bd-teal { border-color:#20c997 !important;}
.bd-cyan { border-color:#17a2b8 !important;}
.bd-white { border-color:#fff !important;}
.bd-gray { border-color:#868e96 !important;}
.bd-gray-dark { border-color:#343a40 !important;}

/* background color */
.bg-blue { background-color:#007bff !important;}
.bg-indigo { background-color:#6610f2 !important;}
.bg-purple { background-color:#6f42c1 !important;}
.bg-pink { background-color:#e83e8c !important;}
.bg-red { background-color:#dc3545 !important;}
.bg-orange { background-color:#fd7e14 !important;}
.bg-yellow { background-color:#ffc107 !important;}
.bg-green { background-color:#28a745 !important;}
.bg-teal { background-color:#20c997 !important;}
.bg-cyan { background-color:#17a2b8 !important;}
.bg-white { background-color:#fff !important;}
.bg-gray { background-color:#868e96 !important;}
.bg-gray-dark { background-color:#343a40 !important;}

/* text color */
.text-blue { color:#007bff !important;}
.text-indigo { color:#6610f2 !important;}
.text-purple { color:#6f42c1 !important;}
.text-pink { color:#e83e8c !important;}
.text-red { color:#dc3545 !important;}
.text-orange { color:#fd7e14 !important;}
.text-yellow { color:#ffc107 !important;}
.text-green { color:#28a745 !important;}
.text-teal { color:#20c997 !important;}
.text-cyan { color:#17a2b8 !important;}
.text-white { color:#fff !important;}
.text-gray { color:#868e96 !important;}
.text-gray-dark { color:#343a40 !important;}

.btn { white-space:nowrap }


/* button color */
.btn-blue {color: #fff;background-color: #007bff;border-color: #007bff;}
.btn-blue:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-blue:focus, .btn-blue.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-blue:not([disabled]):not(.disabled):active, .btn-blue:not([disabled]):not(.disabled).active, .show > .btn-blue.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-indigo {color: #fff;background-color: #6610f2;border-color: #6610f2;}
.btn-indigo:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-indigo:focus, .btn-indigo.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-indigo:not([disabled]):not(.disabled):active, .btn-indigo:not([disabled]):not(.disabled).active, .show > .btn-indigo.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-purple {color: #fff;background-color: #6f42c1;border-color: #6f42c1;}
.btn-purple:hover {color: #fff;background-color: #4b1ba2;border-color: #411099;}
.btn-purple:focus, .btn-purple.focus {box-shadow: 0 0 0 0.2rem rgba(114, 73, 188, 0.5);}
.btn-purple:not([disabled]):not(.disabled):active, .btn-purple:not([disabled]):not(.disabled).active, .show > .btn-purple.dropdown-toggle {color: #fff;background-color: #4b1ba2;border-color: #411099;box-shadow: 0 0 0 0.2rem rgba(114, 73, 188, 0.5);}

.btn-pink {color: #fff;background-color: #e83e8c;border-color: #e83e8c;}
.btn-pink:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-pink:focus, .btn-pink.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-pink:not([disabled]):not(.disabled):active, .btn-pink:not([disabled]):not(.disabled).active, .show > .btn-pink.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-red {color: #fff;background-color: #dc3545;border-color: #dc3545;}
.btn-red:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-red:focus, .btn-red.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-red:not([disabled]):not(.disabled):active, .btn-red:not([disabled]):not(.disabled).active, .show > .btn-red.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-orange {color: #fff;background-color: #fd7e14;border-color: #fd7e14;}
.btn-orange:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-orange:focus, .btn-orange.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-orange:not([disabled]):not(.disabled):active, .btn-orange:not([disabled]):not(.disabled).active, .show > .btn-orange.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-yellow {color: #111;background-color: #ffc107;border-color: #ffc107;}
.btn-yellow:hover {color: #111;background-color: #e0a800;border-color: #d39e00;}
.btn-yellow:focus, .btn-yellow.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-yellow:not([disabled]):not(.disabled):active, .btn-yellow:not([disabled]):not(.disabled).active, .show > .btn-yellow.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-green {color: #fff;background-color: #28a745;border-color: #28a745;}
.btn-green:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-green:focus, .btn-green.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-green:not([disabled]):not(.disabled):active, .btn-green:not([disabled]):not(.disabled).active, .show > .btn-green.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-teal {color: #fff;background-color: #20c997;border-color: #20c997;}
.btn-teal:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-teal:focus, .btn-teal.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-teal:not([disabled]):not(.disabled):active, .btn-teal:not([disabled]):not(.disabled).active, .show > .btn-teal.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-cyan {color: #fff;background-color: #17a2b8;border-color: #17a2b8;}
.btn-cyan:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-cyan:focus, .btn-cyan.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-cyan:not([disabled]):not(.disabled):active, .btn-cyan:not([disabled]):not(.disabled).active, .show > .btn-cyan.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-white {color: #111;background-color: #fff;border-color: #fff;}
.btn-white:hover {color: #111;background-color: #e0a800;border-color: #d39e00;}
.btn-white:focus, .btn-white.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-white:not([disabled]):not(.disabled):active, .btn-white:not([disabled]):not(.disabled).active, .show > .btn-white.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-gray {color: #fff;background-color: #868e96;border-color: #868e96;}
.btn-gray:hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-gray:focus, .btn-gray.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-gray:not([disabled]):not(.disabled):active, .btn-gray:not([disabled]):not(.disabled).active, .show > .btn-gray.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}

.btn-gray-dark {color: #fff;background-color: #343a40;border-color: #343a40;}
.btn-gray-dark :hover {color: #fff;background-color: #e0a800;border-color: #d39e00;}
.btn-gray-dark:focus, .btn-gray-dark.focus {box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}
.btn-gray-dark:not([disabled]):not(.disabled):active, .btn-gray-dark:not([disabled]):not(.disabled).active, .show > .btn-gray-dark.dropdown-toggle {color: #fff;background-color: #0062cc;border-color: #005cbf;box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);}


.non-responsive body:not(.inframe):not(.popup),
.non-responsive .container {
  min-width:100% !important;
}

/* container in a column must be auto not 1140px */
.non-responsive [class^="col-"] .container {
  min-width:auto;
}

/* button extra small size */
.btn-xs, .btn-group-xs > .btn {
  padding: 0.1rem 0.5rem;
  font-size: 0.78rem;
  line-height: 1.5;
  border-radius: 0.2rem;
}

.btn-xs + .dropdown-toggle-split, .btn-group-xs > .btn + .dropdown-toggle-split {
  padding-right: 0.275rem;
  padding-left: 0.275rem;
}
/* --button extra small size */

.nav-tabs {
  border-bottom: 1px solid #888;
  margin:0 0 20px;
  overflow: hidden;
}

.nav-tabs > li {
  float: left;
  margin-right:3px !important;
}

.nav-tabs > li > a {
  border: 1px solid #ddd;
  border-bottom: none;
  margin-right: -1px;
  position: relative;
  display: block;
  padding: 3px 15px;
  height:100%;
  background-color: #cccccc;
  color: #666;
  font-size: 0.80rem;
  position: relative;
}
.nav-tabs > li.active > a,
.nav-tabs > li > a:focus,
.nav-tabs > li > a:hover {
  color: #222;
  background-color: #fff;
  z-index: 2;
}


/* grid : large first */
/* ex, col-sm-6 is the lastest applied size for col-md-4 col-sm-6 */
.non-responsive .col-sm-12,
.non-responsive .col-md-12,
.non-responsive .col-lg-12,
.non-responsive .col-xl-12,
.non-responsive .col-12 {
  width: 100%;
}

.non-responsive .col-sm-11,
.non-responsive .col-md-11,
.non-responsive .col-lg-11,
.non-responsive .col-xl-11,
.non-responsive .col-11 {
  width: 91.666667%;
}

.non-responsive .col-sm-10,
.non-responsive .col-md-10,
.non-responsive .col-lg-10,
.non-responsive .col-xl-10,
.non-responsive .col-10 {
  width: 83.333333%;
}

.non-responsive .col-sm-9,
.non-responsive .col-md-9,
.non-responsive .col-lg-9,
.non-responsive .col-xl-9,
.non-responsive .col-9 {
  width: 75%;
}

.non-responsive .col-sm-8,
.non-responsive .col-md-8,
.non-responsive .col-lg-8,
.non-responsive .col-xl-8,
.non-responsive .col-8 {
  width: 66.666667%;
}

.non-responsive .col-sm-7,
.non-responsive .col-md-7,
.non-responsive .col-lg-7,
.non-responsive .col-xl-7,
.non-responsive .col-7 {
  width: 58.333333%;
}

.non-responsive .col-sm-6,
.non-responsive .col-md-6,
.non-responsive .col-lg-6,
.non-responsive .col-xl-6,
.non-responsive .col-6 {
  width: 50%;
}

.non-responsive .col-sm-5,
.non-responsive .col-md-5,
.non-responsive .col-lg-5,
.non-responsive .col-xl-5,
.non-responsive .col-5 {
  width: 41.666667%;
}

.non-responsive .col-sm-4,
.non-responsive .col-md-4,
.non-responsive .col-lg-4,
.non-responsive .col-xl-4,
.non-responsive .col-4 {
  width: 33.333333%;
}

.non-responsive .col-sm-3,
.non-responsive .col-md-3,
.non-responsive .col-lg-3,
.non-responsive .col-xl-3,
.non-responsive .col-3 {
  width: 25%;
}

.non-responsive .col-sm-2,
.non-responsive .col-md-2,
.non-responsive .col-lg-2,
.non-responsive .col-xl-2,
.non-responsive .col-2 {
  width: 16.666667%;
}

.non-responsive .col-sm-1,
.non-responsive .col-md-1,
.non-responsive .col-lg-1,
.non-responsive .col-xl-1,
.non-responsive .col-1 {
  width: 8.333333%;
}

.form-inline { display:block; }

/* all col-* */
[class^="col-"] {
  float: left;
}


/* form */
.form-control {height: auto}

.non-responsive .form-inline {
  display:block;
}

.non-responsive .form-inline label {
  margin-bottom:0;
  display: inline-block;
}

.non-responsive .form-inline .form-control {
  display: inline-block;
  width: auto;
  vertical-align: middle;
}

.non-responsive .form-inline .input-group .form-control {
  width:1%;
}
.non-responsive .form-inline .input-group.bootstrap-filestyle .form-control {
  display:inline-block;
  flex: none;
  width:auto !important;
}


/* focus에 대한 box shadow가 너~~무 크다 ... 아주 작게 줄임 */
.form-control:focus {
  box-shadow: none;
  /*
  box-shadow: 0 0 0 0.03rem rgba(0, 123, 255, 0.25);
  */
}

/* <label><input...></label> 처럼 사용할 경우지만,
   <input...><label>...</label>처럼 사용할 경우는 margin-left가 있으면 안된다. */
.form-check-input {
  margin-left: 0rem;
}

/* form size */
.form-sm .form-control,
.form-sm .input-group > .form-control,
.form-sm .input-group > .input-group-addon,
.form-sm .input-group > .input-group-btn > .btn {
  padding: .24rem .2rem;
  font-size: .75rem;
}

.form-sm .input-group > .input-group-btn > select.btn:not([size]):not([multiple]),
.form-sm .input-group > select.form-control:not([size]):not([multiple]),
.form-sm .input-group > select.input-group-addon:not([size]):not([multiple]),
.form-sm select.form-control:not([size]):not([multiple]) {
  height: calc(1.5rem + 4px);
}


/* border radius */
.non-radius .btn,
.non-radius .list-group-item:first-child,
.non-radius .dropdown-menu,
.non-radius .form-control,
.non-radius .input-group-addon,
.non-radius .input-group-text,
.non-radius .alert,
.non-radius .page-item:first-child .page-link,
.non-radius .page-item:last-child .page-link {
  border-radius:0 !important;
}

.btn-group-sm>.btn, .btn-sm {
  font-size: .75rem;
}

.input-group-text {
    font-size: 0.7rem;
    padding: .2rem .5rem;
    line-height: 1;
}


.hidden-xs-up {
  display: none !important;
}

@media (max-width: 575px) {
  .hidden-xs-down {
    display: none !important;
  }
}

@media (min-width: 576px) {
  .hidden-sm-up {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .hidden-sm-down {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .hidden-md-up {
    display: none !important;
  }
}

@media (max-width: 991px) {
  .hidden-md-down {
    display: none !important;
  }
}

@media (min-width: 992px) {
  .hidden-lg-up {
    display: none !important;
  }
}

@media (max-width: 1199px) {
  .hidden-lg-down {
    display: none !important;
  }
  .show-lg-down {
    display: block !important;
  }
}

@media (min-width: 1200px) {
  .hidden-xl-up {
    display: none !important;
  }
}

.hidden-xl-down {
  display: none !important;
}