@charset "utf-8";

/*skin-start*/
:root{ /*淡蓝底黑字*/
  --bgbd:#EEE; --bga:#FFF; --bghf:#E8E8E8; /*body背景,文本背景,头尾head/foot颜色*/
  --text:#333; --link:#337ab7; --hover:#F00;
  --em:#337ab7; --title:#222; 
  --bgtb1:linear-gradient(to bottom,#EEF 0%,#E0E0FF 100%);
  --bgtb2:linear-gradient(to bottom,#E0E0FF 0%,#EEF 100%);
  --border:1px solid #E0E0FF; --brdC:1px solid #CCC; --brdD:1px solid #DDD; --brdE:1px solid #EEE;
  --c0:#000; --c1:#111; --c2:#222; --c3:#333; --c4:#444; --c5:#555; --c6:#666; --c7:#777; 
  --c8:#888; --c9:#999; --cA:#AAA; --cB:#BBB; --cC:#CCC; --cD:#DDD; --cE:#EEE; --cF:#FFF;
  --wmob:880px; --wpc:1160px; --wmin:320px; /* 780,880; 1160,1200 */
}
/*skin-end*/

html, body, *{ line-height:150%; color:var(--text); font-family:Arial,Helvetica,Tahoma,"PingFang SC","Hiragino Sans GB","Heiti SC","Microsoft YaHei","WenQuanYi Micro Hei"; }
body { background-color:var(--bgbd); padding:0rem; margin:0px; } 
header, footer, article{ min-width:var(--wmin); max-width:var(--wmob); clear:both; padding:1rem; margin:auto; }
header, footer{ background:var(--bgtb1); }
article, section{ background-color:var(--bga); }

select{ vertical-align:middle; }
a{ color:var(--link); text-decoration:none; }
a:hover{ color:var(--hover); text-decoration:underline; }
hr{ width: 100%; clear:both; }

.l{ float:left; }.r{ float:right; } .c{ clear:both; }
.tl{ text-align:left; } .tr{ text-align:right; } .tc{ text-align:center; }
.emr, a.emr{ color:#F00; } .emg, a.emg{ color:#0F0; } .emb, a.emb{ color:#00F; } .emp, a.emp{ color:#F0F; }
.gr3, a.gr3{ color:#333; } .gr6, a.gr6{ color:#666; } .gr9, a.gr9{ color:#999; } .grc, a.grc{ color:#CCC; }
.lhp50 { line-height:50%; } .lhp100 { line-height:100%; }
.close{ float:right; cursor:pointer; padding:0.3rem; margin:0.3rem; border:var(--brdE); border-radius:0.3rem; }
.disabled, .disabled a, .disabled span{ color:var(--cA) !important; cursor:default !important; text-decoration:none !important; }
.nowrap, .nowraps>li, .nowraps>p, .nowraps>div{ overflow:hidden; word-break:keep-all; white-space:nowrap; }
.wrap, .wraps>li, .wraps>p, .wraps>div{ overflow:hidden; word-break:break-all; white-space:normal; }
.vcode input{ width:100%; min-width:60px; max-width:240px; }
.vcode img{ width:100%; min-width:90px; max-width:120px; height:36px; border-radius:4px; }
.help, .hand{ cursor:pointer; }


header h1{ font-size:1.5rem; font-weight:normal; padding:0; margin:0; }
header h1 .fa{ font-size:1.3rem; padding:0px 0.5rem 0 0 ; }
header>a, header>b{ display:inline-block; font-weight:normal; float:right; }
header .logo{ font-size:1.5rem; }
header img{ vertical-align:middle; border-radius:10%; }
header .btn{ background:var(--bga); }
header .fa{ font-size:1.8rem; color:var(--em); padding:0px 0 0 1rem; }

footer, .wfoot{ color:#666; text-align:center; font-size:small; }


.navp{ list-style:none; background-color:var(--bga); border-radius:4px; padding:8px 15px; margin:0; } 
.navp ol{ padding:0; margin:0; }
.navp>li { display:inline-block; }
.navp>li+li:before { padding:0 5px; color:var(--cC); content:"/\00a0"; }
.navp>.act { color:#777; }

.navh { text-align:center; background:var(--bga); padding:0.5rem; margin:0rem auto; } /*横排栏目*/
.navh ul, .navh li{ padding:0; }
.navh li { margin-right:3px; cursor:pointer; display:inline-block; }
.navh li a { display:block; color:var(--c3); padding:7px 1rem; border:var(--brdD); border-radius:20px; }
.navh li a:hover { color:var(--bga); background:var(--em); }
.navh li a.act { color:var(--bga); background:var(--em); display:block; border:var(--em); }


article .title, section .title{ font-size:1.5rem; color:var(--title); font-weight:bold; text-align:center; }
article .info, section .info{ color:#666; text-align:center; background-color:var(--bghf); padding:0.5rem; }


.html, .text, .md{ /*width:100%;*/ }

/* md样式 */
.md h2{ font-size:1.5rem; color:var(--title); text-align:center; padding-top:1rem; border-top:var(--border); }
.md li{ word-break:break-all; }
.md li p{ margin-bottom:0.3rem; }
.md pre{ width:100%; overflow-x:auto; background:#F0F0F0; padding:2px; border:1px solid #EEE; box-sizing:border-box; }
.md pre code{ width:100%; display:block; padding:5px; border:1px solid #FFF; font-family:monospace; box-sizing:border-box; }
.md p>code, .md li>code{ display:inline-block; font-family:monospace; font-size:large; background:#F0F0F0; padding:0 0.3rem; }

.md ::-webkit-scrollbar { width:5px; height:5px; }
.md ::-webkit-scrollbar-track {-webkit-box-shadow:inset 0 0 3px rgba(128,128,128,0.5); border-radius:3px; }
.md ::-webkit-scrollbar-thumb { border-radius:5px; background:#CCC; }
.md ::-webkit-scrollbar-thumb:hover { background:#BBB; }

.user{  }
.user .logo img{ max-width:72px; max-height:72px; min-height:64px; margin:0.5rem 0; border-radius:20%; }
.user .id, .user .cmname{ position:relative; display:inline-block; color:#666; background:var(--bga); float:right; bottom:2.5rem; 
  padding:0.2rem 0.5rem; border-radius:0.2rem; }
.shead{ background:var(--bgtb2); padding:0.5rem 1rem; border-bottom:var(--border); border-top-left-radius:0.5rem; }

.list2{  }
.list2 .row{ display:flex; border-bottom:var(--border); }
.list2 .row>div{ display:flex; flex-direction:column; padding:1rem 0.5rem; }
.list2 .img{ text-align:center; justify-content:center;/*水平居中*/ align-items:center;/*垂直居中*/ }
.list2 .img img{ max-width:40px; height:auto; }
.list2 .img a{ font-size:2.5rem; }
.list2 .main p{ display:block; padding:0; margin:0; }
.list2 .main p.note{ color:#999; font-size:small; word-break:break-all; white-space:normal; padding-top:0.5rem;}
.list2 .more{ color:#999; font-size:small; text-align:right; }
.list2 .more .time, .list2 .more .tag{ color:#999; }

.list1{  }
.list1 .row{ display:flex; border-bottom:var(--border); }
.list1 .row>div{ display:flex; flex-direction:column; padding:1rem 0.5rem; }
.list1 .shead>div{ padding:0; }
.list1 .row>div:first-child{ padding-left:0; }
.list1 .row>div:last-child{ padding-right:0; }

.flex{ display:flex; } .flex>div{ display:flex; flex-direction:column; }
.col1{ width:100%; } .col2{ width:200%; } .col3{ width:300%; } .col4{ width:400%; } .col5{ width:500%; }
.col6{ width:600%; } .col7{ width:700%; } .col8{ width:800%; } .col9{ width:900%; } .col10{ width:1000%; }
.c21{ width:50%; } .c31{ width:33%; } .c32{ width:66%; } .c41{ width:25%; } .c43{ width:75%; } .c51{ width:20%; }
.pa05{ padding:0.5rem } .pa10{ padding:1.0rem } .pa15{ padding:1.5rem } .pa20{ padding:2.0rem }
.ma05{ margin:0.5rem } .ma10{ margin:1.0rem } .ma15{ margin:1.5rem } .ma20{ margin:2.0rem }
.ml05{ margin-left:0.5rem } .ml10{ margin-left:1.0rem } .ml15{ margin-left:1.5rem } .ml20{ margin-left:2.0rem } 
.mr05{ margin-right:0.5rem } .mr10{ margin-right:1.0rem } .mr15{ margin-right:1.5rem } .mr20{ margin-right:2.0rem }
.mr24{ margin-right:24px; }

.btn, .btn-group>div{ display:inline-block; text-align:center; vertical-align:middle; white-space:nowrap; 
  cursor:pointer; padding:4px 12px; border:var(--brdC); }
.btn{ border-radius:4px; }
.btn-act{ color:var(--bga); background-color:var(--em); }
.btn-act .fa{ color:#FFF; }
a.btn-act:hover{ color:var(--bga); }
.btn-red{ color:#F00; }
.btn-gray{ color:var(--c8); }

.btn-group{ display:flex; } 
.btn-group>div { border-left:0; }
.btn-group>div:first-child{ border-top-left-radius:5px; border-bottom-left-radius:5px; border-left:var(--brdC); }
.btn-group>div:last-child{ border-bottom-right-radius:5px; border-top-right-radius:5px; }

input, select, textarea{ display:inline-block; padding:6px 12px; color:(--c5); background-color:var(--bga); border:var(--brdD); border-radius:4px; }


.msg{} 
.msg .error, .msg .okey, .msg .wait{ text-align:center; font-size:5rem; }
.msg .error i, .toast .error{ color:#F00; }
.msg .okey i, .toast .okey{ color:#17935d; }
.msg .wait i, .toast .wait{ color:#666; animation:kfwait 2s linear infinite; }
@keyframes kfwait{ from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(360deg)} }

.msg h3{ font-size:18px; color:var(--title); text-align:center; }
.msg img{ min-width:60px; max-width:80px; }
.msg .gray{ color:#666; }

.mask { position:fixed; z-index:4000; top:0; right:0; left:0; bottom:0; background:rgba(0,0,0,0.5); }
.dialog { position:fixed; z-index:5000; top:50%; left:1rem; right:1rem; max-width:480px; max-height:95vh;
  transform:translate(0,-50%); background-color:var(--bgbd); text-align:center; border-radius:12px; overflow-y:hidden; margin:auto; }
.dialog .bd{ max-height:70vh; overflow-y:auto; text-align:left; background-color:var(--cF); padding:0 1rem 0 1rem; border-top:var(--border); }
.toast { text-align:center; background-color:var(--bgbd); font-size:1.8rem; width:120px; min-height:120px; 
  position:fixed; z-index:5000; top:40%; left:0; right:0; padding:0.8rem 0.1rem 0.1rem; margin:auto; border-radius:4px; }
.toast .fa{ font-size:2.5rem; padding:0.3rem 0; }
.toast .text{ display:block; font-size:1.2rem; padding:0.3rem 0.1rem; word-break:break-all; white-space:normal; }

.grbox{ min-height:90px; }
.grbox>div{ border:0px solid #DDD; border-left:1px dashed #DDD; }
.grbox>div:first-child { border-left:0px dashed #DDD; }
.grbox>div a{ display:block; text-align:center; padding:1rem; }
.grbox>div a:hover{ color:var(--hover); text-decoration:none; }
.grbox>div a i{ display:block; color:var(--link); font-size:48px; }
.grbox>div a img{ height:48px; display:block; margin:auto; }
.grid{ display:flow-root; }
.grc2, .grc3, .grc4{ float:left; /*border:1px solid #CCC;*/ box-sizing:border-box; }
.grc2{ width:50%; } .grc3{ width:33.33%; } .grc4{ width:25%; }
.laybox{ }
.laybox>div { text-align:center; padding:1rem; border:0px solid #DDD; border-left:1px dashed #DDD; }
.laybox>div:first-child { border-left:0px dashed #DDD; }
.laybox>div span, .laybox>div b, .laybox>div i{ color:#555; }
.laybox>div i{ display:block; font-size:36px; padding:0.5rem 0; }
.laybox>div b{ font-weight:normal; text-align:center; color:#888; float:left; display:inline-block; width:18px;
    padding:0.0rem; margin-left:0rem; border:1px solid #CCC; border-radius:0.5rem; }
.laybox>div b.act{ color:#FFF; background:#F00; border:1px solid #F00; }
.laybox>div p{ color:#999; font-size:small; margin:0.3rem -1rem 0.3rem -1rem; }

.smenu { position:fixed; z-index:4200; top:0px; min-width:280px; max-width:480px; max-height:96vh;
  background-color:var(--bgbd); text-align:left; overflow-y:auto; margin:auto; }
.smenu .close{ background:var(--bgbd); }
.smenu .hd{ font-size:1.2rem; background:var(--bgtb2); word-break:keep-all; white-space:nowrap; padding:0.5rem 1rem; }
.smenu .hd img{ vertical-align:middle; max-width:36px; max-height:36px; padding-right:0.5rem; border-radius:0.5rem; }
.smenu .bd{ background:var(--bga); } 
.smenu .bd{ max-height:calc(96vh-130px); overflow-y:auto; text-align:left; padding:0 1rem; border-top:var(--border); }
.smenu .bd ul{ padding:0; margin:0; }
.smenu .bd li{ padding:0.5rem 0 0.5rem 2rem; margin:0; border-top:var(--border); list-style:none; }
.smenu .bd li p{ padding:0.5rem 0 0.5rem 0; margin:0; border-bottom:var(--border); }
.smenu .bd li:first-child{ border-top:0; }
.smenu .ft{ text-align:center; background:var(--bgtb1); padding:1rem; border-top:var(--border); }
.smenu-left { left:0; right:auto; border-bottom-right-radius:0.5rem; }
.smenu-right { left:auto; right:0; border-bottom-left-radius:0.5rem; }

.tophd{ position:relative; }
.tophd h1{ text-align:center; font-size:1.8rem; margin:0.5rem; }
.tophd .subtitle{ text-align:center; color:#666; }
.tophd .logo, .tophd .btn, .tophd .fa{ display:inline-block; position:absolute; }
.tophd .logo{ left:1rem; top:0rem; background:#FFF; padding:0 0.2rem; margin-top:1rem; border-radius:5px; }
.tophd .logo img{ max-height:27px; }
.tophd .btn{ right:1rem; top:1rem; }
.tophd .fa{ right:1rem; top:1rem; }

.tmenu { max-width:var(--wpc); clear:both; padding:0 1rem; margin:auto; }
.tmenu>ul{ display:flex; background:var(--bgtb2); padding:0; margin:0 -1rem; box-shadow:5px 5px 3px #888; }
.tmenu li{ display:flex; flex-direction:column; position:relative; width:100%; text-align:center; float:left; 
  padding:1rem 0; border:var(--border); }
.tmenu li p{ padding:0; margin:0; }
.tmenu li ul{ display:none; z-index:3000; position:absolute; background:var(--bgbd); padding:0; margin:2.5rem 0 0 0; box-shadow:10px 10px 5px #888; }
.tmenu li p .r{ font-size:1.2rem; padding:0 0.5rem 0 0; }
.tmenu li .act a{ color:var(--hover); }
.tmenu li>ul ul{ width:100%; left:100%; top:-2.5rem; background:var(--bgbd); }
.tmenu li>ul li{ background:var(--bga); } 
.tmenu li:hover ul { display:block; }
.tmenu li:hover ul ul{ display:none; }
.tmenu li:hover ul li:hover ul { display:block; }

/* pc */
.whead, .wfoot{ min-width:var(--wmin); max-width:var(--wpc); clear:both; margin:auto; }
.wsec, .wsec2{ min-width:var(--wmin); max-width:1190px; clear:both; margin:auto; }
.whead, .wfoot{ padding:1rem; }
.wsec{ display:flex; background-color:var(--bga); padding:0; }
.wsec>div{ display:flex; flex-direction:column; }
.wmain article{ width:100%; padding:0 0 0 0; }
.wsub1{ min-width:300px; margin:0 1rem 0 -1rem; }
.wsub2{ min-width:300px; margin:0 -1rem 0 1rem; }

.hlogo, .hmain{ display:inline-block; padding:4px; }
.hlogo{ float:left; background:#FFF; padding:0.3rem; border-radius:0.3rem; }
.hlogo img{ max-height:58px; vertical-align:middle; border-radius:0.3rem; }
.hmain{ padding:4px 1rem; }
.hmain .fa-bars{ display:none; }
.hmain h1{ font-size:1.5rem; font-weight:normal; padding:0; margin:0; }
.hmain p{ font-size:1.0rem; padding:0; margin:0; }
.hext{ float:right; }

.vmaxb, .vmaxi{ display:none; }
@media only screen and ( min-width:1200px) {
  .vmaxb{ display:block; }
  .vmaxi{ display:inline-block; }
}
@media only screen and ( max-width:1200px) {
  .tmenu{ padding: 0; max-width:100%; }
  .tmenu>ul{ margin:0; }
}

@media only screen and ( max-width:1050px) {
  
}

@media only screen and ( max-width:900px) { 
  /**/
}

@media only screen and ( max-width:750px) { 
  .wsec>div.wsub1, .wsec>div.wsub2{ display:none; }
  .html, .text, .md{ width:auto; }
  .hext{ float:none; }
  .navh ul{ width:780px; }
  .navh { overflow-x:auto; }
  .navh ul { overflow-x:scroll; }
  .navh ul li { float:left; margin:0 10px; }
  .tmenu .tmhid{ display:none; } 
}
@media only screen and ( max-width:550px) { 
  .hlogo{ width:100%; float:none; text-align:center; background:var(--cF); padding:1rem 0 1rem 0; }
  .hmain{ width:100%; float:none; text-align:center; padding:0rem 0 1rem 0;}
  .hext{ display:none; }
  .hmain .fa-bars, .hmain .fa-remove{ display:inline-block; float:right; font-size:1.8rem; }
  .tmenu{ display:none; }
  .grbox{ min-height:48px; }
  .grbox>div a{ padding:0.5rem; }
  .grbox>div a i{ font-size:24px; }
  .grbox>div a img{ width:24px; width:24px; }
  .hmin, .list1 .row>div.hmin, .list2 .row>div.hmin{ display:none; }
}

/* pager */
.pg_bar{ /*width:100%;*/ margin:auto; text-align:center; }
.pager { display:inline-block; padding:0; margin:1rem auto; font-family:'Verdana','Tahoma','Arial'; }
.pager>li { display:inline-block; background-color:#FFF; border: 1px solid #DDD; }
.pager>li:first-child { border-top-left-radius:5px; border-bottom-left-radius:5px }
.pager>li:last-child { border-top-right-radius:5px; border-bottom-right-radius:5px }
.pager>li a{ display:inline-block; cursor:pointer; padding:5px 10px; }
.pager>li a, .pager>li a span{ color:var(--link); }
.pager .pg_pagno a, .pager .pg_total a{ color:var(--text); }
.pager>li input{ width:60px; display:inline-block; text-align:center; padding:5.5px 5px; margin:1px auto; border:0; }
.pager .fa{ line-height:24px; height:24px;  }
@media only screen and (max-width:550px){
  .pager .pg_pagno, .pager .pg_total{ display:none; }
  .pager .pg_first{ border-top-left-radius:5px; border-bottom-left-radius:5px; }
  .pager .pg_last { border-top-right-radius:5px; border-bottom-right-radius:5px; }
} 
