@charset "utf-8";
@media screen and (min-width:769px){
  .menuBox .box{
    position: relative;
    width: 300px;
    margin-left: 44px;
  }
  .menuBox .box:nth-child(1){
    display: none;
  }
  .menuBox .box > a{
    display: block;
    font-size: 36px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    line-height: 2.5;
  }
  .menuBox .box:hover > a{
    text-decoration: underline;
    background: url("../images/arrow.png") right no-repeat;
  }
  .menuBox .box li{
    position: absolute;
    display: none;
    left: 100%;
    top: 10px;
    padding: 5px 40px;
  }
  .menuBox .box:hover li{
    display: block;
  }
  .menuBox .box li a{
    display: none;
    color: #FFF;
    font-size: 36px;
    white-space: nowrap;
    line-height: 1.6667;
  }
  .menuBox .box li a.a1{
    display: block;
  }
  .menuBox .box li a:hover{
    text-decoration: underline;
  }
  .list_news a{
    width: 23.5%;
    margin: 4% 0 0 2%;
  }
  .list_news a:nth-child(-n+4){
    margin-top: 0;
  }
  .list_news a:nth-child(4n+1){
    margin-left: 0;
    clear: both;
  }
  .projectBox .btn{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 35%;
    font-size: 0;
    z-index: 98;
    letter-spacing: -1px;
  }
  .projectBox .btn li{
    width: 64px;
    height: 64px;
    display: inline-block;
    vertical-align: top;
    letter-spacing: 0;
    margin-right: 5%;
  }
  .newsBox .box .swiper-slide:nth-child(2n) a div{
    margin-right: 45%;
  }
  .newsBox .box .swiper-slide:nth-child(2n) a div:last-child{
    display: none;
  }
  .newsBox .box .swiper-slide:nth-child(2n+1) a div{
    margin-left: 45%;
  }
  .newsBox .box .swiper-slide:nth-child(2n+1) a div:last-child{
    margin-top: -50px;
  }
  .newsBox .box .swiper-slide:nth-child(2n+1) a div:first-child{
    display: none;
  }
  .newsBox .box .swiper-slide:nth-child(2n+1) a > span{
    margin-top: 65px;
  }
  .homeBox .right ul li b{
    min-width: 210px;
    display: inline-block;
  }
}
@media screen and (max-width:768px){
  body,td,th,div,ul,li,a,font,a,dl,dd,dt{
    font-size: 16px;
    line-height: 1.8;
  }
  .wrapper{
    min-width: 320px;
    padding-top: 56px;
  }
  .view .wrapper{
    padding-top: 56px;
  }
  .header{
    position: fixed;
    left: 0;
    right: 0;
    height: 56px;
    background: #000;
    box-shadow:0 0 5px 2px rgba(0,0,0,.2);
  }
  #header{
    height: 56px;
  }
  #header .logo a img{
    height: 30px;
  }
  #header .em{
    top: 8px;
    text-indent: 30px;
    background-size: 22px;
  }
  #header .box{
    display: none;
  }
  .menuBox{
    top: 56px;
    background: #222;
    padding: 0!important;
    border-top: 1px solid #353434;
  }
  .menuBox .box{
    border-bottom: 1px solid #353434;
    position: relative;
  }
  .menuBox .box > a{
    font-size: 18px;
    display: block;
    color: #FFF;
    padding: 10px 6% 10px 10%;
    position:relative;
    text-transform: uppercase;
  }
  .menuBox .box > a:before{
    content:'';
    display:block;
    width:6px;
    height:6px;
    border: 1px solid #909090;
    border-radius:100%;
    position:absolute;
    left:5%;
    top:50%;
    margin:-4px 0 0 -3px;
  }
  .menuBox .box.on > a{
    background: #000;
  }
  .menuBox .box.on > a:before{
    background: #666;
    border-color: #666;
  }
  .menuBox .box li{
    display: none;
    margin-bottom:-1px;
  }
  .menuBox .box.on li{
    display: block;
  }
  .menuBox .box li a{
    display: block;
    position: relative;
    font-size: 16px;
    color: #888;
    line-height:20px;
    border-bottom: 1px solid #353434;
    padding: 15px 6% 15px calc(10% + 10px);
  }
  .menuBox .box li .a2{
    font-size:15px;
    padding-left:calc(14% + 10px);
  }
  .menuBox .box li .a3{
    font-size:15px;
    padding-left:calc(18% + 10px);
  }
  .menuBox .box li a:before{
    content:'';
    border-top:1px solid #909090;
    border-left:1px solid #909090;
    width:8px;
    height:8px;
    position:absolute;
    top:20px;
    margin-left:-22px;
    transform:rotate(135deg);
  }
  .menuBox .box li a.a2:before{
    top:24px;
    border-left:0;
    transform:rotate(0);
  }
  .menuBox .box li a.a3:before{
    top:24px;
    border-left:0;
    border-top:0;
    width:4px;
    height:4px;
    background:#353434;
    border-radius: 100%;
    margin-left:-15px;
  }
  .menuBox .box b{
    display: block;
    position: absolute;
    width:52px;
    height:40px;
    right:0;
    top:7px;
  }
  .menuBox .box b:after{
    content:'';
    border-top:2px solid #CCC;
    border-left:2px solid #CCC;
    width:10px;
    height:10px;
    position:absolute;
    left:15px;
    top:10px;
    transform:rotate(225deg);
  }
  .menuBox .box.on b:after{
    transform:rotate(45deg);
    top:18px;
  }
  #footer .info{
    float: none;
  }
  #footer .info font{
    font-size: 30px;
    margin-top: 3%;
  }
  #footer .share{
    float: none;
    margin-top: 4%;
  }
  #footer .share > ul{
    margin-top: 2%;
  }
  #footer .copyright{
    margin-top: 4%;
  }
  .type-name{
    font-size: 24px;
  }
  .officeTypeBox{
    padding: 4% 1.7%;
    display: none;
  }
  .index .officeTypeBox{
    display: block;
  }
  .officeTypeBox .box span{
    margin-left: 0;
    float: none;
    margin-top: 3%;
  }
  .officeTypeBox .box li{
    float: none;
    width: auto;
  }
  .officeTypeBox .box li a{
    margin-left: 10%;
  }
  .content{
    min-height:100px;
  }
  .location,
  .news_type_box{
    display: none;
  }
  .list_news a{
    width: 49%;
    margin: 4% 0 0 2%;
  }
  .list_news a:nth-child(-n+2){
    margin-top: 0;
  }
  .list_news a:nth-child(2n+1){
    margin-left: 0;
    clear: both;
  }
  .list_news a .ellipsis1{
    font-size: 16px;
    height: auto;
    line-height: 1.5;
    -webkit-line-clamp: 10;
  }
  .aboutBox ul{
    overflow-x: auto;
    white-space: nowrap;
  }
  .aboutBox ul li{
    display: inline-block;
    vertical-align: top;
    letter-spacing: 0;
    width: auto;
  }
  .aboutBox ul li:nth-child(2){
    margin: 0 8%;
  }
  .aboutBox ul li div{
    font-size: 40px;
  }
  .aboutBox ul li font{
    font-size: 16px;
  }
  .aboutBox1 .box{
    float: none;
    width: auto;
  }
  .aboutBox1 .box1{
    padding-bottom: 0;
  }
  .aboutBox1 .box1 > span,
  .aboutBox1 .box2 > span{
    margin: 0!important;
    font-size: 20px;
    line-height: 1.7;
  }
  .aboutBox1 .box2 > span{
    margin-top: 5%!important;
  }
  .aboutBox1 .box1 > div,
  .aboutBox1 .box2 > div{
    margin: 4% 0 0;
  }
  .aboutBox1 .box > div,
  .aboutBox1 .box > div *{
    font-size: 16px;
    line-height: 1.8;
  }
  .aboutBox1 .box .img1 li{
    margin-right: 0;
    margin-top: 4%;
  }
  .aboutBox1 .box .img1 li img{
    position: inherit;
    width: 100%;
  }
  .aboutBox1 .box .img2{
    display: none;
  }
  .aboutBox1 .box .img3{
    display: block;
    width: 100%;
    margin-top: 4%;
  }
  .aboutBox2 *{
    font-size: 16px;
  }
  .aboutBox2 > ul > span{
    font-size: 24px;
  }
  .officeBox .type{
    display: none;
  }
  .officeBox .box a{
    width: 49%;
    margin: 4% 0 0 2%;
  }
  .officeBox .box a:nth-child(-n+2){
    margin-top: 0;
  }
  .officeBox .box a span{
    font-size: 16px;
  }
  .detailed > h1{
    font-size: 20px;
    line-height: 1.4;
  }
  .sidebar{
    display: none;
  }
  .listBox1 .box{
    width: 49%;
    margin: 0 0 0 2%;
  }
  .listBox1 .box:nth-child(2n+1){
    margin-left: 0;
  }
  .listBox .box .list a ul > span{
    font-size: 16px;
  }
  .listBox .box .list a ul li{
    font-size: 14px;
  }
  .detailed .info{
    float: none;
    width: auto;
  }
  .detailed .listimg{
    float: none;
    width: auto;
    margin-top: 5%;
  }
  .detailed .info > h1{
    font-size: 24px;
  }
  .detailed .info > h2{
    margin-top: 5%;
  }
  .detailed .info2 li{
    font-size: 20px;
  }
  .detailed .info2 a{
    position: inherit;
    margin-top: 4%;
  }
  .detailed1 > .box .picBox{
    float: none;
    width: auto;
  }
  .detailed1 > .box .right{
    float: none;
    width: auto;
    margin-top: 4%;
  }
  .detailed1 > .box .right > h1{
    font-size: 20px;
  }
  .detailed1 > .box .right > .info{
    margin-top: 3%;
  }
  .detailed1 > .box .right > font{
    margin-top: 3%;
  }
  .detailed1 > .box .picBox .swiper2{
    display: none;
  }
  .homeBox .left{
    float: none;
    width: auto;
    text-align: center;
  }
  .homeBox .left div{
    font-size: 24px;
    text-align: center;
  }
  .homeBox .left a{
    margin-top: 4%;
  }
  .homeBox .right{
    float: none;
    width: auto;
    margin-top: 5%;
  }
  .homeBox .right ul{
    margin-left: 0;
    width: 50%;
    text-align: center;
  }
  .homeBox .right ul li{
    font-size: 36px;
    text-align: center;
  }
  .homeBox .right ul li b{
    font-size: 50px;
  }
  .officesBox .box a span{
    font-size: 16px;
  }
  .officesBox .box a p{
    font-size: 14px;
  }
  .projectBox .box > ul > img,
  .projectBox .arrow{
    width: 100%;
  }
  .projectBox .box .width{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0,0,0,.5);
  }
  .projectBox .box .width ul{
    top: 50%;
    left: 0;
    transform: translate(0,-50%);
    padding: 0 calc(6% + 36px);
  }
  .projectBox .box .width ul li{
    font-size: 24px;
    text-align: left;
    margin-top: 0;
  }
  .projectBox .box .width ul span{
    font-size: 16px;
    text-align: left;
  }
  .projectBox .btn li{
    width: 36px;
    height: 36px;
    position: absolute;
    top: 50%;
    margin-top: -15px;
    z-index: 98;
    opacity: .7;
  }
  .projectBox .btn li.prev{
    left: 2%;
  }
  .projectBox .btn li.next{
    right: 2%;
  }
  .newsBox .box{
    margin: 4% 0 0;
  }
  .newsBox .box a > span{
    font-size: 16px;
    line-height: 24px;
    height: 48px;
    margin-top: 3%;
  }
  .newsBox .box a > font{
    font-size: 14px;
  }
  .newsBox .btn,
  .newsBox .box .swiper-slide a div:last-child{
    display: none;
  }
}
@media screen and (min-width:541px) and (max-width:768px){
}
@media screen and (max-width:540px){
}