/*[test]{ outline: 1px solid red; }*/

:root {
  --padsides: 10vw;
  /*--themecolor: rgb(211,45,39);*/
  --themecolor: #d7d5d5;
  --color:#000;
  text-shadow: 0 0;
  color: #000;
  /*text-shadow: 0 0 black;*/
}
* {
  color: #000;
}

html, body {
  width: 100%;
  font-size:1vw;
  /*font-family:  !important;*/
  background-color: #fcfdfd !important;
}

html, body, p,a,div,dl,dt,dd,ul,input,button, LogoHeader, navbar, banner, footer {
  margin: 0; padding: 0; border:0; box-sizing:border-box;outline:none;list-style: none;
}

LogoHeader, navbar, banner {
  display: block;
  width: 100%;
  position: relative;
}

navbar > a, navbar > inblock {
  position:relative;text-align:center;color:#fcfdfd!important;
  border-radius: 5px;transition:background 200ms ease-in-out;
  margin: 5px 0;
  /*padding: 10px 22px;*/
  padding: 10px 1.1vw; 
  transition: color 250ms ease-in-out, background 250ms ease-in-out!important;
  /*padding: 16px 30px;*/
} 
navbar > a:hover, navbar > a[active], navbar > inblock:hover, navbar > inblock[active]{
  /*background:rgba(99.01, 30.627, 28.49, 10%); */
  background:rgba(99.01, 30.627, 28.49, 16%);
}
navbar > a:hover > [menubox], navbar > inblock:hover > [menubox] { transform: scale(1)!important;opacity: 1!important; }

banner>a, banner>a>img { width:100%;height:100%; }
banner>a{ position: absolute;left: 0;top: 0;z-index:1;transition:all 400ms ease-in-out!important;opacity:0.2; }
banner>a[active]{ opacity: 1;z-index:50!important; }

LogoHeader {
  opacity: 0.01;
  /*background: url(http://admin.faef.org.cn/prod-api/profile/upload/2022/06/07/6e6657ce-add7-4b5e-a346-2b9c23cca9b8.jpg) no-repeat center;*/
  background: var(--logourl) no-repeat center;
  background-size: cover;
  transition:all 200ms;
}
html[style*="--logourl"] LogoHeader { opacity: 1; }
LogoHeader > p { display: none; }
LogoHeader > a > img {
  display: none;
  /*position:absolute;
  margin: 0!important;
  left: 0;
  top: 0;
  width: 100%!important;
  height: 100%;
  object-fit: contain;*/
}

img{ object-fit: cover; }
a { display: inline-block;color: inherit;text-decoration: none; }
button{ cursor: pointer; }
input, button {
  border: 1px solid rgb(223 223 223 / 70%);
  border-radius: 5px;
  transition: all 300ms ease-in-out;
  max-height: 50px;
  font-size: 0.9vw;
} input:hover{ opacity: 0.5; } input:focus{ opacity: inherit; }
input:focus, input:hover, button:focus {
  border-color:var(--themecolor);
  box-shadow: 1px 1px 10px 2px #ccc;
}
/*input[invalid]::-moz-input-placeholder, input[invalid]::-ms-input-placeholder,*/
input::-webkit-input-placeholder{ transition: all 250ms ease-in-out; }
input[invalid]::-webkit-input-placeholder { /*WebKit browsers*/
  color: rgb(211,45,39);
  font-style: italic;
  font-weight: 500;
  font-size: 1.1rem;
}input[invalid] {
  border: 2px solid rgb(211,45,39)!important;
 }

[tipmark]{position: relative;}
[tipmark]:before{
  content: "";
  display: block;
  width: 5px;
  height: 1.6vw;
  position: absolute;
  left: -20px;
  top: 50%;
  background: rgb(68 38 36 / 60%);
  transform: translateY(-50%);
}

[arrow], [z-arrow]{ --arrow-top: calc(100% + 0.6vw); }
[arrow], [z-arrow]:after {
  content: "\25B2"; /*▲(\25B2) | ➤(\27A4)*/
  position: absolute;
  top: var(--arrow-top);
  transform:rotate(0deg) scale(0);
  color: #898282;
  font-size: 1.2vw;
  transition:all 200ms ease-in-out;
}[active] [arrow], [active][z-arrow]:after{
  transform:rotate(180deg) scale(1);
}

[w100]{ width: 100%; }[h100]{ height:100%; }[wh]{ width:100%;height:100%; }

[transition]{ transition: all 250ms ease-in-out; }

