/* 电脑端 */
@media screen and (min-width: 769px) {
   #header-box,.sidenav,.menumask{display:none;}
}
/* 手机端 */
@media only screen and (max-width: 769px) {
    /* 头部 */
    #header-box{width:100%;line-height:50px; position: fixed;z-index: 500;top: 0;box-shadow: 0px 3px 6px rgba(0,0,0,0.2);}
    #header{ height:60px; background: #fff;width:100%;line-height:50px; padding:5px 0 5px 5px;box-sizing: border-box;}
    .mlogo{ float: left; width:100%; height:50px; background:url(../images/logo.png) left center no-repeat; background-size:auto 42px; overflow: hidden;}
    .indexright{position:relative;}
    a.icon-menu{display:block; width:50px; height:50px; text-align:center; background:#ffffff; color:#333; position: absolute; right: 0; top: 0;}
    .icon-menu span{ line-height:50px;font-size: 20px; padding: 8px 10px;background: #9f2527;color: #fff;font-weight:normal;}
    /* 侧边栏 */
    .sidenav{position:fixed;top:60px;left:0;right:0;height:0;overflow:scroll;z-index:999;background:#f5f5f5;transition:all .5s ease;}
    .mheight{height:calc(100% - 60px - 74px);}
    .cclose {height:40px;width:100%;text-align:center;margin-top:24px;}
    .cclose img{height:100%;}
    .cd-navigation .sub-menu {
      background:#fff;
      display: none;
    }
    .cd-navigation .sub-menu .sub-menu{
      background:#fff;
    }
    a.submenu-open{background:#9f2527;color:#fff;}
    .cd-navigation li{border-bottom: 1px solid #dcdcdc;}
    .cd-navigation a {
      display: block;
      line-height:50px;
      padding: 0 15px 0 15px;
    }
    .cd-navigation li li:last-child{border-bottom:none;}
    .cd-navigation li li a{padding-left:30px; color:#333;}
    .cd-navigation li li li a{padding-left:45px;}
    .cd-navigation a.current {
      background-color: #fff;
      color: #333;
    }
    .lateral-menu-is-open {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0);
      /* smooth the scrolling on touch devices - webkit browsers */
      -webkit-overflow-scrolling: touch;
    }
    /* style menu items which have a submenu  */
    .item-has-children > a {
      position: relative;
      text-transform: uppercase;
      /* this is the right arrow to show that the item has a submenu  */
    }
    .item-has-children > a > i {
      display: block;
      font-size:20px;
      position: absolute;
      top: 50%;
      bottom: auto;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      transform: translateY(-50%);
      right: .5em;
      /* background: url("cd-arrow.svg") no-repeat center center;
      background-size: 8px 11px; */
      -webkit-transition-property: -webkit-transform;
      -moz-transition-property: -moz-transform;
      transition-property: transform;
      -webkit-transition-duration: 0.2s;
      -moz-transition-duration: 0.2s;
      transition-duration: 0.2s;
    }
    .item-has-children > a.submenu-open > i {
      -webkit-transform: translateY(-50%) rotate(90deg);
      -moz-transform: translateY(-50%) rotate(90deg);
      -ms-transform: translateY(-50%) rotate(90deg);
      -o-transform: translateY(-50%) rotate(90deg);
      transform: translateY(-50%) rotate(90deg);
    }
}