@charset "utf-8";
*{ margin:0; padding:0;}
img,a{border:none;}
ul,ol,li{list-style:none;}
body {font-size:12px;font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;line-height:22px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing: grayscale;font-smooth:never; background-image:url('../images/background.jpg');}
img,a{border:none; text-decoration:none; }
.clear{ clear:both; height:1px; line-height:1px;}
a{ font-size:0.85vw; color:#6F6F6F;font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;}
a:hover{ text-decoration:none; color:#0385fd;font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;}
.input[type=text]:focus{outline:none;}
input.wide{width:250px;}
input.txt{width:60%;}
input.small{width:70px;}
.input{display:inline;margin-right:5px;padding:7px;height:20px;line-height:20px;vertical-align:middle;background:#fff;color:#999px;border:1px solid #e8e8e8;border-radius:2px;}
.btn{display:inline-block;margin:0;padding:0 25px;color:#fff;font-size:0.8vw;height:38px;line-height:38px;text-align:center;}
.btn{background:#0385fd;border:1px solid #02598E;border-radius:2px;vertical-align:middle;}
.btn:hover{color:#fff;opacity:0.9;}
.btn-mini{height:20px;line-height:20px;padding:1px 8px 0;}
/*---------------------------------------------------------------------------------------top and navigation*/
.head{ width:80%; height:15.5vh; margin: 0 auto;position: relative;}
.headleft{float:left; width: 33%; bottom: 0;position:absolute; }
.headleft img{float:left; width: 100%;}
#nav {float:left; width:100%; height: 6.8vh;line-height: 6.8vh;vertical-align:center;display:block;}
.headright{float:right; width: 55%; height: 6.8vh;line-height: 6.8vh;vertical-align:center;}
.headright ul{float:right; width: 100%;height: 6.8vh;line-height: 6.8vh; }
.headright ul li{float:right; width: 15.8%;height: 2.5vh; line-height: 2.5vh; text-align: center;}
.headright ul li p{line-height: 2vh;font-family:Copperplate Gothic light; font-size:0.7vw;}
.headright ul li a{color:#000; font-size:1.1vw; }
.headright ul li a:hover{color:#0385fd; font-size:1.1vw; }
.searchs{ float:right; width: 55%; height: 8.8vh; line-height:8.8vh;}
.search{float:right;}
.search .input{margin:0;padding:3px 0px 3px 4px;width:23vh;height:3vh;line-height:3vh;color:#777;border:1px solid #ccc;background:none; font-size: 0.9vw; }
.search .submit{width:7vh;height:3.7vh;line-height:3.7vh;text-color:#000;cursor:pointer; border:1px solid #ccc; }
.cur{color:#0385fd !important; font-size:1.15vw !important; font-weight: 500 !important;}
/*-------------------------------------------------------------------------------------------------banner效果切换代码*/
.banner{ width:100%; min-height:630px;max-height:680px;}
.slide { width:100%; min-height:630px;max-height:680px; position: relative; overflow:hidden; margin-bottom: 15px; }
.slide .num { overflow:hidden; height:10px; position: absolute; bottom:0px; padding-bottom:3vh; background:url(../images/banner.png) bottom center no-repeat; width:100%;zoom:1; z-index:3 }
.slide a.prev:hover {background-position:0px 0px;background-position: left; }
.slide a.next:hover {background-position:0px 0px;background-position: right; }
.slide .num ul{ width:32vh; margin:0 auto; display: table; text-align: center;}
.slide .num li { width: 7vh; height: 2.7vh; line-height:2.7vh; text-align: center; font-family:Copperplate Gothic light; color: #bc8104; font-size:0.9vw; background:#fff; margin-right:1vh; border-radius:3px; cursor:pointer; float: left; display: inline; }
.slide .num li.on { background: #02598E;} 
.slide .prev,
.slide .next { display: none; width: 40px; height:85px; background: url(../images/btn.png) no-repeat; position: absolute; top:150px;}
.slide .prev { left: 25px; background-position: left; }
.slide .next { right: 25px; background-position: right; }
/*-------------------------------------------------------------------------------------------------首页index.html*/
.indexnewstitlee{font-size:2vw;color: 000; height: 7vh; line-height: 7vh;text-align: center; }
.indexnewstitlee2{font-size:0.8vw;color: 000; height: 3vh; line-height: 3vh;text-align: center;font-family:Copperplate Gothic light; color: #949494;}
.indexnews{ width: 80%; margin: 0 auto; margin-top: 0.8vh; overflow: hidden;}
.indexnewsleft{width: 43%;float: left;clear: both; margin-top:1vh;}
/*---------------------------------------------------------------------------------------------------------------幻灯片样式*/
.focusbox{top:0;right:0;bottom:0;left:0;overflow:hidden;}
.focusbox .slides{display:block;width:100%;height:100%;zoom:1;overflow:hidden;}
.focusbox .slides:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.focusbox .slides li{width:100%;height:100%;overflow:hidden;}
.focusbox .slides li img{width:100%;height:100%;}
.focusbox .slides li .note-bg{position:absolute;left:0;right:0;bottom:0;width:100%;background:url(../images/pic-bg.png) 0 bottom repeat-x;_height:50px;_background:url(none) 0 0 repeat #000;}
.focusbox .slides li .note-txt{position:absolute;left:0;right:0;bottom:6px;display:block;height:50px;line-height:50px;color:#fff;font-size:1vw;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.focusbox .flex-control-nav{position:relative;right:-83%;bottom:40px;display:block;z-index:4;}
.focusbox .flex-control-nav li{margin:0 5px 0 0;display:inline-block;zoom:1;*display:inline;}
.focusbox .flex-control-nav li a{display:block;width:12px;height:12px;text-indent:-9999px;border:1px solid #999;border-radius:12px;cursor:pointer;overflow:hidden;}
.focusbox .flex-control-paging li a:hover{background:#333;}
.focusbox .flex-control-paging li a.flex-active{background:#0385fd;border-color:#f90;cursor:default;}
.indexnewsright{width: 54%;float: right;}
.indexnewsright_item{width: 100%; height: 20%;}
.indexnewsright_item h3{width: 100%; line-height:4vh; font-size: 1.03vw;color: #333;}
.indexnewsright_item p{width: 100%; line-height:2.9vh; font-size: 0.8vw; color: #444;}
.indexnewsright_item span{ font-size: 0.1vw; color: #444;}
.indexmores {width:15vh; font-size: 0.9vw;line-height: 4vh; color: #444444;text-align: center;  margin: 0 auto;margin-bottom: 2vh; margin-top: 1vh;}
.indexmores a{ width:15vh; float:left; font-size: 0.9vw;line-height: 4vh; color: #444444;border:1px solid #c5c5c5;text-align: center;margin-bottom: 2vh; }
.indexmores a:hover{ width:15vh; float:left; font-size: 0.9vw;line-height: 4vh; color: #fff;border:1px solid #0385fd;text-align: center; background-color: #0385fd;}
/*-------------------------------------------------------------------------------------------------indexaboutus*/
.indexaboutus{ width:80%; margin: 0 auto;height: auto; margin-bottom: 2vh;margin-top: 3.5vh;margin-bottom: 3vh;}
.indexaboutusleft{ width:50%; float: left; }
.indexaboutusleft img{ width:100%;}
.indexaboutusright{ width:49%; float: right; height: auto;margin-bottom: 3vh;}
.indexaboutusright h5{ width:100%; line-height: 5vh; font-size: 1.4vw; color: #066ac7;margin-top: 3vh;}
.indexaboutusright h6{ width:100%; line-height: 3vh; font-size: 0.9vw; color: #939292;font-family:Copperplate Gothic light;}
.indexaboutusright p{ width:100%; line-height: 4.4vh; font-size: 0.9vw; color: #555;}
.indexaboutusright ul{ width:100%; float:left; margin-top: 2vh;}
.indexaboutusright ul li{ width:33%; float:left;}
.indexaboutusright ul li h2{ width:100%; line-height: 3vh;font-size: 0.9vw; font-weight: normal;color: #444;}
.indexaboutusright ul li h3{ width:100%; font-size:2.8vw; color: #0385fd;line-height: 7vh;}
.indexaboutusright ul li span{ width:100%; font-size:0.9vw; color: #0385fd;line-height:1vh;}
.indexaboutusright ul li h4{ width:100%;line-height: 3vh;font-size: 0.9vw;font-weight: normal;color: #444;}

/*---------------------------------------------------------------------------------------------------------------------------indexindustry*/
.indexindustry{ width:100%;background:url(../images/indexindustry.jpg) 0 top repeat-x; overflow: hidden; height: auto; padding-top: 1vh;}
.indexindustry_detail{ width:81%; margin: 0 auto; clear: both; padding-left:1.5%;}
.indexindustry_detail ul{ width:100%; margin: 0 auto;}
.indexindustry_detail ul li{ width:18.5%; float: left; margin-right: 1.5%; }
.indexindustry_detail2{ width:100%; background-color: #fff; margin-bottom: 20px;clear: both;box-shadow:3px 3px 3px #ffffff;}
.indexindustry_detail2 img{ width:100%; height: auto;}
.indexindustry_detail2 p{ width:100%; height: 34px; line-height: 34px; border-bottom:2px solid #0385fd; background: #fff;text-align: center; font-size: 0.9vw;}
.indexindustrymores {width:15vh; font-size: 0.9vw;line-height: 4vh; color: #fff;text-align: center;  margin: 0 auto;margin-top: 1vh;  clear: both; background-color: #0385fd; margin-bottom: 2vh;}
.indexindustrymores a{ width:15vh; float:left; font-size: 0.9vw;line-height: 4vh; color: #fff;border:1px solid #c5c5c5;text-align: center;margin-bottom: 2vh;background-color: #0385fd; }
.indexindustrymores a:hover{ width:15vh; float:left; font-size: 0.9vw;line-height: 4vh; color: #0385fd;border:1px solid #0385fd;text-align: center; background-color: #fff;}
/*-------------------------------------------------------------------------------------------------industry*/
.industrybg{ with:100%;}
.industrytitle{font-size:2vw;color: 000; height: 7vh; line-height: 7vh;text-align: center;}
.industrytitle h1{font-size:2.3vw;color: 000; height: 5vh; line-height: 5vh;text-align: center;font-weight:normal; }
.industrytitlescrip1{height: 2px; margin: 0 auto;background-color: #0385fd;width: 50px;}
.industrytitlescrip2{height: 1px; margin: 0 auto; width: 110px; background-color: #E5E4E4;}
.industrytitle2{font-size:0.8vw;color: 000; height: 3vh; line-height: 3vh;text-align: center;font-family:Copperplate Gothic light; color: #949494;margin-bottom: 1vh; }

.industry{ width:80%;  margin: 0 auto; overflow: hidden; height:100%;display:table;}
.industryleft{ width:30%;  float: left; clear:both;height:100%;display:table;}
.industryleft img{ width:100%;}
.industryright{ width:67%; float: right; height:100%;overflow: hidden;display:table;}
.industryrighttitle{ width:100%;  float:left; font-size: 1.3vw;  font-weight: bolder; color: #333; line-height: 5vh;height:5vh; clear:both; }
.industryrightdetail{ width:100%; float:left; font-size: 0.9vw;line-height: 4vh; color: #666; }
.industryrightmore{ width:100px; float:left; font-size: 0.8vw;line-height: 4vh; color: #444444;text-align: center; margin-top: 1vh;}
.industryrightmore a{ width:100px; float:left; font-size: 0.8vw;line-height: 4vh; color: #444444;border:1px solid #c5c5c5;text-align: center; }
.industryrightmore a:hover{ width:100px; float:left; font-size: 0.8vw;line-height: 4vh; color: #0385fd;border:1px solid #0385fd;text-align: center; background-color: #e2f1ff;}
.industrycontent{ width:80%; margin: 0 auto; font-size: 1vw;color: #444444; line-height: 35px;}
.industrycontentmore2{ width:80%; margin: 0 auto; font-size: 14px;color: #444444; height: 950px;}
.industryrelate{ width:80%; margin: 0 auto; height: 350px; margin-top: 10px;}
.industryrelatetitle{ width:100%; height: 30px; line-height: 30px; border-bottom:1px solid #ddd;}
.industryrelatetitle h4{ width:400px; height: 30px; line-height: 3vh; float:left; font-size: 1.1vw;  padding-left: 10px;}
.industryrelatetitle h5{ width:5px; height: 2.5vh; line-height: 2.5vh; float:left; background-color: #0385fd;margin-left: 15px; margin-top: 5px;}
.industryrelatetitle p{ width:78px; height: 2vh; line-height: 2vh; float: right; padding-right: 10px;}
.industryrelateproduct { width:100%; margin-left: 1%;}
.industryrelateproduct ul{ width:100%; margin-top: 15px; }
.industryrelateproduct li{ width:23.5%; float: left;margin-right: 1.5%;}
.industryrelateproduct li img{ width:100%;}
.industryrelateproduct li p{ width:100%; text-align: center; font-size: 0.95vw;color: #444444; line-height: 30px; height: 60px;}
.industryopen{ width:1150px; margin: 0 auto; font-size: 14px;color: #444444; line-height: 25px;}
.detail{ width:80%; margin: 0 auto; line-height: 28px;}
.detailleft{ width:69%; float: left;}
.detaillefttitle{ width:100%; text-align: center; height: 6vh; font-size: 2vw; color: #066cca; line-height: 60px;}
.detaillefttitle2{ width:100%; text-align: center; height: 5vh; font-size: 0.8vw;text-align: center; color: #9E9D9D; line-height: 5vh;}
.detailleftcontent{ width:100%; line-height: 4vh; font-size: 1vw;color: #444444;}
.detailleftnext{ width:100%; line-height: 35px; font-size: 0.92vw;}
.gao{ margin-bottom:30px;}
.detailright{ width:28%; float: right;border:1px solid #e4e4e4;}
.detailright2{ width:98%; border-bottom:1px solid #eee; height: 600px; height: 35px; margin: 0 auto;}
.detailright2 h5{ width:100px;  height:25px; font-size: 0.9vw; line-height: 25px; margin-top: 9px; float: left; margin-left: 5px; font-weight: normal;}
.detailright2 h6{ width:5px;  height:22px; line-height: 22px; margin-top: 10px; float: left; margin-left: 5px; background-color: #0385fd;}
.detailright3{ width:98%; margin: 0 auto; margin-top: 12px;}
.detailright3 ul{ width:100%; margin-left: 5px;}
.detailright3 ul li{ width:47%; float: right; margin-right: 3%;}
.detailright3 ul li img{ width:100%;}
.detailright3 ul li p{ width:100%; height: 48px; line-height: 24px; margin: 0 auto; text-align: center; margin-top: -5px; font-size: 0.8vw}
.detailright4{ width:96%; margin: 0 auto; margin-top: 12px; height: 55px;}
.detailright4 img{ width:20%;}
.detailright4 h3{ width:78%; height: 40px; line-height: 20px; float: right; font-weight: normal;}
.detailright4 p{ width:78%; line-height: 18px; float: right;font-family:Copperplate Gothic light; margin-top: -22px; color: #B8B6B6;}
.detailright4 a{ color: #373636;}
.detailright4 a:hover{ color: #0385fd;}
/*-------------------------------------------------------------------------------------------------aboutus*/
.aboutusbg{ with:100%;}
.aboutus{ width:80%; margin: 0 auto; font-size: 1vw;color: #444444; line-height: 4vh;background-image:url('../images/background.jpg');}
/*-------------------------------------------------------------------------------------------------news*/
.newscenterbg{ with:100%; }
.newscenter2{ width:80%; margin: 0 auto; font-size: 14px;color: #444444; margin-bottom: 20px;}
.news{width:100%;  }
.newsleft{float:left; width: 18%;}
.newsleft img{width: 100%;height: auto; max-height:20vh;}
.newsright{float:right;width: 79%; }
.newsrighttitle{width: 100%; line-height: 3vh; font-size: 1.1vw; font-weight: bold; color: 333;height: 3vh;}
.newsrightdate{width: 300px; font-size: 0.9vw;font-family:Copperplate Gothic light;line-height: 3.5vh;height: 3.5vh;}
.newsrightdetail{width: 100%; font-size: 0.9vw; line-height: 3.3vh;color: #444444;}
.newsrightmore{ width:10vh; float:left; font-size: 0.7vw;line-height: 3vh; color: #444444;text-align: center; margin-top: 0.5vw;}
.newsrightmore a{ width:10vh; float:left; font-size: 0.7vw;line-height: 3vh; color: #444444;border:1px solid #c5c5c5;text-align: center; }
.newsrightmore a:hover{ width:10vh; float:left; font-size: 0.7vw;line-height: 3vh; color: #0385fd;border:1px solid #0385fd;text-align: center; background-color: #e2f1ff;}
.newstiao{ height:1px;border-bottom:1px solid #f8f6f6; margin-top: 20px;margin-bottom: 20px;}
.newstiao2{ height:1px;border-bottom:1px solid #f8f6f6; margin-top: 15px;margin-bottom: 15px;}
.newsinfo{ width:80%; margin: 0 auto; font-size: 14px;color: #444444; line-height: 6vh;}
.newsinfotitle{ width:80%; margin: 0 auto; font-size: 2vw;color: #333; line-height: 6vh; text-align: center;}
.newsinfotitle h1{font-size: 2vw;color: #066cca; line-height: 6vh; text-align: center;}
.newsinfodate{ width:1150px; margin: 0 auto; font-size: 0.8vw;color: #444444; line-height: 5vh;text-align: center;height: 5vh;}
.newsinfocontent{ width:100%; margin: 0 auto; font-size: 1vw;color: #444444; line-height: 4vh; margin-bottom: 2vh;}
.newsinfonext{ width:100%; margin: 0 auto; font-size: 0.92vw;color: #444444; line-height: 4vh; text-align: left;height: 4vh;}
.newsinfonext a{ width:100%; margin: 0 auto; font-size: 0.92vw;color: #444444; line-height: 4vh;height: 4vh;}
.newsinfonext a:hover{ width:100%; margin: 0 auto; font-size: 0.92vw;color: #0385fd; line-height: 4vh;height: 4vh;}
.newsinforelate{ width:80%; margin: 0 auto; font-size: 14px;color: #444444; line-height: 25px; height: 320px; margin-top: 30px; }
.newsinforelate2{ width:100%;  font-size: 1vw;color: #444444; line-height: 25px; height: 400px; margin-top: 10px;}
.newsinforelate2 ul{ width:100%; margin-top: 20px;}
.newsinforelate2 ul li{ width:50%; float:left; margin-bottom: 1.2vh;}
.newsrelatepic{ width: 100%; height: 91px;}
.newsrelatepic img{ float: left; width: 17%;}
.newsrelatepic2{ float: right; width:79%; margin-right: 10px;}
.newsrelatepic2 h4{width:95%; font-size: 1vw;line-height: 3.3vh;}
.newsrelatepic2 h5{width:95%; font-size: 0.83vw; font-weight: normal; line-height: 3vh;}
.newsrelatepic2 a{ font-size: 0.83vw;}
/*----------------------------------------------------------------------------------------------------fanye*/
.fanye{padding:5px 10px;text-align:center;font-size:1.3vw;margin-bottom:15px;clear:both;height:38px;font-family:candara; margin-left: -30px; margin-top: 30px;}
.fanye a,div.fanye span{display:inline;margin-left:4px;padding:5px 15px;height:26px;border:1px solid;border-color:#ddd;background-color:#FFF;background-repeat:no-repeat;color:#333;overflow:hidden;text-decoration:none;border-radius:2px;font-size:1.3vw;font-family:candara;}
.fanye span{color:#555;font-size:1.3vw;font-family:candara;}
.fanye span.current{font-weight:bold;background-color:#0385fd;color:#fff;border-color:#ddd;font-size:1.3vw;font-family:candara;}

.fanye a:hover{border-color:#D0D0D0;}
/*-------------------------------------------------------------------------------------------------contactus*/
.contactusbg{ with:100%; height: 260px;background: url(../images/contactusbg.jpg) top center no-repeat;}
.contactus{ width:80%; height: 85%; margin: 0 auto;border:1px solid #eee; margin-bottom:3vh;display:block;overflow: hidden;}
.contactusleft{ width:49%; height: 50vh; float: left;}
.contactusright{ width:49%; height: 50vh; float: right;}
.telphone{ width:50vh; height: 5vh; line-height: 5vh; margin-bottom: 8px; font-size: 1.2vw;color: #333;}
.tel{width:44vh; height: auto; margin-top: 11vh; margin-left: 5vh;}
.telphone p{  height: 30px; line-height: 3vh; float: right; width: 45vh; font-size: 1.1vw; color: #444; text-align:left;}
/*-------------------------------------------------------------------------------------------------message*/
.messagebg{ with:100%;}
.form-box{position:relative;padding:10px;border:1px solid #f6f6f6;font-size:0.9vw; margin-bottom:50px;}
.form-box dl{display:block;padding:5px 0;}
.form-box dl:after{clear:none;content:"";display:block;height:0;visibility:hidden;}
.form-box dl dt{display:block;float:left;width:120px;line-height:38px;min-height:38px;color:#555;font-size:0.9vw;text-align:right;_position:absolute;}
.form-box dl dd{position:relative;padding:5px 0 5px 10px;line-height:28px;min-height:28px;color:#555;font-size:0.9vw;overflow:hidden;_margin-left:120px;}
.form-box dl dd label.radio{margin-right:5px;}

/*-------------------------------------------------------------------------------------------------bottom*/
.bottom{ width:100%; height: auto; background-color: #eee;border-top:1px solid #e4e3e3;overflow:hidden; margin-top:3vh;}
.bottomcenter{ width:75%; height: auto; margin: 0 auto;clear:both;margin-top:3vh;}

.bottomdetail1{ width:15%; height: auto; float: left; }
.bottomdetail1 img{ width: 95%;}
.bottomdetail1 p{width: 100%; height: 4vh; text-align: center; font-size: 0.9vw;color: #6F6F6F;}

.bottomdetail2{ width:40%; height: auto; float: left; margin-left: 10%;}
.bottomdetail2 ul{ width:100%; margin-left:5px;}
.bottomdetail2 ul li{ width:50%;  font-size: 0.93vw; color: #6F6F6F; float: left; line-height:4.3vh;}
.bottomdetail2 ul li a{ font-size: 0.93vw; color: #6F6F6F;}
.bottomdetail2 ul li a:hover{ font-size: 0.93vw; color: #0385fd;}
.bottomtitle{width: 100%; height: 3vh; line-height: 3vh;border-bottom:1px solid #ddd;margin-top: 2px; margin-bottom: 5px; padding-left: 5px; font-size: 1vw; color: #686767;}

.bottomdetail3{ width:25%; height: auto; float: right;}
.bottomdetail3 ul{ width:100%; margin-left:5px;}
.bottomdetail3 ul li{ width:100%; font-size: 0.93vw; color: #6F6F6F; float: left;line-height:4.3vh;}
.bottomtitle2{width: 100%; height: 3vh; line-height: 3vh;border-bottom:1px solid #ddd;margin-top: 2px; margin-bottom: 5px; padding-left: 5px; font-size: 1vw; color: #686767;}

.bottomm{ width:100%; height: 4vh; background-color: #e4e3e3;}
.bottomm2{ width:70%; height: 4vh; background-color: #e4e3e3; margin: 0 auto; line-height: 4vh; }
.bottomm2left{ width:280px; height: 4vh; line-height: 4vh; float: left; margin-left: 40px;color: #6F6F6F;font-size: 0.9vw;}
.bottomm2right{ width:600px; height: 4vh; line-height: 4vh; float: right;color: #6F6F6F;text-align: right;}
.bottomm2right a{  height: 4vh; line-height: 4vh; float: right;color: #6F6F6F;font-size: 0.9vw; margin-left: 20px;}
.bottomm2right a:hover{ color: #0385fd;}
.bottomm2right img{ vertical-align: middle;}
.guangshu { display:block; position: relative; width:100%; height:auto; margin:0 auto;}
.guangshu:before { content: ""; position: absolute; width:100px; height: 100%; top: 0; left: -10px; overflow: hidden;
background: -moz-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.2)50%, rgba(255,255,255,0)100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(50%, rgba(255,255,255,.2)), color-stop(100%, rgba(255,255,255,0)));
background: -webkit-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.2)50%, rgba(255,255,255,0)100%);
background: -o-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.2)50%, rgba(255,255,255,0)100%);
-webkit-transform: skewX(-12deg);
-moz-transform: skewX(-12deg)
}

.guangshu:hover:before { left: 150%; transition: left 1s ease 0s; }