﻿@charset "utf-8";
/* CSS Document */
.common-full {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
}
.delay {
  animation-duration: 1s;
  animation-delay: 0.1s;
}
.brand-container {
  width: 100%;
  position: relative;
  height: 100%;
}
.brand-container .fullpage-box {
  height: 100%;
  position: relative;
  transform: translate3d(0rem, -9.2rem, 0rem);
  transition: all 700ms ease 0s;
}
.brand-container .fullpage-box {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
}
.brand-container .fullpage-box #fullpage-section1 {
  background-color: #d8d8d8;
}
.brand-container .fullpage-box .first-title {
  width: 4.02rem;
  height: 1.42rem;
  position: absolute;
  left: 10.25rem;
  top: 2.9rem;
  background: url('/images/brand-page01.png') 100% 100% no-repeat;
  background-size: contain;
}
.brand-container .fullpage-box .first-txt {
  color: #000000;
  font-size: 0.14rem;
  line-height: 0.3rem;
  width: 3rem;
  height: 1rem;
  position: absolute;
  left: 10.49rem;
  top: 4.86rem;
}
.brand-container .fullpage-box .first-txt .text-1 {
  font-size: 0.33rem;
  margin-bottom: 0.12rem;
}
.brand-container .fullpage-box .first-txt .text-2 {
  font-size: 0.33rem;
}
.brand-container .fullpage-box .brand-banquan {
  height: 2.16rem;
  width: 0.09rem;
  position: absolute;
  top: 4rem;
  right: 0.36rem;
  background: url(/images/brand-banquan.png);
}
.brand-container .fullpage-box .tiangu {
  width: 1.12rem;
  height: 0.71rem;
  position: absolute;
  right: 0.81rem;
  top: 0.72rem;
  background: url(/images/tiangu-icon.png) center center no-repeat;
  background-size: 100% auto;
  z-index: 9;
}
.brand-container .fullpage-box .first-view {
  width: 0.27rem;
  height: 1.69rem;
  position: absolute;
  left: 10.45rem;
  top: 6.9rem;
  background: url('/images/view-icon.png') 100% 100% no-repeat;
  background-size: contain;
  -webkit-animation: first-view 1.2s infinite;
  -webkit-animation-fill-mode: both;
}
.brand-container .fullpage-box #fullpage-section2 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page02.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box .second-arrow {
  width: 0.35rem;
  height: 0.33rem;
  position: absolute;
  left: 12.61rem;
  top: 1.55rem;
  margin-left: -1.96rem;
  background: url('/images/brand-arrow.png') center no-repeat;
  background-size: auto 100%;
}
.brand-container .fullpage-box  .second-txt {
  color: #fff;
  font-size: 0.16rem;
  line-height: 0.3rem;
  width: 4.15rem;
  height: 2.55rem;
  position: absolute;
  left: 10.55rem;
  top: 2.45rem;
}
.brand-container .fullpage-box .second-txt .text-1 {
  font-size: 14px;
  line-height: 1.5;
}
.brand-container .fullpage-box #fullpage-section3 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page03.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box #fullpage-section4 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background-color: #d8d8d8;
}
.brand-container .fullpage-box .four-arrow {
  width: 0.35rem;
  height: 0.33rem;
  position: absolute;
  left: 12.46rem;
  top: 2.8rem;
  margin-left: -1.96rem;
  background: url('/images/brand-arrow.png') center no-repeat;
  background-size: auto 100%;
}
.brand-container .fullpage-box .four-txt {
  color: #000;
  font-size: 14px;
  line-height: 1.5;
  width: 4.3rem;
  height: 2.8rem;
  position: absolute;
  left: 10.5rem;
  top: 3.7rem;
}
.brand-container .fullpage-box .four-view {
  width: 0.27rem;
  height: 1.69rem;
  position: absolute;
  left: 10.47rem;
  top: 7.4rem;
  background: url('/images/view-icon.png') 100% 100% no-repeat;
  background-size: contain;
  -webkit-animation: four-view 1.2s infinite;
  -webkit-animation-fill-mode: both;
}
.brand-container .fullpage-box #fullpage-section5 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page05.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box #fullpage-section6 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page06.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box #fullpage-section7 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background-color: #000;
}
.brand-container .fullpage-box .seven-center {
  width: 4.21rem;
  height: 2.15rem;
  background: url('/images/brand-page07.jpg') center no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 8.03rem;
  top: 4.33rem;
  opacity: 0;
}
.brand-container .fullpage-box #fullpage-section8 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page08.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box .eight-center {
  width: 7.2rem;
  height: 3.2rem;
  position: absolute;
  left: 6.87rem;
  top: 4.07rem;
  background: url('/images/brand-page08.png') center no-repeat;
  background-size: 100% auto;
}
.brand-container .fullpage-box #fullpage-section9 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background-color: #000;
}
.brand-container .fullpage-box .nine-center {
  width: 18.15rem;
  height: 10.8rem;
  background: url('/images/brand-page09.jpg') center no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 1.04rem;
  top: 0rem;
}
.brand-container .fullpage-box #fullpage-section10 {
  width: 19.2rem;
  height: 10.8rem;
  position: relative;
  background: url('/images/brand-page10.jpg') 50% no-repeat;
  background-size: cover;
}
.brand-container .fullpage-box .eleven-center {
  padding-top: 6rem;
}
#fullpage .section .fp-tableCell > div {
  opacity: 0;
}
#fullpage .section .fp-tableCell .section-show {
  opacity: 1;
}
/****view-icon 定义上下闪动*****/
.box {
  width: 19.2rem;
  height: 5rem;
  background-color: #d8d8d8;
}
.left {
  width: 1.04rem;
  height: 5rem;
  border-right: 0.01rem solid #bebebe;
  float: left;
}
.right {
  width: 18.15rem;
  height: 4.99rem;
  border-top: 0.01rem solid #bebebe;
  float: left;
}
.right .middle {
  height: 1.2rem;
  padding-top: 1.7rem;
}
.right .bottom {
  height: 2.1rem;
}
.right .bottom .text {
  margin-left: 0.8rem;
  padding-top: 0.88rem;
}
.middle_1,
.middle_2 {
  height: 0.5rem;
}
.middle_1 .nav,
.middle_2 .nav {
  width: 2.83rem;
  float: left;
  padding-left: 0.8rem;
}
.middle_1 .nav1 {
  float: right;
  padding-right: 1.85rem;
}
@-webkit-keyframes first-view {
  from {
    top: 6.9rem;
    opacity: 1;
  }
  to {
    top: 7.2rem;
    opacity: 0;
  }
}
@-webkit-keyframes four-view {
  from {
    top: 7.4rem;
    opacity: 1;
  }
  to {
    top: 7.7rem;
    opacity: 0;
  }
}


@media screen and (max-width:1024px){
  
.brand-container .fullpage-box .second-txt .text-1 {
  font-size: 13px;
  width: 6.5rem;
}
.brand-container .fullpage-box .four-txt {
  font-size: 13px;
  width: 6.5rem;
}
.brand-container .fullpage-box .nine-center {
  top: 1rem;
}
.brand-container .fullpage-box .seven-center {
  width: 6.21rem;
  height: 4.15rem;
  top: 4rem;
}
}
@media screen and (max-width:760px){
  .brand-container .fullpage-box .second-txt {
    font-size: 9px;
    width: 7rem;
}
.brand-container .fullpage-box .second-txt .text-1 {
  font-size: 9px;
}
  .brand-container .fullpage-box .four-txt {
    font-size: 9px;
    width: 7rem;
  }
  @-webkit-keyframes four-view {
    from {
      top: 14.4rem;
      opacity: 1;
    }
    to {
      top: 14.7rem;
      opacity: 0;
    }
  }
  }