﻿html{position: relative;overflow-x: hidden;}
/*-----------------[初始化]--------------*/
body{color: #333;font-size: 12px;line-height: 1.5;
    font-family:"微软雅黑","Microsoft Yahei";
    overflow-x: hidden;
}
a{color: #333;}
a:hover{color: #225798;}
img{max-width: 100%;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
input,textarea,select{font-size: 12px;color: #333;
    font-family:"微软雅黑","Microsoft Yahei";outline: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
input[type='submit'],input[type='reset'],input[type='button'],select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
input[type='submit'],input[type='reset'],input[type='button']{cursor: pointer;}
::-webkit-input-placeholder {color: #999;}
::-moz-placeholder {color: #999; }
::-ms-input-placeholder {color: #999;}
.hide-dn{height: 0;overflow: hidden;}
.ani{
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
*,*:after,*:before{outline: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

@font-face {
    font-family: 'impact';
    src: url('../fonts/impact.ttf');
}


/*布局*/
.wp{width: 100%;max-width: 1440px;margin: 0 auto;}
.h50{height: 50px;clear: both;overflow: hidden;}
.h100{height: 100px;clear: both;overflow: hidden;}


/*******************************
  -------[=头部]-------
********************************/
.header{position: absolute;top: 0;left: 0;right: 0;z-index: 1024;}
.logo{position: absolute;left: 50px;top: 40px;}
.logo img{display: block;width: 70px;}
.hdc{margin-left: 176px;margin-right: 32px;}
.nav{float: left;}
.nav li{float: left;margin-right: 30px;position: relative;}
.nav li .v1{display: block;font-size: 18px;color: #fff;line-height: 100px;position: relative;}
.nav li .v1:after{content: '';position: absolute;left: 0;right: 0;bottom: 32px;
    height: 1px;background-color: #fff;opacity: 0;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.nav dl{position: absolute;left: 0;top: 83px;width: 180px;display: none;
    background-color: rgba(255,255,255,.94);border-radius: 4px;
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.1);
    padding: 23px 15px 23px 35px;
}
.nav dd a{display: block;font-size: 16px;line-height: 44px;
    color: #777;
}
.nav dd:hover a{color: #111;}
.nav li.on .v1:after,.nav li:hover .v1:after{opacity: 1;}
.hdr{float: right;margin-top: 28px;}
.lang{float: left;font-size: 16px;color: #fff;padding-left: 27px;
    line-height: 44px;margin-right: 30px;
    background: url(../images/i-lang.png) no-repeat left center;
    -o-background-size: 20px auto;
    -ms-background-size: 20px auto;
    -moz-background-size: 20px auto;
    -webkit-background-size: 20px auto;
    background-size: 20px auto;
}
.lang:hover{opacity: .8;color: #fff;}
.header .btn{float: left;width: 166px;height: 44px;display: block;text-align: center;
    line-height: 42px;font-size: 16px;color: #fff;border-radius: 6px;margin-left: 10px;
    border: 1px solid rgba(255,255,255,.4);
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.header .btn:hover{background-color: rgba(255,255,255,.2);}


/*******************************
    -------[=导航]-------
********************************/
.menuBtn{position: relative;z-index: 9;display: none;float: right;
    width: 40px;height: 40px;padding: 7px;cursor: pointer;margin-top: 5px;margin-right: -5px;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.menuBtn b{display: block;height: 3px;background-color: #fff;
    margin: 3px 0 5px;border-radius: 2px;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.menuBtn.open{}
.menuBtn.open b{display: none;margin: 0;position: absolute;left: 5px;top: 50%;width: 30px;}
.menuBtn.open b:first-child{display: block;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
}
.menuBtn.open b:last-child{display: block;
    transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
}

/*******************************
  -------[=banner]-------
*******************************/
.banner{position: relative;}
.banner .slick-slide .con{display: block;outline: 0;position: relative;height: 100vh;
    background-position: center center;background-repeat: no-repeat;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
.banner .video{position: absolute;top: 50%;left: 50%;width: 100%;height: 100%;z-index: 1;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.banner .video video,.banner .video source{display: block;width: 100%;height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.banner .tit{position: absolute;left: 0;right: 0;top: 150px;text-align: center;
    opacity:0;font-size: 66px;color: #fff;
    -webkit-transition:all 2s ease-out;
    transition:all 2s ease-out;
    -webkit-transform:translateY(80px);
    -moz-transform:translateY(80px);
    -o-transform:translateY(80px);
    -ms-transform:translateY(80px);
    transform:translateY(80px)
}
.banner .tit em{font-weight: 300;}
.banner .slick-slide.img_scale .tit{opacity:1;
    -webkit-transition:all 1.5s ease-out;
    transition:all 1.5s ease-out;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    -o-transform:translateY(0);
    -ms-transform:translateY(0);
    transform:translateY(0)
}

.banner .slick-dots{position: absolute;left: 48px;bottom: 42px;
    z-index: 3;font-size: 0;
}
.banner .slick-dots li{display: inline-block;margin-right: 6px;}
.banner .slick-dots li button{display: block;width: 28px;height: 2px;
    font-size: 0;line-height: 0;text-indent: 999px;background-color: #fff;
    border: 0;opacity: .4;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.banner .slick-dots li.slick-active button{width: 75px;opacity: 1;}
.btn-down{position: absolute;right: 31px;bottom: 33px;z-index: 3;
    width: 21px;height: 32px;
    background: url(../images/i-01.png) no-repeat center;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    animation: downico 1.8s linear infinite;
}
@keyframes downico{
    0%{
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -o-transform: translateY(0%);
        -ms-transform: translateY(0%);
        transform: translateY(0%);
    }
    50%{
        -webkit-transform: translateY(50%);
        -moz-transform: translateY(50%);
        -o-transform: translateY(50%);
        -ms-transform: translateY(50%);
        transform: translateY(50%);
    }
    100%{
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -o-transform: translateY(0%);
        -ms-transform: translateY(0%);
        transform: translateY(0%);
    }
}

.ban{height: 690px;position: relative;
    background-position: center;background-repeat: no-repeat;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
.ban .tit{position: absolute;left: 238px;bottom: 110px;
    font-size: 66px;font-weight: normal;
    color: #fff;
}
.ban2{height: 100vh;position: relative;
    background-position: center;background-repeat: no-repeat;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
.ban2 .video{position: absolute;top: 50%;left: 50%;
    width: 100%;height: 100%;z-index: 1;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.ban2 .video video,.ban2 .video source{display: block;width: 100%;height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}


/*******************************
  -------[=底部]-------
********************************/
.footer{color: rgba(255,255,255,.4);padding: 109px 0 87px;position: relative;
    background: url(../images/fd-bg.jpg) no-repeat center;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
.footer a{color: rgba(255,255,255,.4);
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.footer a:hover{color: #fff;}
.fd-con{*zoom:1;padding-bottom: 44px;}
.fd-con:after,.fd-con:before{display:block; content:"clear"; height:0; clear:both; overflow:hidden; visibility:hidden; }
.fd-nv{float: left;}
.fd-nv dl{float: left;width: 180px;}
.fd-nv dt a,.fd-txt h3{display: block;font-size: 22px;font-weight: bold;color: #fff;
    margin-bottom: 21px;
}
.fd-nv dd a,.fd-txt .desc{display: block;font-size: 16px;line-height: 2.25;}
.fd-txt{float: left;max-width: 280px;}
.fd-r{float: right;}
.fd-logo{width: 98px;margin-bottom: 83px;}
.fd-logo img{width: 100%;display: block;}

.fd-bot{border-top: 1px solid rgba(255,255,255,.2);overflow: hidden;
    font-size: 16px;padding: 38px 0 0;
}
.fd-bot .copy{float: left;}
.fd-bot .link{float: right;}
.fd-share .ico{float: left;position: relative;margin-left: 5px;cursor: pointer;}
.fd-share .ico span{width: 56px;height: 56px;display: block;
    background-color: rgba(255,255,255,.1);border-radius: 2px;
    background-position: center;background-repeat: no-repeat;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    -o-transition: .3s;
}
.fd-share .ico .sina{background-image: url(../images/i-04.png);}
.fd-share .ico .weix{background-image: url(../images/i-05.png);}
.fd-share .qr{width: 150px;height: 150px;position: absolute;bottom: 100%;margin-bottom: 10px;
    left: 50%;display: none;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
.fd-share .ico:hover .qr{display: block;}
.fd-share .ico:hover span{background-color: rgba(255,255,255,.3);}

.btn-top{position: absolute;top: 0;right: 114px;width: 68px;height: 68px;
    border-radius: 0 0 6px 6px;
    background: #20BBB3 url(../images/i-06.png) no-repeat center;
    -o-background-size: 100% auto;
    -ms-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}



/*******************************
    -------[=正文]-------
********************************/
.bd_weixin_popup{
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box;
}




