﻿@charset "utf-8";
* {
    margin: 0;
    padding: 0;
}
body{
    /*background-image: url("__STATIC__/youxi/images/bjt.png");*/
    background-repeat: no-repeat;
    background-position: center top;
}
.top-container {
    background-color: #000;
    height: 60px;
}
.header_div{
    margin: 0 auto;
    width: 1300px;
}
.menu-container {
    text-align: center;
    float: right;
}

.logo-container {
    position: absolute;
    color: white;
    line-height: 58px;
    font-weight: bold;
    margin-left: 10px;
}

.logo {
    font-size: 20px;
    margin-left: 10px;
}

.first-menu-container {
    display: inline-block;
    list-style: none;
}

.first-menu {
    line-height: 60px;
    text-align: center;
    float: left;
    margin: 0px 10px;
}

.second-menu {
    float: none;
    background-color: #406ff9;
}

.second-menu a:hover {
    color: white;
    background-color: #0033fc;
}

.second-menu-container {
    position: absolute;
    list-style: none;
    display: none;
}

.first-menu:hover ul {
    font-weight:bold;
}

a {
    text-decoration: none;
    color: white;
    display: block;
    padding: 0 15px;
    white-space: nowrap;
}

a:hover {
    background-color: #0033fc;
}
.center ul{
    height: 480px;
    width: 1350px;
    position: relative;
    overflow: hidden;
    box-shadow:0px 0px 10px #06e2ee;
}
.center ul li{
    display: inline-block;
    position: absolute;
    top: 280px;
    left: -24.5px;
    text-indent: -290px;

    
    font-size: 22px;
    line-height: 10px;
    width: 0px;
    height: 10px;

	border-left: 340px solid red;
    border-top: 59px solid transparent;
    border-right: 400px solid transparent;
    border-bottom: 59px solid transparent;
    color: #FFFFFF;
}
/*.img{
    position: absolute;
    z-index: 100;
    top: 216px;
    left: 236px;
}*/
.tt{
    display: inline-block;
    color: black;
    font-weight: bold;
}
.video-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    text-align: center;
}
 
.video-background video {
    position: absolute; 
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -1;
}
 
.content {
    /*margin-left: 10%;*/
    position: absolute;
    top: 0px;
    bottom: 0px;
    z-index: 1;
    width: 66%;
    margin-left: 17%;
}
.content_shaixuan{
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc((100% - 80px));
}
.nav_tiem{
    height:60px;
    text-align: right;
    line-height: 60px;
    color: #bebebe;
    font-size: 14px;
}
.nav_tiem_style{
    padding: 5px;
    width: 40px;
    height: 40px;
    cursor:pointer;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
    font-weight: 900;
    text-shadow: 2px 2px 4px #000000;
    background-color: rgba(0, 0, 0, 0.5);
}
.nav_tiem_style:hover {
    color: #ffffff;
}
.nav_tiem_style2{
    padding: 5px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    cursor:pointer;
    text-align: center;
    border-radius: 50%;
    font-weight: 900;
    text-shadow: 0 0 0 4px #000000;
    background-color: rgba(0, 0, 0, 0.5);
}
.nav_tiem_style2:hover {
    font-weight: bold;
}
.dengluzhuce{
    height: 60px;
    line-height: 60px;
    color: #bebebe;
    cursor: pointer;
}
.content_so {
    margin: 0 auto;
    /*margin-top: 220px;*/
    width: 100%;
    height: 300px;
    /*border: 1px solid rgba(255, 255, 255, 0);*/
    text-align: center;
    border-radius: 15px;
    box-shadow: 0px -3px 3px 0px #bebebe, 
			-3px 0px 3px 0px #bebebe, 
			3px 0px 3px 0px #bebebe, 
			0px 3px 3px 0px #bebebe;
    border: 1px solid #bebebe;
}
.content_so_logo{
    margin: 0 auto;
    margin-top:40px;
    width: 500px;
    height: auto;
    text-align: center;
    font-size: 24px;
    color: #ffffff;
    font-weight: 600;
}
.content_so_moshi{
    margin: 0 auto;
    margin-top:0px;
    width: 500px;
    height: auto;
    text-align: center;
    font-size: 14px;
    color: #ffffff;
}
.content_so_tishi{
    margin: 0 auto;
    margin-top:10px;
    width: 500px;
    height: auto;
    text-align: center;
    font-size: 14px;
    color: #ffffff;
    font-weight: 600;
}
.content_so_so{
    margin: 0 auto;
    margin-top:30px;
    width: 500px;
    height: 45px;
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #2c9645;
}
#search-input {
  padding: 10px 0px 10px 20px;
  margin: 0px;
  font-size:14px;
  border: 1px solid #ccc;
  border-radius: 10px;
  width: 400px;
  height: 96%;
  border:0px;
  box-sizing: border-box; /* 确保padding不会增加元素的总宽度 */
}
 
