@charset "utf-8";

 



.rel {

    position: relative;

}



 



* {

    padding-bottom: 0px;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

 font-family: 'Microsoft Yahei';

    color: #cccccc;

    font-size: 12px;

    font-weight: normal;

    padding-top: 0px;

}

.shiying{bottom: 5vh;z-index: 0;text-align:  center;font-size:  12px;width:  100vw;position:  absolute;color: #a1a2a6;}

video{opacity:.8}

.clearBoth {

    clear: both;

}

.btn-nav{opacity: 1;  transition: 1.5s;}

.activenone{opacity: 1; transition: 1.5s;}

#myVideo {

    z-index: 1;

    position: absolute;

    background-color: black;

    width: 100%;

    bottom: 0px;

    background-position: center center;

    height: 100%;

    top: 0px;

    right: 0px;

    background-size: contain;

    object-fit: cover;

}



BODY {

    padding-bottom: 0px;

    line-height: 28px;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    font-family: "Microsoft Yahei";

    background: #fff;

    color: #58595b;

    font-size: 14px;

    padding-top: 0px;

}



A {

    color: #fff;

    font-size: 14px;

    text-decoration: none;

}









#menu {

    padding-bottom: 0px;

    list-style-type: none;

    padding-left: 0px;

    width: 182px;

    padding-right: 0px;

    background: url(../img/mtsdh01.png);

    height: 100%;

    right: 0px;

    padding-top: 0px;

}



#menu LI {

    margin: 0px 0px 20px;

    float: left;

    font-size: 12px;

}



#menu A {

    text-align: left;

    padding-bottom: 0px;

    line-height: 32px;

    text-transform: uppercase;

    padding-left: 55px;

    width: 182px;

    padding-right: 0px;

    display: block;

    background: url(../img/dh_hover.png) no-repeat 182px center;

    height: 32px;

    color: #fff;

    font-size: 16px;

    text-decoration: none;

    padding-top: 0px;

    font-family: "Microsoft Yahei";

}





#menu A:hover {

    padding-bottom: 0px;

    line-height: 32px;

    background: url(../img/dh_hover.png) no-repeat 0px center;

    width: 182px;

    padding-right: 0px;

    height: 32px;

    color: #000;

    /*    background-position: 20px -50px;*/

    text-decoration: none;

    padding-top: 0px;

    transition: 500ms;

}



#menu .active A {

    background: url(../img/dh_hover.png) no-repeat 0px center;

    color: #000;

    transition: 500ms;

}



#menu .navleft A.logo {

    padding-bottom: 0px;

    margin: 0px auto;

    padding-left: 0px;

    width: 164px;

    padding-right: 0px;

    display: block;

    background: url(../img/logo.png) no-repeat center center;

    height: 52px;

    padding-top: 0px;

    transition: 500ms;

}





/*

#menu .navleft A.logo:hover {

    padding-bottom: 0px;

    margin: 0px auto;

    padding-left: 0px;

    width: 100%;

    padding-right: 0px;

    display: block;

    background: url(../img/logo.png) #a2000f no-repeat center center;

    height: 115px;

    padding-top: 0px;

}

*/



#menu LI.navleft {

    width: 182px;

    margin-bottom: 60px;

    float: left;

    margin-top: 50px;

    margin-right: 0px;

}





.logoA {

    width: 50px;

    height: 160px;

    position: fixed;

    z-index: 999;

    top: 10px;

   right: 60px;

    opacity: 1;

    text-align: left;

    transition: 0.5s;

}



.logoA-active {

    width: 170px;

    height: 52px;

    position: fixed;

    top: 40px;

    left: 30px;

    z-index: 999;

    opacity: 1;

    text-align: left;

    transition: 0.5s;

}



.logoA .clickimg {

    width: 28px;

    height: 28px;

    position: fixed;

 right: 60px;

	left: calc(100% - 97px);

    top: 35px;

    cursor: pointer;  transition: 0.5s;

    background: url(../img/fsfs2.png) no-repeat ;

}

.logoA-active .clickimg {

        width: 28px;

    height: 28px;

    position: fixed;

     right: 60px;

    top: 35px;

    cursor: pointer;  transition: 0.5s;

    background: url(../img/fsfs.png) no-repeat ;

}



ul.kf {

    width: 34px;

    margin: 0 auto;

}



ul.kf li {

    width: 34px;

    margin-bottom: 20px;

    position: relative;

    height: 34px;

}



ul.kf li a.kf1,

ul.kf li a.kf2,

ul.kf li a.kf3,

ul.kf li a.kf4,

ul.kf li a.kf5 {

    width: 34px;

    height: 34px;

    right: 0;

    display: block;

    background: rgba(90,90,90,0.6) url(../img/mkf.png) no-repeat;

    -moz-border-radius: 20px;

    /* -webkit-border-radius: 20px; */

    /* border-radius: 20px; */

    text-align: left;

    transition: 500ms;

    overflow: hidden;

    position: absolute;

    margin: 0 auto;

}



ul.kf li a span {

    opacity: 0;

    color: #58595b;

    padding-left: 20px;

    line-height: 34px;

}



ul.kf li img {

    transition: 0.5s;

    transition-delay: 0.5s;

    opacity: 0;

    position: absolute;

    top: -46px;

    left: -223px;

}



ul.kf li a.kf1:hover,

ul.kf li a.kf2:hover,

ul.kf li a.kf3:hover,

ul.kf li a.kf4:hover,

ul.kf li a.kf5:hover {

    border-radius: 20px 20px;

    background: #f1f1f1 url(../img/mkf2.png) no-repeat

}



ul.kf li a.kf2 {

    background-position: 0 -34px

}



ul.kf li a.kf2:hover {

    background-position: 0 -34px

}



ul.kf li a.kf3 {

    background-position: 0 -68px

}



ul.kf li a.kf3:hover {

    background-position: 0 -68px

}



ul.kf li a.kf4 {

    background-position: -132px 0

}



ul.kf li a.kf4:hover {

    background-position: -132px 0

}



ul.kf li a.kf5 {

    background-position: -176px 0

}



ul.kf li a.kf5:hover {

    background-position: -176px 0

}



.ih-item.circle.effect6 .img {

    opacity: 1;

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

    -webkit-transition: all 0.35s ease-in-out;

    -moz-transition: all 0.35s ease-in-out;

    transition: all 0.35s ease-in-out;

}



.ih-item.circle.effect6.colored .info {

    background: #1a4a72;

}



.ih-item.circle.effect6 .info {

    opacity: 0;

    -webkit-transition: all 0.35s ease-in-out;

    -moz-transition: all 0.35s ease-in-out;

    transition: all 0.35s ease-in-out;

}



.ih-item.circle.effect6 .info h3 {

    color: #fff;

    text-transform: uppercase;

    position: relative;

    letter-spacing: 2px;

    font-size: 22px;

    margin: 0 30px;

    padding: 55px 0 0 0;

    height: 110px;

    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);

}



.ih-item.circle.effect6 .info p {

    color: #bbb;

    padding: 10px 5px;

    font-style: italic;

    margin: 0 30px;

    font-size: 12px;

    border-top: 1px solid rgba(255, 255, 255, 0.5);

}



.ih-item.circle.effect6.scale_up .info {

    -webkit-transform: scale(0.5);

    -moz-transform: scale(0.5);

    -ms-transform: scale(0.5);

    -o-transform: scale(0.5);

    transform: scale(0.5);

}



.ih-item.circle.effect6.scale_up a:hover .img {

    opacity: 0;

    -webkit-transform: scale(1.5);

    -moz-transform: scale(1.5);

    -ms-transform: scale(1.5);

    -o-transform: scale(1.5);

    transform: scale(1.5);

}



.ih-item.circle.effect6.scale_up a:hover .info {

    opacity: 1;

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

}



.ih-item.circle.effect6.scale_down .info {

    -webkit-transform: scale(1.5);

    -moz-transform: scale(1.5);

    -ms-transform: scale(1.5);

    -o-transform: scale(1.5);

    transform: scale(1.5);

}



.ih-item.circle.effect6.scale_down a:hover .img {

    opacity: 0;

    -webkit-transform: scale(0.5);

    -moz-transform: scale(0.5);

    -ms-transform: scale(0.5);

    -o-transform: scale(0.5);

    transform: scale(0.5);

}



.ih-item.circle.effect6.scale_down a:hover .info {

    opacity: 1;

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

}



.ih-item.circle.effect6.scale_down_up .info {

    -webkit-transform: scale(0.5);

    -moz-transform: scale(0.5);

    -ms-transform: scale(0.5);

    -o-transform: scale(0.5);

    transform: scale(0.5);

    -webkit-transition: all 0.35s ease-in-out 0.2s;

    -moz-transition: all 0.35s ease-in-out 0.2s;

    transition: all 0.35s ease-in-out 0.2s;

}



.ih-item.circle.effect6.scale_down_up a:hover .img {

    opacity: 0;

    -webkit-transform: scale(0.5);

    -moz-transform: scale(0.5);

    -ms-transform: scale(0.5);

    -o-transform: scale(0.5);

    transform: scale(0.5);

}



.ih-item.circle.effect6.scale_down_up a:hover .info {

    opacity: 1;

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

}



.ih-item.circle .info {

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    text-align: center;

    border-radius: 50%;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

}



.navright {

    width: 177px;

    margin-right: 0px;

    text-align: center;

    position: absolute;

    right: 0;

    text-align: center;

    bottom: 30px;

}



.copyright {

    padding-top: 5px;

    color: #858585;

    font-size: 11px;

}



ul.kf-b {

    width: 132px;

    margin: 0 auto;

    height: 34px;

}



ul.kf-b li {

    width: 34px;

    margin-left: 5px;

    margin-right: 5px;

    float: left;

}



ul.kf-b li a.kf1,

ul.kf-b li a.kf2,

ul.kf-b li a.kf3,

ul.kf-b li a.kf4,

ul.kf-b li a.kf5 {

    width: 34px;

    height: 34px;

    display: block;

    background: #434343 url(../img/kf.png) no-repeat;

    -moz-border-radius: 20px;

    -webkit-border-radius: 20px;

    border-radius: 20px;

    text-indent: -999px;

    transition: 500ms;

    overflow: hidden

}



ul.kf-b li a.kf1:hover,

ul.kf-b li a.kf2:hover,

