.cc{
    display: none;
    float: right;
    width: 45px;
    height: 60px;
}

.btn-nav {
  position:absolute;
  right:0.2rem;
  top:0.2rem;
  background: transparent;
  border: none;

  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  cursor: pointer;
  z-index: 99999;    width: 30px;
    height: 30px;
    text-align: center; margin: 10px 0px 0px 0px;
  
}


.btn-nav:focus {
  outline: 0;
}

.icon-bar {
 margin: 4px 0px;
     width: 2rem;
     height: 3px;
  background-color:#ff2f2f;float: left;
    display: inline-block;
}



.nav-content {
	max-width:640px;width:100%;
  position: fixed;
  top: -100%;
  bottom: 0;

  background:rgba(0,0,0,0.8);
  display: block;
  height: 100%;
  z-index: 9;
}

.nav-list {
  list-style: none;
  padding: 0;
  position: relative;
  top:0;
}

.item-anchor:after {
  content: "";
  position: absolute;
  width:0.1rem;
  height: 0.1rem;
  left: 0;
  bottom: 0;
  z-index: 9;
  background: transparent;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.item-anchor {
  color: #fff;
  font-size: 0.5rem;
  text-transform: uppercase;g
  position: relative;
  text-decoration: none;
  padding: 0.25rem;
}

.item-anchor:hover,
.item-anchor:focus {
  color: #ff2f2f;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.item-anchor:hover:after,
.item-anchor:focus:after{
  width: 100%;
  background: #ff2f2f;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

.nav-item {
  margin: 1rem auto;
  text-align: center;
}

.animated {
  display: block;
  margin: 0 auto;
}

.animated:hover .icon-bar,
.animated:focus .icon-bar{
  background-color: #ff2f2f;
}

.animated:focus {
  cursor: pointer;
  z-index: 9999;
}

.middle {
  margin: 0 auto;
}

.icon-bar {
  -webkit-transition: all .7s ease;
  -moz-transition: all .7s ease;
  -ms-transition: all .7s ease;
  -o-transition: all .7s ease;
  transition: all .7s ease;
  z-index: 999999;
}

.animated .icon-bar {
  z-index: 999999;
  background-color: #ff2f2f;
}

.animated .top {
  -webkit-transform: translateY(10px) rotateZ(45deg);
  -moz-transform: translateY(10px) rotateZ(45deg);
  -ms-transform: translateY(10px) rotateZ(45deg);
  -o-transform: translateY(10px) rotateZ(45deg);
  transform: translateY(10px) rotateZ(45deg);
}

.animated .bottom {
  -webkit-transform: translateY(-11px) rotateZ(-45deg);
  -moz-transform: translateY(-11px) rotateZ(-45deg);
  -ms-transform: translateY(-11px) rotateZ(-45deg);
  -o-transform: translateY(-11px) rotateZ(-45deg);
  transform: translateY(-11px) rotateZ(-45deg);
}

.animated .middle {
  width: 0;
}

@keyframes showNav {
  from {
    top: -100%;
  }
  to {
    top: 0;
  }
}

@-webkit-keyframes showNav {
  from {
    top: -100%;
  }
  to {
    top: 0;
  }
}

@-moz-keyframes showNav {
  from {
    top: -100%;
  }
  to {
    top: 0;
  }
}

@-o-keyframes showNav {
  from {
    top: -100%;
  }
  to {
    top: 0;
  }
}

.showNav {
  -webkit-animation: showNav 1s ease forwards;
  -moz-animation: showNav 1s ease forwards;
  -o-animation: showNav 1s ease forwards;
  animation: showNav 1s ease forwards;
}

@keyframes hideNav {
  from {
    top: 0;
  }
  to {
    top: -100%;
  }
}

@-webkit-keyframes hideNav {
  from {
    top: 0;
  }
  to {
    top: -100%;
  }
}

@-moz-keyframes hideNav {
  from {
    top: 0;
  }
  to {
    top: -100%;
  }
}

@-o-keyframes hideNav {
  from {
    top: 0;
  }
  to {
    top: -100%;
  }
}

.hideNav {
  -webkit-animation: hideNav 1s ease forwards;
  -moz-animation: hideNav 1s ease forwards;
  -o-animation: hideNav 1s ease forwards;
  animation: hideNav 1s ease forwards;
  display: none;
}

.hidden {
  display: none;
}
 
 @media only screen and (max-width: 1000px) {
 #showcss .hideNav { display: block;}
 #showcss .cc{ display: inline-block;}
 #showcss .floating_ck, #showcss .nav_box,.xgpl,#showcss .blk_18 .RightBotton,#showcss .blk_18 .LeftBotton, #showcss .footer_box,#showcss .bdsharebuttonbox{ display: none;}
#showcss .logo,#showcss .logo img{width:60px;height: 60px;}
#showcss .header,#showcss .header_box{height:auto; min-width: 100%; width: 100%;}
#showcss .kh{width: auto;margin-left: 10px;height: auto;}
#showcss .khsd{    width: auto;height: auto;margin-left: 10px;}
#showcss .dchuti{    height: auto;font-size: 0.9rem;line-height: 30px;margin-top: 10px;}
#showcss .x{height: auto;line-height: 25px;font-size: 0.8rem;text-align: left;margin-bottom: 10px;}
#showcss .page_banner{height: auto; width: 100%; margin:80px 0px 0px 0px;min-width: auto;}
#showcss .page_banner img{ height: auto; width: 100%; margin: 0px; width: 100% !important; max-width: 100%;min-width: auto;}
#showcss .zp_box,#showcss .page_nav_box,#showcss .page_nav,#showcss .page_case_box, #showcss .partner,#showcss .plan_tg,#showcss  .partner_box,#showcss .partner,#showcss .title3,#showcss .plan_tg,#showcss .blk_18 .pcont,#showcss .ScrCont .p1,#showcss .ScrCont .p1 .left,#showcss .ScrCont .p1 .right,#showcss .blk_18,#showcss .blk_18 .ScrCont,.bottom_box,.bq,.bottom,.tjnews_box,.tjxw{min-width: auto;  width: 100%; height: auto; margin: 0px; padding: 0px; overflow: inherit;}
#showcss .page_about *{ font-size: 0.9rem;    line-height: 200%;}
#showcss .newsleft *,#showcss .fxx ,#showcss  .newsleft{ width: 100%; margin: 0px; padding: 0px;}
#showcss .page_about{min-width: auto;  width: 96%; margin: 1%; padding: 1%;}
#showcss  .page_nav li{ margin: inherit; line-height:inherit;}
#showcss  .page_nav li a {font-size: 16px;color: #fa3131;margin: 0px 7px; line-height: 45px;}
#showcss .scrollcontainer{width: 100%;height: auto;}
#showcss .scrollcontainer ul{ width: 100%; position: inherit;}
#showcss .page_case li{float: left;width: 46%;height: 250px; margin: 2%;}
#showcss .page_case li a{font-size: 1rem;}
#showcss .partner{ width: 100%; margin: 0px; padding: 0px;}
 #showcss .title3{margin: 10px 0px 30px 0px;padding-bottom: 20px;}
.bq *{font-size: 14px; line-height: 25px;;}
.bottom_ul,.bottom_text{ width: 100%; text-align: center;}
 #showcss .ScrCont .p1{ width: 96%; margin: 2%;}
 #showcss  .partner_tit{font-size: 1.2rem; font-weight: bold;}
 #showcss .tjnews_box, #showcss .page_case_tit{ width: 100%; display: inline-block; height: auto;}
#showcss .tjxw li{ width: 95%; display: inline-block; height: auto;}





}