/**跳转链接样式自定义**/
.header-nav .nav__header-right .contact:hover {
    color:white !important;
    background-color: #469bff;
}

a:hover{
    color: #006ee1 !important;
  }

/** Related Information 样式**/
ul.linklist{
    list-style: inside;
    padding-left: 3em;
    margin-top: 0.5em;
    padding-bottom: 5px;
}
li.linklist{
    margin-bottom: 8px;
}
.relinfo{
    border-top: 1px solid #b0b0b0;
    background: #eee;
    color: #666;
}
.wh_related_links{
    margin-top:80px;
  }
a, a:hover, a:visited {
    color: #006ee1;
}
var{
    color:#df0b0b;
}
li{
    margin-top: 0.3em;
}
/**跳转文本高亮**/
.highlighted {
    background-color: #FAD87F;
    transition: background-color 2s; /* 过渡效果，用于平滑地改变背景颜色 */
  }
/**代码块自定义设置**/
.comment {
    color:gray;
}
/** 标题图标设置**/
.wh_expand_btn:before {
    margin-left: -12px;
    font-weight: 600;
    font-size: 13px;
}

@font-face {
    font-family: iconfont;
    src: url("/font/iconfont.woff2?t=1681107305027") format("woff2"), url("/font/iconfont.woff?t=1681107305027") format("woff"), url("/font/iconfont.ttf?t=1681107305027") format("truetype")
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
/* 对 th 和 td 都做垂直居中处理，仅限正文区域表格 */
.wh_topic table th,
.wh_topic table td,
.wh_topic_content table th,
.wh_topic_content table td,
.wh_content_area table th,
.wh_content_area table td {
  vertical-align: middle !important;
}


table.noborder,
table.noborder td,
table.noborder th {
  border: none !important;
}

.icon-aiot1:before {
    content: "\e6c3"
}

.icon-query-01:before {
    content: "\e6c2"
}

.icon-various-data-push1:before {
    content: "\e6c1"
}

.icon-a-HighAccuracy:before {
    content: "\e6bb"
}

.icon-easy-integration:before {
    content: "\e6bc"
}

.icon-diversified-models:before {
    content: "\e6bd"
}

.icon-maximized-flexibility:before {
    content: "\e6be"
}

.icon-precise-capture:before {
    content: "\e6bf"
}

.icon-various-data-push:before {
    content: "\e6c0"
}

.icon-icon-top:before {
    content: "\e6ba"
}

.icon-vehicle-attributes-recognition-01:before {
    content: "\e6b5"
}

.icon-smart-video-synopsis-01:before {
    content: "\e6b6"
}

.icon-event-alarm-01:before {
    content: "\e6b7"
}

.icon-thumbnail-retrival-01:before {
    content: "\e6b8"
}

.icon-plate-attributes-recognition-01:before {
    content: "\e6b9"
}

.icon-icon-devices:before {
    content: "\e6b4"
}

.icon-cat:before {
    content: "\eb21"
}

.icon-icon_multi-server:before {
    content: "\e6ae"
}

.icon-icon_dual-giga:before {
    content: "\e6af"
}

.icon-icon_raid-supported:before {
    content: "\e6b0"
}

.icon-icon_windows-licensed:before {
    content: "\e6b1"
}

.icon-a-icon_nm-failover:before {
    content: "\e6b2"
}

.icon-icon_vms:before {
    content: "\e6b3"
}

.icon-resource:before {
    content: "\eb20"
}

.icon-light:before {
    content: "\eb1d"
}

.icon-support1:before {
    content: "\eb1e"
}

.icon-a-icon_Research:before {
    content: "\eb1f"
}

.icon-coordinate1:before {
    content: "\eb14"
}

.icon-search-1:before {
    content: "\eb15"
}

.icon-arrow-right1:before {
    content: "\eb16"
}

.icon-weixin:before {
    content: "\eb17"
}

.icon-skype2:before {
    content: "\eb18"
}

.icon-email2:before {
    content: "\eb19"
}

.icon-top1:before {
    content: "\eb1a"
}

.icon-telephone:before {
    content: "\eb1b"
}

.icon-sales-distribution:before {
    content: "\eb1c"
}

.icon-live-01:before {
    content: "\e6ad"
}

.icon-aiot:before {
    content: "\e6ac"
}

.icon-onvif-01:before {
    content: "\e6ab"
}

.icon-management-system:before {
    content: "\e6a4"
}

.icon-ai:before {
    content: "\e6a5"
}

.icon-accuracy:before {
    content: "\e6a6"
}

.icon-area:before {
    content: "\e6a7"
}

.icon-professional-flow:before {
    content: "\e6a8"
}

.icon-gdpr:before {
    content: "\e6a9"
}

.icon-integrated1:before {
    content: "\e6aa"
}

.icon-security4:before {
    content: "\e6a2"
}

.icon-iot3:before {
    content: "\e6a3"
}

.icon-camera:before {
    content: "\eb10"
}

.icon-earth:before {
    content: "\eb0f"
}

.icon-iot2:before {
    content: "\eb0e"
}

.icon-a-5g1:before {
    content: "\e69e"
}

.icon-indoor-air-quality:before {
    content: "\e6a0"
}

.icon-energy-efficiency-buildings:before {
    content: "\e69f"
}

.icon-environmental-sensing:before {
    content: "\e6a1"
}

.icon-video-security:before {
    content: "\e69b"
}

.icon-intelligent-traffic:before {
    content: "\e69c"
}

.icon-people-counting:before {
    content: "\e69d"
}

.icon-interact:before {
    content: "\e698"
}

.icon-understand:before {
    content: "\e699"
}

.icon-sense:before {
    content: "\e69a"
}

.icon-iot1:before {
    content: "\e66c"
}

.icon-security3:before {
    content: "\e697"
}

.icon-security2:before {
    content: "\eb0c"
}

.icon-slide:before {
    content: "\e696"
}

.icon-carg:before {
    content: "\e690"
}

.icon-revenue:before {
    content: "\e691"
}

.icon-partners:before {
    content: "\e692"
}

.icon-countries:before {
    content: "\e693"
}

.icon-center:before {
    content: "\e694"
}

.icon-staff:before {
    content: "\e695"
}

.icon-detection-in-darkness-01:before {
    content: "\e68b"
}

.icon-bi-directional-01:before {
    content: "\e68c"
}

.icon-ultra-high-accuracy-01:before {
    content: "\e68d"
}

.icon-gdpr-01:before {
    content: "\e68e"
}

.icon-anonymous-detection-01:before {
    content: "\e68f"
}

.icon-icon_gps:before {
    content: "\e68a"
}

.icon-icon_wifi:before {
    content: "\e689"
}

.icon-icon_4g:before {
    content: "\e685"
}

.icon-icon_deployment-phone:before {
    content: "\e686"
}

.icon-icon_radar-line:before {
    content: "\e687"
}

.icon-icon_solar-powered:before {
    content: "\e688"
}

.icon-radar-triggered:before {
    content: "\eb0b"
}

.icon-a-peoplecount:before {
    content: "\e684"
}

.icon-icon_gdpr:before {
    content: "\e683"
}

.icon-icon_tof:before {
    content: "\e67f"
}

.icon-icon_privacy:before {
    content: "\e680"
}

.icon-icon_accuracy:before {
    content: "\e681"
}

.icon-icon_object-capture:before {
    content: "\e682"
}

.icon-radar33:before {
    content: "\e67e"
}

.icon-icon-solar-powered:before {
    content: "\e67c"
}

.icon-icon-object-capture:before {
    content: "\e67d"
}

.icon-parking-management:before {
    content: "\e67b"
}

.icon-cars:before {
    content: "\e67a"
}

.icon-driver:before {
    content: "\e679"
}

.icon-academy-01:before {
    content: "\e678"
}

.icon-how:before {
    content: "\e675"
}

.icon-a-lorawanround:before {
    content: "\e676"
}

.icon-dual:before {
    content: "\e677"
}

.icon-a-wiegandround:before {
    content: "\e672"
}

.icon-a-ailpr:before {
    content: "\e673"
}

.icon-a-supplementlight:before {
    content: "\e674"
}

.icon-lorawan1:before {
    content: "\e671"
}

.icon-down1:before {
    content: "\e66f"
}

.icon-wiegand:before {
    content: "\e670"
}

.icon-icon-tuxiang-v2-01-01:before {
    content: "\e66d"
}

.icon-icon-gongju-v2-01-01-01:before {
    content: "\e66e"
}

.icon-icon-lorawan-V2-01:before {
    content: "\e66a"
}

.icon-icon-man-v2-01:before {
    content: "\e66b"
}

.icon-icon-NDAA-v2-01-01:before {
    content: "\e65d"
}

.icon-icon-wifi-v2-01-01:before {
    content: "\e65e"
}

.icon-icon-dunpai-1-01:before {
    content: "\e65f"
}

.icon-icon-xiangzi-1-01:before {
    content: "\e660"
}

.icon-icon-xiaolian-v2-01-01:before {
    content: "\e661"
}

.icon-icon-hld-v2-01-01:before {
    content: "\e662"
}

.icon-icon-3in1-v2-01-01:before {
    content: "\e663"
}

.icon-icon-rebei-v2-01-01:before {
    content: "\e664"
}

.icon-icon-sgouji-v2-01-01:before {
    content: "\e665"
}

.icon-icon-100fps-v2-01:before {
    content: "\e666"
}

.icon-icon-4g-v2-01-01:before {
    content: "\e667"
}

.icon-icon-dianyuan-v2-01-01:before {
    content: "\e668"
}

.icon-icon-xiangzi-1-011:before {
    content: "\e669"
}

.icon-icon-xing-01-01:before {
    content: "\e65c"
}

.icon-raid1:before {
    content: "\eb09"
}

.icon-lorawan:before {
    content: "\eb0a"
}

.icon-icon-CMS-v2-01-01:before {
    content: "\e65a"
}

.icon-icon-switch-v2-01-01-01:before {
    content: "\e65b"
}

.icon-kefu:before {
    content: "\e659"
}

.icon-online-demo1:before {
    content: "\e62c"
}

.icon-a-icon-comingsoon-01:before {
    content: "\e62d"
}

.icon-a-icon-ProductTraining-01:before {
    content: "\e62e"
}

.icon-a-icon-TrainingVideoCenter-01:before {
    content: "\e656"
}

.icon-a-icon-TechnicalTraining-01:before {
    content: "\e657"
}

.icon-a-icon-NewProductTraining-01:before {
    content: "\e658"
}

.icon-a-icon-QuickStart-v2-01:before {
    content: "\e628"
}

.icon-icon-HTML-v2-01:before {
    content: "\e629"
}

.icon-a-icon-UserManual-v2-01:before {
    content: "\e62a"
}

.icon-a-icon-ReleaseNote-v2-01:before {
    content: "\e62b"
}

.icon-icon-download-v2-01:before {
    content: "\e624"
}

.icon-icon-note-v2-01:before {
    content: "\e625"
}

.icon-icon-Open-v2-01:before {
    content: "\e626"
}

.icon-icon-Email-v2-01:before {
    content: "\e627"
}

.icon-icon-IPC-v2-01:before {
    content: "\e61f"
}

.icon-icon-Security-v2-01:before {
    content: "\e620"
}

.icon-icon-text-v2-01:before {
    content: "\e621"
}

.icon-icon-pdf-v2-01:before {
    content: "\e622"
}

.icon-icon-skype-v2-01:before {
    content: "\e623"
}

.icon-wiper:before {
    content: "\eb04"
}

.icon-fill-light:before {
    content: "\eb03"
}

.icon-client-trigger-event:before {
    content: "\eaee"
}

.icon-camera-fov-visible:before {
    content: "\eaef"
}

.icon-event-overlay:before {
    content: "\eaf0"
}

.icon-designed-for-demarding:before {
    content: "\eaf1"
}

.icon-event-alarm-flashing-prompt:before {
    content: "\eaf2"
}

.icon-device-group-list:before {
    content: "\eaf3"
}

.icon-relable-fie-system:before {
    content: "\eaf4"
}

.icon-multi-clent-management:before {
    content: "\eaf5"
}

.icon-privacy-mask-overlay:before {
    content: "\eaf6"
}

.icon-map-preset:before {
    content: "\eaf7"
}

.icon-tour-tour-plans:before {
    content: "\eaf8"
}

.icon-file-transcoding:before {
    content: "\eaf9"
}

.icon-system-server-event:before {
    content: "\eafa"
}

.icon-a-60FPS:before {
    content: "\e61e"
}

.icon-a-OutdoorSpaces:before {
    content: "\e619"
}

.icon-a-ParkingLotatNight:before {
    content: "\e61a"
}

.icon-a-F10Aperture:before {
    content: "\e61b"
}

.icon-a-30mIllumination:before {
    content: "\e61c"
}

.icon-Retails:before {
    content: "\e61d"
}

.icon-twitter:before {
    content: "\e618"
}

.icon-a-ins-011:before {
    content: "\e617"
}

.icon-a-COLOR1:before {
    content: "\e616"
}

.icon-a-COLOR:before {
    content: "\eaec"
}

.icon-wangluo:before {
    content: "\ea7e"
}

.icon-great-hemisphere:before {
    content: "\ea7c"
}

.icon-click-finger:before {
    content: "\e655"
}

.icon-one:before {
    content: "\e64d"
}

.icon-time:before {
    content: "\e64e"
}

.icon-date:before {
    content: "\e64f"
}

.icon-right-v2:before {
    content: "\e650"
}

.icon-arrow-full-right-v2:before {
    content: "\e651"
}

.icon-left-v2:before {
    content: "\e652"
}

.icon-three:before {
    content: "\e653"
}

.icon-two:before {
    content: "\e654"
}

.icon-ndaa1:before {
    content: "\e60e"
}

.icon-right:before {
    content: "\ea4b"
}

.icon-left:before {
    content: "\ea4c"
}

.icon-down:before {
    content: "\ea4d"
}

.icon-a-tiwen1:before {
    content: "\e64c"
}

.icon-a-12mp:before {
    content: "\ea4a"
}

.icon-a-5G:before {
    content: "\ea49"
}

.icon-ndaa:before {
    content: "\ea47"
}

.icon-eol:before {
    content: "\ea48"
}

.icon-wireless-router:before {
    content: "\ea45"
}

.icon-remote-management1:before {
    content: "\ea46"
}

.icon-a-4g-lte:before {
    content: "\ea43"
}

.icon-vpn-lock:before {
    content: "\ea44"
}

.icon-privacy-masking:before {
    content: "\ea42"
}

.icon-onvif-st:before {
    content: "\ea41"
}

.icon-radar:before {
    content: "\ea40"
}

.icon-logout:before {
    content: "\ea3f"
}

.icon-upload:before {
    content: "\ea3c"
}

.icon-arrow-down:before {
    content: "\ea3d"
}

.icon-loading:before {
    content: "\ea3e"
}

.icon-jump:before {
    content: "\ea3b"
}

.icon-videowall-remote-management:before {
    content: "\ea3a"
}

.icon-system-clientserver-architecture:before {
    content: "\ea2f"
}

.icon-system-multi-disk-recording:before {
    content: "\ea30"
}

.icon-system-hardware-friendly:before {
    content: "\ea31"
}

.icon-system-multi-client-management:before {
    content: "\ea32"
}

.icon-system-adaptive-streaming:before {
    content: "\ea33"
}

.icon-videowall-multiple-display-modes:before {
    content: "\ea34"
}

.icon-a-system-nm-failover:before {
    content: "\ea35"
}

.icon-system-status-display:before {
    content: "\ea36"
}

.icon-system-reliable-file-system:before {
    content: "\ea37"
}

.icon-sytem-designed-for-demanding-solutions:before {
    content: "\ea38"
}

.icon-videowall-powerful-control:before {
    content: "\ea39"
}

.icon-settings-comprehensive-settings:before {
    content: "\ea2e"
}

.icon-settings-shortcut-key:before {
    content: "\ea2a"
}

.icon-settings-online-update:before {
    content: "\ea2b"
}

.icon-settings-device-management:before {
    content: "\ea2c"
}

.icon-settings-user-management:before {
    content: "\ea2d"
}

.icon-playback-quick-tag:before {
    content: "\ea29"
}

.icon-playback-smart-search:before {
    content: "\ea21"
}

.icon-playback-adjustable-playback-speed:before {
    content: "\ea22"
}

.icon-playback-split-playback:before {
    content: "\ea23"
}

.icon-playback-playback-mode:before {
    content: "\ea24"
}

.icon-playback-playback-option:before {
    content: "\ea25"
}

.icon-playback-important-video-locked:before {
    content: "\ea26"
}

.icon-playback-fisheye-playback:before {
    content: "\ea27"
}

.icon-playback-playback-timeline:before {
    content: "\ea28"
}

.icon-multi-monitor-maximized-number-of-channels:before {
    content: "\ea1e"
}

.icon-multi-monitor-unlimited-number-of-screens:before {
    content: "\ea1f"
}

.icon-multi-monitor-multi-monitor-interface:before {
    content: "\ea20"
}

.icon-liveview-self-adaptive-layout:before {
    content: "\ea1d"
}

.icon-liveview-ptz-control:before {
    content: "\ea19"
}

.icon-liveview-tour-plans:before {
    content: "\ea1a"
}

.icon-liveview-fisheye-dewarping:before {
    content: "\ea1b"
}

.icon-system-foldable-multifunction-panel:before {
    content: "\ea1c"
}

.icon-liveview-intuitive-thumbnails:before {
    content: "\ea16"
}

.icon-liveview-instant-playback:before {
    content: "\ea17"
}

.icon-liveview-simultaneously-playing:before {
    content: "\ea18"
}

.icon-export-multiple-export-formats:before {
    content: "\ea13"
}

.icon-export-timelapse-export:before {
    content: "\ea14"
}

.icon-export-osd-of-exported-video:before {
    content: "\ea15"
}

.icon-export-fast-search-retrieve:before {
    content: "\ea12"
}

.icon-events-vca-configuration-for-milesight-cameras:before {
    content: "\ea0e"
}

.icon-events-http-event:before {
    content: "\ea0f"
}

.icon-events-event-ruleslinkage-alarm-actions:before {
    content: "\ea10"
}

.icon-events-onvif-motion-detection:before {
    content: "\ea11"
}

.icon-emap-map-sharing:before {
    content: "\ea0a"
}

.icon-emap-interactive-emap:before {
    content: "\ea0b"
}

.icon-emap-event-alarm-flashing-prompt:before {
    content: "\ea0c"
}

.icon-emap-multi-layer-map:before {
    content: "\ea0d"
}

.icon-anpr-anpr-list-group:before {
    content: "\e9fa"
}

.icon-anpr-anpr-smart-search:before {
    content: "\e9fe"
}

.icon-anpr-black-white-visitor-detection:before {
    content: "\ea07"
}

.icon-anpr-anpr-preview:before {
    content: "\ea09"
}

.icon-anpr-anpr-settings:before {
    content: "\ea06"
}

.icon-anpr-radar-data-integration:before {
    content: "\ea01"
}

.icon-anpr-linkage-alarm-actions:before {
    content: "\ea08"
}

.icon-logo-1-new:before {
    content: "\e9e4"
}

.icon-youtube-black:before {
    content: "\e64b"
}

.icon-starlight-sensor:before {
    content: "\e63a"
}

.icon-wdr-3in1:before {
    content: "\e648"
}

.icon-download-app:before {
    content: "\e9c7"
}

.icon-help-center:before {
    content: "\e9c3"
}

.icon-logo-new-white:before {
    content: "\e9c1"
}

.icon-logo-new:before {
    content: "\e9be"
}

.icon-remote-management:before {
    content: "\e63f"
}

.icon-a-8gb:before {
    content: "\e640"
}

.icon-mechanical:before {
    content: "\e641"
}

.icon-wifi-dual:before {
    content: "\e642"
}

.icon-versatile:before {
    content: "\e643"
}

.icon-integrated:before {
    content: "\e644"
}

.icon-starvis-starligh:before {
    content: "\e645"
}

.icon-ip67-rating:before {
    content: "\e646"
}

.icon-smart-ir:before {
    content: "\e647"
}

.icon-a-100fps-high:before {
    content: "\e649"
}

.icon-a-ip674kv:before {
    content: "\e64a"
}

.icon-a-0002lux:before {
    content: "\e62f"
}

.icon-a-4k-video:before {
    content: "\e630"
}

.icon-a-25gbps:before {
    content: "\e631"
}

.icon-a-44mimo:before {
    content: "\e632"
}

.icon-a-3in1-super-wdr:before {
    content: "\e633"
}

.icon-a-12x-optical:before {
    content: "\e634"
}

.icon-iot-v1:before {
    content: "\e635"
}

.icon-ai-deep:before {
    content: "\e636"
}

.icon-antenna:before {
    content: "\e637"
}

.icon-a-icon-dualsim:before {
    content: "\e638"
}

.icon-interfaces:before {
    content: "\e639"
}

.icon-a-5g-nr:before {
    content: "\e63b"
}

.icon-qualcomm:before {
    content: "\e63c"
}

.icon-a-nsasa:before {
    content: "\e63d"
}

.icon-a-512mb:before {
    content: "\e63e"
}

.icon-channel-partner:before {
    content: "\e967"
}

.icon-close1:before {
    content: "\e968"
}

.icon-contact-us1:before {
    content: "\e969"
}

.icon-company:before {
    content: "\e96a"
}

.icon-contect-us-sj:before {
    content: "\e96b"
}

.icon-convenience:before {
    content: "\e96c"
}

.icon-datasheet-2:before {
    content: "\e96e"
}

.icon-customer-oriented:before {
    content: "\e96f"
}

.icon-download-center:before {
    content: "\e970"
}

.icon-datasheet1:before {
    content: "\e972"
}

.icon-download1:before {
    content: "\e973"
}

.icon-design1:before {
    content: "\e974"
}

.icon-efficiency:before {
    content: "\e977"
}

.icon-error:before {
    content: "\e979"
}

.icon-email1:before {
    content: "\e97a"
}

.icon-fax1:before {
    content: "\e97c"
}

.icon-evnets:before {
    content: "\e97e"
}

.icon-feedback:before {
    content: "\e980"
}

.icon-firmware-2:before {
    content: "\e983"
}

.icon-firmware1:before {
    content: "\e989"
}

.icon-hollow-add:before {
    content: "\e98a"
}

.icon-hollow-tel:before {
    content: "\e98b"
}

.icon-intelligent-management1:before {
    content: "\e98d"
}

.icon-integrity:before {
    content: "\e98e"
}

.icon-interoperability:before {
    content: "\e98f"
}

.icon-innovation:before {
    content: "\e990"
}

.icon-hdd-Installation-structure:before {
    content: "\e992"
}

.icon-logo-1:before {
    content: "\e998"
}

.icon-learn-more:before {
    content: "\e994"
}

.icon-look:before {
    content: "\e996"
}

.icon-iot:before {
    content: "\e99a"
}

.icon-lpr1:before {
    content: "\e99c"
}

.icon-logo1:before {
    content: "\e99d"
}

.icon-mini-series:before {
    content: "\e99e"
}

.icon-newsletters:before {
    content: "\e99f"
}

.icon-news:before {
    content: "\e9a0"
}

.icon-nvr1:before {
    content: "\e9a3"
}

.icon-newsletters-tag:before {
    content: "\e9a7"
}

.icon-nvr-mobile-connection:before {
    content: "\e9b2"
}

.icon-online-demo:before {
    content: "\e9bd"
}

.icon-partner-portal:before {
    content: "\e9c0"
}

.icon-open:before {
    content: "\e9c2"
}

.icon-panoramic-series:before {
    content: "\e9c5"
}

.icon-password1:before {
    content: "\e9c6"
}

.icon-poe-nvr:before {
    content: "\e9c8"
}

.icon-performance1:before {
    content: "\e9c9"
}

.icon-play1:before {
    content: "\e9ca"
}

.icon-press:before {
    content: "\e9cc"
}

.icon-pro-series:before {
    content: "\e9ce"
}

.icon-ptz:before {
    content: "\e9d0"
}

.icon-project-registration:before {
    content: "\e9d2"
}

.icon-security1:before {
    content: "\e9d3"
}

.icon-recruitment:before {
    content: "\e9d4"
}

.icon-responsiveness:before {
    content: "\e9d5"
}

.icon-reliability1:before {
    content: "\e9d6"
}

.icon-professionalism:before {
    content: "\e9d7"
}

.icon-search2:before {
    content: "\e9d8"
}

.icon-sd-card:before {
    content: "\e9d9"
}

.icon-skype1:before {
    content: "\e9da"
}

.icon-showptz-1:before {
    content: "\e9db"
}

.icon-sign-up:before {
    content: "\e9dc"
}

.icon-star:before {
    content: "\e9de"
}

.icon-skype-id:before {
    content: "\e9df"
}

.icon-solution:before {
    content: "\e9e1"
}

.icon-smart-ir-ll:before {
    content: "\e9e2"
}

.icon-software-2:before {
    content: "\e9e3"
}

.icon-troubleshooting:before {
    content: "\e9e7"
}

.icon-tel:before {
    content: "\e9e8"
}

.icon-super-wdr1:before {
    content: "\e9e9"
}

.icon-super-wdr-2:before {
    content: "\e9eb"
}

.icon-support:before {
    content: "\e9ec"
}

.icon-surge-protection1:before {
    content: "\e9ed"
}

.icon-value-added:before {
    content: "\e9ee"
}

.icon-user-manual-2:before {
    content: "\e9f0"
}

.icon-ul1:before {
    content: "\e9f1"
}

.icon-video-center:before {
    content: "\e9f2"
}

.icon-user-manual1:before {
    content: "\e9f3"
}

.icon-video-demo:before {
    content: "\e9f4"
}

.icon-verify1:before {
    content: "\e9f5"
}

.icon-vca-v2:before {
    content: "\e9f6"
}

.icon-hot:before {
    content: "\e9f8"
}

.icon-why-milesight:before {
    content: "\e9f9"
}

.icon-versatile-interfaces1:before {
    content: "\e9fb"
}

.icon-youtube1:before {
    content: "\e9fc"
}

.icon-white-paper:before {
    content: "\e9fd"
}

.icon-win-win:before {
    content: "\e9ff"
}

.icon-user-friendliness1:before {
    content: "\ea00"
}

.icon-video-demo-2:before {
    content: "\e9f7"
}

.icon-heater1:before {
    content: "\ea02"
}

.icon-ptz-motor:before {
    content: "\ea03"
}

.icon-lens-options:before {
    content: "\ea04"
}

.icon-logo-2:before {
    content: "\ea05"
}

.icon-address1:before {
    content: "\e950"
}

.icon-account1:before {
    content: "\e952"
}

.icon-address-2:before {
    content: "\e953"
}

.icon-about-us:before {
    content: "\e954"
}

.icon-three-d-radar:before {
    content: "\e955"
}

.icon-add:before {
    content: "\e956"
}

.icon-accessories:before {
    content: "\e957"
}

.icon-ai-01:before {
    content: "\e95a"
}

.icon-ai1:before {
    content: "\e95c"
}

.icon-aesthetics:before {
    content: "\e95d"
}

.icon-audio-in-out:before {
    content: "\e95e"
}

.icon-auto-tracking1:before {
    content: "\e961"
}

.icon-arrow-right-thin-1:before {
    content: "\e95f"
}

.icon-case-studies:before {
    content: "\e963"
}

.icon-back:before {
    content: "\e964"
}

.icon-chat:before {
    content: "\e965"
}

.icon-a-5g:before {
    content: "\e612"
}

.icon-IoT-2:before {
    content: "\e615"
}

.icon-register:before {
    content: "\e613"
}

.icon-gift:before {
    content: "\e614"
}

.icon-heater:before {
    content: "\e60f"
}

.icon-a-ptzmotor:before {
    content: "\e610"
}

.icon-a-lensoptions:before {
    content: "\e611"
}

.icon-arrow-right-full:before {
    content: "\e8db"
}

.icon-check:before {
    content: "\e88b"
}

.icon-close:before {
    content: "\e841"
}

.icon-early-warning:before {
    content: "\e83d"
}

.icon-showptz:before {
    content: "\e83e"
}

.icon-geographic-location:before {
    content: "\e83f"
}

.icon-performance:before {
    content: "\e835"
}

.icon-drop-down:before {
    content: "\e836"
}

.icon-flexibility:before {
    content: "\e837"
}

.icon-extensibility:before {
    content: "\e838"
}

.icon-reliability:before {
    content: "\e839"
}

.icon-security:before {
    content: "\e83a"
}

.icon-user-friendliness:before {
    content: "\e83b"
}

.icon-intelligence:before {
    content: "\e83c"
}

.icon-audio-in:before {
    content: "\e808"
}

.icon-advanced-heat-map:before {
    content: "\e809"
}

.icon-alarm-in:before {
    content: "\e80a"
}

.icon-anr:before {
    content: "\e80b"
}

.icon-cyber-security:before {
    content: "\e80c"
}

.icon-defog:before {
    content: "\e80d"
}

.icon-dual-stream:before {
    content: "\e80e"
}

.icon-exquisite-appearance:before {
    content: "\e80f"
}

.icon-auto-tracking:before {
    content: "\e810"
}

.icon-dual-screen-output:before {
    content: "\e811"
}

.icon-en-50155:before {
    content: "\e812"
}

.icon-html5:before {
    content: "\e813"
}

.icon-high-quality-deblur:before {
    content: "\e814"
}

.icon-hdmi:before {
    content: "\e815"
}

.icon-extend-mode:before {
    content: "\e816"
}

.icon-low-consumption:before {
    content: "\e817"
}

.icon-ir:before {
    content: "\e818"
}

.icon-mic:before {
    content: "\e819"
}

.icon-ip67:before {
    content: "\e81a"
}

.icon-lpr:before {
    content: "\e81b"
}

.icon-online-upgrade:before {
    content: "\e81c"
}

.icon-plug-play:before {
    content: "\e81d"
}

.icon-p2p:before {
    content: "\e81e"
}

.icon-quiet-operation:before {
    content: "\e81f"
}

.icon-raid:before {
    content: "\e820"
}

.icon-ms3d:before {
    content: "\e821"
}

.icon-a-n1-hot-spare:before {
    content: "\e822"
}

.icon-transcoding:before {
    content: "\e823"
}

.icon-motion-detection:before {
    content: "\e824"
}

.icon-hardware:before {
    content: "\e825"
}

.icon-poe:before {
    content: "\e826"
}

.icon-ul:before {
    content: "\e828"
}

.icon-wdr-3-in-1:before {
    content: "\e829"
}

.icon-wdr-140db:before {
    content: "\e82a"
}

.icon-uhd-2160p:before {
    content: "\e82b"
}

.icon-hot-spare:before {
    content: "\e82c"
}

.icon-ieee:before {
    content: "\e82d"
}

.icon-wdr-120db:before {
    content: "\e82e"
}

.icon-vga:before {
    content: "\e82f"
}

.icon-ms256g:before {
    content: "\e830"
}

.icon-surge-protection:before {
    content: "\e831"
}

.icon-vandal-proof1:before {
    content: "\e832"
}

.icon-watermark:before {
    content: "\e833"
}

.icon-ms3-axis:before {
    content: "\e834"
}

.icon-intelligent-management:before {
    content: "\e7ff"
}

.icon-ms4k:before {
    content: "\e807"
}

.icon-h265-plus:before {
    content: "\e806"
}

.icon-greate-flexibility:before {
    content: "\e7fa"
}

.icon-anpr:before {
    content: "\e7fb"
}

.icon-onvif1:before {
    content: "\e7fc"
}

.icon-trusted-reliability:before {
    content: "\e7fd"
}

.icon-super-display:before {
    content: "\e7fe"
}

.icon-versatile-interfaces:before {
    content: "\e800"
}

.icon-structure-design:before {
    content: "\e801"
}

.icon-h265:before {
    content: "\e802"
}

.icon-aesthetics-design:before {
    content: "\e803"
}

.icon-thermal-design:before {
    content: "\e804"
}

.icon-hdd-installation-structure:before {
    content: "\e805"
}

.icon-super-wdr:before {
    content: "\e7f4"
}

.icon-vca:before {
    content: "\e7f5"
}

.icon-sip:before {
    content: "\e7f6"
}

.icon-weather-proof:before {
    content: "\e7f7"
}

.icon-vandal-proof:before {
    content: "\e7f8"
}

.icon-arrow-right-thin:before {
    content: "\e7e9"
}

.icon-nvr:before {
    content: "\e7d5"
}

.icon-vms:before {
    content: "\e7d6"
}

.icon-ipc:before {
    content: "\e7d7"
}

.icon-convey:before {
    content: "\e7d8"
}

.icon-youtube:before {
    content: "\e60d"
}

.icon-round-triangle:before {
    content: "\e60c"
}

.icon-download:before {
    content: "\e60b"
}

.icon-subscribe-company:before {
    content: "\e607"
}

.icon-subscribe-email:before {
    content: "\e608"
}

.icon-subscribe-name:before {
    content: "\e609"
}

.icon-subscribe-country:before {
    content: "\e60a"
}

.icon-search1:before {
    content: "\e605"
}

.icon-total:before {
    content: "\e606"
}

.icon-subscribe:before {
    content: "\e604"
}

.icon-company-name:before {
    content: "\e603"
}

.icon-subject:before {
    content: "\e602"
}

.icon-country:before {
    content: "\e601"
}

.icon-software:before {
    content: "\e7b7"
}

.icon-firmware:before {
    content: "\e7b8"
}

.icon-datasheet:before {
    content: "\e7b9"
}

.icon-user-manual:before {
    content: "\e7ba"
}

.icon-verify:before {
    content: "\e7b5"
}

.icon-logo:before {
    content: "\e7b6"
}

.icon-account:before {
    content: "\e7ae"
}

.icon-partner-protal:before {
    content: "\e7b0"
}

.icon-password:before {
    content: "\e7b1"
}

.icon-design:before {
    content: "\e7b2"
}

.icon-market:before {
    content: "\e7b3"
}

.icon-en:before {
    content: "\e7b4"
}

.icon-skype-line:before {
    content: "\e7a5"
}

.icon-address:before {
    content: "\e79f"
}

.icon-coordinate:before {
    content: "\e7a0"
}

.icon-phone-line:before {
    content: "\e7a1"
}

.icon-email1-line:before {
    content: "\e7a2"
}

.icon-fax:before {
    content: "\e7a3"
}

.icon-location:before {
    content: "\e7a4"
}

.icon-onvif:before {
    content: "\e79c"
}

.icon-starlight:before {
    content: "\e79e"
}

.icon-arrow-full-right:before {
    content: "\e706"
}

.icon-arrow-right:before {
    content: "\e6f7"
}

.icon-facebook:before {
    content: "\e6f8"
}

.icon-menu:before {
    content: "\e6f9"
}

.icon-play:before {
    content: "\e6fa"
}

.icon-book:before {
    content: "\e6fb"
}

.icon-email:before {
    content: "\e6fc"
}

.icon-case-study:before {
    content: "\e6fd"
}

.icon-contact-us:before {
    content: "\e6fe"
}

.icon-linkin:before {
    content: "\e6ff"
}

.icon-top:before {
    content: "\e700"
}

.icon-setting:before {
    content: "\e701"
}

.icon-skype:before {
    content: "\e702"
}

.icon-search:before {
    content: "\e703"
}

.icon-newsletter:before {
    content: "\e704"
}

.icon-iphone:before {
    content: "\e705"
}

/*!
 * animate.css - https://animate.style/
 * Version - 4.1.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2020 Animate.css
 */
:root {
    --animate-duration: 1s;
    --animate-delay: 1s;
    --animate-repeat: 1
}

.animate__animated {
    animation-duration: 1s;
    animation-duration: var(--animate-duration);
    animation-fill-mode: both
}

.animate__animated.animate__infinite {
    animation-iteration-count: infinite
}

.animate__animated.animate__repeat-1 {
    animation-iteration-count: 1;
    animation-iteration-count: var(--animate-repeat)
}

.animate__animated.animate__repeat-2 {
    animation-iteration-count: 2;
    animation-iteration-count: calc(var(--animate-repeat)*2)
}

.animate__animated.animate__repeat-3 {
    animation-iteration-count: 3;
    animation-iteration-count: calc(var(--animate-repeat)*3)
}

.animate__animated.animate__delay-1s {
    animation-delay: 1s;
    animation-delay: var(--animate-delay)
}

.animate__animated.animate__delay-2s {
    animation-delay: 2s;
    animation-delay: calc(var(--animate-delay)*2)
}

.animate__animated.animate__delay-3s {
    animation-delay: 3s;
    animation-delay: calc(var(--animate-delay)*3)
}

.animate__animated.animate__delay-4s {
    animation-delay: 4s;
    animation-delay: calc(var(--animate-delay)*4)
}

.animate__animated.animate__delay-5s {
    animation-delay: 5s;
    animation-delay: calc(var(--animate-delay)*5)
}

.animate__animated.animate__faster {
    animation-duration: .5s;
    animation-duration: calc(var(--animate-duration)/2)
}

.animate__animated.animate__fast {
    animation-duration: .8s;
    animation-duration: calc(var(--animate-duration)*0.8)
}

.animate__animated.animate__slow {
    animation-duration: 2s;
    animation-duration: calc(var(--animate-duration)*2)
}

.animate__animated.animate__slower {
    animation-duration: 3s;
    animation-duration: calc(var(--animate-duration)*3)
}

@media (prefers-reduced-motion:reduce),
print {
    .animate__animated {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
        animation-iteration-count: 1 !important
    }

    .animate__animated[class*=Out] {
        opacity: 0
    }
}

@keyframes bounce {

    0%,
    20%,
    53%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translateZ(0)
    }

    40%,
    43% {
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -30px, 0) scaleY(1.1)
    }

    70% {
        animation-timing-function: cubic-bezier(.755, .05, .855, .06);
        transform: translate3d(0, -15px, 0) scaleY(1.05)
    }

    80% {
        transition-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translateZ(0) scaleY(.95)
    }

    90% {
        transform: translate3d(0, -4px, 0) scaleY(1.02)
    }
}

