@charset "gb2312";
body, h1, h2, h3, h4, h5, h6, p, div, ul, li, dl, dt, dd, h1{margin:0; padding: 0;}
html{font:12px/1.5 'microsoft yahei',Arial;}
input,textarea{font-size:12px;overflow:auto; padding:0; padding-left:3px;resize:none;}
textarea{ padding:3px 0 0 3px;}
li{list-style:none;}
img{border:none; margin:0; padding:0; vertical-align:top;max-width: 100%;}
a{text-decoration:none; color:#000;}
a:hover{text-decoration:none; color:#CC0033}
table{border-collapse:collapse;border-spacing:0}
body{ background-color:#fff; color:#000; font-family:Microsoft YaHei}
h1,h2,h3,h4,h5,h6{ text-align:left; }
em{ font-style:normal}
.w460{width:460px;}
.w590{width:590px;}
.h310{ height:310px;}
/*clearfix*/
.clearfix:after{clear:both; content:" "; display:block; height:0; visibility:hidden}
.clearfix{display:inline-block;zoom:1}
*html .clearfix{height:1%}
.clearfix{display:block}
/* tag settings */
img{border:none; margin:0; padding:0; vertical-align:top;max-width: 100%;}
a:link, a:visited, a:hover, a:active {text-decoration: none;}
.border{ border:1px dotted #1e553d}
.fl{float:left}
.fr{float:right;}
.Tcolor-g{color:#27823e;}
.Tcolor-w{ color:#fff}
.Tcolor-grey{ color:#333}
.Bcolor-w{ background:#fff}
.Bcolor-g{ background:#7dce90}
.Bcolor-w{ background:#fff}
.Bcolor-grey{ background:#f0f0f0}
.Bcolor-g1{ background:#27823e}
.line{ border-bottom:1px dotted #4fa262; font-size:0px; line-height:0; height:1px}
.wap{width:1000px; margin:0 auto; position:relative; z-index:501}


/* html */
html, body {
	height: 100%;
	background: #7acb8d;
}

/* main nav */
#main_nav {
	max-width:1000px;
	width: 100%;
	z-index: 1000;
	height:auto;
	position: fixed;
	top: 0;
	left: 50%;
	margin-left:-500px;
}
#home_link {
	display: block;
	max-width:256px;
	max-height:36px;
	width:100%;
	float:left;
}

/* block */
html.js #main_content{
	position: fixed;
	width: 100%;
	height: 100%; top:0px; left:0px
}

#screen_block li {
	overflow: hidden;
	height: 100vh; /* use viewport height if support */
	min-height: 768px;
	min-height: 100vh;
}

html.js #screen_block li{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto;
	height: auto;
	min-height: 0;
}

html.js #screen_block li:first-child {
	z-index: 600;
}



#screen_block [data-semantic-role="caption-image"] {
	width: 80%;
	max-width: 620px;
}

#screen_block [data-semantic-role="title"], #screen_block [data-semantic-role="content"] {
	width: 80%;
	max-width: 768px;
	text-align: center;
}

#screen_block [data-semantic-role="title"] {
	margin-bottom: 0.4em;
	font-family: "Dosis";
	font-size: 3em;
	font-weight: bold;
}

/* Content */
#screen_block [data-semantic-role="content"] {
	font-size: 2em;
}


/* sub menu */
#sub_nav {
	position: fixed;
	top: 0;
	right: 20px;
	height: 83%;
	z-index: 900;
	padding-top:17%;
}


#sub_nav ul {
	display: inline-block;
	vertical-align: middle;
}

#sub_nav li {
	margin-bottom: 5px;width:100px;overflow:hidden;
}

#sub_nav a {
	display: block;
	width: 15px;
	height: 15px;
	overflow: hidden;
	text-indent: -999em;
	filter:alpha(opacity=50);/* IE */
	-moz-opacity:0.5;
	opacity: 0.5;
	background: url(images/moff.png) no-repeat  ;
	font-size: 0;
	line-height: 0;
	background-size: contain;
	vertical-align: middle;
}
#sub_nav li a,#sub_nav li span{float:right;}
#sub_nav li span{display:none;height:15px;line-height:15px;padding-right:10px;}

#sub_nav a:hover, #sub_nav a.cur {
	filter:alpha(opacity=100);/* IE */
	-moz-opacity:1;
	opacity: 1;
}


/* footer */
.footer_b {
	margin-top: 0;
	height:65px;
    width:64px;
}

html.js .footer_b {
    background:url("images/btn.png") scroll no-repeat center center transparent;cursor:pointer;
	position: fixed;
	bottom: 5px;
	margin: 0 auto;
	z-index: 1000; left:49% }
	#footer{border:none}
.h2{ text-align:center; margin-top:70px;}
.box{ width:1000px; margin:0 auto;}
.box:after{clear:both; content:" "; display:block; height:0; visibility:hidden}

