html,body,div,p,ul,li,dl,dt,dd,em,i,span,a,img,input,h1,h2,h3,h4,h5 {margin:0;padding:0}
a,img,input {border:none;}
body{font: 14px/1.75  -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;-webkit-tap-highlight-color: rgba(0,0,0,0);}
a {text-decoration:none;}
ul,li{list-style: none}
a, a:focus, a:hover {cursor: pointer;color: inherit;outline: none;text-decoration: none;}
div:focus { outline: none; }
a:focus, a:active { outline: none; }
a, a:focus, a:hover { cursor: pointer; color: inherit; text-decoration: none; }
.page-full{ position: absolute; left: 0; top: 0; width: 100%;  height: 100%; }
.page-popup{ display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 50; }
.ele-center,.img-center{position: absolute; left: 0;right: 0;top: 0;bottom: 0; margin: auto; }
.ele-lr{ position: absolute;left: 0;right: 0;margin: auto;}
.img-full{ width: 100%; }
.page-content{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 15rem; margin: auto; overflow: hidden; }
.hide{ display: none; }
.position-table{ display: table; width: 100%; height: 100%;}
.position-table-wrap{ display: table-cell; vertical-align: middle; }
.click-off{pointer-events:none;}
input{ outline: none;  background-color: transparent; }
/*弹出框*/
.popup-info-message { position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 10000000000;}
.popup-info-message .text { position: absolute;left: 0;right: 0;top: 40%;margin: 0 auto;width: 2.5rem; padding: 0.15rem;background-color: rgba(0,0,0,0.8);color: #ffffff;font-size: 0.3rem;line-height: 1.5;text-align: center;border-radius: 0.05rem;}
/*加载*/
.popup-load { position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 10000000000;}
.popup-load .text { position: absolute;left: 0;right: 0;top: 40%;margin: 0 auto;width: 2.5rem;padding: 0.15rem;background-color: rgba(0,0,0,0.8);color: #ffffff;font-size: 0.3rem;line-height: 1.5;text-align: center;border-radius: 0.05rem;}
img{ vertical-align: middle; }

body{
  background: #161618;
}
.app{
  color: #fff;
}
.header{
  position: fixed;
  left: 0;
  top: 0;
  width: 150px;
  height: 100%;
  background: #333335;
  overflow: hidden;
}
.logo{
  width: 150px;
  height: 150px;
  text-align: center;
  line-height: 150px;
}
.nav{
  margin-top: 30px;
}
.nav .item{
  position: relative;
  display: block;
  width: 150px;
  height: 45px;
  text-indent: 32px;
  line-height: 45px;
}
.nav .item:hover{
  color: #ea3648;
  margin-left: 2px;
}
.nav .item.on{
  width: 146px;
  margin-left: 2px;
  border-left: 2px solid #ea3648;
  color: #ea3648;
}
.site-info{
  position: absolute;
  left: 0;
  bottom: 60px;
  width: 100%;
  text-align: center;
  font-size: 12px;
}
.main{
  margin-left: 150px;
}
.main-top{
  position: relative;
}
.main-title{
  height: 300px;
  line-height: 300px;
  text-align: center;
  color: #ea3648;
  font-size: 50px;
  font-weight: bold;
  letter-spacing: 10px;
  text-indent: 10px;
}
.main-content{
  background: #19191b;
  min-height: 300px;
  padding: 50px;
}
.content-800{
  width: 800px;
  margin: 0 auto;
  padding: 50px 0;
}
.contact{
  white-space: pre-wrap;
}
.nav-case{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 52px;
  text-align: center;
}
.nav-case .item{
  display: inline-block;
  margin: 0 30px;
  height: 50px;
  line-height: 50px;
  color: #99999a;
  font-size: 16px;
  cursor: pointer;
}
.nav-case .item.on{
  color: #fff;
  border-bottom: 2px solid #fff;
}
.case-list{
  overflow: hidden;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: center;
  justify-content: center;
}
.case-list .item{
  /*float: left;*/
  width: 740px;
  height: 420px;
  margin: 10px;
  vertical-align: middle;
  background-color: #99999a;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.case-1{ background-image: url("../img/case/1.jpg"); }
.case-2{ background-image: url("../img/case/2.jpg"); }
.case-3{ background-image: url("../img/case/3.jpg"); }
.case-4{ background-image: url("../img/case/4.jpg"); }
.case-5{ background-image: url("../img/case/5.jpg"); }
.case-6{ background-image: url("../img/case/6.jpg"); }
.case-7{ background-image: url("../img/case/7.jpg"); }
.case-8{ background-image: url("../img/case/8.jpg"); }
.case-9{ background-image: url("../img/case/9.jpg"); }
.case-10{ background-image: url("../img/case/10.jpg"); }
.case-11{ background-image: url("../img/case/11.jpg"); }
.case-12{ background-image: url("../img/case/12.jpg"); }
.case-13{ background-image: url("../img/case/13.jpg"); }
.case-14{ background-image: url("../img/case/14.jpg"); }
.case-15{ background-image: url("../img/case/15.jpg"); }


.content-center{
  text-align: center;
}
.content-img{
  max-width: 95%;
  margin: 0 auto;
  display: inline-block;
  margin-bottom: 5px;
}