@charset "utf-8"; 
/* CSS Starry */
section, div, ul, li, p{
   display: block; 
   margin: 0; 
   padding: 0; 
   border: 0; 
   font: inherit; 
   font-size: 100%; 
   vertical-align: baseline; 
   }
@font-face {
   font-family: "iconfont"; 
   
   src: url('/Template/ztuc_wap/static/ttf/iconfont.eot'); 
   /* IE9*/
   src: url('/Template/ztuc_wap/static/ttf/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('/Template/ztuc_wap/static/ttf/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
   url('/Template/ztuc_wap/static/ttf/iconfont.svg#iconfont') format('svg'); 
   /* iOS 4.1- */

   }
@font-face {
   font-family: "kelink"; 
   
   src: url('/Template/ztuc_wap/static/ttf/dtlnobelt-webfont.eot'); 
   /* IE9*/
   src: url('/Template/ztuc_wap/static/ttf/dtlnobelt-webfont?#iefix') format('embedded-opentype'), /* IE6-IE8 */
   url('/Template/ztuc_wap/static/ttf/dtlnobelt-webfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
   url('/Template/ztuc_wap/static/ttf/dtlnobelt-webfont.svg#iconfont') format('svg'); 
   /* iOS 4.1- */

   }
/* 图标调用 */
.iconfont {
   font-family:"iconfont" !important; 
   font-size:16px; 
   font-style:normal; 
   -webkit-font-smoothing: antialiased; 
   -webkit-text-stroke-width: 0.2px; 
   -moz-osx-font-smoothing: grayscale; 
   }
.kelink {
   font-family:"kelink" !important; 
   font-size:16px; 
   font-style:normal; 
   -webkit-font-smoothing: antialiased; 
   -webkit-text-stroke-width: 0.2px; 
   -moz-osx-font-smoothing: grayscale; 
   }
.top-cbl-ico {
   display: block; 
     font-size: 25px; 
     text-align: center; 
     height: 30px; 
     line-height: 30px; 
     margin-top: 7px; 
     color: #fff; 
   }
.cbl-cd-ico {
   width: 30px; 
     height: 30px; 
     font-size: 15px; 
     color: #fff; 
     border-radius: 50px; 
     padding: 7px; 
     margin: 0 10px; 
     text-align: center; 
     line-height: 20px; 
   }
.cbl-logins-ico {
   font-size:30px; 
   text-align: center; 
   line-height: 50px; 
   color: #fff; 
   border-radius: 50px; 
   height: 50px; 
   width: 50px; 
   display: block; 
   }
.cbl-logins-qq-ico {
   height: 20px; 
   width: 20px; 
   font-size:20px; 
   color:#fff; 
   margin-right:5px; 
   }
.view_list-ico {
   height: 15px; 
   width: 15px; 
   font-size:15px; 
   margin-right:2px; 
   }
.more-ico {
   height:17px; 
   width:17px; 
   font-size:18px; 
   margin-left:2px; 
   }

/* 其他通用 */
.arc_title {
   overflow:hidden; 
   background:#47b751; 
   padding:10px 15px; 
   color:#fff; 
   }
.arc_title a {
   color:#fff; 
   margin-right:8px; 
   }
.h45 {
   height:45px; 
   width:100%; 
   }
.bdsharebuttonbox {
   float: left; 
     margin-top: 5px; 
     width: 170px; 
   }
.menu_more_black {
    height: 40px;
    border-radius: 6px; /* 增大圆角更柔和 */
    clear: both;
    display: flex; /* 改用Flex布局更灵活 */
    align-items: center;
    justify-content: center;
    padding: 0; /* 移除内边距，改用子元素控制间距 */
    margin: 15px 0; /* 增加外边距避免拥挤 */
    background: #fff; /* 添加背景色提升层次 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); /* 微妙阴影增强立体感 */
    transition: all 0.3s ease; /* 添加平滑过渡 */
}

.menu_more_black a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px; /* 稍大字号更清晰 */
    font-weight: 500; /* 中等字重 */
    line-height: 1.5;
    text-align: center;
    background: linear-gradient(135deg, #ff7777, #ff6699, #ff7e5f);
    border-radius: 6px; /* 与父容器一致 */
    width: 100%;
    height: 100%;
    padding: 8px 12px; /* 内边距优化点击区域 */
    border: none; /* 移除虚线边框 */
    box-shadow: 0 2px 8px rgba(255, 102, 153, 0.3); /* 渐变色的光晕效果 */
    transition: all 0.3s ease;
}

.menu_more_black a:hover {
    background: linear-gradient(135deg, #ff5e5e, #ff4d88, #ff6b47); /* 渐变加深 */
    box-shadow: 0 4px 12px rgba(255, 102, 153, 0.5); /* 悬停时阴影增强 */
    transform: translateY(-2px); /* 轻微上浮交互 */
}

.menu_more_black a:active {
    transform: translateY(0); /* 点击时恢复位置 */
    box-shadow: 0 1px 4px rgba(255, 102, 153, 0.6); /* 点击时阴影收紧 */
}

.menu_more_black .iconfont {
    margin-left: 6px; /* 图标间距优化 */
    font-size: 12px;
    transition: transform 0.3s ease;
}

.menu_more_black a:hover .iconfont {
    transform: translateX(2px); /* 悬停时图标微移 */
}
.title-bt {
   white-space: nowrap; 
     display: inline-block; 
     font-size: 15px; 
     color: #333; 
     margin: 3px 0 2px 7px; 
     padding-bottom: 7px; 
     float: left; 
     height: 30px; 
     width: 100%; 
   }
.title-bt:before {
   content: ""; 
     display: block; 
     width: 3px; 
     height: 15px; 
     float: left; 
     background: #ff6633; 
     margin: 8px 7px 0 0; 
   }
.f0 {
   height:0px; 
   width:0px; 
   font-size:0px; 
   overflow:hidden; 
   }
.waplogin .btn {
   height:45px; 
   width:100%; 
   border: 1px #999 solid; 
   border-radius:3px; 
   background-image: -moz-linear-gradient(#4eb23a,#359921); 
     background-image: -webkit-linear-gradient(#4eb23a,#359921); 
     background-image: linear-gradient(#4eb23a,#359921); 
     filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF4EB23A', endColorstr='#FF359921'); 
     -moz-box-shadow: inset 0 1px 0 #72c261; 
     -webkit-box-shadow: inset 0 1px 0 #72c261; 
     box-shadow: inset 0 1px 0 #72c261; 
     text-shadow: 0 1px 0 rgba(0,0,0,0.2); 
     background-color: #4eb23a; 
     border-color: #2c8e00; 
     color: #fff; 
   font-size:14px; 
   border-radius:50px; 
   }
.wapreg .btn {
   height:45px; 
   width:100%; 
   border: 1px #999 solid; 
      background-image: linear-gradient(#51aff7,#328ED7); 
      background-color: #4DABF3; 
     border-color: #46A3EB; 
     color: #fff; 
   font-size:14px; 
   border-radius:50px; 
   }
.wapreg .txt,.waplogin .txt {
   background-color: #fcfcfc; 
     border: 1px solid #cccccc; 
     height: 36px; 
     width: 100%; 
     text-indent: 8px; 
     vertical-align: middle; 
     color: #444; 
     border-radius: 3px; 
     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); 
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); 
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); 
   }
.wapreg .txt:focus,.waplogin .txt:focus {
   border-radius: 5px; 
     outline: -webkit-focus-ring-color auto 0; 
     moz-box-shadow: 0 0 3px rgba(59,170,36,0.6),0 1px 3px rgba(0,0,0,0.05) inset; 
     -webkit-box-shadow: 0 0 3px rgba(59,170,36,0.6),0 1px 3px rgba(0,0,0,0.05) inset; 
     box-shadow: 0 0 3px rgba(59,170,36,0.6),0 1px 3px rgba(0,0,0,0.05) inset; 
     border-color: #3baa24; 
     outline: 0; 
   }
.wapreg .txt:hover,.waplogin .txt:hover {
   border-color: rgba(59,170,36,0.5); 
   }
.myfile .list {
   background:#fff; 
   border-bottom: 1px #f0f0f0 solid; 
      height: 30px; 
   }

/* pits */
#index-tip {
   position:fixed; 
   top:0; 
   bottom:0; 
   left:0; 
   right:-1px; 
   background:url(/Template/ztuc_wap/static/img/tips.png) no-repeat left -30px rgba(0,0,0,0.80); 
   z-index:999; 
   margin-top:44px; 
   }


/******轮播*****/

/* 新闻列表 */
.bg_orange {
   border-radius:2px 2px 0 0; 
     background-color: #ff6633; 
   }
.bg_grass {
   border-radius:2px 2px 0 0; 
     background-color: #53b856; 
   }
.main_news {
   background: #e7e8eb url(/Template/default/img/bg.jpg); 
   
   box-shadow: 0 2px 3px #dcdcdc; 
     margin-bottom: 5px; 
   margin-top:-3px; 
   overflow: hidden; 
   }
.main_news dl {
   position: relative; 
     height:55px; 
   margin: 0 8px 0px; 
   padding: 0 0 2px; 
     border-bottom: #F5F5F5 1px solid; 
   }
.main_news dl:last-child {
   border: none; 
   }
.main_news dl a {
   display: block; 
   }
.main_news dl dt {
   float: left; 
   width: 50px; 
   height: 100%; 
   overflow: hidden; 
   margin-right: 10px; 
   text-align: center; 
   }
.main_news dl dt a {
   width: 100%; 
   height: 100%; 
   color: #fff; 
   }
.main_news dl dt .types, .main_news dl dt .date {
   display: block; 
   width: 100%; 
   height: 20px; 
   margin: 7px 0 0; 
   font: 12px/20px "Microsoft YaHei"; 
   color: #fff; 
   }
.main_news dl dt .date {
   border-radius:0 0 2px 2px; 
   height: 20px; 
   background: #f1f1f1; 
   margin: 0 0 0; 
   font: 12px/20px "Microsoft YaHei"; 
   color: #666; 
   }
.main_news dl dt .num {
   position: relative; 
   display: block; 
   width: 30px; 
   height: 40px; 
   margin: 7px auto 0; 
   background: #bbbec2; 
   text-align: center; 
   font: 18px/30px "Microsoft YaHei"; 
   color: #fff; 
   }
.main_news dl dt .num:after {
   position: absolute; 
   bottom: 0; 
   left: 0; 
   z-index: 2; 
   display: block; 
   content: ''; 
   height: 0px; 
   width: 0px; 
   border-style: solid; 
   border-width: 0 15px 10px 15px; 
   border-color: transparent transparent #fff transparent; 
   }
.main_news dl:nth-of-type(1) dt .num {
   background: #f15353; 
   }
.main_news dl:nth-of-type(2) dt .num {
   background: #ffb220; 
   }
.main_news dl:nth-of-type(3) dt .num {
   background: #56b1ea; 
   }
.main_news dl:nth-of-type(4) dt .num {
   background: #80d739; 
   }
.main_news dl:nth-of-type(5) dt .num {
   background: #8d85ee; 
   }
.main_news dl .title { 
   border: none; 
   display: block; 
   width: auto; 
   height: 31px; 
   line-height:31px; 
   overflow: hidden; 
   font: 16px/33px "Microsoft YaHei"; 
   color: #999; 
   overflow: hidden; 
   white-space: nowrap; 
   text-overflow: ellipsis; 
   }
.main_news dl .title a { color: #666; 
  border-bottom: 1px dashed #ccc; 
   }
.main_news dl .title a:hover { color: #FF1100; 
   width:70%; 
   }
.main_news dl .intro {
   display: block; 
   height: 22px; 
   overflow: hidden; 
   font: 12px/20px "Microsoft YaHei"; 
   color: #999; 
   }
.main_news dl dd .plun {
   float: right; 
   padding: 0 8px; 
   line-height: 22px; 
   color: #505; 
   margin-top:-30px; 
   }
.main_news dl dd .plun i {
   font-style: normal; 
   }

.view_list {
   padding: 15px 10px; 
     line-height: 1.35em; 
     border-bottom: 1px #f0f0f0 solid; 
     position: relative; 
   background:#fff; 
   }
.view_list {
   zoom: 1; 
   }
.view_list a {
   display: block; 
     width: 100%; 
     height: 100%; 
     zoom: 1; 
     overflow: hidden; 
   color:#333; 
   }
.view_list .newsimg {
   float: right; 
     margin-left: 10px; 
     width: 95px; 
     height: 70px; 
   overflow:hidden; 
   }
.view_list .newsimg img {
   width: 95px; 
     height: auto; 
   min-height:100%; 
   }
.view_list .text {
   word-break: break-all; 
     font-size: 14px; 
     line-height: 19px; 
   }
.view_list .text p:nth-child(1) {
   max-height: 55px; 
     font-size: 16px; 
     margin-bottom: 16px; 
     overflow-y: hidden; 
   }
.view_list .date {
   font-size: 12px; 
     color: #b5b5b5; 
     position: absolute; 
     bottom: 5px; 
     left: 10px; 
   }
.view_list .cmt {
   padding-left: 16px; 
     margin-left: 10px; 
   }

/*   社区个人名片   */
.shequbg {
   height: 200px; 
   width: 100%; 
   overflow: hidden; 
   z-index: 1; 
   position: inherit; 
   background-image: url(/Template/default/v11.2/xk_bg.jpg); 
   background-repeat: no-repeat; 
   background-size: 100% 100%; 
   }
.shequtx {
   height: 80px; 
   z-index: 3; 
   position: relative; 
   top: 120px; 
   width:100%; 
   background: rgba(46,46,46,0.3); 
   }
.shequtx li {
   width: 80px; 
   height: 80px; 
   border-radius: 50px; 
   overflow: hidden; 
   margin-left: 20px; 
   border: solid 3px #fff; 
   position: absolute; 
   top: -40px; 
   overflow: hidden; 
   }
.shequtx li img {
   width: 80px; 
   height: 80px; 
   border-radius: 50px; 
   }
.shequtx span {
   font-size: 18px; 
   color: #fff; 
   position: absolute; 
   top: 10px; 
   left: 120px; 
   font-weight:700; 
   }
.shequtx span a {
   color:#fff; 
   }
.shequtx p {
   font-size: 12px; 
   color:#dbdbdb; 
   line-height: 20px; 
   overflow: hidden; 
   height: 45px; 
   font-weight:100; 
   }
.shequhxcd {
   width: 100%; 
   height: 70px; 
   border-bottom: solid 1px #e4e4e4; 
   border-top: solid 1px #e4e4e4; 
   background: #FFF; 
   margin:5px 0; 
   }
.shequhxcd li {
   float: left; 
   width: 20%; 
   height: 70px; 
   text-align: center; 
   font-size: 15px; 
   color: #6c6c6c; 
   line-height: 30px; 
   padding-top: 5px; 
   }
.shequhxcd li a {
   color:#000; 
   font-size: 20px; 
   line-height: 10px; 
   }
/*   社区聊吧   */
.xks_bg {
   background:#fff; 
   border: 1px solid #dadada; 
   margin:10px; 
   overflow: hidden; 
   border-radius: 3px; 
   }
.xks_h3 {
   height:20px; 
   padding:8px 0; 
   color: #000; 
   border-bottom: 1px solid #dadada; 
   letter-spacing: 0px; 
   }
.xks_h3 li {
   border-left: 7px solid #21a33a; 
   height:20px; 
   line-height:20px; 
   padding-left:5px; 
   color:#21a33a; 
   font-weight:600; 
   float:left; 
   }
.xks_con {
   padding:5px; 
   color: #636363; 
   font-size:13px; 
   }
.xks_con y {
   border-top: 1px dashed #dadada; 
   height:3px; 
   margin-top:8px; 
   }
.xks_con a{
   color:#000; 
   font-size:14px; 
   }
.xks_zcdt {
   word-break: break-all; 
   padding: 5px; 
   margin: 5px; 
   border-radius: 2px; 
   transition: 0.2s; 
   line-height: 30px; 
   border: 1px solid #E7E7E7; 
   color: #636363; 
   font-size: 14px; 
   background:#fff; 
   text-align:right; 
   }
.xks_zcdt a{
   float:left; 
   color: #000; 
   text-shadow: rgba(50,50,50,.3) 1px 1px 3px; 
   font: bold 16px/1.3 "\5FAE\8F6F\96C5\9ED1", Arial; 
   font-size: 14px; 
   text-align:left; 
   }

/* 灵异故事顶部调用 */
.xk_topgg {
   padding-left:10px; 
   text-align:center; 
   }
.xk_topgg h2,.xk_topgg h3{
   font-size: 18px; 
   font-weight: normal; 
   white-space: nowrap; 
   margin-top:5px; 
   }
.xk_topgg h2 a,.xk_topgg h3 a {
   color: #d53830; 
   font-weight: normal; 
   }
.xk_topgg h2 a:hover,.xk_topgg h3 a:hover {
   color:#2b73df; 
   }
.xk_topgg h2::before {
   content: "校园"; 
   -webkit-border-radius: 1px; 
   color: white; 
   display: inline-block; 
   font-size: 10px; 
   height: 20px; 
   line-height: 20px; 
   width: 30px; 
   margin-right: 1px; 
   text-align: center; 
   vertical-align: 2px; 
   background-color: #de6761; 
   white-space: nowrap; 
   }
.xk_topgg h3::before {
   content: "热门"; 
   -webkit-border-radius: 1px; 
   color: white; 
   display: inline-block; 
   font-size: 10px; 
   height: 20px; 
   line-height: 20px; 
   width: 30px; 
   margin-right: 1px; 
   text-align: center; 
   vertical-align: 2px; 
   background-color: #e6b165; 
   white-space: nowrap; 
   }
.xk_topgg p a{
   margin-right: 20px; 
   color: #666; 
   font-size: 14px; 
   white-space: nowrap; 
   display: inline-block; 
   }
.xk_topgg p a:hover {
   color:#2b73df; 
   }

.header .menu-btn .Mail a {
   background: #fff; 
   color: #21a33a; 
   font-size: 13px; 
   border-radius: 25px; 
   -moz-border-radius: 25px; 
   -webkit-border-radius: 25px; 
   padding: 0 6px; 
   height: 25px; 
   line-height: 27px; 
   margin-right: 3px; 
   text-align: center; 
   margin-top: 9px; 
   }


/* 链接列表调用 */
.xk_list {
   overflow:hidden; 
      margin: 5px 0; 
   max-height: 120px; 
   }
.xk_list ul {
   margin: 0 5px; 
     display: -webkit-box; 
   }
.xk_list ul li {
   -webkit-box-flex: 1; 
     position: relative; 
   margin-right: 0px; 
     max-height: 120px; 
     overflow: hidden; 
     width: 100%; 
   }
.xk_list ul li:nth-child(2) {
   margin-right: 0px; 
     margin-left: 5px; 
   }
.xk_list ul li:nth-child(3) {
   margin-right: 0px; 
     margin-left: 5px; 
   }
.xk_list ul li:nth-child(4) {
   margin-right: 0px; 
     margin-left: 5px; 
   }
.xk_list ul li a {
   display: block; 
   height: 120px; 
   }
.xk_list ul li img {
   width: 100%; 
     height: auto; 
     min-height: 120px; 
   max-height: 120px; 
   }
.xk_list ul li p {
   overflow: hidden; 
     width: auto; 
     font-size: 12px; 
     color: #fff; 
     text-align: center; 
     position: absolute; 
     left: 0px; 
     right: 0px; 
     bottom: 0; 
     text-overflow: ellipsis; 
     background-color: rgba(0,0,0,0.5); 
     line-height: 25px; 
     white-space: nowrap; 
     transition: all 0.2s linear; 
     -webkit-transition: all 0.2s linear; 
     -moz-transition: all 0.2s linear; 
     -o-transition: all 0.2s linear; 
     padding: 0 3px; 
   }
.xk_list ul li p:hover {
   color: #222; 
     background-color: rgba(255,255,255,0.6); 
   }

.xk_new_list {
   background: #FCFCFC; 
     zoom: 1; 
   }
.xk_new_list ul {
   overflow:hidden; 
   }
.xk_new_list ul li{
   padding: 15px 5px; 
     line-height: 1.35em; 
     border-bottom: 1px #EAEAEA solid; 
     position: relative; 
     margin: 0 5px; 
   }
.xk_new_list ul li a {
   display: block; 
     width: 100%; 
     height: 100%; 
     zoom: 1; 
     overflow: hidden; 
     color: #333; 
   }
.xk_new_list ul li .newsimg {
   float: left; 
   margin-right: 10px; 
     width: 95px; 
     height: 70px; 
     overflow: hidden; 
   }
.xk_new_list ul li .newsimg img {
   width: 95px; 
     height: auto; 
     min-height: 100%; 
   }
.xk_new_list ul li .text {
   word-break: break-all; 
     font-size: 14px; 
     line-height: 19px; 
   }
.xk_new_list ul li .text p:nth-child(1) {
   max-height: 55px; 
     font-size: 15px; 
     margin-bottom: 5px; 
     overflow: hidden; 
     white-space: nowrap; 
     text-overflow: ellipsis; 
   color:#000; 
     text-indent: 0; 
   }
.xk_new_list ul li .text p {
   font-size:13px; 
   color:#8B8B8B; 
     text-indent: 2em; 
   }
.xk_new_list ul li .date {
   font-size: 12px; 
     color: #CACACA !important; 
     position: absolute; 
     bottom: 10px; 
     right: 10px; 
   }


/* 登录 */
.Waplogin-bg {
   background:#f0f0f0; 
   overflow:hidden; 
   width:100%; 
   }
.Waplogin-top {
   background:#fff; 
   box-shadow: 0 2px 3px #dcdcdc; 
   height:45px; 
   width:100%; 
   position:relative; 
   text-align:center; 
   line-height:45px; 
   color:#000; 
   font-size:15px; 
   margin-bottom:20px; 
   }
.Waplogin-top .back,.Waplogin-top .home {
   height:45px; 
   width:45px; 
   position:absolute; 
   left:0; 
   top:0; 
   text-align:center; 
   line-height:45px; 
     overflow: hidden; 
   }
.Waplogin-top .home {
   left:inherit; 
   right:0; 
   }
.Waplogin-top .back a,.Waplogin-top .home a {
   display:block; 
   color:#555; 
      font-weight: bolder; 
   }

dl.list {
   border-top: 1px solid #DDD8CE; 
     border-bottom: 1px solid #DDD8CE; 
     margin-top: .2rem; 
     margin-bottom: 0; 
     background-color: #fff; 
   }
dl.list-in {
   margin: 0; 
     border-top: 0; 
   }
dl.list:first-child {
   margin: 0; 
     border-top: 0; 
     padding: 0; 
   }
dl.list dt, dl.list dd {
   margin: 0; 
     border-bottom: 1px solid #DDD8CE; 
     overflow: hidden; 
     font-size: inherit; 
     font-weight: 400; 
     position: relative; 
   }
dl.list dt:last-child, dl.list dd:last-of-type {
   border-bottom: 0; 
   }
dl.list dd dl {
   margin: 0; 
     margin-bottom: -1px; 
     border: 0; 
   }
dl.list .dd-padding, dl.list dt, dl.list dd>.react {
   padding: 10px 10px; 
     overflow: hidden; 
   }
dl.list dd dl>.dd-padding, dl.list dd dl dd>.react, dl.list dd dl>dt {
   padding-left: 0; 
   }
input.input-weak, textarea.input-weak {
   border: 0; 
     height: 28px; 
     margin: -.15rem 0; 
     text-indent: .1rem; 
     line-height: 1; 
     font-size: 14px; 
     border-radius: 5px; 
     padding: 0; 
   }
dl.list dd>.input-weak {
   width: 100%; 
     display: block; 
      margin: 0 10px; 
     border-radius: 3px; 
   }
.btn-wrapper {
   margin: 15px; 
   margin-bottom:10px; 
   }
.btn-wrapper .btns {
   display: inline-block; 
     margin: 0; 
     text-align: center; 
     height: 45px; 
     color: #fff; 
     border: 0; 
     vertical-align: middle; 
     line-height: .6rem; 
     box-sizing: border-box; 
     cursor: pointer; 
     -webkit-user-select: none; 
     border-radius: 5px; 
     font-size: 15px; 
     background-image: linear-gradient(#4eb23a,#41A52D); 
   }
.btn-wrapper .btns:hover {
   background:#4eb23a; 
   }
.btn-block {
   display: block; 
     width: 100%; 
   }
.btn-larger {
   height: .94rem; 
     line-height: .94rem; 
     font-size: .4rem; 
   }
.subline {
   margin: 0 15px; 
   overflow:hidden; 
   }
.subline:after {
   clear: both; 
     display: table; 
     content: ""; 
   }
.subline li {
   float:left; 
   }
.subline li a {
   color: #4eb23a; 
     text-decoration: none; 
     outline: 0; 
   font-size:13px; 
   }
.pull-right {
   float: right !important; 
   }
input.input-weak:focus {
   background: #ececec; 
     outline: 0; 
   }
.sanfangdl {
   height:40px; 
   text-align:center; 
   position:relative; 
   text-align:center; 
   z-index:99; 
   overflow: hidden; 
   margin-top: 95px; 
   }
.sanfangdl p {
   background:#f0f0f0; 
   padding:0 10px; 
   display: block; 
   width: 130px; 
   margin: 0 auto; 
   position: inherit; 
   z-index: 99; 
   height: 40px; 
   line-height: 40px; 
   color: #8c8c8c; 
   font-size: 13px; 
   }
.sanfangdl:after {
   content: ""; 
   position:absolute; 
   top:19px; 
   left: 15px; 
   right: 15px; 
   z-index:88; 
   border-bottom: 1px solid #D3D3D3; 
   }
.sanfang-Waplogin {
   overflow:hidden; 
      display: -webkit-box; 
   margin:15px 20px; 
   }
.sanfang-Waplogin li {
   -webkit-box-flex: 1; 
   width:100%; 
   }
.sanfang-Waplogin li a {
   display:block; 
   height:60px; 
   }
.sanfang-Waplogin .qqdl {
   background:url(/Template/ztuc_wap/static/img/dl-qq.png) no-repeat center center; 
   background-size:60px; 
   }
.sanfang-Waplogin .wxdl {
   background:url(/Template/ztuc_wap/static/img/dl-wx.png) no-repeat center center; 
   background-size:60px; 
   }
.dltips-sb {
   background: url(/Template/ztuc_wap/static/img/dlts-shibai.gif) no-repeat center 20px #FFFFFF; 
   padding: 150px 15px 20px; 
   color: #FF8954; 
   text-align: center; 
   font-size: 13px; 
   }
.dltips-cg {
   background: url(/Template/ztuc_wap/static/img/dlts-chenggong.gif) no-repeat center 20px #FFFFFF; 
   padding: 150px 15px 20px; 
   color: #4EB23A; 
   text-align: center; 
   font-size: 13px; 
   }
.tiaozhuan {
   margin:15px; 
   height:45px; 
   }
.tiaozhuan a {
   display:block; 
   text-align:center; 
   line-height:45px; 
   color:#fff; 
   font-size:15px; 
   background:#FF773A; 
   border-radius:5px; 
   }
.tiaozhuan a:hover {
   color:#fff; 
   }

div {
   width:99%px; 
   padding: 0px; 
   text-align:left; 
   border-radius:0px 0px 5px 5px; 
   }

.list12 li a .cont {
   position: relative; 
   height: auto; 
   }
.list12 li a .cont img {
   -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); 
   -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.1); 
   box-shadow: 0 1px 3px rgba(0,0,0,0.1); 
   border-radius: 5px; 
   border: 1px dashed #507bbf; 
   padding: 0px; 
   width: 110px; 
   height: 80px; 
   }

img {
   border-radius:5px; 
   }

   }

.titleMk{
   overflow:hidden; 
   border-bottom:1px solid #28a302; 
   padding-left:10px; 
   background: #fff; 
   height: 40px; 
   border-top: 1px solid #F4F4F4; 
   }
.titleMkImg{
   position: relative; 
   margin-bottom:-1px; 
   }
.titleMkImg img{
   float:left; 
   height:33px; 
   margin-top: 7px; 
   }
.titleMkImg .titleMkspan{
   position:absolute; 
   top: 10px; 
   left: 14px; 
   font-size:18px; 
   color:#fff; 
   }
.titleMkImgRight{
   float:right; 
   margin:10px 10px 0 0; 
   }
.titleMkImgRight img{
   margin-right:3px; 
   vertical-align:middle
   }
.fxz02 {
   background: #fffbe3; 
   border: 1px solid #ede4b2; 
   border-radius: 3px; 
   margin: 10px 10px 15px 10px; 
   font-size: 14px; 
   padding:5px 10px; 
   line-height: 24px; 
   color: #CD8D17; 
   }


.sysad{
   margin:3px 0; 
   padding:5px; 
   background:url(/Template/default/img/bg.jpg)#eaeaea; 
   line-height:30px; 
   border-bottom: 1px solid #507bbf; 
   text-align:center; 
   }

.content input {
   border: none;border-style:none; 
   border-bottom: 1px solid #507;
   padding: 5px; 
   background: #fff; 
   border-radius: 5px; 
   color: #333; 
   font-size: 14px; 
   }
   
.topre textarea {
   background: #fff; 
   color:#000; 
   border-radius: 5px; 
   border: 1px solid #507BBF; 
   }

.topre input {
   border: 1px solid #507bbf; 
   padding: 5px; 
   background: #fff; 
   border-radius: 5px; 
   color: #333; 
   font-size: 14px; 
   }
/* 导航立体CSS - 优化自适应版本 */


/* 图标导航样式 */
.xk_nav { 
  width: 100%; 
  padding: 5px 0;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: stretch; /* 确保子元素撑开容器高度 */
  height: auto !important; /* 确保容器高度由内容决定 */
  min-height: 100px; /* 设置最小高度，防止内容过少时容器过窄 */
  border-style: solid; 
  border-color: rgba(204,204,204,50%);
  border-width: 0 0 1px 0;
  margin:0 auto;
}

.xk_nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 20%;
  color: #636363;
  font-size: 13px;
  text-decoration: none;
  padding: 10px 5px; /* 增加上下内边距，确保文本有足够空间 */
  box-sizing: border-box;
  min-height: 80px; /* 设置每个项目的最小高度 */
}