[cpointer]{ cursor: pointer;transition:all 250ms ease-in-out; }[cpointer]:hover{ opacity: 0.75!important; }
[cpointer][hover]:hover, [cpointer][hover][active]{ background:var(--hover-background)!important;color:var(--hover-color)!important;  }
[cpointer][hover]:hover *:not([arrow]), [cpointer][hover][active] *:not([arrow]){ color:var(--hover-color)!important; }
[cpointer][not-allowed]{ color: #ccc;cursor:not-allowed;opacity:0.6; }

[inblock],inblock{display:inline-block;}
#vertical_bar inblock{width: 100%;}
[fwrap]{ flex-wrap:wrap;}
[fcolumn]{ display: flex;flex-direction: column; }
[fcenter]{display:flex;align-items:center;justify-content:center;}
[fbetween]{display:flex;align-items:center;justify-content:space-between;}

[more]{ text-shadow:none;flex:1;justify-content:flex-end; }
[more]>a:hover{ text-decoration:underline;color:var(--themecolor); }

/*width:100px;*/
#BannerPoint, z-tabbar {
  height:30px;padding: 0 12px;
  background:rgba(44,41,41,80%);
  position:absolute;
  right:12px;bottom:7px;
  border-radius:30px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  z-index: 200;
} #BannerPoint > inblock, z-tabbar > inblock {
  border-radius:100%;
  width:8px;height:8px;margin: 0 6px;
  cursor: pointer;
  transition: all 250ms ease-out;
  opacity:0.7;
  background: rgba(215, 213, 213, 0.65);
  /*background:rgb(188 145 144);*/
} #BannerPoint > inblock[active], z-tabbar > inblock[active] {
  opacity:initial;
  background:rgb(188 145 144);
} [z-tabbar] {
  display: none;opacity: 0;
  transition: opacity 400ms ease-in-out;
} [z-tabbar][active="pre"] {
  display: inherit;
  opacity: 0;
} [z-tabbar][active="active"] {
  display: inherit;
  opacity: 1;
} z-tabbar[hidden] { display: none; }