.swipe {overflow: hidden;visibility: hidden;position: relative;}
.swipe-wrap {overflow: hidden;position: relative;}
.swipe-wrap > div {float:left;width:100%;position: relative;}
.swipe .dots{ width:100%; position:absolute; z-index:100; height:15px; left:0; bottom:2%; text-align:center;}
.swipe .dots a{ display:inline-block;background:#bebdb9; width:70px; height:100%;text-indent:-6000px;  margin:0 2px}
.swipe .dots .on{ background:#ee5c5a}
.swipe .dots .off{background:#bebdb9}

#screen_block li .box{width:1000px;height:600px;position:absolute;left:50%;top:50%;margin:-300px 0 0 -500px;}

#background {
    background:url("images/bg01.jpg") scroll no-repeat  center 28px  #78cb8c;
    width:2220px;height:100%;
    top: 0;left: 50%;right: 0;margin-left:-1110px;position: absolute;z-index:5;
}

#keewee_char-item-mlms,#keewee_char-item-engagement,#keewee_char-item-contact_us,#keewee_char-item-payment{background-color:#7dce90;}
#keewee_char-item-crm,#keewee_char-item-loyalty{background-color:#fff;}
#keewee_char-item-presence,#keewee_char-item-social{background:url("box2.jpg") scroll no-repeat center bottom #fff;}




@keyframes blink{
    0%{opacity:0;transform:scale(0.8,0.8);}
    95%{opacity:1;transform:scale(1,1);}
    100%{opacity:1;transform:scale(1,1);}
}
@-webkit-keyframes blink{
    0%{opacity:0;-webkit-transform:scale(0.5,0.5);}
    95%{opacity:1;-webkit-transform:scale(1,1);}
    100%{opacity:1;transform:scale(1,1);}
}
@-moz-keyframes blink{
    0%{opacity:0;-moz-transform:scale(0.5,0.5);}
    95%{opacity:1;-moz-transform:scale(1,1);}
    100%{opacity:1;transform:scale(1,1);}
}

@-webkit-keyframes waterdrop{
    0%{opacity:0;-webkit-transform:translate3d(0,0,0);}
    40%{opacity:1;-webkit-transform:translate3d(0,0,0);}
    60%{opacity:1;-webkit-transform:translate3d(0,0,0);}
    100%{opacity:1;-webkit-transform:translate3d(0,50%,0);}
}
@-moz-keyframes waterdrop{
    0%{opacity:0;-moz-transform:translate3d(0,0,0);}
    40%{opacity:1;-moz-transform:translate3d(0,0,0);}
    60%{opacity:1;-moz-transform:translate3d(0,0,0);}
    100%{opacity:1;-moz-transform:translate3d(0,50%,0);}
}
@keyframes waterdrop{
    0%{opacity:0;transform:translate3d(0,0,0);}
    40%{opacity:1;transform:translate3d(0,0,0);}
    60%{opacity:1;transform:translate3d(0,0,0);}
    100%{opacity:0;transform:translate3d(0,50%,0);}
}
/*²¨ÀË1*/
@keyframes wave1{
    0%{transform:translateX(0);}
    100%{transform:translateX(197px);}
}
@-webkit-keyframes wave1{
    0%{-webkit-transform:translateX(0);}
    100%{-webkit-transform:translateX(197px);}
}
@-moz-keyframes wave1{
    0%{-moz-transform:translateX(0);}
    100%{-moz-transform:translateX(197px);}
}
/*²¨ÀË2*/
@keyframes wave2{
    0%{transform:translateX(0);}
    100%{transform:translateX(136px);}
}
@-webkit-keyframes wave2{
    0%{-webkit-transform:translateX(0);}
    100%{-webkit-transform:translateX(136px);}
}
@-moz-keyframes wave2{
    0%{-moz-transform:translateX(0);}
    100%{-moz-transform:translateX(136px);}
}
/*²¨ÀË3*/
@keyframes wave3{
    0%{transform:translateX(0);}
    100%{transform:translateX(108px);}
}
@-webkit-keyframes wave3{
    0%{-webkit-transform:translateX(0);}
    100%{-webkit-transform:translateX(108px);}
}
@-moz-keyframes wave3{
    0%{-moz-transform:translateX(0);}
    100%{-moz-transform:translateX(108px);}
}
/*²¨ÀË4*/
@keyframes wave4{
    0%{transform:translateX(0);}
    100%{transform:translateX(87px);}
}
@-webkit-keyframes wave4{
    0%{-webkit-transform:translateX(0);}
    100%{-webkit-transform:translateX(87px);}
}
@-moz-keyframes wave4{
    0%{-moz-transform:translateX(0);}
    100%{-moz-transform:translateX(87px);}
}
.box{z-index:10;}

.box1{ background:url(images/index_pic.gif) no-repeat center top}
.box1 p{ color:#12582f; font-size:14px; line-height:32px; text-indent:2em;width: 680px;margin-top: 380px;margin-left: 200px;}
.tilte{width:955px; margin:0 auto}
.tilte .tt{width:797px; height:74px; background:url(images/nav_b.png) left top no-repeat;}
.tilte .tt1{width:797px; height:74px; background:url(images/nav_b.png) left -1200px  no-repeat;}
.tilte .tt strong{ font-size:50px;  font-family:microsoft yahei; font-weight:normal; padding-left:40px; float:left; padding-right:45px}
.tilte .tt1 strong{ font-size:50px;  font-family:microsoft yahei; font-weight:normal; padding-left:15px; float:left; padding-right:25px}
.tilte .tt p,.tilte .tt1 p{float:left;font-size:16px; margin-top:35px}
.tilte span{width:158px; height:70px; background:url(images/nav_b.png) no-repeat; display:inline-block; float:left; margin-top:0px}
.tilte span.part1{ background-position: -3px -120px;}
.tilte span.part2{ background-position: -3px -242px;}
.tilte span.part3{ background-position: -3px -376px;}
.tilte span.part4{ background-position: -3px -547px;}
.tilte span.part5{ background-position: -3px -680px;}
.con{width:958px; margin:30px auto; padding:20px; display:inline-block}
.con h3{ background:url(images/nav_b.png) left -825px; margin-bottom:10px}
.con h3 strong{ padding:5px 10px;  font-size:30px; font-weight:normal}
.con dl dt{ position:relative; }
.con dl dt span{ position:absolute; display:inline-block; width:100%; left:0px; bottom:0px; color:#fff; font-size:18px; text-align:center; line-height:35px}
.con dl dd{ padding:10px; line-height:24px; text-indent:2em}
.box2 .con .fl{width:468px; padding-right:30px; border-right:1px solid #065b52}
.box2 .con .fr{width:410px; margin:0px 10px 0px 25px}
.box2 .con .fr b{width:200px; font-size:16px; margin-top:10px; line-height:30px; color:#fff; background:#27823e; padding:3px 10px; display:inline-block; clear:both }
.box2 .con .fr p{ color:#333333; font-family:SimSun; line-height:24px; padding-bottom:10px; border-bottom:1px dashed #aaaaaa; margin-top:5px}
.box2 .con .fr p a{ color:#07ab7b}
.box2 .con .fr p.no_b,.box3 .w340 p.no_b{ border-bottom:none}

.box3 .change_t{width:170px;}
.box3 .change_t a{width:170px; height:57px; line-height:57px; font-size:24px; text-align:center; color:#436f4e; display:inline-block; background:#cffad9; margin:10px auto; position:relative}
.box3 .change_t a span{width:6px; height:16px; display:inline-block; position:absolute; right:-10px; top:20px}
.box3 .change_t a:hover span,.box3 .change_t a.hover span{ background:url(images/nav_b.png) no-repeat left -999px; }
.box3 .change_t a:hover,.box3 .change_t a.hover{ background:#27823e; color:#fff}
.box3 .change_c{width:400px; margin-top:10px}
.box3 .con .w590{ padding-right:15px; border-right:1px solid #065b52}
.box3 .con .w340{width:340px;}
.box3 .w340 b{width:200px; font-size:16px; margin-top:10px; line-height:28px; color:#fff; background:#27823e; padding:3px 10px; display:inline-block; clear:both }
.box3 .w340 p{ line-height:24px; color:#333333; font-family:SimSun; line-height:22px; padding-bottom:5px; border-bottom:1px dashed #fff; margin-top:5px}
.box3 .w340 p a,.box5 .con .fr p a{ color:#97ffaf}
.box3 .w340 p a:hover,.box2 .con .fr p a:hover,.box5 .con .fr p a:hover{ color:#FFB312}

#screen_block li .box4{width:1000px;height:720px;position:absolute;left:50%;top:45%;margin:-300px 0 0 -500px;}

.box4 dl{width:454px; padding-right:20px; border-right:1px dashed #bfbfbf; margin-right:25px }
.box4 dl.no_r{ border-right:none; margin-right:0px; padding-right:0px}
.box4 .list a{width:448px; display:inline-block; float:left; line-height:30px; color:#27823e; background:url(images/nav_b.png) 10px -928px; padding-left:30px; font-size:14px}

.box5 .con .fl{width:454px; padding-right:20px; border-right:1px solid #065b52; margin:10px 0px}
.box5 .con .fr b{width:400px; font-size:14px; margin-top:0px; line-height:20px; color:#fff; background:#27823e; padding:3px 10px; display:inline-block; clear:both }
.box5 .con .fr p{ color:#333333; font-family:SimSun; line-height:18px; padding-bottom:3px;  margin-top:3px}

/*ÍùÆڻعË*/
.topbox{ width:1000px; margin:0 auto; position:relative}
.backtobox{ position:absolute; height:20px; top:120px; left:72px; z-index:500 }
.backto{ float:left; position:relative; height:20px; font-size:12px; color:#888;  line-height:20px; cursor:pointer; border:1px solid #e4e4e4; background:url(images/num.gif) no-repeat 60px -49px #fff; width:74px; padding-left:5px}
.backto div{ background:#27823e; width:79px; position:absolute; top:20px; left:0; overflow:hidden}
.backto div a{width:79px;height:20px; line-height:22px;text-decoration:none; color:#FFF; display:inline-block; padding-left:5px}
.backto a:hover{width:79px;background:#fff;color:#27823e; display:inline-block; text-indent:none}