* {
    margin: 0;
    padding: 0;
}
body{ background:#fbfaf5;  font-size: 14px; color:#999;}
a {
    text-decoration: none;
    color:#999;
}
img{
    border: 0;
    vertical-align: middle;
}
ul {
    list-style: none;
}
.wrap {
    width: 100%;
    clear:both;
    margin:auto;
    position: relative;
}
.left{ float:left;}
.right{ float:right;}
.display{ display: none;}
.overhidden{width:100%;height:100%;}
.nav{
    background: #fbfaf5;
    width: 100%;
    padding:10px 10px;
    box-sizing:border-box;
    min-height: 100%;
    overflow-y:hidden;
    position: fixed;
    z-index: -99999;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    top:80px;
    left: 0px;
    display:none;
}
.nav ul{
    width:100%;
    height:100%;
    overflow-y:auto;
}
.nav ul li
{
   width:100%;
   border-bottom:solid 1px #FFF;
   overflow:hidden;
}
.nav ul li .menu{ color: #999;}
.nav ul li em { display:block; width:100%; box-sizing:border-box; padding:0px 10px; overflow:hidden;}
.nav ul li em a { display:block; width:100%; height:80px; line-height:80px; font-size:20px; color:#888; font-style:normal; text-align:center;}
.nav ul li em .no{ background:none;}
.head{
    height: 80px;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 9999999;
    overflow:hidden; 
    background:rgba(255,255,255,0.8);
}
.head>div{ width:96%; margin:0 2% 0 2%; box-sizing:border-box; position:relative; clear:both; overflow:hidden;}
.head .logo
{
    background:url(../images/logo.png) center center no-repeat;
    background-size:auto 50px; 
    width:80%;
    display:block;
    clear:both;
    margin:auto;
    height:80px; 
}
.i-menu {
    background: url("../images/m-menu.png") no-repeat center;
    background-size: 100%;
    height: 20px;
    width: 20px;
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 30px;
    z-index:99;
    cursor:pointer;
}
.i-close{
    background: url("../images/m-close.png") no-repeat center;
    background-size: 100%;
    height: 20px;
    width: 20px;
    display: none;
    position: absolute;
    right: 10px;
    top:30px;
    z-index:99;
    cursor:pointer;    
}
.footer 
{
    width:100%;
    float:left;
    clear:both;
    background:#FFF;
    text-align: center;
    line-height: 30px;
    padding:20px 0px;
}
.footer img{ height:24px; margin:-5px 5px 0px 0px;}
.footer i{ font-style:normal; letter-spacing:2px;}
#flash{ width:100%; float:left; clear:both; overflow:hidden; padding:80px 0px 0px 0px;}
#subject{ width:100%; line-height:40px; font-size:28px; padding:5% 5% 2% 5%; box-sizing:border-box; color:#999; font-weight:normal; text-align:center; overflow:hidden;}
#content{ width:100%; float:left; padding:80px 0px 0px 0px; clear:both; overflow:hidden;}

#details{width:100%; float:left; padding:0 5% 5% 5%; clear:both; box-sizing:border-box; overflow:hidden;}
#details h1{ color:#999; font-size:20px; line-height:30px; padding-top:10px; padding-bottom:20px; text-align:center;}
#details .date{ width:100%; float:left; clear:both; margin:0px 0px 20px 0px; line-height:40px; overflow:hidden; text-align:center; color:#999; background:#FFF;}
#details .date a{ color:#e1921a;}
#details .date i{ margin:0px 10px;}
#details .date b{ color:#e1921a;}
#details .details{ width:100%; overflow:hidden; line-height:30px; padding:0px 0px 20px 0px; float:left;font-size:14px;}

#newslist{ width:100%; float:left; padding:0 5% 5% 5%; box-sizing:border-box; overflow:hidden;}
#newslist li{ width:100%; float:left; clear:both; padding:20px 15px; box-sizing:border-box; position:relative; border-bottom:solid 1px #EEE; overflow:hidden;}
#newslist li:hover{ background:#FFF;}
#newslist li h1{ display:block; width:100%; height:40px; line-height:40px; font-size:18px; font-weight:normal; color:#999; overflow:hidden;}
#newslist li i{ display:block; width:100%; height:30px; line-height:30px; font-style:normal; color:#999;}
#newslist li img{ height:12px; margin:-5px 5px 0px 15px;}
#newslist li p{ display:block; width:100%; max-height:50px; line-height:25px; overflow:hidden; color:#999; font-size:14px;}

#piclist{ width:100%; float:left; padding:2% 2% 5% 2%; box-sizing:border-box; overflow:hidden;}
#piclist li{ position:relative; width:33.3333%; float:left; padding:2%; box-sizing:border-box; overflow:hidden;}
#piclist li em{ display:block; float:left; clear:both;  width:100%; 
    box-sizing:border-box;
    height:0;
    padding-bottom: 60%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size:cover;
    overflow:hidden;
}
#piclist li span{ display:block; float:left; clear:both; width:100%; height:50px; line-height:50px; font-size:16px; text-align:center; overflow:hidden;}
#piclist li:hover em{ box-shadow: 0px 0px 8px rgba(0,0,0,0.2);}
#piclist li:hover span{ color:#999;}
#piclist li:hover em:after{
    position: absolute;
	left: 0px;                   
	top: 0px;
	width: 100%;	
    height:0px;
    padding-bottom: 60%;
	content: "";
	background:rgba(251,250,245,0.5);
	z-index:99999999;
}
#categorylist{ width:100%; padding:20px 0px;  float:left; clear:both; overflow:hidden; text-align:center;}
#categorylist a{ display:inline-block; font-size:16px; font-weight:normal; line-height:24px; padding:5px 10px 10px 10px; text-align:center; color:#999;}
#categorylist .curr{ color:#999;}
#categorylist .curr:after{content: ''; display: block; width:50px; height: 4px; border-radius:2px; margin:5px 10px 0px 10px; background:#e1921a;}
.listpage{ width:100%; padding:10px 0px; overflow:hidden;}
.listpage .total{ float:left; clear:both; width:100%; line-height:30px; padding:10px 0px; text-align:center; color:#999; font-size:14px;}
.listpage .total span{margin:0px 5px; color:#fd415c; font-weight:bold;}
.listpage .pager { float:left; clear:both; width:100%; height:80px; text-align:center; position:relative;}
.listpage .pager a{ display:inline-block; min-width:24px; padding:0px 2px; height:30px; line-height:30px; margin:0px 3px; border:solid 1px #CCC; color:#999; overflow:hidden; border-radius:2px; box-shadow:2px 2px 6px #EEE;}
.listpage .pager .oran_pg_cur{ border:solid 1px #e1921a; background:#e1921a; color:#FFF;}
.listpage .pager .oran_pg_fp{ background:url(../images/first2.png) center center no-repeat; background-size:22px 22px; text-indent:-100px;} 
.listpage .pager .oran_pg_pp { background:url(../images/prev2.png) center center no-repeat; background-size:22px 22px; text-indent:-100px;} 
.listpage .pager .oran_pg_np{ background:url(../images/next2.png) center center no-repeat; background-size:22px 22px; text-indent:-100px;} 
.listpage .pager .oran_pg_lp { background:url(../images/end2.png) center center no-repeat; background-size:22px 22px; text-indent:-100px;} 
.listpage .pager .control{width:184px; padding:10px 0px; clear:both; margin:auto; overflow:hidden;}
.listpage .pager .oran_pg_txt{display:block; float:left; width:120px; height:30px; line-height:30px; border:solid 1px #CCC; text-indent:5px; text-align:center; border-radius:5px 0px 0px 5px; box-shadow:2px 2px 6px #EEE;}
.listpage .pager .oran_pg_btn{display:block; float:left; width:60px; height:32px; line-height:32px;text-align:center;border:solid 1px #3399CC; background:#3399CC; color:#FFF; border-radius:0px 5px 5px 0px; box-shadow:2px 2px 6px #EEE;}
@media(max-width:1200px) 
{
}
@media(max-width:960px) 
{
    #piclist li{ width:50%;}
}
@media(max-width:480px)
{
    #subject{ font-size:24px;}
    #piclist li{ width:100%;}
    .nav{ top:50px;}
    .head{ height:50px;}
    .head>div{ width:100%; margin:0;}
    .head .logo{ height:50px; background-size:auto 30px; }
    .i-menu,.i-close{ top:15px;}
    #flash,#content{ padding:50px 0px 0px 0px;}
}