/* */
html.fs,.fs body { height: 100%; overflow: hidden; }
.wa1200a { margin:0 auto; max-width: 1200px; }
.app { min-width: 0; overflow: hidden; }
.app>.header { position: absolute; left: 0; right: 0; top: 0; z-index: 99; height: 60px; background: #666; background: rgba(0,0,0,.6); }
.logo2{display:inline-block;background:url(/uploads/image/rimg/logo2.png) no-repeat 0 0;width:269px;height:36px;font-size:0;overflow:hidden}
.app .header .logo2 { margin-top: 14px; }
.app .header .his { margin-left: 20px; line-height: 60px; padding: 0 50px; }
.app .header .his:hover,.app .header .his.bactive {color: #e6e9ed; background: #ccc; background: rgba(0,0,0,.2);}
.layer5{display:none;background:#4c4c4c; background: rgba(0,0,0,.7);line-height:normal;}
.hisw { width: 420px; padding: 30px 40px 0; color: #ecf0f1; font-size: 16px; }
.hisw .time,.hisw .detail{margin-top: -3px;}
.hisw .detail { width: 230px; padding: 0 0 30px 40px; position: relative; }
.circle { display: inline-block; width:15px; height: 15px; border-radius: 100%; border: 2px solid #e6e9ed; }
.hisw .d {color: #aab2bd; font-size: 14px; margin-top: 15px; }
.hisw .detail .circle { position: absolute; left: -9px; top: 3px; }
.hisw .detail .vline { position: absolute; left: 0; top: 21px; bottom: 0; height: auto; }
/* */
.section,.section>.step { position: relative; height: 100%; }
.section .step { overflow: hidden; }
.section .step.s1 { background: #fc6e51; }
.section .step.s2 { background: #fff;}
.section .step.s3 { background: #fafafa;}
.section .step.s4 { background: #fff;}
.section .step.s5 { background: #fafafa;}
.section .step>* { position: absolute; left: 50%; top: 50%; margin: -440px 0 0 -600px; width: 1200px; height: 880px; }
.dla { padding-top: 240px; width: 640px; text-align: center; }
.dla .qrc { display: inline-block; font-size: 0; padding:5px; background: #ecf0f1; }
.dla .plane{margin-top: 35px;color: #fff;}
.dla h3 { font-size: 36px;  }
.dla .summ {font-size: 18px;margin-top: 5px; }
.dla .btn {margin: 40px 13px 0;height: 74px;padding: 0 20px; }
.dla .btn .ifont{font-size: 50px;margin-right: 18px;}
.dla .btn span{display: inline-block;text-align: left;}
.btn.white:hover{color:#3498db;background:#fff;}
.section .ph { position: absolute; bottom: -42px; right: -130px; }
.section .pta { margin-top:-280px; height: 560px; text-align: center;}
.pta>*{display: inline-block;}
.pta .text { padding-top: 75px; }
.pta .text h3 { font-size: 44px; color: #fc6e51; }
.pta .text p { font-size: 22px; margin-top: 15px; }
.pta.tr .text{margin-left: 100px;}
.pta.tl .text{margin-right: 100px;}

.app .pos { width: 20px; position: absolute; right: 50px; top: 50%; margin-top: -70px; }
.app .pos i { transition: all .2s; margin:15px 0; display:block; width: 10px; height: 10px; border-radius: 100%; background: #808080; }
.app .pos i.active { width: 20px; height: 20px; margin-left: -5.5px;background: #3498db }

.section .step.bin .dla {animation: down .8s .2s both; }
.section .step.bin .ph .phone{ animation: showd .8s .2s both; }
.section .step.bin .tr img,
.section .step.bin .tl .text{ animation: bounceinl 1s .3s both; }
.section .step.bin .tr .text,
.section .step.bin .tl img{ animation: bounceinr 1s .3s both; }
@keyframes down {
	from { transform:translatey(-100px); opacity: 0 }
	50% { transform:translatey(5px); }
}
@keyframes showd {
	from{ opacity: 0; transform:translatey(100px); }
  50% { transform:translatey(-5px); }
}
@keyframes bounceinl {
	from{ opacity: 0; transform:translatex(-100px); }
	50% { transform:translatex(5px); }
}
@keyframes bounceinr {
	from{ opacity: 0; transform:translatex(200px); }
	50% { transform:translatex(-5px); }
}