@charset "utf-8";

/********************
common
********************/
/* reset */
* {
  -webkit-transition: all .5s;
          transition: all .5s;
}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, pre, form, fieldset, legend, textarea {
  margin: 0;
  padding: 0;
}
body {
  font: 12px/24px 'Microsoft YaHei', Arial, Helvetica, sans-serif;
  overflow-x: hidden;
}
body, a { color: #666; }
a { text-decoration: none; }
a:hover {
  color: #232323;
  text-decoration: none;
}
input, select, button, textarea {
  font-size: 100%;
  font-family: inherit;
  outline: none;
}
ul, ol { list-style: none; }
img { border: 0; }
table {
  border-collapse: collapse;
  border-spacing: 0;
}
small, .small { font-size: 12px; }
big, .big { font-size: 18px; }
:focus { outline: 0; }
.clearfix:after, .w:after {
  clear: both;
  height: 0;
  display: block;
  content: '';
}
.clearfix, .w { zoom: 1; }
.clear {
  clear: both;
  height: 0;
  font-size: 0;
  overflow: hidden;
}

/* float */
.fl { float: left; }
.fr { float: right; }

/* text-align */
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }

/* display */
.hide { display: none; }
.hidden { overflow: hidden; }

/* width */
.w {
  width: 1180px;
  margin: 0 auto;
}

/* margin */
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }

/* img */
/* img-main */
img.img-main,
.img-main img {
  display: block;
  background: #ccc;
}
/* img-hover */
.img-hover .image {
  overflow: hidden;
  background-color: #ccc;
}
.img-hover .image img { display: block; }
.img-hover a:hover .image img,
.img-hover .image:hover img {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
/*  opacity: .5;
  filter: alpha(opacity=50)*/;
}

