p {
  line-height: 1.5;
}
* {
  margin: 0;
  padding: 0;
}
.scroll #header .index-header {
  background-color: #00a0e8;
}
/*# sourceMappingURL=./daohang.css.map */
/* 第一屏 */
.main {
  width: 100%;
  margin: 0 auto;
}
.fri {
  height: 60rem;
  background: #01a1e9 url("https://cdn.gdskfz.com/skfz/images/aboutus/banner_02.jpg") no-repeat center bottom;
  background-size: contain;
  color: #fff;
  margin: 0 auto;
}
.container {
  max-width: 1300px;
  margin: 0 auto;
  padding-top: 140px;
  position: relative;
}
.container .info {
  position: absolute;
  margin: 0 auto;
  margin-top: 1.5rem;
  display: flex;
  flex-direction: row;
  left: 5%;
}
.container .info .info-item {
  display: flex;
  flex-direction: column;
}
.container .line {
  margin-right: 1rem;
}
.container .line1 {
  width: 169px;
  opacity: 0.8;
  transform: rotate(90deg);
  position: absolute;
  top: 8rem;
  left: -7em;
}
.container .line2 {
  width: 169px;
  opacity: 0.8;
  transform: rotate(90deg);
  position: absolute;
  top: 15.5rem;
  left: -7em;
}
.container .line3 {
  width: 169px;
  opacity: 0.8;
  transform: rotate(-90deg);
  position: absolute;
  left: -7rem;
  top: 26rem;
}
.fri p {
  font-size: 18px;
  width: 31.5rem;
  display: inline-block;
  line-height: 1.5;
}
.container h1 {
  font-size: 3rem;
  display: inline-block;
  margin: 0;
  font-family: "Arson Pro Narrow";
  font-weight: bold;
}
.container h4 {
  display: inline-block;
  font-weight: 500;
  margin-bottom: 3rem;
}
.container .dian {
  width: 129px;
  margin: 2rem 0;
  margin-bottom: 4.5rem;
}
.container .btn {
  margin-top: 30px;
  position: absolute;
  top: 38rem;
  left: -0.5rem;
}
/* 第二屏 */
.sec {
  width: 100%;
  background: #c5f4fa;
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}
.sec .container-fluid {
  width: 100%;
  position: relative;
}
.sec .left-nav {
  height: 900px;
  width: 38%;
  position: relative;
}
.sec .circle {
  width: 80em;
  height: 80em;
  border-radius: 40em;
  background: #7bdbf1;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
}
.sec .circle2 {
  width: 70em;
  height: 70em;
  border-radius: 35em;
  border: 1px solid #fff;
  position: absolute;
  top: 6em;
  left: 3em;
}
.sec .circle3 {
  width: 50em;
  height: 50em;
  border-radius: 25em;
  background: #28b0ec;
  position: absolute;
  top: 11em;
  left: 12em;
  box-shadow: 0 0 80em rgba(255, 255, 255, 0.7);
}
.sec .circle4 {
  width: 35em;
  height: 35em;
  border-radius: 20em;
  border: 1px rgba(255, 255, 255, 0.3) solid;
  position: absolute;
  top: 7.5em;
  left: 7.5em;
  /* box-shadow: 0 0 10rem rgba(255, 255, 255, .5); */
}
.sec .p {
  font-size: 5rem;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: 12rem;
  left: 13rem;
}
.sec .point0,
.sec .point1,
.sec .point2,
.sec .point3,
.sec .point4,
.sec .point5,
.sec .point6,
.sec .point7,
.sec .point8,
.sec .point9,
.sec .point10 {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 0.5rem;
  background-color: white;
  position: absolute;
  transition: transform 1s;
  cursor: pointer;
}
.sec .nav-point > div:hover {
  transform: scale(1.1);
}
/* .point1 {
    right     : 14.75rem;
    top       : 18rem;
    /* opacity: .5; 
 } */
