/* ==========================================================================
	footer
========================================================================== */

#footer #footer-up > .social > .group > span:before,
#footer #go-top .go-top:before {
  font-family: 'icomoon';
}
#footer #footer-up > .contact-info > .txt > span,
#footer #footer-up > .contact-num > .txt > span,
#footer #footer-down > .page-link > .left > .group > a > span {
  color: #565962;
}
#index #footer {
  background: #fff;
}
#footer {
  width: 100%;
  background: #eeeeee;
}
#footer #footer-up,
#footer #footer-down {
  display: block;
  width: 1300px;
  margin: 0 auto;
  height: 135px;
}
@media screen and (max-width: 1407px) {
  #footer #footer-up,
  #footer #footer-down {
    width: 1000px;
  }
}
#footer #footer-up {
  height: 110px;
  padding-top: 48px;
  margin-bottom: 35px;
}
#footer .horizontal-line {
  border-top: solid 1px #d5d5d5;
  width: 100%;
  height: 1px;
}
#footer #footer-down {
  height: 180px;
  margin-top: 32px;
  margin-bottom: 50px;
}

#footer #footer-up .list-item {
  width: calc(100% / 3 - 12px);
  margin-right: 17px;
}
#footer #footer-up .list-item:last-child {
  margin-right: 0;
}
#footer #footer-up .list-item .pic {
  position: relative;
  /* width: 322px; */
  width: 100%;
  height: 110px;
}
#footer #footer-up .list-item .pic img {
  position: absolute;
  width: 100%;
}
#footer #footer-up .list-item .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: rgba(96, 167, 193, 0.6);
  -webkit-transition: all 0.4s linear, background-position 0.6s;
  -moz-transition: all 0.4s linear, background-position 0.6s;
  -o-transition: all 0.4s linear, background-position 0.6s;
  -ms-transition: all 0.4s linear, background-position 0.6s;
  transition: all 0.4s linear, background-position 0.6s;
}
#footer #footer-up .list-item:hover .mask {
  opacity: 1;
  background-position: center;
  z-index: 1;
}
#footer #footer-up .list-item .mask .border {
  position: absolute;
  background-color: #fff;
  opacity: 0;
  z-index: 2;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  -ms-transition: all 0.8s ease-in-out;
  transition: all 0.8s ease-in-out;
  animation-delay: 1s;
}
#footer #footer-up .list-item:hover .mask .border {
  opacity: 0.3;
}
#footer #footer-up .list-item:hover .mask .border-top,
#footer #footer-up .list-item:hover .mask .border-bottom {
  width: -webkit-calc(100% - 10px);
  width: -moz-calc(100% - 10px);
  width: -ms-calc(100% - 10px);
  width: -o-calc(100% - 10px);
  width: calc(100% - 10px);
  left: 5px;
}
#footer #footer-up .list-item:hover .mask .border-left,
#footer #footer-up .list-item:hover .mask .border-right {
  height: -webkit-calc(100% - 10px);
  height: -moz-calc(100% - 10px);
  height: -ms-calc(100% - 10px);
  height: -o-calc(100% - 10px);
  height: calc(100% - 10px);
  top: 5px;
}
#footer #footer-up .list-item .mask .border-top,
#footer #footer-up .list-item .mask .border-bottom {
  height: 1px;
  width: 0%;
  left: 50%;
}
#footer #footer-up .list-item .mask .border-left,
#footer #footer-up .list-item .mask .border-right {
  width: 1px;
  height: 0%;
  top: 50%;
}
#footer #footer-up .list-item .mask .border-top {
  top: 5px;
}
#footer #footer-up .list-item .mask .border-bottom {
  bottom: 5px;
}
#footer #footer-up .list-item .mask .border-left {
  left: 5px;
}
#footer #footer-up .list-item .mask .border-right {
  right: 5px;
}
#footer #footer-up .list-item:hover .mask .border-top {
  left: 5px;
}
#footer #footer-up .list-item:hover .mask .border-bottom {
  bottom: 5px;
}
#footer #footer-up .list-item:hover .mask .border-left {
  top: 5px;
}
#footer #footer-up .list-item:hover .mask .border-right {
  right: 5px;
}
#footer #footer-up .list-item .txt {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 18px;
  color: #fff;
  -webkit-transform: translate(-50%, -50%);
  -mos-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  -ms-transition: all 0.8s ease-in-out;
  transition: all 0.8s ease-in-out;
  opacity: 0;
  z-index: 3;
  margin-top: -4px;
}
#footer #footer-up .list-item:hover .txt {
  opacity: 1;
}

