* { margin: 0; padding: 0;}

body { font: 16px/1.8 "Microsoft Yahei",verdana;}
.loading{ position: fixed; width: 100%; height: 100%; z-index: 9999; background: #143254; }
.loading .pic{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 320px; height: 200px; background: url('../images/loading.gif') no-repeat ; background-size: cover; }
/* 右侧导航 */
#fullPage-nav { _display: none; font-size: 12px;}
#fullPage-nav li { width: 90px; height: 21px; margin: 10px 0 0; vertical-align: middle;}
#fullPage-nav li a { float: right; width: 10px; height: 10px; color: #8F9DA4; text-decoration: none; text-align: right; background: #a7936e; border-radius: 500px;border: none;}
#fullPage-nav li .active {  box-shadow: 0 0 0 4px #dfcead; }

#fullPage-nav span { display: none;}
.fullPage-tooltip { float: left; top: 0; margin-right: 5px; font: 12px "Microsoft Yahei"; color: #8F9DA4; line-height: 21px;}
.section { position: relative; overflow: hidden;}
.section .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.section .bg img { display: block; width: 100%; height: 100%;}
.section .bg video{display: block;  width: 100%; height: 100%; object-fit: fill; } 

/*public*/
.qdz-strong2, .qdz-h3-2, .qdz-strong3, .qdz-h3-3, .qdz-strong4, .qdz-h3-4, .qdz-strong5, .qdz-h3-5{ position: absolute; left: 50%; top: 5%;  z-index: 10; width: 512px; height: 45px; margin-left: -256px; opacity: 0; -webkit-transform:scale(0.5, 0.5); transform:scale(0.5, 0.5); transition: all 1s; }
.qdz-strong2, .qdz-strong3, .qdz-strong4, .qdz-strong5{ font-size: 80px; font-weight: 500; display: block; text-align: center;}
.qdz-h3-2, .qdz-h3-3, .qdz-h3-4, .qdz-h3-5{  margin-top: 120px; font-weight: normal; font-size: 40px; }
.qdz-p2, .qdz-p3, .qdz-p5{ position: absolute; opacity: 0; transition: all 1s;}
.active .qdz-strong2, .active .qdz-h3-2, .active .qdz-strong3, .active .qdz-h3-3,.active .qdz-strong4, .active .qdz-h3-4,.active .qdz-strong5, .active .qdz-h3-5{ opacity: 1; -webkit-transform:scale(1, 1); transform:scale(1, 1); transition-delay: 0.7s;}

/*page 1*/
.qdz-p11 h1, .qdz-p11 h2{ position: absolute; left: 50%; width: 554px; height: 100px; margin: 0 0 0 -280px; opacity: 0; transition: all 1s; text-align: center;}
.qdz-p11 h1{ top: 25%; }
.qdz-p11 h1 a{ display: block; color: #fff; font-size: 80px; text-decoration: none; font-weight: normal;text-align: center;}
.qdz-p11 h1 span{ display: block;  font-size: 38px; margin-top: -40px; color: #fff; text-align: center; }
.qdz-p11 h2{ top: 50%; color: #fff; font-size: 40px; font-weight: normal; text-align: center; }
.qdz-p12 { position: absolute; left: 50%; top: 60%; width: 554px; margin: 0 0 0 -280px; text-align: center; font-size: 24px; color: #B4A078;  opacity: 0; transition: all 0.5s;}

.active .qdz-p11 h1{ opacity: 1; transition-duration: 2s; transition-delay: 1s;}
.active .qdz-p11 h2{ opacity: 1; transition-duration: 2s; transition-delay: 1.5s;}
.active .qdz-p12 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}

/*page 2*/
.qdz-bg21, .qdz-bg22, .qdz-bg23{ position: absolute; left: 50%; bottom: 15%; width: 819px; transition: all 1s;}
.qdz-bg21 {   height: 250px;  margin-bottom: 40px;  opacity: 0; margin-left: -1108px;}
.qdz-bg22 {  height: 299px;  margin-bottom: 70px; opacity: 0; margin-left: 320px;}
.qdz-bg23 { height: 325px; margin-left: -409px;  bottom: -40%;}
.qdz-strong2 {  color: #fff; }
.qdz-h3-2 {  color: #333; }
.qdz-p2 {  left: 50%; top: 15%; width: 510px; margin-left: -255px; margin-top: 130px; font-size: 18px; color: #727F8C; }
.active .qdz-bg21 { opacity: 1; margin-left: -608px; transition-delay: 0.7s;}
.active .qdz-bg23 { bottom: 15%; transition-delay: 0.7s;}
.active .qdz-bg22 { margin-left: -280px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-p2 { opacity: 1; transition-delay: 2s;}

/*page 3*/
.qdz-bg31, .qdz-bg32, .qdz-bg33{ position: absolute; left: 50%; bottom: 0; opacity: 0; transition: all 1s;}
.qdz-bg31 { width: 892px; height: 472px; margin-left: -396px; margin-bottom: 80px; }
.qdz-bg32 {  width: 892px; height: 472px; margin-left: -396px; }
.qdz-bg33 {   width: 441px; height: 380px; margin-left: 50%; }
.qdz-strong3 { color: #fff;}
.qdz-h3-3 {  color: #fff89b; }
.qdz-p3 { width: 430px; left: 50%; top: 15%; margin-top: 250px; margin-left: -100%; font-size: 16px; color: #FFFDE1;}
.active .qdz-p3 { margin-left: -480px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-bg31, .active .qdz-bg32 { opacity: 1; transition-delay: 1s;}
.active .qdz-bg33 { margin-left: -120px; opacity: 1; transition-delay: 0.7s;}

/*page 4*/
.qdz-bg41, .qdz-bg42, .qdz-bg43, .qdz-bg44 { position: absolute; z-index: 1; width: 208px; left: 50%; bottom: 20%; padding-top: 210px; color: #fff; transition: all 1s;}
.section4 h4 { margin-bottom: 12px; font-size: 23px; font-weight: 500;}
.section4 p { font-size: 14px;}
.qdz-bg41 { margin-left: -851px; opacity: 0;}
.qdz-bg42 { margin-left: -403px; opacity: 0;}
.qdz-bg43 { margin-left: 195px; opacity: 0; }
.qdz-bg44 { margin-left: 645px; opacity: 0; }
.qdz-strong4 { color: #748A9E;}
.qdz-h3-4 {  color: #fff89b; }
.active .qdz-bg41 { margin-left: -551px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-bg42 { margin-left: -253px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-bg43 { margin-left: 45px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-bg44 { margin-left: 345px; opacity: 1; transition-delay: 0.7s;}

/*page 5*/
.qdz-bg51, .qdz-bg52, .qdz-bg53{position: absolute; left: 50%; opacity: 0; transition: all 1s;}
.qdz-bg51 {  bottom: 160px; width: 164px; height: 117px; margin-left: -180px;}
.qdz-bg52 {  bottom: 280px; width: 70px; height: 29px; margin-left: -330px;  }
.qdz-bg53 {  bottom: 320px; width: 43px; height: 26px; margin-left: -410px; }
.qdz-p5 {  left: 50%; width: 565px; margin-left: -282px; bottom: -150px; margin-top: 130px; font-size: 16px; color: #727F8C; }
.qdz-strong5 { color: #748A9E;}
.qdz-h3-5 {  color: #fff89b; }

.active .qdz-bg51 { bottom: 260px; margin-left: -280px; opacity: 1; transition-delay: 0.7s;}
.active .qdz-bg52 { bottom: 380px; margin-left: -430px; opacity: 1; transition-delay: 1s;}
.active .qdz-bg53 { bottom: 420px; margin-left: -510px; opacity: 1; transition-delay: 1.2s;}
.active .qdz-p5 { bottom: 420px; opacity: 1; transition-delay: 1.7s;}