/* 
.point1 {
    right: 11.25rem;
    top  : 23rem;
} */
._point0 {
  right: 16.8rem;
  top: 16rem;
}
.point1 {
  right: 12.6rem;
  top: 21rem;
}
.point2 {
  right: 9.8rem;
  top: 26rem;
}
.point3 {
  right: 8rem;
  top: 31rem;
}
.point4 {
  right: 6.9rem;
  top: 36rem;
}
.point5 {
  right: 6.6rem;
  top: 41rem;
}
.point6 {
  right: 7.1rem;
  top: 46rem;
}
.point7 {
  right: 8.2rem;
  top: 51rem;
}
.point8 {
  right: 10.2rem;
  top: 56rem;
}
.point9 {
  right: 13.2rem;
  top: 61rem;
}
.point10 {
  right: 17.5rem;
  top: 66rem;
}
.nav-point p {
  content: "2015";
  color: #fff;
  opacity: 0.7;
  font-size: 1.75rem;
  line-height: 0.75rem;
  position: relative;
  width: 200px;
  left: -80px;
}
/* 
.point8 {
    right : 10.75rem;
    bottom: 22rem;
}

.point7 {
    right : 8.25rem;
    bottom: 28rem;
}

*/
/* .point1::before {
    content    : "2015";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}
.point1::after{
    width      : 56px;
    content    : "10月";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -2rem;
}

.point2::before {
    content    : "2016";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point3::before {
    content    : "2017";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point4::before {
    content    : "2018";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point5::before {
    content    : "2018";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point6::before {
    content    : "2021";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
} */
/* 
.point7::before {
    content    : "2018";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point8::before {
    content    : "2018";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
}

.point9::before {
    content    : "2018";
    color      : #fff;
    opacity    : .7;
    font-size  : 1.75rem;
    line-height: .75rem;
    position   : relative;
    left       : -6rem;
} */
.sec .info {
  position: absolute;
  right: 2%;
  top: 0;
  bottom: 0;
  display: block;
  width: 50%;
}
.sec .info .item {
  transform: translateY(5rem);
  opacity: 0;
  transition: all 1s;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 1rem 0;
}
.sec .info .item {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.sec .info .item .bb {
  width: 100%;
}
.sec .info .item .item-event:nth-child(n+2) {
  margin-top: 1.5rem;
}
.sec .info .item.active {
  transform: translateY(0);
  opacity: 1;
}
.sec .info h1 {
  color: #00a0e8;
  font-size: 3rem;
}
.sec .info h2 {
  font-weight: 500;
  color: #707070;
  font-size: 1.5rem;
  line-height: 1.5;
}
.sec .info p {
  font-size: 3rem;
  font-weight: 900;
  color: #00a0e8;
}
.sec .left-nav .circle .nav-point p {
  top: -15px;
  left: -80px;
}
/* 第三屏 */
.thi {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.thi img {
  width: 100%;
}
/* 第四屏 */
.fourth {
  width: 100%;
  position: relative;
}
.fourth .img-list {
  overflow: hidden;
  position: relative;
}
.fourth .img-list .swiper-wrapper img {
  width: 100%;
}
.fourth .img-list .swiper-wrapper p {
  width: 100%;
  font-size: 5rem;
  position: absolute;
  color: #fff;
  top: 12rem;
  text-align: center;
}
.fourth .four-title {
  display: inline-block;
  position: absolute;
  color: #fff;
  z-index: 999;
  top: 10%;
  left: 15%;
}
.fourth .four-title h1 {
  font-size: 3.375rem;
  font-weight: 400;
  color: #fff;
  margin-bottom: 0;
}
.fourth .four-title h2 {
  color: #fff;
}
.fourth .four-title .line {
  width: 2rem;
  height: 5px;
  background-color: #fff;
  margin-top: 0.5rem;
}
.fourth .img-nav {
  position: absolute;
  bottom: 5%;
  text-align: center;
  z-index: 99;
  width: 100%;
}
.fourth .img-nav .nav-btn {
  width: 8rem;
  line-height: 8rem;
  border-radius: 4rem;
  font-size: 1.5rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.5);
  cursor: pointer;
  display: inline-block;
  text-align: center;
}
.fourth .img-nav .nav-btn:nth-of-type(2) {
  margin: 2rem;
}
.fourth .img-nav .nav-btn-active {
  color: #fff;
  border: 1px solid #fff;
}
.fourth .img-nav span:hover {
  color: #fff;
  border: 1px solid #fff;
}
.fifth {
  width: 100%;
  background: url("https://cdn.gdskfz.com/skfz/images/aboutus/zhanlvbg.jpg") no-repeat center center;
}
.fifth .container {
  width: 100%;
  height: 879px;
  margin: 0 auto;
  top: 0;
  left: 0;
}
.fifth .container .items {
  width: 600px;
  position: absolute;
  right: 0;
  padding-top: 10rem;
}
.fifth .container .items .line {
  width: 175px;
  position: absolute;
  left: 0;
  top: 0rem;
}
.fifth .container .items .line img {
  display: block;
  position: absolute;
}
.fifth .container .items .line .img1 {
  top: 11.5rem;
  left: -11rem;
}
.fifth .container .items .line .img2 {
  top: 34.5rem;
  left: -11rem;
}
.fifth .container .items .icon {
  position: absolute;
}
.fifth .container .items .icon .zhanlv {
  position: absolute;
  top: -7rem;
  left: 0;
}
.fifth .container .items .icon .yuanjing {
  position: absolute;
  top: 16rem;
  left: 0;
}
.fifth .container .items .item {
  width: 32.875rem;
  position: absolute;
}
.fifth .container .items .item h1 {
  color: #4e4e4e;
  font-weight: 500;
  display: inline-block;
}
.fifth .container .items .item p {
  color: #929191;
  display: inline-block;
  line-height: 1.5;
  margin-bottom: 12rem;
}
.fifth .container .items .item span {
  width: 26.25rem;
  line-height: 3.75rem;
  border-radius: 5px;
  font-size: 20px;
  text-align: center;
  background-color: #28b0ec;
  color: rgba(255, 255, 255, 0.7);
  display: block;
}
#siderBar {
  z-index: 9999;
}
@media screen and (max-width: 1366px) {
  #sideBar {
    z-index: 707070;
  }
  #warpper #body .fri {
    min-width: 1200px;
  }
  #warpper #body .sec {
    min-width: 1200px;
  }
  #warpper #body .sec .container {
    min-width: 1200px;
  }
  #warpper #body .sec .container .left-nav {
    top: -7rem;
    left: -40rem;
  }
  #warpper #body .sec .container .left-nav .circle .nav-point p {
    left: -72px;
  }
  #warpper #body .sec .container .left-nav .circle .circle2 .circle3 .circle4 .p {
    left: 20rem;
  }
  #warpper #body .sec .container .info {
    top: 23rem;
    right: 10%;
  }
  #warpper #body .sec .container .info .item:nth-of-type(4) .bb h2 {
    width: 500px;
  }
  #warpper #body .thi {
    min-width: 1200px;
  }
  #warpper #body .fourth {
    min-width: 1200px;
  }
  #warpper #body .fourth .four-title {
    padding-top: 1rem;
    padding-left: 4rem;
  }
  #warpper #body .fourth .four-title h1 {
    font-size: 2rem;
  }
  #warpper #body .fourth .four-title h2 {
    font-size: 1rem;
  }
  #warpper #body .fourth .swiper-container .nav .nav-btn {
    width: 6rem;
    line-height: 6rem;
    font-size: 1rem;
  }
  #warpper #body .fourth .swiper-container .swiper-wrapper .swiper-slide p {
    font-size: 3rem;
    top: 10rem;
  }
  #warpper #body .fifth {
    min-width: 1200px;
  }
  #warpper #body .fifth .container {
    width: 100%;
  }
  #warpper #body .fifth .container .items {
    right: 0;
  }
  #warpper #body .fifth .container .icon {
    top: 8rem;
  }
  #warpper #body .fifth .container .line {
    left: -2rem;
  }
  #warpper #body .fifth .container .item h1 {
    font-size: 2rem;
  }
}
