@charset "UTF-8";

.navibar {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 40px;
  border: 1px solid #dddddd;
  background-color: #eeeeee;
}

.navibar div.grp {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  /* margin: 0px 4px; */
  padding: 0px 4px;
  height: 100%;
}

.navibar div.grp:nth-child(1) {
  margin-left: 4px;
}

.navibar div.grp > label {
  margin-bottom: 0;
  color: #333333;
}

.navibar div.grp > label.title {
  color: #2196f3;
}

.navibar div.grp > label.result {
  color: #2196f3;
}

.navibar div.grp > input[type='text'] {
  height: 28px;
  line-height: 26px;
  padding: 0px 5px;
  box-sizing: border-box;
  border: 1px solid #dadada;
}

.navibar div.grp > input[type='date'] {
  height: 28px;
  line-height: 26px;
  padding: 0px 5px;
  box-sizing: border-box;
  border: 1px solid #dadada;
}

.navibar div.grp > input[type='checkbox'] {
  border: 1px solid #dadada;
}

.navibar div.grp > input[type='button']:nth-child(n + 2) {
  margin-left: 4px;
}

.navibar div.grp > select {
  display: block;
  height: 28px;
  padding: 0px 0px;
  box-sizing: border-box;
  border: 1px solid #dadada;
  background-color: #ffffff;
  cursor: pointer;
}

.navibar div.grp > select option {
  width: calc(100% - 2px);
  box-sizing: border-box;
}

.navibar div.grp > a.btn {
  height: 28px;
  line-height: 26px;
  padding: 0px 5px;
  box-sizing: border-box;
  border: 1px solid #cacaca;
  border-radius: 0;
  background-color: #dddddd;
  color: #333333;
  cursor: pointer;
}

.navibar div.grp > a.btn.active {
  border: 1px solid #46b8da;
  background-color: #5bc0de;
  color: #fff;
}

.navibar div.grp > a.btn:hover {
  border: 1px solid #269abc;
  background-color: #39b3d7;
  color: #fff;
}

.navibar div.grp > a.btn ~ a.btn {
  margin-left: 2px;
}

.navibar .sort-name {
  width: 80px;
}

.navibar .keyword-name {
  width: 80px;
}

.navibar .keyword-name {
  width: 80px;
}

.navibar .keyword-operator {
  width: 60px;
}

.navibar .keyword-text {
  width: 200px;
  display: block;
  outline: none;
  font-size: 1.2rem;
  display: block;
}

.navibar .btn.sort-direction {
  width: 26px;
  margin-left: 2px;
}

.navibar .btn.submit {
  width: 40px;
  margin-left: 2px;
  font-size: 1.4rem;
  font-weight: normal;
}

.navibar .btn.clear {
  width: 40px;
  font-size: 1.4rem;
  font-weight: normal;
}