/* 主容器：添加相对定位 */
.ziFirstMain {
    width: 1200px;
    height: 190px;
    background: #F0EFE2;
    margin-top: 20px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    padding: 20px;
    padding-left: 30px;
    box-sizing: border-box;
    position: relative; /* 👈 关键：为内部绝对定位提供参照 */
}

/* ========== 左侧字框：带米字格虚线 ========== */
.ziKuangLeft {
    width: 120px;
    height: 120px;
    background: #FBFAF6;
    border: 2px solid #5D6146;
    border-radius: 6px;
    position: relative;
    text-align: center;
    cursor: pointer;
}

/* 中心汉字 */
.ziStyle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: KaiTi, serif;
    font-size: 86px;
    color: #0F0F0F;
    z-index: 2;
    pointer-events: none;
}

/* ========== 米字格：使用 SVG 内联确保虚线可见 ========== */
.mizi-grid {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIwIiBoZWlnaHQ9IjEyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxsaW5lIHgxPSIwIiB5MT0iNjAiIHgyPSIxMjAiIHkyPSI2MCIgc3Ryb2tlPSIjNUQ2MTQ2IiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1kYXNoYXJyYXk9IjIsMiIvPgogICAgPGxpbmUgeDE9IjYwIiB5MT0iMCIgeDI9IjYwIiB5Mj0iMTIwIiBzdHJva2U9IiM1RDYxNDYiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWRhc2hhcnJheT0iMiwyIi8+CiAgICA8bGluZSB4MT0iMCIgeTE9IjAiIHgyPSIxMjAiIHkyPSIxMjAiIHN0cm9rZT0iIzVENjE0NiIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtZGFzaGFycmF5PSIyLDIiLz4KICAgIDxsaW5lIHgxPSIwIiB5MT0iMTIwIiB4Mj0iMTIwIiB5Mj0iMCIgc3Ryb2tlPSIjNUQ2MTQ2IiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1kYXNoYXJyYXk9IjIsMiIvPgo8L3N2Zz4=");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index: 1;
    pointer-events: none;
}

/* ========== 图标：紧贴右上角 ========== */
.icon-bg {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 32px;
    height: 32px;
    z-index: 3;
    /*border-bottom-left-radius: 6px;*/
    object-fit: cover;
}

.icon-top {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 9px;
    height: 12px;
    z-index: 4;
    object-fit: cover;
}

/* ========== 右侧信息区 ========== */
.ziInfoRight {
    flex: 1;
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 10px 0;
    box-sizing: border-box;
}

/* 拼音行 */
.pinyinRow {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.pinyinKuang {
    display: inline-flex;
    align-items: center;
    background: #E9E8DC;
    border-radius: 30px;
    padding: 4px 12px;
    height: 28px;
    line-height: 28px;
    cursor: pointer;
}

.pingyinStr {
    font-family: "Microsoft YaHei", sans-serif;
    font-size: 14px;
    color: #666666;
    margin-right: 6px;
}

.pinyinKuang img {
    height: 20px;
    width: auto;
    vertical-align: middle;
    cursor: pointer;
}

/* 信息网格：每行3个，横向排列 */
.infoGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

/* 单个信息项：横向排列 label + (value + underline) */
.infoItem {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0; /* 允许收缩 */
}

.dinyi {
    font-family: "Microsoft YaHei", sans-serif;
    color: #666666;
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 14px;
}

/* 值和下划线组合：垂直对齐 */
.dinyiZhiContainer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-size: 14px;
}

.dinyiZhi {
    font-family: "Microsoft YaHei", sans-serif;
    color: #0F0F0F;
    margin-bottom: 2px;
}

.underline {
    width: 120px;
    height: 0;
    border-top: 1px dashed #DAD9D1;
}

.wanshan {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 40px;
    height: 22px;
    border-radius: 5px;
}

    .wanshan a {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        background: #E9E8DC;
        color: #999999;
        font-family: "Microsoft YaHei", sans-serif;
        font-size: 12px;
        text-align: center;
        text-decoration: none;
        border-radius: 5px;
        line-height: 1;
        white-space: nowrap;
    }

.content {
    width: 1200px;
    height: auto;
    background: #F0EFE2;
    margin-top: 20px;
    border-radius: 4px 4px 4px 4px;
}

