:root {
  --main_color: rgb(6, 54, 162);
  --front_color: #0330AF;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a,
span {
  font-size: 2rem;
}

a {
  text-decoration: none;
  color: black;
}

li {
  list-style: none;
}

/* 覆盖layui的一些样式 */
.layui-tree-txt {
  color: #000;
}


/*   页面顶部    */
.nav {
  padding: 2rem 0;
  background: linear-gradient(to bottom, var(--main_color), rgb(6, 54, 200));
}

.nav>div {
  margin: 0 auto;
  padding: 0 20rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  height: 6rem;
}

.nav ul {
  display: flex;
}

.nav ul li {
  /* padding: 2rem; */
  /* width: 9rem; */
  text-align: center;
  line-height: 1;
  padding: 0 2rem;
}

.nav ul li:not(:last-child) {
  border-right: 1px solid #fff;
}

.nav ul li a {
  font-size: 2.3rem;
  color: white;
  position: relative;
}

/* .nav ul li a::after {
  width: 0;
  height: 2px;
  content: "";
  position: absolute;
  bottom: -6px;
  left: 0;
  background-color: white;
  transition: width 0.3s ease;
}

.nav ul li a:hover::after {
  width: 100%;
} */


/*   页面底部    */
.footer {
  padding: 6rem 20rem;
  background-color: rgb(17, 136, 230);
}

.footer_wrap ul {
  padding-bottom: 2rem;
  display: flex;
  justify-content: center;
  border-bottom: 1px solid white;
}

.footer_wrap li+li {
  margin-left: 10rem;
  position: relative;
}

.footer_wrap li+li::after {
  content: "";
  display: block;
  width: 2px;
  height: 100%;
  position: absolute;
  background-color: white;
  top: 0;
  left: -5rem;
}

.footer_wrap li a {
  color: white;
  font-size: 2rem;
}

.footer_wrap li a:hover {
  color: var(--front_color);
  font-weight: bold;
}

.footer_info {
  padding-top: 2rem;
  display: flex;
  justify-content: center;
}

.footer_info>div+div {
  margin-left: 3rem;
}

.footer_info div,
.footer_info a {
  color: white;
  font-size: 1.8rem;
}



/*   首页轮播    */
.banner_con {
  width: 100%;
  /* background: linear-gradient(to bottom, rgb(6, 54, 162), rgb(1, 95, 183)); */
  height: 70rem;
  background-image: url('../img/banner1.png');
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.banner {
  position: absolute;
  right: 32rem;
  bottom: 26rem;
  width: 23rem;
  overflow: hidden;
  padding-top: 2rem;
  /* 为图片上下飘动留出空间，否则图片飘到上面后，会有一部分消失 */
}

.banner .swiper-slide img {
  width: 100%;
  animation: floatAnimation 2s ease-in-out infinite;
}

@keyframes floatAnimation {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-2rem);
  }
}

.dizuo {
  position: absolute;
  right: 32rem;
  width: 23rem;
  bottom: 20rem;
}

.dizuo img {
  width: 100%;
}

.page_box {
  position: relative;
}

.page_box #nav_head {
  width: 100%;
  position: absolute;
  z-index: 2;
}

.page_box .nav {
  padding: 2rem 0;
  background: none;
}

/* 主体部分 */
.con {
  padding: 5rem 20rem;
}

/* 顶部统计数字 */
.top_num_con {
  background-color: #f4f4f4;
}

.top_num {
  display: flex;
  /* margin: 5rem 0; */
  background-color: #fff;
}

.top_num>div {
  width: 25%;
  padding: 5rem 0;
  text-align: center;
  border-right: 1px solid #eee;
  background-repeat: no-repeat;
  background-position: center center;

}

.top_num>div:nth-child(1) {
  background-image: url('../img/icon1.png');
}

.top_num>div:nth-child(2) {
  background-image: url('../img/icon2.png');
}

.top_num>div:nth-child(3) {
  background-image: url('../img/icon3.png');
}

.top_num>div:nth-child(4) {
  background-image: url('../img/icon4.png');
}

