.container-v0SK {
    color: #fff;
    display: -webkit-flex;
    display: -moz-box;
    display: flex
}

@media screen and (max-width: 767px) {
    .container-v0SK {
        display:block
    }
}

@media screen and (min-width: 768px) {
    .container-v0SK {
        background:-webkit-gradient(linear,left top,right top,from(#1664ff),color-stop(50%,#1664ff),color-stop(50%,#1a1c1f),to(#1a1c1f));
        background: -webkit-linear-gradient(left,#1664ff,#1664ff 50%,#1a1c1f 0,#1a1c1f);
        background: -moz-linear-gradient(left,#1664ff 0,#1664ff 50%,#1a1c1f 50%,#1a1c1f 100%);
        background: linear-gradient(90deg,#1664ff,#1664ff 50%,#1a1c1f 0,#1a1c1f)
    }
}

@media screen and (min-width: 1024px)and (max-width:1679px) {
    .container-v0SK {
        height:389px
    }
}

@media screen and (min-width: 1680px) {
    .container-v0SK {
        height:448px;
    }
}

.middleDecorate-IFvd {
    background: -webkit-linear-gradient(6deg,#1664ff,#1664ff 49.9%,#1a1c1f 50.1%,#1a1c1f);
    background: -moz-linear-gradient(6deg,#1664ff 0,#1664ff 49.9%,#1a1c1f 50.1%,#1a1c1f 100%);
    background: linear-gradient(84deg,#1664ff,#1664ff 49.9%,#1a1c1f 50.1%,#1a1c1f)
}

@media screen and (min-width: 768px)and (max-width:1023px) {
    .middleDecorate-IFvd {
        height:256px;
        width: 44px
    }
}

@media screen and (min-width: 1024px) {
    .middleDecorate-IFvd {
        height:100%;
        width: 44px
    }
}

@media screen and (min-width: 1680px) {
    .middleDecorate-IFvd {
        width:48px
    }
}

.halfPart-Nr0A {
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    position: relative
}

@media screen and (max-width: 767px) {
    .halfPart-Nr0A {
        height:256px;
        padding: 20px 20px 15px;
        width: 100vw
    }
}

@media screen and (min-width: 768px) {
    .halfPart-Nr0A {
        -moz-box-flex:1;
        -webkit-flex: 1 1;
        flex: 1 1;
        width: 0
    }
}

@media screen and (min-width: 768px)and (max-width:1023px) {
    .halfPart-Nr0A {
        height:256px;
        padding: 24px 24px 22px
    }
}

@media screen and (min-width: 1024px)and (max-width:1439px) {
    .contentWrap-YHoz {
        margin-top:64px
    }

    .contentWrap-YHoz.left-qHGf {
        -webkit-align-self: flex-end;
        align-self: flex-end;
        margin-right: 32px;
        width: 546px
    }

    .contentWrap-YHoz.right-xh32 {
        margin-left: 58px;
        width: 518px
    }
}

@media screen and (min-width: 1440px)and (max-width:1679px) {
    .contentWrap-YHoz {
        margin-top:64px
    }

    .contentWrap-YHoz.left-qHGf {
        -webkit-align-self: flex-end;
        align-self: flex-end;
        margin-right: 32px;
        width: 586px
    }

    .contentWrap-YHoz.right-xh32 {
        margin-left: 58px;
        width: 560px
    }
}

@media screen and (min-width: 1680px) {
    .contentWrap-YHoz {
        margin-top:84px
    }

    .contentWrap-YHoz.left-qHGf {
        -webkit-align-self: flex-end;
        align-self: flex-end;
        margin-right: 32px;
        width: 666px
    }

    .contentWrap-YHoz.right-xh32 {
        margin-left: 58px;
        width: 638px
    }
}

.linkButton-lhzc {
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -moz-box-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    border-radius: 4px;
    color: #fff;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column
}

.linkButton-lhzc:hover .volcfe-home-arrow {
    right: -5px
}

.linkButton-lhzc .titleLink-iQF7 {
    -moz-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: -moz-box;
    display: flex
}

@media screen and (max-width: 1023px) {
    .linkButton-lhzc .titleLink-iQF7 {
        font-size:12px;
        line-height: 26px;
        margin-bottom: 4px;
        margin-top: 12px
    }
}

@media screen and (max-width: 1023px)and (max-width:767px) {
    .linkButton-lhzc .titleLink-iQF7 {
        margin-bottom:4px
    }
}

@media screen and (min-width: 1024px) {
    .linkButton-lhzc .titleLink-iQF7 {
        font-size:16px;
        line-height: 36px;
        margin-bottom: 12px
    }
}

.linkButton-lhzc .title-dhUm {
    font-weight: 500
}

@media screen and (max-width: 1023px) {
    .linkButton-lhzc .title-dhUm {
        font-size:18px;
        line-height: 26px
    }
}

@media screen and (min-width: 1024px) {
    .linkButton-lhzc .title-dhUm {
        font-size:30px;
        line-height: 38px
    }
}

.linksWrap-zdQ9 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr
}

@media screen and (max-width: 1023px) {
    .linksWrap-zdQ9 {
        grid-column-gap:8px;
        grid-row-gap: 8px
    }
}

@media screen and (min-width: 1024px) {
    .linksWrap-zdQ9 {
        grid-column-gap:16px;
        grid-row-gap: 16px
    }
}

@media screen and (max-width: 767px) {
    .linksWrap-zdQ9 {
        margin-top:36px
    }
}

@media screen and (min-width: 768px)and (max-width:1023px) {
    .linksWrap-zdQ9 {
        margin-top:36px
    }
}

@media screen and (min-width: 1024px)and (max-width:1679px) {
    .linksWrap-zdQ9 {
        margin-top:46px
    }
}

@media screen and (min-width: 1680px) {
    .linksWrap-zdQ9 {
        margin-top:54px
    }
}

.link-KGxo {
    background: hsla(0,0%,100%,.04);
    border: 1px solid hsla(0,0%,100%,.2);
    border-radius: 4px;
    color: #fff;
    display: block;
    text-align: center
}

.link-KGxo:hover {
    background: hsla(0,0%,100%,.1);
    border: 1px solid hsla(0,0%,100%,.4)
}

@media screen and (max-width: 1023px) {
    .link-KGxo {
        font-size:12px;
        height: 40px;
        line-height: 40px
    }
}

@media screen and (min-width: 1024px) {
    .link-KGxo {
        font-size:16px;
        height: 54px;
        line-height: 54px
    }
}

.ecoItemWrap-D5mU {
    display: -webkit-flex;
    display: -moz-box;
    display: flex
}

@media screen and (max-width: 767px) {
    .ecoItemWrap-D5mU {
        margin:36px 0
    }
}

@media screen and (min-width: 768px)and (max-width:1023px) {
    .ecoItemWrap-D5mU {
        margin:36px 0
    }
}

@media screen and (min-width: 1024px)and (max-width:1679px) {
    .ecoItemWrap-D5mU {
        margin:46px 0
    }
}

@media screen and (min-width: 1680px) {
    .ecoItemWrap-D5mU {
        margin:54px 0
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x {
    -moz-box-flex: 1;
    cursor: pointer;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex: 1 1;
    flex: 1 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

@media screen and (max-width: 1023px) {
    .ecoItemWrap-D5mU .clickZone-ha9x {
        height:74px
    }
}

@media screen and (min-width: 1024px) {
    .ecoItemWrap-D5mU .clickZone-ha9x {
        height:134px
    }

    .ecoItemWrap-D5mU .clickZone-ha9x:hover .image-yT2I {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1)
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ {
    -moz-box-flex: 1;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    color: #fff;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-flex: 1 1;
    flex: 1 1;
    -webkit-flex-direction: column;
    flex-direction: column;
    margin-left: 24px;
    position: relative
}

@media screen and (max-width: 1023px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ {
        margin-left:16px
    }
}

@media screen and (min-width: 1024px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ {
        height:100%;
        margin-right: 40px
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .title-dhUm {
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
    margin-bottom: 4.3px
}

@media screen and (min-width: 1024px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .title-dhUm {
        font-size:18px;
        line-height: 26px;
        margin-bottom: 8px
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .text-U1BN {
    -webkit-line-clamp: 3;
    /*! autoprefixer: off */
    -webkit-box-orient: vertical;
    display: -webkit-box;
    font-size: 12px;
    line-height: 16.8px;
    opacity: .8;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (min-width: 1024px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .text-U1BN {
        -webkit-line-clamp:2;
        font-size: 14px;
        line-height: 22px
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .detail-pkbm {
    border: 1px solid #fff;
    border-radius: 4px;
    bottom: 0;
    color: #fff;
    display: block;
    font-weight: 500;
    height: 32px;
    line-height: 30px;
    position: absolute;
    text-align: center;
    width: 85px
}

.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .detail-pkbm:hover {
    background: hsla(0,0%,100%,.2)
}

.ecoItemWrap-D5mU .clickZone-ha9x .imageWrap-f1M9 {
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    height: 100%;
    overflow: hidden;
    position: relative
}

@media screen and (max-width: 1023px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .imageWrap-f1M9 {
        width:132px
    }
}

@media screen and (min-width: 1024px) {
    .ecoItemWrap-D5mU .clickZone-ha9x .imageWrap-f1M9 {
        width:240px
    }
}

.ecoItemWrap-D5mU .clickZone-ha9x .imageWrap-f1M9 .image-yT2I {
    height: 100%;
    opacity: 1;
    pointer-events: all;
    position: relative;
    -webkit-transition: opacity .8s ease,-webkit-transform .25s ease;
    transition: opacity .8s ease,-webkit-transform .25s ease;
    -o-transition: opacity .8s ease,-o-transform .25s ease;
    -moz-transition: transform .25s ease,opacity .8s ease,-moz-transform .25s ease;
    transition: transform .25s ease,opacity .8s ease;
    transition: transform .25s ease,opacity .8s ease,-webkit-transform .25s ease,-moz-transform .25s ease,-o-transform .25s ease;
    width: 100%
}

.ecoItemWrap-D5mU .clickZone-ha9x .imageWrap-f1M9 .image-yT2I.notCurrent-uVhw {
    opacity: 0;
    pointer-events: none;
    position: absolute
}

.ecoItemWrap-D5mU .clickZone-ha9x .animationContainer-kIxd {
    height: 100%;
    position: relative;
    width: 100%
}

.ecoItemWrap-D5mU .clickZone-ha9x .animationContainer-kIxd .animateItem-y4oG {
    height: 100%;
    opacity: 0;
    position: absolute;
    width: 100%
}

.buttonsWrap-sY32 {
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column
}

.button-C3Lf,.buttonsWrap-sY32 {
    -moz-box-align: center;
    -moz-box-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center
}

.button-C3Lf {
    border: 1px solid #fff;
    border-radius: 16px;
    cursor: pointer;
    height: 32px;
    width: 32px
}

.button-C3Lf:hover {
    background: hsla(0,0%,100%,.2)
}

.button-C3Lf.disabled-TeBH {
    cursor: default;
    opacity: .5
}

.button-C3Lf.disabled-TeBH:hover {
    background: transparent
}

.indicator-KPif {
    font-size: 12px;
    line-height: 20px;
    margin: 8px 0
}

.tab-item-wrap-Ivvl {
    display: -webkit-flex;
    display: -moz-box;
    display: flex
}

@media(min-width: 1024px) {
    .tab-item-wrap-Ivvl {
        margin:0 auto
    }
}

@media(max-width: 767px) {
    .tab-item-wrap-Ivvl {
        overflow-x:scroll;
        padding: 0 12px 32px;
        scrollbar-width: none
    }

    .tab-item-wrap-Ivvl::-webkit-scrollbar {
        display: none
    }
}

@media(min-width: 768px)and (max-width:1023px) {
    .tab-item-wrap-Ivvl {
        -moz-box-pack:center;
        -webkit-justify-content: center;
        justify-content: center;
        padding: 0 12px 32px
    }
}

@media(min-width: 1024px)and (max-width:1439px) {
    .tab-item-wrap-Ivvl {
        padding:0 40px 79px;
        width: 1281px
    }
}

@media(min-width: 1440px)and (max-width:1679px) {
    .tab-item-wrap-Ivvl {
        padding-bottom:64px;
        width: 1201px
    }
}

@media(min-width: 1680px) {
    .tab-item-wrap-Ivvl {
        padding-bottom:64px;
        width: 1279px
    }
}

.card-wrap-jUCY {
    border-radius: 8px;
    box-shadow: 0 4px 60px rgba(0,28,85,.04);
    cursor: default;
    display: block;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    height: 534px;
    margin-left: 32px;
    overflow: hidden;
    position: relative;
    width: 405px
}

.card-wrap-jUCY.clickable-B2Da {
    cursor: pointer
}

@media(max-width: 1679px) {
    .card-wrap-jUCY {
        height:513px;
        width: 380px
    }
}

@media(max-width: 1023px) {
    .card-wrap-jUCY {
        height:362px;
        margin-left: 8px;
        width: -webkit-calc(33.33333% - 5.33333px);
        width: -moz-calc(33.33333% - 5.33333px);
        width: calc(33.33333% - 5.33333px)
    }
}

@media(max-width: 767px) {
    .card-wrap-jUCY {
        height:396px;
        width: 300px
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:not(:hover) .data-list-p2kH {
        display:none
    }

    .card-wrap-jUCY:hover {
        box-shadow: 0 4px 20px rgba(0,28,85,.12)
    }

    .card-wrap-jUCY:hover .bg-rDlQ {
        -webkit-transform: translate(1%,1%);
        -moz-transform: translate(1%,1%);
        -o-transform: translate(1%,1%);
        transform: translate(1%,1%);
        -webkit-transition: 0s .5s;
        -o-transition: 0s .5s;
        -moz-transition: 0s .5s;
        transition: 0s .5s;
        -webkit-transition-property: width,-webkit-transform;
        transition-property: width,-webkit-transform;
        -o-transition-property: width,-o-transform;
        -moz-transition-property: width,transform,-moz-transform;
        transition-property: width,transform;
        transition-property: width,transform,-webkit-transform,-moz-transform,-o-transform;
        width: 98%
    }
}

@media(min-width: 1024px)and (min-width:1024px) {
    .card-wrap-jUCY:hover .card-title-fThD {
        margin:20px 0 18px
    }
}

@media(min-width: 1024px)and (min-width:1680px) {
    .card-wrap-jUCY:hover .card-title-fThD {
        margin:32px 0 24px
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .card-bottom-heMS {
        background:-webkit-gradient(linear,left top,left bottom,color-stop(.33%,hsla(0,0%,100%,.9)),color-stop(22.5%,#fff));
        background: -webkit-linear-gradient(top,hsla(0,0%,100%,.9) .33%,#fff 22.5%);
        background: -moz-linear-gradient(top,hsla(0,0%,100%,.9) .33%,#fff 22.5%);
        background: linear-gradient(180deg,hsla(0,0%,100%,.9) .33%,#fff 22.5%);
        top: 0
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .logo-eLmc {
        margin-top:28px
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .detail-long-d7i0 {
        display:block
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .just-hidden-EyVd {
        display:-webkit-box
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .detail-short-Gvaa {
        display:none
    }
}

@media(min-width: 1024px) {
    .card-wrap-jUCY:hover .detail-more-pvJN {
        display:inline
    }
}

.card-wrap-jUCY:first-child {
    margin-left: 0
}

.card-bottom-heMS {
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    background: -webkit-gradient(linear,left top,left bottom,from(hsla(0,0%,100%,.8)),color-stop(17.97%,#fff));
    background: -webkit-linear-gradient(top,hsla(0,0%,100%,.8),#fff 17.97%);
    background: -moz-linear-gradient(top,hsla(0,0%,100%,.8) 0,#fff 17.97%);
    background: linear-gradient(180deg,hsla(0,0%,100%,.8),#fff 17.97%);
    border-radius: 8px;
    height: 100%;
    left: 0;
    overflow: hidden;
    padding: 0 32px;
    position: absolute;
    top: 200px;
    -webkit-transition: top .5s;
    -o-transition: top .5s;
    -moz-transition: top .5s;
    transition: top .5s;
    width: 100%;
    z-index: 0
}

@media(max-width: 1679px) {
    .card-bottom-heMS {
        top:193px
    }
}

@media(max-width: 1023px) {
    .card-bottom-heMS {
        padding:0 20px;
        top: 128px
    }
}

@media(max-width: 767px) {
    .card-bottom-heMS {
        top:158px
    }
    
    .container-v0SK {
    background: -webkit-gradient(linear, left top, left bottom, from(#1664ff), color-stop(50%, #1664ff), color-stop(50%, #1a1c1f), to(#1a1c1f));
    background: -webkit-linear-gradient(top, #1664ff, #1664ff 50%, #1a1c1f 0, #1a1c1f);
    background: -moz-linear-gradient(top, #1664ff 0, #1664ff 50%, #1a1c1f 50%, #1a1c1f 100%);
    background: linear-gradient(0deg, #1664ff, #1664ff 50%, #1a1c1f 0, #1a1c1f);
}


}





.volcfe-home-arrow {
    border-right: 2px solid;
    border-top: 2px solid;
    color: #1664ff;
    display: inline-block;
    height: 1em;
    position: relative;
    right: 0;
    -webkit-transform: rotate(45deg) scale(.5);
    -moz-transform: rotate(45deg) scale(.5);
    -o-transform: rotate(45deg) scale(.5);
    transform: rotate(45deg) scale(.5);
    -webkit-transition: right .3s;
    -o-transition: right .3s;
    -moz-transition: right .3s;
    transition: right .3s;
    width: 1em
}

@media screen and (max-width: 1023px) {
    .volcfe-home-arrow {
        font-size:13px
    }
}

@media screen and (min-width: 1024px) {
    .volcfe-home-arrow {
        font-size:16px
    }
}

@media screen and (min-width: 768px) {
    .volcfe-home-hover-arrow-trigger:hover .volcfe-home-hover-arrow {
        display:inline-block
    }
}

.volcfe-home-hover-arrow {
    display: none;
    height: 1px;
    position: relative;
    width: 1px
}

.volcfe-home-hover-arrow:after {
    background: no-repeat 50%/100% 100% url(https://portal.volccdn.com/obj/volcfe/home/arrowright.svg);
    content: "";
    display: block;
    height: 14px;
    position: absolute;
    right: -18px;
    top: -12.5px;
    width: 14px
}


.ecoItemWrap-D5mU .clickZone-ha9x .ecoItemContent-aQHQ .detail-pkbm {
    display: none;
}

.animateItem-y4oG {
    display: flex;
    align-items: center;
}

.ecoItemWrap-D5mU {
    align-items: center;
}