* {
  margin : 0;
  padding: 0;
}


.com-right .content {
  position   : absolute;
  left       : 0;
  top        : 0;
  width      : 100%;
  padding    : 20px;
  height     : 100%;
  border-left: 1px solid #ddd;

}

#wrapper {
  width : 100%;
  height: calc(100% - 64px);
}

.com-box {
  display        : flex;
  justify-content: space-between;
  align-items    : flex-start;
  height         : 100%;
}

.com-right {
  width : 400px;
  height: 100%;
}

.com-left {
  width : calc(100% - 400px);
  height: 100%;
}

.address {
  box-sizing: border-box;
  padding   : 20px;
  margin-top: 30px;
}

.address span {
  margin          : 0;
  padding         : 10px;
  background-color: #007bff;
  color           : #fff;
  border-radius   : 5px;
  margin-right    : 5px;
  cursor          : pointer;
}

.address .isActive {
  background-color: #007bff;
  color           : #fff;
}

.address .noActive {
  color           : #fff;
  background-color: #5a6268;
}

.ul-box {
  position  : absolute;
  left      : 0;
  top       : 75px;
  list-style: none;
  width     : 100%;
  height    : 400px;
  overflow  : auto;
}

.ul-box li:first-child {
  border-top   : 1px solid #80bdff;
  border-radius: 5px 5px 0 0;
}

.ul-box li:last-child {
  border-radius: 5px;
  border-radius: 0 0 5px 5px;
}

.ul-box li:hover {
  color           : #fff;
  background-color: #80bdff;
}

.ul-box li {
  cursor          : pointer;
  width           : 100%;
  height          : 38px;
  line-height     : 38px;
  box-sizing      : border-box;
  border          : 1px solid #80bdff;
  border-top      : 0;
  padding         : 0 12px;
  color           : #495057;
  background-color: #fff;
  outline         : 0;
}

.form-control:focus {
  color           : #495057;
  background-color: #fff;
  border-color    : #80bdff;
  outline         : 0;
  box-shadow      : none;
}

.form-group {
  width     : calc(100% - 40px);
  box-sizing: border-box;
  position  : absolute;
  left      : 20px;
  top       : 60px;
}