#search-input:focus {
  border-color: #0366d6;
  outline: none; /* 移除聚焦时的默认轮廓 */
}
.button {
  background-color: #4CAF50; /* 按钮颜色 */
  border: none;
  color: white;
  padding: 10px 12px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 8px; /* 按钮边缘圆滑 */
}
.button:hover {
  background-color: #45a049; /* 按钮悬停颜色 */
}
.xq_content{
    position: absolute;
    z-index: 1;
    /*margin-top:900px;*/
    width: 100%;
    min-height: 1000px;
    background: #3a3a3a;
    /*display: none;*/
}
.xq_content_nav{
    margin: 20px auto;
    /*width: 1180px;*/
    width: 65%;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    z-index: 2;
    background: #3a3a3a;
}
.nav_style{
    height: 40px;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    color: #ffffff;
}
.grid-demo{
    margin: 0px 5px;
    border: 1px solid #2c9645;
}
.grid-demo:hover {
  background-color: #2c9645; /* 按钮悬停颜色 */
}
.zuoce_fenkai{
    margin:0 auto;width:65%;position: relative;display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 30px;
}
.zuoce_hebing{
    margin:0 auto;width:65%;position: relative;
}
.xq_content_zuoceshangpin{
    margin-top: 10px;
    width: 100%;
    height: auto;
    border-radius: 0px;
    background: #000000;
    overflow: hidden;
    /*border:1px solid #525252;*/
    position: relative;
}
.xq_content_shangpin{
    margin-top: 0px;
    width: 100%;
    min-height: 1500px;
    border-radius: 0px;
    background: #000000;
    overflow: hidden;
    /*border:1px solid #525252;*/
    position: relative;
}

