/* reset css */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{padding:0;margin:0;}
fieldset, img{border:0;}
table{border-collapse: collapse;border-spacing:0;}
ol,ul{list-style: none;}
address,caption,cite,code,dfn,em,strong,th,var{font-weight:normal;font-style:normal;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-weight: normal;font-size: 100%;}
q:before,q:after{content:'';}
abbr,acronym{border:0;}
i {font-style: normal;}


/* begin */
body { font-family:'微软雅黑','Microsoft Yahei','Arail'; font-size: 12px; color: #666; background-color: #282828; }
a,a:hover,a:active { -webkit-tap-highlight-color:rgba(0,0,0,0); text-decoration: none; }
html, body { *overflow-x:hidden; -webkit-overflow-scrolling:touch; }
body.of { overflow: hidden; }
input,button,textarea,select { font-family:'微软雅黑','Microsoft Yahei','Arail'; outline: none; }
input,button { -webkit-appearance:none; }

input:-moz-placeholder { color: rgba(255,255,255,0.5); }
::-webkit-input-placeholder { color:rgba(255,255,255,0.5); }
::-moz-selection { color: #fff;  background: #109d59; }
::selection      { color: #fff;  background: #109d59; }

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { *zoom:1; }
.hide { display: none; }
.show { display: block; }
.fl {float: left; }
.fr {float: right; }
.inlineblock { display:inline-block;zoom:1;*display:inline;overflow:hidden;vertical-align:middle; }
.ofh { word-wrap:break-word;word-break:break-all;display:block; }
.doing { -o-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out; }

.sd { box-shadow: 0 -1px 10px rgba(0,0,0,0.2); -moz-box-shadow: 0 -1px 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 -1px 10px rgba(0,0,0,0.2); }

@keyframes myloading {
	0% { border: 1px #eee solid; }
	50% { border: 1px #109d59 solid; }
	100% { border: 1px #eee solid; }
}
@-moz-keyframes myloading {
	0% { border: 1px #eee solid; }
	50% { border: 1px #109d59 solid; }
	100% { border: 1px #eee solid; }
}
@-webkit-keyframes myloading {
	0% { border: 1px #eee solid; }
	50% { border: 1px #109d59 solid; }
	100% { border: 1px #eee solid; }
}
@-o-keyframes myloading {
	0% { border: 1px #eee solid; }
	50% { border: 1px #109d59 solid; }
	100% { border: 1px #eee solid; }
}

/* public */
.r5 { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
.circle { border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; }
.count { font-style: italic; }
.desc { color: #999; }
i { font-size: 16px; }
.info_area h5 { font-size: 12px; line-height: 25px; font-weight: normal; border-bottom: 1px #ddd solid; padding: 50px 0 10px; margin-bottom: 15px; }
.info_area h5 i { float: left; margin-right: 5px; }
.mt20 { margin-top: 20px; }

/* button */
.btn_green { background-color: #109d59; color: #fff; }
.btn_green:active { background-color: #0d8049; color: #fff; }
.btn_more { background-color: #fff; color: #999; }
.btn_more:hover { background-color: #f3f3f3; }
.btn_more:active { background-color: #ddd; color: #666; }

.button_print { padding: 5px 7px; font-size: 12px; display: block; position: fixed; top: 10px; right: 10px; z-index: 99; }

/* sound */
.sound_area { width: 38px; height: 38px; position: fixed; top: 55px; right: 10px; z-index: 99; }
.sound_area .sa_start { width: 36px; height: 36px; line-height: 36px; text-align: center; background-color: #fff; border: 1px #ccc solid; overflow: hidden; font-size: 16px; color: #109d59; animation:myloading 1s linear infinite; -moz-animation:myloading 1s linear infinite; -webkit-animation:myloading 1s linear infinite; -o-animation:myloading 1s linear infinite; cursor: pointer; }
.sound_area .sa_start:hover { background-color: #f3f3f3; }
.sound_area .sa_info { position: absolute; right: 30px; top: 0; background-color: #fff; border: 1px #ccc solid; box-shadow: 0 1px 3px rgba(0,0,0,0.2); -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2); padding: 5px; width: 190px; display: none; }
.sound_area:hover .sa_info { display: block; }
.sound_area .sa_info ul li,.sound_help ul li { list-style: none; line-height: 25px; }
.sound_area .sa_info ul li i,.sound_help ul li i { float: left; margin-right: 5px; font-size: 16px; color: #aaa; }

.sound_help { background-color: #fff; bottom: -360px; left: 50%; z-index: 9990; position: fixed; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; display: none; }
.sound_help h3 { font-size: 18px; color: #bbb; line-height: 25px; margin-bottom: 2%; }
.sound_help h3 i { font-size: 20px; margin-right: 10px; float: left; }
.close_help { width: 40px; height: 40px; line-height: 40px; text-align: center; position: absolute; right: 2%; top: 2%; font-size: 32px; color: #aaa; }

.bye { width: 100%; height: 100%; position: fixed; background-color: #333; z-index: 9999; left: 0; top: 0;  display: none; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; }
.bye span { width: 100%; text-align: center; height: 50px; line-height: 50px; margin-top: -25px; top: 50%; left: 0; position: absolute; font-size: 32px; color: #999; }


/* layout */
.main { margin: 0 auto; background-color: #fff; }
.content { width: 88%; padding: 6%; margin: 0;  background-color: #fff;}
.header { padding: 0 0 3%; border-bottom:1px solid #000; }
.avatar { width: 152px; height: 152px; position: relative; }
.avatar .avatar_pic { width: 150px; height: 150px; display: block; background: url(../images/bols.jpg) no-repeat center center;  border: 1px #ccc solid; overflow: hidden; }
.avatar:hover .avatar_pic { animation:myloading 1s linear infinite; -moz-animation:myloading 1s linear infinite; -webkit-animation:myloading 1s linear infinite; -o-animation:myloading 1s linear infinite; }
.avatar .avatar_pic em { width: 130px; height: 130px; line-height: 130px; text-align: center; position: absolute; left: 1px; top: 1px; background-color: rgba(255,255,255,0.95); color: #999; font-size: 22px; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; border: 10px #fff solid; }
.avatar:hover .avatar_pic em { filter:alpha(opacity=100); -moz-opacity:1; opacity:1; }
.avatar:active .avatar_pic em { filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7; }

.avatar b { width: 36px; height: 20px; line-height: 20px; background-color: #ccc; color: #fff; position: absolute; top: 50%; right: -18px; margin-top: -10px; text-align: center; font-weight: normal; }
.base { padding: 27px 0 0; position: relative; }
.base p { color: #aaa; line-height: 20px; }
.base p.desc { color: #ccc; }
.base h2 { font-size: 32px; color: #999; font-weight: normal; padding: 5px 0; }
.base span p { padding: 0 0 10px; }
.base span i { font-size: 16px; color: #999; margin-right: 5px; float: left; }
.tel_me { color: #aaa; }
.tel_me:hover { color: #999; border-bottom: 2px #999 solid; }
.information { width: 100%; border-bottom:1px solid #000;}
.info_content p { line-height: 22px; margin-bottom: 20px; overflow: hidden; }
.info_content p em { margin: 0 5px; }
.info_content ul li { list-style: none; overflow: hidden; position: relative; }
.info_content ul li h3 { font-size: 12px; color: #333; line-height: 25px; }
.info_content ul li:hover h3 { color: #109d59; }
.info_content ul li h3 i { float: left; margin-right: 10px;  }
.info_content ul li:hover h3 i { color: #109d59; }
.info_content ul li h3 em { color: #999; padding-left: 10px; }
.info_content ul li p { padding-left: 26px; color: #999; }
.info_content ul li p i { margin-left: 5px; }
.info_content ul li .btn_go i { float: right; font-size: 20px; }
.info_content ul li .btn_more { width: 80px; height: 30px; line-height: 30px; border: 1px #ccc solid; display: block; margin-left: 26px; text-align: center; display: none; }
.info_content ul:hover li .btn_more { display: block; }

.info_timeline ul li { list-style: none; position: relative; overflow: hidden; padding-bottom: 20px; }
.info_timeline ul li .dot { width: 2px; height: 100%; position: absolute; left: 4px; top: 0; background-color: #666; }
.info_timeline ul li .dot b { border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; width: 10px; height: 10px; position: absolute; left: -6px; top: 4px; background-color: #333; border: 2px #fff solid; }
.info_timeline ul li.top .dot { top: 10px; }
.info_timeline ul li.top .dot b { top: -6px; }
.info_timeline ul li.bottom .dot { height: 10px; }
.info_timeline ul li.top .dot b { top: -6px; }
.info_timeline ul li .con { padding-left: 30px; }
.info_timeline ul li .con h3,.info_timeline ul.focus li.curr .con h3 { font-size: 14px; color: #333; line-height: 22px; padding-bottom: 3px; }
.info_timeline ul li .con p { line-height: 25px; }
.info_timeline ul.focus li.curr .con p { color: #666; }
.info_timeline ul li .con p.desc,.info_timeline ul.focus li.curr .con p.desc { color: #999; }
.info_timeline ul.focus li.curr .dot,.info_timeline ul.focus li.curr .dot b { background-color: #109d59; }
.info_timeline ul.focus li .dot,.info_timeline ul.focus li .dot b { background-color: #bbb; }
.info_timeline ul.focus li .con h3,.info_timeline ul.focus li .con p,.info_timeline ul.focus li .con p.desc { color: #bbb; }

.info_timeline ul li .conright { padding-left: 30px;}
.info_timeline ul li .conright h3,.info_timeline ul.focus li.curr .conright h3 { font-size: 14px; color: #333; line-height: 22px; padding-bottom: 3px; }
.info_timeline ul li .conright p { line-height: 25px;  }
.info_timeline ul.focus li.curr .conright p { color: #666;   }
.info_timeline ul li .con p.desc,.info_timeline ul.focus li.curr .conright p.desc { color: #999; }
.info_timeline ul.focus li .conright h3,.info_timeline ul.focus li .conright p,.info_timeline ul.focus li .conright p.desc { color: #bbb; }


.info_timeline dl dt { float: left; line-height: 25px; color: #999; }
.info_timeline dl dt h6 { color: #333; }
.info_timeline dl dt i { float: left; margin-right: 5px; }
.info_timeline dl dt em { color: #ccc; margin-left: 3px; }
.info_timeline dl dd { float: right; line-height: 25px; }
.info_timeline dl dd b,.info_timeline dl dd em { border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; float: left; width: 10px; height: 10px; margin: 7px 5px 0 0; }
.info_timeline dl dd b { background-color: #666; }
.info_timeline dl dd em { background-color: #ddd; }
.footer { width: 94%; background-color: #666; color: #fff; padding: 15px 3%;text-align:center; }
.footer a { color: #fff; }

/* tip */
.tip_avatar_bg { width: 20px; height: 20px; background-color: #fff; position: fixed; top: 50%; left: 50%; z-index: 99; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; display: none; }
.tip_avatar { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 100; display: none; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; overflow-x: hidden; background-color: #000; }
.tip_close { position: absolute; right: 20px; top: 20px; font-size: 48px; color: #fff; z-index: 101; }
.tip_avatar_con { width: 100%; height: 100%;}
.tip_avatar_con .desc { width: 100%; position: absolute; bottom: 0; height: 30px; line-height: 30px; text-align: center; color: #a22f1e; }
.tip_right{ position: absolute; left:680px; top 300px;}
.tip_right p { color: #000; line-height: 22px; padding-top: 10px; }
.tip_right p.en { color: #e6897b; }
.tip_right p i { float: left; margin-right: 10px; }
.tip_right h2 { font-size: 36px; color: #000; }


.tip_product { width: 100%; height: 100%; position: fixed; left: 0; top: 100%; z-index: 99; background-color: rgba(255,255,255,0.2); }

/* content */
.tip_content { width: 100%; height: 100%; position: relative; overflow: hidden; }

.item { width: 100%; position: relative; display: none; }
.item.active { left: 0; display: block; }

.banner { width: 100%; height: 400px; overflow: hidden; position: relative; }
.banner .logo { width: 200px; height: 200px; position: absolute; top: 50%; left: 50%; margin-left: -100px; margin-top: -100px; z-index:  110;}
.banner .banner_bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 100; background-color: rgba(0,0,0,0.5); }

/* product logo */
.banner.product_h1 { background: url(../images/product_1_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h1 .logo { background: url(../images/product_1_logo.png) no-repeat center center rgba(0,0,0,0); height: 80px; margin-top: -40px; }
.banner.product_h2 { background: url(../images/product_2_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h2 .logo { background: url(../images/product_2_logo.png) no-repeat center center; }
.banner.product_h3 { background: url(../images/product_3_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h3 .logo { background: url(../images/product_3_logo.png) no-repeat center center; }
.banner.product_h4 { background: url(../images/product_4_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h4 .logo { background: url(../images/product_4_logo.png) no-repeat center center; width: 270px; height: 80px; margin-top: -40px; margin-left: -135px; }
.banner.product_h5 { background: url(../images/product_5_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h5 .logo { background: url(../images/product_5_logo.png) no-repeat center center; width: 220px; margin-left: -110px; }
.banner.product_h6 { background: url(../images/product_6_bg.jpg) no-repeat fixed 50% 0; background-size: cover; }
.banner.product_h6 .logo { color: #fff; text-align: center; line-height: 200px; font-size: 22px; }

.tip_area_close { width: 40px; height: 40px; line-height: 40px; text-align: center; position: fixed; left: 10px; top: 10px; z-index: 120; display: block; overflow: hidden; font-size: 32px; color: #fff; display: none; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; }

.description h3 { font-size: 14px; color: #aaa; border-top: 1px #eee solid; border-bottom: 1px #eee solid; padding: 15px 0; margin-bottom: 20px; }
.description h3 i { font-size: 16px; float: left; margin-right: 10px; }
.description h3 a { float: right; padding: 2px 5px; font-size: 12px; }
.description p {font-size: 16px; color: #666; padding: 15px 0; line-height: 2; }
.description p.quote { padding: 0 0 0 20px; margin: 15px 0; border-left: 5px #ddd solid; font-style: italic; color: #999; }
.description p.pic  { width: 100%; text-align: center; padding: 30px 0; }
.description p img { margin: 0 auto; }
.description p img:hover { -moz-box-shadow: 0 2px 5px rgba(0,0,0,0.2); -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.2); box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.description p span { width: 100%; display: block; line-height: 25px; color: #999; font-size: 12px; text-align: center; }
.description .time { width: 100%; border-top: 1px #eee solid; margin: 50px 0 0; padding: 50px 0; text-align: center; font-size: 22px; color: #bbb; }
.description .time em { margin: 0 5px; color: #999; font-style: italic; }
.description .time b { margin: 0 10px; color: #ddd; }


/* carousel */
.carousel { width: 100%; height: 100%; position: relative; }
.carousel-inner { position: relative; width: 100%; height: 100%; overflow-x: hidden; }
.carousel-inner > .item { display: none; height: 100%; position: relative; -webkit-transition: 0.6s ease-in-out left; transition: 0.6s ease-in-out left; }
.carousel-inner > .active,.carousel-inner > .next,.carousel-inner > .prev { display: block; }
.carousel-inner > .active { left: 0; }
.carousel-inner > .next,.carousel-inner > .prev { position: absolute; top: 0; width: 100%; }
.carousel-inner > .next { left: 100%; }
.carousel-inner > .prev { left: -100%; }
.carousel-inner > .next.left,.carousel-inner > .prev.right { left: 0; }
.carousel-inner > .active.left { left: -100%; }
.carousel-inner > .active.right { left: 100%; }
.carousel-control { position: absolute; background-color: rgba(0,0,0,0.5); }
.carousel-control i { font-size: 16px; }
.carousel-control:hover,.tip_area_close:hover { background-color: rgba(0,0,0,0.6); }
.carousel-control:active,.tip_area_close:active { background-color: rgba(0,0,0,0.7); }