﻿/*
    通过替换的方式删除空行用这个正则：^(?([^\r\n])\s)*\r?\n
*/
.logo {
}
    .logo a img {
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -khtml-opacity: 1;
        opacity: 1;
        width: 100px;
        max-width: 100px;
        max-height: 100px;
    }
/*
    自定义颜色        
    现有Logo的颜色为00a0e9
    原生三元色
    蓝：#00a0e9 (安全色#0099FF，去饱和#3AB2E9，对比色#FFAF00)，(深色#106F9C，安全色#006699，去饱和#337A9C，对比色#FFB51A）
    黄：#9C9608 (安全色#999900，去饱和#9C982D，对比色#0DF5FF),（浅色#E8E017，安全色#ffcc00，去饱和#E8E24B，对比色#19F6FF）
    红：#E81733 (安全色#ff0033，去饱和#E84B60，对比色#19FF38)
    下面的颜色方案中，均采用安全色
*/
.bg-blue {
    background-color: #0099ff !important;
}
.border-blue {
    border-color: #0099ff !important;
}
.color-blue {
    color: #0099ff !important;
}
.bg-blue-dark {
    background-color: #006699 !important;
}
.border-blue-dark {
    border-color: #006699 !important;
}
.color-blue-dark {
    color: #006699 !important;
}
.bg-red {
    background-color: #ff0033 !important;
}
.border-red {
    border-color: #ff0033 !important;
}
.color-red {
    color: #ff0033 !important;
}
.bg-yellow {
    background-color: #ffcc00 !important;
}
.border-yellow {
    border-color: #ffcc00 !important;
}
.color-yellow {
    color: #ffcc00 !important;
}
.bg-yellow-dark {
    background-color: #999900 !important;
}
.border-yellow-dark {
    border-color: #999900 !important;
}
.color-yellow-dark {
    color: #999900 !important;
}
.border-card_mask {
    border-color: #4aaab8 !important;
}
.bg-card_mask {
    background-color: #4aaab8;
}
.color-card_mask {
    color: #4aaab8 !important;
}
.dropdown-menu {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-color: #f8f9fa; /*与light的颜色一致*/
}
.no-text-indent {
    text-indent: 0;
}
article {
}
    article p {
        text-indent: 2rem;
    }
    article section {
        margin: 0;
        padding: 0;
        margin-top: 2rem;
    }
    article .rowheader {
        background-color: #aaa;
        color: #fff !important;
        font-weight: bold;
    }
    article .trademark {
        text-align: center;
    }
        article .trademark figure {
            float: left;
            padding: 0 1rem;
        }
            article .trademark figure img {
                width: 6rem;
                max-height: 6rem;
            }
            article .trademark figure figcaption {
                width: 100%;
                text-align: center;
            }
/*mainCtn用在js文件中*/
main.mainCtn {
    /*background-color: #F5FAFF;*/
}
.img100 {
    width: 5rem !important;
    max-height: 5rem !important;
}
.img180 {
    width: 10rem !important;
    max-height: 10rem !important;
}
.img320 {
    width: 15rem !important;
    max-height: 15rem !important;
}
#qrcode {
    width: 10rem;
    height: 10rem;
}
/*页脚部分*/
footer {
    color: #fff;
    font-size: 0.9rem;
}
    footer ul {
        list-style: none;
    }
.hotline {
    font-size: 2rem;
}
    footer a, footer .nav a, .hotline a {
        color: #fff;
    }
        footer a:hover, footer .nav a:hover, .hotline a:hover {
            color: #ffcc00;
        }
footer h2 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 400;
}
footer h3 {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
}
.copyright {
    font-size: 0.7rem;
    padding-bottom: 1rem;
    text-align: center;
}
/*.btm_icons img {
    width: 5rem;
    max-width: 5rem;
    max-height: 5rem;
    border: 2px solid #ffcc00;
    border-radius: 0.5rem;
    margin: 0.5rem;
}*/
.btm_nav {
    margin-top: 1rem;
}
    .btm_nav li {
        min-width: 7rem;
        border-left: 1px solid #fff;
    }
@media(max-width:860px) {
    .btm_nav li {
        min-width: 5rem;
    }
    .hotline {
        font-size: 1.2rem;
    }
}
.btm_nav li:first-child {
    border-left: none;
}
footer.mobilefooter {
    position: fixed !important;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1020 !important;
}
.mobilefooter li {
    min-width: 20%;
    text-align: center;
}
.mobilefooter dt {
    font-size: 1.5rem;
}
/*.mobilefooter dl {
                font-size: 0.8rem;
            }*/