.diagonal-div-left {
    margin-top:40px ;
    width: 300px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    background-color: #409eff;
    transform: rotate(-40deg);
    position: relative;
    left: -88px;
    color: #ffffff;
    text-align: center;
}
.diagonal-div-left1 {
    margin-top: -10px;
    width: 300px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    background-color: #409eff;
    transform: rotate(-40deg);
    position: relative;
    left: -78px;
    color: #ffffff;
    text-align: center;
    z-index: 1;
}
.diagonal-div-left2 {
    margin-top: 10px;
    width: 300px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    background-color: #ff0000;
    transform: rotate(-40deg);
    position: relative;
    left: -118px;
    color: #ffffff;
    text-align: center;
    z-index: 1;
}
.diagonal-div-right{
    margin-top:-50px ;
    width: 300px;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    float: right;
    background-color: #daa520;
    transform: rotate(40deg);
    position: relative;
    right: -88px;
    color: #ffffff;
    text-align: center;
}
.diagonal-div-topimages{
    margin-top:0px;
    width: 100%;
}
.diagonal-div-title{
    margin-top:0px;
    width: 100%;
    text-align: center;
    /*color: #ffffff;*/
    font-size:25px;
    font-weight: 900;
    /*background: linear-gradient(to right, #ff0000, #ffff00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
}
.diagonal-div-tongxingzheng{
    margin: 0 auto;
    margin-top: 30px;
    width: 90%;
    text-align: center;
}
.diagonal-div-zhuangbei{
    margin: 0 auto;
    margin-top: 30px;
    width: 100%;
}
.diagonal-div-zhuangbei-hang{
    margin:10px 0px;
    width: 100%;
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(7, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    /*place-items:center;*/
}
.diagonal-div-zhuangbei-item{
    margin:0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    text-align: center;
    cursor:pointer;
    /*background-image: linear-gradient(141deg,#5f5f5f,#000000);*/
    /*background-image: url('https://oss.xuxug.com/static/images/item_bj.png');*/
    /*background-repeat: no-repeat;
    background-position: center center;
    object-fit: fill;*/
    background-size:100% 100%;
    justify-self: center;
    overflow: hidden;
    border: 1px solid #bebebe;
    background: linear-gradient(to top right, #585858, #000000);
}
.diagonal-div-zhuangbei-item-guilei{
    margin:0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    text-align: center;
    cursor:pointer;
    /*background-image: linear-gradient(141deg,#5f5f5f,#000000);*/
    /*background-image: url('https://oss.xuxug.com/static/images/item_bj.png');*/
    /*background-repeat: no-repeat;
    background-position: center center;
    object-fit: fill;*/
    background-size:100% 100%;
    justify-self: center;
    overflow: hidden;
    border: 1px solid #bebebe;
}
.diagonal-div-zhuangbei-itemedit{
    padding: 0px;
    width: 180px;
    border-radius: 10px;
    text-align: center;
    cursor:pointer;
    background-size:100% 100%;
    justify-self: center;
    overflow: hidden;
    border: 1px solid #bebebe;
}
.zhuangbei_miaoshu{
    width: 100%;
    padding-bottom:10px;
    text-align: center;
    font-size: 14px;
}
.diagonal-div-zhuangbei-item-xie{
    position: absolute;
    margin-top:-80px ;
    width: 120px;
    height: 28px;
    line-height: 28px;
    font-size: 14px;
    float: right;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    transform: rotate(40deg);
    right: -40px;
    text-align: center;
}
.diagonal-div-zhuangbei-addhang{
    margin: 0px;
    width: 100%;
    padding-bottom: 10px;
    min-height: 100px;
    text-align: center;
    display: grid;
    /*grid: auto / repeat(7, 1fr);*/
    grid-template-columns: 20px auto 20px;
    /*place-items:center;*/
    overflow: hidden;
    border-bottom: 1px solid #ffffff;
}
.diagonal-div-zhuangbei-addhang-left{
    margin: 0px;
    width: 100%;
    min-height: 100px;
    text-align: center;
    display: grid;
    grid-template-rows:1fr 1fr 1fr;
    place-items:center;
    color: #ffffff;
    font-size: 24px;
}
.drawing_content_plus {
    width: 15.68333rem;
    height: 2.83333rem;
    background: linear-gradient(121deg, #f5c295, #f8d8b6);
    position: absolute;
    right: 0;
    top: 8.91667rem;
    transform: rotate(45deg);
    transform-origin: 17.58333rem 3.33333rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2rem;
    color: #222437;
    z-index: 1;
}
.goods_card_level_7{
    position: absolute;
    width: 9.16667rem;
    height: 1.4rem;
    font-weight: 400;
    font-size: 1.13333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -2.86667rem;
    top: 1rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_8{
    position: absolute;
    width: 9.16667rem;
    height: 1.6rem;
    font-weight: 400;
    font-size: 1.03333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.56667rem;
    top: 0.7rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_9{
    position: absolute;
    width: 9.16667rem;
    height: 1.5rem;
    font-weight: 400;
    font-size: 0.83333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.36667rem;
    top: 0.6rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_10{
    position: absolute;
    width: 9.16667rem;
    height: 1.5rem;
    font-weight: 400;
    font-size: 0.83333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.36667rem;
    top: 0.5rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_11{
    position: absolute;
    width: 9.16667rem;
    height: 1.3rem;
    font-weight: 400;
    font-size: 0.73333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.5rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_12{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_13{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_14{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_15{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_16{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_17{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.goods_card_level_18{
   position: absolute;
    width: 9.16667rem;
    height: 1.1rem;
    font-weight: 400;
    font-size: 0.53333rem;
    color: #ffffff;
    /*background: linear-gradient(270deg, #5AAFD9, #5AAFD9);*/
    background:#409eff;
    display: flex;
    justify-content: center;
    align-items: center;
    right: -3.86667rem;
    top: 0.3rem;
    z-index: 1;
    transform: rotate(45deg);
}
.zhumo_moshi_item_4{
    margin:2px !important;
    width: calc((100% - 16px) / 4);
    cursor: pointer;
}
.zhumo_moshi_item_5{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 60px) / 5);
    border-radius: 10px;
    border: 1px solid #ffffff;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_5:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_7{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 84px) / 7);
    border-radius: 10px;
    border: 1px solid #ffffff;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_7:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_zuoce7{
    margin:5px !important;
    width: calc((100% - 84px) / 7);
    border-radius: 10px;
    border: 1px solid #ffffff;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_zuoce7:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_8{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 96px) / 8);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_8:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_9{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 108px) / 9);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_9:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_10{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 120px) / 10);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_10:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_11{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 132px) / 11);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_11:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_12{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 144px) / 12);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_12:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_13{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 156px) / 13);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_13:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_14{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 168px) / 14);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_14:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_15{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 180px) / 15);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_15:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_16{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 192px) / 16);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_16:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_17{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 204px) / 17);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_17:hover
{ 
    border: 1px solid #409eff;
}
.zhumo_moshi_item_18{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 216px) / 18);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
    border: 1px solid #ffffff;
    background: linear-gradient(to top right, #585858, #000000);
}
.zhumo_moshi_item_18:hover
{ 
    border: 1px solid #409eff;
}
.zuotu_moshi_item_7{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 84px) / 7);
    border-radius: 10px;
    position:relative;
    cursor: pointer;
    overflow: hidden;
}
.zuotu_moshi_item_8{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 96px) / 8);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_9{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 108px) / 9);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_10{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 120px) / 10);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_11{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 132px) / 11);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_12{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 144px) / 12);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_13{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 156px) / 13);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_14{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 168px) / 14);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_15{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 180px) / 15);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_16{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 192px) / 16);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_17{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 204px) / 17);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zuotu_moshi_item_18{
    margin:5px !important;
    padding-bottom: 10px;
    width: calc((100% - 216px) / 18);
    border-radius: 10px;
    position:relative;
    overflow: hidden;
    cursor: pointer;
}
.zhumo_moshi_item_laji{
    margin:2px !important;
    position:relative;
    overflow: hidden;
    cursor: pointer;
    /*width: calc((100% - 48px) / 24);*/
}
.zhubo_moshi_jiage {
    position: fixed;
    left: 10px;
    top: 600px;
    position: -webkit-sticky; /* Safari */
    overflow: hidden;
    margin: 0;
    min-width: 100px;
    height: auto;
    z-index: 3;
    font-size: 30px;
    color: #ffffff;
}
.gujia_zhezhaoceng {
    position: fixed; /* 或 absolute，取决于布局需求 */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.5); /* 半透明背景 */
    z-index: 3; /* 确保遮罩层在内容之上 */
    display: flex;
    flex-direction:column;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
}
 