ul.kf-b li a.kf3:hover,

ul.kf-b li a.kf4:hover,

ul.kf-b li a.kf5:hover {

    background: #ffc34f url(../imgkf2.png) no-repeat;

}



ul.kf-b li a.kf2 {

    background-position: -44px 0

}



ul.kf-b li a.kf2:hover {

    background-position: -44px 0

}



ul.kf-b li a.kf3 {

    background-position: -88px 0

}



ul.kf-b li a.kf3:hover {

    background-position: -88px 0

}



ul.kf-b li a.kf4 {

    background-position: -132px 0

}



ul.kf-b li a.kf4:hover {

    background-position: -132px 0

}



ul.kf-b li a.kf5 {

    background-position: -176px 0

}



ul.kf-b li a.kf5:hover {

    background-position: -176px 0

}







/*

#menu .nav1 A {

    background: url(../img/nav.png) no-repeat 20px 0;

}



#menu .nav2 A {

    background: url(../img/nav-02.png) no-repeat 20px 0;

}



#menu .nav3 A {

    background: url(../img/nav-03.png) no-repeat 20px 0;

}



#menu .nav4 A {

    background: url(../img/nav-04.png) no-repeat 20px 0;

}



#menu .nav5 A {

    background: url(../img/nav-05.png) no-repeat 20px 0;

}

*/



.section {

    position: relative;

    text-align: center;

    background-position: center top;

    overflow: hidden;

}



