.moveBtn{
  display:none;
  color:#fff;
  width:100px;
  height:35px;
  line-height:35px;
  text-align:center;
  background-color:#1890ff;
  border:1px solid #329cff;
  white-space:nowrap;
  border-radius:4px;
  margin:1.3em;
}
 .contentBox{
  width:100%;
  height:auto;
  overflow:visible;
  background-color:#fff;
  z-index:999999;
}
 .link{
  position:relative;
  height:auto;
  line-height:1;
   padding: 5px;
}
 .yjTitle{
text-align: center;
    background: #d5ecee;
    border-bottom: 1px solid #fff;
    padding: 12px 0;
    letter-spacing: 1px;
    line-height: 0.8;
}
 .yjLink{
  position:relative;
  color: #999;
  font-size: 14px;
  transition:all .5s ease;
}
 .iconfont1{
  position:absolute;
  right:45px;
  top:0px;
  bottom:0px;
  width:50px;
  color:#7b8a96;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
}
 .ejLi{
  position:relative;
}
 .ejTitle{
  position:relative;
  background-color:#fff;
  border-bottom:1px solid #e8e8e8;
  padding-left:50px;
  transition:all .5s ease;
}
 .ejLink{
  color:#86939e;
  font-size:16px;
}
 .iconfont2{
  position:absolute;
  right:20px;
  top:0px;
  bottom:0px;
  margin:auto;
  display:inline-block;
  width:18px;
  height:18px;
  line-height:18px;
  text-align:center;
  color:#86939e;
  font-size:16px;
  transition:all .5s ease;
}
 .icf{
  transform:rotate(180deg);
}
 .sjTitle{
  position:relative;
  background-color:#fff;
  border-bottom:1px solid #e8e8e8;
}
 .sjLink{
  color:#7b8a96;
  font-size:16px;
}
 .ejBox{
  display:none;
}
 .rotate{
  transform:rotate(-90deg);
}
 .ejTitle:hover{
  background-color:#f5f8fa;
}
 .backBtn{
  display:none;
}
 .yjTitle:hover{
  background: #009fa4;
}
 .yjTitle:hover .yjLink{
  color:#fff;
}
 .sjBox{
  display:none;
}
 .line_right{
  display:none;
}
@media only screen and (min-width:769px){
  
 .sjBox {
                    position: absolute;
                    top: 0;
                    left: 100%;
                    box-shadow: 0px 5px 20px 0px rgba(192, 192, 192, 0.4);
                }
 .sjTitle {
                    text-align: center;
                }
 .sjTitle::before {
                    content: '';
                    position: absolute;
                    display: block;
                    width: 6px;
                    height: 50px;
                    background-color: #04abf4;
                }
 .sjBox li {
                    width: 150px;
                }
 .sjTitle:hover .sjLink {
                    color: #01a5ec;
                }
 .sjLi::before {
                    content: '';
                    display: block;
                    width: 0;
                    height: 0;
                    border-top: 6px solid #04abf4;
                    border-right: 6px solid #fff;
                    border-bottom: 6px solid #04abf4;
                    position: absolute;
                    left: 0;
                    top: 22px;
                    z-index: 1;
                }
 .ejLi:hover .sjLi::before {
                    display: block;
                }
}
@media only screen and (max-width:768px){
  
 .contentBox {
                    position: fixed;
                    top: 0;
                    left: 100%;
                    height: 100%;
                    font-size: 0;
                }
 .backBtn {
                    position: relative;
                    display: inline-block;
                    width: 45px;
                    height: 100%;
                    vertical-align: top;
                    background: #f5f8fa;
                }
 .content {
                    display: inline-block;
                    width: calc(100% - 45px);
                }
 .moveBtn {
                    display: block;
                }
 .btn {
                    position: absolute;
                    top: 50%;
                    transform: translateY(-50%);
                    width: 100%;
                    height: 40px;
                    display: block;
                    text-align: center;
                    line-height: 40px;
                    font-size: 1.2rem;
                    color: #7b8a96;
                    padding: 0;
                }
 .yjTitle {
                    border-bottom: 1px solid #f8f8f8;
                }
 .sjTitle {
                    padding-left: 80px;
                }
 .jsDeg {
                    transform: rotate(-90deg);
                }
 .line_right {
                    display: block;
                    width: 8px;
                    height: 50px;
                    background-color: #04abf4;
                    position: absolute;
                    right: 0;
                    top: 0;
                    opacity: 0
                }
 .line_show {
                    opacity: 1;
                }
 .sjTitle::after {
                    content: '';
                    display: block;
                    width: 8px;
                    height: 50px;
                    background-color: #04abf4;
                    position: absolute;
                    right: 0;
                    top: 0;
                }
}
.yjTitle:hover .yjLink p{
color:#fff!Important;
  transition: all .5s ease;
}
.jpActive p{
color: #fff !important;
}