.xk_nav a:hover { 
  color: #FF6E00; 
}

.xk_nav img { 
  width: 45px; 
  height: 45px; 
  border-radius: 10px;
  margin-bottom: 8px; /* 增加图片和文本之间的间距 */
  object-fit: cover;
}
/* 文字导航按钮样式（保持不变） */
/* 文字导航容器样式 */
.navbar {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 10px; /* 统一设置元素间间距 */
  padding: 10px;
}

/* 文字导航按钮样式 */
.navbar a{
  background: #e7e8eb url(/Template/default/img/bg.jpg); 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: rgba(51, 51, 51, 0.63);
  padding: 8px 12px;
  text-align: center;
  box-sizing: border-box;
  text-decoration: none;
  border-radius: 10px;
  border-width: 1px 1px 5px 1px;
  border-style: solid;
  border-color: #ffffff #ffffff #d7d7d7 #ffffff;
  transition: all 0.3s ease;
  min-width: 100px;
  background: #f1f1f1;  
  box-shadow: 0px 3px #999; /* 添加底部阴影 */
}


.navbar a:hover {
  color: rgba(63, 63, 63, 0.5);
  border-style: solid;
  border-color: #D7D7D7 #ffffff #ffffff #ffffff;
  border-width: 5px 1px 1px 1px;
  background-color: #f1f1f1;
  transform: translateY(-2px);  
  box-shadow: 0 -3px #999;
  /* 垂直偏移-5px，模糊15px，适合卡片悬浮感 */
}


