@charset "utf-8"; /*公共样式开始*/ /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 license: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* 加粗字体 */ h1, h2, h3, h4, h5, h6,strong,b{ font-weight: 700; } /* html5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { color: #333; line-height: 1; font-family: "microsoft yahei", arial, tahoma, helvetica, "simsun", "hiragino sans gb", sans-serif !important; } a{ text-decoration: none; color: #333; } ol, ul { list-style: none; } li{ list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } input:focus{ outline:none; } button{ outline: none; } h1{ line-height: 2rem; font-size: 1.5rem; font-weight: 600; } h2{ margin-bottom: 1rem; overflow: hidden; font-size: 1.25rem; font-weight: 600; line-height: 1.75rem; } /* 头部间距 */ .top{ margin-top: 0.625rem; } /* 固定行数结束 */ /*公共样式结束*/ * { margin: 0px; padding: 0px; } html{ font-size:100%; } html, body{ height: 100%; width: 100%; } body{ /* 去掉边框 */ overflow-x: hidden; position: relative; background-color: #f8f8f8; font-family: 'lato', sans-serif; } a:hover{ color: #2f54eb !important; } /* 头部 */ .hd1{ width: 100%; height: 2.75rem; background-color: #2f54eb; } .hd1 span{ background: no-repeat center center; width: 1.25rem; height: 1rem; background-size: 1.25rem 1rem; font-size:2rem; cursor:pointer; color: #fff; } header div{ padding: 0 0.875rem; height: 2.75rem; display: flex; justify-content: space-between; align-items: center; overflow: hidden; } header a { float: left; } header a.logo img{ height: 1.75rem; } header .zx-se{ position: relative; align-items: center; background-color: #f1f1f1; height: 1.5rem; width: 12.375rem; border-radius: 2.5rem; } header .zx-se input{ font-size: 0.75rem; width:70%; border: 0; background: none; height: 1.5rem; position: relative; border-radius: 2.5rem; } header .zx-se button{ font-size: 0.75rem; border-left: #2f54eb 1px solid; height: 1.5rem; position: absolute; right: 0.875rem; color: #2f54eb; align-items: center; text-align: center; border-radius:1.25rem; background: none; border: 0; } header .zx-se button::before{ content: ''; width: 1rem; height: 1rem; background: no-repeat center left; background-size: 0.75rem 1rem; border-right: 1px solid #e9e9e9; display: block; position: absolute; padding-right: 0.5rem; top: 0.25rem; right: 1.25rem; } header .nav img{ height: 1rem; } /* 头部结束 */ /* 底部 */ /* 是把底部固定在100% */ .site-content{ min-height: 100%; overflow: hidden; } footer{ width: 100%; overflow: hidden; text-align: center; background-color: #2f54eb; } footer div{ padding: 0.625rem 1rem; } footer div a{ padding: 0 0.625rem; border-right: 1px solid rgb(255, 255, 255,0.5); } footer div a:nth-child(2){ border: 0; } footer div a , footer div p{ line-height: 1.25rem; font-size: 0.75rem; color: #fff; opacity: 0.5; } /* 底部结束 */ /* 卡片颜色 */ .c{ position: relative; overflow: hidden; padding: 1rem 1rem 0 1rem; background-color: #fff; } /* 卡片颜色结束 */ /* banner 轮播图*/ .banner{ padding: 1rem 1rem 0 1rem; background-color: #fff; } #slideshow{ height: 12.5rem; /* margin: 0 0.625rem; 设置在页面水平居中 */ overflow: hidden; position: relative; } #slideshow img{ width: 100%; height: 100%; border-radius: 0.375rem; position: absolute; /*图片采取绝对定位,均位于左上角,重叠在一起*/ top: 0; left: 0; opacity: 0; /*初始不透明度为0,图片都看不见*/ transition: opacity 1s linear; /*--重点--定义一个关于透明度的transition*/ } #slideshow img.active{ opacity: 1; /*有active类的图片不透明度为1,即显示图片*/ } /*-- 设置页码的样式 --*/ #slideshow div{ position: absolute; bottom: 0.3125rem; right: 2%; padding: 0.3125rem; border-radius: 1.5625rem; } #slideshow span{ float: left; width: 0.3125rem;; height: 0.3125rem; border-radius: 1rem; /*设置页码为圆形*/ margin: 0 0.125rem; background: white; } #slideshow span.active{ width: 0.875rem !important; background: #2f54eb; } /*-- 设置左右按钮框的样式 --*/ #slideshow p{ width: 1.875rem; line-height: 3.125rem; position: absolute; top: 50%; margin-top: -1.875rem; /*设置垂直居中*/ color: white; background: rgba(0,0,0,0.2); font-size: 1rem; text-align: center; cursor: pointer; /*设置鼠标*/ /*设置不能选择文本*/ -ms-user-select:none;/*ie10*/ -webkit-user-select:none;/*webkit浏览器*/ user-select:none; display: none; } #slideshow p.left{ left: 0; } #slideshow p.right{ right: 0; } #slideshow:hover p{ display: block; } #slideshow p:hover{ background: rgba(0,0,0,0.6); } /* banner 轮播图结束 */ /* 金刚区 */ .kk{ background-color: #fff; padding: 1rem 0 0.5rem 0; border-radius: 0 0 0.5rem 0.5rem; } .kk ul{ padding: 0 1.25rem; display: flex; justify-content: space-between; } .kk ul li{ text-align: center; } .kk ul li img{ width: 2.75rem; } .kk ul li span{ margin-top: 0.625rem; font-size: 0.75rem; } /* 金刚区结束 */ /* 当前位置 */ .site-b1{ padding: 0 1rem; line-height: 1.75rem; } .site-b1 a , .site-b1 i{ color: #999; font-size: 0.875rem; } /* 当前位置结束 */ /* 最新更新 */ /* 标题 */ .zx-a-4{ margin: 0.25rem 0 0 0; position: relative; overflow: hidden; padding-bottom: 1rem; border-bottom: 1px solid #f2f2f2; } .zx-a-4 span{ font-size: 1.125rem; font-weight: 700; width: 10rem; height: 1rem; padding-left: 0.875rem; position: relative; } .zx-a-4 span::before{ content: ''; background-color: #2f54eb; width: 0.25rem; height: 1rem; display: block; position: absolute; top: 18%; } .zx-a-4 a ,.zx-la-c1 a{ display: block; background-size: 0.75rem 0.75rem; color: #989898; padding-left: 1.125rem; font-size: 0.75rem; float: right; } /* 标题结束 */ .a-1{ overflow: hidden; } .a-1 .a-2-img { display: block; overflow: hidden; float: left; border-radius: 0.3125rem; margin-right: 0.625rem; } .a-2-img img{ width: 7rem; height: 4.5rem; border-radius: 0.3125rem; } /* 栏目内容 */ .zx-la-a1{ overflow: hidden; min-height: 380px; } .zx-la-a1 li{ padding: 1rem 0; border-bottom: 1px solid #f2f2f2; overflow: hidden; } .zx-la-a1 li:nth-child(4){ border-bottom: 0; } .zx-la-a1 li a img{ width: 7rem; height: 4.375rem; border-radius: 0.25rem; float: left; margin-right: 1rem; } .zx-la-a1 li a span{ margin-bottom: 0.5rem; height: 2.5rem; line-height: 1.25rem; font-size: 1rem; color: #343434; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .zx-la-a1 li em a{ display: block; float: left; max-width: 12.5rem; color: #989898; font-size: 0.75rem !important; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .zx-la-a1 li em i{ float: right; font-size: 0.75rem; color: #989898; } /* 栏目内容结束 */ /* 最新更新 */ .zx-hot ul li a img , .zx-hot-a li a img{ overflow: hidden; margin-right: 0.625rem; width: 7rem; height: 4.4375rem; float: left; border-radius: 0.24rem; } .zx-a-a1{ width: 100%; margin-top: 0.5rem; float: left; } .zx-a-a1 a{ white-space: nowrap; overflow: hidden; display: block; max-width: 6.75rem !important; float: left; color: #ccc; font-size: 0.75rem !important; margin-right: 0.625rem; } .zx-a-a1 i{ float: right; color: #ccc; font-size: 0.75rem !important; } /* 最新更新结束 */ /*2 */ .zx-a-5 em{ color: #2f54eb; font-weight: bold; font-size: 1.125rem; margin-right: 0.125rem; } .zx-a-5 span{ font-size: 1.125rem; font-weight: 700; width: 10rem; height: 1rem; color: #343434; } .zx-a-5 a{ float: right; font-size: 0.75rem; color: #989898; } .zx-hot , .zx-lan1 ,.zx-la-top ,.zx-la-a10 ,.zx-art-b2,.zx-cai{ border-radius: 0.5rem; } .zx-hot .zx-a-4 span{ background: no-repeat center left; background-size: 0.875rem 1rem; } .zx-hot-a{ height: 32.875rem; overflow: hidden; margin-bottom: 1rem; } .zx-hot ul li ,.zx-hot-a li{ border-bottom: 1px solid #e9e9e9; overflow: hidden; padding-bottom: 0.625rem; margin-bottom: 0.25rem; } .zx-hot ul li:nth-child(4){ border: 0; } .zx-hot1{ margin: 0.625rem 0; } .zx-hot1 li a span{ width: 13rem; } .zx-hot ul li a span , .zx-hot-a li a span{ line-height: 2rem; font-size: 1rem; color: #343434; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .zx-hot ul li a p,.zx-hot-a li a p{ font-size: 0.875rem; color: #9e9e9e; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.25rem; } .zx-hot2 , .zx-hot3{ margin-top: 0.375rem; font-size: 0.75rem; } .zx-hot2 a ,.zx-hot3 a { display: block; float: left; max-width: 9.375rem; margin-right: 0.625rem; color: #989898; } .zx-hot2 i , .zx-hot3 i{ float: right; color: #989898; } .zx-hot3 { margin-top: 1rem; } /*2结束 */ /* 栏目推荐 */ .zx-lan1 ul{ margin: 0.625rem 0; display: flex; flex-wrap: wrap; justify-content: left; } .zx-lan1 ul li { width: 6rem; overflow: hidden; margin-right: 1.5rem; white-space: nowrap; } .zx-lan1 ul li a{ font-size: 0.875rem; color: #333; display: block; line-height: 2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .zx-lan1 ul li:nth-child(3n){ margin-right: 0; } /* 栏目推荐结束 */ /* 卡片切换 */ .wrap { position: relative; overflow: hidden; } .box { position: absolute; list-style: none; left: 0; top: 0; padding: 0; margin: 0; } .box li.zx-bo { width: 100%; float: left; } .a1-up{ padding: 1rem; overflow: hidden; } .box { position: relative; width: 100%; top: 0; bottom: 0; left: 0; right: 0; background: red; } .zx-la-a1 li{ width: 100%; } .zx-span { overflow: hidden; position: absolute; bottom: 12px; right: 35%; z-index: 2; } .span1{ width: 0.875rem !important; background-color: #2f54eb !important; } .zx-span span{ margin-left: 10px; float: left; display: block; background-color: #e5e5e5; width: 6px; height: 6px; border-radius: 20px; } /* 卡片切换结束 */ /* 导航栏 */ .sidenav .zx-se{ margin: 0 auto; width: 12.5rem; background-color: #fff; position: relative; overflow: hidden; border-radius: 2.5625rem; } .sidenav h3{ background: no-repeat center left; background-size: 1rem 1rem; position: absolute; padding-left: 1.5rem; top: 1rem; margin: 0.5rem 0.5rem 0.5rem 2rem; left: -0.75rem; } .sidenav .zx-se .input1{ border: 0; float: left; width: 100%; height: 1.5rem; text-indent: 1em; font-size: 0.75rem; } .sidenav .zx-se button{ background: no-repeat; height: 1.5rem; width: 1.25rem; background-size: 0.875rem 1rem; position: absolute; top: 0.3125rem; right: 0.625rem; background-color: inherit; border: 0; } .h5-a1 ,.h5-a2 .h5-a3{ margin-top: 1.25rem; } .h5-a1 ul{ margin: 0 1.25rem; display: flex; flex-wrap: wrap; justify-content: left; } .h5-a1 ul li{ margin-right: 00.625rem; background-color: #2f54eb; margin-bottom: 0.625rem; border-radius: 0.3125rem; } .h5-a1 ul li a{ margin: 0 auto; text-align: center; line-height: 2.625rem; padding: 0.625rem 1rem; overflow: hidden; font-size: 1rem; color: #fff; } .h5-a2 ul{ margin:1.25rem; overflow: hidden; } .h5-a2 ul li a{ display: block; white-space: nowrap; margin: 0 0.625rem; text-align: center; line-height: 2.625rem; overflow: hidden; font-size: 0.875rem; color: #333; } .h5-a2 ul li{ float: left; background-color: #eaeaea; border-radius: 0.3125rem; margin-right: 0.625rem; margin-bottom: 0.625rem; } .h5-a3{ overflow: hidden; margin: 0 1.25rem; } .h5-a3 h4{ display: block; float: left; color: #333; } .h5-a3 h4::before{ content: ''; background-color: #2f54eb; width: 0.25rem; height: 1rem; display: block; float: left; margin-right: 0.625rem; } /* 导航栏结束 */ /* 栏目 */ .sidenav { height: 100%; width: 0; position: fixed; z-index: 999; top: 0; left: 0; background-color: #fff ; overflow-x: hidden; transition: 0.5s; text-align: center; } .sidenav::-webkit-scrollbar{ display: none; } .sidenav a:hover { color: #f1f1f1; } .sidenav .closebtn { padding: 0.5rem 2rem 0.5rem 0.5rem; position: absolute; top: 0; right: -0.75rem; color: #333; font-size: 2.25rem; /* margin-left: 50px; */ } @media screen and (max-height: 28.125rem) { .sidenav { padding-top: 1rem; } .sidenav a { font-size: 1.125rem; } } .zx-wz { font-size: 0.75rem; color: #999; line-height: 2rem; padding: 0 1rem; } .zx-wz a{ color: #999; } /* 分页 */ .paging{ padding: 1.25rem 0; text-align: center; } .pagination { list-style: none; display: inline-block; padding: 0; margin-top: 0.625rem; } .pagination li { display: inline; text-align: center; } .pagination a { border-radius: 6rem; margin: 0 0.625rem; float: left; display: block; font-size: 0.875rem; text-decoration: none; padding: 0.3125rem 0.8rem; color: #fff; margin-left: -0.0625rem; border: 0.0625rem solid transparent; line-height: 1.5rem; } .pagination a.active { cursor: default; } .pagination a:active { outline: none; } .aa-modal-1 a { border-color: #ddd; color: #2f54eb; background: #fff; } .aa-modal-1 a:hover { background: #eee; color: #fff !important; } .aa-modal-1 a.active, .aa-modal-1 a:active { border-color: #2f54eb; background: #2f54eb; color: #fff; } .tag ul li a:hover{ color: #2f54eb; border-radius: 0.3125rem; } /*/分页结束 */ /* label */ /* 当前位置 */ .zx-cl-a{ margin: 0 1rem; line-height: 2.25rem; font-size: 0.875rem; color: #999; } .zx-cl-a a{ color: #999; } /* 当前位置结束 */ /* 分类 */ .zx-cl ul{ display: flex; flex-wrap: wrap; justify-content: left; overflow: hidden; padding-bottom: 1rem; } .zx-cl ul li{ background-color: #f5f5f8; margin: 1rem 0.625rem 0 0; } .zx-cl ul li:nth-child(3n){ margin-right: 0; } .zx-cl ul li a{ font-size: 0.875rem; border-radius: 0.25rem; display: block; line-height: 2rem; padding: 0 0.625rem; } .zx-cl ul li a:hover{ background-color: #2f54eb; color: #fff !important; } .zx-cl p{ font-size: 0.875rem; line-height: 1.25rem; padding: 0.625rem 0 1rem 0; color: #343434; } /* 分类结束 */ /* label结束 */ /* 详情页 */ .zx-art-b2{ background-color: #fff; padding: 1rem; overflow: hidden; } .zx-art-b2-ab{ overflow: hidden; } .tiem{ padding: 0.625rem 0; display: flex; justify-content: left; line-height: 2rem; font-size: 0.75rem; color:#999; overflow: hidden; border-bottom: #f2f2f2 solid 1px; margin-bottom: 0.625rem; } .tiem ul li{ overflow: hidden; max-width: 8rem; float: left; } .tiem a{ display: block; overflow: hidden; white-space: nowrap; color: #999; margin-left: 1rem; max-width: 8rem; text-overflow: ellipsis; } /* 收起 */ .zx-art-b2-ac { overflow: hidden; /* height: 76rem; */ position: relative; } .zx-art-b2-ac span{ display: none; font-size: 1rem; position: absolute; bottom: 0; width: 100%; line-height: 4rem; overflow: hidden; text-align: center; color: #2f54eb; background-image: linear-gradient( 180deg ,hsla(0,0%,100%,0.8),#fff); } .zx-art-b2-ac p img{ width: 12.5rem; height: 6.25rem; margin-left: 25%; border-radius: 0.25rem; } .zx-art-b2-ac p{ overflow: hidden; text-align: justify; font-size: 1rem; line-height: 1.75rem; margin-bottom: 1.25rem; } .zx-art-b2-ac .p{ color: #999; font-size: 0.75rem; word-break: break-all; line-height: 1.125rem; border-bottom: #f2f2f2 1px solid; padding-bottom: 1.25rem; } .zx-art-b2-ac .p a{ color: #999; } /* 文章结束 */ /* 篇章 */ .zx-art-b2-ad p{ font-size: 0.875rem !important; height: 1.5rem; font-size: 1.125rem; width: 48%; margin-right: 4%; line-height: 1.5rem; overflow: hidden; display: block; float: left; } .zx-art-b2-ad p:nth-child(2){ margin-right: 0; } /* 篇章结束 */ .aa-hot-lan1 .a-4 span::after{ background: ; background-size: 4.6875rem 1.5625rem; } .aa-hot-lan1 .a-4 span::before{ background-color: #ff4b4b; } /* 猜你喜欢 */ .zx-a-5{ padding:0.25rem 0 1rem 0; border-bottom: 1px solid #f2f2f2; } .zx-cai .zx-a-5 span{ background: no-repeat center left; background-size: 1rem 1rem; padding-left: 1.625rem; } /* 猜你喜欢 */ /* 详情页结束 */ /*网站地图 */ .zx-map .zx-a-4 span{ background: no-repeat center left; background-size: 1.25rem 1rem; padding-left: 1.875rem; } .zx-map .zx-a-4 span::before{ background: none; } /* 网站地图结束 */