@charset "utf-8";
/* CSS Document */

#g5{ width:100%; height:auto;}

/*top*/
#g5-top{ width:100%; height:90px; overflow:hidden;position:fixed;top:0;left:0; background-color:#eeeeee; overflow:hidden; z-index:999;}
#g5-top a{ color:#000; text-decoration:none;}
#g5-top a:hover{ color:#0081cc; text-decoration:none;}
.w1200{ width:1200px; margin:0 auto;}
.clearfix {overflow: auto;zoom: 1; }
#top-title{ width:auto; height:90px; float:left; overflow:hidden; line-height:90px;}
#top-nav{ width:auto; height:90px; float:right; overflow:hidden; line-height:90px;}
#top-nav ul{ float:right; overflow:hidden;}
#top-nav ul li{ width:auto; float:left; overflow:hidden; margin-left:15px;}
#top-nav-6{width:125px; text-align:center;}
#top-nav-6 a{width:125px; height:35px; background-color:#0081cc; color:#FFF;display:block;line-height:35px;display:inline-block;}
#top-nav-6 a:hover{color:#FFF; }

/*banner*/
#g5-banner{ width:100%; height:1120px; overflow:hidden;}
#g5-banner, #g5-banner .bg {background-size: cover;background-position: center center;}
#g5-banner .bg {position: absolute;width: 100%;height: 100%;overflow: hidden;}
#g5-banner .container {height: 100%;position: relative;}
#g5-banner1{ width:100%; height:100%; overflow:hidden; zoom: 1;}
#b-nr{ width:520px; float:left;position: absolute;top: 24%;}
#b-text{color:#FFF;    margin-bottom: 70px;}
#b-text h1{margin-bottom: 12px;font-size: 41px;}
#b-text p{color: #8c8c8c;font-size: 18px;text-align: center;text-transform: uppercase;font-weight: 200;}
#b-sp{width:480px; margin-top:30px;}
#b-sp1{ width:360px; height:240px;  overflow:hidden;} 
#b-sp-gk{  height:240px; overflow:hidden; display:block; margin-left:15px;}
#b-sp-gk a{ width:65px; color:#fff; text-decoration:none; margin-top:210px; display:block;}

#g5-banner2{ background-color:#fff;; height:auto; padding:64px 0px;}


#banner2-title{ text-align:center; line-height:28px; font-size:14px; color:#000;}
#banner2-show {height: 180px; }
#banner2-show li {width: 16.66%;height: 180px; float: left;overflow: hidden;list-style: none; }
#banner2-show li img {margin-top: 35px; opacity: .5;transition: 1s;}
#banner2-show li img:hover {opacity: 1; width: 200px;height: 130px; }