/* 生活服务列表 */
.xk_shrq {
   height: 20px; 
   line-height: 20px; 
   color: #FF5154; 
   border-left: solid 5px #FF5154; 
   margin-top:2px; 
   margin-bottom:8px; 
   padding-left: 5px; 
   font-size:13px; 
   background:#fff; 
   }
.xk_shline {
   background:#fff; 
   width:100%; 
   padding-top:5px; 
   height:230px; 
   }
.xk_shline a {
   float:left; 
   width:20%; 
   color:#000; 
   line-height:20px; 
   font-size:15px; 
   text-align:center; 
   margin-bottom:10px; 
   }
.xk_shline a:hover {
   color:#2b73df; 
   }
.xk_shline img {
   width: 45px; 
   height: 45px; 
   text-align: center; 
   -moz-border-radius: 5px; 
   -webkit-border-radius: 5px; 
   border-radius:5px; 
   }
.xk_shline li {
   height:40px; 
   line-height:40px; 
   }
.xk_shline li a {
   float:left; 
   width:25%; 
   height:40px; 
   line-height:40px; 
   text-align:center; 
   color:#000; 
   font-size:15px; 
   margin-bottom: 0px; 
   }
.xk_cxbg {
   width:100%; 
   background:#fff; 
   margin:5px 0; 
   border-bottom: 1px solid #dadada; 
   border-top: 1px solid #dadada; 
   overflow: hidden; 
   }