[z-banner] {
  display: flex;
  justify-content:space-between;
  /*transition: all 1000ms ease-in-out 0s;*/
  /*transform: none;*/
}
[z-banner][data-empty], template[data-empty] {
  transform: none!important;
  display: flex; align-items: center; justify-content: center;
  height: 75%;
  font-size: 0.9vw;
}
[z-banner][data-empty]:before,template[data-empty]:before{font-size: 1.3em;color: #999;content: attr(data-empty);}
[z-banner] > *, img[scale], .footer-text-box img { width: calc((100% - 60px) / 5); min-width: calc((100% - 60px) / 5); transition:all 300ms ease-in-out;transform-origin: top; }
[z-banner] img:hover, img[scale]:hover, .footer-text-box img:hover { transform: scale(1.05); }
[z-banner] > *:not(:last-child) { margin-right: 15px; }

[data-isempty]{ position:relative; }[data-isempty]:after {
    content: attr(data-isempty);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #999;
}[data-isempty=""]:after{ display:none; }

[islist]{
  min-height: 80%;
  text-align: center;
  display: flex;align-items: center;justify-content: center;
}[islist][data-empty]:before {
  content: attr(data-empty);
  font-size: 0.9em;
  color: #999;
}

z-menu {
  position: absolute; width: 100%; left: 0; top: 100%; z-index: -999;
  transition: all 220ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  transform: scale(0.75,0.5625);opacity:0;
  /*transform-origin: center top;*/
  transform-origin: top left;left: 50%;
  color: var(--color);
  /*border: 1px solid rgba(99.01, 30.627, 28.49, 50%);*/
  /*background: rgba(99.01, 30.627, 28.49, 85%);*/
  background: rgb(215,213,213);
  border: 1px solid rgb(215,213,213);
  display: flex; flex-direction: column; align-items: center;
  border-radius: 5px;
  box-sizing: border-box; line-height: 2; padding: 8px 0px;
  min-width: -webkit-max-content;
} z-menu>a {
  display: flex;align-items: center;justify-content: center;
  width: 100%;transition: all 200ms ease-in-out;cursor: pointer;
} z-menu[show=true] {
  transform: scale(1) translateX(-50%)!important;opacity:1;z-index:99999;
  box-shadow: 0 0 16px rgb(0 0 0 / 12%), 0 16px 16px rgb(0 0 0 / 24%);
} z-menu>a:hover {
  opacity:0.8;
  color:rgba(99.01, 30.627, 28.49, 85%);
  text-decoration: underline;
} z-menu>a[active] {
  color: rgba(99.01, 30.627, 28.49, 85%);
}

/*#a29292*/
z-loading {
  line-height: normal;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 9999; left: 0; top: 0;
  /*background: rgba(231,224,224,0.93);*/
  /*background: rgb(96 64 64 / 10%);*/
  background: rgb(68 68 68 / 70%);
  color: #604040;
  transition: all 300ms ease-in-out; opacity: 0;
  --animage: slide 1s infinite;
  --anitext: light 2s infinite;
  --transition: all 300ms ease-in-out 0s;
}

z-for{ display:none!important; }

[titlebar] {
  position: absolute;
  left: 0;bottom: 0;
  width: 100%;
  height: 4.4vw;
  background: rgb(50 12 11 / 60%);
  max-height: 45px;
  z-index: 3;
  font-size: 0.9vw;
  color: #d4dfdf;
  letter-spacing: 0.1rem;
  transition: all 300ms ease-in-out;
  transform: translateY(100%);
}[active]>[titlebar] {
  transform: none;
}

[menutitle=""]:hover > [menubox]{ transform: scale(1);opacity: 1; }
[menutitle="hidemenubox"] > [menubox] { transform: scale(0);opacity: 0; }
[menubox] { position: absolute;width: 100%;left: 0;top: 100%;z-index: 10000;transition: all 200ms ease-in-out;padding-top: 7px;transform-style: preserve-3d;transform: scale(0);opacity: 0;transform-origin: top; }
[menubox] > [menu] { position: static!important; }
[menu] {
  position: absolute;
  width: 100%;
  top: calc(100% + 0.6rem);
  background: #fcfdfd;
  border: 0px solid var(--themecolor);
  left: -8px;
  border-radius: 5px;
  padding: 0px;
  text-align: center;
  line-height: 2;
  max-height: 0px;
  overflow: hidden;
  box-sizing: content-box;
  transition: all 200ms ease-in-out;
} [menu][ifshow="true"] {
  padding: 10px 6px;
  max-height: 500px;
  border: 1px solid var(--themecolor);
  /*box-shadow: 1px 1px 10px 2px #ccc;*/
  box-shadow: 0 0 16px rgb(0 0 0 / 12%), 0 16px 16px rgb(0 0 0 / 24%);
} [menu] > *:hover {
  color: var(--themecolor);
} [menu] > [active] {
  text-decoration: underline;
  color: var(--themecolor);
}

footer {
  /*opacity: 0;*/
  /*transition: opacity 200ms;*/
  min-height: 300px;
}
footer * {
  color: #444;
  text-shadow: none;
  font-size: 0.85vw;
}
.footer-text-box img {
  vertical-align: middle;
  height: 40px!important;
  margin-top: 20px;
  /*margin-right: 30px;*/
  width: auto;
}



#vertical_bar:not([ignore]) > div:after {
    content: "\25B2";
    transform: rotate(0deg) scale(0);
    display: inline-block;
    transition: all 200ms ease-in-out;
    position: absolute;
    right: 0;
    top: 50%;margin-top: -0.77vw;
    color: rgb(168 70 56)!important;
}
#vertical_bar:not([ignore]) > div:hover, #vertical_bar > .active {
    color: rgb(168 70 56)!important;
    border-color: rgb(168 70 56)!important;
}
#vertical_bar:not([ignore]) > div:hover:after, #vertical_bar > .active:after {
    transform: rotate(90deg) scale(1.2)!important;
}

#AppMenuButton{opacity:0;pointer-events:none;right: -3px!important; width: 60px!important; align-items: center!important;background-color: rgba(255,255,255,0.15);border-radius: 7px;}
#AppMenuButton>div { background: #444!important; }

#list_root { background: rgb(68 68 68 / .1)!important;transition:background 250ms; }
body[loading] #list_root { background: white!important; }

z-frame{ background: rgb(252, 253, 253); }

