/* 电脑端 */
@media screen and (min-width: 769px) {
   #header-box,.sidenav,.menumask{display:none;}
}
/* 手机端 */
@media only screen and (max-width: 769px) {
    /* 头部 */
    #header-box{ height:50px; 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:50px; background: #fff;width:100%;line-height:50px; padding: 0 0 0 5px;box-sizing: border-box;}
    .mlogo{ float: left; width:100%; height:50px; background:url(../images/logo.jpg) left center no-repeat; background-size:auto 38px; 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:16px;font-weight:normal;}

    /* 侧边栏 */
    .sidenav{width:100%;height:100%;position:fixed;top: 0;left:0;z-index: 600;-webkit-transform: translateX(-100%); transform: translateX(-100%);-webkit-transition: all .3s ease-in-out;transition: all .3s ease-in-out; display:block;}
    .sidenav-mask{position: fixed;height: 100%;width:calc(100% - 50px);z-index: 600; background:#ffffff; overflow-y: auto; top: 0; left: 0;}
    .menumask{width:100%;height:100%;background:rgba(0,0,0,0.2);position:fixed;top: 0;left:0;z-index: 600;display:none;}
    .open-side-nav .sidenav{-webkit-transform: translateX(0%); transform: translateX(0%);}
    .open-side-nav .menumask{display:block;}

    a.icon-close{display:block; width:50px; height:50px; text-align:center; background:#ffffff; color:#333; position: absolute; right: 0; top: 0;}
    .icon-close span{ line-height:50px;font-size:16px;font-weight:normal;}

    .body-y{overflow-y:hidden;}

    .cclose {display: inline-block; width: 50px; height: 100%; position: absolute;
        right: 0; top: 50px;}
    .cd-navigation .sub-menu {
      background:#fff;
      display: none;
    }
    .cd-navigation .sub-menu .sub-menu{
      background:#fff;
    }
    .cd-navigation li{border-bottom: 1px solid #dcdcdc;}
    .cd-navigation a {
      display: block;
      line-height:50px;
      padding: 0 15px 0 15px;
      color: #333;
    }
    .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);
    }
}