@charset "utf-8";
/* CSS Document */
*{margin: 0px; padding: 0px;}
img{border: none;}
a{text-decoration: none; font-family: "Alibaba-PuHuiTi-Regular","宋体";}
ul,li{list-style:none; font-family: "Alibaba-PuHuiTi-Regular","宋体";}
input{outline: none; font-family: "Alibaba-PuHuiTi-Regular","宋体"; box-sizing: border-box; border:none;}
i,em{font-style: normal;}
body{font-family: "Alibaba-PuHuiTi-Regular","宋体"; box-sizing: border-box; overflow-x: hidden;}
.left{ display:inline; float:left;}
.right{ display:inline; float:right;}
.clear:after{ content:''; display:block; clear:both;}
.clear{ zoom:1;}
.box{ width:1200px; margin:0 auto;}
.s_wap{display: none;}
.wap_banner{display: none;}


@font-face {
    font-family: "Alibaba-PuHuiTi-Regular";
    src: url("fonts/Alibaba-PuHuiTi-Regular.woff2") format("woff2"),
        url("fonts/Alibaba-PuHuiTi-Regular.woff") format("woff"),
        url("fonts/Alibaba-PuHuiTi-Regular.ttf") format("truetype"),
        url("fonts/Alibaba-PuHuiTi-Regular.eot") format("embedded-opentype"),
        url("fonts/Alibaba-PuHuiTi-Regular.svg") format("svg"),
        url("fonts/Alibaba-PuHuiTi-Regular.otf") format("opentype");
}
@font-face {
    font-family: "Alibaba-PuHuiTi-Light";
    src: url("fonts/Alibaba-PuHuiTi-Light.woff2") format("woff2"),
        url("fonts/Alibaba-PuHuiTi-Light.woff") format("woff"),
        url("fonts/Alibaba-PuHuiTi-Light.ttf") format("truetype"),
        url("fonts/Alibaba-PuHuiTi-Light.eot") format("embedded-opentype"),
        url("fonts/Alibaba-PuHuiTi-Light.svg") format("svg"),
        url("fonts/Alibaba-PuHuiTi-Light.otf") format("opentype");
}
@font-face {
    font-family: "BebasNeue";
    src: url("fonts/BebasNeue.woff2") format("woff2"),
        url("fonts/BebasNeue.woff") format("woff"),
        url("fonts/BebasNeue.ttf") format("truetype"),
        url("fonts/BebasNeue.eot") format("embedded-opentype"),
        url("fonts/BebasNeue.svg") format("svg"),
        url("fonts/BebasNeue.otf") format("opentype");
}

header{width: 100%; height: 143px; background: url(../images/headbg.jpg) no-repeat center;
  background-size: cover;}
header .logo{margin-top: 14px;}
header .nav li{float: left; font-size: 22px; height: 143px; line-height: 143px; margin-left: 40px;
  border-bottom: 10px solid transparent; box-sizing: border-box; transition: .5s;}