a[isvideo] {
  position: relative;
  display: block;
} 
/*a[isvideo]:before {
  content: "";
  position: absolute;z-index: 999;left:0;top:0;
  width:100%;height:100%;
  background-color: rgb(40 35 33 / 30%);
  background-image: radial-gradient(transparent,rgb(0 0 0 / 0.7));
}*/
a[isvideo] > img { filter: brightness(0.6);transition:filter 250ms; }
a[isvideo]:after {
  content: "";
  /*opacity:0;*/
  position: absolute;
  z-index: 1000;
  width: 0px;height: 0px;
  border-style: solid;
  border-color: transparent transparent transparent rgb(223 189 185);
  left: 50%;
  top: 50%;
  transform: translate(-30%,-50%);
  border-width: 1.2vw 2vw;
  border-radius: 5px 0px 0px 5px;
  transition: all 250ms, opacity 500ms;
  
  filter: drop-shadow(2px 4px 6px #222);
  
  transform: translate(-40%,-50%);
  border: none;
  width: 34px;height: 34px;
  background: url(https://v.qq.com/favicon.ico) no-repeat center;
  background-size: cover;
}
/*a.onload:after{ opacity: 1; }*/
a[isvideo]:hover > img {
  filter: brightness(0.9);transition:filter 250ms;
}
a[isvideo]:hover:after {
  width: 44px;height: 44px;
  /*border-color: transparent transparent transparent #FF5722!important;*/
}

@media screen and (min-width: 769px){ 
  #headMaster{ bottom: 3.2vw!important;padding-bottom: 2.4vw!important; }
  #article_box { min-height: calc(90vh - 7vw)!important; }
  .footer-text-box { margin-left: -30px; justify-content:flex-start!important; }
  .footer-text-box > a { width: 300px; margin-left: 30px; }
  #list > div { padding-bottom: 1.1vw!important; }  
}

@media screen and (max-width: 768px) {
    :root{ --padsides: 3.3vw; }
    *, :after{ font-size: 3vw; }
    a[isvideo]:after {border-width: 20px 30px!important;transform: translate(-40%,-75%)!important;}
    #goTop { right: 0px!important; }
    html,body,#article_box > div:first-child{ font-size: 3vw!important; }
    #certStyle > div > span, [arrow], [z-arrow]:after, footer *{ font-size: 2.5vw!important; }
    body{ overflow-x: hidden;overflow-y: auto; }
    /*body>div>logoheader{padding: 10px 10vw 5px 3vw!important;}*/
    body>div>logoheader{padding: 0 10vw 0 3vw!important;}
    body>div>logoheader img{width: 100%!important;margin-top: 4px;margin-left: -5px;}
    [titlebar]{ height: 40px;max-height: 40px;font-size:2.5vw!important; }
    #QueryCertBox{ pointer-events:none;  }
    #QueryCertBox.active{ pointer-events: auto; }
    body>div[fbetween]{ flex-direction: column; }
    body>inblock+div, body>article{ padding: 2.4vw!important; }
    body>inblock+div {flex-direction: row!important;height: 15vw!important;padding: 0 2.4vw!important;align-items: flex-end!important;
        /*margin-bottom: -10px!important;*/
        margin-bottom: 5px!important;
    }
    body>inblock+div>div {height: auto!important;padding: 10px 0!important;}
    body>inblock+div>div>img,body>inblock+div>div>img+div>span:last-child,#navbar{display: none!important;}
    body>inblock+div>div>img+div {word-break: keep-all;}
    #queryCert{ height: 55vw!important;padding-bottom: 2.8vw;margin-top: 25px!important; }
    #queryCert>div,input,button{ font-size: inherit!important; }
    #certStyle{ min-height: 21vw!important; }
    form>div:first-child{ height: 35px!important; }
    #vertical_bar{ line-height: 3.8!important; }
    #vertical_bar > div:after{right:-2.2vw!important;}
    #vertical_bar:not([ignore]) > div:after{top:3px!important;right:1vw!important;margin-top:0!important;}
    .zhuanjiabar > span:first-child{ padding: 0 7px!important; }
    #zhuanjiabar > span:last-child{ padding:0!important;left: 1px;position: relative; }
    #zhuanjiabar > span:not(:last-child){ padding: 1vw 2vw!important; }
    footer{ padding: 1.2vw 7.3vw!important; }footer>div{width: 100%;}
    footer>div>[tipmark]{margin:auto!important;width:-webkit-max-content;width: max-content;}
    [tipmark]:before{ left:-16px;min-height: 20px; }
    #vertical_bar:not([ignore]) > div {height: 6vh!important;}
    #vertical_bar:not([ignore]) > div:last-child {border-color: transparent!important;}
    #vertical_bar:not([ignore]) > .active {
      border-color: rgb(168 70 56)!important; 
    }
    #article_box{ width: 100%!important;min-height:200px!important;margin-bottom: 10px;}
    .loading{ opacity: 0;transition:all 180ms ease-in-out; }
    #listbox,z-frame{ width: 100%!important;box-sizing: border-box;padding: 1.1vw 3vw!important; }#listbox{ padding: 1.1vw 2.5vw!important; }
    #listbox > div:first-child{ padding-left: 4.6vw!important; }
    #list div[w100] > span:first-child, #pagetitle, #list img+span{ font-size: 3.5vw!important; }
    #list img+span{ top:calc(100% + 1.2vw)!important; }
    #list div[w100] > span:nth-child(2){ font-size: 3vw!important; }
    #list div[w100] > span:nth-child(3){ font-size: 3.3vw!important; }
    #list > div{ margin-bottom: 2.7vw!important;padding: 2.1vw!important; }
    #list > div:first-child{ margin-top: 7px!important; }
    #list > div:last-child { margin-bottom: 9vw!important; }
    #list img:not([scale]){ margin-right: 12px!important;width: 12vw!important;height: 15vw!important; }
    #list div[fcolumn] > span:not([i]){ transform: scale(0.7);top: calc(100% - 2.3vw);bottom: auto!important;width: 100vw;text-align: right;right: -15vw!important; }
    #list div[fcolumn] > span:not([i]) + span{ transform: scale(0.9);left: -4.9%;position: relative; }
    .footer-text-box img{ object-fit: contain;max-width: 100%;height: 40px!important;margin-top: 20px!important;margin-right: 15px!important; }
    .footer-text-box .placeholder{ display:inline-block!important; }
    #AppMenuButton{ opacity:1!important;pointer-events:auto!important;transition:all 250ms ease-in-out; }
    #AppMenu.active {
      transform: scale(1)!important;
      box-shadow: 0 0 16px rgb(0 0 0 / 12%), 0 16px 16px rgb(0 0 0 / 24%);
    }
    #AppMenu.active + #AppMenuButton { background: rgba(255,255,255,0.8)!important;  }
    #AppMenu.active + div + div { display: block!important;  }
    #AppMenu > li > span{ font-size:16px!important;color: rgb(var(--color2)); }
    #navigatepageNums > div{ width: 22px!important;height: 22px!important;line-height: 22px!important; }
    #page{ transform: none!important; }
    body>div[onclick]{  padding: 0px 10px 6px 10px!important; }
    #AppMenuButton{ height:40px!important;justify-content:center!important; }
    #AppMenuButton>div:nth-child(2){ margin:4px 0; }
    
    .footer-text-box {  flex-direction: column!important;margin-bottom: 10px!important; }
    .footer-text-box .placeholder { display: none!important; }
    #videoCenter #certStyle { flex-direction: column!important; }
    a[isvideo][href]{ width: calc(100% - 20px)!important; margin: 15px auto!important; }
}



