@charset "UTF-8";
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
body {
  background: #000000;
  color: #FFFFFF;
  font-family: "Microsoft YaHei", Verdana, Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
td,
th,
caption {
  font-size: 14px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
  font-size: 100%;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
a {
  text-decoration: none;
  outline: none;
  color: #FFFFFF;
}
a:hover {
  text-decoration: none;
}
img {
  border: none;
}
ol,
ul,
li {
  list-style: none;
}
input,
textarea,
select,
button {
  font: 14px "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
table {
  border-collapse: collapse;
}
html {
  overflow-y: scroll;
}
article,
aside,
dialog,
footer,
header,
section,
footer,
nav,
figure,
menu {
  display: block;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.wrapper {
  width: 1200px;
  margin: 0 auto;
}
.gray_layer {
  width: 100%;
  height: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}
.header {
  width: 100%;
  height: 126px;
  min-width: 1200px;
  overflow: hidden;
  background-color: #fff;
}
.header .wrapper .company .to_company {
  display: block;
  height: 126px;
  width: 151px;
  text-indent: -9999em;
  background: url("../img/logo.png") no-repeat right center;
}
.header .wrapper .other_info {
  margin-right: 57px;
}
.header .wrapper .other_info .info_lists .info_list {
  margin-right: 10px;
}
.header .wrapper .other_info .info_lists .info_list a {
  position: relative;
  display: block;
  padding: 0 25px;
  font: 20px/126px "方正兰亭黑简体", "方正兰亭黑_GBK", "方正兰亭准黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  -webkit-transition: color 0.5s;
  -moz-transition: color 0.5s;
  -ms-transition: color 0.5s;
  -o-transition: color 0.5s;
  transition: color 0.5s;
  color: #868787;
}
.header .wrapper .other_info .info_lists .info_list a .vertical_line {
  position: absolute;
  left: 0;
  top: 82px;
  height: 2px;
  margin: 0 25px;
}
.header .wrapper .other_info .info_lists .info_list a .vertical_line .left_line {
  width: 50%;
  height: 100%;
}
.header .wrapper .other_info .info_lists .info_list a .vertical_line .right_line {
  width: 50%;
  height: 100%;
}
.header .wrapper .other_info .info_lists .info_list a .vertical_line .line {
  display: block;
  width: 0%;
  height: 100%;
  background-color: #595757;
}
.header .wrapper .other_info .info_lists .info_list a:hover {
  color: #595757;
}
.first_section {
  width: 100%;
  min-width: 1200px;
  height: 880px;
  overflow: hidden;
  background: url("../img/banner-bg.png") no-repeat center;
}
.first_section .wrapper {
  position: relative;
  height: 100%;
}
.first_section .wrapper > div {
  width: 1200px;
}
.first_section .wrapper .txt {
  position: absolute;
  top: 50%;
  left: 80px;
  margin-top: -143px;
  color: #FFFFFF;
}
.first_section .wrapper .txt .title {
  font: 30px "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
.first_section .wrapper .txt .title .index {
  margin-right: 22px;
  font-size: 66px;
  line-height: 66px;
}
.first_section .wrapper .txt .content {
  margin-top: 52px;
}
.first_section .wrapper .txt .content p {
  width: 500px;
  font-size: 14px;
  line-height: 24px;
}
.first_section .wrapper .txt .content p sub {
  padding: 0 2px;
}
.first_section .wrapper .txt .content .letter_spacing {
  padding: 10px 0;
  letter-spacing: 0.7px;
}
.second_section {
  width: 100%;
  min-width: 1200px;
  height: 533px;
}
.second_section .bg_pic {
  width: 100%;
  height: 100%;
  background: url("../img/second_bg.png") no-repeat center top;
}
.second_section .bg_pic .wrapper {
  position: relative;
  height: 100%;
}
.second_section .bg_pic .wrapper .title_area {
  position: absolute;
  right: 104px;
  top: -30px;
}
.second_section .bg_pic .wrapper .title_area .title {
  font: 30px "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
.second_section .bg_pic .wrapper .title_area .title .index {
  margin-right: 22px;
  font-size: 66px;
  line-height: 66px;
}
.second_section .bg_pic .wrapper .title_area .des {
  margin-top: 60px;
  font-family: "方正兰亭纤黑简体", "方正兰亭纤黑_GBK", "方正兰亭黑_GBK", "方正兰亭黑简体", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #868787;
}
.second_section .bg_pic .wrapper .content .pic_content {
  position: relative;
  width: 738px;
  height: 533px;
  top: 0;
  left: 252px;
}
.second_section .bg_pic .wrapper .content .pic_content .picture {
  position: absolute;
  width: 267px;
  height: 231px;
}
.second_section .bg_pic .wrapper .content .pic_content .pic1 {
  top: -59px;
  left: 315px;
  background: url("../img/201.png") no-repeat center;
}
.second_section .bg_pic .wrapper .content .pic_content .pic2 {
  top: 192px;
  left: 0;
  background: url("../img/202.png") no-repeat center;
}
.second_section .bg_pic .wrapper .content .pic_content .pic3 {
  top: 192px;
  left: 156px;
  background: url("../img/203.png") no-repeat center;
}
.second_section .bg_pic .wrapper .content .pic_content .pic4 {
  top: 192px;
  left: 315px;
  background: url("../img/204.png") no-repeat center;
}
.second_section .bg_pic .wrapper .content .pic_content .pic5 {
  top: 192px;
  right: 0;
  background: url("../img/205.png") no-repeat center;
}
.second_section .bg_pic .wrapper .content .pic_content .pic5 .plus_btn {
  position: absolute;
  opacity: 0.8;
  width: 0;
  height: 0;
  bottom: 0;
  right: 66px;
  border-left: 67px solid transparent;
  border-right: 67px solid transparent;
  border-top: 116px solid #595757;
  cursor: pointer;
}
.second_section .bg_pic .wrapper .content .pic_content .pic5 .plus_btn .plus_icon {
  position: absolute;
  top: -90px;
  left: 50%;
  margin-left: -20px;
  font-size: 55px;
  line-height: 30px;
}
.second_section .bg_pic .wrapper .content .pic_content .pic5 .plus_btn .click_area {
  position: absolute;
  width: 134px;
  height: 116px;
  top: -116px;
  left: -67px;
}
.second_section .bg_pic .wrapper .content .pic_content .pic6 {
  right: 0;
  bottom: -139px;
  background: url("../img/206.png") no-repeat center;
}
.third_section {
  width: 100%;
  min-width: 1200px;
  height: 2430px;
  overflow: hidden;
}
.third_section .wrapper {
  position: relative;
}
.third_section .wrapper .title_area {
  margin-left: 82px;
  padding-top: 122px;
}
.third_section .wrapper .title_area .title {
  font: 30px "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
.third_section .wrapper .title_area .title .index {
  margin-right: 22px;
  font-size: 66px;
  line-height: 66px;
}
.third_section .wrapper .title_area .icon_area {
  margin-top: 32px;
}
.third_section .wrapper .title_area .icon_area dl {
  width: 150px;
  text-align: center;
  cursor: pointer;
}
.third_section .wrapper .title_area .icon_area dl dt {
  width: 100%;
  height: 128px;
}
.third_section .wrapper .title_area .icon_area dl .icon1 {
  background: url("../img/icon1_before.png") no-repeat center;
}
.third_section .wrapper .title_area .icon_area dl .icon2 {
  background: url("../img/icon2_before.png") no-repeat center;
}
.third_section .wrapper .title_area .icon_area dl .icon3 {
  background: url("../img/icon3_before.png") no-repeat center;
}
.third_section .wrapper .title_area .icon_area dl dd {
  font-weight: 700;
  font-family: "方正兰亭中黑_GBK", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  font-size: 20px;
  line-height: 20px;
}
.third_section .wrapper .title_area .icon_area dl:hover .icon1 {
  background: url("../img/icon1_after.png") no-repeat center;
}
.third_section .wrapper .title_area .icon_area dl:hover .icon2 {
  background: url("../img/icon2_after.png") no-repeat center;
}
.third_section .wrapper .title_area .icon_area dl:hover .icon3 {
  background: url("../img/icon3_after.png") no-repeat center;
}
.third_section .wrapper .title_area .des {
  margin-top: 48px;
  width: 500px;
}
.third_section .wrapper .title_area .des p {
  letter-spacing: 0.3px;
  font-family: "方正兰亭纤黑简体", "方正兰亭纤黑_GBK", "方正兰亭黑_GBK", "方正兰亭黑简体", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #868787;
}
.third_section .wrapper .large_icon {
  position: absolute;
}
.third_section .wrapper .large_icon1 {
  top: 384px;
  right: -360px;
  width: 458px;
  height: 406px;
  background: url("../img/large_icon1.png") no-repeat center;
}
.third_section .wrapper .large_icon2 {
  width: 347px;
  height: 430px;
  top: 1317px;
  left: -360px;
  background: url("../img/large_icon2.png") no-repeat center;
}
.third_section .wrapper .large_icon3 {
  width: 410px;
  height: 471px;
  top: 1934px;
  right: -360px;
  background: url("../img/large_icon3.png") no-repeat center;
}
.third_section .wrapper .design_picture {
  position: absolute;
  width: 850px;
  height: 500px;
  font-size: 0;
  background: url("../img/design_pic1.jpg") no-repeat center;
}
.third_section .wrapper .design_picture img {
  position: absolute;
  top: 0;
  left: 0;
}
.third_section .wrapper .design_pic1 {
  top: 631px;
  left: -360px;
}
.third_section .wrapper .design_pic2 {
  top: 1280px;
  right: -360px;
  z-index: 5;
}
.third_section .wrapper .design_pic3 {
  left: -360px;
  top: 1930px;
}
.third_section .wrapper .small_title .title {
  position: relative;
  font-family: "方正兰亭中黑_GBK", "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  font-size: 24px;
  line-height: 122px;
}
.third_section .wrapper .small_title .title:before {
  position: absolute;
  content: '';
  height: 2px;
  width: 50px;
  left: 0;
  top: -2px;
  background-color: #868787;
}
.third_section .wrapper .small_title .des p {
  font-size: 14px;
  line-height: 24px;
  color: #868787;
}
.third_section .wrapper .small_title1 {
  margin-top: 248px;
  margin-left: 575px;
}
.third_section .wrapper .small_title1 .des {
  width: 446px;
}
.third_section .wrapper .small_title2 {
  margin-top: 462px;
  margin-left: 80px;
}
.third_section .wrapper .small_title2 .title {
  width: 500px;
}
.third_section .wrapper .small_title2 .des {
  width: 500px;
}
.third_section .wrapper .small_title2 .des p {
  letter-spacing: 1px;
}
.third_section .wrapper .small_title3 {
  margin-top: 421px;
  margin-left: 575px;
}
.third_section .wrapper .small_title3 .des {
  width: 440px;
}
.third_section .wrapper .small_title3 .des p {
  letter-spacing: 0.5px;
}
.fourth_section {
  position: relative;
  width: 100%;
  min-width: 1200px;
  height: 843px;
  overflow: hidden;
}
.fourth_section .wrapper {
  height: 100%;
}
.fourth_section .wrapper .title_area {
  margin-left: 945px;
  padding-top: 150px;
}
.fourth_section .wrapper .title_area .title {
  font: 30px "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
.fourth_section .wrapper .title_area .title .index {
  margin-right: 22px;
  font-size: 66px;
  line-height: 66px;
}
.fourth_section .wrapper .vertical_axios {
 /* position: relative;
  margin-top: 475px;*/
  position: absolute;
  bottom: 151px;
  left: 50%;
  margin-left: -600px;
  height: 4px;
  width: 1200px;
  background: #868787;
}
.fourth_section .wrapper .vertical_axios .move_obj {
  position: absolute;
  top: 0;
  left: 0;
  height: 4px;
  width: 150px;
  cursor: move;
  background: #fff;
}
.fourth_section .box {
  position: absolute;
  width: 100%;
  top: 274px;
  left: 0;
}
.fourth_section .box .turnOver {
  position: absolute;
  top: 0;
  left: 0;
}
.fourth_section .box .turnOver .turnOverObj {
  position: relative;
  height: 370px;
  width: 570px;
  margin-right: 20px;
  background-color: #000;
}
.fourth_section .box .turnOver .turnOverObj img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.fifth_section {
  width: 100%;
  min-width: 1200px;
  height: 500px;
  overflow: hidden;
}
.fifth_section .wrapper .map {
  position: relative;
  margin-left: 81px;
  width: 409px;
  height: 499px;
  overflow: hidden;
}
.fifth_section .wrapper .map img {
  width: 100%;
  height: 100%;
}
.fifth_section .wrapper .txt .title_area {
  margin-left: 120px;
}
.fifth_section .wrapper .txt .title_area .title {
  font: 30px "方正兰亭黑简体", "方正兰亭黑_GBK", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
}
.fifth_section .wrapper .txt .title_area .title .index {
  margin-right: 22px;
  font-size: 66px;
  line-height: 66px;
}
.fifth_section .wrapper .txt .usInfo {
  margin: 118px 0 0 155px;
}
.fifth_section .wrapper .txt .usInfo li {
  margin-bottom: 36px;
}
.fifth_section .wrapper .txt .usInfo li .left_icon {
  width: 45px;
  height: 45px;
  margin-right: 50px;
}
.fifth_section .wrapper .txt .usInfo li .home {
  background: url("../img/home.png") no-repeat center;
}
.fifth_section .wrapper .txt .usInfo li .phone {
  background: url("../img/other_two_icon.png") no-repeat center top;
}
.fifth_section .wrapper .txt .usInfo li .email {
  background: url("../img/other_two_icon.png") no-repeat center -80px;
}
.fifth_section .wrapper .txt .usInfo li .right_txt {
  font-size: 21px;
  line-height: 35px;
  font-style: italic;
  font-family: "方正兰亭中黑_GBK", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  letter-spacing: 0.5px;
  color: #808080;
}
.footer {
  height: 239px;
  width: 100%;
  min-width: 1200px;
  overflow: hidden;
}
.footer .wrapper {
  padding-top: 154px;
}
.footer .wrapper .company_name {
  margin-left: 82px;
  width: 129px;
  height: 17px;
  background: url("../img/company_name.jpg") no-repeat center;
}
.footer .wrapper .copyright {
  margin-left: 308px;
  font-family: "方正兰亭纤黑_GBK", "方正兰亭纤黑简体", "方正兰亭黑_GBK", "方正兰亭黑简体", "黑体", "Microsoft YaHei", Verdana, Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 28px;
  color: #808080;
}
.footer .wrapper .marktag {
  margin: 4px 0 0 215px;
  width: 222px;
  height: 17px;
  background: url("../img/marktag.jpg") no-repeat center;
}
.shawdow_layer {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.85);
}
.shawdow_layer .close_area {
  position: relative;
  width: 100%;
  height: 50%;
  left: 0;
  z-index: 38;
}
.shawdow_layer .close_area_upper {
  // top: -81px;
}
.shawdow_layer .close_area_close_lower {
  // bottom: -81px;
}
.shawdow_layer .show_box {
  position: absolute;
  width: 1038px;
  height: 771px;
  top: 50%;
  margin-top: -385px;
  left: 50%;
  margin-left: -519px;
  z-index: 39;
  overflow: hidden;
}
.shawdow_layer .show_box .show_ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 2000%;
  height: 100%;
  z-index: 10;
}
.shawdow_layer .show_box .show_ul .showObj {
  position: relative;
  width: 1038px;
  height: 771px;
  margin-right: 40px;
}
.shawdow_layer .show_box .show_ul .showObj .show_pic {
  position: absolute;
}
.shawdow_layer .show_box .show_ul .showObj .pic1 {
  width: 158px;
  height: 247px;
  top: 0;
  left: 0;
}
.shawdow_layer .show_box .show_ul .showObj .pic2 {
  width: 246px;
  height: 247px;
  left: 176px;
  top: 0;
}
.shawdow_layer .show_box .show_ul .showObj .pic3 {
  width: 335px;
  height: 247px;
  top: 0;
  left: 439px;
}
.shawdow_layer .show_box .show_ul .showObj .pic4 {
  width: 247px;
  height: 509px;
  top: 0;
  right: 0;
}
.shawdow_layer .show_box .show_ul .showObj .pic5 {
  width: 158px;
  height: 245px;
  top: 264px;
  left: 0;
}
.shawdow_layer .show_box .show_ul .showObj .pic6 {
  width: 335px;
  height: 507px;
  top: 264px;
  left: 439px;
}
.shawdow_layer .show_box .show_ul .showObj .pic7 {
  width: 423px;
  height: 246px;
  left: 0;
  bottom: 0;
}
.shawdow_layer .show_box .show_ul .showObj .pic8 {
  width: 248px;
  height: 246px;
  right: 0;
  bottom: 0;
}
.shawdow_layer .arrow_area {
  position: absolute;
  width: 1345px;
  height: 162px;
  top: 50%;
  margin-top: -81px;
  left: 50%;
  margin-left: -673px;
  z-index: 40;
}
.shawdow_layer .arrow_area .arrow {
  position: absolute;
  width: 1345px;
  height: 162px;
  top: 0;
  left: 0;
  z-index: 11;
}
.shawdow_layer .arrow_area .arrow > div {
  cursor: pointer;
}
.shawdow_layer .arrow_area .arrow .leftarrow {
  position: absolute;
  top: 0;
  left: 0;
  padding: 50px;
  width: 21px;
  height: 62px;
  background: url("../img/l_arrow.png") no-repeat center;
}
.shawdow_layer .arrow_area .arrow .rightarrow {
  position: absolute;
  top: 0;
  right: 0;
  padding: 50px;
  width: 21px;
  height: 62px;
  background: url("../img/r_arrow.png") no-repeat center;
}
.toTop {
  position: fixed;
  display: none;
  width: 39px;
  height: 35px;
  background: url("../img/toTop.png") no-repeat center;
  bottom: 10px;
  right: 16px;
  z-index: 9;
  cursor: pointer;
}