@charset "utf-8";

/* CSS Document */
body,
html {
  width: 100%;
  height: 100%;
  overflow-y: hidden;
  -moz-user-select: none; /* Firefox私有属性 */
  -webkit-user-select: none; /* WebKit内核私有属性 */
  -ms-user-select: none; /* IE私有属性(IE10及以后) */
  -khtml-user-select: none; /* KHTML内核私有属性 */
  -o-user-select: none; /* Opera私有属性 */
  user-select: none; /* CSS3属性 */
}
img {
  image-rendering: -moz-crisp-edges; /* Firefox */
  image-rendering: -o-crisp-edges; /* Opera */
  image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
}
@font-face {
  font-weight: normal;
  font-family: "YouSheBiaoTiHei";
  font-style: normal;
  src: url("../assets/fonts/YouSheBiaoTiHei.ttf"),
    url("../assets/fonts/YouSheBiaoTiHei.woff") format("woff");
}
@font-face {
  font-family: "AlibabaPuHuiTi";
  src: url("../assets/fonts/AlibabaPuHuiTi.otf"),
    url("../assets/fonts/AlibabaPuHuiTi.woff") format("woff");
}
@font-face {
  font-family: "JetBrainsMono";
  src: url("../assets/fonts/JetBrainsMono.ttf"),
    url("../assets/fonts/JetBrainsMono.eot") format("embedded-opentype");
}
.logItem {
  position: absolute;
  top: calc(12vh + 10px);
  margin-left: 10px;
  color: rgba(255, 255, 255, 0.85);
  font-size: 14px;
  font-family: "JetBrainsMono";
}
.wrapBox {
  position: fixed;
  width: 100%;
  height: 100%;
}
.box {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.page1 {
  /* background: url(../assets/firstPageBg.png) no-repeat center top; */
  background-size: 100%;
}
.page1bg {
  background: url(../assets/firstPageBg.png) no-repeat center top;
  background-size: 100%;
}
video {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: -11;
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
}
source {
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
}
.logoText {
  width: 30.6vw;
  height: 11.48vh;
  margin: auto;
  margin-top: 40.6vh;
}
.concept {
  width: 100%;
  margin-top: 4.4vh;
  color: #fb9632;
  font-weight: 400;
  font-size: 34px;
  font-family: "YouSheBiaoTiHei";
  text-align: center;
}
.companyDes {
  width: 100%;
  margin-top: 2vh;
  color: #fb9632;
  font-weight: 400;
  font-size: 34px;
  font-family: "YouSheBiaoTiHei";
  text-align: center;
}
.pcSlideDown {
  display: block;
  color: #fff;
}
.mpSlideUp {
  display: none;
  color: #fff;
}
.slideDown {
  position: absolute;
  bottom: 6.8vh;
  left: calc(50vw - 12px);
  width: 24px;
  height: 42px;
  -webkit-animation: play 1s linear 0s infinite alternate;
  animation: play 1s linear 0s infinite alternate;
}
.slideUp {
  position: absolute;
  bottom: 6.8vh;
  left: calc(50vw - 39px);
  width: 78px;
  height: 60px;
  -webkit-animation: play 1s linear 0s infinite alternate;
  animation: play 1s linear 0s infinite alternate;
}
.slideDownText {
  position: absolute;
  bottom: calc(6.8vh - 20px);
  width: 100%;
  color: #fff;
  font-weight: 400;
  font-size: 14px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
  -webkit-animation: play 1s linear 0s infinite alternate;
  animation: play 1s linear 0s infinite alternate;
}
.slideUpText {
  position: absolute;
  bottom: calc(6.8vh - 50px);
  width: 100%;
  color: #fff;
  font-weight: 400;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
  -webkit-animation: play 1s linear 0s infinite alternate;
  animation: play 1s linear 0s infinite alternate;
}

.w960 {
  position: relative;
  width: 960px;
  height: 100%;
  margin: 0 auto;
}
.page1_01 {
  position: absolute;
  top: 120px;
  left: -120px;
  z-index: 10;
  transition: all 2s linear 0s;
}
.page1_02 {
  position: absolute;
  top: 250px;
  right: 30px;
  z-index: 9;
  transition: all 2s linear 0s;
}

.page1_02_btn {
  margin-top: 15px;
  -webkit-animation: play 1s linear 0s infinite alternate;
  animation: play 1s linear 0s infinite alternate;
}
@keyframes play {
  from {
    opacity: 0.3;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes play {
  from {
    opacity: 0.3;
  }
  to {
    opacity: 1;
  }
}
.page1_03 {
  position: absolute;
  bottom: -130px;
  left: 50%;
  margin-left: -720px;
}
.page1_04 {
  position: absolute;
  top: 460px;
  right: -50px;
}
.box.comeout .page1_01 {
  left: -220px;
  opacity: 0;
}
.box.comeout .page1_02 {
  top: 350px;
  opacity: 0;
}
.page2 {
  background-size: 100%;
}
.page2Team {
  background: url(../assets/teamBg.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2Timeline {
  background: url(../assets/timelineBg.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2About {
  background: url(../assets/aboutBg.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2Title {
  width: 100%;
  margin-top: 16vh;
  color: #1a1a1a;
  font-size: 48px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.page2Des {
  width: 100%;
  margin-top: 10px;
  color: #fff;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.page2BtnBar {
  width: 100%;
  margin-top: 30px;
  padding-left: 23.12vw;
}
.page2BtnBar button {
  width: 7.9vw;
  height: 5.2vh;
  margin: 0 5vw;
  color: #fff;
  font-size: 18px;
  background: transparent;
  border: 1px solid #fff;
}
.page2BtnBar button.current {
  background: #e37c29;
  border: 0;
}
.page2BtnBar button:hover {
  background: #e37c29;
  border: 0;
}
.page2Logo {
  width: 100%;
  background-size: 100%;
}
.page2Info {
  width: 60vw;
  height: 28vw;
  margin: 0 auto;
}
.page2InfoTitle {
  display: none;
}
#mpTeamDes {
  display: none;
}
#mpTimeline {
  display: none;
}
#mpAbout {
  display: none;
}
.page2InfoTeam {
  background: url(../assets/teamDes.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2InfoTimeline {
  background: url(../assets/timeLineDes.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2InfoAbout {
  background: url(../assets/aboutDes.png) no-repeat center top;
  background-size: 100%;
  transition: all 1s linear 0s;
}
.page2_01 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(0deg);
  transition: all 2s ease 0s;
}
.box.comeout .page2InfoTeam,
.box.comeout .page2InfoTimeline,
.box.comeout .page2InfoAbout {
  transform: translate(0, -50%) scaleY(0.5);
  opacity: 0;
}
.page3 {
  background: #fff;
}
.page3Title {
  width: 100%;
  margin-top: 16vh;
  color: #1a1a1a;
  font-size: 48px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.page3Des {
  width: 100%;
  margin-top: 10px;
  color: #999;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.page3DesMp {
  display: none;
}
.box.comeout .grid figure {
  transform: scale(0.8, 0.8) translate(-10%, -40%);
  opacity: 0.9;
}
.page4 {
  background: url(../assets/innovate-bg.png) no-repeat center top;
  background-size: 100%;
}
.page5 {
  background: #fff;
}
nav {
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 12vh;
  padding-top: 4.5vh;
  padding-right: 14.68vw;
  padding-left: 18.75vw;
  background: rgba(0, 0, 0, 0.6);
}
.fixedNavBar {
  display: flex;
  justify-content: space-between;
}
.fixedNavLogo {
  width: 9.5vw;
  height: 6vh;
  background: url(../assets/logo.png) no-repeat center top;
  background-size: 100%;
}
.fixedNavBtnBar {
  display: flex;
  align-items: center;
  height: 5vh;
}
.fixedNavBtn {
  padding: 0 2vw 2.6vh 2vw;
  color: #fff !important;
  font-size: 20px;
  font-family: "AlibabaPuHuiTi";
}
.fixedNavBar ul li a:hover {
  padding: 0 2vw 2.6vh 2vw;
  color: #f29538 !important;
  text-decoration: none;
  border-bottom: 4px solid #f29538;
}
.fixedNavBtnBar li.current a {
  color: #f29538 !important;
  border-bottom: 4px solid #f29538;
}
.menuBtn {
  display: none;
  width: 3vh;
  height: 2.43vh;
  margin-top: 0.5vh;
  background: url("../assets/menu.png") no-repeat center center;
  background-size: 100% auto;
}
.closeMenuBtn {
  display: none;
  width: 3vh;
  height: 2.43vh;
  margin-top: 0.5vh;
  background: url("../assets/closeMenu.png") no-repeat center center;
  background-size: 100% auto;
}
.wapmenubottom {
  position: absolute;
  top: 6vh;
  z-index: 9999;
  display: none;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.65);
}

.wapmenubottomx {
  position: relative;
  width: 100%;
  height: 100%;
}

.wapmenuwap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wapmenuw {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wapmenut {
  width: 100%;
  text-align: center;
}

.wapmenut li {
  width: 100%;
  height: 124px;
  line-height: 124px;
}

.wapmenut li a {
  color: #fff;
  font-size: 6rem;
  font-family: "AlibabaPuHuiTi";
}
.wapmenut li.current a {
  color: #f29538;
}

.wapmenuwapx {
  width: 100%;
  height: 50px;
}

.top_big {
  width: 100%;
  margin: 0 auto;
}
.top_left {
  float: left;
  line-height: 60px;
}
.top_left a {
  display: inline-block;
  float: left;
}
.top_left .logo_zi {
  float: left;
  width: 150px;
  margin-top: 20px;
  margin-left: 20px;
}
.top_left h2 {
  float: left;
  color: #000;
  font-size: 25px;
  line-height: 25px;
  letter-spacing: 2px;
}
.top_left p {
  float: left;
  color: #000;
  font-size: 12px;
  line-height: 20px;
}
.top_right {
  float: right;
}
.top_right ul li {
  float: left;
  font-size: 16px;
}
.top_right ul li a {
  padding: 20px 20px;
  color: #000;
  line-height: 60px;
}
.top_right ul li a:hover {
  padding: 20px 20px;
  color: #ea581a;
  text-decoration: none;
  border-bottom: 1px solid #ea581a;
}
.nav li.current a {
  color: #ea581a !important;
  border-bottom: 1px solid #ea581a;
}

.mpProductPage1 {
  display: none;
}
.fp-controlArrow.fp-prev {
  display: none;
}
.fp-controlArrow.fp-next {
  display: none;
}

.grid {
  /* position: relative;
  clear: both;
  max-width: 100%;
  margin: 0 auto;
  padding: 1em 0 4em;
  text-align: center;
  list-style: none; */
  display: flex;
  width: 100%;
  margin-top: 12px;
  padding-left: calc(13.25vw - 12px);
  background: #fff;
}

.grid h2 {
  font-size: 20px;
}

.grid figure {
  position: relative;
  overflow: hidden;
  text-align: center;
  background: #3085a3;
  cursor: pointer;
  transition: all 1s linear 0s;
}

.grid figure figcaption {
  padding: 1em;
  color: #fff;
  font-size: 1.25em;

  /* text-transform: uppercase; */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
  pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Anchor will cover the whole item by default */

/* For some effects it will show as a button */
.grid figure figcaption > a {
  z-index: 1000;
  font-size: 0;
  white-space: nowrap;
  text-indent: 200%;
  opacity: 0;
}

.grid figure h2 {
  font-weight: 300;
  word-spacing: -0.15em;
}

.grid figure h2 span {
  font-weight: 800;
}

.grid figure h2,
.grid figure p {
  margin: 0;
}

.grid figure p {
  font-size: 68%;
  letter-spacing: 1px;
  text-align: left;
}

/* --------------- */

/***** Bubba *****/

/* --------------- */

figure.effect-bubba {
  width: 24.5vw;
  height: 13.75vw;
  margin: 0 6px;
  background: #000;
}

figure.effect-bubba:hover {
  transform: scale3d(1.02, 1.02, 1.02);
}

figure.effect-bubba img {
  width: 100%;
  opacity: 0.7;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}

figure.effect-bubba:hover img {
  opacity: 0.4;
}

figure.effect-bubba figcaption::before,
figure.effect-bubba figcaption::after {
  position: absolute;
  top: 30px;
  right: 30px;
  bottom: 30px;
  left: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  content: "";
}

figure.effect-bubba figcaption::before {
  /* border-top: 1px solid #fff; */

  /* border-bottom: 1px solid #fff; */
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
}

figure.effect-bubba figcaption::after {
  /* border-right: 1px solid #fff; */

  /* border-left: 1px solid #fff; */
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0);
}

figure.effect-bubba h2 {
  padding-top: 28%;
  color: #fff;
  font-weight: normal;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  -webkit-transform: translate3d(0, -20px, 0);
  transform: translate3d(0, -20px, 0);
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
}

figure.effect-bubba p {
  padding: 20px 1em;
  -webkit-transform: translate3d(0, 20px, 0);
  transform: translate3d(0, 20px, 0);
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
}

figure.effect-bubba:hover figcaption::before,
figure.effect-bubba:hover figcaption::after {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

figure.effect-bubba:hover h2 {
  padding-top: 2%;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: padding-top 1s;
}
figure.effect-bubba:hover p {
  padding-top: 4%;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: opacity 1s;
}
.box.comeout .innovateContent figure {
  transform: scale(0.2, 0.2) rotate(360deg);
  opacity: 0.5;
}

/* innovate */
.innovateTitle {
  width: 100%;
  margin-top: 16vh;
  color: #1a1a1a;
  font-size: 48px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.innovateDes {
  width: 100%;
  margin-top: 10px;
  color: #fff;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.innovateContent {
  display: flex;
  width: 100%;
  margin-top: 12px;
  padding-left: calc(12.5vw - 24px);
}
.innovateContent h2 {
  font-size: 20px;
}
.innovateContent figure {
  position: relative;
  overflow: hidden;
  text-align: center;
  background: #3085a3;
  cursor: pointer;
  transition: all 1s linear 0s;
}
.innovateContent figure figcaption {
  color: #fff;
  font-size: 1.25em;

  /* text-transform: uppercase; */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.innovateContent figure.clientInfo {
  width: 25vw;
  height: 25vw;
  margin: 0 12px;
}
.innovateContent .innovateOneBg {
  background: url(../assets/innovate-one.png) no-repeat center top;
  background-size: 100%;
}
.innovateContent .innovateTwoBg {
  background: url(../assets/innovate-two.png) no-repeat center top;
  background-size: 100%;
}
.innovateContent .innovateThreeBg {
  background: url(../assets/innovate-three.png) no-repeat center top;
  background-size: 100%;
}
.innovateContent figure figcaption::before,
.innovateContent figure figcaption::after {
  pointer-events: none;
}

.innovateContent figure figcaption,
.innovateContent figure figcaption > a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Anchor will cover the whole item by default */

/* For some effects it will show as a button */
.innovateContent figure figcaption > a {
  z-index: 1000;
  font-size: 0;
  white-space: nowrap;
  text-indent: 200%;
  opacity: 0;
}

.innovateContent figure h2 {
  font-weight: 300;
  word-spacing: -0.15em;
}

.innovateContent figure h2 span {
  font-weight: 800;
}

.innovateContent figure h2,
.innovateContent figure p {
  margin: 0;
}

.innovateContent figure p {
  letter-spacing: 1px;
}

/* --------------- */

/***** Bubba *****/

/* --------------- */

.innovateContent figure.clientInfo img {
  width: 100%;
  height: 45.87%;
  -webkit-transform: translate3d(0, -20px, 0);
  transform: translate3d(0, -20px, 0);
  opacity: 0;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}

.innovateContent figure.clientInfo figcaption::before,
.innovateContent figure.clientInfo figcaption::after {
  position: absolute;
  top: 30px;
  right: 30px;
  bottom: 30px;
  left: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  content: "";
}

.innovateContent figure.clientInfo figcaption::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
}

.innovateContent figure.clientInfo figcaption::after {
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0);
}

.innovateContent figure.clientInfo h2 {
  padding-top: 50%;
  color: #fff;
  font-weight: normal;
  font-size: 28px;
  font-family: "AlibabaPuHuiTi";
  -webkit-transform: translate3d(0, -20 px, 0);
  transform: translate3d(0, -20 px, 0);
  -webkit-transition: -webkit-transform 0.35s;
  transition: opacity 1s linear, padding 1s linear, transform 1s linear;
}

.innovateContent figure.clientInfo h3 {
  margin: 0%;
  color: #fff;
  font-weight: normal;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  opacity: 0;
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
}

.innovateContent figure.clientInfo p {
  padding: 5% 1em;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
}

.innovateContent figure.clientInfo:hover figcaption::before,
.innovateContent figure.clientInfo:hover figcaption::after {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

.innovateContent figure.clientInfo:hover h2 {
  padding: 2%;
  font-size: 16px;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(-35%, 0, 0);
  opacity: 0.75;
  transition: opacity 1s linear, padding 1s linear, transform 1s linear;
}
.innovateContent figure.clientInfo:hover h3,
.innovateContent figure.clientInfo:hover p {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: opacity 0.35s;
}
.innovateContent figure.clientInfo:hover img {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
  transition: opacity 0.35s;
}
.pcContactUs {
  height: 100%;
}
.mpContactUs {
  display: none;
}
.serviceTitle {
  width: 100%;
  margin-top: 16vh;
  color: #1a1a1a;
  font-size: 48px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.serviceDes {
  width: 100%;
  margin-top: 10px;
  color: #999;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
  text-align: center;
}
.container {
  max-width: 600px;
  margin: 0 auto;
}
.loop {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10vh 0;
}
.carousel {
  /* margin: 0 30px; */

  /* width: calc(100% - ($button-spacing * 2)); */
  width: 50vw;
  height: 13vh;
}

.col-xs-3 {
  height: 13vh;
}
.carousel[data-shift="1"] .carousel-inner > .item {
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.carousel .carousel-inner > .item.row {
  margin: 0;
}

.carousel .carousel-control.left {
  top: calc(50% - 12px);
  right: 0;
  bottom: 0;
  left: -34px;
  display: inline-block;
  width: 24px;
  height: 24px;
  border-right: 4px solid #ccc;
  border-bottom: 4px solid #ccc;
  transform: rotate(132deg);
  content: "";
}

.carousel .carousel-control.right {
  top: calc(50% - 12px);
  right: -34px;
  display: inline-block;
  width: 24px;
  height: 24px;
  border-right: 4px solid #ccc;
  border-bottom: 4px solid #ccc;
  transform: rotate(-42deg);
  content: "";
}

.carousel-control.left {
  background: none !important;
}
.carousel-control.right {
  background: none !important;
}

/* -------------footer--------------------------- */
footer {
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: "AlibabaPuHuiTi";
  background: #2e2e2e;
}
.footer_center {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.footer_li {
  float: left;
  margin: 0 50px;
  margin-top: 15px;
  text-align: left;
}

.footerNav li a:hover {
  color: #f29538 !important;
  cursor: pointer;
}

.footer_li a,
.footer_li li {
  color: #fff !important;
  font-size: 14px;
  line-height: 25px;
}
.footer_li a {
  display: inline-block;
}

.footer_li .title {
  width: 120px;
  margin-bottom: 5px;
  padding-right: 24px;
  color: #fff;
  font-size: 16px;
  line-height: 35px;
  text-decoration: none;
  border-bottom: 1px solid #fff;
}
.footer_li ul li a {
  text-decoration: none;
}
.footer_li ul li a:hover {
  color: #f29538;
}
.copyright_li {
  position: relative;
}
.copyright {
  position: absolute;
  top: calc(50% + 90px);
  right: calc(50% - 316px);
  height: 100%;
  padding: 5px 0;
  color: #fff;
  border-top: 1px solid #fff;
}
.copyright a {
  color: #cdbb7c !important;
  text-decoration: none;
  cursor: pointer;
}
.copyright a:hover,
a:active,
a:visited,
a:focus {
  color: #cdbb7c;
  text-decoration: none !important;
}
.position {
  position: absolute;
  right: 0;
  bottom: 5px;
  color: #1a1a1a;
  font-size: 18px;
  font-family: "AlibabaPuHuiTi";
  text-align: end;
}
.positionImg {
  position: absolute;
  right: 132px;
  width: 14px;
  height: 21px;
}
.operatingDutyTitle {
  color: #1a1a1a;
  font-size: 24px;
  font-family: "AlibabaPuHuiTi";
}
.operatingDutySubTitle {
  color: #999;
  font-size: 22px;
  font-family: "AlibabaPuHuiTi";
}
.operatingDutyDes {
  margin-bottom: 5px;
  color: #666;
  font-size: 20px;
  font-family: "AlibabaPuHuiTi";
}
.contactInfo {
  display: flex;
  align-items: center;
  margin-top: 35px;
  color: #1a1a1a;
  font-size: 18px;
  font-family: "AlibabaPuHuiTi";
  line-height: 21px;
}
.contactImg {
  width: 23px;
  height: 23px;
  margin-right: 2px;
}
.contactDetail {
  width: 50%;
}
@media screen and (max-width: 1366px) {
  .logItem {
    font-size: 13px;
  }
}
@media screen and (max-width: 1280px) {
  .modal-lg {
    margin-top: 4vh !important;
  }
  .logItem {
    font-size: 12px;
  }
  .page2BtnBar {
    margin-top: 15px;
  }
  figure.effect-bubba h2 {
    font-size: 21px;
  }
  figure.effect-bubba:hover p {
    padding-top: 2%;
    font-size: 10%;
  }
  .loop {
    margin: 5vh 0;
  }
}
@media (min-width: 320px) and (max-width: 1024px) {
  .page1 {
    background: url(../assets/firstPageBgMp.png) no-repeat center top;
    background-size: 100%;
  }
  video {
    display: none !important;
  }
  nav {
    height: 6vh;
    padding-top: 1.5vh;
    padding-right: 2vh;
    padding-left: 3vh;
  }
  .fixedNavLogo {
    width: 12vh;
  }
  .fixedNavBtnBar {
    display: none;
  }
  .menuBtn {
    display: block;
  }
  .logItem {
    display: none !important;
  }
  .logoText {
    width: 68vw;
    height: 6.65vh;
  }
  .concept {
    font-size: 44px;
  }
  .companyDes {
    font-size: 44px;
  }
  .pcSlideDown {
    display: none;
  }
  .mpSlideUp {
    display: block;
  }
  .page2Team {
    background: url(../assets/teambgmp.png) no-repeat center top;
    background-size: 100%;
    transition: all 1s linear 0s;
  }
  .page2Timeline {
    background: url(../assets/timelineBgMp.png) no-repeat center top;
    background-size: 100%;
    transition: all 1s linear 0s;
  }
  .page2About {
    background: url(../assets/aboutBgMp.png) no-repeat center top;
    background-size: 100%;
    transition: all 1s linear 0s;
  }
  .page2Title {
    margin-top: 10vh;
    color: #fff;
    font-size: 64px;
  }
  .page2Des {
    margin-top: 1vh;
    font-size: 36px;
  }
  .page2BtnBar {
    margin-top: 4vh;
    padding-left: 5vw;
  }
  .page2BtnBar button {
    width: 23.7vw;
    height: 7.9vw;
    margin: 0 3.15vw;
    font-size: 36px;
  }
  .page2Info {
    position: relative;
    width: 91.5vw;
    height: calc(40vh + 180px);
    margin: 4vh auto 0;
    padding-top: 1vw;
  }
  .page2InfoTitle {
    position: relative;
    display: block;
    color: #fff;
    font-size: 40px;
    font-family: "AlibabaPuHuiTi";
  }
  .logLogo {
    position: absolute;
    top: 4vw;
    left: 6vw;
    width: 64px;
    height: 64px;
  }
  .mpLogDomHide {
    transform: translate(0, -50%) scaleY(0.5);
    opacity: 0;
  }
  .logTeam {
    position: absolute;
    top: calc(4vw + 2px);
    left: calc(6vw + 80px);
    display: block;
    transition: all 0.8s linear 0s;
  }
  .logHistory {
    position: absolute;
    top: calc(4vw + 2px);
    left: calc(6vw + 80px);
    display: block;
    transition: all 0.8s linear 0s;
  }
  .logAbout {
    position: absolute;
    top: calc(4vw + 2px);
    left: calc(6vw + 80px);
    display: block;
    transition: all 0.8s linear 0s;
  }
  .logLine {
    position: absolute;
    top: calc(4vw + 60px);
    left: calc(6vw + 32px);
    width: 230px;
    height: 4px;
    background: #f77e23;
  }

  .page2InfoTeam {
    background: rgba(0, 0, 0, 0.65);
    background-size: 100%;
    transition: all 1s linear 0s;
  }
  .page2InfoTimeline {
    background: rgba(0, 0, 0, 0.65);
    background-size: 100%;
    transition: all 1s linear 0s;
  }
  .page2InfoAbout {
    background: rgba(0, 0, 0, 0.65);
    background-size: 100%;
    transition: all 1s linear 0s;
  }

  /* -------------------------------------
   * mpTeamDes
   * ------------------------------------- */
  #mpTeamDes {
    position: absolute;
    top: calc(8vh + 25px);
    display: block;
    padding: 0 6vw;
    color: #fff;
    font-size: 30px;
    font-family: "AlibabaPuHuiTi";
    list-style: none;
    transition: all 0.8s linear 0s;
  }

  /* -------------------------------------
   * timeline
   * ------------------------------------- */
  #mpTimeline {
    position: absolute;
    top: calc(8vh + 25px);
    left: 20vw;
    display: block;
    padding: 0 4vw;
    color: #fff;
    font-size: 30px;
    font-family: "AlibabaPuHuiTi";
    list-style: none;
    border-left: 4px solid #fff;
    transition: all 0.8s linear 0s;
  }
  #mpTimeline li {
    position: relative;
    margin: 2.5vh 0;
  }
  .milestoneLabel {
    margin-bottom: 0;
  }
  .milestoneDate {
    position: absolute;
    top: 50%;
    left: -15vw;
    margin-top: -18px;
  }
  .milestonrCircle {
    position: absolute;
    top: 50%;
    left: calc(-4vw - 14px);
    display: block;
    width: 24px;
    height: 24px;
    margin-top: -10px;
    background: #fff;
    border-radius: 50%;
  }

  /* -------------------------------------
   * mpAbout
   * ------------------------------------- */
  #mpAbout {
    position: absolute;
    top: calc(8vh + 25px);
    display: block;
    padding: 0 6vw;
    color: #fff;
    font-size: 30px;
    font-family: "AlibabaPuHuiTi";
    list-style: none;
    transition: all 0.8s linear 0s;
  }

  .page3Title {
    margin-top: 10vh;
    font-size: 64px;
  }
  .page3Des {
    display: none;
  }
  .page3DesMp {
    display: block;
    width: 100%;
    margin-top: 1vh;
    color: #999;
    font-size: 36px;
    font-family: "AlibabaPuHuiTi";
    text-align: center;
  }
  .grid {
    margin-top: 4vh;
    padding-left: 5vw;
  }
  figure.effect-bubba {
    width: 90vw;
    height: 20vh;
    margin: 0;
    margin-bottom: 2vh;
  }
  figure.effect-bubba h2,
  figure.effect-bubba:hover h2 {
    /* padding-top: 2%; */
    padding-top: 0;
    font-size: 40px;
    text-align: left;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: padding-top 1s;
  }
  figure.effect-bubba:hover p,
  figure.effect-bubba p {
    /* padding: 20px 0;
    padding-top: 4%; */
    position: absolute;
    top: 24%;
    padding: 0;
    padding-right: 2rem;
    font-size: 28px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: opacity 1s;
  }
  .page4 {
    background: url(../assets/innovate-bgMp.png) no-repeat center top;
    background-size: 100%;
  }
  .innovateTitle {
    margin-top: 10vh;
    color: #fff;
    font-size: 64px;
  }
  .innovateDes {
    margin-top: 1vh;
    font-size: 36px;
  }
  .innovateContent {
    margin-top: 4vh;
    padding-left: 5vw;
  }
  .innovateContent figure.clientInfo {
    width: calc(30vw - 24px);
    height: 78.8vh;
  }
  .innovateContent .innovateOneBg {
    background: url(../assets/innovate-oneMp.png) no-repeat center top;
    background-size: 100%;
  }
  .innovateContent .innovateTwoBg {
    background: url(../assets/innovate-twoMp.png) no-repeat center top;
    background-size: 100%;
  }
  .innovateContent .innovateThreeBg {
    background: url(../assets/innovate-threeMp.png) no-repeat center top;
    background-size: 100%;
  }
  .innovateContent figure.clientInfo h3 {
    display: none;
  }
  .innovateContent figure.clientInfo h2,
  .innovateContent figure.clientInfo:hover h2 {
    padding-top: 20%;
    font-size: 40px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: opacity 0.35s;
  }
  .innovateContent figure.clientInfo p,
  .innovateContent figure.clientInfo:hover p {
    font-size: 30px;
    font-family: "AlibabaPuHuiTi";
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: opacity 0.35s;
  }

  .innovateContent figure.clientInfo img {
    height: auto;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: opacity 0.35s;
  }
  .page5 {
    background: url(../assets/contactBgMp.png) no-repeat center top;
    background-size: 100%;
  }
  .pcContactUs {
    display: none;
  }
  .mpContactUs {
    position: relative;
    display: block;
    width: 91.5vw;
    height: 91.5vw;
    margin: calc(50vh - 40.75vw) auto 0;
    padding-top: 1vw;
    font-family: "AlibabaPuHuiTi";
    background: rgba(0, 0, 0, 0.65);
    background-size: 100%;
    transition: all 0.8s linear 0s;
  }
  .serviceTitle {
    position: absolute;
    top: 15%;
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: 64px;
    text-align: center;
  }
  .servicePhone {
    position: absolute;
    top: 35%;
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: 40px;
    text-align: center;
  }
  .serviceEmail {
    position: absolute;
    top: 55%;
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: 40px;
    text-align: center;
  }
  .serviceAdr {
    position: absolute;
    top: 75%;
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: 40px;
    text-align: center;
  }
  .box.comeout .mpContactUs {
    transform: translate(0, 50%) scaleY(0.5);
    opacity: 0;
  }
}