.pinggu_putong {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_putong.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.pinggu_teshu {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_teshu.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.pinggu_xiyou {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_xiyou.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.pinggu_jingying {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_jingying.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.pinggu_shishi {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_shishi.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.pinggu_chuanshuo {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 700px;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('https://oss.xuxug.com/static/images/pinggu_chuanshuo.png'); /* 背景图片路径 */
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.gujia_content_wenzi{
    transform: rotate(-18deg);
    /* 可能还需要调整文字的位置，确保它在旋转后仍然在容器内部 */
    position: relative;
    color: #ffffff;
    font-size: 60px;
}
.denglu_zhezhaoceng {
    position: fixed; /* 或 absolute，取决于布局需求 */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.9); /* 半透明背景 */
    z-index: 3; /* 确保遮罩层在内容之上 */
    display: flex;
    flex-direction:column;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
}
 
.denglu_content {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 800px;
    height: 400px;
    border-top-right-radius:1em;
    border-bottom-left-radius:1em;
    display: list-item;
    flex-direction:column;
    /*background-image: url('https://oss.xuxug.com/static/images/denglubeijing.png');*/
    background-image: url('https://oss.xuxug.com/static/images/denglubeijing_002.png'); /* 背景图片路径 */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.denglu_right{
    padding: 10px;
    width: 260px;
    height: 320px;
    float: right;
    border-radius: 10px;
    position: relative;
    right: 30px;
    top: 5px;
    background-color: rgba(71, 74, 85, 0.1);
}
.open_all_piaofu_zhuangbei {
    position: fixed;
    bottom: 150px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
    z-index: 1000;
    cursor:pointer;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    background:#67C23A;
  }
  .open_all_piaofu {
    position: fixed;
    bottom: 50px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
    z-index: 1000;
    cursor:pointer;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    background:#409eff;
  }
  .wangzhan_duijie_piaofu {
    position: fixed;
    top: 50px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 12px;
    color: #ffffff;
    z-index: 1000;
    cursor:pointer;
    background-color: #3498db;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    background: rgba(52, 152, 219, 0.3);
  }
  .backToTop {
    position: fixed;
    bottom: 20px;
    right: 255px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    display: block;
    z-index: 99;
    width: 50px;
    height: 50px;
    line-height: 45px;
    font-size: 28px;
    text-align: center;
}
.backToTop:hover {
  background-color: #0056b3;
}
.zuoce_xuanfu{
    position: fixed;
    top: 154px;
    left: 30px;
    width: auto;
    height: auto;
    z-index: 3;
}
.edit_zhuangbei {
    overflow: hidden;
    margin: 0px 0px 5px 0px;
    width: 250px;
    min-height: 600px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.dakai_zhuangbei_list {
    overflow: hidden;
    margin: 5px 0px;
    width: 250px;
    height: auto;
}
.pinggu_zhuangbei {
    overflow: hidden;
    margin: 5px 0px;
    width: 250px;
    height: 240px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.pinggu_lishi {
    overflow: hidden;
    margin: 5px 0px;
    width: 250px;
    height: 300px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.youce_xuanfu{
    position: fixed;
    top: 154px;
    right: 30px;
    width: auto;
    height: auto;
    z-index: 3;
}
.sucaiqu {
    overflow: hidden;
    margin: 0px 0px 5px 0px;
    width: 250px;
    height: 480px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.pinggu_kefu {
    margin: 5px 0px;
    overflow: hidden;
    width: 250px;
    height: 200px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.kefu_pinggu_lishi {
    overflow: hidden;
    margin: 5px 0px;
    width: 250px;
    height: 300px;
    border-radius: 10px;
    z-index: 3;
    background-color: rgba(71, 74, 85, 0.9);
}
.xinshou_zhidao_zhezhaoceng {
    position: fixed; /* 或 absolute，取决于布局需求 */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.9); /* 半透明背景 */
    z-index: 3; /* 确保遮罩层在内容之上 */
    display: flex;
    flex-direction:column;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
}
 
.xinshou_zhidao_content {
    position: relative; /* 确保内容在遮罩层之上 */
    z-index: 4;
    width: 800px;
    height: 400px;
    border-top-right-radius:1em;
    border-bottom-left-radius:1em;
    display: list-item;
    flex-direction:column;
    /*background-image: url('https://oss.xuxug.com/static/images/denglubeijing.png');*/
    background-image: url('https://oss.xuxug.com/static/images/denglubeijing_002.png'); /* 背景图片路径 */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.zuoce_fenlei_zhuangbei {
    overflow: hidden;
    margin: 0px 0px 5px 0px;
    width: 240px;
    height: 750px;
    border-radius: 10px;
    background-color: rgba(71, 74, 85, 0.9);
}
.zuoce_fenlei_neirong{
    margin:0px;
    width: 100%;
    height: 418px;
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 3px;
    grid-row-gap: 3px;
    overflow-y: scroll;
}