.xk_cxline {
   padding: 10px 0; 
   border-bottom: 1px dashed #dadada; 
   margin:0 15px; 
   height:70px; 
   }
.xk_cxline a {
   float:left; 
   width:20%; 
   line-height:20px; 
   text-align:center; 
   color:#000; 
   }
.xk_cxline img {
   width:45px; 
   height:45px; 
   -moz-border-radius: 45px; 
   -webkit-border-radius: 45px; 
   border-radius:45px; 
   text-align: center; 
   }
.dh_h4 {
   height: 20px; 
   padding: 10px 0; 
   color: #000; 
   border-bottom: 1px solid #dadada; 
   letter-spacing: 0px; 
   background:#fff; 
   }
.dh_h4 p {
   border-left: 7px solid #ff7c00; 
   height: 20px; 
   line-height: 20px; 
   padding-left: 5px; 
   color: #ff7c00; 
   font-weight: 600; 
   }
.dh_h4 li {
   border-left: 7px solid #ff7c00; 
   height: 20px; 
   line-height: 20px; 
   padding-left: 5px; 
   color: #ff7c00; 
   font-weight: 600; 
   }
.dh_fl {
   padding: 15px 0 0; 
   overflow: hidden; 
   }
.dh_fl_5 a {
   width:20%; 
   }
