*, *::before, *::after {
    box-sizing:border-box
}

html {
    font-family:sans-serif;
    line-height:1.15;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    -ms-overflow-style:scrollbar;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0)
}

@-ms-viewport {
    width:device-width
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
    display:block
}

body {
    margin:0;
    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size:1rem;
    font-weight:400;
    line-height:1.5;
    color:#fff;
    text-align:left;
    background-color:#1A1A29
}

hr {
    box-sizing:content-box;
    height:0;
    overflow:visible
}

h1, h2, h3, h4, h5, h6 {
    margin-top:0;
    margin-bottom:.5rem
}

p {
    margin-top:0;
    margin-bottom:1rem
}

abbr[title], abbr[data-original-title] {
    text-decoration:underline;
    text-decoration:underline dotted;
    cursor:help;
    border-bottom:0
}

address {
    margin-bottom:1rem;
    font-style:normal;
    line-height:inherit
}

ol, ul, dl {
    margin-top:0;
    margin-bottom:1rem
}

ol ol, ul ul, ol ul, ul ol {
    margin-bottom:0
}

dt {
    font-weight:700
}

dd {
    margin-bottom:.5rem;
    margin-left:0
}

blockquote {
    margin:0 0 1rem
}

dfn {
    font-style:italic
}

b, strong {
    font-weight:bolder
}

small {
    font-size:80%
}

sub, sup {
    position:relative;
    font-size:75%;
    line-height:0;
    vertical-align:baseline
}

sub {
    bottom:-.25em
}

sup {
    top:-.5em
}

a {
    color:#fff;
    text-decoration:none;
    background-color:transparent;
    -webkit-text-decoration-skip:objects
}

a:hover {
    color:#7562e0;
    text-decoration:none
}

a:not([href]):not([tabindex]) {
    color:inherit;
    text-decoration:none
}

a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
    color:inherit;
    text-decoration:none
}

a:not([href]):not([tabindex]):focus {
    padding:5px
}

pre, code, kbd, samp {
    font-family:SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size:1em
}

pre {
    margin-top:0;
    margin-bottom:1rem;
    overflow:auto;
    -ms-overflow-style:scrollbar
}

figure {
    margin:0 0 1rem
}

img {
    vertical-align:middle;
    border-style:none
}

svg {
    overflow:hidden;
    vertical-align:middle
}

table {
    border-collapse:collapse
}

caption {
    padding-top:.75rem;
    padding-bottom:.75rem;
    color:#6c757d;
    text-align:left;
    caption-side:bottom
}

th {
    text-align:inherit
}

label {
    display:inline-block;
    margin-bottom:.5rem
}

button {
    border-radius:0
}

button:focus {
    outline:1px dotted;
    outline:5px auto -webkit-focus-ring-color
}

input, button, select, optgroup, textarea {
    margin:0;
    font-family:inherit;
    font-size:inherit;
    line-height:inherit
}

button, input {
    overflow:visible
}

button, select {
    text-transform:none
}

button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance:button
}

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    padding:0;
    border-style:none
}

input[type="radio"], input[type="checkbox"] {
    box-sizing:border-box;
    padding:0
}

input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] {
    -webkit-appearance:listbox
}

textarea {
    overflow:auto;
    resize:vertical
}

fieldset {
    min-width:0;
    padding:0;
    margin:0;
    border:0
}

legend {
    display:block;
    width:100%;
    max-width:100%;
    padding:0;
    margin-bottom:.5rem;
    font-size:1.5rem;
    line-height:inherit;
    color:inherit;
    white-space:normal
}

progress {
    vertical-align:baseline
}

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height:auto
}

[type="search"] {
    outline-offset:-2px;
    -webkit-appearance:none
}

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
    -webkit-appearance:none
}

::-webkit-file-upload-button {
    font:inherit;
    -webkit-appearance:button
}

output {
    display:inline-block
}

summary {
    display:list-item;
    cursor:pointer
}

template {
    display:none
}

[hidden] {
    display:none !important
}

.btn:hover, .btn:focus, .btn:active, .btn:visited, input:hover, input:focus, input:active, input:visited, button:hover, button:focus, button:active, button:visited {
    outline:none;
    box-shadow:none !important;
}

a:focus,
a:active {
    outline:none !important;
}

.zoom-effect {
    transition:transform 0.3s;
}

.zoom-effect:hover {
    transform:scale(1.1);
}

.bold {
    font-weight:bold;
}

.font12 {
    font-size:12px;
}

.font14 {
    font-size:14px;
}

.font16 {
    font-size:16px;
}

.font18 {
    font-size:18px;
}

.font20 {
    font-size:20px;
}

.font22 {
    font-size:22px;
}

.font24 {
    font-size:24px;
}

.font26 {
    font-size:26px;
}

