.container.svelte-sy0j6l.svelte-sy0j6l {
    padding: 64px 40px 48px;
    border-radius: 16px;
    border: 1px rgba(15,15,16,.1) solid;
    position: relative;
    margin-bottom: 72px;
    margin-top: 72px;
    background-color: #fff;
    overflow: hidden
}

.container.svelte-sy0j6l .container-line {
    z-index: -1;
    top: -72px;
    bottom: -72px
}

@media (max-width: 767.98px) {
    .container.svelte-sy0j6l.svelte-sy0j6l {
        padding:40px 16px
    }
}

.icons.svelte-sy0j6l.svelte-sy0j6l {
    position: absolute;
    top: 12px;
    right: 0;
    height: 164px;
    width: 856px
}

@media (max-width: 767.98px) {
    .icons.svelte-sy0j6l.svelte-sy0j6l {
        top:6px;
        width: 514px
    }
}

.icons.svelte-sy0j6l img.svelte-sy0j6l {
    width: 100%
}

.title.svelte-sy0j6l.svelte-sy0j6l {
    max-width: 960px
}

.title.svelte-sy0j6l .main.svelte-sy0j6l {
    color: var(--primary-blue);
    font-size: 16px;
    line-height: 24px
}

@media (max-width: 767.98px) {
    .title.svelte-sy0j6l .main.svelte-sy0j6l {
        font-size:13px;
        line-height: var(--line-height-h4)
    }
}

.title.svelte-sy0j6l .sub.svelte-sy0j6l {
    color: var(--color-text-primary);
    font-size: 40px;
    font-weight: 700;
    line-height: 56px;
    word-wrap: break-word;
    margin-top: 8px
}

@media (max-width: 767.98px) {
    .title.svelte-sy0j6l .sub.svelte-sy0j6l {
        font-size:var(--font-size-h2);
        line-height: var(--line-height-h4)
    }
}

.content.svelte-sy0j6l.svelte-sy0j6l {
    display: flex;
    flex-wrap: wrap;
    margin-top: 48px;
    gap: 16px 32px
}

@media (max-width: 767.98px) {
    .content.svelte-sy0j6l.svelte-sy0j6l {
        margin-top:32px;
        gap: 0px
    }
}

.content.svelte-sy0j6l .item.svelte-sy0j6l {
    padding: 8px 24px 8px 0;
    width: calc((100% - 32px)/2);
    min-height: 108px
}

@media (max-width: 767.98px) {
    .content.svelte-sy0j6l .item.svelte-sy0j6l {
        flex-basis:100%;
        display: flex;
        align-items: flex-start;
        padding: 8px 0;
        min-height: 62px
    }
}

.content.svelte-sy0j6l .item .item-icon.svelte-sy0j6l {
    width: 40px;
    height: 40px
}

@media (max-width: 767.98px) {
    .content.svelte-sy0j6l .item .item-icon.svelte-sy0j6l {
        flex-shrink:0;
        margin-right: 16px
    }
}

.content.svelte-sy0j6l .item .intro-content.svelte-sy0j6l {
    margin-top: 8px
}

.content.svelte-sy0j6l .item .intro-content.svelte-sy0j6l .pm-btn {
    color: var(--primary-blue);
    margin-top: 12px
}

.content.svelte-sy0j6l .item .item-title.svelte-sy0j6l {
    line-height: 32px;
    font-size: 20px;
    color: var(--color-text-primary)
}

@media (max-width: 767.98px) {
    .content.svelte-sy0j6l .item .item-title.svelte-sy0j6l {
        font-size:15px;
        line-height: var(--line-height-h4);
        margin-bottom: 8px
    }
}

.content.svelte-sy0j6l .item .item-desc.svelte-sy0j6l {
    line-height: 24px;
    font-size: 16px;
    color: var(--color-text-secondary)
}

@media (max-width: 767.98px) {
    .content.svelte-sy0j6l .item .item-desc.svelte-sy0j6l {
        font-size:13px;
        line-height: var(--line-height-h4)
    }
}

.container.svelte-128r68s.svelte-128r68s {
    position: relative;
    margin-bottom: 72px;
    align-items: center;
    display: flex
}

.container.svelte-128r68s .container-line {
    display: none;
    z-index: -1;
    top: -72px;
    bottom: -72px
}

.title.svelte-128r68s.svelte-128r68s {
    max-width: 960px
}

.content.svelte-128r68s.svelte-128r68s {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 50%
}

@media (max-width: 767.98px) {
    .content.svelte-128r68s.svelte-128r68s {
        width:100%
    }
}

.intro.svelte-128r68s.svelte-128r68s {
    padding: 16px 16px 16px 32px;
    display: flex
}

@media (max-width: 767.98px) {
    .intro.svelte-128r68s.svelte-128r68s {
        padding:8px 0
    }
}

.intro.svelte-128r68s .intro-icon.svelte-128r68s {
    width: 56px;
    height: 56px;
    background-color: #f3f4f6;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.intro.svelte-128r68s .intro-icon.svelte-128r68s img {
    width: 40px;
    height: 40px
}

@media (max-width: 767.98px) {
    .intro.svelte-128r68s .intro-icon.svelte-128r68s {
        width:48px;
        height: 48px
    }
}

.intro.svelte-128r68s .intro-content.svelte-128r68s {
    margin-left: 16px
}

.intro.svelte-128r68s .intro-content.svelte-128r68s .pm-btn {
    color: var(--primary-blue);
    margin-top: 12px
}

.intro.svelte-128r68s .intro-content .intro-content-title.svelte-128r68s {
    line-height: 32px;
    font-size: 20px;
    color: var(--color-text-primary)
}

@media (max-width: 767.98px) {
    .intro.svelte-128r68s .intro-content .intro-content-title.svelte-128r68s {
        font-size:15px;
        line-height: normal
    }
}

.intro.svelte-128r68s .intro-content .intro-content-desc.svelte-128r68s {
    line-height: 24px;
    font-size: 16px;
    color: var(--color-text-secondary)
}

@media (max-width: 767.98px) {
    .intro.svelte-128r68s .intro-content .intro-content-desc.svelte-128r68s {
        font-size:13px;
        line-height: normal
    }
}

.box-container.svelte-128r68s.svelte-128r68s {
    justify-content: center;
    align-items: center;
    display: flex;
    width: 50%;
    flex-direction: column;
    height: 624px
}

@media (max-width: 767.98px) {
    .box-container.svelte-128r68s.svelte-128r68s {
        display:none
    }
}

.box.svelte-128r68s.svelte-128r68s {
    margin: 0 auto;
    min-height: 0;
    display: flex;
    align-items: center
}

.box.svelte-128r68s .box-wrap.svelte-128r68s {
    position: relative
}

.box.svelte-128r68s .prismatic.svelte-128r68s {
    width: 266px;
    height: 266px;
    transform: rotate(-45deg) rotate3d(1,1,0,54deg);
    border-radius: 8px 10px 8px 14px;
    box-shadow: -12px 12px 12px #0000001a;
    border: 1px rgba(15,15,16,.15) solid;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px)
}

.box.svelte-128r68s .text.svelte-128r68s {
    width: 67%;
    text-align: center;
    position: absolute;
    top: 58%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-text-primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: opacity 1s ease;
    font-family: ABeeZee
}

.box.svelte-128r68s .text .decorate.svelte-128r68s {
    margin-bottom: 8px
}

.box.svelte-128r68s:hover .prismatic.svelte-128r68s {
    background: linear-gradient(225deg,#014fe6,#00b2ff)!important
}

.box.svelte-128r68s:hover .text.svelte-128r68s {
    color: var(--bg)!important
}