.head {
  width: 100%;
  height: 80px;
  line-height: 80px;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}
.head .container {
  height: 100%;
}
.head .container .left-logo {
  float: left;
  height: 100%;
  line-height: 80px;
  margin-right: 30px;
}
.head .container .left-logo a {
  display: inline-block;
  height: 100%;
  line-height: 80px;
  float: left;
  font-size: 0;
}
.head .container .left-logo a img {
  display: inline-block;
  vertical-align: middle;
  max-height: 100%;
}
.head .container .nav {
  float: left;
  line-height: 80px;
}
.head .container .nav > ul {
  width: auto;
  height: auto;
  display: table-cell;
  content: "";
}
.head .container .nav > ul > li {
  float: left;
  line-height: 80px;
  position: relative;
}
.head .container .nav > ul > li > a {
  display: inline-block;
  height: 80px;
  line-height: 80px;
  padding: 0 20px;
  color: #fff;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
  font-size: 16px;
}
.head .container .nav > ul > li.active > a,
.head .container .nav > ul > li:hover > a {
  color: #00abff;
}
.head .container .nav > ul > li ul.slist {
  position: absolute;
  left: 0;
  top: 65px;
}
.head .container .nav > ul > li ul.slist > li {
  display: inline-block;
  height: 40px;
  float: left;
  line-height: 40px;
  white-space: nowrap;
  opacity: 0;
}
.head .container .nav > ul > li ul.slist > li > a {
  display: inline-block;
  width: 100%;
  height: 100%;
  padding: 0 20px;
  color: #fff;
  font-size: 14px;
  float: left;
  text-align: left;
}
.head .container .nav > ul > li ul.slist > li:hover a {
  color: #00abff;
}
.head .container .nav > ul > li:hover ul.slist > li {
  opacity: 1;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(1) {
  -webkit-transition: opacity 0.5s ease 0.2s;
  -moz-transition: opacity 0.5s ease 0.2s;
  -o-transition: opacity 0.5s ease 0.2s;
  -ms-transition: opacity 0.5s ease 0.2s;
  transition: opacity 0.5s ease 0.2s;
  animation: zoomInLeft 0.6s 0.2s;
  -webkit-animation: zoomInLeft 0.6s 0.2s;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(2) {
  -webkit-transition: opacity 0.5s ease 0.4s;
  -moz-transition: opacity 0.5s ease 0.4s;
  -o-transition: opacity 0.5s ease 0.4s;
  -ms-transition: opacity 0.5s ease 0.4s;
  transition: opacity 0.5s ease 0.4s;
  animation: zoomInLeft 0.6s 0.4s;
  -webkit-animation: zoomInLeft 0.6s 0.4s;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(3) {
  -webkit-transition: opacity 0.5s ease 0.6s;
  -moz-transition: opacity 0.5s ease 0.6s;
  -o-transition: opacity 0.5s ease 0.6s;
  -ms-transition: opacity 0.5s ease 0.6s;
  transition: opacity 0.5s ease 0.6s;
  animation: zoomInLeft 0.6s 0.6s;
  -webkit-animation: zoomInLeft 0.6s 0.6s;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(4) {
  -webkit-transition: opacity 0.5s ease 0.8s;
  -moz-transition: opacity 0.5s ease 0.8s;
  -o-transition: opacity 0.5s ease 0.8s;
  -ms-transition: opacity 0.5s ease 0.8s;
  transition: opacity 0.5s ease 0.8s;
  animation: zoomInLeft 0.6s 0.8s;
  -webkit-animation: zoomInLeft 0.6s 0.8s;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(5) {
  -webkit-transition: opacity 0.5s ease 1s;
  -moz-transition: opacity 0.5s ease 1s;
  -o-transition: opacity 0.5s ease 1s;
  -ms-transition: opacity 0.5s ease 1s;
  transition: opacity 0.5s ease 1s;
  animation: zoomInLeft 0.6s 1s;
  -webkit-animation: zoomInLeft 0.6s 1s;
}
.head .container .nav > ul > li:hover ul.slist > li:nth-child(6) {
  -webkit-transition: opacity 0.5s ease 1.2s;
  -moz-transition: opacity 0.5s ease 1.2s;
  -o-transition: opacity 0.5s ease 1.2s;
  -ms-transition: opacity 0.5s ease 1.2s;
  transition: opacity 0.5s ease 1.2s;
  animation: zoomInLeft 0.6s 1.2s;
  -webkit-animation: zoomInLeft 0.6s 1.2s;
}
.head.white_head {
  background: #fff;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}
.head.white_head .container .nav > ul > li > a {
  color: #333;
}
.head.white_head .container .nav > ul > li.active > a,
.head.white_head .container .nav > ul > li:hover > a {
  color: #00abff;
}
.head.white_head .container .nav > ul > li ul.slist > li > a {
  color: #333;
  background: #fff;
}
.head.white_head .container .nav > ul > li ul.slist > li:hover a {
  color: #00abff;
}
.head-slide {
  position: fixed;
  width: 130px;
  height: auto;
  right: 50px;
  top: 260px;
  z-index: 999;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}
.head-slide > ul {
  width: auto;
  height: auto;
  display: table-cell;
  content: "";
}
.head-slide > ul > li {
  float: left;
  width: 100%;
  line-height: 40px;
  position: relative;
}
.head-slide > ul > li > a {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  color: #999;
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  -ms-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
  font-size: 16px;
}
.head-slide > ul > li.haschild > a i {
  display: inline-block;
  width: 9px;
  height: 5px;
  background: url(../../images/headslide-arrowdown.png) no-repeat center center;
  transition: all .3s;
  -moz-transition: all .3s;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  -ms-transition: all .3s;
  margin-left: 10px;
  vertical-align: middle;
  line-height: 40px;
}
.head-slide > ul > li.haschild.active > a i {
  -moz-transform-origin: center center;
  -moz-transform: rotate(180deg);
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(180deg);
  -o-transform-origin: center center;
  -o-transform: rotate(180deg);
  -ms-transform-origin: center center;
  -ms-transform: rotate(180deg);
  transform-origin: center center;
  transform: rotate(180deg);
  background: url(../../images/headslide-arrowup.png) no-repeat center center;
}
.head-slide > ul > li.active > a,
.head-slide > ul > li:hover > a {
  color: #5b96e7;
}
.head-slide > ul > li ul.slist {
  display: none;
}
.head-slide > ul > li ul.slist > li {
  display: inline-block;
  width: 100%;
  height: 30px;
  float: left;
  line-height: 30px;
  white-space: nowrap;
  padding-left: 10px;
}
.head-slide > ul > li ul.slist > li > a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #777;
  font-size: 14px;
  float: left;
  text-align: left;
}
.head-slide > ul > li ul.slist > li:hover a {
  color: #5b96e7;
}
@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
