* { margin:0; padding:0; }

@font-face {
    font-family: pingfang;
    src: url('PingFang.ttf');
}

html { height:100%; }

body { 
    background:#f3f3f3; 
    font-size:15px; 
    color:#333; 
    font-family:pingfang, 'Segoe UI', Helvetica, Arial, 'microsoft yahei', sans-serif; 
    min-height: 100%; 
    box-sizing: border-box;
    padding:74px 0 36px;
}

article{
    background: #fff;
    box-shadow:rgba(83, 83, 83, 0.45) 0 0 12px -4px;
    padding:30px 36px 60px; 
    max-width:980px; 
    min-width:320px;
    margin:0 auto; 
    border:1px solid #ddd;
    box-sizing:border-box; 
}

header.pc{ color:#e5e5e5; background:#333; position: fixed; top:0; left:0; width:100%; z-index:100; box-shadow:rgba(83, 83, 83, 0.45) 0 0 12px -4px; -webkit-transition: transform 200ms; transition: transform 200ms; }
header.pc div.react-area{ max-width:960px; min-width:320px;margin:0 auto; font-size:16px; position:relative; }
header.pc h1.site-title {display: inline-block;padding:16px 90px 16px 250px; background-position:0 center; background-repeat: no-repeat; background-size:200px 60px; font-weight: normal; font-size:15px; line-height: 150%; }
header.pc h1.site-title a{ color:#e5e5e5; font-size:20px; display: inline; font-weight: normal; margin:0; }
header.pc a{ display: inline-block; color:#e5e5e5; margin-right:16px; }
header.pc div.react-area a:hover{ text-decoration: none; color:#0096d7;}
header.pc a:visited{ color:#e5e5e5;}
header.pc a.checked{ color:#00a2e9; }
header.hide { -webkit-transform: translateY(-58px);transform: translateY(-58px)}

header.mobile{ text-align: left; background:#333; box-sizing: border-box; position: absolute; width:100%; left:0; top:0; padding:0 8px; }
header.mobile a{ display: inline-block; margin-left:8px; font-size:14px; color:#e5e5e5; }
header.mobile a.checked, header.mobile a.checked:visited{ color:#00a2e9;}
header.mobile a:visited{ color:#e5e5e5;}
header.mobile b{ display: inline-block; background-repeat: no-repeat; background-size:32px 32px; background-position: left center; padding:12px 0 12px 40px; color:#e5e5e5;}

@media only screen and (max-width: 440px) {
    body{padding:0 0 30px; font-size:16px;}
    header.pc{ display: none }
    header.mobile{ display: block;}
    article{ padding:58px 10px 24px;}
}

h1, h2, h3 { font-family:pingfang,'Microsoft YaHei', 'open sans', helvetica, sans-serif; }

h2.page-title{ font-weight: bold; font-size: 19px; margin: 1.2em 0 1.2em; clear:both; }

table { border-collapse:collapse; table-layout:fixed; }
input,select,textarea,a,button { outline:none; }
img{ border:none; }

a { color: #1a8deb; text-decoration: none; }
a:hover { color: #5fb300; text-decoration: underline; }
a:visited { color: #5fb300; }
.clearfix:after { content:""; display:table; clear:both; }

/* 页眉 */
p.sub-title { margin:0 0 25px; color:#999; font-size:16px; text-align:center;font-family:pingfang, 'Microsoft YaHei';text-indent:0;line-height: 100%; }

.empty-data { margin:3em 0; text-align: center; color: #666; }

/* 页脚 */
footer { color:#aaa; text-align:center; margin:24px 0 0 0; font-size:13px; font-family:Arial; clear: both; }
footer a, footer a:visited { color:#aaa;}

.notice { border:1px solid #ffecb2;padding: 16px; background:#fffaeb; margin:1.5em 0;padding: 10px 20px;line-height: 170%;font-size: 13px; color:#666; }
