@charset "utf-8";/* CSS Document */
@import url('public.css');
/*阿里云书法字典项目*/
html{font-size:16px;}
.header{clear:both; overflow: hidden; background-color:#fbf5f0;box-shadow:rgba(180, 180, 180, 0.7) 0 0 5px;}
.header .wb{ padding-top:20px; padding-bottom: 20px;}

.top a{ color:#FFF; display:inline-block; margin:0 5px; text-decoration:none;}
.logo{width:100%;}
.logo a{float:left;margin-top:20px;}
.logo img{max-height:55px;}
.links{ padding-top:20px; padding-bottom:20px;}
.links a{color:#f60; display:inline-block; margin-right:10px;}
.notice{background:#4b4b4b;font-size:0.8rem; color:#fff3df; padding:10px 0 10px 0}

#search{margin-top:20px;}
.mainMenu{/*background:linear-gradient(242deg, #ff2456, #ffae34);*/    background: linear-gradient(188deg, #e98b17, #9f1535);margin-top:10px;line-height:50px;}
.mainMenu a{display:inline-block;font-weight:bold;width:90px;color:#eee;font-size:1rem;transition:ease-in-out .5s all; position:relative; text-decoration:none; text-align:center}
.mainMenu a:before{content:""; height:3px;width:0;left:0;right:0; margin:auto; bottom:8px; position:absolute; background-color: #fff;transition:ease-in-out .3s all}
.mainMenu a:hover{color:#fff;transition:ease-in-out .5s all}
.mainMenu a:hover:before{width:80%;transition:ease-in-out .3s all}
    .navBtn{ display:none;}

    
    .postion{  margin:5px auto;color: #666; }
    .postion a{color:#999;}
	.masterMenu{ margin-left:5px;}
    .masterMenu span{ display:inline-block; padding:5px 15px 5px 15px; border:#d3d3d3 solid 1px; border-radius:5px 5px 0 0; border-bottom:none;background: linear-gradient(5deg, #e7e7e7, #ffffff);margin-right:10px;}
	.masterMenu span.active{color:#A70609;}
    .masterList{ line-height:45px; background-color: #fff; border-radius: 5px 5px 0 0;}
    .masterList p:nth-child(even){ background-color:#fff6ec;}
    .masterList span{ margin-right:10px; width:45px; height:45px; text-align:center; display:inline-block; background-color: #960; color:#FFF}
    .masterList a{margin-right:10px;line-height:25px;padding: 2px 8px; display:inline-block; border:#bebdbd solid 1px; margin-bottom: 5px; border-radius:5px; text-decoration: none;}
    .masterList a:hover{ color:#F00;background-color: rgb(238, 215, 168);}
	.masterShufa>div{ margin-bottom:10px;}


  .infoList{ padding:20px; text-decoration:none}
   .infoList>div{ margin-bottom:5vh;}
  .infoList h2{ line-height:45px; border-bottom:#eee solid 2px; margin:15px 0 20px 0;}
  .infoList h4 a{ font-weight:bold; margin-bottom:10px; font-size:16px}
  
	.newsList{ padding:20px; text-decoration:none}
	.newsList h2{ line-height:45px; border-bottom:#eee solid 2px; margin:15px 0 20px 0;}
	.newsList h4 a{ font-weight:bold; margin-bottom:10px; font-size:16px}

.workList a img{width:100%;aspect-ratio: 4 / 3}
  
.pageList div{ display:inline-block}
.pageList a{ display:inline-block;  padding:8px 10px 8px 10px; min-width:46px; margin-right:5px; border:#efefef solid 1px; text-align:center; margin-bottom:5px; }
.pageList a:hover{ background-color:#096; color:#FFF; transition:ease-in-out all .3s}
.pageList a.active{background-color:#096; color:#FFF; }
.showImg{ line-height: 2; font-size: 16px;}

.search_ziti a{display: inline-block;padding: 8px 35px; margin-bottom:20px;background:linear-gradient(340deg, #4d4d4d, #c5c5c5);color: #fff;border-radius:10px 10px 0 0;}
.search_ziti a.active{background:linear-gradient(340deg, #fc3939, #ffa850);}
.newVip{ padding:15px 0 20px 0;}
.newVip a{ display:block; line-height:35px; margin-right:30px;}
.newVip img{ height:30px; width:30px; border-radius:25px;}


.lDiv{ width:800px; float:left;}
.rDiv{ width:260px; float:right;overflow:hidden;}

.picBox{margin-bottom:20px; }
    .picBox div{background:#fff;overflow:hidden;box-shadow: 0 0.5em 1em -0.125em rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.02);border-radius: 10px;}
    .picBox div img{ width:100%;aspect-ratio:1 / 1 ;height: auto;max-height:360px; border-bottom:#efefef solid 1px;}
    .picBox div p{margin:10px;}
    .picBox div p a{font-size:0.8rem;line-height:1.5;display:block;text-decoration:none; color:#666; text-indent:1rem;}
    .picBox div p a:hover{ background-color: #D64212;color: #fff;}

.splitPage{ clear:both; margin:30px auto; overflow:hidden; text-align:center;}
.splitPage ul{ float:right;}
.splitPage a:link,.splitPage a:visited,.splitPage a:hover{ display:block; padding:5px 10px; line-height:20px;  float:left; border:#CCC solid 1px; text-align:center; margin-right:10px; font-size:14px; text-decoration:none; background-color:#F9F9F9;}
.pageOn{background:#c00 !important; border:#666 solid 1px !important;color:#FFF}

.category{ line-height:35px; margin:15px auto; overflow:hidden; background-color: #fff;border-bottom:#efefef solid 5px; border-radius:2px;box-shadow:rgba(180, 180, 180, 0.7) 0 0 5px; border-radius: 5px;}
  .category ul{ padding:10px;font-size:0.9rem}
  .category ul p { border-bottom:dotted #CCC 1px; clear:both;}
  .category ul p a{padding:2px; }
  .more,.back{ width:80px; float:right; clear:both; font-size:12px; }
  .menuOn{ background:#C00; color:#FFF !important;}



.showInfo{ padding:15px;clear:both;overflow:hidden; background-color: #fff; }
    .showInfo hr{ margin:20px auto; border:none;border-bottom:#CCC dotted 1px;}
    .showInfo h1{margin:10px auto;}
	.showInfo h2{ margin:20px auto}
    .pubInfo{ margin:10px auto; color:#CCC; text-align:center}
    .charsetInfo{ margin:30px auto; text-align:center }
    .charsetInfo span{ display:inline-block;  line-height:30px; background:#f5f5f5; border:#dedede solid 1px; margin:5px;padding:0 10px 0 10px }
	
.show img{max-width:100% !important}

.winBox{ overflow:hidden;clear:both; margin:20px auto;}
    .winBox h4{ border-bottom:#900 solid 2px; overflow:hidden; }
    .winBox h4 span{ display:block; background:#900; float:left; padding:0 10px 0 10px; color:#FFF; line-height:30px;}

.guessBox{ overflow:hidden;clear:both; margin:20px auto;border:#ececec solid 1px ;border-top:#ddd3be solid 2px; background-color: #fff;}
    .guessBox ul{overflow:hidden; padding:20px;}
    .guessBox ul h4{ overflow:hidden; background: url(/images/cloud.png) no-repeat left;background-size:50px; text-indent:4rem;}
    .guessBox ul h4 span{ display:block;  float:left; color:#900; line-height:45px;}
    .guessBox ul li{ width:20%; float:left; line-height:30px; list-style: none;}
    .guessBox ul li a{ color:#666; font-size:12px; text-decoration:none;}

    .imgList{padding: 20px;}
    .imgList h2{line-height: 45px;border-bottom: #eee solid 2px;margin: 15px 0 20px 0;}
    .imgList .row>div>a{box-shadow:0 0 16px #efefef; background-color: #fff;border:#eee solid 1px;text-align:center; margin-bottom:30px;}
    .imgList .row>div>a{ display:block;position:relative;color:#222; }
    .imgList .row>div>a>i{display:block;margin:0 auto;width:100%;overflow:hidden; }
    .imgList .row>div>a>i>img{height:auto; aspect-ratio:4 / 3; width:100%;transform:scale(1); transition:ease-out all .3s;object-fit: cover;}
    .imgList .row>div>a:hover>i>img{ transform:scale(1.2); transition:ease-out all .3s}
    .imgList .row>div>a>p{line-height:60px;color:#666;display:block;height:60px;background-color: #fff;left:0;right:0;bottom:-25px;padding:5px}
    


.myBox{border:#ececec solid 1px ; overflow:hidden; margin-bottom:20px;background-color:#Fff; box-shadow: rgba(0,0,0,0.1) 0 0 8px;border-radius: 10px;}
    .myBox ul{ padding:10px;}
    .myBox ul h4{ line-height:45px;font-size:0.9rem;color:#604008; background: url(/images/cloud.png) no-repeat left;background-size:50px; text-indent:4rem; border-bottom:#ececec solid 1px;}
    .myBox ul li{ line-height:35px;font-size:0.8rem}
	 .myBox ul li a{ font-size:0.8rem}

.topShow{list-style-type:decimal;}
    /*.topShow{list-style-type:upper-latin;}*/
    .topShow li{margin-left:20px;}
    .topShow span{color:#ccc;font-size:12px;}

.picList li{ width:50%;float:left;list-style:none;}
    .picList li a{ padding:5px; font-size:12px; display:block;}
    .picList li a img{ width:100%;height:auto; aspect-ratio:1 / 1; clear:both}

.showBigImg{position:fixed; top:0;left:0; bottom:0; right:0; background: rgba(0,0,0,.8);}
.showBigImg img{ display:flex;justify-content: center; align-items: center; padding-top: 5%;}

.fixedDiv{position:fixed;right:100px;bottom:20%;width:160px; z-index:10;background-color: #efefef; padding:10px;border:#CCC solid 1px;}
.fixedDiv img{width:100%;}

.bidDiv{ position:fixed;right:0;left:0; margin:auto;top:30vh;background-color: rgb(37,152,4,.8);color:#fff; margin:auto;height:360px;width:320px;z-index:2023;padding:10px;box-shadow:rgba(0,0,0,0.3) 0 0 15px; border-radius:5px; display:none;}
.bidDiv form{ display:block; padding:20px;}
.bidDiv form h4{ line-height:55px; font-size:16px;}
.bidDiv .closeDiv{ float:right; margin-right:10px 10px 0 0; display:inline-block; height:40px;width:40px; font-size:18px; cursor:pointer;}


 /*=====================================================*/

  .userList{
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 默认三列 */
    gap: 15px;
    padding: 15px;
  }

  .userCard {
    display: flex;
    flex-direction: row;   /* PC 默认左右排列 */
    align-items: center;
    gap: 12px;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 10px;
    transition:ease-in-out all .3s
  }
  .userCard:hover{background-color:#efefef; transition:ease-in-out all .3s}

  .userCard img {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    object-fit: cover;
  }

  .user_info {
    display: flex;
    flex-direction: column;
  }

  .user_info p:first-child {
    font-weight: bold;
    margin-bottom: 4px;
  }

  .user_info p:last-child{
    font-size: 14px;
    color: #666;
  }

  /* 手机端：改为纵向（头像在上，文字在下） */
  @media (max-width: 768px) {
    .userList {
      grid-template-columns: repeat(2, 1fr);
    }

    .userCard {
      flex-direction: column;
      text-align: center;
    }
  }

  /*=====================================================*/


.vipList img{border-radius:5px;}
.vipList h3{ font-size:1.55rem}
    .charsetInfo{ margin:30px auto; text-align:center }
    .charsetInfo span{ display:inline-block;  line-height:30px; background:#f5f5f5; border:#dedede solid 1px; margin:5px;padding:0 10px 0 10px;cursor:pointer}



.mobileDiv{padding:5px 0 0 10px; position:fixed; left:0; right:0; height:50px; bottom:0; background: linear-gradient(354deg, #c7b294, #fffffd);box-shadow:rgba(0,0,0,.3) 0 3px 5px; display:none; z-index:100; text-align:center; line-height: 20px; border-top:#d3d3d3 solid 1px; }
.mobileDiv a{ width:22%; display:inline-block;color:#482020;text-decoration: none; font-size:12px;}
.mobileDiv a:hover{ color: #c00;}
.mobileDiv a span{ display: block;font-size: 22px;}


.floatDiv{position:fixed; bottom:20%; right:20px; display:none;width:20px; font-size:0.8rem;height:100px;}
  .floatDiv a{text-decoration:none; margin-bottom:20px;}
  .floatDiv span{height:35px; width:35px; display:block; color:#c00;border-radius:15px;}
  .floatDiv  span.iconfont{font-size:30px;}
.miniIcon{position: relative}
.miniIcon:before{content:"微信小程序"; position:absolute;color:#FFFFFF; right:20px; top:10px; z-index:2024; width:80px; border-radius:10px; background-color:rgba(7,142,18,0.7); text-align:center}

@media all and (min-width: 2100px){
	 html{font-size:20px;}
	 a{font-size:0.8rem}
	 .container{max-width:1580px !important;}
	 .mainMenu a{font-size:0.8rem}	
	 .space p{ font-size:0.7rem}
	 
	}
	
@media all and (max-width: 980px){
	html{font-size:14px;}
    body{padding-top: 75px !important;}
   .header {background-color: #ffffff;box-shadow: rgba(204,204,204,0.9) 0 0 15px;position: fixed;top: 0;z-index: 10;left: 0;right: 0;height:75px;}
   .top{height:40px;background: linear-gradient(to left,#f74343 0,#FBAA58 100%);}
    .header .wb{ padding-top:0px; padding-bottom: 0px;}
    .mainMenu{margin-top:5px; position:absolute;z-index:100;right:10px;top:0px;background-color:transparent;background-image:none;}
    .logo img{max-height:40px;}
    .navMenu{ display:block;cursor:pointer; }
	.notice{ display:none;}
    #search{margin-bottom:10px; padding:30px; display:none; position:fixed; background: rgba(0,0,0,0.7); top:50px; left:0; right:0; bottom:0} 
	#search .input-group{ margin-top:50%; height:45px;}

  .memList{ justify-content:flex-end !important}
  
	.picBox div p a{font-size:12px;line-height:1.5rem;}
	.myBox ul h4{font-size:6vw;}
	.guessBox ul li{ width:50%;}
	.bidDiv .qrCode{width:100%;}
	

 .navBtn {display:block;width:24px;height:16px;right:10px;top:25px;position:fixed;cursor:pointer;z-index:1001}
	.navBtn.active{ margin-right:10px;}
    .navBtn.active span{background: #888; }
    .navBtn.active .line2 {display:none;}
    .navBtn.active .line1 {transform:rotate(45deg);top:7px;}
    .navBtn.active .line3 {transform:rotate(-45deg);bottom:7px;}
    .navBtn span {position:absolute;left:0;width:24px;height:2px;background:#369; -webkit-transition:all 0.3s ease; transition:all 0.3s ease;}
    .navBtn span.line1 {top:0;}
    .navBtn span.line2 {top:7px;}
    .navBtn span.line3 {bottom:0;}
    
  .uBtn{display:block;left:30px;}
  .uBtn.active{display:block;left:170px;}
	
    .navMenu{ display:none; position:fixed; top:0;transition:all 0.5s ease; width:100%; padding-top:80px; right:-100%;left:0; bottom:0;background: rgba(0,0,0,.9); z-index:30; text-align:center;}
    .navMenu a{ display:block;width:100%;color:#fff;font-size:16px;}
    .navMenu.active{ right:0;display: block;margin-top: 0px;}
    .imgList{padding:0px;}
	.imgList .row>div>a>p{font-size:0.8rem; line-height:30px;height:30px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
	
	.floatDiv{ display:block}
	.mobileDiv{ display:block}
	.hidden-sx{display:none;}

    .pageList {text-align:center}
    .pageList div{ display:none}
	
	.space a{ margin-top:5px;}
}


.footer{background-color: #181524;color:#fff;min-height:200px; font-size:12px;padding:30px 0 30px 0}
.footer a{color:#cc0}