#footer #footer-down .left,
#footer #footer-down .right {
  display: inline-block;
}
#footer #footer-down .left {
  float: left;
  /* width: 650px; */
  width: calc(100% - 350px);
}
#footer #footer-down .right {
  float: left;
  width: 350px;
}
#footer #footer-down .left .table {
  width: auto;
  margin-top: 3px;
}
#footer #footer-down .left .table > thead > tr > th,
#footer #footer-down .left .table > tbody > tr > td {
  padding: 8px 0;
}
#footer #footer-down .left .table > thead > tr > th {
  color: #30699b;
  font-size: 16px;
  padding-bottom: 0;
  font-weight: normal;
}
#footer #footer-down .left .table > tbody > tr > td {
  padding-right: 50px;
  border-top: 0;
}
#footer #footer-down .left .table > tbody > tr > td:last-child {
  padding-right: 0;
}
#footer #footer-down .left .table > tbody > tr > td a {
  color: #8f8f8f;
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
}
#footer #footer-down .right {
  border-left: solid 2px #dedede;
  padding-left: 30px;
}
#footer #footer-down .right .co h3 {
  color: #434242;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  margin-top: 0;
}
#footer #footer-down .right .location {
  margin-bottom: 12px;
}
#footer #footer-down .right .location span,
#footer #footer-down .right .contact span {
  color: #8f8f8f;
  font-size: 16px;
  line-height: 20px;
  font-weight: 300;
}
#footer #footer-down .right .contact .group {
  display: block;
}
#footer #footer-down .right > .list > .group > span.company:before {
  content: '©';
  position: absolute;
  margin-left: -16px;
}
#footer li .borderBottom:after {
  bottom: 0;
}
#copyright {
  height: 35px;
  background: #c1c1c1;
  position: relative;
}
#copyright .group {
  position: relative;
  width: 1000px;
  display: block;
  margin: 0 auto;
}
#copyright .company,
#copyright .author {
  display: inline-block;
  position: absolute;
}
#copyright .company {
  left: 0;
}
#copyright .author {
  right: 0;
}
#copyright span,
#copyright span a {
  font-size: 12px;
  color: #fff;
  line-height: 35px;
  font-weight: 400;
}
#copyright .company span,
#copyright .company span a {
  letter-spacing: 1.2px;
}

@media screen and (max-width: 1023px) {
  #footer #footer-up,
  #footer #footer-down {
    width: 100%;
  }
  #footer #footer-up {
    float: left;
    height: auto;
    padding-top: 30px;
    margin-bottom: 15px;
  }
  #footer #footer-down {
    margin-top: 15px;
  }
  #footer #footer-up .lists {
    width: 100%;
    float: left;
  }
  #footer #footer-up .lists .list-item {
    height: 110px;
    width: 33.33333333334%;
    padding: 0;
    margin-right: 0;
  }
  #footer #footer-up .lists .list-item:last-child {
    margin-right: 0;
  }
  #footer #footer-up .lists .list-item a {
    float: left;
    position: relative;
    width: 100%;
  }

  #footer #footer-up .lists .list-item .pic {
    width: 100%;
  }
  #footer #footer-up .lists .list-item .pic img {
    width: auto;
  }
  #footer #footer-up .lists .list-item .mask {
    height: 110px;
  }
  #footer #footer-down .left,
  #footer #footer-down .right {
    float: left;
    width: auto;
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -mos-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  #footer #footer-down .right {
    border: 0;
    border-top: solid 2px #dedede;
    padding: 30px;
  }
  #copyright .group {
    position: relative;
    width: auto;
    display: block;
    margin: 0 auto;
    height: 35px;
  }
  #copyright {
    padding: 0 15px;
  }
}

@media screen and (max-width: 767px) {
  #footer #footer-up {
    display: none;
  }
  #footer #footer-down {
    margin-top: 0;
  }
  #footer #footer-up .lists {
    width: 322px;
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -mos-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  #footer #footer-up .lists .list-item {
    width: 322px;
    margin-bottom: 17px;
  }
  #footer #footer-up .list-item:last-child {
    margin-bottom: 0;
  }
  #footer #footer-up .list-item .txt {
    margin-top: -3px;
  }
  #footer #footer-down {
    margin-bottom: 0;
  }
  #footer #footer-down .left {
    display: none;
  }
  #copyright {
    padding: 0 30px;
    float: left;
    height: auto;
  }
  #copyright .group {
    width: 100%;
    float: left;
    height: auto;
    padding: 10px 0;
  }
  #copyright .company,
  #copyright .author {
    position: relative;
    width: auto;
    display: block;
    float: left;
  }
  #copyright span,
  #copyright span a {
    line-height: 20px;
  }
  #footer #footer-up .lists .list-item .mask,
  #footer #footer-up .lists .list-item .txt {
    opacity: 1;
  }
  #footer #footer-up .list-item .mask .border {
    opacity: 0.3;
  }

  #footer #footer-up .list-item .mask .border-top,
  #footer #footer-up .list-item .mask .border-bottom {
    width: -webkit-calc(100% - 10px);
    width: -moz-calc(100% - 10px);
    width: -ms-calc(100% - 10px);
    width: -o-calc(100% - 10px);
    width: calc(100% - 10px);
    left: 5px;
  }
  #footer #footer-up .list-item .mask .border-left,
  #footer #footer-up .list-item .mask .border-right {
    height: -webkit-calc(100% - 10px);
    height: -moz-calc(100% - 10px);
    height: -ms-calc(100% - 10px);
    height: -o-calc(100% - 10px);
    height: calc(100% - 10px);
    top: 5px;
  }
  #footer #footer-up .list-item .mask .border-top {
    left: 5px;
  }
  #footer #footer-up .list-item .mask .border-bottom {
    bottom: 5px;
  }
  #footer #footer-up .list-item .mask .border-left {
    top: 5px;
  }
  #footer #footer-up .list-item .mask .border-right {
    right: 5px;
  }
}