.dh_fl a {
   display: block; 
   height: 16px; 
   line-height: 16px; 
   box-sizing: border-box; 
   -webkit-box-sizing: border-box; 
   overflow: hidden; 
   float: left; 
   border-right: 1px solid #dadada; 
   text-align: center; 
   margin-bottom: 20px; 
   color:#000; 
   }
.cx_lbbg {
   background-color: #fff; 
   padding: 5px; 
   margin: 5px; 
   border-radius: 4px; 
   border: 1px solid #E7E7E7; 
   color:#636363; 
   }
.cx_lbbg a {
   color:#222; 
   }
.cx_lb {
   height:35px; 
   }
.cx_lb img {
   max-height:18px; 
   max-width:18px; 
   vertical-align:middle
   }
.cx_lb a {
   float:left; 
   width:33.3%; 
   height:35px; 
   left:35px; 
   text-align:center; 
   color:#000; 
   }
.zixtt {
   line-height: 28px; 
   overflow: hidden; 
   color:#000; 
   font-family:"Microsoft YaHei"; 
   font-size:15px; 
   text-align:center; 
   padding-top:10px; 
   }
.zixtt a {
   position: relative; 
   color:#000; 
   }
.zixtt a:before {
   content: ""; 
   bottom: -10px; 
   
   position: absolute; 
   left: -500000px; 
   right: -50000px; 
   }
