@charset "UTF-8";

@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }



/*! responsive-nav.js 1.0.39 by @viljamis */.js .nav-collapse{clip:rect(0 0 0 0);max-height:0;position:absolute;display:block;zoom:1}
.nav-collapse.opened{max-height:9999px}
.nav-toggle{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}
@media screen and (min-width:40em){.js .nav-collapse{position:relative}
.js .nav-collapse.closed{max-height:none}
.nav-toggle{display:none}
}


.fixed{position:fixed;width:100%;top:0;left:0}
.nav-collapse,.nav-collapse *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.topNav {position: relative;}
.topNav > ul{z-index: 4; list-style:none;margin:0 auto;max-width:1200px;line-height:50px;display:flex;flex-direction:row;font-size:18px;text-align:center}
.topNav > ul > li {flex:1; cursor: pointer;position: relative;}
.topNav > ul > li > a{color:#fff;text-decoration:none;width:100%}
.topNav > ul > li:hover {background-image: radial-gradient(farthest-corner at 50% 50%, #f28e4a, #de3b4c);}


.subBox { z-index: 3; display:none; position: absolute; top: 100%; left: 0; width: 100%; background-color: #de3b4c;}
.topNav > ul > li:hover .subBox{display:block;}
.subNav {margin:0 auto;max-width:1200px; text-align: center;}
.subNav > a {display: inline-block;margin: 0 15px; height: 50px;line-height: 50px;color: #ffffff; font-size:16px}
.subNav > a:hover { color: #ffffff; border-bottom: solid 2px #ffffff;}



#nNav { margin: -59px auto 20px; padding: 37px 0; width: 1200px; background-color: #f6f6f6; }
#nNav a { flex: 1; height: 44px; line-height: 44px; text-align: center; font-size: 18px; border-right: solid 1px #dedede; box-sizing: border-box;}
#nNav a:last-of-type { border-right: 0;}
#nNav a:hover,#nNav a.on {background-image: radial-gradient(farthest-corner at 50% 20%, #f28e4a, #de3b4c); color: #fff;}



@media screen and (min-width:40em){.nav-collapse ul ul a{display:none}}
@font-face{font-family:responsivenav;src:url(icons/responsivenav.eot);src:url(icons/responsivenav.eot?#iefix) format("embedded-opentype"),url(icons/responsivenav.ttf) format("truetype"),url(icons/responsivenav.woff) format("woff"),url(icons/responsivenav.svg#responsivenav) format("svg");font-weight:400;font-style:normal}
.nav-toggleb{position:fixed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;text-indent:-999px;position:relative;overflow:hidden;width:70px;height:55px;display:none}
.nav-toggleb:before{color:#f4421a;font-family:responsivenav,sans-serif;font-style:normal;font-weight:400;font-variant:normal;font-size:28px;text-transform:none;position:absolute;content:"≡";text-indent:0;text-align:center;line-height:55px;speak:none;width:100%;top:0;left:0}
.nav-toggleb.active::before{font-size:24px;content:"x"}
@media screen and (max-width:414px){
  .nav-collapse ul{flex-direction:column; padding-bottom: 20px;}
  .nav-toggleb{display:block}

  #nNav { flex-wrap: wrap; padding: 10px 0; width: 100%;}
  #nNav a { flex: 0 0 33.3%;}
  .kindToggle {  height: 30px;  }
  .kindToggle::before {line-height: 30px;}
  
}

.pages {clear: both;margin: 20px;overflow: hidden;margin-left: 0px;text-align: center;font-size:12px}
.pages ul li { display:inline-block;border: 1px solid #ccc;padding: 2px 9px;margin: 0 3px;line-height: 20px;background: #fff;color:#999}
.pages ul li:hover{ background:#da3321; color:#fff;border: 1px solid #da3321}
.pages ul li:hover a{color:#fff;}
.pages ul li.thisclass {display: inline-block;border: 1px solid #da3321;padding: 2px 9px;margin: 0 3px;background: #da3321;color: #fff;}
.pages ul li.thisclass a {color: #fff;}
.pages ul li a{ display:block;color:#999}
.pages ul li a:hover {color: #fff;}


.picScroll{ margin:10px auto;  position:relative;  border:1px solid #eee; width:1200px;  padding:10px 0 10px 30px; background:#fff; overflow:hidden;     }
.picScroll .prev,
.picScroll .next{ display:block; position:absolute; top:86px; left:5px; width:23px; height:23px; background:url(../images/btns.png) no-repeat;   }
.picScroll .next{ left:auto; right:5px; background-position:-25px 0; }
.picScroll .prev:hover{ background-position:0 -30px; }
.picScroll .next:hover{ background-position:-25px -30px; }
.picScroll ul{ overflow:hidden; zoom:1; }
.picScroll ul li{ width:20%; float:left; overflow:hidden; padding:0 10px;     }
.picScroll ul li img{ width:100%; height:auto; display:block; background:url(../images/loading.gif) center center no-repeat; }
.picScroll ul li .title{ text-align: center; }