.top_num>div .num {
  font-size: 5.5rem;
  font-family: Amitabold;
  line-height: 3;
  color: var(--front_color);
}

.top_num>div .dw {
  font-size: 1.8rem;
}

.top_num>div .note {
  font-size: 1.9rem;
  margin: 0 1rem 1rem 1rem;
  padding-top: 5rem;
  /* color: #666; */
  position: relative;
}

.top_num>div .note::before {
  content: "";
  width: 6rem;
  height: 1px;
  background-color: #333570;
  display: inline-block;
  position: absolute;
  top: 2px;
  left: calc(50% - 3rem);
  z-index: 1;
}

.top_num>div .en {
  font-size: 1.6rem;
  color: #999;
}

/* 首页知产指南 */
.zn {
  padding: 7rem 20rem;
}

.con .con_ti {
  font-size: 4rem;
  text-align: center;
}

.zn_nav {
  display: flex;
  justify-content: center;
  font-size: 1.9rem;
  margin: 3.5rem 0 6rem 0;
}

.zn_nav .zn_nav_item {
  padding: 1rem 2.5rem;
  margin: 0 1rem;
}

.zn_nav .zn_nav_item:hover {
  cursor: pointer;
  background-color: #0330AF;
  color: white;
}

.zn_nav .zn_nav_item.active {
  background-color: #0330AF;
  color: white;
}

.zn_article {
  font-size: 2rem;
  display: flex;
}

.zn_art_left {
  width: 40%;
  padding-right: 2.5rem;
  border-right: 1px solid #eee;
}

.zn_art_right {
  width: 60%;
  margin-left: 4rem;
  margin-right: 4rem;
}

.zn_art_right ul {
  display: block;
  height: 100%;
}

.zn_art_right ul li {
  height: 16.66%;
  display: block;
}

.zn_art_right ul li a {
  /* display: flex; */
  /* justify-content: space-between; */
  /* flex-wrap: nowrap; */
  display: block;
}

.zn_art_right ul li a span {
  font-size: 2rem;
}

.zn_art_right ul li a span i {
  position: relative;
  bottom: 0.5rem;
  padding-right: 0.5rem;
}

.zn_art_right ul li a span:nth-child(1) {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 2.8rem;
  line-height: 2.8rem;
  width: calc(100% - 12rem);
  float: left;
}

.zn_art_right ul li a span:nth-last-child(1) {
  font-size: 1.8rem;
  color: #999;
  /* width: 12rem; */
  float: right;
  position: relative;
  top: 0.25rem;
}

/* 底部-立即申请按钮 */
.btn_bottom_con {
  margin: 6rem 0 2rem 0;
}

.btn_bottom {
  font-size: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn_bottom a {
  font-size: 1.8rem;
  padding: 2rem 11rem;
  background-color: var(--front_color);
  border-radius: 3px;
  color: white;
}

/**************************** 知产指南左侧视频文章轮播 *************************/
.zn_left_swiper img {
  width: 100%;
  height: 29.6rem;
  object-fit: cover;
}

.zn_left_swiper .bullets_1 {
  left: auto;
  right: 0rem;
  bottom: 1.5rem;
  width: 4.7rem;
}

.zn_left_swiper .bullet_1 {
  width: 0.8rem;
  height: 0.8rem;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: .3;
  margin: 0 0.2rem;
}

.swiper-pagination-clickable .bullet_1 {
  cursor: pointer;
}

.zn_left_swiper .bullet_1_active {
  width: 1.6rem;
  -webkit-border-radius: 0.8rem;
  border-radius: 0.8rem;
  -webkit-transition: width 0.5s ease;
  transition: width 0.5s ease;
  opacity: .5;
}

.pad_20 {
  padding: 2rem;
}

.mrg_top_10 {
  margin-top: 1rem;
}

.mrg_top_20 {
  margin-top: 2rem;
}

.mrg_top_30 {
  margin-top: 3rem;
}

.mrg_top_40 {
  margin-top: 4rem;
}

.mrg_top_50 {
  margin-top: 5rem;
}

.zn_swiper_ti {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 3.4rem;
  text-align: justify;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  height: 3.4rem;
  margin: 0.8rem 0;
  width: calc(100% - 8rem);
}

/* 首页列表 */
.list_box {
  margin: 10rem auto;
  padding: 0 20rem;
  display: flex;
}

.list_box>div {
  width: 50%;
}

.list_box>div:first-child {
  margin-right: 4rem;
}

.list_box>div:last-child {
  margin-left: 4rem;
}

.list_title {
  margin-bottom: 2rem;
  border-bottom: 1px solid var(--main_color);
}

.list_title>div {
  display: inline-block;
  padding: 1rem 2rem;
  color: white;
  font-size: 2.1rem;
  /* font-weight: bold; */
  background-color: var(--main_color);
}

.list_sel_title {
  position: relative;
}

#list_sel_swiper {
  width: 100%;
  overflow: hidden;
  border-bottom: 1px solid var(--main_color);
  position: absolute;
}

