.wap-hd-nav { display: none; }

@media screen and (max-width: 991px) { .wap-hd-nav { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; background-color: #d88a06; }
  .wap-hd-nav-item { -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; }
  .wap-hd-nav-item a { display: block; padding: 5px 0; line-height: 20px; font-size: 14px; color: white; text-align: center; background-color: #363636; }
  .wap-hd-nav-item a.active { color: white; background-color: #d88a06; } }

.m-mobilenav { display: none; }

@media screen and (max-width: 991px) { .m-mobilenav { position: absolute; z-index: 11; padding-top: 25px; top: 0; left: 0; display: block; -moz-box-sizing: border-box; box-sizing: border-box; }
  .m-mobilenav .mbnav-btn { position: absolute; z-index: 2; top: 10px; left: 17px; width: 26px; -webkit-transition: all 550ms; -o-transition: all 550ms; -moz-transition: all 550ms; transition: all 550ms; }
  .m-mobilenav .mbnav-btn .line { width: 100%; height: 2px; background-color: #d88a06; }
  .m-mobilenav .mbnav-btn .line2 { margin-top: 6px; margin-bottom: 6px; }
  .m-mobilenav .mbnav-btn.active { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
  .m-mobilenav .mbnav-bd { position: absolute; left: 0; top: 0; width: 300px; height: 100%; top: 0; visibility: hidden; z-index: 1; }
  .m-mobilenav .mbnav-bd.show { visibility: visible; }
  .m-mobilenav .mbnav-bd.show .mbnav-wp { height: 100%; opacity: 1; }
  .m-mobilenav .mbnav-bd.show .mbnav-item > a { opacity: 1; -webkit-transform: scale(1) translate(0, 0); -moz-transform: scale(1) translate(0, 0); -ms-transform: scale(1) translate(0, 0); -o-transform: scale(1) translate(0, 0); transform: scale(1) translate(0, 0); }
  .m-mobilenav .mbnav-wp { position: absolute; left: 0; top: 0; width: 100%; height: 0; background-color: #333; top: 0; -webkit-transition: all 550ms; -o-transition: all 550ms; -moz-transition: all 550ms; transition: all 550ms; opacity: 0; }
  .m-mobilenav .mbnav-fix { position: absolute; left: 0; top: 60px; height: -webkit-calc(100% - 60px); height: -moz-calc(100% - 60px); height: calc(100% - 60px); width: 100%; -moz-box-sizing: border-box; box-sizing: border-box; overflow-y: scroll; }
  .m-mobilenav .mbnav-item { position: relative; padding-left: 44px; padding-right: 24px; padding-top: 10px; padding-bottom: 10px; }
  .m-mobilenav .mbnav-item i { position: absolute; left: 13px; top: 12px; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #333; font-size: 20px; font-size: 2rem; color: #fff; cursor: pointer; }
  .m-mobilenav .mbnav-item > a { display: block; line-height: 26px; font-size: 16px; font-size: 1.6rem; color: #fff; -webkit-transform: scale(1.1) translate(60px, -35px); -moz-transform: scale(1.1) translate(60px, -35px); -ms-transform: scale(1.1) translate(60px, -35px); -o-transform: scale(1.1) translate(60px, -35px); transform: scale(1.1) translate(60px, -35px); opacity: 0; -webkit-transition: .5s .1s; -o-transition: .5s .1s; -moz-transition: .5s .1s; transition: .5s .1s; }
  .m-mobilenav .mbnav-item > a.current:after { content: ""; margin-left: 5px; display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; width: 6px; height: 6px; background-color: #fff; border-radius: 50%; -webkit-transition: all 550ms; -o-transition: all 550ms; -moz-transition: all 550ms; transition: all 550ms; }
  .m-mobilenav .mbnav-item > a.active { color: #d88a06; }
  .m-mobilenav .mbnav-item > a.active:after { background-color: #d88a06; }
  .m-mobilenav .mbnav-item:nth-child(1) > a { -webkit-transition-delay: 250ms; -moz-transition-delay: 250ms; -o-transition-delay: 250ms; transition-delay: 250ms; }
  .m-mobilenav .mbnav-item:nth-child(2) > a { -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; }
  .m-mobilenav .mbnav-item:nth-child(3) > a { -webkit-transition-delay: 350ms; -moz-transition-delay: 350ms; -o-transition-delay: 350ms; transition-delay: 350ms; }
  .m-mobilenav .mbnav-item:nth-child(4) > a { -webkit-transition-delay: 400ms; -moz-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; }
  .m-mobilenav .mbnav-item:nth-child(5) > a { -webkit-transition-delay: 450ms; -moz-transition-delay: 450ms; -o-transition-delay: 450ms; transition-delay: 450ms; }
  .m-mobilenav .mbnav-item:nth-child(6) > a { -webkit-transition-delay: 500ms; -moz-transition-delay: 500ms; -o-transition-delay: 500ms; transition-delay: 500ms; }
  .m-mobilenav .mbnav-item:nth-child(7) > a { -webkit-transition-delay: 550ms; -moz-transition-delay: 550ms; -o-transition-delay: 550ms; transition-delay: 550ms; }
  .m-mobilenav .mbsbnav-list { padding: 10px 0; display: none; }
  .m-mobilenav .mbsbnav-item { position: relative; padding-left: 20px; padding-right: 5px; }
  .m-mobilenav .mbsbnav-item i { left: 0; top: 6px; line-height: 24px; }
  .m-mobilenav .mbsbnav-item a { display: block; padding: 5px 5px; line-height: 24px; font-size: 14px; font-size: 1.4rem; color: #fff; }
  .m-mobilenav .mbsbnav-item a.active { color: #d88a06; } }