.mobilefooter .copyright {
}
.mobilefooter.hide {
    display :none;
}
/*右侧导航栏offcanvas--开始*/
#sideMenu {
    font-size: 0.85rem;
}
    #sideMenu .offcanvas-header {
        padding: 0;
        padding: 1rem;
    }
    #sideMenu .offcanvas-body {
        padding: 0;
    }
        #sideMenu .offcanvas-body > .bg-blue-dark img {
            width: 12rem;
            max-height: 100%;
            padding: 1rem;
        }
    #sideMenu .btn-close {
        font-size: 1rem;
        background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
    }
        #sideMenu .btn-close:hover {
            opacity: 0.9;
        }
    #sideMenu .sidemenu_mainmenu {
    }
        #sideMenu .sidemenu_mainmenu li:hover, #sideMenu .sidemenu_mainmenu li:focus {
            background-color: #dddddd;
        }
        #sideMenu .sidemenu_mainmenu button,
        #sideMenu .sidemenu_mainmenu a {
            display: inline-flex;
            align-items: center;
            padding: 0.8rem;
            background-color: transparent;
            color: #000;
            border: 0;
        }
        #sideMenu .sidemenu_mainmenu button {
            float: right;
        }
        #sideMenu .sidemenu_mainmenu a:hover,
        #sideMenu .sidemenu_mainmenu a:focus {
            color: #006699;
            font-weight: bold;
        }
        #sideMenu .sidemenu_mainmenu button::before {
            width: 1.25em;
            line-height: 0;
            margin-right: 0.5rem;
            content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23006699' class='bi bi-plus-lg' viewBox='0 0 16 16'%3E %3Cpath d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z'/%3E %3C/svg%3E");
            /*transition: transform 0.2s ease;
            -webkit-transition: transform 0.2s ease;
            transform-origin: .5em 50%;
            -webkit-transform-origin: .5em 50%;*/
        }
        #sideMenu .sidemenu_mainmenu button[aria-expanded="true"]::before {
            content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23006699' class='bi bi-x-lg' viewBox='0 0 16 16'%3E %3Cpath d='M1.293 1.293a1 1 0 0 1 1.414 0L8 6.586l5.293-5.293a1 1 0 1 1 1.414 1.414L9.414 8l5.293 5.293a1 1 0 0 1-1.414 1.414L8 9.414l-5.293 5.293a1 1 0 0 1-1.414-1.414L6.586 8 1.293 2.707a1 1 0 0 1 0-1.414z'/%3E %3C/svg%3E");
        }
    #sideMenu .sidemenu_submenu {
        background-color: #eeeeee;
        padding-left: 2rem;
    }
        #sideMenu .sidemenu_submenu li:hover,
        #sideMenu .sidemenu_submenu li:focus {
            background-color: #eeeeee;
        }
        #sideMenu .sidemenu_submenu a {
            font-weight: normal;
        }
            #sideMenu .sidemenu_submenu a:hover {
                background-color: transparent;
            }
/*顶导航栏*/
.home_navbar_center {
}
    .home_navbar_center .nav-item li:hover {
        /*background: #0099ff;*/
    }
        .home_navbar_center .nav-item li:hover a {
            /*color: #ddd !important;*/
            font-weight: bold;
        }
.home_navbar_right {
    padding: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    background-color: #ffcc00;
    border-radius: 0.3rem;
    border-color: #ffcc00;
}
    .home_navbar_right a, .home_navbar_right button {
        color: #006699;
    }
        .home_navbar_right a:hover, .home_navbar_right button:hover, .home_navbar_right a:focus, .home_navbar_right button:focus {
            color: #ff0033;
        }
    .home_navbar_right .sideMenuToggle a {
        color: #ff0033;
    }
        .home_navbar_right .sideMenuToggle a:hover, .home_navbar_right .sideMenuToggle a:focus {
            color: #00AAFF;
        }
