/*reset*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{padding:0;margin:0;}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0; box-sizing: border-box;}
address,caption,cite,code,dfn,em,th,var,i{font-weight:normal;font-style:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-weight: 700;}
h1{font-size:18px}
h2{font-size:16px}
h3{font-size:14px}
h4{font-size:14px}
h5{font-size:12px}
h6{font-size:12px}
q:before,q:after{content:''}
abbr,acronym{border:0}
hr {clear: both; display: block; height: 1px;
  border: 0 none;
  border-bottom: 1px solid #e7e7eb;}
blockquote{color:#666;font-style:italic;}
sup,sub{line-height:0}
abbr,acronym{border-bottom:1px dotted #666}
pre{white-space:pre;}
pre,code,tt{font:12px 'andale mono', 'lucida console', monospace;line-height:1.5}
/*clear clearfix*/
.clearfix:after {content:"\0020"; display: block; height: 0;clear: both; visibility: hidden; }
.clearfix {zoom: 1;}
.clear{clear:both;}
.sd-left{display:inline;float:left;}
.sd-right{display:inline;float:right;}
.cf{*zoom: 1;}
.cf:after {
    clear: both;
}
.tac{text-align: center; }
.tar{text-align: right; }
.cf:before, .cf:after {
    content: "";
    display: table;
}

.mat20{margin-top: 20px;}
.mab20{margin-bottom: 20px;}
.ma20{margin: 20px;}

body{font-size: 12px;font-family: Arial, sans-serif; line-height: 1.5;color: #333333;}
/* Links */
a {
    text-decoration: none;
    color: #676767
}

a:active,a:focus,a:hover {
    color: #676767;
    text-decoration: underline
}

a:hover {
    color: #333;
    text-decoration: underline
}


@font-face {
    font-family: 'iconfont';
    src: url('https://at.alicdn.com/t/font_kbnpxwx2unwgsyvi.eot'); /* IE9*/
    src: url('https://at.alicdn.com/t/font_kbnpxwx2unwgsyvi.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('https://at.alicdn.com/t/font_kbnpxwx2unwgsyvi.woff') format('woff'), /* chrome、firefox */
    url('https://at.alicdn.com/t/font_kbnpxwx2unwgsyvi.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url('https://at.alicdn.com/t/font_kbnpxwx2unwgsyvi.svg#iconfont') format('svg'); /* iOS 4.1- */
}


.iconfont {
    display: inline-block;
font-family: 'iconfont';
font-size: 24px;
font-style: normal;
    -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
              -webkit-transform: translate(0, 0);
                  -ms-transform: translate(0, 0);
                      transform: translate(0, 0);
-webkit-text-stroke-width: 0.2px;
}

body, html {
    
}

header{    width: 100%;
    position: fixed;
    height: 50px;
    background: rgb(70, 70, 72);
    top: 0;
    z-index: 9999;
    box-shadow: 0px 3px 5px rgba(0,0,0,0.3);
    border-bottom: #333 solid 1px;
    border-top: #333 solid 1px;}
.page-nav{width: 1400px;margin: 0 auto; height: 50px;}
.logo{
     display:flex;
    flex-direction:row;
    gap: 1rem;
}
.logo .iconfont{line-height: 50px;font-size: 36px;color: #F65034;    display: inline-block;
    vertical-align: middle;
    margin-top: -5px;position: relative; z-index: 100; width: 40px;height: 50px}

h1{font-size: 18px;  line-height: 50px;  color: #fff;
    display: inline-block;
    margin-bottom: 0;position: relative; }
header .top-nav{float: left;padding-left: 30px}
header .top-nav li{
    float: left;}

header .top-nav a {
    display: block;
    font-size: 14px;
    text-decoration: none;
        text-align: center;
        margin-top: 10px;
    padding: 0px 21px 0;
    line-height: 30px;
    height: 30px;
    color: #eee;
    font-weight: bold;
    float: left;
    text-shadow: 0px 1px 0px #000;
}

header .top-nav a:active,header .top-nav a:focus,header .top-nav a:hover {
    color: #eee;
    text-decoration: underline
}

header .top-nav a:hover {
    background: #333;
    border-radius: 20px;
    border: 1px solid #333;
    border-top: 1px solid #2b2b2b;
    text-align: center;
    display: block;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    cursor: pointer;
    margin-top: 10px;
    padding: 0px 20px 0;
    height: 30px;
    color: #eee;
    font-weight: bold;
    box-shadow: 0px 1px 0px rgba(255,255,255,0.3);
    float: left;
    text-decoration: none;
}    
header .member-list{float: right}

header .member-list li{
    float: left;}

header .member-list a {
    display: block;
    font-size: 14px;
    text-decoration: none;
        text-align: center;
        margin-top: 10px;
    padding: 0px 21px 0;
    line-height: 30px;
    height: 30px;
    color: #eee;
    font-weight: bold;
    float: left;
    text-shadow: 0px 1px 0px #000;
}

header .member-list a:active,header  .member-list a:focus,header  .member-list a:hover {
    color: #eee;
    text-decoration: underline
}

header .member-list a:hover {
    background: #333;
    border-radius: 20px;
    border: 1px solid #333;
    border-top: 1px solid #2b2b2b;
    text-align: center;
    display: block;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    cursor: pointer;
    margin-top: 10px;
    padding: 0px 20px 0;
    height: 30px;
    color: #eee;
    font-weight: bold;
    box-shadow: 0px 1px 0px rgba(255,255,255,0.3);
    float: left;
    text-decoration: none;
}    
.main-content{width: 1400px;margin: 50px auto 0;}
.main-content h2{    margin: 30px 0 10px;
    padding: 6px 0 0 0;
    text-indent: 5px;
    line-height: 30px;}
.main-content li { float:left; box-sizing: content-box;  width:348px;position:relative;border: 1px solid #f1f1f1;border-top: 1px solid #e9e9e9; margin: 0 -1px -1px 0;box-shadow: 0px 0px 2px #fdfdfd;height: 102px;}
.main-content li:nth-child(2n){background-color:rgb(249, 249, 249)} /* 偶数 */
.main-content li:nth-child(2n+1){  } /* 奇数 */

.main-content li a img { z-index:0; position:relative;height: 80px;width: 80px;background:#FFF; margin:10px; float:left;border-radius: 15px;border: 1px solid #f1f1f1;}

.main-content li em{ position: absolute; top: 9px; left: 2px; z-index: 2; display: block; width: 38px; height: 56px;}

.main-content li a h3 {text-shadow:0px 1px 1px #FFF;padding-top:15px; font-size:14px;color: #444;}


.main-content li a p{color: #888;font-size: 12px;margin-top: 10px;overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;}
.main-content li a:hover{text-decoration: none;}
.main-content li .item-info {padding: 0 10px;}

.footer{
    margin-top: 20px;
    text-align: center;
    padding: 20px 0;
    background-color: whiteSmoke;
}



.footer p {
    margin: 0;
}

@media (max-width: 768px) {
    .main-content {
        width: 100%
    }
    .main-content li { float: inherit; width: auto}
}