#list_sel_wrapper {
  width: calc(100% - 40px);
  margin-left: 20px;
}

#list_sel_swiper .swiper-button-next,
#list_sel_swiper .swiper-button-prev {
  width: 15px;
  height: 100%;
  position: absolute;
  bottom: 0;
  z-index: 1;
}

#list_sel_swiper .swiper-button-next::after,
#list_sel_swiper .swiper-button-prev::after {
  content: '';
  width: 0;
  height: 0;
  display: block;
  clear: both;
  position: absolute;
  border-top: 10px solid transparent;
  bottom: 0;
  z-index: 1;

}

#list_sel_swiper .swiper-button-prev {
  left: 0;
  z-index: 2;
}

#list_sel_swiper .swiper-button-next {
  right: 0;
}

#list_sel_swiper .swiper-button-prev::after {
  left: 0;
  border-right: 15px solid var(--main_color);
}

#list_sel_swiper .swiper-button-next::after {
  border-left: 15px solid var(--main_color);
  right: 0;
}

#list_city {
  margin-top: 6.5rem;
}

#list_sel_swiper .swiper-slide {
  padding: 1rem 0;
  font-size: 2.1rem;
  cursor: pointer;
  text-align: center;
}

#list_sel_swiper .swiper-slide.selectSlide {
  /* font-weight: bold; */
  color: white;
  background-color: var(--main_color);
}

.list_content {
  padding: 1rem;
  min-height: 50rem;
}

.list_content>a {
  height: 8rem;
  display: flex;
  position: relative;
  align-items: center;
}

.list_content>a+a {
  margin-top: 2rem;
}

.list_content>a::after {
  width: 0;
  height: 2px;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #999;
  transition: width 0.3s ease;
}

.list_content>a:hover::after {
  width: 100%;
}

.list_content>.no_img {
  height: auto;
}

.list_content>.no_img::after {
  bottom: 0;
}

.list_content>a>img {
  width: 10rem;
  height: 7rem;
  object-fit: cover;
  border-radius: 0.5rem;
  margin-right: 1rem;
}

.list_content>a>div {
  flex: 1;
  margin-left: 1rem;
  display: flex;
  align-items: center;
}

.list_content>.no_img>div {
  margin-left: 0;
}


.list_content div>div:first-child {
  width: 100%;
  font-size: 2rem;
  /* font-weight: bold; */
  line-height: 1.5;
  /* color: #333; */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.list_content div>div:last-child {
  width: 15rem;
  font-size: 1.7rem;
  color: #999;
  text-align: right;
}



/*   首页入口   */
.rklj {
  padding: 10rem 20rem;
  display: flex;
  justify-content: space-between;
  background-color: #f8f8f8;
}

.rklj>a {
  width: 70rem;
  height: 35rem;
  padding: 0 6rem;
  border: 1px solid #ccc;
  border-radius: 1rem;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background: linear-gradient(to right bottom, rgb(17, 136, 230), rgb(1, 115, 201));
  transition: transform 0.3s ease;
}

.rklj img {
  width: 15rem;
  margin-right: 2rem;
  /* border-radius: 2rem; */
}

.rklj>a:hover {
  background-color: #eee;
  /* 放大 */
  transform: scale(1.05);
}

.rklj div {
  color: white;
}

.rklj p {
  margin-top: 3rem;
  font-size: 1.9rem;
  line-height: 1.5;
}


/* 列表页 */


.list,
.nav_top {
  margin: 0 auto;
  padding: 0 20rem;
  display: flex;
}

.nav_top {
  padding: 2rem 20rem;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ccc;
}

#search_title {
  width: 20rem;
  font-size: 2rem;
}