header .nav li:hover{font-weight: bold;}
header .nav li a{color: #fff; display: block; width: 100%; height: 100%;}
.border{border-bottom: 10px solid #fff!important; font-weight: bold;}

.join{width: 100%; height: 522px; background: url(../images/join_bg.jpg) no-repeat center;
  background-size: cover; text-align: center;}
.join .join_tit{font-size: 48px; color: #fff; font-family: "Alibaba-PuHuiTi-Light";
  padding-top: 80px;}
.join .join_font{padding: 40px 0;}
.join .rexian{font-size: 30px; color: #fff; font-family: "Alibaba-PuHuiTi-Light";}
.join .rexian>span{font-family: "BebasNeue"; font-size: 45px;}
.join .gdgd{width: 146px; height: 47px; border: 2px solid #fff; font-size: 16px; color: #fff;
  line-height: 49px; text-align: center; display: block; margin:40px auto 0; transition: .5s;}
.join .gdgd:hover{background-color: #fff; color: #142b3a;}
.join>.box{position: relative;}
.join .ewm{position: absolute; right: 107px; top:350px;}
.join .saoyisao{font-size: 13px; color: #fff; position: absolute; top:455px; right: 85px;}
footer{width: 100%; height: 100px; background-color: #142b3a; font-size: 14px; color: #666666;
  line-height: 100px; text-align: center;}

@media screen and (max-width: 1440px){
    header{height: 100px;}
    header .nav li{height: 100px; line-height: 100px;}
    header .logo{height: 80px; margin-top: 10px;}
}

@media screen and (max-width: 1200px){
    .box{width: 900px;}
    .s_pc{display: none;}
    .s_wap{display: block;}
    .banner{margin-top: 60px;}
    .head_wap{width:100%; height: 60px; background-color: #fff; position: fixed; top:0; left: 0; z-index: 9;}
    .head_wap .logo_wap{height: 50px; margin-top: 5px;}
    /*汉堡菜单*/
    .three{margin-top: 18px;}
    /* ALL */
    .hamburger .line{
      width: 25px;
      height: 3px;
      background-color: #517947;
      display: block;
      margin: 4px auto;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }
    /* SIX */
    #hamburger-6.is-active{
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
      -webkit-transition-delay: 0.6s;
      -o-transition-delay: 0.6s;
      transition-delay: 0.6s;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg);
    }
    #hamburger-6.is-active .line:nth-child(2){
      width: 0px;
    }
    #hamburger-6.is-active .line:nth-child(1),
    #hamburger-6.is-active .line:nth-child(3){
      -webkit-transition-delay: 0.3s;
      -o-transition-delay: 0.3s;
      transition-delay: 0.3s;
    }
    #hamburger-6.is-active .line:nth-child(1){
      -webkit-transform: translateY(5px);
      -ms-transform: translateY(5px);
      -o-transform: translateY(5px);
      transform: translateY(5px);
    }
    #hamburger-6.is-active .line:nth-child(3){
      -webkit-transform: translateY(-9px) rotate(90deg);
      -ms-transform: translateY(-9px) rotate(90deg);
      -o-transform: translateY(-9px) rotate(90deg);
      transform: translateY(-9px) rotate(90deg);
    }
    
    .head_wap .nav_wap{width: 100%; height: 100%; background-color: rgba(0,0,0,.9); position: fixed; top:60px; 
        left: 0; z-index: 9; display: none;}
    .head_wap .nav_wap .ul_wap{background-color: #517947;}
    .head_wap .nav_wap .ul_wap>li>p{height: 40px; line-height: 40px; border-bottom: 1px solid rgba(255,255,255,.4);
        font-size: 18px; color: #fff; text-align: center;}
    .head_wap .nav_wap .ul_wap>li>p>a{color: #fff; display: block; width: 100%; height: 100%;}
    .head_wap .nav_wap .ul_wap>li:last-child p{border-bottom: none;}


    .join{height: 420px;}
    .join .join_tit{font-size: 40px; padding-top: 60px;}
    .join .join_font{width: 800px; padding: 30px 0;}
    .join .rexian{font-size: 28px;}
    .join .rexian>span{font-size: 40px;}
    .join .gdgd{width: 120px; height: 40px; line-height: 40px; border: 1px solid #fff;}
    .join .ewm{right: 0; width: 80px; top:293px;}
    .join .saoyisao{top:380px; right: -31px;}
   
}
@media screen and (max-width: 900px){
    .box{width: auto; padding: 0 3%;}
    .banner{display: none;}
    .wap_banner{display: block; margin-top: 50px!important;}
    .head_wap{height: 50px;}
    .head_wap .logo_wap{height: 34px; margin-top:8px;}
    .three{margin-top:13px;}
    .head_wap .nav_wap{top:50px;}
    .head_wap .nav_wap .ul_wap>li>p{height: 35px; line-height: 35px; font-size: 16px;}
    
    .join{height: 410px;}
    .join .join_tit{font-size: 20px; padding-top: 50px;}
    .join .join_font{width: 100%; padding: 20px 0;}
    .join .rexian{font-size: 18px;}
    .join .rexian>span{font-size: 25px;}
    .join .gdgd{width: 90px; height: 30px; line-height: 30px; font-size: 14px; margin: 30px auto 0;}
    .join .ewm{right: 50%; margin-right: -40px; top:275px;}
    .join .saoyisao{top:360px; right: 50%; margin-right: -70px;}
    footer{line-height: 1.2; height: auto; padding: 10px 0; font-size: 13px;}
}