.notice-container {
  margin: 0;
  background-color: #0D1626;
  position: relative;
  min-height: 30px;
}

.notice-container .sub-menu-container {
  margin-top: 10px;
  margin-left: 180px;
}

.notice-container .sub-menu-container li {
  float: left;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

.notice-container .sub-menu-container li.active a {
  color: #3B85D0;
  padding-bottom: 20px;
  border-bottom: 3px solid #3B85D0;
}

.notice-container .sub-menu-container a {
  margin-right: 15px;
  font-size: 14px;
  color: #fff;
  padding-bottom: 5px;
  border-bottom: 3px solid transparent;
}

.notice-container .sub-menu-container a:hover {
  text-decoration: none;
}

.notice-container .notice {
  width: -webkit-calc(100% - 880px);
  width: -moz-calc(100% - 880px);
  width: -ms-calc(100% - 880px);
  width: -o-calc(100% - 880px);
  width: calc(100% - 880px);
  color: #FFC33B;
  font-size: 14px;
  margin-left: 15px;
}

.notice-container .notice i {
  margin-right: 5px;
}

.notice-container .chargeWrap {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
}

.notice-container .chargeWrap li {
  margin: 0 1px;
  padding: 0 15px;
  background-color: #FFC33B;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
}

.notice-container .chargeWrap li a {
  color: #242424;
  font-size: 16px;
  font-weight: 500;
}

.notice-container .chargeWrap li a:hover {
  text-decoration: none;
}

@media (max-width: 1450px) {
  .notice-container .sub-menu-container {
    margin-left: 131px;
  }

  .notice-container .notice {
    width: -webkit-calc(100% - 830px);
    width: -moz-calc(100% - 830px);
    width: -ms-calc(100% - 830px);
    width: -o-calc(100% - 830px);
    width: calc(100% - 830px);
    color: #FFC33B;
    font-size: 14px;
    margin-left: 15px;
  }
}

@media (max-width: 1200px) {
  .notice-container .sub-menu-container {
    margin-left: 60px;
  }

  .notice-container .notice {
    width: -webkit-calc(100% - 705px);
    width: -moz-calc(100% - 705px);
    width: -ms-calc(100% - 705px);
    width: -o-calc(100% - 705px);
    width: calc(100% - 705px);
  }
}

@media (max-width: 991px) {
  .notice-container .chargeWrap li {
    padding: 0 5px;
  }

  .notice-container .chargeWrap li a {
    font-size: 16px;
  }

  .notice-container .notice {
    width: -webkit-calc(100% - 595px);
    width: -moz-calc(100% - 595px);
    width: -ms-calc(100% - 595px);
    width: -o-calc(100% - 595px);
    width: calc(100% - 595px);
  }
}

@media (max-width: 768px) {
  .notice-container {
    height: 30px;
  }

  .notice-container .sub-menu-container a {
    font-size: 14px;
  }

  .notice-container .chargeWrap li a {
    font-size: 14px;
  }

  .notice-container .sub-menu-container {
    margin-left: 20px;
  }

  .notice-container .notice {
    width: -webkit-calc(100% - 250px);
    width: -moz-calc(100% - 250px);
    width: -ms-calc(100% - 250px);
    width: -o-calc(100% - 250px);
    width: calc(100% - 250px);
  }
}

@media (max-width: 580px){
  .notice-container .chargeWrap li a {
    font-size: 11px;
  }

  marquee {
    font-size: 11px;
    padding: 5px 0px;
  }

  .notice-container .notice {
    width: -webkit-calc(100% - 210px);
    width: -moz-calc(100% - 210px);
    width: -ms-calc(100% - 210px);
    width: -o-calc(100% - 210px);
    width: calc(100% - 210px);
  }
}