page {
    /* 主要颜色 */
    --color-red: #c40311;
    --color-red-1: #bd1a2d;
    --color-orange: #fa6400;
    --color-blue: #2b99ff;

    /* 浅色 */
    --color-red-light: #c40311;
    --color-orange-light: #fff6f0;
    --color-blue-light: #e1f0ff;

    /* 灰色阶 */
    --color-black: #000;
    --color-gray-1: #333;
    --color-gray-2: #666;
    --color-gray-3: #999;
    --color-gray-4: #ccc;
    --color-gray-5: #e6e6e6;
    --color-gray-6: #eee;
    --color-gray-7: #f5f5f5;
    --color-gray-8: #f8f8f8;
    --color-white: #fff;

    /* rpx均以1242宽度为基准转换 */

    /* 水平间距 */
    --h-spacing-md: 30.797rpx; /** 51 px **/
    --h-spacing-sm: 18.116rpx; /** 30 px **/

    /* 垂直间距 */
    --v-spacing-xl: 72.464rpx; /** 120 px **/
    --v-spacing-lg: 54.348rpx; /** 90 px **/
    --v-spacing-md: 36.232rpx; /** 60 px **/
    --v-spacing-sm: 25.362rpx; /** 42 px **/
    --v-spacing-xs: 18.116rpx; /** 30 px **/
    --v-spacing-xxs: 14.493rpx; /** 24 px **/

    /* 字体大小 */
    --font-size-lg: 39.855rpx; /* 66 px */
    --font-size-md: 32.609rpx; /* 54 px */
    --font-size-sm: 28.986rpx; /* 48 px */
    --font-size-xs: 25.36rpx;  /* 42 px */
    --font-size-xms: 21.739rpx; /* 36 px */

    /* 行高 */
    --line-height-lg: 39.855rpx; /* 66 px */
    --line-height-xs: 25.36rpx; /* 42 px */

    /* tab */
    --tabs-height: 88.768rpx; /* tab栏高度  88.768rpx*/
    --tabs-border-radius: 2.415rpx; /* 底部指示器圆角 2.415rpx*/
    --tabs-indicator-width: 57.971rpx; /* 底部指示器宽度 57.971rpx */
    --tabs-indicator-height: 4.831rpx; /* 底部指示器高度 4.831rpx */

    /* tab-item */
    --tab-item-height: 88.768rpx;

    /* list */
    --top-border-color: #f5f5f5;
    --top-border-height: 18.116rpx; /* 30 px*/
    --bottom-border-color: #f5f5f5;
    --bottom-border-height: 18.116rpx; /* 30 px*/

    /* 圆角 */
    --border-radius-md: 18.116rpx; /* 30 px */
    --border-radius-xs: 9.058rpx; /* 15 px */
}

.navigate-list-item {
    padding: var(--gap-xl, 30.797rpx) var(--gap-xl, 30.797rpx);
    border-bottom: solid var(--gap-line, 1px) #eee;
    display: flex;
    justify-content: space-between;
}

.navigate-list-item-hover {
    opacity: .5;
}

.navigate-list-item .arrow-right {
    background: url(./src/common/imgs/arrow-right.png) center/contain;
    height: 36.232rpx;
    width: 36.232rpx;
}

.preview-caption {
    padding: var(--v-spacing-sm, 36.232rpx);
    color: #999;
}

.preview-section {
    background-color: #fff;
}