@charset "UTF-8";
/* ============================================================================
 * 自定义图标（不依赖 iconfont.cn，用 CSS mask 直接引用 SVG）
 *
 *   样式：本文件
 *   SVG ：templates/dist/image/custom-icons/*.svg
 *   说明：templates/dist/image/custom-icons/README.md ← 新增图标看它
 *
 * 新增一个图标，本文件只需【在下面 3 处列表里各加一个类名】：
 *     1) 基础规则的选择器列表
 *     2) 选中态（min-width:1025px）的选择器列表
 *     3) 小屏（max-width:1024px）的选择器列表
 *   类名规则：icon-<svg 文件名>（不含 .svg），与 templates/dist/image/custom-icons/ 对应。
 *   各图标的后台码点见 README.md。
 * ========================================================================== */


/* -- 基础样式（所有自定义图标共用）-----------------------------------------
 * 这些声明都不能省，原因见 README 的「常见坑」一节：
 *   - 尺寸写死 rem，不要用 1em
 *   - 颜色必须用 !important 指定，不能用 currentColor
 *   - 藏字符用 text-indent，不要用 font-size:0
 *   - mask 路径是一级上溯 ../，不是三级
 * -------------------------------------------------------------------------- */
i.iconfont.icon-rgb,
i.iconfont.icon-flexible-wireless-connectivity,
i.iconfont.icon-unified-platform-management,
i.iconfont.icon-fast-easy-deployment,
i.iconfont.icon-higher-picking-efficiency,
i.iconfont.icon-fewer-picking-errors,
i.iconfont.icon-faster-response-time,
i.iconfont.icon-reduced-search-time,
i.iconfont.icon-lower-labor-costs,
i.iconfont.icon-roi {
    display: inline-block;
    width: .5rem !important;
    height: .5rem !important;
    background-color: #bf0006 !important;
    vertical-align: -0.08rem;
    overflow: hidden;
    text-indent: -9999px;
    white-space: nowrap;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
}

/* 各图标的 mask 路径 */

i.iconfont.icon-rgb { -webkit-mask-image: url(../image/custom-icons/rgb.svg); mask-image: url(../image/custom-icons/rgb.svg); }
i.iconfont.icon-flexible-wireless-connectivity { -webkit-mask-image: url(../image/custom-icons/flexible-wireless-connectivity.svg); mask-image: url(../image/custom-icons/flexible-wireless-connectivity.svg); }
i.iconfont.icon-unified-platform-management { -webkit-mask-image: url(../image/custom-icons/unified-platform-management.svg); mask-image: url(../image/custom-icons/unified-platform-management.svg); }
i.iconfont.icon-fast-easy-deployment { -webkit-mask-image: url(../image/custom-icons/fast-easy-deployment.svg); mask-image: url(../image/custom-icons/fast-easy-deployment.svg); }
i.iconfont.icon-higher-picking-efficiency { -webkit-mask-image: url(../image/custom-icons/higher-picking-efficiency.svg); mask-image: url(../image/custom-icons/higher-picking-efficiency.svg); }
i.iconfont.icon-fewer-picking-errors { -webkit-mask-image: url(../image/custom-icons/fewer-picking-errors.svg); mask-image: url(../image/custom-icons/fewer-picking-errors.svg); }
i.iconfont.icon-faster-response-time { -webkit-mask-image: url(../image/custom-icons/faster-response-time.svg); mask-image: url(../image/custom-icons/faster-response-time.svg); }
i.iconfont.icon-reduced-search-time { -webkit-mask-image: url(../image/custom-icons/reduced-search-time.svg); mask-image: url(../image/custom-icons/reduced-search-time.svg); }
i.iconfont.icon-lower-labor-costs { -webkit-mask-image: url(../image/custom-icons/lower-labor-costs.svg); mask-image: url(../image/custom-icons/lower-labor-costs.svg); }
i.iconfont.icon-roi { -webkit-mask-image: url(../image/custom-icons/roi.svg); mask-image: url(../image/custom-icons/roi.svg); }

/* 选中态（深色底）图标变白 */
@media all and (min-width:1025px) {
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-rgb,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-flexible-wireless-connectivity,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-unified-platform-management,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-fast-easy-deployment,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-higher-picking-efficiency,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-fewer-picking-errors,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-faster-response-time,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-reduced-search-time,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-lower-labor-costs,
    .sol_icon_box_h > div.on .sol_icon_text_box i.icon-roi {
        background-color: #fff !important;
    }
}

/* 小屏下公共样式里图标一律是白色，这里保持一致 */
@media all and (max-width:1024px) {
    .sol_icon_box_h > div .sol_icon_text_box i.icon-rgb,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-flexible-wireless-connectivity,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-unified-platform-management,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-fast-easy-deployment,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-higher-picking-efficiency,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-fewer-picking-errors,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-faster-response-time,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-reduced-search-time,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-lower-labor-costs,
    .sol_icon_box_h > div .sol_icon_text_box i.icon-roi {
        background-color: #fff !important;
    }
}

/* 防误伤：后台表单输入框也会带上 iconfont 类，别把它变成图标 */
input.icon-rgb,
input.icon-flexible-wireless-connectivity,
input.icon-unified-platform-management,
input.icon-fast-easy-deployment,
input.icon-higher-picking-efficiency,
input.icon-fewer-picking-errors,
input.icon-faster-response-time,
input.icon-reduced-search-time,
input.icon-lower-labor-costs,
input.icon-roi,
input.iconfont {
    width: auto;
    height: auto;
    text-indent: 0;
    overflow: visible;
    background-color: transparent;
    -webkit-mask-image: none;
            mask-image: none;
}