.font28 {
    font-size:28px;
}

.font30 {
    font-size:30px;
}

.font32 {
    font-size:32px;
}

.font36 {
    font-size:36px;
}

.font40 {
    font-size:40px;
}

.font45 {
    font-size:45px;
}

.fontweight4 {
    font-weight:400;
}

.fontweight5 {
    font-weight:500;
}

.fontweight6 {
    font-weight:600;
}

.fontweight7 {
    font-weight:700;
}

.border-radius10 {
    border-radius:10px;
}

.border-radius15 {
    border-radius:15px;
}

.border-radius20 {
    border-radius:30px;
}

.border-radius30 {
    border-radius:30px;
}

.mh100 {
    min-height:100px;
}

.pagination {
    display:inline-block;
    padding-left:0;
    margin:20px 0 0;
    border-radius:4px;
}

.pagination > li {
    display:inline;
}

.pagination > li > a, .pagination > li > span {
    position:relative;
    float:left;
    padding:6px 12px;
    line-height:1.42857;
    text-decoration:none;
    color:#222;
    background-color:#fff;
    border:1px solid #ddd;
    margin-left:-1px;
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left:0;
    border-bottom-left-radius:4px;
    border-top-left-radius:4px;
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-bottom-right-radius:4px;
    border-top-right-radius:4px;
}

.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
    z-index:2;
    color:#23527c;
    background-color:#eee;
    border-color:#ddd;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    z-index:3;
    color:#fff;
    background-color:#7562e0;
    border-color:#595be0;
    cursor:default;
}

.border-purple {
    border-color:#7562e0 !important;
}

.text-purple {
    color:#7562e0;
}

.border-huise {
    border-color:#31313f !important;
}

.bg-huise {
    background-color:#31313f;
}

.bg-purple {
    background-color:#7562e0;
}

.btn-purple {
    color:#fff;
    background-color:#7562e0;
    border-color:#7562e0;
}

.btn-purple:hover {
    color:#fff;
    background-color:#6650c7;
    border-color:#6650c7;
}

.btn-outline-purple {
    color:#7562e0;
    background-color:transparent;
    border-color:#7562e0;
}

.btn-outline-purple:hover {
    color:#fff;
    background-color:#7562e0;
    border-color:#7562e0;
}

/*电脑端*/
@media (min-width:768px) {

}

/*移动端*/
@media (max-width:767px) {
    header .nav-item {
        margin:0 !important;
    }

    header .nav-item .active, header .nav-item .nav-link:hover {
        border-bottom:0 !important;
    }

    header .navbar-nav {
        margin-bottom:10px;
    }

    .full-screen-background-swiper {
        height:auto !important;
        min-height:50vh !important;
        text-align:center;
    }

    .full-screen-background-swiper h4 {
        font-size:18px;
    }

    .full-screen-background-swiper h2 {
        font-size:20px;
    }

    .index-4-box .bg-purple {
        background-color:transparent !important;
    }

    .navbar-toggler {
        color:#fff;
    }

}

header .navbar {
    padding:0;
    margin:0;
}

header .nav-item {
    margin:0 25px;
}

header .nav-item .nav-link {
    padding-left:0 !important;
    padding-right:0 !important;
    font-size:18px;
    color:#fff;
}

header .nav-item .active, header .nav-item .nav-link:hover {
    color:#7562e0 !important;
}

.full-screen-background-swiper {
    background:url('../images/index-swiper-bg.png') no-repeat center right;
    min-height:500px;
    position:relative;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
}

.index-8-box .col {
    margin-bottom:20px;
}

.index-8-box .border-purple:hover {
    background-color:#7562e0;
    cursor:pointer;
}

.index-8-box .border-white:hover {
    background-color:#fff;
    cursor:pointer;
}

.txt-title {
    text-align:center;
    color:#fff;
}

.txt-title h2 {
    color:#fff;
    font-size:24px;
    padding:0 0 15px;
    margin:0 0 10px;
    font-weight:700;
    display:inline-block;
    border-bottom:1px solid #7562e0;
}

.txt-title p {
    font-size:14px;
    color:#fff6;
    font-weight:700;
}

.index-case-box .card {
    position:relative;
    overflow:hidden;
}

.index-case-box .card-title {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    background-color:rgba(0, 0, 0, 0.5);
    color:#fff;
    font-size:20px;
    padding:10px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    margin:0;
}

.index-3-box .col {
    position:relative;
    margin-bottom:30px;
    transition:transform 0.3s ease;
}

.index-3-box .col:hover {
    transform:translateY(-40px);
}

.service-content {
    margin-top:20px;
    text-align:left;
}

.service-content ul {
    list-style-type:none;
    padding:0;
}

