/* lzljxl  */

*  { margin:auto; font-family:SimSun; }  
/* header, section, footer, aside, nav, article, figure  {  display: block; }    */
body { font-size:1.2em; line-height:1.4em; text-align:center; padding:0; background-color:#93FF93 ;  } 
img  { width: 100%; vertical-align:middle; } 
/* .clip1 { clip-path:inset(0 10%  0 10%);  } */

.imgs     { width: 100%; height:auto; white-space:nowrap ; overflow:hidden; overflow-x:auto; text-align:center;}
.imgs img { height:13em; width:auto ;  margin:0; }   
.hd   img { height:16em; }  

/* 页头动画 */
.hd_div  { position:absolute; left: 0px; top: 2em ; width: 100%; font-size: 1em;  }
.hd_anim { animation: hd_anim 20s infinite; -webkit-animation:hd_anim 20s infinite; 
           display: inline-block;   width: auto;  font-size: 0em;    } 
.hd_anim b { font-size:0.6em; color:rgb(11, 238, 14) ;  margin-bottom: 1em; display: inline-block; 
                text-shadow: 1px 1px 3px #a40699, -1px -1px 3px #a40699 ; }  
.hd_anim a { font-family:KaiTi, SimSun; letter-spacing: 0.1em;   display: inline-block; 
                text-shadow: 1px 1px 3px purple, -1px -1px 3px purple ; font-size: 1em  }  
@keyframes hd_anim {  
    0%  { opacity: 1; font-size: 0em; color:white }
    25% { opacity: 1; font-size: 3.5em; color:pink }
    80% { opacity: 1; font-size: 3.5em; color:yellow}
    100%{ opacity: 0; font-size: 1em; }
} 
@-webkit-keyframes hd_anim  {
    0%  { opacity: 1; font-size: 0em; color:white  }
    25% { opacity: 1; font-size: 3.5em; color:pink   }
    80% { opacity: 1; font-size: 3.5em; color:yellow}
    100%{ opacity: 0; font-size: 1em;}
}

h1, h2, h3, h4 {text-align: center;}
.mtxt { text-align:left; padding: 1em; padding-right: 0.7em; max-width: 60em ;  }
.mtxt img { width: calc(50% - 2em); margin: 1.5em ; border-radius:0.5em; float:right }  /* 图片靠右 */
.mtxt p { text-indent:2em; } 

.stxt { text-align: left; display: inline-block; margin:1em 1em 1em 3em; } /* 诗词居中 */ 
.stxt div { text-align: center; margin:0 0  1em -3em; } 
.stxt span  { display: inline-block;  } 
.stxt img   { border-radius:1em; }
.brno { display: none; }
.ma { margin:1em }

img[src$="hd10.jpg"] { display:unset;}
img[src$="hd10-1.jpg"] { display:none;}

/*a { display:inline-block; }*/   
a:link { color:darkblue }
a:visited { color:blueviolet }

.as { max-width:45em; }
.as  a { font-size:1.1em;  margin-left:1em; font-weight:bold; min-width:11em;  margin-top:0.5em ;
         display:inline-block; text-align:left;  text-decoration:none;color:black;  cursor:pointer;   }     

.as a  .rq  { font-size:0.85em; display:block; font-weight:100; color:indigo; margin-top:-0.2em; text-align:right }   

.a1  { font-size:1em;  text-decoration:none; color:indigo; cursor:pointer }   
.a1:link { color:indigo }
.a1:visited  { color:indigo }

.imgb { text-align:center;  }
.imgb img {width:98%; max-width:45em; border: 2px solid pink; margin-bottom:0.3em; float:none }  

 
/*   展开和隐藏  */
.mor_chk { visibility:hidden; width:0; height:0; margin:0}
.mor_hed { text-align:left;padding-right: 1em;  text-decoration:none; color:indigo; cursor:pointer;
           background: no-repeat center right url(Images/zk4.png); background-size:1em;   } 
.mor_con { text-align:left; margin-top:1em; border-bottom:1px dashed blue; display:none }
.mor_end { display:block; padding: 1em ; background: no-repeat bottom center url(Images/zk2.png); background-size:1em;cursor:pointer;  } 
.mor_line{ padding:0.5em} 
 
input[class="mor_chk"]:checked + .mor_hed ,input[class="mor_chk"]:checked + * > .mor_hed 
        { background-image:url(Images/zk3.png); font-weight:bold ;color:blue } 
input[class="mor_chk"]:checked + .a1  { color:blue } 
input[class="mor_chk"]:checked + * + .mor_con { display: block;}   
 

/*目录表   
    rgba(250,250,0,0.5) 背景透明，文字不透    设置子元素为相对定位，可让子元素不继承Alpha值
    filter:alpha(opacity=60);-moz-opacity:0.60;-khtml-opacity: 0.60; opacity: 0.60;  
*/   
.nav_show { position: fixed; z-index:9998; color:red ; right:6%;  display:inline-block;
            font-size:2em; font-weight: bold; border-radius: 50%; bottom: 0.1em;  padding: 0 0.3em;  
            background-color: rgba(0,255,0,0.5); cursor:pointer ; line-height: 1.2em;
            text-shadow: 1px 1px 3px white , -1px -1px 3px white; } 
            
.nav_hide { position: fixed; z-index:9995; transition: 1s;  padding-right: 1em; bottom: 0 ; right:0;
             width: 0; max-width: 18em;   visibility: hidden; cursor:pointer;color: red; }
           
.nav_hide b { font-size: 2em; margin-left: 0.5em; }
            
.nav_list { position: fixed; z-index:9990; transition: 1s;    /* transition-delay: 0.2s; */
            bottom: 0; right:0; width: 0; max-width: 18em; height: 100%; visibility: hidden;
            padding: 0.2em ;text-align:left; overflow:hidden; overflow-y:auto; 
            white-space:nowrap; background-color:LightCyan ;  }   /* gainsboro */ 

.nav_list a  { padding:0.2em 0; width:99%;margin-left:1em;color:blue; 
               text-decoration:none ;   cursor:pointer} 
.nav_list a b { color:darkblue;}
.nav_list a span { font-size:0.8em; color:cornflowerblue;margin-left:1em; }

.nav_list .selected   { color:rosybrown;margin-left:0; }
.nav_list .selected b { color:rosybrown;} 
.nav_list .selected::before {content: "★"; color:rosybrown;}
 
.nav_show:hover~.nav_list , .nav_show:focus~.nav_list ,
.nav_show:focus~.nav_hide ,  
.nav_list:hover  { width: 80%; visibility: visible;  }    

@media (max-width: 500px ), (max-height: 500px ){ 
    .brno { display:block;  } 
    img[src$="hd10.jpg"]   { display:none;}
    img[src$="hd10-1.jpg"] { display:block;}   
    .imgs img { height:11em; }   
    .hd   img { height:12em; }   
    .mtxt img { width: 100% ; margin: 0;}   
    .hd_div  { font-size: 0.8em ; }   
      
}