* {
    box-sizing:border-box;
    margin:0;
    padding:0
}
html {
    scroll-behavior:smooth
}
body {
    background:#e8ebec;
    color:#101718;
    font-family:Arial,"Microsoft YaHei",sans-serif;
    letter-spacing:0
}
a {
    color:inherit;
    text-decoration:none
}
button {
    color:inherit;
    font:inherit
}
.avero {
    background:#e8ebec;
    border-bottom:2px solid #101718;
    position:sticky;
    top:0;
    z-index:20
}
.buxel {
    align-items:center;
    display:flex;
    height:78px;
    justify-content:space-between;
    margin:auto;
    max-width:1200px;
    padding:0 20px
}
.cavor {
    align-items:center;
    display:flex;
    gap:10px
}
.cavor img {
    height:44px;
    object-fit:contain;
    width:44px
}
.cavor span {
    font-size:16px;
    font-weight:900
}
.cavor b {
    color:#1265d6
}
.durem {
    display:flex;
    gap:21px
}
.durem a {
    font-size:12px
}
.durem a:hover {
    color:#1265d6
}
.mixon {
    align-items:center;
    background:#101718;
    color:#aef238;
    display:inline-flex;
    font-size:12px;
    font-weight:900;
    gap:7px;
    justify-content:center;
    min-height:42px;
    padding:0 16px
}
.nupel {
    background:#1265d6;
    color:#fff;
    overflow:hidden
}
.opire {
    display:grid;
    grid-template-columns:1.08fr .92fr;
    margin:auto;
    max-width:1200px;
    min-height:640px;
    padding:70px 20px 25px
}
.pavor {
    align-self:center;
    max-width:650px;
    z-index:2
}
.quxel {
    color:#aef238;
    font-size:10px;
    font-weight:900
}
.pavor h1 {
    font-size:61px;
    line-height:1.14;
    margin:25px 0 21px
}
.pavor p {
    color:#dbe8fb;
    font-size:16px;
    line-height:1.9;
    max-width:580px
}
.ravel {
    align-items:center;
    display:flex;
    gap:20px;
    margin-top:33px
}
.ravel a {
    align-items:center;
    background:#101718;
    color:#aef238;
    display:inline-flex;
    font-size:15px;
    font-weight:900;
    gap:10px;
    justify-content:center;
    min-height:56px;
    padding:0 24px
}
.ravel span {
    font-size:11px
}
.savor {
    min-height:530px;
    position:relative
}
.tovin {
    background:#101718;
    bottom:-110px;
    padding:10px 10px 0;
    position:absolute;
    right:38px;
    transform:rotate(2deg);
    width:330px
}
.tovin>span {
    color:#aef238;
    display:block;
    font-size:9px;
    padding:4px 0 10px
}
.tovin img {
    display:block;
    height:auto;
    max-width:100%;
    width:100%
}
.uvexa {
    background:#aef238;
    color:#101718;
    left:-15px;
    padding:15px;
    position:absolute;
    top:75px;
    z-index:3
}
.uvexa b,.uvexa span {
    display:block
}
.uvexa span {
    font-size:9px;
    margin-top:4px
}
.wavor {
    background:#aef238;
    color:#101718;
    display:flex;
    gap:70px;
    justify-content:center;
    overflow:hidden;
    padding:14px;
    white-space:nowrap
}
.wavor span {
    font-size:10px;
    font-weight:900
}
.xurem {
    padding:94px 20px
}
.yixel {
    margin:auto;
    max-width:1200px
}
.zapor {
    font-size:34px;
    font-weight:900;
    margin-bottom:44px;
    text-align:center
}
.zapor:after {
    background:#1265d6;
    content:"";
    display:block;
    height:4px;
    margin:11px auto;
    width:50px
}
.abexo {
    display:grid;
    gap:14px;
    grid-template-columns:repeat(4,1fr)
}
.abexo figure {
    background:#fff;
    border:2px solid #101718;
    padding:8px
}
.abexo img {
    display:block;
    height:auto;
    max-width:100%;
    width:100%
}
.abexo figcaption {
    font-size:13px;
    font-weight:900;
    padding:13px 3px 5px
}
.abexo figcaption b {
    color:#1265d6;
    margin-right:8px
}
.becor {
    background:#101718;
    color:#fff
}
.cuvem,.daxor {
    display:grid;
    gap:12px;
    grid-template-columns:repeat(3,1fr)
}
.cuvem article {
    border:1px solid #3d484a;
    min-height:230px;
    padding:23px
}
.cuvem article>div {
    display:flex;
    justify-content:space-between
}
.cuvem i {
    color:#aef238;
    font-size:28px
}
.cuvem span {
    color:#72b2ff;
    font-size:9px
}
.cuvem b,.daxor b,.ivora b {
    display:block;
    font-size:18px;
    margin-top:26px
}
.cuvem p,.daxor p,.ivora p {
    color:#aab4b6;
    font-size:13px;
    line-height:1.8;
    margin-top:10px
}
.daxor article {
    background:#fff;
    border:1px solid #aeb6b8;
    min-height:278px;
    padding:22px;
    position:relative
}
.daxor>article>i {
    color:#1265d6;
    font-size:29px
}
.daxor small {
    float:right;
    font-size:9px
}
.daxor p {
    color:#647174
}
.daxor a {
    background:#101718;
    bottom:0;
    color:#aef238;
    display:flex;
    font-size:11px;
    font-weight:900;
    justify-content:space-between;
    left:0;
    padding:14px 20px;
    position:absolute;
    width:100%
}
.efira {
    background:#aef238
}
.fovel {
    display:grid;
    grid-template-columns:repeat(4,1fr)
}
.fovel article {
    border-right:2px solid #101718;
    padding:0 22px
}
.fovel article:last-child {
    border:0
}
.fovel article>b {
    background:#1265d6;
    color:#fff;
    display:grid;
    height:50px;
    margin-bottom:19px;
    place-items:center;
    width:50px
}
.fovel span {
    font-size:16px;
    font-weight:900
}
.fovel p {
    font-size:12px;
    line-height:1.7;
    margin-top:8px
}
.guvan {
    border-top:2px solid #101718
}
.guvan article {
    border-bottom:2px solid #101718
}
.guvan button {
    align-items:center;
    background:none;
    border:0;
    cursor:pointer;
    display:grid;
    grid-template-columns:60px 1fr 30px;
    min-height:75px;
    text-align:left;
    width:100%
}
.guvan button span {
    color:#1265d6;
    font-size:10px
}
.guvan article>p {
    color:#647174;
    display:none;
    line-height:1.8;
    padding:0 40px 22px 60px
}
.guvan article.vexor>p {
    display:block
}
.guvan article.vexor button i {
    transform:rotate(45deg)
}
.hixor {
    background:#cad9e8
}
.ivora {
    display:grid;
    gap:12px;
    grid-template-columns:repeat(2,1fr)
}
.ivora article {
    background:#fff;
    min-height:225px;
    padding:24px
}
.ivora article>div {
    color:#1265d6;
    display:flex;
    font-size:9px;
    justify-content:space-between
}
.ivora p {
    color:#647174
}
.ivora a {
    color:#1265d6;
    display:inline-block;
    font-size:11px;
    margin-top:17px
}
.jaxel {
    column-count:3;
    column-gap:13px
}
.jaxel article {
    background:#fff;
    border-top:4px solid #1265d6;
    break-inside:avoid;
    margin-bottom:13px;
    padding:21px
}
.jaxel article:nth-child(2n) {
    border-color:#aef238
}
.jaxel article>i {
    color:#1265d6;
    font-size:25px
}
.jaxel article>p {
    font-size:14px;
    line-height:1.9;
    margin:16px 0
}
.jaxel article>div {
    display:flex;
    justify-content:space-between
}
.jaxel time {
    color:#778284;
    font-size:10px
}
.kavor {
    background:#101718;
    color:#fff;
    padding:48px 20px 22px
}
.lupor {
    align-items:center;
    display:flex;
    justify-content:space-between;
    margin:auto;
    max-width:1200px
}
.lupor nav {
    display:flex;
    flex-wrap:wrap;
    gap:15px;
    justify-content:center;
    max-width:600px
}
.lupor nav a {
    color:#aab4b6;
    font-size:11px
}
.kavor>p {
    border-top:1px solid #3d484a;
    color:#6f7b7d;
    font-size:10px;
    margin:38px auto 0;
    max-width:1200px;
    padding-top:18px;
    text-align:center
}
@media(max-width:767px) {
    .buxel {
        height:65px;
        padding:0 14px
    }
    .durem {
        display:none
    }
    .cavor img {
        height:37px;
        width:37px
    }
    .buxel .mixon {
        min-height:36px;
        padding:0 10px
    }
    .opire {
        display:block;
        min-height:790px;
        padding:54px 14px 0
    }
    .pavor h1 {
        font-size:38px;
        margin:20px 0 16px
    }
    .pavor p {
        font-size:14px
    }
    .ravel {
        align-items:stretch;
        flex-direction:column;
        gap:14px;
        margin-top:27px
    }
    .ravel a {
        width:100%
    }
    .savor {
        min-height:380px
    }
    .tovin {
        bottom:-120px;
        right:0;
        width:230px
    }
    .uvexa {
        left:0;
        top:55px
    }
    .wavor {
        gap:30px;
        justify-content:flex-start
    }
    .xurem {
        padding:68px 14px
    }
    .zapor {
        font-size:27px;
        margin-bottom:33px
    }
    .abexo {
        display:flex;
        gap:11px;
        overflow-x:auto;
        padding-bottom:18px;
        scroll-snap-type:x mandatory
    }
    .abexo figure {
        flex:0 0 78%;
        scroll-snap-align:start
    }
    .cuvem,.daxor,.ivora {
        grid-template-columns:1fr
    }
    .cuvem article {
        min-height:215px
    }
    .daxor article {
        min-height:268px
    }
    .fovel {
        display:block
    }
    .fovel article {
        border-bottom:2px solid #101718;
        border-right:0;
        padding:21px 0
    }
    .guvan button {
        grid-template-columns:45px 1fr 28px
    }
    .guvan article>p {
        padding:0 28px 21px 45px
    }
    .ivora article>div {
        align-items:flex-start;
        flex-direction:column;
        gap:5px
    }
    .jaxel {
        column-count:1
    }
    .jaxel article>div {
        align-items:flex-start;
        flex-direction:column;
        gap:7px
    }
    .lupor {
        align-items:stretch;
        flex-direction:column;
        gap:24px
    }
    .lupor nav {
        justify-content:flex-start
    }
    .lupor .mixon {
        width:100%
    }
}
