/* baseBox1 类 */
.baseBox1 {
    position: relative; /* 相对定位，以便子元素绝对定位 */
    float: ri; /* 浮动到左边 */
    width: 100%; /* 宽度设置为48.8% */
    height: 22.3%; /* 高度设置为32.3% */
    /* border: 1px solid #6176AF; 边框颜色和厚度 */
    background: rgba(11, 21, 44, 0.60); /* 背景颜色为半透明的深色 */
    border-radius: 5px; /* 圆角边框 */
    margin-bottom: 15px; /* 底部外边距 */
    height: 35%; /* 高度设置为40% */
}

/* hardware 类 */
.hardware {
    width: 100%; /* 宽度设置为100% */
    height: 100%; /* 高度自动调整以保持宽高比 */
}

.csbaseBox1 {
    padding: 10px; /* 内边距 */
    position: relative; /* 相对定位 */
}

/* boxTitle 类 */
.boxTitle {
    /* padding: 10px; 内边距 */
    /* background-color: #e0e0e0; 背景颜色  */
    border-radius: 4px; /* 边框圆角 */
    /* border: 1px solid #ccc; 边框颜色 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 阴影效果 */
    margin-top: 60px; /* 顶部外边距 */
    /* margin-bottom: 10px; 底部外边距 */
    text-align: center; /* 文本居中 */
    font-size: 1.2vw; /* 字体大小 */
    color: #fff; /* 文本颜色 */

}

.boxLis {
    display: flex;
    justify-content: space-around;
    padding: 10px; /* 增加内边距 */
    margin: 10px; /* 增加外边距 */
    position: relative; /* 如果需要定位 */
    top: -45px; /* 相对于正常位置向下移动 */
    left: 85px; /* 相对于正常位置向右移动 */
    font-size: 0.8vw; /* 调整字体大小 */
}


.boxLis li {
    width:100px;
    height: 25px;
    padding: 5px;
    margin-bottom: 5px;
    background-color: #3230a5;
    border: 1px solid #3230a5;
    cursor: pointer;
    transition: background-color 0.3s;
    text-align: center; /* 将文本居中对齐 */
    line-height: 0.5; /* 行高，调整字体垂直对齐 */
}

.boxLis li:hover {
    background-color: #234e9f;
    color: #3230a5;
}

.boxLis li.active {
    background-color: #007bff;
    color: #3230a5;
}


.equipment_pic img {
    display: none; /* 隐藏所有图片 */
}

.equipment_pic img.active {
    display: block; /* 显示当前激活的图片 */
}

.equipment_pic img {
    display: none; /* 默认隐藏所有图片 */
}

.boxTitle {
    font-size: 1.2vw; /* 调整字体大小 */
    width: 100%; /* 设置标题宽度为100% */
    margin-bottom: 1vw; /* 添加底部外边距 */
    text-align: center; /* 文本居中 */
    color: #fff; /* 设置文本颜色为白色 */
}


.boxLis li:nth-child(4) {
    margin-right: 0; /* 去掉右边距，使其对齐到容器边缘 */
}

/* contList 类 */
.contList {
    display: block; /* 显示为块级元素 */
    position: relative; /* 相对定位，以便绝对定位子元素 */
}

/* equipment_pic 类 */
:root {
    --offset: -20px; /* 调整垂直方向整体的偏移 */
    --global-left-offset: 10px; /* 整体左移偏移量，正值表示右移，负值表示左移 */
    --global-top-offset: -10px; /* 整体上移偏移量，正值表示下移，负值表示上移 */
}

/* equipment_pic 类 */
.equipment_pic {
    position: relative; /* 相对定位 */
    width: 100%;        /* 宽度设置为100% */
    height: 100%;       /* 高度设置为100% */
    background-color: #031426; /* 背景颜色设置为深蓝色 */
}

.equipment_pic img {
    position: absolute;
    top: var(--offset); /* 使用全局垂直偏移 */
    left: var(--global-left-offset); /* 使用全局左移偏移量 */
    right: 0;
    bottom: 0;
    width: 80%;  /* 图片宽度设置为容器宽度的80% */
    height: 80%; /* 图片高度设置为容器高度的80% */
}

/* 四个角描边 */
.leftTopLine1,
.leftTopLine2,
.rightTopLine1,
.rightTopLine2,
.leftBottomLine1,
.leftBottomLine2,
.rightBottomLine1,
.rightBottomLine2 {
    position: absolute; /* 绝对定位 */
    background: #0efcff; /* 背景颜色设置为青色 */
}

.leftTopLine1 {
    top: calc(var(--offset) + var(--global-top-offset)); /* 使用全局偏移 */
    left: calc(-1px + var(--global-left-offset)); /* 使用全局左移偏移量 */
    height: 1vw;
    width: 2px;
}

.leftTopLine2 {
    top: calc(var(--offset) - 1px + var(--global-top-offset)); /* 使用全局偏移 */
    left: calc(0px + var(--global-left-offset)); /* 使用全局左移偏移量 */
    height: 2px;
    width: 1vw;
}

.rightTopLine1 {
    top: calc(var(--offset) + var(--global-top-offset)); /* 使用全局偏移 */
    right: -1px;
    height: 1vw;
    width: 2px;
}

.rightTopLine2 {
    top: calc(var(--offset) - 1px + var(--global-top-offset)); /* 使用全局偏移 */
    right: 0;
    height: 2px;
    width: 1vw;
}

.leftBottomLine1 {
    bottom: calc(var(--offset) + var(--global-top-offset)); /* 使用全局偏移 */
    left: calc(-1px + var(--global-left-offset)); /* 使用全局左移偏移量 */
    height: 1vw;
    width: 2px;
}

.leftBottomLine2 {
    bottom: calc(var(--offset) - 1px + var(--global-top-offset)); /* 使用全局偏移 */
    left: calc(0px + var(--global-left-offset)); /* 使用全局左移偏移量 */
    height: 2px;
    width: 1vw;
}

.rightBottomLine1 {
    bottom: calc(var(--offset) + var(--global-top-offset)); /* 使用全局偏移 */
    right: -1px;
    height: 1vw;
    width: 2px;
}

.rightBottomLine2 {
    bottom: calc(var(--offset) - 1px + var(--global-top-offset)); /* 使用全局偏移 */
    right: 0;
    height: 2px;
    width: 1vw;
}

.tit04 {
    font-size: 40px; /* 你可以根据需要调整这个值 */
    color: #c03d3d;  /* 设置文本颜色为深红色 */
}