.footer {
  --gf-background-image: url("../images/about1/footer-bg.jpg");

  --gf-overlay-gradient: linear-gradient(
    180deg,
    rgba(2, 56, 134, 0.95) 4.158%,

    rgba(8, 78, 157, 0.95) 88.414%
  );

  box-shadow: none;
}

.theme-dark.footer {
  --gf-background-color: #00337c;

  --gf-border-color: rgba(255, 255, 255, 0.2);

  --gf-divider-color: rgba(255, 255, 255, 0.15);

  --gf-text-color: rgba(255, 255, 255, 0.92);

  --gf-link-color: rgba(255, 255, 255, 1);

  --gf-directory-title-color: rgba(255, 255, 255, 1);

  --gf-directory-title-color-hover: rgba(255, 255, 255, 0.85);
}

.theme-light.footer {
  --gf-background-color: rgb(255, 255, 255);

  --gf-border-color: #ddd;

  --gf-divider-color: rgba(0, 0, 0, 0.48);

  --gf-text-color: #333;

  --gf-link-color: #000;

  --gf-directory-title-color: #333;

  --gf-directory-title-color-hover: #000;
}

.footer {
  position: relative;

  background-color: var(--gf-background-color);

  background-image: var(--gf-overlay-gradient), var(--gf-background-image);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

  color: var(--gf-text-color);
}

.footer a {
  transition: color 0.3s, opacity 0.3s;

  color: var(--gf-link-color);

  text-decoration: none;
}

.footer a:hover {
  opacity: 0.85;

  text-decoration: none;

  color: var(--gf-link-color);
}

.footer-bd > .wrapper {
  position: relative;
}

.footer-bd {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-bd-inner {
  box-sizing: border-box;

  display: flex;

  flex-wrap: nowrap;

  align-items: flex-start;

  justify-content: space-between;

  padding: 0.64rem 0;
}

@media only screen and (min-width: 768px) {
  .index_05 .footer {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .index_05 .footer-bd {
    flex: 1;
  }

  .index_05 .footer-bd-inner {
    padding-top: 30vh;
  }
}

.footer-nav {
  display: flex;

  flex: 1 1 auto;

  flex-wrap: nowrap;

  align-items: flex-start;

  justify-content: space-between;

  gap: 0.16rem;

  min-width: 0;
}

.footer-nav a {
  color: var(--gf-link-color);
}

.footer-nav .fn-col {
  flex: 0 1 auto;

  line-height: 1.85;

  font-size: 0.16rem;
}

.footer-nav .fn-col h3 {
  color: var(--gf-directory-title-color);

  font-size: var(--font18);

  font-weight: bold;

  margin-bottom: 0.16rem;

  text-align: left;
}

.footer-nav .fn-col h3 a {
  color: var(--gf-directory-title-color);

  transition: all 0.3s;
}

.footer-nav .fn-col h3 a:hover {
  color: var(--gf-directory-title-color-hover);
}

.footer-nav .fn-col li {
  font-size: var(--font14);

  text-align: left;
}

.footer-nav .fn-col li a {
  transition: color 0.3s, opacity 0.3s;

  color: var(--gf-text-color);
}

.footer-nav .fn-col li a:hover {
  opacity: 0.85;

  color: var(--gf-link-color);
}

.fn-col-qrcode {
  flex: 0 0 auto;
}

.footer .qrcode {
  box-sizing: border-box;

  display: flex;

  flex-direction: column;

  align-items: center;

  font-size: var(--font14);

  color: rgba(255, 255, 255, 0.92);
}

.footer .qrcode .qrcode-bd img {
  width: 1.44rem;

  display: block;

  background: #fff;
}

.footer .qrcode .qrcode-ft {
  margin-top: 0.08rem;

  display: flex;

  flex-direction: column;

  align-items: center;

  line-height: 1.6;
}

.footer-contact {
  flex: 0 0 auto;

  min-width: 3rem;

  max-width: 3.6rem;
}

.footer-contact-title {
  display: flex;

  align-items: center;

  gap: 0.12rem;

  margin: 0 0 0.2rem;

  color: #fff;

  font-size: var(--font18);

  font-weight: bold;
}

.footer-contact-title i {
  font-size: var(--font18);
}

.footer-contact-list {
  margin: 0;

  padding: 0;

  list-style: none;
}

.footer-contact-item {
  display: flex;

  align-items: flex-start;

  gap: 0.1rem;

  margin-bottom: 0.14rem;

  color: rgba(255, 255, 255, 0.92);

  font-size: var(--font14);

  line-height: 1.6;
}

.footer-contact-item:last-child {
  margin-bottom: 0;
}

.footer-contact-icon {
  display: inline-flex;

  flex-shrink: 0;

  width: 0.18rem;

  margin-top: 0.04rem;

  align-items: center;

  justify-content: center;

  color: rgba(255, 255, 255, 0.92);
}

.footer-contact-icon i {
  font-size: var(--font14);

  line-height: 1;
}

.footer-contact-text {
  flex: 1;

  min-width: 0;
}

.footer-contact-label,
.footer-contact-value {
  color: rgba(255, 255, 255, 0.92);

  transition: opacity 0.3s;
}

a.footer-contact-value:hover {
  opacity: 0.85;

  color: #fff;
}

.footer-ft-inner {
  padding: 0.24rem 0 0.28rem;

  color: rgba(255, 255, 255, 0.75);

  font-size: var(--font14);

  text-align: center;

  line-height: 1.6;
}

.footer-ft-inner a {
  color: rgba(255, 255, 255, 0.75);
}

.footer-ft-inner a:hover {
  color: #fff;
}

@media only screen and (max-width: 1200px) {
  .footer-bd-inner {
    gap: 0.12rem;

    justify-content: space-between;
  }

  .footer-nav {
    gap: 0.12rem;
  }

  .footer-nav .fn-col h3 {
    font-size: 0.17rem;

    margin-bottom: 0.12rem;
  }

  .footer-nav .fn-col li {
    font-size: 0.13rem;
  }

  .footer-contact {
    min-width: 2.5rem;

    max-width: 3.2rem;
  }

  .footer .qrcode .qrcode-bd img {
    width: 1.05rem;
  }
}

@media only screen and (max-width: 991px) {
  .footer-bd-inner {
    flex-wrap: wrap;

    gap: 0.32rem 0.24rem;
  }

  .footer-nav {
    flex-wrap: wrap;

    justify-content: space-between;

    gap: 0.24rem 0.16rem;
  }

  .footer-nav .fn-col {
    flex: 0 1 calc(33.333% - 0.16rem);

    min-width: 1.2rem;
  }

  .fn-col-qrcode {
    flex: 0 0 auto;
  }

  .fn-col-contact {
    flex: 1 1 100%;
  }

  .footer-contact {
    min-width: 0;

    max-width: none;
  }
}

@media only screen and (max-width: 767px) {
  .footer {
    font-size: 12px;
  }

  .footer .wrapper {
    padding-left: 20px;

    padding-right: 20px;

    max-width: 100%;
  }

  .footer-bd-inner {
    padding: 32px 0 24px;

    flex-wrap: wrap;
  }

  .footer-nav {
    flex-wrap: wrap;

    gap: 24px 16px;
  }

  .fn-col-qrcode {
    display: none;
  }

  .footer-nav .fn-col:not(.fn-col-contact) {
    display: none;
  }

  .fn-col-contact {
    flex: 1 1 100%;

    display: block;
  }

  .footer-contact {
    max-width: 100%;

    width: 100%;
  }

  .footer-ft-inner {
    font-size: 12px;

    text-align: left;
  }
}