@charset "utf-8";
/* CSS reset */
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, time, tt, u, ul, var, video, xmp {
	border: 0;
	margin: 0;
	padding: 0;
}
table, tbody, td, tfoot, th, thead, tr,{
 	margin: 0;
	padding: 0;
}
html, body {height: 100%;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
b, strong {font-weight: bold;}
img {color: transparent;font-size: 0;-ms-interpolation-mode: bicubic;/*windows平台缩放图片时，可能出现图像失真现象*/}
ol, ul {list-style: none;}
li {display: list-item;}
table {	border-collapse: collapse;	border-spacing: 0;}
th, td, caption {font-weight: normal;vertical-align: top;}
/* 全局CSS定义 */
body{margin:0 auto;background:#FFF;color:#666; font-family:'\5FAE\8F6F\96C5\9ED1','\9ED1\4F53', simsun, sans-serif,Arial;font-size:12px;line-height:14px;}
em,i{font-style:normal;}
h1,h2,h3,h4,h5,h6{font-size:12px;font-weight:normal;}
input,textarea{font-size:12px}
.clearfix:after {content:"\200B"; display:block; height:0; clear:both; }
.clearfix {*zoom:1;}/*IE/7/6*/
/* 链接样式*/
a:link, a:visited, a:focus{ outline:none;}
a:link{ color:#666666; text-decoration:none;}
a:visited{ color:#666666; text-decoration:none;}
a:hover{ color:#666666; text-decoration:underline;}
a:active{ color:#666666; text-decoration:none;}
a:hover{ -webkit-transition: color .2s ease-in-out;
-moz-transition: color .2s ease-in-out;
-o-transition: color .2s ease-in-out;
-ms-transition: color .2s ease-in-out;
transition: color .2s ease-in-out;}

body{background: url("../images/bigbg.jpg") center top no-repeat;}
#page{ width:1160px; background: url("../images/parts01.jpg") center 0 no-repeat, url("../images/parts02.jpg") center 1600px no-repeat;
background-color: #fff; margin:0 auto; overflow: hidden;}

/* header */
#header{position: relative; height: 680px;}
.tit01{ text-indent: -9999em; background: url("../images/tit01.png") no-repeat;
 background-size: 427px 47px; width: 427px; height: 47px; position: absolute; top: 363px; right: 190px;
-webkit-animation-delay: 2.3s;
-moz-animation-delay: 2.3s;
-o-animation-delay: 2.3s;
animation-delay: 2.3s;}
.info{text-indent: -9999em; background: url("../images/info.png") no-repeat;
 background-size: 475px 70px; width: 475px; height: 70px; position: absolute; top: 425px; right: 168px;
-webkit-animation-delay:2.5s;
-moz-animation-delay:2.5s;
-o-animation-delay:2.5s;
animation-delay:2.5s;}
.flowers .f03{position: absolute; top: 257px; left: 3px;
-webkit-animation-delay: .3s;
-moz-animation-delay: .3s;
-o-animation-delay: .3s;
animation-delay: .3s;}
.flowers .f04{position: absolute; bottom: 0; left: 17px;
-webkit-animation-delay: .4s;
-moz-animation-delay: .4s;
-o-animation-delay: .4s;
animation-delay: .4s;}
.flowers .f02{position: absolute; top: 308px; left: 60px; 
-webkit-animation-delay: .6s;
-moz-animation-delay: .6s;
-o-animation-delay: .6s;
animation-delay: .6s;}
.flowers .f01{position: absolute; top: 365px; left: 125px; 
-webkit-animation-delay: .6s;
-moz-animation-delay: .6s;
-o-animation-delay: .6s;
animation-delay: .6s;}
.logo{position: absolute; top: 20px; left: 99px; 
-webkit-animation-delay:2.6s;
-moz-animation-delay:2.6s;
-o-animation-delay:2.6s;
animation-delay:2.6s;}
.keys .k01{position: absolute; top: 43px; left: 312px; 
-webkit-animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-o-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-delay: 1.3s;
-moz-animation-delay: 1.3s;
-o-animation-delay: 1.3s;
animation-delay: 1.3s;}
.keys .k02{position: absolute; top: 112px; left: 552px;-webkit-animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-o-animation-duration: 1.5s;
animation-duration: 1.5s 
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
-o-animation-delay: 1.6s;
animation-delay: 1.6s;}
.keys .k03{position: absolute; top: 170px; left: 710px; 
-webkit-animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-o-animation-duration: 1.5s;
animation-duration: 1.5s
-webkit-animation-delay: 1.8s;
-moz-animation-delay: 1.8s;
-o-animation-delay: 1.8s;
animation-delay: 1.8s;}
.keys .k04{position: absolute; top: 36px; left: 826px; 
-webkit-animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-o-animation-duration: 1.5s;
animation-duration: 1.5s
-webkit-animation-delay: 2s;
-moz-animation-delay: 2s;
-o-animation-delay: 2s;
animation-delay: 2s;}

/* parta */
#parta{position: relative; height: 540px; margin-top: -88px; }
.tit02-bg{position: absolute; top: 0; right: 79px; text-indent: -9999em; background: url("../images/pa-tit-bg.png") no-repeat;
 background-size: 243px 73px; width: 243px; height: 73px; 
-webkit-animation-delay: 3.5s;
-moz-animation-delay: 3.5s;
-o-animation-delay: 3.5s;
animation-delay: 3.5s;}
.tit02{ text-indent: -9999em; background: url("../images/pa-tit.png") no-repeat;
 background-size: 190px 49px; width: 190px; height: 49px; position: absolute; top: 8px; right: 21px;}
.pa-pro{ position: absolute; top: 16px; left: 175px; 
-webkit-animation-delay: 3.7s;
-moz-animation-delay: 3.7s;
-o-animation-delay: 3.7s;
animation-delay: 3.7s;}
.pa-txt{ padding: 75px 0 0 500px; 
-webkit-animation-delay: 3.8s;
-moz-animation-delay: 3.8s;
-o-animation-delay: 3.8s;
animation-delay: 3.8s;}
.pa-txt p{font-size: 14px; color: #000; line-height: 24px; text-indent: 2em;
width: 560px; padding-bottom: 25px; font-family:simsun, sans-serif,Arial;}
.qha{ margin: -10px 0 0 590px; background: #ccc; width: 460px; height: 270px;
 border:5px solid #ff6600; position: relative; 
-webkit-animation-delay: 4.2s;
-moz-animation-delay: 4.2s;
-o-animation-delay: 4.2s;
animation-delay: 4.2s;}


/* partb */
#partb{position: relative; height: 520px; margin-top: -56px;}
.tit03-bg{position: absolute; top: 0; left: 70px; text-indent: -9999em; background: url("../images/pb-tit-bg.png") no-repeat;
 background-size: 365px 143px; width: 365px; height: 143px;}
.tit03{ text-indent: -9999em; background: url("../images/pb-tit.png") no-repeat;
 background-size: 287px 50px; width: 287px; height: 50px; position: absolute; top: 40px; left: 40px;}
.table-xy{position: absolute; bottom: 40px; left: 140px; z-index: 10;}
.table .con li{width: 112px; text-align: center; float: left; position: absolute; bottom: 0;}
.table .con li img{margin-bottom: 9px; display: inline-block;}
.table .date01{left: 280px;}
.table .date02{left: 440px;}
.table .date03{left: 600px;}
.table .date04{left: 760px;}
.ana-line{position: absolute; top: 293px; left: 327px;}
.ana01{ position: absolute; top: 233px; left: 340px;}
.ana02{ position: absolute; top: 186px; left: 500px;}
.ana03{ position: absolute; top: 166px; left: 662px;}

/* product */
#product{position: relative; height: 440px;}
.pro-tit{text-indent: -9999em; background: url("../images/pro-tit.png") no-repeat;
 background-size: 268px 50px; width: 268px; height: 50px; position: absolute; top: 24px; left: 615px;}
.pros li{position: absolute;}
.pro-p01{ top: 24px; left: 402px;}
.pro-t01{ top: 24px; left: 206px;}
.pro-p02{ top: 84px; left: 617px;}
.pro-t02{ top: 133px; left: 762px;}
.pro-p03{ top: 239px; left: 402px;}
.pro-t03{ top: 239px; left: 206px;}
.pro-p04{ top: 239px; left: 558px;}
.pro-t04{ top: 348px; left: 762px;}

/* partc */
#partc{position: relative; height: 691px; margin-top: -69px; overflow: hidden;}
.tit04-bg{position: absolute; top: 300px; left: 695px; text-indent: -9999em; background: url("../images/pc-tit-bg.png") no-repeat;
 background-size: 333px 84px; width: 333px; height: 84px;}
.tit04{ text-indent: -9999em; background: url("../images/pc-tit.png") no-repeat;
 background-size: 359px 50px; width: 359px; height: 50px; position: absolute; top: 18px; left: 0;}
.pc-per{position: absolute; top:0; left: 80px;}
.pc-p01 img, .pc-p02 img{ border:5px solid #fff; box-shadow: 0 0 4px rgba(0,0,0, .4);}
.pc-p01{position: absolute; top: 160px; left: 378px;}
.pc-p02{position: absolute; top: 307px; left: 440px;}
.pc-txt{ padding: 392px 0 0 694px;}
.pc-txt p{font-size: 14px; color: #000; line-height: 24px; text-indent: 2em;
width: 365px; padding-bottom: 25px; font-family:simsun, sans-serif,Arial;}
.pc-txt p span{color: #ff5000; font-weight: 700;}

/* partd */
#partd{position: relative; height: 1750px; overflow: hidden;}
.tit05-bg{position: absolute; top: 22px; left: 98px; text-indent: -9999em; background: url("../images/pd-tit-bg.png") no-repeat;
 background-size: 257px 75px; width: 257px; height: 75px;}
.tit05{ text-indent: -9999em; background: url("../images/pd-tit.png") no-repeat;
 background-size: 190px 48px; width: 190px; height: 48px; position: absolute; top: 19px; left: 34px;}
.pd-info{ width: 686px; font-size: 14px; color: #000; line-height: 24px; text-indent: 2em;
padding: 28px 0 0 378px; font-family:simsun, sans-serif,Arial;}

.box{ width:962px; margin: 60px auto 0 auto; overflow:hidden;}
.title_box { width:100%; height:auto;}
.title_box h3 { float:left; background:url("../images/tab-off.png"); width: 111px; height: 111px;
text-indent: -9999em; cursor: pointer; margin: 0 66px 60px 66px;}
.title_box h3.now_tit { background:url("../images/tab-on.png");}
.title_box h3:nth-child(1){background-position: 0 0; margin-left: 180px;}
.title_box h3:nth-child(2){background-position: -122px 0;}
.title_box h3:nth-child(3){background-position: -243px 0;}
.title_box h3:nth-child(1):after{content: " "; width: 128px; height: 1px; display: block; border-bottom: 1px solid #a7a7a7;margin-left: 99px;
    -webkit-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    -o-transform: rotate(35deg);
    transform: rotate(35deg);
    margin-top: 80px;
    transform-origin: 0 0;}
.title_box h3:nth-child(2):after{content: " "; width: 50px; height: 50px; display: block;
 border-left: 2px solid #a7a7a7; margin-left: 57px; margin-top: 100px;}
.title_box h3:nth-child(3):after{content: " ";
    width: 43px;
    height: 128px;
    display: block;
    border-left: 1px solid #a7a7a7;
    margin-top: 70px;
    -webkit-transform: rotate(54deg); 
    -moz-transform: rotate(54deg);
    -ms-transform: rotate(54deg);
    -o-transform: rotate(54deg);
    transform: rotate(54deg);
    margin-left: -49px;}
.title_box h3.now_tit:nth-child(1):after{ border-bottom: 1px solid #ff6600;}
.title_box h3.now_tit:nth-child(2):after{ border-left: 2px solid #ff6600;}
.title_box h3.now_tit:nth-child(3):after{ border-left: 1px solid #ff6600;}
.con_box { clear:both; background: url("../images/argue-bg.png") center top no-repeat; height: 1419px;}
.con_box div { display:none;}
.con_box .now_con { display:block;} 
.argue-t01, .argue-t02, .argue-t03{text-indent: -9999em; height: 24px; margin: 0 auto; padding: 21px 0;}
.argue-t01{ background: url("../images/argue-t01.png") center center no-repeat; width: 364px;}
.argue-t02{ background: url("../images/argue-t02.png") center center no-repeat; width: 403px;}
.argue-t03{ background: url("../images/argue-t03.png") center center no-repeat; width: 427px;}
.con_box .list{ float: left; width: 480px; height: 1080px; border-right:2px solid #ff6600;}
.con_box .list:nth-child(3){border:none;}
.con_box .list:nth-child(3) li{float: right;}
.con_box .list li:nth-child(1){padding-top: 0; padding-bottom: 0;}
.con_box .list li:nth-child(1), .con_box .list li:last-child{border-bottom:none; }
.con_box .list li{width: 465px; float: left; padding-bottom: 20px; padding-top: 24px; border-bottom:1px solid #e6e6e6;}
.prop{padding-left: 170px;}
.oppo{ float: right; padding-right: 170px;}
.list li img{float: left; margin-right: 8px;}
.list li figcaption{ display: block; font-size: 15px; font-weight: 700; color: #333333; line-height: 22px; padding-top: 25px;}
.list li figcaption span{font-size: 24px; color: #ff6600; display: block; line-height: 33px; font-weight: 400;}
.list li p{font-family:simsun, sans-serif,Arial; font-size: 14px; color: #131313; line-height: 24px; margin-top: 10px;}
.con_box .review{display: block; clear: both; overflow: hidden;}
.rev-txt{ font-size: 14px; line-height: 24px; padding:8px 70px 0 175px; color: #131313;font-family:simsun, sans-serif,Arial;}
.rev-t01{text-indent: -9999em; background: url("../images/rev-t01.png") no-repeat;
 background-size: 195px 23px; width: 195px; height: 23px; margin: 88px 0 0 175px;}
.rev-t02{text-indent: -9999em; background: url("../images/rev-t01.png") no-repeat;
 background-size: 195px 23px; width: 195px; height: 23px; margin: 88px 0 0 175px;}
.rev-t03{text-indent: -9999em; background: url("../images/rev-t03.png") no-repeat;
 background-size: 275px 23px; width: 275px; height: 23px; margin: 88px 0 0 175px;}
/* parte */
#parte{height: 271px; background: url("../images/parte.jpg") 0 0 no-repeat; overflow: hidden;}
.tit06{text-indent: -9999em; background: url("../images/pe-tit.png") no-repeat;
 background-size: 275px 23px; width: 275px; height: 23px; margin: 88px 0 0 265px;}


/* bottom */
#bottom{height: 550px; background: url("../images/bottom.png") 0 0 no-repeat; margin-top: -9px;}
.messa{float: left; width: 620px; height: 250px; background: #fff; border:1px solid #bbb;
 box-shadow: 0 0 0 5px rgba(0,0,0,1); margin: 115px 0 0 100px;}
 .messb{float: right; padding: 124px 116px 0 0;}
#copyright{ clear:both; font-size:1.2em; color:#fff; text-align:center; padding:100px 0px 0px 0px; line-height:20px; overflow:hidden;}
#copyright a:link, #copyright a:visited, #copyright a:hover, #copyright a:active{ color:#fff; text-decoration:none;}

.animated {
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}