.custom-x5-p2{position:relative;z-index:4;background:#fff}.custom-x5-p1-p3{position:relative;width:100%}.custom-x5-p1-video-container{width:100%;position:relative}.custom-x5-p1-video-shell{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:12}.custom-x5-p1-video-shell video{width:100%;height:100%;object-fit:cover}@media screen and (max-width:767px){.custom-x5-p1{position:relative}.custom-x5-p1-p3{margin-top:64px}.pc-shell{display:none}.h5-shell{display:block}.custom-x5-p1-text-shell{position:absolute;left:0;bottom:0;top:0;width:100%;display:flex;justify-content:flex-end;align-items:center;flex-direction:column;z-index:19;padding:48px 40px;box-sizing:border-box}.custom-x5-p1-text-content{width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:24px;transition:all .5s ease;transform:translateY(50%)}.custom-x5-p1-text-content.active{transform:translateY(0)}.custom-x5-p1-title{font-size:40px;line-height:60px;color:#fff;font-family:var( --pp-semi-bold);text-align:center;margin-bottom:0}.custom-x5-p1-sub_title{font-size:14px;line-height:20px;color:#fff;font-family:var(--pp-medium);text-align:center;margin:4px 0 0}.custom-x5-p1-text-link{display:block;background:#fff;height:40px;padding:10px 20px;line-height:20px;font-size:14px;color:#000;font-family:var(--pp-regular);border-radius:28px;transition:all .7s ease .2s;opacity:0}.custom-x5-p1-text-content.active .custom-x5-p1-text-link{opacity:1}.custom-x5-p2{margin-top:28px;padding:0 20px;position:relative}.custom-x5-p2-title{font-family:var(--pp-medium);font-size:28px;line-height:40px;letter-spacing:0%;text-align:start;color:#000;margin:0}.custom-x5-p2-title span{color:#f55302}.custom-x5-p2-desc{font-family:var(--pp-regular);font-size:14px;line-height:20px;letter-spacing:0%;text-align:start;white-space:nowrap;margin:4px 0 0}.custom-x5-p2-desc span{margin:0}.custom-x5-p2-imgs-shell{padding-top:60px;width:100%;position:sticky;overflow:hidden;top:0;border-radius:16px}.custom-x5-p2-imgs-top{position:relative;height:80px;width:100%}.custom-x5-p2-scroll-item-icon{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:80px;opacity:0;transition:all .3s ease;z-index:1}.custom-x5-p2-scroll-item-icon.active{opacity:1;z-index:19}.custom-x5-p2-scroll-item-icon svg{width:auto;height:32px}.custom-x5-p2-scroll-item-icon p{width:auto;height:32px;margin-top:16px;margin-bottom:0;font-family:var(--pp-medium);font-size:18px;line-height:32px;letter-spacing:0%;text-align:start;color:#000}.custom-x5-p2-scroll{padding-top:32px;width:100%;box-sizing:border-box}.custom-x5-p2-scroll-item{width:100%;flex-shrink:0;margin:0 auto;position:relative;overflow:hidden}.custom-x5-p2-img-list{position:absolute;top:0;right:0;left:0;width:100%;height:100%;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:row;flex-wrap:nowrap}.custom-x5-p2-img-item{width:100%;height:100%;position:absolute;top:0;bottom:0;right:0;left:0;flex-shrink:0;opacity:0;transition:all .3s linear;transform:translate(-20px)}.custom-x5-p2-img-item.active{opacity:1;transform:translate(0)}.custom-x5-p2-scroll-item picture{width:100%;position:relative;top:-24px}.custom-x5-p2-progress{position:absolute;height:40px;left:0;right:0;bottom:24px;display:flex;justify-content:center;align-items:center;gap:12px;width:100%;z-index:10}.custom-x5-p2-scroll-btn{width:40px;height:40px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;border:.5px solid #E6E6E6;overflow:hidden}.custom-x5-p2-scroll-btn svg{width:42px;height:42px;display:none}.custom-x5-p2-scroll-btn svg.pause{width:42px;height:42px}.custom-x5-p2-scroll-btn.play svg.play{display:block}.custom-x5-p2-scroll-btn.pause svg.pause{display:block}.custom-x5-p2-scroll-btn.replay svg.pause{display:block}.custom-x5-p2-progress-bar{border:.5px solid #E6E6E6;padding:16px 18px;display:flex;justify-content:center;align-items:center;gap:12px;border-radius:28px;background:#fff}.custom-x5-p2-progress-bar-item{width:8px;height:8px;background:#e6e6e6;border-radius:8px;overflow:hidden;transition:width .3s linear}.custom-x5-p2-progress-bar-item.active{width:40px;border-radius:18px}.custom-x5-p2-progress-bar-item-bg{width:100%;height:100%;background:#999;border-radius:18px;transform:translate(-101%)}.custom-x5-p2-progress-bar-item.active.animate .custom-x5-p2-progress-bar-item-bg{transform:translate(0);transition:all 5s linear}.custom-x5-p3{width:100%;padding:48px 0;position:relative;overflow:hidden;transform:translateY(50%);transition:all .7s ease .2s;opacity:.2}.custom-x5-p3.active{opacity:1;transform:translateY(0)}.custom-x5-p3-title{text-align:center;font-family:var(--pp-medium);font-size:24px;line-height:27px;letter-spacing:0%;color:#000;margin:0;padding:0 20px}.custom-x5-p3-sub_title{text-align:center;font-family:var(--pp-regular);font-size:14px;line-height:20px;letter-spacing:0%;color:#000;margin:16px 0 0;padding:0 20px}}@media(min-width:475px)and (max-width:1359px){#main .layout-p.custom-x5-p2-shell{padding-left:64px;padding-right:64px}}@media screen and (min-width:768px){.custom-x5-p1{position:sticky;top:0;z-index:1}.custom-x5-p1-p3{margin-top:96px}.custom-x5-p1-p3.active{background:#f6f6f6}.pc-shell{display:block}.h5-shell{display:none}.custom-x5-p1-text-shell{position:absolute;left:0;bottom:0;top:0;width:100%;display:flex;justify-content:flex-end;align-items:flex-start;flex-direction:column;z-index:19;padding:96px 0;box-sizing:border-box}.custom-x5-p1-text-content{width:100%;display:flex;justify-content:space-between;align-items:flex-end;gap:80px;transition:all .5s ease;transform:translateY(50%)}.custom-x5-p1-text-content.active{transform:translateY(0)}.custom-x5-p1-text-left{flex:1}.custom-x5-p1-text-link{display:block;background:#fff;height:48px;padding:12px 24px;line-height:24px;font-size:16px;color:#000;font-family:var(--pp-regular);border-radius:28px;transition:all .7s ease .2s;opacity:0}.custom-x5-p1-text-content.active .custom-x5-p1-text-link{opacity:1}.custom-x5-p1-title{font-size:56px;line-height:64px;color:#fff;font-family:var( --pp-semi-bold);text-align:start;margin-bottom:0}.custom-x5-p1-sub_title{margin:12px 0 0;font-size:18px;line-height:20px;color:#fff;font-family:var(--pp-medium);text-align:start}.custom-x5-p2-shell{display:flex;flex-direction:row;justify-content:center;box-sizing:border-box;width:100%;--pt-shell: 10vh;--height-shell: 80vh}.custom-x5-p2-left{height:200vh;position:relative;width:480px;flex-shrink:0;padding-inline-end:40px}.custom-x5-p2-position{display:flex;justify-content:flex-start;flex-direction:column;align-items:flex-start;position:sticky;top:0;padding-top:var(--pt-shell);padding-bottom:var(--pt-shell);height:100vh;gap:10vh}.custom-x5-p2-title{font-family:var( --pp-semi-bold);font-size:48px;line-height:71px;letter-spacing:0%;text-align:start;color:#000;margin-bottom:0}.custom-x5-p2-title span{color:#f55302}.custom-x5-p2-desc{font-family:var(--pp-regular);font-size:16px;line-height:20px;letter-spacing:0%;text-align:start;margin-top:1px;margin-bottom:0}.custom-x5-p2-desc span{margin:0 2px}.custom-x5-p2-triple{width:440px}.custom-x5-p2-shell.one .custom-x5-p2-triple p.p-one,.custom-x5-p2-shell.two .custom-x5-p2-triple p.p-two,.custom-x5-p2-shell.three .custom-x5-p2-triple p.p-three{opacity:1}.custom-x5-p2-triple p{width:100%;font-family:var(--pp-medium);font-size:20px;line-height:32px;letter-spacing:0%;color:#000;opacity:.2;display:flex;align-items:center}.custom-x5-p2-triple span{display:block;width:100%;height:1px;background:#000;margin:48px 0;opacity:.1}.custom-x5-p2-triple p svg{height:40px;margin-inline-end:23px;width:96.14px}.custom-x5-p2-text-link{display:block;background:#000;height:48px;padding:12px 24px;line-height:24px;font-size:16px;color:#fff;font-family:var(--pp-regular);border-radius:28px}.custom-x5-p2-right{width:var(--height-shell);height:400vh;position:relative;z-index:2;padding-top:var(--pt-shell)}.custom-x5-p2-img-list-wrap{width:100%;position:sticky;top:var(--pt-shell);height:var(--height-shell);width:var(--height-shell);transition:all .5s ease;transform:translateY(30%)}.custom-x5-p2-img-list-wrap.active{transform:translateY(0)}.custom-x5-p2-img-shell{height:var(--height-shell);width:var(--height-shell);position:relative}.custom-x5-p2-img-shell figure{position:absolute;left:0;right:0;bottom:0;top:0;height:100%;width:100%;opacity:0;transform:translate(-15%);transition:all .5s ease}.custom-x5-p2-img-shell figure img{position:absolute;left:0;right:0;bottom:0;top:0;height:100%;width:100%}.custom-x5-p2-shell.one .custom-x5-p2-img-shell figure.custom-x5-p2-img-one{opacity:1;transform:translate(0)}.custom-x5-p2-shell.two .custom-x5-p2-img-shell figure.custom-x5-p2-img-two{opacity:1;transform:translate(0)}.custom-x5-p2-shell.two .custom-x5-p2-img-shell figure.custom-x5-p2-img-one{opacity:0;transform:translate(15%)}.custom-x5-p2-shell.three .custom-x5-p2-img-shell figure.custom-x5-p2-img-three{opacity:1;transform:translate(0)}.custom-x5-p2-shell.three .custom-x5-p2-img-shell figure.custom-x5-p2-img-two{opacity:0;transform:translate(15%)}.custom-x5-p2-empty{width:0;height:calc(400vh + 100px)}.custom-x5-p3{position:absolute;bottom:-1px;height:calc(100vh + 1px);width:100%}.custom-x5-p3-shell{width:100%;height:100%;position:relative}.custom-x5-p1-p3.active .custom-x5-p2{background:#f6f6f6}.custom-x5-p3-text{position:absolute;left:0;bottom:0;padding-bottom:160px;width:100%;margin:auto;transition:all .5s ease;display:flex;justify-content:center;align-items:center;flex-direction:column;z-index:99}.custom-x5-p3-shell.active .custom-x5-p3-text{transform:translateY(0)}.custom-x5-p3-title{font-family:var(--pp-semi-bold);font-size:48px;line-height:56px;letter-spacing:0;text-align:center;color:#000;width:1071px;margin:auto}.custom-x5-p3-sub_title{font-family:var(--pp-regular);margin-top:24px;font-size:18px;line-height:26px;letter-spacing:0;text-align:center;color:#000}.custom-x5-p3-text-link{height:48px;margin-top:48px;background:#000;color:#fff;padding:12px 24px;border-radius:28px;font-family:var(--pp-regular);font-size:16px;line-height:24px;letter-spacing:0%;opacity:0}.custom-x5-p3-text.active .custom-x5-p3-text-link{opacity:1;transition:all .6s ease .1s}.custom-x5-p2-center{position:relative;width:0px;height:calc(300vh + 336px)}.custom-x5-p3-svg{position:sticky;top:166px;width:682px;height:171px;opacity:0;transform:translate(40px);transition:all .5s ease}.custom-x5-p3-svg.active,.custom-x5-p1-p3.active .custom-x5-p3-svg{opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/45/assets/custom-x5-p1.css.map */