/*主页幻灯片--开始*/
/*tinySlider-slogan：20210829，展示纯图片，目前主要使用无实际意义的风光片，看起来也不错*/
.tinySlider-slogan {
}
    .tinySlider-slogan .slideritem .card {
        border-radius: 0 !important;
        background-size: cover;
        height: 400px !important;
        overflow: hidden;
    }
        .tinySlider-slogan .slideritem .card .card-title {
            color: #fff;
            font-size: 2rem;
        }
    .tinySlider-slogan .slideritem .row {
        background: #1d629d;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .tinySlider-slogan .slideritem .slideritem-text .card {
        background: none !important;
        max-height: 15rem;
        overflow: hidden;
        margin: auto;
        margin-top: 1rem;
        color: #fff;
    }
    .tinySlider-slogan .slideritem .slideritem-text .btn {
        background-color: #f4e84e;
    }
    .tinySlider-slogan .slideritem .slideritem-text a:hover {
        background-color: #ffcc00;
    }
    .tinySlider-slogan .slideritem .slideritem-img {
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#dee8f0+0,1d629d+69 */
        background: #1d629d; /* Old browsers */
        background: -moz-radial-gradient(center, ellipse cover, #dee8f0 0%, #1d629d 69%); /* FF3.6-15 */
        background: -webkit-radial-gradient(center, ellipse cover, #dee8f0 0%,#1d629d 69%); /* Chrome10-25,Safari5.1-6 */
        background: radial-gradient(ellipse at center, #dee8f0 0%,#1d629d 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dee8f0', endColorstr='#1d629d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    }
        .tinySlider-slogan .slideritem .slideritem-img img {
            width: 15rem;
            height: 15rem;
            max-width: 15rem;
            max-height: 15rem;
            margin: 1rem;
        }
/*主页幻灯片--结束*/
/*主页滚动新闻幻灯片*/
.tinySlider-news {
}
/*新闻详情页图片幻灯片*/
.tinySlider-news-img {
}
    .tinySlider-news-img .slideritem img {
    }
/*主页图片card文字飞入--开始*/
.section-card {
    margin: 0;
    margin-top: 1.5rem;
}
.home_img_card {
    position: relative;
    background-color: rgba(57, 62, 93, 0.7);
    padding: 0;
    overflow: hidden;
    max-width: 30%;
    margin: auto;
    border-radius: 0.5rem;
}
    .home_img_card article {
        padding: 2% 10%;
        position: absolute;
        bottom: 0;
        z-index: 1;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        transition: all 0.5s ease;
        text-align: left;
        margin: 5%;
        width: 90%;
        border-radius: 0.5rem;
        background-color: #cccccc;
    }
    .home_img_card h2 {
        font-weight: 800;
        font-size: 2rem;
        color: #fff !important;
        border-bottom: 2px solid #fff;
    }
    .home_img_card h3 {
        font-weight: 400;
        font-size: 1.5rem;
    }
    .home_img_card a {
        color: #fff !important;
    }
    .home_img_card img {
        width: 100%;
        top: 0;
        left: 0;
        opacity: 0.8;
        -webkit-transition: all 3s ease;
        -moz-transition: all 3s ease;
        -o-transition: all 3s ease;
        -ms-transition: all 3s ease;
        transition: all 3s ease;
    }
.card_mask {
    background-color: #4aaab8;
    position: absolute;
    width: 100%;
    height: 6rem;
    bottom: 0;
    z-index: 1;
    padding: 0.25rem;
}
.home_img_card .card_mask {
    opacity: 0;
    transform: translate(0rem, 6.0rem);
    -webkit-transform: translate(0rem, 6.0rem);
    -moz-transform: translate(0rem, 6.0rem);
    -o-transform: translate(0rem, 6.0rem);
    -ms-transform: translate(0rem, 6.0rem);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.card_mask span {
    color: #fff;
    position: relative;
    padding: 10px;
    width: 100%;
    top: 0.5rem;
    overflow: hidden;
    text-align: justify;
}
.home_img_card:hover img {
    opacity: 0.1;
    transform: scale(1.5);
}
.home_img_card:hover article {
    transform: translate(0px, -5.9rem);
    -webkit-transform: translate(0px, -5.9rem);
    -moz-transform: translate(0px, -5.9rem);
    -o-transform: translate(0px, -5.9rem);
    -ms-transform: translate(0px, -5.9rem);
    background-color: transparent;
    /*transform: translate(0px, 20rem);
            -webkit-transform: translate(0px, 20rem);
            -moz-transform: translate(0px, 20rem);
            -o-transform: translate(0px, 20rem);
            -ms-transform: translate(0px, 20rem);*/
    /*display :none ;*/
}
.home_img_card:hover .card_mask {
    transform: translate(0rem, 0rem);
    -webkit-transform: translate(0rem, 0rem);
    -moz-transform: translate(0rem, 0rem);
    -o-transform: translate(0rem, 0rem);
    -ms-transform: translate(0rem, 0rem);
    opacity: 1;
}
@media(max-width: 640px) {
    .home_img_card {
        max-width: 90%;
        margin-bottom: 20px;
    }
}
/*主页产品展示--开始*/
/*common styling:2个选择器需要连在一起，否则得再加一个div*/
.tab_style.nav-tabs {
    border-bottom: 1px solid transparent;
    display: flex;
    justify-content: center;
}
    .tab_style.nav-tabs .nav-link {
        padding: 5px 20px;
        margin: 10px;
        border-radius: 0.25rem;
        background-color: #e5e5e5;
    }
.tab_style .nav-item.show .nav-link, .tab_style .nav-link.active {
    color: #006699;
    background-color: #ffcc00;
    border-color: transparent;
    font-weight: bold;
}
.tab_style .nav-link:focus, .tab_style .nav-link:hover {
    background-color: #ffcc00;
    border-color: transparent;
}
.img-flip {
    /*height: 20rem;*/
}
    .img-flip:hover .img-flip-back, .img-flip.hover .img-flip-back {
        -webkit-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        transform: rotateY(0deg);
        border-radius: .25rem;
    }
    .img-flip:hover .img-flip-front, .img-flip.hover .img-flip-front {
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
/*.img-flip.img-flip-nortoate:hover .img-flip-front, .img-flip.img-flip-nortoate.hover .img-flip-front {
        -webkit-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }*/
.img-flip-container {
    -webkit-transition: 1s;
    -webkit-transform-style: preserve-3d;
    -ms-transition: 1s;
    -moz-transition: 1s;
    -moz-transform: perspective(1000px);
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transition: 1s;
    transform-style: preserve-3d;
    position: relative;
    margin-bottom: 1.5rem;
}
.img-flip-front, .img-flip-back {
    border: 0.1rem solid #e2e2e2;
    border-radius: 0.5rem;
}
.img-flip-front {
    position: relative;
    -webkit-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    z-index: 2;
    /*margin-bottom: 30px;*/
}
.img-flip-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
    -webkit-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
    -moz-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
    box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
}
.img-flip-front, .img-flip-back {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: 1s;
    -webkit-transform-style: preserve-3d;
    -moz-transition: 1s;
    -moz-transform-style: preserve-3d;
    -o-transition: 1s;
    -o-transform-style: preserve-3d;
    -ms-transition: 1s;
    -ms-transform-style: preserve-3d;
    transition: 1s;
    transform-style: preserve-3d;
}
    .img-flip-front .img-flip-card, .img-flip-back .img-flip-card {
        height: 21rem;
        min-width: 16rem;
    }
    .img-flip-front h3, .img-flip-back h3, .img-flip-front h4, .img-flip-back h4 {
        width: 100%;
        font-size: 1rem;
        color: #006699 !important;
        text-align: center;
    }
    .img-flip-front .card-text {
        height: 3rem;
        overflow: hidden;
        text-indent: 0;
    }
    .img-flip-back ul, .img-flip-back p {
        min-height: 12.5rem;
        height: 12.5rem;
        overflow: hidden;
        text-align: justify;
        text-justify: distribute-all-lines;
        font-size: 90%;
    }
    .img-flip-front img {
        height: 12rem;
        width: auto;
        max-width: 12rem;
        margin: 1rem;
        /*opacity :0.6;*/
    }
.img-flip-container.img-flip-container-small {
    margin-bottom: 1.5rem;
}
    .img-flip-container.img-flip-container-small .img-flip-front .img-flip-card, .img-flip-container.img-flip-container-small .img-flip-back .img-flip-card {
        height: 16rem;
        min-width: 12rem;
    }
    .img-flip-container.img-flip-container-small .img-flip-front .card-text {
        height: 2.5rem;
    }
    .img-flip-container.img-flip-container-small .img-flip-front img {
        height: 8rem;
        min-width: 8rem;
    }
    .img-flip-container.img-flip-container-small .img-flip-back ul, .img-flip-container.img-flip-container-small .img-flip-back p {
        height: 10rem;
    }
    .img-flip-container.img-flip-container-small h2, .img-flip-container-small h3, .img-flip-container.img-flip-container-small h4, .img-flip-container-small p, .img-flip-container.img-flip-container-small li {
        font-size: 90%;
    }
/*主页案例展示幻灯片*/
.tinySlider-case {
}
    .tinySlider-case .slideritem {
    }
        .tinySlider-case .slideritem img {
            border-radius: 0;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            opacity: 0.4;
        }
        .tinySlider-case .slideritem:hover img {
            -webkit-transition: all 1.5s ease;
            -moz-transition: all 1.5s ease;
            -o-transition: all 1.5s ease;
            -ms-transition: all 1.5s ease;
            transition: all 1.5s ease;
            opacity: 1;
        }
    .tinySlider-case h3 {
        color: #fff;
        font-weight: 400;
        font-size: 1.2rem;
    }
    .tinySlider-case ul {
        text-align: center;
        list-style: none;
        padding: 0;
    }
    .tinySlider-case .card_mask {
        position: relative;
        border-radius: 0;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        color: #fff;
        height: 5rem;
        overflow: hidden;
        /*尝试修改为hover时浮现*/
        /*opacity: 0;
                transform: translate(0rem, 6.0rem);
                -webkit-transform: translate(0rem, 6.0rem);
                -moz-transform: translate(0rem, 6.0rem);
                -o-transform: translate(0rem, 6.0rem);
                -ms-transform: translate(0rem, 6.0rem);
                -webkit-transition: all 0.2s ease-in-out;
                -moz-transition: all 0.2s ease-in-out;
                -o-transition: all 0.2s ease-in-out;
                -ms-transition: all 0.2s ease-in-out;
                transition: all 0.2s ease-in-out;*/
    }
/*尝试修改为hover时浮现*/
/*.tinySlider-case .slideritem:hover .card_mask {
                transform: translate(0rem, 0rem);
                -webkit-transform: translate(0rem, 0rem);
                -moz-transform: translate(0rem, 0rem);
                -o-transform: translate(0rem, 0rem);
                -ms-transform: translate(0rem, 0rem);
                opacity: 1;
            }*/
/*产品页面内容，案例分享页面使用同一个css*/
.tinySlider-pro {
    width: 100%;
    height: 25rem;
}
    .tinySlider-pro .slideritem img {
        height: 20rem;
        width: auto;
        margin-top: 2.5rem;
    }
.nav-thumb-pro {
    margin: 0 auto;
}
    .nav-thumb-pro img {
        vertical-align: central;
        height: auto;
        max-height: 5rem;
        opacity: 0.3;
    }
    .nav-thumb-pro .tns-nav-active {
        border-bottom: 0.3rem solid #006699;
    }
        .nav-thumb-pro .tns-nav-active img {
            opacity: 1;
        }
ul.list-good li {
    list-style: none;
    list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-hand-thumbs-up' viewBox='0 0 16 16'%3E %3Cpath d='M8.864.046C7.908-.193 7.02.53 6.956 1.466c-.072 1.051-.23 2.016-.428 2.59-.125.36-.479 1.013-1.04 1.639-.557.623-1.282 1.178-2.131 1.41C2.685 7.288 2 7.87 2 8.72v4.001c0 .845.682 1.464 1.448 1.545 1.07.114 1.564.415 2.068.723l.048.03c.272.165.578.348.97.484.397.136.861.217 1.466.217h3.5c.937 0 1.599-.477 1.934-1.064a1.86 1.86 0 0 0 .254-.912c0-.152-.023-.312-.077-.464.201-.263.38-.578.488-.901.11-.33.172-.762.004-1.149.069-.13.12-.269.159-.403.077-.27.113-.568.113-.857 0-.288-.036-.585-.113-.856a2.144 2.144 0 0 0-.138-.362 1.9 1.9 0 0 0 .234-1.734c-.206-.592-.682-1.1-1.2-1.272-.847-.282-1.803-.276-2.516-.211a9.84 9.84 0 0 0-.443.05 9.365 9.365 0 0 0-.062-4.509A1.38 1.38 0 0 0 9.125.111L8.864.046zM11.5 14.721H8c-.51 0-.863-.069-1.14-.164-.281-.097-.506-.228-.776-.393l-.04-.024c-.555-.339-1.198-.731-2.49-.868-.333-.036-.554-.29-.554-.55V8.72c0-.254.226-.543.62-.65 1.095-.3 1.977-.996 2.614-1.708.635-.71 1.064-1.475 1.238-1.978.243-.7.407-1.768.482-2.85.025-.362.36-.594.667-.518l.262.066c.16.04.258.143.288.255a8.34 8.34 0 0 1-.145 4.725.5.5 0 0 0 .595.644l.003-.001.014-.003.058-.014a8.908 8.908 0 0 1 1.036-.157c.663-.06 1.457-.054 2.11.164.175.058.45.3.57.65.107.308.087.67-.266 1.022l-.353.353.353.354c.043.043.105.141.154.315.048.167.075.37.075.581 0 .212-.027.414-.075.582-.05.174-.111.272-.154.315l-.353.353.353.354c.047.047.109.177.005.488a2.224 2.224 0 0 1-.505.805l-.353.353.353.354c.006.005.041.05.041.17a.866.866 0 0 1-.121.416c-.165.288-.503.56-1.066.56z'/%3E %3C/svg%3E");
    list-style-position: outside;
}
/*产品页面内容，案例分享页面使用同一个css -- 结束*/
/*
    订制breadcrumb
*/
.sitepath {
    padding: 0.8rem;
    margin: 0.8rem 0;
    background-color: #006699;
    border-radius: 0.3rem;
    color: #fff;
    text-align: center;
}
    .sitepath a {
        color: #fff;
    }
        .sitepath a:hover, .sitepath a:focus {
            color: #ffcc00;
        }
        .sitepath a::after {
            content: " - "
        }
.sitemapTree ul {
    list-style: none;
    padding: 0;
}
.sitemapTree li {
    width: 100%;
}
.sitemapTree .sitemapTree_topMenu li {
    margin-top: 0.5rem;
    background-color: #cccccc;
}
.sitemapTree .sitemapTree_topMenu a, .sitemapTree .sitemapTree_topMenu button {
    display: inline-flex;
    align-items: center;
    padding: 0.8rem;
    padding-bottom: 0.5rem;
    background-color: transparent;
    color: #000;
    border: 0;
    margin: 0;
}
    .sitemapTree .sitemapTree_topMenu a:hover {
        color: #006699;
        font-weight: bold;
    }
/*.sitemapTree .subMenu {            
            background-color :#dddddd;
        }*/
.sitemapTree .sitemapTree_subMenu a {
    padding-left: 2rem;
}
.sitemapTree .sitemapTree_subMenu ul {
    background-color: #eeeeee;
}
.sitemapTree .sitemapTree_subMenu .sitemapTree_subMenu a {
    padding-left: 4rem;
}
.sitemapTree .sitemapTree_subMenu li {
    margin: 0;
    background-color: #dddddd;
}
.sitemapTree .sitemapTree_subMenu .sitemapTree_subMenu li {
    background-color: #eeeeee;
}
    .sitemapTree .sitemapTree_subMenu li:hover, .sitemapTree .sitemapTree_subMenu .sitemapTree_subMenu li:hover {
        background-color: #ffffff;
    }
.sitemapTree button {
    float: right;
}
    .sitemapTree button::before {
        width: 1.25em;
        line-height: 0;
        margin-right: 0.5rem;
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23006699' class='bi bi-plus-lg' viewBox='0 0 16 16'%3E %3Cpath d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z'/%3E %3C/svg%3E");
    }
    .sitemapTree button[aria-expanded="true"]::before {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23006699' class='bi bi-x-lg' viewBox='0 0 16 16'%3E %3Cpath d='M1.293 1.293a1 1 0 0 1 1.414 0L8 6.586l5.293-5.293a1 1 0 1 1 1.414 1.414L9.414 8l5.293 5.293a1 1 0 0 1-1.414 1.414L8 9.414l-5.293 5.293a1 1 0 0 1-1.414-1.414L6.586 8 1.293 2.707a1 1 0 0 1 0-1.414z'/%3E %3C/svg%3E");
    }
.keyword {
    color: #c00;
    font-weight: bold;
}
.visually-hidden {
    display: none;
}
.GridMain {
    margin-bottom: 2rem;
}
    .GridMain * {
        text-align: left;
    }
    .GridMain table tr td {
        border: 0;
    }
    .GridMain a {
        color: #006699;
    }
        .GridMain a:hover {
            color: #fff;
        }
.GridRowStyle { /* 原GridHeader，深蓝色方案 background-color: #8ab8f3;  */
    background-color: #efefef;
}
    .GridRowStyle a {
    }
        .GridRowStyle a:hover {
        }
.GridHeaderStyle {
    font-weight: normal;
    height: 3rem;
    background: #b0b0b0;
}
    .GridHeaderStyle th {
    }
    .GridHeaderStyle a {
    }
        .GridHeaderStyle a:hover {
        }
.GridAltRowStyle { /*background-color:#b8cfee;*/
}
    .GridAltRowStyle a {
    }
        .GridAltRowStyle a:hover {
        }
.GridFooterStyle {
}
.GridEmptyRowStyle {
}
.GridPagerStyle {
    background: #646464;
    height: 2rem;
    color: #000;
}
    .GridPagerStyle table {
        width: auto;
    }
    .GridPagerStyle td {
        border: 0;
        vertical-align: middle;
    }
        .GridPagerStyle td span {
            background: #c9c9c9;
            height: 1.5rem;
            width: 1.5rem;
            display: block;
            text-align: center;
            vertical-align: middle;
        }
    .GridPagerStyle a {
        color: #fff;
        padding: 0.5rem;
    }
        .GridPagerStyle a:hover {
            color: #ffcc00;
        }
.GridSelectedRow {
    background-color: #4aaab8; /*草绿#a6d05a*/
}
.ie-warning {
    width: 100%;
    display: block;
    text-align: center;
    font-size: 16px;
    color: #FF0000;
    background: #f8d7da;
    padding: 10px 0;
    border-bottom: 1px solid #f5c6cb;
}
.iealertHeader {
    background: #fff3cd;
    color: #856404;
    padding: 20px;
    border: 1px solid #ffeeba;
    margin: 0;
    font-family: "Microsoft Yahei", sans-serif;
}
    .iealertHeader table {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto;
        border-collapse: collapse;
    }
    .iealertHeader td {
        padding: 10px;
        vertical-align: middle;
    }
    .iealertHeader a {
        color: #007bff;
        text-decoration: none;
    }
        .iealertHeader a:hover {
            text-decoration: underline;
        }
    .iealertHeader img {
        height: 16px;
        margin-left: 5px;
        vertical-align: middle;
    }
#iealertQRcode {
    width: 150px;
    height: 150px;
    padding: 10px;
    margin: 0 auto; /* 新增：实现二维码水平居中，避免偏移 */
    display: block; /* 新增：配合margin:auto实现块级居中，必须加 */
    /* 解决 IE9 盒模型问题：强制设置盒模型为 content-box（IE9 默认可能不一致） */
    box-sizing: content-box;
    /* IE9 专属 Hack：强制指定宽高，覆盖 IE9 异常渲染 */
    width: 150px\9 \0;
    height: 150px\9 \0;
    /* 可选：如果图片本身缩放异常，强制图片不缩放 */
    max-width: 150px\9 \0;
    max-height: 150px\9 \0;
    border: none\9 \0; /* 排除边框干扰 */
}
    #iealertQRcode img {
        width: 150px\9 \0;
        height: 150px\9 \0;
        display: block\9 \0; /* 消除图片默认行内间隙 */
    }
.iealert {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0; /* 新增：配合left:0实现100%宽度，无溢出 */
    width: 100%; /* 新增：显式定义宽度，减少布局计算 */
    margin: 0;
    z-index: 9999;
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 500ms ease-out 1000ms, transform 500ms ease-out 1000ms;
    color: #FFD700;
    background-color: #212327;
    text-align: center;
    padding: 0.5rem;
    /*padding-bottom: 2rem;*/
    font-size: 0.8rem;
    font-family: 微软雅黑, "Lucida Grande", "Helvetica Neue",Arial, Helvetica, Verdana, sans-serif, "Segoe UI";
    will-change: opacity, transform; /* 替代JS强制重排，消除回流 */
    box-sizing: border-box; /* 防止padding撑大宽度，布局稳定 */
    background-color: #212327; /* 新增：兼容部分浏览器对background简写的解析问题 */
    pointer-events: none; /* 新增：首屏时彻底隐藏，不参与渲染 */
    display: block !important;
}
    .iealert.show {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto; /* 恢复点击交互 */
    }
    .iealert img, .iealertHeader table img {
        width: 20px;
        height: 20px;
        display: inline-block;
    }
    .iealert a {
        font-weight: bold;
        color: #fff;
        text-decoration: none; /* 新增：默认无下划线，hover时显示，符合交互习惯 */
    }
        .iealert a:hover {
            text-decoration: underline;
        }
/*
 * Bootstrap Cookie Alert by Wruczek
 * https://github.com/Wruczek/Bootstrap-Cookie-Alert
 * Released under MIT license
 */
.cookiealert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 !important;
    z-index: 9900;
    opacity: 0;
    color: #ecf0f1;
    background: #212327;
    text-align: center !important;
    padding: 0.5rem;
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translate3d(0, 100%, 0);
    transition: opacity 500ms ease-out, transform 500ms ease-out; /* 替换原transition: all 500ms ease-out; */
    pointer-events: none; /* 隐藏时避免点击穿透 */
}
    .cookiealert.show {
        opacity: 1;
        transform: translate3d(0, 0, 0); /* 统一3D变换，保持硬件加速 */
        pointer-events: auto; /* 显示时恢复点击 */
        transition-delay: 1000ms;
    }
    .cookiealert a {
    }
    .cookiealert:not(.show) {
        pointer-events: none;
    }
/*cookie alert ends */
/*购物车开始*/
.shop-cart {
    position: fixed !important;
    bottom: 200px;
    right: 40px;
    display: block;
    background: rgba(255, 204, 0, 0.6);
    color: #2163e8;
    border-radius: 50%;
    width: 52px;
    height: 52px;
    line-height: 52px;
    text-align: center;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    cursor: pointer;
    /*z-index: 2000;*/
}
    .shop-cart i {
        font-size: 1.6rem;
        vertical-align: middle;
    }
        .shop-cart i span {
            font-size: 0.8rem;
        }
    .shop-cart:hover {
        background: #2163e8;
        color: #fff;
    }
        .shop-cart:hover i {
            color: #fff;
        }
.remove-pro-btn {
    cursor: pointer; /* 鼠标悬停显示手型，这是核心属性 */
}
.product-like {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    display: block;
    font-size: 1.5rem;
    z-index: 10;
}
    .product-like i {
        color: #f8b62d;
    }
        .product-like i:hover {
            color: #EB2716;
        }
/* 20260126:反注释这个元素会导致左上角的logo被顶出去 */
/*.industry-menu-item {
    width: 13.5rem;
    max-width: 14rem;
}*/
.industry-card {
    border-radius: 0.25rem; /* 四个半径值分别是左上角、右上角、右下角和左下角 */
    -moz-border-radius: 0.25rem; /* Mozilla浏览器的私有属性 */
    -webkit-border-radius: 0.25rem; /* Webkit浏览器的私有属性 */
}
    .industry-card img {
        border-radius: 0.25rem 0 0 0.25rem; /* 四个半径值分别是左上角、右上角、右下角和左下角 */
        -moz-border-radius: 0.25rem 0 0 0.25rem; /* Mozilla浏览器的私有属性 */
        -webkit-border-radius: 0.25rem 0 0 0.25rem; /* Webkit浏览器的私有属性 */
    }
    .industry-card a img {
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        -khtml-opacity: 0.6;
        opacity: 0.6;
    }
        .industry-card a img:hover {
            filter: alpha(opacity=100);
            -moz-opacity: 1;
            -khtml-opacity: 1;
            opacity: 1;
        }
    .industry-card .card-header {
        text-align: center;
        color: #000;
        border-radius: 0 0.25rem 0 0; /* 四个半径值分别是左上角、右上角、右下角和左下角 */
        -moz-border-radius: 0 0.25rem 0 0; /* Mozilla浏览器的私有属性 */
        -webkit-border-radius: 0 0.25rem 0 0; /* Webkit浏览器的私有属性 */
    }
        .industry-card .card-header h2 {
            font-size: calc(1rem + 0.25vw);
            margin: 0;
            padding: 0;
        }
@media (max-width: 575.98px) {
    .industry-card img {
        border-radius: 0.25rem 0.25rem 0 0; /* 四个半径值分别是左上角、右上角、右下角和左下角 */
        -moz-border-radius: 0.25rem 0.25rem 0 0; /* Mozilla浏览器的私有属性 */
        -webkit-border-radius: 0.25rem 0.25rem 0 0; /* Webkit浏览器的私有属性 */
    }
    .industry-card .card-header {
        border-radius: 0; /* 四个半径值分别是左上角、右上角、右下角和左下角 */
        -moz-border-radius: 0; /* Mozilla浏览器的私有属性 */
        -webkit-border-radius: 0; /* Webkit浏览器的私有属性 */
    }
}
.text-justify {
    text-align: justify !important; /* 核心属性：文字两端对齐 */
    text-justify: inter-character; /* 让字符间间距更均匀，优化中文显示 */
}
    /* 解决单行文字text-align: justify不生效的问题 */
    .text-justify::after {
        content: "";
        display: inline-block;
        width: 100%;
    }
/* 可选：响应式控制，大屏两端对齐，小屏左对齐（适配移动端） */
@media (max-width: 767.98px) {
    .text-justify-sm-left {
        text-align: left !important;
    }
        .text-justify-sm-left::after {
            display: none;
        }
}
.breadcrumb-item a {
    color: #595d69;
}
    .breadcrumb-item a:hover {
        color: #ffcc00 !important;
    }
/* 20260227新增：断网横幅样式 */
.offline-banner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff3cd; /* 柔和的警告黄 */
    color: #856404;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    font-weight: bold;
    z-index: 9999; /* 确保在最上层 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    border-bottom: 1px solid #ffeeba;
}
    .offline-banner .icon {
        margin-right: 8px;
    }
/* 页面主体自动下移，防止被横幅遮挡 */
body.is-offline {
    margin-top: 40px; /* 高度应与横幅保持一致 */
}
/* 20260227新增：断网横幅样式结束 */
/* 20260302新增：PWA 更新提示弹窗容器 */
/* PWA Notification Toast - Multi-language Support */
#pwa-update-toast {
    display: none; /* Controlled by JS */
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    background-color: #333333;
    color: #ffffff;
    padding: 16px 20px;
    border-radius: 8px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
    /* 使用 Flex 布局实现自适应 */
    display: none;
    align-items: center;
    justify-content: space-between;
    /* 兼容长短不一的英文，设置最小宽度 */
    min-width: 320px;
    max-width: 450px;
    /* 中英文兼容字体库：西文在前，中文在后 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Microsoft YaHei", "PingFang SC", sans-serif;
    animation: slideInRight 0.3s ease-out forwards;
    line-height: 1.5;
}
.pwa-toast-content {
    flex: 1;
    margin-right: 15px;
    text-align: left;
}
.pwa-toast-title {
    display: block;
    color: #ff9800;
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 2px;
}
.pwa-toast-desc {
    font-size: 13px;
    color: #cccccc;
    display: block;
    /* 防止英文长单词撑破布局 */
    word-break: break-word;
}
.pwa-toast-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0; /* 防止按钮在英文长句下被挤压变窄 */
}
/* 统一按钮样式 */
.pwa-btn-refresh, .pwa-btn-ignore {
    border-radius: 4px;
    font-size: 12px;
    padding: 6px 12px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.2s ease;
    white-space: nowrap; /* 确保按钮文字不换行 */
}
.pwa-btn-refresh {
    background-color: #ff9800;
    border: 1px solid #ff9800;
    color: #ffffff;
}
    .pwa-btn-refresh:hover {
        background-color: #e68a00;
        border-color: #e68a00;
    }
.pwa-btn-ignore {
    background-color: transparent;
    border: 1px solid #666666;
    color: #bbbbbb;
}
    .pwa-btn-ignore:hover {
        border-color: #999999;
        color: #ffffff;
        background-color: rgba(255,255,255,0.05);
    }
/* 进场动画 */
@keyframes slideInRight {
    from {
        transform: translateX(120%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}
/* 针对小屏幕（移动端）的兼容适配 */
@media (max-width: 480px) {
    #pwa-update-toast {
        left: 15px;
        right: 15px;
        top: 15px;
        min-width: auto;
        padding: 12px 16px;
    }
}
/* 20260302新增：PWA 更新提示弹窗容器结束 */