.content_title {
    height: 24px;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 18px;
    color: #5D6146;
    line-height: 24px;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-top: 20px;
}

.shiyiContent {
    width: 1160px;
    min-height: 21px;
    margin-top: 40px;
    margin-left: 20px;
}

/* 第一行：序号 + 词性 + 解释 */
.line1 {
    display: flex;
    align-items: flex-start; /* 顶部对齐，不是居中 */
    min-width: 0;
    line-height: normal;
    margin-bottom: 8px;
}

.xuhao {
    font-weight: 700;
    color: #0F0F0F;
    font-size: 16px;
    line-height: 24px; /* 增加行高 */
    margin-right: 8px;
    flex-shrink: 0;
    text-align: left; /* 数字右对齐，更美观 */
}

.cixing.inline-block {
    display: inline-flex;
    align-items: center;
    height: 22px;
    background: #E9E8DC;
    border-radius: 6px;
    margin-right: 8px;
    flex-shrink: 0;
}

.cixingContent {
    padding: 0 8px;
    font-size: 14px;
    color: #666666;
    line-height: 18px;
    white-space: nowrap;
}

.jieshi {
    font-weight: 700;
    color: #0F0F0F;
    font-size: 16px;
    line-height: 24px; /* 行距加大 */
    word-break: break-word;
    flex: 1;
    min-width: 0;
    padding-left: 28px; /* 关键：左内边距 = 序号宽 + 间隔 */
    margin-left: -28px; /* 向左拉回，形成悬挂效果 */
    display: block;
}

/* 第二行：词语列表 */
.line2 {
    margin-bottom: 8px;
}

.zuci {
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
}

/* 第三行：例句 */
.line3 {
    margin-bottom: 12px;
}

.liju {
    font-size: 16px;
    color: #666666;
    line-height: 21px;
}

.lijuKey {
    color: #A32A2A;
    font-weight: 400;
}

.more {
    width: 100%;
    height: 45px;
    background: #F0EFE2;
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
}

    .more a {
        display: flex;
        align-items: center;
        color: #19537D;
        text-decoration: none;
    }

.zhankaiQuanwen {
    font-family: 'Microsoft YaHei', Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #19537D;
    line-height: 21px;
}

.shiyiPinyinWrapper {
    margin-top: 50px; /* 距离上一个块（标题）50px */
}

.shiyiPinyin {
    display: inline-block;
    height: 21px;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #6A6D55;
    line-height: 21px;
    margin-left: 20px;
}
/* 每条引证为一个独立块，自动换行 */
.yinzheng-item {
    display: block;
    /*margin-bottom: 12px; /* 条目之间留空 */
    line-height: 32px;
}

.zuci,
.sourceYinzheng {
    vertical-align: middle;
}

