@charset "utf-8";
body {
  color: #333;
  font: 14px "Microsoft Yahei";
}
body,
ul,
ol,
li,
div,
p,
h1,
h2,
h3,
h4,
h5,
h6,
dl,
dt,
dd,
img,
span,
input {
  margin: 0;
  padding: 0;
  list-style: none;
}
a {
  color: #333;
  text-decoration: none;
  font-family: "Microsoft Yahei";
}
a:focus {
  outline: 0;
}
img {
  border: none;
}
.vam {
  vertical-align: middle;
}
.clear {
  clear: both;
  height: 0;
  line-height: 0;
  font-size: 0;
}
p {
  word-spacing: 0;
  font-family: "Microsoft Yahei";
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Microsoft Yahei";
}
i,
em {
  font-style: normal;
}
.tr {
  text-align: right;
}
.tl {
  text-align: left;
}
.center {
  text-align: center;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.pa {
  position: absolute;
}
.pr {
  position: relative;
}
.clearfix:after {
  content: "";
  height: 0;
  clear: both;
  display: block;
  visibility: hidden;
}
.clearfix {
  zoom: 1;
}
.content {
  width: 1200px;
  margin: 0 auto;
}
.pic img,
.picl img,
.pics img {
  -webkit-transition: -webkit-transform 0.8s;
  -moz-transition: -moz-transform 0.8s;
  -o-transition: -o-transform 0.8s;
  transition: transform 0.8s;
}
.pic img:hover {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
.picl img:hover {
  -moz-transform: translate(0, 5px);
  -webkit-transform: translate(0, 5px);
  -ms-transform: translate(0, 5px);
  -o-transform: translate(0, 5px);
}
.pics img:hover {
  -moz-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
}
.white,
.whites {
  position: relative;
  overflow: hidden;
}
.white:after,
.whites:after {
  content: '';
  cursor: pointer;
  position: absolute;
  left: -100%;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  transform: skewx(-25deg);
}
.white:hover:after {
  left: 100%;
  -moz-transition: 1s;
  -o-transition: 1s;
  -webkit-transition: 1s;
  transition: 1s;
}
.whites:hover:after {
  left: 100%;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
body {
  min-width: 1200px;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  overflow-x: hidden;
}
i,
em {
  font-style: normal;
}
.content {
  width: 1200px;
  margin: 0 auto;
  font-family: "Microsoft Yahei";
}
input,
textarea,
option,
select {
  font-family: "Microsoft Yahei";
}
input::-webkit-input-placeholder {
  color: #999;
  font-family: "Microsoft Yahei";
  font-size: 14px;
  text-transform: capitalize;
}
input::-moz-placeholder {
  color: #999;
  font-family: "Microsoft Yahei";
  font-size: 14px;
  text-transform: capitalize;
}
input:-moz-placeholder {
  color: #999;
  font-family: "Microsoft Yahei";
  font-size: 14px;
  text-transform: capitalize;
}
input:-ms-input-placeholder {
  color: #999;
  font-family: "Microsoft Yahei";
  font-size: 14px;
  text-transform: capitalize;
}
@keyframes myfirst {
  0% {
    background-position: 0 bottom;
  }
  100% {
    background-position: 100% bottom;
  }
}
.line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.clear {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clearfix:after{content:"";height:0;clear:both;display:block;visibility:hidden;}
.clearfix{zoom:1;}
.content{ width:1200px; margin:0 auto;font-family: "Microsoft Yahei";}
.footer_xia p{ display:block!important;}


.tit{text-align: center;font-weight: normal;font-size: 0;line-height: 0;}
.tit img{ display: block;width: auto;height: 61px;margin: 0 auto; }





.yz{ padding-top: 78px;box-sizing: border-box;height: 645px;background: url(../images/yz_bg.jpg) no-repeat center;}
.yz dt{ float: right;width: 494px;height: 490px;display: block;overflow: hidden; }
.yz dt img{ display: block;width: 494px;height: 490px; }
.yz dd{ float: left;width: 600px; }
.yz dd h3{ display: block;font-size: 60px;font-weight: normal;line-height: 60px;color: #4a3c2b;padding: 92px 0 0;letter-spacing: 1.5px; } 
.yz dd h3 em{ display: block;font-size: 24px;color: #4a3c2b;line-height: 24px;padding-top: 24px;letter-spacing: 3px;  }
.yz dd p{ font-size: 18px;line-height: 40px;color: #4a3c2b;margin-top: 34px; }


.ds_con{margin-top: 56px!important; position:relative; }
.ds_con dl{ float: left;width: 1150px;height: 438px;background: url(../images/ds_bg.jpg) no-repeat center;float: left;margin-right: 50px;box-sizing: border-box; }
.ds_con dt{ float: left;width: 416px;height: 278px;display: block;overflow: hidden;padding: 80px 0 0 76px; }
.ds_con dt img{ display: block;width: 416px;height: 278px;transition: all 0.5s; }
.ds_con dl:hover img{transform: scale(1.05);}
.ds_con dd{ float: left;width: 640px;padding:0 50px 0 30px;box-sizing:border-box; }
.ds_con h3{ display: block;font-size: 14px;font-weight: normal;line-height: 14px;color: #666666;padding-top: 183px;text-align: center;} 
.ds_con h4{ display: block;font-size: 42px;color: #1b1b1b;line-height: 42px;padding-top: 24px;letter-spacing: 1px; font-weight: normal;text-align: center; }
.ds_s{margin-left: -1200px !important;}
.ds_con .tempWrap{overflow: visible !important;}

.bprev,.bnext{position: absolute;top:200px;width:38px ;height: 38px;z-index: 40;cursor: pointer;}
.bprev{left:-45px;background: url(../images/bprev.png) no-repeat center;}
.bnext{right:7px;background: url(../images/bnext.png) no-repeat center;}

.pro{margin-top: 100px;  }
.pro_con{ margin: 60px 7.3% 0; }
.pro_con li{ float: left;width: 31.6%;margin-right: 2.6%;margin-bottom: 2.6%;position: relative;background:#ebf5f6; }
.pro_con li:nth-child(3n){ margin-right: 0; }
.pro_con li i{ display: block;width: 100%; overflow: hidden;}
.pro_con li i>img{ display: block;width: 100%; transition: all 0.5s;}
.pro_con li:hover i>img{ transform: scale(1.05); }
.pro_con li div{display: none;position: absolute;left:0;top:0;padding: 0 40px;width: 100%;height: 100%;box-sizing: border-box;background:rgba(235,245,246,0.7);z-index:30; }
.pro_con li:hover i>img{opacity:0.75;}
.pro_con li div>img{ display: block;width: 100px;height: 100px;margin: 0 auto;padding-top: 40%; }
.pro_con li div p{ font-size: 18px;color: #4a3c2b;line-height: 36px;text-align: center;padding-top: 24px; }
.pro_con li span{ display: block;position: absolute;left:40px;font-size: 28px;line-height: 28px;color: #4a3c2b;top:40px;z-index:50; }
.pro_con li:hover div{ display: block; }




.ys{margin-top: 95px;}
.ys .con{margin-top: 50px;overflow:hidden;}
.ys dl{width:18.75%;float:left;overflow:hidden;background:#000;position:relative;line-height:0}
.ys dl dt{position:relative;width:100%;transition:all .25s linear}
.ys dl dt em{position:absolute;width:115px;height:278px;box-sizing:border-box;top:29%;left:36%;text-align:center;font-size:36px;-ms-writing-mode:vertical-rl;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;writing-mode:tb-rl;color:#fffefe;background:url(../images/ys_dd.png) no-repeat center;display:block;line-height:145px;margin:0 auto}
.ys dl dt img{opacity:.45}
.ys dl dd{position:absolute;transition:all .25s linear;overflow:hidden;opacity:0;transition-delay:.2s;right:12%;top:15%;}
.ys dl dd h3{font-size:48px;-ms-writing-mode:vertical-rl;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;writing-mode:tb-rl;color:#fff;line-height:100px;font-weight:400;float:right;word-wrap: break-word;height:330px;}
.ys dl dd p{color:#fff;line-height:36px;display:inline-block;padding:0 20px 0 0;margin-top:100px;font-size:16px;-ms-writing-mode:vertical-rl;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;writing-mode:tb-rl;border-right:1px solid rgba(255,255,255,.6);float:right;word-wrap: break-word;height:330px;}
.ys dl.cur,.ys dl:hover{width:62.5%}
.ys dl.cur dt img,.ys dl:hover dt img{opacity:1}
.ys dl.cur dt em,.ys dl:hover dt em{display:none}
.ys dl.cur dd,.ys dl:hover dd{display:block;height:100%;opacity:1;width:100%;}

.sh{ height: 1044px;padding-top: 86px;background: url(../images/sh_bg.jpg) no-repeat center;box-sizing: border-box; }
.sh_t{ margin-top: 50px;position: relative;height: 542px; }
.sh_t:after{ position: absolute;width: 1200px;height: 2px;background: #e3eef0;content: "";left:0;top:116px; }
.sh_t li{ float: left; width: 274px;margin-right:46px; }
.sh_t .shb{ display: block;float: left;width: 100px;margin:0 175px; margin-top: 68px;position: relative;z-index: 50;}
.sh_t li:last-child{ margin-right: 0; }
.sh_t li:last-child .shb{ margin-right: 0; }
.sh_t li:first-child{ margin-left: -34.66px; }
.sh_t li:first-child .shb{ margin-left: 0; }
.sh_t li:nth-child(2) .shb{ margin-left: 50px; }

.sh_t .shb>img{ display: block;width: 99px;height: 100px; }
.sh_t .shb>span{ color: #333333;line-height: 32px;display: inline-block;margin-top:28px;font-size: 24px;-ms-writing-mode: vertical-rl;-webkit-writing-mode: vertical-rl;writing-mode: vertical-rl;writing-mode: tb-rl;padding-left: 10px; }
.sh_t li:nth-child(3) .shb span,.sh_t li:nth-child(4) .shb span{ padding-left: 28px; }
.sh_t .shs{ display: none; }
.sh_t .shs i{ display: block;width: 274px;height: 240px;position:relative;}
.sh_t .shs i:after{ position:absolute;width: 274px;height: 240px;background: url(../images/sh_dd.png) no-repeat center;z-index: 50;left:0;top:0;content:"";}
.sh_t .shs i>img{ display: block;width: 213px;height: 213px;padding-left: 47px;padding-top: 13px; z-index: 30;position: relative; }
.sh_t .shs>span{ color: #333333;line-height: 32px;display: inline-block;margin-top:28px;font-size: 24px;-ms-writing-mode: vertical-rl;-webkit-writing-mode: vertical-rl;writing-mode: vertical-rl;writing-mode: tb-rl;padding-left: 120px; }

.sh_t li:nth-child(3) .shs span,.sh_t li:nth-child(4) .shs span{ padding-left: 142px; }
.sh_t li.cur .shb{display: none;  }
.sh_t li.cur .shs{display: block;  }
.sh_z{ display: block;font-size: 16px;color: #666666;line-height: 16px;text-align: center; }
.sh_con{ margin-top: 70px;padding: 0 54px; }
.sh_con h2{ display: block;font-size: 24px;font-weight: normal;color: #333333;height: 30px; text-align: center;font-family: 黑体;font-weight: bold;}
.sh_con li{ float: left; }
.sh_con li:nth-child(2n){ float: right;text-align: right }
.sh_con li em{ font-size: 24px;line-height: 24px;color: #4a3c2b;display: block; }
.sh_con li span{ font-size: 14px;line-height: 30px;color: #4a3c2b;display: block;padding-top: 18px; }
.sh_con li a{ display: block;width: 120px;height: 30px;line-height: 30px;border-radius: 5px;font-size: 14px;text-align:center;margin-top: 18px;background: #b0d6db; color: #fff;}
.sh_con li:nth-child(2n) a{ float: right; }


.news{ padding: 70px 0 100px;}
.news img{ display: block;width: auto;height: 60px;margin: 0 auto 50px; }
.news h3 a{font-size: 24px;color: #4a3c2b;line-height: 24px;padding: 0 0 20px;font-weight: normal;display: block;transition: all 0.3s;font-weight: bold;}
.news_l{ float: left;width: 852px;height: 460px;border-right: 1px solid #e7e7e7;padding-right: 50px; padding-left:41px;background: url(../images/news_line.png) no-repeat left top;box-sizing: border-box;}
.news_l dl{height: 205px;margin-bottom: 25px;  }
.news_l dt{float: left;width: 363px;height: 205px;display: block; overflow: hidden;}
.news_l dt img{width: 363px;height: 205px;display: block; transition: all 0.5s;}
.news_l dl:hover dt img{ display: block;transform: scale(1.05); }
.news_l dd{ width: 356px;float: right;height: 205px;}
.news_l h4 a{font-size: 16px;color: #4a3c2b;line-height: 16px;padding: 35px 0 16px;font-weight: normal;display: block;transition: all 0.3s;}
.news_l h4 a em{ float: right; }
.news_l p{font-size: 14px;color: #4a3c2b;line-height: 26px;}
.news_l .more{ font-size: 14px;color: #b0d6db;line-height: 14px;display: block; padding-top: 20px;}


.news_l li{ padding-left: 41px;background: url(../images/news_ic1.png) no-repeat 0 27px; }
.news_l li a{font-size: 16px;color: #4a3c2b;line-height: 66px;height:66px;font-weight: normal;display: block;transition: all 0.3s;border-bottom: 1px dashed #e7e7e7;}
.news_l li a em{ float: right; }
.news_r{ float: right;width: 297px;}
.news_r .tempWrap{ height: 440px!important; }
.news_r p img{ display: block;width: 397px;height: 170px;margin-top: 30px; }
.news_r ul li{ height: 120px;border-bottom: 1px dashed #e7e7e7;box-sizing: border-box;padding-left: 15px;background: url(../images/news_ic2.png) no-repeat 0 6px;margin-bottom: 42px;}
.news_r ul li a{font-size: 16px;color: #4a3c2b;line-height: 16px;padding: 0 0 20px;font-weight: normal;display: block;transition: all 0.3s; }
.news_r ul li em{font-size: 14px;color: #4a3c2b;line-height: 24px;display: block;}

.news_l h4 a:hover,.news_l li a:hover,.news_r ul li a:hover{ font-weight: bold; }





html {font-size: 10px;}
@media screen and (min-width:800px) {
    html {
        font-size:11px;
    }
}
@media screen and (min-width:1024px) {
    html {
        font-size:13px;
    }
}
@media screen and (min-width:1280px) {
    html {
        font-size:14px;
    }
}
@media screen and (min-width:1440px) {
    html {
        font-size:16px;
    }
}
@media screen and (min-width:1600px) {
    html {
        font-size:18px;
    }
}
@media screen and (min-width:1920px) {
    html {
        font-size:20px;
    }
}

@-webkit-keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown1 { -webkit-animation-name: fadeInDown1; animation-name: fadeInDown1 }
@-webkit-keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown2 { -webkit-animation-name: fadeInDown2; animation-name: fadeInDown2 }
@-webkit-keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft1 { -webkit-animation-name: fadeInLeft1; animation-name: fadeInLeft1 }
@-webkit-keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft2 { -webkit-animation-name: fadeInLeft2; animation-name: fadeInLeft2 }
@-webkit-keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 }
@-webkit-keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
@keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
.zoomLeft { -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
.zoomRight { -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
@-webkit-keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 }
@-webkit-keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2 }
@keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-moz-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-webkit-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-o-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}