.solution {  /*height: 600px;*/ height: 542px; position: relative; z-index:10; overflow: hidden; width:96%; margin:0 auto; margin-bottom:45px;}
.solution>.posr {height: 100%; max-width:80%; width: 80%; margin: 0 auto;} 
.solution .contain { width:49.8%; height: 100%; position: relative; transition: all .5s ease-out;-webkit-transition: all .5s ease-out;-o-transition: all .5s ease-out;-moz-transition: all .5s ease-out; z-index: 1; position: absolute; top: 0; overflow: hidden; overflow: hidden; margin:0 1px;background: #fff;}
@media screen and (min-width:800px) {
	.solution>.posr:hover .contain { width: 20%; z-index: 1; }
    .solution>.posr .contain:hover { width: 80%; z-index: 2; }
}
.solution .contain>* {  z-index: 2;position: relative; }
	.solution .contain .bg { z-index: 0; width: 100%; height: 100%; position: absolute; }
	.solution .contain .bg > div { position: absolute; left: -10px; right: -10px; bottom: -10px; top: -10px; background-size: cover; background-position: center;}
	.solution .contain .bg:before { content: '';position: absolute; top: 0;right: 0; bottom: 0; left: 0;/* background: rgba(0,0,0,0.6); */z-index: 2;}

.solution .contain .videobg { position: absolute; top: 0; left: 0; width: 100%;height: 100%; z-index: 1; opacity: 0; transition: all .5s ease-out;-webkit-transition: all .5s ease-out;-o-transition: all .5s ease-out;-moz-transition: all .5s ease-out;}
.solution .contain .videobg:before { content: '';position: absolute; left:0; right: 0;bottom: 0; top: 0; background: rgba(0,0,0,0.4); transition: all .5s ease-out;-webkit-transition: all .5s ease-out;-o-transition: all .5s ease-out;-moz-transition: all .5s ease-out; }
.solution .contain .videobg video { height: 100%; /*padding-left: 50%; margin-left: -960px;*/ }
.solution .audio { left: 0; background: #333; }
.solution .video { right: 0; /*background: #666;*/ }
	.solution .text { position: absolute; top: 50px; left: 10%; color: #000; }
	.solution .text h1 { font-size: 30px; letter-spacing:1px; font-weight: normal; margin-bottom:5px; white-space: nowrap;text-overflow:ellipsis; overflow:hidden;}
	.solution .text small { font-size: 14px; white-space: nowrap;text-overflow:ellipsis; overflow:hidden; }
	.solution .btns { position: absolute; top: 65%; left:5%; border-top:none; width: 340px; transition: all .5s ease-out;-webkit-transition: all .5s ease-out;-o-transition: all .5s ease-out;-moz-transition: all .5s ease-out; height: 130px; }
	.solution .contain:hover .btns { border-color: rgba(255,255,255,0); }
		.solution .btns ul { position: relative; height: 100%;display:-moz-box;display:-webkit-box;display:box;}
			.solution .btns ul:before { content: '';display: block; left: 0; right: 0; top: 0; background:Rgba(250,250,250,1); position: absolute; z-index: 0;height: 0; border-radius: 5px; overflow: hidden;}
		.solution .btns ul li { float: left; width:33%; position: relative; z-index: 1; text-align: center; display: none; height: 100%;transition:1s;}
		.solution .audio .btns ul li { width: 33.333%; } 
			.solution .btns ul li:before { content: '';left: 0; top: 9px; bottom: 0; width: 1px;background: #e0e0e0;position: absolute; }
			.solution .btns ul li:first-of-type:before { display: none; }
			.solution .btns ul li a { padding: 23px; display: block;}
            .solution .btns ul li a:hover {color: #f08300;}
.solution .btns ul li a:hover i {color: #3fa683;}
.solution .btns ul li a:before { content: 'MORE'; font-size: 12px; line-height: 60px; padding-left: 40px; color: #fff;  background: #37b8ab;background: -moz-linear-gradient(left,  #37b8ab 0%, #3cc78d 100%);background: -webkit-linear-gradient(left,  #37b8ab 0%,#3cc78d 100%);background: linear-gradient(to right,  #37b8ab 0%,#3cc78d 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37b8ab', endColorstr='#3cc78d',GradientType=1 );position: absolute; top: 100%; left: 0;right: 0; text-align: left; -webkit-animation: flipIn .5s ease-out; -o-animation: flipIn .5s ease-out;  -moz-animation: flipIn .5s ease-out; animation: flipIn .5s ease-out; display: none; transform-origin: top center;}
			.solution .btns ul li a:after { content: '\e64e';font-family: 'iconfont';position: absolute; line-height: 60px; top: 100%; right: 0; padding-right: 40px; font-size: 30px; color: #fff; display: none;transform-origin: top center; -webkit-animation: flipIn .5s ease-out; -o-animation: flipIn .5s ease-out;  -moz-animation: flipIn .5s ease-out; animation: flipIn .5s ease-out; display: none; transform-origin: top center;}
			.solution .btns ul li .iconfont { font-size: 40px; color: #444; display: block; line-height:39px;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;}
			.solution .btns ul li p { font-size: 14px; white-space: nowrap;text-overflow:ellipsis; overflow:hidden; }
	/*.solution .btns:before {content: '\e61a';font-family: 'iconfont'; display: inline-block; line-height: 55px; width: 55px; text-align: center; border-radius: 100%; background: #37b8ab;background: -moz-linear-gradient(left,  #37b8ab 0%, #3cc78d 100%);background: -webkit-linear-gradient(left,  #37b8ab 0%,#3cc78d 100%);background: linear-gradient(to right,  #37b8ab 0%,#3cc78d 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37b8ab', endColorstr='#3cc78d',GradientType=1 ); color:#fff; font-size: 20px; position: absolute; left: -60px; top: -22px; transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out; opacity: 1; }*/
	.solution .btns >p { position: absolute; left: 0; top: 12px; font-size: 12px; line-height: 24px; color: #fff; text-transform: uppercase; }

	.solution:hover .contain .btns { opacity: 0; }
	.solution:hover .contain:hover .btns { opacity: 1; }
	.solution .contain:hover .videobg { opacity: 1; }
	.solution .contain:hover .videobg:before { opacity: 0.5; }
	.solution .contain:hover .btns { width: 600px; }
	.solution .contain:hover .btns:before { opacity: 0; }
	.solution .contain:hover .btns > p { opacity: 0; }
	.solution .contain:hover .btns ul li { display: block; }
	.solution .contain:hover .btns ul:before { height: 100%; transition: all .5s ease-out .5s;-webkit-transition: all .5s ease-out .5s;-o-transition: all .5s ease-out .5s;-moz-transition: all .5s ease-out .5s;}
	/*.solution .btns ul li:hover a:after ,
	.solution .btns ul li:hover a:before { display: block; }*/
	.solution .btns ul li:hover .iconfont { color: #2fc296; }
@media screen and (max-width: 1600px) {
	.solution { height: 520px; width:96%; margin:0 auto; margin-bottom:45px;}
}
@media screen and (max-width: 1400px) {
	.solution { height: 500px;  width:96%; margin:0 auto; margin-bottom:45px;}
	.solution .contain .btns { height: 100px;}
	.solution .contain:hover .btns { width: 660px; height: 100px;}
	.solution .btns ul li a { padding: 7px 0; }
	.solution .btns ul li .iconfont { font-size: 30px; line-height: 25px; }
	.solution .btns ul li p { letter-spacing: 0; font-size: 13px; }
	.solution .btns ul li:hover a:after ,
	.solution .btns ul li:hover a:before { line-height: 50px; padding: 0 20px; }
	.solution .text {top:60px; }
}
@media screen and (max-width: 1200px) {
	.solution { width:96%; margin:0 auto; margin-bottom:45px;}
	.solution { height:480px; }
}
@media screen and (max-width: 1024px) {
	.solution { height: 460px;  width:96%; margin:0 auto; margin-bottom:45px;}
	.solution .btns { width: 250px; }
	.solution .contain:hover .btns,
	.solution .contain .btns {  height: 90px;}
	.solution .contain:hover .btns { width: 500px;}
	.solution .btns ul li a { padding: 10px 0; }
	.solution .btns ul li .iconfont { font-size: 30px; line-height: 20px; }
	.solution .btns ul li .iconfont img { width:20%;}
	.solution .btns ul li p { letter-spacing: 0; font-size: 12px; }
	.solution .text h1 {font-size:26px; margin-bottom:1px;letter-spacing: 0;}
	.solution .btns { top: 60%; }
	.solution .btns ul li:hover a:after ,
	.solution .btns ul li:hover a:before { line-height: 40px; padding: 0 10px;  }
	.solution .btns:before { font-size: 15px; line-height: 40px; width: 40px; left: -45px; }
}
@media screen and (max-width: 800px) {
	.solution .text h1 {font-size: 25px; margin-bottom: 0; }
	.solution .text small { font-size: 12px; }
	.solution .text { top: 30px;left:30px; }
	.solution { height:450px;width:96%; margin:0 auto; margin-bottom:45px; }
	.solution .contain { position: relative; top: auto; left: auto; bottom: auto; right: auto; float: none; width: auto; height: 480px;}
	.solution .contain:hover {width: auto; }
	.solution:hover .contain { width: auto; }
	.solution .contain .videobg { display: none !important; }
	.solution .btns >p,
	.solution .btns:before { display: none !important; }
	.solution .btns ul:before { display: none; }
	.solution .btns ul { background: #fff; }
	.solution .btns ul li { display: block !important; }
    .solution .btns ul li p {white-space: normal;line-height: 1.5;}
	.solution .btns { left: 0; right: 0; bottom: 0; top: auto; width: auto; }
	.solution .contain:hover .btns:before {display: none; }
	.solution .contain .btns,
	.solution .contain:hover .btns,
	.solution:hover .contain .btns { width: auto; display: block !important; opacity: 1;height: auto; border-bottom: 2px solid #3fa683; }
	.solution .contain .bg:before { background: rgba(0,0,0,0.4); }
	.solution .contain .bg > div {filter:url(blur.svg#blur);-webkit-filter: blur(0px);-moz-filter: blur(0px);-o-filter: blur(0px);-ms-filter: blur(0px);filter:blur(0px);filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=0, MakeShadow=false);}
}
@media screen and (max-width: 480px) {
	.solution .btns ul li .iconfont {font-size: 25px; line-height: 30px; }
	.solution .contain { height: 300px; }
}

.toolbar-item,.toolbar-layer{background:url(../images/toolbar.png) no-repeat;}
.toolbar{position:fixed;right:0px;bottom:50px; z-index:1500;}/*假设网页宽度为1200px，导航条在右侧悬浮*/
.toolbar-item{display:block;width:52px;height:52px;margin-top:1px;position:relative;-moz-transition:background-position 1s;-ms-transition:background-position 1s;-o-moz-transition:background-position 1s;-webkit-moz-transition:background-position 1s;transition:background-position 1s;}
.toolbar-item:hover .toolbar-layer{opacity:1;filter:alpha(opacity=100);transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}
.toolbar-item-weixin{background-position:0 -798px;}
.toolbar-item-weixin:hover{background-position:0 -860px;}
.toolbar-item-weixin .toolbar-layer{height:212px;background-position:0 0;}
.toolbar-item-feedback{background-position:0 -426px;}
.toolbar-item-feedback:hover{background-position:0 -488px;}
.toolbar-item-app{background-position:0 -550px;}
.toolbar-item-app:hover{background-position:0 -612px;}
.toolbar-item-app .toolbar-layer{height:194px;background-position:0 -222px;}
.toolbar-item-top{background-position:0 -674px;}
.toolbar-item-top:hover{background-position:0 -736px;}
.toolbar-layer{position:absolute;right:46px;bottom:-10px;width:172px;opacity:0;filter:alpha(opacity=0);
transform-origin: 95% 95%;-moz-transform-origin: 95% 95%;-ms-transform-origin: 95% 95%;-o-transform-origin: 95% 95%;-webkit-transform-origin: 95% 95%;transform:scale(0.01);
-moz-transform:scale(0.01);-ms-transform:scale(0.01);-o-transform:scale(0.01);-webkit-transform:scale(0.01);transition:all 1s;-moz-transition:all 1s;-ms-transition:all 1s;-o-transition:all 1s;-webkit-transition:all 1s;}