.service-content ul li {
    position:relative;
    padding-left:30px;
    margin-bottom:15px;
    font-size:16px;
    font-weight:500;
}

.service-content ul li:before {
    font-family:"iconfont";
    content:"\e837";
    color:#7562e0;
    position:absolute;
    left:0;
    top:0;
}

.index-list-box .service-content ul li {
    margin-bottom:30px;
    font-size:18px;
}

.contact-info {
    display:flex;
    align-items:flex-start;
    margin-bottom:30px;
}

.contact-info .iconfont {
    flex-shrink:0;
}

.contact-info span {
    flex:1;
    white-space:normal;
    align-self:flex-start;
}

.input-placeholder-color::placeholder {
    color:#666 !important;
}

.input-placeholder-color:focus {
    background-color:#31313f;
}

.qr-code {
    text-align:right;
    color:#fff;
}

.qr-code p {
    text-align:center;
    margin-bottom:0;
}

.qr-code img {
    width:100px;
}

.qr-code div {
    display:inline-block;
    margin-right:20px;
    text-align:center;
}

@media (max-width:768px) {
    .drfooter {
        padding-bottom:60px;
    }

    .qr-code {
        text-align:left;
        color:#fff;
        margin:15px 0;
    }

    .my-share-box {
        text-align:left !important;
    }
}

.my-share-box {
    text-align:right;
}

.my-share-box p {
    margin-bottom:20px;
    font-size:18px;
    color:#fff;
    font-family:poppins;
}

.my-share-component .iconfont {
    color:#fff;
    font-size:20px;
    margin:7px;
    height:35px;
    width:35px;
    line-height:35px;
    border:1px solid #ccc;
    display:inline-block;
    border-radius:50%;
    background-color:transparent;
    position:relative;
    text-align:center;
    vertical-align:middle;
    transition:background 0.6s ease-out 0s;
    margin-left:10px;
}

.my-share-component .iconfont:first-child {
    margin-left:0;
}

.my-share-component .iconfont:hover {
    color:#fff;
    font-size:20px;
    border:1px solid #fff;
}

.full-screen-background-about {
    background:url('../images/company-img.png') no-repeat center right;
    min-height:500px;
    position:relative;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
}

.about-title {
    padding-left:8px;
    border-left:4px solid #7562e0;
}

.gallery-item {
    position:relative;
    overflow:hidden;
    margin-bottom:20px;
}

.gallery-item img {
    width:100%;
    height:auto;
    display:block;
    transition:transform 0.5s ease;
}

.gallery-item:hover img {
    transform:scale(1.1);
}

.image-overlay {
    width:100%;
    height:50px;
    line-height:50px;
    text-align:center;
    background-color:rgba(0, 0, 0, 0.66);
    position:absolute;
    left:0;
    bottom:-50px;
    transition:all 0.3s linear;
    z-index:3;
    color:white;
    opacity:0;
}

.gallery-item:hover .image-overlay {
    bottom:0;
    opacity:1;
}

.custom-card {
    border-radius:10px;
    overflow:hidden;
    position:relative;
    width:100%;
    height:500px;
}

.custom-card img {
    width:100%;
    height:auto;
    transition:transform 1.5s ease-out;
    position:absolute;
    left:0;
    top:0;
}

.new-left-box {
    min-height:650px;
}

.new-left-box .top-box {
    position:absolute;
    left:0;
    top:0;
    border-left:50px solid #1a1a29;
    border-bottom:50px solid transparent;
    border-top:50px solid #1a1a29;
    border-right:50px solid transparent
}

.new-left-box .nav-link {
    padding:30px 0;
    font-size:24px;
    font-weight:bold;
    color:#fff;
}

.new-left-box .nav-link:hover, .new-left-box .nav-link.active {
    background-color:#fff;
    color:#7562e0;
}

.new-left-box .nav-link.active:after {
    font-family:"iconfont" !important;
    content:"\e67c";
    font-size:18px;
    font-weight:normal;
}

.news-item a:hover {
    color:#fff;
}

.article-content {
    line-height:1.6;
}

.article-content img {
    display:block;
    max-width:100%;
    height:auto
}

.article-content a {
    color:#003087;
}

body .demo-class .layui-layer-content {
    border-radius:5px !important;
}

body .demo-class .layui-layer-content iframe {
    border-radius:5px !important;
}

body .layui-layer {
    border-radius:5px !important;
}

.qrcodewrap {
    display:none;
    text-align:center;
    color:#222;
}

.qrcodewrap h2 {
    font-size:18px;
    padding:20px 0;
}

.qrcode-container {
    display:inline-block;
    text-align:center;
    margin:0 20px;
}

.qrcode-container img {
    display:block;
    margin:0 auto;
    width:150px;
    height:150px;
}

.qrcode-container p {
    margin:10px 0;
    font-size:14px;
}