H1 {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



H2 {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



H3 {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



P {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



UL {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



LI {

    padding-bottom: 0px;

    list-style-type: none;

    margin: 0px;

    padding-left: 0px;

    padding-right: 0px;

    list-style-image: none;

    padding-top: 0px;

}



H1 {

    position: relative;

}





.div1-about {

    z-index: 999;



    position: absolute;

    width: 100%;

    background: #000;

    height: 100%;

    top: -1100px;

    opacity: 0.95;

    transition: 1s;

    transition-delay: 0s;

}



.div1-pro1 {

    z-index: 999;

    border-bottom: #bc0617 1px solid;

    position: absolute;

    width: 100%;

    background: #000;

    height: 98%;

    top: -1100px;

    opacity: 1;

    transition: 1s;

    transition-delay: 0s;

}



.div1-pro2 {

    z-index: 999;



    position: absolute;

    width: 100%;

    background: #000;

    height: 95%;

    top: -1100px;

    opacity: 1;

    transition: 1s;

    transition-delay: 0s;

}



.div1-pro3 {

    z-index: 999;



    position: absolute;

    width: 100%;

    background: #000;

    height: 95%;

    top: -1100px;

    opacity: 1;

    transition: 1s;

    transition-delay: 0s;

}



.div1-news {

    z-index: 999;

    position: absolute;

    width: 50%;

    background: #000;

    height: 100%;

    top: 0px;

    border-right: #bc0617 1px solid;

    left: -51%;

    opacity: 0.95;

    transition: 1s;

    transition-delay: 0s;

}



.div1-news2 {

    z-index: 999;

    position: absolute;

    width: 50%;

    background: #000;

    height: 100%;

    top: 0px;

    border-right: #bc0617 1px solid;

    left: -51%;

    opacity: 0.95;

    transition: 1s;

    transition-delay: 0s;

}



.div1-news-d {

    z-index: 999;

    position: absolute;

    width: 50%;

    background: #000;

    height: 100%;

    top: 0px;

    right: -51%;

    border-right: #bc0617 1px solid;

    opacity: 0.95;

    transition: 1s;

    transition-delay: 0s;

}



.active-div1-about {

    top: 0px;

    transition-delay: 0;

}



.active-div1-pro1 {

    top: 0px;

    transition-delay: 0;

}



.active-div1-pro2 {

    top: 0px;

    transition-delay: 0;

}



.active-div1-pro3 {

    top: 0px;

    transition-delay: 0;

}



.active-div1-news {

    z-index: 9999;

    left: 0px;

    transition-delay: 0;

}



.active-div1-news-d {

    right: 0px;

    transition-delay: 0;

}



.open-about {

    margin: 0px auto;

    display: block;

}



.open-pro1 {

    margin: 0px auto;

    display: block;

}



open-news {

    margin: 0px auto;

    display: block;

}



.div1-ly {

    z-index: 999;



    position: absolute;

    width: 100%;

    background: #000;

    opacity: 0.95;



    top: 20%;

    padding: 10px 0;

    left: -1920px;

    transition: 1s;

}



.active-div1-ly {

    left: 0;

}



#p2-contant {

    padding-top: 20px;

    height: 100%;

}



.close-about {

    z-index: 9999;

    position: absolute;

    width: 48px;

    height: 0px;

    left: 50%;

    margin-left: -24px;

    bottom: -24px;

    text-align: center;

    overflow: hidden;

    transition: 0.5s;

    transition-delay: 0s;

}



.close-about:hover {

    filter: Alpha(opacity=100);

    -moz-opacity: 1;

    opacity: 1;

}



.close-about,

.close-pro1,

.close-pro2,

.close-pro3 {

    z-index: 9999;

    position: absolute;

    width: 48px;

    line-height: 48px;

    height: 0px;

    left: 50%;

    margin-left: -24px;

    bottom: 0;

    color: #FFF;

    display: block;



    transition: 0.5s;

    transition-delay: 0s;

}



.close-about:hover,

.close-pro1:hover,

.close-pro2:hover,

.close-pro3:hover {

    filter: Alpha(opacity=100);

    -moz-opacity: 1;

    opacity: 1;

}



.active-close-about,

.active-close-pro1,

.active-close-pro2,

.active-close-pro3 {

    height: 48px;

    bottom: 50px;

    transition-delay: 1s;

}



.close-news,

.close-news2 {

    z-index: 9999;

    position: absolute;

    width: 48px;

    height: 0px;

    margin-left: -24px;

    top: 48%;

    left: 50%;

    overflow: hidden;

    filter: Alpha(opacity=90);

    -moz-opacity: 0.9;

    opacity: 0.9;

    transition: 0.5s;

    transition-delay: 0s;

}



.close-news:hover {

    filter: Alpha(opacity=100);

    -moz-opacity: 1;

    opacity: 1;

}



.close-news2:hover {

    filter: Alpha(opacity=100);

    -moz-opacity: 1;

    opacity: 1;

}



.active-close-news {

    height: 48px;

    transition-delay: 1s;

}



.close-ly:hover {

    filter: Alpha(opacity=100);

    -moz-opacity: 1;

    opacity: 1;

}



.close-ly {

    z-index: 9999;

    position: absolute;

    width: 48px;

    height: 0px;

    left: 10%;

    bottom: 50%;

    overflow: hidden;

    filter: Alpha(opacity=90);

    -moz-opacity: 0.9;

    opacity: 0.9;

    transition: 0.5s;

    transition-delay: 0s;

}



.active-close-ly {

    height: 48px;

    transition-delay: 1s;

}



#content {

    text-align: left;

    margin: 0px auto;

    width: 1000px;

    color: #ccc;

    font-size: 12px;

}



#content P {

    text-align: left;

    color: #ccc;

    font-size: 12px;

}



.slider1 {

    background: url(../img/p1bg.jpg) no-repeat 50% 50%;

    transition: all 2s;

    background-size: 2880px 1620px;

}



.slider1.active {

    background: url(../img/p1bg.jpg) no-repeat 50% 50%;

    background-size: 1920px 1080px;

    transition-delay: 0s;

}



.slider2 {

    background: url(../img/p1bg2.jpg) no-repeat 50% 50%;

    transition: all 2s;

    background-size: 2880px 1620px;

}



.slider2.active {

    background: url(../img/p1bg2.jpg) no-repeat 50% 50%;

    background-size: 1920px 1080px;

    transition-delay: 0s;

}



.serBox {

    cursor: pointer;

    display: inline;

    width: 138px;

    height: 138px;

    float: left;

    overflow: hidden;

    background: url(../img/p3-2.png) no-repeat;

    position: relative;

}



.serBoxOn {

 

    display: none;

    width: 138px;

    height: 138px;

    background: url(../img/p3-2-h.png) no-repeat;

    position: absolute;

    left: 0px;

    top: 0px;

    z-index: 19;

}



.serBox .pic1 {

    width: 60px;

    height: 60px;

    text-align: center;

    position: absolute;

    top: 30px;

    right: 39px;

    z-index: 99;

}



.serBox .pic2 {

    width: 60px;

    height: 60px;

    text-align: center;

    position: absolute;

    top: 30px;

    left: -110px;

    z-index: 99;

}



.serBox .txt1 {

    width: 138px;

    height: 60px;

    color: #fff;

    position: absolute;

    top: 90px;

    left: 0;

    z-index: 99;

}



.serBox .txt2 {

    width: 138px;

    height: 138px;

    color: #a9cf4f;

    position: absolute;

    top: 0px;

    right: -240px;

    z-index: 99;

}



.serBox span.tit {

    font-size: 12px;

    display: block;

    text-align: center;

    text-transform: uppercase;

    text-align: center;

}



.serBox .txt1 .tit {

    color: #ffffff;

    line-height: 30px;

}



.serBox .txt2 .tit {

    color: #bc0617;

    padding-top: 90px;

    height: 48px;

}



.serBox p {

    padding: 0 10px;

    text-align: center;

}







A.tu0 {

    width: 383px;

    display: block;

    background: url(../img/p1.png) no-repeat center center;

    height: 383px;

    transition: all 1.5s;

}



A.tu0:hover {

    width: 383px;

    display: block;

    background: url(../img/p1-h.png) no-repeat center center;

    height: 383px;

}



A.tu1 {

    width: 223px;

    display: block;

    background: url(../img/p1-02.png) no-repeat center center;

    height: 223px;

    transition: all 1.5s;

}



A.tu1:hover {

    width: 223px;

    display: block;

    background: url(../img/p1-02h.png) no-repeat center center;

    height: 223px;

}



A.tu2 {

    width: 223px;

    display: block;

    background: url(../img/p1-03.png) no-repeat center center;

    height: 223px;

    transition: all 1.5s;

}



A.tu2:hover {

    width: 223px;

    display: block;

    background: url(../img/p1-03h.png) no-repeat center center;

    height: 223px;

}



.fp-controlArrow.fp-prev {

    left: 20%;

    width: 66px;

    background: url(../img/arrleft.png) no-repeat;

    height: 131px;

    opacity: 0;

    transition: all 1.5s;

}



.active .fp-controlArrow.fp-prev {

    left: 10%;

    width: 66px;

    opacity: 0.7;

    transition-delay: 1s;

}



.fp-controlArrow.fp-next {

    right: 20%;

    width: 66px;

    background: url(../img/arrright.png) no-repeat;

    height: 131px;

    opacity: 0;

    opacity: 0.7;

    transition: all 1.5s;

}



.active .fp-controlArrow.fp-next {

    right: 10%;

    opacity: 0.7;

    transition-delay: 1s;

}



.section01 .cf_content {

    position: relative;

}



.section01 .nr1 {

    width: 760px;

    position: absolute;

    left: 50%;

    margin-left: -600px;

    top: 200px;

    height: 480px;

}





.section01 {

    background: #58595b;

    transition: all 1.5s;

 }



.section01.active {

    background: #58595b;

     transition-delay: 0s;

}



.shipin{width: 100vw;position: absolute;left: 50%;margin-left: -50vw;top: -10px;z-index: 0;background: #111;z-index: 1;/* height: 100vh; */opacity: 1;}

.shipinbg{background: #000;width: 100vw; height:100vh;}



.p1-0 {position: absolute;width: 62.5%;top: 230px;margin-left: 18.75%; color: #e5e0da;font-size: 50px;opacity: 0!important;z-index: 2;text-align: center;transition: all 1.5s;z-index: 9;}





.active .p1-0 {



    top: 420px;



    opacity: 1!important;



    transition-delay: 1s;

}









.p1-2 {



    position: absolute;



    width: 895px;



    height: 35px;



    top: 350px;



    left: 50%;



    margin-left: -448px;



    color: #e5e0da;



    font-size: 50px;



    opacity: 0;



    top: 350px;



    text-align: center;



    transition: all 1.5s;



    z-index: 9;

}





.active .p1-2 {



    top: 400px;



    opacity: 1;



    transition-delay: 1.5s;

}







.p1-1 {

    z-index: 2;

    position: absolute;

    width:150px;

    height: 50px;

    top: 480px;

 border-radius: 10px;

   right: 18.75%;

    line-height: 36px;

    font-size: 14px;

    text-align: left;

    opacity: 0;

  

    transition: all 1.5s;

}



.active .p1-1 {

  top:72%;

    opacity: 1;

    transition-delay: 2s;

}

.p1-1 a{width: 149px; height: 49px;  

 border-radius: 10px;display: block; border:1px solid #fff; color: #fff; line-height: 50px; text-align: center; transition: all 1.5s; }

.p1-1 a:hover{width: 149px; height: 49px;  border-radius: 10px;display: block; border:1px solid #045a93; color: #fff; line-height: 50px; text-align: center; }



.p1-1 a::before { border-radius: 10px;

    content: '';

    z-index: -1;

    position: absolute;

    height: 100%;

    width: 0;

    left: 0;

    top: 0;

    opacity: 0;

    background: #045a93;

    transition: all 1s ease;

}



.p1-1 a:hover::before { border-radius: 10px;

    opacity: 1;

    width: 100%;

}









.p1-5 {

    z-index: 2;

    position: absolute;

    width:150px;

    height: 50px;

    top: 560px;

 border-radius: 10px;

    right: calc( 18.75% + 170px);

    line-height: 36px;

    font-size: 14px;

    text-align: left;

    opacity: 0;

 

    transition: all 1.5s;

}



.active .p1-5 {

  top:72%;

    opacity: 1;

    transition-delay: 2s;

}

.p1-5 a{width: 149px; height: 49px;  

 border-radius: 10px;display: block; border:1px solid #005bac; color: #005bac; line-height: 50px; text-align: center; transition: all 1.5s; }

.p1-5 a:hover{width: 149px; height: 49px;  border-radius: 10px;display: block; border:1px solid #fff; color: #005bac; line-height: 50px; text-align: center; }



.p1-5 a::before { border-radius: 10px;

    content: '';

    z-index: -1;

    position: absolute;

    height: 100%;

    width: 0;

    left: 0;

    top: 0;

    opacity: 0;

    background: #fff;

    transition: all 1s ease;

}



.p1-5 a:hover::before { border-radius: 10px;

    opacity: 1;

    width: 100%;

}







.p1-b {

    position: absolute;

    text-align: center;

    width: 32px;

    height: 20px;

    left: 50%;

    bottom: 15vh;

    opacity: 0;

    z-index: 111112;

    margin-left: -16px;

    transition: all 1.5s;

}



.active .p1-b {

    position: absolute;

    bottom: 6vh;

    opacity: 1;

    transition-delay: 2.5s;

}

.logoz{

	position: fixed;left: 30px;top:25px;z-index: 999;

}

 

@media (max-width:1200px) {

	.logoz{

		left: 15px;

	}.logoA{

		right: 15px;

	}.logoA .clickimg{    position: fixed;

		left: calc(100% - 52px);

	}

	.open-bot{

		right: 30px!important;

	}

}



@media (max-width:600px) {

	.logoz{

	top:25px;

}

 

	.logoz img{

		width: 250px;

	}



}

.more {

    line-height: 37px;

    text-transform: uppercase;

    margin: 0px auto;

    width: 180px;

    display: block;

    background: #fa9a20;

    height: 37px;

    color: #fff;

    font-size: 12px;

    transition: all 500ms;

    border-radius: 20px;

    -moz-border-radius: 20px;

    -webkit-border-radius: 20px;

}



.more:hover {

    line-height: 37px;

    margin: 0px auto;

    width: 190px;

    display: block;

    background: #fff;

    height: 37px;

    color: #fa9a20;

    border-radius: 20px;

    -moz-border-radius: 20px;

    -webkit-border-radius: 20px;

    border: 1px solid #fa9a20;

}







/*鼠标浮动开始*/



.arr {

    width: 32px;

    margin: 0px auto;

    position: relative;

    animation: arrUpdown 1s infinite alternate;

    -webkit-animation: arrUpdown 1s infinite alternate;

}



.arr2 {

    width: 32px;

    height: 18px;

    position: relative;

}



@keyframes arrUpdown {

    from {

        margin-top: -5px;

        opacity: 0.5

    }

    to {

        margin-top: 5px;

        opacity: 0.9

    }

}



@-webkit-keyframes arrUpdown {

    from {

        margin-top: -5px;

        opacity: 0.5

    }

    to {

        margin-top: 5px;

        opacity: 0.9

    }

}





/*鼠标浮动结束*/



.container {

    position: relative;

    width: 100px;

    height: 100px;

}



.chevron {

    position: absolute;

    width: 28px;

    height: 3px;

    left: 50%;

    margin-left: -14px;

    opacity: 0;

    transform: scale3d(0.5, 0.5, 0.5);

    animation: move 3s ease-out infinite;

}



.chevron:first-child {

    animation: move 3s ease-out 1s infinite;

}



.chevron:nth-child(2) {

    animation: move 3s ease-out 2s infinite;

}



.chevron:before,

.chevron:after {

    content: ' ';

    position: absolute;

    top: 0;

    height: 100%;

    width: 51%;

    background: #fa9a20;

}



.chevron:before {

    left: 0;

    transform: skew(0deg, 30deg);

}



.chevron:after {

    right: 0;

    width: 50%;

    transform: skew(0deg, -30deg);

}



@keyframes move {

    25% {

        opacity: 1;

    }

    33% {

        opacity: 1;

        transform: translateY(30px);

    }

    67% {

        opacity: 1;

        transform: translateY(40px);

    }

    100% {

        opacity: 0;

        transform: translateY(55px) scale3d(0.5, 0.5, 0.5);

    }

}



.text {

    display: block;



    padding-top: 60px;

     font-size: 12px;

    color: #666;

    text-transform: uppercase;

    white-space: nowrap;

    opacity: .25;

    animation: pulse 2s linear alternate infinite;

}



@keyframes pulse {

    to {

        opacity: 1;

    }

}







.section02 {

	 background: url(../img/b3.png) no-repeat center;



    transition: all 1.5s;

    background-size: 2880px 1620px;

}



.section02.active {

   

	 background: url(../img/b3.png) no-repeat center;

    background-size: 1920px 1080px;

    transition-delay: 0s;

}







.section02 .cf_content {

    position: relative;

}



.nr2 {

    width: 900px;

    position: absolute;

    left: 20%;

float: left;

    top: 20%;

    height: 480px;

    opacity:0;

    transition:all 1.5s;

    background: rgba(0,91,172,0.8);

}

.active .nr2 {

   

        opacity:1;

    margin-left: 280px;

      transition-delay: 1s;

}





.p2-0 {

    position: absolute;

    text-align: center;

    width: 284px;

    height: 482px;

    top: 20%;

float: left;

    opacity: 0;

    left: 50%;

    margin-left: -700px;

    transition: all 1.5s;

}





p{

	text-align: justify!important;

}



.active .p2-0 {

    margin-left: -600px;

    transition-delay: 1s;

     opacity:1;

}



 

@media (max-width:1600px) {

	.active .nr2 {

   

      

		margin-left: 200px;}

}

@media (max-width:1450px) {

	.active .nr2 {

   

   

    margin-left: 120px;

}

	.p2-0{

		left: 48%;

	}

}

@media (max-width:1350px) {

	.active .nr2 {

   

   

    margin-left: 50px;

}

	.p2-0{

		left: 50%;

	}

}

@media (max-width:1200px) {

	

	.p2-0{

		display: none;

	}

	.nr2{

		

		left: 50%;

    margin-left: -450px!important;

	}

}

@media (max-width:900px) {

	.nr2 {

		width: 90%;

	

	left: 0!important;

		margin-left: 5%!important;

	

	}

	.active .p2-1 {

 

		top: 30px!important;}

	.active .p2-2 {

    position: absolute;

    top: 170px!important;

		

		

	}.active .p2-3 {

    position: absolute;

    top: 310px!important;

		

	}

}





@media (max-width:700px) {

	

	.p2-1 p {

		font-size: 16px!important;

	height: 84px!important;

		overflow: hidden;

	}

	.p2-1 h4 {height: 28px!important;

		overflow: hidden;

		font-size: 20px;}.p2-2 p {

		font-size: 16px!important;

	height: 80px!important;

		overflow: hidden;

	}

	.p2-2 h4 {height: 26px!important;

		overflow: hidden;

		font-size: 20px;}.p2-3 p {

		font-size: 16px!important;

	height: 84px!important;

		overflow: hidden;

	}

	.p2-3 h4 {height: 28px!important;

		overflow: hidden;

		font-size: 20px;}

}

.maskwave {

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    z-index: 0;

}



.wave {



    position: absolute;

    top: 150px;

    left: 0;

    width: 100%;

    height: 570px;

    z-index: 0;

    opacity: 0;

    background: none;

    transition: all 1.5s;

}



.active .wave {

    opacity: 1;

    transition-delay: 2.5s;

}





.p2-1 {

    position: absolute;

    text-align: center;

    width: 90%;

    height: 120px;

	border-bottom: 1px #fff solid;

    top: 0px;

    left: 5%;



    opacity: 0;

    transition: all 1.5s;

}

.p2-1 h4{

	font-size: 24px;

	text-align: left;

	color: #fff;

}.p2-1 p{

	font-size: 18px;

	text-align: left;

	color: #fff;

	margin-top: 15px;



}

.active .p2-1 {

    position: absolute;

    opacity: 1;

    top: 50px;

    transition-delay: 1.5s;

}



.p2-2 {

    position: absolute;

    text-align: center;

     width: 90%;

      height: 120px;

	border-bottom: 1px #fff solid;

    top: 100px;

    left: 5%;

    opacity: 0;

    color: #fff;

    line-height: 26px;

    transition: all 1.5s;

}

.p2-2 h4{

	font-size: 24px;

	text-align: left;

	color: #fff;

}.p2-2 p{

	font-size: 18px;

	text-align: left;

	color: #fff;

	margin-top: 15px;

}

.active .p2-2 {

    position: absolute;

    top: 190px;

    opacity: 1;

    transition-delay: 2s;

}



.p2-3 h4{

	font-size: 24px;

	text-align: left;

	color: #fff;

}.p2-3 p{

	font-size: 18px;

	text-align: left;

	color: #fff;

	margin-top: 15px;

}

.p2-3 {

    position: absolute;

    text-align: center;

      width: 90%;

  

    top: 30px;

    left: 5%;

    top: 280px;

    opacity: 0;



    transition: all 1.5s;

}



.active .p2-3 {

    position: absolute;

    top: 330px;

    opacity: 1;

    transition-delay: 2.5s;

}



.aboutmore {

    width: 30px;

    height: 30px;

    margin: 0 auto;

    display: block;

    border: 1px solid #e1e0e0;

    background: url(../img/more.png) no-repeat center center;

    transition: all 1.5s;

}



.aboutmore:hover {

    width: 30px;

    height: 30px;

    margin: 0 auto;

    display: block;

    border: 1px solid #58595b;

    background: #58595b url(../img/amore2.png) no-repeat center center;

    transition: all 1.5s;

}



.sjmore {

    width: 30px;

    height: 30px;

    /* float:left; */

    margin-top: 15px;

    display: inherit;

    border: 1px solid #e1e0e0;

    background: url(../img/amore.png) no-repeat center center;

    transition: all 1.5s;

}



.sjmore:hover {

    width: 30px;

    height: 30px;

 

    display: block;

    border: 1px solid #58595b;

    background: #58595b url(../img/amore2.png) no-repeat center center;

    transition: all 1.5s;

}



.p2-4 {

    position: absolute;

    text-align: center;

    width: 40px;

    height: 20px;

    left: 50%;

    top: 350px;

    opacity: 0;

    margin-left: -20px;

    transition: all 1.5s;

}



.active .p2-4 {

    position: absolute;

    top: 400px;

    opacity: 1;

    transition-delay: 3s;

}



.section03 {

	

	 background: url(../img/b2.png) no-repeat left;

    

    transition: all 1.5s;

    background-size: 2880px 1620px;

}



.section03.active {

    background-size: 1920px 1080px;

    transition-delay: 0s;

}



.p3-1 {

        position: absolute;

        top: 20vh;

        left: 50%;

        margin-left: -31.25%;

        width: 62.5%;

    }



@media screen and (max-width: 1600px) {



    .p3-1 {

        position: absolute;

        top: 22vh;

        left: 50%;

     	margin-left: -37.5%;

        width: 75%;

    }ul.p3-1 li {

   

		height: 18vw!important;}



}

@media screen and (max-width: 1450px) {



    .p3-1 {

        position: absolute;

         top: 24vh;

        left: 50%;

 	margin-left: -37.5%;

        width: 75%;

    }



}





@media screen and (max-width: 1280px) {



    .p3-1 {

        position: absolute;

        top: 24vh;

        left: 50%;

     	margin-left: -42.5%;

        width: 85%;

    }ul.p3-1 li {

   

		height: 20vw!important;}



 

}





@media screen and (max-width: 900px) {

	

	ul.p3-1 li {

		width: 50%!important;}

	 .p3-1 {

        position: absolute;

        top: 13vh;

        left: 50%;

   	margin-left: -37.5%;

        width: 75%;

    }ul.p3-1 li {

   

		height: 28vw!important;}



}







@media screen and (max-width: 700px) {

	

	 .p3-1 {

        position: absolute;

        top: 18vh;

        left: 50%;

   	margin-left: -37.5%;

        width: 75%;

    }ul.p3-1 li {

   

		height: 28vw!important;}

	ul.p3-1 li:nth-child(1) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp111.png) no-repeat center center!important;



}



}

@media screen and (max-width: 500px) {

	 .p3-1 {

        position: absolute;

        top: 25vh;

        left: 50%;

	margin-left: -42.5%;

        width: 85%;

    }ul.p3-1 li {

   

		height: 30vw!important;}

		ul.p3-1 li:nth-child(1) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp1111.png) no-repeat center center!important;



}

		ul.p3-1 li:nth-child(2) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp211.png) no-repeat center center!important;



}

		ul.p3-1 li:nth-child(3) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp311.png) no-repeat center center!important;



}	ul.p3-1 li:nth-child(4) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp411.png) no-repeat center center!important;



}	ul.p3-1 li:nth-child(5) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp511.png) no-repeat center center!important;



}

}

