@charset "utf-8";
body,div,li,ul,ol,dl,dd,dt,span,b,strong,p,h1,h2,h3,h4,h5,input{margin:0;padding:0;}
ul,li,dl,dt,dd,ol{list-style:none;list-style-type:none;}
a img,a,a:hover,a:active,a:visited{border:none;text-decoration:none; outline:none;}
body{font-size:14px;background-color: #fff;}
*{box-sizing: border-box;}
input,body,textarea,pre,code{ font-family:"Sarasa Gothic","PingFang SC", "Microsoft YaHei","Helvetica Neue",Helvetica,"Hiragino Sans GB",Arial,sans-serif;}
/* 可以对选中文本进行自定义样式设计，例如改变选中文本的背景色、文字颜色等 */
::selection{background:#d51111;color:#fff;}
/* 是一个用于 Firefox 浏览器的 CSS 伪元素选择器，与 ::selection 类似，但它专为 Firefox 设计 */
::-moz-selection{background:#d51111;color:#fff;}
/* 可以为输入框的占位符文本设置特定的样式，例如颜色、字体、大小 */
::-webkit-input-placeholder{text-overflow:ellipsis}
/* 设置滚动条 */
::-webkit-scrollbar{width:8px;height:8px;overflow:auto}
::-webkit-scrollbar-thumb{background-color:#e6e6e6;min-height:25px;min-width:25px;border:1px solid #e0e0e0}
::-webkit-scrollbar-track{background-color:#f7f7f7;border:1px solid #efefef}

/* 显示一行超出省略号 */
.ellipsis {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}


/* 分页 */
.ui-news-page{ height: auto; box-sizing: border-box; overflow: hidden;}
.pagination{ width:auto; height:auto; overflow:hidden; clear:both; text-align:center;  margin:20px auto 20px auto;}
.pagination li{ min-width:32px; height:32px;text-align:center; display:inline-block; line-height:32px; margin-right:4px;border:solid 1px #d9d9d9; border-radius:4px;}
.pagination li:first-child a,.pagination li:last-child a{box-sizing: border-box;padding: 0 10px;}
.pagination li a{ width:100%; height:32px; text-align:center; line-height:32px; display:block; font-size:14px; color:#666; box-sizing: border-box; }
.pagination li:hover,.pagination li.active{ background:#d51111; color:#fff; border:solid 1px #d51111; }
.pagination li:hover a{ color: #fff;}

/* 版心 */
.w {width: 1400px;margin: 0 auto;box-sizing: border-box;overflow: hidden;height: auto;}

/* 头部 */
.header {height: auto;width: 100%;overflow: hidden;}
.flex-header {display: flex;justify-content: space-between;height: 110px;align-items: center;overflow: hidden;}
.header .logo {font-size: 0;height: 64px;overflow: hidden;}
.header .logo img {width: 100%;height: 100%;}
.header .ui-search {height: 46px;width: 390px;border-radius: 6px;overflow: hidden;}
.header .ui-search form {display: flex;align-items: center;}
.header .ui-search .ui-kwd {height: 46px;outline: none;border:1px solid #dddddd;border-right: 0;flex: 1;padding: 0 15px;border-top-left-radius: 6px;border-bottom-left-radius: 6px;}
.header .ui-search button {width: 80px;height: 46px;background-color: #d51111;text-align: center;line-height: 46px;font-size: 22px;color: #fff;}
.header .ui-search button span {font-size: 22px;}
.header .nav {width: 100%;height: 60px;background-color: #d51111;}
.header .nav .w {display: flex;align-items: center;}
.header .nav a {height: 60px;line-height: 60px;position: relative;flex: 1;color: #fff;font-size: 16px;text-align: center;}
.header .nav a:hover {background-color: #ae0000;}
.header .nav a.active {background-color: #ae0000;}
.header .right {display: none;width: 90px;height: 45px;justify-content: space-between;align-items: center;}
.header .right a {width: 45px;height: 45px;color: #000;display: flex;justify-content: center;align-items: center;}
.header .right a span {font-size: 22.5px;}
.header .classify {position: relative;height: 44px; width: 44px;-webkit-transition: background 0.5s;-moz-transition: background 0.5s;-o-transition: background 0.5s;transition: background 0.5s;}
.header .classify:hover {cursor: pointer;background-color: rgba(255, 255, 255, 0.2);}
.header .classify span {position: absolute;left: calc((100% - 25px) / 2);top: calc((100% - 2px) / 2);width: 25px;height: 2px;background-color: #000;}
.classify span:nth-child(1) {transform: translateY(10px) rotate(0deg);}
.classify span:nth-child(2) {opacity: 0;}
.classify span:nth-child(3) {transform: translateY(-10px) rotate(0deg);}
.classify-active span:nth-child(1) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: clickfirst;}
.classify-active span:nth-child(2) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: clicksecond;}
.classify-active span:nth-child(3) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: clickthird;}
/*第一条线旋转动画*/
@keyframes clickfirst {
    0% {
        transform: translateY(8px) rotate(0deg);
    }
    100% {
        transform: translateY(0) rotate(45deg);
    }
}
/*第二条线淡入淡出动画动画*/
@keyframes clicksecond {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}
/*第三条线旋转动画*/
@keyframes clickthird {
    0% {
        transform: translateY(-8px) rotate(0deg);
    }

    100% {
        transform: translateY(0) rotate(-45deg);
    }
}
.classify-out span:nth-child(1) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: outfirst;}
.classify-out span:nth-child(2) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: outsecond;}
.classify-out span:nth-child(3) {animation-duration: 0.5s;animation-fill-mode: both;animation-name: outthird;}
@keyframes outfirst {
    0% {
        transform: translateY(0) rotate(-45deg);
    }

    100% {
        transform: translateY(-8px) rotate(0deg);
    }
}
@keyframes outsecond {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@keyframes outthird {
    0% {
        transform: translateY(0) rotate(45deg);
    }

    100% {
        transform: translateY(8px) rotate(0deg);
    }
}
/* 底部 */
.footer {background-color: #252525;width: 100%;height: auto;overflow: hidden;}
.footer .flex-footer {display: flex;height: 100px;border-bottom: 1px solid rgba(255, 255, 255, 0.1);align-items: center;justify-content: space-between;}
.footer .top {width: 46px;height: 46px;background-color: #d51111;font-size: 18px;color: #fff;line-height: 46px;text-align: center;}
.footer .nav {flex: 1;display: flex;justify-content: center;align-items: center;}
.footer .nav a {color: #fff;font-weight: bold;padding: 0 28px;}
.footer .nav a:hover {color: #d51111;}
.footer .foot {padding: 56px 0;}
.footer .foot .info {display: flex;align-items: center;justify-content: center;}
.footer .foot .info span {font-size: 15px;color: #999999;padding: 0 10px;line-height: 34px;}
.footer .foot .info a {font-size: 15px;color: #999999;line-height: 34px;padding: 0 10px;}
.footer .foot .info a:hover {color: #d51111;}


/* 关于我们 */
.aboutwrap {width: 100%;}
.aboutwrap h4 {font-size: 42px;line-height: 45px;text-align: center;padding: 50px 0;font-weight: bold;}

/* 内容 */
.ui-article{ margin: 20px auto 5px auto;}
.ui-content{ width: 100%; }
.ui-content-main{ width: 100%; height: auto; background-color: #fff; box-sizing: border-box; overflow: hidden; padding: 20px;border-radius: 8px; }
.ui-content h2{ line-height: 40px; font-size: 20px; text-align: center;}
.ui-art-tags{ text-align: center; line-height: 35px; font-size: 13px; color: #999; border-top: solid 1px #efefef; border-bottom: solid 1px #efefef; margin: 15px auto;}
.ui-art-tags span{ margin: 0 5px;}
.ui-cont{ line-height: 280%; font-size: 16px; font-family:"PingFang SC", "Microsoft YaHei","Helvetica Neue",Helvetica,"Hiragino Sans GB",Arial,sans-serif !important;}
.ui-cont p,.ui-cont div{font-family:"PingFang SC", "Microsoft YaHei","Helvetica Neue",Helvetica,"Hiragino Sans GB",Arial,sans-serif !important;line-height: 280%; font-size: 16px;}
.ui-cont img{  max-width: 100%;}

.article-pager{ width:100%; height:38px; margin:15px auto 15px auto; clear:both; text-align:center;}
.article-pager li{ width:128px; height:38px; border:solid 1px #efefef; text-align:center; display:inline-block; line-height:38px; box-sizing:border-box; border-radius:4px; background:#fff; margin-right:7px;}
.article-pager li a{ width:100%; height:38px; display:block; color:#333; font-size: 13px;}
.article-pager li a span{ font-size: 13px;}
.article-pager li:hover{  border:solid 1px #d51111;}
.article-pager li:hover a{ color:#d51111;}

.article-share{ height:40px; margin-bottom:10px; position:relative;}
.article-share div{ float:right;}
.article-share div.share-iconfont{ height:40px; line-height:30px; margin-right:5px; font-size: 13px;}
.article-share div.share-icon{ width:24px; height:24px; margin-right:5px; border-radius:50%; border:solid 1px #ececec; overflow:hidden; text-align:center; padding:3px;}
.article-share div.share-icon img{ height:18px; display:block; margin:3px auto;-webkit-filter: grayscale(1);filter:gray;filter: grayscale(1);}
.article-share div.share-icon:hover{ border:solid 1px #ddd;}
.article-share div.share-icon:hover img{-webkit-filter: grayscale(0);filter:none;filter: grayscale(0);}

.ui-article-tag{ margin:0px auto 0px auto; clear:both;}
.ui-article-tag span{ padding:4px 6px; border:solid 1px #efefef; margin:0 5px 0 0; border-radius:4px; color:#999;}
.ui-article-tag span a{ color: #999;}
.ui-article-tag span i{ font-size: 12px;}
.ui-article-tag span:hover{ background-color: #efefef; color: #999;}

/* 暂无数据 */
.ui-nodata{ text-align: center; padding: 20px; box-sizing: border-box; overflow: hidden;}
.ui-nodata img{ display:block; margin: 0 auto;}
.ui-nodata p{ font-size: 13px; color: #666; line-height: 38px;}

/* 新闻 */
.ui-news{ width: 100%; height: auto; box-sizing: border-box; overflow: hidden; margin-top: 10px;margin-bottom: 10px; }
.ui-news ul .newsitem {border-bottom: 1px dashed #dbdbdb;overflow: hidden;}
.ui-news ul .newsitem .newsA {display: flex;align-items: center;justify-content: space-between;height: 56px;}
.ui-news ul .newsitem .newsA::before {content: '';width: 9px;height: 9px;background-image: url(../images/li_icon.png);background-size: contain;background-position: center;}
.ui-news ul .newsitem .newsA span {flex: 1;margin-left: 10px;font-size: 16px;color: #222222;line-height: 56px;}
.ui-news ul .newsitem .newsA i {color: #999999;font-size: 16px;line-height: 56px;margin-left: 10px;font-style: normal;}
.ui-news ul .newsitem .newsA:hover span {color: #d51111;}

/* 联系我们 */
.contactMain {width: 100%;display: flex;justify-content: space-between;padding: 70px 0;}
.contactMain .left  {flex: 1;height: 500px;}
.contactMain .right {width: 500px;height: 500px;background-color: #d51111;padding: 30px;}
.contactMain .right h2 {font-size: 36px;line-height: 45px;color: #fff;}
.contactMain .right dl {margin-top: 30px;}
.contactMain .right dl dt {display: flex;align-items: center;line-height: 40px;color: #fff;margin-top: 15px;}
.contactMain .right dl dt span {font-size: 20px;font-size: 24px;}
.contactMain .right dl dt i {font-size: 24px;color: #fff;font-style: normal;margin-left: 10px;}
.contactMain .right dl dd {font-size: 20px;line-height: 30px;color: #fff;}

/* 分类容器 */
.asidewrap {position: fixed;top: 0px; left: 0;  right: 0;  bottom: 0; z-index: 999;display: none;background-color: #f5f5f5;padding: 0 15px; padding-top: 120px;}
.asidewrap ul {width: 100%;overflow-y: auto;height: calc(100vh - 110px);}
.asidewrap li {border-bottom: 1px solid #dcdcdc;font-size: 16px;}
.asidewrap li .asideheader {display: flex;justify-content: space-between;align-items: center;height: 60px;}
.asidewrap li .asideheader .tit {flex: 1;font-size: 16px;color: #333;line-height: 60px;}
.asidewrap li .asideheader .kz {width: 60px;font-size: 35px;font-style: normal;font-weight: normal;text-align: right;color: #666;}
.asidewrap li .asideheader .tit:hover {color: #d51111;}
.asidewrap li .asidecontent {padding: 0 15px;display: none;}
.asidewrap li .asidecontent a {display: block;position: relative;line-height: 44px;color: #666;font-size: 14px;padding-left: 15px;}
.asidewrap li .asidecontent a:hover {color: #d51111;}

/* 搜索容器 */
.searchWrap {position: fixed;display: none;justify-content: center;align-items: center;width: 100%;height: 100%;
background-color: rgba(0, 0, 0, 0.2);z-index: 9999;}
.searchMain {position: relative;width: 45%;padding: 100px 80px;background-color: #fff;}
.searchMain .close{position: absolute;top: 0;right: 0; height: 50px;width: 50px;line-height: 50px;text-align: center;transition: all .5s;}
.searchMain .close span {font-size: 25px;}
.searchMain .close:hover{transform: rotate(180deg);}
.searchMain .searchform {display: flex;flex-direction: column;}
.searchMain .searchform .search-text {height: 60px;outline: none; border-bottom: 1px solid #e3e3e3;font-size: 16px;}
.searchMain .searchform .search-btn {cursor: pointer;width: 160px;height: 50px;margin-top: 30px;font-size: 16px;}

/* 其他banner */
.otherSwiper {width: 100%;height: auto;overflow: hidden;position: relative;}
.otherSwiper .swiper-slide {height: 300px;width: 100%;}
.otherSwiper img {width: 100%;height: 100%;object-fit: cover;}


/* 其他导航栏 */
.othernav {background-color: #fff;width: 100%;box-shadow: 0px 1px 0px 0px rgba(147, 147, 147, 0.35);}
.othernav .navwrap {display: flex;justify-content: space-between;align-items: center;height: 80px;}
.othernav .navwrap .leftnav {flex: 1;overflow-x: auto;display: flex;}
.othernav .navwrap .leftnav::-webkit-scrollbar{width:0px;height:0px;overflow:auto}
.othernav .navwrap .leftnav a {height: 80px;padding: 0 10px;margin-left: 50px;display: flex;align-items: center;justify-content: center;font-size: 18px;flex-shrink: 0;border-bottom: 2px solid transparent;}
.othernav .navwrap .leftnav a:first-child{margin-left: 0;}
.othernav .navwrap .leftnav a.active {font-weight: bold;color: #d51111;border-bottom: 2px solid #d51111;}
.othernav .navwrap .historynav {display: flex;align-items: center;height: 80px;}
.othernav .navwrap .historynav a {font-size: 15px;color: #777777;}
.othernav .navwrap .historynav a:hover {color: #d51111;}
.othernav .navwrap .historynav a:hover i {color: #d51111;}
.othernav .navwrap .historynav span {padding: 0 8px;color: #777777;}
.othernav .navwrap .historynav a i {margin-right: 8px;font-size: 15px;color: #9a9fa8;}
.othernav .navwrap .historynav a:last-child{color: #d51111;}


/* 超小型设备（电话，600px 及以下） */
@media screen and (max-width:768px){

    .w {width: 100%;padding: 0 15px;}
    .header {position: fixed;z-index: 9999;background-color: #fff;}
    .flex-header {height: 64px;}
    .header .logo {height: 32px;}
    .header .ui-search {display: none;}
    .header .nav {display: none;}
    .header .right {display: flex;width: 90px;height: 45px;align-items: center;}


    .footer .flex-footer {display: none;}
    .footer .foot {padding: 28px 0;}
    .footer .foot .info {flex-wrap: wrap;}
    .footer .foot .info span  {font-size: 14px;}
    .footer .foot .info a {font-size: 14px;}

    .pagination{ width:auto; height:auto; overflow:hidden; clear:both; text-align:center;  margin:10px auto;}
    .pagination li{ min-width:22px; height:22px;text-align:center; display:inline-block; line-height:22px; margin-right:4px;border:solid 1px #d9d9d9; border-radius:4px;}
    .pagination li:first-child a,.pagination li:last-child a{box-sizing: border-box;padding: 0 10px;}
    .pagination li a{ width:100%; height:22px; text-align:center; line-height:22px; display:block; font-size:14px; color:#666; box-sizing: border-box; }
    .pagination li:hover,.pagination li.active{ background:#38a0f4; color:#fff; border:solid 1px #38a0f4; }
    .pagination li:hover a{ color: #fff;}

    .article-pager li{ height:38px; border:solid 1px #efefef; text-align:center;  line-height:38px; box-sizing:border-box; border-radius:4px; background:#fff;  clear: both; width:calc((100% - 30px)/3);}
    .article-pager li:nth-child(3n){ margin: 0;}

    .aboutwrap h4 {font-size: 21px;padding: 25px 0;}

    .ui-content h2 {margin-top: 64px;}

    .ui-news {margin-top: 64px;}
    .ui-news ul .newsitem .newsA span {font-size: 12px;}
    .ui-news ul .newsitem .newsA i {font-size: 12px;}

    .contactMain {flex-direction: column;padding: 35px 0;margin-top: 64px;}
    .contactMain .left {width: 100%;flex: 0;}
    .contactMain .right {width: 100%;padding: 15px;}

        /* 搜索弹窗 */
    .searchMain {width: 90%;padding: 50px 15px;}

    /* 轮播图 */
    .otherSwiper .swiper-slide {height: 150px;margin-top: 64px;}

    .othernav .navwrap {align-items: normal;flex-direction: column;height: auto;}
    .othernav .navwrap .leftnav a {height: 60px;font-size: 14px;margin-left: 15px;}
    .othernav .navwrap .historynav {height: 60px;}



}