@charset "utf-8";


body,p,form,textarea,h1,h2,h3,h4,h5,dl,dd{margin:0px;}
input,button,ul,ol{margin:0px;padding:0px;}
body,input,button,form{font:14px/1.5 "微软雅黑", "宋体", "Arial Black";color:#e0a849;}
body{ background: #190a26;}
h1,h2,h3,h4,h5,h6{font-size:14px; font-weight:normal;}
ul,ol,li{list-style:none;}
img{border:0px;}
em{ font-style:normal;}
button,input,select,textarea{font-size: 100%;}
table {border-collapse: collapse;border-spacing:0;}

a{ text-decoration:none; color:#e0a849; }
a:hover{ text-decoration:none; color:#ffe492; }
a:visited{ text-decoration:none;}
.w996{ width:996px; margin:0px auto;}
.yellow{ color:#fcdd80;}
.fl{ float:left;}
.fr{ float:right;}
.hidden{ display: none; }

.clearfix:after { visibility:hidden; display:block; font-size: 0;content: " "; clear:both; height:0;}
.clearfix{ *zoom:1; }
.icon{ background:url(../../../../../content/templaes/c20163n/style/images/icon.png) no-repeat; display:inline-block; vertical-align:middle; }

.pager { display:block; width:100%; height:auto; padding:25px 0 5px; text-align:center; clear:both; margin-bottom:5px; }
.pager span, .pager a{ display:inline-block; border:1px solid #644a51; color:#e0a849; background:#210a3b; height:20px; line-height:20px; padding:0px 8px; text-decoration:none; margin:0 5px; border-radius:1px; }
.pager a:hover{ background:#e0a849; border-color:#644a51; color:#210a3b; text-decoration:none;}
.pager .cur{ background:#e0a849; border-color:#644a51; font-weight:bold; color:#210a3b; }
.pager span.dot{ background:#644a51; border-color:#644a51; font-weight:bold; color:#fff; }

.reLink {  width:768px;height:30px; line-height:30px; border:1px solid #644a51;  margin-bottom:15px; }
.reLink .prevLink { float:left; margin-left:10px; }
.reLink .nextLink { float:right; margin-right:10px; }

.reInformation { width:748px; padding:0 10px 20px;margin-bottom:20px; border:1px solid #644a51; }
.reInformation .tit { height:36px; line-height:36px;  padding-left:10px;border-bottom:1px solid #644a51;  margin-bottom:10px; color:#e0a849;  }
.reInformation li { float:left; width:228px; padding:10px 10px 0; text-align:center; display:inline; }
.reInformation li img { width:228px; height:170px; }
.reInformation li img:hover { opacity:0.8; filter:Alpha(opacity=80); }
.reInformation li a{ display:block; }
.reInformation li a:hover{ color:#ffe492; }

.header{ width:100%; height: 125px; background: #1a032e;}
.header .headerCon{ padding:0px 147px; background: url(../../../../../content/templaes/c20163n/style/images/logobg.jpg) no-repeat left bottom;}
.hlogo{ height: 125px; margin-left: -60px; }
.logo{ width:251px; height:82px; padding-top: 25px;}
.topad{ height:76px; padding:20px 0px 0px 16px; margin:20px 0px 0px 18px; font-size:20px; line-height:28px; color:#fbe600; background:url(../../../../../content/templaes/c20163n/style/images/logosplit.png) no-repeat left center; }
.topad span{ display:block; font-size: 17px; line-height: 22px; color: #e4ad55; }
.topad strong{ font-size: 28px; }

.tel{ width:259px; padding-top:45px; line-height:20px; margin-right: -60px;}
.tel span{ font-size: 15px; line-height:17px; padding-top:4px; color:#ce9c50;}
.tel strong{ display:block; font-size:26px;font-weight: bold;}
.tel s{ width:50px; height:46px; background-position: 0px 0px; }

.nav{ width:100%; height: 70px; background:url(../../../../../content/templaes/c20163n/style/images/navbg.jpg) repeat-x center center;  position: relative; z-index: 10;}
.nav ul{ padding-left:24px;}
.nav li{ float: left; width: 134px; height: 70px; line-height: 70px; font-weight: bold; font-size: 14px; position:relative; background: url(../../../../../content/templaes/c20163n/style/images/libg.jpg) no-repeat center bottom; margin-left: -24px;}
.nav li a.nav1{ display: block; width:100%;  color: #fff; text-align: center;}
.nav li a.nav1:hover,.nav li a.nav1.hover{  background:url(../../../../../content/templaes/c20163n/style/images/ahoverbg.jpg) center top no-repeat; }
.nav .subNav{ width: 127px; position:absolute; left:0px; top:70px; z-index:11;  background:#29044c; }
.nav .subNav a{ width:100%; height:50px; line-height: 50px; text-align:center; display:block;  color: #fff; background:url(../../../../../content/templaes/c20163n/style/images/subnavli.jpg) no-repeat center bottom; }
.nav .subNav a:hover{ font-weight: bold; background:url(../../../../../content/templaes/c20163n/style/images/subnavbg.jpg) no-repeat center bottom; }

.banner, .banner ul, .banner img { height:402px; }
.banner { width:100%; min-width:1000px; position:relative; border-bottom: 2px solid #feb43f; background:#190a26; }
.banner ul { width:100%; }
.banner li { width:100%; position:absolute; z-index:1; overflow:hidden; background:#FFF; }
.banner img { width:1920px; display:block; position:relative; left:50%; margin-left:-960px; top:0; }
.banner .tip { width:910px; height:22px; padding-right: 90px; line-height:0; font-size:0; text-align:right; position:absolute; left:50%; margin-left:-720px; bottom:10px; z-index:3; }
.banner .tip span { display:inline-block; width:32px; height:7px; margin:0 4px; cursor:pointer; background:#3d0c70;}
.banner .tip span.cur { background:#fcdd80; }

.minBanner img{margin-left: -960px!important;width: 1920px;}
.minBanner, .minBanner ul, .minBanner img{height:300px;}

.search { width:100%; height:78px; line-height:78px; margin-bottom: 20px; background:url(../../../../../content/templaes/c20163n/style/images/searchbg.jpg) repeat-x 0px 0px; color:#ddbd8a; }
.search_form{ width:305px; height:44px; position: relative; margin-top: 18px; background-position: 0px -105px;}
.search_form input{ border:0px; } 
.search_form .stxt{ width:240px; height:40px; position: absolute; left:8px; top:0px; display:block; line-height:40px; text-indent: 1em; background:none; color:#60477e; }
.search_form .sbtn{  width:28px; height:24px; position: absolute; right:15px; top:10px; display:block; background-position: -60px 0px; cursor:pointer; }
.search .skey{ }

.itit{ width: 100%; text-align: center;  padding: 30px 0px 25px; line-height: 32px; position: relative; }
.itit h2{ display:inline-block; *display:inline; zoom:1; font-size: 26px; font-weight: bold; color:#fadb87;}
.itit .en{ color:#8b7753; font-size: 26px; }
.itit span{ width:395px; height:32px; display: block; overflow:hidden; position: absolute; bottom:35px; }
.itit span.left{ left:60px; background-position:0 -248px;  }
.itit span.right{ right:60px; background-position:0 -214px;  }

.ipro{padding-bottom: 40px;}
.iproList{ width: 768px; overflow: hidden;}
.iproList .list{ width:120%;}
.iproList .item{ width:241px; padding:1px; float: left; margin:0px 20px 23px 0px; background: #240b3f;}
.iproList .item .img{ width:239px; height:179px; display: block; overflow: hidden; border: 1px solid #190a26;}
.iproList .item .img img{ width:239px; height:179px; display: block; transition:all 500ms ease;}
.iproList .item .txt{ width:94%; padding:0 3%; height:50px; line-height: 50px;}
.iproList .item .txt h3 a{ color:#e0a849; display: block;}
.iproList .item .txt h3 a:hover{ color:#fadb87;}
.iproList .item .txt .order{ width:54px; height:24px; text-align:center; float:right; line-height: 24px; color:#240b3f; margin-top: 13px; display: block; background:url(../../../../../content/templaes/c20163n/style/images/icon.png) no-repeat; display:inline-block; vertical-align:middle;background-position: -137px 0px;}
.iproList .item:hover .txt{ background: url(../../../../../content/templaes/c20163n/style/images/icon.png) no-repeat 0px -156px; }
.iproList .item:hover h3 a{  color:#fadb87;}

.iproList .item:hover img{ transform: scale(1.04,1.04);}

.inews .itit span{ bottom:25px;}
.inews{ width: 100%; padding: 30px 0px 30px; background: #0f0419; color: #e0a849;}
.inews a{ color:#e0a849; }
.inewsCon{ width:100%; position:relative; overflow:hidden; }
.inewsCon .list{ width:300%; position: relative; }
.inewsCon .item{ width:253px; float:left; padding:30px 1px 30px 0px; background:url(../../../../../content/templaes/c20163n/style/images/part2split.jpg) no-repeat right center; }
.inewsCon .item.nosplit{ background-image:none !important; }
.inewsCon .item a.img{ width:253px; height:190px; position: relative; display: block; cursor:pointer; }
.inewsCon .item a.img .zz{ width:253px; height:190px; position: absolute; left:0px; top:0px; background:url(../../../../../content/templaes/c20163n/style/images/yuanx.png) no-repeat 0px 0px;}
.inewsCon .item a.img img{ width:253px; height:190px; display: block;}
.inewsCon .item h3{ width:200px; margin: 20px auto 20px; text-align: center; font-size:16px; }
.inewsCon .item .txt{ width:200px; margin: 0px auto 20px; line-height: 21px; font-size: 14px; height:68px;  overflow:hidden; }
.inewsCon .item a.more { width:134px; height:37px; text-align: center; margin: 0px auto; display: block; line-height: 37px; border:1px solid #bc8e44; border-radius: 37px; }
.inewsCon .item:hover{  background: #180925; }
.inewsCon .item:hover a.img .zz{  background-image: url(../../../../../content/templaes/c20163n/style/images/yuanxhover.png); }
.inewsCon .item a.img:hover h3,.icaseCon .item a.img:hover .txt{ color:#fff; }
.inewsCon .item:hover a.more { -webkit-animation:flap 1s ease-in-out forwards; animation:flap 1s ease-in-out forwards; }


.lastpart{ width:100%; padding: 5px 0px 30px; background: url(../../../../../content/templaes/c20163n/style/images/lastbg.jpg) repeat 0px 0px;}
.icase .itit span{ bottom:24px;}
.icaseCon{ width:100%; overflow: hidden; position: relative; padding-bottom: 30px;}
.icaseCon .list{ width:300%;}
.icaseCon .list .box{ width:249px; float:left;}
.icaseCon .list .item{ width:237px; height:179px; margin:0px 10px 11px 0px; border:1px solid #8e7a5f; position: relative; overflow: hidden;}
.icaseCon .list .item img{ width:100%; height:100%; display: block; transition:all 500ms ease;}
.icaseCon .list .item:hover img{ transform: scale(1.04,1.04);}
.icaseCon .list .item .wd{ width:100%; height:100%; line-height: 178px; text-align: center; display: block; position: absolute; left:-237px; top:-179px; color: #fff; background: url(../../../../../content/templaes/c20163n/style/images/yback.png) repeat 0px 0px;}
.icaseCon .list .item .wd s{ width:17px; height: 17px; background-position: -100px 0px; margin-right: 5px;}
.icaseCon .list .big{ width:496px; height:370px; float: left;}
.icaseCon .list .big .wd{ left:-496px; top:-370px;  line-height: 370px;}
.icaseCon .tip{ width:100%; height:16px; padding:20px 0px 20px; text-align: center;}
.icaseCon .tip span{ width:16px; height:16px; border-radius:16px; cursor:pointer; background:#e6b653;  display:inline-block; margin:0px 8px;}
.icaseCon .tip span.cur{  background:#ffe799; }
.lastpart .tit {width: 100%; height:68px; line-height: 68px; margin-bottom: 20px;  color:#fadb87;  border:1px solid #6b4f57; background: url(../../../../../content/templaes/c20163n/style/images/tit2.jpg) no-repeat left bottom;}
.lastpart .tit h2{ font-size: 24px; font-weight: bold; text-indent: 1em;}
.lastpart .tit a{ font-size: 16px; margin-right: 18px; }

.iabout{ width:565px;}
.iaboutCon{ width: 100%;height: 315px; overflow: hidden; background: #170920;}
.iaboutCon .img{ width:100%; height:135px; overflow:hidden; display: block; margin-bottom: 20px;}
.iaboutCon .txt{ width:90%; padding:0 5%; color: #e0a849; line-height: 26px;}

.icontact{ width:352px;}
.icontact .iconCon{ height:315px; overflow: hidden;}
.icontact .ctel { width: 100%; margin-bottom: 20px;}
.icontact .ctel span{ width:139px; height:47px;  line-height: 50px; text-align: center; color:#d3a14b; margin-right: 10px; font-size: 18px;  letter-spacing: 2px;  background-position: -221px -48px;}
.icontact .ctel strong{ font-weight: bold; font-size: 26px; color:#ffdd84; display: inline-block; vertical-align: middle; }
.icontact .txt{ color:#e0a849; line-height: 30px;}

.footer{ width:100%; height: 196px; overflow: hidden; text-align: center; background:url(../../../../../content/templaes/c20163n/style/images/footerbg.jpg) repeat-x 0px 0px;}
.footer .btnav{ width:100%; height:42px; line-height: 42px; margin: 40px 0px 10px; text-align: center; position: relative; border:1px solid #a17c40; }
.footer .btnav a{ padding:0px 22px; display: inline-block; vertical-align: middle; color:#e3af4e;}
.footer .btnav span{ width:2px; height:42px; display: inline-block; vertical-align: middle; background:url(../../../../../content/templaes/c20163n/style/images/bnavlibg.jpg) no-repeat center center;}
.footer .btnav a:hover{ color:#886438;}
.footer .btnav s{ width: 28px; height: 28px; position: absolute; background-color: #140520;}
.footer .btnav s.left{ top:-8px; left:-8px; background-position:-214px 0px; }
.footer .btnav s.right{ bottom:-8px; right:-8px; background-position:-250px 6px; }
.footer .friendLink{ font-size: 12px; color:#886438; }
.footer .friendLink a{ margin-right: 10px; color:#886438; }
.footer .friendLink a:hover{ color:#886438;}
.footer .copyright{ width:100%; line-height: 26px; color:#886438; font-size: 12px;}
.footer .copyright a{ color:#886438;}
.footer .copyright a:hover{ color:#e3af4e;}

.wrapper{ padding: 24px 0px 20px;}
.content { width:768px;}
.content .ctit{ width: 100%; height:68px; line-height: 68px; margin-bottom: 20px;  background: url(../../../../../content/templaes/c20163n/style/images/sitepath.jpg) no-repeat left bottom; }
.content .ctit h2{ height: 68px; font-size: 24px; color:#fadb87;  font-size: 24px; font-weight: bold; text-indent: 1em; background: url(../../../../../content/templaes/c20163n/style/images/web/ctith2bg.png) no-repeat left bottom;}
.content .sitepath { float:right; height:40px; line-height:40px; color: #fadb87; padding-top: 15px; margin-right: 10px; font-size:14px; }
.content .sitepath a,.contact .sitepath span{ color:#fadb87;}
.content .sitepath a:hover { text-decoration:underline; }

.sideBar{ width:201px;}
.sideBar .tit{ width:201px; height:82px; text-align: center; padding-top: 26px; background: url(../../../../../content/templaes/c20163n/style/images/protitbg.jpg) no-repeat 0px 0px; line-height: 28px; }
.sideBar .tit span{ font-size:20px; color:#fadb87; filter:Alpha(opacity=58); opacity: 5.8; }
.sideBar .tit h2{ color:#f9d780; font-weight: bold; font-size: 24px; }
.sideBar .list { width: 199px; padding:15px 0px 0px;  background: #210a3b; border:1px solid #644a51; border-top: 0px; }
.leftNav .list li{ width:100%; height:50px; padding-bottom: 2px; position: relative; background:url(../../../../../content/templaes/c20163n/style/images/slidebarlibg.png) repeat-x left bottom; *vertical-align: bottom;}
.leftNav .list li a{ width: 100%; height:50px; text-align: center; line-height: 50px; display: block; color:#e0a849;} 
.leftNav .list li s{ width:9px; height: 9px; position: absolute; left:40px; top:50%; margin-top: -5px; background-position: -64px -31px; display:none; }
.leftNav .list li.hover a,.leftNav .list li:hover a{ background: #44206a; color:#ffe292; }
.leftNav .list li.hover s,.leftNav .list li:hover s{ display:block;}
.leftNav .more { width:201px; height: 42px; margin-top: 8px; background-position: 0px -53px;}
.leftNav .more a{ width: 201px; height: 42px; display: block;}

.leftNav li .drop { width: 0px; position: absolute; overflow: hidden; z-index: 99; top:0px; left:200px; background: #44206a;}
.leftNav li .drop a { width:120px; height:30px; line-height:30px; border-bottom: 1px solid #6c4b44;  }
.leftNav li .drop a:hover{ height:30px; line-height:30px; background:#44206a; color:#e0a849;}

.leftCon{ width:201px; margin-top: 20px; padding-bottom: 10px; }
.leftCon .ltit {width: 199px; height:68px; line-height: 68px; margin-bottom: 20px;  color:#fadb87;  border:1px solid #6b4f57; background: url(../../../../../content/templaes/c20163n/style/images/tit2.jpg) no-repeat left bottom;}
.leftCon .ltit h2{ font-size: 24px; font-weight: bold; text-indent: 1em;}
.leftCon .ctel { width: 100%; margin-bottom: 5px;}
.leftCon .ctel span{ width:139px; height:47px;  line-height: 50px; text-align: center; color:#d3a14b; margin-right: 10px; font-size: 18px;  letter-spacing: 2px;  background-position: -221px -48px;}
.leftCon .ctel strong{ font-weight: bold; font-size: 25px; color:#ffdd84; display: inline-block; vertical-align: middle; }
.leftCon .txt{ color:#e0a849; line-height: 30px;}

.listNews .list { padding-bottom:20px; overflow:hidden; }
.listNews .item { width:100%; height:40px; line-height:40px; background:url(../../../../../content/templaes/c20163n/style/images/tip_7.gif) 0 center no-repeat; border-bottom:1px dashed #644a51; }
.listNews .item s{ width:0px; height:40px; display:block; float:left; background: #e0a849; margin-right:10px; }
.listNews .item a { float:left; color:#e0a849; display:block; }
.listNews .item a:hover {  color:#e0a849;}
.listNews .item span { float:right; }

.listNews2 .list { padding-bottom:20px; overflow:hidden; }
.listNews2 .item { width:100%; height:130px; border-bottom:1px dashed #644a51; padding:10px 0; }
.listNews2 .item .img { float:left; width:160px; height:120px; padding:4px; border:1px solid #644a51; margin-right:10px;  }
.listNews2 .item img { display:block; width:160px; height:120px; }
.listNews2 .item .img:hover { background:#ffc17b; border-color:#f07f00; }
.listNews2 .item h3 { height:30px; line-height:30px; overflow:hidden; font-size:15px; font-weight:700; font-family:"Microsoft Yahei";  }
.listNews2 .item h3 a:hover { text-decoration:underline; }

.pageNews h1 { font-size:20px; line-height:25px; font-family:"Microsoft Yahei"; padding:15px 0; text-align:center; font-weight:700; }
.pageNews .mark { height:30px; line-height:30px; text-align:center; margin-bottom:20px; border-bottom:1px solid #644a51; border-top:1px solid #644a51;  }
.pageNews .mark span { margin:0 7px; }
.pageNews .info { margin-bottom:40px; }

.listCase .tod{ width:108%;}
.listCase .item{ width:242px; height:182px; margin:0px 16px 15px 0px; float:left; border:1px solid #8e7a5f; position: relative; overflow: hidden;}
.listCase .item img{ width:100%; height:100%; display: block; transition:all 500ms ease;}
.listCase .item:hover img{ transform: scale(1.04,1.04);}
.listCase .item .wd{ width:100%; height:100%; line-height: 182px; text-align: center; display: block; position: absolute; left:-242px; top:-182px; color: #fff; background: url(../../../../../content/templaes/c20163n/style/images/yback.png) repeat 0px 0px;}
.listCase .item .wd s{ width:17px; height: 17px; background-position: -100px 0px; margin-right: 5px;}

.pageCase h1 { font-family:"Microsoft Yahei"; font-size:18px; line-height:25px; padding:15px 0; text-align:center; font-weight:700; }
.pageCase .photo { overflow:hidden; text-align:center; margin-bottom:20px; }
.pageCase .photo img{ max-width:640px; }
.pageCase .info { margin-bottom:40px; }

.listProduct .tod{ width:120%;}
.listProduct .item{ width:241px; padding:1px; float: left; margin:0px 20px 23px 0px; background: #240b3f;}
.listProduct .item .img{ width:239px; height:179px; display: block; overflow: hidden; border: 1px solid #190a26;}
.listProduct .item .img img{ width:239px; height:179px; display: block; transition:all 500ms ease;}
.listProduct .item .txt{ width:94%; padding:0 3%; height:50px; line-height: 50px;}
.listProduct .item .txt h3 a{ color:#e0a849; display: block;}
.listProduct .item .txt h3 a:hover{ color:#fadb87;}
.listProduct .item .txt .order{ width:54px; height:24px; text-align:center; float:right; line-height: 24px; color:#240b3f; margin-top: 13px; display: block; background:url(../../../../../content/templaes/c20163n/style/images/icon.png) no-repeat; display:inline-block; vertical-align:middle;background-position: -137px 0px;}
.listProduct .item:hover .txt{ background: url(../../../../../content/templaes/c20163n/style/images/icon.png) no-repeat 0px -156px; }
.listProduct .item:hover h3 a{  color:#fadb87;}
.listProduct .item:hover img{ transform: scale(1.04,1.04);}

.listProduct2 .tod { overflow:hidden; }
.listProduct2 .list { float:left; width:110%; font-family:"Microsoft Yahei"; }
.listProduct2 .item { float:left; width:220px; margin:0 13px 20px 0; _display:inline; }
.listProduct2 .item .img { display:block; width:210px; height:158px; padding:4px; border:1px solid #ddd; transition:all 500ms ease; overflow:hidden; }
.listProduct2 .item img { width:210px; height:158px; display:block; }
.listProduct2 .item .img:hover { background:#ffc17b; border-color:#f07f00; transition:all 500ms ease; }
.listProduct2 .item h3 { height:30px; line-height:25px; font-size:16px; text-align:center; }
.listProduct2 .item h3 a:hover { text-decoration:underline; }
.listProduct2 .item .summary { height:60px; line-height:20px; color:#999; overflow:hidden; margin-bottom:10px; }
.listProduct2 .item .order { display:block; width:77px; height:23px; line-height:23px; margin:0 auto; text-align:center; color:#333; border:1px solid #aaa; }
.listProduct2 .item .order:hover { color:#f07f00; border-color:#f07f00; }


.pageProduct h1 { font-family:"Microsoft Yahei"; font-size:18px; line-height:25px; padding:15px 0; text-align:center; font-weight:700; }
.pageProduct .photo { margin-bottom:20px; }
.pageProduct .photo .img { display:block; padding:4px; border:1px solid #644a51; margin:0 auto; }
.pageProduct .detaiInfo { margin-bottom:10px; }

.pageProduct2 .photo { float:left; padding-bottom:20px; }
.pageProduct2 .photo .img { width:400px; height:300px; display:block; padding:4px; border:1px solid #644a51; }
.pageProduct2 .baseInfo { float:right; width:300px; }
.pageProduct2 h1 {  line-height:26px; font-size:16px; }
.pageProduct2 .baseInfo p { line-height:30px; }
.pageProduct2 .baseInfo p span { font-size:18px; color:#ffae00; font-family:"Georgia"; }
.pageProduct2 .baseInfo p.button { padding-top:40px; }
.pageProduct2 .baseInfo a.btn { display:block; width:77px; height:25px; line-height:25px; text-align:center; color:#e0a849; border:1px solid #e0a849; }
.pageProduct2 .baseInfo a.btn:hover { color:#fff; border-color:#e0a849; }
.pageProduct2 .detaiTit { height:25px; line-height:20px; border-bottom:1px solid #644a51; font-size:14px; margin-bottom:10px; font-family:"Microsoft Yahei"; color:#e0a849; font-weight:700; }
.pageProduct2 .detaiInfo { margin-bottom:10px; }


.dtditu{width:140px; height:30px; line-height:30px; background:#e0a849; color:#fff; font-weight:bold; margin:10px auto 0; text-align:center; font-size:14px;}
#baiduMap{width:715px; height:280px; border:1px solid #e0a849; border-top:3px solid #e0a849;}
.singlePage{ line-height:26px;}
.BMap_bubble_content{ line-height:15px; }
.formData tr.item .tip{ width:150px !important;}

#show .box{ width:320px;height:200px;float:left;position:relative;zoom:1;overflow: hidden;}  
#show .img{height:200px;background-color: orange;text-align: center;line-height:200px;}  
#show .img img{ width:100%; height:auto; float:left;}
#show .wrap{position: absolute;left: -320px;top: -200px;width:320px;height:200px;background-color:#999;text-align: center;line-height:200px; opacity:0.8;}  
#show{width:1000px;height:auto; margin:0 auto;}
/****动画函数****/
@-ms-keyframes flap{
	0% {-ms-transform: translateX(0);}
  50% {-ms-transform: translateX(-10px);}
  100% {-ms-transform: translateX(0);}
}
@-moz-keyframes flap{
	0% {-moz-transform: translateX(0);}
  50% {-moz-transform: translateX(-10px);}
  100% {-moz-transform: translateX(0);}
}
@-webkit-keyframes flap {
  0% {-webkit-transform: translateX(0);}
  50% {-webkit-transform: translateX(-10px);}
  100% {-webkit-transform: translateX(0);}
}
@keyframes flap {
  0% {transform: translateX(0);}
  50% {transform: translateX(-10px);}
  100% {transform: translateX(0);}
}