.active .p3-1 {}





.p3-1 li:nth-child(1) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(1) {

    opacity: 1;

    transition-delay: 1s;

}





.p3-1 li:nth-child(2) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(2) {

    opacity: 1;

    transition-delay: 1s;

}





.p3-1 li:nth-child(3) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(3) {

    opacity: 1;

    transition-delay: 1s;

}





.p3-1 li:nth-child(4) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(4) {

    opacity: 1;

    transition-delay: 1s;

}





.p3-1 li:nth-child(5) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(5) {

    opacity: 1;

    transition-delay: 1s;

}





.p3-1 li:nth-child(6) {

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-1 li:nth-child(6) {

    opacity: 1;

    transition-delay: 1s;

}





.jg {

    opacity: 1;

    transition: all 1.5s;

    width: 437px;

    height: 0px;

    position: absolute;

    left: 50%;

    margin-left: -218px;

    bottom: 62px;

    background: url(../img/mprohover.png) no-repeat center top;

    overflow: hidden;

}

.jgactive{

    opacity: 1;

    transition: all 1.5s;

    width: 437px;

    height: 189px;

    position: absolute;

    left: 50%;

    margin-left: -218px;

    bottom: 62px;

    overflow: hidden;

}

 



ul.p3-1 li {

    width: 33.33%;

    float: left;

   height: 14.5vw;

    overflow: hidden;

	border: 1px solid #fff;

}

ul.p3-1 li a.logo{ text-indent:-9999px} 



ul.p3-1 li:nth-child(1) {

    background: url(../img/cp1.png) no-repeat center center;

	background-size:100% 100%;



    transition: all 1.5s;

 background-size: cover;

    position: relative;

}



ul.p3-1 li:nth-child(1) a.logo {

    width: 100%;

    height: 100%;

    display: block;

   

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}



ul.p3-1 li:nth-child(1) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp11.png) no-repeat center center;

    transition: all 1.5s;

}



 

ul.p3-1 li:nth-child(2) {

    background: url(../img/cp2.png) no-repeat center center;background-size:100% 100%;



    transition: all 1.5s;

    position: relative;

     background-size: cover;

}



ul.p3-1 li:nth-child(2) a.logo {

        width: 100%;

    height: 100%;

    display: block;

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}



ul.p3-1 li:nth-child(2) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp21.png) no-repeat center center;

    transition: all 1.5s;

}





ul.p3-1 li:nth-child(3) {

    background: url(../img/cp3.png) no-repeat center center;background-size:100% 100%;



    transition: all 1.5s;

    position: relative;

     background-size: cover;

}



ul.p3-1 li:nth-child(3) a.logo {

       width: 100%;

    height: 100%;

    display: block;

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}



ul.p3-1 li:nth-child(3) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp31.png) no-repeat center center;

    transition: all 1.5s;

}



 

ul.p3-1 li:nth-child(4) {

    background: url(../img/cp4.png) no-repeat center center;background-size:100% 100%;



    transition: all 1.5s;

    position: relative;

     background-size: cover;

}



ul.p3-1 li:nth-child(4) a.logo {

        width: 100%;

    height: 100%;

    display: block;

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}



ul.p3-1 li:nth-child(4) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp41.png) no-repeat center center;

    transition: all 1.5s;

}



 

ul.p3-1 li:nth-child(5) {

    background: url(../img/cp5.png) no-repeat center center;background-size:100% 100%;



    transition: all 1.5s;

    position: relative;

     background-size: cover;

}



ul.p3-1 li:nth-child(5) a.logo {

    width: 100%;

    height: 100%;

    display: block;

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}



ul.p3-1 li:nth-child(5) a.logo:hover {

    background: rgba(88,89,91,0.9) url(../img/cp51.png) no-repeat center center;

    transition: all 1.5s;

}



 

ul.p3-1 li:nth-child(6) {

    background: url(../img/cp6.png) no-repeat center center;background-size:100% 100%;



    transition: all 1.5s;

    position: relative;

     background-size: cover;

}

ul.p3-1 li:nth-child(6) a{

    width: 100%;

    height: 100%;

    display: block;

    transition: all 1.5s;

    position: absolute;

    bottom: 0px;

    left: 0;

}