/* color */
.color-green,
.color-green a { color: #000; }
.color-green a:hover,
a.color-green:hover { color: #232323; }

.color-lightgreen,
.color-lightgreen a { color: #58c78d; }
.color-lightgreen a:hover,
a.color-lightgreen:hover { color: #232323; }

.color-orange,
.color-orange a { color: #232323; }
.color-orange a:hover,
a.color-orange:hover { color: #232323; }

.color-black,
.color-black a { color: #333; }
.color-black a:hover,
a.color-black:hover { color: #232323; }

/********************
header
********************/
/* toolbar */
.header .toolbar {
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid #eee;
    background-color: #232323;
}
.header .toolbar,
.header .toolbar a { color: #fff;  }
.header .toolbar a:hover { color: #232323; }
.header h1{ display: none;}

/* welcome */
.header .welcome {
  float: left;
  font-size: 12px;
}

/* tools */
.header .tools { float: right; }
.header .tools li {
  float: left;
  padding-left: 30px;
}
.header .tools li a {
  position: relative;
  display: block;
  height: 100%;
  padding-left: 20px;
}
.header .tools li i {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 15px;
  height: 15px;
  margin-top: -7px;
  background: url('../images/icon_toolbar.png') no-repeat;
}
.header .tools li .fav i { background-position: 0 top; }
.header .tools li .tel i { background-position: -15px top; }
.header .tools li .email i { background-position: -30px top; }
.header .tools li .fav:hover i { background-position: 0 bottom; }
.header .tools li .tel:hover i { background-position: -15px bottom; }
.header .tools li .email:hover i { background-position: -30px bottom; }

/* main */
.header .main {
  position: relative;
  z-index: 2;
  height: 109px;
}

/* logo */
.header .logo {
  float: left;
  margin-top: 20px;
}
.header .logo img {
  display: block;
  width: 250px;
  height: 69px;
}

/* menu */
.header .menu {
  float: right;
  height: 70px;
  margin-top: 39px;
  margin-right: -20px;
}
.header .menu li {
  float: left;
  height: 35px;
  padding: 0 20px;
}
.header .menu li a {
  display: block;
  height: 34px;
  font-size: 16px;
  line-height: 34px;
  color: #333;
}
.header .menu li a:hover,
.header .menu li .on { color: #000; font-weight:500; }
.header .menu li .on { border-bottom: 1px solid #000; }

/* menu-sub */
.header .menu-sub {
  position: absolute;
  top: 109px;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 0;
  overflow: hidden;
  border-top: 1px solid #eee;
  background-color: #fff;
}
.header .menu-sub ul {
  float: right;
  margin: 5px -20px 20px 0;
}
.header .menu-sub li {
  float: left;
  min-width: 56px;
  min-height: 25px;
  padding: 5px 9px 5px 10px;
  text-align: center;
  border-right: 1px solid #eee;
}
.header .menu-sub li a {
  display: block;
  width: 100%;
  height: 25px;
  overflow: hidden;
  margin: 1px 0;
  line-height: 25px;
}
.header .menu-sub li a:hover {
  color: #fff;
  background-color: #000;
}

/********************
container
********************/
/* mod-search */
.mod-search {
  height: 33px;
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}
.mod-search .links {
  float: left;
  width: 850px;
  height: 13px;
  overflow: hidden;
  margin: 10px 0;
  line-height: 13px;
}
.mod-search .links span {
  float: left;
  color: #555;
}
.mod-search .links a {
  float: left;
  padding-right: 10px;
  margin-right: 10px;
  color: #888;
  border-right: 1px solid #dfdfdf;
}
.mod-search .links a.last {
  padding-right: 0;
  margin-right: 0;
  border-right: none;
}
.mod-search .links a:hover { color: #232323; }
.mod-search .search {
  float: right;
  width: 258px;
  height: 31px;
  overflow: hidden;
  border: 1px solid #b9c0c0;
}
.mod-search .search input {
  float: left;
  width: 206px;
  height: 21px;
  padding: 5px 10px;
  line-height: 21px;
  border: none;
}
.mod-search .search button {
  float: right;
  width: 32px;
  height: 31px;
  text-indent: -999em;
  border: none;
  cursor: pointer;
  background: url('../images/icon_search.png') no-repeat center #b9c0c0;
}

/********************
footer
********************/
.footer { margin-top: 60px; }

/* service */
.footer .service {
  height: 32px;
  padding: 22px 0;
  background-color: #f7f7f7;
}
.footer .service .w { position: relative; }
.footer .service ul { width: 2000px; }
.footer .service li {
  position: relative;
  float: left;
  width: 223px;
  padding-left: 40px;
  font-size: 18px;
  line-height: 32px;
  color: #444;
}
.footer .service li.s4 { padding-left: 55px; }
.footer .service li i {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 44px;
  height: 32px;
  background: url('../images/icon_footer_service.png') no-repeat;
}
.footer .service li.s1 i { background-position: 0 0; }
.footer .service li.s2 i { background-position: 0 -32px; }
.footer .service li.s3 i { background-position: 0 -64px; }
.footer .service li.s4 i { background-position: 0 -96px; }
.footer .service li.s5 i { background-position: 0 -128px; }
.footer .service li.s6 i { background-position: 0 -160px; }

/* main */
.footer .main {
  padding-top: 30px;
  padding-bottom: 20px;
  background-color: #232323;
}
.footer .main,
.footer .main a { color: #fff; }
.footer .main a:hover { color: #fff; }
.footer .main .body h3 {
  height: 24px;
  overflow: hidden;
  margin-bottom: 12px;
  font-size: 18px;
  font-weight: normal;
  color: #d9d9d9;
}
.footer .main .contact {
  float: left;
  width: 265px;
  margin-right: 38px;
}
.footer .main .contact .language { margin-bottom: 10px; }
.footer .main .contact .language a {
  position: relative;
  margin-left: 12px;
  padding-left: 22px;
  color: #40c8f4;
  background-repeat: no-repeat;
  background-position: left center;
}
.footer .main .contact .language a:hover { color: #58c78d; }
.footer .main .contact .language a.china { background-image: url('../images/icon_language_china.png') }
.footer .main .contact .info li {
  position: relative;
  padding-left: 25px;
  padding-bottom: 6px;
  line-height: 18px;
}
.footer .main .contact .info li i {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 18px;
  height: 18px;
  background: url('../images/icon_footer_contact.png') no-repeat;
}
.footer .main .contact .info li.home i { background-position: 0 0; }
.footer .main .contact .info li.tel i { background-position: 0 -18px; }
.footer .main .contact .info li.fax i { background-position: 0 -36px; }
.footer .main .contact .info li.email i { background-position: 0 -54px; }
.footer .main .contact .info li.address i { background-position: 0 -72px; }
.footer .main .links {
  float: left;
  width: 575px;
  min-height: 204px;
  border-left: 1px solid #909090;
  border-right: 1px solid #909090;
}
.footer .main .links li {
  float: left;
  width: 90px;
  padding-left: 45px;
}
.footer .main .links li p {
  height: 24px;
  overflow: hidden;
}
.footer .main .interaction {
  float: right;
  width: 265px;
}
.footer .main .interaction .qrcode {
  	text-align:center;
}
.footer .main .interaction .qrcode img {
	text-align:center;
  width: 110px;
  height: 110px;
  background-color: #fff;
}
.footer .main .interaction p { margin: 7px 0; 	text-align:center; }
.footer .main .interaction .flink { position: relative; }
.footer .main .interaction .flink span {
  position: relative;
  z-index: 2;
  display: block;
  height: 28px;
  padding: 0 10px;
  line-height: 28px;
  color: #d9d9d9;
  cursor: pointer;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background: url('../images/icon_footer_flink.png') no-repeat 245px center #909090;
}
.footer .main .interaction .flink ul {
  position: absolute;
  bottom: 0;
  left: 0;
  display: none;
  width: 100%;
  padding-top: 5px;
  padding-bottom: 28px;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  background-color: #909090;
}
.footer .main .interaction .flink li {
  height: 26px;
  overflow: hidden;
  line-height: 26px;
}
.footer .main .interaction .flink li a {
  display: block;
  height: 100%;
  padding: 0 10px;
  color: #d9d9d9;
}
.footer .main .interaction .flink li a:hover {
  color: #fff;
  background-color: #626262;
}

/* copyright */
.footer .copyright {
  overflow: hidden;
  margin-top: 30px;
  padding-top: 10px;
  border-top: 1px solid #909090;
}
.footer .copyright i {
  margin: 0 10px;
  font-family: Arial;
  font-style: normal;
}

/* online */
.online {
  position: absolute;
  top: 250px;
  right: 0;
  z-index: 99999;
  width: 155px;
  height: 300px;
  overflow: hidden;
}
.online li {
  position: absolute;
  left: 100px;
  width: 100%;
  height: 50px;
  font-size: 14px;
  line-height: 50px;
  overflow: hidden;
  margin-bottom: 1px;
}
.online li a {
  display: block;
  height: 100%;
  padding-left: 55px;
  color: #fff;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  background-repeat: no-repeat;
  background-position: 15px center;
  background-color: #3e3e3e;
  -webkit-transition: none;
          transition: none;
}
.online li a:hover { background-color: #232323; }
.online .top { top: 0; }
.online .qq { top: 51px; }
.online .tel { top: 102px; }
.online .consulting { top: 153px; }
.online .top a { background-image: url('../images/icon_online_top.png'); }
.online .qq a { background-image: url('../images/icon_online_qq.png'); }
.online .tel a { background-image: url('../images/icon_online_tel.png'); }
.online .consulting a { background-image: url('../images/icon_online_consulting.png'); }