.zixtt a:nth-of-type(odd) {
   color:#df3031; 
   font-weight: bold; 
   margin: 0px 2px; 
   font-size:18px; 
   font-weight:600; 
   }

.pyq_nav { height: 40px; width: 100%; background: #fff; border-bottom: 1px solid #ebebeb; }
.pyq_nav a { float: left; width: 16.6%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #000; text-align: center; line-height: 40px; }
.pyq_nav a:hover { background: #F7F7F7; }
.pyq_nav .yes a { color: #B23737; border-bottom: 3px solid #B23737; height: 38px; }

.pyq_img ul { max-width: 300px; background: #fff; overflow: hidden; }
.pyq_img ul li { float: left; width: 33.3%; height: 100px; overflow: hidden; border: 2px solid #FFFFFF; box-sizing: border-box; }
.pyq_img img { width: 100%; height: auto; min-height: 100px; }
.pyqline .line4, .pyqline .line5 { margin: 5px; border: 1px solid #EBEBEB; }
.pyq_url a { height: 50px; background: #F1F1F1; color: #222; line-height: 50px; font-size: 14px; margin: 5px 0; overflow: hidden; text-overflow: ellipsis; padding-right: 5px; display: block; }
.pyq_url img { width: 50px; height: 50px; float: left; margin-right: 10px; }
.shop_view_nav { height: 50px; width: 100%; background: #fff; border-bottom: 1px solid #ebebeb; }
.shop_view_nav a { color: #000; text-align: center; line-height: 50px; padding: 0 5px;display:block; font-size:15px;}
.shop_view_nav .yes  { color: #c40000; border-top: 3px solid #c40000; height: 49px;  line-height: 47px; background:url(/NetImages/shop_nav.png) no-repeat top center; background-size:9px 4px;}
.shop_ul {width: 100%; border-bottom: 1px solid #ebebeb;}
.shop_ul a { position:relative;}
.shop_ul li { float: left; text-align: center; list-style: none; line-height: 50px; width:25%;  font-size: 15px;  font-weight: bold;}
.shop_ul a:nth-child(1)::after, .shop_ul a:nth-child(2)::after, .shop_ul a:nth-child(3)::after {  content: "";  display: block;  width: 1px;  height: 28px;  background: #dadada;  position: absolute;  right: -1px;  top: 11px;}

.itemsvip-container {  
    max-width: 720px; 
    padding: 20px;   
    border: 1px solid #ccc;   
    border-radius: 5px;   
    background-color: #f9f9f9;  
    margin: 0 auto;  
}  /* 每一项信息的样式 */ 
.itemsvip { 
    margin-bottom: 10px;   
    padding-bottom: 10px;   
    border-bottom: 1px dashed #ccc;  
} /* 移除最后一个元素的底部间距、内边距和边框 */ 
.itemsvip:last-child {  
    margin-bottom: 0; 
    padding-bottom: 0;   
    border-bottom: none;  
} 
.itemsvip strong { 
    display: inline-block; 
    width: 100px;  color: #333;  
}  
.itemsvip span {  
    color: #666; 
} /* 序号样式 */  
.itemsvip-number { 
    display: inline-block;  
    width: 20px;   
    margin-right: 10px; 
    color: #999;  
} 
 { 
    margin-bottom: 10px;   
    padding: 10px;   
    border-bottom: 1px dashed #ddd;   
    border-left: 2px solid #ff6699; 
    background-color: #f1f1f1; 
}
.itemsvip-left { 
    margin-bottom:10px;
    padding:10px;
    line-height:1.8;
    border-left:5px solid #16b777;
    border-radius:0 2px 2px 0;
    background-color:rgba(221,221,221,10%);
   }
.classitem-number { display: inline-block;  width: 20px;   margin-right: 10px; color: #999;  }
.block-button {
    padding: 5px 15px;
    margin-left: 10px;
    background-color: #ff5722;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* 按钮悬停效果 */

.block-button:hover {
    background-color: #0056b3;
}
.ui {
   margin-left: auto;
   margin-right: 100px;
   display: flex; 
   width: 100%;   
   list-style: none; 
   padding: 0;  
   margin: 0; 
} 
.ui li { 
   flex: 1 1 50%;  
   box-sizing: border-box;
   padding: 10px;  
   text-align: left; 
   border: 1px 
}               


        
        .image-gallery-container {
            display: flex;
            gap: 20px; /* 设置合理的间距 */
            margin-bottom: 10px;
    flex-wrap: wrap;
        }
        
        .image-card {
            background: white;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            flex: 1;
            max-width: calc((100% - 20px) / 2); /* 基于容器宽度和间距的精确计算 */
            //width: 50%;
    box-sizing: border-box; /* 确保宽度包含内边距和边框 */
        }
        
        .image-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25);
        }
        
.image-wrapper {
    position: relative;
    height: 180px;
    overflow: hidden;
    /* 新增：确保高度包含padding和border */
    box-sizing: border-box; 
    /* 避免意外的内边距/边框影响高度 */
    padding: 0;
    border: none;
}
        
        .image-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        
        .image-card:hover .image-wrapper img {
            transform: scale(1.03);
        }
        
        .image-title {
            padding: 15px;
            text-align: center;
            background: #f8f9fa;
        }
        
        .image-title h3 {
            font-size: 1.3rem;
            color: #1a2a6c;
            margin-bottom: 8px;
        }
        
        .image-title p {
            color: #666;
            line-height: 1.5;
            font-size: 0.9rem;
        }
        

         .image-date::before {
         content: "ツ";
         margin-right: 4px;
         }

         .image-count::before {
         content: "ソ";
         margin-right: 4px;
         }
.image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    color: white;
    transform: translateY(100%);
    transition: transform 0.4s ease;
    opacity: 0.95;
    /* 可选：内容过多时允许纵向滚动 */
    overflow-y: auto; 
    /* 优化滚动条样式（可选） */
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.5) transparent;    
    padding: 10px; /* 减少上下内边距（原12px → 10px，减少4px） */
    max-height: calc(100% - 4px); /* 预留4px避免边缘溢出 */
}
        
        .image-card:hover .image-overlay {
            transform: translateY(0);
        }
        
/* 压缩标题高度 */
.image-overlay h4 {
    margin: 0 0 5px 0; /* 取消默认margin，仅保留底部5px间距 */
    font-size: 0.95rem; /* 缩小字体（原1.1rem → 0.95rem） */
    line-height: 1.2; /* 收紧行高（原默认1.5 → 1.2） */
}

.image-stats {
    display: flex;
    justify-content: space-around;
    font-size: 0.85rem; /* 缩小统计文字 */
    margin-top: 5px; /* 减少顶部间距（原8px → 5px） */
}

.image-stats-item {
    text-align: center;
    padding: 0 4px; /* 减少内边距 */
    font-size: 0.8rem; /* 缩小统计文字（原默认0.9rem → 0.8rem） */
    line-height: 1.2; /* 收紧行高 */
}
        
/* 移除多余空白（若有） */
.image-overlay * {
    margin: 0; /* 清除所有默认margin，避免意外高度 */
    padding: 0;
}
        /* 响应式设计 - 调整断点为699px */
        @media (max-width: 699px) {
            .image-gallery-container {
                flex-direction: column;
                align-items: center;
                gap: 20px;
            }
            
            .image-card {
                max-width: 100%;
                width: 100%;
            }
            
            h1 {
                font-size: 2rem;
            }
        }
        
        @media (max-width: 576px) {
            .image-wrapper {
                height: 220px;
            }
            
            .image-title h3 {
                font-size: 1.2rem;
            }
        }
        
        @media (max-width: 480px) {
            .image-wrapper {
                height: 200px;
            }
            
            .image-title {
                padding: 12px;
            }
        }


  /* 文章css样式 */      

.container-info {
  max-width: 720px;
  width: 100%;
}

.control-info {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 10px 0;
  flex-wrap: wrap;
}

.control-btn-info {
  background: #4a6fa5;
  color: white;
  border: none;
  padding: 12px 25px;
  border-radius: 50px;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 12px rgba(74, 111, 165, 0.25);
}

.control-btn-info:hover {
  background: #2c3e50;
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(74, 111, 165, 0.35);
}

.news-container-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
  gap: 20px;
  margin-bottom: 10px;
}

.news-item-info {
  background: white;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  border: 1px solid #eaeaea;
}

.news-item-info:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.15);
  background: #e7e8eb url(/Template/default.svg);
  background-repeat: no-repeat;
  /* 垂直居中（第二个值控制垂直方向，center 表示居中） */
  /* 第一个值控制水平方向，这里以水平居中为例 */
  background-position: center center;
  /* 可选：让背景图片自适应容器（保持比例，覆盖容器） */
  background-size: cover;
  transform: scale(1.05);
}

.image-container-info {
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  position: relative;
  overflow: hidden;
}

.image-container-info img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 手机端隐藏图片并移除占位 */
/* 仅在真·小屏幕设备上隐藏图片 */
@media (max-width: 768px) {
  .image-container-info {
    display: none !important; /* 隐藏图片容器并移除占位 */
  }
  
  /* 调整内容区布局 */
  .container-info-content-info {
    padding: 15px; /* 增加内容区边距 */
    height: auto; /* 内容区高度自适应 */
  }
}
.news-item-info:hover .image-container-info img {
}

.image-overlay-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,0.7));
  height: 40%;
  display: flex;
  align-items: flex-end;
  padding: 5px 10px;
  opacity: 0; /* 默认隐藏 */
  transition: opacity 0.3s ease; /* 添加过渡效果 */
}

.news-item-info:hover .image-overlay-info {
  opacity: 1; /* 鼠标悬停时显示 */
}

.image-overlay-info span {
  color: white;
  font-size: 0.75rem;
  font-weight: 500;
}

.container-info-content-info {
  padding: 3px 15px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100px;
  flex-grow: 1;
  overflow: hidden;
}

.title-info {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2c3e50;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: -5px;
  margin-bottom: 1px;
}

.title-info a { 
   line-height: 35px; 
   text-indent: 10px; 
   color: #666777; 
   border-bottom: solid 1px #F7F7F7; 
   font-size: 15px; 
   }
.title-info a:hover { 
   color: #f2b73d; border-left:3px solid #16b777;padding-left: 10px; 
   }
.controls-info {
  color: #5a6d80;
  font-size: 0.9rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
}

.meta-info {
  display: flex;
  justify-content: space-between;
  font-size: 0.82rem;
  color: #7a8a9c;
  margin-top: 1px;
}

.date-info, .views-info {
  display: flex;
  align-items: center;
  gap: 6px;
}
.date-info::before {

  content: "す";
  margin-right: 4px;
}
.views-info::before {
  content: "サ️";
  margin-right: 4px;
}

@media (max-width: 600px) {
  .news-container-info {
    grid-template-columns: 1fr;
    gap: 10px; /* 小屏幕时间距缩小 */
    margin-bottom: 0; /* 移除底部边距 */
  }
  
  .news-item-info {
    flex-direction: column;
  }
  
  .image-container-info {
    width: 100%;
    height: 100px;
  }
  
  .container-info-content-info {
    height: auto;
    padding: 15px;
  }
  
  .news-container-info {
    gap: 10px;
  }
}

@media (max-width: 500px) {
  .control-info {
    flex-direction: column;
    align-items: center;
  }
  
  .control-btn-info {
    width: 80%;
    justify-content: center;
  }
}