.jg h1 {

    width: 355px;

    /* height: 60px; */

    display: block;

    margin: 0 auto;

    line-height: 30px !important;

    color: #f1f1f1;

    padding-top: 18px;

}



.tb li a .tb {

    width: 34px;

    height: 34px;

    display: block;

    background: url(../img/mtb.jpg) no-repeat;

}



.tb li {

    width: 64px !important;

    height: 64px !important;

    float: left;

    margin: 0 !important;

    background: none !important;

}



.tb li a {

    width: 64px;

    height: 34px;

    display: block;

    left;

}



.tb li a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    transition: all .5s;

}



.tb .tb1 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto

}



.tb li a .zi {

    width: 64px;

    height: 34px;

    display: block;

    text-align: center;

    color: #e5e0da

}



.tb li a .zi {

    width: 64px;

    height: 34px;

    display: block;

    text-align: center;

    color: #fff

}



.tb li.tb2 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -34px 0

}



.tb li.tb3 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -68px 0

}



.tb li.tb4 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -102px 0

}



.tb li.tb5 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -136px 0

}



.tb li.tb6 a .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -170px 0

}







.tb .tb1 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: 0 -34px

}



.tb li.tb2 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -34px -34px

}



.tb li.tb3 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -68px -34px

}



.tb li.tb4 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -102px -34px

}



.tb li.tb5 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -136px -34px

}



.tb li.tb6 a:hover .tb {

    width: 34px;

    height: 34px;

    display: block;

    margin: 0 auto;

    background-position: -170px -34px

}







ul.tb {

    width: 385px;

    margin: 0 auto;

    padding-top: 20px;

    height: 60px;

}



.p3-2 {

    position: absolute;

    width: 1200px;

    height: 540px;

    margin-left: -600px;

    top: 250px;

    left: 50%;

    opacity: 1;

    transition: all 1.5s;

}



.active .p3-2 {

    position: absolute;

    top: 250px;

    opacity: 1;

    transition-delay: 1.5s;

}



.p3-2-1 {

    width: 600px;

    overflow: hidden;

    height: 0px;

    position: relative;

    background: #17181a;

    overflow: hidden;

    transition: all 1s;

    position: absolute;

    left: 0

}



.p3-2-2 {

    width: 600px;

    overflow: hidden;

    height: 0px;

    position: relative;

    background: #222222;

    overflow: hidden;

    transition: all 1s;

    position: absolute;

    right: 0

}





.active .p3-2-1 {

    width: 600px;

    height: 86px;

    float: left;

    background: #17181a;

    overflow: hidden;

    transition-delay: 1.5s;

    padding: 0;

}



.active .p3-2-2 {

    width: 600px;

    height: 86px;

    float: left;

    background: #222222;

    overflow: hidden;

    transition-delay: 2s;

}



.p3-2-1 a {

    width: 600px;

    height: 86px;

    display: block;

    overflow: visible;

    background: #17181a;

    position: absolute;

    transition: all 1.5s;

    margin: 0;

}



.p3-2-2 a {

    width: 600px;

    height: 86px;

    display: block;

    overflow: visible;

    background: #222222;

    position: absolute;

    transition: all 1.5s;

    margin: 0;

}



.p3-2-1 a:hover {

    width: 600px;

    height: 86px;

    display: block;

    overflow: visible;

    background: #665044;

}



.p3-2-2 a:hover {

    width: 600px;

    height: 86px;

    display: block;

    overflow: visible;

    background: #533f34;

}





.p3-2-1 span,

.p3-2-2 span {

    width: 22px;

    padding-bottom: 10px;

    border-top: 1px solid #fff;

    display: block;

    margin: 0 auto;

    margin-top: 15px;

    transition: all 1.5s;

}



.p3-2-1 h1,

.p3-2-2 h1 {

    width: 100px;

    text-align: center;

    color: #fff;

    font-size: 14px;

    height: 25px;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

}



.p3-2-1 h2,

.p3-2-2 h2 {

    width: 100px;

    text-align: center;

    color: #533f34;

    font-size: 12px;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

}



.p3-2-1 a:hover span,

.p3-2-2 a:hover span {

    width: 60px;

    margin-top: 20px;

}



.p3-2-1 a:hover h1,

.p3-2-2 a:hover h1 {

    font-size: 14px;

    margin-top: 5px;

}



.p3-2-1 a:hover h2,

.p3-2-2 a:hover h2 {

    margin-top: 50px;

}



.p3-3 {

    position: absolute;

    width: 362px;

    height: 145px;

    margin-left: -550px;

    top: 350px;

    left: 50%;

    opacity: 0;

    text-align: left;

    transition: all 1.5s;

}



.p3-2-3 {

    width: 600px;

    height: 368px;

    float: left;

    background: #222222;

    overflow: hidden;

    transition: all 1.5s;

    transition: all 2s;

    position: absolute;

    left: 0;

    top: 86px;

    opacity: 0

}



.p3-2-3 img {

    float: left;

}



.p3-2-4 {

    width: 600px;

    height: 368px;

    float: right;

    background: #292929;

    overflow: hidden;

    transition: all 1.5s;

    transition: all 2s;

    top: 86px;

    position: absolute;

    right: 0;

    top: 86px;

    opacity: 0;

    text-align: center

}





.active .p3-2-3 {

    width: 600px;

    height: 368px;

    float: left;

    background: #222222;

    overflow: hidden;

    transition-delay: 2.5s;

    padding: 0;

    opacity: 1

}



.active .p3-2-4 {

    width: 600px;

    height: 368px;

    float: left;

    background: #292929;

    overflow: hidden;

    transition-delay: 3s;

    padding: 0;

    opacity: 1

}





.p3-2-5 {

    width: 600px;

    height: 0px;

    float: left;

    overflow: hidden;

    transition: all 1s;

    position: absolute;

    left: 0;

    top: 454px;

}



.p3-2-6 {

    width: 600px;

    height: 0px;

    float: right;

    background: #665044;

    overflow: hidden;

    transition: all 1s;

    position: absolute;

    right: 0;

    top: 454px;

}



.p3-2-5 img {

    position: absolute;

    left: 34px;

    top: 26px;

}



.p3-2-6 img {

    position: absolute;

    left: 29px;

    top: 29px;

}



.p3-2-5 span,

.p3-2-6 span {

    width: 22px;

    padding-bottom: 10px;

    border-top: 1px solid #fff;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

    position: absolute;

    top: 31px;

    left: 100px;

}



.p3-2-5 a:hover span,

.p3-2-6 a:hover span {

    width: 60px;

    padding-bottom: 10px;

    border-top: 1px solid #fff;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

    position: absolute;

    top: 31px;

    left: 100px;

}







.p3-2-5 a {

    width: 600px;

    height: 86px;

    display: block;

    background: #533f34;

    transition: all 1.5s;

}



.p3-2-6 a {

    width: 600px;

    height: 86px;

    display: block;

    background: #665044;

    transition: all 1.5s;

}





.p3-2-5 a:hover {

    background: #222222;

}



.p3-2-6 a:hover {

    background: #292929;

}







.p3-2-5 h1,

.p3-2-6 h1 {

    width: 100px;

    text-align: left;

    color: #fff;

    font-size: 14px;

    height: 25px;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

    position: absolute;

    line-height: 14px;

    top: 43px;

    left: 100px;

}



.p3-2-5 h2 {

    width: 400px;

    text-align: left;

    color: #8e7567;

    font-size: 12px;

    line-height: 26px !important;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

    position: absolute;

    line-height: 14px;

    top: 17px;

    left: 185px;

}



.p3-2-6 h2 {

    width: 400px;

    text-align: left;

    color: #9a8275;

    font-size: 12px;

    line-height: 26px !important;

    display: block;

    margin: 0 auto;

    transition: all 1.5s;

    position: absolute;

    line-height: 14px;

    top: 17px;

    left: 185px;

}







.active .p3-2-5 {

    width: 600px;

    height: 86px;

    text-align: left;

    float: left;

    overflow: hidden;

    position: relative;

    transition-delay: 3.5s;

}



.active .p3-2-6 {

    width: 600px;

    height: 86px;

    text-align: left;

    float: right;

    overflow: hidden;

    position: relative;

    transition-delay: 4s;

}







.active .p3-3 {

    position: absolute;

    top: 400px;

    opacity: 1;

    transition-delay: 2s;

}



