﻿/*--------------------Author:cyan------------------*/
/*-----------banner效果代码-------------*/
.flickerplate {position:relative;width:100%;height:500px;background-color:#e6e6e6;overflow:hidden;z-index:0;}
.flickerplate ul.flicks {width:10000%;height:100%;padding:0px;margin:0px;list-style:none}
.flickerplate ul.flicks>li {float:left;width:1%;height:100%;background-position:center;background-size:cover;display:table}
.flickerplate .arrow-navigation {position:absolute;height:80%;width:10%;top:5%;z-index:100;overflow:hidden}
.flickerplate .arrow-navigation .arrow {display:block;height:100%;width:90%;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;-o-transition:all 0.2s ease-out;-ms-transition:all 0.2s ease-out;transition:all 0.2s ease-out}
.flickerplate .arrow-navigation:hover,.flickerplate .arrow-navigation .arrow:hover {cursor:pointer}
.flickerplate .arrow-navigation.left {left:0%}
.flickerplate .arrow-navigation.left .arrow {opacity:0;margin:0px 0px 0px 80%;background:url(../images/arrow-left-light.png) no-repeat left;}
.flickerplate .arrow-navigation.right {right:0%}
.flickerplate .arrow-navigation.right .arrow {opacity:0;margin:0px 0px 0px -80%;background:url(../images/arrow-right-light.png) no-repeat right;}
.flickerplate .arrow-navigation.left.hover .arrow {opacity:1;margin:0px 0px 0px 50%}
.flickerplate .arrow-navigation.right.hover .arrow {opacity:1;margin:0px 0px 0px -50%}
.flickerplate .dot-navigation {position:absolute;bottom:20px;width:100%;text-align:center;z-index:100}
.flickerplate .dot-navigation ul {list-style:none;padding:0px 15px;width:72px;margin:0 auto;}
.flickerplate .dot-navigation ul li {float:none;width:24px;float:left;}
.flickerplate .dot-navigation .dot {width:14px;height:14px;margin:0px 6px;background:url(../images/dot2.png) no-repeat center;}
.flickerplate .dot-navigation .dot:hover {cursor:pointer;background:url(../images/dot2.png) no-repeat center;}
.flickerplate .dot-navigation .dot.active {background:url(../images/dot1.png) no-repeat center;}
.flickerplate .dot-navigation.left,.flickerplate .dot-navigation.left ul {text-align:left}
.flickerplate .dot-navigation.right,.flickerplate .dot-navigation.right ul {text-align:right}
.flickerplate.flicker-theme-dark .arrow-navigation.left .arrow {background:url(../images/arrow-left-dark.png) no-repeat left;}
.flickerplate.flicker-theme-dark .arrow-navigation.right .arrow {background:url(../images/arrow-right-dark.png) no-repeat right;}
.flickerplate.flicker-theme-dark .dot-navigation .dot {background-color:rgba(0,0,0,0.12)}
.flickerplate.flicker-theme-dark .dot-navigation .dot:hover {background-color:rgba(0,0,0,0.6)}
.flickerplate.flicker-theme-dark .dot-navigation .dot.active {background-color:#000}
.flickerplate.flicker-theme-dark ul.flicks li .flick-inner {color:rgba(0,0,0,0.9)}
.flickerplate.animate-transform-slide ul.flicks {-webkit-perspective:1000;-webkit-backface-visibility:hidden;transform:translate3d(0%,0px,0px);-webkit-transform:translate3d(0%,0px,0px);-webkit-transition:-webkit-transform 0.6s;-o-transition:-o-transform 0.6s;-moz-transition:-moz-transform 0.6s;transition:transform 0.6s}
.flickerplate.animate-transition-slide ul.flicks {position:relative;left:0%;-webkit-transition:left 0.4s ease-out;-moz-transition:left 0.4s ease-out;-o-transition:left 0.4s ease-out;-ms-transition:left 0.4s ease-out;transition:left 0.4s ease-out}
.nbanner {position:relative;width:100%;overflow:hidden;z-index:0;}
.nbanner .bd {position:relative;left:50%;width:1920px;margin:0 0 0 -960px;text-align:center;overflow:hidden;}
.nbanner .wrap {position:relative;}
.nbanner .hd {position:absolute;bottom:20px;width:1200px;text-align:center;z-index:999;}
.nbanner .hd ul {display:inline-block;*display:inline;zoom:1;}
.nbanner .hd li {float:left;width:12px;height:12px;margin:0 5px;border-radius:100%;text-indent:-9999em;background:#fff;cursor:pointer;}
.nbanner .hd li.on {background:#41517a;}
