@charset "utf-8";
/* CNGBS mobile chrome: header with drawer nav + footer (mobile only, <=860px) */
/* Desktop: hidden entirely */
.gbp-mob, .gbp-mobfoot { display: none; }

@media (max-width:860px){
  /* hide PC chrome on mobile */
  .header#never, .nav.nav_static, #footer.footer, .head_right.container { display:none !important; }
  .gbp-mob { display:block; }
  .gbp-mobfoot { display:block; }

  /* ---- mobile header ---- */
  .gbp-mob .header{
    height:60px; background:#fff; border-bottom:1px solid #eee;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 15px; box-sizing:border-box; position:relative; z-index:10000;
  }
  .gbp-mob .logo{ display:block; }
  .gbp-mob .logo img{ max-height:44px; width:auto; max-width:200px; }
  .gbp-mob .drawer-op{
    position:relative; display:block; width:30px; height:22px; cursor:pointer;
  }
  .gbp-mob .drawer-op span,
  .gbp-mob .drawer-op:before,
  .gbp-mob .drawer-op:after{
    content:''; position:absolute; left:0; display:block; width:30px; height:2px;
    background:#000; border-radius:1px;
    transition:all .35s cubic-bezier(.19,1,.22,1); -webkit-transition:all .35s cubic-bezier(.19,1,.22,1);
  }
  .gbp-mob .drawer-op:before{ top:0; }
  .gbp-mob .drawer-op:after{ bottom:0; }
  .gbp-mob .drawer-op span{ top:10px; }
  body.drawer-open .gbp-mob .drawer-op:before{ top:10px; transform:rotate(45deg); -webkit-transform:rotate(45deg); }
  body.drawer-open .gbp-mob .drawer-op:after{ bottom:10px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); }
  body.drawer-open .gbp-mob .drawer-op span{ background:transparent; }

  /* ---- drawer nav ---- */
  .gbp-mob .wap-menu .drawer-main{
    position:fixed; top:0; right:-270px; width:260px; height:100%;
    background:#1b1b1b; z-index:9999; overflow-y:auto; overflow-x:hidden;
    transition:right .4s cubic-bezier(.19,1,.22,1); -webkit-transition:right .4s cubic-bezier(.19,1,.22,1);
  }
  body.drawer-open .gbp-mob .wap-menu .drawer-main{ right:0; }
  .gbp-mob .drawer-overlay{
    position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.55);
    z-index:9990; display:none;
  }
  body.drawer-open .gbp-mob .drawer-overlay{ display:block; }
  .gbp-mob .drawer-nav-list{
    margin:64px 0 24px 0; padding:0; list-style:none;
  }
  .gbp-mob .drawer-nav-list li{
    display:block; position:relative; overflow:hidden;
  }
  .gbp-mob .drawer-nav-list > li > a{
    display:block; height:45px; line-height:45px; text-indent:26px;
    color:#fff; font-size:15px; border-bottom:1px solid #282828; cursor:pointer;
  }
  .gbp-mob .drawer-nav-list li .childer{ display:none; background:#000; }
  .gbp-mob .drawer-nav-list li .childer a{
    display:block; height:38px; line-height:38px; text-indent:46px;
    color:#b5b5b5; font-size:13px; border-bottom:1px solid #232323;
  }
  .gbp-mob .drawer-nav-list li .childer a:last-child{ border-bottom:none; }

  /* ---- mobile footer ---- */
  .gbp-mobfoot .footer{
    background:#f2f2f2; padding:15px; box-sizing:border-box;
  }
  .gbp-mobfoot .footer ul{ list-style:none; margin:0; padding:0; }
  .gbp-mobfoot .footer > div > ul > li{ border-bottom:1px solid #d4d4d4; }
  .gbp-mobfoot .footer h3{
    font-size:14px; font-weight:normal; color:#333; text-align:left;
    height:40px; line-height:40px; padding:0 34px 0 15px; margin:0;
    background:url(/template/mobile/skin/images/arrow-top.png) no-repeat right 10px center;
    background-size:20px; cursor:pointer;
  }
  .gbp-mobfoot .footer .pat-dds h3{
    background:url(/template/mobile/skin/images/arrow-bottom.png) no-repeat right 10px center;
    background-size:20px;
  }
  .gbp-mobfoot .foot-pro{ display:none; margin-bottom:0; padding:0 0 10px; }
  .gbp-mobfoot .foot-pro li{
    font-size:13px; height:32px; line-height:32px; text-align:left;
    padding:0 15px; border-bottom:1px solid #e2e2e2;
  }
  .gbp-mobfoot .foot-pro li a{ color:#666; }
  .gbp-mobfoot .footer p{ color:#999; font-size:12px; margin:12px 0 4px; text-align:center; line-height:1.7; }
  .gbp-mobfoot .footer p a{ color:#999; }

  /* body no longer needs PC top offset */
  body{ padding-top:0 !important; }
}