.zhu {
    width: 20px;
    height: 20px;
    background: rgba(202, 158, 74, 0.2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    margin-left: 2px;
    border-radius: 10px;
    box-sizing: border-box;
}

    .zhu a {
        font-family: 'Microsoft YaHei', sans-serif;
        font-weight: 400;
        font-size: 14px;
        color: #999999;
        text-decoration: none;
    }

    /* 激活状态：背景和文字都变 */
    .zhu.zhushi-active {
        background: #CA9E4A;
    }

        .zhu.zhushi-active a {
            color: #FFFFFF;
        }

.sourceYinzheng {
    height: 18px;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    line-height: 18px;
    margin-left: 4px;
    vertical-align: middle;
}

/* 注释块：上下居中 + 左对齐 */
.yinzheng-zhushi-content {
    /*background: rgba(202, 158, 74, 0.1);*/
    border-radius: 6px;
    display: flex;
    align-items: center; /* 垂直居中 */
    justify-content: flex-start; /* 左对齐 */
    box-sizing: border-box;
    margin: 8px 0;
    transition: all 0.2s ease;
}

/* 默认隐藏 */
.hidden {
    display: none !important;
}

.yinzheng-zhushi-content .zhushiContent {
    font-family: 'Microsoft YaHei', sans-serif;
    width: 100%;
    background: rgba(202, 158, 74, 0.1);
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    line-height: 36px;
    padding-left: 10px;
}
/* 每组“近义/反义”作为独立块 */
.jinyi-item,
.fanyi-item {
    display: block;
    margin-bottom: 8px; /* 上下间距 */
}

.jinyiziTitle {
    width: 42px;
    height: 18px;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    line-height: 18px;
    vertical-align: middle;
    margin-right: 8px;
}

.jinyiziContent {
    position: relative;
    display: inline-block; /* 关键：让内部 .underline 受控 */
    vertical-align: middle;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
}

    /* 内容下方的虚线 */
    .jinyiziContent .underline {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0; /* 贴在文字底部 */
        height: 0;
        border-top: 1px dashed #DAD9D1;
        min-width: 200px; /* 最小宽度 200px */
        width: auto; /* 自动撑开到内容宽度 */
    }
.play-pinyin-img {
    width: 24px;
    height: 24px;
    object-fit: cover;
}

    .play-pinyin-img.playing {
        animation: scanLoop 1.0s ease-in-out infinite;
    }

@keyframes scanLoop {
    0% {
        clip-path: inset(0 100% 0 0); /* 完全隐藏（右边留 0%，左边裁掉 100%）*/
    }

    50% {
        clip-path: inset(0 50% 0 0); /* 显示左半边（50% 宽度）*/
    }

    100% {
        clip-path: inset(0 0 0 0); /* 完全显示 */
    }
}
.kangxiType {
    /* 关键：内联弹性布局，宽度包裹内容 */
    display: inline-flex;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    /* 内边距：左右各 2.5px → 总宽 = 文字宽 + 5px */
    padding: 0 4px;
    /* 控制高度和行高匹配 */
    min-height: 24px;
    line-height: 24px; /* 与 min-height 匹配，辅助居中 */
    /* 背景和圆角 */
    background: rgba(202,158,74,0.4);
    border-radius: 12px 12px 12px 0px;
    /* 外边距保持不变 */
    margin-left: 20px;
    margin-top: 40px;
    /* 防止换行 */
    white-space: nowrap;
    /* 盒模型包含 padding */
    box-sizing: border-box;
}

.kangxiType2 {
    /* 关键：内联弹性布局，宽度包裹内容 */
    display: inline-flex;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    /* 内边距：左右各 2.5px → 总宽 = 文字宽 + 5px */
    padding: 0 4px;
    /* 控制高度和行高匹配 */
    min-height: 24px;
    line-height: 24px; /* 与 min-height 匹配，辅助居中 */
    /* 背景和圆角 */
    background: rgba(86,131,100,0.3);
    border-radius: 12px 12px 12px 0px;
    /* 外边距保持不变 */
    margin-left: 20px;
    margin-top: 40px;
    /* 防止换行 */
    white-space: nowrap;
    /* 盒模型包含 padding */
    box-sizing: border-box;
}

.kangxiTypeName {
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 24px; /* 与父元素一致，确保居中 */
    text-align: justify;
}

.kangxiContent {
    display: block; /* 关键：变成块级元素，自动换行 */
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    text-align: left;
    margin-left: 20px;
    margin-top: 14px;
}

.kangxiContent2 {
    display: block; /* 关键：变成块级元素，自动换行 */
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    text-align: left;
    margin-left: 20px;
    margin-top: 14px;
}

.shuowenNameStr {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.shuowenAuthor {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    line-height: 18px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.shuowen-header {
    display: flex;
    align-items: center; /* 垂直居中 */
    gap: 8px; /* 中间留空 */
    margin-left: 20px;
    margin-top: 50px;
}
/* 整体行容器：左右分布，垂直居中 */
.shuowen-content-row {
    display: flex;
    align-items: center; /* 核心：让图片和文字垂直居中对齐 */
    gap: 16px; /* 图文间距 */
    margin: 16px 0;
    padding: 0 20px;
}

/* 图片容器 */
.shuowen-img-container {
    width: 66px;
    height: 66px;
    background: #DAD9D1;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 文本容器 */
.shuowen-text-container {
    flex: 1;
    min-width: 0; /* 允许收缩，避免溢出 */
}

.shuowenContentTxt {
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    text-align: justify;
    line-height: 32px;
}

.shuowen-tuozhan {
    margin-left: 20px;
    margin-top: 15px;
}

.shuowenTuozhan {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    line-height: 21px;
    text-align: justify;
    font-style: normal;
    text-transform: none;
}

.youLike {
    width: 72px;
    height: 24px;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: #0F0F0F;
    line-height: 24px;
    text-align: left;
    margin-left: 6px;
}
.main3_1 {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 20px;
    gap: 20px; /* 上下行之间的间距 */
    align-items: center; /* 水平居中 */
    min-height: calc(342px + 20px);
    box-sizing: border-box;
}

.row {
    display: flex;
    gap: 20px; /* 横向间隔 */
}

.block {
    width: 285px;
    height: 342px;
    background-color: #F0EFE2;
    border: 1px solid #ddd;
    border-radius: 8px;
    position: relative; /* 启用绝对定位子元素 */
    box-sizing: border-box;
    padding: 0;
    overflow: hidden;
}

/* 内容垂直居中容器（可选） */
.block-content {
    position: absolute;
    top: 40px; /* nameStr 起始位置 */
    left: 0;
    right: 0;
    text-align: center; /* 水平居中所有内联/内联块内容 */
}

.nameStr {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 20px;
    color: #5D6146;
    line-height: 26px;
    text-align: center; /* 水平居中文字 */
    margin: 0 auto; /* 居中块级元素 */
    width: fit-content;
    max-width: 90%;
}

.pinyinKuang2 {
    margin-top: 20px; /* 距离 .nameStr 12px */
    display: inline-block;
    background: #E9E8DC;
    border-radius: 30px;
    padding: 4px 12px; /* 让框自适应文字 */
    height: 28px;
    line-height: 28px;
    text-align: center;
    cursor: pointer;
}

.pingyinStr2 { /* 兼容两个类名 */
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    line-height: 18px;
    text-align: center;
    white-space: nowrap;
}

.pinyinKuang2 img {
    vertical-align: middle;
    height: 20px; /* 可选：控制图标大小 */
    width: auto; /* 保持比例 */
    margin-left: 6px; /* 可选：与文字之间加点间距 */
}

.jieshi2 {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 32px;
    text-align: justify;
    margin-top: 20px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    /* 注意：text-align: justify 需要配合文本换行才有效 */
}

.viewDetail {
    position: absolute;
    bottom: 18px; /* 离底部 18px */
    left: 0;
    right: 0;
    text-align: center;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 12px;
    color: #666666;
    line-height: 16px;
    cursor: pointer;
}

    .viewDetail img {
        width: 10px;
        height: 14px;
        margin-left: 4px;
        vertical-align: middle;
    }
/* 主容器 */
.ciFirst {
    width: 1200px;
    margin-top: 20px;
    background: #F0EFE2;
    padding-bottom: 20px;
    padding-top: 40px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px 4px 4px 4px;
}

/* 容器：水平居中 + 换行 + 行间距10px + 列无间隙 */
.zi-grid-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* 整体水平居中 */
    align-items: flex-start;
    /* ✅ 关键：只在垂直方向加 10px 间距，水平为 0 */
    row-gap: 10px;
    column-gap: 0;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

.cidianPinyin,
.fanti-section {
    text-align: center; /* 子元素居中 */
    margin: 0 auto;
    max-width: 1200px;
    box-sizing: border-box;
}


/* 单个米字格：紧贴排列，共用边框 */
.zi-kuang {
    width: 72px;
    height: 72px;
    /* 🔥 关键：只保留 左、上、下 边框，去掉右边框 */
    border-left: 1px solid #5D6146;
    border-top: 1px solid #5D6146;
    border-bottom: 1px solid #5D6146;
    border-right: none; /* 去掉右边框 */
    /* 背景：米字格 SVG */
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzIiIGhlaWdodD0iNzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8bGluZSB4MT0iMCIgeTE9IjMyIiB4Mj0iNzIiIHkyPSIzMiIgc3Ryb2tlPSIjNUQ2MTQ2IiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1kYXNoYXJyYXk9IjIsMiIvPgogICAgPGxpbmUgeDE9IjMyIiB5MT0iMCIgeDI9IjMyIiB5Mj0iNzIiIHN0cm9rZT0iIzVENjE0NiIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtZGFzaGFycmF5PSIyLDIiLz4KICAgIDxsaW5lIHgxPSIwIiB5MT0iMCIgeDI9IjcyIiB5Mj0iNzIiIHN0cm9rZT0iIzVENjE0NiIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtZGFzaGFycmF5PSIyLDIiLz4KICAgIDxsaW5lIHgxPSIwIiB5MT0iNzIiIHgyPSI3MiIgeTI9IjAiIHN0cm9rZT0iIzVENjE0NiIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtZGFzaGFycmF5PSIyLDIiLz4KPC9zdmc+");
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #F0EFE2;
    /* 内容居中 */
    display: flex;
    align-items: center;
    justify-content: center;
    /* 防止被压缩 */
    flex: 0 0 auto;
    position: relative;
}

    .zi-kuang.is-last-in-row {
        border-right: 1px solid #5D6146 !important;
    }

/* 字体样式 */
.cidianNameStr {
    font-family: 'KaiTi', serif;
    font-weight: 400;
    font-size: 54px;
    color: #0F0F0F;
    line-height: 1;
    z-index: 2;
}

/* 拼音区域：横向排列拼音框 */
.cidianPinyin {
    margin: 20px auto;
    text-align: center;
}
/* 繁体整体区域：左右结构 */
.fanti-section {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 20px auto;
}

/* 左侧标签 */
.ciyuDinyi {
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    line-height: 18px;
    white-space: nowrap;
}


/* 包裹繁体字及其下划线的容器 */
.fanti-content-wrapper {
    position: relative;
    display: inline-block;
    /* 注意：这里不设 width，让内容决定 */
}
    /* 关键：让 span 成为块级内联元素，撑出宽度 */
    .fanti-content-wrapper span {
        font-family: 'Microsoft YaHei', sans-serif;
        font-weight: 400;
        font-size: 14px;
        color: #0F0F0F;
        line-height: 1.4;
        /* 必须设置为 inline-block 才能加伪元素定位 */
        display: inline-block;
        position: relative;
        padding: 0 4px;
        background-color: #F0EFE2;
        z-index: 2;
    }

        /* 添加一条“明显”的虚线，在文字正下方 */
        .fanti-content-wrapper span::after {
            content: '';
            position: absolute;
            left: 4px; /* 与 padding 左右对齐 */
            right: 4px;
            bottom: -1px; /* 紧贴文字底部下方一点点 */
            /* 明显的虚线样式 */
            border-bottom: 1px dashed #DAD9D1; /* 加粗 + 深色 + 虚线 */
            pointer-events: none;
            z-index: 1;
        }
.chengyuShiyi {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 18px;
    color: #0F0F0F;
    line-height: 24px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.chengyuBaobian {
    width: 40px;
    height: 22px;
    background: #E9E8DC;
    border-radius: 8px 8px 8px 8px;
}

.baobianStr {
    height: 18px;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #666666;
    line-height: 18px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.chengyuDinyi {
    width: 56px;
    min-width: 56px;
    max-width: 56px;
    flex: 0 0 56px;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666666;
    line-height: 21px;
    text-align: left;
    white-space: nowrap;
    display: flex;
    align-items: center; /* 垂直居中 */
    height: 21px; /* 匹配 line-height */
}

.chengyuShiyi {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.chengyuShiyiContent {
    position: relative;
    flex: 1;
    font-family: 'Microsoft YaHei', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 21px;
    margin-right: 20px;
}

.chengyuBaobian-inline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 22px;
    background: #E9E8DC;
    border-radius: 8px;
    margin-left: 8px;
    font-size: 0;
}

    .chengyuBaobian-inline .baobianStr {
        font-family: Microsoft YaHei, sans-serif;
        font-weight: 400;
        font-size: 14px;
        color: #666666;
        line-height: 18px;
    }
/* 近义词、反义词、同义异形 容器 */
.chengyuJinyi {
    display: flex;
    align-items: flex-start;
    margin-top: 12px;
    margin-left: 20px;
}

    .chengyuJinyi .underline {
        position: absolute;
        left: 0;
        bottom: 0px;
        border-bottom: 1px dashed #CBCBCB;
        pointer-events: none;
        min-width: 200px;
        max-width: 1100px;
        width: auto;
    }

.dianguContent {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #0F0F0F;
    line-height: 32px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.chengyuSource {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #999999;
    line-height: 32px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}