@charset "utf-8";
/* 
 * Project Name:

 */
@font-face {
    font-family: 'rotissemiserifregular';
    src: url('rotissemiserif-bold-webfont.eot');
    src: url('rotissemiserif-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('rotissemiserif-bold-webfont.woff2') format('woff2'),
         url('rotissemiserif-bold-webfont.woff') format('woff'),
         url('rotissemiserif-bold-webfont.ttf') format('truetype'),
         url('rotissemiserif-bold-webfont.svg#rotissemiserifregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden; }
body { font: 12px/1.8 "times new roman",arial, helvetica, sans-serif; margin: 0 auto; color: #646464; background: #fff; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong { font-weight: bold; }
input { outline: none; }
input[type="text"], input:not([type]), input[type="button"], input[type="submit"], select, textarea {
    border-radius: 0;
    box-shadow: none;
    outline: 0 none !important;
}
img { border: 0; }
::-moz-selection { background: #e77818; color: #fff; text-shadow: none; }
::selection { background: #e77818; color: #fff; text-shadow: none; }
a { text-decoration: none; blr: expression(this.onFocus=this.blur()); cursor: pointer; }
a:link, a:visited { text-decoration: none; }
a:active, a:hover { text-decoration: none; }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.l { float: left; }
.r { float: right; }
.vt { vertical-align: top; }
.vm { vertical-align: middle; }
.fr { text-align: right; }
.fc { text-align: center; }
.inner { width: 1200px; margin: 0px auto; }
.top a:link, .top a:visited { color: #fff;}
.top a:active, .top a:hover{ color: #e77818;}
.top{ position: fixed; width: 100%; left: 0px; top: 0px; z-index: 1000;}
.top .inner{
	height: 80px;
	position: relative;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
	background-image: url(../images/topbj.png);
	width:100%;
}
.logo{ position: absolute; left: 40px; top: 10px;}
.logo img{ width: 100%; display: block;}
.navarrow{ width: 75px; height: 3px; background-color: #e77818; position: absolute; left: -75px; bottom: 0px;}
.tnav{ float: right; display: block; position: relative;}
.tnav li{ float: left; display: block; width: 75px; padding-left: 25px; font-size: 14px;}
.tnav a{ padding-top: 31px; height: 49px; text-align: center; display: block;}
.largeA{ float: right; display: block; margin: 30px 30px 0px; font-size: 16px;}
.menu-handler .ico{ position: absolute; left: 20px; top: 28px; font-size: 13px;}
.menu-handler{ background-color:#00833c; width: 115px; height: 80px; position: relative; float: right; z-index: 10; cursor: pointer; color: #fff;}
.menu-handler .burger{  width: 17px; height: 2px; background: #fff; display: block; position: absolute; z-index: 5; top: 34px; left: 56%;  transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center; -o-transform-origin: center; -ms-transform-origin: center;}
.menu-handler .burger-2 { top: 39px; }
.menu-handler .burger-3 { top: 44px; }
.csstransforms .menu-handler.active .burger-1 { top: 39px;-moz-transform:rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.csstransforms .menu-handler.active .burger-2 { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; }
.csstransforms .menu-handler.active .burger-3{ top: 39px; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.csstransitions .trans,.csstransitions .trans:hover { -webkit-transition: all 277ms ease-in-out; -moz-transition: all 277ms ease-in-out; -o-transition: all 277ms ease-in-out; transition: all 277ms ease-in-out; -ms-transition: all 277ms ease-in-out; }
.csstransitions .trans-fast,.csstransitions .trans-fast:hover { -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; }
.no-csstransitions .menu-handler.active .burger-1,.no-csstransitions .menu-handler.active .burger-2,.no-csstransitions  .menu-handler.active .burger-3 { display: none; }
.no-csstransitions .menu-handler.active { background: url(../images/mob_close.png) no-repeat scroll 65% center #00833c; }
.navbox{ display: none; position: fixed; right: 8%; top: 80px; z-index: 999; width: 960px; margin-left: -480px; background-color: #fff; box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);}
.nav{ width: 600px; float: right; display: block; margin-right: 145px; padding: 32px 0 40px;}
.nav a:link, .nav a:visited { color: #7d7d7d;}
.nav a:active, .nav a:hover{ color: #E77818;}
.nav dd{ float: left; display: block; width: 75px; padding-left: 25px; text-align: center; font-size: 13px;}
.nav dd p a:link, .nav dd p a:visited{ color: #434242;}
.nav dd p a:active, .nav dd p a:hover{ color: #212121;}
.nav .subnav li{ margin-top: 16px;}
.navMobile { display: none; padding: 20px 0px 15px;}
.navMobile dd { display: block; float: initial; width: 100%; }
.navMobile dd p { padding-bottom: 0px; font-size: 14px; }
.navMobile dd a { display: block; padding: 14px 5%; line-height: 1.4; color: #434343; }
.navMobile dd a:hover, .navMobile dd a.cur { background-color: #465494; color: #fff; }
.navMobile dd a:active { background-color: #5d6fc1; color: #fff; }
.navMobile dd .subnav { background-color: #ffffff; display: none; }
.navMobile dd .subnav a { color: #7e7e7e; }
.navMobile dd .subnav a:hover { background-color: #e6e6e6; }
.footBox{ background-color: #00833c; padding:60px 6% 60px; color: #fff;}
.footBox a:link, .footBox a:visited { color: #fff;}
.footBox a:active, .footBox a:hover{ color: #fe8d2c;}
.footBox .knav{ margin-bottom: 10px;}
.wA{ position: relative;}
.wA .wbox { position: absolute; left: 50%; bottom: 20px; width: 91px; height: 110px; margin-left: -45px; display: none;}
.f13{ font-size: 13px;}
.footBox .con{ float: left; display: block;}
.selebox{ margin-bottom: 5px; height: 50px;}
.addselect{ width:234px; height:50px; background:url(../images/sele.png) no-repeat 92% center #fff; line-height:50px; text-indent:2em; color:#6d6d6d; cursor:pointer; position:relative; text-align: left; float: left;}
.addselect-Op{ border:1px solid #e0e0e0; margin:0;border-bottom:0px; display:block; position:absolute; bottom:50px; left:0px; background:#ffffff;}
.addselect-Op dd{ text-indent:2em; margin:0; padding: 6px 0px; color:#9A9A9A; line-height: 1.8;}
.addselect-Op dd.selected{ background:#9c9c9c; color:#fff;}
.addselect-Op dd:hover{color:#fff; background-color: #00833c;}
.pbanner{ background-position: center top; background-size: cover;}
.backTop { background: url(../images/backTop.png) no-repeat; width: 50px; height: 50px; position: fixed; bottom: 5%; right: 1%; z-index: 9999; display: none; }
.backTop .ico { display: block; width: 11px; height: 12px; background: url(../images/backTop_ico.png) no-repeat scroll center top; margin: 12px auto 0px; -webkit-transition: all 400ms; -ms-transition: all 400ms; -moz-transition: all 400ms; transition: all 400ms;}
.backTop:hover .ico { margin-top: 8px;}
/*index style*/
.banner{ height:840px; overflow:hidden; position:relative;}
.banner .bannerBox{ width:9999px; height:100%; position:absolute; left:0; top:0;}
.banner .bannerBox li{ width:1920px; height:100%; overflow:hidden; float:left; position:relative;}
.banner .bannerBox li .img{ position:absolute; left:0; top:0;}
.bannerBox .bfont{ color:#475595; position:absolute; left:50%; top:25%; width: 1200px; margin-left: -600px;}
.bannerBox .text{ float: left; display: block;}
.bannerBox .text .p1{ font: 30px/1.4 "times new roman";	text-align: right;}
.bannerBox .text .p2{ font: 78px/1.2 "rotissemiserifregular"; text-transform: uppercase;}
.bannerBox .text .p3{ font: 19px/1.5 "rotissemiserifregular"; color: #707bad;}
.bannerBox .text .cor{ color: #e77818; }
.bannerBox li{ background-position: center top; background-repeat: no-repeat; background-size: cover;}



.bannerBox li.li1  .text .p1,.bannerBox li.li1 .text .p2,.bannerBox li.li1 .text .p3,.bannerBox li.li4 .text .p3{ color: #fff;}
.bannerBox li.li1  .text .p2{ font-size: 59px;width: 70%;}
.bannerBox li.li4 .text{ color: #fff;}
.bannerBox li.li4  .text .p1{ color: #fff;font-size: 34px;}
.bannerBox li.li4 .text .p2{ font-size: 30px;}

/*
.bannerBox li.li1 .text{ padding-left: 120px;}
.bannerBox li.li1 .text .p1{ font: 74.4px/1.1 "rotissemiserifregular"; text-transform: uppercase; color: #fff;}
.bannerBox li.li1 .text .p2{ font: 28px/1.5 "times new roman"; padding: 10px 0px; color: #fff;}
.bannerBox li.li1 .text .p3{ color: #f5e1d0;}

    */








.bannerBox li.li2 .text{ float: right; display: block;}
.bannerBtn{ width:100%; text-align:center; position:absolute; left:0; bottom:30px;}
.bannerBtn span{ transition:400ms; width:12px; height:12px; border-radius:8px; margin:0 6px; display:inline-block; background:#fff; cursor:pointer;}
.bannerBtn .cur{ width:24px; background:#e77818;}
/*index style end*/
@-webkit-keyframes social {
  25% {
    -webkit-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  75% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  100% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
}
@-moz-keyframes social {
  25% {
    -webkit-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  75% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  100% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
}
@keyframes social {
  25% {
    -webkit-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  75% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  100% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
}
/* Push */
@-webkit-keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-moz-keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.iboxDL a:link, .iboxDL a:visited { color: #646464;}
.iboxDL a:active, .iboxDL a:hover{ color: #5f5f5f;}
.iboxDL{ height: 380px; overflow: hidden;}
.iboxDL dd{ float: left; display: block; width: 25%; background-color: #fff;}
.article-block.iboxDL dd{ position: relative; opacity: 0;top: 50px;}
.articleShow.iboxDL dd{top: 0px; opacity: 1;}
.articleShow.iboxDL dd.familyBox{ transition: 400ms ease 200ms;}
.articleShow.iboxDL dd.productBox{ transition: 700ms ease 350ms; width:50%;}
.articleShow.iboxDL dd.healthBox{ transition: 900ms ease 450ms;}
.articleShow.iboxDL dd.knowledgeBox{ transition: 1100ms ease 550ms;}
.articleShow.iboxDL dd.knowledgeBoxx{ transition: 1100ms ease 550ms; width:50%;}
.articleShow.iboxDL dd.familyBoxx{ transition: 900ms ease 450ms; width:50%;}

.iboxPage{ height: 380px; border-left: 1px solid #e6e6e6;}
.iboxT{ padding: 15px 8% 15px;}
.iboxT .zh{ color: #646464; font: 21px/1.6 "times new roman";}
.iboxT .en{ font:italic 15px/1.5 "times new roman"; color: #909090;}
.iboxDL .familyBox .iboxPage{ border-left: 0px none;}
.familyIco{  margin-left: 4%;}
.familyIco img{ width:100%;}
.familyIco li{ width: 32.88%; float: left; display: block; border-right: 1px solid #e77818; border-bottom: 1px solid #e77818; border-top: 1px solid #e77818;}
.familyIco li a{ display: block; width: 100%; height: 118px; position: relative; -webkit-transition: all 480ms; -ms-transition: all 480ms; -moz-transition: all 480ms; transition: all 480ms;}
.familyIco li .ico{ position: absolute; width: 58px; height: 58px; left: 46px; top: 61px; margin: -29px 0px 0px -29px; background: url(../images/sharp.png) no-repeat;}
.familyIco .i1 .ico{ background-position:-35px 0px;}
.familyIco .i2 .ico{ background-position:-154px 0px;}
.familyIco .i3 .ico{ background-position:-272px 0px;}
.familyIco li a:hover{ background-color: #e77818;}
.familyIco li a:hover .ico{ background-image: url(../images/sharp2.png);}
.more{ background: url(../images/more.png) no-repeat scroll center center; width: 29px; height:30px; display: block;  -webkit-transform: translateZ(0);
  transform: translateZ(0);}
.more:hover{ background-image: url(../images/more2.png); -webkit-animation: hvr-push 0.3s linear 1; animation: hvr-push 0.3s linear 1;}
.iboxMore{ padding: 0px 8%; height: 79px;}
.icoList li{ width: 25%; float: left; display: block;}
.icoList li a{ display: block; width: 100%; height: 104px; padding:16px 0px 0px; position: relative; text-align: center; -webkit-transition: all 480ms; -ms-transition: all 480ms; -moz-transition: all 480ms; transition: all 480ms; font: 14px/1.8 "times new roman";}
.icoList li .ico{display: block; width: 56px; height: 56px; margin: 0px auto; position: relative; top: 0px; transition: all 0.3s ease 0s;}
/*.icoList li .i1 .ico{ background-position:-32px 0px;}
.icoList li .i2 .ico{ background-position:-152px 0px;}
.icoList li .i3 .ico{ background-position:-272px 0px;}
.icoList li .i4 .ico{ background-position:-392px 0px;}
.healthBox .icoList li .ico{ background-image: url(../images/ico4.png);}
.icoList li .i5 .ico{ background-position:-32px 0px;}
.icoList li .i6 .ico{ background-position:-152px 0px;}
.icoList li .i7 .ico{ background-position:-272px 0px;}
.icoList li .i8 .ico{ background-position:-392px 0px;}*/
.icoList li .ico .r1{ display: block;}
.icoList li .ico .r2{ display: none; position: absolute; left: 0px; top: 0px;}
.icoList li a:hover { color: #fff; background-color: #e77818;}
.icoList li a:hover .ico{ top: -8px;}
.icoList li a:hover .ico .r1{ display: none;}
.icoList li a:hover .ico .r2{ display: block;}
.knowledgeCon{ width: 84%; margin: 0px auto; color: #646464;}
.knowledgeCon a:link {
	font-size: 14px;
}
.knowledgeCon a:visited {
font-size: 14px;
}
.knowledgeCon a:hover {
font-size: 14px;
color:#00833d;
}

.knowledgeCon .c{ overflow: hidden; height: 160px; margin-bottom: 10px; line-height: 2.4; text-align: justify; font-size:14px;}
.knowledgeCon .jw{ font: 18px/1.4 "times new roman"; text-align: right; color:#00833c;}
/*index style end*/
/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 
/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img, .flexslider .slides iframe {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}
/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}
/* FlexSlider Default Theme
*********************************/
.flexslider {margin: 0 0 60px;   position: relative; zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}
.carousel li {margin-right: 5px}
/* Direction Nav */
.flex-direction-nav a {width: 40px; height: 40px; margin: -20px 0 0; display: block; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px; z-index:1000}
.flex-direction-nav a:hover {opacity: .8; filter:alpha(opacity=80);}
/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px;  text-align: center  !important;}
.flex-control-nav li {margin: 10px 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background:#999999;  border-radius:100%; cursor: pointer; text-indent: -9999px;}
.flex-control-paging li a.flex-active {border:1px solid #ccc; cursor: default;background:#fff;width: 13px; height: 13px;}
.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .3; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs img.active {opacity: 1; cursor: default;}
@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {opacity: 1; left: 0;}
  .flex-direction-nav .flex-next {opacity: 1; right: 0;}
}
/*about style*/
.article-block .iboxT,.article-block .pageBox-C,.article-block .more2,.article-block .aboutTab,.article-block .featuresslider,.article-block .advantageslider,.article-block .inviteslider{ position: relative; top: 50px; opacity: 0;}
.articleShow .iboxT,.articleShow .pageBox-C,.articleShow .more2,.articleShow .aboutTab,.articleShow .featuresslider,.articleShow .advantageslider,.articleShow .inviteslider{top: 0px; opacity: 1;}
.articleShow .iboxT{ transition: 500ms ease 200ms;}
.articleShow .pageBox-C{ transition: 700ms ease 350ms;}
.articleShow .more2{transition: 900ms ease 450ms;}
.articleShow .aboutTab{ transition: 700ms ease 350ms;}
.articleShow .featuresslider,.articleShow .advantageslider,.articleShow .inviteslider{transition: 900ms ease 450ms;}
.pageBox{ padding: 40px 0px;}
.pageBox .iboxT{ padding:0px 0px 10px;}
.pageBox .iboxT .zh{ line-height: 2;}
.pageBox-C{ text-align: center; line-height: 2.2; color: #646464;}
.bge2e2e2{ background-color: #e2e2e2;}
.morebox{ padding-top: 64px;}

.morebox img{ width:100%;}
.more2{ width: 140px; height: 54px; display: block; margin: 0px auto; position: relative; color: #fff; line-height: 54px; font-size: 14px;}
.more2 span{ display: block; width: 118px; height: 100%; padding-left: 22px; background: url(../images/m_bg1.png) no-repeat scroll 90px center #00833c;}
.more2 span.i2{ background-image: url(../images/m_bg2.png); position: absolute; left: 0px; top: 0px; z-index: 1; display: none;}
.more2act span.i2{ display: block;}
#aboutPage .pageBox-C{overflow: hidden; text-align: left;    font-size: 14px;
    line-height: 40px;}
#aboutPage .pheight{ height: auto;}
.aboutTab{ width: 963px; margin: 0px auto; overflow: hidden; padding-bottom: 70px;}
.aboutTab a{ float: left; display: block; width: 318px; margin: 0px 0px 0px 3px; background-color: #8f8f8d; overflow: hidden; font: 14px/1.5 "times new roman"; color: #ffffff; text-align: center; position: relative;}
.aboutTab a .i1{ background-color: #e77817; position: absolute; left: 0px; top: 0px; width: 0%; height: 100%;-webkit-transition: 0.4s; -moz-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s;}
.aboutTab a .i2{ position: relative; z-index: 2; padding:20px 15px; display: block;}
.aboutTab a.active .i1{ width: 100%;}
.featuresslider,.advantageslider{ color: #909090;}
.featuresslider a:link, .featuresslider a:visited { color: #e77817;}
.featuresslider a:active, .featuresslider a:hover{ color: #5f5f5f;}
.advantageslider a:link, .advantageslider a:visited { color: #e77817;}
.advantageslider a:active, .advantageslider a:hover{ color: #5f5f5f;}
.advCon1{ width: 750px; text-align: center; margin: 0px auto;}
.advCon2{ width: 380px; text-align: center; margin: 0px auto;}
.advCon3{ width: 400px; margin: 0px auto; text-align: center;}
.felist{ width: 400px; margin: 0px auto;}
.felist dd{ text-align: center; width: 100px; float: left; display: block; line-height: 2; font-size: 14px;}
.apage,.apage2,.apage3{background-repeat: no-repeat; background-position: center top; width: 100%; height: 570px;overflow: hidden;}
.apage3{ height: 340px;}
#developmentPage .pageBox-C{ text-align: left;}
/*about style end*/
/*product style*/
.productmain{ background-color: #eaeaea; padding: 96px 0px;}
.productList{ width: 960px; margin: 0px auto;}
.productList a:link, .productList a:visited { color: #7c7c7c;}
.productList a:active, .productList a:hover{ color: #5f5f5f;}
.productList li{ margin-bottom: 1px; background-color: #fff;}
.productList .con{ float: left; display: block; width: 46%; text-align: center; padding-top: 7%;}
.productList .ico{ width: 100px; height: 100px; position: relative; overflow: hidden; margin: 0px auto;}
.productList .ico .i1{ display: block; width: 100%;}
.productList .ico .i2{ display: none; width: 100%; position: absolute; left: 0px; top: 0px;}
.productList .img{ float: right; display: block; width: 52%; overflow: hidden; background-color: #000;}
.productList .img img{ width: 100%; display: block; transition: transform 400ms; -webkit-transition: -webkit-transform 400ms; filter: Alpha(Opacity=100); opacity: 1;}
.productList .t .zh{ color: #646464; font: 21px/1.6 "times new roman";}
.productList .t .en{ font:italic 15px/1.5 "times new roman"; color: #909090;}
.promore{ background: url(../images/pb3.png) no-repeat; width: 27px; height: 27px; position: relative; margin:22px auto 0px; overflow: hidden;}
.promore .i{ position: absolute; background: url(../images/promoreico.png) no-repeat; width: 27px; height: 27px; left: 0px; top: 0px; transition: 400ms;}
.productList li:hover{ background-color: #f4f2f2;}
.productList li:hover .ico .i1{ display: none;}
.productList li:hover .ico .i2{ display: block;}
.productList li:hover .promore .i{ left: 4px;}
.productList li:hover .img img{ filter: Alpha(Opacity=80); opacity: 0.8; transform: scale(1.1); -webkit-transform: scale(1.1)}
.productList li.article-block{ top: 50px; position: relative; opacity: 0;}
.productList li.articleShow{ top: 0px; position: relative; opacity: 1; transition: 500ms ease 200ms;}
.bge2{ background-color: #e2e2e2;}
.more3{ background-color: #E77817; color: #fff; display: block; float: left; position: relative; padding: 22px 30px; font-size: 15px;}
.more3 .i1{ position: absolute; left: 0px; top: 0px; width: 0%; height: 100%; transition: 300ms; background-color: #8f8f8d;}
.more3 .i2{ position: relative; z-index: 2;}
.more3:hover .i1{ width: 100%;}
.proVIdeo{ margin: 135px auto 0px; height: 376px; overflow: hidden; border-bottom: 7px solid #E77817;}
.proVIdeo #vbBox{ width: 100%; height: 376px;}
#vbBox_controlbar{ bottom: -50px!important;}
#vbBox_display_button_play{ background: url(../images/vico1.png) no-repeat !important; width: 62px !important; height: 62px !important;}
.t-VideoBox{ position: relative; margin-top: 80px; overflow: hidden; height: 600px;}
.t-VideoBox #vbBox{ width: 100%; height: 600px;}
.t-VideoBox .vbcon{ position: absolute; top: 34%; text-align: center; color: #ffffff; font: 36px/1.2 "times new roman"; width: 100%;}
.t-VideoBox .vbcon .name{ font-weight: bold; padding-left: 10px;}
#vbBox_logo,#videocontainer_menu,#wrapvidepo_logo,.jwclick{ display:none!important; }
.t-VideoBox .vico{ position: absolute; left: 50%!important; top: 50%!important; }
#vbBox_display_button{ background:none no-repeat!important;}
.jwplayer .jwdisplayIcon div{ background: url(../images/vico1.png) no-repeat; width: 68px; height: 68px;}
.prolistDD {
	margin-left: -22px;
	overflow: hidden;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 86px;
	padding-left: 0px;
}
.prolistItem {
	float: left;
	display: block;
	width:30%;
	background-color: #ffffff;
	color: #6a6a6a;
	position: relative;
	margin-bottom: 20px;
	    margin: 0px 0px 22px 22px;
}


.prolistItem a { color: #6a6a6a; }
.prolistItem .img { width: 100%; position: relative; overflow: hidden; background-color: #000;}
.prolistItem .img img { width: 100%; display: block; transition: transform 400ms; -webkit-transition: -webkit-transform 400ms;}
.prolistItem .img .black { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: none; background: url(../images/black_pbg.png) repeat; }
.prolistItem .img .pmore { position: absolute; width:100%;left: 0%; top: 50%; text-align: center; display: none; font: 14px/1.4 "times new roman"; color: #fff;}
.prolistItem .con { padding: 32px 20px; text-align: left; font: 15px/1.4 "times new roman"; height: 80px; overflow: hidden; background-color:#f3f1f2;}
.prolistItem .con h1{ color:#00914a;}
.prolistItem .k1 {background-color: #ff8d12;top:100%;display: block;height: 0;left: 0;position: absolute;width: 100%;}
.prolistItem:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);filter: Alpha(Opacity=80); opacity: 0.8; }
.proAct .img .black { display: block; }
.proAct .img .pmore { display: block; margin-top: -12px; }
.proAct .k1 { height: 10px; }
.proclose{ background: url(../images/proClose.png) no-repeat; width: 35px; height: 35px; display: block; margin: 0px auto 20px; position: relative;}
.proclose .i{ background: url(../images/procloseIco.png) no-repeat; width: 13px; height: 13px; position: absolute; left: 11px; top: 11px; transition: 400ms;}
.proclose:hover .i{ transform: rotate(90deg);}
.proBox { position: relative; margin: 0px 0px 22px 22px; padding:20px 0px 40px; display: none; clear: both;}
.probanner { width: 100%; position: relative; }
.probanner img { width: 100%; display: block; }
.probanner .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { padding: 0px; bottom: -38px; }
.probanner .bx-wrapper .bx-pager.bx-default-pager a { background-color: #c8c8c8; }
.probanner .bx-wrapper .bx-pager.bx-default-pager a:hover, .probanner .bx-wrapper .bx-pager.bx-default-pager a.active { background-color: #e60027; }
.probanner .bx-wrapper .bx-controls-direction a { width: 88px; height: 100%; position: absolute; background-repeat: no-repeat; background-position: center center; top: 0px; text-indent: -99em; overflow: hidden;}
.probanner .bx-wrapper .bx-prev { background-image: url(../images/pro_l.png); left: 0px;}
.probanner .bx-wrapper .bx-next { background-image: url(../images/pro_lr.png); right: 0px;}
.proBox a:link, .proBox a:visited { color: #7c7c7c;}
.proBox a:active, .proBox a:hover{ color: #5f5f5f;}
.protxt { padding: 42px 5% 42px; text-align: center; font-size: 14px; color: #ababab; background-color: #fff;}
.protxt .t { color: #6a6a6a; margin-bottom: 5px; }
/*product style end*/
/*news style*/
.newNav{ padding: 115px 0px;}
.newNav .more3{ margin-right: 5px;}
.newNav a.more3{ padding: 22px 48px; background-color: #8f8f8d;}
.newNav a.more3 .i1{ background-color: #00833c;}
.newNav a.more3.act .i1{ width: 100%;}
.newlist a:link, .newlist a:visited { color: #848484;}
.newlist a:active, .newlist a:hover{ color: #5f5f5f;}
.newlist{ width: 1200px; margin: 0px auto;}
.newlist li{ width: 376px; padding: 0px 12px; margin-bottom: 36px; float: left; display: block;}
.newlist li a{ display: block; overflow: hidden;}
.newlist li .con{ background-color: #f4f2f3; padding: 34px 40px;}
.newlist li .t{ color: #646464; font: 15px/1.4 "times new roman"; height: 20px; overflow: hidden;}
.newlist li .nmore{ color: #00833c;}
.newlist li .img{ height: 154px; overflow: hidden; background-color: #000;}
.newlist li .img img{ width: 100%; display: block;transition: transform 400ms; -webkit-transition: -webkit-transform 400ms;}
.newlist li:hover a{box-shadow:0 0 3px 0 rgba(0, 0, 0, 0.3);}
.newlist li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);filter: Alpha(Opacity=80); opacity: 0.8; font-family: ;}
.paging a:link, .paging a:visited { color: #fff;}
.paging a:active, .paging a:hover{ color: #fff;}
.paging{ padding: 95px 0px 115px;}
.paging a{ float: left; display: block;background-color: #c0c0c0;}
.paging a.np{ padding: 22px 28px;}
.paging a:hover{ background-color: #FE8D2C;}
.infoT{ padding:64px 0px 0px; width:614px;}
.infoT .t{ font: 22px/1.5 "times new roman"; color: #646464; margin-bottom: 12px; text-align: justify;}
.infoC a:link, .infoC a:visited { color: #848484;}
.infoC a:active, .infoC a:hover{ color: #5f5f5f;}
.infoC{ padding-top: 64px; text-align: justify;}
.infoC img{ max-width: 100%; color: #7f7f7f; line-height: 2;}
.w614{ width: 614px; margin: 0px auto;font-size:14px; line-height:30px;}
.olPaging{ padding-top: 115px;}
.olPaging a{ display: block; width: 49.99%; float: left; display: block; text-align: right; height: 70px; color: #fff; background-color: #8f8f8d;}
.olPaging a.next{ float: right; text-align: left;}
.olPaging a span{ display: inline-block; height: 70px; font: 16px/70px "times new roman"; padding: 0px 52px; color: #fff; transition: 300ms;}
.olPaging a.prev span{ background: url(../images/olpaging1.png) no-repeat scroll 4% center;}
.olPaging a.next span{ background: url(../images/olpaging2.png) no-repeat scroll 96% center;}
.olPaging a:hover{ background: #00833c;}
.olPaging a.prev:hover span{ background-position: left center;}
.olPaging a.next:hover span{ background-position: right center;}
/*news style end*/
/*contact style*/
.inviteCon a:link, .inviteCon a:visited { color: #fff;}
.inviteCon a:active, .inviteCon a:hover{ color: #fff;}
.inviteCon{ background-color: #e77816;color: #fff; text-align: center; padding:8% 5%; width: 90%; overflow: hidden;}
#invitePage .aboutTab{ padding-bottom: 0px; width: 960px;}
#invitePage .aboutTab a{ width: 191px; margin: 0px 1px 0px 0px; font-size: 16px;}
#invitePage .aboutTab a:last-child{ width: 192px; margin-right: 0px;}
#joinPage,#networkPage,#mapPage{ padding-bottom: 0px;}
#joinPage,#networkPage,#mapPage{ padding-bottom: 0px;}
#joinPage .iboxT,#networkPage .iboxT,#mapPage .iboxT{ padding-bottom: 70px;}
.join-dl{ padding-bottom: 60px; position: relative; opacity: 0; top: 50px; font-size: 13px;}
.articleShow .join-dl{ transition: 700ms ease 350ms; top: 0px; opacity: 1;}
.join-dl .jt{ width: 90%; margin: 0px auto; padding: 20px 0px;}
.join-dl .jnum, .join-dl .jbtn { float: left; display: inline-block; padding: 0px 5%; }
.join-dl .jname { width: 30%; float: left; display: inline-block; }
.join-dl .jnum { width: 18%; }
.join-dl .jbtn { float: right; position: relative; height: 22px; overflow: hidden; padding: 0px;}
.join-dl .jbtn i { display: block; position: relative; }
.join-dl .jbtn i.i2 { color: #fff; }
.join-dl dd { margin-bottom: 13px; }
.join-dl i { font-style: inherit; }
.join-dl .jtbox { background-color: #ebebeb; color: #646464; cursor: pointer; transition: 300ms;}
.join-dl .jcbox { padding:35px 10%; background-color: #e77816; line-height: 2; display: none; color: #fff; }
.join-dl .jtboxact,.join-dl .jtbox:hover { color: #fff; background-color: #e77816; }
.join-dl .jtboxact .jt{ border-bottom: 1px solid #ec9345;}
.jcbox a:link, .jcbox a:visited { color: #212121;}
.jcbox a:active, .jcbox a:hover{ text-decoration: underline;}
.joinMore{ display: block; background-color: #00833c; height: 58px; font: 14px/58px "times new roman"; color: #fff; text-align: center;}
.joinMore .ico{ background: url(../images/olpaging2.png) no-repeat scroll right center; padding-right: 40px; color: #fff; display: inline-block;}
.joinMore:hover{ background-color: #8f8f8d;}
.networkList{ width: 960px; margin: 0px auto; padding-bottom: 110px;}
.networkList li { background-color: #ebebeb; margin-bottom: 10px; position: relative; top: 50px; opacity: 0px;}
.networkList li:hover { background-color: #e7e7e7; }
.networkList .img { float: left; display: inline-block; width: 338px; height: 169px; overflow: hidden; }
.networkList .img img { width: 100%; display: block;}
.networkList .con { padding-left:404px; }
.networkList .con .t1, .networkList .con .t2{ overflow: hidden; float: left; display: inline-block; padding: 45px 0px 20px;}
.networkList .con .t1 { width: 44%; color: #646464; font-size: 16px;}
.networkList .con .t2 { width: 46%; }
.networkList li.articleShow{ transition: 400ms; top: 0px; opacity: 1;}
.subordContact{ position: relative; width: 100%;}
#subordmapBox{ height: 658px; width: 100%;}
.subordContact-con{ position: absolute; right: 50%; margin-right: -500px; top: 235px; opacity: 0;}
.subordContact-con dl{ width: 268px; float: right;}
.subordContact-con dt{ padding: 30px; height: 55px; font: 22px/1.4 "times new roman"; color: #858585; background-color: #fff;}
.subordContact-con dd{ color: #fff; padding: 30px; line-height: 2.2;}
.subordContact-con dd a:link, .subordContact-con dd a:visited { color: #fff; }
.subordContact-con dd a:active, .subordContact-con dd a:hover { color: #fff; text-decoration: underline;}
.bge77817{ background-color: #e77817;}
.articleShow .subordContact-con{ transition: 700ms ease 350ms; top: 185px; opacity: 1;}
/*contact style end*/
/*healthy style*/
#rawMaterialsPage{ padding-bottom: 0px;}
.rawDemo{ width: 626px; margin: 82px auto 0px; position: relative; top: 50px; opacity: 0;}
.articleShow .rawDemo{ top: 0px; transition: 700ms ease 350ms; opacity: 1;}
.rawBox{ width: 480px; margin: 0px auto;}
.rawBox li{ float: left; display: block; width: 120px; color: #7f7f7f; cursor: pointer; padding-bottom: 40px; position: relative;}
.rawBox li .item{ height: 120px; overflow: hidden;text-align: center;}
.rawBox li .ico{ width: 56px; height: 56px; margin: 16px auto 6px; overflow: hidden; position: relative; top: 0; transition: all 0.3s ease 0s;}
.rawBox li .ico .i1{ display: block;}
.rawBox li .ico .i2{ display: none; position: absolute; left: 0px; top: 0px;}
.rawBox li .sj{ background: url(../images/sj.png) no-repeat scroll center bottom; width: 29px; height: 12px; position: absolute; left: 50%; bottom: 0px; margin-left: -15px; display: none;}
.rawBox li:hover .item,.rawBox li.act .item{ background-color: #E77817; color: #fff;}
.rawBox li.act .sj{ display: block;}
.rawBox li:hover .ico,.rawBox li.act .ico { top: -5px;}
.rawBox li:hover .ico .i1,.rawBox li.act .ico .i1{ display: none;}
.rawBox li:hover .ico .i2,.rawBox li.act .ico .i2{ display: block;}
.rawCon{ background-color: #e77818; position: relative; color: #ebd0b8; font:14px/1.5 "times new roman"; display: none;}
.rawCon .inner{ padding: 45px 0px;}
.rawDemo .rawR,.rawDemo .rawL{ position: absolute; top:40px; width: 29px; height: 30px;}
.rawDemo .rawL{ left: 0px; background-position: 0px 0px;}
.rawDemo .rawR{ right: 0px; background-position: right 0px;}
.rawDemo .bx-prev,.rawDemo .bx-next{  background: url(../images/hlr.png) no-repeat; width: 100%; height: 100%; display: block;}
.rawDemo .bx-prev{ background-position: left top;}
.rawDemo .bx-next{ background-position: right top;}
.rawDemo .rawR:hover .bx-prev{ background-position: left bottom;}
.rawDemo .rawR:hover .bx-next{ background-position: right bottom;}
.lifeList a:link, .lifeList a:visited { color: #fff;}
.lifeList a:active, .lifeList a:hover{ color: #fff;}
.lifeList{ position: relative; top: 50px; opacity: 0;}
.articleShow .lifeList{ top: 0px; transition: 700ms ease 350ms; opacity: 1;}
.lifeList li{ float: left; display: block; width:25%; background-color: #ffffff; transition: 300ms;}
.lifeList li a{ display: block; padding: 10px 11px 32px;}
.lifeList .img{ width: 100%; overflow: hidden; height: 180px; margin-bottom: 30px;}
.lifeList .img img{ width: 100%; display: block; transition: transform 400ms; -webkit-transition: -webkit-transform 400ms;}
.lifeList .con{ height: 25px; overflow: hidden; font-size: 16px; text-align: center; color:#9e9c9c;}
.lifeList li:hover{ background-color: #00833c;}
.lifeList li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.cfff{ color: #fff;}
/*healthy style end*/
.pinner{ max-width: 1200px; margin: 0px auto;}

.pageNavBox { height: 52px;}
.pageNavBox a:link, .pageNavBox a:visited { color: #fff;}
.pageNavBox a:active,.pageNavBox a:hover { color: #00833c;}    
.pagenav { background-color: #00833c; width: 100%;}
.pagenav.fixed{ position: fixed; left: 0; top: 52px; z-index: 1000;}
.pagenav.fixed .cpnavbox{ height: 40px; line-height: 40px;}
.cpnavbox {line-height: 50px; padding-top: 2px; -webkit-transition:height 0.3s;  transition:height 0.3s;}
.cpnavbox a { text-align: center; color: #ffffff; display: inline-block; margin-left: -3px; padding: 0px 30px;  *display: inline; *zoom: 1; position: relative;}
.cpnavbox a:before{ content:""; position: absolute; left: 0px; top: 0; width: 1px; height: 100%; display: block; background-color: #fff;}
.cpnavbox a:last-child:after{ content:""; position: absolute; right: 0px; top: 0; width: 1px; height: 100%; display: block; background-color: #fff;}
.cpnavbox a:hover, .cpnavbox a.active { background-color: #fff; color: #00833c; }
.cpnav { display: none; width: 100%; color: #fff; line-height: 40px; height: 40px; overflow: hidden; text-align: center; font-size: 14px; background-color: #a0733e; cursor: pointer; }
.caret { display: inline-block; width: 0px; height: 0px; margin-left: 10px; vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; }
.fixedImg { background-position: center top; background-repeat: no-repeat; background-size: cover;}




.ctabox{ background:#fff; position:relative; z-index:99; margin-top:-5%; }
.ctabox .pa{ padding:60px 100px 20px 100px; }
.ctaList .namebox{ width:33%; float:left; }
.ctaList .ti{ font-size:20px; color:#333; line-height:1.4; padding-right:20px; }
.ctaList .ctas{ width:49%; float:left; }
.ctaList .ctas .citme{ color:#666; line-height:25px; display:block; position:relative; padding-left:40px; margin-bottom:11px; padding-right:20px; } 
.ctaList .ctas .citme:before{ width:40px; height:25px; position:absolute; top:0; left:0; content:""; background-repeat:no-repeat; background-position:left center; }
.ctaList .ctas .c1:before{ background-image:url(../images/rr_cta_ico_1.png); }
.ctaList .ctas .c2:before{ background-image:url(../images/rr_cta_ico_2.png); }
.ctaList .ctas .c3:before{ background-image:url(../images/rr_cta_ico_3.png); }
.ctaList .ctas a:hover{ color:#a0733e; }
.ctaList .mabox{ width:18%; float:left; }
.ctaList .mabox .ma{ width:150px; text-align:center; line-height:1.4; max-width:100%; }
.ctaList .mabox .ma img{ display:block; width:100%; }
.ctaList li{ border-bottom:1px solid #ccc; padding:60px 0 36px 0; }
.ctaList{ border-top:2px solid #333; }
.ctaArea{ padding-bottom:75px; }
.ctaList .ctas a:hover:before{ -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); -webkit-animation: gelatine 0.5s 1; animation: gelatine 0.5s 1; }


.scrollpic{max-width:1048px;;margin:20px auto;}
#myscroll{display:block; width:100%; position:relative; height:175px; overflow:hidden;}
#myscroll #myscrollbox{display:block; float:left; position:absolute; left:0; top:0; width:1000000px;}
#myscroll ul{display:block; float:left; list-style-type:none; padding:0; margin:0;}
#myscroll ul li{display:block; float:left; padding:0; margin:0;}
#myscroll ul li a{display:block; float:left; width:242px; padding:0 10px; position:relative; height:175px; color:#333;}
#myscroll a .intro{position:absolute; left:0; z-index:10; background-color:rgba(255,255,255,.80); padding:0 10px;}
#myscroll a .intro h5{padding:0; margin:0; font-size:16px; font-weight:bold; padding:0 47px 0 15px; background:url(images/go.png) right no-repeat; height:40px; width:180px; line-height:40px; border-bottom:1px solid rgba(215,0,15,.2);}
#myscroll a .intro p{font-size:13px; line-height:20px; margin:10px 15px; height:40px; overflow:hidden;}
#myscroll a .intro{bottom:-61px;}
#myscroll a:hover .intro{bottom:0px;}

#mybtns{margin:10px; width:100%; display:block; height:42px;}
#mybtns a{width:42px; height:42px; display:block; float:left; margin-right:1px; background-color: #c1c1c1;}
#mybtns a:hover{background-color: #00833c;}
#mybtns a:hover, #myscroll, #mybtns a,#myscroll a:hover .intro, #myscroll a .intro,#myscroll #myscrollbox{
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#mybtns #left{background-image:url(../images/jt_l.png);}
#mybtns #right{background-image:url(../images/jt_r.png);}

@media(min-width:1572px){
.scrollpic{max-width:1572px; width:100%;}
#myscroll{width:780px;}
}
@media(max-width:1571px){
.scrollpic{max-width:1310px; width:100%;}
#myscroll{width:780;}
}
@media(max-width:1309px){
.scrollpic{max-width:1048px; width:100%;}
#myscroll{width:780px;}
}
@media(max-width:1047px){
.scrollpic{max-width:786px; width:100%;}
#myscroll{width:780px;}
}
@media(max-width:767px){
.scrollpic{max-width:524px; width:100%;}
#myscroll{width:524px;}
}
@media(max-width:523px){
.scrollpic{max-width:262px; width:100%;}
#myscroll{width:262px;}
}