/* ----------------------------------- */
/* ------ Modal ------ */
/* ----------------------------------- */
[data-toggle="modal"]:focus {
  outline: none
}
.modal {
  padding: 0 6vw !important; }

.modal-dialog {
  max-width: 500px;
  margin: 0.1rem;
}

.modal-content {
  width: 100%;
  margin: 0 auto;
  border-radius: 0.02rem;
  -webkit-border-radius: 0.02rem;
  -moz-border-radius: 0.02rem;
  -ms-border-radius: 0.02rem;
  -o-border-radius: 0.02rem;
}

.modal-content h3.title-small {
  font-size: 0.28rem;
  margin-bottom: 0;
}

.modal-header {
  padding: 0.16rem;
  border-top-left-radius: 0.048rem;
  border-top-right-radius: 0.048rem; }

.modal-header .close {
  font-size: 0.24rem;
  padding: 0.16rem;
  margin: -0.16rem -0.16rem -0.16rem auto; }

.modal-body, .modal-footer {
  padding: 0.16rem; }

.modal-footer button {
  font-size: 0.16rem;
  padding: 0.06rem 0.12rem;
  margin-top: 0.2rem;
  border-radius: 0.01rem;
  background-color: #2c2c2c;
  color: #fff;
  -webkit-border-radius: 0.01rem;
  -moz-border-radius: 0.01rem;
  -ms-border-radius: 0.01rem;
  -o-border-radius: 0.01rem;
  border: none;
  cursor: pointer;
}
  .modal-footer button:hover {
    background-color: #6e6e6e; }

.modal-footer>:not(:last-child) {
  margin-right: 0.025rem;
}
.modal-footer>:not(:first-child) {
  margin-left: 0.025rem;
}

@media (min-width: 576px) {
  .modal-dialog {
    margin: 0.28rem auto; }
  .modal-dialog-centered {
    min-height: calc(100% - (0.28rem * 2)); } }