﻿.nav-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    height: 49px;
    padding: 0;
    background: #000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s;
}

    .nav-header .menu-toogle {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 48px;
        height: 48px;
        background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/ic_menu_white.png');
        background-size: 24px 24px;
        background-repeat: no-repeat;
        background-position: center center;
    }

        .nav-header .menu-toogle.inactive {
            background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/icon-close@2x.png');
            background-size: 24px 24px;
            background-repeat: no-repeat;
            background-position: center center;
        }

    .nav-header .brand {
        width: 100px;
        height: 48px;
        display: block;
        padding: 15px 0 16px 0;
        margin: 0 auto;
        background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/logo_white.png');
        background-size: 102px 22px;
        background-repeat: no-repeat;
        background-position: center center;
    }

    .nav-header .btn-buy {
        display: flex;
        align-items: center;
        background: transparent;
        border-radius: 50px;
        color: #2d2d2d;
        padding: 0 8px;
        height: 30px;
        line-height: 30px;
        position: absolute;
        right: 8px;
        top: 9px;
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
        background-image: linear-gradient(144deg, #FFEE00 0%, #FFD200 100%);
    }

@media (max-width: 350px) {
    .nav-header .btn-buy {
        font-size: 10px;
    }
}

.nav-header .btn-buy img {
    height: 20px;
}

@media (max-width: 320px) {
    .nav-header .btn-buy img {
        height: 18px;
    }
}

.nav-header.theme-white {
    background-color: transparent;
}

    .nav-header.theme-white .menu-toogle {
        background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/icon-menu-black@2x.png');
        background-size: 24px 24px;
        background-repeat: no-repeat;
        background-position: center center;
    }

        .nav-header.theme-white .menu-toogle.inactive {
            background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/icon-close-black@2x.png');
            background-size: 24px 24px;
            background-repeat: no-repeat;
            background-position: center center;
        }

    .nav-header.theme-white .brand {
        background-image: url('https://static.insta360.com/assets/www/project/official/component/header-mobile/ic_brandlogo_black@2x.png');
        background-size: 100px 24px;
        background-repeat: no-repeat;
        background-position: center center;
    }

.nav-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 48px;
    z-index: 998;
    background: #fff;
    overflow: hidden;
    display: none;
}

    .nav-modal .nav-collapse {
        display: none;
        height: 100%;
    }

    .nav-modal .nav-layout {
        height: 100%;
        display: flex;
    }

        .nav-modal .nav-layout .nav-aside {
            width: 120px;
            height: 100%;
            overflow: hidden;
            flex: none;
            margin: 10px 0 32px;
            border-right: 1px solid #e1e3e6;
        }

            .nav-modal .nav-layout .nav-aside .item {
                position: relative;
                display: block;
                margin: 16px 12px 16px 18px;
                padding: 10px 0;
                font-size: 12px;
                color: #2d2d2d;
            }

                .nav-modal .nav-layout .nav-aside .item.active {
                    font-weight: bold;
                }

                    .nav-modal .nav-layout .nav-aside .item.active::before {
                        content: '';
                        position: absolute;
                        top: 9px;
                        left: -18px;
                        width: 4px;
                        height: 15px;
                        background-color: #FFD200;
                    }

        .nav-modal .nav-layout .nav-content {
            position: relative;
            flex: auto;
            height: 100%;
            overflow: hidden;
        }

        .nav-modal .nav-layout .nav-submenu {
            max-width: 252px;
            margin: 0 auto 138px;
            display: none;
        }

            .nav-modal .nav-layout .nav-submenu.active {
                display: block;
            }

            .nav-modal .nav-layout .nav-submenu .nav-submenu-header {
                margin: 20px 0;
                text-align: center;
                font-size: 10px;
                color: #898a8e;
                line-height: 13px;
            }

            .nav-modal .nav-layout .nav-submenu .nav-submenu-list {
                margin: -6px 14px;
                display: flex;
                flex-wrap: wrap;
            }

                .nav-modal .nav-layout .nav-submenu .nav-submenu-list .item {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    width: calc(50% - 12px);
                    margin: 6px;
                    padding: 10px 0;
                    background: #f8f9fc;
                    border-radius: 8px;
                }

                    .nav-modal .nav-layout .nav-submenu .nav-submenu-list .item img {
                        height: 64px;
                        width: 64px;
                    }

                    .nav-modal .nav-layout .nav-submenu .nav-submenu-list .item .text {
                        margin-top: 5px;
                        font-size: 11px;
                        font-weight: bold;
                        color: #2d2d2d;
                        line-height: 17px;
                        text-align: center;
                    }

                    .nav-modal .nav-layout .nav-submenu .nav-submenu-list .item .text-sm {
                        font-size: 10px;
                        color: #afb1b4;
                        line-height: 17px;
                        text-align: center;
                    }

        .nav-modal .nav-layout .nav-submenu-bottom {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 100%;
            background-color: #fff;
            height: 90px;
            padding: 0 20px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .nav-modal .nav-layout .nav-submenu-bottom::before {
                content: '';
                position: absolute;
                top: -48px;
                height: 48px;
                left: 0;
                width: 100%;
                background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
            }

            .nav-modal .nav-layout .nav-submenu-bottom .btn-nav {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 100%;
                height: 36px;
                line-height: 36px;
                background: linear-gradient(132deg, #ffee00 0%, #ffd200 100%);
                border-radius: 100px;
                font-size: 12px;
                font-weight: bold;
                color: #2d2d2d;
            }

                .nav-modal .nav-layout .nav-submenu-bottom .btn-nav img {
                    width: 16px;
                    margin-right: 10px;
                }

.nav-footer {
    background-color: #2D2D2D;
}

    .nav-footer .icon-list {
        display: flex;
        margin: 40px 24px 0;
    }

        .nav-footer .icon-list a:not(:last-child) {
            margin-right: 16px;
        }

        .nav-footer .icon-list a img {
            height: 24px;
        }

    .nav-footer .nav-list {
        padding: 16px 24px;
    }

    .nav-footer .nav-item {
        border-bottom: 1px solid #424242;
    }

        .nav-footer .nav-item.active .menu-main .ic {
            transform: translateY(-50%) rotate(45deg);
        }

        .nav-footer .nav-item.active .menu-sub {
            display: block;
        }

        .nav-footer .nav-item .menu-main {
            position: relative;
            display: block;
            height: 56px;
            line-height: 56px;
            font-size: 12px;
            color: #ffffff;
        }

            .nav-footer .nav-item .menu-main .ic {
                position: absolute;
                right: 0;
                top: 50%;
                height: 24px;
                transform: translateY(-50%);
                transition: transform 200ms;
            }

        .nav-footer .nav-item .menu-sub {
            display: none;
            margin-bottom: 16px;
        }

            .nav-footer .nav-item .menu-sub a {
                display: block;
                padding-left: 24px;
                height: 40px;
                line-height: 40px;
                font-size: 12px;
                color: #ffffff;
            }

    .nav-footer .input-email-wrapper {
        margin: 32px 24px 0;
    }

        .nav-footer .input-email-wrapper .text {
            font-size: 12px;
            line-height: 14px;
            color: #ffffff;
            font-weight: 500;
        }

        .nav-footer .input-email-wrapper .text-sm {
            margin-top: 12px;
            font-size: 12px;
            color: #A2A4A7;
            line-height: 14px;
        }

        .nav-footer .input-email-wrapper .input-email {
            position: relative;
            margin-top: 12px;
            display: flex;
        }

            .nav-footer .input-email-wrapper .input-email input[type="text"] {
                outline: 0;
                display: block;
                width: 100%;
                flex: auto;
                height: 48px;
                line-height: 48px;
                padding: 0 18px;
                border-radius: 6px 0 0 6px;
                border: 1px solid #D9D9D9;
                border-right: 0;
                background: transparent;
                font-size: 14px;
                line-height: 18px;
                color: #fff;
            }

            .nav-footer .input-email-wrapper .input-email button {
                outline: 0;
                border: 0;
                position: relative;
                flex: none;
                height: 48px;
                width: 48px;
                background: #EDEFF2;
                border-radius: 0 6px 6px 0;
            }

                .nav-footer .input-email-wrapper .input-email button .img1,
                .nav-footer .input-email-wrapper .input-email button .img2 {
                    position: absolute;
                    left: 50%;
                    height: 12px;
                    top: 50%;
                    transform: translate(-50%, -50%);
                }

                .nav-footer .input-email-wrapper .input-email button .img2 {
                    opacity: 0;
                }

                .nav-footer .input-email-wrapper .input-email button[disabled] {
                    cursor: not-allowed;
                }

                .nav-footer .input-email-wrapper .input-email button.success {
                    background: #1BC864;
                }

                    .nav-footer .input-email-wrapper .input-email button.success .img2 {
                        opacity: 1;
                    }

                    .nav-footer .input-email-wrapper .input-email button.success .img1 {
                        opacity: 0;
                    }

            .nav-footer .input-email-wrapper .input-email .result {
                position: absolute;
                bottom: -22px;
                line-height: 14px;
                height: 14px;
                font-size: 12px;
                color: #A2A4A7;
            }

                .nav-footer .input-email-wrapper .input-email .result.error {
                    color: red;
                }

    .nav-footer .other-list {
        display: flex;
        justify-content: center;
        margin: 16px 0;
    }

        .nav-footer .other-list .back-to-top {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

            .nav-footer .other-list .back-to-top img {
                height: 24px;
            }

            .nav-footer .other-list .back-to-top span {
                font-size: 12px;
                color: #ffffff;
                line-height: 20px;
            }

    .nav-footer .icp {
        height: 72px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        background-color: #202020;
    }

        .nav-footer .icp .text-1 {
            text-align: center;
            font-size: 12px;
            color: rgba(255, 255, 255, 0.2);
            line-height: 14px;
        }

        .nav-footer .icp .text-2 {
            text-align: center;
            margin-top: 4px;
        }

            .nav-footer .icp .text-2 a {
                font-size: 12px;
                color: rgba(255, 255, 255, 0.55);
                line-height: 14px;
            }

    .nav-footer .lang-selector .lang-item-current {
        display: flex;
        padding: 0;
    }

    .nav-footer .lang-selector .lang-list {
        bottom: 44px;
        line-height: 14px;
    }

.lang-selector {
    position: relative;
    z-index: 100;
}

    .lang-selector .lang-item-current {
        padding: 8px 0;
        position: relative;
        display: inline-flex;
        align-items: center;
    }

        .lang-selector .lang-item-current .lang-flag {
            width: 16px;
            margin-right: 12px;
        }

        .lang-selector .lang-item-current .lang-text {
            color: #fff;
            font-size: 12px;
        }

    .lang-selector .lang-list {
        display: none;
        position: absolute;
        width: 120px;
        bottom: 32px;
        left: -12px;
        background-color: white;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        padding: 8px 0;
        border-radius: 4px;
    }

        .lang-selector .lang-list .lang-item {
            color: rgba(0, 0, 0, 0.7);
            display: flex;
            align-items: center;
            padding: 8px 0;
        }

            .lang-selector .lang-list .lang-item:hover,
            .lang-selector .lang-list .lang-item:active {
                background: #F2F2F2;
            }

            .lang-selector .lang-list .lang-item .lang-flag {
                margin: 0 12px;
                width: 16px;
            }

            .lang-selector .lang-list .lang-item .lang-text {
                font-weight: normal;
                font-size: 12px;
            }

.modal-buylink {
    position: fixed;
    z-index: 1000;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 12.5%;
}

    .modal-buylink .wrapper {
        position: relative;
        width: 100%;
        background-color: #FFF;
        border-radius: 2px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .modal-buylink .wrapper .title {
            width: 100%;
            padding: 16px;
            padding-right: 30px;
            font-size: 16px;
            line-height: 20px;
            color: rgba(0, 0, 0, 0.7);
            font-weight: bold;
            border-bottom: 1px solid #F2F2F2;
            margin-bottom: 24px;
        }

        .modal-buylink .wrapper .close {
            position: absolute;
            top: 0;
            right: 0;
            padding: 18px;
        }

            .modal-buylink .wrapper .close img {
                display: block;
                height: 12px;
            }

        .modal-buylink .wrapper .link {
            display: flex;
            margin-bottom: 24px;
            flex-direction: column;
            align-items: center;
        }

            .modal-buylink .wrapper .link .icon {
                position: relative;
                display: block;
                width: 176px;
            }

                .modal-buylink .wrapper .link .icon img {
                    display: block;
                    width: 100%;
                    height: 100%;
                }

            .modal-buylink .wrapper .link .text {
                margin-top: 8px;
                text-align: center;
                font-size: 12px;
                color: rgba(0, 0, 0, 0.7);
                font-weight: bold;
                line-height: 16px;
            }

.popup-player {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    display: none;
}

    .popup-player .mask {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background: rgba(0, 0, 0, 0.9);
    }

    .popup-player .video-fr {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .popup-player .no-youtube {
        height: 160px;
        background-color: #000;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .popup-player .no-youtube p {
            color: #fff;
        }
/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fCRc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fABc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fCBc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fBxc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fCxc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fChc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmSU5fBBc4AMP6lQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfCRc4EsA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfABc4EsA.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfCBc4EsA.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfBxc4EsA.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfCxc4EsA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfChc4EsA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(https://static.insta360.com/assets/www/common/fonts/roboto/v20/slices/KFOlCnqEu92Fr1MmYUtfBBc4.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: local('Gilroy Thin'), local('Gilroy-Thin'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-thin.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 100;
    font-display: swap;
    src: local('Gilroy Thin Italic'), local('Gilroy-Thin-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-thinitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: local('Gilroy Ultralight'), local('Gilroy-Ultralight'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-ultralight.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 200;
    font-display: swap;
    src: local('Gilroy Ultralight Italic'), local('Gilroy-Ultralight-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-ultralightitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Gilroy Light'), local('Gilroy-Light'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-light.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: local('Gilroy Light Italic'), local('Gilroy-Light-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-lightitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Gilroy Regular'), local('Gilroy-Regular'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-regular.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: local('Gilroy Regular Italic'), local('Gilroy-Regular-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-regularitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Gilroy Medium'), local('Gilroy-Medium'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-medium.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: local('Gilroy Medium Italic'), local('Gilroy-Medium-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-mediumitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local('Gilroy Semibold'), local('Gilroy-Semibold'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-semibold.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: local('Gilroy Semibold Italic'), local('Gilroy-Semibold-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-semibolditalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Gilroy Bold'), local('Gilroy-Bold'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-bold.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: local('Gilroy Bold Italic'), local('Gilroy-Bold-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-bolditalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local('Gilroy Extrabold'), local('Gilroy-Extrabold'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-extrabold.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 800;
    font-display: swap;
    src: local('Gilroy Extrabold Italic'), local('Gilroy-Extrabold-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-extrabolditalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: local('Gilroy Black'), local('Gilroy-Black'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-black.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy';
    font-style: italic;
    font-weight: 900;
    font-display: swap;
    src: local('Gilroy Black Italic'), local('Gilroy-Black-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-blackitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy Heavy';
    font-style: normal;
    font-display: swap;
    src: local('Gilroy Heavy'), local('Gilroy-Heavy'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-heavy.woff2) format('woff2');
}

@font-face {
    font-family: 'Gilroy Heavy';
    font-style: italic;
    font-display: swap;
    src: local('Gilroy Heavy Italic'), local('Gilroy-Heavy-Italic'), url(https://static.insta360.com/assets/www/common/fonts/gilroy/gilroy-heavyitalic.woff2) format('woff2');
}

@font-face {
    font-family: 'OSP-DIN';
    font-display: swap;
    src: url('https://static.insta360.com/assets/www/common/fonts/osp-din/OSP-DIN.eot');
    /* IE9 Compat Modes */
    src: url('https://static.insta360.com/assets/www/common/fonts/osp-din/OSP-DIN.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://static.insta360.com/assets/www/common/fonts/osp-din/OSP-DIN.woff') format('woff'), /* Pretty Modern Browsers */ url('https://static.insta360.com/assets/www/common/fonts/osp-din/OSP-DIN.ttf') format('truetype'), /* Safari, Android, iOS */ url('https://static.insta360.com/assets/www/common/fonts/osp-din/OSP-DIN.svg#OSP-DIN') format('svg');
    /* Legacy iOS */
}

*,
:after,
:before {
    box-sizing: border-box;
}

body {
    margin: 0;
}

a {
    text-decoration: none;
}

button {
    cursor: pointer;
}

img:not([src]) {
    opacity: 0;
}

#root {
    margin-top: 48px;
    min-height: 400px;
    overflow: hidden;
}

select {
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
}
.sec-case {
    background-color: #F8F9FC;
}

    .sec-case .sec-ct {
        width: 100%;
        padding: 48px 0;
    }

        .sec-case .sec-ct .sec-title {
            width: 300px;
            margin: 0 auto;
            font-size: 24px;
            font-weight: bold;
            color: #2D2D2D;
            text-align: center;
        }

        .sec-case .sec-ct .list {
            position: relative;
            margin-top: 30px;
        }

            .sec-case .sec-ct .list .item {
                display: block;
                width: calc(100% - 32px);
                margin: 0 auto 20px;
                background-color: #ffffff;
            }

                .sec-case .sec-ct .list .item:last-child {
                    margin-bottom: 0;
                }

            .sec-case .sec-ct .list .item-ct {
                width: 100%;
            }

                .sec-case .sec-ct .list .item-ct .img-cover {
                    width: 100%;
                    height: 0;
                    padding-bottom: 75%;
                    position: relative;
                    overflow: hidden;
                }

                    .sec-case .sec-ct .list .item-ct .img-cover img {
                        min-width: 1000%;
                        min-height: 1000%;
                        position: absolute;
                        left: 50%;
                        top: 50%;
                        transform: translate(-50%, -50%) scale(0.1);
                    }

                .sec-case .sec-ct .list .item-ct .item-bottom {
                    padding: 10px 18px 22px;
                }

                    .sec-case .sec-ct .list .item-ct .item-bottom .text1 {
                        line-height: 19px;
                        height: 38px;
                        font-size: 14px;
                        font-weight: bold;
                        color: #000000;
                        margin-bottom: 12px;
                        overflow: hidden;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        text-overflow: ellipsis;
                    }

                    .sec-case .sec-ct .list .item-ct .item-bottom .text2 {
                        width: 135px;
                        height: 14px;
                        line-height: 14px;
                        padding-top: 8px;
                        border-top: 1px solid #DFDFDF;
                        font-size: 12px;
                        color: #AFB1B4;
                    }

.sec-solution {
    background-color: #FFFFFF;
}

    .sec-solution .sec-ct {
        width: 100%;
        margin: 0 auto;
        padding: 48px 0;
    }

        .sec-solution .sec-ct .sec-title {
            font-size: 24px;
            color: #2D2D2D;
            text-align: center;
            font-weight: bold;
        }

        .sec-solution .sec-ct .list {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
        }

            .sec-solution .sec-ct .list .item {
                display: flex;
                flex-direction: column;
                align-items: center;
                margin-bottom: 40px;
            }

                .sec-solution .sec-ct .list .item:last-child {
                    margin-bottom: 0;
                }

                .sec-solution .sec-ct .list .item .img-product {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }

                    .sec-solution .sec-ct .list .item .img-product .img {
                        width: 84%;
                    }

                    .sec-solution .sec-ct .list .item .img-product .img-logo {
                        height: 20px;
                        margin-top: 20px;
                    }

                .sec-solution .sec-ct .list .item .button-group {
                    margin-top: 12px;
                }

                    .sec-solution .sec-ct .list .item .button-group a {
                        display: inline-block;
                        height: 36px;
                        line-height: 36px;
                        padding: 0 12px;
                        background-image: linear-gradient(-135deg, #FFEB00 0%, #FFD200 100%);
                        border-radius: 4px;
                        font-size: 12px;
                        color: #000000;
                        letter-spacing: 0.8px;
                        font-weight: bold;
                    }

.sec-contact {
    background-color: #F8F9FC;
    padding: 48px 26px;
}

    .sec-contact .contact-us {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .sec-contact .contact-us .text1 {
            font-size: 14px;
            color: #000000;
            text-align: center;
            line-height: 20px;
        }

        .sec-contact .contact-us .link {
            display: block;
            height: 48px;
            line-height: 48px;
            text-align: center;
            margin: 25px auto 0;
            padding: 0 18px;
            background-image: linear-gradient(-135deg, #FFEB00 0%, #FFD200 100%);
            border-radius: 4px;
            font-size: 14px;
            color: #000000;
            letter-spacing: 1px;
            font-weight: bold;
            border: none;
        }

button {
    border: none;
    outline: none;
    background: transparent;
}

.header-img {
    position: relative;
    margin-top: 49px;
    width: 100%;
}

    .header-img .img-bg {
        width: 100%;
        display: block;
    }

    .header-img > p {
        margin: 0;
    }

    .header-img .zhezhao {
        position: absolute;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0.6) 3%, rgba(0, 0, 0, 0) 100%);
    }

    .header-img .title1,
    .header-img .title2,
    .header-img .btn {
        margin: 0 auto;
        white-space: pre-wrap;
    }

        .header-img .title1.moveTop50,
        .header-img .title2.moveTop50,
        .header-img .btn.moveTop50 {
            transform: translateY(-50px);
        }

    .header-img .title1 {
        width: 290px;
        font-size: 14px;
        text-align: center;
        line-height: 18px;
        font-weight: bold;
        color: rgba(255, 255, 255, 0.55);
    }

    .header-img .title2 {
        margin-top: 12px;
        width: 290px;
        font-size: 36px;
        text-align: center;
        line-height: 42px;
        color: #FFFFFF;
        font-weight: bold;
    }

    .header-img .btn {
        display: block;
        margin-top: 32px;
        height: 36px;
        padding: 0 20px;
        background: #FFD200;
        border-radius: 22px;
        font-size: 14px;
        color: #000000;
        letter-spacing: 1px;
        font-weight: bold;
        border: none;
    }

.src-introduce {
    background-color: #FFFFFF;
}

    .src-introduce .sec-ct {
        margin: 0 auto;
        padding: 50px 26px;
    }

        .src-introduce .sec-ct .sec-title {
            font-size: 24px;
            color: #2D2D2D;
            text-align: center;
            font-weight: bold;
        }

        .src-introduce .sec-ct .text1,
        .src-introduce .sec-ct .text2 {
            font-size: 14px;
            color: #95979B;
            text-align: center;
            line-height: 24px;
        }

        .src-introduce .sec-ct .text1 {
            margin-top: 32px;
        }

        .src-introduce .sec-ct .text2 {
            margin-top: 9px;
        }

        .src-introduce .sec-ct .text3 {
            margin-top: 19px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

            .src-introduce .sec-ct .text3 .item {
                margin-bottom: 12px;
                display: flex;
            }

                .src-introduce .sec-ct .text3 .item .icon {
                    width: 18px;
                    height: 18px;
                    text-align: center;
                    line-height: 18px;
                    background: #FFD200;
                    border-radius: 50%;
                    font-size: 12px;
                    color: #898A8E;
                }

                .src-introduce .sec-ct .text3 .item .text {
                    margin-left: 8px;
                    font-size: 14px;
                    color: #898A8E;
                    line-height: 18px;
                }

.enterprise-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding-top: 49px;
    z-index: 98;
    text-align: left;
    background-color: rgba(0, 0, 0, 0.9);
    overflow: hidden;
    height: 0;
    transition: height 0.5s ease-in-out;
}

    .enterprise-menu .menu-item {
        display: block;
        padding: 0 16px;
        color: #FFFFFF;
        font-size: 14px;
        white-space: nowrap;
        text-align: center;
        line-height: 32px;
        padding: 11px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

.topAdImg {
    width: 100%;
    background-image: linear-gradient(135deg, #fff, #e3e3e3);
    display: flex;
    justify-content: center;
    overflow: hidden;
    transition: all 0.3s ease;
}

.nav-header-page .product-sub-header ul.menu li.menu-item {
    padding-left: 0;
}
