﻿/* latin */
@font-face {
  font-family: 'Handlee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../font/-F6xfjBsISg9aMakPm3wow.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIuaomQNQcsA88c7O9yZ4KMCoOg4Koz4yOqhMva.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIuaomQNQcsA88c7O9yZ4KMCoOg4Koz4yGqhMva.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIuaomQNQcsA88c7O9yZ4KMCoOg4Koz4yCqhMva.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIuaomQNQcsA88c7O9yZ4KMCoOg4Koz4y6qhA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko70yyygA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko50yyygA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko40yyygA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../font/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* 新增表格美化样式 */
.tab-pane1{
   /* display: flex; */
    justify-content: center;
    padding: 15px;
    width: 100%;
    box-sizing: border-box;
}

.tab-pane1 table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}

.tab-pane1 table td,
.tab-pane1 table th {
    padding: 8px 10px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #ddd;
    transition: background-color 0.3s ease;
    font-size: 14px;
    position: relative;
}

/* 第一行、第二行、第三行样式 */
.tab-pane1 table tr:nth-child(1) td,
.tab-pane1 table tr:nth-child(2) td,
.tab-pane1 table tr:nth-child(3) td {
    background-color: #0057ae;
    color: #fff;
    font-weight: 600;
}

/* 第一列样式 */
.tab-pane1 table tr td:first-child {
    background-color: #0057ae;
    color: #fff;
    font-weight: 500;
}

/* 交叉区域优化 */
.tab-pane1 table tr:nth-child(1) td:first-child,
.tab-pane1 table tr:nth-child(2) td:first-child,
.tab-pane1 table tr:nth-child(3) td:first-child {
    background-color: #0057ae;
    font-weight: 700;
}

/* 空白单元格斜杠 */
.tab-pane1 table td:empty,
.tab-pane1 table th:empty {
    position: relative;
}

.tab-pane1 table td:empty:before,
.tab-pane1 table th:empty:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid #ccc;
    border-left: none;
    border-top: none;
    transform: rotate(45deg);
    transform-origin: 0 0;
    opacity: 0.5;
}

/* 其他行样式 */
.tab-pane1 table tr:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):nth-child(even) {
    background-color: #f8f9fa;
}

.tab-pane1 table tr:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):hover {
    background-color: #e6f2ff;
}

/* 响应式适配（精准区分设备） */
/* 手机端（<768px） */
@media (max-width: 767px) {
    .tab-pane {
        padding: 8px;
    }
    
    .tab-pane1 table td,
    .tab-pane1 table th {
        padding: 6px 8px;
        font-size: clamp(10px, 2vw, 12px); /* 手机端字体更小 */
    }
    
    .tab-pane1 table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        position: relative;
    }
    
    /* 滚动提示箭头（右下角） - 优化样式 */
    .tab-pane1 table:after {
        content: "→ 向右滑动查看完整表格";
        position: absolute;
        right: 10px;
        bottom: 12px;
        background: linear-gradient(135deg, #0077e6, #0057ae);
        color: #fff;
        font-size: 12px;
        padding: 4px 10px;
        border-radius: 20px;
        box-shadow: 0 2px 5px rgba(0, 87, 174, 0.3);
        pointer-events: none;
        transition: all 0.3s ease; /* 添加过渡动画 */
    }
}

/* 平板端（768px-1023px） */
@media (min-width: 768px) and (max-width: 1023px) {
    .tab-pane1 table td,
    .tab-pane1 table th {
        font-size: clamp(12px, 1.8vw, 14px); /* 平板端中等字体 */
    }
}

/* 电脑端（≥1024px） */
@media (min-width: 1024px) {
    .tab-pane1 table td,
    .tab-pane1 table th {
        font-size: 14px; /* 电脑端标准字体 */
    }
}