.animate__bounce {
    animation-name: bounce;
    transform-origin: center bottom
}

@keyframes flash {

    0%,
    50%,
    to {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

.animate__flash {
    animation-name: flash
}

@keyframes pulse {
    0% {
        transform: scaleX(1)
    }

    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }

    to {
        transform: scaleX(1)
    }
}

.animate__pulse {
    animation-name: pulse;
    animation-timing-function: ease-in-out
}

@keyframes rubberBand {
    0% {
        transform: scaleX(1)
    }

    30% {
        transform: scale3d(1.25, .75, 1)
    }

    40% {
        transform: scale3d(.75, 1.25, 1)
    }

    50% {
        transform: scale3d(1.15, .85, 1)
    }

    65% {
        transform: scale3d(.95, 1.05, 1)
    }

    75% {
        transform: scale3d(1.05, .95, 1)
    }

    to {
        transform: scaleX(1)
    }
}

.animate__rubberBand {
    animation-name: rubberBand
}

@keyframes shakeX {

    0%,
    to {
        transform: translateZ(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0)
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0)
    }
}

.animate__shakeX {
    animation-name: shakeX
}

@keyframes shakeY {

    0%,
    to {
        transform: translateZ(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(0, -10px, 0)
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate3d(0, 10px, 0)
    }
}

.animate__shakeY {
    animation-name: shakeY
}

@keyframes headShake {
    0% {
        transform: translateX(0)
    }

    6.5% {
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        transform: translateX(2px) rotateY(3deg)
    }

    50% {
        transform: translateX(0)
    }
}

.animate__headShake {
    animation-timing-function: ease-in-out;
    animation-name: headShake
}

@keyframes swing {
    20% {
        transform: rotate(15deg)
    }

    40% {
        transform: rotate(-10deg)
    }

    60% {
        transform: rotate(5deg)
    }

    80% {
        transform: rotate(-5deg)
    }

    to {
        transform: rotate(0deg)
    }
}

.animate__swing {
    transform-origin: top center;
    animation-name: swing
}

@keyframes tada {
    0% {
        transform: scaleX(1)
    }

    10%,
    20% {
        transform: scale3d(.9, .9, .9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
    }

    to {
        transform: scaleX(1)
    }
}

.animate__tada {
    animation-name: tada
}

@keyframes wobble {
    0% {
        transform: translateZ(0)
    }

    15% {
        transform: translate3d(-25%, 0, 0) rotate(-5deg)
    }

    30% {
        transform: translate3d(20%, 0, 0) rotate(3deg)
    }

    45% {
        transform: translate3d(-15%, 0, 0) rotate(-3deg)
    }

    60% {
        transform: translate3d(10%, 0, 0) rotate(2deg)
    }

    75% {
        transform: translate3d(-5%, 0, 0) rotate(-1deg)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__wobble {
    animation-name: wobble
}

@keyframes jello {

    0%,
    11.1%,
    to {
        transform: translateZ(0)
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }

    77.7% {
        transform: skewX(.390625deg) skewY(.390625deg)
    }

    88.8% {
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

.animate__jello {
    animation-name: jello;
    transform-origin: center
}

@keyframes heartBeat {
    0% {
        transform: scale(1)
    }

    14% {
        transform: scale(1.3)
    }

    28% {
        transform: scale(1)
    }

    42% {
        transform: scale(1.3)
    }

    70% {
        transform: scale(1)
    }
}

.animate__heartBeat {
    animation-name: heartBeat;
    animation-duration: 1.3s;
    animation-duration: calc(var(--animate-duration)*1.3);
    animation-timing-function: ease-in-out
}

@keyframes backInDown {
    0% {
        transform: translateY(-1200px) scale(.7);
        opacity: .7
    }

    80% {
        transform: translateY(0) scale(.7);
        opacity: .7
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

.animate__backInDown {
    animation-name: backInDown
}

@keyframes backInLeft {
    0% {
        transform: translateX(-2000px) scale(.7);
        opacity: .7
    }

    80% {
        transform: translateX(0) scale(.7);
        opacity: .7
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

.animate__backInLeft {
    animation-name: backInLeft
}

@keyframes backInRight {
    0% {
        transform: translateX(2000px) scale(.7);
        opacity: .7
    }

    80% {
        transform: translateX(0) scale(.7);
        opacity: .7
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

.animate__backInRight {
    animation-name: backInRight
}

@keyframes backInUp {
    0% {
        transform: translateY(1200px) scale(.7);
        opacity: .7
    }

    80% {
        transform: translateY(0) scale(.7);
        opacity: .7
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

.animate__backInUp {
    animation-name: backInUp
}

@keyframes backOutDown {
    0% {
        transform: scale(1);
        opacity: 1
    }

    20% {
        transform: translateY(0) scale(.7);
        opacity: .7
    }

    to {
        transform: translateY(700px) scale(.7);
        opacity: .7
    }
}

.animate__backOutDown {
    animation-name: backOutDown
}

@keyframes backOutLeft {
    0% {
        transform: scale(1);
        opacity: 1
    }

    20% {
        transform: translateX(0) scale(.7);
        opacity: .7
    }

    to {
        transform: translateX(-2000px) scale(.7);
        opacity: .7
    }
}

.animate__backOutLeft {
    animation-name: backOutLeft
}

@keyframes backOutRight {
    0% {
        transform: scale(1);
        opacity: 1
    }

    20% {
        transform: translateX(0) scale(.7);
        opacity: .7
    }

    to {
        transform: translateX(2000px) scale(.7);
        opacity: .7
    }
}

.animate__backOutRight {
    animation-name: backOutRight
}

@keyframes backOutUp {
    0% {
        transform: scale(1);
        opacity: 1
    }

    20% {
        transform: translateY(0) scale(.7);
        opacity: .7
    }

    to {
        transform: translateY(-700px) scale(.7);
        opacity: .7
    }
}

.animate__backOutUp {
    animation-name: backOutUp
}

@keyframes bounceIn {

    0%,
    20%,
    40%,
    60%,
    80%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    20% {
        transform: scale3d(1.1, 1.1, 1.1)
    }

    40% {
        transform: scale3d(.9, .9, .9)
    }

    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }

    80% {
        transform: scale3d(.97, .97, .97)
    }

    to {
        opacity: 1;
        transform: scaleX(1)
    }
}

.animate__bounceIn {
    animation-duration: .75s;
    animation-duration: calc(var(--animate-duration)*0.75);
    animation-name: bounceIn
}

@keyframes bounceInDown {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0) scaleY(3)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0) scaleY(.9)
    }

    75% {
        transform: translate3d(0, -10px, 0) scaleY(.95)
    }

    90% {
        transform: translate3d(0, 5px, 0) scaleY(.985)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__bounceInDown {
    animation-name: bounceInDown
}

@keyframes bounceInLeft {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0) scaleX(3)
    }

    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0) scaleX(1)
    }

    75% {
        transform: translate3d(-10px, 0, 0) scaleX(.98)
    }

    90% {
        transform: translate3d(5px, 0, 0) scaleX(.995)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__bounceInLeft {
    animation-name: bounceInLeft
}

@keyframes bounceInRight {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(3000px, 0, 0) scaleX(3)
    }

    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0) scaleX(1)
    }

    75% {
        transform: translate3d(10px, 0, 0) scaleX(.98)
    }

    90% {
        transform: translate3d(-5px, 0, 0) scaleX(.995)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__bounceInRight {
    animation-name: bounceInRight
}

@keyframes bounceInUp {

    0%,
    60%,
    75%,
    90%,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(0, 3000px, 0) scaleY(5)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0) scaleY(.9)
    }

    75% {
        transform: translate3d(0, 10px, 0) scaleY(.95)
    }

    90% {
        transform: translate3d(0, -5px, 0) scaleY(.985)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__bounceInUp {
    animation-name: bounceInUp
}

@keyframes bounceOut {
    20% {
        transform: scale3d(.9, .9, .9)
    }

    50%,
    55% {
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }

    to {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
}

.animate__bounceOut {
    animation-duration: .75s;
    animation-duration: calc(var(--animate-duration)*0.75);
    animation-name: bounceOut
}

@keyframes bounceOutDown {
    20% {
        transform: translate3d(0, 10px, 0) scaleY(.985)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, -20px, 0) scaleY(.9)
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0) scaleY(3)
    }
}

.animate__bounceOutDown {
    animation-name: bounceOutDown
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        transform: translate3d(20px, 0, 0) scaleX(.9)
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0) scaleX(2)
    }
}

.animate__bounceOutLeft {
    animation-name: bounceOutLeft
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        transform: translate3d(-20px, 0, 0) scaleX(.9)
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0) scaleX(2)
    }
}

.animate__bounceOutRight {
    animation-name: bounceOutRight
}

@keyframes bounceOutUp {
    20% {
        transform: translate3d(0, -10px, 0) scaleY(.985)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, 20px, 0) scaleY(.9)
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0) scaleY(3)
    }
}

.animate__bounceOutUp {
    animation-name: bounceOutUp
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.animate__fadeIn {
    animation-name: fadeIn
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInDown {
    animation-name: fadeInDown
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInDownBig {
    animation-name: fadeInDownBig
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInLeft {
    animation-name: fadeInLeft
}

@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInLeftBig {
    animation-name: fadeInLeftBig
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInRight {
    animation-name: fadeInRight
}

@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInRightBig {
    animation-name: fadeInRightBig
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInUp {
    animation-name: fadeInUp
}

@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInUpBig {
    animation-name: fadeInUpBig
}

@keyframes fadeInTopLeft {
    0% {
        opacity: 0;
        transform: translate3d(-100%, -100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInTopLeft {
    animation-name: fadeInTopLeft
}

@keyframes fadeInTopRight {
    0% {
        opacity: 0;
        transform: translate3d(100%, -100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInTopRight {
    animation-name: fadeInTopRight
}

@keyframes fadeInBottomLeft {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInBottomLeft {
    animation-name: fadeInBottomLeft
}

@keyframes fadeInBottomRight {
    0% {
        opacity: 0;
        transform: translate3d(100%, 100%, 0)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__fadeInBottomRight {
    animation-name: fadeInBottomRight
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.animate__fadeOut {
    animation-name: fadeOut
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.animate__fadeOutDown {
    animation-name: fadeOutDown
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.animate__fadeOutDownBig {
    animation-name: fadeOutDownBig
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.animate__fadeOutLeft {
    animation-name: fadeOutLeft
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.animate__fadeOutLeftBig {
    animation-name: fadeOutLeftBig
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.animate__fadeOutRight {
    animation-name: fadeOutRight
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.animate__fadeOutRightBig {
    animation-name: fadeOutRightBig
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.animate__fadeOutUp {
    animation-name: fadeOutUp
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.animate__fadeOutUpBig {
    animation-name: fadeOutUpBig
}

@keyframes fadeOutTopLeft {
    0% {
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        opacity: 0;
        transform: translate3d(-100%, -100%, 0)
    }
}

.animate__fadeOutTopLeft {
    animation-name: fadeOutTopLeft
}

@keyframes fadeOutTopRight {
    0% {
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        opacity: 0;
        transform: translate3d(100%, -100%, 0)
    }
}

.animate__fadeOutTopRight {
    animation-name: fadeOutTopRight
}

@keyframes fadeOutBottomRight {
    0% {
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 100%, 0)
    }
}

.animate__fadeOutBottomRight {
    animation-name: fadeOutBottomRight
}

@keyframes fadeOutBottomLeft {
    0% {
        opacity: 1;
        transform: translateZ(0)
    }

    to {
        opacity: 0;
        transform: translate3d(-100%, 100%, 0)
    }
}

.animate__fadeOutBottomLeft {
    animation-name: fadeOutBottomLeft
}

@keyframes flip {
    0% {
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        animation-timing-function: ease-out
    }

    40% {
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        animation-timing-function: ease-out
    }

    50% {
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        animation-timing-function: ease-in
    }

    80% {
        transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in
    }

    to {
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        animation-timing-function: ease-in
    }
}

.animate__animated.animate__flip {
    backface-visibility: visible;
    animation-name: flip
}

@keyframes flipInX {
    0% {
        transform: perspective(400px) rotateX(90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateX(-20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotateX(-5deg)
    }

    to {
        transform: perspective(400px)
    }
}

.animate__flipInX {
    backface-visibility: visible !important;
    animation-name: flipInX
}

@keyframes flipInY {
    0% {
        transform: perspective(400px) rotateY(90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateY(-20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotateY(-5deg)
    }

    to {
        transform: perspective(400px)
    }
}

.animate__flipInY {
    backface-visibility: visible !important;
    animation-name: flipInY
}

@keyframes flipOutX {
    0% {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

.animate__flipOutX {
    animation-duration: .75s;
    animation-duration: calc(var(--animate-duration)*0.75);
    animation-name: flipOutX;
    backface-visibility: visible !important
}

@keyframes flipOutY {
    0% {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

.animate__flipOutY {
    animation-duration: .75s;
    animation-duration: calc(var(--animate-duration)*0.75);
    backface-visibility: visible !important;
    animation-name: flipOutY
}

@keyframes lightSpeedInRight {
    0% {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }

    60% {
        transform: skewX(20deg);
        opacity: 1
    }

    80% {
        transform: skewX(-5deg)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__lightSpeedInRight {
    animation-name: lightSpeedInRight;
    animation-timing-function: ease-out
}

@keyframes lightSpeedInLeft {
    0% {
        transform: translate3d(-100%, 0, 0) skewX(30deg);
        opacity: 0
    }

    60% {
        transform: skewX(-20deg);
        opacity: 1
    }

    80% {
        transform: skewX(5deg)
    }

    to {
        transform: translateZ(0)
    }
}

.animate__lightSpeedInLeft {
    animation-name: lightSpeedInLeft;
    animation-timing-function: ease-out
}

@keyframes lightSpeedOutRight {
    0% {
        opacity: 1
    }

    to {
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

.animate__lightSpeedOutRight {
    animation-name: lightSpeedOutRight;
    animation-timing-function: ease-in
}

@keyframes lightSpeedOutLeft {
    0% {
        opacity: 1
    }

    to {
        transform: translate3d(-100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
}

.animate__lightSpeedOutLeft {
    animation-name: lightSpeedOutLeft;
    animation-timing-function: ease-in
}

@keyframes rotateIn {
    0% {
        transform: rotate(-200deg);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

.animate__rotateIn {
    animation-name: rotateIn;
    transform-origin: center
}

@keyframes rotateInDownLeft {
    0% {
        transform: rotate(-45deg);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

.animate__rotateInDownLeft {
    animation-name: rotateInDownLeft;
    transform-origin: left bottom
}

.animate__rotateInDownRight {
    animation-name: rotateInUpLeft;
    transform-origin: right bottom
}

@keyframes rotateInUpLeft {
    0% {
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

.animate__rotateInUpLeft {
    animation-name: rotateInUpLeft;
    transform-origin: left bottom
}

@keyframes rotateInUpRight {
    0% {
        transform: rotate(-90deg);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

.animate__rotateInUpRight {
    animation-name: rotateInUpRight;
    transform-origin: right bottom
}

@keyframes rotateOut {
    0% {
        opacity: 1
    }

    to {
        transform: rotate(200deg);
        opacity: 0
    }
}

.animate__rotateOut {
    animation-name: rotateOut;
    transform-origin: center
}

@keyframes rotateOutDownLeft {
    0% {
        opacity: 1
    }

    to {
        transform: rotate(45deg);
        opacity: 0
    }
}

.animate__rotateOutDownLeft {
    animation-name: rotateOutDownLeft;
    transform-origin: left bottom
}

.animate__rotateOutDownRight {
    animation-name: rotateOutUpLeft;
    transform-origin: right bottom
}

@keyframes rotateOutUpLeft {
    0% {
        opacity: 1
    }

    to {
        transform: rotate(-45deg);
        opacity: 0
    }
}

.animate__rotateOutUpLeft {
    animation-name: rotateOutUpLeft;
    transform-origin: left bottom
}

@keyframes rotateOutUpRight {
    0% {
        opacity: 1
    }

    to {
        transform: rotate(90deg);
        opacity: 0
    }
}

.animate__rotateOutUpRight {
    animation-name: rotateOutUpRight;
    transform-origin: right bottom
}

@keyframes hinge {
    0% {
        animation-timing-function: ease-in-out
    }

    20%,
    60% {
        transform: rotate(80deg);
        animation-timing-function: ease-in-out
    }

    40%,
    80% {
        transform: rotate(60deg);
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    to {
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.animate__hinge {
    animation-duration: 2s;
    animation-duration: calc(var(--animate-duration)*2);
    animation-name: hinge;
    transform-origin: top left
}

@keyframes jackInTheBox {
    0% {
        opacity: 0;
        transform: scale(.1) rotate(30deg);
        transform-origin: center bottom
    }

    50% {
        transform: rotate(-10deg)
    }

    70% {
        transform: rotate(3deg)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.animate__jackInTheBox {
    animation-name: jackInTheBox
}

@keyframes rollIn {
    0% {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate(-120deg)
    }

    to {
        opacity: 1;
        transform: translateZ(0)
    }
}

.animate__rollIn {
    animation-name: rollIn
}

@keyframes rollOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate(120deg)
    }
}

.animate__rollOut {
    animation-name: rollOut
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

.animate__zoomIn {
    animation-name: zoomIn
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomInDown {
    animation-name: zoomInDown
}

@keyframes zoomInLeft {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomInLeft {
    animation-name: zoomInLeft
}

@keyframes zoomInRight {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomInRight {
    animation-name: zoomInRight
}

@keyframes zoomInUp {
    0% {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomInUp {
    animation-name: zoomInUp
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    to {
        opacity: 0
    }
}

.animate__zoomOut {
    animation-name: zoomOut
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomOutDown {
    animation-name: zoomOutDown;
    transform-origin: center bottom
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(-2000px, 0, 0)
    }
}

.animate__zoomOutLeft {
    animation-name: zoomOutLeft;
    transform-origin: left center
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(2000px, 0, 0)
    }
}

.animate__zoomOutRight {
    animation-name: zoomOutRight;
    transform-origin: right center
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.animate__zoomOutUp {
    animation-name: zoomOutUp;
    transform-origin: center bottom
}

@keyframes slideInDown {
    0% {
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.animate__slideInDown {
    animation-name: slideInDown
}

@keyframes slideInLeft {
    0% {
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.animate__slideInLeft {
    animation-name: slideInLeft
}

@keyframes slideInRight {
    0% {
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.animate__slideInRight {
    animation-name: slideInRight
}

@keyframes slideInUp {
    0% {
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }

    to {
        transform: translateZ(0)
    }
}

.animate__slideInUp {
    animation-name: slideInUp
}

@keyframes slideOutDown {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, 100%, 0)
    }
}

.animate__slideOutDown {
    animation-name: slideOutDown
}

@keyframes slideOutLeft {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(-100%, 0, 0)
    }
}

.animate__slideOutLeft {
    animation-name: slideOutLeft
}

@keyframes slideOutRight {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(100%, 0, 0)
    }
}

.animate__slideOutRight {
    animation-name: slideOutRight
}

@keyframes slideOutUp {
    0% {
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, -100%, 0)
    }
}

.animate__slideOutUp {
    animation-name: slideOutUp
}

.animate__delay-500ms {
    animation-delay: .5s
}

.animate__delay-1500ms {
    animation-delay: 1.5s
}

.animate__delay-2500ms {
    animation-delay: 2.5s
}

.animate__delay-3500ms {
    animation-delay: 3.5s
}

.animate__delay-4500ms {
    animation-delay: 4.5s
}

@keyframes pointTo {
    0% {
        transform: translateX(-10px) translateY(4px)
    }

    50% {
        transform: translateX(10px) translateY(0)
    }

    to {
        transform: translateX(-10px) translateY(4px)
    }
}

@keyframes leftRight {
    0% {
        transform: translateX(-20px) translateY(8px)
    }

    50% {
        transform: translateX(20px) translateY(0)
    }

    to {
        transform: translateX(-20px) translateY(8px)
    }
}

@keyframes randomFloating1 {
    50% {
        transform: scale(.8)
    }
}

@keyframes randomFloating2 {
    25% {
        transform: rotate(-1deg) scale(.7) translateY(-18px) translateX(-4px);
        opacity: .9
    }

    50% {
        transform: rotate(-1deg) scale(.5) translateY(20px) translateX(3px);
        opacity: 1
    }

    75% {
        transform: rotate(2deg) scale(.7) translateY(-28px) translateX(-7px);
        opacity: .1
    }
}

.animate__animated.animate__pointTo {
    animation-name: pointTo;
    animation-iteration-count: infinite;
    animation-duration: .8s;
    animation-timing-function: ease-in-out
}

.animate__animated.animate__leftRight {
    animation-name: leftRight;
    animation-iteration-count: infinite;
    animation-duration: .8s;
    animation-timing-function: ease-in-out
}

.animate__animated.animate__randomFloating1 {
    animation-name: randomFloating1;
    animation-iteration-count: infinite;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-delay: 2s
}

.animate__animated.animate__randomFloating2 {
    animation-name: randomFloating2;
    animation-iteration-count: infinite;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-delay: 2s
}

@media screen\0 {
    body .swal-overlay {
        visibility: hidden
    }

    body .swal-overlay--show-modal {
        visibility: visible
    }

    body .swal-button__loader {
        visibility: hidden
    }

    body .swal-overlay--show-modal .swal-modal {
        visibility: visible
    }

    body .swal-modal {
        visibility: hidden
    }
}

@keyframes rotating {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

.swal-modal.youtube {
    width: auto;
    background-color: #000
}

.swal-modal.youtube .swal-content {
    padding: 0;
    margin: 0;
    border-radius: inherit;
    overflow: hidden;
    display: flex
}

.swal-modal.youtube .swal-content iframe {
    display: block
}

.swal-modal.youtube .swal-footer {
    position: absolute;
    padding: 0;
    margin: 0;
    right: -10px;
    top: -60px
}

.swal-modal.youtube .swal-button {
    font-size: 40px;
    background-color: transparent;
    width: 40px;
    outline: none;
    border: none;
    box-shadow: none;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-weight: 400;
    padding: 0;
    border-radius: 50%;
    color: #fff
}

.swal-modal.youtube .swal-button:after {
    content: "";
    background-color: #fff;
    width: 2px;
    height: 26px;
    position: absolute;
    left: 19px;
    top: 34px;
    display: block
}

.swal-modal.youtube .swal-button-container {
    margin: 0
}

.swal-modal.thankyou {
    width: 400px;
    box-sizing: border-box;
    padding-bottom: 20px;
    position: relative
}

.swal-modal.thankyou .swal-content {
    padding-top: 50px;
    margin: 0;
    border-radius: inherit;
    overflow: hidden
}

.swal-modal.thankyou .swal-content i {
    font-size: 50px;
    color: #fff;
    display: inline-block;
    padding: 15px;
    background: linear-gradient(#7fbcff, #017ff7);
    border-radius: 50%;
    border: 1px solid #4ea4fc;
    width: 50px;
    height: 50px;
    box-shadow: 1px 1px 58px 4px #7ab7f1;
    line-height: 50px;
    box-sizing: content-box
}

.swal-modal.thankyou .swal-content h2 {
    font-size: 1.4rem;
    font-weight: 400;
    color: #0983f3;
    margin-top: 26px
}

.swal-modal.thankyou .swal-content p {
    margin-top: 10px;
    font-size: 1rem;
    color: gray
}

.swal-modal.thankyou .swal-content img {
    margin-top: 10px
}

.swal-modal.thankyou .swal-footer {
    text-align: center
}

.swal-modal.thankyou .swal-button--confirm {
    width: 140px;
    height: 30px;
    padding: 0;
    border-radius: 30px;
    cursor: pointer;
    background: linear-gradient(#7fbcff, #017ff7);
    color: #fff;
    font-size: 20px;
    line-height: 30px;
    outline: none !important
}

.swal-modal.thankyou .swal-button--cancel {
    font-size: 40px;
    background-color: transparent;
    width: 40px;
    outline: none;
    border: none;
    box-shadow: none;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-weight: 400;
    padding: 0;
    border-radius: 50%;
    color: #fff;
    position: absolute;
    right: 0;
    top: -12%
}

.swal-modal.thankyou .swal-button--cancel:after {
    content: "";
    background-color: #fff;
    width: 2px;
    height: 26px;
    position: absolute;
    left: 19px;
    top: 34px;
    display: block
}

.swal-modal.thankyou .swal-button-container {
    margin: 0;
    position: static
}

.swal-modal.loading {
    background-color: transparent
}

.swal-modal.loading i {
    color: #fff
}

.swal-modal.media-select-pop .media-select-pop-inner {
    display: flex;
    justify-content: space-evenly
}

.swal-modal.media-select-pop .media-select-pop-inner a {
    font-size: 18px;
    color: #fff;
    padding: 5px 20px;
    background-color: #4696f5;
    border-radius: 35px;
    width: 200px;
    box-sizing: border-box;
    transition: all .5s ease
}

.swal-modal.media-select-pop .media-select-pop-inner a i {
    font-size: 34px
}

.swal-modal.media-select-pop .media-select-pop-inner a:hover {
    transform: scale(1.05)
}

.swal-content .rotate {
    animation-iteration-count: infinite;
    animation-name: rotating;
    animation-duration: 1.4s;
    display: inline-block;
    font-size: 60px;
    animation-timing-function: linear
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 200;
    src: url("/static/fonts/manrope/manrope-v13-latin-200.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-200.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-200.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-200.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-200.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-200.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 300;
    src: url("/static/fonts/manrope/manrope-v13-latin-300.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-300.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-300.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-300.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-300.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-300.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 400;
    src: url("/static/fonts/manrope/manrope-v13-latin-regular.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-regular.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-regular.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-regular.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-regular.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-regular.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 500;
    src: url("/static/fonts/manrope/manrope-v13-latin-500.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-500.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-500.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-500.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-500.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-500.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 600;
    src: url("/static/fonts/manrope/manrope-v13-latin-600.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-600.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-600.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-600.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-600.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-600.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 700;
    src: url("/static/fonts/manrope/manrope-v13-latin-700.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-700.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-700.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-700.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-700.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-700.svg#Manrope") format("svg")
}

@font-face {
    font-family: manrope;
    font-style: normal;
    font-weight: 800;
    src: url("/static/fonts/manrope/manrope-v13-latin-800.eot");
    src: local(""), url("/static/fonts/manrope/manrope-v13-latin-800.eot?#iefix") format("embedded-opentype"), url("/static/fonts/manrope/manrope-v13-latin-800.woff2") format("woff2"), url("/static/fonts/manrope/manrope-v13-latin-800.woff") format("woff"), url("/static/fonts/manrope/manrope-v13-latin-800.ttf") format("truetype"), url("/static/fonts/manrope/manrope-v13-latin-800.svg#Manrope") format("svg")
}

/*! autoprefixer: on */
:root {
    --blue: #4696f5;
    --nav-height: 70px;
    --nav-left-width: calc(140px + 11vw);
    --nav-1st-font-size: 16px;
    --nav-contact-font-size: 15px;
    --nav-2nd-font-size: 16px;
    --nav-3rd-font-size: 16px;
    --nav-4th-font-size: 14px;
    --nav-5th-font-size: 13px;
    --nav-series-font-size: 15px;
    --nav-pro-text-font-size: 14px;
    --nav-pro-title-font-size: 16px;
    --nav-list-font-size: 15px;
    --nav-grid-width: 250px;
    --nav-side-space: 100px;
    --vms-pop-height: 90px
}

.header-nav {
    height: var(--nav-height);
    background-color: #fff;
    position: relative;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    transform: translateY(0);
    transition: transform .3s
}

.header-nav.inactive {
    transform: translateY(-100%)
}

.header-nav * {
    font-family: manrope, Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, "sans-serif" !important;
    box-sizing: border-box
}

.header-nav .iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.header-nav a,
.header-nav span {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    line-height: inherit
}

.header-nav a {
    text-decoration: none !important
}

.header-nav .nav__header {
    height: inherit;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    background-color: inherit;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .06);
    position: relative;
    z-index: 1
}

.header-nav .nav__header .logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
    width: var(--nav-left-width);
    flex-shrink: 0;
    padding-left: 88px;
    overflow: hidden
}

.header-nav .nav__header .logo img {
    height: calc(var(--nav-height) * 2);
    position: relative
}

.header-nav .nav__1st-menu {
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 50px
}

.header-nav .nav__1st-menu li {
    font-size: var(--nav-1st-font-size);
    font-weight: 500;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    position: relative
}

.header-nav .nav__1st-menu li a {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center
}

.header-nav .nav__1st-menu li:after {
    content: "";
    width: 100%;
    height: 0;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 3px solid var(--blue);
    opacity: 0;
    transition: all .1s
}

.header-nav .nav__1st-menu li.active,
.header-nav .nav__1st-menu li:hover {
    color: var(--blue)
}

.header-nav .nav__1st-menu li.active:after,
.header-nav .nav__1st-menu li:hover:after {
    opacity: 1
}

.header-nav .nav__header-right {
    position: absolute;
    right: var(--nav-side-space);
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.nav__header-right .nav__header--discord {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
	width: 13em;
	height: 2.5em;
	font-size: var(--nav-contact-font-size);
	color: #fff;
	line-height: 1;
	background-color: #5865f2;
	border-radius: 0.5em;
}
.nav__header-right .nav__header--discord img {
	margin-right: 0.5em;
	width: 1.7em;
}
.nav__header-right .nav__header--discord:hover {
	color: #fff !important;
	background-color: rgb(69, 84, 239);
}

.header-nav .nav__header-right .contact {
    background-color: #0b76d1;
    color: #fff;
    height: 1.8em;
    padding: 0 1.2em;
    border-radius: 15px;
    text-align: center;
    font-size: var(--nav-contact-font-size);
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0
}

.header-nav .nav__header-right .language {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 1.875rem;
    gap: 30px
}

.header-nav .nav__header-right .language a,
.header-nav .nav__header-right .language p {
    color: #333;
    font-size: var(--nav-1st-font-size);
    line-height: 1
}

.header-nav .nav__header-right .language p {
    position: relative;
    margin: 0
}

.header-nav .nav__header-right .language p:after {
    content: "";
    height: 80%;
    display: block;
    width: 0;
    position: absolute;
    right: -16px;
    top: 8%;
    border: 1px solid rgba(77, 77, 77, .5)
}

.header-nav .nav__header-right .language a {
    opacity: .4
}

.header-nav .nav__header-right .language.lang {
    display: flex;
    width: 6.563rem;
    position: relative;
    z-index: 1
}

.header-nav .nav__header-right .language.lang select {
    flex: 1;
    font-size: 1rem;
    margin-left: .625rem;
    outline: none;
    padding-left: .938rem;
    border-radius: 4px;
    color: #333;
    background-color: transparent;
    border: none
}

.header-nav .nav__header-right .language.lang:before {
    content: "";
    position: absolute;
    left: .125rem;
    top: 55%;
    transform: translateY(-50%);
    width: 1.313rem;
    height: 1.313rem;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' class='y8cvt8b14__design-iconfont' width='128' height='128'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M7.63 7.6h44.75v44.8H7.63z' fill='%23666'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M29.98 7.63c12.35 0 22.36 10.01 22.36 22.36S42.33 52.35 29.98 52.35 7.62 42.33 7.62 29.99 17.63 7.63 29.98 7.63zm7.41 24.22H22.57c.41 9.51 3.92 16.77 7.41 16.77s7-7.26 7.41-16.77zm-18.55 0h-7.4c.68 6.88 5.11 12.66 11.22 15.27-2.2-3.74-3.58-9.19-3.82-15.27zm29.68 0h-7.4c-.24 6.09-1.62 11.53-3.82 15.27 6.11-2.61 10.53-8.39 11.22-15.27zm-25.87-19l-.21.09c-6 2.65-10.33 8.38-11.01 15.18h7.4c.24-6.09 1.62-11.53 3.82-15.27zm7.32-1.5h-.14c-3.44.19-6.87 7.39-7.27 16.77h14.82c-.41-9.51-3.92-16.77-7.41-16.77zm7.32 1.49l.14.24c2.12 3.73 3.45 9.07 3.68 15.04h7.4c-.68-6.88-5.11-12.66-11.22-15.27zm0 0' fill='%23666'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 100%;
    z-index: -1
}

.header-nav .nav__header-right .site-search .iconfont {
    color: #2c2c2c;
    opacity: .6;
    font-size: 22px;
    cursor: pointer
}

.header-nav .nav__header-right .site-search .search-btn {
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M851.084 829.905L740.422 716.916a335.36 335.36 0 1 0-50.037 45.615L802.91 877.265a33.862 33.862 0 1 0 48.291-47.36zm-625.571-335.36a266.356 266.356 0 1 1 266.356 266.357 266.59 266.59 0 0 1-266.356-266.357z' fill='%232c2c2c'/%3E%3C/svg%3E");
    background-size: 100%;
    width: 22px;
    height: 22px;
    opacity: .6;
    display: inline-block;
    vertical-align: middle
}

.header-nav .nav__header-right .site-search .search-input {
    outline: #666;
    border-radius: 5px;
    width: 0;
    opacity: 0;
    background-color: #eee;
    transition: all .5s ease
}

.header-nav .nav__header-right .site-search.active .search-input {
    width: 150px;
    opacity: 1;
    padding: 5px 10px;
    box-sizing: border-box
}

.header-nav .nav__header-right .header-btn--online {
    display: flex;
    align-items: center;
    margin-left: 1.125rem;
    padding-left: .125rem;
    padding-right: .625rem;
    height: 1.8em;
    border-radius: 1.875rem;
    border: 1px solid #cbcbcb;
    box-sizing: border-box;
    position: relative;
    font-size: var(--nav-contact-font-size);
    font-weight: 500
}

.header-nav .nav__header-right .header-btn--online:before {
    content: "";
    display: block;
    width: 1.563rem;
    height: 1.563rem;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' class='dnjybdzvq__design-iconfont' width='128' height='128'%3E%3Cpath d='M30 52.25C17.73 52.25 7.75 42.27 7.75 30S17.73 7.75 30 7.75 52.25 17.73 52.25 30 42.27 52.25 30 52.25zm0-42.5C18.83 9.75 9.75 18.83 9.75 30S18.83 50.25 30 50.25 50.25 41.17 50.25 30 41.17 9.75 30 9.75z' fill='%23FF910F'/%3E%3Cpath d='M40.25 30.25l-16.5-10.39v20.78l16.5-10.39z' fill='%23FF910F'/%3E%3C/svg%3E");
    background-position: 50%;
    background-size: 100%;
    margin-right: .188rem
}

.header-nav .nav__content {
    background-color: #fff;
    position: relative;
    transform: translateY(-100%);
    transition: transform .2s
}

.header-nav .nav__content.active {
    transform: none;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .06)
}

.header-nav .nav__content a {
    display: inline
}

.header-nav .nav__content a:hover {
    color: var(--blue)
}

.header-nav .nav__content-block--divide {
    display: none;
    align-items: stretch;
    justify-content: flex-start
}

.header-nav .nav__content-block--divide.active {
    display: flex
}

.header-nav .nav__content-block--normal {
    align-items: stretch;
    justify-content: space-between;
    padding: 2.6vw 0 2.08vw;
    display: none;
    padding-left: calc(var(--nav-side-space) + 120px);
    padding-right: var(--nav-side-space)
}

.header-nav .nav__content-block--normal.active {
    display: flex
}

.header-nav .nav__poster {
    height: 10.625rem;
    width: 15.625rem;
    position: static;
    margin-top: 1.875rem
}

.header-nav .nav__poster a {
    display: block
}

.header-nav .nav__poster a img {
    width: 15.625rem;
    position: absolute;
    right: var(--nav-side-space);
    bottom: 2.5rem
}

.header-nav .nav__content-left {
    background-color: #f4f4f4;
    width: var(--nav-left-width);
    flex-shrink: 0
}

.header-nav .nav__2nd-grid {
    flex-shrink: 0;
    width: var(--nav-grid-width)
}

.header-nav .nav__2nd-grid.norwap .nav__4th-title {
    white-space: nowrap
}

.header-nav .nav__2nd-menu li {
    height: 60px;
    color: #333;
    font-weight: 500;
    font-size: var(--nav-2nd-font-size)
}

.header-nav .nav__2nd-menu li a {
    width: 100%;
    height: 100%;
    padding-left: 100px;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.header-nav .nav__2nd-menu li:first-of-type,
.header-nav .nav__2nd-menu li:last-of-type {
    height: 80px
}

.header-nav .nav__2nd-menu li:first-of-type {
    padding-top: 20px
}

.header-nav .nav__2nd-menu li:last-of-type {
    padding-bottom: 20px
}

.header-nav .nav__2nd-menu li.active,
.header-nav .nav__2nd-menu li:hover {
    background-color: #fff
}

.header-nav .nav__2nd-menu li.active a,
.header-nav .nav__2nd-menu li:hover a {
    color: var(--blue)
}

.header-nav .nav__content-right {
    padding: 40px var(--nav-side-space) 40px 0;
    flex-grow: 1;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: -ms-autohiding-scrollbar
}

.header-nav .nav__content-right::-webkit-scrollbar {
    width: 0
}

.header-nav .nav__content-right .nav__poster {
    position: absolute;
    right: 0;
    bottom: 0
}

.header-nav .nav__2nd-content {
    align-items: stretch;
    justify-content: space-between;
    display: none;
    min-height: 100%
}

.header-nav .nav__2nd-content.active {
    display: flex
}

.header-nav .nav__3rd--leaf {
    margin: 0 0 20px !important
}

.header-nav .nav__3rd--leaf:last-of-type {
    margin: 0 !important
}

.header-nav .nav__3rd:not(:first-of-type) {
    margin-top: 50px
}

.header-nav .nav__3rd-title {
    font-size: var(--nav-3rd-font-size);
    font-weight: 500;
    position: relative;
    color: #333;
    padding-bottom: 10px;
    margin-bottom: 16px
}

.header-nav .nav__3rd-title:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    border-bottom: 1px solid #b2b2b2;
    width: 90%
}

.header-nav .nav__3rd-title--fill:after {
    content: none
}

.header-nav .nav__3rd-title--no-line {
    margin-bottom: 0;
    padding-bottom: 0
}

.header-nav .nav__3rd-title--no-line:after {
    content: none
}

.header-nav .nav__4th:not(:first-of-type) {
    margin-top: 26px
}

.header-nav .nav__4th.leaf:not(:first-of-type) {
    margin-top: 14px
}

.header-nav .nav__4th.leaf:hover .nav__4th-title {
    color: var(--blue)
}

.header-nav .nav__4th-title {
    color: #333;
    font-size: var(--nav-4th-font-size);
    font-weight: 400;
    margin-bottom: 6px;
    line-height: 1.3
}

.header-nav .nav__4th-content {
    display: flex;
    flex-wrap: wrap;
    gap: .2em 4%
}

.header-nav .nav__4th-content li {
    font-size: var(--nav-5th-font-size);
    min-width: 29.3333333333%;
    line-height: 1.4;
    font-weight: 300;
    color: #666
}

.header-nav .nav__4th-content li.col-2 {
    min-width: 62.6666666667%
}

.header-nav .nav__4th-content li.col-3 {
    min-width: 100%;
    margin-right: 0
}

.header-nav .nav__4th-content li a {
    display: block
}

.header-nav .online-demo {
    width: 100%;
    text-align: center;
    position: relative;
    top: 20px
}

.header-nav .online-demo-btn {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M445.227 304.427a23.893 23.893 0 0 0-39.894 17.92v378.88a23.893 23.893 0 0 0 39.894 17.706L658.56 529.707a24.747 24.747 0 0 0 0-36.054z' fill='%23333'/%3E%3Cpath d='M512 149.333A362.667 362.667 0 1 0 874.667 512 362.667 362.667 0 0 0 512 149.333zm0 694.614A332.373 332.373 0 1 1 844.373 512 332.8 332.8 0 0 1 512 843.947z' fill='%23333'/%3E%3C/svg%3E");
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100% 100%;
    vertical-align: middle;
    opacity: .8
}

.header-nav .pro__cat {
    padding: 0 30px;
    width: 340px;
    position: relative;
    flex-shrink: 0
}

.header-nav .pro__cat:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
    height: 100%;
    border-left: 1px solid #cfcfcf
}

.header-nav .pro__cat li {
    height: 50px;
    font-size: var(--nav-3rd-font-size);
    font-weight: 500;
    color: #333;
    padding-left: 26px
}

.header-nav .pro__cat li,
.header-nav .pro__cat li a {
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.header-nav .pro__cat li a {
    height: 100%;
    color: currentcolor;
    flex-grow: 1
}

.header-nav .pro__cat li.active {
    background-color: #f5f5f5;
    color: var(--blue)
}

.header-nav .pro__cat-content {
    flex-grow: 1;
    padding-left: 2.375rem;
    display: none;
    padding-bottom: 15rem
}

.header-nav .pro__cat-content.active {
    display: block
}

.header-nav .pro__series {
    margin-bottom: 1.875rem
}

.header-nav .pro__series ul {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .625rem 1.25rem;
    flex-wrap: wrap
}

.header-nav .pro__series ul li {
    font-size: var(--nav-series-font-size);
    font-weight: 500;
    color: #333;
    height: 2.75rem;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.25rem
}

.header-nav .pro__series ul li a {
    color: currentcolor;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none
}

.header-nav .pro__series ul li.active {
    background-color: #f5f5f5;
    box-shadow: inset 0 3px 2px 0 rgba(45, 45, 45, .03);
    border-radius: 8px;
    color: var(--blue)
}

.header-nav .pro__series ul li.active a {
    pointer-events: all
}

.header-nav .pro__series-content ul {
    display: none;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.313rem;
    flex-wrap: wrap
}

.header-nav .pro__series-content ul.active {
    display: flex
}

.header-nav .pro__series-content .card {
    width: 10rem;
    border: none;
    padding: 0;
    min-height: unset;
    margin: 0 !important;
    background-color: transparent !important;
    position: relative
}

.header-nav .pro__series-content .card:after,
.header-nav .pro__series-content .card:before {
    content: none !important
}

.header-nav .pro__series-content .card.hot:before {
    content: "" !important;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 2.75rem;
    height: 2.75rem;
    background-size: 100% 100%;
    background-image: url(/static/pc/en/nav/hot.png?t=1704771621826)
}

.header-nav .pro__series-content .card__title {
    font-size: var(--nav-pro-title-font-size);
    padding: 0 .375rem;
    margin: 0 0 .25rem
}

.header-nav .pro__series-content .card__text,
.header-nav .pro__series-content .card__title {
    text-align: center;
    color: #666;
    font-weight: 500;
    line-height: 1.2;
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto
}

.header-nav .pro__series-content .card__text {
    font-size: var(--nav-pro-text-font-size);
    padding: 0 .25rem;
    margin: 0
}

.header-nav .pro__series-content .card__img {
    width: 10rem;
    height: 7.5rem;
    background-color: #f5f5f5;
    margin-bottom: .625rem;
    min-height: unset;
    padding: 0
}

.header-nav .pro__series-content .card:hover .card__text,
.header-nav .pro__series-content .card:hover .card__title {
    color: var(--blue)
}

.tabs-and-crumbs {
    transition: top .3s;
    top: calc(var(--nav-height) - 1px) !important
}

.tabs-and-crumbs.inactive {
    top: -1px !important
}

.tabs-and-crumbs.has-pop {
    top: calc(var(--nav-height) + var(--vms-pop-height) - 1px) !important
}

.tabs-and-crumbs.has-pop--inactive {
    top: calc(var(--vms-pop-height) - 1px) !important
}

.vms-pop {
    transition: top .3s;
    top: var(--nav-height);
    width: 100%;
    height: var(--vms-pop-height);
    background-image: url(/static/pc/en/security-pop/bj.jpg?t=1704771621826);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 900
}

.vms-pop.active {
    display: flex
}

.vms-pop.inactive {
    top: 0 !important
}

.vms-pop__product {
    display: block;
    margin-right: 1.875rem;
    width: 11.125rem
}

.vms-pop__icon {
    width: 4.563rem;
    margin-right: 1.25rem
}

.vms-pop__text {
    font-size: 1.125rem;
    color: #fff;
    margin-right: 3.125rem
}

.vms-pop__btn {
    flex-shrink: 0;
    padding: .25rem 1rem;
    line-height: 1;
    font-size: 1.125rem;
    color: #228be9;
    background-color: #fff;
    border-radius: 2.5rem;
    transition: all .5s ease;
    box-shadow: inset 0 .125rem .25rem 0 rgba(39, 135, 221, .35);
    border: 1px solid #fff
}

.vms-pop__btn:hover {
    transform: scale(1.05)
}

.vms-pop__close {
    position: absolute;
    left: calc(50% + 40rem);
    top: .625rem;
    cursor: pointer
}

.vms-pop__close svg {
    font-size: 1.5rem !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
    fill: currentcolor;
    color: #fff
}

.vms-pop.trafficx-pre-sale {
    background-image: url(/static/pc/en/security-pop/trafficx-pre-sale/bg.jpg?t=1704771621826)
}

.vms-pop.trafficx-pre-sale .vms-pop__icon {
    margin-left: 8.75rem
}

.vms-pop2 .vms-pop__text {
    margin-right: 1.25rem;
    margin-bottom: 0
}

.vms-pop2 .vms-pop__btn {
    background-color: #fff;
    padding: .375rem 1rem;
    font-size: 1.125rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

.vms-pop2 .vms-pop__btn .symbol {
    fill: #4696f5;
    width: 1.25rem;
    margin-right: .625rem;
    height: 1.25rem;
    transform: scale(1.7)
}

.vms-pop2 .vms-pop__close {
    left: calc(50% + 40rem);
    color: #fff
}

@media (max-width:1540px) {
    :root {
        --nav-height: 66px;
        --nav-left-width: calc(120px + 11vw);
        --nav-1st-font-size: 15px;
        --nav-contact-font-size: 16px;
        --nav-2nd-font-size: 15px;
        --nav-3rd-font-size: 15px;
        --nav-4th-font-size: 13px;
        --nav-5th-font-size: 12px;
        --nav-series-font-size: 14px;
        --nav-pro-text-font-size: 13px;
        --nav-pro-title-font-size: 15px;
        --nav-grid-width: 240px;
        --nav-side-space: 80px;
        --nav-list-font-size: 14px;
        --vms-pop-height: 80px
    }

    .header-nav .nav__header .logo {
        padding-left: 70px
    }

    .header-nav .nav__content-right {
        padding: 30px var(--nav-side-space) 30px 0
    }

    .header-nav .nav__2nd-menu li {
        height: 50px
    }

    .header-nav .nav__2nd-menu li a {
        padding-left: 80px
    }

    .header-nav .nav__4th:not(:first-of-type) {
        margin-top: 20px
    }

    .header-nav .nav__content-block--normal {
        padding-left: calc(var(--nav-side-space) + 110px)
    }

    .header-nav .pro__cat {
        padding: 0 20px;
        width: 300px
    }

    .header-nav .pro__cat li {
        height: 46px
    }

    .header-nav .pro__cat-content {
        padding-left: 30px;
        padding-bottom: 220px
    }
}

@media (max-width:1420px) {
    :root {
        --nav-height: 60px;
        --nav-left-width: calc(100px + 11vw);
        --nav-grid-width: 220px;
        --nav-side-space: 80px;
        --vms-pop-height: 70px
    }

    .header-nav .nav__header .logo {
        padding-left: 50px
    }

    .header-nav .nav__content-right {
        padding: 24px var(--nav-side-space) 24px 0
    }

    .header-nav .nav__2nd-menu li {
        height: 50px
    }

    .header-nav .nav__2nd-menu li a {
        padding-left: 60px
    }

    .header-nav .nav__4th:not(:first-of-type) {
        margin-top: 20px
    }

    .header-nav .nav__4th.leaf:not(:first-of-type) {
        margin-top: 10px
    }

    .header-nav .nav__3rd:not(:first-of-type) {
        margin-top: 30px
    }

    .header-nav .nav__content-block--normal {
        padding-left: calc(var(--nav-side-space) + 80px)
    }

    .header-nav .pro__cat {
        padding: 0 10px;
        width: 260px
    }

    .header-nav .pro__cat li {
        height: 42px
    }

    .header-nav .pro__cat-content {
        padding-left: 20px;
        padding-bottom: 200px
    }
}

/*! autoprefixer: on */
:root {
    font-size: 16px;
    --uppercase-required: "Required"
}
/**
* {
    margin: 0;
    padding: 0;
    border: none;
    line-height: 1.6;
    font-family: Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif
}
**/

.hidden,
[hidden] {
    display: none !important;
    position: absolute !important;
    visibility: hidden !important
}

sub,
sup {
    line-height: 0;
    font-size: inherit;
    zoom: .6
}

sub {
    vertical-align: baseline
}

sup {
    vertical-align: super
}

@-moz-document url-prefix() {

    sub,
    sup {
        font-size: .6em
    }
}

svg.symbol {
    width: 1em;
    height: 1em;
    vertical-align: -.15em;
    fill: currentcolor;
    overflow: hidden;
    font-size: inherit
}

.swiper-button-next,
.swiper-button-prev,
a {
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    outline: none;
    text-decoration: none
}

.swiper-button-next:after,
.swiper-button-prev:after,
a:after {
    font-size: inherit
}

.swiper-button--custom:after {
    content: none !important
}

button {
    cursor: pointer
}

.captcha,
.verifycode {
    cursor: pointer;
    background-color: #fff
}

img:not([src]),
img[src=""] {
    display: inline-block !important
}

img.verifycode {
    background-color: #fff;
    border-radius: 6px
}

.p-left-0 {
    padding-left: 0 !important
}

.w-full {
    width: 100%
}

.youtube-embed {
    --youtube-width: 960px;
    width: var(--youtube-width);
    display: inline-block
}

.youtube-embed iframe {
    width: var(--youtube-width);
    height: calc(.5625 * var(--youtube-width))
}

.youtube-list-btn {
    position: absolute;
    right: 52px;
    bottom: 0;
    height: 46px;
    width: 67px
}

.swiper-container .swiper-wrapper {
    height: auto
}

.flex {
    display: flex
}

.flex-column {
    display: flex;
    flex-direction: column
}

.clearfix:after {
    clear: both;
    display: block;
    content: ""
}

textarea {
    resize: none
}

/**
ul li {
    list-style: none
}
**/


/*  仅作用于正文中的 ul 列表 */
.wh_topic_content ul li,
.wh_topic ul li,
.wh_content_area ul li {
  list-style: disc !important;
  margin-left: 1.5em;
}

.wh_publication_toc ul li {
  list-style: none !important;
  margin-left: 0 !important;
}



[class*=icon-],
img {
    vertical-align: middle
}

[class*=icon-] {
    font-family: iconfont !important;
    font-size: 20px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1
}

.align-center {
    text-align: center !important
}

.align-left {
    text-align: left !important
}

.align-right {
    text-align: right !important
}

.align-justify {
    text-align: justify !important
}

.family-manrope * {
    font-family: manrope, Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, "sans-serif" !important
}

.family-manrope a,
.family-manrope span {
    font-family: inherit
}

.family-manrope [class*=icon-] {
    font-family: iconfont !important
}

footer {
    background-color: #f5f5f5
}

footer .pop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999;
    display: none;
    background-color: rgba(0, 0, 0, .3)
}

footer .pop .pop-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

footer .pop .pop-wrap .pop-btn {
    position: absolute;
    top: 10%;
    right: 22.5%;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 9999
}

footer .pop-small {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 999;
    display: none
}

footer .pop-small .pop-wrap {
    width: 350px
}

footer .pop-small .pop-wrap a,
footer .pop-small .pop-wrap a canvas {
    width: 100%
}

footer .pop-small .pop-wrap .pop-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 9999
}

footer .nav {
    background-color: #61a7d8;
    color: #fff;
    padding: 30px 0;
    text-align: center
}

footer .nav a {
    color: #fff
}

footer .nav>ul {
    width: 1100px;
    display: inline-flex;
    justify-content: space-between
}

footer .nav>ul>li {
    font-size: 1.5rem
}

footer .nav>ul>li i {
    display: block;
    font-size: 52px
}

footer .nav>ul>li i:hover {
    transition-duration: .6s;
    transform: rotate(1turn)
}

footer .nav>ul>li>ul {
    margin-top: 10px
}

footer .nav>ul>li>ul li {
    font-size: 1rem;
    padding: 0
}

footer.footer-merged .footer-text {
    margin: 0;
    font-size: 13px;
    color: #666
}

footer.footer-merged .footer-wrap {
    width: 92.688rem;
    margin: 0 auto;
    padding-top: 50px;
    display: flex;
    align-items: flex-start
}

footer.footer-merged .footer-wrap .footer--left {
    flex-shrink: 0;
    width: 36.25rem;
    margin-right: 3.75rem;
    box-sizing: border-box
}

footer.footer-merged .footer-wrap .footer--left h4 {
    font-size: 24px;
    color: #666;
    font-weight: 400;
    margin: 0;
    margin-top: 30px
}

footer.footer-merged .footer-wrap .footer--left .milesight-footer-logo {
    width: 210px
}

footer.footer-merged .footer-wrap .footer--left .ovif {
    width: 180px;
    margin-top: 20px;
    margin-left: -16px
}

footer.footer-merged .footer-wrap .footer--left .footer-text {
    margin: 0;
    margin-bottom: 20px
}

footer.footer-merged .footer-wrap .footer--left .iot-btn {
    font-weight: 400;
    padding: 2px 16px;
    border-radius: 5px;
    background-color: #3691fc;
    color: #fff;
    display: inline-block;
    margin: 16px 0;
    transition: all .5s ease
}

footer.footer-merged .footer-wrap .footer--left .iot-btn:hover {
    transform: scale(1.05)
}

footer.footer-merged .footer-wrap .footer--left .follow-us .line {
    width: 100%;
    height: 1px;
    background-color: hsla(0, 0%, 40%, .4);
    margin: 10px 0
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link {
    height: 50px;
    display: flex;
    align-items: center
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out {
    margin: 0 5px
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out:nth-child(2) i {
    color: #0f6da6;
    font-size: 32px
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out:nth-child(3) i {
    color: #e7141a
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out:nth-child(4) i {
    color: #2fb0ec
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out:nth-child(5) i {
    color: #3b62a7
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out:nth-child(6) i {
    background-image: linear-gradient(225deg, #1800ca, #d22578, #fffb00);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out.skype i {
    color: #00aff0
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out.github {
    position: relative;
    left: -9px
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out.github i {
    color: #4278c4
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out.phone {
    position: relative;
    left: -13px
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-out.phone i {
    color: #3ac34c
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .linkedin {
    margin-left: 10px !important
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-in {
    display: flex;
    flex-direction: column;
    transition: all .5s ease
}

footer.footer-merged .footer-wrap .footer--left .follow-us .follow-link .icon-wrap-in i {
    font-size: 36px;
    line-height: 40px
}

footer.footer-merged .footer-wrap .footer--left .lora-wrap {
    height: 50px;
    display: flex;
    align-items: center;
    font-size: 18px;
    margin-left: -18px;
    margin-top: 30px
}

footer.footer-merged .footer-wrap .footer--left .lora-wrap svg {
    font-size: 80px
}

footer.footer-merged .footer-wrap .footer--left .lora-wrap img {
    width: 80px
}

footer.footer-merged .footer-wrap .footer--left .lora-wrap .bold {
    font-weight: 700;
    margin-right: 5px
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-top: 1.25rem
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon {
    position: relative;
    overflow: hidden
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon input {
    box-sizing: border-box;
    padding-left: 3.13vw;
    width: 17.188rem;
    height: 3rem;
    font-size: 1rem;
    background-color: #fbfbfb;
    box-shadow: inset 0 2px 5px 0 rgba(93, 93, 93, .06);
    border-radius: .375rem;
    border: 1px solid #dcdcdc;
    color: #333
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon input::placeholder {
    color: #a5a5a5
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon .icon-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 3rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon .icon-wrap svg {
    font-size: 1.625rem;
    color: #666
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-icon .icon-wrap:after {
    content: "";
    position: absolute;
    right: 0;
    top: calc(50% - .5rem);
    height: 1rem;
    border-left: 1px solid #b0b0b0
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-verifycode .verifycode {
    position: absolute;
    left: 1px;
    top: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-right: .313rem;
    width: 6.25rem;
    height: calc(100% - 2px);
    overflow: hidden;
    background-color: transparent;
    box-sizing: border-box
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-verifycode .verifycode img {
    width: 100%;
    background-color: transparent
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-verifycode .verifycode:after {
    content: "";
    position: absolute;
    right: 0;
    top: calc(50% - .5rem);
    height: 1rem;
    border-left: 1px solid #b0b0b0
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .input-verifycode input {
    box-sizing: border-box;
    padding-left: 7rem
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .download-pop-btn {
    width: 17.188rem;
    height: 3rem;
    border-radius: .375rem;
    background-color: #469bff;
    color: #fff;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease
}

footer.footer-merged .footer-wrap .footer--left .footer__newsletter-form form .download-pop-btn:hover {
    transform: translateY(-.313rem);
    box-shadow: .313rem .313rem 1.25rem rgba(0, 0, 0, .4)
}

footer.footer-merged .footer-wrap .footer--right {
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

footer.footer-merged .footer-wrap .footer--right .footer-nav {
    flex-grow: 0;
    flex-shrink: 0;
    width: 11.25rem;
    padding: 0 6%;
    white-space: nowrap;
    margin-bottom: 20px;
    box-sizing: content-box
}

footer.footer-merged .footer-wrap .footer--right .footer-text {
    font-size: 12px;
    margin: 0
}

footer.footer-merged .footer-wrap .footer--right a {
    color: #3d4a59;
    padding: 3px 0;
    display: inline-block
}

footer.footer-merged .footer-wrap .footer--right a:hover {
    color: #469bff
}

footer.footer-merged .footer-wrap .footer--right h3 {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 7px;
    margin-top: 5px;
    color: #333
}

footer .footer-copyright {
    height: 70px;
    width: 92.688rem;
    margin: 20px auto 0;
    justify-content: space-between;
    font-size: 14px
}

footer .footer-copyright,
footer .footer-copyright-link {
    display: flex;
    align-items: center
}

footer .footer-copyright-link a {
    color: #3d4a59
}

footer .footer-copyright-link a:hover {
    color: #0599d9;
    text-decoration: underline
}

footer .footer-copyright-link .line {
    width: 1px;
    height: 18px;
    background-color: #3d4a59;
    margin: 0 14px
}

footer .slogan {
    text-align: center
}

footer .slogan img {
    width: 100%
}

footer .slogan a {
    font-size: 40px;
    margin: 0 20px
}

footer .slogan .blue {
    color: #29a6ff
}

footer .slogan .orange {
    color: #fb702b
}

footer .slogan .gray {
    color: #4376aa
}

footer .slogan .red {
    color: #dc452f
}

footer .copyright {
    padding: 40px 0 60px;
    background-color: #f3f3f3;
    text-align: center
}

footer .copyright a {
    color: #29a6ff
}

footer .copyright p {
    color: #666
}

footer .copyright .policy {
    margin-left: 30px
}

@keyframes pulse-big {
    0% {
        transform: scale(1.2);
        opacity: 0
    }

    50% {
        opacity: .2
    }

    to {
        transform: scale(1.6);
        opacity: 0
    }
}

.right-contact {
    position: fixed;
    right: 53px;
    bottom: 60px;
    z-index: 998
}

.right-contact input::input-placeholder {
    font-size: 12px
}

.right-contact .contact__btn {
    transition-duration: .4s;
    transform-origin: bottom right;
    transform: translateX(-50px) scale(1)
}

.right-contact .contact__btn i {
    font-size: 50px;
    width: 78px;
    height: 78px;
    display: flex;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    background-color: #0080f7;
    color: #fff;
    border: 8px solid rgba(99, 175, 251, .6);
    background-clip: content-box;
    border-radius: 50%;
    position: relative;
    cursor: pointer
}

.right-contact .contact__btn i:after {
    content: "";
    display: block;
    position: absolute;
    left: -1px;
    top: -1px;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border: 2px solid #017ff7;
    border-radius: 50%;
    animation-name: pulse-big;
    animation-fill-mode: both;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
    transform-origin: center center
}

.right-contact .contact__btn p {
    color: #017ff7;
    margin-top: 10px;
    text-align: center
}

.right-contact .contact__btn.hover~.contact__dialog,
.right-contact .contact__btn:hover~.contact__dialog {
    padding: 16px 20px;
    max-height: 80px;
    border: 1px solid #dbe9f8;
    overflow: visible
}

.right-contact .contact__btn.hover~.contact__dialog p,
.right-contact .contact__btn:hover~.contact__dialog p {
    max-height: 80px;
    transition-duration: 1s
}

.right-contact .contact__dialog {
    position: absolute;
    width: 230px;
    height: 80px;
    right: 70px;
    bottom: 140px;
    background: #eff5fc;
    box-shadow: 0 5px 40px rgba(0, 0, 0, .1);
    border-radius: 6px;
    font-size: 16px;
    color: #165eae;
    padding: 0 16px;
    overflow: hidden;
    border: none;
    max-height: 0;
    transition-duration: .6s;
    box-sizing: border-box
}

.right-contact .contact__dialog p {
    max-height: 0;
    overflow: hidden;
    transition-duration: .4s
}

.right-contact .contact__dialog:before {
    content: "";
    position: absolute;
    right: 19px;
    bottom: -21px;
    border: 12px solid #dbe9f8;
    border-bottom-color: transparent;
    border-left-color: transparent;
    z-index: -1
}

.right-contact .contact__dialog:after {
    content: "";
    position: absolute;
    right: 20px;
    bottom: -19px;
    border: 10px solid #eff5fc;
    border-bottom-color: transparent;
    border-left-color: transparent
}

.right-contact .contact__form {
    width: 200px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
    padding: 12px 10px 20px;
    box-sizing: border-box;
    position: absolute;
    right: 0;
    bottom: 0;
    transform: scale(0);
    transition-duration: .4s;
    transform-origin: bottom right
}

.right-contact .contact__form i {
    background-color: #469bff;
    color: #fff;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    padding: 1px;
    line-height: 22px;
    position: absolute;
    text-align: center;
    right: 10px;
    top: 10px;
    cursor: pointer
}

.right-contact .contact__form .form__title {
    color: #333;
    font-size: 1rem
}

.right-contact .contact__form .form__footer {
    text-align: right;
    margin-top: 4px
}

.right-contact .contact__form form {
    margin-top: 4px
}

.right-contact .contact__form input,
.right-contact .contact__form select,
.right-contact .contact__form textarea {
    outline: none;
    border: 1px solid #d2d9dc;
    box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, .1);
    width: 100%;
    box-sizing: border-box;
    font-size: .9rem;
    border-radius: 6px;
    padding: 0 10px;
    margin-top: 10px;
    height: 30px
}

.right-contact .contact__form input::placeholder,
.right-contact .contact__form select::placeholder,
.right-contact .contact__form textarea::placeholder {
    color: #777
}

.right-contact .contact__form input:focus-visible,
.right-contact .contact__form select:focus-visible,
.right-contact .contact__form textarea:focus-visible {
    outline: 1px solid #469bff
}

.right-contact .contact__form input:focus-visible::placeholder,
.right-contact .contact__form select:focus-visible::placeholder,
.right-contact .contact__form textarea:focus-visible::placeholder {
    color: #999
}

.right-contact .contact__form input {
    padding: 0 5px
}

.right-contact .contact__form select {
    padding: 0 0 0 6px
}

.right-contact .contact__form select[unselected] {
    color: #777
}

.right-contact .contact__form select:focus-visible[unselected] {
    color: #999
}

.right-contact .contact__form textarea {
    height: auto
}

.right-contact .contact__form button {
    background-color: #469bff;
    color: #fff;
    padding: 4px 10px;
    border-radius: 6px;
    margin-top: 10px;
    width: 100%
}

.right-contact .contact__form .verify-code-content {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.right-contact .contact__form .verify-code-content img {
    width: 38%;
    vertical-align: middle;
    margin-right: 5px
}

.right-contact .contact__form .verify-code-content input {
    margin-top: 0
}

.right-contact.active .contact__btn {
    transform: translateX(0) scale(0)
}

.right-contact.active .contact__form {
    transform: none;
    transition-duration: .6s
}

.right-btns,
.right-contact.active .contact__dialog {
    display: none
}

.right-btns {
    position: fixed;
    right: -50px;
    top: calc(50% - 168px);
    z-index: 997;
    opacity: 0;
    transition-duration: .4s
}

.right-btns.active {
    opacity: 1;
    right: 0;
    transition-duration: .6s
}

.right-btns .btns-right {
    width: 46px;
    background-image: linear-gradient(216deg, #f1f7fd, #fafafa), linear-gradient(#00a0e8, #00a0e8);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .11);
    border-radius: 4px;
    border: 1px solid #fff;
    padding: 2px 0
}

.right-btns .btns-right a {
    width: 42px;
    height: 44px;
    margin: 0 auto;
    text-align: center;
    border-bottom: 1px solid #e8edf3;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    position: relative
}

.right-btns .btns-right a:hover {
    background-color: #ececec
}

.right-btns .btns-right a:last-child {
    border-bottom: unset
}

.right-btns .btns-right a .right-btns-hover-img {
    display: none;
    transition: all .5s ease .2s;
    opacity: 0;
    position: absolute;
    top: calc(50% - 40px);
    right: calc(100% + 15px);
    width: 70px;
    height: 70px;
    background-color: #f4f8fc;
    padding: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    border-radius: 4px;
    border: 2px solid #fff
}

.right-btns .btns-right a .right-btns-hover-img img {
    width: 100%
}

.right-btns .btns-right a .right-btns-hover-img:after {
    content: "";
    position: absolute;
    left: 99%;
    top: 50%;
    transform: translateY(-50%);
    border: 10px solid transparent;
    border-left: 10px solid #f4f8fc;
    filter: drop-shadow(6px 0 5px #cecece)
}

.right-btns .btns-right a.active .right-btns-hover-img {
    display: block;
    opacity: 1
}

.right-btns .to-top {
    height: 48px
}

.right-btns .to-top i {
    height: 46px
}

.right-btns .top-text {
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: 4px;
    vertical-align: top;
    right: 0;
    display: inline-block;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    pointer-events: none
}

.right-btns .to-top {
    width: 46px;
    height: 36px;
    background-image: linear-gradient(216deg, #f1f7fd, #fafafa), linear-gradient(#007ee8, #007ee8);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .11);
    border-radius: 4px;
    border: 1px solid #fff;
    cursor: pointer;
    margin-top: 2px
}

.right-btns .to-top,
.right-btns .to-top i {
    display: flex;
    align-items: center;
    justify-content: center
}

.right-btns .to-top i {
    border-radius: 4px;
    font-size: 32px;
    width: 42px;
    height: 34px;
    color: #666
}

.right-btns .to-top:hover i {
    background-color: #ececec
}

@keyframes open {
    0% {
        max-width: 0
    }

    to {
        max-width: 1100px
    }
}

@keyframes dropDown {
    0% {
        transform: translateY(-400px) scaleX(.4)
    }

    50% {
        transform: translateY(0) scale(.4)
    }

    to {
        transform: translateY(0) scale(1)
    }
}

@keyframes unfold {
    0% {
        max-height: 0
    }

    to {
        max-height: 200px
    }
}

.cover {
    text-align: left;
    color: #fff;
    background-image: url(/static/pc/en/page/whatshot/index/banner-bg.png?t=1704771621826);
    position: relative;
    height: 546px;
    background-position: 50%;
    background-size: cover
}

.cover__content {
    height: 380px;
    position: absolute;
    left: calc(50% - 550px);
    top: 100px;
    padding: 40px 0;
    width: 1100px;
    display: inline-block;
    background-color: rgba(7, 16, 34, .5);
    margin-top: 20px;
    text-align: left;
    box-sizing: border-box;
    animation-name: open;
    animation-duration: 1s;
    animation-delay: 1.4s;
    animation-fill-mode: backwards
}

.cover__title {
    font-size: 3.2rem;
    animation-duration: 2s;
    animation-name: dropDown;
    animation-delay: .4s;
    animation-fill-mode: backwards;
    width: 1000px;
    text-align: left;
    transform-origin: left;
    margin-left: 50px;
    color: #fff
}

.cover__text {
    width: 950px;
    overflow: hidden;
    font-size: 1.2rem;
    padding-top: 20px;
    text-align: left;
    animation-name: unfold;
    animation-duration: 1s;
    animation-delay: 2.6s;
    animation-fill-mode: backwards;
    padding-left: 50px;
    color: #fff
}

.first-contact {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 999;
    background-color: rgba(0, 0, 0, .3)
}

.first-contact,
.first-contact * {
    box-sizing: content-box
}

.first-contact .contact__body {
    width: 400px;
    box-sizing: border-box;
    background-color: #fff;
    position: absolute;
    left: calc(50% - 200px);
    top: calc(50vh - 250px);
    border-radius: 6px
}

.first-contact .contact__content {
    text-align: center;
    padding: 50px 0;
    background-image: url(/static/pc/en/firstcontact-bg.png?t=1704771621826);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: top;
    margin: 0;
    border-radius: inherit;
    overflow: hidden
}

.first-contact .contact__content form input,
.first-contact .contact__content form select,
.first-contact .contact__content form textarea {
    width: 250px;
    margin-top: 8px;
    background: #f4f5f7;
    height: 35px;
    border: none;
    box-sizing: border-box;
    padding: 0 20px
}

.first-contact .contact__content form textarea {
    height: auto
}

.first-contact .contact__content form select[unselected] {
    color: gray
}

.first-contact .contact__content form button {
    display: inline-block;
    padding: 5px 25px;
    margin-top: 22px;
    background: #017ff7;
    color: #fff;
    border-radius: 30px;
    font-size: 16px;
    box-shadow: 1px 2px rgba(45, 140, 244, .1);
    cursor: pointer
}

.first-contact .contact__content form .verify-code-content {
    display: inline-flex;
    vertical-align: middle;
    width: 250px;
    align-items: center;
    justify-content: space-between
}

.first-contact .contact__content form .verify-code-content input {
    width: 60%;
    margin-top: 0
}

.first-contact .contact__content form .verify-code-content img {
    height: 35px
}

.first-contact .contact__content p {
    max-width: 260px;
    display: inline-block;
    font-size: 1.1rem;
    margin-bottom: 20px;
    color: #fff
}

.first-contact .contact__close {
    position: absolute;
    border-radius: 50%;
    border: 2px solid #fff;
    top: -80px;
    right: 10px;
    width: 32px;
    height: 32px;
    padding: 2px;
    cursor: pointer
}

.first-contact .contact__close:after {
    content: "";
    position: absolute;
    bottom: -42px;
    left: 17px;
    background-color: #fff;
    width: 2px;
    height: 42px
}

.first-contact .contact__close i {
    font-size: 32px;
    color: #fff
}

@media screen and (max-width:1220px) {
    footer .nav>ul {
        width: 924px
    }
}

.form__newsletter-pop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(45, 140, 244, .9);
    z-index: 999;
    padding: 10px 0 5px;
    text-align: center;
    font-size: 1.25rem;
    display: none
}

.form__newsletter-pop p {
    color: #fff;
    margin-bottom: .625rem
}

.form__newsletter-pop .form--top {
    display: flex;
    justify-content: center;
    column-gap: .938rem;
    width: 53.125rem;
    margin: 0 auto;
    flex-wrap: wrap;
    padding-bottom: .625rem
}

.form__newsletter-pop select {
    box-sizing: content-box
}

.form__newsletter-pop select[unselected] {
    color: gray
}

.form__newsletter-pop input,
.form__newsletter-pop select {
    background-color: #fff;
    width: 22.5rem;
    height: 2rem;
    min-height: 24px;
    padding: 0 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    font-size: 1rem;
    line-height: 2
}

.form__newsletter-pop .flex-box {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    column-gap: .938rem;
    margin-left: -.25rem;
    width: calc(22.5rem + 20px)
}

.form__newsletter-pop .flex-box .verify-code-content {
    display: flex;
    align-items: center
}

.form__newsletter-pop .flex-box .verify-code-content img {
    height: 2rem;
    min-height: 24px;
    margin-right: 5px
}

.form__newsletter-pop .flex-box .verify-code-content input {
    width: 6.25rem;
    height: 2rem;
    min-height: 24px;
    font-size: 1rem;
    line-height: 2;
    box-sizing: border-box;
    margin-bottom: 0
}

.form__newsletter-pop .flex-box button {
    border: 2px solid #fff;
    transition-duration: .3s;
    color: #fff;
    background-color: transparent;
    border-radius: 5px;
    padding: 0 1.875rem;
    font-size: 1rem;
    line-height: 2;
    height: 2rem;
    min-height: 24px
}

.form__newsletter-pop .flex-box button:hover {
    background-color: rgba(0, 0, 0, .1)
}

.form__newsletter-pop .close-btn {
    position: absolute;
    top: 10px;
    right: 20px;
    color: #fff;
    font-size: 30px;
    cursor: pointer
}

.autumn-launch-pop {
    cursor: pointer;
    z-index: 99;
    position: fixed;
    left: calc(50% - 9vw);
    bottom: calc(50% - 12vw);
    width: 18vw;
    height: 24vw;
    display: none
}

.autumn-launch-pop img {
    width: 100%
}

.autumn-launch-pop .autumn-launch-btn {
    position: absolute;
    bottom: 0;
    left: 50px
}

.autumn-launch-pop .close {
    cursor: pointer;
    width: 16%;
    height: 12%;
    position: absolute;
    bottom: 1%;
    left: 42%
}

.autumnLaunch-pop-end {
    bottom: 30px;
    left: 20px;
    width: 16vw;
    height: auto
}

.pop-animation {
    animation: centerToLeftBottom 1s ease 3s both
}

@keyframes centerToLeftBottom {
    to {
        bottom: 30px;
        left: 50px;
        width: 16vw;
        height: auto
    }
}

.jitter {
    animation: jitter 1s infinite
}

@keyframes jitter {
    20% {
        transform: rotate(-3deg)
    }

    40% {
        transform: rotate(3deg)
    }

    60% {
        transform: rotate(-3deg)
    }

    80% {
        transform: rotate(3deg)
    }

    to {
        transform: rotate(0)
    }
}

.upAndDown {
    animation: upAndDown 1.5s infinite
}

@keyframes upAndDown {
    0% {
        transform: translateY(-5px)
    }

    50% {
        transform: translateY(5px)
    }

    to {
        transform: translateY(-5px)
    }
}

.toRight {
    animation: toRight 1s infinite
}

@keyframes toRight {
    0% {
        transform: translateX(-5px)
    }

    50% {
        transform: translateX(5px)
    }

    to {
        transform: translateX(-5px)
    }
}

.growingToTop {
    animation: growingToTop 1s both
}

@keyframes growingToTop {
    0% {
        height: 0
    }

    to {
        height: 100%
    }
}

.fadeInSBS {
    animation: fadeInSBS 2s both;
    transform-origin: 10% 90%
}

@keyframes fadeInSBS {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        transform: scale3d(1.05, 1.05, 1.05);
        opacity: 1
    }

    to {
        transform: scaleX(1);
        opacity: 1
    }
}

.animate__delay-250ms {
    animation-delay: .25s !important
}

.animate__delay-500ms {
    animation-delay: .5s !important
}

.animate__delay-1000ms {
    animation-delay: 1s !important
}

.animate__delay-1500ms {
    animation-delay: 1.5s !important
}

.bigAndSmall {
    animation: bigAndSmall 1s both infinite
}

@keyframes bigAndSmall {
    0% {
        transform: scale(1)
    }

    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }

    to {
        transform: scaleX(1)
    }
}

.animate__growRightToLeft {
    animation: growLeftToRight 2s both
}

.animate__growLeftToRight {
    animation: growLeftToRight 1s both 1s
}

@keyframes growLeftToRight {
    0% {
        width: 0
    }

    to {
        width: 25vw
    }
}

#hubspot-messages-iframe-container.widget-align-right {
    display: none !important
}

.tabs-and-crumbs {
    height: 4.375rem;
    position: sticky;
    top: var(--nav-height);
    background-color: #fff;
    z-index: 100;
    box-shadow: 0 .188rem .25rem 0 rgba(0, 0, 0, .06)
}

.tabs-and-crumbs .inside {
    width: 98.75rem;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: space-between
}

.tabs-and-crumbs .inside.justify-end {
    justify-content: flex-end
}

.tabs-and-crumbs .tabs {
    display: flex;
    align-items: stretch;
    justify-content: flex-start
}

.tabs-and-crumbs .tabs li {
    padding: 0 1.875rem;
    list-style: none;
    font-weight: 500;
    color: #666;
    font-size: var(--nav-1st-font-size);
    cursor: pointer;
    display: flex;
    align-items: center;
    position: relative
}

.tabs-and-crumbs .tabs li svg {
    font-size: 2.5rem;
    margin-right: .625rem
}

.tabs-and-crumbs .tabs li span {
    color: currentcolor
}

.tabs-and-crumbs .tabs li:not(:first-child):after {
    content: "";
    position: absolute;
    top: 20%;
    left: 0;
    width: 0;
    height: 60%;
    border-left: 1px solid #ddd
}

.tabs-and-crumbs .tabs li.active {
    background-color: #469bff;
    color: #fff
}

.tabs-and-crumbs .tabs li.active+li:after,
.tabs-and-crumbs .tabs li.active:after {
    content: none
}

.tabs-and-crumbs .tabs li:not(.active):hover {
    color: #469bff
}

.tabs-and-crumbs .tabs--type2 {
    gap: 1.875rem
}

.tabs-and-crumbs .tabs--type2 li {
    padding: 0
}

.tabs-and-crumbs .tabs--type2 li.active {
    background-color: #fff;
    color: #469bff
}

.tabs-and-crumbs .tabs--type2 li.active:after {
    content: "";
    display: block;
    width: 100%;
    height: 0;
    border-bottom: .25rem solid #469bff;
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto
}

.tabs-and-crumbs .crumbs {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .25rem;
    position: relative
}

.tabs-and-crumbs .crumbs li {
    font-weight: 500;
    color: #666;
    font-size: var(--nav-1st-font-size)
}

.tabs-and-crumbs .crumbs li a {
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    text-decoration: none
}

.tabs-and-crumbs .crumbs li a:hover {
    color: #469bff
}

.tabs-and-crumbs .crumbs li:after {
    content: ">";
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    margin-left: .25rem
}

.tabs-and-crumbs .crumbs li:last-of-type:after {
    content: none
}

.tabs-and-crumbs--dark {
    background-color: var(--bg-color, #000)
}

.tabs-and-crumbs--dark .crumbs li,
.tabs-and-crumbs--dark .tabs li {
    color: #fff
}

.download-pop {
    position: relative;
    width: 38.125rem !important;
    will-change: auto
}

.download-pop,
.download-pop * {
    box-sizing: border-box
}

.download-pop-title {
    font-size: 1.5rem;
    color: #333;
    font-weight: 500
}

.download-pop-content {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2.08vw 2.92vw
}

.download-pop-content .img-wrap {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 10.875rem
}

.download-pop-content .img-wrap .img-text {
    margin-top: 1.04vw;
    font-size: .83vw;
    color: #333;
    line-height: 1.3;
    font-weight: 500
}

.download-pop-content form .input-icon {
    position: relative;
    margin-bottom: 1.625rem;
    overflow: hidden
}

.download-pop-content form .input-icon input {
    padding-left: 3.13vw;
    width: 29.375rem;
    height: 3rem;
    font-size: 1rem;
    background-color: #fbfbfb;
    box-shadow: inset 0 2px 5px 0 rgba(93, 93, 93, .06);
    border-radius: .375rem;
    border: 1px solid #dcdcdc;
    color: #333
}

.download-pop-content form .input-icon input::placeholder {
    color: #a5a5a5
}

.download-pop-content form .input-icon .icon-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 3rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.download-pop-content form .input-icon .icon-wrap svg {
    font-size: 1.625rem;
    color: #666
}

.download-pop-content form .input-icon .icon-wrap:after {
    content: "";
    position: absolute;
    right: 0;
    top: calc(50% - .5rem);
    height: 1rem;
    border-left: 1px solid #b0b0b0
}

.download-pop-content form .input-verifycode .captcha-wrap {
    position: absolute;
    left: 1px;
    top: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5.938rem;
    height: calc(100% - 2px);
    overflow: hidden;
    background-color: transparent
}

.download-pop-content form .input-verifycode .captcha-wrap img {
    width: 100%;
    background-color: transparent
}

.download-pop-content form .input-verifycode .captcha-wrap:after {
    content: "";
    position: absolute;
    right: 0;
    top: calc(50% - .5rem);
    height: 1rem;
    border-left: 1px solid #b0b0b0
}

.download-pop-content form .input-verifycode input {
    padding-left: 6.75rem
}

.download-pop-content form .download-pop-btn {
    margin-top: 2.5rem;
    width: 29.375rem;
    height: 3rem;
    border-radius: .375rem;
    background-color: #469bff;
    color: #fff;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease
}

.download-pop-content form .download-pop-btn:hover {
    transform: translateY(-.313rem);
    box-shadow: .313rem .313rem 1.25rem rgba(0, 0, 0, .4)
}

.download-pop-content .submit-success-text {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 17.688rem;
    font-size: 1.25rem;
    font-weight: 500;
    color: #666
}

.download-pop-content .submit-success-btn {
    width: 29.375rem;
    height: 3rem;
    border-radius: .375rem;
    background-color: #469bff;
    color: #fff;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
    cursor: pointer
}

.download-pop-content .submit-success-btn:hover {
    transform: translateY(-.313rem);
    box-shadow: .313rem .313rem 1.25rem rgba(0, 0, 0, .4)
}

.download-pop-inner .close {
    position: absolute;
    right: .875rem;
    top: calc(-4.063rem - 20px);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border: 1px solid #fff;
    border-radius: 50%;
    cursor: pointer
}

.download-pop-inner .close svg {
    font-size: 2.188rem;
    color: #fff
}

.download-pop-inner .close:after {
    content: "";
    position: absolute;
    top: 100%;
    height: 2.75rem;
    border-left: 1px solid #fff
}

.download-pop--img {
    position: relative;
    width: 46.25rem;
    will-change: auto
}

.download-pop--img,
.download-pop--img * {
    box-sizing: border-box
}

.download-pop--img .download-pop-content {
    justify-content: space-between
}

.download-pop--img .download-pop-content form .input-icon input {
    width: 21.25rem
}

.download-pop--img .download-pop-content .download-pop-btn {
    margin-top: 2.5rem;
    width: 21.25rem
}

.download-pop--img .download-pop-content .submit-success-btn {
    width: 21.25rem
}

@media (min-width:2040px) {
    :root {
        font-size: 17px
    }
}

@media (max-width:1800px) {
    :root {
        font-size: 15px
    }
}

@media (max-width:1680px) {
    :root {
        font-size: 14px
    }
}

@media (max-width:1560px) {
    :root {
        font-size: 13px
    }
}

@media (max-width:1440px) {
    :root {
        font-size: 12px
    }
}

@media (max-width:1320px) {
    :root {
        font-size: 11px
    }
}

@media (max-width:1200px) {
    :root {
        font-size: 10px
    }
}

/*! autoprefixer: on */
.filter-select {
    position: relative
}

.filter-select:before {
    content: "";
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg class='icon' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' data-spm-anchor-id='a313x.7781069.0.i6' width='200' height='200'%3E%3Cpath d='M276.8 374.4c6.4 0 14.4 3.2 19.2 8l211.2 211.2c3.2 3.2 8 3.2 9.6 0L728 382.4c11.2-11.2 27.2-11.2 38.4 0s11.2 27.2 0 38.4L555.2 632c-24 24-64 24-88 0L257.6 420.8c-11.2-11.2-11.2-27.2 0-38.4 4.8-4.8 12.8-8 19.2-8z' fill='%23333'/%3E%3C/svg%3E");
    width: 1.5em;
    height: 1.5em;
    background-size: 100% 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all .2s
}

.filter-select .select__input.active~.select__list {
    max-height: 15.625rem;
    min-height: 2.5rem;
    opacity: 1
}

.filter-select .select__list {
    position: absolute;
    left: 0;
    top: calc(100% + 2px);
    width: 100%;
    border-radius: 8px;
    outline: 1px solid #4696f5;
    max-height: 0;
    opacity: 0;
    transition: all .3s;
    background-color: #fff;
    padding: 10px 0;
    overflow-y: scroll;
    scrollbar-width: 6px
}

.filter-select .select__list::-webkit-scrollbar {
    width: 6px
}

.filter-select .select__list::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 8px
}

.filter-select .select__list li {
    display: block;
    cursor: pointer;
    text-align: left;
    padding-left: .4em;
    font-size: 1rem;
    line-height: 2
}

.filter-select .select__list li:hover {
    background-color: rgba(70, 150, 245, .1)
}

.filter-select .select__list li.hide {
    display: none
}

.filter-select.active:before {
    transform: translateY(-50%) rotate(-180deg)
}

.form-btm {
    padding: 5rem 0
}

.form-btm * {
    box-sizing: border-box;
    font-family: manrope, Helvetica Neue, Helvetica, Arial, PingFang SC, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, "sans-serif"
}

.form-btm .form {
    width: 92.688rem;
    background-color: #f5f5f5;
    border: 1px solid #d0d0d0;
    border-radius: 10px;
    margin: 0 auto;
    padding: 2.5rem 10rem 3.75rem;
    text-align: center
}

.form-btm .form-content {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 0 2.188rem
}

.form-btm .form .input {
    margin: .625rem 0
}

.form-btm .form .input .label {
    color: #333;
    font-size: 1rem;
    line-height: 2;
    margin-bottom: .25rem;
    text-align: left
}

.form-btm .form .input input,
.form-btm .form .input select {
    height: 2.875rem;
    background-color: #fff;
    border-radius: 8px;
    width: 100%;
    padding: 0 1.25rem;
    font-size: 1rem
}

.form-btm .form .input input:focus-visible,
.form-btm .form .input select:focus-visible {
    outline: 1px solid #469bff
}

.form-btm .form .input input.country-code,
.form-btm .form .input select.country-code {
    padding: 0 .625rem
}

.form-btm .form .input-group {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0 .688rem
}

.form-btm .form .input-group .col-1 {
    width: 33.3333333333%
}

.form-btm .form .input-group .col-2 {
    width: 66.6666666667%
}

.form-btm .form .input-group .verifycode,
.form-btm .form .input-radios {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 2.875rem
}

.form-btm .form .input-radios {
    gap: 0 2.5rem
}

.form-btm .form .input-radios input {
    width: 1rem;
    height: 1rem
}

.form-btm .form .input-radios>div {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0 .625rem
}

.form-btm .form input[type=submit] {
    background-color: #469bff;
    border-radius: .5rem;
    padding: .3em 1em;
    width: 14.563rem;
    height: 2.875rem;
    border-radius: 8px;
    color: #fff;
    font-size: 1.125rem;
    line-height: 1.25;
    margin-top: 3.438rem;
    cursor: pointer;
    transition: all .2s
}

.form-btm .form input[type=submit]:hover {
    color: #fff !important;
    background-color: #71afff
}

.form-btm .form input[type=submit]:active {
    color: #fff !important;
    background-color: #2c84ec
}

.form-btm .form input[type=submit]:disabled {
    color: #fff !important;
    background-color: #c1c1c1
}

.form-btm .form input[type=submit]:hover {
    transform: translateY(-4px);
    box-shadow: 0 0 8px rgba(0, 0, 0, .4)
}

.form-btm .form-group {
    width: 100%
}

.form-btm .form-group .input .input-group.input-box {
    position: relative
}

.form-btm .form-group .input .input-group.input-box .icon {
    position: absolute;
    left: 6.25rem;
    top: .813rem;
    font-weight: 900;
    font-size: 1rem;
    color: #000;
    transform: rotate(0deg);
    transition: all .3s ease
}

.form-btm .form-group .input .input-group.input-box .icon.active {
    transform: rotate(-180deg);
    transition: all .3s ease
}