/* 关于导航的样式
–––––––––––––––––––––––––––––––––––––––––––––––––– */
nav {
  width: 100%;
  height: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
nav > ul > li {
  display: inline-block;
  font-size: 0.30rem;
  margin-right: 0.5rem;
  position: relative;
}
nav > ul > li:first-child {
  padding-left: 0;
}
nav > ul > li:last-child {
  padding-right: 0;
}
nav > ul > li > a {
  box-sizing: border-box;
  display: block;
  position: relative;
  border-bottom: 3px solid transparent;
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 0.2rem;
  height: 0.8rem;
  line-height: 0.8rem;
}
.navtitle {
  color: #fff;
}
.navtitleActive {
  color: rgba(0, 0, 0, 0.7);
}
nav > ul > li:hover > a {
  transition: all ease-in 0.3s;
  /* padding-top: 10px; */
}
nav > ul > li:hover > .navtitle {
  border-bottom: 3px solid #fff;
}

nav > ul > li:hover > .navtitleActive {
  color: #40457c;
  border-bottom: 3px solid #40457c;
}

/* #Mega Menu Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.mega-menu {
  z-index: 9999;
  transition: all ease-in 0.3s;
  background: url("../images/navbg.png") no-repeat;
  height: 1.13rem;
  display: none;
  top: 0.8rem;
  left: 0;
  position: absolute;
  text-align: left;
  width: 100%;
}

.mega-menu ul {
  height: 1.13rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mega-menu ul > li {
  margin-right: 0.6rem;
}
.mega-menu ul:last-child {
  margin-right: 0;
}
.mega-menu a {
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 0.18rem;

  display: block;
  padding: 6px 20px;
  text-decoration: none;
}
.secondmenu {
  color: #fff;
}
.secondmenuActive {
  color: #40457c;
}

.mega-menu .secondmenu:hover {
  transition: all ease-in 0.3s;
  color: #fff;
  border-radius: 6px 6px 6px 6px;
  border: 2px solid #fff;
}
.mega-menu .secondmenuActive:hover {
  transition: all ease-in 0.3s;
  color: #40457c;
  border-radius: 6px 6px 6px 6px;
  border: 2px solid #40457c;
}
/* #Droppable Class Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.droppable {
  position: static;
}

.droppable:hover .mega-menu {
  display: block;
}

/* #Browser Clearfix
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.cf:before,
.cf:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}
.cf:after {
  clear: both;
}