*, :after, :before { --tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x:;
--tw-pan-y:;
--tw-pinch-zoom:;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position:;
--tw-gradient-via-position:;
--tw-gradient-to-position:;
--tw-ordinal:;
--tw-slashed-zero:;
--tw-numeric-figure:;
--tw-numeric-spacing:;
--tw-numeric-fraction:;
--tw-ring-inset:;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgba(59,130,246,.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur:;
--tw-brightness:;
--tw-contrast:;
--tw-grayscale:;
--tw-hue-rotate:;
--tw-invert:;
--tw-saturate:;
--tw-sepia:;
--tw-drop-shadow:;
--tw-backdrop-blur:;
--tw-backdrop-brightness:;
--tw-backdrop-contrast:;
--tw-backdrop-grayscale:;
--tw-backdrop-hue-rotate:;
--tw-backdrop-invert:;
--tw-backdrop-opacity:;
--tw-backdrop-saturate:;
--tw-backdrop-sepia:;
--tw-contain-size:;
--tw-contain-layout:;
--tw-contain-paint:;
--tw-contain-style:
}
::backdrop {
--tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x:;
--tw-pan-y:;
--tw-pinch-zoom:;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position:;
--tw-gradient-via-position:;
--tw-gradient-to-position:;
--tw-ordinal:;
--tw-slashed-zero:;
--tw-numeric-figure:;
--tw-numeric-spacing:;
--tw-numeric-fraction:;
--tw-ring-inset:;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgba(59,130,246,.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur:;
--tw-brightness:;
--tw-contrast:;
--tw-grayscale:;
--tw-hue-rotate:;
--tw-invert:;
--tw-saturate:;
--tw-sepia:;
--tw-drop-shadow:;
--tw-backdrop-blur:;
--tw-backdrop-brightness:;
--tw-backdrop-contrast:;
--tw-backdrop-grayscale:;
--tw-backdrop-hue-rotate:;
--tw-backdrop-invert:;
--tw-backdrop-opacity:;
--tw-backdrop-saturate:;
--tw-backdrop-sepia:;
--tw-contain-size:;
--tw-contain-layout:;
--tw-contain-paint:;
--tw-contain-style:
}/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/
*, :after, :before { border: 0 solid #e5e7eb; box-sizing: border-box }
:after, :before { --tw-content:""
}
:host, html {
line-height:1.5;
-webkit-text-size-adjust:100%;
font-family:ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
font-feature-settings:normal;
font-variation-settings:normal;
-moz-tab-size:4;
-o-tab-size:4;
tab-size:4;
-webkit-tap-highlight-color:transparent
}
body { line-height: inherit; margin: 0 }
hr { border-top-width: 1px; color: inherit; height: 0 }
abbr:where([title]) {
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit }
a { color: inherit; text-decoration: inherit }
b, strong { font-weight: bolder }
code, kbd, pre, samp { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; font-feature-settings: normal; font-size: 1em; font-variation-settings: normal }
small { font-size: 80% }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline }
sub { bottom: -.25em }
sup { top: -.5em }
table { border-collapse: collapse; border-color: inherit; text-indent: 0 }
button, input, optgroup, select, textarea { color: inherit; font-family: inherit; font-feature-settings: inherit; font-size: 100%; font-variation-settings: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; margin: 0; padding: 0 }
button, select { text-transform: none }
button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) {
-webkit-appearance:button;
background-color:transparent;
background-image:none
}
:-moz-focusring {
outline:auto
}
:-moz-ui-invalid {
box-shadow:none
}
progress { vertical-align: baseline }
::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
height:auto
}
[type=search] {
-webkit-appearance:textfield;
outline-offset:-2px
}
::-webkit-search-decoration {
-webkit-appearance:none
}
::-webkit-file-upload-button {
-webkit-appearance:button;
font:inherit
}
summary { display: list-item }
blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre { margin: 0 }
fieldset { margin: 0 }
fieldset, legend { padding: 0 }
menu, ol, ul { list-style: none; margin: 0; padding: 0 }
dialog { padding: 0 }
textarea { resize: vertical }
input::-moz-placeholder, textarea::-moz-placeholder {
color:#9ca3af;
opacity:1
}
input::placeholder, textarea::placeholder {
color:#9ca3af;
opacity:1
}
[role=button], button {
cursor:pointer
}
:disabled { cursor: default }
audio, canvas, embed, iframe, img, object, svg, video { display: block; vertical-align: middle }
img, video { height: auto; max-width: 100% }
[hidden]:where(:not([hidden=until-found])) {
display:none
}
:root { --inherit:inherit;
--current:currentColor;
--transparent:transparent;
--black:#000;
--white:#fff;
--slate-50:#f8fafc;
--slate-100:#f1f5f9;
--slate-200:#e2e8f0;
--slate-300:#cbd5e1;
--slate-400:#94a3b8;
--slate-500:#64748b;
--slate-600:#475569;
--slate-700:#334155;
--slate-800:#1e293b;
--slate-900:#0f172a;
--slate-950:#020617;
--gray-50:#f9fafb;
--gray-100:#f3f4f6;
--gray-200:#e5e7eb;
--gray-300:#d1d5db;
--gray-400:#9ca3af;
--gray-500:#6b7280;
--gray-600:#4b5563;
--gray-700:#374151;
--gray-800:#1f2937;
--gray-900:#111827;
--gray-950:#030712;
--zinc-50:#fafafa;
--zinc-100:#f4f4f5;
--zinc-200:#e4e4e7;
--zinc-300:#d4d4d8;
--zinc-400:#a1a1aa;
--zinc-500:#71717a;
--zinc-600:#52525b;
--zinc-700:#3f3f46;
--zinc-800:#27272a;
--zinc-900:#18181b;
--zinc-950:#09090b;
--neutral-50:#fafafa;
--neutral-100:#f5f5f5;
--neutral-200:#e5e5e5;
--neutral-300:#d4d4d4;
--neutral-400:#a3a3a3;
--neutral-500:#737373;
--neutral-600:#525252;
--neutral-700:#404040;
--neutral-800:#262626;
--neutral-900:#171717;
--neutral-950:#0a0a0a;
--stone-50:#fafaf9;
--stone-100:#f5f5f4;
--stone-200:#e7e5e4;
--stone-300:#d6d3d1;
--stone-400:#a8a29e;
--stone-500:#78716c;
--stone-600:#57534e;
--stone-700:#44403c;
--stone-800:#292524;
--stone-900:#1c1917;
--stone-950:#0c0a09;
--red-50:#fef2f2;
--red-100:#fee2e2;
--red-200:#fecaca;
--red-300:#fca5a5;
--red-400:#f87171;
--red-500:#ef4444;
--red-600:#dc2626;
--red-700:#b91c1c;
--red-800:#991b1b;
--red-900:#7f1d1d;
--red-950:#450a0a;
--orange-50:#fff7ed;
--orange-100:#ffedd5;
--orange-200:#fed7aa;
--orange-300:#fdba74;
--orange-400:#fb923c;
--orange-500:#f97316;
--orange-600:#ea580c;
--orange-700:#c2410c;
--orange-800:#9a3412;
--orange-900:#7c2d12;
--orange-950:#431407;
--amber-50:#fffbeb;
--amber-100:#fef3c7;
--amber-200:#fde68a;
--amber-300:#fcd34d;
--amber-400:#fbbf24;
--amber-500:#f59e0b;
--amber-600:#d97706;
--amber-700:#b45309;
--amber-800:#92400e;
--amber-900:#78350f;
--amber-950:#451a03;
--yellow-50:#fefce8;
--yellow-100:#fef9c3;
--yellow-200:#fef08a;
--yellow-300:#fde047;
--yellow-400:#facc15;
--yellow-500:#eab308;
--yellow-600:#ca8a04;
--yellow-700:#a16207;
--yellow-800:#854d0e;
--yellow-900:#713f12;
--yellow-950:#422006;
--lime-50:#f7fee7;
--lime-100:#ecfccb;
--lime-200:#d9f99d;
--lime-300:#bef264;
--lime-400:#a3e635;
--lime-500:#84cc16;
--lime-600:#65a30d;
--lime-700:#4d7c0f;
--lime-800:#3f6212;
--lime-900:#365314;
--lime-950:#1a2e05;
--green-50:#f0fdf4;
--green-100:#dcfce7;
--green-200:#bbf7d0;
--green-300:#86efac;
--green-400:#4ade80;
--green-500:#22c55e;
--green-600:#16a34a;
--green-700:#15803d;
--green-800:#166534;
--green-900:#14532d;
--green-950:#052e16;
--emerald-50:#ecfdf5;
--emerald-100:#d1fae5;
--emerald-200:#a7f3d0;
--emerald-300:#6ee7b7;
--emerald-400:#34d399;
--emerald-500:#10b981;
--emerald-600:#059669;
--emerald-700:#047857;
--emerald-800:#065f46;
--emerald-900:#064e3b;
--emerald-950:#022c22;
--teal-50:#f0fdfa;
--teal-100:#ccfbf1;
--teal-200:#99f6e4;
--teal-300:#5eead4;
--teal-400:#2dd4bf;
--teal-500:#14b8a6;
--teal-600:#0d9488;
--teal-700:#0f766e;
--teal-800:#115e59;
--teal-900:#134e4a;
--teal-950:#042f2e;
--cyan-50:#ecfeff;
--cyan-100:#cffafe;
--cyan-200:#a5f3fc;
--cyan-300:#67e8f9;
--cyan-400:#22d3ee;
--cyan-500:#06b6d4;
--cyan-600:#0891b2;
--cyan-700:#0e7490;
--cyan-800:#155e75;
--cyan-900:#164e63;
--cyan-950:#083344;
--sky-50:#f0f9ff;
--sky-100:#e0f2fe;
--sky-200:#bae6fd;
--sky-300:#7dd3fc;
--sky-400:#38bdf8;
--sky-500:#0ea5e9;
--sky-600:#0284c7;
--sky-700:#0369a1;
--sky-800:#075985;
--sky-900:#0c4a6e;
--sky-950:#082f49;
--blue-50:#eff6ff;
--blue-100:#dbeafe;
--blue-200:#bfdbfe;
--blue-300:#93c5fd;
--blue-400:#60a5fa;
--blue-500:#3b82f6;
--blue-600:#2563eb;
--blue-700:#1d4ed8;
--blue-800:#1e40af;
--blue-900:#1e3a8a;
--blue-950:#172554;
--indigo-50:#eef2ff;
--indigo-100:#e0e7ff;
--indigo-200:#c7d2fe;
--indigo-300:#a5b4fc;
--indigo-400:#818cf8;
--indigo-500:#6366f1;
--indigo-600:#4f46e5;
--indigo-700:#4338ca;
--indigo-800:#3730a3;
--indigo-900:#312e81;
--indigo-950:#1e1b4b;
--violet-50:#f5f3ff;
--violet-100:#ede9fe;
--violet-200:#ddd6fe;
--violet-300:#c4b5fd;
--violet-400:#a78bfa;
--violet-500:#8b5cf6;
--violet-600:#7c3aed;
--violet-700:#6d28d9;
--violet-800:#5b21b6;
--violet-900:#4c1d95;
--violet-950:#2e1065;
--purple-50:#faf5ff;
--purple-100:#f3e8ff;
--purple-200:#e9d5ff;
--purple-300:#d8b4fe;
--purple-400:#c084fc;
--purple-500:#a855f7;
--purple-600:#9333ea;
--purple-700:#7e22ce;
--purple-800:#6b21a8;
--purple-900:#581c87;
--purple-950:#3b0764;
--fuchsia-50:#fdf4ff;
--fuchsia-100:#fae8ff;
--fuchsia-200:#f5d0fe;
--fuchsia-300:#f0abfc;
--fuchsia-400:#e879f9;
--fuchsia-500:#d946ef;
--fuchsia-600:#c026d3;
--fuchsia-700:#a21caf;
--fuchsia-800:#86198f;
--fuchsia-900:#701a75;
--fuchsia-950:#4a044e;
--pink-50:#fdf2f8;
--pink-100:#fce7f3;
--pink-200:#fbcfe8;
--pink-300:#f9a8d4;
--pink-400:#f472b6;
--pink-500:#ec4899;
--pink-600:#db2777;
--pink-700:#be185d;
--pink-800:#9d174d;
--pink-900:#831843;
--pink-950:#500724;
--rose-50:#fff1f2;
--rose-100:#ffe4e6;
--rose-200:#fecdd3;
--rose-300:#fda4af;
--rose-400:#fb7185;
--rose-500:#f43f5e;
--rose-600:#e11d48;
--rose-700:#be123c;
--rose-800:#9f1239;
--rose-900:#881337;
--rose-950:#4c0519;
--border:hsl(var(--border));
--input:hsl(var(--input));
--ring:hsl(var(--ring));
--background:hsl(var(--background));
--foreground:hsl(var(--foreground));
--primary:hsl(var(--primary));
--primary-foreground:hsl(var(--primary-foreground));
--secondary:hsl(var(--secondary));
--secondary-foreground:hsl(var(--secondary-foreground));
--destructive:hsl(var(--destructive));
--destructive-foreground:hsl(var(--destructive-foreground));
--muted:hsl(var(--muted));
--muted-foreground:hsl(var(--muted-foreground));
--accent:hsl(var(--accent));
--accent-foreground:hsl(var(--accent-foreground));
--popover:hsl(var(--popover));
--popover-foreground:hsl(var(--popover-foreground));
--card:hsl(var(--card));
--card-foreground:hsl(var(--card-foreground))
}
.pointer-events-none { pointer-events: none }
.absolute { position: absolute }
.relative { position: relative }
.-inset-\[10px\] { top: -10px; right: -10px; bottom: -10px; left: -10px }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0 }
.flex { display: flex }
.flex-col { flex-direction: column }
.items-center { align-items: center }
.justify-center { justify-content: center }
.overflow-hidden { overflow: hidden }
.bg-zinc-50 {
--tw-bg-opacity:1; background-color: rgb(250 250 250/var(--tw-bg-opacity, 1)) }
.text-slate-950 {
--tw-text-opacity:1; color: rgb(2 6 23/var(--tw-text-opacity, 1)) }
.opacity-50 { opacity: .5 }
.blur-\[10px\] { --tw-blur:blur(10px)
}
.blur-\[10px\], .invert { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) }
.invert { --tw-invert:invert(100%)
}
.filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) }
@keyframes enter { 0% {
opacity:var(--tw-enter-opacity, 1);
transform:translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0))
}
}
@keyframes exit { to {
opacity:var(--tw-exit-opacity, 1);
transform:translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0))
}
}
.\[--aurora\:repeating-linear-gradient\(100deg\,var\(--blue-500\)_10\%\,var\(--indigo-300\)_15\%\,var\(--blue-300\)_20\%\,var\(--violet-200\)_25\%\,var\(--blue-400\)_30\%\)\] { --aurora:repeating-linear-gradient(100deg, var(--blue-500) 10%, var(--indigo-300) 15%, var(--blue-300) 20%, var(--violet-200) 25%, var(--blue-400) 30%)
}
.\[--dark-gradient\:repeating-linear-gradient\(100deg\,var\(--black\)_0\%\,var\(--black\)_7\%\,var\(--transparent\)_10\%\,var\(--transparent\)_12\%\,var\(--black\)_16\%\)\] { --dark-gradient:repeating-linear-gradient(100deg, var(--black) 0%, var(--black) 7%, var(--transparent) 10%, var(--transparent) 12%, var(--black) 16%)
}
.\[--white-gradient\:repeating-linear-gradient\(100deg\,var\(--white\)_0\%\,var\(--white\)_7\%\,var\(--transparent\)_10\%\,var\(--transparent\)_12\%\,var\(--white\)_16\%\)\] { --white-gradient:repeating-linear-gradient(100deg, var(--white) 0%, var(--white) 7%, var(--transparent) 10%, var(--transparent) 12%, var(--white) 16%)
}
.\[background-image\:var\(--white-gradient\)\,var\(--aurora\)\] { background-image: var(--white-gradient), var(--aurora) }
.\[background-position\:50\%_50\%\,50\%_50\%\] { background-position: 50% 50%, 50% 50% }
.\[background-size\:300\%\,_200\%\] { background-size: 300%, 200% }
.\[mask-image\:radial-gradient\(ellipse_at_100\%_0\%\,black_10\%\,var\(--transparent\)_70\%\)\] { -webkit-mask-image: radial-gradient(ellipse at 100% 0, #000 10%, var(--transparent) 70%); mask-image: radial-gradient(ellipse at 100% 0, #000 10%, var(--transparent) 70%) }
img { display: inline-block; max-width: none; width: auto }
* { box-sizing: revert }
html { font-family: pingfang SC, sans-serif, Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; font-size: 16px; word-spacing: 1px; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; box-sizing: border-box }
.after\:absolute:after { content: var(--tw-content); position: absolute }
.after\:inset-0:after { content: var(--tw-content); top: 0; right: 0; bottom: 0; left: 0 }
.after\:content-\[\"\"\]:after {
--tw-content:""; content: var(--tw-content) }
.after\:\[background-attachment\:fixed\]:after { background-attachment: fixed; content: var(--tw-content) }
.after\:\[background-image\:var\(--white-gradient\)\,var\(--aurora\)\]:after { background-image: var(--white-gradient), var(--aurora); content: var(--tw-content) }
.after\:\[background-size\:200\%_100\%\]:after { background-size: 200% 100%; content: var(--tw-content) }
.dark\:bg-zinc-900:where(.dark, .dark *) {
--tw-bg-opacity:1;
background-color:rgb(24 24 27/var(--tw-bg-opacity, 1))
}
.dark\:invert-0:where(.dark, .dark *) {
--tw-invert:invert(0);
filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.dark\:\[background-image\:var\(--dark-gradient\)\,var\(--aurora\)\]:where(.dark, .dark *) {
background-image:var(--dark-gradient), var(--aurora)
}
.after\:dark\:\[background-image\:var\(--dark-gradient\)\,var\(--aurora\)\]:where(.dark, .dark *):after {
background-image:var(--dark-gradient), var(--aurora);
content:var(--tw-content)
}
.aurora-background[data-v-8c1919e3] { background-color: transparent; height: 696px; position: absolute; right: 0; top: 0; width: 60% }
.aurora-background-gradient-after[data-v-8c1919e3]:after { top: 0; right: 0; bottom: 0; left: 0; mix-blend-mode: difference; position: absolute; --tw-content:"";
background-attachment: fixed; background-image: var(--white-gradient), var(--aurora); background-size: 200% 100%; content: var(--tw-content) }
.aurora-background-gradient-after[data-v-8c1919e3]:where(.dark, .dark *):after {
background-image:var(--dark-gradient), var(--aurora);
content:var(--tw-content)
}
.aurora-gradient-animation[data-v-8c1919e3]:after { animation: animate-aurora-8c1919e3 60s linear infinite }
.inset-0[data-v-8c1919e3] { right: 0; top: 0 }
@keyframes animate-aurora-8c1919e3 { 0% {
background-position:50% 50%, 50% 50%
}
to { background-position: 350% 50%, 350% 50% }
}/*!
* 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)*.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; animation-iteration-count: 1!important; transition-duration: 1ms!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% {
transform:translateZ(0) scaleY(.95);
transition-timing-function:cubic-bezier(.215, .61, .355, 1)
}
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:translate(0)
}
6.5% {
transform:translate(-6px) rotateY(-9deg)
}
18.5% {
transform:translate(5px) rotateY(7deg)
}
31.5% {
transform:translate(-3px) rotateY(-5deg)
}
43.5% {
transform:translate(2px) rotateY(3deg)
}
50% {
transform:translate(0)
}
}
.animate__headShake { animation-name: headShake; animation-timing-function: ease-in-out }
@keyframes swing { 20% {
transform:rotate(15deg)
}
40% {
transform:rotate(-10deg)
}
60% {
transform:rotate(5deg)
}
80% {
transform:rotate(-5deg)
}
to { transform: rotate(0) }
}
.animate__swing { animation-name: swing; transform-origin: top center }
@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:skew(-12.5deg) skewY(-12.5deg)
}
33.3% {
transform:skew(6.25deg) skewY(6.25deg)
}
44.4% {
transform:skew(-3.125deg) skewY(-3.125deg)
}
55.5% {
transform:skew(1.5625deg) skewY(1.5625deg)
}
66.6% {
transform:skew(-.78125deg) skewY(-.78125deg)
}
77.7% {
transform:skew(.390625deg) skewY(.390625deg)
}
88.8% {
transform:skew(-.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-duration: 1.3s; animation-duration:calc(var(--animate-duration)*1.3);
animation-name: heartBeat; animation-timing-function: ease-in-out }
@keyframes backInDown { 0% {
opacity:.7;
transform:translateY(-1200px) scale(.7)
}
80% {
opacity:.7;
transform:translateY(0) scale(.7)
}
to { opacity: 1; transform: scale(1) }
}
.animate__backInDown { animation-name: backInDown }
@keyframes backInLeft { 0% {
opacity:.7;
transform:translate(-2000px) scale(.7)
}
80% {
opacity:.7;
transform:translate(0) scale(.7)
}
to { opacity: 1; transform: scale(1) }
}
.animate__backInLeft { animation-name: backInLeft }
@keyframes backInRight { 0% {
opacity:.7;
transform:translate(2000px) scale(.7)
}
80% {
opacity:.7;
transform:translate(0) scale(.7)
}
to { opacity: 1; transform: scale(1) }
}
.animate__backInRight { animation-name: backInRight }
@keyframes backInUp { 0% {
opacity:.7;
transform:translateY(1200px) scale(.7)
}
80% {
opacity:.7;
transform:translateY(0) scale(.7)
}
to { opacity: 1; transform: scale(1) }
}
.animate__backInUp { animation-name: backInUp }
@keyframes backOutDown { 0% {
opacity:1;
transform:scale(1)
}
20% {
opacity:.7;
transform:translateY(0) scale(.7)
}
to { opacity: .7; transform: translateY(700px) scale(.7) }
}
.animate__backOutDown { animation-name: backOutDown }
@keyframes backOutLeft { 0% {
opacity:1;
transform:scale(1)
}
20% {
opacity:.7;
transform:translate(0) scale(.7)
}
to { opacity: .7; transform: translate(-2000px) scale(.7) }
}
.animate__backOutLeft { animation-name: backOutLeft }
@keyframes backOutRight { 0% {
opacity:1;
transform:scale(1)
}
20% {
opacity:.7;
transform:translate(0) scale(.7)
}
to { opacity: .7; transform: translate(2000px) scale(.7) }
}
.animate__backOutRight { animation-name: backOutRight }
@keyframes backOutUp { 0% {
opacity:1;
transform:scale(1)
}
20% {
opacity:.7;
transform:translateY(0) scale(.7)
}
to { opacity: .7; transform: translateY(-700px) scale(.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)*.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)*.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% {
animation-timing-function:ease-out;
transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
}
40% {
animation-timing-function:ease-out;
transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
}
50% {
animation-timing-function:ease-in;
transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
}
80% {
animation-timing-function:ease-in;
transform:perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0)
}
to { animation-timing-function: ease-in; transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0) }
}
.animate__animated.animate__flip { animation-name: flip; backface-visibility: visible }
@keyframes flipInX { 0% {
animation-timing-function:ease-in;
opacity:0;
transform:perspective(400px) rotateX(90deg)
}
40% {
animation-timing-function:ease-in;
transform:perspective(400px) rotateX(-20deg)
}
60% {
opacity:1;
transform:perspective(400px) rotateX(10deg)
}
80% {
transform:perspective(400px) rotateX(-5deg)
}
to { transform: perspective(400px) }
}
.animate__flipInX { animation-name: flipInX; backface-visibility: visible!important }
@keyframes flipInY { 0% {
animation-timing-function:ease-in;
opacity:0;
transform:perspective(400px) rotateY(90deg)
}
40% {
animation-timing-function:ease-in;
transform:perspective(400px) rotateY(-20deg)
}
60% {
opacity:1;
transform:perspective(400px) rotateY(10deg)
}
80% {
transform:perspective(400px) rotateY(-5deg)
}
to { transform: perspective(400px) }
}
.animate__flipInY { animation-name: flipInY; backface-visibility: visible!important }
@keyframes flipOutX { 0% {
transform:perspective(400px)
}
30% {
opacity:1;
transform:perspective(400px) rotateX(-20deg)
}
to { opacity: 0; transform: perspective(400px) rotateX(90deg) }
}
.animate__flipOutX { animation-duration: .75s; animation-duration:calc(var(--animate-duration)*.75);
animation-name: flipOutX; backface-visibility: visible!important }
@keyframes flipOutY { 0% {
transform:perspective(400px)
}
30% {
opacity:1;
transform:perspective(400px) rotateY(-15deg)
}
to { opacity: 0; transform: perspective(400px) rotateY(90deg) }
}
.animate__flipOutY { animation-duration: .75s; animation-duration:calc(var(--animate-duration)*.75);
animation-name: flipOutY; backface-visibility: visible!important }
@keyframes lightSpeedInRight { 0% {
opacity:0;
transform:translate3d(100%, 0, 0) skew(-30deg)
}
60% {
opacity:1;
transform:skew(20deg)
}
80% {
transform:skew(-5deg)
}
to { transform: translateZ(0) }
}
.animate__lightSpeedInRight { animation-name: lightSpeedInRight; animation-timing-function: ease-out }
@keyframes lightSpeedInLeft { 0% {
opacity:0;
transform:translate3d(-100%, 0, 0) skew(30deg)
}
60% {
opacity:1;
transform:skew(-20deg)
}
80% {
transform:skew(5deg)
}
to { transform: translateZ(0) }
}
.animate__lightSpeedInLeft { animation-name: lightSpeedInLeft; animation-timing-function: ease-out }
@keyframes lightSpeedOutRight { 0% {
opacity:1
}
to { opacity: 0; transform: translate3d(100%, 0, 0) skew(30deg) }
}
.animate__lightSpeedOutRight { animation-name: lightSpeedOutRight; animation-timing-function: ease-in }
@keyframes lightSpeedOutLeft { 0% {
opacity:1
}
to { opacity: 0; transform: translate3d(-100%, 0, 0) skew(-30deg) }
}
.animate__lightSpeedOutLeft { animation-name: lightSpeedOutLeft; animation-timing-function: ease-in }
@keyframes rotateIn { 0% {
opacity:0;
transform:rotate(-200deg)
}
to { opacity: 1; transform: translateZ(0) }
}
.animate__rotateIn { animation-name: rotateIn; transform-origin: center }
@keyframes rotateInDownLeft { 0% {
opacity:0;
transform:rotate(-45deg)
}
to { opacity: 1; transform: translateZ(0) }
}
.animate__rotateInDownLeft { animation-name: rotateInDownLeft; transform-origin: left bottom }
@keyframes rotateInDownRight { 0% {
opacity:0;
transform:rotate(45deg)
}
to { opacity: 1; transform: translateZ(0) }
}
.animate__rotateInDownRight { animation-name: rotateInDownRight; transform-origin: right bottom }
@keyframes rotateInUpLeft { 0% {
opacity:0;
transform:rotate(45deg)
}
to { opacity: 1; transform: translateZ(0) }
}
.animate__rotateInUpLeft { animation-name: rotateInUpLeft; transform-origin: left bottom }
@keyframes rotateInUpRight { 0% {
opacity:0;
transform:rotate(-90deg)
}
to { opacity: 1; transform: translateZ(0) }
}
.animate__rotateInUpRight { animation-name: rotateInUpRight; transform-origin: right bottom }
@keyframes rotateOut { 0% {
opacity:1
}
to { opacity: 0; transform: rotate(200deg) }
}
.animate__rotateOut { animation-name: rotateOut; transform-origin: center }
@keyframes rotateOutDownLeft { 0% {
opacity:1
}
to { opacity: 0; transform: rotate(45deg) }
}
.animate__rotateOutDownLeft { animation-name: rotateOutDownLeft; transform-origin: left bottom }
@keyframes rotateOutDownRight { 0% {
opacity:1
}
to { opacity: 0; transform: rotate(-45deg) }
}
.animate__rotateOutDownRight { animation-name: rotateOutDownRight; transform-origin: right bottom }
@keyframes rotateOutUpLeft { 0% {
opacity:1
}
to { opacity: 0; transform: rotate(-45deg) }
}
.animate__rotateOutUpLeft { animation-name: rotateOutUpLeft; transform-origin: left bottom }
@keyframes rotateOutUpRight { 0% {
opacity:1
}
to { opacity: 0; transform: rotate(90deg) }
}
.animate__rotateOutUpRight { animation-name: rotateOutUpRight; transform-origin: right bottom }
@keyframes hinge { 0% {
animation-timing-function:ease-in-out
}
20%, 60% {
animation-timing-function:ease-in-out;
transform:rotate(80deg)
}
40%, 80% {
animation-timing-function:ease-in-out;
opacity:1;
transform:rotate(60deg)
}
to { opacity: 0; transform: translate3d(0, 700px, 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% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:0;
transform:scale3d(.1, .1, .1) translate3d(0, -1000px, 0)
}
60% {
animation-timing-function:cubic-bezier(.175, .885, .32, 1);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0)
}
}
.animate__zoomInDown { animation-name: zoomInDown }
@keyframes zoomInLeft { 0% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:0;
transform:scale3d(.1, .1, .1) translate3d(-1000px, 0, 0)
}
60% {
animation-timing-function:cubic-bezier(.175, .885, .32, 1);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(10px, 0, 0)
}
}
.animate__zoomInLeft { animation-name: zoomInLeft }
@keyframes zoomInRight { 0% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:0;
transform:scale3d(.1, .1, .1) translate3d(1000px, 0, 0)
}
60% {
animation-timing-function:cubic-bezier(.175, .885, .32, 1);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(-10px, 0, 0)
}
}
.animate__zoomInRight { animation-name: zoomInRight }
@keyframes zoomInUp { 0% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:0;
transform:scale3d(.1, .1, .1) translate3d(0, 1000px, 0)
}
60% {
animation-timing-function:cubic-bezier(.175, .885, .32, 1);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0)
}
}
.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% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0)
}
to { animation-timing-function: cubic-bezier(.175, .885, .32, 1); opacity: 0; transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0) }
}
.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% {
animation-timing-function:cubic-bezier(.55, .055, .675, .19);
opacity:1;
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0)
}
to { animation-timing-function: cubic-bezier(.175, .885, .32, 1); opacity: 0; transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0) }
}
.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 { transform: translate3d(0, 100%, 0); visibility: hidden }
}
.animate__slideOutDown { animation-name: slideOutDown }
@keyframes slideOutLeft { 0% {
transform:translateZ(0)
}
to { transform: translate3d(-100%, 0, 0); visibility: hidden }
}
.animate__slideOutLeft { animation-name: slideOutLeft }
@keyframes slideOutRight { 0% {
transform:translateZ(0)
}
to { transform: translate3d(100%, 0, 0); visibility: hidden }
}
.animate__slideOutRight { animation-name: slideOutRight }
@keyframes slideOutUp { 0% {
transform:translateZ(0)
}
to { transform: translate3d(0, -100%, 0); visibility: hidden }
}
.animate__slideOutUp { animation-name: slideOutUp }
.swiper .swiper-slide { background-position: 50%; background-size: cover }
.swiper.gallery-thumbs .swiper-slide { background: #f1f3ff; border-radius: 28px; color: #1b51cb; font-size: 14px; height: 100%; padding: 5px 0; text-align: center; width: 25% }
.swiper.gallery-thumbs .swiper-slide-active { background: #1b51cb; color: #fff }
.tab-list-content { padding: 30px 0 }
.tab-list-content .content-list img { display: block; margin: 0 auto 20px; width: 90% }
.tab-list-content .content-list p { color: #676879; font-size: 14px; line-height: 18px }
.tab-list-content .content-list .content-list-mode { align-items: center; color: #1b51cb; display: flex; font-size: 14px; justify-content: left }
.tab-list-content .content-list .content-list-mode a { text-decoration: underline }
.main_banner_bg { background: url(../images/index/mask_group.png) no-repeat 0 -10px, linear-gradient(354deg, #fff, #fff0); background-size: 100% auto; height: 100%; left: 0; overflow: hidden; position: absolute; right: 0; top: 0; width: 100%; z-index: 1 }
.balloon_right { animation: balloonRight 3s linear infinite alternate; animation-direction: reverse; position: absolute; right: 1%; top: 12%; transform-origin: 50% 100%; z-index: 3 }
@keyframes balloonRight { 0% {
transform:rotate(-10deg)
}
25% {
transform:rotate(0)
}
50% {
transform:rotate(10deg)
}
75% {
transform:rotate(0)
}
to { transform: rotate(-10deg) }
}
.v-modal { opacity: .3; z-index: 9999!important }
.main .main_banner { background-color: #f5f7fa; overflow: hidden; position: relative }
.main .main_banner .banner { display: flex; justify-content: center; margin: 0 auto; max-width: 1400px; padding: 80px 20px; position: relative; z-index: 9 }
.main .main_banner .banner .banner_info { align-items: center; display: flex; flex-direction: column; max-width: 800px; position: relative; text-align: center }
.main .main_banner .banner .banner_info .info_top h1 { color: #303133; font-size: 60px; line-height: 1.3em; margin: 20px 0 40px }
.main .main_banner .banner .banner_info .info_top h1>span { color: #1b60fe; position: relative }
.main .main_banner .banner .banner_info .info_top h1>span:after { background: linear-gradient(90deg, #dad8f233, #a8beff80); bottom: -15px; content: ""; filter: blur(5px); height: 35px; left: 0; opacity: .5; position: absolute; width: 100% }
.main .main_banner .banner .banner_info .info_top .subtitle { color: #101828; font-size: 22px; font-weight: 400; line-height: 1.5; padding-bottom: 10px; width: 100% }
.main .main_banner .banner .banner_info .info_top .subtitle br { display: none }
.main .main_banner .banner .banner_info .info_bottom { margin-top: 50px; position: relative; width: -moz-fit-content; width: fit-content }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn { align-items: center; display: flex; position: relative; z-index: 10 }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn a { background: #1b60fe; border-radius: 4px; box-shadow: 0 4px 15px #0b1faf40; color: #fff; display: inline-block; font-size: 22px; height: 60px; line-height: 60px; padding: 0 55px; transition: .25s }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn a:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .main_banner .banner .banner_info .info_bottom .link_chat { background: #fff; border: 1px solid #1b60fe; border-radius: 4px; box-sizing: border-box; color: #1b60fe; cursor: pointer; font-size: 22px; height: 60px; line-height: 60px; margin-left: 50px; padding: 0 55px; position: relative; transition: all .3s }
.main .main_banner .banner .banner_info .info_bottom .link_chat:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40; color: #fff }
.main .main_banner .banner .banner_info .info_bottom .bottom_tip { color: #606266; font-size: 14px; font-weight: 400; text-align: center }
.main .main_banner .banner .banner_info .emailzoom { left: -200px; position: absolute; top: 240px; width: 1000px; z-index: -1 }
.main .main_banner .banner_bottom { display: flex; justify-content: center; overflow: hidden }
.main .main_banner .banner_bottom img { display: block; width: 105% }
.main .main_market_new { overflow: hidden }
.main .main_market_new .market { margin: 0 auto }
.main .main_market_new .market h1 { color: #333; font-size: 40px; padding: 90px 0 50px; text-align: center }
.main .main_market_new .market .market_wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 auto; padding: 0 20px 100px; position: relative; z-index: 9 }
.main .main_market_new .market .market_item { background: linear-gradient(1turn, #fff, #f3f5fc); border: 2px solid #fff; border-radius: 8px; box-shadow: 0 10px 25px #4b5c761f; cursor: pointer; height: auto; position: relative; transition: .3s; width: 18.5% }
.main .main_market_new .market .market_item h2, .main .main_market_new .market .market_item h3 { align-items: center; color: #181818; display: flex; font-size: 28px; font-weight: 400 }
.main .main_market_new .market .market_item h2:before, .main .main_market_new .market .market_item h3:before { background: url(../images/header_icon.png) no-repeat -176px 0; content: ""; display: inline-block; height: 32px; margin-right: 10px; vertical-align: middle; width: 32px; display:none}
.main .main_market_new .market .market_item h2:before, .main .main_market_new .market .market_item h3 .img{ width:32px; margin-bottom:5px}
.main .main_market_new .market .market_item h2:before, .main .main_market_new .market .market_item h3 .img img{ width:32px;}
.main .main_market_new .market .market_item h2>img, .main .main_market_new .market .market_item h3>img { margin-right: 8px; width: 32px }
.main .main_market_new .market .market_item:nth-child(2) h2:before, .main .main_market_new .market .market_item:nth-child(2) h3:before { background-position: -210px 0 }
.main .main_market_new .market .market_item:nth-child(3) h2:before, .main .main_market_new .market .market_item:nth-child(3) h3:before { background-position: -278px 0 }
.main .main_market_new .market .market_item:nth-child(4) h2:before, .main .main_market_new .market .market_item:nth-child(4) h3:before { background-position: -312px 0 }
.main .main_market_new .market .market_item:nth-child(5) h2:before, .main .main_market_new .market .market_item:nth-child(5) h3:before { background-position: -244px 0 }
.main .main_market_new .market .market_item .market_title { position: relative }
.main .main_market_new .market .market_item .market_title>img { display: block; width: 100% }
.main .main_market_new .market .market_item .market_title .img_tox { left: 20px; position: absolute; top: 28px }
.main .main_market_new .market .market_item .market_title .img_tox .sub_title { align-items: center; display: flex; flex-direction: row; margin-top: 10px }
.main .main_market_new .market .market_item .market_title .img_tox .sub_title p { color: #4b5c76; font-size: 14px }
.main .main_market_new .market .market_item .mask { -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); background: #222c; border-radius: 8px; box-sizing: border-box; display: flex; flex-direction: column; height: 100%; justify-content: center; left: 0; opacity: 0; padding: 20px; position: absolute; top: 0; transition: opacity .3s; width: 100% }
.main .main_market_new .market .market_item .mask>p { color: #fff; font-size: 1.1vw; font-weight: lighter; margin-bottom: 15px }
.main .main_market_new .market .market_item .mask .market-title { align-items: center; display: flex; flex-direction: row }
.main .main_market_new .market .market_item .mask .market-title>img { margin-right: 8px; width: 26px }
.main .main_market_new .market .market_item .mask .market-title>h2, .main .main_market_new .market .market_item .mask .market-title>h3 { color: #fff; font-size: 1.2vw; font-weight: 400 }
.main .main_market_new .market .market_item .mask .introduction { display: flex; flex-direction: column; gap: 15px; padding: 30px 10px }
.main .main_market_new .market .market_item .mask .introduction .introduction_item { align-items: center; color: #fff; display: flex; flex-direction: row; font-size:.8vw;
gap: 10px }
.main .main_market_new .market .market_item .mask .link_btn { background: #1b60fe; border-radius: 4px; box-shadow: 0 4px 15px #0b1faf40; color: #fff; display: inline-block; font-size: 14px; height: 35px; line-height: 35px; text-align: center; transition: .3s; width: 100px }
.main .main_market_new .market .market_item .mask .link_btn:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .main_market_new .market .market_item .showMask { opacity: 1 }
.main .market_segment { background-color: #f5f7fa; overflow: hidden; padding-bottom: 85px; position: relative }
.main .market_segment>h1 { color: #191b34; font-size: 40px; padding: 85px 0 50px; text-align: center }
.main .market_segment>p { color: #3d485d; font-size: 22px; font-weight: lighter; padding-bottom: 100px; text-align: center }
.main .market_segment .market_platform { background-image: url(../images/index/potential_pm.webp); background-repeat: no-repeat; background-size: 100% 100%; height: 846px; margin: 0 auto; position: relative; width: 1450px }
.main .market_segment .market_platform .platform-interaction { cursor: pointer; position: absolute; transition: scale .5s }
.main .market_segment .market_platform .platform-interaction:hover { scale: 1.1; z-index: 20 }
.main .market_segment .market_platform .platform-interaction:hover .ripple-container { opacity: 0 }
.main .market_segment .market_platform .platform-interaction .image-mode { background: linear-gradient(180deg, #f0f2f9, #fff); border: 1px solid #fff; border-radius: 4px; box-shadow: 0 5px 29px #3b568d33; opacity: 1; position: relative; transition: opacity .5s; -webkit-user-select: none; -moz-user-select: none; user-select: none }
.main .market_segment .market_platform .platform-interaction .image-mode>h2 { color: #000; font-size: 20px; font-weight: 500; left: 20px; position: absolute; top: 10px }
.main .market_segment .market_platform .platform-interaction .sendMass { box-sizing: border-box; display: flex; flex-direction: column; gap: 10px; height: 232px; padding: 60px 25px 0; width: 312px }
.main .market_segment .market_platform .platform-interaction .sendMass>img { position: absolute }
.main .market_segment .market_platform .platform-interaction .sendMass .sen_user { right: 70px; top: 128px }
.main .market_segment .market_platform .platform-interaction .sendMass .user_replay { left: 70px; top: 90px }
.main .market_segment .market_platform .platform-interaction .sendMass .replay_sale { left: 70px; top: 165px }
.main .market_segment .market_platform .platform-interaction .sendMass>p { align-items: center; border-radius: 5px; box-shadow: 0 2px 10px -2px #181b3440; color: #3a3e5d; display: flex; font-size: 10px; height: 27px; justify-content: center; width: 109px }
.main .market_segment .market_platform .platform-interaction .sendMass>p:nth-child(2) { background: #e3f0fd }
.main .market_segment .market_platform .platform-interaction .sendMass>p:nth-child(3) { background: #f9f1c3; margin-left: auto }
.main .market_segment .market_platform .platform-interaction .sendMass>p:nth-child(4) { background: #dcffef }
.main .market_segment .market_platform .platform-interaction .sendMass>p:nth-child(5) { background: #e4dcff; margin-left: auto }
.main .market_segment .market_platform .platform-interaction .ripple-container { height: 100%; left: 0; opacity: 1; position: absolute; top: 0; transition: opacity .5s; width: 100%; z-index: 9 }
.main .market_segment .market_platform .platform-interaction .ripple-container .ripple-border { border: 1px solid #cbd9f6; border-radius: 4px; bottom: 0; height: 95%; left: 0; margin: auto; opacity: 0; pointer-events: none; position: absolute; right: 0; top: 0; -webkit-user-select: none; -moz-user-select: none; user-select: none; width: 95% }
.main .market_segment .market_platform .platform-interaction .ripple-container .ripple-one { animation: ripple_animation 4s linear 0s infinite }
.main .market_segment .market_platform .platform-interaction .ripple-container .ripple-two { animation: ripple_animation 4s linear 1s infinite }
.main .market_segment .market_platform .postion1 { left: 145px; top: 25px }
.main .market_segment .market_platform .postion1 .image-mode>img { width: 355px }
.main .market_segment .market_platform .postion2 { left: 646px; top: -25px }
.main .market_segment .market_platform .postion2 .image-mode>img { width: 371px }
.main .market_segment .market_platform .postion3 { left: -42px; top: 355px }
.main .market_segment .market_platform .postion3 .image-mode>img { width: 295px }
.main .market_segment .market_platform .postion4 { left: 755px; top: 270px }
.main .market_segment .market_platform .postion5 { right: -65px; top: 175px }
.main .market_segment .market_platform .postion5 .image-mode>img { width: 274px }
.main .market_segment .market_platform .postion6 { bottom: 40px; right: 40px }
.main .market_segment .market_platform .postion6 .image-mode>img { width: 953px }
.main .market_segment .segment { position: relative }
.main .market_segment .segment .segment_bomb { align-items: flex-start; display: flex; height: 100%; justify-content: space-between; left: -100%; position: absolute; top: 0; width: 100% }
.main .market_segment .segment .segment_bomb .bomb_left { align-items: flex-end; display: flex; justify-content: center; width: 45% }
.main .market_segment .segment .segment_bomb .bomb_left .left_content { max-width: 440px }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .back { margin-bottom: 30px }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .back span { align-items: center; color: #333; cursor: pointer; display: inline-flex; font-size: 14px; gap: 5px; line-height: 1; transition: .2s }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .back span i { transition: .2s }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .back span:hover { color: #1b60fe }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .back span:hover i { transform: translate(-5px) }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_title { color: #191b34; font-size: 24px; font-weight: 500; margin-bottom: 20px }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_describes { color: #4b5c76; font-size: 16px; font-weight: 500; line-height: 26px; margin-bottom: 30px }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_button { align-items: center; background: #1b60fe; border-radius: 4px; box-shadow: 0 2px 4px #5255dc26; display: flex; font-size: 16px; height: 40px; justify-content: center; line-height: 40px; position: relative; text-align: center; transition: background-color .2s, box-shadow .2s; width: 136px }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_button a { align-items: center; color: #fff; display: flex }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_button .el-icon-right { margin-left: 8px; transition: .2s }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_button:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .market_segment .segment .segment_bomb .bomb_left .left_content .left_button:hover .el-icon-right { transform: translate(5px) }
.main .market_segment .segment .segment_bomb .bomb_right { width: 55% }
.main .market_segment .segment .segment_bomb .bomb_right .el-tabs__content { overflow: visible }
.main .market_segment .segment .segment_bomb .bomb_right .el-tabs__active-bar { display: none }
.main .market_segment .segment .segment_bomb .bomb_right .el-tabs__item { background: #fff; border: 1px solid #1b60fe; border-radius: 17px; color: #1b60fe; font-size: 14px; font-weight: 300; height: 34px; line-height: 34px; margin: 0 5px; padding: 0 20px!important; transition: .2s }
.main .market_segment .segment .segment_bomb .bomb_right .el-tabs__item.is-active, .main .market_segment .segment .segment_bomb .bomb_right .el-tabs__item:hover { background: #1b60fe; border-color: transparent; color: #fff }
.main .market_segment .segment .segment_bomb .bomb_right .right_content { border: 2px solid #757575; border-radius: 8px 0 0 8px; border-right: none; box-shadow: 0 10px 47px #4b5c761a; margin-top: 30px; position: relative }
.main .market_segment .segment .segment_bomb .bomb_right .right_content>button { align-items: center; background: #1b60fe; border-radius: 9px; box-shadow: 0 4px 19px #0b1faf40; color: #fff; display: flex; font-size: 14px; height: 51px; justify-content: center; position: absolute; top: 20%; transform: translate(-40%); width: 149px }
.main .market_segment .segment .segment_bomb .bomb_right .right_content img { display: block; width: 100% }
.main .market_segment .segment .segment_bomb .verify_right .right_content>button { top: 30% }
.main .market_segment .segment .segment_bomb .warm_right .right_content>button { top: 53% }
.main .market_segment .segment .segment_bomb .market_right .right_content>button { top: 42% }
.main .market_segment .segment .segment_bomb .crm_right .right_content>button { top: 64% }
.main .market_segment .segment .segment_bomb .group_right .right_content>button { top: 8% }
.main .market_segment .segment .segment_bomb_two { left: 0 }
.main .main_market { overflow: hidden }
.main .main_market .market { margin: 0 auto 40px; max-width: 1400px; padding: 0 20px }
.main .main_market .market .market_company { margin: 0 10% }
.main .main_market .market .market_company .company_title { font-size: 20px; margin-bottom: 30px; text-align: center }
.main .main_market .market .market_company .company_list { align-items: center; display: flex; flex-wrap: wrap; justify-content: space-between }
.main .main_market .market .market_company .company_list img { display: block; width: 100% }
.main .main_market .market .market_join { align-items: center; display: flex; flex-direction: column; justify-content: center }
.main .main_market .market .market_join .join_title { color: #303133; font-size: 40px; font-weight: 600; margin-bottom: 50px; padding-top: 50px }
.main .main_market .market .market_join .join_info { margin-bottom: 100px }
.main .main_market .market .market_join .join_info p { color: #606266; font-size: 20px; font-weight: 400; line-height: 1.7em }
.main .main_market .market .market_join .join_info .btn { background: #1b51cb; border-radius: 4px; color: #fff; display: none; font-size: 16px; font-weight: 400; height: 50px; line-height: 50px; margin-top: 35px; padding: 0 38px; transition: all .25s }
.main .main_market .market .market_join .join_info .btn:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .main_market .market .market_custom { display: flex }
.main .main_market .market .market_custom .custom_email { align-items: flex-end; display: flex; flex-direction: column; flex-shrink: 0; width: 37% }
.main .main_market .market .market_custom .custom_email .email_warm { display: flex; justify-content: space-between; width: 100% }
.main .main_market .market .market_custom .custom_email .email_warm .warm_email { flex-shrink: 0; width: 47% }
.main .main_market .market .market_custom .custom_email .email_warm .warm_email li { align-items: center; background: #fff; border-radius: 8px; box-shadow: 0 4px 70px #f4e0d2b3; color: #181b34; display: flex; font-size: 14px; font-weight: 600; margin-bottom: 24px; padding: 12px 30px 32px }
.main .main_market .market .market_custom .custom_email .email_warm .warm_email li img { display: block; height: 50px; margin-right: 10px; width: 50px }
.main .main_market .market .market_custom .custom_email .email_warm .warm_email li:last-child { margin-bottom: 0 }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery { background: #fff; border-radius: 8px; box-shadow: 0 4px 70px #f4e0d2b3; box-sizing: border-box; flex-shrink: 0; padding: 20px 25px 35px; width: 49% }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_title { color: #000; font-size: 16px; font-weight: 600; text-align: center }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_img { margin: 20px 0 25px }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_img img { display: block; margin: 0 auto; width: 90% }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point { display: flex; justify-content: space-between }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point li { align-items: center; color: #3a3e5d; display: flex; font-size: 12px }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point li:before { background: #00c875; border-radius: 50%; content: ""; display: block; flex-shrink: 0; height: 9px; margin-right: 5px; width: 9px }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point li:nth-child(2):before { background: #fdb446 }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point li:last-child { margin-right: 0 }
.main .main_market .market .market_custom .custom_email .email_warm .warm_battery .battery_point li:last-child:before { background: #e2445c }
.main .main_market .market .market_custom .custom_email .email_success { align-items: center; background: #fff; border-radius: 8px; box-shadow: 0 4px 70px #f4e0d2b3; color: #181b34; display: flex; font-size: 20px; font-weight: 600; height: 95px; justify-content: center; margin: 32px 0 62px; width: 81% }
.main .main_market .market .market_custom .custom_email .email_success:before { background: url(../images/index/icon_success.svg) no-repeat; background-size: 100% 100%; content: ""; display: block; height: 46px; margin-right: 20px; width: 46px }
.main .main_market .market .market_custom .custom_email .email_pie { background: #fff; border-radius: 8px; box-shadow: 0 4px 70px #f4e0d2b3; padding: 30px 35px 20px }
.main .main_market .market .market_custom .custom_email .email_pie .pie_title { color: #181b34; font-size: 14px; font-weight: 400; margin-bottom: 40px; text-align: center }
.main .main_market .market .market_custom .custom_email .email_pie .pie_img img { display: block; width: 100% }
.main .main_market .market .market_custom .custom_help { display: flex }
.main .main_market .market .market_custom .custom_help .help_phone { margin: 60px 50px 0 55px }
.main .main_market .market .market_custom .custom_help .help_phone img { border-radius: 8px; box-shadow: 0 4px 70px #f4e0d2b3; display: block }
.main .main_market .market .market_custom .custom_help .help_num { margin: -35px 0 0 -55px }
.main .main_market .market .market_custom .custom_help .help_num .help_time img { display: block }
.main .main_market .market .market_custom .custom_help .help_num .help_custom img { display: block; width: 100% }
.main .main_intro { background: #181b34; color: #fff; padding: 200px 20px }
.main .main_intro .intro_cont { display: flex; justify-content: space-between; margin: 0 auto; max-width: 1350px }
.main .main_intro .intro_cont .cont_info { max-width: 500px; padding: 50px 0 }
.main .main_intro .intro_cont .cont_info .info li { align-items: center; display: flex; margin-bottom: 170px }
.main .main_intro .intro_cont .cont_info .info li .info_icon { align-items: center; background: #fff; border-radius: 50%; box-shadow: 0 2px 25px #6dffff80; display: flex; flex-shrink: 0; height: 55px; justify-content: center; margin-right: 32px; width: 55px }
.main .main_intro .intro_cont .cont_info .info li .info_icon img { display: block; height: 25px; width: 25px }
.main .main_intro .intro_cont .cont_info .info li .info_msg h3 { font-size: 24px; font-weight: 600; margin-bottom: 16px }
.main .main_intro .intro_cont .cont_info .info li .info_msg p { font-size: 16px; font-weight: 400; line-height: 2em }
.main .main_intro .intro_cont .cont_info .info li .info_msg .msg_btn { border: 1px solid #fff; border-radius: 4px; box-sizing: border-box; color: #fff; display: inline-block; font-size: 16px; font-weight: 300; height: 50px; line-height: 50px; margin-top: 80px; padding: 0 38px; transition: .2s }
.main .main_intro .intro_cont .cont_info .info li .info_msg .msg_btn .el-icon-right { margin-left: 10px }
.main .main_intro .intro_cont .cont_info .info li .info_msg .msg_btn:hover { border: 1px solid #7e7eff; color: #7e7eff }
.main .main_intro .intro_cont .cont_info .info li:last-child { margin-bottom: 0 }
.main .main_intro .intro_cont .cont_info .info li.text { animation: big_text 2s }
.main .main_intro .intro_cont .cont_info .info li.text .info_icon { display: none }
.main .main_intro .intro_cont .cont_info .info li.text .info_msg h3 { font-size: 36px; margin-bottom: 20px }
.main .main_intro .intro_cont .cont_info .info li.text .info_msg p { font-size: 16px }
.main .main_intro .intro_cont .cont_move { position: relative }
.main .main_tabs { margin: 0 auto; max-width: 1400px; padding: 100px 0 }
.main .main_tabs .tabs_title { color: #303133; font-size: 40px; font-weight: 600; padding-bottom: 40px; text-align: center }
.main .main_tabs .tabs_subtitle { color: #606266; font-size: 20px; font-weight: 400; margin: 15px 0 70px; text-align: center }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav-scroll { display: flex; justify-content: center }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label { align-items: center; color: #333; display: flex; font-size: 16px; gap: 10px }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label:before { background: url(../images/index_group.png) no-repeat -155px 0; content: ""; display: inline-block; height: 24px; vertical-align: middle; width: 24px; display:none; }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label .img{width: 24px;}
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label .img img{width: 100%;}

.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label:hover { color: #1b60fe }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label2:before { background: url(../images/index/interface.png) no-repeat 50%; background-size: 115% }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label3:before { background-position: -103px 0 }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label4:before { background-position: -77px 0 }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .label5:before { background-position: -51px 0 }
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav .el-tabs__active-bar { background-color: #1b60fe }
.main .main_tabs .tabs .el-tabs__content { box-shadow: 0 5px 25px #3b568d1a; box-sizing: content-box; height: 360px; margin-top: 30px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont { box-sizing: border-box; display: flex; height: 360px; justify-content: space-between; padding: 30px 40px; width: 1360px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info>h3 { align-items: center; color: #191b34; display: flex; font-size: 20px; gap: 15px; padding-bottom: 40px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info>h3:before { background: url(../images/index_group.png) no-repeat -333px 0; content: ""; display: inline-block; height: 40px; vertical-align: middle; width: 40px; display:none }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info>h3 .img{width: 40px;}
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info>h3 .img img{width: 100%;}

.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .title2:before { background-position: -375px 0 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .title3:before { background-position: -207px 0 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .title4:before { background-position: -291px 0 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .title5:before { background-position: -249px 0 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .info_item { color: #4b5c76; font-size: 14px; max-width: 620px; padding-bottom: 20px; padding-left: 30px; position: relative }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .info_item:before { background-image: url(../images/index/tpm-introduce-icon.svg); background-size: cover; content: ""; height: 18px; left: 0; position: absolute; top: 2px; width: 18px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .info_item :first-child { font-size: 15px; font-weight: 600 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .tab-btn { align-items: center; display: flex; gap: 20px; padding-top: 40px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .tab-btn>a { background: #1b60fe; border-radius: 2px; box-sizing: border-box; color: #fff; display: inline-block; height: 36px; line-height: 36px; text-align: center; transition: .2s; width: 127px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .tab-btn>a:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40; color: #fff }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .tab-btn>:last-child { background: #fff; border: 1px solid #1b60fe; color: #1b60fe }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_img { border-radius: 9px; box-shadow: 0 5px 21px #4b5c761a }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_img>img { height: 100% }
.main .main_tabs .tabs .el-tabs__content .el-tab-pane { border-radius: 4px; display: block!important; left: 0; opacity: 0; pointer-events: none; position: absolute; top: 0; transform: translateY(25px); transition: opacity .3s ease-in-out, transform 0s ease-in-out .3s, max-height 0s ease-in-out .3s; z-index: 1 }
.main .main_tabs .tabs .el-tabs__content .is-active { max-height: 1000px; opacity: 1; pointer-events: auto; transform: translateY(0); transition: opacity .3s ease-in-out .3s, transform .3s ease-in-out .3s, max-height 0s ease-in-out .3s; z-index: 9 }
.main .main_support { box-sizing: border-box; margin: 0 auto; max-width: 1200px; padding: 0 20px 100px }
.main .main_support .support_logo img { display: block; margin: 0 auto }
.main .main_support h2 { color: #303133; font-size: 40px; font-weight: 600; line-height: 1.5em; margin: 40px auto 15px; text-align: center }
.main .main_support h2 br { display: none }
.main .main_support .support_tip { color: #606266; font-size: 20px; font-weight: 400; text-align: center }
.main .main_support .support_list { align-items: center; display: flex; justify-content: space-between; margin-top: 70px }
.main .main_support .support_list li { background: linear-gradient(180deg, #f9faff, #fff); border: 1px solid transparent; border-radius: 8px; box-shadow: 0 6px 33px #3b568d33; box-sizing: border-box; height: 428px; overflow: hidden; position: relative; transition: .5s; width: 244px }
.main .main_support .support_list li .support_tip_cover { box-sizing: border-box; height: 100%; left: 0; opacity: 1; padding: 30px 20px; position: absolute; top: 0; transition: .3s }
.main .main_support .support_list li .support_tip_cover>img { bottom: 0; position: absolute; right: 0; width: 135px }
.main .main_support .support_list li .support_tip_cnt { box-sizing: border-box; left: 0; opacity: 0; padding: 30px; position: absolute; top: 0; transition: .3s; width: 582px }
.main .main_support .support_list li .support_tip_cnt>p { min-height: 56px }
.main .main_support .support_list li .support_tip_cnt .look_solution { align-items: center; display: flex; justify-content: space-between }
.main .main_support .support_list li .support_tip_cnt .look_solution .example>dt { color: #181818; font-size: 22px; font-weight: 600 }
.main .main_support .support_list li .support_tip_cnt .look_solution .product_box>img { width: 167px }
.main .main_support .support_list li .support_tip_cnt .support_btn { align-items: center; display: flex; justify-content: space-between }
.main .main_support .support_list li .support_tip_cnt .support_btn .start_use { background: #1b60fe; border-radius: 4px; color: #fff; cursor: pointer; height: 39px; line-height: 39px; text-align: center; width: 247px }
.main .main_support .support_list li .support_tip_cnt .support_btn .start_use:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40; color: #fff }
.main .main_support .support_list li .support_tip_cnt .support_btn :last-child { background: #fff; border: 1px solid #1b60fe; color: #1b60fe }
.main .main_support .support_list li h3 { align-items: center; color: #181818; display: flex; font-size: 22px; font-weight: 600; margin-bottom: 20px }
.main .main_support .support_list li p { color: #4b5c76; font-size: 14px; font-weight: 400; line-height: 2; position: relative }
.main .main_support .support_list li .example { color: #606266; margin: 20px 0 30px }
.main .main_support .support_list li .example dt { font-size: 16px; font-weight: 400; margin-bottom: 20px }
.main .main_support .support_list li .example dd { align-items: center; color: #4b5c76; display: flex; font-size: 14px; font-weight: 400; gap: 5px; margin-bottom: 15px }
.main .main_support .support_list li .example dd i { color: #1b60fe; font-size: 18px; width: 25px }
.main .main_support .support_list li .list_btn { align-items: center; border: 1px solid #1b51cb; border-radius: 4px; color: #1b51cb; display: flex; font-size: 15px; font-weight: 400; height: 35px; justify-content: center; line-height: 35px; text-align: center; transition: all .25s }
.main .main_support .support_list li .list_btn .el-icon-right { font-size: 14px; font-weight: 700; margin-left: 10px }
.main .main_support .support_list li .list_btn:hover { background: #1b51cb; color: #fff }
.main .main_support .support_list li .list_more { align-items: center; display: flex; font-size: 15px; font-weight: 500; justify-content: center; margin: 24px auto 0; width: -moz-max-content; width: max-content }
.main .main_support .support_list li .list_more>p { color: #303133; cursor: pointer; transition: all .2s }
.main .main_support .support_list li .list_more .el-icon-right { font-size: 14px; font-weight: 700; margin-left: 10px }
.main .main_support .support_list li .list_more:hover .el-icon-right, .main .main_support .support_list li .list_more:hover p { color: #1b51cb }
.main .main_support .support_list .support_active { border-color: #1b60fe; width: 582px }
.main .main_support .support_list .support_active .support_tip_cover { opacity: 0 }
.main .main_support .support_list .support_active .support_tip_cnt { opacity: 1 }
.main .main_help { background: #f5f7fa }
.main .main_help .help_serve { margin: 0 auto; max-width: 1400px; padding: 60px 20px 0 }
.main .main_help .help_serve>h1 { color: #333; font-size: 40px; padding-bottom: 20px; text-align: center }
.main .main_help .help_serve>p { color: #3d485d; font-size: 18px; padding-bottom: 70px; text-align: center }
.main .main_help .help_serve .serve_wrapper { display: flex; justify-content: space-between; position: relative }
.main .main_help .help_serve .serve_wrapper>img { width: 68% }
.main .main_help .help_serve .serve_wrapper .lf_wp { padding: 10px 0 0 30px }
.main .main_help .help_serve .serve_wrapper .lf_wp .num_tl { color: #1b60fe; font-size: 30px; padding-bottom: 10px }
.main .main_help .help_serve .serve_wrapper .lf_wp .num_tl :last-child { color: #3d485d; font-size: 24px }
.main .main_help .help_serve .serve_wrapper .lf_wp .sub_title { color: #4b5c76; font-size: 14px; padding-bottom: 40px }
.main .main_help .help_serve .serve_wrapper .title_block { align-items: center; background: linear-gradient(180deg, #f5f7fa, #fcfdfd); border: 2px solid #fff; border-radius: 4px; bottom: 120px; box-shadow: 0 4px 25px #3b568d1a; box-sizing: border-box; display: flex; justify-content: space-between; padding: 15px 100px; position: absolute; width: 1400px }
.main .main_help .help_serve .serve_wrapper .title_block>li>a { align-items: center; display: flex; flex-direction: column; gap: 5px; transition: .3s }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .block_item { align-items: center; background-color: #fff; border: 1px solid #f1f1f1; border-radius: 50%; display: flex; height: 80px; justify-content: center; width: 80px }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .block_item:before { background: url(../images/index_group.png) no-repeat -626px 0; content: ""; display: inline-block; height: 40px; vertical-align: middle; width: 40px }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .item2:before { background-position: -584px 0 }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .item3:before { background-position: -544px 0 }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .item4:before { background-position: -500px 0 }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .item5:before { background: url(../images/index/vertool.png) no-repeat; background-size: 100% }
.main .main_help .help_serve .serve_wrapper .title_block>li>a .item6:before { background-position: -418px 0 }
.main .main_help .help_serve .serve_wrapper .title_block>li>a>p { color: #3d485d; font-size: 20px }
.main .main_help .help_serve .serve_wrapper .title_block>li>a:hover .block_item { background: linear-gradient(180deg, #f0f5fd, #fff); border-color: #fff; box-shadow: 0 2px 10px #3b568d26 }
.main .main_help .help_serve .serve_wrapper .title_block>li>a:hover>p { color: #1b60fe }
.main .main_help .help_map { align-items: center; display: flex; height: 510px; padding: 100px 0 50px }
.main .main_help .help_map .map_img { margin-right: 9% }
.main .main_help .help_map .map_img img { display: block; height: 100% }
.main .main_help .help_map .map_info { box-sizing: border-box; height: 100%; padding-top: 30px }
.main .main_help .help_map .map_info h2 { color: #303133; font-size: 40px; font-weight: 600 }
.main .main_help .help_map .map_info>p { color: #606266; font-size: 20px; font-weight: 400; margin: 15px 0 70px; width: 75% }
.main .main_help .help_map .map_info .map_list { display: flex }
.main .main_help .help_map .map_info .map_list li { margin-right: 40px }
.main .main_help .help_map .map_info .map_list li .list_title { align-items: center; display: flex; font-size: 23px; font-weight: 600; margin-bottom: 25px }
.main .main_help .help_map .map_info .map_list li .list_title:before { background: url(../images/index/icon_map1.svg) no-repeat; content: ""; display: block; height: 32px; margin-right: 6px; width: 49px }
.main .main_help .help_map .map_info .map_list li .list_tip { font-size: 16px; font-weight: 400; margin-left: 55px; max-width: 130px }
.main .main_help .help_map .map_info .map_list li:nth-child(2) .list_title:before { background-image: url(../images/index/icon_map2.svg) }
.main .main_help .help_map .map_info .map_list li:last-child { margin-right: 0 }
.main .main_help .help_map .map_info .map_list li:last-child .list_title:before { background-image: url(../images/index/icon_map3.svg) }
.main .main_help .help_map .map_info .map_btn { align-items: center; display: flex; font-size: 16px; margin-top: 70px }
.main .main_help .help_map .map_info .map_btn .btn { align-items: center; background: #1b51cb; border-radius: 4px; color: #fff; cursor: pointer; display: inline-flex; height: 50px; line-height: 50px; margin-right: 40px; padding: 0 38px; transition: all .25s }
.main .main_help .help_map .map_info .map_btn .btn .el-icon-right { margin-left: 10px }
.main .main_help .help_map .map_info .map_btn .btn:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .main_help .help_map .map_info .map_btn .link { align-items: center; color: #1b51cb; display: flex; transition: all .2s }
.main .main_help .help_map .map_info .map_btn .link .el-icon-right { margin-left: 10px }
.main .main_help .help_map .map_info .map_btn .link:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main .main_help .help_honor { margin: 0 auto; max-width: 1000px; text-align: center }
.main .main_help .help_honor .honor_star { margin-bottom: 20px }
.main .main_help .help_honor .honor_star img { display: block; height: 20px; margin: 0 auto; width: 118px }
.main .main_help .help_honor h2 { color: #303133; font-size: 40px; font-weight: 600 }
.main .main_help .help_honor .honor_tips { color: #606266; font-size: 20px; font-weight: 400; margin: 15px 0 50px }
.main .main_help .help_honor .honor_list { display: flex; justify-content: space-between }
.main .main_help .help_honor .honor_list li { border-radius: 8px; box-shadow: 0 4px 20px #1c0da226; box-sizing: border-box; padding: 30px 40px; transition: all .3s; width: 30% }
.main .main_help .help_honor .honor_list li .honor_img { height: 140px }
.main .main_help .help_honor .honor_list li .honor_img img { display: block; margin: 0 auto }
.main .main_help .help_honor .honor_list li h3 { font-size: 18px; margin: 20px 0 }
.main .main_help .help_honor .honor_list li p { color: #606266; font-size: 16px; font-weight: 300 }
.main .main_help .help_honor .honor_list li:hover { box-shadow: 0 8px 24px #1c0da280; transform: scale(1.1) }
.main .new_join { background: #272834; color: #fff; padding: 30px 0 }
.main .new_join .join_content { margin: 0 auto; max-width: 1400px; text-align: center }
.main .new_join .join_content .sub-port>h3 { font-size: 28px }
.main .new_join .join_content .sub-port>p { font-size: 18px; font-weight: lighter; padding: 25px 0 }
.main .new_join .join_content .sub-port>a { border: 1px solid #fff; border-radius: 6px; box-sizing: content-box; color: #fff; display: inline-block; height: 45px; line-height: 45px; text-align: center; transition: all .3s; width: 130px }
.main .new_join .join_content .sub-port>a:hover { border-color: #1b60fe; color: #1b60fe }
.main .main_join { background: #181b34; color: #fff; padding: 80px 20px 70px; position: relative; text-align: center }
.main .main_join img { left: 8%; position: absolute; top: 8%; width: 130px }
.main .main_join h3 { font-size: 28px }
.main .main_join p { font-size: 18px; font-weight: 300; margin: 20px 0 30px }
.main .main_join .join_btn { background: #1b51cb; border-radius: 4px; color: #fff; display: inline-block; font-size: 16px; height: 50px; line-height: 50px; padding: 0 38px; transition: all .25s }
.main .main_join .join_btn:hover { background: #1b51cb; box-shadow: 0 4px 15px #0b1faf40 }
.main_swiper { position: relative }
.main_swiper .swiper-pagination { text-align: center; width: 100% }
.main_swiper .swiper-pagination .swiper-pagination-bullet { background: #fff; border-radius: 100%; display: inline-block; height: 8px; margin: 0 4px; opacity: .5; width: 8px }
.main_swiper .swiper-pagination .swiper-pagination-bullet-active { opacity: 1 }
.main_swiper .swiper-button-next, .main_swiper .swiper-button-prev { align-items: center; color: #fff; cursor: pointer; display: flex; justify-content: center; position: absolute; top: 50%; z-index: 10 }
.main_swiper .swiper-button-next:after, .main_swiper .swiper-button-prev:after { font-size: 16px; letter-spacing: 0; line-height: 1; text-transform: none }
.main_swiper .swiper-button-prev { left: -10px; right: auto }
.main_swiper .swiper-button-next { left: auto; right: -10px }
.main_swiper_info .swiper-button-next, .main_swiper_info .swiper-button-prev { top: 50px }
.main_swiper_tip { position: relative }
.main_swiper_tip .swiper-button-next, .main_swiper_tip .swiper-button-prev { color: #333 }
.main_swiper_tip .swiper-button-prev { right: auto }
.main_swiper_tip .swiper-button-next { left: auto }
.main_swiper_tip .swiper .swiper-pagination { align-items: center; background: #e8e8e8; display: flex; height: auto; justify-content: center; left: 50%; margin: 0 auto; text-align: center; transform: translate(-50%); width: 60px }
.main_swiper_tip .swiper .swiper-pagination .swiper-pagination-bullet { background: #1b51cb; border-radius: 2px; display: inline-block; height: 4px; margin: 0; opacity: 0; transition: .1s; width: 20px }
.main_swiper_tip .swiper .swiper-pagination .swiper-pagination-bullet-active { background: #1b51cb; opacity: 1 }
.support_tip_swier { box-shadow: 0 8px 24px #1d8cf229; box-sizing: border-box; margin: 20px; padding: 30px 25px; transition: .2s }
.support_tip_swier h3 { align-items: center; color: #555; display: flex; font-size: 18px; font-weight: 600; margin-bottom: 30px }
.support_tip_swier h3:before { background: url(../images/index/icon_circle1.svg) no-repeat; background-size: 100%; content: ""; display: block; height: 13px; margin-right: 8px; width: 18px }
.support_tip_swier p { color: #606266; font-size: 14px; font-weight: 400; line-height: 1.5em; min-height: 100px; position: relative }
.support_tip_swier p:after { background: linear-gradient(90deg, #1b51cb, #6161ff00); background-size: 100%; bottom: 0; content: ""; display: block; height: 2px; left: 0; position: absolute; width: 100% }
.support_tip_swier .example { color: #606266; padding-top: 30px }
.support_tip_swier .example dt { font-size: 16px; font-weight: 400; margin-bottom: 20px }
.support_tip_swier .example dd { align-items: center; display: flex; font-size: 14px; font-weight: 400; margin: 0 0 5px }
.support_tip_swier .example dd i { color: #1b51cb; font-size: 18px; width: 25px }
.support_tip_swier .list_btn { align-items: center; border: 1px solid #1b51cb; border-radius: 4px; color: #1b51cb; display: flex; font-size: 15px; font-weight: 400; height: 35px; justify-content: center; line-height: 35px; text-align: center; transition: all .25s }
.support_tip_swier2 h3:before { background-image: url(../images/index/icon_circle2.svg) }
.support_tip_swier2 p:after { background: linear-gradient(90deg, #00d2d2, #00d2d200) }
.support_tip_swier2 .example dd i { color: #00d2d2 }
.support_tip_swier2 .list_btn { border: 1px solid #00d2d2; color: #00d2d2 }
.support_tip_swier3 h3:before { background-image: url(../images/index/icon_circle3.svg) }
.support_tip_swier3 p:after { background: linear-gradient(90deg, #00c875, #00c87500) }
.support_tip_swier3 .example dd i { color: #00c875 }
.support_tip_swier3 .list_btn { border: 1px solid #00c875; color: #00c875 }
.swiper_intro_info { color: #fff; margin: 0 5px; overflow: hidden; padding: 0 30px; position: relative }
.swiper_intro_info h3 { align-items: center; display: flex; font-size: 20px; justify-content: left; margin-bottom: 10px }
.swiper_intro_info h3 .info_icon { align-items: center; background: #fff; border-radius: 50%; box-shadow: 0 2px 25px #6dffff80; display: flex; flex-shrink: 0; height: 30px; justify-content: center; margin-right: 10px; width: 30px }
.swiper_intro_info h3 .info_icon img { display: block; height: 15px; width: 15px }
.swiper_intro_info p { font-size: 16px; line-height: 1.7em; margin-bottom: 30px }
.swiper_intro_info a { background: #1b51cb; border: 1px solid #1b51cb; border-radius: 33px; color: #fff; display: block; font-size: 16px; font-style: normal; font-weight: 500; line-height: 14px; padding: 10px 0; text-align: center; text-transform: none; width: 126px }
.swiper_intro_info .info_img { padding-top: 40px; position: relative; width: 100%; z-index: 9 }
.swiper_intro_info .info_img img { width: 100% }
.swiper_intro_info .move_box { height: auto; width: 100%; z-index: 1 }
.swiper_intro_info .move_box .move1_rotate { height: 120px; top: -200px; width: 120px }
.swiper_intro_info .move_box .move1_rotate .logo_outside, .swiper_intro_info .move_box .move1_rotate .logo_outside .circle img, .swiper_intro_info .move_box .move1_rotate .logo_side .circle img, .swiper_intro_info .move_box .move1_rotate .starlist { height: 120px; width: 120px }
.move_box { height: 410px; position: sticky; top: calc(50% - 150px); width: 715px }
.move_box .move1_rotate { opacity: 0; position: absolute; right: -20px; top: -45px }
.move_box .move1_rotate .logo_outside { animation: move1_circle 15s linear infinite; height: 350px; position: relative; width: 350px }
.move_box .move1_rotate .logo_outside .circle img { display: block; height: 350px; width: 350px }
.move_box .move1_rotate .logo_outside .icon1 { animation: move1_logo 15s linear infinite; left: 0; position: absolute; top: 45px }
.move_box .move1_rotate .logo_outside .icon1 img { display: block; height: 69px; width: 63px }
.move_box .move1_rotate .logo_outside .icon2 { animation: move1_logo 15s linear infinite; left: 90px; position: absolute; top: -65px }
.move_box .move1_rotate .logo_outside .icon2 img { display: block; height: 50px; width: 48px }
.move_box .move1_rotate .logo_outside .icon3 { animation: move1_logo 15s linear infinite; bottom: 0; position: absolute; right: 0 }
.move_box .move1_rotate .logo_outside .icon3 img { display: block; height: 50px; width: 46px }
.move_box .move1_rotate .logo_outside .icon4 { animation: move1_logo 15s linear infinite; bottom: 45px; left: -45px; position: absolute }
.move_box .move1_rotate .logo_outside .icon4 img { display: block; height: 58px; width: 52px }
.move_box .move1_rotate .logo_outside .icon5 { animation: move1_logo 15s linear infinite; position: absolute; right: -50px; top: 40px }
.move_box .move1_rotate .logo_outside .icon5 img { display: block; height: 71px; width: 66px }
.move_box .move1_rotate .logo_outside .icon6 { animation: move1_logo 15s linear infinite; bottom: -80px; position: absolute; right: 145px }
.move_box .move1_rotate .logo_outside .icon6 img { display: block; height: 51px; width: 47px }
.move_box .move1_rotate .logo_side { animation: move1_incircle 10s linear infinite; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move1_rotate .logo_side .circle img { display: block; height: 380px; width: 380px }
.move_box .move1_rotate .logo_side .icon7 { animation: move1_logo 10s linear infinite; left: 30px; position: absolute; top: 170px }
.move_box .move1_rotate .logo_side .icon7 img { display: block; height: 69px; width: 63px }
.move_box .move1_rotate .logo_inside { animation: move1_incircle 6s linear infinite; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move1_rotate .logo_inside .circle img { display: block; height: 200px; width: 200px }
.move_box .move1_rotate .logo_inside .icon8 { animation: move1_logo 6s linear infinite; left: 5px; position: absolute; top: 0 }
.move_box .move1_rotate .logo_inside .icon8 img { display: block; height: 63px; width: 59px }
.move_box .move1_rotate .logo_inside .icon9 { animation: move1_logo 6s linear infinite; position: absolute; right: -30px; top: 40px }
.move_box .move1_rotate .logo_inside .icon9 img { display: block; height: 84px; width: 77px }
.move_box .move1_rotate .logo_inside .icon10 { animation: move1_logo 6s linear infinite; bottom: -25px; left: 50px; position: absolute }
.move_box .move1_rotate .logo_inside .icon10 img { display: block; height: 69px; width: 64px }
.move_box .move1_rotate .starlist { height: 350px; left: 0; position: absolute; top: 0; width: 350px }
.move_box .move1_rotate .starlist li { height: 20px; position: absolute; width: 20px }
.move_box .move1_rotate .starlist li:first-child { animation: starzoom 4s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 0; top: 0 }
.move_box .move1_rotate .starlist li:nth-child(2) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -20px 0; left: 10px; top: 40px }
.move_box .move1_rotate .starlist li:nth-child(3) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -40px 0; left: 30px; top: 20px }
.move_box .move1_rotate .starlist li:nth-child(4) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -60px 0; left: 50px; top: -10px }
.move_box .move1_rotate .starlist li:nth-child(5) { animation: starzoom 4s 3s infinite; background: url(../images/index/icon_star.svg) no-repeat -80px 0; left: -30px; top: 50px }
.move_box .move1_rotate .starlist li:nth-child(6) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -100px 0; left: 10px; top: 80px }
.move_box .move1_rotate .starlist li:nth-child(7) { animation: starzoom 4s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 70px; top: 50px }
.move_box .move1_rotate .starlist li:nth-child(8) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -40px 0; left: 75px; top: 90px }
.move_box .move1_rotate .starlist li:nth-child(9) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -60px 0; left: -10px; top: -20px }
.move_box .move1_rotate .starlist li:nth-child(10) { animation: starzoom 4s 3s infinite; background: url(../images/index/icon_star.svg) no-repeat -80px 0; left: 150px; top: 50px }
.move_box .move1_rotate .starlist li:nth-child(11) { animation: starzoom 4s infinite; background: url(../images/index/icon_star.svg) no-repeat -100px 0; left: 205px; top: 65px }
.move_box .move1_rotate .starlist li:nth-child(12) { animation: starzoom 4s 3s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 120px; top: 15px }
.move_box .move1_rotate .starlist li:nth-child(13) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -40px 0; left: 138px; top: 68px }
.move_box .move1_rotate .starlist li:nth-child(14) { animation: starzoom 4s 4s infinite; background: url(../images/index/icon_star.svg) no-repeat -60px 0; left: 270px; top: 120px }
.move_box .move1_rotate .starlist li:nth-child(15) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -80px 0; left: 140px; top: -30px }
.move_box .move1_rotate .starlist li:nth-child(16) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -100px 0; left: 258px; top: 275px }
.move_box .move1_rotate .starlist li:nth-child(17) { animation: starzoom 4s .5s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 286px; top: 194px }
.move_box .move1_rotate .starlist li:nth-child(18) { animation: starzoom 4s infinite; background: url(../images/index/icon_star.svg) no-repeat -40px 0; left: 290px; top: 90px }
.move_box .move1_rotate .starlist li:nth-child(19) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -60px 0; left: 260px; top: 40px }
.move_box .move1_rotate .starlist li:nth-child(20) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -80px 0; left: 238px; top: 24px }
.move_box .move1_rotate .starlist li:nth-child(21) { animation: starzoom 4s 2s infinite; background: url(../images/index/icon_star.svg) no-repeat -100px 0; left: 245px; top: 180px }
.move_box .move1_rotate .starlist li:nth-child(22) { animation: starzoom 4s 3s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 310px; top: 150px }
.move_box .move1_rotate .starlist li:nth-child(23) { animation: starzoom 4s 1s infinite; background: url(../images/index/icon_star.svg) no-repeat -40px 0; left: 314px; top: 52px }
.move_box .move1_rotate .starlist li:nth-child(24) { animation: starzoom 4s 3s infinite; background: url(../images/index/icon_star.svg) no-repeat -60px 0; left: 253px; top: 250px }
.move_box .move1_rotate .starlist li:nth-child(25) { animation: starzoom 4s infinite; background: url(../images/index/icon_star.svg) no-repeat 0 0; left: 300px; top: 230px }
.move_box .move1_rotate.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move1_rotate.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move1_bg { left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move1_bg img { display: block; height: 394px; width: 629px }
.move_box .move1_bg.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move1_bg.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move1_icon { left: 215px; opacity: 0; position: absolute; top: 220px }
.move_box .move1_icon img { display: block; height: 18px; width: 18px }
.move_box .move1_icon.move { animation: move1_icon 1s }
.move_box .move2_bg { left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move2_bg img { display: block; height: 221px; width: 711px }
.move_box .move2_bg.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move2_bg.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move2_icon { left: 74px; opacity: 0; position: absolute; top: 226px }
.move_box .move2_icon img { display: block; height: 18px; width: 18px }
.move_box .move2_icon.move { animation: move2_icon 1s }
.move_box .move3_bg { left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move3_bg img { display: block; height: 394px; width: 623px }
.move_box .move3_bg.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move3_bg.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move3_email { left: 127px; opacity: 0; position: absolute; top: 144px }
.move_box .move3_email img { display: block; height: 174px; width: 460px }
.move_box .move3_email.move { animation: move3_email 1s }
.move_box .move4_help { margin-left: 150px; opacity: 0 }
.move_box .move4_help img { display: block; height: 85px; width: 246px }
.move_box .move4_help.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move4_help.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move4_arrow { left: 243px; opacity: 0; position: absolute; top: 85px }
.move_box .move4_arrow img { display: block; height: 120px; width: 225px }
.move_box .move4_arrow.move4_opacity2 { animation: move4_opacity2 1.5s; opacity: 1 }
.move_box .move4_arrow.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move4_date { margin: 20px 70px 0 150px; opacity: 0; text-align: right }
.move_box .move4_date img { display: inline-block; height: 85px; width: 246px }
.move_box .move4_date.move4_opacity3 { animation: move4_opacity3 2s; opacity: 1 }
.move_box .move4_date.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move4_arrow2 { opacity: 0; position: absolute; right: 110px; top: 195px }
.move_box .move4_arrow2 img { display: block; height: 132px; width: 118px }
.move_box .move4_arrow2.move4_opacity4 { animation: move4_opacity4 2.5s; opacity: 1 }
.move_box .move4_arrow2.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move4_trigger { margin: 80px 0 0 235px; opacity: 0 }
.move_box .move4_trigger img { display: block; height: 85px; width: 246px }
.move_box .move4_trigger.move4_opacity5 { animation: move4_opacity5 3s; opacity: 1 }
.move_box .move4_trigger.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move4_week { margin: -10px 0 0 150px; opacity: 0 }
.move_box .move4_week img { display: block; height: 52px; width: 415px }
.move_box .move4_week.move4_opacity6 { animation: move4_opacity6 3.5s; opacity: 1 }
.move_box .move4_week.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move5_bg { left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%) }
.move_box .move5_bg img { border-radius: 7px; box-shadow: 0 3px 33px #005dc8; display: block; height: 292px; width: 520px }
.move_box .move5_bg.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move5_bg.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move5_text { color: #333; font-size: 12px; left: 34%; opacity: 0; position: absolute; top: 51.5%; transform: scale(.7) }
.move_box .move5_text.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move5_text.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move5_arrow { left: 64%; opacity: 0; position: absolute; top: 54% }
.move_box .move5_arrow img { display: block; height: 6px; width: 6px }
.move_box .move5_arrow.move5_cursor { animation: move5_cursor 1s; opacity: 1 }
.move_box .move5_arrow.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move5_bg2 { left: 50%; opacity: 0; position: absolute; top: 51.5%; transform: translate(-50%, -50%) }
.move_box .move5_bg2 img { display: block; height: 394px; width: 622px }
.move_box .move5_bg2.move5_opacity2 { animation: move4_opacity2 1.5s; opacity: 1 }
.move_box .move5_bg2.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move5_pop { left: 73%; opacity: 0; position: absolute; top: 37%; transform: translate(-50%, -50%) }
.move_box .move5_pop img { display: block; height: 160px; width: 126px }
.move_box .move5_pop.move5_opacity3 { animation: move4_opacity3 2s; opacity: 1 }
.move_box .move5_pop.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move6_bg { left: 50%; opacity: 0; position: absolute; top: 51.5%; transform: translate(-50%, -50%) }
.move_box .move6_bg img { display: block; height: 394px; width: 622px }
.move_box .move6_bg.opacity1 { animation: opacity1 1s; opacity: 1 }
.move_box .move6_bg.opacity0 { animation: opacity0 .5s; opacity: 0 }
.move_box .move6_pop { left: 73%; opacity: 0; position: absolute; top: 37%; transform: translate(-50%, -50%) }
.move_box .move6_pop img { display: block; height: 160px; width: 126px }
.move_box .move6_pop.move6_opacity2 { animation: move4_opacity2 1.5s; opacity: 1 }
.move_box .move6_pop.opacity0 { animation: opacity0 .5s; opacity: 0 }
@media screen and (max-width:1600px) {
.main .main_banner .banner { max-width: 1200px; padding-bottom: 100px; padding-top: 80px }
.main .main_banner .banner .banner_info { padding-top: 50px }
.main .main_banner .banner .banner_info .info_top>h1 { font-size: 60px }
.main .main_banner .banner .banner_info .info_top .subtitle { font-size: 20px }
.main .main_banner .banner .banner_info .info_bottom { margin-top: 50px }
.main .main_help .help_serve { max-width: 1300px }
.main .main_help .help_serve .serve_wrapper .lf_wp .sub_title { padding-bottom: 20px }
.main .main_help .help_serve .serve_wrapper .title_block { bottom: 112px; max-width: 1300px }
.main .new_join .join_content { max-width: 1200px }
.main .main_tabs { max-width: 1260px }
.main .main_tabs .tabs .el-tabs__content .tabs_cont { width: 1260px }
.main .market_segment .market_platform { height: 720px; max-width: 1250px }
.main .market_segment .market_platform .platform-interaction .image-mode>h3 { font-size: 16px }
.main .market_segment .market_platform .postion4 { top: 220px }
.main .market_segment .market_platform .postion4 .ripple-container { width: 240px }
.main .market_segment .market_platform .postion4 .sendMass { height: 210px; width: 240px }
.main .market_segment .market_platform .postion4 .sendMass>p { height: 26px; width: 80px }
.main .market_segment .market_platform .postion4 .sendMass>img { width: 60px }
.main .main_market_new .market .market_item .market_title .img_tox h2 { font-size: 18px }
.main .main_market_new .market .market_item .mask { padding: 15px }
.main .main_market_new .market .market_item .mask>p { margin-bottom: 10px }
.main .main_market_new .market .market_item .mask .market-title h4 { font-size: 12px }
.main .main_market_new .market .market_item .mask .introduction { padding: 10px }
.main .main_market_new .market .market_item .mask .introduction .introduction_item { font-size: 12px }
.main .main_market_new .market .market_item .mask .link_btn { font-size: 12px; height: 25px; line-height: 25px; width: 80px }
}
@media screen and (max-width:1200px) {
.main .main_banner .banner { display: block; padding-top: 20px }
.main .main_banner .banner .banner_info { align-items: center; width: 100%; z-index: 2 }
.main .main_banner .banner .banner_info .info_top { text-align: center }
.main .main_banner .banner .banner_info .info_top h1 { font-size: 40px }
.main .main_banner .banner .banner_info .info_top .subtitle { font-size: 18px; width: 100% }
.main .main_banner .banner .banner_info .info_bottom { margin-top: 30px; text-align: center }
.main .main_banner .banner .banner_info .emailzoom { display: none }
.main .main_banner .banner .banner_collapse { margin-top: 50px; width: 100% }
.main .main_banner .banner_bottom img { transform: translate(-57px); width: 177% }
.main .main_market .market { overflow: hidden }
.main .main_market .market .market_company { margin: 0 }
.main .main_market .market .market_company .company_list li { margin: 12px 0; text-align: center; width: 33.33% }
.main .main_market .market .market_company .company_list li img { display: inline-block }
.main .main_market .market .market_company .company_list li .img1 { width: 60% }
.main .main_market .market .market_company .company_list li .img2, .main .main_market .market .market_company .company_list li .img3 { width: 50% }
.main .main_market .market .market_company .company_list li .img4 { width: 77% }
.main .main_market .market .market_company .company_list li .img5 { width: 55% }
.main .main_market .market .market_company .company_list li .img6 { width: 45% }
.main .main_market .market .market_join { display: block; margin: 80px 0; text-align: center }
.main .main_market .market .market_join .join_title { font-size: 26px; width: 100% }
.main .main_market .market .market_join .join_info { width: 100% }
.main .main_market .market .market_join .join_info p { font-size: 16px; margin-top: 20px }
.main .main_market .market .market_custom .custom_email { display: none }
.main .main_market .market .market_custom .custom_help .help_phone { margin: 0 30px; width: 30% }
.main .main_market .market .market_custom .custom_help .help_phone img { width: 100% }
.main .main_market .market .market_custom .custom_help .help_num { margin: 0; width: 60% }
.main .main_market .market .market_custom .custom_help .help_num .help_time { width: 80% }
.main .main_market .market .market_custom .custom_help .help_num .help_custom, .main .main_market .market .market_custom .custom_help .help_num .help_custom img, .main .main_market .market .market_custom .custom_help .help_num .help_time img { width: 100% }
.main .main_intro { padding: 70px 20px }
.main .main_intro .swiper { padding-bottom: 30px }
.main .main_intro .intro_cont { flex-direction: column }
.main .main_intro .intro_cont .cont_info { max-width: none }
.main .main_intro .intro_cont .cont_info .info li { flex-direction: column; margin-bottom: 100px; text-align: center }
.main .main_intro .intro_cont .cont_info .info li .info_icon { margin: 0 0 20px }
.main .main_intro .intro_cont .cont_info .info li .info_msg .msg_btn { margin-top: 20px }
.main .main_intro .intro_cont .cont_info .info li.text .info_msg h3 { font-size: 30px }
.main .main_intro .intro_cont .cont_move { display: none }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info h3 { margin: 20px 0 }
.main .main_help .help_map { flex-direction: column-reverse; height: auto; padding: 0 0 50px }
.main .main_help .help_map .map_img { margin: 50px 0 0 }
.main .main_help .help_map .map_img img { margin: 0 auto; width: 90% }
.main .main_help .help_map .map_info h2 { text-align: center }
.main .main_help .help_map .map_info>p { margin: 30px 0 40px; text-align: center; width: 100% }
.main .main_help .help_map .map_info .map_btn, .main .main_help .help_map .map_info .map_list { justify-content: center }
.main .main_market_new .market .market_item { margin-bottom: 20px; width: 48% }
.main .main_market_new .market .market_item .market_title .img_tox h2 { font-size: 20px }
.main .main_market_new .market .market_item .mask { padding: 30px }
.main .main_market_new .market .market_item .mask>p { font-size: 20px; margin-bottom: 20px }
.main .main_market_new .market .market_item .mask .market-title h4 { font-size: 18px }
.main .main_market_new .market .market_item .mask .introduction { gap: 25px; padding: 30px 15px }
.main .main_market_new .market .market_item .mask .introduction .introduction_item { font-size: 18px }
.main .main_market_new .market .market_item .mask .link_btn { font-size: 20px; height: 40px; line-height: 40px; width: 150px }
}
@media screen and (max-width:800px) {
.main .main_tabs { padding: 100px 20px 70px }
.main .main_tabs .tabs_title { font-size: 26px; text-align: center }
.main .main_tabs .tabs_subtitle { font-size: 18px; margin: 15px 0 30px }
.main .main_tabs .tabs .el-tabs__content { padding: 50px 0 }
.main .main_tabs .tabs .el-tabs__content .tabs_cont { flex-direction: column-reverse }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_img { margin: 0 auto; width: 95% }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info { margin-bottom: 50px; text-align: center; width: 100% }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info h3 { justify-content: center }
.main .main_tabs .tabs .el-tabs__content .tabs_cont .cont_info .info_item{ text-align:left;}
.main .main_support { padding: 0 20px 30px }
.main .main_support h2 { font-size: 30px; width: 100% }
.main .main_support .support_list { display: block }
.main .main_support .support_list li { margin-bottom: 30px; width: 100% }
.main .main_help { padding: 60px 20px }
.main .main_help .help_honor h2 { font-size: 26px }
.main .main_help .help_honor .honor_list { flex-direction: column }
.main .main_help .help_honor .honor_list li { margin-bottom: 30px; width: 100% }
.main .main_help .help_honor .honor_list li h3 { min-height: auto }
.main .main_help .help_honor .honor_list li:hover { transform: scale(1) }
}
@media screen and (max-width:600px) {
#leaves { height: 115% }
.Group_fireworks3 { display: none }
/*.main { margin-top: 52px!important }*/
.main .main_banner { overflow: hidden }
.main .main_banner .banner { padding: 50px 20px }
.main .main_banner .banner .banner_info { padding-top: 0 }
.main .main_banner .banner .banner_info .info_top h1 { font-size: 35px; line-height: 1.7em; margin: 0 auto 20px; max-width: 300px }
.main .main_banner .banner .banner_info .info_top h1 span { font-size: 35px }
.main .main_banner .banner .banner_info .info_top h1 span:after { bottom: -5px; height: 20px }
.main .main_banner .banner .banner_info .info_top h1 br { display: none }
.main .main_banner .banner .banner_info .info_top .subtitle { font-size: 16px }
.main .main_banner .banner .banner_info .info_top .subtitle br { display: block }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn a { border-radius: 4px; color: #fff; display: inline-block; font-size: 16px; height: 50px; line-height: 50px; padding: 0 30px }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn a i { animation: arrowInsideMove 1.5s linear infinite }
.main .main_banner .banner .banner_info .info_bottom .bottom_btn .link_chat { font-size: 16px; height: 50px; line-height: 50px; margin-left: 26px; padding: 0 30px }
.main .main_banner .banner .banner_right>img { display: none }
.main .main_market .market { display: flex; flex-direction: column-reverse; margin-bottom: 0; padding: 50px 0 }
.main .main_market .market .market_custom .custom_help .help_phone { margin: 0 0 0 20px; width: 35% }
.main .main_market .market .market_custom .custom_help .help_num { width: 70% }
.main .main_market .market .market_join { margin: 0 }
.main .main_market .market .market_join .join_title { margin-bottom: 0; padding: 30px 0 20px }
.main .main_market .market .market_join .join_info { margin-bottom: 0 }
.main .main_market .market .market_join .join_info p { margin: 0 }
.main .main_market_new .market .market_item { border: none; box-shadow: 0 2px 5px #4b5c761f; width: 100% }
.main .main_market_new .market .market_item .mask { padding: 30px 20px }
.main .main_market_new .market .market_item .mask>p { font-size: 14px; margin-bottom: 15px }
.main .main_market_new .market .market_item .mask .market-title h3, .main .main_market_new .market .market_item .mask .market-title h4 { font-size: 16px }
.main .main_market_new .market .market_item .mask .introduction { gap: 15px; padding: 20px 10px }
.main .main_market_new .market .market_item .mask .introduction .introduction_item { font-size: 14px }
.main .main_market_new .market .market_item .mask .link_btn { font-size: 14px; height: 35px; line-height: 35px; width: 100px }
.main .main_market_new .market .market_item .verify-email:before { background-position: -210px 0 }
.main .main_market_new .market .market_item .market-email:before { background-position: -278px 0 }
.main .main_market_new .market .market_item .preheat-email:before { background-position: -312px 0 }
.main .main_market_new .market .market_item .crm-email:before { background-position: -244px 0 }
.main .main_market_new .market h1 { font-size: 26px; padding: 40px 0 30px }
.main .main_market_new .market .market_wap { padding-bottom: 30px }
.main .main_market_new .market .carousel_indicator { background: #e8e8e8; border-radius: 10px; height: 4px; margin: 30px auto; position: relative; width: 120px }
.main .main_market_new .market .carousel_indicator>span { background: #1b51cb; border-radius: 10px; display: block; height: 4px; left: 0; position: absolute; top: 50%; transform: translateY(-50%); transition: .5s; width: 20% }
.main .main_market_new .market .swiper-slide { align-items: center; display: flex; justify-content: center; position: relative; transform: scale(.8); transition: .3s; z-index: 1 }
.main .main_market_new .market .swiper-slide-active { transform: scale(1); z-index: 9 }
.main .main_join h3 { font-size: 26px }
.main .main_join p { font-size: 16px; margin: 15px 0 30px }
.main .main_support { padding: 0 20px 30px }
.main .main_support h2 { font-size: 26px; margin: 0 auto 15px }
.main .main_support h2 br { display: block }
.main .main_support .support_tip { font-size: 16px }
.main .main_tabs { padding: 60px 20px 20px }
.main .main_tabs .tabs_subtitle { font-size: 14px }
.main .main_help { padding: 0 20px }
.main .main_help .help_map .map_info h2 { font-size: 26px; margin-bottom: 15px }
.main .main_help .help_map .map_info>p { font-size: 16px; margin-top: 0 }
.main .main_help .help_map .map_info .map_list { justify-content: space-between }
.main .main_help .help_map .map_info .map_list li { margin: 0 0 15px }
.main .main_help .help_map .map_info .map_list li .list_title { font-size: 15px; margin-bottom: 15px }
.main .main_help .help_map .map_info .map_list li .list_title:before { background-size: 100% 100%; height: 23px; width: 35px }
.main .main_help .help_map .map_info .map_list li .list_tip { font-size: 13px; margin-left: 0; max-width: none }
.main .main_help .help_map .map_info .map_btn { flex-direction: column; margin-top: 50px }
.main .main_help .help_map .map_info .map_btn .btn { margin: 0 0 20px }
.move_box .move1_rotate .logo_outside .icon1 { left: 0; top: 25px }
.move_box .move1_rotate .logo_outside .icon1 img { height: 39px; width: 33px }
.move_box .move1_rotate .logo_outside .icon2 { left: 70px; top: -45px }
.move_box .move1_rotate .logo_outside .icon2 img { height: 20px; width: 18px }
.move_box .move1_rotate .logo_outside .icon3 { bottom: 0; right: 0 }
.move_box .move1_rotate .logo_outside .icon3 img { height: 20px; width: 16px }
.move_box .move1_rotate .logo_outside .icon4 { bottom: 25px; left: -25px }
.move_box .move1_rotate .logo_outside .icon4 img { height: 28px; width: 22px }
.move_box .move1_rotate .logo_outside .icon5 { right: -30px; top: 20px }
.move_box .move1_rotate .logo_outside .icon5 img { height: 41px; width: 36px }
.move_box .move1_rotate .logo_outside .icon6 { bottom: -60px; right: 125px }
.move_box .move1_rotate .logo_outside .icon6 img { height: 21px; width: 17px }
.move_box .move1_rotate .logo_side .icon7 { left: 10px; top: 150px }
.move_box .move1_rotate .logo_side .icon7 img { height: 39px; width: 33px }
.move_box .move1_rotate .logo_inside .icon8 { left: 5px; top: 0 }
.move_box .move1_rotate .logo_inside .icon8 img { height: 33px; width: 29px }
.move_box .move1_rotate .logo_inside .icon9 { right: -10px; top: 20px }
.move_box .move1_rotate .logo_inside .icon9 img { height: 44px; width: 47px }
.move_box .move1_rotate .logo_inside .icon10 { bottom: -5px; left: 30px }
.move_box .move1_rotate .logo_inside .icon10 img { height: 39px; width: 34px }
}
@media screen and (min-width:700px) {
.main .main_market_new .market .market_item:hover { background: none; border-color: transparent; box-shadow: none }
.main .main_market_new .market .market_item:hover .mask { opacity: 1 }
}
@keyframes big_text { 0% {
transform:scale(.8)
}
to { transform: scale(1) }
}
@keyframes opacity0 { 0% {
opacity:1
}
to { opacity: 0 }
}
@keyframes opacity1 { 0% {
opacity:0
}
to { opacity: 1 }
}
@keyframes starzoom { 0% {
transform:scale(1)
}
25% {
transform:scale(0)
}
50% {
transform:scale(1)
}
to { transform: scale(1) }
}
@keyframes move1_logo { 0% {
transform:rotate(0)
}
to { transform: rotate(-1turn) }
}
@keyframes move1_circle { 0% {
transform:rotate(0)
}
to { transform: rotate(1turn) }
}
@keyframes move1_incircle { 0% {
transform:translate(-50%, -50%) rotate(0)
}
to { transform: translate(-50%, -50%) rotate(1turn) }
}
@keyframes move1_icon { 0% {
left:215px;
opacity:1;
top:220px
}
90% {
opacity:1
}
to { left: 74px; opacity: 0; top: 226px }
}
@keyframes move2_icon { 0% {
left:74px;
opacity:1;
top:226px
}
90% {
opacity:1
}
to { left: 131px; opacity: 0; top: 92px }
}
@keyframes move3_email { 0% {
left:127px;
opacity:1;
top:144px
}
to { left: 40px; opacity: 0; top: -30px; transform: scale(.5) }
}
@keyframes move4_opacity2 { 0% {
opacity:0
}
66% {
opacity:0
}
to { opacity: 1 }
}
@keyframes move4_opacity3 { 0% {
opacity:0
}
75% {
opacity:0
}
to { opacity: 1 }
}
@keyframes move4_opacity4 { 0% {
opacity:0
}
80% {
opacity:0
}
to { opacity: 1 }
}
@keyframes move4_opacity5 { 0% {
opacity:0
}
83% {
opacity:0
}
to { opacity: 1 }
}
@keyframes move4_opacity6 { 0% {
opacity:0
}
85% {
opacity:0
}
to { opacity: 1 }
}
@keyframes move5_cursor { 0% {
left:73%;
top:67%
}
to { left: 64%; top: 54% }
}
@keyframes arrowInsideMove { 0% {
opacity:0;
transform:translate(0)
}
20% {
opacity:1;
transform:translate(3px)
}
80% {
opacity:1;
transform:translate(13px)
}
to { opacity: 0; transform: translate(15px) }
}
@keyframes ripple_animation { 0% {
opacity:0;
transform:scale(1.1)
}
5% {
opacity:1;
transform:scale(1.1)
}
35% {
opacity:.4
}
50% {
opacity:0;
transform:scale(1.4)
}
to { opacity: 0; transform: scale(1.4) }
}
h1, h2, h3, h4, h5, h6 { font-weight: 700 }
.el-tabs__nav-wrap:after { display: none }


@media only screen and (max-width: 980px) {
	.main .main_tabs .tabs .el-tabs__content{}
.main .main_tabs .tabs .el-tabs__header .el-tabs__nav-scroll{    overflow-x: scroll;}
.main .main_tabs .tabs .el-tabs__content .tabs_cont{width:100%;flex-wrap: wrap;margin:0;padding:0;height: 500px;overflow-y: scroll;}
.main .main_tabs .tabs .el-tabs__content .is-active{max-height:inherit;width: 100%;box-sizing: border-box;}
.main .main_support .support_list .support_active{ width:100%;overflow-y:scroll;}
.main .main_support .support_list li{        overflow-y: scroll;}
.main .main_support .support_list li .support_tip_cover>img{position:inherit;top:inherit;left:inherit;right:inherit;bottom: inherit;display: none;}
.main .main_support .support_list .support_active .support_tip_cnt{ width:100%;opacity: 1;}
.main .main_support .support_list li .support_tip_cnt .look_solution{flex-wrap: wrap;opacity: 1;}
.main .main_support .support_list li .support_tip_cnt{width:100%;opacity: 1;}
.main .main_support .support_list li .support_tip_cover{position:inherit;display: none;}
}