#search_btn {
  background-color: #1e9fff;
}

#search_btn>i {
  color: white;
}

#search_btn:hover {
  opacity: 0.8;
}

.nav_top>ul {
  display: flex;
  align-items: center;
}

.nav_top li,
.nav_top a,
.nav_top span {
  font-size: 2rem;
  color: #333;
}

.nav_top span {
  margin-right: 0.5rem;
}

.nav_top li+li {
  margin-left: 1rem;
}

.nav_top a:hover {
  color: #333;
  font-weight: bold;
}

.nav_top>span {
  font-size: 2.5rem;
  font-weight: bold;
  color: #000;
}

.list>div {
  padding-top: 2rem;
}

.list>div:first-child {
  width: 50rem;
  border-right: 1px solid #ccc;
}

.project_list {
  flex: 1;
  padding: 0 3rem;
  padding-right: 0;
}

.project_list .layui-input-group {
  width: 100%;
  margin: 1rem 0;
}

#articles_list {
  padding-top: 2rem;
}

#list_laypage {
  display: flex;
  justify-content: center;
}

/* 详情页 */
.content {
  margin: 2rem auto;
  padding: 0 20rem;
}

.content>div:first-child {
  padding: 2rem 0;
  text-align: center;
  border-bottom: 1px dashed #ccc;
}

.content>div:first-child>p {
  margin-top: 1rem;
  font-size: 1.8rem;
  color: #999;
}

.content>div:last-child {
  padding-bottom: 6rem;
}

.content>div:last-child span {
  font-size: 1.7rem !important;
}

#content_body {
  padding: 2rem 0;
  min-height: 40rem;
}

#content_body {
  font-size: 2rem;
}

#qtInfo {
  font-size: 1.2rem;
  color: #999;
}

#qtInfo span+span {
  margin-left: 2rem;
}

#subtitle {
  font-size: 1.7rem;
  margin-top: 1rem;
  color: #333;
}


/* 检索页 */
.retrieve_page {
  margin: 2rem auto;
  padding: 0 20rem;
}

.retrieve_page .layui-form-label {
  width: 13rem;
  padding: 0.9rem 1rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 1.8rem;
}

.retrieve_page .layui-input-block {
  margin-left: 13rem;
}

.retrieve_page .layui-inline {
  margin-left: 11rem;
  display: flex;
}

.retrieve_page .layui-input-inline {
  width: 100%;
}

.retrieve_page .layui-form-mid {
  margin: 0 1rem;
  float: none;
}

.tree-select {
  position: relative;
}

.tree-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 42px;
  padding: 5px 0;
  z-index: 999;
  min-width: 100%;
  border: 1px solid #d2d2d2;
  max-height: 300px;
  overflow-y: auto;
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
  box-sizing: border-box;
}

.tree-menu .layui-btn-container {
  margin-top: 1rem;
  padding-top: 1rem;
  display: flex;
  justify-content: end;
  border-top: 1px solid #d2d2d2;
}

.load_more {
  width: 100%;
  padding: 1rem 0;
  margin-bottom: 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ccc;
}

.load_more>p {
  color: red;
}

.load_more .layui-btn {
  font-size: 1.8rem;
}

#articles_table {
  min-height: 40rem;
}

#articles_table th {
  font-size: 1.8rem;
  font-weight: bold;
}

#articles_table td {
  font-size: 1.8rem;
}

.layui-btn-sm {
  font-size: 1.8rem;
}

.layui-laypage a,
.layui-laypage span {
  font-size: 1.8rem;
}