.banner, .banner .bg {background-size: cover;background-position: center center;}
.banner {position: relative;/*height: 1120px;*/ height:800px;}
.banner .bg {position: absolute;width: 100%;height: 100%;overflow: hidden;}
.banner .container {height: 100%;position: relative;}
.banner .container .row {height: 100%;}
.banner .container .banner-col {height: 100%;    text-align: left;}
.banner .container .text {position: absolute;/*top: 44%;*/ top:30%;width: 100%;}
.banner .title {margin-bottom: 70px;}
.banner .title .banimg { line-height:78px;margin-bottom: 12px;font-size: 41px; color:#fff;text-align: left; }
.dji-zh-CN .banner .title .banimg img, .dji-zh-TW .banner .title .logo img {height: 36px;}
.banner .title .banimg img {display: inline-block;height: 32px;width: auto;}
.dji-zh-CN .banner .title p, .dji-zh-TW .banner .title p {letter-spacing: 6px;}
.banner .title p {color: #8c8c8c;font-size: 18px;text-align: left;font-weight: 200;}

.banimg {-webkit-transition:all 1.5s ease .2s;-moz-transition:all 1.5s ease .2s;-ms-transition:all 1.5s ease .2s;-o-transition:all 1.5s ease .2s;transition:all 1.5s ease .2s}
.banimg,.bantext{opacity:0;-webkit-transform:translate(0,50px);-moz-transform:translate(0,50px);-ms-transform:translate(0,50px);-o-transform:translate(0,50px);transform:translate(0,50px)}
.bantext {-webkit-transition:all 1.5s ease .5s;-moz-transition:all 1.5s ease .5s;-ms-transition:all 1.5s ease .5s;-o-transition:all 1.5s ease .5s;transition:all 1.5s ease .5s}

.ani-active .banimg,.ani-active .bantext{opacity:1!important;-webkit-transform:translate(0,0)!important;-moz-transform:translate(0,0)!important;-ms-transform:translate(0,0)!important;-o-transform:translate(0,0)!important;transform:translate(0,0)!important} {-webkit-transition:all 1.5s ease .2s;-moz-transition:all 1.5s ease .2s;-ms-transition:all 1.5s ease .2s;-o-transition:all 1.5s ease .2s;transition:all 1.5s ease .2s}
.banimg,.bantext {opacity:0;-webkit-transform:translate(0,50px);-moz-transform:translate(0,50px);-ms-transform:translate(0,50px);-o-transform:translate(0,50px);transform:translate(0,50px)}
.bantext {-webkit-transition:all 1.5s ease .5s;-moz-transition:all 1.5s ease .5s;-ms-transition:all 1.5s ease .5s;-o-transition:all 1.5s ease .5s;transition:all 1.5s ease .5s}

.ani-active .banimg,.ani-active .bantext{opacity:1!important;-webkit-transform:translate(0,0)!important;-moz-transform:translate(0,0)!important;-ms-transform:translate(0,0)!important;-o-transform:translate(0,0)!important;transform:translate(0,0)!important}


.banner .video-slider {position: relative;margin-bottom: 30px;}
.banner .video-slider .video-container {width: 353px; float:left;text-align: center;height: 233px!important;}
.banner .video-slider .roundabout-holder {list-style: none;width: 353px;height: 233px;}
.banner .video-slider .roundabout-moveable-item {-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,.5);-moz-box-shadow: 0 2px 4px 0 rgba(0,0,0,.5);-ms-box-shadow: 0 2px 4px 0 rgba(0,0,0,.5);-o-box-shadow: 0 2px 4px 0 rgba(0,0,0,.5);box-shadow: 0 2px 4px 0 rgba(0,0,0,.5);width: 353px;height: 233px;cursor: pointer;}

.videovi{ font-size:12px; color:#fff; float:left; padding-left:12px; padding-top:208px;}
.banner .video-slider .video-box {display: block;height: 100%;}
.video-box {position: relative;display: inline-block;margin: auto;}
.banner .video-slider .roundabout-in-focus img, .banner .video-slider .no-blur img {-webkit-filter: blur(0)!important;-moz-filter: blur(0)!important;-ms-filter: blur(0)!important;filter: blur(0)!important;}
.banner .video-slider .roundabout-moveable-item img {display: block;height: 100%;margin: 0;background-color: #fff;-webkit-filter: blur(1px);-moz-filter: blur(1px);-ms-filter: blur(1px);filter: blur(1px);}
.video-box img {max-width: 100%;cursor: pointer;display: block;}

.video-box .fa-play {position: absolute;left: 50%;top: 50%;margin-left: -11px;margin-top: -14px;color: rgba(255,255,255,.8);font-size: 28px;-webkit-transition: color .3s ease;-moz-transition: color .3s ease;-ms-transition: color .3s ease;-o-transition: color .3s ease;transition: color .3s ease;}

.video-box .fa-play {position: absolute;left: 50%;top: 50%;margin-left: -11px;margin-top: -14px;color: rgba(255,255,255,.8);font-size: 28px;-webkit-transition: color .3s ease;-moz-transition: color .3s ease;-ms-transition: color .3s ease;-o-transition: color .3s ease;transition: color .3s ease;}
.fa {
    display: inline-block;
    font: 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/*g5-content1*/
#g5-content1{ width:100%;/*height: 830px;*/ height:700px; background-image:url(../g5-2.html); background-size: cover;background-position: center center;background-repeat: no-repeat; position:relative;}
.content1-text{width: 100%; position:absolute; bottom:10%; color:#FFF; text-align:center; line-height:30px;}

.text {text-align: center;}
.common-title {text-transform:uppercase; font-size:24px; line-height:61px;}
.common-content {font-size:18px!important; line-height:32px;}

.float-up-fast {-webkit-transition:all 1.5s ease .2s;-moz-transition:all 1.5s ease .2s;-ms-transition:all 1.5s ease .2s;-o-transition:all 1.5s ease .2s;transition:all 1.5s ease .2s}
.float-up-fast,.float-up-slow {opacity:0;-webkit-transform:translate(0,50px);-moz-transform:translate(0,50px);-ms-transform:translate(0,50px);-o-transform:translate(0,50px);transform:translate(0,50px)}
.float-up-slow {-webkit-transition:all 1.5s ease .5s;-moz-transition:all 1.5s ease .5s;-ms-transition:all 1.5s ease .5s;-o-transition:all 1.5s ease .5s;transition:all 1.5s ease .5s}
.float-right-fast {-webkit-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-ms-transition:all 1.5s ease;-o-transition:all 1.5s ease;transition:all 1.5s ease}
.float-right-fast,.float-right-slow {opacity:0;-webkit-transform:translate(-50px,0);-moz-transform:translate(-50px,0);-ms-transform:translate(-50px,0);-o-transform:translate(-50px,0);transform:translate(-50px,0)}
.float-right-slow {-webkit-transition:all 1.5s ease 1.5s;-moz-transition:all 1.5s ease 1.5s;-ms-transition:all 1.5s ease 1.5s;-o-transition:all 1.5s ease 1.5s;transition:all 1.5s ease 1.5s}
.ani-active .float-up-fast,.ani-active .float-up-slow,.ani-active .float-right-fast,.ani-active .float-right-slow {opacity:1!important;-webkit-transform:translate(0,0)!important;-moz-transform:translate(0,0)!important;-ms-transform:translate(0,0)!important;-o-transform:translate(0,0)!important;transform:translate(0,0)!important}

.mobile-desc, .osmomobile-desc { font-size:18px; color:#000; line-height:33px;position: absolute;top: 360px;left: 0;}

/*g5-content2*/
#g5-content2{padding-bottom: 40px; width:100%; height:auto; background-color:#eeeeee;}
#g5-content2 .common-title{ padding-bottom:17px;}
.content2-text h4,.content2-text p{ text-align: center; line-height:30px;}
.content2-sp{height:390px; margin-top:90px;}
.content2-sp li{ position:relative; width:auto; height:420px; list-style:none; overflow:hidden;}
.content2-sp1{ margin-right:80px;} 
.content2-sp p{ width:560px; color:#000; margin-top:20px;}

/*g5-content3*/
#g5-content3{ width:100%; background-color:#fff; padding:90px 0px; background-size:100% auto;}
.content3-img{ width:700px; /*height:940px;*/ height:700px; padding-top:0px 0px 200px 0px;}
.content3-img img{ height:100%;}
.content3-text{ width:auto; height:300px; padding:330px 0px 240px 0px; line-height:30px;}
#g5-content3 .text{ text-align:left;}
#g5-content3 .common-title{ padding-bottom:15px;}
/*g5-content4*/
#g5-content4{ width:100%;/*height: 832px;*/height:700px; background-size: cover;background-position: center center;background-repeat: no-repeat; }
.content4-text{position:relative; width:100%;   color:#fff; text-align:center; line-height:30px;height: 100%;}
#g5-content4 .text{position:absolute; bottom:8%; right:22%; text-align:left;}
/*g5-content5*/
#g5-content5{ width:100%;/*height: 803px;*/height:700px; background-image: url(../content5-img.html); background-size: cover;background-position: center center;background-repeat: no-repeat; }
.content5-text{width:100%; height:100%; color:#000; text-align: left; line-height:30px;position: relative;}
#g5-content5 .text{position:absolute; top:3%; left:10%; text-align:left;} 
/*g5-content6*/
#g5-content6{ width:100%; /*height:734px;*/height:700px;background-size: cover;background-position: center center;background-repeat: no-repeat;}
.content6-text{width:100%;position:relative;height: 100%; color:#000;  line-height:30px;}
#g5-content6 .text{position:absolute; top:15%; right:22%; text-align:left;}
/*g5-content7*/
#g5-content7{ width:100%; /*height:690px;*/height:700px; background-size: cover;background-position: center center;background-repeat: no-repeat; margin-bottom:50px;}
.content7-text{width:100%;height: 100%; color:#000;  line-height:30px; text-align:right;}

/*g5-content8*/
#g5-content8{ width:100%; height:auto; overflow:hidden; background-color:#FFF; padding:20px 0px; margin-top:30px;}
#g5-content8 li{ width:380px; height:auto; list-style:none; }
.content8-tu1,.content8-tu1 img{ width:380px; height:450px;}
.content8-tu1 img:hover{ width:375px; height:445px; }

.content8-title1{ width:380px; /*height:80px;*/ font-size:18px; color:#7f7f7f; line-height:30px; padding:10px 0;}
.conten8t-text{ width:380px; height:auto; line-height:33px; font-size:16px; color:#000;}
.content8-el{ margin:0px 30px;}

.content8-title1 {-webkit-transition:all 1.5s ease .2s;-moz-transition:all 1.5s ease .2s;-ms-transition:all 1.5s ease .2s;-o-transition:all 1.5s ease .2s;transition:all 1.5s ease .2s}
.content8-title1,.conten8t-text {opacity:0;-webkit-transform:translate(0,50px);-moz-transform:translate(0,50px);-ms-transform:translate(0,50px);-o-transform:translate(0,50px);transform:translate(0,50px)}
.conten8t-text {-webkit-transition:all 1.5s ease .5s;-moz-transition:all 1.5s ease .5s;-ms-transition:all 1.5s ease .5s;-o-transition:all 1.5s ease .5s;transition:all 1.5s ease .5s}

.ani-active .content8-title1,.ani-active .conten8t-text{opacity:1!important;-webkit-transform:translate(0,0)!important;-moz-transform:translate(0,0)!important;-ms-transform:translate(0,0)!important;-o-transform:translate(0,0)!important;transform:translate(0,0)!important} {-webkit-transition:all 1.5s ease .2s;-moz-transition:all 1.5s ease .2s;-ms-transition:all 1.5s ease .2s;-o-transition:all 1.5s ease .2s;transition:all 1.5s ease .2s}
.content8-title1,.conten8t-text {opacity:0;-webkit-transform:translate(0,50px);-moz-transform:translate(0,50px);-ms-transform:translate(0,50px);-o-transform:translate(0,50px);transform:translate(0,50px)}
.conten8t-text {-webkit-transition:all 1.5s ease .5s;-moz-transition:all 1.5s ease .5s;-ms-transition:all 1.5s ease .5s;-o-transition:all 1.5s ease .5s;transition:all 1.5s ease .5s}

.ani-active .content8-title1,.ani-active .conten8t-text{opacity:1!important;-webkit-transform:translate(0,0)!important;-moz-transform:translate(0,0)!important;-ms-transform:translate(0,0)!important;-o-transform:translate(0,0)!important;transform:translate(0,0)!important}

/*g5-content9*/
#g5-content9{ width:100%; height:auto; background-color:#FFF; padding:60px 0px;}
.content9-img{ padding:0px 77px;}
.content9-text{ text-align:center; line-height:30px;}

/*g5-content10 客户自定义区*/
#g5-content10{ width:100%; height:auto;background-color:#FFF; padding:30px 0px;}

/*g5-footer*/
#g5-footer{ width:100%; height:200px;  text-align:center; background-color:#eeeeee;display:block; line-height:50px; overflow: visible;}
.footer-gm{ font-size:24px;display:block; height:200px;overflow: visible;}
.footer-gm a{ width:100%; height:150px;display:block; text-decoration:none; font-size:30px; color:#cd0909; cursor:pointer; overflow: visible; padding:50px 0px 0px 0px;}
.footer-gm span{ color:#000;}
.footer-gm a:hover{ width:100%; height:250px; background:url(../content10.html) no-repeat center top; padding:150px 0px 0px 0px;overflow: visible; color:#FFF; }
.footer-gm a span:hover{ color:#FFF;}
/*.select {height: 400px; }*/



.container {padding-top:53px ;}

.camera-list .camera-thumb .camera-desc, .camera-list .camera-thumb img {opacity:.35;-webkit-transition:1s;-moz-transition:1s;-ms-transition:1s;-o-transition:1s;transition:1s}
.camera-list .camera-thumb .camera-desc {font-size:14px;opacity:0;color:#000;position:relative;top: 20px;}
.camera-list .camera-thumb .camera-desc span {display:block;margin-top:10px;font-size:12px}
.camera-list .camera-thumb:hover img {-webkit-transform:scale(1.3);-moz-transform:scale(1.3);-ms-transform:scale(1.3);-o-transform:scale(1.3);transform:scale(1.3);opacity:1}
.camera-list .camera-thumb:hover .camera-desc {opacity:1}