/* 主题颜色配置 */

:root { 
  --themecolor2: 215,213,213; --color2: 0,0,0; 
  --themecolor2: 72,72,72; --color2: 255,255,255; 
}
#navbar, z-menu, #article_box, footer { background-color: rgb(var(--themecolor2))!important; }
#navbar > inblock[active] {  background-color: rgb(var(--color2),.1); }
#navbar inblock { color:rgb(var(--color2)); }
z-menu {  border-color: rgb(255 255 255 / 20%); color:rgb(var(--color2)); }

#vertical_bar:not([ignore]) > div:not(.active):not(:hover) { color:rgb(var(--color2))!important; border-color: rgba(var(--color2),.1)!important; }
#list > div:hover { background-color: rgba(var(--themecolor2),.2)!important; }
footer * { color: rgba(var(--color2),.3)!important; }

/*

* { color: rgb(var(--color2)); }

#navbar, z-menu, #article_box, #list > div:hover, footer { background-color: rgb(var(--themecolor2))!important; }

#navbar > inblock[active] {  background-color: rgb(var(--color2),.1); }

z-menu {  border-color: rgb(255 255 255 / 20%); color:rgb(var(--color2)); }

#vertical_bar > div, #list > div { color:rgb(var(--color2))!important; border-color: rgba(var(--color2),.1)!important; }

#listbox { background-color: rgba(var(--themecolor2),0.2)!important; border-color: rgba(var(--themecolor2),0.5)!important; }
#listbox > div { background-color: transparent!important; color:rgb(var(--color2)); }

#list [fcolumn] > span, #list [fcolumn] > span > span, [cpointer][not-allowed], footer * { color: rgba(var(--color2),.3)!important; }
#list [fcolumn] > span:first-child { color: rgb(var(--color2))!important; }

#list_root { background-color: rgba(var(--themecolor2),.2)!important; }
*/