html,
body {
  height: 100%;
}

.container-box {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 头部 */
header {

  width: 100%;
  height: 1rem;
  background-color: rgba(255, 255, 255, 1);
  border-bottom: 1px solid rgba(221, 221, 221, 1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: .2rem;
  padding-right: .2rem;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}

header>div:nth-of-type(1) img {
  width: 2.72rem;
  height: .79rem;
}

header>div:nth-of-type(2) img {
  width: .5rem;
  height: .4rem;
}

/* 底部 */
footer {
  width: 100%;
  height: auto;
  background-color: rgba(49, 56, 70, 1);
  padding: .4rem .2rem;
  box-sizing: border-box;
}

.wrapper {
  flex: 1;
}

.footer-phone div {
  display: flex;
  align-items: baseline;
  margin-bottom: .11rem;
}

.footer-phone div img {
  width: .2rem;
  height: .2rem;
  margin-right: .11rem;

}

.footer-phone div span {
  color: rgba(255, 255, 255, 0.8);
  font-size: .2rem;
}

.footer-qr ul {
  display: flex;
  justify-content: center;
  padding: .5rem 0 .2rem 0;
}

.footer-qr ul li {
  display: flex;
  align-items: center;
  flex-direction: column;
  margin: 0 .25rem;
}

.footer-qr ul img {
  width: 1.5rem;
  height: 1.5rem;
  margin-bottom: .1rem;
}

.footer-qr ul span {
  color: rgba(255, 255, 255, 0.9);
  font-size: .26rem;
}

.links {
  color: rgba(255, 255, 255, 0.6);
  font-size: .2rem;
  text-align: center;
}

.links a {
  color: rgba(255, 255, 255, 0.6);
}

.company-beian {
  color: rgba(255, 255, 255, 0.6);
  font-size: .2rem;
  width: 70%;
  text-align: center;
  margin: auto;
}

.company-beian a {
  color: rgba(255, 255, 255, 0.6);
}

.navs {
  position: fixed;
  top: -5000px;
  left: 0;
  height: 100vh;
  width: 100vw;
  overflow-y: auto;
  background-color: #fff;
  z-index: 99;
  padding-top: 1rem;
   padding-bottom: 1rem;
  box-sizing: border-box;
  transition: all .5s ease-in-out;
}
.navs-active{
  top: 0;
}
.nav-box .nav-title {

  width: 100%;
  height: .8rem;
  background-color: rgba(245, 245, 245, 1);

  color: rgba(51, 51, 51, 1);
  font-size: .3rem;
  line-height: .8rem;
  padding: 0 .2rem;
}

.nav-subnav {
  font-size: .26rem;
  width: 100%;
}

.nav-subnav span {
  display: inline-block;
  width: 32%;
  text-align: center;
  padding: .13rem 0;
  color: rgba(102, 102, 102, 1);
}
.nav-subnav span a{
  display: inline-block;
  width: 100%;
  height: 100%;
  color: rgba(102, 102, 102, 1);
  text-decoration: none;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
  padding-left:.1rem;
  padding-right:.1rem;
  box-sizing:border-box;
  }

.nav-active {
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

.nav-active span {
  color: rgba(54, 175, 71, 1);
  position: relative;
}

.nav-active span::after {
  content: "";
  position: absolute;
  bottom:-.1rem;
  left: 0;
  width: 100%;
  height: .06rem;
  background-color: rgba(54, 175, 71, 1);
  border-radius: .1rem;
}
.close-button{
  display: none;
  
}
.close-button img{
  width: .4rem;
  height: .4rem;
}
.wrapper{
  padding-top: 1rem;
}

.solution-show{
  display: flex !important;
}
.click-hover{
display:flex;
align-items:center;
height:100%;

}
.click-hover:hover{
box-sizing: border-box;
    box-shadow: 0.01rem 0.01rem 0.2rem 0.01rem #eee;
    padding: 0.1rem;


}