﻿/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
em,strong,th{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
input,textarea,select{font-size:100%;font-family:inherit;}
s{ text-decoration: none;}

@font-face {
    font-family: 'Neurial Grotesk';
    src: url('../font/NeurialGrotesk-Extrabold.woff2') format('woff2'),
        url('../font/NeurialGrotesk-Extrabold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Neurial Grotesk';
    src: url('../font/NeurialGrotesk-Medium.woff2') format('woff2'),
        url('../font/NeurialGrotesk-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Neurial Grotesk';
    src: url('../font/NeurialGrotesk-Bold.woff2') format('woff2'),
        url('../font/NeurialGrotesk-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Neurial Grotesk';
    src: url('../font/NeurialGrotesk-Regular.woff2') format('woff2'),
        url('../font/NeurialGrotesk-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Neurial Grotesk';
    src: url('../font/NeurialGrotesk-Light.woff2') format('woff2'),
        url('../font/NeurialGrotesk-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}



/* common */
body{    background: #111; font-size: 12px; font-family: "Neurial Grotesk", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif; -webkit-font-smoothing: antialiased;}
.cf{zoom:1;}
.cf:before,.cf:after{content:"";display:table;}
.cf:after{clear:both;}
.block{display:block;}
.left{float:left;}
.right{float:right;}
.fB{font-weight:bold;}
.bold{font-weight:bold;}
.txtc{ text-align: center;}
.psr{ position: relative;}
.psa{ position: absolute;}
.area{width:1170px;margin-left:auto;margin-right:auto;}.area p{color:#666}
a:link{color:#333;text-decoration:none;}
a:visited{ color: #333;}
a:hover{color:#333;}
a:active{color:#333;}
.area a{color:#333;}
input.btn{ border: none; cursor: pointer;}
input,textarea{ outline: none;}
/*input {   
    -webkit-appearance: none;
   -moz-appearance: none;
     -o-appearance: none;
        appearance: none;
}    */
select { display: block; width: 100%; height: 32px; padding: 6px 12px; font-size: 14px; line-height: 1.42857; color: #555555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 0px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; }
select:focus { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); }
select::-moz-placeholder { color: #999; opacity: 1; }
select:-ms-input-placeholder { color: #999; }
select::-webkit-input-placeholder { color: #999; }
select::-ms-expand { border: 0; background-color: transparent; }
select[disabled], select[readonly], fieldset[disabled] select { background-color: #eeeeee; opacity: 1; }
select[disabled], fieldset[disabled] select { cursor: not-allowed; }

.tre{-moz-transition: 0.3s;-o-transition: 0.3s;-webkit-transition: 0.3s;transition: 0.3s;}
::-webkit-input-placeholder {color: #777;}

/* site */
html,body{ overflow-x: hidden;}
.en{ font-family: "Neurial Grotesk";}
.header{ height: 72px; background: rgba(0,0,0,.6); position: absolute; left: 0; top: 0; width: 100%; z-index: 20;}
.header.noFix{ position: static;}
.header .logo{ display: block; width: 300px; height: 55px; background: url(../Images/logo@2x.png) no-repeat; background-size: 100% 100%;     margin-top: 9px; float: left;margin-left: 120px;}
.navMobile{ display: none;}
#toggle{ display: none;}
.header nav{ float: right; margin-top: 28px; height: 20px; overflow: hidden;}
.header nav a{ color: #fff; float: left; margin-left: 39px; position: relative; width: 66px; height: 40px;}
.header nav a.a1{ width: 40px;}
.header nav a.a2{ margin-left: 51px;}
.header nav a.a4{ margin-left: 42px;}
.header nav a.a5{ margin-left: 47px;}
.header nav a em{ position: absolute; top: 30px; width: 100%; font-size: 15px; left: 0; text-align: center; display: block; z-index: 2; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.header nav a span{ font-size: 15px; font-family: "Neurial Grotesk"; font-weight: 500; position: absolute; left: 0; top: 0; text-align: center; display: block; width: 100%; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.header nav a.a4 span{ width: 85px; left: -10px;}
.header nav a.a6 { width: 85px;}

.header nav a:hover em{ top: 0px;}
.header nav a:hover span{ top: -30px;}
.header nav a.cur:before,.header nav a:hover:before{ height: 7px; background: #78952E; content: ''; position: absolute; width: 100%; top: 11px; padding: 0 3px; left: -3px; display: block;}
.iBanner .slick-track,.iBanner .slick-list{ height: 100% !important;}
.iBanner .ibSlider .item{  width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover;}
.iBanner .txt{ position: absolute; top: 50%; margin-top: -10px;left: 50%; margin-left: -585px; z-index: 3;}
.iBanner .txt img{ display: block; width: 560px;}
.iBanner .txt p{ font-size: 24px; color: #fff; margin-top: 18px;}
.iBanner .txt p s{width: 6px; display: inline-block;}
.iBanner .slick-dots{ left: 50%; right: auto; width: 1170px; margin-right: 0; margin-left: -585px; bottom: 74px;}
.iBanner .slick-dots li { margin-right: 7px;}
.iBanner .slick-dots li button{ width: 13px; height: 13px; opacity: 1; background: url(../Images/dotoff@2x.png) no-repeat; background-size: 13px 13px; border-radius: 0;}
.iBanner .slick-dots li.slick-active button{ background-image: url(../Images/doton@2x.png);}
.iBanner .goDown{ display: block; width: 24px; height: 23px; background: url(../Images/arrdown@2x.png) no-repeat; background-size: 100%; background-size: cover; position: absolute; right: 50%; margin-right: -585px; bottom: 74px; z-index: 3;}

.iTitleC h2{ font-family: "Neurial Grotesk"; font-weight: 800; font-size: 40px; color: #6d993a; text-transform: uppercase; text-align: center; position: relative;}
.iTitleC h2:before{ position: absolute; display: block; content: ''; width: 313px; height: 1px; background: #82C41C; left: 50%; margin-left: -156px; bottom: -15px;}
.iTitleC h2:after{ display: block; content: ''; width: 18px; height: 16px; background: url(../Images/decarr@2x.png) no-repeat; background-size: 100%; position: absolute; left: 50%; margin-left: -9px; bottom: -23px;}
.iTitleC p{ width: 620px; font-size: 14px; line-height: 24px; color: #fff; margin: 0 auto; padding-top: 55px; text-align: center;}
.iWho{ padding-top: 80px; padding-bottom: 77px;}

.iSlider2{ height: 410px;}
.iSlider2 a{ display: block; width: 100%; height: 100%; position: relative; background-size: cover; background-position: center; background-repeat: no-repeat;}
.iSlider2 .slick-track,.iSlider2 .slick-list{ height: 100%;}
.iSlider2 .slick-list{ overflow: visible;}
.iSlider2.slick-initialized .slick-slide{ padding: 0 10px;}
.iSlider2 .slick-slide{ position: relative;}
.iSlider2 .slick-slide:before{ display: block; width: 100%; height: 100%; position: absolute; content: ''; background: #fff; opacity: .59; left: 0; top: 0; z-index: 3;}
.iSlider2 .slick-slide.slick-current:before{ display: none;}
.iSlider2 .slick-prev,.iSlider2 .slick-next{ width: 26px; height: 24px; background: url(../Images/arrleft@2x.png) no-repeat; background-size: 100%; left: -50px; margin-top: -12px;}
.iSlider2 .slick-next{ background-image: url(../Images/arrright@2x.png); right: -50px; left: auto;}
.iSlider2 a.item span{ display: none; height: 50px; background: rgba(0,0,0,.6); font-size: 18px; color: #fff; line-height: 50px; padding: 0 22px; position: absolute; right: 20px; bottom: 20px;}

.iSlider2 a.item span{ width: 100%; box-sizing: border-box; text-align: center; right: 0; bottom: 0;}
/*.iSlider2 .itemW:nth-child(2n) a.item span{ width: 100%; height: 100%; line-height: 410px; box-sizing: border-box; text-align: center; right: 0; bottom: 0;}*/

.iSlider2 .slick-slide.slick-current a.item:hover span{ display: block;}

.iWhat{ padding-top: 80px; padding-bottom: 77px;}
.iPortfolio {margin-bottom: 70px;}
.iPortfolio .item{ height: 205px; float: left; margin-bottom: 1px; width: 25%; position: relative; }
.iPortfolio .item div{ width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; background-color: #ddd; position: absolute; left: 0; top: 0; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.iPortfolio .item s{ display: block; width: 100%; height: 100%; background: #fff; opacity: .15; left: 0; top: 0; position: absolute; z-index: 3; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.iPortfolio .item.on s{ opacity: 0;}
.iPortfolio .item div.i2{
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;}
.iPortfolio .item.on div.i2{ opacity: 0;}
.iPortfolio .item:before{ display: block; width: 1px; height: 100%; background: #fff; content: ''; position: absolute; right: 0; top: 0; z-index: 2;}
.iPortfolio .item span{ display: none; background: rgba(0,0,0,.6); position: absolute; left: 0; height: 44px; line-height: 44px; width: 100%; text-align: center; bottom: 0; color: #fff; font-size: 14px;}
.iPortfolio .item:hover span{ display: block;}
.iPortfolio .item:nth-child(4n):before{ display: none;}

.awards{ padding-top: 85px; padding-bottom: 88px;background:#010101}
.awards img{ display: block; margin: 0 auto 3px auto;}
.awards img.forMobile{ display: none;}
.awards li{ float: left; width: 25%;}
.awards .l1 img{ width: 176px;}
.awards .l2 img{ width: 177px;}
.awards .l3 img{ width: 197px;}
.awards .l4 img{ width: 176px;}
.awards .info{font-family: "Neurial Grotesk"; text-align: center;}
.awards .info p{ font-size: 46px; font-weight: bold; color: #78952E;}
.awards .info span{ font-size: 14px; display: block; font-weight: 500; text-transform: uppercase; color: #939393; margin-top: 3px;}

.iTeam{ padding-top: 150px; padding-bottom: 170px; background-size: cover; background-repeat: no-repeat; background-position: center;}
.iTeam .iTitleC h2{ color: #6d993a;}
.iTeam .iTitleC h2:before{ background: #fff; opacity: .25;}
.iTeam .iTitleC h2:after{ background-image: url(../Images/arrdown2@2x.png);}
.iTeam .iTitleC p{ color: #fff;}

.iNews{ padding-top: 98px;}
.iNews ul.area{ width: 1266px; margin-top: 103px;}
.iNews li{ width: 404px; height: 257px; box-shadow: 3px 3px 22px 0 rgba(0,0,0,0.5); float: left; margin: 0 9px; position: relative;
}
.iNews .iTitleC a.iName{ font-size: 18px; line-height: 26px; color: #595757;padding: 55px 35px 0 38px; display: block;}
.iNews .iTitleC p{ font-size: 13px; line-height: 20px; color: #A5A5A5; text-align: left; width: auto; padding: 10px 35px 0 38px; margin-top: 10px;}
.iNews .iTitleC span{ font-size: 61px; color: #E7E7E7; font-family: "Neurial Grotesk"; font-weight: 300; position: absolute; left: 35px; top: -35px;}
.iNews .iTitleC a.iLink{ font-size: 12px; color: #78952E; padding-right: 22px; background: url(../Images/arrright2@2x.png) no-repeat right center; background-size: 12px auto; position: absolute; bottom: 34px; right: 38px;}

.iBrands{ padding-top: 70px; padding-bottom: 70px; text-align: center;}
.iBrands .brandItem{ display: inline-block; margin: 0 20px; position: relative; width: 227px; height: 80px;}
.iBrands .brandItem img{ width: 227px; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.iBrands .brandItem img.i2{ position: absolute; left: 0; top: 0; opacity: 0;}
.iBrands .brandItem.on img.i2{ opacity: 1;}
.iBrands .brandItem img.i1{
    position: relative;
    left: 0;
    top: 0;
    z-index: 2;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    opacity: .5;
}
.iBrands .brandItem.on img.i1{ opacity: 0;}

.foot{ background: #000; height: 260px;}
.foot nav.left{ padding-top: 77px;}
.foot nav.left ul{ float: left;font-size: 14px; margin-right: 54px;}
.foot nav.left li.h{  color: #fff;}
.foot nav.left li.h a{ color: #fff;}
.foot nav.left ul li{ line-height: 27px;}
.foot nav.left ul li a{ color: #fff;}
.foot .contactInfo{ font-size: 14px;color: #4E80AB; line-height: 20px; margin-top: 77px; padding-left: 42px;}
.foot .contactInfo a{ color: #4E80AB;}
.foot .contactInfo .p1{ color: #fff; margin-bottom: 6px;}
.foot .contactInfo .p1 a{ color: #fff;}
.foot .copyInfo .footLogo{ display: block; width: 149px; float: right; margin-top: 80px;}
.foot .footShare{ clear: both; float: right; margin-top: 34px;}
.foot .footShare .l1{ position: relative;}
.foot .footShare .l1 .qrCode{ display: none; position: absolute; left: -150px; bottom: 0px; width: 140px !important; height: 140px;}
.foot .footShare .l1 a:hover .qrCode{ display: block;}
.foot .footShare li{ float: left; margin-left: 10px;}
.foot .footShare a{ display: block; width: 38px; height: 38px; background: rgba(255,255,255,.07); line-height: 47px; text-align: center;}
.foot .footShare a img{ display: inline-block;}
.foot .footShare .l1 a img{ width: 19px;}
.foot .footShare .l2 a img{ width: 19px;}
.foot .footShare .l3 a img{ width: 18px;}
.foot .footShare .l4 a img{ width: 16px;}
.foot .footShare .l5 a img{ width: 8px;}
.foot .copyInfo p{ clear: both; float: right; color: #fff; opacity: .3; padding-top: 13px;}

.loading{ text-align: center; padding: 45px 0;}
.loading  span{ font-size: 14px; color: #78952E; margin-left: 6px;}
.lds-ring {
  display: inline-block;
  position: relative;
  width: 20px;
  height: 20px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 20px;
  height: 20px;
  margin: 5px;
  border: 3px solid #78952E;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #78952E transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.inBanner{ height: 390px; background-position: center bottom; background-repeat: no-repeat; background-size: cover; position: relative;}
.inbTitle{ color: #fff; text-align: center; position: absolute; width: 100%; top: 50%; margin-top: -39px;}
.inbTitle h2{ font-size: 22px;}
.inbTitle p{ font-size: 44px; font-family: "Neurial Grotesk"; font-weight: bold; text-transform: uppercase;}

.subMenu{ margin: 64px 0; height: 20px; overflow: hidden; text-align: center;}
.subMenu nav a{ color: #4A4A4A; margin-left: 33px; position: relative; width: 85px; height: 40px; display: inline-block;}
.subMenu nav a.a1{ width: 40px;}
.subMenucp nav a.a1{ width: 85px;}
.subMenu nav a em{ position: absolute; top: 30px; width: 100%; font-size: 16px; left: 0; text-align: center; display: block; z-index: 2; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s; color: #222;}
.subMenu nav a span{color: #fff; font-size: 16px; font-family: "Neurial Grotesk"; position: absolute; left: 0; top: 0; text-align: center; display: block; width: 100%; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.subMenu nav a:hover em{ top: 0px;color: #FFFFFF}
.subMenu nav a:hover span{ top: -30px;}
.subMenu nav a.cur:before,.subMenu nav a:hover:before{ height: 7px; background: #78952E; content: ''; position: absolute; width: 100%; top: 11px; padding: 0 3px; left: -3px; display: block;}

.header.deFix{ background: none; z-index: 7;}
.inDe{ height: 800px;}
.indeSlider{ height: 100%;}
.indeSlider .slick-list,.indeSlider .slick-track{ height: 100%;}
.indeSlider .item{ background-position: center; background-repeat: no-repeat; background-size: cover;}
.indeSlider .slick-prev,.indeSlider .slick-next{ width: 25px; height: 47px; left: 5%; background: url(../Images/arrbigleft@2x.png) no-repeat; background-size: 100% auto; opacity: .6;}
.indeSlider .slick-next{ background-image: url(../Images/arrbigright@2x.png); left: auto; right: 5%;}
.indeSlider button:hover{ opacity: 1;}
.inDe:before{ display: none; content: ''; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,73,135,.2); position: absolute; z-index: 5;}

.companyOffice{ padding-bottom: 120px;}
.offSlider .fakeImg{ background-size: cover; background-repeat: no-repeat; background-position: center; background-color: #eee;}
.offSlider .lImg{ width: 560px; height: 600px;}
.offSlider .rImgs{ width: 598px;}
.offSlider .rImgs .sTitle{ width: 306px; height: 290px; background: #004987; color: #fff; display: block;}
.offSlider .rImgs a.sTitle{ color: #fff;}
.offSlider .rImgs .firLine{ margin-bottom: 12px;}
.offSlider .rImgs .sTitle strong{ font-size: 36px; padding: 75px 0 0 34px; display: block;}
.offSlider .rImgs .sTitle span{font-size: 16px; line-height: 1.5; padding: 10px 20px 0 34px; display: block;}
.offSlider .rImgs .sContent{width: 280px; height: 290px;}
.offSlider .secImg1{ width: 366px; height: 298px;}
.offSlider .imgx{ width: 220px; height: 200px;}
.offSlider .slick-prev, .offSlider .slick-next{ width: 40px; height: 40px; top: auto; margin-top: 0; left: auto; right: 60px; bottom: 10px; border: 2px solid #ddd; border-radius: 9999px; background-size: 12px 12px; background-color: #fff;}
.offSlider .slick-prev{ right: 110px; background-image: url(../Images/ico_back@2x.png);}
.offSlider .slick-next{ background-image: url(../Images/ico_next@2x.png);}
.offSlider .slick-prev:hover, .offSlider .slick-next:hover{ background-color: #f8f8f8;}


.deDetails{ margin-top: 75px;}
.deDetails .side{ width: 300px;}
.deDetails .side h1{ font-size: 24px; color: #333; margin-bottom: 31px;}
.deDetails .side li{ margin-bottom: 19px;}
.deDetails .side li strong{ font-size: 14px; color: #78952E;}
.deDetails .side li p{ font-size: 16px; color: #666666; margin-top: 5px;}
.deDetails .cont{ width: 843px;}
.deDetails .cont img{max-width:100%}
.deDetails .cont .wrap{ max-height: auto; overflow: hidden;}
.deDetails .cont .wrap.on{ height: auto; max-height: none;}
.deDetails .cont .wrap p{ font-size: 16px; line-height: 30px; color: #666666; margin-bottom: 18px;}
.deDetails .cont a.toggle{ font-size: 14px; color: #78952E; float: right; padding-right: 16px; background: url(../Images/decarr@2x.png) no-repeat right center; background-size: 12px auto; margin-top: 15px;}
.deDetails .cont a.toggle.on{ background-image: url(../Images/decarr@2x2.png);}
.deDetails .footShare{ margin-top: 37px;}
.deDetails .footShare .qrCode{ display: none;}
.deDetails .footShare a{ border: 1px solid #ddd;}
.deDetails .footShare li{ float: left; margin-right: 10px;}
.deDetails .footShare a{ display: block; width: 34px; height: 34px; background: rgba(255,255,255,.07); line-height: 42px; text-align: center;}
.deDetails .bshare-custom a{ padding-left: 0;}
.deDetails .bshare-custom .bshare-weixin{ background: url(../Images/icowechat@2x2.png) no-repeat center; background-size: 19px auto;}
.deDetails .bshare-custom .bshare-sinaminiblog{ background: url(../Images/icoweibo@2x2.png) no-repeat center; background-size: 19px auto;}
.deDetails .bshare-custom .bshare-twitter{ background: url(../Images/icotwitter@2x2.png) no-repeat center; background-size: 18px auto;}
.deDetails .bshare-custom .bshare-douban{ background: url(../Images/icodou@2x2.png) no-repeat center; background-size: 16px auto;}
.deDetails .bshare-custom .bshare-facebook{ background: url(../Images/icofacebook@2x2.png) no-repeat center; background-size: 8px auto;}

.deDetails .bshare-custom a{display: block; width: 34px; height: 34px; background: rgba(255,255,255,.07); line-height: 42px; text-align: center; margin-right: 10px; float: left;     border: 1px solid #ddd;}

.deDetails .pagi{ padding: 90px 0;}
.pagi span{ font-size: 16px; color: #999; display: block; margin-bottom: 7px;}
.pagi strong{ font-size: 22px; color: #444;}
.pagi .prev{ padding-left: 36px; background: url(../Images/ico_back@2x.png) no-repeat 0 28px; background-size: 17px auto;}
.pagi .next{ text-align: right; padding-right: 36px; background: url(../Images/ico_next@2x.png) no-repeat right 28px; background-size: 17px auto;}

.companyMain img.left{ display: block; width: 560px;}
.companyMain .cont { width: 514px; margin-top: -10px;}
.companyMain .cont p{ font-size: 16px; line-height: 30px; color: #666666; margin-bottom: 18px; font-weight: 300;}
.companyMain .txts{ padding-top: 80px; padding-bottom: 90px;}
.companyMain .txts li{ width: 255px; float: left; margin-right: 47px;}
.companyMain .txts li:nth-child(4){ margin-right: 0;}
.companyMain .txts li h2{ font-size: 24px;}
.companyMain .txts li h2 em{ color: #78952E;}
.companyMain .txts li h2 span{ color: #C4C4C4; margin-left: 12px;}
.companyMain .txts li h2 s{ width: 7px; display: inline-block;}
.companyMain .txts li .p1{ font-size: 14px; line-height: 22px; color: #666; margin-top: 21px;}
.companyMain .txts li .p2{ font-size: 12px; line-height: 20px; color: #666; margin-top: 18px;}

.BizMain{ padding-bottom: 120px; padding-top: 20px;}
.BizMain .map.left{ display: block; width: 700px;}
.BizMain .map img{ display: block; width: 100%;}
.BizMain .cont{ width: 376px; padding-top: 120px;}
.BizMain .cont h2{ font-size: 22px; text-align: center; color: #78952E; margin-bottom: 25px;}
.BizMain .cont h2 em{ margin: 0 12px; position: relative;}
.BizMain .cont h2 em:before{ position: absolute; width: 7px; height: 7px; border-radius: 999px; background: #B2C9DB; content: ''; display: block; right: -21px; top: 9px;}
.BizMain .cont p{ font-size: 16px; line-height: 30px; color: #666;}
.BizMain .cont h2 em.last:before{ display: none;}

.des{ font-size: 16px; line-height: 30px; text-align: center; width: 753px; color: #666; margin: 0 auto 88px auto;}
.ptitem h2{ font-size: 26px; text-align: center; padding-bottom: 40px;}
.ptitem h2 em{ color: #78952E; position: relative;}
.ptitem h2 span{ color: #4A4A4A; font-family: "Neurial Grotesk"; font-weight: 300; margin-left: 3px; position: relative;}
.ptitem h2 em:before{ display: block; background: #78952E; width: 138px; content: ''; position: absolute; top: 13px; left: -158px; height: 1px;}
.ptitem h2 span:before{ display: block; background: #78952E; width: 138px; content: ''; position: absolute; top: 17px; right: -155px; height: 1px;}
.ptitem .brandItem{ display: inline-block; margin: 0 30px 24px 30px; position: relative; width: 227px; height: 80px;}
.ptitem .brandItem img{ width: 227px; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.ptitem .brandItem img.i2{ position: absolute; left: 0; top: 0; opacity: 0;}
.ptitem .brandItem.on img.i2{ opacity: 1;}
.ptitem .brandItem img.i1{
    position: relative;
    left: 0;
    top: 0;
    z-index: 2;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    opacity: .5;
}
.ptitem .brandItem.on img.i1{ opacity: 0;}
.ptitem1{margin-bottom: 100px;}

.ptitem .brands2{ text-align: center; padding-top: 30px;}
.ptitem .brands2 .brandItem{ width: auto; vertical-align: top; margin: 0 45px; padding-bottom: 200px;}
.ptitem .brands2 .brandItem img{  display: block; height: 84px; width: auto; margin-bottom: 25px; margin: 0 auto;}
.ptitem .brands2 .brandItem .txt{ text-align: center; display: block; position: absolute; padding-top: 20px; width: 200px;}
.ptitem .brands2 .brandItem .txt span{ font-size: 14px; color: #888; display: block;}
.ptitem .brands2 .brandItem .txt em{ color: #777; font-family: "Neurial Grotesk";}
.ptitem .brands2 .brandItem.i1{ width: 121px;}
.ptitem .brands2 .brandItem.i2{ width: 85px;}
.ptitem .brands2 .brandItem.i3{ width: 85px;}
.ptitem .brands2 .brandItem.i4{ width: 97px;}
.ptitem .brands2 .brandItem.i5{ width: 162px;}
.ptitem .brands2 .brandItem.i1 .txt{ left: -40px;}
.ptitem .brands2 .brandItem.i2 .txt{ left: -58px;}
.ptitem .brands2 .brandItem.i3 .txt{ left: -55px;}
.ptitem .brands2 .brandItem.i4 .txt{ left: -50px;}
.ptitem .brands2 .brandItem.i5 .txt{ left: -17px;}

.mapItem{ width: 1170px; height: 360px; border: 1px solid #D9D9D9; box-shadow: 2px 2px 8px 0 rgba(0,0,0,0.07); margin-top: 70px;}
.mapItem .baiduMap{ width: 726px; height: 100%; background: #eee;}
.mapItem .mapInfo{ width: 326px; margin-right: 42px; margin-top: 90px;}
.mapItem .mapInfo h2{ font-size: 22px; color: #004987; height: 27px; padding-left: 80px; background: url(../Images/logoblack@2x.png) no-repeat 0 center; background-size: 170px auto; line-height: 0.95; margin-bottom: 54px;}
.mapItem .mapInfo li{ font-size: 14px; line-height: 28px; color: #4A4A4A; padding-left: 24px;}
.mapItem .mapInfo li.l1{ background: url(../Images/contactico1@2x.png) no-repeat 0 7px; background-size: 17px auto;}
.mapItem .mapInfo li.l2{ background: url(../Images/contactico2@2x.png) no-repeat 0 7px; background-size: 17px auto;}
.mapItem .mapInfo li.l3{ background: url(../Images/contactico3@2x.png) no-repeat 0 7px; background-size: 17px auto;}
.mapItem .mapInfo li.l4{ background: url(../Images/contactico4@2x.png) no-repeat 0 7px; background-size: 17px auto; margin-top: 20px;}
/*a.showGallery{ border: 1px solid #78952e; color: #78952e; padding: 6px 13px; font-size: 14px; margin: 15px 0 0 0px; display: inline-block; }*/

.contactForm {
  width: 995px;
  margin: 85px auto 85px auto;
}
.contactForm br{display: none;}
  .contactForm h2 {
    font-size: 19px;
    color: #666;
    padding-bottom: 25px; }
    .contactForm h2 strong {
      font-size: 23px;
      text-transform: uppercase;
      font-family: montserratbold; }
  .contactForm label {
    z-index: 22;
    display: block;
    font-size: 16px;
    color: #666;
    padding-left: 10px;
    line-height: 44px;
    position: absolute;
    left: 0px; }
  .contactForm .formW .fl {
    width: 365px;
    margin-right: 10px; }
    .contactForm .formW .fl .item {
      border: 2px solid #e1e1e1;
      height: 44px;
      position: relative;
      margin-bottom: 12px; }
      .contactForm .formW .fl .item .txtIn {
        display: block;
        background: none;
        border: none;
        position: absolute;
        left: 112px;
        height: 44px;
        line-height: 44px;
        top: 0px;
        opacity: .6;
        width: 238px;
        font-size: 16px;
        color: #333; }
  .contactForm .formW .fr {
    width: 617px;
    float: left;
    position: relative; }
  .contactForm .formW .fr .tips{ margin: -161px 0 0 91px;}  
    .contactForm .formW .fr label {
      top: 2px; }
    .contactForm .formW .fr textarea {
      padding: 10px;
      font-size: 16px;
      line-height: 24px;
      border: 2px solid #e1e1e1;
      width: 593px;
      resize: none;
      height: 144px;
      text-indent: 150px;
      color: #666; }
  .contactForm .btns {
    margin-top: 4px; }
    .contactForm .btns .done {
      display: block;
      width: 140px;
      height: 43px;
      background: #004987;
      color: #fff;
      font-size: 18px;
      cursor: pointer;
      border: none;
      float: right; }
div.wpcf7-mail-sent-ok{ padding: 0;
    font-size: 14px;
    border: none;
    color: green;
    margin: 0;}      
span.wpcf7-not-valid-tip{ text-align: right; padding: 4px;}    
div.wpcf7-validation-errors{ border: none; color: #f00; font-size: 14px; margin: 0; padding: 0;}

.newsList{ margin-top: -70px; margin-bottom: 90px;}
.newsItem { position: relative; margin-top: 70px;}
.newsItem .iImg{ width: 706px; height: 316px; display: block; background-size: cover; background-position: center; background-repeat: no-repeat; float: left; position: relative; z-index: 2; background-color: #ddd;}
.newsItem .iTxt{ width: 464px; height: 255px; border: 1px solid #D9D9D9;
box-shadow: 0 2px 14px 0 rgba(0,0,0,0.09); position: absolute; right: 0; top: 34px; background: url(../Images/arrrnews@2x.png) no-repeat 380px 182px; background-size: 25px auto;}
.newsItem .iTxt strong{ display: block; padding: 33px 47px 0 45px; font-size: 20px; line-height: 30px;color: #fff}
.newsItem .iTxt span{ font-size: 13px; line-height: 20px; color: #A7A7A7; display: block; padding: 8px 46px 0 46px;}
.newsItem .iTxt em{ font-size: 16px; color: #78952E; position: absolute; bottom: 41px; left: 46px;}
.newsItem2 .iImg{ float: right;}
.newsItem2 .iTxt{ right: auto; left: 0;}

.newsDeBanner{ height: 364px; position: relative; overflow: hidden;}
.newsDeBanner .blur{ display: block; position: absolute; left: -10%; top: -10%; width: 120%; height: 120%; background-position: center; background-size: cover;
 -webkit-filter: blur(25px);
       -moz-filter: blur(10px);
        -ms-filter: blur(10px);    
            filter: blur(30px);}
.newsDeBanner .tTitle{ position: relative; color: #fff; top: 50%; margin-top: -40px;}
.newsDeBanner .tTitle h1{ font-size: 32px; line-height: 46px; width: 592px; float: left;}
.newsDeBanner .tTitle .right span{ font-size: 28px; font-family: "Neurial Grotesk"; font-weight: 300; display: block;}
.newsDeBanner .tTitle .right .share{ font-size: 14px; display: inline-block; color: #fff; padding-right: 5px; /*background: url(../Images/zhuanfa@2x.png) no-repeat right center; background-size: 15px auto;*/ text-align: right; margin-top: 13px; float: right;}
.newsDeBanner .tTitle .right .shareBox{ margin-top: 12px;}

.newsCont{ padding-top: 130px; padding-bottom: 130px;}
.newsCont .newsSlider{ width: 529px; display: none;}
.newsCont .newsSlider .item{ width: 100%;}
.newsCont .txtP{ width: 800px; margin: -10px auto 0 auto;}
.newsCont .txtP .cont p{ font-size: 16px; line-height: 30px; color: #666; margin-bottom: 18px;}
.newsCont .txtP img{ display: block; max-width: 100%; margin: 0 auto; height: auto;}
.newsCont .pagi{ margin-top: 60px;}
.newsCont .pagi strong{ font-size: 18px; line-height: 24px; width: 262px; display: block;}

.joinusBanner{ height: 390px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative;}
.joinusBanner .shadow{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #195B93; opacity: .5;}
.joinusBanner .tTitle{ position: relative; z-index: 2; color: #fff; text-align: center; padding-top: 148px;}
.joinusBanner .tTitle h1{ font-size: 44px; margin-bottom: 24px;}
.joinusBanner .tTitle p{ font-size: 16px; line-height: 30px; width: 660px; margin: 0 auto;}

.finding h2{ padding-top: 65px;}
.finding h2 em{ font-size: 32px; text-align: center; width: 235px; height: 56px; text-align: center; line-height: 56px; margin: 0 auto; display: block; background: #fff; position: relative; z-index: 2;}
.finding h2{ width: 952px; background: #fff; margin: 0 auto; position: relative;}
.finding h2:before{ width: 100%; height: 1px; background: #979797; opacity: 0.3; content: ''; position: absolute; left: 0; bottom: 27px;}
.finding ul{ width: 1200px; margin: 60px auto 120px auto;}
.finding li{ width: 374px; height: 370px; border: 1px solid #D9D9D9; box-shadow: 2px 2px 8px 0 rgba(0,0,0,0.07); float: left; margin: 0 12px 24px 12px;}
.finding li .wrap{ padding: 39px 35px 0 53px;}
.finding li h3{ font-size: 22px; margin-bottom: 22px;}
.finding li h3 span{ color: #78952E;}
.finding li .cont p{ font-size: 14px; line-height: 24px; position: relative;}
.finding li .cont p:before{ position: absolute; content: ''; width: 4px; height: 4px; background: #78952E; display: block; left: -12px; top: 10px;}

.conta{ height: 145px; background: #F5F5F5;}
.conta ul{ padding-top: 50px;}
.conta label{ font-size: 15px; padding-bottom: 6px; display: block; color: #4a4a4a;}
.conta li{ float: left; padding-left: 52px; position: relative;}
.conta .l3 img{ display: none;}
.conta .l3:hover img{    display: block;
    width: 130px;
    position: absolute;
    left: 45px;
    bottom: 63px;}
.conta p{ font-size: 18px; color: #4a4a4a;}
.conta p a{ color: #4a4a4a;}
.conta .l1{ background: url(../Images/icomail@2x.png) no-repeat 0 2px; background-size: 40px auto; margin-left: 187px;}
.conta .l2{ background: url(../Images/icotel@2x.png) no-repeat 0 2px; background-size: 40px auto; margin: 0 86px 0 79px;}
.conta .l3{ background: url(../Images/icowechat@2x3.png) no-repeat 0 2px; background-size: 40px auto;}


.pages{ clear: both; text-align: center; margin-bottom: 70px;}
.pages a,.pages span{ display: inline-block; height: 39px; line-height: 39px; font-size: 16px; color: #000; background: #e7e7e7; text-align: center; margin: 0 1px; padding: 0 15px;}
.pages a i{ font-size: 14px;}
.pages a:hover{ background: #78952e; color: #fff;}
.pages a.num{ width: 37px;}
.pages span.extend{ padding: 0 8px;}
.pages span.current{ background: #78952e; color: #fff;}
.pages a.prev,.pages a.next{ padding: 0 17px;}

.img_pc{}
.img_m{
display:none!important
}
@media only screen and (max-width: 800px){
.img_pc{display:none!important}
.img_m{
display:block!important
}
  body, html{ overflow-x: hidden;}
  .area{ width: auto;}
  .header{ position: fixed; width: 100%; height: 64px;}
  #toggle{ display: block; position: absolute; right: 13px; top: 9px; width: 44px; height: 44px;}
  #toggle img{ display: block; position: absolute; width: 18px; height: 16px; left: 50%; top: 50%; margin-left: -9px; margin-top: -8px;}
  #toggle img.t2{ opacity: 0;}
  .header nav{ display: none;}
  .header .logo{ position: absolute; left: 20px; width: 125px; height: 21px; margin-top: 21px;    margin-left: 0;}
  .navMobile{ display: block; float: none; position: fixed; height: auto; margin-top: 0; background: rgba(0,0,0,.85); width: 100%; left: 0; top: -270px; z-index: 10;transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
  .navMobile.on{ top: 64px;}
  .navMobile a{float: none; display: block; width: 100% !important; margin-left: 0 !important; height: 44px; line-height: 44px; border-bottom: 1px solid #333; color: #fff; text-align: center; font-size: 14px;}
  .navMobile a:before{ display: none !important;}
  .navMobile a span{ display: none;}
  .navMobile a em{ position: static;}
  .iBanner .txt{ left: 25px; margin-left: 0; right: 25px; width: auto; margin-top: -40px;}
  .iBanner .txt img{ width: 100%;}
  .iBanner .goDown{ margin-right: 0; right: 25px; bottom: 30px; width: 19px; height: 18px; background-size: 100%;}
  .iBanner .slick-dots{ margin-left: 0; left: 25px; bottom: 30px;}
  .iWho{ padding-top: 50px; padding-bottom: 60px;}
  .iTitleC h2{ font-size: 24px;}
  .iTitleC h2:after{ width: 16px; height: 14px; background-size: 100% 100%;}
  .iTitleC h2:before{display: none;}
  .iTitleC p{ width: auto; padding: 45px 20px 0 20px;}
  .iSlider2{ height: 200px;}
  .iWhat{ padding-top: 50px; padding-bottom: 70px;}
  .iSlider2 a.item span{ display: block !important; font-size: 14px; line-height: 38px !important; height: 38px !important; padding: 0 12px;}
  .iPortfolio .item{ width: 50%; height: 125px;}
  .iPortfolio .item span{ display: block !important; height: 32px; line-height: 32px; font-size: 12px;}
  .awards{ padding-top: 50px; padding-bottom: 30px;}
  .awards ul{ margin: 0 25px;}
  .awards img{ width: 100% !important;}
  .awards li{ width: 45%; margin-bottom: 30px;}
  .awards li.l2,.awards li.l4{ float: right;}
  .awards img.forPc{ display: none;}
  .awards img.forMobile{ display: block;}
  .awards .info p{ font-size: 25px;}
  .awards .info span{ margin-top: 0; font-weight: normal; font-size: 13px;}
  .iTeam{ padding-top: 50px; padding-bottom: 70px;}
  .iNews{ padding-top: 60px;}
  .iNews ul.area{ width: auto; margin-top: 60px; margin-left: 20px; margin-right: 20px;}
  .iNews li{ width: auto; float: none; height: auto; margin: 0 0 40px 0;}
  .iNews .iTitleC span{ font-size: 44px; top: -29px;}
  .iNews .iTitleC a.iName{ padding: 35px 15px 0 15px; font-size: 16px; line-height: 1.5;}
  .iNews .iTitleC p{ margin-top: 0; padding: 10px 15px 40px 15px;}
  .iNews .iTitleC a.iLink{ bottom: 15px; right: 20px;}
  .iBrands{ padding-top: 0; padding-bottom: 28px;}
  .iBrands .brandItem{ display: block; margin: 0 auto;}
  .foot .left{ float: none; overflow: hidden;}
  .foot nav.left{ padding-top: 35px}
  .foot{ height: auto; padding: 0 0 0 20px;}
  .foot nav.left ul{ margin-right: 40px;}
  .foot .contactInfo{ padding-left: 0; margin-top: 30px; font-size: 12px; line-height: 1.5;}
  .foot .contactInfo .p1{ margin-bottom: 0;}
  .foot .copyInfo{ float: none; padding-bottom: 20px;}
  .foot .copyInfo .footLogo{ float: none; display: none;}
  .foot .footShare{ float: none; margin-top: 15px;}
  .foot .footShare li{ margin-right: 10px; margin-left: 0;}
  .foot .copyInfo p{ float: none; font-size: 12px;}
  .inBanner{ height: 160px; margin-top: 64px;}
  .inbTitle{ margin-top: -26px;}
  .inbTitle h2{ font-size: 16px;}
  .inbTitle p{ font-size: 26px;}
  .subMenu{ margin: 15px 0; height: auto;}
  .subMenu nav a{ /*float: left;*/ margin-left: 15px; line-height: 40px; width: 64px;}
  .subMenu nav a em{ position: static; font-size: 14px;}
  .subMenu nav a.a1{ width: 64px !important;}
  .subMenu nav a span{ display: none;}
  .subMenu nav a.cur:before, .subMenu nav a:hover:before{ height: 1px; top: 33px;}
  .subMenu nav a.cur em{ color: #78952E;}
  .inDe{ height: 270px !important;}
  .indeSlider .slick-prev, .indeSlider .slick-next{ width: 17px; height: 33px; background-size: 100% 100%;}
  .inDe:before{ height: 270px !important;}
  .deDetails{ margin-top: 30px; padding: 0 20px;}
  .deDetails .side{ width: auto; float: none;}
  .deDetails .side h1{ margin-bottom: 20px;}
  .deDetails .side li{ margin-bottom: 12px; width: 50%; float: left; min-height: 40px;}
  .deDetails .side li strong{ font-size: 13px;}
  .deDetails .side li p{ font-size: 14px;}
  .deDetails ul{ overflow: hidden;}
  .deDetails .footShare{ clear: both; margin-top: 5px;}
  .deDetails .cont{ width: auto; float: none; padding: 0 ;}
  .deDetails .footShare li{ float: left; width: auto;}
  .deDetails .cont .wrap p{ font-size: 14px; line-height: 1.8;}
  .deDetails .pagi{ padding: 20px 0;}
  .pagi .prev,.pagi .next{ float: none;}
  .pagi span{ font-size: 12px;}
  .pagi strong{ font-size: 18px;}
  .pagi .prev{ background-position: 0 22px;}
  .pagi .next{ background-position: right 22px;}
  .header.noFix{ position: fixed;}
  .subMenuNews{ margin-top: 74px;}
  .newsList{ margin-top: 20px; margin-left: 20px; margin-right: 20px;}
  .newsItem{ margin-bottom: 30px; margin-top: 0;}
  .newsItem .iImg{ width: auto; height: 136px; float: none !important; background-color: #eee;}
  .newsItem .iTxt{ position: static; width: auto; height: auto; display: block; padding-bottom: 20px;}
  .newsItem{ margin-top: 10px;}
  .newsItem .iTxt strong{ padding: 16px 15px 0 15px; font-size: 16px; line-height: 1.5;}
  .newsItem .iTxt span{ padding: 12px 15px 12px 15px;}
  .newsItem .iTxt em{ position: static; margin: 20px 0 20px 15px; font-size: 13px;}
  .newsDeBanner{ background-color: #175990; margin-top: 64px; height: 264px;}
  .newsDeBanner .tTitle h1{font-size: 24px; line-height: 1.5; width: auto; float: none;}
  .newsDeBanner .tTitle .right span{ margin-top: 10px; font-size: 20px;}
  .newsDeBanner .tTitle .right .share{ display: none;}
  .newsDeBanner .tTitle{ padding: 0 20px; margin-top: -60px;}
  .newsDeBanner .tTitle .right{ float: none;}
  .newsCont{ padding-top: 30px; margin: 0 20px; padding-bottom: 40px;}
  .newsCont .newsSlider{ width: auto; float: none;}
  .newsCont .txtP{ float: none; margin: 30px 0 0 0; width: auto;}
  .companyMain{ padding: 0 20px;}
  .companyMain img.left{ width: 100%; float: none;}
  .companyMain .cont{ width: auto; margin-top: 20px;}
  .companyMain .txts{ padding-top: 40px; padding-bottom: 0;}
  .companyMain .txts li{ width: auto; float: none; margin-right: 0; margin-bottom: 60px;}
  .companyMain .txts li .p2{ font-size: 14px; line-height: 1.5; margin-top: 10px;}
  .partnerMain{ padding: 0 20px;}
  .des{ width: auto; margin-bottom: 58px;}
  .ptitem h2{ font-size: 20px; padding-bottom: 20px;}
  .ptitem .brandItem{ display: block; margin: 10px auto;}
  .ptitem1{ margin-bottom: 70px;}
  .ptitem .brands2 .brandItem{ margin: 0 auto; padding-bottom: 100px;}
  .BizMain{ margin: 0 15px; padding-bottom: 70px;}
  .BizMain .cont{ width: auto; padding-top: 50px;}
  .BizMain .map.left{ width: auto;}
  .BizMain .cont h2{ font-size: 18px;}
  .BizMain .cont h2 em:before{ top: 6px;}
  .BizMain .cont p{ font-size: 15px;line-height: 1.8; margin: 0 5px;}
  .joinusBanner{ margin-top: 64px; height: auto;}
  .joinusBanner .tTitle{ padding-top: 70px; padding-bottom: 70px;}
  .joinusBanner .tTitle h1{ font-size: 28px; margin-bottom: 12px;}
  .joinusBanner .tTitle p{ width: auto; font-size: 14px; line-height: 1.5; padding: 0 25px;}
  .finding h2{ width: auto; padding-top: 25px;}
  .finding h2:before{display: none;}
  .finding h2 em{ font-size: 24px; width: 155px;}
  .finding ul{ width: auto; margin: 15px 20px 30px 20px;}
  .finding li{ width: auto; margin: 0 0 20px 0; height: auto; padding-bottom: 40px;}
  .finding li .wrap{ padding: 39px 28px 0 37px;}
  .conta{ height: auto; padding: 0 20px;}
  .conta ul{ padding-top: 40px; padding-bottom: 20px;}
  .conta li{ float: none; margin-left: 0 !important; margin-bottom: 30px !important;}
  .conta .l3 img{ display: block; width: 140px; margin-top: 20px;}
  .mapItem{ box-shadow: none; height: auto; border: none; margin-top: 0;}
  .mapItem .baiduMap{ width: 100%; float: none;}
  .mapItem .mapInfo{ width: auto; margin:20px; float: none;}
  .mapItem .mapInfo h2{ margin-bottom: 43px;}
  .contactForm{ width: auto; margin-top: 30px; margin-bottom: 20px; margin-left: 20px; margin-right: 20px;}
  .contactForm h2{ line-height: 1.5;}
  .contactForm .formW{ height: auto;}
  .contactForm .formW .fl{ width: 100%; float: none;}
  .contactForm .formW .fr{ float: none; width: auto; clear: both;}
  .contactForm .formW .fr textarea{ width: -webkit-calc(100% - 20px)}
  .contactForm .formW .fr .tips{ margin-top: 10px; margin-left: 0;}
  .offSlider{ margin: 0 20px;}
  .offSlider .lImg{ width: auto;}
  .offSlider .left,.offSlider .right{ float: none;}
  .offSlider .rImgs .firLine{ margin-bottom: 0;}
  .offSlider .rImgs{ width: auto;}
  .offSlider .rImgs .sTitle{ width: auto; height: auto;}
  .offSlider .rImgs .sContent{ width: auto;}
  .offSlider .secImg1{ width: auto;}
  .offSlider .imgx{ width: auto;}
  .offSlider .rImgs .sContent,
  .offSlider .secImg1,
  .offSlider .imgx,
  .offSlider .lImg{ height: 260px;}
  .companyOffice{ padding-bottom: 60px;}
  .offSlider .item{ margin-bottom: 25px;}
  .offSlider .rImgs .sTitle { padding-bottom: 30px;}
  .offSlider .rImgs .sTitle h3{ padding-top: 25px;}
}

@media only screen and (max-width: 375px){
  .foot nav.left ul{ margin-right: 30px;}
}

@media only screen and (max-width: 320px){
  .foot nav.left ul{ margin-right: 15px;}
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
  
  /* Retina-specific stuff here */

}