.p3-4 {

    position: absolute;

    width: 1px;

    height: 30px;

    margin-left: -460px;

    top: 530px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-4 {

    position: absolute;

    top: 580px;

    opacity: 1;

    transition-delay: 2.5s;

}



.p3-5 {

    z-index: 1;

    position: absolute;

    width: 166px;

    height: 39px;

    margin-left: -551px;

    top: 600px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-5 {

    top: 650px;

    opacity: 1;

    transition-delay: 3s;

}



.p3-6 {

    z-index: 1;

    position: absolute;

    width: 614px;

    height: 0;

    margin-left: -67px;

    top: 190px;

    left: 50%;

    opacity: 0;

    overflow: hidden;

    transition: all 1.5s;

}



.active .p3-6 {

    top: 240px;

    height: 517px;

    opacity: 1;

    transition-delay: 3.5s;

}



.p3-7 {

    z-index: 4;

    position: absolute;

    width: 95px;

    bottom: 80px;

    height: 68px;

    margin-left: -48px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

}



.active .p3-7 {

    z-index: 4;

    position: absolute;

    width: 95px;

    bottom: 30px;

    height: 68px;

    margin-left: -48px;

    left: 50%;

    opacity: 1;

    transition-delay: 4s;

}





.p3-b {

    position: absolute;

    text-align: center;

    width: 39px;

    height: 20px;

    left: 50%;

    bottom: 100px;

    opacity: 0;

    margin-left: -20px;

    transition: all 1.5s;

}



.active .p3-b {

    position: absolute;

    bottom: 50px;

    opacity: 1;

    transition-delay: 4s;

}



.section04 {

  	

	 background: url(../img/b4.png) no-repeat center;

    transition: all 1.5s;

    background-size: 2880px 1620px;

}



.section04.active {

	

	

	

	 background: url(../img/b4.png) no-repeat center;

    

  

    background-size: 1920px 1080px;

    transition-delay: 0s;

}



.box04-content {

    position: relative;

    margin: 0px auto;

    width: 903px;

    height: 430px;

    padding-top: 60px;

}



.p4-t {

    position: absolute;

    width:46.875%;

    text-align: center;

 margin-left: 26.5625%;

    top: 8vh;



    opacity: 0;

    text-align: center;

    transition: all 1.5s;

}





.active .p4-t {

    position: absolute;

    top: 25vh;

    opacity: 1;

    transition-delay: 1s;

}  

.p4-t h1{ font-size: 24px;line-height: 38px; font-family: 'Microsoft Yahei'; text-align: center; color: #fff;font-weight: normal;}

.p4-t span{font-size: 12px;/* font-family: arial; */text-align: center;text-transform : uppercase;color: #8d8d8d;}

.p4-1 a.imga:before {

    content: "";

    width: 0;

    z-index: 99999;

    position: absolute;

    transition: all 1.5s;

    height: 273px;

    display: block;

    background-color: #533f34;

    opacity: .9

}



.p4-1 a.imga {

    width: 720px;

    height: 275px;

    border: 1px solid #383838;

    padding: 10px;

    display: block;

    overflow: hidden;

}





.p4-1 a.imga:hover:before {

    content: "";

    width: 720px;

    position: absolute;

    height: 273px;

    display: block;

}



.p4-1 a.imga p {

    opacity: 0;

    transition: all 1.5s;

    position: absolute;

    top: 0;

    color: #fff;

    text-align: center;

    z-index: 9999999;

    width: 720px;

    padding-top: 160px;

}



.p4-1 a.imga:hover p {

    opacity: 1;

    padding-top: 110px;

}



.p4-1 {

    position: absolute;

    width: 1007px;

    height: 500px;

    margin-left: -503.5px;

    top: 50vh;

    left: 50%;

    opacity: 0;

    text-align: left;

    transition: all 1.5s;

}

.active .p4-1 {

    position: absolute;

    top: 45vh;

    opacity: 1;

    transition-delay: 1.5s;

}



ul.p4-1 li {

    position: relative;

    float: left;

    overflow: hidden

}



ul.p4-1 li img {

    transition: all 1s !important;

    -webkit-transition: all 1s !important;

}



ul.p4-1 li a:hover img {

	      -webkit-transform: rotatez(180deg);

            -moz-transform: rotatez(180deg);

            -o-transform: rotatez(180deg);

            -ms-transform: rotatez(180deg);

            transform: rotatez(180deg);

	

}



.p4-2 a p{

	margin-top: -135px;

	font-size: 28px;

	color: #005bac;

	font-weight: bold;

	text-align: center!important;

	line-height: 45px;

}.p4-3 a p{

	margin-top: -135px;

	font-size: 28px;

	color: #005bac;

	font-weight: bold;

	text-align: center!important;

	line-height: 45px;

}.p4-4 a p{

	margin-top: -135px;

	font-size: 28px;

	color: #005bac;

	font-weight: bold;

	text-align: center!important;

	line-height: 45px;

}

.p4-2 {

    height: 185px;

	margin: 0 75px;

}

.p4-2 img{

    height: 185px;

}



.p4-3 {

    height: 185px;

    position: relative;margin: 0 75px;

}



.p4-3 img{

    height: 185px;

}



.p4-4 {

    height: 185px;

    width: 185px;margin: 0 75px;

}







.p4-4 .nr {

    height: 250px;

    background: #ffffff;

    padding-top: 60px;

    padding-left: 30px;

    padding-right: 30px;

    font-size: 14px;

    color: #929292;

    line-height: 28px;

}



.p4-5 .nr {

    height: 150px;

    background: #ffffff;

    padding-top: 50px;

    padding-left: 30px;

    padding-right: 30px;

    font-size: 14px;

    color: #929292;

    line-height: 30px;

}



.bt {

    width: 400px;

    height: 50px;

    background: rgba(255,255,255,0.9);

    display: block;

    position: absolute;

    bottom: -8px;

    z-index: 9;

    padding: 10px 20px;

    line-height: 24px;

    transition: all 1.5s;

}



a:hover .bt {

    width: 400px;

    height: 70px;

    background: rgba(90,90,90,0.9);    display: block;

    position: absolute;

    bottom: 0;

    z-index: 9;

    padding: 10px 20px;

    line-height: 24px;

}



.bt .tm {

    font-size: 16px;

    color: #58595b;

    transition: all 0.5s;

}

a:hover .bt .tm {

    font-size: 16px;

    color: #fff

}

a .bt .jianjie {

    font-size: 12px;

    color: #dcdcdc;

    opacity: 0;

    transition: all 0.5s;

}



a:hover .bt .jianjie {

    font-size: 12px;

    color: #dcdcdc;

    opacity: 1;

}



a.arr_l {

    width: 44px;

    height: 44px;

    display: block;

    float: left;

    background: url(../img/arr.jpg) no-repeat;

    transition: all .5s;

}



a.arr_r {

    margin-left: 10px;

    width: 44px;

    height: 44px;

    display: block;

    float: left;

    background: url(../img/arr02.jpg) no-repeat;

    transition: all .5s;

}



a.arr_l:hover,

a.arr_r:hover {

    background-position: 0 -44px;

}







.p4-b {

    position: absolute;

    text-align: center;

    width: 39px;

    height: 20px;

    left: 50%;

bottom: 15vh;

    opacity: 0;

    margin-left: -20px;

    transition: all 1.5s;

}



.active .p4-b {

    position: absolute;

    bottom: 10vh;

    opacity: 1;

    transition-delay: 2s;

}







.p4-0-0 {

    background: #000;

    width: 0;

    height: 100%;

    float: right;

    transition: all 1.5s;

}



.active .p4-0-0 {

    width: 50%;

    transition-delay: 0s;

}



.p4-0 {

    position: absolute;

    text-align: center;

    width: 0;

    height: 100%;

    top: 0px;

    background: #000 url(../img/p4r.jpg) no-repeat 50% 50%;

    opacity: .0;

    right: 0px;

    transition: all 1.5s;

}



.active .p4-0 {

    position: absolute;

    right: 0px;

    width: 50%;

    opacity: .15;

    transition-delay: 0s;

}



.active .p4-0:hover {

    opacity: .25;

    cursor: pointer;

}



.p4-1 a span.newst {

    font-size: 16px;

    padding: 20px 0 10px 0;

    color: #bfa69a;

    display: block;

    transition: all 1.5s;

}



.p4-1 a span.newsn {

    font-size: 12px;

    color: #6f615a;

    display: block;

    transition: all 1.5s;

}







.p4-1 a:hover span.newst {

    color: #e5e0da;

    display: block

}



.p4-1 a:hover span.newsn {

    font-size: 12px;

    color: #6f615a;

    display: block

}





.section05 {

    background: #ffffff;

    transition: all 1.5s;

}



.section05.active {

    background: #ffffff;

    transition-delay: 0s;

}





.p5-t {

    position: absolute;

    width: 282px;

    height: 81px;

    margin-left: -141px;

    top: 8vh;

    left: 50%;

    opacity: 0;

    text-align: center;

    transition: all 1.5s;

}





.active .p5-t {

    position: absolute;

    top: 13vh;

    opacity: 1;

    transition-delay: 1s;

}

.p5-t h1{ font-size: 26px; font-family: 'Microsoft Yahei'; text-align: center; color: #58595b}

.p5-t span{font-size: 12px;/* font-family: arial; */text-align: center;text-transform : uppercase;color: #8d8d8d;}

.p5-1 {

    position: absolute;

    text-align: center;

    width: 1200px;

    margin-left: -600px;

    top: 36vh;

    left: 50%;

    height:  370px;

    opacity: 0;

    transition: all 1.5s;

    z-index: 1;

}



.active .p5-1 {

    position: absolute;

    top: 31vh;

    opacity: 1;

    transition-delay: 2s;

}



.p5-b {

    position: absolute;

    text-align: center;

    width: 39px;

    height: 20px;

    left: 50%;

bottom: 15vh;

    opacity: 0;

    margin-left: -20px;

    transition: all 1.5s;

}



.active .p5-b {

    position: absolute;

    bottom: 10vh;

    opacity: 1;

    transition-delay: 2.5s;

}





.p5-1 a:hover {}



.p5-2 {

    position: absolute;

    text-align: center;

    width: 20vh;

    height: 41px;

    margin-left: -150px;

    top: 170px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

    z-index: 1;

}



.active .p5-2 {

    position: absolute;

    top: 25vh;

    opacity: 1;

    transition-delay: 1.5s;

}



.p5-3 {

    position: absolute;

    text-align: center;

    width: 373px;

    height: 113px;

    margin-left: -186px;

    top: 230px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

    z-index: 1;

}



.active .p5-3 {

    position: absolute;

    top: 280px;

    opacity: 1;

    transition-delay: 2s;

}





.p5-4 {

    position: absolute;

    text-align: center;

    width: 615px;

    height: 366px;

    margin-left: -650px;

    top: 450px;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

    z-index: 1;

}



.active .p5-4 {

    position: absolute;

    margin-left: -600px;

    opacity: 1;

    transition-delay: 2.5s;

}



.p5-5 {

    position: absolute;

    text-align: center;

    width: 977px;

    height: 626px;

    margin-left: -102px;

    top: 405px;

    left: 50%;

    z-index: 0;

    opacity: 0;

    transition: all 1.5s;

}



.active .p5-5 {

    position: absolute;

    margin-left: -152px;

    opacity: 1;

    transition-delay: 3s;

}



.section05 {

		 background: url(../img/b6.png) no-repeat center;

   background-size: 2880px 1620px;

    transition: all 1.5s;

}



.section05.active {

		 background: url(../img/b6.png) no-repeat center;

   background-size: 1920px 1080px;

    transition-delay: 0s;

}



.section06 {

		 background: url(../img/b5.png) no-repeat center;

   background-size: 2880px 1620px;

    transition: all 1.5s;

}



.section06.active {

		 background: url(../img/b5.png) no-repeat center;

   background-size: 1920px 1080px;

    transition-delay: 0s;

}







.p6bg {

    position: absolute;

    width: 100%;

    height: 30vh;

    /* margin-left: -960px; */

    bottom: -100px;

    background: #045a93;

    /* left: 50%; */

    opacity: 0;

    text-align: left;

    transition: all 0s;

}





.active .p6bg {

    position: absolute;

    bottom: 0;

    opacity: 1;

    transition-delay: 0s;

}

.p6-t {

    position: absolute;

    width: 282px;

    height: 81px;

    margin-left: -141px;

    top: 13vh;

    left: 50%;

    opacity: 0;

    transition: all 1.5s;

}





.active .p6-t {

    position: absolute;

    top: 18vh;

    opacity: 1;

    transition-delay: 1s;

}

.p6-t h1{ font-size: 26px; font-family:  'Microsoft Yahei'; text-align: center; color: #58595b}

.p6-t span{font-size: 12px;/* font-family: arial; */text-align: center;text-transform : uppercase;color: #8d8d8d;}



.p6-zi {

    position: absolute;

    width: 1200px;

    height: 30px;

    margin-left: -600px;

    top: 27vh;

    left: 50%;

    opacity: 0;

    text-align: left;

    transition: all 1.5s;

    text-align: center;

}





.active .p6-zi {

    position: absolute;

    top: 32vh;

    opacity: 1;

    transition-delay: 1.5s;

}

 .p6-zi a img{ opacity:0.75; transition:all 1s;}

.p6-zi a:hover img{ opacity:1; }

 .p6-1 {

    position: absolute;

    width: 1200px;

    height: 30px;

    margin-left: -600px;

    top: 15%;

    left: 50%;

    opacity: 0;

    text-align: left;

    transition: all 1.5s;

    text-align: center;

}





.active .p6-1 {

    position: absolute;

    top: 0%;

    opacity: 1;

	margin-top: -50px;

    transition-delay: 1.5s;

}



.p6-1 li {

    width: 230px;

    float: left;

    height: 160px;

}



.p6-1 li:nth-child(1) {

    width: 399px;

    float: left;

  

}



.p6-1 li:nth-child(2) {

    width: 550px;

    float: left;

	margin-top: 30px;

  

}



.p6-1 li h1 {

    font-size: 18px;

    color: #e5e0da

}



.p6-1 li a {

    font-size: 14px;

    color: #aaa;

    transition: all 1.5s;

}



.p6-1 li a:hover {

    font-size: 14px;

    color: #fff

}







.p6-2 {

    position: absolute;

    width: 300px;

    height: 30px;

    margin-left: -150px;

    top: 400px;

    left: 50%;

    opacity: 0;

    text-align: left;

    transition: all 1.5s;

    text-align: center

}





.active .p6-2 {

    position: absolute;

    top: 450px;

    opacity: 1;

    transition-delay: 2.5s;

}



.p6-2 li {

    width: 150px;

    float: left;

    height: 160px;

}



.p6-1 li h1 {font-family:  'Quicksand','Microsoft Yahei';

    font-size: 18px;

    color: #666;text-align:left;

    line-height: 36px !important;

}



.p6-1 li h1 a,.p6-1 li h1 a:hover {

    font-size: 18px;

    color: #fff;

    line-height: 36px !important;

}



.p5-6 {

    position: absolute;

    text-align: center;

    width: 100%;

    height: 40px;

    

    line-height: 40px;

    transition: all 1.5s;

    font-size: 16px;

    color: #666666;

    background: #fff;

}





@media (max-width:1200px) {

	.p6-1 li:nth-child(3){

		display: none;

	}.active .p6-1{

		width: 80%;

		margin-left: 10%;

		left: 0;

		margin-top: -80px;

	}

	.p6-1 li:nth-child(2){

		margin-top: 0;

	}

}



@media (max-width:1000px) {

	

	

}



@media (max-width:749px) {

	

	.p6bg{

		height: 40vh;

	}.active .p6-1{

		

		margin-top: 0px;

	}

}







@media (max-width:700px) {

	

	.p5-6{

		height: 50px;line-height: 25px;

	}

	.p5-6 img{

		top:4.5px!important; 

	}

}

.p5-6 a {

    font-size: 12px;

    color: #999999;

}



.active .p5-6 {

    position: absolute;

    bottom: 0px;

    transition-delay: 3s;

}





#div1-bot {

    z-index: 999;

    position: fixed;

    width: 182px;

    height: 100%;

    top: 190px;

    right: -182px;

    transition: 1s;

}



#div1-top {

    z-index: 2;

    position: fixed;

    background-color: #ccc;

    width: 100%;

    height: 100%;

    top: -1100px;

}



#div2 {

    position: fixed;

    background-color: #ccc;

    width: 700px;

    height: 100%;

    right: -700px;

}







.open-bot {

    z-index: 1;

    position: fixed;

    text-indent: -9999px;

    width: 40px;

    display: block;

    background: rgba(90,90,90,0.6) url(../img/mtsdh03.png) no-repeat;

    height: 40px;

    top: 30px;

    background-size: cover;

    right: 60px;

    transition: all 1.5s;

    /* margin-left: -18px; */

}



.open-bot:hover {

    background:rgba(90,90,90,0.8) url(../img/mtsdh03.png) no-repeat;

    transition: all 1.5s; background-size: cover;

}



.open-bot2 {

    z-index: 1;

    position: fixed;

    text-indent: -9999px;

    width: 50px;

    display: block;

    background:rgba(90,90,90,0.6) url(../img/mtsdh02.png) no-repeat;

    height: 50px;

    top: 30px;

    background-size: cover;

    right: 100px;

    transition: all 1.5s;

    /* margin-left: -18px; */

}



.open-bot2:hover {

    background:rgba(90,90,90,0.8)  url(../img/mtsdh02.png) no-repeat;

    transition: all 1.5s; background-size: cover;

}



.open-bot3 {

    z-index: 1;

    position: fixed;

    text-indent: -9999px;

    width: 50px;

    display: block;

    background:rgba(90,90,90,0.6) url(../img/mtsdh01.png) no-repeat;

    height: 50px;

    top: 30px;

    background-size: cover;

    right: 170px;

    transition: all 1.5s;

    /* margin-left: -18px; */

}



.open-bot3:hover {

    background: rgba(90,90,90,0.8)  url(../img/mtsdh01.png) no-repeat;

    transition: all 1.5s; background-size: cover;

}





.open-lt {

    z-index: 1;

    position: fixed;

    width: 34px;

    bottom: 20px;

    display: block;

    right: 2%;

}



.open-bot:hover {

    transition: 0.5s;

}



.close {

    z-index: 999;

    position: absolute;

    text-indent: -9999px;

    width: 47px;

    display: block;

    background: url(../img/close_btn.png) no-repeat center center;

    float: right;

    height: 19px;

    top: 50px;

    right: 5%;

    transition: 0.5s;

    transform: rotate(0deg);

}



.close2 {

    z-index: 999;

    position: absolute;

    text-indent: -9999px;

    width: 47px;

    display: block;

    background: url(../img/close_btn.png) no-repeat center center;

    float: right;

    height: 41px;

    top: 20px;

    right: -47px;

    transition: 0.5s;

    transform: rotate(0deg);

}



.close-top {

    z-index: 999;

    position: absolute;

    text-indent: -9999px;

    width: 47px;

    display: block;

    background: url(../img/close_btn.png) no-repeat center center;

    float: right;

    height: 41px;

    top: 20px;

    right: -47px;

    transition: 0.5s;

    transform: rotate(0deg);

}



.close:hover {

    transition: 0.5s;

    transform: rotate(180deg);

}



.close2:hover {

    transition: 0.5s;

    transform: rotate(180deg);

}



.close-top:hover {

    transition: 0.5s;

    transform: rotate(180deg);

}



.news_t_1 {

    width: 540px;

    text-align: left;

    margin: 0 auto;

    padding-top: 15%;

    padding-bottom: 5%;

}







.ryname {

    z-index: -1;

    position: absolute;

    text-align: center;

    line-height: 35px;

    text-transform: uppercase;

    width: 26px;

 

    height: 0;

    color: #fff;

    margin-left: -13px;

    font-size: 12px;

    overflow: hidden;

    top: 3px;

    left: 50%;

    transition: all 500ms;

}



.rypic-hover .rypic {

    opacity: 1

}



.ryname-hover .ryname {

    height: 26px;

    top: -36px

}



 



ul.fenlei {

 margin: 0 auto;

 /* left: 50%; */

 padding-top: 0px;

 position: absolute;

}

 ul.fenlei li.fl{

  padding:0 10px;

  height:35px;

  line-height:35px;

  float:left;

  border-radius:10px;

  position: relative;

  /* overflow:hidden; */

}

ul.fenlei li.fl.active a {

    width: 128px;

    height: 32px;

    line-height: 32px;

    display: block;

    background: #e5e0da ;

    color: #533f34;  border:1px solid #e5e0da;

    text-align: center;

}

ul.fenlei li.fl a:hover {

    width: 128px;

    height: 32px;

    line-height: 32px;

    display: block;

    background: #58595b ;

    color: #fff;  border:1px solid #58595b;

    text-align: center;

}

ul.fenlei li.fl a {

    width: 128px;

    border: 1px solid #e1e0e0;

    height: 32px;

    line-height: 32px;

    display: block;

    color: #58595b;

    text-align: center;

    transition: all 500ms;

    background: #fff;

    font-size: 14px;

}

 .music {

    z-index: 1;

    position: fixed;

    width: 34px;

    bottom: 198px;

    display: block;

    right: 2%;

    height: 30px;

    overflow:  hidden;

    text-align:center;

}

.music a{

 cursor:pointer;opacity:.6

}



@media (max-height:750px) and  (max-width:450px) {

	.active .p1-2{

		top:180px!important;

	}

	.nr2 {

    top: 13%;

}

	.active .p6-1 {

    position: absolute;

		top: 5%!important;}

	.p3-1 {

    position: absolute;

    top: 20vh!important;

}

}







@media (max-height:680px) and  (max-width:410px) {

	.active .p4-t {

    position: absolute;

		top: 20vh!important;}

	.p6-1 li h1 a {

    font-size: 18px;

  

		line-height: 30px !important;}



.p2-2 p {

		font-size: 16px!important;

	height: 55px!important;}

	

	.p2-1 p {

		font-size: 16px!important;

	height: 55px!important;}

	.p2-3 p {

		font-size: 16px!important;

	height: 55px!important;}

	.active .p2-2 {

    position: absolute;

    top: 140px!important;

}

	.active .p2-3 {

    position: absolute;

    top: 250px!important;

}

	.nr2{

		height: 380px;

	}

	.nr2 {

    top: 18%;

}.active .p6-1 {

    position: absolute;

		top: 0%!important;}

	.p6-1 li:nth-child(3) {

   margin-top: -10px;

}



	

	

}

@media (max-width:750px) {

	

	.p4-1

	

	{

		    margin-left: -285px;

		width: 570px;

	}



	.p4-2 img {

    height: 120px;

}.p4-2 a p {

    margin-top: -90px!important;

	font-size: 20px;

	line-height: 35px;

	    margin-top: -75px;

	}

		.p4-3 img {

    height: 120px;

}.p4-3 a p {

    margin-top: -90px!important;

	font-size: 20px;

	line-height: 35px;

	    margin-top: -75px;

	}

		.p4-4 img {

    height: 120px;

}.p4-4 a p {

    margin-top: -90px!important;

	font-size: 20px;

	line-height: 35px;

	    margin-top: -75px;

	}.p4-4 {

    height: 120px;

    width: 120px;

	}}





	.close8{

		right: 150px!important;

	}





.foot{

	height: 40px;

	background-color: #005bac;

}

.foot p{

	font-size: 16px;

	text-align: center!important;

	color: #fff;

	line-height: 40px;margin-left: -75px;

}

@media (max-width:900px) {

	.foot p{

		

		margin-left: -160px;

		

		

	}

}



@media (max-width:730px) {

	

	.foot p{

		

		margin-left: 0px;

		

		

	}

	.foot p a{

		margin-left: -72px!important;

		margin-top: 0!important;

	}

	.foot

	{

		height: 70px;

	}

	

}

@media (max-width:560px) {

	

	.foot p a{

		display: none;

	}

	.foot

	{

		height: 80px;

	}

}



@media (max-width:450px) {

	

	.p4-1

	

	{

		    margin-left: -180px!important;

		width: 360px!important;

	}

	

	.p4-2 img {

    height: 90px!important;

}.p4-2 a p {

    margin-top: -70px!important;

	font-size:16px!important;

	line-height: 25px!important;

	    margin-top: -67px!important;

	}

		.p4-3 img {

    height: 90px!important;

}.p4-3 a p {

    margin-top: -70px!important;

	font-size: 16px!important;

	line-height: 25px!important;

	    margin-top: -67px!important;

	}

		.p4-4 img {

    height: 90px!important;

}.p4-4 a p {

    margin-top: -70px!important;

	font-size: 16px!important;

	line-height: 25px!important;

	    margin-top: -67px!important;

	}.p4-4 {

    height: 90px!important;

    width: 90px!important;

	}}



@media (max-width:1330px) {

	.p4-t {

    position: absolute;

    width: 75%;

    text-align: center;

		margin-left: 12.5%;}

}

@media (max-width:1105px) {

	.p4-t {

    position: absolute;

    width: 85%;

    text-align: center;

		margin-left: 7.5%;}

}





@media (max-width:970px) {

	.p4-1

	

	{

		    margin-left: -382.5px;

		width: 765px;

	}

	.active .p4-1 {

    position: absolute;

		top: 50vh;}

	.p4-1 {

    position: absolute;

		top: 55vh;}

	.p4-2 {

    

		margin: 0 35px;}

		.p4-3 {

    

		margin: 0 35px;}	

	.p4-4 {

    

		margin: 0 35px;}

}





@media (max-height:800px) {

	

	.p3-1 {

    position: absolute;

		top: 17vh;}

	.p2-0{

		top: 15%;

	}.nr2{

		top: 15%;

	}

	

}





@media (max-width:900px) {

	.p2-1{

		height: 133px;

	}	.p2-2{

		height: 130px;

	}

}







@media (max-width:550px) {

	.active .p4-1 {

    position: absolute;

		top: 55vh;  margin-left: -225px;

		width: 450px;}

	.p4-1 {

    position: absolute;

		top: 60vh;}

	.p4-2 {

   margin: 0 15px;

}.p4-3 {

   margin: 0 15px;

}.p4-4 {

   margin: 0 15px;

}



	.p4-1

	

	{

		    margin-left: -225px;

		width: 450px;

	}

	.p2-1 h4 {

	font-size: 22px;}.p2-1 p {

		font-size: 14px!important;}.p2-2 h4 {

	font-size: 22px;}.p2-2 p {

		font-size: 14px!important;}.p2-3 h4 {

	font-size: 22px;}.p2-3 p {

		font-size: 14px!important;}

}



@media (max-height:680px) and  (max-width:410px) {

	

	.p2-1{

		height: 103px;

	}	.p2-2{

		height: 100px;

	}

}

@media (max-width:400px){



	#fp-nav ul li .fp-tooltip.right{

		display: none!important;

	}

	

	

	}

@media (max-height:670px){

	.section02	.p1-1{

		top:85%!important;

	}

	

	

}

	



@media (max-height:570px){

	.p5-6{

		display: none;

		

		

	}

}

	

	

.dhl{

	height: 100px;

	width: 100%;

	background: url(../img/dhbj.png) center center no-repeat;

	position: fixed;

	z-index: 100;

}	

	



.btcp{

	margin: 0 auto;

	position: absolute;

	top:17%;

	left: 50%;

	margin-left: -175px;

}

.gy{

	width: 62.5%;

	margin: 0 auto;

	margin-top: -160px;

}

.gy p{

	font-size: 24px;color: #fff;

	line-height: 38px;

	text-align: center!important;

	

}

.wxqy{

	width: 18.23%;margin: 0 auto;

	position: relative;top:20%;

}



@media (max-width:1600px){

	

	.wxqy{

		width: 30%;

	}

	.gy{

		width: 75%;

	}

	.p4-t{

		width: 65%;

		margin-left: 17.5%;

	}

}

.y2{

	display: none;

}.y3{

	display: none;

}

@media (max-width:1200px){

	

	.p4-t{

		width: 85%;

		margin-left: 7.5%;

	}

	.box{

		width: 400px!important;

	}

	.y1{

		display: none;

	}

	.y2{

		display: block;

	}

	.section04 .container{

		width: 900px!important;

	}

	.box h3 img{

		width: 80%;

	}

}

@media (max-width:1000px){

	

	.wxqy{

		width: 50%;

	}

	.gy{

		width: 90%;

	}

	.gy p{

		font-size: 20px;

		line-height: 32px;

	}

}



@media (max-width:900px){

	

	.p4-t{

		width:90%;

		margin-left: 5%;

	}

	.box{

		width: 300px!important;

	}

	.y1{

		display: none;

	}

	.y2{

		display:none;

	}.y3{

		display:block;

	}

	.section04 .container{

		width: 700px!important;

	}

	.box h3 img{

		width: 80%;

		margin-top: 56px!important;

	}.p4-t h1{

		font-size: 25px;

	}

}



@media (max-width:700px){

	.demo-3 .box:nth-child(2){

		display: none;

	}.section04 .container{

		width: 300px!important;

		margin-top: 80px!important;

	}

	section{

		padding: 0!important;

	}.p4-t h1{

		font-size: 20px!important;

		line-height: 32px!important;

	}

	

}

@media (max-width:600px){

	

	.gy{

		    margin-top: -100px;

	}

	

	.wxqy{

		width: 85%;

	}

	

		.dhl{

		height: 90px!important;

	}

	

	

	.open-bot{

		top:25px;

	}

	.p1-1{right: 7%;}

	.p1-5{

		right: calc( 7% + 170px);

	}

	.wxqy .p1-1{

		margin-right: -30px!important;

	}.p4-t h1{

		font-size: 20px!important;

		line-height: 32px!important;

	}.section04 .container{

		

		margin-top: 150px!important;

	}

}

.xwzx{

	width: 62.5%;

	margin: 0 auto;

	margin-top: 100px;

}

.xw1{

	width: 45.83%;

	float: left;

}

.xw1 ul li{

	padding: 15px;

	margin-bottom: 20px;

}.xw1 ul li:hover{background-color: rgba(4,90,147,0.7);

   transition: 1s;

}

.xw1 ul li h4{

	font-size: 24px;

	color: #fff;

	font-weight: bold;

	text-align: left;

	line-height: 45px;	height: 45px;

	overflow: hidden;

}

.xw1 ul li p{

	font-size: 16px;

	color: #fff;

	font-weight:normal;

	text-align: left;

	line-height: 28px;

	height: 56px;

	overflow: hidden;

}





.xw2{

	width: 45.83%;

	float: right;

}

.xw2 ul li{

	padding: 15px;

	margin-bottom: 20px;

}.xw2 ul li:hover{background-color: rgba(4,90,147,0.7);

   transition: 1s;

}

.xw2 ul li h4{

	font-size: 24px;

	color: #fff;

	font-weight: bold;

	text-align: left;

	line-height: 45px;

	height: 45px;

	overflow: hidden;

}

.xw2 ul li p{

	font-size: 16px;

	color: #fff;

	font-weight:normal;

	text-align: left;

	line-height: 28px;

	height: 56px;

	overflow: hidden;

}

.btcp1{

	margin: 0 auto;

	position: absolute;

	top:17%;

	left: 50%;

	

}

.btcp2{

	margin: 0 auto;

	position: absolute;

	top:17%;

	left: 50%;

	

}

@media (max-width:1600px){

	

	.xwzx{

		width: 75%;}

	

}



@media (max-width:1450px){

	

	.xwzx{

		width:85%;}

	

}

@media (max-width:1200px){

	

	.xwzx{

		width: 90%;}

	

}





@media (max-width:900px){

	.xw1 ul li h4{

		font-size: 20px;

	}

	

	.xw2 ul li h4{

		font-size: 20px;

	}

	

}



@media (max-width:600px){

	.xw2{

		display: none;

	}

	.xw1{

		width: 100%;

	}

	.btcp1{

		margin-left: -170px!important;

	}

	.btcp1 img{

		width: 80%;

	}	.btcp2{

		margin-left: -165px!important;

	}

	.btcp2 img{

		width: 80%;

	}

}
@media (max-height:800px){

	.gy{
		margin-top: -80px;
	}
	.active .p1-0{
		top:270px;
	}
}

@media (max-height:740px){

	.gy p{

		margin-top: 70px;

	}.wxqy{

		top:15%;

	}

	.p6-1 li:nth-child(2){

		margin-top: -30px;

	}

	

}